Skip to content
项目
群组
代码片段
帮助
当前项目
正在载入...
登录 / 注册
切换导航面板
S
SatelliteDigital
项目
项目
详情
活动
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
图表
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
日程
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
折叠边栏
关闭边栏
活动
图像
聊天
创建新问题
作业
提交
问题看板
Open sidebar
nijiawen
SatelliteDigital
Commits
7a431cb5
提交
7a431cb5
authored
3月 13, 2026
作者:
汪雄
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
update
上级
1bd1bc0c
隐藏空白字符变更
内嵌
并排
正在显示
6 个修改的文件
包含
683 行增加
和
585 行删除
+683
-585
Zodiac.js
src/api/Zodiac.js
+86
-34
screenConfigCase.vue
src/pages/header/component/screenConfigCase.vue
+272
-157
screenConfigeDialog.vue
src/pages/header/component/screenConfigeDialog.vue
+209
-173
index.vue
src/pages/header/index.vue
+111
-210
app.js
src/store/module/app.js
+5
-0
request.js
src/utils/request.js
+0
-11
没有找到文件。
src/api/Zodiac.js
浏览文件 @
7a431cb5
...
...
@@ -7,65 +7,57 @@
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%A
*/
import
request
from
'@/utils/request'
import
request
from
"@/utils/request"
;
// 左侧菜单-星座构型信息
export
function
stellationInfoApi
()
{
return
request
({
url
:
'/constellationInfo/list'
,
method
:
'get'
,
})
url
:
"/constellationInfo/list"
,
method
:
"get"
,
});
}
// 左侧菜单-卫星列表信息
export
function
stellateListInfoApi
()
{
return
request
({
url
:
'/SatelliteBasicInfo/list'
,
method
:
'get'
,
})
url
:
"/SatelliteBasicInfo/list"
,
method
:
"get"
,
});
}
// 左侧菜单-地面系统信息
export
function
siteDataInfoListApi
()
{
return
request
({
url
:
'/SiteData/list'
,
method
:
'get'
})
url
:
"/SiteData/list"
,
method
:
"get"
,
});
}
export
function
siteDataPageErrorInfoApi
(
data
)
{
return
request
({
url
:
'/SiteData/pageError'
,
method
:
'post'
,
params
:
data
})
url
:
"/SiteData/pageError"
,
method
:
"post"
,
params
:
data
,
})
;
}
export
function
groundSystemStatisticsInfoApi
()
{
return
request
({
url
:
'/GroundSystem/statistics'
,
method
:
'get'
,
})
url
:
"/GroundSystem/statistics"
,
method
:
"get"
,
});
}
export
function
subSystemStatisticsInfoApi
()
{
return
request
({
url
:
'/GroundSystem/statistics'
,
method
:
'get'
,
url
:
"/GroundSystem/statistics"
,
method
:
"get"
,
// data: data
})
})
;
}
export
function
getSubSystemOpitionListApi
(
data
)
{
return
request
({
url
:
'/subSystem/getSubSystem?subSystemType='
+
data
.
subSystemType
,
method
:
'get'
,
})
url
:
"/subSystem/getSubSystem?subSystemType="
+
data
.
subSystemType
,
method
:
"get"
,
});
}
// //console.log("propsDate-min--3333333333--------",{
...
...
@@ -77,7 +69,66 @@ export function getSubSystemOpitionListApi(data) {
// });
export
function
getSubSystemCurveListApi
(
data
)
{
return
request
({
url
:
'/subSystem/getSubSystemCurve?satelliteId='
+
data
.
satelliteId
+
'&startTime='
+
data
.
startTime
+
'&endTime='
+
data
.
endTime
+
'&code='
+
data
.
code
+
'&subSystemType='
+
data
.
subSystemType
,
method
:
'get'
})
url
:
"/subSystem/getSubSystemCurve?satelliteId="
+
data
.
satelliteId
+
"&startTime="
+
data
.
startTime
+
"&endTime="
+
data
.
endTime
+
"&code="
+
data
.
code
+
"&subSystemType="
+
data
.
subSystemType
,
method
:
"get"
,
});
}
//配置模板中的区域数据
export
function
getRegionPanel
()
{
return
request
({
url
:
"/commPanel/getRegionPanel"
,
method
:
"get"
,
});
}
//配置模板中的信关站数据
export
function
getSignalSitePanel
()
{
return
request
({
url
:
"/commPanel/getSignalSitePanel"
,
method
:
"get"
,
});
}
//配置模板中的网格数据
export
function
getGridPanel
()
{
return
request
({
url
:
"/commPanel/getGridPanel"
,
method
:
"get"
,
});
}
// 容量/流量数据
export
function
getCapacityAndTraffic
(
data
)
{
return
request
({
url
:
"/commPanel/getCapacityAndTraffic"
,
method
:
"get"
,
params
:
{
gridCodes
:
data
.
gridCodes
||
null
,
granularity
:
data
.
granularity
,
startTime
:
data
.
startTime
,
endTime
:
data
.
endTime
,
regionName
:
data
.
regionName
||
null
,
signalSiteCode
:
data
.
signalSiteCode
||
null
,
},
});
}
//格网数据
export
function
getGridInfoList
()
{
return
request
({
url
:
"/GridInfo/list"
,
method
:
"get"
,
});
}
\ No newline at end of file
src/pages/header/component/screenConfigCase.vue
浏览文件 @
7a431cb5
...
...
@@ -8,31 +8,30 @@
</div>
<div
class=
"templateCase_right_content_body"
>
<div
class=
"horizontal-sections"
>
<div
class=
"section-item"
v-for=
"(item, index) in 3"
:key=
"index"
>
<div
class=
"section-item_title"
>
<span>
内容
{{
item
}}
</span>
</div>
<div
class=
"section-item_content_up"
>
<div
class=
"selector-item"
v-for=
"(item, index) in objectSelector"
:key=
"index"
>
<label
class=
"selector-label"
>
{{
item
.
label
}}
</label>
<div
class=
"custom-select"
>
<!-- 粒度 -->
<el-select
v-model=
"item.default"
placeholder=
"Select"
style=
"width: 100%;"
>
<el-option
v-for=
"itemele in item.options"
:key=
"itemele.value"
:label=
"itemele.label"
:value=
"itemele.value"
/>
</el-select>
</div>
<div
class=
"section-item"
v-for=
"(item, index) in titles"
:key=
"index"
>
<div
class=
"section-item_title"
>
<span>
{{
item
.
title
}}
</span>
</div>
<div
class=
"section-item_content_up"
>
<!--
<div
v-for=
"(element,index) in [template1Selector,template2Selector]"
:key=
"index"
>
</div>
-->
<div
class=
"selector-item"
v-for=
"(item, key) in item.templateSelector"
:key=
"key"
>
<label
class=
"selector-label"
>
{{
item
.
label
}}
</label>
<div
class=
"custom-select"
>
<!-- 粒度 -->
<el-select
v-model=
"item.default"
placeholder=
""
style=
"width: 100%;"
>
<el-option
v-for=
"itemele in item.options"
:key=
"itemele.value"
:label=
"itemele.label"
:value=
"itemele.value"
/>
</el-select>
</div>
</div>
<div
class=
"section-item_content_down"
>
<hotMapComponent
v-if=
"index === 0"
></hotMapComponent>
<cdf
v-if=
"index === 1"
:allIdName=
"allIdName[0]"
></cdf>
<instant
v-if=
"index === 2"
:allIdName=
"allIdName[1]"
></instant>
</div>
</div>
<div
class=
"section-item_content_down"
>
<hotMapComponent
v-if=
"index === 0"
></hotMapComponent>
<cdf
v-if=
"index === 1"
:allIdName=
"allIdName[0]"
></cdf>
<instant
v-if=
"index === 2"
:allIdName=
"allIdName[1]"
></instant>
</div>
</div>
</div>
...
...
@@ -44,142 +43,242 @@
import
hotMapComponent
from
'@/pages/all/components/hotMapComponents/index.vue'
;
import
cdf
from
'@/pages/all/components/cdf/index.vue'
;
import
instant
from
'@/pages/all/components/instant/index.vue'
;
const
allIdName
=
ref
([[
'allIdName11'
,
'allIdName12'
],
[
'allIdName21'
,
'allIdName22'
]]);
const
allIdName
=
ref
([[
'allIdName11'
,
'allIdName12'
],
[
'allIdName21'
,
'allIdName22'
]]);
// 组件逻辑可以在这里添加
const
objectSelector
=
[
{
label
:
'地面粒度'
,
default
:
'区域'
,
options
:
[
{
value
:
'区域'
,
label
:
'区域'
,
},
{
value
:
'站点'
,
label
:
'站点'
,
},
{
value
:
'设备类型'
,
label
:
'设备类型'
,
},
{
value
:
'具体设备'
,
label
:
'具体设备'
,
}
]
},
{
label
:
'卫星粒度'
,
default
:
'卫星'
,
options
:
[
{
value
:
'卫星'
,
label
:
'卫星'
,
},
{
value
:
'星座'
,
label
:
'星座'
,
},
{
value
:
'波束'
,
label
:
'波束'
,
},
{
value
:
'转发器'
,
label
:
'转发器'
,
}
]
},
const
titles
=
[
{
label
:
'模板'
,
default
:
'Example #1'
,
options
:
[
title
:
'容量/流量'
,
templateSelector
:
[
{
value
:
'Example #1'
,
label
:
'Example #1'
,
label
:
'曲线类型'
,
default
:
'热力图'
,
options
:
[
{
value
:
'瞬时值曲线'
,
label
:
'瞬时值曲线'
,
},
{
value
:
'PDF曲线'
,
label
:
'PDF曲线'
,
},
{
value
:
'热力图'
,
label
:
'热力图'
,
},
]
},
{
value
:
'Example #2'
,
label
:
'Example #2'
,
label
:
'地理标准'
,
default
:
'最小值'
,
options
:
[
{
value
:
'最小值'
,
label
:
'最小值'
,
},
{
value
:
'最大值'
,
label
:
'最大值'
,
},
{
value
:
'平均值'
,
label
:
'平均值'
,
}
]
},
{
value
:
'Example #3'
,
label
:
'Example #3'
,
label
:
'时间标准'
,
default
:
'最小值'
,
options
:
[
{
value
:
'最小值'
,
label
:
'最小值'
,
},
{
value
:
'最大值'
,
label
:
'最大值'
,
},
{
value
:
'平均值'
,
label
:
'平均值'
,
}
]
},
{
value
:
'自定义模板'
,
label
:
'自定义模板'
,
}
]
},
{
label
:
'地面粒度'
,
default
:
'区域'
,
options
:
[
title
:
'可用性'
,
templateSelector
:
[
{
value
:
'区域'
,
label
:
'区域'
,
label
:
'曲线类型'
,
default
:
'热力图'
,
options
:
[
{
value
:
'PDF曲线'
,
label
:
'PDF曲线'
,
},
{
value
:
'热力图'
,
label
:
'热力图'
,
},
]
},
{
value
:
'站点'
,
label
:
'站点'
,
label
:
'地理标准'
,
default
:
'最小值'
,
options
:
[
{
value
:
'最小值'
,
label
:
'最小值'
,
},
{
value
:
'最大值'
,
label
:
'最大值'
,
},
{
value
:
'平均值'
,
label
:
'平均值'
,
}
]
},
{
value
:
'设备类型'
,
label
:
'设备类型'
,
label
:
'时间标准'
,
default
:
'最小值'
,
options
:
[
{
value
:
'最小值'
,
label
:
'最小值'
,
},
{
value
:
'最大值'
,
label
:
'最大值'
,
},
{
value
:
'平均值'
,
label
:
'平均值'
,
}
]
},
{
value
:
'具体设备'
,
label
:
'具体设备'
,
}
]
},
{
label
:
'卫星粒度'
,
default
:
'卫星'
,
options
:
[
title
:
'网络时延/丢包'
,
templateSelector
:
[
{
value
:
'卫星'
,
label
:
'卫星'
,
label
:
'时延曲线类型'
,
default
:
'瞬时值曲线'
,
options
:
[
{
value
:
'瞬时值曲线'
,
label
:
'瞬时值曲线'
,
},
{
value
:
'PDF曲线'
,
label
:
'PDF曲线'
,
},
{
value
:
'热力图'
,
label
:
'热力图'
,
},
]
},
{
value
:
'星座'
,
label
:
'星座'
,
label
:
'地理标准'
,
default
:
'最小值'
,
options
:
[
{
value
:
'最小值'
,
label
:
'最小值'
,
},
{
value
:
'最大值'
,
label
:
'最大值'
,
},
{
value
:
'平均值'
,
label
:
'平均值'
,
}
]
},
{
value
:
'波束'
,
label
:
'波束'
,
label
:
'时间标准'
,
default
:
'最小值'
,
options
:
[
{
value
:
'最小值'
,
label
:
'最小值'
,
},
{
value
:
'最大值'
,
label
:
'最大值'
,
},
{
value
:
'平均值'
,
label
:
'平均值'
,
}
]
},
{
value
:
'转发器'
,
label
:
'转发器'
,
}
]
},
{
label
:
'模板'
,
default
:
'Example #1'
,
options
:
[
{
value
:
'Example #1'
,
label
:
'Example #1'
,
{
label
:
'丢包曲线类型'
,
default
:
'瞬时值曲线'
,
options
:
[
{
value
:
'最小值'
,
label
:
'最小值'
,
},
{
value
:
'最大值'
,
label
:
'最大值'
,
},
{
value
:
'平均值'
,
label
:
'平均值'
,
}
]
},
{
value
:
'Example #2'
,
label
:
'Example #2'
,
{
label
:
'地理标准'
,
default
:
'最小值'
,
options
:
[
{
value
:
'最小值'
,
label
:
'最小值'
,
},
{
value
:
'最大值'
,
label
:
'最大值'
,
},
{
value
:
'平均值'
,
label
:
'平均值'
,
}
]
},
{
value
:
'Example #3'
,
label
:
'Example #3'
,
label
:
'时间标准'
,
default
:
'最小值'
,
options
:
[
{
value
:
'最小值'
,
label
:
'最小值'
,
},
{
value
:
'最大值'
,
label
:
'最大值'
,
},
{
value
:
'平均值'
,
label
:
'平均值'
,
}
]
},
{
value
:
'自定义模板'
,
label
:
'自定义模板'
,
}
]
}
];
const
template2Selector
=
[]
</
script
>
<
style
scoped
>
...
...
@@ -208,22 +307,26 @@ const objectSelector = [
}
.horizontal-sections
{
display
:
flex
;
/* 启用弹性布局来水平排列 */
display
:
flex
;
/* 启用弹性布局来水平排列 */
height
:
100%
;
border-right
:
1px
solid
rgba
(
255
,
0
,
0
,
0.1
);
}
.section-item
{
flex
:
1
;
/* 平均分配宽度 */
flex
:
1
;
/* 平均分配宽度 */
height
:
100%
;
/* background-color: #f5f10c; */
/* border: 1px solid rgba(255, 255, 255, 0.1); */
padding
:
0px
10px
;
padding-top
:
5px
;
display
:
flex
;
/* 使内部内容也使用弹性布局 */
flex-direction
:
column
;
/* 垂直排列子元素 */
/* overflow-y: auto; */
display
:
flex
;
/* 使内部内容也使用弹性布局 */
flex-direction
:
column
;
/* 垂直排列子元素 */
/* overflow-y: auto; */
}
.templateCase_right_content_header_item
{
...
...
@@ -237,18 +340,18 @@ const objectSelector = [
.section-item_title
{
height
:
5%
;
/* background-color: #051020; */
display
:
flex
;
align-items
:
center
;
justify-content
:
left
;
padding-left
:
5px
;
border-left
:
1px
solid
#2e7dff
;
font-size
:
14px
;
color
:
#fff
;
padding
:
10px
;
font-weight
:
600
;
.section-item_title
{
height
:
5%
;
/* background-color: #051020; */
display
:
flex
;
align-items
:
center
;
justify-content
:
left
;
padding-left
:
5px
;
border-left
:
1px
solid
#2e7dff
;
font-size
:
14px
;
color
:
#fff
;
padding
:
10px
;
font-weight
:
600
;
}
...
...
@@ -261,32 +364,43 @@ const objectSelector = [
/* height: 42%; */
width
:
100%
;
/* background-color: #2d20a0; */
display
:
flex
;
/* 启用弹性布局 */
flex-wrap
:
wrap
;
/* 允许换行 */
gap
:
10px
;
/* 元素间距 */
padding
:
10px
;
/* 内边距 */
box-sizing
:
border-box
;
/* 包含padding */
align-content
:
flex-start
;
/* 对齐方式 */
display
:
flex
;
/* 启用弹性布局 */
flex-wrap
:
wrap
;
/* 允许换行 */
gap
:
10px
;
/* 元素间距 */
padding
:
10px
;
/* 内边距 */
box-sizing
:
border-box
;
/* 包含padding */
align-content
:
flex-start
;
/* 对齐方式 */
}
.selector-item
{
display
:
flex
;
flex-direction
:
column
;
gap
:
5px
;
min-width
:
100px
;
/* 最小宽度 */
flex
:
1
;
/* 弹性增长 */
min-width
:
100px
;
/* 最小宽度 */
flex
:
1
;
/* 弹性增长 */
}
.custom-select
{
position
:
relative
;
width
:
100%
;
/* 自适应宽度 */
width
:
100%
;
/* 自适应宽度 */
}
:deep
(
.custom-select
.el-select__wrapper
)
{
height
:
12.5px
;
}
.section-item_content_down
{
width
:
100%
;
/* background-color: #9520a0; */
padding
:
10px
0
;
.section-item_content_down
{
width
:
100%
;
/* background-color: #9520a0; */
padding
:
10px
0
;
}
</
style
>
\ No newline at end of file
src/pages/header/component/screenConfigeDialog.vue
浏览文件 @
7a431cb5
<
template
>
<div
class=
"dashboard-container"
>
<!-- 顶部导航栏 -->
<header
class=
"dashboard-header"
>
<div
class=
"logo"
>
<div
class=
"logo_header"
>
<i
class=
"icon-dashboard"
>
<i
class=
"icon-dashboard"
>
<img
src=
"@/assets/images/headers/config_header.png"
alt=
""
style=
"width: 20px; height: 20px;"
>
</i>
<span
class=
"logo_header_content"
>
大屏配置
</span>
...
...
@@ -13,7 +14,7 @@
<span
class=
"logo_header_right_content"
>
[区域一特事故]
</span>
</div>
</div>
<div
class=
"logo logo_right"
>
<hr
class=
"divider"
>
</div>
...
...
@@ -26,23 +27,16 @@
<main
class=
"dashboard-main"
>
<!-- 标签页导航 -->
<div
class=
"tabs-container"
>
<div
class=
"tab-item"
:class=
"
{ 'active': activeTab === 'equipmentCount' }"
@click="activeTab = 'equipmentCount'"
>
<div
class=
"tab-item"
:class=
"
{ 'active': activeTab === 'equipmentCount' }"
@click="activeTab = 'equipmentCount'">
对象选取
</div>
<div
class=
"tab-item"
:class=
"
{ 'active': activeTab === 'failureStatus' }"
@click="activeTab = 'failureStatus'"
>
<div
class=
"tab-item"
:class=
"
{ 'active': activeTab === 'failureStatus' }" @click="activeTab = 'failureStatus'">
模板列表
</div>
<div
class=
"tab-indicator"
:style=
"indicatorStyle"
></div>
</div>
<!-- 标签页内容区域 -->
<div
class=
"tab-content"
>
<!-- 根据选中的标签显示不同内容 -->
...
...
@@ -51,62 +45,51 @@
<div
class=
"equipment-content"
>
<!-- 下拉选择器区域 -->
<div
class=
"selector-container"
>
<div
class=
"selector-item"
v-for=
"(item, index) in objectSelector"
:key=
"index"
>
<label
class=
"selector-label"
>
{{
item
.
label
}}
</label>
<div
class=
"selector-item"
>
<label
class=
"selector-label"
>
{{
keliSelector
.
label
}}
</label>
<div
class=
"custom-select"
>
<!-- 粒度 -->
<el-select
v-model=
"item.default"
placeholder=
"Select"
style=
"width: 100%;"
>
<el-option
v-for=
"itemele in item.options"
:key=
"itemele.value"
:label=
"itemele.label"
:value=
"itemele.value"
/>
<!-- 粒度 -->
<el-select
v-model=
"keliSelector.value"
placeholder=
""
style=
"width: 100%;"
@
change=
"keliOnChange"
>
<el-option
v-for=
"item in keliSelector.options"
:key=
"item.value"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</div>
</div>
<!--
<div
class=
"selector-item"
>
<label
class=
"selector-label"
>
{{
objectSelector
[
1
].
label
}}
</label>
<div
class=
"custom-select"
>
<div
class=
"select-trigger"
@
click=
"toggleDropdown(1)"
>
<span
class=
"select-value"
>
{{
selectedValues
[
1
]
}}
</span>
<i
class=
"select-arrow"
>
▼
</i>
</div>
<div
class=
"select-dropdown"
v-if=
"dropdownVisible[1]"
>
<div
class=
"dropdown-option"
v-for=
"option in objectSelector[1].options"
:key=
"option"
@
click=
"selectOption(1, option)"
>
{{
option
}}
</div>
</div>
</div>
</div>
<div
class=
"selector-item"
>
<label
class=
"selector-label"
>
{{
objectSelector
[
2
].
label
}}
</label>
<div
class=
"custom-select"
>
<div
class=
"select-trigger"
@
click=
"toggleDropdown(2)"
>
<span
class=
"select-value"
>
{{
selectedValues
[
2
]
}}
</span>
<i
class=
"select-arrow"
>
▼
</i>
</div>
<div
class=
"select-dropdown"
v-if=
"dropdownVisible[2]"
>
<div
class=
"dropdown-option"
v-for=
"option in objectSelector[2].options"
:key=
"option"
@
click=
"selectOption(2, option)"
>
{{
option
}}
</div>
</div>
</div>
</div>
-->
</div>
<div
class=
"content-item"
>
<hotMapComponent></hotMapComponent>
<cdf
:allIdName=
"allIdName[0]"
></cdf>
<instant
:allIdName=
"allIdName[1]"
></instant>
<div
class=
"selector-item"
v-if=
"!isGlobal"
>
<label
class=
"selector-label"
style=
"visibility: hidden;"
>
占位符
</label>
<div
class=
"custom-select"
>
<el-select
v-model=
"childrenSelector.value"
placeholder=
""
style=
"width: 100%;"
:disabled=
"isGlobal"
>
<el-option
v-for=
"item in childrenSelector.options"
:key=
"item.value"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</div>
<div>
<el-button
type=
"primary"
class=
"apply-btn apply-btn-right"
>
应用
</el-button>
</div>
<div
class=
"selector-item"
>
<label
class=
"selector-label"
>
{{
templateSelector
.
label
}}
</label>
<div
class=
"custom-select"
>
<!-- 粒度 -->
<el-select
v-model=
"templateSelector.value"
placeholder=
""
style=
"width: 100%;"
>
<el-option
v-for=
"item in templateSelector.options"
:key=
"item.value"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</div>
</div>
</div>
<div
class=
"content-item"
>
<hotMapComponent></hotMapComponent>
<cdf
:allIdName=
"allIdName[0]"
></cdf>
<instant
:allIdName=
"allIdName[1]"
></instant>
</div>
<div>
<el-button
type=
"primary"
class=
"apply-btn apply-btn-right"
>
应用
</el-button>
</div>
</div>
</div>
<div
v-if=
"activeTab === 'failureStatus'"
class=
"tab-panel"
>
<!-- 模板案例情况内容 -->
<div
class=
"failure-content"
>
...
...
@@ -114,19 +97,18 @@
<div
class=
"templateCase_left_header"
>
<div
class=
"templateCase_left_header_item_title"
>
模板列表
</div>
<div
class=
"templateCase_left_header_item_tool"
>
<el-icon
@
click=
"templateCasedeleteHandFn"
><Delete
/></el-icon>
<el-icon
@
click=
"templateCaseAddHandFn"
><Plus
/></el-icon>
<el-icon
@
click=
"templateCasedeleteHandFn"
>
<Delete
/>
</el-icon>
<el-icon
@
click=
"templateCaseAddHandFn"
>
<Plus
/>
</el-icon>
</div>
</div>
<div
class=
"templateCase_left_content"
>
<div
class=
"templateCase_left_content_item"
v-for=
"(item, index) in templateCaseList"
:key=
"index"
@
click=
"templateCaseClickFn(index)"
:class=
"
{ 'CaseClickActive': activeTemplateIndex === index }"
>
<div
class=
"templateCase_left_content"
>
<div
class=
"templateCase_left_content_item"
v-for=
"(item, index) in templateCaseList"
:key=
"index"
@
click=
"templateCaseClickFn(index)"
:class=
"
{ 'CaseClickActive': activeTemplateIndex === index }">
{{
item
}}
</div>
</div>
...
...
@@ -134,7 +116,7 @@
<div
class=
"templateCase_right templateCase"
>
<screenConfigCase></screenConfigCase>
</div>
</div>
<el-button
type=
"primary"
class=
"apply-btn"
>
应用
</el-button>
</div>
...
...
@@ -145,85 +127,83 @@
<
script
setup
>
import
{
ref
,
computed
,
onMounted
}
from
'vue'
;
import
{
ref
,
computed
,
onMounted
,
watch
}
from
'vue'
;
import
hotMapComponent
from
'@/pages/all/components/hotMapComponents/index.vue'
;
import
cdf
from
'@/pages/all/components/cdf/index.vue'
;
import
instant
from
'@/pages/all/components/instant/index.vue'
;
import
screenConfigCase
from
'./screenConfigCase.vue'
;
import
{
getCapacityAndTraffic
}
from
'@/api/Zodiac'
;
import
useAppStore
from
'@/store/module/app'
const
appStore
=
useAppStore
();
const
emits
=
defineEmits
([
'handleScreenConfigeClose'
]);
const
allIdName
=
ref
([[
'allIdName11'
,
'allIdName12'
],
[
'allIdName21'
,
'allIdName22'
]]);
// 标签页状态管理
const
activeTab
=
ref
(
'equipmentCount'
);
// 默认选中"地面站设备数量"
const
objectSelector
=
[
const
keliSelector
=
ref
(
{
label
:
'地面粒度'
,
default
:
'区域
'
,
value
:
'global
'
,
options
:
[
{
value
:
'
区域
'
,
label
:
'
区域
'
,
value
:
'
global
'
,
label
:
'
全球
'
,
},
{
value
:
'
站点
'
,
label
:
'
站点
'
,
value
:
'
region
'
,
label
:
'
区域
'
,
},
{
value
:
'
设备类型
'
,
label
:
'
设备类型
'
,
value
:
'
station
'
,
label
:
'
信关站
'
,
},
{
value
:
'
具体设备
'
,
label
:
'
具体设备
'
,
value
:
'
grid
'
,
label
:
'
格网
'
,
}
]
},
});
//根据前选择器决定后选择器
const
childrenSelector
=
ref
(
{
label
:
'卫星粒度'
,
default
:
'卫星'
,
options
:
[
{
value
:
'卫星'
,
label
:
'卫星'
,
},
{
value
:
'星座'
,
label
:
'星座'
,
},
{
value
:
'波束'
,
label
:
'波束'
,
},
{
value
:
'转发器'
,
label
:
'转发器'
,
}
]
},
label
:
''
,
value
:
''
,
options
:
[]
}
)
const
isGlobal
=
computed
(()
=>
keliSelector
.
value
.
value
===
'global'
);
const
templateSelector
=
ref
(
{
label
:
'模板'
,
default
:
'Example #
1'
,
label
:
'模板
选择
'
,
value
:
'模板
1'
,
options
:
[
{
value
:
'
Example #
1'
,
label
:
'
Example #
1'
,
value
:
'
模板
1'
,
label
:
'
模板
1'
,
},
{
value
:
'
Example #
2'
,
label
:
'
Example #
2'
,
value
:
'
模板
2'
,
label
:
'
模板
2'
,
},
{
value
:
'
Example #
3'
,
label
:
'
Example #
3'
,
value
:
'
模板
3'
,
label
:
'
模板
3'
,
},
{
value
:
'自定义模板'
,
label
:
'自定义模板'
,
value
:
'模板4'
,
}
]
}
];
const
templateCaseList
=
ref
([
'模板1'
,
'模板2'
,
'模板3'
,
'模板4'
,
'模板26'
,
'模板27'
,
'模板28'
])
)
const
templateCaseList
=
ref
([
'模板1'
,
'模板2'
])
// 下拉选择器状态
const
selectedValues
=
ref
([]);
const
dropdownVisible
=
ref
([
false
,
false
,
false
]);
...
...
@@ -234,8 +214,8 @@ const templateCaseAddHandFn = () => {
//console.log('templateCaseAddHandFn');
};
// 初始化选中值
onMounted
(()
=>
{
selectedValues
.
value
=
objectSelector
.
map
(
item
=>
item
.
default
);
onMounted
(
async
()
=>
{
await
getCapacityAndTrafficData
()
});
// 切换下拉菜单显示
...
...
@@ -244,11 +224,20 @@ const toggleDropdown = (index) => {
dropdownVisible
.
value
=
dropdownVisible
.
value
.
map
((
val
,
i
)
=>
i
===
index
?
!
val
:
false
);
};
// 选择下拉选项
const
selectOption
=
(
index
,
option
)
=>
{
selectedValues
.
value
[
index
]
=
option
;
dropdownVisible
.
value
[
index
]
=
false
;
// 选择后关闭下拉菜单
};
const
getCapacityAndTrafficData
=
async
()
=>
{
const
res
=
await
getCapacityAndTraffic
({
granularity
:
keliSelector
.
value
.
value
,
startTime
:
'2025-11-03 00:00:00'
,
endTime
:
'2025-11-06 00:00:00'
,
regionName
:
''
,
signalSiteCode
:
''
,
gridCodes
:
''
})
console
.
log
(
res
)
}
const
activeTemplateIndex
=
ref
(
0
);
const
templateCaseClickFn
=
(
index
)
=>
{
//console.log('templateCaseClickFn', index);
...
...
@@ -263,37 +252,56 @@ document.addEventListener('click', (e) => {
// 计算指示器位置
const
indicatorStyle
=
computed
(()
=>
{
return
activeTab
.
value
===
'equipmentCount'
?
{
left
:
'0%'
,
width
:
'50%'
}
return
activeTab
.
value
===
'equipmentCount'
?
{
left
:
'0%'
,
width
:
'50%'
}
:
{
left
:
'50%'
,
width
:
'50%'
};
});
const
keliOnChange
=
()
=>
{
childrenSelector
.
value
.
value
=
''
switch
(
keliSelector
.
value
.
value
)
{
case
'region'
:
childrenSelector
.
value
.
options
=
appStore
.
regionPanelData
break
;
case
'grid'
:
childrenSelector
.
value
.
options
=
appStore
.
gridPanelData
break
;
case
'station'
:
childrenSelector
.
value
.
options
=
appStore
.
signalSitePanelData
break
;
}
}
watch
(()
=>
keliSelector
.
value
.
value
,
keliOnChange
)
</
script
>
<
style
scoped
>
/* 基础样式设置 */
.dashboard-container
{
/* width: 900px; */
background-color
:
#000000
;
color
:
#080606
;
/* display: flex;
flex-direction: column; */
position
:
fixed
;
/* 改为fixed定位 */
position
:
fixed
;
/* 改为fixed定位 */
left
:
10%
;
top
:
10%
;
width
:
1550px
;
width
:
1550px
;
z-index
:
1001
;
overflow
:
hidden
;
}
...
...
@@ -328,7 +336,7 @@ const indicatorStyle = computed(() => {
width
:
10px
;
height
:
10px
;
display
:
flex
;
align-items
:
center
;
align-items
:
center
;
}
.logo_header_content
{
...
...
@@ -342,7 +350,7 @@ const indicatorStyle = computed(() => {
display
:
flex
;
padding-left
:
10px
;
align-items
:
center
;
width
:
100px
;
width
:
100px
;
height
:
100%
;
}
...
...
@@ -438,24 +446,28 @@ const indicatorStyle = computed(() => {
border-radius
:
8px
;
padding
:
5px
15px
;
}
.equipment-content
{
.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
;
font-size
:
15px
;
width
:
1500px
;
/* gap: 20px; 添加间距 */
/* height: 500px; */
/* background-color: rgba(1, 73, 241, 0.5); */
/* padding: 15px; 添加内边距 */
border-radius
:
8px
;
/* 添加圆角 */
border-radius
:
8px
;
/* 添加圆角 */
}
.templateCase
{
...
...
@@ -466,14 +478,15 @@ const indicatorStyle = computed(() => {
/* border-radius: 6px; 添加圆角 */
/* border: 1px solid rgba(255, 255, 255, 0.1); 添加边框 */
/* padding: 10px; 添加内边距 */
overflow
:
hidden
;
/* 防止内容溢出 */
overflow
:
hidden
;
/* 防止内容溢出 */
}
/* 可以为左右两侧添加不同样式 */
.templateCase_left
{
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
);
...
...
@@ -492,7 +505,7 @@ const indicatorStyle = computed(() => {
}
.templateCase_right_content
{
.templateCase_right_content
{
display
:
flex
;
flex-direction
:
column
;
height
:
100%
;
...
...
@@ -500,7 +513,8 @@ const indicatorStyle = computed(() => {
/* background-color: #2b70df; */
/* padding: 10px 10px; */
}
.templateCase_right_content_header
{
.templateCase_right_content_header
{
display
:
flex
;
flex-direction
:
column
;
height
:
8%
;
...
...
@@ -508,11 +522,13 @@ const indicatorStyle = computed(() => {
padding
:
10px
10px
;
/* background-color: #df2b34; */
}
.templateCase_right_content_body
{
.templateCase_right_content_body
{
height
:
92%
;
width
:
100%
;
background-color
:
#73df2b
;
}
/* 新增样式 */
.horizontal-sections
{
display
:
flex
;
...
...
@@ -523,13 +539,16 @@ const indicatorStyle = computed(() => {
.section-item
{
flex
:
1
;
height
:
100%
;
background-color
:
#1e293b
;
/* 您可以选择合适的背景色 */
border
:
1px
solid
rgba
(
255
,
255
,
255
,
0.1
);
/* 可选:边框 */
background-color
:
#1e293b
;
/* 您可以选择合适的背景色 */
border
:
1px
solid
rgba
(
255
,
255
,
255
,
0.1
);
/* 可选:边框 */
padding
:
10px
10px
;
/* border-radius: 4px; 可选:圆角 */
}
.templateCase_right_content_header_item
{
.templateCase_right_content_header_item
{
height
:
100%
;
width
:
8%
;
display
:
flex
;
...
...
@@ -538,34 +557,39 @@ const indicatorStyle = computed(() => {
/* background-color: #6ffcba; */
}
.templateCase_left_header
{
.templateCase_left_header
{
display
:
flex
;
padding
:
10px
0
;
}
.templateCase_left_header_item_title
{
.templateCase_left_header_item_title
{
flex
:
0.61
;
padding-left
:
10px
;
/* background-color: #2c60b4; */
}
.templateCase_left_header_item_tool
{
display
:
flex
;
justify-content
:
flex-end
;
flex
:
0.39
;
gap
:
15px
;
padding-right
:
10px
;
align-items
:
center
;
/* 垂直居中对齐 */
align-items
:
center
;
/* 垂直居中对齐 */
}
.templateCase_left_content
{
.templateCase_left_content
{
/* background-color: #6ffcba; */
width
:
100%
;
height
:
100%
;
overflow-y
:
auto
;
}
.templateCase_left_content_item
{
.templateCase_left_content_item
{
height
:
40px
;
width
:
100%
;
display
:
flex
;
...
...
@@ -578,19 +602,20 @@ const indicatorStyle = computed(() => {
/* background-color: #2c78f5; */
}
.CaseClickActive
{
.CaseClickActive
{
background
:
linear-gradient
(
to
right
,
#193d77
0
,
rgba
(
0
,
0
,
0
,
1
)
100%
);
}
.templateCase_left_content_item
:hover
{
.templateCase_left_content_item
:hover
{
background
:
linear-gradient
(
to
right
,
#2b70df
0
,
rgba
(
0
,
0
,
0
,
1
)
100%
);
}
/* 下拉选择器样式 */
.selector-container
{
display
:
flex
;
gap
:
20px
;
/* padding: 10px 0; */
}
.selector-item
{
...
...
@@ -609,19 +634,22 @@ const indicatorStyle = computed(() => {
position
:
relative
;
width
:
160px
;
/* color: #ffffff; */
border
:
1px
solid
#000000
;
border
:
1px
solid
#000000
;
}
:deep
(
.custom-select
.el-select__wrapper
)
{
height
:
12.5px
;
}
:deep
(
.custom-select
.el-select
)
{
:deep
(
.custom-select
.el-select
)
{
background
:
#000000
;
border
:
1px
solid
#000000
;
border
:
1px
solid
#000000
;
/* color: #ffffff; */
}
:deep
(
.custom-select
.el-select
.el-select__wrapper
)
{
:deep
(
.custom-select
.el-select
.el-select__wrapper
)
{
background
:
#000000
;
border
:
1px
solid
#000000
;
border
:
1px
solid
#000000
;
box-shadow
:
0
0
2px
rgba
(
131
,
131
,
131
,
0.95
);
/* color: #ffffff; */
}
...
...
@@ -631,15 +659,18 @@ const indicatorStyle = computed(() => {
/* font-size: 10px; */
}
:deep
(
.el-popper
)
{
:deep
(
.el-popper
)
{
background-color
:
#000000
!important
;
}
:deep
(
.el-select-dropdown
)
{
:deep
(
.el-select-dropdown
)
{
background
:
#000000
!important
;
}
:deep
(
.el-select-dropdown
)
{
:deep
(
.el-select-dropdown
)
{
background-color
:
#000000
!important
;
}
.select-trigger
{
display
:
flex
;
justify-content
:
space-between
;
...
...
@@ -693,7 +724,8 @@ const indicatorStyle = computed(() => {
background-color
:
#334155
;
color
:
#ffffff
;
}
.content-item
{
.content-item
{
display
:
flex
;
flex-direction
:
row
;
gap
:
20px
;
...
...
@@ -701,20 +733,23 @@ const indicatorStyle = computed(() => {
/* background-color: #1c5abe; */
}
.content-item
>
*
{
.content-item
>
*
{
flex
:
1
;
min-width
:
0
;
}
.content-item
>
*
:not
(
:last-child
)
{
.content-item
>*
:not
(
:last-child
)
{
padding-right
:
10px
;
border-right
:
1px
solid
#1b1b1b
;
/* 右边框样式 */
border-right
:
1px
solid
#1b1b1b
;
/* 右边框样式 */
}
.apply-btn-right
{
.apply-btn-right
{
position
:
absolute
;
bottom
:
16px
;
}
:deep
(
.apply-btn
)
{
:deep
(
.apply-btn
)
{
width
:
100px
;
height
:
30px
;
/* margin-top: 10%; */
...
...
@@ -726,6 +761,7 @@ const indicatorStyle = computed(() => {
cursor
:
pointer
;
border-bottom
:
1px
solid
#2c78f5
;
}
/* 滚动条样式 */
.select-dropdown
::-webkit-scrollbar
{
width
:
6px
;
...
...
src/pages/header/index.vue
浏览文件 @
7a431cb5
...
...
@@ -2,14 +2,15 @@
<div
class=
"navbar-container"
:style=
"
{ '--limit_width': Limit_Width + 'px', '--limit_height': Limit_Height + 'px' }">
<!-- 背景装饰光效 -->
<div
class=
"navbar-glow"
></div>
<div
class=
"navbar-content"
>
<!-- 左侧时间和天气信息 -->
<div
class=
"navbar-left"
>
<div
class=
"status-item weather-info"
>
<span
class=
"icon"
>
<img
src=
"@/assets/images/headers/yuanxin.png"
alt=
"图标"
class=
"weather-icon"
style=
"width: 100%; height: 100%;"
>
</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"
>
...
...
@@ -17,7 +18,7 @@
<span
class=
"text"
>
{{
currentTime
}}
</span>
</div>
-->
</div>
<!-- 中间标题 -->
<div
class=
"navbar-center"
>
<div
class=
"title-container"
>
...
...
@@ -25,66 +26,47 @@
<div
class=
"title-glow"
></div>
</div>
</div>
<!-- 右侧功能按钮 -->
<div
class=
"navbar-right"
>
<div
class=
"control-item company-item"
@
click=
"handletoLinkClick"
>
<img
v-if=
"!imageError"
src=
"@/assets/images/headers/header_style.png"
alt=
"大屏配置"
class=
"company-logo"
@
error=
"handleImageError"
>
<img
v-if=
"!imageError"
src=
"@/assets/images/headers/header_style.png"
alt=
"大屏配置"
class=
"company-logo"
@
error=
"handleImageError"
>
<span
class=
"control-label"
>
跳转
</span>
</div>
<div
class=
"control-item digital-person-item"
:class=
"
{ active: digitalPersonShow }">
<el-switch
v-model=
"digitalPersonShow"
/>
<el-switch
v-model=
"digitalPersonShow"
/>
<span
class=
"control-label"
>
数字人
</span>
</div>
<div
class=
"control-item company-item"
@
click=
"handleCompanyClick"
>
<img
v-if=
"!imageError"
src=
"@/assets/images/headers/header_style.png"
alt=
"大屏配置"
class=
"company-logo"
@
error=
"handleImageError"
>
<img
v-if=
"!imageError"
src=
"@/assets/images/headers/header_style.png"
alt=
"大屏配置"
class=
"company-logo"
@
error=
"handleImageError"
>
<!--
<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
class=
"control-item rightTime"
>
<span
class=
"timeColor"
>
{{
currentTime
.
split
(
" "
)[
0
]
}}
</span>
<span
>
{{
currentTime
.
split
(
" "
)[
1
]
}}
</span>
</div>
</div>
</div>
<el-dialog
v-model=
"screenConfigeDialogVisible"
:destroy-on-close=
"true"
:modal=
"false"
width=
"100"
:show-close=
"false"
:before-close=
"handleScreenConfigeClose"
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>
<el-dialog
v-model=
"screenConfigeDialogVisible"
:destroy-on-close=
"true"
:modal=
"false"
width=
"100"
:show-close=
"false"
:before-close=
"handleScreenConfigeClose"
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>
<!--
<el-dialog
<!--
<el-dialog
v-model=
"digitalPersonShow"
title=
"Tips"
width=
"500"
...
...
@@ -94,16 +76,11 @@
:close-on-click-modal=
"false"
>
</el-dialog>
-->
<div
v-if=
"digitalPersonShow"
class=
"draggable-box"
:style=
"
{ left: pos.x + 'px', top: pos.y + 'px' }"
>
<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>
...
...
@@ -112,11 +89,12 @@
<
script
setup
>
// import { BubbleList, Sender } from 'vue-element-plus-x';
import
{
ref
,
onUnmounted
,
watch
,
onBeforeMount
,
onDeactivated
,
onMounted
}
from
'vue'
;
import
{
ref
,
onUnmounted
,
watch
,
onBeforeMount
,
onDeactivated
,
onMounted
}
from
'vue'
;
import
local
from
'@/utils/local.js'
import
screenConfige
from
'./component/screenConfigeDialog.vue'
import
{
useRouter
}
from
'vue-router'
;
import
useAppStore
from
'@/store/module/app'
import
{
getRegionPanel
,
getSignalSitePanel
,
getGridPanel
}
from
"@/api/Zodiac"
;
import
errorDialog
from
'@/pages/lefts/component/errorDialog.vue'
...
...
@@ -126,16 +104,6 @@ const useAppStoreInstance = useAppStore()
// 在 setup 中
const
router
=
useRouter
();
const
senderRef
=
ref
();
const
senderValue
=
ref
(
''
);
// 数字人显示状态
const
digitalPersonShow
=
ref
(
false
);
// 实时更新时间
...
...
@@ -157,12 +125,12 @@ watch(digitalPersonShow, (newValue) => {
const
handleScreenConfigeClose
=
()
=>
{
screenConfigeDialogVisible
.
value
=
false
;
if
(
window
.
ue5
)
{
window
.
ue5
(
"callBackAllDialogFn"
,
String
(
JSON
.
stringify
({
type
:
"LargeScreenConfigurationDialog"
,
status
:
"close"
})));
}
if
(
window
.
ue5
)
{
window
.
ue5
(
"callBackAllDialogFn"
,
String
(
JSON
.
stringify
({
type
:
"LargeScreenConfigurationDialog"
,
status
:
"close"
})));
}
};
// 格式化日期时间显示
const
formatDateTime
=
()
=>
{
...
...
@@ -173,7 +141,7 @@ const formatDateTime = () => {
const
hours
=
String
(
now
.
getHours
()).
padStart
(
2
,
'0'
);
const
minutes
=
String
(
now
.
getMinutes
()).
padStart
(
2
,
'0'
);
const
seconds
=
String
(
now
.
getSeconds
()).
padStart
(
2
,
'0'
);
return
`
${
year
}
-
${
month
}
-
${
day
}
${
hours
}
:
${
minutes
}
:
${
seconds
}
`
;
};
...
...
@@ -183,45 +151,17 @@ const handleImageError = (e) => {
e
.
target
.
style
.
display
=
'none'
;
};
// try {
// // 确保对象结构存在
// if (typeof window.ue5 !== 'object' || window.ue5 === null) {
// window.ue5 = {};
// }
// if (typeof window.ue5.interface !== 'object' || window.ue5.interface === null) {
// window.ue5.interface = {};
// }
// window.ue5.interface.emitUIInteraction = (res) => {
// //console.log("收到UE交互:", res.name);
// try {
// const resData = JSON.parse(res.data);
// //console.log("Received from UE:", resData);
// if (resData.locationReplace === true) {
// location.replace('/subsystem');
// }
// if (resData.locationReplace === false) {
// location.replace('/');
// }
// } catch (parseError) {
// console.error("Error parsing JSON:", parseError);
// }
// };
// } catch (initError) {
// console.error("Failed to initialize ue5 interface:", initError);
// }
const
toSubSystemFlag
=
ref
(
false
);
const
handletoLinkClick
=
()
=>
{
try
{
try
{
if
(
toSubSystemFlag
.
value
)
{
// location.replace('/subsystem');
router
.
push
(
'/'
);
//console.log("1111111111111111111111111",useAppStoreInstance.isSourceLegendShow);
useAppStoreInstance
.
setGlobalisFromTosub
(
true
);
useAppStoreInstance
.
setislegendShow
(
useAppStoreInstance
.
isSourceLegendShow
?
true
:
false
);
useAppStoreInstance
.
setislegendShow
(
useAppStoreInstance
.
isSourceLegendShow
?
true
:
false
);
//console.log("11111111111111111111111112",useAppStoreInstance.islegendShow);
useAppStoreInstance
.
setiscontrolPanelShow
(
true
);
useAppStoreInstance
.
setGlobalSubsystemSelectedTimeRange
([]);
...
...
@@ -232,8 +172,8 @@ const handletoLinkClick = () => {
// useAppStoreInstance.setGlobalisFromTosub(true);
// useAppStoreInstance.setglobalSatelliteSearchID('4096');
if
(
!
useAppStoreInstance
.
islegendShow
)
{
useAppStoreInstance
.
setislegendShow
(
true
);
}
useAppStoreInstance
.
setislegendShow
(
true
);
}
router
.
push
(
{
name
:
'subsystem'
,
...
...
@@ -254,104 +194,46 @@ const handletoLinkClick = () => {
};
const
handleCompanyClick
=
()
=>
{
// 可以添加点击事件逻辑
// //console.log('大屏配置按钮点击');
screenConfigeDialogVisible
.
value
=
!
screenConfigeDialogVisible
.
value
;
if
(
window
.
ue5
)
{
window
.
ue5
(
"callBackAllDialogFn"
,
String
(
JSON
.
stringify
({
type
:
"LargeScreenConfigurationDialog"
,
status
:
"open"
})));
}
if
(
window
.
ue5
)
{
window
.
ue5
(
"callBackAllDialogFn"
,
String
(
JSON
.
stringify
({
type
:
"LargeScreenConfigurationDialog"
,
status
:
"open"
})));
}
};
// 组件生命周期管理
let
updateTimer
;
onBeforeMount
(()
=>
{
digitalPersonShow
.
value
=
local
.
local
.
get
(
'digitalPersonShow'
)
===
'true'
;
onBeforeMount
(()
=>
{
digitalPersonShow
.
value
=
local
.
local
.
get
(
'digitalPersonShow'
)
===
'true'
;
// 初始化时间
currentTime
.
value
=
formatDateTime
();
currentTime
.
value
=
formatDateTime
();
// 每秒更新一次时间
updateTimer
=
setInterval
(()
=>
{
currentTime
.
value
=
formatDateTime
();
},
1000
);
});
// const handleUEMessage = () => {
// //console.log("我是handleUEMessage里面的window",window);
// window.emitUIInteraction = (res) => {
// // //console.log('Received from UE:', data);
// //console.log("我是handleUEMessage,收到UE交互:", res);
// try {
// const resData = JSON.parse(res.data);
// if (window.ue5) {
// window.ue5("callBackTimeFn", String(JSON.stringify({
// taskCode: String("从UE里面传输的数据",resData,res),
// })))
// }
// //console.log("handleUEMessage,Received from UE:", resData);
// if (resData.locationReplace === true) {
// router.push('/subsystem');
// }
// if (resData.locationReplace === false) {
// router.push('/');
// }
// } catch (parseError) {
// console.error("Error parsing JSON:", parseError);
// }
// };
// };
// const handleUEMessage1 = () => {
// //console.log("我是handleUEMessage1里面的window",window);
// window.emitUIInteraction = (res) => {
// // //console.log('Received from UE:', data);
// //console.log("我是handleUEMessage1,收到UE交互:", res);
// try {
// const resData = JSON.parse(res.data);
// if (window.ue5) {
// window.ue5("callBackTimeFn", String(JSON.stringify({
// taskCode: String("handleUEMessage1从UE里面传输的数据",resData,res),
// })))
// }
// //console.log("Received from UE:", resData);
// if (resData.locationReplace === true) {
// router.push('/subsystem');
// }
// if (resData.locationReplace === false) {
// router.push('/');
// }
// } catch (parseError) {
// console.error("Error parsing JSON:", parseError);
// }
// };
// };
onMounted
(()
=>
{
onMounted
(
async
()
=>
{
// window.addEventListener('message', handleUEMessage);
// window.addEventListener('emitUIInteraction', handleUEMessage1);
window
.
ue
.
interface
.
emitUIInteraction
=
(
res
)
=>
{
// if (window.ue5) {
// window.ue5("callBackTimeFn", `ue传递给vue的数据111111111111111111:${JSON.stringify(res)},${JSON.stringify(res.locationReplace)}`)
// }
const
resData
=
JSON
.
parse
(
res
);
const
resData
=
JSON
.
parse
(
res
);
// 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'
);
if
(
resData
.
locationReplace
===
'true'
)
{
useAppStoreInstance
.
setiscontrolPanelShow
(
false
);
useAppStoreInstance
.
setglobalSatelliteSearchID
(
resData
.
SatelliteSearchID
||
'4097'
);
if
(
!
useAppStoreInstance
.
islegendShow
)
{
useAppStoreInstance
.
setislegendShow
(
true
);
}
useAppStoreInstance
.
setislegendShow
(
true
);
}
router
.
push
(
{
name
:
'subsystem'
,
...
...
@@ -363,24 +245,24 @@ onMounted(() => {
}
);
toSubSystemFlag
.
value
=
!
toSubSystemFlag
.
value
;
}
if
(
resData
.
locationReplace
===
'false'
)
{
router
.
push
(
'/'
);
//console.log("1111111111111111111111111",useAppStoreInstance.isSourceLegendShow);
useAppStoreInstance
.
setGlobalisFromTosub
(
true
);
useAppStoreInstance
.
setislegendShow
(
useAppStoreInstance
.
isSourceLegendShow
?
true
:
false
);
//console.log("11111111111111111111111112",useAppStoreInstance.islegendShow);
useAppStoreInstance
.
setiscontrolPanelShow
(
true
);
useAppStoreInstance
.
setGlobalSubsystemSelectedTimeRange
([]);
}
}
if
(
resData
.
locationReplace
===
'false'
)
{
router
.
push
(
'/'
);
//console.log("1111111111111111111111111",useAppStoreInstance.isSourceLegendShow);
useAppStoreInstance
.
setGlobalisFromTosub
(
true
);
useAppStoreInstance
.
setislegendShow
(
useAppStoreInstance
.
isSourceLegendShow
?
true
:
false
);
//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);
// if (resData.locationReplace === true) {
// router.push('/subsystem');
// }
...
...
@@ -394,7 +276,10 @@ onMounted(() => {
await
initChartData
();
});
...
...
@@ -435,6 +320,14 @@ const stopDrag = () => {
};
const
initChartData
=
async
()
=>
{
// console.log("初始化数据",useAppStoreInstance);
const
[
res1
,
res2
,
res3
]
=
await
Promise
.
all
([
getRegionPanel
(),
getSignalSitePanel
(),
getGridPanel
()])
useAppStoreInstance
.
regionPanelData
=
res1
.
code
==
200
?
res1
.
data
.
map
(
item
=>
({
value
:
item
,
label
:
item
})):[]
useAppStoreInstance
.
signalSitePanelData
=
res2
.
code
==
200
?
res2
.
data
.
map
((
item
)
=>
({
value
:
item
.
siteId
,
label
:
item
.
siteName
})):[]
useAppStoreInstance
.
gridPanelData
=
res3
.
code
==
200
?
res3
.
data
.
map
(
item
=>
({
value
:
item
.
gridCode
,
label
:
item
.
gridName
})):[]
};
...
...
@@ -443,9 +336,9 @@ const stopDrag = () => {
</
script
>
<
style
scoped
>
*
{
margin
:
0
;
padding
:
0
;
*
{
margin
:
0
;
padding
:
0
;
}
...
...
@@ -470,7 +363,8 @@ const stopDrag = () => {
text-align
:
center
;
font-weight
:
bold
;
flex-shrink
:
0
;
user-select
:
none
;
/* 防止拖拽时选中文本 */
user-select
:
none
;
/* 防止拖拽时选中文本 */
}
...
...
@@ -487,7 +381,7 @@ const stopDrag = () => {
min-width
:
750px
;
overflow
:
hidden
;
/* height: 250px; */
/* box-shadow: 0 2px 15px rgba(0, 15, 45, 0.5); */
}
...
...
@@ -514,11 +408,12 @@ const stopDrag = () => {
height
:
55px
;
max-width
:
1920px
;
margin
:
0
auto
;
background
:
url("@/assets/images/headers/header_bg.png")
;
background
:
url("@/assets/images/headers/header_bg.png")
;
/* padding: 0.6rem 0; */
position
:
relative
;
overflow
:
hidden
;
background-size
:
100%
160%
;
/* 或者 cover/auto */
background-size
:
100%
160%
;
/* 或者 cover/auto */
background-repeat
:
no-repeat
;
background-position
:
center
;
...
...
@@ -551,7 +446,7 @@ const stopDrag = () => {
}
.weather-info
.text
::after
{
content
:
'|'
;
margin-left
:
1.5rem
;
opacity
:
0.6
;
...
...
@@ -608,13 +503,16 @@ const stopDrag = () => {
padding-top
:
10px
;
/* background-color: #d10e0e; */
}
.timeColor
{
.timeColor
{
color
:
#ddd
;
}
.rightTime
{
.rightTime
{
border-left
:
1px
solid
#ddd
;
height
:
10px
;
}
.control-item
{
display
:
flex
;
align-items
:
center
;
...
...
@@ -684,7 +582,7 @@ const stopDrag = () => {
.platform-title
{
font-size
:
1.15rem
;
}
.navbar-left
{
gap
:
1.5rem
;
}
...
...
@@ -694,7 +592,7 @@ const stopDrag = () => {
.platform-title
{
font-size
:
1.05rem
;
}
.status-item
{
font-size
:
0.85rem
;
gap
:
0.4rem
;
...
...
@@ -702,23 +600,26 @@ const stopDrag = () => {
}
@media
(
max-width
:
992px
)
{
/* .navbar-left {
display: none;
} */
.company-item
{
.company-item
{
display
:
none
;
}
.digital-person-item
{
.digital-person-item
{
display
:
none
;
}
.navbar-right
{
gap
:
1rem
;
}
.control-item
{
padding
:
0.35rem
0.7rem
;
}
.control-label
{
font-size
:
0.9rem
;
}
...
...
@@ -728,18 +629,18 @@ const stopDrag = () => {
.navbar-content
{
padding
:
0
1.2rem
;
}
.platform-title
{
font-size
:
0.95rem
;
overflow
:
hidden
;
text-overflow
:
ellipsis
;
max-width
:
280px
;
}
.company-item
.control-label
{
display
:
none
;
}
.company-item
{
padding
:
0.35rem
;
}
...
...
@@ -747,14 +648,14 @@ const stopDrag = () => {
@media
(
max-width
:
576px
)
{
.platform-title
{
overflow
:
visible
;
text-overflow
:
unset
;
max-width
:
none
;
font-size
:
0.9rem
;
}
.navbar-content
{
padding
:
0
1rem
;
}
...
...
src/store/module/app.js
浏览文件 @
7a431cb5
...
...
@@ -51,6 +51,11 @@ const useAppStore = defineStore(
globalSubsystemSelectedStartTime
:
[
'Sun Nov 02 2025 00:00:00 GMT+0800 (中国标准时间) '
,
'Tue Nov 04 2025 00:00:00 GMT+0800 (中国标准时间) '
],
globalSubsystemSelectedEndTime
:
'2025-11-04 00:00:00'
,
//暂未使用
globalDisableTimeLine
:
true
,
gridPanelData
:[],
//格网面板
regionPanelData
:[],
//区域面板
signalSitePanelData
:[],
//信关站面板
}),
actions
:
{
...
...
src/utils/request.js
浏览文件 @
7a431cb5
...
...
@@ -26,17 +26,6 @@ const service = axios.create({
// request拦截器
service
.
interceptors
.
request
.
use
(
config
=>
{
//console.log('--------------config', config)
// // 是否需要设置 token
// const isToken = (config.headers || {}).isToken === false
// //console.log('--------------isToken', isToken)
// // 是否需要防止数据重复提交
// const isRepeatSubmit = (config.headers || {}).repeatSubmit === false
// //console.log('--------------isRepeatSubmit', isRepeatSubmit,(config.headers || {}).repeatSubmit,config.headers.repeatSubmit,undefined===false)
// if (getToken() && !isToken) {
// config.headers['token'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
// }
// get请求映射params参数
if
(
config
.
method
===
'get'
&&
config
.
params
)
{
let
url
=
config
.
url
+
'?'
+
tansParams
(
config
.
params
);
url
=
url
.
slice
(
0
,
-
1
);
...
...
编写
预览
Markdown
格式
0%
重试
或
添加新文件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论