| | |
| | | <el-input v-model="deviceName" class="div_left_input" clearable placeholder="输入设备名称" size="small" |
| | | suffix-icon="el-icon-search" @blur="searchFilter" @clear="searchFilter" |
| | | @keyup.enter.native="searchFilter"></el-input> |
| | | <el-tree ref="tree" v-loading="loading" :data="list" :expand-on-click-node="false" |
| | | :filter-node-method="filterNode" :props="{ children: 'children', label: 'label' }" highlight-current |
| | | node-key="id" style="height:calc(100vh - 200px); |
| | | <el-tree :data="list" ref="tree" :props="{ children: 'children', label: 'label' }" node-key="id" |
| | | @node-click="handleNodeClick" :filter-node-method="filterNode" highlight-current @node-expand="nodeOpen" |
| | | @node-collapse="nodeClose" v-loading="loading" :expand-on-click-node="false" style="height:calc(100% - 46px); |
| | | overflow-y: scroll; |
| | | scrollbar-width: none;" @node-click="handleNodeClick" @node-expand="nodeOpen" @node-collapse="nodeClose"> |
| | | <div slot-scope="{ node, data }" class="custom-tree-node"> |
| | | scrollbar-width: none;"> |
| | | <div class="custom-tree-node" slot-scope="{ node, data }"> |
| | | <el-row style="width: 100%;"> |
| | | <el-col :span="24"> |
| | | <p class="single-line-ellipsis" style="width: 100%"> |
| | | <el-col :span="21" :title="data.label"> |
| | | <span class="single-line-ellipsis" style="width: 100%;display: inline-block;"> |
| | | <i :class="`node_i ${data.children != undefined |
| | | ? data.code === '[1]' |
| | | ? 'el-icon-folder-opened' |
| | |
| | | }` |
| | | "></i> |
| | | {{ data.label }} |
| | | </p> |
| | | <p> |
| | | {{ data.managementNumber === undefined ? '' : data.managementNumber }} |
| | | </p> |
| | | </span> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | |
| | | <div v-if="!isShowAll" style="height: 100%;"> |
| | | <el-tabs v-model="tabListActiveName" class="main_right" type="border-card" @tab-click="handleClick"> |
| | | <el-tab-pane label="设备运行总览" name="设备运行总览"> |
| | | <operationOverview v-if="tabListActiveName == '设备运行总览'" :clickNodeVal="clickNodeVal"/> |
| | | <operationOverview view v-if="tabListActiveName == '设备运行总览'" :clickNodeVal="clickNodeVal"/> |
| | | </el-tab-pane> |
| | | <el-tab-pane label="设备档案" name="设备档案"> |
| | | <files v-if="tabListActiveName == '设备档案'" :clickNodeVal="clickNodeVal" /> |
| | |
| | | isShowAll: true, |
| | | deviceName: "", // 侧边栏搜索 |
| | | loading: false, |
| | | tabListActiveName: '设备档案', |
| | | tabListActiveName: '设备运行总览', |
| | | menuListActiveName: '设备总览', |
| | | list: [], |
| | | clickNodeVal: {} |
| | |
| | | .device-right { |
| | | background: #fff; |
| | | width: calc(100% - 250px); |
| | | height: calc(100vh - 100px); |
| | | height: calc(100vh - 40px); |
| | | border-radius: 16px; |
| | | box-sizing: border-box; |
| | | padding: 10px; |