设备档案卡tab栏配置灵活性调整

src/views/component/device/deviceDialog.vue

@@ -712,31 +712,17 @@
                                     </el-form>
 
                                 </el-tab-pane>
-                                <el-tab-pane label="维护项目" name="two">
-                                    <Maintenance ref="MaintenanceRef" :list-data="form.maintenanceItemPoList" />
-                                </el-tab-pane>
-                                <el-tab-pane label="附属设备及配件" name="three">
-                                    <MoreDevices ref="MoreDevicesRef" :list-data="form.accessoriesDevicePoList" />
-                                </el-tab-pane>
-                                <el-tab-pane label="使用与维护记录" name="four" :disabled="!isEdit">
-                                    <!-- 使用 v-if 配合 keep-alive 实现按需加载 -->
-                                    <keep-alive>
-                                        <MaintenanceRecord v-if="activeName==='four'" :params="form" />
-                                    </keep-alive>
-                                </el-tab-pane>
-                                <el-tab-pane label="校准记录" name="five" :disabled="!isEdit">
-                                    <keep-alive>
-                                        <CalibrationCheckRecord v-if="activeName==='five'" :params="form" />
-                                    </keep-alive>
-                                </el-tab-pane>
-                                <el-tab-pane label="维修记录" name="six" :disabled="!isEdit">
-                                    <keep-alive>
-                                        <RepairRecord v-if="activeName==='six'" :params="form" /></keep-alive>
-                                </el-tab-pane>
-                                <el-tab-pane label="停用、报废记录" name="seven" :disabled="!isEdit">
-                                    <keep-alive>
-                                        <ScrappedRecord v-if="activeName==='seven'" :params="form" />
-                                    </keep-alive>
+
+                                <el-tab-pane v-for="item in tabItems" :key="item.name" :label="item.label" :name="item.name" :disabled="item.isKeepAlive&&!isEdit">
+                                    <template v-if="item.isKeepAlive">
+                                        <!-- 使用 v-if 配合 keep-alive 实现按需加载 -->
+                                        <keep-alive>
+                                            <component :is="item.component" v-if="activeName===item.name" :params="form" />
+                                        </keep-alive>
+                                    </template>
+                                    <template v-else>
+                                        <component :is="item.component" :ref="item.ref" :list-data="form[item.data]" />
+                                    </template>
                                 </el-tab-pane>
                             </el-tabs>
                         </el-col>
@@ -777,6 +763,14 @@ export default {
     data () {
         const { userId, position, level, deptList } = this.$store.getters
         return {
+            tabItems: [
+                { label: '维护项目', name: 'two', ref: 'MaintenanceRef', data: 'maintenanceItemPoList', component: 'Maintenance', isKeepAlive: false },
+                { label: '附属设备及配件', name: 'three', ref: 'MoreDevicesRef', data: 'accessoriesDevicePoList', component: 'MoreDevices', isKeepAlive: false },
+                { label: '使用与维护记录', name: 'four', component: 'MaintenanceRecord', isKeepAlive: true },
+                { label: '校准记录', name: 'five', component: 'CalibrationCheckRecord', isKeepAlive: true },
+                { label: '维修记录', name: 'six', component: 'RepairRecord', isKeepAlive: true },
+                { label: '停用、报废记录', name: 'seven', component: 'ScrappedRecord', isKeepAlive: true }
+            ],
             filter: [{
                 descVal: '2',
                 includeSub: true,
@@ -798,6 +792,7 @@ export default {
             position: position,
             deptList: deptList,
             level: level.second || level.first,
+            org: level.first || '',
             loading: false,
             title: '设备档案卡',
             toolbars: [
@@ -1186,9 +1181,9 @@ export default {
                 if (valid) {
                     try {
                         // 维护项目
-                        this.form.maintenanceItemPoList = this.$refs.MaintenanceRef.listDataCopy
+                        this.form.maintenanceItemPoList = this.$refs.MaintenanceRef?.[0]?.listDataCopy || this.form.maintenanceItemPoList || []
                         // 附属设备及配件
-                        this.form.accessoriesDevicePoList = this.$refs.MoreDevicesRef.listDataCopy
+                        this.form.accessoriesDevicePoList = this.$refs.MoreDevicesRef?.[0]?.listDataCopy || this.form.accessoriesDevicePoList || []
                         await this.checkRequired()
                         if (this.isEdit) {
                             this.goEdit(flag)
@@ -1227,6 +1222,23 @@ export default {
             this.loading = true
             this.isEdit = !!(this.params && this.params.id)
             this.isSheKou = this.deptList[0].positionId === '1166372468122714112' // 判断是否是蛇口医院
+            // 加载tab
+            const sql = `select tabs_option_ from t_ipcc where org_ = '${this.org}' limit 1`
+            const { variables: { data: optionData }} = await this.$common.request('sql', sql)
+            if (optionData.length > 0 && optionData?.[0]?.tabs_option_) {
+                const optionArr = optionData[0].tabs_option_.split(',')
+                const newTab = []
+                for (let i = 0; i < optionArr.length; i++) {
+                    const item = optionArr[i]
+                    const t = this.tabItems.find(j => j.label === item)
+                    if (t) {
+                        newTab.push(t)
+                    }
+                }
+                this.tabItems = newTab
+            }
+            console.log('tab', this.tabItems)
+
             if (this.isEdit) {
                 const { data } = await getequipmentCard({ id: this.params.id })
                 this.form = data