From 2fbd8ade5be8e9e675b3fecf135a38155458560e Mon Sep 17 00:00:00 2001
From: liyijie <13605448550@163.com>
Date: Mon, 3 Nov 2025 15:08:39 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8B=9B=E8=81=98=E4=BC=9A=E6=A8=A1=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packageA/pages/UnitDetails/UnitDetails.vue |  98 +++++++-----
 packageA/pages/exhibitors/exhibitors.vue   | 118 ++++++++++----
 pages/careerfair/careerfair.vue            | 177 ++++++++++-----------
 3 files changed, 236 insertions(+), 157 deletions(-)

diff --git a/packageA/pages/UnitDetails/UnitDetails.vue b/packageA/pages/UnitDetails/UnitDetails.vue
index aa2a086..c11cc7d 100644
--- a/packageA/pages/UnitDetails/UnitDetails.vue
+++ b/packageA/pages/UnitDetails/UnitDetails.vue
@@ -47,43 +47,31 @@
           <view class="Detail-title"><text class="title">在招职位</text></view>
           <template v-if="companyInfo.jobInfoList.length != 0">
             <view v-for="job in companyInfo.jobInfoList" :key="job.id">
-              <view class="cards" @click="navTo(`/packageA/pages/post/post?jobId=${JSON.stringify(job)}`)">
+              <!-- @click="navTo(`/packageA/pages/post/post?jobId=${JSON.stringify(job)}`)" -->
+              <view class="cards" :style="getItemBackgroundStyle('bj2.png')">
                 <view class="card-company">
                   <text class="company">{{ job.jobTitle }}</text>
-                  <view class="salary"> {{ job.salaryRange }}元 </view>
+                  <view class="salary"> ￥{{ job.salaryRange }}/月 </view>
                 </view>
-                <view class="card-companyName">{{ job.companyName }}</view>
-                <view class="card-companyName">{{ job.jobDescription }}</view>
                 <view class="card-tags">
-                  <view class="tag">
-                    {{ job.educationRequirement }}
-                  </view>
-                  <view class="tag">
+                  <view class="tag jy">
+									  <image :src="`${baseUrl}/jobfair/jy.png`" mode=""></image>
                     {{ job.experienceRequirement }}
                   </view>
-                  <!-- <view class="tag">
-                 {{ vacanciesTo(job.vacancies) }}
-                </view> -->
-                  <view class="tag" v-if="job.jobRequirement">
+                  <view class="tag xl">
+									<image :src="`${baseUrl}/jobfair/xx.png`" mode=""></image>
+                    {{ job.educationRequirement }}
+                  </view>
+                  <view class="tag yd" v-if="job.jobRequirement">
+									<image :src="`${baseUrl}/jobfair/lx-1.png`" mode=""></image>
                     {{ job.jobRequirement }}
                   </view>
                 </view>
-                <view class="card-bottom">
-                  <view>{{ job.postingDate }}</view>
-                  <view>
-                    <convert-distance
-                      :alat="job.latitude"
-                      :along="job.longitude"
-                      :blat="latitude"
-                      :blong="longitude"
-                    ></convert-distance>
-                    <dict-Label
-                      class="mar_le10"
-                      dictType="area"
-                      :value="job.jobLocationAreaCode"
-                    ></dict-Label>
+                <view class="card-companyName">
+									<image :src="`${baseUrl}/jobfair/hd.png`" mode=""></image>
+                  {{ job.jobDescription }}
                   </view>
-                </view>
+
               </view>
             </view>
           </template>
@@ -95,15 +83,14 @@
 </template>
 
 <script setup>
-import point from "@/static/icon/point.png";
 import { reactive, inject, watch, ref, onMounted, computed } from "vue";
 import { onLoad, onShow } from "@dcloudio/uni-app";
 import dictLabel from "@/components/dict-Label/dict-Label.vue";
+import config from "@/config.js";
 import { storeToRefs } from "pinia";
 import useLocationStore from "@/stores/useLocationStore";
 const { longitudeVal, latitudeVal } = storeToRefs(useLocationStore());
 const { $api, navTo, vacanciesTo, navBack } = inject("globalFunction");
-
 const isExpanded = ref(false);
 const pageState = reactive({
   page: 0,
@@ -112,7 +99,17 @@ const pageState = reactive({
   maxPage: 1,
   pageSize: 10,
 });
-const companyInfo = ref({});
+const companyInfo = ref({
+  jobInfoList: [],
+});
+
+const baseUrl = config.imgBaseUrl;
+const getItemBackgroundStyle = (imageName) => ({
+  backgroundImage: `url(${baseUrl}/jobfair/${imageName})`,
+  backgroundSize: "100% 100%", // 覆盖整个容器
+  backgroundPosition: "center", // 居中
+  backgroundRepeat: "no-repeat",
+});
 
 onLoad((options) => {
   companyInfo.value = JSON.parse(options.job);
@@ -268,6 +265,7 @@ image {
       box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0, 0, 0, 0.04);
       border-radius: 20rpx 20rpx 20rpx 20rpx;
       margin-top: 22rpx;
+      padding-bottom: 18rpx;
 
       .card-company {
         display: flex;
@@ -275,15 +273,15 @@ image {
         align-items: flex-start;
 
         .company {
-          font-weight: 500;
+          font-weight: 600;
           font-size: 32rpx;
           color: #333333;
         }
 
         .salary {
-          font-weight: 500;
+          font-weight: 600;
           font-size: 28rpx;
-          color: #4C6EFB;
+          color: #F83A3C;
           white-space: nowrap;
           line-height: 48rpx;
         }
@@ -292,27 +290,53 @@ image {
       .card-companyName {
         font-weight: 400;
         font-size: 28rpx;
-        color: #6C7282;
+        color: #fff;
+        margin-top: 23rpx;
+        display: flex;
+        align-items: center;
+        image{
+          width: 24rpx;
+          height: 24rpx;
+          margin-right: 8rpx;
+        }
       }
 
       .card-tags {
         display: flex;
         flex-wrap: wrap;
+          margin: 25rpx 0 35rpx;
+          image{
+            width: 24rpx;
+            height: 24rpx;
+            margin-right: 8rpx;
+          }
+        .jy {
+          background: #D9EDFF;
+          color: #0086FF;
+        }
+
+        .xl {
+          background: #FFF1D5;
+          color: #FF7F01;
+        }
+        .yd {
+          background: #FFD8D8;
+          color: #F83A3C;
+        }
 
         .tag {
           width: fit-content;
           height: 30rpx;
-          background: #F4F4F4;
           border-radius: 4rpx;
           padding: 6rpx 20rpx;
           line-height: 30rpx;
           font-weight: 400;
           font-size: 24rpx;
-          color: #6C7282;
           text-align: center;
-          margin-top: 14rpx;
           white-space: nowrap;
           margin-right: 20rpx;
+          display: flex;
+          align-items: center;
         }
       }
 
diff --git a/packageA/pages/exhibitors/exhibitors.vue b/packageA/pages/exhibitors/exhibitors.vue
index b2cbab3..2219672 100644
--- a/packageA/pages/exhibitors/exhibitors.vue
+++ b/packageA/pages/exhibitors/exhibitors.vue
@@ -68,31 +68,37 @@
 						<text class="title">参会单位（{{ companyList.length }}）</text>
 					</view>
 					<view v-for="job in companyList" :key="job.id">
-					    <view class="cards" @click="navTo('/packageA/pages/UnitDetails/UnitDetails?job='+JSON.stringify(job))">
-					        <view class="card-company">
-					            <text class="company line_1">{{ job.companyName }}</text>
-					        </view>
-					        <view class="card-bottom">
-					            <view class="fl_box fs_14">
-					                {{ job.scale }}
-					            </view>
-					            <view class="ris">
-					                <text class="fs_14">
-					                    在招职位·
-					                    <text class="color_256BFA">{{ job.jobInfoList.length || '-' }}</text>
-					                    个
-					                </text>
-					            </view>
-					        </view>
-					        <view class="card-tags">
-					            <view class="tag" v-if="job.industry">
-					                {{ job.industry }}
-					            </view>
-					            <view class="tag">
-					                {{ job.companyType }}
-					            </view>
-					        </view>
-					    </view>
+						<view class="cards" :style="getItemBackgroundStyle('bj.png')"
+							@click="navTo('/packageA/pages/UnitDetails/UnitDetails?job='+JSON.stringify(job))">
+							<view class="card-company">
+								<view class="company line_1">
+									<image :src="`${baseUrl}/jobfair/mc.png`" mode=""></image>
+									{{ job.companyName }}
+								</view>
+								<view class="ris">
+									<text class="fs_14">
+										在招职位：
+										{{ job.jobInfoList.length || '-' }}
+										个
+									</text>
+								</view>
+							</view>
+							<view class="card-bottom">
+								<view class="fl_box fs_14">
+									{{ job.scale }}
+								</view>
+							</view>
+							<view class="card-tags">
+								<view class="tag" v-if="job.industry">
+									<image :src="`${baseUrl}/jobfair/hy.png`" mode=""></image>
+									{{ job.industry }}
+								</view>
+								<view class="tag">
+									<image :src="`${baseUrl}/jobfair/lx.png`" mode=""></image>
+									{{ job.companyType }}
+								</view>
+							</view>
+						</view>
 					</view>
 				</view>
 			</scroll-view>
@@ -109,7 +115,7 @@
 </template>
 
 <script setup>
-	import point from '@/static/icon/point.png';
+	import config from "@/config.js"
 	import {
 		reactive,
 		inject,
@@ -142,6 +148,14 @@
 	const fairInfo = ref({});
 	const companyList = ref([]);
 	const hasnext = ref(true);
+
+	const baseUrl = config.imgBaseUrl
+	const getItemBackgroundStyle = (imageName) => ({
+		backgroundImage: `url(${baseUrl}/jobfair/${imageName})`,
+		backgroundSize: '100% 100%', // 覆盖整个容器
+		backgroundPosition: 'center', // 居中
+		backgroundRepeat: 'no-repeat'
+	});
 	onLoad((options) => {
 		getCompanyInfo(options.jobFairId);
 	});
@@ -241,19 +255,24 @@
 		// 判断状态：0 开始中，1 过期，2 待开始
 		let status = 0;
 		let statusText = '开始中';
+		let color = '#13C57C'; // 进行中 - 绿色
 		if (now < startTime) {
 			status = 2; // 待开始
 			statusText = '待开始';
+			color = '#015EEA'; // 未开始 - 蓝色
 		} else if (now > endTime) {
 			status = 1; // 已过期
 			statusText = '已过期';
+			color = '#999999'; // 已过期 - 灰色
 		} else {
 			status = 0; // 进行中
 			statusText = '进行中';
+			color = '#13C57C'; // 进行中 - 绿色
 		}
 		return {
 			status, // 0: 进行中，1: 已过期，2: 待开始
 			statusText,
+			color
 		};
 	}
 
@@ -291,25 +310,30 @@
 		height: 100%;
 		display: flex;
 		flex-direction: column;
+
 		.content-top {
 			padding: 28rpx;
 			padding-top: 50rpx;
 			display: flex;
 			flex-direction: row;
 			flex-wrap: nowrap;
+
 			.companyinfo-left {
 				width: 96rpx;
 				height: 96rpx;
 				margin-right: 24rpx;
 			}
+
 			.companyinfo-right {
 				flex: 1;
+
 				.row1 {
 					font-weight: 500;
 					font-size: 32rpx;
 					color: #333333;
 					font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif;
 				}
+
 				.row2 {
 					font-weight: 400;
 					font-size: 28rpx;
@@ -348,6 +372,7 @@
 					align-items: center;
 					justify-content: space-between;
 					white-space: nowrap;
+
 					.info-title {
 						font-weight: 600;
 						font-size: 28rpx;
@@ -496,10 +521,19 @@
 					display: flex;
 					justify-content: space-between;
 					align-items: flex-start;
+
 					.company {
-						font-weight: 500;
+						font-weight: 600;
 						font-size: 32rpx;
 						color: #333333;
+						display: flex;
+						align-items: center;
+						image {
+							width: 30rpx;
+							height: 30rpx;
+							margin-right: 10rpx;
+
+						}
 					}
 
 					.salary {
@@ -508,6 +542,13 @@
 						white-space: nowrap;
 						line-height: 48rpx;
 					}
+
+					.ris {
+						background: #53ACFF;
+						color: #fff;
+						padding: 7rpx 20rpx;
+						border-radius: 8rpx;
+					}
 				}
 
 				.card-companyName {
@@ -519,25 +560,33 @@
 				.card-tags {
 					display: flex;
 					flex-wrap: wrap;
+
 					.tag {
 						width: fit-content;
 						height: 30rpx;
-						background: #F4F4F4;
+						background: #E0F0FF;
 						border-radius: 4rpx;
-						padding: 6rpx 20rpx;
+						padding: 6rpx 26rpx;
 						line-height: 30rpx;
 						font-weight: 400;
 						font-size: 24rpx;
-						color: #6C7282;
+						color: #595959;
 						text-align: center;
 						margin-top: 14rpx;
 						white-space: nowrap;
+						display: flex;
+						align-items: center;
 						margin-right: 20rpx;
+						image{
+							width: 22rpx;
+							height: 22rpx;
+							margin-right: 8rpx;
+						}
 					}
 				}
 
 				.card-bottom {
-					margin-top: 32rpx;
+					margin-top: 15rpx;
 					display: flex;
 					justify-content: space-between;
 					font-size: 28rpx;
@@ -552,14 +601,17 @@
 		justify-content: space-between;
 		align-items: center;
 		padding: 24rpx 30rpx 10rpx 30rpx;
+
 		.time-left,
 		.time-right {
 			text-align: center;
+
 			.left-date {
 				font-weight: 500;
 				font-size: 48rpx;
 				color: #333333;
 			}
+
 			.left-dateDay {
 				font-weight: 400;
 				font-size: 24rpx;
@@ -567,23 +619,27 @@
 				margin-top: 12rpx;
 			}
 		}
+
 		.line {
 			width: 40rpx;
 			height: 0rpx;
 			border: 2rpx solid #D4D4D4;
 			margin-top: 64rpx;
 		}
+
 		.time-center {
 			text-align: center;
 			display: flex;
 			flex-direction: column;
 			justify-content: center;
 			align-items: center;
+
 			.center-date {
 				font-weight: 400;
 				font-size: 28rpx;
 				color: #FF881A;
 			}
+
 			.center-dateDay {
 				font-weight: 400;
 				font-size: 24rpx;
diff --git a/pages/careerfair/careerfair.vue b/pages/careerfair/careerfair.vue
index e22e5fa..2b49310 100644
--- a/pages/careerfair/careerfair.vue
+++ b/pages/careerfair/careerfair.vue
@@ -47,23 +47,6 @@
             v-model="pageState.jobFairTitle"
           />
         </view>
-        <!-- <view class="header-date">
-                    <view class="data-week">
-                        <view
-                            class="weel-days button-click"
-                            :class="{ active: currentDay.fullDate === item.fullDate }"
-                            v-for="(item, index) in weekList"
-                            :key="index"
-                            @click="selectDate(item)"
-                        >
-                            <view class="label">{{ item.day }}</view>
-                            <view class="day">{{ item.date }}</view>
-                        </view>
-                    </view>
-                    <view class="data-all">
-                        <image class="allimg button-click" @click="toSelectDate" src="/static/icon/date1.png"></image>
-                    </view>
-                </view> -->
       </view>
 
       <!-- 主体内容区域 -->
@@ -85,17 +68,14 @@
                 )
               "
             >
-              <view class="card-title">{{ item.jobFairTitle }}</view>
+              <view class="card-title">
+                {{ item.jobFairTitle }}
+                <view class="center-date" :style="{ color: getTimeStatus(item.jobFairStartTime, item.jobFairEndTime).color }">
+                  {{ getTimeStatus(item.jobFairStartTime, item.jobFairEndTime).statusText }}
+                </view>
+              </view>
               <view class="card-row">
                 <text class="">{{ item.jobFairAddress }}</text>
-                <text class="">
-                  <convert-distance
-                    :alat="item.latitude"
-                    :along="item.longitude"
-                    :blat="latitudeVal"
-                    :blong="longitudeVal"
-                  ></convert-distance>
-                </text>
               </view>
               <view class="card-times">
                 <view class="time-left">
@@ -108,12 +88,6 @@
                 </view>
                 <view class="line"></view>
                 <view class="time-center">
-                  <view class="center-date">
-                    {{
-                      getTimeStatus(item.jobFairStartTime, item.jobFairEndTime)
-                        .statusText
-                    }}
-                  </view>
                   <view class="center-dateDay">
                     {{
                       getHoursBetween(
@@ -161,6 +135,7 @@ import useLocationStore from "@/stores/useLocationStore";
 import { storeToRefs } from "pinia";
 import { tabbarManager } from "@/utils/tabbarManager";
 import WxAuthLogin from "@/components/WxAuthLogin/WxAuthLogin.vue";
+import config from "@/config.js";
 const { longitudeVal, latitudeVal } = storeToRefs(useLocationStore());
 const wxAuthLoginRef = ref(null);
 const { $api, navTo, cloneDeep } = inject("globalFunction");
@@ -180,6 +155,7 @@ const pageState = reactive({
   pageSize: 10,
   jobFairTitle: "",
 });
+const baseUrl = config.imgBaseUrl;
 
 onLoad(() => {
   // const today = new Date();
@@ -246,7 +222,7 @@ function changeSwiperMsgType(e) {
 
 function seemsg(index) {
   state.current = index;
-  console.log(index, 'index');
+  console.log(index, "index");
 
   if (index != 3) {
     getFair("refresh");
@@ -276,7 +252,7 @@ const handleScrollToLower = () => {
     } else {
       this.$nextTick(() => {
         getMyFair();
-      })
+      });
     }
   }
 };
@@ -337,16 +313,18 @@ function getMyFair(type = "add") {
       params.personId = userInfo.value.info.userId;
     }
   }
-  $api.myRequest("/jobfair/public/jobfair/enterprise/my-sign-up-job-fair", params).then((resData) => {
-    if (type === "add") {
-      const reslist = resData.data.list;
-      fairList.value = fairList.value.concat(reslist);
-    } else {
-      fairList.value = resData.data.list;
-    }
-    pageState.total = resData.data.total;
-    pageState.maxPage = resData.data.pages;
-  });
+  $api
+    .myRequest("/jobfair/public/jobfair/enterprise/my-sign-up-job-fair", params)
+    .then((resData) => {
+      if (type === "add") {
+        const reslist = resData.data.list;
+        fairList.value = fairList.value.concat(reslist);
+      } else {
+        fairList.value = resData.data.list;
+      }
+      pageState.total = resData.data.total;
+      pageState.maxPage = resData.data.pages;
+    });
 }
 function getFair(type = "add") {
   if (type === "refresh") {
@@ -384,18 +362,18 @@ function getFair(type = "add") {
 function toIOSDate(input) {
   if (!input) return null;
   if (input instanceof Date) return isNaN(input.getTime()) ? null : input;
-  if (typeof input === 'number') {
+  if (typeof input === "number") {
     const d = new Date(input);
     return isNaN(d.getTime()) ? null : d;
   }
-  if (typeof input !== 'string') return null;
+  if (typeof input !== "string") return null;
   let s = input.trim();
   // "YYYY-MM-DD HH:mm[:ss]" -> "YYYY-MM-DDTHH:mm[:ss]"
   if (/^\d{4}-\d{2}-\d{2}\s+\d{2}:\d{2}(:\d{2})?$/.test(s)) {
-    s = s.replace(' ', 'T');
+    s = s.replace(" ", "T");
     // 仅到分钟则补秒
     if (/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}$/.test(s)) {
-      s = s + ':00';
+      s = s + ":00";
     }
   }
   // 其余已是 iOS 可解析格式："YYYY/MM/DD[ HH:mm:ss]"、"YYYY-MM-DD"、ISO 8601 等
@@ -406,23 +384,23 @@ function toIOSDate(input) {
 function parseDateTime(datetimeStr) {
   if (!datetimeStr)
     return {
-      time: '',
-      date: '',
+      time: "",
+      date: "",
     };
 
   const dateObj = toIOSDate(datetimeStr);
 
   if (!dateObj)
     return {
-      time: '',
-      date: '',
+      time: "",
+      date: "",
     }; // 无效时间
 
   const year = dateObj.getFullYear();
-  const month = String(dateObj.getMonth() + 1).padStart(2, '0');
-  const day = String(dateObj.getDate()).padStart(2, '0');
-  const hours = String(dateObj.getHours()).padStart(2, '0');
-  const minutes = String(dateObj.getMinutes()).padStart(2, '0');
+  const month = String(dateObj.getMonth() + 1).padStart(2, "0");
+  const day = String(dateObj.getDate()).padStart(2, "0");
+  const hours = String(dateObj.getHours()).padStart(2, "0");
+  const minutes = String(dateObj.getMinutes()).padStart(2, "0");
 
   return {
     time: `${hours}:${minutes}`,
@@ -436,25 +414,30 @@ function getTimeStatus(startTimeStr, endTimeStr) {
   const endTime = toIOSDate(endTimeStr);
 
   if (!startTime || !endTime) {
-    return { status: 1, statusText: '时间异常' };
+    return { status: 1, statusText: "时间异常", color: "#999999" };
   }
 
-  // 判断状态：0 开始中，1 过期，2 待开始
+  // 判断状态：0 开始中，1 过期，2 未开始
   let status = 0;
-  let statusText = '开始中';
+  let statusText = "开始中";
+  let color = "#13C57C"; // 进行中 - 绿色
   if (now < startTime) {
-    status = 2; // 待开始
-    statusText = '待开始';
+    status = 2; // 未开始
+    statusText = "未开始";
+    color = "#015EEA"; // 未开始 - 蓝色
   } else if (now > endTime) {
     status = 1; // 已过期
-    statusText = '已过期';
+    statusText = "已过期";
+    color = "#999999"; // 已过期 - 灰色
   } else {
     status = 0; // 进行中
-    statusText = '进行中';
+    statusText = "进行中";
+    color = "#13C57C"; // 进行中 - 绿色
   }
   return {
-    status, // 0: 进行中，1: 已过期，2: 待开始
+    status, // 0: 进行中，1: 已过期，2: 未开始
     statusText,
+    color
   };
 }
 
@@ -481,7 +464,7 @@ const selectDate = (item) => {
 };
 
 function getNextDates({ startDate = "", count = 6 }) {
-  const baseDate = startDate ? (toIOSDate(startDate) || new Date()) : new Date(); // 指定起点或今天
+  const baseDate = startDate ? toIOSDate(startDate) || new Date() : new Date(); // 指定起点或今天
   const dates = [];
   const dayNames = ["日", "一", "二", "三", "四", "五", "六"];
 
@@ -507,7 +490,7 @@ function getNextDates({ startDate = "", count = 6 }) {
 }
 </script>
 
-<style scoped>
+<style scoped lang="stylus">
 .app-custom-root {
   position: fixed;
   z-index: 10;
@@ -659,7 +642,7 @@ function getNextDates({ startDate = "", count = 6 }) {
 .cards .card {
   margin-top: 28rpx;
   padding: 32rpx;
-  background: #ffffff;
+  background: linear-gradient(to bottom, #e3efff 0%, #fbfdff 100%);
   box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0, 0, 0, 0.04);
   border-radius: 20rpx;
 }
@@ -667,18 +650,36 @@ function getNextDates({ startDate = "", count = 6 }) {
 .cards .card-title {
   font-family: "PingFangSC-Medium", "PingFang SC", "Helvetica Neue", Helvetica,
     Arial, "Microsoft YaHei", sans-serif;
-  font-weight: 500;
-  font-size: 32rpx;
-  color: #333333;
+  font-weight: 600;
+  font-size: 34rpx;
+  color: #005eb6;
+  text-align: center;
+  position relative
+  &::after {
+    content: "";
+    width: 120rpx;
+    height: 4rpx;
+    background: linear-gradient(to right, #015EEA 0%, #00C0FA 100%);
+    position: absolute;
+    left: 50%;
+    bottom: -14rpx;
+    transform: translate(-50%, -50%);
+  }
+  .center-date {
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #ff881a;
+    position: absolute;
+    right: 0;
+  }
 }
 
 .cards .card-row {
   display: flex;
-  justify-content: space-between;
-  font-weight: 400;
-  font-size: 28rpx;
-  color: #495265;
-  margin-top: 4rpx;
+  justify-content: center;
+  font-size: 26rpx;
+  color: #3e8ff3;
+  margin-top: 23rpx;
 }
 
 .cards .card-times {
@@ -694,11 +695,13 @@ function getNextDates({ startDate = "", count = 6 }) {
 }
 
 .cards .card-times .left-date {
-  font-weight: 500;
+  font-weight: 600;
   font-size: 48rpx;
-  color: #333333;
   font-family: "PingFangSC-Medium", "PingFang SC", "Helvetica Neue", Helvetica,
     Arial, "Microsoft YaHei", sans-serif;
+    background: linear-gradient(180deg, #015EEA 0%, #00C0FA 100%);
+-webkit-background-clip: text;
+-webkit-text-fill-color: transparent;
 }
 
 .cards .card-times .left-dateDay {
@@ -710,8 +713,8 @@ function getNextDates({ startDate = "", count = 6 }) {
 
 .cards .card-times .line {
   width: 40rpx;
-  height: 0;
-  border: 2rpx solid #d4d4d4;
+  height: 2rpx;
+  background: #7BB6FF;
   margin-top: 64rpx;
 }
 
@@ -723,30 +726,25 @@ function getNextDates({ startDate = "", count = 6 }) {
   align-items: center;
 }
 
-.cards .card-times .time-center .center-date {
-  font-weight: 400;
-  font-size: 28rpx;
-  color: #ff881a;
-  padding-top: 10rpx;
-}
 
 .cards .card-times .time-center .center-dateDay {
   font-weight: 400;
   font-size: 24rpx;
-  color: #333333;
+  color: #fff;
   margin-top: 6rpx;
   line-height: 48rpx;
-  width: 104rpx;
+  width: max-content;
   height: 48rpx;
-  background: #f9f9f9;
+  background: #71B1FF;
   border-radius: 8rpx;
+  padding: 0 30rpx;
 }
 
 .cards .recommend-card-line {
   width: 100%;
   height: 0;
   border-radius: 0;
-  border: 2rpx dashed rgba(0, 0, 0, 0.14);
+  border-bottom: 2rpx dashed rgba(0, 0, 0, 0.14);
   margin-top: 32rpx;
   position: relative;
 }
@@ -781,6 +779,7 @@ function getNextDates({ startDate = "", count = 6 }) {
   font-weight: 400;
   font-size: 28rpx;
   color: #6c7282;
+  text-align: center;
 }
 
 .cards .card:first-child {