后台管理添加和编辑的功能

demo
难点： 1.匹配条件 下的下拉框 需要是一个数据对象的形式
2.点击 添加一个匹配规则 上面的匹配条件 下的 一行再新增一条
3.确认编辑时需要传入id以及form里面的数据

 <!-- 添加编辑弹出框 -->
    <sec-dialog
      :title="title"
      :visible.sync="dialogAddVisible"
      width="40%"
      class="dialogB"
    >
      <sec-form
        ref="form"
        class="demoForm"
        :rules="rules"
        :model="form"
        label-width="120px"
        label-suffix=":"
      >
        <sec-form-item
          label="规则名称"
          prop="ruleName"
        >
          <sec-input
            v-model="form.ruleName"
            placeholder="请输入规则名称"
            style="width: 300px"
          ></sec-input>
        </sec-form-item>
        <sec-form-item
          label="规则描述"
          prop="ruleDescribe"
        >
          <sec-input
            v-model="form.ruleDescribe"
            placeholder="请输入规则描述"
            style="width: 300px"
          ></sec-input>
        </sec-form-item>
        <sec-form-item
          label="匹配条件"
          prop="description"
          :rules="{
   
            required: true, message: '请选择匹配条件', trigger: 'blur'
          }"
        >
          <div
            v-for="(e, index) in form.parameters"
            :key="index"
          >
            <sec-select
              v-model="e.matchTarget"
              placeholder="匹配目标"
              multiple
              value-key="parameterValue"
              @change="custInfoChange"
            >
              <sec-option
                v-for="item in urlList"
                :key="item.parameterValue"
                :label="item.parameterName"
                :value="item"
              >
              </sec-option>
            </sec-select>
            <sec-select
              v-model="e.operator"
              placeholder="匹配逻辑"
              value-key="parameterValue"
              style="margin-left:10px;width:150px;"
              @change="custChange"
            >
              <sec-option
                v-for="item in signList"
                :k