From 3129d239a6a4aeea330569e7ed37366d64701d3f Mon Sep 17 00:00:00 2001 From: zzp <34701892@qq.com> Date: Mon, 22 Sep 2025 14:28:09 +0800 Subject: [PATCH] =?UTF-8?q?feat(=E8=B5=84=E8=AE=AF=E5=A4=B4=E6=9D=A1):=20?= =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=97=A5=E6=9C=9F=E7=AD=9B=E9=80=89=E5=8A=9F?= =?UTF-8?q?=E8=83=BD=E5=B9=B6=E4=BF=AE=E6=94=B9API=E8=AF=B7=E6=B1=82?= =?UTF-8?q?=E5=8F=82=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 在资讯头条页面添加日历组件,允许用户选择日期范围进行筛选。同时修改getTopNews API请求参数,支持按日期范围查询数据。新增时间格式化工具函数用于处理日期参数。 --- src/api/newsInfo.ts | 4 +- src/pages/realtimeInfo/index.vue | 86 +++++++++++++++++++++++++++++++- 2 files changed, 86 insertions(+), 4 deletions(-) diff --git a/src/api/newsInfo.ts b/src/api/newsInfo.ts index 662973e..e7e9408 100644 --- a/src/api/newsInfo.ts +++ b/src/api/newsInfo.ts @@ -17,8 +17,8 @@ export const getConceptCount = (data: any) => { // 概念标签贴标 export const getTopNews = (data: any) => { - return request.get("/top_news_h5_d", data); - // return request.get("/top_news_release_h5_all", data); + return request.get("/top_news_h5_period?start_date=" + data.start_date + "&end_date=" + data.end_date + "&limit_num=" + data.limit_num, data); + // return request.get("/top_news_h5_d", data); }; // 概念标签贴标 export const getTopNewsAll = (data: any) => { diff --git a/src/pages/realtimeInfo/index.vue b/src/pages/realtimeInfo/index.vue index 9f4f685..e9e0f67 100644 --- a/src/pages/realtimeInfo/index.vue +++ b/src/pages/realtimeInfo/index.vue @@ -64,7 +64,10 @@ - +
+ + +
@@ -99,6 +102,8 @@ @handlePopupClose="handlePopupClose" @handlePopupSuccessCallback="handlePopupSuccessCallback" @handlePopupErrorCallback="handlePopupErrorCallback" /> + + @@ -122,6 +127,7 @@ import indexMenuTitle from "@/components/indexMenuTitle.vue"; // 路径根据实 import dayjs from "dayjs/esm/index"; import HotIndustryList from "@/components/HotIndustryList.vue"; // 路径根据实际调整 +const calendarShow = ref(false); const newsList = ref([]); const lastLeftNum = ref(0); @@ -149,9 +155,33 @@ async function getTopNum() { lastRightNum.value = topNum.value.rightNum; } +const chooseDate = reactive({ + startDate: null, + endDate: null, +}); +const today = new Date(); + +function calendarConfirm(dateList) { + if (dateList && dateList.length > 0) { + chooseDate.startDate = dateList[0]; + chooseDate.endDate = dateList[dateList.length - 1]; + } + getNewsList(); + calendarShow.value = false; + console.log("🚀 ~ calendarConfirm ~ chooseDate:", chooseDate); +} + // 概念标签贴标 async function getNewsList() { - newsList.value = await getTopNews({}); + newsList.value = await getTopNews({ + start_date: chooseDate.startDate + ? timeFormat(chooseDate.startDate) + : timeFormat(new Date(today.getFullYear(), today.getMonth(), today.getDate(), 0, 0, 0, 0)), + end_date: chooseDate.endDate + ? timeFormat(chooseDate.endDate) + : timeFormat(new Date(today.getFullYear(), today.getMonth(), today.getDate(), 12, 0, 0, 0)), + limit_num: 20, + }); } // 热门行业top10 @@ -208,6 +238,10 @@ const timer = setInterval(() => { initData(); }, 5000); +function showCalendar() { + calendarShow.value = true; +} + const LoginShow = ref(false); const isLoginStatus = ref(); // 关闭弹框 @@ -244,6 +278,54 @@ onMounted(async () => { LoginShow.value = true; } }); + +/** + * @description 格式化时间 + * @param {String|Number} dateTime 需要格式化的时间戳 + * @param {String} fmt 格式化规则 yyyy:mm:dd|yyyy:mm|yyyy年mm月dd日|yyyy年mm月dd日 hh时MM分等,可自定义组合 默认yyyy-mm-dd + * @returns {string} 返回格式化后的字符串 + */ +function timeFormat(dateTime = null, formatStr = "yyyy-mm-dd hh:MM:ss") { + let date; + // 若传入时间为假值,则取当前时间 + if (!dateTime) { + date = new Date(); + } + // 若为unix秒时间戳,则转为毫秒时间戳(逻辑有点奇怪,但不敢改,以保证历史兼容) + else if (/^\d{10}$/.test(dateTime.toString().trim())) { + date = new Date(dateTime * 1000); + } + // 若用户传入字符串格式时间戳,new Date无法解析,需做兼容 + else if (typeof dateTime === "string" && /^\d+$/.test(dateTime.trim())) { + date = new Date(Number(dateTime)); + } + // 其他都认为符合 RFC 2822 规范 + else { + // 处理平台性差异,在Safari/Webkit中,new Date仅支持/作为分割符的字符串时间 + date = new Date(typeof dateTime === "string" ? dateTime.replace(/-/g, "/") : dateTime); + } + + const timeSource = { + y: date.getFullYear().toString(), // 年 + m: (date.getMonth() + 1).toString().padStart(2, "0"), // 月 + d: date.getDate().toString().padStart(2, "0"), // 日 + h: date.getHours().toString().padStart(2, "0"), // 时 + M: date.getMinutes().toString().padStart(2, "0"), // 分 + s: date.getSeconds().toString().padStart(2, "0"), // 秒 + // 有其他格式化字符需求可以继续添加,必须转化成字符串 + }; + + for (const key in timeSource) { + const [ret] = new RegExp(`${key}+`).exec(formatStr) || []; + if (ret) { + // 年可能只需展示两位 + const beginIndex = key === "y" && ret.length === 2 ? 2 : 0; + formatStr = formatStr.replace(ret, timeSource[key].slice(beginIndex)); + } + } + + return formatStr; +}