Skip to content

R
risk-monitor
提交 64c5c440 authored 作者: yanpeng's avatar yanpeng
浏览文件
操作

ZM GOV AREA

上级 4adeeffb
全部展开 隐藏空白字符变更
内嵌 并排
正在显示 包含 444 行增加 和 91 行删除
src/api/allGovernment.js
浏览文件 @ 64c5c440
......@@ -6,14 +6,13 @@ import request from "@/api/request.js";
* * @param {String} params.monthNum // 月份数
*/
export function getAllGovernmentList(params) {
return request({
method: 'GET',
url: `/api/rivalryIndex/governmentSanctionsData`,
params
})
return request({
method: "GET",
url: `/api/rivalryIndex/governmentSanctionsData`,
params
});
}
// 全政府-获取美对华制裁措施数量趋势
/**
* @header token
......@@ -24,22 +23,23 @@ export function getAllGovernmentList(params) {
* @param {String} params.sanType // 制裁手段
*/
export function getUSChinaSanctionTrend(params) {
return request({
method: 'GET',
url: `/api/rivalryIndex/sanctionsQuantitativeTrend`,
params
})
return request({
method: "GET",
url: `/api/rivalryIndex/sanctionsQuantitativeTrend`,
params
});
}
// 全政府-美政府部门打压遏制最新动态
/**
* @header token
*/
export function getUSGovernmentLatestDynamic() {
return request({
method: 'GET',
url: `/api/rivalryIndex/governmentSanctionsDynamics`
})
export function getUSGovernmentLatestDynamic(params) {
return request({
method: "GET",
url: `/api/rivalryIndex/governmentSanctionsDynamics`,
params
});
}
// 全政府-美政府部门联合制裁排行
......@@ -47,13 +47,12 @@ export function getUSGovernmentLatestDynamic() {
* @header token
*/
export function getUSGovernmentJointSanctionRank() {
return request({
method: 'GET',
url: `/api/rivalryIndex/governmentJointSanctionsRanking`
})
return request({
method: "GET",
url: `/api/rivalryIndex/governmentJointSanctionsRanking`
});
}
// 全政府-美政府部门对我打压遏制时间线
/**
* @header token
......@@ -65,24 +64,23 @@ export function getUSGovernmentJointSanctionRank() {
* @param {String} params.field // 领域ID
*/
export function getUSGovernmentSanctionHistory(params) {
return request({
method: 'GET',
url: `/api/rivalryIndex/getSanctionProcess`,
params
})
return request({
method: "GET",
url: `/api/rivalryIndex/getSanctionProcess`,
params
});
}
// 全政府-获取部门数据
/**
* @header token
*/
export function getDepartmentList(params) {
return request({
method: 'GET',
url: `/api/organization/summaryDepartList`,
params
})
return request({
method: "GET",
url: `/api/organization/summaryDepartList`,
params
});
}
// 全政府-获取制裁手段数据
......@@ -90,11 +88,11 @@ export function getDepartmentList(params) {
* @params {orgId}
*/
export function getSanTypeList(params) {
return request({
method: 'GET',
url: `/api/rivalryIndex/sanTypeList`,
params
})
return request({
method: "GET",
url: `/api/rivalryIndex/sanTypeList`,
params
});
}
// 全政府-获取未来三个月内的打压遏制时间线
......@@ -102,9 +100,9 @@ export function getSanTypeList(params) {
* @params {field}
*/
export function getThreeMonthSanctionProcess(params) {
return request({
method: 'GET',
url: `/api/rivalryIndex/nextThreeMonthSanctionProcess`,
params
})
}
\ No newline at end of file
return request({
method: "GET",
url: `/api/rivalryIndex/nextThreeMonthSanctionProcess`,
params
});
}
src/components/SimplePagination.vue 0 → 100644
浏览文件 @ 64c5c440
NEW_FILE_CODE
<template>
<div class="simple-pagination">
<div class="pagination-wrapper">
<el-icon class="pagination-btn" @click="handlePrevPage" :class="{ disabled: currentPage === 1 }">
<el-icon :size="16">
<ArrowLeft />
</el-icon>
</el-icon>
<div class="pagination-info">
<span class="current-page">{{ currentPage }}</span>
<span>/</span>
<span>{{ totalPages }}</span>
</div>
<el-icon class="pagination-btn" @click="handleNextPage" :class="{ disabled: currentPage === totalPages }">
<el-icon :size="16">
<ArrowRight />
</el-icon>
</el-icon>
</div>
</div>
</template>
<script setup>
import { computed } from "vue";
import { ArrowLeft, ArrowRight } from "@element-plus/icons-vue";
const props = defineProps({
// 当前页码
currentPage: {
type: Number,
default: 1
},
// 每页显示条数
pageSize: {
type: Number,
default: 5
},
// 总记录数
total: {
type: Number,
default: 0
}
});
const emit = defineEmits(["update:currentPage", "page-change"]);
// 计算总页数
const totalPages = computed(() => {
return Math.ceil(props.total / props.pageSize) || 1;
});
// 处理上一页
const handlePrevPage = () => {
if (props.currentPage > 1) {
const newPage = props.currentPage - 1;
emit("update:currentPage", newPage);
emit("page-change", newPage);
}
};
// 处理下一页
const handleNextPage = () => {
if (props.currentPage < totalPages.value) {
const newPage = props.currentPage + 1;
emit("update:currentPage", newPage);
emit("page-change", newPage);
}
};
</script>
<style lang="scss" scoped>
.simple-pagination {
display: flex;
justify-content: center;
align-items: center;
padding: 16px 0;
.pagination-wrapper {
display: flex;
align-items: center;
gap: 12px;
.pagination-btn {
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(231, 243, 255, 1);
// border: 1px solid #dcdfe6;
border: none;
border-radius: 4px;
color: #055fc2;
font-size: 20px;
cursor: pointer;
transition: all 0.3s;
&:hover:not(.disabled) {
background-color: #f5f7fa;
border-color: #c0c4cc;
}
&.disabled {
opacity: 0.5;
cursor: not-allowed;
background-color: #f5f7fa;
color: #c0c4cc;
}
}
.pagination-info {
font-size: 14px;
color: rgba(5, 95, 194, 1);
// min-width: 60px;
text-align: center;
display: flex;
gap: 5px;
// letter-spacing: 5px;
}
}
}
</style>
src/views/ZMOverView/components/fourSuppress/components/addDomain/index-back.vue
浏览文件 @ 64c5c440
......@@ -80,7 +80,7 @@
</div>
</div>
<div class="news-content">
<div v-for="(value, idx) in newsList" :key="idx" class="news-item">
<div v-for="(value, idx) in paginatedNewsList" :key="idx" class="news-item">
<div class="news-item-title">
<div class="tag-container">
<!-- <div v-for="tag in value.tags" :key="tag" :class="getTagClass(tag)">
......@@ -109,6 +109,25 @@
</el-tooltip>
</div>
</div>
<div class="news-pagination">
<div class="pagination-wrapper">
<el-button
class="pagination-btn"
type="primary"
@click="handlePrevPage"
:disabled="newsCurrentPage === 1"
:icon="ArrowLeft"
/>
<span class="pagination-info"> {{ newsCurrentPage }}/{{ totalPages }} </span>
<el-button
class="pagination-btn"
type="primary"
@click="handleNextPage"
:disabled="newsCurrentPage === totalPages"
:icon="ArrowRight"
/>
</div>
</div>
</div>
<div class="empty-section">
<div class="bottom-item">
......@@ -296,6 +315,7 @@ import {
} from "@/api/zmOverview/allDomains";
import { getUSGovernmentLatestDynamic, getDepartmentList, getSanTypeList } from "@/api/allGovernment.js";
import { ElMessage } from "element-plus";
import { ArrowLeft, ArrowRight } from "@element-plus/icons-vue";
const router = useRouter();
......@@ -377,6 +397,36 @@ const timelineContainerWidth = 1700;
// 美政府部门打压遏制最新动态
const newsList = ref([]);
const newsCurrentPage = ref(1);
const newsPageSize = ref(3); // 每页显示 5 条
// 总页数
const totalPages = computed(() => {
return Math.ceil(newsList.value.length / newsPageSize.value) || 1;
});
// 分页后的新闻列表
const paginatedNewsList = computed(() => {
const start = (newsCurrentPage.value - 1) * newsPageSize.value;
const end = start + newsPageSize.value;
return newsList.value.slice(start, end);
});
const handleNewsPageChange = page => {
newsCurrentPage.value = page;
};
const handlePrevPage = () => {
if (newsCurrentPage.value > 1) {
newsCurrentPage.value--;
}
};
const handleNextPage = () => {
if (newsCurrentPage.value < totalPages.value) {
newsCurrentPage.value++;
}
};
const getUSGovernmentLatestDynamicData = async () => {
try {
......@@ -1359,11 +1409,115 @@ watch(activeDate, () => {
.news-section {
width: 792px;
height: 700px;
display: flex;
flex-direction: column;
justify-content: space-between;
.news-title {
padding: 8px;
}
// .news-pagination {
// display: flex;
// justify-content: center;
// align-items: center;
// padding: 16px 0;
// :deep(.el-pagination) {
// &.is-background .el-pager li {
// background-color: #fff;
// border: 1px solid #dcdfe6;
// border-radius: 4px;
// font-size: 14px;
// min-width: 32px;
// height: 32px;
// line-height: 32px;
// margin: 0 4px;
// &.is-active {
// background-color: #055fc2;
// color: #fff;
// border-color: #055fc2;
// }
// &:hover {
// background-color: #f5f7fa;
// }
// }
// .btn-prev,
// .btn-next {
// background-color: rgba(231, 243, 255, 1);
// // border: 1px solid #dcdfe6;
// border: none;
// border-radius: 4px;
// font-size: 14px;
// // min-width: 32px;
// // height: 32px;
// line-height: 32px;
// margin-right: 4px;
// .el-icon {
// font-size: 16px;
// color: #055fc2;
// font-weight: 800;
// }
// &:hover:not(.is-disabled) {
// background-color: #f5f7fa;
// }
// &.is-disabled {
// opacity: 0.5;
// cursor: not-allowed;
// }
// }
// }
// }
.news-pagination {
display: flex;
justify-content: center;
align-items: center;
padding: 16px 0;
.pagination-wrapper {
display: flex;
align-items: center;
gap: 12px;
.pagination-btn {
padding: 6px;
background-color: rgba(231, 243, 255, 1);
// border: 1px solid #dcdfe6;
border: none;
border-radius: 4px;
font-size: 14px;
color: #606266;
cursor: pointer;
transition: all 0.3s;
&:hover:not(:disabled) {
background-color: #f5f7fa;
// border-color: #c0c4cc;
}
&:disabled {
opacity: 0.5;
cursor: not-allowed;
background-color: #f5f7fa;
}
}
.pagination-info {
font-size: 14px;
color: rgba(5, 95, 194, 1);
min-width: 60px;
text-align: center;
letter-spacing: 4px;
}
}
}
.tag-container {
display: flex;
align-items: center;
......@@ -1753,11 +1907,12 @@ watch(activeDate, () => {
.news-content {
overflow-y: auto;
overflow-x: hidden;
margin-bottom: auto;
}
.news-item {
/* 全政府-动态 (四全-最新动态) */
width: 737px;
height: 124px;
height: 116px;
margin: 0 28px;
/* 自动布局 */
display: flex;
......@@ -1825,7 +1980,7 @@ watch(activeDate, () => {
letter-spacing: 0px;
text-align: left;
color: rgba(59, 65, 75, 1);
margin-top: 8px;
// margin-top: 8px;
/* 单行省略 */
display: -webkit-box;
-webkit-box-orient: vertical;
......
src/views/ZMOverView/components/fourSuppress/components/addDomain/index.vue
浏览文件 @ 64c5c440
......@@ -109,16 +109,31 @@
</el-tooltip>
</div>
</div>
<div class="news-pagination">
<el-pagination
layout="prev, pager, next"
:total="newsList.length"
:page-size="newsPageSize"
v-model:current-page="newsCurrentPage"
size="small"
@current-change="handleNewsPageChange"
/>
</div>
<!-- <div class="news-pagination">
<div class="pagination-wrapper">
<el-button
class="pagination-btn"
type="primary"
@click="handlePrevPage"
:disabled="newsCurrentPage === 1"
:icon="ArrowLeft"
/>
<span class="pagination-info"> {{ newsCurrentPage }}/{{ totalPages }} </span>
<el-button
class="pagination-btn"
type="primary"
@click="handleNextPage"
:disabled="newsCurrentPage === totalPages"
:icon="ArrowRight"
/>
</div>
</div> -->
<simple-pagination
v-model:current-page="newsCurrentPage"
:page-size="newsPageSize"
:total="newsList.length"
@page-change="handleNewsPageChange"
/>
</div>
<div class="empty-section">
<div class="bottom-item">
......@@ -306,6 +321,8 @@ import {
} from "@/api/zmOverview/allDomains";
import { getUSGovernmentLatestDynamic, getDepartmentList, getSanTypeList } from "@/api/allGovernment.js";
import { ElMessage } from "element-plus";
import { ArrowLeft, ArrowRight } from "@element-plus/icons-vue";
import SimplePagination from "@/components/SimplePagination.vue";
const router = useRouter();
......@@ -390,6 +407,11 @@ const newsList = ref([]);
const newsCurrentPage = ref(1);
const newsPageSize = ref(5); // 每页显示 5 条
// 总页数
const totalPages = computed(() => {
return Math.ceil(newsList.value.length / newsPageSize.value) || 1;
});
// 分页后的新闻列表
const paginatedNewsList = computed(() => {
const start = (newsCurrentPage.value - 1) * newsPageSize.value;
......@@ -401,6 +423,18 @@ const handleNewsPageChange = page => {
newsCurrentPage.value = page;
};
const handlePrevPage = () => {
if (newsCurrentPage.value > 1) {
newsCurrentPage.value--;
}
};
const handleNextPage = () => {
if (newsCurrentPage.value < totalPages.value) {
newsCurrentPage.value++;
}
};
const getUSGovernmentLatestDynamicData = async () => {
try {
const res = await getUSGovernmentLatestDynamic();
......@@ -1390,60 +1424,104 @@ watch(activeDate, () => {
padding: 8px;
}
// .news-pagination {
// display: flex;
// justify-content: center;
// align-items: center;
// padding: 16px 0;
// :deep(.el-pagination) {
// &.is-background .el-pager li {
// background-color: #fff;
// border: 1px solid #dcdfe6;
// border-radius: 4px;
// font-size: 14px;
// min-width: 32px;
// height: 32px;
// line-height: 32px;
// margin: 0 4px;
// &.is-active {
// background-color: #055fc2;
// color: #fff;
// border-color: #055fc2;
// }
// &:hover {
// background-color: #f5f7fa;
// }
// }
// .btn-prev,
// .btn-next {
// background-color: rgba(231, 243, 255, 1);
// // border: 1px solid #dcdfe6;
// border: none;
// border-radius: 4px;
// font-size: 14px;
// // min-width: 32px;
// // height: 32px;
// line-height: 32px;
// margin-right: 4px;
// .el-icon {
// font-size: 16px;
// color: #055fc2;
// font-weight: 800;
// }
// &:hover:not(.is-disabled) {
// background-color: #f5f7fa;
// }
// &.is-disabled {
// opacity: 0.5;
// cursor: not-allowed;
// }
// }
// }
// }
.news-pagination {
display: flex;
justify-content: center;
align-items: center;
padding: 16px 0;
:deep(.el-pagination) {
&.is-background .el-pager li {
background-color: #fff;
border: 1px solid #dcdfe6;
border-radius: 4px;
font-size: 14px;
min-width: 32px;
height: 32px;
line-height: 32px;
margin: 0 4px;
&.is-active {
background-color: #055fc2;
color: #fff;
border-color: #055fc2;
}
&:hover {
background-color: #f5f7fa;
}
}
.pagination-wrapper {
display: flex;
align-items: center;
gap: 12px;
.btn-prev,
.btn-next {
.pagination-btn {
padding: 6px;
background-color: rgba(231, 243, 255, 1);
// border: 1px solid #dcdfe6;
border: none;
border-radius: 4px;
font-size: 14px;
// min-width: 32px;
// height: 32px;
line-height: 32px;
margin-right: 4px;
.el-icon {
font-size: 16px;
color: #055fc2;
font-weight: 800;
}
color: #606266;
cursor: pointer;
transition: all 0.3s;
&:hover:not(.is-disabled) {
&:hover:not(:disabled) {
background-color: #f5f7fa;
// border-color: #c0c4cc;
}
&.is-disabled {
&:disabled {
opacity: 0.5;
cursor: not-allowed;
background-color: #f5f7fa;
}
}
.pagination-info {
font-size: 14px;
color: rgba(5, 95, 194, 1);
min-width: 60px;
text-align: center;
letter-spacing: 4px;
}
}
}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论