| | |
| | | this.getEfficiencyDataByApi() |
| | | this.getTechConditionAndWarrantyMalfunctionDataByApi() |
| | | this.getMonthMaintenanceNumByApi() |
| | | this.getTwoMaintenanceChartDataByApi() |
| | | this.getSecondMaintenanceChartDataByApi() |
| | | this.getBarChartDataByApi() |
| | | this.getDoubleBarChartDataByApi() |
| | | this.getWorkshopProblemChartDataByApi() |
| | |
| | | technologyStatus: 'QUALIFIED' |
| | | }, |
| | | { |
| | | value: res.result.jszt.length > 0 ? res.result.jszt.find(item => item.code === 'PROHIBITED').value : 0, |
| | | name: '禁用', |
| | | technologyStatus: 'PROHIBITED' |
| | | }, |
| | | { |
| | | value: res.result.jszt.length > 0 ? res.result.jszt.find(item => item.code === 'RESTRICTED').value : 0, |
| | | name: '限用', |
| | | technologyStatus: 'RESTRICTED' |
| | | }, |
| | | { |
| | | value: res.result.jszt.length > 0 ? res.result.jszt.find(item => item.code === 'PROHIBITED').value : 0, |
| | | name: '禁用', |
| | | technologyStatus: 'PROHIBITED' |
| | | } |
| | | ] |
| | | this.warrantyMalfunctionData = [ |
| | | { |
| | | value: res.result.bxqk.length > 0 ? res.result.bxqk.find(item => item.code === 'bx').value : 0, |
| | | name: '报修', |
| | | code: 'bx' |
| | | value: res.result.bxqk.length > 0 ? res.result.bxqk.find(item => item.code === 'run').value : 0, |
| | | name: '运行', |
| | | code: 'run' |
| | | }, |
| | | { |
| | | value: res.result.bxqk.length > 0 ? res.result.bxqk.find(item => item.code === 'stop').value : 0, |
| | |
| | | code: 'stop' |
| | | }, |
| | | { |
| | | value: res.result.bxqk.length > 0 ? res.result.bxqk.find(item => item.code === 'run').value : 0, |
| | | name: '运行', |
| | | code: 'run' |
| | | value: res.result.bxqk.length > 0 ? res.result.bxqk.find(item => item.code === 'bx').value : 0, |
| | | name: '报修', |
| | | code: 'bx' |
| | | } |
| | | ] |
| | | this.techConditionChartRequireFinished = true |
| | |
| | | }, |
| | | |
| | | /* 调用接口获取二保计划 */ |
| | | getTwoMaintenanceChartDataByApi() { |
| | | signageApi.getTwoMaintenancePlanListApi(this.productionCode) |
| | | getSecondMaintenanceChartDataByApi() { |
| | | signageApi.getSecondMaintenancePlanListApi(this.productionCode) |
| | | .then(res => { |
| | | if (res.success && res.result.length > 0) this.twoMaintenanceChartData = res.result.map(item => [item.factoryName, item.monthPlan, '二级保养']) |
| | | this.drawMaintenanceChart() |
| | |
| | | itemGap: 15, |
| | | textStyle: { |
| | | color: 'rgba(0,0,0,.45)', |
| | | fontSize: 14, |
| | | padding: [0, 0, 0, 0] |
| | | fontSize: 14 |
| | | }, |
| | | data: ['关机', '报警', '待机', '运行'] |
| | | data: ['运行', '待机', '报警', '关机'] |
| | | }, |
| | | grid: { |
| | | containLabel: true |
| | |
| | | top: 25, |
| | | orient: 'vertical', |
| | | right: 0, |
| | | // bottom: "0", |
| | | itemWidth: 14, |
| | | itemHeight: 14, |
| | | icon: 'roundRect', |
| | |
| | | fontSize: 14, |
| | | padding: [0, 0, 0, 0] |
| | | }, |
| | | data: ['合格', '禁用', '限用'] |
| | | data: ['合格', '限用', '禁用'] |
| | | }, |
| | | grid: { |
| | | containLabel: true |
| | |
| | | const option = { |
| | | color: ['#1890FF', '#2EC35C'], |
| | | tooltip: { |
| | | confine: true, |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'shadow' |
| | | }, |
| | | formatter: function(params) { |
| | | return '<span style="font-weight:bolder;">' + params.name + '</span><br/>' + |
| | | '<span style="display:inline-block; width:10px; height:10px; border-radius:100px; margin-right:5px; background:' + params.color + '"></span>' + params.seriesName + ' : ' + params.value + '%' |
| | | let result = '' |
| | | params.forEach((item, index) => { |
| | | let dom = `<span style="display:inline-block;width:10px;height:10px;border-radius:100px;margin-right:5px;background:${item.color}"></span>${item.seriesName}:${item.value}%` |
| | | if (index === 0) { |
| | | result = `<span style="font-weight:bolder;">${item.name}</span>` |
| | | } |
| | | result += '<br />' + dom |
| | | }) |
| | | return result |
| | | } |
| | | }, |
| | | grid: { |
| | |
| | | |
| | | <style lang="less" scoped> |
| | | .page-container { |
| | | .page-title { |
| | | display: flex; |
| | | justify-content: space-evenly; |
| | | flex-wrap: wrap; |
| | | color: #fff; |
| | | margin-bottom: 10px; |
| | | |
| | | } |
| | | |
| | | .content-container { |
| | | padding-top: 5px; |
| | | display: flex; |