|
|
@@ -1,130 +1,208 @@
|
|
|
<template>
|
|
|
- <view>
|
|
|
- <!-- 状态栏高度 -->
|
|
|
- <view :style="{ height: `${statusBarHeight}px` }"></view>
|
|
|
-
|
|
|
- <!-- 导航栏 -->
|
|
|
- <view :style="{ height: `${navigationBarHeight}px`,lineHeight: `${navigationBarHeight}px`}" class="order-nav">
|
|
|
- 个人中心
|
|
|
+ <view :data-theme="theme">
|
|
|
+ <!-- #ifdef MP -->
|
|
|
+ <view class="cart_nav" :style='"height:"+navH+"rpx;"'>
|
|
|
+ <nav-bar iconColor='#fff' ref="navBarRef" navTitle="个人中心">
|
|
|
+ </nav-bar>
|
|
|
</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">
|
|
|
- <img class="content-icon" src="/static/img/ic-tickets.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>
|
|
|
+ <!-- #endif -->
|
|
|
+ <tui-skeleton v-if="showSkeleton"></tui-skeleton>
|
|
|
+ <view class="new-users copy-data tui-skeleton">
|
|
|
+ <view class="mid" style="flex:1;overflow: hidden;">
|
|
|
+ <scroll-view scroll-y="true">
|
|
|
+ <view class="head borderPad">
|
|
|
+ <view class="bg"
|
|
|
+ :style="{'background-image': `url(${urlDomain}crmebimage/presets/user_bg.png)`}">
|
|
|
+ <view class="user-card">
|
|
|
+ <view class="user-info">
|
|
|
+ <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="info">
|
|
|
+ <view class="name" v-if="!isLogin" @tap="openAuto">
|
|
|
+ 请点击登录
|
|
|
+ </view>
|
|
|
+ <view class="name" v-if="userInfo && uid">
|
|
|
+ <view @click="goEdit()">
|
|
|
+ {{userInfo && userInfo.nickname && uid ? userInfo.nickname : ''}}
|
|
|
+ </view>
|
|
|
+ <view class="vip" v-if="userInfo.vipIcon" @click="goEdit()">
|
|
|
+ <image :src="userInfo.vipIcon" alt=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="vip" v-if="userInfo.isPaidMember"
|
|
|
+ @click="menusTap('/pages/activity/vip_paid/index')">
|
|
|
+ <image
|
|
|
+ :style="{'background-image': `url(${urlDomain}crmebimage/presets/viptu.png)`}">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="num mt10" v-if="userInfo && userInfo.phone && uid"
|
|
|
+ @click="goEdit()">
|
|
|
+ <view class="num-txt">{{userInfo.phone}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="app_set" @click="handleUserSetting()">
|
|
|
+ <text class="iconfont icon-shezhi"></text>
|
|
|
+ </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>
|
|
|
+ <view v-show="userInfo.paidMemberPaidEntrance===1"
|
|
|
+ @click="menusTap('/pages/activity/vip_paid/index')" class="h-128 svip-box px-30"
|
|
|
+ :style="{'background-image': `url(${urlDomain}crmebimage/presets/cardbj.png)`}">
|
|
|
+ <view class="acea-row row-middle row-between h-94">
|
|
|
+ <view class="acea-row">
|
|
|
+ <view class="w-34 h-28 no-repeat vipicon"
|
|
|
+ :style="{'background-image': `url(${urlDomain}crmebimage/presets/huangguan.png)`}">
|
|
|
+ </view>
|
|
|
+ <view class="f-s-24 text ml-12">加入SVIP畅享精彩</view>
|
|
|
+ </view>
|
|
|
+ <view class="acea-row row-middle">
|
|
|
+ <view class="f-s-24 text mr10">{{userInfo.isPaidMember?'去查看':'去开通'}}</view>
|
|
|
+ <text class="iconfont icon-gengduo3 text f-s-20"></text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="order-wrapper tui-skeleton-rect"
|
|
|
+ :class="userInfo.paidMemberPaidEntrance===1?'mt34rpx':''">
|
|
|
+ <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>
|
|
|
- <view class="content-item">
|
|
|
- <img class="content-icon" src="/static/img/ic-gold.png" alt="我的金币">
|
|
|
- <view class="content-text3">我的金币</view>
|
|
|
- </view-->
|
|
|
- <view class="app_set" @click="goEdit()">
|
|
|
- <text class="iconfont icon-shezhi">设置</text>
|
|
|
+ <view class="contenBox borderPad" id="pageIndex">
|
|
|
+ <!-- 轮播 -->
|
|
|
+ <view class="slider-wrapper tui-skeleton-rect" @click.native="bindEdit('userBanner')"
|
|
|
+ v-if="centerBanner != null && centerBanner.length > 0">
|
|
|
+ <swiper v-if="centerBanner.length>0" indicator-dots="true" :autoplay="autoplay"
|
|
|
+ :circular="circular" :interval="interval" :duration="duration"
|
|
|
+ indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff">
|
|
|
+ <block v-for="(item,index) in centerBanner" :key="index">
|
|
|
+ <swiper-item class="borRadius14">
|
|
|
+ <image :src="item.pic" class="slide-image" @click="navito(item.url)"></image>
|
|
|
+ </swiper-item>
|
|
|
+ </block>
|
|
|
+ </swiper>
|
|
|
+ </view>
|
|
|
+ <!-- 会员菜单 -->
|
|
|
+ <view class="user-menus mt20" @click.native="bindEdit('userMenus')">
|
|
|
+ <view class="menu-title">我的服务</view>
|
|
|
+ <view class="list-box">
|
|
|
+ <block v-for="(item,index) in centerMenu" :key="index">
|
|
|
+ <view class="item tui-skeleton-rect" @click="menusTap(item.url)"
|
|
|
+ v-if="!(item.url =='/pages/service/index' || (item.url =='/pages/users/user_spread_user/index' && !userInfo.isPromoter)||(!isEmployee&&item.url=='/pages/admin/work/index'))">
|
|
|
+ <image :src="item.pic"></image>
|
|
|
+ <text>{{item.name}}</text>
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+ <!-- #ifndef MP -->
|
|
|
+ <view class="item" @click="kefuClick">
|
|
|
+ <image :src="servicePic"></image>
|
|
|
+ <text>联系客服</text>
|
|
|
+ </view>
|
|
|
+ <!-- #endif -->
|
|
|
+ <!-- #ifdef MP -->
|
|
|
+ <button class="item" hover-class='none' @click="kefuClick"
|
|
|
+ v-if="chatConfig.telephone_service_switch === 'true'">
|
|
|
+ <image :src="servicePic"></image>
|
|
|
+ <text>联系客服</text>
|
|
|
+ </button>
|
|
|
+ <button class="item" open-type='contact' hover-class='none' v-else>
|
|
|
+ <image :src="servicePic"></image>
|
|
|
+ <text>联系客服</text>
|
|
|
+ </button>
|
|
|
+ <!-- #endif -->
|
|
|
+ </view>
|
|
|
+ </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>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- <view class="profile-link">
|
|
|
- <text>个人中心</text>
|
|
|
- <img src="/static/img/ic-right.png" />
|
|
|
- </view> -->
|
|
|
+ <image :src="copyImage" alt="" class='support'></image>
|
|
|
+ </scroll-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">
|
|
|
- <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 v-if="bottomNavigationIsCustom" class="footerBottom"></view> -->
|
|
|
+ <!-- <pageFooter></pageFooter> -->
|
|
|
+ <uni-popup ref="popup" type="bottom" background-color="rgba(0,0,0,0)" border-radius="10px 10px 0 0">
|
|
|
+ <view class="popup-content">
|
|
|
+ <view class="item" v-for="(item,index) in merchantEmployeeList" :key="index"
|
|
|
+ :class="{bottom_border:index!=merchantEmployeeList.length-1}">
|
|
|
+ <view class="item_main">
|
|
|
+ <image :src="item.currentMerchant.avatar" mode="" class="item_img"></image>
|
|
|
+ <view class="item_name" :class="{nameColor:item.merId==selectMerId}">
|
|
|
+ {{item.currentMerchant.name}}</view>
|
|
|
</view>
|
|
|
+ <text v-if="item.merId==selectMerId" class="iconfont icon-xuanzhong11 icon-size icon_color"></text>
|
|
|
+ <text v-else class="iconfont icon-weixuan icon-size" @click="radioChange(item)"></text>
|
|
|
</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="item-features" v-if="isLogin && isEmployee">
|
|
|
- <view class="item-features-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>
|
|
|
+ </uni-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
-
|
|
|
<script>
|
|
|
- var statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
|
|
|
- let app = getApp();
|
|
|
+ let sysHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
|
|
|
+ import Cache from '@/utils/cache';
|
|
|
+ import navBar from '@/components/navBar';
|
|
|
+ import {
|
|
|
+ goPage
|
|
|
+ } from '@/libs/iframe.js'
|
|
|
+ import {
|
|
|
+ BACK_URL,
|
|
|
+ USER_INFO
|
|
|
+ } from '@/config/cache';
|
|
|
import {
|
|
|
userCenterInfo,
|
|
|
copyrightImageApi
|
|
|
} from '@/api/user.js';
|
|
|
- import Cache from '@/utils/cache';
|
|
|
+ import {
|
|
|
+ MerchantBelongListApi,
|
|
|
+ merchantActive
|
|
|
+ } from '@/api/work.js';
|
|
|
import {
|
|
|
orderNum
|
|
|
} from '@/api/order.js';
|
|
|
@@ -135,17 +213,38 @@
|
|
|
mapGetters
|
|
|
} from "vuex";
|
|
|
import {
|
|
|
- BACK_URL
|
|
|
- } from '@/config/cache';
|
|
|
+ getCityList
|
|
|
+ } from "@/utils";
|
|
|
+ import {
|
|
|
+ tokenIsExistApi
|
|
|
+ } from '@/api/api.js';
|
|
|
+ // #ifdef H5
|
|
|
+ import Auth from '@/libs/wechat';
|
|
|
+ // #endif
|
|
|
+ import {
|
|
|
+ getShare
|
|
|
+ } from '@/api/public.js';
|
|
|
+ import {
|
|
|
+ setThemeColor
|
|
|
+ } from '@/utils/setTheme.js'
|
|
|
import animationType from '@/utils/animationType.js'
|
|
|
+ import {
|
|
|
+ chatConfig
|
|
|
+ } from '@/utils/consumerType.js'
|
|
|
+ import tuiSkeleton from '@/components/base/tui-skeleton.vue';
|
|
|
+ import pageFooter from "@/components/pageFooter/index.vue";
|
|
|
+ const app = getApp();
|
|
|
export default {
|
|
|
- computed: mapGetters(['isLogin','merchantEmployeeList', 'isEmployee', 'selectMerId']),
|
|
|
+ computed: mapGetters(['isLogin', 'chatUrl', 'uid', 'globalData', 'bottomNavigationIsCustom',
|
|
|
+ 'merchantEmployeeList', 'isEmployee', 'selectMerId'
|
|
|
+ ]),
|
|
|
data() {
|
|
|
return {
|
|
|
- statusBarHeight: app.globalData.statusBarHeight,
|
|
|
- navigationBarHeight: 0,
|
|
|
- userInfo: {},
|
|
|
+ scrollHeight: 0,
|
|
|
+ triggered: false,
|
|
|
+ isRefresher: false, //下拉刷新状态
|
|
|
urlDomain: this.$Cache.get("imgHost"),
|
|
|
+ showSkeleton: true, //骨架屏显示隐藏
|
|
|
orderMenu: [{
|
|
|
img: 'icon-daifukuan',
|
|
|
title: '待付款',
|
|
|
@@ -183,96 +282,109 @@
|
|
|
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/users/user_coupon/index'
|
|
|
- },
|
|
|
- {
|
|
|
- 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'
|
|
|
- }
|
|
|
- ],
|
|
|
+ centerBanner: [],
|
|
|
+ userMenu: [],
|
|
|
+ autoplay: true,
|
|
|
+ circular: true,
|
|
|
+ interval: 3000,
|
|
|
+ duration: 500,
|
|
|
+ isAuto: false, //没有授权的不会自动授权
|
|
|
+ isShowAuth: false, //是否隐藏授权
|
|
|
+ orderStatusNum: {},
|
|
|
+ centerMenu: [],
|
|
|
+ wechatUrl: [],
|
|
|
+ servicePic: '',
|
|
|
+ sysHeight: sysHeight,
|
|
|
+ // #ifdef MP
|
|
|
+ pageHeight: '100%',
|
|
|
+ // #endif
|
|
|
+ // #ifdef H5 || APP-PLUS
|
|
|
+ pageHeight: '',
|
|
|
+ // #endif
|
|
|
+ // #ifdef H5
|
|
|
+ isWeixin: Auth.isWeixin(),
|
|
|
+ //#endif
|
|
|
+ configApi: {}, //分享类容配置
|
|
|
+ theme: app.globalData.theme,
|
|
|
+ bgColor: '#e93323',
|
|
|
+ userInfo: {},
|
|
|
+ copyImage: '',
|
|
|
+ navH:''
|
|
|
}
|
|
|
},
|
|
|
- onLoad(options) {
|
|
|
+ components: {
|
|
|
+ tuiSkeleton,
|
|
|
+ pageFooter,
|
|
|
+ navBar
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ this.servicePic = this.urlDomain + 'crmebimage/presets/customer.png'
|
|
|
+ this.getTokenIsExist();
|
|
|
+ // #ifdef MP
|
|
|
+ this.navH = this.globalData.navHeight;
|
|
|
+ // #endif
|
|
|
+ // #ifndef MP
|
|
|
+ this.navH = 96;
|
|
|
+ // #endif
|
|
|
+ if (this.globalData.isIframe) {
|
|
|
+ setTimeout(() => {
|
|
|
+ let active;
|
|
|
+ document.getElementById('pageIndex').children.forEach(dom => {
|
|
|
+ dom.addEventListener('click', (e) => {
|
|
|
+ e.stopPropagation();
|
|
|
+ e.preventDefault();
|
|
|
+ if (dom === active) return;
|
|
|
+ dom.classList.add('borderShow');
|
|
|
+ active && active.classList.remove('borderShow');
|
|
|
+ active = dom;
|
|
|
+ })
|
|
|
+ })
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // #ifdef APP-PLUS
|
|
|
+ setTimeout(()=>{
|
|
|
+ uni.setNavigationBarColor({
|
|
|
+ frontColor: '#ffffff',
|
|
|
+ backgroundColor:that.bgColor,
|
|
|
+ });
|
|
|
+ },500)
|
|
|
+ // #endif
|
|
|
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)
|
|
|
+ // #ifdef H5 || APP-PLUS
|
|
|
+ that.$set(that, 'pageHeight', this.globalData.windowHeight);
|
|
|
// #endif
|
|
|
-
|
|
|
+ that.$set(that, 'centerMenu', this.globalData.centerMenu);
|
|
|
+ that.bgColor = setThemeColor();
|
|
|
},
|
|
|
onShow: function() {
|
|
|
if (this.isLogin) {
|
|
|
this.getUserCenterInfo();
|
|
|
this.getOrderData();
|
|
|
- this.getMerchantList();
|
|
|
+ this.getMerchantList()
|
|
|
}
|
|
|
+ this.copyrightImage();
|
|
|
+ this.showSkeleton = false
|
|
|
+ let that = this;
|
|
|
+ if (!that.$Cache.get('cityList')) getCityList();
|
|
|
+ // #ifdef H5
|
|
|
+ uni.getSystemInfo({
|
|
|
+ success: function(res) {
|
|
|
+ that.pageHeight = res.windowHeight + 'px'
|
|
|
+ }
|
|
|
+ });
|
|
|
+ // #endif
|
|
|
+ // #ifdef MP
|
|
|
+ let query = uni.createSelectorQuery();
|
|
|
+ let dom = query.select('.new-users');
|
|
|
+ // #endif
|
|
|
},
|
|
|
methods: {
|
|
|
+ /**
|
|
|
+ * 发现列表滑动中用到的方法
|
|
|
+ */
|
|
|
+ onScroll() {
|
|
|
+ uni.$emit('scroll');
|
|
|
+ },
|
|
|
toggle(type) {
|
|
|
if (this.merchantEmployeeList.length == 1) {
|
|
|
merchantActive(this.merchantEmployeeList[0].merId).then(res => {
|
|
|
@@ -299,6 +411,83 @@
|
|
|
this.$refs.popup.open(type)
|
|
|
}
|
|
|
},
|
|
|
+ //选中商户
|
|
|
+ radioChange(item) {
|
|
|
+ let that = this
|
|
|
+ merchantActive(item.merId).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ that.$store.commit('SET_MANAGER_TOKEN', {
|
|
|
+ managerToken: res.data.token
|
|
|
+ });
|
|
|
+ Cache.set('electrPrintingSwitch', res.data.electrPrintingSwitch);
|
|
|
+ that.$store.commit('SetSelectMerId', item.merId);
|
|
|
+ this.$store.commit('SetSelectMerchantRole', item.role);
|
|
|
+ this.$refs.popup.close()
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/admin/work/index'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //获取商户列表
|
|
|
+ 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);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //校验token是否有效,true为有效，false为无效
|
|
|
+ getTokenIsExist() {
|
|
|
+ tokenIsExistApi().then(res => {
|
|
|
+ let tokenIsExist = res.data;
|
|
|
+ if (!tokenIsExist) {
|
|
|
+ this.$store.commit('UPDATE_LOGIN', '');
|
|
|
+ this.$store.commit('UPDATE_USERINFO', {});
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ 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
|
|
|
+ })
|
|
|
+ });
|
|
|
+ },
|
|
|
+ bindEdit(name) {
|
|
|
+ if (this.globalData.isIframe) {
|
|
|
+ window.parent.postMessage({
|
|
|
+ name: name
|
|
|
+ },
|
|
|
+ '*'
|
|
|
+ );
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ menusTap(url) {
|
|
|
+ if (!this.isLogin) {
|
|
|
+ this.openAuto();
|
|
|
+ } else {
|
|
|
+ if (url === '/pages/activity/vip_paid/index' && this.userInfo.paidMemberPaidEntrance === 0) return
|
|
|
+ this.$util.navigateTo(url);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //轮播图跳转
|
|
|
+ navito(url) {
|
|
|
+ this.$util.navigateTo(url);
|
|
|
+ },
|
|
|
+ kefuClick() {
|
|
|
+ chatConfig(this.$Cache.getItem('platChatConfig'));
|
|
|
+ },
|
|
|
getOrderData() {
|
|
|
let that = this;
|
|
|
orderNum().then(res => {
|
|
|
@@ -326,6 +515,14 @@
|
|
|
that.$set(that, 'orderMenu', that.orderMenu);
|
|
|
})
|
|
|
},
|
|
|
+ // 绑定手机
|
|
|
+ bindPhone() {
|
|
|
+ uni.navigateTo({
|
|
|
+ animationType: animationType.type,
|
|
|
+ animationDuration: animationType.duration,
|
|
|
+ url: '/pages/users/app_login/index'
|
|
|
+ })
|
|
|
+ },
|
|
|
/**
|
|
|
*
|
|
|
* 获取个人中心详情
|
|
|
@@ -334,29 +531,45 @@
|
|
|
userCenterInfo().then(res => {
|
|
|
let data = res.data;
|
|
|
this.userInfo = data;
|
|
|
- console.log(this, UserInfo)
|
|
|
- // this.showSkeleton = false;
|
|
|
+ this.$store.commit("SETUID", data.id);
|
|
|
+ this.$store.commit("SetIsEmployee", data.isEmployee);
|
|
|
+ this.$set(this, 'centerMenu', data.centerMenu);
|
|
|
+ this.$store.commit('UPDATE_USERINFO', {
|
|
|
+ avatar: data.avatar,
|
|
|
+ nickname: data.nickname,
|
|
|
+ phone: data.phone
|
|
|
+ });
|
|
|
+ if (data.centerBanner) {
|
|
|
+ this.centerBanner = data.centerBanner
|
|
|
+ }
|
|
|
+ this.showSkeleton = false;
|
|
|
}).catch(err => {
|
|
|
- // this.showSkeleton = false;
|
|
|
+ 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) {
|
|
|
+ // 编辑页面
|
|
|
+ goEdit() {
|
|
|
+ if (this.isLogin == false) {
|
|
|
this.openAuto();
|
|
|
} else {
|
|
|
- if (url === '') return
|
|
|
- this.$util.navigateTo(url);
|
|
|
+ uni.navigateTo({
|
|
|
+ animationType: animationType.type,
|
|
|
+ animationDuration: animationType.duration,
|
|
|
+ url: '/pages/users/user_info/index'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ goMenuPage(url) {
|
|
|
+ if (this.isLogin) {
|
|
|
+ uni.navigateTo({
|
|
|
+ animationType: animationType.type,
|
|
|
+ animationDuration: animationType.duration,
|
|
|
+ url
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ // #ifdef MP
|
|
|
+ this.openAuto()
|
|
|
+ // #endif
|
|
|
}
|
|
|
},
|
|
|
// 打开授权
|
|
|
@@ -364,332 +577,431 @@
|
|
|
Cache.set(BACK_URL, '')
|
|
|
toLogin();
|
|
|
},
|
|
|
- // 跳转骑手
|
|
|
- menusRider(url, falg) {
|
|
|
+ // 去设置页面
|
|
|
+ handleUserSetting() {
|
|
|
if (!this.isLogin) {
|
|
|
- this.openAuto();
|
|
|
- } else {
|
|
|
- if (url === '') return
|
|
|
- falg ? uni.reLaunch({
|
|
|
- url: url
|
|
|
- }) : this.$util.navigateTo(url)
|
|
|
+ return this.openAuto();
|
|
|
}
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/users/user_setting/index'
|
|
|
+ })
|
|
|
},
|
|
|
- // 编辑页面
|
|
|
- goEdit() {
|
|
|
- if (this.isLogin == false) {
|
|
|
- this.openAuto();
|
|
|
- } else {
|
|
|
- uni.navigateTo({
|
|
|
- animationType: animationType.type,
|
|
|
- animationDuration: animationType.duration,
|
|
|
- url: '/pages/users/user_info/index'
|
|
|
- })
|
|
|
- }
|
|
|
+ shareApi: function() {
|
|
|
+ getShare().then(res => {
|
|
|
+ this.$set(this, 'configApi', res.data);
|
|
|
+ // #ifdef H5
|
|
|
+ this.setOpenShare(res.data);
|
|
|
+ // #endif
|
|
|
+ })
|
|
|
},
|
|
|
- },
|
|
|
+ // 微信分享；
|
|
|
+ setOpenShare: function() {
|
|
|
+ let that = this;
|
|
|
+ if (that.$wechat.isWeixin()) {
|
|
|
+ let configAppMessage = {
|
|
|
+ desc: 'crmeb',
|
|
|
+ title: 'crmeb',
|
|
|
+ link: location.href,
|
|
|
+ imgUrl: ''
|
|
|
+ };
|
|
|
+ that.$wechat.wechatEvevt([
|
|
|
+ "updateAppMessageShareData",
|
|
|
+ "updateTimelineShareData",
|
|
|
+ "onMenuShareAppMessage",
|
|
|
+ "onMenuShareTimeline",
|
|
|
+ ],
|
|
|
+ configAppMessage);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .order-nav {
|
|
|
- font-weight: 500;
|
|
|
- font-size: 35rpx;
|
|
|
- color: #FFFFFF;
|
|
|
- background-color: #FF6702;
|
|
|
- text-align: center;
|
|
|
+ .vipicon {
|
|
|
+ background-size: 100% 100%;
|
|
|
}
|
|
|
|
|
|
- .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;
|
|
|
- }
|
|
|
-
|
|
|
- .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;
|
|
|
+ .mt34rpx {
|
|
|
+ margin-top: -34rpx;
|
|
|
}
|
|
|
|
|
|
- .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;
|
|
|
- }
|
|
|
+ .svip-box {
|
|
|
+ width: 702rpx;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: 702rpx 128rpx;
|
|
|
|
|
|
- .card-left {
|
|
|
- position: relative;
|
|
|
+ .text {
|
|
|
+ color: #FFD89C;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- .card-right {
|
|
|
- flex: 1;
|
|
|
+ .num-txt {
|
|
|
+ padding: 6rpx 20rpx;
|
|
|
+ border-radius: 36rpx;
|
|
|
+ background: rgba(255, 255, 255, 0.2);
|
|
|
}
|
|
|
- .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;
|
|
|
+ page,
|
|
|
+ body {
|
|
|
+ height: 100%;
|
|
|
+ margin: 0;
|
|
|
}
|
|
|
|
|
|
- .username {
|
|
|
- margin-top: 70rpx;
|
|
|
- color: #141414;
|
|
|
- font-size: 35rpx;
|
|
|
- font-weight: bold;
|
|
|
+ .ma .mp-header {
|
|
|
+ @include main_bg_color(theme);
|
|
|
}
|
|
|
|
|
|
- .code {
|
|
|
- width: 31rpx;
|
|
|
- height: 31rpx;
|
|
|
- margin-left: 20rpx;
|
|
|
+ .bg {
|
|
|
+ width: 100%;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
}
|
|
|
|
|
|
- .card-content {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
+ .support {
|
|
|
+ width: 219rpx;
|
|
|
+ height: 74rpx;
|
|
|
+ margin: 20rpx auto;
|
|
|
+ display: block;
|
|
|
}
|
|
|
|
|
|
- .content-item {
|
|
|
+ .new-users {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- width: 33%;
|
|
|
- }
|
|
|
-
|
|
|
- .content-icon {
|
|
|
- width: 70rpx;
|
|
|
- height: 70rpx;
|
|
|
- margin-bottom: 15rpx;
|
|
|
- }
|
|
|
+ height: 100%;
|
|
|
+
|
|
|
+ .sys-head {
|
|
|
+ position: relative;
|
|
|
+ width: 100%;
|
|
|
+ background: linear-gradient(90deg, $bg-star1 0%, $bg-end1 100%);
|
|
|
+
|
|
|
+ .sys-title {
|
|
|
+ z-index: 10;
|
|
|
+ position: relative;
|
|
|
+ height: 43px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 43px;
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #FFFFFF;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .content-text1 {
|
|
|
- font-size: 23rpx;
|
|
|
- background: linear-gradient(90deg, #FFB908 0%, #DC7A11 100%);
|
|
|
- -webkit-background-clip: text;
|
|
|
- background-clip: text;
|
|
|
- color: transparent;
|
|
|
- }
|
|
|
+ .head {
|
|
|
+ width: 100%;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ @include index-gradient(theme);
|
|
|
+
|
|
|
+ .user-card {
|
|
|
+ width: 100%;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding: 35rpx 0 40rpx 0;
|
|
|
+
|
|
|
+ .user-info {
|
|
|
+ z-index: 20;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #fff;
|
|
|
+
|
|
|
+ .avatar {
|
|
|
+ width: 120rpx;
|
|
|
+ height: 120rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ }
|
|
|
|
|
|
- .content-text2 {
|
|
|
- font-size: 23rpx;
|
|
|
- background: linear-gradient(90deg, #93B0FF 0%, #1B4EFF 100%);
|
|
|
- -webkit-background-clip: text;
|
|
|
- background-clip: text;
|
|
|
- color: transparent;
|
|
|
- }
|
|
|
+ .app_set {
|
|
|
+ color: #fff;
|
|
|
+ width: 140rpx;
|
|
|
+ height: 110rpx;
|
|
|
+ text-align: right;
|
|
|
+ line-height: 110rpx;
|
|
|
|
|
|
- .content-text3 {
|
|
|
- font-size: 23rpx;
|
|
|
- background: linear-gradient(90deg, #F4D600 0%, #FF9100 100%);
|
|
|
- -webkit-background-clip: text;
|
|
|
- background-clip: text;
|
|
|
- color: transparent;
|
|
|
- }
|
|
|
+ .icon-shezhi {
|
|
|
+ font-size: 36rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .phone-info {
|
|
|
- font-size: 21rpx;
|
|
|
- padding-top: 10rpx;
|
|
|
- }
|
|
|
+ .info {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-left: 20rpx;
|
|
|
+ padding: 15rpx 0;
|
|
|
+
|
|
|
+ .name {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 31rpx;
|
|
|
+
|
|
|
+ .vip {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border-radius: 18px;
|
|
|
+ font-size: 20rpx;
|
|
|
+ margin-left: 14rpx;
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 27rpx;
|
|
|
+ height: 27rpx;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .phone-info text {
|
|
|
- margin-right: 14rpx;
|
|
|
- }
|
|
|
+ .num {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: rgba(255, 255, 255, 0.6);
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 22rpx;
|
|
|
+ height: 23rpx;
|
|
|
+ margin-left: 20rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .phone-info image {
|
|
|
- width: 27rpx;
|
|
|
- height: 27rpx;
|
|
|
- vertical-align: middle;
|
|
|
- }
|
|
|
+ .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;
|
|
|
+ }
|
|
|
|
|
|
- .profile-link {
|
|
|
- margin-top: 20rpx;
|
|
|
- font-size: 23rpx;
|
|
|
- font-weight: 600;
|
|
|
- line-height: 21rpx;
|
|
|
- text-align: right;
|
|
|
- }
|
|
|
+ .txt {
|
|
|
+ margin-top: 10rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: rgba(255, 255, 255, 0.6);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .profile-link img {
|
|
|
- width: 24rpx;
|
|
|
- height: 24rpx;
|
|
|
- vertical-align: middle;
|
|
|
- margin-left: 12rpx;
|
|
|
- }
|
|
|
+ .sign {
|
|
|
+ z-index: 200;
|
|
|
+ position: absolute;
|
|
|
+ right: -12rpx;
|
|
|
+ top: 80rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 120rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ background: linear-gradient(90deg, rgba(255, 225, 87, 1) 0%, rgba(238, 193, 15, 1) 100%);
|
|
|
+ border-radius: 29rpx 4rpx 4rpx 29rpx;
|
|
|
+ color: #282828;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .grid-container {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- gap: 0;
|
|
|
- /* 改用 margin 控制间距 */
|
|
|
- padding: 20rpx;
|
|
|
- /* 父容器内边距 */
|
|
|
- box-sizing: border-box;
|
|
|
- /* 包含 padding 在宽度内 */
|
|
|
- }
|
|
|
+ .order-wrapper {
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 14rpx;
|
|
|
+ padding: 30rpx 16rpx;
|
|
|
+ position: relative;
|
|
|
+ z-index: 11;
|
|
|
+
|
|
|
+ .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;
|
|
|
+ }
|
|
|
|
|
|
- .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;
|
|
|
- /* 关键 */
|
|
|
- }
|
|
|
+ .right {
|
|
|
+ align-items: center;
|
|
|
+ color: #666666;
|
|
|
+ font-size: 26rpx;
|
|
|
|
|
|
- .grid-img {
|
|
|
- width: 58rpx;
|
|
|
- height: 58rpx;
|
|
|
- margin-bottom: 8rpx;
|
|
|
- }
|
|
|
+ .icon-xiangyou {
|
|
|
+ margin-left: 5rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .grid-text {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #333;
|
|
|
- }
|
|
|
+ .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;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .item-features {
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 23rpx;
|
|
|
- margin: 0rpx 20rpx;
|
|
|
- }
|
|
|
+ .txt {
|
|
|
+ margin-top: 15rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #454545;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .item-features-title {
|
|
|
- padding: 20rpx;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 27rpx;
|
|
|
- color: #2E261E;
|
|
|
- line-height: 38rpx;
|
|
|
- }
|
|
|
+ .slider-wrapper {
|
|
|
+ margin: 20rpx 0;
|
|
|
+ height: 138rpx;
|
|
|
|
|
|
- .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;
|
|
|
- }
|
|
|
+ swiper,
|
|
|
+ swiper-item {
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
|
|
|
- .order-box {
|
|
|
- background-color: #fff;
|
|
|
- border-radius: 14rpx;
|
|
|
- padding: 30rpx 16rpx;
|
|
|
- position: relative;
|
|
|
- z-index: 11;
|
|
|
- margin: 20rpx;
|
|
|
+ image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .order-hd {
|
|
|
- justify-content: space-between;
|
|
|
- font-size: 30rpx;
|
|
|
- color: #282828;
|
|
|
- margin-bottom: 40rpx;
|
|
|
- padding: 0 16rpx;
|
|
|
+ .user-menus {
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 14rpx;
|
|
|
|
|
|
- .left {
|
|
|
- color: #282828;
|
|
|
+ .menu-title {
|
|
|
+ padding: 30rpx 30rpx 40rpx;
|
|
|
font-size: 30rpx;
|
|
|
+ color: #282828;
|
|
|
font-weight: 600;
|
|
|
}
|
|
|
|
|
|
- .right {
|
|
|
+ .list-box {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item {
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
align-items: center;
|
|
|
- color: #666666;
|
|
|
+ justify-content: space-between;
|
|
|
+ flex-direction: column;
|
|
|
+ width: 25%;
|
|
|
+ margin-bottom: 47rpx;
|
|
|
font-size: 26rpx;
|
|
|
+ color: #333333;
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 52rpx;
|
|
|
+ height: 52rpx;
|
|
|
+ margin-bottom: 18rpx;
|
|
|
+ }
|
|
|
+
|
|
|
|
|
|
- .icon-xiangyou {
|
|
|
- margin-left: 5rpx;
|
|
|
- font-size: 24rpx;
|
|
|
+ &:last-child::before {
|
|
|
+ display: none;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ button {
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- .order-bd {
|
|
|
+ .phone {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .pic_status {
|
|
|
+ font-size: 43rpx;
|
|
|
+ @include main_color(theme);
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-status-num {
|
|
|
+ min-width: 13rpx;
|
|
|
+ background-color: #fff;
|
|
|
+ @include main_color(theme);
|
|
|
+ border-radius: 15px;
|
|
|
+ position: absolute;
|
|
|
+ right: -14rpx;
|
|
|
+ top: -15rpx;
|
|
|
+ font-size: 20rpx;
|
|
|
+ padding: 0 8rpx;
|
|
|
+ @include coupons_border_color(theme);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .sub_btn {
|
|
|
+ width: 690rpx;
|
|
|
+ height: 86rpx;
|
|
|
+ line-height: 86rpx;
|
|
|
+ margin-top: 60rpx;
|
|
|
+ background: $theme-color;
|
|
|
+ border-radius: 43rpx;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 28rpx;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .popup-content {
|
|
|
+ border-radius: 16rpx 16rpx 0px 0px;
|
|
|
+
|
|
|
+ .bottom_border {
|
|
|
+ border-bottom: 1px solid #F5F5F5;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item {
|
|
|
display: flex;
|
|
|
+ align-items: center;
|
|
|
justify-content: space-between;
|
|
|
- padding: 0;
|
|
|
+ padding: 20rpx;
|
|
|
+
|
|
|
+ .icon_color {
|
|
|
+ color: #2A7EFB;
|
|
|
+ }
|
|
|
|
|
|
- .order-item {
|
|
|
+ .item_main {
|
|
|
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;
|
|
|
- }
|
|
|
+ .item_name {
|
|
|
+ margin-left: 20rpx;
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 28rpx;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .txt {
|
|
|
- margin-top: 15rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- color: #454545;
|
|
|
- }
|
|
|
-
|
|
|
- .pic_status {
|
|
|
- color: $bg-color-primary;
|
|
|
- }
|
|
|
+ .item_img {
|
|
|
+ width: 60rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ border-radius: 60rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|
