web_dist/src/views/logisticsMaterials/logisticsBasicData/enterpriseInformation.vue

<template>
    <div class="layout_display_flex_y">
        <div class="obviousBox">
            <searchArea :searchData="searchData" @submit="searchByForm"></searchArea>
        </div>
        <div class="layout_display_flex_y">
            <el-tabs class="el-tabs__fill" v-model="editableTabsValue" type="border-card" @tab-click="handleClick">
                <div style="padding: 6px; background-color: #fff;">
                    <el-button type="primary" icon="Plus" @click="onAddItem" style="margin-left: 5px">新增</el-button>
                </div>
                <el-tab-pane key="ypClass" label="供应商字典" name="ypClass" style="height: 90%;">
                    <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 prop="code" label="供应商编码" width="80">
                                    <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="pyCode" label="拼音码" width="140" />
                                <el-table-column prop="dcode" label="五笔码" width="140" />
                                <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="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="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="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="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="100">
                                    <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 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>
                                        <el-button type="success" size="small"
                                            v-if="!scope.row.isEdit && scope.row.delFlag === '1'"
                                            @click.prevent="deleteYpClass(scope.$index, scope.row)">
                                            启用
                                        </el-button>
                                        <el-button type="info" size="small"
                                            v-if="!scope.row.isEdit && scope.row.delFlag === '0'"
                                            @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" style="height: 90%;">
                    <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 prop="code" label="厂家编码" width="80">
                                    <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="pyCode" label="拼音码" width="140" />
                                <el-table-column prop="dcode" label="五笔码" width="140" />
                                <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="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="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="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="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="100">
                                    <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 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>
                                        <el-button type="success" size="small"
                                            v-if="!scope.row.isEdit && scope.row.delFlag === '1'"
                                            @click.prevent="deleteYpClass(scope.$index, scope.row)">
                                            启用
                                        </el-button>
                                        <el-button type="info" size="small"
                                            v-if="!scope.row.isEdit && scope.row.delFlag === '0'"
                                            @click.prevent="deleteYpClass(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-tabs>
        </div>

        <el-dialog v-model="centerDialogVisible" :title="'新增' + currentTabLabel" width="500" center>
            <template #footer>
                <el-form :model="addItemForm" label-width="auto" style="max-width: 600px">
                    <el-row type="flex" justify="center" :gutter="0">
                        <el-col :span="colSize">
                            <el-form-item label="供应商名称">
                                <el-input v-model="addItemForm.name" />
                            </el-form-item>
                        </el-col>
                        <el-col :span="colSize">
                            <el-form-item label="厂商类型">
                                <el-select v-model="addItemForm.region" placeholder="please select your zone">
                                    <el-option label="Zone one" value="shanghai" />
                                    <el-option label="Zone two" value="beijing" />
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row type="flex" justify="center" :gutter="0">
                        <el-col :span="colSize">
                            <el-form-item label="地址">
                                <el-input v-model="addItemForm.name" />
                            </el-form-item>
                        </el-col>
                        <el-col :span="colSize">
                            <el-form-item label="电话">
                                <el-input v-model="addItemForm.name" />
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row type="flex" justify="center" :gutter="0">
                        <el-col :span="colSize">
                            <el-form-item label="账号">
                                <el-input v-model="addItemForm.name" />
                            </el-form-item>
                        </el-col>
                        <el-col :span="colSize">
                            <el-form-item label="开户银行">
                                <el-input v-model="addItemForm.name" />
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row type="flex" justify="center" :gutter="0">
                        <el-col :span="colSize">
                            <el-form-item label="是否停用">
                                <el-select v-model="addItemForm.region" placeholder="please select your zone">
                                    <el-option label="停用" value="1" />
                                    <el-option label="启用" value="0" />
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col :span="colSize">
                        </el-col>
                    </el-row>
                </el-form>
                <div class="dialog-footer">
                    <el-button @click="centerDialogVisible = false">Cancel</el-button>
                    <el-button type="primary" @click="centerDialogVisible = false">
                        Confirm
                    </el-button>
                </div>
            </template>
        </el-dialog>
    </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'
import searchArea from '@/components/searchArea/index.vue';

const editableTabsValue = ref('ypClass')
const msgTip = '分类编码(code)有变更,原始字典记录存在关联,请谨慎做更改，是否确认！！！'
const delFlagOptions = [{ code: '0', name: '启用' }, { code: '1', name: '停用' }]

const searchData = ref([
    {
        label: '企业名称',
        key: 'vehicleName',
        type: 'input',
        value: '',
        clearable: true,
    },
])

let addItemForm = reactive({})

let centerDialogVisible = ref(false)

let currentTabLabel = ref('供应商')

const colSize = ref(12)

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 pageSizeUnit = ref(20)
const currentPageUnit = ref(1)

const pageSize = ref(20)
const currentPage = ref(1)

const pageSizeSupply = ref(20)
const currentPageSupply = ref(1)

const pageSizeManuFactory = ref(20)
const currentPageManuFactory = ref(1)

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 searchByForm = (form) => {
    console.log("search", form)
}


// 查询药品字典-药性字典
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 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 queryItem = () => {
    if (editableTabsValue.value === 'ypClass') {
        queryYpClass()
    } else if (editableTabsValue.value === 'drugKind') {
        queryDrugKind()
    }
}

// 新增行
const onAddItem = () => {
    console.log('onAddItem')
    centerDialogVisible.value = true
    return
    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)
    }
}

// 药品字典-药性字典增删改存开始
// 编辑
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 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') {
        currentTabLabel.value = '供应商'
        queryYpClass()
        currentPageClass.value = 1
    } else if (editableTabsValue.value === 'drugKind') {
        currentTabLabel.value = '生产厂家'
        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>