forked from SmartBench/CMVR-IOT-UI
49 lines
940 B
Vue
49 lines
940 B
Vue
<template>
|
|
<div class="is-container">
|
|
<!-- 左侧树形面板 -->
|
|
<div class="left-panel">
|
|
<TreePanel @node-click="handleNodeClick" @tree-update="handleTreeUpdate" />
|
|
</div>
|
|
|
|
<!-- 右侧功能表格 -->
|
|
<div class="right-panel">
|
|
<FunctionTable />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import TreePanel from './TreePanel/TreePanel.vue'
|
|
import FunctionTable from './FunctionTable/FunctionTable.vue'
|
|
|
|
function handleNodeClick(data) {
|
|
console.log('选中节点:', data)
|
|
}
|
|
|
|
function handleTreeUpdate() {
|
|
console.log('树结构已更新')
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.is-container {
|
|
display: flex;
|
|
background-color: #f5f7fa;
|
|
gap: 10px;
|
|
width: 100%;
|
|
}
|
|
|
|
.left-panel {
|
|
width: 300px;
|
|
background: white;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.right-panel {
|
|
flex: 1;
|
|
padding: 20px;
|
|
background: white;
|
|
border-radius: 4px;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
}
|
|
</style> |