feat : 完善视频巡查样式

This commit is contained in:
Free-sss 2025-08-28 11:46:21 +08:00
parent 24f0a52bee
commit 1f0e81ca7f
6 changed files with 60 additions and 26 deletions

View File

@ -14,7 +14,7 @@ export const styleConfig = {
fontFamily: 'CustomFont',
},
headerOption: {
paddingLeft: 30,
paddingLeft: 0,
paddingRight: 0,
paddingTop: 0,
paddingBottom: 0

View File

@ -43,6 +43,10 @@ onMounted(() => {
console.error("无法访问 iframe 内的 g.active3d 对象。");
}
};
//
setTimeout(() => {
callIframeMethod("setProvinceFocusable", false)
}, 3000)
}
});
@ -55,6 +59,7 @@ watchEffect(() => {
// iframe
setTimeout(() => {
BarOptionsData.value.forEach(barConfig => {
// console.log(" Drawing bar with config:", barConfig);
callIframeMethod("createBar", barConfig);

View File

@ -52,7 +52,7 @@ const otherConfig = {
fontFamily: 'CustomFont',
},
headerOption: {
paddingLeft: 30,
paddingLeft: 0,
paddingRight: 0,
paddingTop: 0,
paddingBottom: 0

View File

@ -224,7 +224,7 @@
<span class="right-select">
<ConsumSelect v-show="selectOption.show" :options="selectOption.dataset"
:selectedValue="selectOption.selectValue" @change="handleSelectChange"
select-style-config="selectStyleConfig" />
:select-style-config="selectStyleConfig" />
</span>
</div>
<div class="body">

View File

@ -25,7 +25,21 @@ export const option = {
/** 外层css缩放比例 */
sca: 1,
showBtn: true,
isOldStyle: true
isOldStyle: true,
titleText: '实时报警',
titleOption: {
color: '#ffffff',
fontSize: '17px',
fontStyle: 'normal',
fontWeight: 'normal',
fontFamily: 'CustomFont',
},
headerOption: {
paddingLeft: 0,
paddingRight: 0,
paddingTop: 0,
paddingBottom: 0
}
}
export default class Config extends PublicConfigClass implements CreateComponentType {

View File

@ -1,14 +1,16 @@
<!-- eslint-disable vue/multi-word-component-names -->
<template>
<div>
<SmallBaorder01 :titleText="option.titleText" :title-option="option.titleOption"
:headerOption="option.headerOption">
<div :class="option.isOldStyle ? 'video_title' : 'video_title video_title_new'" v-if="option.showBtn">
<div class="title_text" v-if="option.showTree && option.showBtn">{{ option.videoTitle }}</div>
<n-select v-if="!option.showTree" class="video_select" placement="top-end"
v-model:value="option.selectedDataSource" :options="option.dataSource" :style="`width:${w / 2}px;`"
@update:value="handleSelectDataSource" />
<n-button tertiary v-else-if="option.showTree && option.showBtn && option.isOldStyle"
:class="option.isOldStyle ? 'videoChangBtn' : 'videoChangBtn videoChangBtn_new'"
@click="handleClick">切换</n-button>
:class="option.isOldStyle ? 'videoChangBtn' : 'videoChangBtn videoChangBtn_new'" @click="handleClick"
class="button">切换</n-button>
<n-button tertiary v-else-if="option.showTree && option.showBtn && !option.isOldStyle"
:class="option.isOldStyle ? 'videoChangBtn' : 'videoChangBtn videoChangBtn_new'"
@click="handleClick"></n-button>
@ -23,6 +25,9 @@
</n-modal>
</div>
<div ref="vYushiVideoRef" class="go-video" :id="uuid"></div>
</SmallBaorder01>
</div>
</template>
@ -39,6 +44,7 @@ import { PageEnum } from '@/enums/pageEnum'
import axios from 'axios'
import { getUUID, isPreview } from '@/utils'
import { useYushiVideoStore } from '@/store/modules/yushiVideoStore/yushiVideoStore'
import SmallBaorder01 from '../SmallBorder01Co/index.vue'
const yushiStore = useYushiVideoStore()
let selectedList = []
@ -594,6 +600,8 @@ const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore, (n
margin: 4px 0;
}
.videoChangBtn {
padding: 4px 4px;
border: 1px solid rgb(24, 160, 219);
@ -607,6 +615,13 @@ const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore, (n
background-repeat: no-repeat;
background-image: url('data:image/png;base64,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');
}
.button {
background-color: #1E5676;
border: 1px solid #2E6E89;
padding: 12px 10px;
margin-right: 20px;
}
</style>
<style lang="scss">
.custom-tab-modal>.n-card-header {