Skip to content

Commit f82613f

Browse files
salesonsaleson
committed
添加新的决策
优化界面选项
1 parent b06df5d commit f82613f

File tree

10 files changed

+775
-104
lines changed

10 files changed

+775
-104
lines changed

‎spring-cloud-gray-webui/src/views/gray-decision/complex-table.vue‎

Lines changed: 67 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -99,14 +99,18 @@
9999
</div>
100100
</el-form-item>
101101
<div>
102-
<HttpHeader v-if="temp.type === 'HttpHeader'" ref="HttpHeader" :info="temp.infos" @sendInfos="sendInfos" />
103-
<HttpMethod v-if="temp.type === 'HttpMethod'" ref="HttpMethod" :info="temp.infos" @sendInfos="sendInfos" />
104-
<HttpParameter v-if="temp.type === 'HttpParameter'" ref="HttpParameter" :info="temp.infos" @sendInfos="sendInfos" />
105-
<HttpTrackHeader v-if="temp.type === 'HttpTrackHeader'" ref="HttpTrackHeader" :info="temp.infos" @sendInfos="sendInfos" />
106-
<HttpTrackParameter v-if="temp.type === 'HttpTrackParameter'" ref="HttpTrackParameter" :info="temp.infos" @sendInfos="sendInfos" />
107-
<TraceIp v-if="temp.type === 'TraceIp'" ref="TraceIp" :info="temp.info" @sendInfos="sendInfos" />
108-
<TrackAttribute v-if="temp.type === 'TrackAttribute'" ref="TrackAttribute" :info="temp.infos" @sendInfos="sendInfos" />
109-
<FlowRate v-if="temp.type === 'FlowRate'" ref="FlowRate" :info="temp.infos" @sendInfos="sendInfos" />
102+
<HttpMethod v-if="temp.type === 'HttpMethod'" ref="HttpMethod" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
103+
<HttpHeader v-if="temp.type === 'HttpHeader'" ref="HttpHeader" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
104+
<HttpParameter v-if="temp.type === 'HttpParameter'" ref="HttpParameter" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
105+
<HttpTrackHeader v-if="temp.type === 'HttpTrackHeader'" ref="HttpTrackHeader" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
106+
<HttpTrackParameter v-if="temp.type === 'HttpTrackParameter'" ref="HttpTrackParameter" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
107+
<TraceIp v-if="temp.type === 'TraceIp'" ref="TraceIp" :info="temp.info" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
108+
<TrackAttribute v-if="temp.type === 'TrackAttribute'" ref="TrackAttribute" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
109+
<TrackAttributes v-if="temp.type === 'TrackAttributes'" ref="TrackAttributes" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
110+
<FlowRate v-if="temp.type === 'FlowRate'" ref="FlowRate" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
111+
<Attribute v-if="temp.type === 'Attribute'" ref="Attribute" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
112+
<Attributes v-if="temp.type === 'Attributes'" ref="Attributes" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
113+
<FixedValueRandomFlowRate v-if="temp.type === 'FixedValueRandomFlowRate'" ref="FixedValueRandomFlowRate" :info="temp.infos" @sendInfos="sendInfos" @sendDecisionName="sendDecisionName" />
110114
<el-form-item v-if="temp.type === '自定义名称'" label="infos" prop="infos">
111115
<el-input v-model="temp.infos" />
112116
</el-form-item>
@@ -144,14 +148,18 @@ import Pagination from '@/components/Pagination' // secondary package based on e
144148
export default {
145149
name: 'ComplexTable',
146150
components: { Pagination,
147-
HttpHeader: () => import('./components/HttpHeader'),
148151
HttpMethod: () => import('./components/HttpMethod'),
152+
HttpHeader: () => import('./components/HttpHeader'),
149153
HttpParameter: () => import('./components/HttpParameter'),
150154
HttpTrackHeader: () => import('./components/HttpTrackHeader'),
151155
HttpTrackParameter: () => import('./components/HttpTrackParameter'),
152156
TraceIp: () => import('./components/TraceIp'),
153157
TrackAttribute: () => import('./components/TrackAttribute'),
154-
FlowRate: () => import('./components/FlowRate')
158+
TrackAttributes: () => import('./components/TrackAttributes'),
159+
Attribute: () => import('./components/Attribute'),
160+
Attributes: () => import('./components/Attributes'),
161+
FlowRate: () => import('./components/FlowRate'),
162+
FixedValueRandomFlowRate: () => import('./components/FixedValueRandomFlowRate')
155163
},
156164
directives: { waves },
157165
data() {
@@ -178,11 +186,11 @@ export default {
178186
delFlag: 'UNDELETE'
179187
},
180188
options: [{
181-
value: 'HttpHeader',
182-
label: 'HttpHeader'
183-
}, {
184189
value: 'HttpMethod',
185190
label: 'HttpMethod'
191+
}, {
192+
value: 'HttpHeader',
193+
label: 'HttpHeader'
186194
}, {
187195
value: 'HttpParameter',
188196
label: 'HttpParameter'
@@ -198,15 +206,25 @@ export default {
198206
}, {
199207
value: 'TrackAttribute',
200208
label: 'TrackAttribute'
209+
}, {
210+
value: 'TrackAttributes',
211+
label: 'TrackAttributes'
212+
}, {
213+
value: 'Attribute',
214+
label: 'Attribute'
215+
}, {
216+
value: 'Attributes',
217+
label: 'Attributes'
201218
}, {
202219
value: 'FlowRate',
203220
label: 'FlowRate'
204-
},
205-
{
221+
}, {
222+
value: 'FixedValueRandomFlowRate',
223+
label: 'FixedValueRandomFlowRate'
224+
}, {
206225
value: '自定义名称',
207226
label: '自定义名称'
208-
}
209-
],
227+
}],
210228
sortOptions: [{ label: 'ID Ascending', key: '+id' }, { label: 'ID Descending', key: '-id' }],
211229
statusOptions: ['published', 'draft', 'deleted'],
212230
showReviewer: false,
@@ -217,6 +235,7 @@ export default {
217235
timestamp: new Date(),
218236
title: '',
219237
type: '',
238+
name: '',
220239
status: 'published'
221240
},
222241
dialogFormVisible: false,
@@ -249,6 +268,9 @@ export default {
249268
sendInfos(val) {
250269
this.temp.infos = val
251270
},
271+
sendDecisionName(name) {
272+
this.temp.name = name
273+
},
252274
setPageTitle() {
253275
const title = '灰度决策'
254276
document.title = `${title} - ${this.listQuery.policyId}`
@@ -343,38 +365,12 @@ export default {
343365
}
344366
})
345367
},
346-
checkName(str) {
347-
let flag = false
348-
this.options.forEach(item => {
349-
if (item.value === str) {
350-
flag = true
351-
}
352-
})
353-
return flag
354-
},
355-
handleUpdate(row) {
356-
this.temp = { ...row } // copy obj
357-
if (this.checkName(this.temp.name)) {
358-
this.$set(this.temp, 'type', this.temp.name)
359-
this.$nextTick(() => {
360-
this.$refs[this.temp.name].clear()
361-
})
362-
} else {
363-
this.$set(this.temp, 'type', '自定义名称')
364-
}
365-
console.log(this.temp)
366-
this.temp.timestamp = new Date(this.temp.timestamp)
367-
this.dialogStatus = 'update'
368-
this.dialogFormVisible = true
369-
this.$nextTick(() => {
370-
this.$refs['dataForm'].clearValidate()
371-
})
372-
},
373368
updateData() {
374369
this.$refs['dataForm'].validate((valid) => {
375370
if (valid) {
376371
if (this.temp.type !== '自定义名称') {
377372
if (this.$refs[this.temp.type].check()) {
373+
this.temp.name = this.temp.type
378374
const tempData = Object.assign({}, this.temp)
379375
tempData.timestamp = +new Date(tempData.timestamp) // change Thu Nov 30 2017 16:41:05 GMT+0800 (CST) to 1512031311464
380376
updateDecision(tempData).then(response => {
@@ -417,6 +413,33 @@ export default {
417413
}
418414
})
419415
},
416+
checkName(str) {
417+
let flag = false
418+
this.options.forEach(item => {
419+
if (item.value === str) {
420+
flag = true
421+
}
422+
})
423+
return flag
424+
},
425+
handleUpdate(row) {
426+
this.temp = { ...row } // copy obj
427+
if (this.checkName(this.temp.name)) {
428+
this.$set(this.temp, 'type', this.temp.name)
429+
this.$nextTick(() => {
430+
this.$refs[this.temp.name].clear()
431+
})
432+
} else {
433+
this.$set(this.temp, 'type', '自定义名称')
434+
}
435+
console.log(this.temp)
436+
this.temp.timestamp = new Date(this.temp.timestamp)
437+
this.dialogStatus = 'update'
438+
this.dialogFormVisible = true
439+
this.$nextTick(() => {
440+
this.$refs['dataForm'].clearValidate()
441+
})
442+
},
420443
handleDelete(row) {
421444
this.$confirm('Confirm to remove the record?', 'Warning', {
422445
confirmButtonText: 'Confirm',

‎spring-cloud-gray-webui/src/views/gray-decision/components/Attribute.vue‎

Lines changed: 154 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,154 @@
1+
<template>
2+
<div class="Attribute">
3+
<el-form
4+
ref="Attribute"
5+
:rules="rules"
6+
:model="infos"
7+
:inline="true"
8+
>
9+
<div class="selectBox">
10+
<el-form-item label="compareMode" prop="compareMode" label-width="120px">
11+
<el-select
12+
v-model="infos.compareMode"
13+
placeholder="请选择"
14+
>
15+
<el-option
16+
v-for="item in options"
17+
:key="item.value"
18+
:label="item.label"
19+
:value="item.value"
20+
/>
21+
</el-select>
22+
</el-form-item>
23+
<el-form-item label="name" prop="name">
24+
<el-input v-model="infos.name" />
25+
</el-form-item>
26+
<el-form-item label="value" prop="value">
27+
<el-input v-model="infos.value" />
28+
</el-form-item>
29+
</div>
30+
<div class="infosBox">
31+
<el-form-item label="infos" prop="infos" label-width="120px" style="width:100%">
32+
<el-input v-model="infos.infos" type="textarea" readonly />
33+
</el-form-item>
34+
35+
</div>
36+
</el-form>
37+
</div>
38+
</template>
39+
40+
<script>
41+
42+
export default {
43+
name: 'HttpHeader',
44+
props: {
45+
info: {
46+
type: String,
47+
default: ''
48+
}
49+
},
50+
data() {
51+
return {
52+
infos: {
53+
value: '',
54+
name: '',
55+
compareMode: '',
56+
infos: '{"compareMode":"","name":"","value":""}'
57+
},
58+
options: [{
59+
value: 'GT',
60+
label: 'GT'
61+
}, {
62+
value: 'GTE',
63+
label: 'GTE'
64+
}, {
65+
value: 'LT',
66+
label: 'LT'
67+
}, {
68+
value: 'LTE',
69+
label: 'LTE'
70+
}, {
71+
value: 'EQUAL',
72+
label: 'EQUAL'
73+
}, {
74+
value: 'UNEQUAL',
75+
label: 'UNEQUAL'
76+
}],
77+
rules: {
78+
compareMode: [{ required: true, message: 'compareMode is required', trigger: 'change' }],
79+
name: [{ required: true, message: 'header is required', trigger: 'blur' }],
80+
value: [{ required: true, message: 'value is required', trigger: 'blur' }]
81+
}
82+
}
83+
},
84+
computed: {
85+
name() {
86+
return this.infos.name
87+
},
88+
compareMode() {
89+
return this.infos.compareMode
90+
},
91+
value() {
92+
return this.infos.value
93+
}
94+
},
95+
watch: {
96+
name(a) {
97+
this.setInfos()
98+
},
99+
compareMode(a) {
100+
this.setInfos()
101+
},
102+
value(a) {
103+
this.setInfos()
104+
},
105+
info(a) {
106+
if (a) {
107+
if (this.info) {
108+
this.infos = { ...JSON.parse(this.info) }
109+
this.infos.infos = this.info
110+
console.log(this.infos)
111+
}
112+
}
113+
}
114+
},
115+
created() {
116+
if (this.info) {
117+
this.infos = { ...JSON.parse(this.info) }
118+
this.infos.infos = this.info
119+
console.log(this.infos)
120+
}
121+
},
122+
methods: {
123+
setInfos() {
124+
this.infos.infos = '{"compareMode":"' + this.infos.compareMode + '","name":"' + this.infos.name + '","value":"' + this.infos.value + '"}'
125+
this.$emit('sendInfos', this.infos.infos)
126+
},
127+
clear() {
128+
this.$refs.Attribute.clearValidate()
129+
},
130+
check() {
131+
let flag = false
132+
this.$refs.Attribute.validate((valid) => {
133+
flag = valid
134+
})
135+
return flag
136+
}
137+
}
138+
}
139+
</script>
140+
<style >
141+
.Attribute .selectBox .el-form-item{
142+
margin-right: 0;
143+
margin-left: 20px;
144+
}
145+
.Attribute .selectBox .el-form-item:first-child{
146+
margin: 0;
147+
}
148+
.Attribute .infosBox{
149+
width: 100%;
150+
}
151+
.Attribute .infosBox .el-form-item__content{
152+
width:80%;
153+
}
154+
</style>

0 commit comments

Comments
 (0)