修改了证书及时率

pages/meter-statistics/certificate-rate/ReportTimelyPie.vue

+<template>
+  <div class="border-chart-color">
+    <div class="chartTitle">
+      <label>报告及时率统计</label>
+    </div>
+    <Form id="report-timely-pie">
+      <input name="beginDate" type="hidden">
+      <input name="endDate" type="hidden">
+      <input name="warningDate" type="hidden">
+    </Form>
+    <div :style="heightObj" class="chartCont">
+      <div style="width:90%">
+        <IEcharts :option="option" :style="optionObj" @click="_pieClick"></IEcharts>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      name: 'A',
+      heightObj: {
+        height: '300px'
+      },
+      option: {
+        tooltip: {
+          trigger: 'item',
+          formatter: function(a) {
+            return (
+              a.name +
+              '</br>样品量: ' +
+              a.data.value +
+              '<br>占比: ' +
+              a.percent +
+              '%'
+            )
+          }
+        },
+        legend: {
+          type: 'scroll',
+          orient: 'vertical',
+          right: 0,
+          top: 20,
+          bottom: 20,
+          data: []
+        },
+        color: this.$echartColor,
+        series: [
+          {
+            name: '及时率',
+            type: 'pie',
+            radius: ['30%', '65%'],
+            center: ['40%', '50%'],
+            data: [
+              { value: 335, name: '直接访问' },
+              { value: 310, name: '邮件营销' },
+              { value: 234, name: '联盟广告' },
+              { value: 135, name: '视频广告' },
+              { value: 1548, name: '搜索引擎' }
+            ],
+            avoidLabelOverlap: false,
+            label: {
+              normal: {
+                show: false,
+                position: 'center'
+              },
+              emphasis: {
+                show: true,
+                textStyle: {
+                  fontSize: '30',
+                  fontWeight: 'bold'
+                }
+              }
+            },
+            labelLine: {
+              normal: {
+                show: false
+              }
+            }
+          }
+        ]
+      },
+      optionObj: {
+        height: ''
+      },
+      pageParams: {},
+      pie: [],
+      timeWrning: []
+    }
+  },
+  mounted() {
+    this._contHide()
+  },
+  methods: {
+    _contHide() {
+      this.optionObj.height = document.documentElement.clientHeight - 300 + 'px'
+      this.heightObj.height = document.documentElement.clientHeight - 272 + 'px'
+      this.optionObj.width =
+        (document.documentElement.clientWidth - 200) / 2.6 + 'px'
+    },
+    _openPie(data) {
+      $('input[name="warningDate"]').val(data.warningDate)
+      $('input[name="beginDate"]').val(data.beginDate)
+      $('input[name="endDate"]').val(data.endDate)
+      // this._page()
+    },
+    _searchPie(data) {
+      $('input[name="beginDate"]').val(data.beginDate)
+      $('input[name="endDate"]').val(data.endDate)
+      // this._page()
+    },
+    _page() {
+      this.$store
+        .dispatch('FoodSample/listPromptnessPie', this._searchParams())
+        .then(() => {
+          this.pie = this.$store.state.FoodSample.list
+          this.option.series[0].data = []
+          this.option.legend.data = []
+          for (let i = 0; i < this.pie.length; i++) {
+            this.option.series[0].data.push({
+              name: this.pie[i].type,
+              value: this.pie[i].total
+            })
+            this.option.legend.data.push(this.pie[i].type)
+          }
+        })
+    },
+    _searchParams() {
+      const data = this.$serialize('report-timely-pie')
+      return this.$extend(data, this.pageParams)
+    },
+    _pieClick(res) {
+      this.$emit('on-result-change', res.data.name)
+    }
+  }
+}
+</script>

pages/meter-statistics/certificate-rate/ReportTimelyTable.vue

+<template>
+  <div>
+    <Form id="pie-search-form">
+      <input name="beginDate" type="hidden">
+      <input name="endDate" type="hidden">
+      <input name="warningDate" type="hidden">
+      <input name="type" type="hidden">
+    </Form>
+    <PTVXETable id="reportTimelyTable" ref="pageTable" :pageColumns="pageColumns"
+                :tableHeight="tableHeight" @on-result-change="_tableResultChange" :getPage="getPage" select-data>
+      <vxe-table-column
+        :field="item.key"
+        :title="item.title"
+        :min-width="item.width?item.width:200"
+        :fixed="item.fixed?item.fixed:undefined"
+        v-for="item in pageColumns"
+        :key="item.key" sortable>
+        <template slot-scope="scope">
+          <span v-if="item.date">{{scope.row[item.key]?$dateformat(scope.row[item.key],'yyyy-mm-dd'):''}}</span>
+          <span v-else>{{scope.row[item.key]}}</span>
+        </template>
+      </vxe-table-column>
+    </PTVXETable>
+  </div>
+</template>
+
+<script>
+import { meterContract } from '../../../api'
+export default {
+  data() {
+    return {
+      loading: true,
+      formObj: {
+        client: undefined
+      },
+      pageColumns: [
+        { title: '样品编号', key: 'sampleNum', width: 180 },
+        { title: '委托单位', key: 'client' },
+        { title: '委托编号', key: 'contractCode', width: 180 },
+        { title: '应出报告日期', key: 'dueDate', width: 120, date: true },
+        { title: '签发日期', key: 'issueDate', width: 120, date: true },
+        { title: '报告超期原因', key: 'reason' }
+      ],
+      getPage: {},
+      selectData: []
+    }
+  },
+  computed: {
+    tableHeight: function() {
+      return this.$tableHeight('', 230)
+    }
+  },
+  mounted() {
+    this._page()
+  },
+  methods: {
+    // 日期变化时，将时间赋值，导出根据查询条件
+    _changeDate(data) {
+      $('input[name=beginDate]').val(data.beginDate)
+      $('input[name=endDate]').val(data.endDate)
+      $('input[name=type]').val('')
+    },
+    _openTable(data) {
+      $('input[name=beginDate]').val(data.beginDate)
+      $('input[name=endDate]').val(data.endDate)
+      $('input[name=warningDate]').val(data.warningDate)
+      $('input[name=type]').val('')
+      this._page()
+    },
+    _searchTable(data) {
+      $('input[name=beginDate]').val(data.beginDate)
+      $('input[name=endDate]').val(data.endDate)
+      $('input[name=type]').val('')
+      this._page()
+    },
+    _pieOpen(res) {
+      $('input[name=type]').val(res)
+
+      // this._page()
+    },
+    // _page() {
+    //   this.$refs.pageTable._page('pie-search-form', 'FoodSample/reportTimely')
+    // },
+    _page: async function() {
+      Object.assign(this.formObj, this.$refs.pageTable._searchParams())
+      const result = await meterContract.page(this.formObj)
+      if (result) {
+        this.$refs.pageTable._hideLoading()
+        this.getPage = result
+        console.log('请求结果为', result)
+      }
+    },
+    _tableResultChange(msg, data) {
+      switch (msg) {
+        case 'page':
+          this.getPage = this.$store.state.FoodSample.page
+          break
+        case 'selectData':
+          this.selectData = data
+          break
+        case 'changeSize':
+          this._page()
+          break
+      }
+    },
+    /** *********************************导出-begin*********************************************/
+    _exportSampleForm() {
+      let result = []
+      if (this.selectData.length === 0) {
+        // 导出全部数据
+        this.$Modal.confirm({
+          title: '提示',
+          content:
+            this.selectData.length === 0
+              ? '确定导出全部数据？'
+              : '确定导出这' + result.length + ' 条数据？',
+          onOk: () => {
+            this.$store
+              .dispatch('FoodSample/reportTimely', this._searchParams())
+              .then(() => {
+                result = this.$store.state.FoodSample.page.records
+                this.$exportExcel(
+                  'reportTimelyTable',
+                  '报告及时率统计表',
+                  this.pageColumns,
+                  result
+                )
+              })
+          }
+        })
+      } else {
+        // 只导出选中的数据
+        result = this.selectData
+        this.$Modal.confirm({
+          title: '提示',
+          content:
+            this.selectData.length === 0
+              ? '确定导出全部数据？'
+              : '确定导出这' + result.length + ' 条数据？',
+          onOk: () => {
+            this.$exportExcel(
+              'reportTimelyTable',
+              '报告及时率统计表',
+              this.pageColumns,
+              result
+            )
+          }
+        })
+      }
+    },
+    // 参数
+    _searchParams() {
+      const data = this.$serialize('pie-search-form')
+      return this.$extend(data, { page: 1, rows: 5000 })
+    }
+    /** *********************************导出样品台账-end*********************************************/
+  }
+}
+</script>