<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="90px">

      <el-form-item label="商品分类" prop="cateId">
        <treeselect v-model="queryParams.cateId" style="width:205.4px" :options="categoryOptions"
                    :normalizer="normalizer" placeholder="请选择分类"/>
      </el-form-item>

      <el-form-item label="商品名称" prop="productName">
        <el-input
          v-model="queryParams.productName"
          placeholder="请输入商品名称"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>

      <el-form-item label="商品编号" prop="barCode">
        <el-input
          v-model="queryParams.barCode"
          placeholder="请输入商品编号"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>


      <el-form-item label="商品类型" prop="productType">
        <el-select v-model="queryParams.productType" placeholder="请选择商品类型" clearable size="small">
          <el-option
            v-for="item in productTypeOptions"
            :key="item.dictValue"
            :label="item.dictLabel"
            :value="item.dictValue"
          />
        </el-select>
      </el-form-item>

      <div v-if="medicalMallConfig.isAudit">
        <el-form-item label="注册证号/备案凭证编号" prop="drugRegCertNo">
          <el-input
            v-model="queryParams.drugRegCertNo"
            placeholder="请输入药品注册证书编号"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="通用名称" prop="commonName">
          <el-input
            v-model="queryParams.commonName"
            placeholder="请输入通用名称"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="剂型" prop="dosageForm">
          <el-input
            v-model="queryParams.dosageForm"
            placeholder="请输入剂型"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="单价" prop="unitPrice">
          <el-input
            v-model="queryParams.unitPrice"
            placeholder="请输入单价"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="生产批号/序列号" prop="batchNumber">
          <el-input
            v-model="queryParams.batchNumber"
            placeholder="请输入批号"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="上市许可持有人" prop="mah">
          <el-input
            v-model="queryParams.mah"
            placeholder="请输入上市许可持有人"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="持有人地址" prop="mahAddress">
          <el-input
            v-model="queryParams.mahAddress"
            placeholder="请输入持有人地址"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="生产企业" prop="manufacturer">
          <el-input
            v-model="queryParams.manufacturer"
            placeholder="请输入生产企业"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="生产企业地址" prop="manufacturerAddress">
          <el-input
            v-model="queryParams.manufacturerAddress"
            placeholder="请输入生产企业地址"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="功能主治/适用范围" prop="indications">
          <el-input
            v-model="queryParams.indications"
            placeholder="请输入功能主治/适用范围"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="用法用量" prop="dosage">
          <el-input
            v-model="queryParams.dosage"
            placeholder="请输入用法用量"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="不良反应" prop="adverseReactions">
          <el-input
            v-model="queryParams.adverseReactions"
            placeholder="请输入不良反应"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="禁忌症" prop="contraindications">
          <el-input
            v-model="queryParams.contraindications"
            placeholder="请输入禁忌症"
            clearable
            size="small"

          />
        </el-form-item>

        <el-form-item label="注意事项" prop="precautions">
          <el-input
            v-model="queryParams.precautions"
            placeholder="请输入注意事项"
            clearable
            size="small"

          />
        </el-form-item>
        <el-form-item label="包装规格/型号" prop="prescribeSpec">
          <el-input
            v-model="queryParams.prescribeSpec"
            placeholder="请输入包装规格"
            clearable
            size="small"
          />
        </el-form-item>

        <el-form-item label="交易状态" prop="transactionStatus">
          <el-select v-model="queryParams.transactionStatus" placeholder="请选择" clearable>
            <el-option
              v-for="item in orderOptions"
              :key="item.dictValue"
              :label="item.dictLabel"
              :value="item.dictValue"
            >
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="商品评价" prop="commentContent">
          <el-input
            v-model="queryParams.commentContent"
            placeholder="商品评价"
            clearable
            size="small"
          />
        </el-form-item>
        <el-form-item label="咨询/投诉" prop="complaint">
          <el-input
            v-model="queryParams.complaint"
            placeholder="咨询/投诉"
            clearable
            size="small"
          />
        </el-form-item>
      </div>
      <el-form-item>
        <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
        >新增
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          icon="el-icon-edit"
          size="mini"
          :disabled="multiple"
          @click="handleUpdate"
          v-hasPermi="['store:storeProduct:edit']"
        >修改
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['store:storeProduct:remove']"
        >删除
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="info"
          plain
          icon="el-icon-upload2"
          size="mini"
          @click="handleImport"
          v-hasPermi="['store:storeProduct:import']"
        >导入
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['store:storePayment:export']"
        >导出
        </el-button>
      </el-col>

      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-refresh"
          size="mini"
          :disabled="multiple"
          @click="handleSync"
          v-hasPermi="['store:storeProduct:sync']"
        >同步
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-close"
          size="mini"
          :disabled="multiple"
          @click="handleBatchOff"
          v-hasPermi="['store:storeProduct:updateIsShow']"
        >批量下架
        </el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-tabs type="card" v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="全部商品" name="-1"></el-tab-pane>
      <el-tab-pane label="出售中" name="1"></el-tab-pane>
      <el-tab-pane label="待上架" name="0"></el-tab-pane>
      <el-tab-pane label="审核中" name="3"></el-tab-pane>
      <el-tab-pane label="已驳回" name="4"></el-tab-pane>
    </el-tabs>

    <el-table height="500" border v-loading="loading" :data="storeProductList"
              @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center"/>
      <el-table-column label="ID" align="center" prop="productId"/>
      <el-table-column label="商品图片" align="center" width="120">
        <template slot-scope="scope">
          <el-popover
            placement="right"
            title=""
            trigger="hover">
            <img slot="reference" :src="scope.row.image" width="100">
            <img :src="scope.row.image" style="max-width: 150px;">
          </el-popover>
        </template>
      </el-table-column>
      <el-table-column label="商品名称" show-overflow-tooltip align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.commonName && scope.row.commonName !== '-' ? scope.row.commonName : scope.row.productName }}</span>
        </template>
      </el-table-column>
      <el-table-column label="分类" align="center" prop="cateName"/>
      <!-- <el-table-column label="所属公司" align="center" prop="companyName" /> -->
      <el-table-column label="所属店铺" align="center" prop="storeName" v-if="medicalMallConfig.isStores"/>
      <el-table-column label="售价" align="center" prop="price">
        <template slot-scope="scope">
          <span v-if="scope.row.price!=null">{{ scope.row.price.toFixed(2) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="原价" align="center" prop="otPrice">
        <template slot-scope="scope">
          <span v-if="scope.row.otPrice!=null">{{ scope.row.otPrice.toFixed(2) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="销量" align="center" prop="sales"/>
      <el-table-column label="库存" align="center" prop="stock"/>
      <el-table-column label="类型" align="center" prop="productType">
        <template slot-scope="scope">
          <el-tag prop="productType" v-for="(item, index) in productTypeOptions"
                  v-if="scope.row.productType==item.dictValue">{{ item.dictLabel }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column label="状态" align="center" prop="isShow">
        <template slot-scope="scope">
          <dict-tag :options="isShowOptions" :value="scope.row.isShow"/>
        </template>
      </el-table-column>
      <el-table-column label="下架备注" align="center" prop="offlineRemark" min-width="180" :show-overflow-tooltip="true"/>
      <el-table-column label="同步状态" align="center" prop="pushStatus">
        <template slot-scope="scope">
          <el-tag
            :type="scope.row.pushStatus === 1 ? 'success' : scope.row.pushStatus === 2 ? 'danger' : 'warning'"
          >
            {{
              scope.row.pushStatus === 0 ? '推送中' : scope.row.pushStatus === 1 ? '成功' : scope.row.pushStatus === 2 ? '失败' : '未同步'
            }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="300px">
        <template slot-scope="scope">
          <div v-if="scope.row.isShow == '3'">
            <!-- 审核中状态只显示审核记录按钮 -->
            <el-button
              size="mini"
              type="text"
              icon="el-icon-edit"
              @click="showOperLog(scope.row)"
            >审核记录
            </el-button>
          </div>
          <div v-else>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
          >修改
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="showOperLog(scope.row)"
          >审核记录
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
          >删除
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-document-copy"
            @click="productCopy(scope.row)"
          >一键复制
          </el-button>
<!--            <el-button-->
<!--              size="mini"-->
<!--              type="text"-->
<!--              icon="el-icon-document-copy"-->
<!--              @click="openVerify(scope.row)"-->
<!--            >溯源码管理-->
<!--            </el-button>-->
          </div>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <el-dialog :title="title" :visible.sync="open1" width="580px" append-to-body>
      <el-form ref="form1" :model="form1" :rules="rules" label-width="80px">
        <el-form-item label="商品状态" prop="status">
          <el-radio-group v-model="form1.isShow">
            <el-radio :label="item.dictValue" v-for="item in isShowOptions">{{ item.dictLabel }}</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="商城展示" prop="isDisplay">
          <el-radio-group v-model="form1.isDisplay">
            <el-radio :label="item.dictValue" v-for="item in isDisplayOptions">{{ item.dictLabel }}</el-radio>
          </el-radio-group>
        </el-form-item>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm1">确 定</el-button>
        <el-button @click="cancel1">取 消</el-button>
      </div>
    </el-dialog>


    <!-- 添加或修改商品对话框 -->
    <el-dialog :title="title" v-if="open" :fullscreen="isFullscreen" :visible.sync="open" width="1000px" append-to-body
               :show-close="false">
      <template v-slot:title>
        <div style="display: flex; justify-content: space-between; align-items: center;">
          <span>{{ title }}</span>
          <div>
            <!-- 全屏按钮 -->
            <el-button type="text" @click="handleFullScreen" size="middle">
              <i class="el-icon-full-screen"></i>
            </el-button>
            <!--关闭按钮-->
            <el-button type="text" @click="open = false">
              <i class="el-icon-close"></i>
            </el-button>
          </div>
        </div>
      </template>
      <el-form ref="form" :model="form" :rules="rules" label-width="100px" :class="{ 'is-edit-readonly': isEditLocked }">
        <el-row>
          <el-col :span="12">
            <el-form-item label="商品分类" prop="cateId" :class="{ 'is-disabled-cate': deviceCategoryLocked }">
              <treeselect v-model="form.cateId" :options="categoryOptions" :normalizer="normalizer"
                          placeholder="请选择上级分类" :disabled="deviceCategoryLocked"/>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="商品类型" prop="productType">
              <el-select style="width: 240px" v-model="form.productType" placeholder="请选择商品类型" clearable
                       size="small" :disabled="isEditLocked">
              <el-option v-for="item in productTypeOptions" :key="item.dictValue"
                         :label="item.dictLabel" :value="item.dictValue"/>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="商品名称" prop="productName">
              <el-input v-model="form.productName" placeholder="请输入商品名称"/>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="通用名称" prop="commonName" v-if="!isMedicalDeviceCategory">
              <el-input v-model="form.commonName" placeholder="请输入通用名称" :disabled="isEditLocked"/>
            </el-form-item>
          </el-col>

        </el-row>

        <el-row>
          <!-- 存储条件 -->
          <el-col :span="12">
            <el-form-item label="存储条件" prop="storageConditions" v-if="!isMedicalDeviceCategory">
              <el-input v-model="form.storageConditions" placeholder="请输入存储条件" style="width: calc(100% - 120px);" :disabled="isEditLocked"/>
            </el-form-item>
            </el-col>
          <!-- 器械编码和显示器免按钮 -->
          <el-col :span="12">
            <el-form-item label="器械编码" prop="medicalDeviceCode" v-if="showMedicalDeviceCode">
              <el-input v-model="form.medicalDeviceCode" @blur="handleMedicalDeviceCodeBlur" placeholder="请输入器械编码" style="width: calc(100% - 120px);" :disabled="isEditLocked"/>
              <el-button type="primary" @click="showExemptDeviceDialog" style="margin-left: 10px;" v-if="showExemptDeviceButton" :disabled="isEditLocked">显示器免</el-button>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="关键字" prop="keyword">
              <el-input v-model="form.keyword" placeholder="请输入关键字" :disabled="isEditLocked"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="单位名" prop="unitName">
              <el-input v-model="form.unitName" placeholder="请输入单位名" :disabled="isEditLocked"/>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="10">
          <el-col :span="12">
            <!-- 当分类包含"器械"时隐藏是否药品选项 -->
            <el-form-item label="是否药品" prop="isDrug" v-if="!isMedicalDeviceCategory">
              <el-radio-group v-model="form.isDrug" :disabled="isEditLocked">
                <el-radio
                  v-for="item in isDrugOptions"
                  :key="item.dictValue"
                  :label="item.dictValue"
                >{{ item.dictLabel }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <div v-if="form.isDrug === '1' ">
          <el-form-item label="头图展示" prop="drugImage" :class="{ 'is-upload-disabled': isEditLocked }">
            <Material v-model="drugImageArr" type="image" :num="1" :width="150" :height="150"/>
          </el-form-item>
          <div v-if="medicalMallConfig.isMedicalMall">
            <el-row>
              <el-col :span="12">
                <el-form-item :label="isMedicalDeviceCategory ? '注册证号/备案凭证编号' : '批准文号'" prop="drugRegCertNo">
                  <el-input v-model="form.drugRegCertNo" placeholder="请输入药品注册证书编号" :disabled="isEditLocked"/>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="12">
                <el-form-item label="剂型" prop="dosageForm" v-if="!isMedicalDeviceCategory">
                  <el-input v-model="form.dosageForm" placeholder="请输入剂型" :disabled="isEditLocked"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="单价" prop="unitPrice">
                  <el-input v-model="form.unitPrice" placeholder="请输入单价" type="number"/>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>

<!--              <el-col :span="12" v-if="!isMedicalDeviceCategory">-->
<!--                <el-form-item  :label="isMedicalDeviceCategory ? '生产批号/序列号' : '批号'" prop="batchNumber">-->
<!--                  <el-input v-model="form.batchNumber" placeholder="请输入批号"/>-->
<!--                </el-form-item>-->
<!--              </el-col>-->
              <el-col :span="12">
                <el-form-item :label="isMedicalDeviceCategory ? '规格/型号' : '包装规格'" prop="prescribeSpec">
                  <el-input v-model="form.prescribeSpec" :placeholder="isMedicalDeviceCategory ? '请输入规格/型号':'请输入包装规格'" :disabled="isEditLocked"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="规格" v-if="!isMedicalDeviceCategory" prop="specification">
                  <el-input v-model="form.specification" placeholder="请输入规格" :disabled="isEditLocked"/>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="12">
                <el-form-item :label="isMedicalDeviceCategory ? '注册人/备案人' : '上市许可持有人'" prop="mah">
                  <el-input v-model="form.mah" :placeholder= "isMedicalDeviceCategory ? '请输入注册人/备案人' : '请输入上市许可持有人'" :disabled="isEditLocked"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item :label="isMedicalDeviceCategory ? '注册人/备案人地址' : '持有人地址'" prop="mahAddress">
                  <el-input v-model="form.mahAddress" :placeholder= "isMedicalDeviceCategory ? '请输入注册人/备案人地址' : '请输入持有人地址'" :disabled="isEditLocked"/>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="12">
                <el-form-item label="生产企业" prop="manufacturer">
                  <el-input v-model="form.manufacturer" placeholder="请输入生产企业" :disabled="isEditLocked"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="企业地址" prop="manufacturerAddress">
                  <el-input v-model="form.manufacturerAddress" placeholder="请输入生产企业地址" :disabled="isEditLocked"/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-collapse v-model="activeValue" accordion>
              <el-collapse-item title="" name="1">

<!--                <el-form-item label="医疗器械注册证编号/备案凭证编号" prop="medicalRegCertNo" v-if="isMedicalDeviceCategory">-->
<!--                  <el-input v-model="form.medicalRegCertNo" type="textarea" placeholder="请输入医疗器械注册证编号/备案凭证编号"/>-->
<!--                </el-form-item>-->

<!--                <el-form-item label="注册人或者备案人信息" prop="registrantInfo" v-if="isMedicalDeviceCategory">-->
<!--                  <el-input v-model="form.registrantInfo" type="textarea" placeholder="请输入注册人或者备案人信息"/>-->
<!--                </el-form-item>-->

                <el-form-item label="生产许可证或者备案凭证编号" prop="prodLicenseNo" v-if="isMedicalDeviceCategory">
                  <el-input v-model="form.prodLicenseNo" type="textarea" placeholder="请输入生产许可证或者备案凭证编号" :disabled="isEditLocked"/>
                </el-form-item>

                <el-form-item label="产品技术要求编号" prop="prodTechReqNo" v-if="isMedicalDeviceCategory">
                  <el-input v-model="form.prodTechReqNo" type="textarea" placeholder="请输入产品技术要求编号" :disabled="isEditLocked"/>
                </el-form-item>

                <el-form-item label="结构及组成" prop="productStructure" v-if="isMedicalDeviceCategory">
                  <el-input v-model="form.productStructure" type="textarea" placeholder="请输入结构及组成" :disabled="isEditLocked"/>
                </el-form-item>

                <el-form-item label="功能主治/适用范围" prop="indications">
                  <el-input v-model="form.indications" type="textarea" placeholder="请输入功能主治/适用范围" :disabled="isEditLocked"/>
                </el-form-item>

                <el-form-item label="禁忌症" prop="contraindications">
                  <el-input v-model="form.contraindications" type="textarea" placeholder="请输入禁忌症" :disabled="isEditLocked"/>
                </el-form-item>

                <el-form-item label="成分" prop="ingredient" v-if="!isMedicalDeviceCategory">
                  <el-input v-model="form.ingredient" type="textarea" placeholder="请输入成分" :disabled="isEditLocked"/>
                </el-form-item>

                <el-form-item label="用法用量" prop="dosage" v-if="!isMedicalDeviceCategory">
                  <el-input v-model="form.dosage" type="textarea" placeholder="请输入用法用量" :disabled="isEditLocked"/>
                </el-form-item>

                <el-form-item label="不良反应" prop="adverseReactions" v-if="!isMedicalDeviceCategory" >
                  <el-input v-model="form.adverseReactions" type="textarea" placeholder="请输入不良反应" :disabled="isEditLocked"/>
                </el-form-item>

                <el-form-item label="注意事项" prop="precautions" v-if="!isMedicalDeviceCategory">
                  <el-input v-model="form.precautions" type="textarea" placeholder="请输入注意事项" :disabled="isEditLocked"/>
                </el-form-item>
              </el-collapse-item>
            </el-collapse>
          </div>
        </div>
        <el-form-item label="说明书" prop="instructionManual">
          <editor ref="instructionManualRef" @on-text-change="updateInstructionManualText" :disabled="isEditLocked"/>
        </el-form-item>
        <el-row>
          <el-col :span="24">
            <el-form-item label="商品简介" prop="productInfo">
              <el-input v-model="form.productInfo" type="textarea" :rows="2" placeholder="请输入商品简介" :disabled="isEditLocked"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="商品图片" prop="image" :class="{ 'is-upload-disabled': isEditLocked }">
          <Material v-model="imageArr" type="image" :num="1" :width="150" :height="150"/>
        </el-form-item>

        <el-form-item label="轮播图" prop="sliderImage" :class="{ 'is-upload-disabled': isEditLocked }">
          <Material v-model="photoArr" type="image" :num="10" :width="150" :height="150"/>
        </el-form-item>
        <el-row>
          <el-col :span="24">
            <el-form-item label="商品包装规格：" props="specType">
              <el-radio-group v-model="form.specType" :disabled="isEditLocked">
                <el-radio :label="0" class="radio">单包装规格</el-radio>
                <el-radio :label="1">多包装规格</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <!-- 多规格添加-->
          <el-col :span="24" v-if="form.specType === 1" class="noForm">
            <el-col :span="24">
              <el-form-item label="选择包装规格：" prop="">
                <div class="acea-row row-middle">
                  <el-select v-model="form.selectRule" style="width: 23%;" :disabled="isEditLocked">
                    <el-option v-for="(item, index) in ruleList" :value="item.ruleName" :key="index">{{
                        item.ruleName
                      }}
                    </el-option>
                  </el-select>
                  <el-button style="margin-left:10px;" type="primary" class="mr20" @click="confirm" :disabled="isEditLocked">确认</el-button>
                </div>
              </el-form-item>
            </el-col>

            <el-col :span="24">
              <el-form-item v-if="attrs!=null&&attrs.length!==0">
                <div v-for="(item, index) in attrs" :key="index">
                  <div class="acea-row row-middle"><span class="mr5">{{ item.value }}</span>
                    <i v-if="!isEditLocked" class="el-icon-circle-close" @click="handleRemoveRole(index)"></i>
                  </div>
                  <div class="rulesBox">
                    <el-tag type="dot" color="primary" v-for="(j, indexn) in item.detail" :key="indexn"
                            :name="j" class="mr20" :closable="!isEditLocked" @close="handleRemove2(item.detail,indexn)">{{ j }}
                    </el-tag>
                    <el-input placeholder="请输入属性名称" v-model="item.detail.attrsVal"
                              style="width: 200px" :disabled="isEditLocked">
                      <el-button slot="append" type="primary" @click="createAttr(item.detail.attrsVal,index)" :disabled="isEditLocked">添加
                      </el-button>
                    </el-input>
                  </div>
                </div>
              </el-form-item>
            </el-col>

            <el-col :span="24" v-if="createBnt">
              <el-form-item>
                <el-button type="primary" size="small" icon="md-add" @click="addBtn" class="mr15" :disabled="isEditLocked">添加新包装规格</el-button>
                <el-button type="success" size="small" @click="generate" :disabled="isEditLocked">立即生成</el-button>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="showIput">
              <el-col :xl="6" :lg="9" :md="10" :sm="24" :xs="24">
                <el-form-item label="包装规格/型号：">
                  <el-input placeholder="请输入包装规格/型号" v-model="formDynamic.attrsName" :disabled="isEditLocked"/>
                </el-form-item>
              </el-col>
              <el-col :xl="6" :lg="9" :md="10" :sm="24" :xs="24">
                <el-form-item label="包装规格值：">
                  <el-input v-model="formDynamic.attrsVal" placeholder="请输入包装规格值" :disabled="isEditLocked"/>
                </el-form-item>
              </el-col>
              <el-col :xl="6" :lg="5" :md="10" :sm="24" :xs="24">
                <el-button type="primary" @click="createAttrName" :disabled="isEditLocked">确定</el-button>
                <el-button type="danger" @click="closeAttrName" :disabled="isEditLocked">取消</el-button>
              </el-col>
            </el-col>
            <!-- 多规格设置-->
            <el-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24" v-if="manyFormValidate!=null&&manyFormValidate.length">
              <!-- 多规格表格-->
              <el-col :span="24">
                <el-form-item label="商品属性：" class="labeltop">

                  <el-table :data="manyFormValidate" size="small" style="width: 90%;" border>
                    <el-table-column type="myindex" v-for="(item,index) in form.header" :key="index"
                                     :width="item.minWidth" :label="item.title" :property="item.slot" align="center">
                      <template slot-scope="scope">
                        <div v-if="scope.column.property == 'image'" align="center" :class="{ 'is-upload-disabled': isEditLocked }">
                          <single-img v-model="scope.row[scope.column.property]" type="image" :num="1" :width="60"
                                      :height="60"/>
                        </div>
                        <div v-else-if="scope.column.property.indexOf('value') != -1" align="center">
                          {{ scope.row[scope.column.property] }}
                        </div>
                        <div v-else-if="scope.column.property == 'action'" align="center">
                          <a v-if="!isEditLocked" @click="delAttrTable(scope.$index)" align="center">删除</a>
                          <span v-else>-</span>
                        </div>
                        <div v-else align="center">
                          <el-input v-model="scope.row[scope.column.property]" align="center"
                                    :disabled="isSpecCellLocked(scope.column.property)"/>
                        </div>
                      </template>
                    </el-table-column>
                  </el-table>

                </el-form-item>
              </el-col>
            </el-col>
          </el-col>

          <!-- 单规格表格-->
          <el-col :xl="23" :lg="24" :md="24" :sm="24" :xs="24" v-if="form.specType === 0" style="">
            <el-form-item>
              <el-table :data="oneFormValidate" size="small" border>
                <el-table-column prop="image" label="图片" align="center">
                  <template slot-scope="scope">
                    <div :class="{ 'is-upload-disabled': isEditLocked }">
                      <single-img v-model="scope.row.image" type="image" :num="1" :width="60" :height="60"/>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="price" label="售价" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.price"/>
                  </template>
                </el-table-column>
                <el-table-column prop="agentPrice" label="代理价" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.agentPrice" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
                <el-table-column prop="cost" label="成本价" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.cost" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
                <el-table-column prop="otPrice" label="原价" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.otPrice" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
                <el-table-column prop="stock" label="库存" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.stock" maxlength="7"/>
                  </template>
                </el-table-column>
                <el-table-column prop="barCode" label="商品条码" width="130px" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.barCode" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
                <el-table-column prop="barCode" label="组合编号" width="130px" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.groupBarCode" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
                <el-table-column prop="weight" label="重量（KG）" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.weight" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
                <el-table-column prop="volume" label="体积(m³)" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.volume" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
                <el-table-column prop="volume" label="所需积分" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.integral" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
                <el-table-column prop="volume" label="一级返佣" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.brokerage" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
                <el-table-column prop="volume" label="二级返佣" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.brokerageTwo" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
                <el-table-column prop="volume" label="三级返佣" align="center">
                  <template slot-scope="scope">
                    <el-input type="text" v-model="scope.row.brokerageThree" :disabled="isEditLocked"/>
                  </template>
                </el-table-column>
              </el-table>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="运费模板：" prop="tempId">
              <div class="acea-row">
                <el-select v-model="form.tempId" class="mr20" :disabled="isEditLocked">
                  <el-option v-for="(item,index) in templateList" :value="item.id" :key="index" :label="item.name">
                  </el-option>
                </el-select>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="商品详情" prop="description">
          <editor ref="myeditor" @on-text-change="updateText" :disabled="isEditLocked"/>
        </el-form-item>
        <el-row>
          <el-col :span="8">
            <el-form-item label="商品状态" prop="isShow">
              <el-radio-group v-model="form.isShow">
                <el-radio
                  :label="item.dictValue"
                  v-for="item in isShowOptions"
                  :key="item.dictValue"
                  v-if="item.dictValue === '0' || item.dictValue === '1'">
                  {{ item.dictLabel }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否热卖" prop="isHot">
              <el-radio-group v-model="form.isHot">
                <el-radio :label="item.dictValue" v-for="item in isHotOptions">{{ item.dictLabel }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="猜你喜欢" prop="isGood">
              <el-radio-group v-model="form.isGood">
                <el-radio :label="item.dictValue" v-for="item in isGoodOptions">{{ item.dictLabel }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="精品推荐" prop="isBest">
              <el-radio-group v-model="form.isBest">
                <el-radio :label="item.dictValue" v-for="item in isBestOptions">{{ item.dictLabel }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="新品首发" prop="isNew">
              <el-radio-group v-model="form.isNew">
                <el-radio :label="item.dictValue" v-for="item in isNewOptions">{{ item.dictLabel }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="返还积分">
              <el-input-number v-model="form.giveIntegral" :min="0" placeholder="请输入积分"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="商城展示" prop="isDisplay">
              <el-radio-group v-model="form.isDisplay">
                <el-radio :label="item.dictValue" v-for="item in isDisplayOptions">{{ item.dictLabel }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="8">

            <el-form-item label="排序" prop="sort">
              <el-input-number :min="0" v-model="form.sort" placeholder="请输入排序"/>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="销量" prop="sales">
              <el-input-number :min="0" v-model="form.sales" placeholder="请输入销量"/>
            </el-form-item>
          </el-col>

        </el-row>
        <el-form-item label="推广分类" prop="tuiCateId">
          <el-select style="width: 240px" v-model="form.tuiCateId" placeholder="请选择推广分类" clearable size="small" :disabled="isEditLocked">
            <el-option
              v-for="item in productTuiCateOptions"
              :key="item.dictValue"
              :label="item.dictLabel"
              :value="item.dictValue"
            />
          </el-select>
        </el-form-item>

        <el-form-item v-if="form.isShow==='1'" label="审核说明" prop="reviewAudit">
          <el-select style="width: 240px" v-model="form.reviewAudit" placeholder="请选择审核说明" clearable
                     @change="handleReviewAudit"  size="small">
            <el-option
              v-for="item in reviewAuditOptions"
              :key="item.dictValue"
              :label="item.dictLabel"
              :value="item.dictValue"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="非首营链接" prop="businessLink" v-if="form.reviewAudit === '1'">
          <el-input :min="0" v-model="form.businessLink" placeholder="请输入非首营链接"/>
        </el-form-item>
        <el-form-item v-if="form.isShow === '1'" label="生产企业营业执照" prop="business" :class="{ 'is-upload-disabled': isEditLocked }">
          <Material v-model="businessArr" type="image" :num="1" :width="150" :height="150"/>
        </el-form-item>

        <el-form-item v-if="form.isShow === '1' && businessArr.length > 0" label="生产企业营业执照是否长期有效" prop="isBusinessPermanent">
          <el-switch
            @change="switchChange()"
            v-model="businessValue"
            active-color="#13ce66"
            inactive-color="#ff4949"
            :disabled="isEditLocked">
          </el-switch>
        </el-form-item>

        <el-form-item label="生产企业营业执照有效期" v-if="form.isShow === '1' && businessArr.length > 0 && !businessValue" prop="businessExpire">
          <el-date-picker
            v-model="form.businessExpire"
            type="daterange"
            value-format="yyyy-MM-dd"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :disabled="isEditLocked">
          </el-date-picker>
        </el-form-item>

        <el-form-item v-if="form.isShow === '1'" label="生产企业的生产许可证/备案凭证" prop="license" :class="{ 'is-upload-disabled': isEditLocked }">
          <Material v-model="licenseArr" type="image" :num="1" :width="150" :height="150"/>
        </el-form-item>

        <el-form-item v-if="form.isShow === '1' && licenseArr.length > 0" label="生产企业的生产许可证/备案凭证是否长期有效" prop="isLicensePermanent">
          <el-switch
            @change="switchChange()"
            v-model="licenseValue"
            active-color="#13ce66"
            inactive-color="#ff4949"
            :disabled="isEditLocked">
          </el-switch>
        </el-form-item>

        <el-form-item label="生产企业的生产许可证/备案凭证有效期" v-if="form.isShow === '1' && licenseArr.length > 0 && !licenseValue" prop="licenseExpire">
          <el-date-picker
            v-model="form.licenseExpire"
            type="daterange"
            value-format="yyyy-MM-dd"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :disabled="isEditLocked">
          </el-date-picker>
        </el-form-item>

        <el-form-item v-if="form.isShow === '1'" label="商品注册证/备案凭证" prop="certificate" :class="{ 'is-upload-disabled': isEditLocked }">
          <Material v-model="certificateArr" type="image" :num="1" :width="150" :height="150"/>
        </el-form-item>

        <el-form-item v-if="form.isShow === '1' && certificateArr.length > 0" label="商品注册证/备案凭证是否长期有效" prop="isCertificatePermanent">
          <el-switch
            @change="switchChange()"
            v-model="certificateValue"
            active-color="#13ce66"
            inactive-color="#ff4949"
            :disabled="isEditLocked">
          </el-switch>
        </el-form-item>

        <el-form-item label="商品注册证/备案凭证有效期" v-if="form.isShow === '1' && certificateArr.length > 0 && !certificateValue" prop="certificateExpire">
          <el-date-picker
            v-model="form.certificateExpire"
            type="daterange"
            value-format="yyyy-MM-dd"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :disabled="isEditLocked">
          </el-date-picker>
        </el-form-item>

<!--        <el-form-item label="国药准字" v-if="form.productType==2" prop="prescribeCode">-->
<!--          <el-input v-model="form.prescribeCode" placeholder="请输入国药准字"/>-->
<!--        </el-form-item>-->
<!--        <el-form-item label="包装规格/型号" v-if="form.productType==2" prop="prescribeSpec">-->
<!--          <el-input v-model="form.prescribeSpec" placeholder="请输入包装规格/型号"/>-->
<!--        </el-form-item>-->
<!--        <el-form-item label="生产厂家" v-if="form.productType==2" prop="prescribeFactory">-->
<!--          <el-input v-model="form.prescribeFactory" placeholder="请输入生产厂家"/>-->
<!--        </el-form-item>-->
<!--        <el-form-item label="处方名" v-if="form.productType==2" prop="prescribeName">-->
<!--          <el-input v-model="form.prescribeName" placeholder="请输入处方名"/>-->
<!--        </el-form-item>-->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
      <el-upload
        ref="upload"
        :limit="1"
        accept=".xlsx, .xls"
        :headers="upload.headers"
        :action="upload.url + '?updateSupport=' + upload.updateSupport"
        :disabled="upload.isUploading"
        :on-progress="handleFileUploadProgress"
        :on-success="handleFileSuccess"
        :auto-upload="false"
        drag
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip text-center" slot="tip">
          <div class="el-upload__tip" slot="tip">
            <!--     <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的数据 -->
          </div>
          <span>仅允许导入xls、xlsx格式文件。</span>
          <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;"
                   @click="importTemplate">下载模板
          </el-link>
        </div>
      </el-upload>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFileForm">确 定</el-button>
        <el-button @click="upload.open = false">取 消</el-button>
      </div>
    </el-dialog>

    <el-dialog
      title="首营资质消息提示"
      :visible.sync="dialogVisible"
      width="40%"
      center>
      <div v-for="(item,index) in promptList">({{ index + 1 }})、{{ item }}</div>
      <span slot="footer" class="dialog-footer">
       <el-button type="primary" @click="dialogVisible = false">已 知 晓</el-button>
      </span>
    </el-dialog>
    <el-dialog
      :title=titleValue
      :visible.sync="authVisible"
      width="50%"
      :before-close="handleClose"
      center>
      <el-table :data="auditLogs" border>
        <el-table-column label="描述" align="center" prop="des" :show-overflow-tooltip="true" />
        <el-table-column label="操作人员" align="center" prop="operName" width="100" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" />
        <el-table-column label="操作日期" align="center" prop="operTime" sortable="custom" :sort-orders="['descending', 'ascending']" width="180">
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.operTime) }}</span>
          </template>
        </el-table-column>
        <el-table-column label="审核理由" align="center" prop="reason" ></el-table-column>
        <el-table-column label="图片" align="center" prop="attachImage" width="100" >
          <template slot-scope="scope">
            <el-image
              style="width: 100px"
              :src="scope.row.attachImage"
              :preview-src-list="[scope.row.attachImage]"
              v-if="scope.row.attachImage">
            </el-image>
            <span v-else >无图片</span >
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
    <el-button type="primary" @click="authVisible = false">关 闭</el-button>
  </span>
    </el-dialog>

<!-- 免于经营备案的第二类医疗器械产品弹窗 -->
<el-dialog title="免于经营备案的第二类医疗器械产品" :visible.sync="exemptDeviceDialogVisible" width="80%" append-to-body :modal-append-to-body="false" z-index="9999" top="5vh" custom-class="exempt-device-dialog">
  <el-form :model="exemptDeviceQueryParams" ref="exemptDeviceQueryForm" :inline="true" label-width="80px">
    <el-form-item label="商品名称">
      <el-input v-model="exemptDeviceQueryParams.productName" placeholder="请输入商品名称" clearable size="small" @keyup.enter.native="handleExemptDeviceQuery" />
    </el-form-item>
    <el-form-item>
      <el-button type="primary" icon="el-icon-search" size="mini" @click="handleExemptDeviceQuery">搜索</el-button>
      <el-button icon="el-icon-refresh" size="mini" @click="resetExemptDeviceQuery">重置</el-button>
    </el-form-item>
  </el-form>

  <el-table v-loading="exemptDeviceLoading" :data="exemptDeviceList" border>
    <el-table-column label="产品序号" align="center" prop="serialNumber" />
    <el-table-column label="商品名称" align="center" prop="productName" />
    <el-table-column label="目录名称" align="center" prop="directoryName" />
    <el-table-column label="产品描述" align="center" prop="productDescription" />
    <el-table-column label="产品用途" align="center" prop="usageStr" />
    <el-table-column label="创建时间" align="center" prop="createTime" width="180" />
    <el-table-column label="更新时间" align="center" prop="updateTime" width="180" />
  </el-table>

  <div slot="footer" class="dialog-footer">
    <el-button @click="exemptDeviceDialogVisible = false">关 闭</el-button>
  </div>
</el-dialog>
    <!-- 溯源码管理弹窗 -->
    <el-dialog
      :title="titleVisible"
      :visible.sync="verifyDialogVisible"
      width="90%"
      append-to-body
      :before-close="handleVerifyDialogClose"
    >
      <VerifyCode
        v-if="verifyDialogVisible"
        :product-id="currentProductId"
        ref="verifyCodeRef"
      />
    </el-dialog>
  </div>
</template>

<script>
import {
  genFormatAttr,
  listStoreProduct,
  getStoreProduct,
  delStoreProduct,
  addOrEdit,
  exportStoreProduct,
  importTemplate,
  batchModify,
  sync580,
  updateIsShow,
  getProductrAuthInfo,
  copyProduct
} from "@/api/store/storeProduct";
import {getAllStoreProductCategory} from "@/api/store/storeProductCategory";
import {getAllStoreProductRule} from "@/api/store/storeProductRule";
import {getAllShippingTemplates} from "@/api/store/shippingTemplates";
import {getToken} from "@/utils/auth";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import Editor from '@/components/Editor/wang';
import Material from '@/components/Material'
import singleImg from '@/components/Material/single'
import {getCompanyList} from "@/api/company/company";
import {listStore} from '@/api/store/store'
import {getConfigByKey} from '@/api/system/config'
import {qualifications, checkStoreDrugLicense, selectForbiddenKeywords,getExemptSecondMedicalDeviceList} from "@/api/store/storeProduct";
import VerifyCode from '@/views/store/storeVerify/index.vue';

export default {
  name: "HisStoreProduct",
  components: {
    Treeselect,
    Editor,
    Material,
    singleImg,
    VerifyCode
  },
  created() {
    this.$nextTick(() => {
      this.handleNoticeInfo();
    });
    this.getDicts("sys_order_status").then(response => {
      this.orderOptions = response.data;
    });
    this.getDicts("store_product_tui_cate").then((response) => {
      this.productTuiCateOptions = response.data;
    });
    getConfigByKey("medicalMall.func.switch").then(response => {
      if (response.data && response.data.configValue) {
        this.medicalMallConfig = JSON.parse(response.data.configValue);
      }
    });
    this.getDicts("store_product_enable").then((response) => {
      this.isNewOptions = response.data;
      this.isBestOptions = response.data;
      this.isHotOptions = response.data;
      this.isGoodOptions = response.data;
      this.isDisplayOptions = response.data;
    });
    this.getDicts("store_product_type").then((response) => {
      this.productTypeOptions = response.data;
      // if (!this.medicalMallConfig.isMedicalMall &&
      //   this.productTypeOptions.length === 4) {
      //   //删除后两项
      //   this.productTypeOptions.splice(2, 2);
      // }
    });
    this.getDicts("store_product_is_show").then((response) => {
      this.isShowOptions = response.data;
    });
    getAllShippingTemplates().then(response => {
      this.templateList = response.data;
    });
    getAllStoreProductRule().then(response => {
      this.ruleList = response.data;
    });
    getCompanyList().then(response => {
      this.companyOptions = response.data;
    });
    listStore().then(response => {
      this.storeOptions = response.rows;
    });
    this.getTreeselect();
    this.getList();
  },
  watch: {
    businessArr:function(val) {
      this.form.business = val.join(',');
    },
    licenseArr(val) {
      this.form.license = val.join(',');
    },
    certificateArr(val) {
      this.form.certificate = val.join(',');
    },
    voucherArr(val) {
      this.form.voucher = val.join(',');
      this.$nextTick(() => {
        if (this.$refs.form) {
          this.$refs.form.validateField('voucher');
        }
      });
    },
    gmpAuthArr(val) {
      this.form.gmpAuth = val.join(',');
    },    imageArr: function (val) {
      this.form.image = val.join(',')
      this.$nextTick(() => {
        if (this.$refs.form) {
          this.$refs.form.validateField('image');
        }
      });
    },
    photoArr: function (val) {
      this.form.sliderImage = val.join(',')
      this.$nextTick(() => {
        if (this.$refs.form) {
          this.$refs.form.validateField('sliderImage');
        }
      });
    },
    drugImageArr: function (val) {
      this.form.drugImage = val.join(',');
      this.$nextTick(() => {
        if (this.$refs.form) {
          this.$refs.form.validateField('drugImageArr');
        }
      });
    },
    qualificationArr: function (val) {
      this.form.qualificationCertificate = val.join(',');
      this.$nextTick(() => {
        if (this.$refs.form) {
          this.$refs.form.validateField('qualificationCertificate');
        }
      });
    },

    // 商品名称监听
    'form.productName': {
      handler(newVal) {
        if (newVal) {
          this.checkForbiddenKeywords('productName', newVal);
        }
      },
      immediate: false
    },
    // 成分监听
    'form.ingredient': {
      handler(newVal) {
        if (newVal) {
          this.checkForbiddenKeywords('ingredient', newVal);
        }
      },
      immediate: false
    },
    // 商品分类监听
    'form.productType': {
      handler(newVal) {
        // 检查是否为II类或III类器械分类
        const cateName = this.cateIdToNameMap[this.form.cateId];
        const isMedicalDevice = cateName !== undefined && (cateName.includes('III类器械') || cateName.includes('II类器械'));
        // 只有当是II类或III类器械且器械编码不为空时才调用检查接口
        if (isMedicalDevice && this.form.medicalDeviceCode) {
          this.checkMedicalDeviceLicense(this.form.cateId, this.form.medicalDeviceCode);
        }
      },
      immediate: false
    },
    //商品分类
    'form.cateId': {
      handler(newVal) {
        if (this.deviceCategoryLocked && this.originalDeviceCateId != null
          && newVal != null && String(newVal) !== String(this.originalDeviceCateId)) {
          this.$nextTick(() => {
            this.form.cateId = this.originalDeviceCateId;
          });
          this.$message.warning('器械类商品不允许修改分类');
          return;
        }
        const cateName = this.getCateNameById(newVal);
        // 分类变化时动态修改验证规则,当分类名称不为空，且包含器械时候
        if (cateName !== undefined && cateName.includes('器械')) {
          // this.rules.contraindications = [];
          // this.rules.indications = [];
          this.rules.ingredient = [];
          this.rules.dosage = [];
          this.rules.adverseReactions = [];
          this.rules.precautions = [];
          // 当分类包含"器械"时，默认设置为药品
          this.form.isDrug = "1";
          // 医疗器械情况下相关字段必填
          this.rules.drugRegCertNo = [{ required: true, message: "注册证号/备案凭证编号不能为空", trigger: "blur" }];
          // this.rules.batchNumber = [{ required: true, message: "生产批号/序列号不能为空", trigger: "blur" }];
          this.displayDemo=true;
        } else {
          // 非医疗器械情况下相关字段必填规则
          this.rules.storageConditions = [{ required: true, message: "存储条件不能为空", trigger: "blur" }];
          this.rules.indications = [{ required: true, message: "功能主治/适用范围不能为空", trigger: "blur" }];
          this.rules.ingredient = [{ required: true, message: "成分不能为空", trigger: "blur" }];
          this.rules.dosage = [{ required: true, message: "用法用量不能为空", trigger: "blur" }];
          this.rules.adverseReactions = [{ required: true, message: "不良反应不能为空", trigger: "blur" }];
          this.rules.contraindications = [{ required: true, message: "禁忌症不能为空", trigger: "blur" }];
          this.rules.precautions = [{ required: true, message: "注意事项不能为空", trigger: "blur" }];
          this.rules.drugRegCertNo = [{ required: true, message: "批准文号不能为空", trigger: "blur" }];
          // 非医疗器械情况下批号非必填
          this.rules.batchNumber = [];
          this.displayDemo=false;
        }
        // 调用医疗器械许可证检查接口（仅当是II类或III类器械时）
        if (newVal) {
          const isMedicalDevice = cateName !== undefined && (cateName.includes('III类器械') || cateName.includes('II类器械'));
          // 只有当是II类或III类器械时才检查，具体调用会在器械编码失去焦点时进行
          if (!isMedicalDevice) {
            this.checkStoreDrugLicense(newVal);
          }
        }
        // 清除验证状态
        this.$nextTick(() => {
          if (this.$refs.form) {
            this.$refs.form.clearValidate([
              'storageConditions',
              'indications',
              'ingredient',
              'dosage',
              'adverseReactions',
              'contraindications',
              'precautions',
              'drugRegCertNo'
            ]);
          }
        });
      },
      immediate: true
    }
  },
  computed: {
    // 是否显示器械编码输入框（II类或III类器械）
    showMedicalDeviceCode() {
      const cateName = this.cateIdToNameMap[this.form.cateId];
      return cateName !== undefined && (cateName.includes('III类器械') || cateName.includes('II类器械'));
    },
    // 是否显示"显示器免"按钮（仅II类器械）
    showExemptDeviceButton() {
      const cateName = this.cateIdToNameMap[this.form.cateId];
      // 确保只在II类器械时显示，不包括III类器械
      return cateName !== undefined && cateName.includes('II类器械') && !cateName.includes('III类器械');
    },
    // 判断当前分类是否为医疗器械分类（当前节点或上级名称带「器械」都算）
    isMedicalDeviceCategory() {
      if (!this.form || this.form.cateId == null || this.form.cateId === '') {
        return false;
      }
      return this.isDeviceCategoryById(this.form.cateId);
    },
    // 修改弹窗只读开关：白名单字段不加 disabled；分类仍走器械锁定
    isEditLocked() {
      const productId = this.form && this.form.productId;
      return productId !== null && productId !== undefined && Number(productId) > 0;
    }
  },
  data() {
    return {
      isIngredientValid: true, // 成分是否有效
      isProductNameValid: true, // 商品名称是否有效
      // 溯源码弹窗相关
      titleVisible:'溯源管理：',
      verifyDialogVisible: false, // 溯源码弹窗显示状态
      currentProductId: null,     // 当前选中的商品ID
      isLicenseValid: true, // 许可证是否有效
      authVisible:false,
      auditLogs:[],
      titleValue:null,
      gmpAuthValue:false,
      certificateValue:false,
      licenseValue:false,
      businessValue:false,
      displayDemo: false,
      cateIdToNameMap: {},
      // 修改时锁定：进来时就是器械类，不允许改分类和类型
      deviceCategoryLocked: false,
      originalDeviceCateId: null,
      businessArr: [],
      licenseArr: [],
      certificateArr: [],
      voucherArr: [],
      gmpAuthArr: [],
      activeValue: '1',
      orderOptions: [],
      medicalMallConfig: {},
      promptList: [],
      dialogVisible: false,
      companyId: null,
      storeId: null,
      isAudit: null,
      uploadUrl: process.env.VUE_APP_BASE_API + "/common/uploadOSS",
      //videoAccept:"video/*",
      upload: {
        // 是否显示弹出层
        open: false,
        // 弹出层标题
        title: "",
        // 是否禁用上传
        isUploading: false,
        // 是否更新已经存在的用户数据
        updateSupport: 0,
        // 设置上传的请求头部
        headers: {Authorization: "Bearer " + getToken()},
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/store/storeProduct/importData"
      },
      // 添加药品相关字段
      isDrugOptions: [
        {dictValue: "0", dictLabel: "否"},
        {dictValue: "1", dictLabel: "是"}
      ],

      // 头图展示
      drugImageArr: [],

      //首营资质上传图
      qualificationArr: [],
      productTuiCateOptions: [],
      reviewAuditOptions: [
        {dictValue: "0", dictLabel: "首营"},
        {dictValue: "1", dictLabel: "非首营"}
      ],
      showIput: false,
      createBnt: true,
      // 规格数据
      formDynamic: {
        attrsName: '',
        attrsVal: ''
      },
      open1: false,
      form1: {},
      isBtn: false,
      columns: [],
      attrs: [],
      templateList: [],
      ruleList: [],
      // 多规格表格data
      manyFormValidate: [],
      // 单规格表格data
      oneFormValidate: [
        {
          image: '',
          price: 0,
          cost: 0,
          agentPrice: 0,
          otPrice: 0,
          stock: 0,
          barCode: '',
          weight: 0,
          volume: 0,
          integral: 0
        }
      ],
      photoArr: [],
      imageArr: [],
      activeName: "1",
      productTypeOptions: [],
      isDisplayOptions: [],
      isGoodOptions: [],
      isNewOptions: [],
      isBestOptions: [],
      isHotOptions: [],
      isShowOptions: [],
      categoryOptions: [],
      // 企业列表
      companyOptions: [],
      storeOptions: [],
      // 免于经营备案的第二类医疗器械产品相关变量
      exemptDeviceDialogVisible: false,
      exemptDeviceList: [],
      allExemptDeviceList: [], // 保存所有数据用于本地搜索
      exemptDeviceLoading: false,
      exemptDeviceTotal: 0,
      exemptDeviceQueryParams: {
        productName: null
      },
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: false,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      isFullscreen: false,
      // 总条数
      total: 0,
      // 商品表格数据
      storeProductList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,

      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        productName: null,
        productType: null,
        isShow: "1",
        barCode: null,
        // companyIds: null,
        storeIds: null,
        drugRegCertNo: null,
        commonName: null,
        dosageForm: null,
        unitPrice: null,
        batchNumber: null,
        mah: null,
        mahAddress: null,
        manufacturer: null,
        manufacturerAddress: null,
        indications: null,
        dosage: null,
        adverseReactions: null,
        contraindications: null,
        precautions: null
      },
      // 表单参数
      form: {
        ingredient: null, // 成分字段
        cateId: null,
        businessExpire: null,
        indications: '',
        dosage: '',
        instructionManual: '',
        business:null,
        licenseExpire:null,
        license:null,
        certificate:null,
        certificateExpire:null,
        voucher:null,
        voucherExpire:null,
        gmpAuth:null,
        gmpAuthExpire:null,
        businessLink:null,
        isGmpAuthPermanent:null,
        isCertificatePermanent:null,
        isLicensePermanent:null,
        isBusinessPermanent:null,
        medicalDeviceCode: null, // 器械编码
      },
      // 表单校验
      rules: {
        prodLicenseNo:[
          {required: true, message: "生产许可证或者备案凭证编号不能为空！", trigger: "blur"}
        ],
        prodTechReqNo:[
          {required: true, message: "产品技术要求编号不能为空！", trigger: "blur"}
        ],
        productStructure:[
          {required: true, message: "结构及组成不能为空！", trigger: "blur"}
        ],
        medicalDeviceCode: [
          { required: true, message: "器械编码不能为空", trigger: "blur" }
        ],
        ingredient: [
          { required: true, message: "成分不能为空", trigger: "blur" }
        ],
        image: [
          {required: true, message: "商品图片不能为空", trigger: "blur"}
        ],
        sliderImage: [
          {required: true, message: "轮播图不能为空", trigger: "blur"}
        ],
        productName: [
          {required: true, message: "商品名称不能为空", trigger: "blur"}
        ],
        productInfo: [
          {required: true, message: "商品简介不能为空", trigger: "blur"}
        ],
        unitName: [
          {required: true, message: "单位名不能为空", trigger: "blur"}
        ],
        keyword: [
          {required: true, message: "关键字不能为空", trigger: "blur"}
        ],
        cateId: [
          {required: true, message: "分类id不能为空", trigger: "blur"}
        ],
        price: [
          {required: true, message: "商品价格不能为空", trigger: "blur"}
        ],
        prescribeCode: [
          {required: true, message: "国药准字不能为空", trigger: "blur"}
        ],
        prescribeSpec: [
          {required: true, message: "包装规格不能为空", trigger: "blur"}
        ],
        prescribeFactory: [
          {required: true, message: "生产厂家不能为空", trigger: "blur"}
        ],
        prescribeName: [
          {required: true, message: "处方药不能为空", trigger: "blur"}
        ],
        // companyIds: [
        //   { required: true, message: "销售公司不能为空", trigger: "blur" }
        // ],
        // 药品相关字段校验（仅在是药品时必填）
        drugImage: [
          {required: true, message: "药品展示图不能为空", trigger: "blur"}
        ],
        drugRegCertNo: [
          {required: true, message: "药品注册证书编号不能为空", trigger: "blur"}
        ],
        commonName: [
          {required: true, message: "通用名称不能为空", trigger: "blur"}
        ],
        dosageForm: [
          {required: true, message: "剂型不能为空", trigger: "blur"}
        ],
        unitPrice: [
          {required: true, message: "单价不能为空", trigger: "blur"}
        ],
        batchNumber: [
          {required: true, message: "批号不能为空", trigger: "blur"}
        ],
        mah: [
          {required: true, message: "上市许可持有人不能为空", trigger: "blur"}
        ],
        mahAddress: [
          {required: true, message: "上市许可持有人地址不能为空", trigger: "blur"}
        ],
        manufacturer: [
          {required: true, message: "生产企业不能为空", trigger: "blur"}
        ],
        manufacturerAddress: [
          {required: true, message: "生产企业地址不能为空", trigger: "blur"}
        ],
        // reviewAudit: [
        //   {required: true, message: "审核资质不能为空！", trigger: "blur"}
        // ],
        // businessLink: [
        //   { required: true, message: "非首营链接不能为空！", trigger: "change" }
        // ],
        // business: [
        //   { required: true, message: "营业执照不能为空！", trigger: "blur" }
        // ],
        // license: [
        //   { required: true, message: "企业生产许可证不能为空！", trigger: "blur" }
        // ],
        // certificate: [
        //   { required: true, message: "注册证书不能为空！", trigger: "blur" }
        // ],
        businessExpire: [
          { required: true, message: "营业执照有效期不能为空！", trigger: "change" }
        ],
        licenseExpire: [
          { required: true, message: "企业生产许可证有效期不能为空！", trigger: "change" }
        ],
        certificateExpire: [
          { required: true, message: "注册证书有效期不能为空！", trigger: "change" }
        ],
        voucher: [
          { required: true, message: "Ⅰ类Ⅱ类备案凭证不能为空！", trigger: "change" }
        ],
        voucherExpire: [
          { required: true, message: "Ⅰ类Ⅱ类备案凭证有效期不能为空！", trigger: "change" }
        ],
        gmpAuth: [
          { required: true, message: "GMP认证不能为空！", trigger: "blur" }
        ],
        gmpAuthExpire: [
          { required: true, message: "GMP认证有效期不能为空！", trigger: "change" }
        ],
        indications: [
          { required: true, message: "功能主治/适用范围不能为空！", trigger: "blur" }
        ],
        dosage: [
          { required: true, message: "用法用量不能为空", trigger: "blur" }
        ],
        adverseReactions: [
          { required: true, message: "不良反应不能为空", trigger: "blur" }
        ],
        contraindications: [
          { required: true, message: "禁忌不能为空", trigger: "blur" }
        ],
        precautions: [
          { required: true, message: "注意事项不能为空", trigger: "blur" }
        ],
        // storeId :[
        //   { required: true, message: "所属店铺不能为空", trigger: "blur"}
        // ],
        productType: [
          { required: true, message: "商品类型不能为空", trigger: "blur" }
        ],
      },
    };
  },
  methods: {
    // 检查违禁关键词（整合商品名称和成分检查）
    checkForbiddenKeywords(field, value) {
      // 根据检查的字段类型设置不同的参数和状态变量
      const isProductNameCheck = field === 'productName';
      const isIngredientCheck = field === 'ingredient';
      if (!isProductNameCheck && !isIngredientCheck) {
        return; // 只处理商品名称和成分字段
      }
      // 构造参数 - API只需要keywords参数
      selectForbiddenKeywords(field, value).then(response => {
        if (response.data === false) {
          const errorMsg = isProductNameCheck
            ? (response.msg || '商品名称包含违禁词')
            : (response.msg || '成分包含违禁词');
          this.$message.error(errorMsg);
          // 更新对应的状态变量
          if (isProductNameCheck) {
            this.isProductNameValid = false;
          } else {
            this.isIngredientValid = false;
          }
        } else {
          // 检查通过，更新状态变量
          if (isProductNameCheck) {
            this.isProductNameValid = true;
          } else {
            this.isIngredientValid = true;
          }
        }
      }).catch(error => {
        const errorMsg = isProductNameCheck
          ? '商品名称违禁词检查异常'
          : '成分违禁词检查异常';
        this.$message.error(errorMsg);
        // 出现异常时，标记为无效
        if (isProductNameCheck) {
          this.isProductNameValid = false;
        } else {
          this.isIngredientValid = false;
        }
      });
    },

    // 检查店铺药品许可证
    checkStoreDrugLicense(cateId) {
      checkStoreDrugLicense({ cateId: cateId }).then(response => {
        if (response.data.flag === false) {
          this.$message.error(response.data.message || '药品许可证检查失败');
          // 可以设置一个状态变量来控制是否允许提交
          this.isLicenseValid = false;
        } else {
          this.isLicenseValid = true;
        }
      }).catch(error => {
        this.$message.error('药品许可证检查异常');
        this.isLicenseValid = false;
      });
    },
    // 检查医疗器械许可证（仅当分类为II类或III类器械且器械编码不为空时）
    checkMedicalDeviceLicense(cateId, medicalDeviceCode) {
      // 检查是否为II类或III类器械
      const cateName = this.cateIdToNameMap[cateId];
      const isMedicalDevice = cateName !== undefined && (cateName.includes('III类器械') || cateName.includes('II类器械'));

      // 只有当是II类或III类器械且器械编码不为空时才调用接口
      if (isMedicalDevice && medicalDeviceCode) {
        checkStoreDrugLicense({ cateId: cateId, medicalDeviceCode: medicalDeviceCode, productType: this.form.productType }).then(response => {
          if (response.data.flag === false) {
            this.$message.error(response.data.message || '医疗器械许可证检查失败');
            this.isLicenseValid = false;
          } else {
            this.isLicenseValid = true;
          }
        }).catch(error => {
          this.$message.error('医疗器械许可证检查异常');
          this.isLicenseValid = false;
        });
      }
    },
    // 处理器械编码失去焦点事件
    handleMedicalDeviceCodeBlur() {
      // 检查是否为II类或III类器械
      const cateName = this.cateIdToNameMap[this.form.cateId];
      const isMedicalDevice = cateName !== undefined && (cateName.includes('III类器械') || cateName.includes('II类器械'));

      // 只有当是II类或III类器械时才处理
      if (isMedicalDevice) {
        // 如果器械编码不为空，则调用检查接口
        if (this.form.medicalDeviceCode) {
          this.checkMedicalDeviceLicense(this.form.cateId, this.form.medicalDeviceCode);
        }
      }
    },
    handleNoticeInfo() {
      qualifications()
        .then(response => {
          console.log("noticeInfo接口完整响应：", response);
          // code=0 表示暂无资质提示，属正常业务状态
          if (response.code === 200) {
            this.promptList = response.data;
            if (this.promptList && this.promptList.length > 0) {
              this.dialogVisible = true;
            }
            console.log("通知信息请求完成！", this.promptList);
          } else if (response.code === 0) {
            this.promptList = [];
          } else {
            console.warn("接口返回非成功状态：", response.code);
          }
        })
        .catch(err => {
          console.error("获取通知信息失败：", err);
          this.$message.error("加载通知信息失败，请稍后重试");
        });
    },
    cancel1() {
      this.open1 = false;
    },
    submitForm1() {
      let param = {}
      param.productId = this.ids;
      param.goodsStatus = this.form1.isShow;
      param.goodsIsShow = this.form1.isDisplay;
      // param.companyIds = this.companyId+''
      batchModify(param).then(res => {
        if (res.code === 200) {
          this.$message.success("批量修改成功");
          this.getList();
        }
      }).finally(() => {
        this.open1 = false;
        this.form1.isShow = null;
        this.form1.isDisplay = null;
        this.form1.companyId = null;
      })
    },
    handleFullScreen() {
      this.isFullscreen = !this.isFullscreen;
    },
    handleSuccess(response, file) {
      // 上传成功后的回调函数
      this.myloading.close();
      //this.form.video = response.url;
      this.$refs.upload.clearFiles();
    },
    beforeUpload(file) {
      // 上传前的钩子函数，可以在这里对文件进行处理
      // 返回 false 则取消上传

      // 例如限制文件大小
      const isLt2M = file.size / 1024 / 1024 < 200;
      if (!isLt2M) {
        this.$message.error('上传视频文件大小不能超过 200MB!');
        return false;
      }
      this.myloading = this.$loading({
        lock: true,
        text: '上传中',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });

    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit();
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.upload.open = false;
      this.upload.isUploading = false;
      this.$refs.upload.clearFiles();
      this.$alert(response.msg, "导入结果", {dangerouslyUseHTMLString: true});
      this.getList();
    },
    handleImport() {
      this.upload.title = "商品导入";
      this.upload.open = true;
    },
    importTemplate() {
      importTemplate().then(response => {
        this.download(response.msg);
      });
    },
    // 删除表格中的属性
    delAttrTable(index) {
      this.manyFormValidate.splice(index, 1);
    },
    addBtn() {
      this.clearAttr();
      this.createBnt = false;
      this.showIput = true;
    },
    //生成SKU
    generate() {
      genFormatAttr(this.form.productId, {attrs: this.attrs}).then(res => {
        if (this.form.specType === 0) {
          this.oneFormValidate = res.value;
          this.form.header = res.header;
          let header = res.header;
          header.pop();
          this.oneFormValidate.map((item) => {
            if (this.imageArr.length > 0) {
              item.image = this.imageArr[0]
            }
          });
        } else if (this.form.specType === 1) {
          this.manyFormValidate = res.value;
          let headerdel = {
            title: '操作',
            slot: 'action',
            fixed: 'right',
            width: 220
          };
          res.header.push(headerdel);
          this.form.header = res.header;
          let header = res.header;
          header.pop();
          // this.manyFormValidate.map((item) => {
          //   if(this.imageArr.length>0){
          //     item.image = this.imageArr[0]
          //   }
          // });
        }

      }).catch(res => {
      })
    },
    // 取消添加新规格
    closeAttrName() {
      this.showIput = false;
      this.createBnt = true;
    },
    clearAttr() {
      this.formDynamic.attrsName = '';
      this.formDynamic.attrsVal = '';
    },
    // 删除规格
    handleRemoveRole(index) {
      this.attrs.splice(index, 1);
      this.manyFormValidate.splice(index, 1);
    },
    // 删除属性
    handleRemove2(item, index) {
      item.splice(index, 1);
    },
    // 添加规则名称
    createAttrName() {
      if (this.formDynamic.attrsName && this.formDynamic.attrsVal) {
        let data = {
          value: this.formDynamic.attrsName,
          detail: [
            this.formDynamic.attrsVal
          ]
        };
        this.attrs.push(data);
        var hash = {};
        this.attrs = this.attrs.reduce(function (item, next) {
          hash[next.value] ? '' : hash[next.value] = true && item.push(next);
          return item
        }, [])
        this.clearAttr();
        this.showIput = false;
        this.createBnt = true;
      } else {
        this.$message.warning('请添加完整的包装规格！');
      }
    },
    // 添加属性
    createAttr(num, idx) {
      if (num) {
        this.attrs[idx].detail.push(num);
        var hash = {};
        this.attrs[idx].detail = this.attrs[idx].detail.reduce(function (item, next) {
          hash[next] ? '' : hash[next] = true && item.push(next);
          return item
        }, [])
      } else {
        this.$message.warning('请添加属性！');
      }
    },
    confirm() {
      let that = this;
      that.createBnt = true;
      if (that.form.selectRule == null || that.form.selectRule.trim().length <= 0) {
        return this.$message({
          message: '请选择属性',
          type: 'error'
        });
      }
      that.ruleList.forEach(function (item, index) {
        if (item.ruleName === that.form.selectRule) {
          that.attrs = JSON.parse(item.ruleValue);

        }
      });

    },
    updateText(text) {
      this.form.description = text
    },
    updateInstructionManualText(text) {
      this.form.instructionManual = text
    },
    handleClick(tab, event) {
      this.queryParams.isShow = tab.name;
      this.getList();
    },
    getCateNameById(cateId) {
      if (cateId === null || cateId === undefined || cateId === '') {
        return '';
      }
      const map = this.cateIdToNameMap || {};
      return map[cateId] || map[String(cateId)] || map[Number(cateId)] || '';
    },
    isCateNameDevice(cateName) {
      return !!(cateName && String(cateName).indexOf('器械') !== -1);
    },
    getCatePathNames(cateId) {
      const walk = (nodes, path) => {
        if (!nodes || !nodes.length) {
          return null;
        }
        for (let i = 0; i < nodes.length; i++) {
          const node = nodes[i];
          const next = path.concat([node.cateName || '']);
          if (String(node.cateId) === String(cateId)) {
            return next;
          }
          const found = walk(node.children, next);
          if (found) {
            return found;
          }
        }
        return null;
      };
      return walk(this.categoryOptions, []) || [];
    },
    isDeviceCategoryById(cateId) {
      if (this.isCateNameDevice(this.getCateNameById(cateId))) {
        return true;
      }
      const pathNames = this.getCatePathNames(cateId);
      for (let i = 0; i < pathNames.length; i++) {
        if (this.isCateNameDevice(pathNames[i])) {
          return true;
        }
      }
      return false;
    },
    syncDeviceCategoryLock(cateId, cateName) {
      this.deviceCategoryLocked = this.isDeviceCategoryById(cateId) || this.isCateNameDevice(cateName);
      this.originalDeviceCateId = this.deviceCategoryLocked ? cateId : null;
    },
    // 多规格表格：修改时只允许改售价、库存
    isSpecCellLocked(property) {
      if (!this.isEditLocked) {
        return false;
      }
      const editableSpecFields = ['price', 'stock'];
      return editableSpecFields.indexOf(property) === -1;
    },
    /** 转换商品分类数据结构 */
    normalizer(node) {
      if (node.children && !node.children.length) {
        delete node.children;
      }
      return {
        id: node.cateId,
        label: node.cateName,
        children: node.children
      };
    },
    getTreeselect() {
      getAllStoreProductCategory().then(response => {
        this.categoryOptions = [];
        const data = this.handleTree(response.data, "cateId", "pid");
        this.categoryOptions = data;
        this.buildCateMap(data);
      });
    },
    buildCateMap(nodes) {
      nodes.forEach(node => {
        this.cateIdToNameMap[node.cateId] = node.cateName;
        if (node.children && node.children.length) {
          this.buildCateMap(node.children); // 递归处理子节点
        }
      });
    },
    /** 查询商品列表 */
    getList() {
      this.loading = true;
      if (this.queryParams.storeIds !== null && this.queryParams.storeIds.length === 0) {
        this.queryParams.storeIds = null;
      }
      listStoreProduct(this.queryParams).then(response => {
        this.storeProductList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.deviceCategoryLocked = false;
      this.originalDeviceCateId = null;
      this.form = {
        ingredient: null, // 重置成分字段
        productId: null,
        image: null,
        video: null,
        sliderImage: null,
        productName: null,
        productInfo: null,
        keyword: null,
        barCode: null,
        cateId: null,
        price: null,
        vipPrice: null,
        otPrice: null,
        postage: null,
        unitName: null,
        sort: null,
        sales: null,
        stock: null,
        isShow: "0",
        isHot: "0",
        isBenefit: "0",
        isBest: "0",
        isNew: "0",
        description: null,
        createTime: null,
        updateTime: null,
        isPostage: null,
        isDel: null,
        giveIntegral: null,
        cost: null,
        isGood: "0",
        browse: null,
        codePath: null,
        tempId: "",
        specType: 0,
        isIntegral: null,
        integral: null,
        productType: "1",
        prescribeCode: null,
        prescribeSpec: null,
        prescribeFactory: null,
        prescribeName: null,
        isDisplay: "1",
        qualificationExpire: null,
        // companyIds:[],
        isDrug: "1", // 是否药品
        drugImage: null, // 头图展示
        drugRegCertNo: null, // 注册证号/备案凭证编号
        commonName: null, // 通用名称
        dosageForm: null, // 剂型
        unitPrice: null, // 单价
        batchNumber: null, // 生产批号/序列号
        mah: null, // 上市许可持有人
        mahAddress: null, // 上市许可持有人地址
        manufacturer: null, // 生产企业
        manufacturerAddress: null, // 生产企业地址
        indications: null, // 适用范围/适应症
        dosage: null, // 用法用量
        adverseReactions: null, // 不良反应
        contraindications: null, // 禁忌
        precautions: null // 注意事项
      };
      // 重置药品展示图
      this.drugImageArr = [];
      this.resetForm("form");
      this.oneFormValidate = [
        {
          image: '',
          price: 0,
          agentPrice: 0,
          cost: 0,
          otPrice: 0,
          stock: 0,
          barCode: '',
          weight: 0,
          volume: 0,
          integral: 0,
          brokerage: 0,
          brokerageTwo: 0
        }
      ]
      this.attrs = [];
      this.photoArr = [];
      this.imageArr = [];
      this.qualificationArr = [];
      this.businessArr = [];
      this.licenseArr = [];
      this.certificateArr = [];
      this.voucherArr = [];
      this.gmpAuthArr = [];
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      // this.queryParams.companyIds = this.companyId +''
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      // 查询参数
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        productName: null,
        productType: null,
        isShow: "1",
        barCode: null,
        // companyIds: null,
        storeIds: null,
        drugRegCertNo: null,
        commonName: null,
        dosageForm: null,
        unitPrice: null,
        batchNumber: null,
        mah: null,
        mahAddress: null,
        manufacturer: null,
        manufacturerAddress: null,
        indications: null,
        dosage: null,
        adverseReactions: null,
        contraindications: null,
        precautions: null
      }
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.productId)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();

      this.open = true;
      this.title = "添加商品";
      setTimeout(() => {
        this.$refs.myeditor.setText("");
        this.$refs.instructionManualRef.setText("");
      }, 500);

    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      if (this.ids.length > 1) {
        this.title = "批量修改商品";
        this.open1 = true;
        return;
      }
      var that = this;
      this.reset();
      const productId = row.productId || this.ids
      getStoreProduct(productId).then(response => {
        this.form = response.data;
        this.form.isShow = response.data.isShow.toString();
        this.form.isHot = response.data.isHot.toString();
        this.form.isGood = response.data.isGood.toString();
        this.form.isBest = response.data.isBest.toString();
        this.form.isNew = response.data.isNew.toString();
        this.form.productType = response.data.productType.toString();
        this.form.isDisplay = response.data.isDisplay.toString();
        if (this.form.business) {
          this.businessArr = this.form.business.split(',');
        }
        if (this.form.license) {
          this.licenseArr = this.form.license.split(',');
        }
        if (this.form.certificate) {
          this.certificateArr = this.form.certificate.split(',');
        }
        if (this.form.voucher) {
          this.voucherArr = this.form.voucher.split(',');
        }
        if (this.form.gmpAuth) {
          this.gmpAuthArr = this.form.gmpAuth.split(',');
        }
        if (this.form.tuiCateId != null) {
          this.form.tuiCateId = response.data.tuiCateId.toString();
        }
        if (this.form.reviewAudit != null) {
          this.form.reviewAudit = response.data.reviewAudit.toString();
        }
        // this.form.isDrug = response.data.isDrug ? response.data.isDrug.toString() : "1";
        this.form.isDrug = response.data.isDrug === 0 ? "0" : (response.data.isDrug ? response.data.isDrug.toString() : "1");
        this.syncDeviceCategoryLock(this.form.cateId, row && row.cateName);
        if (this.form.drugImage != null) {
          this.drugImageArr = this.form.drugImage.split(",");
        }
        if (this.form.qualificationCertificate != null) {
          this.qualificationArr = this.form.qualificationCertificate.split(",");
        }

        if(this.form.isBusinessPermanent == 1){
          this.businessValue = true
        }else {
          this.businessValue = false
        }

        if(this.form.isLicensePermanent == 1){
          this.licenseValue = true
        }else {
          this.licenseValue = false
        }

        if(this.form.isCertificatePermanent == 1){
          this.certificateValue = true
        }else {
          this.certificateValue = false
        }

        if(this.form.isGmpAuthPermanent == 1){
          this.gmpAuthValue = true
        }else {
          this.gmpAuthValue = false
        }

        const expireFieldMap = [
          { expireKey: 'businessExpire', startKey: 'businessStart', endKey: 'businessEnd' },
          { expireKey: 'licenseExpire', startKey: 'licenseStart', endKey: 'licenseEnd' },
          { expireKey: 'certificateExpire', startKey: 'certificateStart', endKey: 'certificateEnd' },
          { expireKey: 'voucherExpire', startKey: 'voucherStart', endKey: 'voucherEnd' },
          { expireKey: 'gmpAuthExpire', startKey: 'gmpAuthStart', endKey: 'gmpAuthEnd' },
          { expireKey: 'qualificationExpire', startKey: 'qualificationCertificateStart', endKey: 'qualificationCertificateEnd' }
        ];

        expireFieldMap.forEach(item => {
          const startVal = response.data[item.startKey];
          const endVal = response.data[item.endKey];
          if (startVal && endVal) {
            this.$set(this.form, item.expireKey, [startVal, endVal]);
          }
        });

        //组装attrs数据
        if (response.attrs != null) {
          this.attrs = [];
          response.attrs.forEach(function (item, index) {
            var data = {value: item.attrName, detail: item.attrValues.split(',')}
            that.attrs.push(data);
          });
        }
        const dateFields = [
          'qualificationExpire'
        ];
        dateFields.forEach(field => {
          const startField = field.replace('Expire', 'CertificateStart');  // qualificationCertificateStart
          const endField = field.replace('Expire', 'CertificateEnd');      // qualificationCertificateEnd
          if (this.form[startField] && this.form[endField]) {
            this.$set(this.form, field, [this.form[startField], this.form[endField]]);
          }
        });
        // // 组装companyIds
        // if (response.data.companyIds != null && response.data.companyIds != undefined && response.data.companyIds.length > 0) {
        //   this.form.companyIds = response.data.companyIds.split(',').map(Number);
        // }
        setTimeout(() => {
          that.generate();
          that.syncDeviceCategoryLock(that.form.cateId, row && row.cateName);
        }, 200);
        if (this.form.specType === 0) {
          that.manyFormValidate = [];
        } else {
          that.createBnt = true;
          that.oneFormValidate = [
            {
              image: '',
              price: 0,
              agentPrice: 0,
              cost: 0,
              otPrice: 0,
              stock: 0,
              barCode: '',
              weight: 0,
              volume: 0,
              integral: 0,
              brokerage: 0,
              brokerageTwo: 0
            }
          ]
        }
        setTimeout(() => {
          if (this.form.description == null) {
            this.$refs.myeditor.setText("");
          } else {
            this.$refs.myeditor.setText(this.form.description);
          }

          if (this.form.instructionManual == null) {
            this.$refs.instructionManualRef.setText("");
          } else {
            this.$refs.instructionManualRef.setText(this.form.instructionManual);
          }
        }, 200);
        if (this.form.image != null) {
          this.imageArr = this.form.image.split(",");
        }
        if (this.form.sliderImage != null) {
          this.photoArr = this.form.sliderImage.split(",");
        }
        this.open = true;
        this.title = "修改商品";
      });
    },

    // 验证证件有效期
    validateCertificates() {
      const currentDate = new Date();
      // 1. 检查生产企业营业执照
      if (!this.businessValue) { // 不是长期有效
        if (!this.form.businessExpire || this.form.businessExpire.length !== 2) {
          this.$message.warning('生产企业营业执照有效期不能为空！');
          return false;
        }
        const businessEndDate = new Date(this.form.businessExpire[1]);
        if (businessEndDate < currentDate) {
          this.$message.warning('生产企业营业执照已过期，无法提交');
          return false;
        }
      }
      // 2. 检查生产企业的生产许可证/备案凭证
      if (!this.licenseValue) { // 不是长期有效
        if (!this.form.licenseExpire || this.form.licenseExpire.length !== 2) {
          this.$message.warning('生产企业的生产许可证/备案凭证有效期不能为空！');
          return false;
        }
        const licenseEndDate = new Date(this.form.licenseExpire[1]);
        if (licenseEndDate < currentDate) {
          this.$message.warning('生产企业的生产许可证/备案凭证已过期，无法提交');
          return false;
        }
      }
      // 3. 检查商品注册证/备案凭证
      if (!this.certificateValue) { // 不是长期有效
        if (!this.form.certificateExpire || this.form.certificateExpire.length !== 2) {
          this.$message.warning('商品注册证/备案凭证有效期不能为空！');
          return false;
        }
        const certificateEndDate = new Date(this.form.certificateExpire[1]);
        if (certificateEndDate < currentDate) {
          this.$message.warning('商品注册证/备案凭证已过期，无法提交');
          return false;
        }
      }
      return true; // 所有验证通过
    },
    checkImages(){
      if(!this.form.business){
        this.$message.warning('生产企业营业执照不能为空');
        return false;
      }
      if(!this.form.license){
        this.$message.warning('生产企业的生产许可证/备案凭证不能为空');
        return false;
      }
      if(!this.form.certificate){
        this.$message.warning('商品注册证/备案凭证');
        return false;
      }
      return true;
    },
    /** 提交按钮 */
    submitForm() {
      //只有上架时候才会检查
      // if(this.form.isShow === '1'){
        //检查必要照片上传
        if(!this.checkImages()){
          return;
        }
        // 检查证件有效期相关逻辑
        if (!this.validateCertificates()) {
          return; // 如果验证失败，阻止提交
        }
      // }
      // 检查商品名称是否有效
      if (!this.isProductNameValid) {
        this.$message.warning('商品名称包含违禁词，请修改后重新提交');
        return;
      }
      // 检查成分是否有效
      if (!this.isIngredientValid) {
        this.$message.warning('成分包含违禁词，请修改后重新提交');
        return;
      }
      // 先检查许可证是否有效
      if (!this.isLicenseValid) {
        this.$message.warning('当前分类许可证检查未通过，无法提交');
        return;
      }

      //接着再提交
      this.$refs["form"].validate(valid => {
        if (valid) {
          let checkBoolean = false
          let itemErrMsg = ''
          if (this.form.specType === 0) {
            this.form.items = [];
            this.form.values = this.oneFormValidate;
          } else {
            this.form.items = this.attrs;
            this.form.values = this.manyFormValidate;
          }
          //验证是否填写商品编码
          this.form.values.forEach(item => {
            if (item.barCode == null || item.barCode === '') {
              itemErrMsg = "包装规格/型号，商品条码不能为空！";
              return checkBoolean = true;
            }
            if(item.price == null || item.price === '' || item.price === 0){
              itemErrMsg = "包装规格/型号，商品售价不能为空且不能为0！";
              return checkBoolean = true;
            }
            if(item.cost == null || item.cost === ''){
              itemErrMsg = "包装规格/型号，商品成本价不能为空！";
              return checkBoolean = true;
            }
            if(item.otPrice == null || item.otPrice === ''){
              itemErrMsg = "包装规格/型号，商品原价不能为空！";
              return checkBoolean = true;
            }
          })
          if (checkBoolean) {
            return this.$message.warning(itemErrMsg);
          }
          if(!this.form.productType){
            return this.$message.warning('商品类型不能为空！');
          }
          if (this.form.specType === 1 && this.manyFormValidate.length === 0) {
            return this.$message.warning('请点击生成包装规格！');
          }
          if (this.form.qualificationExpire && this.form.qualificationExpire.length === 2) {
            this.form.qualificationCertificateStart = this.form.qualificationExpire[0];
            this.form.qualificationCertificateEnd = this.form.qualificationExpire[1];
          }

          // 优化永久有效的设置逻辑
          this.form.isBusinessPermanent = this.businessValue ? 1 : 0;
          this.form.isLicensePermanent = this.licenseValue ? 1 : 0;
          this.form.isCertificatePermanent = this.certificateValue ? 1 : 0;
          this.form.isGmpAuthPermanent = this.gmpAuthValue ? 1 : 0;

          addOrEdit(this.form).then(response => {
            if (response.code === 200) {
              this.msgSuccess("操作成功！");
              this.open = false;
              this.getList();
            }
          });
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const productIds = row.productId || this.ids;
      this.$confirm('是否确认删除商品编号为"' + productIds + '"的数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        return delStoreProduct(productIds);
      }).then(() => {
        this.getList();
        this.msgSuccess("删除成功");
      }).catch(function () {
      });
    },
    /** 导出按钮操作 */
    handleExport() {
      const queryParams = this.queryParams;
      this.$confirm('是否确认导出所有商品数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        return exportStoreProduct(queryParams);
      }).then(response => {
        this.download(response.msg);
      }).catch(function () {
      });
    },
    /** 同步按钮操作 */
    handleSync(row) {
      const productIds = row.productId || this.ids;
      this.$confirm('是否确认同步商品编号为"' + productIds + '"的数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        return sync580(productIds);
      }).then(() => {
        this.getList();
        this.msgSuccess("同步成功");
      }).catch(function () {
      });
    },
    /** 批量下架按钮操作 */
    handleBatchOff(row) {
      const productIds = (row && row.productId) || this.ids;
      this.$confirm('是否确认批量下架商品编号为"' + productIds + '"的数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        return updateIsShow(productIds);
      }).then(() => {
        this.getList();
        this.msgSuccess("下架成功");
      }).catch(function () {
      });
    },
    handleReviewAudit(){
      // console.log("aaaaaaaaaaaaaaa->",this.form.reviewAudit);
    },
    switchChange(){
      // console.log(this.form.isBusinessLicensePermanent);
    },
    showOperLog(row){
      getProductrAuthInfo({productId : row.productId}).then(response => {
        this.auditLogs = response.auditLog;
        this.titleValue ="商品：" +"《" +row.productName+"》"+ "审核记录";
        this.authVisible = true;
      })
    },
    handleClose(done) {
      this.$confirm('确认关闭？')
        .then(_ => {
          done();
        })
        .catch(_ => {});
    },
    /**
     * 重置免于经营备案的第二类医疗器械产品搜索条件
     */
    resetExemptDeviceQuery() {
      this.exemptDeviceQueryParams = {
        productName: null
      };
      this.handleExemptDeviceQuery();
    },
    /**
     * 搜索免于经营备案的第二类医疗器械产品
     */
    handleExemptDeviceQuery() {
      this.exemptDeviceQueryParams.pageNum = 1;
      this.getExemptDeviceList();
    },
    /**
     * 获取免于经营备案的第二类医疗器械产品列表
     */
    getExemptDeviceList() {
      this.exemptDeviceLoading = true;
  // 调用实际的API接口来获取数据
      getExemptSecondMedicalDeviceList(this.exemptDeviceQueryParams).then(response => {
        this.allExemptDeviceList = response.rows || response.data || [];
        // 根据搜索条件过滤数据
        if (this.exemptDeviceQueryParams.productName) {
          const searchTerm = this.exemptDeviceQueryParams.productName.toLowerCase();
          this.exemptDeviceList = this.allExemptDeviceList.filter(item =>
            item.productName && item.productName.toLowerCase().includes(searchTerm)
          );
        } else {
          this.exemptDeviceList = this.allExemptDeviceList;
        }
        this.exemptDeviceTotal = this.exemptDeviceList.length;
        this.exemptDeviceLoading = false;
      }).catch(error => {
        console.error('获取免于经营备案的第二类医疗器械产品列表失败:', error);
        this.$message.error('获取免于经营备案的第二类医疗器械产品列表失败');
        this.exemptDeviceLoading = false;
        this.exemptDeviceList = [];
        this.allExemptDeviceList = [];
        this.exemptDeviceTotal = 0;
      });
    },
    /**
     * 显示免于经营备案的第二类医疗器械产品弹窗
     */
    showExemptDeviceDialog() {
      this.exemptDeviceDialogVisible = true;
      this.getExemptDeviceList();
    },
    /**
     * 复制商品
     * **/
    productCopy(row){
      this.$confirm('确认是否复制当前《'+row.productName+'》商品！', '复制商品', {
        confirmButtonText: '确 认',
        cancelButtonText: '取 消',
        type: 'warning'
      }).then(() => {
        copyProduct(row).then(response => {
          if(response.code === 200){
            this.$message.success("操作成功！")
            this.getList();
          }
        })
      }).catch(() => {

      });
    },
    //打开溯源码页面
    openVerify(row) {
      if (row) {
        this.currentProductId = row.productId;
      } else if (this.ids.length > 0) {
        this.currentProductId = this.ids[0];
        if (this.ids.length > 1) {
          this.$message.warning('溯源码管理仅支持单个商品操作，已默认选择第一个商品');
        }
      } else {
        this.$message.error('请先选择需要管理溯源码的商品');
        return;
      }
      this.titleVisible = this.titleVisible + '《' + row.productName + '》';
      this.verifyDialogVisible = true;
    },
    /**
     * 关闭溯源码弹窗
     */
    handleVerifyDialogClose() {
      if (this.$refs.verifyCodeRef) {
        this.$refs.verifyCodeRef.fullReset();
      }
      setTimeout(() => {
        this.currentProductId = null;
      }, 100);
      this.getList();
      this.verifyDialogVisible = false;
      this.titleVisible = "溯源管理";
    },
  }
};
</script>

<style scoped>
/* 器械分类锁定时，和 Element 禁用输入框一样发灰 */
.is-disabled-cate ::v-deep .vue-treeselect--disabled .vue-treeselect__control {
  background-color: #F5F7FA;
  border-color: #E4E7ED;
  cursor: not-allowed;
}
.is-disabled-cate ::v-deep .vue-treeselect--disabled .vue-treeselect__single-value,
.is-disabled-cate ::v-deep .vue-treeselect--disabled .vue-treeselect__placeholder {
  color: #C0C4CC;
}
.is-disabled-cate ::v-deep .vue-treeselect--disabled .vue-treeselect__control-arrow {
  color: #C0C4CC;
}
.is-upload-disabled {
  pointer-events: none;
  opacity: 0.65;
}
</style>
