Skip to content

R
risk-monitor
提交 69d1fe4b authored 作者: coderBryanFu's avatar coderBryanFu
浏览文件
操作

refactor: 移除base外的同名组件RiskSignal和NewsList

上级 67c1079a
隐藏空白字符变更
内嵌 并排
正在显示 包含 366 行增加 和 1888 行删除
src/components/NewsList.vue deleted 100644 → 0
浏览文件 @ 67c1079a
<template>
<div class="news-box">
<div class="box3-header">
<div class="box3-header-left">
<div class="box3-header-icon">
<img src="@/assets/images/box3-header-icon.png" alt="" />
</div>
<div class="box3-header-title">{{ "新闻资讯" }}</div>
<div class="more" @click="handleToMoreNews">{{ "更多 +" }}</div>
</div>
</div>
<div class="box3-main">
<div class="box3-item" v-for="(news, index) in normalizedList" :key="index"
@click="handleClickToNewsDetail(news)">
<div class="left">
<img :src="getProxyUrl(news.newsImage) || defaultImg" alt="" referrerpolicy="no-referrer"
@error="e => (e.target.src = errImg || News1)" />
</div>
<div class="right">
<div class="right-top">
<div class="title">{{ news.newsTitle || news.title }}</div>
<div class="time">
{{ news.newsDate ? news.newsDate.slice(5) : "" }} {{ news.newsOrg ? "-" + news.newsOrg : "" }}
</div>
</div>
<div class="right-footer">{{ news.newsContent || news.description }}</div>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { computed } from "vue";
import router from "@/router/index";
import News1 from "@/assets/images/news1.png"; // 错误图片
import defaultNew from "@/assets/images/default-icon-news.png"; // 默认图片
let { list, newsList, errImg, defaultImg } = defineProps({
list: {
type: Array,
default: () => []
},
// 兼容历史用法：部分页面使用 newsList 作为入参
newsList: {
type: Array,
default: undefined
},
defaultImg: {
type: String,
default: defaultNew
},
errImg: {
type: String,
default: ''
}
});
// 统一对外渲染数据源：优先使用 list，其次兼容 newsList
const normalizedList = computed(() => {
return (Array.isArray(list) && list.length ? list : newsList) || [];
});
// 处理图片代理
const getProxyUrl = url => {
if (!url) return "";
const urlStr = String(url);
// 排除非 http 开头（相对路径）、已经是代理链接、或者是本地链接
if (
!urlStr.startsWith("http") ||
urlStr.includes("images.weserv.nl") ||
urlStr.includes("localhost") ||
urlStr.includes("127.0.0.1")
) {
return url;
}
// 移除协议头 http:// 或 https://
const cleanUrl = urlStr.replace(/^https?:\/\//i, "");
return `https://images.weserv.nl/?url=${encodeURIComponent(cleanUrl)}`;
};
const handleClickToNewsDetail = news => {
const route = router.resolve({
path: "/newsAnalysis",
query: {
newsId: news.newsId ?? news.id
}
});
window.open(route.href, "_blank");
};
// 查看更多新闻资讯
const handleToMoreNews = () => {
const route = router.resolve("/newsBrief");
window.open(route.href, "_blank");
};
</script>
<style lang="scss" scoped>
.news-box {
width: 792px;
height: 450px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(25, 69, 130, 0.2);
background: rgba(255, 255, 255, 1);
.box3-header {
height: 48px;
border-bottom: 1px solid rgba(240, 242, 244, 1);
margin: 0 auto;
display: flex;
justify-content: space-between;
position: relative;
.box3-header-left {
display: flex;
.box3-header-icon {
margin-left: 21px;
margin-top: 16px;
width: 19px;
height: 19px;
img {
width: 100%;
height: 100%;
}
}
.box3-header-title {
margin-top: 11px;
margin-left: 20px;
height: 26px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 700;
line-height: 26px;
}
}
.more {
width: 49px;
height: 24px;
position: absolute;
top: 14px;
right: 27px;
color: rgba(20, 89, 187, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
cursor: pointer;
}
}
.box3-main {
height: 402px;
overflow-y: auto;
overflow-x: hidden;
padding: 6px 0;
.box3-item {
display: flex;
height: 77px;
width: 749px;
margin-left: 21px;
border-bottom: 1px solid rgba(240, 242, 244, 1);
cursor: pointer;
&:hover {
background: var(--color-bg-hover);
}
.left {
width: 72px;
height: 48px;
margin-top: 15px;
img {
width: 100%;
height: 100%;
border-radius: 4px;
}
}
.right {
width: 657px;
margin-left: 20px;
.right-top {
width: 657px;
display: flex;
justify-content: space-between;
&:hover {
text-decoration: underline;
color: var(--color-main-active);
.title {
color: var(--color-main-active);
}
}
.title {
margin-top: 13px;
width: 500px;
height: 24px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 700;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.time {
width: 157px;
text-align: right;
height: 22px;
margin-top: 19px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
line-height: 22px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.right-footer {
width: 657px;
height: 24px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
}
}
</style>
src/components/RiskSignal/RiskSignal copy.vue deleted 100644 → 0
浏览文件 @ 67c1079a
<template>
<div class="box2">
<div class="box2-header">
<div class="icon">
<img src="./image1.png" alt="" />
</div>
<div class="title">
<div class="text">{{ title }}</div>
<div class="num">{{ list.length }}</div>
</div>
</div>
<div class="box2-main" v-infinite-scroll="loadMore" :infinite-scroll-disabled="allLoaded || loading"
:infinite-scroll-distance="10" v-loading="loading">
<div class="box2-main-item" v-for="(item, index) in list" :key="index" @click="handleItemClick(item, index)">
<div :class="{
itemLeftStatus1: item[props.riskLevel] === '特别重大',
itemLeftStatus2: item[props.riskLevel] === '重大风险',
itemLeftStatus3: item[props.riskLevel] === '较大风险',
itemLeftStatus4: item[props.riskLevel] === '一般风险' || !item[props.riskLevel],
itemLeftStatus5: item[props.riskLevel] === '低风险',
}">
{{ item[props.riskLevel] || "暂无数据" }}
</div>
<div class="item-right">
<div class="text"> <span class="text-inner">{{ item[props.name] }}</span></div>
<div class="time">{{ item[props.postDate] }}</div>
</div>
</div>
</div>
<div class="box2-footer" @click="handleMoreClick" v-if="showMore">
<div class="icon">
<img src="./image2.png" alt="" />
</div>
<div class="text">{{ moreText }}</div>
</div>
</div>
</template>
<script setup>
import {ref} from 'vue'
import { ElMessage } from "element-plus";
// 接收父组件传递的参数
const props = defineProps({
// 标题（默认“风险信号”）
title: {
type: String,
default: "风险信号"
},
// 风险信号列表数据
list: {
type: Array,
default: () => []
},
// “查看更多”文本（默认“查看更多”）
moreText: {
type: String,
default: "查看更多"
},
//控制“查看更多”是否显示，默认显示
showMore: {
type: Boolean,
default: true
},
name: {
type: String,
default: "name"
},
postDate: {
type: String,
default: "postDate"
},
riskLevel: {
type: String,
default: "riskLevel"
},
});
// 定义自定义事件，把点击事件传递给父组件
const emit = defineEmits(['item-click', 'more-click']);
// 点击单条风险信号
const handleItemClick = (item, index) => {
emit('item-click', item, index)
};
// 点击“查看更多”
const handleMoreClick = () => {
emit('more-click')
};
const allLoaded = ref(false)
const loading = ref(false)
const currentPage = ref(0)
const pageSize = ref(7)
const loadMore = async () => {
if (allLoaded.value || loading.value) return;
// await fetchListData(true); // 传入 true 表示追加数据
ElMessage.success('追加数据')
}
// 添加初始化函数来获取数据
const fetchListData = async (append = false) => {
console.log("加载状态 =>", loading.value, allLoaded.value);
if (loading.value || allLoaded.value) return;
try {
loading.value = true;
// 调用接口获取数据
const response = await getStrategiesTopN(currentPage.value, pageSize.value, countryName.value);
const apiData = response.data || [];
// 转换数据格式
const newData =
apiData.content?.map(item => ({
...item,
img: item.countryImageUrl, // 使用默认图片或根据需要调整
title: item.titleZh,
content: item.contentZh,
time: formatTime(item.date), // 转换时间格式
tagList: item.domains
? item.domains.slice(0, 2).map(field => ({
name: field,
status: Math.floor(Math.random() * 3) + 1 // 随机分配 1-3 的状态值
}))
: []
})) || [];
if (newData.length > 0) {
if (append) {
// 追加数据
list.value = [...list.value, ...newData];
} else {
// 替换数据
list.value = [...newData];
}
// 检查是否还有更多数据（根据实际 API 响应调整判断逻辑）
if (newData.length < pageSize.value) {
allLoaded.value = true;
} else {
currentPage.value++;
}
} else {
allLoaded.value = true;
}
console.log("获取策略数据成功:", list.value);
} catch (error) {
console.error("获取策略数据失败:", error);
// 错误处理，停止加载状态但不重置数据
if (!append && list.value.length === 0) {
list.value = [];
}
} finally {
loading.value = false;
}
};
</script>
<style scoped lang="scss">
.risk-status-base {
width: 40px;
height: 40px;
border-radius: 20px;
font-size: 12px;
font-weight: 400;
line-height: 14px;
box-sizing: border-box;
padding: 6px 4px;
text-align: center;
}
.itemLeftStatus1 {
color: rgb(206, 79, 81) !important;
background: rgba(255, 241, 240, 1) !important;
@extend .risk-status-base
}
.itemLeftStatus2 {
color: rgba(250, 140, 22, 1) !important;
background: rgba(255, 247, 230, 1) !important;
@extend .risk-status-base
}
.itemLeftStatus3 {
color: rgba(212, 177, 6, 1) !important;
background: rgba(254, 255, 230, 1) !important;
@extend .risk-status-base
}
.itemLeftStatus4 {
color: rgba(82, 196, 26, 1) !important;
background: rgba(246, 255, 237, 1) !important;
@extend .risk-status-base
}
.itemLeftStatus5 {
color: rgba(22, 119, 255, 1) !important;
background: rgba(230, 244, 255, 1) !important;
@extend .risk-status-base
}
.box2 {
width: 520px;
height: 450px;
border-radius: 10px;
position: relative;
background: rgba(255, 255, 255, 1);
padding: 0;
box-shadow: 0 0 20px 0 rgba(25, 69, 130, 0.1);
border: 1px solid rgba(234, 236, 238, 1);
box-sizing: border-box;
overflow: hidden;
.box2-header {
height: 48px;
display: flex;
border-bottom: 1px solid rgba(240, 242, 244, 1);
.icon {
width: 24px;
height: 24px;
margin-left: 18px;
margin-top: 14px;
margin-bottom: 10px;
img {
width: 100%;
height: 100%;
}
}
.title {
display: flex;
width: 148px;
background: rgb(206, 79, 81);
margin-left: 18px;
.text {
margin-left: 16px;
height: 48px;
color: rgba(255, 255, 255, 1);
font-family: 'Source Han Sans CN';
font-size: 20px;
font-weight: 700;
line-height: 48px;
}
.num {
width: 24px;
height: 20px;
line-height: 20px;
text-align: center;
color: rgba(255, 255, 255, 1);
font-family: Microsoft YaHei;
font-size: 12px;
margin-left: 15px;
margin-top: 15px;
border-radius: 100px;
background: rgba(255, 255, 255, 0.3);
}
}
}
.box2-main {
box-sizing: border-box;
padding-left: 23px;
padding-right: 30px;
overflow-y: auto;
width: 520px;
height: calc(100% - 160px);
border-radius: 4px;
.box2-main-item {
width: 463px;
height: 48px;
border-radius: 2px;
position: relative;
display: flex;
align-items: center;
cursor: pointer;
&:hover {
.item-right .text {
color: rgb(5, 95, 194) !important;
font-weight: 700;
}
.item-right .text-inner {
border-bottom-color: rgb(5, 95, 194) !important;
}
}
.item-left {
margin-top: 4px;
margin-left: 0px;
margin-bottom: 4px;
width: 40px;
height: 40px;
border-radius: 20px;
color: rgba(82, 196, 26, 1);
background: rgba(246, 255, 237, 1);
font-family: Microsoft YaHei;
font-size: 12px;
font-weight: 400;
line-height: 14px;
box-sizing: border-box;
padding: 6px 4px;
text-align: center;
flex-shrink: 0;
}
.item-right {
margin-left: 12px;
height: 46px;
display: flex;
align-items: center;
flex: 1;
background: transparent;
padding: 0;
border-bottom: 1px solid #EAECEE;
box-sizing: border-box;
overflow: hidden; // 保证右侧不会溢出
.text {
padding-top: 8px;
padding-bottom: 8px;
flex: 1 1 auto;
min-width: 0;
height: 100%;
background: transparent;
font-family: "Source Han Sans CN";
font-weight: 400;
font-size: 16px;
letter-spacing: 0px;
text-align: left;
color: rgb(59, 65, 75);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
box-sizing: border-box;
flex-shrink: 1;
.text-inner {
border-bottom: 1px solid transparent;
}
}
.time {
flex: 0 0 auto;
margin-left: 12px;
padding-top: 11px;
padding-bottom: 11px;
height: 100%;
flex-shrink: 0;
background: transparent;
font-family: "Source Han Sans CN", sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: 0px;
text-align: right;
box-sizing: border-box;
color: rgb(132, 136, 142);
white-space: nowrap;
}
}
}
}
.box2-footer {
position: absolute;
left: 26px;
right: 20px;
bottom: 20px;
width: 460px;
height: 42px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 6px;
background: var(--color-main-active);
cursor: pointer;
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
margin-left: 8px;
color: rgba(255, 255, 255, 1);
font-family: "Source Han Sans CN";
font-size: 16px;
font-weight: 400;
line-height: 24px;
}
}
}
</style>
\ No newline at end of file
src/components/RiskSignal/RiskSignal.vue deleted 100644 → 0
浏览文件 @ 67c1079a
<template>
<div class="box2">
<div class="box2-header">
<div class="icon">
<img src="./image1.png" alt="" />
</div>
<div class="title">
<div class="text">{{ title }}</div>
<div class="num">{{ list.length }}</div>
</div>
</div>
<div class="box2-main" v-infinite-scroll="loadMore" :infinite-scroll-disabled="allLoaded || loading"
:infinite-scroll-distance="10" v-loading="loading">
<div class="box2-main-item" v-for="(item, index) in list" :key="index" @click="handleItemClick(item, index)">
<div :class="{
itemLeftStatus1: item[props.riskLevel] === '特别重大',
itemLeftStatus2: item[props.riskLevel] === '重大风险',
itemLeftStatus3: item[props.riskLevel] === '较大风险' || item[props.riskLevel] === '中等风险',
itemLeftStatus4: item[props.riskLevel] === '一般风险' || !item[props.riskLevel],
itemLeftStatus5: item[props.riskLevel] === '低风险',
}">
{{ item[props.riskLevel] || "暂无数据" }}
</div>
<div class="item-right">
<div class="text"> <span class="text-inner">{{ item[props.name] }}</span></div>
<div class="time">{{ item[props.postDate] }}</div>
</div>
</div>
</div>
<div class="box2-footer" @click="handleMoreClick" v-if="showMore">
<div class="icon">
<img src="./image2.png" alt="" />
</div>
<div class="text">{{ moreText }}</div>
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
import { ElMessage } from "element-plus";
// 接收父组件传递的参数
const props = defineProps({
// 标题（默认“风险信号”）
title: {
type: String,
default: "风险信号"
},
// 风险信号列表数据
list: {
type: Array,
default: () => []
},
// “查看更多”文本（默认“查看更多”）
moreText: {
type: String,
default: "查看更多"
},
//控制“查看更多”是否显示，默认显示
showMore: {
type: Boolean,
default: true
},
name: {
type: String,
default: "name"
},
postDate: {
type: String,
default: "postDate"
},
riskLevel: {
type: String,
default: "riskLevel"
},
allLoaded: {
type: Boolean,
default: false
},
loading: {
type: Boolean,
default: false
},
});
// 定义自定义事件，把点击事件传递给父组件
const emit = defineEmits(['item-click', 'more-click', 'loadMore']);
// 点击单条风险信号
const handleItemClick = (item, index) => {
emit('item-click', item, index)
};
// 点击“查看更多”
const handleMoreClick = () => {
emit('more-click')
};
// const allLoaded = ref(false)
// const loading = ref(false)
// const currentPage = ref(0)
// const pageSize = ref(7)
// const loadMore = async () => {
// if (allLoaded.value || loading.value) return;
// // await fetchListData(true); // 传入 true 表示追加数据
// ElMessage.success('追加数据')
// }
// // 添加初始化函数来获取数据
// const fetchListData = async (append = false) => {
// console.log("加载状态 =>", loading.value, allLoaded.value);
// if (loading.value || allLoaded.value) return;
// try {
// loading.value = true;
// // 调用接口获取数据
// const response = await getStrategiesTopN(currentPage.value, pageSize.value, countryName.value);
// const apiData = response.data || [];
// // 转换数据格式
// const newData =
// apiData.content?.map(item => ({
// ...item,
// img: item.countryImageUrl, // 使用默认图片或根据需要调整
// title: item.titleZh,
// content: item.contentZh,
// time: formatTime(item.date), // 转换时间格式
// tagList: item.domains
// ? item.domains.slice(0, 2).map(field => ({
// name: field,
// status: Math.floor(Math.random() * 3) + 1 // 随机分配 1-3 的状态值
// }))
// : []
// })) || [];
// if (newData.length > 0) {
// if (append) {
// // 追加数据
// list.value = [...list.value, ...newData];
// } else {
// // 替换数据
// list.value = [...newData];
// }
// // 检查是否还有更多数据（根据实际 API 响应调整判断逻辑）
// if (newData.length < pageSize.value) {
// allLoaded.value = true;
// } else {
// currentPage.value++;
// }
// } else {
// allLoaded.value = true;
// }
// console.log("获取策略数据成功:", list.value);
// } catch (error) {
// console.error("获取策略数据失败:", error);
// // 错误处理，停止加载状态但不重置数据
// if (!append && list.value.length === 0) {
// list.value = [];
// }
// } finally {
// loading.value = false;
// }
// };
const loadMore = () => {
emit('loadMore')
}
</script>
<style scoped lang="scss">
.risk-status-base {
width: 40px;
height: 40px;
border-radius: 20px;
font-size: 12px;
font-weight: 400;
line-height: 14px;
box-sizing: border-box;
padding: 6px 4px;
text-align: center;
}
.itemLeftStatus1 {
color: rgb(206, 79, 81) !important;
background: rgba(255, 241, 240, 1) !important;
@extend .risk-status-base
}
.itemLeftStatus2 {
color: rgba(250, 140, 22, 1) !important;
background: rgba(255, 247, 230, 1) !important;
@extend .risk-status-base
}
.itemLeftStatus3 {
color: rgba(212, 177, 6, 1) !important;
background: rgba(254, 255, 230, 1) !important;
@extend .risk-status-base
}
.itemLeftStatus4 {
color: rgba(82, 196, 26, 1) !important;
background: rgba(246, 255, 237, 1) !important;
@extend .risk-status-base
}
.itemLeftStatus5 {
color: rgba(22, 119, 255, 1) !important;
background: rgba(230, 244, 255, 1) !important;
@extend .risk-status-base
}
.box2 {
width: 520px;
height: 450px;
border-radius: 10px;
position: relative;
background: rgba(255, 255, 255, 1);
padding: 0;
box-shadow: 0 0 20px 0 rgba(25, 69, 130, 0.1);
border: 1px solid rgba(234, 236, 238, 1);
box-sizing: border-box;
overflow: hidden;
.box2-header {
height: 48px;
display: flex;
border-bottom: 1px solid rgba(240, 242, 244, 1);
.icon {
width: 24px;
height: 24px;
margin-left: 18px;
margin-top: 14px;
margin-bottom: 10px;
img {
width: 100%;
height: 100%;
}
}
.title {
display: flex;
width: 148px;
background: rgb(206, 79, 81);
margin-left: 18px;
.text {
margin-left: 16px;
height: 48px;
color: rgba(255, 255, 255, 1);
font-family: 'Source Han Sans CN';
font-size: 20px;
font-weight: 700;
line-height: 48px;
}
.num {
width: 24px;
height: 20px;
line-height: 20px;
text-align: center;
color: rgba(255, 255, 255, 1);
font-family: Microsoft YaHei;
font-size: 12px;
margin-left: 15px;
margin-top: 15px;
border-radius: 100px;
background: rgba(255, 255, 255, 0.3);
}
}
}
.box2-main {
box-sizing: border-box;
padding-left: 23px;
padding-right: 30px;
overflow-y: auto;
width: 520px;
height: calc(100% - 160px);
border-radius: 4px;
.box2-main-item {
width: 463px;
height: 48px;
border-radius: 2px;
position: relative;
display: flex;
align-items: center;
cursor: pointer;
&:hover {
.item-right .text {
color: rgb(5, 95, 194) !important;
font-weight: 700;
}
.item-right .text-inner {
border-bottom-color: rgb(5, 95, 194) !important;
}
}
.item-left {
margin-top: 4px;
margin-left: 0px;
margin-bottom: 4px;
width: 40px;
height: 40px;
border-radius: 20px;
color: rgba(82, 196, 26, 1);
background: rgba(246, 255, 237, 1);
font-family: Microsoft YaHei;
font-size: 12px;
font-weight: 400;
line-height: 14px;
box-sizing: border-box;
padding: 6px 4px;
text-align: center;
flex-shrink: 0;
}
.item-right {
margin-left: 12px;
height: 46px;
display: flex;
align-items: center;
flex: 1;
background: transparent;
padding: 0;
border-bottom: 1px solid #EAECEE;
box-sizing: border-box;
overflow: hidden; // 保证右侧不会溢出
.text {
padding-top: 8px;
padding-bottom: 8px;
flex: 1 1 auto;
min-width: 0;
height: 100%;
background: transparent;
font-family: "Source Han Sans CN";
font-weight: 400;
font-size: 16px;
letter-spacing: 0px;
text-align: left;
color: rgb(59, 65, 75);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
box-sizing: border-box;
flex-shrink: 1;
.text-inner {
border-bottom: 1px solid transparent;
}
}
.time {
flex: 0 0 auto;
margin-left: 12px;
padding-top: 11px;
padding-bottom: 11px;
height: 100%;
flex-shrink: 0;
background: transparent;
font-family: "Source Han Sans CN", sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: 0px;
text-align: right;
box-sizing: border-box;
color: rgb(132, 136, 142);
white-space: nowrap;
}
}
}
}
.box2-footer {
position: absolute;
left: 26px;
right: 20px;
bottom: 20px;
width: 460px;
height: 42px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 6px;
background: var(--color-main-active);
cursor: pointer;
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
margin-left: 8px;
color: rgba(255, 255, 255, 1);
font-family: "Source Han Sans CN";
font-size: 16px;
font-weight: 400;
line-height: 24px;
}
}
}
</style>
\ No newline at end of file
src/components/base/TipTab/index.vue 0 → 100644
浏览文件 @ 69d1fe4b
<template>
<div class="tip-wrapper">
<div class="icon">
<img src="./tip-icon.svg" alt="">
</div>
<div class="text text-tip-2 text-primary-50-clor">{{ `数据来源：${dataSource},数据时间：${dataTime}` }}</div>
</div>
</template>
<script setup>
const props = defineProps({
dataSource: {
type: String,
default: '美国国会官网'
},
dataTime: {
type: String,
default: '2023.1至2025.12'
},
})
</script>
<style lang="scss" scoped>
.tip-wrapper{
width: 100%;
display: flex;
gap: 8px;
justify-content: center;
align-items: center;
height: 22px;
.icon{
width: 16px;
height: 16px;
img{
width: 100%;
height: 100%;
}
}
}
</style>
\ No newline at end of file
src/components/base/TipTab/tip-icon.svg 0 → 100644
浏览文件 @ 69d1fe4b
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none" customFrame="#000000">
<rect id="容器 704" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
<circle id="椭圆 96" cx="8" cy="8" r="7" fill="rgb(230,231,232)" />
<circle id="椭圆 97" cx="8" cy="4" r="1" fill="rgb(132,136,142)" />
<path id="矩形 241" d="M6.49996 6L8.00028 6.0004C8.55256 6.0004 9.00028 6.44811 9.00028 7.00039L9.00028 10.4992C9.00028 10.7754 9.22408 10.9989 9.50033 10.9992L9.50033 10.9997C9.77657 10.9998 10.0005 11.2236 10.0005 11.4998L10.0003 11.5001C10.0002 11.7765 9.77622 12.0006 9.49978 12.0006L8.00028 12.0004L6.50033 12.0004C6.22423 12.0004 6.00064 11.7767 6.00049 11.5006L6.00021 11.5005C6.00021 11.2243 6.22418 11.0003 6.50037 11.0003L6.50037 11.0006C6.77649 11.0007 7.00042 10.7766 7.00042 10.5005L7.00017 7.50005C7.00017 7.22376 6.77644 7.00047 6.50015 7.00002L6.49946 6.99922C6.22357 6.999 6 6.77565 6 6.49976C6.00011 6.22373 6.22393 6 6.49996 6Z" fill="rgb(132,136,142)" fill-rule="evenodd" />
</svg>
src/components/base/newsList/index.vue
浏览文件 @ 69d1fe4b
......@@ -10,7 +10,7 @@
</div>
</div>
<div class="news-main">
<div class="news-item" v-for="(news, index) in newsList" :key="index" @click="handleToNewsAnalysis(news)">
<div class="news-item" v-for="(news, index) in showNewsList" :key="index" @click="handleToNewsAnalysis(news)">
<div class="left">
<img :src="news[props.img] ? news[props.img] : DefaultIconNews" alt="" />
</div>
......@@ -29,6 +29,7 @@
</template>
<script setup>
import { computed } from "vue";
import DefaultIconNews from "@/assets/icons/default-icon-news.png";
const props = defineProps({
// 新闻列表数据
......@@ -54,6 +55,12 @@ const props = defineProps({
default: "content"
}
});
const showNewsList = computed(() => {
return props.newsList.slice(0,5)
})
const emit = defineEmits(["item-click", "more-click"]);
const handleToMoreNews = () => {
emit("more-click");
......
src/components/base/riskSignal/index.vue
浏览文件 @ 69d1fe4b
......@@ -11,7 +11,7 @@
</div>
<div class="box2-main">
<div class="box2-main-item" v-for="(item, index) in list" :key="index" @click="handleItemClick(item, index)">
<div class="box2-main-item" v-for="(item, index) in showRiskSignalList" :key="index" @click="handleItemClick(item, index)">
<div :class="{
itemLeftStatus1: item[props.riskLevel] === '特别重大',
itemLeftStatus2: item[props.riskLevel] === '重大风险',
......@@ -38,6 +38,7 @@
<script setup>
import { ElMessage } from "element-plus";
import { computed } from "vue";
// 接收父组件传递的参数
const props = defineProps({
// 标题（默认“风险信号”）
......@@ -75,6 +76,10 @@ const props = defineProps({
});
const showRiskSignalList = computed(() => {
return props.list.slice(0,6)
})
// 定义自定义事件，把点击事件传递给父组件
const emit = defineEmits(['item-click', 'more-click']);
......@@ -85,7 +90,6 @@ const handleItemClick = (item, index) => {
// 点击“查看更多”
const handleMoreClick = () => {
emit('more-click')
};
......@@ -202,11 +206,10 @@ const handleMoreClick = () => {
box-sizing: border-box;
padding-left: 23px;
padding-right: 30px;
overflow-y: auto;
width: 520px;
height: calc(100% - 160px);
height: 313px;
border-radius: 4px;
padding: 15px 30px 10px 23px;
.box2-main-item {
width: 463px;
height: 48px;
......
src/styles/common.scss
浏览文件 @ 69d1fe4b
......@@ -11,6 +11,24 @@
display: flex;
}
.flex-display-center{
@extend .flex-display;
justify-content: center;
align-items: center;
}
.flex-display-end{
@extend .flex-display;
justify-content: flex-end;
align-items: center;
}
.flex-display-start{
@extend .flex-display;
justify-content: flex-start;
align-items: center;
}
.flex-fill {
flex: 1;
}
......@@ -232,34 +250,42 @@
background: #FFFFFF;
}
// 红色
.color-red-100 {
color: rgb(206, 79, 81);
}
// 红色10%背景
.bg-red-10 {
background: rgba(206, 79, 81, 0.1);
}
// 橙色
.color-orange-100 {
color: rgb(255, 149, 77)
}
// 橙色10%背景
.bg-orange-10 {
background: rgba(255, 149, 77, 0.1)
}
// 黄色
.color-yellow-100 {
color: rgb(232, 189, 11);
}
// 黄色10%背景
.bg-yellow-10 {
background: rgba(232, 189, 11, 0.1);
}
// 绿色
.color-green-100 {
color: rgb(33, 129, 57);
}
// 绿色10%背景
.bg-green-10 {
background: rgba(33, 129, 57, 0.1);
}
\ No newline at end of file
src/styles/components/textStyle.vue
浏览文件 @ 69d1fe4b
......@@ -99,16 +99,16 @@ const tableData = ref([
{name: '高亮背景色', className: 'color-bg-active'},
{name: '红色', className: 'color-red-100'},
{name: '红色10%', className: 'bg-red-10'},
{name: '红色10%-背景', className: 'bg-red-10'},
{name: '橙色', className: 'color-orange-100'},
{name: '橙色10%', className: 'bg-orange-10'},
{name: '橙色10%-背景', className: 'bg-orange-10'},
{name: '黄色', className: 'color-yellow-100'},
{name: '黄色10%', className: 'bg-yellow-10'},
{name: '黄色10%-背景', className: 'bg-yellow-10'},
{name: '绿色', className: 'color-green-100'},
{name: '绿色10%', className: 'bg-green-10'},
{name: '绿色10%-背景', className: 'bg-green-10'},
])
</script>
......
src/views/marketAccessRestrictions/marketAccessHome/index.vue
浏览文件 @ 69d1fe4b
......@@ -7,54 +7,6 @@
<SearchContainer style="margin-bottom: 0;margin-top: 48px; height: fit-content" v-if="containerRef"
placeholder="搜索市场准入限制调查" :containerRef="containerRef" areaName="" />
</div>
<!-- <div class="home-main-header-footer">
<div class="home-main-header-footer-item">
<div class="item-top">142</div>
<div class="item-footer">总调查案件数</div>
</div>
<div class="home-main-header-footer-item">
<div class="item-top">28</div>
<div class="item-footer">调查中案件数</div>
</div>
<div class="home-main-header-footer-item">
<div class="item-top">326</div>
<div class="item-footer">涉及中企</div>
</div>
<div class="home-main-header-footer-item">
<div class="item-top">38%</div>
<div class="item-footer">胜诉/和解率</div>
</div>
<div class="home-main-header-footer-item">
<div class="item-top">285</div>
<div class="item-footer">分析报告</div>
</div>
</div> -->
<!-- <div class="home-main-header-btn-box">
<div class="btn" @click="scrollToTop('position1')">
<div class="btn-text">{{ "最新动态" }}</div>
<div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" />
</div>
</div>
<div class="btn" @click="scrollToTop('position2')">
<div class="btn-text">{{ "资讯要闻" }}</div>
<div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" />
</div>
</div>
<div class="btn" @click="scrollToTop('position3')">
<div class="btn-text">{{ "数据总览" }}</div>
<div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" />
</div>
</div>
<div class="btn" @click="scrollToTop('position4')">
<div class="btn-text">{{ "资源库" }}</div>
<div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt="" />
</div>
</div>
</div> -->
<div class="home-main-header-card-box">
<div class="home-main-header-card-box-box1 card"
@click="handleClickCardToDetail(sortInfo[1]?.sortCode, sortInfo[1]?.sortName)">
......@@ -117,55 +69,55 @@
<div class="box1-main">
<div class="box1-main-header">
<div class="header-left">
{{ item.SEARCHNAME }}
{{ item.searchname }}
</div>
<div class="header-right">
<div class="tag1">{{ item.SEARCHSORT }}</div>
<div class="tag1">{{ item.searchsort }}</div>
<div class="tag2" v-for="(val, idx) in item.searchArea" :key="idx">{{ val }}</div>
</div>
</div>
<div class="info-box">
<div class="info-header">
<div class="icon"></div>
<div class="time">{{ item.PROGRESSDATE }}</div>
<div class="title">{{ item.PROGRESSRESULT }}</div>
<div class="time">{{ item.progressdate }}</div>
<div class="title">{{ item.progressresult }}</div>
</div>
<div class="info-content">
{{ item.PROGRESSDETAILS }}
{{ item.progressdetails }}
</div>
</div>
<div class="list-box">
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "调查案号：" }}</div>
<div class="list-right">{{ item.SEARCHNUM }}</div>
<div class="list-right">{{ item.searchnum }}</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "涉及产品：" }}</div>
<div class="list-right">
{{ item.PRODUCT }}
{{ item.product }}
</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "原告：" }}</div>
<div class="list-right">
{{ item.PLAINTIFF }}
{{ item.plaintiff }}
</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "被告：" }}</div>
<div class="list-right">
{{ item.DEFENDANT }}
{{ item.defendant }}
</div>
</div>
<div class="list-item">
<div class="icon"></div>
<div class="list-left">{{ "涉案专利" }}</div>
<div class="list-right">
{{ item.PATENT }}
{{ item.patent }}
</div>
</div>
</div>
......@@ -174,8 +126,8 @@
</el-carousel>
</overviewMainBox>
</div>
<RiskSignal :list="box2Data" @more-click="handleToMoreRiskSignal" postDate="signalTime" name="signalTitle"
riskLevel="signalLevel" />
<RiskSignal :list="box2Data" @more-click="handleToMoreRiskSignal" @item-click="handleClickCardToDetail"
postDate="signalTime" name="signalTitle" riskLevel="signalLevel" />
</div>
<DivideHeader id="position2" class="divide-header" :titleText="'资讯要闻'"></DivideHeader>
<div class="center-center">
......@@ -194,19 +146,18 @@
</template>
<template #header-right>
<div class="box-header-right">
<div class="icon">
<img src="@/assets/images/icon/header-btn.png" alt="" />
<div class="box5-header-right-btn-box">
<div class="right-box" :class="{ rightBoxActive: box5BtnActive === item.value }"
v-for="(item, index) in box5BtnList" :key="index" @click="handleChangeBox5Btn(item.value)">
{{ item.name }}
</div>
</div>
<div class="text">{{ "数据来源：美国商务部" }}</div>
</div>
</template>
<div class="box5-main">
<div class="box5-main-chart" id="chart1"></div>
<div class="box5-main-btn-box">
<div class="right-box" :class="{ rightBoxActive: box5BtnActive === item.value }"
v-for="(item, index) in box5BtnList" :key="index" @click="handleChangeBox5Btn(item.value)">
{{ item.name }}
</div>
<div class="box5-main-footer">
<TipTab />
</div>
</div>
</OverviewNormalBox>
......@@ -214,80 +165,77 @@
<div class="box6">
<OverviewNormalBox title="制裁领域分布" width="521px">
<template #header-icon>
<!-- <img style="width: 100%; height: 100%;" src="./assets/images/box6-header-icon.png" alt="" /> -->
<img style="width: 100%; height: 100%;" src="./assets/icons/icon3.svg" alt="" />
</template>
<template #header-right>
<div class="box-header-right">
<div class="icon">
<img src="@/assets/images/icon/header-btn.png" alt="" />
</div>
<div class="text">{{ "数据来源：美国商务部" }}</div>
</div>
</template>
<div class="box6-main">
<div class="box6-main-select-box">
<el-select v-model="box6SelectedYear" @change="handleChangeBox6Year" placeholder="选择时间"
style="width: 120px">
<el-option v-for="item in box6YearList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<div class="box6-mian-chart" id="chart2"></div>
</template>
<div class="box6-main">
<div class="box6-main-chart" id="chart2"></div>
<div class="box6-main-footer">
<TipTab />
</div>
</div>
</OverviewNormalBox>
</div>
</div>
<div class="center-footer1">
<div class="box7">
<div class="box7-header">
<div class="box7-header-left">
<div class="box7-header-icon">
<!-- <img src="./assets/images/box3-header-icon.png" alt="" /> -->
<img src="./assets/icons/icon4.svg" alt="" />
<OverviewNormalBox title="受调查国家分布" width="1064px">
<template #header-icon>
<img style="width: 100%; height: 100%;" src="./assets/icons/icon4.svg" alt="" />
</template>
<template #header-right>
<div class="box-header-right">
<div class="box7-header-right-select-box">
<el-select v-model="box7SelectedSurvey" @change="handleChangeBox7Survey" placeholder="选择调查"
style="width: 120px">
<el-option v-for="item in box7SurveyList" :key="item.value" :label="item.label"
:value="item.value" />
</el-select>
<el-select v-model="box7SelectedYear" @change="handleChangeBox7Year" placeholder="选择时间"
style="width: 120px">
<el-option v-for="item in box7YearList" :key="item.value" :label="item.label"
:value="item.value" />
</el-select>
</div>
</div>
<div class="box7-header-title">{{ "受调查国家分布" }}</div>
</div>
<div class="box-header-right">
<div class="icon">
<img src="@/assets/images/icon/header-btn.png" alt="" />
</template>
<div class="box7-main">
<el-empty v-if="box7Data.data.length === 0" description="暂无数据" :image-size="100" />
<div v-if="box7Data.data.length > 0" class="box7-main-chart-box" id="box7Chart"></div>
<div class="box7-main-footer">
<TipTab />
</div>
<div class="text">{{ "数据来源：美国商务部" }}</div>
</div>
</div>
<div class="box7-main">
<div class="box7-main-top">
<el-select v-model="box7SelectedSurvey" @change="handleChangeBox7Survey" placeholder="选择调查"
style="width: 120px">
<el-option v-for="item in box7SurveyList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-select v-model="box7SelectedYear" @change="handleChangeBox7Year" placeholder="选择时间"
style="width: 120px">
<el-option v-for="item in box7YearList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<el-empty v-if="box7Data.data.length === 0" description="暂无数据" :image-size="100" />
<div v-if="box7Data.data.length > 0" class="box7-main-main" id="box7Chart"></div>
</div>
</OverviewNormalBox>
</div>
<div class="box8">
<div class="box8-header">
<div class="box8-header-left">
<div class="box8-header-icon">
<!-- <img src="./assets/images/box6-header-icon.png" alt="" /> -->
<img src="./assets/icons/icon5.svg" alt="" />
<OverviewNormalBox title="调查结果分布" width="521px">
<template #header-icon>
<img style="width: 100%; height: 100%" src="./assets/icons/icon5.svg" alt="" />
</template>
<template #header-right>
<div class="box-header-right">
<el-select v-model="box8SelectedSurvey" @change="handleChangeBox8Survey" placeholder="选择调查"
style="width: 120px">
<el-option v-for="item in box8SurveyList" :key="item.value" :label="item.label"
:value="item.value" />
</el-select>
</div>
<div class="box8-header-title">{{ "调查结果分布" }}</div>
</div>
<div class="box-header-right">
<el-select v-model="box8SelectedSurvey" @change="handleChangeBox8Survey" placeholder="选择调查"
style="width: 120px">
<el-option v-for="item in box8SurveyList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</template>
<el-empty v-if="box8Data.length === 0" description="暂无数据" :image-size="120" style="padding-top: 100px;" />
<div v-if="box8Data.length" class="box8-main" id="box8Chart"></div>
<div class="box8-footer">
<TipTab />
</div>
</div>
<el-empty v-if="box8Data.length === 0" description="暂无数据" :image-size="100" />
<div v-if="box8Data.length" class="box8-main" id="box8Chart"></div>
</OverviewNormalBox>
</div>
</div>
</div>
......@@ -380,27 +328,31 @@
<div class="right-main">
<el-empty v-if="surveyInfoList.length === 0" description="当前条件下暂无数据" :image-size="200" />
<div v-else class="right-main-item" v-for="(item, index) in surveyInfoList" :key="index"
@click="handleClickToSurveyDetail()">
<div class="item-left">{{ item.SEARCHDATE }}</div>
@click="handleClickToSurveyDetail(item.sortcode)">
<div class="item-left">
<div class="item-left-item"> {{ formatDate(item.searchdate, 'year') }}</div>
<div class="item-left-item"> {{ formatDate(item.searchdate, 'date') }}</div>
</div>
<div class="item-center">
<div class="icon">
<img :src='item.SORTIMAGEURL' alt="" />
<img :src='item.sortimageurl' alt="" />
</div>
<div class="line" v-if="index !== surveyInfoList.length - 1"></div>
</div>
<div class="item-right">
<div class="item-right-header">
<div class="tag"
:class="{ tag1: item.SORTCODE === '337', tag2: item.SORTCODE === '301', tag3: item.SORTCODE === '232' }">
{{ item.SORTCODE }}</div>
<div class="title">{{ item.SEARCHNAME }}</div>
<div class="status" v-if="item.CASESTATUS">
:class="{ tag1: item.sortcode === '337', tag2: item.sortcode === '301', tag3: item.sortcode === '232' }">
{{ item.sortcode }}</div>
<div class="title">{{ item.searchname }}</div>
<div class="status" v-if="item.casestatus">
<div class="status-icon"></div>
<div class="status-text">{{ item.CASESTATUS }}</div>
<div class="status-text">{{ item.casestatus }}</div>
</div>
</div>
<div class="item-right-content" v-if="item.CONTENT">
{{ item.CONTENT }}
<div class="item-right-content" v-if="item.content">
{{ item.content }}
</div>
<div class="item-right-footer">
<!-- <div class="area-box" v-for="(val, idx) in item.searchArea" :key="idx">
......@@ -436,10 +388,14 @@
</template>
<script setup>
import RiskSignal from "@/components/RiskSignal/RiskSignal.vue";
import { onMounted, ref } from "vue";
import RiskSignal from "@/components/base/RiskSignal/index.vue";
import TipTab from "@/components/base/TipTab/index.vue"
import MessageBubble from "@/components/base/MessageBubble/index.vue"
import NewsList from "@/components/base/NewsList/index.vue";
import DivideHeader from "@/components/DivideHeader.vue";
import setChart from "@/utils/setChart";
import router from "@/router";
......@@ -448,14 +404,6 @@ import getPieChart from "./utils/piechart";
import getRadarChart from "./utils/radarChart";
import getBarChart from "./utils/barChart1";
import Img1 from "./assets/images/1.png";
import Img2 from "./assets/images/2.png";
import Img3 from "./assets/images/3.png";
import Img4 from "./assets/images/4.png";
import Img5 from "./assets/images/5.png";
import Img6 from "./assets/images/6.png";
import Img7 from "./assets/images/7.png";
import { getPersonSummaryInfo } from "@/api/common/index";
import {
getStatSort,
......@@ -474,9 +422,20 @@ import {
import { getRiskSignal, getNews, getRemarks } from "@/api/common/index";
import { ElMessage } from "element-plus";
import DefaultUserIcon from "@/assets/icons/default-icon1.png";
import DefaultCompanyIcon from "@/assets/icons/default-icon2.png";
import DefaultNewsIcon from "@/assets/icons/default-icon-news.png";
const formatDate = (dateStr, dateType) => {
if (!dateStr) return "";
const date = new Date(dateStr);
if (isNaN(date.getTime())) return dateStr;
const year = date.getFullYear();
const month = date.getMonth() + 1;
const day = date.getDate();
if (dateType === 'year') {
return year
} else {
return `${month.toString().padStart(2, "0")}月${day.toString().padStart(2, "0")}日`
}
// return `${year}年${month.toString().padStart(2, "0")}月${day.toString().padStart(2, "0")}日`;
}
let containerRef = ref(null);
// 首页分类
......@@ -879,50 +838,50 @@ const handleGetStatArea = async () => {
console.log("制裁领域分布", res);
if (res.code === 200 && res.data) {
const arr = res.data.map(item => {
return item.AREANAME;
return item.areaname;
});
box6Data.value.title = [...new Set(arr)];
const arr1 = res.data.filter(item => {
return item.SORTNAME === "337调查";
return item.sortname === "337调查";
});
const arr1Name = arr1.map(item => {
return item.AREANAME;
return item.areaname;
});
box6Data.value.title.forEach((item, index) => {
if (arr1Name.indexOf(item) > -1) {
const idx = arr1Name.indexOf(item);
box6Data.value.data[0].value[index] = arr1[idx].AREACOUNT;
box6Data.value.data[0].value[index] = arr1[idx].areacount;
} else {
box6Data.value.data[0].value[index] = 0;
}
});
const arr2 = res.data.filter(item => {
return item.SORTNAME === "232调查";
return item.sortname === "232调查";
});
const arr2Name = arr2.map(item => {
return item.AREANAME;
return item.areaname;
});
box6Data.value.title.forEach((item, index) => {
if (arr2Name.indexOf(item) > -1) {
const idx = arr2Name.indexOf(item);
box6Data.value.data[1].value[index] = arr2[idx].AREACOUNT;
box6Data.value.data[1].value[index] = arr2[idx].areacount;
} else {
box6Data.value.data[1].value[index] = 0;
}
});
const arr3 = res.data.filter(item => {
return item.SORTNAME === "301调查";
return item.sortname === "301调查";
});
const arr3Name = arr3.map(item => {
return item.AREANAME;
return item.areaname;
});
box6Data.value.title.forEach((item, index) => {
if (arr3Name.indexOf(item) > -1) {
const idx = arr3Name.indexOf(item);
box6Data.value.data[2].value[index] = arr3[idx].AREACOUNT;
box6Data.value.data[2].value[index] = arr3[idx].areacount;
} else {
box6Data.value.data[2].value[index] = 0;
}
......@@ -995,34 +954,6 @@ const handleChangeBox7Year = () => {
};
const box7Data = ref({
title: [
// {
// img: Img1,
// name: "中国"
// },
// {
// img: Img2,
// name: "俄罗斯"
// },
// {
// img: Img3,
// name: "巴西"
// },
// {
// img: Img4,
// name: "巴基斯坦"
// },
// {
// img: Img5,
// name: "印度"
// },
// {
// img: Img6,
// name: "日本"
// },
// {
// img: Img7,
// name: "德国"
// }
],
data: []
});
......@@ -1039,7 +970,7 @@ const handleGetBox7Data = async () => {
box7Data.value.title = res.data.map(item => {
return {
name: item.COUNTRY,
img: item.COUNTRYIMAGE ? item.COUNTRYIMAGE : Img1
img: item.COUNTRYIMAGE
};
});
box7Data.value.data = res.data.map(item => {
......@@ -1074,26 +1005,6 @@ const box8SurveyList = ref([
const box8SelectedSurvey = ref("337");
// 调查结果分布
const box8Data = ref([
// {
// name: "和解/同意令",
// value: 50
// },
// {
// name: "裁定不侵权",
// value: 46
// },
// {
// name: "裁定侵权",
// value: 40
// },
// {
// name: "申诉方撤诉",
// value: 31
// },
// {
// name: "其他",
// value: 24
// }
]);
const handleGetBox8Data = async () => {
const params = {
......@@ -1209,7 +1120,7 @@ const surveyYearList = ref([
id: "2021"
}
]);
const checkedSurveyYears = ref([]);
const checkedSurveyYears = ref(['全部时间']);
const handleChangeCheckedSurveyYears = (val) => {
if (val.includes("全部时间") && val.length > 1) {
if (val[val.length - 1] === "全部时间") {
......@@ -1225,7 +1136,7 @@ const handleChangeCheckedSurveyYears = (val) => {
const areaList = ref([
]);
const checkedAreaList = ref([]);
const checkedAreaList = ref(['全部领域']);
const handleGetAreaList = async () => {
try {
const res = await getHylyList();
......@@ -1272,7 +1183,7 @@ const insList = ref([
id: "491"
}
]);
const checkedInsList = ref([]);
const checkedInsList = ref(['全部机构']);
const handleGetInsList = async () => {
// const params = {
// sortCode: activeCateId.value
......@@ -1312,24 +1223,8 @@ const handleChangeCheckedIns = (val) => {
// 受调查国家/地区
const countryList = ref([
{
name: "中国",
id: "0101"
},
{
name: "俄罗斯",
id: "俄罗斯"
},
{
name: "日本",
id: "日本"
},
{
name: "韩国",
id: "韩国"
}
]);
const checkedCountryList = ref([]);
const checkedCountryList = ref(['全部']);
const handleGetAllSearchCountry = async () => {
try {
......@@ -1364,39 +1259,24 @@ const handleChangeCheckedCountry = (val) => {
};
const surveyInfoList = ref([
// {
// time: "2025 11月12日",
// survey: "337",
// title: "外国制造的半导体器件及其下游产品和组件",
// content:
// "美国国际贸易委员会（ITC）投票决定对特定半导体器件及其下游计算产品和组件（Certain Semiconductor Devices, Computing Products Containing the Same,and Components Thereof）启动337调查。",
// status: "部分终裁",
// areaList: ["集成电路"],
// countryList: ["a", "b"]
// },
// {
// time: "202511月12日",
// survey: "337",
// title: "外国制造的半导体器件及其下游产品和组件",
// content:
// "美国国际贸易委员会（ITC）投票决定对特定半导体器件及其下游计算产品和组件（Certain Semiconductor Devices, Computing Products Containing the Same,and Components Thereof）启动337调查。",
// status: "部分终裁",
// areaList: ["集成电路"]
// }
]);
const handleGetSurveyList = async () => {
const params = {
currentPage: currentPage.value - 1,
pageSize: pageSize.value,
sortCode: activeCateId.value,
publishYear: checkedSurveyYears.value.toString(),
Area: checkedAreaList.value.toString(),
publishOrg: checkedInsList.value.toString(),
searchCountry: checkedCountryList.value.toString(),
sortCode: activeCateId.value ? activeCateId.value : null,
publishYear: checkedSurveyYears.value[0] === '全部时间' ? null : checkedSurveyYears.value.toString(),
Area: checkedAreaList.value[0] === '全部领域' ? null : checkedAreaList.value.toString(),
publishOrg: checkedInsList.value[0] === '全部机构' ? null : checkedInsList.value.toString(),
searchCountry: checkedCountryList.value[0] === '全部' ? null : checkedCountryList.value.toString(),
sortField: "date",
sortOrder: isSort.value ? "desc" : "asc"
};
// console.log(params);
try {
const res = await getSurveyList(params);
console.log("调查列表", res);
......@@ -1498,7 +1378,7 @@ onMounted(async () => {
.item-top {
height: 22px;
color: rgba(20, 89, 187, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 36px;
font-weight: 700;
line-height: 22px;
......@@ -1508,7 +1388,7 @@ onMounted(async () => {
margin-top: 10px;
height: 30px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 30px;
......@@ -1543,7 +1423,7 @@ onMounted(async () => {
.btn-text {
width: 80px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: 400;
line-height: 48px;
......@@ -1612,7 +1492,7 @@ onMounted(async () => {
margin-left: 30px;
margin-top: 26px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: 700;
line-height: 26px;
......@@ -1623,7 +1503,7 @@ onMounted(async () => {
margin-right: 35px;
height: 24px;
color: rgba(250, 140, 22, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 30px;
font-weight: 700;
line-height: 24px;
......@@ -1637,7 +1517,7 @@ onMounted(async () => {
width: 485px;
height: 24px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 24px;
......@@ -1681,7 +1561,7 @@ onMounted(async () => {
margin-left: 30px;
margin-top: 26px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: 700;
line-height: 26px;
......@@ -1692,7 +1572,7 @@ onMounted(async () => {
margin-right: 35px;
height: 24px;
color: rgba(114, 46, 209, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 30px;
font-weight: 700;
line-height: 24px;
......@@ -1706,7 +1586,7 @@ onMounted(async () => {
width: 485px;
height: 24px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 24px;
......@@ -1751,7 +1631,7 @@ onMounted(async () => {
margin-left: 30px;
margin-top: 26px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: 700;
line-height: 26px;
......@@ -1762,7 +1642,7 @@ onMounted(async () => {
margin-right: 35px;
height: 24px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 30px;
font-weight: 700;
line-height: 24px;
......@@ -1776,7 +1656,7 @@ onMounted(async () => {
width: 485px;
height: 24px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 24px;
......@@ -1860,7 +1740,7 @@ onMounted(async () => {
margin-left: 19px;
color: #fff;
background: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: 700;
line-height: 48px;
......@@ -1873,7 +1753,7 @@ onMounted(async () => {
margin-right: 40px;
height: 16px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 16px;
......@@ -1896,7 +1776,7 @@ onMounted(async () => {
.header-left {
padding-left: 22px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: 700;
line-height: 26px;
......@@ -1956,12 +1836,12 @@ onMounted(async () => {
}
.time {
width: 98px;
width: 200px;
height: 24px;
margin-top: 10px;
margin-left: 12px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 700;
line-height: 24px;
......@@ -1973,25 +1853,30 @@ onMounted(async () => {
margin-top: 10px;
height: 24px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 700;
line-height: 24px;
}
}
.info-content {
width: 909px;
height: 60px;
overflow: hidden;
overflow-y: auto;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 30px;
margin-left: 41px;
margin-top: 4px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal;
}
}
......@@ -2004,7 +1889,7 @@ onMounted(async () => {
overflow-y: auto;
.list-item {
min-height: 37px;
height: 37px;
display: flex;
.icon {
......@@ -2020,7 +1905,7 @@ onMounted(async () => {
line-height: 37px;
width: 100px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 700;
}
......@@ -2029,9 +1914,13 @@ onMounted(async () => {
line-height: 37px;
margin-left: 17px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
width: 800px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
......@@ -2041,9 +1930,9 @@ onMounted(async () => {
.box2 {
width: 521px;
height: 450px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
background: rgba(255, 255, 255, 1);
// border-radius: 10px;
// box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
// background: rgba(255, 255, 255, 1);
position: relative;
.box2-header {
......@@ -2075,7 +1964,7 @@ onMounted(async () => {
margin-top: 11px;
height: 26px;
color: #fff;
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: 700;
line-height: 26px;
......@@ -2087,7 +1976,7 @@ onMounted(async () => {
line-height: 20px;
text-align: center;
color: rgba(255, 255, 255, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 12px;
margin-left: 15px;
margin-top: 15px;
......@@ -2100,7 +1989,7 @@ onMounted(async () => {
margin-top: 16px;
margin-left: 200px;
color: rgba(20, 89, 187, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 16px;
......@@ -2111,75 +2000,6 @@ onMounted(async () => {
.box2-main {
margin-top: 2px;
height: 330px;
overflow-y: auto;
.box2-main-item {
margin-left: 23px;
height: 47px;
width: 464px;
display: flex;
cursor: pointer;
&:hover {
background: var(--color-bg-hover);
}
.itemLeftStatus3 {
background: rgba(255, 241, 240) !important;
color: rgba(245, 34, 45, 1) !important;
}
.itemLeftStatus2 {
color: rgba(250, 140, 22, 1) !important;
background: rgba(255, 247, 230, 1) !important;
}
.item-left {
margin-top: 4px;
margin-left: 2px;
width: 40px;
height: 40px;
border-radius: 20px;
color: rgba(82, 196, 26, 1);
background: rgba(246, 255, 237, 1);
font-family: Microsoft YaHei;
font-size: 12px;
font-weight: 400;
line-height: 14px;
box-sizing: border-box;
padding: 6px 4px;
text-align: center;
}
.item-right {
margin-left: 13px;
width: 408px;
height: 47px;
border-bottom: 1px solid rgba(240, 242, 244, 1);
display: flex;
.text {
width: 328px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 47px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.time {
margin-left: 2px;
line-height: 47px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
}
}
}
}
.box2-footer {
......@@ -2209,7 +2029,7 @@ onMounted(async () => {
.text {
color: rgba(255, 255, 255, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 22px;
......@@ -2257,7 +2077,7 @@ onMounted(async () => {
margin-left: 20px;
height: 26px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: 700;
line-height: 26px;
......@@ -2270,7 +2090,7 @@ onMounted(async () => {
top: 14px;
right: 27px;
color: rgba(20, 89, 187, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 24px;
......@@ -2322,7 +2142,7 @@ onMounted(async () => {
width: 470px;
height: 24px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 700;
line-height: 24px;
......@@ -2337,7 +2157,7 @@ onMounted(async () => {
height: 22px;
margin-top: 15px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 14px;
font-weight: 400;
line-height: 22px;
......@@ -2351,7 +2171,7 @@ onMounted(async () => {
width: 657px;
height: 24px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 24px;
......@@ -2393,7 +2213,7 @@ onMounted(async () => {
margin-left: 20px;
height: 26px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: 700;
line-height: 26px;
......@@ -2406,7 +2226,7 @@ onMounted(async () => {
top: 14px;
right: 27px;
color: rgba(20, 89, 187, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 24px;
......@@ -2421,58 +2241,6 @@ onMounted(async () => {
box-sizing: border-box;
padding-top: 8px;
padding-left: 31px;
// .box4-main-item {
// margin-top: 16px;
// display: flex;
// margin-left: 21px;
// .left {
// margin-top: 5px;
// width: 36px;
// height: 36px;
// border-radius: 18px;
// overflow: hidden;
// cursor: pointer;
// img {
// width: 100%;
// height: 100%;
// }
// }
// .right {
// margin-left: 10px;
// width: 690px;
// box-sizing: border-box;
// border: 1px solid rgba(231, 243, 255, 1);
// background: rgba(246, 250, 255, 1);
// padding: 10px 15px;
// .right-top {
// display: flex;
// justify-content: space-between;
// .name {
// height: 24px;
// color: rgba(59, 65, 75, 1);
// font-family: Microsoft YaHei;
// font-size: 16px;
// font-weight: 700;
// line-height: 24px;
// }
// .time {
// height: 30px;
// color: rgba(95, 101, 108, 1);
// font-family: Microsoft YaHei;
// font-size: 16px;
// font-weight: 400;
// line-height: 30px;
// }
// }
// .content {
// color: rgba(59, 65, 75, 1);
// font-family: Microsoft YaHei;
// font-size: 16px;
// font-weight: 400;
// line-height: 24px;
// }
// }
// }
}
}
}
......@@ -2495,80 +2263,7 @@ onMounted(async () => {
align-items: center;
gap: 8px;
.icon {
width: 14px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
height: 24px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
}
}
.box5-header {
height: 48px;
border-bottom: 1px solid rgba(240, 242, 244, 1);
margin: 0 auto;
display: flex;
justify-content: space-between;
position: relative;
.box5-header-left {
display: flex;
.box5-header-icon {
margin-top: 16px;
margin-left: 22px;
width: 19px;
height: 19px;
img {
width: 100%;
height: 100%;
}
}
.box5-header-title {
margin-top: 11px;
margin-left: 19px;
height: 26px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 700;
line-height: 26px;
}
}
}
.box5-main {
height: 397px;
position: relative;
z-index: 0;
.box5-main-chart {
height: 397px;
}
.box5-main-btn-box {
z-index: 99;
position: absolute;
top: 10px;
right: 5%;
.box5-header-right-btn-box {
display: flex;
justify-content: flex-end;
gap: 8px;
......@@ -2584,7 +2279,7 @@ onMounted(async () => {
border-radius: 4px;
background: rgba(255, 255, 255, 1);
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 28px;
......@@ -2599,16 +2294,22 @@ onMounted(async () => {
}
}
}
.box5-main {
height: 410px;
position: relative;
z-index: 0;
.box5-main-chart {
height: 370px;
}
}
}
.box6 {
width: 521px;
height: 460px;
// box-sizing: border-box;
// border: 1px solid rgba(234, 236, 238, 1);
// border-radius: 10px;
// box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
// background: rgba(255, 255, 255, 1);
.box-header-right {
height: 48px;
......@@ -2617,108 +2318,24 @@ onMounted(async () => {
align-items: center;
gap: 8px;
.icon {
width: 14px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
height: 24px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
}
}
.box6-header {
width: 521px;
height: 48px;
box-sizing: border-box;
border-bottom: 1px solid rgba(240, 242, 244, 1);
display: flex;
position: relative;
.header-icon {
margin-left: 20px;
margin-top: 15px;
width: 19px;
height: 19px;
img {
width: 100%;
height: 100%;
}
}
.header-title {
margin-top: 11px;
margin-left: 15px;
height: 26px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 700;
line-height: 26px;
}
.box-header-right {
position: absolute;
height: 24px;
top: 12px;
right: 17px;
display: flex;
justify-content: flex-end;
align-items: center;
gap: 8px;
.icon {
width: 14px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
height: 24px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
}
}
}
.box6-main {
height: 360px;
position: relative;
.box6-main-select-box {
position: absolute;
z-index: 100;
top: 10px;
right: 20px;
}
.box6-mian-chart {
height: 360px;
.box6-main-chart {
height: 370px;
position: relative;
z-index: 99;
}
.box6-main-footer {
width: 100%;
height: 40px;
}
}
}
}
......@@ -2732,95 +2349,29 @@ onMounted(async () => {
.box7 {
width: 1064px;
height: 460px;
box-sizing: border-box;
border: 1px solid rgba(234, 236, 238, 1);
border-radius: 10px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1);
.box7-header {
.box-header-right {
height: 48px;
border-bottom: 1px solid rgba(240, 242, 244, 1);
margin: 0 auto;
display: flex;
justify-content: space-between;
position: relative;
.box7-header-left {
display: flex;
.box7-header-icon {
margin-top: 16px;
margin-left: 22px;
width: 19px;
height: 19px;
img {
width: 100%;
height: 100%;
}
}
.box7-header-title {
margin-top: 11px;
margin-left: 19px;
height: 26px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 700;
line-height: 26px;
}
}
.box-header-right {
position: absolute;
height: 24px;
top: 12px;
right: 17px;
.box7-header-right-select-box {
height: 48px;
display: flex;
justify-content: flex-end;
box-sizing: border-box;
align-items: center;
gap: 8px;
.icon {
width: 14px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
height: 24px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
}
gap: 12px;
}
}
.box7-main {
height: 412px;
.box7-main-top {
height: 40px;
display: flex;
justify-content: flex-end;
margin-right: 22px;
box-sizing: border-box;
padding-top: 12px;
gap: 12px;
.box7-main-chart-box {
height: 372px;
}
.box7-main-main {
height: 372px;
.box7-main-footer {
height: 40px;
}
}
}
......@@ -2828,83 +2379,24 @@ onMounted(async () => {
.box8 {
width: 521px;
height: 460px;
box-sizing: border-box;
border: 1px solid rgba(234, 236, 238, 1);
border-radius: 10px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1);
.box8-header {
.box-header-right {
height: 48px;
border-bottom: 1px solid rgba(240, 242, 244, 1);
margin: 0 auto;
display: flex;
justify-content: space-between;
position: relative;
.box8-header-left {
display: flex;
.box8-header-icon {
margin-top: 15px;
margin-left: 20px;
width: 20px;
height: 20px;
img {
width: 100%;
height: 100%;
}
}
.box8-header-title {
margin-top: 11px;
margin-left: 20px;
height: 26px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 700;
line-height: 26px;
}
}
.box-header-right {
position: absolute;
height: 24px;
top: 12px;
right: 17px;
display: flex;
justify-content: flex-end;
align-items: center;
gap: 8px;
.icon {
width: 14px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
justify-content: flex-end;
align-items: center;
gap: 8px;
.text {
height: 24px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
}
}
}
.box8-main {
width: calc(100% - 40px);
margin: 0 auto;
height: 360px;
}
.box8-footer {
height: 40px;
}
}
}
}
......@@ -2928,7 +2420,7 @@ onMounted(async () => {
.btn {
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 400;
line-height: 42px;
......@@ -2997,7 +2489,7 @@ onMounted(async () => {
height: 2px;
margin-left: 17px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 700;
line-height: 24px;
......@@ -3029,7 +2521,7 @@ onMounted(async () => {
height: 2px;
margin-left: 17px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 700;
line-height: 24px;
......@@ -3073,7 +2565,7 @@ onMounted(async () => {
height: 26px;
margin-left: 19px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-style: Bold;
font-size: 20px;
font-weight: 700;
......@@ -3084,7 +2576,7 @@ onMounted(async () => {
}
.right-main {
padding-top: 6px;
padding-top: 18px;
// min-height: 586px;
height: calc(100% - 108px);
// max-height: 1540px;
......@@ -3098,21 +2590,26 @@ onMounted(async () => {
cursor: pointer;
height: max-content;
&:hover {
background: var(--color-bg-hover) !important;
}
// &:hover {
// background: var(--color-bg-hover) !important;
// }
.item-left {
width: 100px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-style: Bold;
font-size: 16px;
font-weight: 700;
line-height: 24px;
letter-spacing: 1px;
text-align: right;
height: 48px;
padding-right: 20px;
.item-left-item {
height: 24px;
color: var(--color-main-active);
font-family: Source Han Sans CN;
font-style: Bold;
font-size: 16px;
font-weight: 700;
line-height: 24px;
letter-spacing: 1px;
text-align: right;
}
}
.item-center {
......@@ -3154,7 +2651,7 @@ onMounted(async () => {
height: 24px;
padding: 0 8px;
box-sizing: border-box;
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-style: Bold;
font-size: 16px;
font-weight: 700;
......@@ -3187,7 +2684,7 @@ onMounted(async () => {
width: 880px;
height: 26px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-style: Bold;
font-size: 20px;
font-weight: 700;
......@@ -3197,6 +2694,11 @@ onMounted(async () => {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
&:hover {
color: var(--color-main-active);
text-decoration: underline;
}
}
.status {
......@@ -3217,7 +2719,7 @@ onMounted(async () => {
.status-text {
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-style: Regular;
font-size: 16px;
font-weight: 400;
......@@ -3233,7 +2735,7 @@ onMounted(async () => {
width: 1022px;
height: 60px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-style: Regular;
font-size: 16px;
font-weight: 400;
......@@ -3260,7 +2762,7 @@ onMounted(async () => {
border-radius: 4px;
background: rgba(231, 243, 255, 1);
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-style: Regular;
font-size: 14px;
font-weight: 400;
......@@ -3307,7 +2809,7 @@ onMounted(async () => {
.footer-left {
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-family: Source Han Sans CN;
font-size: 14px;
font-weight: 400;
line-height: 18px;
......
src/views/marketAccessRestrictions/marketAccessHome/utils/barChart1.js
浏览文件 @ 69d1fe4b
......@@ -6,9 +6,9 @@ const getBarChart = (nameList, valueList) => {
tooltip: {},
grid: {
top: '8%',
right: '6%',
bottom: '6%',
left: '6%',
right: 24,
bottom: 24,
left: 24,
containLabel: true
},
yAxis: {
......@@ -65,7 +65,7 @@ const getBarChart = (nameList, valueList) => {
yAxis: valueList[index],
symbol: `image://${item.img}`,
symbolSize: [20, 20],
symbolOffset: [0, 10],
symbolOffset: [0, 20],
symbolCircle: 10
});
});
......
src/views/marketAccessRestrictions/marketAccessHome/utils/multiLineChart.js
浏览文件 @ 69d1fe4b
import * as echarts from 'echarts'
const getMultiLineChart = (data) => {
console.log('dataaaa',data);
console.log('dataaaa', data);
return {
tooltip: {
trigger: 'axis',
......@@ -14,18 +14,18 @@ const getMultiLineChart = (data) => {
}
},
grid: {
top: '15%',
right: '3%',
bottom: '5%',
left: '3%',
top: 48,
right: 24,
bottom: 24,
left: 24,
containLabel: true
},
legend: {
show: true,
top: 10,
left:'5%'
left: '10%'
},
color: ['#0A57A6', '#FA8C16','#722ED1'],
color: ['#0A57A6', '#FA8C16', '#722ED1'],
xAxis: [
{
type: 'category',
......@@ -35,7 +35,16 @@ const getMultiLineChart = (data) => {
],
yAxis: [
{
type: 'value'
type: 'value',
name: '数量',
splitLine: {
show: true,
lineStyle: {
type: 'dashed', // 虚线类型
color: 'rgb(231, 243, 255)', // 灰色线条
width: 1 // 线宽为1
}
}
}
],
series: [
......
src/views/marketAccessRestrictions/marketAccessHome/utils/piechart.js
浏览文件 @ 69d1fe4b
const getPieChart = (data) => {
const colorList = ['#69B1FF','#FF7875','#B37FEB','#FFC069','#1677FF','#87E8DE','#ADC6FF','#FFBB96','#BAE0FF','#FFD591',]
let option = {
// color: colorList,
color: colorList,
series: [
{
type: 'pie',
radius: [90, 115],
radius: [75, 100],
height: '100%',
left: 'center',
width: '100%',
......
src/views/marketAccessRestrictions/marketAccessLayout/case/337/index.vue
浏览文件 @ 69d1fe4b
......@@ -29,13 +29,6 @@
</div>
</div>
<div class="select-box">
<!-- <div class="paixu-btn" @click="handleSwithSort">
<div class="text">{{ "发布时间" }}</div>
<div class="icon2">
<img v-if="isSort" src="@/assets/icons/shengxu2.png" alt="" />
<img v-else src="@/assets/icons/jiangxu2.png" alt="" />
</div>
</div> -->
<el-select v-model="isSort" placeholder="发布时间" style="width: 166px">
<template #prefix>
<div style="display: flex; align-items: center; height: 100%">
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论