毕设-dev-8.21

# Conflicts:
#	pages/dashboardModule/performanceRanking/performanceRanking.wxss
#	pages/personCenter/resetPwd/resetPwd.js

app.js

@@ -1,6 +1,6 @@
 const { checkLogin } = require('./utils/logcheck');
 App({
-
   onLaunch: function () {
+    // checkLogin()
   }
 });

app.json

@@ -6,7 +6,6 @@
     "pages/loginModule/agreement/agreement",
     "pages/loginModule/privacyPolicy/privacyPolicy",
     "pages/personCenter/subCommissionSetting/subCommissionSetting",
-    "pages/test/testVideo/testVideo",
     "pages/personCenter/withdrawal/withdrawal",
     "pages/personCenter/withdrawalAccount/withdrawalAccount",
     "pages/personCenter/accountSetting/accountSetting",
@@ -43,7 +42,8 @@
     "pages/dashboardModule/supervisorPerformance/supervisorPerformance",
     "pages/dashboardModule/staffPerformance/staffPerformance",
     "pages/dashboardModule/userOrderPerformance/userOrderPerformance",
-    "pages/dashboardModule/performanceRanking/performanceRanking"
+    "pages/dashboardModule/performanceRanking/performanceRanking",
+    "pages/personCenter/component/modifyNamePop/modifyNamePop"
   ],
   "window": {
     "navigationBarTextStyle": "black",
@@ -62,9 +62,15 @@
     "list": [
       {
         "pagePath": "pages/course/homepage/homepage",
-        "text": "课程",
-        "iconPath": "/static/course.png",
-        "selectedIconPath": "/static/courseselected.png"
+        "text": "主页",
+        "iconPath": "/static/kc1.png",
+        "selectedIconPath": "/static/kc2.png"
+      },
+      {
+        "pagePath": "pages/projectModule/projectList/projectList",
+        "text": "接单",
+        "iconPath": "/static/kc1.png",
+        "selectedIconPath": "/static/kc2.png"
       },
       {
         "pagePath": "pages/personCenter/mine/mine",

pages/course/courseDetail/courseDetail.js

@@ -1,5 +1,7 @@
 import { baseUrl, globalImgUrl } from "../../../request";
 import { decodeBase64 } from "../../../utils/decodebase64";
+const { notLogin } = require('../../../utils/util')
+
 
 // pages/course/courseDetail/courseDetail.js
 Page({
@@ -31,6 +33,8 @@ Page({
             courseObj: res.data.data,
             richText: decodeBase64(res.data.data.detail)
           })
+        } else {
+          notLogin(res.data.message)
         }
       }
     })
@@ -87,7 +91,11 @@ Page({
 
   onUnload() {},
 
-  onPullDownRefresh() {},
+  onPullDownRefresh() {
+    this.getCourseDetail()
+    // 停止下拉刷新动画
+    wx.stopPullDownRefresh();
+  },
 
   onReachBottom() {},
 

pages/course/courseDetail/courseDetail.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "enablePullDownRefresh": true
 }

pages/course/courseDetail/courseDetail.wxml

@@ -1,36 +1,47 @@
-<view class="flex-col page">
-  <view class="flex-col">
-    <view class="flex-col">
-      <image class="image" src="{{ globalImgUrl + courseObj.image }}" />
-      <view class="flex-col section">
-        <view class="flex-row items-center group">
-          <view class="shrink-0 group_2">
-            <text class="text">{{ courseObj.discountPrice }}</text>
-            <text class="font text_2">元券后价</text>
-          </view>
-          <view class="ml-4 flex-col justify-start items-start shrink-0 relative group_3">
-            <text class="font text_3">{{ courseObj.originPrice }}元</text>
-            <view class="divider pos"></view>
-          </view>
+<!-- pages/course/courseDetail/courseDetail.wxml -->
+<view class="page">
+  <!-- 滚动内容 -->
+  <scroll-view scroll-y class="content no-scrollbar">
+    <!-- 顶部主图 -->
+    <view class="hero">
+      <image class="hero-img" src="{{ globalImgUrl + courseObj.image }}" mode="aspectFill" lazy-load="true" />
+    </view>
+
+    <!-- 价格 + 标题 -->
+    <view class="card">
+      <view class="price-row">
+        <view class="price-now">
+          <text class="price-num">{{ courseObj.discountPrice }}</text>
+          <text class="price-suffix">元券后价</text>
+        </view>
+        <view class="price-origin">
+          <text class="origin-text">{{ courseObj.originPrice }}元</text>
         </view>
-        <text class="group text_4 mt-9">{{ courseObj.name }}</text>
       </view>
+      <text class="title">{{ courseObj.name }}</text>
     </view>
-    <view class="mt-26 flex-col section_2">
-      <view class="flex-row items-center group_4">
-        <image class="image_2" src="./image/cal.png" />
-        <text class="ml-6 font text_5">课程概述</text>
+
+    <!-- 课程概述 -->
+    <view class="card">
+      <view class="card-head">
+        <image class="head-icon" src="./image/cal.png" mode="aspectFit" />
+        <text class="head-text">课程概述</text>
       </view>
-      <rich-text class="section_3" nodes="{{ richText }}"></rich-text>
+      <rich-text class="rt" nodes="{{ richText }}"></rich-text>
+    </view>
+
+    <!-- 占位，避免被底部栏遮挡 -->
+    <view class="bottom-gap"></view>
+  </scroll-view>
+
+  <!-- 固定底部购买栏 -->
+  <view class="buy-bar">
+    <view class="buy-left">
+      <image class="consult-icon" src="./image/messge.png" mode="aspectFit" />
+      <text class="consult-text">咨询</text>
+    </view>
+    <view class="buy-btn" bindtap="gotoCourseOrder" data-id="{{ courseObj.id }}">
+      <text class="buy-btn-text">立即购买</text>
     </view>
   </view>
-  <view class="flex-row justify-between items-center section_4 mt-37">
-    <view class="flex-col items-center">
-      <image class="image_3" src="./image/messge.png" />
-      <text class="text_7 mt-1">咨询</text>
-    </view>
-    <view class="flex-col justify-start items-center text-wrapper" bind:tap="gotoCourseOrder" data-id="{{ courseObj.id }}">
-      <text class="text_6">立即购买</text>
-    </view>
-  </view>
-</view>
+</view>

pages/course/courseDetail/courseDetail.wxss

@@ -1,131 +1,148 @@
-.mt-9 {
-  margin-top: 16.88rpx;
-}
-.mt-37 {
-  margin-top: 69.38rpx;
-}
-.mt-1 {
-  margin-top: 1.88rpx;
-}
+/* pages/course/courseDetail/courseDetail.wxss */
+
+/* ===== 页面骨架：整页固定、内容滚动、底部栏固定 ===== */
 .page {
-  background-color: #f6f7f9;
-  padding-bottom: 100rpx;
-  width: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
-  height: 100%;
-}
-.image {
-  width: 100vw;
-  height: 54.75vw;
-}
-.section {
-  padding: 37.5rpx 11.25rpx 30rpx 18.75rpx;
-  background-color: #ffffff;
-}
-.group {
-  padding: 0 3.75rpx;
-}
-.group_2 {
-  line-height: 28.8rpx;
-  height: 30.58rpx;
-}
-.text {
-  color: #f84947;
-  font-size: 37.5rpx;
-  font-family: SourceHanSansCN;
-  font-weight: 700;
-  line-height: 28.8rpx;
-}
-.group_3 {
-  margin-right: 453.75rpx;
-  width: 75.02rpx;
-}
-.divider {
-  background-color: #8c8c8c;
-  width: 75.02rpx;
-  height: 1.88rpx;
-}
-.pos {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 50%;
-  transform: translateY(-50%);
-}
-.text_4 {
-  color: #000000;
-  font-size: 33.75rpx;
-  font-family: SourceHanSansCN;
-  line-height: 41.25rpx;
-}
-.section_2 {
-  padding: 0 30rpx 52.5rpx;
-  background-color: #ffffff;
-}
-.group_4 {
-  padding: 26.25rpx 0;
-}
-.image_2 {
-  width: 39.38rpx;
-  height: 39.38rpx;
-}
-.font {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 25.97rpx;
-}
-.text_3 {
-  width: 100rpx;
-  color: #8c8c8c;
-  line-height: 31.88rpx;
-  word-break: break-all;
-}
-.text_2 {
-  color: #f84947;
-  line-height: 24.43rpx;
-}
-.text_5 {
-  color: #000000;
-  font-size: 28.13rpx;
-}
-.section_3 {
-  height: auto;
-  padding-bottom: 40rpx;
-  /* 以下是新增 */
-  white-space: normal;    /* 允许换行 */
-  word-break: break-all;  /* 在任意字符处断行，数字也会换行 */
-}
-.section_4 {
-  padding: 15rpx 26.25rpx;
-  background-color: #ffffff;
-  position: fixed;
-  bottom: 0;
-  left: 0;
-  width: 100%;
-  z-index: 999; /* 确保它在最上层 */
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #f6f7f9;
+  overflow: auto; /* 禁止整页滚动 */
+  box-sizing: border-box;
+  font-family: SourceHanSansCN, PingFang SC, Microsoft YaHei, system-ui, -apple-system, sans-serif;
 }
 
-.image_3 {
-  width: 52.5rpx;
-  height: 52.5rpx;
+/* 独立滚动内容区（隐藏滚动条） */
+.content {
+  flex: 1;
+  -webkit-overflow-scrolling: touch;
 }
-.text_7 {
-  color: #000000;
-  font-size: 22.5rpx;
-  font-family: SourceHanSansCN;
-  line-height: 20.94rpx;
+.no-scrollbar::-webkit-scrollbar { display: none; width: 0; height: 0; background: transparent; }
+.no-scrollbar { scrollbar-width: none; }
+
+/* ===== 顶部主图（自适应圆角阴影） ===== */
+.hero {
+  padding: 24rpx 24rpx 0;
+  box-sizing: border-box;
 }
-.text-wrapper {
-  padding: 22.5rpx 0 18.75rpx;
-  background-color: #ff8d1a;
-  border-radius: 75rpx;
-  width: 268.13rpx;
-  height: 71.25rpx;
+.hero-img {
+  width: 100%;
+  height: 420rpx;                  /* 沉浸横幅高度 */
+  border-radius: 20rpx;
+  object-fit: cover;
+  box-shadow: 0 12rpx 30rpx rgba(0,0,0,0.06);
+}
+
+/* ===== 通用卡片容器 ===== */
+.card {
+  margin: 20rpx 24rpx 0;
+  padding: 22rpx;
+  border-radius: 20rpx;
+  background: #ffffff;
+  box-shadow: 0 10rpx 30rpx rgba(0,0,0,0.05);
+  box-sizing: border-box;
+}
+
+/* ===== 价格区：券后价 + 原价 ===== */
+.price-row {
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+}
+.price-now { display: inline-flex; align-items: baseline; gap: 8rpx; }
+.price-num {
+  font-size: 44rpx;
+  line-height: 1;
+  color: #ff6a00;                  /* 主题橙 */
+  font-weight: 700;
+}
+.price-suffix { font-size: 24rpx; color: #ff6a00; opacity: .9; }
+.price-origin .origin-text { font-size: 24rpx; color: #9aa0a6; text-decoration: line-through; }
+
+/* 课程标题 */
+.title {
+  display: block;
+  margin-top: 14rpx;
+  font-size: 32rpx;
+  line-height: 46rpx;
+  color: #111;
+  font-weight: 600;
+  word-break: break-word;
+}
+
+/* ===== 概述标题行 ===== */
+.card-head {
+  display: flex;
+  align-items: center;
+  gap: 12rpx;
+  margin-bottom: 22rpx;
+}
+.head-icon { width: 34rpx; height: 34rpx; }
+.head-text { font-size: 28rpx; color: #111; font-weight: 600; }
+
+/* rich-text 内容排版（图片适配） */
+.rt {
+  font-size: 26rpx;
+  line-height: 42rpx;
+  color: #333;
+  white-space: normal;
+  word-break: break-word;
+}
+.rt p { margin: 8rpx 0; }
+.rt img { max-width: 100%; height: auto !important; border-radius: 12rpx; }
+
+/* 底部占位，避免被购买栏遮挡 */
+.bottom-gap {
+  height: calc(env(safe-area-inset-bottom));
+}
+
+/* ===== 固定底部购买栏（含安全区） ===== */
+.buy-bar {
+  position: sticky;
+  bottom: 0; left: 0; right: 0;
+  display: flex; align-items: center; justify-content: space-between;
+  gap: 20rpx;
+  padding: 12rpx 24rpx calc(12rpx + env(safe-area-inset-bottom));
+  background: #ffffff;
+  box-shadow: 0 -8rpx 20rpx rgba(0,0,0,0.06);
+  z-index: 10;
+}
+
+/* 左侧咨询 */
+.buy-left {
+  display: inline-flex; align-items: center; gap: 10rpx;
+  padding: 12rpx 16rpx;
+  border-radius: 16rpx;
+  background: #f0f2f5;
+}
+.consult-icon { width: 36rpx; height: 36rpx; }
+.consult-text { font-size: 24rpx; color: #333; }
+
+/* 右侧按钮 */
+.buy-btn {
+  flex: 1;
+  height: 72rpx;
+  border-radius: 9999rpx;
+  background: linear-gradient(90deg, #ff6a00, #ff8a2a);
+  box-shadow: 0 10rpx 24rpx rgba(255,106,0,0.26);
+  display: flex; align-items: center; justify-content: center;
+}
+.buy-btn-text {
+  font-size: 28rpx;
+  color: #fff;
+  font-weight: 700;
+  letter-spacing: 1rpx;
+}
+
+/* ===== 小的间距工具（保留你原有语义） ===== */
+.mt-9 { margin-top: 16rpx; }
+.mt-37 { margin-top: 68rpx; }
+.mt-1 { margin-top: 2rpx; }
+
+/* 你之前的 class 若仍在别处使用，可继续保留或删去：
+.image, .section, .group, .group_2, .group_3, .divider, .pos, .text_4, .section_2, .group_4, .image_2, .font, .text_3, .text_2, .text_5, .section_3, .section_4, .image_3, .text_7, .text-wrapper, .text_6
+当前新版未依赖它们。 */
+::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  background: transparent;
 }
-.text_6 {
-  color: #ffffff;
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 28.11rpx;
-}

pages/course/courseList/courseList.js

@@ -1,4 +1,5 @@
 import { baseUrl, globalImgUrl } from "../../../request";
+const { notLogin } = require('../../../utils/util')
 
 // pages/course/courseList/courseList.js
 Page({
@@ -10,6 +11,8 @@ Page({
     courseList:[],  // 课程列表
     courseType: '', // 课程类别
     globalImgUrl,
+    tempCourseList: [],
+    searchKeyword: ''
   },
 
   // 跳转课程详情页面
@@ -22,6 +25,23 @@ Page({
     })
   },
 
+  onSearchInput(e) {
+    const keyword = (e.detail.value || '').trim();
+    this.setData({ searchKeyword: keyword });
+  },
+ // 键盘“搜索/回车”触发：立即搜索
+  onSearch() {
+    const { tempCourseList } = this.data
+    const keyword = (this.data.searchKeyword || '').trim();
+    if (!keyword) {
+      this.setData({courseList: tempCourseList})
+      return;
+    }
+      // 模糊匹配 name
+  const filtered = this.data.courseList.filter(item => item.name.includes(keyword)
+  );
+  this.setData({ courseList: filtered });
+  },
   /**
    * 生命周期函数--监听页面加载
    */
@@ -48,13 +68,11 @@ Page({
         console.log('课程列表',res.data.data);
         if (res.data.code === 1) {
           this.setData({ 
-            courseList: res.data.data
+            courseList: res.data.data,
+            tempCourseList: res.data.data
            });
         } else {
-          wx.showToast({
-            icon: 'none',
-            title: res.data.message || '获取课程失败',
-          });
+          notLogin(res.data.message)
         }
       },
       fail: err => {

pages/course/courseList/courseList.wxml

@@ -1,39 +1,38 @@
-<view class="flex-col page">
-  <text class="self-center text">{{ courseType }}</text>
-  <image class="shrink-0 self-start image image_2" src="./image/line.png" />
-  <image class="shrink-0 self-end image image_3" src="./image/line.png" />
+<!-- pages/course/searchCourses/searchCourses.wxml -->
+<view class="page">
 
-  <view class="flex-col self-stretch list">
-    <!-- 遍历接口返回的 items 数组 -->
-    <view
-      class="flex-col list-item"
-      wx:for="{{courseList}}"
-      wx:for-item="item"
-      wx:for-index="index"
-      wx:key="id"
-    >
-      <view
-        class="flex-row items-center relative group"
-        bindtap="gotoCourseDetail"
-        data-id="{{item.id}}"
-      >
-        <!-- 课程封面 -->
-        <image
-          class="shrink-0 image_4"
-          src="{{ globalImgUrl  + item.image}}"
-          mode="aspectFill"
-        />
-        <view class="flex-col flex-1 ml-12">
-          <!-- 课程名称 -->
-          <text class="font">{{item.name}}</text>
-          <view class="flex-row justify-between items-baseline mt-17">
-            <!-- 卷后价格 -->
-            <text class="font_2">券后{{item.discountPrice}}元起</text>
-            <!-- 已有下单人数 -->
-            <text class="font_3">{{item.orderCount}}人学习</text>
-          </view>
+<!-- 顶部搜索条（固定） -->
+<view class="search-bar" hover-class="hover">
+  <image class="search-icon" src="./image/sousuo.png" mode="aspectFit"/>
+  <input
+    class="search-input"
+    placeholder="搜索更多好课"
+    placeholder-class="search-ph"
+    bindinput="onSearchInput"
+    confirm-type="search"
+    bindconfirm="onSearch"
+  />
+</view>
+
+<!-- 搜索结果（独立滚动 & 隐藏滚动条） -->
+<scroll-view scroll-y class="list no-scrollbar">
+  <block wx:for="{{courseList}}" wx:for-item="item" wx:key="item.id">
+    <view class="course-card" bindtap="gotoCourseDetail" data-id="{{item.id}}" hover-class="hover">
+      <image class="cover" src="{{ globalImgUrl + item.image }}" mode="aspectFill" lazy-load="true"/>
+      <view class="info">
+        <text class="title">{{item.name}}</text>
+        <view class="meta">
+          <text class="price-pill">券后{{item.discountPrice}}元起</text>
+          <text class="people">{{item.orderCount}}人学习</text>
         </view>
       </view>
     </view>
+  </block>
+
+  <!-- 空状态（可选） -->
+  <view wx:if="{{!courseList || courseList.length === 0}}" class="empty">
+    <image class="empty-icon" src="/static/empty.png" mode="aspectFit"/>
+    <text class="empty-text">没找到相关课程，换个关键词试试～</text>
   </view>
+</scroll-view>
 </view>

pages/course/courseList/courseList.wxss

@@ -1,63 +1,131 @@
-/* pages/course/courseList/courseList.wxss */
-.mt-17 {
-  margin-top: 31.88rpx;
-}
+/* pages/course/searchCourses/searchCourses.wxss */
+
+/* ===== 页面骨架：整页固定，列表单独滚动 ===== */
 .page {
-  /* padding: 38.53rpx 0 ; */
-  background-color: #ffffff;
-  height: 100%;
-  width: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #ffffff;
+  overflow: hidden;               /* 禁止整页滚动 */
+  box-sizing: border-box;
+  font-family: SourceHanSansCN, PingFang SC, Microsoft YaHei, system-ui, -apple-system, sans-serif;
 }
-.text {
-  color: #000000;
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.64rpx;
+
+::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  background: transparent;
 }
-.image {
-  width: 255rpx;
-  height: 1.88rpx;
+
+
+/* 轻触反馈 */
+.hover { opacity: .86; transition: opacity .18s ease; }
+
+/* ===== 顶部搜索条（固定） ===== */
+.search-bar {
+  padding: 24rpx 28rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+  background: #fff;
 }
-.image_2 {
-  margin-left: 40.78rpx;
-  margin-top: -14.7rpx;
-}
-.image_3 {
-  margin-right: 37.97rpx;
+.search-icon { width: 36rpx; height: 36rpx; opacity: .9; }
+
+/* 胶囊输入框 */
+.search-input {
+  flex: 1;
+  height: 72rpx;
+  padding: 0 26rpx;
+  border-radius: 9999rpx;
+  background: #f5f6f7;
+  font-size: 26rpx;
+  color: #111;
+  line-height: 72rpx;
+  box-shadow: inset 0 0 0 1rpx rgba(0,0,0,.04);
 }
+.search-ph { color: #a8a8a8; font-size: 26rpx; }
+
+/* ===== 列表：占满剩余高度，单独滚动，隐藏滚动条 ===== */
 .list {
-  padding-top: 20.21rpx;
+  flex: 1;
+  padding: 0 24rpx 28rpx;
+  box-sizing: border-box;
+  -webkit-overflow-scrolling: touch;
+  background: #fff;
 }
-.list-item {
-  height: 178.13rpx;
+.no-scrollbar::-webkit-scrollbar { display: none; width: 0; height: 0; background: transparent; }
+.no-scrollbar { scrollbar-width: none; }
+
+/* ===== 课程卡片（左图右文） ===== */
+.course-card {
+  display: flex;
+  gap: 22rpx;
+  padding: 20rpx;
+  margin-top: 20rpx;
+  background: #ffffff;
+  border-radius: 20rpx;
+  border: 1rpx solid #f1f1f1;
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,.05);
 }
-.group {
-  margin: -18.24rpx 29.46rpx 0 35.63rpx;
-  padding: 57.19rpx 0 26.27rpx;
-  border-bottom: solid 1.88rpx #d6d6d6;
+.cover {
+  width: 280rpx;                  /* 3:2 比例更舒服 */
+  height: 186rpx;
+  flex: 0 0 280rpx;
+  border-radius: 14rpx;
+  object-fit: cover;
 }
-.image_4 {
-  border-radius: 9.38rpx;
-  width: 208.13rpx;
-  height: 133.13rpx;
+.info {
+  flex: 1;
+  min-width: 0;                   /* 防文字溢出 */
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
 }
-.font {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 31.88rpx;
-  color: #000000;
+.title {
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #111;
+  font-weight: 600;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;          /* 两行省略 */
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  word-break: break-word;
 }
-.font_2 {
-  font-size: 26.25rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 24.15rpx;
-  color: #ff5733;
+.meta {
+  margin-top: 12rpx;
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
 }
-.font_3 {
-  font-size: 22.5rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 20.34rpx;
-  color: #a6a6a6;
-}
+.price-pill {
+  padding: 6rpx 14rpx;
+  font-size: 24rpx;
+  color: #fff;
+  border-radius: 9999rpx;
+  background: linear-gradient(90deg, #ff6a00, #ff8a2a);
+  box-shadow: 0 6rpx 16rpx rgba(255,106,0,.22);
+  white-space: nowrap;
+}
+.people {
+  font-size: 22rpx;
+  color: #9aa0a6;
+  white-space: nowrap;
+}
+
+/* ===== 空状态 ===== */
+.empty {
+  padding: 120rpx 0 80rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 18rpx;
+  color: #9aa0a6;
+}
+.empty-icon { width: 240rpx; height: 240rpx; opacity: .7; }
+.empty-text { font-size: 24rpx; line-height: 34rpx; }
+
+/* ===== 兼容你项目里可能已有的工具类（可留可删） ===== */
+.ml-3 { margin-left: 6rpx; }
+.mt-17 { margin-top: 12rpx; }

pages/course/courseOrderList/courseOrderList.js

@@ -1,106 +1,138 @@
 import { baseUrl } from "../../../request";
+const { notLogin } = require('../../../utils/util')
 
 // pages/course/courseOrderList/courseOrderList.js
 Page({
   data: {
-    orderList: [],              // 后端返回的订单列表
-    hasModalShown: false,   // 弹框只显示一次
+    orderList: [],          // 后端返回的订单列表
+    hasModalShown: false,   // 本次停留页面只弹一次
     isMaskVisible: false
   },
 
-  onLoad(options) {
+  // —— 内部状态（不放 data，避免多余 setData）
+  _timer: null,
+  _isActive: false,         // 页面是否处于“可见/激活”状态
+  _justEnteredAt: 0,        // 进入页面时刻（可按需使用）
+
+  onLoad() {
+    this._isActive = true;
+    this._justEnteredAt = Date.now();
     this.fetchOrders();
   },
+  onShow() {
+    this._isActive = true;
+    this.fetchOrders(); // 如不想重复拉取可注释
+  },
   onHide() {
-    clearInterval(this._timer);
+    this._isActive = false;
+    this._clearTimer();
   },
   onUnload() {
-    clearInterval(this._timer);
-  },
-  onShow() {
-    this.fetchOrders()
+    this._isActive = false;
+    this._clearTimer();
   },
 
-  // 拉取后端接口
+  onPullDownRefresh() {
+    this.fetchOrders(); // stopPullDownRefresh 在 complete 里
+  },
+
+  // ========= 工具函数 =========
+  _clearTimer() {
+    if (this._timer) {
+      clearInterval(this._timer);
+      this._timer = null;
+    }
+  },
+  _pad2(n) {
+    return String(n).padStart(2, '0');
+  },
+  _fmtCountDownStr(totalSec) {
+    const sec = Math.max(0, totalSec | 0);
+    const m = Math.floor(sec / 60);
+    const s = sec % 60;
+    return `${this._pad2(m)}分${this._pad2(s)}秒`;
+  },
+
+  // ========= 拉单 =========
   fetchOrders() {
     wx.request({
-      url: baseUrl + '/courseOrder/query/list',  // 替换为真实接口
+      url: baseUrl + '/courseOrder/query/list',
       method: 'POST',
-      header: {
-        Authorization: wx.getStorageSync('token')
-      },
+      header: { Authorization: wx.getStorageSync('token') },
       success: res => {
-        console.log('课程订单列表---->',res.data.data);
         if (res.data.code === 1) {
           const now = Date.now();
-          let list = res.data.data.map(item => {
-            // 计算从 createTime 到 now 剩余秒数
-            const createMs = new Date(item.createTime.replace(/-/g,'/')).getTime();
-            let diff = Math.floor((createMs + 15*60*1000 - now) / 1000);
+          const list = (res.data.data || []).map(it => {
+            // 解析时间（iOS 兼容 + NaN 兜底）
+            const ts = new Date(String(it.createTime).replace(/-/g, '/')).getTime();
+            const createMs = Number.isFinite(ts) ? ts : now;
 
-            // 只有“待支付”才需要倒计时、过期置“交易取消”
-            if (item.orderStatus === '待支付') {
-              if (diff <= 0) {
-                item.orderStatus = '交易取消';
-                diff = 0;
-                // 首次检测到过期就弹框
-                if (!this.data.hasModalShown) {
-                  wx.showModal({
-                    title: '提示',
-                    content: '订单超时未支付，已取消',
-                    showCancel: false
-                  });
-                  this.setData({ hasModalShown: true });
-                }
+            // 统一按 15 分钟有效期（若后端返回 expireTime，建议直接用）
+            const ttlMs = 15 * 60 * 1000;
+            let diff = Math.floor((createMs + ttlMs - now) / 1000);
+            diff = Math.max(0, diff);
+
+            if (it.orderStatus === '待支付') {
+              it.countDown = diff;
+              it.countDownStr = this._fmtCountDownStr(diff);
+              it._expiredNotified = false; // 每单的本地防重复标记
+
+              // 初始化阶段：如果已经超时（diff=0），静默转关闭，不弹窗
+              if (diff === 0) {
+                it.orderStatus = '交易关闭';
+                it.countDownStr = '';
               }
-              item.countDown = diff;
-              const m = Math.floor(diff / 60);
-              const s = diff % 60;
-              item.countDownStr = `${m}分${s < 10 ? '0'+s : s}秒`;
             } else {
-              item.countDown = 0;
-              item.countDownStr = '';
+              it.countDown = 0;
+              it.countDownStr = '';
             }
-            return item;
-          });
-
-          this.setData({ orderList: list }, () => {
-            // 初始处理完后启动全局定时器
-            this.startTimer();
+            return it;
           });
 
+          // 渲染 + 启动定时器
+          this.setData({ orderList: list }, () => this._startTimer());
         } else {
-          wx.showToast({ title: res.data.message || '获取失败', icon: 'none' });
+          notLogin(res.data.message);
         }
       },
       fail: () => {
         wx.showToast({ title: '网络错误', icon: 'none' });
+      },
+      complete: () => {
+        wx.stopPullDownRefresh();
       }
     });
   },
 
-  // 每秒更新所有待支付订单的倒计时
-  startTimer() {
-     // ← 新增：如果已有定时器，先清掉它
-     if (this._timer) {
-      clearInterval(this._timer);
-    }
+  // ========= 定时器刷新 =========
+  _startTimer() {
+    this._clearTimer();
+    // 如果已经没有“待支付”的订单，就不启动定时器
+    const hasPending = this.data.orderList.some(o => o.orderStatus === '待支付' && o.countDown > 0);
+    if (!hasPending) return;
+
     this._timer = setInterval(() => {
+      // 不在激活页时不做任何 UI 相关动作（同时兜底不弹窗）
+      if (!this._isActive) return;
+
+      let needRerender = false;
       const updated = this.data.orderList.map(item => {
         if (item.orderStatus === '待支付' && item.countDown > 0) {
-          const cd = item.countDown - 1;
-          item.countDown = cd;
-          const m = Math.floor(cd / 60);
-          const s = cd % 60;
-          item.countDownStr = `${m}分${s < 10 ? '0'+s : s}秒`;
+          const next = item.countDown - 1;
+          item.countDown = next;
+          item.countDownStr = this._fmtCountDownStr(next);
+          needRerender = true;
 
-          if (cd <= 0) {
-            item.orderStatus = '交易取消';
+          if (next <= 0) {
+            item.orderStatus = '交易关闭';
             item.countDownStr = '';
-            if (!this.data.hasModalShown) {
+
+            // —— 仅在“当前页面可见”时弹一次，并且每单只弹一次；本页全局也只弹一次
+            if (this._isActive && !item._expiredNotified && !this.data.hasModalShown) {
+              item._expiredNotified = true;
               wx.showModal({
                 title: '提示',
-                content: '订单超时未支付，已取消',
+                content: '订单超时未支付，已关闭',
                 showCancel: false
               });
               this.setData({ hasModalShown: true });
@@ -109,17 +141,28 @@ Page({
         }
         return item;
       });
-      this.setData({ orderList: updated });
+
+      if (needRerender) {
+        this.setData({ orderList: updated }, () => {
+          // 如果已经没有可继续倒计时的订单，关掉定时器
+          const stillPending = this.data.orderList.some(o => o.orderStatus === '待支付' && o.countDown > 0);
+          if (!stillPending) this._clearTimer();
+        });
+      } else {
+        // 没有需要更新的也关掉
+        this._clearTimer();
+      }
     }, 1000);
   },
 
+  // ========= 支付相关 =========
   showIsPayModal(e) {
     const orderId = e.currentTarget.dataset.orderId;
     wx.showModal({
-      title: '下单成功',
-      content: '您确定要支付吗？',
+      title: '确认支付',
+      content: '是否立即支付该订单？',
       cancelText: '取消',
-      confirmText: '确定',
+      confirmText: '去支付',
       success: (res) => {
         if (res.confirm) {
           this.payOrder(orderId);
@@ -129,73 +172,71 @@ Page({
       },
       fail: () => {
         wx.hideLoading();
-        wx.showToast({
-          title: '网络错误，下单失败',
-          icon: 'none'
-        });
+        wx.showToast({ title: '网络错误', icon: 'none' });
       }
     });
   },
-  payOrder(orderId) {
-    // 同样先显示遮罩
- this.setData({ isMaskVisible: true });
-   wx.showLoading({ title: '支付中...'});
-   wx.request({
-     url: baseUrl + '/courseOrder/payment',
-     method: 'POST',
-     header: { Authorization: wx.getStorageSync('token') },
-     data: { id: orderId},
-     success: res => {
-       wx.hideLoading();
-       if (res.data.code === 1) {
-         // 支付成功，跳转详情页
-         wx.redirectTo({
-           url: `/pages/course/orderDetail/orderDetail?id=${orderId}`,
-           success: res => {
-               // 先把遮罩关掉
-               this.setData({ isMaskVisible: false });
-           }
-         });
-       } else {
-         this.setData({ isMaskVisible: false });
-         wx.showToast({ title: res.data.message || '支付失败', icon: 'none' });
-       }
-     },
-     fail: () => {
-       wx.hideLoading();
-       this.setData({ isMaskVisible: false });
-       wx.showToast({ title: '网络错误，支付失败', icon: 'none' });
-     }
-   });
- },
 
-  // 跳转订单详情
+  payOrder(orderId) {
+    this.setData({ isMaskVisible: true });
+    wx.showLoading({ title: '支付中...' });
+    wx.request({
+      url: baseUrl + '/courseOrder/payment',
+      method: 'POST',
+      header: { Authorization: wx.getStorageSync('token') },
+      data: { id: orderId }, // 与后端约定：支付接口传 id；若传 orderId 则改键名
+      success: res => {
+        wx.hideLoading();
+        if (res.data.code === 1) {
+          wx.redirectTo({
+            url: `/pages/course/orderDetail/orderDetail?id=${orderId}`,
+            complete: () => {
+              this.setData({ isMaskVisible: false });
+            }
+          });
+        } else {
+          this.setData({ isMaskVisible: false });
+          wx.showToast({ title: res.data.message || '支付失败', icon: 'none' });
+        }
+      },
+      fail: () => {
+        wx.hideLoading();
+        this.setData({ isMaskVisible: false });
+        wx.showToast({ title: '网络错误，支付失败', icon: 'none' });
+      }
+    });
+  },
+
+  // ========= 跳转 & 取消 =========
   gotoOrderDetail(e) {
     const orderId = e.currentTarget.dataset.id;
     wx.navigateTo({
       url: `/pages/course/orderDetail/orderDetail?id=${orderId}`,
-    })
+    });
   },
 
-  // 取消订单
   cancelOrder(e) {
-    // console.log(e);
     const id = e.currentTarget.dataset.id;
     wx.showModal({
       title: '取消订单',
-      content: '是否要取消订单？',
+      content: '是否要取消该订单？',
       success: res => {
         if (res.confirm) {
           wx.request({
             url: baseUrl + "/courseOrder/cancel",
             method: 'POST',
-            data: { courseId: id },
             header: { Authorization: wx.getStorageSync('token') },
-            success: () => this.fetchOrders()
+            data: { id }, // 如果后端需要 { orderId: id }，改这里的键名即可
+            success: r => {
+              if (r.data && r.data.code !== 1) {
+                wx.showToast({ title: r.data.message || '取消失败', icon: 'none' });
+              }
+              this.fetchOrders();
+            },
+            fail: () => wx.showToast({ title: '网络错误', icon: 'none' })
           });
         }
       }
     });
   }
-
 });

pages/course/courseOrderList/courseOrderList.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "enablePullDownRefresh": true
 }

pages/course/courseOrderList/courseOrderList.wxml

@@ -1,42 +1,55 @@
 <!-- pages/course/courseOrderList/courseOrderList.wxml -->
-<view class="flex-col justify-start page">
-  <view class="flex-col group_1">
-    <view 
-      class="flex-col list-item mt-17" 
-      wx:for="{{orderList}}" 
-      wx:for-item="item" 
-      wx:for-index="index" 
-      wx:key="item"
-      bind:tap="gotoOrderDetail"
-      data-id="{{ item.id }}"
-    >
-      <view class="flex-row self-stretch group">
-        <text class="font text">订单号：{{item.orderNumber}}</text>
-        <text class="font_2">{{ item.orderStatus }}</text>
+<view class="page">
+
+<!-- 列表滚动区 -->
+<scroll-view scroll-y class="content no-scrollbar">
+
+  <!-- 空状态（可选） -->
+  <view wx:if="{{ !orderList || orderList.length === 0 }}" class="empty">
+    <image class="empty-img" src="./image/empty.png" mode="aspectFit" />
+    <text class="empty-text">暂无订单</text>
+  </view>
+
+  <!-- 订单卡片列表 -->
+  <view wx:for="{{ orderList }}"
+        wx:for-item="item"
+        wx:for-index="index"
+        wx:key="id"
+        class="card order-item"
+        bind:tap="gotoOrderDetail"
+        data-id="{{ item.id }}">
+
+    <!-- 顶部：订单号 + 状态徽标 -->
+    <view class="topline">
+      <text class="order-no">订单号：{{ item.orderNumber }}</text>
+      <view class="status-badge {{ item.orderStatus === '待支付' ? 'status-pending' : (item.orderStatus === '已支付' || item.orderStatus === '交易成功' ? 'status-success' : 'status-default') }}">
+        <text class="status-text">{{ item.orderStatus }}</text>
       </view>
+    </view>
 
-      <text class="self-stretch font_3 text_2">{{ item.name }}</text>
-      <text class="self-end font_4 text_3">￥{{ item.totalAmount }}</text>
+    <!-- 课程名称 -->
+    <text class="course-name ellipsis-2">{{ item.name }}</text>
 
-      <!-- 倒计时，只在“待支付”时显示 -->
-      <text wx:if="{{ item.orderStatus === '待支付' }}" class="self-end font_5 text_4">
-        请在 {{ item.countDownStr }} 内完成支付
-      </text>
+    <!-- 价格 + 倒计时（仅待支付显示） -->
+    <view class="price-line">
+      <text class="amount">￥{{ item.totalAmount }}</text>
+      <view wx:if="{{ item.orderStatus === '待支付' }}" class="countdown-pill">
+        <text class="countdown-text">请在 {{ item.countDownStr }} 内完成支付</text>
+      </view>
+    </view>
 
-      <view class="flex-row justify-between items-center self-stretch group_2">
-        <text class="font_6 text_5">{{ item.createTime }}</text>
-        <view class="flex-row">
-          <!-- 仅待支付时可操作 -->
-          <view wx:if="{{ item.orderStatus === '待支付' }}" class="flex-col justify-start items-center text-wrapper" catch:tap="cancelOrder" data-id="{{ item.id }}">
-            <text class="font_7">取消订单</text>
-          </view>
-          <view wx:if="{{ item.orderStatus === '待支付' }}" class="flex-col justify-start items-center text-wrapper_2 ml-11" catch:tap="showIsPayModal"
-          data-order-id="{{ item.id }}">
-            <text class="font_8">支付</text>
-          </view>
-        </view>
+    <!-- 底部：下单时间 + 操作按钮（仅待支付显示） -->
+    <view class="bottomline">
+      <text class="ctime">{{ item.createTime }}</text>
+      <view class="actions" wx:if="{{ item.orderStatus === '待支付' }}">
+        <view class="btn btn-ghost" catch:tap="cancelOrder" data-id="{{ item.id }}">取消订单</view>
+        <view class="btn btn-primary" catch:tap="showIsPayModal" data-order-id="{{ item.id }}">支付</view>
       </view>
     </view>
   </view>
-  <view wx:if="{{isMaskVisible}}" class="page-mask"></view>
-</view>
+
+</scroll-view>
+
+<!-- 遮罩 -->
+<view wx:if="{{ isMaskVisible }}" class="page-mask"></view>
+</view>

pages/course/courseOrderList/courseOrderList.wxss

@@ -1,134 +1,169 @@
-/* pages/course/courseOrderList/courseOrderList.wxss */
+/* ===== 页面与滚动 ===== */
+.page {
+  background: #f7f7f7;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+}
 
-.mt-17 {
-  margin-top: 31.88rpx;
+.content {
+  flex: 1;
+  padding: 24rpx 24rpx; /* 统一外边距 */
+  box-sizing: border-box;
 }
-.ml-37 {
-  margin-left: 92.38rpx;
-}
-.ml-11 {
-  margin-left: 20.63rpx;
+
+.no-scrollbar::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  display: none;
 }
+
+/* 遮罩 */
 .page-mask {
   position: fixed;
-  top: 0; left: 0;
-  width: 100%; height: 100%;
-  background-color: rgba(0, 0, 0, 0.3);
+  inset: 0;
+  background-color: rgba(0, 0, 0, 0.35);
   z-index: 9999;
 }
-.page {
-  padding: 26.25rpx 0 50.63rpx;
-  background-color: #f8f8f8;
-  width: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
-  height: 100%;
-}
-.group_1 {
-  margin-left: 20.63rpx;
-  margin-right: 18.77rpx;
-}
-.list-item {
-  padding-left: 22.5rpx;
-  padding-right: 3.51rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.66rpx;
-}
-.list-item:first-child {
-  margin-top: 0;
-}
-.group {
-  padding: 32.51rpx 15rpx 25.82rpx 0;
-  border-bottom: solid 1.88rpx #e3e3e3;
+
+/* ===== 空状态 ===== */
+.empty {
+  padding: 100rpx 0;
   display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: #999999;
+}
+.empty-img { width: 280rpx; height: 280rpx; margin-bottom: 20rpx; }
+.empty-text { font-size: 28rpx; }
+
+/* ===== 卡片通用 ===== */
+.card {
+  background: #ffffff;
+  border-radius: 16rpx;
+  padding: 24rpx;
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.05);
+}
+.card + .card { margin-top: 20rpx; }
+
+/* ===== 列表项排版 ===== */
+.order-item {
+  display: flex;
+  flex-direction: column;
+  gap: 16rpx;
+}
+
+/* 顶部行：订单号 + 状态 */
+.topline {
+  display: flex;
+  align-items: center;
   justify-content: space-between;
+  gap: 16rpx;
 }
-.font {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.17rpx;
-  color: #696969;
+.order-no {
+  font-size: 26rpx;
+  color: #666666;
 }
-.text {
-  line-height: 24.02rpx;
+
+.status-badge {
+  height: 40rpx;
+  padding: 0 18rpx;
+  border-radius: 999rpx;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
 }
-.font_2 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.17rpx;
-  color: #f84947;
+.status-text {
+  font-size: 24rpx;
+  font-weight: 600;
 }
-.font_3 {
+.status-pending { background: #fff6e6; color: #ff8d1a; }     /* 待支付：主题橙 */
+.status-success { background: #e9fbef; color: #12b05b; }     /* 已/成功：绿色 */
+.status-default { background: #f0f0f0; color: #666666; }     /* 其他：灰 */
+
+/* 课程名称 */
+.course-name {
   font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 35.63rpx;
-  color: #000000;
+  font-weight: 600;
+  color: #1f1f1f;
+  line-height: 44rpx;
 }
-.text_2 {
-  margin-top: 25.69rpx;
+.ellipsis-2 {
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
 }
-.font_4 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.17rpx;
-  color: #3d3d3d;
+
+/* 价格 + 倒计时 */
+.price-line {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16rpx;
 }
-.text_3 {
-  margin-top: 58.09rpx;
-  line-height: 22.76rpx;
-  margin-right: 22rpx; /* 向左移动：增加右侧间距 */
+.amount {
+  font-size: 34rpx;
+  color: #ff5a1a;     /* 与你的小程序橙色系统一 */
+  font-weight: 700;
 }
-.font_5 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 26.32rpx;
-  color: #f84947;
+
+.countdown-pill {
+  background: #fff4f2;
+  border: 1rpx solid #ffd6cc;
+  padding: 0 16rpx;
+  height: 40rpx;
+  border-radius: 999rpx;
+  display: inline-flex;
+  align-items: center;
 }
-.text_4 {
-  margin-right: 7.13rpx;
-  margin-top: 34.91rpx;
-  font-size: 28.13rpx;
+.countdown-text {
+  font-size: 22rpx;
+  color: #ff5a1a;
 }
-.group_2 {
-  margin-right: 20.87rpx;
-  margin-top: 30.30rpx;
-  padding: 15.94rpx 0 17.81rpx;
-  border-top: solid 1.88rpx #e3e3e3;
+
+/* 底部行：时间 + 操作区 */
+.bottomline {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16rpx;
+  padding-top: 8rpx;
+  border-top: 1rpx dashed #f0f0f0;
 }
-.font_6 {
-  font-size: 22.5rpx;
-  font-family: SourceHanSansCN;
-  line-height: 26.25rpx;
-  color: #a1a1a1;
+.ctime {
+  font-size: 24rpx;
+  color: #888888;
 }
-/* .text_5 {
-  width: 206.25rpx;
-} */
-.text-wrapper {
-  padding: 10.8rpx 0 8.16rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  width: 142.5rpx;
-  height: 46.88rpx;
-  border: solid 1.88rpx #ff8d1a;
+
+.actions {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
 }
-.font_7 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.17rpx;
-  color: #ff8d1a;
+
+/* 按钮 */
+.btn {
+  height: 64rpx;
+  min-width: 180rpx;
+  padding: 0 24rpx;
+  border-radius: 999rpx;
+  font-size: 26rpx;
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
-.text-wrapper_2 {
-  padding: 11.89rpx 0 8.94rpx;
-  background-color: #ff8d1a;
-  border-radius: 9.38rpx;
-  width: 140.63rpx;
-  height: 45rpx;
+.btn-ghost {
+  background: #ffffff;
+  color: #333333;
+  border: 2rpx solid #e6e6e6;
 }
-.font_8 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.17rpx;
+.btn-primary {
+  background: linear-gradient(180deg, #ffa64a 0%, #ff8d1a 100%);
   color: #ffffff;
+  box-shadow: 0 6rpx 14rpx rgba(255, 141, 26, 0.25);
 }
+
+/* ===== 迁移提示：以下旧的散装类可删除（如无外部依赖） ===== */
+/* .mt-17, .ml-37, .ml-11, .group_1, .list-item, .group, .font*, .text* 等 */

pages/course/createCourseOrder/createCourseOrder.js

@@ -1,4 +1,7 @@
 import { baseUrl, globalImgUrl } from "../../../request";
+const { notLogin } = require('../../../utils/util')
+import { decodeBase64 } from "../../../utils/decodebase64";
+
 // pages/course/createCourseOrder/createCourseOrder.js
 Page({
 
@@ -9,9 +12,23 @@ Page({
     courseId: 0, // 课程id
     courseObj: '', // 课程对象
     globalImgUrl, // 全局图片
-    isMaskVisible: false
+    isMaskVisible: false,
+    isNoticeVisible: true,
+    noticeHtml: '',
   },
 
+  // 打开/关闭弹窗
+openNotice() {
+  this.setData({ isNoticeVisible: true });
+},
+closeNotice() {
+  this.setData({ isNoticeVisible: false });
+},
+// 阻止冒泡/滚动穿透的空函数
+noop() {},
+
+
+
   // 创建订单方法
   createOrder() {
     const { courseId } = this.data;
@@ -131,7 +148,30 @@ Page({
           this.setData({
             courseObj: res.data.data,
           })
+        } else {
+          notLogin(res.data.message)
         }
+      },
+      fail: () => {
+        wx.showToast({ title: '网络错误', icon: 'none' });
+      }
+    })
+  },
+
+  getCourseDesc() {
+    wx.request({
+      url: baseUrl + '/userInfo/query/courseDesc',
+      method: 'POST',
+      success: res => {
+        console.log('====>购买须知', res.data)
+        if (res.data.code === 1) {
+          this.setData({noticeHtml: decodeBase64(res.data.data)})
+        } else {
+          notLogin(res.data.message)
+        }
+      }, 
+      fail: () => {
+        wx.showToast({ title: '网络错误', icon: 'none' });
       }
     })
   },
@@ -145,6 +185,7 @@ Page({
       courseId: options.id,
     })
     this.getCourseDetail()
+    this.getCourseDesc()
   },
 
   /**

pages/course/createCourseOrder/createCourseOrder.wxml

@@ -1,48 +1,77 @@
 <!-- pages/course/createCourseOrder/createCourseOrder.wxml -->
-<view class="flex-col page">
-  <view class="flex-col content">
-    <view class="flex-row items-center section">
+<view class="page">
+
+  <!-- 可滚动内容区：为固定底部预留内边距，避免遮挡 -->
+  <scroll-view scroll-y class="content no-scrollbar">
+
+    <!-- 商品信息卡片 -->
+    <view class="card product">
       <image
-        class="shrink-0 image"
+        class="cover"
         src="{{ globalImgUrl + courseObj.image }}"
+        mode="aspectFill"
+        lazy-load="true"
       />
-      <view class="flex-col flex-1 ml-11">
-        <text class="self-start text">{{ courseObj.name }}</text>
-        <view class="flex-row items-center self-stretch group mt-15">
-          <text class="text_2">￥{{ courseObj.discountPrice }}</text>
-          <view class="flex-col justify-start relative ml-1">
-            <text class="text_3">￥{{ courseObj.originPrice }}</text>
-            <view class="divider pos"></view>
-          </view>
+      <view class="info">
+        <text class="title ellipsis-2">{{ courseObj.name }}</text>
+        <view class="price-line">
+          <text class="price-now">￥{{ courseObj.discountPrice }}</text>
+          <text class="price-origin">￥{{ courseObj.originPrice }}</text>
         </view>
       </view>
     </view>
-    <view class="flex-row justify-between items-center section_2 mt-14">
-      <text class="font">商品价格</text>
-      <text class="font text_4">￥{{ courseObj.discountPrice }}</text>
+
+    <!-- 商品价格行 -->
+    <view class="card row">
+      <text class="row-left">商品价格</text>
+      <text class="row-right accent">￥{{ courseObj.discountPrice }}</text>
     </view>
-    <view class="flex-row justify-between items-center section_3 mt-14">
-      <view class="flex-row items-center">
-        <image
-          class="shrink-0 image_2"
-          src="./image/wxpay.png"
-        />
-        <text class="font ml-12">微信支付</text>
+
+    <!-- 支付方式 -->
+    <view class="card pay">
+      <view class="pay-left">
+        <image class="pay-icon" src="./image/wxpay.png" mode="aspectFit" />
+        <text class="pay-text">微信支付</text>
       </view>
-      <radio-group class="image_3">
-        <radio checked="true"></radio>
+      <radio-group class="pay-right" bindchange="onPayMethodChange">
+        <radio value="wxpay" checked></radio>
       </radio-group>
     </view>
-  </view>
-  <!-- 固定在底部的区域 -->
+
+  </scroll-view>
+
+  <!-- 固定底部结算栏 -->
   <view class="footer">
-    <view class="flex-row justify-between items-center section_4">
-      <text class="font text_5">应付￥{{ courseObj.discountPrice }}</text>
-      <view class="flex-col justify-center items-center text-wrapper" bindtap="createOrder">
-        <text class="font text_6">立即支付</text>
-      </view>
+    <view class="footer-inner">
+      <text class="to-pay">应付 <text class="to-pay-amount">￥{{ courseObj.discountPrice }}</text></text>
+      <view class="btn-pay" bindtap="createOrder">立即支付</view>
     </view>
   </view>
 
+  <!-- 遮罩 -->
   <view wx:if="{{isMaskVisible}}" class="page-mask"></view>
 </view>
+
+
+<!-- ===== 购买须知弹窗（富文本） ===== -->
+<view wx:if="{{isNoticeVisible}}" class="modal-mask" catchtouchmove="noop">
+  <view class="modal" catchtap="noop">
+    <view class="modal-title">课程购买须知</view>
+
+    <!-- 富文本内容：支持 p/h1-h6/strong/em/ul/ol/a 等常见标签 -->
+    <scroll-view scroll-y class="modal-body">
+      <rich-text nodes="{{noticeHtml}}"></rich-text>
+    </scroll-view>
+
+    <view class="modal-actions">
+      <button class="btn-primary" bindtap="closeNotice">我知道了</button>
+    </view>
+  </view>
+</view>
+
+<!-- 右上角购买须知按钮 -->
+<view class="notice-icon" bindtap="openNotice">
+  <image src="./image/info.png" mode="aspectFit" class="notice-icon-img" />
+  <text class="notice-icon-text">购买须知</text>
+</view>
+

pages/course/createCourseOrder/createCourseOrder.wxss

@@ -1,126 +1,320 @@
-.ml-11 {
-  margin-left: 20.63rpx;
-}
-.mt-15 {
-  margin-top: 28.13rpx;
-}
-.ml-1 {
-  margin-left: 1.88rpx;
-}
-/* app.wxss 或 当前页面 .wxss */
-.page-mask {
-  position: fixed;
-  top: 0; left: 0;
-  width: 100%; height: 100%;
-  background-color: rgba(0, 0, 0, 0.3);
-  z-index: 9999;
-}
+/* 页面与滚动容器 */
 .page {
   background-color: #f7f7f7;
   width: 100%;
-  height: 100vh;
+  min-height: 100vh;
   display: flex;
   flex-direction: column;
 }
+
 .content {
   flex: 1;
-  overflow-y: auto;
-}
-.section {
-  padding: 20.63rpx 22.5rpx 27.58rpx;
-  background-color: #ffffff;
-  border-radius: 3.94rpx;
-}
-.image {
-  border-radius: 9.38rpx;
-  width: 208.13rpx;
-  height: 133.13rpx;
-}
-.text {
-  color: #000000;
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 35.63rpx;
-  width: 429.38rpx;
-}
-.group {
-  padding: 0 4.29rpx;
-}
-.text_2 {
-  color: #f84947;
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 22.76rpx;
-}
-.text_3 {
-  color: #8c8c8c;
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 19.93rpx;
-}
-.divider {
-  background-color: #8c8c8c;
-  width: 69.56rpx;
-  height: 1.88rpx;
-}
-.pos {
-  position: absolute;
-  left: 0;
-  top: 50%;
-  transform: translateY(-50%);
-}
-.section_2 {
-  padding: 48.69rpx 29.21rpx 43.35rpx 44.96rpx;
-  background-color: #ffffff;
-}
-.font {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.96rpx;
-  color: #323232;
-}
-.text_4 {
-  line-height: 22.91rpx;
-}
-.section_3 {
-  padding: 39.38rpx 46.88rpx 897.38rpx 48.75rpx;
-  background-color: #ffffff;
-}
-.image_2 {
-  width: 52.5rpx;
-  height: 52.5rpx;
-}
-.image_3 {
-  width: 41.25rpx;
-  height: 41.25rpx;
-}
-.section_4 {
-  padding: 16.88rpx 24.38rpx 16.88rpx 31.09rpx;
-  background-color: #ffffff;
-}
-.text_5 {
-  color: #000000;
-  line-height: 28.05rpx;
-}
-.text-wrapper {
-  padding: 14.07rpx 0 19.07rpx;
-  background-color: #ff8d1a;
-  border-radius: 75rpx;
-  width: 268.13rpx;
-  height: 71.25rpx;
-  display: flex;
-  justify-content: center;  /* 水平居中 */
-  align-items: center;      /* 垂直居中 */
+  padding: 24rpx 24rpx 160rpx; /* bottom 预留给固定底部栏 */
+  box-sizing: border-box;
 }
 
-.text_6 {
-  color: #ffffff;
-  line-height: 28.11rpx;
+.no-scrollbar::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  display: none;
 }
+
+/* 通用卡片 */
+.card {
+  background-color: #ffffff;
+  border-radius: 16rpx;
+  padding: 24rpx;
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.04);
+}
+
+.card + .card {
+  margin-top: 20rpx;
+}
+
+/* 商品信息卡片 */
+.product {
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  gap: 20rpx;
+}
+
+.cover {
+  width: 260rpx;
+  height: 180rpx;
+  border-radius: 12rpx;
+  flex-shrink: 0;
+  background: #f2f2f2;
+}
+
+.info {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  justify-content: space-between;
+  min-width: 0; /* 使多行省略生效 */
+}
+
+.title {
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #1f1f1f;
+  line-height: 48rpx;
+}
+
+.ellipsis-2 {
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+
+.price-line {
+  display: flex;
+  align-items: baseline;
+  gap: 12rpx;
+  margin-top: 8rpx;
+}
+
+.price-now {
+  font-size: 36rpx;
+  font-weight: 700;
+  color: #ff5a1a; /* 与主题橙统一 */
+  line-height: 1;
+}
+
+.price-origin {
+  font-size: 26rpx;
+  color: #9f9f9f;
+  text-decoration: line-through; /* 用样式处理中划线 */
+}
+
+/* 通用行（键值对） */
+.row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.row-left {
+  font-size: 30rpx;
+  color: #4a4a4a;
+}
+
+.row-right {
+  font-size: 30rpx;
+  color: #1f1f1f;
+}
+
+.accent {
+  color: #ff5a1a;
+  font-weight: 600;
+}
+
+/* 支付方式 */
+.pay {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.pay-left {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+}
+
+.pay-icon {
+  width: 56rpx;
+  height: 56rpx;
+  border-radius: 8rpx;
+}
+
+.pay-text {
+  font-size: 30rpx;
+  color: #333333;
+}
+
+.pay-right {
+  display: flex;
+  align-items: center;
+}
+
+/* 固定底部 */
 .footer {
-  margin-top: auto;
-  width: 100%;
   position: fixed;
-  bottom: 0;
   left: 0;
+  right: 0;
+  bottom: 0;
+  background: #ffffff;
+  box-shadow: 0 -6rpx 20rpx rgba(0,0,0,0.06);
+  padding-bottom: env(safe-area-inset-bottom);
+  /* 兼容旧版 iOS */
+  padding-bottom: constant(safe-area-inset-bottom);
 }
+
+.footer-inner {
+  height: 120rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 24rpx;
+  padding: 0 24rpx;
+  box-sizing: border-box;
+}
+
+.to-pay {
+  font-size: 28rpx;
+  color: #666666;
+}
+
+.to-pay-amount {
+  font-size: 36rpx;
+  color: #ff5a1a;
+  font-weight: 700;
+  margin-left: 8rpx;
+}
+
+/* 支付按钮：使用 view，自定义橙色主题 */
+.btn-pay {
+  min-width: 260rpx;
+  height: 88rpx;
+  border-radius: 999rpx;
+  background: linear-gradient(180deg, #ffa64a 0%, #ff8d1a 100%);
+  color: #ffffff;
+  font-size: 30rpx;
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 6rpx 14rpx rgba(255, 141, 26, 0.35);
+  active-opacity: 0.85;
+}
+
+/* 遮罩层 */
+.page-mask {
+  position: fixed;
+  inset: 0;
+  background-color: rgba(0, 0, 0, 0.35);
+  z-index: 9999;
+}
+
+/* 旧样式中可能用到的零散类，若无依赖可移除 */
+.ml-11 { margin-left: 20rpx; }
+.mt-15 { margin-top: 28rpx; }
+.ml-1  { margin-left: 2rpx; }
+
+
+
+/* 入口小字 */
+.notice-entry {
+  margin-right: 16rpx;
+  font-size: 24rpx;
+  color: #8a8a8a;
+  text-decoration: underline;
+}
+
+/* 弹窗遮罩 */
+.modal-mask {
+  position: fixed;
+  z-index: 999;              /* 确保在你的 .footer 与其他遮罩之上 */
+  inset: 0;
+  background: rgba(0,0,0,0.45);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 40rpx;
+}
+
+/* 弹窗容器 */
+.modal {
+  width: 86%;
+  max-width: 640rpx;
+  max-height: 70vh;
+  background: #fff;
+  border-radius: 24rpx;
+  overflow: hidden;
+  box-shadow: 0 12rpx 40rpx rgba(0,0,0,0.18);
+}
+
+/* 标题 */
+.modal-title {
+  padding: 28rpx 32rpx 12rpx;
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #222;
+}
+
+/* 内容区滚动 */
+.modal-body {
+  max-height: 48vh;
+  padding: 8rpx 32rpx 24rpx;
+}
+rich-text {
+  padding-bottom: 32rpx;
+}
+
+/* 富文本默认样式优化 */
+.modal-body rich-text {
+  display: block;
+  font-size: 26rpx;
+  line-height: 1.75;
+  color: #444;
+}
+.modal-body h3 { font-size: 28rpx; margin: 18rpx 0 8rpx; color: #222; }
+.modal-body p { margin: 10rpx 0; }
+.modal-body ul, .modal-body ol { margin: 10rpx 0 10rpx 28rpx; }
+.modal-body a { color: #1677ff; word-break: break-all; }
+
+/* 底部按钮区 */
+.modal-actions {
+  padding: 20rpx 24rpx 28rpx;
+}
+.btn-primary {
+  width: 100%;
+  height: 84rpx;
+  line-height: 84rpx;
+  text-align: center;
+  border-radius: 16rpx;
+  background: #ff8a00;      /* 你的主色调（可换成项目变量） */
+  color: #fff;
+  font-size: 30rpx;
+  font-weight: 600;
+}
+.btn-primary:active {
+  opacity: 0.85;
+}
+
+.notice-icon {
+  position: absolute;
+  top: 20rpx;
+  right: 20rpx;
+  z-index: 10;
+  display: flex;
+  align-items: center;
+  background: rgba(255, 255, 255, 0.92);
+  border-radius: 30rpx;
+  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15);
+  padding: 6rpx 14rpx;
+}
+
+.notice-icon-img {
+  width: 34rpx;
+  height: 34rpx;
+  margin-right: 8rpx;
+}
+
+.notice-icon-text {
+  font-size: 24rpx;
+  color: #333;
+}
+.notice-icon:active {
+  opacity: 0.85;
+}
+
+::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  background: transparent;
+}
+

pages/course/homepage/homepage.js

@@ -1,18 +1,13 @@
 import { baseUrl } from "../../../request";
 const { globalImgUrl } = require("../../../request")
+const { notLogin } = require('../../../utils/util')
 
 // pages/course/homepage/homepage.js
 Page({
 
   data: {
-    // 初始时置空，待接口返回后再渲染
-    banners: [
-      './image/banner.png',
-      './image/banner.png',
-      './image/banner.png',
-      './image/banner.png'
-    ],
     courseList: [],
+    bannerList: [],
     globalImgUrl
   },
 
@@ -57,10 +52,7 @@ Page({
             courseList: res.data.data
           });
         } else {
-          wx.showToast({
-            title: res.data.message || '获取课程数据失败',
-            icon: 'none'
-          });
+          notLogin(res.data.message)
         }
       },
       fail: () => {
@@ -72,10 +64,37 @@ Page({
     });
   },
 
+  getBannerList() {
+    const token = wx.getStorageSync('token')
+    wx.request({
+      url: baseUrl + '/banner/mini/list',
+      method: 'GET',
+      header: {
+        'Authorization': token
+      },
+      success: res => {
+        if (res.data.code === 1) {
+          this.setData({
+            bannerList: res.data.data
+          });
+        } else {
+          notLogin(res.data.message)
+        }
+      },
+      fail: () => {
+        wx.showToast({
+          title: '网络异常，请稍后重试',
+          icon: 'none'
+        });
+      }
+    })
+  },
+
   /**
    * 生命周期函数--监听页面加载
    */
-  onLoad(options) {
+  onLoad() {
+    this.getBannerList()
     this.getCourseList()
   },
 
@@ -111,7 +130,10 @@ Page({
    * 页面相关事件处理函数--监听用户下拉动作
    */
   onPullDownRefresh() {
-
+    this.getBannerList()
+    this.getCourseList()
+     // 停止下拉刷新动画
+     wx.stopPullDownRefresh();
   },
 
   /**

pages/course/homepage/homepage.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "enablePullDownRefresh": true
 }

pages/course/homepage/homepage.wxml

@@ -1,50 +1,64 @@
-<view class="flex-col page">
-  <view class="flex-col self-stretch group">
-    <view class="flex-row justify-center items-center section" bind:tap="gotoSearch">
-      <image class="image" src="./image/sousuo.png" />
-      <text class="text ml-3">搜索更多好课</text>
-    </view>
-    <swiper class="swiper" autoplay="true" circular="true" interval="3000" circular="true">
-      <block wx:for="{{banners}}" wx:for-item="img" wx:key="index">
-        <swiper-item>
-          <image src="{{img}}" class="swiper-image" mode="aspectFill" />
-        </swiper-item>
-      </block>
-    </swiper>
+<view class="page">
+
+<!-- 顶部内容：搜索 + 轮播 -->
+<view class="top">
+  <view class="search-bar" bindtap="gotoSearch" hover-class="hover">
+    <image class="search-icon" src="./image/sousuo.png" mode="aspectFit"/>
+    <text class="search-text">搜索更多好课</text>
   </view>
-  <view class="flex-row equal-division">
-    <view class="flex-col items-center group_2 group_1" bind:tap="gotoCourseList" data-type="{{ '考编' }}">
-      <image class="image_3" src="./image/kgky.png" />
-      <text class="font text_1 mt-12">考编</text>
-    </view>
-    <view class="flex-col items-center group_2 group_3" bind:tap="gotoCourseList" data-type="{{ '考公' }}">
-      <image class="image_3" src="./image/zmt.png" />
-      <text class="font text_3 mt-12">考公</text>
-    </view>
-    <view class="flex-col items-center group_2 group_4" bind:tap="gotoCourseList" data-type="{{ '考证' }}">
-      <image class="image_3" src="./image/cj.png" />
-      <text class="font text_4 mt-12">考证</text>
-    </view>
+
+  <swiper class="swiper" autoplay="true" interval="3000" circular="true" indicator-dots="true" indicator-active-color="#ff6a00">
+    <block wx:for="{{bannerList}}" wx:for-item="img" wx:key="index">
+      <swiper-item>
+        <image src="{{globalImgUrl + img}}" class="swiper-image" mode="aspectFill" lazy-load="true"/>
+      </swiper-item>
+    </block>
+  </swiper>
+</view>
+
+<!-- 三分类 -->
+<view class="category-row">
+  <view class="category-card" bindtap="gotoCourseList" data-type="考编" hover-class="hover">
+    <image class="category-icon" src="./image/考编.png" mode="aspectFit" lazy-load="true"/>
+    <text class="category-text">考编</text>
   </view>
-  <text class="self-start text_2">热门课程</text>
-  <view class="flex-col self-stretch list">
-    <!-- items 数组循环 -->
-    <view class="flex-row relative group_5" wx:for="{{courseList}}" wx:for-item="item" wx:for-index="index" wx:key="item.id">
-      <view bind:tap="gotoCourseDetail" data-id="{{item.id}}">
-        <view class="list-divider pos_3"></view>
-        <!-- 绑定课程封面图 -->
-        <image class="image_4 pos" src="{{ globalImgUrl + item.image}}" />
-        <view class="flex-col group_6 pos_2">
-          <!-- 绑定课程名称 -->
-          <text class="font_2">{{item.name}}</text>
-          <view class="flex-row justify-between items-baseline mt-17">
-            <!-- 绑定卷后价格 -->
-            <text class="font_3">券后{{item.discountPrice}}元起</text>
-            <!-- 绑定下单/学习人数 -->
-            <text class="font_4">{{item.orderCount}}人学习</text>
+  <view class="category-card" bindtap="gotoCourseList" data-type="考公" hover-class="hover">
+    <image class="category-icon" src="./image/考公.png" mode="aspectFit" lazy-load="true"/>
+    <text class="category-text">考公</text>
+  </view>
+  <view class="category-card" bindtap="gotoCourseList" data-type="考证" hover-class="hover">
+    <image class="category-icon" src="./image/考证.png" mode="aspectFit" lazy-load="true"/>
+    <text class="category-text">考证</text>
+  </view>
+</view>
+
+<!-- 热门课程标题 -->
+<view class="section-head">
+  <text class="section-title">热门课程</text>
+</view>
+
+<!-- 热门课程两列宫格 -->
+<scroll-view scroll-y class="list no-scrollbar">
+  <view class="grid">
+    <block wx:for="{{courseList}}" wx:key="item.id" wx:for-item="item">
+      <view class="grid-item" bindtap="gotoCourseDetail" data-id="{{item.id}}" hover-class="hover">
+        <image class="grid-cover" src="{{ globalImgUrl + item.image }}" mode="aspectFill" lazy-load="true"/>
+        <view class="grid-info">
+          <text class="grid-title">{{item.name}}</text>
+          <view class="grid-meta">
+            <text class="grid-price">¥{{item.discountPrice}}</text>
+            <text class="grid-people">{{item.orderCount}}人学习</text>
           </view>
         </view>
       </view>
-    </view>
+    </block>
   </view>
-</view>
+
+  <!-- 空状态 -->
+  <view wx:if="{{!courseList || courseList.length == 0}}" class="empty">
+    <image class="empty-icon" src="/static/empty.png" mode="aspectFit"/>
+    <text class="empty-text">暂无课程，去看看其他分类吧～</text>
+  </view>
+</scroll-view>
+
+</view>

pages/course/homepage/homepage.wxss

@@ -1,142 +1,118 @@
-.ml-3 {
-  margin-left: 5.63rpx;
-}
-.mt-17 {
-  margin-top: 31.88rpx;
-}
 .page {
-  padding: 0rpx 0 10.88rpx;
-  background-color: #ffffff;
-  width: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
-  height: 100%;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #ffffff;
+  overflow: hidden;
+  font-family: SourceHanSansCN, PingFang SC, Microsoft YaHei, system-ui, -apple-system, sans-serif;
 }
-.group {
-  padding-left: 30rpx;
-  padding-right: 28.13rpx;
+.hover { opacity: 0.8; transition: opacity .2s ease; }
+
+::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  background: transparent;
 }
-.section {
-  padding: 15.25rpx 0;
-  background-color: #f2f2f2;
-  border-radius: 93.75rpx;
-}
-.image {
-  width: 35.63rpx;
-  height: 35.63rpx;
-}
-.text {
-  color: #a8a8a8;
-  font-size: 26.5rpx;
-  font-family: SourceHanSerifCN;
-  line-height: 20.83rpx;
-}
-.equal-division {
-  align-self: stretch;
-  margin: 21.88rpx 31.46rpx 0 29.48rpx;
-}
-.group_2 {
-  flex: 1 1 229.69rpx;
-}
-.group_1 {
-  padding: 13.56rpx 0 9.99rpx;
-}
-.image_3 {
-  width: 96rpx;
-  height: 96rpx;
-}
-.font {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.15rpx;
-  color: #000000;
-}
-.text_1 {
-  line-height: 24.26rpx;
-}
-.group_3 {
-  padding: 13.56rpx 0 10.09rpx;
-}
-.text_3 {
-  line-height: 24.23rpx;
-}
-.group_4 {
-  padding: 13.56rpx 0 10.13rpx;
-}
-.text_4 {
-  line-height: 24.13rpx;
-}
-.text_2 {
-  margin-left: 35.04rpx;
-  margin-top: 38.16rpx;
-  color: #000000;
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.75rpx;
-}
-.list {
-  margin-top: 9.56rpx;
-}
-.group_5 {
-  padding: 18.75rpx 29.46rpx 0 35.63rpx;
-  height: 180rpx;
-}
-.list-divider {
-  background-color: #d6d6d6;
-  height: 1.88rpx;
-}
-.pos_3 {
-  position: absolute;
-  left: 35.63rpx;
-  right: 33.81rpx;
-  top: 178.13rpx;
-}
-.image_4 {
-  border-radius: 9.38rpx;
-  width: 208.13rpx;
-  height: 133.13rpx;
-}
-.pos {
-  position: absolute;
-  left: 35.63rpx;
-  top: 50%;
-  transform: translateY(-50%);
-}
-.group_6 {
-  width: 453.49rpx;
-}
-.pos_2 {
-  position: absolute;
-  right: 29.46rpx;
-  top: 50%;
-  transform: translateY(-50%);
-}
-.font_2 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 31.88rpx;
-  color: #000000;
-}
-.font_3 {
-  font-size: 26.25rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 24.15rpx;
-  color: #ff5733;
-}
-.font_4 {
-  font-size: 22.5rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 20.34rpx;
-  color: #a6a6a6;
+
+
+/* 顶部 */
+.top { padding: 30rpx; }
+.search-bar {
+  display: flex; align-items: center; gap: 14rpx;
+  padding: 18rpx 22rpx; border-radius: 9999rpx;
+  background: #f5f6f7;
 }
+.search-icon { width: 36rpx; height: 36rpx; }
+.search-text { font-size: 26rpx; color: #a8a8a8; }
+
 .swiper {
-  border-radius: 9.38rpx;
-  width: 691.88rpx;
-  height: 324.38rpx;
-  margin-top: 22.5rpx;
+  width: 100%; height: 324rpx; margin-top: 24rpx;
+  border-radius: 16rpx; overflow: hidden;
 }
-/* 轮播图图片 */
-.swiper-image {
-  width: 100%;
-  height: 100%;
-}
+.swiper-image { width: 100%; height: 100%; }
+
+/* 分类 */
+.category-row {
+  display: flex; gap: 24rpx; padding: 0 30rpx; margin-top: 22rpx;
+}
+.category-card {
+  flex: 1; background: #fff; border-radius: 20rpx;
+  padding: 22rpx 0 18rpx;
+  display: flex; flex-direction: column; align-items: center; gap: 12rpx;
+  box-shadow: 0 6rpx 24rpx rgba(0,0,0,0.06);
+}
+.category-icon { width: 96rpx; height: 96rpx; }
+.category-text { font-size: 26rpx; color: #111; }
+
+/* 标题 */
+.section-head { padding: 28rpx 30rpx 16rpx; }
+.section-title { font-size: 30rpx; font-weight: 600; }
+
+/* 列表（滚动） */
+.list {
+  flex: 1;
+  padding: 0 30rpx;
+  -webkit-overflow-scrolling: touch;
+  overflow: auto;
+}
+.no-scrollbar::-webkit-scrollbar { display: none; }
+.no-scrollbar { scrollbar-width: none; }
+
+/* 宫格布局 */
+.grid {
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  gap: 20rpx;
+  padding-bottom: 30rpx;
+}
+.grid-item {
+  width: 335rpx;
+  background: #fff;
+  border-radius: 16rpx;
+  overflow: hidden;
+  box-shadow: 0 4rpx 16rpx rgba(0,0,0,0.05);
+  display: flex;
+  flex-direction: column;
+}
+.grid-cover {
+  width: 100%; height: 200rpx;
+  object-fit: cover;
+}
+.grid-info {
+  padding: 14rpx;
+  display: flex;
+  flex-direction: column;
+  gap: 6rpx;
+}
+.grid-title {
+  font-size: 26rpx;
+  color: #111;
+  line-height: 36rpx;
+  min-height: 72rpx;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+.grid-meta {
+  display: flex; justify-content: space-between; align-items: center;
+}
+.grid-price {
+  font-size: 26rpx;
+  font-weight: 600;
+  color: #ff6a00;
+}
+.grid-people {
+  font-size: 22rpx;
+  color: #9aa0a6;
+}
+
+/* 空状态 */
+.empty {
+  padding: 80rpx 0 60rpx;
+  display: flex; flex-direction: column; align-items: center; gap: 18rpx;
+  color: #9aa0a6;
+}
+.empty-icon { width: 220rpx; height: 220rpx; opacity: 0.7; }
+.empty-text { font-size: 24rpx; }

pages/course/orderDetail/orderDetail.js

@@ -2,27 +2,165 @@ import { baseUrl, globalImgUrl } from "../../../request";
 
 Page({
   data: {
-    countdown: '',
+    countdown: "",
     orderId: 0,
-    orderObj: {},  // 订单详情对象
-    _secondsRemaining: 0,   // 内部倒计时秒数
-    _hasShownTimeout: false, // 是否已弹过“超时未支付”弹窗
+    orderObj: {},            // 订单详情对象
+    _secondsRemaining: 0,    // 内部倒计时秒数
+    _hasShownTimeout: false, // 是否已弹过“超时未支付”弹窗（本次页面停留期内）
     globalImgUrl,
-    isMaskVisible: false
+    isMaskVisible: false,
+    _isActive: false         // 页面是否处于可见状态
   },
 
+  // —— 非 data 状态，避免无谓 setData
+  _timer: null,
+
   onLoad(options) {
-    console.log('options---->',options);
-    this.setData({ orderId: options.id });
+    this.setData({ orderId: options.id || 0 });
     this.getOrderDetail();
   },
+
+  onShow() {
+    this.setData({ _isActive: true });
+  },
+
+  onHide() {
+    this.setData({ _isActive: false });
+    this._clearTimer();
+  },
+
+  onUnload() {
+    this.setData({ _isActive: false });
+    this._clearTimer();
+  },
+
+  onPullDownRefresh() {
+    this.getOrderDetail(); // stopPullDownRefresh 放到 complete 里，更稳
+  },
+
+  // ====== 工具函数 ======
+  _clearTimer() {
+    if (this._timer) {
+      clearInterval(this._timer);
+      this._timer = null;
+    }
+  },
+  _pad2(n) {
+    return String(n).padStart(2, "0");
+  },
+  _format(sec) {
+    const m = Math.floor(sec / 60);
+    const s = sec % 60;
+    return `${this._pad2(m)}分${this._pad2(s)}秒`;
+  },
+
+  // ====== 拉取订单详情并初始化倒计时 ======
+  getOrderDetail() {
+    wx.request({
+      url: baseUrl + "/courseOrder/query/detail",
+      method: "POST",
+      data: { id: this.data.orderId },
+      header: { Authorization: wx.getStorageSync("token") },
+      success: (res) => {
+        if (res.data.code !== 1) {
+          wx.showToast({ title: res.data.message || "获取失败", icon: "none" });
+          return;
+        }
+
+        const order = res.data.data || {};
+        this.setData({ orderObj: order });
+
+        // 只有“待支付”才需要倒计时；其它状态关掉计时器并清空文案
+        if (order.orderStatus === "待支付") {
+          this._initFromCreateTime(order.createTime);
+        } else {
+          this._clearTimer();
+          this.setData({ countdown: "" });
+        }
+      },
+      fail: () => wx.showToast({ title: "网络错误", icon: "none" }),
+      complete: () => wx.stopPullDownRefresh(),
+    });
+  },
+
+  // 计算剩余秒数并启动定时器
+  _initFromCreateTime(createTime) {
+    const ts = new Date(String(createTime).replace(/-/g, "/")).getTime();
+    const createMs = Number.isFinite(ts) ? ts : Date.now();
+    const ttlMs = 15 * 60 * 1000; // 15分钟有效
+    const now = Date.now();
+    let diff = Math.floor((createMs + ttlMs - now) / 1000);
+    diff = Math.max(0, diff);
+
+    // 初始化阶段：如果已过期，静默转“交易关闭”（不弹窗，避免干扰）
+    if (diff === 0) {
+      const o = { ...this.data.orderObj, orderStatus: "交易关闭" };
+      this._clearTimer();
+      this.setData({ orderObj: o, countdown: "" });
+      return;
+    }
+
+    // 未过期：初始化倒计时并启动
+    this._clearTimer();
+    this.setData({
+      _secondsRemaining: diff,
+      countdown: this._format(diff),
+      _hasShownTimeout: false, // 重置本页弹窗标记
+    });
+    this._startTimer();
+  },
+
+  // 每秒递减
+  _startTimer() {
+    this._clearTimer();
+    this._timer = setInterval(() => {
+      const sec = this.data._secondsRemaining - 1;
+
+      if (sec <= 0) {
+        this._clearTimer();
+        this._handleTimeout(); // 到点且在当前页，才弹窗
+        return;
+      }
+
+      this.setData({
+        _secondsRemaining: sec,
+        countdown: this._format(sec),
+      });
+    }, 1000);
+  },
+
+  // 超时处理：仅在当前页可见时弹一次，并把状态改为“交易关闭”
+  _handleTimeout() {
+    const { _isActive, _hasShownTimeout } = this.data;
+
+    // 更新状态并隐藏倒计时
+    const o = { ...this.data.orderObj, orderStatus: "交易关闭" };
+    this.setData({ orderObj: o, countdown: "" });
+
+    // 只在当前页面 & 未弹过 时弹一次
+    if (_isActive && !_hasShownTimeout) {
+      wx.showModal({
+        title: "提示",
+        content: "订单超时未支付，已关闭",
+        showCancel: false,
+        complete: () => {
+          // 标记已弹
+          this.setData({ _hasShownTimeout: true });
+        },
+      });
+    } else {
+      this.setData({ _hasShownTimeout: true });
+    }
+  },
+
+  // ====== 支付相关 ======
   showIsPayModal() {
-    const {orderId} = this.data
+    const { orderId } = this.data;
     wx.showModal({
-      title: '下单成功',
-      content: '您确定要支付吗？',
-      cancelText: '取消',
-      confirmText: '确定',
+      title: "确认支付",
+      content: "是否立即支付该订单？",
+      cancelText: "取消",
+      confirmText: "去支付",
       success: (res) => {
         if (res.confirm) {
           this.payOrder(orderId);
@@ -32,163 +170,70 @@ Page({
       },
       fail: () => {
         wx.hideLoading();
-        wx.showToast({
-          title: '网络错误，下单失败',
-          icon: 'none'
-        });
-      }
+        wx.showToast({ title: "网络错误", icon: "none" });
+      },
     });
   },
+
   payOrder(orderId) {
-    // 同样先显示遮罩
- this.setData({ isMaskVisible: true });
-   wx.showLoading({ title: '支付中...'});
-   wx.request({
-     url: baseUrl + '/courseOrder/payment',
-     method: 'POST',
-     header: { Authorization: wx.getStorageSync('token') },
-     data: { id: orderId},
-     success: res => {
-       wx.hideLoading();
-       if (res.data.code === 1) {
-         // 支付成功，跳转详情页
-         wx.redirectTo({
-           url: `/pages/course/orderDetail/orderDetail?id=${orderId}`,
-           success: res => {
-               // 先把遮罩关掉
-               this.setData({ isMaskVisible: false });
-           }
-         });
-       } else {
-         this.setData({ isMaskVisible: false });
-         wx.showToast({ title: res.data.message || '支付失败', icon: 'none' });
-       }
-     },
-     fail: () => {
-       wx.hideLoading();
-       this.setData({ isMaskVisible: false });
-       wx.showToast({ title: '网络错误，支付失败', icon: 'none' });
-     }
-   });
- },
-  onUnload() {
-    clearInterval(this._timer);
-  },
+    this.setData({ isMaskVisible: true });
+    wx.showLoading({ title: "支付中..." });
 
-  // 拉取订单详情并初始化倒计时
-  getOrderDetail() {
     wx.request({
-      url: baseUrl + '/courseOrder/query/detail',
-      method: 'POST',
-      data: { id: this.data.orderId },
-      header: { Authorization: wx.getStorageSync('token') },
-      success: res => {
-        console.log('订单详情--->',res.data.data);
-        if (res.data.code !== 1) return wx.showToast({ title: res.data.message, icon: 'none' });
-        
-        const order = res.data.data;
-        this.setData({ orderObj: order });
-
-        // 仅“待支付”需要倒计时
-        if (order.orderStatus === '待支付') {
-          this._initFromCreateTime(order.createTime);
+      url: baseUrl + "/courseOrder/payment",
+      method: "POST",
+      header: { Authorization: wx.getStorageSync("token") },
+      data: { id: orderId }, // 若后端用 orderId，则把键名改为 orderId
+      success: (res) => {
+        wx.hideLoading();
+        if (res.data.code === 1) {
+          wx.redirectTo({
+            url: `/pages/course/orderDetail/orderDetail?id=${orderId}`,
+            complete: () => this.setData({ isMaskVisible: false }),
+          });
+        } else {
+          this.setData({ isMaskVisible: false });
+          wx.showToast({ title: res.data.message || "支付失败", icon: "none" });
         }
       },
-      fail: () => wx.showToast({ title: '网络错误', icon: 'none' })
+      fail: () => {
+        wx.hideLoading();
+        this.setData({ isMaskVisible: false });
+        wx.showToast({ title: "网络错误，支付失败", icon: "none" });
+      },
     });
   },
 
-  // 计算剩余秒数并启动定时器
-  _initFromCreateTime(createTime) {
-    // 将 "2025-07-13 12:38:17" → 时间戳
-    const createMs = new Date(createTime.replace(/-/g, '/')).getTime();
-    const now = Date.now();
-    let diff = Math.floor((createMs + 15 * 60 * 1000 - now) / 1000);
-
-    if (diff <= 0) {
-      // 已超时
-      this._handleTimeout();
-    } else {
-      // 未超时，初始化秒数并启动倒计时
-      this.setData({
-        _secondsRemaining: diff,
-        countdown: this._format(diff)
-      });
-      this._startTimer();
-    }
-  },
-
-  // 每秒递减
-  _startTimer() {
-    this._timer = setInterval(() => {
-      let sec = this.data._secondsRemaining - 1;
-      if (sec <= 0) {
-        clearInterval(this._timer);
-        this._handleTimeout();
-      } else {
-        this.setData({
-          _secondsRemaining: sec,
-          countdown: this._format(sec)
-        });
-      }
-    }, 1000);
-  },
-
-  // 超时处理：弹窗 + 改状态
-  _handleTimeout() {
-    if (!this.data._hasShownTimeout) {
-      wx.showModal({
-        title: '提示',
-        content: '订单超时未支付，已取消',
-        showCancel: false
-      });
-      this.setData({ _hasShownTimeout: true });
-    }
-    // 更新状态并隐藏倒计时
-    const o = this.data.orderObj;
-    o.orderStatus = '交易取消';
-    this.setData({
-      orderObj: o,
-      countdown: '00分00秒'
-    });
-  },
-
-  // 秒数 → "MM分SS秒"
-  _format(sec) {
-    const m = Math.floor(sec / 60);
-    const s = sec % 60;
-    const mm = m < 10 ? '0' + m : m;
-    const ss = s < 10 ? '0' + s : s;
-    return `${mm}分${ss}秒`;
-  },
-
-  // 取消订单
+  // ====== 取消、退款（示例） ======
   cancelOrder() {
     wx.showModal({
-      title: '取消订单',
-      content: '是否要取消订单？',
-      success: res => {
+      title: "取消订单",
+      content: "是否要取消订单？",
+      success: (res) => {
         if (res.confirm) {
           wx.request({
             url: baseUrl + "/courseOrder/cancel",
-            method: 'POST',
-            data: { courseId: this.data.orderId },
-            header: { Authorization: wx.getStorageSync('token') },
-            success: () => this.getOrderDetail()
+            method: "POST",
+            header: { Authorization: wx.getStorageSync("token") },
+            data: { id: this.data.orderId }, // 后端如果需要 { orderId }，改键名
+            success: (r) => {
+              if (!r.data || r.data.code !== 1) {
+                wx.showToast({ title: (r.data && r.data.message) || "取消失败", icon: "none" });
+              }
+              this.getOrderDetail();
+            },
+            fail: () => wx.showToast({ title: "网络错误", icon: "none" }),
           });
         }
-      }
+      },
     });
   },
 
-  // 去支付（示例跳转）
   goPay() {
-    // wx.navigateTo({ url: `/pages/pay/pay?orderId=${this.data.orderId}` });
-    wx.showToast({ title: '支付功能稍后开放', icon: 'none' });
+    wx.showToast({ title: "支付功能稍后开放", icon: "none" });
   },
 
-  // 退款（示例弹窗）
   refundOrder() {
-    wx.showToast({ title: '退款功能稍后开放', icon: 'none' });
-  }
+    wx.showToast({ title: "退款功能稍后开放", icon: "none" });
+  },
 });

pages/course/orderDetail/orderDetail.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "enablePullDownRefresh": true
 }

pages/course/orderDetail/orderDetail.wxml

@@ -1,88 +1,101 @@
-<view class="flex-col page">
-  <view class="flex-col group">
-    <view class="flex-col section">
-      <!-- 订单状态 + 倒计时 -->
-      <view class="flex-row justify-between self-stretch group_2">
-        <text class="font">订单状态</text>
-        <view class="flex-row group_3">
-          <text class="font_2 text" wx:if="{{ orderObj.orderStatus === '待支付' }}">请在{{countdown}}内完成支付</text>
-          <text class="font_2 text_2 ml-37">{{ orderObj.orderStatus }}</text>
+<!-- pages/order/orderDetail.wxml -->
+<view class="page">
+
+<!-- 中间内容滚动，底部按钮固定，所以这里预留底部内边距 -->
+<scroll-view scroll-y class="content no-scrollbar">
+
+  <!-- 订单状态 + 倒计时 + 课程信息 -->
+  <view class="card header-card">
+    <!-- 状态与倒计时 -->
+    <view class="status-line">
+      <view class="status-badge {{ orderObj.orderStatus === '待支付' ? 'status-pending' : (orderObj.orderStatus === '已支付' || orderObj.orderStatus === '交易成功' ? 'status-success' : 'status-default') }}">
+        <text class="status-text">{{ orderObj.orderStatus }}</text>
+      </view>
+      <view wx:if="{{ orderObj.orderStatus === '待支付' }}" class="countdown-pill">
+        <text class="countdown-text">请在 {{ countdown }} 内完成支付</text>
+      </view>
+    </view>
+
+    <!-- 课程信息 -->
+    <view class="course-line">
+      <image class="cover" src="{{ globalImgUrl + orderObj.image }}" mode="aspectFill" lazy-load="true" />
+      <view class="course-info">
+        <text class="course-title ellipsis-2">{{ orderObj.name }}</text>
+        <view class="price-line">
+          <text class="price-origin">￥{{ orderObj.originPrice }}</text>
+          <text class="price-amount">应付：￥{{ orderObj.totalAmount }}</text>
         </view>
       </view>
-      <!-- 课程信息 -->
-      <view class="flex-row self-stretch group_4 mt-15">
-        <image
-          class="shrink-0 image"
-          src="{{ globalImgUrl + orderObj.image }}"
-        />
-        <text class="flex-1 self-start font_3 text_3 ml-7">
-          {{ orderObj.name }}
-        </text>
-      </view>
-      <!-- 课程价格 -->
-      <text class="self-end font_3 text_4 mt-15">￥{{ orderObj.originPrice }}</text>
-    </view>
-
-    <!-- 订单详情 -->
-    <view class="mt-16 flex-col section_2">
-      <view class="self-start group_5">
-        <text class="font text_5">订单编号：</text>
-        <text class="font_4">{{ orderObj.orderNumber }}</text>
-      </view>
-      <view class="flex-row items-baseline self-start group_6">
-        <text class="shrink-0 font text_6">下单时间：</text>
-        <text class="flex-1 font_5 ml-3">{{ orderObj.createTime }}</text>
-      </view>
-      <view class="flex-col justify-start self-stretch relative group_7">
-        <view class="flex-col section_3">
-          <view class="self-stretch divider"></view>
-          <view class="flex-row self-stretch group_8 mt-17">
-            <text class="font text_7">支付方式：</text>
-            <text class="ml-8 font text_8">微信支付</text>
-          </view>
-          <view class="flex-row items-center self-stretch mt-17">
-            <text class="font text_9">交易号：</text>
-            <!-- TODO -->
-            <text class="font_4 ml-23">4002506191307440406460485418</text>
-          </view>
-          <text class="self-start font text_10 mt-17" wx:if="{{ orderObj.orderStatus === '交易成功' }}">交付时间：</text>
-        </view>
-        <text class="font_5 text_11 pos" wx:if="{{ orderObj.orderStatus === '交易成功' }}">{{ orderObj.updateTime }}</text>
-      </view>
-    </view>
-
-    <!-- 价格明细 -->
-    <view class="mt-16 flex-col section_4">
-      <view class="flex-row justify-between items-center">
-        <text class="font text_12">课程价格</text>
-        <text class="font_4">￥{{ orderObj.originPrice }}</text>
-      </view>
-      <view class="flex-row justify-between items-center mt-11">
-        <text class="font text_13">价格折扣</text>
-        <text class="font_4 text_14">-￥{{ orderObj.originPrice - orderObj.totalAmount }}</text>
-      </view>
-      <view class="flex-row justify-between items-center group_9 mt-11">
-        <text class="font_2 text_15">订单金额</text>
-        <text class="font_4 text_16">￥{{ orderObj.totalAmount }}</text>
-      </view>
     </view>
   </view>
 
-  <!-- 底部按钮：待支付 -->
-  <view class="flex-row bottom-buttons" wx:if="{{ orderObj.orderStatus === '待支付' }}">
-    <view class="flex-col justify-start items-center text-wrapper" bindtap="cancelOrder">
-      <text class="font_3 text_17">取消</text>
+  <!-- 订单详情 -->
+  <view class="card">
+    <view class="kv">
+      <text class="kv-key">订单编号</text>
+      <text class="kv-val selectable">{{ orderObj.orderNumber }}</text>
     </view>
-    <view class="flex-col justify-start items-center text-wrapper_2" bindtap="showIsPayModal">
-      <text class="font_3 text_18">立即支付</text>
+
+    <view class="kv">
+      <text class="kv-key">下单时间</text>
+      <text class="kv-val">{{ orderObj.createTime }}</text>
+    </view>
+
+    <view class="divider"></view>
+
+    <view class="kv">
+      <text class="kv-key">支付方式</text>
+      <text class="kv-val">微信支付</text>
+    </view>
+
+    <view class="kv">
+      <text class="kv-key">交易号</text>
+      <!-- 这里可替换为真实字段 -->
+      <text class="kv-val selectable">4002506191307440406460485418</text>
+    </view>
+
+    <view wx:if="{{ orderObj.orderStatus === '交易成功' }}" class="kv">
+      <text class="kv-key">交付时间</text>
+      <text class="kv-val">{{ orderObj.updateTime }}</text>
     </view>
   </view>
 
-  <!-- 底部按钮：已支付 -->
-  <view class="flex-row bottom-buttons" wx:if="{{ orderObj.orderStatus === '已支付' }}">
-    <view class="flex-col justify-start items-center text-wrapper_2" bindtap="refundOrder">
-      <text class="font_3 text_18">退款</text>
+  <!-- 价格明细 -->
+  <view class="card">
+    <view class="kv">
+      <text class="kv-key">课程价格</text>
+      <text class="kv-val">￥{{ orderObj.originPrice }}</text>
+    </view>
+
+    <view class="kv">
+      <text class="kv-key">价格折扣</text>
+      <text class="kv-val discount">-￥{{ (orderObj.originPrice - orderObj.totalAmount) >= 0 ? (orderObj.originPrice - orderObj.totalAmount) : 0 }}
+      </text>
+    </view>
+
+    <view class="kv total">
+      <text class="kv-key total-key">订单金额</text>
+      <text class="kv-val total-val">￥{{ orderObj.totalAmount }}</text>
     </view>
   </view>
-  <view wx:if="{{isMaskVisible}}" class="page-mask"></view>
+
+</scroll-view>
+
+<!-- 底部按钮：待支付 -->
+<view class="footer" wx:if="{{ orderObj.orderStatus === '待支付' }}">
+  <view class="footer-inner two-btns">
+    <view class="btn btn-ghost" bindtap="cancelOrder">取消</view>
+    <view class="btn btn-primary" bindtap="showIsPayModal">立即支付</view>
+  </view>
+</view>
+
+<!-- 底部按钮：已支付 -->
+<view class="footer" wx:if="{{ orderObj.orderStatus === '已支付' }}">
+  <view class="footer-inner one-btn">
+    <view class="btn btn-primary" bindtap="refundOrder">退款</view>
+  </view>
+</view>
+
+<!-- 遮罩 -->
+<view wx:if="{{ isMaskVisible }}" class="page-mask"></view>
 </view>

pages/course/orderDetail/orderDetail.wxss

@@ -1,224 +1,255 @@
-.ml-37 {
-  margin-left: 69.38rpx;
+/* ===== 页面框架 ===== */
+.page {
+  background: #f7f7f7;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
 }
-.ml-7 {
-  margin-left: 13.13rpx;
+
+.content {
+  flex: 1;
+  padding: 24rpx 24rpx 200rpx; /* 为底部固定按钮预留空间 */
+  box-sizing: border-box;
 }
-.mt-15 {
-  margin-top: 28.13rpx;
+
+.no-scrollbar::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  display: none;
 }
-.ml-3 {
-  margin-left: 5.63rpx;
-}
-.ml-23 {
-  margin-left: 40.13rpx;
-}
-.mt-17 {
-  margin-top: 31.88rpx;
-}
-.mt-11 {
-  margin-top: 20.63rpx;
-}
-.mt-389 {
-  margin-top: 729.38rpx;
-}
-/* app.wxss 或 当前页面 .wxss */
+
+/* 遮罩 */
 .page-mask {
   position: fixed;
-  top: 0; left: 0;
-  width: 100%; height: 100%;
-  background-color: rgba(0, 0, 0, 0.3);
+  inset: 0;
+  background-color: rgba(0, 0, 0, 0.35);
   z-index: 9999;
 }
-/* 整体布局 */
-.page {
-  padding-top: 26.25rpx;
-  background-color: #f8f8f8;
-  width: 100%;
-  height: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
-}
-.group {
-  padding: 0 18.75rpx;
+
+/* ===== 卡片通用 ===== */
+.card {
+  background: #ffffff;
+  border-radius: 16rpx;
+  padding: 24rpx;
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.05);
 }
 
-/* 调整首屏 section 右边内边距，不让价格太贴边 */
-.section {
-  padding: 0 22.5rpx 33.75rpx 22.5rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 7.22rpx;
+.card + .card {
+  margin-top: 20rpx;
 }
 
-/* 订单详情区 */
-.group_2 {
-  padding: 33.75rpx 0 26.25rpx;
-  border-bottom: solid 1.88rpx #e3e3e3;
-}
-.group_3 {
-  margin-right: 18.75rpx;
-}
-.font_2 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.23rpx;
-  color: #f84947;
-}
-.text {
-  line-height: 24.56rpx;
-}
-.text_2 {
-  line-height: 24.17rpx;
-}
-.group_4 {
-  margin-right: 33.75rpx;
-}
-.image {
-  border-radius: 9.38rpx;
-  width: 208.13rpx;
-  height: 133.13rpx;
-}
-.font_3 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.64rpx;
-}
-.text_3 {
-  color: #000000;
-  line-height: 35.63rpx;
-}
-.text_4 {
-  color: #3d3d3d;
-  line-height: 22.76rpx;
-}
-
-/* 订单详情二级区 */
-.section_2 {
-  padding: 33.75rpx 22.5rpx 0;
-  background-color: #ffffff;
-  border-radius: 7.39rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-}
-.group_5 {
-  line-height: 24.28rpx;
-}
-.font_4 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 19.93rpx;
-  color: #323232;
-}
-.group_6 {
-  margin-top: 30rpx;
-  width: 369.94rpx;
-}
-.font_5 {
-  font-size: 26.25rpx;
-  line-height: 31.88rpx;
-  color: #323232;
-}
-.group_7 {
-  margin-top: 11.25rpx;
-  padding-bottom: 26.25rpx;
-}
-.section_3 {
-  padding-top: 9.38rpx;
-  background-color: #ffffff;
-}
-.divider {
-  background-color: #cccccc;
-  height: 1.88rpx;
-}
-.group_8 {
-  padding: 0 3.75rpx;
-}
-.font {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.23rpx;
-  color: #696969;
-}
-.text_7 {
-  line-height: 24.36rpx;
-}
-.text_6 {
-  line-height: 31.88rpx;
-}
-.text_5 {
-  line-height: 24.28rpx;
-}
-.text_8 {
-  color: #323232;
-}
-.text_9 {
-  line-height: 24.52rpx;
-}
-.text_10 {
-  line-height: 24.43rpx;
-}
-.text_11 {
-  width: 270rpx;
-}
-.pos {
-  position: absolute;
-  left: 141.05rpx;
-  top: 142.92rpx;
-}
-
-/* 调整价格明细区右边内边距 */
-.section_4 {
-  padding: 22.5rpx 22.5rpx 0 22.5rpx;
-  background-color: #ffffff;
-  border-radius: 4.01rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-}
-.text_12 {
-  line-height: 24.41rpx;
-}
-.text_13 {
-  line-height: 24.41rpx;
-}
-.text_14 {
-  /* margin-right: 15rpx; */
-}
-.group_9 {
-  padding: 22.5rpx 0 18.75rpx;
-  border-top: solid 1.88rpx #e3e3e3;
-}
-.text_15 {
-  line-height: 24.49rpx;
-}
-.text_16 {
-  color: #f84947;
-}
-
-/* 底部按钮 */
-.text-wrapper {
-  padding: 37.5rpx 0;
-  flex: 1 1 375rpx;
-  background-color: #ffffff;
-  height: 105rpx;
-}
-.text-wrapper_2 {
-  padding: 37.5rpx 0;
-  flex: 1 1 375rpx;
-  background-color: #ff8d1a;
-  height: 105rpx;
-}
-.text_17 {
-  color: #323232;
-}
-.text_18 {
-  color: #ffffff;
-  line-height: 27.81rpx;
-}
-.bottom-buttons {
-  position: fixed;
-  bottom: 0;
-  left: 0;
-  width: 100%;
+/* ===== 顶部卡片：状态 + 倒计时 + 课程 ===== */
+.header-card .status-line {
   display: flex;
+  align-items: center;
   justify-content: space-between;
-  background-color: #ffffff; /* 可以根据需要设置背景色 */
+  gap: 16rpx;
+  margin-bottom: 16rpx;
 }
+
+.status-badge {
+  height: 48rpx;
+  padding: 0 20rpx;
+  border-radius: 999rpx;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.status-text {
+  font-size: 26rpx;
+  font-weight: 600;
+}
+
+.status-pending {
+  background: #fff6e6;
+  color: #ff8d1a;
+}
+
+.status-success {
+  background: #e9fbef;
+  color: #12b05b;
+}
+
+.status-default {
+  background: #f0f0f0;
+  color: #666666;
+}
+
+.countdown-pill {
+  background: #fff4f2;
+  border: 1rpx solid #ffd6cc;
+  padding: 0 18rpx;
+  height: 48rpx;
+  border-radius: 999rpx;
+  display: inline-flex;
+  align-items: center;
+}
+
+.countdown-text {
+  font-size: 24rpx;
+  color: #ff5a1a;
+}
+
+/* 课程行 */
+.course-line {
+  display: flex;
+  gap: 20rpx;
+  align-items: stretch;
+}
+
+.cover {
+  width: 240rpx;
+  height: 160rpx;
+  border-radius: 12rpx;
+  background: #f2f2f2;
+  flex-shrink: 0;
+}
+
+.course-info {
+  flex: 1;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+
+.course-title {
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #1f1f1f;
+  line-height: 44rpx;
+}
+
+.ellipsis-2 {
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+
+.price-line {
+  display: flex;
+  align-items: baseline;
+  gap: 16rpx;
+  margin-top: 8rpx;
+}
+
+.price-origin {
+  font-size: 28rpx;
+  color: #9f9f9f;
+  text-decoration: line-through;
+}
+
+.price-amount {
+  font-size: 30rpx;
+  color: #ff5a1a;
+  font-weight: 700;
+}
+
+/* ===== 键值对（订单详情 / 价格明细） ===== */
+.kv {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12rpx 0;
+}
+
+.kv + .kv {
+  border-top: 1rpx dashed #f0f0f0;
+}
+
+.kv-key {
+  font-size: 28rpx;
+  color: #666666;
+}
+
+.kv-val {
+  font-size: 28rpx;
+  color: #1f1f1f;
+  max-width: 70%;
+  text-align: right;
+  word-break: break-all;
+}
+
+.selectable {
+  user-select: text;
+}
+
+.divider {
+  height: 1rpx;
+  background: #f2f2f2;
+  margin: 8rpx 0 12rpx;
+}
+
+.discount {
+  color: #12b05b;
+  font-weight: 600;
+}
+
+.total {
+  border-top: 1rpx solid #f2f2f2;
+  margin-top: 8rpx;
+  padding-top: 16rpx;
+}
+
+.total-key {
+  font-size: 30rpx;
+  color: #333333;
+  font-weight: 600;
+}
+
+.total-val {
+  font-size: 34rpx;
+  color: #ff5a1a;
+  font-weight: 700;
+}
+
+/* ===== 底部操作栏 ===== */
+.footer {
+  position: fixed;
+  left: 0; right: 0; bottom: 0;
+  background: #ffffff;
+  box-shadow: 0 -6rpx 20rpx rgba(0,0,0,0.06);
+  padding-bottom: env(safe-area-inset-bottom);
+  padding-bottom: constant(safe-area-inset-bottom);
+}
+
+.footer-inner {
+  height: 120rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 24rpx;
+  padding: 0 24rpx;
+  box-sizing: border-box;
+}
+
+.footer-inner.two-btns { justify-content: space-between; }
+.footer-inner.one-btn  { justify-content: flex-end; }
+
+.btn {
+  height: 88rpx;
+  min-width: 260rpx;
+  border-radius: 999rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 30rpx;
+  font-weight: 600;
+}
+
+.btn-ghost {
+  background: #ffffff;
+  color: #333333;
+  border: 2rpx solid #e6e6e6;
+}
+
+.btn-primary {
+  background: linear-gradient(180deg, #ffa64a 0%, #ff8d1a 100%);
+  color: #ffffff;
+  box-shadow: 0 6rpx 14rpx rgba(255, 141, 26, 0.35);
+}
+
+/* ===== 迁移提示：以下旧的散装类建议删除（如无外部依赖） ===== */
+/* .ml-37, .ml-7, .mt-15, .ml-3, .ml-23, .mt-17, .mt-11, .mt-389 等 */

pages/course/searchCourses/searchCourses.wxml

@@ -1,26 +1,42 @@
-<!--pages/course/searchCourses/searchCourses.wxml-->
-<view class="flex-col page">
-  <view class="flex-row items-center section">
-    <image
-      class="image"
-      src="./images/sousuo.png"
-    />
-    <input class="text ml-3" placeholder="搜索更多好课" bindinput="onSearchInput" confirm-type="search" bindconfirm="onSearch"/>
-  </view>
-  <view class="flex-col list mt-17">
-    <view bind:tap="gotoCourseDetail" data-id="{{item.id}}" class="flex-row relative list-item" wx:for="{{courseList}}" wx:for-item="item" wx:for-index="index" wx:key="index">
-      <view class="list-divider pos_3"></view>
-      <image
-        class="image_2 pos"
-        src="{{globalImgUrl + item.image}}"
-      />
-      <view class="flex-col group_2 pos_2">
-        <text class="font">{{item.name}}</text>
-        <view class="flex-row justify-between items-baseline mt-17">
-          <text class="font_2">券后{{item.discountPrice}}元起</text>
-          <text class="font_3">{{item.orderCount}}人学习</text>
+<!-- pages/course/searchCourses/searchCourses.wxml -->
+<view class="page">
+
+<!-- 顶部搜索条（固定） -->
+<view class="search-bar" hover-class="hover">
+  <image class="search-icon" src="./images/sousuo.png" mode="aspectFit"/>
+  <input
+    class="search-input"
+    placeholder="搜索更多好课"
+    placeholder-class="search-ph"
+    bindinput="onSearchInput"
+    confirm-type="search"
+    bindconfirm="onSearch"
+  />
+</view>
+
+<!-- 搜索结果（独立滚动，隐藏滚动条） -->
+<scroll-view scroll-y class="list no-scrollbar">
+  <block wx:for="{{courseList}}" wx:key="item.id" wx:for-item="item">
+    <view class="course-card" bindtap="gotoCourseDetail" data-id="{{item.id}}" hover-class="hover">
+      <!-- 封面 -->
+      <image class="cover" src="{{globalImgUrl + item.image}}" mode="aspectFill" lazy-load="true"/>
+
+      <!-- 文案 -->
+      <view class="info">
+        <text class="title">{{item.name}}</text>
+        <view class="meta">
+          <text class="price-pill">券后{{item.discountPrice}}元起</text>
+          <text class="people">{{item.orderCount}}人学习</text>
         </view>
       </view>
     </view>
+  </block>
+
+  <!-- 空状态（可选） -->
+  <view wx:if="{{!courseList || courseList.length === 0}}" class="empty">
+    <image class="empty-icon" src="/static/empty.png" mode="aspectFit"/>
+    <text class="empty-text">没找到相关课程，换个关键词试试～</text>
   </view>
-</view>
+</scroll-view>
+
+</view>

pages/course/searchCourses/searchCourses.wxss

@@ -1,93 +1,138 @@
 /* pages/course/searchCourses/searchCourses.wxss */
 
-.ml-3 {
-  margin-left: 5.63rpx;
-}
-.mt-17 {
-  margin-top: 31.88rpx;
-}
+/* ===== 页面骨架：整页固定，仅列表滚动 ===== */
 .page {
-  padding: 26.25rpx 0 918.73rpx;
-  background-color: #ffffff;
-  width: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
-  height: 100%;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #ffffff;
+  overflow: hidden;               /* 禁止整页滚动 */
+  box-sizing: border-box;
+  font-family: SourceHanSansCN, PingFang SC, Microsoft YaHei, system-ui, -apple-system, sans-serif;
 }
-.section {
-  margin-left: 28.13rpx;
-  margin-right: 26.27rpx;
-  padding: 11.25rpx 24.38rpx;
-  background-color: #f2f2f2;
-  border-radius: 93.75rpx;
+
+/* 触摸反馈 */
+.hover { opacity: .86; transition: opacity .18s ease; }
+
+/* ===== 顶部搜索条（固定） ===== */
+.search-bar {
+  padding: 24rpx 28rpx;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+  background: #fff;
 }
-.image {
-  width: 35.63rpx;
-  height: 35.63rpx;
-}
-input {
-  height: 50rpx;
-  width: 95%;
-}
-.text {
-  color: #333333;
-  font-size: 26.5rpx;
-  font-family: SourceHanSerifCN;
-  line-height: 20.83rpx;
+.search-icon { width: 36rpx; height: 36rpx; opacity: .9; }
+
+/* 胶囊输入框 */
+.search-input {
+  flex: 1;
+  height: 72rpx;
+  padding: 0 26rpx;
+  border-radius: 9999rpx;
+  background: #f5f6f7;
+  font-size: 26rpx;
+  color: #111;
+  line-height: 72rpx;
+  box-shadow: inset 0 0 0 1rpx rgba(0,0,0,.04);
 }
+.search-ph { color: #a8a8a8; font-size: 26rpx; }
+
+/* ===== 列表：占满剩余高度，独立滚动，隐藏滚动条 ===== */
 .list {
-  padding-top: 11.25rpx;
-  border-top: solid 1.88rpx #d1d1d1;
+  flex: 1;
+  padding: 0 24rpx 28rpx;
+  box-sizing: border-box;
+  -webkit-overflow-scrolling: touch;
+  background: #fff;
 }
-.list-item {
-  padding: 28.13rpx 29.46rpx 0 35.63rpx;
-  height: 189.39rpx;
+.no-scrollbar::-webkit-scrollbar { display: none; width: 0; height: 0; background: transparent; }
+.no-scrollbar { scrollbar-width: none; }
+
+/* ===== 课程卡片（左图右文，更工整） ===== */
+.course-card {
+  display: flex;
+  gap: 22rpx;
+  padding: 20rpx;
+  margin-top: 20rpx;
+  background: #ffffff;
+  border-radius: 20rpx;
+  border: 1rpx solid #f1f1f1;
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,.05);
 }
-.list-divider {
-  background-color: #d6d6d6;
-  height: 1.88rpx;
+
+/* 封面：3:2 比例，圆角 */
+.cover {
+  width: 280rpx;
+  height: 186rpx;
+  flex: 0 0 280rpx;
+  border-radius: 14rpx;
+  object-fit: cover;
 }
-.pos_3 {
-  position: absolute;
-  left: 35.63rpx;
-  right: 33.81rpx;
-  top: 187.52rpx;
+
+/* 信息区 */
+.info {
+  flex: 1;
+  min-width: 0;                   /* 防文字溢出 */
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
 }
-.image_2 {
-  border-radius: 9.38rpx;
-  width: 208.13rpx;
-  height: 133.13rpx;
+
+/* 标题：两行省略 */
+.title {
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #111;
+  font-weight: 600;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;          /* 两行省略 */
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  word-break: break-word;
 }
-.pos {
-  position: absolute;
-  left: 35.63rpx;
-  top: 50%;
-  transform: translateY(-50%);
+
+/* 元信息：价格胶囊 + 学习人数 */
+.meta {
+  margin-top: 12rpx;
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
 }
-.group_2 {
-  width: 453.49rpx;
+.price-pill {
+  padding: 6rpx 14rpx;
+  font-size: 24rpx;
+  color: #fff;
+  border-radius: 9999rpx;
+  background: linear-gradient(90deg, #ff6a00, #ff8a2a);
+  box-shadow: 0 6rpx 16rpx rgba(255,106,0,.22);
+  white-space: nowrap;
 }
-.pos_2 {
-  position: absolute;
-  right: 29.46rpx;
-  top: 50%;
-  transform: translateY(-50%);
+.people {
+  font-size: 22rpx;
+  color: #9aa0a6;
+  white-space: nowrap;
 }
-.font {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 31.88rpx;
-  color: #000000;
+
+/* ===== 空状态 ===== */
+.empty {
+  padding: 120rpx 0 80rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 18rpx;
+  color: #9aa0a6;
 }
-.font_2 {
-  font-size: 26.25rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 24.15rpx;
-  color: #ff5733;
-}
-.font_3 {
-  font-size: 22.5rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 20.34rpx;
-  color: #a6a6a6;
+.empty-icon { width: 240rpx; height: 240rpx; opacity: .7; }
+.empty-text { font-size: 24rpx; line-height: 34rpx; }
+
+/* ===== 如你项目里已有的工具类，可保留或删除 ===== */
+.ml-3 { margin-left: 6rpx; }
+.mt-17 { margin-top: 12rpx; }
+
+::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  background: transparent;
 }

pages/dashboardModule/overviewPerformance/overviewPerformance.js

@@ -1,4 +1,5 @@
 import { baseUrl } from "../../../request";
+const { notLogin } = require('../../../utils/util')
 
 // pages/dashboardModule/overviewPerformance/overviewPerformance.js
 Page({
@@ -56,6 +57,11 @@ Page({
     else if (trueCount === 1) this.setData({widthRate: '100%'})
   },
 
+  onPullDownRefresh() {
+    this.fetchPerformance()
+    wx.stopPullDownRefresh();
+  },
+
   fetchPerformance() {
     wx.request({
       url: baseUrl + '/perform/mini/query/dashboard', 
@@ -68,10 +74,7 @@ Page({
           // 直接把后端 data 对象铺平到页面 data
           this.setData(res.data.data);
         } else {
-          wx.showToast({
-            title: res.data.message || '获取数据失败',
-            icon: 'none'
-          });
+          notLogin(res.data.message)
         }
       },
       fail: () => {

pages/dashboardModule/overviewPerformance/overviewPerformance.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "enablePullDownRefresh": true
 }

pages/dashboardModule/performanceRanking/performanceRanking.js

@@ -1,18 +1,22 @@
 import { baseUrl } from "../../../request";
+const { notLogin } = require('../../../utils/util')
 
 Page({
   data: {
     // 用于存储输入框数据
     nickName: '',
     phoneNumber: '',
-    selectedSortField: '员工数量', // 默认选择"待选择"
-    selectedSortOrder: '升序', // 默认选择升序
+    selectedSortField: '员工数量', // 默认选择"员工数量"
+    selectedSortOrder: '降序', // 默认选择升序
     sortFieldsByManager: ['员工数量', '推广人数', '下单数量', '总订单金额', '净成交金额'],
     sortFieldsBySupervisor: ['推广人数', '下单数量', '总订单金额', '净成交金额'],
+    sortField: 'empCount',
+    sortOrder: 'descend',
     sortOrders: ['升序', '降序'],
     items: [], // 用于存储查询结果
     role: '', // 假设初始为主管角色，可以根据实际情况动态设置
-    k: 1
+    k: 1,
+    showRole: ''
   },
 
   // 主管名称输入
@@ -31,7 +35,6 @@ Page({
 
   // 选择排序字段
   onSortFieldChange(e) {
-    const { role } = this.data;
     const sortFieldsMap = {
       '员工数量': 'empCount',
       '推广人数': 'promoCount',
@@ -39,12 +42,13 @@ Page({
       '总订单金额': 'totalAmount',
       '净成交金额': 'netAmount'
     };
-    
-    const selectedField = this.data.sortFieldsByManager[e.detail.value] || this.data.sortFieldsBySupervisor[e.detail.value];
+    const { showRole, sortFieldsByManager, sortFieldsBySupervisor } = this.data
+    let selectedField = showRole === '主管' ? sortFieldsByManager[e.detail.value] : sortFieldsBySupervisor[e.detail.value];
     this.setData({
       selectedSortField: selectedField,
       sortField: sortFieldsMap[selectedField], // 默认是 id
     });
+    this.onSearch()
   },
 
   // 选择排序顺序
@@ -54,11 +58,12 @@ Page({
       selectedSortOrder: selectedOrder === 'ascend' ? '升序' : '降序',
       sortOrder: selectedOrder,
     });
+    this.onSearch()
   },
 
   // 搜索按钮点击
   onSearch() {
-  const { role } = this.data;
+  const { showRole, role } = this.data;
 //     // —— 新增：校验主管名称 —— 
 // const nameRegex = /^[\u4e00-\u9fa5]+$/;
 // if (!this.data.nickName) {
@@ -95,12 +100,17 @@ Page({
       mask: true // 显示遮罩层
     });
 
+    if (showRole === '员工') {
+      this.setData({ sortField: 'promoCount' })
+    }
+
     const requestData = {
       nickName: this.data.nickName,
       phoneNumber: this.data.phoneNumber,
       sortField: this.data.sortField || '',
       sortOrder: this.data.sortOrder || 'ascend'
     };
+    console.log('requestData====>', requestData)
 
     if(role === 'manager') {
       wx.request({
@@ -120,16 +130,12 @@ Page({
               items: res.data.data
             });
           } else {
-            wx.showToast({
-              title: '没有数据',
-              icon: 'none'
-            });
+            notLogin(res.data.message)
           }
         },
         fail: () => {
           // 请求失败后，隐藏loading
           wx.hideLoading();
-          console.log('111');
           wx.showToast({
             title: '请求失败',
             icon: 'none'
@@ -193,5 +199,11 @@ Page({
     }
     this.setData({ showRole });
     this.onSearch()
-  }
+  },
+
+  onPullDownRefresh() {
+    this.onSearch()
+    wx.stopPullDownRefresh();
+  },
+
 });

pages/dashboardModule/performanceRanking/performanceRanking.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "enablePullDownRefresh": true
 }

pages/dashboardModule/performanceRanking/performanceRanking.wxml

@@ -1,97 +1,127 @@
-<view class="flex-col page">
+<!-- pages/dashboardModule/ranking/ranking.wxml（按你的实际路径命名） -->
+<view class="page">
   <!-- 页面标题 -->
-  <text class="self-center text">{{ showRole }}绩效排名</text>
-  
-  <!-- 表单区域 -->
-  <view class="flex-col self-stretch mt-27">
-    <view class="flex-col section">
-      
-      <!-- 主管名称 -->
-      <text class="self-start font text_2">{{ showRole }}名称</text>
-      <view class="flex-col justify-start items-start self-start text-wrapper">
-        <input class="text_3 font text_4" placeholder="请输入{{ showRole }}名称" bindinput="onNameInput"/>
-      </view>
-      
-      <!-- 手机号 -->
-      <text class="self-start font text_5">手机号</text>
-      <view class="flex-col justify-start items-start self-start text-wrapper_1">
-        <input class="text_3 font text_6" placeholder="请输入手机号" bindinput="onPhoneInput"
-        maxLength="11" type="number"/>
-      </view>
-      
-      <!-- 排序条件选择 -->
-      <text class="self-start font text_7">排序条件</text>
-      <view class="flex-row equal-division">
-        <view class="flex-row justify-between section_2 section_1">
-          <picker wx:if="{{ role === 'manager' }}" mode="selector" range="{{sortFieldsByManager}}" bindchange="onSortFieldChange">
-            <view class="flex-row justify-between section_2">
-              <text class="font text_1">{{selectedSortField}}</text>
-              <image class="image" src="./images/bottom.png"/>
-            </view>
-          </picker>
-          <picker mode="selector" wx:if="{{ role === 'supervisor' || role === 'staff'}}" range="{{sortFieldsBySupervisor}}" bindchange="onSortFieldChange">
-            <view class="flex-row justify-between section_2">
-              <text class="font text_1">{{selectedSortField}}</text>
-              <image class="image" src="./images/bottom.png"/>
-            </view>
-          </picker>
+  <view class="page-title">
+    <text class="title">{{ showRole }}绩效排名</text>
+  </view>
+
+  <scroll-view scroll-y class="content no-scrollbar">
+    <!-- 表单卡片 -->
+    <view class="card form-card">
+      <!-- 名称 -->
+      <view class="field">
+        <text class="field-label">{{ showRole }}名称</text>
+        <view class="input-box">
+          <input
+            class="input"
+            placeholder="请输入{{ showRole }}名称"
+            bindinput="onNameInput"
+          />
         </view>
-        
-        <!-- 排序顺序 -->
-        <view class="flex-row justify-between section_2 section_3 ml-16">
-          <picker mode="selector" range="{{sortOrders}}" bindchange="onSortOrderChange">
-            <view class="flex-row justify-between section_2">
-              <text class="font text_16">{{selectedSortOrder}}</text>
-              <image class="image" src="./images/bottom.png"/>
-            </view>
-          </picker>
+      </view>
+
+      <!-- 手机号 -->
+      <view class="field">
+        <text class="field-label">手机号</text>
+        <view class="input-box">
+          <input
+            class="input"
+            placeholder="请输入手机号"
+            bindinput="onPhoneInput"
+            maxlength="11"
+            type="number"
+          />
+        </view>
+      </view>
+
+      <!-- 排序条件 -->
+      <view class="field">
+        <text class="field-label">排序条件</text>
+        <view class="picker-row">
+          <!-- 排序字段 -->
+          <view class="picker-box">
+            <picker wx:if="{{ role === 'manager' }}"
+                    mode="selector"
+                    range="{{ sortFieldsByManager }}"
+                    bindchange="onSortFieldChange">
+              <view class="picker-inner">
+                <text class="picker-text">{{ selectedSortField }}</text>
+                <image class="arrow" src="./images/bottom.png"/>
+              </view>
+            </picker>
+
+            <picker wx:if="{{ role === 'supervisor' || role === 'staff' }}"
+                    mode="selector"
+                    range="{{ sortFieldsBySupervisor }}"
+                    bindchange="onSortFieldChange">
+              <view class="picker-inner">
+                <text class="picker-text">{{ selectedSortField }}</text>
+                <image class="arrow" src="./images/bottom.png" />
+              </view>
+            </picker>
+          </view>
+
+          <!-- 排序顺序 -->
+          <view class="picker-box">
+            <picker mode="selector"
+                    range="{{ sortOrders }}"
+                    bindchange="onSortOrderChange">
+              <view class="picker-inner">
+                <text class="picker-text">{{ selectedSortOrder }}</text>
+                <image class="arrow" src="./images/bottom.png" />
+              </view>
+            </picker>
+          </view>
         </view>
       </view>
 
       <!-- 搜索按钮 -->
-      <view class="flex-col justify-start items-center self-stretch text-wrapper_2" bindtap="onSearch">
-        <text class="font text_8" >搜索</text>
-      </view>
+      <view class="btn btn-primary" bindtap="onSearch">搜索</view>
     </view>
-  </view>
 
-  <!-- 查询结果展示 -->
-  <view class="flex-col mt-26">
-    <view class="flex-col list-item mt-19" wx:for="{{items}}" wx:for-item="item" wx:for-index="index" wx:key="index">
-      <!-- 排名 -->
-      <view class="flex-row">
-        <view class="flex-col justify-start items-center text-wrapper_4">
-          <text class="font_2 text_9">{{index + 1}}</text>
+    <!-- 结果列表 -->
+    <view class="result-wrap">
+      <view class="card item-card"
+            wx:for="{{ items }}"
+            wx:for-item="item"
+            wx:for-index="index"
+            wx:key="index">
+
+        <!-- 头部：排名 + 基本信息 -->
+        <view class="item-head">
+          <view class="rank-badge {{ index < 3 ? 'rank-top' : '' }}">
+            <text class="rank-text">{{ index + 1 }}</text>
+          </view>
+
+          <view class="person-line">
+            <text class="name">{{ item.nickName }}</text>
+            <text class="phone">{{ item.phoneNumber }}</text>
+          </view>
         </view>
-        <!-- 主管信息 -->
-        <view class="flex-row items-center self-start group ml-20">
-          <text class="font_3">{{item.nickName}}</text>
-          <text class="font_4 ml-7">{{item.phoneNumber}}</text>
+
+        <!-- 指标 chips -->
+        <view class="chips">
+          <view wx:if="{{ k === '1' }}" class="chip">员工：{{ item.empCount }}</view>
+          <view class="chip">推广：{{ item.promoCount }}</view>
+          <view class="chip">下单：{{ item.orderCount }}</view>
+        </view>
+
+        <!-- 金额类键值行 -->
+        <view class="kv">
+          <text class="kv-key">总额</text>
+          <text class="kv-val money">￥{{ item.totalAmount }}</text>
+        </view>
+        <view class="kv">
+          <text class="kv-key">净成交</text>
+          <text class="kv-val money">￥{{ item.netAmount }}</text>
         </view>
       </view>
-      
-      <!-- 绩效数据 -->
-      <view class="flex-row mt-14">
-        <view class="flex-col justify-start items-center text-wrapper_5" wx:if="{{k === '1'}}">
-          <text class="font_5 text_11">员工：{{item.empCount}}</text>
-        </view>
-        <view class="flex-col justify-start items-center text-wrapper_6">
-          <text class="font_5 text_12">推广：{{item.promoCount}}</text>
-        </view>
-        <view class="flex-col justify-start items-center text-wrapper_7 ml-8">
-          <text class="font_5">下单：{{item.orderCount}}</text>
-        </view>
-      </view>
-      
-      <!-- 订单金额 -->
-      <view class="flex-row mt-14">
-        <view class="flex-col justify-start text-wrapper_8">
-          <text class="font_5 text_13">总额：￥{{item.totalAmount}}</text>
-        </view>
-        <view class="flex-col justify-start text-wrapper_9 ml-16">
-          <text class="font_5 text_14">净成交：￥{{item.netAmount}}</text>
-        </view>
+
+      <!-- 空状态 -->
+      <view wx:if="{{ !items || !items.length }}" class="empty">
+        <image class="empty-img" src="/assets/empty-list.png" mode="aspectFit" />
+        <text class="empty-text">暂无数据</text>
       </view>
     </view>
-  </view>
+  </scroll-view>
 </view>

pages/dashboardModule/performanceRanking/performanceRanking.wxss

@@ -1,220 +1,189 @@
-.mt-27 {
-  margin-top: 50.63rpx;
-}
-.mt-19 {
-  margin-top: 35.63rpx;
-}
-.ml-7 {
-  margin-left: 13.13rpx;
-}
+/* ===== 页面框架 ===== */
 .page {
-  padding: 71.06rpx 42.19rpx 199.69rpx 44.06rpx;
-  background-color: #fefbf6;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-  width: 100%;
-  position: fixed;
-  bottom: 0;
-  overflow: auto;
-  height: calc(100vh - 1rpx);
+  background: #fefbf6;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
 }
-.text {
-  color: #e67e22;
-  font-size: 45rpx;
-  font-family: SourceHanSansCN;
+
+.page-title {
+  padding: 24rpx 24rpx 0;
+}
+.title {
+  font-size: 40rpx;
   font-weight: 700;
-  line-height: 42.84rpx;
+  color: #ff8a00;         /* 主色：亮橙 */
 }
-.section {
-  padding: 45.75rpx 42.99rpx 34.82rpx;
-  background-color: #ffffff;
-  border-radius: 23.47rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+.content {
+  flex: 1;
+  padding: 24rpx;
+  box-sizing: border-box;
 }
-.text-wrapper {
-  margin-top: 14.49rpx;
-  padding: 17.63rpx 0 14.63rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  width: 403.13rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+/* 隐藏滚动条 */
+.no-scrollbar::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  display: none;
 }
-.text_3 {
-  margin-left: 15.19rpx;
+
+/* ===== 卡片通用 ===== */
+.card {
+  background: #ffffff;
+  border-radius: 18rpx;
+  padding: 24rpx;
+  border: 2rpx solid #ffeaa7; /* 与你项目的浅橙描边一致 */
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.05);
 }
-.font {
+.card + .card { margin-top: 20rpx; }
+
+/* ===== 表单区 ===== */
+.form-card .field + .field { margin-top: 20rpx; }
+
+.field-label {
+  font-size: 28rpx;
+  color: #555555;
+  margin-bottom: 12rpx;
+  display: block;
+}
+
+/* 输入框 */
+.input-box {
+  height: 84rpx;
+  border-radius: 12rpx;
+  border: 2rpx solid #ffeaa7;
+  background: #ffffff;
+  padding: 0 20rpx;
+  display: flex;
+  align-items: center;
+}
+.input {
+  flex: 1;
+  font-size: 28rpx;
+  color: #1f1f1f;
+}
+
+/* 选择器行 */
+.picker-row {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 16rpx;
+}
+.picker-box {
+  height: 84rpx;
+  border-radius: 12rpx;
+  border: 2rpx solid #ffeaa7;
+  background: #ffffff;
+  display: flex;
+  align-items: center;
+  position: relative;
+}
+.picker-inner {
+  padding: 0 20rpx;
+  width: 270rpx;
+  height: 84rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.picker-text { font-size: 28rpx; color: #1f1f1f;}
+.arrow { width: 28rpx; height: 28rpx; position: absolute;  right: 20rpx;}
+
+/* 搜索按钮 */
+.btn {
+  height: 88rpx;
+  border-radius: 999rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 28.14rpx;
-  color: #66666b;
+  font-weight: 600;
+  margin-top: 24rpx;
 }
-.text_2 {
-  margin-left: 2.63rpx;
-  line-height: 27.75rpx;
-}
-.text_4 {
-  line-height: 27.75rpx;
-}
-.text_5 {
-  margin-left: 2.44rpx;
-  margin-top: 41.32rpx;
-  line-height: 27.6rpx;
-}
-.text-wrapper_1 {
-  margin-top: 14.51rpx;
-  padding: 17.66rpx 0 14.64rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  width: 403.13rpx;
-  border: solid 1.88rpx #ffeaa7;
-}
-.text_6 {
-  line-height: 27.69rpx;
-}
-.text_7 {
-  margin-left: 2.19rpx;
-  margin-top: 41.18rpx;
-  line-height: 27.84rpx;
-}
-.equal-division {
-  align-self: stretch;
-  margin-right: 4.01rpx;
-  margin-top: 16.29rpx;
-}
-.section_2 {
-  flex: 1 1 270rpx;
-}
-.section_1 {
-  padding: 17.68rpx 14.19rpx 14.34rpx 14.89rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  height: 63.75rpx;
-  border: solid 1.88rpx #ffeaa7;
-}
-.text_1 {
-  line-height: 27.94rpx;
-}
-.image {
-  width: 26.25rpx;
-  height: 26.25rpx;
-}
-.section_3 {
-  padding: 17.61rpx 16.27rpx 14.55rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  height: 63.75rpx;
-  border: solid 1.88rpx #ffeaa7;
-}
-.text_16 {
-  line-height: 27.84rpx;
-}
-.text-wrapper_2 {
-  margin: 32.81rpx 4.97rpx 0 4.69rpx;
-  padding: 26.29rpx 0 21.02rpx;
-  background-color: #ffa400;
-  border-radius: 9.38rpx;
-}
-.text_8 {
+.btn-primary {
+  background: linear-gradient(180deg, #ffa400 0%, #ff8a00 100%);
   color: #ffffff;
-  line-height: 27.69rpx;
+  box-shadow: 0 6rpx 14rpx rgba(255,138,0,0.30);
 }
-.list-item {
-  padding: 29.89rpx 29.87rpx 31.99rpx 33.62rpx;
-  background-color: #ffffff;
-  border-radius: 18.75rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+/* ===== 列表与条目 ===== */
+.result-wrap { margin-top: 20rpx; }
+
+.item-card { padding-top: 20rpx; }
+
+/* 顶部信息 */
+.item-head {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+  margin-bottom: 8rpx;
 }
-.list-item:first-child {
-  margin-top: 0;
+.rank-badge {
+  width: 64rpx;
+  height: 64rpx;
+  border-radius: 999rpx;
+  background: #f0f0f0;
+  border: 2rpx solid #e6e6e6;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
-.text-wrapper_4 {
-  padding: 17.93rpx 0 12.34rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  width: 52.5rpx;
-  height: 56.25rpx;
-  border: solid 1.88rpx #ffa400;
+.rank-top {
+  background: #fff6e6;
+  border-color: #ffd6b3;
 }
-.font_2 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.02rpx;
+.rank-text {
+  font-size: 28rpx;
   font-weight: 700;
-  color: #ffa400;
+  color: #ff8a00; /* 改为亮橙 */
 }
-.text_9 {
-  line-height: 22.24rpx;
+
+.person-line {
+  display: flex;
+  align-items: baseline;
+  gap: 12rpx;
+  flex-wrap: wrap;
 }
-.group {
-  margin-top: 22.18rpx;
+.name  { font-size: 30rpx; font-weight: 600; color: #1f1f1f; }
+.phone { font-size: 26rpx; color: #666666; }
+
+/* 指标 Chips */
+.chips {
+  display: flex;
+  gap: 12rpx;
+  flex-wrap: wrap;
+  margin: 8rpx 0 4rpx;
 }
-.font_3 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 28.14rpx;
-  color: #000000;
+.chip {
+  padding: 10rpx 16rpx;
+  background: #f7f9fc;
+  color: #3d4f6e;
+  border: 1rpx solid #e6edf7;
+  border-radius: 12rpx;
+  font-size: 24rpx;
 }
-.font_4 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 19.93rpx;
-  color: #66666b;
+
+/* 金额类键值行 */
+.kv {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12rpx 0;
+  border-top: 1rpx dashed #f0f0f0;
 }
-.text-wrapper_5 {
-  padding: 16.71rpx 0 12.71rpx;
-  background-color: #ffffff;
-  border-radius: 28.13rpx;
-  width: 146.25rpx;
-  height: 56.25rpx;
-  border: solid 1.88rpx #ffa400;
-  margin-right: 15rpx;
+.kv:first-of-type { border-top: 0; }
+.kv-key { font-size: 26rpx; color: #666666; }
+.kv-val { font-size: 28rpx; color: #1f1f1f; }
+.money { color: #ff8a00; font-weight: 700; }
+
+/* ===== 空状态 ===== */
+.empty {
+  padding: 120rpx 0 40rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: #999999;
 }
-.font_5 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.02rpx;
-  color: #000000;
-}
-.text_11 {
-  line-height: 23.08rpx;
-}
-.text-wrapper_6 {
-  padding: 15.51rpx 0 12.56rpx;
-  background-color: #ffffff;
-  border-radius: 28.13rpx;
-  width: 146.25rpx;
-  height: 56.25rpx;
-  border: solid 1.88rpx #ffa400;
-}
-.text_12 {
-  line-height: 24.43rpx;
-}
-.text-wrapper_7 {
-  padding: 15.62rpx 0 12.86rpx;
-  background-color: #ffffff;
-  border-radius: 28.13rpx;
-  width: 146.25rpx;
-  height: 56.25rpx;
-  border: solid 1.88rpx #ffa400;
-}
-.text-wrapper_8 {
-  padding: 14.87rpx 0 13.41rpx;
-  background-color: #ffffff;
-  border-radius: 28.13rpx;
-  height: 56.25rpx;
-  border: solid 1.88rpx #ffa400;
-}
-.text_13 {
-  margin: 0 16.86rpx;
-  line-height: 24.23rpx;
-}
-.text-wrapper_9 {
-  padding: 14.61rpx 0 13.33rpx;
-  background-color: #ffffff;
-  border-radius: 28.13rpx;
-  height: 56.25rpx;
-  border: solid 1.88rpx #ffa400;
-}
-.text_14 {
-  margin: 0 18.86rpx;
-  line-height: 24.56rpx;
-}
+.empty-img { width: 300rpx; height: 300rpx; margin-bottom: 16rpx; }
+.empty-text { font-size: 26rpx; }

pages/dashboardModule/staffPerformance/staffPerformance.js

@@ -1,4 +1,5 @@
 import { baseUrl } from "../../../request";
+const { notLogin } = require('../../../utils/util')
 
 // pages/dashboardModule/supervisorPerformance/supervisorPerformance.js
 Page({
@@ -45,7 +46,7 @@ Page({
           this.setData({ performanceList: listWithRate });
           this.setData({ showList: true });
         } else {
-          wx.showToast({ title: res.data.message || '查询失败', icon: 'none' });
+          notLogin(res.data.message)
         }
       },
       fail: () => {
@@ -105,6 +106,11 @@ Page({
     this.onSearchSupId();
   },
 
+  onPullDownRefresh() {
+    this.onSearchSupId()
+    wx.stopPullDownRefresh();
+  },
+
   // 跳转用户订单
   gotoUser(e) {
     const { id } = e.currentTarget.dataset;

pages/dashboardModule/staffPerformance/staffPerformance.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "enablePullDownRefresh": true
 }

pages/dashboardModule/staffPerformance/staffPerformance.wxml

@@ -1,132 +1,128 @@
 <!-- pages/dashboardModule/supervisorPerformance/supervisorPerformance.wxml -->
-<view class="flex-col page">
+<view class="page">
   <!-- 标题 -->
-  <text class="self-center text">员工业绩报表</text>
+  <view class="page-title">
+    <text class="title">员工业绩报表</text>
+  </view>
 
-  <!-- 搜索表单 -->
-  <view class="flex-col self-stretch mt-19">
-    <view class="flex-col section">
-      <!-- 主管名称 -->
-      <view class="flex-col items-start">
-        <text class="font text_2">员工名称</text>
-        <view class="flex-col justify-start items-start text-wrapper mt-7">
+  <scroll-view scroll-y class="content no-scrollbar">
+    <!-- 搜索表单 -->
+    <view class="card form-card">
+      <!-- 员工名称 -->
+      <view class="field">
+        <text class="field-label">员工名称</text>
+        <view class="input-box">
           <input
-            class="text_3 font text_4"
+            class="input"
             placeholder="请输入员工名称"
+            placeholder-class="ph"
             bindinput="onNameInput"
-            value="{{nickName}}"
+            value="{{ nickName }}"
           />
         </view>
       </view>
 
       <!-- 手机号 -->
-      <view class="flex-col items-start mt-24">
-        <text class="font text_1">手机号</text>
-        <view class="flex-col justify-start items-start text-wrapper_1 mt-8">
+      <view class="field">
+        <text class="field-label">手机号</text>
+        <view class="input-box">
           <input
-            class="text_3 font text_5"
+            class="input"
             placeholder="请输入手机号"
+            placeholder-class="ph"
             bindinput="onPhoneInput"
-            value="{{phoneNumber}}"
+            value="{{ phoneNumber }}"
             type="number"
-            maxLength="11"
+            maxlength="11"
           />
         </view>
       </view>
 
-      <!-- 搜索按钮 -->
-      <view
-        class="flex-col justify-start items-center text-wrapper_2 mt-24"
-        bindtap="onSearch"
-      >
-        <text class="font text_6">搜索</text>
-      </view>
+      <!-- 搜索 -->
+      <view class="btn btn-primary" bindtap="onSearch">搜索</view>
     </view>
-  </view>
 
-  <!-- 业绩列表，未搜索前不显示 -->
-  <block wx:if="{{showList}}">
-    <view class="flex-col justify-start mt-28">
-      <view class="flex-col">
-        <view
-          class="flex-col list-item mt-25"
-          wx:for="{{performanceList}}"
-          wx:for-item="item"
-          wx:for-index="index"
-          wx:key="item.id"
-        >
-          <!-- 基本信息 -->
-          <view class="flex-row justify-between self-stretch group">
-            <view class="flex-col items-start self-center">
-              <text class="font_2">编号：{{index + 1}}</text>
-              <text class="font text_8 mt-13">员工：{{item.nickName}}</text>
-            </view>
-            <view class="flex-col justify-start self-start text-wrapper_4" bind:tap="gotoUser" data-id="{{ item.userId }}">
-              <text class="font_3 text_7">客户订单明细>></text>
-            </view>
+    <!-- 业绩列表 -->
+    <block wx:if="{{ showList }}">
+      <!-- 空状态（可选） -->
+      <view wx:if="{{ !performanceList || performanceList.length === 0 }}" class="empty">
+        <image class="empty-img" src="/assets/empty-list.png" mode="aspectFit" />
+        <text class="empty-text">暂无数据</text>
+      </view>
+
+      <!-- 列表卡片 -->
+      <view wx:for="{{ performanceList }}"
+            wx:key="item.id"
+            wx:for-item="item"
+            wx:for-index="index"
+            class="card perf-card">
+
+        <!-- 顶部：编号 + 员工 + 跳转 -->
+        <view class="topline">
+          <view class="id-and-name">
+            <text class="no">编号：{{ index + 1 }}</text>
+            <text class="name">员工：{{ item.nickName }}</text>
           </view>
-
-          <!-- 手机号 & 复制 -->
-          <view class="flex-row self-start section_3">
-            <text class="font_4">手机号：{{item.phoneNumber}}</text>
-            <text
-              class="font_3 text_9"
-              bindtap="onCopyPhone"
-              data-phone="{{item.phoneNumber}}"
-            >复制</text>
+          <view class="link-btn" bind:tap="gotoUser" data-id="{{ item.userId }}">
+            <text class="link-text">客户订单明细 >></text>
           </view>
+        </view>
 
-          <!-- 员工数 & 抽成比例 -->
-          <view class="flex-row self-stretch group_2">
-            <view class="flex-col justify-start text-wrapper_5">
-              <text class="font_4 text_10">客户数：{{item.empCount}}</text>
-            </view>
-            <view class="flex-col justify-start text-wrapper_6 ml-10">
-              <text class="font_4 text_11">比例：{{item.ratePercent}}%</text>
-            </view>
+        <!-- 手机号 + 复制 -->
+        <view class="row">
+          <text class="row-key">手机号</text>
+          <view class="row-val">
+            <text class="mono">{{ item.phoneNumber }}</text>
+            <text class="copy" bindtap="onCopyPhone" data-phone="{{ item.phoneNumber }}">复制</text>
           </view>
+        </view>
 
-          <!-- 业绩网格 -->
-          <view class="self-stretch group_3">
-            <view class="flex-col items-start grid-item">
-              <text class="font_5 text_12">下单量</text>
-              <text class="font_6 mt-18">{{item.orderCount}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_2">
-              <text class="font_5 text_13">总订单</text>
-              <text class="font_6 text_15 mt-18">￥{{item.totalAmount}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_3">
-              <text class="font_5 text_14">净成交</text>
-              <text class="font_6 text_16 mt-17">￥{{item.netAmount}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_4">
-              <text class="font_5 text_17">待释放</text>
-              <text class="font_6 text_18 mt-18">￥{{item.toRelease}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_5">
-              <text class="font_5">可结算</text>
-              <text class="font_6 mt-18">{{item.toSettle}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_6">
-              <text class="font_5">已结算</text>
-              <text class="font_6 text_19 mt-18">￥{{item.settled}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_7">
-              <text class="font_5 text_20">推广数</text>
-              <text class="font_6 mt-17">{{item.promoCount}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_8">
-              <text class="font_5 text_21">退款</text>
-              <text class="font_6 text_23 mt-18">￥{{item.refunded}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_9">
-              <text class="font_5 text_22">已回退</text>
-              <text class="font_6 text_24 mt-18">￥0</text>
-            </view>
+        <!-- 客户数 + 抽成比例（徽章） -->
+        <view class="chips">
+          <view class="chip">客户数：{{ item.empCount }}</view>
+          <view class="chip">比例：{{ item.ratePercent }}%</view>
+        </view>
+
+        <!-- 业绩九宫格 -->
+        <view class="grid">
+          <view class="grid-item">
+            <text class="gi-label">下单量</text>
+            <text class="gi-value">{{ item.orderCount }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">总订单</text>
+            <text class="gi-value money">￥{{ item.totalAmount }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">净成交</text>
+            <text class="gi-value money">￥{{ item.netAmount }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">待释放</text>
+            <text class="gi-value money">￥{{ item.toRelease }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">可结算</text>
+            <text class="gi-value">{{ item.toSettle }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">已结算</text>
+            <text class="gi-value money">￥{{ item.settled }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">推广数</text>
+            <text class="gi-value">{{ item.promoCount }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">退款</text>
+            <text class="gi-value money">￥{{ item.refunded }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">已回退</text>
+            <text class="gi-value money">￥0</text>
           </view>
         </view>
       </view>
-    </view>
-  </block>
+    </block>
+  </scroll-view>
 </view>

pages/dashboardModule/staffPerformance/staffPerformance.wxss

@@ -1,290 +1,176 @@
-.mt-19 {
-  margin-top: 35.63rpx;
-}
-.mt-7 {
-  margin-top: 13.13rpx;
-}
-.mt-25 {
-  margin-top: 46.88rpx;
-}
-.mt-13 {
-  margin-top: 24.38rpx;
-}
-.mt-17 {
-  margin-top: 31.88rpx;
-}
+/* 基础 */
 .page {
-  padding: 71.06rpx 42.19rpx 117.19rpx 43.99rpx;
-  background-color: #fefbf6;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-  width: 100%;
-  position: fixed;
-  bottom: 0;
-  overflow: auto;
-  height: calc(100vh - 1rpx);
+  background: #fefbf6;           /* 暖米黄背景 */
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
 }
-.text {
-  color: #e67e22;
-  font-size: 45rpx;
-  font-family: SourceHanSansCN;
+
+.page-title { padding: 24rpx 24rpx 0; }
+.title {
+  color: #ff8a00;                /* 主标题亮橙 */
+  font-size: 40rpx;
   font-weight: 700;
-  line-height: 42.75rpx;
 }
-.section {
-  padding: 45.75rpx 39.26rpx 47.94rpx 42.99rpx;
-  background-color: #ffffff;
-  border-radius: 18.75rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+.content {
+  flex: 1;
+  padding: 24rpx;
+  box-sizing: border-box;
 }
-.text-wrapper {
-  padding: 17.63rpx 0 14.63rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  width: 403.13rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+/* 隐藏滚动条 */
+.no-scrollbar::-webkit-scrollbar { width: 0; height: 0; display: none; }
+
+/* 卡片 */
+.card {
+  background: #ffffff;
+  border-radius: 18rpx;
+  padding: 24rpx;
+  border: 2rpx solid #ffeaa7;    /* 浅橙描边 */
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.05);
 }
-.text_3 {
-  margin-left: 15.19rpx;
+.card + .card { margin-top: 20rpx; }
+
+/* 表单 */
+.form-card .field + .field { margin-top: 20rpx; }
+
+.field-label {
+  font-size: 28rpx;
+  color: #555555;
+  margin-bottom: 12rpx;
+  display: block;
 }
-.font {
+
+.input-box {
+  background: #ffffff;
+  border: 2rpx solid #ffeaa7;
+  border-radius: 12rpx;
+  padding: 0 20rpx;
+  height: 84rpx;
+  display: flex;
+  align-items: center;
+}
+
+.input {
+  flex: 1;
+  font-size: 28rpx;
+  color: #1f1f1f;
+}
+.ph { color: #b8b8b8; }
+
+/* 按钮 */
+.btn {
+  height: 88rpx;
+  border-radius: 999rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.6rpx;
-  color: #66666b;
+  font-weight: 600;
+  margin-top: 24rpx;
 }
-.text_2 {
-  margin-left: 2.63rpx;
-  line-height: 27.75rpx;
-}
-.text_4 {
-  line-height: 27.75rpx;
-}
-.text_1 {
-  margin-left: 2.44rpx;
-}
-.text-wrapper_1 {
-  padding: 17.66rpx 0 14.64rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  width: 403.13rpx;
-  border: solid 1.88rpx #ffeaa7;
-}
-.text_5 {
-  line-height: 27.69rpx;
-}
-.text-wrapper_2 {
-  margin-right: 12.43rpx;
-  padding: 26.29rpx 0 21.02rpx;
-  background-color: #ffa400;
-  border-radius: 9.38rpx;
-}
-.text_6 {
+.btn-primary {
+  background: linear-gradient(180deg, #ffa400 0%, #ff8a00 100%);
   color: #ffffff;
-  line-height: 27.69rpx;
+  box-shadow: 0 6rpx 14rpx rgba(255,138,0,0.30);
 }
-.list-item {
-  padding-bottom: 38.57rpx;
-  background-color: #ffffff;
-  border-radius: 16.48rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+/* 空状态 */
+.empty {
+  padding: 120rpx 0 40rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: #999999;
 }
-.list-item:first-child {
-  margin-top: 0;
+.empty-img { width: 300rpx; height: 300rpx; margin-bottom: 16rpx; }
+.empty-text { font-size: 26rpx; }
+
+/* 列表头部行 */
+.topline {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16rpx;
+  margin-bottom: 8rpx;
 }
-.group {
-  padding: 33.62rpx 32.01rpx 31.22rpx 35.33rpx;
+.id-and-name {
+  display: flex;
+  align-items: baseline;
+  gap: 16rpx;
+  flex-wrap: wrap;
 }
-.font_2 {
-  font-size: 33.75rpx;
-  font-family: SourceHanSansCN;
-  line-height: 31.82rpx;
-  font-weight: 700;
-  color: #e88b38;
+.no { font-size: 24rpx; color: #666666; }
+.name { font-size: 28rpx; color: #1f1f1f; font-weight: 600; }
+
+.link-btn {
+  height: 56rpx;
+  padding: 0 18rpx;
+  border-radius: 999rpx;
+  background: #fff6e6;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border: 1rpx solid #ffd6b3;
 }
-.text_8 {
-  line-height: 27.86rpx;
+.link-text { font-size: 24rpx; color: #ff8a00; font-weight: 600; }
+
+/* 键值行 */
+.row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12rpx 0;
+  border-top: 1rpx dashed #f0f0f0;
 }
-.text-wrapper_4 {
-  padding: 18.51rpx 0 15.28rpx;
-  background-color: #fefbf6;
-  border-radius: 9.38rpx;
-  height: 61.88rpx;
-  border: solid 1.88rpx #ffeaa7;
+.row-key { font-size: 26rpx; color: #666666; }
+.row-val { display: flex; align-items: center; gap: 16rpx; }
+.mono { font-size: 28rpx; color: #1f1f1f; }
+.copy {
+  font-size: 24rpx;
+  color: #ff8a00;
+  padding: 8rpx 14rpx;
+  border-radius: 12rpx;
+  background: #fff4f2;
+  border: 1rpx solid #ffd6cc;
 }
-.font_3 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.3rpx;
-  color: #e88b38;
+
+/* 徽章 Chips */
+.chips { display: flex; gap: 12rpx; flex-wrap: wrap; margin: 12rpx 0 4rpx; }
+.chip {
+  padding: 10rpx 16rpx;
+  background: #f7f9fc;
+  color: #3d4f6e;
+  border: 1rpx solid #e6edf7;
+  border-radius: 12rpx;
+  font-size: 24rpx;
 }
-.text_7 {
-  margin-left: 19.41rpx;
-  margin-right: 10.59rpx;
-  line-height: 24.34rpx;
-}
-.section_3 {
-  margin-left: 33.62rpx;
-  padding: 17.76rpx 16.14rpx 14.64rpx 17.61rpx;
-  background-color: #fefbf6;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #ffeaa7;
-}
-.font_4 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.6rpx;
-  color: #333333;
-}
-.text_9 {
-  line-height: 24.15rpx;
-  margin-left: 20rpx;
-}
-.group_2 {
-  padding: 24.38rpx 33.75rpx 26.25rpx;
-  border-bottom: solid 1.88rpx #e88b38;
-}
-.text-wrapper_5 {
-  padding: 17.72rpx 0 14.53rpx;
-  background-color: #fefbf6;
-  border-radius: 9.38rpx;
-  height: 63.75rpx;
-  border: solid 1.88rpx #ffeaa7;
-}
-.text_10 {
-  margin-left: 17.08rpx;
-  margin-right: 7.29rpx;
-  line-height: 27.75rpx;
-}
-.text-wrapper_6 {
-  padding: 17.78rpx 0 14.63rpx;
-  background-color: #fefbf6;
-  border-radius: 9.38rpx;
-  height: 63.75rpx;
-  border: solid 1.88rpx #ffeaa7;
-}
-.text_11 {
-  margin-left: 13.93rpx;
-}
-.group_3 {
-  margin: 32.81rpx 29.19rpx 0 32.68rpx;
-  height: 487.5rpx;
-  display: grid;
-  grid-template-rows: repeat(3, minmax(0, 1fr));
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-  row-gap: 29.19rpx;
-  column-gap: 31.07rpx;
+
+/* 九宫格 */
+.grid {
+  margin-top: 8rpx;
+  margin-left: -10rpx;
+  margin-right: -10rpx;
+  display: flex;
+  flex-wrap: wrap;
 }
 .grid-item {
-  padding: 32.49rpx 18.19rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
+  width: 33.3333%;
+  padding: 14rpx 10rpx;
+  box-sizing: border-box;
 }
-.font_5 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.3rpx;
-  color: #66666b;
+.gi-label { font-size: 24rpx; color: #666666; }
+.gi-value {
+  display: block;
+  margin-top: 10rpx;
+  font-size: 30rpx;
+  font-weight: 700;
+  color: #1f1f1f;
 }
-.text_12 {
-  line-height: 24.02rpx;
+.gi-value.money { color: #ff8a00; }
+
+/* 小屏两列适配 */
+@media (max-width: 360px) {
+  .grid-item { width: 50%; }
 }
-.font_6 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 20.06rpx;
-  color: #e88b38;
-}
-.grid-item_2 {
-  padding: 32.42rpx 17.87rpx 31.18rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_13 {
-  line-height: 24.09rpx;
-}
-.text_15 {
-  margin-left: 4.39rpx;
-}
-.grid-item_3 {
-  padding: 32.16rpx 18rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_14 {
-  line-height: 24.56rpx;
-}
-.text_16 {
-  margin-left: 3.32rpx;
-}
-.grid-item_4 {
-  padding: 32.34rpx 17.51rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_17 {
-  line-height: 24.26rpx;
-}
-.text_18 {
-  margin-left: 3.81rpx;
-}
-.grid-item_5 {
-  padding: 32.25rpx 18.21rpx 31.18rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.grid-item_6 {
-  padding: 32.25rpx 19.18rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_19 {
-  margin-left: 2.14rpx;
-}
-.grid-item_7 {
-  padding: 32.36rpx 17.59rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_20 {
-  line-height: 24.43rpx;
-}
-.grid-item_8 {
-  padding: 32.38rpx 17.81rpx 31.18rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_21 {
-  line-height: 24.17rpx;
-}
-.text_23 {
-  margin-left: 4.44rpx;
-}
-.grid-item_9 {
-  padding: 33.43rpx 19.18rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_22 {
-  line-height: 23.08rpx;
-}
-.text_24 {
-  margin-left: 2.14rpx;
-}

pages/dashboardModule/supervisorPerformance/supervisorPerformance.js

@@ -1,4 +1,5 @@
 import { baseUrl } from "../../../request";
+const { notLogin } = require('../../../utils/util')
 
 // pages/dashboardModule/supervisorPerformance/supervisorPerformance.js
 Page({
@@ -44,7 +45,7 @@ Page({
           this.setData({ performanceList: listWithRate });
           this.setData({ showList: true });
         } else {
-          wx.showToast({ title: res.data.message || '查询失败', icon: 'none' });
+          notLogin(res.data.message)
         }
       },
       fail: () => {
@@ -82,6 +83,11 @@ Page({
     this.onSearch()
   },
 
+  onPullDownRefresh() {
+    this.onSearch()
+    wx.stopPullDownRefresh();
+  },
+
   changeStaff(e) {
 
     const { id } = e.currentTarget.dataset;

pages/dashboardModule/supervisorPerformance/supervisorPerformance.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "enablePullDownRefresh": true
 }

pages/dashboardModule/supervisorPerformance/supervisorPerformance.wxml

@@ -1,132 +1,128 @@
 <!-- pages/dashboardModule/supervisorPerformance/supervisorPerformance.wxml -->
-<view class="flex-col page">
+<view class="page">
   <!-- 标题 -->
-  <text class="self-center text">{{ showRole }}业绩报表</text>
+  <view class="page-title">
+    <text class="title">{{ showRole }}业绩报表</text>
+  </view>
 
-  <!-- 搜索表单 -->
-  <view class="flex-col self-stretch mt-19">
-    <view class="flex-col section">
+  <scroll-view scroll-y class="content no-scrollbar">
+    <!-- 搜索表单 -->
+    <view class="card form-card">
       <!-- 主管名称 -->
-      <view class="flex-col items-start">
-        <text class="font text_2">{{ showRole }}名称</text>
-        <view class="flex-col justify-start items-start text-wrapper mt-7">
+      <view class="field">
+        <text class="field-label">{{ showRole }}名称</text>
+        <view class="input-box">
           <input
-            class="text_3 font text_4"
+            class="input"
             placeholder="请输入{{ showRole }}名称"
+            placeholder-class="ph"
             bindinput="onNameInput"
-            value="{{nickName}}"
+            value="{{ nickName }}"
           />
         </view>
       </view>
 
       <!-- 手机号 -->
-      <view class="flex-col items-start mt-24">
-        <text class="font text_1">手机号</text>
-        <view class="flex-col justify-start items-start text-wrapper_1 mt-8">
+      <view class="field">
+        <text class="field-label">手机号</text>
+        <view class="input-box">
           <input
-            class="text_3 font text_5"
+            class="input"
             placeholder="请输入手机号"
+            placeholder-class="ph"
             bindinput="onPhoneInput"
-            value="{{phoneNumber}}"
+            value="{{ phoneNumber }}"
             type="number"
-            maxLength="11"
+            maxlength="11"
           />
         </view>
       </view>
 
       <!-- 搜索按钮 -->
-      <view
-        class="flex-col justify-start items-center text-wrapper_2 mt-24"
-        bindtap="onSearch"
-      >
-        <text class="font text_6">搜索</text>
-      </view>
+      <view class="btn btn-primary" bindtap="onSearch">搜索</view>
     </view>
-  </view>
 
-  <!-- 业绩列表，未搜索前不显示 -->
-  <block wx:if="{{showList}}">
-    <view class="flex-col justify-start mt-28">
-      <view class="flex-col">
-        <view
-          class="flex-col list-item mt-25"
-          wx:for="{{performanceList}}"
-          wx:for-item="item"
-          wx:for-index="index"
-          wx:key="item.id"
-        >
-          <!-- 基本信息 -->
-          <view class="flex-row justify-between self-stretch group">
-            <view class="flex-col items-start self-center">
-              <text class="font_2">编号：{{index + 1}}</text>
-              <text class="font text_8 mt-13">主管：{{item.nickName}}</text>
-            </view>
-            <view class="flex-col justify-start self-start text-wrapper_4" bind:tap="changeStaff" data-id="{{ item.userId }}">
-              <text class="font_3 text_7">员工绩效排名>></text>
-            </view>
+    <!-- 业绩列表（按需显示） -->
+    <block wx:if="{{ showList }}">
+      <!-- 空状态（可选） -->
+      <view wx:if="{{ !performanceList || performanceList.length === 0 }}" class="empty">
+        <image class="empty-img" src="/assets/empty-list.png" mode="aspectFit" />
+        <text class="empty-text">暂无数据</text>
+      </view>
+
+      <!-- 列表卡片 -->
+      <view wx:for="{{ performanceList }}"
+            wx:for-item="item"
+            wx:for-index="index"
+            wx:key="item.id"
+            class="card perf-card">
+
+        <!-- 顶部：编号 + 主管 + 跳转员工绩效 -->
+        <view class="topline">
+          <view class="id-and-name">
+            <text class="no">编号：{{ index + 1 }}</text>
+            <text class="name">主管：{{ item.nickName }}</text>
           </view>
-
-          <!-- 手机号 & 复制 -->
-          <view class="flex-row self-start section_3">
-            <text class="font_4">手机号：{{item.phoneNumber}}</text>
-            <text
-              class="font_3 text_9"
-              bindtap="onCopyPhone"
-              data-phone="{{item.phoneNumber}}"
-            >复制</text>
+          <view class="link-btn" bind:tap="changeStaff" data-id="{{ item.userId }}">
+            <text class="link-text">员工绩效排名 >></text>
           </view>
+        </view>
 
-          <!-- 员工数 & 抽成比例 -->
-          <view class="flex-row self-stretch group_2">
-            <view class="flex-col justify-start text-wrapper_5">
-              <text class="font_4 text_10">员工数：{{item.empCount}}</text>
-            </view>
-            <view class="flex-col justify-start text-wrapper_6 ml-10">
-              <text class="font_4 text_11">比例：{{item.ratePercent}}%</text>
-            </view>
+        <!-- 手机号 + 复制 -->
+        <view class="row">
+          <text class="row-key">手机号</text>
+          <view class="row-val">
+            <text class="mono">{{ item.phoneNumber }}</text>
+            <text class="copy" bindtap="onCopyPhone" data-phone="{{ item.phoneNumber }}">复制</text>
           </view>
+        </view>
 
-          <!-- 业绩网格 -->
-          <view class="self-stretch group_3">
-            <view class="flex-col items-start grid-item">
-              <text class="font_5 text_12">下单量</text>
-              <text class="font_6 mt-18">{{item.orderCount}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_2">
-              <text class="font_5 text_13">总订单</text>
-              <text class="font_6 text_15 mt-18">￥{{item.totalAmount}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_3">
-              <text class="font_5 text_14">净成交</text>
-              <text class="font_6 text_16 mt-17">￥{{item.netAmount}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_4">
-              <text class="font_5 text_17">待释放</text>
-              <text class="font_6 text_18 mt-18">￥{{item.toRelease}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_5">
-              <text class="font_5">可结算</text>
-              <text class="font_6 mt-18">{{item.toSettle}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_6">
-              <text class="font_5">已结算</text>
-              <text class="font_6 text_19 mt-18">￥{{item.settled}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_7">
-              <text class="font_5 text_20">推广数</text>
-              <text class="font_6 mt-17">{{item.promoCount}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_8">
-              <text class="font_5 text_21">退款</text>
-              <text class="font_6 text_23 mt-18">￥{{item.refunded}}</text>
-            </view>
-            <view class="flex-col items-start grid-item_9">
-              <text class="font_5 text_22">已回退</text>
-              <text class="font_6 text_24 mt-18">￥0</text>
-            </view>
+        <!-- 员工数 + 抽成比例（徽标 chip） -->
+        <view class="chips">
+          <view class="chip">员工数：{{ item.empCount }}</view>
+          <view class="chip">比例：{{ item.ratePercent }}%</view>
+        </view>
+
+        <!-- 业绩九宫格 -->
+        <view class="grid">
+          <view class="grid-item">
+            <text class="gi-label">下单量</text>
+            <text class="gi-value">{{ item.orderCount }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">总订单</text>
+            <text class="gi-value">￥{{ item.totalAmount }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">净成交</text>
+            <text class="gi-value">￥{{ item.netAmount }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">待释放</text>
+            <text class="gi-value">￥{{ item.toRelease }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">可结算</text>
+            <text class="gi-value">{{ item.toSettle }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">已结算</text>
+            <text class="gi-value">￥{{ item.settled }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">推广数</text>
+            <text class="gi-value">{{ item.promoCount }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">退款</text>
+            <text class="gi-value">￥{{ item.refunded }}</text>
+          </view>
+          <view class="grid-item">
+            <text class="gi-label">已回退</text>
+            <text class="gi-value">￥0</text>
           </view>
         </view>
       </view>
-    </view>
-  </block>
+    </block>
+  </scroll-view>
 </view>

pages/dashboardModule/supervisorPerformance/supervisorPerformance.wxss

@@ -1,290 +1,235 @@
-.mt-19 {
-  margin-top: 35.63rpx;
-}
-.mt-7 {
-  margin-top: 13.13rpx;
-}
-.mt-25 {
-  margin-top: 46.88rpx;
-}
-.mt-13 {
-  margin-top: 24.38rpx;
-}
-.mt-17 {
-  margin-top: 31.88rpx;
-}
+/* ===== 页面与滚动 ===== */
 .page {
-  padding: 71.06rpx 42.19rpx 117.19rpx 43.99rpx;
-  background-color: #fefbf6;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-  width: 100%;
-  position: fixed;
-  bottom: 0;
-  overflow: auto;
-  height: calc(100vh - 1rpx);
+  background: #fefbf6;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
 }
-.text {
-  color: #e67e22;
-  font-size: 45rpx;
-  font-family: SourceHanSansCN;
+
+.page-title {
+  padding: 24rpx 24rpx 0;
+}
+.title {
+  color: #ff8a00;           /* 主标题亮橙 */
+  font-size: 40rpx;
   font-weight: 700;
-  line-height: 42.75rpx;
 }
-.section {
-  padding: 45.75rpx 39.26rpx 47.94rpx 42.99rpx;
-  background-color: #ffffff;
-  border-radius: 18.75rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+.content {
+  flex: 1;
+  padding: 24rpx;
+  box-sizing: border-box;
 }
-.text-wrapper {
-  padding: 17.63rpx 0 14.63rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  width: 403.13rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+.no-scrollbar::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  display: none;
 }
-.text_3 {
-  margin-left: 15.19rpx;
+
+/* ===== 卡片通用 ===== */
+.card {
+  background: #ffffff;
+  border-radius: 18rpx;
+  padding: 24rpx;
+  border: 2rpx solid #ffeaa7;               /* 浅橙描边 */
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.05);
 }
-.font {
+.card + .card { margin-top: 20rpx; }
+
+/* ===== 表单 ===== */
+.form-card .field + .field { margin-top: 20rpx; }
+
+.field-label {
+  font-size: 28rpx;
+  color: #555555;
+  margin-bottom: 12rpx;
+  display: block;
+}
+
+.input-box {
+  background: #ffffff;
+  border: 2rpx solid #ffeaa7;
+  border-radius: 12rpx;
+  padding: 0 20rpx;
+  height: 84rpx;
+  display: flex;
+  align-items: center;
+}
+
+.input {
+  flex: 1;
+  font-size: 28rpx;
+  color: #1f1f1f;
+}
+
+.ph {
+  color: #b8b8b8;
+}
+
+/* 按钮 */
+.btn {
+  height: 88rpx;
+  border-radius: 999rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.6rpx;
-  color: #66666b;
+  font-weight: 600;
+  margin-top: 24rpx;
 }
-.text_2 {
-  margin-left: 2.63rpx;
-  line-height: 27.75rpx;
-}
-.text_4 {
-  line-height: 27.75rpx;
-}
-.text_1 {
-  margin-left: 2.44rpx;
-}
-.text-wrapper_1 {
-  padding: 17.66rpx 0 14.64rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  width: 403.13rpx;
-  border: solid 1.88rpx #ffeaa7;
-}
-.text_5 {
-  line-height: 27.69rpx;
-}
-.text-wrapper_2 {
-  margin-right: 12.43rpx;
-  padding: 26.29rpx 0 21.02rpx;
-  background-color: #ffa400;
-  border-radius: 9.38rpx;
-}
-.text_6 {
+
+.btn-primary {
+  background: linear-gradient(180deg, #ffa400 0%, #ff8a00 100%);
   color: #ffffff;
-  line-height: 27.69rpx;
+  box-shadow: 0 6rpx 14rpx rgba(255, 138, 0, 0.30);
 }
-.list-item {
-  padding-bottom: 38.57rpx;
-  background-color: #ffffff;
-  border-radius: 16.48rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+/* ===== 空状态 ===== */
+.empty {
+  padding: 120rpx 0 40rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: #999999;
 }
-.list-item:first-child {
-  margin-top: 0;
+.empty-img { width: 300rpx; height: 300rpx; margin-bottom: 16rpx; }
+.empty-text { font-size: 26rpx; }
+
+/* ===== 业绩卡片 ===== */
+.topline {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16rpx;
+  margin-bottom: 8rpx;
 }
-.group {
-  padding: 33.62rpx 32.01rpx 31.22rpx 35.33rpx;
+
+.id-and-name {
+  display: flex;
+  align-items: baseline;
+  gap: 16rpx;
+  flex-wrap: wrap;
 }
-.font_2 {
-  font-size: 33.75rpx;
-  font-family: SourceHanSansCN;
-  line-height: 31.82rpx;
-  font-weight: 700;
-  color: #e88b38;
+
+.no {
+  font-size: 24rpx;
+  color: #666666;
 }
-.text_8 {
-  line-height: 27.86rpx;
+
+.name {
+  font-size: 28rpx;
+  color: #1f1f1f;
+  font-weight: 600;
 }
-.text-wrapper_4 {
-  padding: 18.51rpx 0 15.28rpx;
-  background-color: #fefbf6;
-  border-radius: 9.38rpx;
-  height: 61.88rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+.link-btn {
+  height: 56rpx;
+  padding: 0 18rpx;
+  border-radius: 999rpx;
+  background: #fff6e6;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border: 1rpx solid #ffd6b3;
 }
-.font_3 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.3rpx;
-  color: #e88b38;
+
+.link-text {
+  font-size: 24rpx;
+  color: #ff8a00;
+  font-weight: 600;
 }
-.text_7 {
-  margin-left: 19.41rpx;
-  margin-right: 10.59rpx;
-  line-height: 24.34rpx;
+
+/* 行：键值对 */
+.row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12rpx 0;
+  border-top: 1rpx dashed #f0f0f0;
 }
-.section_3 {
-  margin-left: 33.62rpx;
-  padding: 17.76rpx 16.14rpx 14.64rpx 17.61rpx;
-  background-color: #fefbf6;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+.row-key {
+  font-size: 26rpx;
+  color: #666666;
 }
-.font_4 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.6rpx;
-  color: #333333;
+
+.row-val {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
 }
-.text_9 {
-  line-height: 24.15rpx;
-  margin-left: 20rpx;
+
+.mono {
+  font-size: 28rpx;
+  color: #1f1f1f;
 }
-.group_2 {
-  padding: 24.38rpx 33.75rpx 26.25rpx;
-  border-bottom: solid 1.88rpx #e88b38;
+
+.copy {
+  font-size: 24rpx;
+  color: #ff8a00;
+  padding: 8rpx 14rpx;
+  border-radius: 12rpx;
+  background: #fff4f2;
+  border: 1rpx solid #ffd6cc;
 }
-.text-wrapper_5 {
-  padding: 17.72rpx 0 14.53rpx;
-  background-color: #fefbf6;
-  border-radius: 9.38rpx;
-  height: 63.75rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+/* 徽标 chips */
+.chips {
+  display: flex;
+  gap: 12rpx;
+  flex-wrap: wrap;
+  margin: 12rpx 0 4rpx;
 }
-.text_10 {
-  margin-left: 17.08rpx;
-  margin-right: 7.29rpx;
-  line-height: 27.75rpx;
+
+.chip {
+  padding: 10rpx 16rpx;
+  background: #f7f9fc;
+  color: #3d4f6e;
+  border: 1rpx solid #e6edf7;
+  border-radius: 12rpx;
+  font-size: 24rpx;
 }
-.text-wrapper_6 {
-  padding: 17.78rpx 0 14.63rpx;
-  background-color: #fefbf6;
-  border-radius: 9.38rpx;
-  height: 63.75rpx;
-  border: solid 1.88rpx #ffeaa7;
-}
-.text_11 {
-  margin-left: 13.93rpx;
-}
-.group_3 {
-  margin: 32.81rpx 29.19rpx 0 32.68rpx;
-  height: 487.5rpx;
-  display: grid;
-  grid-template-rows: repeat(3, minmax(0, 1fr));
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-  row-gap: 29.19rpx;
-  column-gap: 31.07rpx;
+
+/* 九宫格：3 列自适应 */
+.grid {
+  margin-top: 8rpx;
+  margin-left: -10rpx;
+  margin-right: -10rpx;
+  display: flex;
+  flex-wrap: wrap;
 }
+
 .grid-item {
-  padding: 32.49rpx 18.19rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
+  width: 33.3333%;
+  padding: 14rpx 10rpx;
+  box-sizing: border-box;
 }
-.font_5 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.3rpx;
-  color: #66666b;
+
+.gi-label {
+  font-size: 24rpx;
+  color: #666666;
 }
-.text_12 {
-  line-height: 24.02rpx;
+
+.gi-value {
+  display: block;
+  margin-top: 10rpx;
+  font-size: 30rpx;
+  font-weight: 700;
+  color: #1f1f1f;
 }
-.font_6 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 20.06rpx;
-  color: #e88b38;
+
+/* 金额类，用主题橙强调 */
+.grid-item:nth-child(2) .gi-value,
+.grid-item:nth-child(3) .gi-value,
+.grid-item:nth-child(4) .gi-value,
+.grid-item:nth-child(6) .gi-value,
+.grid-item:nth-child(8) .gi-value,
+.grid-item:nth-child(9) .gi-value {
+  color: #ff8a00;
 }
-.grid-item_2 {
-  padding: 32.42rpx 17.87rpx 31.18rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
+
+/* 小屏两列适配 */
+@media (max-width: 360px) {
+  .grid-item { width: 50%; }
 }
-.text_13 {
-  line-height: 24.09rpx;
-}
-.text_15 {
-  margin-left: 4.39rpx;
-}
-.grid-item_3 {
-  padding: 32.16rpx 18rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_14 {
-  line-height: 24.56rpx;
-}
-.text_16 {
-  margin-left: 3.32rpx;
-}
-.grid-item_4 {
-  padding: 32.34rpx 17.51rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_17 {
-  line-height: 24.26rpx;
-}
-.text_18 {
-  margin-left: 3.81rpx;
-}
-.grid-item_5 {
-  padding: 32.25rpx 18.21rpx 31.18rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.grid-item_6 {
-  padding: 32.25rpx 19.18rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_19 {
-  margin-left: 2.14rpx;
-}
-.grid-item_7 {
-  padding: 32.36rpx 17.59rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_20 {
-  line-height: 24.43rpx;
-}
-.grid-item_8 {
-  padding: 32.38rpx 17.81rpx 31.18rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_21 {
-  line-height: 24.17rpx;
-}
-.text_23 {
-  margin-left: 4.44rpx;
-}
-.grid-item_9 {
-  padding: 33.43rpx 19.18rpx 31.44rpx;
-  filter: drop-shadow(0rpx 3.75rpx 3.75rpx #00000040);
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #f1c40f;
-}
-.text_22 {
-  line-height: 23.08rpx;
-}
-.text_24 {
-  margin-left: 2.14rpx;
-}

pages/dashboardModule/userOrderPerformance/userOrderPerformance.js

@@ -1,4 +1,5 @@
 import { baseUrl } from "../../../request";
+const { notLogin } = require('../../../utils/util')
 
 // pages/dashboardModule/userOrderPerformance/userOrderPerformance.js
 Page({
@@ -16,6 +17,11 @@ Page({
     this.searchOrderByStaffId()
   },
 
+  onPullDownRefresh() {
+    this.searchOrderByStaffId()
+    wx.stopPullDownRefresh();
+  },
+
   // 输入框内容变化
   onOrderNumberInput(e) {
     this.setData({
@@ -90,11 +96,8 @@ Page({
             OrderItems: res.data.data
           });
         } else {
-          wx.showToast({
-            title: res.data.message || '未找到订单',
-            icon: 'none'
-          });
           this.setData({ OrderItems: [] });
+          notLogin(res.data.message)
         }
       },
       fail: () => {

pages/dashboardModule/userOrderPerformance/userOrderPerformance.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "enablePullDownRefresh": true
 }

pages/dashboardModule/userOrderPerformance/userOrderPerformance.wxml

@@ -1,93 +1,92 @@
 <!-- pages/dashboardModule/userOrderPerformance/userOrderPerformance.wxml -->
-<view class="flex-col page">
-  <text class="self-center text">客户订单明细</text>
+<view class="page">
+  <!-- 标题 -->
+  <view class="page-title">
+    <text class="title">客户订单明细</text>
+  </view>
 
-  <view class="flex-col self-stretch mt-19">
-    <view class="flex-col section">
-      <view class="flex-col group">
-        <text class="self-start font text_2">订单号</text>
-        <view class="flex-col justify-start items-start self-stretch text-wrapper">
+  <scroll-view scroll-y class="content no-scrollbar">
+    <!-- 搜索表单 -->
+    <view class="card form-card">
+      <view class="field">
+        <text class="field-label">订单号</text>
+        <view class="input-box">
           <input
-            class="text_3 font text_1"
+            class="input"
             placeholder="请输入订单号"
-            value="{{orderNumber}}"
+            placeholder-class="ph"
+            value="{{ orderNumber }}"
             type="number"
             bindinput="onOrderNumberInput"
           />
         </view>
       </view>
 
-      <view
-        class="flex-col justify-start items-center text-wrapper_3"
-        bindtap="searchOrder"
-      >
-        <text class="font_2 text_7">搜索</text>
-      </view>
+      <view class="btn btn-primary" bindtap="searchOrder">搜索</view>
     </view>
 
-    <view class="flex-col mt-35">
-      <!-- 有数据时渲染列表 -->
-      <block wx:if="{{OrderItems.length}}">
+    <!-- 结果列表 -->
+    <view class="result-wrap">
+      <!-- 有数据 -->
+      <block wx:if="{{ OrderItems.length }}">
         <view
-          class="flex-col list-item mt-22"
-          wx:for="{{OrderItems}}"
+          wx:for="{{ OrderItems }}"
           wx:for-item="item"
           wx:for-index="index"
           wx:key="id"
+          class="card order-card"
         >
-          <view class="flex-row items-baseline" style="display: flex; justify-content: space-between;">
-            <text class="font_2 text_8">订单号：</text>
-            <text class="font_3">{{item.orderNumber}}</text>
+          <!-- 顶部：订单号 + 状态徽标 -->
+          <view class="topline">
+            <view class="row-left">
+              <text class="label">订单号</text>
+              <text class="mono">{{ item.orderNumber }}</text>
+            </view>
+            <view class="badge {{ item.orderStatus === '待支付' ? 'badge-pending' : (item.orderStatus === '已支付' || item.orderStatus === '交易成功' ? 'badge-success' : 'badge-default') }}">
+              <text class="badge-text">{{ item.orderStatus }}</text>
+            </view>
           </view>
 
-          <view class="flex-row justify-between mt-19">
-            <text class="font_2 text_9">用户：</text>
-            <text class="font_4 text_10">{{item.nickName}}</text>
+          <!-- 键值对信息 -->
+          <view class="kv">
+            <text class="kv-key">用户</text>
+            <text class="kv-val">{{ item.nickName }}</text>
           </view>
 
-          <view class="flex-row justify-between items-center mt-19">
-            <text class="font_2 text_11">手机号：</text>
-            <text class="font_3 text_12">{{item.phoneNumber}}</text>
+          <view class="kv">
+            <text class="kv-key">手机号</text>
+            <text class="kv-val">{{ item.phoneNumber }}</text>
           </view>
 
-          <view class="flex-row justify-between items-center mt-19">
-            <text class="font_2 text_13">金额：</text>
-            <text class="font_3 text_24">￥{{item.totalAmount}}</text>
+          <view class="kv">
+            <text class="kv-key">金额</text>
+            <text class="kv-val money">￥{{ item.totalAmount }}</text>
           </view>
 
-          <view class="flex-row justify-between items-center mt-19">
-            <text class="font_2 text_15">状态：</text>
-            <text class="font_4 text_16">{{item.orderStatus}}</text>
+          <view class="kv">
+            <text class="kv-key">抽成</text>
+            <text class="kv-val">主管：{{ item.firstRate * 100 }}%，员工：{{ item.secondRate * 100 }}%</text>
           </view>
 
-          <view class="flex-row justify-between items-center mt-19">
-            <text class="font_2 text_17">抽成：</text>
-            <text class="font_4 text_18">主管：{{item.firstRate * 100}}%，员工：{{item.secondRate * 100}}%
-            </text>
+          <view class="kv">
+            <text class="kv-key">奖励</text>
+            <text class="kv-val">主管：¥{{ item.firstReward }}，员工：¥{{ item.secondReward }}</text>
           </view>
 
-          <view class="flex-row justify-between items-center mt-19">
-            <text class="font_2 text_19">奖励：</text>
-            <text class="font_4 text_20">主管：¥{{item.firstReward}}，员工：¥{{item.secondReward}}
-            </text>
+          <view class="kv">
+            <text class="kv-key">提成状态</text>
+            <text class="kv-val">{{ item.commissionStatus }}</text>
           </view>
-
-          <view class="flex-row justify-between mt-19">
-            <text class="font_2 text_21">提成状态：</text>
-            <text class="font_4 text_23">{{item.commissionStatus}}</text>
-          </view>
-
-          <!-- <view class="flex-row justify-between mt-19">
-            <text class="font_2 text_4">创建时间：</text>
-            <text class="font_3 text_5">{{item.createTime}}</text>
-          </view> -->
         </view>
       </block>
 
-      <!-- 无数据时提示 -->
+      <!-- 无数据 -->
       <block wx:else>
-        <text class="self-center font text_4">暂无数据</text>
+        <view class="empty">
+          <image class="empty-img" src="/assets/empty-list.png" mode="aspectFit" />
+          <text class="empty-text">暂无数据</text>
+        </view>
       </block>
     </view>
-  </view>
+  </scroll-view>
 </view>

pages/dashboardModule/userOrderPerformance/userOrderPerformance.wxss

@@ -1,176 +1,133 @@
-.mt-19 {
-  margin-top: 35.63rpx;
-}
-.mt-35 {
-  margin-top: 65.63rpx;
-}
+/* ===== 页面与滚动 ===== */
 .page {
-  padding: 70.84rpx 42.19rpx 152.81rpx 44.06rpx;
-  background-color: #fefbf6;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-  width: 100%;
-  position: fixed;
-  bottom: 0;
-  overflow: auto;
-  height: calc(100vh - 1rpx);
+  background: #fefbf6;          /* 与你项目的暖米黄保持一致 */
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
 }
-.text {
-  color: #e67e22;
-  font-size: 45rpx;
-  font-family: SourceHanSansCN;
+.page-title { padding: 24rpx 24rpx 0; }
+.title {
+  color: #ff8a00;               /* 亮橙主色 */
+  font-size: 40rpx;
   font-weight: 700;
-  line-height: 43.16rpx;
 }
-.section {
-  padding: 0 35.76rpx 47.94rpx 41.12rpx;
-  background-color: #ffffff;
-  border-radius: 18.75rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+.content {
+  flex: 1;
+  padding: 24rpx;
+  box-sizing: border-box;
 }
-.group {
-  padding: 47.87rpx 0 51.56rpx;
+.no-scrollbar::-webkit-scrollbar { width: 0; height: 0; display: none; }
+
+/* ===== 卡片 ===== */
+.card {
+  background: #ffffff;
+  border-radius: 18rpx;
+  padding: 24rpx;
+  border: 2rpx solid #ffeaa7;   /* 浅橙描边，延续你原风格 */
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.05);
 }
-.text-wrapper {
-  margin-right: 3.77rpx;
-  margin-top: 14.55rpx;
-  padding: 17.66rpx 0 14.68rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  border: solid 1.88rpx #ffeaa7;
+.card + .card { margin-top: 20rpx; }
+
+/* ===== 表单 ===== */
+.form-card .field + .field { margin-top: 20rpx; }
+.field-label {
+  font-size: 28rpx;
+  color: #555555;
+  margin-bottom: 12rpx;
+  display: block;
 }
-.text_3 {
-  margin-left: 15.19rpx;
-  width: 500rpx;
+.input-box {
+  height: 84rpx;
+  border-radius: 12rpx;
+  border: 2rpx solid #ffeaa7;
+  background: #ffffff;
+  padding: 0 20rpx;
+  display: flex;
+  align-items: center;
 }
-.font {
+.input {
+  flex: 1;
+  font-size: 28rpx;
+  color: #1f1f1f;
+}
+.ph { color: #b8b8b8; }
+
+.btn {
+  height: 88rpx;
+  border-radius: 999rpx;
+  margin-top: 24rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 28.54rpx;
-  color: #66666b;
+  font-weight: 600;
 }
-.text_2 {
-  margin-left: 2.44rpx;
-  line-height: 27.45rpx;
-}
-.text_1 {
-  line-height: 27.66rpx;
-}
-.text_4 {
-  margin-left: 4.31rpx;
-  margin-top: 36.64rpx;
-  line-height: 27.6rpx;
-}
-.group_2 {
-  margin-top: 16.39rpx;
-}
-.text-wrapper_2 {
-  padding: 19.13rpx 0 11.68rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  width: 258.75rpx;
-  height: 63.75rpx;
-  border: solid 1.88rpx #ffeaa7;
-}
-.text_5 {
-  margin-left: 17.01rpx;
-  line-height: 29.19rpx;
-}
-.text_6 {
-  margin-left: 20.42rpx;
-  margin-bottom: 26.04rpx;
-  color: #000000;
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 1.63rpx;
-}
-.view {
-  margin-left: 9.58rpx;
-}
-.text-wrapper_3 {
-  margin-left: 2.81rpx;
-  margin-right: 15.94rpx;
-  padding: 26.29rpx 0 21.02rpx;
-  background-color: #ffa400;
-  border-radius: 9.38rpx;
-}
-.font_2 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 28.54rpx;
-  color: #ffa500;
-}
-.text_7 {
+.btn-primary {
+  background: linear-gradient(180deg, #ffa400 0%, #ff8a00 100%);
   color: #ffffff;
-  line-height: 27.69rpx;
+  box-shadow: 0 6rpx 14rpx rgba(255,138,0,0.30);
 }
-.list-item {
-  padding: 44.94rpx 7.14rpx 41.46rpx 29.68rpx;
-  background-color: #ffffff;
-  border-radius: 11.89rpx;
-  border: solid 1.88rpx #ffeaa7;
+
+/* ===== 列表容器 ===== */
+.result-wrap { margin-top: 20rpx; }
+
+/* 顶部行：订单号 + 状态徽标 */
+.topline {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16rpx;
+  margin-bottom: 6rpx;
 }
-.list-item:first-child {
-  margin-top: 0;
+.row-left {
+  display: flex;
+  align-items: baseline;
+  gap: 12rpx;
+  flex-wrap: wrap;
 }
-.text_8 {
-  line-height: 27.66rpx;
+.label { font-size: 26rpx; color: #666666; }
+.mono  { font-size: 28rpx; color: #1f1f1f; }
+
+.badge {
+  height: 40rpx;
+  padding: 0 16rpx;
+  border-radius: 999rpx;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
 }
-.font_3 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 22.76rpx;
-  margin-right: 15rpx;
-  color: #444444;
+.badge-text   { font-size: 22rpx; font-weight: 600; }
+.badge-pending{ background: #fff6e6; color: #ff8d1a; border: 1rpx solid #ffd6b3; }
+.badge-success{ background: #e9fbef; color: #12b05b; border: 1rpx solid #b9f0cf; }
+.badge-default{ background: #f0f0f0; color: #666666; border: 1rpx solid #e6e6e6; }
+
+/* 键值行 */
+.kv {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12rpx 0;
+  border-top: 1rpx dashed #f0f0f0;
 }
-.text_9 {
-  line-height: 28.24rpx;
+.kv:first-of-type { border-top: 0; }
+.kv-key { font-size: 26rpx; color: #666666; }
+.kv-val {
+  font-size: 28rpx;
+  color: #1f1f1f;
+  text-align: right;
+  max-width: 70%;
+  word-break: break-all;
 }
-.font_4 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 28.54rpx;
-  color: #444444;
+.money { color: #ff8a00; font-weight: 700; }
+
+/* 空状态 */
+.empty {
+  padding: 120rpx 0 40rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: #999999;
 }
-.text_10 {
-  margin-right: 15rpx;
-  line-height: 27.84rpx;
-}
-.text_11 {
-  line-height: 27.81rpx;
-}
-.text_12 {
-  margin-right: 15rpx;
-}
-.text_13 {
-  line-height: 28.29rpx;
-}
-.text_24 {
-  margin-right: 15rpx;
-}
-.text_15 {
-  line-height: 28.01rpx;
-}
-.text_16 {
-  margin-right: 15rpx;
-  line-height: 28.09rpx;
-}
-.text_17 {
-  line-height: 28.16rpx;
-}
-.text_18 {
-  margin-right: 15rpx;
-}
-.text_19 {
-  line-height: 28.2rpx;
-}
-.text_20 {
-  margin-right: 15rpx;
-}
-.text_21 {
-  line-height: 28.31rpx;
-}
-.text_23 {
-  margin-right: 15rpx;
-  margin-bottom: 2.04rpx;
-  line-height: 27.79rpx;
-}
+.empty-img { width: 300rpx; height: 300rpx; margin-bottom: 16rpx; }
+.empty-text { font-size: 26rpx; }

pages/loginModule/employeeAccountApply/employeeAccountApply.js

@@ -40,9 +40,12 @@ Page({
 
     // 3. 发送验证码请求
     wx.request({
-      url: baseUrl + '/userInfo/code/pwd',
+      url: baseUrl + '/userInfo/code/register',
       method: 'POST',
-      data: { templateString: phone },
+      data: { 
+        phoneNumber: phone,
+        userRole: 'staff'
+       },
       success: (res) => {
         console.log('验证码发送--->',res.data);
         if (res.data.code === 1) {

pages/loginModule/employeeAccountApply/employeeAccountApply.wxml

@@ -1,104 +1,108 @@
-<view class="flex-col page">
-  <!-- 遮罩层（上传时显示） -->
-  <view wx:if="{{isUploading}}" class="mask">
-    <text class="loading-text">上传中...</text>
+<view class="page">
+
+<!-- 遮罩层（上传时显示） -->
+<view wx:if="{{isUploading}}" class="mask">
+  <text class="loading-text">上传中...</text>
+</view>
+
+<!-- 顶部 Logo / 标题 -->
+<image class="logo" src="/static/logo.jpg" mode="aspectFit" />
+<text class="page-title">员工申请 - 丁香校园</text>
+
+<!-- 主卡片 -->
+<view class="card">
+
+  <!-- 标题 + 须知入口 -->
+  <view class="card-head">
+    <text class="card-title">员工账号申请</text>
+    <view class="head-link" bind:tap="gotoNotice">
+      <text class="head-link-text">员工账号申请须知</text>
+      <image class="head-link-icon" src="./images/right.png" mode="aspectFit" />
+    </view>
   </view>
 
-  <image
-    class="self-center image"
-    src="./images/logo.png"
-  />
-  <text class="self-center text">欢迎登陆—青橙校园</text>
-  <view class="flex-col self-stretch group">
-    <view class="flex-col">
-      <view class="flex-row justify-between group_1">
-        <text class="font text_2">员工账号申请</text>
-        <view class="flex-row items-center group_2" bind:tap="gotoNotice">
-          <image
-            class="shrink-0 image_2 image_3"
-            src="./images/right.png"
-          />
-          <text class="font_2 text_3">员工账号申请须知</text>
-        </view>
-      </view>
-      <view class="flex-col mt-15">
-        <!-- 姓名输入 -->
-        <view class="flex-col justify-start section">
-          <input
-            class="flex-col justify-start items-start text-wrapper view input"
-            placeholder="请输入姓名"
-            maxlength="8"
-            bindinput="onInput"
-            data-field="name"
-            value="{{name}}"
-          />
-        </view>
-        <!-- 手机号输入 -->
-        <view class="flex-col justify-start section_1 mt-21">
-          <input
-            class="flex-col justify-start items-start text-wrapper text-wrapper_1 input_1"
-            placeholder="请输入手机号"
-            maxlength="11"
-            type="number"
-            bindinput="onInput"
-            data-field="phone"
-            value="{{phone}}"
-          />
-        </view>
-        <!-- 验证码输入 + 发送按钮 -->
-        <view class="flex-row items-center section_3 mt-21">
-          <input
-            class="flex-col justify-start items-start text-wrapper_2 view_3 input_2"
-            placeholder="请输入验证码"
-            type="number"
-            bindinput="onInput"
-            data-field="code"
-            value="{{code}}"
-            maxlength="6"
-          />
-          <view
-            class="flex-col justify-start items-center shrink-0 text-wrapper_3 ml-16"
-            bindtap="getSmsCode"
-          >
-            <text class="text_8">
-              {{ codeButtonText }}
-            </text>
-          </view>
-        </view>
-        <!-- 身份证号输入 -->
-        <view class="flex-col justify-start items-start section_2 mt-21">
-          <input
-            class="flex-col justify-start items-start text-wrapper_4 view_4 input_3"
-            placeholder="请输入身份证号"
-            type="idcard"
-            bindinput="onInput"
-            data-field="idcard"
-            maxlength="18"
-            value="{{idcard}}"
-          />
-        </view>
-        <!-- 上传简历 -->
-        <view class="flex-col items-center section_4 mt-21" bindtap="chooseResume">
-          <image
-            class="image_4"
-            src="./images/resume.png"
-          />
-          <text class="{{resumeUploaded?'upload-success-text':'font_2 text_10 mt-12'}}">
-            {{ resumeUploaded ? '简历上传成功！' : '点击上传简历' }}
-          </text>
-        </view>
-        <!-- 提交按钮 -->
-        <view class="flex-col justify-start items-center text-wrapper_5 mt-21" bindtap="handleSubmit">
-          <text class="text_11">提交申请</text>
-        </view>
-      </view>
-    </view>
-    <view class="flex-row justify-center items-center relative group_4 mt-28" bind:tap="gotoQuery">
-      <image
-        class="image_2 pos"
-        src="./images/right.png"
+  <!-- 表单 -->
+  <view class="form">
+
+    <!-- 姓名 -->
+    <view class="field">
+      <input
+        class="field-input"
+        placeholder="请输入姓名"
+        placeholder-class="ph"
+        maxlength="8"
+        bindinput="onInput"
+        data-field="name"
+        value="{{name}}"
       />
-      <text class="font_2 text_12">我的申请记录</text>
     </view>
+
+    <!-- 手机号 -->
+    <view class="field">
+      <input
+        class="field-input"
+        placeholder="请输入手机号"
+        placeholder-class="ph"
+        maxlength="11"
+        type="number"
+        bindinput="onInput"
+        data-field="phone"
+        value="{{phone}}"
+      />
+    </view>
+
+    <!-- 验证码 + 发送 -->
+    <view class="field field-row">
+      <input
+        class="field-input flex-1"
+        placeholder="请输入验证码"
+        placeholder-class="ph"
+        type="number"
+        maxlength="6"
+        bindinput="onInput"
+        data-field="code"
+        value="{{code}}"
+      />
+      <view
+        class="code-btn"
+        bindtap="getSmsCode"
+      >
+        <text class="code-btn-text">{{ codeButtonText }}</text>
+      </view>
+    </view>
+
+    <!-- 身份证号 -->
+    <view class="field">
+      <input
+        class="field-input"
+        placeholder="请输入身份证号"
+        placeholder-class="ph"
+        type="idcard"
+        maxlength="18"
+        bindinput="onInput"
+        data-field="idcard"
+        value="{{idcard}}"
+      />
+    </view>
+
+    <!-- 上传简历 -->
+    <view class="upload-box" bindtap="chooseResume">
+      <image class="upload-icon" src="./images/resume.png" mode="aspectFit" />
+      <text class="{{ resumeUploaded ? 'upload-success-text' : 'upload-tip' }}">{{ resumeUploaded ? '简历上传成功！' : '点击上传简历' }}
+      </text>
+    </view>
+
+    <!-- 提交按钮 -->
+    <view class="btn-primary" bindtap="handleSubmit">
+      <text class="btn-primary-text">提交申请</text>
+    </view>
+
+  </view>
+
+  <!-- 我的申请记录 -->
+  <view class="record" bind:tap="gotoQuery">
+    <text class="record-text">我的申请记录</text>
+    <image class="record-icon" src="./images/right.png" mode="aspectFit" />
   </view>
 </view>
+</view>

pages/loginModule/employeeAccountApply/employeeAccountApply.wxss

@@ -1,205 +1,208 @@
-/* pages/loginModule/employeeAccountApply/employeeAccountApply.wxss */
-.mt-15 {
-  margin-top: 28.13rpx;
-}
-.mt-21 {
-  margin-top: 39.38rpx;
-}
+/* ===== 页面与顶区 ===== */
 .page {
-  padding: 67.5rpx 49.69rpx 84.38rpx 51.56rpx;
-  background-color: #ffffff;
-  width: 100%;
-  height: 100%;
-  position: fixed;
-  bottom: 0;
-  overflow: auto;
-  height: calc(100vh - 1rpx);
+  box-sizing: border-box;
+  min-height: 100vh;
+  padding: 56rpx 32rpx 40rpx;
+  background-image: linear-gradient(180deg, #ffe3c4 0%, #fff 38%);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  position: relative;
 }
-.image {
-  width: 232.5rpx;
-  height: 232.5rpx;
+
+.logo {
+  width: 180rpx;
+  height: 180rpx;
+  border-radius: 24rpx;
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.06);
 }
-.text {
-  margin-top: 35.14rpx;
+
+.page-title {
+  margin-top: 12rpx;
+  font-size: 34rpx;
   color: #1c2023;
-  font-size: 37.5rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 35.21rpx;
+  font-weight: 700;
 }
-.group {
-  margin-top: 62.77rpx;
-}
-.group_1 {
-  padding-left: 2.77rpx;
-}
-.font {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.79rpx;
-  color: #b3b3b3;
-}
-.text_2 {
-  color: #1c2023;
-  line-height: 28.01rpx;
-}
-.group_2 {
-  width: 236.4rpx;
-}
-.image_2 {
-  width: 30rpx;
-  height: 30rpx;
-}
-.image_3 {
-  margin-left: 206.4rpx;
-}
-.font_2 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.3rpx;
-  color: #ff8d1a;
-}
-.text_3 {
-  margin-left: -236.4rpx;
-}
-.section {
-  padding: 20.63rpx 0 18.75rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 11.25rpx #00000040;
-}
-.text-wrapper {
-  margin-left: 16.88rpx;
-  margin-right: 16.88rpx;
-}
-.view {
-  padding: 15.92rpx 0 12.67rpx;
-  background-color: #ffffff00;
-}
-.section_1 {
-  padding: 20.16rpx 0 19.22rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-}
-.text-wrapper_1 {
-  padding: 12.64rpx 0 15.92rpx;
-  background-color: #ffffff00;
-}
-.section_3 {
-  padding: 30.69rpx 16.88rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-}
-.text-wrapper_2 {
-  flex: 1 1 0;
-}
-.view_3 {
-  padding: 16.73rpx 0 11.74rpx;
-  background-color: #ffffff00;
-  height: 56.25rpx;
-}
-.text-wrapper_3 {
-  margin-right: 15rpx;
-  /* padding: 13.16rpx 0 10.93rpx; */
-  background-color: #ff8d1a;
-  border-radius: 9.38rpx;
-  width: 157.5rpx;
-  height: 45rpx;
-}
-.text_8 {
-  color: #ffffff;
-  font-size: 22.5rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 15.91rpx;
-}
-.section_2 {
-  padding: 19.69rpx 0;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-}
-.text-wrapper_4 {
-  margin-left: 16.88rpx;
-}
-.view_4 {
-  padding: 16.86rpx 0 11.46rpx;
-  background-color: #ffffff00;
-  width: 510.63rpx;
-}
-.section_4 {
-  padding: 30.81rpx 0 38.16rpx;
-  background-color: #ff8d1a1a;
-  border-radius: 9.38rpx;
-  border: dotted 1.88rpx #ff8d1a;
-}
-.image_4 {
-  width: 127.5rpx;
-  height: 127.5rpx;
-}
-.text_10 {
-  color: #000000;
-  line-height: 24.23rpx;
-}
-.text-wrapper_5 {
-  padding: 36.43rpx 0 33.58rpx;
-  background-color: #ff8d1a;
-  border-radius: 9.38rpx;
-}
-.text_11 {
-  color: #ffffff;
-  font-size: 30rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 27.49rpx;
-}
-.group_4 {
-  padding: 2.66rpx 0 3rpx;
-}
-.pos {
-  position: absolute;
-  left: 402.19rpx;
-  top: 50%;
-  transform: translateY(-50%);
-}
-.text_12 {
-  line-height: 24.34rpx;
-}
-.input {
-  padding: 15rpx 16.26rpx 13.13rpx 16.26rpx;
-}
-.input_1 {
-  padding: 13.13rpx 16.26rpx 15rpx 16.26rpx;
-}
-.input_2 {
-  padding: 0 16.88rpx;
-}
-.input_3 {
-  padding: 16.88rpx 16.26rpx 11.25rpx 16.26rpx;
-}
-/* 遮罩层 */
+
+/* ===== 遮罩（上传中） ===== */
 .mask {
   position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: rgba(0, 0, 0, 0.5);
-  z-index: 9999;
+  inset: 0;
+  background: rgba(0,0,0,0.35);
+  backdrop-filter: blur(2rpx);
+  z-index: 99;
   display: flex;
-  justify-content: center;
   align-items: center;
+  justify-content: center;
 }
-
-/* 加载中文本 */
 .loading-text {
-  color: #ffffff;
-  font-size: 34rpx;
-  font-family: AlibabaPuHuiTi;
+  padding: 20rpx 28rpx;
+  background: #000000cc;
+  color: #fff;
+  border-radius: 16rpx;
+  font-size: 28rpx;
 }
 
-/* 上传成功文字样式 */
-.upload-success-text {
+/* ===== 主卡片 ===== */
+.card {
+  width: 100%;
+  margin-top: 24rpx;
+  background: #fff;
+  border-radius: 24rpx;
+  box-shadow: 0 12rpx 36rpx rgba(0,0,0,0.08);
+  padding: 24rpx 24rpx 16rpx;
+}
+
+.card-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-bottom: 12rpx;
+  border-bottom: 1rpx solid #f1f1f1;
+}
+
+.card-title {
   font-size: 30rpx;
-  font-weight: bold;
+  font-weight: 700;
+  color: #1c2023;
+}
+
+/* 须知入口 */
+.head-link {
+  display: flex;
+  align-items: center;
+  gap: 8rpx;
+}
+.head-link-icon {
+  width: 28rpx;
+  height: 28rpx;
+}
+.head-link-text {
+  font-size: 26rpx;
   color: #ff8d1a;
 }
+
+/* ===== 表单 ===== */
+.form { padding-top: 16rpx; }
+
+.field {
+  background: #fff;
+  border: 1rpx solid #e9e9ec;
+  border-radius: 16rpx;
+  padding: 18rpx 22rpx;
+  box-shadow: 0 6rpx 16rpx rgba(0,0,0,0.04);
+  margin-top: 18rpx;
+}
+.field:focus-within {
+  border-color: #ff8d1a;
+  box-shadow: 0 10rpx 24rpx rgba(255,141,26,0.14);
+}
+
+.field-input {
+  width: 100%;
+  font-size: 30rpx;
+  color: #1c2023;
+  line-height: 44rpx;
+}
+.ph { color: #9aa0a6; }
+
+/* 验证码行 */
+.field-row {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+  padding-right: 16rpx;
+}
+.flex-1 { flex: 1; }
+
+.code-btn {
+  height: 44rpx;
+  padding: 0 22rpx;
+  background: #ff8d1a;
+  border-radius: 12rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  white-space: nowrap;
+  box-shadow: 0 8rpx 18rpx rgba(255,141,26,0.25);
+  transition: transform .08s ease-in-out, opacity .2s;
+}
+.code-btn:active { transform: scale(0.98); }
+.code-btn-text {
+  color: #fff;
+  font-size: 24rpx;
+  font-weight: 600;
+}
+
+/* ===== 上传简历 ===== */
+.upload-box {
+  margin-top: 18rpx;
+  border: 1rpx dashed #ffb66a;
+  background: #fffaf4;
+  border-radius: 16rpx;
+  padding: 28rpx 22rpx;
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+  transition: transform .06s ease-in-out, background .2s;
+}
+.upload-box:active { transform: scale(0.992); }
+.upload-icon {
+  width: 56rpx;
+  height: 56rpx;
+}
+.upload-tip {
+  font-size: 26rpx;
+  color: #666a73;
+}
+.upload-success-text {
+  font-size: 26rpx;
+  color: #13b26b;
+  font-weight: 600;
+}
+
+/* ===== 提交按钮 ===== */
+.btn-primary {
+  margin-top: 22rpx;
+  height: 96rpx;
+  border-radius: 48rpx; /* 胶囊 */
+  background: linear-gradient(180deg, #ff9a2d 0%, #ff8d1a 100%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 14rpx 28rpx rgba(255,141,26,0.28);
+  transition: transform .06s ease-in-out;
+}
+.btn-primary:active { transform: scale(0.985); }
+.btn-primary-text {
+  color: #ffffff;
+  font-size: 32rpx;
+  font-weight: 700;
+}
+
+/* ===== 记录入口 ===== */
+.record {
+  margin-top: 12rpx;
+  padding: 16rpx 8rpx 4rpx;
+  display: flex;
+  align-items: center;
+  gap: 10rpx;
+  justify-content: center;
+}
+.record-icon { width: 28rpx; height: 28rpx; }
+.record-text { font-size: 26rpx; color: #1c2023; }
+
+/* ===== 复用的工具类（与原项目兼容） ===== */
+.flex-col { display: flex; flex-direction: column; }
+.flex-row { display: flex; flex-direction: row; }
+.items-center { align-items: center; }
+.justify-between { justify-content: space-between; }
+.justify-center { justify-content: center; }
+.self-center { align-self: center; }
+.self-stretch { align-self: stretch; }
+.relative { position: relative; }
+.shrink-0 { flex-shrink: 0; }
+.mt-15 { margin-top: 30rpx; }
+.mt-21 { margin-top: 42rpx; }
+.mt-28 { margin-top: 56rpx; }
+.ml-16 { margin-left: 32rpx; }

pages/loginModule/employeeAccountNotice/employeeAccountNotice.js

@@ -1,18 +1,36 @@
-// pages/loginModule/employeeAccountNotice/employeeAccountNotice.js
+import { baseUrl } from "../../../request";
+import { decodeBase64 } from "../../../utils/decodebase64";
+
 Page({
 
   /**
    * 页面的初始数据
    */
   data: {
-
+    applyDesc: '',
   },
 
   /**
    * 生命周期函数--监听页面加载
    */
-  onLoad(options) {
-
+  getApplyDesc() {
+    wx.request({
+      url: baseUrl + '/userInfo/query/applyNotice',
+      method: 'POST',
+      success: res => {
+        if (res.data.code === 1) {
+          this.setData({ applyDesc: decodeBase64(res.data.data) })
+        } else {
+          wx.showToast({ title: res.data.message, icon: 'none' });
+        }
+      },
+      fail: () => {
+        wx.showToast({ title: '网络错误', icon: 'none' });
+      }
+    })
+  },
+  onLoad() {
+    this.getApplyDesc()
   },
 
   /**

pages/loginModule/employeeAccountNotice/employeeAccountNotice.wxml

@@ -1,5 +1,5 @@
 <!--pages/loginModule/employeeAccountNotice/employeeAccountNotice.wxml-->
 <view class="flex-col page">
   <text class="self-center text">员工账号申请须知</text>
-  <rich-text class="section view mt-20"></rich-text>
+  <rich-text nodes="{{ applyDesc }}" class="section view mt-20"></rich-text>
 </view>

pages/loginModule/employeeAccountNotice/employeeAccountNotice.wxss

@@ -1,15 +1,15 @@
 /* pages/loginModule/employeeAccountNotice/employeeAccountNotice.wxss */
 .page {
-  padding: 65.08rpx 42.19rpx 145.31rpx 44.06rpx;
+  padding: 65.08rpx 42.19rpx 150rpx 44.06rpx;
   background-color: #ffffff;
   width: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
+  overflow: auto;
   height: 100%;
 }
 .text {
   color: #000000;
   font-size: 33.75rpx;
+  font-weight: bold;
   font-family: SourceHanSansCN;
   line-height: 31.26rpx;
 }
@@ -18,6 +18,10 @@
 }
 .view {
   background-color: #ffffff;
-  height: 1301.25rpx;
-  border: solid 1.88rpx #000000;
+}
+
+::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  background: transparent;
 }

pages/loginModule/employeeApplyQuery/employeeApplyQuery.wxss

@@ -43,6 +43,7 @@
 .text {
   color: #919191;
   line-height: 27.75rpx;
+  width: 90%;
 }
 .section_2 {
   padding: 33.75rpx 28.13rpx 35.63rpx;

pages/loginModule/forgetPwd/forgetPwd.js

@@ -40,7 +40,7 @@ Page({
 
   // 发送验证码
   getSmsCode() {
-    const { phone } = this.data;
+    const { phone, role } = this.data;
     // 1. 非空
     if (!validate(this.data, { phone: '请输入手机号' })) return;
     // 2. 格式
@@ -51,7 +51,7 @@ Page({
     wx.request({
       url: baseUrl + '/userInfo/code/pwd',
       method: 'POST',
-      data: { templateString: phone },
+      data: { phoneNumber: phone, userRole: role },
       success: (res) => {
         if (res.data.code === 1) {
           wx.showToast({ title: '验证码已发送', icon: 'none' });

pages/loginModule/forgetPwd/forgetPwd.wxml

@@ -1,18 +1,21 @@
-<view class="flex-col page">
-  <image
-    class="self-center image"
-    src="./images/logo.png"
-  />
-  <text class="self-center text">欢迎登陆—青橙校园</text>
+<view class="page">
 
-  <view class="flex-col self-stretch group">
-    <text class="self-start font text_2">忘记密码</text>
+<!-- 顶部 Logo 与标题 -->
+<image class="logo" src="/static/logo.jpg" mode="aspectFit" />
+<text class="page-title">欢迎登录 — 丁香校园</text>
+
+<!-- 重置密码卡片 -->
+<view class="card">
+  <text class="card-title">忘记密码</text>
+
+  <view class="form">
 
     <!-- 手机号 -->
-    <view class="flex-col justify-start self-stretch relative section mt-20">
+    <view class="field">
       <input
-        class="flex-col justify-start items-start text-wrapper view input"
+        class="field-input"
         placeholder="请输入手机号"
+        placeholder-class="ph"
         maxlength="11"
         type="number"
         model:value="{{phone}}"
@@ -20,58 +23,55 @@
       />
     </view>
 
-    <view class="flex-col self-stretch group_2 mt-20">
-      <!-- 验证码 + 发送 -->
-      <view class="flex-row items-center self-stretch relative section_2">
-        <input
-          class="flex-col justify-start items-start text-wrapper_2 view_2 input_1"
-          placeholder="请输入验证码"
-          maxlength="6"
-          type="number"
-          model:value="{{code}}"
-          bindinput="onCodeInput"
-        />
-        <text
-          class="flex-col justify-start items-center shrink-0 text-wrapper_3 ml-12 text_6 send-code {{ countdown>0 ? 'disabled' : '' }}"
-          bindtap="{{ countdown>0 ? '' : 'getSmsCode' }}"
-        >{{ codeButtonText }}</text>
-      </view>
-
-      <!-- 新密码 -->
-      <view class="flex-col justify-start self-stretch relative section_1 mt-22">
-        <input
-          class="flex-col justify-start items-start text-wrapper text-wrapper_1 input_2"
-          placeholder="请输入密码"
-          password="true"
-          model:value="{{newPwd}}"
-          bindinput="onNewPwdInput"
-        />
-      </view>
-
-      <!-- 确认密码 -->
-      <view class="flex-col justify-start self-stretch relative section_3 mt-22">
-        <input
-          class="flex-col justify-start items-start text-wrapper text-wrapper_5 input_3"
-          placeholder="请再次输入密码"
-          password="true"
-          model:value="{{confirmPwd}}"
-          bindinput="onConfirmPwdInput"
-        />
-      </view>
-
-      <!-- 登录账号 -->
+    <!-- 验证码 + 发送 -->
+    <view class="field field-row">
+      <input
+        class="field-input flex-1"
+        placeholder="请输入验证码"
+        placeholder-class="ph"
+        maxlength="6"
+        type="number"
+        model:value="{{code}}"
+        bindinput="onCodeInput"
+      />
       <text
-        class="self-end text_9 mt-22 link"
-        bindtap="gotoLogin"
-      >登录账号</text>
+        class="code-btn {{ countdown>0 ? 'disabled' : '' }}"
+        bindtap="{{ countdown>0 ? '' : 'getSmsCode' }}"
+      >{{ codeButtonText }}
+      </text>
+    </view>
 
-      <!-- 重置密码 按钮 -->
-      <view
-        class="flex-col justify-start items-center self-stretch text-wrapper_4 mt-22 reset-button"
-        bindtap="resetPassword"
-      >
-        <text class="text_10">重置密码</text>
-      </view>
+    <!-- 新密码 -->
+    <view class="field">
+      <input
+        class="field-input"
+        placeholder="请输入密码"
+        placeholder-class="ph"
+        password="true"
+        model:value="{{newPwd}}"
+        bindinput="onNewPwdInput"
+      />
+    </view>
+
+    <!-- 确认密码 -->
+    <view class="field field-last">
+      <input
+        class="field-input"
+        placeholder="请再次输入密码"
+        placeholder-class="ph"
+        password="true"
+        model:value="{{confirmPwd}}"
+        bindinput="onConfirmPwdInput"
+      />
+    </view>
+
+    <!-- 登录账号 -->
+    <text class="link-right" bindtap="gotoLogin">登录账号</text>
+
+    <!-- 重置密码 按钮 -->
+    <view class="btn-primary reset-button" bindtap="resetPassword">
+      <text class="btn-primary-text">重置密码</text>
     </view>
   </view>
 </view>
+</view>

pages/loginModule/forgetPwd/forgetPwd.wxss

@@ -1,131 +1,141 @@
+/* ===== 页面基础 ===== */
 .page {
-  padding: 86.25rpx 46.2rpx 326.25rpx 49.89rpx;
-  background-color: #ffffff;
+  box-sizing: border-box;
+  min-height: 100vh;
+  padding: 64rpx 32rpx 48rpx;
+  background: #ffffff;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.logo {
+  width: 200rpx;
+  height: 200rpx;
+  border-radius: 24rpx;
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.06);
+}
+
+.page-title {
+  margin-top: 16rpx;
+  font-size: 36rpx;
+  color: #1c2023;
+  font-weight: 700;
+}
+
+/* ===== 卡片容器 ===== */
+.card {
   width: 100%;
-  overflow: hidden;
-  height: 100%;
+  margin-top: 28rpx;
+  background: #fff;
+  border-radius: 24rpx;
+  box-shadow: 0 10rpx 28rpx rgba(0,0,0,0.06);
+  padding: 28rpx;
 }
-.image {
-  width: 232.5rpx;
-  height: 232.5rpx;
-}
-.text {
-  margin-top: 37.8rpx;
+
+.card-title {
+  font-size: 32rpx;
   color: #1c2023;
-  font-size: 37.5rpx;
-  font-family: SourceHanSansCN;
-  line-height: 35.18rpx;
+  font-weight: 700;
+  padding-bottom: 12rpx;
+  border-bottom: 1rpx solid #f1f1f1;
 }
-.group {
-  margin-top: 86.14rpx;
+
+/* ===== 表单 ===== */
+.form { padding-top: 20rpx; }
+
+.field {
+  background: #fff;
+  border: 1rpx solid #e9e9ec;
+  border-radius: 16rpx;
+  padding: 20rpx 24rpx;
+  box-shadow: 0 6rpx 16rpx rgba(0,0,0,0.04);
+  margin-top: 18rpx;
 }
-.font {
+.field:focus-within {
+  border-color: #ff8d1a;
+  box-shadow: 0 8rpx 24rpx rgba(255,141,26,0.12);
+}
+
+.field-input {
+  width: 100%;
   font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.79rpx;
-  color: #b3b3b3;
-}
-.text_2 {
   color: #1c2023;
-  line-height: 28.09rpx;
+  line-height: 44rpx;
 }
-.section {
-  margin-left: 2.61rpx;
-  margin-right: 4.42rpx;
-  padding: 20.63rpx 0 18.75rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 11.25rpx #00000040;
+.ph { color: #9aa0a6; }
+
+/* 输入 + 发送验证码 并排 */
+.field-row {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+  padding-right: 16rpx;
 }
-.text-wrapper {
-  margin-left: 16.88rpx;
-  margin-right: 16.88rpx;
+.flex-1 { flex: 1; }
+
+.field-last {
+  margin-bottom: 26rpx;
 }
-.view {
-  padding: 15.92rpx 0 12.64rpx;
-  background-color: #ffffff00;
+
+/* ===== 发送验证码按钮（用 text 作为按钮） ===== */
+.code-btn {
+  height: 44rpx;
+  padding: 0 24rpx;
+  background: #ff8d1a;
+  border-radius: 14rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  white-space: nowrap;
+  box-shadow: 0 8rpx 18rpx rgba(255,141,26,0.25);
+  color: #fff;
+  font-size: 24rpx;
+  font-weight: 600;
+  transition: transform .08s ease-in-out, opacity .2s;
 }
-.group_2 {
-  padding-left: 2.61rpx;
+.code-btn:active { transform: scale(0.98); }
+.code-btn.disabled {
+  opacity: 0.55;
+  box-shadow: none;
 }
-.section_2 {
-  margin-right: 4.42rpx;
-  padding: 25.16rpx 16.88rpx 24.22rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
+
+/* ===== 右侧链接 ===== */
+.link-right {
+  margin-top: 14rpx;
+  font-size: 26rpx;
+  color: #666a73;
+  align-self: flex-end;
 }
-.text-wrapper_2 {
-  flex: 1 1 0;
+
+/* ===== 主按钮 ===== */
+.btn-primary {
+  margin-top: 28rpx;
+  height: 96rpx;
+  border-radius: 18rpx;
+  background: linear-gradient(180deg, #ff9a2d 0%, #ff8d1a 100%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 14rpx 28rpx rgba(255,141,26,0.28);
+  transition: transform .06s ease-in-out;
 }
-.view_2 {
-  padding: 12.51rpx 0 15.96rpx;
-  background-color: #ffffff00;
-  height: 66.25rpx;
-}
-.text-wrapper_3 {
-  margin-right: 18.77rpx;
-  padding: 13.16rpx 0 10.93rpx;
-  background-color: #ff8d1a;
-  border-radius: 9.38rpx;
-  width: 157.5rpx;
-  height: 45rpx;
-}
-.text_6 {
+.btn-primary:active { transform: scale(0.985); }
+.btn-primary-text {
   color: #ffffff;
-  font-size: 22.5rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 20.91rpx;
+  font-size: 32rpx;
+  font-weight: 700;
 }
-.section_1 {
-  margin-right: 4.42rpx;
-  padding: 21.56rpx 0 17.81rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-}
-.text-wrapper_1 {
-  padding: 13.84rpx 0 14.55rpx;
-  background-color: #ffffff00;
-}
-.section_3 {
-  margin-right: 4.42rpx;
-  padding: 19.22rpx 0 20.16rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-}
-.text-wrapper_5 {
-  padding: 13.37rpx 0 14.87rpx;
-  background-color: #ffffff00;
-}
-.text_9 {
-  color: #1c2023;
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.23rpx;
-}
-.text-wrapper_4 {
-  margin-right: 4.42rpx;
-  padding: 36.04rpx 0 34.01rpx;
-  background-color: #ff8d1a;
-  border-radius: 9.38rpx;
-}
-.text_10 {
-  color: #ffffff;
-  font-size: 30rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 27.45rpx;
-}
-.input {
-  padding: 15rpx 16.26rpx 13.13rpx 16.26rpx;
-}
-.input_1 {
-  padding: 13.13rpx 16.26rpx 16.88rpx 16.26rpx;
-}
-.input_2 {
-  padding: 13.13rpx 16.26rpx 15rpx 16.26rpx;
-}
-.input_3 {
-  padding: 13.13rpx 16.26rpx 15rpx 16.26rpx;
-}
+
+/* ===== 可选：保留一些你原先可能依赖的工具类，避免其它页面受影响 ===== */
+.flex-col { display: flex; flex-direction: column; }
+.flex-row { display: flex; flex-direction: row; }
+.items-center { align-items: center; }
+.self-center { align-self: center; }
+.self-stretch { align-self: stretch; }
+.self-start { align-self: flex-start; }
+.relative { position: relative; }
+.shrink-0 { flex-shrink: 0; }
+.mt-20 { margin-top: 40rpx; }
+.mt-22 { margin-top: 44rpx; }
+.ml-12 { margin-left: 24rpx; }

pages/loginModule/pwdLogin/pwdLogin.wxml

@@ -1,106 +1,113 @@
-<view class="flex-col page">
-  <image class="self-center image" src="./images/logo.png" />
+<view class="page">
 
-  <view class="flex-col items-center self-stretch group">
-    <!-- 加上 bold-text -->
-    <text class="font text bold-text">欢迎登陆—青橙校园</text>
-    <text class="font mt-12">（{{ showRole }}端）</text>
+<!-- 顶部 Logo -->
+<image class="logo" src="/static/logo.jpg" mode="aspectFit" />
+
+<!-- 标题与角色 -->
+<view class="title-wrap">
+  <text class="title bold-text">欢迎登录 — 丁香校园</text>
+  <text class="subtitle">（{{ showRole }}端）</text>
+</view>
+
+<!-- 登录卡片 -->
+<view class="card">
+
+  <!-- 登录方式切换 -->
+  <view class="tabs">
+    <text
+      class="tab {{loginType==='password' ? 'active' : ''}}"
+      bindtap="switchToPassword"
+    >密码登录</text>
+
+    <text
+      class="tab {{loginType==='sms' ? 'active' : ''}}"
+      bindtap="switchToSms"
+      wx:if="{{ role === 'user' }}"
+    >验证码登录</text>
   </view>
 
-  <view class="flex-col self-stretch group_2">
-    <view class="flex-row">
-      <!-- 密码登录 -->
-      <text
-        class="font_2 toggle-text {{loginType==='password'?'active':''}}"
-        bindtap="switchToPassword"
-      >密码登录</text>
+  <!-- 表单 -->
+  <view class="form">
 
-      <!-- 验证码登录 -->
-      <text
-        class="font_2 ml-8 toggle-text {{loginType==='sms'?'active':''}}"
-        bindtap="switchToSms" wx:if="{{ role === 'user' }}"
-      >验证码登录</text>
+    <!-- 手机号 -->
+    <view class="field">
+      <input
+        class="field-input"
+        placeholder="请输入手机号"
+        placeholder-class="ph"
+        value="{{phone}}"
+        bindinput="onPhoneInput"
+        maxlength="11"
+        type="number"
+      />
     </view>
 
-    <view class="flex-col group_1 mt-20">
-      <!-- 手机号 输入框，保持原 .text-wrapper 样式 -->
-      <view class="flex-col self-stretch">
-        <view class="flex-col justify-start relative section">
-          <input
-            class="text-wrapper"
-            placeholder="请输入手机号"
-            value="{{phone}}"
-            bindinput="onPhoneInput"
-            maxlength="11"
-            type="number"
-          />
-        </view>
-      </view>
-
-      <!-- 密码/验证码 输入框，保持原 .text-wrapper_2 样式 -->
-      <view class="flex-row items-center section_2 mt-21">
-        <input
-          class="text-wrapper"
-          placeholder="{{ loginType==='password' ? '请输入密码' : '请输入验证码' }}"
-          value="{{credential}}"
-          bindinput="onCredentialInput"
-          password="{{ loginType==='password' }}"
-          type="{{ loginType==='sms' ? 'number' : 'text' }}"
-        />
-
-        <!-- 仅验证码登录时显示倒计时按钮 -->
-        <view 
-          class="flex-col justify-start items-center shrink-0 text-wrapper_3 ml-2" 
-          bindtap="getSmsCode" 
-          wx:if="{{ loginType==='sms' }}"
-        >
-          <text class="text_6">{{ codeButtonText }}</text>
-        </view>
-      </view>
-
-      <!-- 忘记密码，仅密码登录时显示 -->
-      <text 
-        class="self-end font_4 text_7" 
-        bindtap="gotoForgetPwd" 
-        wx:if="{{ loginType==='password' }}"
-      >忘记密码</text>
-
-      <!-- 登录按钮 -->
-      <view 
-        class="flex-col justify-start items-center self-stretch text-wrapper_4" 
-        bindtap="onLogin"
+    <!-- 密码 / 验证码 -->
+    <view class="field field-row">
+      <input
+        class="field-input flex-1"
+        placeholder="{{ loginType==='password' ? '请输入密码' : '请输入验证码' }}"
+        placeholder-class="ph"
+        value="{{credential}}"
+        bindinput="onCredentialInput"
+        password="{{ loginType==='password' }}"
+        type="{{ loginType==='sms' ? 'number' : 'text' }}"
+      />
+      <!-- 验证码按钮（仅验证码登录显示） -->
+      <view
+        class="code-btn"
+        bindtap="getSmsCode"
+        wx:if="{{ loginType==='sms' }}"
       >
-        <text class="text_8">登录</text>
-      </view>
-
-      <!-- 协议勾选 -->
-      <view class="flex-row items-center self-stretch group_3">
-        <checkbox-group bindchange="onAgreeChange">
-          <checkbox
-            class="checkbox"
-            value="agree"
-            checked="{{ isAgree }}"
-            color="#FF8D1A"
-          />
-        </checkbox-group>
-        <view class="group_4 ml-12">
-          <text class="font_5 text_9">登录代表您已同意</text>
-          <text class="font_5" bindtap="gotoAgreement">《用户协议》</text>
-          <text class="text_10">&</text>
-          <text class="font_5" bindtap="gotoPolicy">《隐私协议》</text>
-        </view>
-      </view>
-
-      <!-- 去注册 -->
-      <view class="self-center group_5" wx:if="{{isShowRegister}}">
-        <text class="font_4 text_11">没有账号？</text>
-        <text class="font_5 text_12" bindtap="gotoRegister">去注册→</text>
+        <text class="code-btn-text">{{ codeButtonText }}</text>
       </view>
     </view>
-  </view>
 
-  <view class="flex-row justify-evenly items-center self-end section_3" bind:tap="joinUs" wx:if="{{ role === 'user' }}">
-    <text class="font_2 text_13">加入我们</text>
-    <image class="image_3" src="./images/joinus.png" />
+    <!-- 忘记密码（仅密码登录） -->
+    <text
+      class="link-right"
+      bindtap="gotoForgetPwd"
+      wx:if="{{ loginType==='password' }}"
+    >忘记密码</text>
+
+    <!-- 登录按钮 -->
+    <view
+      class="btn-primary"
+      bindtap="onLogin"
+    >
+      <text class="btn-primary-text">登录</text>
+    </view>
+
+    <!-- 协议 -->
+    <view class="agreements">
+      <checkbox-group bindchange="onAgreeChange">
+        <checkbox
+          class="checkbox"
+          value="agree"
+          checked="{{ isAgree }}"
+          color="#FF8D1A"
+        />
+      </checkbox-group>
+      <view class="agreements-text">
+        <text class="muted">登录代表您已同意</text>
+        <text class="link" bindtap="gotoAgreement">《用户协议》</text>
+        <text class="muted">&</text>
+        <text class="link" bindtap="gotoPolicy">《隐私协议》</text>
+      </view>
+    </view>
+
+    <!-- 去注册 -->
+    <view class="register" wx:if="{{isShowRegister}}">
+      <text class="muted">没有账号？</text>
+      <text class="link-strong" bindtap="gotoRegister">去注册 →</text>
+    </view>
   </view>
 </view>
+
+<!-- 加入我们（仅 user 端） -->
+<view class="cta-join" bind:tap="joinUs" wx:if="{{ role === 'user' }}">
+  <text class="cta-join-text">加入我们</text>
+  <image class="cta-join-img" src="./images/joinus.png" mode="aspectFit" />
+</view>
+
+</view>

pages/loginModule/pwdLogin/pwdLogin.wxss

@@ -1,190 +1,241 @@
-.mt-21 {
-  margin-top: 39.38rpx;
-}
+/* ========== 基础 ========== */
 .page {
-  padding: 105rpx 36.56rpx 40.31rpx 49.76rpx;
+  box-sizing: border-box;
+  padding: 72rpx 32rpx 48rpx;
   background-color: #ffffff;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.logo {
+  width: 220rpx;
+  height: 220rpx;
+  border-radius: 24rpx;
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.06);
+}
+
+.title-wrap {
+  margin-top: 24rpx;
+  align-items: center;
+  text-align: center;
+}
+
+.title {
+  font-size: 40rpx;
+  line-height: 1.2;
+  color: #1c2023;
+}
+
+.subtitle {
+  margin-top: 12rpx;
+  font-size: 28rpx;
+  color: #666a73;
+}
+
+.bold-text { font-weight: 700; }
+
+/* ========== 卡片容器 ========== */
+.card {
   width: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
-  height: 100%;
-}
-.image {
-  width: 232.5rpx;
-  height: 232.5rpx;
-}
-.group {
-  margin-top: 35.14rpx;
-}
-.font {
-  font-size: 37.5rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 34.73rpx;
-  color: #1c2023;
-}
-.text {
-  line-height: 35.21rpx;
-}
-.group_2 {
-  margin-top: 87.15rpx;
-}
-.font_2 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.69rpx;
-  color: #1c2023;
-}
-.text_2 {
-  line-height: 28.29rpx;
-}
-.text_3 {
-  line-height: 28.2rpx;
-}
-.group_1 {
-  padding-left: 2.74rpx;
-  padding-right: 2.74rpx;
-}
-.section {
-  margin-right: 11.32rpx;
-  padding: 20.63rpx 16.88rpx 18.75rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 11.25rpx #00000040;
-}
-.text-wrapper {
-  margin-left: 16.88rpx;
-  margin-right: 16.88rpx;
-  padding: 15.92rpx 0 12.64rpx;
-  background-color: #ffffff00;
-  margin-right: 100rpx;
-}
-.font_3 {
-  font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.69rpx;
-  color: #b3b3b3;
-}
-.text_4 {
-  margin-left: 16.26rpx;
-}
-.section_2 {
-  margin-right: 11.32rpx;
-  padding: 20.63rpx 16.88rpx 18.75rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
-}
-.text_5 {
-  margin-left: 16.26rpx;
-  line-height: 27.86rpx;
-}
-.text-wrapper_3 {
-  margin-right: 5.63rpx;
-  padding: 13.16rpx 0 10.93rpx;
-  background-color: #ff8d1a;
-  border-radius: 9.38rpx;
-  width: 157.5rpx;
-  height: 45rpx;
-}
-.text_6 {
-  color: #ffffff;
-  font-size: 22.5rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 20.91rpx;
-}
-.font_4 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.49rpx;
-  color: #383838;
-}
-.text_7 {
-  margin-right: 6.39rpx;
-  margin-top: 28.76rpx;
-  line-height: 24.36rpx;
-}
-.text-wrapper_4 {
-  margin-right: 11.32rpx;
-  margin-top: 46.26rpx;
-  padding: 36.73rpx 0 34.16rpx;
-  background-color: #ff8d1a;
-  border-radius: 9.38rpx;
-}
-.text_8 {
-  color: #ffffff;
-  font-size: 30rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 26.61rpx;
-}
-.group_3 {
-  margin-top: 48.75rpx;
-}
-.image_2 {
-  flex-shrink: 0;
-}
-.image_1 {
-  width: 37.5rpx;
-  height: 37.5rpx;
-}
-.group_4 {
-  line-height: 24.49rpx;
-  height: 24.56rpx;
-}
-.font_5 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.49rpx;
-  color: #ff5e00;
-}
-.text_9 {
-  color: #1c2023;
-  line-height: 24.43rpx;
-}
-.text_10 {
-  color: #1c2023;
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 19.93rpx;
-}
-.group_5 {
-  margin-top: 43.91rpx;
-  line-height: 24.41rpx;
-}
-.text_11 {
-  line-height: 24.28rpx;
-}
-.text_12 {
-  line-height: 24.41rpx;
-}
-.section_3 {
-  margin-top: 100.11rpx;
-  padding: 12.06rpx 21.69rpx 12.32rpx 24.15rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  width: 215.63rpx;
-  border: solid 1.88rpx #ff8d1a;
-}
-.text_13 {
-  color: #ff8d1a;
-  line-height: 27.66rpx;
-}
-.image_3 {
-  width: 41.25rpx;
-  height: 41.25rpx;
+  margin-top: 32rpx;
+  background: #fff;
+  border-radius: 24rpx;
+  box-shadow: 0 10rpx 28rpx rgba(0,0,0,0.06);
+  padding: 28rpx;
 }
 
-/* 欢迎文本加粗 */
-.bold-text {
-  font-weight: bold;
+/* ========== 标签切换 ========== */
+.tabs {
+  display: flex;
+  align-items: center;
+  gap: 32rpx;
+  padding: 8rpx 4rpx 20rpx;
+  border-bottom: 1rpx solid #f1f1f1;
 }
 
-/* 切换按钮默认样式，保持原 font_2 大小；active 时放大加粗 */
-.toggle-text {
-  font-size: 28rpx; 
-  font-weight: normal;
-  transition: font-size 0.2s;
+.tab {
+  font-size: 28rpx;
+  color: #666a73;
+  padding: 8rpx 6rpx;
+  position: relative;
+  transition: color .2s, transform .2s;
 }
-.toggle-text.active {
-  font-size: 36rpx;
-  font-weight: bold;
+
+.tab.active {
+  color: #1c2023;
+  font-weight: 700;
+  transform: translateY(-1rpx);
 }
+
+.tab.active::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: -12rpx;
+  height: 6rpx;
+  background: #ff8d1a;
+  border-radius: 6rpx;
+}
+
+/* ========== 表单区 ========== */
+.form { padding-top: 24rpx; }
+
+.field {
+  background: #fff;
+  border: 1rpx solid #e9e9ec;
+  border-radius: 16rpx;
+  padding: 20rpx 24rpx;
+  box-shadow: 0 6rpx 16rpx rgba(0,0,0,0.04);
+  margin-top: 20rpx;
+}
+
+.field-input {
+  width: 100%;
+  font-size: 30rpx;
+  color: #1c2023;
+  line-height: 44rpx;
+}
+
+.field-input:focus {
+  outline: none;
+  border: none;
+}
+
+.field:focus-within {
+  border-color: #ff8d1a;
+  box-shadow: 0 8rpx 24rpx rgba(255,141,26,0.12);
+}
+
+.ph { color: #9aa0a6; }
+
+/* 输入+验证码并排 */
+.field-row {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+  padding-right: 16rpx;
+  margin-bottom: 26rpx;
+}
+
+.flex-1 { flex: 1; }
+
+/* 验证码按钮 */
+.code-btn {
+  height: 44rpx;
+  padding: 0 24rpx;
+  background: #ff8d1a;
+  border-radius: 14rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  white-space: nowrap;
+  box-shadow: 0 8rpx 18rpx rgba(255,141,26,0.25);
+  active-opacity: 0.85;
+}
+
+.code-btn:active { transform: scale(0.98); }
+
+.code-btn-text {
+  color: #fff;
+  font-size: 24rpx;
+  font-weight: 600;
+}
+
+/* 忘记密码链接 */
+.link-right {
+  margin-top: 16rpx;
+  font-size: 26rpx;
+  color: #666a73;
+  align-self: flex-end;
+}
+
+/* 登录按钮 */
+.btn-primary {
+  margin-top: 32rpx;
+  height: 96rpx;
+  border-radius: 18rpx;
+  background: linear-gradient(180deg, #ff9a2d 0%, #ff8d1a 100%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 14rpx 28rpx rgba(255,141,26,0.28);
+  transition: transform .06s ease-in-out;
+}
+
+.btn-primary:active { transform: scale(0.985); }
+
+.btn-primary-text {
+  color: #ffffff;
+  font-size: 32rpx;
+  font-weight: 700;
+}
+
+/* 协议区 */
+.agreements {
+  margin-top: 28rpx;
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+}
+
+.checkbox { transform: scale(0.92); }
+
+.agreements-text {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 8rpx;
+  line-height: 1.4;
+}
+
+.muted { color: #666a73; font-size: 26rpx; }
+.link { color: #ff5e00; font-size: 26rpx; }
+.link-strong { color: #ff5e00; font-size: 28rpx; font-weight: 700; }
+
+/* 注册区 */
+.register {
+  margin-top: 24rpx;
+  text-align: center;
+  display: flex;
+  justify-content: center;
+  gap: 8rpx;
+}
+
+/* 加入我们 CTA */
+.cta-join {
+  margin-top: 48rpx;
+  padding: 16rpx 22rpx;
+  border: 1rpx solid #ff8d1a;
+  border-radius: 14rpx;
+  display: flex;
+  align-items: center;
+  gap: 12rpx;
+}
+
+.cta-join-text { color: #ff8d1a; font-size: 28rpx; }
+.cta-join-img { width: 44rpx; height: 44rpx; }
+
+/* ========== 兼容你原先用到的类名（可选保留） ========== */
+.font { font-size: 37.5rpx; color: #1c2023; }
+.font_2 { font-size: 30rpx; color: #1c2023; }
+.font_4 { font-size: 26rpx; color: #383838; }
+.font_5 { font-size: 26rpx; color: #ff5e00; }
+
+.toggle-text { font-size: 28rpx; transition: font-size .2s; }
+.toggle-text.active { font-size: 36rpx; font-weight: 700; }
+
+/* 简易工具类（若你全局已有可删除） */
+.items-center { align-items: center; }
+.self-center { align-self: center; }
+.self-end { align-self: flex-end; }
+.justify-evenly { justify-content: space-evenly; }
+.relative { position: relative; }
+.shrink-0 { flex-shrink: 0; }
+.ml-2 { margin-left: 16rpx; }
+.ml-8 { margin-left: 32rpx; }
+.ml-12 { margin-left: 48rpx; }
+.mt-12 { margin-top: 24rpx; }
+.mt-20 { margin-top: 40rpx; }

pages/loginModule/register/register.wxml

@@ -1,78 +1,107 @@
-<view class="flex-col page">
-  <image
-    class="self-center image"
-    src="./images/logo.png"
-  />
-  <text class="self-center text">欢迎登陆—青橙校园</text>
-  <view class="flex-col self-stretch group">
-    <view class="flex-col register">
-      <text class="self-start font text_2">账号注册</text>
-      <view class="flex-col self-stretch group_6 mt-20">
-        <view class="flex-col">
-          <view class="flex-col justify-start relative section">
-            <input class="flex-col justify-start items-start text-wrapper_5 view input"
-             placeholder="{{ placeholder  }}"
-             maxlength="18"
-             bindinput="onInput" data-field="nickname" value="{{nickname}}"
-            />
-          </view>
-          <view class="flex-col justify-start section_1 mt-22">
-            <input
-              class="flex-col justify-start items-start text-wrapper_5 text-wrapper_1 input_1"
-              placeholder="请输入手机号"
-              maxlength="11"
-              type="number"
-              bindinput="onInput" data-field="phone" value="{{phone}}"
-            />
-          </view>
-        </view>
-        <view class="flex-row items-center relative section_3 mt-22">
-          <input
-            class="flex-col justify-start items-start text-wrapper_2 view_6 input_2"
-            placeholder="请输入验证码"
-            maxlength="6"
-            bindinput="onInput" data-field="captcha" value="{{captcha}}"
-          />
-          <view  bindtap="{{sending ? '' : 'sendSmsCode'}}" class="flex-col justify-start items-center shrink-0 text-wrapper_3 ml-18">
-            <text class="text_7">{{ sending ? count + 's后重发' : '发送验证码' }}</text>
-          </view>
-        </view>
-        <view class="flex-col mt-22">
-          <view class="flex-col justify-start relative section_2">
-            <input
-              class="flex-col justify-start items-start text-wrapper_5 view_1 input_3"
-              placeholder="请输入邀请码"
-              maxlength="6"
-              bindinput="onInput" data-field="inviteCode" value="{{inviteCode}}"
-            />
-          </view>
-          <view class="flex-col justify-start section_2 mt-22">
-            <input class="flex-col justify-start items-start text-wrapper_5 view_3 input_4"
-             placeholder="请输入密码"
-             password="true"
-             maxlength="11"
-             bindinput="onInput" data-field="password" value="{{password}}"
-           />
-          </view>
-        </view>
+<view class="page">
+
+<!-- 顶部 Logo 与标题 -->
+<image class="logo" src="/static/logo.jpg" mode="aspectFit" />
+<text class="page-title">欢迎登录 — 丁香校园</text>
+
+<!-- 注册卡片 -->
+<view class="card">
+
+  <view class="card-head">
+    <text class="card-title">账号注册</text>
+  </view>
+
+  <!-- 表单 -->
+  <view class="form">
+
+    <!-- 昵称 -->
+    <view class="field">
+      <input
+        class="field-input"
+        placeholder="{{ placeholder }}"
+        placeholder-class="ph"
+        maxlength="18"
+        bindinput="onInput" data-field="nickname" value="{{nickname}}"
+      />
+    </view>
+
+    <!-- 手机号 -->
+    <view class="field">
+      <input
+        class="field-input"
+        placeholder="请输入手机号"
+        placeholder-class="ph"
+        maxlength="11"
+        type="number"
+        bindinput="onInput" data-field="phone" value="{{phone}}"
+      />
+    </view>
+
+    <!-- 验证码（输入 + 发送） -->
+    <view class="field field-row">
+      <input
+        class="field-input flex-1"
+        placeholder="请输入验证码"
+        placeholder-class="ph"
+        maxlength="6"
+        bindinput="onInput" data-field="captcha" value="{{captcha}}"
+      />
+      <view
+        bindtap="{{sending ? '' : 'sendSmsCode'}}"
+        class="code-btn {{sending ? 'disabled' : ''}}"
+      >
+        <text class="code-btn-text">{{ sending ? count + 's后重发' : '发送验证码' }}
+        </text>
       </view>
     </view>
-    <view class="flex-row items-center group_1 mt-26">
-        <!-- 复选框 -->
+
+    <!-- 邀请码 -->
+    <view class="field">
+      <input
+        class="field-input"
+        placeholder="请输入邀请码"
+        placeholder-class="ph"
+        maxlength="6"
+        bindinput="onInput" data-field="inviteCode" value="{{inviteCode}}"
+      />
+    </view>
+
+    <!-- 密码 -->
+    <view class="field">
+      <input
+        class="field-input"
+        placeholder="请输入密码"
+        placeholder-class="ph"
+        password="true"
+        maxlength="18"
+        bindinput="onInput" data-field="password" value="{{password}}"
+      />
+    </view>
+
+    <!-- 协议勾选 -->
+    <view class="agreements">
       <checkbox-group bindchange="onCheckboxChange">
         <checkbox value="agree" checked="{{agree}}" color="#FF8D1A" />
       </checkbox-group>
-      <view class="group_2 ml-13">
-        <text class="font_2 text_10">我已阅读并同意</text>
-        <text class="font_2" bind:tap="gotoAgreement">《用户协议》</text>
-        <text class="text_11">&</text>
-        <text class="font_2" bind:tap="gotoPolicy">《隐私协议》</text>
+      <view class="agreements-text">
+        <text class="muted">我已阅读并同意</text>
+        <text class="link" bind:tap="gotoAgreement">《用户协议》</text>
+        <text class="muted">&</text>
+        <text class="link" bind:tap="gotoPolicy">《隐私协议》</text>
       </view>
     </view>
-    <view bindtap="onRegister" class="flex-col justify-start items-center text-wrapper_6 mt-26"><text class="font text_12">注册</text></view>
+
+    <!-- 注册按钮 -->
+    <view class="btn-primary" bindtap="onRegister">
+      <text class="btn-primary-text">注册</text>
+    </view>
   </view>
-  <view class="self-center group_3">
-    <text class="font_2 text_13">已有账号？</text>
-    <text bindtap="gotoLogin" class="font_2 text_14" >立即登录→</text>
-  </view>
-</view>
+</view>
+
+<!-- 登录引导 -->
+<view class="footer-tip">
+  <text class="muted">已有账号？</text>
+  <text class="link-strong" bindtap="gotoLogin">立即登录 →</text>
+</view>
+
+</view>

pages/loginModule/register/register.wxss

@@ -1,172 +1,182 @@
-.ml-13 {
-  margin-left: 24.38rpx;
-}
+/* ===== 基础布局 ===== */
 .page {
-  padding: 0rpx 49.74rpx 79.82rpx 49.74rpx;
-  background-color: #ffffff;
+  box-sizing: border-box;
+  min-height: 100vh;
+  padding: 64rpx 32rpx 48rpx;
+  background: #ffffff;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.logo {
+  width: 200rpx;
+  height: 200rpx;
+  border-radius: 24rpx;
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.06);
+}
+
+.page-title {
+  margin-top: 16rpx;
+  font-size: 36rpx;
+  color: #1c2023;
+  font-weight: 700;
+}
+
+/* ===== 卡片 ===== */
+.card {
   width: 100%;
-  overflow: hidden;
-  height: 100%;
+  margin-top: 28rpx;
+  background: #fff;
+  border-radius: 24rpx;
+  box-shadow: 0 10rpx 28rpx rgba(0,0,0,0.06);
+  padding: 28rpx;
 }
-.register {
-  margin-top: -30rpx;
+
+.card-head {
+  padding-bottom: 12rpx;
+  border-bottom: 1rpx solid #f1f1f1;
 }
-.image {
-  width: 232.5rpx;
-  height: 232.5rpx;
-}
-.text {
-  margin-top: 37.8rpx;
+
+.card-title {
+  font-size: 32rpx;
   color: #1c2023;
-  font-size: 37.5rpx;
-  font-family: SourceHanSansCN;
-  line-height: 35.18rpx;
+  font-weight: 700;
 }
-.group {
-  margin-top: 86.36rpx;
+
+.form {
+  padding-top: 20rpx;
 }
-.font {
+
+/* ===== 表单字段 ===== */
+.field {
+  background: #fff;
+  border: 1rpx solid #e9e9ec;
+  border-radius: 16rpx;
+  padding: 20rpx 24rpx;
+  box-shadow: 0 6rpx 16rpx rgba(0,0,0,0.04);
+  margin-top: 18rpx;
+}
+
+.field:focus-within {
+  border-color: #ff8d1a;
+  box-shadow: 0 8rpx 24rpx rgba(255,141,26,0.12);
+}
+
+.field-input {
+  width: 100%;
   font-size: 30rpx;
-  font-family: SourceHanSansCN;
-  line-height: 27.79rpx;
-  color: #b3b3b3;
-}
-.text_2 {
   color: #1c2023;
-  line-height: 28.2rpx;
+  line-height: 44rpx;
 }
-.group_6 {
-  padding-left: 2.76rpx;
+
+.ph { color: #9aa0a6; }
+
+.field-row {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+  padding-right: 16rpx;
 }
-.section {
-  padding: 20.63rpx 0 18.75rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 11.25rpx #00000040;
+
+.flex-1 { flex: 1; }
+
+/* ===== 验证码按钮 ===== */
+.code-btn {
+  height: 44rpx;
+  padding: 0 24rpx;
+  background: #ff8d1a;
+  border-radius: 14rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  white-space: nowrap;
+  box-shadow: 0 8rpx 18rpx rgba(255,141,26,0.25);
+  transition: transform .08s ease-in-out, opacity .2s;
 }
-.text-wrapper_5 {
-  margin-left: 16.88rpx;
-  margin-right: 16.88rpx;
+
+.code-btn:active { transform: scale(0.98); }
+
+.code-btn.disabled {
+  opacity: 0.55;
+  box-shadow: none;
 }
-.view {
-  padding: 15.92rpx 0 12.62rpx;
-  background-color: #ffffff00;
+
+.code-btn-text {
+  color: #fff;
+  font-size: 24rpx;
+  font-weight: 600;
 }
-.section_1 {
-  padding: 20.16rpx 0 19.22rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
+
+/* ===== 协议区 ===== */
+.agreements {
+  margin-top: 22rpx;
+  display: flex;
+  align-items: center;
+  gap: 14rpx;
 }
-.text-wrapper_1 {
-  padding: 12.64rpx 0 15.92rpx;
-  background-color: #ffffff00;
+
+.agreements-text {
+  display: flex;
+  align-items: center;
+  gap: 8rpx;
+  flex-wrap: wrap;
 }
-.section_3 {
-  padding: 25.63rpx 16.88rpx 28.75rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
+
+.muted { color: #666a73; font-size: 26rpx; }
+.link { color: #ff5e00; font-size: 26rpx; }
+.link-strong { color: #ff5e00; font-size: 28rpx; font-weight: 700; }
+
+/* ===== 主按钮 ===== */
+.btn-primary {
+  margin-top: 28rpx;
+  height: 96rpx;
+  border-radius: 18rpx;
+  background: linear-gradient(180deg, #ff9a2d 0%, #ff8d1a 100%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 14rpx 28rpx rgba(255,141,26,0.28);
+  transition: transform .06s ease-in-out;
 }
-.text-wrapper_2 {
-  flex: 1 1 0;
-}
-.view_6 {
-  padding: 16.73rpx 0 11.74rpx;
-  background-color: #ffffff00;
-  height: 66.25rpx;
-}
-.text-wrapper_3 {
-  margin-right: 15rpx;
-  padding: 13.16rpx 0 10.93rpx;
-  background-color: #ff8d1a;
-  border-radius: 9.38rpx;
-  width: 157.5rpx;
-  height: 45rpx;
-}
-.text_7 {
+
+.btn-primary:active { transform: scale(0.985); }
+
+.btn-primary-text {
   color: #ffffff;
-  font-size: 22.5rpx;
-  font-family: AlibabaPuHuiTi;
-  line-height: 20.91rpx;
+  font-size: 32rpx;
+  font-weight: 700;
 }
-.section_2 {
-  padding: 20.63rpx 0 18.75rpx;
-  background-color: #ffffff;
-  border-radius: 9.38rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
+
+/* ===== 底部引导 ===== */
+.footer-tip {
+  margin-top: 28rpx;
+  display: flex;
+  align-items: center;
+  gap: 8rpx;
 }
-.view_1 {
-  padding: 11.7rpx 0 16.89rpx;
-  background-color: #ffffff00;
-}
-.view_3 {
-  padding: 11.96rpx 0 16.29rpx;
-  background-color: #ffffff00;
-}
-.group_1 {
-  padding: 0 2.76rpx;
-}
-.group_2 {
-  line-height: 24.56rpx;
-  height: 24.56rpx;
-}
-.font_2 {
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 24.49rpx;
-  color: #ff5e00;
-}
-.text_10 {
-  color: #1c2023;
-  line-height: 24.56rpx;
-}
-.text_11 {
-  color: #1c2023;
-  font-size: 26.25rpx;
-  font-family: SourceHanSansCN;
-  line-height: 19.93rpx;
-}
-.text-wrapper_6 {
-  margin-left: 2.76rpx;
-  padding: 37.63rpx 0 32.27rpx;
-  background-color: #ff8d1a;
-  border-radius: 9.38rpx;
-}
-.text_12 {
-  color: #ffffff;
-  line-height: 27.6rpx;
-}
-.group_3 {
-  margin-top: 37rpx;
-  line-height: 24.36rpx;
-}
-.text_13 {
-  color: #383838;
-  line-height: 24.28rpx;
-}
-.text_14 {
-  line-height: 24.36rpx;
-}
-.input {
-  padding: 13.13rpx 16.26rpx 15rpx 16.26rpx;
-}
-.input_1 {
-  padding: 13.13rpx 16.26rpx 15rpx 16.26rpx;
-}
-.input_2 {
-  padding: 13.13rpx 16.26rpx 15rpx 16.26rpx;
-}
-.input_3 {
-  padding: 13.13rpx 16.26rpx 15rpx 16.26rpx;
-}
-.input_4 {
-  padding: 13.13rpx 16.26rpx 15rpx 16.26rpx;
-}
-.checkbox {
-  flex-shrink: 0;
-}
-.checkbox .wx-checkbox-input {
-  width: 37.5rpx;
-  height: 37.5rpx;
-}
+
+/* ===== 兼容你原先的类名（可选保留，避免影响其他样式） ===== */
+.flex-col { display: flex; flex-direction: column; }
+.flex-row { display: flex; flex-direction: row; }
+.items-center { align-items: center; }
+.self-center { align-self: center; }
+.self-start { align-self: flex-start; }
+.self-stretch { align-self: stretch; }
+.relative { position: relative; }
+.shrink-0 { flex-shrink: 0; }
+
+.mt-20 { margin-top: 40rpx; }
+.mt-22 { margin-top: 44rpx; } /* 你原文件的 mt-22 语义留存 */
+.mt-26 { margin-top: 52rpx; }
+.ml-13 { margin-left: 26rpx; }
+.ml-18 { margin-left: 36rpx; }
+
+/* 旧色彩类（若其他页面使用到，可保留） */
+.text { color: #1c2023; }
+.font { font-size: 36rpx; }
+.font_2 { font-size: 26rpx; color: #1c2023; }
+.text_10, .text_11 { font-size: 26rpx; }
+
+/* 你原先的按钮类名占位（防止引用处报错） */
+.text-wrapper_6 { }

pages/personCenter/accountSetting/accountSetting.js

@@ -1,5 +1,7 @@
 // pages/personCenter/accountSetting/accountSetting.js
 const { baseUrl, globalImgUrl } = require("../../../request");
+const { notLogin } = require('../../../utils/util')
+
 
 Page({
 
@@ -76,6 +78,8 @@ Page({
             userAccount: res.data.data.userAccount,
             role:res.data.data.userRole,
           })
+        } else {
+          notLogin(res.data.message)
         }
       },
       fail: () => {

pages/personCenter/accountSetting/accountSetting.wxml

@@ -5,7 +5,7 @@
         class="self-center image"
         src="{{globalImgUrl + userAvatar}}"
       />
-      <view class="flex-col items-start flex-1 self-start group_2 ml-8">
+      <view class="flex-col items-start flex-1 self-start group_2 ml-16">
         <text class="text">{{ nickName }}</text>
         <text class="font text_2 mt-28">{{ phoneNumber }}</text>
       </view>

pages/personCenter/component/commissionPop/commissionPop.wxml

@@ -9,7 +9,7 @@
       </view>
       <view class="self-start group mt-17">
         <text class="font_2 text_4">注意：最高抽成比例</text>
-        <text class="font_2 text_5">5%</text>
+        <text class="font_2 text_5">10%</text>
       </view>
       <view class="flex-col justify-start items-center self-center text-wrapper mt-17" bindtap="submit">
         <text class="font_2 text_6">确认设置</text>

pages/personCenter/component/modifyNamePop/modifyNamePop.js

@@ -0,0 +1,49 @@
+Component({
+  properties: {
+    show: {
+      type: Boolean,
+      value: false
+    },
+    nickname: {
+      type: String,
+      value: ''
+    }
+  },
+  data: {
+    inputVal: ''
+  },
+  methods: {
+    onInput(e) {
+      this.setData({
+        inputVal: e.detail.value
+      });
+    },
+    onCancel() {
+      this.triggerEvent('cancel');
+    },
+    onConfirm() {
+      const newName = this.data.inputVal.trim();
+      if (!newName) {
+        wx.showToast({
+          title: '昵称不能为空',
+          icon: 'none'
+        });
+        return;
+      }
+
+      if (newName.length > 20) {
+        wx.showToast({
+          title: '昵称最长不超过20个字符',
+          icon: 'none'
+        })
+        return ;
+      }
+      this.triggerEvent('confirm', { nickname: newName });
+    }
+  },
+  observers: {
+    nickname(val) {
+      this.setData({ inputVal: val });
+    }
+  }
+});

pages/personCenter/component/modifyNamePop/modifyNamePop.wxml

@@ -0,0 +1,15 @@
+<view wx:if="{{show}}" class="popup-mask">
+  <view class="popup-container">
+    <text class="popup-title">修改昵称</text>
+    <input 
+      class="popup-input" 
+      placeholder="请输入新的昵称" 
+      value="{{nickname}}"
+      bindinput="onInput"
+    />
+    <view class="popup-btns">
+      <button class="btn cancel-btn" bindtap="onCancel">取消</button>
+      <button class="btn confirm-btn" bindtap="onConfirm">确定</button>
+    </view>
+  </view>
+</view>

pages/personCenter/component/modifyNamePop/modifyNamePop.wxss

@@ -0,0 +1,57 @@
+.popup-mask {
+  position: fixed;
+  top: 0; left: 0; right: 0; bottom: 0;
+  background: rgba(0, 0, 0, 0.4);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 1000;
+}
+
+.popup-container {
+  width: 80%;
+  background: #fff;
+  border-radius: 10px;
+  padding: 20rpx;
+  box-sizing: border-box;
+}
+
+.popup-title {
+  display: block;
+  font-size: 32rpx;
+  font-weight: bold;
+  text-align: center;
+  margin-bottom: 20rpx;
+}
+
+.popup-input {
+  width: 100%;
+  border: 1px solid #ddd;
+  border-radius: 6rpx;
+  padding: 10rpx;
+  box-sizing: border-box;
+  font-size: 28rpx;
+}
+
+.popup-btns {
+  display: flex;
+  justify-content: space-around;
+  margin-top: 20rpx;
+}
+
+.btn {
+  flex: 1;
+  margin: 0 10rpx;
+  padding: 12rpx 0;
+  border-radius: 6rpx;
+}
+
+.cancel-btn {
+  background: #f5f5f5;
+  color: #333;
+}
+
+.confirm-btn {
+  background: #f5f5f5;
+  color: #ff8d1a;
+}

pages/personCenter/contactSuper/contactSuper.js

@@ -12,12 +12,40 @@ Page({
   /**
    * 生命周期函数--监听页面加载
    */
-  onLoad(options) {
-    this.fetchSupervisorInfo();
+  onLoad() {
+    const role = wx.getStorageSync('role')
+    if (role === 'manager') {
+      this.getManagerInfo();
+    } else {
+      this.fetchSupervisorInfo();
+    }
   },
  /**
    * 请求后端接口，获取上级联系人信息
    */
+
+  getManagerInfo() {
+    const token = wx.getStorageSync('token')
+    wx.request({
+      url: baseUrl + '/userInfo/get/jwt',
+      method: 'GET',
+      header: {
+        Authorization: token
+      },
+      success: res => {
+        console.log('用户信息---->',res.data);
+        if (res.data.code === 1) {
+          let result = res.data.data
+          this.setData({
+            nickName: result.nickName,
+            phoneNumber: result.phoneNumber
+          })
+        }
+      }
+    })
+   },
+
+
   fetchSupervisorInfo() {
     const token = wx.getStorageSync('token');
     wx.request({

pages/personCenter/contactSuper/contactSuper.wxml

@@ -14,7 +14,7 @@
     </view>
     <image
       class="self-start image"
-      src="./images/logo.png"
+      src="/static/logo.jpg"
     />
   </view>
 </view>

pages/personCenter/contactSuper/contactSuper.wxss

@@ -5,7 +5,7 @@
   margin-left: 39.38rpx;
 }
 .page {
-  padding: 43.13rpx 0 1346.25rpx;
+  padding: 43.13rpx 0 0;
   background-image: linear-gradient(180deg, #ff8d1a -7.3%, #ffffff00 33.5%);
   width: 100%;
   overflow-y: auto;

pages/personCenter/mine/mine.js

@@ -1,6 +1,8 @@
 // pages/personCenter/mine/mine.js
 const { baseUrl } = require("../../../request");
 const { globalImgUrl } = require("../../../request")
+const { notLogin } = require('../../../utils/util')
+
 
 Page({
 
@@ -8,7 +10,6 @@ Page({
    * 页面的初始数据
    */
   data: {
-    items: [null,null,null],
     nickName: "",
     userAvatar: "",
     phoneNumber: "",
@@ -20,7 +21,12 @@ Page({
     userRole: "",
     title: '查看绩效',
     id: 0,
-    globalImgUrl
+    globalImgUrl,
+    showNicknamePopup: false,
+    totalIncome: 0,
+    withdrawaledAmount: 0,
+    withdrawalingBalance: 0,
+    currentBalance: 0
   },
   // 跳转课程订单页面
   courseOrder() {
@@ -163,17 +169,18 @@ Page({
       Authorization: token
     },
     success: res => {
+      console.log('用户主要信息=====>', res.data)
       if (res.data.code === 1) {
         let result = res.data.data
-        console.log('====fdfs>', res)  
         this.setData({
-          qrcode: globalImgUrl + result.inviteQrCode
+          qrcode: globalImgUrl + result.inviteQrCode,
+          totalIncome: result.totalIncome,
+          withdrawaledAmount: result.withdrawnAmount,
+          withdrawalingBalance: result.withdrawalAmount,
+          currentBalance: result.currentBalance
         })
       } else {
-        wx.showToast({
-          title: '获取个人信息失败',
-          icon: 'none'
-        })
+        notLogin(res.data.message)
       }
     },
     fail: () => {
@@ -297,6 +304,41 @@ Page({
       })
     },
 
+
+    openNicknamePopup() {
+      this.setData({ showNicknamePopup: true });
+    },
+    closeNicknamePopup() {
+      this.setData({ showNicknamePopup: false });
+    },
+    updateNickname(e) {
+      const { nickname } = e.detail;
+      const token = wx.getStorageSync('token');
+      wx.request({
+        url: baseUrl + '/userInfo/modify/nickname',
+        method: 'POST',
+        header: {
+          Authorization: token
+        },
+        data: { templateString: nickname },
+        success: res => {
+          if (res.data.code === 1) {
+            wx.showToast({ title: '修改成功', icon: 'success' });
+            this.setData({ 
+              nickName: nickname,
+              showNicknamePopup: false
+            });
+          } else {
+            wx.showToast({ title: res.data.message || '修改失败', icon: 'none' });
+          }
+        },
+        fail: () => {
+          wx.showToast({ title: '网络错误', icon: 'none' });
+        }
+      });
+    },
+    
+
   /**
    * 生命周期函数--监听页面初次渲染完成
    */

pages/personCenter/mine/mine.json

@@ -1,5 +1,6 @@
 {
   "usingComponents": {
-    "InvitationCodePop": "/pages/personCenter/component/InvitationCodePop/InvitationCodePop"
+    "InvitationCodePop": "/pages/personCenter/component/InvitationCodePop/InvitationCodePop",
+    "EditNicknamePopup": "/pages/personCenter/component/modifyNamePop/modifyNamePop"
   }
 }

pages/personCenter/mine/mine.wxml

@@ -1,321 +1,149 @@
-<!-- <view class="flex-col page">
-  <view class="flex-col relative section">
-    <view class="flex-row justify-between items-center group">
-      <view class="flex-col">
-        <text class="self-start font text">{{ nickName }}</text>
-        <view class="flex-row items-center self-stretch group_2 mt-9" bind:tap="gotoCall">
-          <image
-            class="image_3"
-            src="./images/dianhua.png"
-            mode="aspectFill"
-          />
-          <text class="font_2 text_2 ml-7">{{ phoneNumber }}</text>
-        </view>
-        <view class="flex-row items-center self-stretch section_2 mt-9" bindtap="copyInvitationCode">
-          <text class="font_3 text_3">邀请码：{{ invitationCode }}</text>
-          <image
-            class="shrink-0 image_4"
-            src="./images/fuzhi.png"
-            mode="aspectFill"
-          />
-        </view>
-      </view>
-      <view class="flex-col items-center">
-        <image
-          class="image_2"
-          src="./images/erweima.png"
-          mode="aspectFill"
-          bindtap="showPromoPopup"
-        />
-        <text class="font_3 text_4 mt-6">二维码邀请</text>
-      </view>
-    </view>
-    <view class="flex-col group_3">
-      <view class="flex-row justify-between items-center group_4">
-        <view class="group_5">
-          <text class="font_2 text_6">当前金额：</text>
-          <text class="text_5">￥{{ currentBalance }}</text>
-        </view>
-        <view class="flex-row items-center section_3" bind:tap="lijitixian">
-          <image
-            class="image_5 image_6"
-            src="./images/jiantou.png"
-          />
-          <text class="font_3 text_7">立即提现</text>
-        </view>
-      </view>
-      <view class="flex-row items-start equal-division section_4">
-        <view class="flex-col items-center equal-division-item_8">
-          <text class="font_2 text_8">提现中</text>
-          <text class="font_4 mt-15">￥{{ withdrawalingBalance }}</text>
-        </view>
-        <view class="flex-col items-center group_6 equal-division-item">
-          <text class="font_2 text_9">已提现</text>
-          <text class="font_4 mt-15">￥{{ withdrawaledAmount }}</text>
-        </view>
-        <view class="flex-col items-center group_7 equal-division-item_8">
-          <text class="font_2 text_10">累计收入</text>
-          <text class="font_4 mt-15">￥{{ totalIncome }}</text>
-        </view>
-      </view>
-    </view>
-    <image
-      class="image pos"
-      src="./images/logo.png"
-      mode="aspectFill"
-    />
-  </view>
-  <view class="flex-row items-start equal-division_2 section_5">
-    <view class="flex-col items-center equal-division-item_1 equal-division-item_2" bind:tap="mingxi">
-      <image
-        class="image_7"
-        src="./images/zhijinxiangqing.png"
-      />
-      <text class="font text_11 mt-6">资金明细</text>
-    </view>
-    <view class="flex-col items-center group_6 group_1" bind:tap="tixianzhanghu">
-      <image
-        class="image_7"
-        src="./images/tixianzhanghu.png"
-        mode="aspectFill"
-      />
-      <text class="font text_12 mt-6">提现账户</text>
-    </view>
-    <view class="flex-col items-center group_9 group_10" bind:tap="zhijin">
-      <image
-        class="image_7"
-        src="./images/tixianjilu.png"
-        mode="aspectFill"
-      />
-      <text class="font text_13 mt-6">提现记录</text>
-    </view>
-  </view> -->
-  <!-- 接单相关 -->
-  <!-- <view class="flex-col list"> -->
-    <!-- <view
-      class="flex-row equal-division equal-division_3 mt-15"
-      wx:for="{{items}}"
-      wx:for-item="item"
-      wx:for-index="index"
-      wx:key="index"
-    >
-      <view class="flex-col items-center equal-division-item_3" bind:tap="xiangmu">
-        <image
-          class="image_8"
-          src="./images/wodxiangmu.png"
-          mode="aspectFill"
-        />
-        <text class="font text_14 mt-10">我的项目</text>
-      </view>
-      <view class="flex-col items-center group_15 equal-division-item_6" bind:tap="myteam">
-        <image
-          class="image_8"
-          src="./images/tuanduiguanli.png"
-          mode="aspectFill"
-        />
-        <text class="font text_15 mt-10">团队管理</text>
-      </view>
-      <view class="flex-col items-center group_11 equal-division-item_3" bind:tap="szcy">
-        <image
-          class="image_8"
-          src="./images/choucheng.png"
-          mode="aspectFill"
-        />
-        <text class="font text_16 mt-11">设置抽佣</text>
-      </view>
-      <view class="flex-col items-center group_12 equal-division-item_7" bind:tap="lxsj">
-        <image
-          class="image_8"
-          src="./images/shangji.png"
-          mode="aspectFill"
-        />
-        <text class="font mt-11">联系上级</text>
-      </view>
-    </view> -->
-    <!-- 课程相关 -->
-    <!-- <view
-      class="flex-row equal-division equal-division_3 mt-15"
-      wx:for="{{items}}"
-      wx:for-item="item"
-      wx:for-index="index"
-      wx:key="index"
-    >
-      <view class="flex-col items-center equal-division-item_3" bind:tap="courseOrder">
-        <image
-          class="image_8"
-          src="./images/wodxiangmu.png"
-          mode="aspectFill"
-        />
-        <text class="font text_14 mt-10">课程订单</text>
-      </view>
-      <view class="flex-col items-center group_15 equal-division-item_6" bind:tap="gotoSettlementRecord">
-        <image
-          class="image_8"
-          src="./images/tuanduiguanli.png"
-          mode="aspectFill"
-        />
-        <text class="font text_15 mt-10">结算记录</text>
-      </view>
-      <view class="flex-col items-center group_11 equal-division-item_3" bind:tap="szcy">
-        <image
-          class="image_8"
-          src="./images/choucheng.png"
-          mode="aspectFill"
-        />
-        <text class="font text_16 mt-11">我的课程</text>
-      </view>
-      <view class="flex-col items-center group_12 equal-division-item_7" bind:tap="">
-        <image
-          class="image_8"
-          src="./images/shangji.png"
-          mode="aspectFill"
-        />
-        <text class="font mt-11">联系上级</text>
-      </view>
-    </view>
-  </view>
-  <view class="flex-col list_2">
-    <view class="flex-row justify-between items-center self-stretch group_13" bind:tap="zhshezhi">
-      <view class="flex-row items-center">
-        <image
-          class="shrink-0 image_9"
-          src="./images/zhanghaoshezhi.png"
-          mode="aspectFill"
-        />
-        <text class="font text_17 ml-5">账号设置</text>
-      </view>
-      <image
-        class="image_5"
-        src="./images/xiajiantou.png"
-        mode="aspectFill"
-      />
-    </view>
-    <view class="self-end list-divider"></view>
-    <view class="flex-row justify-between items-center self-stretch group_14">
-      <view class="flex-row items-center">
-        <image
-          class="shrink-0 image_9"
-          src="./images/lianxikefu.png"
-          mode="aspectFill"
-        />
-        <text class="font text_18 ml-5">联系客服</text>
-      </view>
-      <image
-        class="image_5"
-        src="./images/xiajiantou.png"
-        mode="aspectFill"
-      />
-    </view>
-  </view>
-</view> -->
+<wxs src="../../../utils/addmul.wxs" module="filters" />
 
 <view class="flex-col page">
+  <!-- 顶部：头像 / 昵称 / 电话 / 邀请码 / 二维码 -->
   <view class="flex-row justify-between section">
     <view class="flex-row items-center self-center">
-    <button open-type="chooseAvatar" bind:chooseavatar="updateAvatar">
-      <image
-        class="image"
-        src="{{globalImgUrl + userAvatar}}"
-        mode="aspectFill"
-      />
-    </button>
+      <button class="avatar-btn" open-type="chooseAvatar" bind:chooseavatar="updateAvatar">
+        <image class="image" src="{{globalImgUrl + userAvatar}}" mode="aspectFill" />
+      </button>
       <view class="flex-col ml-6">
-        <text class="self-start font text">{{ nickName }}</text>
+        <view class="flex-row items-center justify-between" style="width: 250rpx;">
+          <text class="self-start font text nickname-wrap">{{ nickName }}</text>
+          <text class="self-start font text_2 ml-16" bindtap="openNicknamePopup">修改</text>
+        </view>
+
         <view class="flex-row items-center self-stretch group_2 mt-9" bindtap="gotoCall">
-          <image
-            class="image_3"
-            src="./images/dianhua.png"
-            mode="aspectFill"
-          />
+          <image class="image_3" src="./images/dianhua.png" mode="aspectFill" />
           <text class="font_2 text_2 ml-7">{{ phoneNumber }}</text>
         </view>
-        <view class="flex-row items-center self-stretch section_2 mt-9" bind:tap="copyInvitationCode">
-          <text class="font_2 text_3">邀请码：{{ invitationCode }}</text>
-          <image
-            class="shrink-0 image_4"
-            src="./images/fuzhi.png"
-            mode="aspectFill"
-          />
+
+        <view class="flex-row items-center invite-pill section_2 mt-9" bind:tap="copyInvitationCode">
+          <text class="font_2 text_3 invite-text">邀请码：{{ invitationCode }}</text>
+          <image class="shrink-0 image_4" src="./images/fuzhi.png" mode="aspectFill" />
         </view>
       </view>
     </view>
+
     <view class="flex-col items-start self-start group">
-      <image
-        class="image_2"
-        src="./images/erweima.png"
-        mode="aspectFill"
-        bind:tap="showPromoPopup"
-      />
+      <image class="image_2" src="./images/erweima.png" mode="aspectFill" bind:tap="showPromoPopup" />
       <text class="font_2 text_4 mt-6">二维码邀请</text>
     </view>
   </view>
-  <view class="flex-col mt-22" >
-    <view class="flex-row items-start equal-division section_3" wx:if="{{ userRole != 'user' }}">
-      <view class="flex-col items-center equal-division-item_1 group_3" bindtap="checkPerformance">
-        <image
-          class="image_5"
-          src="./images/zhijinxiangqing.png"
-        />
-        <text class="font text_5 mt-6">{{title}}</text>
+
+  <!-- ===== 查看绩效 / 排名（已上移到金额卡片前） ===== -->
+  <view class="flex-row items-start equal-division section_3 mt-22" wx:if="{{ userRole != 'user' }}">
+    <view class="flex-col items-center equal-division-item_1 group_3" bindtap="checkPerformance">
+      <image class="image_5" src="./images/jixiao.png" />
+      <text class="font text_5 mt-6">{{title}}</text>
+    </view>
+    <view class="flex-col items-center equal-division-item_2 equal-division-item" bindtap="gotoSupervisorRank" data-userRole="{{ 'manager' }}">
+      <image class="image_5" src="./images/zgpm.png" />
+      <text class="font text_6 mt-6">主管排名</text>
+    </view>
+    <view class="flex-col items-center equal-division-item_3 group_5" bindtap="gotoStaffRank" data-userRole="{{ 'supervisor' }}">
+      <image class="image_5" src="./images/ygpm.png" />
+      <text class="font mt-6">员工排名</text>
+    </view>
+  </view>
+
+  <!-- ===== 当前金额卡片（已美化） ===== -->
+  <view class="wallet-card mt-22">
+    <view class="wallet-head">
+      <view class="wallet-head-left">
+        <text class="wallet-head-label">当前金额：</text>
+        <text class="wallet-head-amount">￥{{ filters.toFix2(currentBalance) }}</text>
       </view>
-      <view class="flex-col items-center equal-division-item_2  equal-division-item" bindtap="gotoSupervisorRank" data-userRole="{{ 'manager' }}">
-        <image
-          class="image_5"
-          src="./images/tixianzhanghu.png"
-        />
-        <text class="font text_6 mt-6">主管排名</text>
-      </view>
-      <view class="flex-col items-center equal-division-item_3 group_5" bindtap="gotoStaffRank" data-userRole="{{ 'supervisor' }}">
-        <image
-          class="image_5"
-          src="./images/tixianjilu.png"
-        />
-        <text class="font mt-6">员工排名</text>
+      <view class="wallet-head-right" bind:tap="lijitixian">
+        <text class="wallet-withdraw-text">立即提现</text>
       </view>
     </view>
-    <view class="flex-col list">
-      <view class="flex-row justify-between items-center section_4" wx:if="{{isShowOrder}}" bindtap="courseOrder">
-        <view class="flex-row items-center">
-          <image
-            class="shrink-0 image_6"
-            src="./images/zhanghaoshezhi.png"
-          />
-          <text class="font ml-5">我的订单</text>
-        </view>
-        <image
-          class="image_7"
-          src="./images/xiajiantou.png"
-        />
+
+    <view class="wallet-stats">
+      <view class="wallet-stat">
+        <text class="wallet-stat-label">提现中</text>
+        <text class="wallet-stat-value">￥{{ filters.toFix2(withdrawalingBalance) }}</text>
       </view>
-      <view class="flex-row justify-between items-center section_4 mt-11" bindtap="gotoDashboard" wx:if="{{ userRole !== 'user' }}">
-        <view class="flex-row items-center">
-          <image
-            class="shrink-0 image_6"
-            src="./images/zhanghaoshezhi.png"
-          />
-          <text class="font text_7 ml-5">仪表盘</text>
-        </view>
-        <image
-          class="image_7"
-          src="./images/xiajiantou.png"
-        />
+      <view class="wallet-stat">
+        <text class="wallet-stat-label">已提现</text>
+        <text class="wallet-stat-value">￥{{ filters.toFix2(withdrawaledAmount) }}</text>
       </view>
-      <view class="flex-row justify-between items-center section_4 mt-11" bindtap="zhshezhi">
-        <view class="flex-row items-center">
-          <image
-            class="shrink-0 image_6"
-            src="./images/zhanghaoshezhi.png"
-          />
-          <text class="font text_8 ml-5">账号设置</text>
-        </view>
-        <image
-          class="image_7"
-          src="./images/xiajiantou.png"
-        />
+      <view class="wallet-stat">
+        <text class="wallet-stat-label">累计收入</text>
+        <text class="wallet-stat-value">￥{{ filters.toFix2(totalIncome) }}</text>
       </view>
     </view>
   </view>
+
+  <!-- ===== 三入口快捷区 ===== -->
+  <view class="shortcut-row">
+    <view class="shortcut-item" bind:tap="mingxi">
+      <image class="shortcut-icon" src="./images/zhijinxiangqing.png" />
+      <text class="shortcut-text">资金明细</text>
+    </view>
+    <view class="shortcut-item" bind:tap="tixianzhanghu">
+      <image class="shortcut-icon" src="./images/tixianzhanghu.png" />
+      <text class="shortcut-text">提现账户</text>
+    </view>
+    <view class="shortcut-item" bind:tap="zhijin">
+      <image class="shortcut-icon" src="./images/tixianjilu.png" />
+      <text class="shortcut-text">提现记录</text>
+    </view>
+  </view>
+
+  <!-- ===== 接单四宫格 ===== -->
+  <view class="grid-row">
+    <view class="grid-item" bind:tap="xiangmu">
+      <image class="grid-icon" src="./images/wodxiangmu.png" />
+      <text class="grid-text">我的项目</text>
+    </view>
+    <view class="grid-item" bind:tap="myteam">
+      <image class="grid-icon" src="./images/tuanduiguanli.png" />
+      <text class="grid-text">团队管理</text>
+    </view>
+    <view class="grid-item" bind:tap="szcy">
+      <image class="grid-icon" src="./images/choucheng.png" />
+      <text class="grid-text">设置抽佣</text>
+    </view>
+    <view class="grid-item" bind:tap="lxsj">
+      <image class="grid-icon" src="./images/shangji.png" />
+      <text class="grid-text">联系上级</text>
+    </view>
+  </view>
+
+  <!-- ===== 你的原有列表区（订单 / 仪表盘 / 账号设置） ===== -->
+  <view class="flex-col list">
+    <view class="flex-row justify-between items-center section_4" wx:if="{{isShowOrder}}" bindtap="courseOrder">
+      <view class="flex-row items-center">
+        <image class="shrink-0 image_6" src="./images/order.png" />
+        <text class="font ml-8">我的订单</text>
+      </view>
+      <image class="image_7" src="./images/xiajiantou.png" />
+    </view>
+
+    <view class="flex-row justify-between items-center section_4 mt-11" bindtap="gotoDashboard" wx:if="{{ userRole !== 'user' }}">
+      <view class="flex-row items-center">
+        <image class="shrink-0 image_6" src="./images/dash.png" />
+        <text class="font text_7 ml-8">仪表盘</text>
+      </view>
+      <image class="image_7" src="./images/xiajiantou.png" />
+    </view>
+
+    <view class="flex-row justify-between items-center section_4 mt-11" bindtap="zhshezhi">
+      <view class="flex-row items-center">
+        <image class="shrink-0 image_6" src="./images/setting.png" />
+        <text class="font text_8 ml-8">账号设置</text>
+      </view>
+      <image class="image_7" src="./images/xiajiantou.png" />
+    </view>
+  </view>
 </view>
 
-<!-- 调用弹窗组件 -->
-<InvitationCodePop show="{{showPopup}}" bind:close="closePopup" qrcode="{{qrcode}}"/>
+<!-- 弹窗组件 -->
+<InvitationCodePop show="{{showPopup}}" bind:close="closePopup" qrcode="{{qrcode}}"/>
+<EditNicknamePopup
+  show="{{showNicknamePopup}}"
+  nickname="{{nickName}}"
+  bind:cancel="closeNicknamePopup"
+  bind:confirm="updateNickname"
+/>