<template>
  <div class="app-container">
    <el-card class="topCard">
      <div class="topDiv">
        <div>
          <span style="margin-left: 10px">订单号：</span>
          <el-input v-model="orderNumberValue" placeholder="订单号" clearable size="small" style="width: 200px">
          </el-input>
          <span style="margin-left: 10px">上传状态：</span>
          <el-select v-model="upLoadType" placeholder="上传状态" size="small" style="width: 200px">
            <el-option v-for="item in upLoadTypeList" :key="item.value" :label="item.label" :value="item.value"
              size="mini" />
          </el-select>
          <span style="margin-left: 10px">时间：</span>
          <el-date-picker :clearable="false" v-model="dateTime" size="small" type="daterange" align="center"
            style="width: 240px;" value-format="yyyy-MM-dd" format="yyyy-MM-dd" range-separator="～"
            start-placeholder="开始日期" end-placeholder="结束日期" />
          <el-button type="primary" plain size="small" icon="el-icon-search" style="margin-left: 5px"
            @click="selectDate()">查询</el-button>
          <!-- <el-button type="primary" plain size="small" icon="el-icon-search" style="margin-left: 5px"
            @click="updateAll()">批量重新报工</el-button> -->
        </div>
        <el-table v-loading="loading" ref="multipleTable" :data="tableData"
          :header-cell-style="{ background: '#eef1f6', color: '#606266' }" :cell-class-name="tableRowClassName"
          element-loading-text="数据加载中" element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(0, 0, 0, 0.2)" class="main" tooltip-effect="dark" height="760px"
          style="width: 100%;max-height: 700px;margin-top: 10px" border size="mini">
          <el-table-column type="index" width="60" label="序号" align="center" />
          <el-table-column align="center" label="工单编号" width="120">
            <template slot-scope="scope">
              {{ scope.row.工单编号 }}
            </template>
          </el-table-column>
          <el-table-column align="center" label="SN编号" width="170">
            <template slot-scope="scope">
              {{ scope.row.SN编号 }}
            </template>
          </el-table-column>
          <el-table-column align="center" label="合格标志" width="100">
            <template slot-scope="scope">
              <el-tag size="mini" v-if="scope.row.检验结果 == 1" type="success">合格</el-tag>
              <el-tag size="mini" v-else-if="scope.row.检验结果 == 2" type="danger">不合格</el-tag>
              <el-tag size="mini" v-else-if="scope.row.检验结果 == 0" type="warning">未测量</el-tag>
            </template>
          </el-table-column>
          <el-table-column align="center" label="生产日期" width="170">
            <template slot-scope="scope">
              {{ scope.row.生产日期 }}
            </template>
          </el-table-column>
          <el-table-column align="center" label="报工状态" width="120">
            <template slot-scope="scope">
              <el-tag size="mini" v-if="scope.row.是否上传 == 1" type="success">已报工</el-tag>
              <el-tag size="mini" v-else-if="scope.row.是否上传 == 0 && scope.row.msg != null" type="danger">报工失败</el-tag>
              <el-tag size="mini" v-else-if="scope.row.是否上传 == 0" type="warning">未报工</el-tag>
              <el-tag size="mini" v-else-if="scope.row.是否上传 == 2" type="danger">放弃报工</el-tag>
            </template>
          </el-table-column>
          <el-table-column align="left" label="反馈结果">
            <template slot-scope="scope">
              {{ scope.row.msg }}
            </template>
          </el-table-column>
          <el-table-column align="center" label="物料数据" width="200">
            <template slot-scope="scope">
              <el-button icon="el-icon-document-delete" @click="materialMaintenance(scope.row)" style="color: #1576e8;"
                type="text">物料维护</el-button>
            </template>
          </el-table-column>
          <el-table-column align="center" label="操作" width="200">
            <template slot-scope="scope">
              <el-button icon="el-icon-refresh" @click="reSigningUpForWork(scope.row)" type="text">重新报工</el-button>
              <el-button icon="el-icon-document-delete" @click="closeSigningUpForWork(scope.row)"
                :disabled="scope.row.检验结果 == 2" style="color: red;" type="text">放弃报工</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="block" style="margin-top: 10px;">
          <el-pagination v-if="!loading" :current-page="pageCurrent" :page-sizes="[15, 30, 40]" :page-size="pageSize"
            :total="total" layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange"
            @current-change="handleCurrentChange" />
        </div>
        <el-dialog :visible.sync="dialogFormProcess" :title="title" center style="min-height: 200px" width="1200px">
          <el-table :data="clickRowDataTable" height="500" style="width: 100%;margin-top: 10px;" border size="mini">
            <el-table-column type="index" width="60" label="序号" align="center" />
            <el-table-column align="center" label="订单号" width="120">
              <template slot-scope="scope">
                {{ scope.row.订单号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="工位号" width="80">
              <template slot-scope="scope">
                {{ scope.row.工位号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="工位名称" width="150">
              <template slot-scope="scope">
                {{ scope.row.工位名称 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="物料名称" width="150">
              <template slot-scope="scope">
                {{ scope.row.零件名称 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="物料图号" width="130">
              <template slot-scope="scope">
                {{ scope.row.零部件图号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="物料码值">
              <template slot-scope="scope">
                {{ scope.row.零部件编号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="操作" width="150" fixed="right">
              <template slot-scope="scope">
                <el-button icon="el-icon-refresh" @click="updateMterialValue(scope.row)" type="text">修改码值</el-button>
              </template>
            </el-table-column>
          </el-table>
          <div slot="footer" class="dialog-footer">
            <el-button size="small" @click="callOff1()">关闭</el-button>
          </div>
        </el-dialog>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      traceabilityCodeArr: [], // 精确追溯码数组
      traceabilityCode: '', // 精确追溯码
      assemblyNumber: [], // 总成编号
      assemblyNumberValue: '', // 总成编号
      orderNumberValue: '', // 订单号
      orderNumber: [], // 订单号
      upLoadType: -1,
      upLoadTypeList: [
        { label: '全部', value: -1 },
        { label: '未报工', value: 0 },
        { label: '已报工', value: 1 },
        { label: '放弃报工', value: 2 },
      ], // 订单号
      stationNumberValue: '', // 工位号
      stationNumber: [], // 工位号
      stationNumberValueN: '', // 工位号N
      stationNumberN: [], // 工位号N
      measuringPosition: [], // 测量位置
      measuringPositionValue: '', // 测量位置
      measuringProject: [], // 测量项目
      measuringProjectValue: '', // 测量项目
      engineTypeValue: '', // 机型
      engineType: [], // 机型
      batchBarcode: [], // 批次条码
      batchBarcodeValue: '', // 批次条码
      isQualified: [
        {
          label: '合格',
          value: 1
        },
        {
          label: '不合格',
          value: 2
        },
        {
          label: '全部',
          value: 0
        }
      ], // 是否合格
      isQualifiedValue: 1, // 是否合格
      dateTime: '', // 时间
      loading: false, // 时间
      tableData: [], // 时间
      date: new Date(),
      timer: '',
      total: 0, // 总条数
      pageList: 30, // 每页显示条数
      pageSize: 30, // 每页显示条数
      pageCurrent: 1, // 后台获取页
      dialogFormProcess: false, // 处理结果框
      clickRowData: null,
      clickRowDataTable: null,
      rules1: {
        describe: [{ required: true, message: '请输入描述', trigger: 'blur' }],
        processPersonnel: [{ required: true, message: '请输入处理人', trigger: 'blur' }],
        isProcess: [{ required: true, message: '请选择是否处理', trigger: 'blur' }]
      },
      processList: [
        { label: '已处理', value: 1 },
        { label: '未处理', value: 0 }
      ],
      title: '不合格处理'
    }
  },

  created() {
    var year, month, day, audiTime
    this.date = new Date() // 修改数据date
    year = new Date().getFullYear()
    month =
      new Date().getMonth() + 1 < 10
        ? '0' + (new Date().getMonth() + 1)
        : new Date().getMonth() + 1
    day =
      new Date().getDate() < 10
        ? '0' + new Date().getDate()
        : new Date().getDate()
    audiTime = year + '-' + month + '-' + day
    console.log(audiTime, 'audiTime')
    this.dateTime = [audiTime, audiTime]
  },
  mounted() {
    this.selectDate()
  },
  methods: {
    // 表格颜色变化
    tableRowClassName({ row, rowIndex }) {
      // console.log(row, rowIndex)
      if (rowIndex % 2 === 0) {
        return 'black'
      } else {
        return 'red'
      }
    },
    callOff1() {
      this.dialogFormProcess = false
    },
    // 重新报工
    reSigningUpForWork(row) {
      var param = []
      param[0] = ['订单号', row.SN编号]
      var Data = this.CreateData('11', '接口_上传_报工数据_重新报工', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data[0].result == 1) {
          this.$message.success(response.data[0].msg)
          this.selectDate()
        } else {
          this.$message.warning(response.data[0].msg)
        }
      })
    },
    updateMterialValue(row) {
      // 修改码值 的输入框 需要输入新码值 新码值需要包含 row.零部件图号
      this.$prompt('请输入新码值,码值应包含 <span style="color:red;"> ' + row.零部件图号 + ' </span>', '提示', {
        confirmButtonText: '确定',
        dangerouslyUseHTMLString: true,
        cancelButtonText: '取消',
        inputValue: row.零部件编号 ? row.零部件编号 : row.零部件图号,
      }).then(({ value }) => {
        var param = []
        param.push(['订单号', row.订单号])
        param.push(['工位类型', row.工位类型])
        param.push(['ID', row.ID])
        param.push(['卡片条码', row.卡片条码])
        param.push(['码值', value])
        var Data = this.CreateData('11', '接口_上传_报工数据_订单物料维护', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result == 1) {
            this.$message.success(response.data[0].msg)
            this.getMaterialTable(row.订单号)
          } else {
            this.$message.warning(response.data[0].msg)
          }
        })
      })
    },
    materialMaintenance(row) {
      this.dialogFormProcess = true
      this.title = '物料数据维护'
      this.clickRowData = row
      this.getMaterialTable(row.SN编号)
    },
    getMaterialTable(orderNo) {
      var param = []
      param[0] = ['订单号', orderNo]
      var Data = this.CreateData('11', '接口_上传_报工数据_订单物料查询', param)
      this.ExecDatabase(Data).then(response => {
        this.clickRowDataTable = response.data
      })
    },
    closeSigningUpForWork(row) {
      this.$confirm('确定放弃报工此订单', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          var param = []
          param[0] = ['订单号', row.SN编号]
          var Data = this.CreateData('11', '接口_上传_报工数据_放弃报工', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result == 1) {
              this.$message.success(response.data[0].msg)
              this.selectDate()
            } else {
              this.$message.warning(response.data[0].msg)
            }
          })
        })
    },
    submitAdd1() {
      var param = []
      param[0] = ['Id', this.form1.id]
      param[1] = ['是否处理', this.form1.isProcess]
      param[2] = ['处理人', this.form1.processPersonnel]
      param[3] = ['处理结果', this.form1.describe]
      console.log(param)
      var Data = this.CreateData('12', '测量数据合格_不合格原因_修改', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data[0].result === '1') {
          this.$message.success('修改成功!')
          this.dialogFormProcess = false
          this.selectDate()
        } else {
          this.$message.warning('修改失败!')
        }
      })
    },
    // 打开处理框
    showProcessDialog(row) {
      this.dialogFormProcess = true
      this.title = '不合格处理'
      this.form1.describe = row.报废原因描述
      this.form1.processPersonnel = row.处理人
      this.form1.isProcess = row.是否合格下线工位
      this.form1.id = row.Id
    },
    // 工位号
    getStationNumber() {
      this.stationNumber = []
      var param = []
      var Data = this.CreateData('11', 'MES_计划BOM_工位与名称_查询', param)
      this.ExecDatabase(Data).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.stationNumber.push({
            label: response.data[i].指南工位号,
            value: response.data[i].工位号
          })
        }
      })
    },
    // 工位号N
    getStationNumberN() {
      this.stationNumberN = []
      var param = []
      var Data = this.CreateData('11', 'MES_计划BOM_工位与名称_查询', param)
      this.ExecDatabase(Data).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.stationNumberN.push({
            label: response.data[i].指南工位号,
            value: response.data[i].工位号
          })
        }
      })
    },
    // 订单号
    getOrderNumber() {
      this.orderNumber = []
      var param = []
      param[0] = ['开始时间', this.dateTime[0] + ' ' + '00:00']
      param[1] = ['结束时间', this.dateTime[1] + ' ' + '23:59']
      // param[0] = ['开始时间', this.dateTime[0]]
      // param[1] = ['结束时间', this.dateTime[1]]
      var Data = this.CreateData(
        '11',
        '测量数据发动机在线状态_订单号_查询 ',
        param
      )
      this.ExecDatabase(Data).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.orderNumber.push({
            label: response.data[i].订单号,
            value: response.data[i].订单号
          })
        }
      })
    },
    getAssemblyNumber() {
      this.assemblyNumber = []
      var orderNumberValue_check
      this.orderNumberValue
        ? (orderNumberValue_check = 1)
        : (orderNumberValue_check = 0)
      var param = []
      param[0] = ['开始时间', this.dateTime[0] + ' ' + '00:00']
      param[1] = ['结束时间', this.dateTime[1] + ' ' + '23:59']
      // param[0] = ['开始时间', this.dateTime[0]]
      // param[1] = ['结束时间', this.dateTime[1]]
      param[2] = ['订单号_ischeck', orderNumberValue_check]
      param[3] = ['订单号', this.orderNumberValue]
      var Data = this.CreateData(
        '11',
        '测量数据发动机在线状态_发动机号_查询 ',
        param
      )
      this.ExecDatabase(Data).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.assemblyNumber.push({
            label: response.data[i].发动机号,
            value: response.data[i].发动机号,
            ID: response.data[i].ID
          })
        }
      })
    },
    selectDate() {
      this.tableData = []
      var param = []
      param.push(['开始时间', this.dateTime[0] + ' ' + '00:00'])
      param.push(['结束时间', this.dateTime[1] + ' ' + '23:59'])
      param.push(['订单号', this.orderNumberValue])
      param.push(['上传状态', this.upLoadType])
      param.push(['PageCurrent', this.pageCurrent])
      param.push(['PageSize', this.pageSize])
      param.push(['PageCount', '1111', 'int', '1'])
      param.push(['ItemCount', '1111', 'int', '1'])
      var Data = this.CreateData(
        '11',
        '接口_上传_报工数据_页面查询',
        param
      )
      this.ExecDatabase(Data).then(response => {
        console.log(response, 66)
        if (response.data.result.length !== 0) {
          this.tableData = response.data.result
        }
        this.total = parseInt(response.data.output[0].ItemCount)
        this.loading = false
      })
    },
    updateAll() {
      // this.dialogFormProcess = true
      // this.title = '批量不合格处理'

      this.$confirm('是否重新报工筛选结果中 报工失败记录?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          var Data = this.CreateData(
            '11',
            '测量数据合格_不合格_批量修改',
            param
          )
          this.ExecDatabase(Data).then(response => {
            console.log(response, 66)
            if (response.data[0].result == '1') {
              this.$message.success('修改成功！')
              this.selectDate()
              this.dialogFormProcess = false
            } else {
              this.$message.error('修改失败！')
            }
          })
        })
    },
    updateAllSubmit() {
      this.tableData = []
      let orderNumberValue_check,
        stationNumberValue_check,
        stationNumberValueN_check,
        assemblyNumberValue_check
      this.assemblyNumberValue
        ? (assemblyNumberValue_check = 1)
        : ((assemblyNumberValue_check = 0), (this.assemblyNumberValue = ''))
      this.stationNumberValue
        ? (stationNumberValue_check = 1)
        : ((stationNumberValue_check = 0), (this.stationNumberValue = ''))
      this.stationNumberValueN
        ? (stationNumberValueN_check = 1)
        : ((stationNumberValueN_check = 0), (this.stationNumberValueN = ''))
      this.orderNumberValue
        ? (orderNumberValue_check = 1)
        : ((orderNumberValue_check = 0), (this.orderNumberValue = ''))
      var param = []
      param[0] = ['开始时间', this.dateTime[0] + ' ' + '00:00']
      param[1] = ['结束时间', this.dateTime[1] + ' ' + '23:59']
      // param[0] = ['开始时间', this.dateTime[0]]
      // param[1] = ['结束时间', this.dateTime[1]]
      param[2] = ['工位号N_ischeck', stationNumberValueN_check]
      param[3] = ['工位号N', this.stationNumberValueN]
      param[4] = ['发动机号_ischeck', assemblyNumberValue_check]
      param[5] = ['发动机号', this.assemblyNumberValue]
      param[6] = ['工位号_ischeck', stationNumberValue_check]
      param[7] = ['工位号', this.stationNumberValue]
      param[8] = ['订单号_ischeck', orderNumberValue_check]
      param[9] = ['是否处理', this.form1.isProcess]
      param[10] = ['处理人', this.form1.processPersonnel]
      param[11] = ['处理结果', this.form1.describe]

      this.$confirm('是否批量维护筛选结果中未处理的不合格记录?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          var Data = this.CreateData(
            '12',
            '测量数据合格_不合格_批量修改',
            param
          )
          this.ExecDatabase(Data).then(response => {
            console.log(response, 66)
            if (response.data[0].result == '1') {
              this.$message.success('修改成功！')
              this.selectDate()
              this.dialogFormProcess = false
            } else {
              this.$message.error('修改失败！')
            }
          })
        })
    },
    exportExcel() {
      if (this.tableData.length !== 0) {
        let orderNumberValue_check,
          stationNumberValue_check,
          stationNumberValueN_check,
          assemblyNumberValue_check
        this.assemblyNumberValue
          ? (assemblyNumberValue_check = 1)
          : ((assemblyNumberValue_check = 0), (this.assemblyNumberValue = ''))
        this.stationNumberValue
          ? (stationNumberValue_check = 1)
          : ((stationNumberValue_check = 0), (this.stationNumberValue = ''))
        this.stationNumberValueN
          ? (stationNumberValueN_check = 1)
          : ((stationNumberValueN_check = 0), (this.stationNumberValueN = ''))
        this.orderNumberValue
          ? (orderNumberValue_check = 1)
          : ((orderNumberValue_check = 0), (this.orderNumberValue = ''))
        var param = []
        param[0] = ['开始时间', this.dateTime[0] + ' ' + '00:00']
        param[1] = ['结束时间', this.dateTime[1] + ' ' + '23:59']
        // param[0] = ['开始时间', this.dateTime[0]]
        // param[1] = ['结束时间', this.dateTime[1]]
        param[2] = ['工位号N_ischeck', stationNumberValueN_check]
        param[3] = ['工位号N', this.stationNumberValueN]
        param[4] = ['发动机号_check', assemblyNumberValue_check]
        param[5] = ['发动机号', this.assemblyNumberValue]
        param[6] = ['工位号_check', stationNumberValue_check]
        param[7] = ['工位号', this.stationNumberValue]
        param[8] = ['订单号_ischeck', orderNumberValue_check]
        param[9] = ['订单号', this.orderNumberValue]
        var Data = this.CreateData(
          '2001',
          '质量数据查询_测量数据发动机在线状态_报表_NEW',
          param
        )
        this.exportExcel_NPOI(Data)
      } else {
        this.$message.warning('暂无数据')
      }
    },
    // 分页
    handleSizeChange(val) {
      this.pageCurrent = 1
      this.pageSize = val
      this.selectDate()
    },
    handleCurrentChange(val) {
      this.pageCurrent = val
      this.selectDate()
    }
  }
}
</script>

<style scoped>
.topCard {
  margin: 5px;
}

.topDiv {
  margin-bottom: 10px;
}

.RecordOk {
  width: 100%;
  height: 100%;
  background-color: #1eff00;
  color: white;
}

.RecordNOk {
  width: 100%;
  height: 100%;
  background-color: #ff0000;
  color: white;
}
</style>
