提交 0699980b authored 作者: 张烨's avatar 张烨

Merge remote-tracking branch 'origin/pre' into zy-dev

流水线 #441 已通过 于阶段
in 1 分 39 秒
......@@ -5,6 +5,9 @@
justify-content: center;
overflow: hidden !important;
z-index: 20000 !important;
background-color: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(30px);
-webkit-backdrop-filter: blur(30px);
}
.risk-signal-detail-modal .el-overlay-dialog {
......@@ -218,6 +221,7 @@
.risk-signal-detail-dialog .header-icon {
width: 32px;
height: 32px;
margin-right: 6px;
}
.risk-signal-detail-dialog .header-icon img {
......
<template>
<div class="normal-box" :class="{ 'box-glow': isBorderActive }">
<div class="content-box">
<slot></slot>
</div>
</div>
</template>
<script setup>
const props = defineProps({
isBorderActive: {
type: Boolean,
default: false,
}
})
</script>
<style lang="scss" scoped>
.normal-box {
position: relative;
width: 100%;
height: 100%;
border-radius: 16px;
// border: 2px solid var(--bg-black-5);
background: var(--color-primary-2);
.content-box {
position: absolute;
z-index: 2;
top: 10px;
left: 10px;
width: calc(100% - 20px);
height: calc(100% - 20px);
}
}
/* 霓虹发光效果变体 */
.box-glow {
width: 100%;
height: 100%;
position: relative;
border-radius: 16px;
// background: #1a1a1a;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
background: var(--bg-black-5);
// border: 2px solid transparent !important;
border: none;
.content-box {
position: absolute;
z-index: 2;
top: 10px;
left: 10px;
width: calc(100% - 20px);
height: calc(100% - 20px);
}
}
.box-glow::before {
content: '';
position: absolute;
width: 150%;
height: 250%;
background: conic-gradient(from 0deg,
#85B2FF 0deg 180deg,
#B685FF 180deg 360deg);
animation: rotate 3s linear infinite;
filter: blur(10px);
}
.box-glow::after {
content: '';
position: absolute;
inset: 3px;
background: #fff;
border-radius: 12px;
}
// .glow-layer {
// position: absolute;
// inset: -2px;
// background: conic-gradient(from 0deg,
// #85B2FF 0deg 180deg,
// #B685FF 180deg 360deg);
// animation: rotate 3s linear infinite;
// filter: blur(20px);
// opacity: 0.5;
// }
</style>
......@@ -152,9 +152,9 @@ const stopScroll = () => {
}
onMounted(() => {
if (props.messageList.length > 3) {
// if (props.messageList.length > 3) {
startScroll()
}
// }
})
......
<template>
<div class="module-header-wrapper">
<div class="nav-content">
<div class="nav-content" :class="{ 'nav-content-library': isShowDataLibrary }">
<div class="nav-left" :class="{ 'flex-start': isShowSearchBar }">
<div class="icon">
<img v-show="!isShowSearchBar" src="@/assets/icons/overview/logo.png" alt="" />
......@@ -85,6 +85,7 @@ import { useRouter } from "vue-router";
import { useRoute } from "vue-router";
import { getPersonType } from "@/api/common/index";
import request, { removeToken } from "@/api/request.js";
import { broadcastAuthLogout } from "@/utils/authCrossTabLogout.js";
import SearchBar from "@/components/layout/SearchBar.vue";
import Menu1 from "@/assets/icons/overview/menu1.png";
......@@ -478,6 +479,7 @@ const handleUserCommand = async (command) => {
} catch {
// ignore
}
broadcastAuthLogout();
try {
window.sessionStorage.removeItem("auth_token");
} catch {
......@@ -487,6 +489,11 @@ const handleUserCommand = async (command) => {
}
};
const isShowDataLibrary = computed(() => {
const isShowLibrary = route.fullPath.includes('/dataLibrary')
return isShowLibrary
})
onMounted(() => {
handleGetPersonType();
handleGetSsoUserInfo();
......@@ -504,6 +511,11 @@ onMounted(() => {
background: linear-gradient(180deg, rgba(246, 250, 255, 0.8) 0%, rgba(255, 255, 255, 0.8) 100%);
padding: 12px 0;
.nav-content-library {
width: calc(100% - 24px - 37px) !important;
margin: 0 37px 0 24px !important;
}
.nav-content {
width: 1600px;
margin: 0 auto;
......
import { createRouter, createWebHistory } from "vue-router";
import { setToken, removeToken, getToken } from "@/api/request.js";
import { AUTH_LOGOUT_CHANNEL } from "@/utils/authCrossTabLogout.js";
/** localStorage:跨标签页记录当前前端的 bootId(与 vite define 的 __APP_BOOT_ID__ 对齐) */
const VITE_BOOT_STORAGE_KEY = "app_vite_boot_id";
......@@ -241,5 +242,59 @@ router.beforeEach((to, from, next) => {
next();
});
/**
* 在其它标签页/窗口退出登录时,本页立即跳转登录页(不依赖用户再点一次路由)。
* 1)storage:监听同源其它文档对 `force_login` 的写入
* 2)BroadcastChannel:与登出时的 `broadcastAuthLogout()` 配对,减少仅依赖 storage 的时序问题
*/
function installCrossTabLogoutRedirect() {
if (typeof window === "undefined") {
return;
}
const redirectToLoginAfterRemoteLogout = () => {
try {
window.localStorage.setItem(FORCE_LOGIN_KEY, "1");
} catch {
// ignore
}
try {
removeToken();
window.localStorage.removeItem("auth_token");
window.sessionStorage.removeItem("auth_token");
} catch {
// ignore
}
try {
if (router.currentRoute.value.path !== "/login") {
router.replace({ path: "/login", replace: true }).catch(() => {});
}
} catch {
// ignore
}
};
window.addEventListener("storage", (e) => {
if (e.key !== FORCE_LOGIN_KEY || e.newValue !== "1") {
return;
}
redirectToLoginAfterRemoteLogout();
});
try {
if (typeof BroadcastChannel !== "undefined") {
const authBroadcast = new BroadcastChannel(AUTH_LOGOUT_CHANNEL);
authBroadcast.addEventListener("message", (ev) => {
if (ev?.data?.type === "force_logout") {
redirectToLoginAfterRemoteLogout();
}
});
}
} catch {
// ignore
}
}
installCrossTabLogoutRedirect();
export default router;
......@@ -12,7 +12,7 @@ const useTagsViewStore = defineStore('tags-view', {
this.addCachedView(view)
},
addVisitedView(view) {
this.visitedViews = localStorage.getItem('visitedViews') && JSON.parse(localStorage.getItem('visitedViews')) || []
this.visitedViews = sessionStorage.getItem('visitedViews') && JSON.parse(sessionStorage.getItem('visitedViews')) || []
this.visitedViews.forEach(item => {
item.active = false
})
......@@ -24,7 +24,7 @@ const useTagsViewStore = defineStore('tags-view', {
...view,
title: view.meta?.title || '未命名'
})
localStorage.setItem('visitedViews', JSON.stringify(this.visitedViews))
sessionStorage.setItem('visitedViews', JSON.stringify(this.visitedViews))
} else {
this.visitedViews.forEach(v => {
if (v.path === view.path) {
......@@ -50,7 +50,7 @@ const useTagsViewStore = defineStore('tags-view', {
if (index !== -1) {
this.visitedViews.splice(index, 1)
}
localStorage.setItem('visitedViews', JSON.stringify(this.visitedViews))
sessionStorage.setItem('visitedViews', JSON.stringify(this.visitedViews))
resolve([...this.visitedViews])
})
},
......@@ -66,7 +66,7 @@ const useTagsViewStore = defineStore('tags-view', {
},
loadVisitedViewFromLocalStorage() {
const saved = localStorage.getItem('visitedViews')
const saved = sessionStorage.getItem('visitedViews')
if (saved) {
this.items = JSON.parse(saved)
}
......
<template>
<el-row class="wrapper layout-grid-line">
<el-col :span="span">
<pre>
{{
`
import WorkingBox from '@/components/base/WorkingBox/index.vue'
<div class="outer-box">
<WorkingBox>
<div class="content">我是内容区域</div>
</WorkingBox>
</div>
`
}}
</pre>
<div class="outer-box">
<WorkingBox :is-border-active="isBorderActive">
<div class="content">我是内容区域</div>
</WorkingBox>
<div class="btn-box">
<el-button type="primary" @click="handleChangeBorderActiveStatus(true)">激活</el-button>
<el-button type="plain" @click="handleChangeBorderActiveStatus(false)">恢复</el-button>
</div>
</div>
</el-col>
</el-row>
</template>
<script setup>
import { ref } from 'vue'
import '@/styles/common.scss'
import WorkingBox from '@/components/base/WorkingBox/index.vue'
const span = 12
const isBorderActive = ref(false)
const handleChangeBorderActiveStatus = (isActive) => {
isBorderActive.value = isActive
}
</script>
<style lang="scss" scoped>
.outer-box {
width: 600px;
height: 300px;
margin: 50px 20px;
.content {
width: 100%;
height: 100%;
background: #e3e3e3;
}
.btn-box{
margin-top: 10px;
}
}
</style>
\ No newline at end of file
......@@ -70,6 +70,9 @@
<el-tab-pane label="引力关系图" lazy>
<RelationForceChart />
</el-tab-pane>
<el-tab-pane label="激活工作框" lazy>
<WorkingBox />
</el-tab-pane>
</el-tabs>
</div>
</el-space>
......@@ -103,6 +106,7 @@ import AiSummary from './Ai/AiSummary/index.vue'
import RelationChart from './RelationChart/index.vue'
import RelationCenterChart from './RelationCenterChart/index.vue'
import RelationForceChart from './RelationForceChart/index.vue'
import WorkingBox from './WorkingBox/index.vue'
</script>
<style lang="scss" scoped>
......
/** 与 `router/index.js` 中 BroadcastChannel 监听使用同一频道名 */
export const AUTH_LOGOUT_CHANNEL = "risk_monitor_auth";
/**
* 通知同源其它标签页/窗口:用户已退出,应立即进入登录页。
* 与 localStorage `force_login=1` 配合;发起退出的标签页在写入后调用一次即可。
*/
export function broadcastAuthLogout() {
try {
if (typeof BroadcastChannel === "undefined") {
return;
}
const ch = new BroadcastChannel(AUTH_LOGOUT_CHANNEL);
ch.postMessage({ type: "force_logout" });
ch.close();
} catch {
// ignore
}
}
......@@ -42,7 +42,7 @@
<div class="chart-main-box" v-if="isShowChart">
<div class="info-box">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -77,7 +77,8 @@
<div class="data-main-box" v-else>
<div class="data-main-box-header">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
<!-- <img src="@/views/dataLibrary/assets/icons/data-active.svg" alt=""> -->
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -106,7 +107,7 @@
</el-select>
</div>
<div class="header-right-item3 item3">
<el-select v-model="isSort" placeholder="发布时间" style="width: 166px" @change="handlePxChange">
<el-select v-model="isSort" placeholder="提案时间" style="width: 166px" @change="handlePxChange">
<template #prefix>
<div style="display: flex; align-items: center; height: 100%">
<img src="../../assets/icons/desc-icon.svg" style="width: 14px; height: 14px" />
......@@ -162,6 +163,7 @@ import PieChart from '../../components/PieChart/index.vue'
import BarChart from '../../components/BarChart/index.vue'
import RaderChart from '../../components/RadarChart/idnex.vue'
import SelectBox from '../../components/SelectBox/index.vue'
import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
import { useRoute } from "vue-router";
import router from '@/router'
......@@ -286,9 +288,9 @@ const handleClickDemensionItem = (val) => {
curDemension.value = val.name
timer2.value = setTimeout(() => {
activeChart.value = val.chartTypeList[0]
if (curDemension.value === '发布时间' && selectedTime.value === '按年度统计') {
if (curDemension.value === '提案时间' && selectedTime.value === '按年度统计') {
curChartData.value = val.yearData
} else if (curDemension.value === '发布时间' && selectedTime.value === '按季度统计') {
} else if (curDemension.value === '提案时间' && selectedTime.value === '按季度统计') {
curChartData.value = val.quatarData
} else {
curChartData.value = val.data
......@@ -823,11 +825,11 @@ const tableData = ref([
const releaseTimeList = ref([
{
label: "按发布时间倒序",
label: "按提案时间倒序",
value: true
},
{
label: "按发布时间升序",
label: "按提案时间升序",
value: false
}
]);
......@@ -1288,24 +1290,26 @@ onBeforeUnmount(() => {
}
.chart-main-box {
width: 1568px;
height: 809px;
margin: 0 auto;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
border-radius: 10px;
.info-box {
margin: 0 auto;
width: 1568px;
margin-top: 16px;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.num-box {
......@@ -1316,14 +1320,13 @@ onBeforeUnmount(() => {
.content-box {
margin: 0 auto;
margin-top: 16px;
width: 1568px;
height: 766px;
border-radius: 10px;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
width: 1520px;
height: 726px;
border: none;
.content-header {
margin: 16px 24px;
margin: 16px 0;
width: 1520px;
height: 28px;
}
......@@ -1353,15 +1356,9 @@ onBeforeUnmount(() => {
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
border: none;
height: 28px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.num-box {
......
......@@ -88,7 +88,7 @@ const chartItemList = computed(() => {
let arr = []
props.chartTypeList.forEach(item => {
defaultChartTypeList.forEach(val => {
if (val.name === item) {
if (val.name === item || val.name === item.name) {
arr.push(val)
}
})
......
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none">
<rect id="icon_图表1 1" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
<path id="矢量 461" d="M11.9004 5.50781C11.4904 5.50781 11.1504 5.84781 11.1504 6.25781L11.1504 14.2578C11.1504 14.6678 11.4904 15.0078 11.9004 15.0078C12.3104 15.0078 12.6504 14.6678 12.6504 14.2578L12.6504 6.25781C12.6504 5.84781 12.3104 5.50781 11.9004 5.50781ZM8.00039 2.50781C7.59039 2.50781 7.25039 2.84781 7.25039 3.25781L7.25039 14.2578C7.25039 14.6678 7.59039 15.0078 8.00039 15.0078C8.41039 15.0078 8.75039 14.6678 8.75039 14.2578L8.75039 3.25781C8.75039 2.84781 8.41039 2.50781 8.00039 2.50781L8.00039 2.50781ZM3.90039 7.50781C3.49039 7.50781 3.15039 7.84781 3.15039 8.25781L3.15039 14.2578C3.15039 14.6678 3.49039 15.0078 3.90039 15.0078C4.31039 15.0078 4.65039 14.6678 4.65039 14.2578L4.65039 8.25781C4.65039 7.84781 4.31039 7.50781 3.90039 7.50781Z" fill="rgb(255,255,255)" fill-rule="nonzero" />
</svg>
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none">
<rect id="icon_图表1 1" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
<path id="矢量 461" d="M11.9004 5.50781C11.4904 5.50781 11.1504 5.84781 11.1504 6.25781L11.1504 14.2578C11.1504 14.6678 11.4904 15.0078 11.9004 15.0078C12.3104 15.0078 12.6504 14.6678 12.6504 14.2578L12.6504 6.25781C12.6504 5.84781 12.3104 5.50781 11.9004 5.50781ZM8.00039 2.50781C7.59039 2.50781 7.25039 2.84781 7.25039 3.25781L7.25039 14.2578C7.25039 14.6678 7.59039 15.0078 8.00039 15.0078C8.41039 15.0078 8.75039 14.6678 8.75039 14.2578L8.75039 3.25781C8.75039 2.84781 8.41039 2.50781 8.00039 2.50781L8.00039 2.50781ZM3.90039 7.50781C3.49039 7.50781 3.15039 7.84781 3.15039 8.25781L3.15039 14.2578C3.15039 14.6678 3.49039 15.0078 3.90039 15.0078C4.31039 15.0078 4.65039 14.6678 4.65039 14.2578L4.65039 8.25781C4.65039 7.84781 4.31039 7.50781 3.90039 7.50781Z" fill="rgb(5,95,194)" fill-rule="nonzero" />
</svg>
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none">
<rect id="表格(1) 1" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
<path id="矢量 462" d="M13.1 3L2.9 3C2.84091 3 2.78238 3.006 2.72442 3.01801C2.66646 3.03002 2.61018 3.04781 2.55559 3.07136C2.50099 3.09492 2.44912 3.1238 2.39999 3.158C2.35085 3.1922 2.30539 3.23106 2.2636 3.27459C2.22182 3.31811 2.18451 3.36547 2.15168 3.41665C2.11885 3.46784 2.09112 3.52186 2.06851 3.57873C2.04589 3.63561 2.02882 3.69423 2.01729 3.7546C2.00576 3.81498 2 3.87594 2 3.9375L2 12.0625C2 12.1241 2.00576 12.185 2.01729 12.2454C2.02882 12.3058 2.04589 12.3644 2.06851 12.4213C2.09112 12.4781 2.11885 12.5322 2.15168 12.5833C2.18451 12.6345 2.22182 12.6819 2.2636 12.7254C2.30539 12.7689 2.35085 12.8078 2.39999 12.842C2.44912 12.8762 2.50099 12.9051 2.55558 12.9286C2.61018 12.9522 2.66646 12.97 2.72442 12.982C2.78238 12.994 2.84091 13 2.9 13L13.1 13C13.1591 13 13.2176 12.994 13.2756 12.982C13.3335 12.97 13.3898 12.9522 13.4444 12.9286C13.499 12.9051 13.5509 12.8762 13.6 12.842C13.6491 12.8078 13.6946 12.7689 13.7364 12.7254C13.7782 12.6819 13.8155 12.6345 13.8483 12.5833C13.8812 12.5322 13.9089 12.4781 13.9315 12.4213C13.9541 12.3644 13.9712 12.3058 13.9827 12.2454C13.9942 12.185 14 12.1241 14 12.0625L14 3.9375C14 3.87594 13.9942 3.81498 13.9827 3.7546C13.9712 3.69423 13.9541 3.63561 13.9315 3.57873C13.9089 3.52186 13.8812 3.46784 13.8483 3.41665C13.8155 3.36547 13.7782 3.31811 13.7364 3.27459C13.6946 3.23106 13.6491 3.1922 13.6 3.158C13.5509 3.1238 13.499 3.09492 13.4444 3.07136C13.3898 3.04781 13.3335 3.03002 13.2756 3.01801C13.2176 3.006 13.1591 3 13.1 3ZM2.9 5.03125L5.75 5.03125L5.75 6.75L2.9 6.75L2.9 5.03125ZM2.9 7.6875L5.75 7.6875L5.75 9.40625L2.9 9.40625L2.9 7.6875ZM9.35 10.3438L9.35 12.0625L6.65 12.0625L6.65 10.3438L9.35 10.3438ZM6.65 9.40625L6.65 7.6875L9.35 7.6875L9.35 9.40625L6.65 9.40625ZM9.35 6.75L6.65 6.75L6.65 5.03125L9.35 5.03125L9.35 6.75ZM10.25 7.6875L13.1 7.6875L13.1 9.40625L10.25 9.40625L10.25 7.6875ZM10.25 6.75L10.25 5.03125L13.1 5.03125L13.1 6.75L10.25 6.75ZM2.9 10.3438L5.75 10.3438L5.75 12.0625L2.9 12.0625L2.9 10.3438ZM10.25 12.0625L10.25 10.3438L13.1 10.3438L13.1 12.0625L10.25 12.0625Z" fill="rgb(255,255,255)" fill-rule="nonzero" />
</svg>
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none">
<rect id="表格(1) 1" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
<path id="矢量 462" d="M13.1 3L2.9 3C2.84091 3 2.78238 3.006 2.72442 3.01801C2.66646 3.03002 2.61018 3.04781 2.55559 3.07136C2.50099 3.09492 2.44912 3.1238 2.39999 3.158C2.35085 3.1922 2.30539 3.23106 2.2636 3.27459C2.22182 3.31811 2.18451 3.36547 2.15168 3.41665C2.11885 3.46784 2.09112 3.52186 2.06851 3.57873C2.04589 3.63561 2.02882 3.69423 2.01729 3.7546C2.00576 3.81498 2 3.87594 2 3.9375L2 12.0625C2 12.1241 2.00576 12.185 2.01729 12.2454C2.02882 12.3058 2.04589 12.3644 2.06851 12.4213C2.09112 12.4781 2.11885 12.5322 2.15168 12.5833C2.18451 12.6345 2.22182 12.6819 2.2636 12.7254C2.30539 12.7689 2.35085 12.8078 2.39999 12.842C2.44912 12.8762 2.50099 12.9051 2.55558 12.9286C2.61018 12.9522 2.66646 12.97 2.72442 12.982C2.78238 12.994 2.84091 13 2.9 13L13.1 13C13.1591 13 13.2176 12.994 13.2756 12.982C13.3335 12.97 13.3898 12.9522 13.4444 12.9286C13.499 12.9051 13.5509 12.8762 13.6 12.842C13.6491 12.8078 13.6946 12.7689 13.7364 12.7254C13.7782 12.6819 13.8155 12.6345 13.8483 12.5833C13.8812 12.5322 13.9089 12.4781 13.9315 12.4213C13.9541 12.3644 13.9712 12.3058 13.9827 12.2454C13.9942 12.185 14 12.1241 14 12.0625L14 3.9375C14 3.87594 13.9942 3.81498 13.9827 3.7546C13.9712 3.69423 13.9541 3.63561 13.9315 3.57873C13.9089 3.52186 13.8812 3.46784 13.8483 3.41665C13.8155 3.36547 13.7782 3.31811 13.7364 3.27459C13.6946 3.23106 13.6491 3.1922 13.6 3.158C13.5509 3.1238 13.499 3.09492 13.4444 3.07136C13.3898 3.04781 13.3335 3.03002 13.2756 3.01801C13.2176 3.006 13.1591 3 13.1 3ZM2.9 5.03125L5.75 5.03125L5.75 6.75L2.9 6.75L2.9 5.03125ZM2.9 7.6875L5.75 7.6875L5.75 9.40625L2.9 9.40625L2.9 7.6875ZM9.35 10.3438L9.35 12.0625L6.65 12.0625L6.65 10.3438L9.35 10.3438ZM6.65 9.40625L6.65 7.6875L9.35 7.6875L9.35 9.40625L6.65 9.40625ZM9.35 6.75L6.65 6.75L6.65 5.03125L9.35 5.03125L9.35 6.75ZM10.25 7.6875L13.1 7.6875L13.1 9.40625L10.25 9.40625L10.25 7.6875ZM10.25 6.75L10.25 5.03125L13.1 5.03125L13.1 6.75L10.25 6.75ZM2.9 10.3438L5.75 10.3438L5.75 12.0625L2.9 12.0625L2.9 10.3438ZM10.25 12.0625L10.25 10.3438L13.1 10.3438L13.1 12.0625L10.25 12.0625Z" fill="rgb(5,95,194)" fill-rule="nonzero" />
</svg>
<template>
<div class="data-chart-switch-box-wrapper">
<div class="item" :class="{ 'item-acitve': isShowData }">
<div class="icon">
<img src="./data-acitve.svg" alt="" v-if="isShowData">
<img src="./data.svg" alt="" v-else>
</div>
<div class="text text-tip-1" :class="{ 'text-active': isShowData }">{{ "数据" }}</div>
</div>
<div class="item" :class="{ 'item-acitve': !isShowData }">
<div class="icon">
<img src="./chart.svg" alt="" v-if="isShowData">
<img src="./chart-active.svg" alt="" v-else>
</div>
<div class="text text-tip-1" :class="{ 'text-active': !isShowData }">{{ "图表" }}</div>
</div>
</div>
</template>
<script setup>
const props = defineProps({
isShowData: {
type: Boolean,
default: true
}
})
</script>
<style lang="scss" scoped>
.data-chart-switch-box-wrapper {
width: 160px;
height: 28px;
border: 1px solid var(--color-primary-100);
display: flex;
border-radius: 20px;
overflow: hidden;
.item-acitve {
background: var(--color-primary-100);
}
.item {
width: 80px;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
color: var(--color-primary-100);
}
.text-active {
color: var(--bg-white-100) !important;
}
}
}
</style>
\ No newline at end of file
......@@ -47,7 +47,7 @@
<div class="chart-main-box" v-if="isShowChart">
<div class="info-box">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -82,7 +82,7 @@
<div class="data-main-box" v-else>
<div class="data-main-box-header">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -132,7 +132,7 @@
<template #default="scope">
<span class="title-item text-compact-bold" @click="handleClickToDetail(scope.row)">{{
scope.row.originalTitle
}}</span>
}}</span>
</template>
</el-table-column>
<el-table-column label="发布时间" width="120" class-name="date-column">
......@@ -177,6 +177,7 @@ import PieChart from '../components/PieChart/index.vue'
import BarChart from '../components/BarChart/index.vue'
import RaderChart from '../components/RadarChart/idnex.vue'
import SelectBox from '../components/SelectBox/index.vue'
import DataChartSwitchBox from '../components/dataChartSwitchBox/index.vue'
import { useRoute } from "vue-router";
import router from '@/router'
......@@ -198,18 +199,18 @@ const handleSwitchChartData = () => {
return item.name === curDemension.value
})[0]
// setTimeout(() => {
activeChart.value = curDemensionItem.chartTypeList[0]
if (curDemension.value === '发布时间') {
if (selectedTime.value === '按月度统计') {
curChartData.value = curDemensionItem.data
} else if (selectedTime.value === '按季度统计') {
curChartData.value = curDemensionItem.quatarData
} else {
curChartData.value = curDemensionItem.yearData
}
} else {
activeChart.value = curDemensionItem.chartTypeList[0]
if (curDemension.value === '发布时间') {
if (selectedTime.value === '按月度统计') {
curChartData.value = curDemensionItem.data
} else if (selectedTime.value === '按季度统计') {
curChartData.value = curDemensionItem.quatarData
} else {
curChartData.value = curDemensionItem.yearData
}
} else {
curChartData.value = curDemensionItem.data
}
// })
}
}
......@@ -1117,18 +1118,25 @@ onMounted(async () => {
}
.chart-main-box {
width: 1568px;
height: 809px;
margin: 0 auto;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
border-radius: 10px;
.info-box {
margin: 0 auto;
width: 1568px;
margin-top: 16px;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
......@@ -1145,14 +1153,13 @@ onMounted(async () => {
.content-box {
margin: 0 auto;
margin-top: 16px;
width: 1568px;
height: 766px;
border-radius: 10px;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
width: 1520px;
height: 726px;
border: none;
.content-header {
margin: 16px 24px;
margin: 16px 0;
width: 1520px;
height: 28px;
}
......@@ -1182,9 +1189,8 @@ onMounted(async () => {
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
......
......@@ -29,7 +29,7 @@
<div class="chart-main-box" v-if="isShowChart">
<div class="info-box">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -64,7 +64,7 @@
<div class="data-main-box" v-else>
<div class="data-main-box-header">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -153,6 +153,7 @@ import BarChart from '../../components/BarChart/index.vue'
import RaderChart from '../../components/RadarChart/idnex.vue'
import SelectBox from '../../components/SelectBox/index.vue'
import InputBox from '../../components/InputBox/index.vue'
import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
import { useRoute } from "vue-router";
import router from '@/router'
......@@ -1015,18 +1016,25 @@ onMounted(async () => {
}
.chart-main-box {
width: 1568px;
height: 809px;
margin: 0 auto;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
border-radius: 10px;
.info-box {
margin: 0 auto;
width: 1568px;
margin-top: 16px;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
......@@ -1043,14 +1051,13 @@ onMounted(async () => {
.content-box {
margin: 0 auto;
margin-top: 16px;
width: 1568px;
height: 766px;
border-radius: 10px;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
width: 1520px;
height: 726px;
border: none;
.content-header {
margin: 16px 24px;
margin: 16px 0;
width: 1520px;
height: 28px;
}
......@@ -1080,9 +1087,8 @@ onMounted(async () => {
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
......
......@@ -32,7 +32,7 @@
<div class="chart-main-box" v-if="isShowChart">
<div class="info-box">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -66,7 +66,7 @@
<div class="data-main-box" v-else>
<div class="data-main-box-header">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -144,6 +144,7 @@ import PieChart from '../../components/PieChart/index.vue'
import BarChart from '../../components/BarChart/index.vue'
import RaderChart from '../../components/RadarChart/idnex.vue'
import SelectBox from '../../components/SelectBox/index.vue'
import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
import { useRoute } from "vue-router";
import router from '@/router'
......@@ -940,18 +941,25 @@ onMounted(async () => {
}
.chart-main-box {
width: 1568px;
height: 809px;
margin: 0 auto;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
border-radius: 10px;
.info-box {
margin: 0 auto;
width: 1568px;
margin-top: 16px;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
......@@ -968,14 +976,13 @@ onMounted(async () => {
.content-box {
margin: 0 auto;
margin-top: 16px;
width: 1568px;
height: 766px;
border-radius: 10px;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
width: 1520px;
height: 726px;
border: none;
.content-header {
margin: 16px 24px;
margin: 16px 0;
width: 1520px;
height: 28px;
}
......@@ -1005,9 +1012,8 @@ onMounted(async () => {
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
......
......@@ -49,7 +49,7 @@
<div class="chart-main-box" v-if="isShowChart">
<div class="info-box">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -84,7 +84,7 @@
<div class="data-main-box" v-else>
<div class="data-main-box-header">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -179,6 +179,8 @@ import PieChart from '../../components/PieChart/index.vue'
import BarChart from '../../components/BarChart/index.vue'
import RaderChart from '../../components/RadarChart/idnex.vue'
import SelectBox from '../../components/SelectBox/index.vue'
import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
import { useRoute } from "vue-router";
import router from '@/router'
......@@ -1206,24 +1208,26 @@ onMounted(async () => {
}
.chart-main-box {
width: 1568px;
height: 809px;
margin: 0 auto;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
border-radius: 10px;
.info-box {
margin: 0 auto;
width: 1568px;
margin-top: 16px;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.num-box {
......@@ -1234,14 +1238,13 @@ onMounted(async () => {
.content-box {
margin: 0 auto;
margin-top: 16px;
width: 1568px;
height: 766px;
border-radius: 10px;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
width: 1520px;
height: 726px;
border: none;
.content-header {
margin: 16px 24px;
margin: 16px 0;
width: 1520px;
height: 28px;
}
......@@ -1271,15 +1274,9 @@ onMounted(async () => {
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.num-box {
......
......@@ -32,7 +32,7 @@
<div class="chart-main-box" v-if="isShowChart">
<div class="info-box">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -66,7 +66,7 @@
<div class="data-main-box" v-else>
<div class="data-main-box-header">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -144,6 +144,8 @@ import PieChart from '../../components/PieChart/index.vue'
import BarChart from '../../components/BarChart/index.vue'
import RaderChart from '../../components/RadarChart/idnex.vue'
import SelectBox from '../../components/SelectBox/index.vue'
import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
import { useRoute } from "vue-router";
import router from '@/router'
......@@ -956,18 +958,25 @@ onMounted(async () => {
}
.chart-main-box {
width: 1568px;
height: 809px;
margin: 0 auto;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
border-radius: 10px;
.info-box {
margin: 0 auto;
width: 1568px;
margin-top: 16px;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
......@@ -984,14 +993,13 @@ onMounted(async () => {
.content-box {
margin: 0 auto;
margin-top: 16px;
width: 1568px;
height: 766px;
border-radius: 10px;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
width: 1520px;
height: 726px;
border: none;
.content-header {
margin: 16px 24px;
margin: 16px 0;
width: 1520px;
height: 28px;
}
......@@ -1002,7 +1010,6 @@ onMounted(async () => {
}
}
}
.data-main-box {
width: 1568px;
min-height: 810px;
......@@ -1021,9 +1028,8 @@ onMounted(async () => {
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
......
<template>
<div class="data-library-wrapper">
<!-- <div class="data-library-header">
<div class="header-left">
<div class="icon">
<img src="@/assets/icons/overview/logo.png" alt="">
</div>
<div class="title text-title-1-show">{{ '数据资源库' }}</div>
</div>
<div class="header-right">
<div class="search-box"></div>
<div class="info-box" @click="handleClickToolBox">
<div class="mail">
<img src="@/assets/icons/overview/mail.png" alt="" />
</div>
<div class="user">
<img src="@/assets/icons/overview/user.png" alt="" />
</div>
<div class="name">{{ "管理员" }}</div>
</div>
</div>
</div> -->
<div class="data-library-main">
<div class="data-library-sider">
<div class="sider-item-box" v-for="(item, index) in siderList" :key="index">
......@@ -431,10 +411,6 @@ const handleCloseCurTab = (tab, index) => {
}
};
const handleClickToolBox = () => {
ElMessage.warning("当前功能正在开发中,敬请期待!");
};
onMounted(() => {
const path = route.path;
console.log(decodeURI(route.fullPath));
......@@ -548,7 +524,7 @@ onBeforeUnmount(() => {
if (timer.value) {
clearTimeout(timer.value);
}
localStorage.setItem('visitedViews', [])
sessionStorage.setItem('visitedViews', [])
});
</script>
......@@ -583,7 +559,6 @@ onBeforeUnmount(() => {
height: 100%;
}
}
.title {
color: var(--color-primary-100);
}
......
......@@ -5,8 +5,8 @@
<SelectBox :placeholder-name="DatePlaceHolder" select-title="成立时间" :select-list="dateList"
:select-name="selectedDate" :custom-time="customTime" @update:select-text="handleSelectDate"
@update:custom-time="handleCustomDate" />
<SelectBox :placeholder-name="countryPlaceHolder" select-title="国家地区"
:select-list="countryList" :select-name="selectedCountry" @update:select-text="handleSelectCountry" />
<SelectBox :placeholder-name="countryPlaceHolder" select-title="国家地区" :select-list="countryList"
:select-name="selectedCountry" @update:select-text="handleSelectCountry" />
</div>
<div class="header-footer">
<div class="header-footer-left">
......@@ -14,15 +14,15 @@
@close="handleCloseCurTag(tag, index)" />
</div>
<div class="header-footer-right">
<HeaderBtnBox :isShowAll="isFolderAll" :isShowAllBtn="false" @show-all="handleSwitchFolderAll" @clear="handleClear"
@confirm="handleConfirm" />
<HeaderBtnBox :isShowAll="isFolderAll" :isShowAllBtn="false" @show-all="handleSwitchFolderAll"
@clear="handleClear" @confirm="handleConfirm" />
</div>
</div>
</div>
<div class="chart-main-box" v-if="isShowChart">
<div class="info-box">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -57,7 +57,7 @@
<div class="data-main-box" v-else>
<div class="data-main-box-header">
<div class="switch-box" @click="handleSwitchChartData">
<img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
......@@ -103,25 +103,20 @@
<el-table ref="tableRef" :data="tableData" row-key="id" @selection-change="handleSelectionChange"
@select="handleSelect" @select-all="handleSelectAll" style="width: 100%" :row-style="{ height: '52px' }">
<el-table-column type="selection" width="40" />
<el-table-column label="实体名称" width="620">
<el-table-column label="实体名称" width="540">
<template #default="scope">
<span class="title-item text-compact-bold" @click="handleClickToDetail(scope.row)">{{
scope.row.originalTitle
}}</span>
</template>
</el-table-column>
<el-table-column label="成立时间" class-name="date-column">
<el-table-column label="所属国家地区" width="240">
<template #default="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column label="涉及领域" width="500" class-name="date-column">
<template #default="scope">
<div class="tag-box">
<AreaTag v-for="tag, index in scope.row.domains" :key="index" :tagName="tag" />
</div>
</template>
<el-table-column label="主官名称" width="180">
<template #default="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column label="实体类型" width="100">
<el-table-column label="最新动态">
<template #default="scope">{{ scope.row.typeStr }}</template>
</el-table-column>
</el-table>
......@@ -146,6 +141,7 @@ import PieChart from '../components/PieChart/index.vue'
import BarChart from '../components/BarChart/index.vue'
import RaderChart from '../components/RadarChart/idnex.vue'
import SelectBox from '../components/SelectBox/index.vue'
import DataChartSwitchBox from '../components/dataChartSwitchBox/index.vue'
import { useRoute } from "vue-router";
import router from '@/router'
......@@ -198,49 +194,59 @@ const staticsDemensionList = ref([
{
name: '成立时间',
active: true,
chartTypeList: ['折线图', '柱状图'],
chartTypeList: [
{
name: '折线图',
data: {
dataX: [],
dataY: []
},
quatarData: {
dataX: [],
dataY: []
},
yearData: {
dataX: [],
dataY: []
}
},
{
name: '柱状图',
data: {
dataX: [],
dataY: []
},
quatarData: {
dataX: [],
dataY: []
},
yearData: {
dataX: [],
dataY: []
}
}],
chartTitle: '实体清单成立时间变化趋势',
data: {
dataX: [],
dataY: []
},
quatarData: {
dataX: [],
dataY: []
},
yearData: {
dataX: [],
dataY: []
}
},
// {
// name: '科技领域',
// active: false,
// chartTypeList: ['饼状图'],
// chartTitle: '实体清单科技领域分布',
// data: []
// },
// {
// name: '实体类型',
// active: false,
// chartTypeList: ['饼状图'],
// chartTitle: '实体类型分布',
// data: []
// },
{
name: '所属国家地区',
active: false,
chartTypeList: ['饼状图'],
chartTypeList: [{
name: '饼状图',
data: []
},
{
name: '柱状图',
data: {
dataX: [],
dataY: []
}
}],
chartTitle: '所属国家地区分布',
data: []
},
// {
// name: '实体省份',
// active: false,
// chartTypeList: ['饼状图'],
// chartTitle: '实体省份分布',
// data: []
// }
])
// 当前维度下的图表列表
......@@ -364,6 +370,8 @@ const activeChart = ref('') // 当前激活的图表
// 切换当前图表
const handleSwitchActiveChart = val => {
activeChart.value = val.name
const curChartItem = curChartTypeList.value.filter(item => item.name === val.name)[0]
curChartData.value = curChartItem.data
}
// 数据- 是否全选
......@@ -875,24 +883,26 @@ onMounted(async () => {
}
.chart-main-box {
width: 1568px;
height: 809px;
margin: 0 auto;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
border-radius: 10px;
.info-box {
margin: 0 auto;
width: 1568px;
margin-top: 16px;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.num-box {
......@@ -903,14 +913,13 @@ onMounted(async () => {
.content-box {
margin: 0 auto;
margin-top: 16px;
width: 1568px;
height: 766px;
border-radius: 10px;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
width: 1520px;
height: 726px;
border: none;
.content-header {
margin: 16px 24px;
margin: 16px 0;
width: 1520px;
height: 28px;
}
......@@ -940,15 +949,9 @@ onMounted(async () => {
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.num-box {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论