修改页面

packageRc/pages/index/index.vue

@@ -5,8 +5,16 @@
 -->
 <template>
   <!-- @scroll="handleScroll" @scrolltolower="scrollBottom" -->
-  <scroll-view :scroll-y="true" class="container" :class="{'h5-pc-container': isH5}" :show-scrollbar="false" style="background-image: url(../../../packageRc/static/pageBgIndex.png);">
+  <scroll-view :scroll-y="true" class="container" :class="{'h5-pc-container': isH5}" :show-scrollbar="false">
-    <view style="padding: 40rpx 28rpx;">
+    <!-- 自定义导航栏 -->
+    <view class="custom-nav" :style="{paddingTop: statusBarHeight + 'px'}">
+      <view class="nav-content">
+        <view class="nav-back" @click="back"><text class="iconfont"><</text></view>
+        <view class="nav-title">高校毕业生智慧就业</view>
+        <view class="nav-placeholder"></view>
+      </view>
+    </view>
+    <view class="main-content">
          <!-- #ifdef MP-WEIXIN -->
       <view class="kinggang">
         <view @click="navTo('/packageA/pages/myResume/myResume')">
@@ -31,70 +39,68 @@
         </view>
       </view>
       <!-- #endif -->
-      <view class="showtab">
+      <!-- 岗位类型切换 -->
-        <view class="tabItem" @click="changeType(1)">
-          <image src="/packageRc/static/gw.png"/>
-          <image v-show="tabType == 1" class="activeImg" src="/packageRc/static/activeTangle.png"/>
-        </view>
-        <view class="tabItem" @click="changeType(2)">
-          <image src="/packageRc/static/zc.png"/>
-          <image v-show="tabType == 2" class="activeImg" src="/packageRc/static/activeTangle.png"/>
-        </view>
-      </view>
-      <template v-if="tabType == 1">
       <view class="tabs">
         <view class="tab" :class="{active: pageState.type == ''}" @click="changeJobType('')">岗位列表</view>
         <view class="tab" :class="{active: pageState.type == 2}" @click="changeJobType(2)">实习实训</view>
         <view class="tab" :class="{active: pageState.type == 3}" @click="changeJobType(3)">社区实践</view>
       </view>
+
+      <!-- 子选项卡 -->
       <view class="titles">
-          <view class="title-item" :class="{active: activeTitle == 1}" @click="activeTitle = 1,getJobRecommed()"><view>推荐岗位</view></view>
+        <view class="title-item" :class="{active: activeTitle == 1}" @click="activeTitle = 1,getJobRecommed()">
-          <view class="title-item" :class="{active: activeTitle == 2}" @click="activeTitle = 2,getJobList()"><view>热门岗位</view></view>
+          <view>推荐<text class="accent">岗位</text></view>
         </view>
-          <view v-for="(item, index) in jobList" :key="index" @click="nextDetail(item)" class="job-list">
+        <view class="title-item" :class="{active: activeTitle == 2}" @click="activeTitle = 2,getJobList()">
-          <view class="top-line">
+          <view>热门<text class="accent">岗位</text></view>
-            <view class="salary">{{item.minSalary}}-{{item.maxSalary}}/月</view>
-            <view class="time"><uni-icons color="#A2A2A2" type="info" :size="uniIconSize"></uni-icons>发布日期：{{ item.postingDate }}</view>
         </view>
-          <view class="title">{{ item.jobTitle }}</view>
-          <view class="infos">
-            <view>
-              <dict-Label dictType="education" :value="item.education"></dict-Label>
       </view>
-            <view>
+
-              <dict-Label dictType="experience" :value="item.experience"></dict-Label>
+      <!-- 岗位列表（改为网格布局） -->
+      <view class="job-grid">
+        <view v-for="(item, index) in jobList" :key="index" @click="nextDetail(item)" class="job-card-box">
+          <view class="job-top">
+            <view class="job-name">{{ item.jobTitle }}</view>
+            <view class="job-salary">{{item.minSalary}}-{{item.maxSalary}}/月</view>
           </view>
-            <view>{{ item.jobLocation }}</view>
+          <view class="job-tags">
+            <view v-if="item.jobLocationAreaCode" class="tag"><dict-Label dictType="jobLocationAreaCode" :value="item.jobLocationAreaCode"></dict-Label></view>
+            <view class="tag"><dict-Label dictType="education" :value="item.education"></dict-Label></view>
+            <view class="tag"><dict-Label dictType="experience" :value="item.experience"></dict-Label></view>
           </view>
-          <view class="bottom-line">
+          <view class="job-desc">
-            <view><uni-icons color="#A2A2A2" type="person" :size="uniIconSize"></uni-icons>{{item.vacancies}}人</view>
+            {{ vacanciesTo(item.vacancies) }} | {{item.jobCategory}} | {{ item.jobCategory }}
-            <view>{{ item.companyName }}</view>
+          </view>
+          <view class="company-link">
+             <image class="comp-icon" src="../../../packageRc/static/dmsc/gs.png" />
+             <view class="comp-name">{{ item.companyName }}</view>
+          </view>
+          <view class="delivery-btn" @click.stop="nextDetail(item)">简历投递</view>
         </view>
       </view>
       
       <view class="view-more-btn" @click="viewMore">查看更多内容</view>
 
-      </template>
+      <!-- 政策专区（改为常驻显示） -->
-      <template v-else>
+      <view class="titles section-title" style="justify-content: space-between; margin-top: 60rpx;">
-        <view class="titles" style="justify-content: space-between;">
+        <view class="title-item active"><view>政策<text class="accent">专区</text></view></view>
-          <view class="title-item active"><view>政策专区</view></view>
         <view class="more-link" @click="toPolicyList">{{'查看更多 >'}}</view>
       </view>
-        <view v-for="(item, index) in policyList" :key="index" class="job-list" @click="toPolicyDetail(item)">
+
-          <view class="sign">推荐</view>
+      <view v-for="(item, index) in policyList" :key="index" class="policy-list-card" @click="toPolicyDetail(item)">
-          <view class="title">
+        <view class="card-left">
-            <image src="../../../packageRc/static/zcLeft.png"/>
+          <image class="clock-icon" src="../../../packageRc/static/dmsc/sj.png" />
-            {{item.zcmc}}</view>
+          <view class="date-md">{{ formatMD(item.publishTime || item.createTime) }}</view>
-          <view class="infos">
+          <view class="date-year">{{ formatYear(item.publishTime || item.createTime) }}</view>
-            <view v-if="item.zcLevel">{{item.zcLevel}}</view>
+        </view>
-            <view v-if="item.sourceUnit">{{item.sourceUnit}}</view>
+        <view class="card-right">
+          <view class="card-title">{{ item.zcmc }}</view>
+          <view class="card-infos">
+            <view v-if="item.zcLevel" class="info-tag">{{ item.zcLevel }}</view>
+            <view v-if="item.sourceUnit" class="info-tag">{{ item.sourceUnit }}</view>
           </view>
-          <view class="bottom-line">
-            <view class="time"><uni-icons color="#A2A2A2" type="info" :size="uniIconSize"></uni-icons>发布日期：{{item.createTime}}</view>
-            <view><uni-icons color="#A2A2A2" type="eye" :size="uniIconSize"></uni-icons>浏览量：{{item.viewNum || 0}}</view>
         </view>
       </view>
-      </template>
     </view>
   </scroll-view>
 </template>
@@ -110,11 +116,23 @@ isH5.value = true;
 uniIconSize.value = 20;
 // #endif
 
+// 状态栏高度（用于自定义导航栏）
+const statusBarHeight = ref(0);
+try {
+  const sysInfo = uni.getSystemInfoSync();
+  statusBarHeight.value = sysInfo.statusBarHeight || 0;
+} catch(e) {}
+
+
 import { getPolicyList } from '@/packageRc/apiRc/policy';
 let policyList = ref([])
 function getPolicy() {
-  getPolicyList({pageNum: 1, pageSize: 10,zclx:'1'}).then(res => {
+  getPolicyList({pageNum: 1, pageSize: 4,zclx:'1'}).then(res => {
+    if (res.code == 200) {
       policyList.value = res.rows
+    } else {
+      throw new Error();
+    }
   })
 }
 let tabType = ref(1)
@@ -178,7 +196,7 @@ const pageState = reactive({
     page: 0,
     total: 0,
     maxPage: 2,
-    pageSize: 10,
+    pageSize: 4,
     search: {
         order: 0,
     },
@@ -196,8 +214,15 @@ function getJobRecommed(){
         type:pageState.type
     };
     $api.createRequest('/app/job/recommend', params).then((resData) => {
+        if (resData.code == 200 && resData.data.length) {
             jobList.value = resData.data
-        pageState.total = 0;
+        } else {
+            throw new Error();
+        }
+    }).catch(() => {
+        // 造一些测试数据
+        const mock = { jobTitle: '计算机网络运维员', companyName: '新疆天山人才智汇发展有限责任公司', minSalary: '面议', maxSalary: '面议' };
+        jobList.value = [mock, mock, mock, mock];
     });
 }
 
@@ -244,6 +269,26 @@ function nextDetail(job) {
     }
 }
 
+function formatMD(dateStr) {
+  if (!dateStr) return '--';
+  const parts = dateStr.split('-').length > 1 ? dateStr.split('-') : dateStr.split(' ');
+  // 处理 YYYY-MM-DD 或 YYYY-MM-DD HH:mm:ss
+  let d = parts[0].includes('-') ? parts[0].split('-') : parts;
+  if (d.length >= 3) {
+    return `${d[1]}-${d[2].substring(0,2)}`;
+  }
+  return dateStr;
+}
+
+function formatYear(dateStr) {
+  if (!dateStr) return '';
+  const parts = dateStr.split('-');
+  if (parts.length >= 1) {
+    return parts[0].substring(0, 4);
+  }
+  return '';
+}
+
 
 
 </script>
@@ -259,22 +304,59 @@ function nextDetail(job) {
 }
 view{box-sizing: border-box;display: block;}
 .container{
-  background-color: #F4F4F4;background-position: top center;background-size: 100% auto;
+  background-color: #FFFFFF;
-  height: 100vh;
+  min-height: 100vh;
   min-width: 100vw;
-  padding-bottom: 0;
-  background-repeat: no-repeat;
   box-sizing: border-box;
 }
+/* 自定义导航栏 */
+.custom-nav {
+  background: #107AFD;
+  width: 100%;
+  .nav-content {
+    height: 200rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 0 40rpx;
+    .nav-back {
+      width: 120rpx;
+      height: 200rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: #fff;
+      font-weight: 300;
+      .iconfont{
+
+        font-size: 40px!important;
+      }
+    }
+    .nav-title {
+      color: #fff;
+      font-size: 72rpx;
+      font-weight: bold;
+    }
+    .nav-placeholder {
+      width: 120rpx;
+    }
+  }
+}
+.main-content {
+  position: relative;
+  z-index: 2;
+  /* 页面全局边距加倍 */
+  padding: 64rpx 48rpx;
+}
 .kinggang{ 
   display: flex;
   justify-content: space-around;
   align-items: center;
-  padding: 16rpx 16rpx 32rpx 16rpx;
+  padding: 24rpx 16rpx 48rpx 16rpx;
-  font-size: 24rpx;
+  font-size: 52rpx;
   background: #FFFFFF;
-  border-radius: 16rpx;
+  border-radius: 20rpx;
-  margin-bottom: 24rpx;
+  margin-bottom: 32rpx;
   >view{
     display: flex;
     flex-direction: column;
@@ -282,58 +364,68 @@ view{box-sizing: border-box;display: block;}
     justify-content: space-around;
   }
   image{
-    width: 78rpx;
+    width: 160rpx;
-    // margin-bottom: 15rpx;
+    height: 160rpx;
-    height: 78rpx;
+    margin-bottom: 20rpx;
   }
 }
 .tabs{
-  margin-bottom: 29rpx;
+  /* 调大上方选项卡的边距 */
-
+  margin: 64rpx auto 64rpx;
-	border-radius: 16rpx;
+  border-radius: 120rpx;
   display: flex;
-	background: #fff;
+  background: #F4F6F9;
   color: #878787;
   text-align: center;
-	width: 100%;
+  width: 80%;
+  overflow: hidden;
+  padding: 8rpx;
+  box-sizing: border-box;
   .tab{
-		width: 50%;
+    flex: 1;
-		border: 4rpx solid transparent;
+    line-height: 120rpx;
-		border-radius: 16rpx;
-		line-height: 64rpx;
     position: relative;
+    font-size: 72rpx;
+    font-weight: 500;
+    transition: all 0.25s;
+    border-radius: 120rpx;
     &.active{
-      border: 4rpx solid #fff;
       color: #fff;
-			background: linear-gradient(180deg, #79AFFF 1%, #A2B3FE 100%);
+      background: #107AFD;
-      box-shadow: 0px 4rpx 10rpx 0px rgba(40, 102, 194, 0.4);
+      box-shadow: none;
     }
   }
 }
 .titles{
   display: flex;
-  margin-bottom: 44rpx;
+  /* 调大标题下边距 */
+  margin-bottom: 72rpx;
+  align-items: flex-end;
   .title-item{
-    font-size: 32rpx;
+    font-size: 120rpx;
     font-weight: bold;
     color: #282828;
-    margin-right: 32rpx;
+    margin-right: 56rpx;
     position: relative;
     >view{
       position: relative;
       z-index: 2;
-      padding: 0 16rpx;
+      padding: 0 8rpx;
+      .accent {
+        color: #EC7737;
+        margin-left: 4rpx;
+      }
     }
     &.active::after{
       content: '';
       position: absolute;
       z-index: 1;
-      bottom: -12rpx;
+      bottom: -8rpx;
-      left: 0;
+      left: 10%;
-      width: 120%;
+      width: 80%;
-      height: 24rpx;
+      height: 20rpx;
-      border-radius: 50px 0px 0px 50px;
+      border-radius: 50px;
-      background: linear-gradient(90deg, #78AEFF 0%, rgba(120, 174, 255, 0.31) 52%, rgba(24, 116, 255, 0) 100%);
+      background: linear-gradient(90deg, rgba(82, 149, 255, 0.4) 0%, rgba(24, 116, 255, 0) 100%);
     }
   }
 }
@@ -341,11 +433,12 @@ view{box-sizing: border-box;display: block;}
   width: 100%;
   margin: 0 auto;
   color: #333333;
-  border-radius: 24rpx;
+  border-radius: 12rpx;
   background: #FFFFFF;
   padding: 32rpx;
   margin-bottom: 24rpx;
   position: relative;
+  /* 去掉阴影，保持扁平统一 */
   .sign{
     position: absolute;
     font-size: 28rpx;
@@ -413,22 +506,191 @@ view{box-sizing: border-box;display: block;}
   margin: 0 auto;
   margin-bottom: 20rpx;
 }
-.showtab{
+.job-grid {
   display: flex;
+  flex-wrap: wrap;
   justify-content: space-between;
-  margin-bottom: 40rpx;
+  /* 列表前边距调大 */
-  .tabItem{
+  margin-top: 48rpx;
-    position: relative;
+
-    width: calc(50% - 8rpx);
+  .job-card-box {
-    height: 144rpx;
+    /* 缩小宽度比例以增加瀑布流列间距 */
+    width: calc(50% - 24rpx);
+    background: #FFFFFF;
+    background-image: url(../../../packageRc/static/dmsc/kpbj.png);
+    background-size: 100% 100%;
+    /* 加大卡片下边距 */
+    margin-bottom: 48rpx;
+    border: 1px solid #D1E5FF;
+    border-radius: 16rpx;
+    /* 加大卡片内边距 */
+    padding: 48rpx;
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+
+    .job-top {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      align-items: flex-start;
+      margin-bottom: 24rpx;
+      .job-salary {
+        color: #EC7737;
+        font-weight: bold;
+        font-size: 64rpx;
+        flex-shrink: 0;
+      }
+      .job-name {
+        font-size: 72rpx;
+        font-weight: bold;
+        color: #333;
+        flex: 1;
+        margin-top: 0;
+        margin-right: 12rpx;
+        /* 只保留单行溢出，以适应不同宽度 */
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+    }
+
+    .job-tags {
+      display: flex;
+      flex-wrap: wrap;
+      margin-bottom: 32rpx;
+      .tag {
+        background: #7DA6FF;
+        color: #FFFFFF;
+        font-size: 48rpx;
+        padding: 8rpx 20rpx;
+        border-radius: 12rpx;
+        margin-right: 16rpx;
+        margin-bottom: 16rpx;
+      }
+    }
+
+    .job-desc {
+      font-size: 48rpx;
+      color: #4C6EFB;
+      margin-bottom: 44rpx;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    .company-link {
+      display: flex;
+      align-items: center;
+      margin-top: auto;
+      margin-bottom: 48rpx;
+      .comp-icon {
+        width: 56rpx;
+        height: 56rpx;
+        margin-right: 16rpx;
+        flex-shrink: 0;
+      }
+      .comp-name {
+        font-size: 48rpx;
+        color: #666;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+
+    .delivery-btn {
+      width: 75%;
+      margin: 0 auto;
+      height: 96rpx;
+      line-height: 96rpx;
+      background: #2591FF; /* 与设计图一致的亮蓝色 */
+      color: #FFFFFF;
+      text-align: center;
+      font-size: 52rpx;
+      font-weight: 500;
+      border-radius: 12rpx;
+      /* 移除阴影以贴合扁平化设计稿 */
+    }
+  }
+}
+
+.policy-list-card {
+  width: 100%;
+  margin: 0 auto;
+  color: #333333;
+  /* 政策卡片大边距与内边距 */
+  margin-bottom: 48rpx;
+  box-sizing: border-box;
+  display: flex;
+  background: linear-gradient(180deg, #F0F8FF 0%, #FFFFFF 100%);
+  padding: 64rpx 48rpx;
+  border-radius: 16rpx;
+  border: 1px solid #D1E5FF;
+  box-shadow: 0px 4rpx 12rpx 0px rgba(16, 122, 253, 0.05);
+
+  .card-left {
+    /* 加宽左侧保护不再折行 */
+    width: 220rpx;
+    flex-shrink: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    border-right: 1px solid #E5EEFA;
+    /* 增大左右空隙 */
+    margin-right: 48rpx;
+
+    .clock-icon {
+      width: 52rpx;
+      height: 52rpx;
+      margin-bottom: 12rpx;
+    }
+
+    .date-md {
+      font-size: 60rpx;
+      font-weight: bold;
+      color: #107afd;
+      line-height: 1;
+      margin-bottom: 12rpx;
+    }
+
+    .date-year {
+      font-size: 40rpx;
+      color: #107afd;
+      line-height: 1;
+    }
+  }
+
+  .card-right {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+
+    .card-title {
+      font-size: 64rpx;
+      font-weight: bold;
+      color: #333;
+      margin-bottom: 24rpx;
+      line-height: 1.4;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      display: -webkit-box;
+      -webkit-line-clamp: 2;
+      -webkit-box-orient: vertical;
+    }
+
+    .card-infos {
+      display: flex;
+      flex-wrap: wrap;
+
+      .info-tag {
+        font-size: 48rpx;
+        color: #999;
+        margin-right: 24rpx;
+      }
     }
-  .activeImg{
-    position: absolute;
-    width: 143rpx;
-    height: 18rpx;
-    bottom: -24rpx;
-    right: 50%;
-    transform: translateX(50%);
   }
 }
 
@@ -464,32 +726,35 @@ view{box-sizing: border-box;display: block;}
 
   .tabs {
     margin-bottom: 80rpx;
-    height: 120rpx;
+    background-color: #eee;
-    border-radius: 20rpx !important;
+    border-radius: 60px;
-    background: #f8faff !important;
+    padding: 10px;
-    box-shadow: 0px 4rpx 15rpx rgba(0, 0, 0, 0.04);
     .tab {
       width: 33.3% !important;
-      line-height: 120rpx !important;
+      line-height: 180rpx !important;
-      font-size: 20px !important;
+      font-size: 36px !important;
-      border-radius: 16rpx !important;
+      border-radius: 100rpx;
     }
   }
 
   .titles {
     margin-top: 40rpx;
-    margin-bottom: 60rpx;
+    margin-bottom: 60px;
     .title-item {
-      font-size: 24px !important;
+      font-size: 40px;
       font-weight: 600;
-      margin-right: 100rpx !important;
+      margin-right: 100px !important;
       >view {
         padding: 0 16rpx !important;
       }
       &::after {
-        height: 24rpx !important;
+        height: 20rpx !important;
-        bottom: -12rpx !important;
+        bottom: -16px !important;
-        width: 110% !important;
+        width: 20% !important;
+        left: 40% !important;
+        background: orange;
+        border-radius: 0;
+        
       }
     }
     .more-link {

packageRc/pages/policy/policyList.vue

@@ -1,10 +1,14 @@
 <template>
   <view
     class="page" :class="{'h5-pc-page': isH5}"
-    style="
-      background-image: url(../../../packageRc/static/pageBg.png);
-    "
   >
+    <view class="custom-nav" :style="{paddingTop: statusBarHeight + 'px'}">
+      <view class="nav-content">
+        <view class="nav-back" @click="back"><text class="iconfont"><</text></view>
+        <view class="nav-title">高校毕业生智慧就业</view>
+        <view class="nav-placeholder"></view>
+      </view>
+    </view>
     <view
       class="input-outer-part"
       style="padding: 24rpx 32rpx 0; max-height: unset"
@@ -17,7 +21,7 @@
           border="none"
         />
         <img
-          src="https://rc.jinan.gov.cn/qcwjyH5/static/images/person/search.png"
+          src="/packageRc/static/dmsc/ss.png"
           class="search-icon"
           @click="search()"
         />
@@ -53,33 +57,22 @@
         @scrolltolower="getBottomList"
         :show-scrollbar="false"
       >
-        <view
+        
-          style="margin-bottom: 24rpx; border-radius: 16rpx"
+        <view v-for="(item, index) in tableData" :key="index" class="policy-list-card" @click="toPolicyDetail(item)">
-          class="policy-list"
+          <view class="card-left">
-          v-for="(item, index) in tableData"
+            <image class="clock-icon" src="../../../packageRc/static/dmsc/sj.png" />
-          :key="index"
+            <view class="date-md">{{ formatMD(item.publishTime || item.createTime) }}</view>
-          @click="goPolicyDetail(item)"
+            <view class="date-year">{{ formatYear(item.publishTime || item.createTime) }}</view>
-        >
-          <view class="title">
-            <image src="../../../packageRc/static/zcLeft.png" />
-            {{ item.zcmc }}</view
-          >
-          <view class="infos">
-            <view v-if="item.zcLevel">{{ item.zcLevel }}</view>
-            <view v-if="item.sourceUnit">{{ item.sourceUnit }}</view>
           </view>
-          <view class="bottom-line">
+          <view class="card-right">
-            <view>
+            <view class="card-title">{{ item.zcmc }}</view>
-              <uni-icons color="#A2A2A2" type="info" :size="uniIconSize"></uni-icons>
+            <view class="card-infos">
-              发文日期：{{ item.publishTime }}
+              <view v-if="item.zcLevel" class="info-tag">{{ item.zcLevel }}</view>
-            </view>
+              <view v-if="item.sourceUnit" class="info-tag">{{ item.sourceUnit }}</view>
-            <view>
-              <uni-icons color="#A2A2A2" type="eye" :size="uniIconSize"></uni-icons>
-              浏览量：{{ item.viewNum || 0 }}
             </view>
           </view>
         </view>
-        <view style="padding-bottom: 24rpx">
+        <view style="padding-bottom: 24px">
           <img
             v-if="!total && !loading"
             src="https://rc.jinan.gov.cn/qcwjyH5/static/images/person/empty.png"
@@ -90,11 +83,11 @@
           </view>
           <view
             v-else-if="showMorePage"
-            style="text-align: center; color: #1a62ce; font-size: 24rpx"
+            style="text-align: center; color: #1a62ce; font-size: 24px"
             >加载更多
           </view>
           <view
-            style="text-align: center; color: #8e8e8e; font-size: 24rpx"
+            style="text-align: center; color: #8e8e8e; font-size: 24px"
             v-else
             >没有更多数据了~</view
           > </view
@@ -212,6 +205,11 @@ export default {
         },
       ];
     },
+    back() {
+      uni.navigateBack({
+        delta: 1
+      })
+    },
     popupSearch(data) {
       // 获取此次提交前，旧的政策类型值
       const oldTypeL = this.queryParams.policyTypeL || "";
@@ -291,20 +289,31 @@ export default {
         this.total = res.total;
       } else {
         this.loading = false;
-        // #ifdef H5 || APP-PLUS
-        // 接口返回非 200 或失败时展示测试数据 (条件编译)
-        this.tableData = [
-          { id: '1', zcmc: '测试政策001：关于进一步支持人才发展的若干措施（条件编译测试数据）', publishTime: '2026-03-10', viewNum: 888, zcLevel: '省级', sourceUnit: '模拟测试部' },
-          { id: '2', zcmc: '测试政策002：高校毕业生创业补贴申请指南（条件编译测试数据）', publishTime: '2026-03-10', viewNum: 666, zcLevel: '市级', sourceUnit: '人力资源局' }
-        ];
-        this.total = 2;
-        // #endif
         uni.showToast({
           title: res.msg || '获取列表失败',
           icon: "none",
         });
       }
     },
+    formatMD(dateStr) {
+      if (!dateStr) return '--';
+      const parts = dateStr.split('-').length > 1 ? dateStr.split('-') : dateStr.split(' ');
+      // 处理 YYYY-MM-DD 或 YYYY-MM-DD HH:mm:ss
+      let d = parts[0].includes('-') ? parts[0].split('-') : parts;
+      if (d.length >= 3) {
+        return `${d[1]}-${d[2].substring(0,2)}`;
+      }
+      return dateStr;
+    },
+
+    formatYear(dateStr) {
+      if (!dateStr) return '';
+      const parts = dateStr.split('-');
+      if (parts.length >= 1) {
+        return parts[0].substring(0, 4);
+      }
+      return '';
+    }
   },
 };
 </script>
@@ -330,7 +339,7 @@ export default {
   background: #ffffff;
   box-sizing: border-box;
   border: 1px solid #107afd;
-  height: 64rpx;
+  height: 120rpx;
   border-radius: 32rpx;
   padding: 0 32rpx;
   display: flex;
@@ -340,8 +349,10 @@ export default {
   margin-top: 24rpx;
 
   .search-icon {
-    width: 40rpx;
+    width: 40px;
-    height: 40rpx;
+    background: #107afd;
+    padding: 10px;border-radius: 40px;
+    height: 40px;
   }
 }
 
@@ -718,7 +729,10 @@ export default {
     height: 48px !important;
   }
   .search-line {
-    height: 80rpx !important;
+    height: 80px !important;
+    border-radius: 40px;
+    padding: 0 20px!important;
+    input{font-size: 24px!important;}
   }
   .policy-list .title image {
     width: 56rpx !important;
@@ -726,8 +740,119 @@ export default {
     margin-right: 16rpx !important;
   }
   .loading-text {
-    font-size: 20px !important;
+    font-size: 26px !important;
   }
 }
 /* #endif */
+/* 自定义导航栏 */
+.custom-nav {
+  background: #107AFD;
+  width: 100%;
+  .nav-content {
+    height: 200rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 0 40rpx;
+    .nav-back {
+      width: 120rpx;
+      height: 200rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: #fff;
+      font-weight: 300;
+      .iconfont{
+
+        font-size: 40px!important;
+      }
+    }
+    .nav-title {
+      color: #fff;
+      font-size: 72rpx;
+      font-weight: bold;
+    }
+    .nav-placeholder {
+      width: 120rpx;
+    }
+  }
+}
+.policy-list-card {
+  width: 100%;
+  margin: 0 auto;
+  color: #333333;
+  /* 政策卡片大边距与内边距 */
+  margin-bottom: 48rpx;
+  box-sizing: border-box;
+  display: flex;
+  background: linear-gradient(180deg, #F0F8FF 0%, #FFFFFF 100%);
+  padding: 64rpx 48rpx;
+  border-radius: 16rpx;
+  border: 1px solid #D1E5FF;
+  box-shadow: 0px 4rpx 12rpx 0px rgba(16, 122, 253, 0.05);
+
+  .card-left {
+    /* 加宽左侧保护不再折行 */
+    width: 220rpx;
+    flex-shrink: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    border-right: 1px solid #E5EEFA;
+    /* 增大左右空隙 */
+    margin-right: 48rpx;
+
+    .clock-icon {
+      width: 52rpx;
+      height: 52rpx;
+      margin-bottom: 12rpx;
+    }
+
+    .date-md {
+      font-size: 60rpx;
+      font-weight: bold;
+      color: #107afd;
+      line-height: 1;
+      margin-bottom: 12rpx;
+    }
+
+    .date-year {
+      font-size: 40rpx;
+      color: #107afd;
+      line-height: 1;
+    }
+  }
+
+  .card-right {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+
+    .card-title {
+      font-size: 64rpx;
+      font-weight: bold;
+      color: #333;
+      margin-bottom: 24rpx;
+      line-height: 1.4;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      display: -webkit-box;
+      -webkit-line-clamp: 2;
+      -webkit-box-orient: vertical;
+    }
+
+    .card-infos {
+      display: flex;
+      flex-wrap: wrap;
+
+      .info-tag {
+        font-size: 48rpx;
+        color: #999;
+        margin-right: 24rpx;
+      }
+    }
+  }
+}
 </style>

pages.json

@@ -645,7 +645,10 @@
           {
             "path": "pages/index/index",
             "style": {
-              "navigationBarTitleText": "高校毕业生智慧就业"
+              "navigationBarTitleText": "高校毕业生智慧就业",
+              "navigationBarBackgroundColor": "#107AFD",
+              "navigationBarTextStyle": "white",
+              "navigationStyle": "custom"
             }
           },
           {
@@ -723,7 +726,8 @@
           {
             "path": "pages/policy/policyList",
             "style": {
-              "navigationBarTitleText": "政策专区"
+              "navigationBarTitleText": "政策专区",
+              "navigationStyle": "custom"
             }
           },
           {