添加 标准库 模版库 页面

修改 终端台账管理 页面

src/views/pqs/database/standard/index.vue

@@ -1,11 +1,89 @@
 <template>
-
-    <div> 标准</div>
-
+    <div class="default-main" :style="height">
+        <!-- 标准库 -->
+        <splitpanes style="height: 100%" class="default-theme" id="navigation-splitpanes">
+            <pane :size="size">
+                <standardTree
+                    :default-expand-all="false"
+                    :default-expanded-keys="monitoringPoint.state.lineId ? [monitoringPoint.state.lineId] : []"
+                    :current-node-key="monitoringPoint.state.lineId"
+                    @node-click="handleNodeClick"
+                    @init="handleNodeClick"
+                ></standardTree>
+            </pane>
+            <pane style="background: #fff" :style="height">
+                <div class="pd10" style="display: flex; justify-content: end">
+                    <el-button icon="el-icon-Plus" type="primary">新增</el-button>
+                    <el-button icon="el-icon-Edit" type="primary">修改</el-button>
+                    <el-button icon="el-icon-Delete" type="primary">删除</el-button>
+                </div>
+                <div :style="`height: calc(${height.height} - 60px) `"></div>
+            </pane>
+        </splitpanes>
+    </div>
 </template>
-<script setup lang='ts'>
-import { ref, reactive } from 'vue'
-</script>
-<style lang="scss" scoped>
+<script setup lang="ts">
+import { onMounted, ref, provide } from 'vue'
+import 'splitpanes/dist/splitpanes.css'
+import { Splitpanes, Pane } from 'splitpanes'
+import standardTree from '@/components/tree/pqs/standardTree.vue'
+import { mainHeight } from '@/utils/layout'
+import { getLineExport, getList, selectReleation } from '@/api/event-boot/report'
+import { useMonitoringPoint } from '@/stores/monitoringPoint'
+import { ElMessage } from 'element-plus'
+defineOptions({
+    name: 'database/standard'
+})
+const monitoringPoint = useMonitoringPoint()
+const height = mainHeight(20)
+const size = ref(0)
 
+const TableHeaderRef = ref()
+const dotList: any = ref({
+    name: monitoringPoint.state.lineName.split('>')[3],
+    id: monitoringPoint.state.lineId,
+    level: 6
+})
+
+onMounted(() => {
+    const dom = document.getElementById('navigation-splitpanes')
+    if (dom) {
+        size.value = Math.round((180 / dom.offsetHeight) * 100)
+    }
+})
+
+const handleNodeClick = (data: any, node: any) => {
+    dotList.value = data
+}
+</script>
+<style lang="scss">
+.splitpanes.default-theme .splitpanes__pane {
+    background: #eaeef1;
+}
+.grid-content {
+    text-align: center;
+}
+.divBox {
+    width: 250px;
+    height: 31px;
+    margin: auto;
+    line-height: 32px;
+    border: 1px solid #c9c9c9;
+    &:hover {
+        border: 1px solid #002255;
+    }
+}
+.box {
+    padding: 10px;
+    // margin-top: 10px;
+    overflow-y: auto;
+    font-size: 15px;
+}
+.el-divider--horizontal {
+    margin: 10px 0;
+}
+.mTop {
+    margin-top: 5px;
+    margin-bottom: 5px;
+}
 </style>