|
@@ -6,17 +6,17 @@
|
|
|
<el-input size="small" v-model="form.end" style="width: 120px;margin-right: 6px;" placeholder="末节点"></el-input>
|
|
|
<button class="el-button el-button--primary el-button--small" @click="search">搜索</button>
|
|
|
</div>
|
|
|
- <button class="el-button el-button--primary el-button--small" @click="search">返回上一级</button>
|
|
|
+ <!-- <button class="el-button el-button--primary el-button--small" @click="search">返回上一级</button> -->
|
|
|
<!-- <button type="primary" size="small" class="btn" v-if="level === 1" @click="draw">返回上一级</button> -->
|
|
|
</div>
|
|
|
<div class="chart" id="g6ChartWrapper"></div>
|
|
|
- <div class="table-wrapper" v-if="showTable">
|
|
|
- <el-table :data="tableData" border size="small" style="width: 100%" max-height="200px" v-loading="loading">
|
|
|
+ <div class="table-wrapper">
|
|
|
+ <el-table :data="tableData" v-if="showTable" border size="small" style="width: 100%" height="128px" v-loading="loading">
|
|
|
<el-table-column prop="ID" label="ID" align="center" wud />
|
|
|
<el-table-column prop="USE_STATUS" label="USE_STATUS" align="center" />
|
|
|
<el-table-column prop="OS_TYPE" label="OS_TYPE" align="center" />
|
|
|
<el-table-column prop="SERVER_NAME" label="SERVER_NAME" align="center" />
|
|
|
- <el-table-column prop="IMPACT" label="IMPACT" align="center" show-overflow-tooltip/>
|
|
|
+ <el-table-column prop="IMPACT" label="IMPACT" align="center" show-overflow-tooltip />
|
|
|
<!-- <el-table-column prop="APPLICATION_DESCRIPTION" label="APPLICATION_DESCRIPTION" align="center" />
|
|
|
<el-table-column prop="APPLICATION_REMARK" label="APPLICATION_REMARK" align="center" /> -->
|
|
|
<el-table-column prop="SERVER_TYPE" label="SERVER_TYPE" align="center" />
|
|
@@ -93,7 +93,6 @@ function draw() {
|
|
|
// graph.on('node:click', nodeClick2);
|
|
|
}
|
|
|
|
|
|
-
|
|
|
function draw2() {
|
|
|
level.value = 2
|
|
|
graph.clear();
|
|
@@ -110,18 +109,39 @@ function draw2() {
|
|
|
position: relative;
|
|
|
// display: flex;
|
|
|
// justify-content: space-between;
|
|
|
+ display: flex;
|
|
|
+ flex-flow: column;
|
|
|
|
|
|
.table-wrapper {
|
|
|
- width: 97vw;
|
|
|
- margin-left: 20px;
|
|
|
- position: fixed;
|
|
|
- left: 0;
|
|
|
- bottom: 1.5vw;
|
|
|
+ // width: 97vw;
|
|
|
+ // margin-left: 20px;
|
|
|
+ // position: fixed;
|
|
|
+ // left: 0;
|
|
|
+ // bottom: 1.5vw;
|
|
|
+ height: 128px;
|
|
|
+ margin-bottom: 2vw;
|
|
|
+
|
|
|
+ .el-table ::v-deep {
|
|
|
+ --el-table-border-color: #555;
|
|
|
+ --el-table-bg-color: #101220;
|
|
|
+ --el-table-tr-bg-color: #101220;
|
|
|
+ --el-table-header-bg-color: #101220;
|
|
|
+ --el-fill-color-light: #555;
|
|
|
+ --el-mask-color: #555;
|
|
|
+
|
|
|
+ tr {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ th {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.chart {
|
|
|
flex: 1;
|
|
|
- height: calc(100% - 2vw);
|
|
|
+ // height: calc(100% - 2vw);
|
|
|
}
|
|
|
|
|
|
.search {
|