提交 | 用户 | age
|
bb2b08
|
1 |
<template> |
aeb317
|
2 |
<div v-if="isShow" class="mask" @click="hideDialog"> |
J |
3 |
<div class="xio_customer_select_dialog" @click.stop="noop"> |
6da3c1
|
4 |
<div class="title">是否选择客人[{{ dialogData.userName }}],使用当前房间?</div> |
bb2b08
|
5 |
<div class="content flex flex-sb"> |
6da3c1
|
6 |
<div v-if="dialogData.aDoctorName" class="tx flex-1" style="text-align: left;">医生:{{ dialogData.aDoctorName }}</div> |
J |
7 |
<div v-if="dialogData.aNurseName" class="tx flex-1">护士:{{ dialogData.aNurseName }}</div> |
|
8 |
<div v-if="dialogData.adviserName" class="tx flex-1" style="text-align: right;">顾问:{{ dialogData.adviserName }}</div> |
bb2b08
|
9 |
</div> |
J |
10 |
<div class="content flex flex-ver"> |
6da3c1
|
11 |
<div v-if="dialogData.projectName" class="tx">治疗项目:{{ dialogData.projectName }}</div> |
bb2b08
|
12 |
</div> |
J |
13 |
<div class="btn_box flex flex-center"> |
|
14 |
<div class="flex flex-ver"> |
aeb317
|
15 |
<div class="btn_box__item flex flex-center" @click="cancel">取消</div> |
J |
16 |
<div class="btn_box__item flex flex-center" @click="submit">确定</div> |
bb2b08
|
17 |
</div> |
J |
18 |
</div> |
|
19 |
</div> |
|
20 |
</div> |
|
21 |
</template> |
|
22 |
|
|
23 |
<script> |
|
24 |
export default { |
|
25 |
name: 'XioCustomerSelect', |
|
26 |
props: { |
|
27 |
isActive: { |
|
28 |
type: Boolean, |
|
29 |
default: false |
|
30 |
} |
|
31 |
}, |
|
32 |
data() { |
|
33 |
return { |
aeb317
|
34 |
isShow: false, |
J |
35 |
dialogData: {} |
bb2b08
|
36 |
} |
J |
37 |
}, |
|
38 |
methods: { |
aeb317
|
39 |
// 取消 |
J |
40 |
cancel() { |
|
41 |
this.$emit('cancel', {}) |
|
42 |
}, |
|
43 |
// 提交 |
|
44 |
submit() { |
6da3c1
|
45 |
this.$emit('submit', this.dialogData) |
aeb317
|
46 |
}, |
J |
47 |
noop() { |
|
48 |
return |
|
49 |
}, |
|
50 |
// 显示弹窗 |
|
51 |
showDialog() { |
|
52 |
this.isShow = true |
|
53 |
}, |
|
54 |
// 关闭弹窗 |
|
55 |
hideDialog() { |
|
56 |
this.isShow = false |
|
57 |
this.dialogData = {} |
|
58 |
}, |
|
59 |
// 数据初始化 |
|
60 |
dataInit(data) { |
|
61 |
this.dialogData = data |
bb2b08
|
62 |
} |
J |
63 |
} |
|
64 |
} |
|
65 |
</script> |
|
66 |
|
|
67 |
<style scoped> |
|
68 |
.xio_customer_select_dialog { |
|
69 |
position: absolute; |
|
70 |
width: 1105px; |
|
71 |
min-height: 602px; |
|
72 |
top: 50%; |
|
73 |
left: 50%; |
|
74 |
transform: translate(-50%, -50%); |
|
75 |
-webkit-transform: translate(-50%, -50%); |
|
76 |
z-index: 1; |
|
77 |
border-radius: 10px; |
|
78 |
background-color: rgba(255,255,255,1); |
|
79 |
box-sizing: border-box; |
|
80 |
padding: 90px 90px 78px 90px; |
|
81 |
} |
|
82 |
.xio_customer_select_dialog .title { |
|
83 |
line-height: 70px; |
|
84 |
color: rgba(16,16,16,1); |
|
85 |
font-size: 50px; |
|
86 |
font-family: PingFangSC-medium; |
|
87 |
font-weight: bold; |
|
88 |
} |
|
89 |
|
|
90 |
.xio_customer_select_dialog .content { |
|
91 |
margin-top: 25px; |
|
92 |
} |
|
93 |
|
|
94 |
.xio_customer_select_dialog .content .tx { |
|
95 |
line-height: 53px; |
|
96 |
color: rgba(108,108,108,1); |
|
97 |
font-size: 38px; |
|
98 |
text-align: center; |
|
99 |
font-family: PingFangSC-regular; |
|
100 |
box-sizing: border-box; |
|
101 |
} |
|
102 |
.xio_customer_select_dialog .content .tx:nth-child(2) { |
|
103 |
padding: 0 10px; |
|
104 |
} |
|
105 |
|
|
106 |
.xio_customer_select_dialog .btn_box { |
|
107 |
margin-top: 107px; |
|
108 |
} |
|
109 |
|
|
110 |
.xio_customer_select_dialog .btn_box__item { |
|
111 |
width: 300px; |
|
112 |
height: 100px; |
|
113 |
line-height: 52px; |
|
114 |
border-radius: 4px; |
|
115 |
font-size: 36px; |
|
116 |
text-align: center; |
|
117 |
font-family: Microsoft Yahei; |
|
118 |
} |
|
119 |
.xio_customer_select_dialog .btn_box__item:nth-child(1) { |
|
120 |
color: rgba(34,123,235,1); |
|
121 |
border: 1px solid rgba(34,123,235,1); |
|
122 |
} |
|
123 |
.xio_customer_select_dialog .btn_box__item:nth-child(2) { |
|
124 |
color: rgba(255,255,255,1); |
|
125 |
background-color: rgba(34,123,235,1); |
|
126 |
margin-left: 87px; |
|
127 |
} |
|
128 |
</style> |