6 changed files with 587 additions and 484 deletions
@ -1,167 +1,199 @@ |
|||
<!--pages/user/user.wxml--> |
|||
<view> |
|||
<image lazy-load class="topbg" style="height:calc({{height}}px + 341rpx)" |
|||
src="https://static.ticket.sz-trip.com/xcxImages/user/topbg.png" mode="aspectFill"></image> |
|||
<view style="height:{{height}}rpx"></view> |
|||
<navigator url="profile/index" catchtap="pagePoint" data-event="mine_information" class="top-box" wx:if="{{info}}"> |
|||
<image lazy-load class="headimg" src="{{info.avatar}}" mode="aspectFill"></image> |
|||
<view class="userinfo"> |
|||
<view class="username">{{info.nickname}}<image lazy-load wx:if="{{info.gender==1 || info.gender==2}}" mode="widthFix" |
|||
src="https://static.ticket.sz-trip.com/xcxImages/user/sex{{info.gender}}.png"></image> |
|||
<view class="bg"> |
|||
<!-- 顶部背景与用户信息 --> |
|||
<view class="top-background"> |
|||
<image class="bg-img" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/topBg.png" mode="widthFix"></image> |
|||
|
|||
<!-- 用户信息 (浮动) --> |
|||
<navigator url="profile/index" catchtap="pagePoint" data-event="mine_information" class="user-top-new" wx:if="{{info}}"> |
|||
<view class="avatar-box"> |
|||
<image class="headimg" src="{{info.avatar}}" mode="aspectFill"></image> |
|||
</view> |
|||
<view>id:{{info.id}}</view> |
|||
</view> |
|||
</navigator> |
|||
<view class="user-box" style="padding-bottom:20rpx"> |
|||
<navigator url="order/list" catchtap="pagePoint" data-event="mine_order" class="user-box-top"> |
|||
<text>我的订单</text> |
|||
<view class="all-text">全部订单 <text class="iconfont icon-you"></text></view> |
|||
<view class="info-text"> |
|||
<view class="name-row"> |
|||
<text class="nickname text-overflow">{{info.nickname}}</text> |
|||
<image class="gender-icon" src="https://static.ticket.sz-trip.com/xcxImages/user/sex{{info.gender}}.png" mode="aspectFit"></image> |
|||
</view> |
|||
<view class="id-row">id:{{info.id}}</view> |
|||
</view> |
|||
<!-- <view class="arrow-right"> |
|||
<text class="iconfont icon-you" style="color: #fff; font-size: 32rpx;"></text> |
|||
</view> --> |
|||
</navigator> |
|||
<view class="user-order-types"> |
|||
<navigator url="order/list?type=WAIT_PAYMENT" catchtap="pagePoint" data-event="mine_order" class="user-order-type"> |
|||
<image lazy-load src="https://static.ticket.sz-trip.com/xcxImages/user/dfk.png" mode="aspectFill"></image> |
|||
<view>待付款</view> |
|||
</navigator> |
|||
<navigator url="order/list?type=WAIT_POST" catchtap="pagePoint" data-event="mine_order" class="user-order-type"> |
|||
<image lazy-load src="https://static.ticket.sz-trip.com/xcxImages/user/dfh.png" mode="aspectFill"></image> |
|||
<view>待发货</view> |
|||
</navigator> |
|||
<navigator url="order/list?type=WAIT_USE" catchtap="pagePoint" data-event="mine_order" class="user-order-type"> |
|||
<image lazy-load src="https://static.ticket.sz-trip.com/xcxImages/user/dcx.png" mode="aspectFill"></image> |
|||
<view>待出行</view> |
|||
</navigator> |
|||
<navigator url="order/list?type=WAIT_DELIVERY" catchtap="pagePoint" data-event="mine_order" class="user-order-type"> |
|||
<image lazy-load src="https://static.ticket.sz-trip.com/xcxImages/user/dsh.png" mode="aspectFill"></image> |
|||
<view>待收货</view> |
|||
</navigator> |
|||
<navigator url="order/list?type=WAIT_COMMENT" catchtap="pagePoint" data-event="mine_order" class="user-order-type"> |
|||
<image lazy-load src="https://static.ticket.sz-trip.com/xcxImages/user/ddp.png" mode="aspectFill"></image> |
|||
<view>待评价</view> |
|||
</navigator> |
|||
<navigator url="order/list?type=NEED_REFUND" catchtap="pagePoint" data-event="mine_order" class="user-order-type"> |
|||
<image lazy-load src="https://static.ticket.sz-trip.com/xcxImages/user/th.png" mode="aspectFill"></image> |
|||
<view>退货/退款</view> |
|||
</navigator> |
|||
</view> |
|||
<view class="pay" wx:if="{{list[0]}}" > |
|||
<swiper autoplay interval="{{3500}}" circular="true" class="swiper"> |
|||
<swiper-item wx:for="{{list}}"> |
|||
<view class="s-box" bindtap="gotoDetail" data-item="{{orderList[index]}}"> |
|||
<image lazy-load style="width:248rpx;height:168rpx" mode="aspectFill" src="{{item.product_img}}"></image> |
|||
<view class="box-r"> |
|||
<view class="wpay">等待付款</view> |
|||
<view class="time">剩余时间: <text>{{formatTime[index]}}</text></view> |
|||
<navigator class="btn" url="/pages/order/pay/index?id={{orderList[index].order_id}}">去支付</navigator> |
|||
</view> |
|||
</view> |
|||
</swiper-item> |
|||
</swiper> |
|||
</view> |
|||
</view> |
|||
|
|||
<navigator url="/pages/pbService/web/index?weburl=https://m.cloud.sz-trip.com/groupTradesNew" |
|||
style="width: 696rpx;height: 107rpx;margin: 26rpx auto;line-height: 1;background: #FFFFFF;display: flex;align-items: center;justify-content: space-between;border-radius: 20rpx;padding: 0 20rpx;box-sizing: border-box;"> |
|||
<view class="com-flex"> |
|||
<view style="font-size: 29rpx;color: #333;margin-right: 6rpx;">团购订单</view> |
|||
<image style="width: 46.63rpx;height:46.63rpx;" mode="widthFix" src="https://kswtgl.com/uploads/20260122/86e50cdee3bed939990086abc2431477.png"></image> |
|||
</view> |
|||
<view class="com-flex"> |
|||
<view style="font-size: 27rpx;color: #888;">更多</view> |
|||
<text class="iconfont icon-you" style="font-size: 24rpx;color: #888;"></text> |
|||
</view> |
|||
</navigator> |
|||
<!-- 主要内容区域 (向上浮动) --> |
|||
<view class="main-container"> |
|||
|
|||
<!-- 1. 我的订单 --> |
|||
<view class="card-box my-order"> |
|||
<view class="title"> |
|||
<text class="main-title">我的订单</text> |
|||
<navigator url="order/list" catchtap="pagePoint" data-event="mine_order" class="sub-title"> |
|||
全部订单 <text class="iconfont icon-you" style="font-size: 24rpx;"></text> |
|||
</navigator> |
|||
</view> |
|||
|
|||
<view class="order-list"> |
|||
<!-- 待付款 --> |
|||
<navigator url="order/list?type=WAIT_PAYMENT" catchtap="pagePoint" data-event="mine_order" class="order-item"> |
|||
<image src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/dfk.png" mode="aspectFit"></image> |
|||
<text>待付款</text> |
|||
<view class="total" wx:if="{{dfkTotal > 0}}">{{dfkTotal}}</view> |
|||
</navigator> |
|||
<!-- 待发货 --> |
|||
<navigator url="order/list?type=WAIT_POST" catchtap="pagePoint" data-event="mine_order" class="order-item"> |
|||
<image src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/dfh.png" mode="aspectFit"></image> |
|||
<text>待发货</text> |
|||
</navigator> |
|||
<!-- 待出行 --> |
|||
<navigator url="order/list?type=WAIT_USE" catchtap="pagePoint" data-event="mine_order" class="order-item"> |
|||
<image src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/dcx.png" mode="aspectFit"></image> |
|||
<text>待出行</text> |
|||
</navigator> |
|||
<!-- 待收货 --> |
|||
<navigator url="order/list?type=WAIT_DELIVERY" catchtap="pagePoint" data-event="mine_order" class="order-item"> |
|||
<image src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/dsh.png" mode="aspectFit"></image> |
|||
<text>待收货</text> |
|||
</navigator> |
|||
<!-- 退货/退款 --> |
|||
<navigator url="order/list?type=NEED_REFUND" catchtap="pagePoint" data-event="mine_order" class="order-item"> |
|||
<image src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/thtk.png" mode="aspectFit"></image> |
|||
<text>退货/退款</text> |
|||
</navigator> |
|||
</view> |
|||
|
|||
<view class="user-box"> |
|||
<navigator url="cartlist/list" class="user-box-line" catchtap="pagePoint" data-event="mine_cart"> |
|||
购物车 |
|||
</navigator> |
|||
<!-- 待付款轮播 --> |
|||
<view class="pay-swiper-box" wx:if="{{list && list.length > 0}}"> |
|||
<swiper autoplay interval="{{3500}}" circular="true" class="swiper"> |
|||
<swiper-item wx:for="{{list}}" wx:key="index"> |
|||
<view class="dfkBox" bindtap="gotoDetail" data-item="{{orderList[index]}}"> |
|||
<image class="prod-img" mode="aspectFill" src="{{item.product_img}}"></image> |
|||
<view class="contentBox"> |
|||
<view class="status-text">等待付款</view> |
|||
<view class="time-text">剩余时间: <text style="color: #FB6E4D;">{{formatTime[index]}}</text></view> |
|||
<navigator class="orderBtn" catchtap="stopBubble" url="/pages/order/pay/index?id={{orderList[index].order_id}}">去支付</navigator> |
|||
</view> |
|||
</view> |
|||
</swiper-item> |
|||
</swiper> |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- <navigator url="order/team/list" class="user-box-line" catchtap="pagePoint" data-event="mine_teamorder"> |
|||
团体预约订单 |
|||
</navigator> --> |
|||
<navigator url="/pages/pbService/web/index?weburl=https://m.cloud.sz-trip.com/PrizeLog" class="user-box-line"> |
|||
中奖记录 |
|||
<!-- 2. 团购订单 --> |
|||
<navigator url="/pages/pbService/web/index?weburl=https://m.cloud.sz-trip.com/groupTradesNew" class="card-box group-order-row" wx:if="{{isShowGroup}}"> |
|||
<view class="left"> |
|||
<text class="main-title">团购订单</text> |
|||
<image class="group-icon" src="https://static.ticket.sz-trip.com/uploads/20260122/86e50cdee3bed939990086abc2431477.png" mode="widthFix"></image> |
|||
</view> |
|||
<view class="right sub-title"> |
|||
全部订单 <text class="iconfont icon-you" style="font-size: 24rpx;"></text> |
|||
</view> |
|||
</navigator> |
|||
|
|||
<!-- <navigator url="service/index" class="user-box-line" catchtap="pagePoint" data-event="mine_customerservice"> |
|||
在线客服 |
|||
</navigator> --> |
|||
<view class="user-box-line" bindtap="phoneCall"> |
|||
人工客服 |
|||
|
|||
<!-- 3. 常用功能 (手动硬编码保留原逻辑) --> |
|||
<view class="section-box"> |
|||
<view class="section-title">常用功能</view> |
|||
<view class="common-func-grid"> |
|||
<!-- 购物车 --> |
|||
<navigator url="cartlist/list" catchtap="pagePoint" data-event="mine_cart" class="func-item" style="background-image: url('https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/gwc.png');"></navigator> |
|||
|
|||
<!-- 我的优惠券 --> |
|||
<navigator url="coupon/index" catchtap="pagePoint" data-event="mine_card" class="func-item" style="background-image: url('https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/wdyhq.png');"></navigator> |
|||
|
|||
<!-- 中奖记录 --> |
|||
<navigator url="/pages/pbService/web/index?weburl=https://m.cloud.sz-trip.com/PrizeLog" class="func-item" style="background-image: url('https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/zjjl.png');"></navigator> |
|||
|
|||
<!-- 人工客服 --> |
|||
<view bindtap="phoneCall" class="func-item" style="background-image: url('https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/rgkf.png');"></view> |
|||
</view> |
|||
</view> |
|||
<navigator url="coupon/index" class="user-box-line" catchtap="pagePoint" data-event="mine_card"> |
|||
我的卡券 |
|||
</navigator> |
|||
<navigator url="likes/index" class="user-box-line" catchtap="pagePoint" data-event="mine_collection"> |
|||
我的收藏 |
|||
</navigator> |
|||
<view bindtap="supplier" class="user-box-line">商户入驻</view> |
|||
<!-- <navigator url="/pages/group/mine/index" class="user-box-line"> |
|||
我的团购 |
|||
</navigator> |
|||
<navigator url="/pages/kj/mine/index" class="user-box-line"> |
|||
我的砍价 |
|||
</navigator> --> |
|||
<!-- <view bindtap="retail" class="user-box-line"> |
|||
我要分销 |
|||
</view> --> |
|||
<navigator url="verify/index" class="user-box-line" catchtap="pagePoint" data-event="mine_verify" wx:if="{{info && info.name_verification=='UNCERTFIED'}}"> |
|||
实名认证 |
|||
</navigator> |
|||
</view> |
|||
<view class="user-box" style="margin-bottom:0"> |
|||
<navigator url="linkman/index" class="user-box-line" catchtap="pagePoint" data-event="mine_travelinfo"> |
|||
出游人信息 |
|||
</navigator> |
|||
<navigator url="address/index" class="user-box-line" catchtap="pagePoint" data-event="mine_receiveinfo"> |
|||
收货地址 |
|||
</navigator> |
|||
</view> |
|||
|
|||
<view class="user-box" style="margin-bottom:0;margin-top: 18rpx;"> |
|||
<navigator url="userPrivacy/index?id=9" class="user-box-line" catchtap="pagePoint" data-event="mine_travelinfo"> |
|||
用户协议 |
|||
</navigator> |
|||
<navigator url="suggest/suggest" class="user-box-line" catchtap="pagePoint" data-event="mine_travelinfo"> |
|||
投诉建议 |
|||
</navigator> |
|||
<navigator url="userPrivacy/index?id=12" class="user-box-line" catchtap="pagePoint" data-event="mine_receiveinfo"> |
|||
隐私政策 |
|||
</navigator> |
|||
<navigator url="personalInfo/index" class="user-box-line" catchtap="pagePoint" data-event="mine_receiveinfo"> |
|||
个人信息收集清单 |
|||
</navigator> |
|||
<navigator url="userPrivacy/index?id=14" class="user-box-line" catchtap="pagePoint" data-event="mine_receiveinfo"> |
|||
第三方共享信息清单 |
|||
</navigator> |
|||
<navigator url="/pages/pbService/web/index?weburl=https://m.supplier.cloud.sz-trip.com" class="user-box-line" catchtap="pagePoint" data-event="mine_receiveinfo"> |
|||
商户核销 |
|||
</navigator> |
|||
</view> |
|||
<!-- 4. 更多服务 (手动硬编码保留原逻辑) --> |
|||
<view class="section-box"> |
|||
<view class="section-title">更多服务</view> |
|||
<view class="more-service-grid"> |
|||
|
|||
<!-- 出游人信息 --> |
|||
<navigator url="linkman/index" catchtap="pagePoint" data-event="mine_travelinfo" class="service-item"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/cyrxx.png" mode="aspectFit"></image> |
|||
<view class="service-name">出游人信息</view> |
|||
</navigator> |
|||
|
|||
<view class="bottom-intro"> |
|||
<view>主办方:苏州市文化广电和旅游局</view> |
|||
<view>承办方:苏州市文旅融合发展中心</view> |
|||
<view>备案号:苏ICP备19064944号-3X@君到苏州</view> |
|||
</view> |
|||
</view> |
|||
<!-- <view class="mask" wx:if="{{showModel}}"> |
|||
<view class="model"> |
|||
<!-- 收货地址 --> |
|||
<navigator url="address/index" catchtap="pagePoint" data-event="mine_receiveinfo" class="service-item"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/shdz.png" mode="aspectFit"></image> |
|||
<view class="service-name">收货地址</view> |
|||
</navigator> |
|||
|
|||
<!-- 商户入驻 --> |
|||
<view bindtap="supplier" class="service-item"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/shrz.png" mode="aspectFit"></image> |
|||
<view class="service-name">商户入驻</view> |
|||
</view> |
|||
|
|||
<view class="model-content"> |
|||
<view>即将跳转人工客服</view> |
|||
<view style="margin-top: 40rpx;">客服服务时间:09:00-12:00,</view> |
|||
<view style="margin-top: 30rpx;">13:00-18:00</view> |
|||
<!-- 商户核销 --> |
|||
<navigator url="/pages/pbService/web/index?weburl=https://m.supplier.cloud.sz-trip.com" catchtap="pagePoint" data-event="mine_receiveinfo" class="service-item"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/shhx.png" mode="aspectFit"></image> |
|||
<view class="service-name">商户核销</view> |
|||
</navigator> |
|||
|
|||
<!-- 我的收藏 --> |
|||
<navigator url="likes/index" catchtap="pagePoint" data-event="mine_collection" class="service-item"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/wdsc.png" mode="aspectFit"></image> |
|||
<view class="service-name">我的收藏</view> |
|||
</navigator> |
|||
|
|||
<!-- 投诉建议 --> |
|||
<navigator url="suggest/suggest" catchtap="pagePoint" data-event="mine_travelinfo" class="service-item"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/tsjy.png" mode="aspectFit"></image> |
|||
<view class="service-name">投诉建议</view> |
|||
</navigator> |
|||
|
|||
<!-- 用户协议 --> |
|||
<navigator url="userPrivacy/index?id=9" catchtap="pagePoint" data-event="mine_travelinfo" class="service-item"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/yhxy.png" mode="aspectFit"></image> |
|||
<view class="service-name">用户协议</view> |
|||
</navigator> |
|||
|
|||
<!-- 隐私政策 --> |
|||
<navigator url="userPrivacy/index?id=12" catchtap="pagePoint" data-event="mine_receiveinfo" class="service-item"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/yszc.png" mode="aspectFit"></image> |
|||
<view class="service-name">隐私政策</view> |
|||
</navigator> |
|||
|
|||
<!-- 个人信息收集清单 --> |
|||
<navigator url="personalInfo/index" catchtap="pagePoint" data-event="mine_receiveinfo" class="service-item"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/grxxsjqd.png" mode="aspectFit"></image> |
|||
<view class="service-name"><text>个人信息\n收集清单</text></view> |
|||
</navigator> |
|||
|
|||
<!-- 第三方共享信息清单 --> |
|||
<navigator url="userPrivacy/index?id=14" catchtap="pagePoint" data-event="mine_receiveinfo" class="service-item"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/gxxxqd.png" mode="aspectFit"></image> |
|||
<view class="service-name"><text>第三方共享\n信息清单</text></view> |
|||
</navigator> |
|||
|
|||
<!-- 实名认证 --> |
|||
<navigator url="verify/index" catchtap="pagePoint" data-event="mine_verify" class="service-item" wx:if="{{info && info.name_verification=='UNCERTFIED'}}"> |
|||
<image class="service-icon" src="https://static.ticket.sz-trip.com/jundaosuzhou/images/user2026/smrz.png" mode="aspectFit"></image> |
|||
<view class="service-name">实名认证</view> |
|||
</navigator> |
|||
|
|||
</view> |
|||
</view> |
|||
<view class="btn-list"> |
|||
<button class="model-btn" bindtap="closeModel"> |
|||
取消 |
|||
</button> |
|||
<button class="model-btn" style="color:#0B898E;border-left:#D8D8D8 solid 1rpx;" open-type="contact"> |
|||
确定 |
|||
</button> |
|||
|
|||
<!-- 底部文字 --> |
|||
<view class="bottom-intro"> |
|||
<view>主办方:苏州市文化广电和旅游局</view> |
|||
<view>承办方:苏州市文旅融合发展中心</view> |
|||
<view>备案号:苏ICP备19064944号-3X@君到苏州</view> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> --> |
|||
|
|||
<view style="height:20rpx"></view> |
|||
</view> |
|||
|
|||
<!-- 客服弹窗组件 --> |
|||
<kefuCom wx:if="{{showModel}}" bind:hideModal="closeModel"></kefuCom> |
|||
<view style="height:20rpx"></view> |
|||
@ -1,236 +1,327 @@ |
|||
/* pages/user/user.wxss */ |
|||
page { |
|||
background: #EDEDED; |
|||
background: #F7F7F7; |
|||
padding-bottom: 20rpx; |
|||
} |
|||
.top-box { |
|||
padding: 0 30rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
color: #fff; |
|||
height: 180rpx; |
|||
|
|||
.bg { |
|||
min-height: 100vh; |
|||
} |
|||
|
|||
/* 顶部背景区域 */ |
|||
.top-background { |
|||
width: 100%; |
|||
height: 480rpx; /* 对应 H5 的 6.5rem 左右 */ |
|||
position: relative; |
|||
overflow: hidden; |
|||
} |
|||
|
|||
.bg-img { |
|||
width: 100%; |
|||
height: 100%; |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
z-index: 1; |
|||
} |
|||
|
|||
/* 顶部遮罩 */ |
|||
.top-background::after { |
|||
content: ''; |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: rgba(0,0,0,0.25); |
|||
z-index: 2; |
|||
} |
|||
.topbg { |
|||
|
|||
/* 用户信息 */ |
|||
.user-top-new { |
|||
position: absolute; |
|||
top: 150rpx; /* 根据导航栏高度调整 */ |
|||
left: 0; |
|||
width: 100%; |
|||
z-index: -1; |
|||
z-index: 3; |
|||
padding: 0 40rpx; |
|||
box-sizing: border-box; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.top-box .headimg { |
|||
width: 100rpx; |
|||
height: 100rpx; |
|||
|
|||
.avatar-box { |
|||
width: 135rpx; |
|||
height: 135rpx; |
|||
border-radius: 50%; |
|||
border: 4rpx solid rgba(255,255,255,0.9); |
|||
overflow: hidden; |
|||
margin-right: 30rpx; |
|||
flex-shrink: 0; |
|||
margin-right: 20rpx; |
|||
} |
|||
.userinfo { |
|||
|
|||
.headimg { |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
|
|||
.info-text { |
|||
flex: 1; |
|||
font-size: 24rpx; |
|||
color: #fff; |
|||
} |
|||
.username { |
|||
|
|||
.name-row { |
|||
display: flex; |
|||
align-items: center; |
|||
font-size: 36rpx; |
|||
font-weight: bold; |
|||
margin-bottom: 15rpx; |
|||
} |
|||
.username image { |
|||
width: 31rpx; |
|||
margin-left: 20rpx; |
|||
|
|||
.nickname { |
|||
font-size: 37rpx; |
|||
font-weight: bold; |
|||
margin-right: 15rpx; |
|||
max-width: 350rpx; |
|||
display: inline-block; |
|||
} |
|||
|
|||
.gender-icon { |
|||
width: 34rpx; |
|||
height: 34rpx; |
|||
} |
|||
|
|||
.id-row { |
|||
font-size: 28rpx; |
|||
opacity: 0.9; |
|||
} |
|||
.user-box { |
|||
margin: 0 30rpx; |
|||
margin-bottom: 20rpx; |
|||
background: white; |
|||
border-radius: 20rpx; |
|||
padding: 0rpx 20rpx; |
|||
font-size: 29rpx; |
|||
color: #333; |
|||
|
|||
.arrow-right { |
|||
padding: 15rpx; |
|||
} |
|||
.user-box-top { |
|||
|
|||
/* 主容器 */ |
|||
.main-container { |
|||
position: relative; |
|||
margin-top: -80rpx; |
|||
z-index: 10; |
|||
padding: 20rpx 30rpx; |
|||
background: #f7f7f7; |
|||
border-radius: 33rpx 33rpx 0 0; |
|||
} |
|||
|
|||
/* 卡片通用样式 */ |
|||
.card-box { |
|||
background: #FFFFFF; |
|||
border-radius: 20rpx; |
|||
padding: 30rpx 20rpx; |
|||
margin-bottom: 20rpx; |
|||
box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.02); |
|||
} |
|||
|
|||
/* 标题 */ |
|||
.title { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
padding: 30rpx 0; |
|||
height: 28rpx; |
|||
align-items: center; |
|||
margin-bottom: 30rpx; |
|||
padding: 0 10rpx; |
|||
} |
|||
.all-text { |
|||
|
|||
.main-title { |
|||
font-size: 34rpx; |
|||
font-weight: bold; |
|||
color: #333; |
|||
} |
|||
|
|||
.sub-title { |
|||
font-size: 26rpx; |
|||
color: #999; |
|||
display: flex; |
|||
align-items: center; |
|||
font-size: 27rpx; |
|||
color: #888; |
|||
} |
|||
.all-text .iconfont { |
|||
font-size: 24rpx; |
|||
|
|||
/* 订单部分 */ |
|||
.order-list { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
margin-bottom: 30rpx; |
|||
padding: 0 10rpx; |
|||
} |
|||
.user-order-types { |
|||
|
|||
.order-item { |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
flex-wrap: wrap; |
|||
position: relative; |
|||
width: 20%; |
|||
} |
|||
.user-order-type { |
|||
width: 25%; |
|||
|
|||
.order-item image { |
|||
width: 80rpx; |
|||
height: 80rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
|
|||
.order-item text { |
|||
font-size: 26rpx; |
|||
color: #333; |
|||
} |
|||
|
|||
.total { |
|||
position: absolute; |
|||
min-width: 36rpx; |
|||
height: 36rpx; |
|||
line-height: 36rpx; |
|||
text-align: center; |
|||
font-size: 27rpx; |
|||
margin-bottom: 30rpx; |
|||
background: linear-gradient(0deg, #FF8826, #FF2726); |
|||
border-radius: 18rpx; |
|||
font-size: 22rpx; |
|||
color: #FFFFFF; |
|||
right: 10rpx; |
|||
top: -10rpx; |
|||
padding: 0 6rpx; |
|||
} |
|||
.user-order-type image { |
|||
width: 60rpx; |
|||
height: 60rpx; |
|||
display: block; |
|||
margin: 0 auto; |
|||
margin-bottom: 20rpx; |
|||
|
|||
/* 待付款轮播 */ |
|||
.pay-swiper-box { |
|||
width: 100%; |
|||
height: 200rpx; |
|||
} |
|||
|
|||
.swiper { |
|||
height: 100%; |
|||
} |
|||
|
|||
.dfkBox { |
|||
width: 100%; |
|||
height: 100%; |
|||
box-sizing: border-box; |
|||
background: #F9F9F9; |
|||
padding: 20rpx; |
|||
display: flex; |
|||
border-radius: 10rpx; |
|||
} |
|||
|
|||
.prod-img { |
|||
width: 220rpx; |
|||
height: 160rpx; |
|||
margin-right: 20rpx; |
|||
border-radius: 8rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.user-box-line { |
|||
line-height: 120rpx; |
|||
border-bottom: 1rpx solid #d8d8d8; |
|||
|
|||
.contentBox { |
|||
flex: 1; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: space-between; |
|||
} |
|||
.user-box .user-box-line:last-child { |
|||
border-bottom: none; |
|||
|
|||
.status-text { |
|||
font-size: 32rpx; |
|||
color: #333; |
|||
} |
|||
|
|||
.time-text { |
|||
font-size: 26rpx; |
|||
color: #666; |
|||
} |
|||
|
|||
.pay { |
|||
width: 648rpx; |
|||
height: 204rpx; |
|||
margin: 0 auto; |
|||
background: #F6F6F6; |
|||
padding: 18rpx; |
|||
.orderBtn { |
|||
width: 150rpx; |
|||
height: 52rpx; |
|||
background: #FB6E4D; |
|||
border-radius: 26rpx; |
|||
text-align: center; |
|||
line-height: 52rpx; |
|||
font-size: 26rpx; |
|||
color: #FFFFFF; |
|||
align-self: flex-end; |
|||
} |
|||
|
|||
/* 团购订单行 */ |
|||
.group-order-row { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
padding: 30rpx 30rpx; |
|||
} |
|||
|
|||
.group-order-row .left { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
.group-icon { |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
margin-left: 15rpx; |
|||
} |
|||
|
|||
/* 常用功能 */ |
|||
.section-box { |
|||
padding: 20rpx 20rpx 0; |
|||
box-sizing: border-box; |
|||
background: #FFFFFF; |
|||
border-radius: 20rpx; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
|
|||
.section-title { |
|||
font-size: 34rpx; |
|||
font-weight: bold; |
|||
color: #333; |
|||
margin: 10rpx 0 20rpx 10rpx; |
|||
} |
|||
|
|||
.s-box { |
|||
.common-func-grid { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
flex-wrap: wrap; |
|||
padding-bottom: 20rpx; |
|||
} |
|||
|
|||
.func-item { |
|||
width: 315rpx; |
|||
height: 110rpx; |
|||
margin-bottom: 20rpx; |
|||
background-size: 100% 100%; |
|||
background-repeat: no-repeat; |
|||
} |
|||
|
|||
/* 更多服务 */ |
|||
.more-service-grid { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
padding-bottom: 20rpx; |
|||
} |
|||
|
|||
.service-item { |
|||
width: 25%; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
margin: 20rpx 0; |
|||
} |
|||
|
|||
.service-icon { |
|||
width: 50rpx; |
|||
height: 50rpx; |
|||
margin-bottom: 15rpx; |
|||
} |
|||
|
|||
.service-name { |
|||
font-size: 26rpx; |
|||
color: #333; |
|||
text-align: center; |
|||
width: 100%; |
|||
height: 100%; |
|||
overflow: hidden; |
|||
line-height: 1.3; |
|||
} |
|||
|
|||
.btn { |
|||
width: 162rpx; |
|||
height: 56rpx; |
|||
background: #FB6E4D; |
|||
border-radius: 28rpx; |
|||
font-size: 32rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 400; |
|||
color: #FFFFFF; |
|||
line-height: 56rpx; |
|||
/* 底部文字 */ |
|||
.bottom-intro { |
|||
padding: 40rpx 0; |
|||
text-align: center; |
|||
margin-top: 10rpx; |
|||
float:right; |
|||
} |
|||
.swiper{ |
|||
height: 100% !important; |
|||
} |
|||
.box-r{ |
|||
margin-left: 30rpx; |
|||
width: 388rpx; |
|||
} |
|||
.wpay{ |
|||
|
|||
font-size: 32rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 400; |
|||
color: #333333; |
|||
|
|||
} |
|||
.time{ |
|||
font-size: 28rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 400; |
|||
color: #666666; |
|||
margin-top: 10rpx; |
|||
} |
|||
.mask { |
|||
position: fixed; |
|||
top: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
left: 0; |
|||
background-color: rgba(0, 0, 0, 0.5); |
|||
z-index: 999; |
|||
} |
|||
.model{ |
|||
width: 561rpx; |
|||
min-height: 449rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 13rpx; |
|||
position: absolute; |
|||
box-sizing: border-box; |
|||
|
|||
} |
|||
.model-title{ |
|||
text-align: center; |
|||
font-size: 34rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: bold; |
|||
color: #333333; |
|||
margin-top: 32rpx; |
|||
box-sizing: border-box; |
|||
|
|||
} |
|||
.model-content{ |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: center; |
|||
flex-wrap: wrap; |
|||
margin-top: 100rpx; |
|||
font-size: 34rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
color: #333333; |
|||
} |
|||
.btn-list{ |
|||
height: 106rpx; |
|||
width: 100%; |
|||
position: absolute; |
|||
bottom: 0; |
|||
border-top: 1rpx solid rgba(216, 216, 216, .99); |
|||
padding: 10rpx; |
|||
box-sizing: border-box; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
|
|||
} |
|||
.model-btn{ |
|||
width: 50%; |
|||
text-align: center; |
|||
height: 86rpx; |
|||
line-height: 86rpx; |
|||
|
|||
font-size: 34rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
color: #333333; |
|||
} |
|||
|
|||
button{ |
|||
margin:0; |
|||
padding:0; |
|||
border-radius:0; |
|||
border:none; |
|||
background-color:transparent; |
|||
} |
|||
|
|||
button::after{ |
|||
border: none; |
|||
} |
|||
|
|||
.bottom-intro{ |
|||
width: 100%; |
|||
padding: 75rpx; |
|||
font-family: PingFang-SC, PingFang-SC; |
|||
font-weight: 500; |
|||
font-size: 25rpx; |
|||
color: #999999; |
|||
line-height: 40rpx; |
|||
text-align: center; |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
font-size: 24rpx; |
|||
color: #999; |
|||
line-height: 36rpx; |
|||
} |
|||
|
|||
Loading…
Reference in new issue