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>
| <j-modal
| title="详细信息"
| :width="1200"
| :visible="visible"
| @ok="handleOk"
| @cancel="close"
| switch-fullscreen
| :fullscreen.sync="fullscreen"
| >
|
| <transition name="fade">
| <div v-if="visible">
| <slot name="mainForm" :row="row" :column="column"/>
| <slot name="subForm" :row="row" :column="column"/>
| </div>
| </transition>
|
| </j-modal>
| </template>
| <script>
|
| import { cloneObject } from '@/utils/util'
|
| export default {
| name: 'JVxeDetailsModal',
| inject: ['superTrigger'],
| data() {
| return {
| visible: false,
| fullscreen: false,
| row: null,
| column: null,
| }
| },
| created() {
| },
| methods: {
|
| open(event) {
| let {row, column} = event
| this.row = cloneObject(row)
| this.column = column
| this.visible = true
| },
|
| close() {
| this.visible = false
| },
|
| handleOk() {
| this.superTrigger('detailsConfirm', {
| row: this.row,
| column: this.column,
| callback: (success) => {
| this.visible = !success
| },
| })
| },
|
| },
| }
| </script>
| <style lang="less">
| .fade-enter-active,
| .fade-leave-active {
| opacity: 1;
| transition: opacity 0.5s;
| }
|
| .fade-enter,
| .fade-leave-to {
| opacity: 0;
| }
| </style>
|
|
