提交 aac77606 authored 作者: zhuyongshuai's avatar zhuyongshuai

2026-3-6

上级 8d5eb8b2
......@@ -10,7 +10,7 @@
"dependencies": {
"ant-design-vue": "^4.2.6",
"axios": "0.28.1",
"dayjs": "^1.11.13",
"dayjs": "^1.11.19",
"echarts": "5.5.1",
"element-plus": "^2.9.6",
"express": "^5.1.0",
......@@ -198,9 +198,10 @@
}
},
"node_modules/@element-plus/icons-vue": {
"version": "2.3.1",
"resolved": "https://registry.npmmirror.com/@element-plus/icons-vue/-/icons-vue-2.3.1.tgz",
"integrity": "sha512-XxVUZv48RZAd87ucGS48jPf6pKu0yV5UCg9f4FFwtrYxXOwWuVJo6wOvSLKEoMQKjv8GsX/mhP6UsC1lRwbUWg==",
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/@element-plus/icons-vue/-/icons-vue-2.3.2.tgz",
"integrity": "sha512-OzIuTaIfC8QXEPmJvB4Y4kw34rSXdCJzxcD1kFStBvr8bK6X1zQAYDo0CNMjojnfTqRQCJ0I7prlErcoRiET2A==",
"license": "MIT",
"peerDependencies": {
"vue": "^3.2.0"
}
......@@ -1389,9 +1390,10 @@
"license": "MIT"
},
"node_modules/@types/lodash": {
"version": "4.17.16",
"resolved": "https://registry.npmmirror.com/@types/lodash/-/lodash-4.17.16.tgz",
"integrity": "sha512-HX7Em5NYQAXKW+1T+FiuG27NGwzJfCX3s1GjOa7ujxZa52kjJLOr4FUxT+giF6Tgxv1e+/czV/iTtBw27WTU9g=="
"version": "4.17.23",
"resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.23.tgz",
"integrity": "sha512-RDvF6wTulMPjrNdCoYRC8gNR880JNGT8uB+REUpC2Ns4pRqQJhGz90wh7rgdXDPpCczF3VGktDuFGVnz8zP7HA==",
"license": "MIT"
},
"node_modules/@types/lodash-es": {
"version": "4.17.12",
......@@ -1447,9 +1449,13 @@
"license": "MIT"
},
"node_modules/@types/web-bluetooth": {
"version": "0.0.16",
"resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.16.tgz",
"integrity": "sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ=="
"version": "0.0.20",
"resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz",
"integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==",
"dev": true,
"license": "MIT",
"optional": true,
"peer": true
},
"node_modules/@ungap/structured-clone": {
"version": "1.3.0",
......@@ -1576,14 +1582,18 @@
"license": "MIT"
},
"node_modules/@vueuse/core": {
"version": "9.13.0",
"resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-9.13.0.tgz",
"integrity": "sha512-pujnclbeHWxxPRqXWmdkKV5OX4Wk4YeK7wusHqRwU0Q7EFusHoqNA/aPhB6KCh9hEqJkLAJo7bb0Lh9b+OIVzw==",
"version": "10.11.1",
"resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.1.tgz",
"integrity": "sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==",
"dev": true,
"license": "MIT",
"optional": true,
"peer": true,
"dependencies": {
"@types/web-bluetooth": "^0.0.16",
"@vueuse/metadata": "9.13.0",
"@vueuse/shared": "9.13.0",
"vue-demi": "*"
"@types/web-bluetooth": "^0.0.20",
"@vueuse/metadata": "10.11.1",
"@vueuse/shared": "10.11.1",
"vue-demi": ">=0.14.8"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
......@@ -1593,7 +1603,10 @@
"version": "0.14.10",
"resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.10.tgz",
"integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
"dev": true,
"hasInstallScript": true,
"optional": true,
"peer": true,
"bin": {
"vue-demi-fix": "bin/vue-demi-fix.js",
"vue-demi-switch": "bin/vue-demi-switch.js"
......@@ -1615,19 +1628,27 @@
}
},
"node_modules/@vueuse/metadata": {
"version": "9.13.0",
"resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-9.13.0.tgz",
"integrity": "sha512-gdU7TKNAUVlXXLbaF+ZCfte8BjRJQWPCa2J55+7/h+yDtzw3vOoGQDRXzI6pyKyo6bXFT5/QoPE4hAknExjRLQ==",
"version": "10.11.1",
"resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.1.tgz",
"integrity": "sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==",
"dev": true,
"license": "MIT",
"optional": true,
"peer": true,
"funding": {
"url": "https://github.com/sponsors/antfu"
}
},
"node_modules/@vueuse/shared": {
"version": "9.13.0",
"resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-9.13.0.tgz",
"integrity": "sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==",
"version": "10.11.1",
"resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.1.tgz",
"integrity": "sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==",
"dev": true,
"license": "MIT",
"optional": true,
"peer": true,
"dependencies": {
"vue-demi": "*"
"vue-demi": ">=0.14.8"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
......@@ -1635,9 +1656,13 @@
},
"node_modules/@vueuse/shared/node_modules/vue-demi": {
"version": "0.14.10",
"resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.10.tgz",
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
"integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
"dev": true,
"hasInstallScript": true,
"license": "MIT",
"optional": true,
"peer": true,
"bin": {
"vue-demi-fix": "bin/vue-demi-fix.js",
"vue-demi-switch": "bin/vue-demi-switch.js"
......@@ -3478,6 +3503,106 @@
"vue": "^3.2.0"
}
},
"node_modules/element-plus/node_modules/@types/web-bluetooth": {
"version": "0.0.16",
"resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.16.tgz",
"integrity": "sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==",
"license": "MIT"
},
"node_modules/element-plus/node_modules/@vueuse/core": {
"version": "9.13.0",
"resolved": "https://registry.npmjs.org/@vueuse/core/-/core-9.13.0.tgz",
"integrity": "sha512-pujnclbeHWxxPRqXWmdkKV5OX4Wk4YeK7wusHqRwU0Q7EFusHoqNA/aPhB6KCh9hEqJkLAJo7bb0Lh9b+OIVzw==",
"license": "MIT",
"dependencies": {
"@types/web-bluetooth": "^0.0.16",
"@vueuse/metadata": "9.13.0",
"@vueuse/shared": "9.13.0",
"vue-demi": "*"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
}
},
"node_modules/element-plus/node_modules/@vueuse/core/node_modules/vue-demi": {
"version": "0.14.10",
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
"integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
"hasInstallScript": true,
"license": "MIT",
"bin": {
"vue-demi-fix": "bin/vue-demi-fix.js",
"vue-demi-switch": "bin/vue-demi-switch.js"
},
"engines": {
"node": ">=12"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
},
"peerDependencies": {
"@vue/composition-api": "^1.0.0-rc.1",
"vue": "^3.0.0-0 || ^2.6.0"
},
"peerDependenciesMeta": {
"@vue/composition-api": {
"optional": true
}
}
},
"node_modules/element-plus/node_modules/@vueuse/metadata": {
"version": "9.13.0",
"resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-9.13.0.tgz",
"integrity": "sha512-gdU7TKNAUVlXXLbaF+ZCfte8BjRJQWPCa2J55+7/h+yDtzw3vOoGQDRXzI6pyKyo6bXFT5/QoPE4hAknExjRLQ==",
"license": "MIT",
"funding": {
"url": "https://github.com/sponsors/antfu"
}
},
"node_modules/element-plus/node_modules/@vueuse/shared": {
"version": "9.13.0",
"resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-9.13.0.tgz",
"integrity": "sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==",
"license": "MIT",
"dependencies": {
"vue-demi": "*"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
}
},
"node_modules/element-plus/node_modules/@vueuse/shared/node_modules/vue-demi": {
"version": "0.14.10",
"resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
"integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
"hasInstallScript": true,
"license": "MIT",
"bin": {
"vue-demi-fix": "bin/vue-demi-fix.js",
"vue-demi-switch": "bin/vue-demi-switch.js"
},
"engines": {
"node": ">=12"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
},
"peerDependencies": {
"@vue/composition-api": "^1.0.0-rc.1",
"vue": "^3.0.0-0 || ^2.6.0"
},
"peerDependenciesMeta": {
"@vue/composition-api": {
"optional": true
}
}
},
"node_modules/element-plus/node_modules/lodash-es": {
"version": "4.17.23",
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.23.tgz",
"integrity": "sha512-kVI48u3PZr38HdYz98UmfPnXl2DXrpdctLrFLCd3kOx1xUkOmpFPx7gCWWM5MPkL/fD8zb+Ph0QzjGFs4+hHWg==",
"license": "MIT"
},
"node_modules/emoji-regex": {
"version": "8.0.0",
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
......@@ -5428,9 +5553,10 @@
}
},
"node_modules/lodash": {
"version": "4.17.21",
"resolved": "https://registry.npmmirror.com/lodash/-/lodash-4.17.21.tgz",
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
"version": "4.17.23",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.23.tgz",
"integrity": "sha512-LgVTMpQtIopCi79SJeDiP0TfWi5CNEc/L/aRdTh3yIvmZXTnheWpKjSZhnvMl8iXbC1tFg9gdHHDMLoV7CnG+w==",
"license": "MIT"
},
"node_modules/lodash-es": {
"version": "4.17.21",
......
......@@ -24,7 +24,7 @@
"dependencies": {
"ant-design-vue": "^4.2.6",
"axios": "0.28.1",
"dayjs": "^1.11.13",
"dayjs": "^1.11.19",
"echarts": "5.5.1",
"element-plus": "^2.9.6",
"express": "^5.1.0",
......
......@@ -22,7 +22,7 @@ function getStaticPath() {
try {
const testPath = path.join(staticPath, 'index.html');
if (fs.existsSync(testPath)) {
console.log(`Found static files at: ${staticPath}`);
//console.log(`Found static files at: ${staticPath}`);
return staticPath;
}
} catch (error) {
......@@ -36,7 +36,7 @@ function getStaticPath() {
}
const staticPath = getStaticPath();
console.log(`Serving static files from: ${staticPath}`);
//console.log(`Serving static files from: ${staticPath}`);
// 1. CORS 中间件 - 放在最前面
app.use((req, res, next) => {
......@@ -102,20 +102,20 @@ app.get('/.well-known/appspecific/com.chrome.devtools.json', (req, res) => {
// 7. 创建HTTP和WebSocket服务
const server = http.createServer(app);
console.log("此时的WebSocket",server);
//console.log("此时的WebSocket",server);
const wss = new WebSocket.Server({ server });
wss.on('connection', (ws) => {
console.log(ws, '连接------');
//console.log(ws, '连接------');
ws.send('连接成功');
ws.on('message', (message) => {
console.log(message.toString(), ':ue发送给vue的数据');
//console.log(message.toString(), ':ue发送给vue的数据');
ws.send('vue发给ue的数据+1');
});
ws.on('close', () => {
console.log('客户端断开连接');
//console.log('客户端断开连接');
});
ws.on('error', (error) => {
console.error('WebSocket错误:', error);
......@@ -123,9 +123,9 @@ wss.on('connection', (ws) => {
});
server.listen(PORT, () => {
console.log(`大屏中转服务启动: http://localhost:${PORT}`);
console.log(`静态文件目录: ${staticPath}`);
console.log(`运行模式: ${isPacked ? '打包模式' : '开发模式'}`);
//console.log(`大屏中转服务启动: http://localhost:${PORT}`);
//console.log(`静态文件目录: ${staticPath}`);
//console.log(`运行模式: ${isPacked ? '打包模式' : '开发模式'}`);
});
......
......@@ -68,7 +68,7 @@ export function getSubSystemOpitionListApi(data) {
})
}
// console.log("propsDate-min--3333333333--------",{
// //console.log("propsDate-min--3333333333--------",{
// endTime: historyTimeDateRange.value[1],
// satelliteId: useAppStoreInstance.globalSatelliteSearchID==='0'? "4097": (useAppStoreInstance.globalSatelliteSearchID),
// startTime: historyTimeDateRange.value[0],
......
......@@ -35,10 +35,10 @@ const headerHeight = ref('40px')
const asideWidth = ref('350px')
// onBeforeUnmount(() => {
// console.log('组件即将卸载');
// //console.log('组件即将卸载');
// })
// onMounted(() => {
// console.log('组件已挂载');
// //console.log('组件已挂载');
// })
......
......@@ -2,7 +2,7 @@
* @Author: Z 1518051043@qq.com
* @Date: 2025-09-12 13:51:43
* @LastEditors: zwy 1518051043@qq.com
* @LastEditTime: 2025-12-30 11:11:21
* @LastEditTime: 2026-02-02 14:49:34
* @FilePath: \yuanxinPro\src\main.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -48,6 +48,16 @@ import './permission' // 路由拦截和加载页面进度条
import directive from './directive' // 导入公共函数
import 'element-plus/dist/index.css'
const app = createApp(App)
const pinia = createPinia();
// 全局方法挂载
......
......@@ -80,19 +80,31 @@ const markLineData = ref([
let myChart = null;
const isDetialDialogVisible = ref(false);
function showViewClick() {
// console.log("时间");
// //console.log("时间");
isDetialDialogVisible.value = !isDetialDialogVisible.value;
showView.value = true;
// console.log("当前的值:",showView.value);
if (window.ue5) {
window.ue5("callBackAllDialogFn", String(JSON.stringify({
type:"CDFCurveDetailDialog",
status:"open"
})));
}
// //console.log("当前的值:",showView.value);
}
function isDetialDialogVisibleHandleClose() {
isDetialDialogVisible.value = false;
showView.value = false;
if (window.ue5) {
window.ue5("callBackAllDialogFn", String(JSON.stringify({
type:"CDFCurveDetailDialog",
status:"close"
})));
}
}
onMounted(() => {
initChart();
console.log("-------cdfCurve-------",props.idName);
//console.log("-------cdfCurve-------",props.idName);
document.getElementById(props.idName).style.height = '240px';
});
......@@ -107,9 +119,9 @@ onUnmounted(() => {
function initChart() {
const chartDom = document.getElementById(props.idName);
chartDom.style.height = '180px';
chartDom.style.width = '150px';
chartDom.style.width = '170px';
myChart = echarts.init(chartDom);
console.log("初始化图表propsDate:",chartDom,myChart);
//console.log("初始化图表propsDate:",chartDom,myChart);
const option = {
legend: {
show: true,
......@@ -191,7 +203,7 @@ function initChart() {
},
{
offset: 1,
color: 'rgba(0,0,0,0.31)'
color: 'rgba(84,112,198,0.20)'
}
],
global: false
......
......@@ -50,7 +50,7 @@
<script setup>
import { ref, onMounted, onUnmounted } from 'vue';
import * as echarts from 'echarts';
import { el } from 'element-plus/es/locales.mjs';
......@@ -126,7 +126,7 @@ function handleDateRangeChange() {
startTime: formatDate(dateRange.value[0]),
endTime: formatDate(dateRange.value[1])
}
console.log("提交:",submitData);
//console.log("提交:",submitData);
if (submitData.startTime && submitData.endTime) {
chartConfigs.value = [
{
......@@ -276,7 +276,7 @@ function initChart(chartDom, config) {
},
grid: {
top: '20%',
right: '5%',
right: '2%',
bottom: '15%',
left: '4%'
},
......
......@@ -50,9 +50,10 @@ const props = defineProps({
},
});
onBeforeUnmount(() => {
console.log("中,zhelixieza");
//console.log("中,zhelixieza");
});
const componentProps = ref({});
</script>
<style scoped>
......
......@@ -52,7 +52,7 @@ export default {
// var watchList = []
// const watch1 = watch(() => props.time, (newVal) => {
// if (selectStatus.value) {
// // console.log(objs.value[newVal], newVal);
// // //console.log(objs.value[newVal], newVal);
// selectId.value = newVal
// if (timeIntal.value) {
// timeIntal.value = false
......@@ -105,7 +105,7 @@ export default {
// // 获取字段'value'的最小值
// const minValue = mappedData.reduce((min, item) => Math.min(min, item.value), Infinity);
// console.log(mappedData, '热力图数据');
// //console.log(mappedData, '热力图数据');
// chartDom = document.getElementById(obj.id);
// myChart = echarts.init(chartDom);
// option = {
......@@ -133,7 +133,7 @@ export default {
// realtime: false,
// // splitNumber: 6,
// formatter: function (a, b) {
// console.log(a, b, '问题');
// //console.log(a, b, '问题');
// // 将数值转换为整数并格式化输出
// return `${Number(a).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")} - ${Number(b).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}`
// },
......@@ -225,7 +225,7 @@ export default {
// }
// ]
// };
// console.log(option, '------------------------65--');
// //console.log(option, '------------------------65--');
// window.addEventListener("resize", function () {
// if (myChart) {
// var time = setInterval(() => {
......@@ -241,19 +241,19 @@ export default {
// if (getLanguage() == "english") {
// Object.entries(props.componentProps).forEach(([key, value]) => {
// console.log(key, value, 'key, --------------------value', ChineseEnglishGlossary.value[value]);
// //console.log(key, value, 'key, --------------------value', ChineseEnglishGlossary.value[value]);
// if (key === "columnLabel") {
// console.log(key, value, 'key, -------123-------------value');
// //console.log(key, value, 'key, -------123-------------value');
// props.componentProps[key] = ChineseEnglishGlossary.value[value]
// }
// })
// // console.log(props.componentProps, '柱状图---asdaaaa-----784654------');
// // //console.log(props.componentProps, '柱状图---asdaaaa-----784654------');
// }
// console.log(option, '------------------------65--');
// //console.log(option, '------------------------65--');
// option && myChart.setOption(option);
// }
......@@ -272,7 +272,7 @@ export default {
// }
// const propsFn = (value) => {
// if (value.visualData && value.visualData.length > 0) {
// // console.log(props.componentProps.columnName, '热力图加载了几次?');
// // //console.log(props.componentProps.columnName, '热力图加载了几次?');
// echarts.registerMap(props.componentProps.id, props.componentProps.relitu);
// // planFn(props.componentProps)
// yName.value = []
......@@ -448,6 +448,7 @@ function initChart() {
text: '链路层容量',
left: 'center',
// top: 10,
left: 10,
textStyle: {
color: '#fff',
fontSize: 10,
......
......@@ -40,8 +40,11 @@
</template>
<script setup>
import { ref } from 'vue';
import hotMap from './hotMap.vue'
import testMap from './testMap.vue'
const componentProps = ref({})
</script>
<style scoped>
......
......@@ -36,7 +36,7 @@ function initChart() {
const projection = d3.geoAlbersUsa();
myChart.hideLoading();
echarts.registerMap('USA', usaJson);
console.log("获得地图数据",usaJson);
//console.log("获得地图数据",usaJson);
const option = {
title: {
......
......@@ -48,6 +48,8 @@ const props = defineProps({
default: 'allIdName',
},
});
const componentProps = ref({})
</script>
<style scoped>
......
......@@ -82,11 +82,17 @@ const markLineData = ref([
const showView = ref(false)
const isDetialDialogVisible = ref(false)
function showViewClick() {
// console.log("时间");
// //console.log("时间");
showView.value = true;
isDetialDialogVisible.value = true;
// console.log("当前的值:",showView.value);
if (window.ue5) {
window.ue5("callBackAllDialogFn", String(JSON.stringify({
type:"InstantaneousCurveDetailsDialog",
status:"open"
})));
}
// //console.log("当前的值:",showView.value);
}
......@@ -94,7 +100,12 @@ const childrenInstantRef = ref(null)
const isDetialDialogVisibleHandleClose = () => {
isDetialDialogVisible.value = false;
showView.value = false;
if (window.ue5) {
window.ue5("callBackAllDialogFn", String(JSON.stringify({
type:"InstantaneousCurveDetailsDialog",
status:"close"
})));
}
}
let myChart = null;
......@@ -114,7 +125,7 @@ function initChart() {
const chartDom = document.getElementById(props.idName);
myChart = echarts.init(chartDom);
chartDom.style.height = '180px';
chartDom.style.width = '150px';
chartDom.style.width = '170px';
const option = {
legend: {
show: true,
......@@ -196,7 +207,7 @@ chartDom.style.width = '150px';
},
{
offset: 1,
color: 'rgba(0,0,0,0.31)'
color: 'rgba(111,252,186,0.20)'
}
],
global: false
......
......@@ -2,7 +2,7 @@
* @Author: zwy 1518051043@qq.com
* @Date: 2026-01-04 09:13:55
* @LastEditors: zwy 1518051043@qq.com
* @LastEditTime: 2026-01-15 01:21:36
* @LastEditTime: 2026-01-21 16:24:13
* @FilePath: \yuanxinPro\src\pages\all\components\loadingComponent\index.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -15,7 +15,7 @@ const Loading = (function() {
text = 'Loading...',
background = 'rgba(0, 0, 0, 0.57)',
color = '#fff',
zIndex = 9999,
zIndex = 9999999,
spinnerColor = color,
spinnerSize = '40px'
} = options;
......
/*
* @Author: zwy 1518051043@qq.com
* @Date: 2026-01-04 09:13:55
* @LastEditors: zwy 1518051043@qq.com
* @LastEditTime: 2026-01-21 16:24:06
* @FilePath: \yuanxinPro\src\pages\all\components\loadingComponent\index.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
const SubLoading = (function() {
let loadingInstance = null;
let styleInstance = null;
function createLoading(options = {}) {
const {
text = 'Loading...',
background = 'rgba(0, 0, 0, 0.57)',
color = '#fff',
zIndex = 9999999,
spinnerColor = color,
spinnerSize = '40px'
} = options;
// 如果已经存在,直接复用(避免重复创建)
if (loadingInstance) return;
loadingInstance = document.createElement('div');
loadingInstance.className = 'custom-loading';
Object.assign(loadingInstance.style, {
position: 'fixed',
top: '0',
left: '0',
width: '100%',
height: '100%',
backgroundColor: background,
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
zIndex: String(zIndex),
flexDirection: 'column'
});
const spinnerEl = document.createElement('div');
spinnerEl.className = 'custom-loading-spinner';
Object.assign(spinnerEl.style, {
border: '4px solid rgba(0, 0, 0, 0.3)',
borderRadius: '50%',
borderTop: `4px solid ${spinnerColor}`,
width: spinnerSize,
height: spinnerSize,
animation: 'spin 1s linear infinite'
});
const textEl = document.createElement('p');
textEl.className = 'custom-loading-text';
textEl.textContent = text;
Object.assign(textEl.style, {
color: color,
marginTop: '20px',
fontFamily: 'Arial, sans-serif'
});
styleInstance = document.createElement('style');
styleInstance.textContent = `
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
`;
loadingInstance.appendChild(spinnerEl);
loadingInstance.appendChild(textEl);
document.head.appendChild(styleInstance);
document.body.appendChild(loadingInstance);
}
function destroyLoading() {
if (loadingInstance) {
document.body.removeChild(loadingInstance);
document.head.removeChild(styleInstance);
loadingInstance = null;
styleInstance = null;
}
}
return {
show: createLoading,
hide: destroyLoading
};
})();
export default SubLoading;
\ No newline at end of file
......@@ -98,7 +98,7 @@ const controls = ref([
])
const handleControlChange = (item, value) => {
console.log(`${item.label} 状态变为: ${value ? '开启' : '关闭'}`)
//console.log(`${item.label} 状态变为: ${value ? '开启' : '关闭'}`)
item.enabled = value
}
......@@ -115,7 +115,7 @@ const searchSatelliteRef = ref(null)
const handleSwitchChange = (item) => {
console.log("初始化调用11111",item.enabled,item);
//console.log("初始化调用11111",item.enabled,item);
switch (item.label) {
case '时间轴':
......@@ -179,7 +179,7 @@ watch(useAppStoreInstance, () => {
document.getElementById('footer-content-up').style.bottom = '300px'
}
if (useAppStoreInstance.isdataPanelShow) {
// console.log(window.innerWidth);
// //console.log(window.innerWidth);
document.getElementById('footer-content-up').style.bottom = '0px'
document.getElementById('all_footer').style.width = `calc(100% - ${asideWidth.value} - ${asideWidth.value})`
// document.getElementById('all_footer').style.bottom = '10px'
......@@ -197,8 +197,9 @@ watch(useAppStoreInstance, () => {
// document.getElementById('all_footer').style.bottom = '10px'
// if (!useAppStoreInstance.islegendShow) {document.getElementById('all_footer').style.bottom = '20px'}
// document.getElementById('search_panel').style.left = '30px'
if (document.getElementById('control_panel1')) {
document.getElementById('control_panel1').style.right = '-30px'
}
}
......@@ -209,7 +210,7 @@ watch(useAppStoreInstance, () => {
const checkScreenSize = () => {
const width = window.innerWidth;
const height = window.innerHeight;
console.log("当前设备的尺寸:",width,height);
//console.log("当前设备的尺寸:",width,height);
isMobile.value = width <= 940;
useAppStoreInstance.setisdataPanelShow(!isMobile.value);
controls.value.forEach(item => {
......@@ -224,12 +225,12 @@ const checkScreenSize = () => {
const currSeriveSize = () => {
const width = window.innerWidth;
const height = window.innerHeight;
console.log("当前设备的尺寸:",width,height);
//console.log("当前设备的尺寸:",width,height);
}
onActivated(() => {
// console.log("111111111111114onActivated",useAppStoreInstance.islegendShow,useAppStoreInstance.isTimeLineShow);
// //console.log("111111111111114onActivated",useAppStoreInstance.islegendShow,useAppStoreInstance.isTimeLineShow);
controls.value = [
{ label: '卫星轨道', enabled: useAppStoreInstance.issatelliteOrbitShow, disabled: false },
{ label: '卫星波束', enabled: useAppStoreInstance.issatelliteBeamShow, disabled: false },
......@@ -243,7 +244,7 @@ onMounted(() => {
checkScreenSize();
handleSwitchChange({disabled: false,enabled: useAppStoreInstance.islegendShow,label: "图例"})
window.addEventListener('resize', checkScreenSize);
// console.log("111111111111114ononMounted",useAppStoreInstance.islegendShow,useAppStoreInstance.isTimeLineShow);
// //console.log("111111111111114ononMounted",useAppStoreInstance.islegendShow,useAppStoreInstance.isTimeLineShow);
controls.value = [
{ label: '卫星轨道', enabled: useAppStoreInstance.issatelliteOrbitShow, disabled: false },
{ label: '卫星波束', enabled: useAppStoreInstance.issatelliteBeamShow, disabled: false },
......
<template>
<div class="satellite-status-container">
<div class="satellite-status-container" :class="{'active':!useAppStoreInstance.isdataPanelShow}">
<!-- 左侧图例标题(始终居中) -->
<div class="legend-title">
......@@ -29,7 +29,8 @@
<script setup>
import { ref } from 'vue';
import useAppStore from '@/store/module/app'
const useAppStoreInstance = useAppStore()
const legendstatusMap = ref({
normal: '正常',
abnormal: '异常',
......@@ -74,7 +75,7 @@ const legendSource = ref([
min-width: 800px;
color: #ffffff;
/* font-family: 'Consolas', monospace; */
box-shadow: 0 2px 10px rgba(0, 0, 0, 1);
/* box-shadow: 0 2px 10px rgba(0, 0, 0, 1); */
}
/* 图例标题(始终居中) */
......
......@@ -6,17 +6,9 @@
<div class="block">
<span class="demonstration">时间段</span>
<el-date-picker
v-model="dateRange"
type="daterange"
popper-class="custom-date-picker"
unlink-panels
range-separator="→"
start-placeholder="开始日期"
end-placeholder="结束日期"
:disabled-date="disabledDate"
@change="pick_select_date_handFn"
:popper-options="{
<el-date-picker v-model="dateRange" type="daterange" popper-class="custom-date-picker" unlink-panels
range-separator="→" start-placeholder="开始日期" end-placeholder="结束日期" :disabled-date="disabledDate"
@change="pick_select_date_handFn" :popper-options="{
placement: 'bottom-start',
modifiers: [
{
......@@ -26,36 +18,44 @@
}
}
]
}"
/>
}" />
<div class="right_block">
<el-button class="right_block_confirm_btn" size="mini" @click="handleDateRangeChange(pick_select_date)" :disabled="!is_flag_confirmAndPauseAndSpeed">确认</el-button>
<!--限制 :disabled="!is_flag_confirmAndPauseAndSpeed" -->
<el-button class="right_block_confirm_btn" size="mini"
@click="handleDateRangeChange(pick_select_date)">确认</el-button>
<div class="right_block_center">
<!-- <el-button circle class="right_block_conter_btn" @click="playBackward">
<el-icon>
<img src="@/assets/images/footers/videoPlay_left.png" alt="" style="width: 8px; height: 10px;" />
</el-icon>
</el-button> -->
<el-button
circle
class="right_block_conter_btn_center"
@click="toggleAutoPlay"
:disabled="!is_flag_confirmAndPauseAndSpeed"
>
<el-icon >
<img v-if="!isPlaying" src="@/assets/images/footers/videoPause.png" alt="" style="width: 8px; height: 10px;" />
<img v-if="isPlaying" src="@/assets/images/footers/videoPlay.png" alt="" style="width: 8px; height: 10px;" />
<!--限制 :disabled="!is_flag_confirmAndPauseAndSpeed" -->
<el-button circle class="right_block_conter_btn_center" @click="toggleAutoPlay">
<el-icon>
<img v-if="!isPlaying" src="@/assets/images/footers/videoPause.png" alt=""
style="width: 8px; height: 10px;" />
<img v-if="isPlaying" src="@/assets/images/footers/videoPlay.png" alt=""
style="width: 8px; height: 10px;" />
</el-icon>
</el-button>
<!-- <el-button size="mini" @click="jumpToSpecificTime(new Date('2025-11-03 00:00:00'),true)">时间</el-button> -->
<!-- <el-button circle class="right_block_conter_btn" @click="playForward">
<!-- <el-button circle class="right_block_conter_btn" @click="playForward">
<el-icon>
<img src="@/assets/images/footers/videoPlay_right.png" alt="" style="width: 8px; height: 10px;" />
</el-icon>
</el-button> -->
</div>
<el-button size="mini" circle @click="changeSpeed" :disabled="is_flag_isRealtime || !is_flag_confirmAndPauseAndSpeed" class="right_block_conter_btn_playbackSpeed" style="background: none;">x{{ playbackSpeed }}</el-button>
<!-- || !is_flag_confirmAndPauseAndSpeed || speedChangedNormalDataBack -->
<el-select v-model="playbackSpeed" style="width: 70px" class="satellite-select"
:disabled="is_flag_isRealtime">
<el-option v-for="item in playbackSpeedOptions" :key="item.value" :label="item.label" :value="item.value"
@click="() => {
//console.log('我是喧杂',playbackSpeed);
changeSpeed()
}" />
</el-select>
<!-- <el-button size="mini" circle @click="changeSpeed" :disabled="is_flag_isRealtime || !is_flag_confirmAndPauseAndSpeed" class="right_block_conter_btn_playbackSpeed" style="background: none;">x{{ playbackSpeed }}</el-button> -->
</div>
</div>
</div>
......@@ -67,46 +67,34 @@
<div class="timeline-content">
<!-- 时间刻度 -->
<div class="time-markers">
<div
v-for="(marker, index) in timeMarkers"
:key="index"
class="time-marker"
:style="{ left: marker.position + '%' }"
>
<div class="marker-line" :class="{ 'major-line': marker.isMajor, 'minor-line_color': (index) % showLengthmarkerLine === 0 || index === timeMarkers.length - 1 }"></div>
<span
class="marker-label"
:class="{ 'selected-label': isMarkerInSelectedRange(marker) }"
v-if=" ((index) % showLength === 0 || index === timeMarkers.length - 1) "
v-html="marker.label"
></span>
<div v-for="(marker, index) in timeMarkers" :key="index" class="time-marker"
:style="{ left: marker.position + '%' }">
<div class="marker-line"
:class="{ 'major-line': marker.isMajor, 'minor-line_color': (index) % showLengthmarkerLine === 0 || index === timeMarkers.length - 1 }">
</div>
<span class="marker-label" :class="{ 'selected-label': isMarkerInSelectedRange(marker) }"
v-if="((index) % showLength === 0 || index === timeMarkers.length - 1)" v-html="marker.label"></span>
</div>
</div>
<!-- 滑块和选中区域 -->
<div class="slider-container">
<div class="slider-track" ref="sliderTrack">
<div class="selected-range" :style="selectedRangeStyle"></div>
<!-- 开始滑块 -->
<div
class="slider-handle start-handle"
:style="{ left: startHandlePosition }"
>
<!-- 开始滑块 -->
<div class="slider-handle start-handle" :style="{ left: startHandlePosition }">
<div class="handle-rail"></div>
<div class="handle-tooltip">{{ formatDateTime(selectedStartTime) }}</div>
</div>
<!-- 结束滑块 -->
<div
class="slider-handle end-handle"
:style="{ left: endHandlePosition }"
@mousedown="startDrag('end', $event)"
>
<div class="slider-handle end-handle" :style="{ left: endHandlePosition }"
@mousedown="startDrag('end', $event)">
<div class="handle-rail">
<div class="handle-tooltip" :class="{'handle-tooltip_auto': !is_flag_isRealtime}">{{ formatDateTime(selectedEndTime) }}</div>
<div class="handle-tooltip" :class="{ 'handle-tooltip_auto': !is_flag_isRealtime }">{{
formatDateTime(selectedEndTime) }}</div>
</div>
</div>
</div>
......@@ -124,19 +112,42 @@ import Loading from '@/pages/all/components/loadingComponent/index.js'
import { ref, onMounted, onUnmounted, computed, watch, nextTick, onDeactivated } from 'vue';
import wss from '@/utils/requestSocekt.js'
import useAppStore from '@/store/module/app'
import { tr } from 'element-plus/es/locales.mjs';
import { fa } from 'element-plus/es/locales.mjs';
const wssInstance = ref(wss)
// import { loading } from 'vxe-pc-ui';
// 用于表示速度改变时,正常数据返回后才能够再次改变速度
const speedChangedNormalDataBack = ref(false)
const playbackSpeedOptions = ref([
{
value: 1,
label: '1x'
},
{
value: 2,
label: '2x'
},
{
value: 4,
label: '4x'
},
{
value: 8,
label: '8x'
},
{
value: 10,
label: '10x'
},
])
const useAppStoreInstance = useAppStore();
const flagIsPlaying = ref(false)
const is_flag_confirmAndPauseAndSpeed = ref(true)
// 跳转到指定时间点
const jumpToSpecificTime = (targetTime,PerformDrag=false) => {
console.log('跳转到指定时间点:', targetTime);
isChange_flag_firstBackDate.value = false;
const jumpToSpecificTime = (targetTime, PerformDrag = false) => {
//console.log('跳转到指定时间点:', targetTime);
// isChange_flag_firstBackDate.value = false;
hasPlayed.value = false;
try {
if (!startDateTime.value || !endDateTime.value) {
......@@ -147,7 +158,7 @@ const jumpToSpecificTime = (targetTime,PerformDrag=false) => {
// 停止当前自动播放
// if (isPlaying.value) {
// console.log("我走了这里3")
// //console.log("我走了这里3")
// stopAutoPlay();
// }
......@@ -188,28 +199,28 @@ const jumpToSpecificTime = (targetTime,PerformDrag=false) => {
// 强制更新视图
// nextTick(() => {
// updateSelectedTimes();
// console.log("跳转到指定时间:", targetTime, "滑块位置:", percentPosition);
// //console.log("跳转到指定时间:", targetTime, "滑块位置:", percentPosition);
// // 调用UE5回调函数
// // if (window.ue5) {
// // window.ue5("callBackTimeFn", String(JSON.stringify({
// // isRealtime: false,
// // replayTime: formatDateTime(targetTime),
// // taskCode: String(taskCode_everyChange.value),
// // taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
// // })));
// // wssOpenHandle({
// // isRealtime: false,
// // replayTime: formatDateTime(targetTime),
// // taskCode: String(taskCode_everyChange.value),
// // taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
// // });
// // }
// });
// playForward();
if(PerformDrag) {
if (PerformDrag) {
endDrag();
// moveEndHandle();
}
return true;
} catch (error) {
console.error("跳转到指定时间点出错:", error);
......@@ -220,31 +231,42 @@ const jumpToSpecificTime = (targetTime,PerformDrag=false) => {
const wssOpenHandle = (data) => {
// console.log('wssOpenHandle', wss,wss.readyState, WebSocket.OPEN);
if (wss.readyState === WebSocket.OPEN) {
//console.log('主星级wssOpenHandle', (wssInstance.value),(wssInstance.value).readyState, WebSocket.OPEN);
if ((wssInstance.value).readyState === WebSocket.OPEN) {
// 如果连接已打开,直接发送数据
wss.send(JSON.stringify(data));
} else
{
(wssInstance.value).send(JSON.stringify(data));
} else if ((wssInstance.value).readyState === WebSocket.CLOSED) {
console.warn('WebSocket 已关闭,无法发送数据:', data);
(wssInstance.value) = new WebSocket((wssInstance.value).url);
(wssInstance.value).onopen = () => {
(wssInstance.value).send(JSON.stringify(data));
};
wssMessageHandle();
} else {
// 否则等待连接打开后再发送
wss.onopen = () => {
wss.send(JSON.stringify(data));
(wssInstance.value).onopen = () => {
(wssInstance.value).send(JSON.stringify(data));
};
}
};
const wssResponeFlag_isSuccess = ref(true);
const loading = ref('');
const compareTime = (time1, time2) => {
console.log('cao每隔开始compareTime----------', time1, time2);
// console.log('cao每隔开始compareTime----------1', time1, time2);
// 将时间字符串转换为 Date 对象
const date1 = new Date(time1);
if (time2 === null || time2 === "" || time2 === undefined) {
time2 = new Date(
new Date(selectedStartTime.value).getTime() + 60 * 1000
).toISOString();
console.log('每隔开始compareTime----------', time1, time2);
new Date(selectedStartTime.value).getTime() + 60 * 1000
).toISOString();
// //console.log('每隔开始compareTime----------', time1, time2);
}
const date2 = new Date(time2);
......@@ -256,10 +278,26 @@ const compareTime = (time1, time2) => {
// 比较时间戳
if (date1 >= date2) {
return true;
}else {
} else {
return false;
}
};
// 将科学计数法,转换为普通数字字符串
const toPlainNumber = (num) => {
if (typeof num !== 'number' && typeof num !== 'string') return num;
const str = String(num);
// 如果不是科学计数法格式,直接返回
if (!/e/i.test(str)) return str;
const [mantissa, exponent] = str.toLowerCase().split('e');
const precision = Math.max(0, -parseInt(exponent) + (mantissa.includes('.') ? mantissa.split('.')[1].length : 0));
return Number(num).toFixed(precision);
};
const preTimeWindowEnd = ref(null);
const preTimeAllDate = ref(null);
// watch(() => selectedEndTime.value, val => {
......@@ -269,31 +307,59 @@ const preTimeAllDate = ref(null);
// }, { deep: true, immediate: true });
const onMessageIndex = ref(0);
const hasPlayed = ref(false);//只是个标志
const wssMessageHandle = () => {
const unlesscount = ref(0);
const subSysToMainSysFirstDataBack = ref(true);
const wssMessageHandle = () => {
// let WwflagToNext = 0
wss.onmessage = (event) => {
(wssInstance.value).onmessage = (event) => {
const data = JSON.parse(event.data);
// 只有history和实时模式数据,回复已收到数据的确认。要修改以下代码
if ((data.type === 'history' && !(data?.isLagrangeInterpolation === true)) ) {
wssOpenHandle({
if ((data.type === 'history' && !(data?.isLagrangeInterpolation === true))) {
wssOpenHandle({
type: "confirm",
taskCode: String(taskCode_everyChange.value),
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
clientType: "web"
})
// setTimeout(() => {
// wssOpenHandle({
// type: "confirm",
// taskCode: String(taskCode_everyChange.value),
// taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
// clientType: "ue"
// })
// }, 2000);
}
// console.log('setTimeout:', (1000*60)/playbackSpeed.value,playbackSpeed.value);
if ((data.type === 'history' && (data?.isLagrangeInterpolation === true)) && (data.controlType === 'SMOOTH')) {
// playForward();
if (data.type === 'control' && (data.controlType === 'continue' && data?.messageTypeFalg === 'true')) {
jumpToSpecificTime(new Date(subtractSecondsAndFormat(alignTo56Seconds(tempDateTime.value).toISOString(), data.remainingTimeMs+1)), false)
if (!hasPlayed.value) {
//console.log("我是playForward--3");
playForward();
hasPlayed.value = true;
}
}
// //console.log('setTimeout:', (1000*60)/playbackSpeed.value,playbackSpeed.value);
if ((data.type === 'history' && (data?.isLagrangeInterpolation === true)) && (data.controlType === 'SMOOTH')) {
//console.log("我是playForward--1");
if (data.nextTimestamp) {
preTimeWindowEnd.value = data.nextTimestamp;
}
jumpToNextTime.value = data.remainingTimeMs || 0;
hasDraged_first_falseToTrue.value = true;
// console.log("我走22222222222", (useAppStoreInstance.footerTimeHasedSelectTimeToSub && !subSysToMainSysFirstDataBack.value));
// if (useAppStoreInstance.footerTimeHasedSelectTimeToSub && !subSysToMainSysFirstDataBack.value) {
// jumpToSpecificTime(new Date(alignTo56Seconds(selectedEndTime.value).toISOString()));
// }
isChange_flag_firstBackDate.value = true;
playForward();
hasPlayed.value = true;
useAppStoreInstance.setGlobalLeftWssCONTINE(data);
// console.log("useAppStoreInstance.globalLeftWssCONTINE;执行了");
}
// 使用 Promise 包装 setTimeout
// await new Promise(resolve => {
......@@ -302,84 +368,94 @@ const wssMessageHandle = () => {
// resolve()
// }, 2000)
// })
console.log('我是timer获取的wssRespone:', data);
console.log("我走了seekConfirm",!(data?.isLagrangeInterpolation === true));
//console.log('我是timer获取的wssRespone:', data);
//console.log("我走了seekConfirm",!(data?.isLagrangeInterpolation === true));
let flagToNext = 0
Loading.hide()
if (data.type === 'control' && !(data.controlType === 'stop') && !(data.controlType === 'continue')) {
if (data.nextTimestamp ) {
preTimeWindowEnd.value = data.nextTimestamp || data.dataTime ;
if (data.nextTimestamp) {
preTimeWindowEnd.value = data.nextTimestamp || data.dataTime;
}
if (!hasPlayed.value) {
playForward();
hasPlayed.value = true;
}
jumpToNextTime.value = data.remainingTimeMs || 0;
hasDraged_first_falseToTrue.value = true;
console.log("000000new Date(subtractSecondsAndFormat(alignTo56Seconds(selectedEndTime.value).toISOString(), jumpToNextTime.value+1))",new Date(subtractSecondsAndFormat(alignTo56Seconds(selectedEndTime.value).toISOString(), jumpToNextTime.value+2)));
jumpToSpecificTime(new Date(subtractSecondsAndFormat(alignTo56Seconds(selectedEndTime.value).toISOString(), jumpToNextTime.value+2)));
console.log("我走了ElMessage",hasDraged_first_falseToTrue.value , !(data?.isLagrangeInterpolation === true) , (data.controlType === 'seekConfirm'));
if (hasDraged_first_falseToTrue.value && !(data?.isLagrangeInterpolation === true) && (data.controlType === 'seekConfirm')) {
ElMessage({
type: 'success',
message: `${jumpToNextTime.value/1000}秒后可进行下次时间轴拖动!!!`,
})
}
// if (!hasPlayed.value) {
// //console.log("我是playForward--2");
// playForward();
// hasPlayed.value = true;
// }
// jumpToNextTime.value = data.remainingTimeMs || 0;
hasDraged_first_falseToTrue.value = true;
//console.log("000000new Date(subtractSecondsAndFormat(alignTo56Seconds(selectedEndTime.value).toISOString(), jumpToNextTime.value+1))",new Date(subtractSecondsAndFormat(alignTo56Seconds(selectedEndTime.value).toISOString(), jumpToNextTime.value+2)));
jumpToSpecificTime(new Date(subtractSecondsAndFormat(alignTo56Seconds(selectedEndTime.value).toISOString(), data.remainingTimeMs + 1)));
//console.log("我走了ElMessage",hasDraged_first_falseToTrue.value , !(data?.isLagrangeInterpolation === true) , (data.controlType === 'seekConfirm'));
// ElMessage.warning("dsadasd",jumpToNextTime.value)
if (hasDraged_first_falseToTrue.value && !(data?.isLagrangeInterpolation === true) && (data.controlType === 'seekConfirm')) {
// ElMessage({
// type: 'success',
// message: `${jumpToNextTime.value/1000}秒后可进行下次时间轴拖动!!!`,
// })
}
isChange_flag_firstBackDate.value = true;
}
if (data.type === 'error') {
wssResponeFlag_isSuccess.value = false;
// eleplate plus 关闭loading
// (loading.value).close()
ElMessage({
type: 'error',
message: data.message || `已暂停,没有查询到该时间段的历史数据!!!`,
message:data.message ?`主系统:${data.message } `:`已暂停,没有查询到该时间段的历史数据!!!`,
})
// console.log("获取的wssResponeFlag_isSuccess信息1:", wssResponeFlag_isSuccess.value);
// //console.log("获取的wssResponeFlag_isSuccess信息1:", wssResponeFlag_isSuccess.value);
useAppStoreInstance.setglobalStartWss(false)
console.log("我走了这里4")
//console.log("我走了这里4")
stopAutoPlay();
isChange_flag_firstBackDate.value = false;
// isChange_flag_firstBackDate.value = false;
hasPlayed.value = false;
// 处理任务数据
}
if (data.type === 'history' && !(data?.isLagrangeInterpolation === true) ) {
}
if (data.type === 'history' && !(data?.isLagrangeInterpolation === true)) {
// if (useAppStoreInstance.footerTimeHasedSelectTimeToSub && !subSysToMainSysFirstDataBack.value) {
// jumpToSpecificTime(new Date(tempDateTime.value),false)
// // jumpToSpecificTime(new Date(subtractSecondsAndFormat(alignTo56Seconds(tempDateTime.value).toISOString(),0)),true)
// subSysToMainSysFirstDataBack.value = true;
// }
useAppStoreInstance.setGlobalLeftWssCONTINE(data);
// 处理日志数据
// console.log("endDateTime.value === selectedEndTime.value:", endDateTime.value , selectedEndTime.value.toISOString(),endDateTime.value === selectedEndTime.value);
// //console.log("endDateTime.value === selectedEndTime.value:", endDateTime.value , selectedEndTime.value.toISOString(),endDateTime.value === selectedEndTime.value);
useAppStoreInstance.setglobalStartWss(true)
if (data.nextTimestamp || data.timeWindowEnd ) {
preTimeWindowEnd.value = data.nextTimestamp || data.timeWindowEnd ;
speedChangedNormalDataBack.value = false;
if (data.nextTimestamp || data.timeWindowEnd) {
preTimeWindowEnd.value = data.nextTimestamp || data.timeWindowEnd;
}
hasDraged_first_falseToTrue.value = false;
hasDraged_first_falseToTrue.value = false;
if (!(is_flag_confirmAndPauseAndSpeed.value) && !(is_flag_isRealtime.value)) {
//console.log("我走了is_flag_confirmAndPauseAndSpeed",!(is_flag_confirmAndPauseAndSpeed.value) && !(is_flag_isRealtime.value));
if (!(is_flag_confirmAndPauseAndSpeed.value) && !(is_flag_isRealtime.value)) {
console.log("我走了is_flag_confirmAndPauseAndSpeed",!(is_flag_confirmAndPauseAndSpeed.value) && !(is_flag_isRealtime.value));
is_flag_confirmAndPauseAndSpeed.value = true;
}
// 跳转到上次时间点
// if (useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
// jumpToSpecificTime(new Date(useAppStoreInstance.globalTimeLineEndSelectTime),true)
// }
// 跳转到上次时间点
// if (useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
// jumpToSpecificTime(new Date(useAppStoreInstance.globalTimeLineEndSelectTime),true)
// }
preTimeAllDate.value = data;
// clearTimeout(WwflagToNext);
if (flagToNext !== 0) {
clearTimeout(flagToNext);
if (flagToNext !== 0) {
clearTimeout(flagToNext);
}
isChange_flag_firstBackDate.value = true;
onMessageIndex.value += 1
if (endDateTime.value === selectedEndTime.value.toISOString()) {
console.log("我走了这里1",endDateTime.value === selectedEndTime.value.toISOString(),endDateTime.value,selectedEndTime.value.toISOString());
//console.log("我走了这里1",endDateTime.value === selectedEndTime.value.toISOString(),endDateTime.value,selectedEndTime.value.toISOString());
stopAutoPlay();
}else{
} else {
if (!hasPlayed.value) {
//console.log("我是playForward--3");
playForward();
hasPlayed.value = true;
}
......@@ -388,22 +464,22 @@ const wssMessageHandle = () => {
// startAutoPlay();
// toggleAutoPlay();
console.log("这里是startAutoPlay()");
//console.log("这里是startAutoPlay()");
// if(loading.value){
// (loading.value).close()
// (loading.value).close()
// }else{
// console.log("99999999999999",loading.value);
// }
wssResponeFlag_isSuccess.value = true;
// message.success("同步时间轴数据状态成功!!!");
// console.log('我是history的数据:', data);
console.log("compareTime*******",compareTime( formatDateTime(selectedEndTime.value),data.timeWindowEnd));
// //console.log('我是history的数据:', data);
// //console.log("compareTime*******",compareTime( formatDateTime(selectedEndTime.value),data.timeWindowEnd));
// preTimeWindowEnd.value = new Date(formatDateTime(selectedStartTime.value))
// if (data.timeWindowEnd ) {
// }
// if (compareTime( formatDateTime(selectedEndTime.value),preTimeWindowEnd.value)) {
// stopAutoPlay();
......@@ -412,16 +488,18 @@ const wssMessageHandle = () => {
if (data.type === 'EndProcess') {
useAppStoreInstance.setglobalStartWss(false)
// useAppStoreInstance.setglobalStartWss(false)
isChange_flag_firstBackDate.value = false;
// isChange_flag_firstBackDate.value = false;
ElMessage({
type: 'error',
message: data.message || `已暂停,没有查询到该时间段的历史数据!!!`,
})
stopAutoPlay();
// console.log('我是left,type == time获取的wssRespone:', JSONdata, typeof JSONdata.time);
// console.log('我是left,type == time获取的wssRespone:', JSONdata.time, typeof JSONdata.time);
// console.log('我是left,type == time获取的wssRespone:', JSONdata.time.toLocaleString(), typeof JSONdata.time.toLocaleString());
// //console.log('我是left,type == time获取的wssRespone:', JSONdata, typeof JSONdata.time);
// //console.log('我是left,type == time获取的wssRespone:', JSONdata.time, typeof JSONdata.time);
// //console.log('我是left,type == time获取的wssRespone:', JSONdata.time.toLocaleString(), typeof JSONdata.time.toLocaleString());
}
unlesscount.value += 1
// 处理服务器返回的数据,减去1000毫秒延迟,防止setTimeout和返回数据重叠在一个时间点上
// flagToNext = setTimeout(() => {
// stopAutoPlay();
......@@ -435,7 +513,7 @@ const wssMessageHandle = () => {
// 日期时间状态 (精确到秒)
const endDateTime = ref(new Date(Date.now() ).toISOString()); // 当前时间作为结束时间
const endDateTime = ref(new Date(Date.now()).toISOString()); // 当前时间作为结束时间
const startDateTime = ref(new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString()); // 三天前作为开始时间
const dateRange = ref([]);
......@@ -522,19 +600,19 @@ const pick_select_date = ref();
const pick_select_date_handFn = (val) => {
if (!isDraged.value) {
// window.ue5("callBackTimeFn", String(JSON.stringify({
// taskCode:String(taskCode_everyChange.value),
// taskCode:String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
// })));
// wssOpenHandle({
// taskCode:String(taskCode_everyChange.value),
// taskCode:String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
// })
}
pick_select_date.value = val;
console.log("dddddd",val);
//console.log("dddddd",val);
isChange_flag_select_date.value = true;
}
const isChange_flag_select_date = ref(false);
const taskCode_everyChange = ref(Date.now());
const taskCode_everyChange = ref('');
const toNumber = (value) => {
......@@ -542,41 +620,50 @@ const toNumber = (value) => {
return isNaN(num) ? 0 : num; // 如果转换失败则返回0
}
// 点击确认后,处理日期范围变化
const handleDateRangeChange = async (val,flag = false) => {
console.log("0000000.02222",val,val.length,flag);
const handleDateRangeChange = async (val, flag = false) => {
//console.log("0000000.02222",val,typeof val,flag);
// if(typeof val !== 'object') {
// ElMessage({
// message: '请选择正确的日期范围',
// type: 'warning',
// })
// dateRange.value = [];
// return;
// }
jiangerTime.value = 0;
isChange_flag_firstBackDate.value = false;
hasPlayed.value = false;
taskCode_everyChange.value = String(Date.now());
useAppStoreInstance.setglobalSubsystemTaskCode(String(Date.now()));
useAppStoreInstance.setFooterTimeHasedSelectTimeToSub(true);
if (val && val.length > 0) {
if(isChange_flag_select_date.value || useAppStoreInstance.globalisFromTosub) {
wssResponeFlag_isSuccess.value = true;
isPlaying.value = false;
if (!flag) {
taskCode_everyChange.value = String(Date.now());
useAppStoreInstance.setglobalSubsystemTaskCode(taskCode_everyChange.value);
useAppStoreInstance.setGlobalRecordMainSysTaskCode(taskCode_everyChange.value)
useAppStoreInstance.setFooterTimeHasedSelectTimeToSub(true);
}
if (val && val.length > 0) {
if (isChange_flag_select_date.value || useAppStoreInstance.globalisFromTosub) {
wssResponeFlag_isSuccess.value = true;
isPlaying.value = false;
// element plus组件显示加载中
// loading.value = ElLoading.service({
// lock: true,
// text: 'Loading',
// background: 'rgba(0, 0, 0, 0.7)',
// })
if(!flag) {
if (!flag) {
Loading.show()
console.log("cao cao1,Loading.show()");
//console.log("cao cao1,Loading.show()");
}
// Loading.show()
if (val && val.length === 2) {
console.log("cao cao11",val);
//console.log("cao cao11",val);
startDateTime.value = new Date((new Date(val[0])).setSeconds(56)).toISOString();
// preTimeWindowEnd.value = new Date((new Date(val[0])).setSeconds(56+60)).toISOString();
endDateTime.value = new Date((new Date(val[1]))).toISOString();
// console.log("//////////////////",val[0],"4444444444--",pick_select_date.value[0]);
// preTimeWindowEnd.value = new Date((new Date(new Date(selectedStartTime.value))).setSeconds(56+60)).toISOString();
// //console.log("//////////////////",val[0],"4444444444--",pick_select_date.value[0]);
// preTimeWindowEnd.value = new Date((new Date(new Date(selectedStartTime.value))).setSeconds(56+60)).toISOString();
useAppStoreInstance.setglobalSubsystemSelectedStartTime(val);
// useAppStoreInstance.setglobalSubsystemSelectedEndTime(formatDateTime(val[1]));
......@@ -587,66 +674,74 @@ const handleDateRangeChange = async (val,flag = false) => {
isConfirmedWithRange.value = true; // 标记为带范围确认
clearInterval(autoUpdateDateRange.value);
updateTimeline();
// 重置滑块位置到开始位置
startHandlePercent.value = 0;
endHandlePercent.value = 0;
// 强制更新视图
nextTick(() => {
updateSelectedTimes();
});
}
// console.log("*************",pick_select_date.value,"---------",formatDateTime(pick_select_date.value[0]));
if(window.ue5) {
playbackSpeed.value = 1;
if (!flag) {
wssOpenHandle({
isRealtime: is_flag_isRealtime.value? true: false,
isRealtime: is_flag_isRealtime.value ? true : false,
startTime: formatDateTime(val[0]),
endTime: formatDateTime(val[1]),
taskCode: String(taskCode_everyChange.value),
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})
}
if (window.ue5) {
window.ue5("callBackTimeFn", String(JSON.stringify({
isRealtime: is_flag_isRealtime.value? true: false,
isRealtime: is_flag_isRealtime.value ? true : false,
startTime: (formatDateTime(val[0])),
speed:playbackSpeed.value,
speed: playbackSpeed.value,
endTime: (formatDateTime(val[1])),
taskCode: String(taskCode_everyChange.value),
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
currentTime: (formatDateTime(selectedEndTime.value)),
status: isPlaying.value ? "stop" : "continue",
//时间参数
// isRealtime:"false",
// startTime:"2025-11-03 00:00:00",
// endTime:"2025-11-04 00:00:00",
// taskCode:"1111111111"
// isRealtime:"false",
// startTime:"2025-11-03 00:00:00",
// endTime:"2025-11-04 00:00:00",
// taskCode:"1111111111"
})))
}
wssMessageHandle()
// console.log("9999999999",wssResponeFlag_isSuccess.value);
// if (wssResponeFlag_isSuccess.value) {
// toggleAutoPlay();
// }
} else {
} else {
ElMessage({
type: 'warning',
message: `当前时间段未发生变化`,
message: `当前时间段未发生变化,请重新选时间段`,
})
// dateRange.value = [];
}
isChange_flag_select_date.value = false;
} else {
ElMessage({
type: 'warning',
message: `时间范围为空,自动执行最近24小时`,
})
// dateRange.value = [];
} else {
ElMessage({
type: 'warning',
message: `时间范围为空,自动执行最近24小时`,
})
useAppStoreInstance.setGlobalisFromTosub(false);
useAppStoreInstance.setFooterTimeHasedSelectTimeToSub(false);
isDateRangeNotEmpty.value = true;
......@@ -655,25 +750,25 @@ const handleDateRangeChange = async (val,flag = false) => {
isChange_flag_select_date.value = false;//表示已经选过时间段了
playbackSpeed.value = 1;
stopAutoPlay();
// 切换实时模式的时候,之前的播放任务停止
// 切换实时模式的时候,之前的播放任务停止
// wssOpenHandle({
// isRealtime: is_flag_isRealtime.value? true: false,
// // status: "stop",
// // taskCode: String(taskCode_everyChange.value),
// // taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
// })
// 标志实时模式
// if(window.ue5) {
// window.ue5("callBackTimeFn", String(JSON.stringify({
// isRealtime: is_flag_isRealtime.value? true: false,
// // startTime: formatDateTime(pick_select_date.value[0]),
// // endTime: formatDateTime(pick_select_date.value[1]),
// // taskCode: String(taskCode_everyChange.value),
// })))
// wssOpenHandle({
// isRealtime: is_flag_isRealtime.value? true: false,
// })
// }
// if(window.ue5) {
// window.ue5("callBackTimeFn", String(JSON.stringify({
// isRealtime: is_flag_isRealtime.value? true: false,
// // startTime: formatDateTime(pick_select_date.value[0]),
// // endTime: formatDateTime(pick_select_date.value[1]),
// // taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
// })))
// wssOpenHandle({
// isRealtime: is_flag_isRealtime.value? true: false,
// })
// }
// 强制更新视图
nextTick(() => {
updateTimeline();
......@@ -682,38 +777,38 @@ const handleDateRangeChange = async (val,flag = false) => {
};
watch(() => wssResponeFlag_isSuccess.value, (newVal) => {
console.log("我是这里再监测数值变化,",newVal);
if (newVal ) {
startAutoPlay();
//console.log("我是这里再监测数值变化,",newVal);
if (newVal) {
startAutoPlay();
// toggleAutoPlay();
}
else {
console.log("我是watch(())stopAutoPlay()");
console.log("我走了这里6")
//console.log("我是watch(())stopAutoPlay()");
//console.log("我走了这里6")
stopAutoPlay();
// wss.close()
// (wssInstance.value).close()
}
})
const isDateRangeNotEmpty = ref(false);
const autoUpdateDateRange = ref(null);
autoUpdateDateRange.value = setInterval(() => {
autoHandleDateRangeChange([new Date(new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString()),new Date(new Date(Date.now() ).toISOString())]);
autoHandleDateRangeChange([new Date(new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString()), new Date(new Date(Date.now()).toISOString())]);
}, 1000);
watch(() => isDateRangeNotEmpty.value, (newVal) => {
console.log("发生变化",newVal);
//console.log("发生变化",newVal);
if (newVal) {
autoUpdateDateRange.value = setInterval(() => {
// console.log("开启循环",autoUpdateDateRange.value);
autoHandleDateRangeChange([new Date(new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString()),new Date(new Date(Date.now() ).toISOString())]);
// //console.log("开启循环",autoUpdateDateRange.value);
autoHandleDateRangeChange([new Date(new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString()), new Date(new Date(Date.now()).toISOString())]);
}, 1000);
} else {
// console.log("关闭循环",autoUpdateDateRange.value);
} else {
// //console.log("关闭循环",autoUpdateDateRange.value);
clearInterval(autoUpdateDateRange.value);
}
});
......@@ -733,16 +828,16 @@ const generateTimelineDates = () => {
const start = new Date(startDateTime.value);
const end = new Date(endDateTime.value);
const dates = [];
// 重置到当天0点
const current = new Date(start);
current.setHours(0, 0, 0, 0);
while (current <= end) {
dates.push(new Date(current));
current.setDate(current.getDate() + 60);
}
timelineDates.value = dates;
updateSelectedTimes();
};
......@@ -787,14 +882,13 @@ const timeMarkers = computed(() => {
return markers;
});
// 判断标记是否在选中范围内
const isMarkerInSelectedRange = (marker) => {
// console.log("-----------------------,",marker);
// //console.log("-----------------------,",marker);
const markerTime = marker.time.getTime();
const startTime = selectedStartTime.value.getTime();
const endTime = selectedEndTime.value.getTime();
return markerTime >= startTime && markerTime <= endTime;
};
......@@ -820,7 +914,10 @@ const formatDateTime = (date) => {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day} ${formatTime(date)}`;
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
const seconds = String(date.getSeconds()).padStart(2, '0');
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
};
// 修改后的选中区域样式计算属性
......@@ -846,38 +943,38 @@ const selectedRangeStyle = computed(() => {
// 滑块位置计算
const startHandlePosition = computed(() => `${startHandlePercent.value}%`);
// 修改后的 endHandlePosition 计算属性
const endHandlePosition = computed(() => {
// 如果是带范围确认且未在播放状态,则结束滑块与开始滑块重合
if (isConfirmedWithRange.value && !isPlaying.value) {
return `${startHandlePercent.value}%`;
}
// 其他情况下正常显示结束滑块位置
return `${endHandlePercent.value}%`;
});
// 根据百分比计算选中时间
const updateSelectedTimes = () => {
if (!startDateTime.value || !endDateTime.value) return;
const start = new Date(startDateTime.value).getTime();
const totalMs = totalMilliseconds.value;
// 计算开始和结束时间
const startTime = new Date(start + (totalMs * startHandlePercent.value / 100));
const endTime = new Date(start + (totalMs * endHandlePercent.value / 100));
// 更新选中时间
selectedStartTime.value = startTime;
selectedEndTime.value = endTime;
if(!is_flag_isRealtime.value){
if (!is_flag_isRealtime.value) {
useAppStoreInstance.setGlobalTimeLineEndSelectTime(formatDateTime(selectedEndTime.value));
}
// console.log("************",useAppStoreInstance.globalTimeLineEndSelectTime);
// //console.log("************",useAppStoreInstance.globalTimeLineEndSelectTime);
};
// 已经被拖动过
const isDraged = ref(false);
// false: 播放方向为向前播放,true: 播放方向为向后播放
const curplaybackDirection = ref(false);
......@@ -889,70 +986,71 @@ const toggleAutoPlay = () => {
type: 'warning',
message: '当前为实时播放模式,不可执行播放操作!',
})
}else{
} else {
is_flag_playBackwarding.value = true;
let status = 'continue';
if (isPlaying.value) {
status = 'stop';
console.log("我是切换自动播放状态stopAutoPlay()",isPlaying.value);
console.log("我走了这里7")
stopAutoPlay();
if(window.ue5) {
if (isPlaying.value) {
//console.log("我是切换自动播放状态stopAutoPlay()",isPlaying.value);
//console.log("我走了这里7")
stopAutoPlay();
if (window.ue5) {
window.ue5("callBackSpeedFn", String(JSON.stringify({
isRealtime: is_flag_isRealtime.value? true: false,
status: "stop",
speed: playbackSpeed.value,
taskCode: String(taskCode_everyChange.value),
})));
window.ue5("callBackSpeedFn", String(JSON.stringify({
isRealtime: is_flag_isRealtime.value ? true : false,
status: "stop",
speed: playbackSpeed.value,
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})));
// window.ue5("callBackTimeFn", String(JSON.stringify({
// isRealtime: is_flag_isRealtime.value? true: false,
// status: "stop",
// taskCode: String(taskCode_everyChange.value),
// })));
wssOpenHandle({
isRealtime: is_flag_isRealtime.value? true: false,
status: "stop",
taskCode: String(taskCode_everyChange.value),
})
// window.ue5("callBackTimeFn", String(JSON.stringify({
// isRealtime: is_flag_isRealtime.value? true: false,
// status: "stop",
// taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
// })));
wssOpenHandle({
isRealtime: is_flag_isRealtime.value ? true : false,
status: "stop",
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})
}
} else {
isConfirmedWithRange.value = false; // 开始播放时重置标记
jiangerTime.value = 0;
//console.log("我是playForward--4");
playForward();
// //console.log("我走了jumpToSpecificTime,-21",formatDateTime(selectedEndTime.value));
jumpToSpecificTime(new Date(addOneSecond(formatDateTime(selectedEndTime.value), 1)));
// //console.log("我走了jumpToSpecificTime,-21---------2",formatDateTime(selectedEndTime.value),subtractSecondsAndFormat(new Date((formatDateTime(selectedEndTime.value)).replace(' ', 'T') + '+08:00').toString(),-21));
if (window.ue5) {
window.ue5("callBackSpeedFn", String(JSON.stringify({
isRealtime: is_flag_isRealtime.value ? true : false,
status: 'continue',
speed: playbackSpeed.value,
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})));
// window.ue5("callBackTimeFn", String(JSON.stringify({
// isRealtime: is_flag_isRealtime.value? true: false,
// status: 'continue',
// taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
// })));
wssOpenHandle({
isRealtime: is_flag_isRealtime.value ? true : false,
status: 'continue',
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})
}
// 强制更新视图
nextTick(() => {
updateSelectedTimes();
});
}
} else {
status = 'continue';
isConfirmedWithRange.value = false; // 开始播放时重置标记
jiangerTime.value = 0;
playForward();
// console.log("我走了jumpToSpecificTime,-21",formatDateTime(selectedEndTime.value));
jumpToSpecificTime(new Date(addOneSecond(formatDateTime(selectedEndTime.value),1)));
// console.log("我走了jumpToSpecificTime,-21---------2",formatDateTime(selectedEndTime.value),subtractSecondsAndFormat(new Date((formatDateTime(selectedEndTime.value)).replace(' ', 'T') + '+08:00').toString(),-21));
if(window.ue5) {
window.ue5("callBackSpeedFn", String(JSON.stringify({
isRealtime: is_flag_isRealtime.value? true: false,
status: 'continue',
speed: playbackSpeed.value,
taskCode: String(taskCode_everyChange.value),
})));
// window.ue5("callBackTimeFn", String(JSON.stringify({
// isRealtime: is_flag_isRealtime.value? true: false,
// status: 'continue',
// taskCode: String(taskCode_everyChange.value),
// })));
wssOpenHandle({
isRealtime: is_flag_isRealtime.value? true: false,
status: status,
taskCode: String(taskCode_everyChange.value),
})
}
// 强制更新视图
nextTick(() => {
updateSelectedTimes();
});
}
}
};
const is_flag_playForwarding = ref(true);
......@@ -962,19 +1060,19 @@ const is_flag_playBackwarding = ref(true);
// 开始向前播放
const playForward = async () => {
is_flag_playBackwarding.value = true;
if (flag_SetTimeOutCycle.value === null) {
handleSetTimeOutCycle();
}
// if (flag_SetTimeOutCycle.value === null) {
// handleSetTimeOutCycle();
// }
if (1) {
console.log("再次我是开始向前播放stopAutoPlay()",isPlaying.value);
//console.log("再次我是开始向前播放stopAutoPlay()",isPlaying.value);
// stopAutoPlay(); // 先停止当前播放
isPlaying.value = true;
isConfirmedWithRange.value = false; // 重置标记
curplaybackDirection.value = false;
curplaybackDirection.value = false;
playbackDirection.value = 1;
startAutoPlay();
// 强制更新视图
nextTick(() => {
updateSelectedTimes();
......@@ -1006,14 +1104,14 @@ const playForward = async () => {
// resolve()
// }, 2000)
// })
// stopAutoPlay(); // 先停止当前播放
// isPlaying.value = true;
// isConfirmedWithRange.value = false; // 重置标记
// curplaybackDirection.value = true;
// playbackDirection.value = -1;
// startAutoPlay();
// // 强制更新视图
// nextTick(() => {
// updateSelectedTimes();
......@@ -1030,7 +1128,7 @@ const playForward = async () => {
// if (playbackInterval.value) {
// clearInterval(playbackInterval.value);
// }
// // 设置新的定时器,每秒更新一次
// playbackInterval.value = setInterval(() => {
// moveEndHandle();
......@@ -1042,22 +1140,22 @@ const startAutoPlay = () => {
clearInterval(playbackInterval.value);
}
let expectedTime = Date.now() + (1000 );
let expectedTime = Date.now() + (1000 / playbackSpeed.value);
const update = () => {
const drift = Date.now() - expectedTime;
moveEndHandle();
expectedTime += (1000 );
playbackInterval.value = setTimeout(update, Math.max(0, (1000 ) - drift));
expectedTime += (1000 / playbackSpeed.value);
playbackInterval.value = setTimeout(update, Math.max(0, (1000 / playbackSpeed.value) - drift));
};
playbackInterval.value = setTimeout(update, 1000 );
playbackInterval.value = setTimeout(update, 1000 / playbackSpeed.value);
};
// 停止自动播放
const stopAutoPlay = () => {
isPlaying.value = false;
console.log("停止自动播放", playbackInterval.value);
//console.log("停止自动播放", playbackInterval.value);
if (playbackInterval.value) {
clearInterval(playbackInterval.value);
playbackInterval.value = null;
......@@ -1067,7 +1165,7 @@ const stopAutoPlay = () => {
clearInterval(flag_SetTimeOutCycle.value);
flag_SetTimeOutCycle.value = null;
}
// 强制更新视图
nextTick(() => {
updateSelectedTimes();
......@@ -1077,26 +1175,26 @@ const stopAutoPlay = () => {
// 移动结束滑块 - 以秒为单位移动
const moveEndHandle = () => {
if (!isPlaying.value) return;
// console.log("开始进行移动滑块");
// //console.log("开始进行移动滑块");
// 计算每秒对应的百分比增量
const totalMs = totalMilliseconds.value;
const msPerSecond = 1000; // 1秒 = 1000毫秒
const percentPerSecond = (msPerSecond / totalMs) * 100;
// 根据播放方向和速度调整结束滑块位置
const increment = percentPerSecond * playbackSpeed.value * playbackDirection.value;
const increment = percentPerSecond * playbackDirection.value;
// 这里可以尝试
endHandlePercent.value += increment;
// console.log("endHandlePercent.value",endHandlePercent.value);
// //console.log("endHandlePercent.value",endHandlePercent.value);
// 边界检查
if (endHandlePercent.value >= 100 ) {
if (endHandlePercent.value >= 100) {
// 向前播放到达终点,停止播放
endHandlePercent.value = 100;
useAppStoreInstance.setglobalStartWss(false)
console.log("我是移动结束滑块stopAutoPlay()",isPlaying.value);
console.log("我走了这里8")
//console.log("我是移动结束滑块stopAutoPlay()",isPlaying.value);
//console.log("我走了这里8")
stopAutoPlay();
}
// else if (endHandlePercent.value <= 0 && playbackDirection.value < 0) {
......@@ -1104,46 +1202,48 @@ const moveEndHandle = () => {
// endHandlePercent.value = 0;
// stopAutoPlay();
// }
// 确保值在有效范围内
endHandlePercent.value = Math.max(0, Math.min(100, endHandlePercent.value));
// 更新选中时间
updateSelectedTimes();
};
// 切换播放速度
const changeSpeed = () => {
const speeds = [1, 2, 4, 8, 10];
const currentIndex = speeds.indexOf(playbackSpeed.value);
const nextIndex = (currentIndex + 1) % speeds.length;
//console.log("我是changeSpeed",playbackSpeed.value);
speedChangedNormalDataBack.value = true;
// const speeds = [1, 2, 4, 8, 10];
// const currentIndex = speeds.indexOf(playbackSpeed.value);
// const nextIndex = (currentIndex + 1) % speeds.length;
hasPlayed.value = false;
playbackSpeed.value = speeds[nextIndex];
// playbackSpeed.value = speeds[nextIndex];
jiangerTime.value = 0;
if (window.ue5) {
window.ue5("callBackSpeedFn", String(JSON.stringify({
isRealtime: is_flag_isRealtime.value? true: false,
isFastForward: playbackSpeed.value === 1 || playbackSpeed.value === '1'?false:true,
// isRealtime: is_flag_isRealtime.value? true: false,
// isFastForward: playbackSpeed.value === 1 || playbackSpeed.value === '1'?false:true,
speed: playbackSpeed.value,
taskCode: String(taskCode_everyChange.value),
// taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})))
wssOpenHandle({
isRealtime: is_flag_isRealtime.value? true: false,
isFastForward: playbackSpeed.value === 1 || playbackSpeed.value === '1'?false:true,
isRealtime: is_flag_isRealtime.value ? true : false,
isFastForward: playbackSpeed.value === 1 || playbackSpeed.value === '1' ? false : true,
step: playbackSpeed.value,
taskCode: String(taskCode_everyChange.value),
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})
}
// 如果正在播放,重新开始自动播放以应用新的速度
if (isPlaying.value) {
startAutoPlay();
}
};
// 拖动开始
const startDrag = (handle, e) => {
console.log("开始拖动");
//console.log("开始拖动");
is_flag_isRealtime.value = false;
isDateRangeNotEmpty.value = false;
clearInterval(autoUpdateDateRange.value);
......@@ -1151,58 +1251,62 @@ const startDrag = (handle, e) => {
isDragging.value = true;
currentDragHandle.value = handle;
e.preventDefault();
console.log("拖动开始",selectedEndTime.value);
endDrag_opeartioning.value = false
//console.log("拖动开始",selectedEndTime.value);
// 手动拖动时停止自动播放
// if (isPlaying.value) {
// console.log("我是拖动开始stopAutoPlay()",isPlaying.value);
// console.log("我走了这里9")
// //console.log("我是拖动开始stopAutoPlay()",isPlaying.value);
// //console.log("我走了这里9")
// stopAutoPlay();
// }
if(!hasDraged_first_falseToTrue.value) {
// 添加全局事件监听器
window.addEventListener('mousemove', handleDrag);
window.addEventListener('mouseup', endDrag);
}else{
ElMessage.warning("已拖动过,请等待执行下次拖动!");
}
// if(!hasDraged_first_falseToTrue.value) {
// // 添加全局事件监听器
// window.addEventListener('mousemove', handleDrag);
// window.addEventListener('mouseup', endDrag);
// }else{
// ElMessage.warning("已拖动过,请等待执行下次拖动!");
// }
};
// 处理拖动
const handleDrag = (e) => {
if (!isDragging.value || !currentDragHandle.value || !sliderTrack.value) return;
// 手动拖动时停止自动播放
// if (isPlaying.value) {
// console.log("我是处理拖动stopAutoPlay()",isPlaying.value);
// console.log("我走了这里10")
// //console.log("我是处理拖动stopAutoPlay()",isPlaying.value);
// //console.log("我走了这里10")
// stopAutoPlay();
// }
const rect = sliderTrack.value.getBoundingClientRect();
let percentage = ((e.clientX - rect.left) / rect.width) * 100;
// 限制在0-100%之间
percentage = Math.max(0, Math.min(100, percentage));
if (currentDragHandle.value === 'start') {
startHandlePercent.value = percentage;
} else {
endHandlePercent.value = percentage;
}
// 更新选中时间
updateSelectedTimes();
};
const alignTo56Seconds = (date) => {
const d = new Date(date); // 避免修改原对象
const d = new Date(date);
const seconds = d.getSeconds();
if (seconds <= 56) {
// 当前分钟的 56 秒
d.setSeconds(56, 0); // 设置秒为56,毫秒为0
} else {
// 超过56秒,跳到下一分钟的56秒
......@@ -1214,7 +1318,7 @@ const alignTo56Seconds = (date) => {
};
const addOneSecond = (timeStr,sec = 1) => {
const addOneSecond = (timeStr, sec = 1) => {
// 解析输入字符串为 Date 对象(注意:需指定时区为本地时间)
const [datePart, timePart] = timeStr.split(' ');
const [year, month, day] = datePart.split('-').map(Number);
......@@ -1224,7 +1328,7 @@ const addOneSecond = (timeStr,sec = 1) => {
const date = new Date(year, month - 1, day, hour, minute, second);
// 加 1 秒(1000 毫秒)
date.setTime(date.getTime() + sec*1000);
date.setTime(date.getTime() + sec * 1000);
// 格式化回 YYYY-MM-DD HH:mm:ss
const pad = (n) => String(n).padStart(2, '0');
......@@ -1240,83 +1344,87 @@ const addOneSecond = (timeStr,sec = 1) => {
const subtractSecondsAndFormat = (isoString, secondsToSubtract) => {
// 1. 解析 ISO 字符串(它代表 UTC 时间)
const date = new Date(isoString); // 这个 Date 对象内部是 UTC,但 JS 会按本地时区显示
// 2. 减去指定秒数
const newTime = date.getTime() - (secondsToSubtract) ;
// 2. 减去指定秒数
const newTime = date.getTime() - (secondsToSubtract * 1000);
// (毫秒)的话
// const newTime = date.getTime() - secondsToSubtract *1000;
// const newTime = date.getTime() - (secondsToSubtract /1000);
const newDate = new Date(newTime);
// 3. 使用本地时间(中国标准时间)格式化,秒不补零
const year = newDate.getFullYear(); // 本地年
const month = String(newDate.getMonth() + 1).padStart(2, '0');
const day = String(newDate.getDate()).padStart(2, '0');
const hours = String(newDate.getHours()).padStart(2, '0'); // 本地小时(CST)
const hours = String(newDate.getHours()).padStart(2, '0'); // 本地小时
const minutes = String(newDate.getMinutes()).padStart(2, '0');
const seconds = newDate.getSeconds(); // 不补零!
console.log("我走了isoString",isoString,secondsToSubtract,`${year}-${month}-${day} ${hours}:${minutes}:${seconds}`);
//console.log("我走了isoString",isoString,secondsToSubtract,`${year}-${month}-${day} ${hours}:${minutes}:${seconds}`);
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
};
const jumpToNextTime = ref(0);
const hasDraged_first_falseToTrue = ref(false);
// 结束拖动
const hasDraged_first_falseToTrue = ref(false);
const endDrag_opeartioning = ref(false)
const endDrag = () => {
console.log("开始执行");
//console.log("开始执行");
endDrag_opeartioning.value = true
isDragging.value = false;
currentDragHandle.value = null;
hasPlayed.value = false;
// console.log("拖动结束",alignTo56Seconds(selectedEndTime.value),"\n-------",alignTo56Seconds(selectedEndTime.value).toISOString(),"\n-------",jumpToNextTime.value,"\n-------",subtractSecondsAndFormat(alignTo56Seconds(selectedEndTime.value).toISOString(), jumpToNextTime.value));
// //console.log("拖动结束",alignTo56Seconds(selectedEndTime.value),"\n-------",alignTo56Seconds(selectedEndTime.value).toISOString(),"\n-------",jumpToNextTime.value,"\n-------",subtractSecondsAndFormat(alignTo56Seconds(selectedEndTime.value).toISOString(), jumpToNextTime.value));
// setTimeout(() => {
// jumpToSpecificTime(new Date(subtractSecondsAndFormat(alignTo56Seconds(selectedEndTime.value).toISOString(), jumpToNextTime.value)));
// jumpToNextTime.value = 0;
// }, 500);
// hasPlayed.value = true;
// 调用UE5回调函数
// 调用UE5回调函数
if (window.ue5) {
if (isDraged.value) {
// if (!isPlaying.value) {
console.log("开始isPlaying.value发送1111");
window.ue5("callBackTimeFn", String(JSON.stringify({
isRealtime: false,
replayTime: (formatDateTime(selectedEndTime.value)),
taskCode: String(taskCode_everyChange.value),
})));
wssOpenHandle({
isRealtime: false,
replayTime: formatDateTime(selectedEndTime.value),
taskCode: String(taskCode_everyChange.value),
})
window.ue5("callBackTimeFn", String(JSON.stringify({
isRealtime: false,
replayTime: (formatDateTime(selectedEndTime.value)),
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
speed: playbackSpeed.value,
status: isPlaying.value ? "continue" : "stop",
})));
wssOpenHandle({
isRealtime: false,
replayTime: formatDateTime(selectedEndTime.value),
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})
// 发送时轴de 当前时间给ue
window.ue5("callTimeLineCurrentTimeFn", String(JSON.stringify({
year: selectedEndTime.value.getFullYear(),
month: selectedEndTime.value.getMonth() + 1,
day: selectedEndTime.value.getDate(),
hour: selectedEndTime.value.getHours(),
minute: selectedEndTime.value.getMinutes(),
second: selectedEndTime.value.getSeconds(),
})));
window.ue5("callTimeLineCurrentTimeFn", String(JSON.stringify({
year: selectedEndTime.value.getFullYear(),
month: selectedEndTime.value.getMonth() + 1,
day: selectedEndTime.value.getDate(),
hour: selectedEndTime.value.getHours(),
minute: selectedEndTime.value.getMinutes(),
second: selectedEndTime.value.getSeconds(),
})));
// }
} else {
// window.ue5("callBackTimeFn", String(JSON.stringify({})));
}
}
// 移除全局事件监听器
window.removeEventListener('mousemove', handleDrag);
window.removeEventListener('mouseup', endDrag);
updateSelectedTimes();
......@@ -1324,21 +1432,21 @@ const endDrag = () => {
stopAutoPlay();
};
// 更新时间轴
const updateTimeline = () => {
// 验证时间范围
if (new Date(startDateTime.value) >= new Date(endDateTime.value)) {
alert('结束时间必须大于开始时间');
return;
}
generateTimelineDates();
// 重置滑块位置
startHandlePercent.value = 0;
endHandlePercent.value = 0 ;
endHandlePercent.value = 0;
};
// 2025.11.02-06.00.00转换成2025-11-02 06:00:00并返回
const convertTimeFormat = (input) => {
// 使用正则匹配格式:YYYY.MM.DD-HH.mm.ss
const match = input.match(/^(\d{4})\.(\d{2})\.(\d{2})-(\d{2})\.(\d{2})\.(\d{2})$/);
......@@ -1349,11 +1457,11 @@ const convertTimeFormat = (input) => {
const [, year, month, day, hour, minute, second] = match;
return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
};
// 2025-11-02 06:00:00转换成2025.11.02-06.00.00并返回
const trackCycleTimePoint = (timeStr) => {
// 支持传入 Date 对象或字符串
const date = timeStr instanceof Date ? timeStr : new Date(timeStr);
if (isNaN(date.getTime())) {
console.error('Invalid time string:', timeStr);
return '';
......@@ -1368,63 +1476,100 @@ const trackCycleTimePoint = (timeStr) => {
return `${year}.${month}.${day}-${hours}.${minutes}.${seconds}`;
};
const flag_SetTimeOutCycle = ref(null)
const formatDateTimeOne = (timeStr) => {
// 支持传入 Date 对象或字符串
const date = timeStr instanceof Date ? timeStr : new Date(timeStr);
if (isNaN(date.getTime())) {
console.error('Invalid time string:', timeStr);
return '';
}
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
const seconds = String(date.getSeconds()).padStart(2, '0');
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
const handleSetTimeOutCycle = () => {
if (flag_SetTimeOutCycle.value === null) {
flag_SetTimeOutCycle.value =setInterval(() => {
console.log("我走了setInterval",trackCycleTimePoint(formatDateTime(selectedEndTime.value)));
flag_SetTimeOutCycle.value = setInterval(() => {
// //console.log("我走了setInterval",(formatDateTimeOne(selectedEndTime.value)));
if (window.ue5) {
window.ue5("callBackCycleTimePointFn", String(JSON.stringify({
currentTime: trackCycleTimePoint(formatDateTime(selectedEndTime.value)),
// currentTime: trackCycleTimePoint(formatDateTime(selectedEndTime.value)),
currentTime: (formatDateTimeOne(selectedEndTime.value)),
})));
}
}, 1000*2);
}
}, 1000 * 2);
}
}
watch(() => is_flag_isRealtime.value, (newVal, oldVal) => {
if (newVal === false && isPlaying.value) {
handleSetTimeOutCycle();
}else {
// 👇 切换到实时模式,关闭循环
if (flag_SetTimeOutCycle.value !== null) {
clearInterval(flag_SetTimeOutCycle.value);
flag_SetTimeOutCycle.value = null;
}
// watch(() => is_flag_isRealtime.value, (newVal, oldVal) => {
// if (newVal === false && isPlaying.value) {
// handleSetTimeOutCycle();
// }else {
// // 👇 切换到实时模式,关闭循环
// if (flag_SetTimeOutCycle.value !== null) {
// clearInterval(flag_SetTimeOutCycle.value);
// flag_SetTimeOutCycle.value = null;
// }
// }
// });
const tempDateTime = ref(new Date(useAppStoreInstance.globalTimeLineEndSelectTime))
onMounted(() => {
tempDateTime.value = ""
if (useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
tempDateTime.value = useAppStoreInstance.globalTimeLineEndSelectTime
subSysToMainSysFirstDataBack.value = false;
dateRange.value = [new Date((new Date(useAppStoreInstance.globalSubsystemSelectedStartTime[0]))).toISOString(), new Date((new Date(useAppStoreInstance.globalSubsystemSelectedStartTime[1]))).toISOString()]
pick_select_date.value = [new Date(dateRange.value[0]).toString(), new Date(dateRange.value[1]).toString()]
{
handleDateRangeChange(useAppStoreInstance.globalSubsystemSelectedStartTime, true);
// Loading.show();
wssOpenHandle({
isRealtime: is_flag_isRealtime.value ? true : false,
status: 'continue',
messageTypeFalg: true,
taskCode: useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode),
})
}
});
onMounted(() => {
if (useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
const tempDateTime = useAppStoreInstance.globalTimeLineEndSelectTime
console.log("00000000.000从分系统进来",tempDateTime);
dateRange.value = [new Date((new Date(useAppStoreInstance.globalSubsystemSelectedStartTime[0]))).toISOString(),new Date((new Date(useAppStoreInstance.globalSubsystemSelectedStartTime[1]))).toISOString()]
handleDateRangeChange(useAppStoreInstance.globalSubsystemSelectedStartTime);
// Loading.show();
// jumpToSpecificTime(new Date(tempDateTime))
}else {
updateTimeline();
console.log("00000000.111默认进来");
// 初始化时,默认实时传输
if(window.ue5) {
window.ue5("callBackTimeFn", String(JSON.stringify({
// isRealtime:"false",
// startTime:"2025-11-03 00:00:00",
// endTime:"2025-11-04 00:00:00",
// taskCode:"1111111111"
// isRealtime: is_flag_isRealtime.value? true: false,
} else {
updateTimeline();
if (window.ue5) {
window.ue5("callBackTimeFn", String(JSON.stringify({
// isRealtime:"false",
// startTime:"2025-11-03 00:00:00",
// endTime:"2025-11-04 00:00:00",
// taskCode:"1111111111"
isRealtime: is_flag_isRealtime.value,
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
speed: playbackSpeed.value,
status: isPlaying.value ? "continue" : "stop",
// speed: playbackSpeed.value,
// // startTime: formatDateTime(pick_select_date.value[0]),
// // endTime: formatDateTime(pick_select_date.value[1]),
// // taskCode: String(taskCode_everyChange.value),
})))
// wssOpenHandle({
// isRealtime: is_flag_isRealtime.value? true: false,
// })
}
// // taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})))
// wssOpenHandle({
// isRealtime: is_flag_isRealtime.value? true: false,
// })
}
}
useAppStoreInstance.setGlobalisFromTosub(false)
});
......@@ -1439,16 +1584,25 @@ const isFirst = ref(true)
watch(
() => selectedEndTime.value,
(val) => {
// //console.log("每隔111111111122222-----bianhua");
// 检查是否满足条件
if ( isChange_flag_firstBackDate.value) {
console.log("每隔开始进来");
// preTimeWindowEnd.value = new Date((new Date(new Date(selectedStartTime.value))).setSeconds(56+60)).toISOString();
// console.log("我走了",compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value),formatDateTime(selectedEndTime.value),preTimeWindowEnd.value,300%7.8947 ===0.0014);
if (isChange_flag_firstBackDate.value ) {
// preTimeWindowEnd.value = new Date((new Date(new Date(selectedStartTime.value))).setSeconds(56+60)).toISOString();
// //console.log("我走了",compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value),formatDateTime(selectedEndTime.value),preTimeWindowEnd.value,300%7.8947 ===0.0014);
if (window.ue5 ) {
// console.log("每隔1秒,callBackCycleTimePointFn",(formatDateTimeOne(selectedEndTime.value)));
window.ue5("callBackCycleTimePointFn", String(JSON.stringify({
// currentTime: trackCycleTimePoint(formatDateTime(selectedEndTime.value)),
currentTime: (formatDateTimeOne(selectedEndTime.value)),
})));
endDrag_opeartioning.value = false;
}
// 间隔5分钟即300秒,发送时轴de 当前时间给ue
const adjustedStep = Math.ceil(300 / playbackSpeed.value);
if (jiangerTime.value % adjustedStep === 0) {
if (jiangerTime.value % adjustedStep === 0) {
if (window.ue5) {
window.ue5("callTimeLineCurrentTimeFn", String(JSON.stringify({
year: selectedEndTime.value.getFullYear(),
......@@ -1461,37 +1615,39 @@ watch(
}
}
jiangerTime.value += 1;
// console.log("111111111111111",formatDateTime(selectedEndTime.value), preTimeWindowEnd.value);
if (compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value)) {
console.log("我走了这里2")
if(isPlaying.value){
stopAutoPlay();
hasPlayed.value = false;
isChange_flag_firstBackDate.value = false;
}
// clearInterval(intervalTimer.value);
// intervalTimer.value = null;
}
// if (!intervalTimer.value) {
// intervalTimer.value = setInterval(() => {
// console.log("每隔一秒执行一次逻辑",compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value));
// // 在这里执行你需要的逻辑
// if (compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value)) {
// stopAutoPlay();
// clearInterval(intervalTimer.value);
// intervalTimer.value = null;
// hasPlayed.value = false;
// isChange_flag_firstBackDate.value = false;
// }
// }, 1000*10);
// }
}
//console.log("我走了这里2")
if (isPlaying.value) {
stopAutoPlay();
hasPlayed.value = false;
isChange_flag_firstBackDate.value = false;
}
// clearInterval(intervalTimer.value);
// intervalTimer.value = null;
}
// if (!intervalTimer.value) {
// intervalTimer.value = setInterval(() => {
// //console.log("每隔一秒执行一次逻辑",compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value));
// // 在这里执行你需要的逻辑
// if (compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value)) {
// stopAutoPlay();
// clearInterval(intervalTimer.value);
// intervalTimer.value = null;
// hasPlayed.value = false;
// isChange_flag_firstBackDate.value = false;
// }
// }, 1000*10);
// }
}
// else {
// // 如果条件不满足,清除定时器
// if (intervalTimer.value) {
// console.log("清理定时器");
// //console.log("清理定时器");
// clearInterval(intervalTimer.value);
// intervalTimer.value = null;
// }
......@@ -1505,42 +1661,45 @@ const getDayRangeFromTime = (timeStr) => {
const [year, month, day] = datePart.split('-').map(Number);
const startOfDay = new Date(year, month - 1, day, 0, 0, 0);
const endOfDay = new Date(year, month - 1, day + 1, 0, 0, 0);
return [startOfDay,endOfDay];
return [startOfDay, endOfDay];
};
onUnmounted(() => {
stopAutoPlay();
window.removeEventListener('mousemove', handleDrag);
window.removeEventListener('mouseup', endDrag);
useAppStoreInstance.setGlobalSubsystemSelectedTimeRange(getDayRangeFromTime(useAppStoreInstance.globalTimeLineEndSelectTime));
console.log("jieshuli 1,组件卸载时要发暂停",getDayRangeFromTime(useAppStoreInstance.globalTimeLineEndSelectTime)[0],getDayRangeFromTime(useAppStoreInstance.globalTimeLineEndSelectTime)[1]);
if(is_flag_isRealtime.value){
//console.log("jieshuli 1,组件卸载时要发暂停",getDayRangeFromTime(useAppStoreInstance.globalTimeLineEndSelectTime)[0],getDayRangeFromTime(useAppStoreInstance.globalTimeLineEndSelectTime)[1]);
if (is_flag_isRealtime.value) {
// 实时传输时,组件卸载时要发暂停
}else{
} else {
// 非实时传输时,组件卸载时要发暂停
if(window.ue5) {
if (window.ue5) {
window.ue5("callBackSpeedFn", String(JSON.stringify({
isRealtime: is_flag_isRealtime.value? true: false,
isRealtime: is_flag_isRealtime.value ? true : false,
status: "stop",
speed: playbackSpeed.value,
taskCode: String(taskCode_everyChange.value),
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})));
// window.ue5("callBackTimeFn", String(JSON.stringify({
// isRealtime: is_flag_isRealtime.value? true: false,
// status: "stop",
// taskCode: String(taskCode_everyChange.value),
// })));
// window.ue5("callBackTimeFn", String(JSON.stringify({
// isRealtime: is_flag_isRealtime.value? true: false,
// status: "stop",
// taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
// })));
wssOpenHandle({
isRealtime: is_flag_isRealtime.value? true: false,
isRealtime: is_flag_isRealtime.value ? true : false,
status: "stop",
taskCode: String(taskCode_everyChange.value),
taskCode: String(taskCode_everyChange.value) === "" ? useAppStoreInstance.globalRecordMainSysTaskCode || (useAppStoreInstance.globalSubsystemTaskCode) : String(taskCode_everyChange.value),
})
}
}
});
</script>
......@@ -1556,7 +1715,7 @@ onUnmounted(() => {
/* font-family: 'Consolas', monospace; */
background-color: #000000;
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
/* box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); */
}
.timeline-controls {
......@@ -1577,40 +1736,46 @@ onUnmounted(() => {
color: #ababab;
}
.right_block{
.right_block {
display: flex;
justify-content: space-between;
padding: 0 10px;
}
.right_block_center{
.right_block_center {
margin: 0 30px;
}
.right_block_conter_btn{
.right_block_conter_btn {
border: none;
}
.right_block_conter_btn_playbackSpeed{
.right_block_conter_btn_playbackSpeed {
background: none;
border: none;
color: rgba(255, 255, 255, 1);
font-size: 20px;
}
.right_block_conter_btn{
background-color: #404040 ;
.right_block_conter_btn {
background-color: #404040;
}
.right_block_conter_btn:hover{
background-color: #8b8b8b ;
.right_block_conter_btn:hover {
background-color: #8b8b8b;
}
.right_block_conter_btn_center{
background-color: #2e7dff ;
.right_block_conter_btn_center {
background-color: #2e7dff;
}
.right_block_conter_btn_center:hover{
background-color: #8CB8FF ;
.right_block_conter_btn_center:hover {
background-color: #8CB8FF;
}
:deep(.right_block_confirm_btn) {
background: linear-gradient(to bottom, #2E7DFF 0%, #000000 100%) !important;
border:none;
border: none;
border-radius: 0;
border-bottom: 1px solid #062ee1 !important;
color: rgba(255, 255, 255, 1);
......@@ -1768,8 +1933,8 @@ onUnmounted(() => {
/* 当鼠标悬停在.handle-rail上时显示.tooltip */
.handle-rail:hover .handle-tooltip,
.handle-rail:hover + .handle-tooltip,
.handle-rail:hover ~ .handle-tooltip {
.handle-rail:hover+.handle-tooltip,
.handle-rail:hover~.handle-tooltip {
opacity: 1;
}
......@@ -1789,23 +1954,48 @@ onUnmounted(() => {
background-color: #1a1a1a !important;
color: #ffffff !important;
}
:deep(.el-range-input){
:deep(.el-range-input) {
color: #ffffff !important;
}
:deep(.el-range-separator){
:deep(.el-range-separator) {
color: #ffffff !important;
}
:deep(.right_block_conter_btn_center) {
border:none;
border: none;
}
:deep(.right_block_conter_btn_center:focus) {
outline:none;
outline: none;
}
:deep(.right_block_conter_btn_playbackSpeed) {
border:none;
border: none;
}
:deep(.right_block_conter_btn_playbackSpeed:focus) {
outline:none;
outline: none;
}
:deep(.satellite-select .el-select__wrapper) {
height: 12.5px;
}
:deep(.satellite-select .el-select__selected-item) {
color: #ffffff;
/* font-size: 10px; */
}
:deep(.satellite-select .el-tooltip__trigger) {
background-color: #000000 !important;
color: #f9fafd !important;
border: none !important;
box-shadow: none;
}
:deep(.el-select__suffix) {
opacity: 0;
}
</style>
\ No newline at end of file
......@@ -44,7 +44,7 @@
<img src="@/assets/images/footers/videoPlay_left.png" alt="" style="width: 8px; height: 10px;" />
</el-icon>
</el-button> -->
<!-- <el-button
<el-button
circle
class="right_block_conter_btn_center"
@click="toggleAutoPlay"
......@@ -54,7 +54,7 @@
<img v-if="!isPlaying" src="@/assets/images/footers/videoPause.png" alt="" style="width: 8px; height: 10px;" />
<img v-if="isPlaying" src="@/assets/images/footers/videoPlay.png" alt="" style="width: 8px; height: 10px;" />
</el-icon>
</el-button> -->
</el-button>
<!-- <el-button size="mini" @click="jumpToSpecificTime(new Date('2025-11-03 00:00:00'))">时间</el-button> -->
<!-- <el-button circle class="right_block_conter_btn" @click="playForward">
<el-button circle class="right_block_conter_btn" @click="playForward">
......@@ -65,6 +65,21 @@
</div>
<!-- <el-button size="mini" circle @click="changeSpeed" :disabled="is_flag_isRealtime" class="right_block_conter_btn_playbackSpeed" style="background: none;">x{{ playbackSpeed }}</el-button> -->
<el-select v-model="playbackSpeed" style="width: 70px" class="satellite-select"
:disabled="is_flag_isRealtime"
>
<el-option
v-for="item in playbackSpeedOptions"
:key="item.value"
:label="item.label"
:value="item.value"
@click="()=>{
//////console.log('我是喧杂',playbackSpeed);
changeSpeed()
}"
/>
</el-select>
</div>
</div>
</div>
......@@ -111,7 +126,7 @@
<div
class="slider-handle end-handle"
:style="{ left: endHandlePosition }"
@mousedown="startDrag('end', $event)"
>
<div class="handle-rail">
<div class="handle-tooltip" :class="{'handle-tooltip_auto': !is_flag_isRealtime}">{{ formatDateTime(selectedEndTime) }}</div>
......@@ -128,15 +143,54 @@
import { VideoPlay, VideoPause, CaretLeft, CaretRight } from '@element-plus/icons-vue';
import { Hide, View } from '@element-plus/icons-vue'
import { ElLoading, ElMessage } from 'element-plus'
import Loading from '@/pages/all/components/loadingComponent/index.js'
import { ref, onMounted, onUnmounted, computed, watch, nextTick } from 'vue';
import SubLoading from '@/pages/all/components/loadingComponent1/index.js'
import { ref, onMounted, onUnmounted, computed, watch, nextTick, onBeforeMount } from 'vue';
// import wss from '@/utils/subSystemRequestSocket.js'
import useAppStore from '@/store/module/app'
import SubWss from '@/utils/subSystemRequestSocket.js'
import { useRoute } from 'vue-router';
import { fa } from 'element-plus/es/locales.mjs';
const allSubContent = ref([])
const LeftTopAllSubContentKey = ref([])
const LeftTopOriginAllSubContentKey = ref([])
const RightTopAllSubContentKey = ref([])
const RightTopOriginAllSubContentKey = ref([])
const RightBottomAllSubContentKey = ref([])
const RightBottomOriginAllSubContentKey = ref([])
const MiddleAllSubContentKey = ref([])
const MiddleOriginAllSubContentKey = ref([])
const OriginallMidderStationNameKeyInfo = ref([])
const allMidderStationNameKeyInfo = ref([])
const subWssInstance = ref(SubWss)
const playbackSpeedOptions = ref([
{
value: 1,
label: '1x'
},
{
value: 2,
label: '2x'
},
{
value: 4,
label: '4x'
},
{
value: 8,
label: '8x'
},
{
value: 10,
label: '10x'
},
])
// 获取要跳转的时间点
const subtractSeconds = (timeStr, sec) => {
// 解析输入字符串为 Date 对象(注意:需指定时区为本地时间)
......@@ -175,7 +229,7 @@ const jumpToSpecificTime = (targetTime) => {
// 停止当前自动播放
if (isPlaying.value) {
console.log("我走了这里3")
////console.log("我走了这里3")
stopAutoPlay();
}
......@@ -216,17 +270,17 @@ const jumpToSpecificTime = (targetTime) => {
// 强制更新视图
// nextTick(() => {
// updateSelectedTimes();
// console.log("跳转到指定时间:", targetTime, "滑块位置:", percentPosition);
// //////console.log("跳转到指定时间:", targetTime, "滑块位置:", percentPosition);
// // 调用UE5回调函数
wssOpenHandle({
// isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
isFastForward: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
speed: useAppStoreInstance.globalSubsystemSpeed,
replayTime: formatDateTime(selectedEndTime.value),
taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
satelliteId: useAppStoreInstance.globalSatelliteSearchID,
})
// wssOpenHandle({
// // isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
// isFastForward: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
// speed: useAppStoreInstance.globalSubsystemSpeed,
// replayTime: formatDateTime(selectedEndTime.value),
// taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
// satelliteId: useAppStoreInstance.globalSatelliteSearchID,
// })
// });
// playForward();
// toggleAutoPlay();
......@@ -249,15 +303,22 @@ const route = useRoute();
const useAppStoreInstance = useAppStore();
const isFlagTimeLineShow = ref(true);
const wssOpenHandle = (data) => {
// console.log('wssOpenHandle', wss,wss.readyState, WebSocket.OPEN);
if (SubWss.readyState === WebSocket.OPEN) {
//////console.log('subwssOpenHandle', subWssInstance.value,subWssInstance.value.readyState, WebSocket.OPEN);
if ((subWssInstance.value).readyState === WebSocket.OPEN) {
// 如果连接已打开,直接发送数据
SubWss.send(JSON.stringify(data));
} else
(subWssInstance.value).send(JSON.stringify(data));
} else if ((subWssInstance.value).readyState === WebSocket.CLOSED) {
(subWssInstance.value) = new WebSocket((subWssInstance.value).url);
(subWssInstance.value).onopen = () => {
(subWssInstance.value).send(JSON.stringify(data));
};
wssMessageHandle()
}else
{
// 否则等待连接打开后再发送
SubWss.onopen = () => {
SubWss.send(JSON.stringify(data));
(subWssInstance.value).onopen = () => {
(subWssInstance.value).send(JSON.stringify(data));
};
}
};
......@@ -266,19 +327,21 @@ const hasPlayed = ref(false);
const loading = ref('');
const wssMessageHandle = () => {
SubWss.onmessage = (event) => {
(subWssInstance.value).onmessage = (event) => {
const Jsondata = JSON.parse(event.data);
console.log("我走了这里,收到数据1");
////console.log("我走了这里,收到数据1");
// wssOpenHandle({
// type: "confirm",
// taskCode: toNumber(useAppStoreInstance.globalSubsystemTaskCode),
// clientType: "web"
// })
let flagToNext = 0
SubLoading.hide()
if (Jsondata.type === 'status') {
console.log("我走了这里,收到数据2");
//////console.log("我走了这里,收到数据2");
if (Jsondata.status === 'STOP') {
console.log("我走了这里4")
////console.log("我走了这里4")
stopAutoPlay()
hasPlayed.value = false;
}
......@@ -289,58 +352,121 @@ const loading = ref('');
}
}
else if (Jsondata.type === 'no_data') {
console.log("我走了这里,收到数据3");
//////console.log("我走了这里,收到数据3");
isChange_flag_firstBackDate.value = false;
// wssResponeFlag_isSuccess.value = false;
// 关闭eleplate loading
// (loading.value).close()
Loading.hide()
SubLoading.hide()
ElMessage({
type: 'error',
message: `已暂停,没有查询到该时间段的历史数据!!!`,
})
console.log("我走了这里5")
////console.log("我走了这里5")
stopAutoPlay();
// hasPlayed.value = false;
// console.log("获取的wssResponeFlag_isSuccess信息2:", wssResponeFlag_isSuccess.value);
// //////console.log("获取的wssResponeFlag_isSuccess信息2:", wssResponeFlag_isSuccess.value);
}
else if (Jsondata.type === 'data_end') {
console.log("我走了这里,收到数据4");
//////console.log("我走了这里,收到数据4");
isChange_flag_firstBackDate.value = false;
Loading.hide()
SubLoading.hide()
ElMessage({
type: 'error',
message: `已暂停,数据推送完成!!!`,
})
console.log("我走了这里6")
////console.log("我走了这里6")
stopAutoPlay();
}else {
}else
// if (Jsondata.type === 'subsystem_data') {
// LeftTopAllSubContentKey.value = []
// allSubContent.value = []
// allSubContent.value = Jsondata
// allSubContent.value.data[`${dataPickEndTime.value}`] = []
// LeftTopAllSubContentKey.value = Object.keys(allSubContent.value.data)
//////console.log("添加无关的key",allSubContent.value);
// SubLoading.hide()
// }
// else
{
LeftTopAllSubContentKey.value = []
allSubContent.value = []
LeftTopOriginAllSubContentKey.value = []
RightTopAllSubContentKey.value = []
RightTopOriginAllSubContentKey.value = []
RightBottomAllSubContentKey.value = []
RightBottomOriginAllSubContentKey.value = []
MiddleAllSubContentKey.value = []
MiddleOriginAllSubContentKey.value = []
allSubContent.value = Jsondata
if (allSubContent.value?.data) {
LeftTopAllSubContentKey.value = Object.keys(allSubContent.value?.data)
LeftTopOriginAllSubContentKey.value = Object.keys(allSubContent.value?.data)
LeftTopAllSubContentKey.value.unshift(dataPickStartTime.value)
LeftTopAllSubContentKey.value.push(dataPickEndTime.value)
}
if (allSubContent.value?.arcSegmentInfoArray) {
RightTopAllSubContentKey.value = Object.keys(allSubContent.value?.arcSegmentInfoArray?.data)
RightTopOriginAllSubContentKey.value = Object.keys(allSubContent.value?.arcSegmentInfoArray?.data)
RightTopAllSubContentKey.value.unshift(dataPickStartTime.value)
RightTopAllSubContentKey.value.push(dataPickEndTime.value)
}
if (allSubContent.value?.satelliteAlertInfoArray) {
RightBottomAllSubContentKey.value = Object.keys(allSubContent.value?.satelliteAlertInfoArray?.data)
RightBottomOriginAllSubContentKey.value = Object.keys(allSubContent.value?.satelliteAlertInfoArray?.data)
RightBottomAllSubContentKey.value.unshift(dataPickStartTime.value)
RightBottomAllSubContentKey.value.push(dataPickEndTime.value)
}
if (allSubContent.value?.groundNetworkElementStatus?.controlTasks) {
allMidderStationNameKeyInfo.value = Object.keys(allSubContent.value?.groundNetworkElementStatus?.controlTasks)
OriginallMidderStationNameKeyInfo.value = Object.keys(allSubContent.value?.groundNetworkElementStatus?.controlTasks)
allMidderStationNameKeyInfo.value.unshift(dataPickStartTime.value)
allMidderStationNameKeyInfo.value.push(dataPickEndTime.value)
}
// console.log("1111111111111",OriginallMidderStationNameKeyInfo.value,allMidderStationNameKeyInfo.value);
// MiddleAllSubContentKey.value = Object.keys(allSubContent.value?.data)
// MiddleOriginAllSubContentKey.value = Object.keys(allSubContent.value?.data)
// MiddleAllSubContentKey.value.unshift(dataPickStartTime.value)
// MiddleAllSubContentKey.value.push(dataPickEndTime.value)
//////console.log("添加无关的key",allSubContent.value );
// 此时的后端还没写确认的逻辑
// wssOpenHandle({
// type: "confirm",
// taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
// clientType: "web"
// })
console.log("我走了这里,收到数据4");
//////console.log("我走了这里,收到数据4");
if (Jsondata.nextTimestamp || Jsondata.timeWindowEnd) {
preTimeWindowEnd.value = Jsondata.nextTimestamp || Jsondata.timeWindowEnd ;
}
isChange_flag_firstBackDate.value = true;
useAppStoreInstance.setSubsystemSocketContent(Jsondata)
// useAppStoreInstance.setSubsystemSocketContent(Jsondata)
// if(loading.value){
// (loading.value).close()
// }
Loading.hide()
SubLoading.hide()
// if (flagToNext !== 0) {
// clearTimeout(flagToNext);
// }
// startAutoPlay();
if (endDateTime.value === selectedEndTime.value.toISOString()) {
stopAutoPlay();
console.log("我走了这里7")
////console.log("我走了这里7")
}else{
if (!hasPlayed.value) {
playForward();
......@@ -349,6 +475,7 @@ const loading = ref('');
}
}
// 使用 Promise 包装 setTimeout
// await new Promise(resolve => {
// setTimeout(() => {
......@@ -356,40 +483,40 @@ const loading = ref('');
// resolve()
// }, 2000)
// })
// console.log('我是timer获取的wssRespone:', data);
// //////console.log('我是timer获取的wssRespone:', data);
// if (data.type === 'error') {
// wssResponeFlag_isSuccess.value = false;
// (loading.value).close()
// message.error("已暂停,没有查询到该时间段的历史数据!!!");
// // console.log("获取的wssResponeFlag_isSuccess信息1:", wssResponeFlag_isSuccess.value);
// // //////console.log("获取的wssResponeFlag_isSuccess信息1:", wssResponeFlag_isSuccess.value);
// useAppStoreInstance.setglobalStartWss(false)
// // 处理任务数据
// }
// if (data.type === 'history') {
// // 处理日志数据
// // console.log("获取的wssResponeFlag_isSuccess信息2:", wssResponeFlag_isSuccess.value);
// // //////console.log("获取的wssResponeFlag_isSuccess信息2:", wssResponeFlag_isSuccess.value);
// useAppStoreInstance.setglobalStartWss(true)
// // playForward();
// startAutoPlay();
// // toggleAutoPlay();
// console.log("这里是startAutoPlay()");
// //////console.log("这里是startAutoPlay()");
// if(loading.value){
// (loading.value).close()
// }else{
// console.log("99999999999999",loading.value);
// }
wssResponeFlag_isSuccess.value = true;
// message.success("同步时间轴数据状态成功!!!");
// console.log('我是history的数据:', data);
// //////console.log('我是history的数据:', data);
// }
// if (data.type === 'EndProcess') {
// useAppStoreInstance.setglobalStartWss(false)
// // console.log('我是left,type == time获取的wssRespone:', JSONdata, typeof JSONdata.time);
// // console.log('我是left,type == time获取的wssRespone:', JSONdata.time, typeof JSONdata.time);
// // console.log('我是left,type == time获取的wssRespone:', JSONdata.time.toLocaleString(), typeof JSONdata.time.toLocaleString());
// // //////console.log('我是left,type == time获取的wssRespone:', JSONdata, typeof JSONdata.time);
// // //////console.log('我是left,type == time获取的wssRespone:', JSONdata.time, typeof JSONdata.time);
// // //////console.log('我是left,type == time获取的wssRespone:', JSONdata.time.toLocaleString(), typeof JSONdata.time.toLocaleString());
// }
// 处理服务器返回的数据后续处理是否暂停处理
......@@ -492,7 +619,7 @@ const pick_select_date = ref();//未使用
// // })
// }
// pick_select_date.value = val;
// console.log("dddddd",val);
// //////console.log("dddddd",val);
// isChange_flag_select_date.value = true;
// }
......@@ -507,7 +634,7 @@ const toNumber = (value) => {
// 点击确认后,处理日期范围变化
const handleDateRangeChange = async (val) => {
// taskCode_everyChange.value = String(Date.now());
// console.log("/****/*/*/*/*",val);
// //////console.log("/****/*/*/*/*",val);
jiangerTime.value = 0;
isChange_flag_firstBackDate.value = false;
hasPlayed.value = false;
......@@ -522,9 +649,9 @@ const handleDateRangeChange = async (val) => {
// text: 'Loading',
// background: 'rgba(0, 0, 0, 0.7)',
// })
Loading.show()
SubLoading.show()
if (val && val.length === 2) {
console.log("cao cao11111111111111111",val[0]);
//////console.log("cao cao11111111111111111",val[0]);
startDateTime.value = new Date((new Date(val[0])).setSeconds(56)).toISOString();
......@@ -569,7 +696,7 @@ const handleDateRangeChange = async (val) => {
wssMessageHandle()
// console.log("9999999999",wssResponeFlag_isSuccess.value);
// if (wssResponeFlag_isSuccess.value) {
// toggleAutoPlay();
......@@ -611,7 +738,7 @@ const handleDateRangeChange = async (val) => {
};
watch(() => wssResponeFlag_isSuccess.value, (newVal) => {
console.log("我是这里再监测数值变化,",newVal);
//////console.log("我是这里再监测数值变化,",newVal);
if (newVal ) {
......@@ -620,8 +747,8 @@ watch(() => wssResponeFlag_isSuccess.value, (newVal) => {
}
else {
console.log("我是watch(())stopAutoPlay()");
console.log("我走了这里8")
//////console.log("我是watch(())stopAutoPlay()");
////console.log("我走了这里8")
stopAutoPlay();
// wss.close()
}
......@@ -634,11 +761,11 @@ autoUpdateDateRange.value = setInterval(() => {
}, 1000);
watch(() => isDateRangeNotEmpty.value, (newVal) => {
console.log("发生变化",newVal);
//////console.log("发生变化",newVal);
if (newVal) {
autoUpdateDateRange.value = setInterval(() => {
console.log("开启循环",autoUpdateDateRange.value);
//////console.log("开启循环",autoUpdateDateRange.value);
// const realtimeStartTime = new Date(new Date(Date.now() - 3*24 * 60 * 60 * 1000).toISOString());
// const realtimeEndTime = new Date(new Date(Date.now() ).toISOString());
......@@ -649,7 +776,7 @@ watch(() => isDateRangeNotEmpty.value, (newVal) => {
autoHandleDateRangeChange([new Date(new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString()),new Date(new Date(Date.now() ).toISOString())]);
}, 1000);
} else {
console.log("关闭循环",autoUpdateDateRange.value);
//////console.log("关闭循环",autoUpdateDateRange.value);
clearInterval(autoUpdateDateRange.value);
}
});
......@@ -805,6 +932,10 @@ const updateSelectedTimes = () => {
selectedStartTime.value = startTime;
selectedEndTime.value = endTime;
// 调用UE5回调函数
if (window.ue5) {
if (isDraged.value) {
......@@ -839,39 +970,39 @@ const toggleAutoPlay = () => {
let status = 'continue';
if (isPlaying.value) {
status = 'stop';
console.log("我是切换自动播放状态stopAutoPlay()",isPlaying.value);
console.log("我走了这里9")
//////console.log("我是切换自动播放状态stopAutoPlay()",isPlaying.value);
////console.log("我走了这里9")
stopAutoPlay();
if (window.ue5) {
window.ue5("callBackSpeedFn", String(JSON.stringify({
isRealtime: is_flag_isRealtime.value? true: false,
status: "stop",
step: playbackSpeed.value,
taskCode: String(taskCode_everyChange.value),
})));
// if (window.ue5) {
// window.ue5("callBackSpeedFn", String(JSON.stringify({
// isRealtime: is_flag_isRealtime.value? true: false,
// status: "stop",
// step: playbackSpeed.value,
// taskCode: String(taskCode_everyChange.value),
// })));
}
// }
} else {
status = 'continue';
isConfirmedWithRange.value = false; // 开始播放时重置标记
playForward();
if(window.ue5) {
window.ue5("callBackSpeedFn", String(JSON.stringify({
isRealtime: is_flag_isRealtime.value? true: false,
status: 'continue',
step: playbackSpeed.value,
taskCode: String(taskCode_everyChange.value),
})));
}
wssOpenHandle({
// isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
status: 'continue',
speed: useAppStoreInstance.globalSubsystemSpeed,
taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
satelliteId: useAppStoreInstance.globalSatelliteSearchID,
})
// if(window.ue5) {
// window.ue5("callBackSpeedFn", String(JSON.stringify({
// isRealtime: is_flag_isRealtime.value? true: false,
// status: 'continue',
// step: playbackSpeed.value,
// taskCode: String(taskCode_everyChange.value),
// })));
// }
// wssOpenHandle({
// // isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
// status: 'continue',
// speed: useAppStoreInstance.globalSubsystemSpeed,
// taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
// satelliteId: useAppStoreInstance.globalSatelliteSearchID,
// })
// 强制更新视图
nextTick(() => {
updateSelectedTimes();
......@@ -891,7 +1022,7 @@ const playForward = async () => {
is_flag_playBackwarding.value = true;
if (1) {
console.log("我是开始向前播放stopAutoPlay()",isPlaying.value);
//////console.log("我是开始向前播放stopAutoPlay()",isPlaying.value);
// stopAutoPlay(); // 先停止当前播放
isPlaying.value = true;
isConfirmedWithRange.value = false; // 重置标记
......@@ -973,27 +1104,27 @@ const startAutoPlay = () => {
clearInterval(playbackInterval.value);
}
let expectedTime = Date.now() + (1000 );
let expectedTime = Date.now() + (1000 / playbackSpeed.value);
const update = () => {
const drift = Date.now() - expectedTime;
moveEndHandle();
expectedTime += (1000 );
playbackInterval.value = setTimeout(update, Math.max(0, (1000 ) - drift));
expectedTime += (1000 / playbackSpeed.value);
playbackInterval.value = setTimeout(update, Math.max(0, (1000 / playbackSpeed.value) - drift));
};
playbackInterval.value = setTimeout(update, 1000 );
playbackInterval.value = setTimeout(update, (1000 / playbackSpeed.value));
};
// 停止自动播放
const stopAutoPlay = () => {
isPlaying.value = false;
console.log("停止自动播放", playbackInterval.value);
wssOpenHandle({
// isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
status: 'stop',
taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
satelliteId: useAppStoreInstance.globalSatelliteSearchID,
})
//////console.log("停止自动播放", playbackInterval.value);
// wssOpenHandle({
// // isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
// status: 'stop',
// taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
// satelliteId: useAppStoreInstance.globalSatelliteSearchID,
// })
if (playbackInterval.value) {
clearInterval(playbackInterval.value);
playbackInterval.value = null;
......@@ -1009,7 +1140,7 @@ const stopAutoPlay = () => {
// 移动结束滑块 - 以秒为单位移动
const moveEndHandle = () => {
if (!isPlaying.value) return;
// console.log("开始进行移动滑块");
// //////console.log("开始进行移动滑块");
// 计算每秒对应的百分比增量
const totalMs = totalMilliseconds.value;
......@@ -1017,17 +1148,17 @@ const moveEndHandle = () => {
const percentPerSecond = (msPerSecond / totalMs) * 100;
// 根据播放方向和速度调整结束滑块位置
const increment = percentPerSecond * playbackSpeed.value * playbackDirection.value;
const increment = percentPerSecond * playbackDirection.value;
endHandlePercent.value += increment;
// console.log("endHandlePercent.value",endHandlePercent.value);
// //////console.log("endHandlePercent.value",endHandlePercent.value);
// 边界检查
if (endHandlePercent.value >= 100 ) {
// 向前播放到达终点,停止播放
endHandlePercent.value = 100;
useAppStoreInstance.setglobalStartWss(false)
console.log("我是移动结束滑块stopAutoPlay()",isPlaying.value);
console.log("我走了这里10")
//////console.log("我是移动结束滑块stopAutoPlay()",isPlaying.value);
////console.log("我走了这里10")
stopAutoPlay();
}
// wssOpenHandle({
......@@ -1053,26 +1184,26 @@ const moveEndHandle = () => {
// 切换播放速度
const changeSpeed = () => {
const speeds = [1, 2, 4, 8, 10];
const currentIndex = speeds.indexOf(playbackSpeed.value);
const nextIndex = (currentIndex + 1) % speeds.length;
playbackSpeed.value = speeds[nextIndex];
// const speeds = [1, 2, 4, 8, 10];
// const currentIndex = speeds.indexOf(playbackSpeed.value);
// const nextIndex = (currentIndex + 1) % speeds.length;
// playbackSpeed.value = speeds[nextIndex];
useAppStoreInstance.setglobalSubsystemSpeed(playbackSpeed.value)
if (window.ue5) {
window.ue5("callBackSpeedFn", String(JSON.stringify({
isFastForward: useAppStoreInstance.globalSubsystemIsFastForward === 1 || useAppStoreInstance.globalSubsystemIsFastForward === '1'? false: true,
step: playbackSpeed.value,
taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
satelliteId: useAppStoreInstance.globalSatelliteSearchID,
})))
wssOpenHandle({
// isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
isFastForward: useAppStoreInstance.globalSubsystemIsFastForward === 1 || useAppStoreInstance.globalSubsystemIsFastForward === '1'? false: true,
step: playbackSpeed.value,
taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
satelliteId: useAppStoreInstance.globalSatelliteSearchID,
})
// window.ue5("callBackSpeedFn", String(JSON.stringify({
// isFastForward: useAppStoreInstance.globalSubsystemIsFastForward === 1 || useAppStoreInstance.globalSubsystemIsFastForward === '1'? false: true,
// step: playbackSpeed.value,
// taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
// satelliteId: useAppStoreInstance.globalSatelliteSearchID,
// })))
// wssOpenHandle({
// // isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
// isFastForward: playbackSpeed.value === 1 || playbackSpeed.value === '1'? false: true,
// step: playbackSpeed.value,
// taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
// satelliteId: useAppStoreInstance.globalSatelliteSearchID,
// })
}
// 如果正在播放,重新开始自动播放以应用新的速度
......@@ -1083,7 +1214,10 @@ const changeSpeed = () => {
// 拖动开始
const startDrag = (handle, e) => {
console.log("开始拖动");
// if (is_flag_isRealtime.value) {
// return
// }
//////console.log("开始拖动");
is_flag_isRealtime.value = false;
useAppStoreInstance.setglobalSubsystemIsFastForward(false)
isDateRangeNotEmpty.value = false;
......@@ -1094,15 +1228,18 @@ const startDrag = (handle, e) => {
e.preventDefault();
// 手动拖动时停止自动播放
if (isPlaying.value) {
console.log("我是拖动开始stopAutoPlay()",isPlaying.value);
console.log("我走了这里11")
stopAutoPlay();
}
// if (isPlaying.value) {
// //////console.log("我是拖动开始stopAutoPlay()",isPlaying.value);
// //////console.log("我走了这里11")
// stopAutoPlay();
// }
// 添加全局事件监听器
window.addEventListener('mousemove', handleDrag);
window.addEventListener('mouseup', endDrag);
window.addEventListener('mousemove', handleDrag);
window.addEventListener('mouseup', endDrag);
};
// 处理拖动
......@@ -1110,11 +1247,11 @@ const handleDrag = (e) => {
if (!isDragging.value || !currentDragHandle.value || !sliderTrack.value) return;
// 手动拖动时停止自动播放
if (isPlaying.value) {
console.log("我是处理拖动stopAutoPlay()",isPlaying.value);
console.log("我走了这里12")
stopAutoPlay();
}
// if (isPlaying.value) {
// //////console.log("我是处理拖动stopAutoPlay()",isPlaying.value);
// ////console.log("我走了这里12")
// stopAutoPlay();
// }
const rect = sliderTrack.value.getBoundingClientRect();
let percentage = ((e.clientX - rect.left) / rect.width) * 100;
......@@ -1142,25 +1279,25 @@ const endDrag = () => {
// replayTime: formatDateTime(selectedEndTime.value),
// taskCode: String(taskCode_everyChange.value),
// })));
wssOpenHandle({
// isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
isFastForward: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
speed: useAppStoreInstance.globalSubsystemSpeed,
replayTime: formatDateTime(selectedEndTime.value),
taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
satelliteId: useAppStoreInstance.globalSatelliteSearchID,
})
if (window.ue5) {
// 发送时轴de 当前时间给ue
window.ue5("callTimeLineCurrentTimeFn", String(JSON.stringify({
year: selectedEndTime.value.getFullYear(),
month: selectedEndTime.value.getMonth() + 1,
day: selectedEndTime.value.getDate(),
hour: selectedEndTime.value.getHours(),
minute: selectedEndTime.value.getMinutes(),
second: selectedEndTime.value.getSeconds(),
})));
}
// wssOpenHandle({
// // isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
// isFastForward: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
// speed: useAppStoreInstance.globalSubsystemSpeed,
// replayTime: formatDateTime(selectedEndTime.value),
// taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
// satelliteId: useAppStoreInstance.globalSatelliteSearchID,
// })
// if (window.ue5) {
// // 发送时轴de 当前时间给ue
// window.ue5("callTimeLineCurrentTimeFn", String(JSON.stringify({
// year: selectedEndTime.value.getFullYear(),
// month: selectedEndTime.value.getMonth() + 1,
// day: selectedEndTime.value.getDate(),
// hour: selectedEndTime.value.getHours(),
// minute: selectedEndTime.value.getMinutes(),
// second: selectedEndTime.value.getSeconds(),
// })));
// }
// 移除全局事件监听器
window.removeEventListener('mousemove', handleDrag);
......@@ -1190,14 +1327,30 @@ const dataPickEndTime = ref('');
const stratEndTimeTransformTime = (time) => {
};
onBeforeMount(() => {
// if (window.ue5) {
// window.ue5("callBackControlSwitchShowFn", String(JSON.stringify({
// type: "TimeLineShow",
// status: "open"
// })));}
if (window.ue5) {
window.ue5("callBackControlSwitchShowFn", String(JSON.stringify({
type: "LegendShow",
status: "open"
})));}
});
onMounted(() => {
preTimeWindowEnd.value = "2026-11-01 00:00:00"
// console.log("cao ceshi ",compareTime("Sun Nov 02 2025 00:00:00 GMT+0800 (中国标准时间)","Sun Nov 02 2026 00:00:00 GMT+0800 (中国标准时间)"));
// //////console.log("cao ceshi ",compareTime("Sun Nov 02 2025 00:00:00 GMT+0800 (中国标准时间)","Sun Nov 02 2026 00:00:00 GMT+0800 (中国标准时间)"));
// 添加实时模式的时间出路逻辑
if(!useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
updateTimeline();
useAppStoreInstance.setglobalSubsystemTaskCode(Date.now())
// 这里修改发送实时模式的数据内容
// wssOpenHandle({
......@@ -1212,10 +1365,11 @@ if(!useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
// taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
// satelliteId: useAppStoreInstance.globalSatelliteSearchID,
// })
// Loading.show();
// Loading.show();
}else {
// SubLoading.show();
updateTimeline();
console.log("我是初始",useAppStoreInstance.globalSubsystemSelectedTimeRange);
//////console.log("我是初始",useAppStoreInstance.globalSubsystemSelectedTimeRange);
useAppStoreInstance.setGlobalSubsystemSelectedTimeRange(useAppStoreInstance.globalSubsystemSelectedTimeRange);
dataPickFalg.value = route.query.disabled || false;
dateRange.value = useAppStoreInstance.globalSubsystemSelectedTimeRange
......@@ -1223,7 +1377,7 @@ if(!useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
dataPickEndTime.value = formatDateTime(useAppStoreInstance.globalSubsystemSelectedTimeRange[1]);
handleDateRangeChange(useAppStoreInstance.globalSubsystemSelectedTimeRange);
hasPlayed.value = false;
wssOpenHandle({
wssOpenHandle({
// isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
isFastForward: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
speed: useAppStoreInstance.globalSubsystemSpeed,
......@@ -1235,11 +1389,11 @@ if(!useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
satelliteId: useAppStoreInstance.globalSatelliteSearchID,
})
Loading.show();
// SubLoading.show();
// 初始化时,默认实时传输
// const realtimeTaskCode = Date.now();
// watch(() => useAppStoreInstance.globalSatelliteSearchID, (newValue, oldValue) => {
// console.log("................",newValue,oldValue,newValue !== oldValue,newValue === oldValue);
// //////console.log("................",newValue,oldValue,newValue !== oldValue,newValue === oldValue);
// if(newValue !== oldValue) {
// wssOpenHandle({
......@@ -1267,37 +1421,104 @@ if(!useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
}
});
const compareTime = (time1, time2) => {
// console.log('每隔开始compareTime----------', time1, time2);
const compareTime = (time1,allKeyArray=[]) => {
// console.log('每隔开始compareTime----------', time1,typeof allKeyArray,allKeyArray);
// 将时间字符串转换为 Date 对象
const date1 = new Date(time1);
const date2 = new Date(time2);
// 检查时间是否有效
if (isNaN(date1.getTime()) || isNaN(date2.getTime())) {
if (isNaN(date1.getTime()) ) {
throw new Error("无效的时间格式");
}
// 比较时间戳
if (date1 >= date2) {
return true;
}else {
return false;
for(let i = 0; i < allKeyArray.length-1; i++){
const date2 = new Date(allKeyArray[i]);
const date3 = new Date(allKeyArray[i+1]);
if(date1 >= date2 && date1 <= date3){
return {
index: i,
TimePeriod: date2.toString(),
// type:true
}
}
}
// 比较时间戳
// if (date1 >= date2) {
// return true;
// }else {
// return false;
// }
};
const isChange_flag_firstBackDate = ref(false)
const preTimeWindowEnd = ref(null);
const tempSubContent = ref({})
// 监听 selectedEndTime 的变化,二无停,时间是2025-11-02 16:01:00
// 检测时间间隔
const jiangerTime = ref(0)
const transformTorightTop = (objOrArr, index) => {
if (index === 0) {
return [];
}
if (Array.isArray(objOrArr)) {
// 如果是数组,返回前 index项
return objOrArr.slice(0, index );
}
if (objOrArr && typeof objOrArr === 'object') {
// 如果是对象,获取其可枚举键(按插入顺序)
const keys = Object.keys(objOrArr);
const selectedKeys = keys.slice(0, index );
// console.log("Object.keys(objOrArr);",keys,selectedKeys);
// 构建新对象,只包含前 index个键
const result = {};
for (const key of selectedKeys) {
result[key] = objOrArr[key];
}
return result;
}
// 其他类型(null、undefined、string 等)返回空数组或原值
return [];
};
const tempMiderStationNameInfo = ref({})
watch(
() => selectedEndTime.value,
(val) => {
// 检查是否满足条件
if ( isChange_flag_firstBackDate.value) {
console.log("每隔开始进来");
console.log("我走了",compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value),formatDateTime(selectedEndTime.value),preTimeWindowEnd.value,300%7.8947 ===0.0014);
// //////console.log("每隔开始进来");
// //////console.log("我走了sub,LeftTopOrigin",LeftTopOriginAllSubContentKey.value[compareTime(formatDateTime(selectedEndTime.value),LeftTopAllSubContentKey.value).index]);
// consol。e.log("我走了sub,RightTopOrigin",transformTorightTop(allSubContent.value?.satelliteAlertInfoArray?.data,compareTime(formatDateTime(selectedEndTime.value),RightBottomAllSubContentKey.value)?.index));
// //////console.log("我走了sub,RightBottomOrigin",RightBottomOriginAllSubContentKey.value[compareTime(formatDateTime(selectedEndTime.value),RightBottomAllSubContentKey.value).index]);
tempSubContent.value = {}
tempSubContent.value = {
leftTop:compareTime(formatDateTime(selectedEndTime.value),LeftTopAllSubContentKey.value)?.index === 0? {}:allSubContent.value?.data?.[LeftTopOriginAllSubContentKey.value[compareTime(formatDateTime(selectedEndTime.value),LeftTopAllSubContentKey.value)?.index]],
rightTop:compareTime(formatDateTime(selectedEndTime.value),RightTopAllSubContentKey.value)?.index === 0? {}:transformTorightTop(allSubContent.value?.arcSegmentInfoArray?.data,compareTime(formatDateTime(selectedEndTime.value),RightTopAllSubContentKey.value)?.index),
rightBottom:compareTime(formatDateTime(selectedEndTime.value),RightBottomAllSubContentKey.value)?.index === 0? {}:transformTorightTop(allSubContent.value?.satelliteAlertInfoArray?.data,compareTime(formatDateTime(selectedEndTime.value),RightBottomAllSubContentKey.value)?.index),
// groundNetworkElementStatus:compareTime(formatDateTime(selectedEndTime.value),allMidderStationNameKeyInfo.value)?.index === 0? {}:transformTorightTop(allSubContent.value?.groundNetworkElementStatus?.controlTasks,compareTime(formatDateTime(selectedEndTime.value),allMidderStationNameKeyInfo.value)?.index),
groundNetworkElementStatus:{
...(allSubContent.value?.groundNetworkElementStatus),
siteName:compareTime(formatDateTime(selectedEndTime.value),allMidderStationNameKeyInfo.value)?.index === 0? {}:allSubContent.value?.groundNetworkElementStatus?.controlTasks[OriginallMidderStationNameKeyInfo.value[compareTime(formatDateTime(selectedEndTime.value),allMidderStationNameKeyInfo.value)?.index - 1]]
},
}
useAppStoreInstance.setSubSystemTimeLineEndSelectTime(formatDateTime(selectedEndTime.value) )
useAppStoreInstance.setSubsystemSocketContent(tempSubContent.value)
// console.log("我走了sub,tempSubContent",tempSubContent.value);
// 间隔5分钟即300秒,发送时轴de 当前时间给ue
// const adjustedStep = Math.ceil(300 / playbackSpeed.value);
// if (jiangerTime.value % adjustedStep === 0) {
......@@ -1313,23 +1534,25 @@ watch(
// }
// }
jiangerTime.value += 1;
if (compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value)) {
console.log("我走了这里2,因为返回的数据不包含preTimeWindowEnd.value,所以会自动停止")
if(isPlaying.value){
console.log("我走了这里13")
stopAutoPlay();
hasPlayed.value = false;
isChange_flag_firstBackDate.value = false;
}
// if (compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value)) {
// //////console.log("我走了这里2,因为返回的数据不包含preTimeWindowEnd.value,所以会自动停止")
// if(isPlaying.value){
// //////console.log("我走了这里13")
// // stopAutoPlay();
// // hasPlayed.value = false;
// // isChange_flag_firstBackDate.value = false;
// }
// clearInterval(intervalTimer.value);
// intervalTimer.value = null;
}
// // clearInterval(intervalTimer.value);
// // intervalTimer.value = null;
// }
// if (!intervalTimer.value) {
// intervalTimer.value = setInterval(() => {
// console.log("每隔一秒执行一次逻辑",compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value));
// //////console.log("每隔一秒执行一次逻辑",compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value));
// // 在这里执行你需要的逻辑
// if (compareTime(formatDateTime(selectedEndTime.value), preTimeWindowEnd.value)) {
// stopAutoPlay();
......@@ -1343,7 +1566,7 @@ watch(
// else {
// // 如果条件不满足,清除定时器
// if (intervalTimer.value) {
// console.log("清理定时器");
// //////console.log("清理定时器");
// clearInterval(intervalTimer.value);
// intervalTimer.value = null;
......@@ -1353,8 +1576,15 @@ watch(
{ deep: true, immediate: true }
);
onUnmounted(() => {
console.log("我走了这里14")
//////console.log("我走了这里14")
// stopAutoPlay();
// wssOpenHandle({
// // isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
// status: 'stop',
// taskCode: String(useAppStoreInstance.globalSubsystemTaskCode),
// satelliteId: useAppStoreInstance.globalSatelliteSearchID,
// })
useAppStoreInstance.setSubSystemTimeLineEndSelectTime("-")
window.removeEventListener('mousemove', handleDrag);
window.removeEventListener('mouseup', endDrag);
});
......@@ -1625,5 +1855,21 @@ onUnmounted(() => {
:deep(.right_block_conter_btn_playbackSpeed:focus) {
outline:none;
}
:deep(.satellite-select .el-select__wrapper) {
height: 12.5px;
}
:deep(.satellite-select .el-select__selected-item) {
color: #ffffff;
/* font-size: 10px; */
}
:deep(.satellite-select .el-tooltip__trigger) {
background-color: #000000 !important;
color: #f9fafd !important;
border: none !important;
box-shadow: none;
}
:deep(.el-select__suffix){
opacity: 0;
}
</style>
\ No newline at end of file
......@@ -187,7 +187,8 @@ const objectSelector = [
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
width: 100px;
/* padding: 10px 10px; */
/* background-color: #2b70df; */
}
......@@ -202,7 +203,7 @@ const objectSelector = [
.templateCase_right_content_body {
height: 92%;
width: 120%;
width: 100%;
/* background-color: #73df2b; */
}
......
......@@ -120,8 +120,14 @@
</div>
</div>
<div class="templateCase_left_content">
<div class="templateCase_left_content_item" v-for="(item, index) in templateCaseList" :key="index">
{{item}}
<div
class="templateCase_left_content_item"
v-for="(item, index) in templateCaseList"
:key="index"
@click="templateCaseClickFn(index)"
:class="{ 'CaseClickActive': activeTemplateIndex === index }"
>
{{ item }}
</div>
</div>
</div>
......@@ -222,10 +228,10 @@ const templateCaseList = ref(['模板1', '模板2', '模板3', '模板4', '模
const selectedValues = ref([]);
const dropdownVisible = ref([false, false, false]);
const templateCasedeleteHandFn = () => {
console.log('templateCasedeleteHandFn');
//console.log('templateCasedeleteHandFn');
};
const templateCaseAddHandFn = () => {
console.log('templateCaseAddHandFn');
//console.log('templateCaseAddHandFn');
};
// 初始化选中值
onMounted(() => {
......@@ -243,7 +249,11 @@ const selectOption = (index, option) => {
selectedValues.value[index] = option;
dropdownVisible.value[index] = false; // 选择后关闭下拉菜单
};
const activeTemplateIndex = ref(0);
const templateCaseClickFn = (index) => {
//console.log('templateCaseClickFn', index);
activeTemplateIndex.value = index;
};
// 点击外部关闭下拉菜单
document.addEventListener('click', (e) => {
if (!e.target.closest('.custom-select')) {
......@@ -262,16 +272,30 @@ const indicatorStyle = computed(() => {
<style scoped>
/* 基础样式设置 */
.dashboard-container {
width: 120%;
/* width: 900px; */
background-color: #000000;
color: #ffffff;
display: flex;
flex-direction: column;
color: #080606;
/* display: flex;
flex-direction: column; */
position: fixed; /* 改为fixed定位 */
left: 10%;
top: 10%;
width: 1550px;
z-index: 1001;
overflow: hidden;
position: relative;
left: -5%;
top: -120px;
}
/* 头部样式 */
......@@ -414,15 +438,19 @@ const indicatorStyle = computed(() => {
border-radius: 8px;
padding: 5px 15px;
}
.equipment-content{
height: 600px;
}
.tab-panel {
min-height: 600px;
/* max-height: 700px; */
color: #e2e8f0;
}
.failure-content {
display: flex;
flex-direction: row;
font-size: 15px;
width: 1500px;
/* gap: 20px; 添加间距 */
/* height: 500px; */
/* background-color: rgba(1, 73, 241, 0.5); */
......@@ -432,7 +460,8 @@ const indicatorStyle = computed(() => {
.templateCase {
flex: 1;
height: 100%;
height: 700px;
/* width: 500px; */
/* background-color: rgba(241, 1, 81, 0.5); */
/* border-radius: 6px; 添加圆角 */
/* border: 1px solid rgba(255, 255, 255, 0.1); 添加边框 */
......@@ -442,8 +471,9 @@ const indicatorStyle = computed(() => {
/* 可以为左右两侧添加不同样式 */
.templateCase_left {
flex: 0.21;
flex: 0.151;
height: 100%;
/* background-color: rgba(241, 1, 81, 0.5); */
/* border-radius: 6px; */
border-right: 1px solid rgba(255, 255, 255, 0.1);
......@@ -458,7 +488,7 @@ const indicatorStyle = computed(() => {
/* border-radius: 6px; */
/* border: 1px solid rgba(255, 255, 255, 0.1); */
/* padding: 10px; */
overflow: hidden;
/* overflow: hidden; */
}
......@@ -547,6 +577,11 @@ const indicatorStyle = computed(() => {
font-size: 12px;
/* background-color: #2c78f5; */
}
.CaseClickActive{
background: linear-gradient(to right, #193d77 0, rgba(0, 0, 0, 1) 100%);
}
.templateCase_left_content_item:hover{
background: linear-gradient(to right, #2b70df 0, rgba(0, 0, 0, 1) 100%);
}
......
......@@ -7,13 +7,15 @@
<!-- 左侧时间和天气信息 -->
<div class="navbar-left">
<div class="status-item weather-info">
<span class="icon">☀️</span>
<span class="text">晴 18℃</span>
<span class="icon">
<img src="@/assets/images/headers/yuanxin.png" alt="图标" class="weather-icon" style="width: 100%; height: 100%;">
</span>
<!-- <span class="text">晴 18℃</span> -->
</div>
<div class="status-item time-info">
<!-- <div class="status-item time-info">
<span class="text">{{ currentTime }}</span>
</div>
</div> -->
</div>
<!-- 中间标题 -->
......@@ -60,21 +62,24 @@
<!-- <div v-else class="logo-placeholder">DL</div> -->
<span class="control-label">大屏配置</span>
</div>
<div class="control-item rightTime" >
<span class="timeColor">{{ currentTime.split(" ")[0] }}</span>
<span >{{ currentTime.split(" ")[1] }}</span>
</div>
</div>
</div>
<el-dialog
<el-dialog
v-model="screenConfigeDialogVisible"
:destroy-on-close="true"
:modal="false"
width="1000"
width="100"
:show-close="false"
:before-close="handleScreenConfigeClose"
style=" background-color: rgba(0, 0, 0,10);height: 400px;"
style=" background-color: rgba(0, 0, 0,0);padding: 0;margin: 0;"
>
<screenConfige @handleScreenConfigeClose="handleScreenConfigeClose"></screenConfige>
<!-- <div style="width: 100px;height: 100px;background-color: blueviolet;"></div> -->
</el-dialog>
......@@ -90,17 +95,17 @@
>
</el-dialog> -->
<div
v-if="digitalPersonShow"
class="draggable-box"
:style="{ left: pos.x + 'px', top: pos.y + 'px' }"
>
<span class="title" @mousedown="startDrag">拖拽我(带边界限制)</span>
<!-- <el-input v-model="value" placeholder="请输入内容" /> -->
<!-- <Sender v-model="senderValue" variant="updown" clearable allow-speech /> -->
<el-button type="primary" @click="console.log('value')">提交</el-button>
</div>
v-if="digitalPersonShow"
class="draggable-box"
:style="{ left: pos.x + 'px', top: pos.y + 'px' }"
>
<span class="title" @mousedown="startDrag">拖拽我(带边界限制)</span>
<!-- <el-input v-model="value" placeholder="请输入内容" /> -->
<!-- <Sender v-model="senderValue" variant="updown" clearable allow-speech /> -->
<el-button type="primary" @click="console.log('value')">提交</el-button>
</div>
</div>
</template>
......@@ -112,6 +117,10 @@ import local from '@/utils/local.js'
import screenConfige from './component/screenConfigeDialog.vue'
import { useRouter } from 'vue-router';
import useAppStore from '@/store/module/app'
import errorDialog from '@/pages/lefts/component/errorDialog.vue'
const useAppStoreInstance = useAppStore()
// 在 setup 中
......@@ -138,16 +147,22 @@ const screenConfigeDialogVisible = ref(false);
// 监视digitalPersonShow变化
watch(digitalPersonShow, (newValue) => {
if (newValue) {
console.log('数字人显示');
//console.log('数字人显示');
local.local.set('digitalPersonShow', 'true');
} else {
console.log('数字人隐藏');
//console.log('数字人隐藏');
local.local.set('digitalPersonShow', 'false');
}
});
const handleScreenConfigeClose = () => {
screenConfigeDialogVisible.value = false;
if (window.ue5) {
window.ue5("callBackAllDialogFn", String(JSON.stringify({
type:"LargeScreenConfigurationDialog",
status:"close"
})));
}
};
// 格式化日期时间显示
const formatDateTime = () => {
......@@ -178,11 +193,11 @@ const handleImageError = (e) => {
// }
// window.ue5.interface.emitUIInteraction = (res) => {
// console.log("收到UE交互:", res.name);
// //console.log("收到UE交互:", res.name);
// try {
// const resData = JSON.parse(res.data);
// console.log("Received from UE:", resData);
// //console.log("Received from UE:", resData);
// if (resData.locationReplace === true) {
// location.replace('/subsystem');
......@@ -204,10 +219,10 @@ const handletoLinkClick = () => {
if (toSubSystemFlag.value) {
// location.replace('/subsystem');
router.push('/');
console.log("1111111111111111111111111",useAppStoreInstance.isSourceLegendShow);
//console.log("1111111111111111111111111",useAppStoreInstance.isSourceLegendShow);
useAppStoreInstance.setGlobalisFromTosub(true);
useAppStoreInstance.setislegendShow(useAppStoreInstance.isSourceLegendShow?true:false );
console.log("11111111111111111111111112",useAppStoreInstance.islegendShow);
//console.log("11111111111111111111111112",useAppStoreInstance.islegendShow);
useAppStoreInstance.setiscontrolPanelShow(true);
useAppStoreInstance.setGlobalSubsystemSelectedTimeRange([]);
}
......@@ -239,8 +254,14 @@ const handletoLinkClick = () => {
};
const handleCompanyClick = () => {
// 可以添加点击事件逻辑
// console.log('大屏配置按钮点击');
// //console.log('大屏配置按钮点击');
screenConfigeDialogVisible.value = !screenConfigeDialogVisible.value;
if (window.ue5) {
window.ue5("callBackAllDialogFn", String(JSON.stringify({
type:"LargeScreenConfigurationDialog",
status:"open"
})));
}
};
// 组件生命周期管理
let updateTimer;
......@@ -255,10 +276,10 @@ onBeforeMount(() => {
});
// const handleUEMessage = () => {
// console.log("我是handleUEMessage里面的window",window);
// //console.log("我是handleUEMessage里面的window",window);
// window.emitUIInteraction = (res) => {
// // console.log('Received from UE:', data);
// console.log("我是handleUEMessage,收到UE交互:", res);
// // //console.log('Received from UE:', data);
// //console.log("我是handleUEMessage,收到UE交互:", res);
// try {
// const resData = JSON.parse(res.data);
......@@ -269,7 +290,7 @@ onBeforeMount(() => {
// })))
// }
// console.log("handleUEMessage,Received from UE:", resData);
// //console.log("handleUEMessage,Received from UE:", resData);
// if (resData.locationReplace === true) {
// router.push('/subsystem');
......@@ -283,11 +304,11 @@ onBeforeMount(() => {
// };
// };
// const handleUEMessage1 = () => {
// console.log("我是handleUEMessage1里面的window",window);
// //console.log("我是handleUEMessage1里面的window",window);
// window.emitUIInteraction = (res) => {
// // console.log('Received from UE:', data);
// console.log("我是handleUEMessage1,收到UE交互:", res);
// // //console.log('Received from UE:', data);
// //console.log("我是handleUEMessage1,收到UE交互:", res);
// try {
// const resData = JSON.parse(res.data);
......@@ -298,7 +319,7 @@ onBeforeMount(() => {
// })))
// }
// console.log("Received from UE:", resData);
// //console.log("Received from UE:", resData);
// if (resData.locationReplace === true) {
// router.push('/subsystem');
......@@ -323,7 +344,8 @@ onMounted(() => {
// if (window.ue5) {
// window.ue5("callBackTimeFn", `测试数据111111111111111111:${JSON.stringify(resData)},${JSON.stringify(resData.locationReplace)},${JSON.stringify(resData.locationReplace === 'true')}`)
// }
console.log("我是handleUEMessage,收到UE交互:", resData);
if (resData.locationReplace === 'true') {
useAppStoreInstance.setiscontrolPanelShow(false);
useAppStoreInstance.setglobalSatelliteSearchID(resData.SatelliteSearchID || '4097');
......@@ -344,18 +366,20 @@ onMounted(() => {
}
if (resData.locationReplace === 'false') {
router.push('/');
console.log("1111111111111111111111111",useAppStoreInstance.isSourceLegendShow);
//console.log("1111111111111111111111111",useAppStoreInstance.isSourceLegendShow);
useAppStoreInstance.setGlobalisFromTosub(true);
useAppStoreInstance.setislegendShow(useAppStoreInstance.isSourceLegendShow?true:false );
console.log("11111111111111111111111112",useAppStoreInstance.islegendShow);
//console.log("11111111111111111111111112",useAppStoreInstance.islegendShow);
useAppStoreInstance.setiscontrolPanelShow(true);
useAppStoreInstance.setGlobalSubsystemSelectedTimeRange([]);
}
// try {
// const resData = JSON.parse(res.data);
// if (window.ue5) {
// window.ue5("callBackTimeFn", `ue传递给vue的数据111111111111111111:${JSON.stringify(res)}`)
// }
// console.log("Received from UE:", resData);
// //console.log("Received from UE:", resData);
// if (resData.locationReplace === true) {
// router.push('/subsystem');
......@@ -460,7 +484,7 @@ const stopDrag = () => {
.navbar-container {
width: 100%;
background-color: black;
min-width: 740px;
min-width: 750px;
overflow: hidden;
/* height: 250px; */
......@@ -487,7 +511,7 @@ const stopDrag = () => {
padding: 0 2rem;
position: relative;
z-index: 1;
height: 100%;
height: 55px;
max-width: 1920px;
margin: 0 auto;
background: url("@/assets/images/headers/header_bg.png") ;
......@@ -505,6 +529,8 @@ const stopDrag = () => {
display: flex;
align-items: center;
gap: 1.8rem;
width: 480px;
/* background-color: aquamarine; */
}
.status-item {
......@@ -521,7 +547,7 @@ const stopDrag = () => {
}
.status-item .icon {
font-size: 1.1rem;
width: 120px;
}
.weather-info .text::after {
......@@ -538,6 +564,10 @@ const stopDrag = () => {
display: flex;
justify-content: center;
margin: 0 1rem;
/* width: 500px;
position: relative;
left: 80px; */
/* background-color: antiquewhite; */
}
.title-container {
......@@ -572,9 +602,19 @@ const stopDrag = () => {
.navbar-right {
display: flex;
align-items: center;
gap: 1.5rem;
font-size: small;
width: 480px;
overflow: hidden;
padding-top: 10px;
/* background-color: #d10e0e; */
}
.timeColor{
color: #ddd;
}
.rightTime{
border-left: 1px solid #ddd;
height: 10px;
}
.control-item {
display: flex;
align-items: center;
......@@ -662,10 +702,15 @@ const stopDrag = () => {
}
@media (max-width: 992px) {
.navbar-left {
/* .navbar-left {
display: none;
} */
.company-item{
display: none;
}
.digital-person-item{
display: none;
}
.navbar-right {
gap: 1rem;
}
......@@ -701,9 +746,7 @@ const stopDrag = () => {
}
@media (max-width: 576px) {
.navbar-right {
display: none;
}
.platform-title {
overflow: visible;
......
......@@ -175,7 +175,7 @@ import { onActivated, onMounted, ref, watch } from 'vue';
const props = defineProps(['satlTitle','errorDeviceList',"baseDeviceList"])
const emits = defineEmits(['errorDialoghandleClose'])
//console.log("展示了",props.errorDeviceList,props.baseDeviceList);
// 状态管理
const activeTab = ref('devices'); // 默认显示设备情况标签页
const devices = ref([])
......@@ -192,7 +192,7 @@ const deviceStatusMap = ref([
// 监听 errorDeviceList 的变化
watch(() => props.errorDeviceList, (newVal) => {
// console.log("0000000000000",newVal.length,typeof newVal)
// //console.log("0000000000000",newVal.length,typeof newVal)
if(newVal.length === 0){
devices.value = []
return
......@@ -213,7 +213,7 @@ watch(() => props.errorDeviceList, (newVal) => {
name: item.elementName || '未知设备',
status: item.statue === '正常' ? 'normal' : 'error',
expanded: false,
errorDetails: item.stAlarmInfoResponse || null
errorDetails: item.stAlarmInfoResponse?.locationInfo || null
}))
} else if (newVal && typeof newVal === 'object') {
// 如果是普通对象,尝试直接使用
......@@ -221,7 +221,7 @@ watch(() => props.errorDeviceList, (newVal) => {
name: newVal.elementName || '未知设备',
status: newVal.statue === '正常' ? 'normal' : 'error',
expanded: false,
errorDetails: newVal.stAlarmInfoResponse || null
errorDetails: newVal.stAlarmInfoResponse?.locationInfo || null
}]
}
}, { immediate: true })
......@@ -231,7 +231,7 @@ watch(() => props.baseDeviceList, (newVal) => {
newVal.forEach(item => {
deviceStatusMap.value.push([{
label: `天线${item.number }发射率 `,
label: `天线${item.number }发射率 `,
value: item.power || '0',
status: item.power !==0 ? 'normal' : 'error',
},
......@@ -253,7 +253,7 @@ watch(() => props.baseDeviceList, (newVal) => {
])
})
console.log("11111EIRP111111baseDeviceList",newVal,deviceStatusMap.value)
//console.log("11111EIRP111111baseDeviceList",newVal,deviceStatusMap.value)
// deviceStatusMap.value = [
// {label: '天线发射频率',value: newVal.antennaTransmitPower ,status: 1 ? 'normal' : 'error',},
// {label: '天线发射EIRP',value: newVal.antennaEip ,status: 0? 'normal' : 'error',},
......@@ -274,11 +274,7 @@ const toggleExpand = (device) => {
const closePanel = () => {
emits('errorDialoghandleClose')
};
onActivated(() => {
activeTab.value = 'devices';
console.log("展示了");
})
</script>
<style scoped>
......@@ -286,15 +282,21 @@ onActivated(() => {
.device-monitor {
width: 280px;
height: 380px;
background-color: #1e1e2d;
border-radius: 10px;
/* box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4); */
color: #e0e0e0;
/* font-family: 'Consolas', monospace; */
display: flex;
flex-direction: column;
position: fixed; /* 改为fixed定位 */
bottom: 0.5vh;
left: 400px;
background: #1a1a1a;
border-radius: 4px;
z-index: 1001;
overflow: hidden;
z-index: 999;
/* border-top: 2px solid;
border-bottom: 2px solid;
border-image: linear-gradient(to right, rgba(54, 27, 27, 0.93) 0%, rgba(255, 2, 2, 0.93) 50%, rgba(54, 27, 27, 0.93)) 1;
box-shadow: inset 0 -20px 70px -25px rgba(255, 2, 2, 0.93); */
/* background-color: #eea929; */
}
......@@ -442,7 +444,7 @@ onActivated(() => {
}
.content_info{
height: 100%;
background-color: #4488f5;
/* background-color: #4488f5; */
}
/* 表格头部 */
......@@ -452,7 +454,7 @@ onActivated(() => {
/* background: linear-gradient(to bottom, #25253a, #1e1e2d); */
font-weight: 500;
font-size: 15px;
color: #a0a0a0;
color: #d1d0d0;
border-bottom: 1px solid #383850;
position: sticky;
top: 0;
......@@ -465,8 +467,8 @@ onActivated(() => {
}
.device-name {
flex: 1;
flex: 1.2;
overflow: hidden;
}
.device-name1{
flex: 1;
......@@ -487,21 +489,25 @@ onActivated(() => {
/* 设备列表样式 */
.device-list {
padding: 0 10px;
max-height: calc(100% - 50px);
/* max-height: 260px; */
overflow-y: auto;
z-index: 20;
height: 260px;
color: #d1d0d0;
}
.device-list1{
padding: 0 10px;
max-height: calc(100% - 30px );
max-height:290px;
overflow-y: auto;
z-index: 20;
color: #d1d0d0;
}
.device-item {
margin-bottom: 1px;
border-radius: 6px;
overflow: hidden;
overflow-Y: auto;
transition: all 0.2s;
/* background-color: rgba(255, 255, 255, 0.02); */
/* border: 1px solid rgba(255, 255, 255, 0.05); */
}
......@@ -519,10 +525,14 @@ onActivated(() => {
align-items: center;
cursor: pointer;
transition: background-color 0.2s;
overflow: auto;
}
.has-error{
overflow: hidden;
}
.has-error .device-row {
position: relative;
left: -20px;
......@@ -544,6 +554,9 @@ onActivated(() => {
font-size: 12px;
/* color: #f87171; */
/* margin-right: 6px; */
position: relative;
top: 3px;
overflow: hidden;
transition: transform 0.2s;
}
......@@ -582,7 +595,9 @@ onActivated(() => {
.error-details-container {
background-color: #25253a;
border-radius: 0 0 6px 6px;
/* overflow-Y: auto; */
overflow: hidden;
color: #ffffff;
animation: fadeIn 0.3s ease-out;
border-top: 1px solid rgba(248, 113, 113, 0.2);
}
......@@ -590,9 +605,10 @@ onActivated(() => {
.error-details {
padding: 12px 20px;
font-size: 10px;
color: #e2e8f0;
color: #ffffff;
background-color: rgba(45, 45, 68, 0.7);
line-height: 1.6;
overflow: hidden;
}
.error-detail-item {
......@@ -631,9 +647,10 @@ onActivated(() => {
padding: 20px;
font-size: 14px;
color: #888888;
min-height: 260px;
}
::-webkit-scrollbar {
width: 6px;
width: 1px !important;
}
::-webkit-scrollbar-track {
......@@ -642,7 +659,7 @@ onActivated(() => {
::-webkit-scrollbar-thumb {
background: #444460;
border-radius: 3px;
border-radius: 1px;
}
::-webkit-scrollbar-thumb:hover {
......
......@@ -133,14 +133,31 @@
</el-input>
</div>
<el-table :data="satelliteData" size="small" height="175px" class="custom-table">
<el-table :data="satelliteData" size="small" height="170px" class="custom-table">
<el-table-column prop="" label="" width="30">
<template #default="">
<img src='@/assets/images/lefts/satellite.png' alt="" class="satellite-icon">
</template>
</el-table-column>
<el-table-column prop="name" label="卫星名称" width="80" align="center"></el-table-column>
<el-table-column prop="station" label="当前连接" width="80" align="center"></el-table-column>
<el-table-column prop="station" label="当前连接" width="80" align="center">
<template #default="scope">
<!-- {{typeof scope.row.station }} -->
<div v-if="scope.row.station.length !== 0">
<div v-for="(items, index) in scope.row.station" :key="index">
<div v-if="isTimeInRange(useAppStoreInstance.globalTimeLineEndSelectTime, items.startTime, items.endTime)">
{{ items.siteName }}
</div>
<div v-else>-</div>
</div>
</div>
<div v-else>-</div>
</template>
</el-table-column>
<el-table-column prop="manufacturer" label="厂商" width="80" align="center"></el-table-column>
<el-table-column prop="status" label="当前状态" width="70" align="center">
<template #default="scope">
......@@ -166,10 +183,10 @@
<div class="ground-system-metrics margin-top-section">
<div class="ground-metric" v-for="item in groundMetrics" :key="item.label">
<div style="display: flex;flex-direction: row;width: 80%; align-items: center;gap: 10px;">
<img src='@/assets/images/left2/item1.png' alt="" style="width: 20px;position: relative;top: -2px;">
<img :src='item.CurrentURL' alt="" style="width: 15px;position: relative;top: -2px;">
<div class="ground-label">{{ item.label }}</div>
</div>
<div class="ground-value">{{ item.value }}</div>
</div>
......@@ -203,7 +220,7 @@
</el-input>
</div>
<el-table :data="activeTab === 'equipment' ? equipmentData : faultData" size="small" height="170px"
<el-table :data="activeTab === 'equipment' ? equipmentData : faultData" size="small" height="160px"
@row-click="tableHandleRowClickFn" class="custom-table custom-table-foot ">
<el-table-column prop="" label="" width="23">
<template #default="">
......@@ -211,19 +228,22 @@
</template>
</el-table-column>
<el-table-column prop="station" label="地面站名称" row-class-name="hover-row" width="95"></el-table-column>
<el-table-column label="KU天线" width="62" align="center">
<el-table-column label="KU天线" width="60" align="center">
<template #default="scope">
<div :class="{ 'errorRed': activeTab != 'equipment' && scope.row.ku != '-' }">{{ scope.row.ku === 0 ? '-' : scope.row.ku }}</div>
<div :class="{ 'errorRed': activeTab != 'equipment' && scope.row.ku != '-' }">{{ scope.row.ku === 0 ?
'-' : scope.row.ku }}</div>
</template>
</el-table-column>
<el-table-column prop="qv" label="QV天线" width="60" align="center">
<template #default="scope">
<div :class="{ 'errorRed': activeTab != 'equipment' && scope.row.qv != '-' }">{{ scope.row.qv === 0 ? '-' : scope.row.qv }}</div>
<div :class="{ 'errorRed': activeTab != 'equipment' && scope.row.qv != '-' }">{{ scope.row.qv === 0 ?
'-' : scope.row.qv }}</div>
</template>
</el-table-column>
<el-table-column prop="monitor" label="测控基带" width="60" align="center">
<el-table-column prop="monitor" label="测控基带" width="62" align="center">
<template #default="scope">
<div :class="{ 'errorRed': activeTab != 'equipment' && scope.row.monitor != '-' }">{{ scope.row.monitor === 0 ? '-' : scope.row.monitor
<div :class="{ 'errorRed': activeTab != 'equipment' && scope.row.monitor != '-' }">{{ scope.row.monitor
=== 0 ? '-' : scope.row.monitor
}}</div>
</template>
</el-table-column>
......@@ -249,11 +269,22 @@
</div>
<el-dialog v-model="errorDialogVisible" :show-close="false" width="280" :modal='false' class="custom-error-dialog" :destroy-on-close="true"
style="margin: 0;padding: 0;background-color: rgba(0, 0, 0, 0);">
<errorDialog :errorDeviceList="errorDeviceList" :satlTitle="satlTitle" :baseDeviceList="baseDeviceList" @errorDialoghandleClose="errorDialoghandleClose"></errorDialog>
<el-dialog v-model="errorDialogVisible"
:show-close="false"
:modal="false"
width="300"
hight="50"
:destroy-on-close="true"
:close-on-click-modal="true"
style="background: rgba(0, 0, 0, 0);padding: 0;margin: 0;"
>
<errorDialog :errorDeviceList="errorDeviceList" :satlTitle="satlTitle" :baseDeviceList="baseDeviceList"
@errorDialoghandleClose="errorDialoghandleClose"></errorDialog>
</el-dialog>
</div>
</template>
......@@ -265,6 +296,7 @@ import errorDialog from '@/pages/lefts/component/errorDialog.vue'
import wss from '@/utils/requestSocekt.js'
import useAppStore from '@/store/module/app'
import local from '@/utils/local.js'
import { ElMessage } from 'element-plus';
const useAppStoreInstance = useAppStore();
// 激活的标签页
......@@ -278,7 +310,7 @@ const coreMetrics = ref([
// get: () => useAppStoreInstance.globalIntervalTime / 1000,
// set: (val) => {
// const numVal = Number(val);
// console.log("计算数学",val);
// //console.log("计算数学",val);
// if (!isNaN(numVal)) {
// useAppStoreInstance.setglobalIntervalTime(numVal * 1000);
......@@ -290,7 +322,7 @@ const globalIntervalTimeTemp = ref('')
const globaleAutoPlay = ref(true)
const carouselKey = ref(0)
watch(globalIntervalTime, (newValue, oldValue) => {
// console.log("globalIntervalTime发生变化了");
// //console.log("globalIntervalTime发生变化了");
carouselKey.value += 1
})
......@@ -298,18 +330,18 @@ watch(globalIntervalTime, (newValue, oldValue) => {
// carouselKey.value +=1
// })
const handleglobalIntervalTimeChange = (value) => {
// console.log("*****----12---*****",value);
// //console.log("*****----12---*****",value);
globalIntervalTime.value = globalIntervalTimeTemp.value
useAppStoreInstance.setglobalIntervalTime((globalIntervalTime.value))
local.local.set('globalIntervalTime', globalIntervalTime.value)
// globalIntervalTime.value = Number(globalIntervalTime.value)
// console.log("当前的12",typeof globalIntervalTime.value);
// //console.log("当前的12",typeof globalIntervalTime.value);
}
const handleglobaleAutoPlayChange = (value) => {
// console.log("*****-------*****",globaleAutoPlay.value);
// console.log("当前的1222",globaleAutoPlay.value);
// //console.log("*****-------*****",globaleAutoPlay.value);
// //console.log("当前的1222",globaleAutoPlay.value);
local.local.set('globaleAutoPlay', globaleAutoPlay.value)
useAppStoreInstance.setglobaleAutoPlay(globaleAutoPlay.value)
};
......@@ -317,39 +349,39 @@ const handleglobaleAutoPlayChange = (value) => {
const activeTabHandleClickTab = (value) => {
console.log("yongdainji");
//console.log("yongdainji");
activeTab.value = value
if (!useAppStoreInstance.globalStartWss) {
if (value === 'fault') {
siteDataPageErrorInfoApi({
pageNum: 0,
pageSize: -1,
}).then(res => {
console.log( res.data,"s---------a");
primitiveFaultData.value = transformgroudSatelliteData(res.data)
console.log("11111EIRP111111*****",primitiveFaultData.value);
faultData.value = primitiveFaultData.value
if (searchEquipmentValue.value !== '') {
searchEquipmentList()
}
})
}
if (value === 'equipment') {
siteDataInfoListApi().then(res => {
console.log(res.data,"s---------a");
primitiveSatelliteData.value = transformgroudSatelliteData(res.data)
equipmentData.value = primitiveSatelliteData.value
if (searchEquipmentValue.value !== '') {
searchEquipmentList()
}
})
}
if (value === 'fault') {
siteDataPageErrorInfoApi({
pageNum: 0,
pageSize: -1,
}).then(res => {
//console.log(res.data, "s---------a");
primitiveFaultData.value = transformgroudSatelliteData(res.data)
//console.log("11111EIRP111111*****", primitiveFaultData.value);
faultData.value = primitiveFaultData.value
if (searchEquipmentValue.value !== '') {
searchEquipmentList()
}
})
}
if (value === 'equipment') {
siteDataInfoListApi().then(res => {
//console.log(res.data, "s---------a");
primitiveSatelliteData.value = transformgroudSatelliteData(res.data)
equipmentData.value = primitiveSatelliteData.value
if (searchEquipmentValue.value !== '') {
searchEquipmentList()
}
})
}
}
}
......@@ -382,15 +414,15 @@ const satelliteData = ref();
const searchSateValue = ref('')
function searchSatelliteList() {
console.log("cao cao2",primitiveSatelliteData.value);
//console.log("cao cao2", primitiveSatelliteData.value);
const filteredData = primitiveSatelliteData.value.filter(item =>
item.name.toLowerCase().includes(searchSateValue.value.toLowerCase()) ||
item.station.toLowerCase().includes(searchSateValue.value.toLowerCase()) ||
item.manufacturer.toLowerCase().includes(searchSateValue.value.toLowerCase()) ||
item.status.toLowerCase().includes(searchSateValue.value.toLowerCase())
);
// console.log(filteredData);
// //console.log(filteredData);
satelliteData.value = filteredData
}
......@@ -417,7 +449,7 @@ function searchEquipmentList() {
item.qv.toString().includes(searchEquipmentValue.value.toLowerCase())
);
// console.log(filteredData);
// //console.log(filteredData);
equipmentData.value = filteredData
}
if (activeTab.value === 'fault') {
......@@ -445,27 +477,41 @@ const satlTitle = ref('')
function tableHandleRowClickFn(row, column, event) {
if (activeTab.value === 'fault') {
// ElMessage.error('故障面板正在开启!')
errorDialogVisible.value = true
errorDeviceList.value = row.originErrorList
console.log("11111EIRP111111row",row);
errorDeviceList.value = errorDeviceListDetailsDialog.value.filter(item => item.siteId === row.siteId)[0]?.groundNetworkElementResponses || []
// //console.log("11111EIRP111111row", row);
satlTitle.value = row.station ? row.station : '未知名称'
baseDeviceList.value = equipmentData.value.filter(item => item.siteId === row.siteId)[0]?.originCrossDeviceExtractResponseList || []
console.log('11111EIRP111111row过滤数据:', equipmentData.value.filter(item => item.siteId === row.siteId)[0]?.originCrossDeviceExtractResponseList);
// row: 点击行的数据
// column: 点击的列信息
// event: 原生事件对象
baseDeviceList.value = errorDeviceListDetailsDialog.value.filter(item => item.siteId === row.siteId)[0]?.crossDeviceExtractResponseList || []
//console.log('11111EIRP111111row过滤数据:',errorDeviceListDetailsDialog.value);
// ElMessage.success('点击了行:' + String(JSON.stringify({
// type:"DeviceFaultDialog",
// status:"open"
// })))
if (window.ue5) {
window.ue5("callBackAllDialogFn", String(JSON.stringify({
type:"DeviceFaultDialog",
status:"open"
})));
}
}
}
function errorDialoghandleClose() {
errorDialogVisible.value = false
if (window.ue5) {
window.ue5("callBackAllDialogFn", String(JSON.stringify({
type:"DeviceFaultDialog",
status:"close"
})));
}
}
function handleCarouselChange(index) {
// 处理 carousel 切换时的逻辑
// console.log('切换到索引:', orbitMetrics.value[index].headerTitle);
// //console.log('切换到索引:', orbitMetrics.value[index].headerTitle);
coreMetrics.value = orbitMetrics.value[index]?.headerTitle
}
......@@ -474,16 +520,16 @@ function handleCarouselChange(index) {
const transformConstellationData = (data) => {
return data.map(item => ({
headerTitle: [
{ label: '组网卫星数', value: item.satelliteCount },
{ label: '轨道面数', value: item.orbitalPlaneCount },
{ label: '每轨卫星数', value: item.satellitesPerOrbit }
{ label: '组网卫星数', value: item?.satelliteCount || 0 },
{ label: '轨道面数', value: item?.orbitalPlaneCount || 0 },
{ label: '每轨卫星数', value: item?.satellitesPerOrbit || 0 }
],
label: item.constellationName,
label: item?.constellationName || '',
content: [
{ label: '在轨卫星数', value: item.satelliteCount, statusClass: 'top-left' },
{ label: '在网卫星数', value: item.satelliteCount, statusClass: 'top-right' },
{ label: '轨道高度(km)', value: item.orbitalAltitude, statusClass: 'bottom-left' },
{ label: '轨道倾角', value: item.orbitalInclination + '°', statusClass: 'bottom-right' }
{ label: '在轨卫星数', value: item?.satelliteCount || 0, statusClass: 'top-left' },
{ label: '在网卫星数', value: item?.satelliteCount || 0, statusClass: 'top-right' },
{ label: '轨道高度(km)', value: item?.orbitalAltitude || 0, statusClass: 'bottom-left' },
{ label: '轨道倾角', value: item?.orbitalInclination || 0 + '°', statusClass: 'bottom-right' }
]
}));
};
......@@ -497,14 +543,14 @@ const satelliteStatusMap = {
// 卫星列表转换
const transformSatelliteData = (data) => {
// console.log("dangaqian:", data[0].siteName === undefined ? data[0].satelliteType : data[0].siteName,data[0].satelliteType , data[0].siteName);
// //console.log("dangaqian:", data[0].siteName === undefined ? data[0].satelliteType : data[0].siteName,data[0].satelliteType , data[0].siteName);
return data.map(item => {
const index = Math.floor(Math.random() * 3);
return {
url: new URL('@/assets/images/lefts/satellite.png', import.meta.url).toString(),
name: item.satelliteName,
station: item.siteName === null ? '-' : item.siteName ,
station: item.siteName === null ? '-' : item.siteName,
manufacturer: item.manufacturer,
// status: satelliteStatus[index] || '正常',
status: item.satelliteStatus || '正常',
......@@ -519,21 +565,21 @@ const wssTransformSatelliteData = (data) => {
// 检查 data 是否为对象且不为 null
if (typeof data === 'object' && data !== null && !Array.isArray(data)) {
return [{
name: data.satelliteName || '',
station: data.siteName === null ? '-' : data.siteName ,
manufacturer: data.manufacturer || '',
status: data.satelliteStatus || '正常',
statusClass: satelliteStatusMap[data.satelliteStatus] || 'normal',
name: data?.satelliteName || '',
station: data?.siteName === null ? '-' : data?.siteName,
manufacturer: data?.manufacturer || '',
status: data?.satelliteStatus || '正常',
statusClass: satelliteStatusMap[data?.satelliteStatus || '正常'] || 'normal',
allData: data
}];
} else if (Array.isArray(data)) {
// 如果意外传入了数组,仍然处理数组
return data.map(item => ({
name: item.satelliteName || '',
station: item.siteName === null ? '-' : item.siteName ,
manufacturer: item.manufacturer || '',
status: item.satelliteStatus || '正常',
statusClass: satelliteStatusMap[item.satelliteStatus] || 'normal',
name: item?.satelliteName || '',
station: item?.siteName === null ? '-' : item?.siteName,
manufacturer: item?.manufacturer || '',
status: item?.satelliteStatus || '正常',
statusClass: satelliteStatusMap[item?.satelliteStatus || '正常'] || 'normal',
allData: item
}));
}
......@@ -544,14 +590,14 @@ const wssTransformSatelliteData = (data) => {
const errorDeviceList = ref('')
// watch(()=>errorDeviceList.value, (newVal, oldVal) => {
// console.log('*******111112errorDeviceList 变化了:', newVal, oldVal);
// //console.log('*******111112errorDeviceList 变化了:', newVal, oldVal);
// })
// 告警列表转换
const transformgroudSatelliteDafultData = (data) => {
// console.log("*******11111222111111************", data,data.groundNetworkElementResponses);
// //console.log("*******11111222111111************", data,data.groundNetworkElementResponses);
// 检查 data 是否为对象且不为 null
if (typeof data === 'object' && data !== null && !Array.isArray(data) ) {
if (typeof data === 'object' && data !== null && !Array.isArray(data)) {
// 如果是单个对象,直接转换为数组形式
return [{
station: data.siteName === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.siteName,
......@@ -559,12 +605,12 @@ const transformgroudSatelliteDafultData = (data) => {
qv: data.controlBaseStationNum2 === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.controlBaseStationNum2,
monitor: data.controlBaseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.controlBaseStationNum,
baseband: data.baseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.baseStationNum,
originErrorList:data.groundNetworkElementResponses ,
originErrorList: data.groundNetworkElementResponses,
antennaAzimuth: data.antennaAzimuth || '-',
antennaEip: data.antennaEip || '-',
antennaElevation: data.antennaElevation || '-',
antennaTransmitPower: data.antennaTransmitPower || '-',
allData: data
antennaEip: data.antennaEip || '-',
antennaElevation: data.antennaElevation || '-',
antennaTransmitPower: data.antennaTransmitPower || '-',
allData: data
}];
} else if (Array.isArray(data)) {
// 如果是数组,遍历每个元素并转换
......@@ -576,15 +622,15 @@ const transformgroudSatelliteDafultData = (data) => {
qv: item.controlBaseStationNum2 === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.controlBaseStationNum2,
monitor: item.controlBaseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.controlBaseStationNum,
baseband: item.baseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.baseStationNum,
originErrorList: item.groundNetworkElementResponses || [] ,
originErrorList: item.groundNetworkElementResponses || [],
antennaAzimuth: data.antennaAzimuth || '-',
antennaEip: data.antennaEip || '-',
antennaElevation: data.antennaElevation || '-',
antennaTransmitPower: data.antennaTransmitPower || '-',
allData: data
antennaEip: data.antennaEip || '-',
antennaElevation: data.antennaElevation || '-',
antennaTransmitPower: data.antennaTransmitPower || '-',
allData: data
}));
}
// 如果 data 不是对象也不是数组,返回空数组
return [];
};
......@@ -593,25 +639,25 @@ const transformgroudSatelliteDafultData = (data) => {
const transformgroudSatelliteData = (data) => {
// console.log("*******11111222111111************", data ,data.crossDeviceExtractResponseList );
// //console.log("*******11111222111111************", data ,data.crossDeviceExtractResponseList );
// 检查 data 是否为对象且不为 null
if (typeof data === 'object' && data !== null && !Array.isArray(data) ) {
if (typeof data === 'object' && data !== null && !Array.isArray(data)) {
// 如果是单个对象,直接转换为数组形式
return [{
station: data.siteName === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.siteName,
ku: data.controlAntennaNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.controlAntennaNum,
qv: data.controlBaseStationNum2 === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.controlBaseStationNum2,
monitor: data.controlBaseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.controlBaseStationNum,
baseband: data.baseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.baseStationNum,
originErrorList:data.groundNetworkElementResponses || [] ,
originCrossDeviceExtractResponseList: data.crossDeviceExtractResponseList || [] ,
antennaAzimuth: data.antennaAzimuth || '-',
antennaEip: data.antennaEip || '-',
antennaElevation: data.antennaElevation || '-',
antennaTransmitPower: data.antennaTransmitPower || '-',
station: data?.siteName === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data?.siteName,
ku: data?.controlAntennaNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data?.controlAntennaNum,
qv: data?.controlBaseStationNum2 === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data?.controlBaseStationNum2,
monitor: data?.controlBaseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data?.controlBaseStationNum,
baseband: data?.baseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data?.baseStationNum,
originErrorList: data?.groundNetworkElementResponses || [],
originCrossDeviceExtractResponseList: data?.crossDeviceExtractResponseList || [],
antennaAzimuth: data?.antennaAzimuth || '-',
antennaEip: data?.antennaEip || '-',
antennaElevation: data?.antennaElevation || '-',
antennaTransmitPower: data?.antennaTransmitPower || '-',
allData: data,
siteId: data.siteId || '-',
siteId: data?.siteId || '-',
}];
} else if (Array.isArray(data)) {
// 如果是数组,遍历每个元素并转换
......@@ -623,113 +669,106 @@ const transformgroudSatelliteData = (data) => {
qv: item.controlBaseStationNum2 === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.controlBaseStationNum2,
monitor: item.controlBaseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.controlBaseStationNum,
baseband: item.baseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.baseStationNum,
originErrorList: item.groundNetworkElementResponses || [] ,
originCrossDeviceExtractResponseList: item.crossDeviceExtractResponseList || [] ,
originErrorList: item.groundNetworkElementResponses || [],
originCrossDeviceExtractResponseList: item.crossDeviceExtractResponseList || [],
antennaAzimuth: item.antennaAzimuth || '-',
antennaEip: item.antennaEip || '-',
antennaElevation: item.antennaElevation || '-',
antennaTransmitPower: item.antennaTransmitPower || '-',
allData: item,
siteId: item.siteId || '-',
antennaEip: item.antennaEip || '-',
antennaElevation: item.antennaElevation || '-',
antennaTransmitPower: item.antennaTransmitPower || '-',
allData: item,
siteId: item.siteId || '-',
}));
}
// 如果 data 不是对象也不是数组,返回空数组
return [];
};
const wssTransformgroudSatelliteData = (data) => {
const wssTransformgroudSatelliteData = (data) => {
if (typeof data === 'object' && data !== null && !Array.isArray(data)) {
return {
station: data.siteName === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.siteName,
ku: data.controlAntennaNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.controlAntennaNum,
qv: data.controlBaseStationNum2 === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.controlBaseStationNum2,
monitor: data.controlBaseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.controlBaseStationNum,
baseband: data.baseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data.baseStationNum,
originErrorList:data.groundNetworkElementResponses || [] ,
originCrossDeviceExtractResponseList: data.crossDeviceExtractResponseList || [] ,
antennaAzimuth: data.antennaAzimuth || '-',
antennaEip: data.antennaEip || '-',
antennaElevation: data.antennaElevation || '-',
antennaTransmitPower: data.antennaTransmitPower || '-',
allData: data,
siteId: data.siteId || '-',
station: data?.siteName === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data?.siteName,
ku: data?.controlAntennaNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data?.controlAntennaNum,
qv: data?.controlBaseStationNum2 === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data?.controlBaseStationNum2,
monitor: data?.controlBaseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data?.controlBaseStationNum,
baseband: data?.baseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : data?.baseStationNum,
originErrorList: data?.groundNetworkElementResponses || [],
originCrossDeviceExtractResponseList: data?.crossDeviceExtractResponseList || [],
antennaAzimuth: data?.antennaAzimuth || '-',
antennaEip: data?.antennaEip || '-',
antennaElevation: data?.antennaElevation || '-',
antennaTransmitPower: data?.antennaTransmitPower || '-',
allData: data,
siteId: data?.siteId || '-',
}
} else if (Array.isArray(data)) {
// 如果意外传入了数组,仍然处理数组
return data.map(item => ({
// console.log("*******11111222111111************",data, data.groundNetworkElementResponses ,data[0].crossDeviceExtractResponseList );
station: item.siteName === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.siteName,
ku: item.controlAntennaNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.controlAntennaNum,
// 测试socket的数据筛选
// ku: item.controlAntennaNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.controlAntennaNum+'44',
qv: item.controlBaseStationNum2 === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.controlBaseStationNum2,
monitor: item.controlBaseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.controlBaseStationNum,
baseband: item.baseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.baseStationNum,
originErrorList: item.groundNetworkElementResponses || [] ,
originCrossDeviceExtractResponseList: item.crossDeviceExtractResponseList || [] ,
antennaAzimuth: item.antennaAzimuth || '-',
antennaEip: item.antennaEip || '-',
antennaElevation: item.antennaElevation || '-',
antennaTransmitPower: item.antennaTransmitPower || '-',
allData: item,
siteId: item.siteId || '-',
}));
// //console.log("*******11111222111111************",data, data.groundNetworkElementResponses ,data[0].crossDeviceExtractResponseList );
station: item?.siteName === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item?.siteName,
ku: item?.controlAntennaNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item?.controlAntennaNum,
// 测试socket的数据筛选
// ku: item.controlAntennaNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item.controlAntennaNum+'44',
qv: item?.controlBaseStationNum2 === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item?.controlBaseStationNum2,
monitor: item?.controlBaseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item?.controlBaseStationNum,
baseband: item?.baseStationNum === 0 ? (activeTab.value === 'equipment' ? 0 : '-') : item?.baseStationNum,
originErrorList: item?.groundNetworkElementResponses || [],
originCrossDeviceExtractResponseList: item?.crossDeviceExtractResponseList || [],
antennaAzimuth: item?.antennaAzimuth || '-',
antennaEip: item?.antennaEip || '-',
antennaElevation: item?.antennaElevation || '-',
antennaTransmitPower: item?.antennaTransmitPower || '-',
allData: item,
siteId: item?.siteId || '-',
}));
// 如果 data 不是对象也不是数组,返回空数组
return [];
// 如果 data 不是对象也不是数组,返回空数组
}
}
const transformGroundSatelliteData = (data) => {
return [
{ label: '地面站数', value: data.groundStationNum === null ? 0 : data.groundStationNum },
{ label: '开通格网数', value: data.openGridNum === null ? 0 : data.openGridNum },
{ label: '弧段数量', value: data.arcNum === null ? 0 : data.arcNum },
{ label: '执行情况-弧段', value: data.arcExecuteNum === null ? 0 : data.arcExecuteNum },
{ label: '设备故障', value: data.faultDeviceNum === null ? 0 : data.faultDeviceNum },
// { label: '上注完成情况(星)', value: data.arcCompleteNum === null || data.arcCompleteNum === undefined ? 0 : data.arcCompleteNum },
// { label: '上注失败星数(星)', value: data.arcFaultNum === null || data.arcFaultNum === undefined ? 0 : data.arcFaultNum }
{ label: '地面站数', value: data?.groundStationNum === null ? 0 : data?.groundStationNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/NumberOfGroundStations.png' , import.meta.url).href},
{ label: '开通格网数', value: data?.openGridNum === null ? 0 : data?.openGridNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/ActivateGridNumber.png' , import.meta.url).href},
{ label: '弧段数量', value: data?.arcNum === null ? 0 : data?.arcNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/NumberOfArcSegments.png' , import.meta.url).href},
{ label: '执行情况-弧段', value: data?.arcExecuteNum === null ? 0 : data?.arcExecuteNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/ExecutionStatusArcSegment.png' , import.meta.url).href},
{ label: '上注完成情况(星)', value: data?.arcCompleteNum === null || data?.arcCompleteNum === undefined ? 0 : data?.arcCompleteNum,CurrentURL:new URL('../../assets/images/leftGroundIcon/CompletionStatusOfTheAboveNote.png' , import.meta.url).href },
{ label: '上注失败星数(星)', value: data?.arcFaultNum === null || data?.arcFaultNum === undefined ? 0 : data?.arcFaultNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/NumberOfStarsFailedToBet.png' , import.meta.url).href},
{ label: '设备故障', value: data?.faultDeviceNum === null ? 0 : data?.faultDeviceNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/NumberOfFaultyDevices.png' , import.meta.url).href},
]
};
const wssTransformGroundSatelliteData = (data) => {
// 检查 data 是否为对象且不为 null
if (typeof data === 'object' && data !== null && !Array.isArray(data)) {
return [
{ label: '地面站数', value: data.groundStationNum === null ? 0 : data.groundStationNum },
{ label: '开通格网数', value: data.openGridNum === null ? 0 : data.openGridNum },
{ label: '弧段数量', value: data.arcNum === null ? 0 : data.arcNum },
{ label: '执行情况-弧段', value: data.arcExecuteNum === null ? 0 : data.arcExecuteNum },
{ label: '设备故障', value: data.faultDeviceNum === null ? 0 : data.faultDeviceNum },
// { label: '上注完成情况(星)', value: data.arcCompleteNum === null ? 0 : data.arcCompleteNum },
// { label: '上注失败星数(星)', value: data.arcFaultNum === null ? 0 : data.arcFaultNum }
];
} else if (Array.isArray(data)) {
// 如果意外传入了数组,仍然处理数组
return data.map(item => ([
{ label: '地面站数', value: item.groundStationNum === null ? 0 : item.groundStationNum },
{ label: '开通格网数', value: item.openGridNum === null ? 0 : item.openGridNum },
{ label: '弧段数量', value: item.arcNum === null ? 0 : item.arcNum },
{ label: '执行情况-弧段', value: item.arcExecuteNum === null ? 0 : item.arcExecuteNum },
{ label: '设备故障', value: item.faultDeviceNum === null ? 0 : item.faultDeviceNum },
// { label: '上注完成情况(星)', value: item.arcCompleteNum === null ? 0 : item.arcCompleteNum },
// { label: '上注失败星数(星)', value: item.arcFaultNum === null ? 0 : item.arcFaultNum }
]));
}
return [
{ label: '地面站数', value: data?.groundStationNum === null ? 0 : data?.groundStationNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/NumberOfGroundStations.png' , import.meta.url).href},
{ label: '开通格网数', value: data?.openGridNum === null ? 0 : data?.openGridNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/ActivateGridNumber.png' , import.meta.url).href},
{ label: '弧段数量', value: data?.arcNum === null ? 0 : data?.arcNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/NumberOfArcSegments.png' , import.meta.url).href},
{ label: '执行情况-弧段', value: data?.arcExecuteNum === null ? 0 : data?.arcExecuteNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/ExecutionStatusArcSegment.png' , import.meta.url).href},
{ label: '上注完成情况(星)', value: data?.arcCompleteNum === null || data?.arcCompleteNum === undefined ? 0 : data?.arcCompleteNum,CurrentURL:new URL('../../assets/images/leftGroundIcon/CompletionStatusOfTheAboveNote.png' , import.meta.url).href },
{ label: '上注失败星数(星)', value: data?.arcFaultNum === null || data?.arcFaultNum === undefined ? 0 : data?.arcFaultNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/NumberOfStarsFailedToBet.png' , import.meta.url).href},
{ label: '设备故障', value: data?.faultDeviceNum === null ? 0 : data?.faultDeviceNum ,CurrentURL:new URL('../../assets/images/leftGroundIcon/NumberOfFaultyDevices.png' , import.meta.url).href},
];
}
// 如果 data 不是对象也不是数组,返回空数组
return [];
};
const leftGetAllListInfo = () => {
stellationInfoApi().then(res => {
const leftGetAllListInfo = () => {
stellationInfoApi().then(res => {
orbitMetrics.value = transformConstellationData(res.data);
coreMetrics.value = orbitMetrics.value[0].headerTitle
})
stellateListInfoApi().then(res => {
console.log(res.data,"sas---------asasa");
//console.log(res.data, "sas---------asasa");
primitiveSatelliteData.value = transformSatelliteData(res.data)
// 按 satelliteName 排序,专门处理 "SS GEN1-15" 格式
primitiveSatelliteData.value.sort((a, b) => {
......@@ -739,20 +778,20 @@ const leftGetAllListInfo = () => {
});
});
satelliteData.value = primitiveSatelliteData.value
// console.log("4545",primitiveSatelliteData.value ,primitiveSatelliteData.value.length);
// //console.log("4545",primitiveSatelliteData.value ,primitiveSatelliteData.value.length);
})
siteDataInfoListApi().then(res => {
// console.log(res,"sasa1111111sasa");
// //console.log(res,"sasa1111111sasa");
equipmentData.value = transformgroudSatelliteData(res.data)
primitiveEquipmentData.value = equipmentData.value
// groundSatelliteData.value = primitiveGroundSatelliteData.value
})
groundSystemStatisticsInfoApi().then(res => {
console.log(res.data,"s************a");
//console.log(res.data, "s************a");
groundMetrics.value = transformGroundSatelliteData(res.data)
// console.log(groundMetrics.value,"56555555555555")
// //console.log(groundMetrics.value,"56555555555555")
})
};
......@@ -767,21 +806,31 @@ onBeforeMount(() => {
// 监听 webSocket 结束变化,再根据api查一次数据库
watch(() => useAppStoreInstance.globalStartWss, (newValue, oldValue) => {
if (!newValue) {
if (!newValue) {
setTimeout(() => {
leftGetAllListInfo();
}, 10000);
// leftGetAllListInfo();
}
})
// 判断时间time是否在指定范围内
function isTimeInRange(time, timeStart, endTime) {
const t = new Date(time).getTime();
const start = new Date(timeStart).getTime();
const end = new Date(endTime).getTime();
return t >= start && t <= end;
}
const Innerwidth = ref(window.innerWidth);
const Innerheight = ref(window.innerHeight);
// const checkScreenSize = () => {
// Innerwidth.value = window.innerWidth;
// Innerheight.value = window.innerHeight;
// console.log("当前设备的尺寸:",Innerwidth.value,Innerheight.value);
// //console.log("当前设备的尺寸:",Innerwidth.value,Innerheight.value);
// }
onBeforeMount(() => {
......@@ -795,7 +844,7 @@ onBeforeMount(() => {
// 获取本地存储的自动播放状态
const savedAutoPlay = local.local.get('globaleAutoPlay')
// console.log('从本地存储获取的自动播放状态:', savedAutoPlay, typeof savedAutoPlay);
// //console.log('从本地存储获取的自动播放状态:', savedAutoPlay, typeof savedAutoPlay);
// 确保布尔值正确处理
if (savedAutoPlay !== undefined && savedAutoPlay !== null) {
......@@ -803,25 +852,31 @@ onBeforeMount(() => {
} else {
globaleAutoPlay.value = true; // 默认值
}
// console.log('最终设置的自动播放状态:', globaleAutoPlay.value, typeof globaleAutoPlay.value);
// useAppStoreInstance.setGlobalLeftWssCONTINE(wss);
// //console.log('最终设置的自动播放状态:', globaleAutoPlay.value, typeof globaleAutoPlay.value);
})
const messageHandler = ref('')
onMounted(() => {
messageHandler.value = (event) => {
const JSONdata = JSON.parse(event.data);
console.log("我走了onMounted",JSONdata.type === 'history' , !(JSONdata?.isLagrangeInterpolation === true));
const errorDeviceListDetailsDialog = ref([])
const tempCount = ref(0)
watch(() =>useAppStoreInstance.globalLeftWssCONTINE, val => {
const JSONdata = val
// console.log("useAppStoreInstance.globalLeftWssCONTINE", JSONdata,(JSONdata.type === 'history' && !(JSONdata?.isLagrangeInterpolation === true) ),JSONdata.type === 'realtime');
if (JSONdata.type === 'history' ) {
if (JSONdata.type === 'history' && !(JSONdata?.isLagrangeInterpolation === true) && (JSONdata.groundSystem !== undefined)) {
const satelliteList = []
JSONdata.CurrData.forEach(items => {
const temp = items.satelliteBasicInfoResponse
temp.siteName = items?.siteName || null
temp.siteName = items?.currentGatewayAssociations || null
satelliteList.push(temp)
});
//console.log("我走了这里", satelliteList);
primitiveSatelliteData.value = wssTransformSatelliteData(satelliteList)
primitiveSatelliteData.value.sort((a, b) => {
return a.name.localeCompare(b.name, undefined, {
......@@ -829,42 +884,42 @@ onMounted(() => {
sensitivity: 'base' // 忽略大小写和重音符号
});
});
console.log("cao cao2,",primitiveSatelliteData.value,);
//console.log("cao cao2,", primitiveSatelliteData.value,);
satelliteData.value = primitiveSatelliteData.value
primitiveEquipmentData.value = equipmentData.value
console.log('我是left,type == history获取的wssRespone:', JSONdata.groundStationDeviceCount);
//console.log('我是left,type == history获取的wssRespone:', JSONdata.groundStationDeviceCount);
// 地面数据,上层数据
groundMetrics.value = wssTransformGroundSatelliteData(JSONdata.groundSystem)
// 地面数据,下层数据
primitiveFaultData.value = []
primitiveFaultData.value = wssTransformgroudSatelliteData(JSONdata.deviceFaultCondition)
primitiveFaultData.value = []
primitiveFaultData.value = wssTransformgroudSatelliteData(JSONdata.deviceFaultCondition)
faultData.value = primitiveFaultData.value
console.log("此时的fault", primitiveFaultData.value);
//console.log("此时的fault", primitiveFaultData.value);
if (searchEquipmentValue.value !== '') {
searchEquipmentList()
}
errorDeviceListDetailsDialog.value = JSONdata?.gatewayStationDetails
primitiveEquipmentData.value = []
primitiveEquipmentData.value = wssTransformgroudSatelliteData(JSONdata.groundStationDeviceCount)
//console.log("此时的equipment", primitiveEquipmentData.value);
primitiveEquipmentData.value = []
primitiveEquipmentData.value = wssTransformgroudSatelliteData(JSONdata.groundStationDeviceCount)
console.log("此时的equipment", primitiveEquipmentData.value);
equipmentData.value = primitiveEquipmentData.value
if (searchEquipmentValue.value !== '') {
searchEquipmentList()
}
}
if (JSONdata.type === 'realtime') {
console.log("11111EIRP111111rowrealtime");
const satelliteList = []
JSONdata.CurrData.forEach(items => {
const temp = items.satelliteBasicInfoResponse
......@@ -878,49 +933,158 @@ onMounted(() => {
sensitivity: 'base' // 忽略大小写和重音符号
});
});
console.log("cao cao2,",primitiveSatelliteData.value,);
//console.log("cao cao2,", primitiveSatelliteData.value,);
satelliteData.value = primitiveSatelliteData.value
primitiveEquipmentData.value = equipmentData.value
// console.log('我是left,type == history获取的wssRespone:', JSONdata.groundStationDeviceCount);
// //console.log('我是left,type == history获取的wssRespone:', JSONdata.groundStationDeviceCount);
// 地面数据,上层数据
// groundMetrics.value = wssTransformGroundSatelliteData(JSONdata.groundSystem)
// 地面数据,下层数据
// primitiveFaultData.value = []
// primitiveFaultData.value = wssTransformgroudSatelliteData(JSONdata.deviceFaultCondition)
// primitiveFaultData.value = []
// primitiveFaultData.value = wssTransformgroudSatelliteData(JSONdata.deviceFaultCondition)
// faultData.value = primitiveFaultData.value
// console.log("此时的fault", primitiveFaultData.value);
// //console.log("此时的fault", primitiveFaultData.value);
// if (searchEquipmentValue.value !== '') {
// searchEquipmentList()
// searchEquipmentList()
// }
// primitiveEquipmentData.value = []
// primitiveEquipmentData.value = wssTransformgroudSatelliteData(JSONdata.groundStationDeviceCount)
// console.log("此时的equipment", primitiveEquipmentData.value);
// equipmentData.value = primitiveEquipmentData.value
// if (searchEquipmentValue.value !== '') {
// searchEquipmentList()
// }
// primitiveEquipmentData.value = []
// primitiveEquipmentData.value = wssTransformgroudSatelliteData(JSONdata.groundStationDeviceCount)
// //console.log("此时的equipment", primitiveEquipmentData.value);
// equipmentData.value = primitiveEquipmentData.value
// if (searchEquipmentValue.value !== '') {
// searchEquipmentList()
// }
}
tempCount.value++
}, { deep: true, immediate: true });
// console.log('我是left,type !!!= history获取的wssRespone:', JSONdata, typeof JSONdata.satelliteList);
// 在这里处理您的业务逻辑
};
wss.addEventListener('message', messageHandler.value);
// console.log("组件挂载时的自动播放状态:", globaleAutoPlay.value);
onMounted(() => {
// (useAppStoreInstance.globalLeftWssCONTINE).onmessage = (event) => {
// const JSONdata = JSON.parse(event.data);
// //console.log("我走了onMounted", JSONdata.type === 'history', !(JSONdata?.isLagrangeInterpolation === true));
// if (JSONdata.type === 'history' && !(JSONdata?.isLagrangeInterpolation === true) && (JSONdata.groundSystem !== undefined)) {
// const satelliteList = []
// JSONdata.CurrData.forEach(items => {
// const temp = items.satelliteBasicInfoResponse
// temp.siteName = items?.currentGatewayAssociations || null
// satelliteList.push(temp)
// });
// //console.log("我走了这里", satelliteList);
// primitiveSatelliteData.value = wssTransformSatelliteData(satelliteList)
// primitiveSatelliteData.value.sort((a, b) => {
// return a.name.localeCompare(b.name, undefined, {
// numeric: true, // 启用数字排序
// sensitivity: 'base' // 忽略大小写和重音符号
// });
// });
// //console.log("cao cao2,", primitiveSatelliteData.value,);
// satelliteData.value = primitiveSatelliteData.value
// primitiveEquipmentData.value = equipmentData.value
// //console.log('我是left,type == history获取的wssRespone:', JSONdata.groundStationDeviceCount);
// // 地面数据,上层数据
// groundMetrics.value = wssTransformGroundSatelliteData(JSONdata.groundSystem)
// // 地面数据,下层数据
// primitiveFaultData.value = []
// primitiveFaultData.value = wssTransformgroudSatelliteData(JSONdata.deviceFaultCondition)
// faultData.value = primitiveFaultData.value
// //console.log("此时的fault", primitiveFaultData.value);
// if (searchEquipmentValue.value !== '') {
// searchEquipmentList()
// }
// errorDeviceListDetailsDialog.value = JSONdata?.gatewayStationDetails
// primitiveEquipmentData.value = []
// primitiveEquipmentData.value = wssTransformgroudSatelliteData(JSONdata.groundStationDeviceCount)
// //console.log("此时的equipment", primitiveEquipmentData.value);
// equipmentData.value = primitiveEquipmentData.value
// if (searchEquipmentValue.value !== '') {
// searchEquipmentList()
// }
// }
// if (JSONdata.type === 'realtime') {
// //console.log("11111EIRP111111rowrealtime");
// const satelliteList = []
// JSONdata.CurrData.forEach(items => {
// const temp = items.satelliteBasicInfoResponse
// temp.siteName = items.siteName
// satelliteList.push(temp)
// });
// primitiveSatelliteData.value = wssTransformSatelliteData(satelliteList)
// primitiveSatelliteData.value.sort((a, b) => {
// return a.name.localeCompare(b.name, undefined, {
// numeric: true, // 启用数字排序
// sensitivity: 'base' // 忽略大小写和重音符号
// });
// });
// //console.log("cao cao2,", primitiveSatelliteData.value,);
// satelliteData.value = primitiveSatelliteData.value
// primitiveEquipmentData.value = equipmentData.value
// // //console.log('我是left,type == history获取的wssRespone:', JSONdata.groundStationDeviceCount);
// // 地面数据,上层数据
// // groundMetrics.value = wssTransformGroundSatelliteData(JSONdata.groundSystem)
// // 地面数据,下层数据
// // primitiveFaultData.value = []
// // primitiveFaultData.value = wssTransformgroudSatelliteData(JSONdata.deviceFaultCondition)
// // faultData.value = primitiveFaultData.value
// // //console.log("此时的fault", primitiveFaultData.value);
// // if (searchEquipmentValue.value !== '') {
// // searchEquipmentList()
// // }
// // primitiveEquipmentData.value = []
// // primitiveEquipmentData.value = wssTransformgroudSatelliteData(JSONdata.groundStationDeviceCount)
// // //console.log("此时的equipment", primitiveEquipmentData.value);
// // equipmentData.value = primitiveEquipmentData.value
// // if (searchEquipmentValue.value !== '') {
// // searchEquipmentList()
// // }
// }
// // //console.log('我是left,type !!!= history获取的wssRespone:', JSONdata, typeof JSONdata.satelliteList);
// // 在这里处理您的业务逻辑
// };
// (useAppStoreInstance.globalLeftWssCONTINE).addEventListener('message', messageHandler.value);
// //console.log("组件挂载时的自动播放状态:", wss);
})
onUnmounted(() => {
if (messageHandler.value) {
console.log("移除socket的链接");
//console.log("移除socket的链接");
// wss.removeEventListener('message', messageHandler.value);
}
......@@ -1125,7 +1289,7 @@ onUnmounted(() => {
width: 100px;
/* min-height: 25px; */
background-image: url('@/assets/images/lefts/bg_orbit_title.png');
background-size: 140% 100%;
background-size: 150% 100%;
/* background-color: #22c55e; */
/* 或者 cover/auto */
background-repeat: no-repeat;
......@@ -1223,6 +1387,7 @@ onUnmounted(() => {
/* padding: 25px 50px; */
padding-top: 3px;
padding-bottom: 3px;
font-size: 13px;
text-align: center;
justify-items: center;
......@@ -1756,13 +1921,13 @@ onUnmounted(() => {
/* 在您的样式部分添加 */
:deep(.custom-error-dialog .el-overlay) {
/* :deep(.custom-error-dialog .el-overlay) {
z-index: 1000 !important;
}
:deep(.custom-error-dialog .el-dialog) {
z-index: 1001 !important;
}
} */
:deep(.el-dialog) {
position: absolute;
......@@ -1822,14 +1987,15 @@ onUnmounted(() => {
/* box-shadow: 0 0 1px #bfc1c4; */
}
:deep(.is-disabled .el-input__wrapper){
background-color: #1C212B;
:deep(.is-disabled .el-input__wrapper) {
background-color: #1C212B;
}
:deep(.el-input__wrapper .el-input__inner){
:deep(.el-input__wrapper .el-input__inner) {
background-color: #1C212B;
color: #fff;
}
:deep(.el-input__inner) {
background-color: #1C212B;
color: #fff;
......@@ -1851,14 +2017,25 @@ background-color: #1C212B;
.setting-input {
background-color: #1C212B;
color: #fff;
box-shadow: none;
border: 1px solid #434a54;
border-radius: 4px;
}
.setting-input :deep(.el-input__inner) {
background-color: #1C212B;
color: #fff;
border-color: #434a54;
}
:deep(.setting-input .el-input__wrapper) {
box-shadow: none;
border: none;
}
:deep(.setting-input .el-input__wrapper .el-input__inner) {
box-shadow: none;
border: none;
}
.setting-checkbox {
margin-left: 10px;
}
......
......@@ -18,6 +18,7 @@ import * as echarts from 'echarts';
import { ElMessage } from 'element-plus';
import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
let myChart = null;
const props = defineProps({
idName: {
type: String,
......@@ -34,20 +35,20 @@ const props = defineProps({
})
watch(() => props.propsDate, (newVal, oldVal) => {
if (newVal?.isFirstSearch) {
if (newVal.dataX.length === 0 || newVal.dataY.length === 0) {
if (newVal?.isFirstSearch) {
if (newVal.dataX.length === 0 || newVal.dataY.length === 0) {
ElMessage({
message: `${props.propsDate.chartName || 'CDF Curve'}该时间段数据为空,请检查数据`,
type: 'warning'
})
return;
return;
}
changeCharte(props.idName,props.propsDate);
// console.log("完全不一样的数据",newVal);
changeCharte(props.idName, props.propsDate);
}
}, { immediate: true, deep: true })
let myChart = null;
onMounted(() => {
initChart();
......@@ -60,8 +61,9 @@ onUnmounted(() => {
}
});
function changeCharte(idName,NewOption) {
function changeCharte(idName, NewOption) {
// 销毁旧实例
if (myChart) {
myChart.dispose();
......@@ -76,7 +78,7 @@ function changeCharte(idName,NewOption) {
// 初始化新实例
const chartDom = document.getElementById(idName);
chartDom.style.height = '300px';
chartDom.style.height = '330px';
chartDom.style.width = '360px';
if (!chartDom) {
console.error("DOM 元素未找到:", idName);
......@@ -84,7 +86,7 @@ function changeCharte(idName,NewOption) {
}
myChart = echarts.init(chartDom);
// 设置新 option
const option = {
// tooltip: {
......@@ -117,14 +119,14 @@ function changeCharte(idName,NewOption) {
// saveAsImage: {}
// }
// },
legend: {
legend: {
show: true,
data: [NewOption.chartName],
textStyle: {
color: '#fff',
fontSize: 12
},
top: '10px',
// top: '10px',
// left: '-5px',
backgroundColor: 'transparent',
borderColor: 'transparent',
......@@ -133,10 +135,10 @@ function changeCharte(idName,NewOption) {
icon: 'rect', // 使用矩形图标
itemWidth: 15, // 图例宽度
itemHeight: 5, // 图例高度,设为较小值形成线条效果
},
grid: {
// top: '-1%',
top: '15%',
right: '8%',
// bottom: '16%',
left: '15%'
......@@ -144,7 +146,7 @@ function changeCharte(idName,NewOption) {
xAxis: {
type: 'category',
boundaryGap: false,
show:false,
show: false,
data: NewOption.dataX,
axisLine: {
lineStyle: {
......@@ -156,10 +158,11 @@ function changeCharte(idName,NewOption) {
}
},
yAxis: {
name: NewOption.unit ,
type: 'value',
min:NewOption.minY,
max:NewOption.maxY,
min: NewOption.minY,
max: NewOption.maxY,
boundaryGap: [0, '100%'],
axisLine: {
lineStyle: {
......@@ -168,9 +171,9 @@ function changeCharte(idName,NewOption) {
},
axisLabel: {
color: '#fff',
formatter: function (value) {
return value.toFixed(2); // 保留三位小数
}
// formatter: function (value) {
// return value.toFixed(2); // 保留三位小数
// }
},
splitLine: {
lineStyle: {
......@@ -182,12 +185,42 @@ function changeCharte(idName,NewOption) {
{
type: 'inside',
start: 0,
end: 100
end: 10,
left: '14%',
right: '22%',
minSpan: 1,
handleLabel: {
show: false
},
labelFormatter: function (value) {
return NewOption.dataX[value].split(' ')[0] + '\n' + NewOption.dataX[value].split(' ')[1];
},
textStyle: {
color: 'rgba(255, 255, 255, 0.92)',
fontSize: 8
}
},
// {
// start: 0,
// end: 100
// }
{
start: 0,
end: 100,
minSpan: 1,
left: '14%',
right: '22%',
handleLabel: {
show: false
},
labelFormatter: function (value) {
return NewOption.dataX[value].split(' ')[0] + '\n' + NewOption.dataX[value].split(' ')[1];
},
textStyle: {
color: 'rgba(255, 255, 255, 0.92)',
fontSize: 8
}
}
],
series: [
{
......@@ -196,24 +229,25 @@ function changeCharte(idName,NewOption) {
smooth: true,
symbol: 'none',
lineStyle: {
width: 2
width: 3,
color: 'rgba(0,186,163, 0.92)'
},
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: 'rgba(58, 77, 233, 0.8)'
color: 'rgba(0,186,163, 0.92)'
},
{
offset: 1,
color: 'rgba(58, 77, 233, 0.1)'
color: 'rgba(0,186,163, 0.2)'
}
])
},
data: NewOption.dataY
}
],
tooltip: {
tooltip: {
trigger: 'axis',
// 确保tooltip显示在最上层
extraCssText: 'z-index: 999999 !important;',
......@@ -223,12 +257,23 @@ function changeCharte(idName,NewOption) {
padding: 10,
textStyle: {
color: '#fff',
fontSize: 12
fontSize: 10
},
// 固定tooltip位置在顶部
position: function (pos, params, dom, rect, size) {
return ['15%', pos[1]];
formatter: function (params) {
let res = `<div>${params[0].name}</div>`; // 添加标题
for (let i = 0; i < params.length; i++) {
res += `<div >${params[i].seriesName}: ${params[i].data} ${NewOption.unit }</div>`;
}
return res; // 返回拼接后的内容
}
// 固定tooltip位置
// position: function (pos, params, dom, rect, size) {
// //console.log("当前位置:",pos[0]);
// return [pos[0]<15 || pos[0]< 0.15 || pos[0]<'15'|| pos[0]<'15%'?'15%':pos[0], pos[1]];
// }
}
};
......@@ -236,6 +281,32 @@ function changeCharte(idName,NewOption) {
resizeChart();
}
const newDataY = [12, 13, 85, 53, 139, 23, 18, 102, 13, 85, 53, 19, 23, 18, 12, 13, 85, 531, 19, 23, 18, 12, 13, 85, 553, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18,
12, 13, 815, 153, 19, 203, 108, 12, 13, 85, 53, 19, 23, 118, 112, 13, 85, 53, 19, 223, 18, 12, 113, 85, 353, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18,
12, 13, 85, 53, 19, 23, 18, 12, 13, 815, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53, 119, 23, 18, 12, 13, 85, 53, 19, 23, 18,
12, 13, 85, 531, 19, 203, 18, 102, 13, 85, 531, 19, 23, 18, 12, 13, 85, 53, 119, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18,
5, 513, 19, 23, 18, 512, 13, 855, 523, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 531, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18,
12, 413, 852, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18,
142, 13, 85, 153, 189, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53
]
const newDataX = ['2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01-01 00:00:07',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01--01 00:00:07',
'2025-1-8 00:00:08', '2025-1-9 00:00:09', '2025-1-10 00:00:10', '2025-1-10 00:00:11', '2025-1-10 00:00:12', '2025-1-11 00:00:13',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01-01 00:00:07',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01--01 00:00:07',
'2025-1-8 00:00:08', '2025-1-9 00:00:09', '2025-1-10 00:00:10', '2025-1-10 00:00:11', '2025-1-10 00:00:12', '2025-1-11 00:00:13',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01-01 00:00:07',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01--01 00:00:07',
'2025-1-8 00:00:08', '2025-1-9 00:00:09', '2025-1-10 00:00:10', '2025-1-10 00:00:11', '2025-1-10 00:00:12', '2025-1-11 00:00:13',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01-01 00:00:07',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01--01 00:00:07',
'2025-1-8 00:00:08', '2025-1-9 00:00:09', '2025-1-10 00:00:10', '2025-1-10 00:00:11', '2025-1-10 00:00:12', '2025-1-11 00:00:13',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01-01 00:00:07',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01--01 00:00:07',
'2025-1-8 00:00:08', '2025-1-9 00:00:09', '2025-1-10 00:00:10', '2025-1-10 00:00:11', '2025-1-10 00:00:12', '2025-1-11 00:00:13',
]
function initChart() {
const chartDom = document.getElementById(props.idName);
chartDom.style.height = '300px';
......@@ -273,8 +344,26 @@ function initChart() {
// saveAsImage: {}
// }
// },
legend: {
show: true,
// data: [NewOption.chartName],
textStyle: {
color: '#fff',
fontSize: 12
},
// top: '10px',
// left: '-5px',
backgroundColor: 'transparent',
borderColor: 'transparent',
padding: [5, 10],
// 添加图标样式控制
icon: 'rect', // 使用矩形图标
itemWidth: 15, // 图例宽度
itemHeight: 5, // 图例高度,设为较小值形成线条效果
},
grid: {
top: '-1%',
top: '15%',
right: '8%',
// bottom: '16%',
left: '15%'
......@@ -282,34 +371,50 @@ function initChart() {
xAxis: {
type: 'category',
boundaryGap: false,
show:false,
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
show: false,
data: ['2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01-01 00:00:07',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01--01 00:00:07',
'2025-1-8 00:00:08', '2025-1-9 00:00:09', '2025-1-10 00:00:10', '2025-1-10 00:00:11', '2025-1-10 00:00:12', '2025-1-11 00:00:13',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01-01 00:00:07',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01--01 00:00:07',
'2025-1-8 00:00:08', '2025-1-9 00:00:09', '2025-1-10 00:00:10', '2025-1-10 00:00:11', '2025-1-10 00:00:12', '2025-1-11 00:00:13',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01-01 00:00:07',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01--01 00:00:07',
'2025-1-8 00:00:08', '2025-1-9 00:00:09', '2025-1-10 00:00:10', '2025-1-10 00:00:11', '2025-1-10 00:00:12', '2025-1-11 00:00:13',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01-01 00:00:07',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01--01 00:00:07',
'2025-1-8 00:00:08', '2025-1-9 00:00:09', '2025-1-10 00:00:10', '2025-1-10 00:00:11', '2025-1-10 00:00:12', '2025-1-11 00:00:13',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01-01 00:00:07',
'2025-01-01 00:00:00', '2025-01-01 00:00:02', '2025-01-01 00:00:03', '2025-01-01 00:00:04', '2025-01-01 00:00:05', '2025-01-01 00:00:06', '2025-01--01 00:00:07',
'2025-1-8 00:00:08', '2025-1-9 00:00:09', '2025-1-10 00:00:10', '2025-1-10 00:00:11', '2025-1-10 00:00:12', '2025-1-11 00:00:13',
],
axisLine: {
lineStyle: {
color: '#fff'
}
},
axisLabel: {
color: '#fff'
}
},
yAxis: {
name: props.propsDate.unit,
type: 'value',
min:props.propsDate.minY,
max:props.propsDate.maxY,
// min:props.propsDate.minY,
// max:props.propsDate.maxY,
boundaryGap: [0, '100%'],
axisLine: {
lineStyle: {
color: '#fff'
}
},
axisLabel: {
color: '#fff',
formatter: function (value) {
return value.toFixed(2); // 保留三位小数
}
},
axisLabel: {
color: '#fff',
formatter: function (value) {
return value.toFixed(2); // 保留三位小数
}
},
splitLine: {
lineStyle: {
color: 'rgba(255, 255, 255, 0.2)'
......@@ -320,9 +425,42 @@ function initChart() {
{
type: 'inside',
start: 0,
end: 100
end: 1,
left: '14%',
right: '20%',
minSpan: 10,
handleLabel: {
show: false
},
labelFormatter: function (value) {
return newDataX[value].split(' ')[0] + '\n' + newDataX[value].split(' ')[1];
},
textStyle: {
color: 'rgba(255, 255, 255, 0.92)',
fontSize: 8
}
},
{
start: 0,
end: 100,
minSpan: 1,
left: '14%',
right: '20%',
handleLabel: {
show: false
},
labelFormatter: function (value) {
return newDataX[value].split(' ')[0] + '\n' + newDataX[value].split(' ')[1];
},
textStyle: {
color: 'rgba(255, 255, 255, 0.92)',
fontSize: 8
}
}
],
series: [
{
......@@ -331,25 +469,33 @@ function initChart() {
smooth: true,
symbol: 'none',
lineStyle: {
width: 2
width: 3,
color: 'rgba(0,186,163,0.92)'
},
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: 'rgba(58, 77, 233, 0.8)'
color: 'rgba(0,186,163, 0.92)'
},
{
offset: 1,
color: 'rgba(58, 77, 233, 0.1)'
color: 'rgba(0,186,163, 0.2)'
}
])
},
data: [12, 13, 85, 53, 19, 23, 18]
data: [12, 13, 85, 53, 139, 23, 18, 102, 13, 85, 53, 19, 23, 18, 12, 13, 85, 531, 19, 23, 18, 12, 13, 85, 553, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18,
12, 13, 815, 153, 19, 203, 108, 12, 13, 85, 53, 19, 23, 118, 112, 13, 85, 53, 19, 223, 18, 12, 113, 85, 353, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18,
12, 13, 85, 53, 19, 23, 18, 12, 13, 815, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53, 119, 23, 18, 12, 13, 85, 53, 19, 23, 18,
12, 13, 85, 531, 19, 203, 18, 102, 13, 85, 531, 19, 23, 18, 12, 13, 85, 53, 119, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18,
5, 513, 19, 23, 18, 512, 13, 855, 523, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 531, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18,
12, 413, 852, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53, 19, 23, 18,
142, 13, 85, 153, 189, 23, 18, 12, 13, 85, 53, 19, 23, 18, 12, 13, 85, 53
]
}
],
tooltip: {
tooltip: {
trigger: 'axis',
// 确保tooltip显示在最上层
extraCssText: 'z-index: 999999 !important;',
......@@ -361,10 +507,21 @@ function initChart() {
color: '#fff',
fontSize: 12
},
// 固定tooltip位置在顶部
position: function (pos, params, dom, rect, size) {
return ['15%', pos[1]];
formatter: function (params) {
let res = `<div>${params[0].name}</div>`; // 添加标题
for (let i = 0; i < params.length; i++) {
res += `<div >${params[i].seriesName}: ${params[i].data} ${props.propsDate.unit }</div>`;
}
return res; // 返回拼接后的内容
}
// 固定tooltip位置在顶部
// position: function (pos, params, dom, rect, size) {
// const width = size.viewSize[0];
// const x = Math.min(Math.max(pos[0], width * 0.15), width * 0.15);
// return [x, pos[1]];
// }
}
};
......@@ -385,21 +542,26 @@ function resizeChart() {
width: 100%;
height: 100%;
box-sizing: border-box;
position: relative;
/* background-color: aquamarine; */
/* z-index: 10001; */
}
.main {
width: 100%;
height: 95%;
height: 100%;
display: flex;
flex-direction: column;
box-sizing: border-box;
position: relative;
}
.cdfCurve {
width: 100%;
min-height: 180px;
/* min-height: 180px; */
position: relative;
z-index: 1;
}
......
<template>
<div class="left2all">
<div class="left2all" :style="{fontSize: fontSizeChangeTemp + 'px'}">
<div class="equipment-panel_header11">
<div class="equipment-panel_header11_content">
<div class="header-item header-item-left" @click="backHomeClick">
......@@ -7,7 +7,7 @@
<img src="@/assets/images/left2/back.png" alt="@" srcset=""
style="width: 30px; height: 20px;padding-right: 10px;">
</span>
<span class="header-value">返回</span>
<span class="header-value" >返回</span>
</div>
<div class="header-item header-item-center">
<span class="header-label header-item-center_label_title">
......@@ -29,14 +29,18 @@
</div>
<div class="header-item-right_content">
<span class="header-label header-label_fontColor">{{ item.label }}</span>
<span class="header-value header-value_fontColor" v-if="index < 5">{{ item.value }}</span>
<span class="header-value header-value_fontColor header-value_fontColor_progress" v-else>
<span style="width: 100%;">
<el-progress :text-inside="true" :stroke-width="5" :percentage="item.value" status="success" />
<span class="header-value header-value_fontColor" v-if="item.label === '信关站'">{{ isTimeInRange(useAppStoreInstance.subSystemTimeLineEndSelectTime, item.value[0]?.arcStartTime, item.value[0]?.arcEndTime)?item.value[0]?.stationName:"-" }}</span>
<span v-else>
<span class="header-value header-value_fontColor" v-if="index < 4">{{ item.value }}</span>
<span class="header-value header-value_fontColor header-value_fontColor_progress" v-else>
<span style="width: 100%;">
<el-progress :text-inside="true" :stroke-width="5" :percentage="item.value.match(/[\d.]+/) === null ? 0 : item.value.match(/[\d.]+/)[0]" status="success" />
</span>
<span class="header-value header-value_fontColor" style="position: relative;top: -3px;left: 10px;">{{ item.value
}}</span>
</span>
<span class="header-value header-value_fontColor" style="position: relative;top: -3px;">{{ item.value
}}</span>
</span>
</div>
</div>
......@@ -64,12 +68,45 @@
</div>
<!-- 单列数据列表展示区域 -->
<div class="telemetry-data">
<div class="telemetry-item" v-for="(item, index) in currentTelemetryData" :key="index">
<div class="telemetry-label">{{ item.label }}</div>
<div class="telemetry-value">{{ item.value }}</div>
<div class="telemetry-data" id="telemetry_item">
<div class="telemetry-item" v-for="([key, value]) in Object.entries(currentTelemetryData)" :key="key">
<div class="telemetry-label" id="telemetry_item_key">{{ key }}</div>
<div class="telemetry-value" id="telemetry_item_value">{{ value }}</div>
</div>
</div>
<div class="fontSizeChange">
<el-popover :width="350" popper-style="width: 200px;border:none;background-color: #000000;">
<template #reference>
<el-avatar :size="20">
<template #default>
<div class="set_carousel_text">
<el-icon>
<Setting />
</el-icon>
</div>
</template>
</el-avatar>
</template>
<template #default>
<div class="setting-item">
<div class="setting-label">
<span>字体大小(px)</span>
</div>
<el-input v-model="fontSizeChangeTemp" type="number" placeholder="请输入字体大小(ms)"
@blur="handleglobalIntervalTimeChange" class="setting-input" >
</el-input>
</div>
</template>
</el-popover>
</div>
</div>
<!-- 历史数据区域 -->
......@@ -109,14 +146,14 @@
start-placeholder="开始日期" end-placeholder="结束日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
prefix-icon="none" class="time-picker" :popper-options="{
placement: 'bottom-start',
modifiers: [
{
name: 'offset',
options: {
offset: [120, 5] // [水平偏移, 垂直偏移]
}
}
]
// modifiers: [
// {
// name: 'offset',
// options: {
// offset: [120, 5] // [水平偏移, 垂直偏移]
// }
// }
// ]
}" />
<!-- <el-icon class="calendar-icon">
<Calendar />
......@@ -153,7 +190,7 @@
</div>
<div class="equipment-panel">
<curve :propsDate="left2BottomOpition" :idName="left2_bottom"></curve>
<curve :propsDate="left2BottomOpition" :idName="'left2_bottom'"></curve>
</div>
</div>
</div>
......@@ -172,14 +209,13 @@ import { useRouter } from 'vue-router';
import { getSubSystemOpitionListApi,getSubSystemCurveListApi } from '../../api/Zodiac'
import SubWss from '@/utils/subSystemRequestSocket.js'
import { set } from 'nprogress';
import { tr } from 'element-plus/es/locales.mjs';
const subWssInstance = ref(SubWss)
const router = useRouter();
const useAppStoreInstance = useAppStore();
const activeIndex = ref(0);
const arcHistoryActiveIndex = ref(null);
const currentTelemetryData = ref([]);
const currentTelemetryData = ref({});
const arcHistoryData = ref(true);
......@@ -189,14 +225,40 @@ const arcHistorytabs = [
"热控分系统"
]
const fontSizeChangeTemp = ref(10);
const handleSatelliteGranularityChange = (value) => {
// satelliteGranularity.value = value;
console.log("999999999999999",value);
historyCode.value = value;
isFlagOfSeletctType.value = true;
}
const tempCount = ref(0);
const handleglobalIntervalTimeChange = () => {
// console.log("handleglobalIntervalTimeChange",fontSizeChangeTemp.value);
console.log("fontSizeChangeTemp.value",document.getElementById("telemetry_item"));
tempCount.value++;
document.getElementById("telemetry_item").style.fontSize = fontSizeChangeTemp.value + "px" ;
// document.getElementById("telemetry_item_key").style.fontSize = fontSizeChangeTemp.value + "px";
// document.getElementById("telemetry_item_value").style.fontSize = fontSizeChangeTemp.value + "px";
}
function isTimeInRange(time, timeStart, endTime) {
// console.log("isTimeInRange",time, timeStart, endTime);
if (time === null || timeStart === null || endTime === null ||
time === undefined || timeStart === undefined || endTime === undefined
) {
// console.log("zoiulezheli");
return false;
}
const t = new Date(time).getTime();
const start = new Date(timeStart).getTime();
const end = new Date(endTime).getTime();
return t >= start && t <= end;
}
const formatToMidnight = (isoString) => {
const date = new Date(isoString);
......@@ -208,14 +270,14 @@ const formatToMidnight = (isoString) => {
};
const defaultGetSubSystemCurveList = () => {
console.log("historyTimeDateRange.value",historyTimeDateRange.value,satelliteOptions.value[0]);
console.log("******",historyCode.value,);
getSubSystemCurveListApi({
getSubSystemCurveListApi({
endTime: (historyTimeDateRange.value[1]),
satelliteId: useAppStoreInstance.globalSatelliteSearchID==='0'? "4097": (useAppStoreInstance.globalSatelliteSearchID),
startTime: (historyTimeDateRange.value[0]),
subSystemType: arcHistorySubSystemOptions[arcHistoryActiveIndex.value],
code: satelliteOptions.value[0]?.value || 11,
code: historyCode.value,
}).then(res => {
left2BottomOpitionX.value = []
left2BottomOpitionY.value = []
......@@ -226,16 +288,17 @@ const defaultGetSubSystemCurveList = () => {
left2BottomOpition.value = {
// falgStartSearch:isFalgStartSearch.value,
unit:res.data[0]?.unit === ""?"":`( ${res.data[0]?.unit} )`,
maxY:ceilForMaxValue(Math.max(...left2BottomOpitionY.value)) ,
minY:floorForMinValue(Math.min(...left2BottomOpitionY.value)) ,
isFirstSearch:true,
dataX:left2BottomOpitionX.value,
dataY:left2BottomOpitionY.value,
type:'line',
chartName:satelliteOptions.value.filter((item) => (String(satelliteOptions.value[0].value)===String(item.value)))[0].label
chartName:satelliteOptions.value.filter((item) => (String(historyCode.value)===String(item.value)))[0]?.label
}
})
console.log("defaultGetSubSystemCurveList结束了");
// console.log("defaultGetSubSystemCurveList结束了",res.data[0]?.unit === "");
arcHistoryData.value = true;
}
......@@ -259,7 +322,7 @@ watch(() => arcHistoryActiveIndex.value,
() => {
nextTick(() => {
setTimeout(() => {
console.log("arcHistoryActiveIndex.value发生改变",satelliteOptions.value[0]);
//console.log("arcHistoryActiveIndex.value发生改变",satelliteOptions.value[0]);
defaultGetSubSystemCurveList();
......@@ -273,9 +336,9 @@ watch(() => arcHistoryActiveIndex.value,
})
// 系统标签
const tabs = [
"姿轨控分系统",
"载荷分系统",
"综电分系统",
"载荷分系统",
"姿轨控分系统",
"能源分系统",
"热控分系统"
];
......@@ -291,27 +354,27 @@ const headerItemAllContent = ref({
[
{
label: "信关站",
value: "上海站"
value: {"arcStartTime": "2025-11-03 09:09:42.0","arcEndTime": "2025-11-03 09:17:29.0","stationName": "烟台信关站"}
},
{
label: "生命周期状态",
value: "正常"
},
{
label: "工作模式",
value: "运行中"
value: "-"
},
// {
// label: "工作模式",
// value: "运行中"
// },
{
label: "管理状态",
value: "上海站"
value: "-"
},
{
label: "健康状态",
value: "正常"
value: "-"
},
{
label: "剩余燃料",
value: 70
value: "9.5kg"
},
]
......@@ -319,20 +382,22 @@ const headerItemAllContent = ref({
})
const backHomeClick = () => {
console.log("我执行了");
router.push('/');
// console.log("1111111111111111111111111", useAppStoreInstance.isSourceLegendShow);
// //console.log("1111111111111111111111111", useAppStoreInstance.isSourceLegendShow);
useAppStoreInstance.setGlobalisFromTosub(true);
useAppStoreInstance.setislegendShow(useAppStoreInstance.isSourceLegendShow ? true : false);
// console.log("11111111111111111111111112", useAppStoreInstance.islegendShow);
// //console.log("11111111111111111111111112", useAppStoreInstance.islegendShow);
useAppStoreInstance.setiscontrolPanelShow(true);
// SubWss.close(1000, "正常关闭");
wssOpenHandle({
// isRealtime: useAppStoreInstance.globalSubsystemIsFastForward? true: false,
status: 'stop',
taskCode: toNumber(useAppStoreInstance.globalSubsystemTaskCode),
satelliteId: useAppStoreInstance.globalSatelliteSearchID,
})
if(window.ue5) {
window.ue5("callBackSubSysToMainSysFn", String(JSON.stringify({
SubToMain: true
})));
}
}
// 遥测数据 - 姿轨控系统示例数据
......@@ -689,6 +754,31 @@ const THERMAL_wssTransformGroundSatelliteData = (data) => {
// return [];
};
const ALL_wssTransformGroundSatelliteData = (data) => {
// 检查 data 是否为对象且不为 null
//console.log("...........3.......",Array.isArray(data) );
// let transformedData = []
if (Array.isArray(data) &&Object.keys(data).length > 0 ) {
// transformedData = data.map(item => ({
// ...item.fields
// }))
currentTelemetryData.value = Object.assign({}, ...data.map(item => ({
...item.fields
})))
//console.log("5555555555555555100",currentTelemetryData.value,typeof currentTelemetryData.value);
}else {
currentTelemetryData.value = {}
return {};
}
// 如果 data 不是对象也不是数组,返回空数组
};
// 时间格式化函数
const formatTime = (date) => {
if (!date) return '';
......@@ -720,18 +810,19 @@ const satelliteOptions = ref([
const subSystemOptionsFn = (subSystemTypeValue)=>{
getSubSystemOpitionListApi({subSystemType:subSystemTypeValue}).then(res => {
console.log("getSubSystemOpitionListApi-----------",res);
//console.log("getSubSystemOpitionListApi-----------",res);
satelliteOptions.value = res.map(item => ({
label: item.name,
value: item.code
}));
// console.log("************",satelliteGranularity.value,satelliteGranularity.value[0]);
satelliteGranularity.value =satelliteOptions.value[0].value
// satelliteGranularity.value = ""
// historyCode.value = satelliteGranularity.value[0].code;
// satelliteGranularity.value = ""
historyCode.value = satelliteOptions.value[0].value;
})
}
const historyCode = ref("11")
......@@ -748,7 +839,7 @@ const left2BottomOpition = ref({
// 查询处理函数
const cureSearchHandleFn = () => {
console.log("11111111111111-------1111:",isFlagOfSeletctType.value);
//console.log("11111111111111-------1111:",isFlagOfSeletctType.value);
// if (!isFlagOfSeletctType.value) {
// ElMessage({
......@@ -760,7 +851,7 @@ const cureSearchHandleFn = () => {
{
// console.log('查询参数:', {
// //console.log('查询参数:', {
// // dateRange: historyTimeDateRange.value,
// code: historyCode.value,
// endTime: historyTimeDateRange.value[1],
......@@ -776,7 +867,7 @@ isFalgStartSearch.value = true;
// console.log("propsDate-min--3333333333--------",{
// //console.log("propsDate-min--3333333333--------",{
// endTime: historyTimeDateRange.value[1],
// satelliteId: useAppStoreInstance.globalSatelliteSearchID==='0'? "4097": (useAppStoreInstance.globalSatelliteSearchID),
// startTime: historyTimeDateRange.value[0],
......@@ -800,6 +891,7 @@ isFalgStartSearch.value = true;
left2BottomOpition.value = {
// falgStartSearch:isFalgStartSearch.value,
unit:res.data[0]?.unit === ""?"":`( ${res.data[0]?.unit} )`,
maxY:ceilForMaxValue(Math.max(...left2BottomOpitionY.value)) ,
minY:floorForMinValue(Math.min(...left2BottomOpitionY.value)) ,
isFirstSearch:true,
......@@ -899,29 +991,37 @@ const floorForMinValue = (value) => {
return result;
};
const wssOpenHandle = (data) => {
// console.log('wssOpenHandle', wss,wss.readyState, WebSocket.OPEN);
if (SubWss.readyState === WebSocket.OPEN) {
// //console.log('wssOpenHandle', wss,wss.readyState, WebSocket.OPEN);
if ((subWssInstance.value).readyState === WebSocket.OPEN) {
// 如果连接已打开,直接发送数据
// console.log('连接yi打开...');
// //console.log('连接yi打开...');
SubWss.send(JSON.stringify(data));
} else
(subWssInstance.value).send(JSON.stringify(data));
} else if ((subWssInstance.value).readyState === WebSocket.CLOSED) {
(subWssInstance.value) = new WebSocket((subWssInstance.value).url);
(subWssInstance.value).onopen = () => {
(subWssInstance.value).send(JSON.stringify(data));
};
}
else
{
// 否则等待连接打开后再发送
// console.log('连接未打开,等待...');
SubWss.onopen = () => {
SubWss.send(JSON.stringify(data));
// //console.log('连接未打开,等待...');
(subWssInstance.value).onopen = () => {
(subWssInstance.value).send(JSON.stringify(data));
};
}
};
const socketTypeMap = ["CONTROL","PAYLOAD","ELECTRONICS","POWER","THERMAL"]
const socketTypeMap = ["ELECTRONICS","PAYLOAD","CONTROL","POWER","THERMAL"]
const toNumber = (value) => {
const num = Number(value);
return isNaN(num) ? 0 : num; // 如果转换失败则返回0
}
// 切换标签页
const handleTabClick = (index) => {
// console.log('实时遥测标签:', index);
// //console.log('实时遥测标签:', index);
activeIndex.value = index;
useAppStoreInstance.setglobalSubsystemActiveIndex(index)
if (window.ue5) {
......@@ -931,19 +1031,26 @@ const handleTabClick = (index) => {
})));
}
wssOpenHandle({
// "isFastForward":false,
// "taskCode":"1111111111111",
// "satelliteId":"4097",
// "type":"POWER" ,
isFastForward: useAppStoreInstance.globalSubsystemIsFastForward || false,
speed: useAppStoreInstance.globalSubsystemSpeed || 1,
// speed: useAppStoreInstance.globalSubsystemSpeed || 1,
// startTime: formatDateTime(pick_select_date.value[0]),
// endTime: formatDateTime(pick_select_date.value[1]),
taskCode: toNumber(useAppStoreInstance.globalSubsystemTaskCode || 0),
taskCode: String(useAppStoreInstance.globalSubsystemTaskCode || 0),
type: socketTypeMap[index] || 'CONTROL',
satelliteId:useAppStoreInstance.globalSatelliteSearchID==='0'? "4097": (useAppStoreInstance.globalSatelliteSearchID),
})
// SubWss.onmessage = (event) => {
// console.log('我走了这里,收到数据21');
// (subWssInstance.value).onmessage = (event) => {
// //console.log('我走了这里,收到数据21');
// const data = JSON.parse(event.data);
// // console.log('我是left2,type == time获取的wssRespone:', data);
// // //console.log('我是left2,type == time获取的wssRespone:', data);
// useAppStoreInstance.setSubsystemSocketContent(data)
// };
// switch (useAppStoreInstance.globalSubsystemActiveIndex) {
......@@ -974,24 +1081,24 @@ const handleTabClick = (index) => {
onBeforeMount(() => {
subSystemOptionsFn("CONTROL");
// console.log("12222222222222222222222222",satelliteOptions.value[0].code);
// //console.log("12222222222222222222222222",satelliteOptions.value[0].code);
// 发送api请求
// subSystemStatisticsInfoApi({
// id: 0,
// }).then(res => {
// console.log(res);
// //console.log(res);
// })
// SubWss.onmessage = (event) => {
// console.log('我走了这里,收到数据22');
// (subWssInstance.value).onmessage = (event) => {
// //console.log('我走了这里,收到数据22');
// const data = JSON.parse(event.data);
// const transformedData = CONTROL_wssTransformGroundSatelliteData(data);
// currentTelemetryData.value = transformedData;
// // transformConstellationData(JSONdata)
// // console.log('我是left2,type == time获取的wssRespone:', data);
// // //console.log('我是left2,type == time获取的wssRespone:', data);
// };
......@@ -1015,79 +1122,99 @@ const mountformatDateTime = (date) => {
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
};
onMounted(() => {
nextTick(() => {
console.log("我走了globalSubsystemSelectedTimeRange---left2",mountformatDateTime(useAppStoreInstance.globalSubsystemSelectedTimeRange[0]), mountformatDateTime(useAppStoreInstance.globalSubsystemSelectedTimeRange[1]));
if(useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
// historyTimeDateRange.value = [new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString(),new Date(Date.now()).toISOString()];
historyTimeDateRange.value = [ mountformatDateTime(useAppStoreInstance.globalSubsystemSelectedTimeRange[0]), mountformatDateTime(useAppStoreInstance.globalSubsystemSelectedTimeRange[1])]
}else {
historyTimeDateRange.value = [new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString(),new Date(Date.now()).toISOString()];
}
useAppStoreInstance.setiscontrolPanelShow(false);
// SubWss.onmessage = (event) => {
// console.log('我走了这里,收到数据23');
// const data = JSON.parse(event.data);
// const transformedData = CONTROL_wssTransformGroundSatelliteData(data);
// currentTelemetryData.value = transformedData;
// // transformConstellationData(JSONdata)
// // console.log('我是left2,type == time获取的wssRespone:', data);
// };
left2BottomOpition.value = {
isFirstSearch:false,
const middleWssImgUrlMap = {
"上海小卫星":new URL('../../assets/images/footers/smallSatellite_normal.png' , import.meta.url).href,
"格思航天":new URL('../../assets/images/footers/gosiSatellite_normal copy.png' , import.meta.url).href,
}
const middleWssTransformGroundNetworkElementStatus = (data) => {
headerItemAllContent.value = {
forwardContent:
{
title: data?.elementName || "-",
subtitle: useAppStoreInstance.subSystemTimeLineEndSelectTime,
imgUrl: middleWssImgUrlMap[data?.manufacturer || "上海小卫星"] || middleWssImgUrlMap["上海小卫星"],
},
backContent:
[
{
label: "信关站",
value: data?.siteName || "-"
},
{
label: "生命周期状态",
value: data?.lifecycleStatus || "-"
},
{
label: "管理状态",
value: data?.managementStatus || "-"
},
{
label: "健康状态",
value: data?.operationalStatus || "-"
},
{
label: "剩余燃料",
value: data?.fuelRemaining || "-"
},
]
}
}
nextTick(() => {
watch(() => useAppStoreInstance.subsystemSocketContent, (newVal, oldValue) => {
// const newValue = useAppStoreInstance.subsystemSocketContent
// console.log("22222222222left******************",useAppStoreInstance.globalSubsystemActiveIndex,newValue);
//console.log("22222222222left******************",useAppStoreInstance.subsystemSocketContent);
// handleTabClick(useAppStoreInstance.globalSubsystemActiveIndex)
ALL_wssTransformGroundSatelliteData(newVal?.leftTop)
middleWssTransformGroundNetworkElementStatus(newVal?.groundNetworkElementStatus)
// console.log("22222222222left******************",newVal.groundNetworkElementStatus);
force_Refresh.value += 1
switch (toNumber(useAppStoreInstance.globalSubsystemActiveIndex)) {
case 0:
const transformedData = CONTROL_wssTransformGroundSatelliteData(newVal);
// switch (toNumber(useAppStoreInstance.globalSubsystemActiveIndex)) {
// case 0:
// const transformedData = CONTROL_wssTransformGroundSatelliteData(newVal.leftTop);
// currentTelemetryData.value = [];
currentTelemetryData.value = transformedData;
// console.log('22222222222left0---transformedData0*********************:', transformedData);
break;
case 1:
const transformedData1 = PAYLOAD_wssTransformGroundSatelliteData(newVal);
// currentTelemetryData.value = [];
currentTelemetryData.value = transformedData1;
// console.log('22222222222left1---transformedData1*********************:', transformedData1);
break;
case 2:
const transformedData2 = ELECTRONICS_wssTransformGroundSatelliteData(newVal);
// currentTelemetryData.value = [];
currentTelemetryData.value = transformedData2;
// console.log('22222222222left2---transformedData2*********************:', transformedData2);
break;
case 3:
const transformedData3 = POWER_wssTransformGroundSatelliteData(newVal);
// currentTelemetryData.value = [];
currentTelemetryData.value = transformedData3;
// console.log('22222222222left3---transformedData3*********************:', transformedData3);
break;
case 4:
const transformedData4 = THERMAL_wssTransformGroundSatelliteData(newVal);
// currentTelemetryData.value = [];
currentTelemetryData.value = transformedData4;
// // currentTelemetryData.value = [];
// currentTelemetryData.value = transformedData;
// // //console.log('22222222222left0---transformedData0*********************:', transformedData);
// break;
// case 1:
// const transformedData1 = PAYLOAD_wssTransformGroundSatelliteData(newVal.leftTop);
// // currentTelemetryData.value = [];
// currentTelemetryData.value = transformedData1;
// // //console.log('22222222222left1---transformedData1*********************:', transformedData1);
// break;
// case 2:
// const transformedData2 = ELECTRONICS_wssTransformGroundSatelliteData(newVal.leftTop);
// // currentTelemetryData.value = [];
// currentTelemetryData.value = transformedData2;
// // //console.log('22222222222left2---transformedData2*********************:', transformedData2);
// break;
// case 3:
// const transformedData3 = POWER_wssTransformGroundSatelliteData(newVal.leftTop);
// // currentTelemetryData.value = [];
// currentTelemetryData.value = transformedData3;
// // //console.log('22222222222left3---transformedData3*********************:', transformedData3);
// break;
// case 4:
// const transformedData4 = THERMAL_wssTransformGroundSatelliteData(newVal.leftTop);
// // currentTelemetryData.value = [];
// currentTelemetryData.value = transformedData4;
// console.log('22222222222left4---transformedData4*********************:', transformedData4);
break;
default:
// currentTelemetryData.value = [];
console.log('22222222222left---transformedData default*********************:');
break;
}
// // //console.log('22222222222left4---transformedData4*********************:', transformedData4);
// break;
// default:
// // currentTelemetryData.value = [];
// //console.log('22222222222left---transformedData default*********************:');
// break;
// }
......@@ -1102,14 +1229,14 @@ watch(() => useAppStoreInstance.subsystemSocketContent, (newVal, oldValue) => {
// activeIndex.value = 0;
// console.log("222222222-------------------******kaishi ");
// //console.log("222222222-------------------******kaishi ");
// const transformedData = CONTROL_wssTransformGroundSatelliteData(useAppStoreInstance.subsystemSocketContent);
// currentTelemetryData.value = transformedData;
// // console.log("-------------------******jieshu ");
// // console.log('subsystemSocketContent 变化了:', newValue,typeof newValue);
// // //console.log("-------------------******jieshu ");
// // //console.log('subsystemSocketContent 变化了:', newValue,typeof newValue);
// // const transformedData = CONTROL_wssTransformGroundSatelliteData(newValue);
// // currentTelemetryData.value = transformedData;
// // console.log('transformedData*********************:', transformedData);
// // //console.log('transformedData*********************:', transformedData);
// // 这里可以添加处理新值的逻辑
......@@ -1117,9 +1244,41 @@ watch(() => useAppStoreInstance.subsystemSocketContent, (newVal, oldValue) => {
},{ deep: true, immediate: true });
})
onMounted(() => {
currentTelemetryData.value = {}
// (subWssInstance.value) = new WebSocket(wss.url);
nextTick(() => {
//console.log("我走了globalSubsystemSelectedTimeRange---left2",mountformatDateTime(useAppStoreInstance.globalSubsystemSelectedTimeRange[0]), mountformatDateTime(useAppStoreInstance.globalSubsystemSelectedTimeRange[1]));
if(useAppStoreInstance.footerTimeHasedSelectTimeToSub) {
// historyTimeDateRange.value = [new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString(),new Date(Date.now()).toISOString()];
historyTimeDateRange.value = [ mountformatDateTime(useAppStoreInstance.globalSubsystemSelectedTimeRange[0]), mountformatDateTime(useAppStoreInstance.globalSubsystemSelectedTimeRange[1])]
}else {
historyTimeDateRange.value = [new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString(),new Date(Date.now()).toISOString()];
}
useAppStoreInstance.setiscontrolPanelShow(false);
// (subWssInstance.value).onmessage = (event) => {
// //console.log('我走了这里,收到数据23');
// const data = JSON.parse(event.data);
// const transformedData = CONTROL_wssTransformGroundSatelliteData(data);
// currentTelemetryData.value = transformedData;
// // transformConstellationData(JSONdata)
// // //console.log('我是left2,type == time获取的wssRespone:', data);
// };
left2BottomOpition.value = {
isFirstSearch:false,
}
})
arcHistoryActiveIndex.value = 0
arcHistoryActiveIndex.value = 0
});
onUnmounted(() => {
// useAppStoreInstance.setGlobalSubsystemSelectedTimeRange([]);
......@@ -1147,7 +1306,7 @@ onUnmounted(() => {
display: flex;
flex-direction: column;
gap: 20px;
overflow-y: hidden;
overflow-y: auto;
background-color: #010102;
}
......@@ -1157,8 +1316,15 @@ onUnmounted(() => {
left: 25%;
width: 50%;
min-height: 60px;
min-width: 750px;
background-color: #010102;
background:rgba(0, 0, 0, 1);
/* background: linear-gradient(
to right,
rgba(0, 0, 0, 0.12) 0%,
rgba(46,125,255,0.2) 50%,
rgba(0, 0, 0, 0.12) 100%
); */
/* margin-bottom: 15px; */
/* border-radius: 8px; */
/* padding: 10px; */
......@@ -1168,13 +1334,42 @@ onUnmounted(() => {
rgba(0, 0, 0, 0.1) 0%,
rgba(13, 34, 70, 0.4) 50%,
rgba(0, 0, 0, 0.193) 100%); */
/* box-shadow: inset 0 0 30px 0px rgb(46,125,255); */
border-bottom: 2px solid rgba(0, 0, 0, 0.92);
border-image: linear-gradient(to right,
rgba(0, 0, 0, 0.193) 0%,
rgb(45, 123, 253) 50%,
rgba(0, 0, 0, 0.193) 100%) 1;
rgb(29, 43, 66) 0%,
rgb(46,125,255) 50%,
rgb(29, 43, 66) 100%) 1;
}
.equipment-panel_header11_content{
background: linear-gradient(to right,
transparent 0%,
rgba(46,125,255,0.1) 30%,
rgba(46,125,255,0.2) 50%,
rgba(46,125,255,0.1) 70%,
transparent 100%);
}
/* .equipment-panel_header11::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: 70px;
background: linear-gradient(to right,
transparent 0%,
rgba(46,125,255,0.1) 30%,
rgba(46,125,255,0.2) 50%,
rgba(46,125,255,0.1) 70%,
transparent 100%);
} */
.equipment-panel_header11_content {
display: flex;
justify-content: space-between;
......@@ -1182,7 +1377,7 @@ onUnmounted(() => {
border-radius: 8px;
width: 100%;
height: 100%;
z-index: 100 !important;
padding: 5px 0;
}
......@@ -1279,13 +1474,13 @@ onUnmounted(() => {
}
.header-label_fontColor {
color: rgb(99, 99, 99);
color: rgb(212, 212, 212);
}
.header-value_fontColor {
color: #6FFCBA;
font-size: 10px;
padding-top: 5px;
padding-top: 1.5px;
}
.header-label_status_ok {
......@@ -1297,7 +1492,7 @@ onUnmounted(() => {
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 10px;
/* gap: 5px; */
}
:depp(.el-progress-bar) {
......@@ -1441,15 +1636,48 @@ onUnmounted(() => {
align-items: center;
/* 垂直居中 */
color: #ffffff;
font-size: 10px;
font-size: var(--fontSize);
padding: 5px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
width: 100%;
/* 控制宽度,留出边距 */
}
.fontSizeChange{
position: relative;
top: -70%;
left: 91%;
/* right: 8%; */
width: 10px;
/* background-color: #a52121; */
}
:deep(.fontSizeChange .el-avatar) {
background-color: #000000;
}
.set_carousel_text {
background-color: none;
}
.setting-item {
display: flex;
/* align-items: center; */
flex-direction: row;
gap: 8px;
flex: 1;
color: #ffffff;
}
.setting-input{
color: #ffffff ;
}
.setting-label {
display: flex;
align-items: center;
gap: 4px;
font-size: 12px;
color: #ffffff;
white-space: nowrap;
}
.telemetry-label {
color: #707070;
color: #c5c5c5;
text-align: right;
/* 标签右对齐 */
flex: 1.2;
......@@ -1459,7 +1687,7 @@ onUnmounted(() => {
}
.telemetry-value {
color: #d1d5db;
color: #ffffff;
text-align: left;
/* 值左对齐 */
/* font-family: 'Consolas', monospace; */
......@@ -1472,6 +1700,8 @@ onUnmounted(() => {
display: flex;
flex-direction: column;
gap: 15px;
height: 470px;
/* background-color: burlywood; */
}
.equipment-panel {
......@@ -1480,6 +1710,9 @@ onUnmounted(() => {
width: 100%;
/* background-color: #165dff; */
overflow: hidden;
/* position: relative; */
/* top:-10px;
height: 270px; */
/* min-height: 25vh; */
/* padding: 15px; */
}
......@@ -1516,8 +1749,12 @@ onUnmounted(() => {
display: flex;
flex-direction: column;
gap: 15px;
}
.satellite-group{
height: 71px;
/* background-color: #165dff; */
}
/* 标签样式 */
.query-label {
color: #e0e7ff;
......@@ -1584,9 +1821,9 @@ onUnmounted(() => {
.satellite-select {
width: 120px;
/* background-color: #2d2d2d; */
/* border: 1px solid #3d3d3d; */
/* border: 1px solid #e90303; */
border-radius: 4px;
/* height: 2.5px; */
height: 3px;
}
:deep(.satellite-select .el-select__wrapper) {
height: 12.5px;
......@@ -1594,12 +1831,20 @@ onUnmounted(() => {
:deep(.satellite-select .el-select__selected-item) {
color: #ffffff;
font-size: 10px;
}
:deep(.satellite-select .el-select__selection) {
height: 12.5px;
}
:deep(.satellite-select .el-select__input ) {
font-size: 10px;
}
:deep(.satellite-select .el-tooltip__trigger) {
background-color: #000000 !important;
color: #f9fafd !important;
border: none !important;
}
/* 按钮容器 */
......@@ -1668,7 +1913,12 @@ onUnmounted(() => {
}
.setting-item :deep( .el-input .el-input__wrapper) {
background-color: #000000 !important;
border: none !important;
box-shadow: 0 0 0 1px #424242 !important;
color: #ffffff !important;
}
:deep(.el-date-editor.el-input__wrapper) {
......
......@@ -50,7 +50,7 @@ const orbitMetrics = ref([
function tableHandleRowClickFn(row, column, event) {
errorDialogVisible.value = true
console.log('点击的行数据:', row);
//console.log('点击的行数据:', row);
}
function errorDialoghandleClose() {
......@@ -68,25 +68,26 @@ function errorDialoghandleClose() {
flex-direction: column;
gap: 20px;
overflow-y: auto;
background-color: #010102;
background-color: #010102;
}
.header-container {
display: flex;
flex-direction: column;
gap: 15px;
height: 280px;
}
.satellite-section{
height: 420px;
min-height: 325px;
/* background-color: #2E7DFF; */
overflow-y: hidden;
/* overflow-y: hidden; */
}
.ground-system-section{
height: 400px;
min-height: 350px;
/* background-color: #2E7DFF; */
overflow-y: hidden;
/* overflow-y: hidden; */
}
::-webkit-scrollbar {
......
<template>
<div class="dialog-content" >
<div class="dialog-content " >
<!-- 顶部标题栏 -->
<!-- {{ errorDetailItems[5].value === 'Ⅰ级' }} -->
<div class="dialog-header" >
......@@ -18,14 +18,15 @@
<span class="detail-label">{{ item.label }}</span>
<!-- 新增value-wrapper容器 -->
<div class="value-wrapper">
<span class="detail-value"
<span class="detail-value "
:class="{
'alert-level_1':item.value ==='Ⅰ级',
'alert-level_2':item.value ==='Ⅱ级',
'alert-level_3':item.value ==='Ⅲ级',
'alert-level_4':item.value ==='Ⅳ级',
'alert-status_1':item.value ==='已处理',
'alert-status_0':item.value ==='未处理',
'alert-status_1':item.value ==='活动',
'alert-status_0':item.value ==='自动清除',
'alert-status_2':item.value ==='手工清除',
}">{{ item.value }}</span>
</div>
</div>
......@@ -47,7 +48,11 @@ const props = defineProps({
default: () => []
}
});
const OpposeAlertDataStatusMap = ref({
"手工清除":'2',
"活动":'1',
"自动清除":'0',
})
// 定义事件
const emit = defineEmits(['handleIsErrorDataCloseFn']);
......@@ -56,13 +61,14 @@ const emit = defineEmits(['handleIsErrorDataCloseFn']);
const handleClose = () => {
emit('handleIsErrorDataCloseFn');
};
</script>
<style scoped>
/* 弹窗内容容器 */
.dialog-content {
position: fixed; /* 改为fixed定位 */
top: 73vh;
top: 65vh;
right: 400px;
background: #1a1a1a;
border-radius: 4px;
......@@ -73,12 +79,31 @@ const handleClose = () => {
border-top: 2px solid;
border-bottom: 2px solid;
border-image: linear-gradient(to right, rgba(54, 27, 27, 0.93) 0%, rgba(255, 2, 2, 0.93) 50%, rgba(54, 27, 27, 0.93)) 1;
box-shadow: inset 0 -20px 70px -25px rgba(255, 2, 2, 0.93);
/* background-color: #eea929; */
width: 250px;
height: 250px;
height: 330px;
}
.alert-status_2 {
color: #28D86E !important;
background:none;
}
.alert-status_1 {
color: red !important;
background:none;
}
.alert-status_0 {
color: green !important;
background:none;
}
.Unprocessed{
box-shadow: inset 0 -20px 70px -25px rgba(255, 2, 2, 0.93);
}
.processed{
box-shadow: inset 0 -20px 70px -25px rgba(0, 255, 0, 0.93);
}
/* 弹窗头部 */
.dialog-header {
display: flex;
......@@ -127,7 +152,7 @@ const handleClose = () => {
background: rgba(10, 14, 23, 0.6);
/* border-radius: 8px; */
/* height: 35vh; */
height: 225px;
height: 320px;
overflow-y: auto;
width: 100%;
padding-bottom: 30px;
......@@ -145,7 +170,7 @@ const handleClose = () => {
}
.detail-label {
color: #707070;
color: #c5c5c5;
text-align: right;
flex: 0.51;
padding-right: 15px;
......@@ -160,7 +185,7 @@ const handleClose = () => {
}
.detail-value {
color: #d1d5db;
color: #ffffff;
text-align: left;
/* font-family: 'Consolas', monospace; */
word-break: break-all;
......@@ -202,10 +227,10 @@ const handleClose = () => {
background-color: #17a0e0;
}
.alert-status_1 {
.alert-status_0 {
color: red;
}
.alert-status_0 {
.alert-status_1 {
color: green;
}
......
......@@ -22,12 +22,20 @@
</el-input>
</div>
<el-table :data="rawData_up" size="small" height="370px" class="custom-table">
<el-table :data="rawData_up" size="small" height="440px" class="custom-table">
<el-table-column prop="segmentId" label="弧段编号" width="100" align="center"></el-table-column>
<el-table-column prop="satelliteId" label="卫星编号" width="120" align="center"></el-table-column>
<el-table-column prop="entryTime" label="入境时刻(北京时间)" width="150" align="center"></el-table-column>
<el-table-column prop="exitTime" label="出境时刻(北京时间)" width="150" align="center"></el-table-column>
<el-table-column prop="duration" label="时长(sec)" width="80" align="center"></el-table-column>
<el-table-column prop="exitTime" label="出境时刻(北京时间)" width="150" align="center">
<template #default="scope">
{{scope.row.exitTime === "-"?scope.row.exitTime:compareTime(useAppStoreInstance.subSystemTimeLineEndSelectTime, scope.row.exitTime)?scope.row.exitTime:"-" }}
</template>
</el-table-column>
<el-table-column prop="duration" label="时长(sec)" width="80" align="center">
<template #default="scope">
{{scope.row.duration === "-"?scope.row.duration:compareTime(useAppStoreInstance.subSystemTimeLineEndSelectTime, scope.row.exitTime)?scope.row.duration:"-" }}
</template>
</el-table-column>
<el-table-column prop="groundStation" label="地面站" width="90" align="center"></el-table-column>
<el-table-column prop="trackingType" label="测控类型" width="80" align="center"></el-table-column>
<!-- <el-table-column prop="operationResult" label="操作结果" width="100" align="center">
......@@ -62,24 +70,25 @@
</el-input>
</div>
<el-table :data="alertData" size="small" height="300px" class="custom-table" @row-click="handleAlertDataRowClick">
<el-table-column prop="alertCode" label="告警码" width="80" align="center"></el-table-column>
<el-table :data="alertData" size="small" height="380px" class="custom-table" @row-click="handleAlertDataRowClick">
<el-table-column prop="alertCode" label="告警码" width="80" align="center"></el-table-column>
<el-table-column prop="alertName" label="告警名称" width="80" align="center"></el-table-column>
<el-table-column prop="alertObject" label="告警对象" width="80" align="center"></el-table-column>
<el-table-column prop="alertObject" label="告警对象" width="120" align="center"></el-table-column>
<el-table-column prop="alertLevel" label="告警等级" width="80" align="center">
<template #default="scope">
<el-tag :class="`alert-level_${scope.row.alertLevel}`">
{{ alertLevelMap[scope.row.alertLevel] }}
<el-tag :class="`alert-level_${OpposeAlertLevelMap[scope.row.alertLevel]}`">
{{ scope.row.alertLevel }}
</el-tag>
</template>
</el-table-column>
<!-- <el-table-column prop="faultServiceLeve" label="服务故障等级" width="150" align="center"></el-table-column> -->
<el-table-column prop="alterCreateTime" label="告警产生时间" width="150" align="center"></el-table-column>
<el-table-column prop="alertStatus" label="告警状态" width="150" align="center">
<el-table-column prop="alterCreateTime" label="告警产生时间" width="120" align="center"></el-table-column>
<el-table-column label="告警状态" width="70" align="center" fixed="right" >
<template #default="scope">
<el-tag :class="`alert-status_${scope.row.alertStatus}`">
{{ scope.row.alertStatus === '0' ? '未处理' : '已处理' }}
<el-tag :class="`alert-status_${OpposeAlertDataStatusMap[scope.row.alertStatus]}`">
<!-- {{ scope.row.alertStatus === '0' ? '未处理' : '已处理' }} -->
{{ scope.row.alertStatus }}
</el-tag>
</template>
</el-table-column>
......@@ -89,12 +98,15 @@
</div>
</div>
<el-dialog v-model="errorDataShowDialogVisible" :show-close="false"
<el-dialog v-model="errorDataShowDialogVisible"
:show-close="false"
:modal="false"
width="300"
hight="50"
modal-penetrable
:before-close="handleIsErrorDataCloseFn"
:close-on-click-modal="true"
:destroy-on-close="true"
style="background: rgba(0, 0, 0, 0);padding: 0;margin: 0;"
>
<errorDataShowComponent @handleIsErrorDataCloseFn="handleIsErrorDataCloseFn" :errorDetailItems="errorDetailItems"></errorDataShowComponent>
......@@ -106,26 +118,11 @@
import { nextTick, onMounted, ref } from 'vue';
import errorDataShowComponent from './component/errorDataShowComponent.vue'
import useAppStore from '@/store/module/app'
import { fa } from 'element-plus/es/locales.mjs';
const useAppStoreInstance = useAppStore();
// 星座构型提取转换函数
const transformConstellationData = (data) => {
return data.map(item => ({
headerTitle: [
{ label: '组网卫星数', value: item.satelliteCount },
{ label: '轨道面数', value: item.orbitalPlaneCount },
{ label: '每轨卫星数', value: item.satellitesPerOrbit }
],
label: item.constellationName,
content: [
{ label: '在轨卫星数', value: item.satelliteCount, statusClass: 'top-left' },
{ label: '在网卫星数', value: item.satelliteCount, statusClass: 'top-right' },
{ label: '轨道高度(km)', value: item.orbitalAltitude, statusClass: 'bottom-left' },
{ label: '轨道倾角', value: item.orbitalInclination+'°', statusClass: 'bottom-right' }
]
}));
};
const searchSegmentValue = ref('');
const primitive_rawData_up = ref([
// {
......@@ -142,43 +139,24 @@ const primitive_rawData_up = ref([
const rawData_up = ref(primitive_rawData_up)
const arcInfoTransform = (data) => {
// 检查 data 是否为对象且不为 null
if (typeof data === 'object' && data !== null && !Array.isArray(data)) {
return [
{
orginData: data,
segmentId: data.missionId ? data.missionId : '-',
satelliteId: data.satName ? data.satName : '-',
entryTime: data.arcStartTime ? data.arcStartTime : '-',
exitTime: data.arcEndTime ? data.arcEndTime : '-',
duration: data.arcDuration ? data.arcDuration : '-',
groundStation: data.stationName ? data.stationName : '-',
trackingType: data.missionType ? data.missionType : '-',
// operationResult: "帆板展开"
},
];
} else if (Array.isArray(data)) {
// 如果意外传入了数组,仍然处理数组
return data.map(item => (
// console.log("传输的是数组",item.missionId,item.satName,item.arcStartTime,item.arcEndTime,item.arcDuration,item.stationName,item.missionType)
{
orginData: item,
segmentId: item.missionId ? item.missionId : '-',
satelliteId: item.satName ? item.satName : '-',
entryTime: item.arcStartTime ? item.arcStartTime : '-',
exitTime: item.arcEndTime ? item.arcEndTime : '-',
duration: item.arcDuration ? item.arcDuration : '-',
groundStation: item.stationName ? item.stationName : '-',
trackingType: item.missionType ? item.missionType : '-',
// operationResult: "帆板展开"
}
));
}
//console.log("wodsad--------arcInfoTransform",data,typeof data);
if (!data || typeof data !== 'object' || Array.isArray(data)) {
return [];
}
// 按时间排序后转为数组
return Object.entries(data)
// 如果 data 不是对象也不是数组,返回空数组
return [];
.map(([time, item]) => ({
orginData: item,
segmentId: item[0].missionId || '-',
satelliteId: item[0].satName || '-',
entryTime: item[0].arcStartTime || '-',
exitTime: item[0].arcEndTime || '-',
duration: item[0].arcDuration || '-',
groundStation: item[0].siteName || '-',
trackingType: item[0].missionType || '-'
}));
}
......@@ -201,16 +179,16 @@ const searchSegmentList_up = () => {
onMounted(() => {
nextTick(() => {
watch(() => useAppStoreInstance.subsystemSocketContent, (newValue, oldValue) => {
// console.log("******************",newValue === oldValue);
//console.log("******************",newValue);
if (newValue !== oldValue) {
primitive_rawData_up.value = arcInfoTransform(newValue.arcSegmentInfoArray)
// if (newValue !== oldValue) {
primitive_rawData_up.value = arcInfoTransform(newValue.rightTop)
rawData_up.value = primitive_rawData_up.value
primitiveAlertData.value = alertInfoTransformFn(newValue.satelliteAlertInfoArray)
primitiveAlertData.value = alertInfoTransformFn(newValue.rightBottom)
alertData.value = primitiveAlertData.value
console.log("222222222right2---------",rawData_up.value,newValue.arcSegmentInfoArray);
//console.log("222222222right2----123-----", primitiveAlertData.value);
}
// }
},{ deep: true, immediate: true });
})
......@@ -220,7 +198,7 @@ onMounted(() => {
// rawData_up.value = primitive_rawData_up.value
// primitiveAlertData.value = alertInfoTransformFn(Jsondata.satelliteAlertInfoArray)
// alertData.value = primitiveAlertData.value
// console.log("222222222right2---------",rawData_up.value,Jsondata.arcSegmentInfoArray);
// //console.log("222222222right2---------",rawData_up.value,Jsondata.arcSegmentInfoArray);
// // useAppStoreInstance.setSubsystemSocketContent(Jsondata)
// }
})
......@@ -230,165 +208,63 @@ const alertLevelMap = {
'3': 'Ⅲ级',
'4': 'Ⅳ级'
}
const OpposeAlertLevelMap = {
'Ⅰ级':'1',
'Ⅱ级':'2',
'Ⅲ级':'3',
'Ⅳ级':'4',
}
const OpposeAlertDataStatusMap = ref({
"手工清除":'2',
"活动":'1',
"自动清除":'0',
})
// 卫星告警信息数据(随机生成)
const primitiveAlertData = [
{
alertCode: "500",
alertName: "电源系统电压异常",
alertObject: "电源系统",
alertLevel: "1",
faultServiceLeve: "F4(灾难性)",
alterCreateTime: "2025-12-13 10:23:45",
alertStatus: "0"
},
{
alertCode: "500",
alertName: "通信链路中断",
alertObject: "通信分系统",
alertLevel: "2",
faultServiceLeve: "F3(严重)",
alterCreateTime: "2025-12-13 09:15:22",
alertStatus: "1"
},
{
alertCode: "500",
alertName: "姿态控制偏差超限",
alertObject: "姿控系统",
alertLevel: "3",
faultServiceLeve: "F2(中度)",
alterCreateTime: "2025-12-13 08:47:10",
alertStatus: "0"
},
{
alertCode: "500",
alertName: "温度传感器故障",
alertObject: "热控系统",
alertLevel: "4",
faultServiceLeve: "F1(轻微)",
alterCreateTime: "2025-12-13 07:52:33",
alertStatus: "1"
},
{
alertCode: "500",
alertName: "星敏感器数据异常",
alertObject: "星敏感器",
alertLevel: "2",
faultServiceLeve: "F3(严重)",
alterCreateTime: "2025-12-13 06:18:59",
alertStatus: "1"
},
{
alertCode: "500",
alertName: "电池组充放电异常",
alertObject: "蓄电池组",
alertService: "能源管理",
alertLevel: "2",
faultServiceLeve: "F4(灾难性)",
alterCreateTime: "2025-12-13 05:42:17",
alertStatus: "0"
},
{
alertCode: "501",
alertName: "载荷数据传输错误",
alertObject: "载荷设备",
alertService: "载荷控制",
alertLevel: "3",
faultServiceLeve: "F2(中度)",
alterCreateTime: "2025-12-13 04:33:08",
alertStatus: "0"
},
{
alertCode: "500",
alertName: "测控链路误码率高",
alertObject: "测控分系统",
alertService: "轨道控制",
alertLevel: "4",
faultServiceLeve: "F0(无影响)",
alterCreateTime: "2025-12-13 03:19:52",
alertStatus: "1"
},
{
alertCode: "500",
alertName: "电源系统电压异常",
alertObject: "电源系统",
alertLevel: "1",
faultServiceLeve: "F4(灾难性)",
alterCreateTime: "2025-12-13 10:23:45",
alertStatus: "0"
},
{
alertCode: "500",
alertName: "通信链路中断",
alertObject: "通信分系统",
alertLevel: "2",
faultServiceLeve: "F3(严重)",
alterCreateTime: "2025-12-13 09:15:22",
alertStatus: "1"
},
{
alertCode: "500",
alertName: "姿态控制偏差超限",
alertObject: "姿控系统",
alertLevel: "3",
faultServiceLeve: "F2(中度)",
alterCreateTime: "2025-12-13 08:47:10",
alertStatus: "0"
},
{
alertCode: "500",
alertName: "温度传感器故障",
alertObject: "热控系统",
alertLevel: "4",
faultServiceLeve: "F1(轻微)",
alterCreateTime: "2025-12-13 07:52:33",
alertStatus: "1"
},
{
alertCode: "500",
alertName: "星敏感器数据异常",
alertObject: "星敏感器",
alertLevel: "2",
faultServiceLeve: "F3(严重)",
alterCreateTime: "2025-12-13 06:18:59",
alertStatus: "1"
},
{
alertCode: "500",
alertName: "电池组充放电异常",
alertObject: "蓄电池组",
alertService: "能源管理",
alertLevel: "2",
faultServiceLeve: "F4(灾难性)",
alterCreateTime: "2025-12-13 05:42:17",
alertStatus: "0"
},
{
alertCode: "501",
alertName: "载荷数据传输错误",
alertObject: "载荷设备",
alertService: "载荷控制",
alertLevel: "3",
faultServiceLeve: "F2(中度)",
alterCreateTime: "2025-12-13 04:33:08",
alertStatus: "0"
},
{
alertCode: "500",
alertName: "测控链路误码率高",
alertObject: "测控分系统",
alertService: "轨道控制",
alertLevel: "4",
faultServiceLeve: "F0(无影响)",
alterCreateTime: "2025-12-13 03:19:52",
alertStatus: "1"
}
// {
// alertCode: "500",
// alertName: "电源系统电压异常",
// alertObject: "电源系统",
// alertLevel: "1",
// faultServiceLeve: "F4(灾难性)",
// alterCreateTime: "2025-12-13 10:23:45",
// alertStatus: "0"
// },
];
const compareTime = (time1, time2) => {
//console.log('cao每隔开始compareTime----------', time1, time2);
// 将时间字符串转换为 Date 对象
const date1 = new Date(time1);
// if (time2 === '-') {
// time2 = ""
// }
if (time2 === null || time2 === "" || time2 === undefined) {
time2 = new Date(
new Date(selectedStartTime.value).getTime() + 60 * 1000
).toISOString();
// //console.log('每隔开始compareTime----------', time1, time2);
}
const date2 = new Date(time2);
// 检查时间是否有效
if (isNaN(date1.getTime()) || isNaN(date2.getTime())) {
throw new Error("无效的时间格式");
}
// 比较时间戳
if (date1 >= date2) {
return true;
}else {
return false;
}
};
const alertData = ref(primitiveAlertData)
const AlertDataLevelMap = ref({
......@@ -398,54 +274,29 @@ const AlertDataLevelMap = ref({
'四级告警':4,
})
const AlertDataStatusMap = ref({
'手工清除':1,
'活动':0,
"1":'手工清除',
"0":'活动',
})
const alertInfoTransformFn = (data) => {
// 检查 data 是否为对象且不为 null
if (typeof data === 'object' && data !== null && !Array.isArray(data)) {
return [
{
orginData: data,
//console.log("wodsad--------alertInfoTransformFn",data,typeof data);
if (!data || typeof data !== 'object' || Array.isArray(data)) {
return [];
}
// 按时间排序后转为数组
return Object.entries(data)
alertCode: data.alarmCode ? data.alarmCode : '-',
alertName: data.alarmlame ? data.alarmlame : '-',
alertObject: data.objectName ? data.objectName : '-',
alertLevel: AlertDataLevelMap.value[data.alertLevel] ? AlertDataLevelMap.value[data.alertLevel] : '-',
.map(([time, data]) => ({
orginData: data,
alertCode: data[0].alarmCode ? data[0].alarmCode : '-',
alertName: data[0].alarmName ? data[0].alarmName : '-',
alertObject: data[0].objectName ? data[0].objectName : '-',
alertLevel: alertLevelMap[AlertDataLevelMap.value[data[0].alarmLevel]] ? alertLevelMap[AlertDataLevelMap.value[data[0].alarmLevel]] : '-',
// faultServiceLeve: "F4(灾难性)",
alterCreateTime: data.alarmOccurrencelime ? data.alarmOccurrencelime : '-',
alertStatus: AlertDataStatusMap.value[data.clearstatus] ? AlertDataStatusMap.value[data.clearstatus] : '-',
alterCreateTime: data[0].alarmOccurrenceTime ? data[0].alarmOccurrenceTime : '-',
alertStatus: data[0].clearStatus ? data[0].clearStatus: '-',
}));
},
];
} else if (Array.isArray(data)) {
// 如果意外传入了数组,仍然处理数组
return data.map(item => (
// console.log("传输的是数组",item.missionId,item.satName,item.arcStartTime,item.arcEndTime,item.arcDuration,item.stationName,item.missionType)
{
orginData: item,
alertCode: item.alarmCode ? item.alarmCode : '-',
alertName: item.alarmlame ? item.alarmlame : '-',
alertObject: item.objectName ? item.objectName : '-',
alertLevel: AlertDataLevelMap.value[item.alertLevel] ? AlertDataLevelMap.value[item.alertLevel] : '-',
// faultServiceLeve: "F4(灾难性)",
alterCreateTime: data.alarmOccurrencelime ? data.alarmOccurrencelime : '-',
alertStatus: AlertDataStatusMap.value[data.clearstatus] ? AlertDataStatusMap.value[data.clearstatus] : '-',
// operationResult: "帆板展开"
}
));
}
// 如果 data 不是对象也不是数组,返回空数组
return [];
}
......@@ -467,35 +318,51 @@ const searchAlterList = () => {
const errorDataShowDialogVisible = ref(false);
const errorDetailItems = ref([
// { label: '告警码', value: row.alertCode },
// { label: '告警名称', value: row.alertName },
// { label: '告警对象', value: row.alertObject },
// { label: '告警服务', value: row.alertService || 'N/A' },
// { label: '告警等级', value: row.alertLevel },
// { label: '故障服务等级', value: row.faultServiceLeve },
// { label: '告警创建时间', value: row.alterCreateTime },
// { label: '告警状态', value: row.alertStatus === '1' ? '已处理' : '未处理' }
// { label: '告警码', value: '-' },
// { label: '告警名称', value: '-' },
// { label: '告警对象', value: '-' },
// { label: '告警服务', value: '-' },
// { label: '告警等级', value: '-' },
// { label: '故障服务等级', value: '-' },
// { label: '告警创建时间', value: '-' },
// { label: '告警状态', value: row?.alertStatus === '1' ? '已处理' : '未处理' || '-' }
]);
const handleAlertDataRowClick = (row) => {
console.log(row);
errorDetailItems.value = [
{ label: '告警码', value: row.alertCode },
{ label: '告警状态', value: row.alertStatus === '1' ? '已处理' : '未处理' },
{ label: '告警名称', value: row.alertName },
{ label: '告警对象', value: row.alertObject },
{ label: '告警服务', value: row.alertService || 'N/A' },
{ label: '告警等级',value: alertLevelMap[row.alertLevel]},
{ label: '故障服务等级', value: row.faultServiceLeve },
{ label: '告警创建时间', value: row.alterCreateTime },
{ label: '告警码', value: row.alertCode || '-' },
{ label: '告警状态', value: row.alertStatus || '-' },
{ label: '告警名称', value: row.alertName || '-' },
{ label: '告警对象', value: row.alertObject || '-' },
{ label: '告警级别',value: row.alertLevel },
{ label: '告警类型', value: row.elementType || '-' },
{ label: '告警产生时间', value: row.alterCreateTime || '-' },
// { label: '告警清除时间', value: row?.orginData[0]?.alarmClearTime || '-' },
{ label: '告警清除人', value: row.alarmClearPerson || '-' },
{ label: '告警定位信息', value: row?.orginData[0]?.locationInfo || '-' },
{ label: '告警原因', value: row?.orginData[0]?.manufacturerAlarmCause || '-' },
]
errorDataShowDialogVisible.value = true;
if (window.ue5) {
window.ue5("callBackAllDialogFn", String(JSON.stringify({
type:"SatelliteAlarmInfoDialog",
status:"open"
})));
}
}
const handleIsErrorDataCloseFn = () => {
errorDataShowDialogVisible.value = false;
if (window.ue5) {
window.ue5("callBackAllDialogFn", String(JSON.stringify({
type:"SatelliteAlarmInfoDialog",
status:"close"
})));
}
}
</script>
......@@ -608,7 +475,7 @@ const handleIsErrorDataCloseFn = () => {
height:100%;
margin-top: 5px;
overflow-y: auto;
font-size: 12px;
/* margin-right: 20px; */
}
......@@ -635,6 +502,8 @@ const handleIsErrorDataCloseFn = () => {
background: linear-gradient(to right, #2c4f89 0%, rgb(0, 0, 0)) 100% !important;
}
:deep(.custom-table .el-table__body tr:hover td) {
background: transparent !important;
}
......@@ -721,16 +590,29 @@ const handleIsErrorDataCloseFn = () => {
.alert-level_4 {
background-color: #17a0e0;
}
.alertStatusClassName{
background-color: #000000;
background: #000000;
}
[class*="alert-status_"]{
font-size: 12px;
/* height:'100px'; */
background-color: #000000;
}
.alert-status_2 {
color: #28D86E !important;
background:black;
}
.alert-status_1 {
color: red;
background:none;
color: red !important;
background:black;
}
.alert-status_0 {
color: green;
background:none;
color: green !important;
background:black;
}
......@@ -818,4 +700,5 @@ const handleIsErrorDataCloseFn = () => {
</style>
\ No newline at end of file
......@@ -12,7 +12,7 @@ const allRoutePath = ["/home","/buildManage","/uavManage","/fireManage","/fileHi
router.beforeEach((to, from, next) => {
next()
// console.log("99999999------------------",import.meta.env.VITE_API_URL);
// //console.log("99999999------------------",import.meta.env.VITE_API_URL);
// if (getToken()) {
// useAppStore.isCurUserLogin = true
// }
......@@ -23,24 +23,24 @@ router.beforeEach((to, from, next) => {
// if (to.path === '/') {
// useAppStore.num = 1
// localStorage.setItem('menu', 1)//默认选中工作台
// console.log("99999999------------------",import.meta.env.VITE_API_URL);
// //console.log("99999999------------------",import.meta.env.VITE_API_URL);
// next('/home')
// } else if (whiteList.indexOf(to.path) !== -1) {
// next()
// } else {
// // console.log(999, to.path, allRoutePath.indexOf(to.path));
// // //console.log(999, to.path, allRoutePath.indexOf(to.path));
// useAppStore.num = allRoutePath.indexOf(to.path)
// localStorage.setItem('menu', allRoutePath.indexOf(to.path))
// next()
// }
// } else {
// console.log("99999999-----------88888888888888-------",import.meta.env.VITE_API_URL,whiteList.indexOf(to.path));
// //console.log("99999999-----------88888888888888-------",import.meta.env.VITE_API_URL,whiteList.indexOf(to.path));
// // 没有token--是否在白名单
// if (whiteList.indexOf(to.path) !== -1) {
// // 在免登录白名单,直接进入
// next()
// } else {
// console.log("zouzheli");
// //console.log("zouzheli");
// localStorage.clear()//清空所有本地储存
// // 重定向到首页
......@@ -94,14 +94,14 @@ router.beforeEach((to, from, next) => {
// }
// }
// } else {
// console.log('token过期或者不存在');
// //console.log('token过期或者不存在');
// // 没有token
// if (whiteList.indexOf(to.path) !== -1) {
// console.log('白名单');
// //console.log('白名单');
// // 在免登录白名单,直接进入
// next()
// } else {
// console.log(to.fullPath, '重定向');
// //console.log(to.fullPath, '重定向');
// next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
// NProgress.done()
// }
......
......@@ -239,7 +239,7 @@ export const constantRoutes = [
]
const router = createRouter({
history: createWebHashHistory(),
history: createWebHistory(),
routes: constantRoutes,
scrollBehavior(to, from, savedPosition) {
if (savedPosition) {
......
......@@ -2,7 +2,7 @@
* @Author: Z 1518051043@qq.com
* @Date: 2025-09-12 13:51:43
* @LastEditors: zwy 1518051043@qq.com
* @LastEditTime: 2026-01-14 17:24:05
* @LastEditTime: 2026-01-28 17:27:20
* @FilePath: \yuanxinPro\src\store\module\app.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -22,6 +22,13 @@ const useAppStore = defineStore(
footerTimeHasedSelectTimeToSub: false,
globalSubsystemSelectedTimeRange: ['Sun Nov 02 2025 00:00:00 GMT+0800 (中国标准时间) ','Tue Nov 04 2025 00:00:00 GMT+0800 (中国标准时间) '],
globalLeftWssCONTINE: false,
globalRecordMainSysTaskCode: 0,
subSystemTimeLineEndSelectTime: "-",
subsystemSocket: null,
subsystemSocketContent: '',
HeartbeatInterval: null,
......@@ -47,6 +54,15 @@ const useAppStore = defineStore(
}),
actions: {
setGlobalRecordMainSysTaskCode(status) {
this.globalRecordMainSysTaskCode = status
},
setGlobalLeftWssCONTINE(status) {
this.globalLeftWssCONTINE = status
},
setSubSystemTimeLineEndSelectTime(status) {
this.subSystemTimeLineEndSelectTime = status
},
setFooterTimeHasedSelectTimeToSub(status) {
this.footerTimeHasedSelectTimeToSub = status
},
......@@ -101,17 +117,17 @@ const useAppStore = defineStore(
this.globaleAutoPlay = status
},
setglobalIntervalTime(status) {
// console.log("开始执行间隔时间");
// //console.log("开始执行间隔时间");
this.globalIntervalTime = status
},
setglobalStartWss(status) {
// console.log("同步socket数据");
// //console.log("同步socket数据");
this.globalStartWss = status
},
setglobalSatelliteSearchID(status) {
// console.log("设置卫星搜索ID");
// //console.log("设置卫星搜索ID");
this.globalSatelliteSearchID = status
},
......
......@@ -3,7 +3,7 @@ import Cookies from 'js-cookie'
const TokenKey = 'Admin-Token'
export function getToken() {
// console.log('Cookies.get(TokenKey)', Cookies.get(TokenKey))
// //console.log('Cookies.get(TokenKey)', Cookies.get(TokenKey))
return Cookies.get(TokenKey)
}
......
......@@ -14,7 +14,7 @@ axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
// 创建axios实例
console.log("import.meta.env.VITE_API_URL",import.meta.env.VITE_API_URL);
//console.log("import.meta.env.VITE_API_URL",import.meta.env.VITE_API_URL);
const service = axios.create({
// axios中请求配置有baseURL选项,表示请求URL公共部分
......@@ -26,13 +26,13 @@ const service = axios.create({
// request拦截器
service.interceptors.request.use(config => {
console.log('--------------config', config)
//console.log('--------------config', config)
// // 是否需要设置 token
// const isToken = (config.headers || {}).isToken === false
// console.log('--------------isToken', isToken)
// //console.log('--------------isToken', isToken)
// // 是否需要防止数据重复提交
// const isRepeatSubmit = (config.headers || {}).repeatSubmit === false
// console.log('--------------isRepeatSubmit', isRepeatSubmit,(config.headers || {}).repeatSubmit,config.headers.repeatSubmit,undefined===false)
// //console.log('--------------isRepeatSubmit', isRepeatSubmit,(config.headers || {}).repeatSubmit,config.headers.repeatSubmit,undefined===false)
// if (getToken() && !isToken) {
// config.headers['token'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
// }
......@@ -66,7 +66,7 @@ service.interceptors.request.use(config => {
// const s_data = sessionObj.data; // 请求数据
// const s_time = sessionObj.time; // 请求时间
// const interval = 1000; // 间隔时间(ms),小于此时间视为重复提交
// // console.log(s_data, requestObj.data, requestObj.time, s_time, s_url, requestObj.url);
// // //console.log(s_data, requestObj.data, requestObj.time, s_time, s_url, requestObj.url);
// if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url) {
// const message = '数据正在处理,请勿重复提交';
// console.warn(`[${s_url}]: ` + message)
......@@ -79,7 +79,7 @@ service.interceptors.request.use(config => {
return config
},
error => {
console.log(error)
//console.log(error)
Promise.reject(error)
})
......@@ -122,7 +122,7 @@ service.interceptors.response.use(
}
},
error => {
console.log('err' + error)
//console.log('err' + error)
let { message } = error;
if (message == "Network Error") {
message = "后端接口连接异常";
......
......@@ -2,7 +2,7 @@
* @Author: Z 1518051043@qq.com
* @Date: 2025-12-01 13:52:20
* @LastEditors: zwy 1518051043@qq.com
* @LastEditTime: 2026-01-05 15:11:06
* @LastEditTime: 2026-01-21 13:08:28
* @FilePath: \yuanxinPro\src\utils\requestSocekt.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -10,15 +10,15 @@ import HeartbeatInterval from '@/store/module/app.js'
// const apiUrl = `ws://121.229.107.155:19021/trackInfo`
const apiUrl = `ws://121.229.107.155:19021/TestTimeSend`
const wss = new WebSocket(apiUrl);
wss.onopen = () => {
};
// wss.onclose = () => {
// clearInterval(HeartbeatInterval);
// console.log('WebSocket disconnected, attempting reconnect...');
// //console.log('主星级WebSocket正在重新连接, attempting reconnect...');
// setTimeout(() => {
// // 自动重连逻辑
// new WebSocket(apiUrl);
// }, 5000);
// wss = new WebSocket(apiUrl);
// //console.log('主星级WebSocket...',wss);
// }, 1000);
// };
export default wss;
......@@ -2,7 +2,7 @@
* @Author: Z 1518051043@qq.com
* @Date: 2025-12-01 13:52:20
* @LastEditors: zwy 1518051043@qq.com
* @LastEditTime: 2026-01-15 02:49:42
* @LastEditTime: 2026-01-21 13:08:12
* @FilePath: \yuanxinPro\src\utils\requestSocekt.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -12,13 +12,14 @@ const useAppStoreInstance = useAppStore()
const apiUrl = `ws://121.229.107.155:19021/systemData`
const SubWss = new WebSocket(apiUrl);
useAppStoreInstance.setSubsystemSocket(SubWss)
// wss.onclose = () => {
// SubWss.onclose = () => {
// clearInterval(ueHeartbeatInterval);
// console.log('WebSocket disconnected, attempting reconnect...');
// //console.log('子星级WebSocket正在重新连接, attempting reconnect...');
// setTimeout(() => {
// // 自动重连逻辑
// new WebSocket(apiUrl);
// }, 5000);
// SubWss = new WebSocket(apiUrl);
// //console.log('子星级WebSocket...',SubWss);
// }, 1000);
// };
export default SubWss;
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论