提交 444ad580 authored 作者: huhuiqing's avatar huhuiqing

Merge branch 'master' of http://8.140.26.4:10003/caijian/risk-monitor into dev_hhq

...@@ -166,7 +166,7 @@ body { ...@@ -166,7 +166,7 @@ body {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
height: 64px; height: 96px;
} }
.main-container { .main-container {
...@@ -181,7 +181,7 @@ body { ...@@ -181,7 +181,7 @@ body {
align-items: center; align-items: center;
gap: 12px; gap: 12px;
position: absolute; position: absolute;
left: 13px; left: 160px;
.brand-icon { .brand-icon {
width: 48px; width: 48px;
height: 48px; height: 48px;
...@@ -204,7 +204,7 @@ body { ...@@ -204,7 +204,7 @@ body {
height: 37px; height: 37px;
color: rgba(10, 18, 30, 1); color: rgba(10, 18, 30, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 28px; font-size: 32px;
font-weight: 700; font-weight: 700;
line-height: 37px; line-height: 37px;
} }
...@@ -341,14 +341,14 @@ body { ...@@ -341,14 +341,14 @@ body {
.el-header { .el-header {
padding: 0; padding: 0;
height: 64px; height: 96px;
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
.el-main { .el-main {
padding: 0; padding: 0;
height: calc(100vh - 64px); height: calc(100vh - 96px);
overflow: hidden; overflow: hidden;
overflow-y: auto; overflow-y: auto;
background-color: rgba(246, 251, 255, 1); background-color: rgba(246, 251, 255, 1);
......
...@@ -33,7 +33,7 @@ export function getBillPerson(params) { ...@@ -33,7 +33,7 @@ export function getBillPerson(params) {
export function getBillEvent(params) { export function getBillEvent(params) {
return request({ return request({
method: 'GET', method: 'GET',
url: `/api/billInfoBean/event/${params.id}`, url: `/api/billInfoBean/actionContent/${params.id}`,
params, params,
}) })
} }
......
import request from "@/api/request.js";
// 涉华法案领域分布
/**
* @param {year}
*/
export function getBillIndustry(params) {
return request({
method: 'GET',
url: `/api/BillOverview/billIndustry/${params.year}`,
params,
})
}
\ No newline at end of file
...@@ -6,4 +6,13 @@ export function getChat(params) { ...@@ -6,4 +6,13 @@ export function getChat(params) {
url: `/aichat/chat/chat/completions`, url: `/aichat/chat/chat/completions`,
data: params, data: params,
}) })
}
// 清单问答
export function getChecklistChat(params) {
return request({
method: 'POST',
url: `/checklistChat/langgraph/checklist/chat`,
data: params,
})
} }
\ No newline at end of file
...@@ -31,7 +31,7 @@ export { getToken, setToken, removeToken } ...@@ -31,7 +31,7 @@ export { getToken, setToken, removeToken }
// 创建axios实例 // 创建axios实例
const service = axios.create({ const service = axios.create({
// baseURL: BASE_API, //所有的后端接口请求地址前缀部分(没有后端请求不用写) // baseURL: BASE_API, //所有的后端接口请求地址前缀部分(没有后端请求不用写)
timeout: 60000*5 // 请求超时时间,这里15秒 timeout: 300 * 1000 // 请求超时时间,这里5分钟
//withCredentials: true,// 异步请求携带cookie,true为携带,false为不携带 //withCredentials: true,// 异步请求携带cookie,true为携带,false为不携带
//请求头里面设置通用传参类型 //请求头里面设置通用传参类型
/*headers: { /*headers: {
......
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -133,7 +133,8 @@ const headerTitleClasses = computed(() => [ ...@@ -133,7 +133,8 @@ const headerTitleClasses = computed(() => [
.header-icon { .header-icon {
width: 20px; width: 20px;
height: 20px; height: 20px;
margin-right: 14px; margin-left: 5px;
margin-right: 19px;
} }
.blue-title-block { .blue-title-block {
...@@ -152,6 +153,7 @@ const headerTitleClasses = computed(() => [ ...@@ -152,6 +153,7 @@ const headerTitleClasses = computed(() => [
color: $base-color; color: $base-color;
line-height: 48px; line-height: 48px;
padding: 0 12px; padding: 0 12px;
font-size: 20px;
} }
.header-title-primary { .header-title-primary {
......
...@@ -4,7 +4,7 @@ import InnovationSubject from "@/views/innovationSubject/index.vue"; ...@@ -4,7 +4,7 @@ import InnovationSubject from "@/views/innovationSubject/index.vue";
const innovationSubjectRoutes = [ const innovationSubjectRoutes = [
//创新主体 //创新主体
{ {
path: "/InnovationSubject", path: "/innovationSubject",
name: "InnovationSubject", name: "InnovationSubject",
component: InnovationSubject, component: InnovationSubject,
meta: { meta: {
......
...@@ -7,10 +7,10 @@ const overViewRoutes = [ ...@@ -7,10 +7,10 @@ const overViewRoutes = [
// 中美博弈概览页面路由 // 中美博弈概览页面路由
{ {
path: "/", path: "/",
redirect: "/overView" redirect: "/overview"
}, },
{ {
path: "/overView", path: "/overview",
name: "overView", name: "overView",
component: overView, component: overView,
meta: { meta: {
...@@ -19,7 +19,7 @@ const overViewRoutes = [ ...@@ -19,7 +19,7 @@ const overViewRoutes = [
}, },
// GJ概览页面路由 // GJ概览页面路由
{ {
path: "/gjOverView", path: "/gjOverview",
name: "gjOverView", name: "gjOverView",
component: gjOverView, component: gjOverView,
meta: { meta: {
......
// 门户 import Portal1 from "@/views/portals/portal1/index.vue";
import Portal from "@/views/portals/portal/index.vue"; import Portal2 from "@/views/portals/portal2/index.vue";
const portalRoutes = [ const portalRoutes = [
// 门户 // 门户
{ {
path: "/portal", path: "/portal1",
name: "portal", name: "portal1",
component: Portal, component: Portal1,
meta: {
title: "门户"
}
},
{
path: "/portal2",
name: "portal2",
component: Portal2,
meta: { meta: {
title: "门户" title: "门户"
} }
......
//科技人物观点
import TechnologyFigures from "@/views/technologyFigures/index.vue";
const technologyFiguresRoutes = [
//创新主体
{
path: "/technologyFigures",
name: "TechnologyFigures",
component: TechnologyFigures,
meta: {
title: "主要创新主体"
}
}
]
export default technologyFiguresRoutes
\ No newline at end of file
/* 全局滚动条样式 */
* {
scrollbar-width: thin;
scrollbar-color: #c1c1c1 #f1f1f1;
}
/* Webkit 浏览器 */ /* Webkit 浏览器 */
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 10px; width: 4px;
height: 10px; height: 8px;
} }
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
...@@ -16,17 +12,17 @@ ...@@ -16,17 +12,17 @@
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background: #6c757d; background: #c5c7c9;
border-radius: 6px; border-radius: 2px;
border: 2px solid #f8f9fa; /* border: 1px solid #f8f9fa; */
} }
::-webkit-scrollbar-thumb:hover { ::-webkit-scrollbar-thumb:hover {
background: #495057; background: #505357;
} }
::-webkit-scrollbar-thumb:active { ::-webkit-scrollbar-thumb:active {
background: #343a40; background: #505357;
} }
::-webkit-scrollbar-corner { ::-webkit-scrollbar-corner {
...@@ -40,16 +36,16 @@ ...@@ -40,16 +36,16 @@
/* Element UI 组件滚动条优化 */ /* Element UI 组件滚动条优化 */
.el-table__body-wrapper::-webkit-scrollbar { .el-table__body-wrapper::-webkit-scrollbar {
width: 8px; width: 4px;
height: 8px; height: 8px;
} }
.el-table__body-wrapper::-webkit-scrollbar-thumb { .el-table__body-wrapper::-webkit-scrollbar-thumb {
background: #909399; background: #505357;
border-radius: 4px; border-radius: 2px;
} }
.el-select-dropdown .el-scrollbar__wrap { .el-select-dropdown .el-scrollbar__wrap {
scrollbar-width: thin; scrollbar-width: thin;
scrollbar-color: #c1c1c1 #f1f1f1; scrollbar-color: #c1c1c1 #f1f1f1;
} }
\ No newline at end of file \ No newline at end of file
...@@ -110,7 +110,7 @@ ...@@ -110,7 +110,7 @@
</div> </div>
<div class="title">{{ "热门法案" }}</div> <div class="title">{{ "热门法案" }}</div>
</div> </div>
<div class="box1-header-right"> <div class="box1-header-right" @click="handleClickToDetail">
{{ "查看详情 >" }} {{ "查看详情 >" }}
</div> </div>
</div> </div>
...@@ -257,7 +257,6 @@ ...@@ -257,7 +257,6 @@
<img src="./assets/images/box4-header-icon.png" alt="" /> <img src="./assets/images/box4-header-icon.png" alt="" />
</div> </div>
<div class="header-title">{{ "社交媒体" }}</div> <div class="header-title">{{ "社交媒体" }}</div>
<div class="more">{{ "更多 +" }}</div>
</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">
...@@ -520,6 +519,9 @@ ...@@ -520,6 +519,9 @@
import { onMounted, ref, computed, onUnmounted, nextTick } from "vue"; import { onMounted, ref, computed, onUnmounted, nextTick } from "vue";
import * as echarts from "echarts"; import * as echarts from "echarts";
import router from "@/router/index"; import router from "@/router/index";
import setChart from "@/utils/setChart";
import { getBillIndustry } from "@/api/bill/billHome";
import { getHotBills, getBillRiskSignal, getBillsByType, getHylyList } from "@/api/home"; import { getHotBills, getBillRiskSignal, getBillsByType, getHylyList } from "@/api/home";
import DivideHeader from "@/components/DivideHeader.vue"; import DivideHeader from "@/components/DivideHeader.vue";
...@@ -624,6 +626,7 @@ const curBill = ref({ ...@@ -624,6 +626,7 @@ const curBill = ref({
// 查看详情 // 查看详情
const handleClickToDetail = () => { const handleClickToDetail = () => {
// window.sessionStorage.setItem("billId", curBill.value.billId); // window.sessionStorage.setItem("billId", curBill.value.billId);
window.sessionStorage.setItem("billId", '119_HR_1');
// router.push("/billLayout"); // router.push("/billLayout");
const route = router.resolve("/billLayout"); const route = router.resolve("/billLayout");
window.open(route.href, "_blank"); window.open(route.href, "_blank");
...@@ -838,26 +841,6 @@ const box8YearList = ref([ ...@@ -838,26 +841,6 @@ const box8YearList = ref([
} }
]); ]);
const box9selectetedTime = ref("2025");
const box9YearList = ref([
{
label: "2025",
value: "2025"
},
{
label: "2024",
value: "2024"
},
{
label: "2023",
value: "2023"
},
{
label: "2022",
value: "2022"
}
]);
const releaseTime = ref("近一年发布"); // 发布时间 const releaseTime = ref("近一年发布"); // 发布时间
const releaseTimeList = ref([ const releaseTimeList = ref([
...@@ -897,27 +880,27 @@ const categoryList = ref([ ...@@ -897,27 +880,27 @@ const categoryList = ref([
// "航空航天", // "航空航天",
]); ]);
const curCategoryList = ref([]) const curCategoryList = ref([]);
const curCategoryIndex = ref(0) const curCategoryIndex = ref(0);
const SHOW_COUNT = 10 const SHOW_COUNT = 10;
function updateShowList(startIndex) { function updateShowList(startIndex) {
// 确保索引在有效范围内 // 确保索引在有效范围内
startIndex = Math.max(0, Math.min(startIndex, categoryList.value.length - SHOW_COUNT)); startIndex = Math.max(0, Math.min(startIndex, categoryList.value.length - SHOW_COUNT));
// 截取要显示的元素 // 截取要显示的元素
curCategoryList.value = categoryList.value.slice(startIndex, startIndex + SHOW_COUNT); curCategoryList.value = categoryList.value.slice(startIndex, startIndex + SHOW_COUNT);
// 如果接近末尾不够10个,从末尾往前取10个 // 如果接近末尾不够10个,从末尾往前取10个
if (curCategoryList.value.length < SHOW_COUNT) { if (curCategoryList.value.length < SHOW_COUNT) {
curCategoryList.value = categoryList.value.slice(-SHOW_COUNT); curCategoryList.value = categoryList.value.slice(-SHOW_COUNT);
curCategoryIndex = categoryList.value.length - SHOW_COUNT; curCategoryIndex = categoryList.value.length - SHOW_COUNT;
} else { } else {
curCategoryIndex = startIndex; curCategoryIndex = startIndex;
} }
renderShowList(); renderShowList();
updateButtons(); updateButtons();
} }
const activeCate = ref("全部分类"); const activeCate = ref("全部分类");
...@@ -947,15 +930,6 @@ const handleClickCate = cate => { ...@@ -947,15 +930,6 @@ const handleClickCate = cate => {
handleGetBillsByType(); handleGetBillsByType();
}; };
// 绘制echarts图表
const setChart = (option, chartId) => {
let chartDom = document.getElementById(chartId);
chartDom.removeAttribute("_echarts_instance_");
let chart = echarts.init(chartDom);
chart.setOption(option);
return chart;
};
const chart1Data = ref({ const chart1Data = ref({
title: [ title: [
"2024-09", "2024-09",
...@@ -1103,36 +1077,81 @@ const wordCloudData = ref([ ...@@ -1103,36 +1077,81 @@ const wordCloudData = ref([
{ name: "加强供应链风险管理", value: 73 } { name: "加强供应链风险管理", value: 73 }
]); ]);
// 涉华领域分布
const box9ChartColorList = ref(["#4096FF", "#FFA39E", "#ADC6FF", "#FFC069", "#B5F5EC", "#B37FEB", "#D6E4FF"]);
const box9ChartData = ref([ const box9ChartData = ref([
// {
// name: "半导体",
// value: 50
// },
// {
// name: "电子设备",
// value: 46
// },
// {
// name: "显示技术",
// value: 40
// },
// {
// name: "新能源",
// value: 32
// },
// {
// name: "通信设备",
// value: 31
// },
// {
// name: "汽车",
// value: 30
// },
// {
// name: "其他",
// value: 24
// }
]);
const box9selectetedTime = ref("2025");
const box9YearList = ref([
{ {
name: "半导体", label: "2025",
value: 50 value: "2025"
},
{
name: "电子设备",
value: 46
},
{
name: "显示技术",
value: 40
},
{
name: "新能源",
value: 32
}, },
{ {
name: "通信设备", label: "2024",
value: 31 value: "2024"
}, },
{ {
name: "汽车", label: "2023",
value: 30 value: "2023"
}, },
{ {
name: "其他", label: "2022",
value: 24 value: "2022"
} }
]); ]);
const getBox9Data = async () => {
const params = {
year: box9selectetedTime.value
};
try {
const res = await getBillIndustry(params);
console.log("box9-涉华法案领域分布", res.data);
if (res.code === 200 && res.data) {
box9ChartData.value = res.data;
}
} catch (error) {}
};
const handleBox9Data = async () => {
await getBox9Data();
const box9Chart = getPieChart(
box9ChartData.value.map(item => {
return {
name: item.industryName,
value: item.countBill
};
})
);
setChart(box9Chart, "box9Chart");
};
const box7Data = ref([ const box7Data = ref([
[ [
...@@ -1252,8 +1271,6 @@ const box8Data = ref([ ...@@ -1252,8 +1271,6 @@ const box8Data = ref([
} }
]); ]);
const box9ChartColorList = ref(["#4096FF", "#FFA39E", "#ADC6FF", "#FFC069", "#B5F5EC", "#B37FEB", "#D6E4FF"]);
const handleToPosi = id => { const handleToPosi = id => {
// 0 618 1240 2350 // 0 618 1240 2350
switch (id) { switch (id) {
...@@ -1286,11 +1303,10 @@ onMounted(async () => { ...@@ -1286,11 +1303,10 @@ onMounted(async () => {
const box7Chart = getDoublePieChart(box7Data.value[0], box7Data.value[1]); const box7Chart = getDoublePieChart(box7Data.value[0], box7Data.value[1]);
setChart(box7Chart, "box7Chart"); setChart(box7Chart, "box7Chart");
const box9Chart = getPieChart(box9ChartData.value, box9ChartColorList.value);
setChart(box9Chart, "box9Chart");
await handleGetHotBills(); await handleGetHotBills();
curBill.value = hotBillList.value[0]; curBill.value = hotBillList.value[0];
handleBox9Data();
}); });
onUnmounted(() => {}); onUnmounted(() => {});
......
const getPieChart = (data,colorList) => { const getPieChart = (data,colorList) => {
let option = { let option = {
color: colorList, // color: colorList,
series: [ series: [
{ {
type: 'pie', type: 'pie',
......
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
:key="index" :key="index"
@click="handleClickBox1Btn(item, index)" @click="handleClickBox1Btn(item, index)"
> >
{{ item.hylymc }} {{ item.name }}
</div> </div>
</div> </div>
</div> </div>
...@@ -343,8 +343,8 @@ const handleGetHylyList = async () => { ...@@ -343,8 +343,8 @@ const handleGetHylyList = async () => {
try { try {
const res = await getHylyList(); const res = await getHylyList();
console.log("行业领域字典列表", res); console.log("行业领域字典列表", res);
industryList.value = res.data; industryList.value = res.data.slice(0,6)
curHylyId.value = res.data[0].hylyid; curHylyId.value = res.data[0].id;
} catch (error) {} } catch (error) {}
}; };
...@@ -353,7 +353,8 @@ const curHylyId = ref(""); ...@@ -353,7 +353,8 @@ const curHylyId = ref("");
// 根据行业领域id获取公司列表 // 根据行业领域id获取公司列表
const handleGetCompanyListById = async () => { const handleGetCompanyListById = async () => {
const params = { const params = {
id: curHylyId.value // id: curHylyId.value
id: '0100'
}; };
try { try {
const res = await getCompanyList(params); const res = await getCompanyList(params);
...@@ -785,7 +786,7 @@ onMounted(async () => { ...@@ -785,7 +786,7 @@ onMounted(async () => {
.left-center-btn { .left-center-btn {
margin-right: 4px; margin-right: 4px;
height: 28px; height: 28px;
width: 60px; width: 70px;
text-align: center; text-align: center;
padding: 0 5px; padding: 0 5px;
box-sizing: border-box; box-sizing: border-box;
......
...@@ -21,12 +21,12 @@ ...@@ -21,12 +21,12 @@
<div class="box1-right"> <div class="box1-right">
<div class="box1-right-item"> <div class="box1-right-item">
<div class="item-left">提案人:</div> <div class="item-left">提案人:</div>
<div class="item-right">乔迪·C·阿灵顿​(共和党-得克萨斯州第19选区)</div> <div class="item-right">{{basicInfo.tarName}}</div>
</div> </div>
<div class="box1-right-item"> <div class="box1-right-item">
<div class="item-left">提出时间:</div> <div class="item-left">提出时间:</div>
<div class="item-right">2025年5月20日</div> <div class="item-right">{{basicInfo.introductionDate}}</div>
</div> </div>
<div class="box1-right-item"> <div class="box1-right-item">
<div class="item-left">相关领域:</div> <div class="item-left">相关领域:</div>
...@@ -38,47 +38,35 @@ ...@@ -38,47 +38,35 @@
</div> </div>
<div class="box1-right-item"> <div class="box1-right-item">
<div class="item-left">法案类别:</div> <div class="item-left">法案类别:</div>
<div class="item-right">公法(编号:Pub. L. No. 119-21)</div> <div class="item-right">{{ basicInfo.typeName }}</div>
</div> </div>
<div class="box1-right-item"> <div class="box1-right-item">
<div class="item-left">提案人</div> <div class="item-left">委员会报告</div>
<div class="item-right2"> <div class="item-right2" v-if="basicInfo.reportList">
<div class="right2-item">H. Rept. 119-106, Book 1</div> <div class="right2-item" v-for="item,index in basicInfo.reportList" :key="index">{{ item }}</div>
<div class="right2-item">H. Rept. 119-106, Book 2​(两份独立报告)</div>
</div> </div>
</div> </div>
<div class="box1-right-item"> <div class="box1-right-item">
<div class="item-left">表决记录:</div> <div class="item-left">表决记录:</div>
<div class="item-right3">全程共进行 ​47次唱名表决</div> <div class="item-right3">{{`全程共进行${basicInfo.votetotal}次唱名表决`}}</div>
</div> </div>
<div class="box1-right-item"> <div class="box1-right-item">
<div class="item-left">最近状态:</div> <div class="item-left">最近状态:</div>
<div class="item-right3">2025年7月4日​ 由总统签署生效</div> <div class="item-right3">{{ basicInfo.status }}</div>
</div> </div>
<div class="box1-right-item"> <div class="box1-right-item">
<div class="item-left">立案流程:</div> <div class="item-left">立案流程:</div>
<div class="item-right4"> <div class="item-right4">
<!-- <el-steps <div class="step" v-for="(item, index) in basicInfo.stageList" :key="index">
style="max-width: 500px"
:active="6"
finish-status="success"
>
<el-step title="提出" />
<el-step title="众议院通过" />
<el-step title="参议院通过" />
<el-step title="分歧协调" />
<el-step title="提交总统" />
<el-step title="法案通过" />
</el-steps> -->
<div class="step" v-for="(item, index) in stepList" :key="index">
<div class="step-box" v-if="!item.active"> <div class="step-box" v-if="!item.active">
{{ item.title }} {{ item }}
<div class="right-arrow"> <div class="right-arrow">
<img src="./assets/icons/arrow-right.png" alt="" /> <img src="./assets/icons/arrow-right.png" alt="" />
</div> </div>
</div> </div>
<div class="step-box-active" v-else> <div class="step-box-active" v-else>
{{ item.title }} {{ item }}
<div class="right-arrow"> <div class="right-arrow">
<img src="./assets/icons/arrow-right.png" alt="" /> <img src="./assets/icons/arrow-right.png" alt="" />
</div> </div>
...@@ -120,8 +108,8 @@ ...@@ -120,8 +108,8 @@
<div class="box2-center-item-box" v-if="box2BtnActive == 1"> <div class="box2-center-item-box" v-if="box2BtnActive == 1">
<div class="box2-center-item" v-for="(item, index) in progressList" :key="index"> <div class="box2-center-item" v-for="(item, index) in progressList" :key="index">
<div class="tip" :class="{ tipActive: item.fxdj }"></div> <div class="tip" :class="{ tipActive: item.fxdj }"></div>
<div class="date">{{ item.sjsj }}</div> <div class="date">{{ item.actionDate }}</div>
<div class="title">{{ item.sjnr }}</div> <div class="title">{{ item.actionContentCn }}</div>
<div class="info"> <div class="info">
<div class="info-box danger-box4" v-if="item.fxdj === '特别重大风险'"> <div class="info-box danger-box4" v-if="item.fxdj === '特别重大风险'">
{{ item.fxdj }} {{ item.fxdj }}
...@@ -545,6 +533,9 @@ const handleClickMore2 = () => { ...@@ -545,6 +533,9 @@ const handleClickMore2 = () => {
}; };
// 获取基本信息 // 获取基本信息
const basicInfo = ref({})
const handleGetBasicInfo = async () => { const handleGetBasicInfo = async () => {
const params = { const params = {
id: window.sessionStorage.getItem("billId") id: window.sessionStorage.getItem("billId")
...@@ -552,6 +543,7 @@ const handleGetBasicInfo = async () => { ...@@ -552,6 +543,7 @@ const handleGetBasicInfo = async () => {
try { try {
const res = await getBillInfo(params); const res = await getBillInfo(params);
console.log("基本信息", res); console.log("基本信息", res);
basicInfo.value = res.data
} catch (error) { } catch (error) {
console.error(error); console.error(error);
} }
...@@ -588,15 +580,15 @@ const handleGetBillDyqk = async () => { ...@@ -588,15 +580,15 @@ const handleGetBillDyqk = async () => {
const res = await getBillDyqk(params); const res = await getBillDyqk(params);
console.log("前期进展", res); console.log("前期进展", res);
timelineData.value = res.data; timelineData.value = res.data;
faList.value = res.data.map(item => { // faList.value = res.data.map(item => {
return { // return {
label: item.dyms, // label: item.actionTitle,
value: item.dyms, // value: item.actionTitle,
id: item.id // id: item.id
}; // };
}); // });
selectValue.value = faList.value[0]; // selectValue.value = faList.value[0];
handleGetBillPerson(faList.value[0].id); // handleGetBillPerson(faList.value[0].id);
} catch (error) { } catch (error) {
console.error(error); console.error(error);
} }
......
...@@ -21,7 +21,6 @@ ...@@ -21,7 +21,6 @@
<div class="right-title"> <div class="right-title">
<img src="./assets/icon02.png" alt=""> <img src="./assets/icon02.png" alt="">
<div class="tit">社交媒体</div> <div class="tit">社交媒体</div>
<div class="more">更多 +</div>
</div> </div>
<div class="right-main"> <div class="right-main">
<div class="trump"> <div class="trump">
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<div class="left-top"> <div class="left-top">
<img src="./assets/icon01.png" alt="" /> <img src="./assets/icon01.png" alt="" />
<div class="left-top-title">合作限制动态</div> <div class="left-top-title">合作限制动态</div>
<span>查看详情 ></span> <div class="more" @click="handleClickToDetail">查看详情 ></div>
</div> </div>
<div class="left-center"> <div class="left-center">
<img src="./assets/usImg.png" alt="" /> <img src="./assets/usImg.png" alt="" />
...@@ -167,12 +167,14 @@ const handleToMoreRiskSignal = () => { ...@@ -167,12 +167,14 @@ const handleToMoreRiskSignal = () => {
top: 15px; top: 15px;
left: 23px; left: 23px;
} }
span { .more {
position: absolute;
height: 48px;
line-height: 48px;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
font-family: "Microsoft YaHei"; font-family: "Microsoft YaHei";
position: absolute; top: 0;
top: 19px;
right: 40px; right: 40px;
color: rgb(5, 95, 194); color: rgb(5, 95, 194);
cursor: pointer; cursor: pointer;
......
...@@ -45,14 +45,17 @@ const initChart = () => { ...@@ -45,14 +45,17 @@ const initChart = () => {
{ {
type: "wordCloud", type: "wordCloud",
shape: props.shape, shape: props.shape,
width: '100%',
height: '100%',
// 其他形状你可以使用形状路径 // 其他形状你可以使用形状路径
// shape: 'circle', // 示例 // shape: 'circle', // 示例
// 或者自定义路径 // 或者自定义路径
gridSize: 20, // 网格大小,影响词间距。 gridSize: 30, // 网格大小,影响词间距。
sizeRange: [15, 25], // 定义词云中文字大小的范围 sizeRange: [15, 40], // 定义词云中文字大小的范围
rotationRange: [0, 0], rotationRange: [0, 0],
rotationStep: 0, rotationStep: 0,
drawOutOfBound: false, // 是否超出画布 drawOutOfBound: false, // 是否超出画布
shrinkToFit: true, // 是否自动缩小以适应容器
// 字体 // 字体
textStyle: { textStyle: {
// normal: { // normal: {
......
...@@ -117,7 +117,7 @@ ...@@ -117,7 +117,7 @@
</div> </div>
<div class="title">{{ "最新科技政令" }}</div> <div class="title">{{ "最新科技政令" }}</div>
</div> </div>
<div class="box1-header-right"> <div class="box1-header-right" @click="handleClickToDetail">
{{ "查看详情 >" }} {{ "查看详情 >" }}
</div> </div>
</div> </div>
...@@ -239,7 +239,6 @@ ...@@ -239,7 +239,6 @@
<img src="./assets/images/box4-header-icon.png" alt="" /> <img src="./assets/images/box4-header-icon.png" alt="" />
</div> </div>
<div class="header-title">{{ "社交媒体" }}</div> <div class="header-title">{{ "社交媒体" }}</div>
<div class="more">{{ "更多 +" }}</div>
</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">
......
...@@ -47,8 +47,9 @@ defineProps({ ...@@ -47,8 +47,9 @@ defineProps({
<style scoped> <style scoped>
.message-bubble { .message-bubble {
display: flex; display: flex;
max-width: 600px; max-width: 720px;
margin: 20px 0; margin-top: 5px;
margin-bottom: 16px;
} }
.avatar-container { .avatar-container {
...@@ -71,7 +72,7 @@ defineProps({ ...@@ -71,7 +72,7 @@ defineProps({
.bubble { .bubble {
background-color: rgba(246, 250, 255, 1); background-color: rgba(246, 250, 255, 1);
border-radius: 12px; border-radius: 12px;
padding: 12px 16px; padding: 10px 16px;
position: relative; position: relative;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
} }
...@@ -80,24 +81,37 @@ defineProps({ ...@@ -80,24 +81,37 @@ defineProps({
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
margin-bottom: 8px; margin-bottom: 5px;
} }
.name { .name {
font-weight: bold; color: rgba(59, 65, 75, 1);
font-size: 14px; font-family: Microsoft YaHei;
color: #333; font-size: 16px;
font-weight: 700;
line-height: 24px;
letter-spacing: 1px;
text-align: left;
} }
.meta { .meta {
font-size: 12px; color: rgba(95, 101, 108, 1);
color: #999; font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 30px;
letter-spacing: 0px;
text-align: right;
} }
.bubble-content { .bubble-content {
font-size: 14px; color: rgba(59, 65, 75, 1);
line-height: 1.5; font-family: Microsoft YaHei;
color: #333; font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: justify;
} }
.triangle { .triangle {
......
...@@ -41,7 +41,9 @@ defineProps({ ...@@ -41,7 +41,9 @@ defineProps({
} }
.title-text { .title-text {
font-size: 20px; color: rgba(10, 18, 30, 1);
font-size: 32px;
font-family: Microsoft YaHei;
font-weight: bold; font-weight: bold;
margin-left: 20px; margin-left: 20px;
white-space: nowrap; white-space: nowrap;
......
...@@ -220,12 +220,6 @@ ...@@ -220,12 +220,6 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<custom-container title="社交媒体" :titleIcon="dialogIcon" height="450px"> <custom-container title="社交媒体" :titleIcon="dialogIcon" height="450px">
<template #header-right>
<el-button type="primary" link>
{{ "更多 +" }}
</el-button>
</template>
<template #default> <template #default>
<div class="dialog-list"> <div class="dialog-list">
<!-- <MessageBubble <!-- <MessageBubble
...@@ -570,12 +564,6 @@ import newsImg from "@/assets/images/news-img.png"; ...@@ -570,12 +564,6 @@ import newsImg from "@/assets/images/news-img.png";
import { getHotBills, getBillsByType, getHylyList } from "@/api/home"; import { getHotBills, getBillsByType, getHylyList } from "@/api/home";
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 bill1 from "./assets/images/bill1.png"; import bill1 from "./assets/images/bill1.png";
......
...@@ -397,116 +397,6 @@ export function getMapOption() { ...@@ -397,116 +397,6 @@ export function getMapOption() {
color: 'rgba(255, 77, 79, 1)' color: 'rgba(255, 77, 79, 1)'
} }
} }
}, {
name: '个人会员数量',
type: 'map',
geoIndex: 0,
tooltip: {
show: false
},
data: [{
name: '北京',
value: 2256
}, {
name: '天津',
value: 744
}, {
name: '上海',
value: 578
}, {
name: '重庆',
value: 806
}, {
name: '河北',
value: 432
}, {
name: '河南',
value: 590
}, {
name: '云南',
value: 132
}, {
name: '辽宁',
value: 487
}, {
name: '黑龙江',
value: 336
}, {
name: '湖南',
value: 295
}, {
name: '安徽',
value: 398
}, {
name: '山东',
value: 1055
}, {
name: '新疆',
value: 201
}, {
name: '江苏',
value: 795
}, {
name: '浙江',
value: 655
}, {
name: '江西',
value: 311
}, {
name: '湖北',
value: 993
}, {
name: '广西',
value: 261
}, {
name: '甘肃',
value: 349
}, {
name: '山西',
value: 273
}, {
name: '内蒙古',
value: 343
}, {
name: '陕西',
value: 319
}, {
name: '吉林',
value: 325
}, {
name: '福建',
value: 317
}, {
name: '贵州',
value: 275
}, {
name: '广东',
value: 1000
}, {
name: '青海',
value: 97
}, {
name: '西藏',
value: 18
}, {
name: '四川',
value: 601
}, {
name: '宁夏',
value: 126
}, {
name: '海南',
value: 186
}, {
name: '台湾',
value: 0
}, {
name: '香港',
value: 11
}, {
name: '澳门',
value: 0
}]
}] }]
}; };
return option return option
......
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
<el-col :span="16"> <el-col :span="16">
<custom-container titleType="primary" title="最新出口管制政策" :titleIcon="houseIcon" height="450px"> <custom-container titleType="primary" title="最新出口管制政策" :titleIcon="houseIcon" height="450px">
<template #header-right> <template #header-right>
<el-button type="primary" link> <el-button type="primary" link @click="handleToDetail">
{{ "查看详情 >" }} {{ "查看详情 >" }}
</el-button> </el-button>
</template> </template>
...@@ -171,12 +171,6 @@ ...@@ -171,12 +171,6 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<custom-container title="社交媒体" :titleIcon="dialogIcon" height="450px"> <custom-container title="社交媒体" :titleIcon="dialogIcon" height="450px">
<template #header-right>
<el-button type="primary" link>
{{ "更多 +" }}
</el-button>
</template>
<template #default> <template #default>
<div class="dialog-list"> <div class="dialog-list">
<!-- <MessageBubble <!-- <MessageBubble
......
...@@ -70,19 +70,19 @@ ...@@ -70,19 +70,19 @@
</div> </div>
</div> </div>
<div class="home-main-header-btn-box" v-show="!isShow"> <div class="home-main-header-btn-box" v-show="!isShow">
<div class="btn" @click="handleToPosi('position1')"> <div class="btn" @click="scrollToTop('position1')">
<div class="btn-text">{{ "最新动态" }}</div> <div class="btn-text">{{ "最新动态" }}</div>
<div class="btn-icon">{{ ">" }}</div> <div class="btn-icon">{{ ">" }}</div>
</div> </div>
<div class="btn" @click="handleToPosi('position2')"> <div class="btn" @click="scrollToTop('position2')">
<div class="btn-text">{{ "资讯要闻" }}</div> <div class="btn-text">{{ "资讯要闻" }}</div>
<div class="btn-icon">{{ ">" }}</div> <div class="btn-icon">{{ ">" }}</div>
</div> </div>
<div class="btn" @click="handleToPosi('position3')"> <div class="btn" @click="scrollToTop('position3')">
<div class="btn-text">{{ "数据总览" }}</div> <div class="btn-text">{{ "数据总览" }}</div>
<div class="btn-icon">{{ ">" }}</div> <div class="btn-icon">{{ ">" }}</div>
</div> </div>
<div class="btn" @click="handleToPosi('position4')"> <div class="btn" @click="scrollToTop('position4')">
<div class="btn-text">{{ "资源库" }}</div> <div class="btn-text">{{ "资源库" }}</div>
<div class="btn-icon">{{ ">" }}</div> <div class="btn-icon">{{ ">" }}</div>
</div> </div>
...@@ -204,7 +204,6 @@ ...@@ -204,7 +204,6 @@
<img src="./assets/images/box4-header-icon.png" alt="" /> <img src="./assets/images/box4-header-icon.png" alt="" />
</div> </div>
<div class="header-title">{{ "社交媒体" }}</div> <div class="header-title">{{ "社交媒体" }}</div>
<div class="more">{{ "更多 +" }}</div>
</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">
...@@ -377,7 +376,8 @@ ...@@ -377,7 +376,8 @@
<div class="item-text2">{{ item.area }}</div> <div class="item-text2">{{ item.area }}</div>
<div class="taglist"> <div class="taglist">
<div class="tag1" style="width: 82px;" <div class="tag1" style="width: 82px;"
v-for="val in item.tag" v-for="val,idx in item.tag"
:key="idx"
:class="{tag2: val === '新能源', :class="{tag2: val === '新能源',
tag3: val === '集成电路', tag3: val === '集成电路',
tag4: val === '生物科技', tag4: val === '生物科技',
...@@ -410,6 +410,7 @@ import { onMounted, ref, computed } from "vue"; ...@@ -410,6 +410,7 @@ import { onMounted, ref, computed } from "vue";
import * as echarts from "echarts"; import * as echarts from "echarts";
import router from "@/router"; import router from "@/router";
import DivideHeader from "@/components/DivideHeader.vue"; import DivideHeader from "@/components/DivideHeader.vue";
import scrollToTop from "@/utils/scrollToTop";
import { useContainerScroll } from "@/hooks/useScrollShow"; import { useContainerScroll } from "@/hooks/useScrollShow";
import getBarChart from "./utils/barChart"; import getBarChart from "./utils/barChart";
import getPieChart from "./utils/piechart"; import getPieChart from "./utils/piechart";
......
...@@ -116,7 +116,7 @@ ...@@ -116,7 +116,7 @@
</div> </div>
<div class="title">{{ "调查进展" }}</div> <div class="title">{{ "调查进展" }}</div>
</div> </div>
<div class="box1-header-right"> <div class="box1-header-right" @click="handleClickToDetail('337')">
{{ "查看详情 >" }} {{ "查看详情 >" }}
</div> </div>
</div> </div>
...@@ -253,7 +253,6 @@ ...@@ -253,7 +253,6 @@
<img src="./assets/images/header-message.png" alt="" /> <img src="./assets/images/header-message.png" alt="" />
</div> </div>
<div class="header-title">{{ "社交媒体" }}</div> <div class="header-title">{{ "社交媒体" }}</div>
<div class="more">{{ "更多 +" }}</div>
</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">
......
...@@ -271,7 +271,7 @@ const totalDistribution = ref([ ...@@ -271,7 +271,7 @@ const totalDistribution = ref([
}, },
{ {
titlle: "投融资限制", titlle: "投融资限制",
value: 80, value: 66,
text: "119", text: "119",
unit: "次", unit: "次",
change: "较上月+1", change: "较上月+1",
...@@ -314,6 +314,15 @@ const totalDistribution = ref([ ...@@ -314,6 +314,15 @@ const totalDistribution = ref([
path: "/scientificFunding", path: "/scientificFunding",
color: ["#FDE19A", "#FEECBD", "#FFFBE6", "#D68E16"] color: ["#FDE19A", "#FEECBD", "#FFFBE6", "#D68E16"]
}, },
{
titlle: "创新主体",
value: 89,
text: "89",
unit: "次",
change: "较上月+8",
path: "/innovationSubject",
color: ["#C9AAF0", "#DFCAF6", "#FAF1FF", "#531DAC"]
}
]); ]);
const startIndex = ref(0); const startIndex = ref(0);
...@@ -497,11 +506,11 @@ const handleClickItem = item => { ...@@ -497,11 +506,11 @@ const handleClickItem = item => {
}; };
const swiper = ref(null); const swiper = ref(null);
const isOnSwiper = ref(true) const isOnSwiper = ref(true);
const handleChangeSwiper = (val) => { const handleChangeSwiper = val => {
isOnSwiper.value = val isOnSwiper.value = val;
} };
onMounted(() => { onMounted(() => {
swiper.value = setInterval(() => { swiper.value = setInterval(() => {
......
...@@ -193,7 +193,7 @@ export default { ...@@ -193,7 +193,7 @@ export default {
.card { .card {
position: absolute; position: absolute;
height: 180px; height: 180px;
width: 15vw; width:320px;
padding: 8px 12px; padding: 8px 12px;
text-align: left; text-align: left;
cursor: pointer; cursor: pointer;
......
...@@ -2,7 +2,22 @@ ...@@ -2,7 +2,22 @@
<template> <template>
<div class="content-main"> <div class="content-main">
<!-- 面包屑 --> <!-- 面包屑 -->
<div class="content-title"><span>国家科技安全</span>> <span>中美博弈概览 </span></div> <div class="content-title">
<span>国家科技安全</span>> <span>中美博弈概览 </span>
<div class="header-search-box">
<div class="header-search-left">
<div class="input-box">
<el-input v-model="searchText" style="width: 324px" />
</div>
<div class="icon">
<img src="./assets/images/search-icon.png" alt="" />
</div>
</div>
<div class="header-search-right" @click="handleToSearch">
<div class="header-img-box"><img src="./assets/images/search-btn.png" alt="" /></div>
</div>
</div>
</div>
<!-- 中美博弈最新动态内容--> <!-- 中美博弈最新动态内容-->
<div class="content-box"> <div class="content-box">
<div class="title-text">中美博弈最新动态</div> <div class="title-text">中美博弈最新动态</div>
...@@ -14,7 +29,7 @@ ...@@ -14,7 +29,7 @@
<div class="item-header"> <div class="item-header">
<img class="item-header-icon" src="@/assets/images/icon/overview-card-header-icon.png" /> <img class="item-header-icon" src="@/assets/images/icon/overview-card-header-icon.png" />
<div class="item-header-text">机构动态</div> <div class="item-header-text">机构动态</div>
<div class="item-header-more">更多 +</div> <!-- <div class="item-header-more">更多 +</div> -->
</div> </div>
<div class="item-header-divider"></div> <div class="item-header-divider"></div>
<div class="item-content"> <div class="item-content">
...@@ -37,17 +52,27 @@ ...@@ -37,17 +52,27 @@
}} }}
</div> </div>
</div> </div>
<img class="item-card-content-title-image" :src="organizationNews[organizationNewsShow].image" <img
alt="" /> class="item-card-content-title-image"
:src="organizationNews[organizationNewsShow].image"
alt=""
/>
</div> </div>
<div class="item-header-divider"></div> <div class="item-header-divider"></div>
<div class="item-card-content-text"> <div class="item-card-content-text">
{{ organizationNews[organizationNewsShow].content }} {{ organizationNews[organizationNewsShow].content }}
</div> </div>
<div style="display: flex;margin-top: 30px;"> <div style="display: flex; margin-top: 30px">
<div class="item-card-content-tag" v-for="(tag, index) in organizationNews[organizationNewsShow].tag" <div
class="item-card-content-tag"
v-for="(tag, index) in organizationNews[organizationNewsShow].tag"
:key="index" :key="index"
:style="{ color: tag.textColor, background: tag.color, border: `1px solid ${tag.textColor}` }"> :style="{
color: tag.textColor,
background: tag.color,
border: `1px solid ${tag.textColor}`
}"
>
{{ tag.text }} {{ tag.text }}
</div> </div>
</div> </div>
...@@ -80,18 +105,22 @@ ...@@ -80,18 +105,22 @@
<div class="item left"> <div class="item left">
<div class="item-header"> <div class="item-header">
<img class="item-header-icon" src="@/assets/images/icon/waring-card-header-icon.png" /> <img class="item-header-icon" src="@/assets/images/icon/waring-card-header-icon.png" />
<div class="item-header-text" style="background-color: #ce4f51">风险信号 <div class="num">{{ warningList.length <div class="item-header-text" style="background-color: #ce4f51">
}}</div> 风险信号
<div class="num">{{ warningList.length }}</div>
</div> </div>
</div> </div>
<div class="item-header-divider"></div> <div class="item-header-divider"></div>
<div style="padding: 30px 23px; height: 400px"> <div style="padding: 30px 23px; height: 400px">
<div class="waring-item" v-for="(item, index) in warningList" :key="index"> <div class="waring-item" v-for="(item, index) in warningList" :key="index">
<div style="display: flex; height: 47px"> <div style="display: flex; height: 47px">
<div class="waring-status" :style="{ <div
color: item.status === 0 ? '#CE4F51' : item.status === 1 ? '#FA8C16' : '#52C41A', class="waring-status"
backgroundColor: item.status === 0 ? '#FFF1F0' : item.status === 1 ? '#FFF7E6' : '#F6FFED' :style="{
}"> color: item.status === 0 ? '#CE4F51' : item.status === 1 ? '#FA8C16' : '#52C41A',
backgroundColor: item.status === 0 ? '#FFF1F0' : item.status === 1 ? '#FFF7E6' : '#F6FFED'
}"
>
{{ item.status === 0 ? "特别重大" : item.status === 1 ? "重大风险" : "一般风险" }} {{ item.status === 0 ? "特别重大" : item.status === 1 ? "重大风险" : "一般风险" }}
</div> </div>
<div class="waring-text"> <div class="waring-text">
...@@ -113,8 +142,10 @@ ...@@ -113,8 +142,10 @@
<div class="item right"> <div class="item right">
<div class="item-header"> <div class="item-header">
<img class="item-header-icon" src="@/assets/images/icon/news-card-header-icon.png" /> <img class="item-header-icon" src="@/assets/images/icon/news-card-header-icon.png" />
<div class="item-header-text" style="background: rgba(255, 255, 255, 0.65); color: #055fc2">新闻资讯</div> <div class="item-header-text-1" style="color: #055fc2">新闻资讯</div>
<div class="item-header-more" style="color: #055fc2; cursor: pointer;" @click="handleToMoreNews">更多 +</div> <div class="item-header-more" style="color: #055fc2; cursor: pointer" @click="handleToMoreNews">
更多 +
</div>
</div> </div>
<div class="item-header-divider"></div> <div class="item-header-divider"></div>
<div class="news-box"> <div class="news-box">
...@@ -137,8 +168,7 @@ ...@@ -137,8 +168,7 @@
<div class="item right"> <div class="item right">
<div class="item-header"> <div class="item-header">
<img class="item-header-icon" src="@/assets/images/icon/people-card-header-icon.png" /> <img class="item-header-icon" src="@/assets/images/icon/people-card-header-icon.png" />
<div class="item-header-text" style="background: rgba(255, 255, 255, 0.65); color: #055fc2">人物动态</div> <div class="item-header-text-1" style="color: #055fc2">人物动态</div>
<div class="item-header-more" style="color: #055fc2">更多 +</div>
</div> </div>
<div class="item-header-divider"></div> <div class="item-header-divider"></div>
<div class="character-box"> <div class="character-box">
...@@ -174,7 +204,14 @@ import Thematicanalysis from "./component/Thematicanalysis.vue"; ...@@ -174,7 +204,14 @@ import Thematicanalysis from "./component/Thematicanalysis.vue";
import ResourceSupport from "./component/ResourceSupport.vue"; import ResourceSupport from "./component/ResourceSupport.vue";
import strengthComparison from "./component/strengthComparison.vue"; import strengthComparison from "./component/strengthComparison.vue";
import router from "@/router"; import router from "@/router";
import { color } from "echarts";
const searchText = ref("");
// 跳转到综合检索页面
const handleToSearch = () => {
const route = router.resolve("/comprehensiveSearch");
window.open(route.href, "_blank");
};
// 查看更多风险信号 // 查看更多风险信号
const handleToMoreRiskSignal = () => { const handleToMoreRiskSignal = () => {
...@@ -188,7 +225,6 @@ const handleToMoreNews = () => { ...@@ -188,7 +225,6 @@ const handleToMoreNews = () => {
window.open(route.href, "_blank"); window.open(route.href, "_blank");
}; };
const organizationNews = ref([ const organizationNews = ref([
{ {
title: "美国白宫发布关于进一步延长TikTok执法宽限期的行政令", title: "美国白宫发布关于进一步延长TikTok执法宽限期的行政令",
...@@ -221,13 +257,13 @@ const organizationNews = ref([ ...@@ -221,13 +257,13 @@ const organizationNews = ref([
{ {
color: "#F5222D", color: "#F5222D",
textColor: "#FFF1F0", textColor: "#FFF1F0",
borderColor: 'rgba(255, 163, 158, 1)', borderColor: "rgba(255, 163, 158, 1)",
text: "人工智能" text: "人工智能"
}, },
{ {
color: "#E6F4FF", color: "#E6F4FF",
textColor: "#1677FF", textColor: "#1677FF",
borderColor: 'rgba(145, 202, 255, 1)', borderColor: "rgba(145, 202, 255, 1)",
text: "通信网络" text: "通信网络"
} }
] ]
...@@ -388,7 +424,7 @@ function changeOrganizationNews(type) { ...@@ -388,7 +424,7 @@ function changeOrganizationNews(type) {
: (organizationNewsShow.value = organizationNewsShow.value + 1); : (organizationNewsShow.value = organizationNewsShow.value + 1);
} }
} }
onMounted(() => { }); onMounted(() => {});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -413,6 +449,52 @@ onMounted(() => { }); ...@@ -413,6 +449,52 @@ onMounted(() => { });
background: url("../../assets/images/bg//header-bg.png"); background: url("../../assets/images/bg//header-bg.png");
box-sizing: border-box; box-sizing: border-box;
padding-left: 160px; padding-left: 160px;
position: relative;
.header-search-box {
position: absolute;
top: 14px;
right: 160px;
display: flex;
gap: 12px;
justify-content: flex-end;
.header-search-left {
width: 360px;
height: 36px;
line-height: 36px;
border-radius: 4px;
background: rgba(255, 255, 255, 0.3);
display: flex;
.input-box {
width: 324px;
}
.icon {
width: 36px;
height: 36px;
img {
width: 100%;
height: 100%;
}
}
}
.header-search-right {
width: 36px;
height: 36px;
line-height: 36px;
// box-sizing: border-box;
border-radius: 4px;
background: rgba(255, 255, 255, 0.3);
cursor: pointer;
.header-img-box {
width: 19px;
height: 24px;
margin: 6px auto;
img {
width: 100%;
height: 100%;
}
}
}
}
} }
.content-box { .content-box {
...@@ -470,6 +552,7 @@ onMounted(() => { }); ...@@ -470,6 +552,7 @@ onMounted(() => { });
height: 48px; height: 48px;
width: 100%; width: 100%;
display: flex; display: flex;
position: relative;
.item-header-icon { .item-header-icon {
width: 20px; width: 20px;
...@@ -508,6 +591,15 @@ onMounted(() => { }); ...@@ -508,6 +591,15 @@ onMounted(() => { });
font-size: 14px; font-size: 14px;
} }
} }
.item-header-text-1 {
// width: 150px;
height: 48px;
line-height: 48px;
text-align: left;
font-weight: 700;
font-size: 20px;
font-family: Microsoft YaHei;
}
.item-header-num { .item-header-num {
width: 30px; width: 30px;
...@@ -535,9 +627,10 @@ onMounted(() => { }); ...@@ -535,9 +627,10 @@ onMounted(() => { });
font-size: 16px; font-size: 16px;
line-height: 48px; line-height: 48px;
text-align: center; text-align: center;
margin-left: calc(100% - 200px);
width: 50px; width: 50px;
margin-left: calc(100% - 250px); position: absolute;
top: 0;
right: 27px;
} }
} }
...@@ -905,4 +998,30 @@ onMounted(() => { }); ...@@ -905,4 +998,30 @@ onMounted(() => { });
} }
} }
} }
:deep(.el-input__wrapper) {
box-shadow: none;
background: none;
}
:deep(.el-input__wrapper:hover) {
box-shadow: none !important;
}
:deep(.el-input__wrapper.is-focus) {
box-shadow: none !important;
}
:deep(.el-input__inner::placeholder) {
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
}
:deep(.el-input__inner) {
color: #fff;
font-family: Microsoft YaHei;
font-size: 18px;
font-weight: 400;
line-height: 34px;
}
</style> </style>
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
:style="{ :style="{
backgroundColor: titleBackgroundColor, backgroundColor: titleBackgroundColor,
color: titleColor, color: titleColor,
fontSize: titleFontSize,
paddingLeft: titleTextAlign === 'left' ? '0px' : '20px' paddingLeft: titleTextAlign === 'left' ? '0px' : '20px'
}" }"
> >
...@@ -31,7 +32,7 @@ ...@@ -31,7 +32,7 @@
</slot> </slot>
</div> </div>
</div> </div>
<div class="body"> <div class="body" :style="bodyStyle">
<slot name="default"> </slot> <slot name="default"> </slot>
</div> </div>
</div> </div>
...@@ -44,7 +45,7 @@ const emit = defineEmits(["moreClick"]); ...@@ -44,7 +45,7 @@ const emit = defineEmits(["moreClick"]);
defineProps({ defineProps({
titleBackgroundColor: { titleBackgroundColor: {
type: String, type: String,
default: "red" default: "transparent"
}, },
titleColor: { titleColor: {
type: String, type: String,
...@@ -69,6 +70,16 @@ defineProps({ ...@@ -69,6 +70,16 @@ defineProps({
headerHeight: { headerHeight: {
type: String, type: String,
default: "48px" default: "48px"
},
titleFontSize: {
type: String,
default: "20px"
},
bodyStyle: {
type: Object,
default: function () {
return {};
}
} }
}); });
function moreClick() { function moreClick() {
......
差异被折叠。
import * as echarts from "echarts"; import * as echarts from "echarts";
const getPieChart = (number, current, total) => { import worldJson from '@/assets/json/world.json'
import _ from "lodash";
export function getPieChart(number, current, total) {
const option = { const option = {
// 图表标题可置于中心,模拟居中文字的一部分 // 图表标题可置于中心,模拟居中文字的一部分
title: { title: {
...@@ -67,12 +69,136 @@ const getPieChart = (number, current, total) => { ...@@ -67,12 +69,136 @@ const getPieChart = (number, current, total) => {
}; };
return option return option
} }
const setChart = (option, chartDom) => { export function setChart(option, chartDom) {
let chart = echarts.init(chartDom); let chart = echarts.init(chartDom);
chart.setOption(option); chart.setOption(option);
return chart; return chart;
}; };
export { export function getMapOption(data,levelMap) {
getPieChart, echarts.registerMap('world', worldJson);
setChart function convertData(data) {
let res = [];
_.each(data, (item1) => {
_.each(item1.children, (item) => {
res.push({
name: item1.name,
value: item.position.concat(item.level),
itemStyle: {
color: levelMap[item.level].color[0],
borderColor: levelMap[item.level].color[1]
}
});
})
})
return res;
}
let option = {
tooltip: {
show: false
},
// visualMap: {
// type: 'piecewise', // 可选:'continuous' (连续型) 或 'piecewise' (分段型)[citation:2]
// dimension: 2, // 指定使用数据的第3个维度(即上面数据中的等级值)进行映射
// min: 1, // 映射范围最小值
// max: 5, // 映射范围最大值
// // 定义分段区间和颜色
// show: false,
// pieces: [
// {
// min: 1,
// max: 1,
// label: '特别重大风险',
// color: 'rgba(255, 77, 79, 1)'
// }, // 绿色
// {
// min: 2,
// max: 2,
// label: '重大风险',
// color: 'rgba(255, 169, 64, 1)'
// },
// {
// min: 3,
// max: 3,
// label: '较大风险',
// color: 'rgba(250, 219, 20, 1)'
// },
// {
// min: 4,
// max: 4,
// label: '一般风险',
// color: 'rgba(64, 150, 255, 1)'
// },
// {
// min: 5,
// max: 5,
// label: '几乎无风险',
// color: 'rgba(54, 207, 201, 1)'
// },
// ],
// orient: 'horizontal',
// left: 'center',
// top: 0
// },
geo: {
map: 'world',
roam: true,
// 地图尺寸为容器宽高较小值的80%
zoom: 1.5,
center: [31.614149450443932, 20.978078159827206],
// scaleLimit:{
// max:'1.2',
// min:'0.7'
// },
label: {
normal: {
show: false,
textStyle: {
color: 'rgba(0,0,0,0.6)'
}
}
},
itemStyle: {
areaColor: 'rgba(231, 243, 255, 1)', // 设置所有区域的默认填充色[citation:8]
borderColor: 'rgb(5, 95, 194)', // 设置边界线颜色[citation:8]
borderWidth: 1 // 设置边界线宽度[citation:8]
},
},
// backgroundColor: 'rgba(0,51,102, 1)',
series: [{
type: 'scatter',
coordinateSystem: 'geo',
data: convertData(data),
symbolSize: 10,
symbolRotate: 0,
symbolOffset: ['50%', '-100%'],
tooltip: {
show: true
},
label: {
normal: {
formatter: '{a}',
position: 'top',
show: false,
textStyle: {
color: '#000000',
fontSize: 16
}
},
emphasis: {
show: false
}
},
itemStyle: {
normal: {
borderWidth: 4,
borderColor: 'rgba(255, 163, 158, 1)',
color: 'rgba(255, 77, 79, 1)'
}
}
}]
};
return option
} }
\ No newline at end of file
...@@ -21,7 +21,6 @@ ...@@ -21,7 +21,6 @@
<div class="right-title"> <div class="right-title">
<img src="./assets/icon02.png" alt=""> <img src="./assets/icon02.png" alt="">
<div class="tit">社交媒体</div> <div class="tit">社交媒体</div>
<div class="more">更多 +</div>
</div> </div>
<div class="right-main"> <div class="right-main">
<div class="trump"> <div class="trump">
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<div class="left-top"> <div class="left-top">
<img src="./assets/icon01.png" alt="" /> <img src="./assets/icon01.png" alt="" />
<div class="left-top-title">规则限制动态</div> <div class="left-top-title">规则限制动态</div>
<span>查看详情 ></span> <div class="more" @click="handleClickToDetail">查看详情 ></div>
</div> </div>
<div class="left-center"> <div class="left-center">
<img src="./assets/usImg.png" alt="" /> <img src="./assets/usImg.png" alt="" />
...@@ -166,12 +166,14 @@ const handleToMoreRiskSignal = () => { ...@@ -166,12 +166,14 @@ const handleToMoreRiskSignal = () => {
top: 15px; top: 15px;
left: 23px; left: 23px;
} }
span { .more {
height: 48px;
line-height: 48px;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
font-family: "Microsoft YaHei"; font-family: "Microsoft YaHei";
position: absolute; position: absolute;
top: 19px; top: 0;
right: 40px; right: 40px;
color: rgb(5, 95, 194); color: rgb(5, 95, 194);
cursor: pointer; cursor: pointer;
......
...@@ -21,7 +21,6 @@ ...@@ -21,7 +21,6 @@
<div class="right-title"> <div class="right-title">
<img src="./assets/icon02.png" alt=""> <img src="./assets/icon02.png" alt="">
<div class="tit">社交媒体</div> <div class="tit">社交媒体</div>
<div class="more">更多 +</div>
</div> </div>
<div class="right-main"> <div class="right-main">
<div class="trump"> <div class="trump">
......
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论