init
This commit is contained in:
299
fuintUniapp/pages/merchant/balance/recharge.vue
Normal file
299
fuintUniapp/pages/merchant/balance/recharge.vue
Normal file
@@ -0,0 +1,299 @@
|
||||
<template>
|
||||
<view class="container" v-if="userInfo.id">
|
||||
<view class="account-panel dis-flex flex-y-center">
|
||||
<view class="panel-lable">
|
||||
<text>账户余额</text>
|
||||
</view>
|
||||
<view class="panel-balance flex-box">
|
||||
<text>¥{{ userInfo.balance }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="recharge-panel">
|
||||
<view class="recharge-label">
|
||||
<text>充值金额</text>
|
||||
</view>
|
||||
<view class="recharge-plan clearfix" v-if="setting.planList.length > 0">
|
||||
<block v-for="(item, index) in setting.planList" :key="index">
|
||||
<view class="recharge-plan_item" :class="{ active: rechargeAmount == item.rechargeAmount }" @click="onSelectPlan(item.rechargeAmount)">
|
||||
<view class="plan_money">
|
||||
<text>{{ item.rechargeAmount }}</text>
|
||||
</view>
|
||||
<view class="plan_gift" v-if="item.giveAmount > 0">
|
||||
<text>送{{ item.giveAmount }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<!-- 手动充值输入框 -->
|
||||
<view class="recharge-input" v-if="!setting.planList || setting.planList.length < 1">
|
||||
<input type="digit" placeholder="请输入充值金额" v-model="inputValue" @input="onChangeMoney" />
|
||||
</view>
|
||||
<!-- 确认按钮 -->
|
||||
<view class="recharge-submit btn-submit">
|
||||
<form @submit="onSubmit">
|
||||
<button class="button" formType="submit" :disabled="disabled">立即充值</button>
|
||||
</form>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 充值描述 -->
|
||||
<view class="recharge-describe" v-if="setting.remark.length > 0">
|
||||
<view class="recharge-label">
|
||||
<text>充值说明</text>
|
||||
</view>
|
||||
<view class="content">
|
||||
<text space="ensp">{{setting.remark}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as MemberApi from '@/api/merchant/member'
|
||||
import * as UserApi from '@/api/user'
|
||||
import * as BalanceApi from '@/api/balance'
|
||||
import * as RechargeApi from '@/api/merchant/recharge'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 正在加载
|
||||
isLoading: true,
|
||||
// 会员信息
|
||||
userInfo: {},
|
||||
// 充值设置
|
||||
setting: { isOpen: false, planList: [], remark: '' },
|
||||
// 按钮禁用
|
||||
disabled: false,
|
||||
// 当前选中的套餐id
|
||||
rechargeAmount: 0,
|
||||
// 自定义金额
|
||||
inputValue: '',
|
||||
// 会员ID
|
||||
memberId: 0
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
// 会员ID
|
||||
this.memberId = options.memberId ? options.memberId : 0;
|
||||
// 获取页面数据
|
||||
this.getPageData()
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
/**
|
||||
* 选择充值套餐
|
||||
*/
|
||||
onSelectPlan(rechargeAmount) {
|
||||
this.rechargeAmount = rechargeAmount
|
||||
this.inputValue = ''
|
||||
},
|
||||
|
||||
// 金额输入框
|
||||
onChangeMoney(e) {
|
||||
this.inputValue = e.target.value
|
||||
this.rechargeAmount = 0
|
||||
},
|
||||
|
||||
// 获取页面数据
|
||||
getPageData() {
|
||||
const app = this
|
||||
app.isLoading = true
|
||||
Promise.all([app.getUserInfo(), app.getSetting()])
|
||||
.then(() => app.isLoading = false)
|
||||
},
|
||||
|
||||
// 获取会员信息
|
||||
getUserInfo() {
|
||||
const app = this
|
||||
return new Promise((resolve, reject) => {
|
||||
MemberApi.detail(app.memberId)
|
||||
.then(result => {
|
||||
app.userInfo = result.data.userInfo
|
||||
resolve(app.userInfo)
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// 获取充值设置
|
||||
getSetting() {
|
||||
const app = this
|
||||
return new Promise((resolve, reject) => {
|
||||
BalanceApi.setting()
|
||||
.then(result => {
|
||||
app.setting = result.data
|
||||
console.log("app.setting = ", app.setting)
|
||||
resolve(app.setting)
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// 立即充值
|
||||
onSubmit(e) {
|
||||
const app = this
|
||||
if (!app.setting.isOpen) {
|
||||
app.$error('当前未开启充值!')
|
||||
return false
|
||||
}
|
||||
|
||||
if (parseFloat(app.rechargeAmount) <= 0 && app.inputValue.length < 1) {
|
||||
app.$error('请确认充值金额!')
|
||||
return false
|
||||
}
|
||||
|
||||
uni.showModal({
|
||||
title: "提示",
|
||||
content: "您确定要充值金额"+ (app.rechargeAmount + app.inputValue) +"吗?",
|
||||
success({ confirm }) {
|
||||
if (!confirm) {
|
||||
return false;
|
||||
}
|
||||
app.disabled = true
|
||||
RechargeApi.doRecharge(app.rechargeAmount, app.inputValue, app.memberId)
|
||||
.then(result => {
|
||||
if (result.data) {
|
||||
app.$success('充值成功');
|
||||
setTimeout(() => {
|
||||
app.getPageData();
|
||||
}, 2000)
|
||||
}
|
||||
})
|
||||
.catch(err => app.$error('充值失败'))
|
||||
.finally(() => app.disabled = false)
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page,
|
||||
.container {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding-bottom: 70rpx;
|
||||
}
|
||||
|
||||
/* 账户面板 */
|
||||
.account-panel {
|
||||
width: 650rpx;
|
||||
height: 180rpx;
|
||||
margin: 50rpx auto;
|
||||
padding: 0 60rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 8rpx;
|
||||
color: #fff;
|
||||
background: $fuint-theme;
|
||||
box-shadow: 0 5px 22px 0 rgba(0, 0, 0, 0.26);
|
||||
}
|
||||
|
||||
.panel-lable {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.recharge-label {
|
||||
color: rgb(51, 51, 51);
|
||||
font-size: 32rpx;
|
||||
margin-bottom: 25rpx;
|
||||
}
|
||||
|
||||
.panel-balance {
|
||||
text-align: right;
|
||||
font-size: 46rpx;
|
||||
}
|
||||
|
||||
.recharge-panel {
|
||||
margin-top: 60rpx;
|
||||
padding: 0 60rpx;
|
||||
}
|
||||
|
||||
/* 充值套餐 */
|
||||
.recharge-plan {
|
||||
.recharge-plan_item {
|
||||
width: 192rpx;
|
||||
padding: 15rpx 0;
|
||||
float: left;
|
||||
text-align: center;
|
||||
color: #888;
|
||||
border: 1rpx solid rgb(228, 228, 228);
|
||||
border-radius: 5rpx;
|
||||
margin: 0 20rpx 20rpx 0;
|
||||
|
||||
&:nth-child(3n + 0) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: #E3BE83;
|
||||
color: #FFFFFF;
|
||||
border: 1rpx solid #EDD2A9;
|
||||
.plan_money {
|
||||
color: #FFFFFF;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.plan_money {
|
||||
font-size: 32rpx;
|
||||
color: rgb(82, 82, 82);
|
||||
}
|
||||
|
||||
.plan_gift {
|
||||
font-size: 25rpx;
|
||||
}
|
||||
|
||||
.recharge-input {
|
||||
margin-top: 25rpx;
|
||||
|
||||
input {
|
||||
border: 1rpx solid rgb(228, 228, 228);
|
||||
border-radius: 10rpx;
|
||||
padding: 15rpx 16rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
|
||||
/* 立即充值 */
|
||||
.recharge-submit {
|
||||
margin-top: 70rpx;
|
||||
}
|
||||
|
||||
.btn-submit {
|
||||
.button {
|
||||
font-size: 30rpx;
|
||||
background: linear-gradient(to right, #f9211c, #ff6335);
|
||||
border: none;
|
||||
color: white;
|
||||
border-radius: 40rpx;
|
||||
padding: 0 120rpx;
|
||||
line-height: 3;
|
||||
}
|
||||
|
||||
.button[disabled] {
|
||||
background: #ff6335;
|
||||
border-color: #ff6335;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
/* 充值说明 */
|
||||
.recharge-describe {
|
||||
margin-top: 50rpx;
|
||||
padding: 0 60rpx;
|
||||
.content {
|
||||
font-size: 26rpx;
|
||||
line-height: 1.6;
|
||||
color: #888;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
201
fuintUniapp/pages/merchant/coupon/receive.vue
Normal file
201
fuintUniapp/pages/merchant/coupon/receive.vue
Normal file
@@ -0,0 +1,201 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="search-wrapper">
|
||||
<view class="search-input">
|
||||
<view class="search-input-wrapper">
|
||||
<view class="right">
|
||||
<input v-model="keyword" class="input" placeholder="请输入卡券名称或ID..." @change="doSearch" type="text"></input>
|
||||
</view>
|
||||
<view class="search u-icon-wrap">
|
||||
<view class="icon" @click="doSearch">
|
||||
<u-icon name="search"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="number-wrapper">
|
||||
<view class="title">发放数量</view>
|
||||
<u-number-box :min="1" :value="num"/>
|
||||
</view>
|
||||
<view class="main-form">
|
||||
<view class="footer">
|
||||
<view class="btn-wrapper">
|
||||
<view class="btn-item btn-item-main" :class="{ disabled }" @click="doSubmit()">确定发放</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as couponApi from '@/api/merchant/coupon'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
keyword: '',
|
||||
num: 1,
|
||||
memberId: '',
|
||||
couponInfo: null,
|
||||
// 按钮禁用
|
||||
disabled: false
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
// 会员ID
|
||||
this.memberId = options.memberId ? options.memberId : 0;
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
/**
|
||||
* 搜索卡券
|
||||
*/
|
||||
doSearch() {
|
||||
const app = this
|
||||
if (!this.keyword) {
|
||||
app.$error("请输入卡券名称或ID");
|
||||
return false;
|
||||
}
|
||||
couponApi.search({ 'keyword': this.keyword })
|
||||
.then(result => {
|
||||
app.disabled = false;
|
||||
if (result.data.coupon.content && result.data.coupon.content.length == 1) {
|
||||
app.couponInfo = result.data.coupon.content[0];
|
||||
app.keyword = app.couponInfo.name;
|
||||
} else {
|
||||
app.$error("未查询到卡券信息");
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 提交发放
|
||||
*/
|
||||
doSubmit() {
|
||||
const app = this;
|
||||
if (!app.couponInfo || !app.couponInfo.id) {
|
||||
app.$error("请先查询卡券");
|
||||
return false;
|
||||
}
|
||||
let isConfirm = false;
|
||||
uni.showModal({
|
||||
title: "提示",
|
||||
content: "您确定要发放卡券吗?",
|
||||
success({ confirm }) {
|
||||
if (confirm) {
|
||||
app.disabled = true;
|
||||
couponApi.sendCoupon({ 'couponId': app.couponInfo.id, 'num': app.num, 'userId': app.memberId })
|
||||
.then(result => {
|
||||
app.code = '';
|
||||
app.disabled = false;
|
||||
// 显示提示
|
||||
if (parseInt(result.code) === 200) {
|
||||
app.$success("发放成功!");
|
||||
} else {
|
||||
app.$error(result.message);
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
padding: 20rpx;
|
||||
min-height: 100vh;
|
||||
background: #f7f7f7;
|
||||
}
|
||||
|
||||
.search-wrapper {
|
||||
display: flex;
|
||||
height: 100rpx;
|
||||
margin-top: 40rpx;
|
||||
padding: 0 5rpx;
|
||||
}
|
||||
|
||||
.number-wrapper {
|
||||
margin-top: 60rpx;
|
||||
text-align: right;
|
||||
background: #fff;
|
||||
padding: 30rpx;
|
||||
border-radius: 10rpx;
|
||||
border: solid 1px #ccc;
|
||||
.title {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
// 搜索输入框
|
||||
.search-input {
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
border-radius: 60rpx;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
border: solid 1px #ccc;
|
||||
.search-input-wrapper {
|
||||
display: flex;
|
||||
.right {
|
||||
flex: 1;
|
||||
input {
|
||||
font-size: 30rpx;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
padding-left: 30rpx;
|
||||
.input-placeholder {
|
||||
color: #aba9a9;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search {
|
||||
display: flex;
|
||||
width: 80rpx;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.icon {
|
||||
display: block;
|
||||
color: #b4b4b4;
|
||||
font-size: 48rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 底部操作栏 */
|
||||
.footer {
|
||||
margin-top: 100rpx;
|
||||
.btn-wrapper {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 5rpx;
|
||||
}
|
||||
.btn-item {
|
||||
flex: 1;
|
||||
font-size: 28rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
border-radius: 40rpx;
|
||||
}
|
||||
|
||||
.btn-item-main {
|
||||
background: linear-gradient(to right, #f9211c, #ff6335);
|
||||
// 禁用按钮
|
||||
&.disabled {
|
||||
background: #ff9779;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
543
fuintUniapp/pages/merchant/index.vue
Normal file
543
fuintUniapp/pages/merchant/index.vue
Normal file
@@ -0,0 +1,543 @@
|
||||
<template>
|
||||
<view v-if="!isLoading" class="container">
|
||||
<!-- 页面头部 -->
|
||||
<view class="main-header">
|
||||
<!-- 商户信息 -->
|
||||
<view v-if="isLogin" class="user-info">
|
||||
<view class="user-content">
|
||||
<view v-if="dataInfo.confirmInfo.storeInfo" class="belong">{{ dataInfo.confirmInfo.storeInfo.name }}<text class="nick-name">{{ dataInfo.confirmInfo.realName }}</text></view>
|
||||
<view v-else class="belong">{{ dataInfo.confirmInfo.merchantInfo.name }}<text class="nick-name">{{ dataInfo.confirmInfo.realName }}</text></view>
|
||||
</view>
|
||||
<view class="amount-info">
|
||||
<view class="amount-tip">今日交易金额(元)</view>
|
||||
<view v-if="dataInfo.payMoney" class="amount-num">{{ dataInfo.payMoney.toFixed(2) }}</view>
|
||||
<view v-if="!dataInfo.payMoney" class="amount-num">0.00</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 未登录 -->
|
||||
<view v-if="!isLogin" class="user-info" @click="handleLogin">
|
||||
<view class="user-content">
|
||||
<view class="nick-name">未登录</view>
|
||||
<view class="login-tips">点击登录账号</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="isLogin" class="user-app">
|
||||
<view class="item">
|
||||
<view class="tool" @click="scanCodeConfirm">
|
||||
<view class="icon">
|
||||
<image class="image" src="/static/icon/saoyisao.png" mode="scaleToFill"></image>
|
||||
</view>
|
||||
<view class="text">核销卡券</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="tool" @click="scanCodeCashier">
|
||||
<view class="icon">
|
||||
<image class="image" src="/static/icon/saoma.png" mode="scaleToFill"></image>
|
||||
</view>
|
||||
<view class="text">扫码收款</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 概述 -->
|
||||
<view class="my-asset">
|
||||
<view class="asset-left flex-box dis-flex flex-x-center">
|
||||
<view class="asset-left-item" @click="onTargetMember('all')">
|
||||
<view class="item-value dis-flex flex-x-center">
|
||||
<text>{{ dataInfo.userCount }}</text>
|
||||
</view>
|
||||
<view class="item-name dis-flex flex-x-center">
|
||||
<text>总会员</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="asset-left-item" @click="onTargetMember('todayActive')">
|
||||
<view class="item-value dis-flex flex-x-center">
|
||||
<text>{{ dataInfo.todayUser ? dataInfo.todayUser : 0}}</text>
|
||||
</view>
|
||||
<view class="item-name dis-flex flex-x-center">
|
||||
<text>今日活跃</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="asset-left-item" @click="onTargetOrder('today')">
|
||||
<view class="item-value dis-flex flex-x-center">
|
||||
<text>{{ dataInfo.orderCount }}</text>
|
||||
</view>
|
||||
<view class="item-name dis-flex flex-x-center">
|
||||
<text>今日订单</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 待办操作 -->
|
||||
<view class="order-navbar">
|
||||
<view class="order-navbar-item" v-for="(item, index) in orderNavbar" :key="index" @click="onTargetTodo(item)">
|
||||
<view class="item-icon">
|
||||
<text class="iconfont" :class="[`icon-${item.icon}`]"></text>
|
||||
</view>
|
||||
<view class="item-name">{{ item.name }}</view>
|
||||
<text class="order-badge" v-if="item.count && item.count > 0">{{ item.count }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 我的服务 -->
|
||||
<view class="my-service">
|
||||
<view class="service-title">我的管理</view>
|
||||
<view class="service-content clearfix">
|
||||
<block v-for="(item, index) in service" :key="index">
|
||||
<view v-if="item.type == 'link'" class="service-item" @click="handleService(item)">
|
||||
<view class="item-icon">
|
||||
<text class="iconfont" :class="[`icon-${item.icon}`]"></text>
|
||||
</view>
|
||||
<view class="item-name">{{ item.name }}</view>
|
||||
</view>
|
||||
<view v-if="item.type == 'button' && $platform == 'MP-WEIXIN'" class="service-item">
|
||||
<button class="btn-normal" :open-type="item.openType">
|
||||
<view class="item-icon">
|
||||
<text class="iconfont" :class="[`icon-${item.icon}`]"></text>
|
||||
</view>
|
||||
<view class="item-name">{{ item.name }}</view>
|
||||
</button>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SettingKeyEnum from '@/common/enum/setting/Key'
|
||||
import SettingModel from '@/common/model/Setting'
|
||||
import * as MerchantApi from '@/api/merchant'
|
||||
import * as OrderApi from '@/api/order'
|
||||
import { checkLogin } from '@/utils/app'
|
||||
|
||||
// 订单操作
|
||||
const orderNavbar = [
|
||||
{ id: 'all', name: '全部待办', icon: 'qpdingdan' },
|
||||
{ id: 'refund', name: '售后处理', icon: 'daifukuan', count: 1 },
|
||||
{ id: 'confirm', name: '待核销', icon: 'shouhou', count: 1 },
|
||||
{ id: 'book', name: '预约确认', icon: 'daishouhuo', count: 3 },
|
||||
]
|
||||
|
||||
/**
|
||||
* 我的服务
|
||||
* id: 标识; name: 标题名称; icon: 图标; type 类型(link和button); url: 跳转的链接
|
||||
*/
|
||||
const service = [
|
||||
{ id: 'addMember', name: '会员登记', icon: 'add', type: 'link', url: 'pages/merchant/member/add' },
|
||||
{ id: 'memberSearch', name: '会员查找', icon: 'tuandui', type: 'link', url: 'pages/merchant/member/index' },
|
||||
{ id: 'coupon', name: '卡券管理', icon: 'youhuiquan', type: 'link', url: 'pages/merchant/coupon' },
|
||||
{ id: 'activity', name: '营销活动', icon: 'lingquan', type: 'link', url: 'pages/merchant/activity' },
|
||||
{ id: 'order', name: '订单管理', icon: 'dingdan', type: 'link', url: 'pages/merchant/order/index' },
|
||||
{ id: 'report', name: '报表数据', icon: 'zhibozhong', type: 'link', url: 'pages/merchant/data/index' },
|
||||
{ id: 'refund', name: '售后服务', icon: 'shouhou', type: 'link', url: 'pages/merchant/refund/index' },
|
||||
{ id: 'setting', name: '商家设置', icon: 'shezhi1', type: 'link', url: 'pages/merchant/setting' },
|
||||
{ id: 'staff', name: '员工管理', icon: 'sy-yh', type: 'link', url: 'pages/merchant/staff/index' },
|
||||
]
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 枚举类
|
||||
SettingKeyEnum,
|
||||
// 当前运行的终端 (此处并不冗余,因为微信小程序端view层无法直接读取$platform)
|
||||
$platform: this.$platform,
|
||||
// 正在加载
|
||||
isLoading: true,
|
||||
// 是否已登录
|
||||
isLogin: false,
|
||||
// 系统设置
|
||||
setting: {},
|
||||
// 当前商户数据
|
||||
dataInfo: {},
|
||||
// 账户资产
|
||||
assets: { prestore: '--', timer: '--', coupon: '--' },
|
||||
// 我的服务
|
||||
service,
|
||||
// 订单操作
|
||||
orderNavbar,
|
||||
// 当前用户待处理数量
|
||||
todoCounts: { refund: 0, book: 0, confirm: 0 }
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow(options) {
|
||||
// 判断是否已登录
|
||||
this.isLogin = checkLogin()
|
||||
// 获取页面数据
|
||||
this.getPageData()
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 获取页面数据
|
||||
getPageData(callback) {
|
||||
const app = this
|
||||
app.isLoading = true
|
||||
Promise.all([app.getSetting(), app.getUserInfo()])
|
||||
.then(result => {
|
||||
app.isLoading = false
|
||||
// 初始化我的服务数据
|
||||
app.initService()
|
||||
// 初始化订单操作数据
|
||||
app.initOrderTabbar()
|
||||
// 执行回调函数
|
||||
callback && callback()
|
||||
})
|
||||
.catch(err => {
|
||||
console.log('catch', err)
|
||||
})
|
||||
},
|
||||
|
||||
// 初始化我的服务数据
|
||||
initService() {
|
||||
const app = this
|
||||
const newService = []
|
||||
service.forEach(item => {
|
||||
newService.push(item)
|
||||
})
|
||||
app.service = newService
|
||||
},
|
||||
|
||||
// 初始化订单操作数据
|
||||
initOrderTabbar() {
|
||||
const app = this
|
||||
const newOrderNavbar = []
|
||||
orderNavbar.forEach(item => {
|
||||
if (item.hasOwnProperty('count')) {
|
||||
item.count = app.todoCounts[item.id]
|
||||
}
|
||||
newOrderNavbar.push(item)
|
||||
})
|
||||
app.orderNavbar = newOrderNavbar
|
||||
},
|
||||
|
||||
// 获取设置
|
||||
getSetting() {
|
||||
const app = this
|
||||
app.setting = {}
|
||||
},
|
||||
|
||||
// 获取当前用户信息
|
||||
getUserInfo() {
|
||||
const app = this
|
||||
return new Promise((resolve, reject) => {
|
||||
!app.isLogin ? resolve(null) : MerchantApi.info()
|
||||
.then(result => {
|
||||
app.dataInfo = result.data
|
||||
resolve(app.dataInfo)
|
||||
})
|
||||
.catch(err => {
|
||||
if (err.result && err.result.status == 1001) {
|
||||
app.isLogin = false
|
||||
resolve(null)
|
||||
} else {
|
||||
reject(err)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// 扫码核销
|
||||
scanCodeConfirm() {
|
||||
const app = this
|
||||
uni.scanCode({
|
||||
success:function(res){
|
||||
app.$navTo('pages/confirm/doConfirm?code=' + res.result + '&id=0')
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 扫码收款
|
||||
scanCodeCashier() {
|
||||
const app = this
|
||||
uni.scanCode({
|
||||
success:function(res){
|
||||
app.$navTo('pages/pay/cashier?code=' + res.result)
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 跳转到登录页
|
||||
handleLogin() {
|
||||
!this.isLogin && this.$navTo('pages/login/index')
|
||||
},
|
||||
|
||||
// 跳转到订单页
|
||||
onTargetOrder(item) {
|
||||
this.$navTo('pages/merchant/order/index', { dataType: item.id })
|
||||
},
|
||||
|
||||
// 跳转到我的积分页面
|
||||
onTargetPoints() {
|
||||
this.$navTo('pages/merchant/points/log')
|
||||
},
|
||||
|
||||
// 跳转会员列表
|
||||
onTargetMember(dataType) {
|
||||
this.$navTo('pages/merchant/member/index', { dataType: dataType });
|
||||
},
|
||||
|
||||
// 跳转到服务页面
|
||||
handleService({ url }) {
|
||||
this.$navTo(url)
|
||||
},
|
||||
},
|
||||
|
||||
/**
|
||||
* 下拉刷新
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
// 获取首页数据
|
||||
this.getPageData(() => {
|
||||
uni.stopPullDownRefresh()
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
// 页面头部
|
||||
.main-header {
|
||||
position: relative;
|
||||
height: 210rpx;
|
||||
background-size: 100% 100%;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
align-items: center;
|
||||
background: $fuint-theme;
|
||||
padding: 10rpx;
|
||||
margin: 20rpx 20rpx 0rpx 20rpx;
|
||||
border-top-left-radius: 8rpx;
|
||||
border-top-right-radius: 8rpx;
|
||||
|
||||
.user-info {
|
||||
display: block;
|
||||
height: 100rpx;
|
||||
margin-top: 1rpx;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
.user-content {
|
||||
display: block;
|
||||
margin-left: 0rpx;
|
||||
text-align: left;
|
||||
color: #ffffff;
|
||||
|
||||
.belong {
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
.nick-name {
|
||||
padding-left: 15rpx;
|
||||
}
|
||||
}
|
||||
.login-tips {
|
||||
margin-top: 12rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
.amount-info {
|
||||
margin-top: 25rpx;
|
||||
color: #fff;
|
||||
display: block;
|
||||
text-align: center;
|
||||
.amount-tip {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.amount-num {
|
||||
margin-top: 10rpx;
|
||||
font-weight: bold;
|
||||
font-size: 58rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.user-app {
|
||||
display: flex;
|
||||
height: 260rpx;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
background: $fuint-theme;
|
||||
margin: 0 20rpx;
|
||||
border-bottom-left-radius: 8rpx;
|
||||
border-bottom-right-radius: 8rpx;
|
||||
padding-bottom: 60rpx;
|
||||
.item {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
margin: 20rpx;
|
||||
padding: 20rpx;
|
||||
text-align: right;
|
||||
.tool {
|
||||
width: 280rpx;
|
||||
clear: both;
|
||||
padding: 20rpx;
|
||||
border: 1rpx solid #fff;
|
||||
border-radius: 30rpx;
|
||||
text-align: center;
|
||||
margin:0 auto;
|
||||
.icon {
|
||||
.image {
|
||||
height: 68rpx;
|
||||
width: 68rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.text {
|
||||
margin-top: 10rpx;
|
||||
font-size: 30rpx;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 我的资产
|
||||
.my-asset {
|
||||
display: flex;
|
||||
padding: 40rpx 0;
|
||||
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 5rpx;
|
||||
margin: 25rpx 20rpx 5rpx 20rpx;
|
||||
background: #ffffff;
|
||||
.asset-right {
|
||||
width: 200rpx;
|
||||
border-left: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.asset-right-item {
|
||||
text-align: center;
|
||||
color: #545454;
|
||||
|
||||
.item-icon {
|
||||
font-size: 60rpx;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.item-name text {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.asset-left-item {
|
||||
text-align: center;
|
||||
color: #666;
|
||||
padding: 0 72rpx;
|
||||
|
||||
.item-value {
|
||||
font-size: 36rpx;
|
||||
color: #f03c3c;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
margin-top: 6rpx;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// 订单操作
|
||||
.order-navbar {
|
||||
display: flex;
|
||||
margin: 20rpx auto 20rpx auto;
|
||||
padding: 20rpx 0;
|
||||
width: 94%;
|
||||
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05);
|
||||
font-size: 30rpx;
|
||||
border-radius: 5rpx;
|
||||
background: #fff;
|
||||
|
||||
&-item {
|
||||
position: relative;
|
||||
width: 25%;
|
||||
|
||||
.item-icon {
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
padding: 10rpx 0;
|
||||
color: #545454;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
font-size: 24rpx;
|
||||
color: #545454;
|
||||
text-align: center;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.order-badge {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 55rpx;
|
||||
font-size: 22rpx;
|
||||
background: #fa2209;
|
||||
text-align: center;
|
||||
line-height: 28rpx;
|
||||
color: #fff;
|
||||
border-radius: 100%;
|
||||
min-height: 30rpx;
|
||||
min-width: 30rpx;
|
||||
padding: 1rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 我的服务
|
||||
.my-service {
|
||||
margin: 22rpx auto 22rpx auto;
|
||||
padding: 20rpx 0;
|
||||
width: 94%;
|
||||
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 5rpx;
|
||||
background: #fff;
|
||||
|
||||
.service-title {
|
||||
padding-left: 20rpx;
|
||||
margin-bottom: 30rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.service-content {
|
||||
|
||||
// margin-bottom: -30rpx;
|
||||
.service-item {
|
||||
position: relative;
|
||||
width: 25%;
|
||||
float: left;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.item-icon {
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
padding: 10rpx 0;
|
||||
color: #ff3800;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
font-size: 24rpx;
|
||||
color: #545454;
|
||||
text-align: center;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
219
fuintUniapp/pages/merchant/member/add.vue
Normal file
219
fuintUniapp/pages/merchant/member/add.vue
Normal file
@@ -0,0 +1,219 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="info-list">
|
||||
<view class="info-item">
|
||||
<view class="contacts avatar-warp">
|
||||
<text class="name">头像</text>
|
||||
<image class="avatar" @click="chooseImage()" :src="avatar"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view class="contacts">
|
||||
<text class="name">称呼</text>
|
||||
<input class="weui-input value" type="nickname" v-model="nickname" placeholder="请输入称呼"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view class="contacts">
|
||||
<text class="name">手机</text>
|
||||
<input class="weui-input value" type="text" v-model="mobile" placeholder="请输入手机号"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view class="contacts">
|
||||
<text class="name">性别</text>
|
||||
<view class="value">
|
||||
<radio-group @change="genderChange">
|
||||
<label class="radio"><radio value="1" color="#00acac" :checked="userInfo.sex == '1' ? true : false"/>男</label>
|
||||
<label class="radio second"><radio value="0" color="#00acac" :checked="userInfo.sex == '0' ? true: false"/>女</label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view class="contacts">
|
||||
<text class="name">生日</text>
|
||||
<picker class="value" mode="date" :value="userInfo.birthday" start="1900-01-01" @change="bindDateChange">
|
||||
<view class="picker">{{ userInfo.birthday ? userInfo.birthday : '选择生日' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 底部操作按钮 -->
|
||||
<view class="footer-fixed">
|
||||
<view class="btn-wrapper">
|
||||
<view class="btn-item btn-item-main" @click="save()">保存会员</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as MemberApi from '@/api/merchant/member'
|
||||
import * as UploadApi from '@/api/upload'
|
||||
import store from '@/store'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
//当前页面参数
|
||||
options: {},
|
||||
// 正在加载
|
||||
isLoading: true,
|
||||
userInfo: { avatar: '', name: '', sex: 0, birthday: '', hasPassword: '' },
|
||||
openCardPara: null,
|
||||
code: "",
|
||||
nickname: "",
|
||||
avatar: ""
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
// 当前页面参数
|
||||
this.options = options;
|
||||
},
|
||||
|
||||
methods: {
|
||||
bindDateChange (e) {
|
||||
let that = this;
|
||||
that.userInfo.birthday = e.detail.value;
|
||||
},
|
||||
getnickname(e) {
|
||||
this.nickname = e.detail.value;
|
||||
},
|
||||
genderChange(e) {
|
||||
this.userInfo.sex = e.detail.value;
|
||||
},
|
||||
// 选择图片
|
||||
chooseImage() {
|
||||
const app = this
|
||||
// 选择图片
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
|
||||
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
|
||||
success({ tempFiles }) {
|
||||
const imageList = tempFiles;
|
||||
return new Promise((resolve, reject) => {
|
||||
if (imageList.length > 0) {
|
||||
UploadApi.image(imageList)
|
||||
.then(files => {
|
||||
if (files && files.length > 0) {
|
||||
app.userInfo.avatar = files[0].fileName;
|
||||
app.avatar = files[0].domain + app.userInfo.avatar;
|
||||
}
|
||||
resolve(files)
|
||||
})
|
||||
.catch(err => reject(err))
|
||||
} else {
|
||||
resolve()
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 保存会员信息
|
||||
*/
|
||||
save() {
|
||||
const app = this
|
||||
app.isLoading = true
|
||||
MemberApi.save({"name": app.nickname, "avatar": app.avatar, "sex": app.userInfo.sex, "birthday": app.userInfo.birthday})
|
||||
.then(result => {
|
||||
app.userInfo = result.data
|
||||
app.isLoading = false
|
||||
app.$success('保存成功!')
|
||||
}).catch(err => {
|
||||
app.isLoading = false;
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.info-list {
|
||||
padding-bottom: 100rpx;
|
||||
margin-top: 25rpx;
|
||||
}
|
||||
|
||||
// 项目内容
|
||||
.info-item {
|
||||
margin: 20rpx auto 20rpx auto;
|
||||
padding: 30rpx 40rpx;
|
||||
width: 94%;
|
||||
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 16rpx;
|
||||
background: #fff;
|
||||
.avatar-warp {
|
||||
line-height: 120rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.contacts {
|
||||
font-size: 30rpx;
|
||||
.name {
|
||||
margin-left:0px;
|
||||
}
|
||||
.value {
|
||||
float:right;
|
||||
color:#999999;
|
||||
text-align: right;
|
||||
.second {
|
||||
margin-left: .6rem;
|
||||
}
|
||||
}
|
||||
.password {
|
||||
text-align: right;
|
||||
float: left;
|
||||
padding-right: 5rpx;
|
||||
}
|
||||
.avatar {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 120rpx;
|
||||
border: solid 1px #cccccc;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
.item-option {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: 48rpx;
|
||||
}
|
||||
|
||||
// 底部操作栏
|
||||
.footer-fixed {
|
||||
height: 100rpx;
|
||||
z-index: 11;
|
||||
.btn-wrapper {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.btn-item {
|
||||
flex: 1;
|
||||
font-size: 28rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
border-radius: 40rpx;
|
||||
}
|
||||
|
||||
.btn-item-main {
|
||||
background: linear-gradient(to right, #f9211c, #ff6335);
|
||||
}
|
||||
.btn-item-out {
|
||||
margin-top: 20rpx;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid $fuint-theme;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
560
fuintUniapp/pages/merchant/member/detail.vue
Normal file
560
fuintUniapp/pages/merchant/member/detail.vue
Normal file
@@ -0,0 +1,560 @@
|
||||
<template>
|
||||
<view v-if="!isLoading" class="container">
|
||||
<!-- 页面头部 -->
|
||||
<view class="main-header">
|
||||
<!-- 用户信息 -->
|
||||
<view class="user-info">
|
||||
<!--头像-->
|
||||
<view class="user-avatar" @click="onUserInfo">
|
||||
<image class="image" :src="userInfo.avatar ? userInfo.avatar : '/static/default-avatar.png'"></image>
|
||||
</view>
|
||||
<view class="user-content" @click="onUserInfo">
|
||||
<!-- 会员昵称 -->
|
||||
<view class="nick-name">{{ userInfo.name ? userInfo.name : '未登录'}}</view>
|
||||
<view class="login-tips" v-if="!isLogin">(点击头像登录)</view>
|
||||
<!-- 会员等级 -->
|
||||
<view v-if="userInfo.gradeId > 0 && gradeInfo" class="user-grade">
|
||||
<view class="user-grade_icon">
|
||||
<image class="image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAA0lBMVEUAAAD/tjL/tzH/uDP/uC7/tjH/tzH/tzL/tTH+tTL+tjP/tDD/tTD+tzD/tjL/szD/uDH/tjL/tjL+tjD/tjT/szb/tzL/tTL+uTH+tjL/tjL/tjL/tTT/tjL/tjL+tjH/uTL/vDD/tjL/tjH/tzL9uS//tTL/nBr/sS7/tjH/ujL/szD/uTv+rzf/tzL+tzH+vDP+uzL+tjP+ry7+tDL9ki/7szf/sEX/tTL/tjL+tjL/tTH/tTT/tzH/tzL/tjP/sTX/uTP/wzX+rTn/vDX9vC8m8ckhAAAAOXRSTlMAlnAMB/vjxKWGMh0S6drMiVxPRkEY9PLy0ru0sKagmo5+dGtgVCMgBP716eXWyMGxqJGRe2o5KSmFNjaYAAABP0lEQVQ4y8XS13KDMBAF0AWDDe4t7r3ETu9lVxJgJ/n/X8rKAzHG5TE+Twz3zki7I/g/KXdghIbGJewrU4yzn08Ebgl6TuZzzuOC6W5es3HX6qsSz3NFShRU0MpucytDmOSpu3yULx3CA9RD1HjVedc0jSjqm6ZzhUjDsFDQhSp/OKj5GQvg0+ZCOixsbtDLAeTTOm/yGi8GyIphIVsgH737FEDV44LJa88IRKK/SetrwT9G/GUIr6vXjoy4GXn7+RboVXnghuSjaoGecwQxL2su3CwAKlO+QFoqxI4FMctHQhQd2OhxTu184jWUlI+rMTBTn1/IQcJHQ6GQdZ7pWiDaNdhTt330efISeiqYwQEzQpTlsURJLhzkEmpCPsERfeIUVyXr6MNuIyp5uziW6xURtt7hhGwzmMNJExfO4Bd9X0ZPqAxdNwAAAABJRU5ErkJggg=="></image>
|
||||
</view>
|
||||
<view class="user-grade_name">
|
||||
<text>{{ gradeInfo.name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 会员无等级时显示手机号 -->
|
||||
<view v-else class="mobile">{{ userInfo.mobile }}</view>
|
||||
<view class="active-time" v-if="userInfo.endTime">{{ userInfo.endTime }}</view>
|
||||
</view>
|
||||
<view class="amount-info" @click="toMemberWallet(userInfo.id ? userInfo.id : 0)">
|
||||
<view class="amount-tip">余额(元)</view>
|
||||
<view class="amount-num" v-if="isLogin">{{ userInfo.balance.toFixed(2) }}</view>
|
||||
<view class="amount-num" v-if="!isLogin">0.00</view>
|
||||
<view class="point-amount" @click="onTargetPoints">积分 {{ userInfo.point ? userInfo.point : 0 }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="user-no">
|
||||
<view class="no" v-if="userInfo.userNo">会员号:{{ userInfo.userNo ? userInfo.userNo : '-'}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 会员资产 -->
|
||||
<view class="my-asset">
|
||||
<view class="asset-left flex-box dis-flex flex-x-center">
|
||||
<view class="asset-left-item" @click="onTargetMyCoupon('C')">
|
||||
<view class="item-value dis-flex flex-x-center">
|
||||
<text>{{ isLogin ? assets.coupon : '0' }}</text>
|
||||
</view>
|
||||
<view class="item-name dis-flex flex-x-center">
|
||||
<text>优惠券</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="asset-left-item" @click="onTargetMyCoupon('P')">
|
||||
<view class="item-value dis-flex flex-x-center">
|
||||
<text>{{ isLogin ? assets.prestore : '0' }}</text>
|
||||
</view>
|
||||
<view class="item-name dis-flex flex-x-center">
|
||||
<text>储值卡</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="asset-left-item" @click="onTargetMyCoupon('T')">
|
||||
<view class="item-value dis-flex flex-x-center">
|
||||
<text>{{ isLogin ? assets.timer : '0' }}</text>
|
||||
</view>
|
||||
<view class="item-name dis-flex flex-x-center">
|
||||
<text>计次卡</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 会员服务 -->
|
||||
<view class="user-service">
|
||||
<view class="service-content clearfix">
|
||||
<block v-for="(item, index) in service" :key="index">
|
||||
<view v-if="item.type == 'link'" class="service-item" @click="handleService(item)">
|
||||
<view class="item-icon">
|
||||
<text class="iconfont" :class="[`icon-${item.icon}`]"></text>
|
||||
</view>
|
||||
<view class="item-name">{{ item.name }}</view>
|
||||
</view>
|
||||
<view v-if="item.type == 'button' && $platform == 'MP-WEIXIN'" class="service-item">
|
||||
<button class="btn-normal" :open-type="item.openType">
|
||||
<view class="item-icon">
|
||||
<text class="iconfont" :class="[`icon-${item.icon}`]"></text>
|
||||
</view>
|
||||
<view class="item-name">{{ item.name }}</view>
|
||||
</button>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SettingKeyEnum from '@/common/enum/setting/Key'
|
||||
import SettingModel from '@/common/model/Setting'
|
||||
import * as MemberApi from '@/api/merchant/member'
|
||||
import * as UserApi from '@/api/user'
|
||||
import * as OrderApi from '@/api/order'
|
||||
import * as MessageApi from '@/api/message'
|
||||
import { checkLogin, showMessage } from '@/utils/app'
|
||||
|
||||
/**
|
||||
* 会员服务
|
||||
* id: 标识; name: 标题名称; icon: 图标; type 类型(link和button); url: 跳转的链接
|
||||
*/
|
||||
const service = [
|
||||
{ id: 'rechange', name: '会员充值', icon: 'qiandai', type: 'link', url: 'pages/merchant/balance/recharge' },
|
||||
{ id: 'payment', name: '余额扣减', icon: 'shouhou', type: 'link', url: 'pages/pay/cashier' },
|
||||
{ id: 'myCoupon', name: '卡券发放', icon: 'youhuiquan', type: 'link', url: 'pages/merchant/coupon/receive' },
|
||||
{ id: 'points', name: '会员积分', icon: 'jifen', type: 'link', url: 'pages/merchant/points/detail' },
|
||||
{ id: 'setting', name: '会员信息', icon: 'shezhi1', type: 'link', url: 'pages/merchant/member/setting' },
|
||||
]
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 枚举类
|
||||
SettingKeyEnum,
|
||||
// 当前运行的终端 (此处并不冗余,因为微信小程序端view层无法直接读取$platform)
|
||||
$platform: this.$platform,
|
||||
// 正在加载
|
||||
isLoading: true,
|
||||
// 是否已登录
|
||||
isLogin: false,
|
||||
// 系统设置
|
||||
setting: {},
|
||||
// 当前用户信息
|
||||
userInfo: { id: 0, name: '', avatar: '', gradeId: 0, mobile: '', balance: 0 },
|
||||
gradeInfo: {},
|
||||
gradeEndTime: '',
|
||||
// 账户资产
|
||||
assets: { prestore: '0', timer: '0', coupon: '0' },
|
||||
// 会员服务
|
||||
service,
|
||||
// 会员ID
|
||||
memberId: 0,
|
||||
// 会员编码
|
||||
userCode: ''
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
// 会员ID
|
||||
this.memberId = options.memberId ? options.memberId : 0;
|
||||
// 获取页面数据
|
||||
this.getPageData();
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 获取页面数据
|
||||
getPageData(callback) {
|
||||
const app = this
|
||||
app.isLoading = true
|
||||
Promise.all([app.getSetting(), app.getUserInfo(), app.getUserAssets()])
|
||||
.then(result => {
|
||||
app.isLoading = false
|
||||
// 初始化我的服务数据
|
||||
app.initService()
|
||||
// 初始化订单操作数据
|
||||
app.initOrderTabbar()
|
||||
// 执行回调函数
|
||||
callback && callback()
|
||||
})
|
||||
.catch(err => {
|
||||
console.log('catch', err)
|
||||
})
|
||||
},
|
||||
|
||||
// 初始化我的服务数据
|
||||
initService() {
|
||||
const app = this
|
||||
const newService = []
|
||||
service.forEach(item => {
|
||||
newService.push(item)
|
||||
})
|
||||
app.service = newService
|
||||
},
|
||||
|
||||
// 获取设置
|
||||
getSetting() {
|
||||
this.setting = {}
|
||||
},
|
||||
|
||||
// 获取当前用户信息
|
||||
getUserInfo() {
|
||||
const app = this;
|
||||
app.showPopup = false;
|
||||
return new Promise((resolve, reject) => {
|
||||
MemberApi.detail(app.memberId)
|
||||
.then(result => {
|
||||
if (result.data.userInfo) {
|
||||
app.userInfo = result.data.userInfo
|
||||
app.userCode = app.userInfo.userNo
|
||||
app.isLogin = true
|
||||
} else {
|
||||
app.isLogin = false
|
||||
app.userInfo = { id: 0, name: '', avatar: '', gradeId: 0, mobile: '', balance: 0 }
|
||||
}
|
||||
app.gradeInfo = result.data.gradeInfo;
|
||||
resolve(app.userInfo);
|
||||
resolve(app.gradeInfo);
|
||||
})
|
||||
.catch(err => {
|
||||
if (err.result && err.result.status == 1001) {
|
||||
app.isLogin = false
|
||||
resolve(null)
|
||||
} else {
|
||||
reject(err)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// 获取账户资产
|
||||
getUserAssets() {
|
||||
const app = this
|
||||
return new Promise((resolve, reject) => {
|
||||
UserApi.assets({ userId: app.memberId })
|
||||
.then(result => {
|
||||
app.assets = result.data.asset
|
||||
resolve(app.assets)
|
||||
})
|
||||
.catch(err => {
|
||||
if (err.result && err.result.status == 1001) {
|
||||
app.isLogin = false
|
||||
resolve(null)
|
||||
} else {
|
||||
reject(err)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// 跳转我的余额
|
||||
toMemberWallet(userId) {
|
||||
return false;
|
||||
},
|
||||
|
||||
// 跳转充值
|
||||
toRecharge(userId) {
|
||||
return false;
|
||||
},
|
||||
|
||||
// 跳转到我的积分页面
|
||||
onTargetPoints() {
|
||||
return false;
|
||||
},
|
||||
|
||||
// 跳转到我的卡券列表页
|
||||
onTargetMyCoupon(type) {
|
||||
this.$navTo('pages/my-coupon/index?type='+type+'&memberId='+this.memberId)
|
||||
},
|
||||
|
||||
// 跳转会员设置页面
|
||||
onUserInfo() {
|
||||
return false;
|
||||
},
|
||||
|
||||
// 跳转到服务页面
|
||||
handleService({ url }) {
|
||||
const app = this;
|
||||
console.log(app.userCode)
|
||||
app.$navTo(url + '?memberId=' + app.memberId + '&code=' + app.userCode);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 下拉刷新
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
// 获取首页数据
|
||||
this.getPageData(() => {
|
||||
uni.stopPullDownRefresh()
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
// 页面头部
|
||||
.main-header {
|
||||
background: $fuint-theme;
|
||||
height: 380rpx;
|
||||
background-size: cover;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
align-items: center;
|
||||
margin: 10rpx 25rpx 10rpx 25rpx;
|
||||
border-radius: 10rpx;
|
||||
|
||||
.user-info {
|
||||
display: block;
|
||||
height: 200rpx;
|
||||
margin: 20rpx;
|
||||
margin-left: 20rpx;
|
||||
.user-avatar {
|
||||
padding-top: 10rpx;
|
||||
width: 50rpx;
|
||||
margin-top: 70rpx;
|
||||
float: left;
|
||||
.image {
|
||||
display: block;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 999rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.user-content {
|
||||
display: block;
|
||||
justify-content: center;
|
||||
margin-top: 80rpx;
|
||||
margin-left: 60rpx;
|
||||
float: left;
|
||||
color: #ffffff;
|
||||
max-width: 300rpx;
|
||||
.nick-name {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
max-width: 270rpx;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.mobile {
|
||||
margin-top: 15rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.user-grade {
|
||||
display: block;
|
||||
align-items: center;
|
||||
background: #3c3c3c;
|
||||
margin-top: 8rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 5rpx 12rpx;
|
||||
width: 80%;
|
||||
min-width: 160rpx;
|
||||
height: 40rpx;
|
||||
|
||||
.user-grade_icon .image {
|
||||
display: block;
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.user-grade_name {
|
||||
margin-left: 5rpx;
|
||||
font-size: 24rpx;
|
||||
color: #EEE0C3;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
.active-time {
|
||||
margin-top: 3rpx;
|
||||
}
|
||||
|
||||
.login-tips {
|
||||
margin-top: 9rpx;
|
||||
font-size: 25rpx;
|
||||
}
|
||||
}
|
||||
.amount-info {
|
||||
margin-top: 80rpx;
|
||||
margin-left: 70rpx;
|
||||
color: #fff;
|
||||
display: block;
|
||||
float: left;
|
||||
max-width: 120rpx;
|
||||
.amount-tip {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.amount-num {
|
||||
margin-top: 10rpx;
|
||||
font-weight: bold;
|
||||
font-size: 48rpx;
|
||||
}
|
||||
.point-amount {
|
||||
display: block;
|
||||
margin-top: 2px;
|
||||
width: 100px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.user-no {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
margin: 110rpx 0rpx 0rpx 20rpx;
|
||||
color: #ffffff;
|
||||
.no {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 我的资产
|
||||
.my-asset {
|
||||
display: flex;
|
||||
background: #fff;
|
||||
margin: 10rpx 20rpx 10rpx 20rpx;
|
||||
padding: 40rpx 0;
|
||||
border: 2rpx #f5f5f5 solid;
|
||||
|
||||
.asset-right {
|
||||
width: 200rpx;
|
||||
border-left: 1rpx solid #eee;
|
||||
}
|
||||
.asset-left-item {
|
||||
text-align: center;
|
||||
color: #666;
|
||||
padding: 0 72rpx;
|
||||
width: 33%;
|
||||
|
||||
.item-value {
|
||||
font-size: 35rpx;
|
||||
color: #f03c3c;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
font-size: 25rpx;
|
||||
margin-top: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// 会员服务
|
||||
.user-service {
|
||||
margin: 0rpx auto 20rpx auto;
|
||||
border: 2rpx #f5f5f5 solid;
|
||||
background: #FFF;
|
||||
padding: 30rpx 0rpx;
|
||||
width: 94%;
|
||||
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 5rpx;
|
||||
display: block;
|
||||
|
||||
.service-content {
|
||||
margin-top: 20rpx;
|
||||
.service-item {
|
||||
width: 25%;
|
||||
float: left;
|
||||
margin-bottom: 25rpx;
|
||||
|
||||
.item-icon {
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
padding: 10rpx 0;
|
||||
color: #ff3800;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
font-size: 24rpx;
|
||||
color: #545454;
|
||||
text-align: center;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 推荐信息
|
||||
.my-recommend {
|
||||
height: 20rpx;
|
||||
}
|
||||
|
||||
// 会员升级
|
||||
.member-update {
|
||||
margin: 22rpx auto 0rpx auto;
|
||||
padding: 20rpx 0;
|
||||
border-radius: 5rpx;
|
||||
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05);
|
||||
background: #fff;
|
||||
width: 94%;
|
||||
text-align: center;
|
||||
.update-title {
|
||||
padding-left: 20rpx;
|
||||
margin-bottom: 30rpx;
|
||||
font-size: 28rpx;
|
||||
text-align: left;
|
||||
}
|
||||
.recharge {
|
||||
position: relative;
|
||||
margin-bottom: 35rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
&-tag {
|
||||
position: absolute;
|
||||
top: -2rpx;
|
||||
left: -2rpx;
|
||||
width: 170rpx;
|
||||
height: 36rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-image: url('~@/static/user/tag.png');
|
||||
background-size: 100%;
|
||||
&-text {
|
||||
font-size: 20rpx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
&-item {
|
||||
position: relative;
|
||||
padding: 40rpx 0;
|
||||
margin-left: 15rpx;
|
||||
width: 29.33%;
|
||||
height: 270rpx;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
border: solid 1rpx #CBCCCE;
|
||||
border-radius: 12rpx;
|
||||
|
||||
&-active {
|
||||
border: solid 2rpx #EDD2A9;
|
||||
background-color: #FBF1E5;
|
||||
}
|
||||
|
||||
&-duration {
|
||||
margin-bottom: 30rpx;
|
||||
font-size: 26rpx;
|
||||
color: #1C1C1C;
|
||||
}
|
||||
|
||||
&-price {
|
||||
margin-bottom: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: baseline;
|
||||
|
||||
&-text {
|
||||
font-size: 48rpx;
|
||||
color: #E3BE83;
|
||||
}
|
||||
}
|
||||
|
||||
&-des {
|
||||
font-size: 22rpx;
|
||||
color: #A5A3A2;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
341
fuintUniapp/pages/merchant/member/index.vue
Normal file
341
fuintUniapp/pages/merchant/member/index.vue
Normal file
@@ -0,0 +1,341 @@
|
||||
<template>
|
||||
<mescroll-body ref="mescrollRef" :sticky="true" @init="mescrollInit" :down="{ native: true }" @down="downCallback"
|
||||
:up="upOption" @up="upCallback">
|
||||
|
||||
<!-- 分类列表tab -->
|
||||
<view class="tabs-wrapper">
|
||||
<scroll-view class="scroll-view" scroll-x>
|
||||
<view class="tab-item" :class="{ active: curId == 0 }" @click="onSwitchTab(0)">
|
||||
<view class="value"><text>全部</text></view>
|
||||
</view>
|
||||
<!-- 分类列表 -->
|
||||
<view class="tab-item" :class="{ active: curId == item.id }" @click="onSwitchTab(item.id)"
|
||||
v-for="(item, index) in categoryList" :key="index">
|
||||
<view class="value"><text>{{ item.name }}</text></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<view class="search-wrapper">
|
||||
<view class="search-input">
|
||||
<view class="search-input-wrapper">
|
||||
<view class="left">
|
||||
<text class="search-icon iconfont icon-sousuo"></text>
|
||||
</view>
|
||||
<view class="right">
|
||||
<input v-model="keyword" class="input" placeholder="请输入会员手机号 / 会员号" type="text"></input>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="search-button">
|
||||
<button class="button" @click="doSearch" type="warn"> 搜索 </button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 会员列表 -->
|
||||
<view class="member-list" v-if="memberList.content">
|
||||
<view class="member-item" v-for="(item, index) in memberList.content" :key="index" @click="onTargetDetail(item.id)">
|
||||
<block>
|
||||
<view class="left flex-box">
|
||||
<image class="image" :src="item.avatar"></image>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="base">
|
||||
<text class="name">{{ item.name }}</text>
|
||||
<text class="grade">{{ item.gradeName ? item.gradeName : '' }}</text>
|
||||
</view>
|
||||
<view class="amount">
|
||||
<view class="balance">余额:¥{{ item.balance.toFixed(2) }}</view>
|
||||
<view class="point">积分:{{ item.point }}</view>
|
||||
</view>
|
||||
<view class="footer">
|
||||
<text class="member-views f-24 col-8">{{ item.lastLoginTime }}活跃</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MescrollBody from '@/components/mescroll-uni/mescroll-body.vue'
|
||||
import MescrollMixin from '@/components/mescroll-uni/mescroll-mixins'
|
||||
import * as MemberApi from '@/api/merchant/member'
|
||||
import { getEmptyPaginateObj, getMoreListData } from '@/utils/app'
|
||||
|
||||
const pageSize = 15
|
||||
|
||||
export default {
|
||||
components: {
|
||||
MescrollBody
|
||||
},
|
||||
mixins: [MescrollMixin],
|
||||
data() {
|
||||
return {
|
||||
// 分类列表
|
||||
categoryList: [{ name : '今日活跃', id: 'todayActive' }, { name : '今日注册', id: 'todayRegister' }],
|
||||
// 会员列表
|
||||
memberList: getEmptyPaginateObj(),
|
||||
// 当前选中的分类id (all则代表全部)
|
||||
curId: 'all',
|
||||
// 搜索关键字
|
||||
keyword: '',
|
||||
// 上拉加载配置
|
||||
upOption: {
|
||||
// 首次自动执行
|
||||
auto: true,
|
||||
// 每页数据的数量; 默认20
|
||||
page: { size: pageSize },
|
||||
// 数量要大于12条才显示无更多数据
|
||||
noMoreSize: 12,
|
||||
empty: {
|
||||
tip: '亲,暂无数据'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
const app = this
|
||||
if (options.dataType) {
|
||||
app.curId = options.dataType
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
/**
|
||||
* 上拉加载的回调 (页面初始化时也会执行一次)
|
||||
* 其中page.num:当前页 从1开始, page.size:每页数据条数,默认20
|
||||
* @param {Object} page
|
||||
*/
|
||||
upCallback(page) {
|
||||
const app = this
|
||||
// 设置列表数据
|
||||
app.getMemberList(page.num)
|
||||
.then(list => {
|
||||
const curPageLen = list.content.length;
|
||||
const totalSize = list.totalElements;
|
||||
app.mescroll.endBySize(curPageLen, totalSize);
|
||||
})
|
||||
.catch(() => app.mescroll.endErr())
|
||||
},
|
||||
|
||||
/**
|
||||
* 搜索提交
|
||||
*/
|
||||
doSearch() {
|
||||
this.curId = 'all';
|
||||
// 刷新列表数据
|
||||
this.mescroll.resetUpScroll();
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取会员列表
|
||||
* @param {Number} pageNo 页码
|
||||
*/
|
||||
getMemberList(pageNo = 1) {
|
||||
const app = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
MemberApi.list({ dataType: app.curId, keyword: app.keyword, page: pageNo }, { load: false })
|
||||
.then(result => {
|
||||
// 合并新数据
|
||||
const newList = result.data.paginationResponse;
|
||||
app.memberList.content = getMoreListData(newList, app.memberList, pageNo);
|
||||
resolve(newList);
|
||||
})
|
||||
.catch(result => reject())
|
||||
})
|
||||
},
|
||||
|
||||
// 切换选择的分类
|
||||
onSwitchTab(dataType = 'all') {
|
||||
const app = this;
|
||||
// 切换当前的分类ID
|
||||
app.curId = dataType;
|
||||
app.keyword = '';
|
||||
// 刷新列表数据
|
||||
app.mescroll.resetUpScroll();
|
||||
},
|
||||
|
||||
// 跳转会员详情页
|
||||
onTargetDetail(memberId) {
|
||||
this.$navTo('pages/merchant/member/detail', { memberId })
|
||||
},
|
||||
|
||||
// 刷新列表
|
||||
onRefreshList() {
|
||||
this.list = getEmptyPaginateObj()
|
||||
setTimeout(() => {
|
||||
this.mescroll.resetUpScroll()
|
||||
}, 120)
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
/* 顶部选项卡 */
|
||||
.container {
|
||||
min-height: 100vh;
|
||||
}
|
||||
.tabs-wrapper {
|
||||
position: sticky;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
color: #333;
|
||||
font-size: 28rpx;
|
||||
background: #fff;
|
||||
border-bottom: 1rpx solid #e4e4e4;
|
||||
z-index: 100;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
display: inline-block;
|
||||
padding: 0 15rpx;
|
||||
text-align: center;
|
||||
min-width: 20%;
|
||||
height: 87rpx;
|
||||
line-height: 88rpx;
|
||||
box-sizing: border-box;
|
||||
.value {
|
||||
height: 100%;
|
||||
}
|
||||
&.active .value {
|
||||
color: #fd4a5f;
|
||||
border-bottom: 4rpx solid #fd4a5f;
|
||||
}
|
||||
}
|
||||
|
||||
.search-wrapper {
|
||||
display: flex;
|
||||
height: 80rpx;
|
||||
margin-top: 10rpx;
|
||||
padding: 0rpx 10rpx;
|
||||
}
|
||||
|
||||
// 搜索输入框
|
||||
.search-input {
|
||||
width: 80%;
|
||||
background: #fff;
|
||||
border-radius: 50rpx 0 0 50rpx;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
border: solid 1px #cccccc;
|
||||
line-height: 80rpx;
|
||||
.search-input-wrapper {
|
||||
display: flex;
|
||||
.left {
|
||||
display: flex;
|
||||
width: 60rpx;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.search-icon {
|
||||
display: block;
|
||||
color: #666666;
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
|
||||
input {
|
||||
font-size: 28rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
.input-placeholder {
|
||||
color: #aba9a9;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 搜索按钮
|
||||
.search-button {
|
||||
width: 20%;
|
||||
box-sizing: border-box;
|
||||
|
||||
.button {
|
||||
line-height: 78rpx;
|
||||
height: 78rpx;
|
||||
font-size: 28rpx;
|
||||
border-radius: 0 20px 20px 0;
|
||||
background: $fuint-theme;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* 会员列表 */
|
||||
.member-list {
|
||||
padding-top: 10rpx;
|
||||
line-height: 1;
|
||||
background: #f7f7f7;
|
||||
}
|
||||
|
||||
.member-item {
|
||||
margin-bottom: 10rpx;
|
||||
padding: 30rpx;
|
||||
background: #fff;
|
||||
border: #f5f5f5 solid 1rpx;
|
||||
height: 188rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.left {
|
||||
width: 320rxp;
|
||||
float: left;
|
||||
.image {
|
||||
display: block;
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 120rpx;
|
||||
border: solid 1rpx #cccccc;
|
||||
}
|
||||
}
|
||||
.right {
|
||||
margin-left: 140rpx;
|
||||
height: 180rpx;
|
||||
.base {
|
||||
.name {
|
||||
font-weight: bold;
|
||||
max-height: 80rpx;
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
}
|
||||
.grade {
|
||||
margin-left: 20rpx;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
.amount {
|
||||
margin-top: 10rpx;
|
||||
.balance {
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
.point {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
}
|
||||
.footer {
|
||||
margin-top: 20rpx;
|
||||
.member-views {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
244
fuintUniapp/pages/merchant/member/setting.vue
Normal file
244
fuintUniapp/pages/merchant/member/setting.vue
Normal file
@@ -0,0 +1,244 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="info-list">
|
||||
<view class="info-item">
|
||||
<view class="contacts avatar-warp">
|
||||
<text class="name">头像</text>
|
||||
<image class="avatar" @click="chooseImage()" :src="userInfo.avatar"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view class="contacts">
|
||||
<text class="name">称呼</text>
|
||||
<input class="weui-input value" type="nickname" v-model="userInfo.name" placeholder="请输入称呼"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view class="contacts">
|
||||
<text class="name">手机</text>
|
||||
<input class="weui-input value" type="text" v-model="userInfo.mobile" placeholder="请输入手机号"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view class="contacts">
|
||||
<text class="name">性别</text>
|
||||
<view class="value">
|
||||
<radio-group @change="genderChange">
|
||||
<label class="radio"><radio value="1" color="#00acac" :checked="userInfo.sex == '1' ? true : false"/>男</label>
|
||||
<label class="radio second"><radio value="0" color="#00acac" :checked="userInfo.sex == '0' ? true: false"/>女</label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view class="contacts">
|
||||
<text class="name">生日</text>
|
||||
<picker class="value" mode="date" :value="userInfo.birthday" start="1900-01-01" @change="bindDateChange">
|
||||
<view class="picker">{{ userInfo.birthday ? userInfo.birthday : '选择生日' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 底部操作按钮 -->
|
||||
<view class="footer-fixed">
|
||||
<view class="btn-wrapper">
|
||||
<view class="btn-item btn-item-main" @click="save()">保存会员</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as MemberApi from '@/api/merchant/member'
|
||||
import * as UploadApi from '@/api/upload'
|
||||
import store from '@/store'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
//当前页面参数
|
||||
options: {},
|
||||
// 正在加载
|
||||
isLoading: true,
|
||||
userInfo: { avatar: '', name: '', sex: 0, birthday: '', hasPassword: '' },
|
||||
openCardPara: null,
|
||||
code: "",
|
||||
nickname: "",
|
||||
avatar: "",
|
||||
memberId: 0
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
// 会员ID
|
||||
this.memberId = options.memberId ? options.memberId : 0;
|
||||
this.getUserInfo();
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 获取当前用户信息
|
||||
getUserInfo() {
|
||||
const app = this;
|
||||
app.showPopup = false;
|
||||
return new Promise((resolve, reject) => {
|
||||
MemberApi.detail(app.memberId)
|
||||
.then(result => {
|
||||
if (result.data.userInfo) {
|
||||
app.userInfo = result.data.userInfo
|
||||
} else {
|
||||
app.userInfo = { id: 0, name: '', avatar: '', gradeId: 0, mobile: '', balance: 0 }
|
||||
}
|
||||
resolve(app.userInfo);
|
||||
})
|
||||
.catch(err => {
|
||||
if (err.result && err.result.status == 1001) {
|
||||
resolve(null)
|
||||
} else {
|
||||
reject(err)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
bindDateChange (e) {
|
||||
let that = this;
|
||||
that.userInfo.birthday = e.detail.value;
|
||||
},
|
||||
getnickname(e) {
|
||||
this.nickname = e.detail.value;
|
||||
},
|
||||
genderChange(e) {
|
||||
this.userInfo.sex = e.detail.value;
|
||||
},
|
||||
// 选择图片
|
||||
chooseImage() {
|
||||
const app = this
|
||||
// 选择图片
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
|
||||
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
|
||||
success({ tempFiles }) {
|
||||
const imageList = tempFiles;
|
||||
return new Promise((resolve, reject) => {
|
||||
if (imageList.length > 0) {
|
||||
UploadApi.image(imageList)
|
||||
.then(files => {
|
||||
if (files && files.length > 0) {
|
||||
app.userInfo.avatar = files[0].fileName;
|
||||
app.avatar = files[0].domain + app.userInfo.avatar;
|
||||
}
|
||||
resolve(files)
|
||||
})
|
||||
.catch(err => reject(err))
|
||||
} else {
|
||||
resolve()
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 保存会员信息
|
||||
*/
|
||||
save() {
|
||||
const app = this
|
||||
app.isLoading = true
|
||||
MemberApi.save(app.userInfo)
|
||||
.then(result => {
|
||||
app.userInfo = result.data
|
||||
app.isLoading = false
|
||||
app.$success('保存成功!')
|
||||
}).catch(err => {
|
||||
app.isLoading = false;
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.info-list {
|
||||
padding-bottom: 100rpx;
|
||||
margin-top: 25rpx;
|
||||
}
|
||||
|
||||
// 项目内容
|
||||
.info-item {
|
||||
margin: 20rpx auto 20rpx auto;
|
||||
padding: 30rpx 40rpx;
|
||||
width: 94%;
|
||||
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 16rpx;
|
||||
background: #fff;
|
||||
.avatar-warp {
|
||||
line-height: 120rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.contacts {
|
||||
font-size: 30rpx;
|
||||
.name {
|
||||
margin-left:0px;
|
||||
}
|
||||
.value {
|
||||
float:right;
|
||||
color:#999999;
|
||||
text-align: right;
|
||||
.second {
|
||||
margin-left: .6rem;
|
||||
}
|
||||
}
|
||||
.password {
|
||||
text-align: right;
|
||||
float: left;
|
||||
padding-right: 5rpx;
|
||||
}
|
||||
.avatar {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 120rpx;
|
||||
border: solid 1px #cccccc;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
.item-option {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: 48rpx;
|
||||
}
|
||||
|
||||
// 底部操作栏
|
||||
.footer-fixed {
|
||||
height: 100rpx;
|
||||
z-index: 11;
|
||||
.btn-wrapper {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.btn-item {
|
||||
flex: 1;
|
||||
font-size: 28rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
border-radius: 40rpx;
|
||||
}
|
||||
|
||||
.btn-item-main {
|
||||
background: linear-gradient(to right, #f9211c, #ff6335);
|
||||
}
|
||||
.btn-item-out {
|
||||
margin-top: 20rpx;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid $fuint-theme;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
403
fuintUniapp/pages/merchant/order/index.vue
Normal file
403
fuintUniapp/pages/merchant/order/index.vue
Normal file
@@ -0,0 +1,403 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<mescroll-body ref="mescrollRef" :sticky="true" @init="mescrollInit" :down="{ native: true }" @down="downCallback"
|
||||
:up="upOption" @up="upCallback">
|
||||
|
||||
<!-- tab栏 -->
|
||||
<u-tabs :list="tabs" :is-scroll="false" :current="curTab" active-color="#FA2209" :duration="0.2" @change="onChangeTab" />
|
||||
|
||||
<!-- 订单列表 -->
|
||||
<view class="order-list">
|
||||
<view class="order-item" v-for="(item, index) in list.content" :key="index">
|
||||
<view class="item-top" @click="handleTargetDetail(item.id)">
|
||||
<view class="item-top-left">
|
||||
<text class="order-type">{{ item.typeName }}</text>
|
||||
</view>
|
||||
<view class="item-top-right">
|
||||
<text :class="item.status">{{ item.statusText }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商品列表 -->
|
||||
<view class="goods-list" v-if="item.goods" @click="handleTargetDetail(item.id)">
|
||||
<view class="goods-item" v-for="(goods, idx) in item.goods" :key="idx">
|
||||
<!-- 商品图片 -->
|
||||
<view class="goods-image">
|
||||
<image class="image" :src="goods.image"></image>
|
||||
</view>
|
||||
<!-- 商品信息 -->
|
||||
<view class="goods-content">
|
||||
<view class="goods-title twolist-hidden"><text>{{ goods.name }}</text></view>
|
||||
<view class="goods-props clearfix">
|
||||
<view class="goods-props-item" v-for="(props, idx) in goods.specList" :key="idx">
|
||||
<text>{{ props.specValue }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 交易信息 -->
|
||||
<view class="goods-trade">
|
||||
<view class="goods-price">
|
||||
<text class="unit">¥</text>
|
||||
<text class="value">{{ goods.price }}</text>
|
||||
</view>
|
||||
<view class="goods-num">
|
||||
<text>×{{ goods.num }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 备注信息 -->
|
||||
<view v-if="item.remark" class="remark" @click="handleTargetDetail(item.id)">
|
||||
<text>备注:</text>
|
||||
<text>{{ item.remark ? item.remark : '--'}}</text>
|
||||
</view>
|
||||
<!-- 订单合计 -->
|
||||
<view class="order-total" @click="handleTargetDetail(item.id)">
|
||||
<text>总金额</text>
|
||||
<text class="unit">¥</text>
|
||||
<text class="money">{{ item.amount }}</text>
|
||||
</view>
|
||||
<!-- 订单操作 -->
|
||||
<view class="order-handle">
|
||||
<view class="order-time">
|
||||
<text class="time">{{ item.createTime }}</text>
|
||||
</view>
|
||||
<view class="btn-group">
|
||||
<view class="btn-item" @click="handleTargetDetail(item.id)">详情</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
DeliveryStatusEnum,
|
||||
DeliveryTypeEnum,
|
||||
OrderStatusEnum,
|
||||
PayStatusEnum,
|
||||
PayTypeEnum,
|
||||
ReceiptStatusEnum
|
||||
} from '@/common/enum/order'
|
||||
import MescrollBody from '@/components/mescroll-uni/mescroll-body.vue'
|
||||
import MescrollMixin from '@/components/mescroll-uni/mescroll-mixins'
|
||||
import { getEmptyPaginateObj, getMoreListData } from '@/utils/app'
|
||||
import * as OrderApi from '@/api/merchant/order'
|
||||
import { wxPayment } from '@/utils/app'
|
||||
|
||||
// 每页记录数量
|
||||
const pageSize = 15
|
||||
|
||||
// tab栏数据
|
||||
const tabs = [{
|
||||
name: `全部`,
|
||||
value: 'all'
|
||||
}, {
|
||||
name: `待支付`,
|
||||
value: 'toPay'
|
||||
}, {
|
||||
name: `已支付`,
|
||||
value: 'paid'
|
||||
}, {
|
||||
name: `已取消`,
|
||||
value: 'cancel'
|
||||
}]
|
||||
|
||||
export default {
|
||||
components: {
|
||||
MescrollBody
|
||||
},
|
||||
mixins: [MescrollMixin],
|
||||
data() {
|
||||
return {
|
||||
// 枚举类
|
||||
DeliveryStatusEnum,
|
||||
DeliveryTypeEnum,
|
||||
OrderStatusEnum,
|
||||
PayStatusEnum,
|
||||
PayTypeEnum,
|
||||
ReceiptStatusEnum,
|
||||
|
||||
// 当前页面参数
|
||||
options: { dataType: 'all' },
|
||||
// tab栏数据
|
||||
tabs,
|
||||
// 当前标签索引
|
||||
curTab: 0,
|
||||
// 订单列表数据
|
||||
list: getEmptyPaginateObj(),
|
||||
// 正在加载
|
||||
isLoading: false,
|
||||
// 上拉加载配置
|
||||
upOption: {
|
||||
// 首次自动执行
|
||||
auto: true,
|
||||
// 每页数据的数量; 默认10
|
||||
page: { size: pageSize },
|
||||
// 数量要大于12条才显示无更多数据
|
||||
noMoreSize: 12,
|
||||
// 空布局
|
||||
empty: {
|
||||
tip: '亲,暂无订单记录'
|
||||
}
|
||||
},
|
||||
// 控制首次触发onShow事件时不刷新列表
|
||||
canReset: false,
|
||||
// 支付方式弹窗
|
||||
showPayPopup: false,
|
||||
statusText: "payStatus"
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
// 初始化当前选中的标签
|
||||
this.initCurTab(options)
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {
|
||||
this.canReset && this.onRefreshList()
|
||||
this.canReset = true
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
// 初始化当前选中的标签
|
||||
initCurTab(options) {
|
||||
const app = this
|
||||
if (options.dataType) {
|
||||
console.log("options == ", options);
|
||||
const index = app.tabs.findIndex(item => item.value == options.dataType)
|
||||
app.curTab = index > -1 ? index : 0
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 上拉加载的回调 (页面初始化时也会执行一次)
|
||||
* 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10
|
||||
* @param {Object} page
|
||||
*/
|
||||
upCallback(page) {
|
||||
const app = this
|
||||
// 设置列表数据
|
||||
app.getOrderList(page.num)
|
||||
.then(list => {
|
||||
const curPageLen = list.content.length
|
||||
const totalSize = list.totalElements
|
||||
app.mescroll.endBySize(curPageLen, totalSize)
|
||||
})
|
||||
.catch(() => app.mescroll.endErr())
|
||||
},
|
||||
|
||||
// 获取订单列表
|
||||
getOrderList(pageNo = 1) {
|
||||
const app = this
|
||||
return new Promise((resolve, reject) => {
|
||||
OrderApi.list({ dataType: app.getTabValue(), page: pageNo }, { load: false })
|
||||
.then(result => {
|
||||
// 合并新数据
|
||||
const newList = result.data;
|
||||
app.list.content = getMoreListData(newList, app.list, pageNo);
|
||||
resolve(newList)
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// 点击跳转到首页
|
||||
onTargetIndex() {
|
||||
this.$navTo('pages/index/index')
|
||||
},
|
||||
|
||||
// 获取当前标签项的值
|
||||
getTabValue() {
|
||||
return this.tabs[this.curTab].value
|
||||
},
|
||||
|
||||
// 切换标签项
|
||||
onChangeTab(index) {
|
||||
const app = this
|
||||
// 设置当前选中的标签
|
||||
app.curTab = index
|
||||
// 刷新订单列表
|
||||
app.onRefreshList()
|
||||
},
|
||||
|
||||
// 刷新订单列表
|
||||
onRefreshList() {
|
||||
this.list = getEmptyPaginateObj()
|
||||
setTimeout(() => {
|
||||
this.mescroll.resetUpScroll()
|
||||
}, 120)
|
||||
},
|
||||
|
||||
// 跳转到订单详情页
|
||||
handleTargetDetail(orderId) {
|
||||
this.$navTo('pages/order/detail', { orderId })
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
// 项目内容
|
||||
.order-item {
|
||||
margin: 10rpx auto 10rpx auto;
|
||||
padding: 20rpx 20rpx;
|
||||
width: 94%;
|
||||
border: 3rpx solid #e8e8e8;
|
||||
box-shadow: 5rpx 5rpx 5rpx 5rpx rgba(0.05, 0.05, 0.05, 0.05);
|
||||
border-radius: 16rpx;
|
||||
background: #fff;
|
||||
.A{
|
||||
color:$uni-text-color-active;
|
||||
}
|
||||
.B{
|
||||
color:$uni-text-color;
|
||||
}
|
||||
}
|
||||
|
||||
// 项目顶部
|
||||
.item-top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 26rpx;
|
||||
margin-bottom: 40rpx;
|
||||
|
||||
.order-type {
|
||||
font-weight: bold;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.state-text {
|
||||
color: $uni-text-color-active;
|
||||
}
|
||||
}
|
||||
|
||||
// 商品列表
|
||||
.goods-list {
|
||||
// 商品项
|
||||
.goods-item {
|
||||
display: flex;
|
||||
margin-bottom: 10rpx;
|
||||
border-bottom: 3rpx solid #e8e8e8;
|
||||
padding: 20rpx;
|
||||
|
||||
// 商品图片
|
||||
.goods-image {
|
||||
width: 180rpx;
|
||||
height: 143rpx;
|
||||
|
||||
.image {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
// 商品内容
|
||||
.goods-content {
|
||||
flex: 1;
|
||||
padding-left: 16rpx;
|
||||
padding-top: 16rpx;
|
||||
|
||||
.goods-title {
|
||||
font-size: 26rpx;
|
||||
max-height: 76rpx;
|
||||
}
|
||||
|
||||
.goods-props {
|
||||
margin-top: 14rpx;
|
||||
height: 40rpx;
|
||||
color: #ababab;
|
||||
font-size: 24rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.goods-props-item {
|
||||
display: inline-block;
|
||||
margin-right: 14rpx;
|
||||
padding: 4rpx 16rpx;
|
||||
border-radius: 12rpx;
|
||||
background-color: #F5F5F5;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 交易信息
|
||||
.goods-trade {
|
||||
padding-top: 16rpx;
|
||||
width: 150rpx;
|
||||
text-align: right;
|
||||
color: $uni-text-color-grey;
|
||||
font-size: 26rpx;
|
||||
|
||||
.goods-price {
|
||||
vertical-align: bottom;
|
||||
margin-bottom: 16rpx;
|
||||
.unit {
|
||||
margin-right: -2rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// 备注信息
|
||||
.remark {
|
||||
padding: 12rpx 0 12rpx 20rpx;
|
||||
border-radius: 5rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
// 订单合计
|
||||
.order-total {
|
||||
font-size: 26rpx;
|
||||
vertical-align: bottom;
|
||||
text-align: right;
|
||||
height: 40rpx;
|
||||
margin-top: 30rpx;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.unit {
|
||||
margin-left: 8rpx;
|
||||
margin-right: -2rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.money {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
// 订单操作
|
||||
.order-handle {
|
||||
height: 50rpx;
|
||||
.order-time {
|
||||
color: #777;
|
||||
float: left;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
.btn-group {
|
||||
.btn-item {
|
||||
border-radius: 10rpx;
|
||||
padding: 8rpx 24rpx;
|
||||
font-size: 28rpx;
|
||||
float: right;
|
||||
color: #ffffff;
|
||||
background: #f9211c;
|
||||
border: 1rpx solid #f9211c;
|
||||
margin-left: 25rpx;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user