Merge branch 'projects/mesxc-test' of git.picaiba.com:mt-fe-group/yudao-dev into projects/mesxc-test
This commit is contained in:
commit
60dd76f165
@ -1 +1,14 @@
|
|||||||
<svg class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="200" height="200"><defs><style/></defs><path d="M459.954 607.201h233.734c14.352 0 25.941-11.088 25.941-24.799 0-13.623-11.588-24.71-25.941-24.71H459.954c-14.353 0-25.987 11.087-25.987 24.71 0 13.71 11.634 24.8 25.987 24.8zm-77.937 217.186l287.564-.272v-.634c9.37-1.494 16.66-9.233 16.66-19.054 0-9.773-7.29-17.694-16.66-19.233v-.633H369.5c-27.275 0-51.95-38.47-51.95-65.215V303.761c.182-1.041.634-1.992.634-3.123 0-10.997-8.985-20.003-20.032-20.003-11.023 0-20.01 9.007-20.01 20.003v418.708c0 54.037 48.939 105.04 103.875 105.04zm311.67-734.462c-3.235 0-311.669-.814-311.669-.814-51.292 0-96.314 39.1-102.108 88.294-.182 1.086-.657 2.037-.657 3.169 0 .09.023.135.023.18 0 .047-.023.09-.023.182h.067c.181 10.86 9.032 19.685 19.942 19.685 10.933 0 19.762-8.825 19.965-19.685h.226c6.044-24.665 27.028-52.044 50.048-52.044h284.755c-.406 60.46 0 118.435 0 118.435 0 54.532 35.992 91.642 91.36 91.642h90.428v380.377c.338 44.261-33.703 65.758-62.18 65.215v.272c-10.23.723-18.426 9.188-18.426 19.594 0 10.454 8.196 18.737 18.426 19.417v.272c.248 0 .498-.092.746-.092.184 0 .34.092.522.092.972 0 1.812-.408 2.74-.545 52.288-3.755 97.58-52.314 97.58-104.225V299.778L693.688 89.925zm51.928 209.853c-27.684 0-51.927-51.412-51.927-78.7V142.377l129.839 157.4h-77.912zM459.955 483.47h233.733c14.352 0 25.941-11.041 25.941-24.709 0-13.667-11.588-24.754-25.941-24.754H459.954c-14.353 0-25.987 11.087-25.987 24.754 0 13.669 11.634 24.71 25.987 24.71zM716.71 841.356c-8.534 0-15.327 6.246-17.114 14.257l-.476-.045c-21.73 44.17-40.426 34.032-62.295 34.032H252.18c-27.277 0-64.466-38.512-64.466-65.213V322.315c0-24.801 29.857-58.607 55.954-63.403v-.544c10.572-.543 19.083-9.142 19.083-19.867 0-10.681-8.511-19.28-19.083-19.777v-.227c-.181.044-.34.091-.52.091-.158 0-.272-.09-.43-.09-1.245 0-2.353.497-3.553.724-50.704 5.203-90.86 52.134-90.86 103.093v502.07c0 54.035 48.938 105.039 103.875 105.039h389.558c47.105 0 78.255-17.199 90.542-61.684 1.36-2.534 2.33-5.25 2.33-8.327.002-9.866-8.009-18.057-17.9-18.057z"/></svg>
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
<title>周转进度</title>
|
||||||
|
<g id="新增看板" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||||
|
<g id="周转看板" transform="translate(-996.000000, -149.000000)" fill-rule="nonzero">
|
||||||
|
<g id="编组-26备份-2" transform="translate(972.000000, 125.000000)">
|
||||||
|
<g id="周转进度" transform="translate(24.000000, 24.000000)">
|
||||||
|
<rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="24" height="24"></rect>
|
||||||
|
<path d="M14.5,8.25 L14.5,2 L4,2 C2.8954305,2 2,2.8954305 2,4 L2,14.5 L2,14.5 L8.25,14.5 L8.25,8.25 L14.5,8.25 Z M15.75,9.5 L15.75,15.75 L9.5,15.75 L9.5,22 L20,22 C21.1045695,22 22,21.1045695 22,20 L22,9.5 L22,9.5 L15.75,9.5 Z" id="形状" fill="#59D0E2"></path>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 1.0 KiB |
@ -25,58 +25,8 @@ const state = {
|
|||||||
israWeekStatistic: [],//缺陷统计
|
israWeekStatistic: [],//缺陷统计
|
||||||
israMonthStatistic: [],//缺陷统计
|
israMonthStatistic: [],//缺陷统计
|
||||||
israYearStatistic: [],//缺陷统计
|
israYearStatistic: [],//缺陷统计
|
||||||
productline: [{
|
productline: [], // SJG产线产量及良品率
|
||||||
"creator": "1",
|
sjgEquipment:[],// SJG设备报警
|
||||||
"sumOutputNum": 15,
|
|
||||||
"outputNum": 15,
|
|
||||||
"passRate": 0.6,
|
|
||||||
"lineName": "3#深加工",
|
|
||||||
"updateTime": "2024-01-04T16:00:19",
|
|
||||||
"updater": "1",
|
|
||||||
"inputNum": 15,
|
|
||||||
"deleted": false,
|
|
||||||
"recordTime": "2023-12-25T20:00:00",
|
|
||||||
"createTime": "2023-10-13T10:44:27",
|
|
||||||
"tenantId": 1,
|
|
||||||
"id": 1712660539187441666,
|
|
||||||
"productionLineId": 1737313260027285506,
|
|
||||||
"sumInputNum": 15
|
|
||||||
}, {
|
|
||||||
"creator": "1",
|
|
||||||
"sumOutputNum": 49,
|
|
||||||
"outputNum": 16,
|
|
||||||
"passRate": 0.3,
|
|
||||||
"lineName": "2#深加工",
|
|
||||||
"updateTime": "2024-01-04T16:00:19",
|
|
||||||
"updater": "1",
|
|
||||||
"inputNum": 17,
|
|
||||||
"deleted": false,
|
|
||||||
"recordTime": "2023-12-25T20:00:00",
|
|
||||||
"createTime": "2023-10-13T10:44:27",
|
|
||||||
"tenantId": 1,
|
|
||||||
"id": 1712660539187441665,
|
|
||||||
"productionLineId": 1737313119178362881,
|
|
||||||
"sumInputNum": 47
|
|
||||||
}, {
|
|
||||||
"creator": "1",
|
|
||||||
"sumOutputNum": 29,
|
|
||||||
"outputNum": 18,
|
|
||||||
"passRate": 0.5,
|
|
||||||
"lineName": "1#深加工",
|
|
||||||
"updateTime": "2024-01-04T16:00:19",
|
|
||||||
"updater": "1",
|
|
||||||
"inputNum": 20,
|
|
||||||
"deleted": false,
|
|
||||||
"recordTime": "2023-12-25T20:00:00",
|
|
||||||
"createTime": "2023-10-13T10:43:17",
|
|
||||||
"tenantId": 1,
|
|
||||||
"id": 1712660244285927426,
|
|
||||||
"productionLineId": 1737312466842456065,
|
|
||||||
"sumInputNum": 27
|
|
||||||
}], // SJG产线产量及良品率
|
|
||||||
sjgEquipment:[
|
|
||||||
{name: 'sadd', error:false,code: 'EQ202312121624540000072',status: "正常"}
|
|
||||||
],// SJG设备报警
|
|
||||||
workOrder: [], // 工单监控
|
workOrder: [], // 工单监控
|
||||||
defectSum: [], // 缺陷汇总
|
defectSum: [], // 缺陷汇总
|
||||||
order: [],// 订单完成情况
|
order: [],// 订单完成情况
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-07-19 15:18:30
|
* @Date: 2021-07-19 15:18:30
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @LastEditTime: 2024-01-08 16:07:58
|
* @LastEditTime: 2024-01-18 14:06:05
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@ -46,13 +46,15 @@
|
|||||||
<!-- <el-row style="margin-bottom: 1em">
|
<!-- <el-row style="margin-bottom: 1em">
|
||||||
<p class="now-team-title">加工工单进度</p>
|
<p class="now-team-title">加工工单进度</p>
|
||||||
</el-row> -->
|
</el-row> -->
|
||||||
|
|
||||||
<el-row v-for="op in orderProcessList" :key="op.id" style="margin-bottom: 1em">
|
<el-row v-for="op in orderProcessList" :key="op.id" style="margin-bottom: 1em">
|
||||||
<el-progress :percentage="op.outRate * 100" class="custom-progress-bar" />
|
|
||||||
<p v-if="op.outRate === 1" class="now-secondary-title" style="color:#4679FD">
|
<p v-if="op.outRate === 1" class="now-secondary-title" style="color:#4679FD">
|
||||||
<i class="el-icon-check" />
|
<i class="el-icon-check" />
|
||||||
{{ op.name }}
|
{{ op.name }}
|
||||||
</p>
|
</p>
|
||||||
<p v-else class="now-secondary-title">{{ op.name }}</p>
|
<p v-else class="now-secondary-title">{{ op.name }}</p>
|
||||||
|
<el-progress define-back-color="rgba(32, 57, 96, 1)" text-color="white" :percentage="op.outRate * 100"
|
||||||
|
class="custom-progress-bar" />
|
||||||
</el-row>
|
</el-row>
|
||||||
<!-- <el-row>
|
<!-- <el-row>
|
||||||
<el-progress :percentage="100" class="custom-progress-bar" />
|
<el-progress :percentage="100" class="custom-progress-bar" />
|
||||||
@ -403,13 +405,13 @@ const locationTableProps = [
|
|||||||
prop: 'level',
|
prop: 'level',
|
||||||
label: '存放位置',
|
label: '存放位置',
|
||||||
// subcomponent: alarmLevel,
|
// subcomponent: alarmLevel,
|
||||||
align: 'center'
|
// align: 'center'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'unit',
|
prop: 'unit',
|
||||||
label: '单位',
|
label: '单位',
|
||||||
// subcomponent: alarmLevel,
|
// subcomponent: alarmLevel,
|
||||||
align: 'center'
|
// align: 'center'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'product',
|
prop: 'product',
|
||||||
@ -465,13 +467,13 @@ const inventoryTableProps = [
|
|||||||
prop: 'level',
|
prop: 'level',
|
||||||
label: '规格',
|
label: '规格',
|
||||||
// subcomponent: alarmLevel,
|
// subcomponent: alarmLevel,
|
||||||
align: 'center'
|
// align: 'center'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'unit',
|
prop: 'unit',
|
||||||
label: '单位',
|
label: '单位',
|
||||||
// subcomponent: alarmLevel,
|
// subcomponent: alarmLevel,
|
||||||
align: 'center'
|
// align: 'center'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'product',
|
prop: 'product',
|
||||||
@ -517,7 +519,7 @@ const qualityYearTableProps = [
|
|||||||
prop: 'level',
|
prop: 'level',
|
||||||
label: '库位',
|
label: '库位',
|
||||||
// subcomponent: alarmLevel,
|
// subcomponent: alarmLevel,
|
||||||
align: 'center'
|
// align: 'center'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'product',
|
prop: 'product',
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-07-19 15:18:30
|
* @Date: 2021-07-19 15:18:30
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @LastEditTime: 2024-01-11 15:54:50
|
* @LastEditTime: 2024-01-18 14:01:09
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@ -30,13 +30,15 @@
|
|||||||
<el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="15" type="flex" class="flex-1">
|
<el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="15" type="flex" class="flex-1">
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
|
||||||
<base-container :title="'切割数据'" :size="'small'" :title-icon="'eqAlarm'">
|
<base-container :title="'切割数据'" :size="'small'" :title-icon="'eqAlarm'">
|
||||||
<base-table1 :page="1" :limit="999" :show-index="false" :table-config="cutProps"
|
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="cutProps"
|
||||||
:table-data="cutTableDataList" />
|
:table-data="cutTableDataList" /> -->
|
||||||
|
<dv-scroll-board :config="cutConfig" style="width:100%;height:350px" ref='cutScrollBoard' />
|
||||||
</base-container>
|
</base-container>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
|
||||||
<base-container :title="'产量及良率统计'" :size="'small'" :title-icon="'energyMonitoring'">
|
<base-container :no-content-padding="true" :title="'产量及良率统计'" :size="'small'"
|
||||||
|
:title-icon="'energyMonitoring'">
|
||||||
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
||||||
<top-radio-group />
|
<top-radio-group />
|
||||||
</div> -->
|
</div> -->
|
||||||
@ -48,15 +50,17 @@
|
|||||||
|
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
|
||||||
<base-container :title="'ISRA 缺陷数据'" :size="'small'" :title-icon="'scrap'">
|
<base-container :title="'ISRA 缺陷数据'" :size="'small'" :title-icon="'scrap'">
|
||||||
<base-table1 :page="1" :limit="999" :show-index="false" :table-config="ISRATableProps"
|
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="ISRATableProps"
|
||||||
:table-data="ISRAList" />
|
:table-data="ISRAList" /> -->
|
||||||
|
<dv-scroll-board :config="ISRAConfig" style="width:100%;height:350px" ref='ISRAScrollBoard' />
|
||||||
</base-container>
|
</base-container>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="10" type="flex" class="flex-1">
|
<el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="10" type="flex" class="flex-1">
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="12">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="12">
|
||||||
<base-container :height="256" :title="'废片 缺陷数据'" :size="'middle'" :title-icon="'scrap'">
|
<base-container :no-content-padding="true" :height="256" :title="'废片 缺陷数据'" :size="'middle'"
|
||||||
|
:title-icon="'scrap'">
|
||||||
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
||||||
<top-radio-group />
|
<top-radio-group />
|
||||||
</div> -->
|
</div> -->
|
||||||
@ -78,25 +82,30 @@
|
|||||||
</base-container>
|
</base-container>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="14">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="14">
|
||||||
<base-container :height="318 + 338 + 16" :size="'eqStatus'" :title="'设备状态监控'" :title-icon="'eqMonitoring'">
|
<base-container :no-content-padding="true" :no-padding="true" :height="318 + 338 + 16" :size="'eqStatus'"
|
||||||
|
:title="'设备状态监控'" :title-icon="'eqMonitoring'">
|
||||||
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
||||||
<top-radio-group />
|
<top-radio-group />
|
||||||
</div> -->
|
</div> -->
|
||||||
<!-- 像下面这样表格里的limit值，也许可以用js动态计算出来 -->
|
<!-- 像下面这样表格里的limit值，也许可以用js动态计算出来 -->
|
||||||
<el-col :span="6" style="">
|
<el-col :span="6" style="">
|
||||||
<div style="font-size:20px;margin: 5px 0 10px 0">融化风机</div>
|
<div style="font-size:20px;margin: 5px 0 10px 0">融化风机</div>
|
||||||
<base-table1 :page="1" :limit="999" :show-index="false" :table-config="EqMonitoringPropsFun"
|
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="EqMonitoringPropsFun"
|
||||||
:table-data="funList" />
|
:table-data="funList" /> -->
|
||||||
|
<dv-scroll-board :config="funConfig" style="width:100%;height:350px" ref='funScrollBoard' />
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="6">
|
<el-col :span="6">
|
||||||
<div style="font-size:20px;margin: 5px 0 10px 0;">退火风机</div>
|
<div style="font-size:20px;margin: 5px 0 10px 0;">退火风机</div>
|
||||||
<base-table1 :page="1" :limit="999" :show-index="false" :table-config="EqMonitoringPropsFun"
|
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="EqMonitoringPropsFun"
|
||||||
:table-data="annealFunList" />
|
:table-data="annealFunList" /> -->
|
||||||
|
<dv-scroll-board :config="annealFunConfig" style="width:100%;height:350px" ref='annealFunScrollBoard' />
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12" style="float: right;">
|
<el-col :span="12" style="float: right;">
|
||||||
<div style="font-size:20px;margin: 5px 0 10px 0;">产线设备</div>
|
<div style="font-size:20px;margin: 5px 0 10px 0;">产线设备</div>
|
||||||
<base-table1 :page="1" :limit="999" :show-index="false" :table-config="EqMonitoringProps"
|
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="EqMonitoringProps"
|
||||||
:table-data="realEqList" />
|
:table-data="realEqList" /> -->
|
||||||
|
<dv-scroll-board :config="realEqConfig" style="width:100%;height:350px" ref='realEqScrollBoard' />
|
||||||
|
|
||||||
</el-col>
|
</el-col>
|
||||||
<!-- <double-y-chart :id="'doubleYChart'" :name-list="cxNameList" :data-list="cxDataList" :height="359"
|
<!-- <double-y-chart :id="'doubleYChart'" :name-list="cxNameList" :data-list="cxDataList" :height="359"
|
||||||
:show-legend="true" /> -->
|
:show-legend="true" /> -->
|
||||||
@ -136,11 +145,12 @@ import pileBarChart from './components/pileBarChart'
|
|||||||
import colorDiv from './components/colorDiv'
|
import colorDiv from './components/colorDiv'
|
||||||
|
|
||||||
// import axios from '@/utils/request'
|
// import axios from '@/utils/request'
|
||||||
import doubleYChart from './components/doubleYChart '
|
import doubleYChart from './components/coldDoubleYChart'
|
||||||
// import elementResizeDetectorMaker from 'element-resize-detector';
|
// import elementResizeDetectorMaker from 'element-resize-detector';
|
||||||
// var erd = elementResizeDetectorMaker(); //创建实例
|
// var erd = elementResizeDetectorMaker(); //创建实例
|
||||||
// let resizeFun = null
|
// let resizeFun = null
|
||||||
import { parseTime } from '../core/mixins/code-filter';
|
import { parseTime } from '../core/mixins/code-filter';
|
||||||
|
import { formatDate } from '@/utils'
|
||||||
|
|
||||||
|
|
||||||
import LinearBarChart from './components/linearBarChart'
|
import LinearBarChart from './components/linearBarChart'
|
||||||
@ -264,6 +274,61 @@ export default {
|
|||||||
ISRATableProps,
|
ISRATableProps,
|
||||||
orderList: [],
|
orderList: [],
|
||||||
times: '',
|
times: '',
|
||||||
|
cutConfig: {
|
||||||
|
header: ['序号', '产线', '时间', '规格', '良品面积', '废品面积', '良品率'],
|
||||||
|
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
|
columnWidth: [70,70, 130, 150, 110,110,90],
|
||||||
|
align: ['center'],
|
||||||
|
data: [],
|
||||||
|
// index:true,
|
||||||
|
rowNum: 10
|
||||||
|
},
|
||||||
|
funConfig: {
|
||||||
|
header: ['序号', '设备名称', '运行状态'],
|
||||||
|
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
|
columnWidth: [60, 90, 90],
|
||||||
|
align: ['center'],
|
||||||
|
data: [],
|
||||||
|
// index:true,
|
||||||
|
rowNum: 10
|
||||||
|
},
|
||||||
|
realEqConfig: {
|
||||||
|
header: ['序号', '产线', '设备名称', '设备编码', '运行状态','故障状态'],
|
||||||
|
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
|
columnWidth: [60, 80, 90,90,90,90],
|
||||||
|
align: ['center'],
|
||||||
|
data: [],
|
||||||
|
// index:true,
|
||||||
|
rowNum: 10
|
||||||
|
},
|
||||||
|
annealFunConfig: {
|
||||||
|
header: ['序号', '设备名称', '运行状态'],
|
||||||
|
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
|
columnWidth: [60, 90, 90],
|
||||||
|
align: ['center'],
|
||||||
|
data: [],
|
||||||
|
// index:true,
|
||||||
|
rowNum: 10
|
||||||
|
},
|
||||||
|
ISRAConfig: {
|
||||||
|
header: ['序号', '产线', '时间', '缺陷类型', '缺陷数量', '占比'],
|
||||||
|
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
|
columnWidth: [70, 70, 130, 150, 110, 110,],
|
||||||
|
align: ['center'],
|
||||||
|
data: [],
|
||||||
|
// index:true,
|
||||||
|
rowNum: 10
|
||||||
|
},
|
||||||
ISRAList:[],
|
ISRAList:[],
|
||||||
EnergyMonitoringNameList: [],
|
EnergyMonitoringNameList: [],
|
||||||
equipmentList: [],
|
equipmentList: [],
|
||||||
@ -484,22 +549,47 @@ export default {
|
|||||||
if (this.funWsData.type === 'AnnealFanInfo') {
|
if (this.funWsData.type === 'AnnealFanInfo') {
|
||||||
let arr = []
|
let arr = []
|
||||||
for (let i in this.funWsData.data.annealFanInfo) {
|
for (let i in this.funWsData.data.annealFanInfo) {
|
||||||
arr.push({
|
// arr.push({
|
||||||
equipmentName: i,
|
// equipmentName: i,
|
||||||
status: this.funWsData.data.annealFanInfo[i]
|
// status: this.funWsData.data.annealFanInfo[i]
|
||||||
})
|
// })
|
||||||
|
arr.push([
|
||||||
|
// console.log(item)
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
</span>`,
|
||||||
|
// formatDate(item.planStartTime) || '',
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${i || ''}
|
||||||
|
</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${this.funWsData.data.annealFanInfo[i] || ''}</span>`,
|
||||||
|
])
|
||||||
}
|
}
|
||||||
this.annealFunList = arr
|
this.annealFanConfig.data = arr
|
||||||
|
this.$refs['annealFanScrollBoard'].updateRows(arr)
|
||||||
}
|
}
|
||||||
if (this.funWsData.type === 'FanInfo') {
|
if (this.funWsData.type === 'FanInfo') {
|
||||||
let arr = []
|
let arr = []
|
||||||
for (let i in this.funWsData.data.fanInfo) {
|
for (let i in this.funWsData.data.fanInfo) {
|
||||||
arr.push({
|
// arr.push({
|
||||||
equipmentName: i,
|
// equipmentName: i,
|
||||||
status: this.funWsData.data.fanInfo[i]
|
// status: this.funWsData.data.fanInfo[i]
|
||||||
})
|
// })
|
||||||
|
arr.push([
|
||||||
|
// console.log(item)
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
</span>`,
|
||||||
|
// formatDate(item.planStartTime) || '',
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${i || ''}
|
||||||
|
</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${this.funWsData.data.fanInfo[i] || ''}</span>`,
|
||||||
|
])
|
||||||
}
|
}
|
||||||
this.funList = arr
|
this.funConfig.data = arr
|
||||||
|
this.$refs['funScrollBoard'].updateRows(arr)
|
||||||
|
// this.funList = arr
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
cutWebsocketOnOpen() {
|
cutWebsocketOnOpen() {
|
||||||
@ -511,30 +601,49 @@ export default {
|
|||||||
this.CutInitWebSocket()
|
this.CutInitWebSocket()
|
||||||
},
|
},
|
||||||
getSize(str) {
|
getSize(str) {
|
||||||
console.log(str.match(/\d+(\.\d+)?/g))
|
// console.log(str.match(/\d+(\.\d+)?/g))
|
||||||
let size = str.match(/\d+(\.\d+)?/g).map(ele => {
|
let size = str.match(/\d+(\.\d+)?/g).map(ele => {
|
||||||
return parseFloat(ele)
|
return parseFloat(ele)
|
||||||
})
|
})
|
||||||
console.log(size[0] + '*' + size[1] + '*' + size[2]);
|
// console.log(size[0] + '*' + size[1] + '*' + size[2]);
|
||||||
return size[0] + '*' + size[1] + '*' + size[2]
|
return size[0] + '*' + size[1] + '*' + size[2]
|
||||||
},
|
},
|
||||||
// 数据接收
|
// 数据接收
|
||||||
cutWebsocketOnMessage(e) {
|
cutWebsocketOnMessage(e) {
|
||||||
this.cutWsData = e?.data ? JSON.parse(e?.data) : {}
|
this.cutWsData = e?.data ? JSON.parse(e?.data) : {}
|
||||||
if (this.cutWsData.type === 'cutting' && this.cutWsData.name === 'table') {
|
if (this.cutWsData.type === 'cutting' && this.cutWsData.name === 'table') {
|
||||||
this.cutTableDataList = this.cutWsData.productHourData.map((ele, index) => {
|
// this.cutTableDataList = this.cutWsData.productHourData.map((ele, index) => {
|
||||||
// if (ele.progressRate != 1) {
|
// // if (ele.progressRate != 1) {
|
||||||
return {
|
// return {
|
||||||
id: ele.id,
|
// id: ele.id,
|
||||||
lineName: ele.lineName,
|
// lineName: ele.lineName,
|
||||||
time: ele.time,
|
// time: ele.time,
|
||||||
size: this.getSize(ele.size),
|
// size: this.getSize(ele.size),
|
||||||
productArea: ele.productArea + '㎡',
|
// productArea: ele.productArea + '㎡',
|
||||||
wasteArea: ele.wasteArea + '㎡',
|
// wasteArea: ele.wasteArea + '㎡',
|
||||||
product: (ele.product * 100).toFixed(2)
|
// product: (ele.product * 100).toFixed(2)
|
||||||
}
|
|
||||||
// }
|
// }
|
||||||
});
|
// // }
|
||||||
|
// });
|
||||||
|
let cutArr = this.cutWsData.productHourData.map((item, index) => [
|
||||||
|
// console.log(item)
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
</span>`,
|
||||||
|
// formatDate(item.planStartTime) || '',
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${item.lineName || ''}
|
||||||
|
</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${formatDate(item.time) || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${this.getSize(item.size) || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.productArea + '㎡' || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.wasteArea + '㎡' || ''}</span>`,
|
||||||
|
`<div style = "${(item.product * 100).toFixed(2) > 91 ? 'display:block;color:rgba(255,255,255,0.5)' : 'display:none;'}">${(item.product * 100).toFixed(2) + '%' || ''}</div>
|
||||||
|
<div style = "${(item.product * 100).toFixed(2) < 91 ? 'display:block; color:rgba(255, 209, 96, 1)' : 'display:none;'}">${(item.product * 100).toFixed(2) + '%' || ''}</div>`
|
||||||
|
])
|
||||||
|
this.cutConfig.data = cutArr
|
||||||
|
this.$refs['cutScrollBoard'].updateRows(cutArr)
|
||||||
|
|
||||||
} else if (this.cutWsData.type === 'cutting' && this.cutWsData.name === 'chart' && this.cutWsData.dateType === 'day') {
|
} else if (this.cutWsData.type === 'cutting' && this.cutWsData.name === 'chart' && this.cutWsData.dateType === 'day') {
|
||||||
let nameList = []
|
let nameList = []
|
||||||
let nameWasteList = []
|
let nameWasteList = []
|
||||||
@ -571,33 +680,51 @@ export default {
|
|||||||
// let obj = JSON.parse(data.data)
|
// let obj = JSON.parse(data.data)
|
||||||
this.SJGWsData = e?.data ? JSON.parse(e?.data) : {}
|
this.SJGWsData = e?.data ? JSON.parse(e?.data) : {}
|
||||||
if (this.SJGWsData.type === 'isra') {
|
if (this.SJGWsData.type === 'isra') {
|
||||||
this.ISRAList = this.SJGWsData.detData.map((ele, index) => {
|
// this.ISRAList = this.SJGWsData.detData.map((ele, index) => {
|
||||||
// if (ele.progressRate != 1) {
|
// // if (ele.progressRate != 1) {
|
||||||
return {
|
// return {
|
||||||
id: ele.id,
|
// id: ele.id,
|
||||||
linename: ele.linename,
|
// linename: ele.linename,
|
||||||
type: ele.type,
|
// type: ele.type,
|
||||||
num: ele.num,
|
// num: ele.num,
|
||||||
time:ele.time,
|
// time:ele.time,
|
||||||
percent: ele.percent
|
|
||||||
}
|
|
||||||
// }
|
|
||||||
});
|
|
||||||
} else if (this.SJGWsData.type === 'equipment') {
|
|
||||||
this.realEqList = this.SJGWsData.detData.map((ele, index) => {
|
|
||||||
// if (ele.progressRate != 1) {
|
|
||||||
return {
|
|
||||||
line: ele.line,
|
|
||||||
name: ele.name,
|
|
||||||
code: ele.code,
|
|
||||||
run: ele.run,
|
|
||||||
error: ele.error,
|
|
||||||
// percent: ele.percent
|
// percent: ele.percent
|
||||||
}
|
|
||||||
// }
|
// }
|
||||||
});
|
// // }
|
||||||
|
// });
|
||||||
|
console.log(this.SJGWsData.detData);
|
||||||
|
let ISRAArr = this.SJGWsData.detData.map((item, index) => [
|
||||||
|
// console.log(item)
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
</span>`,
|
||||||
|
// formatDate(item.planStartTime) || '',
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${item.linename || ''}
|
||||||
|
</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.time || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.type || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.num || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${(item.percent * 100).toFixed(2) || ''}</span>`,
|
||||||
|
])
|
||||||
|
this.ISRAConfig.data = ISRAArr
|
||||||
|
this.$refs['ISRAScrollBoard'].updateRows(ISRAArr)
|
||||||
|
} else if (this.SJGWsData.type === 'equipment') {
|
||||||
|
this.realEqList = this.SJGWsData.detData.map((ele, index) =>[
|
||||||
|
// console.log(item)
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
</span>`,
|
||||||
|
// formatDate(item.planStartTime) || '',
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${item.line || ''}
|
||||||
|
</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.name || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.code || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.run || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.error || ''}</span>`,
|
||||||
|
]);
|
||||||
}
|
}
|
||||||
|
this.realEqConfig.data = this.realEqList
|
||||||
|
this.$refs['realEqScrollBoard'].updateRows(this.realEqList)
|
||||||
},
|
},
|
||||||
windowWidth(value) {
|
windowWidth(value) {
|
||||||
this.clientWidth = value
|
this.clientWidth = value
|
||||||
@ -818,4 +945,44 @@ export default {
|
|||||||
/* .container-main {
|
/* .container-main {
|
||||||
min-height: calc(100vh - 10em);
|
min-height: calc(100vh - 10em);
|
||||||
} */
|
} */
|
||||||
|
.orange {
|
||||||
|
color: rgba(255, 209, 96, 1)
|
||||||
|
}
|
||||||
|
|
||||||
|
.white {
|
||||||
|
color: rgba(255, 255, 255, 0.5)
|
||||||
|
}
|
||||||
|
.tooltip {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.tooltip .tooltiptext {
|
||||||
|
visibility: hidden;
|
||||||
|
width: 120px;
|
||||||
|
background-color: black;
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 6px;
|
||||||
|
padding: 5px 0;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1;
|
||||||
|
bottom: 150%;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip .tooltiptext::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 100%;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -5px;
|
||||||
|
border-width: 5px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: black transparent transparent transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip:hover .tooltiptext {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
* @Author: gtz
|
* @Author: gtz
|
||||||
* @Date: 2022-01-19 15:58:17
|
* @Date: 2022-01-19 15:58:17
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @LastEditTime: 2024-01-11 15:54:37
|
* @LastEditTime: 2024-01-18 13:59:40
|
||||||
* @Description: file content
|
* @Description: file content
|
||||||
* @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseContainer\index.vue
|
* @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseContainer\index.vue
|
||||||
-->
|
-->
|
||||||
@ -22,12 +22,21 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<div class="bar-item">
|
<div class="bar-item">
|
||||||
<div v-if="title" class="bar-title">
|
<div v-if="title" class="bar-title" ds>
|
||||||
<span>
|
<span>
|
||||||
<svg-icon :icon-class="titleIcon" style="font-size: 1em; position: relative; top: .08em" />
|
<svg-icon :icon-class="titleIcon" style="font-size: 1em; position: relative; top: .08em" />
|
||||||
{{ title }}
|
{{ title }}
|
||||||
</span>
|
</span>
|
||||||
|
<!-- <span style="font-size: 20px;color:#52FFF8;margin-left: 10px;margin-top: 2px;">
|
||||||
|
{{ time +'-'+ time2 }}
|
||||||
|
</span> -->
|
||||||
</div>
|
</div>
|
||||||
|
<!-- <div v-if="true" class="bar-title">
|
||||||
|
<span>
|
||||||
|
<svg-icon :icon-class="titleIcon" style="font-size: 1em; position: relative; top: .08em" />
|
||||||
|
{{ title }}
|
||||||
|
</span>
|
||||||
|
</div> -->
|
||||||
<div class="bar-content" :class="{ 'p-0': noContentPadding }">
|
<div class="bar-content" :class="{ 'p-0': noContentPadding }">
|
||||||
<slot />
|
<slot />
|
||||||
</div>
|
</div>
|
||||||
@ -83,21 +92,39 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
curIndex: 0,
|
curIndex: 0,
|
||||||
|
time: null,
|
||||||
|
time2:null
|
||||||
// imgUrl: require(`../../../../assets/img/${this.back}.png`),
|
// imgUrl: require(`../../../../assets/img/${this.back}.png`),
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
// console.log(this.back);
|
},
|
||||||
// this.$nextTick(() => {
|
mounted () {
|
||||||
// this.$refs.baseContainer.style = `background:url('../../../../assets/img/${this.back}.png') no-repeat;)`
|
this.time = this.format(new Date().setHours(7,0,0));
|
||||||
// })
|
// console.log(time);
|
||||||
// console.log(this.$refs.baseContainer.style)
|
//前一天时间
|
||||||
|
this.time2 = this.format(new Date().setHours(7, 0, 0) - 86400000 * 1);
|
||||||
|
console.log(new Date().setHours(7, 0, 0) - 86400000 * 1);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
add0(m) {
|
||||||
|
return m < 10 ? '0' + m : m
|
||||||
|
},
|
||||||
|
format(shijianchuo) {
|
||||||
|
//shijianchuo是整数，否则要parseInt转换
|
||||||
|
var time = new Date(shijianchuo);
|
||||||
|
var y = time.getFullYear();
|
||||||
|
var m = time.getMonth() + 1;
|
||||||
|
var d = time.getDate();
|
||||||
|
var h = time.getHours();
|
||||||
|
var mm = time.getMinutes();
|
||||||
|
var s = time.getSeconds();
|
||||||
|
return y + '-' + this.add0(m) + '-' + this.add0(d) + ' ' + h + '时'
|
||||||
|
},
|
||||||
changeTab(num) {
|
changeTab(num) {
|
||||||
this.curIndex = num
|
this.curIndex = num
|
||||||
this.$emit('tabSelect', num)
|
this.$emit('tabSelect', num)
|
||||||
}
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@ -198,11 +225,13 @@ export default {
|
|||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
padding: 0.67em;
|
padding: 0.67em;
|
||||||
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bar-content {
|
.bar-content {
|
||||||
// padding: 1em;
|
padding: 1em;
|
||||||
flex: 1 auto;
|
flex: 1 auto;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.no-padding {
|
.no-padding {
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Date: 2020-12-14 09:07:03
|
* @Date: 2020-12-14 09:07:03
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @LastEditTime: 2024-01-08 14:09:05
|
* @LastEditTime: 2024-01-12 14:30:46
|
||||||
* @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseTable.vue
|
* @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseTable.vue
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -110,12 +110,12 @@ export default {
|
|||||||
},
|
},
|
||||||
classOption() {
|
classOption() {
|
||||||
return {
|
return {
|
||||||
step: 0.3, // 数值越大速度滚动越快
|
step: 0.2, // 数值越大速度滚动越快
|
||||||
limitMoveNum: 1, // 开始无缝滚动的数据量 this.list
|
limitMoveNum: 10, // 开始无缝滚动的数据量 this.list
|
||||||
hoverStop: true, // 是否开启鼠标悬停stop
|
hoverStop: true, // 是否开启鼠标悬停stop
|
||||||
direction: 1, // 0向下 1向上 2向左 3向右
|
direction: 1, // 0向下 1向上 2向左 3向右
|
||||||
openWatch: true, // 开启数据实时监控刷新dom
|
openWatch: true, // 开启数据实时监控刷新dom
|
||||||
singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
|
singleHeight: 0/1, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
|
||||||
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
|
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
|
||||||
waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
|
waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
|
||||||
};
|
};
|
||||||
|
|||||||
292
src/views/OperationalOverview/components/coldDoubleYChart.vue
Normal file
292
src/views/OperationalOverview/components/coldDoubleYChart.vue
Normal file
@ -0,0 +1,292 @@
|
|||||||
|
|
||||||
|
<!--
|
||||||
|
* @Author: zhp
|
||||||
|
* @Date: 2023-09-21 09:06:28
|
||||||
|
* @LastEditTime: 2024-01-17 15:26:04
|
||||||
|
* @LastEditors: zhp
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div :id="id" class="productChart" :style="{ height: '390px', width: width }" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import * as echarts from 'echarts';
|
||||||
|
import 'echarts/theme/macarons' // echarts theme
|
||||||
|
import resize from './mixins/resize'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'OverviewBar',
|
||||||
|
mixins: [resize],
|
||||||
|
props: {
|
||||||
|
id: {
|
||||||
|
type: String,
|
||||||
|
default: 'linearBarChart'
|
||||||
|
},
|
||||||
|
className: {
|
||||||
|
type: String,
|
||||||
|
default: 'chart'
|
||||||
|
},
|
||||||
|
width: {
|
||||||
|
type: String,
|
||||||
|
default: '100%'
|
||||||
|
},
|
||||||
|
borderRadius: {
|
||||||
|
type: Array,
|
||||||
|
default: () => [9, 9, 0, 0]
|
||||||
|
},
|
||||||
|
beilv: {
|
||||||
|
type: Number,
|
||||||
|
default: 1
|
||||||
|
},
|
||||||
|
height: {
|
||||||
|
type: Number,
|
||||||
|
default: 200
|
||||||
|
},
|
||||||
|
showLegend: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
nameList: {
|
||||||
|
type: Array,
|
||||||
|
default: () => []
|
||||||
|
},
|
||||||
|
dataList: {
|
||||||
|
type: Array,
|
||||||
|
default: () => []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
chart: null,
|
||||||
|
series: [{
|
||||||
|
type: 'bar',
|
||||||
|
data: [],
|
||||||
|
barWidth: 6
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
console.log('mounted')
|
||||||
|
console.log('borderRadius: ', this.borderRadius)
|
||||||
|
// this.$nextTick(() => {
|
||||||
|
// this.initChart()
|
||||||
|
// })
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
if (!this.chart) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.chart.dispose()
|
||||||
|
this.chart = null
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
initChart(nameList, passRateList, outputNumList) {
|
||||||
|
console.log(nameList, passRateList)
|
||||||
|
let series= [
|
||||||
|
{
|
||||||
|
name: '产线产量',
|
||||||
|
type: 'bar',
|
||||||
|
yAxisIndex: 1,
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||||
|
{ offset: 0, color: '#9DD5FF' },
|
||||||
|
{ offset: 0.3, color: '#1295FF' }
|
||||||
|
]),
|
||||||
|
label: {
|
||||||
|
show: true, //开启显示
|
||||||
|
position: 'top', //在上方显示
|
||||||
|
textStyle: { //数值样式
|
||||||
|
color: '#ced1d5',
|
||||||
|
fontSize: 12
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
// barBorderRadius: this.borderRadius
|
||||||
|
},
|
||||||
|
barWidth: 12,
|
||||||
|
data: outputNumList
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '产线良品率',
|
||||||
|
symbol: 'circle', //变为实心圆
|
||||||
|
type: 'line',
|
||||||
|
yAxisIndex: 0,
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0.8,
|
||||||
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||||
|
{
|
||||||
|
offset: 0,
|
||||||
|
color: 'rgba(255, 209, 96, 0.18)'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
offset: 1,
|
||||||
|
color: 'rgba(255, 234, 153, 0)'
|
||||||
|
}
|
||||||
|
])
|
||||||
|
},
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
color: 'rgba(255, 209, 96, 1)', //改变折线点的颜色
|
||||||
|
lineStyle: {
|
||||||
|
color: 'rgba(255, 209, 96, 1)' //改变折线颜色
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data: passRateList
|
||||||
|
}
|
||||||
|
]
|
||||||
|
// const colors = ['#5470C6', '#91CC75', '#EE6666']
|
||||||
|
this.chart = echarts.init(document.getElementById(this.id))
|
||||||
|
this.chart.setOption({
|
||||||
|
// color: colors,
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis',
|
||||||
|
axisPointer: {
|
||||||
|
type: 'cross'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
left: "3%",
|
||||||
|
right: "5%",
|
||||||
|
bottom: "3%",
|
||||||
|
containLabel: true
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
itemWidth: 10,
|
||||||
|
itemHeight: 10,
|
||||||
|
top: '1%',
|
||||||
|
right: '20px',
|
||||||
|
data: ['产线产量', '产线良品率'],
|
||||||
|
textStyle: {
|
||||||
|
fontSize: 12 * this.beilv,
|
||||||
|
color: '#ced1d5'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
type: 'category',
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
type: 'solid',
|
||||||
|
color: '#213259', // 左边线的颜色
|
||||||
|
width: '1' // 坐标线的宽度
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
textStyle: {
|
||||||
|
color: 'rgba(255,255,255,0.5)' // 坐标值得具体的颜色
|
||||||
|
}
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#213259'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data: nameList
|
||||||
|
},
|
||||||
|
// yAxis: {
|
||||||
|
|
||||||
|
// },
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
min: function() { // 取最小值向下取整为最小刻度
|
||||||
|
return 0
|
||||||
|
},
|
||||||
|
max: function(value) { // 取最大值向上取整为最大刻度
|
||||||
|
return Math.ceil(value.max)
|
||||||
|
},
|
||||||
|
scale: true,
|
||||||
|
type: 'value',
|
||||||
|
name: '良品率/%',
|
||||||
|
nameTextStyle: {// y轴上方单位的颜色
|
||||||
|
color: '#fff',
|
||||||
|
align: "left",
|
||||||
|
},
|
||||||
|
position: 'right',
|
||||||
|
alignTicks: true,
|
||||||
|
axisLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
type: 'solid',
|
||||||
|
color: '#213259', // 左边线的颜色
|
||||||
|
width: '1' // 坐标线的宽度
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
textStyle: {
|
||||||
|
color: '#ced1d5', // 坐标值得具体的颜色
|
||||||
|
formatter: '{value}%'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#213259'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// type: 'value'
|
||||||
|
// axisLine: {
|
||||||
|
// show: true,
|
||||||
|
// lineStyle: {
|
||||||
|
// color: colors[0]
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
min: function() { // 取最小值向下取整为最小刻度
|
||||||
|
return 0
|
||||||
|
},
|
||||||
|
max: function(value) { // 取最大值向上取整为最大刻度
|
||||||
|
return Math.ceil(value.max)
|
||||||
|
},
|
||||||
|
scale: true,
|
||||||
|
type: 'value',
|
||||||
|
name: '产量/㎡', // y轴上方的单位
|
||||||
|
nameTextStyle: {
|
||||||
|
color: "#fff",
|
||||||
|
// fontSize: 10,
|
||||||
|
align: "right",
|
||||||
|
},
|
||||||
|
position: 'left',
|
||||||
|
alignTicks: true,
|
||||||
|
axisLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
type: 'solid',
|
||||||
|
color: '#213259', // 左边线的颜色
|
||||||
|
width: '1' // 坐标线的宽度
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
textStyle: {
|
||||||
|
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色
|
||||||
|
formatter: '{value} 片'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#213259'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// type: 'value'
|
||||||
|
// axisLine: {
|
||||||
|
// show: true,
|
||||||
|
// lineStyle: {
|
||||||
|
// color: colors[1]
|
||||||
|
// }jik078u7uut9890999999999999999999999999999999999999999999999999999999999999995u8
|
||||||
|
// },
|
||||||
|
}
|
||||||
|
],
|
||||||
|
series: series
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style>
|
||||||
|
.productChart{
|
||||||
|
top: -40px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,13 +1,13 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-09-21 09:06:28
|
* @Date: 2023-09-21 09:06:28
|
||||||
* @LastEditTime: 2024-01-11 15:52:09
|
* @LastEditTime: 2024-01-17 13:56:46
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div :id="id" :class="className" :style="{ height: height + 'px', width: width }" />
|
<div :id="id" class="productChart" :style="{ height: '390px', width: width }" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -70,9 +70,9 @@ export default {
|
|||||||
mounted() {
|
mounted() {
|
||||||
console.log('mounted')
|
console.log('mounted')
|
||||||
console.log('borderRadius: ', this.borderRadius)
|
console.log('borderRadius: ', this.borderRadius)
|
||||||
this.$nextTick(() => {
|
// this.$nextTick(() => {
|
||||||
this.initChart()
|
// this.initChart()
|
||||||
})
|
// })
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
if (!this.chart) {
|
if (!this.chart) {
|
||||||
@ -83,6 +83,7 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
initChart(nameList, passRateList, outputNumList) {
|
initChart(nameList, passRateList, outputNumList) {
|
||||||
|
console.log(nameList, passRateList)
|
||||||
let series= [
|
let series= [
|
||||||
{
|
{
|
||||||
name: '产线产量',
|
name: '产线产量',
|
||||||
@ -151,11 +152,12 @@ export default {
|
|||||||
left: "3%",
|
left: "3%",
|
||||||
right: "5%",
|
right: "5%",
|
||||||
bottom: "3%",
|
bottom: "3%",
|
||||||
width: 'auto',
|
|
||||||
height: "auto",
|
|
||||||
containLabel: true
|
containLabel: true
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
|
itemWidth: 10,
|
||||||
|
itemHeight: 10,
|
||||||
|
right: '20px',
|
||||||
data: ['产线产量', '产线良品率'],
|
data: ['产线产量', '产线良品率'],
|
||||||
textStyle: {
|
textStyle: {
|
||||||
fontSize: 12 * this.beilv,
|
fontSize: 12 * this.beilv,
|
||||||
@ -281,3 +283,8 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
<style>
|
||||||
|
.productChart{
|
||||||
|
top: -40px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@ -173,3 +173,4 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@ -1,13 +1,13 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-12-27 13:54:52
|
* @Date: 2023-12-27 13:54:52
|
||||||
* @LastEditTime: 2023-12-29 16:28:26
|
* @LastEditTime: 2024-01-17 10:09:36
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div :id="id" :class="className" :style="{ height: height + 'px', width: width }" />
|
<div :id="id" class="productChart" :style="{ height: height + 'px', width: width }" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -133,14 +133,17 @@ export default {
|
|||||||
// }
|
// }
|
||||||
this.chart.setOption({
|
this.chart.setOption({
|
||||||
legend: {
|
legend: {
|
||||||
|
// top: '2.5%',
|
||||||
|
// right: '20px',
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: '#ffffff'
|
color: '#ffffff'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
grid: {
|
grid: {
|
||||||
|
top:'80',
|
||||||
left: '3%',
|
left: '3%',
|
||||||
right: '4%',
|
right: '4%',
|
||||||
bottom: '3%',
|
// bottom: '3%',
|
||||||
width: 'auto',
|
width: 'auto',
|
||||||
height: 'auto',
|
height: 'auto',
|
||||||
containLabel: true
|
containLabel: true
|
||||||
@ -213,3 +216,7 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-07-19 15:18:30
|
* @Date: 2021-07-19 15:18:30
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @LastEditTime: 2024-01-12 09:59:58
|
* @LastEditTime: 2024-01-18 13:57:38
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@ -32,22 +32,25 @@
|
|||||||
<base-container :title="'设备报警'" :size="'small'" :height="318" :title-icon="'eqAlarm'">
|
<base-container :title="'设备报警'" :size="'small'" :height="318" :title-icon="'eqAlarm'">
|
||||||
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="qualityYearTableProps"
|
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="qualityYearTableProps"
|
||||||
:table-data="equipmentList" /> -->
|
:table-data="equipmentList" /> -->
|
||||||
<base-table1 :page="1" :limit="999" :show-index="false" :table-config="qualityYearTableProps"
|
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="qualityYearTableProps"
|
||||||
:table-data="qualityYearList" />
|
:table-data="qualityYearList" /> -->
|
||||||
|
<dv-scroll-board class="eqTable" :config="eqConfig" style="width:100%;height:350px" ref='eqScrollBoard' />
|
||||||
|
|
||||||
</base-container>
|
</base-container>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8" height="100%">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8" height="100%">
|
||||||
<base-container :title="'各工序缺陷汇总'" :size="'small'" :title-icon="'scrap'">
|
<base-container :title="'各工序缺陷汇总'" :size="'small'" :title-icon="'scrap'">
|
||||||
<base-table1 :page="1" :limit="999" :show-index="false" :table-config="qualityMonthTableProps"
|
|
||||||
:table-data="qualityMonthList" />
|
|
||||||
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="qualityMonthTableProps"
|
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="qualityMonthTableProps"
|
||||||
:table-data="qualityMonthList" /> -->
|
:table-data="qualityMonthList" /> -->
|
||||||
|
<!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="qualityMonthTableProps"
|
||||||
|
:table-data="qualityMonthList" /> -->
|
||||||
|
<dv-scroll-board :config="processConfig" style="width:100%;height:350px" ref='processScrollBoard' />
|
||||||
</base-container>
|
</base-container>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8" height="100%">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8" height="100%">
|
||||||
<base-container :height="318" :size="'small'" :title="'工单监控'" :title-icon="'eqMonitoring'">
|
<base-container :height="318" :size="'small'" :title="'工单监控'" :title-icon="'order'">
|
||||||
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
||||||
<top-radio-group />
|
<top-radio-group />
|
||||||
</div> -->
|
</div> -->
|
||||||
@ -60,37 +63,15 @@
|
|||||||
</el-row> -->
|
</el-row> -->
|
||||||
<el-row v-for="op in orderList" :key="op.id" style="margin-bottom: 1em">
|
<el-row v-for="op in orderList" :key="op.id" style="margin-bottom: 1em">
|
||||||
<!-- <el-col :span="12"> -->
|
<!-- <el-col :span="12"> -->
|
||||||
<el-progress :percentage="op.progressRate * 100" class="custom-progress-bar" />
|
<p class="now-secondary-title">{{ op.name }}</p>
|
||||||
|
<el-progress define-back-color="rgba(32, 57, 96, 1)" text-color="white"
|
||||||
|
:percentage="op.progressRate * 100" class="custom-progress-bar" />
|
||||||
<!-- <p v-if="op.progressRate === 1" class="now-secondary-title" style="color:#4679FD">
|
<!-- <p v-if="op.progressRate === 1" class="now-secondary-title" style="color:#4679FD">
|
||||||
<i class="el-icon-check" />
|
<i class="el-icon-check" />
|
||||||
{{ op.name }}
|
{{ op.name }}
|
||||||
</p> -->
|
</p> -->
|
||||||
<p class="now-secondary-title">{{ op.name }}</p>
|
|
||||||
<!-- </el-col> -->
|
<!-- </el-col> -->
|
||||||
</el-row>
|
</el-row>
|
||||||
<!-- <el-row>
|
|
||||||
<el-progress :percentage="100" class="custom-progress-bar" />
|
|
||||||
<p class="now-secondary-title" style="color:#4679FD">
|
|
||||||
<i class="el-icon-check" />
|
|
||||||
成都碲化镉5000一期订单
|
|
||||||
</p>
|
|
||||||
</el-row>
|
|
||||||
<el-row>
|
|
||||||
<el-progress :percentage="85" class="custom-progress-bar" />
|
|
||||||
<p class="now-secondary-title">成都碲化镉二订单</p>
|
|
||||||
</el-row>
|
|
||||||
<el-row>
|
|
||||||
<el-progress :percentage="85" class="custom-progress-bar" />
|
|
||||||
<p class="now-secondary-title">长利订单1000</p>
|
|
||||||
</el-row>
|
|
||||||
<el-row>
|
|
||||||
<el-progress :percentage="85" class="custom-progress-bar" />
|
|
||||||
<p class="now-secondary-title">国际工程20号订单</p>
|
|
||||||
</el-row>
|
|
||||||
<el-row>
|
|
||||||
<el-progress :percentage="85" class="custom-progress-bar" />
|
|
||||||
<p class="now-secondary-title">铜铟镓硒眉山10万订单</p>
|
|
||||||
</el-row> -->
|
|
||||||
</div>
|
</div>
|
||||||
<!-- </div> -->
|
<!-- </div> -->
|
||||||
</base-container>
|
</base-container>
|
||||||
@ -99,7 +80,8 @@
|
|||||||
|
|
||||||
<el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="12" type="flex" class="flex-1">
|
<el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="12" type="flex" class="flex-1">
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="12">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="12">
|
||||||
<base-container :height="256" :size="'middle'" :title="'能源监控'" :title-icon="'energyMonitoring'">
|
<base-container :no-content-padding="true" :height="256" :size="'middle'" :title="'能源监控'"
|
||||||
|
:title-icon="'energyMonitoring'">
|
||||||
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
||||||
<top-radio-group />
|
<top-radio-group />
|
||||||
</div> -->
|
</div> -->
|
||||||
@ -121,13 +103,13 @@
|
|||||||
</base-container>
|
</base-container>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="12">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="12">
|
||||||
<base-container :height="318 + 338 + 16" :size="'middle'" :title="'产线产量及良品率'" :title-icon="'productLine'">
|
<base-container :no-content-padding="true" :height="318 + 338 + 16" :size="'middle'" :title="'产线产量及良品率'"
|
||||||
|
:title-icon="'productLine'">
|
||||||
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
<!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
|
||||||
<top-radio-group />
|
<top-radio-group />
|
||||||
</div> -->
|
</div> -->
|
||||||
<!-- 像下面这样表格里的limit值，也许可以用js动态计算出来 -->
|
<!-- 像下面这样表格里的limit值，也许可以用js动态计算出来 -->
|
||||||
<double-y-chart ref="productLineChart" :id=" 'doubleYChart' " :name-list="cxNameList"
|
<double-y-chart ref="productLineChart" :id=" 'doubleYChart' " :height="359" :show-legend="true" />
|
||||||
:data-list="cxDataList" :height="359" :show-legend="true" />
|
|
||||||
</base-container>
|
</base-container>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
@ -422,21 +404,26 @@ const qualityYearTableProps = [
|
|||||||
]
|
]
|
||||||
|
|
||||||
const qualityYearList = [
|
const qualityYearList = [
|
||||||
{ name: '钢化炉', code: '21321312', status: '运行', error: '否' },
|
|
||||||
{ name: '磨边机', code: '32323232', status: '运行', error: '否' },
|
|
||||||
{ name: '镀膜机', code: '32213213', status: '运行', error: '否' },
|
|
||||||
{ name: '钢化清洗机', code: '21321323', status: '运行', error: '否' },
|
|
||||||
{ name: '固化机', code: '21321321', status: '运行', error: '否' },
|
|
||||||
{ name: '磨边清洗机', code: '21321321', status: '运行', error: '否' },
|
|
||||||
{ name: '预热机', code: '21321321', status: '故障', error: '是' },
|
|
||||||
{ name: '下片机', code: '21321321', status: '运行', error: '否' },
|
|
||||||
{
|
{
|
||||||
name: '冷却机', code: '21321321', status: '运行', error: '否' },
|
name: '翻转机', code: 'EQ20240110112358000235', status: '运行', error: '否' },
|
||||||
{
|
{
|
||||||
name: 'A储片机106', code: '21321321', status: '运行', error: '否' },
|
name: '烘干炉', code: 'EQ20240110112537000241', status: '运行', error: '否' },
|
||||||
{ name: '二次清洗机', code: '21321321', status: '运行', error: '否' },
|
{
|
||||||
{ name: '二次磨边机', code: '21321321', status: '故障', error: '是' },
|
name: '清洗机', code: ' EQ20240110112310000232', status: '运行', error: '否' },
|
||||||
{ name: '测试设备', code: '21321321', status: '运行', error: '否' }
|
{ name: '钢化清洗机', code: 'EQ20240110111700000208', status: '运行', error: '否' },
|
||||||
|
{ name: '固化机', code: 'EQ20240110111700000201', status: '运行', error: '否' },
|
||||||
|
{
|
||||||
|
name: '磨边清洗机', code: ' EQ20240110111700000208', status: '运行', error: '否' },
|
||||||
|
{ name: '预热机', code: 'EQ20240110111700000205', status: '故障', error: '是' },
|
||||||
|
{ name: '下片机', code: 'EQ20240115151435000279', status: '运行', error: '否' },
|
||||||
|
{
|
||||||
|
name: '冷却机', code: 'EQ20240110111700000203', status: '运行', error: '否' },
|
||||||
|
{
|
||||||
|
name: 'A储片机106', code: 'EQ20240110111700000202', status: '运行', error: '否' },
|
||||||
|
{ name: '二次清洗机', code: 'EQ20240110111700000209', status: '运行', error: '否' },
|
||||||
|
{
|
||||||
|
name: '二次磨边机', code: ' EQ20240110110927000181', status: '故障', error: '是' },
|
||||||
|
{ name: '测试设备', code: 'EQ20240110111700000201', status: '运行', error: '否' }
|
||||||
|
|
||||||
]
|
]
|
||||||
const qualityMonthTableProps = [
|
const qualityMonthTableProps = [
|
||||||
@ -461,43 +448,43 @@ const qualityMonthList = [
|
|||||||
{
|
{
|
||||||
productionLineName: 'Y61',
|
productionLineName: 'Y61',
|
||||||
sectionName: '成型',
|
sectionName: '成型',
|
||||||
count: '199片',
|
count: '3片',
|
||||||
inspectionTypeName: '细长泡'
|
inspectionTypeName: '细长泡'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
productionLineName: 'Y62',
|
productionLineName: 'Y62',
|
||||||
sectionName: '组合落板',
|
sectionName: '组合落板',
|
||||||
count: '123片',
|
count: '4片',
|
||||||
inspectionTypeName: '细长泡'
|
inspectionTypeName: '细长泡'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
productionLineName: 'Y61',
|
productionLineName: 'Y61',
|
||||||
sectionName: '磨边',
|
sectionName: '磨边',
|
||||||
count: '212片',
|
count: '6片',
|
||||||
inspectionTypeName: '开口泡'
|
inspectionTypeName: '开口泡'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
productionLineName: 'Y63',
|
productionLineName: 'Y63',
|
||||||
sectionName: '清洗',
|
sectionName: '清洗',
|
||||||
count: '33片',
|
count: '5片',
|
||||||
inspectionTypeName: '结石'
|
inspectionTypeName: '结石'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
productionLineName: 'Y64',
|
productionLineName: 'Y64',
|
||||||
sectionName: '打孔',
|
sectionName: '打孔',
|
||||||
count: '332片',
|
count: '2片',
|
||||||
inspectionTypeName: '结石'
|
inspectionTypeName: '结石'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
productionLineName: 'Y63',
|
productionLineName: 'Y63',
|
||||||
sectionName: '成型',
|
sectionName: '成型',
|
||||||
count: '432片',
|
count: '7片',
|
||||||
inspectionTypeName: '开口泡'
|
inspectionTypeName: '开口泡'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
productionLineName: 'Y61',
|
productionLineName: 'Y61',
|
||||||
sectionName: '上片',
|
sectionName: '上片',
|
||||||
count: '200片',
|
count: '8片',
|
||||||
inspectionTypeName: '结石'
|
inspectionTypeName: '结石'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
@ -547,6 +534,28 @@ export default {
|
|||||||
// offsetWidth: null,
|
// offsetWidth: null,
|
||||||
qualityYearTableProps,
|
qualityYearTableProps,
|
||||||
cxNameList,
|
cxNameList,
|
||||||
|
eqConfig: {
|
||||||
|
header: ['序号', '设备名称', '设备编码', '设备状态', '是否故障'],
|
||||||
|
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
|
columnWidth: [70, 100, 200, 90, 90,],
|
||||||
|
align: ['center'],
|
||||||
|
data: [],
|
||||||
|
// index:true,
|
||||||
|
rowNum: 10
|
||||||
|
},
|
||||||
|
processConfig: {
|
||||||
|
header: ['序号', '产线名称', '工序', '损耗片数', '缺陷类型'],
|
||||||
|
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
|
columnWidth: [70, 130, 100, 120, 110,],
|
||||||
|
align: ['center'],
|
||||||
|
data: [],
|
||||||
|
// index:true,
|
||||||
|
rowNum: 10
|
||||||
|
},
|
||||||
cxDataList,
|
cxDataList,
|
||||||
productLineList:[],
|
productLineList:[],
|
||||||
qualityYearList,
|
qualityYearList,
|
||||||
@ -607,8 +616,7 @@ export default {
|
|||||||
this.SJGInitWebSocket()
|
this.SJGInitWebSocket()
|
||||||
this.getTimes()
|
this.getTimes()
|
||||||
this.$refs.EnergyMonitoringChart.initChart(['Y61', 'Y62', 'Y63', 'Y64', 'Y65',], [3134, 2323, 3232, 3233, 2321])
|
this.$refs.EnergyMonitoringChart.initChart(['Y61', 'Y62', 'Y63', 'Y64', 'Y65',], [3134, 2323, 3232, 3233, 2321])
|
||||||
this.$refs.productLineChart.initChart(['Y61', 'Y62', 'Y63', 'Y64', 'Y65',], ['98', '97', '98.7', '98.5', '98.3',], ['4532', '1223', '3442', '4343', '2232'])
|
this.$refs.productLineChart.initChart(['Y61', 'Y62', 'Y63', 'Y64', 'Y65',], [98, 97, 98.7, 98.5, 98.3,], [3134, 2323, 3232, 3233, 2321])
|
||||||
|
|
||||||
const _this = this;
|
const _this = this;
|
||||||
_this.beilv2 = document.documentElement.clientWidth / 1920
|
_this.beilv2 = document.documentElement.clientWidth / 1920
|
||||||
window.onresize = () => {
|
window.onresize = () => {
|
||||||
@ -651,13 +659,43 @@ export default {
|
|||||||
// console.log('11111', res);
|
// console.log('11111', res);
|
||||||
this.productLineList = res.data
|
this.productLineList = res.data
|
||||||
})
|
})
|
||||||
// this.$axios.get(
|
this.$axios.get(
|
||||||
// 'base/quality-inspection-record/dayStatistics',
|
'base/quality-inspection-record/dayStatistics',
|
||||||
// 'get',
|
'get',
|
||||||
// ).then((res) => {
|
).then((res) => {
|
||||||
// // console.log('11111', res);
|
// console.log('11111', res);
|
||||||
// this.qualityMonthList = res.data ? res.data : []
|
if (res.data.length !==0) {
|
||||||
// })
|
let processArr = res.data.map((item, index) => [
|
||||||
|
// console.log(item)
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
</span>`,
|
||||||
|
// formatDate(item.planStartTime) || '',
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${item.productionLineName || ''}
|
||||||
|
</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.sectionName || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.count || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.inspectionTypeName || ''}</span>`,
|
||||||
|
])
|
||||||
|
this.processConfig.data = processArr
|
||||||
|
this.$refs['processScrollBoard'].updateRows(processArr)
|
||||||
|
} else {
|
||||||
|
let processArr = qualityMonthList.map((item, index) => [
|
||||||
|
// console.log(item)
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
</span>`,
|
||||||
|
// formatDate(item.planStartTime) || '',
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${item.productionLineName || ''}
|
||||||
|
</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.sectionName || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.count || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.inspectionTypeName || ''}</span>`,
|
||||||
|
])
|
||||||
|
this.processConfig.data = processArr
|
||||||
|
this.$refs['processScrollBoard'].updateRows(processArr)
|
||||||
|
}
|
||||||
|
})
|
||||||
},
|
},
|
||||||
getTimes() {
|
getTimes() {
|
||||||
setInterval(this.getTimesInterval, 1000);
|
setInterval(this.getTimesInterval, 1000);
|
||||||
@ -752,17 +790,31 @@ export default {
|
|||||||
});
|
});
|
||||||
console.log(this.orderList)
|
console.log(this.orderList)
|
||||||
} else if (this.SJGWsData.type === 'equipment') {
|
} else if (this.SJGWsData.type === 'equipment') {
|
||||||
this.equipmentList = this.SJGWsData.detData.map((ele, index) => {
|
// this.equipmentList = this.SJGWsData.detData.map((ele, index) => {
|
||||||
// if (ele.progressRate != 1) {
|
// // if (ele.progressRate != 1) {
|
||||||
return {
|
// return {
|
||||||
id: ele.id,
|
// id: ele.id,
|
||||||
name: ele.name,
|
// name: ele.name,
|
||||||
code: ele.code,
|
// code: ele.code,
|
||||||
status: ele.status,
|
// status: ele.status,
|
||||||
error: ele.error=== true ? '是' : '否'
|
// error: ele.error=== true ? '是' : '否'
|
||||||
}
|
|
||||||
// }
|
// }
|
||||||
});
|
// // }
|
||||||
|
// });
|
||||||
|
let eqArr = this.SJGWsData.detData.map((item, index) => [
|
||||||
|
// console.log(item)
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
</span>`,
|
||||||
|
// formatDate(item.planStartTime) || '',
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${item.name || ''}
|
||||||
|
</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.code || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.status || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.error || ''}</span>`,
|
||||||
|
])
|
||||||
|
this.eqConfig.data = eqArr
|
||||||
|
this.$refs['eqScrollBoard'].updateRows(eqArr)
|
||||||
// console.log(SJGWsData.orderList)
|
// console.log(SJGWsData.orderList)
|
||||||
} else if (this.SJGWsData.type === 'productline') {
|
} else if (this.SJGWsData.type === 'productline') {
|
||||||
// console.log(this.wsData.detData);
|
// console.log(this.wsData.detData);
|
||||||
@ -792,6 +844,22 @@ export default {
|
|||||||
// console.log(this.EnergyMonitoringList)
|
// console.log(this.EnergyMonitoringList)
|
||||||
// this.$nextTick(() => {
|
// this.$nextTick(() => {
|
||||||
// this.$refs.productLineChart.initChart(Array.from(new Set(nameList)), passRateList, outputNumList)
|
// this.$refs.productLineChart.initChart(Array.from(new Set(nameList)), passRateList, outputNumList)
|
||||||
|
} else {
|
||||||
|
console.log(this.qualityYearList);
|
||||||
|
|
||||||
|
let eqArr = this.qualityYearList.map((item,index) => [
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
</span>`,
|
||||||
|
// formatDate(item.planStartTime) || '',
|
||||||
|
`
|
||||||
|
<span style="color:rgba(255,255,255,0.5)" >${item.name || ''}
|
||||||
|
</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.code || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.status || ''}</span>`,
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)">${item.error || ''}</span>`,
|
||||||
|
])
|
||||||
|
this.eqConfig.data = eqArr
|
||||||
|
this.$refs['eqScrollBoard'].updateRows(eqArr)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 数据发送
|
// 数据发送
|
||||||
@ -976,10 +1044,6 @@ export default {
|
|||||||
background-color: unset;
|
background-color: unset;
|
||||||
background-image: linear-gradient(to right, #4573fe, #47f8dc);
|
background-image: linear-gradient(to right, #4573fe, #47f8dc);
|
||||||
}
|
}
|
||||||
// ::v-deep .el-progress-bar__outer {
|
|
||||||
// background-color:rgba(71, 248, 220, 1);
|
|
||||||
// // background-image: rgba(71, 248, 220, 1))
|
|
||||||
// }
|
|
||||||
.visual-select {
|
.visual-select {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 1em;
|
right: 1em;
|
||||||
@ -1049,7 +1113,6 @@ export default {
|
|||||||
margin-left: 3em;
|
margin-left: 3em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
@ -1061,9 +1124,12 @@ export default {
|
|||||||
flex: 1 1;
|
flex: 1 1;
|
||||||
}
|
}
|
||||||
.h-full {
|
.h-full {
|
||||||
height: calc(100vh - 150px);
|
height: calc(100vh);
|
||||||
}
|
}
|
||||||
/* .container-main {
|
/* .container-main {
|
||||||
min-height: calc(100vh - 10em);
|
min-height: calc(100vh - 10em);
|
||||||
} */
|
} */
|
||||||
|
.eqTable{
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -11,7 +11,7 @@
|
|||||||
<i
|
<i
|
||||||
class=""
|
class=""
|
||||||
style="display: inline-block; margin-left: 12px; padding-top: 4px">
|
style="display: inline-block; margin-left: 12px; padding-top: 4px">
|
||||||
<img :src="imgSrc" width="20" height="20" alt="" />
|
<img :src="imgSrc" width="24" height="24" alt="" />
|
||||||
</i>
|
</i>
|
||||||
<span
|
<span
|
||||||
style="
|
style="
|
||||||
@ -107,6 +107,19 @@ export default {
|
|||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
background-position: 0 0;
|
background-position: 0 0;
|
||||||
}
|
}
|
||||||
|
&::after {
|
||||||
|
content: " ";
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
// background: inherit;
|
||||||
|
/* 设置模糊，不用 filter */
|
||||||
|
backdrop-filter: blur(5px);
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.container-body {
|
.container-body {
|
||||||
|
|||||||
@ -158,7 +158,7 @@ export default {
|
|||||||
grid: { top: 90, right: 12, bottom: 20, left: 70 },
|
grid: { top: 90, right: 12, bottom: 20, left: 70 },
|
||||||
legend: {
|
legend: {
|
||||||
top: 0,
|
top: 0,
|
||||||
left: 100,
|
left: 8,
|
||||||
padding: 5,
|
padding: 5,
|
||||||
itemWidth: 12,
|
itemWidth: 12,
|
||||||
itemHeight: 12,
|
itemHeight: 12,
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<NotMsg v-show="notMsg"/>
|
<NotMsg v-show="notMsg"/>
|
||||||
<div id="energeMonitoringChart" class="energe-monitoring-chart" style="width:575px;height:370px;" v-show='!notMsg'></div>
|
<div id="energeMonitoringChart" class="energe-monitoring-chart" style="width:575px;height:420px;" v-show='!notMsg'></div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@ -63,7 +63,7 @@ export default {
|
|||||||
}
|
}
|
||||||
var option = {
|
var option = {
|
||||||
// color: ['#FF8A40','#FFD160','#99D66C','#5B9BFF','#8167F6','#2760FF'],
|
// color: ['#FF8A40','#FFD160','#99D66C','#5B9BFF','#8167F6','#2760FF'],
|
||||||
grid: { top: 32, right: 12, bottom: 20, left: 90 },
|
grid: { top: 82, right: 12, bottom: 20, left: 90 },
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: 'axis',
|
trigger: 'axis',
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
@ -75,7 +75,11 @@ export default {
|
|||||||
className: "energe-monitoring-chart-tooltip"
|
className: "energe-monitoring-chart-tooltip"
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
data: ['电耗能'],
|
itemWidth:10,
|
||||||
|
itemHeight:10,
|
||||||
|
top: '2.5%',
|
||||||
|
right: '0',
|
||||||
|
data: [{name:'电耗能',itemStyle:{color:'#364BFE'}}],
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: "#DFF1FE",
|
color: "#DFF1FE",
|
||||||
fontSize: 12,
|
fontSize: 12,
|
||||||
@ -157,6 +161,7 @@ export default {
|
|||||||
.energe-monitoring-chart {
|
.energe-monitoring-chart {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
top: -50px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<style>
|
<style>
|
||||||
|
|||||||
@ -1,12 +1,12 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<NotMsg v-show="notMsg"/>
|
<NotMsg v-show="notMsg"/>
|
||||||
<div id='flueGasChart' class="flue-gas-chart" style="width:600px;height:250px;" v-show='!notMsg'></div>
|
<div id='flueGasChart' class="flue-gas-chart" style="width:575px;height:250px;" v-show='!notMsg'></div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import * as echarts from 'echarts';
|
import * as echarts from 'echarts'
|
||||||
import resize from './../mixins/resize'
|
import resize from './../mixins/resize'
|
||||||
import NotMsg from './../components/NotMsg'
|
import NotMsg from './../components/NotMsg'
|
||||||
|
|
||||||
@ -149,7 +149,7 @@ export default {
|
|||||||
}
|
}
|
||||||
temp2.map(i => {
|
temp2.map(i => {
|
||||||
xData.push(i.time)
|
xData.push(i.time)
|
||||||
yData.push(i.value)
|
yData.push((i.value)?(Number(i.value)).toFixed(2):null)
|
||||||
})
|
})
|
||||||
if (yData.length == 0) {
|
if (yData.length == 0) {
|
||||||
seriesData = []
|
seriesData = []
|
||||||
@ -168,7 +168,8 @@ export default {
|
|||||||
lineStyle: {
|
lineStyle: {
|
||||||
width: 1
|
width: 1
|
||||||
},
|
},
|
||||||
symbolSize: 1,
|
symbol: 'circle',
|
||||||
|
symbolSize: 5,
|
||||||
emphasis: {
|
emphasis: {
|
||||||
focus: 'series'
|
focus: 'series'
|
||||||
}
|
}
|
||||||
|
|||||||
@ -164,7 +164,8 @@ export default {
|
|||||||
lineStyle: {
|
lineStyle: {
|
||||||
width: 1
|
width: 1
|
||||||
},
|
},
|
||||||
symbolSize: 1,
|
symbol: 'circle',
|
||||||
|
symbolSize: 5,
|
||||||
emphasis: {
|
emphasis: {
|
||||||
focus: 'series'
|
focus: 'series'
|
||||||
}
|
}
|
||||||
|
|||||||
@ -60,15 +60,15 @@ export default {
|
|||||||
}
|
}
|
||||||
this.chart = echarts.init(document.getElementById('israChart'));
|
this.chart = echarts.init(document.getElementById('israChart'));
|
||||||
var option = {
|
var option = {
|
||||||
|
color:this.colors,
|
||||||
title:{
|
title:{
|
||||||
text: num,
|
text: num,
|
||||||
subtext: '总数',
|
subtext: '总数',
|
||||||
top: '43%',
|
top: '32%',
|
||||||
left: '49%',
|
left: '49%',
|
||||||
textAlign: 'center',
|
textAlign: 'center',
|
||||||
textStyle: {
|
textStyle: {
|
||||||
fontSize: 32,
|
fontSize: 32,
|
||||||
lineHeight: 16,
|
|
||||||
color: '#fff',
|
color: '#fff',
|
||||||
},
|
},
|
||||||
subtextStyle: {
|
subtextStyle: {
|
||||||
@ -77,12 +77,20 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
bottom: '3%',
|
bottom: '2%',
|
||||||
left: 'center',
|
left: 'center',
|
||||||
|
itemWidth: 18,
|
||||||
|
itemHeight:18,
|
||||||
icon: 'circle',
|
icon: 'circle',
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: '#fff'
|
color: '#fff'
|
||||||
|
},
|
||||||
|
data:this.chartData && this.chartData.length > 0 && this.chartData.map((item,index)=>({
|
||||||
|
name:item.name,
|
||||||
|
itemStyle:{
|
||||||
|
color: this.colors[index%4]
|
||||||
}
|
}
|
||||||
|
}))
|
||||||
},
|
},
|
||||||
series:[{
|
series:[{
|
||||||
name: 'ISRA缺陷检测',
|
name: 'ISRA缺陷检测',
|
||||||
@ -96,9 +104,6 @@ export default {
|
|||||||
labelLine: {
|
labelLine: {
|
||||||
show: true,
|
show: true,
|
||||||
},
|
},
|
||||||
itemStyle: {
|
|
||||||
borderRadius: 12
|
|
||||||
},
|
|
||||||
data: this.chartData && this.chartData.length > 0 && this.chartData.map((item, index) => ({
|
data: this.chartData && this.chartData.length > 0 && this.chartData.map((item, index) => ({
|
||||||
name:item.name,
|
name:item.name,
|
||||||
value: item.num,
|
value: item.num,
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<NotMsg v-show="notMsg"/>
|
<NotMsg v-show="notMsg"/>
|
||||||
<div id="numRateChart" class="num-rate-chart" style="width:900px;height:370px;" v-show='!notMsg'></div>
|
<div id="numRateChart" class="num-rate-chart" style="width:900px;height:420px;" v-show='!notMsg'></div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@ -29,7 +29,7 @@ export default {
|
|||||||
if (newVal === oldVal) {
|
if (newVal === oldVal) {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
// this.updateChart()
|
this.updateChart()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -53,7 +53,7 @@ export default {
|
|||||||
this.productline && this.productline.length > 0 && this.productline.map(item => {
|
this.productline && this.productline.length > 0 && this.productline.map(item => {
|
||||||
xData.push(item.lineName)
|
xData.push(item.lineName)
|
||||||
outputNum.push(item.outputNum)
|
outputNum.push(item.outputNum)
|
||||||
passRate.push(item.passRate*100)
|
passRate.push(item.passRate?item.passRate*100:null)
|
||||||
})
|
})
|
||||||
if (
|
if (
|
||||||
this.chart !== null &&
|
this.chart !== null &&
|
||||||
@ -64,7 +64,7 @@ export default {
|
|||||||
}
|
}
|
||||||
this.chart = echarts.init(document.getElementById('numRateChart'));
|
this.chart = echarts.init(document.getElementById('numRateChart'));
|
||||||
var option = {
|
var option = {
|
||||||
grid: { top: 32, right: 60, bottom: 20, left: 60 },
|
grid: { top: 82, right: 60, bottom: 20, left: 60 },
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: "axis",
|
trigger: "axis",
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
@ -73,7 +73,15 @@ export default {
|
|||||||
className: "num-rate-chart-tooltip"
|
className: "num-rate-chart-tooltip"
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
data: ['产线产量', '良品率'],
|
itemWidth:10,
|
||||||
|
itemHeight:10,
|
||||||
|
top: '2.5%',
|
||||||
|
right: '20px',
|
||||||
|
icon: 'rect',
|
||||||
|
data: [
|
||||||
|
{name:'产线产量',itemStyle:{color:'#364BFE'}},
|
||||||
|
{name:'良品率',itemStyle:{color:'#FFCB59'}}
|
||||||
|
],
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: "#DFF1FE",
|
color: "#DFF1FE",
|
||||||
fontSize: 12,
|
fontSize: 12,
|
||||||
@ -136,7 +144,10 @@ export default {
|
|||||||
axisLabel: {
|
axisLabel: {
|
||||||
color: "#fff",
|
color: "#fff",
|
||||||
fontSize: 12,
|
fontSize: 12,
|
||||||
formatter: '{value} %'
|
formatter: () =>{
|
||||||
|
console.log(value)
|
||||||
|
return value ? '{value} %': '-'
|
||||||
|
}
|
||||||
},
|
},
|
||||||
axisLine: {
|
axisLine: {
|
||||||
show: true,
|
show: true,
|
||||||
@ -160,7 +171,7 @@ export default {
|
|||||||
return value;
|
return value;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
barWidth: 12,
|
barWidth: 20,
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||||
{ offset: 0, color: '#5CB7FF' },
|
{ offset: 0, color: '#5CB7FF' },
|
||||||
@ -175,7 +186,7 @@ export default {
|
|||||||
yAxisIndex: 1,
|
yAxisIndex: 1,
|
||||||
tooltip: {
|
tooltip: {
|
||||||
valueFormatter: function (value) {
|
valueFormatter: function (value) {
|
||||||
return value + '%';
|
return value?value + '%':'-';
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
@ -191,6 +202,8 @@ export default {
|
|||||||
lineStyle: {
|
lineStyle: {
|
||||||
width: 1
|
width: 1
|
||||||
},
|
},
|
||||||
|
symbol: 'circle',
|
||||||
|
symbolSize: 5,
|
||||||
data: passRate
|
data: passRate
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
@ -204,6 +217,7 @@ export default {
|
|||||||
.num-rate-chart {
|
.num-rate-chart {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
top: -50px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<style>
|
<style>
|
||||||
|
|||||||
@ -26,7 +26,8 @@ export default {
|
|||||||
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
columnWidth: [60],
|
columnWidth: [60],
|
||||||
align: ['center'],
|
align: ['center'],
|
||||||
data: [[1, 'Y61', '破损','10','气泡']],
|
data: [],
|
||||||
|
// data: [[1, 'Y61', '破损','10','气泡']],
|
||||||
rowNum: 10
|
rowNum: 10
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -26,38 +26,39 @@ export default {
|
|||||||
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
columnWidth: [60, 150, 190],
|
columnWidth: [60, 150, 190],
|
||||||
align: ['center'],
|
align: ['center'],
|
||||||
data: [
|
data: [],
|
||||||
[1, '四大线3小线铺纸机', 'EQ20240110130909000255', '正常', '否'],
|
// data: [
|
||||||
[2, '四大线2小线铺纸机', 'EQ20240110130848000254', '正常', '否'],
|
// [1, '四大线3小线铺纸机', 'EQ20240110130909000255', '正常', '否'],
|
||||||
[3, '四大线1小线铺纸机', 'EQ20240110130832000253', '正常', '否'],
|
// [2, '四大线2小线铺纸机', 'EQ20240110130848000254', '正常', '否'],
|
||||||
[4, '12线下片台', 'EQ20240110130817000252', '正常', '否'],
|
// [3, '四大线1小线铺纸机', 'EQ20240110130832000253', '正常', '否'],
|
||||||
[5, '11线下片台', ' EQ20240110130743000250', '正常', '否'],
|
// [4, '12线下片台', 'EQ20240110130817000252', '正常', '否'],
|
||||||
[6, '10线下片台', ' EQ20240110130743000250', '正常', '否'],
|
// [5, '11线下片台', ' EQ20240110130743000250', '正常', '否'],
|
||||||
[7, '4大线五区自动连线柜', 'EQ20240110130731000249', '正常', '否'],
|
// [6, '10线下片台', ' EQ20240110130743000250', '正常', '否'],
|
||||||
[8, '四大线四区2小线清洗机', 'EQ20240110112716000248', '正常', '否'],
|
// [7, '4大线五区自动连线柜', 'EQ20240110130731000249', '正常', '否'],
|
||||||
[9, '四大线四区1小线清洗机', 'EQ20240110112700000247', '正常', '否'],
|
// [8, '四大线四区2小线清洗机', 'EQ20240110112716000248', '正常', '否'],
|
||||||
[10, '4大线四区自动连线柜', 'EQ20240110112646000246', '正常', '否']
|
// [9, '四大线四区1小线清洗机', 'EQ20240110112700000247', '正常', '否'],
|
||||||
],
|
// [10, '4大线四区自动连线柜', 'EQ20240110112646000246', '正常', '否']
|
||||||
|
// ],
|
||||||
rowNum: 10
|
rowNum: 10
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted(){
|
mounted(){
|
||||||
},
|
},
|
||||||
// watch:{
|
watch:{
|
||||||
// sjgEquipment: {
|
sjgEquipment: {
|
||||||
// handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
// let outArr = this.sjgEquipment.map((item, index) => [
|
let outArr = this.sjgEquipment.map((item, index) => [
|
||||||
// index+1,
|
index+1,
|
||||||
// item.name,
|
`<span title=${item.name || ''}>${item.name || ''}</span>`,
|
||||||
// item.code,
|
`<span title=${item.code || ''}>${item.code || ''}</span>`,
|
||||||
// item.status,
|
item.status,
|
||||||
// item.error? '是': '否'
|
item.error? '是': '否'
|
||||||
// ]);
|
]);
|
||||||
// this.config.data = outArr
|
this.config.data = outArr
|
||||||
// this.$refs['eqScrollBoard'].updateRows(outArr)
|
this.$refs['eqScrollBoard'].updateRows(outArr)
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@ -37,10 +37,10 @@ export default {
|
|||||||
handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
let outArr = this.order.map((item, index) => [
|
let outArr = this.order.map((item, index) => [
|
||||||
index+1,
|
index+1,
|
||||||
item.name,
|
`<span title=${item.name || ''}>${item.name || ''}</span>`,
|
||||||
item.specifications,
|
item.specifications,
|
||||||
item.lines,
|
item.lines,
|
||||||
['等待','已下发','已完成'][item.status],
|
this.getDictDatas(this.DICT_TYPE.ORDER_STATUS)[item.status]?.label,
|
||||||
formatDate(item.planFinishTime),
|
formatDate(item.planFinishTime),
|
||||||
item.planQuantity,
|
item.planQuantity,
|
||||||
item.planAssignQuantity
|
item.planAssignQuantity
|
||||||
|
|||||||
@ -117,7 +117,7 @@ export default {
|
|||||||
screenfull.toggle(this.$refs.deepProcessingContainerB)
|
screenfull.toggle(this.$refs.deepProcessingContainerB)
|
||||||
},
|
},
|
||||||
resetSize() {
|
resetSize() {
|
||||||
let deepProcessingContainer = document.querySelector('#deepProcessingContainer')
|
let deepProcessingContainer = document.getElementById('deepProcessingContainer')
|
||||||
let rw = parseFloat(window.innerWidth)
|
let rw = parseFloat(window.innerWidth)
|
||||||
let rh = parseFloat(window.innerHeight)
|
let rh = parseFloat(window.innerHeight)
|
||||||
let bw = parseFloat(deepProcessingContainer.style.width)
|
let bw = parseFloat(deepProcessingContainer.style.width)
|
||||||
@ -133,10 +133,10 @@ export default {
|
|||||||
console.log('非全屏')
|
console.log('非全屏')
|
||||||
console.log(this.$store.state.app.sidebar.opened)
|
console.log(this.$store.state.app.sidebar.opened)
|
||||||
if (this.$store.state.app.sidebar.opened) {
|
if (this.$store.state.app.sidebar.opened) {
|
||||||
wx = (rw-264) / bw
|
wx = (rw-280) / bw
|
||||||
hx = (rh-116) / bh
|
hx = (rh-116) / bh
|
||||||
}else{
|
}else{
|
||||||
wx = (rw-78) / bw
|
wx = (rw-85) / bw
|
||||||
hx = (rh-116) / bh
|
hx = (rh-116) / bh
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -29,26 +29,26 @@
|
|||||||
<div
|
<div
|
||||||
style="
|
style="
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
line-height: 1.5;
|
line-height: 1.24;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
padding-right: 8px;
|
padding:5px 8px 5px 0;
|
||||||
letter-spacing: 3px;
|
letter-spacing: 3px;
|
||||||
">
|
">
|
||||||
<p style="margin: 0; line-height: inherit">氮氧化物</p>
|
<p style="margin: 0; line-height: inherit">氮氧化物</p>
|
||||||
<p style="margin: 0; line-height: inherit">排放浓度</p>
|
<p style="margin: 0; line-height: inherit">排放浓度</p>
|
||||||
</div>
|
</div>
|
||||||
<span style="font-size: 20px; line-height: 1.24; flex: 1">{{exhaustGasInfo?.NOX_float ? (Number(exhaustGasInfo.NOX_float)).toFixed(2) : ''}}mg/m³</span>
|
<span style="font-size: 20px; line-height: 1.24; flex: 1.2">{{exhaustGasInfo?.NOX_float ? (Number(exhaustGasInfo.NOX_float)).toFixed(2) : ''}}mg/m³</span>
|
||||||
</ShadowRect>
|
</ShadowRect>
|
||||||
|
|
||||||
<ShadowRect>
|
<ShadowRect>
|
||||||
<div
|
<div
|
||||||
style="
|
style="
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
line-height: 1.5;
|
line-height: 1.24;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
padding-right: 8px;
|
padding:5px 8px 5px 0;
|
||||||
letter-spacing: 3px;
|
letter-spacing: 3px;
|
||||||
">
|
">
|
||||||
<p style="margin: 0; line-height: inherit">二氧化硫</p>
|
<p style="margin: 0; line-height: inherit">二氧化硫</p>
|
||||||
@ -69,7 +69,7 @@
|
|||||||
">
|
">
|
||||||
颗粒物浓度
|
颗粒物浓度
|
||||||
</span>
|
</span>
|
||||||
<span style="font-size: 20px; line-height: 1.24; flex: 1">{{exhaustGasInfo?.dust_float ? (Number(exhaustGasInfo.dust_float)).toFixed(2) : ''}}mg/m³</span>
|
<span style="font-size: 20px; line-height: 1.24; flex: 1.2">{{exhaustGasInfo?.dust_float ? (Number(exhaustGasInfo.dust_float)).toFixed(2) : ''}}mg/m³</span>
|
||||||
</ShadowRect>
|
</ShadowRect>
|
||||||
</div>
|
</div>
|
||||||
<KilnLine :horizontal="true" />
|
<KilnLine :horizontal="true" />
|
||||||
|
|||||||
@ -6,7 +6,7 @@
|
|||||||
class="KilnDataBoard"
|
class="KilnDataBoard"
|
||||||
style="
|
style="
|
||||||
position: absolute;
|
position: absolute;
|
||||||
transform-origin: left top;
|
transform-origin: 16px 8px;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
top: 0px;
|
top: 0px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
@ -110,7 +110,8 @@ export default {
|
|||||||
screenfull.toggle(this.$refs.kilnContainerB)
|
screenfull.toggle(this.$refs.kilnContainerB)
|
||||||
},
|
},
|
||||||
resetSize() {
|
resetSize() {
|
||||||
let kilnContainerBox = document.querySelector('#kilnContainer')
|
let kilnContainerBox = document.getElementById('kilnContainer')
|
||||||
|
console.log(kilnContainerBox)
|
||||||
let rw = parseFloat(window.innerWidth)
|
let rw = parseFloat(window.innerWidth)
|
||||||
let rh = parseFloat(window.innerHeight)
|
let rh = parseFloat(window.innerHeight)
|
||||||
let bw = parseFloat(kilnContainerBox.style.width)
|
let bw = parseFloat(kilnContainerBox.style.width)
|
||||||
@ -126,10 +127,10 @@ export default {
|
|||||||
console.log('非全屏')
|
console.log('非全屏')
|
||||||
console.log(this.$store.state.app.sidebar.opened)
|
console.log(this.$store.state.app.sidebar.opened)
|
||||||
if (this.$store.state.app.sidebar.opened) {
|
if (this.$store.state.app.sidebar.opened) {
|
||||||
wx = (rw-264) / bw
|
wx = (rw-280) / bw
|
||||||
hx = (rh-116) / bh
|
hx = (rh-116) / bh
|
||||||
}else{
|
}else{
|
||||||
wx = (rw-78) / bw
|
wx = (rw-85) / bw
|
||||||
hx = (rh-116) / bh
|
hx = (rh-116) / bh
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -25,7 +25,7 @@ export default {
|
|||||||
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
columnWidth: [155, 180, 150],
|
columnWidth: [155, 160, 150],
|
||||||
data: [],
|
data: [],
|
||||||
rowNum: 6
|
rowNum: 6
|
||||||
}
|
}
|
||||||
@ -34,17 +34,17 @@ export default {
|
|||||||
mounted() {},
|
mounted() {},
|
||||||
watch:{
|
watch:{
|
||||||
order:{
|
order:{
|
||||||
handler(newVal, oldVal) {
|
handler() {
|
||||||
let outArr = this.order.map((item) => [
|
let outArr = this.order.map((item) => [
|
||||||
formatDate(item.planStartTime) || '',
|
formatDate(item.planStartTime) || '',
|
||||||
`<span title=${item.customerName || ''}>${item.customerName || ''}</span>`,
|
`<span title=${item.customerName || ''}>${item.customerName || ''}</span>`,
|
||||||
`<span title=${item.specifications || ''}>${item.specifications || ''}</span>`,
|
`<span title=${item.specifications || ''}>${item.specifications || ''}</span>`,
|
||||||
`<span style="display:inline-block;width:40px;">${item.completeRate?(item.completeRate*100).toFixed(2)+'%':'0%'}</span>
|
`<span style="display:inline-block;width:60px;">${item.completeRate?(item.completeRate*100).toFixed(2)+'%':'0%'}</span>
|
||||||
<div class="box" style="display:inline-block;">
|
<div style="display:inline-block;height:20px;margin-top:-5px;vertical-align:middle;">
|
||||||
<div class="bg"></div>
|
<svg xmlns="http://www.w3.org/200/svg" height="20" width="20">
|
||||||
<div class="rount" style="-webkit-transform:rotate(${(item.completeRate?(item.completeRate*100).toFixed(2):0)<=50?3.6*item.completeRate*100:180}deg)"></div>
|
<circle cx="10" cy="10" r="6" fill="none" stroke="#283851" stroke-width="4" stroke-linecap="round"/>
|
||||||
<div class="bg2"></div>
|
<circle style="transform-origin: center;transform: rotate(-90deg);" id="J_progress_bar" cx="10" cy="10" r="6" fill="none" stroke="#47FF27" stroke-width="4" stroke-dasharray="${item.completeRate?item.completeRate.toFixed(2)*37.68+','+((1-item.completeRate.toFixed(2))*37.68):(0+','+37.68)}"/>
|
||||||
<div style="${item.completeRate*100>50?'display:block;-webkit-transform:rotate('+3.6*(item.completeRate*100-50)+'deg)':'display:none;'}" class="rount2"></div>
|
</svg>
|
||||||
</div>`
|
</div>`
|
||||||
]);
|
]);
|
||||||
this.config.data = outArr
|
this.config.data = outArr
|
||||||
@ -54,13 +54,3 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang='scss'>
|
|
||||||
.orderContainer {
|
|
||||||
.box{width:16px;height:12px;margin:1px auto;position:relative;}
|
|
||||||
.box div{position:absolute;top:0;left:0;border-radius:50%;height:16px;width:16px;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;}
|
|
||||||
.box .bg{border:silver 4px solid}
|
|
||||||
.box .bg2{border:silver 4px solid;clip:rect(0,8px,20px,0);}
|
|
||||||
.box .rount{border:#47FF27 4px solid;clip:rect(0,8px,24px,0);-webkit-transform:rotate(0deg);}
|
|
||||||
.box .rount2{border:#47FF27 4px solid;clip:rect(0,40px,40px,8px);-webkit-transform:rotate(0deg);display:none}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -107,7 +107,7 @@ export default {
|
|||||||
screenfull.toggle(this.$refs.wholePlantContainerB)
|
screenfull.toggle(this.$refs.wholePlantContainerB)
|
||||||
},
|
},
|
||||||
resetSize() {
|
resetSize() {
|
||||||
let wholePlantContainerBox = document.querySelector('#wholePlantContainer')
|
let wholePlantContainerBox = document.getElementById('wholePlantContainer')
|
||||||
let rw = parseFloat(window.innerWidth)
|
let rw = parseFloat(window.innerWidth)
|
||||||
let rh = parseFloat(window.innerHeight)
|
let rh = parseFloat(window.innerHeight)
|
||||||
let bw = parseFloat(wholePlantContainerBox.style.width)
|
let bw = parseFloat(wholePlantContainerBox.style.width)
|
||||||
@ -123,10 +123,10 @@ export default {
|
|||||||
console.log('非全屏')
|
console.log('非全屏')
|
||||||
console.log(this.$store.state.app.sidebar.opened)
|
console.log(this.$store.state.app.sidebar.opened)
|
||||||
if (this.$store.state.app.sidebar.opened) {
|
if (this.$store.state.app.sidebar.opened) {
|
||||||
wx = (rw-264) / bw
|
wx = (rw-280) / bw
|
||||||
hx = (rh-116) / bh
|
hx = (rh-116) / bh
|
||||||
}else{
|
}else{
|
||||||
wx = (rw-78) / bw
|
wx = (rw-85) / bw
|
||||||
hx = (rh-116) / bh
|
hx = (rh-116) / bh
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -132,7 +132,7 @@ export default {
|
|||||||
.chartBox {
|
.chartBox {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding-right: 6px;
|
padding-right: 6px;
|
||||||
height: calc(100vh - 310px);
|
height: calc(100vh - 356px);
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: row wrap;
|
flex-flow: row wrap;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
|||||||
@ -28,6 +28,9 @@
|
|||||||
@clickBtn="handleClick"
|
@clickBtn="handleClick"
|
||||||
/>
|
/>
|
||||||
</base-table>
|
</base-table>
|
||||||
|
</div>
|
||||||
|
<!-- 图 -->
|
||||||
|
<monitoring-ring-charts ref='monitoringRingCharts' v-else :chart-list='chartList'/>
|
||||||
<pagination
|
<pagination
|
||||||
:page.sync="queryParams.pageNo"
|
:page.sync="queryParams.pageNo"
|
||||||
:limit.sync="queryParams.pageSize"
|
:limit.sync="queryParams.pageSize"
|
||||||
@ -35,9 +38,6 @@
|
|||||||
@pagination="getPage"
|
@pagination="getPage"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<!-- 图 -->
|
|
||||||
<monitoring-ring-charts ref='monitoringRingCharts' v-else :chart-list='chartList'/>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import { parseTime } from '@/utils/ruoyi'
|
import { parseTime } from '@/utils/ruoyi'
|
||||||
|
|||||||
@ -104,7 +104,7 @@ export default {
|
|||||||
label: '工段',
|
label: '工段',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'inspectionDetContent',
|
prop: 'inspectionInfoList',
|
||||||
label: '检测内容',
|
label: '检测内容',
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
@ -133,17 +133,23 @@ export default {
|
|||||||
// this.getList();
|
// this.getList();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
/** 查询列表 */
|
getDataList() {
|
||||||
// getList() {
|
this.dataListLoading = true;
|
||||||
// this.loading = true;
|
this.urlOptions.getDataListURL(this.listQuery).then(response => {
|
||||||
// // 执行查询
|
this.tableData = response.data.map((item) => {
|
||||||
// getQualityInspectionBoxBtnPage(this.listQuery).then((response) => {
|
// console.log(item);
|
||||||
// this.list = response.data.list;
|
return {
|
||||||
// this.total = response.data.total;
|
inspectionInfoList: item.inspectionInfoList.toString(),
|
||||||
// this.loading = false;
|
productionLineId:item.productionLineId,
|
||||||
// });
|
productionLineName:item.productionLineName,
|
||||||
// },
|
sectionId: item.sectionId,
|
||||||
/** 表单重置 */
|
sectionName: item.sectionName
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.listQuery.total = response.data.total;
|
||||||
|
this.dataListLoading = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
reset() {
|
reset() {
|
||||||
this.form = {
|
this.form = {
|
||||||
id: null,
|
id: null,
|
||||||
|
|||||||
@ -1,13 +1,13 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-12-08 13:46:17
|
* @Date: 2023-12-08 13:46:17
|
||||||
* @LastEditTime: 2024-01-09 16:03:22
|
* @LastEditTime: 2024-01-16 14:59:33
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<el-drawer :visible.sync="visible" :show-close="false" :wrapper-closable="false" class="drawer" size="50%">
|
<el-drawer :visible.sync="visible" :show-close="true" :wrapper-closable="false" class="drawer" size="50%">
|
||||||
<small-title slot="title" :no-padding="true">
|
<small-title slot="title" :no-padding="true" @close="handleClose">
|
||||||
{{ isdetail ? '详情' : !dataForm.id ? '新增' : '编辑' }}
|
{{ isdetail ? '详情' : !dataForm.id ? '新增' : '编辑' }}
|
||||||
</small-title>
|
</small-title>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
@ -90,6 +90,18 @@
|
|||||||
</span>
|
</span>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
<el-col :span="4">
|
||||||
|
<el-form-item :prop="'checkValueList.' + index + '.minValue'" label="最小值"
|
||||||
|
:rules="[{ required: true, message: '最小值', trigger: 'blur' }]">
|
||||||
|
<el-input disabled style="width: 90%;margin-right: 10px;" v-model="item.minValue"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="4">
|
||||||
|
<el-form-item :prop="'checkValueList.' + index + '.minValue'" label="最大值"
|
||||||
|
:rules="[{ required: true, message: '最大值', trigger: 'blur' }]">
|
||||||
|
<el-input disabled style="width: 90%;margin-right: 10px;" v-model="item.maxValue"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-row :gutter="24">
|
<el-row :gutter="24">
|
||||||
<el-col :span="8">
|
<el-col :span="8">
|
||||||
@ -252,6 +264,10 @@ export default {
|
|||||||
this.dataForm.checkValueList[index].isStandard = false
|
this.dataForm.checkValueList[index].isStandard = false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
handleClose() {
|
||||||
|
this.ingredientList = undefined
|
||||||
|
console.log(222222222);
|
||||||
|
},
|
||||||
dataFormSubmit() {
|
dataFormSubmit() {
|
||||||
this.$refs["dataForm"].validate((valid) => {
|
this.$refs["dataForm"].validate((valid) => {
|
||||||
if (!valid) {
|
if (!valid) {
|
||||||
@ -288,7 +304,9 @@ export default {
|
|||||||
Promise.all(array).then(res => {
|
Promise.all(array).then(res => {
|
||||||
console.log(res)
|
console.log(res)
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
|
this.$modal.msgSuccess("修改成功");
|
||||||
this.$emit("refreshDataList");
|
this.$emit("refreshDataList");
|
||||||
|
this.ingredientList = []
|
||||||
}).catch(error => {
|
}).catch(error => {
|
||||||
// 如果任何一个请求失败，将会进入这个 catch 块
|
// 如果任何一个请求失败，将会进入这个 catch 块
|
||||||
console.log(error)
|
console.log(error)
|
||||||
@ -326,6 +344,7 @@ export default {
|
|||||||
Promise.all(array).then(res => {
|
Promise.all(array).then(res => {
|
||||||
this.$modal.msgSuccess("新增成功");
|
this.$modal.msgSuccess("新增成功");
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
|
this.ingredientList= []
|
||||||
this.$emit("refreshDataList");
|
this.$emit("refreshDataList");
|
||||||
}).catch(error => {
|
}).catch(error => {
|
||||||
// 如果任何一个请求失败，将会进入这个 catch 块
|
// 如果任何一个请求失败，将会进入这个 catch 块
|
||||||
@ -434,6 +453,7 @@ export default {
|
|||||||
init(id, isdetail) {
|
init(id, isdetail) {
|
||||||
this.initData()
|
this.initData()
|
||||||
this.getDict()
|
this.getDict()
|
||||||
|
this.ingredientList = []
|
||||||
this.isdetail = isdetail || false;
|
this.isdetail = isdetail || false;
|
||||||
this.dataForm.id = id || undefined;
|
this.dataForm.id = id || undefined;
|
||||||
this.visible = true;
|
this.visible = true;
|
||||||
@ -445,7 +465,6 @@ export default {
|
|||||||
|
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$refs['dataForm'].resetFields();
|
this.$refs['dataForm'].resetFields();
|
||||||
|
|
||||||
if (this.dataForm.id) {
|
if (this.dataForm.id) {
|
||||||
// 获取产品详情
|
// 获取产品详情
|
||||||
let valueList = []
|
let valueList = []
|
||||||
@ -459,6 +478,7 @@ export default {
|
|||||||
valueList = arr.map((ele) => {
|
valueList = arr.map((ele) => {
|
||||||
// console.log(ele)
|
// console.log(ele)
|
||||||
return {
|
return {
|
||||||
|
checkDetId:ele.id,
|
||||||
maxValue: ele.maxValue,
|
maxValue: ele.maxValue,
|
||||||
minValue: ele.minValue
|
minValue: ele.minValue
|
||||||
}
|
}
|
||||||
@ -472,8 +492,8 @@ export default {
|
|||||||
id: ele.id,
|
id: ele.id,
|
||||||
checkDetId: ele.id,
|
checkDetId: ele.id,
|
||||||
checkValue: ele.checkValue,
|
checkValue: ele.checkValue,
|
||||||
// isStandard: true,
|
maxValue:null,
|
||||||
// showIcon: false,
|
minValue: null
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
console.log(this.ingredientList);
|
console.log(this.ingredientList);
|
||||||
@ -487,9 +507,15 @@ export default {
|
|||||||
showIcon: false,
|
showIcon: false,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
valueList.forEach((ele, index) => {
|
||||||
|
if (this.ingredientList[index].checkDetId >= ele.checkDetId) {
|
||||||
|
this.ingredientList[index].minValue = ele.minValue
|
||||||
|
this.ingredientList[index].maxValue = ele.maxValue
|
||||||
|
}
|
||||||
|
})
|
||||||
valueList.forEach((ele,index) => {
|
valueList.forEach((ele,index) => {
|
||||||
console.log(ele);
|
console.log(ele);
|
||||||
if (this.dataForm.checkValueList[index].checkValue >= ele.minValue && this.dataForm.checkValueList[index].checkValue <= ele.maxValue) {
|
if (this.dataForm.checkValueList[index].checkDetId >= ele.checkDetId && this.dataForm.checkValueList[index].checkValue >= ele.minValue && this.dataForm.checkValueList[index].checkValue <= ele.maxValue) {
|
||||||
this.dataForm.checkValueList[index].showIcon = true
|
this.dataForm.checkValueList[index].showIcon = true
|
||||||
this.dataForm.checkValueList[index].isStandard = true
|
this.dataForm.checkValueList[index].isStandard = true
|
||||||
} else {
|
} else {
|
||||||
@ -512,7 +538,8 @@ export default {
|
|||||||
},
|
},
|
||||||
goback() {
|
goback() {
|
||||||
this.$emit('refreshDataList');
|
this.$emit('refreshDataList');
|
||||||
this.visible = false;
|
this.visible = false
|
||||||
|
this.ingredientList = []
|
||||||
// this.initData();
|
// this.initData();
|
||||||
},
|
},
|
||||||
goEdit() {
|
goEdit() {
|
||||||
|
|||||||
175
src/views/quality/base/qualityScrapLog/basic-page.js
Normal file
175
src/views/quality/base/qualityScrapLog/basic-page.js
Normal file
@ -0,0 +1,175 @@
|
|||||||
|
/*
|
||||||
|
* @Author: zhp
|
||||||
|
* @Date: 2024-01-17 16:59:30
|
||||||
|
* @LastEditTime: 2024-01-17 16:59:30
|
||||||
|
* @LastEditors: zhp
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
|
/*
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2022-08-24 11:19:43
|
||||||
|
* @LastEditors: zhp
|
||||||
|
* @LastEditTime: 2024-01-10 10:29:29
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
/* eslint-disable */
|
||||||
|
return {
|
||||||
|
urlOptions: {
|
||||||
|
getDataListURL: '',
|
||||||
|
deleteURL: '',
|
||||||
|
statusUrl: '',
|
||||||
|
exportURL: ''
|
||||||
|
},
|
||||||
|
tableData: [],
|
||||||
|
listQuery: {
|
||||||
|
pageSize: 10,
|
||||||
|
pageNo: 1,
|
||||||
|
total: 1,
|
||||||
|
},
|
||||||
|
exportLoading: false,
|
||||||
|
dataListLoading: false,
|
||||||
|
addOrEditTitle: '',
|
||||||
|
addOrUpdateVisible: false,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// this.getDataList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取数据列表
|
||||||
|
getDataList() {
|
||||||
|
this.dataListLoading = true;
|
||||||
|
this.urlOptions.getDataListURL(this.listQuery).then(response => {
|
||||||
|
this.tableData = response.data.list;
|
||||||
|
this.listQuery.total = response.data.total;
|
||||||
|
this.dataListLoading = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 每页数
|
||||||
|
sizeChangeHandle(val) {
|
||||||
|
this.listQuery.pageSize = val;
|
||||||
|
this.listQuery.pageNo = 1;
|
||||||
|
this.getDataList();
|
||||||
|
},
|
||||||
|
// 当前页
|
||||||
|
currentChangeHandle(val) {
|
||||||
|
this.listQuery.pageNo = val;
|
||||||
|
this.getDataList();
|
||||||
|
},
|
||||||
|
// 新增 / 修改
|
||||||
|
addOrUpdateHandle(id) {
|
||||||
|
this.addOrUpdateVisible = true;
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$refs.addOrUpdate.init(id);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
cancel(id) {
|
||||||
|
this.$refs["popover-" + id].showPopper = false;
|
||||||
|
},
|
||||||
|
//改变状态
|
||||||
|
changeStatus(id) {
|
||||||
|
this.$http
|
||||||
|
.post(this.urlOptions.statusUrl, { id })
|
||||||
|
.then(({ data: res }) => {
|
||||||
|
if (res.code !== 0) {
|
||||||
|
return this.$message.error(res.msg);
|
||||||
|
}
|
||||||
|
this.$refs["popover-" + id].showPopper = false;
|
||||||
|
this.$message({
|
||||||
|
message: this.$t("prompt.success"),
|
||||||
|
type: "success",
|
||||||
|
duration: 500,
|
||||||
|
onClose: () => {
|
||||||
|
this.getDataList();
|
||||||
|
},
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(() => { });
|
||||||
|
},
|
||||||
|
//tableBtn点击
|
||||||
|
handleClick(val) {
|
||||||
|
if (val.type === "edit") {
|
||||||
|
this.addOrUpdateVisible = true;
|
||||||
|
this.addOrEditTitle = "编辑";
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$refs.addOrUpdate.init(val.data.id);
|
||||||
|
});
|
||||||
|
} else if (val.type === "delete") {
|
||||||
|
this.deleteHandle(val.data.id, val.data.name, val.data._pageIndex,val.data)
|
||||||
|
} else if (val.type === "change") {
|
||||||
|
this.changeStatus(val.data.id)
|
||||||
|
} else {
|
||||||
|
this.otherMethods(val)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 删除
|
||||||
|
deleteHandle(id, name, index) {
|
||||||
|
this.$confirm(`确定对${name ? '[名称=' + name + ']' : '[序号=' + index + ']'}进行删除操作?`, "提示", {
|
||||||
|
confirmButtonText: "确定",
|
||||||
|
cancelButtonText: "取消",
|
||||||
|
type: "warning",
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
|
this.urlOptions.deleteURL(id).then(({ data }) => {
|
||||||
|
this.$message({
|
||||||
|
message: "操作成功",
|
||||||
|
type: "success",
|
||||||
|
duration: 1500,
|
||||||
|
onClose: () => {
|
||||||
|
this.getDataList();
|
||||||
|
},
|
||||||
|
});
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(() => { });
|
||||||
|
},
|
||||||
|
//search-bar点击
|
||||||
|
buttonClick(val) {
|
||||||
|
switch (val.btnName) {
|
||||||
|
case "search":
|
||||||
|
this.listQuery.xm1 = val.xm1;
|
||||||
|
this.listQuery.xm2 = val.xm2;
|
||||||
|
this.listQuery.pageNo = 1;
|
||||||
|
this.getDataList();
|
||||||
|
break;
|
||||||
|
case "add":
|
||||||
|
this.addOrEditTitle = '新增'
|
||||||
|
this.addOrUpdateVisible = true;
|
||||||
|
this.addOrUpdateHandle()
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
console.log(val)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleCancel() {
|
||||||
|
this.$refs.addOrUpdate.formClear()
|
||||||
|
this.addOrUpdateVisible = false
|
||||||
|
this.addOrEditTitle = ''
|
||||||
|
},
|
||||||
|
handleConfirm() {
|
||||||
|
this.$refs.addOrUpdate.dataFormSubmit()
|
||||||
|
},
|
||||||
|
successSubmit() {
|
||||||
|
this.handleCancel()
|
||||||
|
this.getDataList()
|
||||||
|
},
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
handleExport() {
|
||||||
|
// 处理查询参数
|
||||||
|
let params = { ...this.queryParams };
|
||||||
|
params.pageNo = undefined;
|
||||||
|
params.pageSize = undefined;
|
||||||
|
this.$modal.confirm('是否确认导出所有数据项?').then(() => {
|
||||||
|
this.exportLoading = true;
|
||||||
|
return this.urlOptions.exportURL(params);
|
||||||
|
}).then(response => {
|
||||||
|
this.$download.excel(response, '工厂.xls');
|
||||||
|
this.exportLoading = false;
|
||||||
|
}).catch(() => { });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -20,7 +20,7 @@
|
|||||||
import AddOrUpdate from './add-or-updata';
|
import AddOrUpdate from './add-or-updata';
|
||||||
import DetailOrUpdate from './detail-or-updata';
|
import DetailOrUpdate from './detail-or-updata';
|
||||||
|
|
||||||
import basicPage from '../../../core/mixins/basic-page';
|
import basicPage from './basic-page';
|
||||||
import { parseTime } from '../../../core/mixins/code-filter';
|
import { parseTime } from '../../../core/mixins/code-filter';
|
||||||
import {
|
import {
|
||||||
getQualityScrapLogPage,
|
getQualityScrapLogPage,
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user