From fec7ad22eeee559ab290c30bb8a81ebca2008954 Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期五, 30 八月 2024 15:47:11 +0800
Subject: [PATCH] 表单定义 左侧树查询 表格 表单查询

---
 Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/index.vue |  148 +++++++++++++++++++++++++++++++++++++++++++++---
 1 files changed, 137 insertions(+), 11 deletions(-)

diff --git a/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/index.vue b/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/index.vue
index 8693e99..5509441 100644
--- a/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/index.vue
+++ b/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/index.vue
@@ -4,13 +4,13 @@
     <el-aside>
       <basic-container>
         <div ref="TreeBox" style="height: calc(100vh - 144px);!important;">
-          <!-- 宸︿晶鏍�         -->
-          <div style="height:  calc(100vh - 280px);">
+          <!-- 宸︿晶鏍� -->
+          <div style="height:  calc(100vh - 220px);">
             <div style="margin-bottom: 10px;display: flex;justify-content: center">
-              <el-radio v-model="treeRadio" label="0">涓氬姟绫诲瀷鏍�</el-radio>
-              <el-radio v-model="treeRadio" label="1">閾炬帴绫诲瀷鏍�</el-radio>
+              <el-radio v-model="treeRadio" label="0" @input="TreeRadioChange">涓氬姟绫诲瀷鏍�</el-radio>
+              <el-radio v-model="treeRadio" label="1" @input="TreeRadioChange">閾炬帴绫诲瀷鏍�</el-radio>
             </div>
-            <avue-tree :data="treeData" :option="treeOption" @node-click="nodeClick">
+            <avue-tree v-loading="treeLoading" :data="treeData" :option="treeOption" @node-click="nodeClick">
           <span slot-scope="{ node, data }" class="el-tree-node__label">
            <span style="font-size: 15px">
               <i class="el-icon-s-promotion"></i>
@@ -26,13 +26,17 @@
     <el-main>
       <basic-container>
         <avue-crud
+          v-if="!tableStatus"
           :data="data"
-          :option="option">
+          :option="option"
+          :page.sync="page"
+          @size-change="sizeChange"
+          @current-change="currentChange">
           <template slot="menuLeft">
             <div style="display: flex; align-items: center;">
                <span style="display: inline-block; margin-right: 10px;">
-                <el-radio v-model="tableRadio" label="0">琛ㄥ崟</el-radio>
-                <el-radio v-model="tableRadio" label="1">琛ㄦ牸<span style="color: red;">锛堝厛瀵煎叆琛ㄥ崟锛屽啀瀵煎叆琛ㄦ牸锛侊級</span></el-radio>
+                <el-radio v-model="tableRadio" label="0" @input="tableRadioChange">琛ㄥ崟</el-radio>
+                <el-radio v-model="tableRadio" label="1" @input="tableRadioChange">琛ㄦ牸<span style="color: red;">锛堝厛瀵煎叆琛ㄥ崟锛屽啀瀵煎叆琛ㄦ牸锛侊級</span></el-radio>
                </span>
               <span style="display: flex;align-items: center; margin-right: 10px;">
                 <p style="display: flex; flex-shrink: 0;font-size: 14px">鍚嶇О锛�</p>
@@ -53,7 +57,7 @@
             </el-button>
           </template>
         </avue-crud>
-        <div style="display: flex;justify-content: center;margin-top: 15px">
+        <div v-if="!tableStatus" style="display: flex;justify-content: center;margin-top: 15px">
           <el-button icon="el-icon-plus" plain size="small" type="primary" @click="addClickHandler">澧炲姞</el-button>
           <el-button icon="el-icon-delete" plain size="small" type="danger">鍒犻櫎</el-button>
           <el-button icon="el-icon-document-add" plain size="small" type="primary">鍏嬮殕</el-button>
@@ -71,17 +75,44 @@
 import basicOption from "@/util/basic-option";
 import FormDialog from "@/views/modelingMenu/ui/formDefine/components/formDialog";
 import TableDialog from "@/views/modelingMenu/ui/formDefine/components/tableDialog"
+import {gridPortalVIDatas} from "@/api/UI/formDefine/api"
+import {getBizTypes} from "@/api/modeling/businessType/api";
+import {gridLink} from "@/api/modeling/linkType/api";
+import func from "@/util/func";
 
 export default {
   name: "index",
   components: {FormDialog, TableDialog},
   data() {
     return {
+      page: {
+        currentPage: 1,
+        pageSize: 10,
+        total: 0,
+        pageSizes: [10, 30, 50, 100],
+      },
+      nodeRow: {},
+      treeLoading: false,
       option: {
         ...basicOption,
         addBtn: false,
         editBtn: false,
-        delBtn: false
+        delBtn: false,
+        column: [
+          {
+            label: '涓氬姟鍚嶇О',
+            prop: 'typeName',
+          },
+          {
+            label: '鍚嶇О',
+            prop: 'viName',
+            sortable: true,
+          },
+          {
+            label: '绫诲瀷',
+            prop: 'viTypeText',
+          },
+        ]
       },
       data: [],
       tableRadio: "",
@@ -92,7 +123,16 @@
       }
     }
   },
+  created() {
+    this.getTreeList();
+  },
+  computed: {
+    tableStatus() {
+      return func.isEmptyObject(this.nodeRow)
+    }
+  },
   methods: {
+    // 鍙充晶鏂板
     addClickHandler() {
       if (!this.tableRadio) {
         this.$message.error('璇峰湪琛ㄦ牸涓婃柟閫夋嫨鏂板绫诲瀷');
@@ -100,7 +140,93 @@
       }
 
       this.tableRadio === "0" ? this.$refs.formDialog.visible = true : this.$refs.tableDialog.visible = true;
-    }
+    },
+
+    // 鍒濆鍖栨爲璇锋眰
+    getTreeList() {
+      this.treeLoading = true;
+      getBizTypes().then(res => {
+        const data = res.data.data.map(item => {
+          item.label = item.attributes.id;
+          return item;
+        });
+        this.treeData = data;
+        this.treeLoading = false;
+      })
+    },
+
+    // 宸︿晶涓氬姟绫诲瀷鍒囨崲
+    TreeRadioChange(val) {
+      this.treeLoading = true;
+      this.resetTable();
+      if (val === "0") {
+        getBizTypes().then(res => {
+          const data = res.data.data.map(item => {
+            item.label = item.attributes.id;
+            return item;
+          });
+          this.treeData = data;
+          this.treeLoading = false;
+        })
+      } else {
+        gridLink().then(res => {
+          const data = res.data.data.map(item => {
+            item.label = item.name;
+            return item;
+          });
+          this.treeData = data;
+          this.treeLoading = false;
+        })
+      }
+    },
+
+    // 宸︿晶鏍戠偣鍑�
+    nodeClick(row) {
+      console.log(row);
+      this.tableRadio = null;
+      this.nodeRow = row;
+      this.getRightPortalVIDatas(row);
+    },
+
+    // 閲嶇疆琛ㄦ牸灞曠ず淇℃伅 鍜� 琛ㄦ牸琛ㄥ崟閫夐」
+    resetTable() {
+      this.data = [];
+      this.tableRadio = null;
+    },
+
+    // 鍙充晶 琛ㄦ牸 琛ㄥ崟 淇℃伅鏌ヨ
+    getRightPortalVIDatas() {
+      const params = {
+        'conditionMap[typeName]': this.treeRadio === '0' ? this.nodeRow.attributes.id : this.nodeRow.name,
+        'conditionMap[viType]': this.tableRadio === '0' ? 'Form' : this.tableRadio === '1' ? 'Table' : '',
+        'conditionMap[viTypeFlag]': this.treeRadio === '0' ? 'BtmType' : this.treeRadio === '1' ? 'LinkType' : '',
+      }
+      gridPortalVIDatas(this.page.currentPage, this.page.pageSize, params).then(res => {
+        console.log(res);
+        if (res.data.code === 200) {
+          const data = res.data.data;
+          this.data = data;
+          this.page.total = res.data.total;
+        }
+      })
+    },
+
+    sizeChange(val) {
+      this.page.pageSize = val;
+      this.getRightPortalVIDatas();
+    },
+
+    // 椤电爜
+    currentChange(val) {
+      this.page.currentPage = val;
+      this.getRightPortalVIDatas();
+    },
+
+    // 琛ㄦ牸 琛ㄥ崟鍒囨崲
+    tableRadioChange() {
+      this.getRightPortalVIDatas();
+    },
+
   }
 }
 </script>

--
Gitblit v1.9.3