Libt
/
multiple-police-situations
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update system.vue 

注释掉 智能布控页面的 样式穿透
This commit is contained in:
TimSpan 2024-12-25 10:49:03 +08:00
parent a76fb07aab
commit 226bd0a514
1 changed files with 149 additions and 158 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

307
src/views/page/system.vue
View File

@ -115,8 +115,8 @@
</el-form> </el-form>
<template #footer> <template #footer>
<span class="dialog-footer"> <span class="dialog-footer">
<el-button @click="addGroupVisible = false" style="color: #0cd6fe">取 消</el-button> <el-button @click="addGroupVisible = false">取 消</el-button>
<el-button type="primary" @click="addGroupFn(ruleFormRef_Group)" style="color: #0cd6fe">确 定</el-button> <el-button type="primary" @click="addGroupFn(ruleFormRef_Group)">确 定</el-button>
</span> </span>
</template> </template>
</el-dialog> </el-dialog>
@ -173,8 +173,8 @@
</el-form> </el-form>
<template #footer> <template #footer>
<span class="dialog-footer"> <span class="dialog-footer">
<el-button @click="dialogVisible = false" style="color: #0cd6fe">取 消</el-button> <el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="RTCSender(ruleFormRef)" style="color: #0cd6fe">确 定</el-button> <el-button type="primary" @click="RTCSender(ruleFormRef)">确 定</el-button>
</span> </span>
</template> </template>
</el-dialog> </el-dialog>
@ -209,9 +209,9 @@
</el-form> </el-form>
<template #footer> <template #footer>
<span class="dialog-footer"> <span class="dialog-footer">
<el-button @click="dialogVisiblea1 = false" style="color: #0cd6fe">取 消</el-button> <el-button @click="dialogVisiblea1 = false">取 消</el-button>
<el-button v-if="isxKOng" type="primary" @click="sendxk" style="color: #0cd6fe">确 定</el-button> <el-button v-if="isxKOng" type="primary" @click="sendxk">确 定</el-button>
<el-button v-else type="primary" @click="RTCRtpSender" style="color: #0cd6fe">确 定</el-button> <el-button v-else type="primary" @click="RTCRtpSender">确 定</el-button>
</span> </span>
</template> </template>
</el-dialog> </el-dialog>
@ -226,11 +226,11 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, reactive, onMounted, watch } from 'vue' import {ref, reactive, onMounted, watch} from 'vue'
import api from '@/axios' import api from '@/axios'
import axios from 'axios' import axios from 'axios'
import { ElMessage } from 'element-plus' import {ElMessage} from 'element-plus'
import type { UploadProps, FormRules, FormInstance } from 'element-plus' import type {UploadProps, FormRules, FormInstance} from 'element-plus'
const ruleFormRef_Group = ref<FormInstance>() const ruleFormRef_Group = ref<FormInstance>()
const ruleFormRef = ref<FormInstance>() const ruleFormRef = ref<FormInstance>()
@ -288,7 +288,7 @@ let formGroup = reactive<formGroupFace>({
groupId: '', groupId: '',
groupLevel: '', groupLevel: '',
parentId: '', parentId: '',
comment: '', comment: ''
}) })
const form2 = reactive<anyObject>({ const form2 = reactive<anyObject>({
target: '', target: '',
@ -298,7 +298,7 @@ const form2 = reactive<anyObject>({
level: '', level: '',
alarmType: '', alarmType: '',
startTime: '', startTime: '',
endTime: '', endTime: ''
}) })
interface formFace { interface formFace {
@ -333,12 +333,12 @@ let form = reactive<formFace>({
city: '', city: '',
town: '', town: '',
imageName: '', imageName: '',
path: '', path: ''
}) })
const resetData = () => { const resetData = () => {
const keys = Object.keys(form) const keys = Object.keys(form)
let obj: { [name: string]: string } = {} let obj: {[name: string]: string} = {}
keys.forEach((item) => { keys.forEach((item) => {
obj[item] = '' obj[item] = ''
}) })
@ -347,12 +347,12 @@ const resetData = () => {
const options = reactive([ const options = reactive([
{ {
value: 'face', value: 'face',
label: '人脸', label: '人脸'
}, },
{ {
value: 'vehicle', value: 'vehicle',
label: '车牌', label: '车牌'
}, }
]) ])
watch(addGroupVisible, (newValue, oldValue) => { watch(addGroupVisible, (newValue, oldValue) => {
console.log(`addGroupVisible ${oldValue} to ${newValue}`) console.log(`addGroupVisible ${oldValue} to ${newValue}`)
@ -399,14 +399,14 @@ const validateTargetType = (rule: any, value: any, callback: any) => {
} }
const rules = reactive<FormRules<typeof form>>({ const rules = reactive<FormRules<typeof form>>({
targetName: [{ validator: validateTargetName, trigger: 'blur' }], targetName: [{validator: validateTargetName, trigger: 'blur'}]
// town: [{ validator: validateTown, trigger: 'blur' }], // town: [{ validator: validateTown, trigger: 'blur' }],
// targetType: [{ validator: validateTargetType, trigger: 'change' }], // targetType: [{ validator: validateTargetType, trigger: 'change' }],
}) })
const rulesGroup = reactive<FormRules<typeof formGroup>>({ const rulesGroup = reactive<FormRules<typeof formGroup>>({
groupName: [{ validator: validateGroupName, trigger: 'blur' }], groupName: [{validator: validateGroupName, trigger: 'blur'}],
groupLevel: [{ validator: validateGroupLevel, trigger: 'blur' }], groupLevel: [{validator: validateGroupLevel, trigger: 'blur'}]
}) })
const addGroupFn = (formEl: FormInstance | undefined) => { const addGroupFn = (formEl: FormInstance | undefined) => {
@ -415,11 +415,11 @@ const addGroupFn = (formEl: FormInstance | undefined) => {
if (valid) { if (valid) {
console.log('submit!') console.log('submit!')
if (isUpdate.value) { if (isUpdate.value) {
api.post('/multialarm/ai/target/group/update', { ...formGroup }).then((res) => { api.post('/multialarm/ai/target/group/update', {...formGroup}).then((res) => {
if (res.code == 0) { if (res.code == 0) {
ElMessage.success({ ElMessage.success({
message: '修改成功', message: '修改成功',
type: 'success', type: 'success'
}) })
getGroupList() getGroupList()
addGroupVisible.value = false addGroupVisible.value = false
@ -428,11 +428,11 @@ const addGroupFn = (formEl: FormInstance | undefined) => {
} }
}) })
} else { } else {
api.post('/multialarm/ai/target/group/add', { ...formGroup }).then((res) => { api.post('/multialarm/ai/target/group/add', {...formGroup}).then((res) => {
if (res.code == 0) { if (res.code == 0) {
ElMessage.success({ ElMessage.success({
message: '新增成功', message: '新增成功',
type: 'success', type: 'success'
}) })
getGroupList() getGroupList()
addGroupVisible.value = false addGroupVisible.value = false
@ -469,11 +469,11 @@ const gettree = () => {
title: string title: string
children?: DataItem[] children?: DataItem[]
} }
function convertDataToOptions(data: DataItem[]): { label: string; value: string; children: any[] }[] { function convertDataToOptions(data: DataItem[]): {label: string; value: string; children: any[]}[] {
return data.map((item) => ({ return data.map((item) => ({
label: item.title, label: item.title,
value: item.title, value: item.title,
children: item.children ? convertDataToOptions(item.children) : [], children: item.children ? convertDataToOptions(item.children) : []
})) }))
} }
@ -501,18 +501,18 @@ const setyd = (e: any) => {}
const chekong = (e: any) => { const chekong = (e: any) => {
console.log('e', e.taskId) console.log('e', e.taskId)
// return ; // return ;
api.post('multialarm/ai/task/delete', { taskId: e.taskId }).then((res) => { api.post('multialarm/ai/task/delete', {taskId: e.taskId}).then((res) => {
if (res.code == 0) { if (res.code == 0) {
// console.log('新增', res) // console.log('新增', res)
ElMessage.success({ ElMessage.success({
message: '撤控成功', message: '撤控成功',
type: 'success', type: 'success'
}) })
dialogVisiblea1.value = false dialogVisiblea1.value = false
api api
.post('/multialarm/ai/task/getlist', { .post('/multialarm/ai/task/getlist', {
pagesize: 15, pagesize: 15,
pageindex: 0, pageindex: 0
}) })
.then((res) => { .then((res) => {
if (res.code == 0) { if (res.code == 0) {
@ -535,7 +535,7 @@ const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
console.log(11111) console.log(11111)
} }
const handleUpload = async ({ file, onProgress, onSuccess, onError }: { file: File; onProgress: Function; onSuccess: Function; onError: Function }) => { const handleUpload = async ({file, onProgress, onSuccess, onError}: {file: File; onProgress: Function; onSuccess: Function; onError: Function}) => {
console.log('🚀 ~ handleUpload ~ file:', file) console.log('🚀 ~ handleUpload ~ file:', file)
form.imageName = file.name form.imageName = file.name
try { try {
@ -546,14 +546,13 @@ const handleUpload = async ({ file, onProgress, onSuccess, onError }: { file: Fi
console.log(22222) console.log(22222)
// 1. 获取上传地址 // 1. 获取上传地址
const uploadUrlResponse = await api.post('/multialarm/ai/target/image/geturl', { ...form }) const uploadUrlResponse = await api.post('/multialarm/ai/target/image/geturl', {...form})
const uploadUrl = uploadUrlResponse.data as string const uploadUrl = uploadUrlResponse.data as string
// 2. 创建 FormData 对象并添加文件 // 2. 创建 FormData 对象并添加文件
const formData = new FormData() const formData = new FormData()
formData.append('file', file) formData.append('file', file)
// 3. 使用 axios 上传文件 // 3. 使用 axios 上传文件
const response = await axios.put(uploadUrl, file, { const response = await axios.put(uploadUrl, file, {})
})
console.log('🚀 ~ handleUpload ~ response:', response) console.log('🚀 ~ handleUpload ~ response:', response)
if (response.status === 200) { if (response.status === 200) {
console.log('form.path,form.imageUrl', form.path, form.imageUrl) console.log('form.path,form.imageUrl', form.path, form.imageUrl)
@ -584,12 +583,12 @@ const handleUpload = async ({ file, onProgress, onSuccess, onError }: { file: Fi
} }
ElMessage.success({ ElMessage.success({
message: '上传成功', message: '上传成功',
type: 'success', type: 'success'
}) })
// 添加文件到 fileList 以便预览 // 添加文件到 fileList 以便预览
fileList.value.push({ fileList.value.push({
name: file.name, name: file.name,
url: URL.createObjectURL(file), url: URL.createObjectURL(file)
}) })
console.log('最后检查form', form) console.log('最后检查form', form)
@ -645,11 +644,11 @@ const RTCSender = (formEl: FormInstance | undefined) => {
console.log('submit!') console.log('submit!')
if (isTargetUpdate.value) { if (isTargetUpdate.value) {
console.log(form.imageName) console.log(form.imageName)
api.post('/multialarm/ai/target/update', { ...form }).then((res) => { api.post('/multialarm/ai/target/update', {...form}).then((res) => {
if (res.code == 0) { if (res.code == 0) {
ElMessage.success({ ElMessage.success({
message: '修改成功', message: '修改成功',
type: 'success', type: 'success'
}) })
dialogVisible.value = false dialogVisible.value = false
seachB() //刷新总条数和列表 seachB() //刷新总条数和列表
@ -662,11 +661,11 @@ const RTCSender = (formEl: FormInstance | undefined) => {
} }
}) })
} else { } else {
api.post('/multialarm/ai/target/add', { ...form }).then((res) => { api.post('/multialarm/ai/target/add', {...form}).then((res) => {
if (res.code == 0) { if (res.code == 0) {
ElMessage.success({ ElMessage.success({
message: '新增成功', message: '新增成功',
type: 'success', type: 'success'
}) })
dialogVisible.value = false dialogVisible.value = false
seachB() //刷新总条数和列表 seachB() //刷新总条数和列表
@ -723,17 +722,17 @@ const handleTableChange = (row: any) => {
form = reactive(clonedData) form = reactive(clonedData)
fileList.value.push({ fileList.value.push({
url: form.imageUrl, url: form.imageUrl
}) })
} }
const handleTableGroupDelete = (id: string) => { const handleTableGroupDelete = (id: string) => {
console.log('🚀 ~ handleTableGroupDelete ~ id:', id) console.log('🚀 ~ handleTableGroupDelete ~ id:', id)
api.post('/multialarm/ai/target/group/delete', { groupId: id }).then((res) => { api.post('/multialarm/ai/target/group/delete', {groupId: id}).then((res) => {
if (res.code == 0) { if (res.code == 0) {
ElMessage.success({ ElMessage.success({
message: '删除成功', message: '删除成功',
type: 'success', type: 'success'
}) })
getGroupList() getGroupList()
} else { } else {
@ -743,11 +742,11 @@ const handleTableGroupDelete = (id: string) => {
} }
const handleTableDelete = (id: string) => { const handleTableDelete = (id: string) => {
console.log('🚀 ~ handleTableDelete ~ id:', id) console.log('🚀 ~ handleTableDelete ~ id:', id)
api.post('/multialarm/ai/target/delete', { targetId: id }).then((res) => { api.post('/multialarm/ai/target/delete', {targetId: id}).then((res) => {
if (res.code == 0) { if (res.code == 0) {
ElMessage.success({ ElMessage.success({
message: '删除成功', message: '删除成功',
type: 'success', type: 'success'
}) })
seachB() seachB()
} else { } else {
@ -790,7 +789,7 @@ const sendxk = () => {
alarmType: form2.alarmType, alarmType: form2.alarmType,
startTime: form2.startTime, startTime: form2.startTime,
endTime: form2.endTime, endTime: form2.endTime,
taskId: taskId.value, taskId: taskId.value
} }
if (form2.target != '') { if (form2.target != '') {
data.targetId = form2.target.split('&')[1] data.targetId = form2.target.split('&')[1]
@ -801,13 +800,13 @@ const sendxk = () => {
// console.log('新增', res) // console.log('新增', res)
ElMessage.success({ ElMessage.success({
message: '续控成功', message: '续控成功',
type: 'success', type: 'success'
}) })
dialogVisiblea1.value = false dialogVisiblea1.value = false
api api
.post('/multialarm/ai/task/getlist', { .post('/multialarm/ai/task/getlist', {
pagesize: 15, pagesize: 15,
pageindex: 0, pageindex: 0
}) })
.then((res) => { .then((res) => {
if (res.code == 0) { if (res.code == 0) {
@ -874,7 +873,7 @@ const RTCRtpSender = () => {
level: form2.level, level: form2.level,
alarmType: form2.alarmType, alarmType: form2.alarmType,
startTime: form2.startTime, startTime: form2.startTime,
endTime: form2.endTime, endTime: form2.endTime
} }
if (form2.target != '') { if (form2.target != '') {
data.targetId = form2.target.split('&')[1] data.targetId = form2.target.split('&')[1]
@ -885,13 +884,13 @@ const RTCRtpSender = () => {
// console.log('新增', res) // console.log('新增', res)
ElMessage.success({ ElMessage.success({
message: '新增成功', message: '新增成功',
type: 'success', type: 'success'
}) })
dialogVisiblea1.value = false dialogVisiblea1.value = false
api api
.post('/multialarm/ai/task/getlist', { .post('/multialarm/ai/task/getlist', {
pagesize: 15, pagesize: 15,
pageindex: 0, pageindex: 0
}) })
.then((res) => { .then((res) => {
if (res.code == 0) { if (res.code == 0) {
@ -936,7 +935,7 @@ const handleError = (response: any) => {
return ElMessage({ return ElMessage({
message: '文件上传失败', message: '文件上传失败',
type: 'error', type: 'error',
offset: 60, offset: 60
}) })
} }
@ -954,13 +953,13 @@ const handleClose = () => {
const seachA = () => { const seachA = () => {
api.post('/multialarm/ai/task/count', {}).then((res) => { api.post('/multialarm/ai/task/count', {}).then((res) => {
if (res.code == 0) { if (res.code == 0) {
total1.value = res.data as { count: number } total1.value = res.data as {count: number}
} }
}) })
api api
.post('/multialarm/ai/task/getlist', { .post('/multialarm/ai/task/getlist', {
pagesize: 15, pagesize: 15,
pageindex: 0, pageindex: 0
}) })
.then((res) => { .then((res) => {
if (res.code == 0) { if (res.code == 0) {
@ -977,7 +976,7 @@ const handleCurrentChange1 = (data: any) => {
api api
.post('/multialarm/ai/task/getlist', { .post('/multialarm/ai/task/getlist', {
pagesize: 15, pagesize: 15,
pageindex: data - 1, pageindex: data - 1
}) })
.then((res) => { .then((res) => {
if (res.code == 0) { if (res.code == 0) {
@ -1008,13 +1007,13 @@ const seachB = () => {
api.post('/multialarm/ai/target/count', {}).then((res) => { api.post('/multialarm/ai/target/count', {}).then((res) => {
console.log('🚀 ~ seachB ~ res:', res) console.log('🚀 ~ seachB ~ res:', res)
if (res.code == 0) { if (res.code == 0) {
total2.value = res.data as { count: number } total2.value = res.data as {count: number}
} }
}) })
api api
.post('/multialarm/ai/target/getlist', { .post('/multialarm/ai/target/getlist', {
pagesize: 15, pagesize: 15,
pageindex: currentPageIndex.value, pageindex: currentPageIndex.value
}) })
.then((res) => { .then((res) => {
if (res.code == 0) { if (res.code == 0) {
@ -1034,7 +1033,7 @@ const handleCurrentChange2 = (data: number) => {
.post('/multialarm/ai/target/getlist', { .post('/multialarm/ai/target/getlist', {
pagesize: 15, pagesize: 15,
// pageindex: data - 1, // pageindex: data - 1,
pageindex: currentPageIndex.value, pageindex: currentPageIndex.value
}) })
.then((res) => { .then((res) => {
if (res.code == 0) { if (res.code == 0) {
@ -1072,7 +1071,7 @@ const closeAddGroup = () => {
} }
.dialog-img-container img:hover { .dialog-img-container img:hover {
transform: scale(2.3); // transform: scale(2.3);
} }
.cont { .cont {
@ -1093,48 +1092,48 @@ const closeAddGroup = () => {
background-color: transparent; background-color: transparent;
} }
:deep(.el-select__wrapper) { // :deep(.el-select__wrapper) {
background-color: transparent; // background-color: transparent;
box-shadow: 0 0 0 1px #1f9bd9; // box-shadow: 0 0 0 1px #1f9bd9;
} // }
:deep(.el-input.is-disabled .el-input__wrapper) { // :deep(.el-input.is-disabled .el-input__wrapper) {
background-color: transparent; // background-color: transparent;
box-shadow: 0 0 0 1px #1f9bd9; // box-shadow: 0 0 0 1px #1f9bd9;
} // }
:deep(.el-textarea) { // :deep(.el-textarea) {
--el-input-bg-color: #071d4d; // --el-input-bg-color: #071d4d;
// --el-input-border-color: #071D4D;
}
:deep(.el-dialog__body) { // }
position: relative;
padding: 10px;
color: #fff;
}
:deep(.el-dialog) { // :deep(.el-dialog__body) {
--el-dialog-bg-color: #071d4d; // position: relative;
border: 3px solid #387dbf; // padding: 10px;
} // color: #fff;
// }
:deep(.el-dialog__header) { // :deep(.el-dialog) {
padding: 13px; // --el-dialog-bg-color: #071d4d;
border-bottom: 1px solid #3374b4 !important; // border: 3px solid #387dbf;
margin-right: 0px; // }
}
:deep(.el-dialog__title) { // :deep(.el-dialog__header) {
color: #067bc1 !important; // padding: 13px;
font-weight: 500; // border-bottom: 1px solid #3374b4 !important;
} // margin-right: 0px;
// }
:deep(.el-dialog__headerbtn .el-dialog__close) { // :deep(.el-dialog__title) {
color: #fff; // color: #067bc1 !important;
font-weight: 500; // font-weight: 500;
font-size: 18px; // }
}
// :deep(.el-dialog__headerbtn .el-dialog__close) {
// color: #fff;
// font-weight: 500;
// font-size: 18px;
// }
:deep(.el-tabs__nav-wrap::after) { :deep(.el-tabs__nav-wrap::after) {
background-color: #d9d9d95e; background-color: #d9d9d95e;
@ -1163,86 +1162,78 @@ const closeAddGroup = () => {
padding-left: 23px; padding-left: 23px;
} }
:deep(.el-input__wrapper) { // :deep(.el-input__wrapper) {
background-color: transparent; // background-color: transparent;
box-shadow: 0 0 0 1px #1f9bd9; // box-shadow: 0 0 0 1px #1f9bd9;
} // }
:deep(.el-select__wrapper) { // :deep(.el-select__wrapper) {
background-color: transparent; // background-color: transparent;
box-shadow: 0 0 0 1px #1f9bd9; // box-shadow: 0 0 0 1px #1f9bd9;
} // }
:deep(.el-input__inner) { // :deep(.el-input__inner) {
color: #fff; // color: #fff;
} // }
:deep(.el-input__prefix) { // :deep(.el-input__prefix) {
color: #fff; // color: #fff;
} // }
.el_button_ { // :deep(.el-button) {
// background-color: transparent;
// border-color: #0cd6fe;
// color: #000;
// }
} // :deep(.el-select__placeholder) {
// color: #fff;
// }
// :deep(.el-table) {
// --el-table-border-color: #1677ff40;
// }
:deep(.el-button) { // :deep(.el-table th.el-table__cell) {
background-color: transparent; // // background-color: #5C9AD5;
border-color: #0cd6fe; // }
color: #000;
}
:deep(.el-table) { // :deep(.el-table thead) {
--el-table-border-color: #1677ff40; // // color: #fff;
} // }
:deep(.el-select__placeholder) { // :deep(.el-table tr) {
color: #fff; // // background-color: #E9F0F8;
} // }
:deep(.el-table th.el-table__cell) { // :deep(.el-table__body tr.current-row > td) {
// background-color: #5C9AD5; // // background: #2cabff !important;
} // }
:deep(.el-table thead) { // :deep(.el-table--enable-row-hover .el-table__body tr:hover > td) {
// color: #fff; // // background-color: #13306A !important;
} // }
:deep(.el-table tr) { // :deep(.el-table th.el-table__cell) {
// background-color: #E9F0F8; // // background-color:#13306A;
} // }
:deep(.el-table__body tr.current-row > td) { // :deep(.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell) {
// background: #2cabff !important; // // background: #D1DEEE !important;
} // }
:deep(.el-table--enable-row-hover .el-table__body tr:hover > td) { // :deep(.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell) {
// background-color: #13306A !important; // // background-color: transparent;
} // }
:deep(.el-table th.el-table__cell) {
// background-color:#13306A;
}
:deep(.el-date-editor .el-range-input) {
color: #fff;
}
:deep(.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell) {
// background: #D1DEEE !important;
}
:deep(.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell) {
// background-color: transparent;
}
// :deep(.el-table th.el-table__cell) {
// background-color: #f5f7fa;
// }
:deep(.el-tabs) { :deep(.el-tabs) {
height: 100%; height: 100%;
} }
:deep(.el-date-editor .el-range-input) {
:deep(.el-table th.el-table__cell) { color: #fff;
background-color: #f5f7fa;
} }
:deep(.el-tabs__content) { :deep(.el-tabs__content) {
height: calc(100% - 53px); height: calc(100% - 53px);
} }
@ -1251,7 +1242,7 @@ const closeAddGroup = () => {
height: 100%; height: 100%;
} }
::-webkit-scrollbar { // ::-webkit-scrollbar {
background-color: #071d4d; // background-color: #071d4d;
} // }
</style> </style>