<template>
  <div>


    <el-table v-loading="loading" :data="detailList" style="width: 100%;" max-height="350" height="350"
              border
              :row-style="rowStyle"
              ref="multipleTable">
      <el-table-column type="index" label="序号" width="50"></el-table-column>
      <el-table-column
        label="产品标识" width="150"
        prop="nameCode"
        show-overflow-tooltip
      ></el-table-column>
      <el-table-column label="产品通用名" width="150" prop="coName" show-overflow-tooltip></el-table-column>
      <el-table-column label="规格" width="150" prop="spec" show-overflow-tooltip></el-table-column>
      <el-table-column label="批次号" width="150" prop="batchNo" show-overflow-tooltip></el-table-column>
      <el-table-column label="生产日期" width="120" prop="productDate" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ convertDateFun(scope.row.productDate) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="失效日期" width="120" prop="expireDate" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ convertDateFun(scope.row.expireDate) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="扫码数量" width="80" prop="count" show-overflow-tooltip></el-table-column>
      <el-table-column label="实际数量" width="80" prop="reCount" show-overflow-tooltip></el-table-column>
      <el-table-column width="100" label="计量单位" prop="measname">
      </el-table-column>
      <el-table-column label="生产企业" width="150" prop="manufacturer" show-overflow-tooltip></el-table-column>
      <el-table-column label="注册/备案号" width="150" prop="certCode" show-overflow-tooltip></el-table-column>

      <el-table-column label="操作" width="160" fixed="right">
        <template slot-scope="scope">
          <el-button type="text" size="small" v-if="scope.row.index == selectedIndex" @click.stop="true"
                     @click.native="saveChange(scope.row)">保存
          </el-button>
          <el-button type="text" size="small" v-if="scope.row.index != selectedIndex" @click.stop="true"
                     @click.native="rowChange(scope.row)">编辑
          </el-button>
        </template>
      </el-table-column>

    </el-table>
  </div>
</template>

<script>
import {convertDate} from "@/utils/date";
import {getDetailCodes, updateBizProduct, updateCodeProduct} from "@/api/inout/orderDetailCode";

export default {
  name: "IoCreateOrderCodeDetail",
  props: {
    idQuery: {
      type: Object,
      required: true,
    },
    viewType: {
      type: Object,
      required: true,
    },
    curAction: {
      type: Object,
      required: true,
    },
  },
  data() {
    return {
      convertDateFun: convertDate,
      loading: false,
      query: {
        orderId: null,
        code: "",
        corpOrderId: "",
      },
      detailList: [],
      total: 0,
      selectRlVisible: false,
      dialogTableVisible: false,
      editCodeVisible: false,
    }
  },

  watch: {
    "curAction": {
      handler(newVal, oldVal) {

      },
      immediate: true
    }
  },
  methods: {
    getOrderDetails() {
      this.loading = true;
      this.query.orderId = this.idQuery.billNo;
      getDetailCodes(this.query) //查找该单号下的所有条码
        .then((response) => {
          this.detailList = response.data.list || [];
          this.total = response.data.total || 0;
          this.loading = false;
        })
        .catch(() => {
          this.loading = false;
          this.detailList = [];
          this.total = 0;
        });
    },

    rowStyle({row, rowIndex}) {
      let rowBackground = {};
      if (this.viewType == 3 && !row.checkSuccess) {
        rowBackground.color = '#f60303';
      }
      return rowBackground;
    },


    saveChange(row) {
      if (row.batchNo == '') {
        row.batchNo = null;
      }
      updateCodeProduct(row)
        .then((response) => {
          this.loading = false;
          if (response.code === 20000) {
            this.$message.success("保存成功！");
            this.selectedIndex = null;
            this.refreshPanel();

          } else {
            this.$message.error(response.message);
          }
        })
        .catch(() => {
          this.loading = false;
          this.dataList = [];
          this.pageTotal = 0;
        });
    },
    rowChange(val) {
      this.currentRow = val;
      if (this.currentRow.batchNo == '')
        this.currentRow.batchNo = null;
      this.selectedIndex = val.index;
    },

  },
  created() {
    if (this.idQuery.billNo != null)
      this.getOrderDetails();
  },
}
</script>

<style scoped>

</style>
