Compare commits
3 Commits
ccbb53093f
...
f071abfcf7
Author | SHA1 | Date |
---|---|---|
guoyue | f071abfcf7 | |
guoyue | 0b401f5741 | |
guoyue | 2f752de364 |
|
@ -358,6 +358,10 @@
|
||||||
<div style="width: 100%; height: 100%;position:relative">
|
<div style="width: 100%; height: 100%;position:relative">
|
||||||
<!-- 预览视频--遮罩 -->
|
<!-- 预览视频--遮罩 -->
|
||||||
<div class="video-cover" @click="videoShowMsg"></div>
|
<div class="video-cover" @click="videoShowMsg"></div>
|
||||||
|
<div class="waterMark waterMark-left-top">{{userInfo.usernameShow}}</div>
|
||||||
|
<div class="waterMark waterMark-right-top">{{userInfo.realNameShow}}</div>
|
||||||
|
<div class="waterMark waterMark-left-bottom">{{userInfo.usernameShow}}</div>
|
||||||
|
<div class="waterMark waterMark-right-bottom">{{userInfo.realNameShow}}</div>
|
||||||
<vue3VideoPlay v-bind="options" />
|
<vue3VideoPlay v-bind="options" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -384,6 +388,8 @@
|
||||||
<a-pagination v-model:current="current" :total="videoTotal" defaultPageSize="4" :showSizeChanger="false"
|
<a-pagination v-model:current="current" :total="videoTotal" defaultPageSize="4" :showSizeChanger="false"
|
||||||
@change="batchPicturePreview" show-less-items />
|
@change="batchPicturePreview" show-less-items />
|
||||||
</a-modal>
|
</a-modal>
|
||||||
|
|
||||||
|
|
||||||
<!-- 批量预览视频弹窗 -->
|
<!-- 批量预览视频弹窗 -->
|
||||||
<a-modal wrapClassName="batch-preview-modal" v-model:visible="batchVisible" title="视频批量预览" :width="1060"
|
<a-modal wrapClassName="batch-preview-modal" v-model:visible="batchVisible" title="视频批量预览" :width="1060"
|
||||||
destroyOnClose @cancel="videoClean">
|
destroyOnClose @cancel="videoClean">
|
||||||
|
@ -392,6 +398,10 @@
|
||||||
<div v-for="(item, index) in videoList" :key="item.id" style="width: 100%; height: 100%;position:relative">
|
<div v-for="(item, index) in videoList" :key="item.id" style="width: 100%; height: 100%;position:relative">
|
||||||
<!-- 批量预览视频--遮罩 -->
|
<!-- 批量预览视频--遮罩 -->
|
||||||
<div class="batch-video-cover" @click="videoShowMsg(index)"></div>
|
<div class="batch-video-cover" @click="videoShowMsg(index)"></div>
|
||||||
|
<div class="batch-waterMark batch-waterMark-left-top">{{userInfo.usernameShow}}</div>
|
||||||
|
<div class="batch-waterMark batch-waterMark-right-top">{{userInfo.realNameShow}}</div>
|
||||||
|
<div class="batch-waterMark batch-waterMark-left-bottom">{{userInfo.usernameShow}}</div>
|
||||||
|
<div class="batch-waterMark batch-waterMark-right-bottom">{{userInfo.realNameShow}}</div>
|
||||||
<p></p>
|
<p></p>
|
||||||
<vue3VideoPlay v-bind="item.options" />
|
<vue3VideoPlay v-bind="item.options" />
|
||||||
</div>
|
</div>
|
||||||
|
@ -399,6 +409,7 @@
|
||||||
<a-pagination v-model:current="current" :total="videoTotal" defaultPageSize="4" :showSizeChanger="false"
|
<a-pagination v-model:current="current" :total="videoTotal" defaultPageSize="4" :showSizeChanger="false"
|
||||||
@change="batchPreview" show-less-items />
|
@change="batchPreview" show-less-items />
|
||||||
</a-modal>
|
</a-modal>
|
||||||
|
|
||||||
<a-modal wrapClassName="wrj" v-model:visible="wrjVisible" :width="1000" :title="wrjName + '详情'"
|
<a-modal wrapClassName="wrj" v-model:visible="wrjVisible" :width="1000" :title="wrjName + '详情'"
|
||||||
@ok="wrjVisible = false">
|
@ok="wrjVisible = false">
|
||||||
<div v-for="(db, key) in wrjData" :key="key">
|
<div v-for="(db, key) in wrjData" :key="key">
|
||||||
|
@ -438,6 +449,10 @@ import {
|
||||||
computed,
|
computed,
|
||||||
|
|
||||||
} from 'vue'
|
} from 'vue'
|
||||||
|
import {
|
||||||
|
getUser,
|
||||||
|
getUserInfo,
|
||||||
|
} from '@/api/home'
|
||||||
import {
|
import {
|
||||||
getCameraByParentId,
|
getCameraByParentId,
|
||||||
getStreamByChannelCode,
|
getStreamByChannelCode,
|
||||||
|
@ -607,6 +622,8 @@ if (props.searchValue) {
|
||||||
mapSearchParam.value.cameraName = props.searchValue
|
mapSearchParam.value.cameraName = props.searchValue
|
||||||
}
|
}
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
handleUser()
|
||||||
|
|
||||||
if (jcssType.value) {
|
if (jcssType.value) {
|
||||||
tabClick(0, jcssType.value)
|
tabClick(0, jcssType.value)
|
||||||
if (jcssType.value == '视频资源') {
|
if (jcssType.value == '视频资源') {
|
||||||
|
@ -691,9 +708,9 @@ if (whoShow1.value.itShowXiHaiAn) {
|
||||||
|
|
||||||
// 单个预览,当前点击数据
|
// 单个预览,当前点击数据
|
||||||
const rowClickData = ref(null)
|
const rowClickData = ref(null)
|
||||||
// 打开视频预览 todo1
|
// 打开视频预览
|
||||||
const openVideo = (id, item) => {
|
const openVideo = (id, item) => {
|
||||||
if(item) {
|
if (item) {
|
||||||
rowClickData.value = item;
|
rowClickData.value = item;
|
||||||
}
|
}
|
||||||
console.log('打开视频', id)
|
console.log('打开视频', id)
|
||||||
|
@ -1611,8 +1628,6 @@ const onSelectChange = (record, selected, selectedRows, nativeEvent) => {
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
console.log('已选中======================>', selectedList.value)
|
console.log('已选中======================>', selectedList.value)
|
||||||
// selectedList.value = selectedRows
|
|
||||||
// allClick.value = selectedRowKeys
|
|
||||||
}
|
}
|
||||||
const onSelectAll = (selected, selectedRows, changeRows) => {
|
const onSelectAll = (selected, selectedRows, changeRows) => {
|
||||||
if (selected) {
|
if (selected) {
|
||||||
|
@ -1677,6 +1692,22 @@ const videoShowMsg = (index) => {
|
||||||
}
|
}
|
||||||
message.warning(msg)
|
message.warning(msg)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 获取用户信息
|
||||||
|
const userInfo = ref(null)
|
||||||
|
const handleUser = () => {
|
||||||
|
getUser().then(res => {
|
||||||
|
console.log('res-----获取用户信息------->', res);
|
||||||
|
if (res.data.code != 0) {
|
||||||
|
return message.warning(res.data.msg)
|
||||||
|
}
|
||||||
|
userInfo.value = res.data.data || {}
|
||||||
|
userInfo.value.usernameShow = '西海岸能力超市' + (userInfo.value.deptName || '') + (userInfo.value.username || '');
|
||||||
|
userInfo.value.realNameShow = '西海岸能力超市' + (userInfo.value.deptName || '') + (userInfo.value.realName || '');
|
||||||
|
}).catch(err => {
|
||||||
|
message.warning(err)
|
||||||
|
})
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.infrastructrueBox {
|
.infrastructrueBox {
|
||||||
|
@ -2120,4 +2151,83 @@ video::-webkit-media-controls {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.waterMark {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 99999999;
|
||||||
|
color: #0058e1;
|
||||||
|
font-size: 22px;
|
||||||
|
font-weight: bold;
|
||||||
|
opacity: 0.4;
|
||||||
|
transform: rotate(-25deg);
|
||||||
|
width: 470px
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 左上
|
||||||
|
.waterMark-left-top {
|
||||||
|
left: 50px;
|
||||||
|
top: 100px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 右上
|
||||||
|
.waterMark-right-top {
|
||||||
|
right: 50px;
|
||||||
|
top: 100px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 左下
|
||||||
|
.waterMark-left-bottom {
|
||||||
|
left: 50px;
|
||||||
|
bottom: 100px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 右下
|
||||||
|
.waterMark-right-bottom {
|
||||||
|
right: 50px;
|
||||||
|
bottom: 100px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 批量
|
||||||
|
.batch-waterMark {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 99999999;
|
||||||
|
color: #0058e1;
|
||||||
|
font-size: 14px;
|
||||||
|
opacity: 0.4;
|
||||||
|
transform: rotate(-25deg);
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 左上
|
||||||
|
.batch-waterMark-left-top {
|
||||||
|
left: 30px;
|
||||||
|
top: 50px;
|
||||||
|
text-align: left;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// 右上
|
||||||
|
.batch-waterMark-right-top {
|
||||||
|
text-align: right;
|
||||||
|
right: 30px;
|
||||||
|
top: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 左下
|
||||||
|
.batch-waterMark-left-bottom {
|
||||||
|
left: 30px;
|
||||||
|
bottom: 50px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 右下
|
||||||
|
.batch-waterMark-right-bottom {
|
||||||
|
right: 20px;
|
||||||
|
bottom: 30px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue