<template>
  <div>

    <el-card>
      <el-table :data="sysList" style="width: 100%;   margin-bottom: 8px" key="2" border>
        <el-table-column label="序号" type="index"></el-table-column>
        <el-table-column label="系统名称" prop="sysName" show-overflow-tooltip></el-table-column>
        <el-table-column label="产品编码" prop="thirdId" show-overflow-tooltip></el-table-column>
        <el-table-column label="产品名称" prop="thirdName" show-overflow-tooltip></el-table-column>
        <el-table-column label="规格型号" prop="spec" show-overflow-tooltip></el-table-column>
        <el-table-column label="注册/备案凭证号" prop="registerNo" show-overflow-tooltip></el-table-column>
        <el-table-column label="生产厂家" prop="manufactory" show-overflow-tooltip></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button type="text" @click="addSelectErp(scope.row)" :disabled="scope.row.thirdId==editQuery.nameCode">
              关联
            </el-button>
            <el-button type="text" @click.native.stop="removeErp(scope.row)"
                       :disabled="editQuery.flbm==null || scope.row.thirdId==null || scope.row.thirdId==''">解绑
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-card>
    <el-card>
      <div style=" float: left;
                        text-align: left;
                        font-weight: bold;
                        margin-bottom: 8px">
        <span>产品标识:</span>
      </div>
      <div style=" float: right;
                        text-align: right;
                        margin-bottom: 8px;">
        <el-button type="primary" size="mini" icon="search" @click="removeDi" v-if="productType!=1"
                   style="text-align:right">解绑DI器械信息
        </el-button>
      </div>
      <el-table v-loading="loading" :data="detailList" style="width: 100%; " border key="3" highlight-current-row>
        <el-table-column label="产品标识" prop="nameCode" show-overflow-tooltip></el-table-column>
        <el-table-column label="产品通用名" prop="cpmctymc" show-overflow-tooltip></el-table-column>
        <el-table-column label="包装级别" prop="packLevel" show-overflow-tooltip></el-table-column>
        <el-table-column label="包装层级" prop="bzcj" show-overflow-tooltip></el-table-column>
      </el-table>
    </el-card>

    <el-card>
      <el-form :model="editQuery" :rules="rules" ref="editQuery" border label-width="120px" style="margin-top: 20px;  ">
        <el-row type="flex" class="edit-row">
          <el-col :span="12">
            <el-form-item label="商品条码:">
              <el-input style="width: 80%" size="small" splaceholder="请输入内容" v-model="editQuery.sptm"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="商品名称:">
              <el-input style="width: 80%" size="small" splaceholder="请输入内容" v-model="editQuery.spmc"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" class="edit-row">
          <el-col :span="12">
            <el-form-item label="计量单位:">
              <el-input style="width: 80%" size="small" splaceholder="请输入内容" v-model="editQuery.measname"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="生产企业:">
              <el-input style="width: 80%" size="small" splaceholder="请输入内容" v-model="editQuery.manufactory"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" class="edit-row">
          <el-col :span="12">
            <el-form-item label="产品价格:">
              <el-input style="width: 80%" size="small" splaceholder="请输入内容" v-model="editQuery.price"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="医保编码:">
              <el-input style="width: 80%" size="small" splaceholder="请输入内容" v-model="editQuery.ybbm"></el-input>
            </el-form-item>
          </el-col>
        </el-row>


        <el-row type="flex" class="edit-row">
          <el-col :span="12">
            <el-form-item label="库存积压预警数量:">
              <el-input
                style="width: 80%"
                size="small"
                splaceholder="请输入内容"
                v-model="editQuery.overStockNum"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="低库存预警数量:">
              <el-input
                style="width: 80%"
                size="small"
                splaceholder="请输入内容"
                v-model="editQuery.lowStockNum"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" class="edit-row">
          <el-col :span="12">
            <el-form-item label="近效期预警时间:">
              <el-input
                style="width: 80%"
                size="small"
                splaceholder="请输入内容"
                v-model="editQuery.recentDateTime"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="预警时间格式:">
              <el-select v-model="editQuery.isDateBy" style="width: 65%" placeholder="状态" clearable>
                <el-option label="天" :value="1"></el-option>
                <el-option label="小时" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" class="edit-row">
          <el-col :span="12">
            <el-form-item label="产品描述:">
              <el-input style="width: 80%" size="small" splaceholder="请输入内容" v-model="editQuery.cpms"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-button-group style="display: flex">
          <el-button type="primary" @click.native="submitUpload()" style="margin: 0 60px 10px auto; height: 35px"
                     :loading="loading"
          >提交
          </el-button>
        </el-button-group>
      </el-form>
    </el-card>

    <el-dialog
      title="耗材字典-从指定系统添加器械信息"
      :visible.sync="selectErpDialogVisible"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      width="80%"
      append-to-body
      v-if="selectErpDialogVisible"
    >
      <selectErp
        :closeDialog="closeDialog"
        :uuid="uuid"
        :relId="relId"
        :isImport="isImport"
        :data="thisData"
        :defaultSys="defaultSys"
        @closeUdi="closeUdi2"
        :supEnable="false"
      ></selectErp>
    </el-dialog>

  </div>
</template>

<script>
import {disableUdi, removeDiRl, removeRl, thirdSysDetail} from '@/api/basic/product/udiRelevance'
import {updateById} from '@/api/basic/udiRelevance'
import {filterByUuid} from '@/api/basic/udiInfo'
import selectErp from "./udiInfoselectErpUdi";
import selectUdiVersion from '@/views/basic/product/UdiinfoSelectVersion'

export default {
  name: 'productEdit',
  props: {
    editQuery: {
      type: Object,
      required: true
    },
    productRemarkSet: {
      type: Object,
      required: true
    },
    closeDialog: {
      type: Function,
      required: true
    },
  },

  data() {
    return {
      isUseDyCheck: false,
      useNumEnable: true,
      editDialogVisible: false,
      sysList: {},
      relId: null,
      defaultSys: null,
      detailList: {},
      isImport: null,
      thisData: {
        nameCode: null,
        cpmctymc: null,
        ggxh: null
      },
      selectVersionVisible: false,
      originUuid: null,
      uuid: null,
      editSingleFormat: {
        uuid: null,
        relId: null,
        sptm: null,
        packUnit: null,
        measname: null,
        nameCode: null
      },
      editSingleDiDialogVisible: false,
      selectErpDialogVisible: false,  //选入ERP产品
    }
  },

  methods: {
    submitUpload() {
      var data = {
        id: this.editQuery.prid,
        sptm: this.editQuery.sptm,
        spmc: this.editQuery.spmc,
        measname: this.editQuery.measname,
        manufactory: this.editQuery.manufactory,
        price: this.editQuery.price,
        cpms: this.editQuery.cpms,
        ybbm: this.editQuery.ybbm,
        overStockNum: this.editQuery.overStockNum,
        lowStockNum: this.editQuery.lowStockNum,
        recentDateTime: this.editQuery.recentDateTime,
        isDateBy: this.editQuery.isDateBy,
      }

      updateById(data).then(res => {
        if (res.code == 20000) {
          this.closeDialog();
        } else {
          this.$message.error(response.message);
        }
      })

    },
    getThirdSysDetail() {
      let query = {
        id: this.editQuery.rlId,
      };
      thirdSysDetail(query)
        .then((response) => {
          this.loading = false;
          this.sysList = response.data.list || [];
        })
        .catch(() => {
          this.loading = false;
          this.sysList = [];
        });
    },
    addSelectErp(row) {
      this.defaultSys = row.sysId;
      this.isImport = false;
      this.relId = this.editQuery.rlId;
      this.thisData = this.editQuery;
      this.selectErpDialogVisible = true;
    },
    removeErp(row) {
      this.$confirm("此操作将解除该绑定产品信息, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let query = {
            relId: this.editQuery.rlId,
            thirdSys: row.sysId
          };
          removeRl(query)
            .then((response) => {
              if (response.code == 20000) {
                this.$message({
                  type: "success",
                  message: "删除成功！",
                });
                this.getThirdSysDetail();
              } else {
                this.$message.error(response.message);
              }
            })
            .catch(() => {
            });
        })
        .catch(() => {
        });
    },
    removeDi() {
      this.$confirm("此操作将解除该绑定DI器械信息, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let query = {
            relId: this.editQuery.rlId,
          };
          removeDiRl(query)
            .then((response) => {
              if (response.code == 20000) {
                this.$message({
                  type: "success",
                  message: "删除成功！",
                });
                this.editDialogVisible = false;
                this.closeDialog();
              } else {
                this.$message.error(response.message);
              }
            })
            .catch(() => {
            });
        })
        .catch(() => {
        });
    },
    getDetailList(detailQuery) {
      this.loading = true;
      filterByUuid(detailQuery)
        .then((response) => {
          this.loading = false;
          this.detailList = response.data || [];
        })
        .catch(() => {
          this.loading = false;
          this.detailList = [];
        });
    },
    closeUdi2() {
      this.selectUdiDialogVisible = false;
      this.selectErpDialogVisible = false;
      this.selectLocalVisible = false;
      this.selectVersionVisible = false;
      this.getThirdSysDetail();
    },
  },
  components: {
    selectErp
  },
  created() {
    this.getThirdSysDetail();
    var ttquery = {
      id: this.editQuery.rlId,
      page: 1,
      limit: 10,
    };
    this.getDetailList(ttquery);
  },
}
</script>

<style scoped>

</style>
