Skip to content

R
risk-monitor
提交 b75c2af0 authored 作者: 张烨's avatar 张烨
浏览文件
操作

style:政令原文页面优化

上级 0c925076
隐藏空白字符变更
内嵌 并排
正在显示 包含 330 行增加 和 155 行删除
src/api/decree/deepdig.js
浏览文件 @ b75c2af0
import request from "@/api/request.js"; import request from "@/api/request.js";
// 获取相关政令
/**
* @param { id }
*/
export function getDecreeRelatedOrder(params) {
return request({
method: 'GET',
url: `/api/administrativeOrderInfo/relatedOrder/${params.id}`,
params
})
}
// 根据政令ID获取领域公司信息 // 根据政令ID获取领域公司信息
/** /**
* @param {cRelated, id} * @param {cRelated, id}
......
src/views/decree/decreeLayout/deepdig/index.vue
浏览文件 @ b75c2af0
...@@ -3,14 +3,14 @@ ...@@ -3,14 +3,14 @@
<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-scrollbar height="100%" always> <el-scrollbar height="100%" always>
<el-empty v-if="siderList.length===0" style="padding-top: 240px" description="暂无数据" :image-size="100" /> <div class="left-item" :class="{ 'item-active': false }" v-for="(item, index) in siderList" :key="index" @click="handleClickSider(index)">
<div class="left-item" :class="{ 'item-active': siderActive===index }" v-for="(item, index) in siderList" :key="index" @click="handleClickSider(index)">
<div class="item-head"> <div class="item-head">
<div class="itme-name one-line-ellipsis">{{ item.name }}</div> <div class="itme-name one-line-ellipsis">{{ item.proposeOrgName }}</div>
<div class="item-tag">政令</div> <div class="item-tag">政令</div>
</div> </div>
<div class="itme-time one-line-ellipsis">{{ item.year }} · {{ "美国白宫" }} </div> <div class="itme-time one-line-ellipsis">{{ item.postDate }} · {{ item.name }} </div>
</div> </div>
</el-scrollbar> </el-scrollbar>
</div> </div>
...@@ -23,6 +23,17 @@ ...@@ -23,6 +23,17 @@
</div> </div>
</AnalysisBox> </AnalysisBox>
</div> </div>
<el-dialog v-model="dialogVisible" width="1280px" class="viewpoint-dialog" top="8vh">
<template #header>
<div class="viewpoint-header">
<div class="viewpoint-title">冲突关系</div>
</div>
</template>
<div class="viewpoint-body">
</div>
</el-dialog>
</div> </div>
</template> </template>
...@@ -30,119 +41,142 @@ ...@@ -30,119 +41,142 @@
import { ref, onMounted, onBeforeUnmount } from "vue"; import { ref, onMounted, onBeforeUnmount } from "vue";
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
import * as G6 from '@antv/g6'; import * as G6 from '@antv/g6';
import { getDecreeRelateOrder } from "@/api/decree/deepdig"; import { getDecreeRelatedOrder } from "@/api/decree/deepdig";
import { getDecreeSummary } from "@/api/decree/introduction";
import icon1628 from "./assets/icons/icon1628.png"; import icon1628 from "./assets/icons/icon1628.png";
import icon1629 from "./assets/icons/icon1629.png"; import icon1629 from "./assets/icons/icon1629.png";
const route = useRoute(); const route = useRoute();
// 冲突关系
const dialogVisible = ref(false);
// 基本信息
const basicInfo = ref({
id: '',
proposeOrgName: '',
isCenter: true
});
const onDecreeSummaryData = async () => {
// basicInfo.value = {proposeOrgName: "是事儿也就来一回儿一会儿就完事儿", id: route.query.id, isCenter: true}
try {
const res = await getDecreeSummary({id: route.query.id});
console.log("基本信息", res);
if (res.code===200 && res.data) {
basicInfo.value.proposeOrgName = res.data.name;
basicInfo.value.id = route.query.id;
}
} catch (error) {
basicInfo.value = {};
console.log("获取基本信息数据失败:", error);
}
};
// 相关政令 // 相关政令
const siderList = ref([]); const siderList = ref([]);
const siderActive = ref(0); const siderActive = ref(0);
const handleClickSider = async index => { const handleClickSider = async index => {
siderActive.value = index; siderActive.value = index;
dialogVisible.value = true;
}; };
const handleGetRelateOrder = async () => { const handleGetRelateOrder = async () => {
// siderList.value = [
// {id: 1, proposeOrgName: '天空飘来五个字那都不是事儿天空飘来五个字那都不是事儿1', postDate: '2022-01-01', name: 'name'},
// {id: 2, proposeOrgName: '天空飘来五个字那都不是事儿天空飘来五个字那都不是事儿2', postDate: '2022-01-02', name: 'name'},
// {id: 3, proposeOrgName: '天空飘来五个字那都不是事儿天空飘来五个字那都不是事儿3', postDate: '2022-01-03', name: 'name'},
// ]
try { try {
const res = await getDecreeRelateOrder({id: route.query.id}); const res = await getDecreeRelatedOrder({id: route.query.id});
console.log("相关政令", res); console.log("相关政令", res);
if (res.code===200 && res.data?.length) { if (res.code===200 && res.data?.length) {
siderList.value = res.data siderList.value = res.data
initChart(true)
} else { } else {
siderList.value = [] siderList.value = []
} }
} catch (error) { } catch (error) {
siderList.value = []; siderList.value = [];
console.log("获取相关政令数据失败:", error);
} }
}; };
// 政令关系挖掘 // 政令关系挖掘
const containerRef = ref(); const containerRef = ref();
let graphInstance = null; let graphInstance = null;
const onFormatNode = node => { const onFormatNode = (item) => {
// 判断文字数量大于8的在第八位后插入换行符 let isCenter = item.isCenter || false
if (node.label.length > 8) { // 判断文字每达到8个字插入换行符
let str = node.label const text = item.proposeOrgName.split('');
node.label = str.substring(0, 8) + "\n" + str.substring(8); let label = "";
for (let i = 0; i < text.length; i++) {
if (i % 8 === 0 && i !== 0) {
label += "\n";
}
label += text[i];
} }
} return {
const onFormatEdge = edge => { id: item.id+'', label, isCenter, size: 40,
edge.type = "line"; img: isCenter ? icon1628 : icon1629,
edge.label = ["", "相似", "继承", "冲突"][edge.status]; clipCfg: { show: true, type: "circle", r: isCenter ? 30 : 20 }, style: { cursor: "pointer" },
edge.style = { labelCfg: {
stroke: ["", "#B9DCFF", "#87E8DE", "#FFCCC7"][edge.status], position: "bottom", offset: 12,
lineWidth: 1, style: {
endArrow: true, fill: isCenter ? "#1459BB" : "#333333",
}; fontSize: isCenter ? 13 : 11,
edge.labelCfg = { fontWeight: isCenter ? "bold" : "normal",
autoRotate: true, fontFamily: "Microsoft YaHei",
style: { textAlign: "center"
fill: ["", "#055FC2", "#13A8A8", "#CE4F51"][edge.status],
fontSize: 10,
fontFamily: 'Microsoft YaHei',
background: {
fill: ["", "#E7F3FF", "#E6FFFB", "#FFE0E0"][edge.status],
padding: [2, 4, 2, 4],
radius: 2
} }
} }
}; }
} }
let data = { const onFormatEdge = (item, index) => {
nodes: [ return {
{ id: `edge-${index+1}`,
"id": "0", "label": "济南鑫银博电子设备有限公司", "img": icon1628, "size": 60, "isCenter": true, target: item.id+'',
"clipCfg": { "show": true, "type": "circle", "r": 30 }, source: route.query.id,
"style": { "cursor": "pointer" }, type: "line",
"labelCfg": { // label: ["", "相似", "继承", "冲突"][1],
"position": "bottom", "offset": 12, label: item.relation,
"style": { "fill": "#1459BB", "fontSize": 13, "fontWeight": "bold", "fontFamily": "Microsoft YaHei", "textAlign": "center" } style: {
}, stroke: ["", "#B9DCFF", "#87E8DE", "#FFCCC7"][1],
"name": "济南鑫银博电子设备有限公司", "image": "/src/views/decree/decreeLayout/influence/assets/images/company-active.png", "symbolSize": 60, "isSanctioned": true lineWidth: 1,
endArrow: true,
}, },
{ labelCfg: {
"id": "p-91320508MA1T9M2D39", "label": "苏州市创新产业发展引导基金（有限合伙）", "img": icon1629, "size": 40, "isCenter": false, autoRotate: true,
"clipCfg": { "show": true, "type": "circle", "r": 20 }, style: {
"style": { "cursor": "pointer" }, fill: ["", "#055FC2", "#13A8A8", "#CE4F51"][1],
"labelCfg": { fontSize: 10,
"position": "bottom", "offset": 12, fontFamily: 'Microsoft YaHei',
"style": { "fill": "#333", "fontSize": 11, "fontWeight": "normal", "fontFamily": "Microsoft YaHei", "textAlign": "center" } background: {
}, fill: ["", "#E7F3FF", "#E6FFFB", "#FFE0E0"][1],
"name": "苏州市创新产业发展引导基金（有限合伙）", "image": icon1629, "symbolSize": 40, "isSanctioned": false }, padding: [2, 4, 2, 4],
{ "id": "p-913706826806548758", "label": "烟台广源食品检测服务有限公司", "img": icon1629, "size": 40, "isCenter": false, "clipCfg": { "show": true, "type": "circle", "r": 20 }, "style": { "cursor": "pointer" }, "labelCfg": { "position": "bottom", "offset": 12, "style": { "fill": "#333", "fontSize": 11, "fontWeight": "normal", "fontFamily": "Microsoft YaHei", "textAlign": "center" } }, "name": "烟台广源食品检测服务有限公司", "image": icon1629, "symbolSize": 40, "isSanctioned": false }, radius: 2
{ "id": "p-12450000498506980D", "label": "南宁师范大学", "img": icon1629, "size": 40, "isCenter": false, "clipCfg": { "show": true, "type": "circle", "r": 20 }, "style": { "cursor": "pointer" }, "labelCfg": { "position": "bottom", "offset": 12, "style": { "fill": "#333", "fontSize": 11, "fontWeight": "normal", "fontFamily": "Microsoft YaHei", "textAlign": "center" } }, "name": "南宁师范大学", "image": icon1629, "symbolSize": 40, "isSanctioned": false }, }
{ "id": "p-914403007755864498", "label": "深圳市华为培训学院有限公司", "img": icon1629, "size": 40, "isCenter": false, "clipCfg": { "show": true, "type": "circle", "r": 20 }, "style": { "cursor": "pointer" }, "labelCfg": { "position": "bottom", "offset": 12, "style": { "fill": "#333", "fontSize": 11, "fontWeight": "normal", "fontFamily": "Microsoft YaHei", "textAlign": "center" } }, "name": "深圳市华为培训学院有限公司", "image": icon1629, "symbolSize": 40, "isSanctioned": false }, }
{ "id": "p-91230183MAD46C3N7A", "label": "尚志市聚源新能源有限公司", "img": icon1629, "size": 40, "isCenter": false, "clipCfg": { "show": true, "type": "circle", "r": 20 }, "style": { "cursor": "pointer" }, "labelCfg": { "position": "bottom", "offset": 12, "style": { "fill": "#333", "fontSize": 11, "fontWeight": "normal", "fontFamily": "Microsoft YaHei", "textAlign": "center" } }, "name": "尚志市聚源新能源有限公司", "image": icon1629, "symbolSize": 40, "isSanctioned": false }, }
{ "id": "p-12100000400012211J", "label": "中国科学院高能物理研究所", "img": icon1629, "size": 40, "isCenter": false, "clipCfg": { "show": true, "type": "circle", "r": 20 }, "style": { "cursor": "pointer" }, "labelCfg": { "position": "bottom", "offset": 12, "style": { "fill": "#333", "fontSize": 11, "fontWeight": "normal", "fontFamily": "Microsoft YaHei", "textAlign": "center" } }, "name": "中国科学院高能物理研究所", "image": icon1629, "symbolSize": 40, "isSanctioned": false } }
],
edges: [
{ "id": "edge-0", "target": "p-91320508MA1T9M2D39", "source": "0", "status": 1 },
{ "id": "edge-1", "target": "p-913706826806548758", "source": "0", "status": 1 },
{ "id": "edge-2", "target": "p-12450000498506980D", "source": "0", "status": 2 },
{ "id": "edge-3", "target": "p-914403007755864498", "source": "0", "status": 3 },
{ "id": "edge-4", "target": "p-91230183MAD46C3N7A", "source": "0", "status": 2 },
{ "id": "edge-5", "target": "p-12100000400012211J", "source": "0", "status": 3 }
]
} }
const initChart = (first=false) => { const initChart = () => {
let edgeList = siderList.value.map(onFormatEdge)
let nodeList = siderList.value.map(onFormatNode)
nodeList.unshift(onFormatNode(basicInfo.value))
const width = containerRef.value.offsetWidth || 800 const width = containerRef.value.offsetWidth || 800
const height = containerRef.value.offsetHeight || 600 const height = containerRef.value.offsetHeight || 600
const centerX = width / 2 const centerX = width / 2
const centerY = height / 2 const centerY = height / 2
const radius = Math.min(width, height) / 2 - 120 const radius = Math.min(width, height) / 2 - 120
data.edges.forEach(onFormatEdge) const otherNodes = nodeList.filter(n => !n.isCenter)
data.nodes.forEach(onFormatNode)
const otherNodes = data.nodes.filter(n => !n.isCenter)
const nodeCount = otherNodes.length const nodeCount = otherNodes.length
otherNodes.forEach((node, index) => { otherNodes.forEach((node, index) => {
const angle = (2 * Math.PI * index) / nodeCount - Math.PI / 2 const angle = (2 * Math.PI * index) / nodeCount - Math.PI / 2
node.x = centerX + radius * Math.cos(angle) node.x = centerX + radius * Math.cos(angle)
node.y = centerY + radius * Math.sin(angle) node.y = centerY + radius * Math.sin(angle)
}) })
const centerNode = data.nodes.find(n => n.isCenter) const centerNode = nodeList.find(n => n.isCenter)
if (centerNode) { if (centerNode) {
centerNode.x = centerX centerNode.x = centerX
centerNode.y = centerY centerNode.y = centerY
...@@ -150,65 +184,68 @@ const initChart = (first=false) => { ...@@ -150,65 +184,68 @@ const initChart = (first=false) => {
centerNode.fy = centerY centerNode.fy = centerY
} }
if (first) { console.log("节点列表", nodeList)
graphInstance = new G6.Graph({ console.log("边列表", edgeList)
container: containerRef.value,
width, graphInstance = new G6.Graph({
height, container: containerRef.value,
fitView: false, width,
fitCenter: false, height,
animate: true, fitView: false,
animateCfg: { fitCenter: false,
duration: 300, animate: true,
easing: 'easeLinear' animateCfg: {
}, duration: 300,
minZoom: 0.1, easing: 'easeLinear'
maxZoom: 10, },
modes: { minZoom: 0.1,
default: [ maxZoom: 10,
'drag-canvas', modes: {
'zoom-canvas', default: [
'drag-node', 'drag-canvas',
] 'zoom-canvas',
'drag-node',
]
},
defaultNode: {
type: 'image',
size: 40,
clipCfg: {
show: true,
type: 'circle',
r: 20
}, },
defaultNode: { labelCfg: {
type: 'image', position: 'bottom',
size: 40, offset: 10,
clipCfg: { style: {
show: true, fill: '#333',
type: 'circle', fontSize: 11,
r: 20 fontFamily: 'Microsoft YaHei',
}, textAlign: 'center',
labelCfg: { background: {
position: 'bottom', fill: 'rgba(255, 255, 255, 0.95)',
offset: 10, padding: [4, 6, 4, 6],
style: { radius: 4
fill: '#333', },
fontSize: 11,
fontFamily: 'Microsoft YaHei',
textAlign: 'center',
background: {
fill: 'rgba(255, 255, 255, 0.95)',
padding: [4, 6, 4, 6],
radius: 4
},
}
} }
}, }
}) },
})
// 节点点击处理 // 节点点击处理
graphInstance.on('node:click', (evt) => { graphInstance.on('node:click', (evt) => {
console.log('节点详情:', evt.item); console.log('节点详情:', evt.item);
}); });
}
graphInstance.data(data) graphInstance.data({nodes: nodeList, edges: edgeList})
graphInstance.render() graphInstance.render()
} }
onMounted(() => { onMounted(() => {
handleGetRelateOrder(); Promise.all([onDecreeSummaryData(), handleGetRelateOrder()]).then(() => {
if (basicInfo.value.id && siderList.value.length) initChart()
})
}); });
onBeforeUnmount(() => { onBeforeUnmount(() => {
...@@ -218,17 +255,19 @@ onBeforeUnmount(() => { ...@@ -218,17 +255,19 @@ onBeforeUnmount(() => {
<style lang="scss" scoped> <style lang="scss" scoped>
.wrap { .wrap {
min-height: 845px; height: 100%;
width: 1600px; width: 1600px;
margin: 16px auto; padding: 16px 0;
display: flex; display: flex;
gap: 16px; gap: 16px;
margin: 0 auto;
.box1 { .box1 {
width: 480px; width: 480px;
.box1-main { .box1-main {
padding: 10px 16px; padding: 10px 16px;
height: 100%;
.left-item { .left-item {
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
...@@ -310,6 +349,108 @@ onBeforeUnmount(() => { ...@@ -310,6 +349,108 @@ onBeforeUnmount(() => {
} }
} }
// 修改element-plus弹出框样式
:deep(.viewpoint-dialog) {
height: 750px;
padding: 0;
border-radius: 4px;
.el-dialog__body {
padding: 0;
}
.el-dialog__header {
padding: 0;
margin: 0;
position: relative;
height: 48px;
}
.el-dialog__headerbtn {
top: 50%;
transform: translateY(-50%);
right: 12px;
}
.viewpoint-header {
width: 761px;
height: 48px;
display: flex;
align-items: center;
padding: 0 24px;
border-bottom: 1px solid rgb(234, 236, 238);
}
.viewpoint-title {
font-size: 16px;
font-weight: 700;
font-family: "Microsoft YaHei";
line-height: 24px;
}
.viewpoint-body {
padding: 24px 24px 35px 24px;
height: calc(669px - 48px);
box-sizing: border-box;
overflow: hidden;
.viewpoint-body-title {
font-size: 28px;
font-weight: 700;
font-family: "Microsoft YaHei";
line-height: 37px;
color: rgb(59, 65, 75);
margin-bottom: 32px;
}
.viewpoint-item {
width: 713px;
min-height: 81px;
display: block;
margin-bottom: 12px;
position: relative;
padding-left: 48px;
.viewpoint-item-img {
position: absolute;
top: 0;
left: -10px;
width: 42px;
height: 42px;
}
.viewpoint-item-content {
width: 665px;
min-height: 81px;
background-image: url("./assets/bg01.png");
background-size: 100% 100%;
position: relative;
top: 0;
left: 0;
padding-left: 23px;
padding-top: 12px;
padding-bottom: 13px;
box-sizing: border-box;
.viewpoint-item-name {
font-size: 16px;
font-weight: 700;
font-family: "Microsoft YaHei";
line-height: 24px;
color: rgb(59, 65, 75);
margin-bottom: 5px;
}
.viewpoint-item-desc {
font-size: 16px;
font-weight: 400;
font-family: "Microsoft YaHei";
line-height: 24px;
color: rgb(59, 65, 75);
}
.viewpoint-item-job {
position: absolute;
top: 8px;
right: 22px;
font-size: 16px;
font-weight: 400;
font-family: "Microsoft YaHei";
line-height: 30px;
color: rgb(132, 136, 142);
}
}
}
}
}
// 修改element-plus滚动条样式 // 修改element-plus滚动条样式
:deep(.el-scrollbar__bar.is-vertical) { :deep(.el-scrollbar__bar.is-vertical) {
right: 0px; right: 0px;
......
src/views/decree/decreeLayout/index.vue
浏览文件 @ b75c2af0
...@@ -60,12 +60,12 @@ ...@@ -60,12 +60,12 @@
</div> </div>
<div class="text">{{ "政令原文" }}</div> <div class="text">{{ "政令原文" }}</div>
</div> </div>
<div class="btn" @click="handleToInstitution"> <!-- <div class="btn" @click="handleToInstitution">
<div class="icon"> <div class="icon">
<img src="./assets/icons/link-icon.png" alt="" /> <img src="./assets/icons/link-icon.png" alt="" />
</div> </div>
<div class="text">{{ "查看官网" }}</div> <div class="text">{{ "查看官网" }}</div>
</div> </div> -->
<div class="btn-active" @click="handleAnalysisClick"> <div class="btn-active" @click="handleAnalysisClick">
<div class="icon-active"> <div class="icon-active">
<img src="./assets/icons/edit-icon.png" alt="" /> <img src="./assets/icons/edit-icon.png" alt="" />
...@@ -386,11 +386,10 @@ onMounted(() => { ...@@ -386,11 +386,10 @@ onMounted(() => {
} }
.layout-main { .layout-main {
width: 100%; width: 100%;
overflow-y: auto; height: 100%;
display: flex;
flex-direction: column;
.header-main { .header-main {
position: sticky;
top: 0;
z-index: 1000;
width: 100%; width: 100%;
background-color: #fff; background-color: #fff;
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05);
...@@ -625,6 +624,9 @@ onMounted(() => { ...@@ -625,6 +624,9 @@ onMounted(() => {
} }
} }
.layout-main-center { .layout-main-center {
height: 20px;
flex: auto;
background-color: #f7f8f9;
} }
} }
.layout-report-box { .layout-report-box {
......
src/views/decree/decreeLayout/influence/ChartChain.vue
浏览文件 @ b75c2af0
...@@ -379,7 +379,7 @@ onMounted(() => { ...@@ -379,7 +379,7 @@ onMounted(() => {
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow-x: auto; overflow-x: auto;
overflow-y: hidden; overflow-y: auto;
scrollbar-width: thin; scrollbar-width: thin;
scrollbar-color: rgba(144, 202, 249, 0.5) transparent; scrollbar-color: rgba(144, 202, 249, 0.5) transparent;
......
src/views/decree/decreeLayout/influence/index.vue
浏览文件 @ b75c2af0
...@@ -16,8 +16,8 @@ ...@@ -16,8 +16,8 @@
</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-scrollbar height="100%" always> <el-scrollbar height="100%" always>
<el-empty v-if="showCompanyList.length === 0" style="padding-top: 240px" description="暂无数据" :image-size="100" />
<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)">
<div class="item-icon"> <div class="item-icon">
...@@ -185,7 +185,7 @@ const handleGetHylyList = async () => { ...@@ -185,7 +185,7 @@ const handleGetHylyList = async () => {
}; };
// 产业链/实体关系 // 产业链/实体关系
const contentType = ref(2); const contentType = ref(1);
const headerContentType = (type) => { const headerContentType = (type) => {
contentType.value = type; contentType.value = type;
}; };
...@@ -366,11 +366,12 @@ onMounted(() => { ...@@ -366,11 +366,12 @@ onMounted(() => {
<style lang="scss" scoped> <style lang="scss" scoped>
.wrapper { .wrapper {
min-height: 845px; height: 100%;
width: 1600px; width: 1600px;
margin: 16px auto; padding: 16px 0;
display: flex; display: flex;
gap: 16px; gap: 16px;
margin: 0 auto;
.box1 { .box1 {
width: 480px; width: 480px;
...@@ -408,9 +409,7 @@ onMounted(() => { ...@@ -408,9 +409,7 @@ onMounted(() => {
} }
.list-data { .list-data {
height: 480px;
width: 446px; width: 446px;
margin: 0 auto;
.list-item { .list-item {
display: flex; display: flex;
......
src/views/decree/decreeLayout/overview/background/index.vue
浏览文件 @ b75c2af0
...@@ -66,10 +66,10 @@ ...@@ -66,10 +66,10 @@
<div> <div>
<div class="time-line-top"> <div class="time-line-top">
<div class="time-line-date">{{ item.postDate }}</div> <div class="time-line-date">{{ item.postDate }}</div>
<div class="time-line-icon"> <div class="time-line-icon" @click="handleToInstitution(item)">
<img style="width: 100%; height: 100%;" :src="item.orgImage || DefaultIcon1" alt=""> <img style="width: 100%; height: 100%;" :src="item.orgImage || DefaultIcon1" alt="">
</div> </div>
<div class="time-line-name">{{ item.proposeOrgName }}</div> <div class="time-line-name" @click="handleToInstitution(item)">{{ item.proposeOrgName }}</div>
</div> </div>
<div class="timeline-content">{{ item.describe }}</div> <div class="timeline-content">{{ item.describe }}</div>
</div> </div>
...@@ -86,6 +86,7 @@ ...@@ -86,6 +86,7 @@
import { ref, onMounted } from "vue"; import { ref, onMounted } from "vue";
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
import { getDecreeBackground, getDecreeDepend, getDecreePrev } from "@/api/decree/background"; import { getDecreeBackground, getDecreeDepend, getDecreePrev } from "@/api/decree/background";
import router from "@/router";
import DefaultIcon1 from "@/assets/icons/default-icon1.png"; import DefaultIcon1 from "@/assets/icons/default-icon1.png";
...@@ -160,6 +161,17 @@ const handleGetPrev = async () => { ...@@ -160,6 +161,17 @@ const handleGetPrev = async () => {
console.error("获取前序政令数据失败", error); console.error("获取前序政令数据失败", error);
} }
}; };
// 跳转行政机构主页
const handleToInstitution = item => {
window.sessionStorage.setItem("curTabName", item.proposeOrgName);
const curRoute = router.resolve({
path: "/institution",
query: {
id: item.id
}
});
window.open(curRoute.href, "_blank");
};
// 法律依据 // 法律依据
const dependList = ref([]); const dependList = ref([]);
...@@ -191,7 +203,7 @@ onMounted(() => { ...@@ -191,7 +203,7 @@ onMounted(() => {
.introduction-wrap { .introduction-wrap {
display: flex; display: flex;
width: 1600px; width: 1600px;
height: 100%; height: 901px;
padding: 16px 0; padding: 16px 0;
gap: 16px; gap: 16px;
...@@ -386,11 +398,13 @@ onMounted(() => { ...@@ -386,11 +398,13 @@ onMounted(() => {
overflow: hidden; overflow: hidden;
border-radius: 50%; border-radius: 50%;
font-size: 0px; font-size: 0px;
cursor: pointer;
} }
.time-line-name { .time-line-name {
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
font-size: 15px; font-size: 15px;
cursor: pointer;
} }
} }
......
src/views/decree/decreeLayout/overview/index.vue
浏览文件 @ b75c2af0
...@@ -74,7 +74,6 @@ onMounted(() => { ...@@ -74,7 +74,6 @@ onMounted(() => {
<style lang="scss" scoped> <style lang="scss" scoped>
.decree-overview-wrap { .decree-overview-wrap {
width: 100%; width: 100%;
height: 100%;
overflow: hidden; overflow: hidden;
background: rgba(247, 248, 249, 1); background: rgba(247, 248, 249, 1);
display: flex; display: flex;
......
src/views/decree/decreeLayout/overview/introduction/index.vue
浏览文件 @ b75c2af0
...@@ -314,7 +314,7 @@ onMounted(() => { ...@@ -314,7 +314,7 @@ onMounted(() => {
<style lang="scss" scoped> <style lang="scss" scoped>
.page-box { .page-box {
height: 100%; height: 901px;
width: 1600px; width: 1600px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
......
src/views/decree/decreeLayout/overview/measures/index.vue
浏览文件 @ b75c2af0
...@@ -213,7 +213,11 @@ const contentList = ref([ ...@@ -213,7 +213,11 @@ const contentList = ref([
const ALPHABET = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"]; const ALPHABET = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"];
const onMainContentData = async () => { const onMainContentData = async () => {
try { try {
const res = await getDecreeMainContent({id: route.query.id, keyword: commandWord.value}); const res = await getDecreeMainContent({
id: route.query.id,
keyword: commandWord.value,
domainId: areaType.value
});
console.log("主要指令", res); console.log("主要指令", res);
if (res && res.code === 200) { if (res && res.code === 200) {
contentList.value = res.data; contentList.value = res.data;
......
src/views/decree/decreeOriginal/index.vue
浏览文件 @ b75c2af0
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
<el-scrollbar height="100%" v-else> <el-scrollbar height="100%" v-else>
<div v-for="(item, index) in reportData" :key="index" :class="['content-row', {'high-light':isHighlight}]"> <div v-for="(item, index) in reportData" :key="index" :class="['content-row', {'high-light':isHighlight}]">
<!-- 右侧：中文 --> <!-- 右侧：中文 -->
<div class="content-cn" v-html="item.content"></div> <div :class="['content-cn', {'translate-cn':!isTranslate}]" v-html="item.content"></div>
<!-- 左侧：英文 --> <!-- 左侧：英文 -->
<div class="content-en" v-html="item.contentEn" v-if="isTranslate"></div> <div class="content-en" v-html="item.contentEn" v-if="isTranslate"></div>
</div> </div>
...@@ -99,11 +99,13 @@ const handleGetReport = async () => { ...@@ -99,11 +99,13 @@ const handleGetReport = async () => {
const res = await getDecreeReport({id: route.query.id}); const res = await getDecreeReport({id: route.query.id});
console.log("报告原文", res); console.log("报告原文", res);
if (res.code === 200 && res.data) { if (res.code === 200 && res.data) {
reportData.value = [{ reportData.value = [
content: "设立第二紧急委员会（以下简称“委员会”）。自2026年1月16日美国东部<span>标准时间</span>凌晨12:01起，成立一个由一名主席和两名成员组成的<span>委员会</span>，所有成员均由总统任命，负责调查并报告这些争议。任何成员均不得在任何铁路员工组织或任何铁路承运人中拥有经济或其他利益关系。委员会的运作取决于资金的可用性。", // {
contentEn: "Establishment of a Second <span>Emergency</span> Board (Board). There is established, effective 12:01 a.m. eastern standard time on <span>January 16</span>, 2026, a Board composed of a chair and two other members, all of whom shall be appointed by the President to investigate and report on these disputes. No member shall be pecuniarily or otherwise interested in any organization of railroad employees or any carrier. The Board shall perform its functions subject to the availability of funds.", // content: "设立第二紧急委员会（以下简称“委员会”）。自2026年1月16日美国东部<span>标准时间</span>凌晨12:01起，成立一个由一名主席和两名成员组成的<span>委员会</span>，所有成员均由总统任命，负责调查并报告这些争议。任何成员均不得在任何铁路员工组织或任何铁路承运人中拥有经济或其他利益关系。委员会的运作取决于资金的可用性。",
num: 0, // contentEn: "Establishment of a Second <span>Emergency</span> Board (Board). There is established, effective 12:01 a.m. eastern standard time on <span>January 16</span>, 2026, a Board composed of a chair and two other members, all of whom shall be appointed by the President to investigate and report on these disputes. No member shall be pecuniarily or otherwise interested in any organization of railroad employees or any carrier. The Board shall perform its functions subject to the availability of funds.",
}]; // num: 0,
// }
];
let num = Math.max(res.data.content.length, res.data.contentEn.length) let num = Math.max(res.data.content.length, res.data.contentEn.length)
for (let i = 0; i < num; i++) { for (let i = 0; i < num; i++) {
let obj = { let obj = {
...@@ -154,9 +156,8 @@ onMounted(() => { ...@@ -154,9 +156,8 @@ onMounted(() => {
margin: 0 auto; margin: 0 auto;
.icon { .icon {
width: 122px; width: 64px;
height: 64px; height: 40px;
border-radius: 4px;
overflow: hidden; overflow: hidden;
img { img {
...@@ -166,7 +167,7 @@ onMounted(() => { ...@@ -166,7 +167,7 @@ onMounted(() => {
} }
.info { .info {
margin-left: 16px; margin-left: 10px;
margin-right: 40px; margin-right: 40px;
width: 20px; width: 20px;
flex: auto; flex: auto;
...@@ -289,7 +290,7 @@ onMounted(() => { ...@@ -289,7 +290,7 @@ onMounted(() => {
height: 20px; height: 20px;
flex: auto; flex: auto;
box-sizing: border-box; box-sizing: border-box;
overflow-y: auto; padding-top: 10px;
// 滚动条样式 // 滚动条样式
&::-webkit-scrollbar { &::-webkit-scrollbar {
...@@ -332,7 +333,7 @@ onMounted(() => { ...@@ -332,7 +333,7 @@ onMounted(() => {
.content-cn { .content-cn {
width: 50%; width: 50%;
flex: auto; flex: auto;
padding: 24px 0; padding-bottom: 40px;
box-sizing: border-box; box-sizing: border-box;
font-size: 16px; font-size: 16px;
line-height: 1.8; line-height: 1.8;
...@@ -341,6 +342,9 @@ onMounted(() => { ...@@ -341,6 +342,9 @@ onMounted(() => {
text-align: justify; text-align: justify;
white-space: pre-wrap; // 保留换行格式 white-space: pre-wrap; // 保留换行格式
} }
.translate-cn {
padding-bottom: 10px;
}
} }
} }
} }
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论