jazz
2024-01-09 f6ea728ea50706b1dfa75bc0d266fb6b5f13ef7f
提交 | 用户 | age
1fa546 1 <template>
J 2   <div v-if="isShow" class="mask" @click="hideDialog">
3     <div class="xio_room_status_chg_dialog" @click.stop="noop">
583e10 4       <div class="title">MIC通知{{ info.appellationName }}卸麻!</div>
1fa546 5       <div class="btn_box flex flex-center">
J 6         <div class="btn_box_item flex flex-center" @click="confirm">
7           <div class="flex flex-ver">
8             <div class="tx">我已知晓</div>
9           </div>
10         </div>
11       </div>
12     </div>
13   </div>
14 </template>
15
16 <script>
17 export default {
c1e103 18   name: 'XioRoomOffNarcosisNotice',
1fa546 19   props: {
J 20     isActive: {
21       type: Boolean,
22       default: false
23     }
24   },
25   data() {
26     return {
583e10 27       isShow: false,
J 28       info: {}
1fa546 29     }
J 30   },
31   methods: {
32     noop() {
33       return
34     },
35     // 确认
36     confirm() {
37       this.isShow = false
38       this.$emit('confirm', { })
39     },
40     // 显示弹窗
41     showDialog() {
42       this.isShow = true
43     },
583e10 44     // 数据处理
J 45     dataInit(data) {
46       this.info = { ...data }
47     },
1fa546 48     // 关闭弹窗
J 49     hideDialog() {
50       this.isShow = false
51       this.$emit('confirm', { })
52     }
53   }
54 }
55 </script>
56
57 <style scoped>
58 .xio_room_status_chg_dialog {
59   width: 1105px;
60   min-height: 602px;
61   /* border-radius: 10px; */
62   background-color: rgba(255,255,255,1);
63   position: absolute;
64   top: 50%;
65   left: 50%;
66   transform: translate(-50%, -50%);
67   -webkit-transform: translate(-50%, -50%);
68   z-index: 1;
69 }
70 .xio_room_status_chg_dialog .title {
71   line-height: 112px;
72   color: rgba(16,16,16,1);
73   font-size: 80px;
74   text-align: center;
75   font-family: PingFangSC-medium;
76   font-weight: bold;
77   padding-top: 159px;
78 }
79 .xio_room_status_chg_dialog .btn_box {
80   margin-top: 131px;
81 }
82 .xio_room_status_chg_dialog .btn_box .line {
83   width: 100%;
84 }
85 .xio_room_status_chg_dialog .btn_box_item {
86   width: 300px;
87   height: 100px;
88   line-height: 52px;
89   border-radius: 4px;
90   background-color: rgba(34,123,235,1);
91   color: rgba(255,255,255,1);
92   font-size: 36px;
93   text-align: center;
94   font-family: Microsoft Yahei;
95   box-shadow: 0px 2px 6px 0px rgba(206,206,206,0.86);
96 }
97 /* .xio_room_status_chg_dialog .btn_box_item.white {
98   background-color: rgba(255,255,255,1);
99 }
100 .xio_room_status_chg_dialog .btn_box_item.blue {
101   background-color: rgba(46,77,124,1);
102 }
103 .xio_room_status_chg_dialog .btn_box_item.yellow {
104   background-color: rgba(255,199,115,1);
105 }
106 .xio_room_status_chg_dialog .btn_box_item.gray {
107   background-color: rgba(206,206,206,1);
108 } */
109 .xio_room_status_chg_dialog .btn_box_item .icon {
110   width: 60px;
111   height: 60px;
112   display: block;
113   margin-right: 17px;
114 }
115 .xio_room_status_chg_dialog .btn_box_item .icon .img {
116   width: 100%;
117   height: 100%;
118 }
119 /* .xio_room_status_chg_dialog .btn_box_item .tx {
120   line-height: 37px;
121   color: rgba(51,51,51,1);
122   font-size: 26px;
123   text-align: center;
124   font-family: PingFangSC-medium;
125 }
126 .xio_room_status_chg_dialog .btn_box_item .tx.white {
127   color: #ffffff;
128 } */
129 </style>