modified: src/api/experiment/passRateStatistics.js modified: src/view...

Fixiaobai

2023-08-22 49795a6abfbba67d808c4931629671104dd3e4cd

	modified:   src/api/experiment/passRateStatistics.js
	modified:   src/views/experiment/passRateStatistics/index.vue

 src/api/experiment/passRateStatistics.js

@@ -45,3 +45,14 @@
      params
    })
  }

  /**
   * getSampleOptions
   */
  export function getSampleOptions(params) {
    return request({
      url: '/qualificationRate/getSampleOptions',
      method: 'get',
      params
    })
  }

 src/views/experiment/passRateStatistics/index.vue

@@ -19,6 +19,14 @@
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item style="margin-left: 40px;" label="样品:">
          <el-select v-model="searchData.code" filterable placeholder="请选择">
            <el-option v-for="item in sampleOptions" :key="item.value" :label="item.label" :value="item.value">
              <span style="float: left">{{ item.label }}</span>
              <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
            </el-option>
          </el-select>
        </el-form-item>
        <div class="rightBtn">
          <el-form-item>
            <el-button type="primary" plain size="mini">清空</el-button>
@@ -31,12 +39,18 @@
    <div class="chart-content">
      <div class="qualified-wrapper">
        <div style="margin-left: 20px;padding:20px 0px;font-size:18px">检测样品合格率统计</div>
        <div class="qualified" ref="qualified"></div>
        <div :hidden="testSample" class="qualified" ref="qualified"></div>
        <div :hidden="!testSample" style="height: 100%;text-align: center; color: #999696df; margin-top: 100px;">暂无数据
        </div>
      </div>
      <div class="unqualified">
        <div class="firstBox-wrapper">
          <div style="margin-left: 20px;padding:20px 0px;font-size:18px">供应商不合格次数统计</div>
          <div class="firstBox" ref="unqualified_provider"></div>
          <div style="margin-left: 20px;padding:20px 0px;font-size:18px">供应商合格率统计</div>
          <div>
            <div :hidden="supplierData" class="firstBox" ref="unqualified_provider"></div>
            <div :hidden="!supplierData" style="height: 100%;text-align: center; color: #999696df; margin-top: 100px;">
              暂无数据</div>
          </div>
        </div>
        <div class="secondBox-wrapper">
          <div class="secondBox_header">
@@ -46,7 +60,11 @@
              }}</el-radio-button>
            </el-radio-group>
          </div>
          <div class="secondBox" ref="unqualified_project"></div>
          <div style="width: 100%;height: 100;">
            <div :hidden="projectData" class="secondBox" ref="unqualified_project"></div>
            <div :hidden="!projectData" style="height: 100%;text-align: center; color: #999696df; margin-top: 100px;">暂无数据
            </div>
          </div>
        </div>
      </div>
    </div>
@@ -70,18 +88,25 @@
})

import * as echarts from 'echarts'
import { getSupplierList,getTestSampleStatistics,getSupplierNoPassStatistics,getNoPassProjectStatistics } from '@/api/experiment/passRateStatistics';
import { getSupplierList, getTestSampleStatistics, getSupplierNoPassStatistics, getNoPassProjectStatistics, getSampleOptions } from '@/api/experiment/passRateStatistics';
import { dateFormat } from '../../../utils/dateUtil'
export default {
  data() {
    return {
      supplier: [],
      sampleOptions: [],
      searchData: {
        date: [],
        type: null,
        supplier: null
        supplier: null,
        sample: null,
        code: null
      },
      options: [
        {
          label: '全部',
          value: 3
        },
        {
          label: '原材料',
          value: 0
@@ -109,21 +134,118 @@
      rules: {
        // date: [{ required: true, message: '请输入账号', trigger: 'blur' }],
        // type: [{ required: true, message: '请输入名字', trigger: 'blur' }]
      }
      },
      supplierNoPassStatistics: null,
      supplierData: false,
      projectStatistics: null,
      projectData: false,
      testSampleStatistics: null,
      testSample: false,
      m1: null,
      m2: null,
      m3: null
    }
  },
  mounted() {
    this.getSupplierList()
    this.getTestSampleStatistics()
    this.getSupplierNoPassStatistics()
  async mounted() {
    await this.start()
    this.tableStart()
  },
  methods: {
    async search() {
      this.testSampleStatistics = null
      this.supplierNoPassStatistics = null
      this.projectStatistics = null
      this.supplier = []
      this.sampleOptions = []
      await this.start()
      this.tableStart()
    },
    dateHandle() {
      let data = JSON.parse(JSON.stringify(this.searchData))
      if (this.searchData.date.length != 0 && this.searchData.date != []) {
        data.beginDate = dateFormat(this.searchData.date[0])
        data.endDate = dateFormat(this.searchData.date[1])
      }
      if (data.supplier == '全部') {
        data.supplier = null
      }
      if (data.type === 3) {
        data.type = null
      }
      if (this.sampleOptions.length > 0 && this.sampleOptions != []) {
        let labelSam = this.sampleOptions.filter(item => {
          return item.value == data.code
        })[0]
        data.sample = labelSam.label
      }
      if (data.code == '全部') {
        data.code = null
        data.sample = null
      }
      data.date = null
      return data
    },
    async getSupplierList() {
      let res = await getSupplierList()
      this.supplier.push({ label: '全部', value: '全部' })
      res.data.forEach(item => {
        this.supplier.push({ label: item.supplier, value: item.supplier })
      })
    },
    async getTestSampleStatistics() {
      let param = this.dateHandle()
      let res = await getTestSampleStatistics(param)
      this.testSample = !res.data.noData
      this.testSampleStatistics = res.data
    },
    async getSupplierNoPassStatistics() {
      let param = this.dateHandle()
      let res = await getSupplierNoPassStatistics(param)
      this.supplierData = !res.data.noData
      this.supplierNoPassStatistics = res.data
    },
    async getNoPassProjectStatistics() {
      let param = this.dateHandle()
      let res = await getNoPassProjectStatistics(param)
      this.projectData = !res.data.noData
      this.projectStatistics = res.data
    },
    async start() {
      await this.getTestSampleStatistics()
      await this.getSupplierNoPassStatistics()
      await this.getNoPassProjectStatistics()
      await this.getSupplierList()
      await this.getSampleOptions()
    },
    async getSampleOptions() {
      let res = await getSampleOptions()
      this.sampleOptions.push({
        label: '全部',
        value: '全部'
      })
      res.data.forEach(item => {
        let data = {
          label: item.name,
          value: item.code
        }
        this.sampleOptions.push(data)
      })
    },
    tableStart() {
    const chartDom_qualified = this.$refs.qualified;
    const chartDom_unqualified_provider = this.$refs.unqualified_provider;
    const chartDom_unqualified_project = this.$refs.unqualified_project;

    const myChart1 = echarts.init(chartDom_qualified);
    const myChart2 = echarts.init(chartDom_unqualified_provider);
    const myChart3 = echarts.init(chartDom_unqualified_project);

      const myChart2 = echarts.init(chartDom_unqualified_provider, null, {
        height: 300
      });
      const myChart3 = echarts.init(chartDom_unqualified_project, null, {
        height: 268
      });
      this.m1 = myChart1
      this.m2 = myChart2
      this.m3 = myChart3
    /**
     * 检测合格率统计
     */
@@ -135,12 +257,12 @@
        }
      },
      legend: {
        data: ['数据1', '数据2', '数据3']
          data: ['合格', '不合格']
      },
      xAxis: [
        {
          type: 'category',
          data: ['第一批', '第二批', '第三批', '第四批']
            data: this.testSampleStatistics.xAxis
        }
      ],
      yAxis: [
@@ -151,27 +273,7 @@
          }
        }
      ],
      series: [
        {
          name: '数据1',
          type: 'bar',
          data: [7245, 3475, 1237, 3456]
        },
        {
          name: '数据2',
          type: 'bar',
          data: [9965, 9075, 4875, 8687]
        },
        {
          name: '数据3',
          type: 'line',
          yAxisIndex: 0,
          symbolSize: 3, // 折线节点的大小
          symbol: 'circle', // 折线节点的形状
          smooth: false, // 平滑曲线
          data: [1465, 6437, 3257, 6537]
        }
      ]
        series: this.testSampleStatistics.series
    };
    /**
     * 供应商
@@ -194,7 +296,7 @@
        data: ['合格数量', '不合格数量']
      },
      xAxis: {
        data: ['供应商1', '供应商2', '供应商3', '供应商4']
          data: this.supplierNoPassStatistics.xAxis
      },
      yAxis: [
        {
@@ -204,20 +306,7 @@
          }
        }
      ],
      series: [
        {
          name: '合格数量',
          data: [52, 46, 39, 66],
          type: 'bar',
          stack: 'x'
        },
        {
          name: '不合格数量',
          data: [47, 53, 60, 33],
          type: 'bar',
          stack: 'x'
        }
      ]
        series: this.supplierNoPassStatistics.series
    };
    /**
     * 不合格项目
@@ -226,7 +315,7 @@
      legend: {
        orient: 'vertical',
        x: 'left',
        data: ['绝缘偏心率', '试验结果', '导体屏蔽最大值']
          data: this.projectStatistics.legend
      },
      title: {
        text: '',
@@ -236,20 +325,7 @@
      series: [
        {
          type: 'pie',
          data: [
            {
              value: 40,
              name: '绝缘偏心率'
            },
            {
              value: 20,
              name: '试验结果'
            },
            {
              value: 40,
              name: '导体屏蔽最大值'
            }
          ],
            data: this.projectStatistics.series,
          radius: ['40%', '70%'],
          label: {
            show: true,
@@ -267,33 +343,6 @@
    if (this.type === 1) {
      myChart3.setOption(option_unqualified2);
    }
  },
  methods: {
    search() {
      this.getTestSampleStatistics()
    },
    dateHandle(){
      let data=JSON.parse(JSON.stringify(this.searchData))
      if(this.searchData.date.length!=0&&this.searchData.date !=[]){
        data.beginDate=dateFormat(this.searchData.date[0])
        data.endDate=dateFormat(this.searchData.date[1])
      }
      data.date=null
      return data
    },
    async getSupplierList() {
      let res = await getSupplierList()
      res.data.forEach(item => {
        this.supplier.push({ label: item.supplier, value: item.supplier })
      })
    },
    getTestSampleStatistics(){
     let param= this.dateHandle()
     let res =getTestSampleStatistics(param)
    },
    getSupplierNoPassStatistics(){
      let param= this.dateHandle()
      getSupplierNoPassStatistics(param)
    }
  }
}
@@ -303,6 +352,7 @@
.content-main {
  height: 100%;
  width: 100%;
  overflow: auto;

  .top-bar {
    position: absolute;