monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by 王涛
Commit f3b293fe25d5f1ac1abdeef8371cdcec0bca0de5 1 parent 65e52c52

资产视图优化

Inline Side-by-side
Showing 16 changed files with 219 additions and 96 deletions
1 -@charset "utf-8";  
2 -*  
3 -{  
4 - margin:0;  
5 - padding:0;  
6 -}  
7 -html  
8 -{  
9 - width:100%;  
10 - height:100%;  
11 - font-size:14px;  
12 - font-family:Arial, Helvetica, sans-serif;  
13 - -webkit-text-size-adjust:none;  
14 - /*background-image:url("/vue3/src/assets/images/machineRoom/img-beijing-dp.png");  
15 - background-repeat: no-repeat;  
16 - background-position: center;*/  
17 -}  
18 -body  
19 -{  
20 - /*padding:5px;*/  
21 -}  
22 -  
23 -.outlinediv { 1 +
  2 +.machine-room-parent{
  3 +
  4 +}
  5 +.machine-room-parent .outlinediv {
24 padding-top: 30px; 6 padding-top: 30px;
25 border: 2px solid #0a93be; 7 border: 2px solid #0a93be;
26 width: 900px; 8 width: 900px;
@@ -35,13 +17,13 @@ body @@ -35,13 +17,13 @@ body
35 17
36 18
37 } 19 }
38 -.outlinediv span { 20 +.machine-room-parent .outlinediv span {
39 /*color: rgba(0, 0, 0, 0.89);*/ 21 /*color: rgba(0, 0, 0, 0.89);*/
40 color: rgba(255, 255, 255, 0.89); 22 color: rgba(255, 255, 255, 0.89);
41 line-height: 20px; 23 line-height: 20px;
42 font-size: 14px; 24 font-size: 14px;
43 } 25 }
44 -.outlinediv .xiaoshansecond-topcabinet{ 26 +.machine-room-parent .outlinediv .xiaoshansecond-topcabinet{
45 margin-top: 20px; 27 margin-top: 20px;
46 margin-left: 7%; 28 margin-left: 7%;
47 padding: 20px; 29 padding: 20px;
@@ -50,7 +32,7 @@ body @@ -50,7 +32,7 @@ body
50 32
51 } 33 }
52 34
53 -.outlinediv .xiaoshansecond-middlecabinet{ 35 +.machine-room-parent .outlinediv .xiaoshansecond-middlecabinet{
54 margin-top: 50px; 36 margin-top: 50px;
55 margin-bottom: 50px; 37 margin-bottom: 50px;
56 margin-left: 7%; 38 margin-left: 7%;
@@ -59,58 +41,59 @@ body @@ -59,58 +41,59 @@ body
59 height:100px; 41 height:100px;
60 42
61 } 43 }
62 -.outlinediv .xiaoshansecond-bottomcabinet{ 44 +.machine-room-parent .outlinediv .xiaoshansecond-bottomcabinet{
63 margin-left: 7%; 45 margin-left: 7%;
64 padding: 20px; 46 padding: 20px;
65 width: 80%; 47 width: 80%;
66 height:100px; 48 height:100px;
67 49
68 } 50 }
69 -.cabinet{ 51 +.machine-room-parent .cabinet{
70 width:auto;height:auto;max-height:100%;max-width:100%; 52 width:auto;height:auto;max-height:100%;max-width:100%;
71 } 53 }
72 -table{ 54 +.machine-room-parent table{
73 margin-top: 20px; 55 margin-top: 20px;
74 border-collapse:collapse; 56 border-collapse:collapse;
75 } 57 }
76 -table tr{ 58 +.machine-room-parent table tr{
77 height: 50px; 59 height: 50px;
78 } 60 }
79 -tr.sevenempty { 61 +.machine-room-parent tr.sevenempty {
80 height: 10px; 62 height: 10px;
81 } 63 }
82 -table tr td{ 64 +.machine-room-parent table tr td{
83 position: relative; 65 position: relative;
84 max-width: 35px; 66 max-width: 35px;
85 } 67 }
86 68
87 -table td .cabinetId{  
88 - 69 +.machine-room-parent table td .cabinetId{
89 position: absolute;/*绝对定位*/ 70 position: absolute;/*绝对定位*/
90 top:20px; 71 top:20px;
91 width: 100%; 72 width: 100%;
92 bottom: 0px;/*离底下0像素*/ 73 bottom: 0px;/*离底下0像素*/
93 left: 0px;/*离左边0像素*/ 74 left: 0px;/*离左边0像素*/
94 text-align: center; 75 text-align: center;
95 -  
96 font-size: 12px; 76 font-size: 12px;
97 -  
98 color: white; 77 color: white;
99 } 78 }
100 -.outlinediv .xiaoshanthird-topcabinet{ 79 +
  80 +.machine-room-parent .outlinediv .xiaoshanthird-topcabinet{
101 margin-left:22%; 81 margin-left:22%;
102 padding: 20px; 82 padding: 20px;
103 width: 80%; 83 width: 80%;
104 } 84 }
105 -.outlinediv .xiaoshanseven-leftcabinet{ 85 +
  86 +.machine-room-parent .outlinediv .xiaoshanseven-leftcabinet{
106 margin-left:1%; 87 margin-left:1%;
107 width: 40%; 88 width: 40%;
108 } 89 }
109 -.outlinediv .xiaoshanseven-rightcabinet{ 90 +
  91 +.machine-room-parent .outlinediv .xiaoshanseven-rightcabinet{
110 margin-left: 5px; 92 margin-left: 5px;
111 width: 49%; 93 width: 49%;
112 } 94 }
113 -.outlinediv .xiaoshanseven-middlecabinet{ 95 +
  96 +.machine-room-parent .outlinediv .xiaoshanseven-middlecabinet{
114 margin-top: 20px; 97 margin-top: 20px;
115 padding-top: 30%; 98 padding-top: 30%;
116 border: 2px solid #111D1A; 99 border: 2px solid #111D1A;
@@ -118,25 +101,27 @@ table td .cabinetId{ @@ -118,25 +101,27 @@ table td .cabinetId{
118 height: 255px; 101 height: 255px;
119 text-align: center; 102 text-align: center;
120 } 103 }
121 -.outlinediv .huzhouone-topcabinet{ 104 +
  105 +.machine-room-parent .outlinediv .huzhouone-topcabinet{
122 margin-left:10%; 106 margin-left:10%;
123 width: 90%; 107 width: 90%;
124 } 108 }
125 -tr.zaibeione{ 109 +
  110 +.machine-room-parent tr.zaibeione{
126 height: 90px; 111 height: 90px;
127 } 112 }
128 -.zaibei.cabinetId{ 113 +
  114 +.machine-room-parent .zaibei.cabinetId{
129 position: absolute;/*绝对定位*/ 115 position: absolute;/*绝对定位*/
130 top:10px; 116 top:10px;
131 width: 100%; 117 width: 100%;
132 bottom: 0px;/*离底下0像素*/ 118 bottom: 0px;/*离底下0像素*/
133 left: 0px;/*离左边0像素*/ 119 left: 0px;/*离左边0像素*/
134 text-align: center; 120 text-align: center;
135 -  
136 font-size: 8px; 121 font-size: 8px;
137 -  
138 color: white; 122 color: white;
139 } 123 }
140 -.cursorClass{ 124 +
  125 +.machine-room-parent .cursorClass{
141 cursor: pointer; 126 cursor: pointer;
142 } 127 }
@@ -152,10 +152,14 @@ @@ -152,10 +152,14 @@
152 152
153 <cm-dialog title="属性配置" width="500px" :showDialogVisible="settingCmDialogFlg" @hidedialog="showSettingCmDialog" @okfunc="getSettingDetail"> 153 <cm-dialog title="属性配置" width="500px" :showDialogVisible="settingCmDialogFlg" @hidedialog="showSettingCmDialog" @okfunc="getSettingDetail">
154 <template v-slot> 154 <template v-slot>
155 - <div style="padding: 10px" style="display: flex"> 155 + <div style="padding: 10px" style="display: flex;flex-wrap: wrap">
156 <div v-for="(v,k) in fieldsValueObj[currentRow.id].props" style="width: 50%"> 156 <div v-for="(v,k) in fieldsValueObj[currentRow.id].props" style="width: 50%">
157 <div style="text-align: left;padding-left: 10px;">{{v}}</div> 157 <div style="text-align: left;padding-left: 10px;">{{v}}</div>
158 - <el-select v-model="settingVal[currentRow.id][k]" :placeholder="v" style="margin: 3px"> 158 +
  159 + <div v-if="k.indexOf('_input') != -1">
  160 + <el-input v-model="settingVal[currentRow.id][k]" :placeholder="v"></el-input>
  161 + </div>
  162 + <el-select v-else v-model="settingVal[currentRow.id][k]" :placeholder="v" style="margin: 3px">
159 <el-option v-for="(value ,index) in fieldsValueObj[currentRow.id].object" 163 <el-option v-for="(value ,index) in fieldsValueObj[currentRow.id].object"
160 :key="index" 164 :key="index"
161 :label="value[fieldsValueObj[currentRow.id].text]" 165 :label="value[fieldsValueObj[currentRow.id].text]"
@@ -68,8 +68,9 @@ let configPageEdit = (columns, currentNode) => { @@ -68,8 +68,9 @@ let configPageEdit = (columns, currentNode) => {
68 proxy.$global.showMsg("请选择关联扩展属性！", "warning") 68 proxy.$global.showMsg("请选择关联扩展属性！", "warning")
69 return; 69 return;
70 } 70 }
71 - 71 +debugger
72 if(fieldsValueObj.value[row.id] && Object.keys(fieldsValueObj.value[row.id]).length >0){ 72 if(fieldsValueObj.value[row.id] && Object.keys(fieldsValueObj.value[row.id]).length >0){
  73 + settingCmDialogFlg.value = flg;
73 return; 74 return;
74 } 75 }
75 // 获取属性标识的配置 76 // 获取属性标识的配置
@@ -83,12 +84,16 @@ let configPageEdit = (columns, currentNode) => { @@ -83,12 +84,16 @@ let configPageEdit = (columns, currentNode) => {
83 if (res && res.object) { 84 if (res && res.object) {
84 fieldsValueObj.value[row.id] = res.object; 85 fieldsValueObj.value[row.id] = res.object;
85 86
  87 + if(rowProps){
86 let defVal = JSON.parse(rowProps); 88 let defVal = JSON.parse(rowProps);
87 if(defVal){ 89 if(defVal){
88 settingVal.value[row.id] = defVal; 90 settingVal.value[row.id] = defVal;
89 } else { 91 } else {
90 settingVal.value[row.id] = {}; 92 settingVal.value[row.id] = {};
91 } 93 }
  94 + } else {
  95 + settingVal.value[row.id] = {};
  96 + }
92 settingCmDialogFlg.value = flg; 97 settingCmDialogFlg.value = flg;
93 } else { 98 } else {
94 proxy.$global.showMsg("该属性无需配置！", "warning") 99 proxy.$global.showMsg("该属性无需配置！", "warning")
@@ -128,7 +128,7 @@ const routes = [{ @@ -128,7 +128,7 @@ const routes = [{
128 { 128 {
129 path: '/fault/faultForm', 129 path: '/fault/faultForm',
130 name: 'faultForm', 130 name: 'faultForm',
131 - component: () => myImport('views/faultDiagnosis/components/faultForm/index') 131 + component: () => myImport('views/faultDiagnosis/result/index')
132 }/*, 132 }/*,
133 { 133 {
134 path: '/fault/faultAddIndex', 134 path: '/fault/faultAddIndex',
1 -<div class="machine-room"> 1 +<div class="machine-room machine-room-parent">
2 <div class="room-top"> 2 <div class="room-top">
3 <el-tabs type="card" @tab-click="handleCommand" v-model="commandVal"> 3 <el-tabs type="card" @tab-click="handleCommand" v-model="commandVal">
4 <el-tab-pane v-for="item in commandNameData" :label="item.machineRoomName" :name="item.machineRoomCode"></el-tab-pane> 4 <el-tab-pane v-for="item in commandNameData" :label="item.machineRoomName" :name="item.machineRoomCode"></el-tab-pane>
1 -<div v-if="!isDetailShow" class="outlinediv" > 1 +<div v-if="!isDetailShow" class="outlinediv machine-room-parent" >
2 <!-- <span>湖州灾备一机房平面图</span>--> 2 <!-- <span>湖州灾备一机房平面图</span>-->
3 <div class="huzhouone-topcabinet"> 3 <div class="huzhouone-topcabinet">
4 <table> 4 <table>
1 -<div v-if="!isDetailShow" class="outlinediv" > 1 +<div v-if="!isDetailShow" class="outlinediv machine-room-parent" >
2 <!-- <span>湖州灾备三机房平面图</span>--> 2 <!-- <span>湖州灾备三机房平面图</span>-->
3 <div class="huzhouone-topcabinet" style="margin-left: 25%;padding-top: 30px"> 3 <div class="huzhouone-topcabinet" style="margin-left: 25%;padding-top: 30px">
4 <table> 4 <table>
1 -<div v-if="!isDetailShow" class="outlinediv" > 1 +<div v-if="!isDetailShow" class="outlinediv machine-room-parent" >
2 <!-- <span>湖州灾备二机房平面图</span>--> 2 <!-- <span>湖州灾备二机房平面图</span>-->
3 <div class="huzhouone-topcabinet" style="margin-left: 20%"> 3 <div class="huzhouone-topcabinet" style="margin-left: 20%">
4 <table> 4 <table>
1 -<div :class="['all']"> 1 +<div :class="['all']" class=" machine-room-parent">
2 <!-- 左侧机柜效果图 --> 2 <!-- 左侧机柜效果图 -->
3 <div class='contain'> 3 <div class='contain'>
4 4
1 -<div v-if="!isDetailShow" class="outlinediv" > 1 +<div v-if="!isDetailShow" class="outlinediv machine-room-parent" >
2 <!-- <span>2号机房平面图</span>--> 2 <!-- <span>2号机房平面图</span>-->
3 <div v-for="(items,indexs) in tableData" :class="[{'xiaoshansecond-topcabinet':indexs==0,'xiaoshansecond-middlecabinet':indexs==1,'xiaoshansecond-bottomcabinet':indexs==2}]" class="xiaoshansecond-topcabinet" > 3 <div v-for="(items,indexs) in tableData" :class="[{'xiaoshansecond-topcabinet':indexs==0,'xiaoshansecond-middlecabinet':indexs==1,'xiaoshansecond-bottomcabinet':indexs==2}]" class="xiaoshansecond-topcabinet" >
4 <table> 4 <table>
1 -<div v-if="!isDetailShow" class="outlinediv" > 1 +<div v-if="!isDetailShow" class="outlinediv machine-room-parent" >
2 <!-- <span>7号机房平面图</span>--> 2 <!-- <span>7号机房平面图</span>-->
3 <div style="width: 100%;height: 100%;display: inline-flex"> 3 <div style="width: 100%;height: 100%;display: inline-flex">
4 <div class="xiaoshanseven-leftcabinet"> 4 <div class="xiaoshanseven-leftcabinet">
1 -<div v-if="!isDetailShow" class="outlinediv" > 1 +<div v-if="!isDetailShow" class="outlinediv machine-room-parent" >
2 <!-- <span>3号机房平面图</span>--> 2 <!-- <span>3号机房平面图</span>-->
3 <div class="xiaoshanthird-topcabinet"> 3 <div class="xiaoshanthird-topcabinet">
4 <table> 4 <table>
1 -<div class="faultForm"> 1 +<div class="container" :style="{'height':height+'px','max-height':height+'px'}">
  2 + <div class="cm-card" :style="{'min-height':height+'px','max-height':height+'px','height':'100%'}">
  3 + <div class="faultForm">
2 <el-row> 4 <el-row>
3 <el-col :span="12" class="flex-div"> 5 <el-col :span="12" class="flex-div">
4 <div class="grid-content bg-purple"> 6 <div class="grid-content bg-purple">
@@ -25,23 +27,23 @@ @@ -25,23 +27,23 @@
25 <el-col :span="24"> 27 <el-col :span="24">
26 <div class="faultForm-table margin-top flex-div-start margin-30"> 28 <div class="faultForm-table margin-top flex-div-start margin-30">
27 <el-table :data="faultFormTableData" border height="250" style="width: 100%"> 29 <el-table :data="faultFormTableData" border height="250" style="width: 100%">
28 - <el-table-column align="center" type="index" prop="index" label="序号" width="80" />  
29 - <el-table-column align="center" prop="categories" label="故障分类" 个 />  
30 - <el-table-column align="center" prop="faultBody" label="故障主体" 个 > 30 + <el-table-column align="center" type="index" prop="index" label="序号" width="80"/>
  31 + <el-table-column align="center" prop="categories" label="故障分类" 个/>
  32 + <el-table-column align="center" prop="faultBody" label="故障主体" 个>
31 <template #default="scope"> 33 <template #default="scope">
32 <div class="diagnosisBtn"> 34 <div class="diagnosisBtn">
33 <span @click="handleDiagnosis(scope.row)" class="list-data-text">{{ scope.row.faultBody}}</span> 35 <span @click="handleDiagnosis(scope.row)" class="list-data-text">{{ scope.row.faultBody}}</span>
34 </div> 36 </div>
35 </template> 37 </template>
36 </el-table-column> 38 </el-table-column>
37 - <el-table-column align="center" prop="startTime" label="发生时间" 个 />  
38 - <el-table-column align="center" prop="state" label="故障状态" 个 />  
39 - <el-table-column align="center" prop="mode" label="处理方式" 个 />  
40 - <el-table-column align="center" prop="handleTime" label="处理时间" 个 />  
41 - <el-table-column align="center" prop="handlePeople" label="处理人" 个 />  
42 - <el-table-column align="center" prop="duration" label="持续时长" 个 />  
43 - <el-table-column align="center" prop="range" label="影响范围" 个 />  
44 - <el-table-column align="center" prop="categories" label="操作" 个 > 39 + <el-table-column align="center" prop="startTime" label="发生时间" 个/>
  40 + <el-table-column align="center" prop="state" label="故障状态" 个/>
  41 + <el-table-column align="center" prop="mode" label="处理方式" 个/>
  42 + <el-table-column align="center" prop="handleTime" label="处理时间" 个/>
  43 + <el-table-column align="center" prop="handlePeople" label="处理人" 个/>
  44 + <el-table-column align="center" prop="duration" label="持续时长" 个/>
  45 + <el-table-column align="center" prop="range" label="影响范围" 个/>
  46 + <el-table-column align="center" prop="categories" label="操作" 个>
45 <template #default="scope"> 47 <template #default="scope">
46 <div class="handleBtn"> 48 <div class="handleBtn">
47 <span @click="handleFault(scope.row)" class="list-data-text">处理</span> 49 <span @click="handleFault(scope.row)" class="list-data-text">处理</span>
@@ -117,7 +119,8 @@ @@ -117,7 +119,8 @@
117 </el-dialog> 119 </el-dialog>
118 <el-dialog v-model="faultDiagnosisDocVisible" title="电子税务局业务故障诊断报告" width="60%"> 120 <el-dialog v-model="faultDiagnosisDocVisible" title="电子税务局业务故障诊断报告" width="60%">
119 <div class="diagnosisDoc-content"> 121 <div class="diagnosisDoc-content">
120 - <div class="export-div" @click="exportDoc"><img src="./src/assets/images/faultDiagnosis/icon-export.png" alt=""></div> 122 + <div class="export-div" @click="exportDoc"><img
  123 + src="./src/assets/images/faultDiagnosis/icon-export.png" alt=""></div>
121 <el-row> 124 <el-row>
122 <el-col :span="6"> 125 <el-col :span="6">
123 <div class="title-text"> 126 <div class="title-text">
@@ -150,7 +153,8 @@ @@ -150,7 +153,8 @@
150 <el-row> 153 <el-row>
151 <div class="program-text margin-30 flex-div-start"> 154 <div class="program-text margin-30 flex-div-start">
152 <div>检测量：<span>5节点</span></div> 155 <div>检测量：<span>5节点</span></div>
153 - <span class="margin-left">20项指标</span><span class="margin-left">18项正常</span><span class="margin-left">2项异常</span> 156 + <span class="margin-left">20项指标</span><span class="margin-left">18项正常</span><span
  157 + class="margin-left">2项异常</span>
154 </div> 158 </div>
155 </el-row> 159 </el-row>
156 <el-row> 160 <el-row>
@@ -158,9 +162,10 @@ @@ -158,9 +162,10 @@
158 <div class="progress-div margin-30 flex-div-start"> 162 <div class="progress-div margin-30 flex-div-start">
159 <div class="color-green">正常</div> 163 <div class="color-green">正常</div>
160 <div class="progress-con"> 164 <div class="progress-con">
161 - <el-progress stroke-width="12" :percentage="percentage" :color="customColor" :show-text="false" /> 165 + <el-progress stroke-width="12" :percentage="percentage" :color="customColor"
  166 + :show-text="false"/>
162 </div> 167 </div>
163 -<!-- <div class="color-yellow">异常</div>--> 168 + <!-- <div class="color-yellow">异常</div>-->
164 </div> 169 </div>
165 </el-col> 170 </el-col>
166 </el-row> 171 </el-row>
@@ -168,7 +173,9 @@ @@ -168,7 +173,9 @@
168 <el-col :span="24"> 173 <el-col :span="24">
169 <div class="program-table margin-30"> 174 <div class="program-table margin-30">
170 <div class="program-tr flex-div-start" v-for="item in 5"> 175 <div class="program-tr flex-div-start" v-for="item in 5">
171 - <div class="program-td program-padding flex-div-center width-20 text-color">节点{{item}}</div> 176 + <div class="program-td program-padding flex-div-center width-20 text-color">
  177 + 节点{{item}}
  178 + </div>
172 <div class="program-td flex-1-width flex-div-start"> 179 <div class="program-td flex-1-width flex-div-start">
173 <span class="program-td-text">成功率</span> 180 <span class="program-td-text">成功率</span>
174 <span class="program-td-text">响应率</span> 181 <span class="program-td-text">响应率</span>
@@ -189,7 +196,7 @@ @@ -189,7 +196,7 @@
189 <el-row> 196 <el-row>
190 <div class="program-text margin-30 flex-div-start"> 197 <div class="program-text margin-30 flex-div-start">
191 <div><span>操作系统：194&nbsp;&nbsp;数据库：4&nbsp;&nbsp;</span></div> 198 <div><span>操作系统：194&nbsp;&nbsp;数据库：4&nbsp;&nbsp;</span></div>
192 -<!-- <span class="margin-left">20项指标</span><span class="margin-left">18项正常</span><span class="margin-left">2项异常</span>--> 199 + <!-- <span class="margin-left">20项指标</span><span class="margin-left">18项正常</span><span class="margin-left">2项异常</span>-->
193 </div> 200 </div>
194 </el-row> 201 </el-row>
195 <el-row> 202 <el-row>
@@ -197,7 +204,8 @@ @@ -197,7 +204,8 @@
197 <div class="progress-div margin-30 flex-div-start"> 204 <div class="progress-div margin-30 flex-div-start">
198 <div class="color-green">正常</div> 205 <div class="color-green">正常</div>
199 <div class="progress-con"> 206 <div class="progress-con">
200 - <el-progress stroke-width="12" :percentage="percentage2" :color="customColor" :show-text="false" /> 207 + <el-progress stroke-width="12" :percentage="percentage2" :color="customColor"
  208 + :show-text="false"/>
201 </div> 209 </div>
202 <div class="color-yellow">异常</div> 210 <div class="color-yellow">异常</div>
203 </div> 211 </div>
@@ -207,49 +215,63 @@ @@ -207,49 +215,63 @@
207 <el-col :span="24"> 215 <el-col :span="24">
208 <div class="program-table margin-30"> 216 <div class="program-table margin-30">
209 <div class="program-tr flex-div-start"> 217 <div class="program-tr flex-div-start">
210 - <div class="program-td program-padding flex-div-center width-20 text-color">7101申报管理平台</div> 218 + <div class="program-td program-padding flex-div-center width-20 text-color">
  219 + 7101申报管理平台
  220 + </div>
211 <div class="program-td flex-1-width flex-div-start"> 221 <div class="program-td flex-1-width flex-div-start">
212 <span class="program-td-text">cpu使用率</span> 222 <span class="program-td-text">cpu使用率</span>
213 <span class="program-td-text">内存使用率</span> 223 <span class="program-td-text">内存使用率</span>
214 </div> 224 </div>
215 </div> 225 </div>
216 <div class="program-tr flex-div-start"> 226 <div class="program-tr flex-div-start">
217 - <div class="program-td program-padding flex-div-center width-20 text-color">申报金三查询</div> 227 + <div class="program-td program-padding flex-div-center width-20 text-color">
  228 + 申报金三查询
  229 + </div>
218 <div class="program-td flex-1-width flex-div-start"> 230 <div class="program-td flex-1-width flex-div-start">
219 <span class="program-td-text">cpu使用率</span> 231 <span class="program-td-text">cpu使用率</span>
220 <span class="program-td-text">内存使用率</span> 232 <span class="program-td-text">内存使用率</span>
221 </div> 233 </div>
222 </div> 234 </div>
223 <div class="program-tr flex-div-start"> 235 <div class="program-tr flex-div-start">
224 - <div class="program-td program-padding flex-div-center width-20 text-color">8001:发票服务</div> 236 + <div class="program-td program-padding flex-div-center width-20 text-color">
  237 + 8001:发票服务
  238 + </div>
225 <div class="program-td flex-1-width flex-div-start"> 239 <div class="program-td flex-1-width flex-div-start">
226 <span class="program-td-text">cpu使用率</span> 240 <span class="program-td-text">cpu使用率</span>
227 <span class="program-td-text">内存使用率</span> 241 <span class="program-td-text">内存使用率</span>
228 </div> 242 </div>
229 </div> 243 </div>
230 <div class="program-tr flex-div-start"> 244 <div class="program-tr flex-div-start">
231 - <div class="program-td program-padding flex-div-center width-20 text-color">出口退税服务</div> 245 + <div class="program-td program-padding flex-div-center width-20 text-color">
  246 + 出口退税服务
  247 + </div>
232 <div class="program-td flex-1-width flex-div-start"> 248 <div class="program-td flex-1-width flex-div-start">
233 <span class="program-td-text">cpu使用率</span> 249 <span class="program-td-text">cpu使用率</span>
234 <span class="program-td-text">内存使用率</span> 250 <span class="program-td-text">内存使用率</span>
235 </div> 251 </div>
236 </div> 252 </div>
237 <div class="program-tr flex-div-start"> 253 <div class="program-tr flex-div-start">
238 - <div class="program-td program-padding flex-div-center width-20 text-color">电子税务局文书数据库</div> 254 + <div class="program-td program-padding flex-div-center width-20 text-color">
  255 + 电子税务局文书数据库
  256 + </div>
239 <div class="program-td flex-1-width flex-div-start"> 257 <div class="program-td flex-1-width flex-div-start">
240 <span class="program-td-text">RAC状态</span> 258 <span class="program-td-text">RAC状态</span>
241 <span class="program-td-text">ASM磁盘组状态</span> 259 <span class="program-td-text">ASM磁盘组状态</span>
242 </div> 260 </div>
243 </div> 261 </div>
244 <div class="program-tr flex-div-start"> 262 <div class="program-tr flex-div-start">
245 - <div class="program-td program-padding flex-div-center width-20 text-color">电子税务局申报数据库</div> 263 + <div class="program-td program-padding flex-div-center width-20 text-color">
  264 + 电子税务局申报数据库
  265 + </div>
246 <div class="program-td flex-1-width flex-div-start"> 266 <div class="program-td flex-1-width flex-div-start">
247 <span class="program-td-text">RAC状态</span> 267 <span class="program-td-text">RAC状态</span>
248 <span class="program-td-text">ASM磁盘组状态</span> 268 <span class="program-td-text">ASM磁盘组状态</span>
249 </div> 269 </div>
250 </div> 270 </div>
251 <div class="program-tr flex-div-start"> 271 <div class="program-tr flex-div-start">
252 - <div class="program-td program-padding flex-div-center width-20 text-color">网络申报wlsb-001</div> 272 + <div class="program-td program-padding flex-div-center width-20 text-color">
  273 + 网络申报wlsb-001
  274 + </div>
253 <div class="program-td flex-1-width flex-div-start"> 275 <div class="program-td flex-1-width flex-div-start">
254 <span class="program-td-text-red">服务状态</span> 276 <span class="program-td-text-red">服务状态</span>
255 </div> 277 </div>
@@ -271,25 +293,33 @@ @@ -271,25 +293,33 @@
271 <el-col :span="24"> 293 <el-col :span="24">
272 <div class="program-table margin-30"> 294 <div class="program-table margin-30">
273 <div class="program-tr flex-div-start"> 295 <div class="program-tr flex-div-start">
274 - <div class="program-td program-padding flex-div-center width-20 text-color">Nw-basedata</div> 296 + <div class="program-td program-padding flex-div-center width-20 text-color">
  297 + Nw-basedata
  298 + </div>
275 <div class="program-td flex-1-width flex-div-start"> 299 <div class="program-td flex-1-width flex-div-start">
276 <span class="program-td-text">服务</span> 300 <span class="program-td-text">服务</span>
277 </div> 301 </div>
278 </div> 302 </div>
279 <div class="program-tr flex-div-start"> 303 <div class="program-tr flex-div-start">
280 - <div class="program-td program-padding flex-div-center width-20 text-color">Nw-bzds</div> 304 + <div class="program-td program-padding flex-div-center width-20 text-color">
  305 + Nw-bzds
  306 + </div>
281 <div class="program-td flex-1-width flex-div-start"> 307 <div class="program-td flex-1-width flex-div-start">
282 <span class="program-td-text">服务</span> 308 <span class="program-td-text">服务</span>
283 </div> 309 </div>
284 </div> 310 </div>
285 <div class="program-tr flex-div-start"> 311 <div class="program-tr flex-div-start">
286 - <div class="program-td program-padding flex-div-center width-20 text-color">Nw-csht</div> 312 + <div class="program-td program-padding flex-div-center width-20 text-color">
  313 + Nw-csht
  314 + </div>
287 <div class="program-td flex-1-width flex-div-start"> 315 <div class="program-td flex-1-width flex-div-start">
288 <span class="program-td-text">服务</span> 316 <span class="program-td-text">服务</span>
289 </div> 317 </div>
290 </div> 318 </div>
291 <div class="program-tr flex-div-start"> 319 <div class="program-tr flex-div-start">
292 - <div class="program-td program-padding flex-div-center width-20 text-color">Nw-dj</div> 320 + <div class="program-td program-padding flex-div-center width-20 text-color">
  321 + Nw-dj
  322 + </div>
293 <div class="program-td flex-1-width flex-div-start"> 323 <div class="program-td flex-1-width flex-div-start">
294 <span class="program-td-text">服务</span> 324 <span class="program-td-text">服务</span>
295 </div> 325 </div>
@@ -319,16 +349,11 @@ @@ -319,16 +349,11 @@
319 349
320 350
321 </el-row> 351 </el-row>
322 -<!-- <el-row >-->  
323 -<!-- <el-col :span="24">-->  
324 -<!-- <div class="btn-faultDiagnosis margin-top-bottom-30">-->  
325 -<!-- <el-button type="primary" @click="onSubmit">保存</el-button>-->  
326 -<!-- </div>-->  
327 -<!-- </el-col>-->  
328 -<!-- </el-row>-->  
329 </div> 352 </div>
330 353
331 </el-dialog> 354 </el-dialog>
332 </div> 355 </div>
333 356
  357 + </div>
  358 + </div>
334 </div> 359 </div>
@@ -39,6 +39,8 @@ export default { @@ -39,6 +39,8 @@ export default {
39 }, 39 },
40 setup(){ 40 setup(){
41 const {proxy} = Vue.getCurrentInstance(); 41 const {proxy} = Vue.getCurrentInstance();
  42 + let height = Vue.ref(window.innerHeight - 20);
  43 +
42 const faultHandleForm={ 44 const faultHandleForm={
43 categories: '业务指标故障', 45 categories: '业务指标故障',
44 faultBody: '电子税务局可用性下降到90%', 46 faultBody: '电子税务局可用性下降到90%',
@@ -51,7 +53,8 @@ export default { @@ -51,7 +53,8 @@ export default {
51 range:'电子税务局系统', 53 range:'电子税务局系统',
52 }; 54 };
53 return{ 55 return{
54 - faultHandleForm 56 + faultHandleForm,
  57 + height
55 } 58 }
56 }, 59 },
57 computed: {}, 60 computed: {},
  1 +<div class="container" :style="{'height':height+'px','max-height':height+'px'}">
  2 + <div class="cm-card" :style="{'min-height':height+'px','max-height':height+'px','height':'100%'}">
  3 + <div class="search">
  4 + <!--<el-form :inline="true" :model="formInline" class="demo-form-inline">
  5 + <el-form-item >
  6 + <el-input v-model="formInline.user" placeholder="Approved by"></el-input>
  7 + </el-form-item>
  8 + <el-form-item >
  9 + <el-input v-model="formInline.user" placeholder="Approved by"></el-input>
  10 + </el-form-item>
  11 + <el-form-item >
  12 + <el-input v-model="formInline.user" placeholder="Approved by"></el-input>
  13 + </el-form-item>
  14 + <el-form-item >
  15 + <el-input v-model="formInline.user" placeholder="Approved by"></el-input>
  16 + </el-form-item>
  17 + <el-form-item >
  18 + <el-input v-model="formInline.user" placeholder="Approved by"></el-input>
  19 + </el-form-item>
  20 + <el-form-item >
  21 + <el-select v-model="formInline.region" placeholder="Activity zone">
  22 + <el-option label="Zone one" value="shanghai"></el-option>
  23 + <el-option label="Zone two" value="beijing"></el-option>
  24 + </el-select>
  25 + </el-form-item>
  26 + <el-form-item>
  27 + <el-button type="primary" @click="onSubmit">Query</el-button>
  28 + </el-form-item>
  29 + </el-form>-->
  30 + <div class="condition">
  31 + <el-form-item>
  32 + <el-input v-model="formInline.user" placeholder="Approved by"></el-input>
  33 + </el-form-item>
  34 + <el-form-item>
  35 + <el-input v-model="formInline.user" placeholder="Approved by"></el-input>
  36 + </el-form-item>
  37 + <el-form-item>
  38 + <el-input v-model="formInline.user" placeholder="Approved by"></el-input>
  39 + </el-form-item>
  40 + <el-form-item>
  41 + <el-select v-model="formInline.region" placeholder="Activity zone">
  42 + <el-option label="Zone one" value="shanghai"></el-option>
  43 + <el-option label="Zone two" value="beijing"></el-option>
  44 + </el-select>
  45 + </el-form-item>
  46 +
  47 + </div>
  48 + <div class="btns">
  49 + <el-form-item>
  50 + <el-button type="primary" @click="onSubmit">Query</el-button>
  51 + </el-form-item>
  52 + </div>
  53 + </div>
  54 +
  55 + <cm-table-page :columns="[]" :dataList="[]"
  56 + @loaddata="getPage" :showIndex="true"
  57 + :showIndex="true"
  58 + :showSelection="true"
  59 + :pageSizes="[10,50,90, 200, 300, 400]" :pageSize="limit"
  60 + :showBorder="true" :currentPage="currentPage" :total="total" :loading="false"
  61 + :showPage="true" :height="(height - 95)"
  62 + :maxWidth="max">
  63 + </cm-table-page>
  64 + </div>
  65 +</div>
  1 +export default {
  2 + name: 'resIndex',
  3 + template: '',
  4 + components: {
  5 + 'tree-config': Vue.defineAsyncComponent(
  6 + () => myImport('components/page/res/treeconfig/index')
  7 + ),
  8 + },
  9 + data() {
  10 + return {
  11 + props : {
  12 + label:'label',
  13 + children:'children'
  14 + }
  15 + }
  16 + },
  17 + setup() {
  18 + const {proxy} = Vue.getCurrentInstance();
  19 + let height = Vue.ref(window.innerHeight -20);
  20 +
  21 + let formInline = Vue.ref({
  22 + user: '',
  23 + region: '',
  24 + });
  25 + // 挂载完
  26 + Vue.onMounted(() => {
  27 +
  28 + })
  29 +
  30 +
  31 + return {
  32 + height,
  33 + formInline
  34 + }
  35 + }
  36 +}