This commit is contained in:
hzz 2024-04-11 19:01:19 +08:00
parent 65ec6ad84f
commit 9bc2e73e84
16 changed files with 725 additions and 334 deletions

View File

@ -42,3 +42,10 @@ export function delQuality(id) {
method: 'delete'
})
}
// 获取合格率
export function qualitystandardRate() {
return request({
url: '/casm/qualitystandardRate',
method: 'get'
})
}

View File

@ -3,7 +3,7 @@ import request from '@/utils/request'
// 获取首页数据
export function getHomeDeviceInfoVO() {
return request({
url: '/home',
url: '/casm/device/getHomeDeviceInfo',
method: 'get'
})
}

View File

@ -0,0 +1,23 @@
@font-face {
font-family: "iconfont"; /* Project id 4503445 */
src: url('iconfont.woff2?t=1712819070350') format('woff2'),
url('iconfont.woff?t=1712819070350') format('woff'),
url('iconfont.ttf?t=1712819070350') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-shengchanxiaoshuai:before {
content: "\e612";
}
.icon-zhinengjiaju:before {
content: "\e61c";
}

Binary file not shown.

Binary file not shown.

Binary file not shown.

BIN
src/assets/images/frj.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 KiB

View File

@ -2,11 +2,14 @@
<section class="app-main">
<router-view v-slot="{ Component, route }">
<transition name="fade-transform" mode="out-in">
<div :key="route.path">
<keep-alive :include="tagsViewStore.cachedViews">
<component v-if="!route.meta.link" :is="Component" :key="route.path" />
</keep-alive>
</div>
</transition>
</router-view>
<iframe-toggle />
</section>
</template>
@ -65,4 +68,3 @@ const tagsViewStore = useTagsViewStore()
border-radius: 3px;
}
</style>

View File

@ -56,19 +56,22 @@ import {
CanvasRenderer
} from 'echarts/renderers'
import {
PieChart
PieChart,LineChart
} from 'echarts/charts'
import {
TitleComponent,
TooltipComponent,
LegendComponent
LegendComponent,
GridComponent
} from 'echarts/components'
use([
CanvasRenderer,
PieChart,
TitleComponent,
TooltipComponent,
LegendComponent
LegendComponent,
GridComponent,
PieChart,
LineChart,
]);

View File

@ -2,43 +2,51 @@
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item :label="tLang('device', '设备名称')" prop="name">
<el-input v-model="queryParams.name" :placeholder="tLang('common','请输入') + tLang('device','设备名称')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.name" :placeholder="tLang('common', '请输入') + tLang('device', '设备名称')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('device', '设备编码')" prop="code">
<el-input v-model="queryParams.code" :placeholder="tLang('common','请输入') + tLang('device','设备编码')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.code" :placeholder="tLang('common', '请输入') + tLang('device', '设备编码')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('device', '车间名称')" prop="workShop">
<el-input v-model="queryParams.workShop" :placeholder="tLang('common','请输入') + tLang('device','车间名称')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.workShop" :placeholder="tLang('common', '请输入') + tLang('device', '车间名称')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('device', '产线名称')" prop="lineName">
<el-input v-model="queryParams.lineName" :placeholder="tLang('common','请输入') + tLang('device','产线名称')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.lineName" :placeholder="tLang('common', '请输入') + tLang('device', '产线名称')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('device', '保养周期')" prop="maintenance">
<el-input v-model="queryParams.maintenance" :placeholder="tLang('common','请输入') + tLang('device','保养周期')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.maintenance" :placeholder="tLang('common', '请输入') + tLang('device', '保养周期')"
clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('device', '供货商名称')" prop="supplier">
<el-input v-model="queryParams.supplier" :placeholder="tLang('common','请输入') + tLang('device','供货商名称')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.supplier" :placeholder="tLang('common', '请输入') + tLang('device', '供货商名称')"
clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('device', '供货商联络人')" prop="supplierContactPerson">
<el-input v-model="queryParams.supplierContactPerson" :placeholder="tLang('common','请输入') + tLang('device','供货商联络人')" clearable
@keyup.enter="handleQuery" />
<el-input v-model="queryParams.supplierContactPerson"
:placeholder="tLang('common', '请输入') + tLang('device', '供货商联络人')" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('device', '生产厂家')" prop="manufacturer">
<el-input v-model="queryParams.manufacturer" :placeholder="tLang('common','请输入') + tLang('device','生产厂家')" clearable
@keyup.enter="handleQuery" />
<el-input v-model="queryParams.manufacturer" :placeholder="tLang('common', '请输入') + tLang('device', '生产厂家')"
clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('device', '联系电话')" prop="contactPhone">
<el-input v-model="queryParams.contactPhone" :placeholder="tLang('common','请输入') + tLang('device','联系电话')" clearable
@keyup.enter="handleQuery" />
<el-input v-model="queryParams.contactPhone" :placeholder="tLang('common', '请输入') + tLang('device', '联系电话')"
clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('device', '品牌')" prop="brand">
<el-input v-model="queryParams.brand" :placeholder="tLang('common','请输入') + tLang('device','品牌')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.brand" :placeholder="tLang('common', '请输入') + tLang('device', '品牌')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<!-- <el-form-item :label="针数" prop="needleNum">
<el-input v-model="queryParams.needleNum" :placeholder="tLang('common','请输入') + 针数" clearable @keyup.enter="handleQuery" />
</el-form-item> -->
<el-form-item :label="tLang('device', '设备型号')" prop="model">
<el-input v-model="queryParams.model" :placeholder="tLang('common','请输入') + tLang('device','设备型号')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.model" :placeholder="tLang('common', '请输入') + tLang('device', '设备型号')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="search" size="mini" @click="handleQuery">{{ tLang('common', '搜索') }}</el-button>
@ -48,8 +56,8 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="plus" size="mini" @click="handleAdd"
v-hasPermi="['device:device:add']">{{ $t('common.新增') }}</el-button>
<el-button type="primary" plain icon="plus" size="mini" @click="handleAdd" v-hasPermi="['device:device:add']">{{
$t('common.新增') }}</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="edit" size="mini" :disabled="single" @click="handleUpdate"
@ -76,7 +84,8 @@
<el-table-column :label="tLang('device', '产线名称')" align="center" v-if="columns[4].visible" prop="lineName" />
<el-table-column :label="tLang('device', '保养周期')" align="center" v-if="columns[5].visible" prop="maintenance" />
<el-table-column :label="tLang('device', '供货商名称')" align="center" v-if="columns[6].visible" prop="supplier" />
<el-table-column :label="tLang('device','供货商联络人')" align="center" v-if="columns[7].visible" prop="supplierContactPerson" />
<el-table-column :label="tLang('device', '供货商联络人')" align="center" v-if="columns[7].visible"
prop="supplierContactPerson" />
<el-table-column :label="tLang('device', '生产厂家')" align="center" v-if="columns[8].visible" prop="manufacturer" />
<el-table-column :label="tLang('device', '联系电话')" align="center" v-if="columns[9].visible" prop="contactPhone" />
<el-table-column :label="tLang('device', '品牌')" align="center" v-if="columns[10].visible" prop="brand" />
@ -100,8 +109,12 @@
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<div class="pagination">
<el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
@current-change="getList" />
</div>
<!-- 添加或修改设备信息对话框 -->
<el-dialog :title="title" v-model="open" width="800px" append-to-body>
@ -128,7 +141,8 @@
<el-input v-model="form.supplier" :placeholder="tLang('common', '请输入') + tLang('device', '供货商名称')" />
</el-form-item>
<el-form-item :label="tLang('device', '供货商联络人')" prop="supplierContactPerson">
<el-input v-model="form.supplierContactPerson" :placeholder="tLang('common','请输入') + tLang('device','供货商联络人')" />
<el-input v-model="form.supplierContactPerson"
:placeholder="tLang('common', '请输入') + tLang('device', '供货商联络人')" />
</el-form-item>
<el-form-item :label="tLang('device', '生产厂家')" prop="manufacturer">
<el-input v-model="form.manufacturer" :placeholder="tLang('common', '请输入') + tLang('device', '生产厂家')" />
@ -378,4 +392,12 @@ onMounted(() => {
.demo-form-inlinee :deep(.el-select) {
--el-select-width: 220px;
}
.pagination {
width: 100%;
margin: 10px;
display: flex;
justify-content: center;
align-items: center;
}
</style>

View File

@ -1,53 +1,298 @@
<template>
<div class="app-container">
<el-row :gutter="10" class="mb8">
<el-col :span="3">
<div class="card-box">
员工总数200
</div>
</el-col>
<el-col :span="3">
<div class="card-box">
产出进度60%
</div>
</el-col>
</el-row>
<v-chart class="chart" :option="option" />
<div class="chart-content">
<div class="chart-content-card">
<v-chart class="line-chart" :option="line_option" />
</div>
<div class="chart-content-card">
<v-chart class="line-chart" :option="pie_option" />
</div>
<div class="right-content-card">
<div>20/70</div>
<div>设备使用中/总数</div>
</div>
</div>
<div class="bottom">
<div class="device-item" v-for="(item, index) in produceList" :style="{'background-color':item_bgcolor[item.state]}">
<span class="iconfont icon-shengchanxiaoshuai icon-style" :style="{color:item_color[item.progressSignal],borderColor:item_color[item.progressSignal]}"></span>
<div class="device-item-content">
<div class="device-item-content-flex left">
<img class="frj-img" :src="item.file" alt="">
<span>设备编号{{ item.deviceCode }}</span>
</div>
<div class="device-item-content-flex right">
<ul class="produce-list">
<li>工作人员{{ item.userName }}</li>
<li>加工信息{{ item.productionCode }}</li>
<li>产量{{item.output}}/{{ item.planOutput }}</li>
<li>稼动率{{ item.activation }}</li>
</ul>
</div>
</div>
</div>
</div>
<div class="pagination">
<el-pagination :hide-on-single-page="false" v-model:current-page="queryParams.pageNum"
v-model:page-size="queryParams.pageSize" layout="total, prev, pager, next, jumper" :total="total"
@size-change="getList" @current-change="getList" />
</div>
</div>
</template>
<script setup>
import { getHomeDeviceInfoVO } from "@/api/home";
const option = ref({
let loading = ref(true)
//
let queryParams = reactive({
pageNum: 1,
pageSize: 10,
})
const baseUrl = import.meta.env.VITE_APP_BASE_API;
let total = ref(0)
let produceList = ref([])
let item_bgcolor = {
0: '#E8E8E8',
1: '#E9E5C9',
2: '#C9F6CC',
3: '#E9E5C9',
4: '#EFCAC5',
}
let item_color = {
0: '#5EF417',
1: '#176AF4',
2: '#DACB71',
3: '#D81E06',
4: '#CCCCCC',
}
const line_option = ref({
title: {
text: "Traffic Sources",
left: "center"
text: '产量'
},
tooltip: {
trigger: "item",
formatter: "{a} <br/>{b} : {c} ({d}%)"
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
legend: {
orient: "vertical",
left: "left",
data: ["Direct", "Email", "Ad Networks", "Video Ads", "Search Engines"]
yAxis: {
type: 'value'
},
series: [
{
name: "Traffic Sources",
type: "pie",
radius: "55%",
center: ["50%", "60%"],
data: [
{ value: 335, name: "Direct" },
{ value: 310, name: "Email" },
{ value: 234, name: "Ad Networks" },
{ value: 135, name: "Video Ads" },
{ value: 1548, name: "Search Engines" }
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)"
}
}
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line',
smooth: true
}
]
});
const pie_option = ref({
"title": {
"text": "设备利用率60%",
"left": "0",
"top": 0,
"textStyle": {
"color": "#333",
"fontSize": 24
}
},
tooltip: {
trigger: 'item'
},
legend: {
bottom: '5%',
},
series: [
{
name: 'Access From',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
padAngle: 5,
itemStyle: {
borderRadius: 10
},
label: {
show: true,
},
data: [
{ value: 1048, name: 'Search Engine' },
{ value: 735, name: 'Direct' },
{ value: 580, name: 'Email' },
{ value: 484, name: 'Union Ads' },
{ value: 300, name: 'Video Ads' }
]
}
]
})
function getList() {
loading.value = true;
getHomeDeviceInfoVO().then(response => {
produceList.value = response.rows.map((item, index) => {
item.file = baseUrl + item.file;
return item;
});
total.value = response.total;
// loading.value = false;
});
}
onMounted(() => {
getList();
})
</script>
<style scoped>
.chart {
height: 400px;
<style scoped lang="scss">
@import '@/assets/iconfont/iconfont.css';
.card-box {
background-color: #C8EAF4;
border-radius: 4px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
padding: 5px 5px;
text-align: center;
font-size: 18px;
font-weight: 700;
color: #333333;
}
.chart-content {
width: 100%;
height: 310px;
box-sizing: border-box;
display: flex;
justify-content: space-between;
align-items: center;
.chart-content-card {
width: 40%;
height: 100%;
.line-chart {
width: 100%;
height: 100%;
}
}
.right-content-card {
width: 200px;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 18px;
font-weight: 700;
color: #333333;
div {
margin-bottom: 10px;
}
}
}
.bottom {
width: 100%;
height: calc(100vh - 310px - 110px);
display: grid;
grid-template-columns: 16.66% 16.66% 16.66% 16.66% 16.66% 16.66%;
grid-template-rows: 50% 50%;
/* 设置网格项目间间隙 */
gap: 10px 10px;
.device-item {
width: 100%;
height: 100%;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);
text-align: center;
padding:8px 2px 2px 2px;
box-sizing: border-box;
.icon-style {
font-size: 30px;
border: 2px solid;
border-radius: 50%;
padding: 10px;
line-height: 50px;
/*color: #bfc;*/
}
.device-item-content {
width: calc(100% - 4px);
height: calc(100% - 50px - 4px);
display: flex;
justify-content: center;
align-items: center;
font-size: 14px;
.left {
width: 50%;
}
.right {
flex: 1;
font-size: 12px;
}
.device-item-content-flex {
height: 100%;
box-sizing: border-box;
padding: 10px 0;
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
overflow: hidden;
.frj-img {
max-width: 100%;
max-height: 70%;
margin-bottom: 5px;
}
.produce-list {
padding: 0;
margin: 0 0 0 15px;
width: 100%;
height: 100%;
display: flex;
justify-content: space-around;
align-items: flex-start;
flex-direction: column;
li {
list-style: none;
}
}
}
}
}
}
.pagination {
width: 100%;
margin: 10px;
display: flex;
justify-content: center;
align-items: center;
}
</style>

View File

@ -3,24 +3,28 @@
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
label-width="68px">
<el-form-item :label="tLang('produce', '产品编码')" prop="productionCode">
<el-input v-model="queryParams.productionCode" :placeholder="tLang('common','请输入') + tLang('produce','产品编码')" clearable
<el-input v-model="queryParams.productionCode"
:placeholder="tLang('common', '请输入') + tLang('produce', '产品编码')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('produce', '设备编码')" prop="deviceCode">
<el-input v-model="queryParams.deviceCode" :placeholder="tLang('common','请输入') + tLang('produce','设备编码')" clearable
<el-input v-model="queryParams.deviceCode"
:placeholder="tLang('common', '请输入') + tLang('produce', '设备编码')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('produce', '员工编号')" prop="persionCode">
<el-input v-model="queryParams.persionCode" :placeholder="tLang('common','请输入') + tLang('produce','员工编号')" clearable
<el-input v-model="queryParams.persionCode"
:placeholder="tLang('common', '请输入') + tLang('produce', '员工编号')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('produce', '目标产量')" prop="planOutput">
<el-input v-model="queryParams.planOutput" :placeholder="tLang('common','请输入') + tLang('produce','目标产量')" clearable
<el-input v-model="queryParams.planOutput"
:placeholder="tLang('common', '请输入') + tLang('produce', '目标产量')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('produce', '当前产量')" prop="output">
<el-input v-model="queryParams.output" :placeholder="tLang('common','请输入') + tLang('produce','当前产量')" clearable
@keyup.enter="handleQuery" />
<el-input v-model="queryParams.output" :placeholder="tLang('common', '请输入') + tLang('produce', '当前产量')"
clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('produce', '开始时间')" prop="starttime">
<el-date-picker clearable v-model="queryParams.starttime" type="datetime" format="YYYY-MM-DD hh:mm:ss"
@ -33,10 +37,12 @@
</el-date-picker>
</el-form-item>
<el-form-item label="tLang('produce','批次')" prop="batch">
<el-input v-model="queryParams.batch" :placeholder="tLang('common','请输入') + tLang('produce','批次')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.batch" :placeholder="tLang('common', '请输入') + tLang('produce', '批次')"
clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="search" size="mini" @click="handleQuery">{{tLang('common','搜索')}}</el-button>
<el-button type="primary" icon="search" size="mini"
@click="handleQuery">{{ tLang('common', '搜索') }}</el-button>
<el-button icon="refresh" size="mini" @click="resetQuery">{{ tLang('common', '重置') }}</el-button>
</el-form-item>
</el-form>
@ -62,17 +68,23 @@
<el-table v-loading="loading" :data="produceList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column type="index" :label="tLang('common', '序号')" width="60" align="center" />
<el-table-column :label="tLang('produce','产品编码')" v-if="columns[0].visible" align="center" prop="productionCode" />
<el-table-column :label="tLang('produce','设备编码')" v-if="columns[1].visible" align="center" prop="deviceCode" />
<el-table-column :label="tLang('produce','员工编号')" v-if="columns[2].visible" align="center" prop="persionCode" />
<el-table-column :label="tLang('produce','目标产量')" v-if="columns[3].visible" align="center" prop="planOutput" />
<el-table-column :label="tLang('produce', '产品编码')" v-if="columns[0].visible" align="center"
prop="productionCode" />
<el-table-column :label="tLang('produce', '设备编码')" v-if="columns[1].visible" align="center"
prop="deviceCode" />
<el-table-column :label="tLang('produce', '员工编号')" v-if="columns[2].visible" align="center"
prop="persionCode" />
<el-table-column :label="tLang('produce', '目标产量')" v-if="columns[3].visible" align="center"
prop="planOutput" />
<el-table-column :label="tLang('produce', '当前产量')" v-if="columns[4].visible" align="center" prop="output" />
<el-table-column :label="tLang('produce','开始时间')" v-if="columns[5].visible" align="center" prop="starttime" width="180">
<el-table-column :label="tLang('produce', '开始时间')" v-if="columns[5].visible" align="center" prop="starttime"
width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.starttime, '{y}-{m}-{d} {hh}:{mm}:{ss}') }}</span>
</template>
</el-table-column>
<el-table-column :label="tLang('produce','结束时间')" v-if="columns[6].visible" align="center" prop="endtime" width="180">
<el-table-column :label="tLang('produce', '结束时间')" v-if="columns[6].visible" align="center" prop="endtime"
width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.endtime, '{y}-{m}-{d} {hh}:{mm}:{ss}') }}</span>
</template>
@ -97,8 +109,12 @@
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" />
<div class="pagination">
<el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
@current-change="getList" />
</div>
<AddEdit :title="title" v-model="open" :form="form" @submitForm="submitForm"></AddEdit>
<InfoVue v-model="infoDialog" :info="produceinfo" />
@ -241,8 +257,10 @@ function reset() {
/**详情按钮操作 */
function handleInfo(row) {
produceinfo.value = row
infoDialog.value = true
getOutputInfo(row.id).then(response => {
produceinfo.value = response.data;
infoDialog.value = true;
});
}
/** 修改按钮操作 */
@ -271,4 +289,12 @@ onMounted(() => {
})
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.pagination {
width: 100%;
margin: 10px;
display: flex;
justify-content: center;
align-items: center;
}
</style>

View File

@ -2,22 +2,24 @@
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item :label="tLang('product', '产品编码')" prop="code">
<el-input v-model="queryParams.code" :placeholder="tLang('common','请输入') + tLang('product','产品编码')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.code" :placeholder="tLang('common', '请输入') + tLang('product', '产品编码')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('product', '针号')" prop="needleNum">
<el-input v-model="queryParams.needleNum" :placeholder="tLang('common','请输入') + tLang('product','针号')" clearable @keyup.enter="handleQuery" />
<el-input v-model="queryParams.needleNum" :placeholder="tLang('common', '请输入') + tLang('product', '针号')" clearable
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('product', '面线信息')" prop="surfacelineId">
<el-input v-model="queryParams.surfacelineId" :placeholder="tLang('common','请输入') + tLang('product','面线信息')" clearable
@keyup.enter="handleQuery" />
<el-input v-model="queryParams.surfacelineId" :placeholder="tLang('common', '请输入') + tLang('product', '面线信息')"
clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('product', '底线信息')" prop="bottomlineId">
<el-input v-model="queryParams.bottomlineId" :placeholder="tLang('common','请输入') + tLang('product','底线信息')" clearable
@keyup.enter="handleQuery" />
<el-input v-model="queryParams.bottomlineId" :placeholder="tLang('common', '请输入') + tLang('product', '底线信息')"
clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('product', '梭芯信息')" prop="shuttlecoreId">
<el-input v-model="queryParams.shuttlecoreId" :placeholder="tLang('common','请输入') + tLang('product','梭芯信息')" clearable
@keyup.enter="handleQuery" />
<el-input v-model="queryParams.shuttlecoreId" :placeholder="tLang('common', '请输入') + tLang('product', '梭芯信息')"
clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="search" size="mini" @click="handleQuery">{{ tLang('common', '搜索') }}</el-button>
@ -50,7 +52,8 @@
<el-table-column :label="tLang('product', '产品编码')" align="center" v-if="columns[0].visible" prop="code" />
<el-table-column :label="tLang('product', '针号')" align="center" v-if="columns[1].visible" prop="needleNum" />
<el-table-column :label="tLang('product', '面线信息')" align="center" v-if="columns[2].visible" prop="surfacelineId" />
<el-table-column :label="tLang('product','底线信息')" align="center" width="80" v-if="columns[3].visible" prop="bottomlineId" />
<el-table-column :label="tLang('product', '底线信息')" align="center" width="80" v-if="columns[3].visible"
prop="bottomlineId" />
<el-table-column :label="tLang('product', '梭芯信息')" align="center" v-if="columns[4].visible" prop="shuttlecoreId" />
<el-table-column :label="tLang('product', '排序')" align="center" v-if="columns[5].visible" prop="sort" />
<el-table-column :label="tLang('product', '最小值')" align="center" v-if="columns[6].visible" prop="min" />
@ -71,8 +74,12 @@
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<div class="pagination">
<el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
@current-change="getList" />
</div>
<AddEdit :title="title" v-model="open" :form="form" @submitForm="submitForm"></AddEdit>
</div>
</template>
@ -248,4 +255,12 @@ onMounted(() => {
})
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.pagination {
width: 100%;
margin: 10px;
display: flex;
justify-content: center;
align-items: center;
}
</style>

View File

@ -45,9 +45,7 @@
<el-table-column :label="tLang('product', '产品编码')" align="center" v-if="columns[2].visible" prop="code" />
<el-table-column :label="tLang('product', '二维码')" align="center" v-if="columns[2].visible" prop="code">
<template #default="scope">
<el-button type="primary" @click="getProductQRCode(scope.row.code)">{{ tLang('product', '查看')
}}</el-button>
<el-button type="warning" @click="downloadQRCode(scope.row.code)">{{ tLang('product', '下载')
<el-button type="primary" @click="getProductQRCode(scope.row.code)">{{ tLang('product', '下载')
}}</el-button>
</template>
</el-table-column>
@ -69,14 +67,19 @@
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<div class="pagination">
<el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
@current-change="getList" />
</div>
<AddEdit :title="title" v-model="open" :form="form" @submitForm="submitForm"></AddEdit>
<InfoVue v-model="infoDialog" :info="productinfo" />
<el-image-viewer v-if="showImagePreview" :url-list="showsrcListref" hide-on-click-modal teleported
@close="closePreview" style="z-index: 3000" />
</div>
<canvas ref="myCanvas" width="350" height="250" style="display: none;"></canvas>
</template>
<script setup>
@ -123,48 +126,52 @@ let showImagePreview = ref(false)
function closePreview() {
showImagePreview.value = false
}
let myCanvas = ref(null)
let ctx = null
function getProductQRCode(code) {
getQRCode({ code }).then(response => {
if (response.code == 200) {
let base64Image = response.data
//
var newWindow = window.open('', '_blank');
//
if (newWindow) {
newWindow.href = base64Image
newWindow.document.write(`
<div style="width:100%;height:100%;display:flex;flex-direction: column;justify-content:center;align-items:center;">
<img src="${base64Image}" alt="Image" style="align:center;" />
<button style="width: 100px;height: 40px;border-radius: 10px;background: #67c23a;border: none;color: #fff;" onclick="window.print()">打印</button>
</div>
`);
} else {
alert('无法打开新窗口。请允许弹出窗口。');
}
// showsrcListref.value = [response.data]
// showImagePreview.value = true
const qrCodeURL = response.data.base64
let list = JSON.parse(response.data.content)
console.log(list);
ctx = myCanvas.value.getContext('2d');
//
const qrImage = new Image();
qrImage.onload = function () {
ctx.drawImage(qrImage, 30, 10, 200, 200); //
addListInfo(list);
};
qrImage.src = qrCodeURL;
}
});
//
function addListInfo(list) {
ctx.font = "12px Arial";
ctx.fillStyle = "black";
Object.keys(list).forEach((key,index) => {
ctx.fillText(key +':'+ list[key], 240, 30 + index * 20); //
});
downloadImage();
}
//
function downloadQRCode(code) {
getQRCode({ code }).then(response => {
if (response.code == 200) {
let base64Image = response.data
// a
var a = document.createElement('a');
a.href = base64Image;
//
var event = new MouseEvent('click');
// a
a.download = code + '.png';
// a
a.dispatchEvent(event);
//
function downloadImage() {
const image = myCanvas.value.toDataURL("image/png").replace("image/png", "image/octet-stream");
const link = document.createElement('a');
link.download = code + '.png';
link.href = image;
link.click();
}
});
}
//
const columns = ref([
{ key: 0, label: proxy.tLang('product', '产品名称'), visible: true },
@ -283,4 +290,12 @@ onMounted(() => {
})
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.pagination {
width: 100%;
margin: 10px;
display: flex;
justify-content: center;
align-items: center;
}
</style>

View File

@ -2,10 +2,12 @@
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item :label="tLang('product', '产品编码')" prop="code">
<el-input v-model="queryParams.code" :placeholder="tLang('common','请输入') + tLang('product','产品编码')" clearable @keyup.enter.native="handleQuery" />
<el-input v-model="queryParams.code" :placeholder="tLang('common', '请输入') + tLang('product', '产品编码')" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item :label="tLang('product', '步骤')" prop="step">
<el-input v-model="queryParams.step" :placeholder="tLang('common','请输入') + tLang('product','步骤')" clearable @keyup.enter.native="handleQuery" />
<el-input v-model="queryParams.step" :placeholder="tLang('common', '请输入') + tLang('product', '步骤')" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="search" size="mini" @click="handleQuery">{{ tLang('common', '搜索') }}</el-button>
@ -51,8 +53,12 @@
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<div class="pagination">
<el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
@current-change="getList" />
</div>
<AddEdit :title="title" v-model="open" :form="form" @submitForm="submitForm"></AddEdit>
</div>
</template>
@ -210,4 +216,12 @@ onMounted(() => {
})
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.pagination {
width: 100%;
margin: 10px;
display: flex;
justify-content: center;
align-items: center;
}
</style>

View File

@ -49,12 +49,12 @@
</el-form>
<el-row :gutter="20" class="mb8">
<el-col :span="2">
<el-statistic :title="tLang('quality', '产品合格率')" :value="66" :value-style="{ color: 'green' }"
:formatter="(val) => { return val + '%' }" />
<el-statistic :title="tLang('quality', '产品合格率')" :value="qualifiedRate" :precision="1" :value-style="{ color: 'green' }"
:formatter="(val) => { return ((val/total)*100).toFixed(1) + '%' }" />
</el-col>
<el-col :span="2">
<el-statistic :title="tLang('quality', '产品不合格率')" :value="66" :value-style="{ color: 'red' }"
:formatter="(val) => { return val + '%' }" />
<el-statistic :title="tLang('quality', '产品不合格率')" :value="unqualifiedRate" :precision="1" :value-style="{ color: 'red' }"
:formatter="(val) => { return ((val/total)*100).toFixed(1) + '%' }" />
</el-col>
<el-col :span="2">
<el-statistic :title="tLang('quality', '产品完成量')" :value="total" />
@ -90,7 +90,7 @@
<span>{{ parseTime(scope.row.endtime, '{y}-{m}-{d} {hh}:{mm}:{ss}') }}</span>
</template>
</el-table-column>
<el-table-column :label="tLang('quality', '状态')" v-if="columns[7].visible" align="center" prop="batch" />
<el-table-column :label="tLang('quality', '状态')" v-if="columns[7].visible" align="center" prop="state" />
<!-- <el-table-column :label="tLang('quality','')操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="详情" placement="top" v-if="scope.row.userId !== 1">
@ -109,8 +109,12 @@
</el-table-column> -->
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" />
<div class="pagination">
<el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
@current-change="getList" />
</div>
</div>
@ -118,7 +122,7 @@
<script setup>
import { ref, reactive, watch, onMounted } from 'vue'
import { listQuality } from "@/api/casm/quality";
import { listQuality,qualitystandardRate } from "@/api/casm/quality";
const { proxy } = getCurrentInstance();
//
@ -162,10 +166,17 @@ const columns = ref([
{ key: 7, label: proxy.tLang('quality', '状态'), visible: true },
]);
let qualifiedRate = ref(1)
let unqualifiedRate = ref(1)
/** 查询设备信息列表 */
function getList() {
loading.value = true;
qualitystandardRate().then(response => {
if (response.code === 200) {
qualifiedRate.value = response.data.on
unqualifiedRate.value = response.data.off
}
})
listQuality(queryParams).then(response => {
qualityList.value = response.rows;
total.value = response.total;
@ -202,4 +213,12 @@ onMounted(() => {
})
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.pagination {
width: 100%;
margin: 10px;
display: flex;
justify-content: center;
align-items: center;
}
</style>