From 07d9557bbca47734f7bc9bc8caf9a04f5ca64edf Mon Sep 17 00:00:00 2001
From: chao <3072464591@QQ.com>
Date: Mon, 29 Apr 2024 22:10:41 +0800
Subject: [PATCH] =?UTF-8?q?feat():=20=E8=B5=84=E4=BA=A7=E5=B1=95=E7=A4=BA?=
 =?UTF-8?q?=E5=9F=BA=E7=A1=80=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/data/show/index.vue | 156 ++++++++++++++++++++++++++++++++++
 1 file changed, 156 insertions(+)
 create mode 100644 src/views/data/show/index.vue

diff --git a/src/views/data/show/index.vue b/src/views/data/show/index.vue
new file mode 100644
index 0000000..c447190
--- /dev/null
+++ b/src/views/data/show/index.vue
@@ -0,0 +1,156 @@
+<template>
+  <el-container :style="{height: mainHeight + 'px'}">
+    <el-aside>
+      <el-tree :data="assetStructureList"
+               :load="expandTable"
+               :expand-on-click-node="false"
+               lazy
+               @node-click="(data) => showAuth=data.type"
+               :props="defaultProps">
+        <div class="custom-tree-node" slot-scope="{ node, data }">
+          <div v-if="data.type === 'dataSource'">{{ data.name + '('+data.databaseName + '-' + data.systemName+')' }}</div>
+          <div v-if="data.type === 'dataTable'">{{ data.name + '-'+data.as + '(' + data.dataTotal+'条)' }}</div>
+        </div>
+      </el-tree>
+    </el-aside>
+    <el-container>
+      <el-main>
+        <el-card>
+          <div slot="header" class="clearfix">
+            <span>资产模型基本信息</span>
+          </div>
+          <el-descriptions border :column="2">
+            <el-descriptions-item label="表名称">sys_user</el-descriptions-item>
+            <el-descriptions-item label="表备注">用户表</el-descriptions-item>
+            <el-descriptions-item label="数据量">12536</el-descriptions-item>
+            <el-descriptions-item label="是否核心">
+              <el-tag size="small">是</el-tag>
+            </el-descriptions-item>
+          </el-descriptions>
+        </el-card>
+
+        <el-card class="box-card" style="margin-top: 20px">
+          <div slot="header" class="clearfix">
+            <span>模型数据</span>
+          </div>
+          <el-row :gutter="20">
+            <el-col :span="6" v-for="asset in assetShowList" style="margin-top: 20px">
+              <el-descriptions :title="asset.key" direction="vertical" border :column="1">
+                <el-descriptions-item label="Type">
+                  <el-tag size="small">{{asset.type}}</el-tag>
+                </el-descriptions-item>
+                <el-descriptions-item label="Value">{{asset.value}}</el-descriptions-item>
+              </el-descriptions>
+            </el-col>
+          </el-row>
+
+        </el-card>
+      </el-main>
+    </el-container>
+  </el-container>
+</template>
+
+<script>
+
+export default {
+  name: "AssetShow",
+  data() {
+    return {
+      mainHeight: window.innerHeight - 85,
+      defaultProps: {
+        children: 'childrenList',
+        label: 'name'
+      },
+      showAuth: null,
+      assetStructureList: [
+        {
+          name: "测试1",
+          systemName: "云计算系统",
+          databaseName: "yunjisuan",
+          type: "dataSource"
+        },
+        {
+          name: "测试2",
+          systemName: "网站系统",
+          databaseName: "wangzhan",
+          type: "dataSource"
+        },
+        {
+          name: "测试3",
+          systemName: "物联网系统",
+          databaseName: "wulianwang",
+          type: "dataSource"
+        },
+        {
+          name: "测试4",
+          systemName: "传媒系统",
+          databaseName: "chuanmei",
+          type: "dataSource"
+        },
+      ],
+      childrenList: [
+        {
+          name: "sys_user",
+          as: "用户表",
+          dataTotal: 635847,
+          type: "dataTable",
+          childrenList: []
+        },
+        {
+          name: "sys_dept",
+          as: "部门表",
+          dataTotal: 362548,
+          type: "dataTable",
+          childrenList: []
+        },
+        {
+          name: "sys_notice",
+          as: "通知公告",
+          dataTotal: 6347,
+          type: "dataTable",
+          childrenList: []
+        }
+      ],
+      assetShowList: [
+        {key: "测试.sys_user.id", type: "String", value: 1},
+        {key: "测试.sys_user.name", type: "String", value: "张三"},
+        {key: "测试.sys_user.age", type: "Integer", value: 18},
+        {key: "测试.sys_user.email", type: "String", value: "123@136.com"},
+        {key: "测试.sys_user.sex", type: "String", value: "Y"},
+      ]
+    }
+  },
+  created() {
+  },
+  methods: {
+    expandTable( node, resolve){
+      if (node.level === 0) return resolve(this.assetStructureList);
+      const {data} = node;
+      if (data.type === 'dataTable') {
+        return resolve([])
+      }
+      setTimeout(() => {
+        resolve(this.childrenList)
+      }, 500);
+    }
+  }
+}
+</script>
+
+<style scoped>
+.el-aside {
+  margin: 0;
+  padding: 0;
+  width: 400px;
+  background-color: white;
+}
+.el-main {
+  background-color: #f1f1f1;
+}
+.custom-tree-node{
+  height: 30px;
+}
+.el-descriptions-row>th{
+  width: 200px;
+}
+</style>