规则引擎新增

src/views/mock/httprule.vue

@@ -2,13 +2,11 @@
   <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.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="状态">
-          <el-option v-for="item in ruleStatus" :key="item.key" :label="item.display_name" :value="item.key" />
+        <el-input v-model="listQuery.ruleDesc" placeholder="名称" style="width:130px;margin:0 -1.5px;" class="filter-item" @keyup.enter.native="handleFilter" />&nbsp;&nbsp;
+        <el-input v-model="listQuery.execSort" placeholder="优先级" style="width:130px;margin:0 -1.5px;" class="filter-item" @keyup.enter.native="handleFilter" />&nbsp;&nbsp;
+        <el-select v-model="listQuery.status" class="filter-item" filterable clearable placeholder="状态" style="width:130px;margin:0 -1.5px;">
+          <el-option v-for="item1 in ruleStatus" :key="item1.key" :label="item1.display_name" :value="item1.key" />
         </el-select>
-        <!-- <el-input v-model="listQuery.interfaceName" placeholder="接口类" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" /> -->
         <el-button v-waves class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
           搜索
         </el-button>
@@ -57,9 +55,9 @@
       //<!-- <el-tag>{{ row.type | typeFilter }}</el-tag> -->
       <!-- </template>
       </el-table-column> -->
-      <el-table-column label="优先级" min-width="110px" align="center">
+      <el-table-column label="规则描述" min-width="110px" align="center">
         <template slot-scope="scope">
-          <span>{{ scope.row.execSort }}</span>
+          <span>{{ scope.row.ruleDesc }}</span>
         </template>
       </el-table-column>
       <el-table-column label="http请求URL" min-width="110px" align="center">
@@ -91,13 +89,13 @@
       </el-table-column>
       <el-table-column label="操作" align="center" min-width="370" class-name="small-padding fixed-width" fixed="right">
         <template slot-scope="{row}">
-          <el-button type="primary" size="mini" @click="handleCheck(row)">
+          <el-button type="primary" size="mini" @click="handleUpdate(row,'check')">
             查看
           </el-button>
-          <el-button type="primary" size="mini" @click="handleUpdate(row)">
+          <el-button type="primary" size="mini" @click="handleUpdate(row,'update')">
             编辑
           </el-button>
-          <el-button type="primary" size="mini" @click="handleCopy(row)">
+          <el-button type="primary" size="mini" @click="handleUpdate(row,'copy')">
             复制
           </el-button>
           <el-button type="primary" size="mini">
@@ -115,15 +113,22 @@
     <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="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>             -->
+      <el-form ref="ruleForm" :rules="rule" :model="ruleForm" label-width="150px" style="width: 830px;">
         <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>
+            <el-form-item
+              v-if="isAnyRequest === true"
+              label="规则"
+              prop="whenScript"
+              :rules="{required: false, message: '请选择规则表达式', trigger: 'blur'}"
+>
+              <el-select v-model="rules.whenScript" clearable placeholder="请选择规则表达式" style="width:130px;margin: 0 1% -2.5 5.5px;" fiterable @change="chooseTest">
+                <el-option v-for="item in getExpressOpt(0)" :key="item.desc" :label="item.descChn" :value="item.desc" />
+              </el-select>
+            </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>
@@ -133,6 +138,7 @@
                         <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> -->
@@ -143,46 +149,48 @@
                 <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 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="itemData.prior" v-show="isNotAnyRequest" >规则{{index+1}}</el-checkbox>  -->
+                      <!-- <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> -->
-                  <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>
+                  <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-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>
 
                 </el-row>
               </el-form-item>
@@ -190,10 +198,6 @@
 
           </tr>
         </table>
-
-        <br>
-        <br>
-        <br>
         <el-form-item label="优先级" prop="execSort">
           <el-input-number v-model="rules.execSort" label="优先级" :min="1" :max="100" title="值越大，优先级越高" />
         </el-form-item>
@@ -209,7 +213,7 @@
         <el-button @click="dialogFormVisible = false">
           取消
         </el-button>
-        <el-button v-if="showSubmit" type="primary" @click="dialogStatus==='create'?createData():updateData()">
+        <el-button v-if="showSubmit" type="primary" @click="dialogStatus==='update'?updateData() : createData()">
           确定
         </el-button>
 
@@ -258,7 +262,7 @@ export default {
     return {
       Id: '',
       num: 0,
-      itemData: {},
+      item: {},
       activeColor: '#000',
       back: '#FFFFFF',
       backColor: '#FFFFFF',
@@ -267,13 +271,14 @@ export default {
       // orButton:"",
       firstIndex: 1,
       isshow: true,
-      isAnyshow: false,
+      // isAnyshow: false,
       isNotAnyRequest: true,
       btnRequest: true,
       expression: '',
       expression1: '',
       expression2: '',
       btnReception: {},
+      isAnyRequest: false,
       chooseIndex: 'reset',
       userNames: localStorage.getItem('realname'),
       styleObj: {
@@ -284,22 +289,21 @@ export default {
         'background': '#409EFF'
       },
       ruleForm: {
-      // metaRuleList:[{ operator:'', expression:'',  judgeType:'',  judgeValue:''},{},{}]
         maxPrior: -1,
         minPrior: 100,
         execSort: '',
         ruleDesc: '',
-        metaRuleList: [{ operator: '', expression1: '', expression2: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }]
+        metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }]
       },
+      metaRuleListCache: [],
       rules: {
         execSort: '',
-        ruleDesc: '',
-        // metaRuleList:[{ operator:'', expression:'',  judgeType:'',  judgeValue:''},{},{}]
-        metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '' }]
+        ruleDesc: ''
+        // metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '' }]
       },
 
       evaluators: [],
-      rulesCheck: {
+      rule: {
         expression1: [
           { required: true, message: '请输入方法', trigger: 'blur' }
         ],
@@ -337,11 +341,10 @@ export default {
       // operatorOption: [{ name: '等于', value: "=" }, { name: '大于', value: ">" }, { name: '小于', value: "<" }, { name: '不等于', value: "!=" }],
       operatorOptions: [],
       expressOptions: [],
-      expressOptionWithutAny: [],
+      expressOptionWithoutAny: [],
       // 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,
@@ -359,7 +362,9 @@ export default {
       dialogStatus: '',
       textMap: {
         update: '编辑',
-        create: '新增规则'
+        create: '新增规则',
+        check: '查看',
+        copy: '复制'
       },
       dialogPvVisible: false,
       pvData: [],
@@ -393,7 +398,7 @@ export default {
       if (index === 0) {
         return this.expressOptions
       } else {
-        return this.expressOptionWithutAny
+        return this.expressOptionWithoutAny
       }
     },
     // 优先计算
@@ -431,7 +436,19 @@ export default {
       this.$refs.and[index].$el.style.background = '#FFFFFF'
       this.ruleForm.metaRuleList[index].operator = '||'
     },
-
+    updateStyle() {
+      // i从1开始，因为第一个不显示
+      for (let i = 1, len = this.ruleForm.metaRuleList.length; i < len; i++) {
+        // 操作符颜色
+        if (this.ruleForm.metaRuleList[i].operator === '||') {
+          this.changeOr(i)
+        } else {
+          this.changeAnd(i)
+        }
+        // 优先级背景
+        this.priorChanged(i)
+      }
+    },
     addList(index) {
       // this.num===index
       if (this.ruleForm.metaRuleList.length >= 10) {
@@ -446,14 +463,29 @@ export default {
       console.log(this.num)
       console.log(index)
     },
+    chooseTest(val) {
+      console.log('chooseTest:' + val)
+      this.isNotAnyRequest = true
+      this.isAnyRequest = 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 request') {
+      if (this.ruleForm.metaRuleList[0].expression1 === 'any') {
+        this.rules.whenScript = 'any'
+        this.isAnyRequest = true
         this.isNotAnyRequest = false
-        this.isAnyshow = true
+        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 })
       }
@@ -480,10 +512,10 @@ export default {
       getExpress().then(response => {
         this.expressOptions = response.data
         this.expressOptions.forEach((opt, index) => {
-          if (opt.desc === 'any request') {
+          if (opt.desc === 'any') {
             return true
           }
-          this.expressOptionWithutAny.push(opt)
+          this.expressOptionWithoutAny.push(opt)
         })
       })
     },
@@ -526,28 +558,6 @@ export default {
       }
       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)
     },
@@ -648,6 +658,14 @@ export default {
         curIndex: 1,
         pageSize: 20
       }
+      this.ruleForm = {
+        maxPrior: -1,
+        minPrior: 100,
+        execSort: '',
+        ruleDesc: '',
+        metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }]
+      }
+      this.metaRuleListCache = []
     },
     handleCreate() {
       this.resetServiceData()
@@ -658,100 +676,118 @@ export default {
         this.$refs['ruleForm'].clearValidate()
       })
     },
-    createData(vel) {
-      const shouldJson = this.rules.returnMessage
-      console.log('dasdsadsad' + typeof (shouldJson))
+    copyAndDecorateMetaRuleFromRuleForm() {
       var maxMin = this.findMaxMinOfMetaList()
-      console.log('maxMin ' + JSON.stringify(maxMin))
+      var copiedMetaRuleList = []
+      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
+        }
+        copiedMetaRuleList.push(copiedRule)
+      }
+      if (maxMin.max === (this.ruleForm.metaRuleList.length - 1)) {
+        copiedMetaRuleList.push({ 'operator': ')' })
+      }
+      return copiedMetaRuleList
+    },
+    createOrUpdate(createFlag, remoteFunc) {
+      const shouldJson = this.rules.returnMessage
       if (typeof shouldJson === 'string') {
         this.$refs['ruleForm'].validate((valid) => {
           if (valid) {
             // 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'
+            // 任意请求
+            if (this.rules.whenScript === 'any') {
               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
-                  })
-                }
-              })
+              // 正常请求
+              this.rules.metaRuleList = this.copyAndDecorateMetaRuleFromRuleForm()
             }
+            this.rules.methodId = parseInt(this.$route.path.split('/')[3])
+            this.rules.methodProtocol = 'http'
+            this.rules.updator = this.userNames
+            remoteFunc(this.rules)
           }
-        })
+        }
+        )
       }
     },
-    handleUpdate(row) {
-      var queryData = { id: row.id }
-      fetchRuleById(queryData).then(response => {
-        // debugger
-        var row_data = response.data.mockRuleList
-        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)
+    createData(vel) {
+      this.createOrUpdate('create', (data) => {
+        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
+            })
+          }
+        })
+      })
+    },
+    handleUpdate(row, status) {
+      fetchRuleById({ id: row.id }).then(response => {
+        if (response.code !== 200) {
+          this.$message({
+            message: row.id.toString() + ' 操作失败！',
+            type: 'danger'
+          })
+          return
         }
-        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.resetServiceData()
+        this.dialogStatus = status
+        this.showSubmit = status !== 'check'
         this.dialogFormVisible = true
-        this.showSubmit = true
+        var row_data = response.data.mockRuleList
+        var m = row_data[0].metaRuleList
+        this.ruleForm.metaRuleList = []
+        for (let i = 0, len = m.length; i < len; i++) {
+          // 括号在最后时特殊处理
+          var metaRule = m[i]
+          if (metaRule.operator === ')') {
+            this.ruleForm.metaRuleList[i - 1].prior = true
+            continue
+          }
+          // 优先级处理
+          var prior = false
+          if (metaRule.operator.indexOf('(') !== -1) {
+            prior = true
+          }
+          if (metaRule.operator.indexOf(')') !== -1) {
+            this.ruleForm.metaRuleList[i - 1].prior = true
+          }
+          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') {
+          delete this.rules.id
+        }
+
+        // 校验个样式更新清理
         this.$nextTick(() => {
           this.$refs['ruleForm'].clearValidate()
+          // 更新优先级和操作符的样式
+          this.updateStyle()
         })
       })
     },
@@ -775,64 +811,18 @@ export default {
         }
       })
     },
-    handleCopy(row) {
-      // 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.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['ruleForm'].clearValidate()
-      })
-    },
     updateData() {
-      this.$refs['ruleForm'].validate((valid) => {
-        if (valid) {
-        //   const tempData = Object.assign({}, this.ruleData)
-          const tempData = {
-            id: this.rules.id,
-            methodId: parseInt(this.$route.path.split('/')[3]),
-            updator: '',
-            execSort: this.rules.execSort,
-            whenScript: this.rules.whenScript,
-            returnMessage: this.rules.returnMessage,
-            mehtodName: this.$route.query.methodName,
-            methodProtocol: this.$route.query.methodProtocol,
-            metaRuleList: []
-          }
-          updateRule(tempData).then(() => {
-            this.getList()
-            this.dialogFormVisible = false
-            this.$notify({
-              title: 'Success',
-              message: 'Update Successfully',
-              type: 'success',
-              duration: 2000
-            })
+      this.createOrUpdate('update', (data) => {
+        updateRule(data).then(() => {
+          this.getList()
+          this.dialogFormVisible = false
+          this.$notify({
+            title: 'Success',
+            message: 'Update Successfully',
+            type: 'success',
+            duration: 2000
           })
-        }
+        })
       })
     },
     formatJson(filterVal, jsonData) {
@@ -843,20 +833,6 @@ export default {
           return v[j]
         }
       }))
-    },
-    handleCheck(row) {
-      var queryData = { id: row.id }
-      fetchRuleById(queryData).then(response => {
-        console.log('aaaaaaaaa' + response)
-        var row_data = response.data.mockRuleList
-        this.rules = Object.assign({}, row_data[0])
-        this.dialogStatus = 'update'
-        this.dialogFormVisible = true
-        this.showSubmit = false
-        this.$nextTick(() => {
-          this.$refs['ruleForm'].clearValidate()
-        })
-      })
     }
   }
 }
@@ -898,4 +874,3 @@ display:initial;/*当鼠标hover时展示*/
 } */
 
 </style>
-