提交 d4db2b2b authored 作者: coderBryanFu's avatar coderBryanFu

update

上级 7749137b
...@@ -90,7 +90,7 @@ const headerTitleClasses = computed(() => [ ...@@ -90,7 +90,7 @@ const headerTitleClasses = computed(() => [
width: 100%; width: 100%;
margin-bottom: 15px; margin-bottom: 15px;
position: relative; position: relative;
margin-bottom: 100px; // margin-bottom: 100px;
} }
.container-header { .container-header {
......
...@@ -297,7 +297,7 @@ ...@@ -297,7 +297,7 @@
</div> </div>
<div class="box4-main"> <div class="box4-main">
<div class="box4-main-item" v-for="(item, index) in messageList" :key="index"> <div class="box4-main-item" v-for="(item, index) in messageList" :key="index">
<div class="left" @click="handleClcikToCharacter(item, index)"> <div class="left" @click="handleClcikToCharacter(item.personId)">
<img <img
:src="getProxyUrl(item.personImage) || Message3" :src="getProxyUrl(item.personImage) || Message3"
alt="" alt=""
...@@ -326,24 +326,31 @@ ...@@ -326,24 +326,31 @@
</div> </div>
<div class="box5-header-title">{{ "涉华法案数量" }}</div> <div class="box5-header-title">{{ "涉华法案数量" }}</div>
</div> </div>
<!-- <div class="box5-header-right"> <div class="box5-header-right">
<div class="header-right-icon"> <!-- <div class="header-right-icon">
<img src="./assets/images/tips-icon.png" alt="" /> <img src="./assets/images/tips-icon.png" alt="" />
</div> </div>
<div class="header-right-text">{{ "数据来源:美国国会官方网站" }}</div> <div class="header-right-text">{{ "数据来源:美国国会官方网站" }}</div> -->
</div> --> <div class="box5-select">
</div> <el-select
<div class="box5-select"> v-model="box5Select"
<el-select placeholder="选择领域"
v-model="box5Select" @change="handleBox5Change"
placeholder="选择领域" style="width: 150px"
@change="handleBox5Change" >
style="width: 150px" <el-option label="全部领域" value="全部领域" />
> <el-option
<el-option label="全部领域" value="全部领域" /> v-for="item in categoryList"
<el-option v-for="item in categoryList" :key="item.id" :label="item.name" :value="item.id" /> :key="item.id"
</el-select> :label="item.name"
:value="item.id"
/>
</el-select>
</div>
</div>
</div> </div>
<div <div
class="box5-main" class="box5-main"
:style="{ :style="{
...@@ -386,9 +393,17 @@ ...@@ -386,9 +393,17 @@
<img src="./assets/images/tips-icon.png" alt="" /> <img src="./assets/images/tips-icon.png" alt="" />
</div> --> </div> -->
<!-- <div class="header-right-text">{{ "数据来源:美国国会官方网站" }}</div> --> <!-- <div class="header-right-text">{{ "数据来源:美国国会官方网站" }}</div> -->
<el-select v-model="box7selectetedTime" placeholder="选择时间" style="width: 90px">
<el-option
v-for="item in box7YearList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</div> </div>
</div> </div>
<div class="box-center"> <!-- <div class="box-center">
<el-select v-model="box7selectetedTime" placeholder="选择时间" style="width: 90px"> <el-select v-model="box7selectetedTime" placeholder="选择时间" style="width: 90px">
<el-option <el-option
v-for="item in box7YearList" v-for="item in box7YearList"
...@@ -397,7 +412,7 @@ ...@@ -397,7 +412,7 @@
:value="item.value" :value="item.value"
/> />
</el-select> </el-select>
</div> </div> -->
<div <div
class="box7-main" class="box7-main"
:style="{ :style="{
...@@ -423,9 +438,17 @@ ...@@ -423,9 +438,17 @@
<img src="./assets/images/tips-icon.png" alt="" /> <img src="./assets/images/tips-icon.png" alt="" />
</div> --> </div> -->
<!-- <div class="header-right-text">{{ "数据来源:美国国会官方网站" }}</div> --> <!-- <div class="header-right-text">{{ "数据来源:美国国会官方网站" }}</div> -->
<el-select v-model="box8selectetedTime" placeholder="选择时间" style="width: 90px">
<el-option
v-for="item in box8YearList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</div> </div>
</div> </div>
<div class="box-center"> <!-- <div class="box-center">
<el-select v-model="box8selectetedTime" placeholder="选择时间" style="width: 90px"> <el-select v-model="box8selectetedTime" placeholder="选择时间" style="width: 90px">
<el-option <el-option
v-for="item in box8YearList" v-for="item in box8YearList"
...@@ -434,7 +457,7 @@ ...@@ -434,7 +457,7 @@
:value="item.value" :value="item.value"
/> />
</el-select> </el-select>
</div> </div> -->
<div <div
class="box8-main" class="box8-main"
:style="{ :style="{
...@@ -449,7 +472,7 @@ ...@@ -449,7 +472,7 @@
class="box8-main-item" class="box8-main-item"
v-for="(item, index) in box8Data" v-for="(item, index) in box8Data"
:key="index" :key="index"
@click="handleClcikToCharacter(item, index)" @click="handleClcikToCharacter(item.memberId)"
> >
<div class="box8-main-item-left"> <div class="box8-main-item-left">
<img :src="getProxyUrl(item.img)" alt="" referrerpolicy="no-referrer" class="left-img" /> <img :src="getProxyUrl(item.img)" alt="" referrerpolicy="no-referrer" class="left-img" />
...@@ -483,9 +506,17 @@ ...@@ -483,9 +506,17 @@
<img src="./assets/images/tips-icon.png" alt="" /> <img src="./assets/images/tips-icon.png" alt="" />
</div> --> </div> -->
<!-- <div class="header-right-text">{{ "数据来源:美国国会官方网站" }}</div> --> <!-- <div class="header-right-text">{{ "数据来源:美国国会官方网站" }}</div> -->
<el-select v-model="box9selectetedTime" placeholder="选择时间" style="width: 90px">
<el-option
v-for="item in box9YearList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</div> </div>
</div> </div>
<div class="box-center"> <!-- <div class="box-center">
<el-select v-model="box9selectetedTime" placeholder="选择时间" style="width: 90px"> <el-select v-model="box9selectetedTime" placeholder="选择时间" style="width: 90px">
<el-option <el-option
v-for="item in box9YearList" v-for="item in box9YearList"
...@@ -494,7 +525,7 @@ ...@@ -494,7 +525,7 @@
:value="item.value" :value="item.value"
/> />
</el-select> </el-select>
</div> </div> -->
<div <div
class="box9-main" class="box9-main"
:style="{ :style="{
...@@ -739,35 +770,16 @@ import { ...@@ -739,35 +770,16 @@ import {
getPostMemberList, getPostMemberList,
getBills getBills
} from "@/api/bill/billHome"; } from "@/api/bill/billHome";
import { getPersonSummaryInfo } from "@/api/common/index";
import DivideHeader from "@/components/DivideHeader.vue"; import DivideHeader from "@/components/DivideHeader.vue";
import { useContainerScroll } from "@/hooks/useScrollShow"; import { useContainerScroll } from "@/hooks/useScrollShow";
import scrollToCenter from "@/utils/scrollToCenter";
import headerIcon1 from "./assets/icons/header-icon1.png";
import headerIcon2 from "./assets/icons/header-icon2.png";
import headerIcon3 from "./assets/icons/header-icon3.png";
import headerIcon4 from "./assets/icons/header-icon4.png";
import headerIcon5 from "./assets/icons/header-icon5.png";
import getMultiLineChart from "./utils/multiLineChart"; import getMultiLineChart from "./utils/multiLineChart";
import getWordCloudChart from "./utils/worldCloudChart"; import getWordCloudChart from "./utils/worldCloudChart";
import getPieChart from "./utils/piechart"; import getPieChart from "./utils/piechart";
import getDoublePieChart from "./utils/doublePieChart"; import getDoublePieChart from "./utils/doublePieChart";
import bill1 from "./assets/images/bill1.png";
import bill2 from "./assets/images/bill2.png";
import bill3 from "./assets/images/bill3.png";
import bill4 from "./assets/images/bill4.png";
import bill5 from "./assets/images/bill5.png";
import bill6 from "./assets/images/bill6.png";
import bill7 from "./assets/images/bill7.png";
import bill8 from "./assets/images/bill8.png";
import bill9 from "./assets/images/bill9.png";
import bill10 from "./assets/images/bill10.png";
import bill11 from "./assets/images/bill11.png";
import bill12 from "./assets/images/bill12.png";
import defaultNew from "../assets/images/default-icon-news.png"; import defaultNew from "../assets/images/default-icon-news.png";
import News1 from "./assets/images/news1.png"; import News1 from "./assets/images/news1.png";
import News2 from "./assets/images/news2.png"; import News2 from "./assets/images/news2.png";
...@@ -789,7 +801,8 @@ import Cyy from "@/assets/icons/cyy.png"; ...@@ -789,7 +801,8 @@ import Cyy from "@/assets/icons/cyy.png";
import Zyy from "@/assets/icons/zyy.png"; import Zyy from "@/assets/icons/zyy.png";
import Ghd from "@/assets/icons/ghd.png"; import Ghd from "@/assets/icons/ghd.png";
import Mzd from "@/assets/icons/mzd.png"; import Mzd from "@/assets/icons/mzd.png";
import { iteratee } from "lodash";
import { ElMessage } from "element-plus";
const searchBillText = ref(""); const searchBillText = ref("");
...@@ -824,23 +837,61 @@ const formatMessageTime = timeStr => { ...@@ -824,23 +837,61 @@ const formatMessageTime = timeStr => {
}; };
// 跳转人物主页 // 跳转人物主页
const handleClcikToCharacter = (item, index) => { const handleClcikToCharacter = async (id) => {
window.sessionStorage.setItem("memberId", item.memberId); window.sessionStorage.setItem("memberId", id);
let type;
if (index === 0) {
type = 2; const personTypeList = JSON.parse(window.sessionStorage.getItem("personTypeList"));
} else if (index === 1) { console.log("personTypeList", personTypeList);
type = 1;
} else { let type = 0;
type = 3; let personTypeName = "";
}
const route = router.resolve({ const params = {
path: "/characterPage", personId: id
query: { };
type: type try {
const res = await getPersonSummaryInfo(params);
console.log("人物全局信息", res);
if (res.code === 200 && res.data) {
const arr = personTypeList.filter(item => {
return item.typeId === res.data.personType;
});
console.log("arr", arr);
if (arr && arr.length > 0) {
personTypeName = arr[0].typeName;
console.log("personTypeName", personTypeName);
if (personTypeName === "科技企业领袖") {
type = 1;
} else if (personTypeName === "国会议员") {
type = 2;
} else if (personTypeName === "智库研究人员") {
type = 3;
} else {
personTypeName = "";
ElMessage.warning("找不到当前人员的类型值!");
return;
}
const route = router.resolve({
path: "/characterPage",
query: {
type: type, // type=1为科技企业领袖,2为国会议员,3为智库研究人员
personId: id
}
});
window.open(route.href, "_blank");
} else {
personTypeName = "";
ElMessage.warning("找不到当前人员的类型值!");
return;
}
} else {
ElMessage.warning("找不到当前人员的类型值!");
return;
} }
}); } catch (error) {}
window.open(route.href, "_blank");
}; };
// 返回首页 // 返回首页
...@@ -1751,12 +1802,11 @@ const handleSearch = () => { ...@@ -1751,12 +1802,11 @@ const handleSearch = () => {
path: "/searchResults", path: "/searchResults",
query: { query: {
searchText: searchBillText.value, searchText: searchBillText.value,
areaName: '法案' areaName: "法案"
} }
}); });
window.open(curRoute.href, "_blank"); window.open(curRoute.href, "_blank");
};
}
onMounted(async () => { onMounted(async () => {
handleGetHylyList(); handleGetHylyList();
...@@ -2016,44 +2066,44 @@ onUnmounted(() => {}); ...@@ -2016,44 +2066,44 @@ onUnmounted(() => {});
margin-top: 39px; margin-top: 39px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.btn { .btn {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 9px; gap: 9px;
width: 160px; width: 160px;
height: 48px; height: 48px;
border: 1px solid #aed6ff; border: 1px solid #aed6ff;
box-sizing: border-box; box-sizing: border-box;
border-radius: 24px; border-radius: 24px;
background: #e7f3ff; background: #e7f3ff;
cursor: pointer; cursor: pointer;
position: relative; position: relative;
&:hover { &:hover {
background: #cae3fc; background: #cae3fc;
} }
.btn-text { .btn-text {
width: 80px; width: 80px;
color: var(--color-main-active); color: var(--color-main-active);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 20px; font-size: 20px;
font-weight: 400; font-weight: 400;
line-height: 48px; line-height: 48px;
margin-left: 36px; margin-left: 36px;
text-align: center; text-align: center;
} }
.btn-icon { .btn-icon {
position: absolute; position: absolute;
top: 16px; top: 16px;
right: 19px; right: 19px;
width: 6px; width: 6px;
height: 12px; height: 12px;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
}
} }
} }
} }
}
} }
.divide1 { .divide1 {
margin-top: 64px; margin-top: 64px;
...@@ -2847,12 +2897,12 @@ onUnmounted(() => {}); ...@@ -2847,12 +2897,12 @@ onUnmounted(() => {});
.box5-main { .box5-main {
height: 397px; height: 397px;
} }
.box5-select { // .box5-select {
position: absolute; // position: absolute;
top: 53px; // top: 53px;
left: 100px; // left: 100px;
z-index: 100; // z-index: 100;
} // }
} }
.box6 { .box6 {
margin-left: 20px; margin-left: 20px;
...@@ -2991,7 +3041,7 @@ onUnmounted(() => {}); ...@@ -2991,7 +3041,7 @@ onUnmounted(() => {});
justify-content: flex-end; justify-content: flex-end;
} }
.box7-main { .box7-main {
height: 340px; height: 380px;
} }
} }
.box8 { .box8 {
...@@ -3055,15 +3105,15 @@ onUnmounted(() => {}); ...@@ -3055,15 +3105,15 @@ onUnmounted(() => {});
} }
} }
} }
.box-center { // .box-center {
height: 45px; // height: 45px;
padding-right: 20px; // padding-right: 20px;
display: flex; // display: flex;
align-items: center; // align-items: center;
justify-content: flex-end; // justify-content: flex-end;
} // }
.box8-main { .box8-main {
height: 340px; height: 380px;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
.box8-main-item { .box8-main-item {
...@@ -3223,7 +3273,7 @@ onUnmounted(() => {}); ...@@ -3223,7 +3273,7 @@ onUnmounted(() => {});
justify-content: flex-end; justify-content: flex-end;
} }
.box9-main { .box9-main {
height: 340px; height: 380px;
} }
} }
} }
...@@ -3377,6 +3427,8 @@ onUnmounted(() => {}); ...@@ -3377,6 +3427,8 @@ onUnmounted(() => {});
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1); box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
margin-bottom: 16px; margin-bottom: 16px;
overflow: hidden;
overflow-y: auto;
cursor: pointer; cursor: pointer;
.header { .header {
height: 91px; height: 91px;
......
...@@ -6,7 +6,7 @@ const getDoublePieChart = (data1, data2) => { ...@@ -6,7 +6,7 @@ const getDoublePieChart = (data1, data2) => {
series: [ series: [
{ {
type: 'pie', type: 'pie',
radius: [25, 68], radius: [45, 88],
// height: '100%', // height: '100%',
left: 'center', left: 'center',
// width: '100%', // width: '100%',
...@@ -32,10 +32,10 @@ const getDoublePieChart = (data1, data2) => { ...@@ -32,10 +32,10 @@ const getDoublePieChart = (data1, data2) => {
}, },
{ {
type: 'pie', type: 'pie',
radius: [70, 100], radius: [90, 120],
height: '100%', height: '100%',
left: 'center', left: 'center',
width: '80%', width: '98%',
itemStyle: { itemStyle: {
borderColor: '#fff', borderColor: '#fff',
borderWidth: 1 borderWidth: 1
...@@ -45,11 +45,18 @@ const getDoublePieChart = (data1, data2) => { ...@@ -45,11 +45,18 @@ const getDoublePieChart = (data1, data2) => {
formatter: '{name|{b}}\n{time|{c} 条 {d}%}', formatter: '{name|{b}}\n{time|{c} 条 {d}%}',
minMargin: 5, minMargin: 5,
edgeDistance: 10, edgeDistance: 10,
lineHeight: 15, lineHeight: 24,
rich: { rich: {
name: {
color: 'rgba(59, 65, 75, 1)',
fontFamily: 'Microsoft YaHei',
fontSize: 16,
fontWeight: 'bold',
},
time: { time: {
fontSize: 10, fontSize: 16,
color: '#999' fontFamily: 'Microsoft YaHei',
color: '#rgba(95, 101, 108, 1)'
} }
} }
}, },
......
const getPieChart = (data,colorList) => { const getPieChart = (data, colorList) => {
let option = { let option = {
// color: colorList, // color: colorList,
series: [ series: [
{ {
type: 'pie', type: 'pie',
radius: [70, 100], radius: [70, 100],
height: '100%', height: '100%',
left: 'center', left: 'center',
width: '100%', width: '100%',
itemStyle: { itemStyle: {
borderColor: '#fff', borderColor: '#fff',
borderWidth: 1 borderWidth: 1
}, },
label: { label: {
alignTo: 'edge', alignTo: 'edge',
formatter: '{name|{b}}\n{time|{c} 条 {d}%}', formatter: '{name|{b}}\n{time|{c} 条 {d}%}',
minMargin: 5, minMargin: 5,
edgeDistance: 10, edgeDistance: 10,
lineHeight: 15, lineHeight: 25,
rich: { rich: {
time: { name: {
fontSize: 10, color: 'rgba(59, 65, 75, 1)',
color: '#999' fontFamily: 'Microsoft YaHei',
fontSize: 16,
fontWeight: 'bold',
},
time: {
fontSize: 16,
fontFamily: 'Microsoft YaHei',
color: '#rgba(95, 101, 108, 1)'
}
} }
}
}, },
labelLine: { labelLine: {
length: 15, length: 15,
length2: 0, length2: 0,
maxSurfaceAngle: 80 maxSurfaceAngle: 80
}, },
labelLayout: function (params) { labelLayout: function (params) {
const isLeft = params.labelRect.x < 556 / 2; const isLeft = params.labelRect.x < 556 / 2;
const points = params.labelLinePoints; const points = params.labelLinePoints;
// Update the end point. // Update the end point.
points[2][0] = isLeft points[2][0] = isLeft
? params.labelRect.x ? params.labelRect.x
: params.labelRect.x + params.labelRect.width; : params.labelRect.x + params.labelRect.width;
return { return {
labelLinePoints: points labelLinePoints: points
}; };
}, },
data: data data: data
}] }]
} }
return option return option
} }
......
...@@ -380,7 +380,7 @@ onMounted(() => { ...@@ -380,7 +380,7 @@ onMounted(() => {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.layout-main-header-left-box { .layout-main-header-left-box {
width: 500px; width: 900px;
margin-left: 160px; margin-left: 160px;
margin-top: 13px; margin-top: 13px;
.left-box-top { .left-box-top {
......
...@@ -795,7 +795,7 @@ const newsList = ref([ ...@@ -795,7 +795,7 @@ const newsList = ref([
]); ]);
const handleGetNews = async () => { const handleGetNews = async () => {
const params = { const params = {
moduleId: "0101" moduleId: "0100"
}; };
try { try {
const res = await getNews(params); const res = await getNews(params);
......
...@@ -478,14 +478,18 @@ onMounted(() => { ...@@ -478,14 +478,18 @@ onMounted(() => {
} }
&-news-img { &-news-img {
height: 370px;
border-top: 1px solid rgba(234, 236, 238, 1); border-top: 1px solid rgba(234, 236, 238, 1);
padding: 15px 10px; padding: 15px 10px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
gap: 20px; gap: 20px;
overflow: hidden;
overflow-y: auto;
} }
.box4 { .box4 {
background: orange;
.box4-item { .box4-item {
display: flex; display: flex;
gap: 10px; gap: 10px;
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论