1
This commit is contained in:
		
							
								
								
									
										2
									
								
								.env.dev
									
									
									
									
									
								
							
							
						
						
									
										2
									
								
								.env.dev
									
									
									
									
									
								
							@@ -1,7 +1,7 @@
 | 
			
		||||
###
 | 
			
		||||
 # @Author: Do not edit
 | 
			
		||||
 # @Date: 2023-08-29 09:40:39
 | 
			
		||||
 # @LastEditTime: 2024-01-11 10:20:21
 | 
			
		||||
 # @LastEditTime: 2024-01-29 15:49:57
 | 
			
		||||
 # @LastEditors: zhp
 | 
			
		||||
 # @Description:
 | 
			
		||||
###
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										84
									
								
								src/api/base/qualityInspectionBoxPermissions.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										84
									
								
								src/api/base/qualityInspectionBoxPermissions.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,84 @@
 | 
			
		||||
/*
 | 
			
		||||
 * @Author: zhp
 | 
			
		||||
 * @Date: 2023-12-04 14:10:37
 | 
			
		||||
 * @LastEditTime: 2024-01-29 10:42:49
 | 
			
		||||
 * @LastEditors: zhp
 | 
			
		||||
 * @Description:
 | 
			
		||||
 */
 | 
			
		||||
import request from '@/utils/request'
 | 
			
		||||
 | 
			
		||||
// 创建安灯按钮16键对应
 | 
			
		||||
export function createQualityInspectionBoxBtn(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/quality-inspection-box-btn/updateBatch',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 更新安灯按钮16键对应
 | 
			
		||||
export function updateQualityInspectionBoxBtn(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/quality-inspection-box-btn/updateBatch',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 删除安灯按钮16键对应
 | 
			
		||||
export function deleteQualityInspectionBoxBtn(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/quality-inspection-box-btn/delete?id=' + id,
 | 
			
		||||
    method: 'delete'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得安灯按钮16键对应
 | 
			
		||||
export function getQualityInspectionBoxBtn(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/quality-inspection-box-btn/get?id=' + id,
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得安灯按钮16键对应分页
 | 
			
		||||
export function getQualityInspectionBoxBtnPage(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/quality-inspection-box-btn/listGroupByLineSection',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 导出安灯按钮16键对应 Excel
 | 
			
		||||
export function exportQualityInspectionBoxBtnExcel(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/quality-inspection-box-btn/export-excel',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query,
 | 
			
		||||
    responseType: 'blob'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function getAllDetByTypeList(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/quality-scrap-det/scrapMap',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query,
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
export function getListByLineSection(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/quality-inspection-box-btn/detListByLineSection',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query,
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function getUserList(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: 'system/user/page',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query,
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
@@ -2,7 +2,7 @@
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2021-07-19 15:18:30
 | 
			
		||||
 * @LastEditors: zhp
 | 
			
		||||
 * @LastEditTime: 2024-01-25 17:55:53
 | 
			
		||||
 * @LastEditTime: 2024-01-29 15:00:30
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
@@ -49,10 +49,11 @@
 | 
			
		||||
        </el-col>
 | 
			
		||||
 | 
			
		||||
        <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
 | 
			
		||||
          <base-container :title="'ISRA 缺陷数据'" :size="'small'" :title-icon="'scrap'">
 | 
			
		||||
          <base-container :no-content-padding="true" :title="'ISRA 缺陷数据'" :size="'small'" :title-icon="'scrap'">
 | 
			
		||||
            <!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="ISRATableProps"
 | 
			
		||||
              :table-data="ISRAList" /> -->
 | 
			
		||||
            <dv-scroll-board :config="ISRAConfig" style="width:100%;height:350px" ref='ISRAScrollBoard' />
 | 
			
		||||
            <ISRAChart ref="ISRAChart" />
 | 
			
		||||
            <!-- <dv-scroll-board :config="ISRAConfig" style="width:100%;height:350px" ref='ISRAScrollBoard' /> -->
 | 
			
		||||
          </base-container>
 | 
			
		||||
        </el-col>
 | 
			
		||||
      </el-row>
 | 
			
		||||
@@ -82,27 +83,26 @@
 | 
			
		||||
          </base-container>
 | 
			
		||||
        </el-col>
 | 
			
		||||
        <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="14">
 | 
			
		||||
          <base-container  :height="318 + 338 + 16" :size="'eqStatus'"
 | 
			
		||||
            :title="'设备状态监控'" :title-icon="'eqMonitoring'">
 | 
			
		||||
          <base-container :height="318 + 338 + 16" :size="'eqStatus'" :title="'设备状态监控'" :title-icon="'eqMonitoring'">
 | 
			
		||||
            <!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
 | 
			
		||||
              <top-radio-group />
 | 
			
		||||
            </div> -->
 | 
			
		||||
            <!-- 像下面这样表格里的limit值,也许可以用js动态计算出来 -->
 | 
			
		||||
            <el-col :span="6" style="">
 | 
			
		||||
              <div style="font-size:20px;margin: 5px 0 10px 0">融化风机</div>
 | 
			
		||||
            <el-col :span="8" style="">
 | 
			
		||||
              <div style="font-size:20px;margin: 5px 0 10px 0">熔化风机</div>
 | 
			
		||||
              <!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="EqMonitoringPropsFun"
 | 
			
		||||
                :table-data="funList" />    -->
 | 
			
		||||
              <dv-scroll-board :config="funConfig" style="width:100%;height:310px" ref='funScrollBoard' />
 | 
			
		||||
            </el-col>
 | 
			
		||||
            <span class="eqLine"></span>
 | 
			
		||||
            <el-col :span="6">
 | 
			
		||||
            <el-col :span="8">
 | 
			
		||||
              <div style="font-size:20px;margin: 5px 0 10px 0;">退火风机</div>
 | 
			
		||||
              <!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="EqMonitoringPropsFun"
 | 
			
		||||
                :table-data="annealFunList" /> -->
 | 
			
		||||
              <dv-scroll-board :config="annealFunConfig" style="width:100%;height:310px" ref='annealFunScrollBoard' />
 | 
			
		||||
            </el-col>
 | 
			
		||||
            <span class="eqLineTwo"></span>
 | 
			
		||||
            <el-col :span="12" style="float: right;">
 | 
			
		||||
            <el-col :span="8" style="float: right;">
 | 
			
		||||
              <div style="font-size:20px;margin: 5px 0 10px 0;">产线设备</div>
 | 
			
		||||
              <!-- <base-table1 :page="1" :limit="999" :show-index="false" :table-config="EqMonitoringProps"
 | 
			
		||||
                :table-data="realEqList" /> -->
 | 
			
		||||
@@ -137,10 +137,6 @@ import baseTable1 from './components/baseTable'
 | 
			
		||||
// import baseTable2 from './components/baseTable'
 | 
			
		||||
// import baseTable3 from './components/baseTable'
 | 
			
		||||
import TopRadioGroup from './components/topRadioGroup'
 | 
			
		||||
// import pieChart1 from './components/PieChart'
 | 
			
		||||
// import pieChart2 from './components/PieChart'
 | 
			
		||||
// import pieChart3 from './components/PieChart'
 | 
			
		||||
// import { mapGetters } from 'vuex'
 | 
			
		||||
import screenfull from 'screenfull'
 | 
			
		||||
// import BaseVideo from './components/baseVideo.vue'
 | 
			
		||||
import alarmLevel from './components/alarmLevel'
 | 
			
		||||
@@ -149,13 +145,9 @@ import colorDiv from './components/colorDiv'
 | 
			
		||||
 | 
			
		||||
// import axios from '@/utils/request'
 | 
			
		||||
import doubleYChart from './components/coldDoubleYChart'
 | 
			
		||||
// import elementResizeDetectorMaker from 'element-resize-detector';
 | 
			
		||||
// var erd = elementResizeDetectorMaker(); //创建实例
 | 
			
		||||
// let resizeFun = null
 | 
			
		||||
import { parseTime } from '../core/mixins/code-filter';
 | 
			
		||||
import { formatDate } from '@/utils'
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
import ISRAChart from './components/ISRAChart.vue';
 | 
			
		||||
import { getDcsMsg, closeDcsMsg } from "@/websocket/wsInterface"
 | 
			
		||||
import LinearBarChart from './components/linearBarChart'
 | 
			
		||||
const qualityYearTableProps= []
 | 
			
		||||
const EqMonitoringPropsFun = [
 | 
			
		||||
@@ -260,6 +252,7 @@ export default {
 | 
			
		||||
    TopRadioGroup,
 | 
			
		||||
    doubleYChart,
 | 
			
		||||
    LinearBarChart,
 | 
			
		||||
    ISRAChart
 | 
			
		||||
    // baseContainer1
 | 
			
		||||
    // pieChart1,
 | 
			
		||||
    // pieChart2
 | 
			
		||||
@@ -294,18 +287,18 @@ export default {
 | 
			
		||||
        headerBGC: 'rgba(32, 55, 96, 0.8)',
 | 
			
		||||
        oddRowBGC: 'rgba(32, 55, 96, 0.8)',
 | 
			
		||||
        evenRowBGC: 'rgba(14, 32, 62, 0.8)',
 | 
			
		||||
        columnWidth: [60, 90, 90],
 | 
			
		||||
        columnWidth: [60, 180, 90],
 | 
			
		||||
        align: ['center'],
 | 
			
		||||
        data: [],
 | 
			
		||||
        // index:true,
 | 
			
		||||
        rowNum: 10
 | 
			
		||||
      },
 | 
			
		||||
      realEqConfig: {
 | 
			
		||||
        header: ['序号', '产线', '设备名称', '设备编码', '运行状态','故障状态'],
 | 
			
		||||
        header: ['序号','设备名称','运行状态'],
 | 
			
		||||
        headerBGC: 'rgba(32, 55, 96, 0.8)',
 | 
			
		||||
        oddRowBGC: 'rgba(32, 55, 96, 0.8)',
 | 
			
		||||
        evenRowBGC: 'rgba(14, 32, 62, 0.8)',
 | 
			
		||||
        columnWidth: [60, 80, 90,90,90,90],
 | 
			
		||||
        columnWidth: [60, 180, 90],
 | 
			
		||||
        align: ['center'],
 | 
			
		||||
        data: [],
 | 
			
		||||
        // index:true,
 | 
			
		||||
@@ -316,7 +309,7 @@ export default {
 | 
			
		||||
        headerBGC: 'rgba(32, 55, 96, 0.8)',
 | 
			
		||||
        oddRowBGC: 'rgba(32, 55, 96, 0.8)',
 | 
			
		||||
        evenRowBGC: 'rgba(14, 32, 62, 0.8)',
 | 
			
		||||
        columnWidth: [60, 90, 90],
 | 
			
		||||
        columnWidth: [60, 180, 90],
 | 
			
		||||
        align: ['center'],
 | 
			
		||||
        data: [],
 | 
			
		||||
        // index:true,
 | 
			
		||||
@@ -350,6 +343,7 @@ export default {
 | 
			
		||||
      SJGWsData: {},
 | 
			
		||||
      // orderProcessList: [],
 | 
			
		||||
      dateType: '0',
 | 
			
		||||
      wsIsOpen:false,
 | 
			
		||||
      funList:[],
 | 
			
		||||
      annealFunList: [],
 | 
			
		||||
      queryParams: {
 | 
			
		||||
@@ -393,8 +387,27 @@ export default {
 | 
			
		||||
    // this.fetchList('line-chart-data')
 | 
			
		||||
    this.init()
 | 
			
		||||
  },
 | 
			
		||||
  destroyed() {
 | 
			
		||||
    this.funInitWebSocket()
 | 
			
		||||
    this.CutInitWebSocket()
 | 
			
		||||
    this.SJGWebsocketClose()
 | 
			
		||||
    if (this.wsIsOpen) {
 | 
			
		||||
      closeDcsMsg()
 | 
			
		||||
      this.wsIsOpen = false
 | 
			
		||||
      console.log('关闭============')
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    this.funInitWebSocket()
 | 
			
		||||
    // if (num > 0) {
 | 
			
		||||
      if (!this.wsIsOpen) {
 | 
			
		||||
        getDcsMsg()
 | 
			
		||||
        this.wsIsOpen = true
 | 
			
		||||
        console.log('开启websocket==========')
 | 
			
		||||
      }
 | 
			
		||||
    // } else {
 | 
			
		||||
 | 
			
		||||
    // }
 | 
			
		||||
    this.CutInitWebSocket()
 | 
			
		||||
    this.SJGInitWebSocket()
 | 
			
		||||
    // this.getList()
 | 
			
		||||
@@ -444,6 +457,15 @@ export default {
 | 
			
		||||
  //   removeEventListener('resize', resizeFun)
 | 
			
		||||
  // },
 | 
			
		||||
  methods: {
 | 
			
		||||
    CutWebsocketClose(e) {
 | 
			
		||||
      console.log('WebSocket 断开连接', e)
 | 
			
		||||
    },
 | 
			
		||||
    SJGWebsocketClose(e) {
 | 
			
		||||
      console.log('WebSocket 断开连接', e)
 | 
			
		||||
    },
 | 
			
		||||
    funInitWebSocket(e) {
 | 
			
		||||
      console.log('WebSocket 断开连接', e)
 | 
			
		||||
    },
 | 
			
		||||
    formatTime(time, option) {
 | 
			
		||||
      // if (('' + time).length === 10) {
 | 
			
		||||
      //   time = parseInt(time) * 1000
 | 
			
		||||
@@ -738,6 +760,7 @@ export default {
 | 
			
		||||
      // let obj = JSON.parse(data.data)
 | 
			
		||||
      this.SJGWsData = e?.data ? JSON.parse(e?.data) : {}
 | 
			
		||||
      if (this.SJGWsData.type === 'isra') {
 | 
			
		||||
        console.log('222222', this.SJGWsData.detData);
 | 
			
		||||
        // this.ISRAList = this.SJGWsData.detData.map((ele, index) => {
 | 
			
		||||
        //   // if (ele.progressRate != 1) {
 | 
			
		||||
        //   return {
 | 
			
		||||
@@ -751,34 +774,39 @@ export default {
 | 
			
		||||
        //   // }
 | 
			
		||||
        // });
 | 
			
		||||
        console.log(this.SJGWsData.detData);
 | 
			
		||||
        let ISRAArr = this.SJGWsData.detData.map((item, index) => [
 | 
			
		||||
          // console.log(item)
 | 
			
		||||
          `<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
 | 
			
		||||
            </span>`,
 | 
			
		||||
          // formatDate(item.planStartTime) || '',
 | 
			
		||||
          `
 | 
			
		||||
          <span style="color:rgba(255,255,255,0.5)" >${item.linename || ''}
 | 
			
		||||
            </span>`,
 | 
			
		||||
          `<span style="color:rgba(255,255,255,0.5)">${item.time || ''}</span>`,
 | 
			
		||||
          `<span style="color:rgba(255,255,255,0.5)">${item.type || ''}</span>`,
 | 
			
		||||
          `<span style="color:rgba(255,255,255,0.5)">${item.num || ''}</span>`,
 | 
			
		||||
          `<span style="color:rgba(255,255,255,0.5)">${(item.percent * 100).toFixed(2) || ''}</span>`,
 | 
			
		||||
        ])
 | 
			
		||||
        this.ISRAConfig.data = ISRAArr
 | 
			
		||||
        this.$refs['ISRAScrollBoard'].updateRows(ISRAArr)
 | 
			
		||||
        let chartData = this.SJGWsData.detData.map((item, index) => {
 | 
			
		||||
          return {
 | 
			
		||||
            name: item.type,
 | 
			
		||||
            num:item.num
 | 
			
		||||
          }
 | 
			
		||||
        })
 | 
			
		||||
        // let ISRAArr = this.SJGWsData.detData.map((item, index) => [
 | 
			
		||||
        //   // console.log(item)
 | 
			
		||||
        //   `<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
 | 
			
		||||
        //     </span>`,
 | 
			
		||||
        //   // formatDate(item.planStartTime) || '',
 | 
			
		||||
        //   `
 | 
			
		||||
        //   <span style="color:rgba(255,255,255,0.5)" >${item.linename || ''}
 | 
			
		||||
        //     </span>`,
 | 
			
		||||
        //   `<span style="color:rgba(255,255,255,0.5)">${item.time || ''}</span>`,
 | 
			
		||||
        //   `<span style="color:rgba(255,255,255,0.5)">${item.type || ''}</span>`,
 | 
			
		||||
        //   `<span style="color:rgba(255,255,255,0.5)">${item.num || ''}</span>`,
 | 
			
		||||
        //   `<span style="color:rgba(255,255,255,0.5)">${(item.percent * 100).toFixed(2) || ''}</span>`,
 | 
			
		||||
        // ])
 | 
			
		||||
        // this.ISRAConfig.data = ISRAArr
 | 
			
		||||
        this.$refs['ISRAChart'].updateChart(chartData)
 | 
			
		||||
      } else if (this.SJGWsData.type === 'equipment') {
 | 
			
		||||
        this.realEqList = this.SJGWsData.detData.map((ele, index) =>[
 | 
			
		||||
            // console.log(item)
 | 
			
		||||
            `<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
 | 
			
		||||
            </span>`,
 | 
			
		||||
            // formatDate(item.planStartTime) || '',
 | 
			
		||||
            `
 | 
			
		||||
          <span style="color:rgba(255,255,255,0.5)" >${item.line || ''}
 | 
			
		||||
            </span>`,
 | 
			
		||||
            // `<span style="color:rgba(255,255,255,0.5)" >${item.line || ''}
 | 
			
		||||
            // </span>`,
 | 
			
		||||
          `<span style="color:rgba(255,255,255,0.5)">${item.name || ''}</span>`,
 | 
			
		||||
          `<span style="color:rgba(255,255,255,0.5)">${item.code || ''}</span>`,
 | 
			
		||||
          // `<span style="color:rgba(255,255,255,0.5)">${item.code || ''}</span>`,
 | 
			
		||||
          `<span style="color:rgba(255,255,255,0.5)">${item.run || ''}</span>`,
 | 
			
		||||
          `<span style="color:rgba(255,255,255,0.5)">${item.error || ''}</span>`,
 | 
			
		||||
          // `<span style="color:rgba(255,255,255,0.5)">${item.error || ''}</span>`,
 | 
			
		||||
          ]);
 | 
			
		||||
      }
 | 
			
		||||
      this.realEqConfig.data = this.realEqList
 | 
			
		||||
@@ -931,7 +959,7 @@ export default {
 | 
			
		||||
  height: 290px;
 | 
			
		||||
  width: 1px;
 | 
			
		||||
  position: absolute;
 | 
			
		||||
  left: 25%;
 | 
			
		||||
  left: 33.8%;
 | 
			
		||||
  top: 12%;
 | 
			
		||||
background: linear-gradient(to bottom,rgba(60,
 | 
			
		||||
  231,
 | 
			
		||||
@@ -943,7 +971,7 @@ background: linear-gradient(to bottom,rgba(60,
 | 
			
		||||
  height: 290px;
 | 
			
		||||
  width: 1px;
 | 
			
		||||
  position: absolute;
 | 
			
		||||
  left: 50%;
 | 
			
		||||
  left: 66.2%;
 | 
			
		||||
  top: 12%;
 | 
			
		||||
  background: linear-gradient(to bottom, rgba(60,
 | 
			
		||||
        231,
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										159
									
								
								src/views/OperationalOverview/components/ISRAChart.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										159
									
								
								src/views/OperationalOverview/components/ISRAChart.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,159 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zhp
 | 
			
		||||
 * @Date: 2024-01-29 13:45:56
 | 
			
		||||
 * @LastEditTime: 2024-01-29 14:56:38
 | 
			
		||||
 * @LastEditors: zhp
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
	<div>
 | 
			
		||||
		<!-- <NotMsg v-show="notMsg"/> -->
 | 
			
		||||
		<div id="israChart" class="isra-chart" style="height:390px;"></div>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import * as echarts from 'echarts';
 | 
			
		||||
// import resize from './../mixins/resize'
 | 
			
		||||
// import NotMsg from './../components/NotMsg'
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'ISRAChart',
 | 
			
		||||
	// mixins: [resize],
 | 
			
		||||
	// components:{ NotMsg },
 | 
			
		||||
	props: {},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			chart: null,
 | 
			
		||||
			// notMsg:true,
 | 
			
		||||
			colors:['#2760ff', '#518eec', '#0ee8e4', '#ddb523'],
 | 
			
		||||
			chartData: []
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	activated() {
 | 
			
		||||
	},
 | 
			
		||||
	computed: {
 | 
			
		||||
		israChartMsg() {
 | 
			
		||||
			return this.$store.state.websocket.israKiln
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
	watch: {
 | 
			
		||||
		israChartMsg: {
 | 
			
		||||
			handler(newVal, oldVal) {
 | 
			
		||||
				this.chartData = newVal || []
 | 
			
		||||
				this.updateChart()
 | 
			
		||||
				this.$emit('emitFun')
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		updateChart() {
 | 
			
		||||
			console.log('update')
 | 
			
		||||
			let num = 0
 | 
			
		||||
			this.chartData && this.chartData.length > 0 && this.chartData.map(i => {
 | 
			
		||||
				num+=i.num
 | 
			
		||||
			})
 | 
			
		||||
			if (
 | 
			
		||||
        this.chart !== null &&
 | 
			
		||||
        this.chart !== '' &&
 | 
			
		||||
        this.chart !== undefined
 | 
			
		||||
      ) {
 | 
			
		||||
        this.chart.dispose()
 | 
			
		||||
      }
 | 
			
		||||
			// if (this.chartData && this.chartData.length > 0) {
 | 
			
		||||
      //    this.notMsg = false
 | 
			
		||||
      // } else {
 | 
			
		||||
      //   this.notMsg = true
 | 
			
		||||
			// 	return
 | 
			
		||||
      // }
 | 
			
		||||
			this.chart = echarts.init(document.getElementById('israChart'));
 | 
			
		||||
			var option = {
 | 
			
		||||
				color:this.colors,
 | 
			
		||||
				title:{
 | 
			
		||||
					text: num,
 | 
			
		||||
					subtext: '总数',
 | 
			
		||||
					top: '32%',
 | 
			
		||||
					left: '49%',
 | 
			
		||||
					textAlign: 'center',
 | 
			
		||||
					textStyle: {
 | 
			
		||||
						fontSize: 32,
 | 
			
		||||
						color: '#fff',
 | 
			
		||||
					},
 | 
			
		||||
					subtextStyle: {
 | 
			
		||||
						fontSize: 20,
 | 
			
		||||
						color: '#fff00',
 | 
			
		||||
					},
 | 
			
		||||
				},
 | 
			
		||||
				legend: {
 | 
			
		||||
					bottom: '2%',
 | 
			
		||||
					left: 'center',
 | 
			
		||||
					itemWidth: 18,
 | 
			
		||||
					itemHeight:18,
 | 
			
		||||
					icon: 'circle',
 | 
			
		||||
					textStyle: {
 | 
			
		||||
						color: '#fff'
 | 
			
		||||
					},
 | 
			
		||||
					data:this.chartData && this.chartData.length > 0 && this.chartData.map((item,index)=>({
 | 
			
		||||
						name:item.name,
 | 
			
		||||
						itemStyle:{
 | 
			
		||||
							color: this.colors[index%4]
 | 
			
		||||
						}
 | 
			
		||||
					}))
 | 
			
		||||
				},
 | 
			
		||||
				series:[{
 | 
			
		||||
						name: 'ISRA缺陷检测',
 | 
			
		||||
						type: 'pie',
 | 
			
		||||
						center: ['50%', '40%'],
 | 
			
		||||
						radius: ['45%', '70%'],
 | 
			
		||||
						avoidLabelOverlap: true,
 | 
			
		||||
						label: {
 | 
			
		||||
							show: false
 | 
			
		||||
						},
 | 
			
		||||
						labelLine: {
 | 
			
		||||
							show: true,
 | 
			
		||||
						},
 | 
			
		||||
						data: this.chartData && this.chartData.length > 0 && this.chartData.map((item, index) => ({
 | 
			
		||||
						name:item.name,
 | 
			
		||||
						value: item.num,
 | 
			
		||||
						itemStyle:{
 | 
			
		||||
							color:{
 | 
			
		||||
								type: 'linear',
 | 
			
		||||
								x: 1,
 | 
			
		||||
								y: 1,
 | 
			
		||||
								x2: 0,
 | 
			
		||||
								y2: 0,
 | 
			
		||||
								global: false,
 | 
			
		||||
								colorStops:[
 | 
			
		||||
									{offset: 0,color: this.colors[index%4]},
 | 
			
		||||
									{offset: 1,color: this.colors[index%4]+'33'}
 | 
			
		||||
								]
 | 
			
		||||
							}
 | 
			
		||||
						}
 | 
			
		||||
					}))}],
 | 
			
		||||
					tooltip: {
 | 
			
		||||
						trigger: 'item',
 | 
			
		||||
						className: "isra-chart-tooltip"
 | 
			
		||||
					},
 | 
			
		||||
			}
 | 
			
		||||
			this.chart.setOption(option);
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.isra-chart {
 | 
			
		||||
	width: 100%;
 | 
			
		||||
	height: 100%;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style>
 | 
			
		||||
  .isra-chart-tooltip {
 | 
			
		||||
    background: #0a2b4f77 !important;
 | 
			
		||||
    border: none !important;
 | 
			
		||||
    backdrop-filter: blur(12px);
 | 
			
		||||
  }
 | 
			
		||||
  .isra-chart-tooltip * {
 | 
			
		||||
    color: #fff !important;
 | 
			
		||||
  }
 | 
			
		||||
</style>
 | 
			
		||||
@@ -2,7 +2,7 @@
 | 
			
		||||
 * @Author: gtz
 | 
			
		||||
 * @Date: 2022-01-19 15:58:17
 | 
			
		||||
 * @LastEditors: zhp
 | 
			
		||||
 * @LastEditTime: 2024-01-24 17:01:21
 | 
			
		||||
 * @LastEditTime: 2024-01-29 15:35:37
 | 
			
		||||
 * @Description: file content
 | 
			
		||||
 * @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseContainer\index.vue
 | 
			
		||||
-->
 | 
			
		||||
@@ -27,9 +27,12 @@
 | 
			
		||||
          <svg-icon :icon-class="titleIcon" style="font-size: 1em; position: relative; top: .08em" />
 | 
			
		||||
          {{ title }}
 | 
			
		||||
        </span>
 | 
			
		||||
        <!-- <span style="font-size: 20px;color:#52FFF8;margin-left: 10px;margin-top: 2px;">
 | 
			
		||||
          {{ time +'-'+ time2 }}
 | 
			
		||||
        <!-- <span v-if="showTime" style="font-size: 20px;color:#52FFF8;margin-left: 10px;margin-top: 2px;">
 | 
			
		||||
          {{ time2 +'-'+ time }}
 | 
			
		||||
        </span> -->
 | 
			
		||||
        <span  style="font-size: 20px;color:#52FFF8;margin-left: 10px;margin-top: 2px;">
 | 
			
		||||
          {{ startTime + '-' + endTime }}
 | 
			
		||||
        </span>
 | 
			
		||||
      </div>
 | 
			
		||||
      <!-- <div v-if="true" class="bar-title">
 | 
			
		||||
        <span>
 | 
			
		||||
@@ -45,6 +48,7 @@
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import moment from "moment";
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'BaseContainer',
 | 
			
		||||
  props: {
 | 
			
		||||
@@ -56,6 +60,14 @@ export default {
 | 
			
		||||
      type: Boolean,
 | 
			
		||||
      default: false
 | 
			
		||||
    },
 | 
			
		||||
    showTime: {
 | 
			
		||||
      type: Boolean,
 | 
			
		||||
      default: false
 | 
			
		||||
    },
 | 
			
		||||
    showYesTime: {
 | 
			
		||||
      type: Boolean,
 | 
			
		||||
      default: false
 | 
			
		||||
    },
 | 
			
		||||
    back: {
 | 
			
		||||
      type: String,
 | 
			
		||||
      default: ''
 | 
			
		||||
@@ -93,38 +105,52 @@ export default {
 | 
			
		||||
    return {
 | 
			
		||||
      curIndex: 0,
 | 
			
		||||
      time: null,
 | 
			
		||||
      time2:null
 | 
			
		||||
      time2: null,
 | 
			
		||||
      startTime: undefined,
 | 
			
		||||
      endTime: undefined
 | 
			
		||||
      // imgUrl: require(`../../../../assets/img/${this.back}.png`),
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  created() {
 | 
			
		||||
  },
 | 
			
		||||
  mounted () {
 | 
			
		||||
    this.time = this.format(new Date().setHours(7,0,0));
 | 
			
		||||
    // console.log(time);
 | 
			
		||||
    //前一天时间
 | 
			
		||||
    this.time2 = this.format(new Date().setHours(7, 0, 0) - 86400000 * 1);
 | 
			
		||||
    console.log(new Date().setHours(7, 0, 0) - 86400000 * 1);
 | 
			
		||||
    // this.time = this.format(new Date().setHours(7,0,0));
 | 
			
		||||
    // // console.log(time);
 | 
			
		||||
    // //前一天时间
 | 
			
		||||
    let nowTime = new Date
 | 
			
		||||
    let hour = nowTime.getHours()
 | 
			
		||||
    if (hour > 6) {
 | 
			
		||||
      this.startTime = moment(nowTime).format('yyyy.MM.DD') + ' 7点'
 | 
			
		||||
      this.endTime = moment(moment(nowTime) + 86400000).format('yyyy.MM.DD') + ' 7点'
 | 
			
		||||
    } else {
 | 
			
		||||
      this.endTime = moment(nowTime).format('yyyy.MM.DD') + ' 7点'
 | 
			
		||||
      this.startTime = moment(moment(nowTime) - 86400000).format('yyyy.MM.DD') + ' 7点'
 | 
			
		||||
    }
 | 
			
		||||
    // this.yesStartTime = moment(moment(nowTime) - 86400000).format('yyyy.MM.DD') + ' 0点'
 | 
			
		||||
    // this.yesEndTime = moment(moment(nowTime) - 86400000).format('yyyy.MM.DD') + ' 24点'
 | 
			
		||||
 | 
			
		||||
    // this.time2 = this.format(new Date().setHours(7, 0, 0) - 86400000 * 1);
 | 
			
		||||
    // console.log(new Date().setHours(7, 0, 0) - 86400000 * 1);
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    add0(m) {
 | 
			
		||||
      return m < 10 ? '0' + m : m
 | 
			
		||||
    },
 | 
			
		||||
    format(shijianchuo) {
 | 
			
		||||
      //shijianchuo是整数,否则要parseInt转换
 | 
			
		||||
      var time = new Date(shijianchuo);
 | 
			
		||||
      var y = time.getFullYear();
 | 
			
		||||
      var m = time.getMonth() + 1;
 | 
			
		||||
      var d = time.getDate();
 | 
			
		||||
      var h = time.getHours();
 | 
			
		||||
      var mm = time.getMinutes();
 | 
			
		||||
      var s = time.getSeconds();
 | 
			
		||||
      return y + '-' + this.add0(m) + '-' + this.add0(d) + ' ' + h + '时'
 | 
			
		||||
    },
 | 
			
		||||
    changeTab(num) {
 | 
			
		||||
      this.curIndex = num
 | 
			
		||||
      this.$emit('tabSelect', num)
 | 
			
		||||
    },
 | 
			
		||||
    // add0(m) {
 | 
			
		||||
    //   return m < 10 ? '0' + m : m
 | 
			
		||||
    // },
 | 
			
		||||
    // format(shijianchuo) {
 | 
			
		||||
    //   //shijianchuo是整数,否则要parseInt转换
 | 
			
		||||
    //   var time = new Date(shijianchuo);
 | 
			
		||||
    //   var y = time.getFullYear();
 | 
			
		||||
    //   var m = time.getMonth() + 1;
 | 
			
		||||
    //   var d = time.getDate();
 | 
			
		||||
    //   var h = time.getHours();
 | 
			
		||||
    //   var mm = time.getMinutes();
 | 
			
		||||
    //   var s = time.getSeconds();
 | 
			
		||||
    //   return y + '-' + this.add0(m) + '-' + this.add0(d) + ' ' + h + '时'
 | 
			
		||||
    // },
 | 
			
		||||
    // changeTab(num) {
 | 
			
		||||
    //   this.curIndex = num
 | 
			
		||||
    //   this.$emit('tabSelect', num)
 | 
			
		||||
    // },
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
 
 | 
			
		||||
@@ -2,7 +2,7 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zhp
 | 
			
		||||
 * @Date: 2023-09-21 09:06:28
 | 
			
		||||
 * @LastEditTime: 2024-01-17 15:26:04
 | 
			
		||||
 * @LastEditTime: 2024-01-29 15:39:59
 | 
			
		||||
 * @LastEditors: zhp
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
@@ -159,7 +159,7 @@ export default {
 | 
			
		||||
          itemWidth: 10,
 | 
			
		||||
          itemHeight: 10,
 | 
			
		||||
          top: '1%',
 | 
			
		||||
          right: '20px',
 | 
			
		||||
          // right: '20px',
 | 
			
		||||
          data: ['产线产量', '产线良品率'],
 | 
			
		||||
          textStyle: {
 | 
			
		||||
            fontSize: 12 * this.beilv,
 | 
			
		||||
@@ -287,6 +287,6 @@ export default {
 | 
			
		||||
</script>
 | 
			
		||||
<style>
 | 
			
		||||
.productChart{
 | 
			
		||||
  top: -40px;
 | 
			
		||||
  top: -10px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
@@ -1,7 +1,7 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zhp
 | 
			
		||||
 * @Date: 2023-09-21 09:06:28
 | 
			
		||||
 * @LastEditTime: 2024-01-17 13:56:46
 | 
			
		||||
 * @LastEditTime: 2024-01-29 15:14:40
 | 
			
		||||
 * @LastEditors: zhp
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
@@ -190,12 +190,12 @@ export default {
 | 
			
		||||
        // },
 | 
			
		||||
        yAxis: [
 | 
			
		||||
          {
 | 
			
		||||
            min: function() { // 取最小值向下取整为最小刻度
 | 
			
		||||
              return 0
 | 
			
		||||
            },
 | 
			
		||||
            max: function(value) { // 取最大值向上取整为最大刻度
 | 
			
		||||
              return Math.ceil(value.max)
 | 
			
		||||
            },
 | 
			
		||||
            // min: function() { // 取最小值向下取整为最小刻度
 | 
			
		||||
            //   return 0
 | 
			
		||||
            // },
 | 
			
		||||
            // max: function(value) { // 取最大值向上取整为最大刻度
 | 
			
		||||
            //   return Math.ceil(value.max)
 | 
			
		||||
            // },
 | 
			
		||||
            scale: true,
 | 
			
		||||
            type: 'value',
 | 
			
		||||
            name: '良品率/%',
 | 
			
		||||
@@ -233,12 +233,12 @@ export default {
 | 
			
		||||
            // },
 | 
			
		||||
          },
 | 
			
		||||
          {
 | 
			
		||||
            min: function() { // 取最小值向下取整为最小刻度
 | 
			
		||||
              return 0
 | 
			
		||||
            },
 | 
			
		||||
            max: function(value) { // 取最大值向上取整为最大刻度
 | 
			
		||||
              return Math.ceil(value.max)
 | 
			
		||||
            },
 | 
			
		||||
            // min: function() { // 取最小值向下取整为最小刻度
 | 
			
		||||
            //   return 0
 | 
			
		||||
            // },
 | 
			
		||||
            // max: function(value) { // 取最大值向上取整为最大刻度
 | 
			
		||||
            //   return Math.ceil(value.max)
 | 
			
		||||
            // },
 | 
			
		||||
            scale: true,
 | 
			
		||||
            type: 'value',
 | 
			
		||||
            name: '产量/㎡', // y轴上方的单位
 | 
			
		||||
 
 | 
			
		||||
@@ -2,7 +2,7 @@
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2021-07-19 15:18:30
 | 
			
		||||
 * @LastEditors: zhp
 | 
			
		||||
 * @LastEditTime: 2024-01-25 17:55:51
 | 
			
		||||
 * @LastEditTime: 2024-01-29 15:29:39
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
@@ -80,7 +80,7 @@
 | 
			
		||||
 | 
			
		||||
      <el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="12" type="flex" class="flex-1">
 | 
			
		||||
        <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="12">
 | 
			
		||||
          <base-container :no-content-padding="true" :height="256" :size="'middle'" :title="'能源监控'"
 | 
			
		||||
          <base-container :show-yes-time="true" :no-content-padding="true" :height="256" :size="'middle'" :title="'能源监控'"
 | 
			
		||||
            :title-icon="'energyMonitoring'">
 | 
			
		||||
            <!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
 | 
			
		||||
              <top-radio-group />
 | 
			
		||||
@@ -103,8 +103,8 @@
 | 
			
		||||
          </base-container>
 | 
			
		||||
        </el-col>
 | 
			
		||||
        <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="12">
 | 
			
		||||
          <base-container :no-content-padding="true" :height="318 + 338 + 16" :size="'middle'" :title="'产线产量及良品率'"
 | 
			
		||||
            :title-icon="'productLine'">
 | 
			
		||||
          <base-container :show-time="true" :no-content-padding="true" :height="318 + 338 + 16" :size="'middle'"
 | 
			
		||||
            :title="'产线产量及良品率'" :title-icon="'productLine'">
 | 
			
		||||
            <!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
 | 
			
		||||
              <top-radio-group />
 | 
			
		||||
            </div> -->
 | 
			
		||||
@@ -611,6 +611,10 @@ export default {
 | 
			
		||||
    // this.fetchList('line-chart-data')
 | 
			
		||||
    this.init()
 | 
			
		||||
  },
 | 
			
		||||
  destroyed () {
 | 
			
		||||
    this.websocketClose()
 | 
			
		||||
    this.SJGWebsocketClose()
 | 
			
		||||
  },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    this.getList()
 | 
			
		||||
    this.initWebSocket()
 | 
			
		||||
@@ -828,6 +832,7 @@ export default {
 | 
			
		||||
          this.SJGWsData.detData.forEach((ele) => {
 | 
			
		||||
            if (item.id == ele.productionLineId) {
 | 
			
		||||
              if (item.name.substr(0, 1) == "D") {
 | 
			
		||||
                console.log(ele)
 | 
			
		||||
                nameList.push(item.name)
 | 
			
		||||
                outputNumList.push(ele.outputNum)
 | 
			
		||||
                passRateList.push(ele.passRate * 100)
 | 
			
		||||
@@ -868,9 +873,9 @@ export default {
 | 
			
		||||
    //   this.websocket.send('11111')
 | 
			
		||||
    // },
 | 
			
		||||
    // // 关闭
 | 
			
		||||
    // SJGWebsocketClose(e) {
 | 
			
		||||
    //   console.log('WebSocket 断开连接', e)
 | 
			
		||||
    // },
 | 
			
		||||
    SJGWebsocketClose(e) {
 | 
			
		||||
      console.log('WebSocket 断开连接', e)
 | 
			
		||||
    },
 | 
			
		||||
    // // 连接建立之后执行send方法发送数据
 | 
			
		||||
    websocketOnOpen() {
 | 
			
		||||
      console.log('socket连接成功')
 | 
			
		||||
 
 | 
			
		||||
@@ -0,0 +1,280 @@
 | 
			
		||||
<!--
 | 
			
		||||
    filename: dialogForm.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-09-11 15:55:13
 | 
			
		||||
    description: DialogForm for equipmentBindSection only
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
  <el-form ref="dataForm" :model="dataForm" label-width="120px" v-loading="formLoading" label-position="top">
 | 
			
		||||
    <el-row :gutter="20">
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="产线" prop="productionLineId"
 | 
			
		||||
          :rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
 | 
			
		||||
          <el-select v-model="dataForm.productionLineId" placeholder="请选择产线" filterable
 | 
			
		||||
            @change="handleProductlineChange">
 | 
			
		||||
            <el-option v-for="opt in productionLineList" :key="opt.value" :label="opt.label" :value="opt.value" />
 | 
			
		||||
          </el-select>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="工段" prop="sectionId" :rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
 | 
			
		||||
          <el-select v-model="dataForm.sectionId" placeholder="请选择工段" filterable @change="$emit('update', dataForm)">
 | 
			
		||||
            <el-option v-for="opt in workshopSectionList" :key="opt.value" :label="opt.label" :value="opt.value" />
 | 
			
		||||
          </el-select>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span="24">
 | 
			
		||||
        <el-form-item label="检测内容" prop="inspectionDetIdList"
 | 
			
		||||
          :rules="[{ required: true, message: '不能为空', trigger: 'change' }]">
 | 
			
		||||
          <div class="itemDet" v-for="item in inspectionDetList" :key="item.typeId" style="padding: 0 20px;">
 | 
			
		||||
            <div>{{ item.typeName}} </div>
 | 
			
		||||
            <!-- <div>{{ item.data }} </div> -->
 | 
			
		||||
            <div class="content">
 | 
			
		||||
              <el-checkbox-group v-model="dataForm.inspectionDetIdList" @change="handleCheckedCitiesChange">
 | 
			
		||||
                <el-checkbox v-for="i in item.data" :key="i.content" :label="i.detId">{{ i.content }}
 | 
			
		||||
                </el-checkbox>
 | 
			
		||||
              </el-checkbox-group>
 | 
			
		||||
            </div>
 | 
			
		||||
          </div>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <!-- <el-col :span="12">
 | 
			
		||||
        <el-form-item label="按钮盒识别码" prop="buttonId" :rules="[
 | 
			
		||||
        	{ required: true, message: '不能为空', trigger: 'blur' },
 | 
			
		||||
        	{
 | 
			
		||||
        		type: 'number',
 | 
			
		||||
        		message: '请输入整数',
 | 
			
		||||
        		trigger: 'blur',
 | 
			
		||||
        		transform: (val) => Number.isInteger(Number(val)) && Number(val),
 | 
			
		||||
        	},
 | 
			
		||||
        ]">
 | 
			
		||||
          <el-input v-model="dataForm.buttonId" @change="$emit('update', dataForm)" placeholder="请输入整数" />
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="按钮值" prop="keyValue" :rules="[
 | 
			
		||||
        	{ required: true, message: '不能为空', trigger: 'blur' },
 | 
			
		||||
        	{
 | 
			
		||||
        		type: 'number',
 | 
			
		||||
        		message: '请输入100以内的整数',
 | 
			
		||||
        		trigger: 'blur',
 | 
			
		||||
        		transform: (val) =>
 | 
			
		||||
        			Number.isInteger(+val) &&
 | 
			
		||||
        			Number(val) >= 0 &&
 | 
			
		||||
        			Number(val) <= 100 &&
 | 
			
		||||
        			Number(val),
 | 
			
		||||
        	},
 | 
			
		||||
        ]">
 | 
			
		||||
          <el-input v-model="dataForm.keyValue" type="number" min="0" max="100" @change="$emit('update', dataForm)"
 | 
			
		||||
            placeholder="请输入按钮盒模式" />
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
 | 
			
		||||
      <el-col :span="12">
 | 
			
		||||
        <el-form-item label="检测内容" prop="inspectionDetContent"
 | 
			
		||||
          :rules="[{ required: true, message: '不能为空', trigger: 'change' }]">
 | 
			
		||||
          <el-select v-model="dataForm.inspectionDetContent" placeholder="请选择检测内容" filterable
 | 
			
		||||
            @change="$emit('update', dataForm)">
 | 
			
		||||
            <el-option v-for="opt in inspectionDetList" :key="opt.value" :label="opt.label" :value="opt.value" />
 | 
			
		||||
          </el-select>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col> -->
 | 
			
		||||
    </el-row>
 | 
			
		||||
  </el-form>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import basicAdd from '../../mixins/basic-add';
 | 
			
		||||
import {
 | 
			
		||||
  createQualityInspectionBoxBtn,
 | 
			
		||||
  updateQualityInspectionBoxBtn,
 | 
			
		||||
  getQualityInspectionBoxBtn,
 | 
			
		||||
  getListByLineSection
 | 
			
		||||
} from '@/api/base/qualityInspectionBoxBtn';
 | 
			
		||||
export default {
 | 
			
		||||
  mixins: [basicAdd],
 | 
			
		||||
	data() {
 | 
			
		||||
    return {
 | 
			
		||||
      urlOptions: {
 | 
			
		||||
        // isGetCode: false,
 | 
			
		||||
        // codeURL: getCode,
 | 
			
		||||
        createURL: createQualityInspectionBoxBtn,
 | 
			
		||||
        updateURL: updateQualityInspectionBoxBtn,
 | 
			
		||||
        infoURL: getQualityInspectionBoxBtn,
 | 
			
		||||
      },
 | 
			
		||||
      dataForm: {
 | 
			
		||||
        // id: null,
 | 
			
		||||
        sectionId: null,
 | 
			
		||||
        productionLineId: null,
 | 
			
		||||
        inspectionDetIdList:[],
 | 
			
		||||
      },
 | 
			
		||||
			formLoading: true,
 | 
			
		||||
      productionLineList: [],
 | 
			
		||||
      inspectionDetList:[],
 | 
			
		||||
			workshopSectionList: [],
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {
 | 
			
		||||
    this.getProductionLineList()
 | 
			
		||||
    this.getQualityInspectionDetList()
 | 
			
		||||
    // this.getList()
 | 
			
		||||
		// this.getWorksectionList();
 | 
			
		||||
		// this.getCode('/base/equipment-group-alarm/getCode').then((code) => {
 | 
			
		||||
		// 	this.formLoading = false;
 | 
			
		||||
		// 	this.$emit('update', {
 | 
			
		||||
		// 		...this.dataForm,
 | 
			
		||||
		// 		code,
 | 
			
		||||
		// 	});
 | 
			
		||||
		// });
 | 
			
		||||
	},
 | 
			
		||||
	watch: {
 | 
			
		||||
		'dataForm.productionId': {
 | 
			
		||||
			handler(id) {
 | 
			
		||||
				if (id != null) this.getWorksectionList(id)
 | 
			
		||||
			},
 | 
			
		||||
			immediate: true
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
  methods: {
 | 
			
		||||
    init(obj) {
 | 
			
		||||
      // console.log(productionLineId);
 | 
			
		||||
      console.log(obj);
 | 
			
		||||
      this.visible = true
 | 
			
		||||
      // if(obj.id)
 | 
			
		||||
      if (obj) {
 | 
			
		||||
        this.dataForm.id = obj.id || null;
 | 
			
		||||
      }
 | 
			
		||||
      this.$nextTick(() => {
 | 
			
		||||
        this.$refs["dataForm"].resetFields()
 | 
			
		||||
        if (obj) {
 | 
			
		||||
          getListByLineSection({
 | 
			
		||||
            productionLineId: obj.productionLineId,
 | 
			
		||||
            sectionId: obj.sectionId,
 | 
			
		||||
          }).then((res) => {
 | 
			
		||||
            console.log(res);
 | 
			
		||||
            this.dataForm.inspectionDetIdList = res.data
 | 
			
		||||
            this.dataForm.productionLineId = obj.productionLineId
 | 
			
		||||
            this.getWorksectionList(obj.productionLineId)
 | 
			
		||||
            this.dataForm.sectionId = obj.sectionId
 | 
			
		||||
          })
 | 
			
		||||
        }
 | 
			
		||||
        if (this.dataForm.id) {
 | 
			
		||||
          console.log(1111);
 | 
			
		||||
          this.urlOptions.infoURL(obj.id).then(response => {
 | 
			
		||||
            this.dataForm.id = response.data.id
 | 
			
		||||
 | 
			
		||||
            // if (this.setData) {
 | 
			
		||||
            //   this.setDataForm()
 | 
			
		||||
            // }
 | 
			
		||||
          });
 | 
			
		||||
        } else {
 | 
			
		||||
          // if (this.urlOptions.isGetCode) {
 | 
			
		||||
          //   this.getCode()
 | 
			
		||||
          // }
 | 
			
		||||
        }
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
    /** 模拟透传 ref  */
 | 
			
		||||
    handleCheckedCitiesChange(value) {
 | 
			
		||||
      ;console.log(value);
 | 
			
		||||
      // let checkedCount = value.length;
 | 
			
		||||
      // this.checkAll = checkedCount === this.cities.length;
 | 
			
		||||
      // this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
 | 
			
		||||
    },
 | 
			
		||||
    // getList() {
 | 
			
		||||
    //   console.log(this.dataForm.sectionId);
 | 
			
		||||
 | 
			
		||||
    // },
 | 
			
		||||
		validate(cb) {
 | 
			
		||||
			return this.$refs.form.validate(cb);
 | 
			
		||||
		},
 | 
			
		||||
		resetFields(args) {
 | 
			
		||||
			return this.$refs.form.resetFields(args);
 | 
			
		||||
		},
 | 
			
		||||
		async getProductionLineList() {
 | 
			
		||||
			this.formLoading = true;
 | 
			
		||||
			const res = await this.$axios({
 | 
			
		||||
				url: '/base/core-production-line/listAll',
 | 
			
		||||
				method: 'get',
 | 
			
		||||
			});
 | 
			
		||||
			if (res.code == 0) {
 | 
			
		||||
				this.productionLineList = res.data.map((item) => ({
 | 
			
		||||
					label: item.name,
 | 
			
		||||
					value: item.id,
 | 
			
		||||
				}));
 | 
			
		||||
			}
 | 
			
		||||
			this.formLoading = false;
 | 
			
		||||
		},
 | 
			
		||||
    async getQualityInspectionDetList() {
 | 
			
		||||
      this.formLoading = true;
 | 
			
		||||
      const res = await this.$axios({
 | 
			
		||||
        url: '/base/quality-inspection-det/inspectionMap',
 | 
			
		||||
        method: 'get',
 | 
			
		||||
      });
 | 
			
		||||
      if (res.code == 0) {
 | 
			
		||||
        console.log(res)
 | 
			
		||||
        let arr = []
 | 
			
		||||
        for (let i in res.data) {
 | 
			
		||||
          let obj = {
 | 
			
		||||
            typeName: res.data[i].length !== 0 ? res.data[i][0].typeName : '',
 | 
			
		||||
            typeId: res.data[i].length !== 0 ? res.data[i][0].typeId : '',
 | 
			
		||||
            data:[]
 | 
			
		||||
          }
 | 
			
		||||
          let detArr = []
 | 
			
		||||
          res.data[i].forEach(ele => {
 | 
			
		||||
            detArr.push({
 | 
			
		||||
              detId: ele.id,
 | 
			
		||||
              content: ele.content
 | 
			
		||||
            })
 | 
			
		||||
          })
 | 
			
		||||
          obj.data = detArr
 | 
			
		||||
          arr.push(obj)
 | 
			
		||||
        }
 | 
			
		||||
        this.inspectionDetList = arr
 | 
			
		||||
        console.log(this.inspectionDetList);
 | 
			
		||||
        // this.inspectionDetList = res.data.map((item) => ({
 | 
			
		||||
        //   label: item.content,
 | 
			
		||||
        //   value: item.content,
 | 
			
		||||
        // }));
 | 
			
		||||
      }
 | 
			
		||||
      this.formLoading = false;
 | 
			
		||||
    },
 | 
			
		||||
		async getWorksectionList(id) {
 | 
			
		||||
			this.formLoading = true;
 | 
			
		||||
			const res = await this.$axios({
 | 
			
		||||
				url: '/base/core-workshop-section/listByParentId',
 | 
			
		||||
				method: 'get',
 | 
			
		||||
				params: {
 | 
			
		||||
					id,
 | 
			
		||||
				},
 | 
			
		||||
			});
 | 
			
		||||
			if (res.code == 0) {
 | 
			
		||||
				this.workshopSectionList = res.data.map((item) => ({
 | 
			
		||||
					label: item.name,
 | 
			
		||||
					value: item.id,
 | 
			
		||||
				}));
 | 
			
		||||
			}
 | 
			
		||||
			this.formLoading = false;
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		async handleProductlineChange(id) {
 | 
			
		||||
			await this.getWorksectionList(id);
 | 
			
		||||
			this.dataForm.sectionId = null;
 | 
			
		||||
			this.$emit('update', this.dataForm);
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		// async getCode(url) {
 | 
			
		||||
		// 	const response = await this.$axios(url);
 | 
			
		||||
		// 	return response.data;
 | 
			
		||||
		// },
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.el-date-editor,
 | 
			
		||||
.el-select {
 | 
			
		||||
	width: 100%;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -0,0 +1,222 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="app-container">
 | 
			
		||||
    <!-- 搜索工作栏 -->
 | 
			
		||||
    <SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" @headBtnClick="buttonClick" />
 | 
			
		||||
 | 
			
		||||
    <!-- 列表 -->
 | 
			
		||||
    <base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" :table-data="tableData">
 | 
			
		||||
      <method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" fixed="right" :method-list="tableBtn"
 | 
			
		||||
        @clickBtn="handleClick" />
 | 
			
		||||
    </base-table>
 | 
			
		||||
 | 
			
		||||
    <!-- 分页组件 -->
 | 
			
		||||
    <!-- <pagination :limit.sync="listQuery.pageSize" :page.sync="listQuery.pageNo" :total="listQuery.total"
 | 
			
		||||
      @pagination="getDataList" /> -->
 | 
			
		||||
 | 
			
		||||
    <!-- 对话框(添加 / 修改) -->
 | 
			
		||||
    <base-dialog :dialogTitle="addOrEditTitle" :dialogVisible="addOrUpdateVisible" width="50%" @cancel="handleCancel"
 | 
			
		||||
      @confirm="handleConfirm" :before-close="handleCancel">
 | 
			
		||||
      <add-or-update ref="addOrUpdate" @refreshDataList="successSubmit"></add-or-update>
 | 
			
		||||
    </base-dialog>
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import {
 | 
			
		||||
	createQualityInspectionBoxBtn,
 | 
			
		||||
	updateQualityInspectionBoxBtn,
 | 
			
		||||
	deleteQualityInspectionBoxBtn,
 | 
			
		||||
	getQualityInspectionBoxBtn,
 | 
			
		||||
	getQualityInspectionBoxBtnPage,
 | 
			
		||||
  exportQualityInspectionBoxBtnExcel,
 | 
			
		||||
  getUserList
 | 
			
		||||
} from '@/api/base/qualityInspectionBoxPermissions';
 | 
			
		||||
import basicPage from '../../mixins/basic-page';
 | 
			
		||||
import moment from 'moment';
 | 
			
		||||
import addOrUpdate from './dialogForm.vue';
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'QualityInspectionBoxBtn',
 | 
			
		||||
  mixins: [basicPage],
 | 
			
		||||
  components: { addOrUpdate },
 | 
			
		||||
	data() {
 | 
			
		||||
    return {
 | 
			
		||||
      urlOptions: {
 | 
			
		||||
        getDataListURL: getQualityInspectionBoxBtnPage,
 | 
			
		||||
        deleteURL: deleteQualityInspectionBoxBtn,
 | 
			
		||||
        // exportURL: exportFactoryExcel,
 | 
			
		||||
      },
 | 
			
		||||
			searchBarFormConfig: [
 | 
			
		||||
        {
 | 
			
		||||
          type: 'select',
 | 
			
		||||
          label: '用户名称',
 | 
			
		||||
          selectOptions: [],
 | 
			
		||||
          labelField: 'name',
 | 
			
		||||
          valueField: 'id',
 | 
			
		||||
          param: 'userName',
 | 
			
		||||
        },
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '查询',
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
          type: this.$auth.hasPermi('base:quality-inspection-box-permissions:create')
 | 
			
		||||
						? 'button'
 | 
			
		||||
						: '',
 | 
			
		||||
					btnName: '新增',
 | 
			
		||||
					name: 'add',
 | 
			
		||||
					plain: true,
 | 
			
		||||
					color: 'success',
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
			tableBtn: [
 | 
			
		||||
        this.$auth.hasPermi('base:quality-inspection-box-permissions:update')
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'edit',
 | 
			
		||||
							btnName: '修改',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
        this.$auth.hasPermi('base:quality-inspection-box-permissions:delete')
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'delete',
 | 
			
		||||
							btnName: '删除',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
      ].filter((v) => v),
 | 
			
		||||
      tableData: [],
 | 
			
		||||
 | 
			
		||||
			tableProps: [
 | 
			
		||||
				// {
 | 
			
		||||
				// 	prop: 'createTime',
 | 
			
		||||
				// 	label: '添加时间',
 | 
			
		||||
				// 	fixed: true,
 | 
			
		||||
				// 	width: 180,
 | 
			
		||||
				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 | 
			
		||||
				// },
 | 
			
		||||
				{
 | 
			
		||||
          prop: 'productionLineName',
 | 
			
		||||
					label: '用户名',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					prop: 'sectionName',
 | 
			
		||||
					label: '用户昵称',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
          prop: 'inspectionInfoList',
 | 
			
		||||
					label: '产线及工段',
 | 
			
		||||
				}
 | 
			
		||||
			],
 | 
			
		||||
			// 查询参数
 | 
			
		||||
			listQuery: {
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
				pageSize: 10,
 | 
			
		||||
				inspectionDetContent: null,
 | 
			
		||||
      },
 | 
			
		||||
      addOrUpdateVisible: false,
 | 
			
		||||
      addOrEditTitle:'',
 | 
			
		||||
			// 搜索框需要的 keys, 与上面 listQuery 的除 pageNo, pageSize 之外的 key 一一对应
 | 
			
		||||
			searchBarKeys: ['inspectionDetContent'],
 | 
			
		||||
			form: {
 | 
			
		||||
				id: null,
 | 
			
		||||
				buttonId: null,
 | 
			
		||||
        inspectionDetContent: [],
 | 
			
		||||
        productionLineId: null,
 | 
			
		||||
				sectionId: null,
 | 
			
		||||
				model: null,
 | 
			
		||||
				keyValue: null,
 | 
			
		||||
			},
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	created() {
 | 
			
		||||
    this.getDict()
 | 
			
		||||
	},
 | 
			
		||||
  methods: {
 | 
			
		||||
    getDict() {
 | 
			
		||||
      getUserList({
 | 
			
		||||
        pageNo: 1,
 | 
			
		||||
        pageSize:999
 | 
			
		||||
      }).then((res) => {
 | 
			
		||||
        this.searchBarFormConfig[0].selectOptions = res.data
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    getDataList() {
 | 
			
		||||
      this.dataListLoading = true;
 | 
			
		||||
      this.urlOptions.getDataListURL(this.listQuery).then(response => {
 | 
			
		||||
        this.tableData = response.data.map((item) => {
 | 
			
		||||
          // console.log(item);
 | 
			
		||||
          return {
 | 
			
		||||
            inspectionInfoList: item.inspectionInfoList.toString(),
 | 
			
		||||
            productionLineId:item.productionLineId,
 | 
			
		||||
            productionLineName:item.productionLineName,
 | 
			
		||||
            sectionId: item.sectionId,
 | 
			
		||||
            sectionName: item.sectionName
 | 
			
		||||
         }
 | 
			
		||||
        })
 | 
			
		||||
        this.listQuery.total = response.data.total;
 | 
			
		||||
        this.dataListLoading = false;
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
		reset() {
 | 
			
		||||
			this.form = {
 | 
			
		||||
				id: null,
 | 
			
		||||
				buttonId: null,
 | 
			
		||||
				inspectionDetContent: null,
 | 
			
		||||
				productionId: null,
 | 
			
		||||
				sectionId: null,
 | 
			
		||||
				model: null,
 | 
			
		||||
				keyValue: null,
 | 
			
		||||
			};
 | 
			
		||||
			this.resetForm('form');
 | 
			
		||||
    },
 | 
			
		||||
    deleteHandle(id, name, index, data) {
 | 
			
		||||
      this.$confirm(`确认要删除产线名为${data.productionLineName}的数据项?`, "提示", {
 | 
			
		||||
        confirmButtonText: "确定",
 | 
			
		||||
        cancelButtonText: "取消",
 | 
			
		||||
        type: "warning",
 | 
			
		||||
      })
 | 
			
		||||
        .then(() => {
 | 
			
		||||
          this.urlOptions.deleteURL(id).then(({ data }) => {
 | 
			
		||||
            this.$message({
 | 
			
		||||
              message: "操作成功",
 | 
			
		||||
              type: "success",
 | 
			
		||||
              duration: 1500,
 | 
			
		||||
              onClose: () => {
 | 
			
		||||
                this.getDataList();
 | 
			
		||||
              },
 | 
			
		||||
            });
 | 
			
		||||
          });
 | 
			
		||||
        })
 | 
			
		||||
        .catch(() => { });
 | 
			
		||||
    },
 | 
			
		||||
    buttonClick(val) {
 | 
			
		||||
      switch (val.btnName) {
 | 
			
		||||
        case 'search':
 | 
			
		||||
          this.listQuery.pageNo = 1;
 | 
			
		||||
          this.listQuery.pageSize = 10;
 | 
			
		||||
          this.listQuery.inspectionDetContent = val.inspectionDetContent ? val.inspectionDetContent : undefined;
 | 
			
		||||
          // this.listQuery.teamId = val.teamId ? val.teamId : undefined;
 | 
			
		||||
          this.getDataList()
 | 
			
		||||
          break;
 | 
			
		||||
        case 'add':
 | 
			
		||||
          this.addOrEditTitle = '新增';
 | 
			
		||||
          this.addOrUpdateVisible = true;
 | 
			
		||||
          // this.addOrUpdateVisible = true;
 | 
			
		||||
          this.$nextTick(() => {
 | 
			
		||||
            this.$refs.addOrUpdate.init();
 | 
			
		||||
          });
 | 
			
		||||
          break;
 | 
			
		||||
        case 'export':
 | 
			
		||||
          this.handleExport();
 | 
			
		||||
          break;
 | 
			
		||||
        default:
 | 
			
		||||
          console.log(val);
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
@@ -118,7 +118,7 @@ export default {
 | 
			
		||||
				{
 | 
			
		||||
					type: 'datePicker',
 | 
			
		||||
					label: '时间段',
 | 
			
		||||
					dateType: 'daterange', // datetimerange
 | 
			
		||||
          dateType: 'datetimerange', // datetimerange
 | 
			
		||||
					// format: 'yyyy-MM-dd HH:mm:ss',
 | 
			
		||||
          format: 'yyyy-MM-dd HH:mm:ss',
 | 
			
		||||
          valueFormat: 'yyyy-MM-dd HH:mm:ss',
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user