This commit is contained in:
朱菊兰 2024-06-19 08:50:24 +08:00
commit 45538e80c4
37 changed files with 2446 additions and 819 deletions

View File

@ -1,8 +1,8 @@
### ###
# @Author: zhp # @Author: zhp
# @Date: 2024-04-28 13:42:51 # @Date: 2024-04-28 13:42:51
# @LastEditTime: 2024-06-11 08:33:19 # @LastEditTime: 2024-06-17 09:01:32
# @LastEditors: zhp # @LastEditors: DY
# @Description: # @Description:
### ###
# 开发环境配置 # 开发环境配置
@ -13,8 +13,9 @@ VUE_APP_TITLE = 发电玻璃智能管控平台
# 芋道管理系统/开发环境 # 芋道管理系统/开发环境
# VUE_APP_BASE_API = 'http://192.168.1.70:30307' # VUE_APP_BASE_API = 'http://192.168.1.70:30307'
# VUE_APP_BASE_API = 'http://glass.kszny.picaiba.com' VUE_APP_BASE_API = 'http://glass.kszny.picaiba.com'
VUE_APP_BASE_API = 'http://192.168.1.56:48080' # 郭
# VUE_APP_BASE_API = 'http://192.168.1.61:48080'
# sara # sara
# VUE_APP_BASE_API = 'http://192.168.1.63:48080' # VUE_APP_BASE_API = 'http://192.168.1.63:48080'
# 张一丁 # 张一丁

23
src/api/report/index.js Normal file
View File

@ -0,0 +1,23 @@
/*
* @Author: zhp
* @Date: 2024-06-17 09:41:03
* @LastEditTime: 2024-06-18 13:47:36
* @LastEditors: zhp
* @Description:
*/
import request from '@/utils/request'
export function getComprehensiveDataPage(data) {
return request({
url: 'ip/comprehensive/data/get/comprehensive/data',
method: 'get',
params: data
})
}
export function getProduceTransData(data) {
return request({
url: 'ip/prod-output/queryYCEReportByDateRange',
method: 'post',
data: data
})
}

View File

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="26px" height="26px" viewBox="0 0 26 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 15</title>
<g id="03设备管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="工单管理" transform="translate(-714.000000, -131.000000)">
<g id="编组-15" transform="translate(714.000000, 131.000000)">
<g id="编组-13备份" fill="#0B58FF" opacity="0.227236793">
<rect id="矩形备份-2" x="0" y="0" width="26" height="26" rx="6"></rect>
</g>
<g id="公司" transform="translate(4.749735, 4.749735)" fill-rule="nonzero">
<rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="16.50053" height="16.50053"></rect>
<path d="M11.933204,3.46511501 L11.933204,1 C11.933204,0.44771525 11.4854888,-1.01453063e-16 10.933204,0 L7.7088886,0 L7.7088886,0 C3.83109495,0 0.687522083,3.16186639 0.687522083,7.06222625 L0.687522083,15.50053 C0.687522083,16.0528147 1.13523733,16.50053 1.68752208,16.50053 L14.8130079,16.50053 C15.3652927,16.50053 15.8130079,16.0528147 15.8130079,15.50053 L15.8130079,6.45996015 L15.8130079,6.45996015 L11.933204,3.46511501 Z M10.8812851,15.4709239 L1.80917527,15.4709239 L1.80917527,6.9505448 C1.81175925,3.6815283 4.55432163,1.03209261 7.93823277,1.02960612 L10.8812851,1.02960612 L10.8812851,15.4709239 Z M14.8298514,15.4709239 L11.9257773,15.4709239 L11.9257773,5.179727 L14.850314,7.12879718 L14.8298514,15.4709239 Z M3.75976827,9.04329837 L8.75976827,9.04329837 L8.75976827,10.3766317 L3.75976827,10.3766317 L3.75976827,9.04329837 Z M3.75976827,6.3766317 L8.75976827,6.3766317 L8.75976827,7.70996504 L3.75976827,7.70996504 L3.75976827,6.3766317 Z" id="形状" fill="#0B58FF"></path>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.9 KiB

View File

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="26px" height="26px" viewBox="0 0 26 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 13</title>
<g id="03设备管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="工单管理" transform="translate(-474.000000, -131.000000)">
<g id="编组-13" transform="translate(474.000000, 131.000000)">
<rect id="矩形备份-2" fill="#66DD89" opacity="0.227236793" x="0" y="0" width="26" height="26" rx="6"></rect>
<g id="机床、加工中心" transform="translate(3.000000, 3.000000)" fill-rule="nonzero">
<rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="20" height="20"></rect>
<path d="M18.1818304,15.1909171 L18.1818304,2.5 C18.1818304,2.22385763 17.9579728,2 17.6818304,2 L2.7272736,2 C2.45113122,2 2.2272736,2.22385763 2.2272736,2.5 L2.2272736,10.195451 C2.2272736,10.3084167 2.31885035,10.3999934 2.431816,10.3999934 C2.54478165,10.3999934 2.63635841,10.4915702 2.63635841,10.6045358 L2.63635841,10.999993 C2.63635841,11.3313636 2.90498735,11.5999925 3.23635794,11.5999925 L3.24999521,11.5999925 C3.58889745,11.5999925 3.86363201,11.8747271 3.86363201,12.2136293 L3.86363201,12.7909094 C3.86363201,13.016846 4.04678981,13.2000037 4.2727264,13.2000037 C4.498663,13.2000037 4.6818208,13.016846 4.6818208,12.7909094 L4.6818208,12.2136293 C4.6818208,11.8747271 4.95655535,11.5999925 5.2954576,11.5999925 L5.30909486,11.5999925 C5.64046546,11.5999925 5.9090944,11.3313636 5.9090944,10.999993 L5.9090944,10.6045358 C5.9090944,10.4915702 6.00067115,10.3999934 6.1136368,10.3999934 C6.22660245,10.3999934 6.3181792,10.3084167 6.3181792,10.195451 L6.3181792,6.5 C6.3181792,6.22385763 6.54203683,6 6.8181792,6 L12.772736,6 C13.0488784,6 13.272736,6.22385763 13.272736,6.5 L13.272736,15.1000019 C13.272736,15.3761442 13.0488784,15.6000019 12.772736,15.6000019 L11.7272736,15.6000019 C11.4511312,15.6000019 11.2272736,15.3761442 11.2272736,15.1000019 L11.2272736,14.8000009 C11.2272736,14.3581726 10.869101,14 10.4272727,14 L8.75453855,14 C8.31271023,14 7.95453761,14.3581726 7.95453761,14.8000009 L7.95453761,15.1000019 C7.95453761,15.3761442 7.73067998,15.6000019 7.45453761,15.6000019 L6.4090944,15.6000019 C6.13295202,15.6000019 5.9090944,15.3761442 5.9090944,15.1000019 L5.9090944,14.8000009 C5.9090944,14.3581726 5.55092178,14 5.10909346,14 L3.43635934,14 C2.99453103,14 2.63635841,14.3581726 2.63635841,14.8000009 L2.63635841,15.1000019 C2.63635841,15.3761442 2.41250078,15.6000019 2.13635841,15.6000019 L1.8181792,15.6000019 C1.36631131,15.6000019 1,15.9663132 1,16.4181811 L1,17.5 C1,17.7761424 1.22385763,18 1.5,18 L18.5,18 C18.7761424,18 19,17.7761424 19,17.5 L19,16.0090867 C19,15.7831554 18.8168465,15.6000019 18.5909152,15.6000019 C18.3649839,15.6000019 18.1818304,15.4168484 18.1818304,15.1909171 Z M5.0909056,10.8000056 L3.4545472,10.8000056 L3.4545472,10.3999934 L5.0909056,10.3999934 L5.0909056,10.8000056 Z M5.49999041,6.20000375 L5.49999041,9.60000656 L5.49999041,9.60000656 L3.04544321,9.60000656 L3.04544321,2.80000562 L17.3636416,2.80000562 L17.3636416,15.6000019 L14.0909056,15.6000019 L14.0909056,6.20000375 C14.0909056,5.647719 13.6431904,5.20000375 13.0909056,5.20000375 L6.49999041,5.20000375 C5.94770566,5.20000375 5.49999041,5.647719 5.49999041,6.20000375 Z M8.7727264,14.7999963 L10.4090848,14.7999963 L10.4090848,15.6000019 L8.7727264,15.6000019 L8.7727264,14.7999963 Z M3.4545472,14.7999963 L5.0909056,14.7999963 L5.0909056,15.6000019 L3.4545472,15.6000019 L3.4545472,14.7999963 Z M18.1818304,17.1999944 L1.81816962,17.1999944 L1.81816962,16.3999888 L18.1818304,16.3999888 L18.1818304,17.1999944 Z M12.0454528,4.00000469 C12.0440427,4.28673847 12.1996755,4.55228735 12.4534043,4.69605646 C12.707133,4.83982557 13.0201502,4.83982557 13.2738789,4.69605646 C13.5276077,4.55228735 13.6832405,4.28673847 13.6818304,4.00000469 C13.6832405,3.71327091 13.5276077,3.44772202 13.2738789,3.30395291 C13.0201502,3.1601838 12.707133,3.1601838 12.4534043,3.30395291 C12.1996755,3.44772202 12.0440427,3.71327091 12.0454528,4.00000469 L12.0454528,4.00000469 Z M5.49999041,3.60001125 L11.2272736,3.60001125 L11.2272736,4.39999813 L5.49999041,4.39999813 L5.49999041,3.60001125 Z M15.3181792,11.5999925 L16.136368,11.5999925 L16.136368,14.7999963 L15.3181792,14.7999963 L15.3181792,11.5999925 Z M15.3181792,9.19999438 L16.136368,9.19999438 L16.136368,10.8000056 L15.3181792,10.8000056 L15.3181792,9.19999438 Z M15.3181792,6.79999625 L16.136368,6.79999625 L16.136368,8.4000075 L15.3181792,8.4000075 L15.3181792,6.79999625 Z" id="形状" fill="#43B866"></path>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 4.7 KiB

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

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.5 MiB

View File

@ -232,6 +232,8 @@ aside {
background-color: #d9d9d9; background-color: #d9d9d9;
} }
// 大屏滚动表格
.no-data-bg { .no-data-bg {
position: absolute; position: absolute;
display: inline-block; display: inline-block;
@ -252,3 +254,13 @@ aside {
letter-spacing: 1px; letter-spacing: 1px;
} }
} }
.dv-scroll-board .rows .ceil,
.dv-scroll-board .header .header-item {
border-right: 1px solid rgba(13, 23, 40, 1);
}
.dv-scroll-board .rows .ceil:last-child,
.dv-scroll-board .header .header-item:last-child {
border-right: none;
}

View File

@ -378,10 +378,14 @@ function splitCurrentAndPreviousA(factoryListResponse, targetListResponse, prodO
transformRate.target[fId] = componentConversionEfficiency transformRate.target[fId] = componentConversionEfficiency
} }
// 芯片OEE // 芯片OEE
if (factory.glassType === 0) {
chipOeeRate.current[fId] = factory.oee; chipOeeRate.current[fId] = factory.oee;
}
// chipOeeRate.previous[fId] = factory.previousYearOee; // chipOeeRate.previous[fId] = factory.previousYearOee;
// 转化效率 // 转化效率
if (factory.glassType === 1) {
transformRate.current[fId] = factory.componentConversionEfficiency; transformRate.current[fId] = factory.componentConversionEfficiency;
}
// transformRate.previous[fId] = factory.previousYearComponentConversionEfficiency ; // transformRate.previous[fId] = factory.previousYearComponentConversionEfficiency ;
// 芯片良率 与 标准组件良率 // 芯片良率 与 标准组件良率
if (![0, 1].includes(factory.glassType)) continue; if (![0, 1].includes(factory.glassType)) continue;
@ -403,7 +407,7 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
console.log('prodOutputFtoListRes',preFtoData); console.log('prodOutputFtoListRes',preFtoData);
// 初始数据 // 初始数据
const { chipInvest, ftoInvest, chipOutput, stdOutput, bipvOutput } = init() const { chipInvest, ftoInvest, chipOutput, stdOutput, bipvOutput } = init()
if (prodOutputFtoListRes) { if (prodOutputFtoListRes.length !== 0 ) {
for (const factory of prodOutputFtoListRes) { for (const factory of prodOutputFtoListRes) {
console.log(factory); console.log(factory);
const fId = getFactoryId(factory); const fId = getFactoryId(factory);
@ -429,10 +433,13 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
// } // }
} }
} }
if (preData && preData[0] != null) { if (preData) {
for (const factory of preData) { for (const factory of preData) {
const fId = getPreFactoryId(factory); const fId = getPreFactoryId(factory);
chipInvest.previous[fId] = factory.previousYearInputNumber; if (factory.previousGlassType === 0) {
chipInvest.previous[fId] = factory.previousYearInputNumber
}
// chipInvest.previous[fId] = factory.previousYearInputNumber;
if (![0, 1, 2].includes(factory.previousGlassType)) continue; if (![0, 1, 2].includes(factory.previousGlassType)) continue;
const _t = [chipOutput, stdOutput, bipvOutput][factory.previousGlassType]; const _t = [chipOutput, stdOutput, bipvOutput][factory.previousGlassType];
// if (fId) { // if (fId) {
@ -445,11 +452,14 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
} }
} }
// console.log('ftoInvest',ftoInvest) // console.log('ftoInvest',ftoInvest)
if (factoryListResponse && factoryListResponse[0] != null) { if (factoryListResponse) {
for (const factory of factoryListResponse) { for (const factory of factoryListResponse) {
const fId = getFactoryId(factory); const fId = getFactoryId(factory);
console.log('factory.inputNumber', factory, fId);
if (factory.glassType === 0) {
chipInvest.current[fId] = factory.inputNumber
}
// const preFId = getPreFactoryId(factory); // const preFId = getPreFactoryId(factory);
// 获取目标值 // 获取目标值
if (targetListResponse) { if (targetListResponse) {
const { chipYield, componentYield, bipvProductOutput } = const { chipYield, componentYield, bipvProductOutput } =
@ -459,7 +469,6 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
bipvOutput.target[fId] = bipvProductOutput; bipvOutput.target[fId] = bipvProductOutput;
} }
// 芯片投入 // 芯片投入
chipInvest.current[fId] = factory.inputNumber;
// 产出数据, 0 - (玻璃)芯片产出, 1 - 标准组件产出, 2 - BIPV产出 // 产出数据, 0 - (玻璃)芯片产出, 1 - 标准组件产出, 2 - BIPV产出
// 因为后端写的垃圾数据,所以这里要做一下判断 // 因为后端写的垃圾数据,所以这里要做一下判断
@ -467,6 +476,7 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
const _t = [chipOutput, stdOutput, bipvOutput][factory.glassType]; const _t = [chipOutput, stdOutput, bipvOutput][factory.glassType];
_t.current[fId] = factory.outputNumber; _t.current[fId] = factory.outputNumber;
} }
console.log('chipInvest',ftoInvest);
return { return {
chipInvest, chipInvest,
// ftoInvest, // ftoInvest,
@ -475,15 +485,6 @@ function splitCurrentAndPrevious(factoryListResponse, targetListResponse, prodOu
stdOutput, stdOutput,
bipvOutput, bipvOutput,
}; };
}else{
return {
chipInvest,
// ftoInvest,
ftoInvest,
chipOutput,
stdOutput,
bipvOutput,
}
} }
} }

View File

@ -107,7 +107,7 @@ export default {
gap: 8px; gap: 8px;
} }
.factory-header > .menu2 { .factory-header > .menu2 {
width: 26vw; width: 20vw;
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;

View File

@ -47,8 +47,11 @@ export default {
legend() { legend() {
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -60,13 +63,13 @@ export default {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${year-1}${month}${today}`, color: "#12f7f1" }, { label: `${year - 1}${yesterday}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${yesterday}`, color: "#58adfa" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
items = [ items = [
{ label: `${yesterday}`, color: "#12f7f1" }, { label: `${dayBeYes}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${yesterday}`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
@ -96,7 +99,7 @@ export default {
items = [ items = [
{ label: `${year - 1}`, color: "#12f7f1" }, { label: `${year - 1}`, color: "#12f7f1" },
{ label: `${year}`, color: "#58adfa" }, { label: `${year}`, color: "#58adfa" },
{ label: `${year}`, color: "#58adfa" }, { label: `${year}目标`, color: "#58adfa" },
// { label: `${year}`, value: valueTuple[2] }, // { label: `${year}`, value: valueTuple[2] },
]; ];
@ -163,8 +166,11 @@ function getTemplate(period, dataList, than) {
// console.log('dataList',dataList); // console.log('dataList',dataList);
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -177,11 +183,11 @@ function getTemplate(period, dataList, than) {
if (period === '日' && than === '同比') { if (period === '日' && than === '同比') {
items = [ items = [
{ {
name: `${year-1}${month}${today}`, name: `${year - 1}${yesterday}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
name: `${month}${today}`, name: `${yesterday}`,
data: dataList ? dataList[1] : [], data: dataList ? dataList[1] : [],
// : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
}, },
@ -189,11 +195,11 @@ function getTemplate(period, dataList, than) {
} else if (period === '日' && than === '环比') { } else if (period === '日' && than === '环比') {
items = [ items = [
{ {
name: `${yesterday}`, name: `${dayBeYes}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
name: `${month}${today}`, name: `${yesterday}`,
data: dataList ? dataList[1] : [], data: dataList ? dataList[1] : [],
// : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
}, },

View File

@ -47,8 +47,11 @@ export default {
legend() { legend() {
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -60,13 +63,13 @@ export default {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${year-1}${month}${today}`, color: "#12f7f1" }, { label: `${year - 1}${yesterday}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${yesterday}`, color: "#58adfa" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
items = [ items = [
{ label: `${yesterday}`, color: "#12f7f1" }, { label: `${dayBeYes}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${yesterday}`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
@ -96,7 +99,7 @@ export default {
items = [ items = [
{ label: `${year - 1}`, color: "#12f7f1" }, { label: `${year - 1}`, color: "#12f7f1" },
{ label: `${year}`, color: "#58adfa" }, { label: `${year}`, color: "#58adfa" },
{ label: `${year}`, color: "#58adfa" }, { label: `${year}目标`, color: "#58adfa" },
// { label: `${year}`, value: valueTuple[2] }, // { label: `${year}`, value: valueTuple[2] },
]; ];
@ -154,8 +157,11 @@ function getTemplate(period, dataList,than) {
// console.log('dataList',dataList); // console.log('dataList',dataList);
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -168,11 +174,11 @@ function getTemplate(period, dataList,than) {
if (period === '日' && than === '同比') { if (period === '日' && than === '同比') {
items = [ items = [
{ {
name: `${year-1}${month}${today}`, name: `${year - 1}${yesterday}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
name: `${month}${today}`, name: `${yesterday}`,
data: dataList ? dataList[1] : [], data: dataList ? dataList[1] : [],
// : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
}, },
@ -180,11 +186,11 @@ function getTemplate(period, dataList,than) {
} else if (period === '日' && than === '环比') { } else if (period === '日' && than === '环比') {
items = [ items = [
{ {
name: `${yesterday}`, name: `${dayBeYes}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
name: `${month}${today}`, name: `${yesterday}`,
data: dataList ? dataList[1] : [], data: dataList ? dataList[1] : [],
// : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
}, },

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-07 13:22:43 * @Date: 2024-05-07 13:22:43
* @LastEditTime: 2024-06-06 15:12:58 * @LastEditTime: 2024-06-17 09:22:17
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -180,30 +180,30 @@ export default {
itemStyle: { itemStyle: {
color: "#f3c000", color: "#f3c000",
}, },
areaStyle: { // areaStyle: {
color: { // color: {
type: "linear", // type: "linear",
x: 0, // x: 0,
y: 0, // y: 0,
x2: 0, // x2: 0,
y2: 1, // y2: 1,
colorStops: [ // colorStops: [
{ // {
offset: 0, // offset: 0,
color: "#f3c000", // 0% // color: "#f3c000", // 0%
}, // },
{ // {
offset: 0.55, // offset: 0.55,
color: "#f3c00033", // color: "#f3c00033",
}, // },
{ // {
offset: 1, // offset: 1,
color: "transparent", // 100% // color: "transparent", // 100%
}, // },
], // ],
global: false, // false // global: false, // false
}, // },
}, // },
data: [], // this.series[0].data, data: [], // this.series[0].data,
}, },
], ],

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-23 15:50:44 * @Date: 2024-05-23 15:50:44
* @LastEditTime: 2024-06-06 15:13:06 * @LastEditTime: 2024-06-17 09:23:39
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -180,30 +180,30 @@ export default {
itemStyle: { itemStyle: {
color: "#f3c000", color: "#f3c000",
}, },
areaStyle: { // areaStyle: {
color: { // color: {
type: "linear", // type: "linear",
x: 0, // x: 0,
y: 0, // y: 0,
x2: 0, // x2: 0,
y2: 1, // y2: 1,
colorStops: [ // colorStops: [
{ // {
offset: 0, // offset: 0,
color: "#f3c000", // 0% // color: "#f3c000", // 0%
}, // },
{ // {
offset: 0.55, // offset: 0.55,
color: "#f3c00033", // color: "#f3c00033",
}, // },
{ // {
offset: 1, // offset: 1,
color: "transparent", // 100% // color: "transparent", // 100%
}, // },
], // ],
global: false, // false // global: false, // false
}, // },
}, // },
data: [], // this.series[0].data, data: [], // this.series[0].data,
}, },
], ],

View File

@ -87,8 +87,11 @@ export default {
const vt = this.valueTuple; const vt = this.valueTuple;
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -100,13 +103,13 @@ export default {
// const year = new Date().getFullYear(); // const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${month}${today}日良率`, }, { label: `${yesterday}日良率`, },
{ label: `${year-1}${month}${today}日良率` }, { label: `${year - 1}${yesterday}日良率` },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
items = [ items = [
{ label: `${month}${today}日良率` },
{ label: `${yesterday}日良率` }, { label: `${yesterday}日良率` },
{ label: `${dayBeYes}日良率` },
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
@ -139,7 +142,7 @@ export default {
} }
let titleValue = vt[1] === null ? 0 + '%' : this.formatNumber(vt[1]) + '%', let titleValue = vt[1] === null ? 0 + '%' : this.formatNumber(vt[1]) + '%',
subtitle = { subtitle = {
: "日良率", : "日良率",
: "本周良率", : "本周良率",
: `${month}月良率`, : `${month}月良率`,
: `${year}良率`, : `${year}良率`,
@ -161,8 +164,11 @@ export default {
legend() { legend() {
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -174,13 +180,13 @@ export default {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${year-1}${month}${today}日良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0]) ) + "%" }, { label: `${year - 1}${yesterday}日良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0]) ) + "%" },
{ label: `${month}${today}日良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, { label: `${yesterday}日良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
items = [ items = [
{ label: `${yesterday}日良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" }, { label: `${dayBeYes}日良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" },
{ label: `${month}${today}日良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, { label: `${yesterday}日良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" },
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-07 10:25:10 * @Date: 2024-05-07 10:25:10
* @LastEditTime: 2024-06-06 15:14:29 * @LastEditTime: 2024-06-14 09:58:01
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -69,16 +69,19 @@ export default {
titlePre() { titlePre() {
console.log(this.city); console.log(this.city);
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
const today = new Date().getDate(); const today = new Date().getDate();
const month = new Date().getMonth() + 1; const month = new Date().getMonth() + 1;
const lastMonth = new Date().getMonth() + 1 === 12 ? 1 : new Date().getMonth() + 1 - 1; const lastMonth = new Date().getMonth() + 1 === 12 ? 1 : new Date().getMonth() + 1 - 1;
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
return `${year-1}${month}${today}` return `${year - 1}${yesterday}`
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
return `${yesterday}` return `${dayBeYes}`
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
return `${year-1}年本周` return `${year-1}年本周`
} else if (this.period === '周' && this.than === '环比') { } else if (this.period === '周' && this.than === '环比') {
@ -93,14 +96,18 @@ export default {
}, },
title() { title() {
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
const today = new Date().getDate(); const today = new Date().getDate();
const month = new Date().getMonth() + 1; const month = new Date().getMonth() + 1;
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
return `${month}${today}` return `${yesterday}`
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
return `${month}${today}` return `${yesterday}`
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
return `本周` return `本周`
} else if (this.period === '周' && this.than === '环比') { } else if (this.period === '周' && this.than === '环比') {

View File

@ -8,7 +8,7 @@ export default ({
preName, preName,
}) => ({ }) => ({
grid: { grid: {
left: '0%', left: 300,
right: 0, right: 0,
bottom: 0, bottom: 0,
top: 0, top: 0,
@ -17,7 +17,7 @@ export default ({
tooltip: {}, tooltip: {},
title: { title: {
text: titleValue, text: titleValue,
left: "44%", left: "48%",
top: "37%", top: "37%",
textAlign: "center", textAlign: "center",
textStyle: { textStyle: {
@ -39,7 +39,7 @@ export default ({
type: "pie", type: "pie",
name: "当前良率", name: "当前良率",
radius: ["70%", "85%"], radius: ["70%", "85%"],
center: ["45%", "52%"], center: ["50%", "52%"],
emptyCircleStyle: { emptyCircleStyle: {
color: "#003982", color: "#003982",
}, },
@ -48,7 +48,7 @@ export default ({
{ {
type: "pie", type: "pie",
radius: ["70%", "85%"], radius: ["70%", "85%"],
center: ["45%", "52%"], center: ["50%", "52%"],
avoidLabelOvervlap: false, avoidLabelOvervlap: false,
label: { label: {
show: false, show: false,
@ -97,7 +97,7 @@ export default ({
{ {
type: "pie", type: "pie",
radius: ["55%", "70%"], radius: ["55%", "70%"],
center: ["45%", "52%"], center: ["50%", "52%"],
avoidLabelOvervlap: false, avoidLabelOvervlap: false,
label: { label: {
show: false, show: false,

View File

@ -1,4 +1,5 @@
<template> <template>
<chart-container class="bar-chart-base">
<div class="left-chart-base"> <div class="left-chart-base">
<!-- <div class="legend"> <!-- <div class="legend">
<span v-for="item in legend" :key="item.label" class="legend-item" <span v-for="item in legend" :key="item.label" class="legend-item"
@ -7,13 +8,17 @@
<div id="factoryEnergyChart" style="width: 100%; height: 100%"></div> <div id="factoryEnergyChart" style="width: 100%; height: 100%"></div>
</div> </div>
</chart-container>
</template> </template>
<script> <script>
import { debounce } from "@/utils/debounce"; import { debounce } from "@/utils/debounce";
import * as echarts from "echarts"; import * as echarts from "echarts";
import ChartContainer from "../../components/ChartContainer.vue";
// import CopilotButton from "./chartButton" // import CopilotButton from "./chartButton"
export default { export default {
components: { components: {
ChartContainer
// CopilotButton, // CopilotButton,
}, },
name: "Energy", name: "Energy",
@ -68,12 +73,25 @@ export default {
}, },
}, },
axisLabel: { axisLabel: {
interval: 0,//
rotate:45, rotate:45,
color: "rgba(255, 255, 255, 0.7)", color: "rgba(255, 255, 255, 0.7)",
fontSize: 12, fontSize: 12,
// formatter: function (value) {
// console.log(value);
// return value;
// },
}, },
data: [], data: [],
}, },
// dataZoom: [
// {
// // show: true,
// start: 0,
// end: 50
// }
// ],
yAxis: { yAxis: {
type: "value", type: "value",
name: "单位/片", name: "单位/片",
@ -87,7 +105,7 @@ export default {
}, },
axisLabel: { axisLabel: {
color: "rgba(255, 255, 255, 0.7)", color: "rgba(255, 255, 255, 0.7)",
fontSize: 12, fontSize: 10,
}, },
axisLine: { axisLine: {
show: true, show: true,
@ -221,9 +239,9 @@ export default {
// this.actualOptions = actualOptions; // this.actualOptions = actualOptions;
// this.initOptions(actualOptions); // this.initOptions(actualOptions);
// }, // },
energyCockpits() { // energyCockpits() {
this.initChart(); // this.initChart();
}, // },
isOpen(val) { isOpen(val) {
this.canvasReset(); this.canvasReset();
}, },
@ -258,6 +276,9 @@ export default {
if (this.energyCockpits) { if (this.energyCockpits) {
this.energyCockpits.forEach(ele => { this.energyCockpits.forEach(ele => {
this.data.push(ele.targetProduction) this.data.push(ele.targetProduction)
if (ele.workOrderNumber.length > 4) {
ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + "..";
}
this.orderXAxis.push(ele.workOrderNumber) this.orderXAxis.push(ele.workOrderNumber)
}); });
} }
@ -268,6 +289,9 @@ export default {
if (this.energyCockpits) { if (this.energyCockpits) {
this.energyCockpits.forEach(ele => { this.energyCockpits.forEach(ele => {
this.data.push(ele.plannedInvestment) this.data.push(ele.plannedInvestment)
if (ele.workOrderNumber.length > 4) {
ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + "..";
}
this.orderXAxis.push(ele.workOrderNumber) this.orderXAxis.push(ele.workOrderNumber)
}); });
} }
@ -277,6 +301,9 @@ export default {
if (this.energyCockpits) { if (this.energyCockpits) {
this.energyCockpits.forEach(ele => { this.energyCockpits.forEach(ele => {
this.data.push(ele.actualInvestment) this.data.push(ele.actualInvestment)
if (ele.workOrderNumber.length > 4) {
ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + "..";
}
this.orderXAxis.push(ele.workOrderNumber) this.orderXAxis.push(ele.workOrderNumber)
}); });
} }
@ -286,6 +313,9 @@ export default {
if (this.energyCockpits) { if (this.energyCockpits) {
this.energyCockpits.forEach(ele => { this.energyCockpits.forEach(ele => {
this.data.push(ele.actualProduction) this.data.push(ele.actualProduction)
if (ele.workOrderNumber.length > 4) {
ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + "..";
}
this.orderXAxis.push(ele.workOrderNumber) this.orderXAxis.push(ele.workOrderNumber)
}); });
} }
@ -295,6 +325,9 @@ export default {
if (this.energyCockpits) { if (this.energyCockpits) {
this.energyCockpits.forEach(ele => { this.energyCockpits.forEach(ele => {
this.data.push(ele.wasteNum) this.data.push(ele.wasteNum)
if (ele.workOrderNumber.length > 4) {
ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + "..";
}
this.orderXAxis.push(ele.workOrderNumber) this.orderXAxis.push(ele.workOrderNumber)
}); });
} }
@ -305,6 +338,9 @@ export default {
this.energyCockpits.forEach(ele => { this.energyCockpits.forEach(ele => {
console.log(ele.reworkNum); console.log(ele.reworkNum);
this.data.push(ele.reworkNum) this.data.push(ele.reworkNum)
if (ele.workOrderNumber.length > 4) {
ele.workOrderNumber = ele.workOrderNumber.substring(0, 4) + "..";
}
this.orderXAxis.push(ele.workOrderNumber) this.orderXAxis.push(ele.workOrderNumber)
}); });
} }

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-29 14:48:06 * @Date: 2024-05-29 14:48:06
* @LastEditTime: 2024-06-07 14:11:01 * @LastEditTime: 2024-06-18 14:49:25
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -54,8 +54,20 @@ export default {
legend() { legend() {
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
//
// var day2 = new Date();
// day2.setTime(day2.getTime());
// var s2 = (day2.getMonth() + 1) + "" + day2.getDate() + '';
// const today = new Date().getDate();
// let yesterday = new Date().getDate() -1;
// const month = new Date().getMonth() + 1;
// const lastMonth = new Date().getMonth() + 1 === 12 ? 1 : new Date().getMonth() + 1 - 1;
// const year = new Date().getFullYear();
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -67,13 +79,16 @@ export default {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (this.period === 1 && this.than === '同比') { if (this.period === 1 && this.than === '同比') {
items = [ items = [
{ label: `${year-1}${month}${today}`, color: "#12f7f1" }, { label: `${year - 1}${yesterday}累计` },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${yesterday}日累计`, },
// { label: `${month}${today}`, },
]; ];
} else if (this.period ===1 && this.than === '环比') { } else if (this.period === 1 && this.than === '环比') {
items = [ items = [
{ label: `${yesterday}`, color: "#12f7f1" }, { label: `${dayBeYes}日累计` },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${yesterday}日累计` },
// { label: `${month}${today}`, },
]; ];
} else if (this.period === 2 && this.than === '同比') { } else if (this.period === 2 && this.than === '同比') {
items = [ items = [
@ -158,8 +173,11 @@ function getTemplate(period, dataList, than) {
// console.log('dataList',dataList); // console.log('dataList',dataList);
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -172,11 +190,11 @@ function getTemplate(period, dataList, than) {
if (period === 1 && than === '同比') { if (period === 1 && than === '同比') {
items = [ items = [
{ {
name: `${year-1}${month}${today}`, name: `${year - 1}${yesterday}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
name: `${month}${today}`, name: `${yesterday}`,
data: dataList ? dataList[1] : [], data: dataList ? dataList[1] : [],
// : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
}, },
@ -184,11 +202,11 @@ function getTemplate(period, dataList, than) {
} else if (period ===1 && than === '环比') { } else if (period ===1 && than === '环比') {
items = [ items = [
{ {
name: `${yesterday}`, name: `${dayBeYes}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
name: `${month}${today}`, name: `${yesterday}`,
data: dataList ? dataList[1] : [], data: dataList ? dataList[1] : [],
// : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
}, },

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="order-container"> <div class="order-container">
<div class="table"> <div class="table">
<dv-scroll-board v-if="showTable" :config="config" style="width: 100%; height: 100%" ref="orderScrollBoard" /> <dv-scroll-board v-if="showTable" :config="config" style="width: 100%; height: 100%; color: rgba(255, 255, 255, .6);" ref="orderScrollBoard" />
</div> </div>
<div class="chart"> <div class="chart">
<div class="chart-title"> <div class="chart-title">
@ -41,8 +41,8 @@ export default {
data: [], data: [],
rowNum: 12, rowNum: 12,
waitTime: 3000, waitTime: 3000,
columnWidth: [100], columnWidth: [150],
align: ["center"], align: ["left"],
carousel: "page", carousel: "page",
}, },
}; };
@ -101,40 +101,25 @@ export default {
arr.push( arr.push(
`<span title=${this.prodOrder[i].workOrderNumber || ""}>${ `<span title=${this.prodOrder[i].workOrderNumber || ""}>${
this.prodOrder[i].workOrderNumber || "" this.prodOrder[i].workOrderNumber || ""
}</span>` }</span>`,
); `<span title=${this.prodOrder[i].orderStatus || ""}>${this.prodOrder[i].orderStatus === 1 ? '未开始' : this.prodOrder[i].orderStatus === 2 ? '进行中' : '已完成' || ""
arr.push( }</span>`,
`<span title=${this.prodOrder[i].inStatus || ""}>${ `<span title=${this.prodOrder[i].plannedInvestment || ""}>${this.prodOrder[i].plannedInvestment || ""
this.prodOrder[i].inStatus || "" }</span>`,
}</span>`
);
arr.push(
`<span title=${this.prodOrder[i].plannedInvestment || ""}>${
this.prodOrder[i].plannedInvestment || ""
}</span>`
);
arr.push(
`<span title=${this.prodOrder[i].actualInvestment || ""}>${this.prodOrder[i].actualInvestment || "" `<span title=${this.prodOrder[i].actualInvestment || ""}>${this.prodOrder[i].actualInvestment || ""
}</span>` }</span>`,
);
arr.push(
`<span title=${this.prodOrder[i].targetProduction || ""}>${this.prodOrder[i].targetProduction || "" `<span title=${this.prodOrder[i].targetProduction || ""}>${this.prodOrder[i].targetProduction || ""
}</span>` }</span>`,
);
arr.push(
`<span title=${this.prodOrder[i].actualProduction || ""}>${this.prodOrder[i].actualProduction || "" `<span title=${this.prodOrder[i].actualProduction || ""}>${this.prodOrder[i].actualProduction || ""
}</span>` }</span>`,
); `<span style="display:inline-block;width:45px;">${this.prodOrder[i].productionProgress
arr.push(`<span style="display:inline-block;width:45px;">${
this.prodOrder[i].productionProgress
? this.prodOrder[i].productionProgress.toFixed(0) + "%" ? this.prodOrder[i].productionProgress.toFixed(0) + "%"
: "0%" : "0%"
}</span> }</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="${ <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="${this.prodOrder[i].productionProgress
this.prodOrder[i].productionProgress
? this.prodOrder[i].productionProgress.toFixed(0) * ? this.prodOrder[i].productionProgress.toFixed(0) *
37.68 * 37.68 *
0.01 + 0.01 +
@ -145,7 +130,8 @@ export default {
: 0 + "," + 37.68 : 0 + "," + 37.68
}"/> }"/>
</svg> </svg>
</div>`); </div>`
)
outArr.push(arr); outArr.push(arr);
} }
this.config.data = outArr; this.config.data = outArr;

View File

@ -89,7 +89,7 @@ export default {
updateThan(val) { updateThan(val) {
console.log(val); console.log(val);
this.than = val; this.than = val;
// this.getMes(); this.getMes()
}, },
updatePeriod(val) { updatePeriod(val) {
this.period = val; this.period = val;

View File

@ -45,8 +45,11 @@ export default {
legend() { legend() {
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -58,13 +61,13 @@ export default {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${year-1}${month}${today}`, color: "#12f7f1" }, { label: `${year - 1}${yesterday}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${yesterday}`, color: "#58adfa" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
items = [ items = [
{ label: `${yesterday}`, color: "#12f7f1" }, { label: `${dayBeYes}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${yesterday}`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
@ -149,8 +152,11 @@ export default {
function getTemplate(period, dataList,than) { function getTemplate(period, dataList,than) {
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -163,11 +169,11 @@ function getTemplate(period, dataList,than) {
if (period === '日' && than === '同比') { if (period === '日' && than === '同比') {
items = [ items = [
{ {
name: `${year-1}${month}${today}`, name: `${year - 1}${yesterday}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
name: `${month}${today}`, name: `${yesterday}`,
data: dataList ? dataList[1] : [], data: dataList ? dataList[1] : [],
// : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
}, },
@ -175,11 +181,11 @@ function getTemplate(period, dataList,than) {
} else if (period === '日' && than === '环比') { } else if (period === '日' && than === '环比') {
items = [ items = [
{ {
name: `${yesterday}`, name: `${dayBeYes}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
name: `${month}${today}`, name: `${yesterday}`,
data: dataList ? dataList[1] : [], data: dataList ? dataList[1] : [],
// : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
}, },

View File

@ -45,8 +45,11 @@ export default {
legend() { legend() {
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -58,13 +61,13 @@ export default {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${year-1}${month}${today}`, color: "#12f7f1" }, { label: `${year - 1}${yesterday}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${yesterday}`, color: "#58adfa" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
items = [ items = [
{ label: `${yesterday}`, color: "#12f7f1" }, { label: `${dayBeYes}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${yesterday}`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
@ -150,9 +153,15 @@ export default {
function getTemplate(period, dataList,than) { function getTemplate(period, dataList,than) {
let items = []; let items = [];
// var day1 = new Date();
// day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000);
// var yesterday = (day1.getMonth() + 1) + "" + day1.getDate()
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -165,11 +174,11 @@ function getTemplate(period, dataList,than) {
if (period === '日' && than === '同比') { if (period === '日' && than === '同比') {
items = [ items = [
{ {
name: `${year-1}${month}${today}`, name: `${year - 1}${yesterday}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
name: `${month}${today}`, name: `${yesterday}`,
data: dataList ? dataList[1] : [], data: dataList ? dataList[1] : [],
// : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
}, },
@ -177,11 +186,11 @@ function getTemplate(period, dataList,than) {
} else if (period === '日' && than === '环比') { } else if (period === '日' && than === '环比') {
items = [ items = [
{ {
name: `${yesterday}`, name: `${dayBeYes}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
name: `${month}${today}`, name: `${yesterday}`,
data: dataList ? dataList[1] : [], data: dataList ? dataList[1] : [],
// : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)), // : Array.from({ length: 7 }, () => Math.floor(Math.random() * 1000)),
}, },

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-20 13:32:59 * @Date: 2024-05-20 13:32:59
* @LastEditTime: 2024-06-06 08:42:04 * @LastEditTime: 2024-06-17 16:42:12
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -78,13 +78,13 @@ export default {
valueTuple() { valueTuple() {
// [previousValue, currentValue, sumValue?] // [previousValue, currentValue, sumValue?]
const getter = this.$store.getters.copilot.yield[this.dataSourceField]; const getter = this.$store.getters.copilot.yield[this.dataSourceField];
if (this.period === "日" || this.period === "周") { // if (this.period === "" || this.period === "") {
console.log(this.period) // console.log(this.period)
return [ // return [
getter.previous[this.factoryId], // getter.previous[this.factoryId],
getter.current[this.factoryId], // getter.current[this.factoryId],
]; // ];
} // }
// [100, 200, 200] // [100, 200, 200]
return [ return [
getter.previous[this.factoryId], getter.previous[this.factoryId],
@ -100,8 +100,11 @@ export default {
const vt = this.valueTuple; const vt = this.valueTuple;
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -113,15 +116,15 @@ export default {
// const year = new Date().getFullYear(); // const year = new Date().getFullYear();
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${month}${today}日累计`,}, { label: `${yesterday}日累计`,},
{ label: `${year-1}${month}${today}累计` }, { label: `${year - 1}${yesterday}累计` },
{ label: `${month}${today}日目标`, }, { label: `${yesterday}日目标`, },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
items = [ items = [
{ label: `${month}${today}日累计`}, { label: `${yesterday}日累计`},
{ label: `${yesterday}日累计` }, { label: `${dayBeYes}日累计` },
{ label: `${month}${today}日目标`, }, { label: `${yesterday}日目标`, },
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
@ -160,9 +163,9 @@ export default {
: (vt[1] != 0 && vt[1] != null) && vt[2] == 0 : (vt[1] != 0 && vt[1] != null) && vt[2] == 0
? "100%" : '0%', ? "100%" : '0%',
subtitle = subtitle =
this.period == "日" ? `${month}${today}日累计完成值` : this.period == "周" ? `本周累计完成值` : this.period == "月" ? `${month}月累计完成值` : `${year}年累计完成值`; this.period == "日" ? `${yesterday}日累计完成值` : this.period == "周" ? `本周累计完成值` : this.period == "月" ? `${month}月累计完成值` : `${year}年累计完成值`;
console.log(this.valueTuple[0], this.valueTuple[1], this.valueTuple[2],) console.log('titleValue', items)
console.log(this.valueTuple[2]- this.valueTuple[1]) // console.log(this.valueTuple[2]- this.valueTuple[1])
return getOptions({ return getOptions({
titleValue, titleValue,
subtitle, subtitle,
@ -221,8 +224,12 @@ function calculateItems(period, valueTuple, than) {
console.log('valueTuple', valueTuple); console.log('valueTuple', valueTuple);
let items = []; let items = [];
var day1 = new Date(); var day1 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000); var day2 = new Date();
day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000)
day2.setTime(day2.getTime() - 48 * 60 * 60 * 1000)
var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate() var yesterday = (day1.getMonth() + 1) + "月" + day1.getDate()
var dayBeYes = (day2.getMonth() + 1) + "月" + day2.getDate()
// //
// var day2 = new Date(); // var day2 = new Date();
// day2.setTime(day2.getTime()); // day2.setTime(day2.getTime());
@ -234,15 +241,15 @@ function calculateItems(period, valueTuple, than) {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (period === '日' && than === '同比') { if (period === '日' && than === '同比') {
items = [ items = [
{ label: `${year-1}${month}${today}累计`, value: valueTuple[0] }, { label: `${year - 1}${yesterday}累计`, value: valueTuple[0] },
{ label: `${month}${today}累计`, value: valueTuple[1] }, { label: `${yesterday}累计`, value: valueTuple[1] },
{ label: `${month}${today}日目标`, value: valueTuple[2] }, { label: `${yesterday}日目标`, value: valueTuple[2] },
]; ];
} else if (period === '日' && than === '环比') { } else if (period === '日' && than === '环比') {
items = [ items = [
{ label: `${yesterday}日累计`, value: valueTuple[0] }, { label: `${dayBeYes}日累计`, value: valueTuple[0] },
{ label: `${month}${today}日累计`, value: valueTuple[1] }, { label: `${yesterday}日累计`, value: valueTuple[1] },
{ label: `${month}${today}日目标`, value: valueTuple[2] }, { label: `${yesterday}日目标`, value: valueTuple[2] },
]; ];
} else if (period === '周' && than === '同比') { } else if (period === '周' && than === '同比') {
items = [ items = [

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-28 13:42:51 * @Date: 2024-04-28 13:42:51
* @LastEditTime: 2024-06-05 14:12:31 * @LastEditTime: 2024-06-14 09:03:26
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -221,6 +221,7 @@ export default {
}; };
}, },
actualOptions() { actualOptions() {
console.log('this.output.current / this.output.target', this.output.current/this.output.target);
const year = new Date().getFullYear() const year = new Date().getFullYear()
const options = JSON.parse(JSON.stringify(this.options)); const options = JSON.parse(JSON.stringify(this.options));
// console.log('options', options); // console.log('options', options);
@ -228,7 +229,7 @@ export default {
if (!this.output.target) options.title.text = "0%"; if (!this.output.target) options.title.text = "0%";
else else
options.title.text = options.title.text =
(this.output.current / this.output.target) * 100 + "%"; ((this.output.current / this.output.target).toFixed(2)) * 100 + "%";
// //
if ( if (
this.output.current == this.output.target && this.output.current == this.output.target &&

View File

@ -59,7 +59,7 @@ export default {
actualOptions: null, actualOptions: null,
options: { options: {
grid: { grid: {
left: "3%", left: "5%",
right: "4%", right: "4%",
bottom: "0", bottom: "0",
top: "15%", top: "15%",

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-28 13:42:51 * @Date: 2024-04-28 13:42:51
* @LastEditTime: 2024-06-04 15:35:54 * @LastEditTime: 2024-06-14 09:16:09
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -65,7 +65,7 @@ export default {
isFullscreen: false, isFullscreen: false,
options: { options: {
grid: { grid: {
left: "3%", left: "5%",
right: "4%", right: "4%",
bottom: "0", bottom: "0",
top: "18%", top: "18%",

View File

@ -10,7 +10,7 @@
style=" style="
position: absolute; position: absolute;
top: 12%; top: 12%;
left: 20%; left: 15%;
user-select: none; user-select: none;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -31,7 +31,7 @@
<p <p
style=" style="
margin: 0; margin: 0;
font-size: 26px; font-size: 24px;
letter-spacing: 1px; letter-spacing: 1px;
color: #26b9de; color: #26b9de;
opacity: 75%; opacity: 75%;
@ -52,8 +52,8 @@
</p> </p>
</div> </div>
<img <img
src="../assets/images/login.png" src="../assets/images/map.png"
style="position: absolute; top: 30%; left: 15%; width: 40vw" style="position: absolute; top: 00%; left: 11%; width: 50vw"
alt="" alt=""
/> />
</div> </div>

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-17 16:31:51 * @Date: 2024-04-17 16:31:51
* @LastEditTime: 2024-06-04 16:45:52 * @LastEditTime: 2024-06-17 16:55:04
* @LastEditors: DY * @LastEditors: DY
* @Description: * @Description:
--> -->
@ -11,7 +11,7 @@
{{ dataForm.id ? '编辑' : '新增' }} {{ dataForm.id ? '编辑' : '新增' }}
</small-title> </small-title>
<div class="detailBox"> <div class="detailBox">
<el-form ref="form" :model="dataForm" label-width="80px" label-position="top"> <el-form ref="form" :model="dataForm" label-width="80px" :rules="dataRule" label-position="top">
<el-row :gutter="24" style="padding: 0 32px;"> <el-row :gutter="24" style="padding: 0 32px;">
<el-col :span="8"> <el-col :span="8">
<el-form-item v-if="ftype === 0" label="工厂名称" prop="factory"> <el-form-item v-if="ftype === 0" label="工厂名称" prop="factory">
@ -29,7 +29,7 @@
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="时间维度" prop="targetType"> <el-form-item label="时间维度" prop="targetType">
<el-select v-model="dataForm.targetType" placeholder="请选择时间维度" clearable> <el-select v-model="dataForm.targetType" placeholder="请选择时间维度" clearable @change="clearTime">
<!-- <el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id"> --> <!-- <el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id"> -->
<el-option label="日" :value="0" /> <el-option label="日" :value="0" />
<el-option label="周" :value="1" /> <el-option label="周" :value="1" />
@ -40,19 +40,19 @@
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item v-show="dataForm.targetType === 0 || dataForm.targetType === ''" label="时间" prop="reportTime"> <el-form-item v-show="dataForm.targetType === 0 || dataForm.targetType === ''" label="时间" prop="reportTime">
<el-date-picker v-model="reportTime" value-format="yyyyMMdd" type="date" placeholder="选择日"> <el-date-picker v-model="dataForm.reportTime" value-format="yyyyMMdd" type="date" placeholder="选择日">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item v-show="dataForm.targetType === 1" label="时间" prop="week"> <el-form-item v-show="dataForm.targetType === 1" label="时间" prop="reportTime">
<el-date-picker v-model="week" type="week" format="yyyy 第 WW 周" placeholder="选择周"> <el-date-picker v-model="week" type="week" format="yyyy 第 WW 周" placeholder="选择周" @change="setReportTime">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item v-show="dataForm.targetType === 2" label="时间" prop="reportTime"> <el-form-item v-show="dataForm.targetType === 2" label="时间" prop="reportTime">
<el-date-picker v-model="reportTime" value-format="yyyyMM" type="month" placeholder="选择月份"> <el-date-picker v-model="dataForm.reportTime" value-format="yyyyMM" type="month" placeholder="选择月份">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item v-show="dataForm.targetType === 3" label="时间" prop="reportTime"> <el-form-item v-show="dataForm.targetType === 3" label="时间" prop="reportTime">
<el-date-picker clearable v-model="reportTime" value-format="yyyy" type="year" placeholder="开始时间"> <el-date-picker clearable v-model="dataForm.reportTime" value-format="yyyy" type="year" placeholder="开始时间">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -170,6 +170,11 @@
<el-input-number v-model="dataForm.componentAveragePower" :precision="2" controls-position="right" placeholder="请输入标准组件平均功率" style="width: 100%" /> <el-input-number v-model="dataForm.componentAveragePower" :precision="2" controls-position="right" placeholder="请输入标准组件平均功率" style="width: 100%" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6">
<el-form-item label="标准组件转化效率" prop="componentConversionEfficiency">
<el-input-number v-model="dataForm.componentConversionEfficiency" :precision="2" controls-position="right" placeholder="请输入标准组件转化效率" style="width: 100%" />
</el-form-item>
</el-col>
</el-row> </el-row>
<el-divider></el-divider> <el-divider></el-divider>
@ -260,9 +265,10 @@ export default {
teamList: [], teamList: [],
sectionList: [], sectionList: [],
visible: false, visible: false,
reportTime: undefined, // reportTime: undefined,
week: undefined, week: undefined,
dataForm: { dataForm: {
reportTime: undefined,
factoryType: 0, factoryType: 0,
id: undefined, id: undefined,
factory: undefined, factory: undefined,
@ -293,13 +299,14 @@ export default {
bipvInsideMaterialCost: undefined, bipvInsideMaterialCost: undefined,
bipvOeeMaterialCost: undefined, bipvOeeMaterialCost: undefined,
bipvComprehensiveMaterialCost: undefined, bipvComprehensiveMaterialCost: undefined,
molybdenumElectrodeInput: undefined molybdenumElectrodeInput: undefined,
componentConversionEfficiency: undefined
}, },
// materialList: [], // materialList: [],
dataRule: { dataRule: {
// materialId: [{ required: true, message: "", trigger: "blur" }], factory: [{ required: true, message: "工厂名称不能为空", trigger: "chnage" }],
// workOrderId: [{ required: true, message: "", trigger: "change" }], reportTime: [{ required: true, message: "时间不能为空", trigger: "change" }],
// num: [{ required: true, message: "", trigger: "blur" }], targetType: [{ required: true, message: "时间维度不能为空", trigger: "change" }]
// detId: [{ required: true, message: "", trigger: "change" }], // detId: [{ required: true, message: "", trigger: "change" }],
// logTime: [{ required: true, message: "", trigger: "change" }], // logTime: [{ required: true, message: "", trigger: "change" }],
@ -310,6 +317,13 @@ export default {
// this.getCurrentTime() // this.getCurrentTime()
}, },
methods: { methods: {
setReportTime() {
this.dataForm.reportTime = this.week
},
clearTime() {
this.week = undefined
this.dataForm.reportTime = undefined
},
formClear() { formClear() {
if (this.$refs.dataForm !== undefined) { if (this.$refs.dataForm !== undefined) {
this.$refs.dataForm.resetFields() this.$refs.dataForm.resetFields()
@ -319,16 +333,19 @@ export default {
// this.dataForm.targetTime = undefined // this.dataForm.targetTime = undefined
// }, // },
handleClose() { handleClose() {
this.$refs["form"].validate(valid => {
if (valid) {
// //
if (this.dataForm.targetType === 1) { if (this.dataForm.targetType === 1) {
this.dataForm.targetTime = this.week ? Number(moment(this.week.getTime()).format('YYYYWW')) : undefined this.dataForm.targetTime = this.week ? Number(moment(this.week.getTime()).format('YYYYWW')) : ''
} else { } else {
this.dataForm.targetTime = this.reportTime ? Number(this.reportTime) : undefined this.dataForm.targetTime = this.dataForm.reportTime ? Number(this.dataForm.reportTime) : ''
} }
if (this.dataForm.id) { if (this.dataForm.id) {
// //
updateProduceTarget({ updateProduceTarget({
...this.dataForm ...this.dataForm,
reportTime: undefined
}).then(res => { }).then(res => {
if (res.code === 0) { if (res.code === 0) {
this.$message.success('修改成功!') this.$message.success('修改成功!')
@ -339,7 +356,8 @@ export default {
} else { } else {
// //
createProduce({ createProduce({
...this.dataForm ...this.dataForm,
reportTime: undefined
}).then(res => { }).then(res => {
if (res.code === 0) { if (res.code === 0) {
this.$message.success('新增成功!') this.$message.success('新增成功!')
@ -348,6 +366,8 @@ export default {
} }
}) })
} }
}
})
}, },
init(id) { init(id) {
this.dataForm.id = id || undefined this.dataForm.id = id || undefined
@ -357,7 +377,8 @@ export default {
getProduceTargetDetail(this.dataForm.id).then(res => { getProduceTargetDetail(this.dataForm.id).then(res => {
this.dataForm = res.data this.dataForm = res.data
if (this.dataForm.targetType === 0 || this.dataForm.targetType === 2 || this.dataForm.targetType === 3) { if (this.dataForm.targetType === 0 || this.dataForm.targetType === 2 || this.dataForm.targetType === 3) {
this.reportTime = String(this.dataForm.targetTime) // this.dataForm.reportTime = String(this.dataForm.targetTime)
this.$set(this.dataForm, 'reportTime', String(this.dataForm.targetTime))
} }
if (this.dataForm.targetType === 1) { if (this.dataForm.targetType === 1) {
const date = new Date() const date = new Date()
@ -366,6 +387,7 @@ export default {
date.setDate((Number(String(this.dataForm.targetTime).slice(4)) - 1)* 7 + 1) date.setDate((Number(String(this.dataForm.targetTime).slice(4)) - 1)* 7 + 1)
// console.log('', date, moment(date).format('yyyyWW'), String(this.dataForm.targetTime).slice(4)) // console.log('', date, moment(date).format('yyyyWW'), String(this.dataForm.targetTime).slice(4))
this.week = date this.week = date
this.$set(this.dataForm, 'reportTime', date)
} }
}) })
} }

View File

@ -1,14 +1,15 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2023-11-06 15:15:30 * @Date: 2023-11-06 15:15:30
* @LastEditTime: 2024-06-04 16:54:46 * @LastEditTime: 2024-06-14 10:41:23
* @LastEditors: DY * @LastEditors: DY
* @Description: * @Description:
--> -->
<template> <template>
<el-drawer class="drawer" :visible.sync="visible" size="58%" @closed="$emit('destroy')"> <el-drawer class="drawer" :visible.sync="visible" size="70%" @closed="$emit('destroy')">
<small-title slot="title" :no-padding="true"> <small-title slot="title" :no-padding="true">
{{ ftype === 0 ? '碲化镉工厂生产数据详情' : '铜铟镓硒工厂生产数据详情' }} <!-- {{ ftype === 0 ? '碲化镉工厂生产数据详情' : '铜铟镓硒工厂生产数据详情' }} -->
生产目标详情
</small-title> </small-title>
<div class="detailBox"> <div class="detailBox">
<el-row :gutter="24"> <el-row :gutter="24">
@ -113,6 +114,10 @@
<p class="title">标准组件平均功率(W)</p> <p class="title">标准组件平均功率(W)</p>
<p class="text">{{ dataForm.componentAveragePower }}</p> <p class="text">{{ dataForm.componentAveragePower }}</p>
</el-col> </el-col>
<el-col :span="6">
<p class="title">标准组件转化效率</p>
<p class="text">{{ dataForm.componentConversionEfficiency }}</p>
</el-col>
</el-row> </el-row>
<small-title style=" margin: 0;padding: 26px 32px 24px;margin-bottom: 22px;" :no-padding="false"> <small-title style=" margin: 0;padding: 26px 32px 24px;margin-bottom: 22px;" :no-padding="false">
{{ 'BIPV产品' }} {{ 'BIPV产品' }}
@ -197,35 +202,9 @@ export default {
], ],
sectionList: [], sectionList: [],
visible: false, visible: false,
dataForm: { dataForm: {}
id: undefined,
logTime: undefined,
source: 1,
detId: undefined,
workOrderId: null,
teamId: undefined,
num: undefined,
lineId: undefined,
description: undefined,
// description: undefined,
remark: undefined,
},
// materialList: [],
dataRule: {
// materialId: [{ required: true, message: "", trigger: "blur" }],
workOrderId: [{ required: true, message: "工单号不能为空", trigger: "change" }],
num: [{ required: true, message: "数量不能为空", trigger: "blur" }],
detId: [{ required: true, message: "报废原因不能为空", trigger: "change" }],
logTime: [{ required: true, message: "报废时间不能为空", trigger: "change" }],
}
}; };
}, },
mounted() {
this.getDict()
console.log('我看看', this.dataForm)
// this.getCurrentTime()
},
methods: { methods: {
init(id) { init(id) {
this.visible = true this.visible = true
@ -235,102 +214,7 @@ export default {
this.dataForm = res.data this.dataForm = res.data
}) })
} }
}, }
// getCurrentTime() {
// // new Date().Format("yyyy-MM-dd HH:mm:ss")
// this.dataForm.logTime = new Date()
// // this.dataForm.logTime = year + "-" + month + "-" + day;
// console.log(this.dataForm.logTime);
// },
async getDict() {
// //
// const res = await getList()
// this.typeList = res.data
// getWorkOrderList().then((res) => {
// console.log(res);
// // console.log(response);
// this.workOrderList = res.data.map((item) => {
// return {
// name: item.name,
// id: item.id
// }
// })
// // console.log(this.formConfig[0].selectOptions);
// // this.listQuery.total = response.data.total;
// })
// getLineList().then((res) => {
// console.log(res);
// // console.log(response);
// this.lineList = res.data.map((item) => {
// return {
// name: item.name,
// id: item.id
// }
// })
// // console.log(this.formConfig[0].selectOptions);
// // this.listQuery.total = response.data.total;
// })
// getDetList().then((res) => {
// console.log(res);
// // console.log(response);
// this.detList = res.data.map((item) => {
// return {
// name: item.content,
// id: item.id
// }
// })
// // console.log(this.formConfig[0].selectOptions);
// // this.listQuery.total = response.data.total;
// })
// getTeamList().then((res) => {
// console.log(res);
// // console.log(response);
// this.teamList = res.data.map((item) => {
// return {
// name: item.name,
// id: item.id
// }
// })
// // console.log(this.formConfig[0].selectOptions);
// // this.listQuery.total = response.data.total;
// })
// },
// async getWorksectionById(lineId) {
// if (lineId) {
// const { code, data } = await this.$axios({
// url: '/base/core-workshop-section/listByParentId',
// method: 'get',
// params: {
// id: lineId,
// },
// });
// if (code == 0) {
// console.log(data)
// this.sectionList = data.map((item) => {
// return {
// name: item.name,
// id: item.id,
// };
// });
// }
// } else {
// this.$axios({
// url: '/base/core-workshop-section/listAll',
// method: 'get',
// // params: {
// // id: lineId,
// // },
// }).then((res) => {
// // console.log(data)
// this.sectionList = res.data.map((item) => {
// return {
// name: item.name,
// id: item.id,
// };
// });
// })
// }
},
}, },
}; };
</script> </script>

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-15 10:49:13 * @Date: 2024-04-15 10:49:13
* @LastEditTime: 2024-06-05 16:19:04 * @LastEditTime: 2024-06-17 09:49:15
* @LastEditors: DY * @LastEditors: DY
* @Description: * @Description:
--> -->
@ -24,7 +24,7 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="时间维度" prop="date"> <el-form-item label="时间维度" prop="date">
<el-select size="small" clearable v-model="listQuery.date" placeholder="请选择"> <el-select size="small" clearable v-model="listQuery.date" placeholder="请选择" @change="clearTime">
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value"> <el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value">
</el-option> </el-option>
</el-select> </el-select>
@ -458,6 +458,13 @@ export default {
this.changeTime() this.changeTime()
}, },
methods: { methods: {
clearTime() {
this.listQuery.beginTime = undefined
this.listQuery.endTime = undefined
this.listQuery.reportTime = []
this.start = undefined
this.end = undefined
},
handleImport() { handleImport() {
this.upload.title = "生产目标导入"; this.upload.title = "生产目标导入";
this.upload.open = true; this.upload.open = true;

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2023-11-06 15:15:30 * @Date: 2023-11-06 15:15:30
* @LastEditTime: 2024-06-07 14:15:00 * @LastEditTime: 2024-06-17 17:03:17
* @LastEditors: DY * @LastEditors: DY
* @Description: * @Description:
--> -->
@ -23,7 +23,7 @@
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<p class="title">工单类型</p> <p class="title">工单类型</p>
<p class="text">{{ ['', '芯片单', '组件类型', 'bipv类型'][dataForm.workOrderType] }}</p> <p class="text">{{ ['', '芯片单', '组件类型', 'bipv类型'][dataForm.workOrderType] }}</p>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<p class="title">工单来源</p> <p class="title">工单来源</p>
@ -39,7 +39,7 @@
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<p class="title">工单状态</p> <p class="title">工单状态</p>
<p class="text">{{ ['未开始', '生产中', '已完成'][dataForm.orderStatus] }}</p> <p class="text">{{ ['', '未开始', '生产中', '已完成'][dataForm.orderStatus] }}</p>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<p class="title">投入状态</p> <p class="title">投入状态</p>
@ -83,7 +83,7 @@
</div> </div>
<div class="chartDiv"> <div class="chartDiv">
<div ref="equipmentLine" :style="{ height: '30vh', width: '40vw' }" /> <div ref="equipmentLine" :style="{ height: '30vh', width: '40vw' }" />
<div ref="line" v-show="dataForm.orderStatus === 1" :style="{ height: '30vh', width: '40vw' }" /> <div ref="line" v-show="dataForm.orderStatus === 2" :style="{ height: '30vh', width: '40vw' }" />
</div> </div>
</div> </div>
</el-drawer> </el-drawer>
@ -267,7 +267,7 @@ export default {
this.pieChart = echarts.init(this.$refs['pie']) this.pieChart = echarts.init(this.$refs['pie'])
this.pieChart.setOption({ this.pieChart.setOption({
title: { title: {
text: '产品良率 ' + (pieData[0].value / (pieData[0].value + pieData[1].value)).toFixed(4) * 100 + '%', text: !isNaN((pieData[0].value / (pieData[0].value + pieData[1].value)).toFixed(4) * 100) ? ( '产品良率 ' + (pieData[0].value / (pieData[0].value + pieData[1].value)).toFixed(4) * 100 + '%') : '产品良率 -',
left: 'center' left: 'center'
// subtext: 'Fake Data' // subtext: 'Fake Data'
}, },
@ -308,7 +308,7 @@ export default {
this.equipmentLineChart = echarts.init(this.$refs['equipmentLine']) this.equipmentLineChart = echarts.init(this.$refs['equipmentLine'])
this.equipmentLineChart.setOption({ this.equipmentLineChart.setOption({
title: { title: {
text: '制品分布', text: '制品分布',
left: 'center' left: 'center'
// subtext: 'Fake Data' // subtext: 'Fake Data'
}, },
@ -339,7 +339,7 @@ export default {
{ {
data: yAxisList, data: yAxisList,
type: 'bar', type: 'bar',
barWidth: '40px' barWidth: '50%'
} }
] ]
}, true) }, true)
@ -351,6 +351,9 @@ export default {
text: '历史趋势', text: '历史趋势',
left: 'center' // left: 'center' //
}, },
tooltip: {
trigger: 'item'
},
xAxis: { xAxis: {
type: 'category', type: 'category',
data: xAxisList, data: xAxisList,

View File

@ -1,28 +1,56 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-15 10:49:13 * @Date: 2024-04-15 10:49:13
* @LastEditTime: 2024-06-07 10:35:48 * @LastEditTime: 2024-06-17 16:32:02
* @LastEditors: DY * @LastEditors: DY
* @Description: * @Description:
--> -->
<template> <template>
<div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 35px)"> <div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 35px)">
<div class="app-container" style="margin-top: 8px; padding: 0 16px; height: auto; font-size: 20px; text-align: center;"> <el-row :gutter="10">
<p style="margin-bottom: 0">数据概览</p> <el-col :span="4">
<div class="app-container" style="padding: 16px; height: auto; text-align: left; border-radius: 8px;">
<!-- <p style="margin-bottom: 0">数据概览</p> -->
<div class="view"> <div class="view">
<div v-for="(item, index) in data" :key="index"> <div style="padding: 10px 0; width: 100%">
<p style="color: rgb(194,128,255)">{{ item }}</p> <div class="topDiv">
<p>{{ index }}</p> <div style="width: 4px; height: 52px; background: #71CC8C; border-radius: 2px;"></div>
<div class="centerDiv">
<span style="font-size: 30px; line-height: 30px; color: rgba(0,0,0,0.85);">{{ inputNum }}</span>
<span style="font-size: 14px; color: rgba(0,0,0,0.85);">在制工单数量</span>
</div>
<svg-icon icon-class="workProcess" style="width: 26px; height: 26px" />
</div> </div>
</div> </div>
</div> </div>
<div class="app-container" style="margin-top: 8px; height: auto;"> </div>
</el-col>
<el-col :span="20">
<div class="app-container" style="padding: 16px; height: auto; text-align: left; border-radius: 8px;">
<!-- <p style="margin-bottom: 0">数据概览</p> -->
<div class="view">
<div style="padding: 10px 0; width: 100%" v-for="(item, index) in factorys" :key="index">
<div class="topDiv">
<div style="width: 4px; height: 52px; background: #3A79FF; border-radius: 2px;"></div>
<div class="centerDiv">
<span style="font-size: 30px; line-height: 30px; color: rgba(0,0,0,0.85);">{{ factoryNum[index] }}</span>
<span style="font-size: 14px; color: rgba(0,0,0,0.85);">{{item}}</span>
</div>
<svg-icon icon-class="factoryWorkOrder" style="width: 26px; height: 26px" />
</div>
</div>
</div>
</div>
</el-col>
</el-row>
<!-- <div class="app-container" style="margin-top: 8px; height: auto;">
<search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" />
</div> -->
<div class="app-container" style="margin-top: 8px;flex-grow: 1;">
<!-- <search-bar :formConfigs="formConfig2" ref="searchBarForm" style="margin-bottom: 0" /> -->
<search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" />
</div>
<div class="app-container" style="margin-top: 8px;flex-grow: 1; height: auto;">
<search-bar :formConfigs="formConfig2" ref="searchBarForm" style="margin-bottom: 0" />
<base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" <base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize"
:table-data="tableData"> :table-data="tableData" :max-height="tableH">
<method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" fixed="right" <method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" fixed="right"
:method-list="tableBtn" @clickBtn="handleClick" /> :method-list="tableBtn" @clickBtn="handleClick" />
</base-table> </base-table>
@ -43,6 +71,7 @@ import { getWorkOrderPage, exportExcel, getOverView } from '@/api/produceData/or
// import inputTable from './inputTable.vue'; // import inputTable from './inputTable.vue';
import lineChart from './lineChart'; import lineChart from './lineChart';
import moment from 'moment' import moment from 'moment'
import tableHeightMixin from "@/mixins/tableHeightMixin";
// import ButtonNav from '@/components/ButtonNav' // import ButtonNav from '@/components/ButtonNav'
import basicPage from '@/mixins/basic-page' import basicPage from '@/mixins/basic-page'
import AddOrUpdate from './add-or-updata'; import AddOrUpdate from './add-or-updata';
@ -53,9 +82,13 @@ import { publicFormatter } from "@/utils/dict";
// import * as XLSX from 'xlsx' // import * as XLSX from 'xlsx'
export default { export default {
components: { lineChart, AddOrUpdate }, components: { lineChart, AddOrUpdate },
mixins: [basicPage], mixins: [basicPage, tableHeightMixin],
data() { data() {
return { return {
factorys: ['瑞昌中建材', '邯郸中建材', '株洲中建材', '佳木斯中建材', '成都中建材', '凯盛光伏', '蚌埠兴科'],
factoryNum: [0, 0, 0, 0, 0, 0, 0],
inputNum: 0,
heightNum: 180,
factoryList, factoryList,
factoryArray, factoryArray,
listQuery: { listQuery: {
@ -108,15 +141,15 @@ export default {
selectOptions: [ selectOptions: [
{ {
label: '未开始', label: '未开始',
value: 0
},
{
label: '生产中',
value: 1 value: 1
}, },
{ {
label: '已完成', label: '生产中',
value: 2 value: 2
},
{
label: '已完成',
value: 3
} }
], ],
labelField: "label", labelField: "label",
@ -179,6 +212,8 @@ export default {
{ {
prop: 'workOrderNumber', prop: 'workOrderNumber',
label: '工单号', label: '工单号',
minWidth: 120,
showOverflowtooltip: true
// filter: (val) => ['', '', 'BIPV', ''][val] // filter: (val) => ['', '', 'BIPV', ''][val]
}, },
{ {
@ -211,8 +246,8 @@ export default {
{ {
prop: 'orderStatus', prop: 'orderStatus',
label: '工单状态', label: '工单状态',
filter: publicFormatter('workorder_status') // filter: publicFormatter('workorder_status')
// filter: (val) => ['', '', ''][val], filter: (val) => ['', '未开始', '生产中', '已完成'][val],
}, },
{ {
prop: 'startTime', prop: 'startTime',
@ -229,15 +264,15 @@ export default {
], ],
tableData: [], tableData: [],
xAxis: [], xAxis: [],
lineData: {}, lineData: {}
data: {} // data: {}
// proLineList: [], // proLineList: [],
// all: {} // all: {}
}; };
}, },
created() { created() {
const today = new Date() const today = new Date()
const sevenDaysAgo = new Date(today.getTime() - (7 * 24 * 60 * 60 * 1000)) const sevenDaysAgo = new Date(today.getTime() - (6 * 24 * 60 * 60 * 1000))
this.listQuery.time = [moment(sevenDaysAgo).format('yyyy-MM-DD'), moment(today).format('yyyy-MM-DD')] this.listQuery.time = [moment(sevenDaysAgo).format('yyyy-MM-DD'), moment(today).format('yyyy-MM-DD')]
this.formConfig[2].defaultSelect = this.listQuery.time this.formConfig[2].defaultSelect = this.listQuery.time
}, },
@ -247,8 +282,19 @@ export default {
methods: { methods: {
getOverView() { getOverView() {
getOverView().then(res => { getOverView().then(res => {
this.data = res.data // this.data = res.data
console.log('aa', res.data) if (res.code === 0) {
for(const i in res.data) {
if (i === '在制工单数量') {
this.inputNum = res.data[i]
} else {
const index = this.factorys.indexOf(i)
if (index > -1) {
this.factoryNum[index] = res.data[i]
}
}
}
}
}) })
}, },
otherMethods(val) { otherMethods(val) {
@ -317,10 +363,18 @@ export default {
</script> </script>
<style scoped> <style scoped>
/* .blueTip { */ .centerDiv {
/* padding-bottom: 10px; */ display: flex;
/* } */ flex-direction: column;
/* .blueTi */ justify-content: flex-start;
}
.topDiv {
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: flex-start;
flex: 1;
}
.view { .view {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
@ -342,7 +396,7 @@ export default {
background-color: #fff; background-color: #fff;
border-radius: 4px; border-radius: 4px;
padding: 16px 16px 0; padding: 16px 16px 0;
height: calc(100vh - 134px); height: calc(100vh - 40px);
overflow: auto; overflow: auto;
} }
</style> </style>

View File

@ -1,50 +1,30 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-15 10:49:13 * @Date: 2024-04-15 10:49:13
* @LastEditTime: 2024-06-07 16:22:57 * @LastEditTime: 2024-06-18 13:41:03
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
<template> <template>
<div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 35px)"> <div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 35px)">
<!-- <div class="app-container"
style="margin-top: 8px; padding: 0 16px; height: auto; font-size: 20px; text-align: center;">
<p style="margin-bottom: 0">数据概览</p>
<div class="view">
<div v-for="(item, index) in data" :key="index">
<p style="color: rgb(194,128,255)">{{ item }}</p>
<p>{{ index }}</p>
</div>
</div>
</div> -->
<div class="" style="height: auto;"> <div class="" style="height: auto;">
<ButtonNav style="padding: 0;" :menus="['邯郸', '瑞昌']" :button-mode="true" @change="currentMenu = $event"> <ButtonNav style="padding: 0;" :menus="['邯郸', '瑞昌']" :button-mode="true" @change="currentMenu = $event">
<!-- <template v-slot:tab1>
<div style="margin: 20px; background: #f001;">
Page1: 状态时序图
</div>
</template>
<template v-slot:tab2>
<div style="margin: 20px">
Page2: 产量时序图
</div>
</template> -->
</ButtonNav> </ButtonNav>
</div> </div>
<div class="app-container" style="margin-top: 8px;flex-grow: 1; height: auto;"> <div class="app-container" style="margin-top: 8px;flex-grow: 1; height: auto;">
<el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip"> <el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip">
<el-form-item label="时间维度" prop="date"> <el-form-item label="时间维度" prop="date">
<el-select size="small" clearable v-model="listQuery.date" placeholder="请选择"> <el-select size="small" clearable v-model="listQuery.type" placeholder="请选择">
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value"> <el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value">
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.date === 1 || listQuery.date === ''" label="时间范围" prop="reportTime"> <el-form-item v-show="listQuery.type === 0 || listQuery.type === ''" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="daterange" range-separator="" <el-date-picker size="small" clearable v-model="listQuery.reportTime" type="daterange" range-separator=""
start-placeholder="开始日期" value-format="yyyyMMdd" @change="changeDayTime" end-placeholder="结束日期"> start-placeholder="开始日期" value-format="yyyy-MM-dd HH:mm:ss" @change="changeDayTime" end-placeholder="结束日期">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.date === 2" label="时间范围" prop="reportTime"> <el-form-item v-show="listQuery.type === 1" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="start" type="week" format="yyyy 第 WW 周" placeholder="选择周" <el-date-picker size="small" clearable v-model="start" type="week" format="yyyy 第 WW 周" placeholder="选择周"
style="width: 180px" @change="onValueChange"> style="width: 180px" @change="onValueChange">
</el-date-picker> </el-date-picker>
@ -52,21 +32,20 @@
<el-date-picker size="small" clearable v-model="end" type="week" format="yyyy 第 WW 周" placeholder="选择周" <el-date-picker size="small" clearable v-model="end" type="week" format="yyyy 第 WW 周" placeholder="选择周"
style="width: 180px" @change="onValueChange"> style="width: 180px" @change="onValueChange">
</el-date-picker> </el-date-picker>
<!-- <span v-if="start && end" style="margin-left: 10px">
{{ date1 }} {{ date2 }} {{ weekNum }}
</span> -->
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.date === 3" label="时间值" prop="reportTime"> <el-form-item v-show="listQuery.type === 2" label="时间值" prop="reportTime">
<el-date-picker size="small" v-model="listQuery.reportTime" type="monthrange" value-format="yyyyMM" <el-date-picker size="small" v-model="listQuery.reportTime" type="monthrange"
range-separator="至" start-placeholder="开始月份" end-placeholder="结束月份" @change="changeTime"> value-format="yyyy-MM-DD HH:mm:ss" range-separator="至" start-placeholder="开始月份" end-placeholder="结束月份"
@change="changeTime">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.date === 4" label="时间值" prop="reportTime"> <el-form-item v-show="listQuery.type === 3" label="时间值" prop="reportTime">
<el-date-picker size="small" clearable v-model="start" value-format="yyyy" type="year" placeholder="开始时间"> <el-date-picker size="small" clearable v-model="listQuery.reportTime[0]" value-format="yyyy" type="year"
placeholder="开始时间">
</el-date-picker> </el-date-picker>
~ ~
<el-date-picker size="small" clearable v-model="end" value-format="yyyy" type="year" placeholder="结束时间" <el-date-picker size="small" clearable v-model="listQuery.reportTime[1]" value-format="yyyy" type="year"
@change="getYear"> placeholder="结束时间" @change="getYear">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<!-- <el-form-item label="玻璃类型" prop="type"> <!-- <el-form-item label="玻璃类型" prop="type">
@ -91,26 +70,20 @@
</el-form> </el-form>
<base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" <base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize"
:table-data="tableData"> :table-data="tableData">
<method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" fixed="right"
:method-list="tableBtn" @clickBtn="handleClick" />
</base-table> </base-table>
<pagination :limit.sync="listQuery.pageSize" :page.sync="listQuery.pageNo" :total="listQuery.total"
@pagination="getDataList" />
</div> </div>
<!-- <add-or-update v-if="detailOrUpdateVisible" ref="detailOrUpdate" :date="listQuery.date"
@refreshDataList="successSubmit" @destroy="detailOrUpdateVisible = false" /> -->
</div> </div>
</template> </template>
<script> <script>
// import { parseTime } from '../../core/mixins/code-filter'; // import { parseTime } from '../../core/mixins/code-filter';
// import { getWorkOrderPage, exportExcel, getOverView } from '@/api/produceData/order'; import { getComprehensiveDataPage } from '@/api/report';
// import { getWorkOrderPage, exportExcel, getOverView } from '@/components/buttonNav' // import { getWorkOrderPage, exportExcel, getOverView } from '@/components/buttonNav'
// import inputTable from './inputTable.vue'; // import inputTable from './inputTable.vue';
// import lineChart from './lineChart'; // import lineChart from './lineChart';
import moment from 'moment' import moment from 'moment'
import ButtonNav from '@/components/ButtonNav' import ButtonNav from '@/components/ButtonNav'
import basicPage from '@/mixins/basic-page' // import basicPage from '@/mixins/basic-page'
// import AddOrUpdate from './add-or-updata'; // import AddOrUpdate from './add-or-updata';
import { factoryList, factoryArray } from "@/utils/constants"; import { factoryList, factoryArray } from "@/utils/constants";
import { publicFormatter } from "@/utils/dict"; import { publicFormatter } from "@/utils/dict";
@ -119,7 +92,7 @@ import { publicFormatter } from "@/utils/dict";
// import * as XLSX from 'xlsx' // import * as XLSX from 'xlsx'
export default { export default {
components: { ButtonNav }, components: { ButtonNav },
mixins: [basicPage], // mixins: [basicPage],
data() { data() {
return { return {
factoryList, factoryList,
@ -127,30 +100,30 @@ export default {
start: undefined, start: undefined,
end: undefined, end: undefined,
listQuery: { listQuery: {
size: 10, // size: 10,
current: 1, // current: 1,
factorys: null, factory: null,
total: 0, // total: 0,
date: 3, type: 2,
beginTime: undefined, startDate: undefined,
endTime: undefined, endDate: undefined,
reportTime: [] reportTime: []
}, },
timeList: [ timeList: [
{ {
value: 1, value: 0,
label: '日' label: '日'
}, },
{ {
value: 2, value: 1,
label: '周' label: '周'
}, },
{ {
value: 3, value: 2,
label: '月' label: '月'
}, },
{ {
value: 4, value: 3,
label: '年' label: '年'
} }
], ],
@ -201,48 +174,49 @@ export default {
// filter: publicFormatter('workorder_status') // filter: publicFormatter('workorder_status')
// filter: (val) => ['', '', '', 'bipv'][val], // filter: (val) => ['', '', '', 'bipv'][val],
}, },
{ // {
prop: 'plannedInvestment', // prop: 'plannedInvestment',
label: '计划投入', // label: '',
}, // },
{ // {
prop: 'actualInvestment', // prop: 'actualInvestment',
label: '实际投入', // label: '',
}, // },
{ // {
prop: 'targetProduction', // prop: 'targetProduction',
label: '目标产量', // label: '',
}, // },
{ // {
prop: 'actualProduction', // prop: 'actualProduction',
label: '实际产量', // label: '',
}, // },
{ // {
prop: 'productionProgress', // prop: 'productionProgress',
label: '生产进度', // label: '',
filter: (val) => (val * 100) + '%' // filter: (val) => (val * 100) + '%'
}, // },
{ // {
prop: 'orderStatus', // prop: 'orderStatus',
label: '工单状态', // label: '',
filter: publicFormatter('workorder_status') // filter: publicFormatter('workorder_status')
// filter: (val) => ['', '', ''][val], // // filter: (val) => ['', '', ''][val],
}, // },
{ // {
prop: 'startTime', // prop: 'startTime',
label: '开始时间', // label: '',
minWidth: 100, // minWidth: 100,
showOverflowtooltip: true // showOverflowtooltip: true
}, // },
{ // {
prop: 'endTime', // prop: 'endTime',
label: '完成时间', // label: '',
minWidth: 100, // minWidth: 100,
showOverflowtooltip: true // showOverflowtooltip: true
} // }
], ],
tableData: [], tableData: [],
xAxis: [], xAxis: [],
currentMenu:null,
lineData: {}, lineData: {},
data: {} data: {}
// proLineList: [], // proLineList: [],
@ -254,16 +228,17 @@ export default {
return Math.round((this.end - this.start) / (24 * 60 * 60 * 1000 * 7)) + 1 return Math.round((this.end - this.start) / (24 * 60 * 60 * 1000 * 7)) + 1
}, },
}, },
created() { // created() {
const currentMonth = new Date() // const currentMonth = new Date()
this.listQuery.reportTime = [moment(currentMonth).format('yyyyMM'), moment(currentMonth).format('yyyyMM')] // this.listQuery.reportTime = [moment(currentMonth).format('yyyy-MM-dd HH:mm:ss'), moment(currentMonth).format('yyyy-MM-dd HH:mm:ss')]
this.changeTime() // this.changeTime()
}, // },
mounted() { mounted() {
this.getOverView() // this.getOverView()
const currentMonth = new Date() const currentMonth = new Date()
this.listQuery.reportTime = [moment(currentMonth).format('yyyyMM'), moment(currentMonth).format('yyyyMM')] this.listQuery.reportTime = [moment(currentMonth).format('yyyy-MM-DD HH:mm:ss'), moment(currentMonth).format('yyyy-MM-DD HH:mm:ss')]
this.changeTime() this.changeTime()
this.getDataList()
}, },
methods: { methods: {
getYear(e) { getYear(e) {
@ -284,33 +259,37 @@ export default {
this.start = undefined this.start = undefined
this.end = undefined this.end = undefined
} else { } else {
this.listQuery.beginTime = Number(this.start) this.listQuery.startDate = Number(this.start)
this.listQuery.endTime = Number(this.end) this.listQuery.endDate = Number(this.end)
} }
} }
if (!this.start && !this.end) { if (!this.start && !this.end) {
this.listQuery.beginTime = undefined this.listQuery.startDate = undefined
this.listQuery.endTime = undefined this.listQuery.endDate = undefined
} }
// console.log(e); // console.log(e);
}, },
changeTime() { changeTime() {
if (this.listQuery.reportTime) { if (this.listQuery.reportTime) {
const years = Number(this.listQuery.reportTime[1].slice(0, 4)) - Number(this.listQuery.reportTime[0].slice(0, 4)) console.log(this.listQuery.reportTime)
const months = Number(this.listQuery.reportTime[1].slice(4)) - Number(this.listQuery.reportTime[0].slice(4)) let start = new Date(this.listQuery.reportTime[0])
if (years * 12 + months > 24) { let end = new Date(this.listQuery.reportTime[1])
// const years = Number(this.listQuery.reportTime[1].slice(0, 4)) - Number(this.listQuery.reportTime[0].slice(0, 4))
// const months = Number(this.listQuery.reportTime[1].slice(4)) - Number(this.listQuery.reportTime[0].slice(4))
// console.log(years);
if ((end - start) > 31104000000) {
this.$message({ this.$message({
message: '时间范围不能超过24个月', message: '时间范围不能超过24个月',
type: 'warning' type: 'warning'
}); });
this.listQuery.reportTime = []; this.listQuery.reportTime = [];
} else { } else {
this.listQuery.beginTime = Number(this.listQuery.reportTime[0]) this.listQuery.startDate = this.listQuery.reportTime[0]
this.listQuery.endTime = Number(this.listQuery.reportTime[1]) this.listQuery.endDate = this.listQuery.reportTime[1]
} }
} else { } else {
this.listQuery.beginTime = undefined this.listQuery.startDate = undefined
this.listQuery.endTime = undefined this.listQuery.endDate = undefined
} }
}, },
onValueChange(picker, k) { // k onValueChange(picker, k) { // k
@ -325,13 +304,15 @@ export default {
type: 'warning' type: 'warning'
}); });
} else { } else {
this.listQuery.beginTime = Number(moment(this.start.getTime()).format('YYYYWW')) this.listQuery.startDate = this.date1
this.listQuery.endTime = Number(moment(this.end.getTime()).format('YYYYWW')) this.listQuery.endDate = this.date2
// this.listQuery.startDate = Number(moment(this.start.getTime()).format('YYYYWW'))
// this.listQuery.endDate = Number(moment(this.end.getTime()).format('YYYYWW'))
} }
} }
if (!this.start && !this.end) { if (!this.start && !this.end) {
this.listQuery.beginTime = undefined this.listQuery.startDate = undefined
this.listQuery.endTime = undefined this.listQuery.endDate = undefined
} }
}, },
changeDayTime() { changeDayTime() {
@ -344,12 +325,12 @@ export default {
}); });
this.listQuery.reportTime = []; this.listQuery.reportTime = [];
} else { } else {
this.listQuery.beginTime = Number(this.listQuery.reportTime[0]) this.listQuery.startDate = this.listQuery.reportTime[0]
this.listQuery.endTime = Number(this.listQuery.reportTime[1]) this.listQuery.endDate = this.listQuery.reportTime[1]
} }
} else { } else {
this.listQuery.beginTime = undefined this.listQuery.startDate = undefined
this.listQuery.endTime = undefined this.listQuery.endDate = undefined
} }
}, },
getOverView() { getOverView() {
@ -366,26 +347,34 @@ export default {
}); });
}, },
async getDataList() { async getDataList() {
// const res = await getWorkOrderPage(this.listQuery) console.log(this.listQuery);
// this.tableData = res.data.list if (this.listQuery.type == 3) {
// this.listQuery.total = res.data.total this.listQuery.startDate = this.listQuery.reportTime[0] + '-01-01 00:00:00'
// if (this.listQuery.total > 0) { this.listQuery.endDate = this.listQuery.reportTime[1] + '-12-31 23:59:59'
// this.tableData.forEach(item => { }
// item.startTime = item.startDate ? item.startDate[0] + '-' + item.startDate[1] + '-' + item.startDate[2] : '--' let arr = []
// item.endTime = item.endDate ? item.endDate[0] + '-' + item.endDate[1] + '-' + item.endDate[2] : '--' this.currentMenu === '邯郸' ? arr.push(1) : arr.push(2)
// }) this.listQuery.factory = arr
// } const res = await getComprehensiveDataPage(this.listQuery)
this.tableData = res.data.list
this.listQuery.total = res.data.total
if (this.listQuery.total > 0) {
this.tableData.forEach(item => {
item.startTime = item.startDate ? item.startDate[0] + '-' + item.startDate[1] + '-' + item.startDate[2] : '--'
item.endTime = item.endDate ? item.endDate[0] + '-' + item.endDate[1] + '-' + item.endDate[2] : '--'
})
}
}, },
buttonClick(val) { buttonClick(val) {
this.listQuery.factorys = val.factory?.length > 0 ? val.factory : undefined this.listQuery.factorys = val.factory?.length > 0 ? val.factory : undefined
this.listQuery.orderStatus = val.orderStatus?.length > 0 ? val.orderStatus : undefined // this.listQuery.orderStatus = val.orderStatus?.length > 0 ? val.orderStatus : undefined
this.listQuery.time = val.timeSlot?.length > 0 ? val.timeSlot : undefined // this.listQuery.time = val.timeSlot?.length > 0 ? val.timeSlot : undefined
switch (val.btnName) { switch (val.btnName) {
case 'search': case 'search':
this.listQuery.pageNo = 1; // this.listQuery.pageNo = 1;
this.listQuery.pageSize = 20; // this.listQuery.pageSize = 20;
if (this.listQuery.time) { if (this.listQuery.time) {
this.getDataList(); // this.getDataList();
} else { } else {
this.$message.warning('请选择时间范围!') this.$message.warning('请选择时间范围!')
} }

View File

@ -1,23 +1,10 @@
<!--
* @Author: zhp
* @Date: 2024-06-11 08:45:34
* @LastEditTime: 2024-06-11 11:08:27
* @LastEditors: zhp
* @Description:
-->
<template> <template>
<div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 35px)"> <div>
<!-- <div class="app-container" <!-- <div class="search"> -->
style="margin-top: 8px; padding: 0 16px; height: auto; font-size: 20px; text-align: center;"> <ButtonNav style="padding: 0;" :menus="['邯郸', '瑞昌']" :button-mode="true" @change="currentMenu = $event">
<p style="margin-bottom: 0">数据概览</p> </ButtonNav>
<div class="view"> <!-- </div> -->
<div v-for="(item, index) in data" :key="index"> <div class="containerTop">
<p style="color: rgb(194,128,255)">{{ item }}</p>
<p>{{ index }}</p>
</div>
</div>
</div> -->
<div class="app-container" style="flex: 1;min-height: 40vh;">
<el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip"> <el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip">
<el-form-item label="时间维度" prop="date"> <el-form-item label="时间维度" prop="date">
<el-select size="small" clearable v-model="listQuery.date" placeholder="请选择"> <el-select size="small" clearable v-model="listQuery.date" placeholder="请选择">
@ -25,12 +12,12 @@
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.date === 1 || listQuery.date === ''" label="时间范围" prop="reportTime"> <el-form-item v-show="listQuery.date === 0 || listQuery.type === ''" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="daterange" range-separator="" <el-date-picker size="small" clearable v-model="listQuery.reportTime" type="daterange" range-separator=""
start-placeholder="开始日期" value-format="yyyyMMdd" @change="changeDayTime" end-placeholder="结束日期"> start-placeholder="开始日期" value-format="yyyy-MM-dd HH:mm:ss" @change="changeDayTime" end-placeholder="结束日期">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.date === 2" label="时间范围" prop="reportTime"> <el-form-item v-show="listQuery.date === 1" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="start" type="week" format="yyyy 第 WW 周" placeholder="选择周" <el-date-picker size="small" clearable v-model="start" type="week" format="yyyy 第 WW 周" placeholder="选择周"
style="width: 180px" @change="onValueChange"> style="width: 180px" @change="onValueChange">
</el-date-picker> </el-date-picker>
@ -42,17 +29,19 @@
{{ date1 }} {{ date2 }} {{ weekNum }} {{ date1 }} {{ date2 }} {{ weekNum }}
</span> --> </span> -->
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.date === 3" label="时间值" prop="reportTime"> <el-form-item v-show="listQuery.date === 2" label="时间值" prop="reportTime">
<el-date-picker size="small" v-model="listQuery.reportTime" type="monthrange" value-format="yyyyMM" <el-date-picker size="small" v-model="listQuery.reportTime" type="monthrange"
range-separator="至" start-placeholder="开始月份" end-placeholder="结束月份" @change="changeTime"> value-format="yyyy-MM-DD HH:mm:ss" range-separator="至" start-placeholder="开始月份" end-placeholder="结束月份"
@change="changeTime">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.date === 4" label="时间值" prop="reportTime"> <el-form-item v-show="listQuery.date === 3" label="时间值" prop="reportTime">
<el-date-picker size="small" clearable v-model="start" value-format="yyyy" type="year" placeholder="开始时间"> <el-date-picker size="small" clearable v-model="listQuery.reportTime[0]" value-format="yyyy" type="year"
placeholder="开始时间">
</el-date-picker> </el-date-picker>
~ ~
<el-date-picker size="small" clearable v-model="end" value-format="yyyy" type="year" placeholder="结束时间" <el-date-picker size="small" clearable v-model="listQuery.reportTime[1]" value-format="yyyy" type="year"
@change="getYear"> placeholder="结束时间" @change="getYear">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<!-- <el-form-item label="玻璃类型" prop="type"> <!-- <el-form-item label="玻璃类型" prop="type">
@ -75,185 +64,242 @@
<!-- <el-button type="success" size="small" plain @click="addFactory">新增</el-button> --> <!-- <el-button type="success" size="small" plain @click="addFactory">新增</el-button> -->
</el-form-item> </el-form-item>
</el-form> </el-form>
<line-chart ref="lineChart" style="height: 90%; width: 100%"></line-chart> <!-- <div class="smallTitle">产量转化效率</div> -->
<!-- <bmSearchBar @getSearch="getSearch" @handleExport="handleExport" /> -->
<bm-line-bar :chartHeight="chartHeight" :legendList="legendList" :chartMsg="chartMsg" :chartId="chartId"
:chartNum="chartNum" />
<base-table :table-props="tableProps" :page="listQuery.current" :limit="listQuery.size" :table-data="tableData"
:max-height="tableH" />
</div> </div>
<div class="app-container" style="margin-top: 8px;flex: 1"> <!-- <div class="containerBottom">
<base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize"
:table-data="tableData"> </div> -->
<method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" fixed="right"
:method-list="tableBtn" @clickBtn="handleClick" />
</base-table>
<pagination :limit.sync="listQuery.pageSize" :page.sync="listQuery.pageNo" :total="listQuery.total"
@pagination="getDataList" />
</div>
<!-- <add-or-update v-if="detailOrUpdateVisible" ref="detailOrUpdate" :date="listQuery.date"
@refreshDataList="successSubmit" @destroy="detailOrUpdateVisible = false" /> -->
</div> </div>
</template> </template>
<script> <script>
// import { parseTime } from '../../core/mixins/code-filter'; import bmSearchBar from "./components/bmSearchBar.vue";
// import { getWorkOrderPage, exportExcel, getOverView } from '@/api/produceData/order'; import BmLineBar from "./components/bmLineBar.vue";
// import { getWorkOrderPage, exportExcel, getOverView } from '@/components/buttonNav'
// import inputTable from './inputTable.vue';
// import lineChart from './lineChart';
import moment from 'moment'
import ButtonNav from '@/components/ButtonNav' import ButtonNav from '@/components/ButtonNav'
import basicPage from '@/mixins/basic-page' import moment from 'moment'
// import AddOrUpdate from './add-or-updata'; import { getProduceTransData } from '@/api/report';
import { factoryList, factoryArray } from "@/utils/constants"; const tableProps = [
import { publicFormatter } from "@/utils/dict"; {
import lineChart from "./components/lineChart"; prop: "factory",
label: "玻璃类型",
// import FileSaver from 'file-saver' // filter: (val) => factoryList[val],
// import * as XLSX from 'xlsx' minWidth: 200,
showOverflowtooltip: true,
},
{
prop: "name",
label: "科目",
minWidth: 120,
showOverflowtooltip: true,
},
{
prop: "unit",
label: "单位",
minWidth: 80,
showOverflowtooltip: true,
},
{
prop: "time1",
label: "时间1",
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: "time2",
label: "时间2",
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: "mubiao",
label: "目标值",
minWidth: 150,
showOverflowtooltip: true,
},
];
export default { export default {
components: { ButtonNav, lineChart }, name: "ChipYieldBM",
mixins: [basicPage],
data() { data() {
return { return {
factoryList, tableProps,
factoryArray,
start: undefined, start: undefined,
end: undefined, end: undefined,
listQuery: { listQuery: {
size: 10, // size: 10,
current: 1, // current: 1,
factorys: null, factorys: null,
total: 0, // total: 0,
date: 3, date: 2,
beginTime: undefined, beginTime: undefined,
endTime: undefined, endTime: undefined,
reportTime: [] reportTime: []
}, },
timeList: [ timeList: [
{ {
value: 1, value: 0,
label: '日' label: '日'
}, },
{ {
value: 2, value: 1,
label: '周' label: '周'
}, },
{ {
value: 3, value: 2,
label: '月' label: '月'
}, },
{ {
value: 4, value: 3,
label: '年' label: '年'
} }
], ],
detailOrUpdateVisible: false, tableData: [
tableBtn: [ { factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
],
chartHeight: this.tableHeight(137) / 2 - 111,
tableH: this.tableHeight(137) / 2 - 70,
legendList: [
{ id: 1, name: "2024年4月目标值", type: 2, color: "#FFCE6A" },
{ id: 2, name: "2023年4月", type: 1, color: "#8EF0AB" },
{ id: 3, name: "2024年4月", type: 1, color: "#288AFF" },
],
chartMsg: {
color: ["#FFCE6A", "#8EF0AB", "#288AFF"],
xData: ["成都", "邯郸", "瑞昌"],
yName: "单位/%",
series: [
{ {
type: 'detail', name: "2024年4月目标值",
btnName: '详情', data: [
{ name: "%", value: 85 },
{ name: "%", value: 85 },
{ name: "%", value: 85 },
],
type: "line",
symbol: "circle",
symbolSize: 6,
label: {
show: true,
color: "#FFAE17",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
}, },
// {
// type: 'delete',
// btnName: '',
// },
].filter((v) => v),
typeList: [
{
name: '芯片',
id: 0,
}, },
{ {
name: '标准组件', name: "2023年4月",
id: 1, data: [
{ name: "%", value: 57.5 },
{ name: "%", value: 21.66 },
{ name: "%", value: 18.4 },
],
type: "bar",
barWidth: 20,
label: {
show: true,
position: [-18, -16],
color: "#68C483",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
}, },
{ {
name: 'BIPV产品', name: "2024年4月",
id: 2, data: [
{ name: "%", value: 23.33 },
{ name: "%", value: 7.02 },
{ name: "%", value: 80.2 },
],
type: "bar",
barWidth: 20,
label: {
show: true,
position: [0, -16],
color: "#288AFF",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
}, },
], ],
tableProps: [
{
prop: 'factory',
label: '玻璃类型',
fixed:true,
// filter: (val) => factoryList[val],
// minWidth: 200,
// showOverflowtooltip: true
}, },
{ chartId: "chipYieldBMChart",
prop: 'workOrderNumber', chartNum: 1,
label: '科目/日期',
fixed: true,
// filter: (val) => ['', '', 'BIPV', ''][val]
},
{
prop: 'workOrderType',
label: '单位',
fixed: true,
// filter: publicFormatter('workorder_status')
// filter: (val) => ['', '', '', 'bipv'][val],
},
{
prop: 'plannedInvestment',
label: '计划投入',
},
{
prop: 'actualInvestment',
label: '实际投入',
},
{
prop: 'targetProduction',
label: '目标产量',
},
{
prop: 'actualProduction',
label: '实际产量',
},
{
prop: 'productionProgress',
label: '生产进度',
filter: (val) => (val * 100) + '%'
},
{
prop: 'orderStatus',
label: '工单状态',
filter: publicFormatter('workorder_status')
// filter: (val) => ['', '', ''][val],
},
{
prop: 'startTime',
label: '开始时间',
minWidth: 100,
showOverflowtooltip: true
},
{
prop: 'endTime',
label: '完成时间',
minWidth: 100,
showOverflowtooltip: true
}
],
tableData: [],
xAxis: [],
lineData: {},
data: {}
// proLineList: [],
// all: {}
}; };
}, },
components: {
bmSearchBar,
BmLineBar,
ButtonNav
},
computed: { computed: {
weekNum() { weekNum() {
return Math.round((this.end - this.start) / (24 * 60 * 60 * 1000 * 7)) + 1 return Math.round((this.end - this.start) / (24 * 60 * 60 * 1000 * 7)) + 1
}, },
isOpen() {
return this.$store.getters.sidebar.opened;
},
},
watch: {
//
isOpen(val) {
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
},
}, },
created() { created() {
const currentMonth = new Date() this.tableH = this.tableHeight(137) / 2 - 70;
this.listQuery.reportTime = [moment(currentMonth).format('yyyyMM'), moment(currentMonth).format('yyyyMM')] this.chartHeight = this.tableHeight(137) / 2 - 111;
this.changeTime() window.addEventListener("resize", this._setTableHeight);
},
destroyed() {
window.removeEventListener("resize", this._setTableHeight);
},
activated() {
//
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
}, },
mounted() { mounted() {
this.getOverView() // this.getOverView()
const currentMonth = new Date() const currentMonth = new Date()
this.listQuery.reportTime = [moment(currentMonth).format('yyyyMM'), moment(currentMonth).format('yyyyMM')] this.listQuery.reportTime = [moment(currentMonth).format('yyyy-MM-DD HH:mm:ss'), moment(currentMonth).format('yyyy-MM-DD HH:mm:ss')]
this.changeTime() this.changeTime()
this.getDataList()
}, },
methods: { methods: {
getYear(e) { getYear(e) {
@ -286,17 +332,21 @@ export default {
}, },
changeTime() { changeTime() {
if (this.listQuery.reportTime) { if (this.listQuery.reportTime) {
const years = Number(this.listQuery.reportTime[1].slice(0, 4)) - Number(this.listQuery.reportTime[0].slice(0, 4)) console.log(this.listQuery.reportTime)
const months = Number(this.listQuery.reportTime[1].slice(4)) - Number(this.listQuery.reportTime[0].slice(4)) let start = new Date(this.listQuery.reportTime[0])
if (years * 12 + months > 24) { let end = new Date(this.listQuery.reportTime[1])
// const years = Number(this.listQuery.reportTime[1].slice(0, 4)) - Number(this.listQuery.reportTime[0].slice(0, 4))
// const months = Number(this.listQuery.reportTime[1].slice(4)) - Number(this.listQuery.reportTime[0].slice(4))
// console.log(years);
if ((end - start) > 31104000000) {
this.$message({ this.$message({
message: '时间范围不能超过24个月', message: '时间范围不能超过24个月',
type: 'warning' type: 'warning'
}); });
this.listQuery.reportTime = []; this.listQuery.reportTime = [];
} else { } else {
this.listQuery.beginTime = Number(this.listQuery.reportTime[0]) this.listQuery.beginTime = this.listQuery.reportTime[0]
this.listQuery.endTime = Number(this.listQuery.reportTime[1]) this.listQuery.endTime = this.listQuery.reportTime[1]
} }
} else { } else {
this.listQuery.beginTime = undefined this.listQuery.beginTime = undefined
@ -315,8 +365,10 @@ export default {
type: 'warning' type: 'warning'
}); });
} else { } else {
this.listQuery.beginTime = Number(moment(this.start.getTime()).format('YYYYWW')) this.listQuery.beginTime = this.date1
this.listQuery.endTime = Number(moment(this.end.getTime()).format('YYYYWW')) this.listQuery.endTime = this.date2
// this.listQuery.beginTime = Number(moment(this.start.getTime()).format('YYYYWW'))
// this.listQuery.endTime = Number(moment(this.end.getTime()).format('YYYYWW'))
} }
} }
if (!this.start && !this.end) { if (!this.start && !this.end) {
@ -334,8 +386,8 @@ export default {
}); });
this.listQuery.reportTime = []; this.listQuery.reportTime = [];
} else { } else {
this.listQuery.beginTime = Number(this.listQuery.reportTime[0]) this.listQuery.beginTime = this.listQuery.reportTime[0]
this.listQuery.endTime = Number(this.listQuery.reportTime[1]) this.listQuery.endTime = this.listQuery.reportTime[1]
} }
} else { } else {
this.listQuery.beginTime = undefined this.listQuery.beginTime = undefined
@ -356,73 +408,55 @@ export default {
}); });
}, },
async getDataList() { async getDataList() {
// const res = await getWorkOrderPage(this.listQuery) console.log(this.listQuery);
// this.tableData = res.data.list if (this.listQuery.date == 3) {
// this.listQuery.total = res.data.total this.listQuery.beginTime = this.listQuery.reportTime[0] + '-01-01 00:00:00'
// if (this.listQuery.total > 0) { this.listQuery.endTime = this.listQuery.reportTime[1] + '-12-31 23:59:59'
// this.tableData.forEach(item => { }
// item.startTime = item.startDate ? item.startDate[0] + '-' + item.startDate[1] + '-' + item.startDate[2] : '--' let arr = []
// item.endTime = item.endDate ? item.endDate[0] + '-' + item.endDate[1] + '-' + item.endDate[2] : '--' this.currentMenu === '邯郸' ? arr.push(1) : arr.push(2)
// }) this.listQuery.factorys = arr
// } const res = await getProduceTransData(this.listQuery)
this.tableData = res.data.list
this.listQuery.total = res.data.total
if (this.listQuery.total > 0) {
this.tableData.forEach(item => {
item.startTime = item.beginTime ? item.beginTime[0] + '-' + item.beginTime[1] + '-' + item.beginTime[2] : '--'
item.endTime = item.endTime ? item.endTime[0] + '-' + item.endTime[1] + '-' + item.endTime[2] : '--'
})
}
}, },
buttonClick(val) { _setTableHeight() {
this.listQuery.factorys = val.factory?.length > 0 ? val.factory : undefined this.tableH = this.tableHeight(137) / 2 - 70;
this.listQuery.orderStatus = val.orderStatus?.length > 0 ? val.orderStatus : undefined this.chartHeight = this.tableHeight(137) / 2 - 111;
this.listQuery.time = val.timeSlot?.length > 0 ? val.timeSlot : undefined if (this.$route.name === "ChipYieldBM") {
switch (val.btnName) { this.chartNum++;
case 'search':
this.listQuery.pageNo = 1;
this.listQuery.pageSize = 20;
if (this.listQuery.time) {
this.getDataList();
} else {
this.$message.warning('请选择时间范围!')
} }
break; },
case 'export': getSearch(val) {
if (this.listQuery.time) {
this.handleExport();
} else {
this.$message.warning('请选择时间范围!')
}
break;
default:
console.log(val); console.log(val);
} console.log("=========================");
}, },
/** 导出按钮操作 */
handleExport() { handleExport() {
// this.$modal.confirm('?').then(() => { console.log("导出");
// //
// // let params = {...this.listQuery};
// // params.current = 1;
// // params.size = 999;
// this.exportLoading = true;
// return exportExcel({
// factorys: this.listQuery.factorys,
// orderStatus: this.listQuery.orderStatus,
// time: this.listQuery.time
// });
// }).then(response => {
// this.$download.excel(response, '.xls');
// this.exportLoading = false;
// }).catch(() => { })
}, },
}, },
}; };
</script> </script>
<style scoped> <style lang="scss" scoped>
/* .blueTip { */ .search {
/* padding-bottom: 10px; */ // height: calc((100px));
/* } */ background-color: #fff;
/* .blueTi */ border-radius: 8px;
.view { padding: 16px 16px 0 16px;
display: flex; margin-bottom: 8px;
justify-content: space-around; }
align-items: center; .containerTop{
flex: 1; height: calc((100vh - 170px));
background-color: #fff;
border-radius: 8px;
padding: 16px;
} }
.blueTip::before { .blueTip::before {
@ -435,16 +469,23 @@ export default {
margin-right: 8PX; margin-right: 8PX;
margin-top: 8px; margin-top: 8px;
} }
.containerTop {
margin-top: 8px;
.app-container { .smallTitle {
margin: 0 0px 0; font-size: 16px;
background-color: #fff; color: #000;
border-radius: 4px; margin-bottom: 15px;
padding: 16px 16px 0; }
height: calc(100vh - 134px);
overflow: auto; .smallTitle::before {
} display: inline-block;
.noBack{ width: 4px;
background-color:black; height: 16px;
background: #0b58ff;
content: "";
margin-right: 8px;
vertical-align: -3px;
}
} }
</style> </style>

View File

@ -0,0 +1,490 @@
<template>
<div>
<!-- <div class="search"> -->
<ButtonNav style="padding: 0;" :menus="['邯郸', '瑞昌']" :button-mode="true" @change="currentMenu = $event">
</ButtonNav>
<!-- </div> -->
<div class="containerTop">
<el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip">
<el-form-item label="时间维度" prop="date">
<el-select size="small" clearable v-model="listQuery.type" placeholder="请选择">
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item v-show="listQuery.type === 0 || listQuery.type === ''" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="daterange" range-separator=""
start-placeholder="开始日期" value-format="yyyy-MM-dd HH:mm:ss" @change="changeDayTime" end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item v-show="listQuery.type === 1" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="start" type="week" format="yyyy 第 WW 周" placeholder="选择周"
style="width: 180px" @change="onValueChange">
</el-date-picker>
<el-date-picker size="small" clearable v-model="end" type="week" format="yyyy 第 WW 周" placeholder="选择周"
style="width: 180px" @change="onValueChange">
</el-date-picker>
<!-- <span v-if="start && end" style="margin-left: 10px">
{{ date1 }} {{ date2 }} {{ weekNum }}
</span> -->
</el-form-item>
<el-form-item v-show="listQuery.type === 2" label="时间值" prop="reportTime">
<el-date-picker size="small" v-model="listQuery.reportTime" type="monthrange"
value-format="yyyy-MM-DD HH:mm:ss" range-separator="至" start-placeholder="开始月份" end-placeholder="结束月份"
@change="changeTime">
</el-date-picker>
</el-form-item>
<el-form-item v-show="listQuery.type === 3" label="时间值" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime[0]" value-format="yyyy" type="year"
placeholder="开始时间">
</el-date-picker>
~
<el-date-picker size="small" clearable v-model="listQuery.reportTime[1]" value-format="yyyy" type="year"
placeholder="结束时间" @change="getYear">
</el-date-picker>
</el-form-item>
<!-- <el-form-item label="玻璃类型" prop="type">
<el-select v-model="listQuery.type" placeholder="请选择玻璃类型">
<el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item> -->
<!-- <el-form-item label="玻璃类型" prop="type">
<el-select v-model="listQuery.type" placeholder="请选择玻璃类型">
<el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item> -->
<el-form-item>
<el-button type="primary" size="small" @click="getDataList">查询</el-button>
<el-divider direction="vertical"></el-divider>
<!-- <el-button type="primary" size="small" plain @click="handleImport">导入</el-button> -->
<el-button type="primary" size="small" plain @click="handleExport">导出</el-button>
<!-- <el-button type="success" size="small" plain @click="addFactory">新增</el-button> -->
</el-form-item>
</el-form>
<!-- <div class="smallTitle">产量转化效率</div> -->
<!-- <bmSearchBar @getSearch="getSearch" @handleExport="handleExport" /> -->
<bm-line-bar :chartHeight="chartHeight" :legendList="legendList" :chartMsg="chartMsg" :chartId="chartId"
:chartNum="chartNum" />
<base-table :table-props="tableProps" :page="listQuery.current" :limit="listQuery.size" :table-data="tableData"
:max-height="tableH" />
</div>
<!-- <div class="containerBottom">
</div> -->
</div>
</template>
<script>
import bmSearchBar from "./components/bmSearchBar.vue";
import BmLineBar from "./components/bmLineBar.vue";
import ButtonNav from '@/components/ButtonNav'
import moment from 'moment'
const tableProps = [
{
prop: "factory",
label: "玻璃类型",
// filter: (val) => factoryList[val],
minWidth: 200,
showOverflowtooltip: true,
},
{
prop: "name",
label: "科目",
minWidth: 120,
showOverflowtooltip: true,
},
{
prop: "unit",
label: "单位",
minWidth: 80,
showOverflowtooltip: true,
},
{
prop: "time1",
label: "时间1",
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: "time2",
label: "时间2",
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: "mubiao",
label: "目标值",
minWidth: 150,
showOverflowtooltip: true,
},
];
export default {
name: "ChipYieldBM",
data() {
return {
tableProps,
start: undefined,
end: undefined,
listQuery: {
// size: 10,
// current: 1,
factory: null,
// total: 0,
type: 2,
startDate: undefined,
endDate: undefined,
reportTime: []
},
timeList: [
{
value: 0,
label: '日'
},
{
value: 1,
label: '周'
},
{
value: 2,
label: '月'
},
{
value: 3,
label: '年'
}
],
tableData: [
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
],
chartHeight: this.tableHeight(137) / 2 - 111,
tableH: this.tableHeight(137) / 2 - 70,
legendList: [
{ id: 1, name: "2024年4月目标值", type: 2, color: "#FFCE6A" },
{ id: 2, name: "2023年4月", type: 1, color: "#8EF0AB" },
{ id: 3, name: "2024年4月", type: 1, color: "#288AFF" },
],
chartMsg: {
color: ["#FFCE6A", "#8EF0AB", "#288AFF"],
xData: ["成都", "邯郸", "瑞昌"],
yName: "单位/%",
series: [
{
name: "2024年4月目标值",
data: [
{ name: "%", value: 85 },
{ name: "%", value: 85 },
{ name: "%", value: 85 },
],
type: "line",
symbol: "circle",
symbolSize: 6,
label: {
show: true,
color: "#FFAE17",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
},
{
name: "2023年4月",
data: [
{ name: "%", value: 57.5 },
{ name: "%", value: 21.66 },
{ name: "%", value: 18.4 },
],
type: "bar",
barWidth: 20,
label: {
show: true,
position: [-18, -16],
color: "#68C483",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
},
{
name: "2024年4月",
data: [
{ name: "%", value: 23.33 },
{ name: "%", value: 7.02 },
{ name: "%", value: 80.2 },
],
type: "bar",
barWidth: 20,
label: {
show: true,
position: [0, -16],
color: "#288AFF",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
},
],
},
chartId: "chipYieldBMChart",
chartNum: 1,
};
},
components: {
bmSearchBar,
BmLineBar,
ButtonNav
},
computed: {
weekNum() {
return Math.round((this.end - this.start) / (24 * 60 * 60 * 1000 * 7)) + 1
},
isOpen() {
return this.$store.getters.sidebar.opened;
},
},
watch: {
//
isOpen(val) {
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
},
},
created() {
this.tableH = this.tableHeight(137) / 2 - 70;
this.chartHeight = this.tableHeight(137) / 2 - 111;
window.addEventListener("resize", this._setTableHeight);
},
destroyed() {
window.removeEventListener("resize", this._setTableHeight);
},
activated() {
//
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
},
mounted() {
// this.getOverView()
const currentMonth = new Date()
this.listQuery.reportTime = [moment(currentMonth).format('yyyy-MM-DD HH:mm:ss'), moment(currentMonth).format('yyyy-MM-DD HH:mm:ss')]
this.changeTime()
this.getDataList()
},
methods: {
getYear(e) {
if (this.end && Number(this.end) - Number(this.start) > 10) {
this.$message({
message: '年份起止时间不能超过十年',
type: 'warning'
});
this.start = undefined
this.end = undefined
// console.log();
} else {
if (Number(this.end) < Number(this.start)) {
this.$message({
message: '结束年份不能小于开始年份',
type: 'warning'
});
this.start = undefined
this.end = undefined
} else {
this.listQuery.startDate = Number(this.start)
this.listQuery.endDate = Number(this.end)
}
}
if (!this.start && !this.end) {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
// console.log(e);
},
changeTime() {
if (this.listQuery.reportTime) {
console.log(this.listQuery.reportTime)
let start = new Date(this.listQuery.reportTime[0])
let end = new Date(this.listQuery.reportTime[1])
// const years = Number(this.listQuery.reportTime[1].slice(0, 4)) - Number(this.listQuery.reportTime[0].slice(0, 4))
// const months = Number(this.listQuery.reportTime[1].slice(4)) - Number(this.listQuery.reportTime[0].slice(4))
// console.log(years);
if ((end - start) > 31104000000) {
this.$message({
message: '时间范围不能超过24个月',
type: 'warning'
});
this.listQuery.reportTime = [];
} else {
this.listQuery.startDate = this.listQuery.reportTime[0]
this.listQuery.endDate = this.listQuery.reportTime[1]
}
} else {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
},
onValueChange(picker, k) { // k
if (this.start && this.end) {
this.date1 = moment(this.start.getTime() - 24 * 60 * 60 * 1000).format('YYYY-MM-DD HH:mm:ss')
this.date2 = moment(this.end.getTime() + 5 * 24 * 60 * 60 * 1000).format('YYYY-MM-DD HH:mm:ss')
const numDays = (new Date(this.date2).getTime() - new Date(this.date1).getTime()) / (24 * 3600 * 1000);
if (numDays > 168) {
console.log(numDays)
this.$message({
message: '周范围不能超过24周',
type: 'warning'
});
} else {
this.listQuery.startDate = this.date1
this.listQuery.endDate = this.date2
// this.listQuery.startDate = Number(moment(this.start.getTime()).format('YYYYWW'))
// this.listQuery.endDate = Number(moment(this.end.getTime()).format('YYYYWW'))
}
}
if (!this.start && !this.end) {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
},
changeDayTime() {
if (this.listQuery.reportTime) {
const numDays = Number(this.listQuery.reportTime[1]) - Number(this.listQuery.reportTime[0])
if (numDays > 30) {
this.$message({
message: '时间范围不能超过30天',
type: 'warning'
});
this.listQuery.reportTime = [];
} else {
this.listQuery.startDate = this.listQuery.reportTime[0]
this.listQuery.endDate = this.listQuery.reportTime[1]
}
} else {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
},
getOverView() {
// getOverView().then(res => {
// this.data = res.data
// console.log('aa', res.data)
// })
},
otherMethods(val) {
this.detailOrUpdateVisible = true;
// this.addOrEditTitle = "";
this.$nextTick(() => {
// this.$refs.detailOrUpdate.init(val.data.id);
});
},
async getDataList() {
console.log(this.listQuery);
if (this.listQuery.type == 3) {
this.listQuery.startDate = this.listQuery.reportTime[0] + '-01-01 00:00:00'
this.listQuery.endDate = this.listQuery.reportTime[1] + '-12-31 23:59:59'
}
this.listQuery.factory = this.currentMenu === '邯郸' ? 1 : 2
const res = await getComprehensiveDataPage(this.listQuery)
this.tableData = res.data.list
this.listQuery.total = res.data.total
if (this.listQuery.total > 0) {
this.tableData.forEach(item => {
item.startTime = item.startDate ? item.startDate[0] + '-' + item.startDate[1] + '-' + item.startDate[2] : '--'
item.endTime = item.endDate ? item.endDate[0] + '-' + item.endDate[1] + '-' + item.endDate[2] : '--'
})
}
},
_setTableHeight() {
this.tableH = this.tableHeight(137) / 2 - 70;
this.chartHeight = this.tableHeight(137) / 2 - 111;
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
},
getSearch(val) {
console.log(val);
console.log("=========================");
},
handleExport() {
console.log("导出");
},
},
};
</script>
<style lang="scss" scoped>
.search {
// height: calc((100px));
background-color: #fff;
border-radius: 8px;
padding: 16px 16px 0 16px;
margin-bottom: 8px;
}
.containerTop {
height: calc((100vh - 170px));
background-color: #fff;
border-radius: 8px;
padding: 16px;
}
.blueTip::before {
display: inline-block;
content: '';
width: 4px;
height: 18px;
background: #0B58FF;
border-radius: 1px;
margin-right: 8PX;
margin-top: 8px;
}
.containerTop {
margin-top: 8px;
.smallTitle {
font-size: 16px;
color: #000;
margin-bottom: 15px;
}
.smallTitle::before {
display: inline-block;
width: 4px;
height: 16px;
background: #0b58ff;
content: "";
margin-right: 8px;
vertical-align: -3px;
}
}
</style>

View File

@ -0,0 +1,490 @@
<template>
<div>
<!-- <div class="search"> -->
<ButtonNav style="padding: 0;" :menus="['邯郸', '瑞昌']" :button-mode="true" @change="currentMenu = $event">
</ButtonNav>
<!-- </div> -->
<div class="containerTop">
<el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip">
<el-form-item label="时间维度" prop="date">
<el-select size="small" clearable v-model="listQuery.type" placeholder="请选择">
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item v-show="listQuery.type === 0 || listQuery.type === ''" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="daterange" range-separator=""
start-placeholder="开始日期" value-format="yyyy-MM-dd HH:mm:ss" @change="changeDayTime" end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item v-show="listQuery.type === 1" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="start" type="week" format="yyyy 第 WW 周" placeholder="选择周"
style="width: 180px" @change="onValueChange">
</el-date-picker>
<el-date-picker size="small" clearable v-model="end" type="week" format="yyyy 第 WW 周" placeholder="选择周"
style="width: 180px" @change="onValueChange">
</el-date-picker>
<!-- <span v-if="start && end" style="margin-left: 10px">
{{ date1 }} {{ date2 }} {{ weekNum }}
</span> -->
</el-form-item>
<el-form-item v-show="listQuery.type === 2" label="时间值" prop="reportTime">
<el-date-picker size="small" v-model="listQuery.reportTime" type="monthrange"
value-format="yyyy-MM-DD HH:mm:ss" range-separator="至" start-placeholder="开始月份" end-placeholder="结束月份"
@change="changeTime">
</el-date-picker>
</el-form-item>
<el-form-item v-show="listQuery.type === 3" label="时间值" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime[0]" value-format="yyyy" type="year"
placeholder="开始时间">
</el-date-picker>
~
<el-date-picker size="small" clearable v-model="listQuery.reportTime[1]" value-format="yyyy" type="year"
placeholder="结束时间" @change="getYear">
</el-date-picker>
</el-form-item>
<!-- <el-form-item label="玻璃类型" prop="type">
<el-select v-model="listQuery.type" placeholder="请选择玻璃类型">
<el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item> -->
<!-- <el-form-item label="玻璃类型" prop="type">
<el-select v-model="listQuery.type" placeholder="请选择玻璃类型">
<el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item> -->
<el-form-item>
<el-button type="primary" size="small" @click="getDataList">查询</el-button>
<el-divider direction="vertical"></el-divider>
<!-- <el-button type="primary" size="small" plain @click="handleImport">导入</el-button> -->
<el-button type="primary" size="small" plain @click="handleExport">导出</el-button>
<!-- <el-button type="success" size="small" plain @click="addFactory">新增</el-button> -->
</el-form-item>
</el-form>
<!-- <div class="smallTitle">产量转化效率</div> -->
<!-- <bmSearchBar @getSearch="getSearch" @handleExport="handleExport" /> -->
<bm-line-bar :chartHeight="chartHeight" :legendList="legendList" :chartMsg="chartMsg" :chartId="chartId"
:chartNum="chartNum" />
<base-table :table-props="tableProps" :page="listQuery.current" :limit="listQuery.size" :table-data="tableData"
:max-height="tableH" />
</div>
<!-- <div class="containerBottom">
</div> -->
</div>
</template>
<script>
import bmSearchBar from "./components/bmSearchBar.vue";
import BmLineBar from "./components/bmLineBar.vue";
import ButtonNav from '@/components/ButtonNav'
import moment from 'moment'
const tableProps = [
{
prop: "factory",
label: "玻璃类型",
// filter: (val) => factoryList[val],
minWidth: 200,
showOverflowtooltip: true,
},
{
prop: "name",
label: "科目",
minWidth: 120,
showOverflowtooltip: true,
},
{
prop: "unit",
label: "单位",
minWidth: 80,
showOverflowtooltip: true,
},
{
prop: "time1",
label: "时间1",
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: "time2",
label: "时间2",
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: "mubiao",
label: "目标值",
minWidth: 150,
showOverflowtooltip: true,
},
];
export default {
name: "ChipYieldBM",
data() {
return {
tableProps,
start: undefined,
end: undefined,
listQuery: {
// size: 10,
// current: 1,
factory: null,
// total: 0,
type: 2,
startDate: undefined,
endDate: undefined,
reportTime: []
},
timeList: [
{
value: 0,
label: '日'
},
{
value: 1,
label: '周'
},
{
value: 2,
label: '月'
},
{
value: 3,
label: '年'
}
],
tableData: [
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
],
chartHeight: this.tableHeight(137) / 2 - 111,
tableH: this.tableHeight(137) / 2 - 70,
legendList: [
{ id: 1, name: "2024年4月目标值", type: 2, color: "#FFCE6A" },
{ id: 2, name: "2023年4月", type: 1, color: "#8EF0AB" },
{ id: 3, name: "2024年4月", type: 1, color: "#288AFF" },
],
chartMsg: {
color: ["#FFCE6A", "#8EF0AB", "#288AFF"],
xData: ["成都", "邯郸", "瑞昌"],
yName: "单位/%",
series: [
{
name: "2024年4月目标值",
data: [
{ name: "%", value: 85 },
{ name: "%", value: 85 },
{ name: "%", value: 85 },
],
type: "line",
symbol: "circle",
symbolSize: 6,
label: {
show: true,
color: "#FFAE17",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
},
{
name: "2023年4月",
data: [
{ name: "%", value: 57.5 },
{ name: "%", value: 21.66 },
{ name: "%", value: 18.4 },
],
type: "bar",
barWidth: 20,
label: {
show: true,
position: [-18, -16],
color: "#68C483",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
},
{
name: "2024年4月",
data: [
{ name: "%", value: 23.33 },
{ name: "%", value: 7.02 },
{ name: "%", value: 80.2 },
],
type: "bar",
barWidth: 20,
label: {
show: true,
position: [0, -16],
color: "#288AFF",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
},
],
},
chartId: "chipYieldBMChart",
chartNum: 1,
};
},
components: {
bmSearchBar,
BmLineBar,
ButtonNav
},
computed: {
weekNum() {
return Math.round((this.end - this.start) / (24 * 60 * 60 * 1000 * 7)) + 1
},
isOpen() {
return this.$store.getters.sidebar.opened;
},
},
watch: {
//
isOpen(val) {
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
},
},
created() {
this.tableH = this.tableHeight(137) / 2 - 70;
this.chartHeight = this.tableHeight(137) / 2 - 111;
window.addEventListener("resize", this._setTableHeight);
},
destroyed() {
window.removeEventListener("resize", this._setTableHeight);
},
activated() {
//
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
},
mounted() {
// this.getOverView()
const currentMonth = new Date()
this.listQuery.reportTime = [moment(currentMonth).format('yyyy-MM-DD HH:mm:ss'), moment(currentMonth).format('yyyy-MM-DD HH:mm:ss')]
this.changeTime()
this.getDataList()
},
methods: {
getYear(e) {
if (this.end && Number(this.end) - Number(this.start) > 10) {
this.$message({
message: '年份起止时间不能超过十年',
type: 'warning'
});
this.start = undefined
this.end = undefined
// console.log();
} else {
if (Number(this.end) < Number(this.start)) {
this.$message({
message: '结束年份不能小于开始年份',
type: 'warning'
});
this.start = undefined
this.end = undefined
} else {
this.listQuery.startDate = Number(this.start)
this.listQuery.endDate = Number(this.end)
}
}
if (!this.start && !this.end) {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
// console.log(e);
},
changeTime() {
if (this.listQuery.reportTime) {
console.log(this.listQuery.reportTime)
let start = new Date(this.listQuery.reportTime[0])
let end = new Date(this.listQuery.reportTime[1])
// const years = Number(this.listQuery.reportTime[1].slice(0, 4)) - Number(this.listQuery.reportTime[0].slice(0, 4))
// const months = Number(this.listQuery.reportTime[1].slice(4)) - Number(this.listQuery.reportTime[0].slice(4))
// console.log(years);
if ((end - start) > 31104000000) {
this.$message({
message: '时间范围不能超过24个月',
type: 'warning'
});
this.listQuery.reportTime = [];
} else {
this.listQuery.startDate = this.listQuery.reportTime[0]
this.listQuery.endDate = this.listQuery.reportTime[1]
}
} else {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
},
onValueChange(picker, k) { // k
if (this.start && this.end) {
this.date1 = moment(this.start.getTime() - 24 * 60 * 60 * 1000).format('YYYY-MM-DD HH:mm:ss')
this.date2 = moment(this.end.getTime() + 5 * 24 * 60 * 60 * 1000).format('YYYY-MM-DD HH:mm:ss')
const numDays = (new Date(this.date2).getTime() - new Date(this.date1).getTime()) / (24 * 3600 * 1000);
if (numDays > 168) {
console.log(numDays)
this.$message({
message: '周范围不能超过24周',
type: 'warning'
});
} else {
this.listQuery.startDate = this.date1
this.listQuery.endDate = this.date2
// this.listQuery.startDate = Number(moment(this.start.getTime()).format('YYYYWW'))
// this.listQuery.endDate = Number(moment(this.end.getTime()).format('YYYYWW'))
}
}
if (!this.start && !this.end) {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
},
changeDayTime() {
if (this.listQuery.reportTime) {
const numDays = Number(this.listQuery.reportTime[1]) - Number(this.listQuery.reportTime[0])
if (numDays > 30) {
this.$message({
message: '时间范围不能超过30天',
type: 'warning'
});
this.listQuery.reportTime = [];
} else {
this.listQuery.startDate = this.listQuery.reportTime[0]
this.listQuery.endDate = this.listQuery.reportTime[1]
}
} else {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
},
getOverView() {
// getOverView().then(res => {
// this.data = res.data
// console.log('aa', res.data)
// })
},
otherMethods(val) {
this.detailOrUpdateVisible = true;
// this.addOrEditTitle = "";
this.$nextTick(() => {
// this.$refs.detailOrUpdate.init(val.data.id);
});
},
async getDataList() {
console.log(this.listQuery);
if (this.listQuery.type == 3) {
this.listQuery.startDate = this.listQuery.reportTime[0] + '-01-01 00:00:00'
this.listQuery.endDate = this.listQuery.reportTime[1] + '-12-31 23:59:59'
}
this.listQuery.factory = this.currentMenu === '邯郸' ? 1 : 2
const res = await getComprehensiveDataPage(this.listQuery)
this.tableData = res.data.list
this.listQuery.total = res.data.total
if (this.listQuery.total > 0) {
this.tableData.forEach(item => {
item.startTime = item.startDate ? item.startDate[0] + '-' + item.startDate[1] + '-' + item.startDate[2] : '--'
item.endTime = item.endDate ? item.endDate[0] + '-' + item.endDate[1] + '-' + item.endDate[2] : '--'
})
}
},
_setTableHeight() {
this.tableH = this.tableHeight(137) / 2 - 70;
this.chartHeight = this.tableHeight(137) / 2 - 111;
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
},
getSearch(val) {
console.log(val);
console.log("=========================");
},
handleExport() {
console.log("导出");
},
},
};
</script>
<style lang="scss" scoped>
.search {
// height: calc((100px));
background-color: #fff;
border-radius: 8px;
padding: 16px 16px 0 16px;
margin-bottom: 8px;
}
.containerTop {
height: calc((100vh - 170px));
background-color: #fff;
border-radius: 8px;
padding: 16px;
}
.blueTip::before {
display: inline-block;
content: '';
width: 4px;
height: 18px;
background: #0B58FF;
border-radius: 1px;
margin-right: 8PX;
margin-top: 8px;
}
.containerTop {
margin-top: 8px;
.smallTitle {
font-size: 16px;
color: #000;
margin-bottom: 15px;
}
.smallTitle::before {
display: inline-block;
width: 4px;
height: 16px;
background: #0b58ff;
content: "";
margin-right: 8px;
vertical-align: -3px;
}
}
</style>

View File

@ -0,0 +1,490 @@
<template>
<div>
<!-- <div class="search"> -->
<ButtonNav style="padding: 0;" :menus="['邯郸', '瑞昌']" :button-mode="true" @change="currentMenu = $event">
</ButtonNav>
<!-- </div> -->
<div class="containerTop">
<el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip">
<el-form-item label="时间维度" prop="date">
<el-select size="small" clearable v-model="listQuery.type" placeholder="请选择">
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item v-show="listQuery.type === 0 || listQuery.type === ''" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="daterange" range-separator=""
start-placeholder="开始日期" value-format="yyyy-MM-dd HH:mm:ss" @change="changeDayTime" end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item v-show="listQuery.type === 1" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="start" type="week" format="yyyy 第 WW 周" placeholder="选择周"
style="width: 180px" @change="onValueChange">
</el-date-picker>
<el-date-picker size="small" clearable v-model="end" type="week" format="yyyy 第 WW 周" placeholder="选择周"
style="width: 180px" @change="onValueChange">
</el-date-picker>
<!-- <span v-if="start && end" style="margin-left: 10px">
{{ date1 }} {{ date2 }} {{ weekNum }}
</span> -->
</el-form-item>
<el-form-item v-show="listQuery.type === 2" label="时间值" prop="reportTime">
<el-date-picker size="small" v-model="listQuery.reportTime" type="monthrange"
value-format="yyyy-MM-DD HH:mm:ss" range-separator="至" start-placeholder="开始月份" end-placeholder="结束月份"
@change="changeTime">
</el-date-picker>
</el-form-item>
<el-form-item v-show="listQuery.type === 3" label="时间值" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime[0]" value-format="yyyy" type="year"
placeholder="开始时间">
</el-date-picker>
~
<el-date-picker size="small" clearable v-model="listQuery.reportTime[1]" value-format="yyyy" type="year"
placeholder="结束时间" @change="getYear">
</el-date-picker>
</el-form-item>
<!-- <el-form-item label="玻璃类型" prop="type">
<el-select v-model="listQuery.type" placeholder="请选择玻璃类型">
<el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item> -->
<!-- <el-form-item label="玻璃类型" prop="type">
<el-select v-model="listQuery.type" placeholder="请选择玻璃类型">
<el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item> -->
<el-form-item>
<el-button type="primary" size="small" @click="getDataList">查询</el-button>
<el-divider direction="vertical"></el-divider>
<!-- <el-button type="primary" size="small" plain @click="handleImport">导入</el-button> -->
<el-button type="primary" size="small" plain @click="handleExport">导出</el-button>
<!-- <el-button type="success" size="small" plain @click="addFactory">新增</el-button> -->
</el-form-item>
</el-form>
<!-- <div class="smallTitle">产量转化效率</div> -->
<!-- <bmSearchBar @getSearch="getSearch" @handleExport="handleExport" /> -->
<bm-line-bar :chartHeight="chartHeight" :legendList="legendList" :chartMsg="chartMsg" :chartId="chartId"
:chartNum="chartNum" />
<base-table :table-props="tableProps" :page="listQuery.current" :limit="listQuery.size" :table-data="tableData"
:max-height="tableH" />
</div>
<!-- <div class="containerBottom">
</div> -->
</div>
</template>
<script>
import bmSearchBar from "./components/bmSearchBar.vue";
import BmLineBar from "./components/bmLineBar.vue";
import ButtonNav from '@/components/ButtonNav'
import moment from 'moment'
const tableProps = [
{
prop: "factory",
label: "玻璃类型",
// filter: (val) => factoryList[val],
minWidth: 200,
showOverflowtooltip: true,
},
{
prop: "name",
label: "科目",
minWidth: 120,
showOverflowtooltip: true,
},
{
prop: "unit",
label: "单位",
minWidth: 80,
showOverflowtooltip: true,
},
{
prop: "time1",
label: "时间1",
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: "time2",
label: "时间2",
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: "mubiao",
label: "目标值",
minWidth: 150,
showOverflowtooltip: true,
},
];
export default {
name: "ChipYieldBM",
data() {
return {
tableProps,
start: undefined,
end: undefined,
listQuery: {
// size: 10,
// current: 1,
factory: null,
// total: 0,
type: 2,
startDate: undefined,
endDate: undefined,
reportTime: []
},
timeList: [
{
value: 0,
label: '日'
},
{
value: 1,
label: '周'
},
{
value: 2,
label: '月'
},
{
value: 3,
label: '年'
}
],
tableData: [
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
{ factory: "工厂1" },
],
chartHeight: this.tableHeight(137) / 2 - 111,
tableH: this.tableHeight(137) / 2 - 70,
legendList: [
{ id: 1, name: "2024年4月目标值", type: 2, color: "#FFCE6A" },
{ id: 2, name: "2023年4月", type: 1, color: "#8EF0AB" },
{ id: 3, name: "2024年4月", type: 1, color: "#288AFF" },
],
chartMsg: {
color: ["#FFCE6A", "#8EF0AB", "#288AFF"],
xData: ["成都", "邯郸", "瑞昌"],
yName: "单位/%",
series: [
{
name: "2024年4月目标值",
data: [
{ name: "%", value: 85 },
{ name: "%", value: 85 },
{ name: "%", value: 85 },
],
type: "line",
symbol: "circle",
symbolSize: 6,
label: {
show: true,
color: "#FFAE17",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
},
{
name: "2023年4月",
data: [
{ name: "%", value: 57.5 },
{ name: "%", value: 21.66 },
{ name: "%", value: 18.4 },
],
type: "bar",
barWidth: 20,
label: {
show: true,
position: [-18, -16],
color: "#68C483",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
},
{
name: "2024年4月",
data: [
{ name: "%", value: 23.33 },
{ name: "%", value: 7.02 },
{ name: "%", value: 80.2 },
],
type: "bar",
barWidth: 20,
label: {
show: true,
position: [0, -16],
color: "#288AFF",
formatter: function (params) {
return params.value.toFixed(2) + "%";
},
},
},
],
},
chartId: "chipYieldBMChart",
chartNum: 1,
};
},
components: {
bmSearchBar,
BmLineBar,
ButtonNav
},
computed: {
weekNum() {
return Math.round((this.end - this.start) / (24 * 60 * 60 * 1000 * 7)) + 1
},
isOpen() {
return this.$store.getters.sidebar.opened;
},
},
watch: {
//
isOpen(val) {
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
},
},
created() {
this.tableH = this.tableHeight(137) / 2 - 70;
this.chartHeight = this.tableHeight(137) / 2 - 111;
window.addEventListener("resize", this._setTableHeight);
},
destroyed() {
window.removeEventListener("resize", this._setTableHeight);
},
activated() {
//
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
},
mounted() {
// this.getOverView()
const currentMonth = new Date()
this.listQuery.reportTime = [moment(currentMonth).format('yyyy-MM-DD HH:mm:ss'), moment(currentMonth).format('yyyy-MM-DD HH:mm:ss')]
this.changeTime()
this.getDataList()
},
methods: {
getYear(e) {
if (this.end && Number(this.end) - Number(this.start) > 10) {
this.$message({
message: '年份起止时间不能超过十年',
type: 'warning'
});
this.start = undefined
this.end = undefined
// console.log();
} else {
if (Number(this.end) < Number(this.start)) {
this.$message({
message: '结束年份不能小于开始年份',
type: 'warning'
});
this.start = undefined
this.end = undefined
} else {
this.listQuery.startDate = Number(this.start)
this.listQuery.endDate = Number(this.end)
}
}
if (!this.start && !this.end) {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
// console.log(e);
},
changeTime() {
if (this.listQuery.reportTime) {
console.log(this.listQuery.reportTime)
let start = new Date(this.listQuery.reportTime[0])
let end = new Date(this.listQuery.reportTime[1])
// const years = Number(this.listQuery.reportTime[1].slice(0, 4)) - Number(this.listQuery.reportTime[0].slice(0, 4))
// const months = Number(this.listQuery.reportTime[1].slice(4)) - Number(this.listQuery.reportTime[0].slice(4))
// console.log(years);
if ((end - start) > 31104000000) {
this.$message({
message: '时间范围不能超过24个月',
type: 'warning'
});
this.listQuery.reportTime = [];
} else {
this.listQuery.startDate = this.listQuery.reportTime[0]
this.listQuery.endDate = this.listQuery.reportTime[1]
}
} else {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
},
onValueChange(picker, k) { // k
if (this.start && this.end) {
this.date1 = moment(this.start.getTime() - 24 * 60 * 60 * 1000).format('YYYY-MM-DD HH:mm:ss')
this.date2 = moment(this.end.getTime() + 5 * 24 * 60 * 60 * 1000).format('YYYY-MM-DD HH:mm:ss')
const numDays = (new Date(this.date2).getTime() - new Date(this.date1).getTime()) / (24 * 3600 * 1000);
if (numDays > 168) {
console.log(numDays)
this.$message({
message: '周范围不能超过24周',
type: 'warning'
});
} else {
this.listQuery.startDate = this.date1
this.listQuery.endDate = this.date2
// this.listQuery.startDate = Number(moment(this.start.getTime()).format('YYYYWW'))
// this.listQuery.endDate = Number(moment(this.end.getTime()).format('YYYYWW'))
}
}
if (!this.start && !this.end) {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
},
changeDayTime() {
if (this.listQuery.reportTime) {
const numDays = Number(this.listQuery.reportTime[1]) - Number(this.listQuery.reportTime[0])
if (numDays > 30) {
this.$message({
message: '时间范围不能超过30天',
type: 'warning'
});
this.listQuery.reportTime = [];
} else {
this.listQuery.startDate = this.listQuery.reportTime[0]
this.listQuery.endDate = this.listQuery.reportTime[1]
}
} else {
this.listQuery.startDate = undefined
this.listQuery.endDate = undefined
}
},
getOverView() {
// getOverView().then(res => {
// this.data = res.data
// console.log('aa', res.data)
// })
},
otherMethods(val) {
this.detailOrUpdateVisible = true;
// this.addOrEditTitle = "";
this.$nextTick(() => {
// this.$refs.detailOrUpdate.init(val.data.id);
});
},
async getDataList() {
console.log(this.listQuery);
if (this.listQuery.type == 3) {
this.listQuery.startDate = this.listQuery.reportTime[0] + '-01-01 00:00:00'
this.listQuery.endDate = this.listQuery.reportTime[1] + '-12-31 23:59:59'
}
this.listQuery.factory = this.currentMenu === '邯郸' ? 1 : 2
const res = await getComprehensiveDataPage(this.listQuery)
this.tableData = res.data.list
this.listQuery.total = res.data.total
if (this.listQuery.total > 0) {
this.tableData.forEach(item => {
item.startTime = item.startDate ? item.startDate[0] + '-' + item.startDate[1] + '-' + item.startDate[2] : '--'
item.endTime = item.endDate ? item.endDate[0] + '-' + item.endDate[1] + '-' + item.endDate[2] : '--'
})
}
},
_setTableHeight() {
this.tableH = this.tableHeight(137) / 2 - 70;
this.chartHeight = this.tableHeight(137) / 2 - 111;
if (this.$route.name === "ChipYieldBM") {
this.chartNum++;
}
},
getSearch(val) {
console.log(val);
console.log("=========================");
},
handleExport() {
console.log("导出");
},
},
};
</script>
<style lang="scss" scoped>
.search {
// height: calc((100px));
background-color: #fff;
border-radius: 8px;
padding: 16px 16px 0 16px;
margin-bottom: 8px;
}
.containerTop {
height: calc((100vh - 170px));
background-color: #fff;
border-radius: 8px;
padding: 16px;
}
.blueTip::before {
display: inline-block;
content: '';
width: 4px;
height: 18px;
background: #0B58FF;
border-radius: 1px;
margin-right: 8PX;
margin-top: 8px;
}
.containerTop {
margin-top: 8px;
.smallTitle {
font-size: 16px;
color: #000;
margin-bottom: 15px;
}
.smallTitle::before {
display: inline-block;
width: 4px;
height: 16px;
background: #0b58ff;
content: "";
margin-right: 8px;
vertical-align: -3px;
}
}
</style>