提交 35415fdb authored 作者: hsx's avatar hsx

修复模块新闻得bug

上级 f08486b0
流水线 #533 已通过 于阶段
in 1 分 43 秒
<template> <template>
<el-space direction="vertical" class="full-width news-image-background"> <el-space direction="vertical" class="full-width news-image-background">
<el-button class="float-btn" @click="gotoNewsBrief(false)"><el-icon> <el-button class="float-btn" @click="gotoNewsBrief(false)"
<back /> ><el-icon>
</el-icon> 返回</el-button> <Back />
<el-space style="width: 993px;" direction="vertical" alignment="flex-start"> </el-icon>
<div id="ref-news-list" style="margin-top: 50px; margin-bottom: 24px; margin-left: 24px;"> 返回</el-button
<common-text class="text-title-0-show" color="var(--text-primary-90-color)">{{ >
moduleName <el-space style="width: 993px" direction="vertical" alignment="flex-start">
}}</common-text> <div id="ref-news-list" style="margin-top: 50px; margin-bottom: 24px; margin-left: 24px">
<common-text class="text-regular" <common-text class="text-title-0-show" color="var(--text-primary-90-color)">{{ moduleName }}</common-text>
color="var(--text-primary-65-color)">基于情报价值评估预测算法,掌握全球重要潜在动向</common-text> <common-text class="text-regular" color="var(--text-primary-65-color)"
>基于情报价值评估预测算法,掌握全球重要潜在动向</common-text
>
</div> </div>
<el-space direction="vertical" fill alignment="flex-start" class="background-as-card common-padding"> <el-space direction="vertical" fill alignment="flex-start" class="background-as-card common-padding">
<el-radio-group v-model="currentAreaId" class="radio-group-as-gap-btn"> <el-radio-group v-model="currentAreaId" class="radio-group-as-gap-btn">
<el-space direction="horizontal" wrap alignment="center"> <el-space direction="horizontal" wrap alignment="center">
<el-radio-button :label="''" @click="changeArea('')">全部</el-radio-button> <el-radio-button :label="''" @click="changeArea('')">全部</el-radio-button>
<el-radio-button v-for="(t, i) in AreaList" :key="i" :label="t.id" @click="changeArea(t.id)">{{ <el-radio-button v-for="(t, i) in AreaList" :key="i" :label="t.id" @click="changeArea(t.id)"
t.name }} >{{ t.name }}
</el-radio-button> </el-radio-button>
</el-space> </el-space>
</el-radio-group> </el-radio-group>
<el-divider style="margin: 10px 0px;"></el-divider> <el-divider style="margin: 10px 0px"></el-divider>
<div v-if="NewsData?.content?.length > 0"> <div v-if="NewsData?.content?.length > 0">
<news-list :news="NewsData.content" /> <news-list :news="NewsData.content" />
</div> </div>
<el-empty v-else></el-empty> <el-empty v-else></el-empty>
<el-pagination background layout="total, ->, prev, pager, next" :current-page="modulePage" <el-pagination
:total="NewsData?.totalElements ?? 0" v-on:current-change="onCurrentChange" /> background
layout="total, ->, prev, pager, next"
:current-page="modulePage"
:total="NewsData?.totalElements ?? 0"
v-on:current-change="onCurrentChange"
/>
</el-space> </el-space>
</el-space> </el-space>
</el-space> </el-space>
...@@ -34,16 +41,16 @@ ...@@ -34,16 +41,16 @@
<script setup> <script setup>
import { ref, onMounted } from "vue"; import { ref, onMounted } from "vue";
import { useRoute } from 'vue-router'; import { useRoute } from "vue-router";
import '@/styles/container.scss'; import "@/styles/container.scss";
import '@/styles/radio.scss'; import "@/styles/radio.scss";
import NewsList from "./NewsList.vue"; import NewsList from "./NewsList.vue";
import { getAreaList, getHotNewsByArea } from "@/api/news/newsBrief"; import { getAreaList, getHotNewsByArea } from "@/api/news/newsBrief";
import { ElSpace, ElDivider, ElRadioButton, ElRadioGroup, ElButton, ElIcon, ElEmpty, ElPagination } from "element-plus"; import { ElSpace, ElDivider, ElRadioButton, ElRadioGroup, ElButton, ElIcon, ElEmpty, ElPagination } from "element-plus";
import { Back } from "@element-plus/icons-vue";
import CommonText from "@/components/base/texts/CommonText.vue"; import CommonText from "@/components/base/texts/CommonText.vue";
import { useGotoNewsBrief } from "@/router/modules/news"; import { useGotoNewsBrief } from "@/router/modules/news";
import { scrollToElement } from "@/router/common"; import { scrollToElement } from "@/router/common";
import { number } from "echarts";
const route = useRoute(); const route = useRoute();
const gotoNewsBrief = useGotoNewsBrief(); const gotoNewsBrief = useGotoNewsBrief();
const moduleId = ref(route.params.id); const moduleId = ref(route.params.id);
...@@ -57,35 +64,33 @@ onMounted(async () => { ...@@ -57,35 +64,33 @@ onMounted(async () => {
console.log(route.query.name, moduleId.value, moduleName.value); console.log(route.query.name, moduleId.value, moduleName.value);
const { data: areaList } = await getAreaList(); const { data: areaList } = await getAreaList();
AreaList.value = areaList ?? []; AreaList.value = areaList ?? [];
await updateDate("") await updateDate("");
}); });
const onCurrentChange = async e => { const onCurrentChange = async e => {
await updateDate(currentAreaId.value, e - 1) await updateDate(currentAreaId.value, e - 1);
scrollToElement("ref-news-list"); scrollToElement("ref-news-list");
} };
async function updateDate(id, page = 0) { async function updateDate(id, page = 0) {
const { data } = await getHotNewsByArea({ const { data } = await getHotNewsByArea({
moduleId: moduleId.value, moduleId: moduleId.value,
industryId: id ? id : null, industryId: id ? id : null,
currentPage: page, currentPage: page
}); });
data?.content?.forEach(item => { data?.content?.forEach(item => {
item.newsImage = item.coverUrl ?? "" item.newsImage = item.coverUrl ?? "";
}) });
NewsData.value = data ?? []; NewsData.value = data ?? [];
modulePage.value = (data?.number ?? 0) + 1; modulePage.value = (data?.number ?? 0) + 1;
} }
async function changeArea(id) { async function changeArea(id) {
await updateDate(id, 0) await updateDate(id, 0);
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@use '@/styles/common.scss' as *; @use "@/styles/common.scss" as *;
@import url("./style.css"); @import url("./style.css");
.float-btn { .float-btn {
position: absolute; position: absolute;
top: 24px; top: 24px;
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论