Compare commits
10 Commits
2aef20eabf
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
| c67b63b4f1 | |||
| 4518038d9e | |||
| 78c828763b | |||
| dcf680163a | |||
| b1ea8f2e5b | |||
| e561ef9e6d | |||
| b8c393f773 | |||
| f30a2d7411 | |||
| d2e4fc137d | |||
| c0ba4c7c49 |
@ -7,7 +7,6 @@
|
|||||||
</keep-alive>
|
</keep-alive>
|
||||||
</router-view>
|
</router-view>
|
||||||
<Fzq />
|
<Fzq />
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import Watermark from "@/components/Watermark.vue";
|
import Watermark from "@/components/Watermark.vue";
|
||||||
|
|||||||
BIN
src/assets/images/cjyp.mp3
Normal file
BIN
src/assets/images/cjyp.mp3
Normal file
Binary file not shown.
BIN
src/assets/images/xsyp.mp3
Normal file
BIN
src/assets/images/xsyp.mp3
Normal file
Binary file not shown.
BIN
src/assets/images/ypbg.mp3
Normal file
BIN
src/assets/images/ypbg.mp3
Normal file
Binary file not shown.
BIN
src/assets/images/ypzl.mp3
Normal file
BIN
src/assets/images/ypzl.mp3
Normal file
Binary file not shown.
240
src/components/common/TestDiv copy.vue
Normal file
240
src/components/common/TestDiv copy.vue
Normal file
@ -0,0 +1,240 @@
|
|||||||
|
<template>
|
||||||
|
<div class="test-div" v-if="dataList && dataList.length > 0">
|
||||||
|
<div class="test-header">
|
||||||
|
<span class="test-title">消息通知</span>
|
||||||
|
<div class="header-right">
|
||||||
|
<span class="test-countdown">{{ countdown }}s</span>
|
||||||
|
<el-icon class="close-icon" @click="handleClose">
|
||||||
|
<Close />
|
||||||
|
</el-icon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="test-content">
|
||||||
|
<Item v-for="(item, index) in dataList" :key="index" :item="item" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
// 测试div组件,用于在后台和大屏页面都显示
|
||||||
|
import { ref, onMounted, onUnmounted } from 'vue'
|
||||||
|
import { Close } from '@element-plus/icons-vue'
|
||||||
|
import WebSoketClass from '@/utils/webSocket.js'
|
||||||
|
import emitter from "@/utils/eventBus.js"; // 导入事件总线
|
||||||
|
import Item from './item.vue'
|
||||||
|
import { AudioPlayerClass } from '@/utils/audioPlayer.js'
|
||||||
|
const webSoket = new WebSoketClass()
|
||||||
|
const dataList = ref([])
|
||||||
|
const timekeeping = ref(null)
|
||||||
|
const countdown = ref(0) // 倒计时时间(秒)
|
||||||
|
|
||||||
|
// 音频播放器实例映射
|
||||||
|
const audioPlayers = ref({
|
||||||
|
'02': null, // 信息上报
|
||||||
|
'03': null, // 研判审批
|
||||||
|
'04': null, // 研判指令
|
||||||
|
'05': null // 线索下发
|
||||||
|
})
|
||||||
|
|
||||||
|
// 音频文件路径映射
|
||||||
|
const audioPaths = {
|
||||||
|
'02': require('@/assets/images/cjyp.mp3'),
|
||||||
|
'03': require('@/assets/images/ypbg.mp3'),
|
||||||
|
'04': require('@/assets/images/ypzl.mp3'),
|
||||||
|
'05': require('@/assets/images/xsyp.mp3')
|
||||||
|
}
|
||||||
|
|
||||||
|
// 初始化音频播放器
|
||||||
|
const initAudioPlayers = () => {
|
||||||
|
Object.keys(audioPaths).forEach(type => {
|
||||||
|
try {
|
||||||
|
audioPlayers.value[type] = new AudioPlayerClass()
|
||||||
|
audioPlayers.value[type].init(audioPaths[type], false)
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`初始化类型${type}的音频播放器失败:`, error)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 根据类型播放音频
|
||||||
|
const playAudioByType = (type) => {
|
||||||
|
if (audioPlayers.value[type]) {
|
||||||
|
try {
|
||||||
|
audioPlayers.value[type].play()
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`播放类型${type}的音频失败:`, error)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 手动关闭
|
||||||
|
const handleClose = () => {
|
||||||
|
if (timekeeping.value) {
|
||||||
|
clearInterval(timekeeping.value)
|
||||||
|
timekeeping.value = null
|
||||||
|
}
|
||||||
|
dataList.value = []
|
||||||
|
}
|
||||||
|
|
||||||
|
// 重置倒计时
|
||||||
|
const resetCountdown = () => {
|
||||||
|
if (timekeeping.value) {
|
||||||
|
clearInterval(timekeeping.value)
|
||||||
|
}
|
||||||
|
countdown.value = 15
|
||||||
|
timekeeping.value = setInterval(() => {
|
||||||
|
countdown.value--
|
||||||
|
if (countdown.value <= 0) {
|
||||||
|
clearInterval(timekeeping.value)
|
||||||
|
dataList.value = []
|
||||||
|
timekeeping.value = null
|
||||||
|
}
|
||||||
|
}, 1000)
|
||||||
|
}
|
||||||
|
onMounted(() => {
|
||||||
|
// 初始化音频播放器
|
||||||
|
initAudioPlayers()
|
||||||
|
|
||||||
|
emitter.on('webSocketMessage', (newsDate) => {
|
||||||
|
if (newsDate) {
|
||||||
|
dataList.value.unshift({...newsDate.data,typeMasgeLx:newsDate.type})
|
||||||
|
// 根据消息类型播放音频
|
||||||
|
playAudioByType(newsDate.type)
|
||||||
|
resetCountdown()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// 组件挂载时执行的操作
|
||||||
|
webSoket.connect()
|
||||||
|
console.log('组件挂载时执行的操作')
|
||||||
|
})
|
||||||
|
onUnmounted(() => {
|
||||||
|
webSoket.closeConnection()
|
||||||
|
emitter.off('webSocketMessage')
|
||||||
|
if (timekeeping.value) {
|
||||||
|
clearInterval(timekeeping.value)
|
||||||
|
}
|
||||||
|
// 销毁所有音频播放器实例
|
||||||
|
Object.values(audioPlayers.value).forEach(player => {
|
||||||
|
if (player) {
|
||||||
|
player.destroy()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// 组件卸载时执行的操作
|
||||||
|
console.log('组件卸载时执行的操作')
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.test-div {
|
||||||
|
width: 400px;
|
||||||
|
max-height: 250px;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 2%;
|
||||||
|
right: 2%;
|
||||||
|
z-index: 1999;
|
||||||
|
background: linear-gradient(135deg, #0a3b6d 0%, #1a5a9e 100%);
|
||||||
|
border: 1px solid rgba(0, 255, 255, 0.3);
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 8px 32px rgba(0, 255, 255, 0.3), 0 0 20px rgba(0, 255, 255, 0.1);
|
||||||
|
overflow: hidden;
|
||||||
|
animation: slideIn 0.3s ease-out;
|
||||||
|
|
||||||
|
@keyframes slideIn {
|
||||||
|
from {
|
||||||
|
transform: translateX(100%);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
transform: translateX(0);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 12px 16px;
|
||||||
|
background: rgba(0, 255, 255, 0.1);
|
||||||
|
border-bottom: 1px solid rgba(0, 255, 255, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-title {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #00ffff;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
text-shadow: 0 0 10px rgba(0, 255, 255, 0.7);
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
display: inline-block;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
background-color: #00ffff;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: 0 0 10px rgba(0, 255, 255, 0.8);
|
||||||
|
animation: pulse 1.5s ease-in-out infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
0%, 100% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale(1);
|
||||||
|
box-shadow: 0 0 10px rgba(0, 255, 255, 0.8);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 0.8;
|
||||||
|
transform: scale(1.2);
|
||||||
|
box-shadow: 0 0 20px rgba(0, 255, 255, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-right {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-countdown {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #00ffff;
|
||||||
|
background: rgba(0, 255, 255, 0.1);
|
||||||
|
padding: 4px 12px;
|
||||||
|
border: 1px solid rgba(0, 255, 255, 0.3);
|
||||||
|
border-radius: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
text-shadow: 0 0 5px rgba(0, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.close-icon {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #00ffff;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
padding: 4px;
|
||||||
|
border-radius: 4px;
|
||||||
|
text-shadow: 0 0 5px rgba(0, 255, 255, 0.5);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: rgba(0, 255, 255, 0.2);
|
||||||
|
transform: rotate(90deg);
|
||||||
|
box-shadow: 0 0 10px rgba(0, 255, 255, 0.8);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-content {
|
||||||
|
max-height: 150px;
|
||||||
|
overflow-y: auto;
|
||||||
|
padding: 12px;
|
||||||
|
scrollbar-width: none; /* Firefox */
|
||||||
|
-ms-overflow-style: none; /* IE and Edge */
|
||||||
|
|
||||||
|
&::-webkit-scrollbar {
|
||||||
|
display: none; /* Chrome, Safari and Opera */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
284
src/components/common/TestDiv.vue
Normal file
284
src/components/common/TestDiv.vue
Normal file
@ -0,0 +1,284 @@
|
|||||||
|
<template>
|
||||||
|
<div class="test-div" v-if="dataList && dataList.length > 0">
|
||||||
|
<div class="test-header">
|
||||||
|
<span class="test-title">消息通知</span>
|
||||||
|
<div class="header-right">
|
||||||
|
<span class="test-countdown">{{ countdown }}s</span>
|
||||||
|
<el-icon class="close-icon" @click="handleClose">
|
||||||
|
<Close />
|
||||||
|
</el-icon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="test-content">
|
||||||
|
<Item v-for="(item, index) in dataList" :key="index" :item="item" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
// 测试div组件,用于在后台和大屏页面都显示
|
||||||
|
import { ref, onMounted, onUnmounted } from 'vue'
|
||||||
|
import { Close } from '@element-plus/icons-vue'
|
||||||
|
import emitter from "@/utils/eventBus.js"; // 导入事件总线
|
||||||
|
import { qcckGet } from '@/api/qcckApi'
|
||||||
|
import Item from './item.vue'
|
||||||
|
import { AudioPlayerClass } from '@/utils/audioPlayer.js'
|
||||||
|
import {getItem} from '@/utils/storage.js'
|
||||||
|
const dataList = ref([])
|
||||||
|
const timekeeping = ref(null)
|
||||||
|
const countdown = ref(0) // 倒计时时间(秒)
|
||||||
|
|
||||||
|
// 音频播放器实例映射
|
||||||
|
const audioPlayers = ref({
|
||||||
|
'02': null, // 信息上报
|
||||||
|
'03': null, // 研判审批
|
||||||
|
'04': null, // 研判指令
|
||||||
|
'05': null // 线索下发
|
||||||
|
})
|
||||||
|
|
||||||
|
// 音频文件路径映射
|
||||||
|
const audioPaths = {
|
||||||
|
'02': require('@/assets/images/cjyp.mp3'),
|
||||||
|
'03': require('@/assets/images/ypbg.mp3'),
|
||||||
|
'04': require('@/assets/images/ypzl.mp3'),
|
||||||
|
'05': require('@/assets/images/xsyp.mp3')
|
||||||
|
}
|
||||||
|
|
||||||
|
// 初始化音频播放器
|
||||||
|
const initAudioPlayers = () => {
|
||||||
|
Object.keys(audioPaths).forEach(type => {
|
||||||
|
try {
|
||||||
|
audioPlayers.value[type] = new AudioPlayerClass()
|
||||||
|
audioPlayers.value[type].init(audioPaths[type], false)
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`初始化类型${type}的音频播放器失败:`, error)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 根据类型播放音频
|
||||||
|
const playAudioByType = (type) => {
|
||||||
|
if (audioPlayers.value[type]) {
|
||||||
|
try {
|
||||||
|
audioPlayers.value[type].play()
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`播放类型${type}的音频失败:`, error)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 手动关闭
|
||||||
|
const handleClose = () => {
|
||||||
|
if (timekeeping.value) {
|
||||||
|
clearInterval(timekeeping.value)
|
||||||
|
timekeeping.value = null
|
||||||
|
}
|
||||||
|
dataList.value = []
|
||||||
|
}
|
||||||
|
|
||||||
|
// 重置倒计时
|
||||||
|
const resetCountdown = () => {
|
||||||
|
if (timekeeping.value) {
|
||||||
|
clearInterval(timekeeping.value)
|
||||||
|
}
|
||||||
|
countdown.value = 15
|
||||||
|
timekeeping.value = setInterval(() => {
|
||||||
|
countdown.value--
|
||||||
|
if (countdown.value <= 0) {
|
||||||
|
clearInterval(timekeeping.value)
|
||||||
|
dataList.value = []
|
||||||
|
timekeeping.value = null
|
||||||
|
}
|
||||||
|
}, 1000)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 做一个定时器15s一次
|
||||||
|
const checkNews = ref(null)
|
||||||
|
const checkNewsInterval = 15000 // 15秒
|
||||||
|
checkNews.value = setInterval(() => {
|
||||||
|
dataModel()
|
||||||
|
}, checkNewsInterval)
|
||||||
|
onMounted(() => {
|
||||||
|
// 初始化音频播放器
|
||||||
|
initAudioPlayers()
|
||||||
|
emitter.on('webSocketMessage', (newsDate) => {
|
||||||
|
if (newsDate) {
|
||||||
|
dataList.value = newsDate
|
||||||
|
// dataList.value.unshift({...newsDate.data,typeMasgeLx:newsDate.type})
|
||||||
|
// 根据消息类型播放音频
|
||||||
|
playAudioByType(newsDate[0].typeMasgeLx)
|
||||||
|
resetCountdown()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
const idEntityCard = ref(getItem('idEntityCard'))
|
||||||
|
const dataModel = () => {
|
||||||
|
qcckGet({}, '/mosty-gsxt/dsjJbxx/message').then(res => {
|
||||||
|
if (res) {
|
||||||
|
const yjmasg = res.filter(item => item.type === '01')
|
||||||
|
if (yjmasg.length > 0) {
|
||||||
|
emitter.emit('openYp', yjmasg[0].obj); // 触发音频播放
|
||||||
|
} else {
|
||||||
|
const data=res.filter(item=>item.sfzList.includes(idEntityCard.value))
|
||||||
|
const infoMasge =data.map(item => {
|
||||||
|
return {
|
||||||
|
...item.obj,
|
||||||
|
typeMasgeLx: item.type
|
||||||
|
}
|
||||||
|
})
|
||||||
|
console.log(infoMasge);
|
||||||
|
emitter.emit('webSocketMessage', infoMasge)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// if (newsDate.type === '01') {
|
||||||
|
// // 触发音频播放
|
||||||
|
// console.log('触发音频播放');
|
||||||
|
// emitter.emit('openYp', newsDate.data); // 传递消息数据
|
||||||
|
// } else {
|
||||||
|
onUnmounted(() => {
|
||||||
|
emitter.off('webSocketMessage')
|
||||||
|
if (timekeeping.value) {
|
||||||
|
clearInterval(timekeeping.value)
|
||||||
|
}
|
||||||
|
// 销毁所有音频播放器实例
|
||||||
|
Object.values(audioPlayers.value).forEach(player => {
|
||||||
|
if (player) {
|
||||||
|
player.destroy()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// 清除定时器
|
||||||
|
if (checkNews.value) {
|
||||||
|
clearInterval(checkNews.value)
|
||||||
|
checkNews.value = null
|
||||||
|
}
|
||||||
|
// 组件卸载时执行的操作
|
||||||
|
console.log('组件卸载时执行的操作')
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.test-div {
|
||||||
|
width: 400px;
|
||||||
|
max-height: 250px;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 2%;
|
||||||
|
right: 2%;
|
||||||
|
z-index: 1999;
|
||||||
|
background: linear-gradient(135deg, #0a3b6d 0%, #1a5a9e 100%);
|
||||||
|
border: 1px solid rgba(0, 255, 255, 0.3);
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 8px 32px rgba(0, 255, 255, 0.3), 0 0 20px rgba(0, 255, 255, 0.1);
|
||||||
|
overflow: hidden;
|
||||||
|
animation: slideIn 0.3s ease-out;
|
||||||
|
|
||||||
|
@keyframes slideIn {
|
||||||
|
from {
|
||||||
|
transform: translateX(100%);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: translateX(0);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 12px 16px;
|
||||||
|
background: rgba(0, 255, 255, 0.1);
|
||||||
|
border-bottom: 1px solid rgba(0, 255, 255, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-title {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #00ffff;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
text-shadow: 0 0 10px rgba(0, 255, 255, 0.7);
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
display: inline-block;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
background-color: #00ffff;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: 0 0 10px rgba(0, 255, 255, 0.8);
|
||||||
|
animation: pulse 1.5s ease-in-out infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale(1);
|
||||||
|
box-shadow: 0 0 10px rgba(0, 255, 255, 0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
opacity: 0.8;
|
||||||
|
transform: scale(1.2);
|
||||||
|
box-shadow: 0 0 20px rgba(0, 255, 255, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-right {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-countdown {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #00ffff;
|
||||||
|
background: rgba(0, 255, 255, 0.1);
|
||||||
|
padding: 4px 12px;
|
||||||
|
border: 1px solid rgba(0, 255, 255, 0.3);
|
||||||
|
border-radius: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
text-shadow: 0 0 5px rgba(0, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.close-icon {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #00ffff;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
padding: 4px;
|
||||||
|
border-radius: 4px;
|
||||||
|
text-shadow: 0 0 5px rgba(0, 255, 255, 0.5);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: rgba(0, 255, 255, 0.2);
|
||||||
|
transform: rotate(90deg);
|
||||||
|
box-shadow: 0 0 10px rgba(0, 255, 255, 0.8);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-content {
|
||||||
|
max-height: 150px;
|
||||||
|
overflow-y: auto;
|
||||||
|
padding: 12px;
|
||||||
|
scrollbar-width: none;
|
||||||
|
/* Firefox */
|
||||||
|
-ms-overflow-style: none;
|
||||||
|
/* IE and Edge */
|
||||||
|
|
||||||
|
&::-webkit-scrollbar {
|
||||||
|
display: none;
|
||||||
|
/* Chrome, Safari and Opera */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
156
src/components/common/item.vue
Normal file
156
src/components/common/item.vue
Normal file
@ -0,0 +1,156 @@
|
|||||||
|
<template>
|
||||||
|
<div class="test-item" v-if="item.typeMasgeLx == '02'" @click="goDetail(item.id, item.typeMasgeLx)">
|
||||||
|
<div class="item-header">
|
||||||
|
<div class="item-title">{{ item.qbmc || '' }}</div>
|
||||||
|
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="item-message">{{ item.qbnr }}</div>
|
||||||
|
<div class="item-time">{{ item.xtCjsj || '' }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="test-item" v-if="item.typeMasgeLx == '03'" @click="goDetail(item.id, item.typeMasgeLx)">
|
||||||
|
<div class="item-header">
|
||||||
|
<div class="item-title">{{ item.bgmc || '' }}</div>
|
||||||
|
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="item-message" v-html="item.bgnr"></div>
|
||||||
|
<div class="item-time">{{ item.xtCjsj || '' }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="test-item" v-if="item.typeMasgeLx == '04'" @click="goDetail(item.id, item.typeMasgeLx)">
|
||||||
|
<div class="item-header">
|
||||||
|
<div class="item-title">{{ item.zlbt || '' }}</div>
|
||||||
|
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="item-message" v-html="item.zlnr"></div>
|
||||||
|
<div class="item-time">{{ item.xtCjsj || '' }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="test-item" v-if="item.typeMasgeLx == '05'" @click="goDetail(item.id, item.typeMasgeLx)">
|
||||||
|
<div class="item-header">
|
||||||
|
<div class="item-title">{{ item.zlbt || '' }}</div>
|
||||||
|
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="item-message" v-html="item.zlnr"></div>
|
||||||
|
<div class="item-time">{{ item.xtCjsj || '' }}</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
|
||||||
|
import { useRouter } from 'vue-router'
|
||||||
|
const router = useRouter()
|
||||||
|
const props = defineProps({
|
||||||
|
item: {
|
||||||
|
type: Object,
|
||||||
|
default: () => ({})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const informationMap = {
|
||||||
|
'01': '报警信息',
|
||||||
|
'02': '信息上报',
|
||||||
|
'03': '研判审批',
|
||||||
|
'04': '研判指令',
|
||||||
|
'05': '线索下发',
|
||||||
|
}
|
||||||
|
const emit=defineEmits(['goDetail'])
|
||||||
|
const goDetail = (id, lx) => {
|
||||||
|
let path = ''
|
||||||
|
switch (lx) {
|
||||||
|
case '02':
|
||||||
|
path = '/InfoCollection'
|
||||||
|
break;
|
||||||
|
case '03':
|
||||||
|
path = '/strategicResearchs'
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
case '04':
|
||||||
|
path = '/judgmentCommand'
|
||||||
|
break;
|
||||||
|
case '05':
|
||||||
|
path = '/InstructionInformation'
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
router.push({
|
||||||
|
path: path,
|
||||||
|
query: {
|
||||||
|
id: id
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.test-item {
|
||||||
|
background: rgba(10, 59, 109, 0.8);
|
||||||
|
border: 1px solid rgba(0, 255, 255, 0.3);
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 12px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 255, 255, 0.2);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 8px;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
transform: translateY(-2px);
|
||||||
|
box-shadow: 0 4px 12px rgba(0, 255, 255, 0.4);
|
||||||
|
border-color: rgba(0, 255, 255, 0.6);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-title {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #00ffff;
|
||||||
|
flex: 0 0 60%;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-shadow: 0 0 5px rgba(0, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-type {
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #00ffff;
|
||||||
|
background: linear-gradient(135deg, #00ffff 0%, #00aaff 100%);
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
background-clip: text;
|
||||||
|
flex: 1;
|
||||||
|
text-align: right;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-shadow: 0 0 5px rgba(0, 255, 255, 0.7);
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-message {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #cceeff;
|
||||||
|
line-height: 1.5;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
word-break: break-word;
|
||||||
|
margin: 4px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-time {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #66ccff;
|
||||||
|
text-align: right;
|
||||||
|
margin-top: 4px;
|
||||||
|
text-shadow: 0 0 3px rgba(0, 255, 255, 0.3);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -64,7 +64,6 @@ const startDrag = (e) => {
|
|||||||
// 处理移动
|
// 处理移动
|
||||||
const handleMove = (e) => {
|
const handleMove = (e) => {
|
||||||
if (!isDragging.value) return;
|
if (!isDragging.value) return;
|
||||||
|
|
||||||
let clientX, clientY;
|
let clientX, clientY;
|
||||||
if (e.type === 'mousemove') {
|
if (e.type === 'mousemove') {
|
||||||
clientX = e.clientX;
|
clientX = e.clientX;
|
||||||
|
|||||||
@ -11,6 +11,7 @@
|
|||||||
<AppMain />
|
<AppMain />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<TestDiv />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -20,6 +21,7 @@ import NavBar from "./components/NavBar";
|
|||||||
import SideBar from "./components/SideBar/index";
|
import SideBar from "./components/SideBar/index";
|
||||||
import AppMain from "./components/AppMain";
|
import AppMain from "./components/AppMain";
|
||||||
import TagsView from "./components/TagsView";
|
import TagsView from "./components/TagsView";
|
||||||
|
import TestDiv from "@/components/common/TestDiv.vue";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
// let url = "ws://80.155.0.82:8006/mosty-api/mosty-websocket/socket/"; //线上
|
// let url = "ws://80.155.0.82:8006/mosty-api/mosty-websocket/socket/"; //线上
|
||||||
let url = "ws://155.240.22.30:2109/mosty-api/mosty-websocket/socket/"; //线上
|
let url = "wss://sg.lz.dsj.xz/websocket/mosty-websocket/socket/"; //线上
|
||||||
|
|
||||||
if(process.env.NODE_ENV === 'development') {
|
if(process.env.NODE_ENV === 'development') {
|
||||||
url = "ws://47.108.232.77:9537/mosty-api/mosty-websocket/socket/"; //本地
|
url = "ws://47.108.232.77:9537/mosty-api/mosty-websocket/socket/"; //本地
|
||||||
|
|||||||
@ -15,9 +15,7 @@ import store from "@/store";
|
|||||||
* 私有路由表
|
* 私有路由表
|
||||||
*/
|
*/
|
||||||
|
|
||||||
export const privateRoutes = [
|
export const privateRoutes = [];
|
||||||
|
|
||||||
];
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 公开路由表
|
* 公开路由表
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
// let url = "ws://89.40.9.89:2109/mosty-api/mosty-websocket/socket/"; //线上
|
// let url = "ws://89.40.9.89:2109/mosty-api/mosty-websocket/socket/"; //线上
|
||||||
let url = "ws://155.240.22.30:2109/mosty-api/mosty-websocket/socket/"; //线上
|
let url = "ws://89.40.9.93:50039/mosty-websocket/socket/"; //线上
|
||||||
|
|
||||||
if (process.env.NODE_ENV === 'development') {
|
if (process.env.NODE_ENV === 'development') {
|
||||||
url = "ws://47.108.232.77:9537/mosty-api/mosty-websocket/socket/"; //本地
|
url = "ws://47.108.232.77:9537/mosty-api/mosty-websocket/socket/"; //本地
|
||||||
@ -86,8 +86,6 @@ class WebSoketClass {
|
|||||||
if (fun) fun(true);
|
if (fun) fun(true);
|
||||||
};
|
};
|
||||||
this.ws.onclose = (e) => {
|
this.ws.onclose = (e) => {
|
||||||
console.log(e);
|
|
||||||
|
|
||||||
console.log('WebSocket连接已关闭,关闭码:', e.code, '原因:', e.reason);
|
console.log('WebSocket连接已关闭,关闭码:', e.code, '原因:', e.reason);
|
||||||
// 如果是正常关闭(1000)或手动关闭(1001),不进行重连
|
// 如果是正常关闭(1000)或手动关闭(1001),不进行重连
|
||||||
if (e.code !== 1000 && e.code !== 1001) {
|
if (e.code !== 1000 && e.code !== 1001) {
|
||||||
@ -165,7 +163,6 @@ class WebSoketClass {
|
|||||||
// 接收发送消息
|
// 接收发送消息
|
||||||
getMessage() {
|
getMessage() {
|
||||||
this.ws.onmessage = (e) => {
|
this.ws.onmessage = (e) => {
|
||||||
console.log(e);
|
|
||||||
|
|
||||||
try {
|
try {
|
||||||
if (e.data) {
|
if (e.data) {
|
||||||
@ -175,6 +172,9 @@ class WebSoketClass {
|
|||||||
// 触发音频播放
|
// 触发音频播放
|
||||||
console.log('触发音频播放');
|
console.log('触发音频播放');
|
||||||
emitter.emit('openYp', newsDate.data); // 传递消息数据
|
emitter.emit('openYp', newsDate.data); // 传递消息数据
|
||||||
|
} else {
|
||||||
|
|
||||||
|
emitter.emit('webSocketMessage', { data: newsDate.data, type: newsDate.type });
|
||||||
}
|
}
|
||||||
// else if (newsDate.type === 'ALARM_STOP' || newsDate.type === 'warning_stop') {
|
// else if (newsDate.type === 'ALARM_STOP' || newsDate.type === 'warning_stop') {
|
||||||
// // 触发音频停止
|
// // 触发音频停止
|
||||||
@ -187,7 +187,7 @@ class WebSoketClass {
|
|||||||
// emitter.emit('statusUpdate', newsDate.data);
|
// emitter.emit('statusUpdate', newsDate.data);
|
||||||
// }
|
// }
|
||||||
// // 通用消息事件
|
// // 通用消息事件
|
||||||
// emitter.emit('webSocketMessage', newsDate);
|
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('处理WebSocket消息失败:', error);
|
console.error('处理WebSocket消息失败:', error);
|
||||||
|
|||||||
@ -3,27 +3,58 @@
|
|||||||
<div class="head_box">
|
<div class="head_box">
|
||||||
<span class="title">工作考核{{ title }} </span>
|
<span class="title">工作考核{{ title }} </span>
|
||||||
<div>
|
<div>
|
||||||
<el-button type="primary" size="small" :loading="loading" @click="submit" v-if="title !='详情'">保存</el-button>
|
<el-button type="primary" size="small" :loading="loading" @click="submit" v-if="title != '详情'">保存</el-button>
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
<el-button size="small" @click="close">关闭</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form_cnt">
|
<div class="form_cnt">
|
||||||
<FormMessage v-model="listQuery" :formList="formData" ref="elform" :rules="rules" :disabled="title =='详情'"></FormMessage>
|
<FormMessage v-model="listQuery" :formList="formData" ref="elform" :rules="rules" :disabled="title == '详情'">
|
||||||
|
<template #bkyj>
|
||||||
|
<el-divider content-position="left"><span style="color: blue;">布控预警</span></el-divider>
|
||||||
|
</template>
|
||||||
|
<template #clyj>
|
||||||
|
<el-divider content-position="left"><span style="color: blue;">车辆预警</span></el-divider>
|
||||||
|
</template>
|
||||||
|
<template #qlry>
|
||||||
|
<el-divider content-position="left"><span style="color: blue;">7类重点人员预警</span></el-divider>
|
||||||
|
</template>
|
||||||
|
<template #rxyj>
|
||||||
|
<el-divider content-position="left"><span style="color: blue;">人像预警</span></el-divider>
|
||||||
|
</template>
|
||||||
|
<template #zbyj>
|
||||||
|
<el-divider content-position="left"><span style="color: blue;">政保预警</span></el-divider>
|
||||||
|
</template>
|
||||||
|
<template #fs>
|
||||||
|
<el-divider content-position="left"><span style="color: blue;">考核分数</span></el-divider>
|
||||||
|
</template>
|
||||||
|
</FormMessage>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { IdCard } from "@/utils/validate.js";
|
|
||||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
import { qcckGet, qcckPost,qcckPut } from "@/api/qcckApi.js";
|
||||||
import * as rule from "@/utils/rules.js";
|
|
||||||
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, } from "vue";
|
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, } from "vue";
|
||||||
const emit = defineEmits(["updateDate"]);
|
const emit = defineEmits(["updateDate"]);
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
dic: Object
|
dic: Object
|
||||||
});
|
});
|
||||||
|
const listQuery = ref({
|
||||||
|
cjfs: 0,
|
||||||
|
ypfs: 0,
|
||||||
|
bkyjFkl: 0,
|
||||||
|
bkyjQsl: 0,
|
||||||
|
clyjFkl: 0,
|
||||||
|
clyjQsl: 0,
|
||||||
|
qlryFkl: 0,
|
||||||
|
qlryQsl: 0,
|
||||||
|
rxyjFkl: 0,
|
||||||
|
rxyjQsl: 0,
|
||||||
|
zbyjFkl: 0,
|
||||||
|
zbyjQsl: 0,
|
||||||
|
|
||||||
|
}); //表单
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const dialogForm = ref(false); //弹窗
|
const dialogForm = ref(false); //弹窗
|
||||||
const formData = ref([
|
const formData = ref([
|
||||||
@ -31,10 +62,27 @@ const formData = ref([
|
|||||||
{ label: "考核开始日期", prop: "ksrq", type: "date" },
|
{ label: "考核开始日期", prop: "ksrq", type: "date" },
|
||||||
{ label: "考核结束日期", prop: "jsrq", type: "date" },
|
{ label: "考核结束日期", prop: "jsrq", type: "date" },
|
||||||
{ label: "考核描述", prop: "khzbms", type: "textarea", width: "100%" },
|
{ label: "考核描述", prop: "khzbms", type: "textarea", width: "100%" },
|
||||||
|
{ prop: "fs", type: "slot", width: "100%" },
|
||||||
|
{ label: "采集分数", prop: "cjfs", type: "number", min: 0, max: 100, step: 1 },
|
||||||
|
{ label: "研判分数", prop: "ypfs", type: "number", min: 0, max: 100, step: 1 },
|
||||||
|
{ prop: "bkyj", type: "slot", width: "100%" },
|
||||||
|
{ label: "布控预警反馈率", prop: "bkyjFkl", type: "number", min: 0, max: 100, step: 0.01 },
|
||||||
|
{ label: "布控预警签收率", prop: "bkyjQsl", type: "number", min: 0, max: 100, step: 0.01 },
|
||||||
|
{ prop: "clyj", type: "slot", width: "100%" },
|
||||||
|
{ label: "车辆预警反馈率", prop: "clyjFkl", type: "number", min: 0, max: 100, step: 0.01 },
|
||||||
|
{ label: "车辆预警签收率", prop: "clyjQsl", type: "number", min: 0, max: 100, step: 0.01 },
|
||||||
|
{ prop: "qlry", type: "slot", width: "100%" },
|
||||||
|
{ label: "7类重点人员反馈率", prop: "qlryFkl", type: "number", min: 0, max: 100, step: 0.01 },
|
||||||
|
{ label: "7类重点人员签收率", prop: "qlryQsl", type: "number", min: 0, max: 100, step: 0.01 },
|
||||||
|
{ prop: "rxyj", type: "slot", width: "100%" },
|
||||||
|
{ label: "人像预警反馈率", prop: "rxyjFkl", type: "number", min: 0, max: 100, step: 0.01 },
|
||||||
|
{ label: "人像预警签收率", prop: "rxyjQsl", type: "number", min: 0, max: 100, step: 0.01 },
|
||||||
|
{ prop: "zbyj", type: "slot", width: "100%" },
|
||||||
|
{ label: "政保预警反馈率", prop: "zbyjFkl", type: "number", min: 0, max: 100, step: 0.01 },
|
||||||
|
{ label: "政保预警签收率", prop: "zbyjQsl", type: "number", min: 0, max: 100, step: 0.01 },
|
||||||
|
|
||||||
]);
|
]);
|
||||||
const listQuery = ref({}); //表单
|
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const elform = ref();
|
const elform = ref();
|
||||||
const title = ref("");
|
const title = ref("");
|
||||||
@ -66,12 +114,22 @@ const submit = () => {
|
|||||||
let params = { ...data };
|
let params = { ...data };
|
||||||
console.log(params);
|
console.log(params);
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
qcckPost(params, url).then(() => {
|
|
||||||
|
if (title.value == "新增") {
|
||||||
|
qcckPost(params, url).then(() => {
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
proxy.$message({ type: "success", message: title.value + "成功" });
|
proxy.$message({ type: "success", message: title.value + "成功" });
|
||||||
emit("updateDate");
|
emit("updateDate");
|
||||||
close();
|
close();
|
||||||
}).catch(() => { loading.value = false; });
|
}).catch(() => { loading.value = false; });
|
||||||
|
} else {
|
||||||
|
qcckPut(params, url).then(() => {
|
||||||
|
loading.value = false;
|
||||||
|
proxy.$message({ type: "success", message: title.value + "成功" });
|
||||||
|
emit("updateDate");
|
||||||
|
close();
|
||||||
|
}).catch(() => { loading.value = false; });
|
||||||
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -90,6 +148,6 @@ defineExpose({ init });
|
|||||||
@import "~@/assets/css/element-plus.scss";
|
@import "~@/assets/css/element-plus.scss";
|
||||||
|
|
||||||
::v-deep .el-textarea__inner {
|
::v-deep .el-textarea__inner {
|
||||||
height: 38.5em !important;
|
height: 18.5em !important;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -106,7 +106,11 @@ onMounted(() => {
|
|||||||
|
|
||||||
// 搜索
|
// 搜索
|
||||||
const onSearch = (val) => {
|
const onSearch = (val) => {
|
||||||
queryFrom.value = { ...val };
|
queryFrom.value = {
|
||||||
|
...val,
|
||||||
|
startTime: val.startTime ? val.startTime[0] : "",
|
||||||
|
endTime: val.startTime ? val.startTime[0] : ""
|
||||||
|
};
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
pageData.pageConfiger.pageCurrent = 1;
|
||||||
getList();
|
getList();
|
||||||
};
|
};
|
||||||
|
|||||||
@ -60,8 +60,10 @@ const pageData = reactive({
|
|||||||
tableColumn: [
|
tableColumn: [
|
||||||
{ label: "申请人姓名", prop: "xm" },
|
{ label: "申请人姓名", prop: "xm" },
|
||||||
{ label: "申请人身份证", prop: "sfzh"},
|
{ label: "申请人身份证", prop: "sfzh"},
|
||||||
{ label: "申请人联系电话", prop: "lxdh"},
|
{ label: "申请人联系电话", prop: "lxdh" },
|
||||||
{ label: "权限说明", prop: "qxsm" },
|
{ label: "提交人姓名", prop: "tjrxm"},
|
||||||
|
{ label: "提交人身份证号", prop: "tjrsfzh"},
|
||||||
|
{ label: "权限说明", prop: "qxsm", showOverflowTooltip: true },
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@ -11,7 +11,6 @@
|
|||||||
<FormMessage v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
|
<FormMessage v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
|
||||||
</FormMessage>
|
</FormMessage>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
@ -21,11 +20,12 @@ import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
|||||||
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, watch, computed } from "vue";
|
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, watch, computed } from "vue";
|
||||||
import { addJudgmentCommandList, editJudgmentCommand, getJudgmentCommandDetail } from "@/api/huiShangyp/judgmentCommand.js"
|
import { addJudgmentCommandList, editJudgmentCommand, getJudgmentCommandDetail } from "@/api/huiShangyp/judgmentCommand.js"
|
||||||
// import { getItem } from '@//utils/storage.js'
|
// import { getItem } from '@//utils/storage.js'
|
||||||
|
import { useRouter } from 'vue-router'
|
||||||
const emit = defineEmits(["updateDate", "getList"]);
|
const emit = defineEmits(["updateDate", "getList"]);
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
dict: Object
|
dict: Object
|
||||||
});
|
});
|
||||||
|
const router = useRouter()
|
||||||
const imgMsg = ref([])
|
const imgMsg = ref([])
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const dialogForm = ref(false); //弹窗
|
const dialogForm = ref(false); //弹窗
|
||||||
@ -118,6 +118,7 @@ const close = () => {
|
|||||||
listQuery.value = {};
|
listQuery.value = {};
|
||||||
dialogForm.value = false;
|
dialogForm.value = false;
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
|
router.replace({ path: '/judgmentCommand' })// 移除id 避免刷新一直带参数
|
||||||
};
|
};
|
||||||
|
|
||||||
defineExpose({ init });
|
defineExpose({ init });
|
||||||
|
|||||||
@ -61,18 +61,11 @@ import FeedbackDialog from "./components/FeedbackDialog.vue";
|
|||||||
import { getItem } from '@//utils/storage.js'
|
import { getItem } from '@//utils/storage.js'
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const { D_BZ_YPFS, D_BZ_YPLX } = proxy.$dict("D_BZ_YPFS", "D_BZ_YPLX")
|
const { D_BZ_YPFS, D_BZ_YPLX } = proxy.$dict("D_BZ_YPFS", "D_BZ_YPLX")
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
const searchBox = ref(); //搜索框
|
||||||
const userInfo = ref()
|
const userInfo = ref()
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
userInfo.value = getItem('deptId')[0]
|
userInfo.value = getItem('deptId')[0]
|
||||||
tabHeightFn()
|
tabHeightFn()
|
||||||
if (route.query.id) {
|
|
||||||
detailDiloag.value.init('edit', {
|
|
||||||
id: route.query.id
|
|
||||||
});
|
|
||||||
return
|
|
||||||
}
|
|
||||||
getList()
|
getList()
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -149,8 +142,13 @@ const tabHeightFn = () => {
|
|||||||
};
|
};
|
||||||
};
|
};
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
|
|
||||||
const addForm = ref(null)
|
const addForm = ref(null)
|
||||||
|
watch(() => route.query.id, (val) => {
|
||||||
|
console.log('val: ', val);
|
||||||
|
if (val) {
|
||||||
|
addForm.value.init('detail', {id:val}, '01');
|
||||||
|
}
|
||||||
|
},{deep:true});
|
||||||
const feedbackDialog = ref(false)
|
const feedbackDialog = ref(false)
|
||||||
const currentFeedbackRow = ref({})
|
const currentFeedbackRow = ref({})
|
||||||
const getDataById = (type, row) => {
|
const getDataById = (type, row) => {
|
||||||
|
|||||||
@ -98,7 +98,7 @@
|
|||||||
* @property {Array} fj - 附件数组
|
* @property {Array} fj - 附件数组
|
||||||
* @property {string} wcqk - 完成情况(01 准备中、02 已完成)
|
* @property {string} wcqk - 完成情况(01 准备中、02 已完成)
|
||||||
*/
|
*/
|
||||||
|
import { qcckGet } from "@/api/qcckApi.js";
|
||||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
import UploadFile from "@/components/MyComponents/Upload/index.vue";
|
import UploadFile from "@/components/MyComponents/Upload/index.vue";
|
||||||
// import ChooseUser from "@/components/ChooseList/ChooseUser/index.vue"
|
// import ChooseUser from "@/components/ChooseList/ChooseUser/index.vue"
|
||||||
@ -214,12 +214,13 @@ watch(() => listQuery.value.jsdxBmDm, (val) => {
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
// 初始化数据
|
// 初始化数据
|
||||||
|
|
||||||
const init = (type, row, wjlb) => {
|
const init = (type, row, wjlb) => {
|
||||||
dialogForm.value = true;
|
dialogForm.value = true;
|
||||||
title.value = type == "add" ? "新增" : type == "edit" ? "编辑" : "详情";
|
title.value = type == "add" ? "新增" : type == "edit" ? "编辑" : "详情";
|
||||||
outRow.value = row
|
outRow.value = row
|
||||||
if (row) {
|
if (row) {
|
||||||
getDataById(row.id)
|
getDataById(row.id )
|
||||||
} else {
|
} else {
|
||||||
listQuery.value = {
|
listQuery.value = {
|
||||||
bglx: props.bglx, // 报告类型 01 战术研判 02战略研判
|
bglx: props.bglx, // 报告类型 01 战术研判 02战略研判
|
||||||
@ -232,7 +233,7 @@ const init = (type, row, wjlb) => {
|
|||||||
};
|
};
|
||||||
// 根据id查询详情
|
// 根据id查询详情
|
||||||
const getDataById = (id) => {
|
const getDataById = (id) => {
|
||||||
sjzlGetInfo(id).then((res) => {
|
qcckGet({},'/mosty-gsxt/gsxtYpbg/'+id).then((res) => {
|
||||||
listQuery.value = res || {};
|
listQuery.value = res || {};
|
||||||
/** @type {Array<JudgmentDept>} 参与研判部门数据数组 */
|
/** @type {Array<JudgmentDept>} 参与研判部门数据数组 */
|
||||||
const cyypList = Array.isArray(res.cyypList) ? res.cyypList : []
|
const cyypList = Array.isArray(res.cyypList) ? res.cyypList : []
|
||||||
|
|||||||
@ -47,6 +47,7 @@ import ExtractionText from "@/components/ExtractionText/index.vue";
|
|||||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
||||||
import "@wangeditor/editor/dist/css/style.css";
|
import "@wangeditor/editor/dist/css/style.css";
|
||||||
|
import { useRoute, useRouter } from 'vue-router'
|
||||||
// import Consultation from './consultation.vue'
|
// import Consultation from './consultation.vue'
|
||||||
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
|
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
|
||||||
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, shallowRef, onBeforeUnmount, watch } from "vue";
|
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, shallowRef, onBeforeUnmount, watch } from "vue";
|
||||||
@ -117,12 +118,33 @@ const elform = ref();
|
|||||||
const title = ref("");
|
const title = ref("");
|
||||||
|
|
||||||
// 初始化数据
|
// 初始化数据
|
||||||
const init = (type, row) => {
|
const init = (type, row) => {
|
||||||
if(row) listQuery.value = JSON.parse(JSON.stringify(row));
|
|
||||||
dialogForm.value = true;
|
dialogForm.value = true;
|
||||||
title.value = type == "add" ? "新增" :type == "edit"? "编辑" : "详情";
|
title.value = type == "add" ? "新增" :type == "edit"? "编辑" : "详情";
|
||||||
|
|
||||||
|
|
||||||
|
if (row) {
|
||||||
|
getDataById(row.id)
|
||||||
|
}
|
||||||
|
// listQuery.value = JSON.parse(JSON.stringify(row));
|
||||||
|
|
||||||
setEditorTextContent()
|
setEditorTextContent()
|
||||||
};
|
};
|
||||||
|
// 根据id查询详情
|
||||||
|
const getDataById = (id) => {
|
||||||
|
qcckGet({},'/mosty-gsxt/gsxtYpbg/'+id).then((res) => {
|
||||||
|
listQuery.value = res || {};
|
||||||
|
// /** @type {Array<JudgmentDept>} 参与研判部门数据数组 */
|
||||||
|
// const cyypList = Array.isArray(res.cyypList) ? res.cyypList : []
|
||||||
|
// listQuery.value.jsdxBmDm = cyypList.map(item => {
|
||||||
|
// return item.ypbmdm
|
||||||
|
// })
|
||||||
|
// listQuery.value.jsdxBmMc = cyypList.map(item => {
|
||||||
|
// return item.ypbmmc
|
||||||
|
// })
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
const getText = (val) => {
|
const getText = (val) => {
|
||||||
listQuery.value.fj = val.text;
|
listQuery.value.fj = val.text;
|
||||||
setEditorTextContent()
|
setEditorTextContent()
|
||||||
@ -183,12 +205,13 @@ onBeforeUnmount(() => {
|
|||||||
if (editor) editor.destroy();
|
if (editor) editor.destroy();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const router = useRouter();
|
||||||
// 关闭
|
// 关闭
|
||||||
const close = () => {
|
const close = () => {
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
dialogForm.value = false;
|
dialogForm.value = false;
|
||||||
listQuery.value = {}
|
listQuery.value = {}
|
||||||
|
router.replace({ path: '/strategicResearchs' })// 移除id 避免刷新一直带参数
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -65,28 +65,25 @@ import AddForm from "./addForm.vue";
|
|||||||
import addMeeting from "./addMeeting.vue";
|
import addMeeting from "./addMeeting.vue";
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const { D_BZ_YPFS, D_BZ_YPLX, D_GS_BQ_LX } = proxy.$dict("D_BZ_YPFS", "D_BZ_YPLX", "D_GS_BQ_LX")
|
const { D_BZ_YPFS, D_BZ_YPLX, D_GS_BQ_LX } = proxy.$dict("D_BZ_YPFS", "D_BZ_YPLX", "D_GS_BQ_LX")
|
||||||
|
|
||||||
/** 报告弹框 */
|
/** 报告弹框 */
|
||||||
const reportTc = ref();
|
const reportTc = ref();
|
||||||
/** 会议弹框 */
|
/** 会议弹框 */
|
||||||
const meetingTc = ref();
|
const meetingTc = ref();
|
||||||
const searchBox = ref(); //搜索框
|
const searchBox = ref(); //搜索框
|
||||||
const router = useRouter();
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
tabHeightFn()
|
tabHeightFn()
|
||||||
if (route.query.id) {
|
|
||||||
nextTick(() => {
|
|
||||||
addForm.value && addForm.value.init('edit', {
|
|
||||||
id: route.query.id
|
|
||||||
});
|
|
||||||
router.replace({ path: '/tacticalResearch' })// 移除id 避免刷新一直带参数
|
|
||||||
})
|
|
||||||
}
|
|
||||||
getList()
|
getList()
|
||||||
});
|
});
|
||||||
|
watch(() => route.query.id, (val) => {
|
||||||
|
if (val) {
|
||||||
|
nextTick(() => {
|
||||||
|
reportTc.value && reportTc.value.init('edit', {
|
||||||
|
id: val
|
||||||
|
});
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},{deep:true});
|
||||||
|
|
||||||
|
|
||||||
// 提交审核
|
// 提交审核
|
||||||
|
|||||||
@ -19,7 +19,7 @@
|
|||||||
</FormMessage>
|
</FormMessage>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="title == '详情'" class="timeline-container">
|
<div v-if="title == '详情'" class="timeline-container">
|
||||||
<el-timeline class="timeline-wrapper" v-if="listQuery.czlcLis&&listQuery.czlcList.length > 0">
|
<el-timeline class="timeline-wrapper" v-if="listQuery.czlcLis && listQuery.czlcList.length > 0">
|
||||||
<el-timeline-item placement="top" v-for="(activity, index) in listQuery.czlcList" :key="index"
|
<el-timeline-item placement="top" v-for="(activity, index) in listQuery.czlcList" :key="index"
|
||||||
:timestamp="activity.czsj" :color="activity.czlx == '01' ? '#409eff' : '#67c23a'" size="large">
|
:timestamp="activity.czsj" :color="activity.czlx == '01' ? '#409eff' : '#67c23a'" size="large">
|
||||||
<div class="timeline-content" :class="activity.czlx == '01' ? 'sign-type' : 'feedback-type'">
|
<div class="timeline-content" :class="activity.czlx == '01' ? 'sign-type' : 'feedback-type'">
|
||||||
@ -50,28 +50,40 @@
|
|||||||
import Xslist from '@/components/ChooseList/ChooseXs/index.vue'
|
import Xslist from '@/components/ChooseList/ChooseXs/index.vue'
|
||||||
import FormMessage from '@/components/aboutTable/FormMessage.vue'
|
import FormMessage from '@/components/aboutTable/FormMessage.vue'
|
||||||
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
||||||
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, nextTick } from "vue";
|
import { useRouter } from 'vue-router'
|
||||||
|
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, nextTick ,watch} from "vue";
|
||||||
const emit = defineEmits(["updateDate"]);
|
const emit = defineEmits(["updateDate"]);
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
dic: Object
|
dic: {
|
||||||
|
type: Object,
|
||||||
|
default: () => ({})
|
||||||
|
}
|
||||||
});
|
});
|
||||||
const chooseVisible = ref(false)
|
const chooseVisible = ref(false)
|
||||||
const roleIds = ref([])
|
const roleIds = ref([])
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const dialogForm = ref(false); //弹窗
|
const dialogForm = ref(false); //弹窗
|
||||||
const formData = ref([
|
|
||||||
{ label: "指令标题", prop: "zlbt", type: "input", },
|
const formData = ref()
|
||||||
{ label: "指令类型", prop: "zllx", type: "select", options: props.dic.D_GS_XS_ZLLX },
|
|
||||||
{ label: "指令等级", prop: "zldj", type: "select", options: props.dic.D_GS_ZDQT_FXDJ },
|
watch(() => props.dic, (newVal) => {
|
||||||
{ label: "反馈结束时间", prop: "jssj", type: "datetime" },
|
if (newVal) {
|
||||||
{ label: "联系人", prop: "zllxr", type: "input" },
|
formData.value = [
|
||||||
{ label: "联系电话", prop: "zllxdh", type: "input" },
|
{ label: "指令标题", prop: "zlbt", type: "input", },
|
||||||
{ label: "关联线索", prop: "glxsid", type: "slot" },
|
{ label: "指令类型", prop: "zllx", type: "select", options: props.dic.D_GS_XS_ZLLX },
|
||||||
{ label: "主送单位", prop: "zsdw", type: "department" },
|
{ label: "指令等级", prop: "zldj", type: "select", options: props.dic.D_GS_ZDQT_FXDJ },
|
||||||
{ label: "抄送单位", prop: "csdw", type: "department" },
|
{ label: "反馈结束时间", prop: "jssj", type: "datetime" },
|
||||||
{ label: "指令内容", prop: "zlnr", type: "textarea", width: '100%' },
|
{ label: "联系人", prop: "zllxr", type: "input" },
|
||||||
{ label: "附件", prop: "fjzd", type: "upload", width: '100%' },
|
{ label: "联系电话", prop: "zllxdh", type: "input" },
|
||||||
]);
|
{ label: "关联线索", prop: "glxsid", type: "slot" },
|
||||||
|
{ label: "主送单位", prop: "zsdw", type: "department" },
|
||||||
|
{ label: "抄送单位", prop: "csdw", type: "department" },
|
||||||
|
{ label: "指令内容", prop: "zlnr", type: "textarea", width: '100%' },
|
||||||
|
{ label: "附件", prop: "fjzd", type: "upload", width: '100%' },
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},{deep: true})
|
||||||
|
|
||||||
const listQuery = ref({}); //表单
|
const listQuery = ref({}); //表单
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const elform = ref();
|
const elform = ref();
|
||||||
@ -129,12 +141,13 @@ const submit = () => {
|
|||||||
}).catch(() => { loading.value = false; });
|
}).catch(() => { loading.value = false; });
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
const router = useRouter()
|
||||||
// 关闭
|
// 关闭
|
||||||
const close = () => {
|
const close = () => {
|
||||||
listQuery.value = {};
|
listQuery.value = {};
|
||||||
dialogForm.value = false;
|
dialogForm.value = false;
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
|
router.replace({ path: '/InstructionInformation' })// 移除id 避免刷新一直带参数
|
||||||
};
|
};
|
||||||
defineExpose({ init });
|
defineExpose({ init });
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -58,8 +58,8 @@
|
|||||||
></Pages>
|
></Pages>
|
||||||
</div>
|
</div>
|
||||||
<!-- 详情 -->
|
<!-- 详情 -->
|
||||||
<DetailForm ref="detailDiloag" v-if="isShow" @updateDate="getList" :dic="{D_GS_XS_ZLLX,D_GS_ZDQT_FXDJ}" />
|
|
||||||
</div>
|
</div>
|
||||||
|
<DetailForm ref="detailDiloag" @updateDate="getList" :dic="{D_GS_XS_ZLLX,D_GS_ZDQT_FXDJ}" />
|
||||||
<Fk v-model="isShowFk" :dataList="dataList" @getList="getList"/>
|
<Fk v-model="isShowFk" :dataList="dataList" @getList="getList"/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -71,7 +71,8 @@ import Search from "@/components/aboutTable/Search.vue";
|
|||||||
import DetailForm from "./components/detailForm.vue";
|
import DetailForm from "./components/detailForm.vue";
|
||||||
import Fk from "./components/fk.vue";
|
import Fk from "./components/fk.vue";
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
||||||
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
|
import { useRoute } from "vue-router";
|
||||||
|
import { reactive, ref, onMounted, getCurrentInstance, nextTick, watch } from "vue";
|
||||||
import { getItem } from '@/utils/storage'
|
import { getItem } from '@/utils/storage'
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const {D_GS_XS_SJLY,D_GS_XS_ZLLX,D_GS_ZDQT_FXDJ,D_GS_XS_CZZT} = proxy.$dict('D_GS_XS_SJLY','D_GS_XS_ZLLX','D_GS_ZDQT_FXDJ','D_GS_XS_CZZT')
|
const {D_GS_XS_SJLY,D_GS_XS_ZLLX,D_GS_ZDQT_FXDJ,D_GS_XS_CZZT} = proxy.$dict('D_GS_XS_SJLY','D_GS_XS_ZLLX','D_GS_ZDQT_FXDJ','D_GS_XS_CZZT')
|
||||||
@ -110,14 +111,20 @@ const pageData = reactive({
|
|||||||
{ label: '是否反馈', prop: 'sffk', showSolt: true },
|
{ label: '是否反馈', prop: 'sffk', showSolt: true },
|
||||||
{ label: '是否签收', prop: 'sfqs', showSolt: true },
|
{ label: '是否签收', prop: 'sfqs', showSolt: true },
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
|
const route=useRoute()
|
||||||
const userInfo=ref();
|
const userInfo=ref();
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
if (route.query.id) {
|
||||||
|
addEdit('detail', {id:route.query.id});
|
||||||
|
}
|
||||||
userInfo.value=getItem('deptId')[0]
|
userInfo.value=getItem('deptId')[0]
|
||||||
getList()
|
getList()
|
||||||
tabHeightFn();
|
tabHeightFn();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// 搜索
|
// 搜索
|
||||||
const onSearch = (val) =>{
|
const onSearch = (val) =>{
|
||||||
queryFrom.value = {...val}
|
queryFrom.value = {...val}
|
||||||
@ -166,6 +173,12 @@ const addEdit = (type, row) => {
|
|||||||
detailDiloag.value.init(type, row);
|
detailDiloag.value.init(type, row);
|
||||||
})
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
|
watch(() => route.query.id, (val) => {
|
||||||
|
if (val) {
|
||||||
|
addEdit('detail', {id:route.query.id});
|
||||||
|
}
|
||||||
|
},{deep:true})
|
||||||
// 签收
|
// 签收
|
||||||
const signRow = (row) =>{
|
const signRow = (row) =>{
|
||||||
proxy.$confirm("确定要签收", "警告", {type: "warning"}).then(() => {
|
proxy.$confirm("确定要签收", "警告", {type: "warning"}).then(() => {
|
||||||
@ -189,8 +202,6 @@ const fkRow = (row) => {
|
|||||||
}
|
}
|
||||||
const showBtn = (row) => {
|
const showBtn = (row) => {
|
||||||
let item = row.xfbmList.find(v => v.ssbmdm == userInfo.value.deptCode)
|
let item = row.xfbmList.find(v => v.ssbmdm == userInfo.value.deptCode)
|
||||||
console.log(item);
|
|
||||||
|
|
||||||
return item?true:false
|
return item?true:false
|
||||||
// // if (item) {
|
// // if (item) {
|
||||||
// // return item.zlzt == '01' ? 'sign' : item.zlzt == '02' ? 'feedback' : ''
|
// // return item.zlzt == '01' ? 'sign' : item.zlzt == '02' ? 'feedback' : ''
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<el-dialog title="权限申请" v-model="showDialog" width="500px" :close-on-click-modal="false" :close-on-press-escape="false" :show-close="false" >
|
<el-dialog title="权限申请" v-model="showDialog" width="500px" :close-on-click-modal="false" :close-on-press-escape="false" :show-close="true" >
|
||||||
<el-form :model="listQuery" label-width="120px" :rules="rules" ref="formRef">
|
<el-form :model="listQuery" label-width="120px" :rules="rules" ref="formRef">
|
||||||
<el-form-item label="申请人姓名" prop="xm">
|
<el-form-item label="申请人姓名" prop="xm">
|
||||||
<el-input placeholder="请输入申请人姓名" v-model="listQuery.xm" clearable></el-input>
|
<el-input placeholder="请输入申请人姓名" v-model="listQuery.xm" clearable></el-input>
|
||||||
@ -14,6 +14,13 @@
|
|||||||
<el-form-item label="权限说明" prop="qxsm">
|
<el-form-item label="权限说明" prop="qxsm">
|
||||||
<el-input placeholder="请输入权限说明" v-model="listQuery.qxsm" clearable type="textarea" :rows="3"></el-input>
|
<el-input placeholder="请输入权限说明" v-model="listQuery.qxsm" clearable type="textarea" :rows="3"></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="提交人姓名">
|
||||||
|
<el-input placeholder="请输入提交人姓名" v-model="listQuery.tjrxm" clearable readonly></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="提交人身份证">
|
||||||
|
<el-input placeholder="请输入申请人身份证" v-model="listQuery.tjrsfzh" clearable readonly></el-input>
|
||||||
|
</el-form-item>
|
||||||
<div class="tc">
|
<div class="tc">
|
||||||
<el-button type="primary" :loading="loading" @click="okSubit">确定</el-button>
|
<el-button type="primary" :loading="loading" @click="okSubit">确定</el-button>
|
||||||
<el-button @click="reset()"> 重置 </el-button>
|
<el-button @click="reset()"> 重置 </el-button>
|
||||||
@ -30,8 +37,10 @@ import emitter from "@/utils/eventBus.js";
|
|||||||
import { onMounted, ref,onUnmounted } from 'vue'
|
import { onMounted, ref,onUnmounted } from 'vue'
|
||||||
const showDialog = ref(false)
|
const showDialog = ref(false)
|
||||||
const listQuery = ref({
|
const listQuery = ref({
|
||||||
xm: getItem("USERNAME") || '',
|
tjrxm: getItem("USERNAME") || '',
|
||||||
sfzh: getItem("idEntityCard") || '',
|
tjrsfzh: getItem("idEntityCard") || '',
|
||||||
|
xm: '',
|
||||||
|
sfzh: '',
|
||||||
lxdh: '',
|
lxdh: '',
|
||||||
qxsm: '',
|
qxsm: '',
|
||||||
})
|
})
|
||||||
|
|||||||
@ -134,29 +134,29 @@ const getDepId = () => {
|
|||||||
const deptCode = deptId[0].deptCode ? deptId[0].deptCode : null
|
const deptCode = deptId[0].deptCode ? deptId[0].deptCode : null
|
||||||
if (deptLevel.startsWith('2')) {
|
if (deptLevel.startsWith('2')) {
|
||||||
const data = Object.values(bm).map(item => item);
|
const data = Object.values(bm).map(item => item);
|
||||||
changeXzqh(data, true)
|
changeXzqh(data, true);
|
||||||
} else {
|
} else {
|
||||||
switch (deptCode) {
|
switch (deptCode) {
|
||||||
case '54040200000'://巴宜区
|
case '54040200000'://巴宜区
|
||||||
changeXzqh(bm[542621])
|
changeXzqh(bm[542621]);
|
||||||
break;
|
break;
|
||||||
case '54042400000'://波密县
|
case '54042400000'://波密县
|
||||||
changeXzqh(bm[542625])
|
changeXzqh(bm[542625]);
|
||||||
break;
|
break;
|
||||||
case '54042500000'://察隅县
|
case '54042500000'://察隅县
|
||||||
changeXzqh(bm[542626])
|
changeXzqh(bm[542626]);
|
||||||
break;
|
break;
|
||||||
case '54042100000'://工布江达县
|
case '54042100000'://工布江达县
|
||||||
changeXzqh(bm[542622])
|
changeXzqh(bm[542622]);
|
||||||
break;
|
break;
|
||||||
case '54042600000'://朗县
|
case '54042600000'://朗县
|
||||||
changeXzqh(bm[542627])
|
changeXzqh(bm[542627]);
|
||||||
break;
|
break;
|
||||||
case '54042200000'://米林县
|
case '54042200000'://米林县
|
||||||
changeXzqh(bm[542623])
|
changeXzqh(bm[542623]);
|
||||||
break;
|
break;
|
||||||
case '54042300000'://墨脱县
|
case '54042300000'://墨脱县
|
||||||
changeXzqh(bm[542624])
|
changeXzqh(bm[542624]);
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
const data = Object.values(bm).map(item => item);
|
const data = Object.values(bm).map(item => item);
|
||||||
|
|||||||
@ -1,7 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="homeBox" style="background-color: #07274d;">
|
<div class="homeBox" style="background-color: #07274d;">
|
||||||
<!-- 头部 -->
|
<!-- 头部 -->
|
||||||
|
|
||||||
<Head></Head>
|
<Head></Head>
|
||||||
<!-- 左边 -->
|
<!-- 左边 -->
|
||||||
<div class="home-aside asideL">
|
<div class="home-aside asideL">
|
||||||
@ -59,15 +58,13 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- 中间 -->
|
<!-- 中间 -->
|
||||||
<div class="home-center">
|
<div class="home-center">
|
||||||
<div class="middle-top">
|
<div class="middle-top"><Yszs /></div>
|
||||||
<Yszs />
|
|
||||||
</div>
|
|
||||||
<div class="flex middle-bottom mt10">
|
<div class="flex middle-bottom mt10">
|
||||||
<div style="width: 30px;position: absolute;z-index: 100;left: 0;background-color: #07274d;height: 30px;text-align: center;line-height:30px;">
|
<div style="width: 30px;position: absolute;z-index: 100;left: 0;background-color: #07274d;height: 30px;text-align: center;line-height:30px;">
|
||||||
<el-icon :size="20" v-if="ispLayBack" @click="closeLayBack">
|
<el-icon :size="20" v-if="ispLayBack" @click="closeLayBack">
|
||||||
<Bell />
|
<Bell />
|
||||||
</el-icon>
|
</el-icon>
|
||||||
<el-icon :size="20" v-else @click="openLayBack">
|
<el-icon :size="20" v-else @click="ispLayBack=true">
|
||||||
<MuteNotification />
|
<MuteNotification />
|
||||||
</el-icon>
|
</el-icon>
|
||||||
</div>
|
</div>
|
||||||
@ -124,13 +121,12 @@
|
|||||||
<Bkcz></Bkcz>
|
<Bkcz></Bkcz>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<TestDiv />
|
||||||
<!-- 左边弹窗 -->
|
<!-- 左边弹窗 -->
|
||||||
<LeftDialog></LeftDialog>
|
<LeftDialog></LeftDialog>
|
||||||
<!-- 人员弹窗 -->
|
<!-- 人员弹窗 -->
|
||||||
<PeoDialog ref="peoDialogRef"></PeoDialog>
|
<PeoDialog ref="peoDialogRef"></PeoDialog>
|
||||||
|
|
||||||
<!-- 权限申请 -->
|
<!-- 权限申请 -->
|
||||||
<QxsqDialog />
|
<QxsqDialog />
|
||||||
</template>
|
</template>
|
||||||
@ -160,24 +156,32 @@ import WarningDistrict from './model/WarningDistrict.vue'
|
|||||||
import WarningPoints from './model/warningPoints.vue'
|
import WarningPoints from './model/warningPoints.vue'
|
||||||
import { getItem, setItem } from "@/utils/storage";
|
import { getItem, setItem } from "@/utils/storage";
|
||||||
import emitter from "@/utils/eventBus.js";
|
import emitter from "@/utils/eventBus.js";
|
||||||
import { bm, centralPoint } from '@/views/backOfficeSystem/IntelligentControl/DeploymentArea/xzqh.js'
|
import { bm } from '@/views/backOfficeSystem/IntelligentControl/DeploymentArea/xzqh.js'
|
||||||
import Judgment from './model/judgment.vue'
|
import Judgment from './model/judgment.vue'
|
||||||
import { tbYjxxGetList } from '@/api/zdr.js'
|
import { tbYjxxGetList } from '@/api/zdr.js'
|
||||||
import GeneralWindow from './model/generalWindow.vue'
|
import GeneralWindow from './model/generalWindow.vue'
|
||||||
import WebSoketClass from '@/utils/webSocket.js'
|
|
||||||
import { timeValidate } from '@/utils/tools.js'
|
import { timeValidate } from '@/utils/tools.js'
|
||||||
import Statistics from './model/statistics.vue'
|
import Statistics from './model/statistics.vue'
|
||||||
import MyCase from './model/myCase.vue'
|
import MyCase from './model/myCase.vue'
|
||||||
// 导入音频播放器工具类
|
// 导入音频播放器工具类
|
||||||
import audioPlayer from '@/utils/audioPlayer'
|
import audioPlayer from '@/utils/audioPlayer'
|
||||||
|
import TestDiv from "@/components/common/TestDiv.vue";
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const { D_BZ_JQDJ } = proxy.$dict('D_BZ_JQDJ')
|
|
||||||
const webSoket = new WebSoketClass()
|
|
||||||
const modelWarning = ref(true)
|
const modelWarning = ref(true)
|
||||||
const modelQbsb = ref(true)
|
const modelQbsb = ref(true)
|
||||||
const searchText = ref('')
|
const searchText = ref('')
|
||||||
const peoDialogRef = ref()
|
const peoDialogRef = ref()
|
||||||
const showSeatch = ref(false)
|
const showSeatch = ref(false)
|
||||||
|
const ispLayBack = ref(true)//播放音频
|
||||||
|
const indexNum = ref(0) //当前展示的气泡框
|
||||||
|
const showNotification = ref(false) //是否自动展开提示
|
||||||
|
const allDep = ref([]) //所有部门
|
||||||
|
const bnTimer = ref(null)
|
||||||
|
const popupTimer = ref(null)
|
||||||
|
const timing = ref(true)
|
||||||
|
const reversalPushShow = ref(true)// 情报翻转
|
||||||
|
const reversalShow = ref(true)// 论坛翻转
|
||||||
|
|
||||||
const changeXzqh = (val, trg) => {
|
const changeXzqh = (val, trg) => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
// 先移除已有的边界
|
// 先移除已有的边界
|
||||||
@ -265,10 +269,6 @@ const getDepId = () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const indexNum = ref(0) //当前展示的气泡框
|
|
||||||
const showNotification = ref(false) //是否自动展开提示
|
|
||||||
const allDep = ref([]) //所有部门
|
|
||||||
|
|
||||||
const handleOpenNotification = () => {
|
const handleOpenNotification = () => {
|
||||||
clearInterval(popupTimer.value)
|
clearInterval(popupTimer.value)
|
||||||
showNotification.value = !showNotification.value;
|
showNotification.value = !showNotification.value;
|
||||||
@ -283,6 +283,7 @@ const handleOpenNotification = () => {
|
|||||||
startPopupLoop()
|
startPopupLoop()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const makerCenter = () => {
|
const makerCenter = () => {
|
||||||
const dw = require("@/assets/point/dingwei.png")
|
const dw = require("@/assets/point/dingwei.png")
|
||||||
qcckGet({}, '/mosty-gsxt/lzJcjPjdb/selectCountNew').then(res => {
|
qcckGet({}, '/mosty-gsxt/lzJcjPjdb/selectCountNew').then(res => {
|
||||||
@ -292,20 +293,12 @@ const makerCenter = () => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
}
|
}
|
||||||
//播放音频
|
|
||||||
const ispLayBack = ref(true)
|
|
||||||
|
|
||||||
// 打开播放
|
|
||||||
const openLayBack = () => {
|
|
||||||
ispLayBack.value = true
|
|
||||||
}
|
|
||||||
|
|
||||||
// 关闭播放
|
// 关闭播放
|
||||||
const closeLayBack = () => {
|
const closeLayBack = () => {
|
||||||
ispLayBack.value = false
|
ispLayBack.value = false
|
||||||
audioPlayer.pause()
|
audioPlayer.pause()
|
||||||
}
|
}
|
||||||
|
|
||||||
// 初始化音频播放器
|
// 初始化音频播放器
|
||||||
const initAudioPlayer = () => {
|
const initAudioPlayer = () => {
|
||||||
// 使用工具类初始化音频播放器
|
// 使用工具类初始化音频播放器
|
||||||
@ -321,8 +314,6 @@ const initAudioPlayer = () => {
|
|||||||
console.error('初始化音频播放器失败:', error);
|
console.error('初始化音频播放器失败:', error);
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
const bnTimer = ref(null)
|
|
||||||
const popupTimer = ref(null)
|
|
||||||
|
|
||||||
const startPopupLoop = () => {
|
const startPopupLoop = () => {
|
||||||
clearInterval(popupTimer.value)
|
clearInterval(popupTimer.value)
|
||||||
@ -334,6 +325,62 @@ const startPopupLoop = () => {
|
|||||||
}
|
}
|
||||||
}, 10000)
|
}, 10000)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 搜索
|
||||||
|
const handleSearch = () => {
|
||||||
|
if(!searchText.value) return proxy.$message.warning('请输入身份证号');
|
||||||
|
qcckPost({ rysfzh: searchText.value },'/mosty-gsxt/tbYjxx/getPageAllList').then(res => {
|
||||||
|
peoDialogRef.value.init(res.records || [])
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 布控预警上图
|
||||||
|
const getTbYjxxGetList = () => {
|
||||||
|
// 设置为当天时间范围:00:00:00 到 23:59:59
|
||||||
|
const today = new Date();
|
||||||
|
const startTime = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 0, 0, 0).getTime();
|
||||||
|
const endTime = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 23, 59, 59).getTime();
|
||||||
|
const promes = { startTime:timeValidate(startTime), endTime:timeValidate(endTime), }
|
||||||
|
tbYjxxGetList(promes).then(res => {
|
||||||
|
const coords = res.map(item => {
|
||||||
|
return { id: item.id, jd: item.jd, wd: item.wd, yjtp: item.yjTp, yjnr: item.yjNr, yjLx: item.yjlx, yjlx: '01', yjsj: item.yjSj, rysfzh: item.yjRysfzh, ryxm: item.yjRyxm }
|
||||||
|
})
|
||||||
|
const icon = require("@/assets/point/yj.png")
|
||||||
|
emitter.emit('addPoint', { coords: coords, icon: icon, flag: 'yj', fontColor: '#FF0000' })
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const reversalPush = () => {
|
||||||
|
reversalPushShow.value = !reversalPushShow.value
|
||||||
|
// 移除clearInterval调用,避免定时器被清除
|
||||||
|
}
|
||||||
|
|
||||||
|
const reversal= () => {
|
||||||
|
reversalShow.value = !reversalShow.value
|
||||||
|
// 移除clearInterval调用,避免定时器被清除
|
||||||
|
}
|
||||||
|
|
||||||
|
// 鼠标移入
|
||||||
|
const mouseEnter = () => {
|
||||||
|
clearInterval(timing.value)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 鼠标移出
|
||||||
|
const mouseLeave = () => {
|
||||||
|
// 清除可能存在的旧定时器,避免多个定时器同时运行
|
||||||
|
clearInterval(timing.value)
|
||||||
|
// 设置为5秒自动切换,更容易测试效果
|
||||||
|
timing.value = setInterval(() => {
|
||||||
|
reversalPush()
|
||||||
|
reversal()
|
||||||
|
changeModel()
|
||||||
|
}, 30000)
|
||||||
|
}
|
||||||
|
|
||||||
|
function changeModel(){
|
||||||
|
modelWarning.value = !modelWarning.value
|
||||||
|
}
|
||||||
|
|
||||||
// 组件挂载时初始化音频播放器
|
// 组件挂载时初始化音频播放器
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getDepId()
|
getDepId()
|
||||||
@ -346,7 +393,6 @@ onMounted(() => {
|
|||||||
getTbYjxxGetList()
|
getTbYjxxGetList()
|
||||||
// 初始化音频播放器
|
// 初始化音频播放器
|
||||||
initAudioPlayer()
|
initAudioPlayer()
|
||||||
// webSoket.connect()
|
|
||||||
// 监听音频播放事件,获取WebSocket消息数据
|
// 监听音频播放事件,获取WebSocket消息数据
|
||||||
emitter.on("openYp", (newsDate) => {
|
emitter.on("openYp", (newsDate) => {
|
||||||
// 使用工具类播放音频,自动处理静音切换
|
// 使用工具类播放音频,自动处理静音切换
|
||||||
@ -380,100 +426,17 @@ onMounted(() => {
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
// 搜索
|
|
||||||
const handleSearch = () => {
|
|
||||||
if(!searchText.value){
|
|
||||||
proxy.$message.warning('请输入身份证号')
|
|
||||||
}else{
|
|
||||||
qcckPost({ rysfzh: searchText.value },'/mosty-gsxt/tbYjxx/getPageAllList').then(res => {
|
|
||||||
peoDialogRef.value.init(res.records || [])
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 布控预警上图
|
|
||||||
const getTbYjxxGetList = () => {
|
|
||||||
// 设置为当天时间范围:00:00:00 到 23:59:59
|
|
||||||
const today = new Date();
|
|
||||||
const startTime = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 0, 0, 0).getTime();
|
|
||||||
const endTime = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 23, 59, 59).getTime();
|
|
||||||
const promes = {
|
|
||||||
startTime:timeValidate(startTime),
|
|
||||||
endTime:timeValidate(endTime),
|
|
||||||
}
|
|
||||||
tbYjxxGetList(promes).then(res => {
|
|
||||||
const coords = res.map(item => {
|
|
||||||
return {
|
|
||||||
id: item.id,
|
|
||||||
jd: item.jd,
|
|
||||||
wd: item.wd,
|
|
||||||
yjtp: item.yjTp,
|
|
||||||
yjnr: item.yjNr,
|
|
||||||
yjLx: item.yjlx,
|
|
||||||
yjlx: '01',
|
|
||||||
yjsj: item.yjSj,
|
|
||||||
rysfzh: item.yjRysfzh,
|
|
||||||
ryxm: item.yjRyxm,
|
|
||||||
}
|
|
||||||
})
|
|
||||||
const icon = require("@/assets/point/yj.png")
|
|
||||||
emitter.emit('addPoint', { coords: coords, icon: icon, flag: 'yj', fontColor: '#FF0000' })
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
let timing = ref(true)
|
|
||||||
// 情报翻转
|
|
||||||
const reversalPushShow = ref(true)
|
|
||||||
const reversalPush = () => {
|
|
||||||
reversalPushShow.value = !reversalPushShow.value
|
|
||||||
// 移除clearInterval调用,避免定时器被清除
|
|
||||||
}
|
|
||||||
// 论坛翻转
|
|
||||||
const reversalShow = ref(true)
|
|
||||||
const reversal= () => {
|
|
||||||
reversalShow.value = !reversalShow.value
|
|
||||||
// 移除clearInterval调用,避免定时器被清除
|
|
||||||
}
|
|
||||||
|
|
||||||
// 鼠标移入
|
|
||||||
const mouseEnter = () => {
|
|
||||||
clearInterval(timing.value)
|
|
||||||
}
|
|
||||||
// 鼠标移出
|
|
||||||
const mouseLeave = () => {
|
|
||||||
// 清除可能存在的旧定时器,避免多个定时器同时运行
|
|
||||||
clearInterval(timing.value)
|
|
||||||
// 设置为5秒自动切换,更容易测试效果
|
|
||||||
timing.value = setInterval(() => {
|
|
||||||
reversalPush()
|
|
||||||
reversal()
|
|
||||||
changeModel()
|
|
||||||
}, 30000)
|
|
||||||
}
|
|
||||||
|
|
||||||
function changeModel(){
|
|
||||||
modelWarning.value = !modelWarning.value
|
|
||||||
}
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
clearInterval(timing.value)
|
clearInterval(timing.value)
|
||||||
clearInterval(bnTimer.value)
|
clearInterval(bnTimer.value)
|
||||||
clearInterval(popupTimer.value)
|
clearInterval(popupTimer.value)
|
||||||
// 组件卸载时停止音频播放并释放资源
|
// 组件卸载时停止音频播放并释放资源
|
||||||
if (audioPlayer) {
|
if (audioPlayer) audioPlayer.destroy();
|
||||||
audioPlayer.destroy()
|
|
||||||
}
|
|
||||||
// 组件卸载时关闭WebSocket连接
|
|
||||||
if (webSoket) {
|
|
||||||
webSoket.closeConnection()
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "@/assets/css/homeScreen.scss";
|
@import "@/assets/css/homeScreen.scss";
|
||||||
|
|
||||||
.fxq {
|
.fxq {
|
||||||
border-radius: 35px;
|
border-radius: 35px;
|
||||||
width: 35px;
|
width: 35px;
|
||||||
@ -482,7 +445,6 @@ onUnmounted(() => {
|
|||||||
transform-origin: left center;
|
transform-origin: left center;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
|
|
||||||
.icon {
|
.icon {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@ -507,32 +469,24 @@ onUnmounted(() => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.fxq2 {
|
.fxq2 {
|
||||||
background-color: #9d88f9;
|
background-color: #9d88f9;
|
||||||
}
|
}
|
||||||
|
|
||||||
.fxq1:hover {
|
.fxq1:hover {
|
||||||
width: 120px;
|
width: 120px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.fxq2:hover {
|
.fxq2:hover {
|
||||||
width: 120px;
|
width: 120px;
|
||||||
|
|
||||||
// background-color: red;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.fxq3:hover {
|
.fxq3:hover {
|
||||||
width: 120px;
|
width: 120px;
|
||||||
}
|
}
|
||||||
|
|
||||||
::v-deep .badge-top-left .el-badge__content {
|
::v-deep .badge-top-left .el-badge__content {
|
||||||
top: 0;
|
top: 0;
|
||||||
right: auto;
|
right: auto;
|
||||||
left: -10px;
|
left: -10px;
|
||||||
transform: translateY(-50%) translateX(-50%);
|
transform: translateY(-50%) translateX(-50%);
|
||||||
}
|
}
|
||||||
|
|
||||||
.badge-content {
|
.badge-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
@ -543,11 +497,9 @@ onUnmounted(() => {
|
|||||||
min-height: 45px;
|
min-height: 45px;
|
||||||
/* 确保收缩时有足够空间显示第一个图标 */
|
/* 确保收缩时有足够空间显示第一个图标 */
|
||||||
}
|
}
|
||||||
|
|
||||||
.badge-content:not(.expanded) {
|
.badge-content:not(.expanded) {
|
||||||
max-height: 45px;
|
max-height: 45px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 收缩时只显示第一个图标,隐藏其他内容 */
|
/* 收缩时只显示第一个图标,隐藏其他内容 */
|
||||||
.badge-content:not(.expanded)> :not(:first-child) {
|
.badge-content:not(.expanded)> :not(:first-child) {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
@ -594,7 +546,6 @@ onUnmounted(() => {
|
|||||||
.flip-wrapper {
|
.flip-wrapper {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
// height: calc(100%/3 - 8px);
|
|
||||||
height: 100%;
|
height: 100%;
|
||||||
backface-visibility: hidden;
|
backface-visibility: hidden;
|
||||||
perspective: 1000px;
|
perspective: 1000px;
|
||||||
|
|||||||
Reference in New Issue
Block a user