vue2-client 1.17.15 → 1.17.18

package/src/base-client/components/common/XTab/XTab.vue

@@ -12,12 +12,13 @@
       </template>
       <slot name="extraBeforeTabs"></slot>
       <a-tab-pane
-        :forceRender="true"
         v-for="(tab, index) in config.data"
         :key="index"
         :tab="tab.title"
+        :forceRender="isTabLoaded(index)"
       >
         <component
+          v-if="isTabLoaded(index)"
           :is="tab.slotType"
           :key="'xTabPaneComp' + index"
           :ref="`tab_com_${tab.slotType}_${index}`"
@@ -51,18 +52,22 @@ export default {
     XReportGrid: () => import('@vue2-client/base-client/components/common/XReportGrid/XReport.vue')
   },
   inject: {
-      isInAModal: { default: false },
-      getSelectedId: { default: false },
-      getSelectedData: { default: false },
-      getOutEnv: { default: false },
-      setGlobalData: { default: false },
-      getGlobalData: { default: false },
-      generalFunction: { default: false },
-    },
+    isInAModal: { default: false },
+    getSelectedId: { default: false },
+    getSelectedData: { default: false },
+    getOutEnv: { default: false },
+    setGlobalData: { default: false },
+    getGlobalData: { default: false },
+    generalFunction: { default: false },
+  },
   provide () {
     return {
       currUser: this.currUser,
-      getSelectedId: this.getSelectedId
+      getSelectedId: this.getSelectedId,
+      // 暴露页签加载相关方法，供子组件调用
+      ensureTabLoaded: this.ensureTabLoaded,
+      getTabComponent: this.getTabComponent,
+      isTabLoaded: this.isTabLoaded
     }
   },
   data () {
@@ -72,7 +77,8 @@ export default {
       config: undefined,
       tabBarExtraContent: undefined,
       attr: {},
-      showTabBar: true // 默认显示页签
+      showTabBar: true, // 默认显示页签
+      loadedTabs: [] // 记录已加载的页签索引
     }
   },
   computed: {
@@ -80,6 +86,8 @@ export default {
   },
   mounted () {
     this.activeKey = this.defaultActiveKey
+    // 标记默认激活的页签为已加载
+    this.markTabAsLoaded(this.defaultActiveKey)
     this.tabPaneChange('initTabLoading', true)
   },
   methods: {
@@ -92,17 +100,25 @@ export default {
     getRealKeyData,
     getConfigByName,
     getConfigByNameAsync,
-    tabPaneChange (newKey, initStatus = false) {
+    async tabPaneChange (newKey, initStatus = false) {
       let result = {}
       if (this.activeKey === newKey) {
         return
       }
+
       const oldKey = this.activeKey
+
+      // 标记新页签为已加载
+      if (this.config && this.config.data && this.config.data[newKey] !== undefined) {
+        this.markTabAsLoaded(newKey)
+      }
+
       if (this.config && this.config.changeFunc) {
         let oldRef
         let oldTabName
         let newRef
         let newTabName
+
         if (!this.config.data[oldKey]) {
           oldTabName = `tab_com_${oldKey}`
           oldRef = this.$refs[oldTabName]
@@ -111,6 +127,7 @@ export default {
           oldTabName = `tab_com_${oldTabSlotType}_${oldKey}`
           oldRef = this.$refs[oldTabName]
         }
+
         if (!this.config.data[newKey]) {
           newTabName = `tab_com_${newKey}`
           newRef = this.$refs[newTabName]
@@ -119,6 +136,7 @@ export default {
           newTabName = `tab_com_${newTabSlotType}_${newKey}`
           newRef = this.$refs[newTabName]
         }
+
         const args = [
           oldKey,
           newKey,
@@ -127,56 +145,75 @@ export default {
           oldRef ? oldRef[0] : undefined,
         ]
         args.push(newTabName)
-        if (!newRef) {
-          args.push(null)
-          console.warn('新页签示例切换页签时暂未初始化，仅调用该页签初始化方法不调用切换函数')
-        } else {
+
+        // 关键修改：确保新组件实例存在
+        if (!newRef || !newRef[0]) {
+          console.log('等待新页签组件初始化...')
+          // 等待组件挂载完成
+          await this.waitForComponentReady(newKey)
+          newRef = this.$refs[newTabName]
+        }
+
+        if (newRef && newRef[0]) {
           args.push(newRef[0])
+        } else {
+          args.push(null)
+          console.warn('新页签组件实例获取失败')
         }
+
         args.push(this.extraData)
+
+        // 使用 $nextTick 确保 DOM 更新完成
+        await this.$nextTick()
+
         result = executeStrFunctionByContext(this, this.config.changeFunc, args)
+
         if (result && result.noChange) {
           console.info('不切换页签作为按钮使用')
         } else {
           this.activeKey = newKey
+          // 确保回调在组件完全就绪后执行
           if (result && result.callback && typeof result.callback === 'function') {
-            // 使用 $nextTick 等待 DOM 更新完成后再获取组件实例
-            this.$nextTick(() => {
-              const newComponent = newRef
-              if (!newComponent || !newComponent[0]) {
-                console.warn('组件实例尚未创建，等待组件mounted事件')
-                // 使用 MutationObserver 监听DOM变化
-                const observer = new MutationObserver((mutations, obs) => {
-                  const newComp = newRef
-                  if (newComp && newComp[0]) {
-                    obs.disconnect()
-                    console.log('组件已创建，执行回调')
-                    result.callback()
-                  }
-                })
-                observer.observe(this.$el, {
-                  childList: true,
-                  subtree: true
-                })
-                // 设置超时，避免无限等待
-                setTimeout(() => {
-                  observer.disconnect()
-                  console.warn('等待组件创建超时')
-                }, 500)
-
-                return
-              }
-              result.callback()
-            })
+            await this.$nextTick()
+            result.callback()
           }
         }
       } else {
         this.activeKey = newKey
       }
+
       if (initStatus) {
         this.activeKey = this.defaultActiveKey
       }
     },
+
+// 新增：等待组件就绪的方法
+    waitForComponentReady (index) {
+      return new Promise((resolve) => {
+        const checkComponent = () => {
+          const tab = this.config.data[index]
+          const refName = `tab_com_${tab.slotType}_${index}`
+          const ref = this.$refs[refName]
+
+          if (ref && ref[0]) {
+            // 额外检查组件内部是否已初始化（如果有相关状态的话）
+            if (ref[0].isReady !== undefined) {
+              if (ref[0].isReady) {
+                resolve(ref[0])
+              } else {
+                setTimeout(checkComponent, 50)
+              }
+            } else {
+              resolve(ref[0])
+            }
+          } else {
+            setTimeout(checkComponent, 50)
+          }
+        }
+
+        checkComponent()
+      })
+    },
     initConfig () {
       if (this.configName) {
         this.getConfig()
@@ -185,12 +222,22 @@ export default {
         // 设置是否显示页签
         this.showTabBar = this.localConfig.showTabBar !== false
       }
+      // 重置已加载页签集合，确保配置变更后重新加载
+      this.loadedTabs = []
+      // 标记默认激活的页签为已加载
+      if (this.config && this.config.data) {
+        this.markTabAsLoaded(this.defaultActiveKey)
+      }
     },
     getConfig () {
       getConfigByName(this.configName, this.serverName, res => {
         this.config = res
         // 设置是否显示页签
         this.showTabBar = res.showTabBar !== false
+        // 标记默认激活的页签为已加载
+        if (this.config && this.config.data) {
+          this.markTabAsLoaded(this.defaultActiveKey)
+        }
       }, this.env === 'dev')
     },
     getEventHandlers (tab, index) {
@@ -237,6 +284,158 @@ export default {
         }, this.env === 'dev')
       }
     },
+    // 判断页签是否已加载
+    isTabLoaded (index) {
+      const numIndex = Number(index)
+      return this.loadedTabs.includes(numIndex) || Number(this.activeKey) === numIndex
+    },
+    // 标记页签为已加载
+    markTabAsLoaded (index) {
+      const numIndex = Number(index)
+      // 确保是有效的数字索引，且未添加过
+      if (!isNaN(numIndex) && numIndex >= 0 && !this.loadedTabs.includes(numIndex)) {
+        this.loadedTabs.push(numIndex)
+      }
+    },
+    // 确保页签已加载，如果未加载则先加载，返回 Promise 等待组件渲染完成
+    ensureTabLoaded (index, options = {}) {
+      return new Promise((resolve, reject) => {
+        const numIndex = Number(index)
+        const innerRefs = Array.isArray(options.innerRefs) ? options.innerRefs : []
+        const allowSwitch = options.allowSwitch !== false
+        // 验证索引有效性
+        if (isNaN(numIndex) || numIndex < 0) {
+          reject(new Error(`无效的页签索引: ${index}`))
+          return
+        }
+        if (!this.config || !this.config.data || !this.config.data[numIndex]) {
+          reject(new Error(`页签索引 ${index} 不存在`))
+          return
+        }
+        // 如果已经加载，直接返回组件实例
+        if (this.isTabLoaded(numIndex)) {
+          const component = this.getTabComponent(numIndex)
+          if (component) {
+            if (innerRefs.length === 0) {
+              resolve(component)
+            } else {
+              this.waitForInnerRefs(component, innerRefs, resolve, reject)
+            }
+          } else {
+            // 已标记但组件可能还在渲染中，等待一下
+            this.$nextTick(() => {
+              const comp = this.getTabComponent(numIndex)
+              if (comp) {
+                if (innerRefs.length === 0) {
+                  resolve(comp)
+                } else {
+                  this.waitForInnerRefs(comp, innerRefs, resolve, reject)
+                }
+              } else {
+                // 等待组件mounted
+                this.waitForComponent(numIndex, (c) => {
+                  if (innerRefs.length === 0) {
+                    resolve(c)
+                  } else {
+                    this.waitForInnerRefs(c, innerRefs, resolve, reject)
+                  }
+                }, reject)
+              }
+            })
+          }
+          return
+        }
+        // 标记为已加载，触发渲染
+        this.markTabAsLoaded(numIndex)
+        // 优先尝试在不切换页签的情况下获取组件
+        this.$nextTick(() => {
+          const comp = this.getTabComponent(numIndex)
+          if (comp) {
+            if (innerRefs.length === 0) resolve(comp)
+            else this.waitForInnerRefs(comp, innerRefs, resolve, reject)
+            return
+          }
+          // 若仍未渲染，且允许临时切换，则进行一次激活-恢复回退
+          if (!allowSwitch) {
+            // 不允许切换则进入常规等待（可能更慢）
+            this.waitForComponent(numIndex, (c) => {
+              if (innerRefs.length === 0) resolve(c)
+              else this.waitForInnerRefs(c, innerRefs, resolve, reject)
+            }, reject)
+            return
+          }
+          const prevActive = this.activeKey
+          this.activeKey = numIndex
+          this.$nextTick(() => {
+            this.waitForComponent(numIndex, (c) => {
+              // 组件到位后再恢复原激活页签
+              if (prevActive !== numIndex) {
+                this.$nextTick(() => { this.activeKey = prevActive })
+              }
+              if (innerRefs.length === 0) resolve(c)
+              else this.waitForInnerRefs(c, innerRefs, resolve, reject)
+            }, reject)
+          })
+        })
+      })
+    },
+    // 等待组件渲染完成
+    waitForComponent (index, resolve, reject) {
+      const maxAttempts = 50 // 最多尝试50次
+      let attempts = 0
+      const checkInterval = 50 // 每50ms检查一次
+      const tab = this.config.data[index]
+      const refName = `tab_com_${tab.slotType}_${index}`
+      const checkComponent = () => {
+        attempts++
+        const component = this.$refs[refName]
+        if (component && component[0]) {
+          resolve(component[0])
+          return
+        }
+        if (attempts >= maxAttempts) {
+          reject(new Error(`等待页签 ${index} 组件加载超时`))
+          return
+        }
+        setTimeout(checkComponent, checkInterval)
+      }
+      // 首次检查
+      this.$nextTick(() => {
+        checkComponent()
+      })
+    },
+    // 等待内部 $refs 就绪
+    waitForInnerRefs (component, innerRefs, resolve, reject) {
+      const maxAttempts = 50
+      let attempts = 0
+      const checkInterval = 50
+      const allReady = () => innerRefs.every(name => component.$refs && component.$refs[name])
+      const check = () => {
+        attempts++
+        if (allReady()) {
+          resolve(component)
+          return
+        }
+        if (attempts >= maxAttempts) {
+          reject(new Error(`等待内部 refs [${innerRefs.join(', ')}] 就绪超时`))
+          return
+        }
+        setTimeout(check, checkInterval)
+      }
+      this.$nextTick(() => check())
+    },
+    // 获取页签的组件实例
+    getTabComponent (index) {
+      const numIndex = Number(index)
+      if (isNaN(numIndex) || numIndex < 0 || !this.config || !this.config.data || !this.config.data[numIndex]) {
+        return null
+      }
+      const tab = this.config.data[numIndex]
+      const refName = `tab_com_${tab.slotType}_${numIndex}`
+      const ref = this.$refs[refName]
+      return ref && ref[0] ? ref[0] : null
+    },
+
   },
   props: {
     // 配置名

package/src/components/FileImageItem/ImageItem.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <!-- 图片 -->
-    <span v-for="img in images" :key="img.id" class="picture-card" :style="{ width: cardSize, height: cardSize }">
+    <span v-for="img in images" :key="img.id" class="picture-card" :style="{ width: cardSize, height: cardSize, padding: paddingSize }">
       <img :src="img.url" :alt="img.name" />
       <span class="picture-action" :style="{ width: actionSize, height: actionSize }">
         <a-icon type="eye" class="picture-preview-icon" @click="handlePreview(img.url)" />
@@ -38,6 +38,10 @@ export default {
     width: {
       type: Number,
       default: 150
+    },
+    padding: {
+      type: Number,
+      default: 10
     }
   },
   data () {
@@ -52,6 +56,13 @@ export default {
     },
     actionSize: function () {
       return this.width - 22 + 'px'
+    },
+    paddingSize: function () {
+      if (Number(this.padding) === 0) {
+        return 0
+      } else {
+        return this.padding + 'px'
+      }
     }
   },
   methods: {
@@ -73,7 +84,7 @@ export default {
   display: inline-block;
   border: 1px solid #d9d9d9;
   border-radius: 6px;
-  padding: 10px;
+  //padding: 10px;
   margin: 0 10px 10px 0;
   overflow: hidden;
   img {

package/src/pages/WorkflowDetail/WorkFlowDemo.vue

@@ -6,7 +6,7 @@ export default {
   components: { WorkflowDetail },
   mounted () {
     this.$refs.workFlow.init({
-      workflowId: '3024'
+      workflowId: 4454
     })
   },
   methods: {

package/src/pages/WorkflowDetail/WorkflowPageDetail/WorkFlowHandle.vue

@@ -1083,6 +1083,14 @@ export default {
               continue
             }
             let value = dataObj[key]
+            // 如果字段类型是图片，获取图片的url
+            if (stepDefine.type === 'image' && Array.isArray(value) && value.length > 0) {
+              const urls = await postByServiceName(workFlowViewApi.getFilesUrlByIds, {
+                ids: `(${value.map(id => Number(id)).join(',')})`
+              })
+              formDataArr.push({ label: stepDefine.name, value: urls.urls, type: 'image' })
+              continue
+            }
             // 字典值处理
             if (stepDefine.formType === 'select' && stepDefine.selectType === 'key') {
               const dictList = this.$appdata.getDictionaryList(stepDefine.selectKey)

package/src/pages/WorkflowDetail/WorkflowPageDetail/WorkFlowPreview.vue

@@ -27,7 +27,14 @@
             v-show="item.label !== '附件上传' && item.label !== '__expressionRs'"
           >
             <span slot="label" style="color: #000">{{ item.label }}</span>
-            <div style="white-space: pre-wrap">{{ item.value }}</div>
+            <span v-if="(item.type ?? 'default') === 'image'">
+              <div style="white-space: pre-wrap">
+                <image-item :images="item.value" :width="70" :padding="0"/>
+              </div>
+            </span>
+            <span v-else>
+              <div style="white-space: pre-wrap">{{ item.value }}</div>
+            </span>
           </a-descriptions-item>
         </template>
       </a-descriptions>

package/src/router/async/router.map.js

@@ -53,9 +53,9 @@ routerResource.newDynamicStatistics = () => import('@vue2-client/pages/NewDynami
 routerResource.example = {
 path: 'example',
   name: '示例主页面',
-  // component: () => import('@vue2-client/pages/WorkflowDetail/WorkFlowDemo2.vue'),
-  // component: () => import('@vue2-client/base-client/components/common/XFormTable/demo.vue'),
   component: () => import('@vue2-client/pages/WorkflowDetail/WorkFlowDemo.vue'),
+  // component: () => import('@vue2-client/base-client/components/common/XFormTable/demo.vue'),
+  // component: () => import('@vue2-client/pages/WorkflowDetail/WorkFlowDemo.vue'),
   // component: () => import('@vue2-client/pages/addressSelect/addressDemo.vue'),
   // component: () => import('@vue2-client/base-client/components/common/XDescriptions/demo.vue'),
   // component: () => import('@vue2-client/base-client/components/common/XAddNativeForm/demo.vue'),

package/src/services/api/workFlow.js

@@ -52,6 +52,8 @@ const workFlowViewApi = {
   submitToNextStep: '/logic/submitToNextStep',
   // 获取指定工作流的附件列表
   getWorkFlowAttachments: '/logic/getWorkFlowAttachments',
+  // 根据文件id数组获取文件url
+  getFilesUrlByIds: '/logic/getFilesUrlByIds'
 }
 
 export { workFlowViewApi }

package/src/utils/map-utils.js

@@ -1,47 +1,47 @@
-import AMapLoader from '@amap/amap-jsapi-loader'
-let Amap
-async function GetGDMap (secretKey, key) {
-  if (!Amap) {
-    window._AMapSecurityConfig = {
-      securityJsCode: secretKey
-    }
-    //  解决高德地图加载报错 ---> 禁止多种API加载方式混用
-    AMapLoader.reset()
-    Amap = await AMapLoader.load({
-      key: key, // 申请好的Web端开发者Key，首次调用 load 时必填
-      version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
-      plugins: ['AMap.IndexCluster', 'AMP.MarkerCluster', 'AMap.InfoWindow', 'AMap.HeatMap', 'AMap.HawkEye', 'AMap.DistrictSearch',
-        'AMap.ToolBar', 'AMap.Geolocation', 'AMap.MouseTool',
-        'AMap.Geocoder', 'AMap.MarkerClusterer', 'AMap.AutoComplete', 'AMap.Scale'], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
-      AMapUI: {
-        version: '1.1', // AMapUI 缺省 1.1
-        plugins: ['misc/PositionPicker'] // 需要加载的 AMapUI ui插件
-      }
-    })
-  }
-  return Amap
-}
-
-async function getGDMap (address) {
-  new (await GetGDMap()).Geocoder({
-    radius: 500 // 范围，默认：500
-  }).getLocation(address, function (status, result) {
-    if (status === 'complete' && result.geocodes.length) {
-      return ({ lng: result.geocodes[0].location.lng, lat: result.geocodes[0].location.lat })
-    } else {
-      // eslint-disable-next-line prefer-promise-reject-errors
-      throw new Error('根据经纬度查询地址失败')
-    }
-  })
-}
-
-async function GetLocation (address) {
-  return new Promise((resolve, reject) => {
-    try {
-      resolve(getGDMap(address))
-    } catch (e) {
-      reject(e)
-    }
-  })
-}
-export { GetGDMap, GetLocation }
+import AMapLoader from '@amap/amap-jsapi-loader'
+let Amap
+async function GetGDMap (secretKey, key) {
+  if (!Amap) {
+    window._AMapSecurityConfig = {
+      securityJsCode: secretKey
+    }
+    //  解决高德地图加载报错 ---> 禁止多种API加载方式混用
+    AMapLoader.reset()
+    Amap = await AMapLoader.load({
+      key: key, // 申请好的Web端开发者Key，首次调用 load 时必填
+      version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+      plugins: ['AMap.IndexCluster', 'AMP.MarkerCluster', 'AMap.InfoWindow', 'AMap.HeatMap', 'AMap.HawkEye', 'AMap.DistrictSearch',
+        'AMap.ToolBar', 'AMap.Geolocation', 'AMap.MouseTool',
+        'AMap.Geocoder', 'AMap.MarkerClusterer', 'AMap.AutoComplete', 'AMap.Scale'], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
+      AMapUI: {
+        version: '1.1', // AMapUI 缺省 1.1
+        plugins: ['misc/PositionPicker'] // 需要加载的 AMapUI ui插件
+      }
+    })
+  }
+  return Amap
+}
+
+async function getGDMap (address) {
+  new (await GetGDMap()).Geocoder({
+    radius: 500 // 范围，默认：500
+  }).getLocation(address, function (status, result) {
+    if (status === 'complete' && result.geocodes.length) {
+      return ({ lng: result.geocodes[0].location.lng, lat: result.geocodes[0].location.lat })
+    } else {
+      // eslint-disable-next-line prefer-promise-reject-errors
+      throw new Error('根据经纬度查询地址失败')
+    }
+  })
+}
+
+async function GetLocation (address) {
+  return new Promise((resolve, reject) => {
+    try {
+      resolve(getGDMap(address))
+    } catch (e) {
+      reject(e)
+    }
+  })
+}
+export { GetGDMap, GetLocation }

package/vue.config.js

@@ -47,6 +47,21 @@ module.exports = {
         target: v3Server,
         changeOrigin: true
       },
+      '/resource': {
+        // pathRewrite: { '^/resource': '/' },
+        target: revenue,
+        changeOrigin: true
+      },
+      '/api/af-linepatrol/': {
+        pathRewrite: { '^/api/af-linepatrol/': '/' },
+        target: 'http://127.0.0.1:9012',
+        changeOrigin: true
+      },
+      '/api/linepatrol/': {
+        pathRewrite: { '^/api/linepatrol/': '/' },
+        target: 'http://127.0.0.1:9012',
+        changeOrigin: true
+      },
       // '/api/af-system/resource': {
       //   pathRewrite: { '^/api/af-system': '/' },
       //   target: testUpload,
@@ -57,11 +72,11 @@ module.exports = {
         target: revenue,
         changeOrigin: true
       },
-      // '/api/af-telephone': {
-      //   pathRewrite: { '^/api/af-telephone': '/' },
-      //   target: 'http://127.0.0.1:9033',
-      //   changeOrigin: true
-      // },
+      '/api/af-apply': {
+        // pathRewrite: { '^/api/af-apply': '/' },
+        target: revenue,
+        changeOrigin: true
+      },
       '/api/af-scada': {
         target: revenue,
         changeOrigin: true
@@ -103,11 +118,6 @@ module.exports = {
         target: revenue,
         changeOrigin: true
       },
-      '/resource': {
-        // pathRewrite: { '^/resource': '/' },
-        target: revenue,
-        changeOrigin: true
-      },
       '/ai': {
         target: 'http://192.168.50.67:31761',
         pathRewrite: { '^/ai': '/' },