From ae9b400eae985f6b6f2e33f66ee1575f72675898 Mon Sep 17 00:00:00 2001 From: lyh <925863403@qq.com> Date: 星期六, 09 八月 2025 00:18:41 +0800 Subject: [PATCH] 添加流程节点 --- src/views/dashboard/EquipmentSignage.vue | 417 +++++++++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 319 insertions(+), 98 deletions(-) diff --git a/src/views/dashboard/EquipmentSignage.vue b/src/views/dashboard/EquipmentSignage.vue index 9c24579..6fb7ba7 100644 --- a/src/views/dashboard/EquipmentSignage.vue +++ b/src/views/dashboard/EquipmentSignage.vue @@ -38,40 +38,37 @@ <dv-border-box-11 title="璁惧淇℃伅" class="info-container" style="flex:5;"> <a-descriptions :column="3"> <a-descriptions-item label="缁熶竴缂栧彿"> - {{equipmentInfo.equipmentId}} + {{equipmentInfo.num|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="ABC鏍囪瘑"> - {{equipmentInfo.ABCSymbol}} + {{equipmentInfo.abc|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="璁惧鍚嶇О"> - {{equipmentInfo.equipmentName}} + {{equipmentInfo.name|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="鍨嬪彿"> - {{equipmentInfo.equipmentType}} + {{equipmentInfo.model|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="璁惧鍒嗙被"> - {{equipmentInfo.equipmentCategory}} + {{equipmentInfo.equipmentCategoryName|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="宸ュ尯"> - {{equipmentInfo.workArea}} + {{equipmentInfo.areaName|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="鎿嶄綔绯荤粺"> - {{equipmentInfo.driveType}} + {{equipmentInfo.system|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="瑙勬牸"> - {{equipmentInfo.standard}} + {{equipmentInfo.specification|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="缁存姢閮ㄩ棬"> - {{equipmentInfo.depart}} + {{equipmentInfo.manageName|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="宸ユ"> - {{equipmentInfo.workshopSection}} - </a-descriptions-item> - <a-descriptions-item label="鎿嶄綔宸�"> - {{equipmentInfo.operator}} + {{equipmentInfo.workShopName|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="璁惧鐘舵��"> - {{equipmentInfo.equipmentStatus}} + {{equipmentInfo.equipmentStatus|equipmentInfoDisplay}} </a-descriptions-item> </a-descriptions> </dv-border-box-11> @@ -79,16 +76,26 @@ <dv-border-box-11 title="鎿嶄綔璇佷俊鎭�" class="info-container" style="flex:2;"> <a-descriptions :column="1"> <a-descriptions-item label="鎿嶄綔璇佺紪鍙�"> - {{equipmentInfo.equipmentId}} + <a-tooltip> + <template slot="title"> + {{operationCertificateInfo.num|equipmentInfoDisplay}} + </template> + {{operationCertificateInfo.num|equipmentInfoDisplay}} + </a-tooltip> </a-descriptions-item> <a-descriptions-item label="褰撳墠鍛ㄦ湡鍒嗘暟"> - {{equipmentInfo.ABCSymbol}} + {{operationCertificateInfo.currentCycleScore|equipmentInfoDisplay}} </a-descriptions-item> - <a-descriptions-item label="鍙戣瘉鏃ユ湡"> - {{equipmentInfo.equipmentName}} + <a-descriptions-item label="鍙戣瘉/鎴鏃ユ湡"> + <a-tooltip> + <template slot="title" v-if="operationCertificateInfo.issueDate||operationCertificateInfo.endTime"> + {{operationCertificateInfo.issueDate|equipmentInfoDisplay}}/{{operationCertificateInfo.endTime|equipmentInfoDisplay}} + </template> + {{operationCertificateInfo.issueDate|equipmentInfoDisplay}}/{{operationCertificateInfo.endTime|equipmentInfoDisplay}} + </a-tooltip> </a-descriptions-item> - <a-descriptions-item label="鍛ㄦ湡鎴鏃ユ湡"> - {{equipmentInfo.equipmentType}} + <a-descriptions-item label="鎿嶄綔宸�"> + {{operationCertificateInfo.realname|equipmentInfoDisplay}} </a-descriptions-item> </a-descriptions> </dv-border-box-11> @@ -96,29 +103,40 @@ <dv-border-box-11 title="缁存姢淇℃伅" class="info-container" style="flex:2;"> <a-descriptions :column="1"> <a-descriptions-item label="涓嬫涓変繚鏃ユ湡"> - {{equipmentInfo.equipmentId}} + <a-tooltip> + <template slot="title" v-if="equipmentInfo.nextThirdMaintenanceTime"> + {{equipmentInfo.nextThirdMaintenanceTime}} + </template> + {{equipmentInfo.nextThirdMaintenanceTime|equipmentInfoDisplay}} + </a-tooltip> </a-descriptions-item> <a-descriptions-item label="涓嬫浜屼繚鏃ユ湡"> - {{equipmentInfo.ABCSymbol}} + <a-tooltip> + <template slot="title" v-if="equipmentInfo.nextSecondMaintenanceTime"> + {{equipmentInfo.nextSecondMaintenanceTime|equipmentInfoDisplay}} + </template> + {{equipmentInfo.nextSecondMaintenanceTime|equipmentInfoDisplay}} + </a-tooltip> </a-descriptions-item> <a-descriptions-item label="鎶�鏈姸鎬�"> - {{equipmentInfo.equipmentName}} + {{equipmentInfo.technology_status|equipmentInfoDisplay}} </a-descriptions-item> </a-descriptions> </dv-border-box-11> </div> <!--鍔熻兘鎸夐挳鍖哄煙--> - <div style="display: flex;height: 30%;align-items: center;padding: 0 20px;color: #eee;"> + <div style="display: flex;height: 30%;align-items: center;padding: 0 20px;color: #fff;"> <div style="display: flex;justify-content:space-evenly;flex: 1"> <div style="width: 45%;" class="info-card-container"> - <div class="info-card-title">鏈湀鎶ヤ慨鏁伴噺</div> - <div class="info-card-value" style="color: #EAC910">20</div> + <div class="info-card-title">鏈湀鎶ヤ慨娆℃暟</div> + <div class="info-card-value" style="color: #EAC910">{{equipmentInfo.repairCount|equipmentInfoDisplay}} + </div> </div> <div style="width: 45%;" class="info-card-container"> - <div class="info-card-title">璁惧鐘舵�侊紙缁翠慨涓瓑锛�</div> - <div class="info-card-value">缁翠慨涓�</div> + <div class="info-card-title">璁惧鐘舵��</div> + <div class="info-card-value">{{equipmentInfo.equipmentStatus|equipmentInfoDisplay}}</div> </div> </div> @@ -133,39 +151,37 @@ <!--鍙充笅鍚勯」鏁版嵁鍥捐〃鍖哄煙--> <dv-border-box-12 style="height: 50%" class="right-bottom-row"> - <div style="display: flex;justify-content:space-evenly;height: 100%"> + <div style="display: flex;justify-content:space-evenly;height: 100%" v-show="isBelongToMdc"> <div style="display: flex;flex-wrap: wrap;width: 30%;height: 100%"> <div id="gauge_chart1" class="gauge-chart"></div> <div id="gauge_chart2" class="gauge-chart"></div> <div id="gauge_chart3" class="gauge-chart"></div> <div id="gauge_chart4" class="gauge-chart"></div> </div> - <div id="line_chart" style="width:40%;height: 100%;"></div> - <div style="width: 25%;height:100%;display: flex;align-items: center"> + <div id="line_chart" :style="{width:lineChartWidth,height: '100%'}"></div> + <div v-show="isBelongToMdc&&isDisplayEquipmentDetails" + style="width: 25%;height:100%;display: flex;align-items: center"> <a-descriptions :column="2"> <a-descriptions-item label="杩愯妯″紡"> - {{equipmentInfo.equipmentId}} + {{equipmentDetails.runModble|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="绋嬪簭鍙�"> - {{equipmentInfo.ABCSymbol}} + {{equipmentDetails.sequencenumber|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="涓昏酱杞��"> - {{equipmentInfo.equipmentName}} + {{equipmentDetails.spindlespeed|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="涓昏酱璐熻嵎"> - {{equipmentInfo.equipmentType}} - </a-descriptions-item> - <a-descriptions-item label="涓昏酱杞��"> - {{equipmentInfo.equipmentCategory}} + {{equipmentDetails.spindleload|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="涓昏酱鍊嶇巼"> - {{equipmentInfo.workArea}} + {{equipmentDetails.spindlebeilv|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="杩涚粰鍊嶇巼"> - {{equipmentInfo.driveType}} + {{equipmentDetails.feedbeilv|equipmentInfoDisplay}} </a-descriptions-item> <a-descriptions-item label="鎶ヨ淇℃伅"> - {{equipmentInfo.standard}} + {{equipmentDetails.alrmstate|equipmentInfoDisplay}} </a-descriptions-item> </a-descriptions> </div> @@ -173,15 +189,22 @@ </dv-border-box-12> </div> </div> + + <SignageModal ref="modalRef" :modalVisible="modalVisible" :modalWidth="modalWidth" :modalTitle=modalTitle + :modalDataApiUrl="modalDataApiUrl" + :modalDataApiParams="modalDataApiParams" + @closeModal="modalVisible=false"/> </div> </template> <script> import signageApi from '@/api/signage' import moment from 'moment' + import SignageModal from './modules/SignageModal' export default { name: 'EquipmentSignage', + components: { SignageModal }, props: { productionCode: { type: String, @@ -199,36 +222,33 @@ return { equipmentId: '', equipmentList: [], - equipmentInfo: { - equipmentId: '2511563154', - ABCSymbol: '3312321421', - equipmentName: '鏈烘涓績', - equipmentType: 'CV4160', - equipmentCategory: '杞ф満', - workArea: 'A鍒嗗尯', - driveType: 'JSOWJDF', - standard: '鏃�', - depart: '杞ф満涓績', - workshopSection: '407涓�宸ユ', - operator: 'admin', - equipmentStatus: 0 - }, + equipmentInfo: {}, + operationCertificateInfo: {}, + equipmentDetails: {}, buttonList: [ { - label: '澶囦欢淇℃伅' + label: '澶囦欢淇℃伅', + pageName: '', + modalDataApiUrl: '' }, { - label: '淇濆吇璁″垝' + label: '淇濆吇璁″垝', + pageName: '', + modalDataApiUrl: '/eam/equipment/list' }, { - label: '鎶ヤ慨' + label: '鎶ヤ慨', + pageName: 'eam-MalfunctionRepair', + modalDataApiUrl: '' }, { label: '璁惧鐝', - pageName: 'mdc-base-DeviceCalendar' + pageName: 'mdc-base-DeviceCalendar', + modalDataApiUrl: '' } ], lineChart: '', + lineChartWidth: '40%', lineChartData: [], gaugeChart1: '', gaugeChart2: '', @@ -240,7 +260,15 @@ openRate: 0, overallEquipmentEfficiency: 0 }, - hideLoadingDelayTime: 500 + hideLoadingDelayTime: 500, + isDisplayEquipmentDetails: false, + isBelongToMdc: true,// 鏄惁鍦╩dc璁惧琛ㄤ腑 + modalVisible: false, + modalWidth: 1048, + modalTitle: '', + modalDataApiUrl: '', + modalTableColumns: [], + modalDataApiParams: {} } }, created() { @@ -248,12 +276,39 @@ }, mounted() { window.addEventListener('resize', this.handleWindowResize) - this.getEquipmentListByApi() + this.getOperationCertificateByApi() + // 鎿嶄綔宸ョ骇鐢ㄦ埛杩涘叆鏃惰皟鐢ㄦ帴鍙h幏鍙杕es璁惧鍒楄〃锛屽叾浣欐儏鍐佃幏鍙杕dc璁惧鍒楄〃 + if (this.userType !== 1) this.getEquipmentListByApi() + else this.getAllAreaEquipmentListByApi() }, beforeDestroy() { window.removeEventListener('resize', this.handleWindowResize) }, + filters: { + equipmentInfoDisplay(value) { + return value ? value : '鏃�' + } + }, + watch: { + isDisplayEquipmentDetails: { + handler(newVal) { + if (newVal) this.lineChartWidth = '40%' + else this.lineChartWidth = '65%' + this.$nextTick(() => { + if (this.lineChart) this.lineChart.resize() + }) + }, + immediate: true + } + }, methods: { + getOperationCertificateByApi() { + signageApi.getOperationCertificateApi() + .then(res => { + if (res.success && res.result.length > 0) this.operationCertificateInfo = res.result[0] + }) + }, + getEquipmentListByApi() { // 棣栭〉涓�杩涘叆鍗宠澶囩骇鎴栧伐娈电骇鏃讹紝workshopSectionProductionCode涓虹┖锛岄粯璁ゆ煡璇㈢涓�涓溅闂翠腑绗竴涓伐娈典笅鐨勮澶囧垪琛� signageApi.getEquipmentListApi(this.workshopSectionProductionCode) @@ -264,28 +319,141 @@ } }) .finally(() => { - // 姝ゅ涓轰繚璇乪quipmentId姝e父璧嬪�煎悗鍐嶈皟鐢ㄦ帴鍙h幏鍙栧浘琛ㄦ暟鎹紙寮傛锛� + // 姝ゅ涓轰繚璇乪quipmentId姝e父璧嬪�煎悗鍐嶈皟鐢ㄦ帴鍙h幏鍙栧浘琛ㄦ暟鎹互鍙婅澶囪缁嗕俊鎭紙寮傛锛� this.getChartDataByApi() + this.getEquipmentInfoByApi() + this.getEquipmentDetailsByApi() }) }, + getAllAreaEquipmentListByApi() { + signageApi.getAllAreaEquipmentListApi(this.workshopSectionProductionCode) + .then(res => { + if (res.success) { + this.equipmentList = res.result + this.equipmentList.forEach(item => { + item.equipmentId = item.num + item.equipmentModel = item.model + }) + if (!this.productionCode && this.equipmentList.length > 0) this.equipmentId = this.equipmentList[0].equipmentId + } + }) + .finally(() => { + // 姝ゅ涓轰繚璇乪quipmentId姝e父璧嬪�煎悗鍐嶈皟鐢ㄦ帴鍙h幏鍙栬澶囦俊鎭拰缁存姢淇℃伅锛堝紓姝ワ級 + this.getEquipmentInfoByApi() + }) + }, + + // 鑾峰彇鍙充笂瑙掕澶囦俊鎭拰缁存姢淇℃伅 + getEquipmentInfoByApi() { + signageApi.getEquipmentInfoApi(this.equipmentId) + .then(res => { + if (res.success && res.result.length > 0) this.equipmentInfo = res.result[0] + else this.equipmentInfo = {} + }) + }, + + /* 鑾峰彇鍙充笅瑙掕澶囪缁嗕俊鎭� */ + getEquipmentDetailsByApi() { + signageApi.getEquipmentDetailsApi(this.equipmentId) + .then(res => { + if (res.success && res.result) { + this.equipmentDetails = res.result + this.isDisplayEquipmentDetails = true + } + else this.isDisplayEquipmentDetails = false + }) + }, + + /* 鍙充笅瑙掑浘琛ㄦ暟鎹幏鍙栨眹鎬绘柟娉� */ getChartDataByApi() { this.getGaugeChartDataByApi() this.getLineChartDataByApi() }, + /* 鍗曞嚮璁惧鍒楄〃涓殑璁惧鏃惰Е鍙� */ selectEquipment(record) { + // 閬垮厤鐐瑰嚮鐩稿悓璁惧閲嶅鍙戦�佽姹� if (record.equipmentId === this.equipmentId) return this.equipmentId = record.equipmentId - this.getChartDataByApi() + + // 闈炴搷浣滃伐绾ф椂闇�瑕佷紶鍏ヨ澶囩紪鍙蜂互鏌ヨ鍥捐〃鍙婅澶囧悇椤逛俊鎭暟鎹紝鎿嶄綔宸ョ骇鏃跺彲灏嗚澶囧垪琛ㄨ淇℃伅鐩存帴璧嬪�煎睍绀� + if (this.userType !== 1) { + this.getChartDataByApi() + this.getEquipmentDetailsByApi() + this.getEquipmentInfoByApi() + } else { + this.equipmentInfo = record + } }, + /* 鍗曞嚮鍙宠竟瀵艰埅鏍忓悗瑙﹀彂 */ navigateToPage(record) { if (record.pageName) { this.$router.push({ name: record.pageName, params: { equipmentId: this.equipmentId } }) + } else { + this.$refs.modalRef.modalTableColumns = [ + { + title: '#', + dataIndex: '', + key: 'rowIndex', + width: 60, + align: 'center', + customRender: function(t, r, index) { + return parseInt(index) + 1 + } + }, + { + width: 150, + align: 'center', + title: '璁惧缂栧彿', + dataIndex: 'num', + key: 'num' + }, + { + width: 200, + align: 'center', + title: '璁惧鍚嶇О', + dataIndex: 'name', + key: 'name' + }, + { + width: 200, + align: 'center', + title: '璁惧鍨嬪彿', + dataIndex: 'model', + key: 'model' + }, + { + width: 250, + align: 'center', + title: '瑙勬牸', + key: 'specification', + dataIndex: 'specification' + }, + { + width: 170, + align: 'center', + title: '涓嬫浜屼繚鏃堕棿', + key: 'nextSecondMaintenanceTime', + dataIndex: 'nextSecondMaintenanceTime' + }, + { + width: 170, + align: 'center', + title: '涓嬫涓変繚鏃堕棿', + key: 'nextThirdMaintenanceTime', + dataIndex: 'nextThirdMaintenanceTime' + } + ] + this.modalWidth = 1248 + this.modalTitle = record.label + this.modalDataApiParams = { num: this.equipmentId } + this.modalDataApiUrl = record.modalDataApiUrl + this.modalVisible = true } }, @@ -322,8 +490,12 @@ signageApi.getEquipmentLevelEfficiencyStatisticsApi(this.equipmentId) .then(res => { - if (res.success) this.gaugeChartData = res.result - this.drawGaugeChart() + if (res.success && res.result) { + this.gaugeChartData = res.result + this.isBelongToMdc = true + this.drawGaugeChart() + } + else this.isBelongToMdc = false }) }, @@ -339,8 +511,12 @@ signageApi.getEquipmentAnnualEfficiencyStatisticsApi(this.equipmentId) .then(res => { - if (res.success) this.lineChartData = res.result - this.drawLineChart() + if (res.success && res.result) { + this.lineChartData = res.result + this.isBelongToMdc = true + this.drawLineChart() + } + else this.isBelongToMdc = false }) }, @@ -356,8 +532,7 @@ // 涓绘爣棰樻枃鏈牱寮� fontSize: 18, fontWeight: 'normal', - color: '#1AD8DE', - fontWeight: 'bold' + color: '#1AD8DE' } }, tooltip: { @@ -439,11 +614,21 @@ /* 缁樺埗鍒╃敤鐜囦华琛ㄧ洏鍥捐〃 */ drawGaugeChart1(opt) { const option = Object.assign({}, opt) - option.title.text = moment().subtract(1, 'days').format('M鏈圖鏃�') + '鍒╃敤鐜�' - option.series[0].name = '鍒╃敤鐜�' - option.series[0].data = [this.gaugeChartData.utilizationRate] - this.gaugeChart1.setOption(option, true) - setTimeout(() => this.gaugeChart1.hideLoading(), this.hideLoadingDelayTime) + + signageApi.getGaugeColorByTypeApi('lyl') + .then(res => { + if (res.success) { + const colorRange = res.result.map(item => item = [+item.maximumRange / 100, item.rateParameterColor]) + option.series[0].axisLine.lineStyle.color = colorRange + } + }) + .finally(() => { + option.title.text = moment().subtract(1, 'days').format('M鏈圖鏃�') + 'TEEP' + option.series[0].name = 'TEEP' + option.series[0].data = [this.gaugeChartData.utilizationRate] + this.gaugeChart1.setOption(option, true) + setTimeout(() => this.gaugeChart1.hideLoading(), this.hideLoadingDelayTime) + }) this.gaugeChart1.getZr().on('click', params => { // 浠呮湁鐐瑰嚮琛ㄧ洏鍖哄煙鎵嶄細鏈変互涓嬪睘鎬э紝topTarget琛ㄧず瑙﹀彂浜嬩欢瀵硅薄锛宻hape琛ㄧず瑙﹀彂浜嬩欢瀵硅薄鐨勫浘鍍忓睘鎬э紝clockwise琛ㄧず琛ㄧ洏鏄惁浠ラ『鏃堕拡鎺掑垪锛岄粯璁や负true @@ -463,11 +648,21 @@ /* 缁樺埗寮�鍔ㄧ巼浠〃鐩樺浘琛� */ drawGaugeChart2(opt) { const option = Object.assign({}, opt) - option.title.text = moment().subtract(1, 'days').format('M鏈圖鏃�') + '寮�鍔ㄧ巼' - option.series[0].name = '寮�鍔ㄧ巼' - option.series[0].data = [this.gaugeChartData.startRate] - this.gaugeChart2.setOption(option, true) - setTimeout(() => this.gaugeChart2.hideLoading(), this.hideLoadingDelayTime) + + signageApi.getGaugeColorByTypeApi('kdl') + .then(res => { + if (res.success) { + const colorRange = res.result.map(item => item = [+item.maximumRange / 100, item.rateParameterColor]) + option.series[0].axisLine.lineStyle.color = colorRange + } + }) + .finally(() => { + option.title.text = moment().subtract(1, 'days').format('M鏈圖鏃�') + '寮�鍔ㄧ巼' + option.series[0].name = '寮�鍔ㄧ巼' + option.series[0].data = [this.gaugeChartData.startRate] + this.gaugeChart2.setOption(option, true) + setTimeout(() => this.gaugeChart2.hideLoading(), this.hideLoadingDelayTime) + }) this.gaugeChart2.getZr().on('click', params => { // 浠呮湁鐐瑰嚮琛ㄧ洏鍖哄煙鎵嶄細鏈変互涓嬪睘鎬э紝topTarget琛ㄧず瑙﹀彂浜嬩欢瀵硅薄锛宻hape琛ㄧず瑙﹀彂浜嬩欢瀵硅薄鐨勫浘鍍忓睘鎬э紝clockwise琛ㄧず琛ㄧ洏鏄惁浠ラ『鏃堕拡鎺掑垪锛岄粯璁や负true @@ -487,11 +682,21 @@ /* 缁樺埗寮�鏈虹巼浠〃鐩樺浘琛� */ drawGaugeChart3(opt) { const option = Object.assign({}, opt) - option.title.text = moment().subtract(1, 'days').format('M鏈圖鏃�') + '寮�鏈虹巼' - option.series[0].name = '寮�鏈虹巼' - option.series[0].data = [this.gaugeChartData.openRate] - this.gaugeChart3.setOption(option, true) - setTimeout(() => this.gaugeChart3.hideLoading(), this.hideLoadingDelayTime) + + signageApi.getGaugeColorByTypeApi('kdl') + .then(res => { + if (res.success) { + const colorRange = res.result.map(item => item = [+item.maximumRange / 100, item.rateParameterColor]) + option.series[0].axisLine.lineStyle.color = colorRange + } + }) + .finally(() => { + option.title.text = moment().subtract(1, 'days').format('M鏈圖鏃�') + '寮�鏈虹巼' + option.series[0].name = '寮�鏈虹巼' + option.series[0].data = [this.gaugeChartData.openRate] + this.gaugeChart3.setOption(option, true) + setTimeout(() => this.gaugeChart3.hideLoading(), this.hideLoadingDelayTime) + }) this.gaugeChart3.getZr().on('click', params => { // 浠呮湁鐐瑰嚮琛ㄧ洏鍖哄煙鎵嶄細鏈変互涓嬪睘鎬э紝topTarget琛ㄧず瑙﹀彂浜嬩欢瀵硅薄锛宻hape琛ㄧず瑙﹀彂浜嬩欢瀵硅薄鐨勫浘鍍忓睘鎬э紝clockwise琛ㄧず琛ㄧ洏鏄惁浠ラ『鏃堕拡鎺掑垪锛岄粯璁や负true @@ -511,11 +716,21 @@ /* 缁樺埗OEE浠〃鐩樺浘琛� */ drawGaugeChart4(opt) { const option = Object.assign({}, opt) - option.title.text = moment().subtract(1, 'months').format('M鏈�') + `OEE` - option.series[0].name = 'OEE' - option.series[0].data = [this.gaugeChartData.overallEquipmentEfficiency] - this.gaugeChart4.setOption(option, true) - setTimeout(() => this.gaugeChart4.hideLoading(), this.hideLoadingDelayTime) + + signageApi.getGaugeColorByTypeApi('lyl') + .then(res => { + if (res.success) { + const colorRange = res.result.map(item => item = [+item.maximumRange / 100, item.rateParameterColor]) + option.series[0].axisLine.lineStyle.color = colorRange + } + }) + .finally(() => { + option.title.text = moment().subtract(1, 'months').format('M鏈�') + `OEE` + option.series[0].name = 'OEE' + option.series[0].data = [this.gaugeChartData.overallEquipmentEfficiency] + this.gaugeChart4.setOption(option, true) + setTimeout(() => this.gaugeChart4.hideLoading(), this.hideLoadingDelayTime) + }) this.gaugeChart4.getZr().on('click', params => { // 浠呮湁鐐瑰嚮琛ㄧ洏鍖哄煙鎵嶄細鏈変互涓嬪睘鎬э紝topTarget琛ㄧず瑙﹀彂浜嬩欢瀵硅薄锛宻hape琛ㄧず瑙﹀彂浜嬩欢瀵硅薄鐨勫浘鍍忓睘鎬э紝clockwise琛ㄧず琛ㄧ洏鏄惁浠ラ『鏃堕拡鎺掑垪锛岄粯璁や负true @@ -534,7 +749,7 @@ xAxis: this.lineChartData.dateList, yAxis: [ { - name: '鍒╃敤鐜�', + name: 'TEEP', value: this.lineChartData.dataList.map(item => item.utilizationRate) }, { @@ -546,7 +761,7 @@ value: this.lineChartData.dataList.map(item => item.overallEquipmentEfficiency) } ], - yAxisName: '鏁村勾搴﹀埄鐢ㄧ巼(%)' + yAxisName: '鏁村勾搴EEP(%)' } let legendData = [] let seriesData = [] @@ -560,6 +775,13 @@ symbolSize: 8, itemStyle: { color: colorArr[index1] + }, + label: { + show: true, + position: 'top', + textStyle: { + color: 'inherit' + } }, lineStyle: { width: 2 @@ -609,7 +831,7 @@ axisLabel: { interval: 0, show: true, - fontSize: 12, + fontSize: 14, color: '#fff' // rotate: -30, }, @@ -630,7 +852,7 @@ nameTextStyle: { color: '#1AD8DE', fontSize: 18, - padding: [0, 0, 0, 110] + padding: [0, 0, 0, 120] }, nameGap: 25, type: 'value', @@ -653,12 +875,13 @@ }, { type: 'value', - position: 'right', + position: 'left', splitNumber: 5, max: 100, axisLabel: { show: true, - color: '#fff' + color: '#fff', + fontSize:14 }, axisLine: { show: true, @@ -710,7 +933,7 @@ .equipmentId-container { height: 100%; - color: #eee; + color: #fff; display: flex; justify-content: center; align-items: center; @@ -798,8 +1021,6 @@ padding-bottom: 25px; white-space: nowrap; overflow: hidden; - -ms-text-overflow: ellipsis; - text-overflow: ellipsis; } /deep/ .ant-descriptions-item-label, /deep/ .ant-descriptions-item-content { -- Gitblit v1.9.3