mdm-client 1.0.3 → 1.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/package.json +1 -1
  2. package/src/App.vue +72 -67
  3. package/src/assets/image/common/layout-active16.png +0 -0
  4. package/src/assets/image/common/layout-active25.png +0 -0
  5. package/src/assets/image/common/layout-active3.png +0 -0
  6. package/src/assets/image/common/layout-active9.png +0 -0
  7. package/src/assets/image/common/layout16.png +0 -0
  8. package/src/assets/image/common/layout25.png +0 -0
  9. package/src/assets/image/common/layout3.png +0 -0
  10. package/src/assets/image/common/layout9.png +0 -0
  11. package/src/assets/image/common/mirror.png +0 -0
  12. package/src/assets/image/common/rotate_icon1.png +0 -0
  13. package/src/assets/image/common/rotate_icon2.png +0 -0
  14. package/src/assets/image/common/rotate_icon3.png +0 -0
  15. package/src/assets/image/common/rotate_icon4.png +0 -0
  16. package/src/assets/style/base.scss +5 -0
  17. package/src/components/LiveMulti/LiveMulti.vue +27 -6
  18. package/src/components/LiveMultipleMeeting/LiveMultipleMeeting.vue +1063 -98
  19. package/src/components/LiveMultipleMeeting/style/index.scss +145 -14
  20. package/src/components/LivePoint/LivePoint.vue +49 -211
  21. package/src/components/LivePointMeeting/LivePointMeeting.vue +159 -10
  22. package/src/components/LivePointMeeting/style/index.scss +35 -0
  23. package/src/components/MeetingReadyDialog/MeetingReadyDialog.vue +96 -14
  24. package/src/components/other/addressBook.vue +137 -20
  25. package/src/components/other/appointDialog.vue +1 -1
  26. package/src/components/other/customLayout.vue +368 -202
  27. package/src/components/other/layoutSwitch.vue +253 -37
  28. package/src/components/other/leadershipFocus.vue +422 -0
  29. package/src/components/other/leaveOptionDialog.vue +1 -1
  30. package/src/components/other/moreOptionDialog.vue +17 -1
  31. package/src/components/other/selectDialog.vue +1 -1
  32. package/src/components/other/selectSpecialDialog.vue +1 -1
  33. package/src/utils/api.js +19 -0
  34. package/src/utils/livekit/live-client-esm.js +1 -1
@@ -1,9 +1,45 @@
1
1
  <template>
2
2
  <div class="dialog" :style="position">
3
3
  <div class="dialog-inner">
4
- <div :class="['layout-list', currentLayout === layout ? ('layout-list-' + layout + '-active') : ('layout-list-' + layout)]" v-for="(layout, index) of layoutList" :key="layout" @click="setLayout(layout)">
4
+ <div
5
+ :class="[
6
+ 'layout-list',
7
+ currentLayout === layout
8
+ ? currentLayout === 'grid'
9
+ ? 'layout-list-grid' + currentGridSize + '-active'
10
+ : 'layout-list-' + currentLayout + '-active'
11
+ : layout === 'grid'
12
+ ? 'layout-list-grid' + currentGridSize
13
+ : 'layout-list-' + layout,
14
+ ]"
15
+ v-for="(layout, index) of layoutList"
16
+ :key="layout"
17
+ @click="handleLayoutClick(layout)">
5
18
  <div class="icon"></div>
6
- <div class="title">{{ layoutLabels[index] }}</div>
19
+ <div
20
+ v-if="layout === 'grid'"
21
+ class="dropdown-container"
22
+ @mouseenter="handleMouseEnter"
23
+ @mouseleave="handleMouseLeave">
24
+ <div :class="['dropdown-trigger', { 'dropdown-trigger-open': currentLayout === 'grid' }]">
25
+ <span>{{ currentGridLabel }}</span>
26
+ <div :class="['dropdown-icon', { 'dropdown-icon-open': isDropdownOpen }]"></div>
27
+ </div>
28
+ <div
29
+ v-if="isDropdownOpen"
30
+ class="dropdown-menu"
31
+ @mouseenter="handleMouseEnter"
32
+ @mouseleave="handleMouseLeave">
33
+ <div
34
+ v-for="option in gridOptions"
35
+ :key="option.value"
36
+ :class="['dropdown-item', { active: currentGridSize === option.value }]"
37
+ @click="selectGridSize(option.value)">
38
+ {{ option.label }}
39
+ </div>
40
+ </div>
41
+ </div>
42
+ <div v-else class="title">{{ layoutLabels[index] }}</div>
7
43
  </div>
8
44
  </div>
9
45
  </div>
@@ -12,6 +48,8 @@
12
48
  <script>
13
49
  import { ShowMessage } from "../../utils/index";
14
50
 
51
+ let dropdownTimeout = null
52
+
15
53
  export default {
16
54
  name: "LayoutSwitch",
17
55
  props: {
@@ -35,23 +73,61 @@ export default {
35
73
  },
36
74
  currentRoomMode: {
37
75
  type: String
76
+ },
77
+ currentGridSize: {
78
+ type: Number,
79
+ default: 9,
38
80
  }
39
81
  },
40
82
  data() {
41
83
  return {
42
84
  showMessage: null,
85
+ isDropdownOpen: false,
86
+ gridOptions: [
87
+ { value: 9, label: "一屏9等分" },
88
+ { value: 16, label: "一屏16等分" },
89
+ { value: 25, label: "一屏25等分" },
90
+ ],
43
91
  };
44
92
  },
93
+ computed: {
94
+ currentGridLabel() {
95
+ const option = this.gridOptions.find(
96
+ (opt) => opt.value === this.currentGridSize
97
+ );
98
+ return option ? option.label : "9宫格";
99
+ },
100
+ },
45
101
  created() {
46
102
  this.showMessage = new ShowMessage();
47
103
  },
48
104
  methods: {
49
- setLayout(layout) {
50
- if(this.currentRoomMode === "normal") {
51
- // 仅当当前为会议模式时允许切换布局
52
- this.$emit("setLayout", layout);
105
+ handleLayoutClick(layout) {
106
+ if (this.currentRoomMode === 'normal') {
107
+ this.$emit('setLayout', layout)
53
108
  } else {
54
- this.showMessage.message("info", "点调模式下无法切换布局,请切换到会议模式后重试");
109
+ this.showMessage.message('info', '点调模式下无法切换布局,请切换到会议模式后重试')
110
+ }
111
+ },
112
+ handleMouseEnter() {
113
+ if (dropdownTimeout) {
114
+ clearTimeout(dropdownTimeout)
115
+ dropdownTimeout = null
116
+ }
117
+ this.isDropdownOpen = true
118
+ },
119
+ handleMouseLeave() {
120
+ dropdownTimeout = setTimeout(() => {
121
+ this.isDropdownOpen = false
122
+ dropdownTimeout = null
123
+ }, 100)
124
+ },
125
+ selectGridSize(size) {
126
+ this.$emit('setGridSize', size)
127
+ this.isDropdownOpen = false
128
+ if (dropdownTimeout) {
129
+ clearTimeout(dropdownTimeout)
130
+ dropdownTimeout = null
55
131
  }
56
132
  }
57
133
  }
@@ -61,10 +137,10 @@ export default {
61
137
  <style lang="scss" scoped>
62
138
  .dialog {
63
139
  position: absolute;
64
- z-index: 100;
65
- padding-top: 10px;
140
+ z-index: 2100;
141
+ padding-top: 40px;
66
142
  // background: transparent;
67
- width: 175px;
143
+ width: fit-content;
68
144
  height: auto;
69
145
  &-inner {
70
146
  background: var(--dialog-bg);
@@ -78,6 +154,8 @@ export default {
78
154
  justify-content: space-between;
79
155
  padding: 0 16px;
80
156
  .layout-list {
157
+ width: 110px;
158
+ flex-shrink: 0;
81
159
  display: flex;
82
160
  flex-direction: column;
83
161
  align-items: center;
@@ -95,11 +173,74 @@ export default {
95
173
  }
96
174
  &-grid {
97
175
  .icon {
98
- background: url("../../assets/image/common/layout1.png") no-repeat center / 100% 100%;
176
+ background: url('../../assets/image/common/layout1.png') no-repeat center / 100% 100%;
177
+ }
178
+ &:hover {
179
+ .icon {
180
+ background: url('../../assets/image/common/layout-active1.png') no-repeat center / 100% 100% !important;
181
+ }
182
+ .title {
183
+ color: var(--btn-primary-bg);
184
+ }
185
+ }
186
+ &-active {
187
+ .icon {
188
+ background: url('../../assets/image/common/layout-active1.png') no-repeat center / 100% 100% !important;
189
+ }
190
+ .title {
191
+ color: var(--btn-primary-bg);
192
+ }
193
+ }
194
+ }
195
+ &-grid9 {
196
+ .icon {
197
+ background: url('../../assets/image/common/layout9.png') no-repeat center / 100% 100%;
198
+ }
199
+ &:hover {
200
+ .icon {
201
+ background: url('../../assets/image/common/layout-active9.png') no-repeat center / 100% 100% !important;
202
+ }
203
+ .title {
204
+ color: var(--btn-primary-bg);
205
+ }
206
+ }
207
+ &-active {
208
+ .icon {
209
+ background: url('../../assets/image/common/layout-active9.png') no-repeat center / 100% 100% !important;
210
+ }
211
+ .title {
212
+ color: var(--btn-primary-bg);
213
+ }
214
+ }
215
+ }
216
+ &-grid16 {
217
+ .icon {
218
+ background: url('../../assets/image/common/layout16.png') no-repeat center / 100% 100%;
219
+ }
220
+ &:hover {
221
+ .icon {
222
+ background: url('../../assets/image/common/layout-active16.png') no-repeat center / 100% 100% !important;
223
+ }
224
+ .title {
225
+ color: var(--btn-primary-bg);
226
+ }
227
+ }
228
+ &-active {
229
+ .icon {
230
+ background: url('../../assets/image/common/layout-active16.png') no-repeat center / 100% 100% !important;
231
+ }
232
+ .title {
233
+ color: var(--btn-primary-bg);
234
+ }
235
+ }
236
+ }
237
+ &-grid25 {
238
+ .icon {
239
+ background: url('../../assets/image/common/layout25.png') no-repeat center / 100% 100%;
99
240
  }
100
241
  &:hover {
101
242
  .icon {
102
- background: url("../../assets/image/common/layout-active1.png") no-repeat center / 100% 100% !important;
243
+ background: url('../../assets/image/common/layout-active25.png') no-repeat center / 100% 100% !important;
103
244
  }
104
245
  .title {
105
246
  color: var(--btn-primary-bg);
@@ -107,7 +248,7 @@ export default {
107
248
  }
108
249
  &-active {
109
250
  .icon {
110
- background: url("../../assets/image/common/layout-active1.png") no-repeat center / 100% 100% !important;
251
+ background: url('../../assets/image/common/layout-active25.png') no-repeat center / 100% 100% !important;
111
252
  }
112
253
  .title {
113
254
  color: var(--btn-primary-bg);
@@ -116,11 +257,11 @@ export default {
116
257
  }
117
258
  &-rightSide {
118
259
  .icon {
119
- background: url("../../assets/image/common/layout2.png") no-repeat center / 100% 100%;
260
+ background: url('../../assets/image/common/layout2.png') no-repeat center / 100% 100%;
120
261
  }
121
262
  &:hover {
122
263
  .icon {
123
- background: url("../../assets/image/common/layout-active2.png") no-repeat center / 100% 100% !important;
264
+ background: url('../../assets/image/common/layout-active2.png') no-repeat center / 100% 100% !important;
124
265
  }
125
266
  .title {
126
267
  color: var(--btn-primary-bg);
@@ -128,34 +269,34 @@ export default {
128
269
  }
129
270
  &-active {
130
271
  .icon {
131
- background: url("../../assets/image/common/layout-active2.png") no-repeat center / 100% 100% !important;
272
+ background: url('../../assets/image/common/layout-active2.png') no-repeat center / 100% 100% !important;
273
+ }
274
+ .title {
275
+ color: var(--btn-primary-bg);
276
+ }
277
+ }
278
+ }
279
+ &-ring {
280
+ .icon {
281
+ background: url('../../assets/image/common/layout3.png') no-repeat center / 100% 100%;
282
+ }
283
+ &:hover {
284
+ .icon {
285
+ background: url('../../assets/image/common/layout-active3.png') no-repeat center / 100% 100% !important;
286
+ }
287
+ .title {
288
+ color: var(--btn-primary-bg);
289
+ }
290
+ }
291
+ &-active {
292
+ .icon {
293
+ background: url('../../assets/image/common/layout-active3.png') no-repeat center / 100% 100% !important;
132
294
  }
133
295
  .title {
134
296
  color: var(--btn-primary-bg);
135
297
  }
136
298
  }
137
299
  }
138
- // &-ring {
139
- // .icon {
140
- // background: url('/assets/img/meeting/layout3.png') no-repeat center / 100% 100%;
141
- // }
142
- // &:hover {
143
- // .icon {
144
- // background: url('/assets/img/meeting/layout-active3.png') no-repeat center / 100% 100% !important;
145
- // }
146
- // .title {
147
- // color: #5FA7FD;
148
- // }
149
- // }
150
- // &-active {
151
- // .icon {
152
- // background: url('/assets/img/meeting/layout-active3.png') no-repeat center / 100% 100% !important;
153
- // }
154
- // .title {
155
- // color: #5FA7FD;
156
- // }
157
- // }
158
- // }
159
300
  // &-downLSide {
160
301
  // .icon {
161
302
  // background: url('/assets/img/meeting/layout4.png') no-repeat center / 100% 100%;
@@ -178,6 +319,81 @@ export default {
178
319
  // }
179
320
  // }
180
321
  }
322
+
323
+ .dropdown-container {
324
+ position: relative;
325
+ cursor: pointer;
326
+ user-select: none;
327
+
328
+ .dropdown-trigger {
329
+ display: flex;
330
+ align-items: center;
331
+ gap: 4px;
332
+ font-weight: 500;
333
+ font-size: 16px;
334
+ color: var(--theme-font-color);
335
+ line-height: 24px;
336
+ white-space: nowrap;
337
+ transition: all 0.2s ease;
338
+ padding: 0 6px;
339
+ border-radius: 6px;
340
+
341
+ .dropdown-icon {
342
+ width: 8px;
343
+ height: 4px;
344
+ background: var(--ready-arrow-icon) no-repeat center/ 100% 100%;
345
+ transition: transform 0.2s ease;
346
+ &-open {
347
+ transform: rotate(180deg);
348
+ }
349
+ }
350
+ &-open {
351
+ background: var(--layout-select-bg);
352
+ color: var(--btn-primary-bg);
353
+ }
354
+ &:hover {
355
+ background: var(--layout-select-bg);
356
+ color: var(--btn-primary-bg);
357
+ }
358
+ }
359
+
360
+ .dropdown-menu {
361
+ position: absolute;
362
+ top: 100%;
363
+ left: 50%;
364
+ transform: translateX(-50%);
365
+ margin-top: 4px;
366
+ background: var(--dialog-bg);
367
+ border: 1px solid var(--dialog-border-color);
368
+ border-radius: 6px;
369
+ box-shadow: 0px 0px 8px 0px var(--dialog-shadow-color);
370
+ z-index: 1000;
371
+ min-width: 104px;
372
+ overflow: hidden;
373
+ padding: 4px 6px;
374
+
375
+ .dropdown-item {
376
+ width: 100%;
377
+ height: 36px;
378
+ cursor: pointer;
379
+ font-size: 14px;
380
+ display: flex;
381
+ align-items: center;
382
+ padding: 0 12px;
383
+ white-space: nowrap;
384
+ color: var(--theme-font-color);
385
+ border-radius: 6px;
386
+ &:hover,
387
+ &.active {
388
+ background: var(--theme-color);
389
+ color: #ffffff;
390
+ }
391
+ &:not(:last-child) {
392
+ margin-bottom: 8px;
393
+ }
394
+ }
395
+ }
396
+ }
181
397
  }
182
398
  }
183
399
  </style>