jiangping
2025-04-22 9fa82e0217d54a38dd1546094d8d15cb43e827b0
admin/src/views/index.vue
@@ -72,7 +72,17 @@
          <div class="df mb50" >
            <div class="wrap static1">
              <div class="header" style="text-align: center">
                <div class="home_title"  style="text-align: center;width: 100%">各类型工单占比统计</div>
                <div class="home_title"  style="text-align: center;width: 80%">各类型工单占比统计({{searchForm.timeName}})</div>
                <div style="text-align: right;width: 150px;font-size: 12px;height: 25px">
                  <el-form   :model="searchForm" label-width="100px" inline >
                      <el-select v-model="searchForm.timeType"  :popper-append-to-body="true" clearable   placeholder="时间范围"   @change="reloadDataByType()">
                        <el-option value="0" label="本周"/>
                        <el-option value="1" label="本月"/>
                        <el-option value="2" label="本季度"/>
                        <el-option value="3" label="本年"/>
                      </el-select>
                  </el-form>
                </div>
              </div>
              <div class="echart"  style="height: 400px" >
                <div  id="circleChart0"></div>
@@ -135,10 +145,15 @@
  },
  data () {
    return {
      searchForm: {
        timeType: null,
        timeName: '全部'
      },
      colors,
      nowDate: '',
      nowWeek: '',
      headerData: {},
      headerData1: {},
      staticData0: {},
      staticData01: {},
      staticData1: {},
@@ -169,6 +184,23 @@
      this.getWorkBody2()
      this.getWorkBody3()
      // this.getWorkBody()
    },
    reloadDataByType () {
      getIndexData({timeType: this.searchForm.timeType }).then(res => {
        if (this.searchForm.timeType == '0') {
          this.searchForm.timeName = '本周'
        } else if (this.searchForm.timeType =='1') {
          this.searchForm.timeName = '本月'
        } else if (this.searchForm.timeType =='2') {
          this.searchForm.timeName = '本季度'
        } else if (this.searchForm.timeType == '3') {
          this.searchForm.timeName = '本年'
        } else {
          this.searchForm.timeName = '全部'
        }
        this.headerData1 =res || []
        this.initAllData()
      })
    },
    getWorkBody0 () {
      getWorkOrderData({ queryType: 0, orderType: 0 }).then(res => {
@@ -213,18 +245,22 @@
    getWorkHead () {
      getIndexData({ }).then(res => {
        this.headerData = res || {}
        var cdata = []
        cdata.push({ name: '跌绊滑事件', value: res.dbhNum || 0 })
        cdata.push({ name: 'DCA事件', value: res.dcaChildNum || 0 })
        cdata.push({ name: 'SHE事件', value: res.sheNum || 0 })
        this.initEchartCircleDo('circleChart0', '各类型事件工单上报统计', '', cdata)
        var xdata = ['SHE事件', '跌绊滑事件', 'DCA事件']
        var ydata = []
        ydata.push({ name: '已解决', stack: 'cateNum', type: 'bar', unit: '项', color: '#f07e6f', data: [res.sheNum || 0, res.dbhYesNum || 0, res.dcaChildYesNum || 0] })
        ydata.push({ name: '未解决', stack: 'cateNum', type: 'bar', unit: '项', color: '#8383ff', data: [0, res.dbhNoNum || 0, res.dcaChildNoNum || 0] })
        ydata.push({ name: '总单量', type: 'bar', unit: '次', color: '#29aeff', data: [res.sheNum || 0, res.dbhNum || 0, res.dcaChildNum || 0] })
        this.initEchartDataDo('各类型事件状态统计', 'circleChart1', xdata, ydata)
        this.headerData1 = res || {}
        this.initAllData()
      })
    },
    initAllData(){
      var cdata = []
      cdata.push({ name: '跌绊滑事件', value: this.headerData1.dbhNum || 0 })
      cdata.push({ name: 'DCA事件', value: this.headerData1.dcaChildNum || 0 })
      cdata.push({ name: 'SHE事件', value: this.headerData1.sheNum || 0 })
      this.initEchartCircleDo('circleChart0', '各类型事件工单上报统计', '', cdata)
      var xdata = ['SHE事件', '跌绊滑事件', 'DCA事件']
      var ydata = []
      ydata.push({ name: '已解决', stack: 'cateNum', type: 'bar', unit: '项', color: '#f07e6f', data: [this.headerData1.sheNum || 0, this.headerData1.dbhYesNum || 0, this.headerData1.dcaChildYesNum || 0] })
      ydata.push({ name: '未解决', stack: 'cateNum', type: 'bar', unit: '项', color: '#8383ff', data: [0, this.headerData1.dbhNoNum || 0, this.headerData1.dcaChildNoNum || 0] })
      ydata.push({ name: '总单量', type: 'bar', unit: '次', color: '#29aeff', data: [this.headerData1.sheNum || 0, this.headerData1.dbhNum || 0, this.headerData1.dcaChildNum || 0] })
      this.initEchartDataDo('各类型事件状态统计', 'circleChart1', xdata, ydata)
    },
    updateDate () {
      this.nowDate = dayjs().format('YYYY年M月D日')
@@ -477,6 +513,11 @@
</script>
<style lang="scss" scoped>
::v-deep .el-input--small .el-input__inner {
  height: 30px !important; // 这里就是修改默认高度
  width: 120px;
}
div {
  box-sizing: border-box;
}