表单清除校验

src/components/cus/CusForm.vue

@@ -72,11 +72,27 @@ export default defineComponent({
     const handleEnter = () => {
       emit('handleEnter')
     }
+    const reset = () => {
+      const handleItem = (itemVue: any) => {
+        const _itemValue = itemVue?.__vueParentComponent?.parent
+        if (_itemValue?.type.name === "CusFormColumn") {
+          _itemValue.setupState.reset()
+        } else {
+          if (itemVue.childNodes && itemVue.childNodes.length > 0) {
+            itemVue.childNodes.forEach((v: any) => {
+              handleItem(v);
+            });
+          }
+        }
+      };
+      handleItem(ref_cusForm?.value?.$el);
+    }
     return {
       ...toRefs(state),
       ref_cusForm,
       submit,
-      handleEnter
+      handleEnter,
+      reset
     }
   },
 })

src/components/cus/CusFormColumn.vue

@@ -321,11 +321,15 @@ export default defineComponent({
       }
       find(ref_cusFormColumn?.value?.$el?.__vueParentComponent)
     }
+    const reset = () => {
+      state.errorMessage = null
+    }
     return {
       ...toRefs(state),
       handleValidate,
       handleEnter,
       ref_cusFormColumn,
+      reset
     }
   },
 })

src/style/cus.scss

@@ -159,6 +159,7 @@
       border-radius: $borderRadius;
       display: flex;
       flex-direction: column;
+      box-shadow: none;
       .el-dialog__header {
         padding: 0;
         margin: 0;
@@ -178,7 +179,6 @@
           padding: 0 20px 0 36px;
           box-sizing: border-box;
           position: relative;
-          box-shadow: 0px 1px 0px 0px rgba(18,78,74,0.15);
           &:before {
             position: absolute;
             content: '';
@@ -359,6 +359,7 @@
       border: none;
       border-radius: 10px;
       padding: 0;
+      box-shadow: none;
       .el-message-box__header {
         padding: 0;
         height: 40px;
@@ -366,7 +367,6 @@
         align-items: center;
         background: linear-gradient(90deg, rgba(2, 255, 241, 0.2) 0%, rgba(2, 255, 241, 0) 100%);
         position: relative;
-        box-shadow: 0px 1px 0px 0px rgba(18,78,74,0.15);
         padding: 0 20px 0 36px;
         .el-message-box__title {
           font-size: 16px;

src/views/system/notice-announcement/detail.vue

@@ -6,6 +6,7 @@
       @submit="onSubmit"
       submitText="确认发布"
       height="500px"
+      :closeConfirm="isViewCpt"
   >
     <div class="__normal-form">
       <CusForm labelWidth="100px" ref="ref_form">
@@ -70,7 +71,7 @@ export default defineComponent({
   components: {},
   props: {
     show: {},
-    transfer: {}
+    transfer: <any>{}
   },
   setup(props, {emit}) {
     const store = useStore();
@@ -86,14 +87,32 @@ export default defineComponent({
       }
     })
     watch(() => props.show, (n) => {
-
+      if (n) {
+        state.cusDetail = {
+          p1: null,
+          p2: null,
+          p3: null,
+          fileList: [],
+        }
+        if (props.transfer.method !== 'add') {
+          state.cusDetail.p1 = props.transfer.detail.p1
+        }
+        nextTick(() => {
+          ref_form.value.reset()
+        })
+      }
+    })
+    const ref_form = ref()
+    const isViewCpt = computed(() => {
+      return props.transfer.method !== 'view'
     })
     const onSubmit = () => {
-
     }
     return {
       ...toRefs(state),
-      onSubmit
+      onSubmit,
+      isViewCpt,
+      ref_form
     }
   },
 })

src/views/system/notice-announcement/index.vue

@@ -71,10 +71,10 @@
           >
             <template #do-column-value="{ scope }">
               <div class="__cus-table_do">
-                <div class="__cus-table_do-green __hover">
+                <div class="__cus-table_do-green __hover" @click="onView(scope.row)">
                   <SvgIcon name="add" size="16"/>查看
                 </div>
-                <div class="__cus-table_do-blue __hover">
+                <div class="__cus-table_do-blue __hover" @click="onEdit(scope.row)">
                   <SvgIcon name="edit" size="16"/>编辑
                 </div>
 <!--                <div class="__cus-table_do-green __hover">-->
@@ -196,7 +196,7 @@ export default defineComponent({
       // mock
       const arr = []
       for (let i = 0; i < 77; i++) {
-        arr.push({p1: '阿三顶顶顶顶顶顶顶顶顶顶顶顶顶'})
+        arr.push({p1: '阿三顶顶顶顶顶顶顶顶顶顶顶顶顶' + i})
       }
       state.queryResult.tableData = arr
       state.queryResult.total = arr.length
@@ -228,6 +228,20 @@ export default defineComponent({
       }
       state.showDetail = true
     }
+    const onEdit = (val) => {
+      state.transfer = {
+        method: 'edit',
+        detail: val
+      }
+      state.showDetail = true
+    }
+    const onView = (val) => {
+      state.transfer = {
+        method: 'view',
+        detail: val
+      }
+      state.showDetail = true
+    }
     onMounted(() => {
       state.back_queryForm = JSON.parse(JSON.stringify(state.queryForm))
       initDictionary()
@@ -241,7 +255,9 @@ export default defineComponent({
       handleSort,
       handleReset,
       onSearch,
-      onAdd
+      onAdd,
+      onEdit,
+      onView,
     }
   },
 })