inleft
2022-02-17 6bcd135673be57b00ea68e58f1ae6aef2ac19e21
commit | author | age
b505f3 1 <template>
I 2     <div class="myModal">
3         <a-modal v-model="visible" title="日志添加" on-ok="handleOk"
4             :bodyStyle="{'overflow':'overlay','maxHeight': '550px'}">
5             <template slot="footer">
6                 <a-button key="reset" @click="reset" type="danger">
7                     擦掉重来
8                 </a-button>
9                 <a-button key="back" @click="handleCancel">
10                     歇会
11                 </a-button>
12                 <a-button key="submit" type="primary" :loading="loading" @click="handleOk">
13                     完事<span style="font-size: 10px;">儿</span>..
14                 </a-button>
15             </template>
16             <box10 ref="modalBox"></box10>
17         </a-modal>
18     </div>
19
20 </template>
21
22 <script>
23     import box10 from "../mini/box10-add.vue"
24     export default {
25         components: {
26             box10
27         },
28         data() {
29             return {
30                 visible: false,
31                 loading: false,
32             }
33         },
34         methods: {
35             getCalendarContainer(trigger) {
36                 return this.$refs.myModal;
37             },
38             showModal() {
39                 this.visible = true;
40             },
41             handleOk(e) {
42                 console.log(this.$refs.modalBox.form);
43                 var res = this.$refs.modalBox.$refs.myForm.validate(valid => {
44                     if (valid) {
45                         this.$message.info("校验通过")
46                     } else {
47                         this.$message.info("校验失败")
48                         return false;
49                     }
50                 });
51
52
53                 if (!res) return;
54
55                 this.$message.info("提交表单")
56
57                 this.loading = true;
58                 setTimeout(() => {
59                     this.visible = false;
60                     this.loading = false;
61                 }, 3000);
62             },
63             reset(e) {
64                 var res = this.$refs.modalBox.$refs.myForm.resetFields()
65             },
66             handleCancel(e) {
67                 this.visible = false;
68             },
69
70         },
71     }
72 </script>
73
74 <style>
75 </style>