| src/views/mdc/base/WorkshopSignage.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/views/mdc/base/modules/WorkshopSignage/DayUtilizationRateTrend.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/views/mdc/base/modules/WorkshopSignage/DeviceAlarmInfo.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/views/mdc/base/modules/WorkshopSignage/DeviceDragLayout.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/views/mdc/base/modules/WorkshopSignage/MonthUtilizationRateTrend.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| src/views/mdc/base/modules/WorkshopSignage/WeekUtilizationRateTrend.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
src/views/mdc/base/WorkshopSignage.vue
@@ -5,7 +5,7 @@ <div class="left-col"> <div class="col-content"> <div class="content-title">{{workshopDetails.workshopName}}#设备情况</div> <workshop-device-overview :currentProductionId="currentProductionId" <workshop-device-overview ref="workshopDeviceOverviewRef" :currentProductionId="currentProductionId" :equipmentStatusList="equipmentStatusList" :toDecimal2NoZero="toDecimal2NoZero"/> </div> <div class="col-content"> @@ -15,22 +15,25 @@ </div> <div class="col-content"> <div class="content-title">设备周利用率趋势</div> <week-utilization-rate-trend :currentProductionId="currentProductionId" :toDecimal2NoZero="toDecimal2NoZero"/> <week-utilization-rate-trend ref="weekRateTrendRef" :currentProductionId="currentProductionId" :toDecimal2NoZero="toDecimal2NoZero"/> </div> <div class="col-content"> <div class="content-title">设备日利用率趋势</div> <day-utilization-rate-trend :currentProductionId="currentProductionId" :toDecimal2NoZero="toDecimal2NoZero"/> <day-utilization-rate-trend ref="dayRateTrendRef" :currentProductionId="currentProductionId" :toDecimal2NoZero="toDecimal2NoZero"/> </div> <div class="col-content"> <div class="content-title">设备报警信息</div> <device-alarm-info/> <device-alarm-info ref="deviceAlarmInfoRef" :currentProductionId="currentProductionId"/> </div> </div> <!--右侧拖拽区域--> <div class="right-col"> <device-drag-layout :currentProductionId="currentProductionId" :equipmentStatusList="equipmentStatusList" :getImgView="getImgView"/> <device-drag-layout ref="deviceDragLayoutRef" :currentProductionId="currentProductionId" :equipmentStatusList="equipmentStatusList" :getImgView="getImgView" @handleTimeIntervalForShortOpen="handleTimeIntervalForShortOpen"/> </div> </div> </div> @@ -54,7 +57,7 @@ MonthUtilizationRateTrend, DayUtilizationRateTrend, WeekUtilizationRateTrend, WorkshopDeviceOverview, WorkshopDeviceOverview }, data() { return { @@ -82,20 +85,37 @@ statusImage: require('@/assets/WorskhopSignage/stateImg_gray.gif') } ], deviceList: [], isShowGuideline: false, guidelineXTop: 0, guidelineYLeft: 0, isSwitchChecked: false, isHasResizeOrDragDevice: false timeIntervalForShortTime: null, timeIntervalForLongTime: null } }, created() { if (!this.$route.params.productionId) return // 在此处获取路由参数是为了传递参数给子组件，若放在mounted中则无法传递给子组件 this.currentProductionId = this.$route.params.productionId }, mounted() { if (!this.$route.params.productionId) return // 在mounted中该调用此方法是为了获取dom元素 this.getWorkshopDetailsByApi() this.timeIntervalForShortTime = setInterval(() => { this.$refs.workshopDeviceOverviewRef.getDeviceStatusCountByApi() this.$refs.deviceAlarmInfoRef.getDeviceAlarmInfoByApi() this.$refs.deviceDragLayoutRef.getDeviceListByApi() }, 1000 * 60) this.timeIntervalForLongTime = setInterval(() => { this.$refs.weekRateTrendRef.getChartDataByApi() this.$refs.dayRateTrendRef.getChartDataByApi() }, 1000 * 60 * 60) }, beforeDestroy() { if (this.timeIntervalForShortTime || this.timeIntervalForLongTime) { clearInterval(this.timeIntervalForShortTime) clearInterval(this.timeIntervalForLongTime) this.timeIntervalForShortTime = this.timeIntervalForLongTime = null } }, methods: { // 通过车间Id调用接口获取车间详细信息 @@ -109,6 +129,24 @@ }) }, /** * 控制短期定时任务开启与关闭 * @param checked 右下角功能switch开关状态 */ handleTimeIntervalForShortOpen(checked) { if (checked) { clearInterval(this.timeIntervalForShortTime) this.timeIntervalForShortTime = null console.log('暂停计时器', this.timeIntervalForShortTime) } else { this.timeIntervalForShortTime = setInterval(() => { this.$refs.workshopDeviceOverviewRef.getDeviceStatusCountByApi() this.$refs.deviceAlarmInfoRef.getDeviceAlarmInfoByApi() this.$refs.deviceDragLayoutRef.getDeviceListByApi() }, 1000 * 60) } }, // 保留两位小数 toDecimal2NoZero(x) { const f = Math.round(x * 100) / 100 src/views/mdc/base/modules/WorkshopSignage/DayUtilizationRateTrend.vue
@@ -37,7 +37,6 @@ this.chartContainer = this.$echarts.init(document.getElementById(this.chartContainerId)) signageApi.getDayUtilizationRateApi(this.currentProductionId) .then(res => { console.log('res==========', res) if (!res.success) return that.initChart(res.result) }) @@ -48,8 +47,10 @@ const option = { tooltip: { show: true, trigger: 'item', formatter: params => `${params.name}：${params.value}%` trigger: 'axis', formatter: function(params) { return '<span style="display:inline-block; width:10px; height:10px; border-radius:100px; margin-right:5px; background:' + params[0].color + '"></span> ' + params[0].name + '   ' + '<span style="font-weight: bold"> ' + params[0].value + '%' + '</span>' } }, legend: { show: false, src/views/mdc/base/modules/WorkshopSignage/DeviceAlarmInfo.vue
@@ -8,19 +8,24 @@ export default { name: 'DeviceAlarmInfo', components: {}, props: { currentProductionId: { type: String } }, data() { return { config: {} } }, mounted() { created() { if (!this.currentProductionId) return this.getDeviceAlarmInfoByApi() }, methods: { getDeviceAlarmInfoByApi() { const that = this that.initChart() signageApi.getWorkshopAlarmInfoApi() signageApi.getWorkshopAlarmInfoApi(that.currentProductionId) .then(res => { if (!res.success) return that.initChart(res.result) src/views/mdc/base/modules/WorkshopSignage/DeviceDragLayout.vue
@@ -42,7 +42,7 @@ <a-form layout="inline" v-has="'isCanDragAndResize'"> <a-form-item label="功能开关"> <a-switch checked-children="开" un-checked-children="关" v-model="isSwitchChecked" <a-switch checked-children="开" un-checked-children="关" v-model="isSwitchChecked" @change="handleSwitchChange" :disabled="isHasResizeOrDragDevice"/> </a-form-item> @@ -93,11 +93,17 @@ // 通过车间Id调用接口获取设备信息列表 getDeviceListByApi() { const that = this signageApi.getDeviceListInWorkshopSignagePageApi(that.currentProductionId).then((res) => { signageApi.getDeviceListInWorkshopSignagePageApi(that.currentProductionId) .then((res) => { if (res.success && res.result && res.result.length > 0) that.deviceList = res.result }) }, handleSwitchChange(checked) { console.log('checked--------', checked) this.$emit('handleTimeIntervalForShortOpen', checked) }, /** * 设备拖拽或缩放时触发事件 * @param newRect 拖拽或缩放后的尺寸及距离 src/views/mdc/base/modules/WorkshopSignage/MonthUtilizationRateTrend.vue
@@ -47,9 +47,6 @@ color: ['#538dd6', '#ffff01', '#0bae8d', '#e26c0a', '#F6E1BE', '#7030a0', '#0ad0bb', '#FF9297', '#A40035'], tooltip: { trigger: 'axis', textStyle: { fontSize: '60%' } }, legend: { //type:'scroll', @@ -72,7 +69,6 @@ containLabel: true }, 'dataZoom': [ { 'type': 'inside', 'show': true, src/views/mdc/base/modules/WorkshopSignage/WeekUtilizationRateTrend.vue
@@ -48,9 +48,6 @@ color: ['#538dd6', '#ffff01', '#0bae8d', '#e26c0a', '#F6E1BE', '#7030a0', '#0ad0bb', '#FF9297', '#A40035'], tooltip: { trigger: 'axis', textStyle: { fontSize: '60%' } }, legend: { //type:'scroll',
