Skip to content

R
risk-monitor
提交 ade37250 authored 作者: 李智林's avatar 李智林
浏览文件
操作

法案详情页面的接口联调和样式优化

上级 a0e74460
全部展开 隐藏空白字符变更
内嵌 并排
正在显示 包含 259 行增加 和 154 行删除
src/api/deepdig.js
浏览文件 @ ade37250
...@@ -94,4 +94,39 @@ export function getProcessSummary(params) { ...@@ -94,4 +94,39 @@ export function getProcessSummary(params) {
url: `/api/billDeepDive/processSummary/${params.id}`, url: `/api/billDeepDive/processSummary/${params.id}`,
params, params,
}) })
} }
\ No newline at end of file
// 获取党派政治献金
/**
* @param {id, personCongress}
*/
export function getBillPoliContribution(params) {
return request({
method: 'GET',
url: `/api/billDeepDive/processAnalyze/totalxj/${params.id}`,
params
})
}
// 获取主要议员政治献金
/**
* @param {id, personCongress}
*/
export function getBillMainPoliContribution(params) {
return request({
method: 'GET',
url: `/api/billDeepDive/processAnalyze/xj/${params.id}`,
params
})
}
// 根据法案ID获取人员政治献金来源及行业领域分布
/**
* @param {id, personId}
*/
export function getBillPersonPoliContribution(params) {
return request({
method: 'GET',
url: `/api/billDeepDive/processAnalyze/xj/${params.id}/${params.personId}`
})
}
src/api/influence.js
浏览文件 @ ade37250
...@@ -30,4 +30,17 @@ export function getHylyList() { ...@@ -30,4 +30,17 @@ export function getHylyList() {
method: 'GET', method: 'GET',
url: `/api/billImpactAnalysis/industry/hylyList`, url: `/api/billImpactAnalysis/industry/hylyList`,
}) })
}
// 获取公司详情
/**
* @param {billId,companyId,id}
*/
export function getCompanyDetail(params) {
return request({
method: 'GET',
url: `/api/billImpactAnalysis/industry/companyDetail/${params.billId}/${params.id}/${params.companyId}`,
params,
})
} }
\ No newline at end of file
src/views/bill/billHome/index.vue
浏览文件 @ ade37250
...@@ -2523,6 +2523,7 @@ onUnmounted(() => {}); ...@@ -2523,6 +2523,7 @@ onUnmounted(() => {});
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
line-height: 22px; line-height: 22px;
overflow: hidden;
} }
} }
.right-footer { .right-footer {
...@@ -2606,6 +2607,7 @@ onUnmounted(() => {}); ...@@ -2606,6 +2607,7 @@ onUnmounted(() => {});
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 50%;
} }
} }
.right { .right {
......
src/views/bill/billLayout/index.vue
浏览文件 @ ade37250
...@@ -212,7 +212,7 @@ onMounted(() => { ...@@ -212,7 +212,7 @@ onMounted(() => {
height: 1016px; height: 1016px;
background: rgba(249, 250, 252, 1); background: rgba(249, 250, 252, 1);
position: relative; position: relative;
margin: 0 auto; // margin: 0 auto;
.layout-header { .layout-header {
width: 1920px; width: 1920px;
height: 64px; height: 64px;
......
src/views/bill/deepDig/poliContribution/utils/piechart.js
浏览文件 @ ade37250
...@@ -14,14 +14,19 @@ const getPieChart = (data,colorList) => { ...@@ -14,14 +14,19 @@ const getPieChart = (data,colorList) => {
}, },
label: { label: {
alignTo: 'edge', alignTo: 'edge',
formatter: '{name|{b}}\n{time|{c} 条 {d}%}', formatter: '{name|{b}}\n{time|{d}%}',
minMargin: 5, minMargin: 5,
edgeDistance: 10, edgeDistance: 10,
lineHeight: 15, lineHeight: 15,
rich: { rich: {
time: { time: {
fontSize: 10, fontSize: 12,
color: '#999' color: '#666'
},
name: {
fontSize: 14,
color: '#333',
fontWeight: 'bold'
} }
} }
}, },
......
src/views/bill/deepDig/poliContribution/utils/sankey.js
浏览文件 @ ade37250
const getSankeyChart = () => { const getSankeyChart = (data = [], links = []) => {
const option = { const option = {
tooltip: {
trigger: 'item',
triggerOn: 'mousemove'
},
series: { series: {
type: 'sankey', type: 'sankey',
layout: 'none', layout: 'none',
left: '5%', left: '1%',
right: '5%', right: '1%',
top: '5%', top: '5%',
bottom: '5%', bottom: '5%',
emphasis: { emphasis: {
focus: 'adjacency' focus: 'adjacency'
}, },
nodeWidth: 50, nodeWidth: 50,
nodeGap: 2,
layoutIterations: 32,
lineStyle: {
color: 'source',
curveness: 0.5
},
label: { label: {
show: true, show: true,
formatter: function (params) { formatter: function (params) {
return `${params.name} $${params.value}`; return `${params.name} $${params.value.toLocaleString()}`;
}, },
position: 'right', position: 'right',
textStyle: { fontSize: 16,
fontSize: '16px', color: '#555'
color: '#555'
}
}, },
data: [ data: data,
{ links: links
name: '马尔科·卢比奥',
label: {
position: 'left'
}
},
{
name: '成长俱乐部'
},
{
name: '埃利奥特管理公司'
},
{
name: '高盛集团'
},
{
name: '黑石集团'
},
{
name: '佛罗里达水晶'
},
{
name: '美国银行'
}
],
links: [
{
source: '成长俱乐部',
target: '马尔科·卢比奥',
value: 680751
},
{
source: '埃利奥特管理公司',
target: '马尔科·卢比奥',
value: 440120
},
{
source: '高盛集团',
target: '马尔科·卢比奥',
value: 371517
},
{
source: '黑石集团',
target: '马尔科·卢比奥',
value: 259321
},
{
source: '佛罗里达水晶',
target: '马尔科·卢比奥',
value: 203775
},
{
source: '美国银行',
target: '马尔科·卢比奥',
value: 150892
}
]
} }
}; };
......
src/views/bill/deepDig/processAnalysis/index.vue
浏览文件 @ ade37250
...@@ -95,58 +95,117 @@ ...@@ -95,58 +95,117 @@
<div class="box3-main-center-header-box6">关键议员</div> <div class="box3-main-center-header-box6">关键议员</div>
</div> </div>
<div class="box3-main-center-content"> <div class="box3-main-center-content">
<div class="box3-main-center-content-box"> <div class="box3-main-center-content-box" v-for="item in voteAnalysisList" :key="item.actionId">
<div class="item" v-for="(item, index) in voteAnalysisList1" :key="index"> <div class="item">
<div class="item-box1"> <div class="item-box1">
<div class="box1-left"> <div class="box1-left">
<div class="icon" v-if="item.nameIcon"> <div style="width: 100%; display: flex; flex-direction: column; align-items: flex-end;">
<img :src="item.nameIcon" alt="" /> <div class="name nameBlod" :title="item.actionTitle" style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;">
</div> {{ item.actionTitle }}
<div style="height: 80px;">
<div class="name" :class="{ nameBlod: item.nameBold }">
{{ item.name }}
</div> </div>
<div class="time"> <div class="time">
{{ item.time }} {{ formatDate(item.actionDate) }}
</div> </div>
</div> </div>
</div> </div>
<div class="box1-right"> <div class="box1-right">
<div class="box1-right-top"> <div class="box1-right-top">
<el-progress :percentage="item.supportRate" :show-text="false"> </el-progress> <el-progress :percentage="Number(item.agreePercent)" :show-text="false" color="#1677FF"> </el-progress>
</div> </div>
<div class="box1-right-bottom"> <div class="box1-right-bottom">
<el-progress :percentage="item.againistRate" :show-text="false"> </el-progress> <el-progress :percentage="Number(item.againstPercent)" :show-text="false" color="#FF9054"> </el-progress>
</div> </div>
</div> </div>
</div> </div>
<div class="item-box2"> <div class="item-box2">
<div class="box2-1">{{ item.support + "票" }}</div> <div class="box2-1" style="color: #1677FF">{{ item.agreeCount + "票" }}</div>
<div class="box2-2">{{ item.againist + "票" }}</div> <div class="box2-2" style="color: #FF9054">{{ item.againstCount + "票" }}</div>
</div> </div>
<div class="item-box3"> <div class="item-box3">
<div class="box3-1">{{ item.supportRank }}</div> <div class="box3-1"></div>
<div class="box3-2">{{ item.againistRank }}</div> <div class="box3-2"></div>
</div> </div>
<div class="item-box4"> <div class="item-box4">
<div class="box4-1">{{ item.supportRate + "%" }}</div> <div class="box4-1" style="color: #1677FF">{{ item.agreePercent + "%" }}</div>
<div class="box4-2">{{ item.againistRate + "%" }}</div> <div class="box4-2" style="color: #FF9054">{{ item.againstPercent + "%" }}</div>
</div>
<div class="item-box5"></div>
<div class="item-box6">
<el-icon size="20" color="#555"><ArrowDownBold /></el-icon>
</div>
</div>
<div class="item">
<div class="item-box1">
<div class="box1-left">
<div class="icon">
<img :src="MZD" alt="" />
</div>
<div class="name">民主党</div>
</div>
<div class="box1-right">
<div class="box1-right-top">
<el-progress :percentage="Number(item.dagreePercent)" :show-text="false" color="#85b4ff"> </el-progress>
</div>
<div class="box1-right-bottom">
<el-progress :percentage="Number(item.dagainstPercent)" :show-text="false" color="#FF9054"> </el-progress>
</div>
</div>
</div>
<div class="item-box2">
<div class="box2-1" style="color: #1677FF">{{ item.dagreeCount + "票" }}</div>
<div class="box2-2" style="color: #FF9054">{{ item.dagainstCount + "票" }}</div>
</div>
<div class="item-box3"></div>
<div class="item-box4">
<div class="box4-1" style="color: #1677FF">{{ item.dagreePercent + "%" }}</div>
<div class="box4-2" style="color: #FF9054">{{ item.dagainstPercent + "%" }}</div>
</div> </div>
<div class="item-box5"> <div class="item-box5">
<div class="box5-1" v-if="item.people">{{ item.people+' 人' }}</div> <div class="box5-1" style="color: #CE4F51">{{ item.dreverseCount + "人" }}</div>
<div class="box5-2" v-if="item.peopleRank">{{ `( ${item.peopleRank} )` }}</div>
</div> </div>
<div class="item-box6"> <div class="item-box6">
<div class="img-box" v-if="item.keyUser"> <div class="img-box" v-if="item.dpersonImageUrl">
<img :src="item.keyUser" alt="" /> <img :src="item.dpersonImageUrl" alt="" />
</div> </div>
<div v-else> </div>
<el-icon size="20" color="#555"><ArrowDownBold /></el-icon> </div>
<div class="item">
<div class="item-box1">
<div class="box1-left">
<div class="icon">
<img :src="GHD" alt="" />
</div>
<div class="name">共和党</div>
</div>
<div class="box1-right">
<div class="box1-right-top">
<el-progress :percentage="Number(item.ragreePercent)" :show-text="false" color="#1677FF"> </el-progress>
</div>
<div class="box1-right-bottom">
<el-progress :percentage="Number(item.ragainstPercent)" :show-text="false" color="#ffdcc8"> </el-progress>
</div>
</div>
</div>
<div class="item-box2">
<div class="box2-1" style="color: #1677FF">{{ item.ragreeCount + "票" }}</div>
<div class="box2-2" style="color: #FF9054">{{ item.ragainstCount + "票" }}</div>
</div>
<div class="item-box3"></div>
<div class="item-box4">
<div class="box4-1" style="color: #1677FF">{{ item.ragreePercent + "%" }}</div>
<div class="box4-2" style="color: #FF9054">{{ item.ragainstPercent + "%" }}</div>
</div>
<div class="item-box5">
<div class="box5-1" style="color: #CE4F51">{{ item.rreverseCount + "人" }}</div>
</div>
<div class="item-box6">
<div class="img-box" v-if="item.rpersonImageUrl">
<img :src="item.rpersonImageUrl" alt="" />
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="box3-main-center-content-box"> <!-- <div class="box3-main-center-content-box">
<div class="item" v-for="(item, index) in voteAnalysisList2" :key="index"> <div class="item" v-for="(item, index) in voteAnalysisList2" :key="index">
<div class="item-box1"> <div class="item-box1">
<div class="box1-left"> <div class="box1-left">
...@@ -196,8 +255,8 @@ ...@@ -196,8 +255,8 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div> -->
<div class="box3-main-center-content-box"> <!-- <div class="box3-main-center-content-box">
<div class="item" v-for="(item, index) in voteAnalysisList3" :key="index"> <div class="item" v-for="(item, index) in voteAnalysisList3" :key="index">
<div class="item-box1"> <div class="item-box1">
<div class="box1-left"> <div class="box1-left">
...@@ -298,7 +357,7 @@ ...@@ -298,7 +357,7 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div> -->
</div> </div>
</div> </div>
<div class="box3-main-footer"> <div class="box3-main-footer">
...@@ -597,6 +656,15 @@ const handleGetBillAmeAnalyzeCount = async () => { ...@@ -597,6 +656,15 @@ const handleGetBillAmeAnalyzeCount = async () => {
}; };
// 获取投票分析 // 获取投票分析
const voteAnalysisList = ref([]);
const formatDate = (dateStr) => {
if (!dateStr) return "";
const date = new Date(dateStr);
const y = date.getFullYear();
const m = date.getMonth() + 1;
const d = date.getDate();
return `${y}年${m}月${d}日`;
};
const handleGetBillVoteAnalyze = async () => { const handleGetBillVoteAnalyze = async () => {
const params = { const params = {
id: window.sessionStorage.getItem("billId") id: window.sessionStorage.getItem("billId")
...@@ -604,6 +672,7 @@ const handleGetBillVoteAnalyze = async () => { ...@@ -604,6 +672,7 @@ const handleGetBillVoteAnalyze = async () => {
try { try {
const res = await getBillTp(params); const res = await getBillTp(params);
console.log("投票分析", res); console.log("投票分析", res);
voteAnalysisList.value = res.data;
} catch (error) { } catch (error) {
console.error("投票分析 error", error); console.error("投票分析 error", error);
} }
...@@ -1152,8 +1221,10 @@ onMounted(async () => { ...@@ -1152,8 +1221,10 @@ onMounted(async () => {
} }
} }
.box3-main-center-content { .box3-main-center-content {
height: 682px;
overflow: auto;
.box3-main-center-content-box { .box3-main-center-content-box {
width: 830px; width: 805px;
height: 160px; height: 160px;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid rgba(243, 243, 244, 1); border: 1px solid rgba(243, 243, 244, 1);
......
src/views/bill/influence/industry/utils/barChart.js
浏览文件 @ ade37250
...@@ -3,24 +3,65 @@ import * as echarts from "echarts"; ...@@ -3,24 +3,65 @@ import * as echarts from "echarts";
const getBarChart = (nameList, valueList) => { const getBarChart = (nameList, valueList) => {
const colorList = ['#b37feb', '#ffc53e', '#36cfc9', '#5c80f7', '#ff7d7a', '#4a9cff'] const colorList = ['#b37feb', '#ffc53e', '#36cfc9', '#5c80f7', '#ff7d7a', '#4a9cff']
const option = { const option = {
tooltip: {}, tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
grid: { grid: {
top: '3%', top: '5%',
right: '7%', right: '15%',
bottom: '1%', bottom: '5%',
left: '1%', left: '3%',
containLabel: true containLabel: true
}, },
dataZoom: [
{
type: 'slider',
show: valueList.length > 5,
yAxisIndex: 0,
width: 8,
right: 10,
top: 20,
bottom: 20,
startValue: 0,
endValue: 4, // Show 5 items (0-4)
fillerColor: 'rgba(167,183,204,0.4)',
borderColor: 'transparent',
handleSize: 0,
showDetail: false,
brushSelect: false
},
{
type: 'inside',
yAxisIndex: 0,
startValue: 0,
endValue: 4,
zoomOnMouseWheel: false,
moveOnMouseWheel: true,
moveOnTouch: true
}
],
xAxis: { xAxis: {
type: 'value', type: 'value',
splitLine: { splitLine: {
show: false show: false
}, },
show: false axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: {
show: false
}
}, },
yAxis: { yAxis: {
type: 'category', type: 'category',
data: nameList, data: nameList,
inverse: true, // Display from top to bottom
splitLine: { splitLine: {
show: false show: false
}, },
...@@ -31,60 +72,43 @@ const getBarChart = (nameList, valueList) => { ...@@ -31,60 +72,43 @@ const getBarChart = (nameList, valueList) => {
show: false show: false
}, },
axisLabel: { axisLabel: {
show: true show: true,
color: '#333',
fontSize: 14,
width: 100, // Limit width to handle long names
overflow: 'truncate',
ellipsis: '...'
} }
}, },
series: [{ series: [{
type: 'bar', type: 'bar',
data: valueList.map((item,index) => { data: valueList.map((item, index) => {
// Cycle through colors if more data than colors
const colorIndex = index % colorList.length;
const color = colorList[colorIndex];
return { return {
value: item, value: item,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{ offset: 0, color: 'rgba(255,255,255,0)' }, // Transparent start
{ offset: 1, color: color } // Solid end
]),
borderRadius: [0, 10, 10, 0]
},
label: { label: {
textStyle: { show: true,
color: colorList[index] position: 'right',
} color: color,
fontSize: 16,
offset: [5, 0] // Add some space between bar and label
} }
}; };
} }),
), barWidth: 10,
barWidth: 8, showBackground: false
label: {
show: true,
position: [365, 0],
formatter: function(params) {
return params.value
}
},
itemStyle: {
color: function (params) {
var colorList = [
['#fff', '#b37feb'],
['#fff', '#ffc53e'],
['#fff', '#36cfc9'],
['#fff', '#5c80f7'],
['#fff', '#ff7d7a'],
['#fff', '#4a9cff'],
];
var index = params.dataIndex;
if (params.dataIndex >= colorList.length) {
index = params.dataIndex - colorList.length;
}
return new echarts.graphic.LinearGradient(0, 0, 1, 0,
[{
offset: 0,
color: colorList[index][0]
},
{
offset: 1,
color: colorList[index][1]
}
]);
},
barBorderRadius: 4,
}
}] }]
} }
return option return option
} }
export default getBarChart export default getBarChart
\ No newline at end of file
src/views/bill/influence/industry/utils/barChart1.js
浏览文件 @ ade37250
...@@ -49,7 +49,7 @@ const getBarChart1 = (nameList, valueList) => { ...@@ -49,7 +49,7 @@ const getBarChart1 = (nameList, valueList) => {
offset: 1, offset: 1,
color: 'rgba(22,119,255,0)' // 结束颜色：浅色且透明度降低 color: 'rgba(22,119,255,0)' // 结束颜色：浅色且透明度降低
}]), }]),
barBorderRadius: 4, borderRadius: 4,
} }
}] }]
} }
......
src/views/bill/influence/industry/utils/graphChart.js
浏览文件 @ ade37250
...@@ -41,7 +41,7 @@ const getGraphChart = (nodes, links) => { ...@@ -41,7 +41,7 @@ const getGraphChart = (nodes, links) => {
itemStyle: { itemStyle: {
color: '#73C0DE' color: '#73C0DE'
}, },
layout: 'force', layout: 'none',
data: nodes, data: nodes,
links: links, links: links,
// categories: categories, // categories: categories,
......
src/views/bill/introdoction/index.vue
浏览文件 @ ade37250
...@@ -319,7 +319,7 @@ ...@@ -319,7 +319,7 @@
新闻动态 新闻动态
</div> </div>
<div class="btn" :class="{ btnActive: dialogBoxBtnActive === 1 }" @click="handleClcikDialogBoxBtn(1)"> <div class="btn" :class="{ btnActive: dialogBoxBtnActive === 1 }" @click="handleClcikDialogBoxBtn(1)">
任务履历 人物履历
</div> </div>
</div> </div>
<div class="inner-right-main"> <div class="inner-right-main">
...@@ -1411,6 +1411,11 @@ onMounted(() => { ...@@ -1411,6 +1411,11 @@ onMounted(() => {
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
line-height: 22px; line-height: 22px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
text-overflow: ellipsis;
} }
.timeline-content1 { .timeline-content1 {
color: rgba(132, 136, 142, 1); color: rgba(132, 136, 142, 1);
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论