From eeb092cc003c8e4a8505a74fab2c5cd62833274a Mon Sep 17 00:00:00 2001
From: weipengfei <2187978347@qq.com>
Date: Thu, 20 Jul 2023 10:22:50 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/oaUser.js                 |  12 +-
 pages/oaExamine/oaExamine.vue |  22 ++-
 pages/oaHome/oaHome.vue       |  52 ++---
 pages/oaManager/oaManager.vue | 102 +++++++++-
 pages/oaMy/oaMy.vue           |  53 +----
 pages/oaTask/oaTask.vue       |  12 +-
 static/server/server.js       |   8 +-
 subpkg/topUp/topUp.vue        | 357 +++++++++++++++++++---------------
 8 files changed, 363 insertions(+), 255 deletions(-)

diff --git a/api/oaUser.js b/api/oaUser.js
index 0b16a1c..976a82f 100644
--- a/api/oaUser.js
+++ b/api/oaUser.js
@@ -6,7 +6,17 @@ import oahttp from "@/utils/oahttp.js";
 export const loginAccount = (data) => oahttp.post('/login/account', data, { noAuth: true })
 
 /**
- * 获取代办事项 已处理事项
+ * cesi
  */
 export const test = (data) => oahttp.post('/index/config', data, { noAuth: true })
 
+/**
+ * 个人中心
+ */
+export const userCenter = (data) => oahttp.get('/user/center', data)
+
+/**
+ * 个人信息
+ */
+export const userInfo = (data) => oahttp.get('/user/info', data)
+
diff --git a/pages/oaExamine/oaExamine.vue b/pages/oaExamine/oaExamine.vue
index b12dccc..687e18c 100644
--- a/pages/oaExamine/oaExamine.vue
+++ b/pages/oaExamine/oaExamine.vue
@@ -2,8 +2,10 @@
   <view class="all_box">
     <!-- 审批选项 -->
     <view class="examine_box">
-      <u-tabs :list="list1" @click="click" lineColor='#3274F9' :scrollable="false" lineWidth='20' inactiveStyle='color:#666'
-        activeStyle="color:#3274F9"></u-tabs>
+      <u-sticky bgColor="#fff">
+        <u-tabs :list="list1" @click="click" lineColor='#3274F9' :scrollable="false" lineWidth='20'
+          inactiveStyle='color:#666' activeStyle="color:#3274F9"></u-tabs>
+      </u-sticky>
     </view>
     <!-- 事项 -->
     <view class="out_box">
@@ -48,7 +50,7 @@
           name: '审核完成'
         }, {
           name: '未通过'
-        },],
+        }, ],
         myEventList: [],
         params: {
           limit: '8', //默认每次请求数据
@@ -71,7 +73,7 @@
     },
     onLoad() {
       this.myEventList = []
-      this.getApproveMyList(this.params)
+      // this.getApproveMyList(this.params)
     },
     onShow() {
 
@@ -175,11 +177,11 @@
   }
 
   .examine_box {
-    position: fixed;
-    top: 0;
-    width: 750rpx;
-    height: 77rpx;
-    background: #FFFFFF;
+    // position: fixed;
+    // top: 0;
+    // width: 750rpx;
+    // height: 77rpx;
+    // background: #FFFFFF;
 
   }
 
@@ -259,4 +261,4 @@
     }
 
   }
-</style>
+</style>
\ No newline at end of file
diff --git a/pages/oaHome/oaHome.vue b/pages/oaHome/oaHome.vue
index eec18df..412a01d 100644
--- a/pages/oaHome/oaHome.vue
+++ b/pages/oaHome/oaHome.vue
@@ -4,10 +4,10 @@
     <view class="home_header">
       <view class="my_info flex_a_c">
         <view class="">
-          <u--image :showLoading="true" :src="myOaInfo.thumb" width="64px" height="64px" shape="circle"></u--image>
+          <u--image :showLoading="true" :src="myOaInfo.avatar" width="64px" height="64px" shape="circle"></u--image>
         </view>
         <view class="mesg_box">
-          <view class="name">{{ myOaInfo.name }} {{ myOaInfo.mobile }}</view>
+          <view class="name">{{ myOaInfo.nickname }} {{ myOaInfo.mobile }}</view>
           <view class="duty">({{ myOaInfo.did_name }}){{myOaInfo.label_name}}</view>
         </view>
       </view>
@@ -31,7 +31,7 @@
       <view class="backlog">
         <view class="head_title flex_a_c_j_sb">
           <view class="title">公告列表</view>
-          <view class="flex_a_c" @click="test">更多 <view class="iconfont icon-you">
+          <view class="flex_a_c" @click="navTo('')">更多 <view class="iconfont icon-you">
               <uni-icons type="forward"></uni-icons>
             </view>
           </view>
@@ -57,12 +57,12 @@
     <view class="my_task">
       <view class="task_title flex_a_c_j_sb">
         <view class="title">我的任务</view>
-        <view class="flex_a_c" @click="test">更多 <view class="iconfont icon-you">
+        <view class="flex_a_c" @click="navTo('')">更多 <view class="iconfont icon-you">
             <uni-icons type="forward"></uni-icons>
           </view>
         </view>
       </view>
-      <taskCard></taskCard>
+      <!-- <taskCard></taskCard> -->
       <!-- <view class="head_title flex_a_c_j_sb">
         <view class="">我的任务</view>
         <view class="flex_a_c" @click="test">更多 <view class="iconfont icon-you"></view>
@@ -146,11 +146,11 @@
         flowState: '#47B347', // 任务状态
         priority: '', // 任务紧急度
         myOaInfo: {
-          thumb: '',
-          name: '张三',
+          avatar: '',
+          nickname: '张三',
           mobile: '18933334444',
-          did_name: '技术部',
-          label_name: '技术专员',
+          did_name: '',
+          label_name: '',
         },
         ApproveList: []
       }
@@ -163,23 +163,27 @@
     },
     onLoad() {},
     onShow() {
-      this.getUserIndex()
-      this.getIndexList()
-      this.getApproveList()
+      // this.getUserIndex()
+      // this.getIndexList()
+      // this.getApproveList()
+      this.initUserInfo()
     },
     computed: {},
     methods: {
-      test() {
-        wx.chooseMessageFile({
-          count: 1, //限制选择的文件数量
-          type: 'all', //非图片和视频的文件,不选默认为all
-          //type:'video',//视频
-          //type:'image',//图片
-          success(res) {
-            const tempFilePaths = res.tempFiles
-            console.log(res);
-          }
-        })
+      // test() {
+      //   wx.chooseMessageFile({
+      //     count: 1, //限制选择的文件数量
+      //     type: 'all', //非图片和视频的文件,不选默认为all
+      //     //type:'video',//视频
+      //     //type:'image',//图片
+      //     success(res) {
+      //       const tempFilePaths = res.tempFiles
+      //       console.log(res);
+      //     }
+      //   })
+      // },
+      initUserInfo(){
+        this.myOaInfo = this.$store.state.app.userInfo;
       },
       async getApproveList() {
         const res = await getApproveListAPI({ status: 1 })
@@ -225,7 +229,7 @@
       }
     },
     onPullDownRefresh() {
-      this.getIndexList()
+      // this.getIndexList()
       uni.stopPullDownRefresh()
     }
   }
diff --git a/pages/oaManager/oaManager.vue b/pages/oaManager/oaManager.vue
index c62928a..4c8203c 100644
--- a/pages/oaManager/oaManager.vue
+++ b/pages/oaManager/oaManager.vue
@@ -1,11 +1,33 @@
 <template>
   <view class="">
-    <view class="head_box">
-      <u-search shape="round" placeholder="搜索任务状态、优先级、部门等" :showAction="false"></u-search>
+    <!-- <view class="head_box">
+      <u-search shape="round" placeholder="搜索任务状态、优先级、部门等" :showAction="false" style="margin-right: 26rpx;"></u-search>
       <view class="btn">筛选</view>
+    </view> -->
+    <!-- 任务搜索框 -->
+    <view class="task_box">
+      <u-search shape="round" placeholder="搜索片区经理" :showAction="false"></u-search>
+      <!-- 筛选按钮 -->
+      <view>
+        <u-popup :show="show" @close="show=false" @open="show=true" mode="top" overlayStyle="position: fixed;top:100rpx">
+          <!-- <view class="search_box">
+            <view class="">
+              <view class="first_order" v-for="item in orderData" :key="item.id" :class="item.id==typeid?'choose':''">
+                <text>{{item.first_order}}</text>
+              </view>
+            </view>
+            <view class="second_order">
+              <view class="second" v-for="item in orderList" :key="item.id" @click="getInfo(item.info,item.id)">
+                {{item.info}}
+              </view>
+            </view>
+          </view> -->
+        </u-popup>
+        <view @click="show = true" class="screening" :class="show?'choose_style':''">筛选</view>
+      </view>
     </view>
     <view class="list">
-      <view class="item" v-for="item in 10" :key="item">
+      <view class="item" v-for="item in 0" :key="item">
         <view class="left">
           <view class="top">
             <image class="avatar" src="../../static/logo.png"></image>
@@ -32,6 +54,7 @@
         </view>
       </view>
     </view>
+    <u-loadmore :status="status" :loading-text="loadingText" :loadmore-text="loadmoreText" :nomore-text="nomoreText" />
   </view>
 </template>
 
@@ -39,7 +62,11 @@
 export default {
   data() {
     return {
-       
+       show: false,
+       lastpage: '',
+       loadingText: '努力加载中',
+       loadmoreText: '轻轻上拉',
+       nomoreText: '我也是有底线的~~',
     }
   },
   onReady() {
@@ -58,6 +85,70 @@ export default {
 </script>
 
 <style lang="scss">
+.task_box {
+    margin: 0 auto;
+    width: 750rpx;
+    height: 98rpx;
+    background: #FFFFFF;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 0 28rpx;
+
+    .screening {
+      margin-left: 10px;
+      width: 149rpx;
+      height: 63rpx;
+      line-height: 63rpx;
+      text-align: center;
+      background: #FFFFFF;
+      border-radius: 35rpx;
+      border: 2rpx solid #E6E5E5;
+      color: #666;
+      font-size: 28rpx;
+    }
+
+    .choose_style {
+      background-color: #3274F9;
+      color: #fff;
+    }
+  }
+
+  // 筛选按钮
+  .search_box {
+    width: 750rpx;
+    // height: 368rpx;
+    background: #FFFFFF;
+    display: flex;
+
+    .first_order {
+      width: 250rpx;
+      height: 73rpx;
+      text-align: center;
+      color: #666666;
+      font-size: 28rpx;
+      line-height: 73rpx;
+      background-color: #f5f5f5;
+
+    }
+
+    .choose {
+      background-color: #fff;
+      color: #3274F9;
+    }
+
+    .second_order {
+      text-align: center;
+      width: 500rpx;
+
+      .second {
+        line-height: 73rpx;
+        height: 73rpx;
+        border-bottom: 2rpx solid #E6E6E6;
+      }
+    }
+
+  }
 .head_box{
   width: 750rpx;
   height: 98rpx;
@@ -80,7 +171,8 @@ export default {
   }
 }
 .list{
-  margin: 21rpx 28rpx 0 28rpx;
+  margin: 21rpx 28rpx;
+  padding-bottom: 21rpx;
   .item{
     width: 694rpx;
     height: 231rpx;
diff --git a/pages/oaMy/oaMy.vue b/pages/oaMy/oaMy.vue
index 08facae..f63b9f8 100644
--- a/pages/oaMy/oaMy.vue
+++ b/pages/oaMy/oaMy.vue
@@ -8,14 +8,14 @@
           <view class="" @click="login">去登陆</view>
         </view>
       </view>
-      <view class="personage">
+      <view v-else class="personage">
         <view class="my_msg flex_a_c_j_sb">
           <view class="flex_a_c">
-            <u--image :showLoading="true" :src="oaUserInfo.thumb" width="112.28rpx" height="112.28rpx" shape="circle">
+            <u--image :showLoading="true" :src="oaUserInfo.avatar" width="112.28rpx" height="112.28rpx" shape="circle">
             </u--image>
             <view class="name_work">
               <view class="name">
-                <text>{{ oaUserInfo.did_leader }}</text>
+                <text style="margin-right: 30rpx;">{{ oaUserInfo.nickname }}</text>
                 <text>{{ oaUserInfo.mobile }}</text>
               </view>
               <view class="work">
@@ -68,6 +68,7 @@
 <script>
   import { mapActions } from 'vuex'
   import { getUserIndexAPI } from '@/api/oaApi.js'
+  import { userInfo } from '@/api/oaUser.js'
   import { Toast } from '@/libs/uniApi.js'
   import { myOaData } from '@/static/server/server.js'
   // import tabbar from '../components/tabbar'
@@ -94,46 +95,6 @@
     onShow() {},
     methods: {
       ...mapActions(['getWxLogin']),
-      test() {
-        // 获取provider
-        uni.getProvider({
-          service: "payment",
-          success: (e) => {
-            console.log(e);
-            e.provider.map((value) => {
-              switch (value) {
-                case 'wxpay':
-                  break;
-                default:
-                  break;
-              }
-            })
-            let obj = {
-              "appid": "wx499********7c70e", // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致
-              "noncestr": "c5sEwbaNPiXAF3iv", // 随机字符串
-              "package": "Sign=WXPay", // 固定值
-              "partnerid": "148*****52", // 微信支付商户号
-              "prepayid": "wx202254********************fbe90000", // 统一下单订单号 
-              "timestamp": 1597935292, // 时间戳（单位：秒）
-              "sign": "A842B45937F6EFF60DEC7A2EAA52D5A0" // 签名，这里用的 MD5/RSA 签名
-            };
-            uni.requestPayment({
-              provider: 'wxpay',
-              orderInfo: obj, //微信、支付宝订单数据,就是上面那个
-              success: function(res) {
-                console.log('success:' + JSON.stringify(res));
-              },
-              fail: function(err) {
-                console.log('fail:' + JSON.stringify(err));
-              }
-            });
-          },
-          fail: (e) => {
-            console.log(e)
-            return false;
-          }
-        });
-      },
       login() {
         // #ifndef H5 || APP
         // #endif
@@ -142,9 +103,9 @@
         // #endif
       },
       async getOaUserInfo() {
-        const res = await getUserIndexAPI()
-        console.log(res, '111');
-        this.oaUserInfo = res
+        const res = await userInfo()
+        this.oaUserInfo = res.data;
+        this.$store.commit('setUserInfo', this.oaUserInfo);
       },
       naviTo(url) {
         url ?
diff --git a/pages/oaTask/oaTask.vue b/pages/oaTask/oaTask.vue
index 01573ce..d9b8cbd 100644
--- a/pages/oaTask/oaTask.vue
+++ b/pages/oaTask/oaTask.vue
@@ -23,10 +23,10 @@
       </view>
     </view>
     <!-- 新建任务 -->
-    <view class="new_task" @click="goNewTask">+新建任务</view>
+    <!-- <view class="new_task" @click="goNewTask">+新建任务</view> -->
     <!-- 事件列表 -->
     <view class="task_list">
-      <taskCard class="task_card" v-for="item in 10" :key="item"></taskCard>
+      <!-- <taskCard class="task_card" v-for="item in 10" :key="item"></taskCard> -->
     </view>
    <!-- <view class="eventList_box" v-for="item in eventData" :key="item.id">
       <view class="head_box">
@@ -110,10 +110,10 @@
 
     },
     onShow() {
-      this.params.page = '1'
-      this.eventData = []
-      //获取任务列表
-      this.getTaskList(this.params)
+      // this.params.page = '1'
+      // this.eventData = []
+      // //获取任务列表
+      // this.getTaskList(this.params)
     },
     onPageScroll() {
       //页面滚动关闭筛选
diff --git a/static/server/server.js b/static/server/server.js
index 4a1cdfb..d700c35 100644
--- a/static/server/server.js
+++ b/static/server/server.js
@@ -191,7 +191,7 @@ export const oaHomeData = [
   {
     text: '公司信息',
     icon: prefix + 'oa/qjsq@2x.png',
-    url: '/pages/views/leave_request'
+    // url: '/pages/views/leave_request'
   },
   {
     text: '人员管理',
@@ -355,17 +355,17 @@ export const myOaData = [
   {
     name: '流水详情',
     icon: 'custom-icongongzi',
-    url: '/pages/views/personal_center_two'
+    // url: '/pages/views/personal_center_two'
   },
   {
     name: '管理后台',
     icon: 'custom-icongongzi',
-    url: '/pages/views/personal_center_two'
+    // url: '/pages/views/personal_center_two'
   },
   {
     name: '片区经理',
     icon: 'custom-icongongzi',
-    url: '/pages/views/personal_center_two'
+    // url: '/pages/views/personal_center_two'
   },
   // {
   //   name: '工资详情',
diff --git a/subpkg/topUp/topUp.vue b/subpkg/topUp/topUp.vue
index 9a9630b..b835699 100644
--- a/subpkg/topUp/topUp.vue
+++ b/subpkg/topUp/topUp.vue
@@ -17,53 +17,52 @@
     <view class="price">
       <view class="title">充值金额</view>
       <view class="tab">
-        <view class="item active">50元</view>
-        <view class="item">100元</view>
-        <view class="item">200元</view>
-        <view class="item">400元</view>
-        <view class="item">800元</view>
-        <view class="item">1000元</view>
+        <view class="item" :class="index==changeMoney?'active':''" @click="changeMoney=index"
+          v-for="(item, index) in priceList" :key="index">{{item}}</view>
       </view>
-      <input class="input" type="digit" placeholder="输入充值金额(元)" v-model="payMoney.money"/>
+      <input class="input" type="digit" placeholder="输入充值金额(元)" v-model="payMoney.money" />
       <button class="btn" @click="goRecharge">充值</button>
     </view>
     <view class="tip">
       <view class="title">注意事项</view>
-      <view class="text">充值后帐户的金额不能提现，可用于商城消费使用佣金导入账户之后不能再次导出、不可提现账户充值出现问题可联系商城客服，也可拨打商城客服热线<text>4008888888</text></view>
+      <view class="text">充值后帐户的金额不能提现，可用于商城消费使用佣金导入账户之后不能再次导出、不可提现账户充值出现问题可联系商城客服，也可拨打商城客服热线<text>4008888888</text>
+      </view>
     </view>
   </view>
 </template>
 
 <script>
-import {recharge, payWay, payPrepay, wechatJsConfig} from "@/api/pay.js"
-export default {
-  data() {
-    return {
-       payMoney: {
-         money: ''
-       }
-    }
-  },
-  onLoad() {},
-  onShow() {},
-  methods: {
-    //充值
-    async goRecharge(){
-      let {data} = await recharge({
-        money: this.payMoney.money
-      });
-      let res = await payWay({
-        order_id: data.order_id,
-        from: data.from,
-      })
-      console.log(res);
-      let res1 = await payPrepay({
-        from: data.from,
-        order_id: data.order_id,
-        pay_way: res.data.lists[0].pay_way
-      })
-      console.log(res1.data, res1.data.config.package.split('=')[1]);
-      let obj = {
+  import { recharge, payWay, payPrepay, wechatJsConfig } from "@/api/pay.js"
+  export default {
+    data() {
+      return {
+        priceList: ['50元', '100元', '200元', '500元', '1000元', '2000元'],
+        changeMoney: 0,
+        payMoney: {
+          money: ''
+        }
+      }
+    },
+    onLoad() {},
+    onShow() {},
+    methods: {
+      //充值
+      async goRecharge() {
+        let { data } = await recharge({
+          money: this.payMoney.money
+        });
+        let res = await payWay({
+          order_id: data.order_id,
+          from: data.from,
+        })
+        // console.log(res);
+        let res1 = await payPrepay({
+          from: data.from,
+          order_id: data.order_id,
+          pay_way: res.data.lists[0].pay_way
+        })
+        // console.log(res1.data, res1.data.config.package.split('=')[1]);
+        let obj = {
           "appid": res1.data.config.appId, // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致
           "noncestr": res1.data.config.nonceStr, // 随机字符串
           "package": res1.data.config.package, // 固定值
@@ -72,162 +71,202 @@ export default {
           "timestamp": res1.data.config.timestamp, // 时间戳（单位：秒）
           "sign": res1.data.config.paySign
         }
-        console.log(obj);
-      uni.getProvider({
-        service:'payment',
-        success: (paymentList) => {
-          // console.log(paymentList);
-          uni.requestPayment({
-          	provider: 'wxpay',
-          	// orderInfo: res1.data.config,
-            orderInfo: obj,
-          	success: (e) => {
-          		console.log('成功', e);
-          	},
-          	fail: (e) => {
-          		console.log('error', e);
-          	},
-          	complete: () => {
-          	},
-          });
-        }
-      })
-      
-    }
-  },
-  onPullDownRefresh() {
+        // console.log(obj);
+        uni.showLoading({
+          title:'获取微信支付信息',
+          success: () => {
+            uni.getProvider({
+              service: 'payment',
+              success: (paymentList) => {
+                // console.log(paymentList);
+                uni.hideLoading();
+                uni.showLoading({
+                  title:'微信支付中'
+                })
+                uni.requestPayment({
+                  provider: 'wxpay',
+                  // orderInfo: res1.data.config,
+                  orderInfo: obj,
+                  success: (e) => {
+                    console.log('成功', e);
+                    uni.hideLoading();
+                    uni.showToast({
+                      icon:'success',
+                      title:'支付成功!'
+                    })
+                  },
+                  fail: (e) => {
+                    console.log('error', e);
+                    uni.hideLoading();
+                    uni.showToast({
+                      icon:'error',
+                      title: e.errMsg
+                    })
+                  },
+                  complete: () => {},
+                });
+              }
+            })
+          },
+          fail: (e) => {
+            uni.showToast({
+              icon:'error',
+              title:'请先安装微信'
+            })
+          }
+        })
+        
+
+      }
+    },
+    onPullDownRefresh() {
       uni.stopPullDownRefresh()
     }
   }
 </script>
 
 <style lang="scss">
-  page{
+  page {
     background-color: #fff;
   }
-.info{
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  position: relative;
-  height: 350rpx;
-  .bg{
-    background-color: #3274F9FF;
-    height: 220rpx;
-    width: 100vw;
-    border-radius: 0rpx 0rpx 28rpx 28rpx;
-    position: absolute;
-    top: 0;
-    left: 0;
-  }
-  .card{
-    width: 694rpx;
-    height: 277rpx;
-    background: #FFFFFF;
-    margin-top: 38.55rpx;
-    box-shadow: 0rpx 0rpx 18rpx 2rpx rgba(50,116,249,0.1);
-    border-radius: 14rpx 14rpx 14rpx 14rpx;
-    opacity: 1;
-    padding: 31.5rpx 28rpx;
+
+  .info {
     display: flex;
     flex-direction: column;
-    justify-content: space-between;
-    position: absolute;
-    top: 0;
-    .title{
+    align-items: center;
+    position: relative;
+    height: 350rpx;
+
+    .bg {
+      background-color: #3274F9FF;
+      height: 220rpx;
+      width: 100vw;
+      border-radius: 0rpx 0rpx 28rpx 28rpx;
+      position: absolute;
+      top: 0;
+      left: 0;
+    }
+
+    .card {
+      width: 694rpx;
+      height: 277rpx;
+      background: #FFFFFF;
+      margin-top: 38.55rpx;
+      box-shadow: 0rpx 0rpx 18rpx 2rpx rgba(50, 116, 249, 0.1);
+      border-radius: 14rpx 14rpx 14rpx 14rpx;
+      opacity: 1;
+      padding: 31.5rpx 28rpx;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      position: absolute;
+      top: 0;
+
+      .title {
+        font-size: 32rpx;
+        font-weight: 600;
+        color: #333333;
+        padding-bottom: 10rpx;
+      }
+
+      .item {
+        display: flex;
+        justify-content: space-between;
+        font-size: 32rpx;
+        font-weight: 400;
+        color: #333333;
+      }
+    }
+  }
+
+  .price {
+    display: flex;
+    flex-direction: column;
+    padding: 0 28rpx;
+
+    .title {
       font-size: 32rpx;
       font-weight: 600;
       color: #333333;
-      padding-bottom: 10rpx;
+      line-height: 39rpx;
+      margin-bottom: 42rpx;
     }
-    .item{
+
+    .tab {
       display: flex;
-      justify-content: space-between;
-      font-size: 32rpx;
-      font-weight: 400;
-      color: #333333;
+      flex-wrap: wrap;
+      justify-content: space-evenly;
+
+      .item {
+        width: 217rpx;
+        height: 131rpx;
+        margin-bottom: 20rpx;
+        border-radius: 7rpx 7rpx 7rpx 7rpx;
+        border: 2rpx solid #F5F5F5;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-size: 32rpx;
+        font-weight: 500;
+        line-height: 32rpx;
+      }
+
+      .active {
+        border: 2rpx solid #3274F9;
+        color: #3274F9;
+      }
     }
-  }
-}
-.price{
-  display: flex;
-  flex-direction: column;
-  padding: 0 28rpx;
-  .title{
-    font-size: 32rpx;
-    font-weight: 600;
-    color: #333333;
-    line-height: 39rpx;
-    margin-bottom: 42rpx;
-  }
-  .tab{
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-evenly;
-    .item{
-      width: 217rpx;
-      height: 131rpx;
-      margin-bottom: 20rpx;
-      border-radius: 7rpx 7rpx 7rpx 7rpx;
-      border: 2rpx solid #F5F5F5;
+
+    .input {
+      width: 100%;
+      height: 112rpx;
+      background: #F5F5F5;
+      border-radius: 56rpx 56rpx 56rpx 56rpx;
+      opacity: 1;
+      padding: 0 45.56rpx;
+      box-sizing: border-box;
+      font-size: 28rpx;
+      font-weight: 400;
+      color: #333;
+      line-height: 35rpx;
+    }
+
+    .btn {
+      width: 694rpx;
+      height: 84rpx;
+      margin-top: 73.6rpx;
+      background: #3274F9;
+      box-shadow: 0rpx 14rpx 44rpx 2rpx #E9EFF5;
+      border-radius: 42rpx 42rpx 42rpx 42rpx;
       display: flex;
       justify-content: center;
       align-items: center;
       font-size: 32rpx;
-      font-weight: 500;
-      line-height: 32rpx;
-    }
-    .active{
-      border: 2rpx solid #3274F9;
-      color: #3274F9;
+      font-weight: 400;
+      color: #FFFFFF;
     }
   }
-  .input{
-    width: 100%;
-    height: 112rpx;
-    background: #F5F5F5;
-    border-radius: 56rpx 56rpx 56rpx 56rpx;
-    opacity: 1;
-    padding: 0 45.56rpx;
-    box-sizing: border-box;
-    font-size: 28rpx;
-    font-weight: 400;
-    color: #333;
-    line-height: 35rpx;
-  }
-  .btn{
-    width: 694rpx;
-    height: 84rpx;
-    margin-top: 73.6rpx;
-    background: #3274F9;
-    box-shadow: 0rpx 14rpx 44rpx 2rpx #E9EFF5;
-    border-radius: 42rpx 42rpx 42rpx 42rpx;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    font-size: 32rpx;
-    font-weight: 400;
-    color: #FFFFFF;
-  }
-}
-.tip{
+
+  .tip {
     display: flex;
     flex-direction: column;
     padding: 0 28rpx;
     margin-top: 84rpx;
-    .title{
+
+    .title {
       font-size: 32rpx;
       font-weight: 500;
       color: #3274F9;
       line-height: 32rpx;
       margin-bottom: 21rpx;
     }
-    .text{
+
+    .text {
       font-size: 28rpx;
       font-weight: 400;
-      color: rgba(0,0,0,0.6);
+      color: rgba(0, 0, 0, 0.6);
       line-height: 42rpx;
       -webkit-background-clip: text;
     }
-}
-</style>
+  }
+</style>
\ No newline at end of file