http规则引擎bug修复

src/views/mock/httprule.vue

@@ -136,63 +136,61 @@
                     <el-divider>
                       <el-button-group>
                         <el-button ref="and" :style="styleBtn" circle plain size="mini" @click="changeAnd(index)">{{ and }}</el-button>
+                        <!-- <el-button ref="and" :class="{ styleBtn : true }" 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 class="item" visible-arrow="false" effect="light" content="连续勾选可以优先计算" placement="left-start">
-                        <el-checkbox v-if="isNotAnyRequest === true" ref="priorCheck" v-model="item.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="item.prior" v-if="isNotAnyRequest === true" >规则{{index+1}}</el-checkbox>  -->
-                    </el-form-item>
-                  </el-col>
-                  <!-- <div v-show="isAnyShow==true">规则</div> -->
-                  <div v-if="isNotAnyRequest === true" style="margin:0 22px;">
-                    <el-col :span="5">
-                      <el-form-item
-                        style="color:red; white-space:nowrap;"
-                        :prop="'metaRuleList.' + index + '.expression1'"
-                        :rules="{required: true, message: '请选择规则表达式', trigger: 'blur'}"
-                      >
-                        <el-select v-if="isNotAnyRequest" v-model="item.expression1" clearable placeholder="请选择表达式" style="width:130px;margin: 0 1% 1% -15.8%;" fiterable size="medium" @change="chooseTest1">
-                          <el-option v-for="item in getExpressOpt(index)" :key="item.desc" :label="item.descChn" :value="item.desc" />
-                        </el-select>
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="5">
-                      <el-form-item :prop="'metaRuleList.' + index + '.expression2'" :rules="{required: true, message: '请输入参数', trigger: 'blur'}">
-                        <el-input v-model="item.expression2" clearable placeholder="请输入参数" style="width:130px;margin:0 -10.5px;" filterable size="medium" @change="chooseTest2" />
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="5">
-                      <el-form-item :prop="'metaRuleList.' + index + '.judgeType'" :rules="{required: true, message: '请选择运算方式', trigger: 'blur'}">
-                        <el-select v-model="item.judgeType" clearable placeholder="请选择运算方式" style="width:130px;margin:0 -1.5px;" filterable size="medium" @change="chooseTest3">
-                          <el-option v-for="item in operatorOptions" :key="item.character" :label="item.desc" :value="item.character" />
-                        </el-select>
+                  <el-row ref="priorBackgroup" class="set-font" :gutter="2" style="width: 140%;white-space:nowrap;">
+                    <el-col :span="3">
+                      <el-form-item>
+                        <el-tooltip class="item" visible-arrow="false" effect="light" content="连续勾选可以优先计算" placement="left-start">
+                          <el-checkbox v-if="isNotAnyRequest" ref="priorCheck" v-model="item.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="item.prior" v-if="isNotAnyRequest === true" >规则{{index+1}}</el-checkbox>  -->
                       </el-form-item>
                     </el-col>
-                    <el-col :span="5">
-                      <el-form-item
-                        :prop="'metaRuleList.' + index + '.judgeValue'"
-                        :rules="{required: true, message: '请输入值', trigger: 'blur'}"
-                      >
-                        <el-input v-model="item.judgeValue" clearable placeholder="请输入值" style="width:130px;margin:0 6.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>
-                  </div>
+                    <!-- <div v-show="isAnyShow==true">规则</div> -->
+                    <div v-if="isNotAnyRequest" style="margin:0 22px;">
+                      <el-col :span="5">
+                        <el-form-item
+
+                          style="color:red; white-space:nowrap;"
+                          :prop="'metaRuleList.' + index + '.expression1'"
+                          :rules="{required: true, message: '请选择规则表达式', trigger: 'blur'}"
+                        >
+                          <el-select v-if="isNotAnyRequest" :disabled="check" v-model="item.expression1" clearable placeholder="请选择表达式" style="width:130px;margin: 0 1% 1% -15.8%;" fiterable size="medium" @change="chooseTest1">
+                            <el-option v-for="item in getExpressOpt(index)" :key="item.desc" :label="item.descChn" :value="item.desc" />
+                          </el-select>
+                        </el-form-item>
+                      </el-col>
+                      <el-col :span="5">
+                        <el-form-item :prop="'metaRuleList.' + index + '.expression2'" :rules="{required: true, message: '请输入参数', trigger: 'blur'}">
+                          <el-input v-model="item.expression2" :disabled="check" clearable placeholder="请输入参数" style="width:130px;margin:0 -10.5px;" filterable size="medium" />
+                        </el-form-item>
+                      </el-col>
+                      <el-col :span="5">
+                        <el-form-item :prop="'metaRuleList.' + index + '.judgeType'" :rules="{required: true, message: '请选择运算方式', trigger: 'blur'}">
+                          <el-select v-model="item.judgeType" :disabled="check" clearable placeholder="请选择运算方式" style="width:130px;margin:0 -1.5px;" filterable size="medium">
+                            <el-option v-for="item in operatorOptions" :key="item.character" :label="item.desc" :value="item.character" />
+                          </el-select>
+                        </el-form-item>
+                      </el-col>
+                      <el-col :span="5">
+                        <el-form-item
+                          :prop="'metaRuleList.' + index + '.judgeValue'"
+                          :rules="{required: true, message: '请输入值', trigger: 'blur'}"
+                        >
+                          <el-input v-model="item.judgeValue" :disabled="check" clearable placeholder="请输入值" style="width:130px;margin:0 6.5px;" filterable size="medium" />
+                          <el-button v-if="(index == 0 && ruleForm.metaRuleList.length == 1) ? false : isNotAnyRequest" icon="el-icon-minus" type="danger" size="mini" circle @click="delList(index)" />
+                          <el-button v-if="index == ruleForm.metaRuleList.length - 1 && isNotAnyRequest==true" icon="el-icon-plus" type="success" size="mini" circle @click="addList()" />
+                        </el-form-item>
+                      </el-col>
+                    </div>
+
+                  </el-row>
+                </template>
 
-                </el-row>
               </el-form-item>
             </div>
 
@@ -210,7 +208,7 @@
       <el-form label-width="150px" style="width: 880px;" />
 
       <div slot="footer" class="dialog-footer">
-        <el-button @click="dialogFormVisible = false">
+        <el-button @click="clear(), dialogFormVisible = false">
           取消
         </el-button>
         <el-button v-if="showSubmit" type="primary" @click="dialogStatus==='update'?updateData() : createData()">
@@ -271,6 +269,7 @@ export default {
       // orButton:"",
       firstIndex: 1,
       isshow: true,
+      check: false,
       // isAnyshow: false,
       isNotAnyRequest: true,
       btnRequest: true,
@@ -295,7 +294,7 @@ export default {
         ruleDesc: '',
         metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }]
       },
-      metaRuleListCache: [],
+      metaRuleListCache: [{ operator: '', expression: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }],
       rules: {
         execSort: '',
         ruleDesc: ''
@@ -347,15 +346,6 @@ export default {
       showReviewer: false,
       showRules: false,
       ruleData: {
-        // methodId: 0,
-        // updator: '',
-        // methodName: '',
-        // execSort: 1,
-        // whenScript: '',
-        // returnMessage: '',
-        // curIndex: 1,
-        // pageSize: 20,
-        // methodProtocol: 'http'
       },
 
       dialogFormVisible: false,
@@ -437,7 +427,8 @@ export default {
       this.ruleForm.metaRuleList[index].operator = '||'
     },
     updateStyle() {
-      // i从1开始，因为第一个不显示
+      this.priorChanged(0)
+      // i从1开始，因为第一个不显示并且/或者按钮
       for (let i = 1, len = this.ruleForm.metaRuleList.length; i < len; i++) {
         // 操作符颜色
         if (this.ruleForm.metaRuleList[i].operator === '||') {
@@ -447,6 +438,7 @@ export default {
         }
         // 优先级背景
         this.priorChanged(i)
+        console.log(this.$refs)
       }
     },
     addList(index) {
@@ -463,44 +455,28 @@ export default {
       console.log(this.num)
       console.log(index)
     },
+    anyRequestChange(status) {
+      this.isAnyRequest = status
+      this.isNotAnyRequest = !this.isAnyRequest
+    },
     chooseTest(val) {
-      console.log('chooseTest:' + val)
-      this.isNotAnyRequest = true
-      this.isAnyRequest = false
+      this.anyRequestChange(false)
       this.ruleForm.metaRuleList = this.metaRuleListCache
       this.ruleForm.metaRuleList[0].expression1 = val
-      // this.ruleForm.metaRuleList.push({'expression1': val })
       delete this.rules.whenScript
-      // this.paramOptions.push(0,0,{ name: 'any', value: 0 })
     },
     chooseTest1(val) {
       this.expression1 = val
       console.log(val)
       if (this.ruleForm.metaRuleList[0].expression1 === 'any') {
+        this.anyRequestChange(true)
         this.rules.whenScript = 'any'
-        this.isAnyRequest = true
-        this.isNotAnyRequest = false
         this.metaRuleListCache = this.ruleForm.metaRuleList
         this.ruleForm.metaRuleList = []
-        // this.isAnyshow = true
       } else {
-        this.isNotAnyRequest = true
-        this.isAnyRequest = false
-
-        // this.paramOptions.push(0,0,{ name: 'any', value: 0 })
+        this.anyRequestChange(false)
       }
     },
-
-    chooseTest2(val) {
-      this.expression2 = val
-    },
-    chooseTest3(val) {
-      this.ruleForm.metaRuleList.judgeType = val
-    },
-    chooseTest4(val) {
-      this.ruleForm.metaRuleList.judgeValue = val
-    },
-
     // 获取运算符
     getHttpOp() {
       getHttpOp().then(response => {
@@ -543,6 +519,11 @@ export default {
         this.$refs.priorBackgroup[index].$el.style.background = '#FFFFFF'
       }
     },
+
+    clear(row, status) {
+    },
+
+
     findMaxMinOfMetaList() {
       var maxMin = {
         max: -1,
@@ -665,7 +646,7 @@ export default {
         ruleDesc: '',
         metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }]
       }
-      this.metaRuleListCache = []
+      this.metaRuleListCache = [{ operator: '', expression: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }]
     },
     handleCreate() {
       this.resetServiceData()
@@ -742,6 +723,12 @@ export default {
       })
     },
     handleUpdate(row, status) {
+      if (status === 'check') {
+        this.check = true 
+}else {
+        this.check = false
+      }
+      console.log(status + this.check)
       fetchRuleById({ id: row.id }).then(response => {
         if (response.code !== 200) {
           this.$message({
@@ -774,15 +761,23 @@ export default {
           }
           metaRule.operator = metaRule.operator.replace(/\(|\)/, '')
           // 分割表达式
+
           var exp = metaRule.expression.split('.')
           this.ruleForm.metaRuleList.push({ 'prior': prior, 'operator': metaRule.operator, 'expression1': exp[0], 'expression2': exp[1], 'judgeType': metaRule.judgeType, 'judgeValue': metaRule.judgeValue })
           console.log(this.ruleForm.metaRuleList[i])
         }
         this.rules = Object.assign({}, row_data[0])
         if (status === 'copy') {
+          this.rules.ruleDesc = this.rules.ruleDesc + '_Copy'
           delete this.rules.id
         }
 
+        if (this.rules.whenScript === 'any') {
+          this.isAnyRequest = true
+          this.isNotAnyRequest = !this.isAnyRequest
+        }
+        console.log('this.rules after fetch : ' + JSON.stringify(this.rules))
+
         // 校验个样式更新清理
         this.$nextTick(() => {
           this.$refs['ruleForm'].clearValidate()
@@ -800,12 +795,12 @@ export default {
         if (response.code === 200) {
           row.status = status
           this.$message({
-            message: row.id.toString() + ' 操作成功！',
+            message: '规则ID:' + row.id.toString() + ' 操作成功！',
             type: 'success'
           })
         } else {
           this.$message({
-            message: row.id.toString() + ' 操作失败！',
+            message: '规则ID:' + row.id.toString() + ' 操作失败！',
             type: 'danger'
           })
         }
@@ -874,3 +869,11 @@ display:initial;/*当鼠标hover时展示*/
 } */
 
 </style>
+<style lang="stylus" scoped>
+    .set-font >>> .el-input__inner
+      color #3e3c3c
+    // .set-font >>>  .is-disabled input::placeholder
+    //   color #3e3c3c
+    .set-font >>> .is-disabled input
+      color #3e3c3c
+</style>