添加 标准库 模版库 页面

修改 终端台账管理 页面

src/components/tree/pqs/Terminal.vue

@@ -1,5 +1,5 @@
 <template>
-    <Tree ref="treRef" :data="tree" :expanded="expanded" />
+    <Tree ref="treRef" :data="tree" style="height: 100%" :width="'100%'" :expanded="expanded" />
 </template>
 
 <script lang="ts" setup>
@@ -17,7 +17,6 @@ const expanded: any = ref([])
 const tree = ref()
 const treRef = ref()
 const info = (id: any) => {
-  
     expanded.value = [id]
     getTerminalTree().then(res => {
         // let arr: any[] = []

src/components/tree/pqs/index.vue

@@ -16,14 +16,14 @@
                         <Icon name="el-icon-Search" style="font-size: 16px" />
                     </template>
                 </el-input>
-                <Icon
+                <!-- <Icon
                     @click="onMenuCollapse"
                     :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
                     :class="menuCollapse ? 'unfold' : ''"
                     size="18"
                     class="fold ml10 menu-collapse"
                     style="cursor: pointer"
-                />
+                /> -->
             </div>
             <el-tree
                 style="flex: 1; overflow: auto"
@@ -131,7 +131,7 @@ defineExpose({ treeRef, setCurrentKey })
     display: flex;
     flex-direction: column;
     box-sizing: border-box;
-    padding: 10px;
+    padding-right: 10px;
     height: 100%;
     width: 100%;
     :deep(.el-tree) {

src/components/tree/pqs/standardTree.vue

@@ -0,0 +1,81 @@
+<template>
+    <div class="point-tree">
+        <div style="flex: 1; overflow: hidden">
+            <Tree ref="treeRef" :data="tree" style="width: 100%; height: 100%" :canExpand="false" v-bind="$attrs" />
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { nextTick, onMounted, ref, useAttrs } from 'vue'
+import Tree from '../index.vue'
+import { useAdminInfo } from '@/stores/adminInfo'
+import { useDictData } from '@/stores/dictData'
+import { getTerminalTreeForFive } from '@/api/device-boot/terminalTree'
+import { useConfig } from '@/stores/config'
+
+defineOptions({
+    name: 'pms/pointTree'
+})
+const emit = defineEmits(['init'])
+const attrs = useAttrs()
+const adminInfo = useAdminInfo()
+const dictData = useDictData()
+const config = useConfig()
+const classificationData = dictData.getBasicData('Statistical_Type', ['Report_Type'])
+const tree = ref()
+const treeRef = ref()
+
+const loadData = () => {
+    let nodeKey = ''
+    let res = {
+        data: [
+            {
+                name: '运行管理',
+                id: '1',
+                children: [
+                    {
+                        name: '运行指标',
+                        id: '2'
+                    },
+                    {
+                        name: '数据质量核查',
+                        id: '3'
+                    }
+                ]
+            }
+        ]
+    }
+    // getTerminalTreeForFive(form).then(res => {
+    res.data.forEach((item: any) => {
+        item.icon = 'el-icon-FolderOpened'
+        item.color = config.getColorVal('elementUiPrimary')
+        item.children.forEach((item2: any) => {
+            item2.icon = 'el-icon-Document'
+            item.color = config.getColorVal('elementUiPrimary')
+        })
+    })
+
+    nodeKey = res.data[0].children[0].id
+    emit('init', res.data[0].children[0])
+
+    tree.value = res.data
+    if (nodeKey) {
+        setTimeout(() => {
+            treeRef.value.treeRef.setCurrentKey(nodeKey)
+        }, 10)
+    }
+    // })
+}
+loadData()
+</script>
+<style lang="scss">
+.point-tree {
+    height: 100%;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    background: #fff;
+    border: 1px solid var(--el-border-color);
+}
+</style>