Merge branch 'master' of http://113.200.75.45:82/monitor_v3/hg-monitor-web into master-v32-xwx
Showing
42 changed files
with
1726 additions
and
140 deletions
@@ -3486,7 +3486,7 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele | @@ -3486,7 +3486,7 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele | ||
3486 | }); | 3486 | }); |
3487 | }); | 3487 | }); |
3488 | $("#kpi_press_times_id").find('textarea.layui-layer-input').val(num); | 3488 | $("#kpi_press_times_id").find('textarea.layui-layer-input').val(num); |
3489 | - $("#kpi_press_times_id").find('textarea.layui-layer-input').css({height:"25px"}).attr("placeholder", "压制次数(必填)") | 3489 | + $("#kpi_press_times_id").find('textarea.layui-layer-input').css({height:"25px"}).attr("placeholder", "压制次数(必填,建议100以内)") |
3490 | .attr("onkeyup","value=value.replace(/^(0+)|[^\\d]+/g,'')"); | 3490 | .attr("onkeyup","value=value.replace(/^(0+)|[^\\d]+/g,'')"); |
3491 | } | 3491 | } |
3492 | }); | 3492 | }); |
@@ -11,7 +11,7 @@ layui.define(['sessions', 'form', 'common'],function (exports) { | @@ -11,7 +11,7 @@ layui.define(['sessions', 'form', 'common'],function (exports) { | ||
11 | , sessions = layui.sessions; | 11 | , sessions = layui.sessions; |
12 | 12 | ||
13 | var uuid = Math.uuid(); | 13 | var uuid = Math.uuid(); |
14 | - var lockNum = 10;//默认十次登录冻结 | 14 | + var lockNum = 5;//默认5次登录冻结,兼容天津 |
15 | //获取默认配置 | 15 | //获取默认配置 |
16 | $.ajax({ | 16 | $.ajax({ |
17 | url: '/config/getConfig', | 17 | url: '/config/getConfig', |
@@ -20,13 +20,15 @@ layui.define(['sessions', 'form', 'common'],function (exports) { | @@ -20,13 +20,15 @@ layui.define(['sessions', 'form', 'common'],function (exports) { | ||
20 | }, | 20 | }, |
21 | async: false, | 21 | async: false, |
22 | success(response) { | 22 | success(response) { |
23 | - lockNum = response.lockNum; | 23 | + if (response && response.lockNum){ //如果配置了锁定次数,则更新 |
24 | + lockNum = response.lockNum; | ||
25 | + } | ||
24 | } | 26 | } |
25 | }); | 27 | }); |
26 | 28 | ||
27 | //如果密码输入错误三次,第四次开启验证码 | 29 | //如果密码输入错误三次,第四次开启验证码 |
28 | if (sessionStorage.getItem("lockNum") && sessionStorage.getItem("lockNum") >= 3) { | 30 | if (sessionStorage.getItem("lockNum") && sessionStorage.getItem("lockNum") >= 3) { |
29 | - if (sessionStorage.getItem("lockNum") && sessionStorage.getItem("lockNum") > 5) { | 31 | + if (sessionStorage.getItem("lockNum") && sessionStorage.getItem("lockNum") > lockNum) { |
30 | layer.alert('账号已被锁定,请联系管理员!'); | 32 | layer.alert('账号已被锁定,请联系管理员!'); |
31 | } | 33 | } |
32 | //图形验证码 | 34 | //图形验证码 |
@@ -119,6 +121,14 @@ layui.define(['sessions', 'form', 'common'],function (exports) { | @@ -119,6 +121,14 @@ layui.define(['sessions', 'form', 'common'],function (exports) { | ||
119 | 121 | ||
120 | var loginErrorNum = sessionStorage.getItem("lockNum") && sessionStorage.getItem("lockNum") != null ? parseInt(sessionStorage.getItem("lockNum")) : 0; | 122 | var loginErrorNum = sessionStorage.getItem("lockNum") && sessionStorage.getItem("lockNum") != null ? parseInt(sessionStorage.getItem("lockNum")) : 0; |
121 | 123 | ||
124 | + //增加4-20位密码验证 joke add 20211214 | ||
125 | + form.verify({ | ||
126 | + password: function (d) { | ||
127 | + if (d.trim() <= 4) { | ||
128 | + return "密码最少4位" | ||
129 | + } | ||
130 | + } | ||
131 | + }); | ||
122 | form.on('submit(LAY-user-login-submit)', function (obj) { | 132 | form.on('submit(LAY-user-login-submit)', function (obj) { |
123 | login(obj); | 133 | login(obj); |
124 | return false; | 134 | return false; |
@@ -19,7 +19,7 @@ | @@ -19,7 +19,7 @@ | ||
19 | </div> | 19 | </div> |
20 | <div class="layui-form-item"> | 20 | <div class="layui-form-item"> |
21 | <label class="layadmin-user-login-icon layui-icon layui-icon-password" for="loginPswd"></label> | 21 | <label class="layadmin-user-login-icon layui-icon layui-icon-password" for="loginPswd"></label> |
22 | - <input type="password" name="password" id="loginPswd" lay-verify="required" placeholder="密码" | 22 | + <input type="password" name="password" id="loginPswd" lay-verify="required|password" minlength="4" placeholder="密码" |
23 | class="layui-input"> | 23 | class="layui-input"> |
24 | </div> | 24 | </div> |
25 | <!--验证码--> | 25 | <!--验证码--> |
hg-monitor-web-base/src/main/resources/static/vue3/src/components/common/echarts/bar/index.js
0 → 100644
1 | +/** | ||
2 | + * https://echarts.apache.org/examples/zh/editor.html?c=pie-simple | ||
3 | + * <p> | ||
4 | + * 作者: Wang | ||
5 | + * 时间:2021/12/3 14:30 | ||
6 | + */ | ||
7 | +export default { | ||
8 | + name: 'echarts-line', | ||
9 | + template: '', | ||
10 | + components: {}, | ||
11 | + props: { | ||
12 | + // 单位px | ||
13 | + width: { | ||
14 | + type: String, | ||
15 | + default: '100%' | ||
16 | + }, | ||
17 | + height: { | ||
18 | + type: String, | ||
19 | + default: '100%' | ||
20 | + }, | ||
21 | + title: { | ||
22 | + type: Object, | ||
23 | + default: { | ||
24 | + show: false, | ||
25 | + text: '标题', | ||
26 | + subtext: '辅助标题', | ||
27 | + left: 'center' | ||
28 | + } | ||
29 | + }, | ||
30 | + sourceData: { | ||
31 | + type: Array, | ||
32 | + default: [ | ||
33 | + ['product', '2015', '2016', '2017'], | ||
34 | + ['示例1', 43.3, 85.8, 93.7], | ||
35 | + ['示例2', 83.1, 73.4, 55.1], | ||
36 | + ['示例3', 86.4, 65.2, 82.5], | ||
37 | + ['示例4', 72.4, 53.9, 39.1] | ||
38 | + ] | ||
39 | + } | ||
40 | + }, | ||
41 | + data() { | ||
42 | + return {} | ||
43 | + }, | ||
44 | + setup(props, {attrs, slots, emit}) { | ||
45 | + const {proxy} = Vue.getCurrentInstance(); | ||
46 | + | ||
47 | + let id = "line" + (new Date()).getTime(); | ||
48 | + | ||
49 | + | ||
50 | + | ||
51 | + let getOption = () => { | ||
52 | + | ||
53 | + let sourceData = props.sourceData; | ||
54 | + let arr = []; | ||
55 | + for (let i = 0; i < sourceData[0].length; i++) { | ||
56 | + arr.push({type: 'bar'}) | ||
57 | + } | ||
58 | + let option = { | ||
59 | + legend: { | ||
60 | + right:'20px', | ||
61 | + itemWidth:25, | ||
62 | + itemHeight:5, | ||
63 | + textStyle: { | ||
64 | + color: '#fff', | ||
65 | + fontSize: 7 | ||
66 | + } | ||
67 | + }, | ||
68 | + tooltip: { | ||
69 | + trigger: 'axis', | ||
70 | + axisPointer: { | ||
71 | + type: 'shadow' | ||
72 | + }, | ||
73 | + backgroundColor: 'rgba(50,50,50,0.7)', | ||
74 | + borderColor: '#333', | ||
75 | + textStyle: { | ||
76 | + color: '#fff', | ||
77 | + align: 'left' | ||
78 | + } | ||
79 | + }, | ||
80 | + dataset: { | ||
81 | + source: props.sourceData | ||
82 | + }, | ||
83 | + grid: { | ||
84 | + top: '30px', | ||
85 | + left: '10px', | ||
86 | + right: '10px', | ||
87 | + bottom: '10px', | ||
88 | + containLabel: true | ||
89 | + }, | ||
90 | + | ||
91 | + xAxis: {type: 'category'}, | ||
92 | + yAxis: { | ||
93 | + axisLabel: { | ||
94 | + formatter: '{value}',//以百分比显示 | ||
95 | + color:'#ffffff', | ||
96 | + }, | ||
97 | + splitLine:{ | ||
98 | + lineStyle: { | ||
99 | + type: 'dashed', | ||
100 | + color:'#313c5e' | ||
101 | + } | ||
102 | + }, | ||
103 | + axisLine:{ | ||
104 | + type:'do', | ||
105 | + show:true,//是否显示坐标线 | ||
106 | + lineStyle: { | ||
107 | + color:'#21bad6' | ||
108 | + } | ||
109 | + }, | ||
110 | + }, | ||
111 | + series: arr | ||
112 | + }; | ||
113 | + | ||
114 | + let line = echarts.init(document.getElementById(id)); | ||
115 | + setTimeout(function () { | ||
116 | + line.clear(); | ||
117 | + line.setOption(option); | ||
118 | + }, 200); | ||
119 | + } | ||
120 | + | ||
121 | + // 挂载完 | ||
122 | + Vue.onMounted(() => { | ||
123 | + getOption(); | ||
124 | + }) | ||
125 | + | ||
126 | + return { | ||
127 | + id | ||
128 | + } | ||
129 | + } | ||
130 | +} |
hg-monitor-web-base/src/main/resources/static/vue3/src/components/common/echarts/barStack/index.js
0 → 100644
1 | +/** | ||
2 | + * https://echarts.apache.org/examples/zh/editor.html?c=pie-simple | ||
3 | + * <p> | ||
4 | + * 作者: Wang | ||
5 | + * 时间:2021/12/3 14:30 | ||
6 | + */ | ||
7 | +export default { | ||
8 | + name: 'barStack', | ||
9 | + template: '', | ||
10 | + components: {}, | ||
11 | + props: { | ||
12 | + // 单位px | ||
13 | + width: { | ||
14 | + type: String, | ||
15 | + default: '100%' | ||
16 | + }, | ||
17 | + height: { | ||
18 | + type: String, | ||
19 | + default: '100%' | ||
20 | + }, | ||
21 | + title: { | ||
22 | + type: Object, | ||
23 | + default: { | ||
24 | + show: false, | ||
25 | + text: '标题', | ||
26 | + subtext: '辅助标题', | ||
27 | + left: 'center' | ||
28 | + } | ||
29 | + }, | ||
30 | + sourceData: { | ||
31 | + type: Array, | ||
32 | + default: [ | ||
33 | + ['product', '2015', '2016', '2017'], | ||
34 | + ['示例1', 43.3, 85.8, 93.7], | ||
35 | + ['示例2', 83.1, 73.4, 55.1], | ||
36 | + ['示例3', 86.4, 65.2, 82.5], | ||
37 | + ['示例4', 72.4, 53.9, 39.1] | ||
38 | + ] | ||
39 | + } | ||
40 | + }, | ||
41 | + data() { | ||
42 | + return {} | ||
43 | + }, | ||
44 | + setup(props, {attrs, slots, emit}) { | ||
45 | + const {proxy} = Vue.getCurrentInstance(); | ||
46 | + | ||
47 | + let id = "line" + (new Date()).getTime(); | ||
48 | + | ||
49 | + | ||
50 | + let getOption = () => { | ||
51 | + | ||
52 | + let sourceData = props.sourceData; | ||
53 | + let arr = []; | ||
54 | + for (let i = 1; i < sourceData[0].length; i++) { | ||
55 | + let nameItem = sourceData[0][i]; | ||
56 | + let name = nameItem; | ||
57 | + if(nameItem && nameItem.name){ | ||
58 | + name = nameItem.name; | ||
59 | + } | ||
60 | + arr.push({ | ||
61 | + name: name, | ||
62 | + type: 'bar', | ||
63 | + stack: 'total', | ||
64 | + label: { | ||
65 | + show: false | ||
66 | + }, | ||
67 | + emphasis: { | ||
68 | + focus: 'series' | ||
69 | + }, | ||
70 | + itemStyle: { | ||
71 | + normal: { | ||
72 | + color: nameItem.color, | ||
73 | + lineStyle: { | ||
74 | + color: nameItem.color, | ||
75 | + width: 1 | ||
76 | + } | ||
77 | + } | ||
78 | + }, | ||
79 | + }) | ||
80 | + } | ||
81 | + let option = { | ||
82 | + legend: { | ||
83 | + itemWidth: 25, | ||
84 | + itemHeight: 2, | ||
85 | + textStyle: { | ||
86 | + color: '#fff', | ||
87 | + fontSize: "12px" | ||
88 | + } | ||
89 | + }, | ||
90 | + tooltip: { | ||
91 | + trigger: 'axis', | ||
92 | + axisPointer: { | ||
93 | + type: 'shadow' | ||
94 | + }, | ||
95 | + backgroundColor: 'rgba(50,50,50,0.7)', | ||
96 | + borderColor: '#333', | ||
97 | + textStyle: { | ||
98 | + color: '#fff', | ||
99 | + align: 'left' | ||
100 | + } | ||
101 | + }, | ||
102 | + dataset: { | ||
103 | + source: props.sourceData | ||
104 | + }, | ||
105 | + grid: { | ||
106 | + top: '30px', | ||
107 | + left: '10px', | ||
108 | + right: '10px', | ||
109 | + bottom: '10px', | ||
110 | + containLabel: true | ||
111 | + }, | ||
112 | + | ||
113 | + xAxis: { | ||
114 | + type: 'category', | ||
115 | + splitLine: { | ||
116 | + lineStyle: { | ||
117 | + type: 'dashed', | ||
118 | + color: '#313c5e' | ||
119 | + } | ||
120 | + }, | ||
121 | + axisLine: { | ||
122 | + type: 'do', | ||
123 | + show: true,//是否显示坐标线 | ||
124 | + lineStyle: { | ||
125 | + color: '#21bad6' | ||
126 | + } | ||
127 | + }, | ||
128 | + axisLabel: { | ||
129 | + color: '#ffffff', | ||
130 | + fontSize: 10, | ||
131 | + formatter: function (params) { | ||
132 | + var newParamsName = ''; | ||
133 | + let paramsNameNumber = params.length; | ||
134 | + let provideNumber = 3; | ||
135 | + let rowNumber = Math.ceil(paramsNameNumber / provideNumber); | ||
136 | + if (paramsNameNumber > provideNumber) { | ||
137 | + for (let i = 0; i < rowNumber; i++) { | ||
138 | + let tempStr = ''; | ||
139 | + let start = i * provideNumber; | ||
140 | + let end = start + provideNumber; | ||
141 | + if (i == rowNumber - 1) { | ||
142 | + tempStr = params.substring(start, paramsNameNumber); | ||
143 | + } else { | ||
144 | + tempStr = params.substring(start, end) + "\n"; | ||
145 | + } | ||
146 | + newParamsName += tempStr; | ||
147 | + } | ||
148 | + } else { | ||
149 | + newParamsName = params; | ||
150 | + } | ||
151 | + return newParamsName; | ||
152 | + }, | ||
153 | + textStyle: { | ||
154 | + rich: { | ||
155 | + white: { | ||
156 | + padding: [1, 0, 0, 0] | ||
157 | + } | ||
158 | + } | ||
159 | + } | ||
160 | + }, | ||
161 | + }, | ||
162 | + yAxis: { | ||
163 | + axisLabel: { | ||
164 | + formatter: '{value}',//以百分比显示 | ||
165 | + color: '#ffffff', | ||
166 | + }, | ||
167 | + splitLine: { | ||
168 | + lineStyle: { | ||
169 | + type: 'dashed', | ||
170 | + color: '#313c5e' | ||
171 | + } | ||
172 | + }, | ||
173 | + axisLine: { | ||
174 | + type: 'do', | ||
175 | + show: true,//是否显示坐标线 | ||
176 | + lineStyle: { | ||
177 | + color: '#21bad6' | ||
178 | + } | ||
179 | + }, | ||
180 | + }, | ||
181 | + series: arr | ||
182 | + }; | ||
183 | + | ||
184 | + let line = echarts.init(document.getElementById(id)); | ||
185 | + setTimeout(function () { | ||
186 | + line.clear(); | ||
187 | + line.setOption(option); | ||
188 | + }, 200); | ||
189 | + } | ||
190 | + | ||
191 | + // 挂载完 | ||
192 | + Vue.onMounted(() => { | ||
193 | + getOption(); | ||
194 | + }) | ||
195 | + | ||
196 | + return { | ||
197 | + id | ||
198 | + } | ||
199 | + } | ||
200 | +} |
hg-monitor-web-base/src/main/resources/static/vue3/src/components/common/echarts/funnel/index.js
0 → 100644
1 | +/** | ||
2 | + * https://echarts.apache.org/examples/zh/editor.html?c=pie-simple | ||
3 | + * <p> | ||
4 | + * 作者: Wang | ||
5 | + * 时间:2021/12/3 14:30 | ||
6 | + */ | ||
7 | +export default { | ||
8 | + name: 'echarts-line', | ||
9 | + template: '', | ||
10 | + components: {}, | ||
11 | + props: { | ||
12 | + // 单位px | ||
13 | + width: { | ||
14 | + type: String, | ||
15 | + default: '100%' | ||
16 | + }, | ||
17 | + height: { | ||
18 | + type: String, | ||
19 | + default: '100%' | ||
20 | + }, | ||
21 | + title: { | ||
22 | + type: Object, | ||
23 | + default: { | ||
24 | + show: false, | ||
25 | + text: '标题', | ||
26 | + subtext: '辅助标题', | ||
27 | + left: 'center' | ||
28 | + } | ||
29 | + }, | ||
30 | + sourceData: { | ||
31 | + type: Array, | ||
32 | + default: ['年报', '月报', '周报', '日报'] | ||
33 | + } | ||
34 | + }, | ||
35 | + data() { | ||
36 | + return {} | ||
37 | + }, | ||
38 | + setup(props, {attrs, slots, emit}) { | ||
39 | + const {proxy} = Vue.getCurrentInstance(); | ||
40 | + | ||
41 | + let id = "line" + (new Date()).getTime(); | ||
42 | + | ||
43 | + | ||
44 | + let getOption = () => { | ||
45 | + | ||
46 | + let size = 100 / props.sourceData.length; | ||
47 | + | ||
48 | + let seriesData = props.sourceData.map(function (v, i) { | ||
49 | + return {value: (i + 1) * size, name: v}; | ||
50 | + }) | ||
51 | + let option = { | ||
52 | + title: { | ||
53 | + text: 'Funnel Compare', | ||
54 | + subtext: 'Fake Data', | ||
55 | + left: 'left', | ||
56 | + top: 'bottom', | ||
57 | + show: false | ||
58 | + }, | ||
59 | + tooltip: { | ||
60 | + trigger: 'item', | ||
61 | + formatter: '{b} : {c}%' | ||
62 | + }, | ||
63 | + toolbox: {}, | ||
64 | + legend: { | ||
65 | + show: false, | ||
66 | + orient: 'vertical', | ||
67 | + left: 'left', | ||
68 | + data: props.sourceData | ||
69 | + }, | ||
70 | + series: [ | ||
71 | + { | ||
72 | + name: '', | ||
73 | + type: 'funnel', | ||
74 | + left: '10', | ||
75 | + top: 20, | ||
76 | + bottom: 20, | ||
77 | + width: '80%', | ||
78 | + min: 100, | ||
79 | + max: 0, | ||
80 | + minSize: '0%', | ||
81 | + maxSize: '100%', | ||
82 | + sort: 'descending', | ||
83 | + gap: 2, | ||
84 | + label: { | ||
85 | + show: true, | ||
86 | + width: 100, | ||
87 | + position: '' | ||
88 | + }, | ||
89 | + labelLine: { | ||
90 | + length: 10, | ||
91 | + lineStyle: { | ||
92 | + width: 1, | ||
93 | + type: 'solid' | ||
94 | + } | ||
95 | + }, | ||
96 | + itemStyle: { | ||
97 | + borderColor: '#fff', | ||
98 | + borderWidth: 1 | ||
99 | + }, | ||
100 | + emphasis: { | ||
101 | + label: { | ||
102 | + fontSize: 20 | ||
103 | + } | ||
104 | + }, | ||
105 | + data: seriesData | ||
106 | + } | ||
107 | + ] | ||
108 | + }; | ||
109 | + | ||
110 | + let line = echarts.init(document.getElementById(id)); | ||
111 | + setTimeout(function () { | ||
112 | + line.clear(); | ||
113 | + line.setOption(option); | ||
114 | + }, 200); | ||
115 | + } | ||
116 | + | ||
117 | + // 挂载完 | ||
118 | + Vue.onMounted(() => { | ||
119 | + getOption(); | ||
120 | + }) | ||
121 | + | ||
122 | + return { | ||
123 | + id | ||
124 | + } | ||
125 | + } | ||
126 | +} |
hg-monitor-web-base/src/main/resources/static/vue3/src/components/common/echarts/line/index.js
0 → 100644
1 | +/** | ||
2 | + * https://echarts.apache.org/examples/zh/editor.html?c=pie-simple | ||
3 | + * <p> | ||
4 | + * 作者: Wang | ||
5 | + * 时间:2021/12/3 14:30 | ||
6 | + */ | ||
7 | +export default { | ||
8 | + name: 'echarts-line', | ||
9 | + template: '', | ||
10 | + components: {}, | ||
11 | + props: { | ||
12 | + // 单位px | ||
13 | + width: { | ||
14 | + type: String, | ||
15 | + default: '100%' | ||
16 | + }, | ||
17 | + height: { | ||
18 | + type: String, | ||
19 | + default: '100%' | ||
20 | + }, | ||
21 | + title: { | ||
22 | + type: Object, | ||
23 | + default: { | ||
24 | + show: false, | ||
25 | + text: '标题', | ||
26 | + subtext: '辅助标题', | ||
27 | + left: 'center' | ||
28 | + } | ||
29 | + }, | ||
30 | + sourceData: { | ||
31 | + type: Array, | ||
32 | + default: [ | ||
33 | + ['product', '2015', '2016', '2017'], | ||
34 | + ['示例1', 43.3, 85.8, 93.7], | ||
35 | + ['示例2', 83.1, 73.4, 55.1], | ||
36 | + ['示例3', 86.4, 65.2, 82.5], | ||
37 | + ['示例4', 72.4, 53.9, 39.1] | ||
38 | + ] | ||
39 | + } | ||
40 | + }, | ||
41 | + data() { | ||
42 | + return {} | ||
43 | + }, | ||
44 | + setup(props, {attrs, slots, emit}) { | ||
45 | + const {proxy} = Vue.getCurrentInstance(); | ||
46 | + | ||
47 | + let id = "line" + (new Date()).getTime(); | ||
48 | + | ||
49 | + | ||
50 | + let getOption = () => { | ||
51 | + | ||
52 | + let sourceData = props.sourceData; | ||
53 | + let arr = []; | ||
54 | + for (let i = 0; i < sourceData[0].length; i++) { | ||
55 | + arr.push({type: 'line'}) | ||
56 | + } | ||
57 | + let option = { | ||
58 | + legend: { | ||
59 | + right: '20px', | ||
60 | + itemWidth: 25, | ||
61 | + itemHeight: 5, | ||
62 | + textStyle: { | ||
63 | + fontSize: 10 | ||
64 | + } | ||
65 | + }, | ||
66 | + tooltip: { | ||
67 | + trigger: 'axis', | ||
68 | + axisPointer: { | ||
69 | + type: 'shadow' | ||
70 | + }, | ||
71 | + backgroundColor: 'rgba(50,50,50,0.7)', | ||
72 | + borderColor: '#333', | ||
73 | + textStyle: { | ||
74 | + color: '#fff', | ||
75 | + align: 'left' | ||
76 | + } | ||
77 | + }, | ||
78 | + dataset: { | ||
79 | + source: props.sourceData | ||
80 | + }, | ||
81 | + grid: { | ||
82 | + top: '30px', | ||
83 | + left: '10px', | ||
84 | + right: '10px', | ||
85 | + bottom: '10px', | ||
86 | + containLabel: true | ||
87 | + }, | ||
88 | + | ||
89 | + xAxis: { | ||
90 | + type: 'category', | ||
91 | + axisLabel: { | ||
92 | + formatter: '{value}',//以百分比显示 | ||
93 | + color: '#313c5e', | ||
94 | + }, | ||
95 | + splitLine: { | ||
96 | + lineStyle: { | ||
97 | + type: 'dashed', | ||
98 | + color: '#313c5e' | ||
99 | + } | ||
100 | + }, | ||
101 | + axisLine: { | ||
102 | + type: 'do', | ||
103 | + show: true,//是否显示坐标线 | ||
104 | + lineStyle: { | ||
105 | + color: '#313c5e' | ||
106 | + } | ||
107 | + }, | ||
108 | + }, | ||
109 | + yAxis: { | ||
110 | + axisLabel: { | ||
111 | + formatter: '{value}',//以百分比显示 | ||
112 | + color: '#313c5e', | ||
113 | + }, | ||
114 | + splitLine: { | ||
115 | + lineStyle: { | ||
116 | + type: 'dashed', | ||
117 | + color: '#313c5e' | ||
118 | + } | ||
119 | + }, | ||
120 | + axisLine: { | ||
121 | + type: 'do', | ||
122 | + show: true,//是否显示坐标线 | ||
123 | + lineStyle: { | ||
124 | + color: '#313c5e' | ||
125 | + } | ||
126 | + }, | ||
127 | + }, | ||
128 | + series: arr | ||
129 | + }; | ||
130 | + | ||
131 | + let line = echarts.init(document.getElementById(id)); | ||
132 | + setTimeout(function () { | ||
133 | + line.clear(); | ||
134 | + line.setOption(option); | ||
135 | + }, 200); | ||
136 | + } | ||
137 | + | ||
138 | + // 挂载完 | ||
139 | + Vue.onMounted(() => { | ||
140 | + getOption(); | ||
141 | + }) | ||
142 | + | ||
143 | + return { | ||
144 | + id | ||
145 | + } | ||
146 | + } | ||
147 | +} |
hg-monitor-web-base/src/main/resources/static/vue3/src/components/common/echarts/pie/index.js
0 → 100644
1 | +/** | ||
2 | + * https://echarts.apache.org/examples/zh/editor.html?c=pie-simple | ||
3 | + * <p> | ||
4 | + * 作者: Wang | ||
5 | + * 时间:2021/12/3 14:30 | ||
6 | + */ | ||
7 | +export default { | ||
8 | + name: 'echarts-pie', | ||
9 | + template: '', | ||
10 | + components: {}, | ||
11 | + props: { | ||
12 | + // 单位px | ||
13 | + width: { | ||
14 | + type: String, | ||
15 | + default: '100%' | ||
16 | + }, | ||
17 | + height: { | ||
18 | + type: String, | ||
19 | + default: '100%' | ||
20 | + }, | ||
21 | + title: { | ||
22 | + type: Object, | ||
23 | + default: { | ||
24 | + show: false, | ||
25 | + text: '标题', | ||
26 | + subtext: '辅助标题', | ||
27 | + left: 'center' | ||
28 | + } | ||
29 | + }, | ||
30 | + // 列表 | ||
31 | + pieType: { | ||
32 | + type: String, | ||
33 | + default: '' | ||
34 | + }, | ||
35 | + seriesData: { | ||
36 | + type: Array, | ||
37 | + default: [{ | ||
38 | + name: '', | ||
39 | + data: [ | ||
40 | + {value: 1048, name: '示例1'}, | ||
41 | + {value: 735, name: '示例2'}, | ||
42 | + {value: 580, name: '示例3'}, | ||
43 | + {value: 484, name: '示例4'}, | ||
44 | + {value: 300, name: '示例5'} | ||
45 | + ] | ||
46 | + } | ||
47 | + ] | ||
48 | + } | ||
49 | + }, | ||
50 | + data() { | ||
51 | + return {} | ||
52 | + }, | ||
53 | + setup(props, {attrs, slots, emit}) { | ||
54 | + const {proxy} = Vue.getCurrentInstance(); | ||
55 | + | ||
56 | + let id = "pie" + (new Date()).getTime(); | ||
57 | + | ||
58 | + let pieClick = (param) => { | ||
59 | + emit('pieClick', param, props.pieType); | ||
60 | + } | ||
61 | + | ||
62 | + let getOption = () => { | ||
63 | + let series = props.seriesData.map(function (v) { | ||
64 | + return { | ||
65 | + name: v.name, | ||
66 | + type: 'pie', | ||
67 | + radius: '80%', | ||
68 | + data: v.data, | ||
69 | + center: ['30%', '50%'], | ||
70 | + label: { | ||
71 | + show: false, | ||
72 | + position: 'center' | ||
73 | + }, | ||
74 | + labelLine: { | ||
75 | + show: false | ||
76 | + }, | ||
77 | + emphasis: { | ||
78 | + itemStyle: { | ||
79 | + shadowBlur: 10, | ||
80 | + shadowOffsetX: 0, | ||
81 | + shadowColor: 'rgba(0, 0, 0, 0.5)' | ||
82 | + } | ||
83 | + } | ||
84 | + } | ||
85 | + }) | ||
86 | + | ||
87 | + let option = { | ||
88 | + title: props.title, | ||
89 | + tooltip: { | ||
90 | + trigger: 'item', | ||
91 | + axisPointer: { | ||
92 | + type: 'shadow' | ||
93 | + }, | ||
94 | + backgroundColor: 'rgba(50,50,50,0.7)', | ||
95 | + borderColor: '#333', | ||
96 | + textStyle: { | ||
97 | + color: '#fff', | ||
98 | + align: 'left' | ||
99 | + } | ||
100 | + }, | ||
101 | + legend: { | ||
102 | + orient: 'vertical', | ||
103 | + left: 'right', | ||
104 | + y: 'bottom', | ||
105 | + itemWidth: 25, | ||
106 | + itemHeight: 5, | ||
107 | + textStyle: { | ||
108 | + color: '#fff', | ||
109 | + fontSize: 10 | ||
110 | + } | ||
111 | + }, | ||
112 | + series: series | ||
113 | + }; | ||
114 | + | ||
115 | + | ||
116 | + let pie = echarts.init(document.getElementById(id)); | ||
117 | + setTimeout(function () { | ||
118 | + pie.clear(); | ||
119 | + pie.setOption(option); | ||
120 | + | ||
121 | + pie.on("click", pieClick); | ||
122 | + }, 200); | ||
123 | + | ||
124 | + } | ||
125 | + | ||
126 | + // 挂载完 | ||
127 | + Vue.onMounted(() => { | ||
128 | + getOption(); | ||
129 | + }) | ||
130 | + | ||
131 | + return { | ||
132 | + id | ||
133 | + } | ||
134 | + } | ||
135 | +} |
@@ -691,7 +691,8 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | @@ -691,7 +691,8 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | ||
691 | beginTime: $("#activewarningStartdate").val(), | 691 | beginTime: $("#activewarningStartdate").val(), |
692 | endTime: $("#activewarningEnddate").val(), | 692 | endTime: $("#activewarningEnddate").val(), |
693 | sortKey: sortKey, | 693 | sortKey: sortKey, |
694 | - alarmKpi: $("#alarmKpiSearchBox").val(), | 694 | + alarmKpi: $("#alarmKpiSearchBox").val()!='KPI97B835A4'?$("#alarmKpiSearchBox").val():'', |
695 | + isBus:$("#alarmKpiSearchBox").val()=='KPI97B835A4'?'Y':'', | ||
695 | durationVal: $('#inline-condition-duration input[name="durationVal"]').val(), | 696 | durationVal: $('#inline-condition-duration input[name="durationVal"]').val(), |
696 | durationUnit: $('#inline-condition-duration select[name="durationUnit"]').val(), | 697 | durationUnit: $('#inline-condition-duration select[name="durationUnit"]').val(), |
697 | netFlag: netFlag, | 698 | netFlag: netFlag, |
@@ -724,7 +725,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | @@ -724,7 +725,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | ||
724 | beginTime: $("#activewarningStartdate").val(), | 725 | beginTime: $("#activewarningStartdate").val(), |
725 | endTime: $("#activewarningEnddate").val(), | 726 | endTime: $("#activewarningEnddate").val(), |
726 | sortKey: sortKey, | 727 | sortKey: sortKey, |
727 | - alarmKpi: $("#alarmKpiSearchBox").val(), | 728 | + //alarmKpi: $("#alarmKpiSearchBox").val(), |
729 | + alarmKpi: $("#alarmKpiSearchBox").val()!='KPI97B835A4'?$("#alarmKpiSearchBox").val():'', | ||
730 | + isBus:$("#alarmKpiSearchBox").val()=='KPI97B835A4'?'Y':'', | ||
728 | durationVal: $('#inline-condition-duration input[name="durationVal"]').val(), | 731 | durationVal: $('#inline-condition-duration input[name="durationVal"]').val(), |
729 | durationUnit: $('#inline-condition-duration select[name="durationUnit"]').val(), | 732 | durationUnit: $('#inline-condition-duration select[name="durationUnit"]').val(), |
730 | netFlag: netFlag, | 733 | netFlag: netFlag, |
@@ -981,7 +984,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | @@ -981,7 +984,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | ||
981 | beginTime: $("#activewarningStartdate").val(), | 984 | beginTime: $("#activewarningStartdate").val(), |
982 | endTime: $("#activewarningEnddate").val(), | 985 | endTime: $("#activewarningEnddate").val(), |
983 | sortKey: sortKey, | 986 | sortKey: sortKey, |
984 | - alarmKpi: $("#alarmKpiSearchBox").val(), | 987 | + //alarmKpi: $("#alarmKpiSearchBox").val(), |
988 | + alarmKpi: $("#alarmKpiSearchBox").val()!='KPI97B835A4'?$("#alarmKpiSearchBox").val():'', | ||
989 | + isBus:$("#alarmKpiSearchBox").val()=='KPI97B835A4'?'Y':'', | ||
985 | durationVal: $('#inline-condition-duration input[name="durationVal"]').val(), | 990 | durationVal: $('#inline-condition-duration input[name="durationVal"]').val(), |
986 | durationUnit: $('#inline-condition-duration select[name="durationUnit"]').val(), | 991 | durationUnit: $('#inline-condition-duration select[name="durationUnit"]').val(), |
987 | alarmTimeDay:todayStr, | 992 | alarmTimeDay:todayStr, |
@@ -278,7 +278,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | @@ -278,7 +278,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | ||
278 | durationVal: $('#his_inline-condition-duration input[name="durationVal"]').val(), | 278 | durationVal: $('#his_inline-condition-duration input[name="durationVal"]').val(), |
279 | durationUnit: $('#his_inline-condition-duration select[name="durationUnit"]').val(), | 279 | durationUnit: $('#his_inline-condition-duration select[name="durationUnit"]').val(), |
280 | sortKey: sortKey, | 280 | sortKey: sortKey, |
281 | - alarmKpi: $("#alarmKpiHisSearchBox").val(), | 281 | + //alarmKpi: $("#alarmKpiHisSearchBox").val(), |
282 | + alarmKpi: $("#alarmKpiHisSearchBox").val()!='KPI97B835A4'?$("#alarmKpiHisSearchBox").val():'', | ||
283 | + isBus:$("#alarmKpiHisSearchBox").val()=='KPI97B835A4'?'Y':'', | ||
282 | } | 284 | } |
283 | , height: 'full-245' | 285 | , height: 'full-245' |
284 | , cellMinWidth: 80 | 286 | , cellMinWidth: 80 |
@@ -309,7 +311,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | @@ -309,7 +311,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | ||
309 | durationVal: $('#his_inline-condition-duration input[name="durationVal"]').val(), | 311 | durationVal: $('#his_inline-condition-duration input[name="durationVal"]').val(), |
310 | durationUnit: $('#his_inline-condition-duration select[name="durationUnit"]').val(), | 312 | durationUnit: $('#his_inline-condition-duration select[name="durationUnit"]').val(), |
311 | sortKey: sortKey, | 313 | sortKey: sortKey, |
312 | - alarmKpi: $("#alarmKpiHisSearchBox").val(), | 314 | + //alarmKpi: $("#alarmKpiHisSearchBox").val(), |
315 | + alarmKpi: $("#alarmKpiHisSearchBox").val()!='KPI97B835A4'?$("#alarmKpiHisSearchBox").val():'', | ||
316 | + isBus:$("#alarmKpiHisSearchBox").val()=='KPI97B835A4'?'Y':'', | ||
313 | }, | 317 | }, |
314 | success: function (res) { | 318 | success: function (res) { |
315 | var map = res.map; | 319 | var map = res.map; |
@@ -523,7 +527,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | @@ -523,7 +527,9 @@ layui.define(['table', 'form', 'laydate', 'admin', 'layer', 'laytpl', 'common', | ||
523 | durationVal: $('#his_inline-condition-duration input[name="durationVal"]').val(), | 527 | durationVal: $('#his_inline-condition-duration input[name="durationVal"]').val(), |
524 | durationUnit: $('#his_inline-condition-duration select[name="durationUnit"]').val(), | 528 | durationUnit: $('#his_inline-condition-duration select[name="durationUnit"]').val(), |
525 | sortKey: sortKey, | 529 | sortKey: sortKey, |
526 | - alarmKpi: $("#alarmKpiHisSearchBox").val(), | 530 | + //alarmKpi: $("#alarmKpiHisSearchBox").val(), |
531 | + alarmKpi: $("#alarmKpiHisSearchBox").val()!='KPI97B835A4'?$("#alarmKpiHisSearchBox").val():'', | ||
532 | + isBus:$("#alarmKpiHisSearchBox").val()=='KPI97B835A4'?'Y':'', | ||
527 | } | 533 | } |
528 | }); | 534 | }); |
529 | } | 535 | } |
@@ -326,4 +326,83 @@ | @@ -326,4 +326,83 @@ | ||
326 | to { | 326 | to { |
327 | -webkit-transform: rotate(360deg); | 327 | -webkit-transform: rotate(360deg); |
328 | } | 328 | } |
329 | -} | ||
329 | +} | ||
330 | +.assets-popper-class { | ||
331 | + background-repeat: no-repeat!important; | ||
332 | + padding: 0!important; | ||
333 | + background-size: 100% 100%!important; | ||
334 | + background: none!important; | ||
335 | + border: none!important; | ||
336 | +} | ||
337 | +.layout2{ | ||
338 | + width: 318px!important; | ||
339 | + height: 167px; | ||
340 | + background-image: url('/vue3/src/assets/images/zjdp/assets/layout2/bg.png')!important; | ||
341 | +} | ||
342 | + | ||
343 | +.layout2 .left-item { | ||
344 | + width: 40%; | ||
345 | + height: 100px; | ||
346 | +} | ||
347 | + | ||
348 | +.layout2 .left-item .left-item-top{ | ||
349 | + width: 100%; | ||
350 | + height: 30px; | ||
351 | + background-image: url('/vue3/src/assets/images/zjdp/assets/layout2/left-bg.png')!important; | ||
352 | + background-repeat: no-repeat!important; | ||
353 | + background-size: 100px 30px!important; | ||
354 | + margin-top: 45px; | ||
355 | + margin-left: 15px; | ||
356 | + font-size: 14px; | ||
357 | + font-weight: bold; | ||
358 | + color: white; | ||
359 | + padding-left: 20px; | ||
360 | + padding-top: 7px; | ||
361 | +} | ||
362 | + | ||
363 | +.layout2 .left-item .left-item-bottom{ | ||
364 | + width: 100%; | ||
365 | + height: 50%; | ||
366 | + background-image: url('/vue3/src/assets/images/zjdp/assets/left.png')!important; | ||
367 | + background-repeat: no-repeat!important; | ||
368 | + background-size: 100px 60px!important; | ||
369 | + margin-top: 0px; | ||
370 | + margin-left: 15px; | ||
371 | + padding-left: 30px; | ||
372 | + color: white; | ||
373 | +} | ||
374 | + | ||
375 | +.layout2 .right-item { | ||
376 | + width: 60%; | ||
377 | + height: 100px; | ||
378 | + padding-top: 30px; | ||
379 | + display: flex; | ||
380 | + flex-wrap: wrap; | ||
381 | + justify-content: center; | ||
382 | + align-items: center; | ||
383 | +} | ||
384 | +.layout2 .right-item .text{ | ||
385 | + background-image: url('/vue3/src/assets/images/zjdp/assets/layout2/text.png')!important; | ||
386 | + background-repeat: no-repeat!important; | ||
387 | + background-size: 90% 30px!important; | ||
388 | + width: 100%; | ||
389 | + height: 30px; | ||
390 | + margin-top: 15px; | ||
391 | + color: white; | ||
392 | + padding-left: 10px; | ||
393 | + padding-top: 3px; | ||
394 | + display: flex; | ||
395 | + flex-wrap: nowrap; | ||
396 | + align-items: center; | ||
397 | +} | ||
398 | + | ||
399 | +.layout2 .right-item .text div { | ||
400 | + margin-left: 5px; | ||
401 | +} | ||
402 | + | ||
403 | +.layout2 .right-item .text .dd { | ||
404 | + width: 5px; | ||
405 | + height: 5px; | ||
406 | + background: white; | ||
407 | + border-radius: 50%; | ||
408 | +} |
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/zjdp/assets/layout2/bg.png
0 → 100644

10.7 KB
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/zjdp/assets/layout2/left-bg.png
0 → 100644

1.29 KB
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/zjdp/assets/layout2/text.png
0 → 100644

1.86 KB
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/zjdp/assets/layout3/bg.png
0 → 100644

18.2 KB
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/zjdp/assets/layout3/left-bg.png
0 → 100644

1.64 KB
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/zjdp/assets/layout3/text.png
0 → 100644

1.99 KB
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/zjdp/assets/layout4/bg.png
0 → 100644

21.2 KB
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/zjdp/assets/layout4/left-bg.png
0 → 100644

1.64 KB
hg-monitor-web-zj/src/main/resources/static/vue3/src/assets/images/zjdp/assets/layout4/text.png
0 → 100644

1.93 KB

11.9 KB
1 | +<div> | ||
2 | + <div> | ||
3 | + <el-progress :percentage="90" /> | ||
4 | + </div> | ||
5 | + <div> | ||
6 | + <cm-table-page v-if="list.columns.length > 0" :columns="list.columns" | ||
7 | + :dataList="list.dataList" | ||
8 | + @loaddata="getPageInfo" | ||
9 | + :showIndex="true" | ||
10 | + :showBorder="true" | ||
11 | + :showPage="false" | ||
12 | + :showTools="false" | ||
13 | + :maxWidth="width" | ||
14 | + :height="200"> | ||
15 | + </cm-table-page> | ||
16 | + </div> | ||
17 | + | ||
18 | + <!-- 弹框区域 --> | ||
19 | + <cm-dialog top="3vh" title="曲线图" width="900px" :showDialogVisible="showLineDialog" | ||
20 | + @hidedialog="closeLineDialog" :showFooter="false"> | ||
21 | + <template v-slot> | ||
22 | + <div style="height: 300px"> | ||
23 | + <echarts-line height="300px" width="880px" /> | ||
24 | + </div> | ||
25 | + </template> | ||
26 | + </cm-dialog> | ||
27 | +</div> |
1 | +const lineDetail = () => { | ||
2 | + let showLineDialog = Vue.ref(false); | ||
3 | + | ||
4 | + let closeLineDialog = (flg) =>{ | ||
5 | + showLineDialog.value = flg; | ||
6 | + } | ||
7 | + return { | ||
8 | + showLineDialog, | ||
9 | + closeLineDialog | ||
10 | + } | ||
11 | +} | ||
12 | +export default { | ||
13 | + name: 'resultItemIndex', | ||
14 | + template: '', | ||
15 | + components: { | ||
16 | + 'echarts-line': Vue.defineAsyncComponent( | ||
17 | + () => myImport('components/common/echarts/line/index') | ||
18 | + ) | ||
19 | + }, | ||
20 | + data() { | ||
21 | + return {} | ||
22 | + }, | ||
23 | + props: { | ||
24 | + faultType:{ | ||
25 | + type: String, | ||
26 | + default:'NPM' | ||
27 | + }, | ||
28 | + faultNo:{ | ||
29 | + type: String, | ||
30 | + default:'' | ||
31 | + } | ||
32 | + }, | ||
33 | + setup(props, {attrs, slots, emit}) { | ||
34 | + let width = Vue.ref(window.innerWidth*0.8 - 190); | ||
35 | + const {proxy} = Vue.getCurrentInstance(); | ||
36 | + let list = Vue.ref({ | ||
37 | + columns: [], | ||
38 | + dataList: [], | ||
39 | + total: 0 | ||
40 | + }); | ||
41 | + | ||
42 | + | ||
43 | + let getPage = () =>{ | ||
44 | + let data = { | ||
45 | + "5e991f126b8ee03541976384": [ | ||
46 | + { | ||
47 | + "id": "da57056823be410c848a4a4ab821de41", | ||
48 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
49 | + "faultNo": "GZ202112130014", | ||
50 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
51 | + "targetType": "NPM", | ||
52 | + "itemId": "ccb5404e731ff9b7c2344c2806b41442", | ||
53 | + "timestap": "2021-12-13T12:31:08.988+0800", | ||
54 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
55 | + "bizName": "电子税务局", | ||
56 | + "resId": "5e991f126b8ee03541976384", | ||
57 | + "resName": "各地市-网上申报Weblogic", | ||
58 | + "resType": "NPM_STREAM", | ||
59 | + "kpiId": "count", | ||
60 | + "kpiName": "业务量", | ||
61 | + "flag": "base", | ||
62 | + "kpiValue": "26299", | ||
63 | + "collTime": "2021-12-04 10:50:00", | ||
64 | + "dataType": "last", | ||
65 | + "createTimeToMonth": "2021-12" | ||
66 | + }, | ||
67 | + { | ||
68 | + "id": "bd8c7d4fdf1247d195652251c95acca0", | ||
69 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
70 | + "faultNo": "GZ202112130014", | ||
71 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
72 | + "targetType": "NPM", | ||
73 | + "itemId": "ccb5404e731ff9b7c2344c2806b41442", | ||
74 | + "timestap": "2021-12-13T12:31:08.988+0800", | ||
75 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
76 | + "bizName": "电子税务局", | ||
77 | + "resId": "5e991f126b8ee03541976384", | ||
78 | + "resName": "各地市-网上申报Weblogic", | ||
79 | + "resType": "NPM_STREAM", | ||
80 | + "kpiId": "response_rate", | ||
81 | + "kpiName": "响应率", | ||
82 | + "flag": "base", | ||
83 | + "kpiValue": "47.25", | ||
84 | + "collTime": "2021-12-04 10:50:00", | ||
85 | + "dataType": "last", | ||
86 | + "createTimeToMonth": "2021-12" | ||
87 | + }, | ||
88 | + { | ||
89 | + "id": "a9e00473c9964300bde164c1183ebe1d", | ||
90 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
91 | + "faultNo": "GZ202112130014", | ||
92 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
93 | + "targetType": "NPM", | ||
94 | + "itemId": "ccb5404e731ff9b7c2344c2806b41442", | ||
95 | + "timestap": "2021-12-13T12:31:08.988+0800", | ||
96 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
97 | + "bizName": "电子税务局", | ||
98 | + "resId": "5e991f126b8ee03541976384", | ||
99 | + "resName": "各地市-网上申报Weblogic", | ||
100 | + "resType": "NPM_STREAM", | ||
101 | + "kpiId": "success_rate", | ||
102 | + "kpiName": "成功率", | ||
103 | + "flag": "base", | ||
104 | + "kpiValue": "100", | ||
105 | + "collTime": "2021-12-04 10:50:00", | ||
106 | + "dataType": "last", | ||
107 | + "createTimeToMonth": "2021-12" | ||
108 | + } | ||
109 | + ], | ||
110 | + "5e966cec6b8e8d2938be120a": [ | ||
111 | + { | ||
112 | + "id": "1f12837a6faf4193a3867759ee3d0bb8", | ||
113 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
114 | + "faultNo": "GZ202112130014", | ||
115 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
116 | + "targetType": "NPM", | ||
117 | + "itemId": "2ba02341a1c5dc28f6a2bd362be58ca9", | ||
118 | + "timestap": "2021-12-13T12:29:14.907+0800", | ||
119 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
120 | + "bizName": "电子税务局", | ||
121 | + "resId": "5e966cec6b8e8d2938be120a", | ||
122 | + "resName": "nginx-Nginx代理 ", | ||
123 | + "resType": "NPM_STREAM", | ||
124 | + "kpiId": "count", | ||
125 | + "kpiName": "业务量", | ||
126 | + "flag": "base", | ||
127 | + "kpiValue": "26299", | ||
128 | + "collTime": "2021-12-04 10:50:00", | ||
129 | + "dataType": "last", | ||
130 | + "createTimeToMonth": "2021-12" | ||
131 | + }, | ||
132 | + { | ||
133 | + "id": "11c19383b95c4ec8b30ea07f5c9e3f42", | ||
134 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
135 | + "faultNo": "GZ202112130014", | ||
136 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
137 | + "targetType": "NPM", | ||
138 | + "itemId": "2ba02341a1c5dc28f6a2bd362be58ca9", | ||
139 | + "timestap": "2021-12-13T12:29:14.907+0800", | ||
140 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
141 | + "bizName": "电子税务局", | ||
142 | + "resId": "5e966cec6b8e8d2938be120a", | ||
143 | + "resName": "nginx-Nginx代理 ", | ||
144 | + "resType": "NPM_STREAM", | ||
145 | + "kpiId": "response_rate", | ||
146 | + "kpiName": "响应率", | ||
147 | + "flag": "base", | ||
148 | + "kpiValue": "47.25", | ||
149 | + "collTime": "2021-12-04 10:50:00", | ||
150 | + "dataType": "last", | ||
151 | + "createTimeToMonth": "2021-12" | ||
152 | + }, | ||
153 | + { | ||
154 | + "id": "426fe02a1ebd4949a68167612933c880", | ||
155 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
156 | + "faultNo": "GZ202112130014", | ||
157 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
158 | + "targetType": "NPM", | ||
159 | + "itemId": "2ba02341a1c5dc28f6a2bd362be58ca9", | ||
160 | + "timestap": "2021-12-13T12:29:14.907+0800", | ||
161 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
162 | + "bizName": "电子税务局", | ||
163 | + "resId": "5e966cec6b8e8d2938be120a", | ||
164 | + "resName": "nginx-Nginx代理 ", | ||
165 | + "resType": "NPM_STREAM", | ||
166 | + "kpiId": "success_rate", | ||
167 | + "kpiName": "成功率", | ||
168 | + "flag": "base", | ||
169 | + "kpiValue": "100", | ||
170 | + "collTime": "2021-12-04 10:50:00", | ||
171 | + "dataType": "last", | ||
172 | + "createTimeToMonth": "2021-12" | ||
173 | + } | ||
174 | + ], | ||
175 | + "5e9594b66b8e8d293845bd70": [ | ||
176 | + { | ||
177 | + "id": "84e0ad1f09e049fd97efe18c5eb9a40b", | ||
178 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
179 | + "faultNo": "GZ202112130014", | ||
180 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
181 | + "targetType": "NPM", | ||
182 | + "itemId": "953ff1ab4a718866a2b91ae5da50627e", | ||
183 | + "timestap": "2021-12-13T12:30:15.355+0800", | ||
184 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
185 | + "bizName": "电子税务局", | ||
186 | + "resId": "5e9594b66b8e8d293845bd70", | ||
187 | + "resName": "MQ-EDAS", | ||
188 | + "resType": "NPM_STREAM", | ||
189 | + "kpiId": "count", | ||
190 | + "kpiName": "业务量", | ||
191 | + "flag": "base", | ||
192 | + "kpiValue": "26299", | ||
193 | + "collTime": "2021-12-04 10:50:00", | ||
194 | + "dataType": "last", | ||
195 | + "createTimeToMonth": "2021-12" | ||
196 | + }, | ||
197 | + { | ||
198 | + "id": "e0e71be7a26f469b932f3b197c2ea7e8", | ||
199 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
200 | + "faultNo": "GZ202112130014", | ||
201 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
202 | + "targetType": "NPM", | ||
203 | + "itemId": "953ff1ab4a718866a2b91ae5da50627e", | ||
204 | + "timestap": "2021-12-13T12:30:15.355+0800", | ||
205 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
206 | + "bizName": "电子税务局", | ||
207 | + "resId": "5e9594b66b8e8d293845bd70", | ||
208 | + "resName": "MQ-EDAS", | ||
209 | + "resType": "NPM_STREAM", | ||
210 | + "kpiId": "response_rate", | ||
211 | + "kpiName": "响应率", | ||
212 | + "flag": "base", | ||
213 | + "kpiValue": "47.25", | ||
214 | + "collTime": "2021-12-04 10:50:00", | ||
215 | + "dataType": "last", | ||
216 | + "createTimeToMonth": "2021-12" | ||
217 | + }, | ||
218 | + { | ||
219 | + "id": "bd21a27f24cd459792c562a1a9067d98", | ||
220 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
221 | + "faultNo": "GZ202112130014", | ||
222 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
223 | + "targetType": "NPM", | ||
224 | + "itemId": "953ff1ab4a718866a2b91ae5da50627e", | ||
225 | + "timestap": "2021-12-13T12:30:15.355+0800", | ||
226 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
227 | + "bizName": "电子税务局", | ||
228 | + "resId": "5e9594b66b8e8d293845bd70", | ||
229 | + "resName": "MQ-EDAS", | ||
230 | + "resType": "NPM_STREAM", | ||
231 | + "kpiId": "success_rate", | ||
232 | + "kpiName": "成功率", | ||
233 | + "flag": "base", | ||
234 | + "kpiValue": "100", | ||
235 | + "collTime": "2021-12-04 10:50:00", | ||
236 | + "dataType": "last", | ||
237 | + "createTimeToMonth": "2021-12" | ||
238 | + } | ||
239 | + ], | ||
240 | + "5e991f126b8ee03541976383": [ | ||
241 | + { | ||
242 | + "id": "f2a46c0548d74659bcf84b149029b4ea", | ||
243 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
244 | + "faultNo": "GZ202112130014", | ||
245 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
246 | + "targetType": "NPM", | ||
247 | + "itemId": "d6fab6451da3d14dada155670c15ae5e", | ||
248 | + "timestap": "2021-12-13T12:31:28.472+0800", | ||
249 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
250 | + "bizName": "电子税务局", | ||
251 | + "resId": "5e991f126b8ee03541976383", | ||
252 | + "resName": "各地市-涉税文书Weblogic", | ||
253 | + "resType": "NPM_STREAM", | ||
254 | + "kpiId": "count", | ||
255 | + "kpiName": "业务量", | ||
256 | + "flag": "base", | ||
257 | + "kpiValue": "26299", | ||
258 | + "collTime": "2021-12-04 10:50:00", | ||
259 | + "dataType": "last", | ||
260 | + "createTimeToMonth": "2021-12" | ||
261 | + }, | ||
262 | + { | ||
263 | + "id": "0b2d9d77ea6c4c0e8bc280802c48721c", | ||
264 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
265 | + "faultNo": "GZ202112130014", | ||
266 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
267 | + "targetType": "NPM", | ||
268 | + "itemId": "d6fab6451da3d14dada155670c15ae5e", | ||
269 | + "timestap": "2021-12-13T12:31:28.472+0800", | ||
270 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
271 | + "bizName": "电子税务局", | ||
272 | + "resId": "5e991f126b8ee03541976383", | ||
273 | + "resName": "各地市-涉税文书Weblogic", | ||
274 | + "resType": "NPM_STREAM", | ||
275 | + "kpiId": "response_rate", | ||
276 | + "kpiName": "响应率", | ||
277 | + "flag": "base", | ||
278 | + "kpiValue": "47.25", | ||
279 | + "collTime": "2021-12-04 10:50:00", | ||
280 | + "dataType": "last", | ||
281 | + "createTimeToMonth": "2021-12" | ||
282 | + }, | ||
283 | + { | ||
284 | + "id": "0ca1b9a73c5b4a34a49361a121eea219", | ||
285 | + "faultId": "e011b982f0d2405a9d4d43df57199d05", | ||
286 | + "faultNo": "GZ202112130014", | ||
287 | + "targetId": "11cdc282437a91174d808e114954463d", | ||
288 | + "targetType": "NPM", | ||
289 | + "itemId": "d6fab6451da3d14dada155670c15ae5e", | ||
290 | + "timestap": "2021-12-13T12:31:28.472+0800", | ||
291 | + "bizId": "53bebbd79f384f619513b50666ea1d48", | ||
292 | + "bizName": "电子税务局", | ||
293 | + "resId": "5e991f126b8ee03541976383", | ||
294 | + "resName": "各地市-涉税文书Weblogic", | ||
295 | + "resType": "NPM_STREAM", | ||
296 | + "kpiId": "success_rate", | ||
297 | + "kpiName": "成功率", | ||
298 | + "flag": "base", | ||
299 | + "kpiValue": "100", | ||
300 | + "collTime": "2021-12-04 10:50:00", | ||
301 | + "dataType": "last", | ||
302 | + "createTimeToMonth": "2021-12" | ||
303 | + } | ||
304 | + ] | ||
305 | + }; | ||
306 | + | ||
307 | + let dataList = []; | ||
308 | + let col = [{ | ||
309 | + prop: 'resName', | ||
310 | + label: '检测指标', | ||
311 | + width: 100, | ||
312 | + click: function (row) { | ||
313 | + closeLineDialog(true); | ||
314 | + } | ||
315 | + }]; | ||
316 | + | ||
317 | + | ||
318 | + let index = 0; | ||
319 | + for (let resId in data) { | ||
320 | + let list = data[resId]; | ||
321 | + | ||
322 | + let item = {}; | ||
323 | + item.resId = list[0].resId; | ||
324 | + item.resName = list[0].resName; | ||
325 | + item.bizId = list[0].bizId; | ||
326 | + item.bizName = list[0].bizName; | ||
327 | + | ||
328 | + list.forEach(function (v){ | ||
329 | + item[v.kpiId] = v.kpiValue; | ||
330 | + if(index == 0){ | ||
331 | + col.push({ | ||
332 | + prop: v.kpiId, | ||
333 | + label: v.kpiName, | ||
334 | + width: 80 | ||
335 | + }) | ||
336 | + } | ||
337 | + }); | ||
338 | + | ||
339 | + dataList.push(item); | ||
340 | + index ++; | ||
341 | + } | ||
342 | + // 设置数据 | ||
343 | + list.value.dataList = dataList; | ||
344 | + list.value.columns = col; | ||
345 | + } | ||
346 | + | ||
347 | + const { | ||
348 | + showLineDialog, | ||
349 | + closeLineDialog | ||
350 | + } = lineDetail(); | ||
351 | + | ||
352 | + // 监听编辑状态 | ||
353 | + Vue.watch(() => props.faultNo, (newValue, oldVlaue) => { | ||
354 | + getPage(); | ||
355 | + }); | ||
356 | + | ||
357 | + // 挂载完 | ||
358 | + Vue.onMounted(() => { | ||
359 | + getPage(); | ||
360 | + }) | ||
361 | + | ||
362 | + return { | ||
363 | + width, | ||
364 | + list, | ||
365 | + | ||
366 | + showLineDialog, | ||
367 | + closeLineDialog | ||
368 | + } | ||
369 | + } | ||
370 | +} |
@@ -87,9 +87,13 @@ export default { | @@ -87,9 +87,13 @@ export default { | ||
87 | } | 87 | } |
88 | //添加应用 | 88 | //添加应用 |
89 | let addRes=(row,index)=>{ | 89 | let addRes=(row,index)=>{ |
90 | - row.targetId=proxy.targetId; | 90 | + // row.targetId=proxy.targetId; |
91 | + let params={ | ||
92 | + targetId:proxy.targetId, | ||
93 | + npmList:[row] | ||
94 | + } | ||
91 | 95 | ||
92 | - proxy.$http.post('/api-web/fault/conf/npm/batchAddNpm',[row],function (res){ | 96 | + proxy.$http.post('/api-web/fault/conf/npm/batchAddNpm',params,function (res){ |
93 | if(res){ | 97 | if(res){ |
94 | proxy.$global.showMsg('添加成功','success'); | 98 | proxy.$global.showMsg('添加成功','success'); |
95 | proxy.targetId=res.str | 99 | proxy.targetId=res.str |
@@ -401,7 +401,7 @@ | @@ -401,7 +401,7 @@ | ||
401 | 401 | ||
402 | <!--取消和保存--> | 402 | <!--取消和保存--> |
403 | <div class="btn-faultDiagnosis flex-center"> | 403 | <div class="btn-faultDiagnosis flex-center"> |
404 | - <el-button>取消</el-button> | 404 | + <el-button @click="goBackIndex">取消</el-button> |
405 | <el-button @click="saveConfigDetail" type="primary">保存</el-button> | 405 | <el-button @click="saveConfigDetail" type="primary">保存</el-button> |
406 | 406 | ||
407 | </div> | 407 | </div> |
@@ -186,7 +186,18 @@ export default { | @@ -186,7 +186,18 @@ export default { | ||
186 | alarmLevel:[] | 186 | alarmLevel:[] |
187 | }) | 187 | }) |
188 | } | 188 | } |
189 | + //模块数据 | ||
190 | + let modelData=[ | ||
191 | + {type:'gz',targetId:''}, | ||
192 | + {type:'netlink',targetId:''}, | ||
193 | + {type:'npm',targetId:''}, | ||
194 | + {type:'base',targetId:''}, | ||
195 | + {type:'apm',targetId:''}, | ||
196 | + {type:'log',targetId:''}, | ||
197 | + {type:'report',targetId:''}, | ||
198 | + ] | ||
189 | return{ | 199 | return{ |
200 | + modelData, | ||
190 | faultDefinitionRadio, | 201 | faultDefinitionRadio, |
191 | faultStateRadio, | 202 | faultStateRadio, |
192 | faultApplicationRadio, | 203 | faultApplicationRadio, |
@@ -238,6 +249,9 @@ export default { | @@ -238,6 +249,9 @@ export default { | ||
238 | }, | 249 | }, |
239 | //打开网络监测卡片 | 250 | //打开网络监测卡片 |
240 | clickNetworkMonitorFunc(index){ | 251 | clickNetworkMonitorFunc(index){ |
252 | + if(!this.isSaveModel()){ | ||
253 | + return; | ||
254 | + } | ||
241 | this.hiddenAll(); | 255 | this.hiddenAll(); |
242 | this.networkMonitorHide = true; | 256 | this.networkMonitorHide = true; |
243 | this.isActiveIndex=index; | 257 | this.isActiveIndex=index; |
@@ -250,6 +264,9 @@ export default { | @@ -250,6 +264,9 @@ export default { | ||
250 | }, | 264 | }, |
251 | //打开应用监测卡片 | 265 | //打开应用监测卡片 |
252 | applicationMonitorFunc(index){ | 266 | applicationMonitorFunc(index){ |
267 | + if(!this.isSaveModel()){ | ||
268 | + return; | ||
269 | + } | ||
253 | this.hiddenAll(); | 270 | this.hiddenAll(); |
254 | this.applicationMonitorHide = true; | 271 | this.applicationMonitorHide = true; |
255 | this.isActiveIndex=index; | 272 | this.isActiveIndex=index; |
@@ -261,6 +278,9 @@ export default { | @@ -261,6 +278,9 @@ export default { | ||
261 | }, | 278 | }, |
262 | //打开基础环境卡片 | 279 | //打开基础环境卡片 |
263 | basicEnvironmentFunc(index){ | 280 | basicEnvironmentFunc(index){ |
281 | + if(!this.isSaveModel()){ | ||
282 | + return; | ||
283 | + } | ||
264 | this.postPropsData('base',index); | 284 | this.postPropsData('base',index); |
265 | /*if(this.busTypeArr){ | 285 | /*if(this.busTypeArr){ |
266 | this.hiddenAll(); | 286 | this.hiddenAll(); |
@@ -275,6 +295,9 @@ export default { | @@ -275,6 +295,9 @@ export default { | ||
275 | }, | 295 | }, |
276 | //APM | 296 | //APM |
277 | apmMonitorFunc(index){ | 297 | apmMonitorFunc(index){ |
298 | + if(!this.isSaveModel()){ | ||
299 | + return; | ||
300 | + } | ||
278 | this.hiddenAll(); | 301 | this.hiddenAll(); |
279 | this.apmMonitorHide = true; | 302 | this.apmMonitorHide = true; |
280 | this.isActiveIndex=index; | 303 | this.isActiveIndex=index; |
@@ -285,6 +308,9 @@ export default { | @@ -285,6 +308,9 @@ export default { | ||
285 | }, | 308 | }, |
286 | //日志检测 | 309 | //日志检测 |
287 | logDetectionFunc(index){ | 310 | logDetectionFunc(index){ |
311 | + if(!this.isSaveModel()){ | ||
312 | + return; | ||
313 | + } | ||
288 | this.$global.showMsg('敬请期待...','warning'); | 314 | this.$global.showMsg('敬请期待...','warning'); |
289 | return; | 315 | return; |
290 | this.hiddenAll(); | 316 | this.hiddenAll(); |
@@ -297,6 +323,9 @@ export default { | @@ -297,6 +323,9 @@ export default { | ||
297 | }, | 323 | }, |
298 | //报告订阅 | 324 | //报告订阅 |
299 | subscriptionReportFunc(index){ | 325 | subscriptionReportFunc(index){ |
326 | + if(!this.isSaveModel()){ | ||
327 | + return; | ||
328 | + } | ||
300 | this.$global.showMsg('敬请期待...','warning'); | 329 | this.$global.showMsg('敬请期待...','warning'); |
301 | return; | 330 | return; |
302 | this.hiddenAll(); | 331 | this.hiddenAll(); |
@@ -390,9 +419,13 @@ export default { | @@ -390,9 +419,13 @@ export default { | ||
390 | setDetailConfig(typeVal){ | 419 | setDetailConfig(typeVal){ |
391 | let that=this; | 420 | let that=this; |
392 | if(this.configData){ | 421 | if(this.configData){ |
422 | + console.log("configData",this.configData,typeVal) | ||
393 | this.configData.map((item,index)=>{ | 423 | this.configData.map((item,index)=>{ |
394 | if(item.type==typeVal){ | 424 | if(item.type==typeVal){ |
395 | - that.targetId=item.targetId; | 425 | + // that.targetId=item.targetId; |
426 | + that.setTargetId(item.targetId); | ||
427 | + that.faultConfId=item.faultConfId; | ||
428 | + | ||
396 | } | 429 | } |
397 | }) | 430 | }) |
398 | } | 431 | } |
@@ -400,7 +433,8 @@ export default { | @@ -400,7 +433,8 @@ export default { | ||
400 | this.propsData={ | 433 | this.propsData={ |
401 | bizId:this.busTypeArr, | 434 | bizId:this.busTypeArr, |
402 | docId:this.docId, | 435 | docId:this.docId, |
403 | - targetId:this.targetId | 436 | + targetId:this.targetId, |
437 | + faultConfId:this.faultConfId | ||
404 | } | 438 | } |
405 | }, | 439 | }, |
406 | 440 | ||
@@ -425,7 +459,26 @@ export default { | @@ -425,7 +459,26 @@ export default { | ||
425 | getNetworkMonitorList(itemData){ | 459 | getNetworkMonitorList(itemData){ |
426 | console.log("itemdata",itemData) | 460 | console.log("itemdata",itemData) |
427 | this.networkMonitorVisible=false; | 461 | this.networkMonitorVisible=false; |
428 | - this.networkMonitorList=itemData; | 462 | + this.networkMonitorList=itemData.networkMonitorList; |
463 | + this.setTargetId(itemData.targetId); | ||
464 | + // this.targetId=itemData.targetId; | ||
465 | + }, | ||
466 | + //给每个模块设置targetId | ||
467 | + setTargetId(val){ | ||
468 | + this.modelData.map((item,index)=>{ | ||
469 | + if(this.type==item.type){ | ||
470 | + item.targetId=val; | ||
471 | + } | ||
472 | + }) | ||
473 | + }, | ||
474 | + //获取模块对应的targetId | ||
475 | + getTargetId(type){ | ||
476 | + let that=this; | ||
477 | + this.modelData.map(item=>{ | ||
478 | + if(item.type==type){ | ||
479 | + that.targetId=item.targetId; | ||
480 | + } | ||
481 | + }) | ||
429 | }, | 482 | }, |
430 | //点击添加应用检测 | 483 | //点击添加应用检测 |
431 | addApplicationMonitor(){ | 484 | addApplicationMonitor(){ |
@@ -434,13 +487,15 @@ export default { | @@ -434,13 +487,15 @@ export default { | ||
434 | //关闭应用监测添加弹框 | 487 | //关闭应用监测添加弹框 |
435 | getApplicationMoniList(itemData){ | 488 | getApplicationMoniList(itemData){ |
436 | this.applicationMonitorVisible=false; | 489 | this.applicationMonitorVisible=false; |
437 | - this.targetId=itemData; | 490 | + this.setTargetId(itemData); |
491 | + // this.targetId=itemData; | ||
438 | // this.applicationMonitorList=itemData; | 492 | // this.applicationMonitorList=itemData; |
439 | this.getAppList(); | 493 | this.getAppList(); |
440 | }, | 494 | }, |
441 | //获取应用列表数据 | 495 | //获取应用列表数据 |
442 | getAppList(){ | 496 | getAppList(){ |
443 | let that=this; | 497 | let that=this; |
498 | + this.getTargetId('npm') | ||
444 | let params={ | 499 | let params={ |
445 | targetId:this.targetId, | 500 | targetId:this.targetId, |
446 | bizId:this.busTypeArr | 501 | bizId:this.busTypeArr |
@@ -464,12 +519,14 @@ export default { | @@ -464,12 +519,14 @@ export default { | ||
464 | getAPMList(itemData){ | 519 | getAPMList(itemData){ |
465 | this.APMVisible=false; | 520 | this.APMVisible=false; |
466 | // this.apmMonitorList=itemData; | 521 | // this.apmMonitorList=itemData; |
467 | - this.targetId=itemData; | 522 | + this.setTargetId(itemData); |
523 | + // this.targetId=itemData; | ||
468 | this.getApmListInfo(); | 524 | this.getApmListInfo(); |
469 | }, | 525 | }, |
470 | //获取apm列表数据 | 526 | //获取apm列表数据 |
471 | getApmListInfo(){ | 527 | getApmListInfo(){ |
472 | let that=this; | 528 | let that=this; |
529 | + this.getTargetId('apm') | ||
473 | let params={ | 530 | let params={ |
474 | targetId:this.targetId, | 531 | targetId:this.targetId, |
475 | bizId:this.busTypeArr | 532 | bizId:this.busTypeArr |
@@ -506,14 +563,16 @@ export default { | @@ -506,14 +563,16 @@ export default { | ||
506 | deleteEnvironment(obj){ | 563 | deleteEnvironment(obj){ |
507 | this.deleteItem(obj.id,obj.list) | 564 | this.deleteItem(obj.id,obj.list) |
508 | }, | 565 | }, |
509 | - //根据诊断文档id获取配置详情 | 566 | + //根据诊断文档列表的id获取配置详情 |
510 | getDetailByid(){ | 567 | getDetailByid(){ |
511 | let that=this; | 568 | let that=this; |
512 | if(this.docId){ | 569 | if(this.docId){ |
513 | let params={} | 570 | let params={} |
514 | - this.$http.get('/api-web/fault/conf/detail/'+this.docId,params,function (res){ | ||
515 | - if(res){ | ||
516 | - that.configData=res.data; | 571 | + this.$http.get('/api-web/fault/conf/'+this.docId,params,function (res){ |
572 | + if(res && res.object){ | ||
573 | + that.configData=res.object.confDetailList; | ||
574 | + that.faultConfId=that.configData[0].faultConfId; | ||
575 | + that.name=res.object.name; | ||
517 | 576 | ||
518 | } | 577 | } |
519 | 578 | ||
@@ -578,6 +637,7 @@ export default { | @@ -578,6 +637,7 @@ export default { | ||
578 | let that=this; | 637 | let that=this; |
579 | let params={ | 638 | let params={ |
580 | type:this.type, | 639 | type:this.type, |
640 | + targetId:this.targetId, | ||
581 | state:this.state, | 641 | state:this.state, |
582 | faultConfig:{ | 642 | faultConfig:{ |
583 | id:this.faultConfId, | 643 | id:this.faultConfId, |
@@ -588,7 +648,8 @@ export default { | @@ -588,7 +648,8 @@ export default { | ||
588 | } | 648 | } |
589 | this.$http.post('/api-web/fault/conf/detail/saveConfigDetail',params,function (res){ | 649 | this.$http.post('/api-web/fault/conf/detail/saveConfigDetail',params,function (res){ |
590 | if(res && res.success){ | 650 | if(res && res.success){ |
591 | - that.targetId=res.str; | 651 | + that.targetId=res.map.configDetail.targetId; |
652 | + that.faultConfId=res.map.configDetail.faultConfId; | ||
592 | 653 | ||
593 | that.$global.showMsg('保存成功','success') | 654 | that.$global.showMsg('保存成功','success') |
594 | that.switchModel(); | 655 | that.switchModel(); |
@@ -609,6 +670,7 @@ export default { | @@ -609,6 +670,7 @@ export default { | ||
609 | break; | 670 | break; |
610 | case "npm": | 671 | case "npm": |
611 | //应用检测 | 672 | //应用检测 |
673 | + this.getAppList(); | ||
612 | break; | 674 | break; |
613 | case "base": | 675 | case "base": |
614 | //基础环境 | 676 | //基础环境 |
@@ -616,6 +678,7 @@ export default { | @@ -616,6 +678,7 @@ export default { | ||
616 | break; | 678 | break; |
617 | case "apm": | 679 | case "apm": |
618 | //APM | 680 | //APM |
681 | + this.getApmListInfo(); | ||
619 | break; | 682 | break; |
620 | case "log": | 683 | case "log": |
621 | //日志检测 | 684 | //日志检测 |
@@ -630,6 +693,7 @@ export default { | @@ -630,6 +693,7 @@ export default { | ||
630 | //获取网络监测链路信息列表 | 693 | //获取网络监测链路信息列表 |
631 | getNetLinkList(){ | 694 | getNetLinkList(){ |
632 | let that=this; | 695 | let that=this; |
696 | + this.getTargetId('netlink') | ||
633 | let params={ | 697 | let params={ |
634 | targetId:this.targetId | 698 | targetId:this.targetId |
635 | 699 | ||
@@ -649,6 +713,7 @@ export default { | @@ -649,6 +713,7 @@ export default { | ||
649 | this.$http.get('/api-web/fault/base/config/queryKpiInfo',{},function (res){ | 713 | this.$http.get('/api-web/fault/base/config/queryKpiInfo',{},function (res){ |
650 | if(res && res.data){ | 714 | if(res && res.data){ |
651 | that.alarmList=res.data; | 715 | that.alarmList=res.data; |
716 | + that.kpiId=that.alarmList[0].kpiId; | ||
652 | } | 717 | } |
653 | 718 | ||
654 | }) | 719 | }) |
@@ -673,6 +738,8 @@ export default { | @@ -673,6 +738,8 @@ export default { | ||
673 | } | 738 | } |
674 | this.$http.post('/api-web/fault/conf/rule/saveOrUpdate',params,function (res){ | 739 | this.$http.post('/api-web/fault/conf/rule/saveOrUpdate',params,function (res){ |
675 | if(res && res.success){ | 740 | if(res && res.success){ |
741 | + that.targetId=res.map.bFaultRule.targetId; | ||
742 | + that.faultConfId=res.map.bFaultRule.faultConfId; | ||
676 | that.$global.showMsg('保存成功') | 743 | that.$global.showMsg('保存成功') |
677 | // that.alarmList=res.data; | 744 | // that.alarmList=res.data; |
678 | }else{ | 745 | }else{ |
@@ -708,6 +775,19 @@ export default { | @@ -708,6 +775,19 @@ export default { | ||
708 | if(this.type=='npm'){ | 775 | if(this.type=='npm'){ |
709 | this.getAppList(); | 776 | this.getAppList(); |
710 | } | 777 | } |
778 | + }, | ||
779 | + //返回首页 | ||
780 | + goBackIndex(){ | ||
781 | + this.$emit('backIndex','back') | ||
782 | + }, | ||
783 | + //判断是否保存了模块 | ||
784 | + isSaveModel(){ | ||
785 | + if(!this.faultConfId){ | ||
786 | + this.$global.showMsg('请先保存模块','warning'); | ||
787 | + return false; | ||
788 | + }else{ | ||
789 | + return true; | ||
790 | + } | ||
711 | } | 791 | } |
712 | 792 | ||
713 | 793 |
1 | -<el-dialog v-model="networkMonitorVisible" :title="titleName" width="60%" @close="closeDialog"> | 1 | +<el-dialog v-model="networkMonitorVisible" :title="titleName" width="90%" @close="closeDialog"> |
2 | <el-row v-if="!tableVisible"> | 2 | <el-row v-if="!tableVisible"> |
3 | <el-col :span="6"> | 3 | <el-col :span="6"> |
4 | <div class="grid-content bg-purple network-monitor-popup-left"> | 4 | <div class="grid-content bg-purple network-monitor-popup-left"> |
@@ -38,7 +38,7 @@ | @@ -38,7 +38,7 @@ | ||
38 | <div class="context-body"> | 38 | <div class="context-body"> |
39 | 39 | ||
40 | <el-row v-if="!addSetLIstVisible"> | 40 | <el-row v-if="!addSetLIstVisible"> |
41 | - <el-col :span="4" v-for="(itemNode,index) in nodeData"> | 41 | + <el-col :span="3" v-for="(itemNode,index) in nodeData"> |
42 | <div class="list-step flex-div-start"> | 42 | <div class="list-step flex-div-start"> |
43 | <div class="list-step-top flex-div"> | 43 | <div class="list-step-top flex-div"> |
44 | <el-tooltip | 44 | <el-tooltip |
@@ -57,9 +57,9 @@ | @@ -57,9 +57,9 @@ | ||
57 | <li>添加节点</li> | 57 | <li>添加节点</li> |
58 | </ul> | 58 | </ul> |
59 | </template> | 59 | </template> |
60 | - <div @click="addTableList(true)" :class="['step-img',{'isActive':itemNode[0].nodeName}]"> | 60 | + <div @click="addTableList(true)" :class="['step-img','flex-div-center',{'isActive':itemNode[0].nodeName}]"> |
61 | <i v-if="itemNode[0].nodeName" class="icon-delete-right" @click.stop="deleteNode(item,index)"></i> | 61 | <i v-if="itemNode[0].nodeName" class="icon-delete-right" @click.stop="deleteNode(item,index)"></i> |
62 | - <i class="icon-step"><img :src="'/src/style/img/restypeimg/'+itemNode[0].path" alt=""></i> | 62 | + <i class="icon-step flex-div-center"><img :src="'/src/style/img/restypeimg/'+itemNode[0].resType+'.png'" alt=""></i> |
63 | </div> | 63 | </div> |
64 | </el-tooltip> | 64 | </el-tooltip> |
65 | <!-- <span :class="['list-line',{'isActive':item.nodeName && index<nodeData.length}]"></span>--> | 65 | <!-- <span :class="['list-line',{'isActive':item.nodeName && index<nodeData.length}]"></span>--> |
@@ -201,11 +201,13 @@ export default { | @@ -201,11 +201,13 @@ export default { | ||
201 | let addRes=(row,index)=>{ | 201 | let addRes=(row,index)=>{ |
202 | console.log("row",row,proxy.nodeData) | 202 | console.log("row",row,proxy.nodeData) |
203 | let bNetNodeList=row; | 203 | let bNetNodeList=row; |
204 | - proxy.iconArr.map((v,i)=>{ | ||
205 | - if(row.resType==v.resType){ | ||
206 | - row.path=v.path; | ||
207 | - } | ||
208 | - }) | 204 | + bNetNodeList.isAdd=false; |
205 | + // proxy.iconArr.map((v,i)=>{ | ||
206 | + // if(row.resType==v.resType){ | ||
207 | + // row.path=v.path; | ||
208 | + // } | ||
209 | + // }) | ||
210 | + //flag表示线或点 true点 false线 | ||
209 | 211 | ||
210 | if(proxy.flag){ | 212 | if(proxy.flag){ |
211 | if(!proxy.nodeName){ | 213 | if(!proxy.nodeName){ |
@@ -215,16 +217,16 @@ export default { | @@ -215,16 +217,16 @@ export default { | ||
215 | bNetNodeList.nodeName=proxy.nodeName; | 217 | bNetNodeList.nodeName=proxy.nodeName; |
216 | bNetNodeList.type='dot'; | 218 | bNetNodeList.type='dot'; |
217 | 219 | ||
218 | - proxy.backLink(bNetNodeList); | 220 | + proxy.backLink(bNetNodeList,index); |
219 | } | 221 | } |
220 | }else{ | 222 | }else{ |
221 | bNetNodeList.type='line'; | 223 | bNetNodeList.type='line'; |
222 | - proxy.backLink(bNetNodeList); | 224 | + proxy.backLink(bNetNodeList,index); |
223 | } | 225 | } |
224 | 226 | ||
225 | 227 | ||
226 | } | 228 | } |
227 | - let backLink=(row)=>{ | 229 | + let backLink=(row,index)=>{ |
228 | proxy.tableVisible=false; | 230 | proxy.tableVisible=false; |
229 | 231 | ||
230 | let arr=proxy.nodeData; | 232 | let arr=proxy.nodeData; |
@@ -235,7 +237,14 @@ export default { | @@ -235,7 +237,14 @@ export default { | ||
235 | 237 | ||
236 | if(proxy.flag){ | 238 | if(proxy.flag){ |
237 | //插入的是点 | 239 | //插入的是点 |
238 | - proxy.nodeData.splice(length-1,0,[row]); | 240 | + console.log("isadd",row.isAdd) |
241 | + // if(row.isAdd){ | ||
242 | + //isAdd为true代表是添加 | ||
243 | + proxy.nodeData.splice(length-1,0,[row]); | ||
244 | + // }else{ | ||
245 | + //isAdd为false代表是修改 | ||
246 | + // proxy.nodeData.splice(index,1,[row]); | ||
247 | + // } | ||
239 | }else{ | 248 | }else{ |
240 | //插入的是线 | 249 | //插入的是线 |
241 | proxy.nodeData[length-2].push(row); | 250 | proxy.nodeData[length-2].push(row); |
@@ -244,7 +253,7 @@ export default { | @@ -244,7 +253,7 @@ export default { | ||
244 | 253 | ||
245 | }else{ | 254 | }else{ |
246 | proxy.nodeData.push([row]); | 255 | proxy.nodeData.push([row]); |
247 | - proxy.nodeData.push([{nodeName:'',id:''}]) | 256 | + proxy.nodeData.push([{nodeName:'',id:'',isAdd:true}]) |
248 | 257 | ||
249 | } | 258 | } |
250 | console.log(" proxy.nodeData", proxy.nodeData,proxy.nodeData.length) | 259 | console.log(" proxy.nodeData", proxy.nodeData,proxy.nodeData.length) |
@@ -360,13 +369,13 @@ export default { | @@ -360,13 +369,13 @@ export default { | ||
360 | if(res && res.data){ | 369 | if(res && res.data){ |
361 | // let resData=res.data.reverse(); | 370 | // let resData=res.data.reverse(); |
362 | let resData=res.data; | 371 | let resData=res.data; |
363 | - resData.map((item,index)=>{ | ||
364 | - that.iconArr.map((v,i)=>{ | ||
365 | - if(item.resType==v.resType){ | ||
366 | - item.path=v.path; | ||
367 | - } | ||
368 | - }) | ||
369 | - }) | 372 | + // resData.map((item,index)=>{ |
373 | + // that.iconArr.map((v,i)=>{ | ||
374 | + // if(item.resType==v.resType){ | ||
375 | + // item.path=v.path; | ||
376 | + // } | ||
377 | + // }) | ||
378 | + // }) | ||
370 | let arr=[]; | 379 | let arr=[]; |
371 | for(let i=0;i<resData.length;i+=2){ | 380 | for(let i=0;i<resData.length;i+=2){ |
372 | arr.push(resData.slice(i,i+2)) | 381 | arr.push(resData.slice(i,i+2)) |
@@ -376,7 +385,7 @@ export default { | @@ -376,7 +385,7 @@ export default { | ||
376 | console.log('nodedata',that.nodeData,that.nodeData.length) | 385 | console.log('nodedata',that.nodeData,that.nodeData.length) |
377 | if(that.nodeData.length>0){ | 386 | if(that.nodeData.length>0){ |
378 | that.addSetLIstVisible=false; | 387 | that.addSetLIstVisible=false; |
379 | - that.nodeData.push([{nodeName:'',id:''}]) | 388 | + that.nodeData.push([{nodeName:'',id:'',isAdd:true}]) |
380 | 389 | ||
381 | }else{ | 390 | }else{ |
382 | that.addSetLIstVisible=true; | 391 | that.addSetLIstVisible=true; |
@@ -443,7 +452,11 @@ export default { | @@ -443,7 +452,11 @@ export default { | ||
443 | }, | 452 | }, |
444 | //关闭弹框 | 453 | //关闭弹框 |
445 | closeDialog(){ | 454 | closeDialog(){ |
446 | - this.$emit('callback', this.networkMonitorList); | 455 | + let obj={ |
456 | + networkMonitorList:this.networkMonitorList, | ||
457 | + targetId:this.targetId | ||
458 | + } | ||
459 | + this.$emit('callback', obj); | ||
447 | }, | 460 | }, |
448 | 461 | ||
449 | 462 | ||
@@ -464,7 +477,7 @@ export default { | @@ -464,7 +477,7 @@ export default { | ||
464 | 477 | ||
465 | }, | 478 | }, |
466 | mounted () { | 479 | mounted () { |
467 | - this.getAllIcon(); | 480 | + // this.getAllIcon(); |
468 | this.setBizId(); | 481 | this.setBizId(); |
469 | this.getNetLinkList(); | 482 | this.getNetLinkList(); |
470 | // this.getNodeData(); | 483 | // this.getNodeData(); |
1 | -<component :is="componentItem" :diagnosisData="diagnosisData" @getItem="getItem" @getItemDetail="getItemDetail" :detailData="detailData" /> | 1 | +<component :is="componentItem" :diagnosisData="diagnosisData" @backIndex="backIndexFun" @getItem="getItem" @getItemDetail="getItemDetail" :detailData="detailData" /> |
2 | <!--<FaultAddIndex></FaultAddIndex>--> | 2 | <!--<FaultAddIndex></FaultAddIndex>--> |
@@ -73,6 +73,12 @@ export default { | @@ -73,6 +73,12 @@ export default { | ||
73 | proxy.componentItem=obj.componentName; | 73 | proxy.componentItem=obj.componentName; |
74 | proxy.detailData=obj.item; | 74 | proxy.detailData=obj.item; |
75 | } | 75 | } |
76 | + //返回首页回调函数 | ||
77 | + let backIndexFun=(val)=>{ | ||
78 | + console.log('gogogo',val) | ||
79 | + // proxy.componentItem=val; | ||
80 | + proxy.getListData(); | ||
81 | + } | ||
76 | 82 | ||
77 | 83 | ||
78 | return { | 84 | return { |
@@ -83,7 +89,8 @@ export default { | @@ -83,7 +89,8 @@ export default { | ||
83 | diagnosisData, | 89 | diagnosisData, |
84 | getItem, | 90 | getItem, |
85 | getItemDetail, | 91 | getItemDetail, |
86 | - detailData | 92 | + detailData, |
93 | + backIndexFun | ||
87 | 94 | ||
88 | } | 95 | } |
89 | } | 96 | } |
@@ -43,24 +43,12 @@ | @@ -43,24 +43,12 @@ | ||
43 | <cm-dialog :title="faultDetailDialogTitle" width="80%" :showDialogVisible="showFaultDetailDialog" | 43 | <cm-dialog :title="faultDetailDialogTitle" width="80%" :showDialogVisible="showFaultDetailDialog" |
44 | @hidedialog="closeFaultDetailDialog" :showFooter="false"> | 44 | @hidedialog="closeFaultDetailDialog" :showFooter="false"> |
45 | <template v-slot> | 45 | <template v-slot> |
46 | - <div> | 46 | + <div style="text-align: left;height:720px;max-height:720px;overflow-y: auto"> |
47 | <el-timeline> | 47 | <el-timeline> |
48 | - <el-timeline-item timestamp="2018/4/12" placement="top"> | 48 | + <el-timeline-item v-for="item in faultDetailDetailInfo.items" center :timestamp="item.faultTypeName" placement="top" :color="item.color" :hollow="true"> |
49 | <el-card> | 49 | <el-card> |
50 | - <h4>Update Github template</h4> | ||
51 | - <p>Tom committed 2018/4/12 20:46</p> | ||
52 | - </el-card> | ||
53 | - </el-timeline-item> | ||
54 | - <el-timeline-item timestamp="2018/4/3" placement="top"> | ||
55 | - <el-card> | ||
56 | - <h4>Update Github template</h4> | ||
57 | - <p>Tom committed 2018/4/3 20:46</p> | ||
58 | - </el-card> | ||
59 | - </el-timeline-item> | ||
60 | - <el-timeline-item timestamp="2018/4/2" placement="top"> | ||
61 | - <el-card> | ||
62 | - <h4>Update Github template</h4> | ||
63 | - <p>Tom committed 2018/4/2 20:46</p> | 50 | + <!-- <result-item :faultType="item.faultType" :faultNo="faultDetailDetailInfo.faultNo"></result-item>--> |
51 | + <component v-bind:is="item.components" :faultType="item.faultType" :faultNo="faultDetailDetailInfo.faultNo" /> | ||
64 | </el-card> | 52 | </el-card> |
65 | </el-timeline-item> | 53 | </el-timeline-item> |
66 | </el-timeline> | 54 | </el-timeline> |
1 | const faultDetail = () => { | 1 | const faultDetail = () => { |
2 | - const {proxy} = Vue.getCurrentInstance(); | 2 | + const { proxy } = Vue.getCurrentInstance(); |
3 | let showFaultDetailDialog = Vue.ref(false); | 3 | let showFaultDetailDialog = Vue.ref(false); |
4 | let faultDetailDialogTitle = Vue.ref(''); | 4 | let faultDetailDialogTitle = Vue.ref(''); |
5 | + let faultDetailDetailInfo = Vue.ref({ | ||
6 | + faultNo:'', | ||
7 | + items:[{ | ||
8 | + faultType:'BASE', | ||
9 | + faultTypeName:'基础', | ||
10 | + components:'result-item', | ||
11 | + color:'#67C23A' | ||
12 | + },{ | ||
13 | + faultType:'NETLINK', | ||
14 | + faultTypeName:'网络链路', | ||
15 | + components:'result-item', | ||
16 | + color:'#409EFF' | ||
17 | + },{ | ||
18 | + faultType:'NPM', | ||
19 | + faultTypeName:'NPM', | ||
20 | + components:'result-item', | ||
21 | + color:'#E6A23C' | ||
22 | + },{ | ||
23 | + faultType:'APM', | ||
24 | + faultTypeName:'APM', | ||
25 | + components:'result-item', | ||
26 | + color:'#F56C6C' | ||
27 | + }] | ||
28 | + }); | ||
5 | 29 | ||
6 | - | ||
7 | - let closeFaultDetailDialog = (flg) =>{ | 30 | + /** |
31 | + * 关闭弹框 | ||
32 | + * <p> | ||
33 | + * 作者: Wang | ||
34 | + * 时间:2021/12/13 20:14 | ||
35 | + */ | ||
36 | + let closeFaultDetailDialog = (flg) => { | ||
8 | showFaultDetailDialog.value = flg; | 37 | showFaultDetailDialog.value = flg; |
9 | } | 38 | } |
10 | 39 | ||
40 | + /** | ||
41 | + * 设置弹框信息 | ||
42 | + * @param row | ||
43 | + */ | ||
44 | + let settingDetail = (row) =>{ | ||
45 | + // 设置标题 | ||
46 | + faultDetailDialogTitle.value = `${row.faultBody}诊断报告`; | ||
47 | + | ||
48 | + faultDetailDetailInfo.value.faultNo = row.faultNo; | ||
49 | + | ||
50 | + } | ||
51 | + | ||
11 | return { | 52 | return { |
53 | + settingDetail, | ||
12 | showFaultDetailDialog, | 54 | showFaultDetailDialog, |
13 | faultDetailDialogTitle, | 55 | faultDetailDialogTitle, |
14 | - closeFaultDetailDialog | 56 | + closeFaultDetailDialog, |
57 | + faultDetailDetailInfo | ||
15 | } | 58 | } |
16 | } | 59 | } |
17 | export default { | 60 | export default { |
18 | name: 'resIndex', | 61 | name: 'resIndex', |
19 | template: '', | 62 | template: '', |
20 | - components: {}, | 63 | + components: { |
64 | + 'result-item':Vue.defineAsyncComponent( | ||
65 | + () => myImport('components/page/faultDiagnosis/result/item/index') | ||
66 | + ) | ||
67 | + }, | ||
21 | data() { | 68 | data() { |
22 | return { | 69 | return { |
23 | props: { | 70 | props: { |
@@ -29,6 +76,7 @@ export default { | @@ -29,6 +76,7 @@ export default { | ||
29 | setup() { | 76 | setup() { |
30 | const {proxy} = Vue.getCurrentInstance(); | 77 | const {proxy} = Vue.getCurrentInstance(); |
31 | let height = Vue.ref(window.innerHeight - 20); | 78 | let height = Vue.ref(window.innerHeight - 20); |
79 | + | ||
32 | // 搜索表单内容 | 80 | // 搜索表单内容 |
33 | let searchForm = Vue.ref({ | 81 | let searchForm = Vue.ref({ |
34 | keyword: '', | 82 | keyword: '', |
@@ -43,6 +91,9 @@ export default { | @@ -43,6 +91,9 @@ export default { | ||
43 | label: '故障主体', | 91 | label: '故障主体', |
44 | click: function (row) { | 92 | click: function (row) { |
45 | // 展示弹框 | 93 | // 展示弹框 |
94 | + closeFaultDetailDialog(true); | ||
95 | + // 设置相信信息 | ||
96 | + settingDetail(row); | ||
46 | } | 97 | } |
47 | }, { | 98 | }, { |
48 | prop: 'createTime', | 99 | prop: 'createTime', |
@@ -50,6 +101,27 @@ export default { | @@ -50,6 +101,27 @@ export default { | ||
50 | }, { | 101 | }, { |
51 | prop: 'faultState', | 102 | prop: 'faultState', |
52 | label: '故障状态' | 103 | label: '故障状态' |
104 | + }, { | ||
105 | + prop: 'solveway', | ||
106 | + label: '处理方式' | ||
107 | + }, { | ||
108 | + prop: 'solvetime', | ||
109 | + label: '处理时间' | ||
110 | + }, { | ||
111 | + prop: 'solveby', | ||
112 | + label: '处理人' | ||
113 | + }, { | ||
114 | + prop: 'duration', | ||
115 | + label: '持续时长' | ||
116 | + }, { | ||
117 | + prop: 'reason', | ||
118 | + label: '原因分析' | ||
119 | + }, { | ||
120 | + prop: 'solution', | ||
121 | + label: '处理方案' | ||
122 | + }, { | ||
123 | + prop: 'influencescope', | ||
124 | + label: '影响范围' | ||
53 | }], | 125 | }], |
54 | dataList: [], | 126 | dataList: [], |
55 | total: 0 | 127 | total: 0 |
@@ -82,14 +154,15 @@ export default { | @@ -82,14 +154,15 @@ export default { | ||
82 | let getPageInfo = ({page, limit}) => { | 154 | let getPageInfo = ({page, limit}) => { |
83 | searchForm.value.page = page; | 155 | searchForm.value.page = page; |
84 | searchForm.value.pageSize = limit; | 156 | searchForm.value.pageSize = limit; |
85 | - | ||
86 | // 下一页搜索 | 157 | // 下一页搜索 |
87 | getPage(); | 158 | getPage(); |
88 | } | 159 | } |
89 | 160 | ||
90 | const { | 161 | const { |
162 | + settingDetail, | ||
91 | showFaultDetailDialog, | 163 | showFaultDetailDialog, |
92 | faultDetailDialogTitle, | 164 | faultDetailDialogTitle, |
165 | + faultDetailDetailInfo, | ||
93 | closeFaultDetailDialog | 166 | closeFaultDetailDialog |
94 | } = faultDetail(); | 167 | } = faultDetail(); |
95 | 168 | ||
@@ -105,7 +178,14 @@ export default { | @@ -105,7 +178,14 @@ export default { | ||
105 | list, | 178 | list, |
106 | getPage, | 179 | getPage, |
107 | getPageInfo, | 180 | getPageInfo, |
108 | - handleClick | 181 | + handleClick, |
182 | + | ||
183 | + // 告警需求弹框 | ||
184 | + settingDetail, | ||
185 | + showFaultDetailDialog, | ||
186 | + faultDetailDialogTitle, | ||
187 | + faultDetailDetailInfo, | ||
188 | + closeFaultDetailDialog | ||
109 | } | 189 | } |
110 | } | 190 | } |
111 | } | 191 | } |
@@ -3,30 +3,68 @@ | @@ -3,30 +3,68 @@ | ||
3 | <div class="search"> | 3 | <div class="search"> |
4 | <div class="condition"> | 4 | <div class="condition"> |
5 | <el-form-item> | 5 | <el-form-item> |
6 | - <el-input v-model="formInline.user" placeholder="输入关键字"></el-input> | 6 | + <el-input v-model="searchForm.keyword" placeholder="输入关键字" |
7 | + @keydown.enter.native="getPage"></el-input> | ||
7 | </el-form-item> | 8 | </el-form-item> |
8 | - <el-form-item> | ||
9 | - <el-select v-model="formInline.region" placeholder="故障分类"> | 9 | + <!--<el-form-item> |
10 | + <el-select v-model="searchForm.category" placeholder="故障分类"> | ||
10 | <el-option label="Zone one" value="shanghai"></el-option> | 11 | <el-option label="Zone one" value="shanghai"></el-option> |
11 | <el-option label="Zone two" value="beijing"></el-option> | 12 | <el-option label="Zone two" value="beijing"></el-option> |
12 | </el-select> | 13 | </el-select> |
13 | - </el-form-item> | 14 | + </el-form-item>--> |
14 | </div> | 15 | </div> |
15 | <div class="btns"> | 16 | <div class="btns"> |
16 | <el-form-item> | 17 | <el-form-item> |
17 | - <el-button type="primary" @click="onSubmit">搜索</el-button> | 18 | + <el-button type="primary" @click="getPage">搜索</el-button> |
18 | </el-form-item> | 19 | </el-form-item> |
19 | </div> | 20 | </div> |
20 | </div> | 21 | </div> |
21 | 22 | ||
22 | - <cm-table-page :columns="[]" :dataList="[]" | ||
23 | - @loaddata="getPage" :showIndex="true" | ||
24 | - :showIndex="true" | ||
25 | - :showSelection="true" | ||
26 | - :pageSizes="[10,50,90, 200, 300, 400]" :pageSize="limit" | ||
27 | - :showBorder="true" :currentPage="currentPage" :total="total" :loading="false" | ||
28 | - :showPage="true" :height="(height - 105)" | ||
29 | - :maxWidth="max"> | ||
30 | - </cm-table-page> | 23 | + <div class="search-table"> |
24 | + <cm-table-page :columns="list.columns" | ||
25 | + :dataList="list.dataList" | ||
26 | + :total="list.total" | ||
27 | + @loaddata="getPageInfo" | ||
28 | + :showIndex="true" | ||
29 | + :showBorder="true" | ||
30 | + :showPage="true" | ||
31 | + :showTools="true" | ||
32 | + :height="(height - 105)"> | ||
33 | + <template #tools="{scope}"> | ||
34 | + <el-button type="text" size="small" @click.prevent="handleClick(scope.row,scope.$index)"> | ||
35 | + 处理 | ||
36 | + </el-button> | ||
37 | + </template> | ||
38 | + </cm-table-page> | ||
39 | + </div> | ||
31 | </div> | 40 | </div> |
41 | + | ||
42 | + <!-- 弹框区域 --> | ||
43 | + <cm-dialog :title="faultDetailDialogTitle" width="80%" :showDialogVisible="showFaultDetailDialog" | ||
44 | + @hidedialog="closeFaultDetailDialog" :showFooter="false"> | ||
45 | + <template v-slot> | ||
46 | + <div> | ||
47 | + <el-timeline> | ||
48 | + <el-timeline-item timestamp="2018/4/12" placement="top"> | ||
49 | + <el-card> | ||
50 | + <h4>Update Github template</h4> | ||
51 | + <p>Tom committed 2018/4/12 20:46</p> | ||
52 | + </el-card> | ||
53 | + </el-timeline-item> | ||
54 | + <el-timeline-item timestamp="2018/4/3" placement="top"> | ||
55 | + <el-card> | ||
56 | + <h4>Update Github template</h4> | ||
57 | + <p>Tom committed 2018/4/3 20:46</p> | ||
58 | + </el-card> | ||
59 | + </el-timeline-item> | ||
60 | + <el-timeline-item timestamp="2018/4/2" placement="top"> | ||
61 | + <el-card> | ||
62 | + <h4>Update Github template</h4> | ||
63 | + <p>Tom committed 2018/4/2 20:46</p> | ||
64 | + </el-card> | ||
65 | + </el-timeline-item> | ||
66 | + </el-timeline> | ||
67 | + </div> | ||
68 | + </template> | ||
69 | + </cm-dialog> | ||
32 | </div> | 70 | </div> |
1 | +const faultDetail = () => { | ||
2 | + const {proxy} = Vue.getCurrentInstance(); | ||
3 | + let showFaultDetailDialog = Vue.ref(false); | ||
4 | + let faultDetailDialogTitle = Vue.ref(''); | ||
5 | + | ||
6 | + /** | ||
7 | + * 关闭弹框 | ||
8 | + * <p> | ||
9 | + * 作者: Wang | ||
10 | + * 时间:2021/12/13 20:14 | ||
11 | + */ | ||
12 | + let closeFaultDetailDialog = (flg) => { | ||
13 | + showFaultDetailDialog.value = flg; | ||
14 | + } | ||
15 | + | ||
16 | + return { | ||
17 | + showFaultDetailDialog, | ||
18 | + faultDetailDialogTitle, | ||
19 | + closeFaultDetailDialog | ||
20 | + } | ||
21 | +} | ||
1 | export default { | 22 | export default { |
2 | name: 'resIndex', | 23 | name: 'resIndex', |
3 | template: '', | 24 | template: '', |
4 | - components: { | ||
5 | - }, | 25 | + components: {}, |
6 | data() { | 26 | data() { |
7 | return { | 27 | return { |
8 | - props : { | ||
9 | - label:'label', | ||
10 | - children:'children' | 28 | + props: { |
29 | + label: 'label', | ||
30 | + children: 'children' | ||
11 | } | 31 | } |
12 | } | 32 | } |
13 | }, | 33 | }, |
14 | setup() { | 34 | setup() { |
15 | const {proxy} = Vue.getCurrentInstance(); | 35 | const {proxy} = Vue.getCurrentInstance(); |
16 | - let height = Vue.ref(window.innerHeight -20); | 36 | + let height = Vue.ref(window.innerHeight - 20); |
17 | 37 | ||
18 | - let formInline = Vue.ref({ | ||
19 | - user: '', | ||
20 | - region: '', | 38 | + // 搜索表单内容 |
39 | + let searchForm = Vue.ref({ | ||
40 | + keyword: '', | ||
41 | + page: 1, | ||
42 | + pageSize: 10 | ||
21 | }); | 43 | }); |
44 | + | ||
45 | + // 列表展示结果 | ||
46 | + let list = Vue.ref({ | ||
47 | + columns: [{ | ||
48 | + prop: 'faultBody', | ||
49 | + label: '故障主体', | ||
50 | + click: function (row) { | ||
51 | + // 展示弹框 | ||
52 | + closeFaultDetailDialog(true); | ||
53 | + | ||
54 | + // 设置标题 | ||
55 | + faultDetailDialogTitle.value = `${row.faultBody}诊断报告`; | ||
56 | + } | ||
57 | + }, { | ||
58 | + prop: 'createTime', | ||
59 | + label: '发生时间' | ||
60 | + }, { | ||
61 | + prop: 'faultState', | ||
62 | + label: '故障状态' | ||
63 | + }], | ||
64 | + dataList: [], | ||
65 | + total: 0 | ||
66 | + }); | ||
67 | + | ||
68 | + /** | ||
69 | + * 分页查询 | ||
70 | + * <p> | ||
71 | + * 作者: Wang | ||
72 | + * 时间:2021/12/13 16:51 | ||
73 | + */ | ||
74 | + let getPage = () => { | ||
75 | + proxy.$http.get(`/api-web/fault/page`, searchForm.value, function (res) { | ||
76 | + if (res && res.data) { | ||
77 | + list.value.dataList = res.data; | ||
78 | + } | ||
79 | + }); | ||
80 | + } | ||
81 | + | ||
82 | + let handleClick = (row, index) => { | ||
83 | + | ||
84 | + } | ||
85 | + | ||
86 | + /** | ||
87 | + * 分页切换 | ||
88 | + * <p> | ||
89 | + * 作者: Wang | ||
90 | + * 时间:2021/12/13 17:06 | ||
91 | + */ | ||
92 | + let getPageInfo = ({page, limit}) => { | ||
93 | + searchForm.value.page = page; | ||
94 | + searchForm.value.pageSize = limit; | ||
95 | + | ||
96 | + // 下一页搜索 | ||
97 | + getPage(); | ||
98 | + } | ||
99 | + | ||
100 | + const { | ||
101 | + showFaultDetailDialog, | ||
102 | + faultDetailDialogTitle, | ||
103 | + closeFaultDetailDialog | ||
104 | + } = faultDetail(); | ||
105 | + | ||
22 | // 挂载完 | 106 | // 挂载完 |
23 | Vue.onMounted(() => { | 107 | Vue.onMounted(() => { |
24 | - | 108 | + // 初始化加载页面 |
109 | + getPage(); | ||
25 | }) | 110 | }) |
26 | 111 | ||
27 | - | ||
28 | return { | 112 | return { |
29 | height, | 113 | height, |
30 | - formInline | 114 | + searchForm, |
115 | + list, | ||
116 | + getPage, | ||
117 | + getPageInfo, | ||
118 | + handleClick, | ||
119 | + | ||
120 | + // 告警需求弹框 | ||
121 | + showFaultDetailDialog, | ||
122 | + faultDetailDialogTitle, | ||
123 | + closeFaultDetailDialog | ||
31 | } | 124 | } |
32 | } | 125 | } |
33 | } | 126 | } |
@@ -7,9 +7,11 @@ | @@ -7,9 +7,11 @@ | ||
7 | <div class="asset-overview-tip"> | 7 | <div class="asset-overview-tip"> |
8 | <div class="tip yxqk_tips_div"> | 8 | <div class="tip yxqk_tips_div"> |
9 | <div class="asset-tip"> | 9 | <div class="asset-tip"> |
10 | - <p @mouseover="showTip" @mouseleave="hideTip"> <i class="tip-i"></i> <span>资产总量</span></p> | 10 | + <!-- // Start Wang 2021/12/14 14:48 去除悬浮 --> |
11 | + <!--<p @mouseover="showTip" @mouseleave="hideTip"> <i class="tip-i"></i> <span>资产总量</span></p>--> | ||
12 | + <p> <i class="tip-i"></i> <span>资产总量</span></p> | ||
11 | <!--悬浮提示信息--> | 13 | <!--悬浮提示信息--> |
12 | - <div class="yxqk_tips_container" v-show="isShow" > | 14 | + <!--<div class="yxqk_tips_container" v-show="isShow" > |
13 | <ul class="items" id="yxjk_resource_type_count_tips" > | 15 | <ul class="items" id="yxjk_resource_type_count_tips" > |
14 | <div id="yxjk_resource_type_count_tips_tmpl" class="tipDiv"> | 16 | <div id="yxjk_resource_type_count_tips_tmpl" class="tipDiv"> |
15 | <li v-for="(item,index) in assetOverviewDataAll"> | 17 | <li v-for="(item,index) in assetOverviewDataAll"> |
@@ -18,13 +20,11 @@ | @@ -18,13 +20,11 @@ | ||
18 | </li> | 20 | </li> |
19 | </div> | 21 | </div> |
20 | </ul> | 22 | </ul> |
21 | - </div> | 23 | + </div>--> |
24 | + <!-- // End Wang 2021/12/14 14:48 去除悬浮 --> | ||
22 | </div> | 25 | </div> |
23 | 26 | ||
24 | <b id="yxjk_total_resource">{{totalData}}</b> | 27 | <b id="yxjk_total_resource">{{totalData}}</b> |
25 | - | ||
26 | - | ||
27 | - | ||
28 | </div> | 28 | </div> |
29 | <div id="all_resource_status" :class="['yxqk__pie',pieClass]"> | 29 | <div id="all_resource_status" :class="['yxqk__pie',pieClass]"> |
30 | <span id="yxjk_resource_health_text">{{healthStatusName}}</span> | 30 | <span id="yxjk_resource_health_text">{{healthStatusName}}</span> |
@@ -34,20 +34,43 @@ | @@ -34,20 +34,43 @@ | ||
34 | </div> | 34 | </div> |
35 | 35 | ||
36 | <div class="items"> | 36 | <div class="items"> |
37 | - <!--<span class="yxqk__banner--top"></span>--> | ||
38 | - <!--<span class="yxqk__banner--bottom"></span>--> | ||
39 | <div id="yxqk__banner"> | 37 | <div id="yxqk__banner"> |
40 | <ul id="yxjk_resource_type_count_id"> | 38 | <ul id="yxjk_resource_type_count_id"> |
41 | <div id="yxjk_resource_type_count_id_tmpl"> | 39 | <div id="yxjk_resource_type_count_id_tmpl"> |
42 | <li :class="'list-'+index" v-for="(item,index) in assetOverviewDataAll"> | 40 | <li :class="'list-'+index" v-for="(item,index) in assetOverviewDataAll"> |
43 | - <img :src="'src/assets/images/zjdp/'+item.code+'.png'"> | 41 | + <img :src="'src/assets/images/zjdp/'+item.alias+'.png'"> |
44 | <div style="margin-left: .02rem;"> | 42 | <div style="margin-left: .02rem;"> |
45 | - <p>{{item.name}}</p> | ||
46 | - <div class="listNum"> | ||
47 | - <b>{{item.num}}</b><span>台</span> | ||
48 | - </div> | ||
49 | - | ||
50 | - | 43 | + <el-popover placement="right-start" trigger="click" @show="showPopover(item)" popper-class="assets-popper-class layout2"> |
44 | + <template #reference> | ||
45 | + <div> | ||
46 | + <p>{{item.name}}</p> | ||
47 | + <div class="listNum"> | ||
48 | + <b>{{item.value}}</b><span>台</span> | ||
49 | + </div> | ||
50 | + </div> | ||
51 | + </template> | ||
52 | + <div style="display: flex;height: 100%"> | ||
53 | + <div class="left-item"> | ||
54 | + <div class="left-item-top"> | ||
55 | + {{item.name}} | ||
56 | + </div> | ||
57 | + <div class="left-item-bottom"> | ||
58 | + <b>{{item.value}}</b><span>台</span> | ||
59 | + </div> | ||
60 | + </div> | ||
61 | + <div class="right-item" > | ||
62 | + <div v-if="list.length == 0" class="text"> | ||
63 | + <span>暂无数据</span> | ||
64 | + </div> | ||
65 | + <div v-else v-for="d in list" class="text"> | ||
66 | + <div class="dd"></div> | ||
67 | + <div class="name">{{d.name}}</div> | ||
68 | + <div class="value">{{d.value}}</div> | ||
69 | + <div class="unit">台</div> | ||
70 | + </div> | ||
71 | + </div> | ||
72 | + </div> | ||
73 | + </el-popover> | ||
51 | </div> | 74 | </div> |
52 | </li> | 75 | </li> |
53 | </div> | 76 | </div> |
@@ -39,52 +39,64 @@ export default { | @@ -39,52 +39,64 @@ export default { | ||
39 | proxy.totalData=data.count; | 39 | proxy.totalData=data.count; |
40 | } | 40 | } |
41 | //分类总量 | 41 | //分类总量 |
42 | - if(data && data.object){ | 42 | + if(data && data.data){ |
43 | // //华为云、阿里云、Vmware、小型机分区、存储、路由器资源总量统计量 | 43 | // //华为云、阿里云、Vmware、小型机分区、存储、路由器资源总量统计量 |
44 | - // var tipsResTypes = ['HUAWEI_CLOUD','ALI_CLOUD','VIRTUALIZATION','HOST_MINICOMPUTER_PARTITION','STORAGE','NETHARDWARE_ROUTER']; | 44 | + |
45 | let huawei = 0, ali = 0, vmware = 0, minicomputer_partition = 0, storage = 0, router = 0; | 45 | let huawei = 0, ali = 0, vmware = 0, minicomputer_partition = 0, storage = 0, router = 0; |
46 | const showData = [];//展示的类型 | 46 | const showData = [];//展示的类型 |
47 | //华为云、阿里云、Vmware、小型机分区、存储、路由器资源总量统计量 | 47 | //华为云、阿里云、Vmware、小型机分区、存储、路由器资源总量统计量 |
48 | // 遍历过滤出以上6种类型的统计,因为是固定6种,所以先写死 | 48 | // 遍历过滤出以上6种类型的统计,因为是固定6种,所以先写死 |
49 | - $.each(data.object,function (i,v) { | 49 | + $.each(data.data,function (i,v) { |
50 | if(i<6){ | 50 | if(i<6){ |
51 | showData.push(v) | 51 | showData.push(v) |
52 | } | 52 | } |
53 | - /* const resType = v.code; | ||
54 | - if(resType.indexOf("HUAWEI_CLOUD_PLAT") >= 0 ) { huawei += v.num; } | ||
55 | - if(resType.indexOf("ALI_CLOUD_PLAT") >= 0 ) { ali += v.num; } | ||
56 | - if(resType.indexOf("VIRTUALIZATION_VMWARE") >= 0 ) { vmware += v.num; } | ||
57 | - if(resType.indexOf('HOST_MINICOMPUTER_PARTITION') >= 0 ) { minicomputer_partition += v.num; } | ||
58 | - if(resType.indexOf('HUAWEI_CLOUD_STORAGE') >= 0) { storage += v.num; } | ||
59 | - if(resType == 'NETHARDWARE_ROUTER' ) { router += v.num; }*/ | ||
60 | }); | 53 | }); |
61 | - /* showData.push({name:"华为云",num:huawei,code:'HUAWEI_CLOUD_PLAT'}); | ||
62 | - showData.push({name:"阿里云",num:ali,code:'ALI_CLOUD_PLAT'}); | ||
63 | - showData.push({name:"Vmware",num:vmware,code:'VIRTUALIZATION_VMWARE'}); | ||
64 | - showData.push({name:"小型机分区",num:minicomputer_partition,code:'HOST_MINICOMPUTER'}); | ||
65 | - showData.push({name:"存储",num:storage,code:'STORAGE'}); | ||
66 | - showData.push({name:"路由器",num:router,code:'NETHARDWARE_ROUTER'});*/ | ||
67 | - //类型统计 | ||
68 | - | ||
69 | proxy.assetOverviewData=showData; | 54 | proxy.assetOverviewData=showData; |
70 | - proxy.assetOverviewDataAll=data.object; | ||
71 | - | 55 | + proxy.assetOverviewDataAll=data.data; |
72 | //悬浮提示 | 56 | //悬浮提示 |
73 | - | ||
74 | } | 57 | } |
75 | }); | 58 | }); |
76 | - | ||
77 | }) | 59 | }) |
78 | const showTip=()=>{ | 60 | const showTip=()=>{ |
79 | proxy.isShow=true; | 61 | proxy.isShow=true; |
80 | - | ||
81 | } | 62 | } |
82 | const hideTip=()=>{ | 63 | const hideTip=()=>{ |
83 | proxy.isShow=false; | 64 | proxy.isShow=false; |
84 | } | 65 | } |
66 | + | ||
67 | + // Start Wang 2021/12/14 14:47 展示资产详情 | ||
68 | + let list = Vue.ref([]); | ||
69 | + let obj = Vue.ref({}); | ||
70 | + /** | ||
71 | + * 显示时触发 | ||
72 | + * <p> | ||
73 | + * 作者: Wang | ||
74 | + * 时间:2021/12/14 15:06 | ||
75 | + */ | ||
76 | + let showPopover = (item) =>{ | ||
77 | + let itemId = item.id; | ||
78 | + | ||
79 | + if(obj.value[itemId]){ | ||
80 | + list.value = obj.value[itemId]; | ||
81 | + } | ||
82 | + | ||
83 | + // 获取数据 | ||
84 | + proxy.$http.get('/api-web/bigScreen/getSeedSataus',{id:itemId},function (res){ | ||
85 | + if(res && res.data){ | ||
86 | + list.value = res.data; | ||
87 | + if(res.data.length > 0){ | ||
88 | + obj.value[itemId] = res.data; | ||
89 | + } | ||
90 | + } | ||
91 | + },null,false) | ||
92 | + } | ||
93 | + // End Wang 2021/12/14 14:47 展示资产详情 | ||
94 | + | ||
85 | return{ | 95 | return{ |
86 | showTip, | 96 | showTip, |
87 | - hideTip | 97 | + hideTip, |
98 | + list, | ||
99 | + showPopover | ||
88 | } | 100 | } |
89 | } | 101 | } |
90 | -} | ||
102 | +} |
-
Please register or login to post a comment