Ver Fonte

feat:发红包前端页面

qianxinyu há 4 meses atrás
pai
commit
48e79c57e8

+ 1 - 0
App.vue

@@ -86,6 +86,7 @@ page {
   font-family: Arial, Helvetica, sans-serif;
   background: #f5f5f5;
 }
+
 // 到底了
 .to_bottom {
   height: 40rpx;

+ 246 - 239
pages.json

@@ -1,241 +1,248 @@
 {
-	"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
-		{
-			"path": "pages/index/index",
-			"style": {
-				"navigationBarTitleText": "开邻智数",
-				"enablePullDownRefresh": true
-			}
-		},
-		{
-			"path": "pages/car/index",
-			"style": {
-				"navigationBarTitleText": "购物车"
-			}
-		},
-		{
-			"path": "pages/car/order",
-			"style": {
-				"navigationBarTitleText": "提交预约"
-			}
-		},
-		{
-			"path": "pages/user/index",
-			"style": {
-				"navigationBarTitleText": "我的"
-			}
-		},
-		{
-			"path": "pages/user/settings",
-			"style": {
-
-				"navigationBarTitleText": "设置"
-			}
-		},
-		{
-			"path" : "pages/coupon/index",
-			"style" :
-			{
-				"navigationBarTitleText" : "优惠券",
-				"enablePullDownRefresh": true
-			}
-		},
-		{
-			"path" : "pages/orders/index",
-			"style" : 
-			{
-				"navigationBarTitleText" : "预约中心",
-				"enablePullDownRefresh": true
-			}
-		},
-		{
-			"path" : "pages/product/index",
-			"style" : 
-			{
-				"navigationBarTitleText" : "商品详情"
-			}
-		},
-		{
-			"path" : "pages/user/info",
-			"style" : 
-			{
-				"navigationBarTitleText" : "信息设置"
-			}
-		},
-		{
-			"path" : "pages/login/index",
-			"style" : 
-			{
-				"navigationBarTitleText" : "登录注册"
-			}
-		},
-		{
-			"path" : "pages/bind/user",
-			"style" : 
-			{
-				"navigationBarTitleText" : "客户绑定"
-			}
-		},
-		{
-			"path" : "pages/addr/index",
-			"style" : 
-			{
-				"navigationBarTitleText" : "收货地址"
-			}
-		},
-		{
-			"path" : "pages/score/record",
-			"style" : 
-			{
-				"navigationBarTitleText" : "积分记录",
-				"enablePullDownRefresh": true
-			}
-		},
-		{
-			"path" : "pages/score/clockin",
-			"style" : 
-			{
-				"navigationBarTitleText" : "积分签到",
-				"navigationStyle":"custom"
-			}
-		},
-		{
-			"path" : "pages/score/index",
-			"style" : 
-			{
-				"navigationBarTitleText" : "积分产品"
-			}
-		},
-		{
-			"path" : "pages/score/product",
-			"style" : 
-			{
-				"navigationBarTitleText" : "产品详情"
-			}
-		},
-		{
-			"path" : "pages/score/orders",
-			"style" : 
-			{
-				"navigationBarTitleText" : "兑换记录"
-			}
-		},
-		{
-			"path" : "pages/orders/completion",
-			"style" : 
-			{
-				"navigationBarTitleText" : "报单成功"
-			}
-		},
-		{
-			"path" : "pages/webview/index",
-			"style" : 
-			{
-				"navigationBarTitleText" : "活动页面"
-			}
-		},
-		{
-			"path" : "pages/user/follow",
-			"style" : 
-			{
-				"navigationBarTitleText" : "添加客服"
-			}
-		},
-		{
-			"path" : "pages/coupon/product",
-			"style" : 
-			{
-				"navigationBarTitleText" : "可用商品"
-			}
-		},
-		{
-			"path" : "pages/score/lottery",
-			"style" : 
-			{
-				"navigationBarTitleText" : "积分抽奖"
-			}
-		},
-		{
-			"path" : "pages/coupon/active",
-			"style" : 
-			{
-				"navigationBarTitleText" : "领券活动"
-			}
-		},
-		{
-			"path" : "pages/orders/lottery",
-			"style" : 
-			{
-				"navigationBarTitleText" : "下单抽奖"
-			}
-		},
-		{
-			"path" : "pages/recruitment/index",
-			"style" :
-			{
-				"navigationBarTitleText" : "拉新活动"
-			}
-		},
-		{
-			"path" : "pages/recruitment/record",
-			"style" :
-			{
-				"navigationBarTitleText" : "奖励记录"
-			}
-		},
-		{
-			"path" : "pages/orders/receipt",
-			"style" : 
-			{
-				"navigationBarTitleText" : "订单回执"
-			}
-		},
-		{
-			"path" : "pages/orders/detail",
-			"style" : 
-			{
-				"navigationBarTitleText" : "订单详情"
-			}
-		}
-	],
-	"globalStyle": {
-		"navigationBarTextStyle": "black",
-		"navigationBarTitleText": "uni-app",
-		"navigationBarBackgroundColor": "#F8F8F8",
-		"backgroundColor": "#F8F8F8"
-	},
-	"uniIdRouter": {},
-	"tabBar": {
-		"color": "#333333",
-		"selectedColor": "#333333",
-		"backgroundColor": "#F8F8F8",
-		"borderStyle": "white",
-		"position": "bottom",
-		"list": [{
-			"pagePath": "pages/index/index",
-			"iconPath": "static/icon/home.png",
-			"selectedIconPath": "static/icon/home_active.png",
-			"text": "首页"
-		},{
-			"pagePath": "pages/score/index",
-			"iconPath": "static/tabbar/score.png",
-			"selectedIconPath": "static/tabbar/score_active.png",
-			"text": "积分"
-		}, {
-			"pagePath": "pages/score/clockin",
-			"iconPath": "static/tabbar/clockin.png",
-			"selectedIconPath": "static/tabbar/clockin_active.png",
-			"text": "签到"
-		},{
-			"pagePath": "pages/car/index",
-			"iconPath": "static/icon/car.png",
-			"selectedIconPath": "static/icon/car_active.png",
-			"text": "购物车"
-		}, {
-			"pagePath": "pages/user/index",
-			"iconPath": "static/icon/user.png",
-			"selectedIconPath": "static/icon/user_active.png",
-			"text": "我的"
-		}]
-	}
+  "pages": [
+    //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
+    {
+      "path": "pages/index/index",
+      "style": {
+        "navigationBarTitleText": "开邻智数",
+        "enablePullDownRefresh": true
+      }
+    },
+    {
+      "path": "pages/car/index",
+      "style": {
+        "navigationBarTitleText": "购物车"
+      }
+    },
+    {
+      "path": "pages/car/order",
+      "style": {
+        "navigationBarTitleText": "提交预约"
+      }
+    },
+    {
+      "path": "pages/user/index",
+      "style": {
+        "navigationBarTitleText": "我的"
+      }
+    },
+    {
+      "path": "pages/user/settings",
+      "style": {
+        "navigationBarTitleText": "设置"
+      }
+    },
+    {
+      "path": "pages/coupon/index",
+      "style": {
+        "navigationBarTitleText": "优惠券",
+        "enablePullDownRefresh": true
+      }
+    },
+    {
+      "path": "pages/orders/index",
+      "style": {
+        "navigationBarTitleText": "预约中心",
+        "enablePullDownRefresh": true
+      }
+    },
+    {
+      "path": "pages/product/index",
+      "style": {
+        "navigationBarTitleText": "商品详情"
+      }
+    },
+    {
+      "path": "pages/user/info",
+      "style": {
+        "navigationBarTitleText": "信息设置"
+      }
+    },
+    {
+      "path": "pages/login/index",
+      "style": {
+        "navigationBarTitleText": "登录注册"
+      }
+    },
+    {
+      "path": "pages/bind/user",
+      "style": {
+        "navigationBarTitleText": "客户绑定"
+      }
+    },
+    {
+      "path": "pages/addr/index",
+      "style": {
+        "navigationBarTitleText": "收货地址"
+      }
+    },
+    {
+      "path": "pages/score/record",
+      "style": {
+        "navigationBarTitleText": "积分记录",
+        "enablePullDownRefresh": true
+      }
+    },
+    {
+      "path": "pages/score/clockin",
+      "style": {
+        "navigationBarTitleText": "积分签到",
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/score/index",
+      "style": {
+        "navigationBarTitleText": "积分产品"
+      }
+    },
+    {
+      "path": "pages/score/product",
+      "style": {
+        "navigationBarTitleText": "产品详情"
+      }
+    },
+    {
+      "path": "pages/score/orders",
+      "style": {
+        "navigationBarTitleText": "兑换记录"
+      }
+    },
+    {
+      "path": "pages/orders/completion",
+      "style": {
+        "navigationBarTitleText": "报单成功"
+      }
+    },
+    {
+      "path": "pages/webview/index",
+      "style": {
+        "navigationBarTitleText": "活动页面"
+      }
+    },
+    {
+      "path": "pages/user/follow",
+      "style": {
+        "navigationBarTitleText": "添加客服"
+      }
+    },
+    {
+      "path": "pages/coupon/product",
+      "style": {
+        "navigationBarTitleText": "可用商品"
+      }
+    },
+    {
+      "path": "pages/score/lottery",
+      "style": {
+        "navigationBarTitleText": "积分抽奖"
+      }
+    },
+    {
+      "path": "pages/coupon/active",
+      "style": {
+        "navigationBarTitleText": "领券活动"
+      }
+    },
+    {
+      "path": "pages/orders/lottery",
+      "style": {
+        "navigationBarTitleText": "下单抽奖"
+      }
+    },
+    {
+      "path": "pages/recruitment/index",
+      "style": {
+        "navigationBarTitleText": "拉新活动"
+      }
+    },
+    {
+      "path": "pages/recruitment/record",
+      "style": {
+        "navigationBarTitleText": "奖励记录"
+      }
+    },
+    {
+      "path": "pages/orders/receipt",
+      "style": {
+        "navigationBarTitleText": "订单回执"
+      }
+    },
+    {
+      "path": "pages/orders/detail",
+      "style": {
+        "navigationBarTitleText": "订单详情"
+      }
+    },
+    {
+      "path": "pages/redPacket/index",
+      "style": {
+        "navigationBarTitleText": "领取红包"
+      }
+    },
+    {
+      "path": "pages/user/withdraw",
+      "style": {
+        "navigationBarTitleText": "提现"
+      }
+    },
+    {
+      "path": "pages/balance/index",
+      "style": {
+        "navigationBarTitleText": "余额明细"
+      }
+    },
+    {
+      "path": "pages/balance/detail",
+      "style": {
+        "navigationBarTitleText": "余额详情"
+      }
+    }
+  ],
+  "globalStyle": {
+    "navigationBarTextStyle": "black",
+    "navigationBarTitleText": "uni-app",
+    "navigationBarBackgroundColor": "#F8F8F8",
+    "backgroundColor": "#F8F8F8"
+  },
+  "uniIdRouter": {},
+  "tabBar": {
+    "color": "#333333",
+    "selectedColor": "#333333",
+    "backgroundColor": "#F8F8F8",
+    "borderStyle": "white",
+    "position": "bottom",
+    "list": [
+      {
+        "pagePath": "pages/index/index",
+        "iconPath": "static/icon/home.png",
+        "selectedIconPath": "static/icon/home_active.png",
+        "text": "首页"
+      },
+      {
+        "pagePath": "pages/score/index",
+        "iconPath": "static/tabbar/score.png",
+        "selectedIconPath": "static/tabbar/score_active.png",
+        "text": "积分"
+      },
+      {
+        "pagePath": "pages/score/clockin",
+        "iconPath": "static/tabbar/clockin.png",
+        "selectedIconPath": "static/tabbar/clockin_active.png",
+        "text": "签到"
+      },
+      {
+        "pagePath": "pages/car/index",
+        "iconPath": "static/icon/car.png",
+        "selectedIconPath": "static/icon/car_active.png",
+        "text": "购物车"
+      },
+      {
+        "pagePath": "pages/user/index",
+        "iconPath": "static/icon/user.png",
+        "selectedIconPath": "static/icon/user_active.png",
+        "text": "我的"
+      }
+    ]
+  }
 }

+ 88 - 0
pages/balance/detail.vue

@@ -0,0 +1,88 @@
+<template>
+  <view class="container">
+    <!-- 金额显示 -->
+    <view class="amount-section">
+      <text class="amount">+0.50</text>
+      <text class="description">签到打卡</text>
+    </view>
+
+    <!-- 交易信息 -->
+    <view class="details-section">
+      <view class="detail-item">
+        <text class="label">交易类型</text>
+        <text class="value">收入</text>
+      </view>
+      <view class="detail-item">
+        <text class="label">交易时间</text>
+        <text class="value">2025-01-10 13:12:12</text>
+      </view>
+      <view class="detail-item">
+        <text class="label">记录编码</text>
+        <text class="value">klpt000000036</text>
+      </view>
+      <view class="detail-item">
+        <text class="label">交易后余额</text>
+        <text class="value">78.78</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    goBack() {
+      uni.navigateBack();
+    },
+  },
+};
+</script>
+
+<style scoped>
+/* 容器样式 */
+.container {
+  padding: 16px;
+  background-color: #ffffff;
+  min-height: 100vh;
+  font-size: 16px;
+}
+
+/* 金额显示样式 */
+.amount-section {
+  margin: 20px 0;
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+}
+
+.amount {
+  font-size: 32px;
+  color: #ff5e00;
+  font-weight: bold;
+}
+
+.description {
+  font-size: 16px;
+  color: #666;
+  margin-top: 5px;
+}
+
+/* 交易详情样式 */
+.details-section {
+  margin-top: 20px;
+}
+
+.detail-item {
+  display: flex;
+  justify-content: space-between;
+  padding: 10px 0;
+}
+
+.label {
+  color: #666;
+}
+
+.value {
+  color: #333;
+}
+</style>

+ 89 - 0
pages/balance/index.vue

@@ -0,0 +1,89 @@
+<template>
+  <view class="balance">
+    <view class="date_picker">
+      <picker mode="date" :value="selectedDate" fields="month" @change="_bindDateChange">
+        <view>{{ formattedDate }}</view>
+      </picker>
+    </view>
+    <view class="balance_list">
+      <view class="balance_date">2025年1月</view>
+      <view class="balance_item" @click="_goDetail">
+        <view class="balance_item_left">
+          <view style="margin-bottom: 10rpx">签到打卡</view>
+          <view>2025-01-01 12:00</view>
+        </view>
+        <view class="balance_item_right">
+          <view class="price">+1.00</view>
+          <view>余额:78.78</view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref, computed } from "vue";
+
+const selectedDate = ref("请选择日期");
+
+const _bindDateChange = (e) => {
+  selectedDate.value = e.detail.value;
+};
+
+const _goDetail = () => {
+  uni.navigateTo({
+    url: "/pages/balance/detail",
+  });
+};
+
+const formattedDate = computed(() => {
+  if (selectedDate.value === "请选择日期") {
+    return selectedDate.value;
+  }
+  const [year, month] = selectedDate.value.split("-");
+  return `${year}年${parseInt(month)}月`;
+});
+</script>
+
+<style scoped lang="less">
+.balance {
+  padding: 36rpx;
+  box-sizing: border-box;
+  width: 100vw;
+  .date_picker {
+    padding: 0 16rpx;
+    border: 1px solid #e5e5e5;
+    width: 250rpx;
+    height: 60rpx;
+    line-height: 60rpx;
+    margin-bottom: 40rpx;
+  }
+  .balance_list {
+    .balance_date {
+      font-weight: bold;
+      padding-bottom: 20rpx;
+      border-bottom: 2rpx solid #ddd;
+    }
+    .balance_item {
+      margin-bottom: 20rpx;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .balance_item_left,
+      .balance_item_right {
+        display: flex;
+        flex-direction: column;
+        font-size: 26rpx;
+        margin-top: 20rpx;
+      }
+      .balance_item_right {
+        align-items: flex-end;
+        > .price {
+          font-weight: bold;
+          margin-bottom: 10rpx;
+        }
+      }
+    }
+  }
+}
+</style>

+ 84 - 0
pages/redPacket/index.vue

@@ -0,0 +1,84 @@
+<template>
+  <view class="red_packet" catchtouchmove="true">
+    <image src="../../static/icon/red_packet_background.jpg" class="read_packet_background" />
+    <view class="rule">活动规则</view>
+    <view class="get_content">
+      <view class="custom_button"> 立即领取 </view>
+      <text>点击领取后,红包将自动到账余额</text>
+    </view>
+  </view>
+</template>
+
+<script></script>
+
+<style lang="less" scoped>
+.red_packet {
+  width: 100vw;
+  height: 100vh;
+  position: relative;
+  .read_packet_background {
+    width: 100%;
+    height: 100%;
+  }
+  .rule {
+    position: absolute;
+    right: 0;
+    top: 26%;
+    color: #846100;
+    padding: 15rpx 35rpx;
+    background-color: #ffedad;
+    border-radius: 60rpx;
+    text-align: center;
+    font-size: 28rpx;
+  }
+
+  .get_content {
+    position: absolute;
+    bottom: 18%;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    > text {
+      color: #fff;
+      font-size: 26rpx;
+      margin-top: 20rpx;
+    }
+  }
+  .custom_button {
+    display: inline-block;
+    background-color: #fbe6a0;
+    color: #9c6c11;
+    font-size: 18px;
+    padding: 6px 30px;
+    border-radius: 8px;
+    text-align: center;
+    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
+    border: 2px solid transparent;
+    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
+    position: relative;
+  }
+
+  .custom_button:before,
+  .custom_button:after {
+    content: "";
+    position: absolute;
+    width: 24px;
+    height: 24px;
+    background-color: #fbe6a0;
+    border: 2px solid #fbe6a0;
+    border-radius: 10rpx;
+    top: 50%;
+    transform: translateY(-50%);
+  }
+
+  .custom_button:before {
+    left: -6px;
+  }
+
+  .custom_button:after {
+    right: -6px;
+  }
+}
+</style>

+ 278 - 207
pages/user/index.vue

@@ -1,220 +1,291 @@
 <template>
-	<view>
-		<view class="user_box">
-			<view class="box_left">
-				<navigator url="/pages/user/settings" > 
-					<image class="user_image"  :src="userInfo.userpic" ></image>
-				</navigator>
-			</view>
-			<view class="box_center">
-				<view class="user_name">{{userInfo.username}}</view>
-				<view class="user_info">{{userInfo.phone}}</view>
-			</view>
-			<view class="box_right">
-				<navigator url="/pages/user/info" class="company_text" v-if="!userInfo.city_id">请选择城市</navigator>
-				<navigator url="/pages/user/settings" class="setting_page" v-if="userInfo.city_id" >
-					<image class="setting_icon"  src="../../static/icon/setting.png" ></image>
-				</navigator>
-			</view>
-		</view>
-		<view class="navigator_list">
-			<navigator class="navigator_item" url="/pages/orders/index" >
-				<image class="navigator_image" src="../../static/icon/orders.png" mode=""></image>
-				<view class="navigator_title">预约</view>
-			</navigator>
-			<navigator class="navigator_item" url="/pages/coupon/index" >
-				<image class="navigator_image" src="../../static/icon/coupon.png" mode=""></image>
-				<view class="navigator_title">优惠券</view>
-			</navigator>
-			<navigator class="navigator_item" url="/pages/score/orders" >
-				<image class="navigator_image" src="../../static/icon/score_gift.png" mode=""></image>
-				<view class="navigator_title">积分订单</view>
-			</navigator>
-      <navigator class="navigator_item" url="/pages/recruitment/index" >
+  <view>
+    <view class="user_box">
+      <view class="box_left">
+        <navigator url="/pages/user/settings">
+          <image class="user_image" :src="userInfo.userpic"></image>
+        </navigator>
+      </view>
+      <view class="box_center">
+        <view class="user_name">{{ userInfo.username }}</view>
+        <view class="user_info">{{ userInfo.phone }}</view>
+      </view>
+      <view class="box_right">
+        <navigator url="/pages/user/info" class="company_text" v-if="!userInfo.city_id">请选择城市</navigator>
+        <navigator url="/pages/user/settings" class="setting_page" v-if="userInfo.city_id">
+          <image class="setting_icon" src="../../static/icon/setting.png"></image>
+        </navigator>
+      </view>
+    </view>
+    <view class="balance_content">
+      <view class="balance_content_main">
+        <view style="display: flex">
+          <view class="price_content" style="margin-right: 45rpx"> <text class="title">当前余额(元)</text> <text>0.00</text></view>
+          <view class="price_content"> <text class="title">已成功提现(元)</text> <text>0.00</text></view>
+        </view>
+        <view class="withdraw_btn" @click="_goWithdraw">提现</view>
+      </view>
+      <view class="balance_content_detail" @click="_goBalance">
+        <view>查看余额明细</view>
+        <view>></view>
+      </view>
+    </view>
+    <view class="navigator_list">
+      <navigator class="navigator_item" url="/pages/orders/index">
+        <image class="navigator_image" src="../../static/icon/orders.png" mode=""></image>
+        <view class="navigator_title">预约</view>
+      </navigator>
+      <navigator class="navigator_item" url="/pages/coupon/index">
+        <image class="navigator_image" src="../../static/icon/coupon.png" mode=""></image>
+        <view class="navigator_title">优惠券</view>
+      </navigator>
+      <navigator class="navigator_item" url="/pages/score/orders">
+        <image class="navigator_image" src="../../static/icon/score_gift.png" mode=""></image>
+        <view class="navigator_title">积分订单</view>
+      </navigator>
+      <navigator class="navigator_item" url="/pages/recruitment/index">
         <image class="navigator_image" src="../../static/icon/score_gift.png" mode=""></image>
         <view class="navigator_title">拉新活动</view>
       </navigator>
-		</view>
-		<view class="alter_info">本程序暂不提供在线交易以及支付功能,您所提交的预约,我们将验证您的购药资质并交由有售卖药品资质的商业公司与您联系确认并提供线下后续服务。</view>
-	</view>
+    </view>
+    <view class="alter_info">本程序暂不提供在线交易以及支付功能,您所提交的预约,我们将验证您的购药资质并交由有售卖药品资质的商业公司与您联系确认并提供线下后续服务。</view>
+    <image src="../../static/icon/red_packet.gif" class="red_packet" @click="_getRedPacket" />
+  </view>
 </template>
 
 <script>
-
-  export default {
-		data() {
-			return {
-				userInfo:{
-					username:"请登录",
-					userpic:"../../static/icon/doctor.png",
-					phone:"kailin",
-					status:0,
-					city_id:0,
-				},
-			}
-		},
-		onLoad(param) {
-      // 存储分享标识
-      if (param.share_uid){
-        uni.setStorageSync('share_uid',param.share_uid);
-        console.log('share_uid',param.share_uid)
-      }
-			// #ifdef MP-WEIXIN
-			//分享按钮
-			uni.showShareMenu({
-				withShareTicket: true,
-				menus: ['shareAppMessage', 'shareTimeline']
-			})
-			// #endif
-		},
-		onShareAppMessage(obj) {
-      //获取当前用户信息
-      let userInfo  = uni.getStorageSync("userInfo");
-      let param     = '';
-      if (userInfo.uid){
-        param       = '?share_uid='+userInfo.uid;
+export default {
+  data() {
+    return {
+      userInfo: {
+        username: "请登录",
+        userpic: "../../static/icon/doctor.png",
+        phone: "kailin",
+        status: 0,
+        city_id: 0,
+      },
+    };
+  },
+  onLoad(param) {
+    // 存储分享标识
+    if (param.share_uid) {
+      uni.setStorageSync("share_uid", param.share_uid);
+      console.log("share_uid", param.share_uid);
+    }
+    // #ifdef MP-WEIXIN
+    //分享按钮
+    uni.showShareMenu({
+      withShareTicket: true,
+      menus: ["shareAppMessage", "shareTimeline"],
+    });
+    // #endif
+  },
+  onShareAppMessage(obj) {
+    //获取当前用户信息
+    let userInfo = uni.getStorageSync("userInfo");
+    let param = "";
+    if (userInfo.uid) {
+      param = "?share_uid=" + userInfo.uid;
+    }
+    // 获取分享信息
+    let shareList = getApp().globalData.shareList;
+    // 获取分享信息
+    let shareObj = {
+      title: "药优惠 得积分 兑豪礼",
+      //path: '/pages/score/lottery',
+      path: "/pages/user/index",
+      imageUrl: "",
+    };
+    // 循环列表
+    for (let i in shareList) {
+      if (shareList[i].pages == "pages/user/index") {
+        shareObj.path = shareList[i].path ? shareList[i].path : shareObj.path;
+        shareObj.title = shareList[i].title ? shareList[i].title : shareObj.title;
+        shareObj.imageUrl = shareList[i].image_url ? shareList[i].image_url : shareObj.imageUrl;
       }
-			// 获取分享信息
-			let shareList 	= getApp().globalData.shareList;
-			// 获取分享信息
-			let shareObj	= {
-								title: '药优惠 得积分 兑豪礼',
-								//path: '/pages/score/lottery',
-								path: '/pages/user/index',
-								imageUrl:'',
-							};
-			// 循环列表
-			for ( let i in shareList ) {
-				if( shareList[i].pages == 'pages/user/index' ) {
-					shareObj.path  = shareList[i].path ? shareList[i].path : shareObj.path ;
-					shareObj.title  = shareList[i].title ? shareList[i].title : shareObj.title ;
-					shareObj.imageUrl  = shareList[i].image_url ? shareList[i].image_url : shareObj.imageUrl ;
-				}
-			}
-      if (param){
-        shareObj.path   +=  param;
+    }
+    if (param) {
+      shareObj.path += param;
+    }
+    // 返回分享信息
+    return shareObj;
+  },
+  onShow() {
+    // 登录提示
+    if (!this.$checkAccess.alterLogin()) return;
+    // 判断数据
+    this.$http.request("api/custom/get_info").then((callback) => {
+      if (callback.code == "success") {
+        if (!callback.data.userpic) callback.data.userpic = "../../static/icon/doctor.png";
+        // 赋值
+        this.userInfo = callback.data;
+        // 存储登录标识
+        uni.setStorageSync("userInfo", callback.data);
       }
-			// 返回分享信息
-			return shareObj;
-		},
-		onShow() {
-			// 登录提示
-			if( !this.$checkAccess.alterLogin() ) return ;
-			// 判断数据
-			this.$http.request('api/custom/get_info').then((callback)=>{
-				if( callback.code == 'success' ){
-					if( !callback.data.userpic ) callback.data.userpic = "../../static/icon/doctor.png";
-					// 赋值
-					this.userInfo = callback.data;
-					// 存储登录标识
-					uni.setStorageSync('userInfo',callback.data);
-				}
-			});
-		},
-		methods: {
-			
-		}
-	}
+    });
+  },
+  methods: {
+    _getRedPacket() {
+      uni.navigateTo({
+        url: "/pages/redPacket/index",
+      });
+    },
+    _goWithdraw() {
+      uni.navigateTo({
+        url: "/pages/user/withdraw",
+      });
+    },
+    _goBalance() {
+      uni.navigateTo({
+        url: "/pages/balance/index",
+      });
+    },
+  },
+};
 </script>
 
 <style lang="less">
-	.user_box{
-		width: 680rpx;
-		height: 180rpx;
-		overflow: hidden;
-		background: #FFFFFF;
-		padding: 10rpx 35rpx;
-		.box_left{
-			float: left;
-			display: block;
-			width: 140rpx;
-			height: 140rpx;
-			.user_image{
-				display: block;
-				width: 120rpx;
-				height: 120rpx;
-				border-radius: 50%;
-				margin: 10rpx auto;
-			}
-		}
-		.box_center{
-			float: left;
-			width: 300rpx;
-			height: 140rpx;
-			margin-left: 35rpx;
-			.user_name{
-				font-size: 30rpx;
-				line-height: 80rpx;
-			}
-			.user_info{
-				color: #999999;
-				font-size: 24rpx;
-				line-height: 60rpx;
-			}
-		}
-		.box_right{
-			float: right;
-			width: 140rpx;
-			height: 140rpx;
-			font-size: 20rpx;
-			line-height: 140rpx;
-			.setting_page{
-				width: 140rpx;
-				height: 140rpx;
-				display: block;
-				overflow: hidden;
-				.setting_icon{
-					width: 60rpx;
-					height: 60rpx;
-					display: block;
-					margin: 40rpx auto;
-				}
-			}
-			.company_text{
-				color: #E03519;
-				width: 140rpx;
-				height: 140rpx;
-				font-size: 20rpx;
-				text-align: center;
-				line-height: 140rpx;
-			}
-		}
-	}
-	.navigator_list{
-		display: flex; // 弹性盒模型
-		overflow: hidden;
-		margin: 20rpx auto;
-		background: #FFFFFF;
-		padding: 35rpx 0rpx;
-		.navigator_item{
-			float: left;
-			height: 160rpx;
-			display: block;
-			margin: 0rpx auto;
-			text-align: center;
-			.navigator_image{
-				width: 80rpx;
-				height: 80rpx;
-				margin: 20rpx auto;
-				border-radius: 5rpx;
-			}
-			.navigator_title{
-				width: 120rpx;
-				display: block;
-				font-size: 30rpx;
-				line-height: 40rpx;
-				text-align: center;
-			}
-		}
-	}
-	.alter_info{
-		display: block;
-		color: #E03519;
-		font-size: 20rpx;
-		overflow: hidden;
-		margin: 20rpx auto;
-		background: #FFFFFF;
-		line-height: 40rpx;
-		padding: 35rpx 35rpx;
-	}
+.user_box {
+  width: 680rpx;
+  height: 180rpx;
+  overflow: hidden;
+  background: #ffffff;
+  padding: 10rpx 35rpx;
+  .box_left {
+    float: left;
+    display: block;
+    width: 140rpx;
+    height: 140rpx;
+    .user_image {
+      display: block;
+      width: 120rpx;
+      height: 120rpx;
+      border-radius: 50%;
+      margin: 10rpx auto;
+    }
+  }
+  .box_center {
+    float: left;
+    width: 300rpx;
+    height: 140rpx;
+    margin-left: 35rpx;
+    .user_name {
+      font-size: 30rpx;
+      line-height: 80rpx;
+    }
+    .user_info {
+      color: #999999;
+      font-size: 24rpx;
+      line-height: 60rpx;
+    }
+  }
+  .box_right {
+    float: right;
+    width: 140rpx;
+    height: 140rpx;
+    font-size: 20rpx;
+    line-height: 140rpx;
+    .setting_page {
+      width: 140rpx;
+      height: 140rpx;
+      display: block;
+      overflow: hidden;
+      .setting_icon {
+        width: 60rpx;
+        height: 60rpx;
+        display: block;
+        margin: 40rpx auto;
+      }
+    }
+    .company_text {
+      color: #e03519;
+      width: 140rpx;
+      height: 140rpx;
+      font-size: 20rpx;
+      text-align: center;
+      line-height: 140rpx;
+    }
+  }
+}
+.navigator_list {
+  display: flex; // 弹性盒模型
+  overflow: hidden;
+  margin: 20rpx auto;
+  background: #ffffff;
+  padding: 35rpx 0rpx;
+  .navigator_item {
+    float: left;
+    height: 160rpx;
+    display: block;
+    margin: 0rpx auto;
+    text-align: center;
+    .navigator_image {
+      width: 80rpx;
+      height: 80rpx;
+      margin: 20rpx auto;
+      border-radius: 5rpx;
+    }
+    .navigator_title {
+      width: 120rpx;
+      display: block;
+      font-size: 30rpx;
+      line-height: 40rpx;
+      text-align: center;
+    }
+  }
+}
+.alter_info {
+  display: block;
+  color: #e03519;
+  font-size: 20rpx;
+  overflow: hidden;
+  margin: 20rpx auto;
+  background: #ffffff;
+  line-height: 40rpx;
+  padding: 35rpx 35rpx;
+}
+.balance_content {
+  margin: 20rpx;
+  padding: 35rpx;
+  background-color: #fff;
+  box-sizing: border-box;
+  .balance_content_main {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 36rpx;
+    .price_content {
+      display: flex;
+      flex-direction: column;
+      > .title {
+        font-size: 24rpx;
+        margin-bottom: 15rpx;
+      }
+    }
+    .withdraw_btn {
+      color: #ffffff;
+      background-color: #169bd5;
+      border-radius: 60rpx;
+      padding: 10rpx 20rpx;
+      width: 90rpx;
+      text-align: center;
+      line-height: 40rpx;
+    }
+  }
+  .balance_content_detail {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border-top: 2rpx solid #f3f3f3;
+    font-size: 24rpx;
+    padding-top: 18rpx;
+  }
+}
+.red_packet {
+  position: absolute;
+  right: 0;
+  bottom: 15%;
+  width: 160rpx;
+  height: 160rpx;
+}
 </style>

+ 125 - 0
pages/user/withdraw.vue

@@ -0,0 +1,125 @@
+<template>
+  <view class="withdraw" catchtouchmove="true">
+    <view class="withdraw_content">
+      <view class="title">提现金额</view>
+      <view class="content">
+        <view>¥</view>
+        <input type="number" class="input" v-model="withdrawAmount" @blur="_valiteMoney" />
+      </view>
+      <view class="bottom">
+        <text>当前可提现余额{{ maxWithdrawAmount }}元</text>
+        <view style="color: #5baff4" @click="_getAll">全部提现</view>
+      </view>
+    </view>
+    <button class="withdraw_btn" :class="isDisabled ? 'disabled' : ''" @click="_getMoney">确定提现</button>
+  </view>
+</template>
+
+<script setup>
+import { ref, watch } from "vue";
+
+const withdrawAmount = ref(0);
+const maxWithdrawAmount = ref(134.14);
+const isDisabled = ref(true);
+
+const _valiteMoney = (e) => {
+  if (!isNaN(e.target.value)) {
+    if (maxWithdrawAmount.value < e.target.value) {
+      withdrawAmount.value = maxWithdrawAmount.value;
+    } else withdrawAmount.value = e.target.value;
+  } else {
+    // 如果不是数字,可以设置为0或者其他默认值
+    withdrawAmount.value = 0;
+  }
+};
+
+const _getAll = () => {
+  withdrawAmount.value = maxWithdrawAmount.value;
+};
+
+const _getMoney = () => {
+  if (isDisabled.value) return;
+  uni.showModal({
+    title: "温馨提示",
+    content: "您已成功提现,请注意查看信息",
+    showCancel: false,
+    confirmText: "确认",
+    success: (res) => {
+      if (res.confirm) {
+        console.log("用户点击确认");
+      }
+    },
+  });
+};
+
+watch(withdrawAmount, (newValue) => {
+  isDisabled.value = isNaN(newValue) || newValue == 0;
+});
+</script>
+
+<style lang="less" scoped>
+.withdraw {
+  width: 100vw;
+  height: 100vh;
+  padding: 46rpx 26rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  box-sizing: border-box;
+  background-color: #ffffff;
+  .withdraw_content {
+    border: 1px solid #f3f3f3;
+    border-radius: 6px;
+    width: 100%;
+    padding: 20rpx;
+    box-sizing: border-box;
+    .title {
+      font-weight: bold;
+      margin-bottom: 36rpx;
+    }
+    .content {
+      position: relative;
+      border-bottom: 2rpx solid #f3f3f3;
+      padding: 10rpx 0;
+      box-sizing: border-box;
+      input {
+        width: 100%;
+        height: 60rpx;
+        font-size: 36rpx;
+        border-radius: 6px;
+        padding-left: 45rpx;
+      }
+      view {
+        position: absolute;
+        left: 5rpx;
+        top: 50%;
+        transform: translateY(-50%);
+        font-size: 36rpx;
+      }
+    }
+    .bottom {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      font-size: 28rpx;
+      margin-top: 20rpx;
+    }
+  }
+  .withdraw_btn {
+    width: 100%;
+    height: 70rpx;
+    background-color: #169bd5;
+    color: #ffffff;
+    font-size: 36rpx;
+    border-radius: 10rpx;
+    line-height: 70rpx;
+    box-shadow: 0rpx 5rpx 10rpx #169bd5;
+    &.disabled {
+      background-color: #97d2ec;
+      color: #fff;
+      box-shadow: none;
+    }
+  }
+}
+</style>

BIN
static/icon/red_packet.gif


BIN
static/icon/red_packet_background.jpg