Merge branch 'master-v32-lushangqing' into 'master'
故障诊断相关页面 See merge request !105
Showing
16 changed files
with
562 additions
and
9 deletions
@@ -11,6 +11,9 @@ | @@ -11,6 +11,9 @@ | ||
11 | .margin-30{ | 11 | .margin-30{ |
12 | margin:0 30px; | 12 | margin:0 30px; |
13 | } | 13 | } |
14 | +.margin-all-30{ | ||
15 | + margin:30px | ||
16 | +} | ||
14 | .margin-top{ | 17 | .margin-top{ |
15 | margin-top:30px; | 18 | margin-top:30px; |
16 | } | 19 | } |
@@ -337,4 +340,43 @@ | @@ -337,4 +340,43 @@ | ||
337 | .network-monitor-popup .list-net.isActive .multiple-choice-button{ | 340 | .network-monitor-popup .list-net.isActive .multiple-choice-button{ |
338 | color:#3B91FF; | 341 | color:#3B91FF; |
339 | 342 | ||
343 | +} | ||
344 | +.margin-left-30{ | ||
345 | + margin-left:30px; | ||
346 | +} | ||
347 | + | ||
348 | +.faultAddIndex{ | ||
349 | + background-color: #F4F5FA; | ||
350 | + height:100%; | ||
351 | + padding-top: 20px; | ||
352 | +} | ||
353 | +.faultAddIndex-img{ | ||
354 | + width: 40%; | ||
355 | + margin: 20px auto; | ||
356 | + border: 1px dashed #3B91FF; | ||
357 | + padding:30px; | ||
358 | +} | ||
359 | +.faultAddIndex-img span{ | ||
360 | + color:#3B91FF; | ||
361 | + margin-top:30px; | ||
362 | +} | ||
363 | +.flex-clum{ | ||
364 | + display: flex; | ||
365 | + flex-flow: column; | ||
366 | + align-items: center; | ||
367 | + justify-content: center; | ||
368 | +} | ||
369 | +.search-text{ | ||
370 | + color:#FFFFFF; | ||
371 | + background-color: #3B91FF; | ||
372 | + width:90px; | ||
373 | + padding:9px 5px; | ||
374 | +} | ||
375 | +.doc-name{ | ||
376 | + color:#666666; | ||
377 | + margin-top:10px; | ||
378 | + font-size: 12px; | ||
379 | +} | ||
380 | +.doc-list,.doc-list-add{ | ||
381 | + cursor: pointer; | ||
340 | } | 382 | } |
@@ -5,4 +5,138 @@ | @@ -5,4 +5,138 @@ | ||
5 | } | 5 | } |
6 | .btn-search{ | 6 | .btn-search{ |
7 | margin-left: 20px; | 7 | margin-left: 20px; |
8 | +} | ||
9 | +.faultForm-table .el-table th.el-table__cell{ | ||
10 | + background-color: #d3f1fc; | ||
11 | + color:#3B91FF; | ||
12 | +} | ||
13 | +.handleBtn{ | ||
14 | + color:#6667ff; | ||
15 | + cursor: pointer; | ||
16 | +} | ||
17 | +.dialog-fault .el-form-item__label{ | ||
18 | + color:#3B91FF; | ||
19 | +} | ||
20 | +.div-fault .el-form-item__content{ | ||
21 | + text-align: left; | ||
22 | +} | ||
23 | +.diagnosisDoc-content{ | ||
24 | + margin:30px 40px; | ||
25 | + position: relative; | ||
26 | +} | ||
27 | +.diagnosisBtn{ | ||
28 | + color:#ff7979; | ||
29 | + cursor: pointer; | ||
30 | +} | ||
31 | +.step-img-dia{ | ||
32 | + width: 50px; | ||
33 | + height:50px; | ||
34 | + border-radius: 50%; | ||
35 | + background-color:#1bdf71; | ||
36 | +} | ||
37 | +.list-line-dia{ | ||
38 | + width: 84px; | ||
39 | + border-top:5px solid #1bdf71; | ||
40 | +} | ||
41 | +.step-img-yellow{ | ||
42 | + background-color:#fea500; | ||
43 | + | ||
44 | +} | ||
45 | +.list-line-dia-yellow{ | ||
46 | + border-top-color: #fea500; | ||
47 | +} | ||
48 | +.step-img-red{ | ||
49 | + background-color:#fe0000; | ||
50 | +} | ||
51 | +.list-line-dia-red{ | ||
52 | + border-top-color: #fe0000; | ||
53 | +} | ||
54 | + | ||
55 | +.diagnosisDoc-content .list-stet-net:last-child .list-line-dia{ | ||
56 | + display: none; | ||
57 | +} | ||
58 | +.progress-con{ | ||
59 | + width:80%; | ||
60 | + margin:0 20px; | ||
61 | +} | ||
62 | +.program-text{ | ||
63 | + color:#666666; | ||
64 | + margin-bottom: 15px; | ||
65 | +} | ||
66 | +.color-yellow{ | ||
67 | + color:#fea500; | ||
68 | +} | ||
69 | +.color-green{ | ||
70 | + color:#1bdf71; | ||
71 | +} | ||
72 | +.progress-div .el-progress-bar__outer{ | ||
73 | + background-color: #fea500; | ||
74 | +} | ||
75 | +.margin-left{ | ||
76 | + margin-left:10px; | ||
77 | +} | ||
78 | +.program-table{ | ||
79 | + border:1px solid #ccc; | ||
80 | + margin-top:20px; | ||
81 | +} | ||
82 | +.width-20{ | ||
83 | + width:20%; | ||
84 | +} | ||
85 | +.text-color{ | ||
86 | + color:#3B91FF; | ||
87 | +} | ||
88 | +.program-td{ | ||
89 | + border-right: 1px solid #ccc; | ||
90 | + border-bottom: 1px solid #ccc; | ||
91 | +} | ||
92 | +.program-padding{ | ||
93 | + padding:16px 20px; | ||
94 | + | ||
95 | +} | ||
96 | +.flex-1-width{ | ||
97 | + flex:1; | ||
98 | +} | ||
99 | +.program-td-text{ | ||
100 | + padding: 15px 30px; | ||
101 | + color: #fff; | ||
102 | + margin-right:3px; | ||
103 | + background: #1bdf71; | ||
104 | + | ||
105 | +} | ||
106 | +.program-td-text-green{ | ||
107 | + background: #1bdf71; | ||
108 | + | ||
109 | +} | ||
110 | +.program-td-text-yellow{ | ||
111 | + background: #fea500; | ||
112 | + | ||
113 | +} | ||
114 | +.program-td-text-red{ | ||
115 | + background: #fe0000; | ||
116 | +} | ||
117 | +.program-tr:last-child .program-td{ | ||
118 | + border-bottom:none; | ||
119 | +} | ||
120 | +.program-tr .program-td:last-child{ | ||
121 | + border-right:none; | ||
122 | +} | ||
123 | +.margin-left-30{ | ||
124 | + margin-left: 30px; | ||
125 | +} | ||
126 | +.program-div{ | ||
127 | + border:1px solid #ccc; | ||
128 | + padding:15px ; | ||
129 | + flex:1; | ||
130 | +} | ||
131 | +.margin-top-bottom-30{ | ||
132 | + margin:30px 0; | ||
133 | +} | ||
134 | +.margin-top-bottom-10{ | ||
135 | + margin:10px 0; | ||
136 | + | ||
137 | +} | ||
138 | +.export-div{ | ||
139 | + position: absolute; | ||
140 | + right:0; | ||
141 | + top:0; | ||
8 | } | 142 | } |
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/faultDiagnosis/icon-add.png
0 → 100644

1.4 KB
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/faultDiagnosis/icon-delete.png
0 → 100644

674 Bytes
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/faultDiagnosis/icon-doc.png
0 → 100644

1.77 KB
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/faultDiagnosis/icon-export.png
0 → 100644

414 Bytes
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/faultDiagnosis/icon-green.png
0 → 100644

686 Bytes
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/faultDiagnosis/icon-yellow.png
0 → 100644

643 Bytes
@@ -123,15 +123,23 @@ const routes = [{ | @@ -123,15 +123,23 @@ const routes = [{ | ||
123 | { | 123 | { |
124 | path: '/fault/index', | 124 | path: '/fault/index', |
125 | name: 'view', | 125 | name: 'view', |
126 | - // component: () => myImport('views/faultDiagnosis/index') | ||
127 | - component: () => myImport('views/faultDiagnosis/components/faultForm/index') | ||
128 | - | 126 | + component: () => myImport('views/faultDiagnosis/index') |
129 | }, | 127 | }, |
130 | - /*{ | 128 | + { |
131 | path: '/fault/faultForm', | 129 | path: '/fault/faultForm', |
132 | - name: 'view', | 130 | + name: 'faultForm', |
133 | component: () => myImport('views/faultDiagnosis/components/faultForm/index') | 131 | component: () => myImport('views/faultDiagnosis/components/faultForm/index') |
134 | - }*/ | 132 | + }, |
133 | + { | ||
134 | + path: '/fault/faultAddIndex', | ||
135 | + name: 'faultAddIndex', | ||
136 | + component: () => myImport('views/faultDiagnosis/components/faultAddIndex/index') | ||
137 | + }, | ||
138 | + { | ||
139 | + path: '/fault/diagnosisDoc', | ||
140 | + name: 'diagnosisDoc', | ||
141 | + component: () => myImport('views/faultDiagnosis/components/diagnosisDoc/index') | ||
142 | + } | ||
135 | ]; | 143 | ]; |
136 | 144 | ||
137 | // hash模式: createWebHashHistory | 145 | // hash模式: createWebHashHistory |
1 | +<div class="faultAddIndex diagnosisDoc"> | ||
2 | + <el-row> | ||
3 | + <el-col :span="6"> | ||
4 | + <div class="search-input margin-30 flex-div-start"> | ||
5 | + <el-input v-model="input" placeholder="故障诊断" /> | ||
6 | + <span class="search-text">搜索</span> | ||
7 | + </div> | ||
8 | + | ||
9 | + </el-col> | ||
10 | + </el-row> | ||
11 | + <el-row class="margin-all-30"> | ||
12 | + <el-col :span="3" v-for="item in 2"> | ||
13 | + <div class="doc-list flex-clum"> | ||
14 | + <img src="./src/assets/images/faultDiagnosis/icon-doc.png" alt=""> | ||
15 | + <span class="doc-name">电子税务局可用性诊断</span> | ||
16 | + </div> | ||
17 | + </el-col> | ||
18 | + <el-col :span="3"> | ||
19 | + <div class="doc-list-add" @click="addDiagnosisDoc"> | ||
20 | + <img src="./src/assets/images/faultDiagnosis/icon-add.png" alt=""> | ||
21 | + </div> | ||
22 | + </el-col> | ||
23 | + </el-row> | ||
24 | +</div> |
1 | +export default { | ||
2 | + name: 'diagnosisDoc', | ||
3 | + template: '', | ||
4 | + components: {}, | ||
5 | + data () { | ||
6 | + return { | ||
7 | + | ||
8 | + } | ||
9 | + }, | ||
10 | + setup(){ | ||
11 | + const {proxy} = Vue.getCurrentInstance(); | ||
12 | + | ||
13 | + }, | ||
14 | + computed: {}, | ||
15 | + methods: { | ||
16 | + //添加 | ||
17 | + addDiagnosisDoc(){} | ||
18 | + }, | ||
19 | + mounted () { | ||
20 | + | ||
21 | + }, | ||
22 | + unmounted () {} | ||
23 | + | ||
24 | +} |
1 | +export default { | ||
2 | + name: 'faultAddIndex', | ||
3 | + template: '', | ||
4 | + components: {}, | ||
5 | + data () { | ||
6 | + return { | ||
7 | + | ||
8 | + } | ||
9 | + }, | ||
10 | + setup(){ | ||
11 | + const {proxy} = Vue.getCurrentInstance(); | ||
12 | + | ||
13 | + }, | ||
14 | + computed: {}, | ||
15 | + methods: { | ||
16 | + //添加 | ||
17 | + addFault(){} | ||
18 | + }, | ||
19 | + mounted () { | ||
20 | + | ||
21 | + }, | ||
22 | + unmounted () {} | ||
23 | + | ||
24 | +} |
@@ -22,6 +22,254 @@ | @@ -22,6 +22,254 @@ | ||
22 | </el-col> | 22 | </el-col> |
23 | </el-row> | 23 | </el-row> |
24 | <el-row> | 24 | <el-row> |
25 | - el | 25 | + <el-col :span="24"> |
26 | + <div class="faultForm-table margin-top flex-div-start margin-30"> | ||
27 | + <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="故障主体" 个 > | ||
31 | + <template #default="scope"> | ||
32 | + <div class="diagnosisBtn"> | ||
33 | + <span @click="handleDiagnosis(scope.row)" class="list-data-text">{{ scope.row.faultBody}}</span> | ||
34 | + </div> | ||
35 | + </template> | ||
36 | + </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="操作" 个 > | ||
45 | + <template #default="scope"> | ||
46 | + <div class="handleBtn"> | ||
47 | + <span @click="handleFault(scope.row)" class="list-data-text">处理{{ scope.row.categories }}</span> | ||
48 | + </div> | ||
49 | + </template> | ||
50 | + </el-table-column> | ||
51 | + </el-table> | ||
52 | + </div> | ||
53 | + </el-col> | ||
26 | </el-row> | 54 | </el-row> |
55 | + <!--处理故障弹框--> | ||
56 | + <div class="dialog-fault popup-bg"> | ||
57 | + <el-dialog v-model="faultDiagnosisVisible" title="故障处理内容" width="60%"> | ||
58 | + <el-form ref="faultHandleForm" :model="faultHandleForm" label-width="120px"> | ||
59 | + <el-row> | ||
60 | + <el-col :span="12"> | ||
61 | + <el-form-item label="故障分类"> | ||
62 | + <el-input v-model="faultHandleForm.categories"></el-input> | ||
63 | + </el-form-item> | ||
64 | + <el-form-item label="当前状态"> | ||
65 | + <el-input v-model="faultHandleForm.state"></el-input> | ||
66 | + </el-form-item> | ||
67 | + <el-form-item label="故障主体"> | ||
68 | + <el-input v-model="faultHandleForm.faultBody"></el-input> | ||
69 | + </el-form-item> | ||
70 | + <el-form-item class="flex-div-start div-fault " label="处理结果"> | ||
71 | + <el-radio-group v-model="faultHandleForm.state"> | ||
72 | + <el-radio label="未解决"></el-radio> | ||
73 | + <el-radio label="已解决"></el-radio> | ||
74 | + </el-radio-group> | ||
75 | + </el-form-item> | ||
76 | + </el-col> | ||
77 | + <el-col :span="12"> | ||
78 | + <el-form-item label="发生时间"> | ||
79 | + <el-input v-model="faultHandleForm.startTime"></el-input> | ||
80 | + </el-form-item> | ||
81 | + <el-form-item label="持续时长"> | ||
82 | + <el-input v-model="faultHandleForm.duration"></el-input> | ||
83 | + </el-form-item> | ||
84 | + <el-form-item label="影响范围"> | ||
85 | + <el-input v-model="faultHandleForm.range"></el-input> | ||
86 | + </el-form-item> | ||
87 | + <el-form-item label="处理时间"> | ||
88 | + <el-input v-model="faultHandleForm.handleTime"></el-input> | ||
89 | + </el-form-item> | ||
90 | + </el-col> | ||
91 | + </el-row> | ||
92 | + <el-row> | ||
93 | + <el-col :span="24"> | ||
94 | + <el-form-item label="原因分析"> | ||
95 | + <el-input :rows="4" v-model="faultHandleForm.desc" type="textarea"></el-input> | ||
96 | + </el-form-item> | ||
97 | + </el-col> | ||
98 | + | ||
99 | + </el-row> | ||
100 | + <el-row> | ||
101 | + <el-col :span="24"> | ||
102 | + <el-form-item label="处理方案"> | ||
103 | + <el-input :rows="4" v-model="faultHandleForm.programme" type="textarea"></el-input> | ||
104 | + </el-form-item> | ||
105 | + </el-col> | ||
106 | + </el-row> | ||
107 | + <el-row> | ||
108 | + <el-col :span="24"> | ||
109 | + <div class="btn-faultDiagnosis"> | ||
110 | + <el-button>取消</el-button> | ||
111 | + <el-button type="primary" @click="onSubmit">保存</el-button> | ||
112 | + </div> | ||
113 | + </el-col> | ||
114 | + </el-row> | ||
115 | + </el-form> | ||
116 | + | ||
117 | + </el-dialog> | ||
118 | + <el-dialog v-model="faultDiagnosisDocVisible" title="电子税务局业务诊断报告" width="60%"> | ||
119 | + <div class="diagnosisDoc-content"> | ||
120 | + <div class="export-div" @click="exportDoc"><img src="./src/assets/images/faultDiagnosis/icon-export.png" alt=""></div> | ||
121 | + <el-row> | ||
122 | + <el-col :span="6"> | ||
123 | + <div class="title-text"> | ||
124 | + <img src="./src/assets/images/faultDiagnosis/icon-green.png" class="title-img"> | ||
125 | + <span>网络检测</span> | ||
126 | + </div> | ||
127 | + </el-col> | ||
128 | + </el-row> | ||
129 | + <el-row> | ||
130 | + <el-col :span="3" class="list-stet-net" v-for="(item,index) in 4"> | ||
131 | + <div class="list-step flex-div-start"> | ||
132 | + <div class="list-step-top flex-div margin-30"> | ||
133 | + <div :class="['step-img-dia',{'step-img-yellow':index==0,'step-img-red':index==2}]"> | ||
134 | + <i class="icon-step"></i> | ||
135 | + </div> | ||
136 | + <span :class="['list-line-dia',{'list-line-dia-yellow':index==0,'list-line-dia-red':index==2}]"></span> | ||
137 | + </div> | ||
138 | + | ||
139 | + </div> | ||
140 | + </el-col> | ||
141 | + </el-row> | ||
142 | + <el-row> | ||
143 | + <el-col :span="6"> | ||
144 | + <div class="title-text"> | ||
145 | + <img src="./src/assets/images/faultDiagnosis/icon-yellow.png" class="title-img"> | ||
146 | + <span>应用检测</span> | ||
147 | + </div> | ||
148 | + </el-col> | ||
149 | + </el-row> | ||
150 | + <el-row> | ||
151 | + <div class="program-text margin-30 flex-div-start"> | ||
152 | + <div>检测量:<span>5节点</span></div> | ||
153 | + <span class="margin-left">20项指标</span><span class="margin-left">18项正常</span><span class="margin-left">2项异常</span> | ||
154 | + </div> | ||
155 | + </el-row> | ||
156 | + <el-row> | ||
157 | + <el-col :span="24"> | ||
158 | + <div class="progress-div margin-30 flex-div-start"> | ||
159 | + <div class="color-green">正常</div> | ||
160 | + <div class="progress-con"> | ||
161 | + <el-progress stroke-width="12" :percentage="percentage" :color="customColor" :show-text="false" /> | ||
162 | + </div> | ||
163 | + <div class="color-yellow">异常</div> | ||
164 | + </div> | ||
165 | + </el-col> | ||
166 | + </el-row> | ||
167 | + <el-row> | ||
168 | + <el-col :span="24"> | ||
169 | + <div class="program-table margin-30"> | ||
170 | + <div class="program-tr flex-div-start" v-for="item in 4"> | ||
171 | + <div class="program-td program-padding flex-div-center width-20 text-color">节点{{item}}</div> | ||
172 | + <div class="program-td flex-1-width flex-div-start"> | ||
173 | + <span :class="['program-td-text',{'program-td-text-yellow':item==1,'program-td-text-red':item==2}]">交易量响应时间</span> | ||
174 | + <span class="program-td-text">响应时间</span> | ||
175 | + </div> | ||
176 | + </div> | ||
177 | + </div> | ||
178 | + </el-col> | ||
179 | + </el-row> | ||
180 | + | ||
181 | + <el-row> | ||
182 | + <el-col :span="6"> | ||
183 | + <div class="title-text"> | ||
184 | + <img src="./src/assets/images/faultDiagnosis/icon-yellow.png" class="title-img"> | ||
185 | + <span>基础环境</span> | ||
186 | + </div> | ||
187 | + </el-col> | ||
188 | + </el-row> | ||
189 | + <el-row> | ||
190 | + <div class="program-text margin-30 flex-div-start"> | ||
191 | + <div>检测量:<span>50节点</span></div> | ||
192 | + <span class="margin-left">20项指标</span><span class="margin-left">18项正常</span><span class="margin-left">2项异常</span> | ||
193 | + </div> | ||
194 | + </el-row> | ||
195 | + <el-row> | ||
196 | + <el-col :span="24"> | ||
197 | + <div class="progress-div margin-30 flex-div-start"> | ||
198 | + <div class="color-green">正常</div> | ||
199 | + <div class="progress-con"> | ||
200 | + <el-progress stroke-width="12" :percentage="percentage" :color="customColor" :show-text="false" /> | ||
201 | + </div> | ||
202 | + <div class="color-yellow">异常</div> | ||
203 | + </div> | ||
204 | + </el-col> | ||
205 | + </el-row> | ||
206 | + <el-row> | ||
207 | + <el-col :span="24"> | ||
208 | + <div class="program-table margin-30"> | ||
209 | + <div class="program-tr flex-div-start" v-for="item in 4"> | ||
210 | + <div class="program-td program-padding flex-div-center width-20 text-color">服务器{{item}}</div> | ||
211 | + <div class="program-td flex-1-width flex-div-start"> | ||
212 | + <span :class="['program-td-text',{'program-td-text-yellow':item==1,'program-td-text-red':item==2}]">cpu</span> | ||
213 | + <span class="program-td-text">PNG状态</span> | ||
214 | + </div> | ||
215 | + </div> | ||
216 | + </div> | ||
217 | + </el-col> | ||
218 | + </el-row> | ||
219 | + | ||
220 | + <el-row> | ||
221 | + <el-col :span="6"> | ||
222 | + <div class="title-text margin-left-30"> | ||
223 | + <span>APM</span> | ||
224 | + </div> | ||
225 | + </el-col> | ||
226 | + </el-row> | ||
227 | + | ||
228 | + <el-row> | ||
229 | + <el-col :span="24"> | ||
230 | + <div class="program-table margin-30"> | ||
231 | + <div class="program-tr flex-div-start" v-for="item in 4"> | ||
232 | + <div class="program-td program-padding flex-div-center width-20 text-color">arms{{item}}</div> | ||
233 | + <div class="program-td flex-1-width flex-div-start"> | ||
234 | + | ||
235 | + <span class="program-td-text">服务</span> | ||
236 | + </div> | ||
237 | + </div> | ||
238 | + </div> | ||
239 | + </el-col> | ||
240 | + </el-row> | ||
241 | + | ||
242 | + <el-row> | ||
243 | + <el-col :span="6"> | ||
244 | + <div class="title-text margin-left-30"> | ||
245 | + <span>推荐解决方案</span> | ||
246 | + </div> | ||
247 | + </el-col> | ||
248 | + </el-row> | ||
249 | + <el-row v-for="item in 2"> | ||
250 | + <el-col :span="24" class="margin-top-bottom-10"> | ||
251 | + <div class="flex-div-start margin-30 "> | ||
252 | + <div class="text-color"> | ||
253 | + 解决方案{{item}}: | ||
254 | + </div> | ||
255 | + <div class="program-div"> | ||
256 | + 可通过人工调整的方式解决 | ||
257 | + </div> | ||
258 | + </div> | ||
259 | + </el-col> | ||
260 | + | ||
261 | + | ||
262 | + </el-row> | ||
263 | + <el-row > | ||
264 | + <el-col :span="24"> | ||
265 | + <div class="btn-faultDiagnosis margin-top-bottom-30"> | ||
266 | + <el-button type="primary" @click="onSubmit">保存</el-button> | ||
267 | + </div> | ||
268 | + </el-col> | ||
269 | + </el-row> | ||
270 | + </div> | ||
271 | + | ||
272 | + </el-dialog> | ||
273 | + </div> | ||
274 | + | ||
27 | </div> | 275 | </div> |
@@ -4,14 +4,56 @@ export default { | @@ -4,14 +4,56 @@ export default { | ||
4 | components: {}, | 4 | components: {}, |
5 | data () { | 5 | data () { |
6 | return { | 6 | return { |
7 | - options:[{value:120,label:'name'}] | 7 | + options:[{value:120,label:'name'}], |
8 | + faultFormTableData: [ | ||
9 | + { | ||
10 | + categories: '业务指标故障', | ||
11 | + faultBody: '电子税务局可用性下降到90%', | ||
12 | + startTime:'2021-10-12 10:00:00', | ||
13 | + state:'已解决', | ||
14 | + mode:'人工处理', | ||
15 | + handleTime:'2021-11-11 11:11:11', | ||
16 | + handlePeople:'张三', | ||
17 | + duration:'1小时', | ||
18 | + range:'电子税务局系统', | ||
19 | + }, | ||
20 | + | ||
21 | + ], | ||
22 | + faultDiagnosisVisible:false,//处理故障弹框 | ||
23 | + faultDiagnosisDocVisible:false,//电子税务局诊断报告弹框 | ||
24 | + faultHandleForm:'',//处理故障数据 | ||
25 | + percentage: 80, | ||
26 | + customColor: '#1bdf71', | ||
27 | + } | ||
28 | + }, | ||
29 | + setup(){ | ||
30 | + const {proxy} = Vue.getCurrentInstance(); | ||
31 | + const faultHandleForm=Vue.ref({}); | ||
32 | + return{ | ||
33 | + faultHandleForm | ||
8 | } | 34 | } |
9 | }, | 35 | }, |
10 | computed: {}, | 36 | computed: {}, |
11 | methods: { | 37 | methods: { |
38 | + //处理 | ||
39 | + handleFault(item){ | ||
40 | + console.log("333",item) | ||
41 | + this.faultHandleForm=item; | ||
42 | + this.faultDiagnosisVisible=true; | ||
43 | + | ||
44 | + }, | ||
45 | + //诊断书 | ||
46 | + handleDiagnosis(item){ | ||
47 | + this.faultDiagnosisDocVisible=true; | ||
48 | + }, | ||
49 | + //下载 | ||
50 | + exportDoc(){ | ||
51 | + | ||
52 | + } | ||
53 | + }, | ||
54 | + mounted () { | ||
12 | 55 | ||
13 | }, | 56 | }, |
14 | - mounted () {}, | ||
15 | unmounted () {} | 57 | unmounted () {} |
16 | 58 | ||
17 | } | 59 | } |
@@ -49,6 +49,7 @@ export default { | @@ -49,6 +49,7 @@ export default { | ||
49 | name: 'Tom', | 49 | name: 'Tom', |
50 | address: 'No. 189, Grove St, Los Angeles', | 50 | address: 'No. 189, Grove St, Los Angeles', |
51 | }, | 51 | }, |
52 | + | ||
52 | ],//基础环境表格数据 | 53 | ],//基础环境表格数据 |
53 | //网络检测选中项集合 | 54 | //网络检测选中项集合 |
54 | networkMonitorList: [ | 55 | networkMonitorList: [ |
-
Please register or login to post a comment