<template>
  <div>
    <el-form :model="newProductData" :rules="formRules" label-width="140px" ref="dataForm">

      <el-collapse v-model="activeNames">
        <el-collapse-item name="0" v-if="type != 1">
          <template slot="title">
            <p class="form-title">第三方信息</p>
          </template>
          <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==rowData.nameCode">
                  关联
                </el-button>
                <el-button type="text" @click.native.stop="removeErp(scope.row)"
                           :disabled=" scope.row.thirdId==null || scope.row.thirdId==''"
                >解绑
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-collapse-item>
        <el-collapse-item name="1">
          <template slot="title">
            <p class="form-title">药品层级</p>
          </template>
          <div style=" float: right;
                        text-align: right;
                        margin-bottom: 8px;"
          >
            <el-button type="primary" size="mini" icon="search" @click="addDrugLevel"
                       style="text-align:right"
            >新增药品层级
            </el-button>
          </div>
          <el-table
            v-loading="loading"
            :data="detailList"
            style="width: 100%;"
            border
            key="3"
            @current-change="handleDetail"
          >
            <el-table-column label="序号" type="index"></el-table-column>
            <el-table-column label="层级标识" prop="nameCode" show-overflow-tooltip width="160">
              <template slot-scope="scope">
                <el-input size="small" v-model="scope.row.nameCode" style="width: 100%;margin: 4px;"
                          :disabled="scope.$index !== selectedIndex"
                ></el-input>
              </template>
            </el-table-column>
            <!--            1.主标识，2，使用单元标识，3.本体标识，4，包装标识-->
            <el-table-column label="标识类型" prop="diType" show-overflow-tooltip width="160">
              <template slot-scope="scope">
                <el-select v-model="scope.row.diType"
                           :disabled="scope.$index !== selectedIndex"
                           style="width: 90%" placeholder="选择标识类型" clearable>
                  <el-option label="最小销售标识" :value="1"></el-option>
                  <!--                  <el-option label="使用单元标识" :value="2"></el-option>-->
                  <!--                  <el-option label="本体标识" :value="3"></el-option>-->
                  <el-option label="外包装标识" :value="4"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column label="包装级别" prop="packLevel" show-overflow-tooltip width="100">
              <template slot-scope="scope">
                <el-input size="small" v-model="scope.row.packLevel" style="width: 100%"
                          type="number"
                          :disabled="scope.$index !== selectedIndex"
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column label="层级单位" prop="packUnit" show-overflow-tooltip width="120">
              <template slot-scope="scope">
                <el-input size="small" v-model="scope.row.packUnit" style="width: 100%"
                          :disabled="scope.$index !== selectedIndex"
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column label="下级数量" prop="bhxjsl" show-overflow-tooltip width="100">
              <template slot-scope="scope">
                <el-input size="small" v-model="scope.row.bhxjsl" style="width: 100%"
                          type="number"
                          :disabled="scope.$index !== selectedIndex"
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column label="下级单位" prop="xjdw" show-overflow-tooltip width="120">
              <template slot-scope="scope">
                <el-input size="small" v-model="scope.row.xjdw" style="width: 100%"
                          :disabled="scope.$index !== selectedIndex"
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column label="下级标识" prop="bhxjcpbm" show-overflow-tooltip width="160">
              <template slot-scope="scope">
                <el-input size="small" v-model="scope.row.bhxjcpbm" style="width: 100%"
                          :disabled="scope.$index !== selectedIndex "
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column label="上级标识" prop="sjcpbm" show-overflow-tooltip width="160">
              <template slot-scope="scope">
                <el-input size="small" v-model="scope.row.sjcpbm" style="width: 100%"
                          :disabled="scope.$index !== selectedIndex"
                ></el-input>
              </template>
            </el-table-column>

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

                <!--:disabled=" scope.row.id != null"-->
                <el-button
                  type="text"
                  size="small"
                  @click.stop="true"
                  @click.native="deleteLevel(scope.$index, scope.row)"
                >删除

                </el-button>
              </template>
            </el-table-column>
          </el-table>

          <template>
            <p class="form-title2">流通时采用的计量单位设置</p>
          </template>
          <el-row :gutter="20">
            <el-col :span="11" class="el-col">
              <el-form-item label="计量单位:" prop="distributeLevel" label-width="160px">

                <el-select v-model="newProductData.distributeLevel" size="small" style="width: 90%"
                           clearable
                           @change="distributeLevelDiChange"
                           placeholder="请选择计量单位"
                >
                  <el-option
                    v-for="item in levelUnitList"
                    :key="item.packLevel"
                    :value="item.packLevel"
                    :label="item.packUnit"
                  >
                    <span style="float: right; color: #8492a6; font-size: 13px">单位:{{ item.packUnit }}</span>
                    <span style="float: left">层级:{{ item.packLevel }}</span>
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :span="11" class="el-col">
              <el-form-item label="允许采集的最大层级:" prop="distributeMaxLevel" label-width="160px">
                <el-select v-model="newProductData.distributeMaxLevel" size="small" style="width: 90%"
                           clearable
                           placeholder="请选择允许采集的最大层级"
                >
                  <el-option
                    v-for="item in levelUnitList"
                    :key="item.packLevel"
                    :value="item.packLevel"
                    :label="item.packLevel"
                  >
                    <span style="float: right; color: #8492a6; font-size: 13px">单位:{{ item.packUnit }}</span>
                    <span style="float: left">层级:{{ item.packLevel }}</span>
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-divider></el-divider>
          <template>
            <p class="form-title2">使用时采用的计量单位设置</p>
          </template>
          <el-row :gutter="20">
            <el-col :span="11" class="el-col">
              <el-form-item label="计量单位:" prop="useLevel" label-width="160px">

                <el-select v-model="newProductData.useLevel" size="small" style="width: 90%"
                           clearable
                           @change="useLevelDiChange"
                           placeholder="请选择计量单位"
                >
                  <el-option
                    v-for="item in levelUnitList"
                    :key="item.packLevel"
                    :value="item.packLevel"
                    :label="item.packUnit"
                  >
                    <span style="float: right; color: #8492a6; font-size: 13px">单位:{{ item.packUnit }}</span>
                    <span style="float: left">层级:{{ item.packLevel }}</span>
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :span="11" class="el-col">
              <el-form-item label="允许采集的最大层级:" prop="useMaxLevel" label-width="160px">
                <el-select v-model="newProductData.useMaxLevel" size="small" style="width: 90%"
                           clearable
                           placeholder="请选择允许采集的最大层级"
                >
                  <el-option
                    v-for="item in levelUnitList"
                    :key="item.packLevel"
                    :value="item.packLevel"
                    :label="item.packLevel"
                  >
                    <span style="float: right; color: #8492a6; font-size: 13px">单位:{{ item.packUnit }}</span>
                    <span style="float: left">层级:{{ item.packLevel }}</span>
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="11" class="el-col">
              <el-form-item label="拆包后可用时长(小时):" prop="unpackUseTime" label-width="160px">

                <el-input v-model="newProductData.unpackUseTime" size="small" style="width: 90%"
                          clearable
                          placeholder="请输入拆包后可用时长(小时)"
                >
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-collapse-item>
        <el-collapse-item name="2">
          <template slot="title">
            <p class="form-title">基本信息</p>
          </template>
          <el-row type="flex">
            <el-col :span="11" class="el-col">
              <el-form-item label="医保编码:" prop="ybbm">
                <el-input style="width: 90%" size="small" placeholder="请输入医保编码"
                          v-model.trim="newProductData.ybbm"
                          v-debounce-input:500ms="getYbDrugData"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="11" class="el-col">
              <el-form-item label="商品条码:" prop="sptm">
                <el-input style="width: 90%" size="small" placeholder="请输入药品商品条码"
                          v-model.trim="newProductData.sptm"
                ></el-input>
              </el-form-item>
            </el-col>

          </el-row>
          <el-row type="flex">
            <el-col :span="11" class="el-col">
              <el-form-item label="药品通用名称:" prop="cpmctymc">
                <el-input style="width: 90%" size="small" placeholder="请输入药品通用名称"
                          v-model.trim="newProductData.cpmctymc"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="11" class="el-col">
              <el-form-item label="商品名称:" prop="spmc">
                <el-input style="width: 90%" size="small" placeholder="请输入商品名称"
                          v-model.trim="newProductData.spmc"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex">
            <el-col :span="11" class="el-col">
              <el-form-item label="包装规格:" prop="bzgg">
                <el-input style="width: 90%" size="small" placeholder="请输入包装规格"
                          v-model.trim="newProductData.bzgg"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="11" class="el-col">
              <el-form-item label="最小包装单位:" prop="packUnit">
                <el-input style="width: 90%" size="small" placeholder="请输入最小包装单位"
                          v-model.trim="newProductData.packUnit"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex">
            <el-col :span="11" class="el-col">
              <el-form-item label="制剂规格:" prop="prepnSpec">
                <el-input style="width: 90%" size="small" placeholder="请输入制剂规格"
                          v-model.trim="newProductData.prepnSpec"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="11" class="el-col">
              <el-form-item label="剂型:" prop="prepnUnit">
                <el-input style="width: 90%" size="small" placeholder="请输入剂型"
                          v-model.trim="newProductData.prepnUnit"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex">
            <el-col :span="11" class="el-col">
              <el-form-item label="包装材质:" prop="packMatrial">
                <el-input style="width: 90%" size="small" placeholder="请输入包装材质"
                          v-model.trim="newProductData.packMatrial"
                ></el-input>
              </el-form-item>
            </el-col>
            <!--<el-col :span="11" class="el-col">-->
            <!--  <el-form-item label="包装比例:" prop="packRatio">-->
            <!--    <el-input style="width: 90%" size="small" placeholder="请输入制剂单位"-->
            <!--              v-model.trim="newProductData.packRatio"-->
            <!--    ></el-input>-->
            <!--  </el-form-item>-->
            <!--</el-col>-->
            <el-col :span="11" class="el-col">
              <el-form-item label="批准文号:" prop="zczbhhzbapzbh">
                <el-input style="width: 90%" size="small" placeholder="请输入批准文号"
                          v-model="newProductData.zczbhhzbapzbh"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex">

            <el-col :span="11" class="el-col">
              <el-form-item label="生产企业:" prop="manufactory">
                <el-input style="width: 90%" size="small" placeholder="请输入生产企业"
                          v-model.trim="newProductData.manufactory"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="11" class="el-col">
              <el-form-item label="药品类型:" prop="physicType">
                <el-select v-model="newProductData.physicType" style="width: 90%" placeholder="选择药品类型">
                  <el-option label="普通药品" :value="3"></el-option>
                  <el-option label="特殊药品原料药" :value="1"></el-option>
                  <el-option label="特殊药品制剂" :value="2"></el-option>
                  <el-option label="未分类" :value="9"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex">

            <el-col :span="11" type="flex">
              <el-form-item label="药品分类:" prop="majorType">
                <el-select v-model="newProductData.majorType" style="width: 90%" placeholder="选择药品分类" clearable>
                  <el-option label="中药" :value="1"></el-option>
                  <el-option label="化学药" :value="2"></el-option>
                  <el-option label="生物制品" :value="3"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="11" class="el-col">
              <el-form-item label="医保分类:" prop="medicareType">
                <el-select v-model="newProductData.medicareType" style="width: 90%" placeholder="选择医保分类"
                           clearable
                >
                  <el-option label="甲类" :value="1"></el-option>
                  <el-option label="乙类" :value="2"></el-option>
                  <el-option label="丙类" :value="3"></el-option>
                </el-select>
              </el-form-item>
            </el-col>

          </el-row>
          <el-row type="flex">


            <el-col :span="11" class="el-col">
              <el-form-item label="药品价格:" prop="price">
                <el-input
                  style="width: 90%"
                  size="small"
                  placeholder="请输入药品价格"
                  type="text"
                  v-model="newProductData.price"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="11" class="el-col">
              <el-form-item label="存储条件:" prop="ylqxzcrbarmc">
                <el-input style="width: 90%" size="small" placeholder="请输入存储条件"
                          v-model.trim="newProductData.storageCondition"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <!--<el-row type="flex">-->

          <!--  <el-col :span="11" class="el-col">-->
          <!--    <el-form-item label="有效期:" prop="indate">-->
          <!--      <el-date-picker-->
          <!--          style="width: 90%"-->
          <!--          v-model="newProductData.indate"-->
          <!--          type="datetime"-->
          <!--          format="yyyy 年 MM 月 dd 日 HH 点 mm 分 ss 秒"-->
          <!--          value-format="yyyy-MM-dd HH:mm:ss"-->
          <!--          placeholder="选择有效期"-->
          <!--      >-->
          <!--      </el-date-picker>-->
          <!--    </el-form-item>-->
          <!--  </el-col>-->
          <!--</el-row>-->
          <el-row type="flex">

            <el-col :span="11" class="el-col">
              <el-form-item label="运输条件:" prop="transportCondition">
                <el-input style="width: 90%" size="small" placeholder="请输入运输条件"
                          v-model.trim="newProductData.transportCondition"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="11" class="el-col">
              <el-form-item label="统一社会信用号:" prop="tyshxydm">
                <el-input style="width: 90%" size="small" placeholder="请输入统一社会信用号"
                          v-model.trim="newProductData.tyshxydm"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex">

            <el-col :span="11" class="el-col">
              <el-form-item label="药品状态:" prop="majorStatus">
                <el-select v-model="newProductData.majorStatus" style="width: 90%" placeholder="选择药品状态">
                  <el-option label="停用" :value="0"></el-option>
                  <el-option label="在用" :value="1"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <!--<el-row type="flex" class="edit-row">-->
          <!--<el-col :span="11">-->
          <!--  <el-form-item label="收费项目编码:">-->
          <!--    <el-input-->
          <!--      style="width: 65%"-->
          <!--      size="small"-->
          <!--      placeholder="选择项目收费编码"-->
          <!--      v-model="newProductData.payFeeCode"-->
          <!--    ></el-input>-->
          <!--    <el-button type="primary" size="mini" style="margin-left: 10px" @click="selectPayFeecode">选入-->
          <!--    </el-button>-->
          <!--  </el-form-item>-->
          <!--</el-col>-->
          <!--<el-col :span="11">-->
          <!--  <el-form-item label="是否拆零:" prop="splitEnable">-->
          <!--    <el-select v-model="newProductData.splitEnable" style="width: 90%" placeholder="是否拆零" clearable>-->
          <!--      <el-option label="是" :value="true"></el-option>-->
          <!--      <el-option label="否" :value="false"></el-option>-->
          <!--    </el-select>-->
          <!--  </el-form-item>-->
          <!--</el-col>-->
          <!--</el-row>-->
          <!--<el-row type="flex" class="edit-row">-->
          <!--<el-col :span="11">-->
          <!--  <el-form-item label="是否自动赋码:" prop="autoCode">-->
          <!--    <el-select v-model="newProductData.autoCode" style="width: 90%" placeholder="是否自动赋码" clearable>-->
          <!--      <el-option label="是" :value="true"></el-option>-->
          <!--      <el-option label="否" :value="false"></el-option>-->
          <!--    </el-select>-->
          <!--  </el-form-item>-->
          <!--</el-col>-->
          <!--</el-row>-->
          <el-row type="flex">
            <el-col :span="23" class="el-col">
              <el-form-item label="产品描述:" prop="cpms">
                <el-input style="width: 92%" type="textarea" size="mini" rows="3" placeholder="请输入产品描述"
                          v-model.trim="newProductData.cpms"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-collapse-item>


        <!--        <el-collapse-item name="3">-->
        <!--          <template slot="title">-->
        <!--            <p class="form-title">流通使用参数设置</p>-->
        <!--          </template>-->
        <!--          <el-row :gutter="20">-->
        <!--            <el-col :span="11" class="el-col">-->
        <!--              <el-form-item label="流通计量层级标识:" prop="distributeLevelDi" label-width="160px">-->
        <!--                <el-select v-model="newProductData.distributeLevelDi" size="small" style="width: 90%"-->
        <!--                           @change="distributeLevelDiChange"-->
        <!--                           clearable-->
        <!--                           placeholder="请选择流通计量层级标识"-->
        <!--                >-->
        <!--                  <el-option-->
        <!--                    v-for="item in detailList"-->
        <!--                    :key="item.nameCode"-->
        <!--                    :value="item.nameCode"-->
        <!--                    :label="item.nameCode"-->
        <!--                  >-->
        <!--                    <span style="float: left">{{ item.nameCode }}</span>-->
        <!--                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.packLevel }}</span>-->
        <!--                  </el-option>-->
        <!--                </el-select>-->
        <!--              </el-form-item>-->
        <!--            </el-col>-->
        <!--            <el-col :span="11" class="el-col">-->
        <!--              <el-form-item label="使用计量层级标识:" prop="useLevelDi" label-width="160px">-->
        <!--                <el-select v-model="newProductData.useLevelDi" size="small" style="width: 90%"-->
        <!--                           @change="useLevelDiChange"-->
        <!--                           clearable-->
        <!--                           disabled-->
        <!--                           placeholder="请选择流通计量层级标识"-->
        <!--                >-->
        <!--                  <el-option-->
        <!--                    v-for="item in detailList"-->
        <!--                    :key="item.nameCode"-->
        <!--                    :value="item.nameCode"-->
        <!--                    :label="item.nameCode"-->
        <!--                  >-->
        <!--                    <span style="float: left">{{ item.nameCode }}</span>-->
        <!--                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.packLevel }}</span>-->
        <!--                  </el-option>-->
        <!--                </el-select>-->
        <!--              </el-form-item>-->
        <!--            </el-col>-->
        <!--            <el-col :span="11" class="el-col">-->
        <!--              <el-form-item label="流通计量层级单位:" prop="distributeLevelUnit" label-width="160px">-->
        <!--                <el-input style="width: 90%" size="small" placeholder="请输入流通计量层级单位"-->
        <!--                          disabled-->
        <!--                          v-model="newProductData.distributeLevelUnit"-->
        <!--                ></el-input>-->
        <!--              </el-form-item>-->
        <!--            </el-col>-->
        <!--            <el-col :span="11" class="el-col">-->
        <!--              <el-form-item label="使用计量层级单位:" prop="useLevelUnit" label-width="160px">-->
        <!--                <el-input style="width: 90%" size="small" placeholder="请输入使用计量层级标识"-->
        <!--                          disabled-->
        <!--                          v-model.trim="newProductData.useLevelUnit"-->
        <!--                ></el-input>-->
        <!--              </el-form-item>-->
        <!--            </el-col>-->
        <!--            <el-col :span="11" class="el-col">-->
        <!--              <el-form-item label="流通时含计量单元数量:" prop="distributeLevelCount" label-width="160px">-->
        <!--                <el-input style="width: 90%" size="small" placeholder="请输入流通时包含计量单元的数量"-->
        <!--                          v-model.trim="newProductData.distributeLevelCount"-->
        <!--                ></el-input>-->
        <!--              </el-form-item>-->
        <!--            </el-col>-->
        <!--            <el-col :span="11" class="el-col">-->
        <!--              <el-form-item label="使用时含计量单元数量:" prop="useLeverCount" label-width="160px">-->
        <!--                <el-input style="width: 90%" size="small" placeholder="请输入使用时包含计量单元的数量"-->
        <!--                          v-model.trim="newProductData.useLeverCount"-->
        <!--                ></el-input>-->
        <!--              </el-form-item>-->
        <!--            </el-col>-->

        <!--          </el-row>-->
        <!--        </el-collapse-item>-->
        <el-collapse-item name="4">
          <template slot="title">
            <p class="form-title">高级设置</p>
          </template>
          <el-row type="flex">
            <el-col :span="11" class="el-col">
              <span>参数</span>
            </el-col>
            <el-divider direction="vertical"></el-divider>
            <el-col :span="11" class="el-col">
              <span>设置</span>
            </el-col>
            <el-divider direction="vertical"></el-divider>
            <el-col :span="11" class="el-col">
              <span>参数设置说明</span>
            </el-col>
          </el-row>
          <el-row type="flex">
            <el-col :span="11" class="el-col">
              <span class="sptext">是否禁用</span>
            </el-col>
            <el-divider direction="vertical"></el-divider>
            <el-col :span="11" class="el-col">
              <el-switch
                v-model="status"
                active-color="#13ce66"
                inactive-color="#ff4949"
              >
              </el-switch>
            </el-col>
            <el-divider direction="vertical"></el-divider>
            <el-col :span="11" class="el-col">
              <span class="sptext">禁用后该药品将无法扫码使用</span>
            </el-col>
          </el-row>
        </el-collapse-item>
      </el-collapse>
    </el-form>
    <div style="text-align: center; margin-top: 20px;">
      <el-button type="primary" @click="saveNewProduct" :loading="saveLoading">提交</el-button>
      <el-button @click="closeAddDialog">取消</el-button>
    </div>

    <el-dialog
      title="收费项目选入"
      :visible.sync="tollProjectDialogVisible"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      width="70%"
      v-if="tollProjectDialogVisible"
      append-to-body
    >
      <!--<product-single-edit-->
      <!--  :editQuery="editSingleFormat"-->
      <!--&gt;</product-single-edit>-->
      <selectChargesProjectDialog
        :getData="getData"
      >
      </selectChargesProjectDialog>
      <!--<div style="text-align: center;margin-top: 12px">-->
      <!--  <el-button type="primary" size="small" icon="search" @click="onAddSingleSubmit(false)" :loading="addLoading"-->
      <!--  >提交-->
      <!--  </el-button>-->
      <!--  <el-button type="primary" size="small" icon="search" @click="cancelDialog"-->
      <!--  >取消-->
      <!--  </el-button>-->
      <!--</div>-->
    </el-dialog>

    <el-dialog
      title="药品字典-从指定系统添加药品字典"
      :visible.sync="chooseHouseDrugVisible"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      width="85%"
      v-if="chooseHouseDrugVisible"
    >
      <chooseHouseDrug
        :uuid="uuid"
        :relId="relId"
        :isImport="isImport"
        :data="thisData"
        :defaultSys="defaultSys"
        :supEnable="false"
        @closeUdi="closeUdi"
      ></chooseHouseDrug>
    </el-dialog>


  </div>
</template>

<script>
import {
  addDrug,
  updatetDrug,
  delDrugLevel,
  updateLevelDrug, calculateDistCount, calculateUseCount
} from '@/api/basic/product/drugUdiinfos'
import {isBlank} from "@/utils/strUtil";

import {
  getYbDrugDetail, removeRl, thirdSysDetail
} from '@/api/basic/product/udiRelevance'
import {filterClassify} from '@/api/purchase/classifyCode'
import {filterByUuid, levelByUuid} from '@/api/basic/product/udiInfo'
import selectChargesProjectDialog from './selectChargesProjectDialog'
import chooseHouseDrug from './chooseHouseDrug'

export default {
  name: 'drugAdd',
  props: {
    closeDialog: {
      type: Function,
      required: true
    },
    rowData: {
      type: Object,
      required: false
    },
    type: {
      //1：新增；2：编辑
      type: Object,
      required: false
    },
    uuid: {
      type: Object,
      required: true
    },
    relId: {
      type: Object,
      required: true
    },
    thisData: {
      type: Object,
      required: true
    },
    relevanceEdit: {
      type: Object,
      required: true
    }
  },
  components: {selectChargesProjectDialog, chooseHouseDrug},
  data() {
    return {
      ybDrugDetail: {},
      productData: {},
      newProductData: {
        cpmctymc: null,
        bzgg: null,
        spmc: null,
        measname: null,
        manufactory: null,
        ybbm: null,
        cpms: null,
        productsType: 2,
        //高级设置默认开启扫码
        status: false,
        relId: null,
        drugLevelLists: [],
        productId: null,

        useLevelDi: null,
        distributeLevelDi: null,
        distributeLevelUnit: null,
        useLeverCount: null,
        distributeLevelCount: null,
        useLevelUnit: null,
        distributeLevel: null,
        useLevel: null,
        majorStatus: 1,
        physicType: 3

      },
      thirdSys: [],
      classifyList: [],
      saveLoading: false,
      activeNames: ['0', '1', '2'],
      formRules: {
        cpmctymc: [
          {required: true, message: '请输入药品通用名', trigger: 'blur'}
        ],
        prepnSpec: [
          {required: true, message: '请输入制剂规格', trigger: 'blur'}
        ],
        packUnit: [
          {required: true, message: '请输入包装单位', trigger: 'blur'}
        ],
        prepnUnit: [
          {required: true, message: '请输入制剂单位', trigger: 'blur'}
        ],
        // packRatio: [
        //   {required: true, message: '请输入包装比例', trigger: 'blur'}
        // ],
        packMatrial: [
          {required: true, message: '请输入包装材质', trigger: 'blur'}
        ],
        zczbhhzbapzbh: [
          {required: true, message: '请输入批准文号', trigger: 'blur'}
        ],
        manufactory: [
          {required: true, message: '生产企业不能为空', trigger: 'blur'}
        ],
        physicType: [
          {required: true, message: '药品类型不能为空', trigger: 'blur'}
        ],
        ybbm: [
          {required: true, message: '医保编码不能为空', trigger: 'blur'}
        ],
        price: [
          {required: true, message: '药品价格不能为空', trigger: 'blur'}
        ],
        majorStatus: [
          {required: true, message: '请选择药品状态', trigger: 'blur'}
        ],
        distributeLevel: [
          {required: true, message: '请选择计量单位', trigger: 'blur'}
        ],
        distributeMaxLevel: [
          {required: true, message: '请选择允许采集的最大层级', trigger: 'blur'}
        ],
        useLevel: [
          {required: true, message: '请选择计量单位', trigger: 'blur'}
        ],
        useMaxLevel: [
          {required: true, message: '请选择允许采集的最大层级', trigger: 'blur'}
        ],
      },
      detailList: [
        // 初始化一个空对象或包含默认值的对象
        {
          productId: null,
          nameCode: '',
          packLevel: null,
          bhxjsl: null,
          isDisabled: false,
          isUpDisabled: true,
          rowDisabled: false
        }
      ],
      status: false,
      rowDisabled: false,
      selectedIndex: null,
      isSave: true,
      loading: false,
      tollProjectDialogVisible: false,
      sysList: [],
      chooseHouseDrugVisible: false,
      isImport: false,
      defaultSys: null,
      levelUnitList: [],
      maxLevel: 1,
    }

  },
  methods: {
    classifyChange() {
      this.classifyChange(this.newProductData.flbm)
      let item = this.classifyList.find(item => item.code == this.newProductData.flbm)
      if (item != null) this.newProductData.requireScanCode = item.requireScanCode
    },
    classifySearch(key) {
      let query = {
        key: key
      }
      filterClassify(query)
        .then(response => {
          this.loading = false
          this.classifyList = response.data.list || []
        })
        .catch(() => {
          this.loading = false
          this.classifyList = []
        })
    },
    getYbDrugData() {
      let query = {
        goodsCode: this.newProductData.ybbm
      }
      getYbDrugDetail(query).then((response) => {
        if (response.code == 20000) {
          this.ybDrugDetail = response.data
          //对照关系
          this.newProductData.prepnSpec = this.ybDrugDetail.realityOutlook
          this.newProductData.zczbhhzbapzbh = this.ybDrugDetail.approvalCode
          this.newProductData.cpmctymc = this.ybDrugDetail.registeredProductName
          this.newProductData.spmc = this.ybDrugDetail.goodsName
          this.newProductData.bzgg = this.ybDrugDetail.factor + this.ybDrugDetail.minUnit + "/" + this.ybDrugDetail.unit
          this.newProductData.matrial = this.ybDrugDetail.materialName
          this.newProductData.packMatrial = this.ybDrugDetail.materialName
          this.newProductData.packUnit = this.ybDrugDetail.unit
          this.newProductData.bhxjsl = this.ybDrugDetail.factor
          this.newProductData.manufactory = this.ybDrugDetail.companyNameSc
          this.newProductData.prepnUnit = this.ybDrugDetail.realityMedicinemodel

          if (this.ybDrugDetail.productInsuranceType != "" && this.ybDrugDetail.productInsuranceType != null) {
            if ("甲" == this.ybDrugDetail.productInsuranceType) {
              this.newProductData.medicareType = 1
            } else if ("乙" == this.ybDrugDetail.productInsuranceType) {
              this.newProductData.medicareType = 2
            } else if ("丙" == this.ybDrugDetail.productInsuranceType) {
              this.newProductData.medicareType = 3
            } else {
              this.newProductData.medicareType = null
            }
            console.log(this.newProductData.medicareType)

          }

          this.$forceUpdate()
        } else {
          // this.$forceUpdate()
        }
      }).catch(() => {
      })

    },
    saveNewProduct() {
      if (!this.isSave) {
        return this.$message.error("请先保存药品层级")
      }
      this.addProductDialogVisible = false
      this.newProductData.registerNo = this.newProductData.zczbhhzbapzbh
      this.newProductData.splitEnable = true
      this.newProductData.autoCode = true
      // this.newProductData.updateLevelDrugRequests = this.detailList
      //新增
      if (this.type == 1) {
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            if (this.status) {
              this.newProductData.requireScanCode = 1
            } else {
              this.newProductData.requireScanCode = 0
            }

            if (this.detailList.length <= 0) {
              this.$message.error('请先添加药品层级标识')
              return
            } else {
              const validateItem = (item, fieldName, errorMessage) => {
                if (!item[fieldName]) {
                  this.$message.error(errorMessage)
                  return false
                }
                return true
              }
              for (let i = 0; i < this.detailList.length; i++) {
                const item = this.detailList[i]
                if (!validateItem(item, 'nameCode', '药品层级标识不能为空！') ||
                  !validateItem(item, 'packLevel', '包装级别不能为空') ||
                  !validateItem(item, 'packUnit', '层级单位不能为空')) {
                  return
                }
              }
              const isLevel1 = this.detailList.some(item => item.packLevel === 1)
              if (!isLevel1) {
                this.$message.error('药品层级缺少一级标识！')
              }
              this.newProductData.drugLevelLists = this.detailList

            }
            this.saveLoading = true

            addDrug(this.newProductData).then((res) => {
              this.saveLoading = false
              if (res.code == 20000) {
                this.$message.success('添加成功')
                //清空弹窗数据
                this.closeDialog()
              } else {
                this.$message.error(res.message)
              }
            }).catch((error) => {
              this.saveLoading = false
              this.$message.error(error.message)
            })
          }
        })
      } else {
        this.$refs['dataForm'].validate((valid) => {
          if (!valid) {
            return this.$message.error('请补充必要数据')
          }
          if (this.status) {
            this.newProductData.requireScanCode = 1
          } else {
            this.newProductData.requireScanCode = 0
          }
          this.newProductData.uuid = this.rowData.uuid
          this.newProductData.nameCode = this.rowData.nameCode
          this.newProductData.relId = this.newProductData.id
          updatetDrug(this.newProductData).then(res => {
            this.saveLoading = false
            if (res.code == 20000) {
              //清空弹窗数据
              this.closeDialog()
              this.$message.success('保存成功')
            } else {
              this.$message.error(res.message)
            }
          })
        })
      }

    },
    closeAddDialog() {
      this.closeDialog()
    },

    //层级保存
    levelSave(row) {
      if (isBlank(row.nameCode)) {
        this.$message.error('层级标识不能为空')
        return
      }
      if (isBlank(row.packLevel)) {
        this.$message.error('包装级别不能为空')
        return
      }
      if (isBlank(row.packUnit)) {
        this.$message.error('层级单位不能为空')
        return
      }
      let editQuery = {
        nameCode: row.nameCode,
        packLevel: row.packLevel,
        packUnit: row.packUnit,
        sjcpbm: row.sjcpbm,
        bhxjcpbm: row.bhxjcpbm,
        bhxjsl: row.bhxjsl,
        relId: this.newProductData.id,
        uuid: this.newProductData.uuid,
        productId: row.productId,
        diType: row.diType,
        xjdw: row.xjdw
      }
      updateLevelDrug(editQuery).then(res => {
        this.saveLoading = false
        if (res.code == 20000) {
          this.isSave = true
          this.$message.success('保存成功！')
          this.selectedIndex = null
          this.getDetailList()
          this.getDiLevel();
        } else {
          this.isSave = true
          this.$message.error(res.message)
        }
      })
    },
    update(row) {
      row.isDisabled = false
      row.isUpDisabled = true
      row.rowDisabled = false
    },
    addDrugLevel() {
      this.detailList.push({
        nameCode: '',
        packLevel: null,
        bhxjsl: null,
        isDisabled: false,
        rowDisabled: false,
        isUpDisabled: true
      })
      this.newProductData.productId = null
      this.selectedIndex = this.detailList.length - 1
      this.isSave = false
    },

    rowChange(index, val) {
      this.selectedIndex = index

      this.isSave = false
    },

    deleteLevel(index, row) {
      this.$confirm('此操作将删除该层级，是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        if (row.id != null) {
          let params = {nameCode: row.nameCode}
          delDrugLevel(params).then((res) => {
            if (res.code === 20000) {
              this.isSave = true
              this.$message.success('删除成功')
              this.getDetailList()
            }
          })
        } else {
          this.isSave = true
          this.detailList.splice(index, 1)
          this.$message.success('删除成功')
        }
      }).catch(() => {
      })
    },

    //获取层级标识
    getDetailList() {
      if (this.newProductData.uuid != null) {
        let query = {
          uuid: this.newProductData.uuid,
          id: this.newProductData.id,
          nameCode: this.newProductData.nameCode,
          productType: this.newProductData.productsType,
        }
        this.loading = true
        filterByUuid(query)
          .then((response) => {
            this.loading = false
            this.detailList = response.data || []
          })
          .catch(() => {
            this.loading = false
            this.detailList = []
          })
      }
    },

    distributeLevelDiChange(val) {
      const matchingItem = this.detailList.find(item => item.nameCode == val)
      if (matchingItem) {
        this.newProductData.distributeLevelUnit = matchingItem.packUnit
        this.newProductData.distributeLevel = matchingItem.packLevel
      }
      calculateDistCount(matchingItem).then((res) => {
        this.newProductData = {
          ...this.newProductData,
          distributeLevelCount: res.data.distributeLevelCount
        }
      })

    },
    useLevelDiChange(val) {
      const matchingItem = this.detailList.find(item => item.nameCode == val)
      if (matchingItem) {
        this.newProductData.useLevelUnit = matchingItem.packUnit
        this.newProductData.useLevel = matchingItem.packLevel
      }
      calculateUseCount(matchingItem).then((res) => {
        this.newProductData = {
          ...this.newProductData,
          useLeverCount: res.data.useLeverCount
        }
      })
    },
    getDiLevel() {
      let query = {
        id: this.relId
      }
      this.loading = true
      levelByUuid(query)
        .then((response) => {
          this.loading = false
          this.levelUnitList = response.data || []
          this.findMaxLevelObject()
        })
        .catch(() => {
          this.loading = false
          this.levelUnitList = []
        })
    },

    findMaxLevelObject() {
      this.maxLevel = 1;
      for (const obj of this.levelUnitList) {
        if (obj.packLevel > this.maxLevel) {
          this.maxLevel = Number(obj.packLevel);
        }
      }
    },

    /**
     * 选择收费项目
     */
    selectPayFeecode() {
      this.tollProjectDialogVisible = true
    },

    getData(data) {
      this.tollProjectDialogVisible = false
      this.newProductData.payFeeCode = data.medCatalogCode
    },
    /**
     * 第三方系统药品信息
     */
    getThirdSysDetail() {
      let query = {
        id: this.relevanceEdit.id
      }
      thirdSysDetail(query)
        .then((response) => {
          this.loading = false
          this.sysList = response.data.list || []
          this.resetThirdId()
        })
        .catch(() => {
          this.loading = false
          this.sysList = []
        })
    },
    resetThirdId() {
      this.sysList.forEach((item) => {
        if (item.sysId === 'thirdId') {
          this.newProductData.thirdId = item.thirdId
        } else if (item.sysId === 'thirdId1') {
          this.newProductData.thirdId1 = item.thirdId
        } else if (item.sysId === 'thirdId2') {
          this.newProductData.thirdId2 = item.thirdId
        } else if (item.sysId === 'thirdId3') {
          this.newProductData.thirdId3 = item.thirdId
        } else if (item.sysId === 'thirdId4') {
          this.newProductData.thirdId4 = item.thirdId
        }
      })
    },
    /**
     * 关联 第三方
     */
    addSelectErp(row) {
      this.defaultSys = row.sysId
      this.isImport = false
      this.chooseHouseDrugVisible = true
    },
    removeErp(row) {
      this.$confirm('此操作将解除该绑定药品信息, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          let query = {
            relId: this.relId,
            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(() => {
        })
    },
    closeUdi(val) {
      this.chooseHouseDrugVisible = false
      this.getThirdSysDetail()
    }

  },
  created() {
    if (this.rowData != null) {
      this.newProductData = this.rowData
      this.newProductData.cpmctymc = this.rowData.cpmctymc
      this.newProductData.zczbhhzbapzbh = this.rowData.zczbhhzbapzbh
      if (this.rowData.requireScanCode == 1) {
        this.status = true
      } else {
        this.status = false
      }
      this.getDiLevel()
      this.getDetailList()
      this.getThirdSysDetail()
    } else {
      this.selectedIndex = 0
    }
  },
  directives: {
    'debounce-input': {
      inserted(el, binding) {
        let timeout
        el.addEventListener('input', () => {
          clearTimeout(timeout)
          timeout = setTimeout(() => {
            binding.value()
          }, parseInt(binding.arg) || 300)
        })
      }
    }
  }
}
</script>

<style scoped>
.form-title {
  font-size: 16px;
  font-family: Noto Sans SC;
  font-weight: bold;
  color: #303133;
  padding-bottom: 17px;
  padding-top: 17px;
}

.form-title2 {
  font-size: 16px;
  font-family: Noto Sans SC;
  font-weight: bold;
  color: #303133;
}

</style>
