提交 5466ba6a authored 作者: coderBryanFu's avatar coderBryanFu

feat:新增通用组件AiSummary

...@@ -235,12 +235,26 @@ body { ...@@ -235,12 +235,26 @@ body {
display: none; display: none;
} }
/* #region 公共样式类名 */
/* 单行文本溢出隐藏显示省略号 */ /* 单行文本溢出隐藏显示省略号 */
.one-line-ellipsis { .one-line-ellipsis {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
/* 多行文本两端对齐 最后一行正常显示 */
.text-align-justify {
text-align: justify;
text-align-last: left;
-webkit-text-align-last: left;
}
/* 可点击文本 鼠标悬浮样式 */
#app .text-click-hover:hover {
text-decoration: underline;
color: rgb(5, 95, 194);
cursor: pointer;
}
/* #endregion 公共样式类名 */
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
......
...@@ -192,3 +192,30 @@ export function getBillFullText(params) { ...@@ -192,3 +192,30 @@ export function getBillFullText(params) {
params, params,
}) })
} }
// 条款对比-根据两版版本与筛选条件获取配对条款列表
/**
* @param {billId,oldVersionId,newVersionId,diffType,cRelated,keyword}
* @header token
* @returns { list: Array<{ oldTerm: object|null, newTerm: object|null }> }
*/
export function getBillTermsCompare(params) {
return request({
method: "GET",
url: "/api/billInfoBean/content/compare",
params,
});
}
// 版本对比-根据两版版本与筛选条件获取条款列表(分页)
/**
* @param {billId,content,currentPage,currentVersion,isCn,originalVersion,pageSize,status}
* @header token
*/
export function getBillVersionCompare(params) {
return request({
method: "GET",
url: "/api/billInfoBean/versionCompare",
params,
});
}
import request from "@/api/request.js"; import request from "@/api/request.js";
// 最新科技政令 // 最新科技政令
export function getDepartmentList() { export function getDepartmentList(params) {
return request({ return request({
method: 'GET', method: 'GET',
url: `/api/administrativeDict/department`, url: `/api/administrativeDict/department`,
...@@ -43,10 +43,10 @@ export function getDecreeArea(params) { ...@@ -43,10 +43,10 @@ export function getDecreeArea(params) {
} }
// 关键行政令 // 关键行政令
export function getKeyDecree() { export function getKeyDecree(params) {
return request({ return request({
method: 'GET', method: 'GET',
url: `/api/administrativeOrderOverview/action`, url: `/api/administrativeOrderOverview/action?pageSize=${params.pageSize}&pageNum=${params.pageNum}`,
}) })
} }
......
...@@ -239,6 +239,8 @@ watch(isTranslate, () => { ...@@ -239,6 +239,8 @@ watch(isTranslate, () => {
background-color: white; background-color: white;
padding: 0 60px; padding: 0 60px;
flex: auto; flex: auto;
height: 100%;
min-height: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.report-header { .report-header {
...@@ -324,9 +326,14 @@ watch(isTranslate, () => { ...@@ -324,9 +326,14 @@ watch(isTranslate, () => {
.report-main { .report-main {
flex: auto; flex: auto;
min-height: 0;
box-sizing: border-box; box-sizing: border-box;
padding-top: 10px; padding-top: 10px;
:deep(.el-scrollbar) {
height: 100%;
}
.no-content { .no-content {
height: 100%; height: 100%;
display: flex; display: flex;
......
...@@ -133,11 +133,12 @@ const emit = defineEmits(['save', 'download', 'collect']) ...@@ -133,11 +133,12 @@ const emit = defineEmits(['save', 'download', 'collect'])
} }
} }
// .header-btn { .header-btn {
// display: flex; // display: flex;
// justify-content: flex-end; // justify-content: flex-end;
// gap: 8px; // gap: 8px;
// } margin-right: 10px;
}
// .header-btn1 { // .header-btn1 {
// position: absolute; // position: absolute;
......
...@@ -13,7 +13,7 @@ const BillInfluenceLayout = () => import('@/views/bill/influence/index.vue') ...@@ -13,7 +13,7 @@ const BillInfluenceLayout = () => import('@/views/bill/influence/index.vue')
const BillInfluenceIndustry = () => import('@/views/bill/influence/industry/index.vue') const BillInfluenceIndustry = () => import('@/views/bill/influence/industry/index.vue')
const BillInfluenceScientificResearch = () => import('@/views/bill/influence/scientificResearch/index.vue') const BillInfluenceScientificResearch = () => import('@/views/bill/influence/scientificResearch/index.vue')
const BillRelevantCircumstance = () => import('@/views/bill/relevantCircumstance/index.vue') const BillRelevantCircumstance = () => import('@/views/bill/relevantCircumstance/index.vue')
const BillOriginalText = () => import('@/views/bill/billOriginalText/index.vue') const BillVersionCompare = () => import('@/views/bill/versionCompare/index.vue')
const billRoutes = [ const billRoutes = [
...@@ -36,14 +36,6 @@ const billRoutes = [ ...@@ -36,14 +36,6 @@ const billRoutes = [
dynamicTitle: true // 标记需要动态设置标题 dynamicTitle: true // 标记需要动态设置标题
}, },
children: [ children: [
{
path: "originalText",
name: "BillOriginalText",
component: BillOriginalText,
meta: {
title: "法案原文"
}
},
// 法案分析路由 // 法案分析路由
{ {
path: "bill", path: "bill",
...@@ -138,6 +130,14 @@ const billRoutes = [ ...@@ -138,6 +130,14 @@ const billRoutes = [
// meta: { // meta: {
// title: "相关情况" // title: "相关情况"
// } // }
},
{
path: "versionCompare",
name: "BillVersionCompare",
component: BillVersionCompare,
meta: {
title: "版本对比"
}
} }
] ]
}, },
......
...@@ -18,7 +18,7 @@ const decreeRoutes = [ ...@@ -18,7 +18,7 @@ const decreeRoutes = [
name: "Decree", name: "Decree",
component: Decree, component: Decree,
meta: { meta: {
title: "政令概览" title: "科技政令概况"
} }
}, },
{ {
......
...@@ -204,16 +204,20 @@ ...@@ -204,16 +204,20 @@
<div class="coop-members"> <div class="coop-members">
<div class="coop-member"> <div class="coop-member">
<img class="coop-avatar" :src="item.avatar || defaultAvatar" alt="committee-avatar" /> <img class="coop-avatar" :src="item.avatar || defaultAvatar" alt="committee-avatar" />
<div class="coop-member-info">
<div class="coop-member-name" :title="item.name">{{ item.name }}</div> <div class="coop-member-name" :title="item.name">{{ item.name }}</div>
<div v-if="item.nameEn" class="coop-member-name-en" :title="item.nameEn">
{{ item.nameEn }}
</div>
</div> </div>
</div> </div>
<div class="coop-summary" :title="item.desc">
{{ item.desc }}
</div> </div>
<!-- <div class="coop-summary" :title="item.desc">
{{ item.desc }}
</div> -->
<div class="coop-count"> <div class="coop-count">
{{ `${item.proposalSize ?? (item.bills || []).length}项重点法案` }} {{ `${item.proposalSize ?? (item.bills || []).length}项重点法案` }}
</div> </div>
<slot name="committee-extra" :committee="item" />
</div> </div>
<div class="coop-proposals"> <div class="coop-proposals">
<div <div
...@@ -447,6 +451,7 @@ const handleGetCommitteeList = async () => { ...@@ -447,6 +451,7 @@ const handleGetCommitteeList = async () => {
const descText = billInfoPage[0]?.originDepart || ""; const descText = billInfoPage[0]?.originDepart || "";
return { return {
id: item.id, id: item.id,
nameEn:item.nameEn || "",
avatar: "", avatar: "",
name: item.name || "-", name: item.name || "-",
desc: descText, desc: descText,
...@@ -1232,6 +1237,12 @@ onMounted(() => { ...@@ -1232,6 +1237,12 @@ onMounted(() => {
min-width: 0; min-width: 0;
} }
.coop-member-info {
display: flex;
flex-direction: column;
min-width: 0;
}
.coop-avatar { .coop-avatar {
width: 40px; width: 40px;
height: 40px; height: 40px;
...@@ -1273,6 +1284,17 @@ onMounted(() => { ...@@ -1273,6 +1284,17 @@ onMounted(() => {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.coop-member-name-en {
color: var(--text-primary-65-color);
font-family: "Microsoft YaHei";
font-size: 14px;
font-weight: 400;
line-height: 22px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.coop-count { .coop-count {
flex-shrink: 0; flex-shrink: 0;
color: #1459bb; color: #1459bb;
...@@ -1284,7 +1306,6 @@ onMounted(() => { ...@@ -1284,7 +1306,6 @@ onMounted(() => {
} }
.coop-proposals { .coop-proposals {
margin-top: 10px;
padding-top: 10px; padding-top: 10px;
border-top: 1px solid #eaeced; border-top: 1px solid #eaeced;
display: grid; display: grid;
......
...@@ -127,7 +127,13 @@ ...@@ -127,7 +127,13 @@
<el-empty v-if="!box5HasData" description="暂无数据" :image-size="100" /> <el-empty v-if="!box5HasData" description="暂无数据" :image-size="100" />
<div v-else id="box5Chart" class="overview-chart"></div> <div v-else id="box5Chart" class="overview-chart"></div>
</div> </div>
<div class="overview-tip-row">
<TipTab class="overview-tip" /> <TipTab class="overview-tip" />
<AiButton class="overview-tip-action" @mouseenter="handleShowAiPane('box5')" />
</div>
<div v-if="aiPaneVisible.box5" class="overview-ai-pane" @mouseleave="handleHideAiPane('box5')">
<AiPane :aiContent="overviewAiContent.box5" />
</div>
</div> </div>
</OverviewCard> </OverviewCard>
<OverviewCard class="overview-card--single box6" title="涉华法案领域分布" :icon="box6HeaderIcon"> <OverviewCard class="overview-card--single box6" title="涉华法案领域分布" :icon="box6HeaderIcon">
...@@ -141,7 +147,13 @@ ...@@ -141,7 +147,13 @@
<el-empty v-if="!box9HasData" description="暂无数据" :image-size="100" /> <el-empty v-if="!box9HasData" description="暂无数据" :image-size="100" />
<div v-else id="box9Chart" class="overview-chart"></div> <div v-else id="box9Chart" class="overview-chart"></div>
</div> </div>
<div class="overview-tip-row">
<TipTab class="overview-tip" /> <TipTab class="overview-tip" />
<AiButton class="overview-tip-action" @mouseenter="handleShowAiPane('box6')" />
</div>
<div v-if="aiPaneVisible.box6" class="overview-ai-pane" @mouseleave="handleHideAiPane('box6')">
<AiPane :aiContent="overviewAiContent.box6" />
</div>
</div> </div>
</OverviewCard> </OverviewCard>
</div> </div>
...@@ -157,7 +169,13 @@ ...@@ -157,7 +169,13 @@
<el-empty v-if="!box7HasData" description="暂无数据" :image-size="100" /> <el-empty v-if="!box7HasData" description="暂无数据" :image-size="100" />
<div v-else id="box7Chart" class="overview-chart"></div> <div v-else id="box7Chart" class="overview-chart"></div>
</div> </div>
<div class="overview-tip-row">
<TipTab class="overview-tip" /> <TipTab class="overview-tip" />
<AiButton class="overview-tip-action" @mouseenter="handleShowAiPane('box7')" />
</div>
<div v-if="aiPaneVisible.box7" class="overview-ai-pane" @mouseleave="handleHideAiPane('box7')">
<AiPane :aiContent="overviewAiContent.box7" />
</div>
</div> </div>
</OverviewCard> </OverviewCard>
<OverviewCard class="overview-card--single box8" title="涉华法案进展分布" :icon="box7HeaderIcon"> <OverviewCard class="overview-card--single box8" title="涉华法案进展分布" :icon="box7HeaderIcon">
...@@ -174,7 +192,13 @@ ...@@ -174,7 +192,13 @@
<div id="box8Chart" class="overview-chart box8-chart"></div> <div id="box8Chart" class="overview-chart box8-chart"></div>
</template> </template>
</div> </div>
<div class="overview-tip-row">
<TipTab class="overview-tip" /> <TipTab class="overview-tip" />
<AiButton class="overview-tip-action" @mouseenter="handleShowAiPane('box8')" />
</div>
<div v-if="aiPaneVisible.box8" class="overview-ai-pane" @mouseleave="handleHideAiPane('box8')">
<AiPane :aiContent="overviewAiContent.box8" />
</div>
</div> </div>
</OverviewCard> </OverviewCard>
<OverviewCard class="overview-card--single box9" title="涉华法案关键条款" :icon="box7HeaderIcon"> <OverviewCard class="overview-card--single box9" title="涉华法案关键条款" :icon="box7HeaderIcon">
...@@ -183,7 +207,13 @@ ...@@ -183,7 +207,13 @@
<el-empty v-if="!wordCloudHasData" description="暂无数据" :image-size="100" /> <el-empty v-if="!wordCloudHasData" description="暂无数据" :image-size="100" />
<WordCloundChart v-else class="overview-chart" width="100%" height="100%" :data="wordCloudData" /> <WordCloundChart v-else class="overview-chart" width="100%" height="100%" :data="wordCloudData" />
</div> </div>
<div class="overview-tip-row">
<TipTab class="overview-tip" /> <TipTab class="overview-tip" />
<AiButton class="overview-tip-action" @mouseenter="handleShowAiPane('box9')" />
</div>
<div v-if="aiPaneVisible.box9" class="overview-ai-pane" @mouseleave="handleHideAiPane('box9')" >
<AiPane :aiContent="overviewAiContent.box9" />
</div>
</div> </div>
</OverviewCard> </OverviewCard>
</div> </div>
...@@ -221,6 +251,8 @@ import OverviewCard from "./OverviewCard.vue"; ...@@ -221,6 +251,8 @@ import OverviewCard from "./OverviewCard.vue";
import ResourceLibrarySection from "./ResourceLibrarySection.vue"; import ResourceLibrarySection from "./ResourceLibrarySection.vue";
import { useContainerScroll } from "@/hooks/useScrollShow"; import { useContainerScroll } from "@/hooks/useScrollShow";
import TipTab from "@/components/base/TipTab/index.vue"; import TipTab from "@/components/base/TipTab/index.vue";
import AiButton from "@/components/base/Ai/AiButton/index.vue";
import AiPane from "@/components/base/Ai/AiPane/index.vue";
import WordCloundChart from "@/components/base/WordCloundChart/index.vue"; import WordCloundChart from "@/components/base/WordCloundChart/index.vue";
import getMultiLineChart from "./utils/multiLineChart"; import getMultiLineChart from "./utils/multiLineChart";
...@@ -370,6 +402,36 @@ const box7YearList = ref([ ...@@ -370,6 +402,36 @@ const box7YearList = ref([
} }
]); ]);
const aiPaneVisible = ref({
box5: false,
box6: false,
box7: false,
box8: false,
box9: false
});
const overviewAiContent = ref({
box5: "智能总结生成中...",
box6: "智能总结生成中...",
box7: "智能总结生成中...",
box8: "智能总结生成中...",
box9: "智能总结生成中..."
});
const handleShowAiPane = key => {
aiPaneVisible.value = {
...aiPaneVisible.value,
[key]: true
};
};
const handleHideAiPane = key => {
aiPaneVisible.value = {
...aiPaneVisible.value,
[key]: false
};
};
const box8selectetedTime = ref("2025"); const box8selectetedTime = ref("2025");
const box8YearList = ref([ const box8YearList = ref([
{ {
...@@ -2109,6 +2171,20 @@ onUnmounted(() => { ...@@ -2109,6 +2171,20 @@ onUnmounted(() => {
.overview-card-body { .overview-card-body {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative;
}
.overview-ai-pane {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
z-index: 3;
pointer-events: none;
.ai-pane-wrapper {
pointer-events: auto;
}
} }
.overview-chart-wrap { .overview-chart-wrap {
...@@ -2131,8 +2207,17 @@ onUnmounted(() => { ...@@ -2131,8 +2207,17 @@ onUnmounted(() => {
min-height: 0; min-height: 0;
} }
.overview-tip { .overview-tip-row {
margin-top: 10px; margin-top: 10px;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.overview-tip-action {
position: absolute;
right: -30px;
} }
} }
} }
......
...@@ -78,14 +78,6 @@ ...@@ -78,14 +78,6 @@
<div class="right-box-bottom" v-if="showActions"> <div class="right-box-bottom" v-if="showActions">
<template v-if="isLoading"> <template v-if="isLoading">
<div class="btn1 is-skeleton">
<div class="icon">
<el-skeleton-item class="skeleton-action-icon" variant="text" />
</div>
<div class="text">
<el-skeleton-item class="skeleton-action-text" variant="text" />
</div>
</div>
<div class="btn3 is-skeleton"> <div class="btn3 is-skeleton">
<div class="icon"> <div class="icon">
<el-skeleton-item class="skeleton-action-icon" variant="text" /> <el-skeleton-item class="skeleton-action-icon" variant="text" />
...@@ -96,13 +88,6 @@ ...@@ -96,13 +88,6 @@
</div> </div>
</template> </template>
<template v-else> <template v-else>
<div class="btn1" @click="emit('open-original-text')">
<div class="icon">
<img :src="btnIconOriginalText" alt="" />
</div>
<div class="text">{{ "法案原文" }}</div>
</div>
<div class="btn3" @click="emit('open-analysis')"> <div class="btn3" @click="emit('open-analysis')">
<div class="icon"> <div class="icon">
<img :src="btnIconAnalysis" alt="" /> <img :src="btnIconAnalysis" alt="" />
...@@ -118,7 +103,6 @@ ...@@ -118,7 +103,6 @@
<script setup> <script setup>
import { computed } from "vue"; import { computed } from "vue";
import btnIconOriginalText from "@/views/thinkTank/ReportDetail/images/btn-icon1.png";
import btnIconAnalysis from "@/views/thinkTank/ReportDetail/images/btn-icon3.png"; import btnIconAnalysis from "@/views/thinkTank/ReportDetail/images/btn-icon3.png";
const props = defineProps({ const props = defineProps({
...@@ -150,7 +134,7 @@ const props = defineProps({ ...@@ -150,7 +134,7 @@ const props = defineProps({
const isLoading = computed(() => !props.billInfo || !props.billInfo.billName); const isLoading = computed(() => !props.billInfo || !props.billInfo.billName);
const emit = defineEmits(["tab-click", "open-original-text", "open-analysis"]); const emit = defineEmits(["tab-click", "open-analysis"]);
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -363,41 +347,6 @@ const emit = defineEmits(["tab-click", "open-original-text", "open-analysis"]); ...@@ -363,41 +347,6 @@ const emit = defineEmits(["tab-click", "open-original-text", "open-analysis"]);
justify-content: flex-end; justify-content: flex-end;
gap: 8px; gap: 8px;
.btn1 {
cursor: pointer;
width: 120px;
height: 36px;
box-sizing: border-box;
border: 1px solid rgba(230, 231, 232, 1);
border-radius: 6px;
background: rgba(255, 255, 255, 1);
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
height: 24px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
}
}
.btn3 { .btn3 {
cursor: pointer; cursor: pointer;
width: 120px; width: 120px;
......
...@@ -7,10 +7,9 @@ ...@@ -7,10 +7,9 @@
:defaultLogo="USALogo" :defaultLogo="USALogo"
:tabs="mainHeaderBtnList" :tabs="mainHeaderBtnList"
:activeTitle="activeTitle" :activeTitle="activeTitle"
:showTabs="!isBillOriginalTextPage" :showTabs="showHeaderTabs"
:showActions="!isBillOriginalTextPage" :showActions="showHeaderActions"
@tab-click="handleClickMainHeaderBtn" @tab-click="handleClickMainHeaderBtn"
@open-original-text="handleOpenBillOriginalText"
@open-analysis="handleAnalysisClick" @open-analysis="handleAnalysisClick"
/> />
...@@ -22,14 +21,13 @@ ...@@ -22,14 +21,13 @@
</template> </template>
<script setup> <script setup>
import { ref, onMounted, computed, watch } from "vue"; import { ref, onMounted, watch } from "vue";
import router from "@/router"; import router from "@/router";
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
import { getBillInfoGlobal } from "@/api/bill"; import { getBillInfoGlobal } from "@/api/bill";
import BillHeader from "./components/BillHeader.vue"; import BillHeader from "./components/BillHeader.vue";
const route = useRoute(); const route = useRoute();
const isBillOriginalTextPage = computed(() => route.path === "/billLayout/originalText");
import icon1 from "./assets/icons/icon1.svg"; import icon1 from "./assets/icons/icon1.svg";
import icon1Active from "./assets/icons/icon1_active.svg"; import icon1Active from "./assets/icons/icon1_active.svg";
...@@ -55,16 +53,6 @@ const getBillInfoGlobalFn = async () => { ...@@ -55,16 +53,6 @@ const getBillInfoGlobalFn = async () => {
} }
}; };
const handleOpenBillOriginalText = () => {
const targetRoute = router.resolve({
path: "/billLayout/originalText",
query: {
billId: route.query.billId
}
});
window.open(targetRoute.href, "_blank");
};
const mainHeaderBtnList = ref([ const mainHeaderBtnList = ref([
{ {
icon: icon1, icon: icon1,
...@@ -93,6 +81,8 @@ const mainHeaderBtnList = ref([ ...@@ -93,6 +81,8 @@ const mainHeaderBtnList = ref([
]); ]);
const activeTitle = ref("法案概况"); const activeTitle = ref("法案概况");
const showHeaderTabs = ref(true);
const showHeaderActions = ref(true);
const getActiveTitleByRoutePath = path => { const getActiveTitleByRoutePath = path => {
if (path.startsWith("/billLayout/deepDig")) return "深度挖掘"; if (path.startsWith("/billLayout/deepDig")) return "深度挖掘";
...@@ -102,8 +92,12 @@ const getActiveTitleByRoutePath = path => { ...@@ -102,8 +92,12 @@ const getActiveTitleByRoutePath = path => {
return "法案概况"; return "法案概况";
}; };
const syncActiveTitleFromRoute = () => { const syncHeaderStateFromRoute = () => {
const currentPath = route.path || "";
activeTitle.value = getActiveTitleByRoutePath(route.path); activeTitle.value = getActiveTitleByRoutePath(route.path);
const isVersionCompare = currentPath.startsWith("/billLayout/versionCompare");
showHeaderTabs.value = !isVersionCompare;
showHeaderActions.value = !isVersionCompare;
}; };
const handleClickMainHeaderBtn = item => { const handleClickMainHeaderBtn = item => {
...@@ -134,7 +128,7 @@ const handleAnalysisClick = () => { ...@@ -134,7 +128,7 @@ const handleAnalysisClick = () => {
onMounted(() => { onMounted(() => {
getBillInfoGlobalFn(); getBillInfoGlobalFn();
// 以当前路由为准,避免 sessionStorage 造成高亮错乱 // 以当前路由为准,避免 sessionStorage 造成高亮错乱
syncActiveTitleFromRoute(); syncHeaderStateFromRoute();
// 兜底:如果未来出现未知路由且有缓存,再用缓存 // 兜底:如果未来出现未知路由且有缓存,再用缓存
const cachedTitle = window.sessionStorage.getItem("activeTitle"); const cachedTitle = window.sessionStorage.getItem("activeTitle");
if (!activeTitle.value && cachedTitle) activeTitle.value = cachedTitle; if (!activeTitle.value && cachedTitle) activeTitle.value = cachedTitle;
...@@ -143,7 +137,7 @@ onMounted(() => { ...@@ -143,7 +137,7 @@ onMounted(() => {
watch( watch(
() => route.path, () => route.path,
() => { () => {
syncActiveTitleFromRoute(); syncHeaderStateFromRoute();
}, },
{ immediate: true } { immediate: true }
); );
......
...@@ -697,6 +697,7 @@ onMounted(() => { ...@@ -697,6 +697,7 @@ onMounted(() => {
right: 84px; right: 84px;
top: 15px; top: 15px;
.btn { .btn {
height: 28px; height: 28px;
padding: 0 8px; padding: 0 8px;
......
<template> <template>
<div class="process-overview-wrap"> <div class="process-overview-wrap">
<!-- <div class="box-header">
<div class="header-left"></div>
<div class="title">流程概要</div>
<div class="header-right">
<div class="icon">
<img src="@/assets/icons/box-header-icon2.png" alt="" />
</div>
<div class="icon">
<img src="@/assets/icons/box-header-icon3.png" alt="" />
</div>
</div>
</div>
<div class="main">
<div class="left" :style="{ width: (maxLineWidth + 250) + 'px' }">
<div class="top">
<div class="top-line" :style="{ width: lineWidth }">
<div class="top-line1"></div>
</div>
<div class="start">
<div class="icon">
<img src="./assets/images/logo1.png" alt="" />
</div>
<div class="name">{{ "参议院" }}</div>
</div>
<div class="content-box" :style="senateBoxStyle">
<div class="item-box" v-for="(item, index) in senateList" :key="item.id" style="width: 280px; flex-shrink: 0;">
<div class="item-box-dot">
<img src="./assets/images/top-line-dot.png" alt="" />
</div>
<div class="item-content">
<div class="item-header">
<div class="item-title" :title="item.actionTitle">
{{ item.actionTitle }} <span v-if="item.versionId">({{ item.versionId }})</span>
</div>
<div class="item-header-icon" @click="handleClickDetail(true, item, $event)">
<img src="./assets/images/item-header-icon.png" alt="" />
</div>
</div>
<div class="item-info" v-if="item.agreeVote !== null || item.disagreeVote !== null">
{{ (item.agreeVote || 0) + "赞成:" + (item.disagreeVote || 0) + "反对" }}
</div>
<div class="item-main" v-if="item.fynrList && item.fynrList.length">
<div class="item-main-item" v-for="(sub, subIndex) in item.fynrList" :key="subIndex">
<div class="icon"></div>
<CommonPrompt :content="sub">
<div class="text">{{ sub }}</div>
</CommonPrompt>
</div>
</div>
</div>
<div class="item-time">
{{ item.actionDate }}
</div>
</div>
</div>
</div>
<div class="bottom">
<div class="bottom-line" :style="{ width: lineWidth }">
<div class="bottom-line1"></div>
</div>
<div class="start">
<div class="name">{{ "众议院" }}</div>
<div class="icon">
<img src="./assets/images/logo2.png" alt="" />
</div>
</div>
<div class="content-box" :style="houseBoxStyle">
<div class="item-box" v-for="(item, index) in houseList" :key="item.id" style="width: 280px; flex-shrink: 0;">
<div class="item-time">
{{ item.actionDate }}
</div>
<div class="item-box-dot">
<img src="./assets/images/bottom-line-dot.png" alt="" />
</div>
<div class="item-content">
<div class="item-header">
<div class="item-title" :title="item.actionTitle">
{{ item.actionTitle }} <span v-if="item.versionId">({{ item.versionId }})</span>
</div>
<div class="item-header-icon" @click="handleClickDetail(true, item, $event)">
<img src="./assets/images/item-header-icon.png" alt="" />
</div>
</div>
<div class="item-info" v-if="item.agreeVote !== null || item.disagreeVote !== null">
{{ (item.agreeVote || 0) + "赞成:" + (item.disagreeVote || 0) + "反对" }}
</div>
<div class="item-main" v-if="item.fynrList && item.fynrList.length">
<div class="item-main-item" v-for="(sub, subIndex) in item.fynrList" :key="subIndex">
<div class="icon"></div>
<CommonPrompt :content="sub">
<div class="text">{{ sub }}</div>
</CommonPrompt>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="right" :style="{ left: rightPos }">
<div class="junction-dot">
<div class="inner-dot"></div>
</div>
<div class="right-line"></div>
</div>
</div>
</div> -->
<AnalysisBox title="流程概要" :showAllBtn="false"> <AnalysisBox title="流程概要" :showAllBtn="false">
<div class="main"> <div class="main">
<div class="left" :style="{ width: (maxLineWidth + 250) + 'px' }"> <div class="left" :style="{ width: (maxLineWidth + 250) + 'px' }">
...@@ -207,17 +99,6 @@ ...@@ -207,17 +99,6 @@
</div> </div>
</div> </div>
</div> </div>
<!-- <div class="footer">
<div class="footer-left">
<img src="./assets/icons/right-icon1.png" alt="" />
</div>
<div class="footer-center">
立法过程始于2025年2月共和党启动预算框架谈判,5月22日众议院以215:214的1票优势通过初始版本;随后参议院历经16小时全文朗读和马拉松式辩论,于7月1日以51:50的票数通过修订版(副总统万斯投关键票);因参议院版本大改(如永久化减税、提高债限至5万亿美元),法案重返众议院审议,经程序性投票(219:213)和最终表决(218:214),于7月3日深夜通过;特朗普在7月4日独立日签署生效,全程凸显两党对立、党内分歧及程序博弈。
</div>
<div class="footer-right">
<img src="./assets/icons/arrow-right.png" alt="" />
</div>
</div> -->
</AnalysisBox> </AnalysisBox>
<ProcessOverviewDetailDialog <ProcessOverviewDetailDialog
......
...@@ -29,7 +29,7 @@ const siderBtnList = ref([ ...@@ -29,7 +29,7 @@ const siderBtnList = ref([
path: '/billLayout/bill/background' path: '/billLayout/bill/background'
}, },
{ {
name: '内容概要', name: '法案原文',
path: '/billLayout/bill/template' path: '/billLayout/bill/template'
}, },
]) ])
...@@ -38,7 +38,7 @@ const siderBtnActive = ref("法案简介"); ...@@ -38,7 +38,7 @@ const siderBtnActive = ref("法案简介");
const getSiderActiveByRoutePath = path => { const getSiderActiveByRoutePath = path => {
if (path.includes("/billLayout/bill/background")) return "法案背景"; if (path.includes("/billLayout/bill/background")) return "法案背景";
if (path.includes("/billLayout/bill/template")) return "内容概要"; if (path.includes("/billLayout/bill/template")) return "法案原文";
return "法案简介"; return "法案简介";
}; };
......
...@@ -387,7 +387,7 @@ const handleChangeBill = val => { ...@@ -387,7 +387,7 @@ const handleChangeBill = val => {
}; };
const handleOpenVersionCompare = () => { const handleOpenVersionCompare = () => {
const targetUrl = `/billLayout/deepDig/processOverview?billId=${route.query.billId}`; const targetUrl = `/billLayout/versionCompare?billId=${route.query.billId}`;
window.open(targetUrl, "_blank"); window.open(targetUrl, "_blank");
}; };
...@@ -404,8 +404,8 @@ const handleGetBillList = async () => { ...@@ -404,8 +404,8 @@ const handleGetBillList = async () => {
billList.value = rawList billList.value = rawList
.map(item => { .map(item => {
return { return {
label: item.bbmc, label: item.contentZh,
value: item.bbmc value: item.contentZh
}; };
}) })
.filter(item => { .filter(item => {
......
<svg viewBox="0 0 13.5996 12.666" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="13.599609" height="12.666016" fill="none" customFrame="#000000">
<path id="矢量 455" d="M2 8.66667L2 10C1.99999 10.0416 2.00192 10.0831 2.00578 10.1245C2.00965 10.1659 2.01545 10.207 2.02317 10.2479C2.03089 10.2888 2.0405 10.3292 2.052 10.3691C2.0635 10.4091 2.07684 10.4484 2.09202 10.4872C2.1072 10.5259 2.12416 10.5638 2.14289 10.6009C2.16162 10.6381 2.18204 10.6742 2.20416 10.7095C2.22627 10.7447 2.24998 10.7788 2.27529 10.8118C2.3006 10.8448 2.32739 10.8765 2.35566 10.907C2.38394 10.9375 2.41358 10.9666 2.44458 10.9944C2.47558 11.0221 2.50781 11.0483 2.54126 11.073C2.57472 11.0977 2.60925 11.1208 2.64487 11.1423C2.68048 11.1637 2.71702 11.1835 2.75448 11.2016C2.79195 11.2196 2.83017 11.2359 2.86916 11.2503C2.90814 11.2648 2.94772 11.2775 2.98788 11.2882C3.02805 11.299 3.06863 11.3079 3.10963 11.3149C3.15063 11.3218 3.19186 11.3269 3.23333 11.33L3.33333 11.3333L5.33333 11.3333L5.33333 12.6667L3.33333 12.6667C3.246 12.6667 3.15887 12.6624 3.07195 12.6538C2.98504 12.6453 2.89875 12.6325 2.81309 12.6154C2.72743 12.5984 2.64282 12.5772 2.55924 12.5518C2.47566 12.5265 2.39353 12.4971 2.31284 12.4637C2.23216 12.4303 2.1533 12.393 2.07627 12.3518C1.99925 12.3106 1.92443 12.2658 1.85181 12.2173C1.77919 12.1687 1.70913 12.1168 1.64162 12.0614C1.57411 12.006 1.50947 11.9474 1.44771 11.8856C1.38596 11.8239 1.32738 11.7592 1.27197 11.6917C1.21657 11.6242 1.1646 11.5541 1.11608 11.4815C1.06756 11.4089 1.02271 11.3341 0.981543 11.2571C0.940373 11.18 0.903077 11.1012 0.869654 11.0205C0.836232 10.9398 0.806845 10.8577 0.781492 10.7741C0.75614 10.6905 0.734944 10.6059 0.717906 10.5202C0.700867 10.4346 0.688068 10.3483 0.679507 10.2614C0.670947 10.1745 0.666666 10.0873 0.666666 10L0.666666 8.66667L2 8.66667L2 8.66667ZM10.6667 5.33333L13.6 12.6667L12.1633 12.6667L11.3627 10.6667L8.636 10.6667L7.83667 12.6667L6.40067 12.6667L9.33333 5.33333L10.6667 5.33333L10.6667 5.33333ZM10 7.25667L9.16867 9.33333L10.83 9.33333L10 7.25667ZM4 0L4 1.33333L6.66667 1.33333L6.66667 6L4 6L4 8L2.66667 8L2.66667 6L0 6L0 1.33333L2.66667 1.33333L2.66667 0L4 0ZM10 0.666667C10.0873 0.666667 10.1745 0.670947 10.2614 0.679507C10.3483 0.688068 10.4346 0.700867 10.5202 0.717906C10.6059 0.734944 10.6905 0.75614 10.7741 0.781492C10.8577 0.806845 10.9398 0.836232 11.0205 0.869654C11.1012 0.903077 11.18 0.940373 11.2571 0.981543C11.3341 1.02271 11.4089 1.06756 11.4815 1.11608C11.5541 1.1646 11.6242 1.21657 11.6917 1.27197C11.7592 1.32738 11.8239 1.38596 11.8856 1.44772C11.9474 1.50947 12.006 1.57411 12.0614 1.64162C12.1168 1.70913 12.1687 1.77919 12.2173 1.85181C12.2658 1.92443 12.3106 1.99925 12.3518 2.07628C12.393 2.1533 12.4303 2.23216 12.4637 2.31284C12.4971 2.39353 12.5265 2.47566 12.5518 2.55924C12.5772 2.64282 12.5984 2.72743 12.6154 2.81309C12.6325 2.89875 12.6453 2.98504 12.6538 3.07195C12.6624 3.15887 12.6667 3.246 12.6667 3.33333L12.6667 4.66667L11.3333 4.66667L11.3333 3.33333C11.3333 3.28966 11.3312 3.2461 11.3269 3.20264C11.3226 3.15919 11.3162 3.11604 11.3077 3.07321C11.2992 3.03038 11.2886 2.98807 11.2759 2.94629C11.2632 2.9045 11.2486 2.86343 11.2318 2.82309C11.2151 2.78274 11.1965 2.74332 11.1759 2.7048C11.1553 2.66629 11.1329 2.62888 11.1086 2.59257C11.0844 2.55626 11.0584 2.52123 11.0307 2.48748C11.003 2.45372 10.9737 2.4214 10.9428 2.39052C10.9119 2.35965 10.8796 2.33036 10.8459 2.30265C10.8121 2.27495 10.7771 2.24897 10.7408 2.22471C10.7045 2.20045 10.667 2.17802 10.6285 2.15744C10.59 2.13685 10.5506 2.1182 10.5102 2.10149C10.4699 2.08478 10.4288 2.07009 10.387 2.05741C10.3453 2.04474 10.303 2.03414 10.2601 2.02562C10.2173 2.0171 10.1741 2.0107 10.1307 2.00642C10.0872 2.00214 10.0437 2 10 2L8 2L8 0.666667L10 0.666667L10 0.666667ZM2.66667 2.66667L1.33333 2.66667L1.33333 4.66667L2.66667 4.66667L2.66667 2.66667ZM5.33333 2.66667L4 2.66667L4 4.66667L5.33333 4.66667L5.33333 2.66667Z" fill="rgb(95,101,108)" fill-rule="nonzero" />
</svg>
差异被折叠。
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="box1"> <div class="box1">
<AnalysisBox title="相关政令" :showAllBtn="false"> <AnalysisBox title="相关政令" :showAllBtn="false">
<div class="box1-main"> <div class="box1-main">
<el-empty v-if="siderList.length===0" style="padding-top: 30%" description="暂无数据" :image-size="100" /> <el-empty v-if="!siderList?.length" style="padding-top: 40%;" description="暂无数据" :image-size="100" />
<el-scrollbar height="100%" always> <el-scrollbar height="100%" always>
<div class="left-item" :class="{ 'item-active': false }" v-for="(item, index) in siderList" :key="index" @click="handleClickDecree(item)"> <div class="left-item" :class="{ 'item-active': false }" v-for="(item, index) in siderList" :key="index" @click="handleClickDecree(item)">
<div class="item-head"> <div class="item-head">
...@@ -18,6 +18,7 @@ ...@@ -18,6 +18,7 @@
</div> </div>
<div class="box2"> <div class="box2">
<AnalysisBox title="政令关系挖掘" :showAllBtn="false"> <AnalysisBox title="政令关系挖掘" :showAllBtn="false">
<el-empty v-if="!siderList?.length" style="padding-top: 20%;" description="暂无数据" :image-size="100" />
<div class="box2-main"> <div class="box2-main">
<div ref="containerRef" class="graph-container"></div> <div ref="containerRef" class="graph-container"></div>
</div> </div>
......
...@@ -8,22 +8,16 @@ ...@@ -8,22 +8,16 @@
<div class="layout-main-header-left-box"> <div class="layout-main-header-left-box">
<div class="left-box-top"> <div class="left-box-top">
<div class="icon"> <div class="icon">
<img <img :src="summaryInfo.imageUrl || USALogo" alt="" />
v-if="summaryInfo.imageUrl"
:src="summaryInfo.imageUrl"
alt=""
style="height: 40px; margin-top: 12px"
/>
<img v-else :src="USALogo" alt="" />
</div> </div>
<div class="info"> <div class="info">
<div class="info-box1">{{ summaryInfo.name }}</div> <div class="info-box1 one-line-ellipsis">{{ summaryInfo.name || "--" }}</div>
<div class="info-box2"> <div class="info-box2">
<div class="info-box2-item item1">{{ summaryInfo.postDate }}</div> <div class="info-box2-item">{{ summaryInfo.postDate || "--" }}</div>
| |
<div class="info-box2-item item2">{{ summaryInfo.orgName }}</div> <div class="info-box2-item">{{ summaryInfo.orgName || "--" }}</div>
| |
<div class="info-box2-item item3">{{ summaryInfo.ename }}</div> <div class="info-box2-item one-line-ellipsis">{{ summaryInfo.ename || "--" }}</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -47,8 +41,8 @@ ...@@ -47,8 +41,8 @@
</div> </div>
<div class="layout-main-header-right-box"> <div class="layout-main-header-right-box">
<div class="right-box-top"> <div class="right-box-top">
<div class="time">{{ summaryInfo.postDate }}</div> <div class="time">{{ summaryInfo.postDate || "--" }}</div>
<div class="name">{{ summaryInfo.orgName }}</div> <div class="name">{{ summaryInfo.orgName || "--" }}</div>
</div> </div>
<div class="right-box-bottom"> <div class="right-box-bottom">
<div class="btn" @click="handleShowReport"> <div class="btn" @click="handleShowReport">
...@@ -203,12 +197,12 @@ const mainHeaderBtnList = ref([ ...@@ -203,12 +197,12 @@ const mainHeaderBtnList = ref([
name: "深度挖掘", name: "深度挖掘",
path: "/decreeLayout/deepDig" path: "/decreeLayout/deepDig"
}, },
// { {
// icon: icon3, icon: icon3,
// activeIcon: icon3Active, activeIcon: icon3Active,
// name: "影响分析", name: "影响分析",
// path: "/decreeLayout/influence" path: "/decreeLayout/influence"
// }, },
]); ]);
const activeTitle = ref("政令概况"); const activeTitle = ref("政令概况");
...@@ -377,9 +371,9 @@ onMounted(() => { ...@@ -377,9 +371,9 @@ onMounted(() => {
flex-direction: column; flex-direction: column;
.header-main { .header-main {
width: 100%; width: 100%;
background-color: #fff; border-bottom: 1px solid rgba(234, 236, 238, 1);
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
overflow: hidden; background: rgba(255, 255, 255, 1);
} }
.layout-main-header { .layout-main-header {
width: 1600px; width: 1600px;
...@@ -396,30 +390,32 @@ onMounted(() => { ...@@ -396,30 +390,32 @@ onMounted(() => {
margin: 0 auto; margin: 0 auto;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center;
} }
.layout-main-header-left-box { .layout-main-header-left-box {
width: 1100px; width: 20px;
margin-top: 13px; flex: auto;
margin-top: 12px;
.left-box-top { .left-box-top {
height: 64px; height: 64px;
display: flex; display: flex;
align-items: center; align-items: center;
.icon { .icon {
width: 64px; width: 64px;
height: 64px; height: 40px;
border-radius: 4px;
overflow: hidden; overflow: hidden;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
object-fit: fill;
} }
} }
.info { .info {
width: 700px; margin-left: 10px;
margin-left: 9px; margin-right: 40px;
width: 20px;
flex: auto;
.info-box1 { .info-box1 {
width: 700px; width: 100%;
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 20px; font-size: 20px;
...@@ -428,9 +424,6 @@ onMounted(() => { ...@@ -428,9 +424,6 @@ onMounted(() => {
letter-spacing: 0px; letter-spacing: 0px;
text-align: left; text-align: left;
margin-top: 5px; margin-top: 5px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} }
.info-box2 { .info-box2 {
margin-top: 5px; margin-top: 5px;
...@@ -444,15 +437,13 @@ onMounted(() => { ...@@ -444,15 +437,13 @@ onMounted(() => {
letter-spacing: 0px; letter-spacing: 0px;
text-align: left; text-align: left;
display: flex; display: flex;
margin-left: -10px;
.info-box2-item { .info-box2-item {
white-space: nowrap;
padding: 0 10px; padding: 0 10px;
} }
.item3 { .info-box2-item:first-child {
max-width: 420px; padding-left: 0px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} }
} }
} }
...@@ -498,9 +489,9 @@ onMounted(() => { ...@@ -498,9 +489,9 @@ onMounted(() => {
} }
} }
.layout-main-header-right-box { .layout-main-header-right-box {
width: 450px;
margin-top: 19px;
.right-box-top { .right-box-top {
white-space: nowrap;
padding-top: 11px;
.time { .time {
height: 24px; height: 24px;
line-height: 24px; line-height: 24px;
...@@ -710,49 +701,5 @@ onMounted(() => { ...@@ -710,49 +701,5 @@ onMounted(() => {
} }
} }
} }
// .tool-box {
// position: fixed;
// z-index: 10000;
// bottom: 80px;
// left: 0;
// width: 48px;
// height: 144px;
// border-radius: 0px 10px 10px 0px;
// box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
// background: rgba(255, 255, 255, 1);
// .tool1 {
// width: 17px;
// height: 18px;
// margin-top: 17px;
// margin-left: 16px;
// cursor: pointer;
// img {
// width: 100%;
// height: 100%;
// }
// }
// .tool2 {
// width: 22px;
// height: 20px;
// margin-top: 26px;
// margin-left: 14px;
// cursor: pointer;
// img {
// width: 100%;
// height: 100%;
// }
// }
// .tool3 {
// width: 20px;
// height: 20px;
// margin-top: 25px;
// margin-left: 15px;
// cursor: pointer;
// img {
// width: 100%;
// height: 100%;
// }
// }
// }
} }
</style> </style>
\ No newline at end of file
<template>
<div class="view-box">
<div class="icon-left">
<img src="../../assets/icons/ai.png" alt="">
</div>
<div class="tips-content">{{ props.tips }}</div>
<div class="icon-right">
<img src="../../assets/icons/right.png" alt="">
</div>
</div>
</template>
<script setup lang="ts" name="AiTips">
const props = defineProps({
tips: {
type: String,
default: ''
}
});
</script>
<style scoped lang="scss">
.view-box {
width: 100%;
display: flex;
align-items: center;
padding: 7px 12px;
border: 1px solid rgba(231, 243, 255, 1);
border-radius: 4px;
background: rgba(246, 250, 255, 1);
.icon-left {
width: 20px;
height: 20px;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
}
.tips-content {
color: rgb(5, 95, 194);
font-size: 16px;
font-weight: 400;
line-height: 24px;
margin-left: 13px;
flex: 1;
}
.icon-right {
width: 24px;
height: 24px;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
}
}
</style>
\ No newline at end of file
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</div> </div>
<div class="data-title">实体名称</div> <div class="data-title">实体名称</div>
<div style="height: 20px; flex: auto;"> <div style="height: 20px; flex: auto;">
<el-empty v-if="showCompanyList.length === 0" style="padding-top: 30%" description="暂无数据" :image-size="100" /> <el-empty v-if="!showCompanyList?.length" style="padding-top: 35%;" description="暂无数据" :image-size="100" />
<el-scrollbar height="100%" always> <el-scrollbar height="100%" always>
<div class="list-data"> <div class="list-data">
<div class="list-item" v-for="item in showCompanyList" :key="item.id" :class="{ 'item-active': activeEntityId === item.id }" @click="handleToCompanyDetail(item)"> <div class="list-item" v-for="item in showCompanyList" :key="item.id" :class="{ 'item-active': activeEntityId === item.id }" @click="handleToCompanyDetail(item)">
...@@ -75,19 +75,15 @@ ...@@ -75,19 +75,15 @@
</div> </div>
</div> </div>
</template> </template>
<div class="box2-main" v-if="contentType==1"> <div class="box2-main">
<AiTips :tips="tips" />
<div class="graph-box" v-if="contentType==1">
<ChartChain /> <ChartChain />
</div> </div>
<div class="box2-main" v-if="contentType==2"> <div class="graph-box" v-if="contentType==2">
<!-- <ChartRelation
:graph-data="graphData"
:tree-data="treeData"
:control-active="1"
@node-click="handleNodeClick"
@layout-change="handleLayoutChange"
/> -->
<GraphChart :nodes="testData.nodes" :links="testData.links" layoutType="force" /> <GraphChart :nodes="testData.nodes" :links="testData.links" layoutType="force" />
</div> </div>
</div>
</AnalysisBox> </AnalysisBox>
</div> </div>
</div> </div>
...@@ -101,9 +97,9 @@ import getBarChart from "./utils/barChart"; ...@@ -101,9 +97,9 @@ import getBarChart from "./utils/barChart";
import { getDecreeIndustry, getDecreehylyList, getDecreeCompany } from "@/api/decree/influence"; import { getDecreeIndustry, getDecreehylyList, getDecreeCompany } from "@/api/decree/influence";
import { getCnEntityOnChain, getChainInfoByDomainId } from "@/api/exportControl"; import { getCnEntityOnChain, getChainInfoByDomainId } from "@/api/exportControl";
import { getSingleSanctionEntitySupplyChain } from "@/api/exportControlV2.0"; import { getSingleSanctionEntitySupplyChain } from "@/api/exportControlV2.0";
import ChartChain from "./ChartChain.vue"; import ChartChain from "./com/ChartChain.vue";
import AiTips from "./com/AiTips.vue";
import GraphChart from "@/components/base/GraphChart/index.vue"; import GraphChart from "@/components/base/GraphChart/index.vue";
import ChartRelation from "./ChartRelation.vue";
import defaultIcon2 from "@/assets/icons/default-icon2.png"; import defaultIcon2 from "@/assets/icons/default-icon2.png";
import noticeIcon from "./assets/images/notice-icon.png"; import noticeIcon from "./assets/images/notice-icon.png";
import icon422 from "./assets/images/icon422.png"; import icon422 from "./assets/images/icon422.png";
...@@ -113,191 +109,65 @@ import icon1621 from "./assets/images/icon1621.png"; ...@@ -113,191 +109,65 @@ import icon1621 from "./assets/images/icon1621.png";
import company from "./assets/images/company.png"; import company from "./assets/images/company.png";
import companyActive from "./assets/images/company-active.png"; import companyActive from "./assets/images/company-active.png";
const tips = "这项政令标志着中美AI竞争进入一个新阶段,其核心特征是 “精准封锁”与“体系输出”相结合。它短期内无疑会给中国AI产业链带来压力,但长期看,这场竞争更可能是一场围绕技术路线、生态系统和治理规则的持久战。"
// 关系图数据 // 关系图数据
const testData = { const testData = {
// 节点数据 // 节点数据
nodes: [ nodes: [
{ id: 0, name: "泰丰先行", symbolSize: 60, symbol: `image://${company}`, x:0, y:0 },
{ id: 1, name: "国轩高科", symbolSize: 40, symbol: `image://${company}` },
{ id: 2, name: "智方纳米", symbolSize: 40, symbol: `image://${company}` },
{ id: 3, name: "香百科技", symbolSize: 40, symbol: `image://${company}` },
{ id: 4, name: "格林滨", symbolSize: 40, symbol: `image://${company}` },
{ id: 5, name: "江西紫宸", symbolSize: 40, symbol: `image://${company}` },
{ id: 6, name: "紫江企业", symbolSize: 40, symbol: `image://${company}` },
{ id: 7, name: "大而美法案", symbolSize: 40, symbol: `image://${company}` },
{ id: 8, name: "比亚迪", symbolSize: 40, symbol: `image://${company}` },
],
// 关系数据
links: [
{ {
id: 0, source: 1, target: 0,
name: "泰丰先行", label: { show: true, color: "#055FC2", backgroundColor: "#E7F3FF", borderWidth: 0, offset: [0, 15], formatter: '持股' },
// category: 0, lineStyle: { color: '#B9DCFF', type: "solid" }
symbolSize: 30,
value: 8,
symbol: `image://${company}`,
x: 50,
y: 10
},
{
id: 1,
name: "国轩高科",
// category: 0,
symbolSize: 30,
value: 9,
symbol: `image://${company}`,
x: 150,
y: 10
},
{
id: 2,
name: "智方纳米",
// category: 2,
symbolSize: 30,
value: 7,
symbol: `image://${company}`,
x: 250,
y: 10
},
{
id: 3,
name: "香百科技",
// category: 1,
symbolSize: 30,
value: 6,
symbol: `image://${company}`,
x: 350,
y: 10
},
{
id: 4,
name: "格林滨",
// category: 2,
symbolSize: 30,
value: 6,
symbol: `image://${company}`,
x: 450,
y: 10
},
{
id: 5,
name: "江西紫宸",
// category: 2,
symbolSize: 30,
value: 7,
symbol: `image://${company}`,
x: 550,
y: 10
},
{
id: 6,
name: "紫江企业",
// category: 4,
symbolSize: 30,
value: 6,
symbol: `image://${company}`,
x: 650,
y: 10
},
{
id: 7,
name: "大而美法案",
// category: 4,
symbolSize: 50,
value: 5,
symbol: `image://${company}`,
x: 300,
y: 200
},
{
id: 8,
name: "比亚迪",
// category: 0,
symbolSize: 30,
value: 10,
symbol: `image://${company}`,
x: 50,
y: 400
}, },
{ {
id: 9, source: 2, target: 0,
name: "铜陵有色", label: { show: true, color: "#055FC2", backgroundColor: "#E7F3FF", borderWidth: 0, offset: [0, 15], formatter: '持股' },
// category: 3, lineStyle: { color: '#B9DCFF', type: "solid" }
symbolSize: 30,
value: 8,
symbol: `image://${company}`,
x: 150,
y: 400
}, },
{ {
id: 10, source: 3, target: 0,
name: "长盛精密", label: { show: true, color: "#055FC2", backgroundColor: "#E7F3FF", borderWidth: 0, offset: [0, 15], formatter: '合作' },
// category: 1, lineStyle: { color: '#B9DCFF', type: "solid" }
symbolSize: 30,
value: 7,
symbol: `image://${company}`,
x: 250,
y: 400
}, },
{ {
id: 11, source: 4, target: 0,
name: "天合光能", label: { show: true, color: "#055FC2", backgroundColor: "#E7F3FF", borderWidth: 0, offset: [0, 15], formatter: '从属' },
// category: 0, lineStyle: { color: '#B9DCFF', type: "solid" }
symbolSize: 30,
value: 8,
symbol: `image://${company}`,
x: 350,
y: 400
}, },
{ {
id: 12, source: 5, target: 0,
name: "昆仑化学", label: { show: true, color: "#055FC2", backgroundColor: "#E7F3FF", borderWidth: 0, offset: [0, 15], formatter: '合作' },
// category: 2, lineStyle: { color: '#B9DCFF', type: "solid" }
symbolSize: 30,
value: 6,
symbol: `image://${company}`,
x: 250,
y: 400
}, },
{ {
id: 13, source: 6, target: 0,
name: "嘉源科技", label: { show: true, color: "#055FC2", backgroundColor: "#E7F3FF", borderWidth: 0, offset: [0, 15], formatter: '持股' },
// category: 1, lineStyle: { color: '#B9DCFF', type: "solid" }
symbolSize: 30,
value: 6,
symbol: `image://${company}`,
x: 450,
y: 400
}, },
{ {
id: 14, source: 7, target: 0,
name: "华阳集团", label: { show: true, color: "#055FC2", backgroundColor: "#E7F3FF", borderWidth: 0, offset: [0, 15], formatter: '合作' },
// category: 4, lineStyle: { color: '#B9DCFF', type: "solid" }
symbolSize: 30,
value: 7,
symbol: `image://${company}`,
x: 550,
y: 400
}, },
{ {
id: 15, source: 8, target: 0,
name: "海辰智能", label: { show: true, color: "#055FC2", backgroundColor: "#E7F3FF", borderWidth: 0, offset: [0, 15], formatter: '合作' },
// category: 1, lineStyle: { color: '#B9DCFF', type: "solid" }
symbolSize: 30,
value: 7,
symbol: `image://${company}`,
x: 650,
y: 400
}, },
], ],
// 关系数据
links: [
{ source: 1, target: 7, label: { show: true, formatter: '合作' } },
{ source: 2, target: 7, label: { show: true, formatter: '持股' } },
{ source: 3, target: 7, label: { show: true, formatter: '合作' } },
{ source: 4, target: 7, lineStyle: { type: 'dashed', color: '#d32f2f' }, label: { show: true, formatter: '从属' } },
{ source: 5, target: 7, label: { show: true, formatter: '合作' } },
{ source: 6, target: 7, label: { show: true, formatter: '持股' } },
{ source: 0, target: 7, label: { show: true, formatter: '持股' } },
{ source: 8, target: 7, label: { show: true, formatter: '合作' } },
{ source: 9, target: 7, lineStyle: { type: 'dashed', color: '#d32f2f' }, label: { show: true, formatter: '从属' } },
{ source: 10, target: 7, lineStyle: { type: 'dashed', color: '#d32f2f' }, label: { show: true, formatter: '合作' } },
{ source: 11, target: 7, label: { show: true, formatter: '合作' } },
{ source: 12, target: 7, label: { show: true, formatter: '合作' } },
{ source: 13, target: 7, label: { show: true, formatter: '合作' } },
{ source: 14, target: 7, label: { show: true, formatter: '合作' } },
{ source: 15, target: 7, label: { show: true, formatter: '合作', color: 'red', borderColor: 'red' } },
],
}; };
// 受影响实体 // 受影响实体
...@@ -374,7 +244,7 @@ const handleGetHylyList = async () => { ...@@ -374,7 +244,7 @@ const handleGetHylyList = async () => {
}; };
// 产业链/实体关系 // 产业链/实体关系
const contentType = ref(2); const contentType = ref(1);
const headerContentType = (type) => { const headerContentType = (type) => {
contentType.value = type; contentType.value = type;
}; };
...@@ -693,7 +563,7 @@ onMounted(() => { ...@@ -693,7 +563,7 @@ onMounted(() => {
align-items: flex-end; align-items: flex-end;
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 0 16px; padding: 0 20px;
.title-left { .title-left {
display: flex; display: flex;
border: 1px solid rgb(5, 95, 194); border: 1px solid rgb(5, 95, 194);
...@@ -734,6 +604,14 @@ onMounted(() => { ...@@ -734,6 +604,14 @@ onMounted(() => {
.box2-main { .box2-main {
width: 100%; width: 100%;
height: 100%; height: 100%;
display: flex;
flex-direction: column;
padding: 16px 20px;
.graph-box {
height: 20px;
flex: auto;
margin-top: 16px;
}
} }
} }
} }
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
<div class="box1-main"> <div class="box1-main">
<div class="box1-item" v-for="(item, index) in backgroundList" :key="index"> <div class="box1-item" v-for="(item, index) in backgroundList" :key="index">
<div class="id">{{ index + 1 }}</div> <div class="id">{{ index + 1 }}</div>
<div class="title">{{ item.content }}</div> <div class="title text-align-justify">{{ item.content }}</div>
<div class="open"> <div class="open">
<img src="./assets/images/open-icon.png" alt="" /> <img src="./assets/images/open-icon.png" alt="" />
</div> </div>
...@@ -37,14 +37,17 @@ ...@@ -37,14 +37,17 @@
<div class="box2-main"> <div class="box2-main">
<div class="custom-collapse"> <div class="custom-collapse">
<el-collapse v-model="dependActive"> <el-collapse v-model="dependActive">
<el-collapse-item v-for="(item, index) in dependList" :key="item.billId" title="Consistency" :name="item.billId"> <el-collapse-item v-for="(item, index) in dependList" :key="item.billId" :name="item.billId">
<template #icon> <template #icon>
<el-icon><ArrowDownBold /></el-icon> <el-icon v-if="dependActive.includes(item.billId)"><ArrowDownBold /></el-icon>
<el-icon v-else><ArrowUpBold /></el-icon>
</template> </template>
<template #title> <template #title>
<div class="custom-collapse-title"> <div class="custom-collapse-title">
<div class="custom-collapse-index">{{ index + 1 }}</div> <div class="custom-collapse-index">{{ index + 1 }}</div>
<div class="custom-collapse-name one-line-ellipsis">{{ item.title }}</div> <div class="custom-collapse-name one-line-ellipsis">
<span class="text-click-hover" @click.stop="handleClickDecree(item)">{{ item.title }}</span>
</div>
</div> </div>
</template> </template>
<div class="custom-collapse-content"> <div class="custom-collapse-content">
...@@ -192,6 +195,20 @@ const handleGetLaws = async () => { ...@@ -192,6 +195,20 @@ const handleGetLaws = async () => {
console.error("获取法律依据数据失败", error); console.error("获取法律依据数据失败", error);
} }
}; };
// 跳转科技法案详情页
const handleClickDecree = decree => {
window.sessionStorage.setItem("billId", decree.billId);
window.sessionStorage.setItem("curTabName", decree.title);
const route = router.resolve({
path: "/billLayout",
query: {
billId: decree.billId
}
});
console.log(route);
window.open(route.href, "_blank");
};
onMounted(() => { onMounted(() => {
handleGetBackground(); handleGetBackground();
...@@ -261,29 +278,31 @@ onMounted(() => { ...@@ -261,29 +278,31 @@ onMounted(() => {
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
display: flex; display: flex;
align-items: center; align-items: center;
padding: 12px 0; padding: 18px 0;
.id { .id {
margin-right: 16px;
margin-left: 15px; margin-left: 15px;
width: 24px; width: 24px;
height: 24px; height: 24px;
text-align: center; text-align: center;
line-height: 30px;
border-radius: 12px;
background: #e7f3ff; background: #e7f3ff;
color: #0a57a6; color: #0a57a6;
font-size: 15px;
line-height: 24px;
border-radius: 50%;
} }
.title { .title {
width: 914px; width: 20px;
line-height: 24px; flex: auto;
margin-left: 13px; line-height: 30px;
} }
.open { .open {
width: 16px; width: 16px;
height: 16px; height: 16px;
margin-left: 16px; margin: 0 16px;
img { img {
width: 100%; width: 100%;
...@@ -332,7 +351,8 @@ onMounted(() => { ...@@ -332,7 +351,8 @@ onMounted(() => {
.custom-collapse-title { .custom-collapse-title {
position: relative; position: relative;
.custom-collapse-index { .custom-collapse-index {
font-size: 15px; font-family: Microsoft YaHei;
font-size: var(--font-size-base);
position: absolute; position: absolute;
top: 12px; top: 12px;
left: -32px; left: -32px;
......
...@@ -37,9 +37,6 @@ ...@@ -37,9 +37,6 @@
<div class="item"> <div class="item">
<div class="item-left">{{ "相关领域:" }}</div> <div class="item-left">{{ "相关领域:" }}</div>
<div class="item-right tag-box"> <div class="item-right tag-box">
<!-- <div class="tag" v-for="(area, index) in basicInfo.areaList" :key="index">
{{ area.industryName }}
</div> -->
<AreaTag v-for="(area, index) in basicInfo.areaList" :key="index" :tagName="area.industryName"></AreaTag> <AreaTag v-for="(area, index) in basicInfo.areaList" :key="index" :tagName="area.industryName"></AreaTag>
</div> </div>
</div> </div>
...@@ -120,7 +117,7 @@ ...@@ -120,7 +117,7 @@
<img :src="item.avatar ? item.avatar : DefaultIcon1" alt="" /> <img :src="item.avatar ? item.avatar : DefaultIcon1" alt="" />
</div> </div>
<div class="box3-top-bottom-item-right"> <div class="box3-top-bottom-item-right">
<div class="name" @click="handleClickUser(item)">{{ item.name }}</div> <div class="name text-click-hover one-line-ellipsis" @click="handleClickUser(item)">{{ item.name }}</div>
<div class="position">{{ item.job }}</div> <div class="position">{{ item.job }}</div>
</div> </div>
</div> </div>
...@@ -336,22 +333,20 @@ onMounted(() => { ...@@ -336,22 +333,20 @@ onMounted(() => {
.box1-main { .box1-main {
display: flex; display: flex;
padding: 0 24px;
.box1-main-left { .box1-main-left {
width: 395px; width: 395px;
height: 332px; height: 332px;
margin-left: 24px;
img { img {
width: 100%; width: 100%;
// height: 100%;
} }
} }
.box1-main-left-img-mock { .box1-main-left-img-mock {
width: 240px; width: 240px;
height: 332px; height: 332px;
margin-left: 24px;
background-color: #0b1932; background-color: #0b1932;
display: flex; display: flex;
align-items: center; align-items: center;
...@@ -378,7 +373,8 @@ onMounted(() => { ...@@ -378,7 +373,8 @@ onMounted(() => {
} }
.box1-main-right { .box1-main-right {
width: 590px; width: 20px;
flex: auto;
margin-left: 20px; margin-left: 20px;
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
...@@ -387,24 +383,22 @@ onMounted(() => { ...@@ -387,24 +383,22 @@ onMounted(() => {
line-height: 24px; line-height: 24px;
.item { .item {
height: 30px;
display: flex; display: flex;
margin-bottom: 17px; margin-bottom: 22px;
.item-left { .item-left {
width: 100px; width: 100px;
} }
.item-right { .item-right {
width: 470px; width: 20px;
overflow: hidden; flex: auto;
text-overflow: ellipsis;
white-space: nowrap;
} }
.tag-box { .tag-box {
display: flex; display: flex;
gap: 8px; gap: 8px;
flex-wrap: wrap;
.tag { .tag {
height: 24px; height: 24px;
...@@ -423,6 +417,9 @@ onMounted(() => { ...@@ -423,6 +417,9 @@ onMounted(() => {
} }
.text { .text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-weight: normal !important; font-weight: normal !important;
} }
} }
...@@ -697,10 +694,6 @@ onMounted(() => { ...@@ -697,10 +694,6 @@ onMounted(() => {
line-height: 24px; line-height: 24px;
letter-spacing: 0px; letter-spacing: 0px;
text-align: left; text-align: left;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
} }
.position { .position {
......
差异被折叠。
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论