Skip to content

R
risk-monitor
提交 446e7af5 authored 作者: 朱政's avatar 朱政
浏览文件
操作

feat:合作限制概览页详情页功能以及样式开发，智库折线图横坐标样式修改

上级 75b87091
流水线 #206 已通过 于阶段
    in 1 分 32 秒
    全部展开 隐藏空白字符变更
    内嵌 并排
    正在显示 包含 147 行增加 和 69 行删除
    src/views/coopRestriction/components/askPage/index.vue
    浏览文件 @ 446e7af5
    ......@@ -25,8 +25,8 @@
    </div>
    </div>
    </div> -->
    <NewsList :newsList="leftList" @item-click="handleToNewsDetail" @more-click="handleToMoreNews" img="image"
    title="title" content="content" from="from" />
    <NewsList :newsList="leftList" @item-click="item => gotoNewsDetail(item.id)" @more-click="handleToMoreNews"
    img="image" title="title" content="content" from="from" />
    <MessageBubble :messageList="rightList" imageUrl="personImage" @more-click="handleToSocialDetail"
    @person-click="handleToSocialDetail" name="name" content="content" source="orgName" image-url="image" />
    <!-- <div class="right">
    ......@@ -60,6 +60,8 @@ import title03 from './assets/title03.png'
    import title01bg from './assets/title01bg.png'
    import title02bg from './assets/title02bg.png'
    import title03bg from './assets/title03bg.png'
    import { useGotoNewsDetail } from '@/router/modules/news';
    const gotoNewsDetail = useGotoNewsDetail()
    // 合作限制-查询社交媒体接口
    const getCoopRestrictionSocialData = async () => {
    ......
    src/views/coopRestriction/components/dataNew/index.vue
    浏览文件 @ 446e7af5
    ......@@ -12,50 +12,52 @@
    <el-carousel ref="carouselRef" height="412px" direction="horizontal" :autoplay="true" :interval="5000"
    arrow="never" indicator-position="none" @change="handleCarouselChange">
    <el-carousel-item v-for="(item, index) in coopRestrictionTrends" :key="item.ID || index">
    <div class="carousel-item-content">
    <div class="left-center">
    <img :src="item.IMAGEURL || defaultImg" alt="" />
    <div class="left-center-main">
    <div class="left-center-main-title">{{ item.LIMITNAME || "暂无动态" }}</div>
    <div class="left-center-main-ul">
    <ul>
    <li>
    <span class="ul-title">数据来源：</span>
    <span class="ul-content">{{ item.ORGNAME || "未知" }}</span>
    </li>
    <li>
    <span class="ul-title">合作限制类型：</span>
    <span class="ul-content">{{ item.LIMITTYPE || "未知" }}</span>
    </li>
    <li>
    <span class="ul-title">发布日期：</span>
    <span class="ul-content">{{ item.LIMITDATE || "未知" }}</span>
    </li>
    <li>
    <span class="ul-title">涉及领域：</span>
    <div class="ul-tags" v-if="item.AREA">
    <span v-for="(field, fIndex) in typeof item.AREA === 'string'
    ? item.AREA.split(',')
    : item.AREA" :key="fIndex" class="ul-pie" :class="'cl' + ((fIndex % 3) + 1)">
    {{ field }}
    </span>
    </div>
    <span v-else class="ul-content">未知</span>
    </li>
    </ul>
    </div>
    <div class="left-center">
    <img :src="item.IMAGEURL || defaultImg" alt="" />
    <div class="left-center-main">
    <div class="left-center-main-title">{{ item.LIMITNAME || "暂无动态" }}</div>
    <div class="left-center-main-ul">
    <ul>
    <li>
    <span class="ul-title">数据来源：</span>
    <span class="ul-content">{{ item.ORGNAME || "未知" }}</span>
    </li>
    <li>
    <span class="ul-title">合作限制类型：</span>
    <span class="ul-content">{{ item.LIMITTYPE || "未知" }}</span>
    </li>
    <li>
    <span class="ul-title">发布日期：</span>
    <span class="ul-content">{{ item.LIMITDATE || "未知" }}</span>
    </li>
    <li>
    <span class="ul-title">涉及领域：</span>
    <div class="ul-tags" v-if="item.AREA">
    <span v-for="(field, fIndex) in typeof item.AREA === 'string'
    ? item.AREA.split(',')
    : item.AREA" :key="fIndex" class="ul-pie" :class="'cl' + ((fIndex % 3) + 1)">
    {{ field }}
    </span>
    </div>
    <span v-else class="ul-content">未知</span>
    </li>
    </ul>
    </div>
    <!-- <div class="left-center-title">{{ item.LIMITTYPE }}</div> -->
    </div>
    <div class="left-bottom">
    <ul>
    <li class="left-bottom-li">内容摘要：</li>
    </ul>
    <div class="left-bottom-content">
    {{ item.INTRODUCTION || "暂无内容摘要" }}
    </div>
    <div class="left-center-type" v-if="item.type">{{ item.type }}</div>
    <!-- <div class="left-center-title">{{ item.LIMITTYPE }}</div> -->
    </div>
    <div class="left-bottom">
    <ul>
    <li class="left-bottom-li">内容摘要：</li>
    </ul>
    <div class="left-bottom-content">
    {{ item.INTRODUCTION || "暂无内容摘要" }}
    </div>
    </div>
    </el-carousel-item>
    <!-- 无数据时的占位展示 -->
    ......@@ -108,6 +110,7 @@
    查看更多
    </div>
    </div> -->
    <RiskSignal :list="riskSignals" @more-click="handleToMoreRiskSignal" postDate="time" name="content"
    riskLevel="title" @item-click="handleClickToDetail" />
    </div>
    ......@@ -233,7 +236,7 @@ onMounted(() => {
    .left {
    width: 1064px;
    height: 460px;
    height: 450px;
    margin-right: 16px;
    border-radius: 10px;
    background-color: #fff;
    ......@@ -330,6 +333,7 @@ onMounted(() => {
    .left-center-main {
    width: 439px;
    height: 175px;
    position: relative;
    .left-center-main-title {
    margin-left: 19px;
    ......@@ -420,6 +424,29 @@ onMounted(() => {
    }
    }
    }
    }
    .left-center-type {
    position: absolute;
    top: 0;
    right: 0;
    height: 32px;
    font-family: "Source Han Sans CN";
    font-weight: 700;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 0px;
    text-align: left;
    color: rgb(5, 95, 194);
    background-color: rgb(231, 243, 255);
    align-items: center;
    border-radius: 4px;
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 3px;
    padding-bottom: 5px;
    }
    .left-center-title {
    ......@@ -439,7 +466,7 @@ onMounted(() => {
    }
    .left-bottom {
    margin: 17px 0 0 62px;
    margin: 17px 0 0 59px;
    ul {
    list-style-position: inside;
    ......
    src/views/coopRestriction/index.vue
    浏览文件 @ 446e7af5
    ......@@ -15,7 +15,8 @@
    <div class="main-content" ref="homeMainRef" :class="{ 'scroll-main': isShow }">
    <div class="home-top-bg"></div>
    <!-- 搜索栏部分 -->
    <SearchContainer v-if="homeMainRef" placeholder="搜索合作限制" :containerRef="homeMainRef" areaName="" />
    <SearchContainer v-if="homeMainRef" :countInfo="cooperationCountInfo" placeholder="搜索合作限制"
    :containerRef="homeMainRef" areaName="" />
    <!-- 最新动态 -->
    <div class="newdata" id="position1">
    ......@@ -57,9 +58,36 @@ import newData from "./components/dataNew/index.vue";
    import askPage from "./components/askPage/index.vue";
    import dataSub from "./components/dataSub/index.vue";
    import resLib from "./components/resLib/index.vue";
    import { getCoopRestrictionStatistics } from "@/api/coopRestriction/coopRestriction.js";
    import { useContainerScroll } from "@/hooks/useScrollShow";
    const cooperationCountInfo = ref([]);
    // const
    const getCooperationCountInfo = async () => {
    try {
    const res = await getCoopRestrictionStatistics();
    if (res && res.code === 200) {
    // console.log('----getStatCountInfo', res.data)
    cooperationCountInfo.value = [
    {
    name: "相关法案",
    count: res.data.billCounts
    },
    {
    name: "相关政令",
    count: res.data.aocounts
    },
    {
    name: "相关政府公告",
    count: res.data.ggcounts
    },
    ];
    }
    } catch (error) {
    console.error("获取首页统计接口失败:", error);
    }
    };
    // 搜索框
    const input = ref("");
    const homeMainRef = ref(null);
    ......@@ -71,7 +99,9 @@ const router = useRouter();
    const handleSearch = () => {
    console.log("搜索内容：", input.value);
    };
    onMounted(() => {
    getCooperationCountInfo();
    });
    // 锚点跳转
    const handleToPosi = id => {
    const element = document.getElementById(id);
    ......@@ -106,6 +136,7 @@ const handleToPosi = id => {
    .coop-page {
    width: 100%;
    height: 100%;
    display: flex;
    // .breadcrumb {
    // width: 100%;
    // height: 64px;
    ......@@ -138,6 +169,12 @@ const handleToPosi = id => {
    top: -64px;
    }
    :deep(.search-container .search-center) {
    width: 440px;
    gap: 40px;
    justify-content: center;
    }
    .search {
    width: 960px;
    height: 168px;
    ......@@ -467,8 +504,6 @@ const handleToPosi = id => {
    }
    }
    .scroll-main {
    height: calc(100% - 144px) !important;
    }
    }
    </style>
    src/views/thinkTank/components/HomeMainFooterMain.vue
    浏览文件 @ 446e7af5
    ......@@ -7,18 +7,11 @@
    <div class="title">{{ "科技领域" }}</div>
    </div>
    <div class="select-main">
    <el-checkbox-group
    class="checkbox-group"
    :model-value="selectedAreaList"
    @change="handleAreaGroupChange">
    <el-checkbox-group class="checkbox-group" :model-value="selectedAreaList" @change="handleAreaGroupChange">
    <el-checkbox class="filter-checkbox all-checkbox" :label="RESOURCE_FILTER_ALL_AREA">
    {{ RESOURCE_FILTER_ALL_AREA }}
    </el-checkbox>
    <el-checkbox
    v-for="research in areaList"
    :key="research.id"
    class="filter-checkbox"
    :label="research.id">
    <el-checkbox v-for="research in areaList" :key="research.id" class="filter-checkbox" :label="research.id">
    {{ research.name }}
    </el-checkbox>
    </el-checkbox-group>
    ......@@ -31,18 +24,11 @@
    <div class="title">{{ "发布时间" }}</div>
    </div>
    <div class="select-main">
    <el-checkbox-group
    class="checkbox-group"
    :model-value="selectedPubTimeList"
    @change="handleTimeGroupChange">
    <el-checkbox-group class="checkbox-group" :model-value="selectedPubTimeList" @change="handleTimeGroupChange">
    <el-checkbox class="filter-checkbox all-checkbox" :label="RESOURCE_FILTER_ALL_TIME">
    {{ RESOURCE_FILTER_ALL_TIME }}
    </el-checkbox>
    <el-checkbox
    v-for="time in pubTimeList"
    :key="time.id"
    class="filter-checkbox"
    :label="time.id">
    <el-checkbox v-for="time in pubTimeList" :key="time.id" class="filter-checkbox" :label="time.id">
    {{ time.name }}
    </el-checkbox>
    </el-checkbox-group>
    ......
    src/views/thinkTank/utils/multiLineChart.js
    浏览文件 @ 446e7af5
    ......@@ -163,7 +163,35 @@ const getMultiLineChart = (data) => {
    {
    type: 'category',
    boundaryGap: false,
    data: title
    data: title,
    axisLabel: {
    // 同时设置 color 与 textStyle，避免 ECharts/主题在 axisLine/axisTick 展示时覆盖
    color: 'rgba(132, 136, 142, 1)',
    textStyle: {
    color: 'rgba(132, 136, 142, 1)',
    fontSize: 14,
    fontFamily: 'Source Han Sans CN',
    fontWeight: 400
    }
    },
    axisLine: {
    show: true,
    lineStyle: {
    color: 'rgba(231, 241, 255, 1)' // 你要的红色
    }
    },
    axisTick: {
    show: true,
    // 让刻度和 label 对齐，显示短直线
    alignWithLabel: true,
    length: 6,
    length2: 0,
    lineStyle: {
    color: "rgba(231, 241, 255, 1)",
    type: "solid"
    }
    },
    }
    ],
    yAxis: [
    ......
    Markdown 格式
    0% 或
    您添加了 0 人 到此讨论。请谨慎行事。
    请先完成此评论的编辑！
    请 注册 或者 后发表评论