合并分支 'hsx' 到 'master'

src/components/base/newsList/NewsItem.vue

 <template>
   <el-space alignment="flex-start" :size="10">
-    <img :width="97" :height="72" :src="news ?? DefaultIconNews" alt="" />
+    <img :width="97" :height="72" :src="img ?? DefaultIconNews" alt="" />
     <el-space direction="vertical" alignment="flex-start" :size="0" fill>
       <div class="full-width flex-display">
         <common-text :line-limit="1" class="text-title-3-bold text-hover flex-fill"
@@ -26,7 +26,7 @@ import CommonText from "../texts/CommonText.vue";
 const props = defineProps({
   img: {
     type: String,
-    default: ''
+    default: null,
   },
   title: {
     type: String,

src/components/base/newsList/NewsItemMini.vue

 <template>
   <el-space alignment="flex-start" :size="10">
-    <img :width="64" :height="52" :src="news ?? DefaultIconNews" alt="" />
+    <img :width="64" :height="52" :src="img ?? DefaultIconNews" alt="" />
     <el-space direction="vertical" alignment="flex-start" :size="0">
       <common-text :line-limit="1" class="text-regular text-hover" color="var(--text-primary-80-color)">
         {{ title }}
@@ -20,7 +20,7 @@ import CommonText from "../texts/CommonText.vue";
 const props = defineProps({
   img: {
     type: String,
-    default: ''
+    default: null
   },
   title: {
     type: String,

src/components/base/newsList/NewsItemWithTag.vue

@@ -11,7 +11,7 @@
                 <area-tag v-for="(tag, index) in props.aeraTags" :key="index" :tagName="tag" />
             </el-space>
         </el-space>
-        <img style="width: 122px; height: 82px" :src="props.img">
+        <img style="width: 122px; height: 82px" :src="props.img ? props.img : DefaultIconNews">
     </div>
 </template>
 
@@ -26,7 +26,7 @@ const props = defineProps({
 
     img: {
         type: String,
-        default: 'img'
+        default: null
     },
     title: {
         type: String,

src/components/base/texts/IntelligentEntityText.vue

@@ -121,5 +121,6 @@ onMounted(processText)
 
 .p-regular-rereg {
     text-indent: 2em;
+    margin: 4px 0;
 }
 </style>
\ No newline at end of file

src/components/base/texts/TextTranslatePane.vue

@@ -9,8 +9,8 @@
             <el-button v-if="showMoreVisible" @click="() => { showMore = !showMore; updateText() }">
                 {{ showMore ? '收起' : '展开' }}
                 <el-icon>
-                    <arrow-down v-if="showMore" />
-                    <arrow-up v-else />
+                    <arrow-up v-if="showMore" />
+                    <arrow-down v-else />
                 </el-icon>
             </el-button>
         </div>

src/router/common.js

 import { useRouter } from "vue-router";
 export function useGotoPage() {
-    const router = useRouter();
-    return (path, data, isNewTabs = true) => {
-        console.log('path', path);
-        if (isNewTabs) {
-            // 打开新页面
-            const url = new URL(window.location.origin + path);
-            if (data) {
-                Object.entries(data).forEach(([key, value]) => {
-                    url.searchParams.append(key, value);
-                });
-            }
-            window.open(url.toString(), '_blank');
-        } else {
-            // 当前页面打开
-            router.push({ path, query: data });
-        }
-    }
-}
+	const router = useRouter();
+	return (path, data, isNewTabs = true) => {
+		console.log("path", path);
+		if (isNewTabs) {
+			// 打开新页面
+			const url = new URL(window.location.origin + path);
+			if (data) {
+				Object.entries(data).forEach(([key, value]) => {
+					url.searchParams.append(key, value);
+				});
+			}
+			window.open(url.toString(), "_blank");
+		} else {
+			// 当前页面打开
+			router.push({ path, query: data });
+		}
+	};
+}
\ No newline at end of file
+// 滚动到指定元素
+export function scrollToElement(elementId) {
+	document.getElementById(elementId).scrollIntoView({
+		behavior: "smooth", // 平滑滚动
+		block: "start" // 滚动到元素顶部
+	});
+}

src/styles/components/ActionButton/index.vue

@@ -48,14 +48,15 @@
 
 <script setup>
 import '@/styles/common.scss'
-import LeftBtn from '@/components/base/PageBtn/LeftBtn.vue'
-import RightBtn from '@/components/base/PageBtn/RightBtn.vue'
+import LeftBtn from '@/components/base/pageBtn/leftBtn.vue'
+import RightBtn from '@/components/base/pageBtn/rightBtn.vue'
 const span = 12
 </script>
 
 <style lang="scss" scoped>
 .button-box {
-  margin-left: 40px;;
+  margin-left: 40px;
+  ;
   display: flex;
   gap: 8px
 }

src/styles/components/News/index.vue

+<script setup lang="ts">
+import { ElRow, ElCol } from 'element-plus';
+import '@/styles/common.scss'
+import NewsItemMini from '@/components/base/newsList/NewsItemMini.vue'
+import NewsItem from '@/components/base/newsList/NewsItem.vue'
+import NewsItemWithTag from '@/components/base/newsList/NewsItemWithTag.vue'
+const span = 12
+const news = {
+    title: '新闻标题-老长了老长了老长了老长了老长了老长长了老长了',
+    content: '新闻内容-老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了老长了',
+    from: "2025.1.1 · 来源：中国",
+    aeraTags: ['人工智能', '深海']
+}
+</script>
+
+<template>
+    <el-row class="wrapper layout-grid-line">
+        <el-col :span="span">
+            <pre>
+{{ `import NewsItem from '@/components/base/newsList/NewsItem.vue'` }}
+</pre>
+            <news-item class="common-padding" :title="news.title" :content="news.content" :from="news.from"></news-item>
+        </el-col>
+        <el-col :span="span">
+            <pre>
+{{ `import NewsItemMini from '@/components/base/newsList/NewsItemMini.vue'` }}
+</pre>
+            <news-item-mini class="common-padding" :title="news.title" :content="news.content"
+                :from="news.from"></news-item-mini>
+        </el-col>
+        <el-col :span="span">
+            <pre>
+{{ `import NewsItemWithTag from '@/components/base/newsList/NewsItemWithTag.vue'` }}
+</pre>
+            <news-item-with-tag class="common-padding" :title="news.title" :content="news.content" :from="news.from"
+                :aeraTags="news.aeraTags"></news-item-with-tag>
+        </el-col>
+    </el-row>
+</template>
+
+<style lang="scss" scoped></style>
\ No newline at end of file

src/styles/components/RadioPage/index.vue

 <script setup lang="ts">
-import { ElRadioGroup, ElRadioButton, ElRow, ElCol } from 'element-plus';
+import { ElRadioGroup, ElRadioButton, ElRow, ElCol, ElSpace } from 'element-plus';
 import { ref } from 'vue';
 import '@/styles/radio.scss';
 
@@ -13,16 +13,36 @@ const span = 12
             <pre>
 {{ `import '@/styles/radio.scss';
 <template>
-    <el-radio-group class="radio-group-as-gap-btn">
+ <el-radio-group v-model="radio" class="radio-group-as-gap-btn">
+        <el-radio-button :value="1">选项1</el-radio-button>
+        <el-radio-button :value="2">选项2</el-radio-button>
+        <el-radio-button :value="3">选项3</el-radio-button>
+    </el-radio-group>
+    
+    <el-radio-group v-model="radio" class="radio-group-as-gap-btn">
+        <el-space :size="24">
+            <el-radio-button :value="1">选项1</el-radio-button>
+            <el-radio-button :value="2">选项2</el-radio-button>
+            <el-radio-button :value="3">选项3</el-radio-button>
+        </el-space>
     </el-radio-group>
 </template>
 `}}
 </pre>
-            <el-radio-group v-model="radio" class="radio-group-as-gap-btn">
-                <el-radio-button :value="1">选项1</el-radio-button>
-                <el-radio-button :value="2">选项2</el-radio-button>
-                <el-radio-button :value="3">选项3</el-radio-button>
-            </el-radio-group>
+            <el-space direction="vertical" fill>
+                <el-radio-group v-model="radio" class="radio-group-as-gap-btn">
+                    <el-radio-button :value="1">选项1</el-radio-button>
+                    <el-radio-button :value="2">选项2</el-radio-button>
+                    <el-radio-button :value="3">选项3</el-radio-button>
+                </el-radio-group>
+                <el-radio-group v-model="radio" class="radio-group-as-gap-btn">
+                    <el-space :size="24">
+                        <el-radio-button :value="1">选项1</el-radio-button>
+                        <el-radio-button :value="2">选项2</el-radio-button>
+                        <el-radio-button :value="3">选项3</el-radio-button>
+                    </el-space>
+                </el-radio-group>
+            </el-space>
         </el-col>
         <el-col :span="span">
             <pre>{{ `import '@/styles/radio.scss';\n <template>

src/styles/components/index.vue

@@ -28,6 +28,9 @@
                         <el-tab-pane label="人物" lazy>
                             <people-page />
                         </el-tab-pane>
+                        <el-tab-pane label="新闻" lazy>
+                            <news-page />
+                        </el-tab-pane>
                         <el-tab-pane label="预警面板" lazy>
                             <WarnningPane />
                         </el-tab-pane>
@@ -71,6 +74,7 @@ import GraphTreeChart from './GraphTreeChart/index.vue'
 import AreaTag from './AreaTag/index.vue'
 import ActionButton from './ActionButton/index.vue'
 import WordCloudChart from './WordCloudChart/index.vue'
+import NewsPage from './News/index.vue'
 </script>
 
 <style lang="scss" scoped>

src/styles/container.scss

@@ -16,4 +16,12 @@
 
 .common-padding {
     padding: 20px 24px;
+}
+
+.common-padding-h {
+    padding: 0px 24px;
+}
+
+.common-padding-v {
+    padding: 20px 0px;
 }
\ No newline at end of file

src/views/newsBrief/ModeuleNews.vue

@@ -4,10 +4,10 @@
                 <back />
             </el-icon> 返回</el-button>
         <el-space style="width: 993px;" direction="vertical" alignment="flex-start">
-            <div style="margin-top: 50px; margin-bottom: 24px; margin-left: 24px;">
+            <div id="ref-news-list" style="margin-top: 50px; margin-bottom: 24px; margin-left: 24px;">
                 <common-text class="text-title-0-show" color="var(--text-primary-90-color)">{{
                     moduleName
-                    }}</common-text>
+                }}</common-text>
                 <common-text class="text-regular"
                     color="var(--text-primary-65-color)">基于情报价值评估预测算法，掌握全球重要潜在动向</common-text>
             </div>
@@ -21,9 +21,12 @@
                     </el-space>
                 </el-radio-group>
                 <el-divider style="margin: 10px 0px;"></el-divider>
-                <div class="">
-                    <news-list :news="NewsData" />
+                <div v-if="NewsData?.content?.length > 0">
+                    <news-list :news="NewsData.content" />
                 </div>
+                <el-empty v-else></el-empty>
+                <el-pagination background layout="total, ->, prev, pager, next" :current-page="modulePage"
+                    :total="NewsData?.totalElements ?? 0" v-on:current-change="onCurrentChange" />
             </el-space>
         </el-space>
     </el-space>
@@ -36,32 +39,44 @@ import '@/styles/container.scss';
 import '@/styles/radio.scss';
 import NewsList from "./NewsList.vue";
 import { getAreaList, getHotNewsByArea } from "@/api/news/newsBrief";
-import { ElSpace, ElDivider, ElRadioButton, ElRadioGroup, ElButton, ElIcon } from "element-plus";
+import { ElSpace, ElDivider, ElRadioButton, ElRadioGroup, ElButton, ElIcon, ElEmpty, ElPagination } from "element-plus";
 import CommonText from "@/components/base/texts/CommonText.vue";
 import { useGotoNewsBrief } from "@/router/modules/news";
-
+import { scrollToElement } from "@/router/common";
+import { number } from "echarts";
 const route = useRoute();
 const gotoNewsBrief = useGotoNewsBrief();
 const moduleId = ref(route.params.id);
 const moduleName = ref(route.query.name ?? "");
-const NewsData = ref([]);
+const modulePage = ref(1);
+const NewsData = ref({});
 const AreaList = ref([]);
 const currentAreaId = ref("");
+
 onMounted(async () => {
     console.log(route.query.name, moduleId.value, moduleName.value);
     const { data: areaList } = await getAreaList();
     AreaList.value = areaList ?? [];
-    await changeArea("")
+    await updateDate("")
 });
-async function changeArea(id) {
+const onCurrentChange = async e => {
+    await updateDate(currentAreaId.value, e - 1)
+    scrollToElement("ref-news-list");
+}
+async function updateDate(id, page = 0) {
     const { data } = await getHotNewsByArea({
         moduleId: moduleId.value,
         industryId: id ? id : null,
+        currentPage: page,
     });
-    data?.forEach(item => {
+    data?.content?.forEach(item => {
         item.newsImage = item.coverUrl ?? ""
     })
     NewsData.value = data ?? [];
+    modulePage.value = (data?.number ?? 0) + 1;
+}
+async function changeArea(id) {
+    await updateDate(id, 0)
 }
 
 </script>

src/views/newsBrief/NewsDetial.vue

@@ -41,22 +41,27 @@
                         译文
                     </el-button>
                 </div>
-                <text-translate-pane class="common-padding" :texts-raw="textEns" :texts-translate="textZns"
+                <text-translate-pane class="common-padding-h" :texts-raw="textEns" :texts-translate="textZns"
                     :text-entities="textEntities" :is-open-translation="isOpenTranslation"
                     :is-highlight-entity="isHightLightEntity">
                 </text-translate-pane>
+                <div>
+                    <img v-if="newsDetail.coverUrl" class="common-padding" :src="newsDetail.coverUrl" :width="320"
+                        :height="240" />
+                </div>
             </el-space>
-            <el-space direction="vertical" class="background-as-card relation-news-box" alignment="flex-start">
+            <el-space direction="vertical" class="background-as-card relation-news-box" fill>
                 <el-space style="margin-top: 10px;">
                     <color-prefix-title height="20px">
                         <div class="text-title-2-bold">相关新闻</div>
                     </color-prefix-title>
                 </el-space>
-                <el-space direction="vertical" fill class="common-padding">
+                <el-space v-if="relationNews?.length > 0" direction="vertical" fill class="common-padding">
                     <news-item-mini v-for="item in relationNews" :key="item.newsId" :news="item" :img="item.newsImage"
                         :title="item.newsTitle" :from="`${item.newsDate} · ${item.newsOrg}`"
                         @click="gotoNewsDetail(item.newsId)" />
                 </el-space>
+                <el-empty v-else style=""></el-empty>
             </el-space>
         </div>
     </el-scrollbar>
@@ -67,7 +72,7 @@ import '@/styles/container.scss';
 import '@/styles/common.scss';
 import { ref, onMounted } from "vue";
 import { useRoute } from "vue-router";
-import { ElSpace, ElButton, ElScrollbar, ElSwitch } from "element-plus";
+import { ElSpace, ElButton, ElScrollbar, ElSwitch, ElEmpty, ElImage } from "element-plus";
 import CommonText from "@/components/base/texts/CommonText.vue";
 import AreaTag from "@/components/base/AreaTag/index.vue";
 import ColorPrefixTitle from '@/components/base/texts/ColorPrefixTitle.vue';