vue2-client 1.22.4 → 1.22.6

package/src/pages/userInfoDetailManage/ApplySystemQuery/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div v-if="currUserInfo" class="user-detail-apply">
     <h4 class="user-detail-apply-title">
-      报建系统记录
+      {{ panelTitle }}
       <span v-if="activeSubLabel" class="user-detail-apply-curr">{{ activeSubLabel }}</span>
     </h4>
     <a-tabs
@@ -10,14 +10,14 @@
       :tab-bar-gutter="8"
       @change="changeSubTab"
     >
-      <a-tab-pane v-for="sub in filteredSubTabs" :key="sub.key">
+      <a-tab-pane v-for="sub in subTabs" :key="sub.key">
         <span slot="tab" class="user-detail-apply-sub-tab">
           <a-icon :type="sub.icon" />
           {{ sub.label }}
         </span>
         <template v-if="activeSubKey === sub.key">
           <component
-            :is="sub.component"
+            :is="resolveComponent(sub.component)"
             :currUserInfo="currUserInfo"
           />
         </template>
@@ -27,19 +27,23 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
-import { filterApplySubTabs } from '@vue2-client/pages/userInfoDetailManage/ApplySystemQuery/applySystemConfig'
-import ApplyRecordQuery from '@vue2-client/pages/userInfoDetailManage/ApplyRecordQuery'
-
 export default {
   name: 'ApplySystemQuery',
-  components: {
-    ApplyRecordQuery
+  inject: {
+    resolveUserDetailPanel: { default: null }
   },
   props: {
     currUserInfo: {
       type: Object,
       default: () => undefined
+    },
+    panelTitle: {
+      type: String,
+      default: ''
+    },
+    subTabs: {
+      type: Array,
+      default: () => []
     }
   },
   data () {
@@ -48,7 +52,7 @@ export default {
     }
   },
   watch: {
-    filteredSubTabs: {
+    subTabs: {
       immediate: true,
       handler (tabs) {
         if (!tabs.length) {
@@ -62,16 +66,15 @@ export default {
     }
   },
   computed: {
-    ...mapState('account', { login: 'login' }),
-    filteredSubTabs () {
-      return filterApplySubTabs(this.login)
-    },
     activeSubLabel () {
-      const tab = this.filteredSubTabs.find(item => item.key === this.activeSubKey)
+      const tab = this.subTabs.find(item => item.key === this.activeSubKey)
       return tab?.label || ''
     }
   },
   methods: {
+    resolveComponent (component) {
+      return this.resolveUserDetailPanel ? this.resolveUserDetailPanel(component) : component
+    },
     changeSubTab (key) {
       this.activeSubKey = key
     }

package/src/pages/userInfoDetailManage/ArchiveMaintainQuery/index.vue

@@ -1,15 +1,13 @@
 <template>
   <user-detail-sub-tab-panel
-    title="档案维护记录"
+    :title="panelTitle"
     :currUserInfo="currUserInfo"
     :sub-tabs="subTabs"
     :panel-components="panelComponents"
-    :filter-sub-tabs="filterSubTabs"
   />
 </template>
 
 <script>
-import { mapState } from 'vuex'
 import UserDetailSubTabPanel from '@vue2-client/pages/userInfoDetailManage/UserDetailSubTabPanel'
 import InfoChangeRecordQuery from '@vue2-client/pages/userInfoDetailManage/InfoChangeRecordQuery'
 import UserPriceChangeQuery from '@vue2-client/pages/userInfoDetailManage/UserPriceChangeQuery'
@@ -25,32 +23,20 @@ export default {
     currUserInfo: {
       type: Object,
       default: () => undefined
-    }
-  },
-  data () {
-    return {
-      subTabs: [
-        { key: 'priceChange', label: '调价记录查询', icon: 'rise', component: 'UserPriceChangeQuery' },
-        { key: 'archiveChange', label: '档案变更记录', icon: 'form', component: 'InfoChangeRecordQuery', permission: '变更记录' }
-      ]
+    },
+    panelTitle: {
+      type: String,
+      default: ''
+    },
+    subTabs: {
+      type: Array,
+      default: () => []
     }
   },
   computed: {
-    ...mapState('account', { login: 'login' }),
     panelComponents () {
       return { InfoChangeRecordQuery, UserPriceChangeQuery }
     }
-  },
-  methods: {
-    filterSubTabs (tabs) {
-      const roles = this.login?.r || []
-      return tabs.map(tab => {
-        if (tab.component && tab.permission && !roles.includes(tab.permission)) {
-          return { ...tab, component: null }
-        }
-        return tab
-      })
-    }
   }
 }
 </script>

package/src/pages/userInfoDetailManage/CallSystemQuery/index.vue

@@ -1,15 +1,13 @@
 <template>
   <user-detail-sub-tab-panel
-    title="呼叫系统"
+    :title="panelTitle"
     :currUserInfo="currUserInfo"
     :sub-tabs="subTabs"
     :panel-components="panelComponents"
-    :filter-sub-tabs="filterSubTabs"
   />
 </template>
 
 <script>
-import { mapState } from 'vuex'
 import UserDetailSubTabPanel from '@vue2-client/pages/userInfoDetailManage/UserDetailSubTabPanel'
 import CallRecordQuery from '@vue2-client/pages/userInfoDetailManage/CallRecordQuery'
 import VisitHistoryQuery from '@vue2-client/pages/userInfoDetailManage/VisitHistoryQuery'
@@ -25,35 +23,23 @@ export default {
     currUserInfo: {
       type: Object,
       default: () => undefined
-    }
-  },
-  data () {
-    return {
-      subTabs: [
-        { key: 'phoneRec', label: '电话记录', icon: 'phone', component: 'CallRecordQuery' },
-        { key: 'returnRec', label: '回访记录', icon: 'customer-service', component: 'VisitHistoryQuery' }
-      ]
+    },
+    panelTitle: {
+      type: String,
+      default: ''
+    },
+    subTabs: {
+      type: Array,
+      default: () => []
     }
   },
   computed: {
-    ...mapState('account', { login: 'login' }),
     panelComponents () {
       return {
         CallRecordQuery,
         VisitHistoryQuery
       }
     }
-  },
-  methods: {
-    filterSubTabs (tabs) {
-      const roles = this.login?.r || []
-      return tabs.map(tab => {
-        if (tab.component && tab.permission && !roles.includes(tab.permission)) {
-          return { ...tab, component: null }
-        }
-        return tab
-      })
-    }
   }
 }
 </script>

package/src/pages/userInfoDetailManage/HandplanSystemQuery/index.vue

@@ -2,7 +2,7 @@
   <div v-if="currUserInfo" class="user-detail-handplan">
     <div class="user-detail-handplan-hdr">
       <h4 class="user-detail-handplan-title">
-        抄表系统记录
+        {{ panelTitle }}
         <span v-if="activeSubLabel" class="user-detail-handplan-curr">{{ activeSubLabel }}</span>
       </h4>
       <a-tag
@@ -20,7 +20,7 @@
       :tab-bar-gutter="8"
       @change="changeSubTab"
     >
-      <a-tab-pane v-for="sub in filteredSubTabs" :key="sub.key">
+      <a-tab-pane v-for="sub in subTabs" :key="sub.key">
         <span
           slot="tab"
           class="user-detail-handplan-sub-tab"
@@ -32,7 +32,7 @@
         <template v-if="activeSubKey === sub.key">
           <component
             v-if="sub.component"
-            :is="sub.component"
+            :is="resolveComponent(sub.component)"
             :currUserInfo="currUserInfo"
             :handplanMode="sub.handplanMode"
           />
@@ -46,21 +46,23 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
-import { filterHandplanSubTabs, getDefaultHandplanSubTabKey } from '@vue2-client/pages/userInfoDetailManage/HandplanSystemQuery/handplanSystemConfig'
-import UserHandRecordQuery from '@vue2-client/pages/userInfoDetailManage/UserHandRecordQuery'
-import UserMachineArrearsQuery from '@vue2-client/pages/userInfoDetailManage/UserMachineArrearsQuery'
-
 export default {
   name: 'HandplanSystemQuery',
-  components: {
-    UserHandRecordQuery,
-    UserMachineArrearsQuery
+  inject: {
+    resolveUserDetailPanel: { default: null }
   },
   props: {
     currUserInfo: {
       type: Object,
       default: () => undefined
+    },
+    panelTitle: {
+      type: String,
+      default: ''
+    },
+    subTabs: {
+      type: Array,
+      default: () => []
     }
   },
   data () {
@@ -69,7 +71,7 @@ export default {
     }
   },
   watch: {
-    filteredSubTabs: {
+    subTabs: {
       immediate: true,
       handler (tabs) {
         if (!tabs.length) {
@@ -77,21 +79,17 @@ export default {
         }
         const valid = tabs.some(tab => tab.key === this.activeSubKey)
         if (!valid) {
-          this.activeSubKey = getDefaultHandplanSubTabKey(tabs, this.currUserInfo)
+          this.activeSubKey = this.getDefaultSubTabKey(tabs)
         }
       }
     }
   },
   computed: {
-    ...mapState('account', { login: 'login' }),
-    filteredSubTabs () {
-      return filterHandplanSubTabs(this.login, this.currUserInfo)
-    },
     meterTypeLabel () {
       return this.currUserInfo?.f_meter_type || ''
     },
     activeSubLabel () {
-      const tab = this.filteredSubTabs.find(item => item.key === this.activeSubKey)
+      const tab = this.subTabs.find(item => item.key === this.activeSubKey)
       return tab?.label || ''
     },
     meterTypeTagColor () {
@@ -103,6 +101,22 @@ export default {
     }
   },
   methods: {
+    isMeterTypeMatched (tab) {
+      if (tab?.meterTypeEquals) {
+        return this.currUserInfo?.f_meter_type === tab.meterTypeEquals
+      }
+      if (tab?.meterTypeIncludes) {
+        return this.currUserInfo?.f_meter_type?.includes(tab.meterTypeIncludes)
+      }
+      return false
+    },
+    getDefaultSubTabKey (tabs) {
+      const matched = tabs.find(tab => this.isMeterTypeMatched(tab))
+      return matched?.key || tabs[0]?.key || ''
+    },
+    resolveComponent (component) {
+      return this.resolveUserDetailPanel ? this.resolveUserDetailPanel(component) : component
+    },
     getMeterTypeTagProps () {
       const color = this.meterTypeTagColor
       return color ? { color } : {}

package/src/pages/userInfoDetailManage/RevenueSystemQuery/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div v-if="currUserInfo" class="user-detail-revenue">
     <h4 class="user-detail-revenue-title">
-      营收系统记录
+      {{ panelTitle }}
       <span v-if="activeSubLabel" class="user-detail-revenue-curr">{{ activeSubLabel }}</span>
     </h4>
     <a-tabs
@@ -10,7 +10,7 @@
       :tab-bar-gutter="8"
       @change="changeSubTab"
     >
-      <a-tab-pane v-for="sub in filteredSubTabs" :key="sub.key">
+      <a-tab-pane v-for="sub in subTabs" :key="sub.key">
         <span
           slot="tab"
           class="user-detail-revenue-sub-tab"
@@ -22,7 +22,7 @@
         <template v-if="activeSubKey === sub.key">
           <component
             v-if="sub.component"
-            :is="sub.component"
+            :is="resolveComponent(sub.component)"
             :currUserInfo="currUserInfo"
           />
           <div v-else class="user-detail-revenue-empty">
@@ -35,49 +35,23 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
-import { filterRevenueSubTabs } from '@vue2-client/pages/userInfoDetailManage/RevenueSystemQuery/revenueSystemConfig'
-import UserRecordQuery from '@vue2-client/pages/userInfoDetailManage/UserRecordQuery'
-import UserChargeRecordQuery from '@vue2-client/pages/userInfoDetailManage/UserChargeRecordQuery'
-import FillCardRecordQuery from '@vue2-client/pages/userInfoDetailManage/FillCardRecordQuery'
-import FillGasRecordQuery from '@vue2-client/pages/userInfoDetailManage/FillGasRecordQuery'
-import ChangeMeterRecordQuery from '@vue2-client/pages/userInfoDetailManage/ChangeMeterRecordQuery'
-import OtherChargeRecordQuery from '@vue2-client/pages/userInfoDetailManage/OtherChargeRecordQuery'
-import TransferRecordQuery from '@vue2-client/pages/userInfoDetailManage/TransferRecordQuery'
-import PriceAdjustments from '@vue2-client/pages/userInfoDetailManage/PriceAdjustments'
-import UserException from '@vue2-client/pages/userInfoDetailManage/UserException'
-import InstructRecordQuery from '@vue2-client/pages/userInfoDetailManage/InstructRecordQuery'
-import WatchCollectionRecordQuery from '@vue2-client/pages/userInfoDetailManage/WatchCollectionRecordQuery'
-import UserDisableQuery from '@vue2-client/pages/userInfoDetailManage/UserDisableQuery'
-import UserEnableQuery from '@vue2-client/pages/userInfoDetailManage/UserEnableQuery'
-import UserLimitRecordQuery from '@vue2-client/pages/userInfoDetailManage/UserLimitRecordQuery'
-import UserRefundQuery from '@vue2-client/pages/userInfoDetailManage/UserRefundQuery'
-import UserDiscountRecordQuery from '@vue2-client/pages/userInfoDetailManage/UserDiscountRecordQuery'
-
 export default {
   name: 'RevenueSystemQuery',
-  components: {
-    UserRecordQuery,
-    UserChargeRecordQuery,
-    FillCardRecordQuery,
-    FillGasRecordQuery,
-    ChangeMeterRecordQuery,
-    OtherChargeRecordQuery,
-    TransferRecordQuery,
-    PriceAdjustments,
-    UserException,
-    InstructRecordQuery,
-    WatchCollectionRecordQuery,
-    UserDisableQuery,
-    UserEnableQuery,
-    UserLimitRecordQuery,
-    UserRefundQuery,
-    UserDiscountRecordQuery
+  inject: {
+    resolveUserDetailPanel: { default: null }
   },
   props: {
     currUserInfo: {
       type: Object,
       default: () => undefined
+    },
+    panelTitle: {
+      type: String,
+      default: ''
+    },
+    subTabs: {
+      type: Array,
+      default: () => []
     }
   },
   data () {
@@ -86,7 +60,7 @@ export default {
     }
   },
   watch: {
-    filteredSubTabs: {
+    subTabs: {
       immediate: true,
       handler (tabs) {
         if (!tabs.length) {
@@ -100,16 +74,15 @@ export default {
     }
   },
   computed: {
-    ...mapState('account', { login: 'login' }),
-    filteredSubTabs () {
-      return filterRevenueSubTabs(this.login, this.currUserInfo)
-    },
     activeSubLabel () {
-      const tab = this.filteredSubTabs.find(item => item.key === this.activeSubKey)
+      const tab = this.subTabs.find(item => item.key === this.activeSubKey)
       return tab?.label || ''
     }
   },
   methods: {
+    resolveComponent (component) {
+      return this.resolveUserDetailPanel ? this.resolveUserDetailPanel(component) : component
+    },
     changeSubTab (key) {
       this.activeSubKey = key
     }

package/src/pages/userInfoDetailManage/SafeCheckSystemQuery/index.vue

@@ -1,15 +1,13 @@
 <template>
   <user-detail-sub-tab-panel
-    title="安检系统"
+    :title="panelTitle"
     :currUserInfo="currUserInfo"
     :sub-tabs="subTabs"
     :panel-components="panelComponents"
-    :filter-sub-tabs="filterSubTabs"
   />
 </template>
 
 <script>
-import { mapState } from 'vuex'
 import UserDetailSubTabPanel from '@vue2-client/pages/userInfoDetailManage/UserDetailSubTabPanel'
 import SafeCheckPaperV3RecordQuery from '@vue2-client/pages/userInfoDetailManage/SafeCheckPaperV3RecordQuery'
 import UserDefectDetailQuery from '@vue2-client/pages/userInfoDetailManage/UserDefectDetailQuery'
@@ -25,32 +23,20 @@ export default {
     currUserInfo: {
       type: Object,
       default: () => undefined
-    }
-  },
-  data () {
-    return {
-      subTabs: [
-        { key: 'safetyRec', label: '安检记录', icon: 'check-circle', component: 'SafeCheckPaperV3RecordQuery', permission: '安检查看' },
-        { key: 'hazardRec', label: '隐患记录', icon: 'warning', component: 'UserDefectDetailQuery', permission: '安检查看' }
-      ]
+    },
+    panelTitle: {
+      type: String,
+      default: ''
+    },
+    subTabs: {
+      type: Array,
+      default: () => []
     }
   },
   computed: {
-    ...mapState('account', { login: 'login' }),
     panelComponents () {
       return { SafeCheckPaperV3RecordQuery, UserDefectDetailQuery }
     }
-  },
-  methods: {
-    filterSubTabs (tabs) {
-      const roles = this.login?.r || []
-      return tabs.map(tab => {
-        if (tab.component && tab.permission && !roles.includes(tab.permission)) {
-          return { ...tab, component: null }
-        }
-        return tab
-      })
-    }
   }
 }
 </script>

package/src/pages/userInfoDetailManage/WorkOrderSystemQuery/index.vue

@@ -1,15 +1,13 @@
 <template>
   <user-detail-sub-tab-panel
-    title="工单系统"
+    :title="panelTitle"
     :currUserInfo="currUserInfo"
     :sub-tabs="subTabs"
     :panel-components="panelComponents"
-    :filter-sub-tabs="filterSubTabs"
   />
 </template>
 
 <script>
-import { mapState } from 'vuex'
 import UserDetailSubTabPanel from '@vue2-client/pages/userInfoDetailManage/UserDetailSubTabPanel'
 import TelephoneV3RecordQuery from '@vue2-client/pages/userInfoDetailManage/TelephoneV3RecordQuery'
 
@@ -23,31 +21,20 @@ export default {
     currUserInfo: {
       type: Object,
       default: () => undefined
-    }
-  },
-  data () {
-    return {
-      subTabs: [
-        { key: 'workOrderRec', label: '工单记录', icon: 'copy', component: 'TelephoneV3RecordQuery', permission: '工单查看' }
-      ]
+    },
+    panelTitle: {
+      type: String,
+      default: ''
+    },
+    subTabs: {
+      type: Array,
+      default: () => []
     }
   },
   computed: {
-    ...mapState('account', { login: 'login' }),
     panelComponents () {
       return { TelephoneV3RecordQuery }
     }
-  },
-  methods: {
-    filterSubTabs (tabs) {
-      const roles = this.login?.r || []
-      return tabs.map(tab => {
-        if (tab.component && tab.permission && !roles.includes(tab.permission)) {
-          return { ...tab, component: null }
-        }
-        return tab
-      })
-    }
   }
 }
 </script>

package/src/pages/userInfoDetailManage/index.vue

@@ -26,7 +26,11 @@
                   <a-tag v-if="userStateTag.text" v-bind="getUserStateTagProps()">
                     {{ userStateTag.text }}
                   </a-tag>
-                  <a-tooltip title="刷新">
+                  <a-tooltip
+                    title="刷新"
+                    placement="bottom"
+                    :getPopupContainer="getDrawerTooltipContainer"
+                  >
                     <a-button
                       class="user-detail-refresh"
                       type="default"
@@ -56,7 +60,12 @@
                     <a-icon :type="item.icon" class="user-detail-q-icon" :style="{ color: item.color }" />
                     <div class="user-detail-q-body">
                       <div class="user-detail-q-label">{{ item.label }}</div>
-                      <a-tooltip v-if="item.truncate" :title="item.value">
+                      <a-tooltip
+                        v-if="item.truncate"
+                        :title="item.value"
+                        placement="top"
+                        :getPopupContainer="getDrawerTooltipContainer"
+                      >
                         <div class="user-detail-q-val user-detail-q-ellipsis">{{ item.value }}</div>
                       </a-tooltip>
                       <div v-else class="user-detail-q-val">{{ item.value }}</div>
@@ -290,6 +299,9 @@ export default {
     }
   },
   methods: {
+    getDrawerTooltipContainer (triggerNode) {
+      return triggerNode?.parentNode || document.body
+    },
     checkOperateReason () {
       if (this.operateReason.trim() === '') {
         this.operateReasonError = true