Skip to content

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

feat:修改合作限制图表样式及下拉框样式，完善相关实体点击跳转对应页面功能

上级 0f54250a
流水线 #212 已通过 于阶段
    in 1 分 42 秒
    隐藏空白字符变更
    内嵌 并排
    正在显示 包含 109 行增加 和 28 行删除
    src/views/coopRestriction/components/dataSub/index.vue
    浏览文件 @ a5b56c23
    ......@@ -4,7 +4,8 @@
    <div class="left-title">
    <img src="./assets/icon01.png" alt="" />
    <div class="tit">各类型合作限制政策对比</div>
    <el-select v-model="value" placeholder="Select" class="select" @change="getCoopRestrictionCompareData">
    <el-select v-model="value" placeholder="Select" class="select" popper-class="coop-select-dropdown"
    @change="getCoopRestrictionCompareData">
    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
    </el-select>
    </div>
    ......@@ -34,7 +35,8 @@
    <div class="right-title">
    <img src="./assets/icon02.png" alt="" />
    <div class="tit">各领域规则分布情况</div>
    <el-select v-model="value1" placeholder="Select" class="select" @change="getCoopRestrictionDomainData">
    <el-select v-model="value1" placeholder="Select" class="select" popper-class="coop-select-dropdown"
    @change="getCoopRestrictionDomainData">
    <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
    </el-select>
    </div>
    ......@@ -75,6 +77,22 @@ import AiPane from "@/components/base/Ai/AiPane/index.vue";
    const COOP_LEFT_TIP_TEXT = "各类型合作限制政策对比，数据来源：美对华科技合作限制信息平台";
    const COOP_RIGHT_TIP_TEXT = "各领域规则分布情况，数据来源：美对华科技合作限制信息平台";
    // 临时展示 mock（不改样式）：右侧“各领域规则分布情况”
    // 用完把这个开关改回 false 即可恢复走接口
    const USE_DOMAIN_MOCK = false;
    const MOCK_COOP_RESTRICTION_DOMAIN = [
    { COOPERTYPE: "科研合作", COOPERTYPECOUNT: 1, AREA: "人工智能" },
    { COOPERTYPE: "科研合作", COOPERTYPECOUNT: 1, AREA: "生物科技" },
    { COOPERTYPE: "技术合作", COOPERTYPECOUNT: 2, AREA: "大数据" },
    { COOPERTYPE: "产学研合作", COOPERTYPECOUNT: 3, AREA: "新能源" },
    { COOPERTYPE: "项目合作", COOPERTYPECOUNT: 1, AREA: "智能制造" },
    { COOPERTYPE: "人才合作", COOPERTYPECOUNT: 2, AREA: "集成电路" },
    { COOPERTYPE: "科研合作", COOPERTYPECOUNT: 2, AREA: "大数据" },
    { COOPERTYPE: "科研合作", COOPERTYPECOUNT: 3, AREA: "新能源" },
    { COOPERTYPE: "科研合作", COOPERTYPECOUNT: 1, AREA: "智能制造" },
    { COOPERTYPE: "科研合作", COOPERTYPECOUNT: 2, AREA: "集成电路" }
    ];
    const value = ref(10);
    const value1 = ref("2025");
    const options = [
    ......@@ -109,6 +127,10 @@ const options1 = [
    const coopRestrictionDomain = ref([]);
    const getCoopRestrictionDomainData = async () => {
    if (USE_DOMAIN_MOCK) {
    coopRestrictionDomain.value = MOCK_COOP_RESTRICTION_DOMAIN;
    return;
    }
    try {
    const res = await getCoopRestrictionDomain({
    year: value1.value
    ......@@ -449,10 +471,18 @@ const initLeftChart = () => {
    const option = {
    color: colorMap.map((c) => c.line),
    grid: { left: 40, right: 24, top: 46, bottom: 36 },
    // 与智库概览「数量变化趋势」一致：预留图例空间，并用 containLabel 让轴文字不挤压绘图区
    grid: {
    top: "34%",
    right: "3%",
    bottom: "5%",
    left: "2%",
    containLabel: true
    },
    tooltip: { trigger: "axis", axisPointer: { type: "line" } },
    legend: {
    top: 8,
    left: "center",
    icon: "circle",
    itemWidth: 12,
    itemHeight: 12,
    ......@@ -572,6 +602,10 @@ const initRightChart = () => {
    const domains = Array.from(domainsSet);
    const types = Array.from(typesSet);
    const legendSplitAt = Math.ceil(types.length / 2);
    const legendFirstLine = types.slice(0, legendSplitAt);
    const legendSecondLine = types.slice(legendSplitAt);
    const indicators = domains.map((domain) => {
    const domainData = rawData.filter((item) => item.AREA === domain);
    const maxVal = Math.max(...domainData.map((d) => d.COOPERTYPECOUNT), 5);
    ......@@ -589,31 +623,56 @@ const initRightChart = () => {
    name: type,
    value: dataValues,
    itemStyle: { color: colorMap[index % colorMap.length] },
    // 不要填充多边形：让雷达图“圆里面是空的”
    // areaStyle 不设置（或设为 0）可避免穿透同心圆的填充效果
    // 雷达图围成区域填充：对应颜色 0.1 透明度
    areaStyle: { color: colorMap[index % colorMap.length], opacity: 0.1 }
    };
    });
    const option = {
    color: colorMap,
    legend: {
    top: 8,
    icon: "circle",
    itemWidth: 12,
    itemHeight: 12,
    itemGap: 24,
    textStyle: {
    color: "rgb(95, 101, 108)",
    fontSize: 16,
    fontFamily: "Microsoft YaHei",
    fontWeight: 400,
    lineHeight: 24
    // 避免自动换行导致“第二行不居中”：拆成两行 legend，每行各自居中
    legend: [
    {
    show: true,
    type: "plain",
    data: legendFirstLine,
    top: 8,
    left: "center",
    icon: "circle",
    itemWidth: 12,
    itemHeight: 12,
    itemGap: 24,
    textStyle: {
    color: "rgb(95, 101, 108)",
    fontSize: 16,
    fontFamily: "Microsoft YaHei",
    fontWeight: 400,
    lineHeight: 24
    }
    },
    data: types
    },
    {
    show: legendSecondLine.length > 0,
    type: "plain",
    data: legendSecondLine,
    top: 32,
    left: "center",
    icon: "circle",
    itemWidth: 12,
    itemHeight: 12,
    itemGap: 24,
    textStyle: {
    color: "rgb(95, 101, 108)",
    fontSize: 16,
    fontFamily: "Microsoft YaHei",
    fontWeight: 400,
    lineHeight: 24
    }
    }
    ],
    radar: {
    center: ["50%", "55%"],
    radius: "65%",
    // 对齐左侧折线图（grid top=34%）的“图例到图形”间距：下移雷达中心并略缩半径
    center: ["50%", "62%"],
    radius: "60%",
    indicator: indicators,
    axisName: {
    color: "rgba(132, 136, 142, 1)",
    ......@@ -688,6 +747,11 @@ onBeforeUnmount(() => {
    padding: 0;
    }
    /* 合作限制：下拉项内边距（teleport 到 body，用 :global 生效） */
    :global(.coop-select-dropdown .el-select-dropdown__item) {
    padding: 0 20px !important;
    }
    .datasub {
    width: 1600px;
    height: 460px;
    ......@@ -742,7 +806,7 @@ onBeforeUnmount(() => {
    height: 412px;
    box-sizing: border-box;
    position: relative;
    padding: 24px 24px 65px 24px;
    padding: 0px 24px 64px 24px;
    &.left-main--empty {
    display: flex;
    ......@@ -770,7 +834,7 @@ onBeforeUnmount(() => {
    .left-main-echarts {
    width: 1015px;
    height: 323px;
    height: 348px;
    }
    .source {
    ......@@ -847,7 +911,7 @@ onBeforeUnmount(() => {
    width: 521px;
    height: 412px;
    box-sizing: border-box;
    padding: 24px 24px 64px 24px;
    padding: 0px 24px 64px 24px;
    position: relative;
    &.right-main--empty {
    ......@@ -874,7 +938,7 @@ onBeforeUnmount(() => {
    .right-main-echarts {
    width: 473px;
    height: 324px;
    height: 348px;
    }
    .source {
    ......
    src/views/coopRestriction/components/resLib/index.vue
    浏览文件 @ a5b56c23
    ......@@ -6,7 +6,8 @@
    {{ item.name }}
    </div>
    </div>
    <el-select v-model="sortModel" placeholder="发布时间" class="select" :teleported="true" placement="bottom-start"
    <el-select v-model="sortModel" placeholder="发布时间" class="select" popper-class="coop-select-dropdown"
    :teleported="true" placement="bottom-start"
    :popper-options="sortPopperOptions" @change="handleSortChange">
    <template #prefix>
    <img v-if="sortModel !== true" src="@/views/thinkTank/ThinkTankDetail/thinkDynamics/images/image down.png"
    ......@@ -355,6 +356,11 @@ watch(currentPage, () => {
    padding: 0;
    }
    /* 合作限制：下拉项内边距（teleport 到 body，用 :global 生效） */
    :global(.coop-select-dropdown .el-select-dropdown__item) {
    padding: 0 20px !important;
    }
    .reslib-page {
    width: 1600px;
    ......
    src/views/coopRestriction/detail/index.vue
    浏览文件 @ a5b56c23
    ......@@ -174,8 +174,19 @@ const getcoopRelatedData = async () => {
    };
    // 点击跳转关联实体详情
    const handleClickOnEntity = (item) => {
    if (!item.ENTITYID) return;
    const path = `/companyPages/${item.ENTITYID}`;
    const entityType = item?.ENTITYTYPE;
    // ENTITYTYPE: 'O' 机构/公司；'P' 人物
    if (entityType === "P") {
    const personId = item?.PERSONID || item?.ENTITYID || item?.id;
    if (!personId) return;
    const url = `http://localhost:3000/characterPage?type=2&personId=${encodeURIComponent(personId)}`;
    window.open(url, "_blank");
    return;
    }
    // 默认按公司/机构跳转（含 ENTITYTYPE === 'O' 或字段缺失）
    const companyId = item?.ENTITYID || item?.id;
    if (!companyId) return;
    const path = `/companyPages/${companyId}`;
    const { href } = router.resolve({ path });
    window.open(href, "_blank");
    };
    ......
    Markdown 格式
    0% 或
    您添加了 0 人 到此讨论。请谨慎行事。
    请先完成此评论的编辑！
    请 注册 或者 后发表评论