web_dist/src/views/yp-dict/YpDictBase.vue

<template>
  <div class="layout_display_flex_y">
    <div style="margin-bottom: 6px; background-color: #fff;">
      <el-input v-model="text" class="w-50 m-2" style="width: 300px" placeholder="请输入编码/名称" clearable>
        <template #prepend>编码/名称 </template>
      </el-input>
      <el-button type="primary" icon="Search" @click="queryItem" style="margin-left: 5px">查询</el-button>
      <el-button type="primary" icon="Plus" @click="onAddItem" style="margin-left: 5px">新增</el-button>
      <!-- <el-button type="primary" icon="Download" @click="exportData" style="margin-left: 5px">导出</el-button> -->
    </div>
    <div class="layout_display_flex_y">
      <el-tabs class="el-tabs__fill" v-model="editableTabsValue" type="border-card" @tab-click="handleClick">
        <el-tab-pane key="ypClass" label="药性字典" name="ypClass">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table
                  :data="ypClassData.slice(pageSizeClass * (currentPageClass - 1), pageSizeClass * currentPageClass)"
                  border style="width: 100%" height="100%" stripe highlight-current-row
                  class="ypClassTable normal-size">
                <el-table-column type="index" label="序号" width="100" />
                <el-table-column prop="code" label="药性编码" width="200">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.code"></el-input>
                    <span v-else>{{ scope.row.code }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="name" label="名称" width="280">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.name"></el-input>
                    <span v-else>{{ scope.row.name }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="delFlag" label="是否无效" width="120">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.delFlag" clearable placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.delFlag" disabled placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="pyCode" label="拼音码" width="200" />
                <el-table-column prop="dcode" label="自定义码" width="200" />
                <el-table-column fixed="right" label="操作" min-width="180" width="180" center>
                  <template #default="scope">
                    <el-button type="primary" size="small" v-if="!scope.row.isEdit"
                               @click="editYpClass(scope.row)">编辑</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="updateYpClass(scope.row)">保存</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="cancelYpClass(scope.row)">取消
                    </el-button>
                    <el-button type="danger" size="small"
                               @click.prevent="deleteYpClass(scope.$index, scope.row)">
                      删除
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div>
              <el-pagination :current-page="currentPageClass" :page-size="pageSizeClass"
                             :page-sizes="[10, 15, 20, 25]" :total="ypClassData.length"
                             layout="total, sizes, prev, pager, next, jumper" style="margin-top: 5px"
                             @size-change="handleSizeChangeClass" @current-change="handleCurrentChangeClass">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane key="drugKind" label="药品分类字典" name="drugKind">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table
                  :data="drugKindData.slice(pageSizeKind * (currentPageKind - 1), pageSizeKind * currentPageKind)"
                  border style="width: 100%" height="100%" stripe highlight-current-row
                  class="drugKindTable normal-size">
                <el-table-column type="index" label="序号" width="100" />
                <el-table-column prop="code" label="分类编码" width="120">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.code"></el-input>
                    <span v-else>{{ scope.row.code }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="name" label="名称" width="280">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.name"></el-input>
                    <span v-else>{{ scope.row.name }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="ypType" label="类别" width="140">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.ypType" clearable placeholder="请选择类别">
                        <el-option v-for="option in ypTypeOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.ypType" disabled placeholder="请选择类别">
                        <el-option v-for="option in ypTypeOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="mzBillCode" label="门诊菜单编码" width="120">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.mzBillCode"></el-input>
                    <span v-else>{{ scope.row.mzBillCode }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="zyBillCode" label="住院菜单编码" width="120">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.zyBillCode"></el-input>
                    <span v-else>{{ scope.row.zyBillCode }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="pyCode" label="拼音码" width="140" />
                <el-table-column prop="dcode" label="自定义码" width="140" />
                <el-table-column fixed="right" label="操作" min-width="180" width="180" center>
                  <template #default="scope">
                    <el-button type="primary" size="small" v-if="!scope.row.isEdit"
                               @click="editDrugKind(scope.row)">编辑</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="updateDrugKind(scope.row)">保存</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="cancelDrugKind(scope.row)">取消
                    </el-button>
                    <el-button type="danger" size="small"
                               @click.prevent="deleteDrugKind(scope.$index, scope.row)">
                      删除
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div>
              <el-pagination :current-page="currentPageKind" :page-size="pageSizeKind" :page-sizes="[10, 15, 20, 25]"
                             :total="drugKindData.length" layout="total, sizes, prev, pager, next, jumper"
                             style="margin-top: 5px" @size-change="handleSizeChangeKind"
                             @current-change="handleCurrentChangeKind">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane key="ypDosage" label="药品剂型字典" name="ypDosage">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table
                  :data="ypDosageData.slice(pageSizeDosage * (currentPageDosage - 1), pageSizeDosage * currentPageDosage)"
                  border style="width: 100%" height="100%" stripe highlight-current-row
                  class="ypDosageTable normal-size">
                <el-table-column type="index" label="序号" width="70" />
                <el-table-column prop="code" label="剂型编码" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.code"></el-input>
                    <span v-else>{{ scope.row.code }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="name" label="名称" width="140">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.name"></el-input>
                    <span v-else>{{ scope.row.name }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="delFlag" label="是否无效" width="120">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.delFlag" clearable placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.delFlag" disabled placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="pyCode" label="拼音码" width="120" />
                <el-table-column prop="dcode" label="自定义码" width="120" />
                <el-table-column prop="dosaType" label="剂型分类" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.dosaType"></el-input>
                    <span v-else>{{ scope.row.dosaType }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="dosaRemark" label="剂型说明" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.dosaRemark"></el-input>
                    <span v-else>{{ scope.row.dosaRemark }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="orderNo" label="编码" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.orderNo"></el-input>
                    <span v-else>{{ scope.row.orderNo }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="ybCode" label="市医保编码(旧)" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.ybCode"></el-input>
                    <span v-else>{{ scope.row.ybCode }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="hnsybCode" label="省医保编码(旧)" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.hnsybCode"></el-input>
                    <span v-else>{{ scope.row.hnsybCode }}</span>
                  </template>
                </el-table-column>
                <el-table-column fixed="right" label="操作" min-width="180" width="180" center>
                  <template #default="scope">
                    <el-button type="primary" size="small" v-if="!scope.row.isEdit"
                               @click="editYpDosage(scope.row)">编辑</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="updateYpDosage(scope.row)">保存</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="cancelYpDosage(scope.row)">取消
                    </el-button>
                    <el-button type="danger" size="small"
                               @click.prevent="deleteYpDosage(scope.$index, scope.row)">
                      删除
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div>
              <el-pagination :current-page="currentPageDosage" :page-size="pageSizeDosage"
                             :page-sizes="[10, 15, 20, 25]" :total="ypDosageData.length"
                             layout="total, sizes, prev, pager, next, jumper" style="margin-top: 5px"
                             @size-change="handleSizeChangeDosage" @current-change="handleCurrentChangeDosage">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane key="ypUnit" label="药品单位字典" name="ypUnit">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table :data="ypUnitData.slice(pageSizeUnit * (currentPageUnit - 1), pageSizeUnit * currentPageUnit)"
                        border style="width: 100%" height="100%" stripe highlight-current-row
                        class="ypUnitTable normal-size">
                <el-table-column type="index" label="序号" width="100" />
                <el-table-column prop="code" label="单位编码" width="140">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.code"></el-input>
                    <span v-else>{{ scope.row.code }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="name" label="名称" width="180">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.name"></el-input>
                    <span v-else>{{ scope.row.name }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="delFlag" label="是否无效" width="150">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.delFlag" clearable placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.delFlag" disabled placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="orderNo" label="编码" width="120">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.orderNo"></el-input>
                    <span v-else>{{ scope.row.orderNo }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="refundableFees" label="是否可以退费" width="120">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.refundableFees" clearable placeholder="请选择是否退费">
                        <el-option v-for="option in refundableFeesOptions" :key="option.code"
                                   :label="option.name" :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.refundableFees" disabled placeholder="请选择是否退费">
                        <el-option v-for="option in refundableFeesOptions" :key="option.code"
                                   :label="option.name" :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="pyCode" label="拼音码" width="150" />
                <el-table-column prop="dcode" label="自定义码" width="150" />
                <el-table-column fixed="right" label="操作" min-width="180" width="180" center>
                  <template #default="scope">
                    <el-button type="primary" size="small" v-if="!scope.row.isEdit"
                               @click="editYpUnit(scope.row)">编辑</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="updateYpUnit(scope.row)">保存</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="cancelYpUnit(scope.row)">取消
                    </el-button>
                    <el-button type="danger" size="small"
                               @click.prevent="deleteYpUnit(scope.$index, scope.row)">
                      删除
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div>
              <el-pagination :current-page="currentPageUnit" :page-size="pageSizeUnit" :page-sizes="[10, 15, 20, 25]"
                             :total="ypUnitData.length" layout="total, sizes, prev, pager, next, jumper" style="margin-top: 5px"
                             @size-change="handleSizeChangeUnit" @current-change="handleCurrentChangeUnit">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane key="ypChargeGroup" label="药品费别字典" name="ypChargeGroup">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table :data="ypChargeGroupData" border style="width: 100%" stripe highlight-current-row>
                <el-table-column type="index" label="序号" width="100" />
                <el-table-column prop="code" label="费别编码" width="140">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.code"></el-input>
                    <span v-else>{{ scope.row.code }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="name" label="名称" width="200">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.name"></el-input>
                    <span v-else>{{ scope.row.name }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="delFlag" label="是否无效" width="150">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.delFlag" clearable placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.delFlag" disabled placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="pyCode" label="拼音码" width="200" />
                <el-table-column prop="dcode" label="自定义码" width="200" />
                <el-table-column fixed="right" label="操作" min-width="180" width="180" center>
                  <template #default="scope">
                    <el-button type="primary" size="small" v-if="!scope.row.isEdit"
                               @click="editYpChargeGroup(scope.row)">编辑</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="updateYpChargeGroup(scope.row)">保存</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="cancelYpChargeGroup(scope.row, scope.$index)">取消
                    </el-button>
                    <el-button type="danger" size="small"
                               @click.prevent="deleteYpChargeGroup(scope.$index, scope.row)">
                      删除
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane key="visibleFlag" label="药房药品停用维护" name="visibleFlag" class="visibleFlagTab">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table :data="visibleFlagData.slice(pageSize * (currentPage - 1), pageSize * currentPage)" border
                        style="width: 100%" height="100%" stripe highlight-current-row
                        class="visibleFlagTable normal-size">
                <el-table-column type="index" label="序号" width="60" />
                <el-table-column prop="chargeCode" label="药品编码" width="80" />
                <el-table-column prop="serial" label="包装" width="60" />
                <el-table-column prop="drug" label="药品名称" width="240" />
                <el-table-column prop="specification" label="药品规格" width="180" />
                <el-table-column prop="packRetprice" label="零售价" width="80" />
                <el-table-column prop="groupName" label="药房" width="120" />
                <el-table-column prop="visibleFlagMz" label="门诊停用" width="100">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.visibleFlagMz" clearable placeholder="请选择是否停用">
                        <el-option v-for="option in visibleFlagOptions" :key="option.code"
                                   :label="option.name" :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.visibleFlagMz" disabled placeholder="请选择是否停用">
                        <el-option v-for="option in visibleFlagOptions" :key="option.code"
                                   :label="option.name" :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="visibleFlagZy" label="住院停用" width="100">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.visibleFlagZy" clearable placeholder="请选择是否停用">
                        <el-option v-for="option in visibleFlagOptions" :key="option.code"
                                   :label="option.name" :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.visibleFlagZy" disabled placeholder="请选择是否停用">
                        <el-option v-for="option in visibleFlagOptions" :key="option.code"
                                   :label="option.name" :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="pyCode" label="拼音码" width="100" />
                <el-table-column prop="dCode" label="自定义码" width="100" />
                <el-table-column fixed="right" label="操作" min-width="140" width="140" center>
                  <template #default="scope">
                    <el-button type="primary" size="small" v-if="!scope.row.isEdit"
                               @click="editVisibleFlag(scope.row)">编辑</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="updateVisibleFlag(scope.row)">保存</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="cancelVisibleFlag(scope.row, scope.$index)">取消
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div>
              <el-pagination :current-page="currentPage" :page-size="pageSize" :page-sizes="[10, 15, 20, 25]"
                             :total="visibleFlagData.length" layout="total, sizes, prev, pager, next, jumper"
                             style="margin-top: 5px" @size-change="handleSizeChange" @current-change="handleCurrentChange">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane key="ypSupply" label="药品供应商字典" name="ypSupply">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table
                  :data="ypSupplyData.slice(pageSizeSupply * (currentPageSupply - 1), pageSizeSupply * currentPageSupply)"
                  border style="width: 100%" height="100%" stripe highlight-current-row
                  class="ypSupplyTable normal-size" :row-class-name="tableRowClassName">
                <el-table-column type="index" label="序号" width="80" />
                <el-table-column prop="code" label="供应商编码" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.code"></el-input>
                    <span v-else>{{ scope.row.code }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="name" label="名称" width="280">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.name"></el-input>
                    <span v-else>{{ scope.row.name }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="supplyCode" label="企业信用代码" width="180">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.supplyCode"></el-input>
                    <span v-else>{{ scope.row.supplyCode }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="pyCode" label="拼音码" width="120" />
                <el-table-column prop="dcode" label="自定义码" width="120" />
                <el-table-column prop="delFlag" label="是否无效" width="150">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.delFlag" clearable placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.delFlag" disabled placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="abbrName" label="简称" width="180">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.abbrName"></el-input>
                    <span v-else>{{ scope.row.abbrName }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="address" label="地址" width="180">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.address"></el-input>
                    <span v-else>{{ scope.row.address }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="zipCode" label="邮编" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.zipCode"></el-input>
                    <span v-else>{{ scope.row.zipCode }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="telNo" label="电话" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.telNo"></el-input>
                    <span v-else>{{ scope.row.telNo }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="relName" label="联系人" width="80">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.relName"></el-input>
                    <span v-else>{{ scope.row.relName }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="busiRange" label="业务范围" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.busiRange"></el-input>
                    <span v-else>{{ scope.row.busiRange }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="comment" label="附注" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.comment"></el-input>
                    <span v-else>{{ scope.row.comment }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="useFlag" label="是否使用" width="120">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.useFlag" clearable placeholder="请选择是否使用">
                        <el-option v-for="option in yesOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.useFlag" disabled placeholder="请选择是否使用">
                        <el-option v-for="option in yesOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column fixed="right" label="操作" min-width="180" width="180" center>
                  <template #default="scope">
                    <el-button type="primary" size="small" v-if="!scope.row.isEdit"
                               @click="editYpSupply(scope.row)">编辑</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="updateYpSupply(scope.row)">保存</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="cancelYpSupply(scope.row, scope.$index)">取消
                    </el-button>
                    <el-button type="danger" size="small"
                               @click.prevent="deleteYpSupply(scope.$index, scope.row)">
                      删除
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div>
              <el-pagination :current-page="currentPageSupply" :page-size="pageSizeSupply"
                             :page-sizes="[10, 15, 20, 25]" :total="ypSupplyData.length"
                             layout="total, sizes, prev, pager, next, jumper" style="margin-top: 5px"
                             @size-change="handleSizeChangeSupply" @current-change="handleCurrentChangeSupply">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane key="ypManuFactory" label="生产厂家字典" name="ypManuFactory">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table
                  :data="ypManuFactoryData.slice(pageSizeManuFactory * (currentPageManuFactory - 1), pageSizeManuFactory * currentPageManuFactory)"
                  border style="width: 100%" height="100%" stripe highlight-current-row
                  class="ypManuFactoryTable normal-size">
                <el-table-column type="index" label="序号" width="80" />
                <el-table-column prop="code" label="药厂编码" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.code"></el-input>
                    <span v-else>{{ scope.row.code }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="name" label="药厂名称" width="280" show-overflow-tooltip>
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.name"></el-input>
                    <span v-else>{{ scope.row.name }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="pyCode" label="拼音码" width="120" />
                <el-table-column prop="dcode" label="自定义码" width="120" />
                <el-table-column prop="delFlag" label="是否无效" width="150">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.delFlag" clearable placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.delFlag" disabled placeholder="请选择是否无效">
                        <el-option v-for="option in delFlagOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="abbrName" label="简称" width="180">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.abbrName"></el-input>
                    <span v-else>{{ scope.row.abbrName }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="address" label="地址" width="180">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.address"></el-input>
                    <span v-else>{{ scope.row.address }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="zipCode" label="邮编" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.zipCode"></el-input>
                    <span v-else>{{ scope.row.zipCode }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="telNo" label="电话" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.telNo"></el-input>
                    <span v-else>{{ scope.row.telNo }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="relName" label="联系人" width="80">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.relName"></el-input>
                    <span v-else>{{ scope.row.relName }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="productRange" label="产品范围" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.productRange"></el-input>
                    <span v-else>{{ scope.row.productRange }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="comment" label="附注" width="100">
                  <template v-slot="scope">
                    <el-input v-if="scope.row.isEdit" size="small" v-model="scope.row.comment"></el-input>
                    <span v-else>{{ scope.row.comment }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="useFlag" label="是否使用" width="120">
                  <template v-slot="scope">
                    <div v-if="scope.row.isEdit">
                      <el-select v-model="scope.row.useFlag" clearable placeholder="请选择是否使用">
                        <el-option v-for="option in yesOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                    <div v-else>
                      <el-select v-model="scope.row.useFlag" disabled placeholder="请选择是否使用">
                        <el-option v-for="option in yesOptions" :key="option.code" :label="option.name"
                                   :value="option.code"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column fixed="right" label="操作" min-width="180" width="180" center>
                  <template #default="scope">
                    <el-button type="primary" size="small" v-if="!scope.row.isEdit"
                               @click="editYpManuFactory(scope.row)">编辑</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="updateYpManuFactory(scope.row)">保存</el-button>
                    <el-button type="primary" size="small" v-if="scope.row.isEdit"
                               @click="cancelYpManuFactory(scope.row)">取消
                    </el-button>
                    <el-button type="danger" size="small"
                               @click.prevent="deleteYpManuFactory(scope.$index, scope.row)">
                      删除
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div>
              <el-pagination :current-page="currentPageManuFactory" :page-size="pageSizeManuFactory"
                             :page-sizes="[10, 15, 20, 25]" :total="ypManuFactoryData.length"
                             layout="total, sizes, prev, pager, next, jumper" style="margin-top: 5px"
                             @size-change="handleSizeChangeManuFactory" @current-change="handleCurrentChangeManuFactory">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>
<script setup name="YpDict">
import { ref, onMounted, nextTick } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import {
    selectYpClass, saveYpClass, delYpClassByCode,
    selectDrugKind, saveDrugKind, delDrugKindByCode,
    selectYpDosage, saveYpDosage, delYpDosageByCode,
    selectYpUnit, saveYpUnit, delYpUnitByCode,
    selectYpChargeGroup, saveYpChargeGroup, delYpChargeGroupByCode,
    selectYpVisibleFlag, updateYpVisibleFlag,
    selectYpSupply, saveYpSupply, delYpSupplyByCode,
    selectYpManuFactory, saveYpManuFactory, delYpManuFactoryByCode
} from '@/api/yp-dict/yp-dict-base.js'

const editableTabsValue = ref('ypClass')
const msgTip = '分类编码(code)有变更,原始字典记录存在关联,请谨慎做更改，是否确认！！！'
const delFlagOptions = [{ code: '0', name: '有效' }, { code: '1', name: '无效' }]
const ypTypeOptions = [{ code: '1', name: '西药' }, { code: '2', name: '成药' }, { code: '3', name: '草药' }, { code: '4', name: '卫生材料' }]
const refundableFeesOptions = [{ code: '0', name: '否' }, { code: '1', name: '是' }]
const visibleFlagOptions = [{ code: '0', name: '正常' }, { code: '1', name: '停用' }]
const yesOptions = [{ code: '0', name: '否' }, { code: '1', name: '是' }]

const pageSizeClass = ref(20)
const currentPageClass = ref(1)
const handleSizeChangeClass = (val) => {
    pageSizeClass.value = val
}
const handleCurrentChangeClass = (val) => {
    currentPageClass.value = val
}

const pageSizeKind = ref(20)
const currentPageKind = ref(1)
const handleSizeChangeKind = (val) => {
    pageSizeKind.value = val
}
const handleCurrentChangeKind = (val) => {
    currentPageKind.value = val
}

const pageSizeDosage = ref(20)
const currentPageDosage = ref(1)
const handleSizeChangeDosage = (val) => {
    pageSizeDosage.value = val
}
const handleCurrentChangeDosage = (val) => {
    currentPageDosage.value = val
}

const pageSizeUnit = ref(20)
const currentPageUnit = ref(1)
const handleSizeChangeUnit = (val) => {
    pageSizeUnit.value = val
}
const handleCurrentChangeUnit = (val) => {
    currentPageUnit.value = val
}

const pageSize = ref(20)
const currentPage = ref(1)
const handleSizeChange = (val) => {
    pageSize.value = val
}
const handleCurrentChange = (val) => {
    currentPage.value = val
}

const pageSizeSupply = ref(20)
const currentPageSupply = ref(1)
const handleSizeChangeSupply = (val) => {
    pageSizeSupply.value = val
}
const handleCurrentChangeSupply = (val) => {
    currentPageSupply.value = val
}

const pageSizeManuFactory = ref(20)
const currentPageManuFactory = ref(1)
const handleSizeChangeManuFactory = (val) => {
    pageSizeManuFactory.value = val
}
const handleCurrentChangeManuFactory = (val) => {
    currentPageManuFactory.value = val
}

const ypClassData = ref([])
const drugKindData = ref([])
const ypDosageData = ref([])
const ypUnitData = ref([])
const ypChargeGroupData = ref([])
const visibleFlagData = ref([])
const ypSupplyData = ref([])
const ypManuFactoryData = ref([])

const text = ref('')
onMounted(() => {
    nextTick(() => {
        queryYpClass()
    })
})

// 查询药品字典-药性字典
const queryYpClass = () => {
    selectYpClass(text.value)
        .then((res) => {
            res.forEach(row => {
                // 是否标记
                row['isEdit'] = false
                // 是否新增
                row['isAdd'] = false
            })
            ypClassData.value = res
        })
        .catch(() => {
            ypClassData.value = []
        })
}

// 查询药品字典-药品分类字典
const queryDrugKind = () => {
    selectDrugKind(text.value)
        .then((res) => {
            res.forEach(row => {
                // 是否标记
                row['isEdit'] = false
                // 是否新增
                row['isAdd'] = false
            })
            drugKindData.value = res
        })
        .catch(() => {
            drugKindData.value = []
        })
}

// 查询药品字典-药品剂型字典
const queryYpDosage = () => {
    selectYpDosage(text.value)
        .then((res) => {
            res.forEach(row => {
                // 是否标记
                row['isEdit'] = false
                // 是否新增
                row['isAdd'] = false
            })
            ypDosageData.value = res
        })
        .catch(() => {
            ypDosageData.value = []
        })
}

// 查询药品字典-药品单位字典
const queryYpUnit = () => {
    selectYpUnit(text.value)
        .then((res) => {
            res.forEach(row => {
                // 是否标记
                row['isEdit'] = false
                // 是否新增
                row['isAdd'] = false
            })
            ypUnitData.value = res
        })
        .catch(() => {
            ypUnitData.value = []
        })
}

// 查询药品字典-药品费别字典
const queryYpChargeGroup = () => {
    selectYpChargeGroup(text.value)
        .then((res) => {
            res.forEach(row => {
                // 是否标记
                row['isEdit'] = false
                // 是否新增
                row['isAdd'] = false
            })
            ypChargeGroupData.value = res
        })
        .catch(() => {
            ypChargeGroupData.value = []
        })
}

// 查询药房药品停用情况
const flagFilter = ref('')
const queryVisibleFlag = () => {
    selectYpVisibleFlag(text.value, flagFilter.value)
        .then((res) => {
            res.forEach(row => {
                // 是否标记
                row['isEdit'] = false
                // 是否新增
                row['isAdd'] = false
            })
            visibleFlagData.value = res
        })
        .catch(() => {
            visibleFlagData.value = []
        })
}

// 查询药品字典-药品厂家字典
const queryYpSupply = () => {
    selectYpSupply(text.value)
        .then((res) => {
            res.forEach(row => {
                // 是否标记
                row['isEdit'] = false
                // 是否新增
                row['isAdd'] = false
            })
            ypSupplyData.value = res
        })
        .catch(() => {
            ypSupplyData.value = []
        })
}

// 查询药品字典-药品供应商字典
const queryYpManuFactory = () => {
    selectYpManuFactory(text.value)
        .then((res) => {
            res.forEach(row => {
                // 是否标记
                row['isEdit'] = false
                // 是否新增
                row['isAdd'] = false
            })
            ypManuFactoryData.value = res
        })
        .catch(() => {
            ypManuFactoryData.value = []
        })
}

// 查询
const queryItem = () => {
    if (editableTabsValue.value === 'ypClass') {
        queryYpClass()
    } else if (editableTabsValue.value === 'drugKind') {
        queryDrugKind()
    } else if (editableTabsValue.value === 'ypDosage') {
        queryYpDosage()
    } else if (editableTabsValue.value === 'ypUnit') {
        queryYpUnit()
    } else if (editableTabsValue.value === 'ypChargeGroup') {
        queryYpChargeGroup()
    } else if (editableTabsValue.value === 'visibleFlag') {
        queryVisibleFlag()
    } else if (editableTabsValue.value === 'ypSupply') {
        queryYpSupply()
    } else if (editableTabsValue.value === 'ypManuFactory') {
        queryYpManuFactory()
    }
}

// 新增行
const onAddItem = () => {
    if (editableTabsValue.value === 'ypClass') {
        let count
        if (ypClassData.value.length % pageSizeClass.value === 0) {
            count = Math.ceil(ypClassData.value.length / pageSizeClass.value) + 1
        } else {
            count = Math.ceil(ypClassData.value.length / pageSizeClass.value)
        }
        currentPageClass.value = count
        ypClassData.value.push({
            code: '',
            name: '',
            pyCode: '',
            dcode: '',
            delFlag: '',
            isEdit: true,
            isAdd: true,
        })
        const el = document.querySelector('.ypClassTable .el-scrollbar__wrap')
        const el2 = document.querySelector('.ypClassTable .el-table__body tbody')
        setTimeout(() => {
            const height = el2.clientHeight - el.clientHeight
            if (height > 0) {
                el.scrollTop = height
            }
        }, 100)
    } else if (editableTabsValue.value === 'drugKind') {
        let count
        if (drugKindData.value.length % pageSizeKind.value === 0) {
            count = Math.ceil(drugKindData.value.length / pageSizeKind.value) + 1
        } else {
            count = Math.ceil(drugKindData.value.length / pageSizeKind.value)
        }
        currentPageKind.value = count
        drugKindData.value.push({
            code: '',
            name: '',
            pyCode: '',
            dcode: '',
            ypType: '',
            mzBillCode: '',
            zyBillCode: '',
            isEdit: true,
            isAdd: true,
        })
        const el = document.querySelector('.drugKindTable .el-scrollbar__wrap')
        const el2 = document.querySelector('.drugKindTable .el-table__body tbody')
        setTimeout(() => {
            const height = el2.clientHeight - el.clientHeight
            if (height > 0) {
                el.scrollTop = height
            }
        }, 100)
    } else if (editableTabsValue.value === 'ypDosage') {
        let count
        if (ypDosageData.value.length % pageSizeDosage.value === 0) {
            count = Math.ceil(ypDosageData.value.length / pageSizeDosage.value) + 1
        } else {
            count = Math.ceil(ypDosageData.value.length / pageSizeDosage.value)
        }
        currentPageDosage.value = count
        ypDosageData.value.push({
            code: '',
            name: '',
            pyCode: '',
            dcode: '',
            dosaType: '',
            dosaRemark: '',
            orderNo: '',
            delFlag: '',
            ybCode: '',
            hnsybCode: '',
            isEdit: true,
            isAdd: true,
        })
        const el = document.querySelector('.ypDosageTable .el-scrollbar__wrap')
        const el2 = document.querySelector('.ypDosageTable .el-table__body tbody')
        setTimeout(() => {
            const height = el2.clientHeight - el.clientHeight
            if (height > 0) {
                el.scrollTop = height
            }
        }, 100)
    } else if (editableTabsValue.value === 'ypUnit') {
        let count
        if (ypUnitData.value.length % pageSizeUnit.value === 0) {
            count = Math.ceil(ypUnitData.value.length / pageSizeUnit.value) + 1
        } else {
            count = Math.ceil(ypUnitData.value.length / pageSizeUnit.value)
        }
        currentPageUnit.value = count
        ypUnitData.value.push({
            code: '',
            name: '',
            pyCode: '',
            dcode: '',
            orderNo: '',
            delFlag: '',
            refundableFees: '',
            isEdit: true,
            isAdd: true,
        })
        const el = document.querySelector('.ypUnitTable .el-scrollbar__wrap')
        const el2 = document.querySelector('.ypUnitTable .el-table__body tbody')
        setTimeout(() => {
            const height = el2.clientHeight - el.clientHeight
            if (height > 0) {
                el.scrollTop = height
            }
        }, 100)
    } else if (editableTabsValue.value === 'ypChargeGroup') {
        ypChargeGroupData.value.push({
            code: '',
            name: '',
            pyCode: '',
            dcode: '',
            delFlag: '',
            isEdit: true,
            isAdd: true,
        })
    } else if (editableTabsValue.value === 'visibleFlag') {
        ElMessage({
            type: "warning",
            message: "不能新增药房药品停用，需先维护药品信息!",
            duration: 2500,
            showClose: true,
        });
    } else if (editableTabsValue.value === 'ypSupply') {
        let count
        if (ypSupplyData.value.length % pageSizeSupply.value === 0) {
            count = Math.ceil(ypSupplyData.value.length / pageSizeSupply.value) + 1
        } else {
            count = Math.ceil(ypSupplyData.value.length / pageSizeSupply.value)
        }
        currentPageSupply.value = count
        ypSupplyData.value.push({
            code: '',
            name: '',
            supplyCode: '',
            abbrName: '',
            address: '',
            zipCode: '',
            telNo: '',
            relName: '',
            busiRange: '',
            comment: '',
            useFlag: '',
            pyCode: '',
            dcode: '',
            delFlag: '',
            isEdit: true,
            isAdd: true,
        })
        const el = document.querySelector('.ypSupplyTable .el-scrollbar__wrap')
        const el2 = document.querySelector('.ypSupplyTable .el-table__body tbody')
        setTimeout(() => {
            const height = el2.clientHeight - el.clientHeight
            if (height > 0) {
                el.scrollTop = height
            }
        }, 100)
    } else if (editableTabsValue.value === 'ypManuFactory') {
        let count
        if (ypManuFactoryData.value.length % pageSizeManuFactory.value === 0) {
            count = Math.ceil(ypManuFactoryData.value.length / pageSizeManuFactory.value) + 1
        } else {
            count = Math.ceil(ypManuFactoryData.value.length / pageSizeManuFactory.value)
        }
        currentPageManuFactory.value = count
        ypManuFactoryData.value.push({
            code: '',
            name: '',
            abbrName: '',
            address: '',
            zipCode: '',
            telNo: '',
            relName: '',
            productRange: '',
            comment: '',
            useFlag: '',
            pyCode: '',
            dcode: '',
            delFlag: '',
            isEdit: true,
            isAdd: true,
        })
        const el = document.querySelector('.ypManuFactoryTable .el-scrollbar__wrap')
        const el2 = document.querySelector('.ypManuFactoryTable .el-table__body tbody')
        setTimeout(() => {
            const height = el2.clientHeight - el.clientHeight
            if (height > 0) {
                el.scrollTop = height
            }
        }, 100)
    }
}

// 药品字典-药性字典增删改存开始
// 编辑
const editYpClass = (row) => {
    // 备份原始数据
    row['oldRow'] = JSON.parse(JSON.stringify(row))
    row.isEdit = true
}
// 取消
const cancelYpClass = (row) => {
    // 如果是新增的数据
    if (row.isAdd) {
        ypClassData.value.splice(ypClassData.value.length - 1, 1)
    } else {
        // 不是新增的数据  还原数据
        for (const i in row.oldRow) {
            row[i] = row.oldRow[i]
        }
    }
}
// 保存
const updateYpClass = (row) => {
    if (!row.code || !row.name) {
        ElMessage({
            type: "warning",
            message: "药性字典编码或名称不存在，请检查!",
            duration: 2500,
            showClose: true,
        });
        return
    }

    if (row.isAdd) {
        let fe = 0
        for (let num in ypClassData.value) {
            if (ypClassData.value[num].code === row.code) {
                fe++
            }
        }
        if (fe === 2) {
            ElMessage({
                type: "warning",
                message: "存在重复的药性字典，请核对!",
                duration: 2500,
                showClose: true,
            });
        } else {
            callSaveYpClass(row, null)
        }

    } else {
        let oldCode = row.oldRow.code
        if (oldCode !== row.code) {
            ElMessageBox.confirm(msgTip, {
                cancelButtonText: '取消',
                confirmButtonText: '确定',
                type: 'warning',
                distinguishCancelAndClose: true,
                dangerouslyUseHTMLString: true
            }).then(() => {
                callSaveYpClass(row, oldCode)
            }).catch((action) => {
                if (action === 'cancel') {
                    queryYpClass()
                }
            })
        } else {
            callSaveYpClass(row, oldCode)
        }
    }
}

const callSaveYpClass = (row, oldCode) => {
    let title = '请确认是否保存<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        saveYpClass(row).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            if (oldCode !== null && oldCode !== row.code) {
                // 删除原始数据
                delYpClassByCode(oldCode).then((res) => {
                    queryYpClass()
                })
            } else {
                queryYpClass()
            }
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpClass()
        }
    })
}

const deleteYpClass = (index, row) => {
    let title = '请确认是否删除<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        delYpClassByCode(row.code).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            queryYpClass()
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpClass()
        }
    })
}
// 药品字典-药性字典增删改存结束

// 药品字典-药品分类字典增删改存开始
// 编辑
const editDrugKind = (row) => {
    // 备份原始数据
    row['oldRow'] = JSON.parse(JSON.stringify(row))
    row.isEdit = true
}
// 取消
const cancelDrugKind = (row) => {
    // 如果是新增的数据
    if (row.isAdd) {
        drugKindData.value.splice(drugKindData.value.length - 1, 1)
    } else {
        // 不是新增的数据  还原数据
        for (const i in row.oldRow) {
            row[i] = row.oldRow[i]
        }
    }
}
// 保存
const updateDrugKind = (row) => {
    if (!row.code || !row.name) {
        ElMessage({
            type: "warning",
            message: "药品分类字典编码或名称不存在，请检查!",
            duration: 2500,
            showClose: true,
        });
        return
    }

    if (row.isAdd) {
        let fe = 0
        for (let num in drugKindData.value) {
            if (drugKindData.value[num].code === row.code) {
                fe++
            }
        }
        if (fe === 2) {
            ElMessage({
                type: "warning",
                message: "存在重复的药品分类字典，请核对!",
                duration: 2500,
                showClose: true,
            });
        } else {
            callSaveDrugKind(row, null)
        }

    } else {
        let oldCode = row.oldRow.code
        if (oldCode !== row.code) {
            ElMessageBox.confirm(msgTip, {
                cancelButtonText: '取消',
                confirmButtonText: '确定',
                type: 'warning',
                distinguishCancelAndClose: true,
                dangerouslyUseHTMLString: true
            }).then(() => {
                callSaveDrugKind(row, oldCode)
            }).catch((action) => {
                if (action === 'cancel') {
                    queryDrugKind()
                }
            })
        } else {
            callSaveDrugKind(row, oldCode)
        }
    }
}

const callSaveDrugKind = (row, oldCode) => {
    let title = '请确认是否保存<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        saveDrugKind(row).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            if (oldCode !== null && oldCode !== row.code) {
                // 删除原始数据
                delDrugKindByCode(oldCode).then((res) => {
                    queryDrugKind()
                })
            } else {
                queryDrugKind()
            }
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryDrugKind()
        }
    })
}

const deleteDrugKind = (index, row) => {
    let title = '请确认是否删除<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        delDrugKindByCode(row.code).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            queryDrugKind()
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryDrugKind()
        }
    })
}
// 药品字典-药品分类字典增删改存结束

// 药品字典-药品剂型字典增删改存开始
// 编辑
const editYpDosage = (row) => {
    // 备份原始数据
    row['oldRow'] = JSON.parse(JSON.stringify(row))
    row.isEdit = true
}
// 取消
const cancelYpDosage = (row) => {
    // 如果是新增的数据
    if (row.isAdd) {
        ypDosageData.value.splice(ypDosageData.value.length - 1, 1)
    } else {
        // 不是新增的数据  还原数据
        for (const i in row.oldRow) {
            row[i] = row.oldRow[i]
        }
    }
}
// 保存
const updateYpDosage = (row) => {
    if (!row.code || !row.name) {
        ElMessage({
            type: "warning",
            message: "药品剂型字典编码或名称不存在，请检查!",
            duration: 2500,
            showClose: true,
        });
        return
    }

    if (row.isAdd) {
        let fe = 0
        for (let num in ypDosageData.value) {
            if (ypDosageData.value[num].code === row.code) {
                fe++
            }
        }
        if (fe === 2) {
            ElMessage({
                type: "warning",
                message: "存在重复的药品剂型字典，请核对!",
                duration: 2500,
                showClose: true,
            });
        } else {
            callSaveYpDosage(row, null)
        }

    } else {
        let oldCode = row.oldRow.code
        if (oldCode !== row.code) {
            ElMessageBox.confirm(msgTip, {
                cancelButtonText: '取消',
                confirmButtonText: '确定',
                type: 'warning',
                distinguishCancelAndClose: true,
                dangerouslyUseHTMLString: true
            }).then(() => {
                callSaveYpDosage(row, oldCode)
            }).catch((action) => {
                if (action === 'cancel') {
                    queryYpDosage()
                }
            })
        } else {
            callSaveYpDosage(row, oldCode)
        }
    }
}

const callSaveYpDosage = (row, oldCode) => {
    let title = '请确认是否保存<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        saveYpDosage(row).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            if (oldCode !== null && oldCode !== row.code) {
                // 删除原始数据
                delYpDosageByCode(oldCode).then((res) => {
                    queryYpDosage()
                })
            } else {
                queryYpDosage()
            }
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpDosage()
        }
    })
}

const deleteYpDosage = (index, row) => {
    let title = '请确认是否删除<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        delYpDosageByCode(row.code).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            queryYpDosage()
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpDosage()
        }
    })
}
// 药品字典-药品剂型字典增删改存结束

// 药品字典-药品单位字典增删改存开始
// 编辑
const editYpUnit = (row) => {
    // 备份原始数据
    row['oldRow'] = JSON.parse(JSON.stringify(row))
    row.isEdit = true
}
// 取消
const cancelYpUnit = (row) => {
    // 如果是新增的数据
    if (row.isAdd) {
        ypUnitData.value.splice(ypUnitData.value.length - 1, 1)
    } else {
        // 不是新增的数据  还原数据
        for (const i in row.oldRow) {
            row[i] = row.oldRow[i]
        }
    }
}
// 保存
const updateYpUnit = (row) => {
    if (!row.code || !row.name) {
        ElMessage({
            type: "warning",
            message: "药品单位字典编码或名称不存在，请检查!",
            duration: 2500,
            showClose: true,
        });
        return
    }

    if (row.isAdd) {
        let fe = 0
        for (let num in ypUnitData.value) {
            if (ypUnitData.value[num].code === row.code) {
                fe++
            }
        }
        if (fe === 2) {
            ElMessage({
                type: "warning",
                message: "存在重复的药品单位字典，请核对!",
                duration: 2500,
                showClose: true,
            });
        } else {
            callSaveYpUnit(row, null)
        }
    } else {
        let oldCode = row.oldRow.code
        if (oldCode !== row.code) {
            ElMessageBox.confirm(msgTip, {
                cancelButtonText: '取消',
                confirmButtonText: '确定',
                type: 'warning',
                distinguishCancelAndClose: true,
                dangerouslyUseHTMLString: true
            }).then(() => {
                callSaveYpUnit(row, oldCode)
            }).catch((action) => {
                if (action === 'cancel') {
                    queryYpUnit()
                }
            })
        } else {
            callSaveYpUnit(row, oldCode)
        }
    }
}

const callSaveYpUnit = (row, oldCode) => {
    let title = '请确认是否保存<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        saveYpUnit(row).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            // 若修改了主键code，则需要删除原来的记录
            if (oldCode !== null && oldCode !== row.code) {
                // 删除原始数据
                delYpUnitByCode(oldCode).then((res) => {
                    queryYpUnit()
                })
            } else {
                queryYpUnit()
            }
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpUnit()
        }
    })
}

const deleteYpUnit = (index, row) => {
    let title = '请确认是否删除<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        delYpUnitByCode(row.code).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            queryYpUnit()
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpUnit()
        }
    })
}
// 药品字典-药品单位字典增删改存结束

// 药品字典-药品费别字典增删改存开始
// 编辑
const editYpChargeGroup = (row) => {
    // 备份原始数据
    row['oldRow'] = JSON.parse(JSON.stringify(row))
    row.isEdit = true
}
// 取消
const cancelYpChargeGroup = (row, index) => {
    // 如果是新增的数据
    if (row.isAdd) {
        ypChargeGroupData.value.splice(index, 1)
    } else {
        // 不是新增的数据  还原数据
        for (const i in row.oldRow) {
            row[i] = row.oldRow[i]
        }
    }
}
// 保存
const updateYpChargeGroup = (row) => {
    if (!row.code || !row.name) {
        ElMessage({
            type: "warning",
            message: "药品费别字典编码或名称不存在，请检查!",
            duration: 2500,
            showClose: true,
        });
        return
    }

    if (row.isAdd) {
        let fe = 0
        for (let num in ypChargeGroupData.value) {
            if (ypChargeGroupData.value[num].code === row.code) {
                fe++
            }
        }
        if (fe === 2) {
            ElMessage({
                type: "warning",
                message: "存在重复的药品费别字典，请核对!",
                duration: 2500,
                showClose: true,
            });
        } else {
            callSaveYpChargeGroup(row, null)
        }

    } else {
        let oldCode = row.oldRow.code
        if (oldCode !== row.code) {
            ElMessageBox.confirm(msgTip, {
                cancelButtonText: '取消',
                confirmButtonText: '确定',
                type: 'warning',
                distinguishCancelAndClose: true,
                dangerouslyUseHTMLString: true
            }).then(() => {
                callSaveYpChargeGroup(row, oldCode)
            }).catch((action) => {
                if (action === 'cancel') {
                    queryYpChargeGroup()
                }
            })
        } else {
            callSaveYpChargeGroup(row, oldCode)
        }
    }
}

const callSaveYpChargeGroup = (row, oldCode) => {
    let title = '请确认是否保存<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        saveYpChargeGroup(row).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            if (oldCode !== null && oldCode !== row.code) {
                // 删除原始数据
                delYpChargeGroupByCode(oldCode).then((res) => {
                    queryYpChargeGroup()
                })
            } else {
                queryYpChargeGroup()
            }
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpChargeGroup()
        }
    })
}

const deleteYpChargeGroup = (index, row) => {
    let title = '请确认是否删除<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        delYpChargeGroupByCode(row.code).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            queryYpChargeGroup()
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpChargeGroup()
        }
    })
}
// 药品字典-药品费别字典增删改存结束

// 药房药品住院停用增删改存开始
// 编辑
const editVisibleFlag = (row) => {
    // 备份原始数据
    row['oldRow'] = JSON.parse(JSON.stringify(row))
    row.isEdit = true
}
// 取消
const cancelVisibleFlag = (row, index) => {
    // 如果是新增的数据
    if (row.isAdd) {
        visibleFlagData.value.splice(index, 1)
    } else {
        // 不是新增的数据  还原数据
        for (const i in row.oldRow) {
            row[i] = row.oldRow[i]
        }
    }
}
// 保存
const updateVisibleFlag = (row) => {
    if (!row.chargeCode || !row.groupNo) {
        ElMessage({
            type: "warning",
            message: "药房药品停用的药品编码或药房编码不存在，请检查!",
            duration: 2500,
            showClose: true,
        });
        return
    }

    if (row.isAdd) {
        ElMessage({
            type: "warning",
            message: "不能新增药房药品停用，需先维护药品信息!",
            duration: 2500,
            showClose: true,
        });
    } else {
        callSaveVisibleFlag(row)
    }
}

const callSaveVisibleFlag = (row) => {
    let title = '请确认是否保存<span style="color:#d12020;">' + row.drug + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        updateYpVisibleFlag(row).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            queryVisibleFlag()
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryVisibleFlag()
        }
    })
}
// 药房药品住院停用增删改存结束

// 药品字典-药品供应商字典增删改存开始
// 编辑
const editYpSupply = (row) => {
    // 备份原始数据
    row['oldRow'] = JSON.parse(JSON.stringify(row))
    row.isEdit = true
}

// 取消
const cancelYpSupply = (row, index) => {
    // 如果是新增的数据
    if (row.isAdd) {
        ypSupplyData.value.splice(ypSupplyData.value.length - 1, 1)
    } else {
        // 不是新增的数据  还原数据
        for (const i in row.oldRow) {
            row[i] = row.oldRow[i]
        }
    }
}
// 保存
const updateYpSupply = (row) => {
    if (!row.code || !row.name) {
        ElMessage({
            type: "warning",
            message: "药品供应商字典编码或名称不存在，请检查!",
            duration: 2500,
            showClose: true,
        });
        return
    }

    if (row.isAdd) {
        let fe = 0
        for (let num in ypSupplyData.value) {
            if (ypSupplyData.value[num].code === row.code) {
                fe++
            }
        }
        if (fe === 2) {
            ElMessage({
                type: "warning",
                message: "存在重复的药品供应商字典，请核对!",
                duration: 2500,
                showClose: true,
            });
        } else {
            callSaveYpSupply(row, null)
        }

    } else {
        let oldCode = row.oldRow.code
        if (oldCode !== row.code) {
            ElMessageBox.confirm(msgTip, {
                cancelButtonText: '取消',
                confirmButtonText: '确定',
                type: 'warning',
                distinguishCancelAndClose: true,
                dangerouslyUseHTMLString: true
            }).then(() => {
                callSaveYpSupply(row, oldCode)
            }).catch((action) => {
                if (action === 'cancel') {
                    queryYpSupply()
                }
            })
        } else {
            callSaveYpSupply(row, oldCode)
        }
    }
}

const callSaveYpSupply = (row, oldCode) => {
    let title = '请确认是否保存<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        saveYpSupply(row).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            if (oldCode !== null && oldCode !== row.code) {
                // 删除原始数据
                delYpSupplyByCode(oldCode).then((res) => {
                    queryYpSupply()
                })
            } else {
                queryYpSupply()
            }
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpSupply()
        }
    })
}

const deleteYpSupply = (index, row) => {
    let title = '请确认是否删除<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        delYpSupplyByCode(row.code).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            queryYpSupply()
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpSupply()
        }
    })
}
// 药品字典-药品供应商字典增删改存结束

// 药品字典-生产厂家字典增删改存开始
// 编辑
const editYpManuFactory = (row) => {
    // 备份原始数据
    row['oldRow'] = JSON.parse(JSON.stringify(row))
    row.isEdit = true
}

// 取消
const cancelYpManuFactory = (row) => {
    // 如果是新增的数据
    if (row.isAdd) {
        ypManuFactoryData.value.splice(ypManuFactoryData.value.length - 1, 1)
    } else {
        // 不是新增的数据  还原数据
        for (const i in row.oldRow) {
            row[i] = row.oldRow[i]
        }
    }
}
// 保存
const updateYpManuFactory = (row) => {
    if (!row.code || !row.name) {
        ElMessage({
            type: "warning",
            message: "生产厂家字典编码或名称不存在，请检查!",
            duration: 2500,
            showClose: true,
        });
        return
    }

    if (row.isAdd) {
        let fe = 0
        for (let num in ypManuFactoryData.value) {
            if (ypManuFactoryData.value[num].code === row.code) {
                fe++
            }
        }
        if (fe === 2) {
            ElMessage({
                type: "warning",
                message: "存在重复的生产厂家字典，请核对!",
                duration: 2500,
                showClose: true,
            });
        } else {
            callSaveYpManuFactory(row, null)
        }

    } else {
        let oldCode = row.oldRow.code
        if (oldCode !== row.code) {
            ElMessageBox.confirm(msgTip, {
                cancelButtonText: '取消',
                confirmButtonText: '确定',
                type: 'warning',
                distinguishCancelAndClose: true,
                dangerouslyUseHTMLString: true
            }).then(() => {
                callSaveYpManuFactory(row, oldCode)
            }).catch((action) => {
                if (action === 'cancel') {
                    queryYpManuFactory()
                }
            })
        } else {
            callSaveYpManuFactory(row, oldCode)
        }
    }
}

const callSaveYpManuFactory = (row, oldCode) => {
    let title = '请确认是否保存<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        saveYpManuFactory(row).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            if (oldCode !== null && oldCode !== row.code) {
                // 删除原始数据
                delYpManuFactoryByCode(oldCode).then((res) => {
                    queryYpManuFactory()
                })
            } else {
                queryYpManuFactory()
            }
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpManuFactory()
        }
    })
}

const deleteYpManuFactory = (index, row) => {
    let title = '请确认是否删除<span style="color:#d12020;">' + row.name + '</span>?'
    ElMessageBox.confirm(title, {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
        distinguishCancelAndClose: true,
        dangerouslyUseHTMLString: true
    }).then(() => {
        delYpManuFactoryByCode(row.code).then((res) => {
            ElMessage({
                type: "success",
                message: res.cg,
                duration: 2500,
                showClose: true,
            });
            queryYpManuFactory()
        })
    }).catch((action) => {
        if (action === 'cancel') {
            queryYpManuFactory()
        }
    })
}
// 药品字典-生产厂家字典增删改存结束

const exportData = () => {
    alert("功能建设中。。。")
}

const handleClick = (tab, event) => {
    // 查询哪个tab页面
    editableTabsValue.value = tab.props.name
    if (editableTabsValue.value === 'ypClass') {
        queryYpClass()
        currentPageClass.value = 1
    } else if (editableTabsValue.value === 'drugKind') {
        queryDrugKind()
        currentPageKind.value = 1
    } else if (editableTabsValue.value === 'ypDosage') {
        queryYpDosage()
        currentPageDosage.value = 1
    } else if (editableTabsValue.value === 'ypUnit') {
        queryYpUnit()
        currentPageUnit.value = 1
    } else if (editableTabsValue.value === 'ypChargeGroup') {
        queryYpChargeGroup()
    } else if (editableTabsValue.value === 'visibleFlag') {
        queryVisibleFlag()
        currentPage.value = 1
    } else if (editableTabsValue.value === 'ypSupply') {
        queryYpSupply()
        currentPageSupply.value = 1
    } else if (editableTabsValue.value === 'ypManuFactory') {
        queryYpManuFactory()
        currentPageManuFactory.value = 1
    }
}

const tableRowClassName = ({
    row,
    rowIndex,
}) => {
    if (row.delFlag === '1') {
        return 'warning-row'
    }
}

</script>
<style lang="scss" deep>
.el-dialog__body {
    padding: 0 16px;
    height: calc(100% - 25px);
}

.el-tabs {
    height: calc(100% - 27px);

    .el-tabs__content {
        padding: 5px;
        height: calc(100% - 27px);
    }

    .el-tab-pane {
        height: calc(100% - 27px);
        overflow: auto;
    }

    .el-table__inner-wrapper {
        height: calc(100% - 10px) !important;
    }

}

.el-table .warning-row {
    --el-table-tr-bg-color: #dd7694;
}
</style>