Skip to content

R
risk-monitor
提交 d91695a9 authored 作者: 张伊明's avatar 张伊明
浏览文件
操作

feat 修改部分样式，重新接入法案数量接口

fix 修复ci流程
上级 1b498149
流水线 #130 已通过 于阶段
    in 1 分 23 秒
    隐藏空白字符变更
    内嵌 并排
    正在显示 包含 138 行增加 和 91 行删除
    .gitlab-ci.yml
    浏览文件 @ d91695a9
    ......@@ -14,7 +14,9 @@ build_pre:
    stage: build
    image: node:20-bullseye
    tags:
    - risk-monitor-frontend
    - docker
    - frontend
    - linux
    only:
    - pre
    script:
    ......@@ -49,7 +51,7 @@ deploy_pre:
    LATEST_PIPELINE_ID="$(
    curl --silent --show-error --fail
    --header "JOB-TOKEN: $CI_JOB_TOKEN"
    "$CI_SERVER_URL/api/v4/projects/$CI_PROJECT_ID/pipelines?ref=pre&order_by=id&sort=desc&per_page=1"
    "${CI_PROJECT_URL%/*/*}/api/v4/projects/$CI_PROJECT_ID/pipelines?ref=pre&order_by=id&sort=desc&per_page=1"
    | jq -r '.[0].id'
    )"
    - >
    ......
    src/views/bill/billHome/index.vue
    浏览文件 @ d91695a9
    ......@@ -25,7 +25,9 @@
    </div>
    <div class="committee-cards-row">
    <div v-for="item in committeeCardList" :key="item.id" class="committee-card">
    <div class="committee-card-icon"></div>
    <div class="committee-card-icon">
    <img :src="iconCommit" alt="委员会头像" />
    </div>
    <div class="committee-card-content">
    <div class="committee-card-name">{{ item.name }}</div>
    <div class="committee-card-chamber">{{ item.chamber }}</div>
    ......@@ -287,7 +289,7 @@ import getDoublePieChart from "./utils/doublePieChart";
    import box5HeaderIcon from "./assets/images/box5-header-icon.png";
    import box6HeaderIcon from "./assets/images/box6-header-icon.png";
    import box7HeaderIcon from "./assets/images/box7-header-icon.png";
    import iconCommit from "./assets/icons/icon-commit.png";
    import { ElMessage } from "element-plus";
    import { Calendar } from "@element-plus/icons-vue";
    ......@@ -503,13 +505,9 @@ const buildAiChartPayload = key => {
    const title = Array.isArray(box5Data.value.title) ? box5Data.value.title : [];
    const proposed = box5Data.value?.data?.[0]?.value || [];
    const passed = box5Data.value?.data?.[1]?.value || [];
    const rate =
    box5Data.value.percent ||
    title.map((_, i) => {
    const p = Number(proposed[i] || 0);
    const pass = Number(passed[i] || 0);
    return p ? Number(((pass / p) * 100).toFixed(2)) : 0;
    });
    const housePassed = box5Data.value?.data?.[2]?.value || [];
    const senatePassed = box5Data.value?.data?.[3]?.value || [];
    const hsPassed = box5Data.value?.data?.[4]?.value || [];
    return {
    type: "折线图",
    name: "涉华法案数量变化趋势",
    ......@@ -517,7 +515,9 @@ const buildAiChartPayload = key => {
    month,
    proposed: Number(proposed[i] || 0),
    passed: Number(passed[i] || 0),
    pass_rate: Number(rate[i] || 0)
    house_passed: Number(housePassed[i] || 0),
    senate_passed: Number(senatePassed[i] || 0),
    hs_passed: Number(hsPassed[i] || 0)
    }))
    };
    }
    ......@@ -750,6 +750,18 @@ const box5Data = ref({
    {
    name: "通过法案",
    value: [6, 3, 4, 6, 11, 5, 2, 14, 16, 27, 28, 44]
    },
    {
    name: "众议院通过",
    value: []
    },
    {
    name: "参议院通过",
    value: []
    },
    {
    name: "双院通过",
    value: []
    }
    ]
    });
    ......@@ -772,11 +784,23 @@ const handleGetBillCount = async () => {
    data: [
    {
    name: "提出法案",
    value: sortedData.map(item => item.totalCount)
    value: sortedData.map(item => item.proposedCount)
    },
    {
    name: "通过法案",
    value: sortedData.map(item => item.passCount)
    },
    {
    name: "众议院通过",
    value: sortedData.map(item => item.houseCount)
    },
    {
    name: "参议院通过",
    value: sortedData.map(item => item.senateCount)
    },
    {
    name: "双院通过",
    value: sortedData.map(item => item.hscount)
    }
    ],
    percent: sortedData.map(item => item.percent)
    ......@@ -788,7 +812,10 @@ const handleGetBillCount = async () => {
    title: [],
    data: [
    { name: "提出法案", value: [] },
    { name: "通过法案", value: [] }
    { name: "通过法案", value: [] },
    { name: "众议院通过", value: [] },
    { name: "参议院通过", value: [] },
    { name: "双院通过", value: [] }
    ],
    percent: []
    };
    ......@@ -801,7 +828,10 @@ const handleGetBillCount = async () => {
    title: [],
    data: [
    { name: "提出法案", value: [] },
    { name: "通过法案", value: [] }
    { name: "通过法案", value: [] },
    { name: "众议院通过", value: [] },
    { name: "参议院通过", value: [] },
    { name: "双院通过", value: [] }
    ],
    percent: []
    };
    ......@@ -814,13 +844,17 @@ const handleBox5 = async () => {
    await nextTick();
    const proposed = box5Data.value.data[0].value;
    const passed = box5Data.value.data[1].value;
    const rate =
    box5Data.value.percent ||
    proposed.map((p, i) => {
    const pass = passed[i] || 0;
    return p ? ((pass / p) * 100).toFixed(2) : 0;
    });
    const box5Chart = getMultiLineChart(box5Data.value.title, proposed, passed, rate);
    const housePassed = box5Data.value.data[2].value;
    const senatePassed = box5Data.value.data[3].value;
    const hsPassed = box5Data.value.data[4].value;
    const box5Chart = getMultiLineChart(
    box5Data.value.title,
    proposed,
    passed,
    housePassed,
    senatePassed,
    hsPassed
    );
    const domain = categoryList.value.filter(item => {
    return item.id === box5Select.value
    })[0]?.name
    ......@@ -1693,6 +1727,14 @@ onUnmounted(() => {
    border-radius: 50%;
    background: var(--color-primary-10);
    flex-shrink: 0;
    overflow: hidden;
    img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    }
    }
    .committee-card-content {
    ......
    src/views/bill/billHome/utils/multiLineChart.js
    浏览文件 @ d91695a9
    import * as echarts from 'echarts'
    import { MUTICHARTCOLORS } from '../../../../common/constant'
    const getMultiLineChart = (dataX, proposedData, passData, houseData, senateData, hsData) => {
    const lineColors = MUTICHARTCOLORS.slice(0, 5)
    const hexToRgba = (hex, alpha) => {
    if (typeof hex !== 'string' || !hex.startsWith('#')) return hex
    const normalized = hex.replace('#', '')
    const full = normalized.length === 3
    ? normalized.split('').map(c => c + c).join('')
    : normalized
    const r = parseInt(full.slice(0, 2), 16)
    const g = parseInt(full.slice(2, 4), 16)
    const b = parseInt(full.slice(4, 6), 16)
    return `rgba(${r}, ${g}, ${b}, ${alpha})`
    }
    const getAreaColor = color => new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
    offset: 0,
    color: hexToRgba(color, 0.35)
    }, {
    offset: 1,
    color: hexToRgba(color, 0)
    }])
    const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
    return {
    tooltip: {
    trigger: 'item',
    ......@@ -28,7 +49,7 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
    containLabel: true
    },
    legend: {
    data: ['提出法案', '通过法案', '通过率'],
    data: ['提出法案', '通过法案', '众议院通过', '参议院通过', '双院通过'],
    show: true,
    top: 10,
    icon: 'circle',
    ......@@ -38,7 +59,7 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
    fontSize: '14px',
    }
    },
    color: ['#1677FF', '#FA8C16', '#D9001B'],
    color: lineColors,
    xAxis: [
    {
    type: 'category',
    ......@@ -65,7 +86,6 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
    {
    type: 'value',
    position: 'left',
    // 纵轴单位只在纵轴上方显示一次（通过 axis.name），避免每个刻度重复显示
    name: '项',
    nameLocation: 'end',
    nameGap: 12,
    ......@@ -73,51 +93,20 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
    color: '#666',
    fontSize: 14,
    fontWeight: 400,
    // 给单位一点点下移空间，使其更贴近顶部刻度数字的视觉基线
    padding: [0, 0, 6, -20]
    },
    axisLabel: {
    formatter: '{value}',
    color: '#666',
    fontSize: 14,
    fontWeight: 400
    },
    splitLine: {
    show: true,
    lineStyle: {
    color: '#e7f3ff',
    type: 'dashed',
    }
    },
    },
    {
    type: 'value',
    position: 'right',
    min: 0,
    max: 100,
    interval: 20,
    // 通过率单位仅展示一次
    name: '%',
    nameLocation: 'end',
    nameGap: 12,
    nameTextStyle: {
    formatter: '{value}',
    color: '#666',
    fontSize: 14,
    fontWeight: 400,
    padding: [0, 0, 6, 20]
    },
    axisLabel: {
    formatter: '{value}',
    color: '#666',
    fontSize: 14,
    fontWeight: 400
    fontWeight: 400
    },
    splitLine: {
    show: true,
    lineStyle: {
    color: '#e7f3ff',
    type: 'dashed',
    }
    show: true,
    lineStyle: {
    color: '#e7f3ff',
    type: 'dashed',
    }
    },
    }
    ],
    ......@@ -129,18 +118,12 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
    symbol: 'emptyCircle',
    symbolSize: 6,
    areaStyle: {
    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
    offset: 0,
    color: 'rgba(22, 119, 255, 0.4)' // 起始颜色
    }, {
    offset: 1,
    color: 'rgba(22, 119, 255, 0)' // 结束颜色
    }])
    color: getAreaColor(lineColors[0])
    },
    itemStyle: {
    color: '#1677FF'
    color: lineColors[0]
    },
    data: dataY1
    data: proposedData
    },
    {
    name: '通过法案',
    ......@@ -149,34 +132,54 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
    symbol: 'emptyCircle',
    symbolSize: 6,
    areaStyle: {
    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
    offset: 0,
    color: 'rgba(250, 140, 22, 0.4)' // 起始颜色
    }, {
    offset: 1,
    color: 'rgba(250, 140, 22, 0)' // 结束颜色
    }])
    color: getAreaColor(lineColors[1])
    },
    itemStyle: {
    color: '#FA8C16'
    color: lineColors[1]
    },
    data: dataY2
    data: passData
    },
    {
    name: '通过率',
    name: '众议院通过',
    type: 'line',
    yAxisIndex: 1,
    smooth: true,
    symbol: 'emptyCircle',
    symbolSize: 4,
    lineStyle: {
    type: 'dashed',
    width: 2
    symbolSize: 6,
    areaStyle: {
    color: getAreaColor(lineColors[2])
    },
    itemStyle: {
    color: lineColors[2]
    },
    data: houseData
    },
    {
    name: '参议院通过',
    type: 'line',
    smooth: true,
    symbol: 'emptyCircle',
    symbolSize: 6,
    areaStyle: {
    color: getAreaColor(lineColors[3])
    },
    itemStyle: {
    color: lineColors[3]
    },
    data: senateData
    },
    {
    name: '双院通过',
    type: 'line',
    smooth: true,
    symbol: 'emptyCircle',
    symbolSize: 6,
    areaStyle: {
    color: getAreaColor(lineColors[4])
    },
    itemStyle: {
    color: '#D9001B'
    color: lineColors[4]
    },
    data: dataY3
    data: hsData
    }
    ]
    }
    ......
    src/views/bill/introdoction/index.vue
    浏览文件 @ d91695a9
    ......@@ -253,7 +253,7 @@ const partyIconUrl = computed(() => {
    const reversedStageList = computed(() => {
    const list = Array.isArray(basicInfo.value?.stageList) ? basicInfo.value.stageList : [];
    return [...list].reverse();
    return [...list];
    });
    const stageListLength = computed(() => (Array.isArray(basicInfo.value?.stageList) ? basicInfo.value.stageList.length : 0));
    const stageActiveIndex = computed(() => stageListLength.value - 1);
    ......
    Markdown 格式
    0% 或
    您添加了 0 人 到此讨论。请谨慎行事。
    请先完成此评论的编辑！
    请 注册 或者 后发表评论