|
|
@@ -2,7 +2,7 @@
|
|
|
<div class="app-container">
|
|
|
<el-header style="height:auto;!improtant">
|
|
|
<div class="filter-container" style="padding-bottom: 20px;!improtant">
|
|
|
- <el-input v-model="listQuery.whenScript" disabled placeholder="any" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
|
|
|
+ <!-- <el-input v-model="listQuery.whenScript" disabled placeholder="any" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" /> -->
|
|
|
<el-input v-model="listQuery.execSort" placeholder="优先级" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
|
|
|
<!-- <el-input-number v-model="listQuery.execSort" label="优先级" :min="1" :max="100" /> -->
|
|
|
<el-select v-model="listQuery.status" class="filter-item" filterable clearable placeholder="状态">
|
|
|
@@ -15,6 +15,9 @@
|
|
|
<el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-edit" @click="handleCreate">
|
|
|
新增
|
|
|
</el-button>
|
|
|
+ <el-checkbox v-model="showRules" class="filter-item" style="margin-left:15px;" @change="tableKey=tableKey+1">
|
|
|
+ 显示规则
|
|
|
+ </el-checkbox>
|
|
|
<el-checkbox v-model="showReviewer" class="filter-item" style="margin-left:15px;" @change="tableKey=tableKey+1">
|
|
|
显示返回值
|
|
|
</el-checkbox>
|
|
|
@@ -48,12 +51,12 @@
|
|
|
<span>{{ this.$route.query.methodProtocol }}</span>
|
|
|
<!-- </template> -->
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="规则" min-min-width="60px">
|
|
|
+ <!-- <el-table-column label="规则" min-min-width="60px">
|
|
|
<template slot-scope="{row}">
|
|
|
- <span>{{ row.whenScript }}</span>
|
|
|
- <!-- <el-tag>{{ row.type | typeFilter }}</el-tag> -->
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
+ <span>{{ row.whenScript }}</span> -->
|
|
|
+ //<!-- <el-tag>{{ row.type | typeFilter }}</el-tag> -->
|
|
|
+ <!-- </template>
|
|
|
+ </el-table-column> -->
|
|
|
<el-table-column label="优先级" min-width="110px" align="center">
|
|
|
<template slot-scope="scope">
|
|
|
<span>{{ scope.row.execSort }}</span>
|
|
|
@@ -76,6 +79,11 @@
|
|
|
</el-tag>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
+ <el-table-column v-if="showRules" label="规则" min-width="110px" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span style="color:red;">{{ scope.row.metaRuleList }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column v-if="showReviewer" label="返回值" min-width="110px" align="center">
|
|
|
<template slot-scope="scope">
|
|
|
<span style="color:red;">{{ scope.row.returnMessage }}</span>
|
|
|
@@ -105,18 +113,98 @@
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<pagination v-show="total>0" :total="total" :page.sync="listQuery.curIndex" :limit.sync="listQuery.pageSize" @pagination="getList" />
|
|
|
- <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="65%" @open="returnMessageData">
|
|
|
- <el-form ref="ruleDataForm" :rules="roleDataRules" :model="ruleData" label-position="left" label-width="120px" style="width: 500px; margin-left:80px;">
|
|
|
- <el-form-item label="规则" prop="whenScript">
|
|
|
- <el-input v-model="ruleData.whenScript" placeholder="any" disabled />
|
|
|
- </el-form-item>
|
|
|
+ <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="85%" @open="returnMessageData">
|
|
|
+
|
|
|
+ <el-form ref="ruleForm" :rules="rulesCheck" :model="ruleForm" label-width="150px" style="width: 830px;">
|
|
|
+ <!-- <div style="margin-right:-15%;">
|
|
|
+ <el-button type="primary" style="float: right;" @click="queryCel()">计算优先级</el-button>
|
|
|
+ <br><br><br><br><br></div> -->
|
|
|
+ <table>
|
|
|
+ <tr>
|
|
|
+ <el-form-item label="规则描述" prop="ruleDesc" style="margin-left:0.5%;">
|
|
|
+ <el-input v-model="rules.ruleDesc" clearable placeholder="输入规则描述" style="width:130px;margin:0 -3.5px;" filterable size="medium" />
|
|
|
+ </el-form-item>
|
|
|
+ <div style="margin-left:14%;">
|
|
|
+ <el-form-item v-for="(item, index) in ruleForm.metaRuleList" ref="key" :key="index" label-width="0">
|
|
|
+ <template>
|
|
|
+ <div v-show="index == 0 ? false : isNotAnyRequest" style="margin: -6% -30% 1% 21%;">
|
|
|
+ <el-divider>
|
|
|
+ <el-button-group>
|
|
|
+ <el-button ref="and" :style="styleBtn" circle plain size="mini" @click="changeAnd(index)">{{ and }}</el-button>
|
|
|
+ <el-button ref="or" circle plain size="mini" @click="changeOr(index)">{{ or }}</el-button>
|
|
|
+ </el-button-group>
|
|
|
+ <!-- <div :class="{red: !isshow,blue: isshow}" @click="isshow=!isshow">并且</div>
|
|
|
+ <div :class="{red: !isshow,blue: isshow}" @click="isshow=!isshow">或者</div> -->
|
|
|
+ <!-- <div style="border:1px solid #000; border-radius:50% 0 0 50%;text-align:center;line-height:26px;">并且</div> -->
|
|
|
+
|
|
|
+ </el-divider>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <el-row ref="priorBackgroup" :gutter="2" style="width: 140%;white-space:nowrap;">
|
|
|
+ <el-col :span="3">
|
|
|
+ <el-form-item>
|
|
|
+ <el-tooltip visible-arrow="false" effect="light" content="连续勾选可以优先计算" placement="left-start">
|
|
|
+ <el-checkbox v-show="isNotAnyRequest" ref="priorCheck" v-model="itemData.prior" :disabled="priorDistabledStatus(index)" style="margin-right: 0 8% 10% 0%;" size="mini" @change="priorChanged(index)">规则{{ index+1 }}</el-checkbox>
|
|
|
+ </el-tooltip>
|
|
|
+ <!-- <el-checkbox ref="priorCheck" :disabled="checkDisabled(index)" style="margin-right: 0 8% 10% 0%;" size="mini" v-model="itemData.prior" v-show="isNotAnyRequest" >规则{{index+1}}</el-checkbox> -->
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <!-- <div v-show="isAnyShow==true">规则</div> -->
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item
|
|
|
+ style="color:red; white-space:nowrap;"
|
|
|
+ :prop="'metaRuleList.' + index + '.expression1'"
|
|
|
+ :rules-check="{required: true, message: '请选择规则表达式', trigger: 'blur'}"
|
|
|
+ >
|
|
|
+ <el-select v-if="index == 0 ? true : isNotAnyRequest" v-model="itemData.expression1" clearable placeholder="请选择表达式" style="width:130px;margin: 0 1% 1% -15.8%;" fiterable size="medium" @change="chooseTest1">
|
|
|
+ <el-option v-for="item1 in getExpressOpt(index)" :key="item1.desc" :label="item1.descChn" :value="item1.desc" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item :prop="'metaRuleList.' + index + '.expression2'" :rules-check="{required: true, message: '请输入参数', trigger: 'blur'}">
|
|
|
+ <el-input v-show="isNotAnyRequest" v-model="itemData.expression2" clearable placeholder="请输入参数" style="width:130px;margin:0 -15.5px;" filterable size="medium" @change="chooseTest2" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item :prop="'metaRuleList.' + index + '.judgeType'" :rules-check="{required: true, message: '请选择运算方式', trigger: 'blur'}">
|
|
|
+ <el-select v-show="isNotAnyRequest" v-model="itemData.judgeType" clearable placeholder="请选择运算方式" style="width:130px;margin:0 -5.5px;" filterable size="medium" @change="chooseTest3">
|
|
|
+ <el-option v-for="item1 in operatorOptions" :key="item1.character" :label="item1.desc" :value="item1.character" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item
|
|
|
+ :prop="'metaRuleList.' + index + '.judgeValue'"
|
|
|
+ :rules-check="{required: true, message: '请输入值', trigger: 'blur'}"
|
|
|
+ >
|
|
|
+ <el-input v-show="isNotAnyRequest" v-model="itemData.judgeValue" clearable placeholder="请输入值" style="width:130px;margin:0 5.5px;" filterable size="medium" @change="chooseTest4" />
|
|
|
+ <el-button v-if="index == 0 && isNotAnyRequest==true" icon="el-icon-plus" type="success" size="mini" circle @click="addList()" />
|
|
|
+ <el-button v-show="index == 0 ? false : isNotAnyRequest" icon="el-icon-minus" type="danger" size="mini" circle @click="delList(index)" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ </el-row>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+
|
|
|
+ <br>
|
|
|
+ <br>
|
|
|
+ <br>
|
|
|
<el-form-item label="优先级" prop="execSort">
|
|
|
- <el-input-number v-model="ruleData.execSort" label="优先级" :min="1" :max="100" title="值越大，优先级越高" />
|
|
|
+ <el-input-number v-model="rules.execSort" label="优先级" :min="1" :max="100" title="值越大，优先级越高" />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="返回值" prop="returnMessage">
|
|
|
- <el-input v-model="ruleData.returnMessage" :autosize="{ minRows: 3, maxRows: 10}" type="textarea" :placeholder="jsonTit" />
|
|
|
+ <el-input v-model="rules.returnMessage" size:large :autosize="{ minRows: 3, maxRows: 20}" type="textarea" :placeholder="jsonTit" />
|
|
|
</el-form-item>
|
|
|
+
|
|
|
</el-form>
|
|
|
+
|
|
|
+ <el-form label-width="150px" style="width: 880px;" />
|
|
|
+
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button @click="dialogFormVisible = false">
|
|
|
取消
|
|
|
@@ -124,8 +212,11 @@
|
|
|
<el-button v-if="showSubmit" type="primary" @click="dialogStatus==='create'?createData():updateData()">
|
|
|
确定
|
|
|
</el-button>
|
|
|
+
|
|
|
</div>
|
|
|
+
|
|
|
</el-dialog>
|
|
|
+
|
|
|
<el-dialog :visible.sync="dialogPvVisible" title="Reading statistics">
|
|
|
<el-table :data="pvData" border fit highlight-current-row style="width: 100%">
|
|
|
<el-table-column prop="key" label="Channel" />
|
|
|
@@ -139,19 +230,16 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { fetchEnvInfo, fetchRuleById, fetchRuleList, createRule, updateRule, changeStatus } from '@/api/httprule'
|
|
|
+import { fetchEnvInfo, fetchRuleById, fetchRuleList, createRule, updateRule, changeStatus, getHttpOp, getExpress } from '@/api/httprule'
|
|
|
import waves from '@/directive/waves' // waves directive
|
|
|
import { parseTime } from '@/utils'
|
|
|
import Pagination from '@/components/Pagination' // secondary package based on el-pagination
|
|
|
-
|
|
|
// var envSelections = []
|
|
|
-
|
|
|
const ruleStatus = [
|
|
|
{ key: 1, display_name: '已开启' },
|
|
|
{ key: 0, display_name: '未开启' },
|
|
|
{ key: '', display_name: '全部显示' }
|
|
|
]
|
|
|
-
|
|
|
export default {
|
|
|
name: 'Httprule',
|
|
|
components: { Pagination },
|
|
|
@@ -168,9 +256,63 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ Id: '',
|
|
|
+ num: 0,
|
|
|
+ itemData: {},
|
|
|
+ activeColor: '#000',
|
|
|
+ back: '#FFFFFF',
|
|
|
+ backColor: '#FFFFFF',
|
|
|
+ active: '#000',
|
|
|
+ // andButton:"&&",
|
|
|
+ // orButton:"",
|
|
|
+ firstIndex: 1,
|
|
|
+ isshow: true,
|
|
|
+ isAnyshow: false,
|
|
|
+ isNotAnyRequest: true,
|
|
|
+ btnRequest: true,
|
|
|
+ expression: '',
|
|
|
+ expression1: '',
|
|
|
+ expression2: '',
|
|
|
+ btnReception: {},
|
|
|
+ chooseIndex: 'reset',
|
|
|
+ userNames: localStorage.getItem('realname'),
|
|
|
styleObj: {
|
|
|
'color': 'rgba(0, 0, 0, 0.726)'
|
|
|
},
|
|
|
+ styleBtn: {
|
|
|
+ 'color': '#FFFFFF',
|
|
|
+ 'background': '#409EFF'
|
|
|
+ },
|
|
|
+ ruleForm: {
|
|
|
+ // metaRuleList:[{ operator:'', expression:'', judgeType:'', judgeValue:''},{},{}]
|
|
|
+ maxPrior: -1,
|
|
|
+ minPrior: 100,
|
|
|
+ execSort: '',
|
|
|
+ ruleDesc: '',
|
|
|
+ metaRuleList: [{ operator: '', expression1: '', expression2: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }]
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ execSort: '',
|
|
|
+ ruleDesc: '',
|
|
|
+ // metaRuleList:[{ operator:'', expression:'', judgeType:'', judgeValue:''},{},{}]
|
|
|
+ metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '' }]
|
|
|
+ },
|
|
|
+
|
|
|
+ evaluators: [],
|
|
|
+ rulesCheck: {
|
|
|
+ expression1: [
|
|
|
+ { required: true, message: '请输入方法', trigger: 'blur' }
|
|
|
+ ],
|
|
|
+ expression2: [
|
|
|
+ { required: true, message: '请输入运算符', trigger: 'blur' }
|
|
|
+ ],
|
|
|
+ judgeType: [
|
|
|
+ { required: true, message: '请选择匹配规则', trigger: 'change' }
|
|
|
+ ],
|
|
|
+ judgeValue: [
|
|
|
+ { required: true, message: '请选择参数', trigger: 'change' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
tableKey: 0,
|
|
|
list: null,
|
|
|
total: 0,
|
|
|
@@ -180,29 +322,39 @@ export default {
|
|
|
listQuery: {
|
|
|
curIndex: 1,
|
|
|
pageSize: 20,
|
|
|
- whenScript: 'any',
|
|
|
+ // whenScript: 'any',
|
|
|
methodId: 0,
|
|
|
execSort: null,
|
|
|
status: null,
|
|
|
methodName: '',
|
|
|
- methodProtocol: 'http'
|
|
|
+ methodProtocol: 'http',
|
|
|
+ formLabelWidths: '7px',
|
|
|
+ paramtions: {}
|
|
|
},
|
|
|
showSubmit: true,
|
|
|
jsonTit: `{ 'code': 200, 'data': { 'crowdComposition': 'U_866', 'campaignId': 789, 'id': 4606, 'class': 'com.didi.prado.config.api.dto.CampaignCrowdDTO'}}`,
|
|
|
- sortOptions: [{ label: 'ID Ascending', key: '+id' }, { label: 'ID Descending', key: '-id' }],
|
|
|
+ // sortOptions: [{ label: 'ID Ascending', key: '+id' }, { label: 'ID Descending', key: '-id' }],
|
|
|
+ // operatorOption: [{ name: '等于', value: "=" }, { name: '大于', value: ">" }, { name: '小于', value: "<" }, { name: '不等于', value: "!=" }],
|
|
|
+ operatorOptions: [],
|
|
|
+ expressOptions: [],
|
|
|
+ expressOptionWithutAny: [],
|
|
|
+ // paramOptions:[{ name: 'any', value: 0 }, { name: 'param', value: 1 },{ name: 'param2', value: 2 }],
|
|
|
statusOptions: ['published', 'draft', 'deleted'],
|
|
|
showReviewer: false,
|
|
|
+ metaRule: [],
|
|
|
+ showRules: false,
|
|
|
ruleData: {
|
|
|
- methodId: 0,
|
|
|
- updator: '',
|
|
|
- methodName: '',
|
|
|
- execSort: 1,
|
|
|
- whenScript: '',
|
|
|
- returnMessage: '',
|
|
|
- curIndex: 1,
|
|
|
- pageSize: 20,
|
|
|
- methodProtocol: 'http'
|
|
|
+ // methodId: 0,
|
|
|
+ // updator: '',
|
|
|
+ // methodName: '',
|
|
|
+ // execSort: 1,
|
|
|
+ // whenScript: '',
|
|
|
+ // returnMessage: '',
|
|
|
+ // curIndex: 1,
|
|
|
+ // pageSize: 20,
|
|
|
+ // methodProtocol: 'http'
|
|
|
},
|
|
|
+
|
|
|
dialogFormVisible: false,
|
|
|
dialogStatus: '',
|
|
|
textMap: {
|
|
|
@@ -223,14 +375,179 @@ export default {
|
|
|
// methodParamsTypes: [{ required: true, message: '入参类型不能为空', trigger: 'change' }],
|
|
|
// returnDataStructure: [{ required: true, message: '返回值类型不能为空', trigger: 'change' }]
|
|
|
},
|
|
|
- downloadLoading: false
|
|
|
+ downloadLoading: false,
|
|
|
+ sty: { color: '#FFFFFF', background: 'red' },
|
|
|
+ stys: { color: '#FFFFFF', background: 'red' },
|
|
|
+ or: '或者',
|
|
|
+ and: '并且'
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
this.getList()
|
|
|
this.getFormatJsonStrFromStringRule(this.jsonTit)
|
|
|
+ this.getHttpOp()
|
|
|
+ this.getExpress()
|
|
|
},
|
|
|
methods: {
|
|
|
+ getExpressOpt(index) {
|
|
|
+ if (index === 0) {
|
|
|
+ return this.expressOptions
|
|
|
+ } else {
|
|
|
+ return this.expressOptionWithutAny
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 优先计算
|
|
|
+ queryCel() {
|
|
|
+ this.$confirm('确定优先计算吗?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '优先计算成功!'
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: '已取消优先计算'
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 改变逻辑button
|
|
|
+ changeAnd(index) {
|
|
|
+ this.$refs.and[index].$el.style.color = '#FFFFFF'
|
|
|
+ this.$refs.and[index].$el.style.background = '#409EFF'
|
|
|
+ this.$refs.or[index].$el.style.color = '#606266'
|
|
|
+ this.$refs.or[index].$el.style.background = '#FFFFFF'
|
|
|
+
|
|
|
+ this.ruleForm.metaRuleList[index].operator = '&&'
|
|
|
+ console.log(this.ruleForm.metaRuleList[index].operator)
|
|
|
+ },
|
|
|
+ changeOr(index) {
|
|
|
+ this.$refs.or[index].$el.style.color = '#FFFFFF'
|
|
|
+ this.$refs.or[index].$el.style.background = '#409EFF'
|
|
|
+ this.$refs.and[index].$el.style.color = '#606266'
|
|
|
+ this.$refs.and[index].$el.style.background = '#FFFFFF'
|
|
|
+ this.ruleForm.metaRuleList[index].operator = '||'
|
|
|
+ },
|
|
|
+
|
|
|
+ addList(index) {
|
|
|
+ // this.num===index
|
|
|
+ if (this.ruleForm.metaRuleList.length >= 10) {
|
|
|
+ alert('不准再加啦')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.ruleForm.metaRuleList.push({ operator: '&&' })
|
|
|
+ },
|
|
|
+ delList(index) {
|
|
|
+ this.num === index
|
|
|
+ this.ruleForm.metaRuleList.splice(index, 1)
|
|
|
+ console.log(this.num)
|
|
|
+ console.log(index)
|
|
|
+ },
|
|
|
+ chooseTest1(val) {
|
|
|
+ this.expression1 = val
|
|
|
+ console.log(val)
|
|
|
+ if (this.ruleForm.metaRuleList[0].expression1 === 'any request') {
|
|
|
+ this.isNotAnyRequest = false
|
|
|
+ this.isAnyshow = true
|
|
|
+ } else {
|
|
|
+ this.isNotAnyRequest = true
|
|
|
+
|
|
|
+ // this.paramOptions.push(0,0,{ name: 'any', value: 0 })
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ chooseTest2(val) {
|
|
|
+ this.expression2 = val
|
|
|
+ },
|
|
|
+ chooseTest3(val) {
|
|
|
+ this.ruleForm.metaRuleList.judgeType = val
|
|
|
+ },
|
|
|
+ chooseTest4(val) {
|
|
|
+ this.ruleForm.metaRuleList.judgeValue = val
|
|
|
+ },
|
|
|
+
|
|
|
+ // 获取运算符
|
|
|
+ getHttpOp() {
|
|
|
+ getHttpOp().then(response => {
|
|
|
+ this.operatorOptions = response.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取规则表达式
|
|
|
+ getExpress() {
|
|
|
+ getExpress().then(response => {
|
|
|
+ this.expressOptions = response.data
|
|
|
+ this.expressOptions.forEach((opt, index) => {
|
|
|
+ if (opt.desc === 'any request') {
|
|
|
+ return true
|
|
|
+ }
|
|
|
+ this.expressOptionWithutAny.push(opt)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 根据index和maxPrior,minPrior状态决定复选框是否被禁用
|
|
|
+ priorDistabledStatus(index) {
|
|
|
+ var maxMin = this.findMaxMinOfMetaList()
|
|
|
+ var min = maxMin.min
|
|
|
+ var max = maxMin.max
|
|
|
+ if (max === -1 || // 初始状态，一个都没勾选
|
|
|
+ index === min || index === min - 1 || index === max || index === max + 1) {
|
|
|
+ return false // 置白
|
|
|
+ } else {
|
|
|
+ return true // 置灰
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 优先级计算----直接用disable来判断,改变maxPrior,minPrior状态驱动展示变化,见priorDistabledStatus方法
|
|
|
+ priorChanged(index) {
|
|
|
+ console.log('priorChanged ' + index)
|
|
|
+ console.log(this.$refs)
|
|
|
+ console.log('max ' + this.ruleForm.maxPrior + ' min ' + this.ruleForm.minPrior)
|
|
|
+ // this.$refs.priorBackgroup[index].$el.style.color = '#FFFFFF'
|
|
|
+ if (this.ruleForm.metaRuleList[index].prior === true) {
|
|
|
+ this.$refs.priorBackgroup[index].$el.style.background = '#F4F4F5'
|
|
|
+ } else {
|
|
|
+ this.$refs.priorBackgroup[index].$el.style.background = '#FFFFFF'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ findMaxMinOfMetaList() {
|
|
|
+ var maxMin = {
|
|
|
+ max: -1,
|
|
|
+ min: -1
|
|
|
+ }
|
|
|
+ for (let i = 0, len = this.ruleForm.metaRuleList.length; i < len; i++) {
|
|
|
+ if (this.ruleForm.metaRuleList[i].prior === true) {
|
|
|
+ maxMin.max = i
|
|
|
+ if (maxMin.min === -1) {
|
|
|
+ maxMin.min = i
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return maxMin
|
|
|
+ },
|
|
|
+ addBracket(index) {
|
|
|
+ // var min1 = -1
|
|
|
+ // var max1 = -1
|
|
|
+ // for(let j = 0, len = this.ruleForm.metaRuleList.length; j < len; j++) {
|
|
|
+ // if (this.ruleForm.metaRuleList[j].prior == true){
|
|
|
+ // max1 = j
|
|
|
+ // if (min1 == -1){
|
|
|
+ // min1 = j
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+
|
|
|
+ // if (index == min1){
|
|
|
+ // this.ruleForm.metaRuleList[j].bracket == "("
|
|
|
+ // }
|
|
|
+ // if(index == max1){
|
|
|
+ // this.ruleForm.metaRuleList[j+1].bracket == ")"
|
|
|
+ // }
|
|
|
+ // console.log("max1 " + this.ruleForm.maxPrior + " min1 " + this.ruleForm.minPrior)
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
prev() {
|
|
|
this.$router.go(-1)
|
|
|
},
|
|
|
@@ -245,7 +562,7 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
returnMessageData() {
|
|
|
- this.getFormatJsonStrFromStringRule1(this.ruleData.returnMessage)
|
|
|
+ this.getFormatJsonStrFromStringRule1(this.rules.returnMessage)
|
|
|
},
|
|
|
getFormatJsonStrFromStringRule: function(jsonStr) {
|
|
|
var res = ''
|
|
|
@@ -287,10 +604,10 @@ export default {
|
|
|
res += ele
|
|
|
}
|
|
|
// eslint-disable-next-line no-return-assign
|
|
|
- return this.ruleData.returnMessage = res
|
|
|
+ return this.rules.returnMessage = res
|
|
|
},
|
|
|
updateEnvChannel(v) {
|
|
|
- this.ruleData.envChannel = v
|
|
|
+ this.rules.envChannel = v
|
|
|
this.envSelections = []
|
|
|
fetchEnvInfo(v).then(response => {
|
|
|
for (var sel of response.data) {
|
|
|
@@ -321,12 +638,13 @@ export default {
|
|
|
this.handleFilter()
|
|
|
},
|
|
|
resetServiceData() {
|
|
|
- this.ruleData = {
|
|
|
+ this.rules = {
|
|
|
methodId: 0,
|
|
|
updator: '',
|
|
|
execSort: 1,
|
|
|
whenScript: '',
|
|
|
returnMessage: '',
|
|
|
+ metaRuleList: [],
|
|
|
curIndex: 1,
|
|
|
pageSize: 20
|
|
|
}
|
|
|
@@ -337,39 +655,65 @@ export default {
|
|
|
this.dialogFormVisible = true
|
|
|
this.showSubmit = true
|
|
|
this.$nextTick(() => {
|
|
|
- this.$refs['ruleDataForm'].clearValidate()
|
|
|
+ this.$refs['ruleForm'].clearValidate()
|
|
|
})
|
|
|
},
|
|
|
- createData() {
|
|
|
- const shouldJson = this.ruleData.returnMessage
|
|
|
+ createData(vel) {
|
|
|
+ const shouldJson = this.rules.returnMessage
|
|
|
console.log('dasdsadsad' + typeof (shouldJson))
|
|
|
- if (this.ruleData.whenScript === '') { this.ruleData.whenScript = 'any' }
|
|
|
+ var maxMin = this.findMaxMinOfMetaList()
|
|
|
+ console.log('maxMin ' + JSON.stringify(maxMin))
|
|
|
if (typeof shouldJson === 'string') {
|
|
|
- this.$refs['ruleDataForm'].validate((valid) => {
|
|
|
+ this.$refs['ruleForm'].validate((valid) => {
|
|
|
if (valid) {
|
|
|
- delete this.ruleData.id
|
|
|
- this.ruleData.methodProtocol = 'http'
|
|
|
- this.ruleData.methodId = parseInt(this.$route.path.split('/')[3])
|
|
|
- createRule(this.ruleData).then(response => {
|
|
|
- console.log(this.ruleData)
|
|
|
- if (response.code === 200) {
|
|
|
- this.dialogFormVisible = false
|
|
|
- this.getList()
|
|
|
- this.$notify({
|
|
|
- title: 'Success',
|
|
|
- message: 'Created Successfully',
|
|
|
- type: 'success',
|
|
|
- duration: 2000
|
|
|
- })
|
|
|
- } else {
|
|
|
- this.$notify({
|
|
|
- title: 'Failed',
|
|
|
- message: 'Created Failed',
|
|
|
- type: 'error',
|
|
|
- duration: 2000
|
|
|
- })
|
|
|
+ // delete this.rules.id
|
|
|
+ console.log('xxx ' + JSON.stringify(this.ruleForm.metaRuleList))
|
|
|
+ if (this.ruleForm.metaRuleList[0].expression1 === 'any request') {
|
|
|
+ this.rules.whenScript = 'any request'
|
|
|
+ delete this.rules.metaRuleList
|
|
|
+ } else {
|
|
|
+ this.rules.metaRuleList = []
|
|
|
+ for (let i = 0, len = this.ruleForm.metaRuleList.length; i < len; i++) {
|
|
|
+ var r = this.ruleForm.metaRuleList[i]
|
|
|
+ var copiedRule = { 'judgeType': r.judgeType, 'judgeValue': r.judgeValue, 'operator': r.operator }
|
|
|
+ copiedRule.expression = r.expression1 + '.' + r.expression2
|
|
|
+ if (i === maxMin.min) {
|
|
|
+ copiedRule.operator = r.operator + '('
|
|
|
+ }
|
|
|
+ if (i === (maxMin.max + 1)) {
|
|
|
+ copiedRule.operator = ')' + r.operator
|
|
|
+ }
|
|
|
+ this.rules.metaRuleList.push(copiedRule)
|
|
|
}
|
|
|
- })
|
|
|
+ if (maxMin.max === (this.ruleForm.metaRuleList.length - 1)) {
|
|
|
+ this.rules.metaRuleList.push({ 'operator': ')' })
|
|
|
+ }
|
|
|
+ this.rules.methodProtocol = 'http'
|
|
|
+ this.rules.updator = this.userNames
|
|
|
+ this.rules.methodId = parseInt(this.$route.path.split('/')[3])
|
|
|
+ console.log('ruleForm.metaRuleList:' + JSON.stringify(this.ruleForm.metaRuleList))
|
|
|
+ console.log('rules.metaRuleList:' + JSON.stringify(this.rules.metaRuleList))
|
|
|
+ console.log('rules request:' + JSON.stringify(this.rules))
|
|
|
+ createRule(this.rules).then(response => {
|
|
|
+ if (response.code === 200) {
|
|
|
+ this.dialogFormVisible = false
|
|
|
+ this.getList()
|
|
|
+ this.$notify({
|
|
|
+ title: 'Success',
|
|
|
+ message: 'Created Successfully',
|
|
|
+ type: 'success',
|
|
|
+ duration: 2000
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$notify({
|
|
|
+ title: 'Failed',
|
|
|
+ message: 'Created Failed',
|
|
|
+ type: 'error',
|
|
|
+ duration: 2000
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
@@ -377,13 +721,37 @@ export default {
|
|
|
handleUpdate(row) {
|
|
|
var queryData = { id: row.id }
|
|
|
fetchRuleById(queryData).then(response => {
|
|
|
+ // debugger
|
|
|
var row_data = response.data.mockRuleList
|
|
|
- this.ruleData = Object.assign({}, row_data[0])
|
|
|
+ this.metaRule = row_data[0].metaRuleList
|
|
|
+ var i = 0
|
|
|
+ for (var a of this.metaRule) {
|
|
|
+ var sty = a.expression.split('.')
|
|
|
+ this.ruleForm.metaRuleList[i] = { 'operator': a.operator, 'expression1': sty[0], 'expression2': sty[1], 'judgeType': a.judgeType, 'judgeValue': a.judgeValue }
|
|
|
+ // if (a.operator === '||') {
|
|
|
+ // this.$refs.or[i].$el.style.color = '#FFFFFF'
|
|
|
+ // this.$refs.or[i].$el.style.background = '#409EFF'
|
|
|
+ // this.$refs.and[i].$el.style.color = '#606266'
|
|
|
+ // this.$refs.and[i].$el.style.background = '#FFFFFF'
|
|
|
+ // }
|
|
|
+ // if (a.operator === '&&') {
|
|
|
+ // this.$refs.and[i].$el.style.color = '#FFFFFF'
|
|
|
+ // this.$refs.and[i].$el.style.background = '#409EFF'
|
|
|
+ // this.$refs.or[i].$el.style.color = '#606266'
|
|
|
+ // this.$refs.or[i].$el.style.background = '#FFFFFF'
|
|
|
+ // }
|
|
|
+ i++
|
|
|
+ console.log(a.operator)
|
|
|
+ }
|
|
|
+ this.ruleForm.ruleDesc = Object.assign({}, row_data[0].ruleDesc)
|
|
|
+ this.ruleForm.execSort = Object.assign({}, row_data[0].execSort)
|
|
|
+ this.returnMessage = Object.assign({}, row_data[0].returnMessage)
|
|
|
+ this.whenScript = Object.assign({}, row_data[0].whenScript)
|
|
|
this.dialogStatus = 'update'
|
|
|
this.dialogFormVisible = true
|
|
|
this.showSubmit = true
|
|
|
this.$nextTick(() => {
|
|
|
- this.$refs['ruleDataForm'].clearValidate()
|
|
|
+ this.$refs['ruleForm'].clearValidate()
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
@@ -408,38 +776,51 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
handleCopy(row) {
|
|
|
- // this.ruleData = {
|
|
|
+ // this.rules = {
|
|
|
// // id: row.id,
|
|
|
// customName: row.customName,
|
|
|
// httpUrl: row.httpUrl,
|
|
|
// execSort: row.execSort,
|
|
|
+ // ruleDesc:row.ruleDesc,
|
|
|
+ // metaRuleList:row.metaRuleList,
|
|
|
// whenScript: row.whenScript,
|
|
|
// methodProtocol: row.methodProtocol,
|
|
|
// status: row.status,
|
|
|
// returnMessage: row.returnMessage
|
|
|
// }
|
|
|
- this.ruleData = Object.assign({}, row) // copy obj
|
|
|
- this.ruleData.timestamp = new Date(this.ruleData.timestamp)
|
|
|
+ // this.rules = Object.assign({}, row) // copy obj
|
|
|
+ console.log('rules:' + JSON.stringify(this.rules))
|
|
|
+ var row_data = row
|
|
|
+ this.metaRule = row_data[0].metaRuleList
|
|
|
+ var i = 0
|
|
|
+ for (var a of this.metaRule) {
|
|
|
+ var sty = a.expression.split('.')
|
|
|
+ this.ruleForm.metaRuleList[i] = { 'operator': a.operator, 'expression1': sty[0], 'expression2': sty[1], 'judgeType': a.judgeType, 'judgeValue': a.judgeValue }
|
|
|
+ i++
|
|
|
+ console.log(a.operator)
|
|
|
+ }
|
|
|
+ // this.rules.timestamp = new Date(this.rules.timestamp)
|
|
|
this.dialogStatus = 'create'
|
|
|
this.dialogFormVisible = true
|
|
|
this.showSubmit = true
|
|
|
this.$nextTick(() => {
|
|
|
- this.$refs['ruleDataForm'].clearValidate()
|
|
|
+ this.$refs['ruleForm'].clearValidate()
|
|
|
})
|
|
|
},
|
|
|
updateData() {
|
|
|
- this.$refs['ruleDataForm'].validate((valid) => {
|
|
|
+ this.$refs['ruleForm'].validate((valid) => {
|
|
|
if (valid) {
|
|
|
// const tempData = Object.assign({}, this.ruleData)
|
|
|
const tempData = {
|
|
|
- id: this.ruleData.id,
|
|
|
+ id: this.rules.id,
|
|
|
methodId: parseInt(this.$route.path.split('/')[3]),
|
|
|
updator: '',
|
|
|
- execSort: this.ruleData.execSort,
|
|
|
- whenScript: this.ruleData.whenScript,
|
|
|
- returnMessage: this.ruleData.returnMessage,
|
|
|
+ execSort: this.rules.execSort,
|
|
|
+ whenScript: this.rules.whenScript,
|
|
|
+ returnMessage: this.rules.returnMessage,
|
|
|
mehtodName: this.$route.query.methodName,
|
|
|
- methodProtocol: this.$route.query.methodProtocol
|
|
|
+ methodProtocol: this.$route.query.methodProtocol,
|
|
|
+ metaRuleList: []
|
|
|
}
|
|
|
updateRule(tempData).then(() => {
|
|
|
this.getList()
|
|
|
@@ -468,12 +849,12 @@ export default {
|
|
|
fetchRuleById(queryData).then(response => {
|
|
|
console.log('aaaaaaaaa' + response)
|
|
|
var row_data = response.data.mockRuleList
|
|
|
- this.ruleData = Object.assign({}, row_data[0])
|
|
|
+ this.rules = Object.assign({}, row_data[0])
|
|
|
this.dialogStatus = 'update'
|
|
|
this.dialogFormVisible = true
|
|
|
this.showSubmit = false
|
|
|
this.$nextTick(() => {
|
|
|
- this.$refs['ruleDataForm'].clearValidate()
|
|
|
+ this.$refs['ruleForm'].clearValidate()
|
|
|
})
|
|
|
})
|
|
|
}
|
|
|
@@ -481,10 +862,40 @@ export default {
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style>
|
|
|
+<style scoped>
|
|
|
.el-notification.right{
|
|
|
position: fixed;
|
|
|
- right: 38.5%;
|
|
|
+ right: 38.5%;}
|
|
|
+
|
|
|
+.continer div{
|
|
|
+display:none;/*默认隐藏*/
|
|
|
}
|
|
|
+.continer:hover div{
|
|
|
+display:initial;/*当鼠标hover时展示*/
|
|
|
+}
|
|
|
+
|
|
|
+.cardBackground{
|
|
|
+ background-color: #e3e4e54a;
|
|
|
+ border-top: 1px solid #ddd;
|
|
|
+ border-bottom: 1px solid #ddd;
|
|
|
+ }
|
|
|
+.red {
|
|
|
+ color: red;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .blue {
|
|
|
+ color: blue;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .liBackground {
|
|
|
+ background-color: #409EFF;
|
|
|
+}
|
|
|
+
|
|
|
+ .sty { color: 'red';background: '#FFFFFF'; }
|
|
|
+ .stys { color: '#FFFFFF'; background: 'red'; }
|
|
|
+/* .el-col {
|
|
|
+ white-space:nowrap;
|
|
|
+} */
|
|
|
+
|
|
|
</style>
|
|
|
|
qinzhipeng_v