Compare commits
118 Commits
projects/m
...
projects/m
| Author | SHA1 | Date | |
|---|---|---|---|
| ec0c09a674 | |||
|
|
90e9b179eb | ||
|
|
8e2b332c7b | ||
| f37a12d2e1 | |||
| cb19872012 | |||
|
|
8ba79185d4 | ||
|
|
104cda5a41 | ||
|
|
151c5708c4 | ||
| 837735b7e8 | |||
|
|
e00a08385f | ||
|
|
a8c3d2c585 | ||
| eb097e77bd | |||
|
|
30eecb8bd1 | ||
|
|
f4a6229170 | ||
| ab593bff20 | |||
| 4b01dd3ec3 | |||
| ed3ea7dde8 | |||
| 1d9e272f99 | |||
|
|
43c9153777 | ||
|
|
c6d504583b | ||
|
|
22f3c87f02 | ||
|
|
1f54c9179d | ||
| f7247f5161 | |||
|
|
c8856f34b5 | ||
|
|
42c42abc08 | ||
| 0fffed9b0e | |||
|
|
d251daa3f5 | ||
|
|
ed5120ca97 | ||
|
|
becf34d089 | ||
| f0d64de77b | |||
| 56819176b3 | |||
| d302179f6f | |||
| 8c117fae8e | |||
|
|
b6cf7b2ddc | ||
|
|
2f98b42bd2 | ||
| fb8ae9226a | |||
| 3d3763c4ef | |||
| ea675b9dea | |||
| bda065e4be | |||
|
|
5ea4c219ed | ||
|
|
16186667da | ||
|
|
c7cd6e7b1e | ||
|
|
29c3a9fb72 | ||
|
|
1e1313d090 | ||
| d0eb1d84c8 | |||
|
|
445d8f4818 | ||
|
|
46ce982cfc | ||
| 391e06a382 | |||
| 72e1b4e8f9 | |||
| b41ba04cb4 | |||
|
|
4482ce0433 | ||
|
|
ecf6745c8a | ||
| c9128ce946 | |||
| ba08175de8 | |||
|
|
22f8322baf | ||
|
|
6f8abc9758 | ||
| 59d53b60c7 | |||
| d448280782 | |||
| 0337b54202 | |||
|
|
9dec81e0b2 | ||
|
|
64de2c50b6 | ||
|
|
bd0f9e24fd | ||
|
|
f3043ee11f | ||
| 5584a47575 | |||
| b0078cb099 | |||
| e5acd497b5 | |||
| 6b452dce36 | |||
| aacf87f6d3 | |||
|
|
bfa17e422d | ||
|
|
e25f872589 | ||
| 83b834d2fc | |||
| 1b2c16fcdb | |||
| 475ec35ec5 | |||
| 1328da9616 | |||
| 92b9ec7da7 | |||
| c1af47db81 | |||
| 15afbcd612 | |||
|
|
dabbc6b63a | ||
|
|
cfab3353d3 | ||
|
|
2298fc56b6 | ||
| bb77d0f8c6 | |||
|
|
e8938a62eb | ||
|
|
2a599d96b3 | ||
|
|
6050eb4df5 | ||
| 02c3b3db0d | |||
| 3308fcbef9 | |||
| cb7135bad5 | |||
| 4a56f92961 | |||
|
|
8f11c2f47c | ||
|
|
b41dc9593c | ||
| 862fe20760 | |||
| 1ed409a98e | |||
| 68e738cf12 | |||
|
|
4866198a98 | ||
|
|
49df8a72bd | ||
|
|
087af452de | ||
|
|
63a753d7d6 | ||
| b1cdf083dd | |||
| 673ddcb996 | |||
| a9e60dbe82 | |||
|
|
92d197a513 | ||
|
|
e7f440a142 | ||
| 5d3622bf62 | |||
| 5ccb9297e1 | |||
| ce528f18b6 | |||
|
|
024060182e | ||
|
|
4f111a95d6 | ||
| 8fc6b73179 | |||
| 7f504e5cdd | |||
| 7c5d8bde0b | |||
|
|
0b1761e83c | ||
|
|
cafa156d72 | ||
| ed46ed7d09 | |||
|
|
f89c6dfe14 | ||
|
|
a3b2eae33f | ||
| e70ff40554 | |||
| 93236f9828 | |||
|
|
fef8824844 |
34
.env.dev
34
.env.dev
@@ -1,7 +1,7 @@
|
|||||||
###
|
###
|
||||||
# @Author: Do not edit
|
# @Author: zhp
|
||||||
# @Date: 2023-08-29 09:40:39
|
# @Date: 2024-04-12 14:30:48
|
||||||
# @LastEditTime: 2024-04-08 16:46:49
|
# @LastEditTime: 2024-04-23 17:25:25
|
||||||
# @LastEditors: DY
|
# @LastEditors: DY
|
||||||
# @Description:
|
# @Description:
|
||||||
###
|
###
|
||||||
@@ -12,26 +12,18 @@ ENV = 'development'
|
|||||||
VUE_APP_TITLE = MES系统
|
VUE_APP_TITLE = MES系统
|
||||||
|
|
||||||
# 芋道管理系统/开发环境
|
# 芋道管理系统/开发环境
|
||||||
# VUE_APP_BASE_API = 'http://100.64.0.26:48082'
|
|
||||||
# VUE_APP_BASE_API = 'http://10.70.2.2:8080'
|
|
||||||
# VUE_APP_BASE_API = 'http://192.168.1.20:48080'
|
|
||||||
# VUE_APP_BASE_API = 'http://192.168.2.173:48080'
|
|
||||||
# VUE_APP_BASE_API = 'http://192.168.1.49:48082'
|
|
||||||
# VUE_APP_BASE_API = 'http://192.168.1.8:48082'
|
|
||||||
# VUE_APP_BASE_API = 'http://192.168.4.173:9001'
|
|
||||||
# VUE_APP_BASE_API = 'http://192.168.1.104:48082'
|
|
||||||
VUE_APP_BASE_API = 'http://192.168.0.33:48082'
|
VUE_APP_BASE_API = 'http://192.168.0.33:48082'
|
||||||
# VUE_APP_BASE_API = 'http://192.168.1.62:48082'
|
# VUE_APP_BASE_API = 'http://192.168.4.176:48082'
|
||||||
# VUE_APP_BASE_API = 'http://192.168.1.78:48082'
|
|
||||||
# VUE_APP_BASE_API = 'http://192.168.1.47:48082'
|
|
||||||
# socket地址
|
|
||||||
# VUE_APP_Socket_API = 'ws://10.70.2.2:8080'
|
|
||||||
# VUE_APP_Socket_Dcs_API = 'ws://10.70.180.10:8081'
|
|
||||||
VUE_APP_Socket_API = 'ws://192.168.0.33:48082'
|
|
||||||
VUE_APP_Socket_Dcs_API = 'ws://192.168.0.33:8080'
|
|
||||||
|
|
||||||
# 积木报表指向地址
|
# 积木报表指向地址
|
||||||
VUE_APP_JIMU_API = 'http://10.70.2.22:8080'
|
VUE_APP_JIMU_API = 'http://192.168.1.101:48082'
|
||||||
|
|
||||||
|
# socket地址(现场)
|
||||||
|
VUE_APP_Socket_API = 'ws://10.70.2.2:8080'
|
||||||
|
# socket地址(公司线上)
|
||||||
|
# VUE_APP_Socket_API = 'ws://192.168.0.33:48082'
|
||||||
|
# socket dcs地址(只有现场)
|
||||||
|
VUE_APP_Socket_Dcs_API = 'ws://10.70.180.10:8081'
|
||||||
|
|
||||||
|
|
||||||
# 路由懒加载
|
# 路由懒加载
|
||||||
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
||||||
|
|||||||
@@ -1,11 +1,4 @@
|
|||||||
###
|
# 生产环境配置(许昌现场)
|
||||||
# @Author: zhp
|
|
||||||
# @Date: 2023-11-07 19:11:40
|
|
||||||
# @LastEditTime: 2023-11-16 16:40:59
|
|
||||||
# @LastEditors: zhp
|
|
||||||
# @Description:
|
|
||||||
###
|
|
||||||
# 生产环境配置
|
|
||||||
ENV = 'production'
|
ENV = 'production'
|
||||||
|
|
||||||
# 页面标题
|
# 页面标题
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
# 生产环境配置
|
# 公司线上环境(33服务器)
|
||||||
ENV = 'production'
|
ENV = 'production'
|
||||||
|
|
||||||
# 页面标题
|
# 页面标题
|
||||||
@@ -7,15 +7,12 @@ VUE_APP_TITLE = MES系统
|
|||||||
# 芋道管理系统/生产环境
|
# 芋道管理系统/生产环境
|
||||||
VUE_APP_BASE_API = '/prod-api'
|
VUE_APP_BASE_API = '/prod-api'
|
||||||
|
|
||||||
# dcs地址
|
|
||||||
VUE_APP_Socket_Dcs_API = 'ws://10.70.180.10:8081'
|
|
||||||
# socket地址
|
|
||||||
VUE_APP_Socket_API = 'ws://10.70.2.2:8080'
|
|
||||||
|
|
||||||
# 积木报表指向地址
|
# 积木报表指向地址
|
||||||
VUE_APP_JIMU_API = 'http://192.168.0.33:48082'
|
VUE_APP_JIMU_API = 'http://192.168.0.33:48082'
|
||||||
# socket地址
|
# socket地址
|
||||||
VUE_APP_Socket_API = 'ws://192.168.0.33:48082'
|
VUE_APP_Socket_API = 'ws://192.168.0.33:48082'
|
||||||
|
# dcs地址(只有现场的)
|
||||||
|
VUE_APP_Socket_Dcs_API = 'ws://10.70.180.10:8081'
|
||||||
|
|
||||||
|
|
||||||
# 根据服务器或域名修改
|
# 根据服务器或域名修改
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
/*
|
/*
|
||||||
* @Author: Do not edit
|
* @Author: Do not edit
|
||||||
* @Date: 2023-10-21 11:50:46
|
* @Date: 2023-10-21 11:50:46
|
||||||
* @LastEditTime: 2023-10-30 14:37:28
|
* @LastEditTime: 2024-04-19 17:13:24
|
||||||
* @LastEditors: DY
|
* @LastEditors: DY
|
||||||
* @Description:
|
* @Description:
|
||||||
*/
|
*/
|
||||||
@@ -65,4 +65,13 @@ export function getCoreDepartmentList(query) {
|
|||||||
method: 'get',
|
method: 'get',
|
||||||
params: query
|
params: query
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 设备获得所有列表
|
||||||
|
export function getDepartmentList(query) {
|
||||||
|
return request({
|
||||||
|
url: '/system/dept/list-all-simple',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
/*
|
/*
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-11-06 15:38:12
|
* @Date: 2023-11-06 15:38:12
|
||||||
* @LastEditTime: 2023-12-15 15:29:16
|
* @LastEditTime: 2024-04-11 14:57:02
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
*/
|
*/
|
||||||
@@ -94,7 +94,7 @@ export function getWorkerList(query) {
|
|||||||
|
|
||||||
export function getMaterialCheckList(query) {
|
export function getMaterialCheckList(query) {
|
||||||
return request({
|
return request({
|
||||||
url: '/base/core-hot-material-check/listByMaterial',
|
url: 'base/quality-hot-material-det/filterList',
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: query
|
params: query
|
||||||
})
|
})
|
||||||
@@ -102,7 +102,7 @@ export function getMaterialCheckList(query) {
|
|||||||
|
|
||||||
export function createQualityHotMaterialDet(query){
|
export function createQualityHotMaterialDet(query){
|
||||||
return request({
|
return request({
|
||||||
url: '/base/quality-hot-material-det/create',
|
url: 'base/quality-hot-material-det/createBatch',
|
||||||
method: 'post',
|
method: 'post',
|
||||||
data: query
|
data: query
|
||||||
})
|
})
|
||||||
@@ -110,7 +110,7 @@ export function createQualityHotMaterialDet(query){
|
|||||||
|
|
||||||
export function updateQualityHotMaterialDet(query){
|
export function updateQualityHotMaterialDet(query){
|
||||||
return request({
|
return request({
|
||||||
url: '/base/quality-hot-material-det/listbyfilter',
|
url: 'base/quality-hot-material-det/updateBatch',
|
||||||
method: 'put',
|
method: 'put',
|
||||||
data: query
|
data: query
|
||||||
})
|
})
|
||||||
@@ -118,7 +118,7 @@ export function updateQualityHotMaterialDet(query){
|
|||||||
|
|
||||||
export function getQualityHotMaterialDetList(query){
|
export function getQualityHotMaterialDetList(query){
|
||||||
return request({
|
return request({
|
||||||
url: '/base/quality-hot-material-det/listbyfilter',
|
url: '/base/quality-hot-material-det/filterList',
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: query
|
params: query
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
/*
|
/*
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-11-07 15:02:37
|
* @Date: 2023-11-07 15:02:37
|
||||||
* @LastEditTime: 2023-11-07 18:32:07
|
* @LastEditTime: 2024-04-09 15:14:42
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
/*
|
/*
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-11-07 14:10:18
|
* @Date: 2023-11-07 14:10:18
|
||||||
* @LastEditTime: 2023-11-16 17:49:52
|
* @LastEditTime: 2024-04-11 16:16:05
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
*/
|
*/
|
||||||
@@ -18,14 +18,14 @@ export function getStatisticalDataPage(query) {
|
|||||||
|
|
||||||
export function getWorkOrderList(query) {
|
export function getWorkOrderList(query) {
|
||||||
return request({
|
return request({
|
||||||
url: '/base/core-work-order/listbyfilter',
|
url: 'base/core-work-order/listbyfilter',
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: query,
|
params: query,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
export function getProductList(query) {
|
export function getProductList(query) {
|
||||||
return request({
|
return request({
|
||||||
url: '/base/core-product/listAll',
|
url: 'base/core-product/listAll',
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: query,
|
params: query,
|
||||||
})
|
})
|
||||||
|
|||||||
45
src/api/report/customizedReports.js
Normal file
45
src/api/report/customizedReports.js
Normal file
@@ -0,0 +1,45 @@
|
|||||||
|
import request from '@/utils/request'
|
||||||
|
// 原片工段数据
|
||||||
|
export function originalSection(data) {
|
||||||
|
return request({
|
||||||
|
url: '/extend/customized-reports/originalSection',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 原片产线数据
|
||||||
|
export function getOriginalLine(query) {
|
||||||
|
return request({
|
||||||
|
url: '/extend/customized-reports/getOriginalLine',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 深加工产线数据
|
||||||
|
export function getProcessingLine(query) {
|
||||||
|
return request({
|
||||||
|
url: '/extend/customized-reports/getProcessingLine',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 深加工工段数据
|
||||||
|
export function processing(data) {
|
||||||
|
return request({
|
||||||
|
url: '/extend/customized-reports/processing',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// isra数据记录
|
||||||
|
export function israData(data) {
|
||||||
|
return request({
|
||||||
|
url: '/extend/customized-reports/isra',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
96
src/api/report/qcReport.js
Normal file
96
src/api/report/qcReport.js
Normal file
@@ -0,0 +1,96 @@
|
|||||||
|
/*
|
||||||
|
* @Author: zhp
|
||||||
|
* @Date: 2024-04-18 09:27:54
|
||||||
|
* @LastEditTime: 2024-04-23 15:16:12
|
||||||
|
* @LastEditors: zhp
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
// 更新质量检测类型基础
|
||||||
|
export function getOriginalData(data) {
|
||||||
|
return request({
|
||||||
|
url: 'extend/customized-reports/original',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function getIngredientData(data) {
|
||||||
|
return request({
|
||||||
|
url: 'extend/customized-reports/materialCost',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getCuttingtData(data) {
|
||||||
|
return request({
|
||||||
|
url: 'extend/customized-reports/cutting',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getAutoDailyData(data) {
|
||||||
|
return request({
|
||||||
|
url: 'base/report-auto-daily/listAll',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getQualityRecordReport(data) {
|
||||||
|
return request({
|
||||||
|
url: 'base/quality-inspection-record/qualityRecordReport',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getProductChildData(data) {
|
||||||
|
return request({
|
||||||
|
url: 'base/report-auto-ydaily-det/list',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function updateAutoDailyData(data) {
|
||||||
|
return request({
|
||||||
|
url: 'base/report-auto-daily/update',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getCWSectionList(query) {
|
||||||
|
return request({
|
||||||
|
url: 'base/core-production-line/listAll',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getCuttingReportDataList(data) {
|
||||||
|
return request({
|
||||||
|
url: 'extend/customized-reports/cuttingReport',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getProcessingLineDataList(data) {
|
||||||
|
return request({
|
||||||
|
url: 'extend/customized-reports/getProcessingLine',
|
||||||
|
method: 'get',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getOriginalLineDataList(data) {
|
||||||
|
return request({
|
||||||
|
url: 'extend/customized-reports/getOriginalLine',
|
||||||
|
method: 'get',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
138
src/components/ButtonNav/index.vue
Normal file
138
src/components/ButtonNav/index.vue
Normal file
@@ -0,0 +1,138 @@
|
|||||||
|
<!--
|
||||||
|
filename: index.vue
|
||||||
|
author: liubin
|
||||||
|
date: 2024-04-02 09:49:36
|
||||||
|
description:
|
||||||
|
-->
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<!-- 按钮切换 -->
|
||||||
|
<div
|
||||||
|
v-if="buttonMode"
|
||||||
|
class="button-nav">
|
||||||
|
<button
|
||||||
|
v-for="m in menus"
|
||||||
|
:key="m"
|
||||||
|
@click="currentMenu = m"
|
||||||
|
:data-text="m"
|
||||||
|
:class="[m === currentMenu ? 'active' : '']"></button>
|
||||||
|
</div>
|
||||||
|
<!-- 标签切换 -->
|
||||||
|
<div
|
||||||
|
v-else
|
||||||
|
class="custom-tabs"
|
||||||
|
style="height: 100%; width: 100%">
|
||||||
|
<el-tabs
|
||||||
|
class="tag-nav"
|
||||||
|
v-model="currentMenu"
|
||||||
|
style="height: 100%">
|
||||||
|
<el-tab-pane
|
||||||
|
v-for="(m, idx) in menus"
|
||||||
|
:key="m"
|
||||||
|
:label="idx == 0 ? `\u2002${m}\u2002` : `\u3000${m}\u3000`"
|
||||||
|
:name="m">
|
||||||
|
<slot :name="`tab${idx + 1}`"></slot>
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'ButtonNav',
|
||||||
|
props: {
|
||||||
|
menus: {
|
||||||
|
type: Array,
|
||||||
|
required: true,
|
||||||
|
default: () => [],
|
||||||
|
validator: (val) => {
|
||||||
|
return val.length > 0;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
buttonMode: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
currentMenu: '',
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.currentMenu = this.menus[0];
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
currentMenu(val) {
|
||||||
|
this.$emit('change', val);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.button-nav {
|
||||||
|
width: 100%;
|
||||||
|
// padding: 12px 0;
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
|
|
||||||
|
* {
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
cursor: pointer;
|
||||||
|
appearance: none;
|
||||||
|
outline: none;
|
||||||
|
border: none;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 20px;
|
||||||
|
color: #888;
|
||||||
|
letter-spacing: 2px;
|
||||||
|
flex: 1;
|
||||||
|
box-sizing: padding-box;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: attr(data-text);
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
left: 50%;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 500;
|
||||||
|
transform: translate(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
color: #111;
|
||||||
|
border-bottom: 4px solid #0b58ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.custom-tabs >>> .el-tabs__header {
|
||||||
|
margin-bottom: 8px;
|
||||||
|
display: inline-block;
|
||||||
|
/* transform: translateY(-12px); */
|
||||||
|
}
|
||||||
|
.custom-tabs >>> .el-tabs__item {
|
||||||
|
padding-left: 0px !important;
|
||||||
|
padding-right: 0px !important;
|
||||||
|
line-height: 36px !important;
|
||||||
|
height: 36px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-tabs >>> .el-tabs__content {
|
||||||
|
height: calc(100% - 42px);
|
||||||
|
}
|
||||||
|
.custom-tabs >>> .el-tab-pane {
|
||||||
|
box-sizing: border-box;
|
||||||
|
height: 100%;
|
||||||
|
padding: 20px;
|
||||||
|
border: 10px solid #f002;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-01-29 16:50:26
|
* @Date: 2024-01-29 16:50:26
|
||||||
* @LastEditTime: 2024-04-07 16:05:59
|
* @LastEditTime: 2024-04-22 09:42:45
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@@ -34,7 +34,7 @@
|
|||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
|
||||||
<base-container :no-content-padding="true" :title="'产量及良率统计'" :size="'small'"
|
<base-container :show-time="true" :no-content-padding="true" :title="'产量及良率统计'" :size="'small'"
|
||||||
:title-icon="'energyMonitoring'">
|
: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 />
|
||||||
@@ -53,7 +53,8 @@
|
|||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
|
||||||
<base-container :no-content-padding="true" :title="'ISRA 缺陷数据'" :size="'small'" :title-icon="'scrap'">
|
<base-container :show-time="true" :no-content-padding="true" :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" /> -->
|
||||||
<ISRAChart ref="ISRAChart" />
|
<ISRAChart ref="ISRAChart" />
|
||||||
@@ -64,8 +65,8 @@
|
|||||||
|
|
||||||
<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 :no-content-padding="true" :height="256" :title="'废片 缺陷数据'" :size="'eqStatus'"
|
<base-container :show-time="true" :no-content-padding="true" :height="256" :title="'废片 缺陷数据'"
|
||||||
:title-icon="'scrap'">
|
:size="'eqStatus'" :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> -->
|
||||||
@@ -98,7 +99,8 @@
|
|||||||
</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 :show-time="false" :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> -->
|
||||||
@@ -625,8 +627,8 @@ export default {
|
|||||||
`<span style="color:rgba(255,255,255,0.5)">${this.getSize(item.size) || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)">${this.getSize(item.size) || ''}</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)">${this.NumFormat(item.productArea) + '㎡' || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)">${this.NumFormat(item.productArea) + '㎡' || ''}</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)">${this.NumFormat(item.wasteArea) + '㎡' || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)">${this.NumFormat(item.wasteArea) + '㎡' || ''}</span>`,
|
||||||
`<div style = "${(item.product * 100).toFixed(0) > 91 ? 'display:block;color:#00FFF7' : 'display:none;'}">${(item.product * 100).toFixed(0) + '%' || ''}</div>
|
`<div style = "${(item.product * 100).toFixed(0) >= 91 ? 'display:block;color:#00FFF7' : 'display:none;'}">${(item.product * 100).toFixed(0) + '%' || ''}</div>
|
||||||
<div style = "${(item.product * 100).toFixed(0) < 91 ? 'display:block; color:rgba(255, 209, 96, 1)' : 'display:none;'}">${(item.product * 100).toFixed(0) + '%' || ''}</div>`
|
<div style = "${(item.product * 100).toFixed(0) <= 91 ? 'display:block; color:rgba(255, 209, 96, 1)' : 'display:none;'}">${(item.product * 100).toFixed(0) + '%' || ''}</div>`
|
||||||
])
|
])
|
||||||
this.cutConfig.data = cutArr
|
this.cutConfig.data = cutArr
|
||||||
// this.$nextTick(() => {
|
// this.$nextTick(() => {
|
||||||
@@ -635,32 +637,34 @@ export default {
|
|||||||
// this.cutConfig.data = cutArr
|
// this.cutConfig.data = cutArr
|
||||||
// this.$refs['cutScrollBoard'].updateRows(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 = []
|
if (this.cutWsData.coldDetData.length !== 0) {
|
||||||
let nameWasteList = []
|
let nameList = []
|
||||||
let topNameList = []
|
let nameWasteList = []
|
||||||
let productList = []
|
let topNameList = []
|
||||||
let wasteList = []
|
let productList = []
|
||||||
let sumAreaList = []
|
let wasteList = []
|
||||||
let yieldList = []
|
let sumAreaList = []
|
||||||
this.coldDetData = this.cutWsData.coldDetData
|
let yieldList = []
|
||||||
// this.cutTableDataList =
|
this.coldDetData = this.cutWsData.coldDetData
|
||||||
this.cutWsData.coldDetData.forEach((ele, index) => {
|
// this.cutTableDataList =
|
||||||
nameList.push(ele.lineName)
|
this.cutWsData.coldDetData.forEach((ele, index) => {
|
||||||
topNameList.push('产线: ' + ele.lineName + ' ' + '总面积:' + ele.sumArea + '㎡')
|
nameList.push(ele.lineName)
|
||||||
productList.push(ele.productArea)
|
topNameList.push('产线: ' + ele.lineName + ' ' + '总面积:' + ele.sumArea + '㎡')
|
||||||
wasteList.push(ele.wastArea)
|
productList.push(ele.productArea)
|
||||||
nameWasteList.push('缺陷面积:' + this.NumFormat(ele.wastArea) + '㎡')
|
wasteList.push(ele.wastArea)
|
||||||
sumAreaList.push(ele.sumArea)
|
nameWasteList.push('缺陷面积:' + this.NumFormat(ele.wastArea) + '㎡')
|
||||||
yieldList.push(parseFloat((ele.yield * 100).toFixed(0)))
|
sumAreaList.push(ele.sumArea)
|
||||||
})
|
yieldList.push(parseFloat((ele.yield * 100).toFixed(2)))
|
||||||
this.$nextTick(() => {
|
})
|
||||||
this.$refs.firstPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]])
|
this.$nextTick(() => {
|
||||||
this.$refs.secondPileChart.initChart(nameList, [topNameList[1]], [nameWasteList[1]], [productList[1]], [wasteList[1]])
|
this.$refs.firstPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]])
|
||||||
this.$refs.thirdPileChart.initChart(nameList, [topNameList[2]], [nameWasteList[2]], [productList[2]], [wasteList[2]])
|
this.$refs.secondPileChart.initChart(nameList, [topNameList[1]], [nameWasteList[1]], [productList[1]], [wasteList[1]])
|
||||||
this.$refs.fourthPileChart.initChart(nameList, [topNameList[3]], [nameWasteList[3]], [productList[3]], [wasteList[3]])
|
this.$refs.thirdPileChart.initChart(nameList, [topNameList[2]], [nameWasteList[2]], [productList[2]], [wasteList[2]])
|
||||||
this.$refs.fifthPileChart.initChart(nameList, [topNameList[4]], [nameWasteList[4]], [productList[4]], [wasteList[4]])
|
this.$refs.fourthPileChart.initChart(nameList, [topNameList[3]], [nameWasteList[3]], [productList[3]], [wasteList[3]])
|
||||||
this.$refs.productChart.initChart(nameList, yieldList, sumAreaList)
|
this.$refs.fifthPileChart.initChart(nameList, [topNameList[4]], [nameWasteList[4]], [productList[4]], [wasteList[4]])
|
||||||
})
|
this.$refs.productChart.initChart(nameList, yieldList, sumAreaList)
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
// if (typeof (WebSocket) === 'undefined') {
|
// if (typeof (WebSocket) === 'undefined') {
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-01-29 13:45:56
|
* @Date: 2024-01-29 13:45:56
|
||||||
* @LastEditTime: 2024-03-13 08:58:01
|
* @LastEditTime: 2024-04-17 15:48:21
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@@ -13,6 +13,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { position } from '@antv/x6-common/lib/dom/position';
|
||||||
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'
|
||||||
@@ -26,7 +27,7 @@ export default {
|
|||||||
return {
|
return {
|
||||||
chart: null,
|
chart: null,
|
||||||
// notMsg:true,
|
// notMsg:true,
|
||||||
colors:['#2760ff', '#518eec', '#0ee8e4', '#ddb523'],
|
colors: ['#2760ff', '#518eec', '#49FBD6', '#ddb523'],
|
||||||
chartData: []
|
chartData: []
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
@@ -45,8 +46,49 @@ export default {
|
|||||||
this.$emit('emitFun')
|
this.$emit('emitFun')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
mounted() {
|
||||||
|
this.chartData = [
|
||||||
|
{
|
||||||
|
name: '0904褶皱/严重',
|
||||||
|
num: 1112,
|
||||||
|
yield: 0.97,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '0904褶皱/严重',
|
||||||
|
num: 1112,
|
||||||
|
yield: 0.97,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '0904褶皱/严重',
|
||||||
|
num: 1112,
|
||||||
|
yield: 0.97,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '0904褶皱/严重',
|
||||||
|
num: 1112,
|
||||||
|
yield: 0.97,
|
||||||
|
}
|
||||||
|
]
|
||||||
|
this.updateChart()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getEqualNewlineString(params, length) {
|
||||||
|
let text = ''
|
||||||
|
let count = Math.ceil(params.length / length) // 向上取整数
|
||||||
|
// 一行展示length个
|
||||||
|
if (count > 1) {
|
||||||
|
for (let z = 1; z <= count; z++) {
|
||||||
|
text += params.substr((z - 1) * length, length)
|
||||||
|
if (z < count) {
|
||||||
|
text += '\n'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
text += params.substr(0, length)
|
||||||
|
}
|
||||||
|
return text
|
||||||
|
},
|
||||||
updateChart() {
|
updateChart() {
|
||||||
console.log('update')
|
console.log('update')
|
||||||
let num = 0
|
let num = 0
|
||||||
@@ -71,7 +113,7 @@ export default {
|
|||||||
color:this.colors,
|
color:this.colors,
|
||||||
title:{
|
title:{
|
||||||
text: num,
|
text: num,
|
||||||
subtext: '总数',
|
subtext: '总数/片',
|
||||||
top: '32%',
|
top: '32%',
|
||||||
left: '49%',
|
left: '49%',
|
||||||
textAlign: 'center',
|
textAlign: 'center',
|
||||||
@@ -83,45 +125,77 @@ export default {
|
|||||||
fontSize: 20,
|
fontSize: 20,
|
||||||
color: '#fff00',
|
color: '#fff00',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
legend: {
|
grid: {
|
||||||
bottom: '10%',
|
left: '1%',
|
||||||
left: 'center',
|
right: '1%',
|
||||||
itemWidth: 12,
|
bottom: '0',
|
||||||
itemHeight:12,
|
containLabel: true
|
||||||
icon: 'rect',
|
},
|
||||||
textStyle: {
|
// legend: {
|
||||||
color: '#fff'
|
// bottom: '10%',
|
||||||
},
|
// left: 'center',
|
||||||
data:this.chartData && this.chartData.length > 0 && this.chartData.map((item,index)=>({
|
// itemWidth: 12,
|
||||||
name:item.name,
|
// itemHeight:12,
|
||||||
itemStyle:{
|
// icon: 'roundRect',
|
||||||
color: this.colors[index%4]
|
// textStyle: {
|
||||||
}
|
// 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缺陷检测',
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
|
// position:outerHeight,
|
||||||
center: ['50%', '40%'],
|
center: ['50%', '40%'],
|
||||||
radius: ['45%', '70%'],
|
radius: ['45%', '70%'],
|
||||||
avoidLabelOverlap: true,
|
avoidLabelOverlap: true,
|
||||||
label: {
|
label: {
|
||||||
show: false
|
show: true,
|
||||||
|
normal: {
|
||||||
|
alignTo: 'labelLine',
|
||||||
|
margin: 10,
|
||||||
|
edgeDistance: 10,
|
||||||
|
lineHeight: 16,
|
||||||
|
// 各分区的提示内容
|
||||||
|
// params: 即下面传入的data数组,通过自定义函数,展示你想要的内容和格式
|
||||||
|
formatter: function (params) {
|
||||||
|
console.log(params);
|
||||||
|
return ;
|
||||||
|
},
|
||||||
|
formatter: (params) => {
|
||||||
|
//调用自定义显示格式
|
||||||
|
return this.getEqualNewlineString(params.value + " | " + params.percent.toFixed(0) + "%");
|
||||||
|
},
|
||||||
|
textStyle: { // 提示文字的样式
|
||||||
|
// color: '#595959',
|
||||||
|
fontSize: 16
|
||||||
|
}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
labelLine: {
|
labelLine: {
|
||||||
show: true,
|
show: true,
|
||||||
|
length: 25,
|
||||||
|
length2: 10,
|
||||||
},
|
},
|
||||||
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,
|
||||||
|
label: {
|
||||||
|
color: this.colors[index % 4]
|
||||||
|
},
|
||||||
itemStyle:{
|
itemStyle:{
|
||||||
color:{
|
color:{
|
||||||
type: 'linear',
|
type: 'linear',
|
||||||
x: 1,
|
x: 0,
|
||||||
y: 1,
|
y: 0,
|
||||||
x2: 0,
|
x2: 0,
|
||||||
y2: 0,
|
y2: 1,
|
||||||
global: false,
|
global: false,
|
||||||
colorStops:[
|
colorStops:[
|
||||||
{offset: 0,color: this.colors[index%4]},
|
{offset: 0,color: this.colors[index%4]},
|
||||||
@@ -145,15 +219,19 @@ export default {
|
|||||||
.isra-chart {
|
.isra-chart {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
top: 7%;
|
||||||
}
|
}
|
||||||
|
.isra-chart-tooltip {
|
||||||
|
background: #0a2b4f77 !important;
|
||||||
|
border: none !important;
|
||||||
|
backdrop-filter: blur(12px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.isra-chart-tooltip * {
|
||||||
|
color: #fff !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
<style>
|
<style>
|
||||||
.isra-chart-tooltip {
|
|
||||||
background: #0a2b4f77 !important;
|
|
||||||
border: none !important;
|
|
||||||
backdrop-filter: blur(12px);
|
|
||||||
}
|
|
||||||
.isra-chart-tooltip * {
|
|
||||||
color: #fff !important;
|
|
||||||
}
|
|
||||||
</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-03-29 14:47:29
|
* @LastEditTime: 2024-04-22 09:41:21
|
||||||
* @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
|
||||||
-->
|
-->
|
||||||
@@ -30,7 +30,7 @@
|
|||||||
<!-- <span v-if="showTime" style="font-size: 20px;color:#52FFF8;margin-left: 10px;margin-top: 2px;">
|
<!-- <span v-if="showTime" style="font-size: 20px;color:#52FFF8;margin-left: 10px;margin-top: 2px;">
|
||||||
{{ time2 +'-'+ time }}
|
{{ time2 +'-'+ time }}
|
||||||
</span> -->
|
</span> -->
|
||||||
<span style="font-size: 20px;color:#52FFF8;margin-left: 10px;margin-top: 2px;">
|
<span v-if="showTime" style="font-size: 20px;color:#52FFF8;margin-left: 10px;margin-top: 2px;">
|
||||||
{{ startTime + '-' + endTime }}
|
{{ startTime + '-' + endTime }}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -56,6 +56,10 @@ export default {
|
|||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true
|
default: true
|
||||||
},
|
},
|
||||||
|
showTime: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
|
},
|
||||||
noPadding: {
|
noPadding: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-09-21 09:06:28
|
* @Date: 2023-09-21 09:06:28
|
||||||
* @LastEditTime: 2024-04-03 16:28:40
|
* @LastEditTime: 2024-04-23 15:34:56
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@@ -83,6 +83,9 @@ export default {
|
|||||||
this.chart = null
|
this.chart = null
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// getNumLength(num) {
|
||||||
|
// return num.toString().length;
|
||||||
|
// },
|
||||||
initChart(nameList, passRateList, outputNumList) {
|
initChart(nameList, passRateList, outputNumList) {
|
||||||
console.log(nameList, passRateList)
|
console.log(nameList, passRateList)
|
||||||
let series= [
|
let series= [
|
||||||
@@ -97,7 +100,7 @@ export default {
|
|||||||
{ offset: 0.3, color: '#1295FF' }
|
{ offset: 0.3, color: '#1295FF' }
|
||||||
]),
|
]),
|
||||||
label: {
|
label: {
|
||||||
show: true, //开启显示
|
show: false, //开启显示
|
||||||
position: 'top', //在上方显示
|
position: 'top', //在上方显示
|
||||||
textStyle: { //数值样式
|
textStyle: { //数值样式
|
||||||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色
|
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色
|
||||||
@@ -156,6 +159,8 @@ export default {
|
|||||||
this.chart.setOption({
|
this.chart.setOption({
|
||||||
// color: colors,
|
// color: colors,
|
||||||
tooltip: {
|
tooltip: {
|
||||||
|
trigger: 'item',
|
||||||
|
className: "isra-chart-tooltip",
|
||||||
trigger: 'axis',
|
trigger: 'axis',
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
type: 'cross'
|
type: 'cross'
|
||||||
@@ -216,15 +221,17 @@ export default {
|
|||||||
// },
|
// },
|
||||||
yAxis: [
|
yAxis: [
|
||||||
{
|
{
|
||||||
min: function() { // 取最小值向下取整为最小刻度
|
min: function () { // 取最小值向下取整为最小刻度
|
||||||
return 0
|
return 0
|
||||||
},
|
},
|
||||||
max: function(value) { // 取最大值向上取整为最大刻度
|
max: function (value) { // 取最大值向上取整为最大刻度
|
||||||
return Math.ceil(value.max)
|
|
||||||
},
|
},
|
||||||
scale: true,
|
scale: true,
|
||||||
type: 'value',
|
type: 'value',
|
||||||
name: '良品率/%',
|
name: '良品率/%',
|
||||||
|
max: 100,//最大值
|
||||||
|
min: 0,//最小值
|
||||||
|
interval: 20,//间隔
|
||||||
nameTextStyle: {// y轴上方单位的颜色
|
nameTextStyle: {// y轴上方单位的颜色
|
||||||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色
|
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色
|
||||||
align: "left",
|
align: "left",
|
||||||
@@ -261,12 +268,17 @@ export default {
|
|||||||
// },
|
// },
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
min: function() { // 取最小值向下取整为最小刻度
|
min: function () { // 取最小值向下取整为最小刻度
|
||||||
return 0
|
return 0
|
||||||
},
|
},
|
||||||
max: function(value) { // 取最大值向上取整为最大刻度
|
max: function (value) { // 取最大值向上取整为最大刻度
|
||||||
return Math.ceil(value.max)
|
|
||||||
|
// console.log(value.max.toString().length)
|
||||||
|
// String(value.max)[0]
|
||||||
|
// for
|
||||||
|
// return String(value.max)[0] +
|
||||||
},
|
},
|
||||||
|
minInterval: 5,//间隔
|
||||||
scale: true,
|
scale: true,
|
||||||
type: 'value',
|
type: 'value',
|
||||||
name: '产量/㎡', // y轴上方的单位
|
name: '产量/㎡', // y轴上方的单位
|
||||||
@@ -315,8 +327,16 @@ export default {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
.coldProductChart{
|
.coldProductChart{
|
||||||
top: -10px;
|
top: -10px;
|
||||||
}
|
}
|
||||||
|
.isra-chart-tooltip {
|
||||||
|
background: #0a2b4f77 !important;
|
||||||
|
border: none !important;
|
||||||
|
backdrop-filter: blur(12px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.isra-chart-tooltip * {
|
||||||
|
color: #fff !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-09-21 09:06:28
|
* @Date: 2023-09-21 09:06:28
|
||||||
* @LastEditTime: 2024-04-03 17:09:12
|
* @LastEditTime: 2024-04-23 15:36:35
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@@ -162,6 +162,8 @@ export default {
|
|||||||
this.chart.setOption({
|
this.chart.setOption({
|
||||||
// color: colors,
|
// color: colors,
|
||||||
tooltip: {
|
tooltip: {
|
||||||
|
trigger: 'item',
|
||||||
|
className: "isra-chart-tooltip",
|
||||||
trigger: 'axis',
|
trigger: 'axis',
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
type: 'cross'
|
type: 'cross'
|
||||||
@@ -215,15 +217,17 @@ export default {
|
|||||||
// },
|
// },
|
||||||
yAxis: [
|
yAxis: [
|
||||||
{
|
{
|
||||||
// min: function() { // 取最小值向下取整为最小刻度
|
min: function () { // 取最小值向下取整为最小刻度
|
||||||
// return 0
|
return 0
|
||||||
// },
|
},
|
||||||
// max: function(value) { // 取最大值向上取整为最大刻度
|
max: function (value) { // 取最大值向上取整为最大刻度
|
||||||
// return Math.ceil(value.max)
|
},
|
||||||
// },
|
|
||||||
scale: true,
|
scale: true,
|
||||||
type: 'value',
|
type: 'value',
|
||||||
name: '良品率/%',
|
name: '良品率/%',
|
||||||
|
max: 100,//最大值
|
||||||
|
min: 0,//最小值
|
||||||
|
interval: 20,//间隔
|
||||||
nameTextStyle: {// y轴上方单位的颜色
|
nameTextStyle: {// y轴上方单位的颜色
|
||||||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色
|
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色
|
||||||
align: "left",
|
align: "left",
|
||||||
@@ -260,12 +264,17 @@ export default {
|
|||||||
// },
|
// },
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
// min: function() { // 取最小值向下取整为最小刻度
|
min: function () { // 取最小值向下取整为最小刻度
|
||||||
// return 0
|
return 0
|
||||||
// },
|
},
|
||||||
// max: function(value) { // 取最大值向上取整为最大刻度
|
max: function (value) { // 取最大值向上取整为最大刻度
|
||||||
// return Math.ceil(value.max)
|
|
||||||
// },
|
// console.log(value.max.toString().length)
|
||||||
|
// String(value.max)[0]
|
||||||
|
// for
|
||||||
|
// return String(value.max)[0] +
|
||||||
|
},
|
||||||
|
minInterval: 5,//间隔
|
||||||
scale: true,
|
scale: true,
|
||||||
type: 'value',
|
type: 'value',
|
||||||
name: '产量/片', // y轴上方的单位
|
name: '产量/片', // y轴上方的单位
|
||||||
@@ -324,4 +333,13 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
top: -30px;
|
top: -30px;
|
||||||
}
|
}
|
||||||
|
.isra-chart-tooltip {
|
||||||
|
background: #0a2b4f77 !important;
|
||||||
|
border: none !important;
|
||||||
|
backdrop-filter: blur(12px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.isra-chart-tooltip * {
|
||||||
|
color: #fff !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -128,6 +128,8 @@ export default {
|
|||||||
this.chart.setOption({
|
this.chart.setOption({
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: 'axis',
|
trigger: 'axis',
|
||||||
|
trigger: 'item',
|
||||||
|
className: "isra-chart-tooltip",
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
// 坐标轴指示器,坐标轴触发有效
|
// 坐标轴指示器,坐标轴触发有效
|
||||||
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
|
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
|
||||||
@@ -226,4 +228,13 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
top: -30px;
|
top: -30px;
|
||||||
}
|
}
|
||||||
|
.isra-chart-tooltip {
|
||||||
|
background: #0a2b4f77 !important;
|
||||||
|
border: none !important;
|
||||||
|
backdrop-filter: blur(12px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.isra-chart-tooltip * {
|
||||||
|
color: #fff !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-12-27 13:54:52
|
* @Date: 2023-12-27 13:54:52
|
||||||
* @LastEditTime: 2024-04-03 18:12:18
|
* @LastEditTime: 2024-04-19 15:43:08
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@@ -101,11 +101,14 @@ export default {
|
|||||||
});;
|
});;
|
||||||
},
|
},
|
||||||
initChart(nameList, topNameList, nameWasteList, passRateList, wasteList) {
|
initChart(nameList, topNameList, nameWasteList, passRateList, wasteList) {
|
||||||
let rawData = []
|
if (topNameList.length === 0 && nameWasteList.length === 0 && passRateList === 0 && wasteList === 0) {
|
||||||
let colors = ['#0fdedb', '#2359ec']
|
return
|
||||||
|
} else {
|
||||||
|
let rawData = []
|
||||||
|
let colors = ['#0fdedb', '#2359ec']
|
||||||
rawData.push(passRateList, wasteList)
|
rawData.push(passRateList, wasteList)
|
||||||
const totalData = [];
|
const totalData = [];
|
||||||
// if (rawData.length != 0 && raw,Data,length != 0) {
|
// if (rawData.length != 0 && raw,Data,length != 0) {
|
||||||
for (let i = 0; i < rawData[0].length; ++i) {
|
for (let i = 0; i < rawData[0].length; ++i) {
|
||||||
let sum = 0;
|
let sum = 0;
|
||||||
for (let j = 0; j < rawData.length; ++j) {
|
for (let j = 0; j < rawData.length; ++j) {
|
||||||
@@ -113,150 +116,152 @@ export default {
|
|||||||
}
|
}
|
||||||
totalData.push(sum);
|
totalData.push(sum);
|
||||||
}
|
}
|
||||||
// }
|
// }
|
||||||
// rawData[1].map((d, did) =>
|
// rawData[1].map((d, did) =>
|
||||||
// console.log((d / totalData[did]).toFixed(3))
|
// console.log((d / totalData[did]).toFixed(3))
|
||||||
// // totalData[did] <= 0 ? 0 : d / totalData[did]
|
// // totalData[did] <= 0 ? 0 : d / totalData[did]
|
||||||
// )
|
// )
|
||||||
console.log('total', totalData)
|
console.log('total', totalData)
|
||||||
const series = [
|
const series = [
|
||||||
'良品',
|
'良品',
|
||||||
'废品',
|
'废品',
|
||||||
// 'Affiliate Ad',
|
// 'Affiliate Ad',
|
||||||
// 'Video Ad',
|
// 'Video Ad',
|
||||||
// 'Search Engine'
|
// 'Search Engine'
|
||||||
].map((name, sid) => {
|
].map((name, sid) => {
|
||||||
// console.log(sid)
|
// console.log(sid)
|
||||||
return {
|
return {
|
||||||
name,
|
name,
|
||||||
type: 'bar',
|
type: 'bar',
|
||||||
stack: 'total',
|
stack: 'total',
|
||||||
barWidth: 12,
|
barWidth: 12,
|
||||||
// label: {
|
// label: {
|
||||||
// show: true,
|
// show: true,
|
||||||
// formatter: (params) => Math.round(params.value * 1000) / 10 + '%'
|
// formatter: (params) => Math.round(params.value * 1000) / 10 + '%'
|
||||||
// },
|
// },
|
||||||
color:colors[sid],
|
color: colors[sid],
|
||||||
data: rawData.length != 0 ? rawData[sid].map((d, did) =>
|
data: rawData.length != 0 ? rawData[sid].map((d, did) =>
|
||||||
totalData[did] <= 0 ? 0 : (d / totalData[did]).toFixed(4)
|
totalData[did] <= 0 ? 0 : (d / totalData[did]).toFixed(4)
|
||||||
) : []
|
) : []
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
// this.charts.resize({
|
// this.charts.resize({
|
||||||
// //width: width,
|
// //width: width,
|
||||||
// //height: height,
|
// //height: height,
|
||||||
// // es6解构
|
// // es6解构
|
||||||
// width,
|
// width,
|
||||||
// height
|
// height
|
||||||
// })
|
// })
|
||||||
this.chart = echarts.init(document.getElementById(this.id))
|
this.chart = echarts.init(document.getElementById(this.id))
|
||||||
let isFinished = false //标记 isFinished
|
let isFinished = false //标记 isFinished
|
||||||
this.chart.on('finished', _ => {
|
this.chart.on('finished', _ => {
|
||||||
if (!isFinished) {
|
if (!isFinished) {
|
||||||
console.log('我只执行一次')
|
console.log('我只执行一次')
|
||||||
isFinished = true
|
isFinished = true
|
||||||
// this.isLoading = false //关闭loading
|
// this.isLoading = false //关闭loading
|
||||||
this.chart.resize() //重新渲染charts大小
|
this.chart.resize() //重新渲染charts大小
|
||||||
}
|
|
||||||
console.log(113, 'finished')
|
|
||||||
})
|
|
||||||
this.chart.setOption({
|
|
||||||
legend: {
|
|
||||||
formatter: function (name) {
|
|
||||||
//通过name获取到数组对象中的单个对象
|
|
||||||
let singleData = series.filter(function (item) {
|
|
||||||
return item.name == name
|
|
||||||
})
|
|
||||||
return name + parseFloat((singleData[0].data * 100).toFixed(0)) + '%'
|
|
||||||
},
|
|
||||||
itemWidth: 12,
|
|
||||||
itemHeight: 12,
|
|
||||||
bottom: '20',
|
|
||||||
left: '20',
|
|
||||||
icon: 'roundRect',
|
|
||||||
textStyle: {
|
|
||||||
color: 'rgba(255,255,255,.9)',
|
|
||||||
fontSize:12,
|
|
||||||
}
|
}
|
||||||
},
|
console.log(113, 'finished')
|
||||||
grid: {
|
})
|
||||||
top:'0',
|
this.chart.setOption({
|
||||||
left: '3%',
|
legend: {
|
||||||
right: '4%',
|
formatter: function (name) {
|
||||||
// bottom: '3%',
|
//通过name获取到数组对象中的单个对象
|
||||||
width: 'auto',
|
let singleData = series.filter(function (item) {
|
||||||
height: '95',
|
return item.name == name
|
||||||
containLabel: true
|
})
|
||||||
},
|
return name + parseFloat((singleData[0].data * 100).toFixed(2)) + '%'
|
||||||
yAxis: [
|
|
||||||
{
|
|
||||||
type: 'category',
|
|
||||||
inverse: true,
|
|
||||||
splitLine: {
|
|
||||||
show: false
|
|
||||||
},
|
},
|
||||||
axisTick: {
|
itemWidth: 12,
|
||||||
show: false
|
itemHeight: 12,
|
||||||
},
|
bottom: '20',
|
||||||
axisLine: {
|
left: '20',
|
||||||
show: false
|
icon: 'roundRect',
|
||||||
},
|
textStyle: {
|
||||||
axisLabel: {
|
color: 'rgba(255,255,255,.9)',
|
||||||
show: true,
|
fontSize: 12,
|
||||||
inside: true,
|
}
|
||||||
interval: 0, //横轴信息全部显
|
|
||||||
splitNumber: 50,
|
|
||||||
// boundaryGap: [20, 20],
|
|
||||||
textStyle: {
|
|
||||||
color: 'rgba(255,255,255,.9)',
|
|
||||||
verticalAlign: 'bottom',
|
|
||||||
fontSize: 16,
|
|
||||||
align: 'left',
|
|
||||||
padding: [0, 0, 10, -5]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data: topNameList
|
|
||||||
},
|
},
|
||||||
{
|
grid: {
|
||||||
type: 'category',
|
top: '0',
|
||||||
inverse: true,
|
left: '3%',
|
||||||
splitLine: {
|
right: '4%',
|
||||||
show: false
|
// bottom: '3%',
|
||||||
|
width: 'auto',
|
||||||
|
height: '95',
|
||||||
|
containLabel: true
|
||||||
|
},
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
type: 'category',
|
||||||
|
inverse: true,
|
||||||
|
splitLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
show: true,
|
||||||
|
inside: true,
|
||||||
|
interval: 0, //横轴信息全部显
|
||||||
|
splitNumber: 50,
|
||||||
|
// boundaryGap: [20, 20],
|
||||||
|
textStyle: {
|
||||||
|
color: 'rgba(255,255,255,.9)',
|
||||||
|
verticalAlign: 'bottom',
|
||||||
|
fontSize: 16,
|
||||||
|
align: 'left',
|
||||||
|
padding: [0, 0, 10, -5]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data: topNameList
|
||||||
},
|
},
|
||||||
axisTick: {
|
{
|
||||||
show: false
|
type: 'category',
|
||||||
},
|
inverse: true,
|
||||||
axisLine: {
|
splitLine: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
axisLabel: {
|
axisTick: {
|
||||||
show: true,
|
show: false
|
||||||
inside: true,
|
},
|
||||||
interval: 0, //横轴信息全部显
|
axisLine: {
|
||||||
splitNumber: 50,
|
show: false
|
||||||
// boundaryGap: [20, 20],
|
},
|
||||||
textStyle: {
|
axisLabel: {
|
||||||
color: 'rgba(255,255,255,.9)',
|
show: true,
|
||||||
verticalAlign: 'bottom',
|
inside: true,
|
||||||
fontSize: 16,
|
interval: 0, //横轴信息全部显
|
||||||
align: 'right',
|
splitNumber: 50,
|
||||||
padding: [0, 0, 10, -5]
|
// boundaryGap: [20, 20],
|
||||||
}
|
textStyle: {
|
||||||
},
|
color: 'rgba(255,255,255,.9)',
|
||||||
data: nameWasteList
|
verticalAlign: 'bottom',
|
||||||
}
|
fontSize: 16,
|
||||||
],
|
align: 'right',
|
||||||
xAxis: {
|
padding: [0, 0, 10, -5]
|
||||||
// max: 120,
|
}
|
||||||
show: false,
|
},
|
||||||
},
|
data: nameWasteList
|
||||||
series:series
|
}
|
||||||
})
|
],
|
||||||
this.$nextTick(() => {
|
xAxis: {
|
||||||
setTimeout(() => {
|
// max: 120,
|
||||||
this.resize()
|
show: false,
|
||||||
},1000);
|
},
|
||||||
})
|
series: series
|
||||||
|
})
|
||||||
|
this.$nextTick(() => {
|
||||||
|
setTimeout(() => {
|
||||||
|
this.resize()
|
||||||
|
}, 1000);
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
// this.chart.resize({
|
// this.chart.resize({
|
||||||
// width: 'auto',
|
// width: 'auto',
|
||||||
// height: 90
|
// height: 90
|
||||||
|
|||||||
@@ -2,16 +2,16 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-07-19 15:18:30
|
* @Date: 2021-07-19 15:18:30
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @LastEditTime: 2024-04-03 17:14:03
|
* @LastEditTime: 2024-04-24 14:48:00
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<div id="container" ref="container" class="visual-container" :style="styles">
|
<div id="container" ref="container" class="visual-container" :style="styles">
|
||||||
<el-row class="container-title" :style="{
|
<el-row class="container-title" :style="{
|
||||||
height: 88 + 'px',
|
height: 88 + 'px',
|
||||||
lineHeight: 88 + 'px',
|
lineHeight: 88 + 'px',
|
||||||
fontSize: 31 + 'px',
|
fontSize: 31 + 'px',
|
||||||
}">
|
}">
|
||||||
<img src="../../assets/img/logo.png" style="width: 1.1em; position: relative; top: 0.22em" alt="" />
|
<img src="../../assets/img/logo.png" style="width: 1.1em; position: relative; top: 0.22em" alt="" />
|
||||||
许昌安彩深加工看板
|
许昌安彩深加工看板
|
||||||
<h3 class="unit">单位:河南汇融数字科技有限公司</h3>
|
<h3 class="unit">单位:河南汇融数字科技有限公司</h3>
|
||||||
@@ -25,25 +25,40 @@
|
|||||||
<el-row class="container-main flex-col" type="flex">
|
<el-row class="container-main flex-col" type="flex">
|
||||||
<el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="15" type="flex" class="flex-1" style="height: 50%">
|
<el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="15" type="flex" class="flex-1" style="height: 50%">
|
||||||
<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'" :height="318" :title-icon="'eqAlarm'">
|
<base-container :show-time="true" :title="'设备报警'" :size="'small'" :height="318" :title-icon="'eqAlarm'">
|
||||||
<dv-scroll-board class="eqTable" :config="eqConfig" style="width: 100%; height: 350px"
|
<dv-scroll-board class="eqTable" :config="eqConfig" style="width: 100%; height: 350px"
|
||||||
ref="eqScrollBoard" />
|
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 :show-time="true" :title="'各工序缺陷汇总'" :size="'small'" :title-icon="'scrap'">
|
||||||
<dv-scroll-board :config="processConfig" style="width: 100%; height: 350px" ref="processScrollBoard" />
|
<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 :show-time="false" :height="318" :size="'small'" :title="'工单监控'" :title-icon="'eqMonitoring'">
|
||||||
<div class="order" style="width: 100%; overflow: hidden scroll; height: 350px">
|
<div class="order" style="width: 100%; overflow: hidden scroll; height: 350px">
|
||||||
<el-row v-for="op in orderList" :key="op.id" style="margin-bottom: .5em">
|
<el-row v-for="op in orderList" :key="op.id" style="margin-bottom: .5em;overflow: hidden;">
|
||||||
<!-- <el-col :span="12"> -->
|
<!-- <el-col :span="12"> -->
|
||||||
|
<!-- <div style="height: 34px;"> -->
|
||||||
<p class="now-secondary-title" style="font-size: 14px;opacity: calc(.6);">{{ op.name }}</p>
|
<span style="display: inline-block;width: 330px;">
|
||||||
<el-progress style="width: 620px;" text-color="rgba(255, 255, 255, .6)" :stroke-width="10"
|
<span class="now-secondary-title" style="font-size: 14px;opacity: calc(.6);">{{ op.name }}</span>
|
||||||
|
<el-divider class="split" v-if="op.specifications" direction="vertical"></el-divider>
|
||||||
|
<!-- <span v-if="op.size" class="split"></span> -->
|
||||||
|
<span v-if="op.specifications" class="orderSize" style="font-size: 14px;opacity: calc(.6);">{{
|
||||||
|
op.specifications }}</span>
|
||||||
|
<el-divider class="split" v-if="op.planQuantity" direction="vertical"></el-divider>
|
||||||
|
<span v-if="op.planQuantity" class="orderPlan" style="font-size: 14px;opacity: calc(.6);">{{
|
||||||
|
op.planQuantity }}</span>
|
||||||
|
</span>
|
||||||
|
<span v-if="op.actualQuantity" class="orderFinish" style="font-size: 14px;margin-left: 130px;">{{
|
||||||
|
op.actualQuantity
|
||||||
|
}}</span>
|
||||||
|
<el-divider class="split" style="background-color: rgba(0, 255, 247, 1)" v-if="op.actualQuantity"
|
||||||
|
direction="vertical"></el-divider>
|
||||||
|
<!-- </div> -->
|
||||||
|
<el-progress style="width: 620px;" text-color="rgba(0, 255, 247, 1)" :stroke-width="10"
|
||||||
define-back-color="rgba(32, 57, 96, 1)" :percentage="op.progressRate" class="custom-progress-bar" />
|
define-back-color="rgba(32, 57, 96, 1)" :percentage="op.progressRate" class="custom-progress-bar" />
|
||||||
</el-row>
|
</el-row>
|
||||||
</div>
|
</div>
|
||||||
@@ -54,8 +69,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 :show-yes-time="true" :no-content-padding="true" :height="256" :size="'eqStatus'"
|
<base-container :show-time="true" :show-yes-time="true" :no-content-padding="true" :height="256"
|
||||||
:title="'能源监控'" :title-icon="'energyMonitoring'">
|
:size="'eqStatus'" :title="'能源监控'" :title-icon="'energyMonitoring'">
|
||||||
<el-row :gutter="9">
|
<el-row :gutter="9">
|
||||||
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="24">
|
<el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="24">
|
||||||
<linear-bar-chart ref="EnergyMonitoringChart" :name-list="EnergyMonitoringNameList"
|
<linear-bar-chart ref="EnergyMonitoringChart" :name-list="EnergyMonitoringNameList"
|
||||||
@@ -65,9 +80,9 @@
|
|||||||
</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 :show-time="true" :no-content-padding="true" :height="318 + 338 + 16" :size="'eqStatus'"
|
<base-container :show-time="true" :no-content-padding="true" :height="318 + 338 + 16" :size="'eqStatus'"
|
||||||
:title="'产线产量及良品率'" :title-icon="'productLine'">
|
:title="'产线产量及良品率'" :title-icon="'productLine'">
|
||||||
<div class="myLegend">
|
<div class="myLegend">
|
||||||
<div class=" barCircleLegend"></div>
|
<div class=" barCircleLegend"></div>
|
||||||
<div class=" barCircle"></div>
|
<div class=" barCircle"></div>
|
||||||
<h4 class="barText">产线良品率</h4>
|
<h4 class="barText">产线良品率</h4>
|
||||||
@@ -95,80 +110,79 @@ const qualityYearList = [
|
|||||||
{
|
{
|
||||||
name: '翻转机',
|
name: '翻转机',
|
||||||
code: 'EQ20240110112358000235',
|
code: 'EQ20240110112358000235',
|
||||||
status: '运行',
|
status: '正常',
|
||||||
error: '否',
|
error: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '烘干炉',
|
name: '烘干炉',
|
||||||
code: 'EQ20240110112537000241',
|
code: 'EQ20240110112537000241',
|
||||||
status: '运行',
|
status: '计划停机',
|
||||||
error: '否',
|
error: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '清洗机',
|
name: '清洗机',
|
||||||
code: ' EQ20240110112310000232',
|
code: ' EQ20240110112310000232',
|
||||||
status: '运行',
|
status: '正常',
|
||||||
error: '否',
|
error: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '钢化清洗机',
|
name: '钢化清洗机',
|
||||||
code: 'EQ20240110111700000208',
|
code: 'EQ20240110111700000208',
|
||||||
status: '运行',
|
status: '正常',
|
||||||
error: '否',
|
error: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '固化机',
|
name: '固化机',
|
||||||
code: 'EQ20240110111700000201',
|
code: 'EQ20240110111700000201',
|
||||||
status: '运行',
|
status: '正常',
|
||||||
error: '否',
|
error: false,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '磨边清洗机',
|
name: '磨边清洗机',
|
||||||
code: ' EQ20240110111700000208',
|
code: ' EQ20240110111700000208',
|
||||||
status: '运行',
|
status: '正常',
|
||||||
error: '否',
|
error: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '预热机',
|
name: '预热机',
|
||||||
code: 'EQ20240110111700000205',
|
code: 'EQ20240110111700000205',
|
||||||
status: '故障',
|
status: '故障',
|
||||||
error: '是',
|
error: false,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '下片机',
|
name: '下片机',
|
||||||
code: 'EQ20240115151435000279',
|
code: 'EQ20240115151435000279',
|
||||||
status: '运行',
|
error: true,
|
||||||
error: '否',
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '冷却机',
|
name: '冷却机',
|
||||||
code: 'EQ20240110111700000203',
|
code: 'EQ20240110111700000203',
|
||||||
status: '运行',
|
status: '正常',
|
||||||
error: '否',
|
error: false,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'A储片机106',
|
name: 'A储片机106',
|
||||||
code: 'EQ20240110111700000202',
|
code: 'EQ20240110111700000202',
|
||||||
status: '运行',
|
status: '正常',
|
||||||
error: '否',
|
error: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '二次清洗机',
|
name: '二次清洗机',
|
||||||
code: 'EQ20240110111700000209',
|
code: 'EQ20240110111700000209',
|
||||||
status: '运行',
|
status: '正常',
|
||||||
error: '否',
|
error: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '二次磨边机',
|
name: '二次磨边机',
|
||||||
code: ' EQ20240110110927000181',
|
code: ' EQ20240110110927000181',
|
||||||
status: '故障',
|
status: '正常',
|
||||||
error: '是',
|
error: false,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '测试设备',
|
name: '测试设备',
|
||||||
code: 'EQ20240110111700000201',
|
code: 'EQ20240110111700000201',
|
||||||
status: '运行',
|
status: '正常',
|
||||||
error: '否',
|
error: true,
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
const qualityMonthList = [
|
const qualityMonthList = [
|
||||||
@@ -217,37 +231,37 @@ const qualityMonthList = [
|
|||||||
];
|
];
|
||||||
const orderProcessList = [
|
const orderProcessList = [
|
||||||
{
|
{
|
||||||
id: '1',
|
id: 1,
|
||||||
outRate: '.8',
|
outRate: '.8',
|
||||||
name: '凯盛0322',
|
name: '凯盛0322',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '2',
|
id: 2,
|
||||||
outRate: '.4',
|
outRate: '.4',
|
||||||
name: '光伏玻璃4.0',
|
name: '光伏玻璃4.0',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '3',
|
id: 3,
|
||||||
outRate: '.5',
|
outRate: '.5',
|
||||||
name: '光伏玻璃3.0',
|
name: '光伏玻璃3.0',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '4',
|
id: 4,
|
||||||
outRate: '.3',
|
outRate: '.3',
|
||||||
name: '光伏玻璃2.0',
|
name: '光伏玻璃2.0',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '5',
|
id: 5,
|
||||||
outRate: '.5',
|
outRate: '.5',
|
||||||
name: '光伏玻璃1.0',
|
name: '光伏玻璃1.0',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '6',
|
id: 6,
|
||||||
outRate: '.8',
|
outRate: '.8',
|
||||||
name: '光伏玻璃',
|
name: '光伏玻璃',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '7',
|
id: 7,
|
||||||
outRate: '.8',
|
outRate: '.8',
|
||||||
name: '统计订单',
|
name: '统计订单',
|
||||||
},
|
},
|
||||||
@@ -364,42 +378,66 @@ export default {
|
|||||||
{
|
{
|
||||||
id: '1',
|
id: '1',
|
||||||
name: '测试工单',
|
name: '测试工单',
|
||||||
progressRate: 0.933333,
|
progressRate: 0.933333,
|
||||||
|
specifications: '1100*5554*22',
|
||||||
|
plan: 11111,
|
||||||
|
actualQuantity:111,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '2',
|
id: '2',
|
||||||
name: '测试工单2',
|
name: '测试工单2',
|
||||||
progressRate: 0.932323,
|
progressRate: 0.932323,
|
||||||
|
size: '1100*5554*22',
|
||||||
|
plan: 11111,
|
||||||
|
actualQuantity: 111,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '3',
|
id: '3',
|
||||||
name: '测试工单3',
|
name: '测试工单3',
|
||||||
progressRate: 0.23232,
|
progressRate: 0.23232,
|
||||||
|
size: '1100*5554*22',
|
||||||
|
plan: 11111,
|
||||||
|
actualQuantity: 111,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '4',
|
id: '4',
|
||||||
name: '测试工单4',
|
name: '测试工单4',
|
||||||
progressRate: 0.32323,
|
progressRate: 0.32323,
|
||||||
|
size: '1100*5554*22',
|
||||||
|
plan: 11111,
|
||||||
|
actualQuantity: 111,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '4',
|
id: '5',
|
||||||
name: '测试工单4',
|
name: '测试工单4',
|
||||||
progressRate: 0.32323,
|
progressRate: 0.32323,
|
||||||
|
size: '1100*5554*22',
|
||||||
|
plan: 11111,
|
||||||
|
actualQuantity: 111,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '4',
|
id: '6',
|
||||||
name: '测试工单4',
|
name: '测试工单4',
|
||||||
|
size: '1100*5554*22',
|
||||||
progressRate: 0.32323,
|
progressRate: 0.32323,
|
||||||
|
plan: 11111,
|
||||||
|
actualQuantity: 111,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '4',
|
id: '7',
|
||||||
name: '测试工单4',
|
name: '测试工单4',
|
||||||
|
size: '1100*5554*22',
|
||||||
progressRate: 0.32323,
|
progressRate: 0.32323,
|
||||||
|
plan: 11111,
|
||||||
|
actualQuantity: 111,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: '4',
|
id: '8',
|
||||||
name: '测试工单4',
|
name: '测试工单4',
|
||||||
progressRate: 0.32323,
|
progressRate: 0.32323,
|
||||||
|
size: '1100*5554*22',
|
||||||
|
plan: 11111,
|
||||||
|
actualQuantity: 111,
|
||||||
},
|
},
|
||||||
// {
|
// {
|
||||||
// id: '5',
|
// id: '5',
|
||||||
@@ -416,7 +454,10 @@ export default {
|
|||||||
return {
|
return {
|
||||||
id: ele.id,
|
id: ele.id,
|
||||||
name: ele.name,
|
name: ele.name,
|
||||||
progressRate: parseFloat((ele.progressRate * 100).toFixed(0)),
|
progressRate: parseFloat((ele.progressRate * 100).toFixed(0)),
|
||||||
|
specifications: ele.specifications ? '规格' + ele.specifications :null,
|
||||||
|
planQuantity: ele.plan ? '计划' + ele.plan + '片' : null,
|
||||||
|
actualQuantity: ele.actualQuantity + '片',
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -440,8 +481,8 @@ export default {
|
|||||||
<span style="color:rgba(255,255,255,0.5)" >${item.name || ''}
|
<span style="color:rgba(255,255,255,0.5)" >${item.name || ''}
|
||||||
</span>`,
|
</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)">${item.code || ''}</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)"><div style="${item.status == '正常' ? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:13px 10px 0 0 ' : 'box-shadow: 0px 0px 2px 1px #FFBD02;width:6px;height:6px;border-radius: 50%; background-color: #FFBD02;float:left;margin:13px 10px 0 0 '}"></div> ${item.status || ''}</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)">${item.error || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)"><div style="${item.error == false ? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:13px 10px 0 0 ' : 'box-shadow: 0px 0px 2px 1px red;width:6px;height:6px;border-radius: 50%; background-color: red;float:left;margin:13px 10px 0 0 '}"></div> ${item.error == true ? '是' : '否' || ''}</span>`,
|
||||||
]);
|
]);
|
||||||
this.eqConfig.data = eqArr;
|
this.eqConfig.data = eqArr;
|
||||||
let data = [
|
let data = [
|
||||||
@@ -690,7 +731,10 @@ export default {
|
|||||||
return {
|
return {
|
||||||
id: ele.id,
|
id: ele.id,
|
||||||
name: ele.name,
|
name: ele.name,
|
||||||
progressRate: parseFloat((ele.progressRate * 100).toFixed(0)),
|
progressRate: parseFloat((ele.progressRate * 100).toFixed(0)),
|
||||||
|
specifications: ele.specifications ? '规格' + ele.specifications :null,
|
||||||
|
planQuantity: ele.planQuantity ? '计划' + ele.planQuantity + '片' : null,
|
||||||
|
actualQuantity: ele.actualQuantity ? ele.actualQuantity + '片' : null,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -704,12 +748,8 @@ export default {
|
|||||||
`<span style="color:rgba(255,255,255,0.5)">${
|
`<span style="color:rgba(255,255,255,0.5)">${
|
||||||
item.code || ''
|
item.code || ''
|
||||||
}</span>`,
|
}</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)"><span style="color:rgba(255,255,255,0.5)"></span> ${
|
`<span style="color:rgba(255,255,255,0.5)"><div style="${item.status == '正常' ? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:10px 10px 0 0 ' : 'box-shadow: 0px 0px 2px 1px #FFBD02;width:6px;height:6px;border-radius: 50%; background-color: #FFBD02;float:left;margin:10px 10px 0 0 '}"></div> ${item.status || ''}</span>`,
|
||||||
item.status || ''
|
`<span style="color:rgba(255,255,255,0.5)"><div style="${item.error == false ? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:10px 10px 0 0 ' : 'box-shadow: 0px 0px 2px 1px red;width:6px;height:6px;border-radius: 50%; background-color: red;float:left;margin:10px 10px 0 0 '}"></div> ${item.error == true ?'是' :'否' || ''}</span>`,
|
||||||
}</span>`,
|
|
||||||
`<span style="color:rgba(255,255,255,0.5)">${
|
|
||||||
item.error || ''
|
|
||||||
}</span>`,
|
|
||||||
]);
|
]);
|
||||||
this.eqConfig.data = eqArr;
|
this.eqConfig.data = eqArr;
|
||||||
// this.$nextTick(() => {
|
// this.$nextTick(() => {
|
||||||
@@ -751,7 +791,23 @@ export default {
|
|||||||
outputNumList
|
outputNumList
|
||||||
);
|
);
|
||||||
})
|
})
|
||||||
} else if (this.SJGInitWebSocket === 'inspection') {
|
} else if (this.SJGWsData.type === 'inspection') {
|
||||||
|
let processArr = this.SJGWsData.detData.map((item, index) => [
|
||||||
|
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
</span>`,
|
||||||
|
`<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.$nextTick(() => {
|
||||||
|
this.$refs['processScrollBoard'].updateRows(processArr);
|
||||||
|
// })
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
@@ -802,6 +858,18 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
.split{
|
||||||
|
width: 1px;
|
||||||
|
// display: inline-block;
|
||||||
|
height: 14px;
|
||||||
|
// margin-top: 2px;
|
||||||
|
// line-height: 0;
|
||||||
|
margin-left: 8px;
|
||||||
|
opacity:calc(.6);
|
||||||
|
margin-right: 8px;
|
||||||
|
background-color: #C8CDD7;
|
||||||
|
// border: 1px solid #C8CDD7;
|
||||||
|
}
|
||||||
.myLegend {
|
.myLegend {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: -28px;
|
top: -28px;
|
||||||
@@ -902,12 +970,39 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.now-secondary-title {
|
.now-secondary-title {
|
||||||
|
display: inline-block;
|
||||||
|
width: 70px;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-size: 1em;
|
font-size: 14px;
|
||||||
line-height: 2em;
|
line-height: 2em;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
.orderSize {
|
||||||
|
display: inline-block;
|
||||||
|
width: 120px;
|
||||||
|
margin: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 2em;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.orderFinish {
|
||||||
|
display: inline-block;
|
||||||
|
width: 60px;
|
||||||
|
margin: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 2em;
|
||||||
|
text-align: right;
|
||||||
|
color: rgba(0, 255, 247, 1);
|
||||||
|
}
|
||||||
|
.orderPlan {
|
||||||
|
display: inline-block;
|
||||||
|
width: 100px;
|
||||||
|
margin: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 2em;
|
||||||
|
color: #fff;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
.now-team-content {
|
.now-team-content {
|
||||||
font-size: 3em;
|
font-size: 3em;
|
||||||
line-height: 1em;
|
line-height: 1em;
|
||||||
|
|||||||
@@ -138,7 +138,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-customer:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-customer:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:core-customer:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -110,7 +110,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-department:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-department:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:core-department:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -156,11 +156,11 @@ export default {
|
|||||||
prop: 'createTime',
|
prop: 'createTime',
|
||||||
label: '添加时间',
|
label: '添加时间',
|
||||||
fixed: true,
|
fixed: true,
|
||||||
width: 180,
|
minWidth: 180,
|
||||||
filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
|
filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
|
||||||
},
|
},
|
||||||
{ prop: 'name', label: '设备名称', width: 180, showOverflowtooltip: true },
|
{ prop: 'name', label: '设备名称', minWidth: 180, showOverflowtooltip: true },
|
||||||
{ width: 250, prop: 'code', label: '设备编码' },
|
{ minWidth: 250, prop: 'code', label: '设备编码' },
|
||||||
{ prop: 'equipmentTypeName', label: '设备类型' },
|
{ prop: 'equipmentTypeName', label: '设备类型' },
|
||||||
{ prop: 'enName', label: '英文名称' },
|
{ prop: 'enName', label: '英文名称' },
|
||||||
{ prop: 'abbr', label: '缩写' },
|
{ prop: 'abbr', label: '缩写' },
|
||||||
@@ -211,7 +211,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: (this.$auth.hasPermi('base:core-equipment:export') || this.$auth.hasPermi('base:core-equipment:create')) ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-equipment:export')
|
type: this.$auth.hasPermi('base:core-equipment:export')
|
||||||
|
|||||||
@@ -126,7 +126,8 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-equipment-bind-section:create')
|
||||||
|
? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-equipment-bind-section:create')
|
type: this.$auth.hasPermi('base:core-equipment-bind-section:create')
|
||||||
|
|||||||
@@ -90,7 +90,7 @@ export default {
|
|||||||
prop: 'createTime',
|
prop: 'createTime',
|
||||||
label: '添加时间',
|
label: '添加时间',
|
||||||
fixed: true,
|
fixed: true,
|
||||||
width: 180,
|
minWidth: 180,
|
||||||
filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
|
filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
|
||||||
},
|
},
|
||||||
{ prop: 'name', label: '类型名称' },
|
{ prop: 'name', label: '类型名称' },
|
||||||
@@ -111,7 +111,8 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-equipment-type:create')
|
||||||
|
? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-equipment-type:create')
|
type: this.$auth.hasPermi('base:core-equipment-type:create')
|
||||||
|
|||||||
@@ -137,7 +137,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-hot-material-check:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-hot-material-check:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:core-hot-material-check:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -110,7 +110,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-major:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-major:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:core-major:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -14,7 +14,7 @@
|
|||||||
<method-btn
|
<method-btn
|
||||||
v-if="tableBtn.length"
|
v-if="tableBtn.length"
|
||||||
slot="handleBtn"
|
slot="handleBtn"
|
||||||
:width="120"
|
:Width="120"
|
||||||
label="操作"
|
label="操作"
|
||||||
:method-list="tableBtn"
|
:method-list="tableBtn"
|
||||||
@clickBtn="handleClick" />
|
@clickBtn="handleClick" />
|
||||||
@@ -48,45 +48,45 @@ const tableProps = [
|
|||||||
prop: 'createTime',
|
prop: 'createTime',
|
||||||
label: '添加时间',
|
label: '添加时间',
|
||||||
filter: parseTime,
|
filter: parseTime,
|
||||||
width: 150,
|
minWidth: 150,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'name',
|
prop: 'name',
|
||||||
label: '产品名称',
|
label: '产品名称',
|
||||||
width: 150,
|
minWidth: 150,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'code',
|
prop: 'code',
|
||||||
label: '产品编码',
|
label: '产品编码',
|
||||||
width: 190,
|
minWidth: 190,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'productType',
|
prop: 'productType',
|
||||||
label: '产品类型',
|
label: '产品类型',
|
||||||
filter: publicFormatter('product_type'),
|
filter: publicFormatter('product_type'),
|
||||||
width: 180,
|
minWidth: 180,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'specifications',
|
prop: 'specifications',
|
||||||
label: '规格',
|
label: '规格',
|
||||||
width: 150,
|
minWidth: 150,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'unit',
|
prop: 'unit',
|
||||||
label: '单位',
|
label: '单位',
|
||||||
filter: publicFormatter('unit_dict'),
|
filter: publicFormatter('unit_dict'),
|
||||||
width: 90,
|
minWidth: 90,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'remark',
|
prop: 'remark',
|
||||||
label: '备注',
|
label: '备注',
|
||||||
width: 120,
|
minWidth: 120,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
@@ -141,7 +141,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-product:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-product:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:core-product:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -14,7 +14,7 @@
|
|||||||
<method-btn
|
<method-btn
|
||||||
v-if="tableBtn.length"
|
v-if="tableBtn.length"
|
||||||
slot="handleBtn"
|
slot="handleBtn"
|
||||||
:width="120"
|
:minWidth="120"
|
||||||
label="操作"
|
label="操作"
|
||||||
:method-list="tableBtn"
|
:method-list="tableBtn"
|
||||||
@clickBtn="handleClick" />
|
@clickBtn="handleClick" />
|
||||||
@@ -30,7 +30,7 @@
|
|||||||
@cancel="handleCancel"
|
@cancel="handleCancel"
|
||||||
@confirm="handleConfirm"
|
@confirm="handleConfirm"
|
||||||
:before-close="handleCancel"
|
:before-close="handleCancel"
|
||||||
width="50%">
|
minWidth="50%">
|
||||||
<add-or-update
|
<add-or-update
|
||||||
ref="addOrUpdate"
|
ref="addOrUpdate"
|
||||||
@refreshDataList="successSubmit"></add-or-update>
|
@refreshDataList="successSubmit"></add-or-update>
|
||||||
@@ -56,39 +56,39 @@ const tableProps = [
|
|||||||
prop: 'createTime',
|
prop: 'createTime',
|
||||||
label: '添加时间',
|
label: '添加时间',
|
||||||
filter: parseTime,
|
filter: parseTime,
|
||||||
width: 150,
|
minWidth: 150,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'factoryName',
|
prop: 'factoryName',
|
||||||
label: '工厂',
|
label: '工厂',
|
||||||
width: 150,
|
minWidth: 150,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'roomNameDict',
|
prop: 'roomNameDict',
|
||||||
label: '车间名称',
|
label: '车间名称',
|
||||||
filter: publicFormatter('workshop'),
|
filter: publicFormatter('workshop'),
|
||||||
width: 120,
|
minWidth: 120,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'name',
|
prop: 'name',
|
||||||
label: '产线名称',
|
label: '产线名称',
|
||||||
width: 120,
|
minWidth: 120,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'code',
|
prop: 'code',
|
||||||
label: '产线编码',
|
label: '产线编码',
|
||||||
width: 150,
|
minWidth: 150,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'enabled',
|
prop: 'enabled',
|
||||||
label: '当前状态',
|
label: '当前状态',
|
||||||
filter: codeFilter('lineStatus'),
|
filter: codeFilter('lineStatus'),
|
||||||
width: 120,
|
minWidth: 120,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
// {
|
// {
|
||||||
@@ -98,13 +98,13 @@ const tableProps = [
|
|||||||
{
|
{
|
||||||
prop: 'description',
|
prop: 'description',
|
||||||
label: '描述',
|
label: '描述',
|
||||||
width: 120,
|
minWidth: 120,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'remark',
|
prop: 'remark',
|
||||||
label: '备注',
|
label: '备注',
|
||||||
width: 120,
|
minWidth: 120,
|
||||||
showOverflowtooltip: true
|
showOverflowtooltip: true
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
@@ -147,7 +147,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-production-line:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-production-line:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:core-production-line:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -132,7 +132,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-supplier:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-supplier:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:core-supplier:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-11-18 14:16:25
|
* @Date: 2021-11-18 14:16:25
|
||||||
* @LastEditors: DY
|
* @LastEditors: DY
|
||||||
* @LastEditTime: 2024-04-08 14:27:29
|
* @LastEditTime: 2024-04-10 16:16:31
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@@ -201,24 +201,26 @@
|
|||||||
@pagination="getList" /> -->
|
@pagination="getList" /> -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="card" style="padding-bottom: 16px;">
|
<div v-if="$auth.hasPermiAnd(['base:material-product-bom-det:query', 'extend:process-flow:query'])">
|
||||||
<div class="boxTitle">
|
<div class="card" style="padding-bottom: 16px;">
|
||||||
<span class="blueTitle"></span>
|
<div class="boxTitle">
|
||||||
<span>预计用料信息</span>
|
<span class="blueTitle"></span>
|
||||||
|
<span>预计用料信息</span>
|
||||||
|
</div>
|
||||||
|
<base-table
|
||||||
|
:table-props="tableProps1"
|
||||||
|
:page="listQuery1.pageNo"
|
||||||
|
:limit="listQuery1.pageSize"
|
||||||
|
:table-data="materialList"
|
||||||
|
:max-height="tableH" />
|
||||||
|
<!-- <pagination
|
||||||
|
v-show="listQuery1.total > 0"
|
||||||
|
:total="listQuery1.total"
|
||||||
|
:page.sync="listQuery1.pageNo"
|
||||||
|
:limit.sync="listQuery1.pageSize"
|
||||||
|
:page-sizes="[5, 10, 15]"
|
||||||
|
@pagination="getList" /> -->
|
||||||
</div>
|
</div>
|
||||||
<base-table
|
|
||||||
:table-props="tableProps1"
|
|
||||||
:page="listQuery1.pageNo"
|
|
||||||
:limit="listQuery1.pageSize"
|
|
||||||
:table-data="materialList"
|
|
||||||
:max-height="tableH" />
|
|
||||||
<!-- <pagination
|
|
||||||
v-show="listQuery1.total > 0"
|
|
||||||
:total="listQuery1.total"
|
|
||||||
:page.sync="listQuery1.pageNo"
|
|
||||||
:limit.sync="listQuery1.pageSize"
|
|
||||||
:page-sizes="[5, 10, 15]"
|
|
||||||
@pagination="getList" /> -->
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- <div class="drawer-body__footer">
|
<!-- <div class="drawer-body__footer">
|
||||||
@@ -461,7 +463,7 @@ export default {
|
|||||||
});
|
});
|
||||||
// 获取预使用原料列表
|
// 获取预使用原料列表
|
||||||
console.log('111我看看', this.dataForm.materialMethod)
|
console.log('111我看看', this.dataForm.materialMethod)
|
||||||
if (this.dataForm.id) {
|
if (this.dataForm.id && this.$auth.hasPermiAnd(['base:material-product-bom-det:query', 'extend:process-flow:query'])) {
|
||||||
if (this.dataForm.materialMethod === 1) {
|
if (this.dataForm.materialMethod === 1) {
|
||||||
// 产品
|
// 产品
|
||||||
getlistByProductId({
|
getlistByProductId({
|
||||||
|
|||||||
@@ -157,92 +157,105 @@ export default {
|
|||||||
// showTip: '预使用原料信息'
|
// showTip: '预使用原料信息'
|
||||||
// }
|
// }
|
||||||
// : undefined,
|
// : undefined,
|
||||||
{
|
this.$auth.hasPermi(`base:core-work-order:update`)
|
||||||
type: 'active',
|
? {
|
||||||
btnName: '激活',
|
type: 'active',
|
||||||
showParam: {
|
btnName: '激活',
|
||||||
type: '|',
|
showParam: {
|
||||||
data: [
|
type: '|',
|
||||||
{
|
data: [
|
||||||
name: 'status',
|
{
|
||||||
type: 'equal',
|
name: 'status',
|
||||||
value: 1
|
type: 'equal',
|
||||||
},
|
value: 1
|
||||||
{
|
},
|
||||||
name: 'status',
|
{
|
||||||
type: 'equal',
|
name: 'status',
|
||||||
value: 3
|
type: 'equal',
|
||||||
}
|
value: 3
|
||||||
]
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
: undefined,
|
||||||
{
|
this.$auth.hasPermi(`base:core-work-order:update`)
|
||||||
type: 'pause',
|
? {
|
||||||
btnName: '暂停',
|
type: 'pause',
|
||||||
showParam: {
|
btnName: '暂停',
|
||||||
type: '|',
|
showParam: {
|
||||||
data: [
|
type: '|',
|
||||||
{
|
data: [
|
||||||
name: 'status',
|
{
|
||||||
type: 'equal',
|
name: 'status',
|
||||||
value: 2
|
type: 'equal',
|
||||||
}
|
value: 2
|
||||||
]
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
: undefined,
|
||||||
{
|
this.$auth.hasPermi(`base:core-work-order:update`)
|
||||||
type: 'nullify',
|
? {
|
||||||
btnName: '作废',
|
type: 'nullify',
|
||||||
showParam: {
|
btnName: '作废',
|
||||||
type: '|',
|
showParam: {
|
||||||
data: [
|
type: '|',
|
||||||
{
|
data: [
|
||||||
name: 'status',
|
{
|
||||||
type: 'equal',
|
name: 'status',
|
||||||
value: 1
|
type: 'equal',
|
||||||
}
|
value: 1
|
||||||
]
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
: undefined,
|
||||||
{
|
this.$auth.hasPermi(`base:core-work-order:update`)
|
||||||
type: 'finish',
|
? {
|
||||||
btnName: '完成',
|
type: 'finish',
|
||||||
showParam: {
|
btnName: '完成',
|
||||||
type: '|',
|
showParam: {
|
||||||
data: [
|
type: '|',
|
||||||
{
|
data: [
|
||||||
name: 'status',
|
{
|
||||||
type: 'equal',
|
name: 'status',
|
||||||
value: 2
|
type: 'equal',
|
||||||
},
|
value: 2
|
||||||
{
|
},
|
||||||
name: 'status',
|
{
|
||||||
type: 'equal',
|
name: 'status',
|
||||||
value: 3
|
type: 'equal',
|
||||||
}
|
value: 3
|
||||||
]
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
: undefined,
|
||||||
{
|
this.$auth.hasPermi(`base:core-work-order:update`)
|
||||||
type: 'stop',
|
? {
|
||||||
btnName: '终止',
|
type: 'stop',
|
||||||
showParam: {
|
btnName: '终止',
|
||||||
type: '|',
|
showParam: {
|
||||||
data: [
|
type: '|',
|
||||||
{
|
data: [
|
||||||
name: 'status',
|
{
|
||||||
type: 'equal',
|
name: 'status',
|
||||||
value: 2
|
type: 'equal',
|
||||||
},
|
value: 2
|
||||||
{
|
},
|
||||||
name: 'status',
|
{
|
||||||
type: 'equal',
|
name: 'status',
|
||||||
value: 3
|
type: 'equal',
|
||||||
}
|
value: 3
|
||||||
]
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
: undefined,
|
||||||
this.$auth.hasPermi(`base:core-work-order:detail`)
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:core-work-order:query',
|
||||||
|
'base:order:query'
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'detail',
|
type: 'detail',
|
||||||
btnName: '查看详情',
|
btnName: '查看详情',
|
||||||
|
|||||||
@@ -163,7 +163,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-worker:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-worker:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:core-worker:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -52,8 +52,7 @@ const tableProps = [
|
|||||||
{
|
{
|
||||||
prop: 'createTime',
|
prop: 'createTime',
|
||||||
label: '添加时间',
|
label: '添加时间',
|
||||||
filter: parseTime,
|
filter: parseTime
|
||||||
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'code',
|
prop: 'code',
|
||||||
@@ -116,7 +115,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-workshop-section:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-workshop-section:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:core-workshop-section:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -1,19 +1,24 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-drawer :visible.sync="drawer" :append-to-body="true" size="80%" >
|
<el-drawer
|
||||||
<small-title slot="title" :no-padding="true">
|
:visible.sync="drawer"
|
||||||
<!-- <template v-for="demo in demoList"> -->
|
:append-to-body="true"
|
||||||
<!-- <el-button :key="demo.name" :type="demo.name === curDemo ? 'primary' : ' '" @click="curDemo = demo.name"> -->
|
size="80%">
|
||||||
<!-- {{ $t('module.packingManage.printModelDesign') }} -->
|
<small-title
|
||||||
模板设计
|
slot="title"
|
||||||
<!-- </el-button> -->
|
:no-padding="true">
|
||||||
<!-- </template> -->
|
<!-- <template v-for="demo in demoList"> -->
|
||||||
</small-title>
|
<!-- <el-button :key="demo.name" :type="demo.name === curDemo ? 'primary' : ' '" @click="curDemo = demo.name"> -->
|
||||||
<el-card>
|
<!-- {{ $t('module.packingManage.printModelDesign') }} -->
|
||||||
<el-row style="margin-bottom: 10px">
|
模板设计
|
||||||
<el-col :span="4">
|
<!-- </el-button> -->
|
||||||
<!-- 模板选择 -->
|
<!-- </template> -->
|
||||||
|
</small-title>
|
||||||
|
<el-card>
|
||||||
|
<el-row style="margin-bottom: 10px">
|
||||||
|
<!-- <el-col :span="4"> -->
|
||||||
|
<!-- 模板选择 -->
|
||||||
|
|
||||||
<!-- <el-select
|
<!-- <el-select
|
||||||
v-model="mode"
|
v-model="mode"
|
||||||
filterable
|
filterable
|
||||||
:default-value="0"
|
:default-value="0"
|
||||||
@@ -25,393 +30,469 @@
|
|||||||
{{ opt.name }}
|
{{ opt.name }}
|
||||||
</el-option>
|
</el-option>
|
||||||
</el-select> -->
|
</el-select> -->
|
||||||
</el-col>
|
<!-- </el-col> -->
|
||||||
<el-col :span="20">
|
<el-col :span="24">
|
||||||
<!-- 纸张设置 -->
|
<!-- 纸张设置 -->
|
||||||
<el-button-group style="margin:0 10px">
|
<el-button-group style="margin: 0 10px">
|
||||||
<el-button v-for="(value,type) in paperTypes" :key="type" :type="curPaperType === type ? 'primary' : ' '"
|
<el-button
|
||||||
@click="setPaper(type,value)">
|
v-for="(value, type) in paperTypes"
|
||||||
{{ type }}
|
:key="type"
|
||||||
</el-button>
|
:type="curPaperType === type ? 'primary' : ' '"
|
||||||
</el-button-group>
|
@click="setPaper(type, value)">
|
||||||
<el-input-number style="margin:0 10px" :value="scaleValue " :precision="2" :step="0.1" :min="scaleMin"
|
{{ type }}
|
||||||
:max="scaleMax" @change="changeScale" />
|
</el-button>
|
||||||
<el-popover v-model="paperPopVisible" placement="bottom" width="300" title="设置纸张宽高(mm)">
|
</el-button-group>
|
||||||
<div style="display: flex;align-items: center;justify-content: space-between;margin-bottom: 10px">
|
<el-input-number
|
||||||
<el-input v-model="paperWidth" type="number" style=" width: 100px; text-align: center" place="宽(mm)" />~
|
style="margin: 0 10px; width: 140px"
|
||||||
<el-input v-model="paperHeight" type="number" style=" width: 100px; text-align: center" place="高(mm)" />
|
:value="scaleValue"
|
||||||
</div>
|
:precision="2"
|
||||||
<div>
|
:step="0.1"
|
||||||
<el-button type="primary" style="width: 100%" size="mini" @click="otherPaper">确定</el-button>
|
:min="scaleMin"
|
||||||
</div>
|
:max="scaleMax"
|
||||||
<el-button slot="reference" type="primary" style="margin:0 10px">自定义宽高</el-button>
|
@change="changeScale" />
|
||||||
</el-popover>
|
<el-popover
|
||||||
|
v-model="paperPopVisible"
|
||||||
|
placement="bottom"
|
||||||
|
width="300"
|
||||||
|
title="设置纸张宽高(mm)">
|
||||||
|
<div
|
||||||
|
style="
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
">
|
||||||
|
<el-input
|
||||||
|
v-model="paperWidth"
|
||||||
|
type="number"
|
||||||
|
style="width: 100px; text-align: center"
|
||||||
|
place="宽(mm)" />
|
||||||
|
~
|
||||||
|
<el-input
|
||||||
|
v-model="paperHeight"
|
||||||
|
type="number"
|
||||||
|
style="width: 100px; text-align: center"
|
||||||
|
place="高(mm)" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
style="width: 100%"
|
||||||
|
size="mini"
|
||||||
|
@click="otherPaper">
|
||||||
|
确定
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
<el-button
|
||||||
|
slot="reference"
|
||||||
|
type="primary"
|
||||||
|
style="margin: 0 10px">
|
||||||
|
自定义宽高
|
||||||
|
</el-button>
|
||||||
|
</el-popover>
|
||||||
|
|
||||||
<!-- <a-button-group>-->
|
<!-- <a-button-group>-->
|
||||||
<!-- <template v-for="(value,type) in paperTypes">-->
|
<!-- <template v-for="(value,type) in paperTypes">-->
|
||||||
<!-- <a-button :type="curPaperType === type ? 'primary' : 'info'" @click="setPaper(type,value)" :key="type">-->
|
<!-- <a-button :type="curPaperType === type ? 'primary' : 'info'" @click="setPaper(type,value)" :key="type">-->
|
||||||
<!-- {{ type }}-->
|
<!-- {{ type }}-->
|
||||||
<!-- </a-button>-->
|
<!-- </a-button>-->
|
||||||
<!-- </template>-->
|
<!-- </template>-->
|
||||||
<!-- <a-popover v-model="paperPopVisible" title="设置纸张宽高(mm)" trigger="click">-->
|
<!-- <a-popover v-model="paperPopVisible" title="设置纸张宽高(mm)" trigger="click">-->
|
||||||
<!-- <div slot="content">-->
|
<!-- <div slot="content">-->
|
||||||
<!-- <a-input-group compact style="margin: 10px 10px">-->
|
<!-- <a-input-group compact style="margin: 10px 10px">-->
|
||||||
<!-- <a-input type="number" v-model="paperWidth" style=" width: 100px; text-align: center"-->
|
<!-- <a-input type="number" v-model="paperWidth" style=" width: 100px; text-align: center"-->
|
||||||
<!-- placeholder="宽(mm)"/>-->
|
<!-- placeholder="宽(mm)"/>-->
|
||||||
<!-- <a-input style=" width: 30px; border-left: 0; pointer-events: none; backgroundColor: #fff"-->
|
<!-- <a-input style=" width: 30px; border-left: 0; pointer-events: none; backgroundColor: #fff"-->
|
||||||
<!-- placeholder="~" disabled-->
|
<!-- placeholder="~" disabled-->
|
||||||
<!-- />-->
|
<!-- />-->
|
||||||
<!-- <a-input type="number" v-model="paperHeight" style="width: 100px; text-align: center; border-left: 0"-->
|
<!-- <a-input type="number" v-model="paperHeight" style="width: 100px; text-align: center; border-left: 0"-->
|
||||||
<!-- placeholder="高(mm)"/>-->
|
<!-- placeholder="高(mm)"/>-->
|
||||||
<!-- </a-input-group>-->
|
<!-- </a-input-group>-->
|
||||||
<!-- <a-button type="primary" style="width: 100%" @click="otherPaper">确定</a-button>-->
|
<!-- <a-button type="primary" style="width: 100%" @click="otherPaper">确定</a-button>-->
|
||||||
<!-- </div>-->
|
<!-- </div>-->
|
||||||
<!-- <a-button :type="'other'==curPaperType?'primary':''">自定义纸张</a-button>-->
|
<!-- <a-button :type="'other'==curPaperType?'primary':''">自定义纸张</a-button>-->
|
||||||
<!-- </a-popover>-->
|
<!-- </a-popover>-->
|
||||||
<!-- </a-button-group>-->
|
<!-- </a-button-group>-->
|
||||||
|
|
||||||
<!-- 预览/打印 -->
|
<!-- 预览/打印 -->
|
||||||
<el-button-group>
|
<el-button-group>
|
||||||
<el-button type="primary" icon="redo" @click="rotatePaper()">旋转</el-button>
|
<el-button
|
||||||
<el-button type="primary" icon="el-icon-view" @click="preView">
|
type="primary"
|
||||||
预览
|
icon="redo"
|
||||||
</el-button>
|
@click="rotatePaper()">
|
||||||
<!-- <el-button type="primary" icon="el-icon-printer" @click="print">
|
旋转
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
icon="el-icon-view"
|
||||||
|
@click="preView">
|
||||||
|
预览
|
||||||
|
</el-button>
|
||||||
|
<!-- <el-button type="primary" icon="el-icon-printer" @click="print">
|
||||||
直接打印
|
直接打印
|
||||||
</el-button> -->
|
</el-button> -->
|
||||||
<el-button type="primary" icon="el-icon-s-management" @click="save">
|
<el-button
|
||||||
保存
|
type="primary"
|
||||||
</el-button>
|
icon="el-icon-s-management"
|
||||||
<el-button type="danger" icon="el-icon-delete" @click="clearPaper">
|
@click="save">
|
||||||
清空
|
保存
|
||||||
</el-button>
|
</el-button>
|
||||||
</el-button-group>
|
<el-button
|
||||||
<!-- 保存/清空 -->
|
type="danger"
|
||||||
|
icon="el-icon-delete"
|
||||||
</el-col>
|
@click="clearPaper">
|
||||||
</el-row>
|
清空
|
||||||
<el-row :gutter="24">
|
</el-button>
|
||||||
<el-col :span="4">
|
</el-button-group>
|
||||||
<el-card style="height: 100vh">
|
<!-- 保存/清空 -->
|
||||||
<el-row>
|
</el-col>
|
||||||
<el-col :span="24" class="rect-printElement-types hiprintEpContainer" />
|
</el-row>
|
||||||
</el-row>
|
<el-row :gutter="24">
|
||||||
</el-card>
|
<el-col :span="4">
|
||||||
</el-col>
|
<el-card style="height: 100vh">
|
||||||
<el-col :span="16">
|
<el-row>
|
||||||
<el-card class="card-design">
|
<el-col
|
||||||
<div id="hiprint-printTemplate" class="hiprint-printTemplate" />
|
:span="24"
|
||||||
</el-card>
|
class="rect-printElement-types hiprintEpContainer" />
|
||||||
</el-col>
|
</el-row>
|
||||||
<el-col :span="4" class="params_setting_container">
|
</el-card>
|
||||||
<el-card>
|
</el-col>
|
||||||
<el-row class="hinnn-layout-sider">
|
<el-col :span="16">
|
||||||
<div id="PrintElementOptionSetting" />
|
<el-card class="card-design">
|
||||||
</el-row>
|
<div
|
||||||
</el-card>
|
id="hiprint-printTemplate"
|
||||||
</el-col>
|
class="hiprint-printTemplate" />
|
||||||
</el-row>
|
</el-card>
|
||||||
<!-- 预览 -->
|
</el-col>
|
||||||
<print-preview ref="preView" />
|
<el-col
|
||||||
</el-card>
|
:span="4"
|
||||||
</el-drawer>
|
class="params_setting_container">
|
||||||
|
<el-card>
|
||||||
|
<el-row class="hinnn-layout-sider">
|
||||||
|
<div id="PrintElementOptionSetting" />
|
||||||
|
</el-row>
|
||||||
|
</el-card>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<!-- 预览 -->
|
||||||
|
<print-preview ref="preView" />
|
||||||
|
</el-card>
|
||||||
|
</el-drawer>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import printPreview from './preview';
|
||||||
import printPreview from './preview'
|
import { MessageBox } from 'element-ui';
|
||||||
import { MessageBox } from 'element-ui'
|
import { hiprint } from 'vue-plugin-hiprint';
|
||||||
import { hiprint } from 'vue-plugin-hiprint'
|
import providers from './providers';
|
||||||
import providers from './providers'
|
|
||||||
// import printData from './print-data'
|
// import printData from './print-data'
|
||||||
import $ from 'jquery'
|
import $ from 'jquery';
|
||||||
import SmallTitle from './SmallTitle.vue'
|
import SmallTitle from './SmallTitle.vue';
|
||||||
let hiprintTemplate = null
|
let hiprintTemplate = null;
|
||||||
export default {
|
export default {
|
||||||
name: 'PrintCustom',
|
name: 'PrintCustom',
|
||||||
components: { printPreview, SmallTitle },
|
components: { printPreview, SmallTitle },
|
||||||
// props: {
|
// props: {
|
||||||
// modelData: {
|
// modelData: {
|
||||||
// type: String,
|
// type: String,
|
||||||
// default: ''
|
// default: ''
|
||||||
// }
|
// }
|
||||||
// },
|
// },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
// paperPopVisible: false,
|
// paperPopVisible: false,
|
||||||
// 模板选择
|
// 模板选择
|
||||||
mode: 0,
|
mode: 0,
|
||||||
template: null,
|
template: null,
|
||||||
modeList: [],
|
modeList: [],
|
||||||
// 当前纸张
|
// 当前纸张
|
||||||
curPaper: {
|
curPaper: {
|
||||||
// type: 'other',
|
// type: 'other',
|
||||||
// width: 220,
|
// width: 220,
|
||||||
// height: 80
|
// height: 80
|
||||||
},
|
},
|
||||||
printData:{},
|
printData: {},
|
||||||
drawer: false,
|
drawer: false,
|
||||||
// 纸张类型
|
// 纸张类型
|
||||||
paperTypes: {
|
paperTypes: {
|
||||||
'A3': {
|
A3: {
|
||||||
width: 420,
|
width: 420,
|
||||||
height: 296.6
|
height: 296.6,
|
||||||
},
|
},
|
||||||
'A4': {
|
A4: {
|
||||||
width: 210,
|
width: 210,
|
||||||
height: 297
|
height: 297,
|
||||||
},
|
},
|
||||||
'A5': {
|
A5: {
|
||||||
width: 210,
|
width: 210,
|
||||||
height: 147.6
|
height: 147.6,
|
||||||
},
|
},
|
||||||
'B3': {
|
A6: {
|
||||||
width: 500,
|
width: 95,
|
||||||
height: 352.6
|
height: 125,
|
||||||
},
|
},
|
||||||
'B4': {
|
B3: {
|
||||||
width: 250,
|
width: 500,
|
||||||
height: 352.6
|
height: 352.6,
|
||||||
},
|
},
|
||||||
'B5': {
|
B4: {
|
||||||
width: 250,
|
width: 250,
|
||||||
height: 175.6
|
height: 352.6,
|
||||||
}
|
},
|
||||||
},
|
B5: {
|
||||||
scaleValue: 1,
|
width: 250,
|
||||||
scaleMax: 5,
|
height: 175.6,
|
||||||
scaleMin: 0.5,
|
},
|
||||||
// 自定义纸张
|
},
|
||||||
paperPopVisible: false,
|
scaleValue: 1,
|
||||||
paperWidth: '210',
|
scaleMax: 5,
|
||||||
paperHeight: '297'
|
scaleMin: 0.5,
|
||||||
}
|
// 自定义纸张
|
||||||
},
|
paperPopVisible: false,
|
||||||
computed: {
|
paperWidth: '210',
|
||||||
curPaperType() {
|
paperHeight: '297',
|
||||||
let type = 'other'
|
};
|
||||||
const types = this.paperTypes
|
},
|
||||||
for (const key in types) {
|
computed: {
|
||||||
const item = types[key]
|
curPaperType() {
|
||||||
const { width, height } = this.curPaper
|
let type = 'other';
|
||||||
if (item.width === width && item.height === height) {
|
const types = this.paperTypes;
|
||||||
type = key
|
for (const key in types) {
|
||||||
}
|
const item = types[key];
|
||||||
}
|
const { width, height } = this.curPaper;
|
||||||
return type
|
if (item.width === width && item.height === height) {
|
||||||
}
|
type = key;
|
||||||
},
|
}
|
||||||
created() {
|
}
|
||||||
// $('.hiprintEpContainer').empty()
|
return type;
|
||||||
},
|
},
|
||||||
destroyed () {
|
},
|
||||||
$('.hiprintEpContainer').empty()
|
created() {
|
||||||
console.log(11111)
|
// $('.hiprintEpContainer').empty()
|
||||||
},
|
},
|
||||||
methods: {
|
destroyed() {
|
||||||
// handleClose() {
|
$('.hiprintEpContainer').empty();
|
||||||
// $('.hiprintEpContainer').empty()
|
console.log(11111);
|
||||||
// },
|
},
|
||||||
closed() {
|
methods: {
|
||||||
$('.hiprintEpContainer').empty()
|
// handleClose() {
|
||||||
$('.hiprint-printTemplate').empty()
|
// $('.hiprintEpContainer').empty()
|
||||||
},
|
// },
|
||||||
init(data) {
|
closed() {
|
||||||
this.drawer = true
|
$('.hiprintEpContainer').empty();
|
||||||
this.modelData = data
|
$('.hiprint-printTemplate').empty();
|
||||||
this.modeList = providers.map((e) => {
|
},
|
||||||
return { type: e.type, name: e.name, value: e.value }
|
init(data) {
|
||||||
})
|
this.drawer = true;
|
||||||
this.changeMode()
|
this.modelData = data;
|
||||||
},
|
this.modeList = providers.map((e) => {
|
||||||
changeMode() {
|
return { type: e.type, name: e.name, value: e.value };
|
||||||
// hiprintTemplate.clear()
|
});
|
||||||
// console.log(this.modelData)
|
this.changeMode();
|
||||||
this.$nextTick(() => {
|
},
|
||||||
const { mode } = this
|
changeMode() {
|
||||||
const provider = providers[mode]
|
// hiprintTemplate.clear()
|
||||||
hiprint.init({
|
// console.log(this.modelData)
|
||||||
providers: [provider.f]
|
this.$nextTick(() => {
|
||||||
})
|
const { mode } = this;
|
||||||
|
const provider = providers[mode];
|
||||||
|
hiprint.init({
|
||||||
|
providers: [provider.f],
|
||||||
|
});
|
||||||
|
|
||||||
// $('#hiprint-printTemplate').empty()
|
// $('#hiprint-printTemplate').empty()
|
||||||
// console.log(JSON.parse(this.modelData))
|
// console.log(JSON.parse(this.modelData))
|
||||||
hiprint.setConfig()
|
hiprint.setConfig();
|
||||||
// 替换配置
|
// 替换配置
|
||||||
hiprint.setConfig({
|
hiprint.setConfig({
|
||||||
movingDistance: 2.5,
|
movingDistance: 2.5,
|
||||||
text: {
|
text: {
|
||||||
supportOptions: [
|
supportOptions: [
|
||||||
{
|
{
|
||||||
name: 'styler',
|
name: 'styler',
|
||||||
hidden: true
|
hidden: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'formatter',
|
name: 'formatter',
|
||||||
hidden: true
|
hidden: true,
|
||||||
}
|
},
|
||||||
]
|
],
|
||||||
}
|
},
|
||||||
})
|
});
|
||||||
|
|
||||||
// console.log(this.modelData)
|
// console.log(this.modelData)
|
||||||
// console.log($('#hiprint-printTemplate').empty())
|
// console.log($('#hiprint-printTemplate').empty())
|
||||||
// if () {
|
// if () {
|
||||||
// console.log(this.modelData);
|
// console.log(this.modelData);
|
||||||
// $('.hiprintEpContainer').empty()
|
// $('.hiprintEpContainer').empty()
|
||||||
// hiprint.PrintElementTypeManager.build('.hiprintEpContainer', provider.value)
|
// hiprint.PrintElementTypeManager.build('.hiprintEpContainer', provider.value)
|
||||||
// $('.hiprint-printTemplate').empty()
|
// $('.hiprint-printTemplate').empty()
|
||||||
// hiprintTemplate = new hiprint.PrintTemplate({
|
// hiprintTemplate = new hiprint.PrintTemplate({
|
||||||
// template: JSON.parse(this.modelData),
|
// template: JSON.parse(this.modelData),
|
||||||
// settingContainer: '#PrintElementOptionSetting',
|
// settingContainer: '#PrintElementOptionSetting',
|
||||||
// paginationContainer: '.hiprint-printPagination'
|
// paginationContainer: '.hiprint-printPagination'
|
||||||
// })
|
// })
|
||||||
// } else {
|
// } else {
|
||||||
$('.hiprintEpContainer').empty()
|
$('.hiprintEpContainer').empty();
|
||||||
console.log(this.modelData || {});
|
console.log(this.modelData || {});
|
||||||
hiprint.PrintElementTypeManager.build('.hiprintEpContainer', provider.value)
|
hiprint.PrintElementTypeManager.build(
|
||||||
$('.hiprint-printTemplate').empty()
|
'.hiprintEpContainer',
|
||||||
// const templates = this.$ls.get('KEY_TEMPLATES', {})
|
provider.value
|
||||||
const template = provider.value
|
);
|
||||||
// console.log(template)
|
$('.hiprint-printTemplate').empty();
|
||||||
if (this.modelData) {
|
// const templates = this.$ls.get('KEY_TEMPLATES', {})
|
||||||
hiprintTemplate = new hiprint.PrintTemplate({
|
const template = provider.value;
|
||||||
template: JSON.parse(this.modelData),
|
// console.log(template)
|
||||||
settingContainer: '#PrintElementOptionSetting',
|
if (this.modelData) {
|
||||||
paginationContainer: '.hiprint-printPagination'
|
hiprintTemplate = new hiprint.PrintTemplate({
|
||||||
})
|
template: JSON.parse(this.modelData),
|
||||||
} else {
|
settingContainer: '#PrintElementOptionSetting',
|
||||||
hiprintTemplate = new hiprint.PrintTemplate({
|
paginationContainer: '.hiprint-printPagination',
|
||||||
template:{},
|
});
|
||||||
settingContainer: '#PrintElementOptionSetting',
|
} else {
|
||||||
paginationContainer: '.hiprint-printPagination'
|
hiprintTemplate = new hiprint.PrintTemplate({
|
||||||
})
|
template: {},
|
||||||
}
|
settingContainer: '#PrintElementOptionSetting',
|
||||||
// }
|
paginationContainer: '.hiprint-printPagination',
|
||||||
hiprintTemplate.design('#hiprint-printTemplate')
|
});
|
||||||
// console.log(hiprintTemplate)
|
}
|
||||||
console.log(hiprintTemplate);
|
// }
|
||||||
// hiprintTemplate.design('#hiprint-printTemplate', { grid: true })
|
hiprintTemplate.design('#hiprint-printTemplate');
|
||||||
// 获取当前放大比例, 当zoom时传true 才会有
|
// console.log(hiprintTemplate)
|
||||||
this.scaleValue = hiprintTemplate.editingPanel.scale || 1
|
console.log(hiprintTemplate);
|
||||||
// this.scaleValue = hiprintTemplate.editingPanel.scale || 1
|
// hiprintTemplate.design('#hiprint-printTemplate', { grid: true })
|
||||||
})
|
// 获取当前放大比例, 当zoom时传true 才会有
|
||||||
},
|
this.scaleValue = hiprintTemplate.editingPanel.scale || 1;
|
||||||
/**
|
// this.scaleValue = hiprintTemplate.editingPanel.scale || 1
|
||||||
* 设置纸张大小
|
});
|
||||||
* @param type [A3, A4, A5, B3, B4, B5, other]
|
},
|
||||||
* @param value {width,height} mm
|
/**
|
||||||
*/
|
* 设置纸张大小
|
||||||
setPaper(type, value) {
|
* @param type [A3, A4, A5, B3, B4, B5, other]
|
||||||
try {
|
* @param value {width,height} mm
|
||||||
if (Object.keys(this.paperTypes).includes(type)) {
|
*/
|
||||||
this.curPaper = { type: type, width: value.width, height: value.height }
|
setPaper(type, value) {
|
||||||
hiprintTemplate.setPaper(value.width, value.height)
|
try {
|
||||||
} else {
|
if (Object.keys(this.paperTypes).includes(type)) {
|
||||||
this.curPaper = { type: 'other', width: value.width, height: value.height }
|
this.curPaper = {
|
||||||
hiprintTemplate.setPaper(value.width, value.height)
|
type: type,
|
||||||
}
|
width: value.width,
|
||||||
} catch (error) {
|
height: value.height,
|
||||||
this.$message.error(`操作失败: ${error}`)
|
};
|
||||||
}
|
hiprintTemplate.setPaper(value.width, value.height);
|
||||||
},
|
} else {
|
||||||
changeScale(currentValue, oldValue) {
|
this.curPaper = {
|
||||||
let big = false
|
type: 'other',
|
||||||
currentValue <= oldValue ? big = false : big = true
|
width: value.width,
|
||||||
let scaleValue = this.scaleValue
|
height: value.height,
|
||||||
if (big) {
|
};
|
||||||
scaleValue += 0.1
|
hiprintTemplate.setPaper(value.width, value.height);
|
||||||
if (scaleValue > this.scaleMax) scaleValue = 5
|
}
|
||||||
} else {
|
} catch (error) {
|
||||||
scaleValue -= 0.1
|
this.$message.error(`操作失败: ${error}`);
|
||||||
if (scaleValue < this.scaleMin) scaleValue = 0.5
|
}
|
||||||
}
|
},
|
||||||
if (hiprintTemplate) {
|
changeScale(currentValue, oldValue) {
|
||||||
// scaleValue: 放大缩小值, false: 不保存(不传也一样), 如果传 true, 打印时也会放大
|
let big = false;
|
||||||
hiprintTemplate.zoom(scaleValue)
|
currentValue <= oldValue ? (big = false) : (big = true);
|
||||||
this.scaleValue = scaleValue
|
let scaleValue = this.scaleValue;
|
||||||
}
|
if (big) {
|
||||||
},
|
scaleValue += 0.1;
|
||||||
clearPaper() {
|
if (scaleValue > this.scaleMax) scaleValue = 5;
|
||||||
MessageBox.confirm('是否确认清空模板信息?', '警告', {
|
} else {
|
||||||
confirmButtonText: '确定',
|
scaleValue -= 0.1;
|
||||||
cancelButtonText: '取消',
|
if (scaleValue < this.scaleMin) scaleValue = 0.5;
|
||||||
type: 'warning'
|
}
|
||||||
}).then(() => {
|
if (hiprintTemplate) {
|
||||||
try {
|
// scaleValue: 放大缩小值, false: 不保存(不传也一样), 如果传 true, 打印时也会放大
|
||||||
hiprintTemplate.clear()
|
hiprintTemplate.zoom(scaleValue);
|
||||||
} catch (error) {
|
this.scaleValue = scaleValue;
|
||||||
this.$message.error(`操作失败: ${error}`)
|
}
|
||||||
}
|
},
|
||||||
}).catch((err) => {
|
clearPaper() {
|
||||||
console.log(err)
|
MessageBox.confirm('是否确认清空模板信息?', '警告', {
|
||||||
})
|
confirmButtonText: '确定',
|
||||||
},
|
cancelButtonText: '取消',
|
||||||
otherPaper() {
|
type: 'warning',
|
||||||
const value = {}
|
})
|
||||||
value.width = this.paperWidth
|
.then(() => {
|
||||||
value.height = this.paperHeight
|
try {
|
||||||
this.paperPopVisible = false
|
hiprintTemplate.clear();
|
||||||
this.setPaper('other', value)
|
} catch (error) {
|
||||||
},
|
this.$message.error(`操作失败: ${error}`);
|
||||||
rotatePaper() {
|
}
|
||||||
if (hiprintTemplate) {
|
})
|
||||||
hiprintTemplate.rotatePaper()
|
.catch((err) => {
|
||||||
}
|
console.log(err);
|
||||||
},
|
});
|
||||||
preView() {
|
},
|
||||||
const { width } = this.curPaper
|
otherPaper() {
|
||||||
this.$refs.preView.show(hiprintTemplate, this.printData, width)
|
const value = {};
|
||||||
},
|
value.width = this.paperWidth;
|
||||||
print() {
|
value.height = this.paperHeight;
|
||||||
// if (window.hiwebSocket.opened) {
|
this.paperPopVisible = false;
|
||||||
const printerList = hiprintTemplate.getPrinterList()
|
this.setPaper('other', value);
|
||||||
console.log(printerList)
|
},
|
||||||
hiprintTemplate.print2(this.printData, { printer: '', title: '预览打印' })
|
rotatePaper() {
|
||||||
// return
|
if (hiprintTemplate) {
|
||||||
// }
|
hiprintTemplate.rotatePaper();
|
||||||
// this.$message.error('客户端未连接,无法直接打印')
|
}
|
||||||
},
|
},
|
||||||
save() {
|
preView() {
|
||||||
// console.log(hiprintTemplate.getJson())
|
const { width } = this.curPaper;
|
||||||
const { mode } = this
|
this.$refs.preView.show(hiprintTemplate, this.printData, width);
|
||||||
const provider = providers[mode]
|
},
|
||||||
// console.log(hiprintTemplate.getJson())
|
print() {
|
||||||
this.setTemplate({
|
// if (window.hiwebSocket.opened) {
|
||||||
name: provider.value,
|
const printerList = hiprintTemplate.getPrinterList();
|
||||||
json: hiprintTemplate.getJson()
|
console.log(printerList);
|
||||||
})
|
hiprintTemplate.print2(this.printData, {
|
||||||
},
|
printer: '',
|
||||||
setTemplate(payload) {
|
title: '预览打印',
|
||||||
// const templates = this.$ls.get('KEY_TEMPLATES', {})
|
});
|
||||||
// console.log(payload.json)
|
// return
|
||||||
// templates[payload.name] = payload.json
|
// }
|
||||||
// this.$ls.set('KEY_TEMPLATES', templates)
|
// this.$message.error('客户端未连接,无法直接打印')
|
||||||
this.$message.info('保存成功')
|
},
|
||||||
// console.log(JSON.stringify(payload.json))
|
save() {
|
||||||
this.drawer = false
|
// console.log(hiprintTemplate.getJson())
|
||||||
this.$emit('saveData', payload.json)
|
const { mode } = this;
|
||||||
$('.hiprintEpContainer').empty()
|
const provider = providers[mode];
|
||||||
// this.$parent.$parent.getModelData(payload.json)
|
// console.log(hiprintTemplate.getJson())
|
||||||
}
|
this.setTemplate({
|
||||||
}
|
name: provider.value,
|
||||||
}
|
json: hiprintTemplate.getJson(),
|
||||||
|
});
|
||||||
|
},
|
||||||
|
setTemplate(payload) {
|
||||||
|
// const templates = this.$ls.get('KEY_TEMPLATES', {})
|
||||||
|
// console.log(payload.json)
|
||||||
|
// templates[payload.name] = payload.json
|
||||||
|
// this.$ls.set('KEY_TEMPLATES', templates)
|
||||||
|
this.$message.info('保存成功');
|
||||||
|
// console.log(JSON.stringify(payload.json))
|
||||||
|
this.drawer = false;
|
||||||
|
this.$emit('saveData', payload.json);
|
||||||
|
$('.hiprintEpContainer').empty();
|
||||||
|
// this.$parent.$parent.getModelData(payload.json)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
// build 拖拽
|
// build 拖拽
|
||||||
::v-deep .hiprint-printElement-type >li>ul>li>a {
|
::v-deep .hiprint-printElement-type > li > ul > li > a {
|
||||||
padding: 4px 4px;
|
padding: 4px 4px;
|
||||||
color: #1296db;
|
color: #1296db;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
height: auto;
|
height: auto;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
// 设计容器
|
// 设计容器
|
||||||
.card-design {
|
.card-design {
|
||||||
// overflow: hidden;
|
// overflow: hidden;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-11-18 14:16:25
|
* @Date: 2021-11-18 14:16:25
|
||||||
* @LastEditors: DY
|
* @LastEditors: DY
|
||||||
* @LastEditTime: 2024-03-21 15:21:32
|
* @LastEditTime: 2024-04-11 16:22:19
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@@ -121,15 +121,15 @@
|
|||||||
</el-row>
|
</el-row>
|
||||||
</el-form>
|
</el-form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="attr-list" v-if="idAttrShow">
|
<div class="attr-list" v-if="idAttrShow && this.$auth.hasPermi('base:material-attr:query')">
|
||||||
<small-title
|
<small-title
|
||||||
style="margin: 16px 0; padding-left: 8px"
|
style="margin: 16px 0; padding-left: 8px"
|
||||||
:no-padding="true">
|
:no-padding="true">
|
||||||
物料属性
|
物料属性
|
||||||
</small-title>
|
</small-title>
|
||||||
|
|
||||||
<div v-if="!isdetail" class="action_btn">
|
<div v-if="!isdetail && this.$auth.hasPermi('base:material-attr:create')" class="action_btn">
|
||||||
<template>
|
<template>
|
||||||
<span style="display: inline-block;">
|
<span style="display: inline-block;">
|
||||||
<el-button type="text" @click="addNew()" icon="el-icon-plus">新增</el-button>
|
<el-button type="text" @click="addNew()" icon="el-icon-plus">新增</el-button>
|
||||||
@@ -182,16 +182,23 @@ import { parseTime } from '../../core/mixins/code-filter';
|
|||||||
import attrAdd from './attr-add';
|
import attrAdd from './attr-add';
|
||||||
import { getDictDatas } from "@/utils/dict";
|
import { getDictDatas } from "@/utils/dict";
|
||||||
|
|
||||||
const tableBtn = [
|
// const tableBtn = [
|
||||||
{
|
// this.$auth.hasPermiAnd([
|
||||||
type: 'edit',
|
// 'base:material-attr:create',
|
||||||
btnName: '编辑',
|
// 'base:material-attr:update'
|
||||||
},
|
// ]) ?
|
||||||
{
|
// {
|
||||||
type: 'delete',
|
// type: 'edit',
|
||||||
btnName: '删除',
|
// btnName: '编辑',
|
||||||
},
|
// }
|
||||||
];
|
// : undefined,
|
||||||
|
// this.$auth.hasPermi('base:material-attr:delete') ?
|
||||||
|
// {
|
||||||
|
// type: 'delete',
|
||||||
|
// btnName: '删除',
|
||||||
|
// }
|
||||||
|
// : undefined,
|
||||||
|
// ];
|
||||||
const tableProps = [
|
const tableProps = [
|
||||||
{
|
{
|
||||||
prop: 'createTime',
|
prop: 'createTime',
|
||||||
@@ -213,7 +220,23 @@ export default {
|
|||||||
components: { SmallTitle, attrAdd },
|
components: { SmallTitle, attrAdd },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
tableBtn,
|
tableBtn: [
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:material-attr:create',
|
||||||
|
'base:material-attr:update'
|
||||||
|
]) ?
|
||||||
|
{
|
||||||
|
type: 'edit',
|
||||||
|
btnName: '编辑',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermi('base:material-attr:delete') ?
|
||||||
|
{
|
||||||
|
type: 'delete',
|
||||||
|
btnName: '删除',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
],
|
||||||
tableProps,
|
tableProps,
|
||||||
addOrUpdateVisible: false,
|
addOrUpdateVisible: false,
|
||||||
urlOptions: {
|
urlOptions: {
|
||||||
|
|||||||
@@ -134,7 +134,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:material:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:material:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:material:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-11-18 14:16:25
|
* @Date: 2021-11-18 14:16:25
|
||||||
* @LastEditors: DY
|
* @LastEditors: DY
|
||||||
* @LastEditTime: 2024-03-21 14:39:52
|
* @LastEditTime: 2024-04-11 16:44:41
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@@ -56,14 +56,14 @@
|
|||||||
</el-row>
|
</el-row>
|
||||||
</el-form>
|
</el-form>
|
||||||
</div>
|
</div>
|
||||||
<div class="attr-list" v-if="idAttrShow">
|
<div class="attr-list" v-if="idAttrShow && $auth.hasPermiAnd(['base:material-product-bom:query', 'base:material-product-bom-det:query'])">
|
||||||
<small-title
|
<small-title
|
||||||
style="margin: 16px 0; padding-left: 8px"
|
style="margin: 16px 0; padding-left: 8px"
|
||||||
:no-padding="true">
|
:no-padding="true">
|
||||||
BOM明细
|
BOM明细
|
||||||
</small-title>
|
</small-title>
|
||||||
|
|
||||||
<div v-if="!isdetail" class="action_btn">
|
<div v-if="!isdetail && $auth.hasPermi('base:material-product-bom:create')" class="action_btn">
|
||||||
<template>
|
<template>
|
||||||
<span style="display: inline-block;">
|
<span style="display: inline-block;">
|
||||||
<el-button type="text" @click="addNew()" icon="el-icon-plus">添加</el-button>
|
<el-button type="text" @click="addNew()" icon="el-icon-plus">添加</el-button>
|
||||||
@@ -116,16 +116,16 @@ import { parseTime } from '../../core/mixins/code-filter';
|
|||||||
import attrAdd from './attr-add';
|
import attrAdd from './attr-add';
|
||||||
import { publicFormatter } from '@/utils/dict';
|
import { publicFormatter } from '@/utils/dict';
|
||||||
|
|
||||||
const tableBtn = [
|
// const tableBtn = [
|
||||||
{
|
// {
|
||||||
type: 'edit',
|
// type: 'edit',
|
||||||
btnName: '编辑',
|
// btnName: '编辑',
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
type: 'delete',
|
// type: 'delete',
|
||||||
btnName: '删除',
|
// btnName: '删除',
|
||||||
},
|
// },
|
||||||
];
|
// ];
|
||||||
const tableProps = [
|
const tableProps = [
|
||||||
{
|
{
|
||||||
prop: 'createTime',
|
prop: 'createTime',
|
||||||
@@ -160,7 +160,24 @@ export default {
|
|||||||
components: { SmallTitle, attrAdd },
|
components: { SmallTitle, attrAdd },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
tableBtn,
|
tableBtn: [
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:material-product-bom:update',
|
||||||
|
'base:material-product-bom-det:create',
|
||||||
|
'base:material-product-bom-det:update'
|
||||||
|
]) ?
|
||||||
|
{
|
||||||
|
type: 'edit',
|
||||||
|
btnName: '编辑',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermi('base:material-product-bom:delete') ?
|
||||||
|
{
|
||||||
|
type: 'delete',
|
||||||
|
btnName: '删除',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
],
|
||||||
tableProps,
|
tableProps,
|
||||||
addOrUpdateVisible: false,
|
addOrUpdateVisible: false,
|
||||||
urlOptions: {
|
urlOptions: {
|
||||||
|
|||||||
@@ -110,7 +110,7 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:material:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:material:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:material:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2023-08-01 14:55:51
|
* @Date: 2023-08-01 14:55:51
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @LastEditTime: 2024-04-08 11:49:33
|
* @LastEditTime: 2024-04-10 16:34:40
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@@ -141,8 +141,8 @@ export default {
|
|||||||
// btnName: '重置',
|
// btnName: '重置',
|
||||||
// name: 'reset',
|
// name: 'reset',
|
||||||
// },
|
// },
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:packaging-print-log:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:packaging-print-log:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:packaging-print-log:create') ? 'button' : '',
|
||||||
|
|||||||
45
src/views/base/packagingPrintLog2/components/InputArea.vue
Normal file
45
src/views/base/packagingPrintLog2/components/InputArea.vue
Normal file
@@ -0,0 +1,45 @@
|
|||||||
|
<template>
|
||||||
|
<div class="tableInner">
|
||||||
|
<el-input
|
||||||
|
v-if="list.isEdit"
|
||||||
|
type="number"
|
||||||
|
v-model="list[itemProp]"
|
||||||
|
@blur="changeInput" />
|
||||||
|
<span v-else>{{ list[itemProp] }}</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'InputArea',
|
||||||
|
props: {
|
||||||
|
injectData: {
|
||||||
|
type: Object,
|
||||||
|
default: () => ({}),
|
||||||
|
},
|
||||||
|
itemProp: {
|
||||||
|
type: String,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
list: {},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.initData();
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
injectData() {
|
||||||
|
this.initData();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
initData() {
|
||||||
|
this.list = this.injectData;
|
||||||
|
},
|
||||||
|
changeInput() {
|
||||||
|
this.$emit('emitData', this.list);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
226
src/views/base/packagingPrintLog2/components/OtherMsg.vue
Normal file
226
src/views/base/packagingPrintLog2/components/OtherMsg.vue
Normal file
@@ -0,0 +1,226 @@
|
|||||||
|
<template>
|
||||||
|
<div class="other-msg-box">
|
||||||
|
<el-radio-group
|
||||||
|
v-model="chooseMsg"
|
||||||
|
@change="changeChoose">
|
||||||
|
<el-radio :label="1">
|
||||||
|
<div style="display: inline-block">
|
||||||
|
<el-form
|
||||||
|
:inline="true"
|
||||||
|
:model="printMsg1"
|
||||||
|
class="demo-form-inline">
|
||||||
|
<el-form-item label="客户">
|
||||||
|
<el-select
|
||||||
|
size="small"
|
||||||
|
v-model="printMsg1.customerId"
|
||||||
|
filterable
|
||||||
|
placeholder="客户">
|
||||||
|
<el-option
|
||||||
|
v-for="item in customerList"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item.name"
|
||||||
|
:value="item.id"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="封箱人员工号">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg1.sealWorker"
|
||||||
|
size="small"
|
||||||
|
placeholder="封箱人员工号"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="打包人员工号">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg1.packWorker"
|
||||||
|
size="small"
|
||||||
|
placeholder="打包人员工号"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="流程卡号">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg1.processCard"
|
||||||
|
size="small"
|
||||||
|
style="width: 120px"
|
||||||
|
placeholder="流程卡号"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="托盘规格">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg1.pallet"
|
||||||
|
size="small"
|
||||||
|
style="width: 120px"
|
||||||
|
placeholder="托盘规格"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="备注">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg1.remark"
|
||||||
|
size="small"
|
||||||
|
placeholder="备注"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</el-radio>
|
||||||
|
<el-radio :label="2">
|
||||||
|
<div style="display: inline-block">
|
||||||
|
<el-form
|
||||||
|
:inline="true"
|
||||||
|
:model="printMsg2"
|
||||||
|
class="demo-form-inline">
|
||||||
|
<el-form-item label="客户">
|
||||||
|
<el-select
|
||||||
|
size="small"
|
||||||
|
v-model="printMsg2.customerId"
|
||||||
|
filterable
|
||||||
|
placeholder="客户">
|
||||||
|
<el-option
|
||||||
|
v-for="item in customerList"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item.name"
|
||||||
|
:value="item.id"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="封箱人员工号">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg2.sealWorker"
|
||||||
|
size="small"
|
||||||
|
placeholder="封箱人员工号"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="打包人员工号">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg2.packWorker"
|
||||||
|
size="small"
|
||||||
|
placeholder="打包人员工号"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="流程卡号">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg2.processCard"
|
||||||
|
size="small"
|
||||||
|
style="width: 120px"
|
||||||
|
placeholder="流程卡号"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="托盘规格">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg2.pallet"
|
||||||
|
size="small"
|
||||||
|
style="width: 120px"
|
||||||
|
placeholder="托盘规格"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="备注">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg2.remark"
|
||||||
|
size="small"
|
||||||
|
placeholder="备注"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</el-radio>
|
||||||
|
<el-radio :label="3">
|
||||||
|
<div style="display: inline-block">
|
||||||
|
<el-form
|
||||||
|
:inline="true"
|
||||||
|
:model="printMsg3"
|
||||||
|
class="demo-form-inline">
|
||||||
|
<el-form-item label="客户">
|
||||||
|
<el-select
|
||||||
|
size="small"
|
||||||
|
v-model="printMsg3.customerId"
|
||||||
|
filterable
|
||||||
|
placeholder="客户">
|
||||||
|
<el-option
|
||||||
|
v-for="item in customerList"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item.name"
|
||||||
|
:value="item.id"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="封箱人员工号">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg3.sealWorker"
|
||||||
|
size="small"
|
||||||
|
placeholder="封箱人员工号"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="打包人员工号">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg3.packWorker"
|
||||||
|
size="small"
|
||||||
|
placeholder="打包人员工号"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="流程卡号">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg3.processCard"
|
||||||
|
size="small"
|
||||||
|
style="width: 120px"
|
||||||
|
placeholder="流程卡号"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="托盘规格">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg3.pallet"
|
||||||
|
size="small"
|
||||||
|
style="width: 120px"
|
||||||
|
placeholder="托盘规格"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="备注">
|
||||||
|
<el-input
|
||||||
|
v-model="printMsg3.remark"
|
||||||
|
size="small"
|
||||||
|
placeholder="备注"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { getCustomerList } from '@/api/base/packingInfo';
|
||||||
|
export default {
|
||||||
|
name: 'OtherMsg',
|
||||||
|
props: {
|
||||||
|
printMsg1: {
|
||||||
|
type: Object,
|
||||||
|
default: () => ({}),
|
||||||
|
},
|
||||||
|
printMsg2: {
|
||||||
|
type: Object,
|
||||||
|
default: () => ({}),
|
||||||
|
},
|
||||||
|
printMsg3: {
|
||||||
|
type: Object,
|
||||||
|
default: () => ({}),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
chooseMsg: 1,
|
||||||
|
customerList: [],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getCList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getCList() {
|
||||||
|
getCustomerList().then((res) => {
|
||||||
|
console.log(res);
|
||||||
|
console.log('customer');
|
||||||
|
this.customerList = res.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
changeChoose(val) {
|
||||||
|
this.$emit('changeChoose', val);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.other-msg-box {
|
||||||
|
.el-radio {
|
||||||
|
display: block;
|
||||||
|
line-height: 36px;
|
||||||
|
.demo-form-inline {
|
||||||
|
width: 100%;
|
||||||
|
white-space: normal;
|
||||||
|
}
|
||||||
|
.el-form-item {
|
||||||
|
margin-bottom: 0px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
182
src/views/base/packagingPrintLog2/components/Printed.vue
Normal file
182
src/views/base/packagingPrintLog2/components/Printed.vue
Normal file
@@ -0,0 +1,182 @@
|
|||||||
|
<template>
|
||||||
|
<div class="show-box">
|
||||||
|
<!-- 搜索工作栏 -->
|
||||||
|
<search-bar
|
||||||
|
:formConfigs="formConfig"
|
||||||
|
ref="searchBarForm"
|
||||||
|
@headBtnClick="buttonClick2" />
|
||||||
|
<!-- 列表 -->
|
||||||
|
<base-table
|
||||||
|
:page="queryParams2.pageNo"
|
||||||
|
:limit="queryParams2.pageSize"
|
||||||
|
:table-props="tableProps"
|
||||||
|
:table-data="list2">
|
||||||
|
<method-btn
|
||||||
|
v-if="tableBtn2.length"
|
||||||
|
slot="handleBtn"
|
||||||
|
:width="240"
|
||||||
|
label="操作"
|
||||||
|
:method-list="tableBtn2"
|
||||||
|
@clickBtn="handleClick2" />
|
||||||
|
</base-table>
|
||||||
|
<pagination
|
||||||
|
:page.sync="queryParams2.pageNo"
|
||||||
|
:limit.sync="queryParams2.pageSize"
|
||||||
|
:total="total2"
|
||||||
|
@pagination="getList2" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { parseTime } from '@/utils/ruoyi';
|
||||||
|
import { getPackingPage } from '@/api/base/packingInfo';
|
||||||
|
import { getCorePLList } from '@/api/base/coreProductionLine';
|
||||||
|
const tableProps = [
|
||||||
|
{
|
||||||
|
prop: 'packagingCode',
|
||||||
|
label: '成品周转编号',
|
||||||
|
minWidth: 180,
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'lineId',
|
||||||
|
label: '产线',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'specifications',
|
||||||
|
label: '规格',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'check',
|
||||||
|
label: '判定',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'workStation',
|
||||||
|
label: '工位号',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'num',
|
||||||
|
label: '片数',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'remark',
|
||||||
|
label: '备注1',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'printStatus',
|
||||||
|
label: '打印状态',
|
||||||
|
filter: (val) => (val == 1 ? '未打印' : '已打印'),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'createTime',
|
||||||
|
label: '时间',
|
||||||
|
filter: parseTime,
|
||||||
|
minWidth: 160,
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'groupClass',
|
||||||
|
label: '班次',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
export default {
|
||||||
|
name: 'Printed',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
formConfig: [
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
label: '产线',
|
||||||
|
selectOptions: [],
|
||||||
|
param: 'lineId',
|
||||||
|
filterable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'datePicker',
|
||||||
|
label: '时间段',
|
||||||
|
dateType: 'daterange',
|
||||||
|
format: 'yyyy-MM-dd HH:mm:ss',
|
||||||
|
valueFormat: 'yyyy-MM-dd HH:mm:ss',
|
||||||
|
rangeSeparator: '-',
|
||||||
|
startPlaceholder: '开始时间',
|
||||||
|
endPlaceholder: '结束时间',
|
||||||
|
param: 'timeVal',
|
||||||
|
defaultSelect: [],
|
||||||
|
width: 350,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
btnName: '查询',
|
||||||
|
name: 'search',
|
||||||
|
color: 'primary',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
// 查询参数
|
||||||
|
queryParams2: {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 20,
|
||||||
|
printStatus: '2',
|
||||||
|
lineId: '',
|
||||||
|
createTime: [],
|
||||||
|
},
|
||||||
|
total2: 0,
|
||||||
|
tableProps,
|
||||||
|
list2: [],
|
||||||
|
tableBtn2: [
|
||||||
|
this.$auth.hasPermi('base:order-group:update')
|
||||||
|
? {
|
||||||
|
type: 'reprint',
|
||||||
|
btnName: '重打',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermi('base:order-group:query')
|
||||||
|
? {
|
||||||
|
type: 'detail',
|
||||||
|
btnName: '详情',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:order-group:update',
|
||||||
|
'base:core-product:query',
|
||||||
|
'base:core-customer:query',
|
||||||
|
])
|
||||||
|
? {
|
||||||
|
type: 'edit',
|
||||||
|
btnName: '编辑',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
].filter((v) => v),
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getLineList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getLineList() {
|
||||||
|
getCorePLList().then((res) => {
|
||||||
|
console.log(res);
|
||||||
|
this.formConfig[0].selectOptions = res.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getList2() {
|
||||||
|
getPackingPage({ ...this.queryParams2 }).then((res) => {
|
||||||
|
console.log(res);
|
||||||
|
this.list2 = res.data.records || [];
|
||||||
|
this.total2 = res.data.total;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
buttonClick2(val) {
|
||||||
|
console.log(val);
|
||||||
|
this.queryParams2.lineId = val.lineId;
|
||||||
|
this.queryParams2.createTime = val.timeVal;
|
||||||
|
this.getList2();
|
||||||
|
},
|
||||||
|
handleClick2() {},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
332
src/views/base/packagingPrintLog2/components/UnPrint.vue
Normal file
332
src/views/base/packagingPrintLog2/components/UnPrint.vue
Normal file
@@ -0,0 +1,332 @@
|
|||||||
|
<template>
|
||||||
|
<div class="show-box">
|
||||||
|
<!-- 单选 -->
|
||||||
|
<other-msg
|
||||||
|
:printMsg1="printMsg1"
|
||||||
|
:printMsg2="printMsg2"
|
||||||
|
:printMsg3="printMsg3"
|
||||||
|
@changeChoose="changeChoose" />
|
||||||
|
<!-- 搜索工作栏 -->
|
||||||
|
<search-bar
|
||||||
|
:formConfigs="formConfig"
|
||||||
|
ref="searchBarForm"
|
||||||
|
@headBtnClick="buttonClick" />
|
||||||
|
<!-- 列表 -->
|
||||||
|
<base-table
|
||||||
|
:page="queryParams.pageNo"
|
||||||
|
:limit="queryParams.pageSize"
|
||||||
|
:table-props="tableProps"
|
||||||
|
:table-data="list"
|
||||||
|
@emitFun="inputChange">
|
||||||
|
<method-btn
|
||||||
|
v-if="tableBtn.length"
|
||||||
|
slot="handleBtn"
|
||||||
|
:width="260"
|
||||||
|
label="操作"
|
||||||
|
:method-list="tableBtn"
|
||||||
|
@clickBtn="handleClick" />
|
||||||
|
</base-table>
|
||||||
|
<pagination
|
||||||
|
:page.sync="queryParams.pageNo"
|
||||||
|
:limit.sync="queryParams.pageSize"
|
||||||
|
:total="total"
|
||||||
|
@pagination="getList" />
|
||||||
|
<!-- 预览 -->
|
||||||
|
<print-preview ref="preView" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { parseTime } from '@/utils/ruoyi';
|
||||||
|
import inputArea from './InputArea.vue';
|
||||||
|
const tableProps = [
|
||||||
|
{
|
||||||
|
prop: 'packagingCode',
|
||||||
|
label: '成品周转编号',
|
||||||
|
minWidth: 160,
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'lineId',
|
||||||
|
label: '产线',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'specifications',
|
||||||
|
label: '规格',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'check',
|
||||||
|
label: '判定',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'workStation',
|
||||||
|
label: '工位号',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'num',
|
||||||
|
label: '片数',
|
||||||
|
subcomponent: inputArea,
|
||||||
|
minWidth: 120,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'remark',
|
||||||
|
label: '备注1',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'printStatus',
|
||||||
|
label: '打印状态',
|
||||||
|
filter: (val) => (val == 1 ? '未打印' : '已打印'),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'createTime',
|
||||||
|
label: '时间',
|
||||||
|
filter: parseTime,
|
||||||
|
minWidth: 160,
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'groupClass',
|
||||||
|
label: '班次',
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
import OtherMsg from './OtherMsg';
|
||||||
|
import { getPackingPage, updatePacking } from '@/api/base/packingInfo';
|
||||||
|
import { getCorePLList } from '@/api/base/coreProductionLine';
|
||||||
|
import printPreview from './preview';
|
||||||
|
import printTemplate from '../print-template';
|
||||||
|
export default {
|
||||||
|
name: 'UnPrint',
|
||||||
|
components: { OtherMsg, printPreview },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
printMsg1: {
|
||||||
|
customerId: '',
|
||||||
|
sealWorker: '',
|
||||||
|
packWorker: '',
|
||||||
|
processCard: '',
|
||||||
|
pallet: '',
|
||||||
|
remark: '',
|
||||||
|
},
|
||||||
|
printMsg2: {
|
||||||
|
customerId: '',
|
||||||
|
sealWorker: '',
|
||||||
|
packWorker: '',
|
||||||
|
processCard: '',
|
||||||
|
pallet: '',
|
||||||
|
remark: '',
|
||||||
|
},
|
||||||
|
printMsg3: {
|
||||||
|
customerId: '',
|
||||||
|
sealWorker: '',
|
||||||
|
packWorker: '',
|
||||||
|
processCard: '',
|
||||||
|
pallet: '',
|
||||||
|
remark: '',
|
||||||
|
},
|
||||||
|
chooseMsg: 1, //单选
|
||||||
|
formConfig: [
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
label: '产线',
|
||||||
|
selectOptions: [],
|
||||||
|
param: 'lineId',
|
||||||
|
filterable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'datePicker',
|
||||||
|
label: '时间段',
|
||||||
|
dateType: 'daterange',
|
||||||
|
format: 'yyyy-MM-dd HH:mm:ss',
|
||||||
|
valueFormat: 'yyyy-MM-dd HH:mm:ss',
|
||||||
|
rangeSeparator: '-',
|
||||||
|
startPlaceholder: '开始时间',
|
||||||
|
endPlaceholder: '结束时间',
|
||||||
|
param: 'timeVal',
|
||||||
|
defaultSelect: [],
|
||||||
|
width: 350,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
btnName: '查询',
|
||||||
|
name: 'search',
|
||||||
|
color: 'primary',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 20,
|
||||||
|
printStatus: '1',
|
||||||
|
lineId: '',
|
||||||
|
createTime: [],
|
||||||
|
},
|
||||||
|
total: 0,
|
||||||
|
tableProps,
|
||||||
|
list: [],
|
||||||
|
tableBtn: [
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:order:query',
|
||||||
|
'base:order-con-group-order:create',
|
||||||
|
])
|
||||||
|
? {
|
||||||
|
type: 'view',
|
||||||
|
btnName: '预览',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermi('base:order-group:update')
|
||||||
|
? {
|
||||||
|
type: 'print',
|
||||||
|
btnName: '打印',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermi('base:order-group:update')
|
||||||
|
? {
|
||||||
|
type: 'printed',
|
||||||
|
btnName: '已打印',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:order-group:update',
|
||||||
|
'base:core-product:query',
|
||||||
|
'base:core-customer:query',
|
||||||
|
])
|
||||||
|
? {
|
||||||
|
type: 'edit',
|
||||||
|
btnName: '编辑',
|
||||||
|
showParam: {
|
||||||
|
type: '&',
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
type: 'unequal',
|
||||||
|
name: 'isEdit',
|
||||||
|
value: true,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:order-group:update',
|
||||||
|
'base:core-product:query',
|
||||||
|
'base:core-customer:query',
|
||||||
|
])
|
||||||
|
? {
|
||||||
|
type: 'save',
|
||||||
|
btnName: '保存',
|
||||||
|
showParam: {
|
||||||
|
type: '&',
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
type: 'equal',
|
||||||
|
name: 'isEdit',
|
||||||
|
value: true,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermi('base:order-group:query')
|
||||||
|
? {
|
||||||
|
type: 'delete',
|
||||||
|
btnName: '删除',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
].filter((v) => v),
|
||||||
|
printData: {},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getLineList();
|
||||||
|
console.log(printTemplate);
|
||||||
|
console.log('================printTemplate');
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getLineList() {
|
||||||
|
getCorePLList().then((res) => {
|
||||||
|
this.formConfig[0].selectOptions = res.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getList() {
|
||||||
|
getPackingPage({ ...this.queryParams }).then((res) => {
|
||||||
|
this.list = res.data.records || [];
|
||||||
|
this.total = res.data.total;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 单选
|
||||||
|
changeChoose(val) {
|
||||||
|
this.chooseMsg = val;
|
||||||
|
},
|
||||||
|
buttonClick(val) {
|
||||||
|
this.queryParams.lineId = val.lineId;
|
||||||
|
this.queryParams.createTime = val.timeVal;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
handleClick(val) {
|
||||||
|
console.log(val);
|
||||||
|
switch (val.type) {
|
||||||
|
case 'edit':
|
||||||
|
this.editNum(val.data);
|
||||||
|
break;
|
||||||
|
case 'save':
|
||||||
|
this.saveNum(val.data);
|
||||||
|
break;
|
||||||
|
case 'view':
|
||||||
|
this.preView();
|
||||||
|
break;
|
||||||
|
case 'print':
|
||||||
|
this.printTemp();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 编辑
|
||||||
|
editNum(val) {
|
||||||
|
let obj = this.list[val._pageIndex - 1];
|
||||||
|
obj.isEdit = true;
|
||||||
|
this.$set(this.list, val._pageIndex - 1, obj);
|
||||||
|
},
|
||||||
|
// 保存
|
||||||
|
saveNum(val) {
|
||||||
|
// 调用修改接口
|
||||||
|
updatePacking({ id: val.id, num: val.num }).then(() => {
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 输入框改变num
|
||||||
|
inputChange(val) {
|
||||||
|
this.list[val._pageIndex - 1][val.prop] = val[val.prop];
|
||||||
|
},
|
||||||
|
// 预览
|
||||||
|
preView() {
|
||||||
|
var hiprintTemplate = new hiprint.PrintTemplate({
|
||||||
|
template: printTemplate,
|
||||||
|
});
|
||||||
|
this.$refs.preView.show(hiprintTemplate);
|
||||||
|
},
|
||||||
|
// 打印
|
||||||
|
printTemp() {
|
||||||
|
console.log('11');
|
||||||
|
var printData = {};
|
||||||
|
let hiprintTemplate = this.$print(
|
||||||
|
undefined,
|
||||||
|
printTemplate,
|
||||||
|
printData,
|
||||||
|
{},
|
||||||
|
{
|
||||||
|
styleHandler: () => {
|
||||||
|
let css =
|
||||||
|
'<link href="http://hiprint.io/Content/hiprint/css/print-lock.css" media="print" rel="stylesheet">';
|
||||||
|
return css;
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
console.log(hiprintTemplate);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
69
src/views/base/packagingPrintLog2/components/UnPrintEdit.vue
Normal file
69
src/views/base/packagingPrintLog2/components/UnPrintEdit.vue
Normal file
@@ -0,0 +1,69 @@
|
|||||||
|
<template>
|
||||||
|
<el-form
|
||||||
|
ref="unPrintEdit"
|
||||||
|
:rules="rules"
|
||||||
|
label-width="130px"
|
||||||
|
:model="form">
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-form-item
|
||||||
|
label="成品周转编号"
|
||||||
|
prop="packagingCode">
|
||||||
|
<el-input
|
||||||
|
readonly
|
||||||
|
v-model="form.packagingCode"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-form-item
|
||||||
|
label="片数"
|
||||||
|
prop="num">
|
||||||
|
<el-input-number
|
||||||
|
v-model="form.num"
|
||||||
|
:min="0"
|
||||||
|
:max="999999"
|
||||||
|
style="width: 100%"
|
||||||
|
label="片数"></el-input-number>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { getPacking } from '@/api/base/packingInfo';
|
||||||
|
export default {
|
||||||
|
name: 'UnPrintEdit',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
form: {
|
||||||
|
id: '',
|
||||||
|
packagingCode: '',
|
||||||
|
num: null,
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
num: [{ required: true, message: '片数不能为空', trigger: 'blur' }],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
init(id) {
|
||||||
|
console.log('init');
|
||||||
|
this.form.id = id;
|
||||||
|
getPacking(id).then((res) => {
|
||||||
|
console.log(res);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
submitForm() {
|
||||||
|
this.$refs['unPrintEdit'].validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
console.log('保存');
|
||||||
|
this.$emit('successSubmit');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
formClear() {
|
||||||
|
this.$refs.unPrintEdit.resetFields();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
100
src/views/base/packagingPrintLog2/components/preview.vue
Normal file
100
src/views/base/packagingPrintLog2/components/preview.vue
Normal file
@@ -0,0 +1,100 @@
|
|||||||
|
<template>
|
||||||
|
<base-dialog
|
||||||
|
dialogTitle="预览"
|
||||||
|
:dialogVisible="visible"
|
||||||
|
width="50%"
|
||||||
|
@cancel="hideModal"
|
||||||
|
:before-close="hideModal">
|
||||||
|
<!-- <div>
|
||||||
|
<el-button
|
||||||
|
:loading="waitShowPrinter"
|
||||||
|
type="primary"
|
||||||
|
icon="printer"
|
||||||
|
@click.stop="print">
|
||||||
|
打印
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
icon="printer"
|
||||||
|
@click.stop="toPdf">
|
||||||
|
pdf
|
||||||
|
</el-button>
|
||||||
|
</div> -->
|
||||||
|
<div id="preview_content" />
|
||||||
|
<template slot="footer">
|
||||||
|
<el-button
|
||||||
|
key="close"
|
||||||
|
@click="hideModal">
|
||||||
|
关闭
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</base-dialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'PrintPreview',
|
||||||
|
props: {},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
visible: false,
|
||||||
|
spinning: true,
|
||||||
|
waitShowPrinter: false,
|
||||||
|
// 纸张宽 mm
|
||||||
|
width: 0,
|
||||||
|
// 模板
|
||||||
|
hiprintTemplate: {},
|
||||||
|
// 数据
|
||||||
|
printData: {},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {},
|
||||||
|
watch: {},
|
||||||
|
created() {},
|
||||||
|
mounted() {},
|
||||||
|
methods: {
|
||||||
|
hideModal() {
|
||||||
|
this.visible = false;
|
||||||
|
},
|
||||||
|
show(hiprintTemplate, printData, width = '210') {
|
||||||
|
this.visible = true;
|
||||||
|
this.spinning = true;
|
||||||
|
this.width = width;
|
||||||
|
this.hiprintTemplate = hiprintTemplate;
|
||||||
|
this.printData = printData;
|
||||||
|
console.log(hiprintTemplate);
|
||||||
|
console.log(printData);
|
||||||
|
setTimeout(() => {
|
||||||
|
// eslint-disable-next-line no-undef
|
||||||
|
$('#preview_content').html(hiprintTemplate.getHtml(printData));
|
||||||
|
this.spinning = false;
|
||||||
|
}, 500);
|
||||||
|
},
|
||||||
|
print() {
|
||||||
|
this.waitShowPrinter = true;
|
||||||
|
this.hiprintTemplate.print(
|
||||||
|
this.printData,
|
||||||
|
{},
|
||||||
|
{
|
||||||
|
callback: () => {
|
||||||
|
console.log('callback');
|
||||||
|
this.waitShowPrinter = false;
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
},
|
||||||
|
toPdf() {
|
||||||
|
this.hiprintTemplate.toPdf({}, '打印预览');
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<!-- <style lang="less" scoped>
|
||||||
|
/deep/ .ant-modal-body {
|
||||||
|
padding: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/deep/ .ant-modal-content {
|
||||||
|
margin-bottom: 24px;
|
||||||
|
}
|
||||||
|
</style> -->
|
||||||
47
src/views/base/packagingPrintLog2/index.vue
Normal file
47
src/views/base/packagingPrintLog2/index.vue
Normal file
@@ -0,0 +1,47 @@
|
|||||||
|
<template>
|
||||||
|
<div class="packagingPrintLog-box">
|
||||||
|
<div style="width: 100%">
|
||||||
|
<ButtonNav
|
||||||
|
:menus="['未打印', '已打印']"
|
||||||
|
:button-mode="true"
|
||||||
|
@change="currentMenu"></ButtonNav>
|
||||||
|
</div>
|
||||||
|
<!-- 未打印 -->
|
||||||
|
<UnPrint v-if="activeMenu == '未打印'" />
|
||||||
|
<!-- 已打印 -->
|
||||||
|
<Printed v-else />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import ButtonNav from '@/components/ButtonNav';
|
||||||
|
import UnPrint from './components/UnPrint';
|
||||||
|
import Printed from './components/Printed';
|
||||||
|
export default {
|
||||||
|
name: 'packagingPrintLog',
|
||||||
|
components: { ButtonNav, UnPrint, Printed },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
activeMenu: '未打印',
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
currentMenu(val) {
|
||||||
|
console.log(val);
|
||||||
|
this.activeMenu = val;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.packagingPrintLog-box {
|
||||||
|
min-height: calc(100vh - 120px - 8px);
|
||||||
|
background-color: #f2f4f9;
|
||||||
|
.show-box {
|
||||||
|
min-height: calc(100vh - 128px - 52px);
|
||||||
|
margin-top: 8px;
|
||||||
|
padding: 16px;
|
||||||
|
border-radius: 8px;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
554
src/views/base/packagingPrintLog2/print-template.js
Normal file
554
src/views/base/packagingPrintLog2/print-template.js
Normal file
@@ -0,0 +1,554 @@
|
|||||||
|
export default {
|
||||||
|
panels: [
|
||||||
|
{
|
||||||
|
index: 0,
|
||||||
|
name: 1,
|
||||||
|
height: 125,
|
||||||
|
width: 95,
|
||||||
|
paperHeader: 0,
|
||||||
|
paperFooter: 354.33070866141736,
|
||||||
|
printElements: [
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 5,
|
||||||
|
height: 30,
|
||||||
|
width: 256.5,
|
||||||
|
right: 262.2421875,
|
||||||
|
bottom: 34.9921875,
|
||||||
|
vCenter: 133.9921875,
|
||||||
|
hCenter: 19.9921875,
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
borderColor: 'green',
|
||||||
|
backgroundColor: 'green',
|
||||||
|
},
|
||||||
|
printElementType: { title: '矩形', type: 'rect' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 35,
|
||||||
|
top: 15,
|
||||||
|
height: 20,
|
||||||
|
width: 195,
|
||||||
|
title: '厂内镀膜/钢化片周转标签',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 16.5,
|
||||||
|
color: '#ffffff',
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 232.9921875,
|
||||||
|
bottom: 35.24609375,
|
||||||
|
vCenter: 135.4921875,
|
||||||
|
hCenter: 25.24609375,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: { left: 50, top: 35, height: 52.5, width: 9 },
|
||||||
|
printElementType: { title: '竖线', type: 'vline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 35,
|
||||||
|
height: 309,
|
||||||
|
width: 256.5,
|
||||||
|
right: 261.4921875,
|
||||||
|
bottom: 343.9921875,
|
||||||
|
vCenter: 133.2421875,
|
||||||
|
hCenter: 189.4921875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '矩形', type: 'rect' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 10,
|
||||||
|
top: 42.5,
|
||||||
|
height: 18,
|
||||||
|
width: 36,
|
||||||
|
title: '线别',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 45.99609375,
|
||||||
|
bottom: 60.4921875,
|
||||||
|
vCenter: 27.99609375,
|
||||||
|
hCenter: 51.4921875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 55,
|
||||||
|
top: 42.5,
|
||||||
|
height: 18,
|
||||||
|
width: 200,
|
||||||
|
title: '判定:良品/保留/再检',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 93.4921875,
|
||||||
|
bottom: 59.25,
|
||||||
|
vCenter: 75.4921875,
|
||||||
|
hCenter: 50.25,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 62.5,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 259.9921875,
|
||||||
|
bottom: 72.4921875,
|
||||||
|
vCenter: 132.4921875,
|
||||||
|
hCenter: 67.9921875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 55,
|
||||||
|
top: 70,
|
||||||
|
height: 18,
|
||||||
|
width: 46,
|
||||||
|
title: '备注:',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 91.2421875,
|
||||||
|
bottom: 86.25,
|
||||||
|
vCenter: 73.2421875,
|
||||||
|
hCenter: 77.25,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 190,
|
||||||
|
top: 87.5,
|
||||||
|
height: 169.5,
|
||||||
|
width: 9,
|
||||||
|
right: 199.74609375,
|
||||||
|
bottom: 255.75,
|
||||||
|
vCenter: 195.24609375,
|
||||||
|
hCenter: 171,
|
||||||
|
},
|
||||||
|
printElementType: { title: '竖线', type: 'vline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 87.5,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 260.7421875,
|
||||||
|
bottom: 96.75,
|
||||||
|
vCenter: 132.4921875,
|
||||||
|
hCenter: 92.25,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 77.5,
|
||||||
|
top: 90,
|
||||||
|
height: 15,
|
||||||
|
width: 36,
|
||||||
|
title: '规格',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 113.49609375,
|
||||||
|
bottom: 105.4921875,
|
||||||
|
vCenter: 95.49609375,
|
||||||
|
hCenter: 97.9921875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 207.5,
|
||||||
|
top: 100,
|
||||||
|
height: 18,
|
||||||
|
width: 36,
|
||||||
|
title: '用户',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 242.7421875,
|
||||||
|
bottom: 116.25,
|
||||||
|
vCenter: 224.7421875,
|
||||||
|
hCenter: 107.25,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 25,
|
||||||
|
top: 102.5,
|
||||||
|
height: 15,
|
||||||
|
width: 156,
|
||||||
|
title: '长*宽*厚度(单位:mm)',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 179.25,
|
||||||
|
bottom: 117.4921875,
|
||||||
|
vCenter: 101.25,
|
||||||
|
hCenter: 109.9921875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 117.5,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 263.7421875,
|
||||||
|
bottom: 125.7421875,
|
||||||
|
vCenter: 135.4921875,
|
||||||
|
hCenter: 121.2421875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 130,
|
||||||
|
top: 145,
|
||||||
|
height: 55.5,
|
||||||
|
width: 9,
|
||||||
|
right: 138.99609375,
|
||||||
|
bottom: 199.5,
|
||||||
|
vCenter: 134.49609375,
|
||||||
|
hCenter: 171.75,
|
||||||
|
},
|
||||||
|
printElementType: { title: '竖线', type: 'vline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 145,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 260.25,
|
||||||
|
bottom: 154.2421875,
|
||||||
|
vCenter: 132,
|
||||||
|
hCenter: 149.7421875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 45,
|
||||||
|
top: 155,
|
||||||
|
height: 18,
|
||||||
|
width: 36,
|
||||||
|
title: '编号',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 82.2421875,
|
||||||
|
bottom: 171.75,
|
||||||
|
vCenter: 64.2421875,
|
||||||
|
hCenter: 162.75,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 135,
|
||||||
|
top: 155,
|
||||||
|
height: 18,
|
||||||
|
width: 49.5,
|
||||||
|
title: '工位号',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 186,
|
||||||
|
bottom: 172.9921875,
|
||||||
|
vCenter: 161.25,
|
||||||
|
hCenter: 163.9921875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 197.5,
|
||||||
|
top: 155,
|
||||||
|
height: 18,
|
||||||
|
width: 60,
|
||||||
|
title: '流程卡号',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 256.74609375,
|
||||||
|
bottom: 143.7421875,
|
||||||
|
vCenter: 226.74609375,
|
||||||
|
hCenter: 134.7421875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 175,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 259.2421875,
|
||||||
|
bottom: 183.75,
|
||||||
|
vCenter: 130.9921875,
|
||||||
|
hCenter: 179.25,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 50,
|
||||||
|
top: 200,
|
||||||
|
height: 58.5,
|
||||||
|
width: 9,
|
||||||
|
right: 58.9921875,
|
||||||
|
bottom: 259.5,
|
||||||
|
vCenter: 54.4921875,
|
||||||
|
hCenter: 230.25,
|
||||||
|
},
|
||||||
|
printElementType: { title: '竖线', type: 'vline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 110,
|
||||||
|
top: 200,
|
||||||
|
height: 58.5,
|
||||||
|
width: 9,
|
||||||
|
right: 117.75,
|
||||||
|
bottom: 256.9921875,
|
||||||
|
vCenter: 113.25,
|
||||||
|
hCenter: 227.7421875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '竖线', type: 'vline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 200,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 262.9921875,
|
||||||
|
bottom: 210.24609375,
|
||||||
|
vCenter: 134.7421875,
|
||||||
|
hCenter: 205.74609375,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 10,
|
||||||
|
top: 210,
|
||||||
|
height: 18,
|
||||||
|
width: 36,
|
||||||
|
title: '日期',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 45.99609375,
|
||||||
|
bottom: 228,
|
||||||
|
vCenter: 27.99609375,
|
||||||
|
hCenter: 219,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 67.5,
|
||||||
|
top: 210,
|
||||||
|
height: 18,
|
||||||
|
width: 36,
|
||||||
|
title: '班次',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 103.5,
|
||||||
|
bottom: 228,
|
||||||
|
vCenter: 85.5,
|
||||||
|
hCenter: 219,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 207.5,
|
||||||
|
top: 210,
|
||||||
|
height: 18,
|
||||||
|
width: 36,
|
||||||
|
title: '片数',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 243.4921875,
|
||||||
|
bottom: 228,
|
||||||
|
vCenter: 225.4921875,
|
||||||
|
hCenter: 219,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 230,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 261.4921875,
|
||||||
|
bottom: 239.25,
|
||||||
|
vCenter: 133.2421875,
|
||||||
|
hCenter: 234.75,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 257.5,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 261.4921875,
|
||||||
|
bottom: 266.49609375,
|
||||||
|
vCenter: 133.2421875,
|
||||||
|
hCenter: 261.99609375,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 10,
|
||||||
|
top: 262.5,
|
||||||
|
height: 18,
|
||||||
|
width: 87,
|
||||||
|
title: '封箱人员工号:',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 46.9921875,
|
||||||
|
bottom: 279.24609375,
|
||||||
|
vCenter: 28.9921875,
|
||||||
|
hCenter: 270.24609375,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 280,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 262.2421875,
|
||||||
|
bottom: 289.2421875,
|
||||||
|
vCenter: 133.9921875,
|
||||||
|
hCenter: 284.7421875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 10,
|
||||||
|
top: 285,
|
||||||
|
height: 18,
|
||||||
|
width: 87,
|
||||||
|
title: '打包人员工号:',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 96.4921875,
|
||||||
|
bottom: 301.74609375,
|
||||||
|
vCenter: 52.9921875,
|
||||||
|
hCenter: 292.74609375,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 300,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 264.4921875,
|
||||||
|
bottom: 308.49609375,
|
||||||
|
vCenter: 136.2421875,
|
||||||
|
hCenter: 303.99609375,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 10,
|
||||||
|
top: 305,
|
||||||
|
height: 18,
|
||||||
|
width: 247.5,
|
||||||
|
title: '备注1:单层镀/双层镀/丝印打孔/打孔钢片',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 96.99609375,
|
||||||
|
bottom: 322.9921875,
|
||||||
|
vCenter: 53.49609375,
|
||||||
|
hCenter: 313.9921875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 5,
|
||||||
|
top: 322.5,
|
||||||
|
height: 9,
|
||||||
|
width: 256.5,
|
||||||
|
right: 262.2421875,
|
||||||
|
bottom: 332.7421875,
|
||||||
|
vCenter: 133.9921875,
|
||||||
|
hCenter: 328.2421875,
|
||||||
|
},
|
||||||
|
printElementType: { title: '横线', type: 'hline' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
options: {
|
||||||
|
left: 10,
|
||||||
|
top: 327.5,
|
||||||
|
height: 18,
|
||||||
|
width: 87,
|
||||||
|
title: '备注2:',
|
||||||
|
coordinateSync: false,
|
||||||
|
widthHeightSync: false,
|
||||||
|
fontSize: 12,
|
||||||
|
qrCodeLevel: 0,
|
||||||
|
right: 97.9921875,
|
||||||
|
bottom: 343.74609375,
|
||||||
|
vCenter: 54.4921875,
|
||||||
|
hCenter: 334.74609375,
|
||||||
|
},
|
||||||
|
printElementType: { title: '文本', type: 'text' },
|
||||||
|
},
|
||||||
|
],
|
||||||
|
paperNumberLeft: 372.5,
|
||||||
|
paperNumberTop: 337.5,
|
||||||
|
paperNumberContinue: true,
|
||||||
|
watermarkOptions: {},
|
||||||
|
},
|
||||||
|
]
|
||||||
|
}
|
||||||
@@ -6,138 +6,130 @@
|
|||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<el-dialog class="baseDialog" :visible.sync="visible" :show-close="false" :wrapper-closable="false" width="30%" show-close="true">
|
<el-dialog
|
||||||
<small-title slot="title" :no-padding="true">
|
class="baseDialog"
|
||||||
{{ !dataForm.id ? '新增' : '编辑' }}
|
:visible.sync="visible"
|
||||||
</small-title>
|
:show-close="true"
|
||||||
|
:wrapper-closable="false"
|
||||||
|
width="50%">
|
||||||
|
<small-title
|
||||||
|
slot="title"
|
||||||
|
:no-padding="true">
|
||||||
|
{{ !dataForm.id ? '新增' : '编辑' }}
|
||||||
|
</small-title>
|
||||||
|
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="visual-part">
|
<div class="visual-part">
|
||||||
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="100px"
|
<el-form
|
||||||
@keyup.enter.native="dataFormSubmit">
|
ref="dataForm"
|
||||||
<el-row :gutter="20">
|
:model="dataForm"
|
||||||
<el-col :span="12">
|
:rules="dataRule"
|
||||||
<el-form-item label="模板名称" prop="name">
|
label-width="100px"
|
||||||
<el-input v-model="dataForm.name" clearable placeholder="请输入模板名称" />
|
@keyup.enter.native="dataFormSubmit">
|
||||||
</el-form-item>
|
<el-row :gutter="20">
|
||||||
</el-col>
|
<el-col :span="24">
|
||||||
<el-col :span="12">
|
<el-form-item
|
||||||
<el-form-item label="标签类型" prop="typeId">
|
label="模板名称"
|
||||||
<el-select v-model="dataForm.typeId" style="width: 100%;" placeholder="请选择标签类型" clearable>
|
prop="name">
|
||||||
<el-option v-for="dict in typeList" :key="dict.id" :label="dict.name" :value="dict.id" />
|
<el-input
|
||||||
</el-select>
|
v-model="dataForm.name"
|
||||||
</el-form-item>
|
clearable
|
||||||
</el-col>
|
placeholder="请输入模板名称" />
|
||||||
</el-row>
|
</el-form-item>
|
||||||
<el-row :gutter="20">
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="24">
|
||||||
<el-form-item label="打印方式" prop="printModel">
|
<el-form-item
|
||||||
<el-select v-model="dataForm.printModel" style="width: 100%;" placeholder="请选择打印方式" clearable>
|
label="标签类型"
|
||||||
<el-option v-for="dict in printModelList" :key="dict.id" :label="dict.name" :value="dict.id" />
|
prop="typeId">
|
||||||
</el-select>
|
<el-select
|
||||||
</el-form-item>
|
v-model="dataForm.typeId"
|
||||||
</el-col>
|
style="width: 100%"
|
||||||
<el-col :span="12">
|
placeholder="请选择标签类型"
|
||||||
<el-form-item label="标签备注" prop="remark">
|
clearable>
|
||||||
<el-input v-model="dataForm.remark" clearable placeholder="请输入标签备注" />
|
<el-option
|
||||||
</el-form-item>
|
v-for="dict in typeList"
|
||||||
</el-col>
|
:key="dict.id"
|
||||||
</el-row>
|
:label="dict.name"
|
||||||
<el-row :gutter="20">
|
:value="dict.id" />
|
||||||
<el-col :span="12">
|
</el-select>
|
||||||
<el-form-item label="模板设计" prop="content">
|
</el-form-item>
|
||||||
<el-button icon="el-icon-edit" @click="btnClickDesign()">模板设计</el-button>
|
</el-col>
|
||||||
</el-form-item>
|
</el-row>
|
||||||
</el-col>
|
<el-row :gutter="20">
|
||||||
<!-- <el-col :span="12">
|
<el-col :span="24">
|
||||||
<el-form-item label="单位平方数" prop="area">
|
<el-form-item
|
||||||
<el-input v-model="dataForm.area" placeholder="请输入单位平方数" />
|
label="打印方式"
|
||||||
</el-form-item>
|
prop="printModel">
|
||||||
</el-col> -->
|
<el-select
|
||||||
</el-row>
|
v-model="dataForm.printModel"
|
||||||
<!-- <el-row :gutter="20">
|
style="width: 100%"
|
||||||
<el-col :span="24">
|
placeholder="请选择打印方式"
|
||||||
<el-form-item label="完成单位产品用时" prop="processTime">
|
clearable>
|
||||||
<el-input v-model="dataForm.processTime" placeholder="请输入完成单位产品用时" />
|
<el-option
|
||||||
</el-form-item>
|
v-for="dict in printModelList"
|
||||||
</el-col>
|
:key="dict.id"
|
||||||
</el-row> -->
|
:label="dict.name"
|
||||||
</el-form>
|
:value="dict.id" />
|
||||||
|
</el-select>
|
||||||
<!-- <small-title
|
</el-form-item>
|
||||||
style="margin: 16px 0; padding-left: 8px"
|
</el-col>
|
||||||
:no-padding="true">
|
<el-col :span="24">
|
||||||
产品属性列表
|
<el-form-item
|
||||||
</small-title>
|
label="标签备注"
|
||||||
|
prop="remark">
|
||||||
<div class="attr-list">
|
<el-input
|
||||||
<base-table
|
v-model="dataForm.remark"
|
||||||
:table-props="tableProps"
|
clearable
|
||||||
:page="listQuery.pageNo"
|
placeholder="请输入标签备注" />
|
||||||
:limit="listQuery.pageSize"
|
</el-form-item>
|
||||||
:add-button-show="isdetail ? null : '添加属性'"
|
</el-col>
|
||||||
@emitButtonClick="addNew()"
|
</el-row>
|
||||||
:table-data="productAttributeList">
|
<el-row :gutter="20">
|
||||||
<method-btn
|
<el-col :span="24">
|
||||||
v-if="!isdetail"
|
<el-form-item
|
||||||
slot="handleBtn"
|
label="模板设计"
|
||||||
:width="120"
|
prop="content">
|
||||||
label="操作"
|
<el-button
|
||||||
:method-list="tableBtn"
|
icon="el-icon-edit"
|
||||||
@clickBtn="handleClick" />
|
@click="btnClickDesign()">
|
||||||
</base-table>
|
模板设计
|
||||||
<pagination
|
</el-button>
|
||||||
v-show="listQuery.total > 0"
|
</el-form-item>
|
||||||
:total="listQuery.total"
|
</el-col>
|
||||||
:page.sync="listQuery.pageNo"
|
</el-row>
|
||||||
:limit.sync="listQuery.pageSize"
|
</el-form>
|
||||||
:page-sizes="[5, 10, 15]"
|
</div>
|
||||||
@pagination="getList" />
|
</div>
|
||||||
</div> -->
|
<template slot="footer">
|
||||||
</div>
|
<el-button
|
||||||
</div>
|
style=""
|
||||||
|
@click="goback()">
|
||||||
<!-- <div style="position: absolute; bottom: 24px; right: 24px">
|
取消
|
||||||
<el-button style="margin-right: 10px" @click="goback()">返回</el-button>
|
|
||||||
<el-button v-if="isdetail" type="primary" @click="goEdit()">
|
|
||||||
编辑
|
|
||||||
</el-button>
|
</el-button>
|
||||||
<span v-if="!isdetail">
|
<el-button
|
||||||
<el-button type="primary" @click="dataFormSubmit()">保存</el-button>
|
type="primary"
|
||||||
<el-button
|
@click="dataFormSubmit()">
|
||||||
v-if="dataForm.id && !isdetail"
|
确定
|
||||||
type="primary"
|
</el-button>
|
||||||
@click="addNew()">
|
</template>
|
||||||
添加属性
|
<print-model-design
|
||||||
</el-button>
|
v-if="modelShow"
|
||||||
</span>
|
ref="printModelDesign"
|
||||||
</div> -->
|
@saveData="getModelData" />
|
||||||
<template slot="footer">
|
</el-dialog>
|
||||||
<el-button style="" @click="goback()">取消</el-button>
|
|
||||||
<!-- <el-button v-if="isdetail" type="primary" @click="goEdit()">
|
|
||||||
编辑
|
|
||||||
</el-button> -->
|
|
||||||
<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
|
|
||||||
</template>
|
|
||||||
<print-model-design v-if="modelShow" ref="printModelDesign" @saveData="getModelData" />
|
|
||||||
</el-dialog>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
||||||
import {
|
import {
|
||||||
createPackingModel,
|
createPackingModel,
|
||||||
updatePackingModel,
|
updatePackingModel,
|
||||||
getPackingModel,
|
getPackingModel,
|
||||||
// getWorkOrderList,
|
getTypeList,
|
||||||
// getCode,
|
|
||||||
// getCustomerList,
|
|
||||||
getTypeList
|
|
||||||
} from '@/api/base/printModel.js';
|
} from '@/api/base/printModel.js';
|
||||||
// import productAttrAdd from './attr-add';
|
// import productAttrAdd from './attr-add';
|
||||||
import { parseTime } from '../mixins/code-filter';
|
import { parseTime } from '../mixins/code-filter';
|
||||||
import SmallTitle from './SmallTitle';
|
import SmallTitle from './SmallTitle';
|
||||||
import printModelDesign from '../custom/index'
|
import printModelDesign from '../custom/index';
|
||||||
|
|
||||||
const tableBtn = [
|
const tableBtn = [
|
||||||
{
|
{
|
||||||
@@ -166,42 +158,42 @@ const tableProps = [
|
|||||||
];
|
];
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: { SmallTitle, printModelDesign },
|
components: { SmallTitle, printModelDesign },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
visible: false,
|
visible: false,
|
||||||
addOrUpdateVisible: false,
|
addOrUpdateVisible: false,
|
||||||
tableBtn,
|
tableBtn,
|
||||||
tableProps,
|
tableProps,
|
||||||
modelShow:false,
|
modelShow: false,
|
||||||
typeList:[],
|
typeList: [],
|
||||||
dataForm: {
|
dataForm: {
|
||||||
id: null,
|
id: null,
|
||||||
// name: '', // 产品名称
|
// name: '', // 产品名称
|
||||||
name: '', // 产品编码
|
name: '', // 产品编码
|
||||||
// area: 0, // 单位平方数(float only)
|
// area: 0, // 单位平方数(float only)
|
||||||
typeId: null, // 产品类型id
|
typeId: null, // 产品类型id
|
||||||
printModel: null, // 单位产品用时 (s)
|
printModel: null, // 单位产品用时 (s)
|
||||||
content: '', // 规格
|
content: '', // 规格
|
||||||
remark: '', // 单位id
|
remark: '', // 单位id
|
||||||
},
|
},
|
||||||
printModelList: [
|
printModelList: [
|
||||||
{
|
{
|
||||||
id: 1,
|
id: 1,
|
||||||
name:'自动'
|
name: '自动',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 2,
|
id: 2,
|
||||||
name: '手动'
|
name: '手动',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
listQuery: {
|
listQuery: {
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
pageNo: 1,
|
pageNo: 1,
|
||||||
total: 0,
|
total: 0,
|
||||||
},
|
},
|
||||||
dataRule: {
|
dataRule: {
|
||||||
typeId: [
|
typeId: [
|
||||||
{
|
{
|
||||||
required: true,
|
required: true,
|
||||||
message: '打印类型不能为空',
|
message: '打印类型不能为空',
|
||||||
@@ -221,7 +213,7 @@ export default {
|
|||||||
trigger: 'blur',
|
trigger: 'blur',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
printModel: [
|
printModel: [
|
||||||
{
|
{
|
||||||
required: true,
|
required: true,
|
||||||
message: '模板类型不能为空',
|
message: '模板类型不能为空',
|
||||||
@@ -229,11 +221,11 @@ export default {
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
content: [
|
content: [
|
||||||
{
|
{
|
||||||
required: true,
|
required: true,
|
||||||
message: '模板不能为空',
|
message: '模板不能为空',
|
||||||
trigger: 'blur',
|
trigger: 'blur',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
processTime: [
|
processTime: [
|
||||||
{
|
{
|
||||||
@@ -251,30 +243,30 @@ export default {
|
|||||||
},
|
},
|
||||||
// isdetail: false,
|
// isdetail: false,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
getModelData(data) {
|
getModelData(data) {
|
||||||
console.log(data)
|
console.log(data);
|
||||||
this.content = JSON.stringify(data)
|
this.content = JSON.stringify(data);
|
||||||
this.dataForm.content = JSON.stringify(data)
|
this.dataForm.content = JSON.stringify(data);
|
||||||
},
|
},
|
||||||
btnClickDesign() {
|
btnClickDesign() {
|
||||||
console.log(11111)
|
console.log(11111);
|
||||||
this.modelShow = true
|
this.modelShow = true;
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$refs.printModelDesign.init(this.dataForm.content)
|
this.$refs.printModelDesign.init(this.dataForm.content);
|
||||||
console.log(this.dataForm.content)
|
console.log(this.dataForm.content);
|
||||||
})
|
});
|
||||||
// this.$router.push({
|
// this.$router.push({
|
||||||
// path: '/printModelDesign'
|
// path: '/printModelDesign'
|
||||||
// })
|
// })
|
||||||
},
|
},
|
||||||
// initData() {
|
// initData() {
|
||||||
// this.productAttributeList.splice(0);
|
// this.productAttributeList.splice(0);
|
||||||
// this.listQuery.total = 0;
|
// this.listQuery.total = 0;
|
||||||
// },
|
// },
|
||||||
init(id) {
|
init(id) {
|
||||||
this.getDict()
|
this.getDict();
|
||||||
// this.initData();
|
// this.initData();
|
||||||
// this.isdetail = isdetail || false;
|
// this.isdetail = isdetail || false;
|
||||||
this.dataForm.id = id || null;
|
this.dataForm.id = id || null;
|
||||||
@@ -284,34 +276,34 @@ export default {
|
|||||||
this.$refs['dataForm'].resetFields();
|
this.$refs['dataForm'].resetFields();
|
||||||
if (this.dataForm.id) {
|
if (this.dataForm.id) {
|
||||||
// 获取产品详情
|
// 获取产品详情
|
||||||
getPackingModel(id).then((response) => {
|
getPackingModel(id).then((response) => {
|
||||||
this.dataForm = response.data;
|
this.dataForm = response.data;
|
||||||
});
|
});
|
||||||
// 获取产品的属性列表
|
// 获取产品的属性列表
|
||||||
// this.getList();
|
// this.getList();
|
||||||
} else {
|
} else {
|
||||||
// getCode().then((res) => {
|
// getCode().then((res) => {
|
||||||
// this.dataForm.packagingCode = res.data;
|
// this.dataForm.packagingCode = res.data;
|
||||||
// });
|
// });
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
getDict() {
|
getDict() {
|
||||||
// 获取产品的属性列表
|
// 获取产品的属性列表
|
||||||
// getCustomerList().then((response) => {
|
// getCustomerList().then((response) => {
|
||||||
// console.log(response);
|
// console.log(response);
|
||||||
// this.customerList = response.data
|
// this.customerList = response.data
|
||||||
// // this.listQuery.total = response.data.total;
|
// // this.listQuery.total = response.data.total;
|
||||||
// })
|
// })
|
||||||
getTypeList().then((response) => {
|
getTypeList().then((response) => {
|
||||||
console.log(response);
|
console.log(response);
|
||||||
this.typeList = response.data
|
this.typeList = response.data;
|
||||||
// this.listQuery.total = response.data.total;
|
// this.listQuery.total = response.data.total;
|
||||||
})
|
});
|
||||||
// getWorkOrderList().then((response) => {
|
// getWorkOrderList().then((response) => {
|
||||||
// // console.log(response);
|
// // console.log(response);
|
||||||
// this.workOrderList = response.data
|
// this.workOrderList = response.data
|
||||||
// // this.listQuery.total = response.data.total;
|
// // this.listQuery.total = response.data.total;
|
||||||
// })
|
// })
|
||||||
},
|
},
|
||||||
@@ -353,7 +345,7 @@ export default {
|
|||||||
if (valid) {
|
if (valid) {
|
||||||
// 修改的提交
|
// 修改的提交
|
||||||
if (this.dataForm.id) {
|
if (this.dataForm.id) {
|
||||||
updatePackingModel(this.dataForm).then((response) => {
|
updatePackingModel(this.dataForm).then((response) => {
|
||||||
this.$modal.msgSuccess('修改成功');
|
this.$modal.msgSuccess('修改成功');
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
this.$emit('refreshDataList');
|
this.$emit('refreshDataList');
|
||||||
@@ -361,7 +353,7 @@ export default {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
// 添加的提交
|
// 添加的提交
|
||||||
createPackingModel(this.dataForm).then((response) => {
|
createPackingModel(this.dataForm).then((response) => {
|
||||||
this.$modal.msgSuccess('新增成功');
|
this.$modal.msgSuccess('新增成功');
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
this.$emit('refreshDataList');
|
this.$emit('refreshDataList');
|
||||||
@@ -439,35 +431,31 @@ export default {
|
|||||||
}
|
}
|
||||||
</style> -->
|
</style> -->
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
|
|
||||||
.baseDialog .el-dialog__header {
|
.baseDialog .el-dialog__header {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
color: rgba(0, 0, 0, 0.85);
|
color: rgba(0, 0, 0, 0.85);
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
padding: 13px 24px;
|
padding: 13px 24px;
|
||||||
border-bottom: 1px solid #e9e9e9;
|
border-bottom: 1px solid #e9e9e9;
|
||||||
}
|
}
|
||||||
.baseDialog .el-dialog__header .titleStyle::before{
|
.baseDialog .el-dialog__header .titleStyle::before {
|
||||||
content: '';
|
content: '';
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 4px;
|
width: 4px;
|
||||||
height: 16px;
|
height: 16px;
|
||||||
background-color: #0B58FF;
|
background-color: #0b58ff;
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
position: relative;
|
position: relative;
|
||||||
top: 2px;
|
top: 2px;
|
||||||
}
|
}
|
||||||
.baseDialog .el-dialog__body {
|
.baseDialog .el-dialog__body {
|
||||||
padding-left: 24px;
|
padding-left: 24px;
|
||||||
padding-right: 24px;
|
padding-right: 24px;
|
||||||
}
|
}
|
||||||
.baseDialog .btnTextStyle {
|
.baseDialog .btnTextStyle {
|
||||||
letter-spacing:6px;
|
letter-spacing: 6px;
|
||||||
padding: 9px 10px 9px 16px;
|
padding: 9px 10px 9px 16px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -6,106 +6,72 @@
|
|||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<el-dialog class="baseDialog" :visible.sync="visible" :show-close="false" :wrapper-closable="false" width="40%" show-close="true">
|
<el-dialog
|
||||||
<small-title slot="title" :no-padding="true">
|
class="baseDialog"
|
||||||
{{ !dataForm.id ? '新增' : '编辑' }}
|
:visible.sync="visible"
|
||||||
</small-title>
|
:show-close="true"
|
||||||
|
:wrapper-closable="false"
|
||||||
|
width="50%">
|
||||||
|
<small-title
|
||||||
|
slot="title"
|
||||||
|
:no-padding="true">
|
||||||
|
{{ !dataForm.id ? '新增' : '编辑' }}
|
||||||
|
</small-title>
|
||||||
|
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="visual-part">
|
<div class="visual-part">
|
||||||
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="auto"
|
<el-form
|
||||||
@keyup.enter.native="dataFormSubmit">
|
ref="dataForm"
|
||||||
<el-row :gutter="20">
|
:model="dataForm"
|
||||||
<el-col :span="12">
|
:rules="dataRule"
|
||||||
<el-form-item label="名称" prop="name">
|
label-width="auto"
|
||||||
<el-input v-model="dataForm.name" clearable placeholder="名称" />
|
@keyup.enter.native="dataFormSubmit">
|
||||||
</el-form-item>
|
<el-row :gutter="20">
|
||||||
</el-col>
|
<el-col :span="24">
|
||||||
<el-col :span="12">
|
<el-form-item
|
||||||
<el-form-item label="类型描述" prop="description">
|
label="名称"
|
||||||
<el-input v-model="dataForm.description" clearable placeholder="类型描述" />
|
prop="name">
|
||||||
</el-form-item>
|
<el-input
|
||||||
</el-col>
|
v-model="dataForm.name"
|
||||||
</el-row>
|
clearable
|
||||||
<!-- <el-row :gutter="20">
|
placeholder="名称" />
|
||||||
<el-col :span="24">
|
</el-form-item>
|
||||||
<el-form-item label="完成单位产品用时" prop="processTime">
|
</el-col>
|
||||||
<el-input v-model="dataForm.processTime" placeholder="请输入完成单位产品用时" />
|
<el-col :span="24">
|
||||||
</el-form-item>
|
<el-form-item
|
||||||
</el-col>
|
label="类型描述"
|
||||||
</el-row> -->
|
prop="description">
|
||||||
</el-form>
|
<el-input
|
||||||
|
v-model="dataForm.description"
|
||||||
<!-- <small-title
|
clearable
|
||||||
style="margin: 16px 0; padding-left: 8px"
|
placeholder="类型描述" />
|
||||||
:no-padding="true">
|
</el-form-item>
|
||||||
产品属性列表
|
</el-col>
|
||||||
</small-title>
|
</el-row>
|
||||||
|
</el-form>
|
||||||
<div class="attr-list">
|
</div>
|
||||||
<base-table
|
</div>
|
||||||
:table-props="tableProps"
|
<template slot="footer">
|
||||||
:page="listQuery.pageNo"
|
<el-button
|
||||||
:limit="listQuery.pageSize"
|
style=""
|
||||||
:add-button-show="isdetail ? null : '添加属性'"
|
@click="goback()">
|
||||||
@emitButtonClick="addNew()"
|
取消
|
||||||
:table-data="productAttributeList">
|
|
||||||
<method-btn
|
|
||||||
v-if="!isdetail"
|
|
||||||
slot="handleBtn"
|
|
||||||
:width="120"
|
|
||||||
label="操作"
|
|
||||||
:method-list="tableBtn"
|
|
||||||
@clickBtn="handleClick" />
|
|
||||||
</base-table>
|
|
||||||
<pagination
|
|
||||||
v-show="listQuery.total > 0"
|
|
||||||
:total="listQuery.total"
|
|
||||||
:page.sync="listQuery.pageNo"
|
|
||||||
:limit.sync="listQuery.pageSize"
|
|
||||||
:page-sizes="[5, 10, 15]"
|
|
||||||
@pagination="getList" />
|
|
||||||
</div> -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- <div style="position: absolute; bottom: 24px; right: 24px">
|
|
||||||
<el-button style="margin-right: 10px" @click="goback()">返回</el-button>
|
|
||||||
<el-button v-if="isdetail" type="primary" @click="goEdit()">
|
|
||||||
编辑
|
|
||||||
</el-button>
|
</el-button>
|
||||||
<span v-if="!isdetail">
|
<el-button
|
||||||
<el-button type="primary" @click="dataFormSubmit()">保存</el-button>
|
type="primary"
|
||||||
<el-button
|
@click="dataFormSubmit()">
|
||||||
v-if="dataForm.id && !isdetail"
|
确定
|
||||||
type="primary"
|
</el-button>
|
||||||
@click="addNew()">
|
</template>
|
||||||
添加属性
|
</el-dialog>
|
||||||
</el-button>
|
|
||||||
</span>
|
|
||||||
</div> -->
|
|
||||||
<template slot="footer">
|
|
||||||
<el-button style="" @click="goback()">取消</el-button>
|
|
||||||
<!-- <el-button v-if="isdetail" type="primary" @click="goEdit()">
|
|
||||||
编辑
|
|
||||||
</el-button> -->
|
|
||||||
<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
|
|
||||||
</template>
|
|
||||||
</el-dialog>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
||||||
import {
|
import {
|
||||||
createPackingType,
|
createPackingType,
|
||||||
updatePackingType,
|
updatePackingType,
|
||||||
getPackingType,
|
getPackingType,
|
||||||
// getWorkOrderList,
|
|
||||||
// getCode,
|
|
||||||
// getCustomerList,
|
|
||||||
// getModelList
|
|
||||||
} from '@/api/base/modelType.js';
|
} from '@/api/base/modelType.js';
|
||||||
// import productAttrAdd from './attr-add';
|
|
||||||
import { parseTime } from '../mixins/code-filter';
|
import { parseTime } from '../mixins/code-filter';
|
||||||
import SmallTitle from './SmallTitle';
|
import SmallTitle from './SmallTitle';
|
||||||
|
|
||||||
@@ -142,20 +108,15 @@ export default {
|
|||||||
visible: false,
|
visible: false,
|
||||||
addOrUpdateVisible: false,
|
addOrUpdateVisible: false,
|
||||||
tableBtn,
|
tableBtn,
|
||||||
tableProps,
|
tableProps,
|
||||||
customerList: [],
|
customerList: [],
|
||||||
modelList:[],
|
modelList: [],
|
||||||
workOrderList:[],
|
workOrderList: [],
|
||||||
productAttributeList: [],
|
productAttributeList: [],
|
||||||
dataForm: {
|
dataForm: {
|
||||||
id: null,
|
id: null,
|
||||||
// name: '', // 产品名称
|
name: '', // 产品编码
|
||||||
name: '', // 产品编码
|
description: null, // 产品类型id
|
||||||
// area: 0, // 单位平方数(float only)
|
|
||||||
description: null, // 产品类型id
|
|
||||||
// workOrderId: null, // 单位产品用时 (s)
|
|
||||||
// customerId: '', // 规格
|
|
||||||
// content: '', // 单位id
|
|
||||||
},
|
},
|
||||||
listQuery: {
|
listQuery: {
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
@@ -171,18 +132,10 @@ export default {
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
// isdetail: false,
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// initData() {
|
init(id) {
|
||||||
// this.productAttributeList.splice(0);
|
|
||||||
// this.listQuery.total = 0;
|
|
||||||
// },
|
|
||||||
init(id) {
|
|
||||||
// this.getDict()
|
|
||||||
// this.initData();
|
|
||||||
// this.isdetail = isdetail || false;
|
|
||||||
this.dataForm.id = id || null;
|
this.dataForm.id = id || null;
|
||||||
this.visible = true;
|
this.visible = true;
|
||||||
|
|
||||||
@@ -191,76 +144,20 @@ export default {
|
|||||||
|
|
||||||
if (this.dataForm.id) {
|
if (this.dataForm.id) {
|
||||||
// 获取产品详情
|
// 获取产品详情
|
||||||
getPackingType(id).then((response) => {
|
getPackingType(id).then((response) => {
|
||||||
this.dataForm = response.data;
|
this.dataForm = response.data;
|
||||||
});
|
});
|
||||||
// 获取产品的属性列表
|
|
||||||
// this.getList();
|
|
||||||
} else {
|
|
||||||
// getCode().then((res) => {
|
|
||||||
// this.dataForm.packagingCode = res.data;
|
|
||||||
// });
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
// getDict() {
|
|
||||||
// // 获取产品的属性列表
|
|
||||||
// getCustomerList().then((response) => {
|
|
||||||
// console.log(response);
|
|
||||||
// this.customerList = response.data
|
|
||||||
// // this.listQuery.total = response.data.total;
|
|
||||||
// })
|
|
||||||
// getModelList().then((response) => {
|
|
||||||
// console.log(response);
|
|
||||||
// this.modelList = response.data
|
|
||||||
// // this.listQuery.total = response.data.total;
|
|
||||||
// })
|
|
||||||
// getWorkOrderList().then((response) => {
|
|
||||||
// // console.log(response);
|
|
||||||
// this.workOrderList = response.data
|
|
||||||
// // this.listQuery.total = response.data.total;
|
|
||||||
// })
|
|
||||||
// },
|
|
||||||
// handleClick(raw) {
|
|
||||||
// if (raw.type === 'delete') {
|
|
||||||
// this.$confirm(
|
|
||||||
// `确定对${
|
|
||||||
// raw.data.name
|
|
||||||
// ? '[名称=' + raw.data.name + ']'
|
|
||||||
// : '[序号=' + raw.data._pageIndex + ']'
|
|
||||||
// }进行删除操作?`,
|
|
||||||
// '提示',
|
|
||||||
// {
|
|
||||||
// confirmButtonText: '确定',
|
|
||||||
// cancelButtonText: '取消',
|
|
||||||
// type: 'warning',
|
|
||||||
// }
|
|
||||||
// )
|
|
||||||
// .then(() => {
|
|
||||||
// deleteProductAttr(raw.data.id).then(({ data }) => {
|
|
||||||
// this.$message({
|
|
||||||
// message: '操作成功',
|
|
||||||
// type: 'success',
|
|
||||||
// duration: 1500,
|
|
||||||
// onClose: () => {
|
|
||||||
// this.getList();
|
|
||||||
// },
|
|
||||||
// });
|
|
||||||
// });
|
|
||||||
// })
|
|
||||||
// .catch(() => {});
|
|
||||||
// } else {
|
|
||||||
// this.addNew(raw.data.id);
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// 表单提交
|
// 表单提交
|
||||||
dataFormSubmit() {
|
dataFormSubmit() {
|
||||||
this.$refs['dataForm'].validate((valid) => {
|
this.$refs['dataForm'].validate((valid) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
// 修改的提交
|
// 修改的提交
|
||||||
if (this.dataForm.id) {
|
if (this.dataForm.id) {
|
||||||
updatePackingType(this.dataForm).then((response) => {
|
updatePackingType(this.dataForm).then((response) => {
|
||||||
this.$modal.msgSuccess('修改成功');
|
this.$modal.msgSuccess('修改成功');
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
this.$emit('refreshDataList');
|
this.$emit('refreshDataList');
|
||||||
@@ -268,7 +165,7 @@ export default {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
// 添加的提交
|
// 添加的提交
|
||||||
createPackingType(this.dataForm).then((response) => {
|
createPackingType(this.dataForm).then((response) => {
|
||||||
this.$modal.msgSuccess('新增成功');
|
this.$modal.msgSuccess('新增成功');
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
this.$emit('refreshDataList');
|
this.$emit('refreshDataList');
|
||||||
@@ -294,88 +191,32 @@ export default {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- <style scoped>
|
|
||||||
.drawer >>> .el-drawer {
|
|
||||||
border-radius: 8px 0 0 8px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer >>> .el-form-item__label {
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer >>> .el-drawer__header {
|
|
||||||
margin: 0;
|
|
||||||
padding: 32px 32px 24px;
|
|
||||||
border-bottom: 1px solid #dcdfe6;
|
|
||||||
}
|
|
||||||
.drawer >>> .el-drawer__body {
|
|
||||||
flex: 1;
|
|
||||||
height: 1px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer >>> .content {
|
|
||||||
padding: 30px 24px;
|
|
||||||
flex: 1;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
/* height: 100%; */
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer >>> .visual-part {
|
|
||||||
flex: 1 auto;
|
|
||||||
max-height: 76vh;
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: scroll;
|
|
||||||
padding-right: 10px; /* 调整滚动条样式 */
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer >>> .el-form,
|
|
||||||
.drawer >>> .attr-list {
|
|
||||||
padding: 0 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer-body__footer {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
padding: 18px;
|
|
||||||
}
|
|
||||||
</style> -->
|
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
|
|
||||||
.baseDialog .el-dialog__header {
|
.baseDialog .el-dialog__header {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
color: rgba(0, 0, 0, 0.85);
|
color: rgba(0, 0, 0, 0.85);
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
padding: 13px 24px;
|
padding: 13px 24px;
|
||||||
border-bottom: 1px solid #e9e9e9;
|
border-bottom: 1px solid #e9e9e9;
|
||||||
}
|
}
|
||||||
.baseDialog .el-dialog__header .titleStyle::before{
|
.baseDialog .el-dialog__header .titleStyle::before {
|
||||||
content: '';
|
content: '';
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 4px;
|
width: 4px;
|
||||||
height: 16px;
|
height: 16px;
|
||||||
background-color: #0B58FF;
|
background-color: #0b58ff;
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
position: relative;
|
position: relative;
|
||||||
top: 2px;
|
top: 2px;
|
||||||
}
|
}
|
||||||
.baseDialog .el-dialog__body {
|
.baseDialog .el-dialog__body {
|
||||||
padding-left: 24px;
|
padding-left: 24px;
|
||||||
padding-right: 24px;
|
padding-right: 24px;
|
||||||
}
|
}
|
||||||
.baseDialog .btnTextStyle {
|
.baseDialog .btnTextStyle {
|
||||||
letter-spacing:6px;
|
letter-spacing: 6px;
|
||||||
padding: 9px 10px 9px 16px;
|
padding: 9px 10px 9px 16px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,348 +1,368 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="choicepart-container">
|
<div class="choicepart-container">
|
||||||
<navbar />
|
<navbar />
|
||||||
<div class="choicepart-wrapper">
|
<div class="choicepart-wrapper">
|
||||||
<div class="choicepart-box" id="choicepartBox" :style="'transform:scale('+scale+');width:1710px;height:538px;'" v-show="showItem">
|
<div
|
||||||
<div class="choicepart-line1">
|
class="choicepart-box"
|
||||||
<div
|
id="choicepartBox"
|
||||||
v-for="(item, index) in menuArr1"
|
:style="'transform:scale(' + scale + ')'"
|
||||||
:key="index"
|
style="width: 1710px; height: 538px"
|
||||||
class="choicepart-item"
|
v-show="showItem">
|
||||||
@click="handelClick(item, item.choicepart)"
|
<div class="choicepart-line1">
|
||||||
:style="{opacity: item.visible?1:0.4, pointerEvents:item.visible?'auto':'none'}"
|
<div
|
||||||
>
|
v-for="(item, index) in menuArr1"
|
||||||
<div>
|
:key="index"
|
||||||
<img :src="require(`../../assets/images/choicepart/${item.name}.png`)" alt="">
|
class="choicepart-item"
|
||||||
</div>
|
@click="handelClick(item, item.choicepart)"
|
||||||
<div class="choicepart-item-title">{{item.meta.title}}</div>
|
:style="{
|
||||||
</div>
|
opacity: item.visible ? 1 : 0.4,
|
||||||
</div>
|
pointerEvents: item.visible ? 'auto' : 'none',
|
||||||
<div class="choicepart-line2">
|
}">
|
||||||
<div
|
<div>
|
||||||
v-for="(item, index) in menuArr2"
|
<img
|
||||||
:key="index"
|
:src="
|
||||||
class="choicepart-item"
|
require(`../../assets/images/choicepart/${item.name}.png`)
|
||||||
@click="handelClick(item, item.choicepart)"
|
"
|
||||||
:style="{opacity: item.visible?1:0.4, pointerEvents:item.visible?'auto':'none'}"
|
alt="" />
|
||||||
>
|
</div>
|
||||||
<div>
|
<div class="choicepart-item-title">{{ item.meta.title }}</div>
|
||||||
<img :src="require(`../../assets/images/choicepart/${item.name}.png`)" alt="">
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="choicepart-item-title">{{item.meta.title}}</div>
|
<div class="choicepart-line2">
|
||||||
</div>
|
<div
|
||||||
</div>
|
v-for="(item, index) in menuArr2"
|
||||||
</div>
|
:key="index"
|
||||||
</div>
|
class="choicepart-item"
|
||||||
<div class="choicepart-footer">© 中建材智能自动化研究院有限公司</div>
|
@click="handelClick(item, item.choicepart)"
|
||||||
</div>
|
:style="{
|
||||||
|
opacity: item.visible ? 1 : 0.4,
|
||||||
|
pointerEvents: item.visible ? 'auto' : 'none',
|
||||||
|
}">
|
||||||
|
<div>
|
||||||
|
<img
|
||||||
|
:src="
|
||||||
|
require(`../../assets/images/choicepart/${item.name}.png`)
|
||||||
|
"
|
||||||
|
alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="choicepart-item-title">{{ item.meta.title }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="choicepart-footer">© 中建材智能自动化研究院有限公司</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import Navbar from './components/Navbar'
|
import Navbar from './components/Navbar';
|
||||||
import { debounce } from '@/utils/debounce'
|
import { debounce } from '@/utils/debounce';
|
||||||
export default {
|
export default {
|
||||||
components: { Navbar },
|
components: { Navbar },
|
||||||
name: 'choicePart',
|
name: 'choicePart',
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
boxReset: '',
|
scale: 1,
|
||||||
scale: 1,
|
menuArr1: [
|
||||||
menuArr1: [
|
{
|
||||||
{
|
name: 'Core',
|
||||||
name: 'Core',
|
title: '基础核心',
|
||||||
title: '基础核心',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'Order',
|
||||||
name: 'Order',
|
title: '订单管理',
|
||||||
title: '订单管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'Equipment',
|
||||||
name: 'Equipment',
|
title: '设备管理',
|
||||||
title: '设备管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'Group',
|
||||||
name: 'Group',
|
title: '班组管理',
|
||||||
title: '班组管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'Quality',
|
||||||
name: 'Quality',
|
title: '质量管理',
|
||||||
title: '质量管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'Warehouse',
|
||||||
name: 'Warehouse',
|
title: '仓库管理',
|
||||||
title: '仓库管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'Energy',
|
||||||
name: 'Energy',
|
title: '能源管理',
|
||||||
title: '能源管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'Packaging',
|
||||||
name: 'Packaging',
|
title: '包装管理',
|
||||||
title: '包装管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
}
|
],
|
||||||
],
|
menuArr2: [
|
||||||
menuArr2: [
|
{
|
||||||
{
|
name: 'Material',
|
||||||
name: 'Material',
|
title: '物料管理',
|
||||||
title: '物料管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'Extend',
|
||||||
name: 'Extend',
|
title: '工艺管理',
|
||||||
title: '工艺管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
// {
|
||||||
// {
|
// name: 'Delivery',
|
||||||
// name: 'Delivery',
|
// title: '成品发货',
|
||||||
// title: '成品发货',
|
// visible: false,
|
||||||
// visible: false,
|
// meta: {
|
||||||
// meta: {
|
// title: ''
|
||||||
// title: ''
|
// }
|
||||||
// }
|
// },
|
||||||
// },
|
{
|
||||||
{
|
name: 'Report',
|
||||||
name: 'Report',
|
title: '报表管理',
|
||||||
title: '报表管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'Cost',
|
||||||
name: 'Cost',
|
title: '成本管理',
|
||||||
title: '成本管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'SafetyEnvironmental',
|
||||||
name: 'SafetyEnvironmental',
|
title: '安环管理',
|
||||||
title: '安环管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'Databoard',
|
||||||
name: 'Databoard',
|
title: '数据驾驶舱',
|
||||||
title: '数据驾驶舱',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'System',
|
||||||
name: 'System',
|
title: '系统管理',
|
||||||
title: '系统管理',
|
visible: false,
|
||||||
visible: false,
|
meta: {
|
||||||
meta: {
|
title: '',
|
||||||
title: ''
|
},
|
||||||
}
|
},
|
||||||
}
|
],
|
||||||
],
|
showItem: false,
|
||||||
showItem: false
|
};
|
||||||
}
|
},
|
||||||
},
|
// computed:{
|
||||||
// computed:{
|
// ...mapGetters(['sidebarRouters'])
|
||||||
// ...mapGetters(['sidebarRouters'])
|
// },
|
||||||
// },
|
mounted() {
|
||||||
mounted() {
|
this.getMsg();
|
||||||
this.getMsg()
|
this.boxReset();
|
||||||
this.boxReset = debounce(() => {
|
window.addEventListener('resize', this.boxReset);
|
||||||
this.resetSize()
|
},
|
||||||
}, 300)
|
destroyed() {
|
||||||
this.boxReset()
|
window.removeEventListener('resize', this.boxReset);
|
||||||
window.addEventListener('resize', () => {
|
},
|
||||||
this.boxReset()
|
methods: {
|
||||||
})
|
boxReset() {
|
||||||
},
|
debounce(() => {
|
||||||
methods: {
|
this.resetSize();
|
||||||
getMsg() {
|
}, 300)();
|
||||||
let menuList = this.$store.state.permission.sidebarRouters
|
},
|
||||||
console.log(menuList)
|
getMsg() {
|
||||||
if (menuList.length > 0) {
|
let menuList = this.$store.state.permission.sidebarRouters;
|
||||||
for (let i = 0; i < menuList.length; i ++) {
|
console.log(menuList);
|
||||||
for (let k = 0; k < 8; k++) {
|
if (menuList.length > 0) {
|
||||||
if (menuList[i].name === this.menuArr1[k].name) {
|
for (let i = 0; i < menuList.length; i++) {
|
||||||
this.menuArr1[k].visible = true
|
for (let k = 0; k < 8; k++) {
|
||||||
this.menuArr1[k].id = menuList[i].id
|
if (menuList[i].name === this.menuArr1[k].name) {
|
||||||
this.menuArr1[k].choicepart = i
|
this.menuArr1[k].visible = true;
|
||||||
this.menuArr1[k].children = menuList[i].children
|
this.menuArr1[k].id = menuList[i].id;
|
||||||
this.menuArr1[k].meta = menuList[i].meta
|
this.menuArr1[k].choicepart = i;
|
||||||
}
|
this.menuArr1[k].children = menuList[i].children;
|
||||||
}
|
this.menuArr1[k].meta = menuList[i].meta;
|
||||||
for (let j = 0; j < 7; j++) {
|
}
|
||||||
if (menuList[i].name === this.menuArr2[j].name) {
|
}
|
||||||
this.menuArr2[j].visible = true
|
for (let j = 0; j < 7; j++) {
|
||||||
this.menuArr2[j].id = menuList[i].id
|
if (menuList[i].name === this.menuArr2[j].name) {
|
||||||
this.menuArr2[j].choicepart = i
|
this.menuArr2[j].visible = true;
|
||||||
this.menuArr2[j].children = menuList[i].children
|
this.menuArr2[j].id = menuList[i].id;
|
||||||
this.menuArr2[j].meta = menuList[i].meta
|
this.menuArr2[j].choicepart = i;
|
||||||
}
|
this.menuArr2[j].children = menuList[i].children;
|
||||||
}
|
this.menuArr2[j].meta = menuList[i].meta;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
console.log(this.menuArr1)
|
}
|
||||||
console.log(this.menuArr2)
|
}
|
||||||
},
|
console.log(this.menuArr1);
|
||||||
handelClick(item, index) {
|
console.log(this.menuArr2);
|
||||||
// this.$router.push({name: 'SystemUser'})
|
},
|
||||||
this.$store.dispatch('app/setChoicepart', index)
|
handelClick(item, index) {
|
||||||
this.toRouter(item)
|
// this.$router.push({name: 'SystemUser'})
|
||||||
// if (item.meta.unuse) {
|
this.$store.dispatch('app/setChoicepart', index);
|
||||||
// this.$message.warning(this.$t('暂无数据'))
|
this.toRouter(item);
|
||||||
// } else {
|
// if (item.meta.unuse) {
|
||||||
// this.toRouter(item)
|
// this.$message.warning(this.$t('暂无数据'))
|
||||||
// }
|
// } else {
|
||||||
},
|
// this.toRouter(item)
|
||||||
toRouter(item) {
|
// }
|
||||||
console.log(item)
|
},
|
||||||
if (item.children) {
|
toRouter(item) {
|
||||||
this.toRouter(item.children[0])
|
console.log(item);
|
||||||
} else {
|
if (item.children) {
|
||||||
this.$router.push({ name: item.name })
|
this.toRouter(item.children[0]);
|
||||||
}
|
} else {
|
||||||
},
|
this.$router.push({ name: item.name });
|
||||||
resetSize() {
|
}
|
||||||
let _this = this
|
},
|
||||||
_this.showItem = false
|
resetSize() {
|
||||||
_this.loading = true
|
let _this = this;
|
||||||
let choicepartBox = document.querySelector('#choicepartBox')
|
_this.showItem = false;
|
||||||
let rw = parseFloat(window.innerWidth)
|
_this.loading = true;
|
||||||
let rh = parseFloat(window.innerHeight)
|
let choicepartBox = document.querySelector('#choicepartBox');
|
||||||
let bw = parseFloat(choicepartBox.style.width)
|
let rw = parseFloat(window.innerWidth);
|
||||||
let bh = parseFloat(choicepartBox.style.height)
|
let rh = parseFloat(window.innerHeight);
|
||||||
let wx = 0.82/(bw / rw)
|
let bw = parseFloat(choicepartBox.style.width);
|
||||||
let hx = 0.56/(bh / rh)
|
let bh = parseFloat(choicepartBox.style.height);
|
||||||
_this.scale = wx > hx ? hx : wx
|
let wx = 0.82 / (bw / rw);
|
||||||
setTimeout(_this.showItemFun, 700)
|
let hx = 0.56 / (bh / rh);
|
||||||
},
|
_this.scale = wx > hx ? hx : wx;
|
||||||
showItemFun() {
|
setTimeout(_this.showItemFun, 700);
|
||||||
this.loading = false
|
},
|
||||||
this.showItem = true
|
showItemFun() {
|
||||||
}
|
this.loading = false;
|
||||||
},
|
this.showItem = true;
|
||||||
beforeDestroy() {
|
},
|
||||||
this.showItem = false
|
},
|
||||||
}
|
beforeDestroy() {
|
||||||
}
|
this.showItem = false;
|
||||||
|
},
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang='scss' scoped>
|
<style lang='scss' scoped>
|
||||||
.choicepart-container {
|
.choicepart-container {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
background: url('../../assets/images/choicepart/choicepart-back.png') repeat;
|
background: url('../../assets/images/choicepart/choicepart-back.png') repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
.choicepart-wrapper {
|
.choicepart-wrapper {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
height: calc(100vh - 94px);
|
height: calc(100vh - 94px);
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
.choicepart-box {
|
.choicepart-box {
|
||||||
// transition: all 0.3s linear;
|
// transition: all 0.3s linear;
|
||||||
.choicepart-line1 {
|
.choicepart-line1 {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin-bottom: 80px;
|
margin-bottom: 80px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: row nowrap;
|
flex-flow: row nowrap;
|
||||||
}
|
}
|
||||||
.choicepart-line2 {
|
.choicepart-line2 {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: row nowrap;
|
flex-flow: row nowrap;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
.choicepart-item {
|
.choicepart-item {
|
||||||
width: 184px;
|
width: 184px;
|
||||||
height: 224px;
|
height: 224px;
|
||||||
background: url('../../assets/images/choicepart/choice-item-back.png') no-repeat;
|
background: url('../../assets/images/choicepart/choice-item-back.png')
|
||||||
background-size: 100% 100%;
|
no-repeat;
|
||||||
border-radius: 5px;
|
background-size: 100% 100%;
|
||||||
overflow: hidden;
|
border-radius: 5px;
|
||||||
cursor: pointer;
|
overflow: hidden;
|
||||||
position: relative;
|
cursor: pointer;
|
||||||
margin: 0 20px;
|
position: relative;
|
||||||
img {
|
margin: 0 20px;
|
||||||
width: 184px;
|
img {
|
||||||
height: 224px;
|
width: 184px;
|
||||||
}
|
height: 224px;
|
||||||
.choicepart-item-title {
|
}
|
||||||
overflow: hidden;
|
.choicepart-item-title {
|
||||||
padding: 0 10px;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
padding: 0 10px;
|
||||||
white-space: nowrap;
|
text-overflow: ellipsis;
|
||||||
position: absolute;
|
white-space: nowrap;
|
||||||
bottom: 0;
|
position: absolute;
|
||||||
left: 2px;
|
bottom: 0;
|
||||||
right: 2px;
|
left: 2px;
|
||||||
text-align: center;
|
right: 2px;
|
||||||
color: #fff;
|
text-align: center;
|
||||||
font-size: 16px;
|
color: #fff;
|
||||||
line-height: 40px;
|
font-size: 16px;
|
||||||
height: 40px;
|
line-height: 40px;
|
||||||
letter-spacing: 2px;
|
height: 40px;
|
||||||
background-color: rgba($color: #0b58ff, $alpha: 0.45);
|
letter-spacing: 2px;
|
||||||
}
|
background-color: rgba($color: #0b58ff, $alpha: 0.45);
|
||||||
}
|
}
|
||||||
.choicepart-item:hover {
|
}
|
||||||
.choicepart-item-title {
|
.choicepart-item:hover {
|
||||||
background-color: rgba($color: #0b58ff, $alpha: 1);
|
.choicepart-item-title {
|
||||||
}
|
background-color: rgba($color: #0b58ff, $alpha: 1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.choicepart-footer {
|
}
|
||||||
position: absolute;
|
.choicepart-footer {
|
||||||
width: 100%;
|
position: absolute;
|
||||||
color: #C7C7C7;
|
width: 100%;
|
||||||
user-select: none;
|
color: #c7c7c7;
|
||||||
font-size: 12px;
|
user-select: none;
|
||||||
letter-spacing: 1px;
|
font-size: 12px;
|
||||||
height: 30px;
|
letter-spacing: 1px;
|
||||||
display: grid;
|
height: 30px;
|
||||||
place-content: center;
|
display: grid;
|
||||||
bottom: 0;
|
place-content: center;
|
||||||
opacity: 0.5;
|
bottom: 0;
|
||||||
}
|
opacity: 0.5;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
@@ -125,7 +125,7 @@ export default {
|
|||||||
// name: 'reset',
|
// name: 'reset',
|
||||||
// },
|
// },
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:core-factory:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:core-factory:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:core-factory:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -1,22 +1,26 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<NotMsg v-show="notMsg"/>
|
<NotMsg v-show="notMsg" />
|
||||||
<div id='gasChart' class="gas-chart" style="width:600px;height:200px;" v-show='!notMsg'></div>
|
<div
|
||||||
|
id="gasChart"
|
||||||
|
class="gas-chart"
|
||||||
|
style="width: 600px; height: 200px"
|
||||||
|
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';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'GasChart',
|
name: 'GasChart',
|
||||||
mixins: [resize],
|
mixins: [resize],
|
||||||
components:{ NotMsg },
|
components: { NotMsg },
|
||||||
props: {
|
props: {
|
||||||
chartType: '', // 能源类型
|
chartType: '', // 能源类型
|
||||||
chartTime: ''
|
chartTime: '',
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
const colors = [
|
const colors = [
|
||||||
@@ -31,159 +35,170 @@ export default {
|
|||||||
];
|
];
|
||||||
return {
|
return {
|
||||||
chart: null,
|
chart: null,
|
||||||
notMsg:false
|
notMsg: false,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
gasChartMsg() {
|
gasChartMsg() {
|
||||||
return this.$store.state.websocket.sumGasInfo
|
return this.$store.state.websocket.sumGasInfo;
|
||||||
},
|
},
|
||||||
energyWeekTrend() {
|
energyWeekTrend() {
|
||||||
return this.$store.state.websocket.energyWeekTrend
|
return this.$store.state.websocket.energyWeekTrend;
|
||||||
},
|
},
|
||||||
energyMonthTrend() {
|
energyMonthTrend() {
|
||||||
return this.$store.state.websocket.energyMonthTrend
|
return this.$store.state.websocket.energyMonthTrend;
|
||||||
},
|
},
|
||||||
energyYearTrend() {
|
energyYearTrend() {
|
||||||
return this.$store.state.websocket.energyYearTrend
|
return this.$store.state.websocket.energyYearTrend;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
energyWeekTrend: {// 监听周电能,更新图
|
energyWeekTrend: {
|
||||||
|
// 监听周电能,更新图
|
||||||
handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
if (this.chartTime === '周' && this.chartType === '电耗能') {
|
if (this.chartTime === '周' && this.chartType === '电耗能') {
|
||||||
this.updateChart()
|
this.updateChart();
|
||||||
this.$emit('emitFun')
|
this.$emit('emitFun');
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
energyMonthTrend: {// 监听月电能,更新图
|
energyMonthTrend: {
|
||||||
|
// 监听月电能,更新图
|
||||||
handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
if (this.chartTime === '月' && this.chartType === '电耗能') {
|
if (this.chartTime === '月' && this.chartType === '电耗能') {
|
||||||
this.updateChart()
|
this.updateChart();
|
||||||
this.$emit('emitFun')
|
this.$emit('emitFun');
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
energyYearTrend: {// 监听年电能,更新图
|
energyYearTrend: {
|
||||||
|
// 监听年电能,更新图
|
||||||
handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
if (this.chartTime === '年' && this.chartType === '电耗能') {
|
if (this.chartTime === '年' && this.chartType === '电耗能') {
|
||||||
this.updateChart()
|
this.updateChart();
|
||||||
this.$emit('emitFun')
|
this.$emit('emitFun');
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
gasChartMsg: {// 监听天然气,更新图
|
gasChartMsg: {
|
||||||
|
// 监听天然气,更新图
|
||||||
handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
if (this.chartType === '天然气I' || this.chartType === '天然气II') {
|
if (this.chartType === '天然气I' || this.chartType === '天然气II') {
|
||||||
this.updateChart()
|
this.updateChart();
|
||||||
this.$emit('emitFun')
|
this.$emit('emitFun');
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
chartTime: {// 监听时间变化,更新图
|
chartTime: {
|
||||||
|
// 监听时间变化,更新图
|
||||||
handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
this.updateChart()
|
this.updateChart();
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
chartType: {// 监听能源类型变化,更新图
|
chartType: {
|
||||||
|
// 监听能源类型变化,更新图
|
||||||
handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
this.updateChart()
|
this.updateChart();
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.$el.addEventListener('resize', () => {
|
this.$el.addEventListener('resize', () => {
|
||||||
console.log('resziing.....');
|
console.log('resziing.....');
|
||||||
});
|
});
|
||||||
this.updateChart()
|
this.updateChart();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
updateChart() {
|
updateChart() {
|
||||||
let gasName = ''
|
let gasName = '';
|
||||||
const colors = ['#FFCB59'];
|
const colors = ['#FFCB59'];
|
||||||
let temp = []
|
let temp = [];
|
||||||
let seriesData = []
|
let seriesData = [];
|
||||||
let xData = []
|
let xData = [];
|
||||||
let yData = []
|
let yData = [];
|
||||||
switch (this.chartType) {
|
switch (this.chartType) {
|
||||||
case '电耗能':{
|
case '电耗能': {
|
||||||
gasName = '电耗能'
|
gasName = '电耗能';
|
||||||
if (this.chartTime === '周') {
|
if (this.chartTime === '周') {
|
||||||
temp = this.energyWeekTrend || []
|
temp = this.energyWeekTrend || [];
|
||||||
}else if(this.chartTime === '月') {
|
} else if (this.chartTime === '月') {
|
||||||
temp = this.energyMonthTrend || []
|
temp = this.energyMonthTrend || [];
|
||||||
}else{
|
} else {
|
||||||
temp = this.energyYearTrend || []
|
temp = this.energyYearTrend || [];
|
||||||
}
|
}
|
||||||
temp && temp.map(i => {
|
temp &&
|
||||||
xData.push(i.time)
|
temp.map((i) => {
|
||||||
yData.push(i.qty)
|
xData.push(i.time);
|
||||||
})
|
yData.push(i.qty);
|
||||||
|
});
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case '天然气I':{
|
case '天然气I': {
|
||||||
if (this.chartTime === '周') {
|
if (this.chartTime === '周') {
|
||||||
yData = this.gasChartMsg.hisSumGas1For7Day || []
|
yData = this.gasChartMsg.hisSumGas1For7Day || [];
|
||||||
}else if(this.chartTime === '月') {
|
} else if (this.chartTime === '月') {
|
||||||
yData = this.gasChartMsg.sumGas1ForMonth || []
|
yData = this.gasChartMsg.sumGas1ForMonth || [];
|
||||||
}else{
|
} else {
|
||||||
yData = this.gasChartMsg.sumGas1ForYear || []
|
yData = this.gasChartMsg.sumGas1ForYear || [];
|
||||||
}
|
}
|
||||||
gasName = '天然气I'
|
gasName = '天然气I';
|
||||||
xData = this.getXdata()
|
xData = this.getXdata();
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
default:
|
default:
|
||||||
gasName = '天然气II'
|
gasName = '天然气II';
|
||||||
if (this.chartTime === '周') {
|
if (this.chartTime === '周') {
|
||||||
yData = this.gasChartMsg.hisSumGas2For7Day || []
|
yData = this.gasChartMsg.hisSumGas2For7Day || [];
|
||||||
}else if(this.chartTime === '月') {
|
} else if (this.chartTime === '月') {
|
||||||
yData = this.gasChartMsg.sumGas2ForMonth || []
|
yData = this.gasChartMsg.sumGas2ForMonth || [];
|
||||||
}else{
|
} else {
|
||||||
yData = this.gasChartMsg.sumGas2ForYear || []
|
yData = this.gasChartMsg.sumGas2ForYear || [];
|
||||||
}
|
}
|
||||||
xData = this.getXdata()
|
xData = this.getXdata();
|
||||||
}
|
}
|
||||||
if (yData.length === 0) {
|
if (yData.length === 0) {
|
||||||
this.notMsg = true
|
this.notMsg = true;
|
||||||
return
|
return;
|
||||||
} else {
|
} else {
|
||||||
this.notMsg = false
|
this.notMsg = false;
|
||||||
}
|
}
|
||||||
if (yData.length == 0) {
|
if (yData.length == 0) {
|
||||||
seriesData = []
|
seriesData = [];
|
||||||
}else {
|
} else {
|
||||||
seriesData = [{
|
yData = yData.map((item) => {
|
||||||
name: gasName,
|
return (item = Number(item.toFixed(2)));
|
||||||
data: yData,
|
});
|
||||||
type: "line",
|
seriesData = [
|
||||||
areaStyle: {
|
{
|
||||||
|
name: gasName,
|
||||||
|
data: yData,
|
||||||
|
type: 'line',
|
||||||
|
areaStyle: {
|
||||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||||
{ offset: 0, color: '#FFCB59' + "40" },
|
{ offset: 0, color: '#FFCB59' + '40' },
|
||||||
{ offset: 0.5, color: '#FFCB59' + "20" },
|
{ offset: 0.5, color: '#FFCB59' + '20' },
|
||||||
{ offset: 1, color: '#FFCB59' + "00" },
|
{ offset: 1, color: '#FFCB59' + '00' },
|
||||||
]),
|
]),
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
width: 1,
|
||||||
|
},
|
||||||
|
symbol: 'circle',
|
||||||
|
symbolSize: 5,
|
||||||
|
emphasis: {
|
||||||
|
focus: 'series',
|
||||||
|
},
|
||||||
},
|
},
|
||||||
lineStyle: {
|
];
|
||||||
width: 1
|
|
||||||
},
|
|
||||||
symbol: 'circle',
|
|
||||||
symbolSize: 5,
|
|
||||||
emphasis: {
|
|
||||||
focus: 'series'
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
|
|
||||||
}
|
}
|
||||||
// 绘图
|
// 绘图
|
||||||
if (
|
if (
|
||||||
this.chart !== null &&
|
this.chart !== null &&
|
||||||
this.chart !== '' &&
|
this.chart !== '' &&
|
||||||
this.chart !== undefined
|
this.chart !== undefined
|
||||||
) {
|
) {
|
||||||
this.chart.dispose() // 页面多次刷新会出现警告,Dom已经初始化了一个实例,这是销毁实例
|
this.chart.dispose(); // 页面多次刷新会出现警告,Dom已经初始化了一个实例,这是销毁实例
|
||||||
}
|
}
|
||||||
this.chart = echarts.init(document.getElementById('gasChart'));
|
this.chart = echarts.init(document.getElementById('gasChart'));
|
||||||
var option = {
|
var option = {
|
||||||
color: colors,
|
color: colors,
|
||||||
@@ -204,7 +219,7 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
name: this.chartType === '电耗能'?'单位kwh':'单位Nm³',
|
name: this.chartType === '电耗能' ? '单位kwh' : '单位Nm³',
|
||||||
nameTextStyle: {
|
nameTextStyle: {
|
||||||
color: '#fff',
|
color: '#fff',
|
||||||
fontSize: 10,
|
fontSize: 10,
|
||||||
@@ -230,10 +245,10 @@ export default {
|
|||||||
series: seriesData,
|
series: seriesData,
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: 'axis',
|
trigger: 'axis',
|
||||||
className: "gas-tooltip"
|
className: 'gas-tooltip',
|
||||||
},
|
},
|
||||||
}
|
};
|
||||||
option && this.chart.setOption(option)
|
option && this.chart.setOption(option);
|
||||||
},
|
},
|
||||||
getXdata() {
|
getXdata() {
|
||||||
const today = new Date();
|
const today = new Date();
|
||||||
@@ -242,31 +257,39 @@ export default {
|
|||||||
let days = 30;
|
let days = 30;
|
||||||
if (this.chartTime === '周') {
|
if (this.chartTime === '周') {
|
||||||
return Array(7)
|
return Array(7)
|
||||||
.fill(1)
|
.fill(1)
|
||||||
.map((_, index) => {
|
.map((_, index) => {
|
||||||
const today = new Date();
|
const today = new Date();
|
||||||
const dtimestamp = today - (index+1) * 24 * 60 * 60 * 1000;
|
const dtimestamp = today - (index + 1) * 24 * 60 * 60 * 1000;
|
||||||
return `${new Date(dtimestamp).getMonth()+1}.${new Date(dtimestamp).getDate()}`;}).reverse()
|
return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
|
||||||
}else if (this.chartTime == "月") {
|
dtimestamp
|
||||||
|
).getDate()}`;
|
||||||
|
})
|
||||||
|
.reverse();
|
||||||
|
} else if (this.chartTime == '月') {
|
||||||
if (currentMonth in [1, 3, 5, 7, 8, 10, 12]) {
|
if (currentMonth in [1, 3, 5, 7, 8, 10, 12]) {
|
||||||
days = 31;
|
days = 31;
|
||||||
} else if (currentMonth == 2) {
|
} else if (currentMonth == 2) {
|
||||||
days = this.isLeapYear(currentYear) ? 29 : 28;
|
days = this.isLeapYear(currentYear) ? 29 : 28;
|
||||||
}
|
}
|
||||||
return Array(days)
|
return Array(days)
|
||||||
.fill(1)
|
.fill(1)
|
||||||
.map((_, index) => {
|
.map((_, index) => {
|
||||||
return `${currentMonth}.${days - index}`;}).reverse()
|
return `${currentMonth}.${days - index}`;
|
||||||
|
})
|
||||||
|
.reverse();
|
||||||
} else {
|
} else {
|
||||||
return Array(12)
|
return Array(12)
|
||||||
.fill(1)
|
.fill(1)
|
||||||
.map((_, index) => {
|
.map((_, index) => {
|
||||||
return `${12 - index}`;}).reverse()
|
return `${12 - index}`;
|
||||||
|
})
|
||||||
|
.reverse();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
isLeapYear(year) {
|
isLeapYear(year) {
|
||||||
return year % 400 == 0 || (year % 4 == 0 && year % 100 != 0);
|
return year % 400 == 0 || (year % 4 == 0 && year % 100 != 0);
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -278,12 +301,12 @@ export default {
|
|||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<style>
|
<style>
|
||||||
.gas-tooltip {
|
.gas-tooltip {
|
||||||
background: #0a2b4f77 !important;
|
background: #0a2b4f77 !important;
|
||||||
border: none !important;
|
border: none !important;
|
||||||
backdrop-filter: blur(12px);
|
backdrop-filter: blur(12px);
|
||||||
}
|
}
|
||||||
.gas-tooltip * {
|
.gas-tooltip * {
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,68 +1,89 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<NotMsg v-show="notMsg"/>
|
<NotMsg v-show="notMsg" />
|
||||||
<div id="israChart" class="isra-chart" style="width:600px;height:390px;" v-show='!notMsg'></div>
|
<div
|
||||||
|
id="israChart"
|
||||||
|
class="isra-chart"
|
||||||
|
style="width: 600px; height: 390px"
|
||||||
|
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';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'ISRAChart',
|
name: 'ISRAChart',
|
||||||
mixins: [resize],
|
mixins: [resize],
|
||||||
components:{ NotMsg },
|
components: { NotMsg },
|
||||||
props: {},
|
props: {},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
chart: null,
|
chart: null,
|
||||||
notMsg:true,
|
notMsg: true,
|
||||||
colors:['#2760ff', '#518eec', '#0ee8e4', '#ddb523'],
|
colors: ['#2760ff', '#518eec', '#0ee8e4', '#ddb523'],
|
||||||
chartData: []
|
chartData: [],
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
activated() {
|
activated() {},
|
||||||
},
|
|
||||||
computed: {
|
computed: {
|
||||||
israChartMsg() {
|
israChartMsg() {
|
||||||
return this.$store.state.websocket.israKiln
|
return this.$store.state.websocket.israKiln;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
israChartMsg: {
|
israChartMsg: {
|
||||||
handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
this.chartData = newVal || []
|
this.chartData = newVal || [];
|
||||||
this.updateChart()
|
this.updateChart();
|
||||||
this.$emit('emitFun')
|
this.$emit('emitFun');
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
getEqualNewlineString(params, length) {
|
||||||
|
let text = '';
|
||||||
|
let count = Math.ceil(params.length / length); // 向上取整数
|
||||||
|
// 一行展示length个
|
||||||
|
if (count > 1) {
|
||||||
|
for (let z = 1; z <= count; z++) {
|
||||||
|
text += params.substr((z - 1) * length, length);
|
||||||
|
if (z < count) {
|
||||||
|
text += '\n';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
text += params.substr(0, length);
|
||||||
|
}
|
||||||
|
return text;
|
||||||
|
},
|
||||||
updateChart() {
|
updateChart() {
|
||||||
console.log('update')
|
console.log('update');
|
||||||
let num = 0
|
let num = 0;
|
||||||
this.chartData && this.chartData.length > 0 && this.chartData.map(i => {
|
this.chartData &&
|
||||||
num+=i.num
|
this.chartData.length > 0 &&
|
||||||
})
|
this.chartData.map((i) => {
|
||||||
|
num += i.num;
|
||||||
|
});
|
||||||
if (
|
if (
|
||||||
this.chart !== null &&
|
this.chart !== null &&
|
||||||
this.chart !== '' &&
|
this.chart !== '' &&
|
||||||
this.chart !== undefined
|
this.chart !== undefined
|
||||||
) {
|
) {
|
||||||
this.chart.dispose()
|
this.chart.dispose();
|
||||||
}
|
}
|
||||||
if (this.chartData && this.chartData.length > 0) {
|
if (this.chartData && this.chartData.length > 0) {
|
||||||
this.notMsg = false
|
this.notMsg = false;
|
||||||
} else {
|
} else {
|
||||||
this.notMsg = true
|
this.notMsg = true;
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
this.chart = echarts.init(document.getElementById('israChart'));
|
this.chart = echarts.init(document.getElementById('israChart'));
|
||||||
var option = {
|
var option = {
|
||||||
color:this.colors,
|
color: this.colors,
|
||||||
title:{
|
title: {
|
||||||
text: num,
|
text: num,
|
||||||
subtext: '总数',
|
subtext: '总数',
|
||||||
top: '32%',
|
top: '32%',
|
||||||
@@ -81,55 +102,92 @@ export default {
|
|||||||
bottom: '2%',
|
bottom: '2%',
|
||||||
left: 'center',
|
left: 'center',
|
||||||
itemWidth: 18,
|
itemWidth: 18,
|
||||||
itemHeight: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)=>({
|
data:
|
||||||
name:item.name,
|
this.chartData &&
|
||||||
itemStyle:{
|
this.chartData.length > 0 &&
|
||||||
color: this.colors[index%4]
|
this.chartData.map((item, index) => ({
|
||||||
}
|
name: item.name,
|
||||||
}))
|
itemStyle: {
|
||||||
|
color: this.colors[index % 4],
|
||||||
|
},
|
||||||
|
})),
|
||||||
},
|
},
|
||||||
series:[{
|
series: [
|
||||||
|
{
|
||||||
name: 'ISRA缺陷检测',
|
name: 'ISRA缺陷检测',
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
center: ['50%', '40%'],
|
center: ['50%', '40%'],
|
||||||
radius: ['45%', '70%'],
|
radius: ['45%', '70%'],
|
||||||
avoidLabelOverlap: true,
|
avoidLabelOverlap: true,
|
||||||
|
// label: {
|
||||||
|
// show: true,
|
||||||
|
// },
|
||||||
|
// labelLine: {
|
||||||
|
// show: true,
|
||||||
|
// },
|
||||||
label: {
|
label: {
|
||||||
show: false
|
show: true,
|
||||||
|
normal: {
|
||||||
|
alignTo: 'labelLine',
|
||||||
|
margin: 10,
|
||||||
|
edgeDistance: 10,
|
||||||
|
lineHeight: 16,
|
||||||
|
formatter: (params) => {
|
||||||
|
//调用自定义显示格式
|
||||||
|
return this.getEqualNewlineString(
|
||||||
|
params.value + ' | ' + params.percent.toFixed(0) + '%'
|
||||||
|
);
|
||||||
|
},
|
||||||
|
textStyle: {
|
||||||
|
// 提示文字的样式
|
||||||
|
// color: '#595959',
|
||||||
|
fontSize: 16,
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
labelLine: {
|
labelLine: {
|
||||||
show: true,
|
show: true,
|
||||||
|
length: 25,
|
||||||
|
length2: 10,
|
||||||
},
|
},
|
||||||
data: this.chartData && this.chartData.length > 0 && this.chartData.map((item, index) => ({
|
data:
|
||||||
name:item.name,
|
this.chartData &&
|
||||||
value: item.num,
|
this.chartData.length > 0 &&
|
||||||
itemStyle:{
|
this.chartData.map((item, index) => ({
|
||||||
color:{
|
name: item.name,
|
||||||
type: 'linear',
|
value: item.num,
|
||||||
x: 1,
|
label: {
|
||||||
y: 1,
|
color: this.colors[index % 4],
|
||||||
x2: 0,
|
},
|
||||||
y2: 0,
|
itemStyle: {
|
||||||
global: false,
|
color: {
|
||||||
colorStops:[
|
type: 'linear',
|
||||||
{offset: 0,color: this.colors[index%4]},
|
x: 1,
|
||||||
{offset: 1,color: this.colors[index%4]+'33'}
|
y: 1,
|
||||||
]
|
x2: 0,
|
||||||
}
|
y2: 0,
|
||||||
}
|
global: false,
|
||||||
}))}],
|
colorStops: [
|
||||||
tooltip: {
|
{ offset: 0, color: this.colors[index % 4] },
|
||||||
trigger: 'item',
|
{ offset: 1, color: this.colors[index % 4] + '33' },
|
||||||
className: "isra-chart-tooltip"
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
})),
|
||||||
},
|
},
|
||||||
}
|
],
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'item',
|
||||||
|
className: 'isra-chart-tooltip',
|
||||||
|
},
|
||||||
|
};
|
||||||
this.chart.setOption(option);
|
this.chart.setOption(option);
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -141,12 +199,12 @@ export default {
|
|||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<style>
|
<style>
|
||||||
.isra-chart-tooltip {
|
.isra-chart-tooltip {
|
||||||
background: #0a2b4f77 !important;
|
background: #0a2b4f77 !important;
|
||||||
border: none !important;
|
border: none !important;
|
||||||
backdrop-filter: blur(12px);
|
backdrop-filter: blur(12px);
|
||||||
}
|
}
|
||||||
.isra-chart-tooltip * {
|
.isra-chart-tooltip * {
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,77 +1,93 @@
|
|||||||
<template>
|
<template>
|
||||||
<div style="flex: 1;">
|
<div style="flex: 1">
|
||||||
<Container name="设备报警" size="middle" style="">
|
<Container
|
||||||
<TimePrompt class="timeShow" :timestr="timestr" />
|
name="设备报警"
|
||||||
<div style="padding: 5px 10px;">
|
size="middle"
|
||||||
<dv-scroll-board :config="config" style="width:575px;height:380px" ref='eqScrollBoard'/>
|
style="">
|
||||||
</div>
|
<TimePrompt
|
||||||
</Container>
|
class="timeShow"
|
||||||
</div>
|
:timestr="timestr" />
|
||||||
|
<div style="padding: 5px 10px">
|
||||||
|
<dv-scroll-board
|
||||||
|
:config="config"
|
||||||
|
style="width: 575px; height: 380px"
|
||||||
|
ref="eqScrollBoard" />
|
||||||
|
</div>
|
||||||
|
</Container>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import Container from '../components/Container.vue';
|
import Container from '../components/Container.vue';
|
||||||
import TimePrompt from '../components/TimePrompt';
|
import TimePrompt from '../components/TimePrompt';
|
||||||
import { switchShowTime } from '../utils'
|
import { switchShowTime } from '../utils';
|
||||||
export default {
|
export default {
|
||||||
name: 'EqAlarm',
|
name: 'EqAlarm',
|
||||||
components: { Container, TimePrompt },
|
components: { Container, TimePrompt },
|
||||||
computed: {
|
computed: {
|
||||||
sjgEquipment() {
|
sjgEquipment() {
|
||||||
return this.$store.state.websocket.sjgEquipment
|
return this.$store.state.websocket.sjgEquipment;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
timestr: '',
|
timestr: '',
|
||||||
config: {
|
config: {
|
||||||
header: ['序号', '设备名称', '设备编码','设备状态','是否故障'],
|
header: ['序号', '设备名称', '设备编码', '设备状态', '是否故障'],
|
||||||
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: [60, 150, 190],
|
columnWidth: [60, 150, 190],
|
||||||
align: ['center'],
|
align: ['center'],
|
||||||
data: [],
|
data: [],
|
||||||
// data: [
|
// data: [
|
||||||
// [1, '四大线3小线铺纸机', 'EQ20240110130909000255', '正常', '否'],
|
// [1, '四大线3小线铺纸机', 'EQ20240110130909000255', '正常', '否'],
|
||||||
// [2, '四大线2小线铺纸机', 'EQ20240110130848000254', '正常', '否'],
|
// [2, '四大线2小线铺纸机', 'EQ20240110130848000254', '正常', '否'],
|
||||||
// [3, '四大线1小线铺纸机', 'EQ20240110130832000253', '正常', '否'],
|
// [3, '四大线1小线铺纸机', 'EQ20240110130832000253', '正常', '否'],
|
||||||
// [4, '12线下片台', 'EQ20240110130817000252', '正常', '否'],
|
// [4, '12线下片台', 'EQ20240110130817000252', '正常', '否'],
|
||||||
// [5, '11线下片台', ' EQ20240110130743000250', '正常', '否'],
|
// [5, '11线下片台', ' EQ20240110130743000250', '正常', '否'],
|
||||||
// [6, '10线下片台', ' EQ20240110130743000250', '正常', '否'],
|
// [6, '10线下片台', ' EQ20240110130743000250', '正常', '否'],
|
||||||
// [7, '4大线五区自动连线柜', 'EQ20240110130731000249', '正常', '否'],
|
// [7, '4大线五区自动连线柜', 'EQ20240110130731000249', '正常', '否'],
|
||||||
// [8, '四大线四区2小线清洗机', 'EQ20240110112716000248', '正常', '否'],
|
// [8, '四大线四区2小线清洗机', 'EQ20240110112716000248', '正常', '否'],
|
||||||
// [9, '四大线四区1小线清洗机', 'EQ20240110112700000247', '正常', '否'],
|
// [9, '四大线四区1小线清洗机', 'EQ20240110112700000247', '正常', '否'],
|
||||||
// [10, '4大线四区自动连线柜', 'EQ20240110112646000246', '正常', '否']
|
// [10, '4大线四区自动连线柜', 'EQ20240110112646000246', '正常', '否']
|
||||||
// ],
|
// ],
|
||||||
rowNum: 10
|
rowNum: 10,
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
},
|
},
|
||||||
mounted(){
|
mounted() {
|
||||||
this.timestr = switchShowTime('日')
|
this.timestr = switchShowTime('日');
|
||||||
},
|
},
|
||||||
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,
|
||||||
`<span title=${item.name || ''}>${item.name || ''}</span>`,
|
`<span title=${item.name || ''}>${item.name || ''}</span>`,
|
||||||
`<span title=${item.code || ''}>${item.code || ''}</span>`,
|
`<span title=${item.code || ''}>${item.code || ''}</span>`,
|
||||||
item.status,
|
`<span><div style="${
|
||||||
item.error? '是': '否'
|
item.status == '正常'
|
||||||
]);
|
? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:13px 10px 0 0 '
|
||||||
this.config.data = outArr
|
: 'box-shadow: 0px 0px 2px 1px #FFBD02;width:6px;height:6px;border-radius: 50%; background-color: #FFBD02;float:left;margin:13px 10px 0 0 '
|
||||||
this.$refs['eqScrollBoard'].updateRows(outArr)
|
}"></div> ${item.status || ''}</span>`,
|
||||||
this.timestr = switchShowTime('日')
|
`<span"><div style="${
|
||||||
}
|
item.error == false
|
||||||
}
|
? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:13px 10px 0 0 '
|
||||||
}
|
: 'box-shadow: 0px 0px 2px 1px red;width:6px;height:6px;border-radius: 50%; background-color: red;float:left;margin:13px 10px 0 0 '
|
||||||
}
|
}"></div> ${item.error == true ? '是' : '否' || ''}</span>`,
|
||||||
|
]);
|
||||||
|
this.config.data = outArr;
|
||||||
|
this.$refs['eqScrollBoard'].updateRows(outArr);
|
||||||
|
this.timestr = switchShowTime('日');
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang='scss' scoped>
|
<style lang="scss" scoped>
|
||||||
.timeShow {
|
.timeShow {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 20px;
|
top: 20px;
|
||||||
left: 170px;
|
left: 170px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,67 +1,88 @@
|
|||||||
<template>
|
<template>
|
||||||
<Container name="工单监控" size="middle" style="">
|
<Container
|
||||||
<TimePrompt class="timeShow" :timestr="timestr" />
|
name="工单监控"
|
||||||
<div style="padding: 5px 10px;" class="WOMonitoring">
|
size="middle"
|
||||||
<dv-scroll-board :config="config" style="width:900px;height:380px" ref='worderScrollBoard'/>
|
style="">
|
||||||
</div>
|
<TimePrompt
|
||||||
</Container>
|
class="timeShow"
|
||||||
|
:timestr="timestr" />
|
||||||
|
<div
|
||||||
|
style="padding: 5px 10px"
|
||||||
|
class="WOMonitoring">
|
||||||
|
<dv-scroll-board
|
||||||
|
:config="config"
|
||||||
|
style="width: 900px; height: 380px"
|
||||||
|
ref="worderScrollBoard" />
|
||||||
|
</div>
|
||||||
|
</Container>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import Container from '../components/Container.vue';
|
import Container from '../components/Container.vue';
|
||||||
import TimePrompt from '../components/TimePrompt';
|
import TimePrompt from '../components/TimePrompt';
|
||||||
import { switchShowTime } from '../utils'
|
import { switchShowTime } from '../utils';
|
||||||
import { formatDate } from '@/utils'
|
import { formatDate } from '@/utils';
|
||||||
export default {
|
export default {
|
||||||
name: 'WorkOrderMonitoring',
|
name: 'WorkOrderMonitoring',
|
||||||
components: { Container, TimePrompt },
|
components: { Container, TimePrompt },
|
||||||
computed: {
|
computed: {
|
||||||
order() {
|
order() {
|
||||||
return this.$store.state.websocket.workOrder
|
return this.$store.state.websocket.workOrder;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
timestr: '',
|
timestr: '',
|
||||||
config: {
|
config: {
|
||||||
header: ['序号', '工单名称', '规格','产线','工单状态', '计划完成时间','计划产量','实际产量'],
|
header: [
|
||||||
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
'序号',
|
||||||
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
'工单名称',
|
||||||
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
'规格',
|
||||||
columnWidth: [60, 120, 120, 60, 100, 150],
|
'产线',
|
||||||
align: ['center'],
|
'工单状态',
|
||||||
data: [],
|
'计划完成时间',
|
||||||
rowNum:10
|
'计划产量',
|
||||||
}
|
'实际产量',
|
||||||
}
|
'完成进度',
|
||||||
},
|
],
|
||||||
mounted(){
|
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
this.timestr = switchShowTime('日')
|
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
||||||
},
|
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||||
watch:{
|
columnWidth: [60, 120, 120, 60, 100, 150],
|
||||||
order: {
|
align: ['center'],
|
||||||
|
data: [],
|
||||||
|
rowNum: 10,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.timestr = switchShowTime('日');
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
order: {
|
||||||
handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
let outArr = this.order.map((item, index) => [
|
let outArr = this.order.map((item, index) => [
|
||||||
index+1,
|
index + 1,
|
||||||
`<span title=${item.name || ''}>${item.name || ''}</span>`,
|
`<span title=${item.name || ''}>${item.name || ''}</span>`,
|
||||||
item.specifications,
|
item.specifications,
|
||||||
item.lines,
|
item.lines,
|
||||||
this.getDictDatas(this.DICT_TYPE.ORDER_STATUS)[item.status]?.label,
|
this.getDictDatas(this.DICT_TYPE.ORDER_STATUS)[item.status]?.label,
|
||||||
formatDate(item.planFinishTime),
|
formatDate(item.planFinishTime),
|
||||||
item.planQuantity,
|
item.planQuantity,
|
||||||
item.planAssignQuantity
|
item.actualQuantity,
|
||||||
]);
|
(item.progressRate * 100).toFixed(0) + '%',
|
||||||
this.config.data = outArr
|
]);
|
||||||
this.$refs['worderScrollBoard'].updateRows(outArr)
|
this.config.data = outArr;
|
||||||
this.timestr = switchShowTime('日')
|
this.$refs['worderScrollBoard'].updateRows(outArr);
|
||||||
}
|
this.timestr = switchShowTime('日');
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang='scss' scoped>
|
<style lang="scss" scoped>
|
||||||
.timeShow {
|
.timeShow {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 20px;
|
top: 20px;
|
||||||
left: 170px;
|
left: 170px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,8 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id='deepProcessingContainerB' ref='deepProcessingContainerB' style="width: 100%;height: 100%;">
|
<div
|
||||||
|
id="deepProcessingContainerB"
|
||||||
|
ref="deepProcessingContainerB"
|
||||||
|
style="width: 100%; height: 100%">
|
||||||
<div
|
<div
|
||||||
id='deepProcessingContainer'
|
id="deepProcessingContainer"
|
||||||
ref='deepProcessingContainer'
|
ref="deepProcessingContainer"
|
||||||
class="deepProcessingBoard"
|
class="deepProcessingBoard"
|
||||||
style="
|
style="
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@@ -16,15 +19,14 @@
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 24px;
|
gap: 24px;
|
||||||
"
|
"
|
||||||
:style="{transform:'scale('+scaleNum+')'}">
|
:style="{ transform: 'scale(' + scaleNum + ')' }">
|
||||||
<KHeader :isFullScreen='isFullScreen' @screenfullChange='screenfullChange' topTitle='深加工生产运行驾驶舱'/>
|
<KHeader
|
||||||
|
:isFullScreen="isFullScreen"
|
||||||
|
@screenfullChange="screenfullChange"
|
||||||
|
topTitle="深加工生产运行驾驶舱" />
|
||||||
<div
|
<div
|
||||||
class="main-body"
|
class="main-body"
|
||||||
style="
|
style="display: grid; gap: 16px; grid-template-rows: 462px 462px">
|
||||||
display: grid;
|
|
||||||
gap: 16px;
|
|
||||||
grid-template-rows: 462px 462px;
|
|
||||||
">
|
|
||||||
<TopThree />
|
<TopThree />
|
||||||
<BottomTwo />
|
<BottomTwo />
|
||||||
</div>
|
</div>
|
||||||
@@ -47,16 +49,16 @@
|
|||||||
import KHeader from '../components/Header';
|
import KHeader from '../components/Header';
|
||||||
import TopThree from './TopThree';
|
import TopThree from './TopThree';
|
||||||
import BottomTwo from './BottomTwo';
|
import BottomTwo from './BottomTwo';
|
||||||
import screenfull from 'screenfull'
|
import screenfull from 'screenfull';
|
||||||
import { debounce } from '@/utils/debounce'
|
import { debounce } from '@/utils/debounce';
|
||||||
import { getDcsMsg, getMesMsg } from './../utils/wsInterface'
|
import { getDcsMsg, getMesMsg } from './../utils/wsInterface';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'deepProcessingBoard',
|
name: 'deepProcessingBoard',
|
||||||
components: {
|
components: {
|
||||||
KHeader,
|
KHeader,
|
||||||
TopThree,
|
TopThree,
|
||||||
BottomTwo
|
BottomTwo,
|
||||||
},
|
},
|
||||||
// provide() {
|
// provide() {
|
||||||
// return {
|
// return {
|
||||||
@@ -66,83 +68,90 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
isFullScreen: false,
|
isFullScreen: false,
|
||||||
scaleNum: 0.8
|
scaleNum: 0.8,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.init()
|
this.init();
|
||||||
},
|
},
|
||||||
destroy() {
|
destroy() {
|
||||||
this.destroy()
|
this.destroy();
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.boxReset = debounce(() => {
|
this.boxReset = debounce(() => {
|
||||||
this.resetSize()
|
this.resetSize();
|
||||||
}, 300)
|
}, 300);
|
||||||
this.boxReset()
|
this.boxReset();
|
||||||
window.addEventListener('resize', () => {
|
window.addEventListener('resize', () => {
|
||||||
this.boxReset()
|
this.boxReset();
|
||||||
})
|
});
|
||||||
// closeWebsocket()
|
// closeWebsocket()
|
||||||
// getDcsMsg()
|
// getDcsMsg()
|
||||||
// getMesMsg()
|
// getMesMsg()
|
||||||
console.log('mounted...........')
|
},
|
||||||
|
mounted() {
|
||||||
|
this.boxReset();
|
||||||
|
window.addEventListener('resize', this.boxReset);
|
||||||
},
|
},
|
||||||
destroyed() {
|
destroyed() {
|
||||||
console.log('destroyed...........')
|
window.removeEventListener('resize', this.boxReset);
|
||||||
|
this.destroy();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
boxReset() {
|
||||||
|
debounce(() => {
|
||||||
|
this.resetSize();
|
||||||
|
}, 300)();
|
||||||
|
},
|
||||||
change() {
|
change() {
|
||||||
this.isFullScreen = screenfull.isFullscreen
|
this.isFullScreen = screenfull.isFullscreen;
|
||||||
},
|
},
|
||||||
init() {
|
init() {
|
||||||
if (screenfull.isEnabled) {
|
if (screenfull.isEnabled) {
|
||||||
screenfull.on('change', this.change)
|
screenfull.on('change', this.change);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
destroy() {
|
destroy() {
|
||||||
if (screenfull.isEnabled) {
|
if (screenfull.isEnabled) {
|
||||||
screenfull.off('change', this.change)
|
screenfull.off('change', this.change);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 全屏
|
// 全屏
|
||||||
screenfullChange() {
|
screenfullChange() {
|
||||||
if (!screenfull.isEnabled) {
|
if (!screenfull.isEnabled) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: 'you browser can not work',
|
message: 'you browser can not work',
|
||||||
type: 'warning'
|
type: 'warning',
|
||||||
})
|
});
|
||||||
return false
|
return false;
|
||||||
}
|
}
|
||||||
screenfull.toggle(this.$refs.deepProcessingContainerB)
|
screenfull.toggle(this.$refs.deepProcessingContainerB);
|
||||||
},
|
},
|
||||||
resetSize() {
|
resetSize() {
|
||||||
let deepProcessingContainer = document.getElementById('deepProcessingContainer')
|
let deepProcessingContainer = document.getElementById(
|
||||||
let rw = parseFloat(window.innerWidth)
|
'deepProcessingContainer'
|
||||||
let rh = parseFloat(window.innerHeight)
|
);
|
||||||
let bw = parseFloat(deepProcessingContainer.style.width)
|
let rw = parseFloat(window.innerWidth);
|
||||||
let bh = parseFloat(deepProcessingContainer.style.height)
|
let rh = parseFloat(window.innerHeight);
|
||||||
let wx = 0
|
let bw = parseFloat(deepProcessingContainer.style.width);
|
||||||
let hx = 0
|
let bh = parseFloat(deepProcessingContainer.style.height);
|
||||||
|
let wx = 0;
|
||||||
|
let hx = 0;
|
||||||
if (screenfull.isFullscreen) {
|
if (screenfull.isFullscreen) {
|
||||||
console.log('全屏')
|
wx = rw / bw;
|
||||||
wx = rw / bw
|
hx = rh / bh;
|
||||||
hx = rh / bh
|
} else {
|
||||||
console.log(this.scaleNum)
|
|
||||||
}else{
|
|
||||||
console.log('非全屏')
|
|
||||||
console.log(this.$store.state.app.sidebar.opened)
|
|
||||||
if (this.$store.state.app.sidebar.opened) {
|
if (this.$store.state.app.sidebar.opened) {
|
||||||
wx = (rw-280) / bw
|
wx = (rw - 280) / bw;
|
||||||
hx = (rh-116) / bh
|
hx = (rh - 116) / bh;
|
||||||
}else{
|
} else {
|
||||||
wx = (rw-85) / bw
|
wx = (rw - 85) / bw;
|
||||||
hx = (rh-116) / bh
|
hx = (rh - 116) / bh;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.scaleNum = wx
|
this.scaleNum = wx;
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -1,22 +1,24 @@
|
|||||||
<!--
|
|
||||||
filename: MaterialCost.vue
|
|
||||||
author: liubin
|
|
||||||
date: 2023-12-06 09:09:27
|
|
||||||
description:
|
|
||||||
-->
|
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<Container name="能耗" size="middle" style="">
|
<Container
|
||||||
<TimePrompt class="timeShow" :timestr="timestr" />
|
name="能耗"
|
||||||
|
size="middle"
|
||||||
|
style="">
|
||||||
<EnergeTop />
|
<EnergeTop />
|
||||||
<SplitLine :horizontal="true" />
|
<SplitLine :horizontal="true" />
|
||||||
<div class="" style="flex: 2; padding: 8px">
|
<div
|
||||||
|
class=""
|
||||||
|
style="flex: 2; padding: 8px">
|
||||||
<div
|
<div
|
||||||
class="header-line"
|
class="header-line"
|
||||||
style="margin: 8px 0 16px; display: flex; align-items: center">
|
style="margin: 8px 0 16px; display: flex; align-items: center">
|
||||||
<h2 class="" style="margin: 0; color: #0ee8fe; margin-right: 12px">
|
<h2
|
||||||
|
class=""
|
||||||
|
style="margin: 0; color: #0ee8fe; margin-right: 12px">
|
||||||
能耗趋势图
|
能耗趋势图
|
||||||
</h2>
|
</h2>
|
||||||
|
<TimePrompt
|
||||||
|
class="timeShow"
|
||||||
|
:timestr="timestr" />
|
||||||
<!-- <Switcher /> -->
|
<!-- <Switcher /> -->
|
||||||
<div>
|
<div>
|
||||||
<!-- <span class="lgd lgd-total">总量</span> -->
|
<!-- <span class="lgd lgd-total">总量</span> -->
|
||||||
@@ -32,11 +34,21 @@
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
">
|
">
|
||||||
<SelectorBtnGroup
|
<SelectorBtnGroup
|
||||||
:options="['电耗能', '天然气I', '天然气II']" @emitFun='toggleType' :active='chartType'/>
|
:options="['电耗能', '天然气I', '天然气II']"
|
||||||
<SelectorBtnGroup :options="['周', '月', '年']" @emitFun='toggleDate' :active='chartTime'/>
|
@emitFun="toggleType"
|
||||||
|
:active="chartType" />
|
||||||
|
<SelectorBtnGroup
|
||||||
|
:options="['周', '月', '年']"
|
||||||
|
@emitFun="toggleDate"
|
||||||
|
:active="chartTime" />
|
||||||
</div>
|
</div>
|
||||||
<div class="chart" style="height: 200px; margin-top: 8px;">
|
<div
|
||||||
<GasChart :chartType='chartType' :chartTime='chartTime' @emitFun='dateUpdate'/>
|
class="chart"
|
||||||
|
style="height: 200px; margin-top: 8px">
|
||||||
|
<GasChart
|
||||||
|
:chartType="chartType"
|
||||||
|
:chartTime="chartTime"
|
||||||
|
@emitFun="dateUpdate" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Container>
|
</Container>
|
||||||
@@ -51,7 +63,7 @@ import EnergeTop from './EnergeTop';
|
|||||||
import GasChart from '../components/GasChart.vue';
|
import GasChart from '../components/GasChart.vue';
|
||||||
import SelectorBtnGroup from '../components/SelectorBtnGroup';
|
import SelectorBtnGroup from '../components/SelectorBtnGroup';
|
||||||
import TimePrompt from '../components/TimePrompt';
|
import TimePrompt from '../components/TimePrompt';
|
||||||
import { switchShowTime } from '../utils'
|
import { switchShowTime } from '../utils';
|
||||||
export default {
|
export default {
|
||||||
name: 'EnergeCost',
|
name: 'EnergeCost',
|
||||||
components: {
|
components: {
|
||||||
@@ -61,48 +73,43 @@ export default {
|
|||||||
EnergeTop,
|
EnergeTop,
|
||||||
GasChart,
|
GasChart,
|
||||||
SelectorBtnGroup,
|
SelectorBtnGroup,
|
||||||
TimePrompt
|
TimePrompt,
|
||||||
},
|
},
|
||||||
props: {},
|
props: {},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
chartType:'电耗能',
|
chartType: '电耗能',
|
||||||
chartTime:'周',
|
chartTime: '周',
|
||||||
timestr: ''
|
timestr: '',
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.timestr = switchShowTime(this.chartTime)
|
this.timestr = switchShowTime(this.chartTime);
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
gasInfoMsg() {
|
gasInfoMsg() {
|
||||||
return this.$store.state.websocket.gasInfo
|
return this.$store.state.websocket.gasInfo;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 切换能源
|
// 切换能源
|
||||||
toggleType(val) {
|
toggleType(val) {
|
||||||
this.chartType = val
|
this.chartType = val;
|
||||||
},
|
},
|
||||||
// 切换时间
|
// 切换时间
|
||||||
toggleDate(val) {
|
toggleDate(val) {
|
||||||
this.chartTime = val
|
this.chartTime = val;
|
||||||
this.timestr = switchShowTime(val)
|
this.timestr = switchShowTime(val);
|
||||||
},
|
},
|
||||||
// 数据更新
|
// 数据更新
|
||||||
dateUpdate() {
|
dateUpdate() {
|
||||||
this.timestr = switchShowTime(this.chartTime)
|
this.timestr = switchShowTime(this.chartTime);
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.timeShow {
|
|
||||||
position: absolute;
|
|
||||||
top: 20px;
|
|
||||||
left: 120px;
|
|
||||||
}
|
|
||||||
.lgd {
|
.lgd {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="gas-handle" style="flex: 2">
|
<div
|
||||||
<Container name="烟气处理" size="large" style="">
|
class="gas-handle"
|
||||||
<TimePrompt class="timeShow" :timestr="timestr" />
|
style="flex: 2">
|
||||||
|
<Container
|
||||||
|
name="烟气处理"
|
||||||
|
size="large"
|
||||||
|
style="">
|
||||||
<div
|
<div
|
||||||
class=""
|
class=""
|
||||||
style="
|
style="
|
||||||
@@ -24,7 +28,13 @@
|
|||||||
">
|
">
|
||||||
氧气含量
|
氧气含量
|
||||||
</span>
|
</span>
|
||||||
<span style="font-size: 20px; line-height: 1.24; flex: 1">{{exhaustGasInfo?.O2_float ? (Number(exhaustGasInfo.O2_float)).toFixed(2) : ''}}%</span>
|
<span style="font-size: 20px; line-height: 1.24; flex: 1">
|
||||||
|
{{
|
||||||
|
exhaustGasInfo?.O2_float
|
||||||
|
? Number(exhaustGasInfo.O2_float).toFixed(2)
|
||||||
|
: ''
|
||||||
|
}}%
|
||||||
|
</span>
|
||||||
</ShadowRect>
|
</ShadowRect>
|
||||||
<ShadowRect>
|
<ShadowRect>
|
||||||
<div
|
<div
|
||||||
@@ -33,13 +43,19 @@
|
|||||||
line-height: 1.24;
|
line-height: 1.24;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
padding:5px 8px 5px 0;
|
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.2">{{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>
|
||||||
@@ -49,13 +65,19 @@
|
|||||||
line-height: 1.24;
|
line-height: 1.24;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
padding:5px 8px 5px 0;
|
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?.SO2_float ? (Number(exhaustGasInfo.SO2_float)).toFixed(2) : ''}}mg/m³</span>
|
<span style="font-size: 20px; line-height: 1.24; flex: 1">
|
||||||
|
{{
|
||||||
|
exhaustGasInfo?.SO2_float
|
||||||
|
? Number(exhaustGasInfo.SO2_float).toFixed(2)
|
||||||
|
: ''
|
||||||
|
}}mg/m³
|
||||||
|
</span>
|
||||||
</ShadowRect>
|
</ShadowRect>
|
||||||
|
|
||||||
<ShadowRect>
|
<ShadowRect>
|
||||||
@@ -70,17 +92,30 @@
|
|||||||
">
|
">
|
||||||
颗粒物浓度
|
颗粒物浓度
|
||||||
</span>
|
</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>
|
<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" />
|
||||||
<div class="" style="flex: 2; padding: 8px">
|
<div
|
||||||
|
class=""
|
||||||
|
style="flex: 2; padding: 8px">
|
||||||
<div
|
<div
|
||||||
class="header-line"
|
class="header-line"
|
||||||
style="margin-bottom: 10px; display: flex; align-items: center">
|
style="margin-bottom: 10px; display: flex; align-items: center">
|
||||||
<h2 class="" style="margin: 5px 0; color: #0ee8fe; margin-right: 12px">
|
<h2
|
||||||
|
class=""
|
||||||
|
style="margin: 5px 0; color: #0ee8fe; margin-right: 12px">
|
||||||
烟气趋势图
|
烟气趋势图
|
||||||
</h2>
|
</h2>
|
||||||
|
<TimePrompt
|
||||||
|
class="timeShow"
|
||||||
|
:timestr="timestr" />
|
||||||
<!-- <Switcher /> -->
|
<!-- <Switcher /> -->
|
||||||
<div>
|
<div>
|
||||||
<!-- <span class="lgd lgd-total">总量</span> -->
|
<!-- <span class="lgd lgd-total">总量</span> -->
|
||||||
@@ -96,11 +131,21 @@
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
">
|
">
|
||||||
<SelectorBtnGroup
|
<SelectorBtnGroup
|
||||||
:options="['氧气含量', '二氧化硫', '氮氧化物', '颗粒物']" @emitFun='toggleType' :active='chartType'/>
|
:options="['氧气含量', '二氧化硫', '氮氧化物', '颗粒物']"
|
||||||
<SelectorBtnGroup :options="['日', '周', '月', '年']" @emitFun='toggleDate' :active='chartTime' />
|
@emitFun="toggleType"
|
||||||
|
:active="chartType" />
|
||||||
|
<SelectorBtnGroup
|
||||||
|
:options="['日', '周', '月', '年']"
|
||||||
|
@emitFun="toggleDate"
|
||||||
|
:active="chartTime" />
|
||||||
</div>
|
</div>
|
||||||
<div class="chart" style="height: 250px;margin-top: 10px;">
|
<div
|
||||||
<FlueGasChart :chartType='chartType' :chartTime='chartTime' @emitFun='dateUpdate'/>
|
class="chart"
|
||||||
|
style="height: 250px; margin-top: 10px">
|
||||||
|
<FlueGasChart
|
||||||
|
:chartType="chartType"
|
||||||
|
:chartTime="chartTime"
|
||||||
|
@emitFun="dateUpdate" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Container>
|
</Container>
|
||||||
@@ -115,7 +160,7 @@ import KilnLine from '../components/line';
|
|||||||
import SelectorBtnGroup from '../components/SelectorBtnGroup';
|
import SelectorBtnGroup from '../components/SelectorBtnGroup';
|
||||||
import FlueGasChart from '../components/FlueGasChart';
|
import FlueGasChart from '../components/FlueGasChart';
|
||||||
import TimePrompt from '../components/TimePrompt';
|
import TimePrompt from '../components/TimePrompt';
|
||||||
import { switchShowTime } from '../utils'
|
import { switchShowTime } from '../utils';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'GasHandle',
|
name: 'GasHandle',
|
||||||
@@ -125,49 +170,44 @@ export default {
|
|||||||
KilnLine,
|
KilnLine,
|
||||||
SelectorBtnGroup,
|
SelectorBtnGroup,
|
||||||
FlueGasChart,
|
FlueGasChart,
|
||||||
TimePrompt
|
TimePrompt,
|
||||||
},
|
},
|
||||||
props: {},
|
props: {},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
chartType:'氧气含量',
|
chartType: '氧气含量',
|
||||||
chartTime:'日',
|
chartTime: '日',
|
||||||
timestr: ''
|
timestr: '',
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
exhaustGasInfo() {
|
exhaustGasInfo() {
|
||||||
return this.$store.state.websocket.exhaustGasInfo
|
return this.$store.state.websocket.exhaustGasInfo;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.timestr = switchShowTime(this.chartTime)
|
this.timestr = switchShowTime(this.chartTime);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 烟气
|
// 烟气
|
||||||
toggleType(val) {
|
toggleType(val) {
|
||||||
console.log('烟气' + val)
|
console.log('烟气' + val);
|
||||||
this.chartType = val
|
this.chartType = val;
|
||||||
},
|
},
|
||||||
// 切换时间
|
// 切换时间
|
||||||
toggleDate(val) {
|
toggleDate(val) {
|
||||||
this.chartTime = val
|
this.chartTime = val;
|
||||||
this.timestr = switchShowTime(val)
|
this.timestr = switchShowTime(val);
|
||||||
},
|
},
|
||||||
// 数据更新
|
// 数据更新
|
||||||
dateUpdate() {
|
dateUpdate() {
|
||||||
this.timestr = switchShowTime(this.chartTime)
|
this.timestr = switchShowTime(this.chartTime);
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.timeShow {
|
|
||||||
position: absolute;
|
|
||||||
top: 20px;
|
|
||||||
left: 170px;
|
|
||||||
}
|
|
||||||
.gas-handle {
|
.gas-handle {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -3,6 +3,9 @@
|
|||||||
name="原料用量统计"
|
name="原料用量统计"
|
||||||
size="middle"
|
size="middle"
|
||||||
style="">
|
style="">
|
||||||
|
<TimePrompt
|
||||||
|
class="timeShow"
|
||||||
|
:timestr="timestr" />
|
||||||
<div style="flex: 1; display: flex; gap: 8px; flex-direction: column">
|
<div style="flex: 1; display: flex; gap: 8px; flex-direction: column">
|
||||||
<div
|
<div
|
||||||
class="absolute"
|
class="absolute"
|
||||||
@@ -10,8 +13,8 @@
|
|||||||
flex: 2;
|
flex: 2;
|
||||||
padding: 12px 12px 0 12px;
|
padding: 12px 12px 0 12px;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(2, 1fr);
|
grid-template-columns: repeat(3, 1fr);
|
||||||
grid-auto-rows: repeat(4, 1fr);
|
grid-auto-rows: repeat(3, 1fr);
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
">
|
">
|
||||||
<ShadowRect
|
<ShadowRect
|
||||||
@@ -22,7 +25,8 @@
|
|||||||
class="material"
|
class="material"
|
||||||
style="
|
style="
|
||||||
flex: 1;
|
flex: 1;
|
||||||
padding-bottom: 3px;
|
padding-bottom: 18px;
|
||||||
|
padding-top: 18px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 4px;
|
gap: 4px;
|
||||||
@@ -53,20 +57,33 @@
|
|||||||
<script>
|
<script>
|
||||||
import Container from '../components/Container';
|
import Container from '../components/Container';
|
||||||
import ShadowRect from '../components/ShadowRect.vue';
|
import ShadowRect from '../components/ShadowRect.vue';
|
||||||
|
import TimePrompt from '../components/TimePrompt';
|
||||||
|
import { switchShowTime } from '../utils';
|
||||||
export default {
|
export default {
|
||||||
name: 'MaterialCost',
|
name: 'MaterialCost',
|
||||||
components: { Container, ShadowRect },
|
components: { Container, ShadowRect, TimePrompt },
|
||||||
props: {},
|
props: {},
|
||||||
data() {
|
data() {
|
||||||
return {};
|
return {
|
||||||
|
timestr: '',
|
||||||
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
materialMsg() {
|
materialMsg() {
|
||||||
return this.$store.state.websocket.material;
|
return this.$store.state.websocket.material;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
mounted() {
|
||||||
|
this.timestr = switchShowTime('日');
|
||||||
|
},
|
||||||
methods: {},
|
methods: {},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss"></style>
|
<style lang="scss" scoped>
|
||||||
|
.timeShow {
|
||||||
|
position: absolute;
|
||||||
|
top: 20px;
|
||||||
|
left: 210px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -1,8 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id='kilnContainerB' ref='kilnContainerB' style="width: 100%;height: 100%;">
|
<div
|
||||||
|
id="kilnContainerB"
|
||||||
|
ref="kilnContainerB"
|
||||||
|
style="width: 100%; height: 100%">
|
||||||
<div
|
<div
|
||||||
id='kilnContainer'
|
id="kilnContainer"
|
||||||
ref='kilnContainer'
|
ref="kilnContainer"
|
||||||
class="KilnDataBoard"
|
class="KilnDataBoard"
|
||||||
style="
|
style="
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@@ -16,15 +19,22 @@
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 24px;
|
gap: 24px;
|
||||||
"
|
"
|
||||||
:style="{transform:'scale('+scaleNum+')'}">
|
:style="{ transform: 'scale(' + scaleNum + ')' }">
|
||||||
<KHeader :isFullScreen='isFullScreen' @screenfullChange='screenfullChange' topTitle='窑炉生产运行驾驶舱'/>
|
<KHeader
|
||||||
|
:isFullScreen="isFullScreen"
|
||||||
|
@screenfullChange="screenfullChange"
|
||||||
|
topTitle="窑炉生产运行驾驶舱" />
|
||||||
<div
|
<div
|
||||||
class="main-body"
|
class="main-body"
|
||||||
style="flex: 1; display: flex; gap: 20px; padding: 0px 16px">
|
style="flex: 1; display: flex; gap: 20px; padding: 0px 16px">
|
||||||
<div class="left-side" style="flex: 2">
|
<div
|
||||||
|
class="left-side"
|
||||||
|
style="flex: 2">
|
||||||
<LeftFour />
|
<LeftFour />
|
||||||
</div>
|
</div>
|
||||||
<div class="right-side" style="flex: 1">
|
<div
|
||||||
|
class="right-side"
|
||||||
|
style="flex: 1">
|
||||||
<RightTwo />
|
<RightTwo />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -36,8 +46,8 @@
|
|||||||
import KHeader from '../components/Header';
|
import KHeader from '../components/Header';
|
||||||
import LeftFour from './LeftFour';
|
import LeftFour from './LeftFour';
|
||||||
import RightTwo from './RightTwo.vue';
|
import RightTwo from './RightTwo.vue';
|
||||||
import screenfull from 'screenfull'
|
import screenfull from 'screenfull';
|
||||||
import { debounce } from '@/utils/debounce'
|
import { debounce } from '@/utils/debounce';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Kiln',
|
name: 'Kiln',
|
||||||
@@ -46,10 +56,10 @@ export default {
|
|||||||
LeftFour,
|
LeftFour,
|
||||||
RightTwo,
|
RightTwo,
|
||||||
},
|
},
|
||||||
computed:{
|
computed: {
|
||||||
sidebarStatus() {
|
sidebarStatus() {
|
||||||
return this.$store.state.app.sidebar.opened;
|
return this.$store.state.app.sidebar.opened;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
// provide() {
|
// provide() {
|
||||||
// return {
|
// return {
|
||||||
@@ -59,84 +69,80 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
isFullScreen: false,
|
isFullScreen: false,
|
||||||
scaleNum: 0.8
|
scaleNum: 0.8,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
sidebarStatus() {
|
sidebarStatus() {
|
||||||
this.boxReset()
|
this.boxReset();
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.init()
|
this.init();
|
||||||
},
|
|
||||||
destroy() {
|
|
||||||
this.destroy()
|
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.boxReset = debounce(() => {
|
this.boxReset();
|
||||||
this.resetSize()
|
window.addEventListener('resize', this.boxReset);
|
||||||
}, 300)
|
},
|
||||||
this.boxReset()
|
destroyed() {
|
||||||
window.addEventListener('resize', () => {
|
window.removeEventListener('resize', this.boxReset);
|
||||||
this.boxReset()
|
this.destroy();
|
||||||
})
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
boxReset() {
|
||||||
|
debounce(() => {
|
||||||
|
this.resetSize();
|
||||||
|
}, 300)();
|
||||||
|
},
|
||||||
change() {
|
change() {
|
||||||
this.isFullScreen = screenfull.isFullscreen
|
this.isFullScreen = screenfull.isFullscreen;
|
||||||
},
|
},
|
||||||
|
|
||||||
init() {
|
init() {
|
||||||
if (screenfull.isEnabled) {
|
if (screenfull.isEnabled) {
|
||||||
screenfull.on('change', this.change)
|
screenfull.on('change', this.change);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
destroy() {
|
destroy() {
|
||||||
if (screenfull.isEnabled) {
|
if (screenfull.isEnabled) {
|
||||||
screenfull.off('change', this.change)
|
screenfull.off('change', this.change);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 全屏
|
// 全屏
|
||||||
screenfullChange() {
|
screenfullChange() {
|
||||||
if (!screenfull.isEnabled) {
|
if (!screenfull.isEnabled) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: 'you browser can not work',
|
message: 'you browser can not work',
|
||||||
type: 'warning'
|
type: 'warning',
|
||||||
})
|
});
|
||||||
return false
|
return false;
|
||||||
}
|
}
|
||||||
screenfull.toggle(this.$refs.kilnContainerB)
|
screenfull.toggle(this.$refs.kilnContainerB);
|
||||||
},
|
},
|
||||||
resetSize() {
|
resetSize() {
|
||||||
let kilnContainerBox = document.getElementById('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)
|
let bh = parseFloat(kilnContainerBox.style.height);
|
||||||
let bh = parseFloat(kilnContainerBox.style.height)
|
let wx = 0;
|
||||||
let wx = 0
|
let hx = 0;
|
||||||
let hx = 0
|
|
||||||
if (screenfull.isFullscreen) {
|
if (screenfull.isFullscreen) {
|
||||||
console.log('全屏')
|
wx = rw / bw;
|
||||||
wx = rw / bw
|
hx = rh / bh;
|
||||||
hx = rh / bh
|
} else {
|
||||||
console.log(this.scaleNum)
|
|
||||||
}else{
|
|
||||||
console.log('非全屏')
|
|
||||||
console.log(this.$store.state.app.sidebar.opened)
|
|
||||||
if (this.$store.state.app.sidebar.opened) {
|
if (this.$store.state.app.sidebar.opened) {
|
||||||
wx = (rw-280) / bw
|
wx = (rw - 280) / bw;
|
||||||
hx = (rh-116) / bh
|
hx = (rh - 116) / bh;
|
||||||
}else{
|
} else {
|
||||||
wx = (rw-85) / bw
|
wx = (rw - 85) / bw;
|
||||||
hx = (rh-116) / bh
|
hx = (rh - 116) / bh;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.scaleNum = wx
|
this.scaleNum = wx;
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -29,6 +29,8 @@ export const switchShowTime = (type) => {
|
|||||||
}
|
}
|
||||||
if (lastMonth === 12) {
|
if (lastMonth === 12) {
|
||||||
startYear = currentYear - 1
|
startYear = currentYear - 1
|
||||||
|
}else{
|
||||||
|
startYear = currentYear
|
||||||
}
|
}
|
||||||
startTime = startYear+'.'+lastMonth+'.'+day
|
startTime = startYear+'.'+lastMonth+'.'+day
|
||||||
endTime = currentYear+'.'+(nowTime.getMonth()+1)+'.28'
|
endTime = currentYear+'.'+(nowTime.getMonth()+1)+'.28'
|
||||||
|
|||||||
@@ -1,70 +1,94 @@
|
|||||||
<template>
|
<template>
|
||||||
<div style="flex: 1;" class="orderContainer">
|
<div
|
||||||
<Container name="订单完成情况" size="small" style="">
|
style="flex: 1"
|
||||||
<TimePrompt class="timeShow" :timestr="timestr" />
|
class="orderContainer">
|
||||||
<div style="padding: 5px 10px;">
|
<Container
|
||||||
<dv-scroll-board :config="config" style="width:575px;height:230px" ref='orderScrollBoard'/>
|
name="订单完成情况"
|
||||||
</div>
|
size="small"
|
||||||
</Container>
|
style="">
|
||||||
</div>
|
<TimePrompt
|
||||||
|
class="timeShow"
|
||||||
|
:timestr="timestr" />
|
||||||
|
<div style="padding: 5px 10px">
|
||||||
|
<dv-scroll-board
|
||||||
|
:config="config"
|
||||||
|
style="width: 575px; height: 230px"
|
||||||
|
ref="orderScrollBoard" />
|
||||||
|
</div>
|
||||||
|
</Container>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import Container from '../components/Container'
|
import Container from '../components/Container';
|
||||||
import TimePrompt from '../components/TimePrompt';
|
import TimePrompt from '../components/TimePrompt';
|
||||||
import { formatDate } from '@/utils'
|
import { formatDate } from '@/utils';
|
||||||
import { switchShowTime } from '../utils'
|
import { switchShowTime } from '../utils';
|
||||||
export default {
|
export default {
|
||||||
name: 'OrderStatus',
|
name: 'OrderStatus',
|
||||||
components: { Container, TimePrompt },
|
components: { Container, TimePrompt },
|
||||||
computed: {
|
computed: {
|
||||||
order() {
|
order() {
|
||||||
return this.$store.state.websocket.order
|
return this.$store.state.websocket.order;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
timestr: '',
|
timestr: '',
|
||||||
config: {
|
config: {
|
||||||
header: ['上线时间', '客户名称', '规格','完成度'],
|
header: ['上线时间', '客户名称', '规格', '完成度'],
|
||||||
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, 160, 150],
|
columnWidth: [155, 160, 150],
|
||||||
data: [],
|
data: [],
|
||||||
rowNum: 6
|
rowNum: 6,
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.timestr = switchShowTime('日')
|
this.timestr = switchShowTime('日');
|
||||||
},
|
},
|
||||||
watch:{
|
watch: {
|
||||||
order:{
|
order: {
|
||||||
handler() {
|
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 || ''}>${
|
||||||
`<span title=${item.specifications || ''}>${item.specifications || ''}</span>`,
|
item.customerName || ''
|
||||||
`<span style="display:inline-block;width:60px;">${item.completeRate?(item.completeRate*100).toFixed(2)+'%':'0%'}</span>
|
}</span>`,
|
||||||
|
`<span title=${item.specifications || ''}>${
|
||||||
|
item.specifications || ''
|
||||||
|
}</span>`,
|
||||||
|
`<span style="display:inline-block;width:60px;">${
|
||||||
|
item.completeRate
|
||||||
|
? (item.completeRate * 100).toFixed(2) + '%'
|
||||||
|
: '0%'
|
||||||
|
}</span>
|
||||||
<div style="display:inline-block;height:20px;margin-top:-5px;vertical-align:middle;">
|
<div style="display:inline-block;height:20px;margin-top:-5px;vertical-align:middle;">
|
||||||
<svg xmlns="http://www.w3.org/200/svg" height="20" width="20">
|
<svg xmlns="http://www.w3.org/200/svg" height="20" width="20">
|
||||||
<circle cx="10" cy="10" r="6" fill="none" stroke="#283851" stroke-width="4" stroke-linecap="round"/>
|
<circle cx="10" cy="10" r="6" fill="none" stroke="#283851" stroke-width="4" stroke-linecap="round"/>
|
||||||
<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)}"/>
|
<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
|
||||||
|
}"/>
|
||||||
</svg>
|
</svg>
|
||||||
</div>`
|
</div>`,
|
||||||
]);
|
]);
|
||||||
this.config.data = outArr
|
this.config.data = outArr;
|
||||||
this.$refs['orderScrollBoard'].updateRows(outArr)
|
this.$refs['orderScrollBoard'].updateRows(outArr);
|
||||||
this.timestr = switchShowTime('日')
|
this.timestr = switchShowTime('日');
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang='scss' scoped>
|
<style lang="scss" scoped>
|
||||||
.timeShow {
|
.timeShow {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 20px;
|
top: 20px;
|
||||||
left: 210px;
|
left: 210px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,8 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id='wholePlantContainerB' ref='wholePlantContainerB' style="width: 100%;height: 100%;">
|
<div
|
||||||
|
id="wholePlantContainerB"
|
||||||
|
ref="wholePlantContainerB"
|
||||||
|
style="width: 100%; height: 100%">
|
||||||
<div
|
<div
|
||||||
id='wholePlantContainer'
|
id="wholePlantContainer"
|
||||||
ref='wholePlantContainer'
|
ref="wholePlantContainer"
|
||||||
class="wholePlantBoard"
|
class="wholePlantBoard"
|
||||||
style="
|
style="
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@@ -16,18 +19,27 @@
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 24px;
|
gap: 24px;
|
||||||
"
|
"
|
||||||
:style="{transform:'scale('+scaleNum+')'}">
|
:style="{ transform: 'scale(' + scaleNum + ')' }">
|
||||||
<KHeader :isFullScreen='isFullScreen' @screenfullChange='screenfullChange' topTitle='全厂总览驾驶舱'/>
|
<KHeader
|
||||||
|
:isFullScreen="isFullScreen"
|
||||||
|
@screenfullChange="screenfullChange"
|
||||||
|
topTitle="全厂总览驾驶舱" />
|
||||||
<div
|
<div
|
||||||
class="main-body"
|
class="main-body"
|
||||||
style="flex: 1; display: flex; gap: 20px; padding: 0px 16px">
|
style="flex: 1; display: flex; gap: 20px; padding: 0px 16px">
|
||||||
<div class="left-side" style="flex: 1">
|
<div
|
||||||
|
class="left-side"
|
||||||
|
style="flex: 1">
|
||||||
<LeftTwo />
|
<LeftTwo />
|
||||||
</div>
|
</div>
|
||||||
<div class="middle-side" style="flex: 1">
|
<div
|
||||||
|
class="middle-side"
|
||||||
|
style="flex: 1">
|
||||||
<MiddleTwo />
|
<MiddleTwo />
|
||||||
</div>
|
</div>
|
||||||
<div class="right-side" style="flex: 1">
|
<div
|
||||||
|
class="right-side"
|
||||||
|
style="flex: 1">
|
||||||
<RightTwo />
|
<RightTwo />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -40,8 +52,8 @@ import KHeader from '../components/Header';
|
|||||||
import LeftTwo from './LeftTwo';
|
import LeftTwo from './LeftTwo';
|
||||||
import MiddleTwo from './MiddleTwo';
|
import MiddleTwo from './MiddleTwo';
|
||||||
import RightTwo from './RightTwo';
|
import RightTwo from './RightTwo';
|
||||||
import screenfull from 'screenfull'
|
import screenfull from 'screenfull';
|
||||||
import { debounce } from '@/utils/debounce'
|
import { debounce } from '@/utils/debounce';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'wholePlantBoard',
|
name: 'wholePlantBoard',
|
||||||
@@ -49,7 +61,7 @@ export default {
|
|||||||
KHeader,
|
KHeader,
|
||||||
LeftTwo,
|
LeftTwo,
|
||||||
MiddleTwo,
|
MiddleTwo,
|
||||||
RightTwo
|
RightTwo,
|
||||||
},
|
},
|
||||||
// provide() {
|
// provide() {
|
||||||
// return {
|
// return {
|
||||||
@@ -59,80 +71,77 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
isFullScreen: false,
|
isFullScreen: false,
|
||||||
scaleNum: 0.8
|
scaleNum: 0.8,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.init()
|
this.init();
|
||||||
},
|
},
|
||||||
destroy() {
|
destroy() {
|
||||||
this.destroy()
|
this.destroy();
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.boxReset = debounce(() => {
|
this.boxReset();
|
||||||
this.resetSize()
|
window.addEventListener('resize', this.boxReset);
|
||||||
}, 300)
|
|
||||||
this.boxReset()
|
|
||||||
window.addEventListener('resize', () => {
|
|
||||||
this.boxReset()
|
|
||||||
})
|
|
||||||
console.log('mounted...........')
|
|
||||||
},
|
},
|
||||||
destroyed() {
|
destroyed() {
|
||||||
console.log('destroyed...........')
|
window.removeEventListener('resize', this.boxReset);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
boxReset() {
|
||||||
|
debounce(() => {
|
||||||
|
this.resetSize();
|
||||||
|
}, 300)();
|
||||||
|
},
|
||||||
change() {
|
change() {
|
||||||
this.isFullScreen = screenfull.isFullscreen
|
this.isFullScreen = screenfull.isFullscreen;
|
||||||
},
|
},
|
||||||
init() {
|
init() {
|
||||||
if (screenfull.isEnabled) {
|
if (screenfull.isEnabled) {
|
||||||
screenfull.on('change', this.change)
|
screenfull.on('change', this.change);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
destroy() {
|
destroy() {
|
||||||
if (screenfull.isEnabled) {
|
if (screenfull.isEnabled) {
|
||||||
screenfull.off('change', this.change)
|
screenfull.off('change', this.change);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 全屏
|
// 全屏
|
||||||
screenfullChange() {
|
screenfullChange() {
|
||||||
if (!screenfull.isEnabled) {
|
if (!screenfull.isEnabled) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: 'you browser can not work',
|
message: 'you browser can not work',
|
||||||
type: 'warning'
|
type: 'warning',
|
||||||
})
|
});
|
||||||
return false
|
return false;
|
||||||
}
|
}
|
||||||
screenfull.toggle(this.$refs.wholePlantContainerB)
|
screenfull.toggle(this.$refs.wholePlantContainerB);
|
||||||
},
|
},
|
||||||
resetSize() {
|
resetSize() {
|
||||||
let wholePlantContainerBox = document.getElementById('wholePlantContainer')
|
let wholePlantContainerBox = document.getElementById(
|
||||||
let rw = parseFloat(window.innerWidth)
|
'wholePlantContainer'
|
||||||
let rh = parseFloat(window.innerHeight)
|
);
|
||||||
let bw = parseFloat(wholePlantContainerBox.style.width)
|
let rw = parseFloat(window.innerWidth);
|
||||||
let bh = parseFloat(wholePlantContainerBox.style.height)
|
let rh = parseFloat(window.innerHeight);
|
||||||
let wx = 0
|
let bw = parseFloat(wholePlantContainerBox.style.width);
|
||||||
let hx = 0
|
let bh = parseFloat(wholePlantContainerBox.style.height);
|
||||||
|
let wx = 0;
|
||||||
|
let hx = 0;
|
||||||
if (screenfull.isFullscreen) {
|
if (screenfull.isFullscreen) {
|
||||||
console.log('全屏')
|
wx = rw / bw;
|
||||||
wx = rw / bw
|
hx = rh / bh;
|
||||||
hx = rh / bh
|
} else {
|
||||||
console.log(this.scaleNum)
|
|
||||||
}else{
|
|
||||||
console.log('非全屏')
|
|
||||||
console.log(this.$store.state.app.sidebar.opened)
|
|
||||||
if (this.$store.state.app.sidebar.opened) {
|
if (this.$store.state.app.sidebar.opened) {
|
||||||
wx = (rw-280) / bw
|
wx = (rw - 280) / bw;
|
||||||
hx = (rh-116) / bh
|
hx = (rh - 116) / bh;
|
||||||
}else{
|
} else {
|
||||||
wx = (rw-85) / bw
|
wx = (rw - 85) / bw;
|
||||||
hx = (rh-116) / bh
|
hx = (rh - 116) / bh;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.scaleNum = wx
|
this.scaleNum = wx;
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -76,10 +76,6 @@ export default {
|
|||||||
name: this.chartData[i].objName + this.chartData[i].objCode,
|
name: this.chartData[i].objName + this.chartData[i].objCode,
|
||||||
type: 'bar',
|
type: 'bar',
|
||||||
barMaxWidth: 20,
|
barMaxWidth: 20,
|
||||||
label: {
|
|
||||||
show: true,
|
|
||||||
position: 'top',
|
|
||||||
},
|
|
||||||
data: [],
|
data: [],
|
||||||
};
|
};
|
||||||
legendData.push(this.chartData[i].objName + this.chartData[i].objCode);
|
legendData.push(this.chartData[i].objName + this.chartData[i].objCode);
|
||||||
|
|||||||
@@ -1,8 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="searchBarBox divHeight"
|
class="searchBarBox divHeight"
|
||||||
ref="searchBarRef"
|
ref="searchBarRef">
|
||||||
:style="{ paddingRight: isFold ? '55px' : '0px' }">
|
|
||||||
<el-form
|
<el-form
|
||||||
:inline="true"
|
:inline="true"
|
||||||
class="demo-form-inline">
|
class="demo-form-inline">
|
||||||
@@ -200,13 +199,6 @@
|
|||||||
</el-button>
|
</el-button>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<span
|
|
||||||
v-if="isFold"
|
|
||||||
class="foldClass"
|
|
||||||
@click="switchMode">
|
|
||||||
{{ isExpand ? '收起' : '展开' }}
|
|
||||||
<svg-icon :icon-class="isExpand ? 'upward' : 'downward'" />
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@@ -217,16 +209,8 @@ import { getFactoryList } from '@/api/core/base/factory';
|
|||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
export default {
|
export default {
|
||||||
name: 'searchArea',
|
name: 'searchArea',
|
||||||
props: {
|
|
||||||
isFold: {
|
|
||||||
// 多行模式(默认否)
|
|
||||||
type: Boolean,
|
|
||||||
default: false,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
isExpand: false, // 展开收起
|
|
||||||
// 查询参数
|
// 查询参数
|
||||||
queryParams: {
|
queryParams: {
|
||||||
energyTypeId: null,
|
energyTypeId: null,
|
||||||
@@ -525,16 +509,6 @@ export default {
|
|||||||
let value = new Date(newData).getTime();
|
let value = new Date(newData).getTime();
|
||||||
return value;
|
return value;
|
||||||
},
|
},
|
||||||
switchMode() {
|
|
||||||
// 展开和收起切换
|
|
||||||
this.isExpand = !this.isExpand;
|
|
||||||
const element = this.$refs.searchBarRef;
|
|
||||||
if (this.isExpand) {
|
|
||||||
element.classList.remove('divHeight');
|
|
||||||
} else {
|
|
||||||
element.classList.add('divHeight');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -573,21 +547,6 @@ export default {
|
|||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.searchBarBox .foldClass {
|
|
||||||
position: absolute;
|
|
||||||
top: 14px;
|
|
||||||
right: 0;
|
|
||||||
cursor: pointer;
|
|
||||||
font-size: 12px;
|
|
||||||
color: #0b58ff;
|
|
||||||
}
|
|
||||||
.searchBarBox .foldClass .iconfont {
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
.divHeight {
|
|
||||||
height: 45px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
.separateStyle {
|
.separateStyle {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 1px;
|
width: 1px;
|
||||||
|
|||||||
@@ -4,7 +4,6 @@
|
|||||||
id="contrastAnalysisBox">
|
id="contrastAnalysisBox">
|
||||||
<!-- 搜索工作栏 -->
|
<!-- 搜索工作栏 -->
|
||||||
<search-area
|
<search-area
|
||||||
:isFold="isFold"
|
|
||||||
@submit="getList"
|
@submit="getList"
|
||||||
@export="exportExl" />
|
@export="exportExl" />
|
||||||
<div v-show="chartData.length">
|
<div v-show="chartData.length">
|
||||||
@@ -38,7 +37,6 @@ export default {
|
|||||||
mixins: [tableHeightMixin],
|
mixins: [tableHeightMixin],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
isFold: false,
|
|
||||||
chartData: [],
|
chartData: [],
|
||||||
timeDim: '',
|
timeDim: '',
|
||||||
tableProps: [],
|
tableProps: [],
|
||||||
@@ -46,13 +44,6 @@ export default {
|
|||||||
tableH: this.tableHeight(250) / 2,
|
tableH: this.tableHeight(250) / 2,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
|
||||||
window.addEventListener('resize', () => {
|
|
||||||
this.isFold = this.searchBarWidth('contrastAnalysisBox', 1437);
|
|
||||||
// console.log(document.getElementById("contrastAnalysisBox").offsetWidth)
|
|
||||||
});
|
|
||||||
this.isFold = this.searchBarWidth('contrastAnalysisBox', 1437);
|
|
||||||
},
|
|
||||||
methods: {
|
methods: {
|
||||||
_setTableHeight() {
|
_setTableHeight() {
|
||||||
this.tableH = this.tableHeight(250) / 2;
|
this.tableH = this.tableHeight(250) / 2;
|
||||||
|
|||||||
@@ -1,138 +1,131 @@
|
|||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
id="analysischartLine"
|
id="analysischartLine"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
:style="{ height: chartHeight + 'px' }"
|
:style="{ height: chartHeight + 'px' }"></div>
|
||||||
></div>
|
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import * as echarts from 'echarts'
|
import * as echarts from 'echarts';
|
||||||
import resize from '@/utils/chartMixins/resize'
|
import resize from '@/utils/chartMixins/resize';
|
||||||
export default {
|
export default {
|
||||||
name: "LineChart",
|
name: 'LineChart',
|
||||||
mixins: [resize],
|
mixins: [resize],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
chartDom: '',
|
chartDom: '',
|
||||||
chart: '',
|
chart: '',
|
||||||
chartHeight: this.tableHeight(370)
|
chartHeight: this.tableHeight(370),
|
||||||
}
|
};
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
chartData: {
|
chartData: {
|
||||||
type: Array,
|
type: Array,
|
||||||
required: true,
|
required: true,
|
||||||
default: () => {
|
default: () => {
|
||||||
return []
|
return [];
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
chartData: function () {
|
chartData: function () {
|
||||||
this.getChart()
|
this.getChart();
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
window.addEventListener('resize', () => {
|
window.addEventListener('resize', () => {
|
||||||
this.chartHeight = this.tableHeight(370)
|
this.chartHeight = this.tableHeight(370);
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
getChart() {
|
getChart() {
|
||||||
if (
|
if (
|
||||||
this.chart !== null &&
|
this.chart !== null &&
|
||||||
this.chart !== '' &&
|
this.chart !== '' &&
|
||||||
this.chart !== undefined
|
this.chart !== undefined
|
||||||
) {
|
) {
|
||||||
this.chart.dispose() // 页面多次刷新会出现警告,Dom已经初始化了一个实例,这是销毁实例
|
this.chart.dispose(); // 页面多次刷新会出现警告,Dom已经初始化了一个实例,这是销毁实例
|
||||||
}
|
}
|
||||||
this.chartDom = document.getElementById('analysischartLine')
|
this.chartDom = document.getElementById('analysischartLine');
|
||||||
this.chart = echarts.init(this.chartDom)
|
this.chart = echarts.init(this.chartDom);
|
||||||
if (this.chartData.length === 0) {
|
if (this.chartData.length === 0) {
|
||||||
return false
|
return false;
|
||||||
}
|
}
|
||||||
let arr = this.chartData[0].type // [水,电,煤]
|
let arr = this.chartData[0].type; // [水,电,煤]
|
||||||
let keys = Object.keys(this.chartData[0])
|
let keys = Object.keys(this.chartData[0]);
|
||||||
let yData = [
|
let yData = [
|
||||||
{
|
{
|
||||||
name: '本期',
|
name: '本期',
|
||||||
type: 'bar',
|
type: 'bar',
|
||||||
data: [],
|
data: [],
|
||||||
barWidth: 20,
|
barWidth: 20,
|
||||||
label: {
|
},
|
||||||
show: true,
|
{
|
||||||
position: 'top'
|
name: '上期',
|
||||||
}
|
type: 'bar',
|
||||||
},
|
data: [],
|
||||||
{
|
barWidth: 20,
|
||||||
name: '上期',
|
},
|
||||||
type: 'bar',
|
];
|
||||||
data: [],
|
for (let j = 0; j < arr.length; j++) {
|
||||||
barWidth: 20,
|
for (let k = 0; k < keys.length; k++) {
|
||||||
label: {
|
if (keys[k].indexOf(arr[j] + '_上期') > -1) {
|
||||||
show: true,
|
yData[1].data.push(this.chartData[0][keys[k]]);
|
||||||
position: 'top'
|
}
|
||||||
}
|
if (keys[k].indexOf(arr[j] + '_能源消耗') > -1) {
|
||||||
}
|
yData[0].data.push(this.chartData[0][keys[k]]);
|
||||||
]
|
}
|
||||||
for (let j = 0; j < arr.length; j++) {
|
}
|
||||||
for (let k = 0; k < keys.length; k++) {
|
}
|
||||||
if (keys[k].indexOf(arr[j]+'_上期') > -1) {
|
var option = {
|
||||||
yData[1].data.push(this.chartData[0][keys[k]])
|
color: ['#288AFF', '#8EF0AB'],
|
||||||
}
|
tooltip: {
|
||||||
if (keys[k].indexOf(arr[j]+'_能源消耗') > -1) {
|
trigger: 'axis',
|
||||||
yData[0].data.push(this.chartData[0][keys[k]])
|
axisPointer: {
|
||||||
}
|
type: 'shadow',
|
||||||
}
|
},
|
||||||
}
|
formatter: function (params) {
|
||||||
var option = {
|
return (
|
||||||
color:['#288AFF','#8EF0AB'],
|
params[0].axisValue +
|
||||||
tooltip: {
|
`<br>` +
|
||||||
trigger: 'axis',
|
params
|
||||||
axisPointer: {
|
.map((item) => {
|
||||||
type: 'shadow'
|
let str = `<span style="display:inline-block;width:8px;height:8px;margin: 0 8px 0 -3px;border-radius:2px;background-color:${item.color};"></span>`;
|
||||||
},
|
let seriesNameStr = `<span style="display:inline-block;">${item.seriesName}</span>`;
|
||||||
formatter: function(params) {
|
let value = item.value ? item.value : '-';
|
||||||
return (
|
let valueStr = `<span style="display:inline-block;margin-left:10px;color:rgba(0,0,0,0.45);">${value}</span>`;
|
||||||
params[0].axisValue +
|
return `<span style="display:flex; justify-content:space-between; margin-bottom: 2px">
|
||||||
`<br>` +
|
|
||||||
params.map((item) => {
|
|
||||||
let str = `<span style="display:inline-block;width:8px;height:8px;margin: 0 8px 0 -3px;border-radius:2px;background-color:${item.color};"></span>`
|
|
||||||
let seriesNameStr = `<span style="display:inline-block;">${item.seriesName}</span>`
|
|
||||||
let value = item.value ? item.value : '-'
|
|
||||||
let valueStr = `<span style="display:inline-block;margin-left:10px;color:rgba(0,0,0,0.45);">${value}</span>`
|
|
||||||
return `<span style="display:flex; justify-content:space-between; margin-bottom: 2px">
|
|
||||||
<span>${str}${seriesNameStr}</span>
|
<span>${str}${seriesNameStr}</span>
|
||||||
<span>${valueStr}</span>
|
<span>${valueStr}</span>
|
||||||
</span>`
|
</span>`;
|
||||||
}).join(``)
|
})
|
||||||
)
|
.join(``)
|
||||||
}
|
);
|
||||||
},
|
},
|
||||||
legend: {
|
},
|
||||||
right: '1%',
|
legend: {
|
||||||
icon: 'rect',
|
right: '1%',
|
||||||
itemHeight: 8,
|
icon: 'rect',
|
||||||
itemWidth: 8
|
itemHeight: 8,
|
||||||
},
|
itemWidth: 8,
|
||||||
grid: {
|
},
|
||||||
left: '1%',
|
grid: {
|
||||||
right: '1%',
|
left: '1%',
|
||||||
bottom: '3%',
|
right: '1%',
|
||||||
containLabel: true
|
bottom: '3%',
|
||||||
},
|
containLabel: true,
|
||||||
yAxis: {
|
},
|
||||||
type: 'value',
|
yAxis: {
|
||||||
boundaryGap: [0, 0.01]
|
type: 'value',
|
||||||
},
|
boundaryGap: [0, 0.01],
|
||||||
xAxis: {
|
},
|
||||||
type: 'category',
|
xAxis: {
|
||||||
data: arr
|
type: 'category',
|
||||||
},
|
data: arr,
|
||||||
series: yData
|
},
|
||||||
}
|
series: yData,
|
||||||
option && this.chart.setOption(option);
|
};
|
||||||
}
|
option && this.chart.setOption(option);
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
</script>
|
};
|
||||||
|
</script>
|
||||||
|
|||||||
@@ -68,9 +68,9 @@ export default {
|
|||||||
|
|
||||||
var option = {
|
var option = {
|
||||||
color: ['#288AFF'],
|
color: ['#288AFF'],
|
||||||
// tooltip: {
|
tooltip: {
|
||||||
// trigger: 'axis'
|
trigger: 'axis',
|
||||||
// },
|
},
|
||||||
grid: {
|
grid: {
|
||||||
left: '4%',
|
left: '4%',
|
||||||
right: '1%',
|
right: '1%',
|
||||||
|
|||||||
@@ -1,8 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="searchBarBox divHeight"
|
class="searchBarBox"
|
||||||
ref="searchBarRef"
|
ref="searchBarRef">
|
||||||
:style="{ paddingRight: isFold ? '55px' : '0px' }">
|
|
||||||
<el-form
|
<el-form
|
||||||
:inline="true"
|
:inline="true"
|
||||||
class="demo-form-inline">
|
class="demo-form-inline">
|
||||||
@@ -172,9 +171,9 @@
|
|||||||
</el-button>
|
</el-button>
|
||||||
<span
|
<span
|
||||||
class="separateStyle"
|
class="separateStyle"
|
||||||
v-hasPermi="['analysis:trend-analysis:export']"></span>
|
v-hasPermi="['analysis:energy-analysis:query']"></span>
|
||||||
<el-button
|
<el-button
|
||||||
v-hasPermi="['analysis:trend-analysis:export']"
|
v-hasPermi="['analysis:energy-analysis:query']"
|
||||||
type="primary"
|
type="primary"
|
||||||
size="small"
|
size="small"
|
||||||
plain
|
plain
|
||||||
@@ -183,13 +182,6 @@
|
|||||||
</el-button>
|
</el-button>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<span
|
|
||||||
v-if="isFold"
|
|
||||||
class="foldClass"
|
|
||||||
@click="switchMode">
|
|
||||||
{{ isExpand ? '收起' : '展开' }}
|
|
||||||
<svg-icon :icon-class="isExpand ? 'upward' : 'downward'" />
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@@ -198,16 +190,8 @@ import { getEnergyTypeListAll } from '@/api/base/energyType';
|
|||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
export default {
|
export default {
|
||||||
name: 'searchArea',
|
name: 'searchArea',
|
||||||
props: {
|
|
||||||
isFold: {
|
|
||||||
// 多行模式(默认否)
|
|
||||||
type: Boolean,
|
|
||||||
default: false,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
isExpand: false, // 展开收起
|
|
||||||
// 查询参数
|
// 查询参数
|
||||||
queryParams: {
|
queryParams: {
|
||||||
energyTypeId: null,
|
energyTypeId: null,
|
||||||
@@ -509,16 +493,6 @@ export default {
|
|||||||
let value = new Date(newData).getTime();
|
let value = new Date(newData).getTime();
|
||||||
return value;
|
return value;
|
||||||
},
|
},
|
||||||
switchMode() {
|
|
||||||
// 展开和收起切换
|
|
||||||
this.isExpand = !this.isExpand;
|
|
||||||
const element = this.$refs.searchBarRef;
|
|
||||||
if (this.isExpand) {
|
|
||||||
element.classList.remove('divHeight');
|
|
||||||
} else {
|
|
||||||
element.classList.add('divHeight');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -557,21 +531,6 @@ export default {
|
|||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.searchBarBox .foldClass {
|
|
||||||
position: absolute;
|
|
||||||
top: 14px;
|
|
||||||
right: 0;
|
|
||||||
cursor: pointer;
|
|
||||||
font-size: 12px;
|
|
||||||
color: #0b58ff;
|
|
||||||
}
|
|
||||||
.searchBarBox .foldClass .iconfont {
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
.divHeight {
|
|
||||||
height: 45px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
.separateStyle {
|
.separateStyle {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 1px;
|
width: 1px;
|
||||||
|
|||||||
@@ -4,7 +4,6 @@
|
|||||||
id="trendAnalysisBox">
|
id="trendAnalysisBox">
|
||||||
<!-- 搜索工作栏 -->
|
<!-- 搜索工作栏 -->
|
||||||
<search-area
|
<search-area
|
||||||
:isFold="isFold"
|
|
||||||
@submit="getList"
|
@submit="getList"
|
||||||
@export="exportExl" />
|
@export="exportExl" />
|
||||||
<div v-show="chartData.length">
|
<div v-show="chartData.length">
|
||||||
@@ -33,20 +32,12 @@ export default {
|
|||||||
components: { SearchArea, LineChart },
|
components: { SearchArea, LineChart },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
isFold: false,
|
|
||||||
chartData: [],
|
chartData: [],
|
||||||
timeDim: '',
|
timeDim: '',
|
||||||
tableProps: [],
|
tableProps: [],
|
||||||
list: [],
|
list: [],
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
|
||||||
window.addEventListener('resize', () => {
|
|
||||||
this.tableH = this.tableHeight(260);
|
|
||||||
this.isFold = this.searchBarWidth('trendAnalysisBox', 1480);
|
|
||||||
});
|
|
||||||
this.isFold = this.searchBarWidth('trendAnalysisBox', 1480);
|
|
||||||
},
|
|
||||||
methods: {
|
methods: {
|
||||||
getList(params) {
|
getList(params) {
|
||||||
this.timeDim = params.timeDim;
|
this.timeDim = params.timeDim;
|
||||||
@@ -66,8 +57,14 @@ export default {
|
|||||||
let listObj = { useNum: '消耗量' }; // 数据
|
let listObj = { useNum: '消耗量' }; // 数据
|
||||||
for (let i = 0; i < arr.length; i++) {
|
for (let i = 0; i < arr.length; i++) {
|
||||||
let obj = {};
|
let obj = {};
|
||||||
|
if (this.timeDim === '3') {
|
||||||
|
let fName = arr[i].time.slice(0, 4);
|
||||||
|
let lName = arr[i].time.slice(4, 6);
|
||||||
|
obj.label = fName + ' 第 ' + lName + ' 周';
|
||||||
|
} else {
|
||||||
|
obj.label = arr[i].time;
|
||||||
|
}
|
||||||
obj.prop = arr[i].time;
|
obj.prop = arr[i].time;
|
||||||
obj.label = arr[i].time;
|
|
||||||
obj.minWidth = 100;
|
obj.minWidth = 100;
|
||||||
tempX.push(obj);
|
tempX.push(obj);
|
||||||
listObj[arr[i].time] = arr[i].useNum || null;
|
listObj[arr[i].time] = arr[i].useNum || null;
|
||||||
@@ -77,37 +74,20 @@ export default {
|
|||||||
},
|
},
|
||||||
// 导出excel
|
// 导出excel
|
||||||
exportExl(params) {
|
exportExl(params) {
|
||||||
exportTrend({ ...params }).then((res) => {
|
exportTrend({ ...params })
|
||||||
// let fileName = '';
|
.then((response) => {
|
||||||
// const contentDisposition = res.headers['content-disposition'];
|
this.$download.excel(response, '走势分析.xls');
|
||||||
// if (contentDisposition) {
|
|
||||||
// fileName = decodeURIComponent(
|
|
||||||
// contentDisposition.slice(
|
|
||||||
// contentDisposition.indexOf('filename=') + 9
|
|
||||||
// )
|
|
||||||
// );
|
|
||||||
// }
|
|
||||||
const blob = new Blob([res.data]);
|
|
||||||
const reader = new FileReader();
|
|
||||||
reader.readAsDataURL(blob);
|
|
||||||
reader.onload = (e) => {
|
|
||||||
const a = document.createElement('a');
|
|
||||||
a.download = '走势分析';
|
|
||||||
a.href = e.target.result;
|
|
||||||
document.body.appendChild(a);
|
|
||||||
a.click();
|
|
||||||
document.body.removeChild(a);
|
|
||||||
this.$message.success('导出成功');
|
this.$message.success('导出成功');
|
||||||
};
|
})
|
||||||
});
|
.catch(() => {});
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang='scss'>
|
<style lang="scss">
|
||||||
.trendAnalysisBox {
|
.trendAnalysisBox {
|
||||||
.trend-out-table {
|
.trend-out-table {
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -89,13 +89,13 @@ export default {
|
|||||||
param: 'name',
|
param: 'name',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'button',
|
type: this.$auth.hasPermi('base:energy-plc:query') ? 'button' : '',
|
||||||
btnName: '查询',
|
btnName: '查询',
|
||||||
name: 'search',
|
name: 'search',
|
||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:energy-plc:create') ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:energy-plc:create') ? 'button' : '',
|
type: this.$auth.hasPermi('base:energy-plc:create') ? 'button' : '',
|
||||||
|
|||||||
@@ -116,7 +116,7 @@ export default {
|
|||||||
},
|
},
|
||||||
selectObj(val) {
|
selectObj(val) {
|
||||||
this.form.bindObjectId = val[val.length - 1];
|
this.form.bindObjectId = val[val.length - 1];
|
||||||
this.form.bindObjectType = val.length - 1;
|
this.form.bindObjectType = val.length;
|
||||||
},
|
},
|
||||||
submitForm() {
|
submitForm() {
|
||||||
this.$refs['form'].validate((valid) => {
|
this.$refs['form'].validate((valid) => {
|
||||||
@@ -152,4 +152,4 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -22,7 +22,9 @@
|
|||||||
readonly
|
readonly
|
||||||
style="width: 250px"></el-input>
|
style="width: 250px"></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="showBtn">
|
<el-form-item
|
||||||
|
v-if="showBtn"
|
||||||
|
v-hasPermi="['base:energy-plc-param:create']">
|
||||||
<el-button
|
<el-button
|
||||||
type="success"
|
type="success"
|
||||||
size="small"
|
size="small"
|
||||||
@@ -160,15 +162,19 @@ export default {
|
|||||||
this.drawerTitle = '参数绑定';
|
this.drawerTitle = '参数绑定';
|
||||||
this.showBtn = true;
|
this.showBtn = true;
|
||||||
this.tableBtn = [
|
this.tableBtn = [
|
||||||
{
|
this.$auth.hasPermi('base:energy-plc-param:update')
|
||||||
type: 'edit',
|
? {
|
||||||
btnName: '编辑',
|
type: 'edit',
|
||||||
},
|
btnName: '编辑',
|
||||||
{
|
}
|
||||||
type: 'delete',
|
: undefined,
|
||||||
btnName: '删除',
|
this.$auth.hasPermi('base:energy-plc-param:delete')
|
||||||
},
|
? {
|
||||||
];
|
type: 'delete',
|
||||||
|
btnName: '删除',
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
].filter((v) => v);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
getList() {
|
getList() {
|
||||||
|
|||||||
@@ -107,13 +107,17 @@ export default {
|
|||||||
param: 'cnName',
|
param: 'cnName',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'button',
|
type: this.$auth.hasPermi('base:energy-plc-connect:query')
|
||||||
|
? 'button'
|
||||||
|
: '',
|
||||||
btnName: '查询',
|
btnName: '查询',
|
||||||
name: 'search',
|
name: 'search',
|
||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:energy-plc-connect:create')
|
||||||
|
? 'separate'
|
||||||
|
: '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:energy-plc-connect:create')
|
type: this.$auth.hasPermi('base:energy-plc-connect:create')
|
||||||
@@ -127,17 +131,25 @@ export default {
|
|||||||
],
|
],
|
||||||
tableProps,
|
tableProps,
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
this.$auth.hasPermi('base:energy-plc-connect:bind')
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:energy-plc-param:query',
|
||||||
|
'base:energy-type:query',
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'connect',
|
type: 'connect',
|
||||||
btnName: '绑定',
|
btnName: '绑定',
|
||||||
}
|
}
|
||||||
: undefined,
|
: undefined,
|
||||||
{
|
this.$auth.hasPermi('base:energy-plc-param:query')
|
||||||
type: 'detail',
|
? {
|
||||||
btnName: '详情',
|
type: 'detail',
|
||||||
},
|
btnName: '详情',
|
||||||
this.$auth.hasPermi('base:energy-plc-connect:update')
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:energy-plc-connect:update',
|
||||||
|
'base:energy-plc-connect:query',
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'edit',
|
type: 'edit',
|
||||||
btnName: '编辑',
|
btnName: '编辑',
|
||||||
|
|||||||
@@ -45,6 +45,7 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
<el-button
|
<el-button
|
||||||
|
v-show="!isEdit"
|
||||||
class="addButton"
|
class="addButton"
|
||||||
icon="el-icon-plus"
|
icon="el-icon-plus"
|
||||||
@click="emitButtonClick">
|
@click="emitButtonClick">
|
||||||
@@ -70,6 +71,13 @@ export default {
|
|||||||
return [];
|
return [];
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
isEdit: {
|
||||||
|
type: Boolean,
|
||||||
|
required: true,
|
||||||
|
default: () => {
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {};
|
return {};
|
||||||
|
|||||||
@@ -42,6 +42,7 @@
|
|||||||
<add-table
|
<add-table
|
||||||
:table-data="tableData"
|
:table-data="tableData"
|
||||||
:table-name-list="tableNameList"
|
:table-name-list="tableNameList"
|
||||||
|
:isEdit="isEdit"
|
||||||
@emitFun="inputChange"
|
@emitFun="inputChange"
|
||||||
@emitButtonClick="emitButtonClick" />
|
@emitButtonClick="emitButtonClick" />
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|||||||
@@ -114,13 +114,20 @@ export default {
|
|||||||
defaultSelect: [],
|
defaultSelect: [],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'button',
|
type: this.$auth.hasPermi('base:energy-quantity-manual:query')
|
||||||
|
? 'button'
|
||||||
|
: '',
|
||||||
btnName: '查询',
|
btnName: '查询',
|
||||||
name: 'search',
|
name: 'search',
|
||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermiOr([
|
||||||
|
'base:energy-quantity-manual:export',
|
||||||
|
'base:energy-quantity-manual:create',
|
||||||
|
])
|
||||||
|
? 'separate'
|
||||||
|
: '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:energy-quantity-manual:export')
|
type: this.$auth.hasPermi('base:energy-quantity-manual:export')
|
||||||
@@ -147,13 +154,19 @@ export default {
|
|||||||
// 班次基础信息列表
|
// 班次基础信息列表
|
||||||
list: [],
|
list: [],
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
this.$auth.hasPermi('base:energy-quantity-manual:create')
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:energy-quantity-manual:query',
|
||||||
|
'base:energy-quantity-manual:create',
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'meterReading',
|
type: 'meterReading',
|
||||||
btnName: '抄表',
|
btnName: '抄表',
|
||||||
}
|
}
|
||||||
: undefined,
|
: undefined,
|
||||||
this.$auth.hasPermi('base:energy-quantity-manual:update')
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:energy-quantity-manual:update',
|
||||||
|
'base:energy-quantity-manual:query',
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'edit',
|
type: 'edit',
|
||||||
btnName: '编辑',
|
btnName: '编辑',
|
||||||
|
|||||||
@@ -90,7 +90,9 @@ export default {
|
|||||||
width: 350,
|
width: 350,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'button',
|
type: this.$auth.hasPermi('base:energy-quantity-realtime:query')
|
||||||
|
? 'button'
|
||||||
|
: '',
|
||||||
btnName: '查询',
|
btnName: '查询',
|
||||||
name: 'search',
|
name: 'search',
|
||||||
color: 'primary',
|
color: 'primary',
|
||||||
|
|||||||
@@ -52,7 +52,10 @@ export default {
|
|||||||
return {
|
return {
|
||||||
tableProps,
|
tableProps,
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
this.$auth.hasPermi('base:table-name-config:edit')
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:energy-table:query',
|
||||||
|
'base:energy-table:update',
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'edit',
|
type: 'edit',
|
||||||
btnName: '编辑',
|
btnName: '编辑',
|
||||||
|
|||||||
@@ -66,7 +66,7 @@
|
|||||||
placeholder="请选择"
|
placeholder="请选择"
|
||||||
style="width: 100%">
|
style="width: 100%">
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in getDictDatas(DICT_TYPE.TABLE_NAME)"
|
v-for="item in tableNameList"
|
||||||
:key="item.value"
|
:key="item.value"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:value="item.value"></el-option>
|
:value="item.value"></el-option>
|
||||||
@@ -154,6 +154,7 @@ import {
|
|||||||
createEnergyLimit,
|
createEnergyLimit,
|
||||||
getEnergyParamList,
|
getEnergyParamList,
|
||||||
} from '@/api/monitoring/energyLimit';
|
} from '@/api/monitoring/energyLimit';
|
||||||
|
import { energyTableGet } from '@/api/base/energyQuantityManual';
|
||||||
export default {
|
export default {
|
||||||
name: 'energyLimitAdd',
|
name: 'energyLimitAdd',
|
||||||
props: {
|
props: {
|
||||||
@@ -203,6 +204,7 @@ export default {
|
|||||||
{ required: true, message: '指标类型不能为空', trigger: 'change' },
|
{ required: true, message: '指标类型不能为空', trigger: 'change' },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
tableNameList: [],
|
||||||
detailList: [],
|
detailList: [],
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
@@ -214,10 +216,10 @@ export default {
|
|||||||
getEnergyLimit(id).then((res) => {
|
getEnergyLimit(id).then((res) => {
|
||||||
if (res.code === 0) {
|
if (res.code === 0) {
|
||||||
this.form = res.data;
|
this.form = res.data;
|
||||||
this.form.plcParamId = res.data.plcParamId || '';
|
|
||||||
this.form.tableName = this.form.tableName
|
this.form.tableName = this.form.tableName
|
||||||
? this.form.tableName + ''
|
? this.form.tableName + ''
|
||||||
: '';
|
: '';
|
||||||
|
this.form.plcParamId = res.data.plcParamId || '';
|
||||||
this.form.method = this.form.method ? this.form.method + '' : '';
|
this.form.method = this.form.method ? this.form.method + '' : '';
|
||||||
this.form.limitType = this.form.limitType
|
this.form.limitType = this.form.limitType
|
||||||
? this.form.limitType + ''
|
? this.form.limitType + ''
|
||||||
@@ -229,6 +231,9 @@ export default {
|
|||||||
if (this.form.type === 2) {
|
if (this.form.type === 2) {
|
||||||
this.getDetailList();
|
this.getDetailList();
|
||||||
}
|
}
|
||||||
|
if (this.form.energyTypeId) {
|
||||||
|
this.getTableNameList(this.form.energyTypeId);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
@@ -267,11 +272,22 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
toggleType() {
|
toggleType() {
|
||||||
if (this.form.energyTypeId && this.form.type) {
|
if (this.form.energyTypeId && this.form.method == 2) {
|
||||||
this.getDetailList();
|
this.form.tableName = '';
|
||||||
this.form.plcParamId = '';
|
this.getTableNameList(this.form.energyTypeId);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
// 获取能源表名list
|
||||||
|
getTableNameList(id) {
|
||||||
|
energyTableGet({ energyTypeId: id }).then((res) => {
|
||||||
|
this.tableNameList = res.data.tableObjs || [];
|
||||||
|
if (this.tableNameList.length === 0) {
|
||||||
|
this.$modal.msgWarning(
|
||||||
|
'当前能源类型暂无配置表名,请先到《表名配置》页面配置'
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
// 递归处理分类回显问题
|
// 递归处理分类回显问题
|
||||||
changeDetSelect(key, treeData) {
|
changeDetSelect(key, treeData) {
|
||||||
let arr = []; // 递归时操作的数组
|
let arr = []; // 递归时操作的数组
|
||||||
|
|||||||
@@ -125,13 +125,17 @@ export default {
|
|||||||
param: 'limitType',
|
param: 'limitType',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'button',
|
type: this.$auth.hasPermi('monitoring:energy-limit:query')
|
||||||
|
? 'button'
|
||||||
|
: '',
|
||||||
btnName: '查询',
|
btnName: '查询',
|
||||||
name: 'search',
|
name: 'search',
|
||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('monitoring:energy-limit:create')
|
||||||
|
? 'separate'
|
||||||
|
: '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('monitoring:energy-limit:create')
|
type: this.$auth.hasPermi('monitoring:energy-limit:create')
|
||||||
@@ -262,8 +266,9 @@ export default {
|
|||||||
},
|
},
|
||||||
/** 删除按钮操作 */
|
/** 删除按钮操作 */
|
||||||
handleDelete(row) {
|
handleDelete(row) {
|
||||||
|
console.log(row);
|
||||||
this.$modal
|
this.$modal
|
||||||
.confirm('是否确认删除监控对象为"' + row.objName + '"的数据项?')
|
.confirm('是否确认删除第"' + row._pageIndex + '"条数据项?')
|
||||||
.then(function () {
|
.then(function () {
|
||||||
return deleteEnergyLimit(row.id);
|
return deleteEnergyLimit(row.id);
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -113,7 +113,9 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('monitoring:energy-report:export')
|
||||||
|
? 'separate'
|
||||||
|
: '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('monitoring:energy-report:export')
|
type: this.$auth.hasPermi('monitoring:energy-report:export')
|
||||||
|
|||||||
@@ -22,6 +22,7 @@
|
|||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button
|
<el-button
|
||||||
|
v-hasPermi="['monitoring:energy-statistics-det:query']"
|
||||||
type="success"
|
type="success"
|
||||||
size="small"
|
size="small"
|
||||||
v-if="showBtn"
|
v-if="showBtn"
|
||||||
@@ -30,6 +31,7 @@
|
|||||||
新增
|
新增
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button
|
<el-button
|
||||||
|
v-hasPermi="['monitoring:energy-statistics-det:delete']"
|
||||||
type="danger"
|
type="danger"
|
||||||
size="small"
|
size="small"
|
||||||
v-if="showBtn"
|
v-if="showBtn"
|
||||||
@@ -161,11 +163,13 @@ export default {
|
|||||||
this.drawerTitle = '参数绑定';
|
this.drawerTitle = '参数绑定';
|
||||||
this.showBtn = true;
|
this.showBtn = true;
|
||||||
this.tableBtn = [
|
this.tableBtn = [
|
||||||
{
|
this.$auth.hasPermi('monitoring:energy-statistics-det:delete')
|
||||||
type: 'delete',
|
? {
|
||||||
btnName: '删除',
|
type: 'delete',
|
||||||
},
|
btnName: '删除',
|
||||||
];
|
}
|
||||||
|
: undefined,
|
||||||
|
].filter((v) => v);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
getList() {
|
getList() {
|
||||||
|
|||||||
@@ -88,7 +88,9 @@ export default {
|
|||||||
type: 'separate',
|
type: 'separate',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'button',
|
type: this.$auth.hasPermi('monitoring:energy-statistics-det:create')
|
||||||
|
? 'button'
|
||||||
|
: '',
|
||||||
btnName: '关联',
|
btnName: '关联',
|
||||||
name: 'add',
|
name: 'add',
|
||||||
color: 'primary',
|
color: 'primary',
|
||||||
|
|||||||
@@ -103,8 +103,11 @@ export default {
|
|||||||
name: 'search',
|
name: 'search',
|
||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('monitoring:energy-statistics:create')
|
||||||
|
? 'separate'
|
||||||
|
: '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('monitoring:energy-statistics:create')
|
type: this.$auth.hasPermi('monitoring:energy-statistics:create')
|
||||||
@@ -118,17 +121,22 @@ export default {
|
|||||||
],
|
],
|
||||||
tableProps,
|
tableProps,
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
this.$auth.hasPermi('monitoring:energy-statistics:bind')
|
this.$auth.hasPermi('monitoring:energy-statistics-det:query')
|
||||||
? {
|
? {
|
||||||
type: 'connect',
|
type: 'connect',
|
||||||
btnName: '绑定',
|
btnName: '绑定',
|
||||||
}
|
}
|
||||||
: undefined,
|
: undefined,
|
||||||
{
|
this.$auth.hasPermi('monitoring:energy-statistics:query')
|
||||||
type: 'detail',
|
? {
|
||||||
btnName: '详情',
|
type: 'detail',
|
||||||
},
|
btnName: '详情',
|
||||||
this.$auth.hasPermi('monitoring:energy-statistics:update')
|
}
|
||||||
|
: undefined,
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'monitoring:energy-statistics:update',
|
||||||
|
'monitoring:energy-statistics:query',
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'edit',
|
type: 'edit',
|
||||||
btnName: '编辑',
|
btnName: '编辑',
|
||||||
|
|||||||
@@ -130,8 +130,20 @@ export default {
|
|||||||
{ prop: 'createTime', label: '报警时间', filter: timeFilter, width: 150, showOverflowtooltip: true },
|
{ prop: 'createTime', label: '报警时间', filter: timeFilter, width: 150, showOverflowtooltip: true },
|
||||||
{ prop: 'alarmCode', label: '设备报警码', width: 180, showOverflowtooltip: true },
|
{ prop: 'alarmCode', label: '设备报警码', width: 180, showOverflowtooltip: true },
|
||||||
{ prop: 'alarmContent', label: '报警内容', width: 150, showOverflowtooltip: true },
|
{ prop: 'alarmContent', label: '报警内容', width: 150, showOverflowtooltip: true },
|
||||||
{ prop: 'opt1', label: '处理记录', name: '查看', subcomponent: btn },
|
this.$auth.hasPermiAnd([
|
||||||
{ prop: 'opt2', label: '处理', name: '报警处理', subcomponent: btn },
|
'monitoring:equipment-alarm-log:query',
|
||||||
|
'base:equipment-alarm-hand:query'
|
||||||
|
]) ?
|
||||||
|
{ prop: 'opt1', label: '处理记录', name: '查看', subcomponent: btn } : undefined,
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'monitoring:equipment-alarm-log:query',
|
||||||
|
'base:equipment-alarm-hand:query',
|
||||||
|
'base:core-worker:query',
|
||||||
|
'base:equipment-alarm-hand:create',
|
||||||
|
'base:equipment-alarm-hand:update',
|
||||||
|
'monitoring:equipment-alarm-log:update'
|
||||||
|
]) ?
|
||||||
|
{ prop: 'opt2', label: '处理', name: '报警处理', subcomponent: btn } : undefined,
|
||||||
// { prop: 'remark', label: '备注' },
|
// { prop: 'remark', label: '备注' },
|
||||||
],
|
],
|
||||||
searchBarFormConfig: [
|
searchBarFormConfig: [
|
||||||
|
|||||||
@@ -122,19 +122,30 @@ export default {
|
|||||||
editMode: '',
|
editMode: '',
|
||||||
searchBarKeys: ['name', 'code'],
|
searchBarKeys: ['name', 'code'],
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
this.$auth.hasPermi('equipment:alarm-group:update')
|
this.$auth.hasPermiAnd([
|
||||||
? {
|
'base:equipment-group:query',
|
||||||
|
'base:equipment-group-alarm:query'
|
||||||
|
])
|
||||||
|
? {
|
||||||
type: 'detail',
|
type: 'detail',
|
||||||
btnName: '查看报警',
|
btnName: '查看报警',
|
||||||
}
|
}
|
||||||
: undefined,
|
: undefined,
|
||||||
this.$auth.hasPermi('equipment:alarm-group:update')
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:equipment-group:update',
|
||||||
|
'base:equipment-group:query',
|
||||||
|
'base:equipment-group-alarm:create',
|
||||||
|
'base:equipment-group-alarm:delete',
|
||||||
|
'base:equipment-group-alarm:update',
|
||||||
|
'base:equipment-group-alarm:query',
|
||||||
|
'base:equipment-group-alarm:query'
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'edit',
|
type: 'edit',
|
||||||
btnName: '修改',
|
btnName: '修改',
|
||||||
}
|
}
|
||||||
: undefined,
|
: undefined,
|
||||||
this.$auth.hasPermi('equipment:alarm-group:delete')
|
this.$auth.hasPermi('base:equipment-group:delete')
|
||||||
? {
|
? {
|
||||||
type: 'delete',
|
type: 'delete',
|
||||||
btnName: '删除',
|
btnName: '删除',
|
||||||
@@ -244,10 +255,11 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:equipment-group:create')
|
||||||
|
? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('equipment:alarm-group:create')
|
type: this.$auth.hasPermi('base:equipment-group:create')
|
||||||
? 'button'
|
? 'button'
|
||||||
: '',
|
: '',
|
||||||
btnName: '新增',
|
btnName: '新增',
|
||||||
|
|||||||
@@ -123,13 +123,23 @@ export default {
|
|||||||
return {
|
return {
|
||||||
searchBarKeys: ['groupId', 'equipmentName'],
|
searchBarKeys: ['groupId', 'equipmentName'],
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
this.$auth.hasPermi('equipment:bind-group:update')
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:equipment-group-alarm:query',
|
||||||
|
'base:core-equipment:query'
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'detail',
|
type: 'detail',
|
||||||
btnName: '查看报警',
|
btnName: '查看报警',
|
||||||
}
|
}
|
||||||
: undefined,
|
: undefined,
|
||||||
this.$auth.hasPermi('equipment:bind-group:update')
|
this.$auth.hasPermiAnd([
|
||||||
|
'equipment:bind-group:update',
|
||||||
|
'base:core-equipment:query',
|
||||||
|
'base:equipment-group-alarm:create',
|
||||||
|
'base:equipment-group-alarm:update',
|
||||||
|
'base:equipment-group-alarm:delete',
|
||||||
|
'base:equipment-group-alarm:query'
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'edit',
|
type: 'edit',
|
||||||
btnName: '修改',
|
btnName: '修改',
|
||||||
@@ -201,11 +211,16 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermiAnd([
|
||||||
|
'equipment:bind-group:create',
|
||||||
|
'base:core-equipment:query'
|
||||||
|
]) ? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('equipment:bind-group:create')
|
type: this.$auth.hasPermiAnd([
|
||||||
? 'button'
|
'equipment:bind-group:create',
|
||||||
|
'base:core-equipment:query'
|
||||||
|
]) ? 'button'
|
||||||
: '',
|
: '',
|
||||||
btnName: '新增',
|
btnName: '新增',
|
||||||
name: 'add',
|
name: 'add',
|
||||||
|
|||||||
@@ -140,17 +140,28 @@ export default {
|
|||||||
// tableBtn: [
|
// tableBtn: [
|
||||||
// ].filter((v) => v),
|
// ].filter((v) => v),
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
{
|
this.$auth.hasPermiAnd([
|
||||||
type: 'detail',
|
'base:equipment-plc-connect:query',
|
||||||
btnName: '参数绑定',
|
'base:equipment-plc-param:query'
|
||||||
},
|
])
|
||||||
this.$auth.hasPermi('equipment:collection-config:update')
|
? {
|
||||||
|
type: 'detail',
|
||||||
|
btnName: '参数绑定',
|
||||||
|
} : undefined,
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:equipment-plc-connect:update',
|
||||||
|
'base:equipment-plc-connect:query',
|
||||||
|
'base:equipment-plc-param:create',
|
||||||
|
'base:equipment-plc-param:update',
|
||||||
|
'base:equipment-plc-param:delete',
|
||||||
|
'base:equipment-plc-param:query'
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'edit',
|
type: 'edit',
|
||||||
btnName: '修改',
|
btnName: '修改',
|
||||||
}
|
}
|
||||||
: undefined,
|
: undefined,
|
||||||
this.$auth.hasPermi('equipment:collection-config:delete')
|
this.$auth.hasPermi('base:equipment-plc-connect:delete')
|
||||||
? {
|
? {
|
||||||
type: 'delete',
|
type: 'delete',
|
||||||
btnName: '删除',
|
btnName: '删除',
|
||||||
@@ -158,14 +169,14 @@ export default {
|
|||||||
: undefined,
|
: undefined,
|
||||||
].filter((v) => v),
|
].filter((v) => v),
|
||||||
tableProps: [
|
tableProps: [
|
||||||
{ prop: 'productionLine', label: '产线', width: 120, showOverflowtooltip: true },
|
{ prop: 'productionLine', label: '产线', minWidth: 120, showOverflowtooltip: true },
|
||||||
{ prop: 'workshopSection', label: '工段', width: 120, showOverflowtooltip: true },
|
{ prop: 'workshopSection', label: '工段', minWidth: 120, showOverflowtooltip: true },
|
||||||
{ prop: 'equipmentName', label: '设备名', width: 120, showOverflowtooltip: true },
|
{ prop: 'equipmentName', label: '设备名', minWidth: 120, showOverflowtooltip: true },
|
||||||
{ prop: 'equipmentCode', label: '设备编码', width: 200, showOverflowtooltip: true },
|
{ prop: 'equipmentCode', label: '设备编码', minWidth: 200, showOverflowtooltip: true },
|
||||||
{ prop: 'plcCode', label: '关联表编码', width: 220, showOverflowtooltip: true },
|
{ prop: 'plcCode', label: '关联表编码', minWidth: 220, showOverflowtooltip: true },
|
||||||
{ prop: 'plcTableName', label: '关联表名', width: 150, showOverflowtooltip: true },
|
{ prop: 'plcTableName', label: '关联表名', minWidth: 150, showOverflowtooltip: true },
|
||||||
{ prop: 'plcName', label: '标识名称', width: 150, showOverflowtooltip: true },
|
{ prop: 'plcName', label: '标识名称', minWidth: 150, showOverflowtooltip: true },
|
||||||
{ prop: 'bindingParameters', label: '绑定参数数量', width: 120, showOverflowtooltip: true },
|
{ prop: 'bindingParameters', label: '绑定参数数量', minWidth: 120, showOverflowtooltip: true },
|
||||||
// {
|
// {
|
||||||
// _action: 'params-bind',
|
// _action: 'params-bind',
|
||||||
// label: '查看绑定',
|
// label: '查看绑定',
|
||||||
@@ -217,10 +228,11 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:equipment-plc-connect:create')
|
||||||
|
? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('equipment:collection-config:create')
|
type: this.$auth.hasPermi('base:equipment-plc-connect:create')
|
||||||
? 'button'
|
? 'button'
|
||||||
: '',
|
: '',
|
||||||
// type: 'button',
|
// type: 'button',
|
||||||
|
|||||||
@@ -108,13 +108,16 @@ export default {
|
|||||||
tableKey: Math.random(),
|
tableKey: Math.random(),
|
||||||
searchBarKeys: ['name', 'plcTableName'],
|
searchBarKeys: ['name', 'plcTableName'],
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
this.$auth.hasPermi('equipment:realtime-table-config:update')
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:equipment-plc:update',
|
||||||
|
'base:equipment-plc:query'
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'edit',
|
type: 'edit',
|
||||||
btnName: '修改',
|
btnName: '修改',
|
||||||
}
|
}
|
||||||
: undefined,
|
: undefined,
|
||||||
this.$auth.hasPermi('equipment:realtime-table-config:delete')
|
this.$auth.hasPermi('base:equipment-plc:delete')
|
||||||
? {
|
? {
|
||||||
type: 'delete',
|
type: 'delete',
|
||||||
btnName: '删除',
|
btnName: '删除',
|
||||||
@@ -160,13 +163,12 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('base:equipment-plc:create')
|
||||||
|
? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
// type: this.$auth.hasPermi('equipment:realtime-table-config:create')
|
type: this.$auth.hasPermi('base:equipment-plc:create')
|
||||||
// ? 'button'
|
? 'button' : '',
|
||||||
// : '',
|
|
||||||
type: 'button',
|
|
||||||
btnName: '新增',
|
btnName: '新增',
|
||||||
name: 'add',
|
name: 'add',
|
||||||
plain: true,
|
plain: true,
|
||||||
@@ -194,7 +196,7 @@ export default {
|
|||||||
input: true,
|
input: true,
|
||||||
label: '编码',
|
label: '编码',
|
||||||
prop: 'code',
|
prop: 'code',
|
||||||
url: '/base/equipment-group/getCode',
|
url: '/base/energy-plc/getCode',
|
||||||
rules: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
|
rules: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
|||||||
@@ -91,7 +91,7 @@
|
|||||||
<!-- btns -->
|
<!-- btns -->
|
||||||
<el-table-column width="188" label="操作">
|
<el-table-column width="188" label="操作">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-tooltip content="确认" placement="top">
|
<el-tooltip v-if="$auth.hasPermi('equipment:check:update')" content="确认" placement="top">
|
||||||
<el-button
|
<el-button
|
||||||
type="text"
|
type="text"
|
||||||
style="margin: 5px 0; padding: 0"
|
style="margin: 5px 0; padding: 0"
|
||||||
@@ -101,8 +101,8 @@
|
|||||||
</el-button>
|
</el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<!-- line -->
|
<!-- line -->
|
||||||
<span style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
<span v-if="$auth.hasPermi('equipment:check:query')" style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
||||||
<el-tooltip content="查看详情" placement="top">
|
<el-tooltip v-if="$auth.hasPermi('equipment:check:query')" content="查看详情" placement="top">
|
||||||
<el-button
|
<el-button
|
||||||
type="text"
|
type="text"
|
||||||
style="margin: 5px 0; padding: 0"
|
style="margin: 5px 0; padding: 0"
|
||||||
@@ -111,8 +111,26 @@
|
|||||||
</el-button>
|
</el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<!-- line -->
|
<!-- line -->
|
||||||
<span style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
<span v-if="$auth.hasPermiAnd([
|
||||||
<el-tooltip content="编辑" placement="top">
|
'equipment:check:update',
|
||||||
|
'base:core-worker:query',
|
||||||
|
'base:group-classes:query',
|
||||||
|
'base:core-department:query',
|
||||||
|
'equipment:check:query',
|
||||||
|
'equipment:check:create',
|
||||||
|
'equipment:check:delete',
|
||||||
|
'base:core-equipment:query'
|
||||||
|
])" style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
||||||
|
<el-tooltip v-if="$auth.hasPermiAnd([
|
||||||
|
'equipment:check:update',
|
||||||
|
'base:core-worker:query',
|
||||||
|
'base:group-classes:query',
|
||||||
|
'base:core-department:query',
|
||||||
|
'equipment:check:query',
|
||||||
|
'equipment:check:create',
|
||||||
|
'equipment:check:delete',
|
||||||
|
'base:core-equipment:query'
|
||||||
|
])" content="编辑" placement="top">
|
||||||
<el-button
|
<el-button
|
||||||
type="text"
|
type="text"
|
||||||
style="margin: 5px 0; padding: 0"
|
style="margin: 5px 0; padding: 0"
|
||||||
@@ -121,8 +139,8 @@
|
|||||||
</el-button>
|
</el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<!-- line -->
|
<!-- line -->
|
||||||
<span style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
<span v-if="$auth.hasPermi('equipment:check:delete')" style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
||||||
<el-tooltip content="删除" placement="top">
|
<el-tooltip v-if="$auth.hasPermi('equipment:check:delete')" content="删除" placement="top">
|
||||||
<el-button
|
<el-button
|
||||||
type="text"
|
type="text"
|
||||||
style="margin: 5px 0; padding: 0"
|
style="margin: 5px 0; padding: 0"
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-11-18 14:16:25
|
* @Date: 2021-11-18 14:16:25
|
||||||
* @LastEditors: DY
|
* @LastEditors: DY
|
||||||
* @LastEditTime: 2024-03-25 15:44:49
|
* @LastEditTime: 2024-04-22 15:04:40
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@@ -165,7 +165,7 @@ import SmallTitle from './SmallTitle';
|
|||||||
import { parseTime } from '@/utils/ruoyi';
|
import { parseTime } from '@/utils/ruoyi';
|
||||||
import attrAdd from './attr-add';
|
import attrAdd from './attr-add';
|
||||||
import {DICT_TYPE, getDictDatas} from "@/utils/dict";
|
import {DICT_TYPE, getDictDatas} from "@/utils/dict";
|
||||||
import { getCoreDepartmentList } from "@/api/base/coreDepartment";
|
import { getDepartmentList } from "@/api/base/coreDepartment";
|
||||||
import { groupClassesListAll } from '@/api/monitoring/teamProduction'
|
import { groupClassesListAll } from '@/api/monitoring/teamProduction'
|
||||||
import { getDictDataLabel } from '@/utils/dict';
|
import { getDictDataLabel } from '@/utils/dict';
|
||||||
|
|
||||||
@@ -289,7 +289,7 @@ export default {
|
|||||||
return item
|
return item
|
||||||
}) || [];
|
}) || [];
|
||||||
// 部门列表
|
// 部门列表
|
||||||
const res1 = await getCoreDepartmentList();
|
const res1 = await getDepartmentList();
|
||||||
this.departmentOptions = res1.data || []
|
this.departmentOptions = res1.data || []
|
||||||
// 巡检人
|
// 巡检人
|
||||||
let inspectorList = [];
|
let inspectorList = [];
|
||||||
|
|||||||
@@ -101,10 +101,23 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: (this.$auth.hasPermiAnd([
|
||||||
|
'equipment:check:create',
|
||||||
|
'base:core-worker:query',
|
||||||
|
'base:group-classes:query',
|
||||||
|
'base:core-department:query'
|
||||||
|
]) ||
|
||||||
|
this.$auth.hasPermi('equipment:check:update') ||
|
||||||
|
this.$auth.hasPermi('equipment:check:export'))
|
||||||
|
? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('equipment:inspection-confirm:create')
|
type: this.$auth.hasPermiAnd([
|
||||||
|
'equipment:check:create',
|
||||||
|
'base:core-worker:query',
|
||||||
|
'base:group-classes:query',
|
||||||
|
'base:core-department:query'
|
||||||
|
])
|
||||||
? 'button'
|
? 'button'
|
||||||
: '',
|
: '',
|
||||||
btnName: '新增',
|
btnName: '新增',
|
||||||
@@ -113,7 +126,7 @@ export default {
|
|||||||
color: 'success',
|
color: 'success',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('equipment:inspection-confirm:confirm')
|
type: this.$auth.hasPermi('equipment:check:update')
|
||||||
? 'button'
|
? 'button'
|
||||||
: '',
|
: '',
|
||||||
btnName: '批量确认',
|
btnName: '批量确认',
|
||||||
@@ -122,7 +135,7 @@ export default {
|
|||||||
plain: true,
|
plain: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('equipment:inspection-confirm:export')
|
type: this.$auth.hasPermi('equipment:check:export')
|
||||||
? 'button'
|
? 'button'
|
||||||
: '',
|
: '',
|
||||||
btnName: '导出',
|
btnName: '导出',
|
||||||
|
|||||||
@@ -100,7 +100,7 @@ export default {
|
|||||||
addContent: false,
|
addContent: false,
|
||||||
searchBarKeys: ['name', 'actualCheckTime'],
|
searchBarKeys: ['name', 'actualCheckTime'],
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
this.$auth.hasPermi('equipment:check-record:detail')
|
this.$auth.hasPermi('equipment:check:query')
|
||||||
? {
|
? {
|
||||||
type: 'detail',
|
type: 'detail',
|
||||||
btnName: '详情',
|
btnName: '详情',
|
||||||
@@ -166,10 +166,11 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermi('equipment:check:export')
|
||||||
|
? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('equipment:check-record:export')
|
type: this.$auth.hasPermi('equipment:check:export')
|
||||||
? 'button'
|
? 'button'
|
||||||
: '',
|
: '',
|
||||||
btnName: '导出',
|
btnName: '导出',
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-11-18 14:16:25
|
* @Date: 2021-11-18 14:16:25
|
||||||
* @LastEditors: DY
|
* @LastEditors: DY
|
||||||
* @LastEditTime: 2024-03-15 18:38:52
|
* @LastEditTime: 2024-04-22 14:56:03
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@@ -99,7 +99,7 @@ import {
|
|||||||
createCheckOrder,
|
createCheckOrder,
|
||||||
updateCheckOrder,
|
updateCheckOrder,
|
||||||
} from '@/api/equipment/base/inspection/settings';
|
} from '@/api/equipment/base/inspection/settings';
|
||||||
import { getCoreDepartmentList } from '@/api/base/coreDepartment';
|
import { getDepartmentList } from '@/api/base/coreDepartment';
|
||||||
import { groupClassesListAll } from '@/api/monitoring/teamProduction';
|
import { groupClassesListAll } from '@/api/monitoring/teamProduction';
|
||||||
import { getDictDataLabel } from '@/utils/dict';
|
import { getDictDataLabel } from '@/utils/dict';
|
||||||
// import { getEquipmentAll } from '@/api/base/equipment'
|
// import { getEquipmentAll } from '@/api/base/equipment'
|
||||||
@@ -195,7 +195,7 @@ export default {
|
|||||||
},
|
},
|
||||||
async getDict() {
|
async getDict() {
|
||||||
// 部门列表
|
// 部门列表
|
||||||
const res = await getCoreDepartmentList();
|
const res = await getDepartmentList();
|
||||||
this.departmentOptions = res.data || [];
|
this.departmentOptions = res.data || [];
|
||||||
const res1 = await groupClassesListAll();
|
const res1 = await groupClassesListAll();
|
||||||
this.groupOptions =
|
this.groupOptions =
|
||||||
|
|||||||
@@ -68,14 +68,23 @@ export default {
|
|||||||
addOrEditTitle: '',
|
addOrEditTitle: '',
|
||||||
searchBarKeys: ['equipmentId', 'name'],
|
searchBarKeys: ['equipmentId', 'name'],
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
this.$auth.hasPermi('equipment:check-setting:addInsp')
|
this.$auth.hasPermiAnd([
|
||||||
|
'equipment:check:create',
|
||||||
|
'equipment:check:query',
|
||||||
|
'equipment:check:update',
|
||||||
|
'equipment:check:delete'
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'add',
|
type: 'add',
|
||||||
btnName: '添加',
|
btnName: '添加',
|
||||||
showTip: '添加巡检',
|
showTip: '添加巡检',
|
||||||
}
|
}
|
||||||
: undefined,
|
: undefined,
|
||||||
this.$auth.hasPermi('equipment:check-setting:update')
|
this.$auth.hasPermiAnd([
|
||||||
|
'equipment:check:update',
|
||||||
|
'equipment:check:query',
|
||||||
|
'base:core-department:query'
|
||||||
|
])
|
||||||
? {
|
? {
|
||||||
type: 'edit',
|
type: 'edit',
|
||||||
btnName: '修改',
|
btnName: '修改',
|
||||||
@@ -87,7 +96,7 @@ export default {
|
|||||||
// btnName: '查看详情',
|
// btnName: '查看详情',
|
||||||
// }
|
// }
|
||||||
// : undefined,
|
// : undefined,
|
||||||
this.$auth.hasPermi('equipment:check-setting:delete')
|
this.$auth.hasPermi('equipment:check:delete')
|
||||||
? {
|
? {
|
||||||
type: 'delete',
|
type: 'delete',
|
||||||
btnName: '删除',
|
btnName: '删除',
|
||||||
@@ -157,10 +166,17 @@ export default {
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: this.$auth.hasPermiAnd([
|
||||||
|
'equipment:check:create',
|
||||||
|
'base:core-department:query'
|
||||||
|
])
|
||||||
|
? 'separate' : '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('equipment:check-setting:create')
|
type: this.$auth.hasPermiAnd([
|
||||||
|
'equipment:check:create',
|
||||||
|
'base:core-department:query'
|
||||||
|
])
|
||||||
? 'button'
|
? 'button'
|
||||||
: '',
|
: '',
|
||||||
btnName: '新增',
|
btnName: '新增',
|
||||||
|
|||||||
@@ -320,7 +320,7 @@ export default {
|
|||||||
async getList(source = 'department') {
|
async getList(source = 'department') {
|
||||||
const urls = [
|
const urls = [
|
||||||
'/base/core-production-line/listAll',
|
'/base/core-production-line/listAll',
|
||||||
'/base/core-department/listAll',
|
'/system/dept/list-all-simple',
|
||||||
'/base/core-worker/listAll',
|
'/base/core-worker/listAll',
|
||||||
];
|
];
|
||||||
let res;
|
let res;
|
||||||
|
|||||||
@@ -540,7 +540,7 @@ export default {
|
|||||||
async getList(source = 'department') {
|
async getList(source = 'department') {
|
||||||
const urls = [
|
const urls = [
|
||||||
'/base/core-production-line/listAll',
|
'/base/core-production-line/listAll',
|
||||||
'/base/core-department/listAll',
|
'system/dept/list-all-simple',
|
||||||
'/base/core-worker/listAll',
|
'/base/core-worker/listAll',
|
||||||
];
|
];
|
||||||
let res;
|
let res;
|
||||||
|
|||||||
@@ -37,11 +37,11 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-if="selectedBox[0]"
|
v-if="selectedBox[0]"
|
||||||
width="160"
|
minWidth="160"
|
||||||
label="设备保养单号"
|
label="设备保养单号"
|
||||||
:show-overflow-tooltip="true"
|
:show-overflow-tooltip="true"
|
||||||
prop="maintainOrderNumber"></el-table-column>
|
prop="maintainOrderNumber"></el-table-column>
|
||||||
<el-table-column v-if="selectedBox[1]" width="128" label="保养计划名称" prop="planName">
|
<el-table-column v-if="selectedBox[1]" minWidth="128" label="保养计划名称" prop="planName">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ scope.row.planName || '---' }}
|
{{ scope.row.planName || '---' }}
|
||||||
</template>
|
</template>
|
||||||
@@ -67,7 +67,7 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-if="selectedBox[5]"
|
v-if="selectedBox[5]"
|
||||||
width="150"
|
minWidth="150"
|
||||||
label="计划结束时间"
|
label="计划结束时间"
|
||||||
prop="planEndTime">
|
prop="planEndTime">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
@@ -76,7 +76,7 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-if="selectedBox[6]"
|
v-if="selectedBox[6]"
|
||||||
width="150"
|
minWidth="150"
|
||||||
label="实际开始时间"
|
label="实际开始时间"
|
||||||
prop="startTime">
|
prop="startTime">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
@@ -85,7 +85,7 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-if="selectedBox[7]"
|
v-if="selectedBox[7]"
|
||||||
width="150"
|
minWidth="150"
|
||||||
label="实际结束时间"
|
label="实际结束时间"
|
||||||
prop="endTime">
|
prop="endTime">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
@@ -94,7 +94,7 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-if="selectedBox[8]"
|
v-if="selectedBox[8]"
|
||||||
width="150"
|
minWidth="150"
|
||||||
label="确认截止时间"
|
label="确认截止时间"
|
||||||
prop="confirmDueTime">
|
prop="confirmDueTime">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
@@ -103,7 +103,7 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-if="selectedBox[9]"
|
v-if="selectedBox[9]"
|
||||||
width="150"
|
minWidth="150"
|
||||||
label="保养计划类型"
|
label="保养计划类型"
|
||||||
prop="relatePlan">
|
prop="relatePlan">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
@@ -118,7 +118,7 @@
|
|||||||
<!-- btns -->
|
<!-- btns -->
|
||||||
<el-table-column width="188" label="操作">
|
<el-table-column width="188" label="操作">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-tooltip content="确认" placement="top">
|
<el-tooltip v-if="$auth.hasPermi('equipment:maintain-record:update')" content="确认" placement="top">
|
||||||
<el-button
|
<el-button
|
||||||
type="text"
|
type="text"
|
||||||
style="margin: 5px 0; padding: 0"
|
style="margin: 5px 0; padding: 0"
|
||||||
@@ -128,8 +128,8 @@
|
|||||||
</el-button>
|
</el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<!-- line -->
|
<!-- line -->
|
||||||
<span style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
<span v-if="$auth.hasPermi('equipment:maintain-record:query')" style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
||||||
<el-tooltip content="查看详情" placement="top">
|
<el-tooltip v-if="$auth.hasPermi('equipment:maintain-record:query')" content="查看详情" placement="top">
|
||||||
<el-button
|
<el-button
|
||||||
type="text"
|
type="text"
|
||||||
style="margin: 5px 0; padding: 0"
|
style="margin: 5px 0; padding: 0"
|
||||||
@@ -138,18 +138,32 @@
|
|||||||
</el-button>
|
</el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<!-- line -->
|
<!-- line -->
|
||||||
<span style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
<!-- <span v-if="$auth.hasPermiAnd([
|
||||||
<el-tooltip content="编辑" placement="top">
|
'equipment:maintain-record:update',
|
||||||
|
'base:core-production-line:query',
|
||||||
|
'base:core-department:query',
|
||||||
|
'equipment:maintain-record:create',
|
||||||
|
'equipment:maintain-record:query',
|
||||||
|
'equipment:maintain-record:delete'
|
||||||
|
])" style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
||||||
|
<el-tooltip v-if="$auth.hasPermiAnd([
|
||||||
|
'equipment:maintain-record:update',
|
||||||
|
'base:core-production-line:query',
|
||||||
|
'base:core-department:query',
|
||||||
|
'equipment:maintain-record:create',
|
||||||
|
'equipment:maintain-record:query',
|
||||||
|
'equipment:maintain-record:delete'
|
||||||
|
])" content="编辑" placement="top">
|
||||||
<el-button
|
<el-button
|
||||||
type="text"
|
type="text"
|
||||||
style="margin: 5px 0; padding: 0"
|
style="margin: 5px 0; padding: 0"
|
||||||
@click="$emit('edit', scope.row)">
|
@click="$emit('edit', scope.row)">
|
||||||
<i class="iconfont icon-edit primary-color" />
|
<i class="iconfont icon-edit primary-color" />
|
||||||
</el-button>
|
</el-button>
|
||||||
</el-tooltip>
|
</el-tooltip> -->
|
||||||
<!-- line -->
|
<!-- line -->
|
||||||
<span style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
<span v-if="$auth.hasPermi('equipment:maintain-record:delete')" style="margin: 0 4px; font-size: 18px; color: #e5e7eb">|</span>
|
||||||
<el-tooltip content="删除" placement="top">
|
<el-tooltip v-if="$auth.hasPermi('equipment:maintain-record:delete')" content="删除" placement="top">
|
||||||
<el-button
|
<el-button
|
||||||
type="text"
|
type="text"
|
||||||
style="margin: 5px 0; padding: 0"
|
style="margin: 5px 0; padding: 0"
|
||||||
|
|||||||
@@ -609,7 +609,7 @@ export default {
|
|||||||
async getList(source = 'department') {
|
async getList(source = 'department') {
|
||||||
const urls = [
|
const urls = [
|
||||||
'/base/core-production-line/listAll',
|
'/base/core-production-line/listAll',
|
||||||
'/base/core-department/listAll',
|
'/system/dept/list-all-simple',
|
||||||
'/base/core-worker/listAll',
|
'/base/core-worker/listAll',
|
||||||
];
|
];
|
||||||
let res;
|
let res;
|
||||||
|
|||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user