From 5d86f4dcec5c6041093fa36a4fdd497c07fea8a0 Mon Sep 17 00:00:00 2001
From: zhanghao <774378400@qq.com>
Date: Tue, 25 Nov 2025 15:56:18 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=BD=A6=E6=9C=BA=E5=8A=9F=E8=83=BD?=
 =?UTF-8?q?=E5=92=8C=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.production                             |  3 +
 src/views/is/im/Table/FunctionSelection.vue | 67 ++++++++++++++-------
 2 files changed, 49 insertions(+), 21 deletions(-)

diff --git a/.env.production b/.env.production
index 8772b3a..9c2c339 100644
--- a/.env.production
+++ b/.env.production
@@ -12,3 +12,6 @@ VITE_BUILD_COMPRESS = gzip
 
 #node-red  服务地址
 VITE_NODE_RED_URL = 'http://10.148.108.59:13080'
+
+VITE_API_URL = http://192.168.0.100:13080
+VITE_WS_URL = ws://192.168.0.100:13080/ws
diff --git a/src/views/is/im/Table/FunctionSelection.vue b/src/views/is/im/Table/FunctionSelection.vue
index cf7aaff..2986de1 100644
--- a/src/views/is/im/Table/FunctionSelection.vue
+++ b/src/views/is/im/Table/FunctionSelection.vue
@@ -9,12 +9,16 @@
         align="center"
         prop="funcKey"
         show-overflow-tooltip />
-      <el-table-column
-        label="功能图片"
-        align="center"
-        prop="textContent"
-        show-overflow-tooltip
-      />
+      <el-table-column prop="iconUrl" label="图片" >
+        <template #default="{ row }">
+          <el-image 
+            v-if="row.iconUrl"
+            style="height: 32px"
+            :src="getImgUrl(row.iconUrl)"
+            @click="showViewer(row.iconUrl)">
+          </el-image>
+        </template>
+      </el-table-column>
       <el-table-column
           label="操作"
           align="center"
@@ -66,12 +70,16 @@
           prop="funcKey"
           show-overflow-tooltip
         />
-        <el-table-column
-          label="功能图片"
-          align="center"
-          prop="textContent"
-          show-overflow-tooltip
-        />
+        <el-table-column prop="iconUrl" label="图片" >
+          <template #default="{ row }">
+            <el-image 
+              v-if="row.iconUrl"
+              style="height: 32px"
+              :src="getImgUrl(row.iconUrl)"
+              @click="showViewer(row.iconUrl)">
+            </el-image>
+          </template>
+        </el-table-column>
       </el-table>
       <template #footer>
         <div class="dialog-footer">
@@ -80,10 +88,19 @@
         </div>
       </template>
     </el-dialog>
+
+    <!-- 手动控制的预览组件，append-to-body 使其挂载到 body 末尾 -->
+    <ElImageViewer
+      v-if="isViewerOpen"
+      :url-list="[getImgUrl(currentImage)]"
+      @close="closeViewer"
+      append-to-body
+    />
   </div>
 </template>
 <script setup>
-import { onMounted, watch } from "vue";
+import { onMounted } from "vue";
+import { ElImageViewer } from 'element-plus'
 import { getFunction } from '@/api/is/func/index'
 
 const props = defineProps({
@@ -189,6 +206,22 @@ const unSelectRow = (row) => {
   }
 }
 
+const getImgUrl = (url) => {
+  return import.meta.env.VITE_API_URL + url
+}
+
+const isViewerOpen = ref(false);
+const currentImage = ref('');
+
+const showViewer = (url) => {
+  currentImage.value = url;
+  isViewerOpen.value = true;
+};
+
+const closeViewer = () => {
+  isViewerOpen.value = false;
+}
+
 onMounted(() => {
   getList();
   if (props.funcIds) {
@@ -196,14 +229,6 @@ onMounted(() => {
   }
 });
 
-// watch(() => open,
-//   (newVal) => {
-//     if (newVal) {
-//       selectList.value = props.selectIds
-//     }
-//   }
-// )
-
 </script>
 <style lang="scss" scoped>
 .btn-container {