<template>
  <div class="content-box">
    <el-form ref="form" inline @submit.native.prevent>
      <el-row>
        <el-col :span="6">
          <el-form-item label="流程卡号：">
            <el-input
              ref="codeFocus"
              v-model="cardNo"
              placeholder="请扫描流程卡号"
              @keyup.enter.native="codeKeyUp"
            />
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item style="margin: 0px 20px 0px 20px">
            <el-switch v-model="line" active-text="上线前" inactive-text="下线后" />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item>
            <el-button
              :disabled="preserveSlotList.length == 0"
              style="margin-top: 4px"
              type="primary"
              @click="onSubmit"
              >保存</el-button
            >
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span style="color: rgb(85, 85, 243)">电子档案</span>
      </div>
      <div class="tableBox">
        <table
          v-if="preserveSlotList.length > 0"
          id="cus-table"
          cellspacing="0"
          style="width: 100%"
        >
          <tr>
            <td colspan="4">槽位/工步</td>
            <td colspan="4">工艺要求</td>
            <td colspan="3">实际参数</td>
          </tr>
          <template v-for="(itemSlot, indexSlot) in preserveSlotList" :key="itemSlot + indexSlot">
            <component
              :is="getTemplateComponent(itemSlot.rfpsType)"
              :itemSlot="itemSlot"
              :indexSlot="indexSlot"
            />
          </template>
        </table>
      </div>
    </el-card>
  </div>
</template>
<script>
import {
  loadCurrentWp,
  remarryRedeemSaveRetrospectDefend,
  getDataByMtnCodeRb,
} from '@/api/zhgd-work/retrospectDefend.js';
import { getByRfpId, getRbFilePreserveByWpId } from '@/api/zhgd-work/eleFilesEdit.js';
import Templates from '../../../qualityTemplate/index.js';
import { getTemplateComponent } from '@/utils/templateMapper.js';
export default {
  components: {
    ...Templates,
  },
  data() {
    return {
      cardNo: '',
      preserveSlotList: [],
      line: true,
      obj: {},
    };
  },
  methods: {
    getTemplateComponent(type) {
      const componentName = getTemplateComponent(type);
      return componentName;
    },
    getMaterialMess(itemChild, itemSlot) {
      if (itemChild.paramValue) {
        getDataByMtnCodeRb({ goodsCode: itemChild.paramValue }).then(res => {
          const { coGoods } = res.data;
          if (coGoods) {
            const { goodsName, checkoutCode, releasenoTime } = coGoods;
            if (itemSlot.rfpsType == 5) {
              // 模板六
              itemSlot.childrenList[1].paramValue = itemChild.paramValue;
              itemSlot.childrenList[2].paramValue = goodsName;
              itemSlot.childrenList[3].paramValue = checkoutCode;
              itemSlot.childrenList[4].paramValue = releasenoTime;
            } else if (itemSlot.rfpsType == 6) {
              // 模板六
              itemSlot.childrenList[2].paramValue = itemChild.paramValue;
              itemSlot.childrenList[3].paramValue = goodsName;
              itemSlot.childrenList[4].paramValue = checkoutCode;
              itemSlot.childrenList[5].paramValue = releasenoTime;
            } else if (itemSlot.rfpsType == 13) {
              // 模板十三
              itemSlot.childrenList[0].paramValue = itemChild.paramValue;
              itemSlot.childrenList[1].paramValue = goodsName;
              itemSlot.childrenList[2].paramValue = checkoutCode;
              itemSlot.childrenList[3].paramValue = releasenoTime;
            } else if (itemSlot.rfpsType == 14) {
              // 模板十四
              if (itemChild.detailIndex == 5) {
                itemSlot.childrenList[4].paramValue = itemChild.paramValue;
                itemSlot.childrenList[5].paramValue = goodsName;
                itemSlot.childrenList[6].paramValue = checkoutCode;
                itemSlot.childrenList[7].paramValue = releasenoTime;
              } else if (itemChild.detailIndex == 9) {
                itemSlot.childrenList[8].paramValue = itemChild.paramValue;
                itemSlot.childrenList[9].paramValue = goodsName;
                itemSlot.childrenList[10].paramValue = checkoutCode;
                itemSlot.childrenList[11].paramValue = releasenoTime;
              }
            } else if (itemSlot.rfpsType == 15) {
              // 模板十五
              if (itemChild.detailIndex == 7) {
                itemSlot.childrenList[6].paramValue = itemChild.paramValue;
                itemSlot.childrenList[7].paramValue = goodsName;
                itemSlot.childrenList[8].paramValue = checkoutCode;
                itemSlot.childrenList[9].paramValue = releasenoTime;
              } else if (itemChild.detailIndex == 11) {
                itemSlot.childrenList[10].paramValue = itemChild.paramValue;
                itemSlot.childrenList[11].paramValue = goodsName;
                itemSlot.childrenList[12].paramValue = checkoutCode;
                itemSlot.childrenList[13].paramValue = releasenoTime;
              }
            } else if (itemSlot.rfpsType == 16) {
              // 模板十六
              if (itemChild.detailIndex == 5) {
                itemSlot.childrenList[4].paramValue = itemChild.paramValue;
                itemSlot.childrenList[5].paramValue = goodsName;
                itemSlot.childrenList[6].paramValue = checkoutCode;
                itemSlot.childrenList[7].paramValue = releasenoTime;
              } else if (itemChild.detailIndex == 9) {
                itemSlot.childrenList[8].paramValue = itemChild.paramValue;
                itemSlot.childrenList[9].paramValue = goodsName;
                itemSlot.childrenList[10].paramValue = checkoutCode;
                itemSlot.childrenList[11].paramValue = releasenoTime;
              } else if (itemChild.detailIndex == 13) {
                itemSlot.childrenList[12].paramValue = itemChild.paramValue;
                itemSlot.childrenList[13].paramValue = goodsName;
                itemSlot.childrenList[14].paramValue = checkoutCode;
                itemSlot.childrenList[15].paramValue = releasenoTime;
              }
            } else if (itemSlot.rfpsType == 17) {
              // 模板十七
              itemSlot.childrenList[4].paramValue = itemChild.paramValue;
              itemSlot.childrenList[5].paramValue = goodsName;
              itemSlot.childrenList[6].paramValue = checkoutCode;
              itemSlot.childrenList[7].paramValue = releasenoTime;
            } else if (itemSlot.rfpsType == 19) {
              // 模板十九
              itemSlot.childrenList[0].paramValue = goodsCode;
              itemSlot.childrenList[1].paramValue = goodsName;
              itemSlot.childrenList[2].paramValue = checkoutCode;
              itemSlot.childrenList[3].paramValue = releasenoTime;
            }
          }
        });
        // this.$ajax
        //   .post('prMakeRec/getMaterialMess', {
        //     goodsCode: itemChild.paramValue,
        //   })
        //   .then(res => {
        //     if (this.$ifAjax(res)) {
        //       console.log(res.data.coGoods);
        //       const { coGoods } = res.data;
        //       if (coGoods) {
        //         const { goodsName, checkoutCode, releasenoTime } = coGoods;
        //         if (itemSlot.rfpsType == 5) {
        //           // 模板六
        //           itemSlot.childrenList[1].paramValue = itemChild.paramValue;
        //           itemSlot.childrenList[2].paramValue = goodsName;
        //           itemSlot.childrenList[3].paramValue = checkoutCode;
        //           itemSlot.childrenList[4].paramValue = releasenoTime;
        //         } else if (itemSlot.rfpsType == 6) {
        //           // 模板六
        //           itemSlot.childrenList[2].paramValue = itemChild.paramValue;
        //           itemSlot.childrenList[3].paramValue = goodsName;
        //           itemSlot.childrenList[4].paramValue = checkoutCode;
        //           itemSlot.childrenList[5].paramValue = releasenoTime;
        //         } else if (itemSlot.rfpsType == 13) {
        //           // 模板十三
        //           itemSlot.childrenList[0].paramValue = itemChild.paramValue;
        //           itemSlot.childrenList[1].paramValue = goodsName;
        //           itemSlot.childrenList[2].paramValue = checkoutCode;
        //           itemSlot.childrenList[3].paramValue = releasenoTime;
        //         } else if (itemSlot.rfpsType == 14) {
        //           // 模板十四
        //           if (itemChild.detailIndex == 5) {
        //             itemSlot.childrenList[4].paramValue = itemChild.paramValue;
        //             itemSlot.childrenList[5].paramValue = goodsName;
        //             itemSlot.childrenList[6].paramValue = checkoutCode;
        //             itemSlot.childrenList[7].paramValue = releasenoTime;
        //           } else if (itemChild.detailIndex == 9) {
        //             itemSlot.childrenList[8].paramValue = itemChild.paramValue;
        //             itemSlot.childrenList[9].paramValue = goodsName;
        //             itemSlot.childrenList[10].paramValue = checkoutCode;
        //             itemSlot.childrenList[11].paramValue = releasenoTime;
        //           }
        //         } else if (itemSlot.rfpsType == 15) {
        //           // 模板十五
        //           if (itemChild.detailIndex == 7) {
        //             itemSlot.childrenList[6].paramValue = itemChild.paramValue;
        //             itemSlot.childrenList[7].paramValue = goodsName;
        //             itemSlot.childrenList[8].paramValue = checkoutCode;
        //             itemSlot.childrenList[9].paramValue = releasenoTime;
        //           } else if (itemChild.detailIndex == 11) {
        //             itemSlot.childrenList[10].paramValue = itemChild.paramValue;
        //             itemSlot.childrenList[11].paramValue = goodsName;
        //             itemSlot.childrenList[12].paramValue = checkoutCode;
        //             itemSlot.childrenList[13].paramValue = releasenoTime;
        //           }
        //         } else if (itemSlot.rfpsType == 16) {
        //           // 模板十六
        //           if (itemChild.detailIndex == 5) {
        //             itemSlot.childrenList[4].paramValue = itemChild.paramValue;
        //             itemSlot.childrenList[5].paramValue = goodsName;
        //             itemSlot.childrenList[6].paramValue = checkoutCode;
        //             itemSlot.childrenList[7].paramValue = releasenoTime;
        //           } else if (itemChild.detailIndex == 9) {
        //             itemSlot.childrenList[8].paramValue = itemChild.paramValue;
        //             itemSlot.childrenList[9].paramValue = goodsName;
        //             itemSlot.childrenList[10].paramValue = checkoutCode;
        //             itemSlot.childrenList[11].paramValue = releasenoTime;
        //           } else if (itemChild.detailIndex == 13) {
        //             itemSlot.childrenList[12].paramValue = itemChild.paramValue;
        //             itemSlot.childrenList[13].paramValue = goodsName;
        //             itemSlot.childrenList[14].paramValue = checkoutCode;
        //             itemSlot.childrenList[15].paramValue = releasenoTime;
        //           }
        //         } else if (itemSlot.rfpsType == 17) {
        //           // 模板十七
        //           itemSlot.childrenList[4].paramValue = itemChild.paramValue;
        //           itemSlot.childrenList[5].paramValue = goodsName;
        //           itemSlot.childrenList[6].paramValue = checkoutCode;
        //           itemSlot.childrenList[7].paramValue = releasenoTime;
        //         } else if (itemSlot.rfpsType == 19) {
        //           // 模板十九
        //           itemSlot.childrenList[0].paramValue = goodsCode;
        //           itemSlot.childrenList[1].paramValue = goodsName;
        //           itemSlot.childrenList[2].paramValue = checkoutCode;
        //           itemSlot.childrenList[3].paramValue = releasenoTime;
        //         }
        //       }
        //     }
        //   });
      }
    },
    codeKeyUp() {
      if (this.cardNo) {
        this.$ajax
          .post('prMakeRec/remarryRedeemRetrospectDefend', {
            cardNo: this.cardNo,
            line: this.line,
          })
          .then(res => {
            if (this.$ifAjax(res)) {
              if (res.data != null && res.data.dsRbFilePreserveSlotList.length <= 0) {
                return this.$message.warning('暂未查到对应的数据');
              }
              this.preserveSlotList = res.data.dsRbFilePreserveSlotList;
              this.obj = res.data;
            }
          });
      }
    },

    onSubmit() {
      let query = {
        mtuId: this.obj.mtuId,
        line: this.line,
        preserveSlotList: this.preserveSlotList,
      };
      remarryRedeemSaveRetrospectDefend(query).then(res => {
        this.$message.success('保存成功');
        this.$refs.form.resetFields();
        this.cardNo = '';
        this.obj = {};
        this.preserveSlotList = [];
      });
      // this.$ajax
      //   .post('prMakeRec/remarryRedeemSaveRetrospectDefend', {
      // mtuId: this.obj.mtuId,
      // line: this.line,
      // preserveSlotList: this.preserveSlotList
      //   })
      //   .then((res) => {
      //     if (this.$ifAjax(res)) {
      // this.$message.success(this.$t('global.saveOk'));
      // this.$refs.form.resetFields();
      // this.cardNo = '';
      // this.obj = {};
      // this.preserveSlotList = [];
      //     }
      //   });
    },
  },
};
</script>

<style lang="scss"  scoped>
.content-box{
  height: calc(100vh - 40px - 40px - 20px - 10px - 51px - 60px);
  overflow-y: auto;
}
.tableBox {
  min-height: 100%;
  overflow: auto;
  padding-bottom: 30px;
  table {
    tr {
      page-break-inside: avoid;
    }
    td {
      width: 168px;
      height: 30px;
      border: 1px solid #000;
      background: transparent;
      color: #000;
      font-size: 14px;
      text-align: center;
      padding: 0;
      margin: 0;
      :deep(.el-input__inner) {
        text-align: center;
        height: 26px !important;
        width: 80% !important;
      }
    }
  }
}
</style>