提交 10a8f7fe authored 作者: coderBryanFu's avatar coderBryanFu

feat:update

上级 ba702a32
......@@ -41,6 +41,7 @@ const classObject = computed(() => ({
height: 24px;
padding: 0 8px;
line-height: 24px;
width: fit-content;
text-align: center;
font-family: Microsoft YaHei;
font-style: Regular;
......
......@@ -323,10 +323,12 @@ onMounted(() => {
.nav-right {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 21px;
.info-box {
height: 40px;
display: flex;
justify-content: flex-end;
align-items: center;
......
......@@ -33,4 +33,15 @@ const comprehensiveSearchRoutes = [
]
import { useGotoPage } from "../common.js";
export function useGotoComprehensiveSearch() {
const gotoPage = useGotoPage();
return (isNewTabs = true) => gotoPage("/comprehensiveSearch/", {}, isNewTabs)
}
export function useGotoSearchResults() {
const gotoPage = useGotoPage();
return (isNewTabs = true) => gotoPage("/searchResults/", {searchText, areaName}, isNewTabs)
}
export default comprehensiveSearchRoutes
\ No newline at end of file
<template>
<el-row class="wrapper layout-grid-line">
<el-col :span="span">
<pre>
{{
`
import ActionButton from '@/components/base/ActionButton/index.vue'
<ActionButton name="全部选项" type="active" />
<ActionButton name="选项A" type="normal" />
<ActionButton name="选项B" type="normal" />
<ActionButton name="选项C" type="normal" />
`
}}
</pre>
<div class="button-box">
<ActionButton name="全部选项" type="active" />
<ActionButton name="选项A" type="normal" />
<ActionButton name="选项B" type="normal" />
<ActionButton name="选项C" type="normal" />
</div>
</el-col>
</el-row>
</template>
<script setup>
import '@/styles/common.scss'
import ActionButton from '@/components/base/ActionButton/index.vue'
const span = 12
</script>
<style lang="scss" scoped>
.button-box {
display: flex;
margin-left: 20px;
margin-bottom: 10px;
gap: 8px
}
</style>
\ No newline at end of file
<template>
<el-row class="wrapper layout-grid-line">
<el-col :span="span">
<pre>
{{
`
import AreaTag from '@/components/base/AreaTag/index.vue'
<AreaTag tagName="人工智能" />
<AreaTag tagName="生物科技" />
<AreaTag tagName="新一代通信网络" />
<AreaTag tagName="量子科技" />
<AreaTag tagName="新能源" />
`
}}
</pre>
<div class="tag-box">
<AreaTag tagName="人工智能" />
<AreaTag tagName="生物科技" />
<AreaTag tagName="新一代通信网络" />
<AreaTag tagName="量子科技" />
<AreaTag tagName="新能源" />
</div>
</el-col>
</el-row>
</template>
<script setup>
import '@/styles/common.scss'
import AreaTag from '@/components/base/AreaTag/index.vue'
const span = 12
</script>
<style lang="scss" scoped>
.tag-box{
display: flex;
gap: 8px
}
</style>
\ No newline at end of file
......@@ -31,6 +31,12 @@
<el-tab-pane label="预警面板" lazy>
<WarnningPane />
</el-tab-pane>
<el-tab-pane label="领域标签" lazy>
<AreaTag />
</el-tab-pane>
<el-tab-pane label="选项按钮" lazy>
<ActionButton />
</el-tab-pane>
<el-tab-pane label="层级关系图" lazy>
<GraphChart />
</el-tab-pane>
......@@ -59,6 +65,8 @@ import PeoplePage from './People/index.vue';
import WarnningPane from './WarnningPane/index.vue'
import GraphChart from './GraphChart/index.vue'
import GraphTreeChart from './GraphTreeChart/index.vue'
import AreaTag from './AreaTag/index.vue'
import ActionButton from './ActionButton/index.vue'
</script>
<style lang="scss" scoped>
......
......@@ -3,23 +3,14 @@
<div class="content-wrapper">
<div class="policy-monitoring">
<div class="header">
<div
class="section"
v-for="(section, index) in sectionTab"
:key="index"
:style="{
<div class="section" v-for="(section, index) in sectionTab" :key="index" :style="{
width: sections[index].waveBall.length === 2 ? '350px' : '503px',
background: section.background
}"
>
}">
<img class="section-title" :src="section.title" />
<div class="stats">
<div
class="ball-item"
v-for="(value, idx) in sections[index].waveBall"
:key="idx"
@click="highLight(value.type)"
>
<div class="ball-item" v-for="(value, idx) in sections[index].waveBall" :key="idx"
@click="highLight(value.type)">
<WaveBall :percent="value.percent" :data="value" :color="section.waterColor" :size="128" />
<div class="text-box">
<div class="waveBall-text">
......@@ -29,16 +20,10 @@
</div>
</div>
</div>
<div
class="bottm-box"
:style="sections[index].waveBall.length === 2 ? 'width: 350px' : 'width:503px'"
@click="handleClickCardBottomInfo(cardBottomInfo[index])"
>
<div class="bottm-box" :style="sections[index].waveBall.length === 2 ? 'width: 350px' : 'width:503px'"
@click="handleClickCardBottomInfo(cardBottomInfo[index])">
<img src="./icon/title-icon-1.png" />
<div
class="bottm-box-text"
:style="sections[index].waveBall.length === 2 ? 'width: 225px' : 'width:378px'"
>
<div class="bottm-box-text" :style="sections[index].waveBall.length === 2 ? 'width: 225px' : 'width:378px'">
{{ cardBottomInfo[index]?.title || "暂无新增数据" }}
</div>
<div style="width: 115px; color: #ffffff">
......@@ -58,24 +43,16 @@
<div style="display: flex">
<!-- 风险信号列表 -->
<div class="risk-signals" ref="riskSignalsRef">
<div
class="risk-signals-item"
v-for="(item, index) in warningList"
:key="index"
@mouseenter="onMouseEnter(item, index)"
@mouseleave="onMouseLeave"
:class="['risk-signals-item', { 'risk-signals-item-hightLight': riskSignalActiveIndex === index }]"
>
<div
class="item-left"
:class="{
<div class="risk-signals-item" v-for="(item, index) in warningList" :key="index"
@mouseenter="onMouseEnter(item, index)" @mouseleave="onMouseLeave"
:class="['risk-signals-item', { 'risk-signals-item-hightLight': riskSignalActiveIndex === index }]">
<div class="item-left" :class="{
'item-status-1': item.signalLevel === '特别重大',
'item-status-2': item.signalLevel === '重大风险',
'item-status-3': item.signalLevel === '较大风险',
'item-status-4': item.signalLevel === '一般风险',
'item-status-5': item.signalLevel === '低风险'
}"
>
}">
{{ item.signalLevel ? item.signalLevel : "一般风险" }}
</div>
<div class="item-right">
......@@ -87,31 +64,16 @@
</div>
</div>
<div class="news">
<div
class="box1-left"
@click="handleSwithCurNews('left')"
@mouseenter="handleInBtn"
@mouseleave="handleOutBtn"
>
<div class="box1-left" @click="handleSwithCurNews('left')" @mouseenter="handleInBtn"
@mouseleave="handleOutBtn">
<img :src="leftBtn" alt="" />
</div>
<div
class="box1-right"
@click="handleSwithCurNews('right')"
@mouseenter="handleInBtn"
@mouseleave="handleOutBtn"
>
<div class="box1-right" @click="handleSwithCurNews('right')" @mouseenter="handleInBtn"
@mouseleave="handleOutBtn">
<img :src="rightBtn" alt="" />
</div>
<el-carousel
ref="carouselRef"
style="height: 443px; width: 664px"
:autoplay="true"
:interval="30000"
arrow="never"
indicator-position="none"
@change="handleCarouselChange"
>
<el-carousel ref="carouselRef" style="height: 443px; width: 664px" :autoplay="true" :interval="30000"
arrow="never" indicator-position="none" @change="handleCarouselChange">
<el-carousel-item v-for="(News, NewsIndex) in filteredHotNewsList" :key="NewsIndex">
<div class="carousel-item" @click="toDetaile(News.hotspotID, News.hotspotType)">
<div class="carousel-title">
......@@ -128,9 +90,7 @@
style="width: 96px; height: 96px"
/> -->
</div>
<div
style="/* 矩形 351 */ width: 664px; height: 1px; background: rgba(234, 236, 238, 1)"
></div>
<div style="/* 矩形 351 */ width: 664px; height: 1px; background: rgba(234, 236, 238, 1)"></div>
<div class="news-carousel-content">{{ News.hotspotDesc }}</div>
<div class="carousel-bottom">
......@@ -1147,6 +1107,7 @@ onUnmounted(() => {
align-items: center;
position: relative;
position: relative;
.red-dot {
position: absolute;
right: -15px;
......@@ -1234,8 +1195,8 @@ onUnmounted(() => {
}
.item-status-2 {
color: var(--color-orange-100) !important;
background: var(--color-orange-10) !important;
color: #FA8C16 !important;
background: #FFF7E6 !important;
}
.item-status-3 {
......@@ -1244,8 +1205,8 @@ onUnmounted(() => {
}
.item-status-4 {
color: var(--color-green-100) !important;
background: var(--color-green-10) !important;
color: #52C41A !important;
background: #F6FFED !important;
}
.item-status-5 {
......@@ -1287,6 +1248,7 @@ onUnmounted(() => {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
&:hover {
color: var(--color-main-active);
font-weight: bold;
......@@ -1411,6 +1373,7 @@ onUnmounted(() => {
width: 24px;
height: 48px;
cursor: pointer;
img {
width: 100%;
height: 100%;
......@@ -1424,6 +1387,7 @@ onUnmounted(() => {
width: 24px;
height: 48px;
cursor: pointer;
img {
width: 100%;
height: 100%;
......@@ -1449,6 +1413,7 @@ onUnmounted(() => {
text-align: justify;
display: flex;
justify-content: space-between;
.title-text {
/* 美国白宫发布关于进一步延长TikTok执法宽限期的行政令 */
width: 660px;
......@@ -1514,6 +1479,7 @@ onUnmounted(() => {
display: flex;
gap: 8px;
justify-content: flex-end;
.tag {
/* 数据展示/Tag标签/亮色/绿 */
height: 24px;
......@@ -1539,6 +1505,7 @@ onUnmounted(() => {
}
}
}
.carousel-footer {
margin-top: 10px;
width: 664px;
......@@ -1552,8 +1519,10 @@ onUnmounted(() => {
align-items: center;
justify-content: space-between;
cursor: pointer;
.footer-left {
display: flex;
.type {
color: var(--color-main-active);
font-family: Source Han Sans CN;
......@@ -1564,6 +1533,7 @@ onUnmounted(() => {
letter-spacing: 0px;
text-align: left;
}
.text {
width: 500px;
color: var(--color-main-active);
......@@ -1579,9 +1549,11 @@ onUnmounted(() => {
white-space: nowrap;
}
}
.footer-right {
width: 12px;
height: 11px;
img {
width: 100%;
height: 100%;
......
......@@ -390,7 +390,7 @@
</template>
<script setup>
import { onMounted, ref } from "vue";
import { onMounted, ref, nextTick } from "vue";
import LeftBtn from "@/components/base/PageBtn/LeftBtn.vue";
import RightBtn from "@/components/base/PageBtn/RightBtn.vue";
......@@ -426,6 +426,29 @@ import {
import { getRiskSignal, getNews, getRemarks } from "@/api/common/index";
import { ElMessage } from "element-plus";
const handleToPosi = id => {
const element = document.getElementById(id);
if (element && containerRef.value) {
// // 1. 如果是从完整搜索框跳转,先强制切换状态稳定布局
// if (!isShow.value) {
// isShow.value = true;
// }
// 2. 使用 nextTick 等待 DOM 布局(如高度切换)完成后再进行坐标计算
nextTick(() => {
const containerRect = containerRef.value.getBoundingClientRect();
const elementRect = element.getBoundingClientRect();
// 使用 getBoundingClientRect 计算元素相对于容器顶部的绝对距离
const top = elementRect.top - containerRect.top + containerRef.value.scrollTop;
containerRef.value.scrollTo({
top: top,
behavior: "smooth"
});
});
}
};
const formatDate = (dateStr, dateType) => {
if (!dateStr) return "";
const date = new Date(dateStr);
......@@ -1052,6 +1075,7 @@ const pageSize = ref(10);
const currentPage = ref(1);
const totalDiscussNum = ref(0);
const handleCurrentChange = page => {
handleToPosi("position4")
currentPage.value = page;
handleGetSurveyList();
};
......
......@@ -118,9 +118,9 @@
</AnalysisBox>
</div>
</div>
<div class="graph-box" id="graphChart">
<!-- <div class="graph-box" id="graphChart">
</div>
</div> -->
</div>
</template>
<script setup>
......
......@@ -86,7 +86,7 @@ export default defineConfig({
'/aiAnalysis': {
target: 'http://8.140.26.4:15000/',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/temporarySearch/, '')
rewrite: (path) => path.replace(/^\/aiAnalysis/, '')
},
'^/bill(?:/|$)': {
target: 'http://8.140.26.4:9085/',
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论