<template>
  <div>

    <el-form
      :model="editQuery"
      :rules="rules"
      ref="editQuery"
      border
      label-width="120px"
    >
      <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.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.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.spmc"
            ></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.cpms"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row type="flex" class="edit-row">
        <el-col :span="12" v-if="productRemarkSet.remarkEnable1">
          <el-form-item :label="productRemarkSet.remarkTitle1+':'" +>
            <el-input
              style="width: 80%"
              size="small"
              splaceholder="请输入内容"
              v-model="editQuery.basicPrductRemak1"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="productRemarkSet.remarkEnable2">
          <el-form-item :label="productRemarkSet.remarkTitle2+':'" +>
            <el-input
              style="width: 80%"
              size="small"
              splaceholder="请输入内容"
              v-model="editQuery.basicPrductRemak2"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row type="flex" class="edit-row">
        <el-col :span="12" v-if="productRemarkSet.remarkEnable3">
          <el-form-item :label="productRemarkSet.remarkTitle3+':'" +>
            <el-input
              style="width: 80%"
              size="small"
              splaceholder="请输入内容"
              v-model="editQuery.basicPrductRemak3"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="productRemarkSet.remarkEnable4">
          <el-form-item :label="productRemarkSet.remarkTitle4+':'" +>
            <el-input
              style="width: 80%"
              size="small"
              splaceholder="请输入内容"
              v-model="editQuery.basicPrductRemak4"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row type="flex" class="edit-row">
        <el-col :span="12" v-if="productRemarkSet.remarkEnable5">
          <el-form-item :label="productRemarkSet.remarkTitle5+':'" +>
            <el-input
              style="width: 80%"
              size="small"
              splaceholder="请输入内容"
              v-model="editQuery.basicPrductRemak5"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="productRemarkSet.remarkEnable6">
          <el-form-item :label="productRemarkSet.remarkTitle6+':'" +>
            <el-input
              style="width: 80%"
              size="small"
              splaceholder="请输入内容"
              v-model="editQuery.basicPrductRemak6"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row type="flex" class="edit-row">
        <el-col :span="12" v-if="productRemarkSet.remarkEnable7">
          <el-form-item :label="productRemarkSet.remarkTitle7+':'" +>
            <el-input
              style="width: 80%"
              size="small"
              splaceholder="请输入内容"
              v-model="editQuery.basicPrductRemak7"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="productRemarkSet.remarkEnable8">
          <el-form-item :label="productRemarkSet.remarkTitle8+':'" +>
            <el-input
              style="width: 80%"
              size="small"
              splaceholder="请输入内容"
              v-model="editQuery.basicPrductRemak8"
            ></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="请输入内容"
              :disabled="useNumEnable"
              type="number"
              v-model="editQuery.useNum"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row type="flex">
        <el-col :span="24">
          <div style="margin-bottom: 18px;margin-left: 25px">
            <el-checkbox v-model="editQuery.isDisable" class=""
                         @change="diableChange"
            >是否禁用
            </el-checkbox>
            <el-checkbox v-model="editQuery.isAdavence" class=""
            >是否寄售
            </el-checkbox>
            <el-checkbox v-model="editQuery.allowNoBatch" class=""
            >允许无批次号
            </el-checkbox>
            <el-checkbox v-model="editQuery.allowNoExpire" class=""
            >允许无失效日期
            </el-checkbox>
            <el-checkbox v-model="editQuery.allowNoProduct" class=""
            >允许无生产日期
            </el-checkbox>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20" class="el-row" type="flex">
        <el-col :span="24" class="el-col">
          <div style="margin-bottom: 18px;margin-left: 25px">
            <el-checkbox v-model="checked" class=""
                         :disabled="!isUseDyCheck  || editQuery.useMuti==true "
                         @change="useDyCheckChange"
            >启用使用单元
            </el-checkbox>
            <el-checkbox v-model="editQuery.useMuti" class=""
                         :disabled="checked"
                         @change="useMutiChange"
            >允许科室多次使用出库
            </el-checkbox>
          </div>
        </el-col>
      </el-row>
      <el-divider></el-divider>
    </el-form>
  </div>
</template>

<script>
import {disableUdi} from "@/api/basic/product/udiRelevance";

export default {
  name: "productEdit",
  props: {
    editQuery: {
      type: Object,
      required: true,
    },
    productRemarkSet: {
      type: Object,
      required: true,
    },


  },

  data() {
    return {
      isUseDyCheck: false,
    }
  },

  methods: {
    diableChange() {
      let query = {
        relId: this.pId
      }
      disableUdi(query)
        .then((response) => {
          if (response.code != 20000) {
            this.editQuery.isDisable = false;
            this.$message.error(response.message);
          }

        })
        .catch(() => {
          this.loading = false;
          this.detailList = [];
        });
    },

    useDyCheckChange(val) {
      this.editQuery.useNum = 0;
    },
    useDyCountChange(val) {
      if (val) {
        this.editQuery.useNum = this.editQuery.zxxsbzbhsydysl;
      } else {
        this.editQuery.useNum = 0;
      }
    },
    useMutiChange(val) {
      if (val) {
        this.useNumEnable = false;
        this.editQuery.useNum = this.editQuery.zxxsbzbhsydysl;
      } else {
        this.useNumEnable = true;
        this.editQuery.useNum = 0;
      }
    },

  }
}
</script>

<style scoped>

</style>
