| | |
| | | </a-table> |
| | | </div> |
| | | |
| | | <a-spin :spinning="echartLoading"> |
| | | <a-spin :spinning="eChartLoading"> |
| | | <div style="width: 100%;height: 100%;display: flex;"> |
| | | <div id="MdcEquipmentWarningPie" style="height: 100%;width: 35%;"></div> |
| | | <div id="MdcEquipmentWarningLine" style="height: 100%;width: 65%;"></div> |
| | |
| | | |
| | | <script> |
| | | import moment from 'moment' |
| | | import { putAction, getAction } from '@/api/manage' |
| | | import $ from 'jquery' |
| | | import '@/components/table2excel/table2excel' |
| | | import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api' |
| | | import { |
| | | JeecgListMixin |
| | | } from '@/mixins/JeecgListMixin' |
| | | import { getAction } from '@/api/manage' |
| | | import { ajaxGetDictItems, getDictItemsFromCache } from '@/api/api' |
| | | |
| | | const columns = [ |
| | | { title: '报警号', dataIndex: 'alarmCode', key: 'alarmCode', align: 'center' }, |
| | |
| | | ] |
| | | |
| | | export default { |
| | | // mixins: [JeecgListMixin], |
| | | name: 'alarmAnalysisMain', |
| | | components: {}, |
| | | data() { |
| | | return { |
| | | dataSource: [], |
| | | /* table加载状态 */ |
| | | outerDataLoading: false, |
| | | innerDataLoading: false, |
| | | echartLoading: false, |
| | | eChartLoading: false, |
| | | typeTree: '', |
| | | typeParent: 1, |
| | | typeEquipment: 1, |
| | | TreeIDOne: 1, |
| | | TreeIDTwo: 2, |
| | | deviceTypeDict: '', |
| | | dates: [], |
| | | identifying: [], |
| | | queryParam: {}, |
| | | queryParams: {}, |
| | | queryParamEquip: {}, |
| | | queryParamPeople: {}, |
| | | efficiencyOptions: [ |
| | | { label: '利用率', value: 'lyl' }, |
| | | { label: '开机率', value: 'kjl' }, |
| | | { label: '开机时间', value: 'kjsj' }, |
| | | { label: '加工时间', value: 'jgsj' }, |
| | | { label: '待机时间', value: 'djsj' }, |
| | | { label: '关机时间', value: 'gjsj' } |
| | | ], |
| | | checkedList: ['lyl'], |
| | | dataList: [], |
| | | url: { |
| | | efficiencyList: '/mdc/alarmAnalyze/alarmList', |
| | | listByType: '/mdc/MdcUtilizationRate/getByType', |
| | | alarmTrend: '/mdc/alarmAnalyze/alarmTrend', |
| | | equipmentAlarmList: '/mdc/alarmAnalyze/equipmentAlarmList' |
| | | }, |
| | | tableHeads: [], |
| | | pieDate: [0], |
| | | XData: [0], |
| | | YData: [0], |
| | | columns, |
| | | innerColumns, |
| | | hasRequsetAlarmCodeList: [] |
| | | hasRequestAlarmCodeList: [] |
| | | } |
| | | }, |
| | | props: { nodeTree: '', Type: '', nodePeople: '' }, |
| | |
| | | this.queryParam.endDate = moment(this.dates[1]).format('YYYYMMDD') |
| | | this.queryParam.typeTree = '1' |
| | | this.loadData1() |
| | | |
| | | }, |
| | | mounted() { |
| | | this.drawWrin() |
| | |
| | | } |
| | | }, |
| | | filters: { |
| | | numFilter(value) { |
| | | if (value) { |
| | | return parseFloat((value * 100).toFixed(2)) |
| | | } else { |
| | | return '0' |
| | | } |
| | | }, |
| | | |
| | | /** |
| | | * 格式化时间 |
| | | * @param seconds 秒数 |
| | |
| | | }, |
| | | TableDraw(key, val) { |
| | | let that = this |
| | | that.echartLoading = true |
| | | that.eChartLoading = true |
| | | that.queryParam.alarmCode = val.alarmCode |
| | | console.log(this.queryParam) |
| | | getAction(that.url.alarmTrend, that.queryParam) |
| | | .then(res => { |
| | | if (res.success) { |
| | |
| | | that.XData = res.result.dateCountList.map(item => item.key) |
| | | that.YData = res.result.dateCountList.map(item => item.count) |
| | | |
| | | // this.tableHeads = res.result.dates |
| | | // this.dataList = res.result |
| | | // this.draw() |
| | | // this.checkSameData(this.dataList) |
| | | // this.checkSameData1(this.dataList) |
| | | // this.checkSameData2(this.dataList) |
| | | // this.combineCell(); |
| | | // this.initDeviceType(this.dataList) |
| | | that.drawWrin() |
| | | } |
| | | }) |
| | | .finally(() => { |
| | | that.echartLoading = false |
| | | that.eChartLoading = false |
| | | }) |
| | | console.log(this.YData) |
| | | |
| | | }, |
| | | disabledDate(current) { |
| | |
| | | }, |
| | | loadData1() { |
| | | this.outerDataLoading = true |
| | | this.tableHeads = [] |
| | | this.dataList = [] |
| | | getAction(this.url.efficiencyList, this.queryParam).then(res => { |
| | | if (res.success) { |
| | | // this.tableHeads = res.result.dates |
| | | this.dataList = res.result |
| | | this.hasRequsetAlarmCodeList = [] |
| | | // this.draw() |
| | | // this.checkSameData(this.dataList) |
| | | // this.checkSameData1(this.dataList) |
| | | // this.checkSameData2(this.dataList) |
| | | // this.combineCell(); |
| | | // this.initDeviceType(this.dataList) |
| | | |
| | | this.hasRequestAlarmCodeList = [] |
| | | } |
| | | }).finally(() => { |
| | | this.outerDataLoading = false |
| | |
| | | }, |
| | | tooltip: { |
| | | trigger: 'item', |
| | | formatter: '<br/>{b} : {c} ({d}%)' |
| | | formatter: '{b} : {c} ({d}%)' |
| | | }, |
| | | calculable: true, |
| | | series: [{ |
| | | type: 'pie', |
| | | radius: '60%', |
| | | itemStyle: { |
| | | normal: { |
| | | color: function(params) { |
| | | var colorList = ['#5AB1EF', '#2EC7C9', '#B6A2DE', '#FFB980', '#D87A80', '#8D98B3'] |
| | | return colorList[params.dataIndex] |
| | | }, |
| | | label: { |
| | | show: true, |
| | | // position: 'top', |
| | | formatter: '{b}\n{c}', |
| | | color: 'inherit' |
| | | }, |
| | | itemStyle: { |
| | | color: function(params) { |
| | | var colorList = ['#5AB1EF', '#2EC7C9', '#B6A2DE', '#FFB980', '#D87A80', '#8D98B3'] |
| | | return colorList[params.dataIndex] |
| | | } |
| | | } |
| | | const colorList = ['#5AB1EF', '#2EC7C9', '#B6A2DE', '#FFB980', '#D87A80', '#8D98B3'] |
| | | return colorList[params.dataIndex % colorList.length] |
| | | } |
| | | }, |
| | | data: this.pieDate |
| | |
| | | let _this = this |
| | | // 当展开时若该行未被展开过才会请求后台数据,展开过的数据会被缓存无需重复请求 |
| | | this.queryParam.alarmCode = record.alarmCode |
| | | if (expanded && !this.hasRequsetAlarmCodeList.includes(record.alarmCode)) { |
| | | if (expanded && !this.hasRequestAlarmCodeList.includes(record.alarmCode)) { |
| | | this.innerDataLoading = true |
| | | getAction(this.url.equipmentAlarmList, this.queryParam).then(res => { |
| | | if (res.success) { |
| | |
| | | item.innerDataList = res.result |
| | | } |
| | | }) |
| | | _this.hasRequsetAlarmCodeList.push(record.alarmCode) |
| | | _this.hasRequestAlarmCodeList.push(record.alarmCode) |
| | | } |
| | | }) |
| | | .finally(() => { |