Skip to content

R
risk-monitor
提交 172383fa authored 作者: 张烨's avatar 张烨
浏览文件
操作

feat:市场准入限制概览页-调查分类增加日期筛选

上级 59d0a2fd
全部展开 显示空白字符变更
内嵌 并排
正在显示 包含 504 行增加 和 444 行删除
src/api/marketAccessRestrictions/index.js
浏览文件 @ 172383fa
...@@ -138,7 +138,7 @@ export function getSurveyList(params) { ...@@ -138,7 +138,7 @@ export function getSurveyList(params) {
// 详情页--------------------------------------------------- // 详情页---------------------------------------------------
// 获取调查列表接口 // 调查分类详情接口
/** /**
* @param { sortCode } * @param { sortCode }
*/ */
...@@ -169,7 +169,7 @@ export function getSearchAllYear(params) { ...@@ -169,7 +169,7 @@ export function getSearchAllYear(params) {
} }
// 调查简介 /marketsearchDetails/searchBlurb // 调查简介
export function getSearchBlurb(params) { export function getSearchBlurb(params) {
return request({ return request({
method: 'GET', method: 'GET',
......
src/components/base/boxBackground/overviewNormalBox.vue
浏览文件 @ 172383fa
<template> <template>
<div class="overview-normal-box-wrapper" <div class="box-main" :style="{ width: width || '1064px', height: height || '460px' }">
:style="{ width: width ? width : '1064px', height: height ? height : '460px' }"> <div class="box-head-box">
<div class="overview-normal-box-header"> <div class="box-head-left">
<div class="header-left">
<div class="header-icon">
<slot name="header-icon"></slot> <slot name="header-icon"></slot>
</div> </div>
<div class="header-title">{{ title }}</div> <div class="box-head-name one-line-ellipsis">{{ title }}</div>
</div> <div class="box-head-right">
<div class="header-right">
<slot name="header-right"></slot> <slot name="header-right"></slot>
</div> </div>
</div> </div>
<div class="wrapper-main"> <div class="box-down-box">
<slot></slot> <slot></slot>
</div> </div>
</div> </div>
...@@ -41,49 +37,44 @@ const props = defineProps({ ...@@ -41,49 +37,44 @@ const props = defineProps({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.overview-normal-box-wrapper { .box-main {
border: 1px solid rgba(234, 236, 238, 1); border: 1px solid rgba(234, 236, 238, 1);
border-radius: 10px; border-radius: 10px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1); box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
position: relative; display: flex;
flex-direction: column;
.overview-normal-box-header { .box-head-box {
padding: 0 22px;
height: 48px; height: 48px;
border-bottom: 1px solid rgba(240, 242, 244, 1); border-bottom: 1px solid rgba(240, 242, 244, 1);
display: flex; display: flex;
justify-content: space-between; align-items: center;
box-sizing: border-box; width: 100%;
.header-left { .box-head-left {
display: flex;
.header-icon {
width: 24px; width: 24px;
height: 24px; height: 24px;
margin-top: 14px; font-size: 0px;
margin-left: 19px; margin-right: 16px;
} }
.box-head-name {
.header-title {
margin-left: 17px;
height: 48px;
color: var(--color-main-active); color: var(--color-main-active);
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-size: 20px; font-size: 20px;
font-weight: 700; font-weight: bold;
line-height: 48px; line-height: 20px;
text-align: center; width: 20px;
} flex: auto;
} }
.box-head-right {
.header-right { margin-left: 16px;
height: 48px;
margin-right: 28px;
} }
} }
.wrapper-main { .box-down-box {
height: calc(100% - 48px); height: 20px;
flex: auto;
overflow: hidden; overflow: hidden;
} }
} }
......
src/router/index.js
浏览文件 @ 172383fa
...@@ -72,7 +72,7 @@ router.beforeEach((to, from, next) => { ...@@ -72,7 +72,7 @@ router.beforeEach((to, from, next) => {
const storageKey = to.meta.titleStorageKey || "curTabName"; const storageKey = to.meta.titleStorageKey || "curTabName";
// 新开页签时 sessionStorage 不共享，优先用 query 带过来的 title/name // 新开页签时 sessionStorage 不共享，优先用 query 带过来的 title/name
const queryTitle = (to.query && (to.query.title || to.query.name)) ? String(to.query.title || to.query.name) : ""; const queryTitle = (to.query && (to.query.title || to.query.name)) ? String(to.query.title || to.query.name) : "";
if (!to.path.startsWith('/decreeLayout/')) { if (!to.meta.noTitle) {
document.title = queryTitle || window.sessionStorage.getItem(storageKey) || to.meta.title; document.title = queryTitle || window.sessionStorage.getItem(storageKey) || to.meta.title;
} }
} else { } else {
......
src/router/modules/decree.js
浏览文件 @ 172383fa
...@@ -28,9 +28,7 @@ const decreeRoutes = [ ...@@ -28,9 +28,7 @@ const decreeRoutes = [
name: "DecreeLayoutContainer", name: "DecreeLayoutContainer",
component: DecreeLayoutContainer, component: DecreeLayoutContainer,
redirect: "/decreeLayout/overview", redirect: "/decreeLayout/overview",
// meta: { // meta: { title: "政令布局" },
// title: "政令布局"
// },
children: [ children: [
{ {
path: "overview", path: "overview",
...@@ -46,19 +44,19 @@ const decreeRoutes = [ ...@@ -46,19 +44,19 @@ const decreeRoutes = [
path: "introduction", path: "introduction",
name: "DecreeIntroduction", name: "DecreeIntroduction",
component: DecreeIntroduction, component: DecreeIntroduction,
// meta: { title: "政令简介" } meta: { noTitle: true }
}, },
{ {
path: "background", path: "background",
name: "DecreeBackground", name: "DecreeBackground",
component: DecreeBackground, component: DecreeBackground,
// meta: { title: "政令背景" } meta: { noTitle: true }
}, },
{ {
path: "measures", path: "measures",
name: "DecreeMeasures", name: "DecreeMeasures",
component: DecreeMeasures, component: DecreeMeasures,
// meta: { title: "政令举措" } meta: { noTitle: true }
}, },
] ]
}, },
...@@ -67,18 +65,14 @@ const decreeRoutes = [ ...@@ -67,18 +65,14 @@ const decreeRoutes = [
path: "deepDig", path: "deepDig",
name: "DeepDig", name: "DeepDig",
component: DecreeDeepDig, component: DecreeDeepDig,
// meta: { meta: { noTitle: true }
// title: "深度挖掘"
// }
}, },
// 影响分析路由 // 影响分析路由
{ {
path: "influence", path: "influence",
name: "DecreeInfluence", name: "DecreeInfluence",
component: DecreeInfluence, component: DecreeInfluence,
// meta: { meta: { noTitle: true }
// title: "影响分析"
// }
}, },
] ]
}, },
......
src/router/modules/marketAccessRestrictions.js
浏览文件 @ 172383fa
...@@ -28,22 +28,17 @@ const marketAccessRestrictionsRoutes = [ ...@@ -28,22 +28,17 @@ const marketAccessRestrictionsRoutes = [
dynamicTitle: true dynamicTitle: true
}, },
children: [ children: [
{ {
path: "case", path: "case",
name: "MarketAccessCase", name: "MarketAccessCase",
component: MarketAccessCase, component: MarketAccessCase,
// meta: { meta: { noTitle: true }
// title: "调查案件"
// }
}, },
{ {
path: "overview", path: "overview",
name: "MarketAccessOverview", name: "MarketAccessOverview",
component: MarketAccessOverview, component: MarketAccessOverview,
// meta: { meta: { noTitle: true }
// title: "数据统计"
// }
} }
] ]
}, },
...@@ -62,17 +57,13 @@ const marketAccessRestrictionsRoutes = [ ...@@ -62,17 +57,13 @@ const marketAccessRestrictionsRoutes = [
path: "overview", path: "overview",
name: "MarketSingleCaseOverview", name: "MarketSingleCaseOverview",
component: MarketSingleCaseOverview, component: MarketSingleCaseOverview,
// meta: { meta: { noTitle: true }
// title: "调查简介"
// }
}, },
{ {
path: "deepdig", path: "deepdig",
name: "MarketSingleCaseDeepdig", name: "MarketSingleCaseDeepdig",
component: MarketSingleCaseDeepdig, component: MarketSingleCaseDeepdig,
// meta: { meta: { noTitle: true }
// title: "深度挖掘"
// }
} }
] ]
}, },
......
src/views/decree/decreeHome/index.vue
浏览文件 @ 172383fa
...@@ -63,66 +63,6 @@ ...@@ -63,66 +63,6 @@
<DivideHeader id="position1" class="divide" :titleText="'最新动态'"></DivideHeader> <DivideHeader id="position1" class="divide" :titleText="'最新动态'"></DivideHeader>
<div class="home-main-center"> <div class="home-main-center">
<div class="center-top"> <div class="center-top">
<!-- <div class="box1">
<div class="box1-left" @click="handleSwithCurDecree('left')">
<div class="icon">
<img src="./assets/images/box1-left.svg" alt="" />
</div>
</div>
<div class="box1-right" @click="handleSwithCurDecree('right')">
<div class="icon">
<img src="./assets/images/box1-right.svg" alt="" />
</div>
</div>
<div class="box1-header">
<div class="box1-header-left">
<div class="icon">
<img src="./assets/images/box1-header-icon.png" alt="" />
</div>
<div class="title">{{ "最新科技政令" }}</div>
</div>
<div class="box1-header-right" @click="handleClickOrder">
{{ "查看详情 >" }}
</div>
</div>
<el-carousel ref="carouselRef" height="395px" :autoplay="true" :interval="3000" arrow="never"
indicator-position="none">
<el-carousel-item v-for="(item, index) in box1DataList" :key="index">
<div class="box1-main">
<div class="box1-main-left">
<img v-if="item.imageUrl" :src="item.imageUrl" alt="" />
<div v-else class="box1-main-left-img-mock">
<img class="img-mock-badge-img" src="./assets/images/badge.png" />
<p class="img-mock-badge-title">行政令</p>
<p class="img-mock-badge-title">{{ item.name }}</p>
</div>
</div>
<div class="box1-main-right">
<div class="box1-main-right-title">
{{ item.name }}
</div>
<div class="box1-main-right-info">
<AreaTag v-for="(tag, index) in item.industryList" :key="index" :tagName="tag.industryName" />
</div>
<div class="box1-main-right-center">
{{ item.describe }}
</div>
<div class="box1-main-right-footer">
<div class="footer-left">{{ item.postDate }}</div>
<div class="footer-right">
<div class="footer-right-item1">
{{ item.officialUrl }}
</div>
<div class="footer-right-item2">
<img src="./assets/images/open-icon.png" alt="" />
</div>
</div>
</div>
</div>
</div>
</el-carousel-item>
</el-carousel>
</div> -->
<OverviewMainBox class="box1" title="最新科技政令" @toDetail="handleClickOrder"> <OverviewMainBox class="box1" title="最新科技政令" @toDetail="handleClickOrder">
<template #header-icon> <template #header-icon>
<img style="width: 100%; height: 100%" src="./assets/images/box1-header-icon.png" alt="" /> <img style="width: 100%; height: 100%" src="./assets/images/box1-header-icon.png" alt="" />
...@@ -610,7 +550,6 @@ const carouselRef = ref(null); ...@@ -610,7 +550,6 @@ const carouselRef = ref(null);
const handleClickOrder = () => { const handleClickOrder = () => {
let index = carouselRef.value?.activeIndex || 0; let index = carouselRef.value?.activeIndex || 0;
let item = box1DataList.value[index]; let item = box1DataList.value[index];
console.log(item)
if (item) onNavigateToDetail(item) if (item) onNavigateToDetail(item)
}; };
...@@ -732,10 +671,7 @@ handleGetMessage(); ...@@ -732,10 +671,7 @@ handleGetMessage();
// 点击人物头像，跳转到人物主页 // 点击人物头像，跳转到人物主页
const handleClickPerson = async item => { const handleClickPerson = async item => {
console.log("person", item);
const personTypeList = JSON.parse(window.sessionStorage.getItem("personTypeList")); const personTypeList = JSON.parse(window.sessionStorage.getItem("personTypeList"));
console.log("personTypeList", personTypeList);
let type = 0; let type = 0;
let personTypeName = ""; let personTypeName = "";
...@@ -749,12 +685,9 @@ const handleClickPerson = async item => { ...@@ -749,12 +685,9 @@ const handleClickPerson = async item => {
const arr = personTypeList.filter(item => { const arr = personTypeList.filter(item => {
return item.typeId === res.data.personType; return item.typeId === res.data.personType;
}); });
console.log("arr", arr);
if (arr && arr.length > 0) { if (arr && arr.length > 0) {
personTypeName = arr[0].typeName; personTypeName = arr[0].typeName;
console.log("personTypeName", personTypeName);
if (personTypeName === "科技企业领袖") { if (personTypeName === "科技企业领袖") {
type = 1; type = 1;
} else if (personTypeName === "国会议员") { } else if (personTypeName === "国会议员") {
...@@ -1551,12 +1484,11 @@ onMounted(async () => { ...@@ -1551,12 +1484,11 @@ onMounted(async () => {
position: absolute; position: absolute;
right: -13px; right: -13px;
top: -10px; top: -10px;
padding: 0 8px; padding: 4px 8px 6px;
height: 26px;
background-color: #FF4D4F; background-color: #FF4D4F;
color: white; color: white;
font-size: 16px; font-size: 16px;
line-height: 26px; line-height: 16px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
border-radius: 14px; border-radius: 14px;
letter-spacing: 1px; letter-spacing: 1px;
......
src/views/decree/decreeLayout/index.vue
浏览文件 @ 172383fa
...@@ -69,85 +69,14 @@ ...@@ -69,85 +69,14 @@
<router-view /> <router-view />
</div> </div>
</div> </div>
<!-- <div class="layout-report-box" v-if="activeName === '法案原文'">
<div class="report-close" @click="handleSwitchActiveName('分析报告')">
<img src="./assets/images/report-close-icon.png" alt="" />
</div>
<div class="report-main">
<div class="report-header">
<div class="report-header-left">
<div class="text">法案版本：</div>
<div class="select-box">
<el-select v-model="curBill" placeholder="选择法案" style="width: 240px">
<el-option v-for="item in billList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
</div>
<div class="report-header-right">
<div class="btn">
<div class="icon">
<img src="./assets/images/report-header-icon1.png" alt="" />
</div>
<div class="text">翻译</div>
</div>
<div class="btn">
<div class="icon">
<img src="./assets/images/report-header-icon2.png" alt="" />
</div>
<div class="text">下载</div>
</div>
<div class="btn">
<div class="icon">
<img src="./assets/images/report-header-icon3.png" alt="" />
</div>
<div class="text">对比</div>
</div>
<div class="btn">
<div class="icon">
<img src="./assets/images/report-header-icon4.png" alt="" />
</div>
<div class="text">查找</div>
</div>
</div>
</div>
<div class="report-content">
<div class="content-left">
<img src="./assets/images/report1.png" alt="" />
</div>
<div class="content-right">
<img src="./assets/images/report2.png" alt="" />
</div>
</div>
</div>
</div> -->
<!-- <div class="report" v-if="isShowReport">
<div class="report-close" @click="handleCloseReport">
<img src="@/assets/icons/close.png" alt="" />
</div>
<div class="report-header">
{{ "政令原文" }}
</div>
<div class="report-main">
<div class="left">
<div v-if="!reportUrl" class="noContent">{{ "中文原文暂无数据" }}</div>
<iframe v-else :src="reportUrl" style="border: none" width="100%" height="100%"> </iframe>
</div>
<div class="right">
<div v-if="!reportUrlEn" class="noContent">{{ "英文原文暂无数据" }}</div>
<iframe v-else :src="reportUrlEn" style="border: none" width="100%" height="100%"> </iframe>
</div>
</div>
</div> -->
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref, onMounted, onUnmounted } from "vue"; import { ref, onMounted } from "vue";
import router from "@/router"; import router from "@/router";
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
import { getDecreeSummary } from "@/api/decree/introduction"; import { getDecreeSummary } from "@/api/decree/introduction";
import { getDecreeReport } from "@/api/decree/introduction";
import search from "./assets/images/search.png";
import icon1 from "./assets/icons/icon1.svg"; import icon1 from "./assets/icons/icon1.svg";
import icon1Active from "./assets/icons/icon1_active.svg"; import icon1Active from "./assets/icons/icon1_active.svg";
...@@ -156,7 +85,6 @@ import icon2Active from "./assets/icons/icon2_active.svg"; ...@@ -156,7 +85,6 @@ import icon2Active from "./assets/icons/icon2_active.svg";
import icon3 from "./assets/icons/icon3.svg"; import icon3 from "./assets/icons/icon3.svg";
import icon3Active from "./assets/icons/icon3_active.svg"; import icon3Active from "./assets/icons/icon3_active.svg";
import USALogo from "./assets/images/USA-logo.png"; import USALogo from "./assets/images/USA-logo.png";
import DefaultIcon2 from "@/assets/icons/default-icon2.png";
const route = useRoute(); const route = useRoute();
...@@ -224,28 +152,8 @@ const handleGetSummary = async () => { ...@@ -224,28 +152,8 @@ const handleGetSummary = async () => {
} }
} catch (error) {} } catch (error) {}
document.title = pageTitle; document.title = pageTitle;
window.sessionStorage.setItem("curTabName", pageTitle);
}; };
// 获取报告原文
// const reportUrl = ref("");
// const reportUrlEn = ref("");
// const handleGetReport = async () => {
// try {
// const res = await getDecreeReport({id: route.query.id});
// console.log("报告原文", res);
// if (res.code === 200 && res.data) {
// reportUrl.value = res.data.content;
// reportUrlEn.value = res.data.contentEn;
// }
// } catch (error) {}
// };
// const isShowReport = ref(false);
// const handleCloseReport = () => {
// isShowReport.value = false;
// };
const handleShowReport = () => { const handleShowReport = () => {
const curRoute = router.resolve({ const curRoute = router.resolve({
path: "/decree/decreeOriginal", path: "/decree/decreeOriginal",
...@@ -291,7 +199,6 @@ onMounted(() => { ...@@ -291,7 +199,6 @@ onMounted(() => {
} else if (route.path === "/decreeLayout/influence") { } else if (route.path === "/decreeLayout/influence") {
activeTitle.value = "影响分析"; activeTitle.value = "影响分析";
} }
// handleGetReport();
}); });
</script> </script>
...@@ -312,20 +219,6 @@ onMounted(() => { ...@@ -312,20 +219,6 @@ onMounted(() => {
height: 100%; height: 100%;
background: #f7f8f9; background: #f7f8f9;
.report-close {
position: absolute;
top: 20px;
right: 230px;
width: 20px;
height: 20px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.report-header { .report-header {
width: 100%; width: 100%;
height: 50px; height: 50px;
...@@ -639,130 +532,5 @@ onMounted(() => { ...@@ -639,130 +532,5 @@ onMounted(() => {
background-color: #f7f8f9; background-color: #f7f8f9;
} }
} }
.layout-report-box {
position: absolute;
z-index: 9999;
top: 154px;
left: 0;
width: 100%;
height: 926px;
background: rgba(248, 249, 250, 1);
.report-close {
position: absolute;
top: 24px;
right: 178px;
width: 32px;
height: 32px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.report-main {
width: 1600px;
height: 926px;
margin: 0 auto;
background: #fff;
box-sizing: border-box;
padding: 0 69px;
.report-header {
height: 77px;
border-bottom: 1px solid rgba(240, 242, 244, 1);
display: flex;
justify-content: space-between;
.report-header-left {
display: flex;
.text {
margin-top: 32px;
width: 70px;
height: 14px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
line-height: 14px;
}
.select-box {
margin-left: 8px;
margin-top: 23px;
}
}
.report-header-right {
display: flex;
margin-top: 24px;
.btn {
display: flex;
width: 88px;
height: 32px;
margin-left: 8px;
box-sizing: border-box;
border: 1px solid rgba(230, 231, 232, 1);
border-radius: 4px;
background: rgba(255, 255, 255, 1);
display: flex;
justify-content: center;
align-items: center;
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
margin-left: 8px;
height: 32px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 32px;
}
}
}
}
.report-content {
display: flex;
margin-top: 35px;
.content-left {
width: 680px;
height: 786px;
img {
width: 100%;
height: 100%;
}
}
.content-right {
margin-left: 89px;
width: 680px;
height: 786px;
img {
width: 100%;
height: 100%;
}
}
}
}
}
} }
</style> </style>
\ No newline at end of file
src/views/marketAccessRestrictions/com/SurveyHistory.vue
浏览文件 @ 172383fa
...@@ -48,7 +48,6 @@ const props = defineProps({ ...@@ -48,7 +48,6 @@ const props = defineProps({
}) })
const onNavigateToDetail = item => { const onNavigateToDetail = item => {
window.sessionStorage.setItem("curTabName", item.searchname);
const curRoute = router.resolve({ const curRoute = router.resolve({
path: "/marketSingleCaseLayout/overview", path: "/marketSingleCaseLayout/overview",
query: { id: item.sortcode, searchId: item.searchid } query: { id: item.sortcode, searchId: item.searchid }
......
src/views/marketAccessRestrictions/marketAccessHome/com/CarouselItem232.vue 0 → 100644
浏览文件 @ 172383fa
<template>
<div class="box-text-box">
<div class="box-text-item">
<div class="box-text-left">{{ "启动时间：" }}</div>
<div class="box-text-right one-line-ellipsis">{{ props.baseInfo.searchnum }}</div>
</div>
<div class="box-text-item">
<div class="box-text-left">{{ "调查概括：" }}</div>
<div class="box-text-right two-line-ellipsis">{{ props.baseInfo.product }}</div>
</div>
<div class="box-text-item">
<div class="box-text-left">{{ "调查阶段：" }}</div>
<div class="box-text-right one-line-ellipsis">{{ props.baseInfo.plaintiff }}</div>
</div>
<div class="box-text-item">
<div class="box-text-left">{{ "调查范围：" }}</div>
<div class="box-text-right five-line-ellipsis">{{ props.baseInfo.defendant }}</div>
</div>
</div>
</template>
<script setup name="CarouselItem337">
const props = defineProps({
baseInfo: {
type: Object,
default: () => ({})
}
})
</script>
<style scoped lang="scss">
.box-text-box {
width: 100%;
padding: 20px 20px 0;
height: 185px;
.box-text-item {
display: flex;
align-items: flex-start;
line-height: 30px;
margin-bottom: 8px;
&::before {
content: "";
width: 4px;
height: 4px;
border-radius: 2px;
background: rgba(59, 65, 75, 1);
margin-top: 16px;
margin-right: 12px;
}
.box-text-left {
height: 30px;
width: 100px;
color: rgba(59, 65, 75, 1);
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 700;
}
.box-text-right {
min-height: 30px;
width: 20px;
flex: auto;
color: rgba(59, 65, 75, 1);
font-family: Source Han Sans CN;
font-size: 16px;
}
.two-line-ellipsis {
max-height: 60px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal;
}
.five-line-ellipsis {
max-height: 150px;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal;
}
}
}
</style>
\ No newline at end of file
src/views/marketAccessRestrictions/marketAccessHome/com/CarouselItem301.vue 0 → 100644
浏览文件 @ 172383fa
<template>
<div class="box-blue-box">
<div class="box-blue-name">
<div class="box-blue-time">{{ props.baseInfo.progressdate }}</div>
<div class="box-blue-time">{{ props.baseInfo.progressresult }}</div>
</div>
<div class="box-blue-text one-line-ellipsis">{{ props.baseInfo.progressdetails }}</div>
</div>
<div class="box-text-box">
<div class="box-text-item">
<div class="box-text-left">{{ "启动时间：" }}</div>
<div class="box-text-right one-line-ellipsis">{{ props.baseInfo.searchnum }}</div>
</div>
<div class="box-text-item">
<div class="box-text-left">{{ "调查对象：" }}</div>
<div class="box-text-right one-line-ellipsis">{{ props.baseInfo.product }}</div>
</div>
<div class="box-text-item">
<div class="box-text-left">{{ "调查状态：" }}</div>
<div class="box-text-right one-line-ellipsis">{{ props.baseInfo.plaintiff }}</div>
</div>
<div class="box-text-item">
<div class="box-text-left">{{ "请愿方：" }}</div>
<div class="box-text-right three-line-ellipsis">{{ props.baseInfo.product }}</div>
</div>
</div>
</template>
<script setup name="CarouselItem337">
const props = defineProps({
baseInfo: {
type: Object,
default: () => ({})
}
})
</script>
<style scoped lang="scss">
.box-blue-box {
width: 100%;
padding: 0 20px 10px;
border: 1px solid rgba(231, 243, 255, 1);
border-radius: 4px;
background: rgba(246, 250, 255, 1);
.box-blue-name {
height: 38px;
display: flex;
align-items: center;
font-weight: bold;
font-family: Source Han Sans CN;
font-size: 16px;
line-height: 24px;
color: var(--text-primary-80-color);
&::before {
content: "";
width: 4px;
height: 4px;
border-radius: 2px;
background: var(--text-primary-80-color);
margin-right: 12px;
}
.box-blue-time {
height: 24px;
width: 100px;
}
}
.box-blue-text {
padding-left: 18px;
height: 30px;
color: rgba(59, 65, 75, 1);
font-family: Source Han Sans CN;
font-size: 16px;
line-height: 30px;
}
}
.box-text-box {
width: 100%;
padding: 20px 20px 0;
height: 185px;
.box-text-item {
display: flex;
align-items: flex-start;
line-height: 30px;
margin-bottom: 8px;
&::before {
content: "";
width: 4px;
height: 4px;
border-radius: 2px;
background: rgba(59, 65, 75, 1);
margin-top: 16px;
margin-right: 12px;
}
.box-text-left {
height: 30px;
width: 100px;
color: rgba(59, 65, 75, 1);
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 700;
}
.box-text-right {
min-height: 30px;
width: 20px;
flex: auto;
color: rgba(59, 65, 75, 1);
font-family: Source Han Sans CN;
font-size: 16px;
}
.three-line-ellipsis {
max-height: 90px;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal;
}
}
}
</style>
\ No newline at end of file
src/views/marketAccessRestrictions/marketAccessHome/com/CarouselItem337.vue 0 → 100644
浏览文件 @ 172383fa
<template>
<div class="box-blue-box">
<div class="box-blue-name">
<div class="box-blue-time">{{ props.baseInfo.progressdate }}</div>
<div class="box-blue-time">{{ props.baseInfo.progressresult }}</div>
</div>
<div class="box-blue-text">{{ props.baseInfo.progressdetails }}</div>
</div>
<div class="box-text-box">
<div class="box-text-item">
<div class="box-text-left">{{ "调查案号：" }}</div>
<div class="box-text-right one-line-ellipsis">{{ props.baseInfo.searchnum }}</div>
</div>
<div class="box-text-item">
<div class="box-text-left">{{ "涉及产品：" }}</div>
<div class="box-text-right one-line-ellipsis">{{ props.baseInfo.product }}</div>
</div>
<div class="box-text-item">
<div class="box-text-left">{{ "原告：" }}</div>
<div class="box-text-right one-line-ellipsis">{{ props.baseInfo.plaintiff }}</div>
</div>
<div class="box-text-item">
<div class="box-text-left">{{ "被告：" }}</div>
<div class="box-text-right one-line-ellipsis">{{ props.baseInfo.defendant }}</div>
</div>
<div class="box-text-item">
<div class="box-text-left">{{ "涉案专利：" }}</div>
<div class="box-text-right one-line-ellipsis">{{ props.baseInfo.patent }}</div>
</div>
</div>
</template>
<script setup name="CarouselItem337">
const props = defineProps({
baseInfo: {
type: Object,
default: () => ({})
}
})
</script>
<style scoped lang="scss">
.box-blue-box {
width: 100%;
padding: 0 20px 10px;
border: 1px solid rgba(231, 243, 255, 1);
border-radius: 4px;
background: rgba(246, 250, 255, 1);
.box-blue-name {
height: 38px;
display: flex;
align-items: center;
font-weight: bold;
font-family: Source Han Sans CN;
font-size: 16px;
line-height: 24px;
color: var(--text-primary-80-color);
&::before {
content: "";
width: 4px;
height: 4px;
border-radius: 2px;
background: var(--text-primary-80-color);
margin-right: 12px;
}
.box-blue-time {
height: 24px;
width: 100px;
}
}
.box-blue-text {
padding-left: 18px;
height: 60px;
color: rgba(59, 65, 75, 1);
font-family: Source Han Sans CN;
font-size: 16px;
line-height: 30px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal;
}
}
.box-text-box {
width: 100%;
padding: 20px 20px 0;
height: 185px;
.box-text-item {
display: flex;
align-items: flex-start;
line-height: 30px;
margin-bottom: 8px;
&::before {
content: "";
width: 4px;
height: 4px;
border-radius: 2px;
background: rgba(59, 65, 75, 1);
margin-top: 16px;
margin-right: 12px;
}
.box-text-left {
height: 30px;
width: 100px;
color: rgba(59, 65, 75, 1);
font-family: Source Han Sans CN;
font-size: 16px;
font-weight: 700;
}
.box-text-right {
min-height: 30px;
width: 20px;
flex: auto;
color: rgba(59, 65, 75, 1);
font-family: Source Han Sans CN;
font-size: 16px;
}
}
}
</style>
\ No newline at end of file
src/views/marketAccessRestrictions/marketAccessHome/utils/barChart1.js
浏览文件 @ 172383fa
...@@ -5,10 +5,12 @@ const getBarChart = (nameList, valueList) => { ...@@ -5,10 +5,12 @@ const getBarChart = (nameList, valueList) => {
const option = { const option = {
tooltip: {}, tooltip: {},
grid: { grid: {
top: '8%', width: '100%',
right: 24, height: '83%',
bottom: 24, top: '15%',
left: 24, right: '5%',
bottom: '2%',
left: '1%',
containLabel: true containLabel: true
}, },
yAxis: { yAxis: {
......
src/views/marketAccessRestrictions/marketAccessHome/utils/multiLineChart.js
浏览文件 @ 172383fa
import * as echarts from 'echarts' import * as echarts from 'echarts'
const getMultiLineChart = (data) => { const getMultiLineChart = (data) => {
console.log('dataaaa', data);
return { return {
tooltip: { tooltip: {
trigger: 'axis', trigger: 'item',
axisPointer: { axisPointer: {
type: 'cross', type: 'cross',
label: { label: {
...@@ -14,44 +12,79 @@ const getMultiLineChart = (data) => { ...@@ -14,44 +12,79 @@ const getMultiLineChart = (data) => {
} }
}, },
grid: { grid: {
top: 48, width: '95%',
right: 24, height: '83%',
bottom: 24, top: '15%',
left: 24, left: '1%',
containLabel: true containLabel: true
}, },
legend: { legend: {
show: true, show: true,
top: 10, top: 10,
left: '10%' icon: 'circle',
textStyle: {
color: 'rgba(95, 101, 108, 1)',
fontFamily: 'Microsoft YaHei',
fontSize: '14px',
}
}, },
color: ['#0A57A6', '#FA8C16', '#722ED1'], color: ['#0A57A6', '#FA8C16', '#722ED1'],
xAxis: [ xAxis: [
{ {
type: 'category', type: 'category',
boundaryGap: false, boundaryGap: false,
data: data.title data: data.title,
axisLine: {
show: true,
lineStyle: {
color: '#e7f3ff',
},
},
axisLabel: {
show: true,
textStyle: {
color: 'rgba(95, 101, 108, 1)',
fontFamily: 'Microsoft YaHei',
fontsize: 14,
}
}
} }
], ],
yAxis: [ yAxis: [
{ {
type: 'value', type: 'value',
position: 'left',
name: '数量', name: '数量',
nameLocation: 'end',
nameGap: 12,
nameTextStyle: {
color: '#666',
fontSize: 14,
fontWeight: 400,
padding: [0, 0, 6, -20]
},
axisLabel: {
formatter: '{value}',
color: '#666',
fontSize: 14,
fontWeight: 400
},
splitLine: { splitLine: {
show: true, show: true,
lineStyle: { lineStyle: {
type: 'dashed', // 虚线类型 color: '#e7f3ff',
color: 'rgb(231, 243, 255)', // 灰色线条 type: 'dashed',
width: 1 // 线宽为1
}
} }
},
} }
], ],
series: [ series: [
{ {
name: data.data[0]?.name, name: data.data[0]?.name,
type: 'line', type: 'line',
smooth: true,
symbol: 'emptyCircle',
symbolSize: 6,
areaStyle: { areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0, offset: 0,
...@@ -69,6 +102,9 @@ const getMultiLineChart = (data) => { ...@@ -69,6 +102,9 @@ const getMultiLineChart = (data) => {
{ {
name: data.data[1]?.name, name: data.data[1]?.name,
type: 'line', type: 'line',
smooth: true,
symbol: 'emptyCircle',
symbolSize: 6,
areaStyle: { areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0, offset: 0,
...@@ -86,6 +122,9 @@ const getMultiLineChart = (data) => { ...@@ -86,6 +122,9 @@ const getMultiLineChart = (data) => {
{ {
name: data.data[2]?.name, name: data.data[2]?.name,
type: 'line', type: 'line',
smooth: true,
symbol: 'emptyCircle',
symbolSize: 6,
areaStyle: { areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0, offset: 0,
......
src/views/marketAccessRestrictions/marketAccessLayout/case/337/index.vue
浏览文件 @ 172383fa
...@@ -200,8 +200,8 @@ const handleFetchSurveyList = async () => { ...@@ -200,8 +200,8 @@ const handleFetchSurveyList = async () => {
publishYear: checkedYearList.value.join(',') || null, publishYear: checkedYearList.value.join(',') || null,
Area: checkedAreaList.value.join(',') || null, Area: checkedAreaList.value.join(',') || null,
searchCountry: checkedCountryList.value.join(',') || null, searchCountry: checkedCountryList.value.join(',') || null,
caseStatus: filterStage.value ? filterStage.value : null, caseStatus: filterStage.value || null,
keywords: searchText.value ? searchText.value : null, keywords: searchText.value || null,
sortField: "date", sortField: "date",
sortOrder: isSort.value ? "asc" : "desc" sortOrder: isSort.value ? "asc" : "desc"
}; };
......
src/views/marketAccessRestrictions/marketAccessLayout/index.vue
浏览文件 @ 172383fa
...@@ -3,11 +3,11 @@ ...@@ -3,11 +3,11 @@
<div class="page-top"> <div class="page-top">
<div class="head-box"> <div class="head-box">
<div class="head-icon"> <div class="head-icon">
<img :src="curSurvey.image" alt="" /> <img :src="codeInfo.sortImageUrl || Img337" alt="" />
</div> </div>
<div class="head-info"> <div class="head-info">
<div class="head-name one-line-ellipsis">{{ curSurvey.title }}</div> <div class="head-name one-line-ellipsis">{{ codeInfo.sortName }}</div>
<div class="head-text one-line-ellipsis">{{ curSurvey.desc }}</div> <div class="head-text one-line-ellipsis">{{ codeInfo.sortDescription }}</div>
</div> </div>
<!-- <div class="head-button"> <!-- <div class="head-button">
<div class="button-icon"> <div class="button-icon">
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
</template> </template>
<script setup> <script setup>
import { ref, computed, onMounted } from "vue"; import { ref, onMounted, reactive } from "vue";
import router from "@/router/index"; import router from "@/router/index";
import icon1 from "./assets/icons/icon1.svg"; import icon1 from "./assets/icons/icon1.svg";
import icon1Active from "./assets/icons/icon1_active.svg"; import icon1Active from "./assets/icons/icon1_active.svg";
...@@ -44,6 +44,7 @@ import icon2Active from "./assets/icons/icon2_active.svg"; ...@@ -44,6 +44,7 @@ import icon2Active from "./assets/icons/icon2_active.svg";
import Img337 from "./assets/images/337.png"; import Img337 from "./assets/images/337.png";
import Img232 from "./assets/images/232.png"; import Img232 from "./assets/images/232.png";
import Img301 from "./assets/images/301.png"; import Img301 from "./assets/images/301.png";
import { getSurvyInfo } from "@/api/marketAccessRestrictions/index.js"
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
const route = useRoute(); const route = useRoute();
...@@ -63,27 +64,23 @@ const tabList = ref([ ...@@ -63,27 +64,23 @@ const tabList = ref([
} }
]); ]);
const curSurvey = computed(() => { const curSurvey = [
if (route.query.id === "301") { {
return {
title: "301调查", title: "301调查",
desc: '由美国贸易代表办公室依据《1974年贸易法》第301条针对"不合理或不公正贸易做法"发起的调查', desc: '由美国贸易代表办公室依据《1974年贸易法》第301条针对"不合理或不公正贸易做法"发起的调查',
image: Img301, image: Img301,
}; },
} else if (route.query.id === "232") { {
return {
title: "232调查", title: "232调查",
desc: "依据《1962年贸易扩展法》第232条款，授权美国商务部对“特定进口产品是否威胁或损害美国国家安全”而开展的全面调查。", desc: "依据《1962年贸易扩展法》第232条款，授权美国商务部对“特定进口产品是否威胁或损害美国国家安全”而开展的全面调查。",
image: Img232, image: Img232,
}; },
} else { {
return {
title: "337调查", title: "337调查",
desc: '美国国际贸易委员会根据《1930年关税法》第337节及相关修正案进行的调查，主要针对进口贸易中的知识产权侵权行为以及其他不公平竞争行为', desc: '美国国际贸易委员会根据《1930年关税法》第337节及相关修正案进行的调查，主要针对进口贸易中的知识产权侵权行为以及其他不公平竞争行为',
image: Img337, image: Img337,
};
} }
}); ]
const activeName = ref("调查案件"); const activeName = ref("调查案件");
const handleClickBtn = item => { const handleClickBtn = item => {
...@@ -94,7 +91,23 @@ const handleClickBtn = item => { ...@@ -94,7 +91,23 @@ const handleClickBtn = item => {
}); });
}; };
const codeInfo = reactive({
sortCode: route.query.id,
sortName: "调查主页",
sortImageUrl: "",
sortDescription: "",
})
const onSurvyInfo = async () => {
const res = await getSurvyInfo({sortCode: route.query.id})
console.log("调查分类信息", res)
if (res.code == 200) {
Object.assign(codeInfo, res.data)
}
document.title = codeInfo.sortName;
}
onMounted(() => { onMounted(() => {
onSurvyInfo()
if (route.path === "/marketAccessLayout/overview") { if (route.path === "/marketAccessLayout/overview") {
activeName.value = "数据统计"; activeName.value = "数据统计";
} else { } else {
...@@ -141,6 +154,7 @@ onMounted(() => { ...@@ -141,6 +154,7 @@ onMounted(() => {
line-height: 26px; line-height: 26px;
} }
.head-text { .head-text {
margin-top: 4px;
width: 100%; width: 100%;
height: 24px; height: 24px;
color: rgba(95, 101, 108, 1); color: rgba(95, 101, 108, 1);
......
src/views/marketAccessRestrictions/singleCaseLayout/index.vue
浏览文件 @ 172383fa
...@@ -3,13 +3,13 @@ ...@@ -3,13 +3,13 @@
<div class="page-top"> <div class="page-top">
<div class="head-box"> <div class="head-box">
<div class="head-icon"> <div class="head-icon">
<img :src="curSurvey.image" alt="" /> <img :src="codeInfo.sortImageUrl || Img337" alt="" />
</div> </div>
<div class="head-info"> <div class="head-info">
<div class="head-name one-line-ellipsis">{{ curSurvey.title }}</div> <div class="head-name one-line-ellipsis">{{ baseInfo.SEARCHNAME }}</div>
<div class="head-text">{{ curSurvey.time }}</div> <div class="head-text">{{ baseInfo.SEARCHDATE }}</div>
</div> </div>
<div :class="`item-tag tag-${curSurvey.name}`">{{ curSurvey.name }}调查</div> <div :class="`item-tag tag-${codeInfo.sortCode}`">{{ codeInfo.sortName }}</div>
</div> </div>
<div class="page-tabs"> <div class="page-tabs">
<div :class="['tab-item', {'tab-active': activeName==item.name}]" v-for="(item, index) in tabList" :key="index" @click="handleClickBtn(item)"> <div :class="['tab-item', {'tab-active': activeName==item.name}]" v-for="(item, index) in tabList" :key="index" @click="handleClickBtn(item)">
...@@ -37,15 +37,14 @@ ...@@ -37,15 +37,14 @@
</template> </template>
<script setup> <script setup>
import { ref, onMounted, computed } from "vue"; import { ref, onMounted, reactive } from "vue";
import router from "@/router"; import router from "@/router";
import NavIcon1 from "./assets/images/nav-icon1.png"; import NavIcon1 from "./assets/images/nav-icon1.png";
import NavIcon1Active from "./assets/images/nav-icon1-active.png"; import NavIcon1Active from "./assets/images/nav-icon1-active.png";
import NavIcon3 from "./assets/images/nav-icon2.png"; import NavIcon3 from "./assets/images/nav-icon2.png";
import NavIcon3Active from "./assets/images/nav-icon2-active.png"; import NavIcon3Active from "./assets/images/nav-icon2-active.png";
import Img337 from "./assets/images/337.png"; import Img337 from "./assets/images/337.png";
import Img232 from "./assets/images/232.png"; import { getSurvyInfo, getSearchBlurb } from "@/api/marketAccessRestrictions/index.js"
import Img301 from "./assets/images/301.png";
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
const route = useRoute(); const route = useRoute();
...@@ -64,39 +63,6 @@ const tabList = ref([ ...@@ -64,39 +63,6 @@ const tabList = ref([
} }
]); ]);
const surveyList = ref([
{
title: "337-TA-1443：外国制造的半导体器件及其下游产品和组件",
time: "2025年7月18日",
image: Img337,
name: "337"
},
{
title: "231-TA-1225：进口药及进口原材料的调查",
time: "2021年9月21日",
image: Img232,
name: "232"
},
{
title: "美国贸易代表第301条关于中国针对海事、物流和造船业以争取主导地位的行动",
time: "2025年4月17日",
image: Img301,
name: "301"
}
]);
const curSurvey = computed(() => {
let survey;
if (route.query.id === "232") {
survey = surveyList.value[1];
} else if (route.query.id === "301") {
survey = surveyList.value[2];
} else {
survey = surveyList.value[0];
}
return survey;
});
const activeName = ref("调查案件"); const activeName = ref("调查案件");
const handleClickBtn = item => { const handleClickBtn = item => {
activeName.value = item.name; activeName.value = item.name;
...@@ -106,8 +72,36 @@ const handleClickBtn = item => { ...@@ -106,8 +72,36 @@ const handleClickBtn = item => {
}); });
}; };
const codeInfo = reactive({
sortCode: route.query.id,
sortName: "",
sortImageUrl: "",
})
const onSurvyInfo = async () => {
const res = await getSurvyInfo({sortCode: route.query.id})
console.log("调查分类信息", res)
if (res.code == 200) {
Object.assign(codeInfo, res.data)
}
}
const baseInfo = reactive({
SEARCHNAME: "调查详情",
SEARCHDATE: "",
})
const onSearchBlurb = async () => {
const res = await getSearchBlurb({sortCode: route.query.id, searchId: route.query.searchId})
console.log("调查简介", res)
if (res.code == 200) {
baseInfo.SEARCHNAME = res.data.SEARCHNAME
baseInfo.SEARCHDATE = res.data.SEARCHDATE
}
document.title = baseInfo.SEARCHNAME;
}
onMounted(() => { onMounted(() => {
console.log('route', route); onSurvyInfo()
onSearchBlurb()
if (route.path === "/marketSingleCaseLayout/deepdig") { if (route.path === "/marketSingleCaseLayout/deepdig") {
activeName.value = "影响分析"; activeName.value = "影响分析";
} else { } else {
...@@ -154,6 +148,7 @@ onMounted(() => { ...@@ -154,6 +148,7 @@ onMounted(() => {
line-height: 26px; line-height: 26px;
} }
.head-text { .head-text {
margin-top: 4px;
width: 100%; width: 100%;
height: 24px; height: 24px;
color: rgba(95, 101, 108, 1); color: rgba(95, 101, 108, 1);
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论