看板修改

master
suixy 2 weeks ago
parent 25dec396f4
commit d0d22fdf64

Binary file not shown.

Before

Width:  |  Height:  |  Size: 801 KiB

After

Width:  |  Height:  |  Size: 787 KiB

@ -31,7 +31,7 @@
</div> </div>
<div class="topNum shutdownNum"> <div class="topNum shutdownNum">
<!-- <span class="text">停机</span>--> <!-- <span class="text">停机</span>-->
<span class="text"></span> <span class="text"></span>
<span></span> <span></span>
<span class="num">{{ runningData.STOPPEDCOUNT }}</span> <span class="num">{{ runningData.STOPPEDCOUNT }}</span>
<span class="unit"></span> <span class="unit"></span>
@ -58,17 +58,17 @@
<div class="item" v-for="i in form.table1"> <div class="item" v-for="i in form.table1">
<div class="itemTitle">{{ i.DEVICENAME }}</div> <div class="itemTitle">{{ i.DEVICENAME }}</div>
<div class="itemImg"></div> <div class="itemImg"></div>
<div class="itemType itemType0" v-if="i.STATUSCODE===2"></div> <div class="itemType itemType0" v-if="i.STATUSCODE===4"></div>
<div class="itemType itemType1" v-if="i.STATUSCODE===3"></div> <div class="itemType itemType1" v-if="i.STATUSCODE===2"></div>
<div class="itemType itemType2" v-if="i.STATUSCODE===1"></div> <div class="itemType itemType2" v-if="i.STATUSCODE===1"></div>
<div class="itemType itemType3" v-if="i.STATUSCODE===0"></div> <div class="itemType itemType3" v-if="i.STATUSCODE===0"></div>
<div class="itemTime itemTime0" v-if="i.STATUSCODE===2"> <div class="itemTime itemTime0" v-if="i.STATUSCODE===4">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ <span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
parseFloat(i.value1 || '0').toFixed(1) parseFloat(i.value1 || '0').toFixed(1)
}}</span> }}</span>
<span>h</span> <span>h</span>
</div> </div>
<div class="itemTime itemTime1" v-if="i.STATUSCODE===3"> <div class="itemTime itemTime1" v-if="i.STATUSCODE===2">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ <span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
parseFloat(i.value1 || '0').toFixed(1) parseFloat(i.value1 || '0').toFixed(1)
}}</span> }}</span>
@ -91,17 +91,17 @@
<div class="item" v-for="i in deviceData"> <div class="item" v-for="i in deviceData">
<div class="itemTitle">{{ i.DEVICENAME }}</div> <div class="itemTitle">{{ i.DEVICENAME }}</div>
<div class="itemImg"></div> <div class="itemImg"></div>
<div class="itemType itemType0" v-if="i.STATUSCODE===2"></div> <div class="itemType itemType0" v-if="i.STATUSCODE===4"></div>
<div class="itemType itemType1" v-if="i.STATUSCODE===3"></div> <div class="itemType itemType1" v-if="i.STATUSCODE===2"></div>
<div class="itemType itemType2" v-if="i.STATUSCODE===1"></div> <div class="itemType itemType2" v-if="i.STATUSCODE===1"></div>
<div class="itemType itemType3" v-if="i.STATUSCODE===0"></div> <div class="itemType itemType3" v-if="i.STATUSCODE===0"></div>
<div class="itemTime itemTime0" v-if="i.STATUSCODE===2"> <div class="itemTime itemTime0" v-if="i.STATUSCODE===4">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ <span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
timeData[i.DEVICECODE] || '0' timeData[i.DEVICECODE] || '0'
}}</span> }}</span>
<span>h</span> <span>h</span>
</div> </div>
<div class="itemTime itemTime1" v-if="i.STATUSCODE===3"> <div class="itemTime itemTime1" v-if="i.STATUSCODE===2">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ <span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
timeData[i.DEVICECODE] || '0' timeData[i.DEVICECODE] || '0'
}}</span> }}</span>
@ -224,12 +224,12 @@ export default {
label: '正常运行' label: '正常运行'
}, },
{ {
value: 2, value: 4,
label: '停机' label: '报警'
}, },
{ {
value: 3, value: 2,
label: '机' label: '机'
}, },
], ],
isData: false, isData: false,
@ -653,7 +653,7 @@ export default {
} }
.itemTime1 { .itemTime1 {
color: #FC7F03; color: #FFC107;
} }
.itemTime2 { .itemTime2 {

@ -103,15 +103,15 @@
form.isSimulate ? form.text11 : runningData.TOTALCOUNT form.isSimulate ? form.text11 : runningData.TOTALCOUNT
}}</span> }}</span>
</div> </div>
<div class="text2" style="top: 41%;left: 84.7%;">总维修次数: <span style="color: #EF241E">{{ <div class="text2" style="top: 41%;left: 84.7%;">当日总停机次数: <span style="color: #EF241E">{{
form.isSimulate ? form.text12 : deviceStatusData.repairCount form.isSimulate ? form.text12 : shutDownList.length
}}</span> }}</span>
</div> </div>
<div class="text3" style="top: 35.15%;left: 5.5%;">生产进度</div> <div class="text3" style="top: 35.15%;left: 5.5%;">生产进度</div>
<div class="text3" style="top: 35.15%;left: 75%;">累计维修分析</div> <div class="text3" style="top: 35.15%;left: 75%;">累计停机分析</div>
<div class="text3" style="top: 63.05%;left: 5.5%;">质量追溯</div> <div class="text3" style="top: 63.05%;left: 5.5%;">质量追溯</div>
<div class="text3" style="top: 63.05%;left: 30.2%;">设备总产量</div> <div class="text3" style="top: 63.05%;left: 30.2%;">设备总产量</div>
<div class="text3" style="top: 63.05%;left: 75%;">当日维修趋势</div> <!-- <div class="text3" style="top: 63.05%;left: 75%;">当日维修趋势</div>-->
<div class="deviceError" v-if="form.isSimulate ? form.view1 : alarmInfoData.hasAlarm "> <div class="deviceError" v-if="form.isSimulate ? form.view1 : alarmInfoData.hasAlarm ">
<div class="icon"></div> <div class="icon"></div>
<div class="text" style="left: 18%">{{ form.isSimulate ? form.info1.text1 : alarmInfoData.deviceName }}</div> <div class="text" style="left: 18%">{{ form.isSimulate ? form.info1.text1 : alarmInfoData.deviceName }}</div>
@ -215,22 +215,70 @@
</div> </div>
</vue-seamless-scroll> </vue-seamless-scroll>
</div> </div>
<div class="repairTimes"> <div class="scrollTable2">
<div class="item" v-for="(i,k) in form.isSimulate ? form.table2 : repairAnalysisList "> <div style="background-color: #05346044">
<div class="num">{{ k + 1 }}</div> <div class="scrollTableItem" style="font-weight: bold;width: 25%">
<div class="deviceName">{{ form.isSimulate ? i.text1 : i.deviceName }}</div> 设备名称
<div class="schedule"> </div>
<div class="progressBar" :style="{width: (form.isSimulate ? i.text2: i.percent) + '%'}"></div> <div class="scrollTableItem" style="font-weight: bold;width: 25%">
停机原因
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 25%">
开始时间
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 25%">
结束时间
</div> </div>
<div class="times">{{ form.isSimulate ? i.text3 : i.repairCount }}</div>
</div> </div>
<vue-seamless-scroll
:class-option="scrollTableOption"
:data="form.isSimulate ? form.table1 : shutDownList"
class="case-item"
:key="key"
style="height: calc(100% - 20px - 1vw - 0.4vw);overflow: hidden;"
>
<div
v-for="(item, index) in form.isSimulate ? form.table1 : shutDownList"
:key="index"
>
<div
:style='"background-color:" +(item.shutEndTime ? ((index % 2 === 0)? "#05346022":"#05346044"):"#FFEB3B")'>
<div
class="scrollTableItem" style="width: 25%;font-size: 0.8vw">
{{ form.isSimulate ? item.text1 : item.deviceName }}
</div>
<div
class="scrollTableItem" style="width: 25%;font-size: 0.8vw">
{{ form.isSimulate ? item.text2 : item.shutReason }}
</div>
<div
class="scrollTableItem" style="width: 25%;font-size: 0.8vw">
{{ form.isSimulate ? item.text3 : item.shutBeginTime }}
</div>
<div
class="scrollTableItem" style="width: 25%;font-size: 0.8vw">
{{ form.isSimulate ? item.text3 : item.shutEndTime }}
</div>
</div>
</div>
</vue-seamless-scroll>
</div> </div>
<!-- <div class="chart1">--> <!-- <div class="repairTimes">-->
<!-- <Chart ref="chart1"></Chart>--> <!-- <div class="item" v-for="(i,k) in form.isSimulate ? form.table2 : repairAnalysisList ">-->
<!-- </div>--> <!-- <div class="num">{{ k + 1 }}</div>-->
<!-- <div class="chart4">--> <!-- <div class="deviceName">{{ form.isSimulate ? i.text1 : i.deviceName }}</div>-->
<!-- <Chart ref="chart4"></Chart>--> <!-- <div class="schedule">-->
<!-- </div>--> <!-- <div class="progressBar" :style="{width: (form.isSimulate ? i.text2: i.percent) + '%'}"></div>-->
<!-- </div>-->
<!-- <div class="times">{{ form.isSimulate ? i.text3 : i.repairCount }}</div>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="chart1">-->
<!-- <Chart ref="chart1"></Chart>-->
<!-- </div>-->
<!-- <div class="chart4">-->
<!-- <Chart ref="chart4"></Chart>-->
<!-- </div>-->
<div class="chart2"> <div class="chart2">
<Chart ref="chart2"></Chart> <Chart ref="chart2"></Chart>
</div> </div>
@ -288,7 +336,7 @@
<el-form-item label="设备总数"> <el-form-item label="设备总数">
<el-input v-model="form.text11" autocomplete="off"></el-input> <el-input v-model="form.text11" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="总维修次数"> <el-form-item label="当日总停机次数">
<el-input v-model="form.text12" autocomplete="off"></el-input> <el-input v-model="form.text12" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="是否报警"> <el-form-item label="是否报警">
@ -525,7 +573,10 @@ import {
getProductionTotal, getQualityStatistics, getQualityTraceList, getRepairAnalysisList, getRepairTrendList getProductionTotal, getQualityStatistics, getQualityTraceList, getRepairAnalysisList, getRepairTrendList
} from "@/api/board/board4"; } from "@/api/board/board4";
import {listQualityInspection} from "@/api/report/qualityInspection"; import {listQualityInspection} from "@/api/report/qualityInspection";
import {listShutDown} from "@/api/dms/shutDown";
import {parseTime} from "@/utils/ruoyi";
const now = new Date()
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100 const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
export default { export default {
components: { components: {
@ -618,8 +669,9 @@ export default {
qualityStatisticsData: {}, qualityStatisticsData: {},
qualityTraceList: [], qualityTraceList: [],
deviceProductionList: [], deviceProductionList: [],
qualityInspectionList:[], qualityInspectionList: [],
runningData: {} runningData: {},
shutDownList: []
} }
}, },
async mounted() { async mounted() {
@ -639,7 +691,24 @@ export default {
}, },
methods: { methods: {
async getData() { async getData() {
listQualityInspection({pageSize:99999999}).then(res => { listShutDown({
beginTime: parseTime(new Date(
now.getFullYear(),
now.getMonth(),
now.getDate(),
0, 0, 0
)),
endTime: parseTime(new Date(
now.getFullYear(),
now.getMonth(),
now.getDate(),
23, 59, 59
)),
pageSize: 99999999
}).then(res => {
this.shutDownList = res.rows
})
listQualityInspection({pageSize: 99999999}).then(res => {
this.qualityInspectionList = res.rows this.qualityInspectionList = res.rows
}) })
getDeviceStatusStatistics().then(e => { getDeviceStatusStatistics().then(e => {
@ -883,89 +952,89 @@ export default {
} }
], ],
}) })
this.$refs.chart3.setData({ // this.$refs.chart3.setData({
xAxis: { // xAxis: {
data: this.form.isSimulate ? this.form.chart3.map(e => e.value1) : this.repairTrendList?.map(e => e.timeHour), // data: this.form.isSimulate ? this.form.chart3.map(e => e.value1) : this.repairTrendList?.map(e => e.timeHour),
boundaryGap: false, // boundaryGap: false,
axisLine: { // axisLine: {
lineStyle: { // lineStyle: {
color: '#377097', // color: '#377097',
} // }
}, // },
axisLabel: { // axisLabel: {
fontSize: 12, // fontSize: 12,
interval: 0, // interval: 0,
color: '#4C95C1', // color: '#4C95C1',
}, // },
axisTick: { // axisTick: {
alignWithLabel: true, // alignWithLabel: true,
lineStyle: { // lineStyle: {
color: '#37709799', // color: '#37709799',
} // }
}, // },
splitLine: { // splitLine: {
show: true, // show: true,
alignWithLabel: true, // alignWithLabel: true,
lineStyle: { // lineStyle: {
color: '#37709799', // color: '#37709799',
type: 'dashed', // type: 'dashed',
} // }
} // }
}, // },
yAxis: { // yAxis: {
axisLine: { // axisLine: {
show: true, // show: true,
lineStyle: { // lineStyle: {
color: '#377097', // color: '#377097',
} // }
}, // },
axisLabel: { // axisLabel: {
fontSize: 14, // fontSize: 14,
color: '#4C95C1', // color: '#4C95C1',
}, // },
axisTick: { // axisTick: {
show: true, // show: true,
alignWithLabel: true, // alignWithLabel: true,
lineStyle: { // lineStyle: {
color: '#37709799', // color: '#37709799',
} // }
}, // },
splitLine: { // splitLine: {
show: true, // show: true,
alignWithLabel: true, // alignWithLabel: true,
lineStyle: { // lineStyle: {
color: '#37709799', // color: '#37709799',
type: 'dashed', // type: 'dashed',
} // }
} // }
}, // },
grid: { // grid: {
top: 20, // top: 20,
right: 20, // right: 20,
bottom: 40, // bottom: 40,
left: 50 // left: 50
}, // },
series: [ // series: [
{ // {
type: "line", // type: "line",
symbolSize: 5, // symbolSize: 5,
symbol: 'circle', // symbol: 'circle',
itemStyle: { // itemStyle: {
color: '#FBFFFA', // // color: '#FBFFFA', //
borderColor: '#D8080C', // // borderColor: '#D8080C', //
borderWidth: 2 // // borderWidth: 2 //
}, // },
lineStyle: { // lineStyle: {
color: '#CE0F06', // 线 // color: '#CE0F06', // 线
width: 2 // width: 2
}, // },
label: { // label: {
// show: false, // // show: false,
}, // },
data: this.form.isSimulate ? this.form.chart3.map(e => e.value2) : this.repairTrendList.map(e => e.repairCount), // data: this.form.isSimulate ? this.form.chart3.map(e => e.value2) : this.repairTrendList.map(e => e.repairCount),
}, // },
], // ],
}) // })
// this.$refs.chart4.setData({ // this.$refs.chart4.setData({
// radar: { // radar: {
// center: ["30%", "50%"], // center: ["30%", "50%"],
@ -1170,6 +1239,14 @@ export default {
height: 29%; height: 29%;
} }
.scrollTable2 {
position: absolute;
top: 43%;
left: 72.8%;
width: 23.8%;
height: 52%;
}
.scrollTableItem { .scrollTableItem {
color: #65CDF9; color: #65CDF9;
margin: auto 0px; margin: auto 0px;

@ -79,7 +79,7 @@
<Chart ref="chart1"></Chart> <Chart ref="chart1"></Chart>
</div> </div>
<div class="chart2"> <div class="chart2">
<div class="deviceNum">应检设备<span style="color: #56BDFF;font-weight: 800;margin-left: 1vw">{{ <div class="deviceNum">累计应检设备<span style="color: #56BDFF;font-weight: 800;margin-left: 1vw">{{
form.isSimulate ? form.text16 : inspectStatisticsData.deviceCount form.isSimulate ? form.text16 : inspectStatisticsData.deviceCount
}}</span></div> }}</span></div>
<div class="title"><span style="font-size: 1.5vw;font-weight: 800">{{ <div class="title"><span style="font-size: 1.5vw;font-weight: 800">{{
@ -814,7 +814,7 @@ export default {
.deviceNum { .deviceNum {
position: absolute; position: absolute;
top: 0%; top: 0%;
left: 55%; left: 54%;
color: #fff; color: #fff;
font-size: 1vw; font-size: 1vw;
letter-spacing: 0.1vw; letter-spacing: 0.1vw;

Loading…
Cancel
Save