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