移除

src/views/accumulatePoints/accumulatePointsRules/accumulatePointsRulesConfig.vue

@@ -5,17 +5,31 @@
         <el-tag>{{ itemData.ruleCategory }}</el-tag>
       </template>
       <template #config>
-        <m-card
-          v-for="(item) in items"
+        <div
+          v-for="(item, index) in items"
           :key="item.key"
-          shadow="never"
-          class="mb-3"
-        >
-          <AccumulatePointsRulesConfigItem
-            ref="accumulatePointsRulesConfigItemRefs"
-            :value="item"
-          ></AccumulatePointsRulesConfigItem>
-        </m-card>
+          >
+          <div class="d-flex justify-end" style="position: relative;" v-if="items.length > 1">
+            <m-button
+              style="position: absolute; top: -16px; right: 10px"
+              type="danger"
+              icon="el-icon-delete"
+              size="small"
+              circle
+              @click="onRemoveItem(index)"
+            ></m-button>
+          </div>
+          <m-card
+            shadow="never"
+            class="mb-3"
+            style="overflow: auto;"
+          >
+            <AccumulatePointsRulesConfigItem
+              ref="accumulatePointsRulesConfigItemRefs"
+              :value="item"
+            ></AccumulatePointsRulesConfigItem>
+          </m-card>
+        </div>
         <div class="text-center">
           <m-button icon="el-icon-plus" size="small" type="orange" @click="onAddItem">新增一条规则项</m-button>
         </div>
@@ -99,6 +113,9 @@ export default {
         maxScore: 999
       })
     },
+    onRemoveItem (index) {
+      this.items.splice(index, 1)
+    },
     async onSure () {
       if (!this.$refs.accumulatePointsRulesConfigItemRefs) {
         this.$message.error('请先配置规则项')