| 1 |
- {"ast":null,"code":"import { getBuildingTree } from '@/api';\nexport default {\n name: 'BuildingNav',\n data() {\n return {\n treeData: []\n };\n },\n async mounted() {\n const res = await getBuildingTree();\n this.treeData = res.data.tree;\n },\n methods: {\n handleNodeClick(data) {\n this.$emit('node-click', data);\n }\n }\n};","map":{"version":3,"names":["getBuildingTree","name","data","treeData","mounted","res","tree","methods","handleNodeClick","$emit"],"sources":["src/components/VideoMonitor/BuildingNav.vue"],"sourcesContent":["<template>\n <div class=\"panel-box building-nav\">\n <div class=\"panel-title\">建筑结构导航</div>\n <div class=\"panel-content\">\n <el-tree\n :data=\"treeData\"\n :props=\"{ label: 'label', children: 'children' }\"\n node-key=\"id\"\n default-expand-all\n highlight-current\n @node-click=\"handleNodeClick\"\n class=\"dark-tree\"\n >\n <template #default=\"{ node }\">\n <span class=\"tree-node\">\n <i :class=\"node.isLeaf ? 'el-icon-video-camera' : 'el-icon-folder-opened'\"></i>\n <span>{{ node.label }}</span>\n </span>\n </template>\n </el-tree>\n </div>\n </div>\n</template>\n\n<script>\nimport { getBuildingTree } from '@/api'\n\nexport default {\n name: 'BuildingNav',\n data() {\n return {\n treeData: []\n }\n },\n async mounted() {\n const res = await getBuildingTree()\n this.treeData = res.data.tree\n },\n methods: {\n handleNodeClick(data) {\n this.$emit('node-click', data)\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.building-nav {\n height: 100%;\n display: flex;\n flex-direction: column;\n\n .panel-content {\n flex: 1;\n overflow-y: auto;\n }\n}\n\n.dark-tree {\n background: transparent;\n color: $text-secondary;\n\n ::v-deep {\n .el-tree-node__content {\n background: transparent;\n height: 36px;\n\n &:hover {\n background: rgba(30, 144, 255, 0.1);\n }\n }\n\n .is-current > .el-tree-node__content {\n background: rgba(30, 144, 255, 0.2);\n color: $accent-cyan;\n }\n\n .el-tree-node__expand-icon {\n color: $text-muted;\n\n &.is-leaf {\n color: transparent;\n }\n }\n\n .el-tree-node__expand-icon:not(.is-leaf) {\n color: $accent-blue;\n }\n }\n}\n\n.tree-node {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n\n i {\n font-size: 14px;\n color: $accent-blue;\n }\n}\n</style>\n"],"mappings":"AAyBA,SAAAA,eAAA;AAEA;EACAC,IAAA;EACAC,KAAA;IACA;MACAC,QAAA;IACA;EACA;EACA,MAAAC,QAAA;IACA,MAAAC,GAAA,SAAAL,eAAA;IACA,KAAAG,QAAA,GAAAE,GAAA,CAAAH,IAAA,CAAAI,IAAA;EACA;EACAC,OAAA;IACAC,gBAAAN,IAAA;MACA,KAAAO,KAAA,eAAAP,IAAA;IACA;EACA;AACA","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]}
|
