Compare commits

..

6 Commits

Author SHA1 Message Date
helloDy
0a10b7f177 Merge branch 'projects/mescc/develop' into projects/mescc/dy 2024-06-07 14:16:51 +08:00
helloDy
39cb9acfec 工单 2024-06-07 14:16:20 +08:00
3df0ab48de Merge pull request 'projects/mescc/zhp' (#36) from projects/mescc/zhp into projects/mescc/develop
All checks were successful
continuous-integration/drone/push Build is passing
Reviewed-on: #36
2024-06-07 11:18:49 +08:00
‘937886381’
9854dd83b2 Merge branch 'projects/mescc/develop' into projects/mescc/zhp 2024-06-07 11:14:42 +08:00
‘937886381’
ef618a4abb 修改bug 2024-06-07 11:13:59 +08:00
40c7aaa323 Merge pull request 'projects/mescc/dy' (#35) from projects/mescc/dy into projects/mescc/develop
All checks were successful
continuous-integration/drone/push Build is passing
Reviewed-on: #35
2024-06-05 16:46:34 +08:00
32 changed files with 673 additions and 237 deletions

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 16:07:26 # @LastEditTime: 2024-06-07 10:32:24
# @LastEditors: DY # @LastEditors: DY
# @Description: # @Description:
### ###
@ -13,9 +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'
# sara # sara
# VUE_APP_BASE_API = 'http://192.168.1.63:48080' VUE_APP_BASE_API = 'http://192.168.1.63:48080'
# 张一丁 # 张一丁
# VUE_APP_BASE_API = 'http://192.168.4.139:48080' # VUE_APP_BASE_API = 'http://192.168.4.139:48080'

View File

@ -8,10 +8,14 @@ function __resizeHandler(entries) {
? entry.contentBoxSize[0] ? entry.contentBoxSize[0]
: entry.contentBoxSize; : entry.contentBoxSize;
this.chart_mixin_chartInstance.resize({ this.chart_mixin_chartInstance.resize({
width: // width:
contentBoxSize.inlineSize < this.MIN_WIDTH // contentBoxSize.inlineSize < this.MIN_WIDTH
? this.MIN_WIDTH // ? this.MIN_WIDTH
: contentBoxSize.inlineSize, // : contentBoxSize.inlineSize,
// width:
// entry.contentRect.width < this.MIN_WIDTH
// ? this.MIN_WIDTH
// : entry.contentRect.width,
height: contentBoxSize.blockSize, height: contentBoxSize.blockSize,
}); });
} else { } else {

View File

@ -4,8 +4,13 @@
<!-- <CopilotButton v-for="i in ['产量', '效率']" :key="i" :label="i" :active="i === active" <!-- <CopilotButton v-for="i in ['产量', '效率']" :key="i" :label="i" :active="i === active"
@click="() => $emit('update:active', i)" /> @click="() => $emit('update:active', i)" />
<div class="type-name"></div> --> <div class="type-name"></div> -->
<CopilotButton v-for="i in ['同比', '环比']" :key="i" :label="i" :active="i === than" <CopilotButton v-for="i in dataList" :key="i.id" :label="i.name" :active="i.id === period"
@click="() => $emit('update:than', i)" /> @click="() => $emit('update:period', i.id)" />
<!-- <CopilotButton v-for="i in ['同比', '环比']" :key="i" :label="i" :active="i === than"
@click="() => $emit('update:than', i)" /> -->
</section>
<div class="page-title">{{ companyName }}</div>
<section class="menu2">
<div class="btn-group"> <div class="btn-group">
<el-tooltip class="item" effect="dark" content="导出" placement="top"> <el-tooltip class="item" effect="dark" content="导出" placement="top">
<button type="button" class="export-btn" @click="handleExport" /> <button type="button" class="export-btn" @click="handleExport" />
@ -16,11 +21,6 @@
</el-tooltip> </el-tooltip>
</div> </div>
</section> </section>
<div class="page-title">{{ companyName }}</div>
<section class="menu2">
<CopilotButton v-for="i in dataList" :key="i.id" :label="i.name" :active="i.id === period"
@click="() => $emit('update:period', i.id)" />
</section>
</div> </div>
</template> </template>
@ -50,7 +50,7 @@ export default {
}, },
data() { data() {
return { return {
// isFullscreen: false, isFullscreen: false,
content:'全屏', content:'全屏',
dataList: [ dataList: [
{ id: 1, name: "日" }, { id: 1, name: "日" },
@ -109,12 +109,14 @@ export default {
.factory-header > .menu2 { .factory-header > .menu2 {
width: 26vw; width: 26vw;
display: flex; display: flex;
justify-content: flex-end;
align-items: center; align-items: center;
gap: 8px; gap: 8px;
} }
.export-btn, .export-btn,
.fullscreen-btn { .fullscreen-btn {
/* float: right; */
width: 32px; width: 32px;
height: 32px; height: 32px;
margin-left: 24px; margin-left: 24px;

View File

@ -60,7 +60,7 @@ 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}`, color: "#12f7f1" }, { label: `${year-1}${month}${today}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${month}${today}`, color: "#58adfa" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
@ -70,7 +70,7 @@ export default {
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
{ label: `年本周`, color: "#12f7f1" }, { label: `${year-1}年本周`, color: "#12f7f1" },
{ label: `本周`, color: "#58adfa" }, { label: `本周`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '环比') { } else if (this.period === '周' && this.than === '环比') {
@ -80,7 +80,7 @@ export default {
]; ];
} else if (this.period === '月' && this.than === '同比') { } else if (this.period === '月' && this.than === '同比') {
items = [ items = [
{ label: `${month}`, color: "#12f7f1" }, { label: `${year-1}${month}`, color: "#12f7f1" },
{ label: `${month}`, color: "#58adfa" }, { label: `${month}`, color: "#58adfa" },
{ label: `${month}月目标`, color: "#58adfa" }, { label: `${month}月目标`, color: "#58adfa" },
// { label: `${month}`, value: valueTuple[2] }, // { label: `${month}`, value: valueTuple[2] },
@ -177,7 +177,7 @@ function getTemplate(period, dataList, than) {
if (period === '日' && than === '同比') { if (period === '日' && than === '同比') {
items = [ items = [
{ {
name: `${month}${today}`, name: `${year-1}${month}${today}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
@ -201,7 +201,7 @@ function getTemplate(period, dataList, than) {
} else if (period === '周' && than === '同比') { } else if (period === '周' && than === '同比') {
items = [ items = [
{ {
name: `年本周`, name: `${year-1}年本周`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
@ -225,7 +225,7 @@ function getTemplate(period, dataList, than) {
} else if (period === '月' && than === '同比') { } else if (period === '月' && than === '同比') {
items = [ items = [
{ {
name: `${month}`, name: `${year-1}${month}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {

View File

@ -1,15 +1,15 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-10 11:10:54 * @Date: 2024-05-10 11:10:54
* @LastEditTime: 2024-05-31 16:19:45 * @LastEditTime: 2024-06-06 10:04:49
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
<template> <template>
<div class="chip-rate"> <div class="chip-rate">
<ChipRateItem :period="period" :than="than" :cities="['邯郸', '瑞昌']" :color="1" /> <ChipRateItem :period="period" :than="than" :cities="['邯郸',]" :color="1" />
<!-- <ChipRateItem :period="period" :than="than" :cities="['佳木斯', '凯盛光伏', '蚌埠兴科']" :color="2" /> --> <ChipRateItem :period="period" :than="than" :cities="['瑞昌']" :color="2" />
</div> </div>
</template> </template>
@ -43,15 +43,15 @@ export default {
gap: 5px; gap: 5px;
position: relative; position: relative;
// &:after { &:after {
// content: ""; content: "";
// position: absolute; position: absolute;
// left: 50%; left: 50%;
// top: 0; top: 0;
// width: 3px; width: 3px;
// height: 100%; height: 100%;
// transform: translateX(-50%); transform: translateX(-50%);
// background: linear-gradient(to bottom, transparent, #00f2ff, transparent); background: linear-gradient(to bottom, transparent, #00f2ff, transparent);
// } }
} }
</style> </style>

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-04 14:18:52 * @LastEditTime: 2024-06-06 13:55:10
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -39,7 +39,7 @@ export default {
} }
}, },
computed: { computed: {
data() { stdData() {
return this.$store.getters.copilot.efficiency.stdRate return this.$store.getters.copilot.efficiency.stdRate
}, },
cities() { cities() {
@ -65,22 +65,22 @@ export default {
{ name: "凯盛光伏", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, { name: "凯盛光伏", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, },
{ name: "蚌埠", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, }, { name: "蚌埠", target: 0, previous: 0, current: 0, componentYield: 0, goodNumber: 0, },
] ]
if (this.data?.previous) { if (this.stdData?.previous) {
this.data?.previous.forEach( this.stdData?.previous.forEach(
(v, idx) => { (v, idx) => {
_cities[idx].previous = v ?? 0; _cities[idx].previous = v ?? 0;
} }
); );
} }
if (this.data?.target) { if (this.stdData?.target) {
this.data?.target.forEach( this.stdData?.target.forEach(
(v, idx) => { (v, idx) => {
_cities[idx].target = v ?? 0; _cities[idx].target = v ?? 0;
} }
) )
} }
if (this.data?.current) { if (this.stdData?.current) {
this.data?.current.forEach( this.stdData?.current.forEach(
(v, idx) => { (v, idx) => {
_cities[idx].current = v ?? 0; _cities[idx].current = v ?? 0;
} }
@ -123,7 +123,7 @@ export default {
// flex: 1 1 auto; // flex: 1 1 auto;
flex-direction: column; flex-direction: column;
// display: -webkit-box; // display: -webkit-box;
// flex-wrap: wrap; flex-wrap: wrap;
// align-items: center; // align-items: center;
// grid-template-columns: repeat(2, 1fr); // grid-template-columns: repeat(2, 1fr);
// grid-template-rows: repeat(4, 1fr); // grid-template-rows: repeat(4, 1fr);
@ -136,7 +136,7 @@ export default {
// width: 50%; // width: 50%;
} }
.span-2 { .span-2 {
flex: 1 1 auto; // flex: 1 1 auto;
// flex-basis: 100%; flex-basis: 100%;
} }
</style> </style>

View File

@ -60,7 +60,7 @@ 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}`, color: "#12f7f1" }, { label: `${year-1}${month}${today}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${month}${today}`, color: "#58adfa" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
@ -70,7 +70,7 @@ export default {
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
{ label: `年本周`, color: "#12f7f1" }, { label: `${year-1}年本周`, color: "#12f7f1" },
{ label: `本周`, color: "#58adfa" }, { label: `本周`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '环比') { } else if (this.period === '周' && this.than === '环比') {
@ -80,7 +80,7 @@ export default {
]; ];
} else if (this.period === '月' && this.than === '同比') { } else if (this.period === '月' && this.than === '同比') {
items = [ items = [
{ label: `${month}`, color: "#12f7f1" }, { label: `${year-1}${month}`, color: "#12f7f1" },
{ label: `${month}`, color: "#58adfa" }, { label: `${month}`, color: "#58adfa" },
{ label: `${month}月目标`, color: "#58adfa" }, { label: `${month}月目标`, color: "#58adfa" },
// { label: `${month}`, value: valueTuple[2] }, // { label: `${month}`, value: valueTuple[2] },
@ -168,7 +168,7 @@ function getTemplate(period, dataList,than) {
if (period === '日' && than === '同比') { if (period === '日' && than === '同比') {
items = [ items = [
{ {
name: `${month}${today}`, name: `${year-1}${month}${today}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
@ -192,7 +192,7 @@ function getTemplate(period, dataList,than) {
} else if (period === '周' && than === '同比') { } else if (period === '周' && than === '同比') {
items = [ items = [
{ {
name: `年本周`, name: `${year-1}年本周`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
@ -216,7 +216,7 @@ function getTemplate(period, dataList,than) {
} else if (period === '月' && than === '同比') { } else if (period === '月' && than === '同比') {
items = [ items = [
{ {
name: `${month}`, name: `${year-1}${month}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {

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-03 16:13:52 * @LastEditTime: 2024-06-06 15:12:58
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -303,6 +303,7 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.bar-chart-base { .bar-chart-base {
// position: relative; // position: relative;
@ -327,6 +328,9 @@ export default {
margin-right: 0.22vw; margin-right: 0.22vw;
} }
} }
.legend-item:nth-child(3) {
margin-left: 1vw;
}
.legend-item:nth-child(3):before { .legend-item:nth-child(3):before {
// width: 12px; // width: 12px;
// height: 2px; // height: 2px;

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-03 16:14:03 * @LastEditTime: 2024-06-06 15:13:06
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -302,6 +302,7 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.bar-chart-base { .bar-chart-base {
// position: relative; // position: relative;
@ -326,7 +327,9 @@ export default {
margin-right: 0.22vw; margin-right: 0.22vw;
} }
} }
.legend-item:nth-child(3) {
margin-left: 1vw;
}
.legend-item:nth-child(1):before { .legend-item:nth-child(1):before {
background-color: #12f7f1; background-color: #12f7f1;
} }

View File

@ -13,10 +13,11 @@
<!-- <div style="flex:1;padding: 0 20%;"> --> <!-- <div style="flex:1;padding: 0 20%;"> -->
<div class="chart" ref="chart"></div> <div class="chart" ref="chart"></div>
<!-- </div> --> <!-- </div> -->
<div class="legend" > <div class="legend">
<div class="legend-item" v-for="lgd in legend" :key="lgd.label"> <div class="legend-item" v-for="lgd in legend" :key="lgd.label">
<span class="legend-item__value">{{ lgd.value }}</span>
<span class="legend-item__label">{{ lgd.label }}</span> <span class="legend-item__label">{{ lgd.label }}</span>
<span class="legend-item__value">{{ lgd.value }}</span>
</div> </div>
</div> </div>
</div> </div>
@ -100,7 +101,7 @@ export default {
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${month}${today}日良率`, }, { label: `${month}${today}日良率`, },
{ label: `${month}${today}日良率` }, { label: `${year-1}${month}${today}日良率` },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
items = [ items = [
@ -110,7 +111,7 @@ export default {
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
{ label: `本周良率`, }, { label: `本周良率`, },
{ label: `年本周良率` }, { label: `${year-1}年本周良率` },
]; ];
} else if (this.period === '周' && this.than === '环比') { } else if (this.period === '周' && this.than === '环比') {
items = [ items = [
@ -120,7 +121,7 @@ export default {
} else if (this.period === '月' && this.than === '同比') { } else if (this.period === '月' && this.than === '同比') {
items = [ items = [
{ label: `${month}月良率`, }, { label: `${month}月良率`, },
{ label: `${month}月良率`, }, { label: `${year-1}${month}月良率`, },
{ label: `${month}月目标良率`, }, { label: `${month}月目标良率`, },
]; ];
} else if (this.period === '月' && this.than === '环比') { } else if (this.period === '月' && this.than === '环比') {
@ -143,7 +144,7 @@ export default {
: `${month}月良率`, : `${month}月良率`,
: `${year}良率`, : `${year}良率`,
}[this.period]; }[this.period];
console.log(vt[1]);
const t = getOptions({ const t = getOptions({
// single, // single,
color: this.color == 1 ? "#4CF0E8" : "#1065ff", color: this.color == 1 ? "#4CF0E8" : "#1065ff",
@ -173,7 +174,7 @@ 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}日良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0]) ) + "%" }, { label: `${year-1}${month}${today}日良率`, 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: `${month}${today}日良率`, 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 === '环比') {
@ -183,7 +184,7 @@ export default {
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
{ label: `年本周良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" }, { label: `${year-1}年本周良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" },
{ label: `本周良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, { label: `本周良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" },
]; ];
@ -194,24 +195,24 @@ export default {
]; ];
} else if (this.period === '月' && this.than === '同比') { } else if (this.period === '月' && this.than === '同比') {
items = [ items = [
{ label: `${month}月良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" }, { label: `${year-1}${month}月良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" },
{ label: `${month}月良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, { label: `${month}月良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" },
{ label: `${month}月目标良率`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" }, { label: `${month}月目标`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" },
]; ];
} else if (this.period === '月' && this.than === '环比') { } else if (this.period === '月' && this.than === '环比') {
items = [ items = [
{ label: `${lastMonth}月良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" }, { label: `${lastMonth}月良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" },
{ label: `${month}月良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, { label: `${month}月良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" },
{ label: `${month}月目标良率`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" }, { label: `${month}月目标`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" },
]; ];
} else { } else {
items = [ items = [
{ label: `${year - 1}年良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, { label: `${year - 1}年良率`, value: isNaN(this.valueTuple[0]) || this.valueTuple[0] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[0])) + "%" },
{ label: `${year}年良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" }, { label: `${year}年良率`, value: isNaN(this.valueTuple[1]) || this.valueTuple[1] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[1])) + "%" },
{ label: `${year}年目标良率`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" }, { label: `${year}年目标`, value: isNaN(this.valueTuple[2]) || this.valueTuple[2] == null ? 0 + "%" : (this.formatNumber(this.valueTuple[2])) + "%" },
]; ];
} }
return items return items
@ -247,6 +248,7 @@ export default {
}, },
methods: { methods: {
formatNumber(num) { formatNumber(num) {
console.log(num);
// //
if (Number.isInteger(num)) { if (Number.isInteger(num)) {
return num; // return num; //
@ -270,6 +272,7 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
// padding: 0 3px;
// justify-content: center; // justify-content: center;
gap: 3px; gap: 3px;
backdrop-filter: blur(24px); backdrop-filter: blur(24px);
@ -281,7 +284,7 @@ export default {
// margin-left: 5%; // margin-left: 5%;
// width: 290px; // width: 290px;
flex: 1 1 auto; flex: 1 1 auto;
padding: 0 15%; padding: 0 20%;
/* margin: 10%; */ /* margin: 10%; */
height: 16vh; height: 16vh;
/* min-width: 300px; */ /* min-width: 300px; */
@ -290,17 +293,24 @@ export default {
.legend { .legend {
height: 80px; height: 80px;
display: flex; display: flex;
gap: 40px; color: #fff;
justify-content: space-around; justify-content: flex-end;
gap:20px;
// justify-content: space-between;
} }
// .legend:nth-child(3){
// margin-left: 30px;
// }
.legend-item { .legend-item {
margin-left: 15px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; // align-items: center;
align-items: flex-start;
gap: 3px; gap: 3px;
&:first-child { &:first-child {
// margin-left: 5px;
.legend-item__value { .legend-item__value {
color: #0e61f5; color: #0e61f5;
} }
@ -312,7 +322,40 @@ export default {
} }
} }
} }
.legend-item__label {
position: relative;
}
.legend-item__label::before {
content: "";
position: absolute;
width: 12px;
height: 12px;
background: #ccc;
border-radius: 2px;
top: 6px;
left: -18px;
}
.legend-item:nth-child(2) .legend-item__label::before {
background: #12fff5;
}
.legend-item:nth-child(2) .legend-item__value {
color: #12fff5;
}
.legend-item:nth-child(1) .legend-item__label::before {
background: #0f65ff;
}
.legend-item:nth-child(1) .legend-item__value {
color: #0f65ff;
}
.legend-item:nth-child(3) .legend-item__label::before {
background: #003982;
}
.legend-item__value { .legend-item__value {
font-size: 24px; font-size: 24px;
font-weight: 600; font-weight: 600;

View File

@ -132,19 +132,19 @@ function calculateItems(period, valueTuple) {
case "日": case "日":
items = [ items = [
{ label: `${month}${today}日累计`, value: valueTuple[1] }, { label: `${month}${today}日累计`, value: valueTuple[1] },
{ label: `${month}${today}日累计`, value: valueTuple[0] }, { label: `${year-1}${month}${today}日累计`, value: valueTuple[0] },
]; ];
break; break;
case "周": case "周":
items = [ items = [
{ label: `本周累计`, value: valueTuple[1] }, { label: `本周累计`, value: valueTuple[1] },
{ label: `年本周累计`, value: valueTuple[0] }, { label: `${year-1}年本周累计`, value: valueTuple[0] },
]; ];
break; break;
case "月": case "月":
items = [ items = [
{ label: `${month}月累计`, value: valueTuple[1] }, { label: `${month}月累计`, value: valueTuple[1] },
{ label: `${month}月累计`, value: valueTuple[0] }, { label: `${year-1}${month}月累计`, value: valueTuple[0] },
{ label: `${month}月目标`, value: valueTuple[2] }, { label: `${month}月目标`, value: valueTuple[2] },
]; ];
break; break;

View File

@ -6,7 +6,7 @@
--> -->
<template> <template>
<div class="progress-bar" :data-title="title" :data-rate="value + '%'"> <div class="progress-bar" :data-title="title" :data-rate="current + '%'">
<div class="progress-bar__rate" :style="{ width: dataRate == '-' ? 0 : dataRate }"></div> <div class="progress-bar__rate" :style="{ width: dataRate == '-' ? 0 : dataRate }"></div>
</div> </div>
</template> </template>
@ -20,6 +20,18 @@ export default {
type: Number, type: Number,
default: 0, default: 0,
}, },
target: {
type: Number,
default: 0,
},
previous: {
type: Number,
default: 0,
},
current: {
type: Number,
default: 0,
},
// total: { // total: {
// type: Number, // type: Number,
// default: 0, // default: 0,
@ -34,11 +46,16 @@ export default {
}, },
computed: { computed: {
dataRate() { dataRate() {
return this.value == 0 // if (this.current != 0 && this.target != 0) {
? "-" console.log( '1111111111', this.current, this.target);
: this.value > 1 return this.current == 0 && this.target == 0
? 100 + '%' ? 0
: `${(parseFloat(this.value)).toFixed(0)}%`; : this.current != 0 && this.target != 0
? `${((this.current / this.target) * 100).toFixed(2)}%`
: this.current != 0 && this.target == 0 && this.current >= 100 ? 100 + '%' : this.current != 0 && this.target == 0 && this.current < 100 ? this.current + '%' : this.previous >=100 ? 100 + '%' : this.previous + '%';
// } else if(this.previous != 0) {
// return this.previous + '%'
// }
}, },
}, },
methods: {}, methods: {},

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-05-29 17:03:00 * @LastEditTime: 2024-06-06 15:14:29
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -10,31 +10,31 @@
<div v-if="period == '日'" class="std-rate-item"> <div v-if="period == '日'" class="std-rate-item">
<CityName :value="city.name" /> <CityName :value="city.name" />
<div class="std-rate-item__value"> <div class="std-rate-item__value">
<ProgressBar :period="period" :title="title" :value="city.current" /> <ProgressBar :period="period" :title="title" :target="city.target" :current="city.current" />
<ProgressBar :period="period" :title="titlePre" :value="city.previous" /> <ProgressBar :period="period" :title="titlePre" :previous="city.previous" />
</div> </div>
</div> </div>
<div v-else-if="period == ''" class="std-rate-item"> <div v-else-if="period == ''" class="std-rate-item">
<CityName :value="city.name" /> <CityName :value="city.name" />
<div class="std-rate-item__value"> <div class="std-rate-item__value">
<ProgressBar :period="period" :title="title" :value="city.current" /> <ProgressBar :period="period" :title="title" :target="city.target" :current="city.current" />
<ProgressBar :period="period" :title="titlePre" :value="city.previous" /> <ProgressBar :period="period" :title="titlePre" :previous="city.previous" />
</div> </div>
</div> </div>
<div v-else-if="period == ''" class="std-rate-item"> <div v-else-if="period == ''" class="std-rate-item">
<CityName :value="city.name" /> <CityName :value="city.name" />
<div class="std-rate-item__value"> <div class="std-rate-item__value">
<ProgressBar :period="period" :title="titleTarget" :value="city.target" /> <ProgressBar :period="period" :title="titleTarget" :target="city.target" :current="city.current" />
<ProgressBar :period="period" :title="titlePre" :value="city.previous" /> <ProgressBar :period="period" :title="titlePre" :previous="city.previous" />
<ProgressBar :period="period" :title="title" :value="city.current" /> <!-- <ProgressBar :period="period" :title="title" :value="city.current" /> -->
</div> </div>
</div> </div>
<div v-else="period == '年'" class="std-rate-item"> <div v-else="period == '年'" class="std-rate-item">
<CityName :value="city.name" /> <CityName :value="city.name" />
<div class="std-rate-item__value"> <div class="std-rate-item__value">
<ProgressBar :period="period" :title="titleTarget" :value="city.target" /> <ProgressBar :period="period" :title="titleTarget" :target="city.target" :current="city.current" />
<ProgressBar :period="period" :title="titlePre" :value="city.previous" /> <ProgressBar :period="period" :title="titlePre" :previous="city.previous" />
<ProgressBar :period="period" :title="title" :value="city.current" /> <!-- <ProgressBar :period="period" :title="title" :value="city.current" /> -->
</div> </div>
</div> </div>
</template> </template>
@ -76,15 +76,15 @@ export default {
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 `${month}${today}` return `${year-1}${month}${today}`
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
return `${yesterday}` return `${yesterday}`
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
return `年本周` return `${year-1}年本周`
} 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 === '同比') {
return `${month}` return `${year-1}${month}`
} else if (this.period === '月' && this.than === '环比') { } else if (this.period === '月' && this.than === '环比') {
return `${lastMonth}` return `${lastMonth}`
} else { } else {
@ -120,9 +120,13 @@ export default {
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 === '月') { if (this.period === '月') {
return `${month}月目标` return `${month}月目标${this.city.target}%`
} else if (this.period === '年') { } else if (this.period === '年') {
return `${year}年目标` return `${year}年目标${this.city.target}%`
} else if (this.period === '周') {
return `本周目标${this.city.target}%`
} else if (this.period === '日') {
return `${month}${today}日目标${this.city.target}%`
} }
}, },
}, },

View File

@ -8,7 +8,7 @@ export default ({
preName, preName,
}) => ({ }) => ({
grid: { grid: {
left: 0, left: '0%',
right: 0, right: 0,
bottom: 0, bottom: 0,
top: 0, top: 0,
@ -41,7 +41,7 @@ export default ({
radius: ["70%", "85%"], radius: ["70%", "85%"],
center: ["45%", "52%"], center: ["45%", "52%"],
emptyCircleStyle: { emptyCircleStyle: {
color: "#042c5f33", color: "#003982",
}, },
}, },
// 数据 series // 数据 series
@ -60,6 +60,9 @@ export default ({
{ {
value: currentSum, value: currentSum,
name: currentName, name: currentName,
tooltip: {
formatter: `${currentName} : ${currentSum}`
},
selected: false, selected: false,
itemStyle: { itemStyle: {
borderJoin: "round", borderJoin: "round",
@ -80,10 +83,11 @@ export default ({
}, },
}, },
{ {
value:currentSum == 0 value:(targetSum - currentSum) === 0 ? 1 : (targetSum - currentSum),
? 1 name: currentName,
: 0, tooltip: {
name: "未达成良率", formatter: `${currentName} : ${currentSum}`
},
itemStyle: { color: "transparent" }, itemStyle: { color: "transparent" },
label: { show: false }, label: { show: false },
}, },

View File

@ -1,10 +1,10 @@
<template> <template>
<div class="factory-layout"> <div class="factory-layout">
<FactoryDataHeader :than="than" :companyName="companyName" :companyId="companyId" :period="period" <FactoryDataHeader :companyName="companyName" :companyId="companyId" :period="period"
@update:than="updateThan" @update:period="updatePeriod" /> @update:period="updatePeriod" />
<div class="factory-section"> <div class="factory-section">
<section class="top flex"> <section class="top flex">
<db-container title="生产监控" icon="prod"> <db-container title="生产监控" icon="prod" @update:than="updateThan" :than="than">
<prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data"
:prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
</db-container> </db-container>

View File

@ -4,19 +4,28 @@
<span v-for="item in legend" :key="item.label" class="legend-item" <span v-for="item in legend" :key="item.label" class="legend-item"
:style="{ fontSize: isFullscreen ? '0.85vw' : '0.73vw' }">{{ item.label }}</span> :style="{ fontSize: isFullscreen ? '0.85vw' : '0.73vw' }">{{ item.label }}</span>
</div> --> </div> -->
<div id="factoryEnergyChart" style="width: 100%; height: 100%"></div> <div id="factoryEnergyChart" style="width: 100%; height: 100%"></div>
</div> </div>
</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 CopilotButton from "./chartButton"
export default { export default {
components: {
// CopilotButton,
},
name: "Energy", name: "Energy",
props: { props: {
// legend: { // legend: {
// type: Array, // type: Array,
// required: true, // required: true,
// }, // },
type: {
type: String,
default:'目标产量'
},
energyCockpits: { energyCockpits: {
type: Array, type: Array,
required: true, required: true,
@ -27,6 +36,15 @@ export default {
isFullscreen: false, isFullscreen: false,
actualOptions: null, actualOptions: null,
chart: "", chart: "",
// obj:{
// seriesArr: [],
// targetProduceArr: [],
// planIn: [],
// acIn: [],
// acProduceArr: [],
// scrapNum: [],
// processNum: [],
// },
options: { options: {
color: ["#FFD160", "#2760FF", "#12FFF5"], color: ["#FFD160", "#2760FF", "#12FFF5"],
grid: { grid: {
@ -172,6 +190,9 @@ export default {
}, },
}, },
watch: { watch: {
type(val) {
},
/** 全屏状态切换时,对柱子粗细和字体大小进行相应调整 */ /** 全屏状态切换时,对柱子粗细和字体大小进行相应调整 */
// isFullscreen(val) { // isFullscreen(val) {
// this.actualOptions.series.map((item) => { // this.actualOptions.series.map((item) => {
@ -228,23 +249,80 @@ export default {
}, 500)(); }, 500)();
}, },
initChart() { initChart() {
console.log("this.energyCockpits", this.energyCockpits); if (this.chart) {
let orderXAxis = ['目标产量', '计划投入量', '实际投入量', '实际产出量', '废品数量', '待再加工数量']; this.chart.dispose();
// let n = 0; }
let seriesArr = [] this.chart = echarts.init(document.getElementById("factoryEnergyChart"));
// let arr = [] const actualOptions = JSON.parse(JSON.stringify(this.options));
// if (this.energyCockpits) { if (this.type === '目标产量') {
// this.energyCockpits.forEach(ele => { let orderXAxis = []
// arr.push() let targetProduceArr = []
// }); if (this.energyCockpits) {
// } this.energyCockpits.forEach(ele => {
seriesArr[0] = this.energyCockpits.length != 0 && this.energyCockpits[0].targetProduction ? this.energyCockpits[0].targetProduction :0 targetProduceArr.push(ele.targetProduction)
seriesArr[1] = this.energyCockpits.length != 0 && this.energyCockpits[0].plannedInvestment ? this.energyCockpits[0].plannedInvestment : 0 orderXAxis.push(ele.workOrderNumber)
seriesArr[2] = this.energyCockpits.length != 0 && this.energyCockpits[0].actualInvestment ? this.energyCockpits[0].actualInvestment : 0 });
seriesArr[3] = this.energyCockpits.length != 0 && this.energyCockpits[0].actualProduction ? this.energyCockpits[0].actualProduction : 0 }
seriesArr[4] = this.energyCockpits.length != 0 && this.energyCockpits[0].wasteNum ? this.energyCockpits[0].wasteNum : 0 actualOptions.xAxis.data = orderXAxis;
seriesArr[5] = this.energyCockpits.length != 0 && this.energyCockpits[0].reworkNum ? this.energyCockpits[0].reworkNum : 0 actualOptions.series[0].data = targetProduceArr;
console.log(seriesArr); // this.initChart(targetProduceArr, orderXAxis)
} else if (this.type === '计划投入') {
let orderXAxis = []
let planIn = []
if (this.energyCockpits) {
this.energyCockpits.forEach(ele => {
planIn.push(ele.plannedInvestment)
orderXAxis.push(ele.workOrderNumber)
});
}
actualOptions.xAxis.data = orderXAxis;
actualOptions.series[0].data = planIn;
} else if (this.type === '实际投入') {
let orderXAxis = []
let acIn = []
if (this.energyCockpits) {
this.energyCockpits.forEach(ele => {
acIn.push(ele.actualInvestment)
orderXAxis.push(ele.workOrderNumber)
});
}
actualOptions.xAxis.data = orderXAxis;
actualOptions.series[0].data = acIn;
} else if (this.type === '实际产出') {
let orderXAxis = []
let acProduceArr = []
if (this.energyCockpits) {
this.energyCockpits.forEach(ele => {
acProduceArr.push(ele.actualProduction)
orderXAxis.push(ele.workOrderNumber)
});
}
actualOptions.xAxis.data = orderXAxis;
actualOptions.series[0].data = acProduceArr;
} else if (this.type === '废品数量') {
let orderXAxis = []
let scrapNum = []
if (this.energyCockpits) {
this.energyCockpits.forEach(ele => {
scrapNum.push(ele.wasteNum)
orderXAxis.push(ele.workOrderNumber)
});
}
actualOptions.xAxis.data = orderXAxis;
actualOptions.series[0].data = scrapNum;
} else if (this.type === '待再加工') {
let orderXAxis = []
let processNum = []
if (this.energyCockpits) {
this.energyCockpits.forEach(ele => {
console.log(ele.reworkNum);
processNum.push(ele.reworkNum)
orderXAxis.push(ele.workOrderNumber)
});
}
actualOptions.xAxis.data = orderXAxis;
actualOptions.series[0].data = processNum;
}
// let seriesArr = [ // let seriesArr = [
// { // {
@ -286,13 +364,7 @@ export default {
// } // }
// } // }
// } // }
if (this.chart) {
this.chart.dispose();
}
this.chart = echarts.init(document.getElementById("factoryEnergyChart"));
const actualOptions = JSON.parse(JSON.stringify(this.options));
actualOptions.xAxis.data = orderXAxis;
actualOptions.series[0].data = seriesArr;
// actualOptions.series[0].name = seriesArr[0].name; // actualOptions.series[0].name = seriesArr[0].name;
// actualOptions.series[1].data = seriesArr[1].data; // actualOptions.series[1].data = seriesArr[1].data;
// actualOptions.series[1].name = seriesArr[1].name; // actualOptions.series[1].name = seriesArr[1].name;

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-05-30 08:58:39 * @Date: 2024-05-30 08:58:39
* @LastEditTime: 2024-06-05 09:15:03 * @LastEditTime: 2024-06-07 09:29:45
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -106,7 +106,7 @@ export default {
}, },
series: [ series: [
{ {
name: "fto", // this.series[0].name, name: "FTO", // this.series[0].name,
type: "bar", type: "bar",
barWidth: 12, barWidth: 12,
itemStyle: { itemStyle: {
@ -296,7 +296,7 @@ export default {
.legend-item { .legend-item {
position: relative; position: relative;
// font-size: 12px; // font-size: 12px;
margin-right: 1.3vw; margin-right:1.2vw;
&::before { &::before {
content: ""; content: "";
@ -308,7 +308,9 @@ export default {
margin-right: 0.22vw; margin-right: 0.22vw;
} }
} }
.legend-item:nth-child(3) {
margin-left: 1vw;
}
.legend-item:nth-child(1):before { .legend-item:nth-child(1):before {
background-color: #12f7f1; background-color: #12f7f1;
} }

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-05-30 10:54:00 * @LastEditTime: 2024-06-07 09:30:17
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -41,7 +41,7 @@ export default {
}, },
data() { data() {
// //
const cities = ["fto投入", "芯片产量", "标准组件产量"]; const cities = ["FTO投入", "芯片产量", "标准组件产量"];
return { return {
// xAxis: cities, // xAxis: cities,
}; };
@ -67,7 +67,7 @@ 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: `${month}${today}`, color: "#12f7f1" }, { label: `${year-1}${month}${today}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${month}${today}`, color: "#58adfa" },
]; ];
} else if (this.period ===1 && this.than === '环比') { } else if (this.period ===1 && this.than === '环比') {
@ -77,7 +77,7 @@ export default {
]; ];
} else if (this.period === 2 && this.than === '同比') { } else if (this.period === 2 && this.than === '同比') {
items = [ items = [
{ label: `年本周`, color: "#12f7f1" }, { label: `${year-1}年本周`, color: "#12f7f1" },
{ label: `本周`, color: "#58adfa" }, { label: `本周`, color: "#58adfa" },
]; ];
} else if (this.period === 2 && this.than === '环比') { } else if (this.period === 2 && this.than === '环比') {
@ -87,7 +87,7 @@ export default {
]; ];
} else if (this.period === 3 && this.than === '同比') { } else if (this.period === 3 && this.than === '同比') {
items = [ items = [
{ label: `${month}`, color: "#12f7f1" }, { label: `${year-1}${month}`, color: "#12f7f1" },
{ label: `${month}`, color: "#58adfa" }, { label: `${month}`, color: "#58adfa" },
{ label: `${month}月目标`, color: "#58adfa" }, { label: `${month}月目标`, color: "#58adfa" },
// { label: `${month}`, value: valueTuple[2] }, // { label: `${month}`, value: valueTuple[2] },
@ -172,7 +172,7 @@ function getTemplate(period, dataList, than) {
if (period === 1 && than === '同比') { if (period === 1 && than === '同比') {
items = [ items = [
{ {
name: `${month}${today}`, name: `${year-1}${month}${today}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
@ -196,7 +196,7 @@ function getTemplate(period, dataList, than) {
} else if (period === 2 && than === '同比') { } else if (period === 2 && than === '同比') {
items = [ items = [
{ {
name: `年本周`, name: `${year-1}年本周`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
@ -220,7 +220,7 @@ function getTemplate(period, dataList, than) {
} else if (period === 3 && than === '同比') { } else if (period === 3 && than === '同比') {
items = [ items = [
{ {
name: `${month}`, name: `${year-1}${month}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {

View File

@ -8,7 +8,12 @@
<span class="title">工单情况</span> <span class="title">工单情况</span>
<span class="line"></span> <span class="line"></span>
</div> </div>
<barChartBase :energyCockpits="prodOrder" ref="barChart" style="height: 0;flex:1"></barChartBase> <div class="button-type" style="margin-left: auto;position: absolute;right: 1%;top: 57%;z-index: 999;">
<CopilotButton v-for="i in ['目标产量', '计划投入', '实际投入', '实际产出', '废品数量', '待再加工']" :key="i" :label="i"
:active="i === type" @click="() => $emit('update:type', i)" />
</div>
<barChartBase :type="type" :energyCockpits="prodOrder" ref="barChart"
style="height: 0;flex:1"></barChartBase>
</div> </div>
</div> </div>
@ -16,14 +21,18 @@
<script> <script>
import { debounce } from "@/utils/debounce"; import { debounce } from "@/utils/debounce";
import barChartBase from './BarChartBase' import barChartBase from './BarChartBase'
// import barChartBase from './BarChartBase'
import CopilotButton from "./chartButton"
export default { export default {
name: "Order", name: "Order",
components: { components: {
barChartBase, barChartBase,
CopilotButton,
}, },
data() { data() {
return { return {
showTable: true, showTable: true,
// type: '',
config: { config: {
header: ["工单号", "工单状态", "计划投入", "实际投入", "目标产量", "实际产量", "生产进度"], header: ["工单号", "工单状态", "计划投入", "实际投入", "目标产量", "实际产量", "生产进度"],
headerBGC: "rgba(0, 106, 205, 0.22)", headerBGC: "rgba(0, 106, 205, 0.22)",
@ -39,6 +48,10 @@ export default {
}; };
}, },
props: { props: {
type: {
type: String,
default: "目标产量",
},
prodOrder: { prodOrder: {
type: Array, type: Array,
default: [], default: [],
@ -58,9 +71,18 @@ export default {
}, },
}, },
mounted() { mounted() {
window.addEventListener("resize", this.tableReset); window.addEventListener("resize", this.tableReset)
this.$nextTick(() => {
let button = document.getElementsByClassName('button-type')
console.log(button);
button[0].children[0].style.borderRadius = '4px 0 0 4px'
button[0].children[5].style.borderRadius = '0px 4px 4px 0px'
// children[5].classList.add('skate')
// console.log(button[0].children[5].classList);
});
}, },
methods: { methods: {
tableReset() { tableReset() {
this.showTable = false; this.showTable = false;
debounce(() => { debounce(() => {

View File

@ -8,11 +8,11 @@
</div> </div>
<div class="middle-box"> <div class="middle-box">
<span class="type">玻璃类型</span> <span class="type">玻璃类型</span>
<span class="type-name">FTO投入</span> <span class="type-name">FTO</span>
</div> </div>
<div class="right-box"> <div class="right-box">
<span class="type">投入数量</span> <span class="type">投入数量</span>
<span class="num">{{ prodFto[0] ? prodFto[0].chipInput : 0 }}</span> <span class="num">{{ prodFto[0] ? prodFto[0].chipInput.toLocaleString() : 0 }}</span>
</div> </div>
</div> </div>
<div class="std-box"> <div class="std-box">
@ -23,12 +23,12 @@
<div class="separate"> <div class="separate">
<div> <div>
<span class="type">玻璃类型</span> <span class="type">玻璃类型</span>
<span class="type-name">标准组件产量</span> <span class="type-name">标准组件</span>
</div> </div>
<div> <div>
<span class="type">良品数量</span> <span class="type">良品数量</span>
<span class="type-name">{{ <span class="type-name">{{
msgObj.stand.goodNumber ? msgObj.stand.goodNumber : 0 msgObj.stand.goodNumber ? msgObj.stand.goodNumber.toLocaleString() : 0
}}</span> }}</span>
</div> </div>
</div> </div>
@ -38,12 +38,12 @@
<div> <div>
<span class="type">生产数量</span> <span class="type">生产数量</span>
<span class="num">{{ <span class="num">{{
msgObj.stand.outputNumber ? msgObj.stand.outputNumber : 0 msgObj.stand.outputNumber ? msgObj.stand.outputNumber.toLocaleString() : 0
}}</span> }}</span>
</div> </div>
<div> <div>
<span class="type1">良品率</span> <span class="type1">良品率</span>
<span class="num">{{ msgObj.stand.yieldRate ? msgObj.stand.yieldRate : 0 }}%</span> <span class="num">{{ msgObj.stand.yieldRate ? msgObj.stand.yieldRate.toFixed(2) : 0 }}%</span>
</div> </div>
</div> </div>
</div> </div>
@ -56,12 +56,12 @@
<div class="separate"> <div class="separate">
<div> <div>
<span class="type">玻璃类型</span> <span class="type">玻璃类型</span>
<span class="type-name">芯片产量</span> <span class="type-name">芯片</span>
</div> </div>
<div> <div>
<span class="type">良品数量</span> <span class="type">良品数量</span>
<span class="type-name">{{ <span class="type-name">{{
msgObj.chip.goodNumber ? msgObj.chip.goodNumber : 0 msgObj.chip.goodNumber ? msgObj.chip.goodNumber.toLocaleString() : 0
}}</span> }}</span>
</div> </div>
</div> </div>
@ -71,12 +71,12 @@
<div> <div>
<span class="type">生产数量</span> <span class="type">生产数量</span>
<span class="num">{{ <span class="num">{{
msgObj.chip.outputNumber ? msgObj.chip.outputNumber : 0 msgObj.chip.outputNumber ? msgObj.chip.outputNumber.toLocaleString() : 0
}}</span> }}</span>
</div> </div>
<div> <div>
<span class="type1">良品率</span> <span class="type1">良品率</span>
<span class="num">{{ msgObj.chip.yieldRate ? msgObj.chip.yieldRate : 0 }}%</span> <span class="num">{{ msgObj.chip.yieldRate ? msgObj.chip.yieldRate.toFixed(2) : 0 }}%</span>
</div> </div>
</div> </div>
</div> </div>
@ -89,12 +89,12 @@
<div class="separate"> <div class="separate">
<div> <div>
<span class="type">玻璃类型</span> <span class="type">玻璃类型</span>
<span class="type-name">BIPV产量</span> <span class="type-name">BIPV</span>
</div> </div>
<div> <div>
<span class="type">良品数量</span> <span class="type">良品数量</span>
<span class="type-name">{{ <span class="type-name">{{
msgObj.bipv.goodNumber ? msgObj.bipv.goodNumber : 0 msgObj.bipv.goodNumber ? msgObj.bipv.goodNumber.toLocaleString() : 0
}}</span> }}</span>
</div> </div>
</div> </div>
@ -104,12 +104,12 @@
<div> <div>
<span class="type">生产数量</span> <span class="type">生产数量</span>
<span class="num">{{ <span class="num">{{
msgObj.bipv.outputNumber ? msgObj.bipv.outputNumber : 0 msgObj.bipv.outputNumber ? msgObj.bipv.outputNumber.toLocaleString() : 0
}}</span> }}</span>
</div> </div>
<div> <div>
<span class="type1">良品率</span> <span class="type1">良品率</span>
<span class="num">{{ msgObj.bipv.yieldRate ? msgObj.bipv.yieldRate : 0 }}%</span> <span class="num">{{ msgObj.bipv.yieldRate ? msgObj.bipv.yieldRate.toFixed(2) : 0 }}%</span>
</div> </div>
</div> </div>
</div> </div>
@ -129,7 +129,6 @@
<script> <script>
import { number } from 'echarts'; import { number } from 'echarts';
import barChartBase from './ChipOee' import barChartBase from './ChipOee'
export default { export default {
name: "ProdMonitor", name: "ProdMonitor",
components: { components: {

View File

@ -0,0 +1,99 @@
<!--
* @Author: zhp
* @Date: 2024-06-06 14:22:56
* @LastEditTime: 2024-06-07 10:53:39
* @LastEditors: zhp
* @Description:
-->
<template>
<button
class="copilot-btn"
:class="[active ? 'active' : '']"
@click="$emit('click', label)"
>
{{ label }}
</button>
</template>
<script>
export default {
name: "CopilotButton",
props: {
label: {
type: String,
required: true,
},
active: {
type: Boolean,
default: false,
},
},
};
</script>
<style>
button {
appearance: none;
outline: none;
border: none;
background: none;
}
</style>
<style scoped>
.copilot-btn {
/* flex: 1; */
/* position: relative; */
width: 88px;
height: 32px;
background: #01306C;
/* border-radius: 4px 0px 0px 4px; */
backdrop-filter: blur(3px);
/* text-align: center;
padding: 12px;
padding-left: 20px;
color: #fff;
font-size: 18px; */
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 16px;
color: #FFFFFF;
line-height: 22px;
letter-spacing: 5px;
text-align: center;
font-style: normal;
letter-spacing: 10px;
cursor: pointer;
}
.copilot-btn.active {
background: #1D74D8;
/* border-radius: 4px;; */
}
/* .copilot-btn::before,
.copilot-btn::after {
content: "";
position: absolute;
width: 16px;
height: 16px;
top: 0;
background: transparent;
border-style: solid;
border-width: 2px;
border-color: transparent;
border-top-color: #007be4;
}
.copilot-btn::before {
left: 0;
border-left-color: #007be4;
}
.copilot-btn::after {
right: 0;
border-right-color: #007be4;
} */
</style>

View File

@ -0,0 +1,148 @@
<!--
* @Author: zhp
* @Date: 2024-06-07 08:37:17
* @LastEditTime: 2024-06-07 11:04:41
* @LastEditors: zhp
* @Description:
-->
<template>
<button
class="chart-btn"
:class="[active ? 'active' : '']"
@click="$emit('click', label)"
>
{{ label }}
</button>
</template>
<script>
export default {
name: "CopilotButton",
props: {
label: {
type: String,
required: true,
},
active: {
type: Boolean,
default: false,
},
},
mounted() {
},
};
</script>
<style>
button {
appearance: none;
outline: none;
border: none;
background: none;
}
</style>
<style scoped>
.skate {
/* flex: 1; */
position: relative;
width: 88px;
height: 32px;
background: #01306C;
/* border-radius: 4px 0px 0px 4px; */
backdrop-filter: blur(3px);
/* text-align: center;
padding: 12px;
padding-left: 20px;
color: #fff;
font-size: 18px; */
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 12px;
color: #FFFFFF;
line-height: 22px;
letter-spacing: 5px;
text-align: center;
font-style: normal;
/* margin-right: 1px; */
/* letter-spacing: 10px; */
cursor: pointer;
}
.chart-btn:nth-child(6)::after {
content: '';
width: 0;
height: 0;
display: none;
}
.chart-btn {
/* flex: 1; */
position: relative;
width: 88px;
height: 32px;
background: #01306C;
/* border-radius: 4px 0px 0px 4px; */
backdrop-filter: blur(3px);
/* text-align: center;
padding: 12px;
padding-left: 20px;
color: #fff;
font-size: 18px; */
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 12px;
color: #FFFFFF;
line-height: 22px;
letter-spacing: 5px;
text-align: center;
font-style: normal;
/* margin-right: 1px; */
/* letter-spacing: 10px; */
cursor: pointer;
}
.chart-btn::after {
/* flex: 1; */
/* position: relative; */
content: "";
position: absolute;
/* width: 16px; */
/* height: 16px; */
top: px;
right: -1px;
width: 1px;
height: 23px;
border: 1px solid #010D18;
}
.chart-btn.active {
background: #1D74D8;
/* border-radius: 4px;; */
}
.chart-btn.active::after {
display: none;
/* border-radius: 4px;; */
}
/* .copilot-btn::before,
.copilot-btn::after {
content: "";
position: absolute;
width: 16px;
height: 16px;
top: 0;
background: transparent;
border-style: solid;
border-width: 2px;
border-color: transparent;
border-top-color: #007be4;
}
.copilot-btn::before {
left: 0;
border-left-color: #007be4;
}
.copilot-btn::after {
right: 0;
border-right-color: #007be4;
} */
</style>

View File

@ -8,9 +8,7 @@
<template> <template>
<div class="copilot-container"> <div class="copilot-container">
<!-- refresh btn --> <!-- refresh btn -->
<button <button v-if="false" style="
v-if="false"
style="
appearance: none; appearance: none;
outline: none; outline: none;
border: none; border: none;
@ -20,54 +18,44 @@
position: absolute; position: absolute;
top: 8px; top: 8px;
right: 8px; right: 8px;
" " @click="$emit('refresh')">
@click="$emit('refresh')" <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
> style="width: 24px; height: 24px">
<svg <path stroke-linecap="round" stroke-linejoin="round"
xmlns="http://www.w3.org/2000/svg" d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" />
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
style="width: 24px; height: 24px"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99"
/>
</svg> </svg>
</button> </button>
<!-- decoration --> <!-- decoration -->
<div class="corner tl"></div> <div class="corner tl"></div>
<div class="corner tr"></div> <div class="corner tr"></div>
<div class="corner bl"></div> <div class="corner bl"></div>
<div class="corner br"></div> <div class="corner br"></div>
<!-- content --> <!-- content -->
<div <div class="container-head" ref="container-head"
class="container-head" :class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']">
:class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']"
>
<Icon :icon="icon"></Icon> <Icon :icon="icon"></Icon>
<h2 class="container-title">{{ title }}</h2> <h2 class="container-title">{{ title }}</h2>
<div class="button-than" style="margin-left: auto;">
<CopilotButton v-for="i in ['同比', '环比']" :key="i" :label="i" :active="i === than"
@click="() => $emit('update:than', i)" />
</div>
</div> </div>
<div <div class="container-body" :class="[
class="container-body" side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left',
:class="[ ]">
side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left',
]"
>
<slot /> <slot />
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import ContainerIconVue from "./ContainerIcon.vue"; import ContainerIconVue from "./ContainerIcon.vue"
import CopilotButton from "./button.vue"
export default { export default {
name: "DashboardContainer", name: "DashboardContainer",
components: { components: {
Icon: ContainerIconVue, Icon: ContainerIconVue,
CopilotButton
}, },
props: { props: {
side: { side: {
@ -78,15 +66,28 @@ export default {
type: String, type: String,
default: "cube", default: "cube",
}, },
than: {
type: String,
},
title: { title: {
type: String, type: String,
default: "Default Title", default: "Default Title",
}, },
}, },
data() { data() {
return {}; return {
};
}, },
computed: {}, computed: {},
mounted() {
this.$nextTick(() => {
let button = document.getElementsByClassName('button-than')
console.log(button);
button[0].children[0].style.borderRadius = '4px 0 0 4px'
button[0].children[1].style.borderRadius = '0px 4px 4px 0'
console.log(button[0].children[0].style);
})
},
methods: {}, methods: {},
}; };
</script> </script>

View File

@ -4,7 +4,7 @@
@update:than="updateThan" @update:period="updatePeriod" /> @update:than="updateThan" @update:period="updatePeriod" />
<div class="factory-section"> <div class="factory-section">
<section class="top flex"> <section class="top flex">
<db-container title="生产监控" icon="prod"> <db-container title="生产监控" icon="prod" @update:than="updateThan" :than="than">
<prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data"
:prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
</db-container> </db-container>

View File

@ -1,15 +1,15 @@
<template> <template>
<div class="factory-layout"> <div class="factory-layout">
<FactoryDataHeader :than="than" :companyName="companyName" :companyId="companyId" :period="period" <FactoryDataHeader :companyName="companyName" :companyId="companyId" :period="period"
@update:than="updateThan" @update:period="updatePeriod" /> @update:period="updatePeriod" />
<div class="factory-section"> <div class="factory-section">
<section class="top flex"> <section class="top flex">
<db-container title="生产监控" icon="prod"> <db-container title="生产监控" icon="prod" @update:than="updateThan" :than="than">
<prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data" <prod-monitor :companyId="companyId" :factoryData="factoryData" :than="than" :period="period" :data="data"
:prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" /> :prodOutPut="prodOutPut" :prodFto="prodFto" :showBipv="show" />
</db-container> </db-container>
<left-container title="工单监控" icon="order"> <left-container title="工单监控" icon="order">
<order :prodOrder="prodOrder" /> <order @update:type="updateType" :type="type" :prodOrder="prodOrder" />
</left-container> </left-container>
<!-- <db-container title="" icon="store"> --> <!-- <db-container title="" icon="store"> -->
<!-- <store :stock="stock" /> --> <!-- <store :stock="stock" /> -->
@ -49,6 +49,7 @@ export default {
data() { data() {
return { return {
companyId: 0, companyId: 0,
type:'目标产量',
companyName: "瑞昌中建材光电材料有限公司", companyName: "瑞昌中建材光电材料有限公司",
period: 1, period: 1,
show:false, show:false,
@ -76,6 +77,10 @@ export default {
this.getMes(); this.getMes();
}, },
methods: { methods: {
updateType(val) {
console.log(val)
this.type = val
},
updateCompany(obj) { updateCompany(obj) {
this.companyId = obj.companyId; this.companyId = obj.companyId;
this.companyName = obj.companyName; this.companyName = obj.companyName;

View File

@ -58,7 +58,7 @@ 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}`, color: "#12f7f1" }, { label: `${year-1}${month}${today}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${month}${today}`, color: "#58adfa" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
@ -68,7 +68,7 @@ export default {
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
{ label: `年本周`, color: "#12f7f1" }, { label: `${year-1}年本周`, color: "#12f7f1" },
{ label: `本周`, color: "#58adfa" }, { label: `本周`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '环比') { } else if (this.period === '周' && this.than === '环比') {
@ -78,7 +78,7 @@ export default {
]; ];
} else if (this.period === '月' && this.than === '同比') { } else if (this.period === '月' && this.than === '同比') {
items = [ items = [
{ label: `${month}`, color: "#12f7f1" }, { label: `${year-1}${month}`, color: "#12f7f1" },
{ label: `${month}`, color: "#58adfa" }, { label: `${month}`, color: "#58adfa" },
// { label: `${month}`, value: valueTuple[2] }, // { label: `${month}`, value: valueTuple[2] },
]; ];
@ -163,7 +163,7 @@ function getTemplate(period, dataList,than) {
if (period === '日' && than === '同比') { if (period === '日' && than === '同比') {
items = [ items = [
{ {
name: `${month}${today}`, name: `${year-1}${month}${today}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
@ -187,7 +187,7 @@ function getTemplate(period, dataList,than) {
} else if (period === '周' && than === '同比') { } else if (period === '周' && than === '同比') {
items = [ items = [
{ {
name: `年本周`, name: `${year-1}年本周`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
@ -211,7 +211,7 @@ function getTemplate(period, dataList,than) {
} else if (period === '月' && than === '同比') { } else if (period === '月' && than === '同比') {
items = [ items = [
{ {
name: `${month}`, name: `${year-1}${month}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {

View File

@ -58,7 +58,7 @@ 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}`, color: "#12f7f1" }, { label: `${year-1}${month}${today}`, color: "#12f7f1" },
{ label: `${month}${today}`, color: "#58adfa" }, { label: `${month}${today}`, color: "#58adfa" },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
@ -68,7 +68,7 @@ export default {
]; ];
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
{ label: `年本周`, color: "#12f7f1" }, { label: `${year-1}年本周`, color: "#12f7f1" },
{ label: `本周`, color: "#58adfa" }, { label: `本周`, color: "#58adfa" },
]; ];
} else if (this.period === '周' && this.than === '环比') { } else if (this.period === '周' && this.than === '环比') {
@ -78,7 +78,7 @@ export default {
]; ];
} else if (this.period === '月' && this.than === '同比') { } else if (this.period === '月' && this.than === '同比') {
items = [ items = [
{ label: `${month}`, color: "#12f7f1" }, { label: `${year-1}${month}`, color: "#12f7f1" },
{ label: `${month}`, color: "#58adfa" }, { label: `${month}`, color: "#58adfa" },
// { label: `${month}`, value: valueTuple[2] }, // { label: `${month}`, value: valueTuple[2] },
]; ];
@ -165,7 +165,7 @@ function getTemplate(period, dataList,than) {
if (period === '日' && than === '同比') { if (period === '日' && than === '同比') {
items = [ items = [
{ {
name: `${month}${today}`, name: `${year-1}${month}${today}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
@ -189,7 +189,7 @@ function getTemplate(period, dataList,than) {
} else if (period === '周' && than === '同比') { } else if (period === '周' && than === '同比') {
items = [ items = [
{ {
name: `年本周`, name: `${year-1}年本周`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {
@ -213,7 +213,7 @@ function getTemplate(period, dataList,than) {
} else if (period === '月' && than === '同比') { } else if (period === '月' && than === '同比') {
items = [ items = [
{ {
name: `${month}`, name: `${year-1}${month}`,
data: dataList ? dataList[0] : [], data: dataList ? dataList[0] : [],
}, },
{ {

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-05 13:43:13 * @LastEditTime: 2024-06-06 08:42:04
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -114,7 +114,7 @@ export default {
if (this.period === '日' && this.than === '同比') { if (this.period === '日' && this.than === '同比') {
items = [ items = [
{ label: `${month}${today}日累计`,}, { label: `${month}${today}日累计`,},
{ label: `${month}${today}日累计` }, { label: `${year-1}${month}${today}日累计` },
{ label: `${month}${today}日目标`, }, { label: `${month}${today}日目标`, },
]; ];
} else if (this.period === '日' && this.than === '环比') { } else if (this.period === '日' && this.than === '环比') {
@ -126,7 +126,7 @@ export default {
} else if (this.period === '周' && this.than === '同比') { } else if (this.period === '周' && this.than === '同比') {
items = [ items = [
{ label: `本周累计`,}, { label: `本周累计`,},
{ label: `年本周累计` }, { label: `${year-1}年本周累计` },
{ label: `本周目标`, }, { label: `本周目标`, },
]; ];
} else if (this.period === '周' && this.than === '环比') { } else if (this.period === '周' && this.than === '环比') {
@ -138,7 +138,7 @@ export default {
} else if (this.period === '月' && this.than === '同比') { } else if (this.period === '月' && this.than === '同比') {
items = [ items = [
{ label: `${month}月累计`,}, { label: `${month}月累计`,},
{ label: `${month}月累计`, }, { label: `${year-1}${month}月累计`, },
{ label: `${month}月目标`,}, { label: `${month}月目标`,},
]; ];
} else if (this.period === '月' && this.than === '环比') { } else if (this.period === '月' && this.than === '环比') {
@ -160,7 +160,7 @@ 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 == "日" ? `${month}${today}日累计完成` : this.period == "周" ? `本周累计完成` : this.period == "月" ? `${month}月累计完成` : `${year}年累计完成`;
console.log(this.valueTuple[0], this.valueTuple[1], this.valueTuple[2],) console.log(this.valueTuple[0], this.valueTuple[1], this.valueTuple[2],)
console.log(this.valueTuple[2]- this.valueTuple[1]) console.log(this.valueTuple[2]- this.valueTuple[1])
return getOptions({ return getOptions({
@ -234,7 +234,7 @@ function calculateItems(period, valueTuple, than) {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
if (period === '日' && than === '同比') { if (period === '日' && than === '同比') {
items = [ items = [
{ label: `${month}${today}日累计`, value: valueTuple[0] }, { label: `${year-1}${month}${today}日累计`, value: valueTuple[0] },
{ label: `${month}${today}日累计`, value: valueTuple[1] }, { label: `${month}${today}日累计`, value: valueTuple[1] },
{ label: `${month}${today}日目标`, value: valueTuple[2] }, { label: `${month}${today}日目标`, value: valueTuple[2] },
]; ];
@ -246,7 +246,7 @@ function calculateItems(period, valueTuple, than) {
]; ];
} else if (period === '周' && than === '同比') { } else if (period === '周' && than === '同比') {
items = [ items = [
{ label: `年本周累计`, value: valueTuple[0] }, { label: `${year-1}年本周累计`, value: valueTuple[0] },
{ label: `本周累计`, value: valueTuple[1] }, { label: `本周累计`, value: valueTuple[1] },
{ label: `本周目标`, value: valueTuple[2] }, { label: `本周目标`, value: valueTuple[2] },
]; ];
@ -258,7 +258,7 @@ function calculateItems(period, valueTuple, than) {
]; ];
} else if (period === '月' && than === '同比') { } else if (period === '月' && than === '同比') {
items = [ items = [
{ label: `${month}月累计`, value: valueTuple[0] }, { label: `${year-1}${month}月累计`, value: valueTuple[0] },
{ label: `${month}月累计`, value: valueTuple[1] }, { label: `${month}月累计`, value: valueTuple[1] },
{ label: `${month}月目标`, value: valueTuple[2] }, { label: `${month}月目标`, value: valueTuple[2] },
]; ];

View File

@ -1,12 +1,12 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2023-11-06 15:15:30 * @Date: 2023-11-06 15:15:30
* @LastEditTime: 2024-06-05 15:28:07 * @LastEditTime: 2024-06-07 10:28:51
* @LastEditors: DY * @LastEditors: DY
* @Description: * @Description:
--> -->
<template> <template>
<el-drawer class="drawer" :visible.sync="visible" size="55%" @closed="$emit('destroy')"> <el-drawer class="drawer" :visible.sync="visible" size="60%" @closed="$emit('destroy')">
<small-title slot="title" :no-padding="true"> <small-title slot="title" :no-padding="true">
{{ '碲化镉工厂生产数据详情' }} {{ '碲化镉工厂生产数据详情' }}
</small-title> </small-title>
@ -22,7 +22,7 @@
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<p class="title">时间</p> <p class="title">时间</p>
<p class="text">{{ dataForm.reportDate.length > 0 ? dataForm.reportDate[0] + '年' + dataForm.reportDate[1] + '月' + dataForm.reportDate[2] + '日' : '' }}</p> <p class="text">{{ dataForm.reportDate?.length > 0 ? dataForm.reportDate[0] + '年' + dataForm.reportDate[1] + '月' + dataForm.reportDate[2] + '日' : '' }}</p>
</el-col> </el-col>
</el-row> </el-row>
<el-divider></el-divider> <el-divider></el-divider>
@ -350,7 +350,6 @@ export default {
margin: 0; margin: 0;
padding: 32px 32px 24px; padding: 32px 32px 24px;
border-bottom: 1px solid #dcdfe6; border-bottom: 1px solid #dcdfe6;
margin-bottom: 30px;
} }
.detailBox p { .detailBox p {
margin: 0; margin: 0;
@ -374,5 +373,9 @@ export default {
color: rgba(102,102,102,0.75); color: rgba(102,102,102,0.75);
padding-bottom: 20px; padding-bottom: 20px;
} }
.detailBox {
width: 98%;
padding-top: 30px;
}
</style> </style>

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-04 14:13:23 * @LastEditTime: 2024-06-07 09:41:56
* @LastEditors: DY * @LastEditors: DY
* @Description: * @Description:
--> -->
@ -10,17 +10,17 @@
<div class="app-container" style="padding: 16px 24px 0;height: auto; flex-grow: 1;"> <div class="app-container" style="padding: 16px 24px 0;height: auto; flex-grow: 1;">
<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.mode" placeholder="请选择"> <el-select size="small" clearable v-model="listQuery.date" 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.mode === 0 || listQuery.mode === ''" label="时间范围" prop="reportTime"> <el-form-item v-show="listQuery.date === 0 || listQuery.date === ''" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="datetimerange" range-separator="" <el-date-picker size="small" clearable v-model="listQuery.reportTime" type="datetimerange" range-separator=""
start-placeholder="开始日期" value-format="timestamp" format="yyyy-MM-dd" @change="changeDayTime" end-placeholder="结束日期"> start-placeholder="开始日期" value-format="timestamp" format="yyyy-MM-dd" @change="changeDayTime" end-placeholder="结束日期">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.mode === 1" label="时间范围" prop="reportTime"> <el-form-item v-show="listQuery.date === 1" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.start" type="week" format="yyyy 第 WW 周" placeholder="选择周" <el-date-picker size="small" clearable v-model="listQuery.start" type="week" format="yyyy 第 WW 周" placeholder="选择周"
style="width: 180px" @change="onValueChange"> style="width: 180px" @change="onValueChange">
</el-date-picker> </el-date-picker>
@ -32,12 +32,12 @@
{{ date1 }} {{ date2 }} {{ weekNum }} {{ date1 }} {{ date2 }} {{ weekNum }}
</span> </span>
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.mode === 2" label="时间范围" prop="reportTime"> <el-form-item v-show="listQuery.date === 2" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="monthrange" value-format="timestamp" range-separator="" <el-date-picker size="small" clearable v-model="listQuery.reportTime" type="monthrange" value-format="timestamp" range-separator=""
start-placeholder="开始月份" end-placeholder="结束月份" @change="changeTime"> start-placeholder="开始月份" end-placeholder="结束月份" @change="changeTime">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.mode === 3" label="时间范围" prop="reportTime"> <el-form-item v-show="listQuery.date === 3" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.start" format="yyyy-MM-dd" value-format="timestamp" type="year" <el-date-picker size="small" clearable v-model="listQuery.start" format="yyyy-MM-dd" value-format="timestamp" type="year"
placeholder="开始时间"> placeholder="开始时间">
</el-date-picker> </el-date-picker>
@ -94,7 +94,7 @@
@pagination="getDataList" @pagination="getDataList"
/> />
</div> </div>
<add-or-update v-if="detailOrUpdateVisible" ref="detailOrUpdate" :date="listQuery.mode" @refreshDataList="successSubmit" @destroy="detailOrUpdateVisible = false" /> <add-or-update v-if="detailOrUpdateVisible" ref="detailOrUpdate" :date="listQuery.date" @refreshDataList="successSubmit" @destroy="detailOrUpdateVisible = false" />
<!-- <inputTable :date="date" :data="tableData" :time="[startTimeStamp, endTimeStamp]" :sum="all" <!-- <inputTable :date="date" :data="tableData" :time="[startTimeStamp, endTimeStamp]" :sum="all"
:type="listQuery.reportType" @refreshDataList="getDataList" /> --> :type="listQuery.reportType" @refreshDataList="getDataList" /> -->
<!-- <pagination <!-- <pagination
@ -129,7 +129,7 @@ export default {
current: 1, current: 1,
factorys: undefined, factorys: undefined,
total: 0, total: 0,
mode: 0, date: 0,
type:undefined, type:undefined,
// reportType: 2, // reportType: 2,
beginTime: undefined, beginTime: undefined,
@ -353,7 +353,7 @@ export default {
beginTime: this.listQuery.beginTime, beginTime: this.listQuery.beginTime,
endTime: this.listQuery.endTime, endTime: this.listQuery.endTime,
factorys: this.listQuery.factorys, factorys: this.listQuery.factorys,
mode: this.listQuery.mode, date: this.listQuery.date,
type: this.listQuery.type type: this.listQuery.type
}).then(resp => { }).then(resp => {
console.log('Aaa', resp.data) console.log('Aaa', resp.data)

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-05 15:39:35 * @LastEditTime: 2024-06-07 14:15:00
* @LastEditors: DY * @LastEditors: DY
* @Description: * @Description:
--> -->
@ -43,7 +43,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.inStatus }}</p> <p class="text">{{ getDictDataLabel('work_order_in_status', dataForm.inStatus) }}</p>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
@ -98,6 +98,7 @@ import { getWorkOrderDetail } from '@/api/produceData/order';
import SmallTitle from './SmallTitle'; import SmallTitle from './SmallTitle';
import jsPDF from 'jspdf'; import jsPDF from 'jspdf';
import html2canvas from 'html2canvas'; import html2canvas from 'html2canvas';
import { getDictDataLabel } from "@/utils/dict";
export default { export default {
components: { components: {
@ -266,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: '产品良率', text: '产品良率 ' + (pieData[0].value / (pieData[0].value + pieData[1].value)).toFixed(4) * 100 + '%',
left: 'center' left: 'center'
// subtext: 'Fake Data' // subtext: 'Fake Data'
}, },
@ -280,7 +281,7 @@ export default {
}, },
series: [ series: [
{ {
name: 'Access From', // name: 'Access From',
type: 'pie', type: 'pie',
radius: ['40%', '70%'], radius: ['40%', '70%'],
avoidLabelOverlap: false, avoidLabelOverlap: false,

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-03 15:15:18 * @LastEditTime: 2024-06-07 10:35:48
* @LastEditors: DY * @LastEditors: DY
* @Description: * @Description:
--> -->
@ -47,6 +47,7 @@ import moment from 'moment'
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 FileSaver from 'file-saver' // import FileSaver from 'file-saver'
// import * as XLSX from 'xlsx' // import * as XLSX from 'xlsx'
@ -183,7 +184,8 @@ export default {
{ {
prop: 'workOrderType', prop: 'workOrderType',
label: '工单类型', label: '工单类型',
filter: (val) => ['', '芯片订单', '组件类型', 'bipv类型'][val], // filter: publicFormatter('workorder_status')
filter: (val) => ['', '芯片工单', '组件类型', 'bipv类型'][val],
}, },
{ {
prop: 'plannedInvestment', prop: 'plannedInvestment',
@ -209,7 +211,8 @@ export default {
{ {
prop: 'orderStatus', prop: 'orderStatus',
label: '工单状态', label: '工单状态',
filter: (val) => ['未开始', '生产中', '已完成'][val], filter: publicFormatter('workorder_status')
// filter: (val) => ['', '', ''][val],
}, },
{ {
prop: 'startTime', prop: 'startTime',