<template>
  <div
    style="width: 99.3%; height: 99.5%; background-color: white;position: relative;border: 2px solid #9e9b9b; margin-left: 2px">
    <el-row style=" width: 100%;height: 100%; background-color: #d7dee6">
      <el-col :span="12" style="height: 100%;">
        <el-row style="height: 99%;margin-left: 4px">
          <el-table :data="processList_table" :header-cell-style="{ background: '#F5F5F5' }" height="99%" stripe
            style="margin-top: 10px; width: 100%; height: 100%; border: 1px solid #9e9b9b; font-weight: lighter;color: #000;"
            tooltip-effect="dark">
            <el-table-column align="center" label="编号" width="70px">
              <template #default="scope">
                <div style="white-space: pre-line !important;">{{ scope.row.质检项编号 }}</div>
              </template>
            </el-table-column>
            <el-table-column label="质检项描述" min-width="120px">
              <template #default="scope">
                <div style="white-space: pre-line !important;">{{ scope.row.质检项描述 }}</div>
              </template>
            </el-table-column>
            <el-table-column label="符合标准及条例" min-width="50px">
              <template #default="scope">
                <div style="white-space: pre-line !important;">{{ scope.row.符合标准及条例 }}</div>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
        <!--<el-row style="margin-top: 5px;margin-left: 4px; height: 48%">-->
        <!--  <el-table-->
        <!--      :cell-class-name="cellClassName"-->
        <!--      :data="materialList_table"-->
        <!--      :header-cell-style="{background:'#F5F5F5'}"-->
        <!--      height="99%"-->
        <!--      stripe-->
        <!--      style="margin-top: 10px; width: 100%; height: 95%; border: 1px solid #9e9b9b"-->
        <!--      tooltip-effect="dark"-->
        <!--  >-->
        <!--    <el-table-column align="center" label=" " show-overflow-tooltip type="index" width="30px"/>-->
        <!--    <el-table-column align="center" label="零件图号" width="150px">-->
        <!--      <template #default="scope">-->
        <!--        {{ scope.row.零件图号 }}-->
        <!--      </template>-->
        <!--    </el-table-column>-->
        <!--    <el-table-column align="center" label="零件名称">-->
        <!--      <template #default="scope">-->
        <!--        {{ scope.row.零件名称 }}-->
        <!--      </template>-->
        <!--    </el-table-column>-->
        <!--    <el-table-column align="center" label="用量" width="80px">-->
        <!--      <template #default="scope">-->
        <!--        {{ scope.row.零件数量 }}-->
        <!--      </template>-->
        <!--    </el-table-column>-->
        <!--    &lt;!&ndash;            <el-table-column align="center" label="批次号" width="120">&ndash;&gt;-->
        <!--    &lt;!&ndash;              <template #default="scope">&ndash;&gt;-->
        <!--    &lt;!&ndash;                {{ scope.row.零件批号 }}&ndash;&gt;-->
        <!--    &lt;!&ndash;              </template>&ndash;&gt;-->
        <!--    &lt;!&ndash;            </el-table-column>&ndash;&gt;-->
        <!--    <el-table-column align="center" label="物料条码" min-width="130px">-->
        <!--      <template #default="scope">-->
        <!--        {{ scope.row.物料条码 }}-->
        <!--      </template>-->
        <!--    </el-table-column>-->
        <!--  </el-table>-->
        <!--</el-row>-->
      </el-col>
      <el-col :span="12" style="padding: 10px; height: 100%">
        <div id="ww" style="width: 100%; height: 100%; position: relative">
          <img :src="pic" style="height: 640px; width: 770px">
          <div v-for="(item, index) in tighteningPosition" :key="index" :class="changBP(item)"
            :style="{ left: item.测量位置X + 'px', top: item.测量位置Y + 'px', height: item.控件高度 + 'px', width: item.控件宽度 + 'px' }" />
          <mes-web-fun04 v-if="MesWebCode === 4" />
          <mes-web-fun08 v-if="MesWebCode === 8" />
          <mes-web-fun08 v-if="MesWebCode === 28" />
          <mes-web-fun08 v-if="MesWebCode === 29" />
          <mes-web-fun22 v-if="MesWebCode === 3" />
          <div style="display: flex;margin: 10px 0 0 0">
            <el-button style="height: 80px;width: 200px;font-size: 26px;" type="warning" @click="getCheckDataInput">检查录入
            </el-button>
            <el-button style="height: 80px;width: 200px;font-size: 26px;" type="warning"
              @click="getImgCheckDirectFileList">QC指导文件
            </el-button>
            <!-- <el-button style="height: 80px;width: 200px;font-size: 26px;" type="warning"
              v-if="$store.state.station.stationName == 'OP010'" @click="callAGVSideshift">平移至通道
            </el-button> -->
            <!-- <el-button style="height: 80px;width: 200px;font-size: 26px;" type="danger" @click="showDebugButtons">AGV操作按钮
            </el-button> -->
          </div>
          <div style="display: flex;margin: 10px 0 0 0">
            <el-button v-if="$store.state.station.stationName == 'OP010'"
              style="height: 80px;width: 200px;font-size: 26px;" type="success" @click="selectOrderForm">计划选择
            </el-button>
            <!-- <el-button style="height: 80px;width: 200px;font-size: 26px;" type="success"
              @click="outLineOpNameWorkOver">装配完工
            </el-button> -->
            <el-button v-if="$store.state.station.stationName == 'OP010'"
              style="height: 80px;width: 200px;font-size: 26px;" type="success" @click="printBarcode">打印条码
            </el-button>
            <!-- <el-button v-if="$store.state.station.stationName == 'OP010'"
              style="height: 80px;width: 200px;font-size: 26px;" type="success" @click="reprintBarcode">补打条码
            </el-button> -->
            <!-- <el-button style="height: 80px;width: 200px;font-size: 26px;" type="warning" @click="processRelease">工艺放行
            </el-button> -->
          </div>
        </div>
      </el-col>
    </el-row>
    <div id="smile" style="width: 100px; height: 100px; top: 180px; left: 1080px;position: absolute">
      <img v-if="smile === 1" src="../../assets/image/greenFace.png" style="width: 220px; height: 220px">
      <img v-else-if="smile === 2" src="../../assets/image/redFace.png" style="width: 220px; height: 220px">
      <img v-else-if="smile === 3" src="../../assets/image/MatchSuccess.png" style="width: 196px; height: 220px">
      <img v-else-if="smile === 4" src="../../assets/image/MatchFail.png" style="width: 196px; height: 220px">
      <img v-else src="../../assets/image/nothing.png">
    </div>

    <el-dialog :append-to-body="true" :visible.sync="imgCheckDialogFormVisible" center style="text-align: center"
      title="指导文件列表" width="850px">
      <div style="text-align: center">
        <el-form label-position="left" label-width="130px" style="width: 100%;margin: auto">
          <el-table :data="imgCheckDirectFileList" max-height="365px" size="small"
            style="width: 100%; height: 280px; font-size: 20px; color: #000; border: 1px solid #9e9b9b">
            <el-table-column align="center" label="排序" type="index" width="100">
            </el-table-column>
            <el-table-column align="center" label="文件名称" prop="文件名称" />
            <el-table-column align="center" label="导入时间" prop="操作时间" />
            <el-table-column align="center" label="查看文件" width="150">
              <template slot-scope="scope2">
                <el-button type="warning" @click="imgCheckDirectFile(scope2.row)">打开指导文件</el-button>
              </template>
            </el-table-column>
          </el-table>
          <!--底部按钮-->
          <div style="text-align: center; margin-top: 20px">
            <el-button class="el-icon-close" @click="imgCheckDialogFormVisible = false">关闭</el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
    <el-dialog v-el-drag-dialog :append-to-body="true" :visible.sync="opNameInputDataVisible" center
      style="text-align: center" title="录入数据" width="415px">
      <div style="text-align: center">
        <el-form :model="opNameInputDataForm" label-position="right" label-width="100px"
          style="width: 100%;margin: auto">
          <el-form-item label="数据类型" prop="engineTypeValue" style="text-align: right;width: 90%">
            <el-select v-model="opNameInputDataForm.dataType" placeholder="请选择数据类型" size="small"
              @change="getOpNameInputDataList(2, $event)">
              <el-option v-for="item in opNameInputDataTypeList" :key="item" :label="item" :value="item" size="mini" />
            </el-select>
          </el-form-item>
          <el-form-item label="数据名称" prop="engineTypeValue" style="text-align: right;width: 90%">
            <el-select v-model="opNameInputDataForm.dataName" placeholder="请选择数据名称" size="small">
              <el-option v-for="item in opNameInputDataNameList" :key="item" :label="item" :value="item" size="mini" />
            </el-select>
          </el-form-item>
          <el-form-item label="记录值" prop="engineTypeValue" style="width: 90%">
            <el-input v-model="opNameInputDataForm.dataValue" placeholder="请输入记录值" size="small" style="width:200px;" />
          </el-form-item>
          <!--底部按钮-->
          <div style="text-align: center; margin-top: 20px">
            <el-button class="el-icon-check" type="primary" @click="opNameInputDataSubmit()">确定</el-button>
            <el-button class="el-icon-close" style="margin-left: 50px" @click="opNameInputDataVisible = false">关闭
            </el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
    <el-dialog v-el-drag-dialog :append-to-body="true" :visible.sync="checkDataInputVisible" center
      style="text-align: center" title="录入检查项" width="750px">
      <div style="text-align: center">
        <el-form :model="opNameInputDataForm" label-position="right" label-width="300px" max-height="600px"
          style="width: 100%;margin: left;overflow: auto">
          <el-form-item :label="item.质检项分类 + '-' + item.质检项描述" prop="engineTypeValue" style="width: 90%"
            v-for="item in checkDataInputList" :key="item.ID">
            <el-input v-model="item.检验结果" :placeholder="item.符合标准及条例" size="small" style="width:400px;" />
          </el-form-item>
          <!--底部按钮-->
          <div style="text-align: center; margin-top: 20px;">
            <el-button class="el-icon-check" type="primary" @click="saveCheckInputDataList()">保存</el-button>
            <el-button class="el-icon-close" style="margin-left: 50px" @click="checkDataInputVisible = false">关闭
            </el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
    <el-dialog v-el-drag-dialog :append-to-body="true" :visible.sync="selectOrderFormVisible" center
      style="text-align: center" title="计划选择" width="90%">
      <div style="text-align: center">
        <el-table :data="selectOrderFormList" max-height="600px" size="small"
          style="width: 100%; font-size: 10px !important; color: #000; border: 1px solid #9e9b9b">
          <el-table-column align="center" label="序号" type="index" width="80" />
          <el-table-column align="center" label="制造编号" prop="制造编号" />
          <el-table-column align="center" label="项目名称" prop="项目名称" />
          <el-table-column align="center" label="间隔编号" prop="间隔编号" />
          <el-table-column align="center" label="间隔图号" prop="间隔图号" />
          <el-table-column align="center" label="产品名称" prop="产品名称" />
          <el-table-column align="center" label="计划开始时间" prop="计划开始时间" />
          <!-- <el-table-column align="center" label="计划完成时间" prop="计划完成时间"/> -->
          <!-- <el-table-column align="center" label="计划创建时间" prop="创建时间" width="140px"/> -->
          <el-table-column align="center" label="操作" width="120">
            <template #default="scope">
              <el-button v-if="scope.row.是否选择 === 0" type="primary" size="medium"
                @click="handleSelectOrder(scope.row)">选择</el-button>
              <el-button v-else type="primary" :disabled="true" size="medium">已选择</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div style="text-align: center; margin-top: 20px">
          <el-button class="el-icon-close" @click="selectOrderFormVisible = false">关闭</el-button>
        </div>
      </div>
    </el-dialog>
    <el-dialog v-el-drag-dialog :append-to-body="true" :visible.sync="debugDialogVisible" center
      style="text-align: center" title="AGV操作按钮" width="400px">
      <div style="text-align: center">
        <el-form :model="opNameInputDataForm" label-position="right" label-width="100px"
          style="width: 100%;margin: auto">
          <el-button type="primary" @click="handleScanIntervalCode">扫描断路器条码</el-button>
          <el-button type="primary"  @click="callAGV">呼叫充电AGV</el-button>
          <!-- <el-button v-else type="primary" @click="handleAGVArrived">AGV到达</el-button> -->

          <!--底部按钮-->
          <div style="text-align: center; margin-top: 20px">
            <el-button class="el-icon-close" @click="debugDialogVisible = false">关闭</el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
    <el-dialog v-el-drag-dialog :append-to-body="true" :visible.sync="printBarcodeDialogVisible" center
      style="text-align: center" title="打印条码" width="400px">
      <div style="text-align: center">
        <el-form :model="printBarcodeForm" label-position="right" label-width="100px" style="width: 100%;margin: auto">
          <el-form-item label="项目编号">
            <el-input v-model="printBarcodeForm.projectCode" disabled />
          </el-form-item>
          <el-form-item label="项目名称">
            <el-input v-model="printBarcodeForm.projectName" disabled />
          </el-form-item>
          <el-form-item label="工件编号">
            <el-input v-model="printBarcodeForm.engineId" @input="handleReprintBarcode" />
          </el-form-item>
          <el-form-item label="工件图号">
            <el-input v-model="printBarcodeForm.drawingNo" disabled />
          </el-form-item>
          <!--底部按钮-->
          <div style="text-align: center; margin-top: 20px">
            <el-button type="primary" @click="handlePrintBarcode">确认打印</el-button>
            <el-button @click="printBarcodeDialogVisible = false">取消</el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
  </div>
</template>

<script>

import { mapGetters } from 'vuex'
import MesWebFun04 from './LowerRight/MesWebFun04.vue'
import MesWebFun08 from './LowerRight/MesWebFun08.vue'
import MesWebFun22 from './LowerRight/MesWebFun22.vue'
import { v4 as uuidv4 } from 'uuid'

export default {
  components: {
    MesWebFun04,
    MesWebFun08,
    MesWebFun22
  },
  data() {
    return {
      MesWebCode: Number(this.$store.state.station.MesWebCode),
      file_is_show: true,
      subscription: {
        topic: '',
        qos: 0
      },
      publication: {
        topic: '',
        qos: 0,
        payload: ''
      },
      imgCheckDialogFormVisible: false,
      opNameInputDataVisible: false,
      imgCheckDirectFileList: [],
      opNameInputDataTypeList: [],
      opNameInputDataNameList: [],
      opNameInputDataForm: {
        opName: '',
        order: '',
        engineID: '',
        engineType: '',
        dataType: '',
        dataName: '',
        dataValue: '',
        jobNumber: ''
      },
      checkButtonDisable: true,
      checkDataInputVisible: false,
      checkDataInputList: [],
      selectOrderFormVisible: false,
      selectOrderFormList: [],
      debugDialogVisible: false,
      printBarcodeDialogVisible: false,
      reprintBarcodeDialogVisible: false,
      printBarcodeForm: {
        projectCode: '', // 制造编号
        projectName: '', // 项目名称
        engineId: '', // 产品编号
        drawingNo: '' // 产品图号
      }
    }
  },
  created() {
    this.initData()
    setTimeout(() => {
      console.log('processList_table', this.$store.state.station.processList_table)
    }, 1000)
    // console.log('this.$store.state.station.MesWebCode', this.$store.state.station.MesWebCode)
  },
  computed: {
    ...mapGetters([
      'processList_table',
      'materialList_table',
      'pic',
      'tighteningPosition',
      'smile',
      'tempDataObject'
    ])
  },
  watch: {
    // 监听变量数据的某个对象
    'tempDataObject.checkWorkOverIsShow': {
      handler(newV, oldV) {
        console.log('tempDataObject.checkWorkOverIsShow 发生了改变！！！！', newV)
        if (newV == 1) {
          this.checkButtonDisable = true
        } else if (newV == 0) {
          this.checkButtonDisable = false
        }
      },
      deep: true
    }
  },
  methods: {
    initData() { 
      setTimeout(() => {
        this.publication.topic = window.g.mqttPublishTopic
        this.publication.payload = 'WEB|IniSingalToWeb|' + this.$store.state.station.stationName + '|' + '1'
        const result = window.g.mqttClient.doPublish(this.publication)
      }, 500)
    },
    changBP(item) {
      if (item.nowStateCode === 1) {
        return 'green'
      } else if (item.nowStateCode === 2) {
        return 'blue'
      } else if (item.nowStateCode === 0) {
        return 'red'
      } else if (item.nowStateCode === 10) {
        return 'redRectangle'
      } else if (item.nowStateCode === 11) {
        return 'greenRectangle'
      } else if (item.nowStateCode === 12) {
        return 'blueRectangle'
      } else if (item.nowStateCode === 4) {
        return 'StartWorkCircle'
      } else if (item.nowStateCode === 14) {
        return 'blinkRectangle'
      }
    },
    cellClassName({ row, column }) {
      //
      if (row.是否完成扫描物料条码 === '0' && column.label === '物料条码') {
        return 'materialList-row'
      } else {
        return ''
      }
    },
    // 查询指导文件列表
    getImgCheckDirectFileList(row) {
      var param = []
      param[0] = ['工位号', this.$store.state.station.stationName]
      var Data = this.CreateData('11', '基础数据_操作指南指导文件_查询', param)
      this.ExecDatabase(Data).then(response => {
        console.log(response)
        if (response.data.length > 0) {
          this.imgCheckDirectFileList = response.data
          this.imgCheckDialogFormVisible = true
        } else {
          this.$message.error('该工位无操作指南指导文件，请添加后查看')
        }
      })
    },
    outLineOpNameWorkOver() {
      if (this.$store.state.station.statusValue[6].status == 0) {
        this.$message({
          type: 'warning',
          message: '请在允许工作后再进行此操作！'
        })
        return
      }
      this.$confirm(`请确认是否生产完成，完成后不可重新录入该工件数据`, '提示', {
        dangerouslyUseHTMLString: true,
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var Data = this.CreateData('11', 'PTCHV_离站前检查', [['工位号', this.$store.state.station.stationName]])
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result === 1) {
            const agvReq = {
              taskId: response.data[0].AGV任务号,
              station: this.$store.state.station.stationName,
              passCount: response.data[0].放行次数
            }
            this.ExecAgvApi('releaseAGV', agvReq).then(agvRes => {
              console.log(agvRes)
              if (agvRes.Result) {
                this.handleAGVLeft()
                this.$message.success('数据保存完成，等待AGV离开')
              } else {
                this.$message.error(agvRes.ErrMsg)
              }
            })
          } else {
            this.$message.error(response.data[0].msg)
          }
        })
      })
    },
    checkWorkOver() {
      if (this.$store.state.station.statusValue[6].status == 0) {
        this.$message({
          type: 'warning',
          message: '请在允许工作后再进行此操作！'
        })
        return
      }
      this.$confirm(`请确认检查项是否都检查完成，请确认后放行工件`, '提示', {
        dangerouslyUseHTMLString: true,
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var param = []
        param[0] = ['工位号', this.$store.state.station.stationName]
        var Data = this.CreateData('11', '电子看板_工序内容_临时表_填写项_校验', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result == 1) {
            this.publication.topic = window.g.mqttPublishTopic
            this.publication.payload = 'WEB|checkWorkOver|' + this.$store.state.station.stationName + '|' + 1
            const result = window.g.mqttClient.doPublish(this.publication)
            if (result === true) {
              this.$notify.success({
                title: '提示',
                message: '工件检查完成',
                position: 'bottom-right',
                offset: 170
              })
            } else {
              this.$notify.error({
                title: '提示',
                message: '工件检查失败！',
                position: 'bottom-right',
                offset: 170
              })
            }
          } else {
            this.$message.error(response.data[0].msg)
          }
        })
      })
    },
    selectOrderForm() {
      if (this.$store.state.station.statusValue[6].status !== 0) {
        this.$message({
          type: 'warning',
          message: '当前工位有工作中工件，请完成后再进行此操作！'
        })
        return
      }
      var Data = this.CreateData('11', 'PTCHV_总装_生产计划_工位上线选择_列表查询', [])
      this.ExecDatabase(Data).then(response => {
        if (response.data.length > 0) {
          this.selectOrderFormList = response.data
          this.selectOrderFormVisible = true
        } else {
          this.$message.error('暂无可选择的生产计划！')
        }
      })
    },
    handleSelectOrder(row) {
      this.$confirm('是否确认选择该计划进行生产？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var param = []
        param[0] = ['间隔编号', row.间隔编号]
        var Data = this.CreateData('11', 'PTCHV_总装_生产计划_工位上线选择_选择', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result === 1) {
            this.$message.success('选择成功！')
            this.$root.$emit('updateOpMobyData')
            this.selectOrderFormVisible = false
          } else {
            this.$message.error(response.data[0].msg)
          }
        })
      })
    },
    // 查询
    getOpNameInputDataList(type, dataType = null) {
      if (this.$store.state.station.statusValue[3].status != 1) {
        this.$message({
          type: 'warning',
          message: '当前无工作中工件，请在传递机型后再进行此操作！'
        })
        return
      }

      if (!this.$store.state.station.engineValue.EngineID) {
        this.$message({
          type: 'warning',
          message: '请确认工位当前存在工件，工件信息完善！'
        })
        return
      }

      if (type === 1) {
        this.opNameInputDataTypeList = []
      } else {
        this.opNameInputDataNameList = []
      }
      var param = []
      param[0] = ['工位号', this.$store.state.station.stationName]
      param[1] = ['数据类型', dataType]
      param[2] = ['type', type]
      var Data = this.CreateData('11', 'MES_工位手动录入_基本表_工位_查询', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data.length > 0) {
          for (const item of response.data) {
            if (type === 1) {
              this.opNameInputDataTypeList.push(item.Value)
            } else if (type === 2) {
              this.opNameInputDataNameList.push(item.Value)
            }
          }
          this.opNameInputDataVisible = true
        } else {
          this.$message.error('该工位无工位录入项，请在管理系统中添加后再试！')
        }
      })
    },
    // 检查项录入
    getCheckDataInput() {
      if (this.$store.state.station.statusValue[3].status != 1) {
        this.$message({
          type: 'warning',
          message: '当前无工作中工件，请在传递机型后再进行此操作！'
        })
        return
      }

      if (!this.$store.state.station.engineValue.EngineID) {
        this.$message({
          type: 'warning',
          message: '请确认工位当前存在工件，工件信息完善！'
        })
        return
      }

      var param = []
      param[0] = ['工位号', this.$store.state.station.stationName]
      var Data = this.CreateData('11', '电子看板_工序内容_临时表_填写项_查询', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data.length > 0) {
          this.checkDataInputVisible = true
          this.checkDataInputList = response.data
        } else {
          this.checkDataInputList = []
          this.$message.warning('该工件无录入项或已提交录入结果！')
        }
      })
    },
    // 提交修改
    opNameInputDataSubmit() {
      if (this.$store.state.station.statusValue[3].status != 1) {
        this.$message({
          type: 'warning',
          message: '当前无工作中工件，请在传递机型后再进行此操作！'
        })
        return
      }
      if (!this.opNameInputDataForm.dataType || !this.opNameInputDataForm.dataName || !this.opNameInputDataForm.dataValue) {
        this.$message({
          type: 'warning',
          message: '请将信息填写完善后再进行保存！'
        })
        return
      }

      if (!this.$store.state.station.engineValue.EngineID) {
        this.$message({
          type: 'warning',
          message: '请确认工位当前存在工件，工件信息完善！'
        })
        return
      }

      var param = []
      param[0] = ['工位号', this.$store.state.station.stationName]
      param[1] = ['订单号', this.$store.state.station.engineValue.OrderForm]
      param[2] = ['工件编号', this.$store.state.station.engineValue.EngineID]
      param[3] = ['机型', this.$store.state.station.engineValue.EngineType]
      param[4] = ['数据类型', this.opNameInputDataForm.dataType]
      param[5] = ['数据名称', this.opNameInputDataForm.dataName]
      param[6] = ['记录值', this.opNameInputDataForm.dataValue]
      param[7] = ['操作者工号', this.$store.state.station.stationUserCount]
      var Data = this.CreateData('12', 'MES_工位手动录入_记录表_增加', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data[0].result === '1') {
          this.$message({
            message: '保存成功',
            type: 'success'
          })
          this.opNameInputDataVisible = false
        } else {
          this.$message.error('保存失败，请确认当前工件信息是否完善')
        }
      })
    },
    // 保存检验项列表数据
    saveCheckInputDataList() {
      for (const item of this.checkDataInputList) {
        var param = []
        param[0] = ['ID', item.ID]
        param[1] = ['检验结果', item.检验结果]
        var Data = this.CreateData('12', '电子看板_工序内容_临时表_填写项_保存', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result != '1') {
            this.$message.error('保存数据失败！')
          }
        })
      }
      this.$message.success('保存成功！')
      this.checkDataInputVisible = false
    },
    // 预览指导文件按钮
    imgCheckDirectFile(row) {
      var param = []
      param[0] = ['ID', row.ID]
      var Data = this.CreateData('11', '基础数据_操作指南指导文件_查看文件', param)
      this.ExecDatabase(Data).then(response => {
        console.log(response)
        if (response.data.length > 0) {
          this.pdfSrc = this.solvePdfUr1(response.data[0].指导文件)
          window.open(this.pdfSrc, '_blank')
          // this.imgCheckDialogFormVisible = true // 查看点检文件
          console.log(this.pdfSrc)
        } else {
          this.$message.error('该工位此点检项目无指导文件，请设置后查看')
        }
      })
    },
    // 处理pdf 二进制流
    solvePdfUr1(content, type, fileName) {
      const bstr = atob(content)
      let n = bstr.length
      const u8arr = new Uint8Array(n)
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n)
      }
      // 确定解析格式，可能可以变成img，没有深入研究
      const blob = new Blob([u8arr], { type: 'application/pdf;chartset=UTF-8' })
      return window.URL.createObjectURL(blob)
    },
    // 显示AGV操作按钮弹窗
    showDebugButtons() {
      this.debugDialogVisible = true
    },

    // 呼叫AGV
    callAGV() {
      this.ExecAgvApi('callAGVToProduction', {}).then(agvRes => {
        console.log(agvRes)
        if (agvRes.Result) {
          this.$message.success('AGV呼叫成功')
        } else {
          this.$message.error(agvRes.ErrMsg)
        }
      })
    },

    // 模拟扫描隔离开关条码 测试用
    async handleScanIntervalCode() {
      var Data2 = this.CreateData('11', 'PTCHV_AGV_上线绑定', [['工位号', this.$store.state.station.stationName]])
      await this.ExecDatabase(Data2).then(response => {
        if (response.data[0].result === 1) {
          try {
            const item = response.data[0]
            const agvReq = {
              // taskId: item.AGV任务号, 随机生成UUID
              taskId: uuidv4(),
              EngineNo: item.工件编号,
              SortNo: item.产品型号,
              RouteCode: item.工艺路线编号
            }
            this.ExecAgvApi('productionLaunchBind', agvReq).then(agvRes => {
              if (agvRes.Result) {
                var Data3 = this.CreateData('12', 'PTCHV_AGV_工位放行次数_记录', [
                  ['工件编号', item.工件编号],
                  ['OP10', agvRes.Data.OP010PassCount],
                  ['OP20', agvRes.Data.OP020PassCount],
                  ['OP30', agvRes.Data.OP030PassCount]
                ])
                this.ExecDatabase(Data3).then(response => {
                  if (response.data[0].result === '1') {
                    const param = []
                    param[0] = ['工位号', this.$store.state.station.stationName]
                    param[1] = ['工件编号', this.$store.state.station.engineValue.EngineID]
                    param[2] = ['type', 1]
                    param[3] = ['任务编号', agvReq.taskId]
                    var Data = this.CreateData('12', 'PTCHV_AGV_进离站', param)
                    this.ExecDatabase(Data).then(response => {
                      if (response.data[0].result === '1') {
                        this.$message.success('已模拟扫描隔离开关条码')
                        this.$root.$emit('updateOpMobyData')
                        return true
                      } else {
                        this.$message.error('扫描隔离开关条码失败')
                      }
                    })
                  } else {
                    this.$message.error('放行次数记录失败')
                  }
                })
              } else {
                this.$message.error(agvRes.ErrMsg)
              }
            })
          } catch (e) {
            this.$message.error('调度任务出错' + e.message)
            console.log(e)
          }
        } else {
          this.$message.error('调度任务出错' + response.data[0].msg)
        }
      })
      return false
    },

    callAGVSideshift() {
      this.ExecAgvApi('callAGVSideshift', {}).then(agvRes => {
        console.log(agvRes)
        if (agvRes.Result) {
          this.$message.success('操作成功!')
        } else {
          this.$message.error(agvRes.ErrMsg)
        }
      })
    },
    // AGV到达
    handleAGVArrived() {
      // 判断当前是否已有工件入站
      // if (this.$store.state.station.statusValue[3].status === 1) {
      //   this.$message({
      //     type: 'warning',
      //     message: '当前已存在加工中工件，请先完成加工后再进行此操作！'
      //   })
      //   return
      // }
      const param = []
      param[0] = ['工位号', this.$store.state.station.stationName]
      var Data = this.CreateData('11', 'PTCHV_调试_AGV到达', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data[0].result === 1) {
          this.$root.$emit('updateOpMobyData')
          this.$message.success('已模拟AGV到达')
        } else {
          this.$message.error(response.data[0].msg)
        }
      })
    },
    // 打印条码
    printBarcode() {
      if (this.$store.state.station.engineValue.EngineID === '') {
        this.$message({
          type: 'warning',
          message: '当前无工作中工件，请在上方显示工件信息后再进行此操作！'
        })
        return
      }
      this.printBarcodeForm.engineId = this.$store.state.station.engineValue.EngineID
      this.handleReprintBarcode()
      this.printBarcodeDialogVisible = true
    },

    // // 补打条码
    // reprintBarcode() {
    //   this.reprintBarcodeForm = {
    //     projectCode: '',
    //     projectName: '',
    //     engineId: ''
    //   }
    //   this.reprintBarcodeDialogVisible = true
    // },

    // 工艺放行
    processRelease() {
      // 二次确认
      this.$confirm('是否确认AGV工艺放行至下一个停靠点？', '提示', {
        dangerouslyUseHTMLString: true,
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        // 1. 调用 PTCHV_AGV_工位放行次数_放行 存储过程
        const param = []
        param[0] = ['工件编号', this.$store.state.station.engineValue.EngineID]
        param[1] = ['工位号', this.$store.state.station.stationName]
        const Data = this.CreateData('11', 'PTCHV_AGV_工位放行次数_放行', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result == 1) {
            // 2. 放行成功，调用releaseAGV接口
            const agvReq = {
              taskId: response.data[0].AGV任务号,
              station: this.$store.state.station.stationName,
              passCount: response.data[0].放行次数
            }
            this.ExecAgvApi('releaseAGV', agvReq).then(agvRes => {
              if (agvRes.Result) {
                this.$message.success('工艺放行完成 前往位置' + response.data[0].放行次数)
              } else {
                // 3. releaseAGV失败，回滚放行次数
                const paramBack = []
                paramBack[0] = ['工件编号', this.$store.state.station.engineValue.EngineID]
                paramBack[1] = ['工位号', this.$store.state.station.stationName]
                const DataBack = this.CreateData('12', 'PTCHV_AGV_工位放行次数_撤回', paramBack)
                this.ExecDatabase(DataBack).then(() => {
                  this.$message.error('AGV放行失败：' + agvRes.ErrMsg)
                })
              }
            })
          } else {
            // 放行失败，提示原因
            this.$message.error(response.data[0].msg)
          }
        })
      })
    },

    // 处理打印条码
    handlePrintBarcode() {
      // 三个信息一个为空 则提示
      if (!this.printBarcodeForm.projectCode || !this.printBarcodeForm.projectName || !this.printBarcodeForm.engineId || !this.printBarcodeForm.drawingNo) {
        this.$message.warning('产品信息不完整，请确认后打印')
        return
      }
      // 弹窗确认是否打印该产品所有物料码
      this.$confirm('是否确认打印该产品所有物料码？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        const param = []
        param[0] = ['工件编号', this.printBarcodeForm.engineId]
        const Data = this.CreateData('11', '电子看板_装配零件_批量打印物料_查询', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data.length > 0) {
            for (const item of response.data) {
              const materialCode = (item.匹配规则前 ? item.匹配规则前 : '') + this.printBarcodeForm.engineId.replace('OB', '') + (item.匹配规则后 ? item.匹配规则后 : '')
              console.log(materialCode)
              this.publication.payload = `OP010~01~126总装二维码20250425|QR_Code^Code0^${materialCode}&${item.物料图号}|TEXT^TEXT1^项目名称：${this.printBarcodeForm.projectName}|TEXT^TEXT2^编号：${materialCode}|TEXT^TEXT0^制造编号：${this.printBarcodeForm.projectCode}`
              const result = window.g.mqttClient.doPublish(this.publication)
              if (result) {
                this.$message.success('打印指令已发送' + materialCode)
                this.printBarcodeDialogVisible = false
              } else {
                this.$message.error('打印指令发送失败')
              }
            }
          } else {
            this.$message.error('未找到该工件物料信息，请确认后打印')
          }
        })
      })
      this.publication.topic = window.g.mqttPublishTopic
      this.publication.payload = `OP010~01~126总装二维码20250425|QR_Code^Code0^${this.printBarcodeForm.engineId}&${this.printBarcodeForm.drawingNo}|TEXT^TEXT1^项目名称：${this.printBarcodeForm.projectName}|TEXT^TEXT2^编号：${this.printBarcodeForm.engineId}|TEXT^TEXT0^制造编号：${this.printBarcodeForm.projectCode}`
      console.log(this.publication.payload)
      const result = window.g.mqttClient.doPublish(this.publication)
      if (result) {
        this.$message.success('打印指令已发送' + this.printBarcodeForm.engineId)
        this.printBarcodeDialogVisible = false
      } else {
        this.$message.error('打印指令发送失败')
      }
    },

    // 在输入框输入工件编号后，自动查询工件信息
    handleReprintBarcode() {
      if (!this.printBarcodeForm.engineId) {
        return
      }
      const param = []
      param[0] = ['工件编号', this.printBarcodeForm.engineId]
      const Data = this.CreateData('11', 'PTCHV_总装_生产计划_工件信息查询', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data.length > 0) {
          this.printBarcodeForm.projectCode = response.data[0].制造编号
          this.printBarcodeForm.projectName = response.data[0].项目名称
          this.printBarcodeForm.drawingNo = response.data[0].间隔图号
          this.printBarcodeForm.engineId = response.data[0].间隔编号
        } else {
          this.printBarcodeForm.projectCode = ''
          this.printBarcodeForm.projectName = ''
          this.printBarcodeForm.drawingNo = ''
        }
      })
    }
  }
}
</script>

<style scoped>
::v-deep.el-table .materialList-row {
  background: rgba(255, 255, 0, 0.5) !important;
}

.blue {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/bule.png");
  background-size: 100% 100%;
}

.blueRectangle {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/bluerectangle.png");
  background-size: 100% 100%;
}

.red {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/red.png");
  background-size: 100% 100%;
}

.redRectangle {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/redrectangle.png");
  background-size: 100% 100%;
}

.green {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/green.png");
  background-size: 100% 100%;
}

.greenRectangle {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/greenrectangle.png");
  background-size: 100% 100%;
}

.StartWorkCircle {
  position: absolute;
  width: 45px;
  height: 45px;
  background-size: 100% 100%;
  background-image: url("../../assets/image/StartWorkCircle.gif");
}

.blinkRectangle {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/blinkrectangle.gif");
  background-size: 100% 100%;
  background-color: #81e2ff;
}

::v-deep.el-table .el-table__row .cell {
  line-height: 20px;
  font-size: 20px !important;
}

::v-deep.el-table th.el-table__cell>.cell {
  font-size: 20px;
  color: #2f2f2f;
}
</style>
