Merge remote-tracking branch 'origin/dev' into dev

pages/meter-entrust/entrust-register/EntrustRegister.vue

@@ -48,6 +48,7 @@
       </div>
     </div>
     <FileManage ref="FileManage"></FileManage>
+    <importModal ref="importModal" @on-result-change="_page"></importModal>
     <Operation ref="operationModal"></Operation>
     <EntrustRegisterEdit ref="editModal" @on-result-change="_formSearch"></EntrustRegisterEdit>
     <SoilSampleManage ref="sampleManageModal" @on-result-change="_page"></SoilSampleManage>
@@ -58,9 +59,10 @@ import { soilEntrust } from '../../../api'
 import http from '../../../api/http'
 import Operation from '../../../components/operation/Operation'
 import SoilSampleManage from '../SoilSampleManage'
+import importModal from '../../../components/import/DownloadTemplateImport'
 import EntrustRegisterEdit from './EntrustRegisterEdit'
 export default {
-  components: { Operation, EntrustRegisterEdit, SoilSampleManage },
+  components: { Operation, EntrustRegisterEdit, SoilSampleManage, importModal },
   data() {
     return {
       currentComponent: '',
@@ -166,6 +168,9 @@ export default {
       this.currentComponent = componentName
       this.$nextTick(function() {
         switch (msg) {
+          case '试验委托单导入':
+            this._import()
+            break
           case '添加':
             this._editModal(false)
             break
@@ -181,6 +186,14 @@ export default {
         }
       })
     },
+    _import() {
+      const data = {
+        importUrl: '/soil/v1/entrust/import_entrust/',
+        downloadUrl: '/meter/v1/excel/template/MeterAptitudeImport',
+        title: '试验委托单导入'
+      }
+      this.$refs.importModal._open(data, '试验委托单导入')
+    },
     _iconClick(res, data, componentName) {
       this.currentComponent = componentName
       this.$nextTick(function() {

pages/workbench/ContractEndNum.vue

+<template>
+  <div>
+    <Card style="width:100%;">
+      <div class="config_meta">
+        <p class="fl">委托完成额占比</p>
+        <div class="fr">
+          <Tooltip content="刷新" placement="left-start">
+            <Icon @click="_request" type="ios-refresh" size="30" color="#2d8cf0" style="cursor:pointer;"></Icon>
+          </Tooltip>
+        </div>
+        <div class="clear"></div>
+      </div>
+      <Row>
+        <Col span="24" style="margin-bottom: 10px">
+        制单日期：
+        <DatePicker v-model="beginMonth" :editable="false" @on-change="_request" type="month"
+                    style="width:90px"></DatePicker>
+        <label class="line-color">——</label>
+        <DatePicker v-model="endMonth" :editable="false" @on-change="_request" type="month"
+                    style="width:90px"></DatePicker>
+        </Col>
+        <Col span="24">
+        <div v-show="showStatistic" style="width:100%">
+        <IEcharts :option="option" @ready="_onReady" :style="{width}"
+                  style="height:238px"></IEcharts>
+        </div>
+        <div v-show="!showStatistic" class="no-statistic-bg"></div>
+        </Col>
+      </Row>
+    </Card>
+  </div>
+</template>
+
+<script>
+// import IEcharts from 'vue-echarts-v3/src/full.js'
+
+export default {
+  components: {},
+  data() {
+    return {
+      width: '',
+      beginMonth: new Date(),
+      endMonth: new Date(),
+      option: {
+        color: this.$echartColor,
+        tooltip: {
+          trigger: 'item',
+          formatter: '{b} : {c} ({d}%)'
+        },
+        legend: {
+          left: 'center',
+          top: 10,
+          data: ['未完成委托额', '已完成委托额']
+        },
+        series: [
+          {
+            name: '委托完成额',
+            type: 'pie',
+            radius: '55%',
+            center: ['50%', '60%'],
+            data: [
+              { value: 335, name: '未完成委托额' },
+              { value: 310, name: '已完成委托额' }
+            ],
+            itemStyle: {
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      },
+      showStatistic: true
+    }
+  },
+  mounted() {
+    this.width = (document.documentElement.clientWidth - 280) / 2 + 'px'
+    // this._request()
+  },
+
+  methods: {
+    _request() {
+      this.showStatistic = false
+      const data = {}
+      data.beginMonth = this.$dateformat(this.beginMonth, 'yyyy-mm')
+      data.endMonth = this.$dateformat(this.endMonth, 'yyyy-mm')
+      this.$store.dispatch('FoodContract/contractEndNum', data).then(() => {
+        const result = this.$store.state.FoodContract.model
+        const series = []
+        if (result !== undefined) {
+          series.push({ value: result.contractAmount, name: '已完成委托额' })
+          series.push({ value: result.noContractAmount, name: '未完成委托额' })
+        }
+        this.option.series[0].data = series
+        if (series.length === 0) {
+          this.showStatistic = false
+        } else {
+          this.showStatistic = true
+        }
+      })
+    },
+    _onReady() {
+      // this._request();
+    }
+  }
+}
+</script>

pages/workbench/CustomerContract.vue

+<template>
+  <div>
+    <Card style="width:100%;">
+      <div class="config_meta">
+        <p class="fl" style="margin-bottom: 10px;">客户委托分析</p>
+        <div class="fr">
+          <Tooltip content="刷新" placement="left-start">
+            <Icon @click="_request" type="ios-refresh" size="30" color="#2d8cf0" style="cursor:pointer;"></Icon>
+          </Tooltip>
+        </div>
+        <div class="clear"></div>
+      </div>
+      <Row>
+        <Col span="24" style="margin-bottom: 10px">
+          制单日期：
+          <Date-picker @on-change="_ctimeChange" v-model="dateList" type="daterange" split-panels
+                       style="width:200px" placeholder="请选择日期"></Date-picker>
+        </Col>
+        <Col span="24">
+          <div v-show="showStatistic" style="width:100%">
+            <!--饼图-->
+            <IEcharts :option="option" :style="{width}" @click="_detail" style="height: 242px"></IEcharts>
+          </div>
+          <div v-show="!showStatistic" class="no-statistic-bg"></div>
+        </Col>
+      </Row>
+    </Card>
+    <!--委托详情-->
+  </div>
+</template>
+<script>
+export default {
+  components: {},
+  data() {
+    return {
+      width: '',
+      option: {
+        title: {
+          x: 'center',
+          textStyle: {
+            fontSize: 18,
+            fontWeight: 'normal'
+          }
+        },
+        tooltip: {
+          trigger: 'item',
+          formatter: function(a) {
+            return (
+              a.name +
+              '</br>委托量: ' +
+              a.data.total +
+              '<br>占比: ' +
+              a.percent +
+              '%'
+            )
+          }
+        },
+        legend: {
+          orient: 'horizontal',
+          y: 'bottom',
+          data: ['已开完发票']
+        },
+        color: this.$echartColor,
+        series: [
+          {
+            name: '',
+            type: 'pie',
+            radius: ['40%', '70%'],
+            center: ['50%', '50%'],
+            data: [{ value: 335, name: '已开完发票' }],
+            label: {
+              normal: {
+                show: false
+              }
+            },
+            labelLine: {
+              normal: {
+                show: false
+              }
+            }
+          }
+        ]
+      },
+      tempData: {
+        signDateBegin: '',
+        signDateEnd: ''
+      },
+      dateList: [],
+      showStatistic: true
+    }
+  },
+  mounted() {
+    this.width = (document.documentElement.clientWidth - 300) / 2 + 'px'
+    const newDate = new Date()
+    const year = newDate.getFullYear()
+    let month = newDate.getMonth() + 1
+    if (month < 10) {
+      month = '0' + month
+    }
+    const firstdate = year + '-' + month + '-01'
+    this.dateList = [new Date(firstdate), new Date()]
+    this.tempData.signDateBegin = firstdate
+    this.tempData.signDateEnd = this.$dateformat(newDate, 'yyyy-mm-dd')
+    // this._getPie()
+  },
+  methods: {
+    _request() {
+      this._getPie()
+    },
+    // 日期
+    _ctimeChange(data) {
+      this.tempData.signDateBegin = data[0]
+      this.tempData.signDateEnd = data[1]
+      this._getPie()
+    },
+    _getPie() {
+      this.showStatistic = false
+      const testerList = []
+      const seriesList = []
+      let total = 0
+      this.$store
+        .dispatch(
+          'FoodContract/contractAnalysis',
+          this.$serializeFormSearch(this.tempData)
+        )
+        .then(() => {
+          const result = this.$store.state.FoodContract.list
+          if (result !== undefined) {
+            for (let i = 0; i < result.length; i++) {
+              testerList.push(
+                result[i].billType === undefined ? '' : result[i].billType
+              )
+              total = total + result[i].total
+              seriesList.push({
+                value: result[i].total,
+                name:
+                  result[i].billType === undefined ? '' : result[i].billType,
+                total: result[i].total
+              })
+            }
+            if (testerList.length === 0) {
+              this.showStatistic = false
+            } else {
+              this.showStatistic = true
+            }
+          }
+          this.option.title.text = ' 委托量总计(份): ' + total
+          this.option.legend.data = testerList
+          this.option.series[0].data = seriesList
+        })
+    },
+    // 查看委托详情
+    _detail(data) {
+      const temp = {
+        signDateBegin: this.tempData.signDateBegin,
+        signDateEnd: this.tempData.signDateEnd
+      }
+      this.$refs.detectTypeDetail._open(data.name, temp)
+    }
+  }
+}
+</script>

pages/workbench/DetectTypeNum.vue

+<template>
+  <div>
+    <Card style="width:100%;">
+      <div class="config_meta">
+        <p class="fl">检测类型委托统计</p>
+        <div class="fr">
+          <Tooltip content="刷新" placement="left-start">
+            <Icon @click="_request" type="ios-refresh" size="30" color="#2d8cf0" style="cursor:pointer;"></Icon>
+          </Tooltip>
+        </div>
+        <div class="clear"></div>
+      </div>
+      <Row>
+        <Col span="24" style="margin-bottom: 10px">
+          制单日期：
+          <Date-picker @on-change="_ctimeChange" v-model="dateList" type="daterange" split-panels
+                       style="width:200px" placeholder="请选择日期"></Date-picker>
+        </Col>
+        <Col span="24">
+          <div v-show="showStatistic" style="width:100%">
+            <!--饼图-->
+            <IEcharts :option="option" :style="{width}" @click="_detail" style="height: 238px"></IEcharts>
+          </div>
+          <div v-show="!showStatistic" style="height: 238px;text-align: center;" class="no-statistic-bg"><p style="position: relative;top: 100px;">暂无数据</p></div>
+        </Col>
+      </Row>
+    </Card>
+    <!--委托详情-->
+<!--    <DetectTypeContractDetail ref="detectTypeDetail"></DetectTypeContractDetail>-->
+  </div>
+</template>
+<script>
+// import IEcharts from 'vue-echarts-v3/src/full.js'
+// import DetectTypeContractDetail from '../../lims/food-test/envAnalysisManage/detect-type/ContractDetail'
+
+export default {
+  components: {},
+  data() {
+    return {
+      width: '',
+      option: {
+        title: {
+          x: 'center',
+          textStyle: {
+            fontSize: 18,
+            fontWeight: 'normal'
+          }
+        },
+        tooltip: {
+          trigger: 'item',
+          formatter: function(a) {
+            return (
+              a.name +
+              '</br>额度: ' +
+              a.data.total +
+              '<br>占比: ' +
+              a.percent +
+              '%'
+            )
+          }
+        },
+        legend: {
+          orient: 'horizontal',
+          y: 'bottom',
+          data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎']
+        },
+        color: this.$echartColor,
+        series: [
+          {
+            name: '',
+            type: 'pie',
+            radius: ['40%', '70%'],
+            center: ['50%', '50%'],
+            data: [
+              { value: 335, name: '直接访问' },
+              { value: 310, name: '邮件营销' },
+              { value: 234, name: '联盟广告' },
+              { value: 135, name: '视频广告' },
+              { value: 1548, name: '搜索引擎' }
+            ],
+            label: {
+              normal: {
+                show: false
+              }
+            },
+            labelLine: {
+              normal: {
+                show: false
+              }
+            }
+          }
+        ]
+      },
+      tempData: {
+        ctimeBegin: '',
+        ctimeEnd: ''
+      },
+      dateList: [],
+      showStatistic: true
+    }
+  },
+  mounted() {
+    this.width = (document.documentElement.clientWidth - 300) / 2 + 'px'
+    const newDate = new Date()
+    const year = newDate.getFullYear()
+    let month = newDate.getMonth() + 1
+    if (month < 10) {
+      month = '0' + month
+    }
+    const firstdate = year + '-' + month + '-01'
+    this.dateList = [new Date(firstdate), new Date()]
+    this.tempData.ctimeBegin = firstdate
+    this.tempData.ctimeEnd = this.$dateformat(newDate, 'yyyy-mm-dd')
+    // this._getPie()
+  },
+  methods: {
+    _request() {
+      this._getPie()
+    },
+    // 日期
+    _ctimeChange(data) {
+      this.tempData.ctimeBegin = data[0]
+      this.tempData.ctimeEnd = data[1]
+      this._getPie()
+    },
+    _getPie() {
+      this.showStatistic = false
+      const detectList = []
+      const seriesList = []
+      let total = 0
+      this.$store
+        .dispatch(
+          'StatisticContract/detectTypeList',
+          this.$serializeFormSearch(this.tempData)
+        )
+        .then(() => {
+          const result = this.$store.state.StatisticContract.list
+          for (let i = 0; i < result.length; i++) {
+            detectList.push(
+              result[i].detectType === undefined ? '' : result[i].detectType
+            )
+            total = total + result[i].contractAmount
+            seriesList.push({
+              value: result[i].contractAmount,
+              name:
+                result[i].detectType === undefined ? '' : result[i].detectType,
+              total: result[i].contractAmount
+            })
+            if (detectList.length === 0) {
+              this.showStatistic = false
+            } else {
+              this.showStatistic = true
+            }
+          }
+          this.option.title.text = ' 委托总额(元): ' + total
+          this.option.legend.data = detectList
+          this.option.series[0].data = seriesList
+        })
+    },
+    // 查看委托详情
+    _detail(data) {
+      const temp = {
+        queryDateBegin: this.tempData.ctimeBegin,
+        queryDateEnd: this.tempData.ctimeEnd
+      }
+      this.$refs.detectTypeDetail._open(data.name, temp)
+    }
+  }
+}
+</script>

pages/workbench/GroupItem.vue

+<template>
+  <div>
+    <Card style="width:100%;">
+      <div class="config_meta">
+        <p style="margin-bottom: 10px;">科室检测项目统计</p>
+      </div>
+      <Row>
+        <!--查询条件-->
+        <Col span="24">
+          <Form id="search-form" :label-width="70" inline onsubmit="return false">
+            <Form-item label="检测科室:">
+              <Select v-model="formObj.groupId" name="groupId" style="width:150px" placeholder="请选择检测科室">
+                <Option v-for="item in groupData" :value="item.id" :key="item.id">{{item.name}}</Option>
+              </Select>
+            </Form-item>
+            <Form-item label="日期:">
+              <DatePicker v-model="formObj.date" :editable="false" @on-change="_dateChange" type="year"
+                          style="width:90px"></DatePicker>
+            </Form-item>
+            <Form-item class="search-btn">
+              <Button @click="_search" type="primary">搜索</Button>
+            </Form-item>
+          </Form>
+        </Col>
+        <!--内容-->
+        <Col span="24" style="margin-bottom: -11px">
+          <GroupItemBar ref="barModal"></GroupItemBar>
+        </Col>
+      </Row>
+    </Card>
+  </div>
+</template>
+<script>
+import GroupItemBar from './GroupItemBar'
+
+export default {
+  components: {
+    GroupItemBar
+  },
+  data() {
+    return {
+      formObj: {
+        date: new Date(),
+        groupId: ''
+      },
+      groupData: []
+    }
+  },
+  mounted() {
+    // this._getEquipList()
+  },
+  methods: {
+    // 检测科室
+    _getEquipList() {
+      this.$store.dispatch('LmsUserGroup/list').then(() => {
+        this.groupData = this.$store.state.LmsUserGroup.list
+        this.formObj.groupId = this.groupData[0].id
+        this.formObj.groupName = this.groupData[0].name
+        this.$nextTick(function() {
+          this.$refs.barModal._openBar(this.formObj)
+        })
+      })
+    },
+    _dateChange(data) {
+      this.$refs.barModal._openBar(this.formObj)
+    },
+    _search() {
+      this.$refs.barModal._openBar(this.formObj)
+    }
+  }
+}
+</script>

pages/workbench/GroupItemBar.vue

+<template>
+  <!--<div class="chartCont">-->
+    <div style="width:90%">
+      <IEcharts :option="option" style="width:100%;height: 238px"></IEcharts>
+    </div>
+  <!--</div>-->
+</template>
+
+<script>
+export default {
+  components: {},
+  data() {
+    return {
+      option: {
+        color: this.$echartColor,
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'cross',
+            crossStyle: {
+              color: '#999'
+            }
+          }
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true,
+          x: 130
+        },
+        legend: {
+          data: ['检测量']
+        },
+        xAxis: [
+          {
+            type: 'category',
+            data: [],
+            axisPointer: {
+              type: ''
+            },
+            axisLine: {
+              lineStyle: {
+                color: 'gray'
+              }
+            },
+            splitLine: { show: false }
+          }
+        ],
+        yAxis: [
+          {
+            type: 'value',
+            name: '检测量',
+            min: 0,
+            axisLabel: {
+              formatter: '{value}'
+            },
+            axisLine: {
+              lineStyle: {
+                color: 'gray'
+              }
+            },
+            splitLine: { show: false }
+          }
+        ],
+        series: [
+          {
+            name: '检测量',
+            type: 'bar',
+            data: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120]
+          }
+        ]
+      },
+
+      year: ''
+    }
+  },
+  methods: {
+    _openBar(obj) {
+      this.year = obj.date.getFullYear()
+      this.groupId = obj.groupId
+      this.option.xAxis[0].data = []
+      for (let i = 1; i < 13; i++) {
+        if (i < 10) {
+          this.option.xAxis[0].data.push(this.year + '-0' + i)
+        } else {
+          this.option.xAxis[0].data.push(this.year + '-' + i)
+        }
+      }
+      this.$store
+        .dispatch('FoodContract/groupYearNum', {
+          year: this.year,
+          groupId: this.groupId
+        })
+        .then(() => {
+          const result = this.$store.state.FoodContract.page
+          this.option.series[0].data = []
+          for (let j = 0; j < result.length; j++) {
+            for (let k = 0; k < this.option.xAxis[0].data.length; k++) {
+              if (result[j].testMonth === this.option.xAxis[0].data[k]) {
+                this.option.series[0].data[k] = result[j].testCount
+              }
+            }
+          }
+        })
+    }
+  }
+}
+</script>

pages/workbench/UnfinishedContract.vue

+<template>
+  <div>
+    <Card style="width:100%">
+      <div class="config_meta">
+        <p class="fl">待完成委托 {{total}} </p>
+        <div class="fr">
+          <Tooltip content="刷新" placement="left-start">
+            <Icon @click="_request" type="ios-refresh" size="30" color="#2d8cf0" style="cursor:pointer;"></Icon>
+          </Tooltip>
+          <Tooltip content="查看更多" placement="left-start" style="margin-left: 5px">
+            <Icon @click="_detail" type="ios-more" size="30" color="#2d8cf0" style="cursor:pointer;"></Icon>
+          </Tooltip>
+        </div>
+        <div class="clear"></div>
+      </div>
+      <div style="width: 100%;">
+        <element-table ref="pageTable" :pageColumns="pageColumns"
+                       :tableHeight="tableHeight" :getPage="tableData" hide-checkbox>
+          <el-table-column
+            :prop="item.key"
+            :label="item.title"
+            :min-width="item.width?item.width:200"
+            :fixed="item.fixed?item.fixed:undefined"
+            v-for="item in pageColumns"
+            :key="item.key"
+            show-overflow-tooltip sortable>
+            <template slot-scope="scope">
+              <span v-if="item.date">{{$dateformat(scope.row[item.key],'yyyy-mm-dd')}}</span>
+              <span v-else>{{scope.row[item.key]}}</span>
+            </template>
+          </el-table-column>
+        </element-table>
+      </div>
+    </Card>
+    <!--未完成委托列表-->
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  data() {
+    return {
+      tableData: { records: [] },
+      pageColumns: [
+        { title: '委托单位', key: 'cname' },
+        { title: '委托编号', key: 'code', width: 180 },
+        { title: '应出报告日期', key: 'reportDueDate', date: true },
+        { title: '状态', key: 'progress', width: 110 }
+      ],
+      tableHeight: '280',
+      total: ''
+    }
+  },
+  mounted() {
+    // this._request()
+  },
+  methods: {
+    _detail() {
+      this.$refs.unfinishedDetail._open()
+    },
+    _request() {
+      this.$refs.pageTable._hideLoading()
+      this.$store
+        .dispatch('FoodContract/unfinishedContract', { page: 1, rows: 7 })
+        .then(() => {
+          const tableData = this.$store.state.FoodContract.page.records
+          const total = this.$store.state.FoodContract.page.total
+
+          if (total === 0) {
+            this.total = ''
+          } else {
+            this.total = '（共 ' + total + ' 条）'
+          }
+          let num = 0
+          if (tableData.length < 7) {
+            num = tableData.length
+          } else {
+            num = 7
+          }
+          for (let i = 0; i < num; i++) {
+            this.tableData.records.push(tableData[i])
+          }
+        })
+    }
+  }
+}
+</script>

pages/workbench/UnfinishedItem.vue

+<template>
+  <div>
+    <Card style="width:100%">
+      <div class="config_meta">
+        <p class="fl">待检检测项目 {{total}} </p>
+        <div class="fr">
+          <Tooltip content="刷新" placement="left-start">
+            <Icon @click="_request" type="ios-refresh" size="30" color="#2d8cf0" style="cursor:pointer;"></Icon>
+          </Tooltip>
+          <Tooltip content="查看更多" placement="left-start" style="margin-left: 5px">
+            <Icon @click="_detail" type="ios-more" size="30" color="#2d8cf0" style="cursor:pointer;"></Icon>
+          </Tooltip>
+        </div>
+        <div class="clear"></div>
+      </div>
+      <div style="width: 100%;">
+        <element-table ref="pageTable" :pageColumns="pageColumns"
+                       :tableHeight="tableHeight" :getPage="tableData" hide-checkbox>
+          <el-table-column
+            :prop="item.key"
+            :label="item.title"
+            :min-width="item.width"
+            :fixed="item.fixed?item.fixed:undefined"
+            v-for="item in pageColumns"
+            :key="item.key"
+            show-overflow-tooltip sortable>
+            <template slot-scope="scope">
+              <span v-if="item.status">{{scope.row.progress.display}}</span>
+              <span v-else>{{scope.row[item.key]}}</span>
+            </template>
+          </el-table-column>
+        </element-table>
+      </div>
+    </Card>
+    <!--未完成检测项目列表-->
+<!--    <FoodUnfinishedItem ref="unfinishedDetail"></FoodUnfinishedItem>-->
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  data() {
+    return {
+      tableData: { records: [] },
+      pageColumns: [
+        { title: '状态', key: 'progress', width: 110, status: true },
+        { title: '检测项目名称', key: 'name', width: 150 },
+        { title: '检测依据', key: 'testBasis', width: 140 },
+        { title: '样品编号', key: 'num', width: 180 },
+        { title: '样品名称', key: 'sampleName', width: 120 },
+        { title: '所属科室', key: 'groupName', width: 100 }
+      ],
+      tableHeight: '280',
+      total: ''
+    }
+  },
+  mounted() {
+    // this._request()
+  },
+  methods: {
+    _detail() {
+      this.$refs.unfinishedDetail._open()
+    },
+    _request() {
+      this.$refs.pageTable._hideLoading()
+      this.$store
+        .dispatch('StatisticContract/pageItem', { page: 1, rows: 7 })
+        .then(() => {
+          const tableData = this.$store.state.StatisticContract.page.records
+          const total = this.$store.state.StatisticContract.page.total
+
+          if (total === 0) {
+            this.total = ''
+          } else {
+            this.total = '（共 ' + total + ' 条）'
+          }
+          let num = 0
+          if (tableData.length < 7) {
+            num = tableData.length
+          } else {
+            num = 7
+          }
+          for (let i = 0; i < num; i++) {
+            this.tableData.records.push(tableData[i])
+          }
+        })
+    }
+  }
+}
+</script>

pages/workbench/YearContractNum.vue

+<template>
+  <div>
+    <Card style="width:100%;">
+      <div class="config_meta">
+        <p class="fl">年度委托量统计</p>
+        <div class="fr">
+          <Tooltip content="刷新" placement="left-start">
+            <Icon @click="_request" type="ios-refresh" size="30" color="#2d8cf0" style="cursor:pointer;"></Icon>
+          </Tooltip>
+        </div>
+        <div class="clear"></div>
+      </div>
+      <Row>
+        <Col span="24" style="margin-bottom: 10px">
+        日期：
+        <DatePicker v-model="date" :editable="false" @on-change="_dateChange" :clearable="false"
+                    type="year" style="width:90px"></DatePicker>
+        </Col>
+        <Col span="24">
+        <div style="width:100%">
+          <!--柱状图-->
+          <IEcharts :option="option" :style="{width}" @click="_detail" style="height: 302px"></IEcharts>
+        </div>
+        </Col>
+      </Row>
+    </Card>
+    <!--月详情-->
+<!--    <contractNumDetail ref="contractNumDetail"></contractNumDetail>-->
+  </div>
+</template>
+<script>
+// import IEcharts from 'vue-echarts-v3/src/full.js'
+
+export default {
+  components: {},
+  data() {
+    return {
+      width: '',
+      date: new Date(),
+      option: {
+        color: this.$echartColor,
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'cross',
+            crossStyle: {
+              color: '#999'
+            }
+          }
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true,
+          x: 130
+        },
+        legend: {
+          data: ['合同量']
+        },
+        xAxis: [
+          {
+            type: 'category',
+            data: [],
+            axisPointer: {
+              type: ''
+            },
+            axisLine: {
+              lineStyle: {
+                color: 'gray'
+              }
+            },
+            splitLine: { show: false }
+          }
+        ],
+        yAxis: [
+          {
+            type: 'value',
+            name: '委托量(份)',
+            min: 0,
+            axisLabel: {
+              formatter: '{value}'
+            },
+            axisLine: {
+              lineStyle: {
+                color: 'gray'
+              }
+            },
+            splitLine: { show: false }
+          },
+          {
+            type: 'value',
+            name: '委托金额(元)',
+            min: 0,
+            axisLabel: {
+              formatter: '{value}'
+            },
+            axisLine: {
+              lineStyle: {
+                color: 'gray'
+              }
+            },
+            splitLine: { show: false }
+          }
+        ],
+        series: [
+          {
+            name: '委托量',
+            type: 'bar',
+            data: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120]
+          },
+          {
+            name: '委托金额',
+            type: 'line',
+            yAxisIndex: 1,
+            data: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120]
+          }
+        ]
+      },
+      // 临时存储x轴数据
+      tempXAxis: []
+    }
+  },
+  mounted() {
+    this.width = (document.documentElement.clientWidth - 300) / 2 + 'px'
+    this._dateChange(this.$dateformat(new Date(), 'yyyy'))
+  },
+  methods: {
+    _request() {
+      this._openBar(this.year)
+    },
+    // 改变年份
+    _dateChange(data) {
+      // this._openBar(data)
+    },
+    _openBar(data) {
+      this.year = data
+      this.option.xAxis[0].data = []
+      this.tempXAxis = []
+      for (let i = 1; i < 13; i++) {
+        if (i < 10) {
+          this.tempXAxis.push(data + '-0' + i)
+        } else {
+          this.tempXAxis.push(data + '-' + i)
+        }
+        this.option.xAxis[0].data.push(i + '月')
+      }
+      this.$store
+        .dispatch('StatisticContract/pageYearContract', { year: data })
+        .then(() => {
+          const bar = this.$store.state.StatisticContract.page
+          this.option.series[0].data = []
+          this.option.series[1].data = []
+          for (let j = 0; j < bar.length; j++) {
+            for (let k = 0; k < this.tempXAxis.length; k++) {
+              if (bar[j].yearMonth === this.tempXAxis[k]) {
+                this.option.series[0].data[k] = bar[j].total
+                this.option.series[1].data[k] = bar[j].price
+              }
+            }
+          }
+        })
+    },
+    // 查看每月详情
+    _detail(data) {
+      // 11月 转换成 2018-11
+      const index = this.option.xAxis[0].data.indexOf(data.name)
+      const yearMonth = this.tempXAxis[index]
+      this.$refs.contractNumDetail._open({ yearMonth: yearMonth })
+    }
+  }
+}
+</script>

pages/workbench/YearOverItem.vue

+<template>
+  <div>
+    <Card style="width:100%;">
+      <div class="config_meta">
+        <p class="fl">年度超标项目统计</p>
+        <div class="fr">
+          <Tooltip content="刷新" placement="left-start">
+            <Icon @click="_request" type="ios-refresh" size="30" color="#2d8cf0" style="cursor:pointer;"></Icon>
+          </Tooltip>
+        </div>
+        <div class="clear"></div>
+      </div>
+      <Row>
+        <Col span="24" style="margin-bottom: 10px">
+        日期：
+        <DatePicker v-model="date" :editable="false" @on-change="_dateChange" type="year"
+                    style="width:90px"></DatePicker>
+        </Col>
+        <Col span="24">
+        <div style="width:100%">
+          <!--柱状图-->
+          <IEcharts :option="option" :style="{width}" @click="_detail" style="height: 238px"></IEcharts>
+        </div>
+        </Col>
+      </Row>
+    </Card>
+  </div>
+</template>
+<script>
+export default {
+  components: {},
+  data() {
+    return {
+      width: '',
+      date: new Date(),
+      option: {
+        color: this.$echartColor,
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'cross',
+            crossStyle: {
+              color: '#999'
+            }
+          }
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true,
+          x: 130
+        },
+        legend: {
+          data: ['超标数量', '超标率']
+        },
+        xAxis: [
+          {
+            type: 'category',
+            data: [],
+            axisPointer: {
+              type: ''
+            },
+            axisLine: {
+              lineStyle: {
+                color: 'gray'
+              }
+            },
+            splitLine: { show: false }
+          }
+        ],
+        yAxis: [
+          {
+            type: 'value',
+            name: '超标数量',
+            min: 0,
+            axisLabel: {
+              formatter: '{value}'
+            },
+            axisLine: {
+              lineStyle: {
+                color: 'gray'
+              }
+            },
+            splitLine: { show: false }
+          },
+          {
+            type: 'value',
+            name: '超标率(%)',
+            min: 0,
+            axisLabel: {
+              formatter: '{value}'
+            },
+            axisLine: {
+              lineStyle: {
+                color: 'gray'
+              }
+            },
+            splitLine: { show: false }
+          }
+        ],
+        series: [
+          {
+            name: '超标数量',
+            type: 'bar',
+            data: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120]
+          },
+          {
+            name: '超标率',
+            type: 'line',
+            yAxisIndex: 1,
+            data: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120]
+          }
+        ]
+      }
+    }
+  },
+  mounted() {
+    this.width = (document.documentElement.clientWidth - 300) / 2 + 'px'
+    this._dateChange(this.$dateformat(new Date(), 'yyyy'))
+  },
+  methods: {
+    _request() {
+      this._openBar(this.year)
+    },
+    // 改变年份
+    _dateChange(data) {
+      // this._openBar(data)
+    },
+    _openBar(data) {
+      this.year = data
+      this.option.xAxis[0].data = []
+      for (let i = 1; i < 13; i++) {
+        if (i < 10) {
+          this.option.xAxis[0].data.push(data + '-0' + i)
+        } else {
+          this.option.xAxis[0].data.push(data + '-' + i)
+        }
+      }
+      this.$store
+        .dispatch('FoodContract/pageYearOverItem', { year: data })
+        .then(() => {
+          const result = this.$store.state.FoodContract.list
+          this.option.series[0].data = []
+          this.option.series[1].data = []
+          for (let j = 0; j < result.length; j++) {
+            for (let k = 0; k < this.option.xAxis[0].data.length; k++) {
+              if (result[j].testDateMonth === this.option.xAxis[0].data[k]) {
+                this.option.series[0].data[k] = result[j].total
+                this.option.series[1].data[k] = result[j].unQualifiedPercent
+              }
+            }
+          }
+        })
+    }
+  }
+}
+</script>

pages/workbench/YearTestItem.vue

+<template>
+  <div>
+    <Card style="width:100%;">
+      <div class="config_meta">
+        <p class="fl">年度检测量统计</p>
+        <div class="fr">
+          <Tooltip content="刷新" placement="left-start">
+            <Icon @click="_request" type="ios-refresh" size="30" color="#2d8cf0" style="cursor:pointer;"></Icon>
+          </Tooltip>
+        </div>
+        <div class="clear"></div>
+      </div>
+      <Row>
+        <Col span="24" style="margin-bottom: 10px">
+        日期：
+        <DatePicker v-model="date" :editable="false" @on-change="_dateChange" type="year"
+                    style="width:90px"></DatePicker>
+        </Col>
+        <Col span="24">
+        <div style="width:100%">
+          <!--柱状图-->
+          <IEcharts :option="option" :style="{width}" style="height: 238px"></IEcharts>
+        </div>
+        </Col>
+      </Row>
+    </Card>
+  </div>
+</template>
+<script>
+// import IEcharts from 'vue-echarts-v3/src/full.js'
+
+export default {
+  components: {},
+  data() {
+    return {
+      width: '',
+      date: new Date(),
+      option: {
+        color: this.$echartColor,
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'cross',
+            crossStyle: {
+              color: '#999'
+            }
+          }
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true,
+          x: 130
+        },
+        legend: {
+          data: ['样品量', '项目未超标量', '项目超标量']
+        },
+        xAxis: [
+          {
+            type: 'category',
+            data: []
+          }
+        ],
+        yAxis: [
+          {
+            type: 'value',
+            name: '样品量',
+            splitLine: { show: false }
+          },
+          {
+            type: 'value',
+            name: '检测项目量',
+            splitLine: { show: false }
+          }
+        ],
+        series: [
+          {
+            name: '样品量',
+            type: 'bar',
+            data: [1, 2, 3, 4, 5, 6, 7, 8, 9]
+          },
+          {
+            name: '项目未超标量',
+            type: 'bar',
+            yAxisIndex: 1,
+            stack: '检测项目量',
+            data: [6, 7, 8, 9, 10, 11, 12, 13, 14]
+          },
+          {
+            name: '项目超标量',
+            type: 'bar',
+            yAxisIndex: 1,
+            stack: '检测项目量',
+            data: [11, 12, 13, 14, 15, 16, 17, 18, 19]
+          }
+        ]
+      },
+      // 临时存储x轴数据
+      tempXAxis: []
+    }
+  },
+  mounted() {
+    this.width = (document.documentElement.clientWidth - 300) / 2 + 'px'
+    this._dateChange(this.$dateformat(new Date(), 'yyyy'))
+  },
+  methods: {
+    _request() {
+      // this._openBar(this.year)
+    },
+    // 改变年份
+    _dateChange(data) {
+      // this._openBar(data)
+    },
+    _openBar(data) {
+      this.year = data
+      this.option.xAxis[0].data = []
+      for (let i = 1; i < 13; i++) {
+        if (i < 10) {
+          this.option.xAxis[0].data.push(data + '-0' + i)
+        } else {
+          this.option.xAxis[0].data.push(data + '-' + i)
+        }
+      }
+      this.$store
+        .dispatch('FoodContract/pageYearItem', { year: data })
+        .then(() => {
+          const result = this.$store.state.FoodContract.model
+          const month = [
+            'jan',
+            'feb',
+            'mar',
+            'apr',
+            'may',
+            'jun',
+            'jul',
+            'aug',
+            'sep',
+            'oct',
+            'nov',
+            'dece'
+          ]
+          const sampleCount = result.sampleCount
+          const itemCountNotOver = result.itemCountNotOver
+          const itemCountOver = result.itemCountOver
+
+          const sampleCountData = []
+          const itemCountOverData = []
+          const itemCountNotOverData = []
+
+          for (let i = 0; i < month.length; i++) {
+            const m = month[i]
+            sampleCountData.push(sampleCount[m])
+            itemCountNotOverData.push(itemCountNotOver[m])
+            itemCountOverData.push(itemCountOver[m])
+          }
+          this.option.series[0].data = sampleCountData
+          this.option.series[1].data = itemCountNotOverData
+          this.option.series[2].data = itemCountOverData
+        })
+    }
+  }
+}
+</script>

pages/workbench/workbench.vue

@@ -34,6 +34,33 @@
           <Col span="12" style="margin-bottom: 10px">
 <!--            <taskCalendar />-->
           </Col>
+          <Col span="12" style="margin-bottom: 10px">
+            <UnfinishedContract></UnfinishedContract>
+          </Col>
+          <Col span="12" style="margin-bottom: 10px">
+            <UnfinishedItem></UnfinishedItem>
+          </Col>
+          <Col span="12" style="margin-bottom: 10px">
+            <YearContractNum></YearContractNum>
+          </Col>
+          <Col span="12" style="margin-bottom: 10px">
+            <DetectTypeNum></DetectTypeNum>
+          </Col>
+          <Col span="12" style="margin-bottom: 10px">
+            <ContractEndNum></ContractEndNum>
+          </Col>
+          <Col span="12" style="margin-bottom: 10px">
+            <YearTestItem></YearTestItem>
+          </Col>
+          <Col span="12" style="margin-bottom: 10px">
+            <YearOverItem></YearOverItem>
+          </Col>
+          <Col span="12" style="margin-bottom: 10px">
+            <GroupItem></GroupItem>
+          </Col>
+          <Col span="12" style="margin-bottom: 10px">
+            <CustomerContract></CustomerContract>
+          </Col>
         </Row>
       </div>
     </div>
@@ -47,6 +74,15 @@ import toDoTask from './ToDoTask'
 import myTask from './MyTask'
 import taskFlow from './TaskFlow'
 // import taskCalendar from './task-calendar/TaskCalendar'
+import UnfinishedContract from './UnfinishedContract'
+import UnfinishedItem from './UnfinishedItem'
+import YearContractNum from './YearContractNum'
+import DetectTypeNum from './DetectTypeNum'
+import ContractEndNum from './ContractEndNum'
+import YearTestItem from './YearTestItem'
+import YearOverItem from './YearOverItem'
+import GroupItem from './GroupItem'
+import CustomerContract from './CustomerContract'
 export default {
   name: 'Workbench',
   components: {
@@ -54,8 +90,17 @@ export default {
     messagePanel,
     myTask,
     toDoTask,
-    taskFlow
+    taskFlow,
     // taskCalendar
+    UnfinishedContract,
+    UnfinishedItem,
+    YearContractNum,
+    DetectTypeNum,
+    ContractEndNum,
+    YearTestItem,
+    YearOverItem,
+    GroupItem,
+    CustomerContract
   }
 }
 </script>