|
|
@@ -1,769 +0,0 @@
|
|
|
-<template>
|
|
|
- <view>
|
|
|
- <!-- 状态栏高度 -->
|
|
|
- <view :style="{ height: `${statusBarHeight}px` }"></view>
|
|
|
-
|
|
|
- <!-- 导航栏 -->
|
|
|
- <view :style="{ height: `${navigationBarHeight}px`,lineHeight: `${navigationBarHeight}px`}" class="order-nav">
|
|
|
- 个人中心
|
|
|
- </view>
|
|
|
-
|
|
|
- <view style="background-color: #FF6702;height: 60rpx;"></view>
|
|
|
-
|
|
|
- <view class="card">
|
|
|
- <view class="card-left">
|
|
|
- <view class="name" v-if="!isLogin" @tap="openAuto">
|
|
|
- <image class="avatar tui-skeleton-rect" :src='userInfo.avatar' v-if="userInfo.avatar" @click="goEdit()"></image>
|
|
|
- <image v-else class="avatar tui-skeleton-rect" :src="urlDomain+'crmebimage/presets/morenT.png'" mode="" @click="goEdit()">
|
|
|
- </image>
|
|
|
- <view class="username">请点击登录</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <template v-else>
|
|
|
- <image class="avatar tui-skeleton-rect" :src='userInfo.avatar' v-if="userInfo.avatar" @click="goEdit()"></image>
|
|
|
- <image v-else class="avatar tui-skeleton-rect" :src="urlDomain+'crmebimage/presets/morenT.png'" mode="" @click="goEdit()">
|
|
|
- </image>
|
|
|
- <view class="username">
|
|
|
- {{userInfo.nickname}}
|
|
|
- <!-- <image src="/static/img/ic-code.png" class="code"></image> -->
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="phone-info">
|
|
|
- <text>绑定手机号：{{userInfo.phone}}</text>
|
|
|
- <image src="/static/img/ic-copy.png">
|
|
|
- </image>
|
|
|
- </view>
|
|
|
- </template>
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="card-right">
|
|
|
- <view class="card-content">
|
|
|
- <!--view class="content-item" @click="menusTap('/pages/users/user_coupon/index')">
|
|
|
- <img class="content-icon" src="/static/img/ic-vouchers.png" alt="我的票劵">
|
|
|
- <view class="content-text1">优惠券</view>
|
|
|
- </view-->
|
|
|
- <!--view class="content-item" @click="menusTap('/pages/goods/order_list/index')">
|
|
|
- <img class="content-icon" src="/static/img/ic-order.png" alt="我的订单">
|
|
|
- <view class="content-text2">我的订单</view>
|
|
|
- </view-->
|
|
|
- <view class="content-item" @click="menusTap('/pages/merchant/user_integral/index')">
|
|
|
- <img class="content-icon" src="/static/img/ic-tickets.png" alt="我的积分">
|
|
|
- <view class="content-text3">我的积分</view>
|
|
|
- </view>
|
|
|
- <view class="content-item app_set" @click="goEdit()">
|
|
|
- <text class="iconfont icon-shezhi">设置</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- <view class="profile-link">
|
|
|
- <text>个人中心</text>
|
|
|
- <img src="/static/img/ic-right.png" />
|
|
|
- </view> -->
|
|
|
- </view>
|
|
|
- <view class="num-wrapper tui-skeleton-rect">
|
|
|
- <view class="num-item" @click="goMenuPage('/pages/merchant/user_integral/index')">
|
|
|
- <text class="num">{{userInfo.integral && uid ? userInfo.integral: 0}}</text>
|
|
|
- <view class="txt">积分</view>
|
|
|
- </view>
|
|
|
- <view class="num-item" @click="goMenuPage('/pages/users/user_coupon/index')">
|
|
|
- <text
|
|
|
- class="num">{{userInfo.couponCount && uid ? userInfo.couponCount : 0}}</text>
|
|
|
- <view class="txt">优惠券</view>
|
|
|
- </view>
|
|
|
- <view class="num-item"
|
|
|
- @click="goMenuPage('/pages/goods/user_goods_collection/index')">
|
|
|
- <text
|
|
|
- class="num">{{userInfo.collectCount && uid ? userInfo.collectCount : 0}}</text>
|
|
|
- <view class="txt">收藏</view>
|
|
|
- </view>
|
|
|
- <view class="num-item" @click="goMenuPage('/pages/goods/browsing_history/index')">
|
|
|
- <text class="num">{{userInfo.browseNum && uid ? userInfo.browseNum:0}}</text>
|
|
|
- <view class="txt">浏览记录</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view style="position: relative;top: -90rpx;">
|
|
|
- <view class="item-settled">
|
|
|
- <image @tap="menusTap('/pages/users/settled/index')" src="/static/img/ic-settled-left.png" style="width: 350rpx;height: 116rpx;"></image>
|
|
|
-
|
|
|
- <image src="/static/img/ic-bg-line.png" style="width: 10rpx;height: 154rpx;margin: 0 20rpx;"></image>
|
|
|
- <image v-if="!userInfo.isRider" @tap="menusRider('/pages/users/user_rider/index')" src="/static/img/ic-settled-right.png"
|
|
|
- style="width: 350rpx;height: 116rpx;"></image>
|
|
|
- <image v-else @tap="menusRider('/pages/rider_index/index', true)" src="/static/img/go-shipping.png" style="width: 350rpx;height: 116rpx;"></image>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="order-box" v-if="isLogin">
|
|
|
- <view class="order-hd flex">
|
|
|
- <view class="left">订单中心</view>
|
|
|
- <view class="right flex" @click="menusTap('/pages/goods/order_list/index')">查看全部
|
|
|
- <text class="iconfont icon-xiangyou"></text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="order-bd">
|
|
|
- <block v-for="(item,index) in orderMenu" :key="index">
|
|
|
- <view class="order-item" @click="menusTap(item.url)">
|
|
|
- <view class="pic">
|
|
|
- <text class="iconfont pic_status" :class="item.img"></text>
|
|
|
- <text class="order-status-num" v-if="item.num > 0">{{ item.num }}</text>
|
|
|
- </view>
|
|
|
- <view class="txt tui-skeleton-rect">{{item.title}}</view>
|
|
|
- </view>
|
|
|
- </block>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="item-features" v-if="isLogin">
|
|
|
- <view class="item-features-title">我的功能</view>
|
|
|
- <div class="grid-container">
|
|
|
- <!-- 示例：12 个格子（3行x4列） -->
|
|
|
- <div class="grid-item" v-for="item in featuresList" :key="item.id" @click="menusTap(item.url)">
|
|
|
- <img class="grid-img" :src="item.icon">
|
|
|
- <div class="grid-text">{{item.text}}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </view>
|
|
|
- <!-- 商家管理 -->
|
|
|
- <view class="user-menus mt20" v-if="isEmployee">
|
|
|
- <view class="menu-title">店铺管理</view>
|
|
|
- <view class="list-box">
|
|
|
- <view class="item" @click="toggle('bottom')">
|
|
|
- <image :src="urlDomain+'crmebimage/presets/adminImg/sjgl.png'"></image>
|
|
|
- <text>商家管理</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <image :src="copyImage" alt="" class='support'></image>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- var statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
|
|
|
- let app = getApp();
|
|
|
- import {
|
|
|
- userCenterInfo,
|
|
|
- copyrightImageApi
|
|
|
- } from '@/api/user.js';
|
|
|
- import Cache from '@/utils/cache';
|
|
|
- import {
|
|
|
- orderNum
|
|
|
- } from '@/api/order.js';
|
|
|
- import {
|
|
|
- toLogin
|
|
|
- } from '@/libs/login.js';
|
|
|
- import {
|
|
|
- mapGetters
|
|
|
- } from "vuex";
|
|
|
- import {
|
|
|
- BACK_URL
|
|
|
- } from '@/config/cache';
|
|
|
- import {
|
|
|
- MerchantBelongListApi,
|
|
|
- merchantActive
|
|
|
- } from '@/api/work.js';
|
|
|
- import animationType from '@/utils/animationType.js'
|
|
|
- export default {
|
|
|
- computed: mapGetters(['isLogin', 'chatUrl', 'uid', 'globalData', 'bottomNavigationIsCustom',
|
|
|
- 'merchantEmployeeList', 'isEmployee', 'selectMerId'
|
|
|
- ]),
|
|
|
- data() {
|
|
|
- return {
|
|
|
- copyImage: '',
|
|
|
- statusBarHeight: app.globalData.statusBarHeight,
|
|
|
- navigationBarHeight: 0,
|
|
|
- userInfo: {},
|
|
|
- urlDomain: this.$Cache.get("imgHost"),
|
|
|
- orderMenu: [{
|
|
|
- img: 'icon-daifukuan',
|
|
|
- title: '待付款',
|
|
|
- url: '/pages/goods/order_list/index?status=0',
|
|
|
- num: 0
|
|
|
- },
|
|
|
- {
|
|
|
- img: 'icon-daifahuo',
|
|
|
- title: '待取餐',
|
|
|
- url: '/pages/goods/order_list/index?status=1',
|
|
|
- num: 0
|
|
|
- },
|
|
|
- {
|
|
|
- img: 'icon-daihexiao',
|
|
|
- title: '待核销',
|
|
|
- url: '/pages/goods/order_list/index?status=3',
|
|
|
- num: 0
|
|
|
- },
|
|
|
- {
|
|
|
- img: 'icon-daishouhuo',
|
|
|
- title: '配送中',
|
|
|
- url: '/pages/goods/order_list/index?status=4',
|
|
|
- num: 0
|
|
|
- },
|
|
|
- {
|
|
|
- img: 'icon-daipingjia',
|
|
|
- title: '待评价',
|
|
|
- url: '/pages/goods/evaluation_list/index',
|
|
|
- num: 0
|
|
|
- },
|
|
|
- {
|
|
|
- img: 'icon-a-shouhoutuikuan',
|
|
|
- title: '售后/退款',
|
|
|
- url: '/pages/goods/user_return_list/index',
|
|
|
- num: 0
|
|
|
- },
|
|
|
- ],
|
|
|
- featuresList: [{
|
|
|
- id: 1,
|
|
|
- icon: '/static/img/ic-express.png',
|
|
|
- text: '我的快递',
|
|
|
- url: '/pages/substitute_fast_mail/my_fast_mail/index'
|
|
|
- },
|
|
|
- {
|
|
|
- id: 2,
|
|
|
- icon: '/static/img/ic-address.png',
|
|
|
- text: '通用地址',
|
|
|
- url: '/pages/address/user_address_list/index'
|
|
|
- },
|
|
|
- // {
|
|
|
- // id: 3,
|
|
|
- // icon: '/static/img/ic-comments.png',
|
|
|
- // text: '我的评论',
|
|
|
- // url: ''
|
|
|
- // },
|
|
|
- {
|
|
|
- id: 4,
|
|
|
- icon: '/static/img/ic-collection.png',
|
|
|
- text: '我的收藏',
|
|
|
- url: '/pages/goods/user_goods_collection/index'
|
|
|
- },
|
|
|
- {
|
|
|
- id: 5,
|
|
|
- icon: '/static/img/ic-buy.png',
|
|
|
- text: '我的团购',
|
|
|
- url: ''
|
|
|
- },
|
|
|
- {
|
|
|
- id: 6,
|
|
|
- icon: '/static/img/ic-vouchers.png',
|
|
|
- text: '二手交易',
|
|
|
- url: '/pages/goods/order_list/index?orderType=secondHand&status=-1'
|
|
|
- },
|
|
|
- {
|
|
|
- id: 7,
|
|
|
- icon: '/static/img/ic-distribution.png',
|
|
|
- text: '我的分销',
|
|
|
- url: '/pages/users/user_spread_user/index'
|
|
|
- },
|
|
|
- {
|
|
|
- id: 8,
|
|
|
- icon: '/static/img/ic-friend.png',
|
|
|
- text: '邀请好友',
|
|
|
- url: ''
|
|
|
- },
|
|
|
- // {
|
|
|
- // id: 9,
|
|
|
- // icon: '/static/img/ic-feedback.png',
|
|
|
- // text: '帮助反馈',
|
|
|
- // url: ''
|
|
|
- // },
|
|
|
- {
|
|
|
- id: 9,
|
|
|
- icon: '/static/img/ic-feedback.png',
|
|
|
- text: '我的账户',
|
|
|
- url: '/pages/users/user_money/index'
|
|
|
- },
|
|
|
- {
|
|
|
- id: 10,
|
|
|
- icon: '/static/img/ic-security-settings.png',
|
|
|
- text: '安全设置',
|
|
|
- url: '/pages/users/user_setting/index'
|
|
|
- }
|
|
|
- ],
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad(options) {
|
|
|
- let that = this;
|
|
|
- //首页数据加载
|
|
|
- // this.getIndexConfig();
|
|
|
- // #ifdef MP-WEIXIN
|
|
|
- // 获取微信胶囊的位置信息 width,height,top,right,left,bottom
|
|
|
- const custom = wx.getMenuButtonBoundingClientRect()
|
|
|
- // 导航栏高度(标题栏高度) = 胶囊高度 + (顶部距离 - 状态栏高度) * 2
|
|
|
- this.navigationBarHeight = custom.height + (custom.top - this.statusBarHeight) * 2
|
|
|
- // console.log("导航栏高度："+this.globalData.navigationBarHeight)
|
|
|
- // #endif
|
|
|
-
|
|
|
- },
|
|
|
- onShow: function() {
|
|
|
- if (this.isLogin) {
|
|
|
- this.getUserCenterInfo();
|
|
|
- this.getOrderData();
|
|
|
- this.getMerchantList();
|
|
|
- }
|
|
|
- this.copyrightImage();
|
|
|
- },
|
|
|
- methods: {
|
|
|
- toggle(type) {
|
|
|
- if (this.merchantEmployeeList.length == 1) {
|
|
|
- merchantActive(this.merchantEmployeeList[0].merId).then(res => {
|
|
|
- this.$store.commit('SetSelectMerId', this.merchantEmployeeList[0].merId);
|
|
|
- this.$store.commit('SetSelectMerchantRole', this.merchantEmployeeList[0].role);
|
|
|
- this.$store.commit('SET_MANAGER_TOKEN', {
|
|
|
- managerToken: res.data.token
|
|
|
- });
|
|
|
- Cache.set('electrPrintingSwitch', res.data.electrPrintingSwitch);
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/admin/work/index'
|
|
|
- })
|
|
|
- return
|
|
|
- })
|
|
|
- return
|
|
|
- }
|
|
|
- if (this.selectMerId) {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/admin/work/index'
|
|
|
- })
|
|
|
- } else {
|
|
|
- this.type = type
|
|
|
- // open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
|
|
|
- this.$refs.popup.open(type)
|
|
|
- }
|
|
|
- },
|
|
|
- copyrightImage() {
|
|
|
- copyrightImageApi().then(res => {
|
|
|
- if (res.data) {
|
|
|
- this.copyImage = res.data;
|
|
|
- } else {
|
|
|
- this.copyImage = `${this.urlDomain}crmebimage/presets/support.png`;
|
|
|
- }
|
|
|
- }).catch(err => {
|
|
|
- return this.$util.Tips({
|
|
|
- title: err
|
|
|
- })
|
|
|
- });
|
|
|
- },
|
|
|
- getOrderData() {
|
|
|
- let that = this;
|
|
|
- orderNum().then(res => {
|
|
|
- that.orderMenu.forEach((item, index) => {
|
|
|
- switch (item.title) {
|
|
|
- case '待付款':
|
|
|
- item.num = res.data.awaitPayCount
|
|
|
- break
|
|
|
- case '待发货':
|
|
|
- item.num = res.data.awaitShippedCount
|
|
|
- break
|
|
|
- case '待收货':
|
|
|
- item.num = res.data.receiptCount
|
|
|
- break
|
|
|
- case '待核销':
|
|
|
- item.num = res.data.verificationCount
|
|
|
- break
|
|
|
- case '待评价':
|
|
|
- item.num = res.data.awaitReplyCount
|
|
|
- break
|
|
|
- default:
|
|
|
- item.num = res.data.refundCount
|
|
|
- }
|
|
|
- })
|
|
|
- that.$set(that, 'orderMenu', that.orderMenu);
|
|
|
- })
|
|
|
- },
|
|
|
- /**
|
|
|
- *
|
|
|
- * 获取个人中心详情
|
|
|
- */
|
|
|
- getUserCenterInfo: function() {
|
|
|
- userCenterInfo().then(res => {
|
|
|
- let data = res.data;
|
|
|
- this.userInfo = data;
|
|
|
- console.log(this, UserInfo)
|
|
|
- // this.showSkeleton = false;
|
|
|
- }).catch(err => {
|
|
|
- // this.showSkeleton = false;
|
|
|
- });
|
|
|
- },
|
|
|
- //获取商户列表
|
|
|
- getMerchantList() {
|
|
|
- let that = this
|
|
|
- MerchantBelongListApi().then(res => {
|
|
|
- if (this.selectMerId) {
|
|
|
- let flag = res.data.find(item => item.merId === this.selectMerId);
|
|
|
- !flag && that.$store.commit('CLEAR_SELECTMERID');
|
|
|
- }
|
|
|
- this.$store.commit("SetMerchantEmployeeList", res.data);
|
|
|
- })
|
|
|
- },
|
|
|
- menusTap(url) {
|
|
|
- if (!this.isLogin) {
|
|
|
- this.openAuto();
|
|
|
- } else {
|
|
|
- if (url === '') return
|
|
|
- this.$util.navigateTo(url);
|
|
|
- }
|
|
|
- },
|
|
|
- // 打开授权
|
|
|
- openAuto() {
|
|
|
- Cache.set(BACK_URL, '')
|
|
|
- toLogin();
|
|
|
- },
|
|
|
- // 跳转骑手
|
|
|
- menusRider(url, falg) {
|
|
|
- if (!this.isLogin) {
|
|
|
- this.openAuto();
|
|
|
- } else {
|
|
|
- if (url === '') return
|
|
|
- falg ? uni.reLaunch({
|
|
|
- url: url
|
|
|
- }) : this.$util.navigateTo(url)
|
|
|
- }
|
|
|
- },
|
|
|
- // 编辑页面
|
|
|
- goEdit() {
|
|
|
- if (this.isLogin == false) {
|
|
|
- this.openAuto();
|
|
|
- } else {
|
|
|
- uni.navigateTo({
|
|
|
- animationType: animationType.type,
|
|
|
- animationDuration: animationType.duration,
|
|
|
- url: '/pages/users/user_info/index'
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
- }
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
- .order-nav {
|
|
|
- font-weight: 500;
|
|
|
- font-size: 35rpx;
|
|
|
- color: #FFFFFF;
|
|
|
- background-color: #FF6702;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .item-settled {
|
|
|
- background: linear-gradient(135deg, #FED0A7 0%, #FFF3E2 52%, #FAEDD3 100%);
|
|
|
- border-radius: 8rpx;
|
|
|
- padding: 20rpx;
|
|
|
- box-shadow: 0 0 0 2rpx rgba(255, 220, 135, 1);
|
|
|
- position: relative;
|
|
|
- // top: -90rpx;
|
|
|
- margin: 0 20rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- .support {
|
|
|
- width: 219rpx;
|
|
|
- height: 74rpx;
|
|
|
- margin: 20rpx auto;
|
|
|
- display: block;
|
|
|
- }
|
|
|
- .num-wrapper {
|
|
|
- z-index: 30;
|
|
|
- position: relative;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- margin-top: 30rpx;
|
|
|
- color: #fff;
|
|
|
-
|
|
|
- .num-item {
|
|
|
- width: 33.33%;
|
|
|
- text-align: center;
|
|
|
-
|
|
|
- .num {
|
|
|
- font-size: 42rpx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .txt {
|
|
|
- margin-top: 10rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- color: rgba(255, 255, 255, 0.6);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .item-settled::after {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- top: -2rpx;
|
|
|
- left: -2rpx;
|
|
|
- right: -2rpx;
|
|
|
- bottom: -2rpx;
|
|
|
- background: linear-gradient(200deg, rgba(255, 220, 135, 1), rgba(255, 172, 33, 1), rgba(255, 201, 24, 1));
|
|
|
- border-radius: 10rpx;
|
|
|
- z-index: -1;
|
|
|
- pointer-events: none;
|
|
|
- }
|
|
|
-
|
|
|
- .card {
|
|
|
- position: relative;
|
|
|
- display: flex;
|
|
|
- /* 启用flex布局 */
|
|
|
- box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
|
|
|
- padding: 40rpx 30rpx 120rpx 30rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- background: linear-gradient(225deg, #ECF3FE 0%, #FEFEFE 100%);
|
|
|
- border-radius: 23rpx;
|
|
|
- top: -20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .card-left {
|
|
|
- position: relative;
|
|
|
- }
|
|
|
-
|
|
|
- .card-right {
|
|
|
- flex: 1;
|
|
|
- }
|
|
|
- .app_set {
|
|
|
- color: #fff;
|
|
|
- width: 140rpx;
|
|
|
- height: 110rpx;
|
|
|
- text-align: right;
|
|
|
- line-height: 110rpx;
|
|
|
-
|
|
|
- .icon-shezhi {
|
|
|
- font-size: 36rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .avatar {
|
|
|
- position: absolute;
|
|
|
- top: -80rpx;
|
|
|
- left: 0;
|
|
|
- width: 131rpx;
|
|
|
- height: 131rpx;
|
|
|
- background-color: #D8D8D8;
|
|
|
- border: 4rpx solid #FFFFFF;
|
|
|
- border-radius: 50%;
|
|
|
- object-fit: cover;
|
|
|
- }
|
|
|
-
|
|
|
- .username {
|
|
|
- margin-top: 70rpx;
|
|
|
- color: #141414;
|
|
|
- font-size: 35rpx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .code {
|
|
|
- width: 31rpx;
|
|
|
- height: 31rpx;
|
|
|
- margin-left: 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .card-content {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- }
|
|
|
-
|
|
|
- .content-item {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- width: 33%;
|
|
|
- }
|
|
|
-
|
|
|
- .content-icon {
|
|
|
- width: 70rpx;
|
|
|
- height: 70rpx;
|
|
|
- margin-bottom: 15rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .content-text1 {
|
|
|
- font-size: 23rpx;
|
|
|
- background: linear-gradient(90deg, #FFB908 0%, #DC7A11 100%);
|
|
|
- -webkit-background-clip: text;
|
|
|
- background-clip: text;
|
|
|
- color: transparent;
|
|
|
- }
|
|
|
-
|
|
|
- .content-text2 {
|
|
|
- font-size: 23rpx;
|
|
|
- background: linear-gradient(90deg, #93B0FF 0%, #1B4EFF 100%);
|
|
|
- -webkit-background-clip: text;
|
|
|
- background-clip: text;
|
|
|
- color: transparent;
|
|
|
- }
|
|
|
-
|
|
|
- .content-text3 {
|
|
|
- font-size: 23rpx;
|
|
|
- background: linear-gradient(90deg, #F4D600 0%, #FF9100 100%);
|
|
|
- -webkit-background-clip: text;
|
|
|
- background-clip: text;
|
|
|
- color: transparent;
|
|
|
- }
|
|
|
-
|
|
|
- .phone-info {
|
|
|
- font-size: 21rpx;
|
|
|
- padding-top: 10rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .phone-info text {
|
|
|
- margin-right: 14rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .phone-info image {
|
|
|
- width: 27rpx;
|
|
|
- height: 27rpx;
|
|
|
- vertical-align: middle;
|
|
|
- }
|
|
|
-
|
|
|
- .profile-link {
|
|
|
- margin-top: 20rpx;
|
|
|
- font-size: 23rpx;
|
|
|
- font-weight: 600;
|
|
|
- line-height: 21rpx;
|
|
|
- text-align: right;
|
|
|
- }
|
|
|
-
|
|
|
- .profile-link img {
|
|
|
- width: 24rpx;
|
|
|
- height: 24rpx;
|
|
|
- vertical-align: middle;
|
|
|
- margin-left: 12rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .grid-container {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- gap: 0;
|
|
|
- /* 改用 margin 控制间距 */
|
|
|
- padding: 20rpx;
|
|
|
- /* 父容器内边距 */
|
|
|
- box-sizing: border-box;
|
|
|
- /* 包含 padding 在宽度内 */
|
|
|
- }
|
|
|
-
|
|
|
- .grid-item {
|
|
|
- width: 25%;
|
|
|
- /* 直接 25% 无需 calc */
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 30rpx;
|
|
|
- /* 行间距 */
|
|
|
- padding: 0 10rpx;
|
|
|
- /* 左右间隙（替代 gap） */
|
|
|
- box-sizing: border-box;
|
|
|
- /* 关键 */
|
|
|
- }
|
|
|
-
|
|
|
- .grid-img {
|
|
|
- width: 58rpx;
|
|
|
- height: 58rpx;
|
|
|
- margin-bottom: 8rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .grid-text {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #333;
|
|
|
- }
|
|
|
-
|
|
|
- .item-features {
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 23rpx;
|
|
|
- margin: 0rpx 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .item-features-title {
|
|
|
- padding: 20rpx;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 27rpx;
|
|
|
- color: #2E261E;
|
|
|
- line-height: 38rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .go-img {
|
|
|
- background: linear-gradient(135deg, #FED0A7 0%, #FFF3E2 52%, #FAEDD3 100%);
|
|
|
- border-radius: 8rpx;
|
|
|
- padding: 20rpx;
|
|
|
- box-shadow: 0 0 0 2rpx rgba(255, 220, 135, 1);
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- margin-top: 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .order-box {
|
|
|
- background-color: #fff;
|
|
|
- border-radius: 14rpx;
|
|
|
- padding: 30rpx 16rpx;
|
|
|
- position: relative;
|
|
|
- z-index: 11;
|
|
|
- margin: 20rpx;
|
|
|
-
|
|
|
- .order-hd {
|
|
|
- justify-content: space-between;
|
|
|
- font-size: 30rpx;
|
|
|
- color: #282828;
|
|
|
- margin-bottom: 40rpx;
|
|
|
- padding: 0 16rpx;
|
|
|
-
|
|
|
- .left {
|
|
|
- color: #282828;
|
|
|
- font-size: 30rpx;
|
|
|
- font-weight: 600;
|
|
|
- }
|
|
|
-
|
|
|
- .right {
|
|
|
- align-items: center;
|
|
|
- color: #666666;
|
|
|
- font-size: 26rpx;
|
|
|
-
|
|
|
- .icon-xiangyou {
|
|
|
- margin-left: 5rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .order-bd {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- padding: 0;
|
|
|
-
|
|
|
- .order-item {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .pic {
|
|
|
- position: relative;
|
|
|
- text-align: center;
|
|
|
-
|
|
|
- image {
|
|
|
- width: 48rpx;
|
|
|
- height: 48rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .order-status-num {
|
|
|
- min-width: 13rpx;
|
|
|
- background-color: #fff;
|
|
|
- color: $bg-color-primary;
|
|
|
- border-radius: 15px;
|
|
|
- position: absolute;
|
|
|
- right: -14rpx;
|
|
|
- top: -15rpx;
|
|
|
- font-size: 20rpx;
|
|
|
- padding: 0 8rpx;
|
|
|
- border: 2rpx solid $bg-color-primary;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .txt {
|
|
|
- margin-top: 15rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- color: #454545;
|
|
|
- }
|
|
|
-
|
|
|
- .pic_status {
|
|
|
- color: $bg-color-primary;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</style>
|
