提交 023c2fec authored 作者: 李智林's avatar 李智林

出口管制2.0部分对接

上级 f09e612f
......@@ -50,7 +50,8 @@ export function getEntitiesDataInfo() {
request({
method: "GET",
// url: '/api/entitiesDataInfo/latestInfoSelect',
url: "/api/entitiesDataInfo/getLatestInfo"
// url: "/api/entitiesDataInfo/getLatestInfo",
url: "/api/sanctionList/export/getLatestInfo"
})
);
}
......@@ -477,7 +478,7 @@ export function getEntitiesGrowthTrend() {
}
/**
* 实体清单更新频率
* 实体清单发布频度
* @returns {Promise<{
* series: number[]
* xAxis: string[]
......@@ -836,3 +837,28 @@ export function getScientificImpactEntityList(startTime) {
})
);
}
/**
* 概览页--获取出口管制制裁措施
* @param {Object} data
* @param {string} [data.typeName="实体清单"] - 类型名称
* @param {boolean} [data.isCn=true] - 是否只看中国实体
* @param {string[]} [data.techDomains] - 科技领域ID列表
* @param {number[]} [data.years] - 制裁年份列表
* @param {string} [data.startDate] - 开始时间
* @param {string} [data.endDate] - 结束时间
* @param {string} [data.keyword] - 搜索字段
* @param {number[]} [data.entityTypes] - 实体类型(2:科研院所;3:高校;4:企业)
* @param {number} [data.pageNum=1] - 页码
* @param {number} [data.pageSize=10] - 每页数量
*/
export function getExportControlList(data) {
return request200(
request({
method: "POST",
url: "/api/sanctionList/pageQuery",
data
})
);
}
\ No newline at end of file
import request from "@/api/request.js";
// 实体清单-制裁概况-获取实体清单基本信息
export function getEntityInfo() {
return request({
method: 'GET',
url: `/api/sanctionList/baseInfo/el`
})
}
// 实体清单-制裁概况-获取发布机构与重点人物
/**
* @param {sanTypeId}
* @header token
*/
export function getPublishInfo(params) {
return request({
method: 'GET',
url: `/api/sanctionList/getPublishedOrg`,
params,
})
}
// 实体清单-制裁概况-获取发布机构机构动态
/**
* @param {Object} data
* @param {string} data.orgId
* @header token
*/
export function getPublishOrgInfo(data) {
return request({
method: 'POST',
url: `/api/organization/relate/news`,
data,
})
}
// 实体清单-制裁概况-获取实体清单更新历史
/**
* @param {Object} data
* @param {string} [data.typeName="实体清单"] - 类型名称
* @param {boolean} [data.isCn=false] - 是否只看中国实体
* @param {number[]} [data.techDomainIds] - 科技领域ID列表
* @param {number} [data.pageNum=1] - 页码
* @param {number} [data.pageSize=10] - 每页数量
* @header token
*/
export function getEntityUpdateInfo(data) {
return request({
method: 'POST',
url: `/api/entitiesDataCount/getSanctionProcess`,
data,
})
}
/**
* 实体清单列表-制裁概况-获取实体清单列表
* @param {Object} data
* @param {string} [data.typeName="实体清单"] - 类型名称
* @param {boolean} [data.isCn=true] - 是否只看中国实体
* @param {string[]} [data.techDomains] - 科技领域ID列表
* @param {number[]} [data.years] - 制裁年份列表
* @param {string} [data.startDate] - 开始时间
* @param {string} [data.endDate] - 结束时间
* @param {string} [data.keyword] - 搜索字段
* @param {number[]} [data.entityTypes] - 实体类型(2:科研院所;3:高校;4:企业)
* @param {number} [data.pageNum=1] - 页码
* @param {number} [data.pageSize=10] - 每页数量
*/
export function getExportControlList(data, options = {}) {
return request({
method: "POST",
url: "/api/sanctionList/pageQuery",
data,
...options
})
}
// 实体清单-制裁概况-50%规则涉及实体数
/**
* @param {Object} data
* @param {string} [data.typeName="实体清单"] - 类型名称
* @param {boolean} [data.isCn=true] - 是否只看中国实体
* @param {string[]} [data.techDomains] - 科技领域ID列表
* @param {number[]} [data.years] - 制裁年份列表
* @param {string} [data.startDate] - 开始时间
* @param {string} [data.endDate] - 结束时间
* @param {string} [data.keyword] - 搜索字段
* @param {number[]} [data.entityTypes] - 实体类型(2:科研院所;3:高校;4:企业)
* @header token
*/
export function get50PercentEntityCount(data) {
return request({
method: 'POST',
url: `/api/sanctionList/getRuleCount`,
data,
})
}
// 实体清单-数据统计-总量统计
export function getTotalCount() {
return request({
method: 'GET',
url: `/api/sanctionList/statistics/el/total`
})
}
// 实体清单-数据统计-制裁实体数量变化情况
/**
* @param {countType}
* @header token
*/
export function getSanctionCountChange(params) {
return request({
method: 'GET',
url: `/api/sanctionList/statistics/el/num`,
params,
})
}
// 实体清单-数据统计-制裁实体地域分布情况
/**
* @param {Object} params
* @param {string} [params.startDate] - 开始时间
* @param {string} [params.endDate] - 结束时间
* @header token
*/
export function getRegionCount(params) {
return request({
method: 'GET',
url: `/api/sanctionList/statistics/el/region`,
params,
})
}
// 实体清单-数据统计-制裁实体领域分布情况
/**
* @param {Object} params
* @param {string} [params.startDate] - 开始时间
* @param {string} [params.endDate] - 结束时间
* @header token
*/
export function getTechDomainCount(params) {
return request({
method: 'GET',
url: `/api/sanctionList/statistics/el/domain`,
params,
})
}
// 实体清单-数据统计-制裁实体类型分布情况
/**
* @param {Object} params
* @param {string} [params.startDate] - 开始时间
* @param {string} [params.endDate] - 结束时间
* @header token
*/
export function getEntityTypeCount(params) {
return request({
method: 'GET',
url: `/api/sanctionList/statistics/el/entityType`,
params,
})
}
// 实体清单-深度挖掘-选择制裁
/**
* @param {Object} data
* @param {string} [data.startDate] - 开始时间
* @param {string} [data.endDate] - 结束时间
* @param {string} [data.typeName="实体清单"] - 类型名称
* @param {number} [data.pageNum=1] - 页码
* @param {number} [data.pageSize=10] - 每页数量
* @header token
*/
export function getDeepMiningSelect(data) {
return request({
method: 'POST',
url: `/api/entitiesDataCount/getSanctionProcess`,
data,
})
}
// 实体清单-深度挖掘-产业链列表信息
/**
* @param {Object} params
* @header token
*/
export function getDeepMiningIndustry(params) {
return request({
method: 'GET',
url: `/api/chain/getChainInfo`,
params,
})
}
// 实体清单-深度挖掘-产业链鱼骨图信息
/**
* @param {Object} params
* @param {number} params.chainId - 产业链ID
* @param {string} [params.date] - 日期
* @header token
*/
export function getDeepMiningIndustryFishbone(params) {
return request({
method: 'GET',
url: `/api/chain/getChainFishbone`,
params,
})
}
// 实体清单-深度挖掘-产业链中国企业实体信息查询
/**
* @param {Object} params
* @param {number} params.chainId - 产业链ID
* @param {string} [params.date] - 日期
* @header token
*/
export function getDeepMiningIndustryEntity(params) {
return request({
method: 'GET',
url: `/api/chain/getChainEntityStat`,
params,
})
}
\ No newline at end of file
......@@ -90,6 +90,7 @@ const headerTitleClasses = computed(() => [
width: 100%;
margin-bottom: 15px;
position: relative;
margin-bottom: 100px;
}
.container-header {
......
......@@ -86,7 +86,24 @@ const exportControlRoutes = [
title: "科研资助"
}
},
// V2.0全部实体清单
{
path: "/exportControl/entityList",
name: "entityList",
component: () => import("@/views/exportControl/v2.0EntityList/index.vue"),
meta: {
title: "全部实体清单"
}
},
// V2.0单条制裁详情
{
path: "/exportControl/singleSanction",
name: "singleSanction",
component: () => import("@/views/exportControl/v2.0SingleSanction/index.vue"),
meta: {
title: "单条制裁详情"
}
},
]
export default exportControlRoutes
\ No newline at end of file
......@@ -2,6 +2,9 @@
import * as echarts from 'echarts'
const setChart = (option, chartId) => {
let chartDom = document.getElementById(chartId);
if (!chartDom) {
return null;
}
chartDom.removeAttribute("_echarts_instance_");
let chart = echarts.init(chartDom);
chart.setOption(option);
......
......@@ -82,7 +82,7 @@
:key="index"
>
<div class="left">
<img :src="item.imageUrl || item.image" alt="" />
<img :src="item.imageUrl || defaultNew" @error="e => e.target.src = defaultNew" alt="" />
</div>
<div class="center">
<div class="title">{{ item.sjbt }}</div>
......@@ -211,6 +211,7 @@ import user5 from "./assets/images/user5.png";
import userIcon from "./assets/icons/user-icon.png";
import userIcon1 from "./assets/icons/user-icon1.png";
import userIcon2 from "./assets/icons/user-icon2.png";
import defaultNew from "../assets/images/default-icon-news.png"
import {
getBillBackground,
......
......@@ -269,7 +269,7 @@
@click="handleClickToNewsDetail(news)"
>
<div class="left">
<img :src="getProxyUrl(news.newsImage) || News1" alt="" referrerpolicy="no-referrer" @error="e => e.target.src = News1" />
<img :src="getProxyUrl(news.newsImage) || defaultNew" alt="" referrerpolicy="no-referrer" @error="e => e.target.src = News1" />
</div>
<div class="right">
<div class="right-top">
......@@ -316,12 +316,12 @@
</div>
<div class="box5-header-title">{{ "涉华法案数量" }}</div>
</div>
<div class="box5-header-right">
<!-- <div class="box5-header-right">
<div class="header-right-icon">
<img src="./assets/images/tips-icon.png" alt="" />
</div>
<div class="header-right-text">{{ "数据来源:美国国会官方网站" }}</div>
</div>
</div> -->
</div>
<div class="box5-select">
<el-select
......@@ -352,12 +352,12 @@
<img src="./assets/images/box6-header-icon.png" alt="" />
</div>
<div class="header-title">{{ "关键条款" }}</div>
<div class="box6-header-right">
<!-- <div class="box6-header-right">
<div class="header-right-icon">
<img src="./assets/images/tips-icon.png" alt="" />
</div>
<div class="header-right-text">{{ "数据来源:美国国会官方网站" }}</div>
</div>
</div> -->
</div>
<div class="box6-main" id="wordCloudChart"></div>
</div>
......@@ -670,10 +670,12 @@
<div class="item-left">{{ "最新动议:" }}</div>
<div class="item-right">{{ item.zxdy }}</div>
</div>
<!-- <div class="item">
<div class="item">
<div class="item-left">{{ "法案进展:" }}</div>
<div class="item-right2"></div>
</div> -->
<div class="item-right2">
<div class="tag" v-for="(val, idx) in [...item.progress].reverse()" :key="idx" :style="{ zIndex: item.progress.length - idx }">{{ val }}</div>
</div>
</div>
</div>
</div>
<div class="right-footer">
......@@ -749,6 +751,7 @@ 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 News1 from "./assets/images/news1.png";
import News2 from "./assets/images/news2.png";
import News3 from "./assets/images/news3.png";
......@@ -3415,6 +3418,73 @@ onUnmounted(() => {});
font-weight: 400;
}
}
.item-right2 {
margin-left: 10px;
display: flex;
align-items: center;
.tag {
height: 24px;
line-height: 22px;
padding: 0 10px 0 30px;
background: rgba(255, 255, 255, 1);
color: rgb(95, 101, 108);
border-top: 1px solid rgb(234, 236, 238);
border-bottom: 1px solid rgb(234, 236, 238);
position: relative;
margin-left: -10px;
font-family: "Microsoft YaHei";
font-size: 14px;
font-weight: 400;
&::after {
content: '';
position: absolute;
top: 50%;
right: -8.485px;
width: 16.97px;
height: 16.97px;
background: inherit;
border-top: 1px solid rgb(234, 236, 238);
border-right: 1px solid rgb(234, 236, 238);
transform: translateY(-50%) rotate(45deg);
z-index: 1;
box-shadow: 2px -2px 2px rgba(0,0,0,0.05);
box-sizing: border-box;
}
&:first-child {
margin-left: 0;
padding-left: 10px;
border-left: 1px solid rgb(234, 236, 238);
border-radius: 4px 0 0 4px;
}
&:last-child {
background: rgb(59, 65, 75);
color: rgba(255, 255, 255, 1);
border-color: rgb(59, 65, 75);
padding-right: 10px;
border-radius: 0;
border-right: none;
&::after {
display: block;
border-color: rgb(59, 65, 75);
box-shadow: none;
}
}
&:first-child:last-child {
margin-left: 0;
padding: 0 10px;
border-radius: 4px 0 0 4px;
background: rgb(59, 65, 75);
color: rgba(255, 255, 255, 1);
border: 1px solid rgb(59, 65, 75);
border-right: none;
}
}
}
}
}
}
......
......@@ -62,7 +62,7 @@
</div>
<div class="text">{{ "分析报告" }}</div>
</div>
<div class="btn4">
<!-- <div class="btn4">
<div class="icon">
<img src="./assets/icons/btn-icon4.png" alt="" />
</div>
......@@ -70,7 +70,7 @@
<div class="icon1">
<img src="./assets/icons/btn-icon5.png" alt="" />
</div>
</div>
</div> -->
</div>
</div>
</div>
......
<template>
<el-tooltip
effect="dark"
:content="content"
popper-class="common-prompt-popper"
placement="top"
:show-after="500"
>
<div class="text-ellipsis">
<slot>{{ content }}</slot>
</div>
</el-tooltip>
</template>
<script setup>
defineProps({
content: {
type: String,
default: ""
}
});
</script>
<style scoped>
.text-ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
cursor: pointer;
}
</style>
<style>
.common-prompt-popper.el-popper {
padding: 8px 16px !important;
border-radius: 10px !important;
background-color: rgb(59, 65, 75) !important;
font-size: 16px !important;
font-weight: 400 !important;
font-family: "Microsoft YaHei" !important;
line-height: 30px !important;
color: #fff !important;
border: none !important;
}
.common-prompt-popper.el-popper .el-popper__arrow::before {
background-color: rgb(59, 65, 75) !important;
border-color: rgb(59, 65, 75) !important;
}
</style>
......@@ -87,7 +87,15 @@
>
<div class="node-content" xmlns="http://www.w3.org/1999/xhtml">
<div class="date">{{ node.formattedDate }}</div>
<div class="title">{{ node.actionTitle }}</div>
<el-tooltip
effect="dark"
:content="node.actionTitle"
popper-class="common-prompt-popper"
placement="top"
:show-after="500"
>
<div class="title">{{ node.actionTitle }}</div>
</el-tooltip>
<div class="votes" v-if="node.voteString">{{ node.voteString }}</div>
</div>
</foreignObject>
......@@ -340,3 +348,23 @@ export default {
}
}
</style>
<style>
.common-prompt-popper.el-popper {
padding: 8px 16px !important;
border-radius: 10px !important;
background-color: rgb(59, 65, 75) !important;
font-size: 16px !important;
font-weight: 400 !important;
font-family: "Microsoft YaHei" !important;
line-height: 30px !important;
color: #fff !important;
border: none !important;
max-width: 600px;
}
.common-prompt-popper.el-popper .el-popper__arrow::before {
background-color: rgb(59, 65, 75) !important;
border-color: rgb(59, 65, 75) !important;
}
</style>
\ No newline at end of file
......@@ -21,12 +21,12 @@
<div class="box1-right">
<div class="box1-right-item">
<div class="item-left">提案人:</div>
<div class="item-right">{{basicInfo.tarName}}</div>
<div class="item-right">{{ basicInfo.tarName }}</div>
</div>
<div class="box1-right-item">
<div class="item-left">提出时间:</div>
<div class="item-right">{{basicInfo.introductionDate}}</div>
<div class="item-right">{{ basicInfo.introductionDate }}</div>
</div>
<div class="box1-right-item">
<div class="item-left">相关领域:</div>
......@@ -44,13 +44,14 @@
<div class="box1-right-item">
<div class="item-left">委员会报告:</div>
<div class="item-right2" v-if="basicInfo.reportList">
<div class="right2-item" v-for="item,index in basicInfo.reportList" :key="index">{{ item }}</div>
<div class="right2-item" v-for="(item, index) in basicInfo.reportList" :key="index">
{{ item }}
</div>
</div>
</div>
<div class="box1-right-item">
<div class="item-left">表决记录:</div>
<div class="item-right3">{{`全程共进行${basicInfo.votetotal}次唱名表决`}}</div>
<div class="item-right3">{{ `全程共进行${basicInfo.votetotal}次唱名表决` }}</div>
</div>
<div class="box1-right-item">
<div class="item-left">最近状态:</div>
......@@ -59,18 +60,17 @@
<div class="box1-right-item">
<div class="item-left">立案流程:</div>
<div class="item-right4">
<div class="step" v-for="(item, index) in basicInfo.stageList" :key="index">
<div class="step-box" v-if="!item.active">
{{ item }}
<div class="right-arrow">
<img src="./assets/icons/arrow-right.png" alt="" />
</div>
</div>
<div class="step-box-active" v-else>
<div
class="step"
v-for="(item, index) in basicInfo.stageList ? [...basicInfo.stageList].reverse() : []"
:key="index"
:style="{ zIndex: (basicInfo.stageList?.length || 0) - index }"
>
<div
class="step-box"
:class="{ 'step-box-active': index === (basicInfo.stageList?.length || 0) - 1 }"
>
{{ item }}
<div class="right-arrow">
<img src="./assets/icons/arrow-right.png" alt="" />
</div>
</div>
</div>
</div>
......@@ -143,14 +143,14 @@
<div class="box-header">
<div class="header-left"></div>
<div class="title">提出人</div>
<div class="header-right">
<div class="icon">
<img src="@/assets/icons/box-header-icon2.png" alt="" />
</div>
<div class="icon">
<img src="@/assets/icons/box-header-icon3.png" alt="" />
</div>
<div class="header-right">
<div class="icon">
<img src="@/assets/icons/box-header-icon2.png" alt="" />
</div>
<div class="icon">
<img src="@/assets/icons/box-header-icon3.png" alt="" />
</div>
</div>
</div>
<div class="introduction-wrap-right-main">
<div class="right-main-box1">
......@@ -177,7 +177,7 @@
</div> -->
<div class="info-box">
<div class="info-left">
<img src="./assets/images/usr1.png" alt="" />
<img :src="defaultAvatar" alt="" />
<div class="usr-icon1">
<img src="./assets/images/usr-icon1.png" alt="" />
</div>
......@@ -372,6 +372,7 @@ import { onMounted, ref } from "vue";
import WordCloudMap from "./WordCloudMap.vue";
import STimeline from "./STimeline.vue";
import { getBillInfo, getBillPerson, getBillEvent, getBillDyqk } from "@/api/bill";
import defaultAvatar from "../assets/images/default-icon1.png";
const box2BtnActive = ref(1);
const handleClcikBox2Btn = index => {
......@@ -535,7 +536,7 @@ const handleClickMore2 = () => {
// 获取基本信息
const basicInfo = ref({})
const basicInfo = ref({});
const handleGetBasicInfo = async () => {
const params = {
......@@ -544,8 +545,10 @@ const handleGetBasicInfo = async () => {
try {
const res = await getBillInfo(params);
console.log("基本信息", res);
basicInfo.value = res.data
basicInfo.value.stageList.reverse()
basicInfo.value = res.data;
// if (basicInfo.value.stageList) {
// basicInfo.value.stageList.reverse();
// }
} catch (error) {
console.error(error);
}
......@@ -683,17 +686,17 @@ onMounted(() => {
position: absolute;
top: 14px;
right: 12px;
display: flex;
justify-content: flex-end;
display: flex;
justify-content: flex-end;
gap: 4px;
.icon{
width: 28px;
height: 28px;
img{
width: 100%;
height: 100%;
}
}
.icon {
width: 28px;
height: 28px;
img {
width: 100%;
height: 100%;
}
}
}
}
.introduction-wrap-left {
......@@ -794,88 +797,85 @@ onMounted(() => {
text-align: left;
}
.item-right4 {
// width: 500px;
margin-top: -4px;
height: 28px;
display: flex;
padding-left: -10px;
border: 2px solid #5f656c;
border-right: none;
.step {
background: rgb(241, 241, 242);
height: 24px;
line-height: 24px;
// width: 98px;
height: 28px;
line-height: 26px;
font-size: 14px;
text-align: center;
position: relative;
background: transparent;
.step-box {
padding: 4px 10px;
color: #333;
padding: 0 15px 0 30px;
color: rgb(59, 65, 75);
position: relative;
font-size: 14px;
font-weight: 400;
font-family: "Microsoft YaHei";
line-height: 14px;
margin-left: 10px;
.right-arrow {
margin-left: -10px;
background: rgba(243, 243, 244, 1);
border-top: 1px solid rgb(59, 65, 75);
border-bottom: 1px solid rgb(59, 65, 75);
border-right: none;
height: 100%;
box-sizing: border-box;
&::after {
content: "";
position: absolute;
right: -21px;
top: -2px;
z-index: 99;
width: 30px;
height: 28px;
img {
width: 100%;
height: 100%;
}
top: 50%;
right: -9.9px;
width: 19.8px;
height: 19.8px;
background: inherit;
border-top: 1px solid rgb(59, 65, 75);
border-right: 1px solid rgb(59, 65, 75);
transform: translateY(-50%) rotate(45deg);
z-index: 1;
box-sizing: border-box;
}
}
&:first-child {
.step-box {
margin-left: 0;
padding-left: 10px;
border-left: 1px solid rgb(59, 65, 75);
}
}
.step-box-active {
padding: 4 10px;
color: #fff;
background: #ce4f51;
position: relative;
z-index: 100;
color: rgba(255, 255, 255, 1);
background: rgb(206, 79, 81);
border-color: rgba(52, 24, 24, 1);
&::after {
content: ""; /* 必须有内容才能使用伪元素 */
position: absolute; /* 绝对定位 */
top: 9px; /* 在父元素下方 */
right: -11px; /* 左对齐 */
width: 0; /* 设置宽度为0 */
height: 0; /* 设置高度为0 */
border-left: 20px solid transparent; /* 左边框设置为透明 */
border-right: 20px solid #ce4f51; /* 右边框设置为蓝色,形成三角形的一边 */
border-top: 20px solid transparent; /* 上边框设置为与父元素相同的颜色,形成三角形底部与父元素相连 */
transform: rotate(-45deg);
z-index: 99;
border-color: rgba(52, 24, 24, 1);
}
.right-arrow {
position: absolute;
right: -22px;
top: -4px;
z-index: 99;
width: 32px;
height: 32px;
img {
width: 100%;
height: 100%;
}
&:last-child {
.step-box {
padding-right: 15px;
border-right: 1px solid rgb(59, 65, 75);
&::after {
display: none;
}
}
}
// .step-box {
// z-index: 99;
// width: 96px;
// background: url("./assets/images/step-box.png") 100% 100%;
// color: #333;
// }
// .step-box-active {
// width: 90px;
// background: url("./assets/images/step-box-active.png") 100%
// 100%;
// color: #fff;
// }
.step-box-active {
border-right: none;
&::after {
display: block;
right: -9.9px;
}
}
}
}
}
}
......@@ -1071,13 +1071,17 @@ onMounted(() => {
margin-top: 25px;
display: flex;
.info-left {
img {
width: 128px;
height: 128px;
}
position: relative;
.usr-icon1 {
position: absolute;
bottom: 24px;
left: 20px;
width: 32px;
height: 32px;
bottom: 0px;
left: 18px;
width: 48px;
height: 48px;
border-radius: 16px;
background: rgba(255, 255, 255, 0.9);
box-sizing: border-box;
......@@ -1089,10 +1093,10 @@ onMounted(() => {
}
.usr-icon2 {
position: absolute;
bottom: 24px;
right: 20px;
width: 32px;
height: 32px;
bottom: 0px;
right: 18px;
width: 48px;
height: 48px;
border-radius: 16px;
background: rgba(255, 255, 255, 0.9);
box-sizing: border-box;
......@@ -1439,4 +1443,4 @@ onMounted(() => {
}
}
}
</style>
\ No newline at end of file
</style>
......@@ -36,14 +36,30 @@
<div class="left-main-item" v-for="(term, index) in mainTermsList" :key="index">
<div class="id">{{ (currentPage - 1) * pageSize + index + 1 }}</div>
<div class="info">
<div class="title">
<span class="title-active">{{ term.tkxh }}条.</span>
{{ term.fynr }}
</div>
<div class="content">
<span class="content-active">Sec.{{ term.tkxh }}</span>
{{ term.ywnr }}
</div>
<el-tooltip
effect="dark"
:content="`第${term.tkxh}条. ${term.fynr}`"
popper-class="bill-template-popper"
placement="top"
:show-after="500"
>
<div class="title">
<span class="title-active">{{ term.tkxh }}条.</span>
{{ term.fynr }}
</div>
</el-tooltip>
<el-tooltip
effect="dark"
:content="`Sec.${term.tkxh} ${term.ywnr}`"
popper-class="bill-template-popper"
placement="top"
:show-after="500"
>
<div class="content">
<span class="content-active">Sec.{{ term.tkxh }}</span>
{{ term.ywnr }}
</div>
</el-tooltip>
</div>
<div class="tags-box">
<div
......@@ -62,9 +78,9 @@
{{ val }}
</div>
</div>
<div class="open">
<!-- <div class="open">
<img src="./assets/icons/open-icon.png" alt="" />
</div>
</div> -->
</div>
</div>
<div class="left-footer">
......@@ -842,3 +858,23 @@ onMounted(async () => {
font-size: 16px !important;
}
</style>
<style>
.bill-template-popper.el-popper {
padding: 8px 16px !important;
border-radius: 10px !important;
background-color: rgb(59, 65, 75) !important;
font-size: 16px !important;
font-weight: 400 !important;
font-family: "Microsoft YaHei" !important;
line-height: 30px !important;
color: #fff !important;
border: none !important;
max-width: 600px;
}
.bill-template-popper.el-popper .el-popper__arrow::before {
background-color: rgb(59, 65, 75) !important;
border-color: rgb(59, 65, 75) !important;
}
</style>
<template>
<el-tooltip
effect="dark"
:content="content"
popper-class="common-prompt-popper"
placement="top"
:show-after="500"
>
<div class="text-ellipsis">
<slot>{{ content }}</slot>
</div>
</el-tooltip>
</template>
<script setup>
defineProps({
content: {
type: String,
default: ""
}
});
</script>
<style scoped>
.text-ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
cursor: pointer;
}
</style>
<style>
.common-prompt-popper.el-popper {
padding: 8px 16px !important;
border-radius: 10px !important;
background-color: rgb(59, 65, 75) !important;
font-size: 16px !important;
font-weight: 400 !important;
font-family: "Microsoft YaHei" !important;
line-height: 30px !important;
color: #fff !important;
border: none !important;
}
.common-prompt-popper.el-popper .el-popper__arrow::before {
background-color: rgb(59, 65, 75) !important;
border-color: rgb(59, 65, 75) !important;
}
</style>
......@@ -13,6 +13,7 @@
</template>
<script setup>
defineProps({
title: {
type: String,
......
......@@ -12,13 +12,22 @@
<span class="news-source">{{ item.source }}</span>
</div>
</div>
<div class="news-description">{{ item.description }}</div>
<el-tooltip
effect="dark"
:content="item.description"
popper-class="common-prompt-popper"
placement="top"
:show-after="500"
>
<div class="news-description">{{ item.description }}</div>
</el-tooltip>
</div>
</div>
</div>
</template>
<script setup>
import CommonPrompt from "../commonPrompt/index.vue";
import newsImg from "@/assets/images/news-img.png";
const props = defineProps({
listData: {
......@@ -101,6 +110,9 @@ const handleItemClick = item => {
line-height: 24px;
flex: 1;
margin-right: 12px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.news-meta {
......
......@@ -104,7 +104,7 @@ export function getPieOption1(data, title) {
maxSurfaceAngle: 80
},
labelLayout: function (params) {
console.log("labelLayoutparams", params);
// console.log("labelLayoutparams", params);
const isLeft = params.labelRect.x < 556 / 2;
const points = params.labelLinePoints;
// Update the end point.
......@@ -369,7 +369,7 @@ export function getMapOption() {
});
}
}
console.log(res);
// console.log(res);
return res;
}
......@@ -442,6 +442,13 @@ export function getMapOption() {
return option;
}
export const getBarChart = (nameList, valueList, color = ["rgba(255, 159, 22, 1)", "rgba(255, 159, 22, 0)"], name) => {
let maxVal = Math.max(...(valueList || [0]));
if (maxVal === 0) maxVal = 100;
else maxVal = maxVal * 1.2;
let interval = Math.ceil(maxVal / 8);
if (interval > 5) interval = Math.ceil(interval / 10) * 10;
maxVal = interval * 8;
const option = {
tooltip: {
trigger: "axis",
......@@ -484,6 +491,8 @@ export const getBarChart = (nameList, valueList, color = ["rgba(255, 159, 22, 1)
},
yAxis: {
type: "value",
max: maxVal,
interval: interval,
axisLine: {
lineStyle: {
type: "dashed"
......@@ -582,6 +591,8 @@ export const getLineChart = (object, isPercent) => {
},
yAxis: {
type: "value",
max: maxVal,
interval: interval,
axisLine: {
lineStyle: {
type: "dashed"
......@@ -722,7 +733,7 @@ export const getHorizontalBarChart2 = (nameList, valueList, isPer) => {
["rgba(255, 197, 61, 1)", "rgba(255, 197, 61, 0)"],
["rgba(179, 127, 235, 1)", "rgba(179, 127, 235, 0)"]
];
console.log(colorList);
// console.log(colorList);
const option = {
tooltip: {},
grid: {
......@@ -778,7 +789,7 @@ export const getHorizontalBarChart2 = (nameList, valueList, isPer) => {
barWidth: 8,
itemStyle: {
color: function (params) {
console.log("params", params);
// console.log("params", params);
return new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{
offset: 0,
......@@ -798,6 +809,17 @@ export const getHorizontalBarChart2 = (nameList, valueList, isPer) => {
return option;
};
export const getMultipleLineChart = obj => {
let allValues = [];
obj.data.forEach(item => {
if (item.value) allValues.push(...item.value);
});
let maxVal = Math.max(...(allValues.length > 0 ? allValues : [0]));
if (maxVal === 0) maxVal = 100;
else maxVal = maxVal * 1.2;
let interval = Math.ceil(maxVal / 8);
if (interval > 5) interval = Math.ceil(interval / 10) * 10;
maxVal = interval * 8;
const color = ["rgba(19, 168, 168, 1)", "rgba(146, 84, 222, 1)", "rgba(250, 140, 22, 1)", "rgba(206, 79, 81, 1)"];
const option = {
title: {
......@@ -859,6 +881,8 @@ export const getMultipleLineChart = obj => {
},
yAxis: {
type: "value",
max: maxVal,
interval: interval,
axisLine: {
lineStyle: {
type: "dashed"
......@@ -904,22 +928,23 @@ export const getMultipleLineChart = obj => {
export const getMultipleBarChart_m = object => {
const list = _.chain(object.data).filter("year").orderBy("year", "asc").value();
const colors = [
["rgba(22, 119, 255, 1)", "rgba(22, 119, 255, 0)"],
["rgba(45, 123, 248, 1)", "rgba(45, 123, 248, 0)"],
["rgba(206, 79, 81, 1)", "rgba(206, 79, 81, 0)"],
["rgba(255, 197, 61, 1)", "rgba(255, 197, 61, 0)"],
["rgba(255, 204, 199, 1)", "rgba(255, 204, 199, 0)"],
["rgba(179, 127, 235, 1)", "rgba(179, 127, 235, 0)"],
["rgba(127, 218, 235, 1)", "rgba(127, 214, 235, 0)"]
["rgba(255, 182, 193, 1)", "rgba(255, 182, 193, 0)"],
["rgba(159, 122, 234, 1)", "rgba(159, 122, 234, 0)"],
["rgba(90, 200, 220, 1)", "rgba(90, 200, 220, 0)"]
];
const names = _.map(list, "year");
const datas = _.chain(object.domains)
.splice(0, 6)
.map((name, index) => {
console.log(_.map(list, name));
// console.log(_.map(list, name));
return {
name,
data: _.map(list, `domainNum.${name}`),
type: "bar",
color: colors[index % colors.length][0],
barWidth: 12,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
......@@ -932,7 +957,19 @@ export const getMultipleBarChart_m = object => {
};
})
.value();
console.log("names", names);
// console.log("names", names);
let allValues = [];
datas.forEach(series => {
if (series.data) allValues.push(...series.data);
});
let maxVal = Math.max(...(allValues.length > 0 ? allValues : [0]));
// if (maxVal === 0) maxVal = 100;
// else maxVal = maxVal * 1.2;
// let interval = Math.ceil(maxVal / 5);
// if (interval > 5) interval = Math.ceil(interval / 10) * 10;
// maxVal = interval * 5;
const option = {
tooltip: {
trigger: "axis",
......@@ -941,7 +978,11 @@ export const getMultipleBarChart_m = object => {
}
},
grid: {
top: 50
top: 50,
left: "1%",
right: "1%",
bottom: "3%",
containLabel: true
},
legend: {
// type: "scroll",
......@@ -954,7 +995,9 @@ export const getMultipleBarChart_m = object => {
data: names
},
yAxis: {
type: "value"
type: "value",
splitNumber: 5,
alignTicks: false
},
series: datas
};
......
import * as echarts from 'echarts'
const getMultiLineChart = (dataX, dataY1, dataY2) => {
// let maxVal = Math.max(...(dataY1 || [0]), ...(dataY2 || [0]))
// if (maxVal === 0) maxVal = 100
// else maxVal = maxVal * 1.2
// let interval = Math.ceil(maxVal / 5)
// if (interval > 5) interval = Math.ceil(interval / 10) * 10
// maxVal = interval * 5
return {
tooltip: {
trigger: 'axis',
......@@ -32,7 +38,9 @@ const getMultiLineChart = (dataX, dataY1, dataY2) => {
],
yAxis: [
{
type: 'value'
type: 'value',
splitNumber: 5,
alignTicks: false
}
],
series: [
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论