Commit b27126278f124ed3379de0f5cf9b4e67f3b6f9f9
1 parent
29b360e4
pref: camera manage split scrren has exist scrollbar
Showing
1 changed file
with
15 additions
and
6 deletions
@@ -27,8 +27,8 @@ | @@ -27,8 +27,8 @@ | ||
27 | }); | 27 | }); |
28 | 28 | ||
29 | const options = reactive({ | 29 | const options = reactive({ |
30 | - width: '800px', | ||
31 | - height: '450px', | 30 | + width: '200px', |
31 | + height: '200px', | ||
32 | color: '#409eff', | 32 | color: '#409eff', |
33 | muted: false, //静音 | 33 | muted: false, //静音 |
34 | webFullScreen: false, | 34 | webFullScreen: false, |
@@ -39,9 +39,7 @@ | @@ -39,9 +39,7 @@ | ||
39 | ligthOff: false, //关灯模式 | 39 | ligthOff: false, //关灯模式 |
40 | volume: 0.3, //默认音量大小 | 40 | volume: 0.3, //默认音量大小 |
41 | control: true, //是否显示控制器 | 41 | control: true, //是否显示控制器 |
42 | - title: '', //视频名称 | ||
43 | type: 'm3u8', | 42 | type: 'm3u8', |
44 | - src: '', //视频源 | ||
45 | controlBtns: [ | 43 | controlBtns: [ |
46 | 'audioTrack', | 44 | 'audioTrack', |
47 | 'quality', | 45 | 'quality', |
@@ -74,6 +72,7 @@ | @@ -74,6 +72,7 @@ | ||
74 | organizationId: unref(organizationId)!, | 72 | organizationId: unref(organizationId)!, |
75 | }); | 73 | }); |
76 | cameraList.value = items; | 74 | cameraList.value = items; |
75 | + console.log({ url: cameraList.value.map((item) => item.videoUrl) }); | ||
77 | } catch (error) { | 76 | } catch (error) { |
78 | } finally { | 77 | } finally { |
79 | loading.value = false; | 78 | loading.value = false; |
@@ -168,8 +167,13 @@ | @@ -168,8 +167,13 @@ | ||
168 | :span="getColLayout" | 167 | :span="getColLayout" |
169 | > | 168 | > |
170 | <div class="box-border w-full h-full p-3"> | 169 | <div class="box-border w-full h-full p-3"> |
171 | - <div class="bg-yellow-50 w-full h-full overflow-hidden"> | ||
172 | - <VideoPlay v-bind="options" :src="item.videoUrl" /> | 170 | + <div class="bg-yellow-50 w-full h-full overflow-hidden relative"> |
171 | + <VideoPlay v-bind="options" :src="item.videoUrl" :title="item.name" /> | ||
172 | + <div | ||
173 | + class="absolute hidden top-0 left-0 z-50 bg-gray-200 text-lg w-full h-full flex justify-center items-center" | ||
174 | + > | ||
175 | + <span>视频名称</span> | ||
176 | + </div> | ||
173 | </div> | 177 | </div> |
174 | </div> | 178 | </div> |
175 | </Col> | 179 | </Col> |
@@ -203,4 +207,9 @@ | @@ -203,4 +207,9 @@ | ||
203 | .split-screen-mode:deep(.ant-tabs-tab-active) { | 207 | .split-screen-mode:deep(.ant-tabs-tab-active) { |
204 | border-bottom: 1px solid #eee; | 208 | border-bottom: 1px solid #eee; |
205 | } | 209 | } |
210 | + | ||
211 | + .split-screen-mode:deep(video) { | ||
212 | + position: absolute; | ||
213 | + height: calc(100%) !important; | ||
214 | + } | ||
206 | </style> | 215 | </style> |