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;
+}