DeXun/cashier
10
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
砂糖
2026-02-07 18:01:13 +08:00
commit 8015759c65
2110 changed files with 269866 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

219
fuintUniapp/pages/merchant/member/add.vue Normal file
View 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
View 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
View 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
View 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>