From ada17365b68c274a23546ca7ef875884a9a1ac73 Mon Sep 17 00:00:00 2001
From: 康鲁杰 <60095866+KangLujie@users.noreply.github.com>
Date: 星期四, 26 六月 2025 15:09:06 +0800
Subject: [PATCH] 详情

---
 ruoyi-ui/apps/web-antd/src/views/tool/template/index.vue |   89 +++++++++++++++++++++++++++++++-------------
 1 files changed, 62 insertions(+), 27 deletions(-)

diff --git a/ruoyi-ui/apps/web-antd/src/views/tool/template/index.vue b/ruoyi-ui/apps/web-antd/src/views/tool/template/index.vue
index a37a390..616f51f 100644
--- a/ruoyi-ui/apps/web-antd/src/views/tool/template/index.vue
+++ b/ruoyi-ui/apps/web-antd/src/views/tool/template/index.vue
@@ -12,6 +12,7 @@
       </template>
       <template #action="{ row }">
         <Space>
+          <ghost-button v-if="showAction('query')" @click="handleQuery(row)">璇︽儏</ghost-button>
           <ghost-button v-if="showAction('edit')" @click="handleEdit(row)">缂栬緫</ghost-button>
           <Popconfirm v-if="showAction('delete')" :get-popup-container="getVxePopupContainer" placement="left" title="纭鍒犻櫎锛�" @confirm="handleDelete(row)">
             <ghost-button danger @click.stop="">鍒犻櫎</ghost-button>
@@ -20,6 +21,16 @@
       </template>
     </BasicTable>
     <TemplateDrawer ref="templateModalRef" @reload="tableApi.query()" />
+    <a-modal v-model:open="detailModalVisible" title="璇︽儏" :footer="null" width="600px">
+      <a-descriptions bordered column="1">
+        <a-descriptions-item v-for="item in formDataFields" :key="item.key" :label="formFieldTitleMap[item.key] || item.key">
+          <span>{{ item.value }}</span>
+        </a-descriptions-item>
+        <a-descriptions-item label="鍒涘缓鏃堕棿">
+          <span>{{ createTime }}</span>
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </Page>
   <Fallback v-else description="鏈寚瀹� pageId锛屾棤娉曡闂椤甸潰" status="403" />
 </template>
@@ -36,7 +47,7 @@
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { columns as baseColumns, querySchema } from './data';
 import TemplateDrawer from './template-drawer.vue';
-import { templateList, templateRemove } from '#/api/tool/template';
+import { templateList, templateRemove, templateInfo } from '#/api/tool/template';
 import { pageInfo } from '#/api/tool/page-designer';
 
 const route = useRoute();
@@ -44,6 +55,10 @@
 const pageId = ref<string | number>('');
 const pageDesignDetail = ref<any>(null); // 椤甸潰璁捐璇︽儏
 const loading = ref(true); // 鍔犺浇涓�
+const detailModalVisible = ref(false);
+const detailRecord = ref({});
+const formDataFields = ref([]);
+const createTime = ref('');
 
 // 鍔ㄦ�乧olumns
 const dynamicColumns = ref([
@@ -198,16 +213,16 @@
   }
 }
 
-const formOptions: VbenFormProps = {
-  commonConfig: {
-    labelWidth: 80,
-    componentProps: {
-      allowClear: true,
-    },
-  },
-  schema: querySchema(),
-  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
-};
+// const formOptions: VbenFormProps = {
+//   commonConfig: {
+//     labelWidth: 80,
+//     componentProps: {
+//       allowClear: true,
+//     },
+//   },
+//   schema: querySchema(),
+//   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
+// };
 
 const gridOptions = ref<VxeGridProps>({
   columns: dynamicColumns.value,
@@ -273,7 +288,7 @@
 });
 
 const [BasicTable, tableApi] = useVbenVxeGrid({
-  formOptions,
+  // formOptions,
   gridOptions: computed(() => ({
     ...gridOptions.value,
     columns: dynamicColumns.value
@@ -334,21 +349,28 @@
   }
 }
 
-function handleGenerate(row) {
+async function handleQuery(row) {
   try {
-    generateModalRef.value.open(row);
-  } catch (error) {
-    console.error('鎵撳紑鐢熸垚椤甸潰澶辫触:', error);
-  }
-}
-
-function handlePreview(row) {
-  try {
-    // 鎵撳紑棰勮绐楀彛
-    const url = `/tool/template/preview/${row.id}`;
-    window.open(url, '_blank');
-  } catch (error) {
-    console.error('鎵撳紑棰勮澶辫触:', error);
+    const detail = await templateInfo(row.id);
+    detailRecord.value = detail || {};
+    createTime.value = detail.createTime || '';
+    // 瑙ｆ瀽 formData
+    let fields = [];
+    if (detail.formData) {
+      try {
+        const data = JSON.parse(detail.formData);
+        fields = Object.entries(data).map(([key, value]) => ({ key, value }));
+      } catch (e) {
+        fields = [];
+      }
+    }
+    formDataFields.value = fields;
+    detailModalVisible.value = true;
+  } catch (e) {
+    detailRecord.value = {};
+    formDataFields.value = [];
+    createTime.value = '';
+    detailModalVisible.value = true;
   }
 }
 
@@ -371,6 +393,19 @@
     return false;
   }
 });
+
+const formFieldTitleMap = computed(() => {
+  try {
+    if (pageDesignDetail.value && pageDesignDetail.value.formJson) {
+      const arr = JSON.parse(pageDesignDetail.value.formJson);
+      return arr.reduce((map, item) => {
+        map[item.field] = item.title || item.field;
+        return map;
+      }, {});
+    }
+  } catch (e) {}
+  return {};
+});
 </script>
 
 <style scoped>
@@ -384,7 +419,7 @@
 
 /* 纭繚琛ㄦ牸瀹瑰櫒楂樺害绋冲畾 */
 :deep(.vxe-table--main-wrapper) {
-  height: 600px !important;
+  height: 690px !important;
 }
 
 /* 纭繚鍒嗛〉鍣ㄤ綅缃浐瀹� */

--
Gitblit v1.9.3