vue2-client 1.16.31 → 1.16.33

package/src/base-client/components/common/XTable/XTableWrapper.vue

@@ -211,7 +211,16 @@
         <ellipsis :length="item.slotValue" tooltip>{{ text === '' ? '--' : text }}</ellipsis>
       </span>
       <span v-else-if="item.slotType === 'progress'" :key="'progress-' + c_index">
-        <a-progress :percent="text" status="active" style="padding-right: 20px;" />
+        <!-- websocket-id (配置名称-字段名称-用户id-页码-数据行id) -->
+        <x-web-socket-progress
+          v-if="item.webSocket"
+          :key="`${tableContext.requestParameters?.pageNo || 1}-${item.dataIndex}-${record[tableContext.rowKey] || index}`"
+          :websocket-id="`${queryParamsName}-${item.dataIndex}-${currUser.id}-${tableContext.requestParameters?.pageNo || 1}-${record[tableContext.rowKey] || index}`"
+          :initial-value="text || 0"
+          @progress-updated="(data) => handleProgressUpdated(data, record, item.dataIndex)"
+        />
+        <!-- 表格进度组件 -->
+        <a-progress v-else :percent="text" status="active" style="padding-right: 20px;" />
       </span>
       <span v-else-if="item.slotType === 'badge'" :key="'badge-' + c_index">
         <x-badge
@@ -277,7 +286,9 @@ import XFormItem from '@vue2-client/base-client/components/common/XForm/XFormIte
 import CustomFuncCel from '@vue2-client/base-client/components/common/XTable/CustomFuncCel.vue'
 import { executeStrFunctionByContext } from '@vue2-client/utils/runEvalFunction'
 import XRate from '@vue2-client/base-client/components/common/XRate/index.vue'
+import XWebSocketProgress from '@vue2-client/base-client/components/common/XWebSocketProgress'
 import VueDraggableResizable from 'vue-draggable-resizable'
+import { mapState } from 'vuex'
 
 export default {
   name: 'XTableWrapper',
@@ -288,6 +299,7 @@ export default {
     XFormItem,
     XRate,
     CustomFuncCel,
+    XWebSocketProgress,
     VueDraggableResizable
   },
   data () {
@@ -298,6 +310,7 @@ export default {
     }
   },
   computed: {
+    ...mapState('account', { currUser: 'user' }),
     localDataSource () {
       return this.activeTable?.localDataSource
     },
@@ -426,6 +439,13 @@ export default {
     }
   },
   props: {
+    // 查询配置文件名
+    queryParamsName: {
+      type: String,
+      default: () => {
+        return ''
+      }
+    },
     loadSelectedData: {
       type: Boolean,
       required: false,
@@ -547,7 +567,20 @@ export default {
     },
     handleResizeColumn (w, col) {
       col.width = w
-    }
+    },
+
+    /**
+     * 处理进度更新事件
+     * @param {Object} data 进度数据
+     * @param {Object} record 行数据
+     * @param {String} dataIndex 列字段名
+     */
+    handleProgressUpdated (data, record, dataIndex) {
+      // 更新行数据中的进度值
+      if (record && dataIndex) {
+        this.$set(record, dataIndex, data.value)
+      }
+    },
   }
 }
 </script>

package/src/base-client/components/common/XWebSocketProgress/README.md

@@ -0,0 +1,14 @@
+发生sendMessage请求
+```json
+{
+  "event": "16", // 进度数据, 取值 0~100
+  "userList": [
+    "ceshiCRUD-t_f_operator_id-419879409793761282-1-18",// 数据webSocket 唯一标识 (配置名称-字段名称-用户id-页码-数据行id)
+    "ceshiCRUD-t_f_type-419879409793761282-1-18",
+    "ceshiCRUD-t_f_type-419879409793761282-1-19",
+    "ceshiCRUD-t_f_type-419879409793761282-1-20",
+    "ceshiCRUD-t_f_operator_id-419879409793761282-1-21",
+    "ceshiCRUD-t_f_operator_id-419879409793761282-1-22"
+  ]
+}
+```

package/src/base-client/components/common/XWebSocketProgress/index.vue

@@ -0,0 +1,252 @@
+<template>
+  <div class="websocket-progress">
+    <a-progress
+      :percent="progressValue"
+      status="active"
+      style="padding-right: 20px;" />
+
+    <!-- 连接状态指示 -->
+    <div class="connection-status">
+      <a-tooltip :title="connectionStatusText">
+        <a-badge
+          :status="connectionBadgeStatus"
+          :text="connectionStatusText"
+        />
+      </a-tooltip>
+    </div>
+  </div>
+</template>
+
+<script>
+import { useWebSocket } from '@vue2-client/utils/websocket/websocket'
+
+export default {
+  name: 'XWebSocketProgress',
+  components: {
+  },
+  props: {
+    // WebSocket 唯一标识
+    websocketId: {
+      type: String,
+      required: true,
+    },
+    // 初始进度值
+    initialValue: {
+      type: Number,
+      default: 0
+    },
+    // 自动重连
+    autoReconnect: {
+      type: Boolean,
+      default: true
+    },
+    // 重连间隔（毫秒）
+    reconnectInterval: {
+      type: Number,
+      default: 3000
+    },
+    // 最大重连次数
+    maxReconnectAttempts: {
+      type: Number,
+      default: 1
+    },
+  },
+  data () {
+    return {
+      progressValue: this.initialValue,
+      connectionState: {
+        isConnected: false,
+        reconnectAttempts: 0
+      },
+      websocketUrl: '',
+    }
+  },
+  computed: {
+    // 连接状态文本
+    connectionStatusText () {
+      if (this.connectionState.isConnected) {
+        return '已连接'
+      } else if (this.connectionState.reconnectAttempts > 0) {
+        return `重连中 (${this.connectionState.reconnectAttempts})`
+      } else {
+        return '未连接'
+      }
+    },
+
+    // 连接状态徽章状态
+    connectionBadgeStatus () {
+      if (this.connectionState.isConnected) {
+        return 'success'
+      } else if (this.connectionState.reconnectAttempts > 0) {
+        return 'processing'
+      } else {
+        return 'default'
+      }
+    }
+  },
+  mounted () {
+    this.initWebSocket()
+  },
+  beforeDestroy () {
+    this.cleanup()
+  },
+  watch: {
+    // 初始值变更时重置当前进度显示
+    initialValue (val) {
+      const num = parseFloat(val)
+      this.progressValue = isNaN(num) ? 0 : Math.max(0, Math.min(100, num))
+    },
+    // 标识变更时，断开旧连接并按新标识重连
+    websocketId (newId, oldId) {
+      if (newId === oldId) return
+      this.cleanup()
+      // 重置进度为新的初始值，确保界面先渲染初始值
+      const num = parseFloat(this.initialValue)
+      this.progressValue = isNaN(num) ? 0 : Math.max(0, Math.min(100, num))
+      // 重新建立连接
+      this.$nextTick(() => {
+        this.initWebSocket()
+      })
+    }
+  },
+  methods: {
+    /**
+     * 初始化 WebSocket
+     */
+    initWebSocket () {
+      if (!this.websocketId) {
+        return
+      }
+
+      this.websocketUrl = `ws:${window.location.host}/socket/af-system/sendMessage?userId=${this.websocketId}`
+
+      const wsOptions = {
+        autoReconnect: this.autoReconnect,
+        reconnectInterval: this.reconnectInterval,
+        maxReconnectAttempts: this.maxReconnectAttempts
+      }
+
+      // 使用 WebSocket 工具
+      const wsManager = useWebSocket(wsOptions)
+
+      // 保存方法引用
+      this.wsConnect = wsManager.connect
+      this.wsDisconnect = wsManager.disconnect
+      this.wsOn = wsManager.on
+      // 绑定事件监听器
+      this.setupEventListeners()
+
+      // 开始连接
+      this.wsConnect(this.websocketUrl, wsOptions)
+    },
+    /**
+     * 手动重置为初始值（供父组件可选调用）
+     */
+    resetToInitial () {
+      const num = parseFloat(this.initialValue)
+      this.progressValue = isNaN(num) ? 0 : Math.max(0, Math.min(100, num))
+    },
+
+    /**
+     * 设置事件监听器
+     */
+    setupEventListeners () {
+      // 连接成功
+      this.wsOn('connected', (data) => {
+        this.connectionState.isConnected = true
+        this.connectionState.reconnectAttempts = 0
+        this.$emit('websocket-connected', data)
+      })
+
+      // 连接中
+      this.wsOn('connecting', (data) => {
+        this.$emit('websocket-connecting', data)
+      })
+
+      // 消息接收
+      this.wsOn('message', (data) => {
+        this.handleWebSocketMessage(data)
+        this.$emit('websocket-message', data)
+      })
+
+      // 连接关闭
+      this.wsOn('closed', (data) => {
+        this.connectionState.isConnected = false
+        this.$emit('websocket-closed', data)
+      })
+
+      // 连接错误
+      this.wsOn('error', (data) => {
+        this.connectionState.isConnected = false
+        this.$emit('websocket-error', data)
+      })
+
+      // 重连中
+      this.wsOn('reconnecting', (data) => {
+        this.connectionState.reconnectAttempts = data.attempts
+        this.$emit('websocket-reconnecting', data)
+      })
+
+      // 重连失败
+      this.wsOn('reconnect-failed', (data) => {
+        this.connectionState.reconnectAttempts = data.attempts
+        this.$emit('websocket-reconnect-failed', data)
+      })
+
+      // 断开连接
+      this.wsOn('disconnected', (data) => {
+        this.connectionState.isConnected = false
+        this.connectionState.reconnectAttempts = 0
+        this.$emit('websocket-disconnected', data)
+      })
+    },
+
+    /**
+     * 处理 WebSocket 消息
+     * @param {Object} data 消息数据
+     */
+    handleWebSocketMessage (data) {
+      const messageData = data.data
+
+      // 更新进度值
+      this.updateProgress(parseFloat(messageData))
+    },
+
+    /**
+     * 更新进度值
+     * @param {number} value 进度值
+     */
+    updateProgress (value) {
+      const numValue = parseFloat(value)
+      if (!isNaN(numValue)) {
+        this.progressValue = Math.max(0, Math.min(100, numValue))
+        this.$emit('progress-updated', {
+          value: this.progressValue,
+          originalValue: value
+        })
+      }
+    },
+
+    /**
+     * 清理资源
+     */
+    cleanup () {
+      if (this.wsDisconnect) {
+        this.wsDisconnect()
+      }
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.websocket-progress {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+
+  .connection-status {
+    flex-shrink: 0;
+  }
+}
+</style>

package/src/base-client/components/his/XHisEditor/XHisEditor.vue

@@ -19,6 +19,7 @@
               <!--              </template>-->
             </template>
             <a-radio-group
+              class="custom-radio-group"
               v-show="showModeChoose"
               button-style="solid"
               @change="changeMode"
@@ -29,7 +30,7 @@
             </a-radio-group>
           </a-space>
         </a-col>
-        <a-col class="editor-action">
+        <a-col class="editor-action-button">
           <a-space>
             <template v-if="this.modeType !== 'readonly'">
               <!--              <a-button-->
@@ -649,6 +650,11 @@ export default {
 .editor-action-container {
   height: 40px;
 }
+.editor-action-button {
+  .ant-btn-primary {
+    background-color: rgb(0, 87, 254) !important;
+  }
+}
 :deep(.ant-divider-horizontal) {
   margin: 4px 0;
 }
@@ -691,4 +697,9 @@ export default {
   font-size: 12px;
   margin: 0 !important;
 }
+.custom-radio-group {
+  .ant-radio-button-wrapper-checked {
+    background-color: rgb(0, 87, 254) !important;
+  }
+}
 </style>

package/src/base-client/components/his/threeTestOrders/editor.vue

@@ -87,6 +87,8 @@ const onIframeLoad = (e) => {
     console.error('无法访问 iframe 内容')
     return
   }
+  // 关闭文书工具栏
+  iframe.contentWindow.editor.option.toolbar = false
   startEditorCheck(frameWindow, iframe)
 }
 // 组件销毁前清理

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 }