删除自定义组件

src/api/form.js

@@ -185,6 +185,20 @@ export function saveMyFields(id,field_label,field_type,field_data,is_required){
     }
   })
 }
+/**
+ * 删除自定义字段
+ * @param id
+ * @returns {*}
+ */
+export  function  delMyFields(id){
+  return request({
+    url: '/api/form/my-fields',
+    method: 'delete',
+    data: {
+      id
+    }
+  })
+}
 
 /**
  * 获取自定义字段

src/views/components/packetList.vue

@@ -430,13 +430,14 @@ export default Vue.extend({
     grid-template-rows: auto 1fr auto;
     .tab-list{
       margin-top: 36px;
-      gap: 24px;
+      gap: 8px;
       display: flex;
+      flex-direction: column;
       align-items: center;
       justify-content: center;
       .hr{
-        width: 2px;
-        height: 60%;
+        width: 120px;
+        height: 2px;
         background-color: lightgray;
       }
     }

src/views/preRegManage/compEdit.vue

@@ -1,6 +1,6 @@
 <script lang="ts">
 import Vue from 'vue'
-import { getMyFields, saveMyFields } from '@/api/form'
+import { getMyFields, saveMyFields, delMyFields } from '@/api/form'
 import guide from '@/views/components/guidePopover.vue'
 import draggable from 'vuedraggable'
 import countryCode from '@/lib/countryCode.json'
@@ -45,6 +45,7 @@ export default Vue.extend({
       pcaTextArr,
       countryCode,
       copyShow: false,
+      delShow: false,
       loading: false
     }
   },
@@ -59,9 +60,7 @@ export default Vue.extend({
       if (this.loading) { return }
       this.loading = true
       getMyFields().then(res => {
-        if (this.compList.length === 0 && res.data.length > 0) {
-          this.currentData = res.data[0]
-        }
+        this.currentData = res.data[0]
         this.compList = res.data
         this.loading = false
       }).catch(err => {
@@ -109,10 +108,31 @@ export default Vue.extend({
     removeSelectItem(index) {
       this.currentData.field_data.options.splice(index, 1)
     },
+    deleteItem(currentData) {
+      if (this.loading) { return }
+      this.loading = true
+      this.delShow = false
+      delMyFields(currentData.id).then(res => {
+        this.loading = false
+        this.$notify({
+          title: '删除成功',
+          message: '组件已删除完成',
+          type: 'success'
+        })
+        this.getFields()
+      }).actch(err => {
+        this.loading = false
+        this.$notify({
+          title: '出错了',
+          message: err.message,
+          type: 'error'
+        })
+      })
+    },
     cloneItem(currentData) {
-      if(this.loading) { return }
+      if (this.loading) { return }
       this.loading = true
-      this.copyShow=false
+      this.copyShow = false
       saveMyFields('', currentData.field_label + '(副本)', currentData.field_type, currentData.field_data, currentData.is_required).then(res => {
         this.$notify({
           title: '复制成功',
@@ -352,6 +372,24 @@ export default Vue.extend({
     <div class="comp-edit">
       <div class="button">
         <el-popover
+          v-model="delShow"
+          placement="bottom"
+          trigger="click"
+          title="确定删除组件？"
+          popper-class="copy-popover"
+        >
+          <div class="body">
+            <div class="content">
+              点击确定将删除这个自定义组件。
+            </div>
+            <div class="button-list">
+              <el-button size="mini" @click="delShow=false">取消</el-button>
+              <el-button v-permission="'preReg.delComp'" type="danger" size="mini" @click="deleteItem(currentData)">确定删除</el-button>
+            </div>
+          </div>
+          <el-button slot="reference" type="danger" icon="el-icon-delete" circle />
+        </el-popover>
+        <el-popover
           v-model="copyShow"
           placement="bottom"
           trigger="click"
@@ -362,10 +400,10 @@ export default Vue.extend({
             <div class="content">
               点击确定将创建一个当前组件的副本。
             </div>
-             <div class="button-list">
-               <el-button @click="copyShow=false" size="mini">取消</el-button>
-               <el-button v-permission="'preReg.copyComp'" @click="cloneItem(currentData)" type="primary" size="mini">确定</el-button>
-             </div>
+            <div class="button-list">
+              <el-button size="mini" @click="copyShow=false">取消</el-button>
+              <el-button v-permission="'preReg.copyComp'" type="primary" size="mini" @click="cloneItem(currentData)">确定</el-button>
+            </div>
           </div>
           <el-button slot="reference" type="primary" icon="el-icon-document-copy" circle />
         </el-popover>
@@ -402,7 +440,7 @@ export default Vue.extend({
 
           <template>
             <div class="tips">是否必填</div>
-            <el-switch :active-value="1" :inactive-value="0" v-model="currentData.is_required" />
+            <el-switch v-model="currentData.is_required" :active-value="1" :inactive-value="0" />
           </template>
 
           <template v-if="['input','select','textarea','time','date','region','email','phone'].includes(currentData.field_type)">

src/views/setting/systemSetting.vue

@@ -80,7 +80,7 @@ export default Vue.extend({
             <div class="label">
               启用SSL
             </div>
-            <el-switch v-permission="'setting.system.sentEmailSSL'" v-model="mailSetting.is_ssl" />
+            <el-switch :active-value="1" :inactive-value="0" v-permission="'setting.system.sentEmailSSL'" v-model="mailSetting.is_ssl" />
           </div>
         </div>
       </div>