296 lines
8.9 KiB
Vue
296 lines
8.9 KiB
Vue
<template>
|
|
<view>
|
|
<view class="uni-header">
|
|
<view class="uni-group hide-on-phone">
|
|
<view class="uni-title">{{$t('user.list.title')}}</view>
|
|
</view>
|
|
<view class="uni-group">
|
|
<input class="uni-search" type="text" v-model="search" @confirm="getSearch"
|
|
:placeholder="$t('common.placeholder.query')" />
|
|
<button class="uni-button" type="default" size="mini"
|
|
@click="getSearch">{{$t('common.button.search')}}</button>
|
|
</view>
|
|
</view>
|
|
<view class="uni-container">
|
|
<scroll-view class="scroll" scroll-y scroll-with-animation>
|
|
<uni-table :loading="loading" border stripe :emptyText="$t('common.empty')">
|
|
<uni-tr>
|
|
<uni-th align="center">{{$t('user.list.table.avatar')}}</uni-th>
|
|
<uni-th align="center">{{$t('user.list.table.nickname')}}</uni-th>
|
|
<uni-th align="center">{{$t('user.list.table.money')}}</uni-th>
|
|
<uni-th align="center">{{$t('user.list.table.pay')}}</uni-th>
|
|
<uni-th align="center">{{$t('user.list.table.usable')}}</uni-th>
|
|
<uni-th align="center">{{$t('common.operate')}}</uni-th>
|
|
</uni-tr>
|
|
<uni-tr v-for="(item ,index) in list.data" :key="index">
|
|
<uni-td align="center">
|
|
<image class="avatar" :src="item.avatar.url"></image>
|
|
</uni-td>
|
|
<uni-td align="center">{{item.nickname?item.nickname:'--'}}</uni-td>
|
|
<uni-td align="center">{{item.money}}</uni-td>
|
|
<uni-td align="center">{{item.pay}}</uni-td>
|
|
<uni-td align="center">{{item.usable}}</uni-td>
|
|
<uni-td width="180" align="center">
|
|
<view class="uni-group">
|
|
<button @click="rechargeOpen(index)" class="uni-button" size="mini"
|
|
type="default">{{$t('common.button.recharge')}}</button>
|
|
<button @click="detailOpen(index)" class="uni-button" size="mini"
|
|
type="primary">{{$t('common.button.detail')}}</button>
|
|
</view>
|
|
</uni-td>
|
|
</uni-tr>
|
|
</uni-table>
|
|
</scroll-view>
|
|
<view class="uni-pagination-box">
|
|
<uni-pagination show-icon :page-size="list.per_page" :current="list.current_page" :total="list.total"
|
|
@change="change" />
|
|
</view>
|
|
</view>
|
|
<uni-popup ref="recharge" :is-mask-click="false">
|
|
<view class="popup-350">
|
|
<view class="title">
|
|
{{$t('user.list.recharge.title')}}
|
|
<view @click="$refs.recharge.close()" class="close">
|
|
<uni-icons type="closeempty" color="#999" size="22"></uni-icons>
|
|
</view>
|
|
</view>
|
|
<view class="form">
|
|
<uni-forms :border="true" ref="form" v-model="formData" :rules="rules">
|
|
<uni-forms-item :label="$t('user.list.recharge.field.balance')" labelWidth="35">
|
|
<view class="label">{{user.money}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.recharge.field.pattern')" name="mode" labelWidth="35">
|
|
<view class="hm-m-t-5">
|
|
<uni-data-checkbox v-model="formData.mode" :localdata="mode" />
|
|
</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.recharge.field.money')" name="money" labelWidth="35">
|
|
<uni-easyinput @confirm="recharge" type="number"
|
|
v-model="formData.money" :placeholder="$t('user.list.recharge.placeholder.money')">
|
|
</uni-easyinput>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.recharge.field.remarks')" name="remark" labelWidth="35">
|
|
<uni-easyinput type="textarea" v-model="formData.remark" :placeholder="$t('user.list.recharge.placeholder.remarks')" />
|
|
</uni-forms-item>
|
|
<view class="uni-button-group hm-p-lr-33">
|
|
<button class="uni-button uni-button-full" type="primary" :loading="rechargeLoading"
|
|
:disabled="rechargeLoading" @click="recharge">{{$t('common.button.submit')}}</button>
|
|
</view>
|
|
</uni-forms>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
<uni-popup ref="detail" :is-mask-click="false">
|
|
<view class="popup-350">
|
|
<view class="title">
|
|
{{$t('user.list.detail.title')}}
|
|
<view @click="$refs.detail.close()" class="close">
|
|
<uni-icons type="closeempty" color="#999" size="22"></uni-icons>
|
|
</view>
|
|
</view>
|
|
<view class="form">
|
|
<uni-forms :border="true">
|
|
<uni-forms-item :label="$t('user.list.detail.field.id')" labelWidth="35">
|
|
<view class="label">{{user.user_id}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.gender')" labelWidth="35">
|
|
<view class="label">{{user.gender.text}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.linkman')" labelWidth="35">
|
|
<view class="label">{{user.linkman?user.linkman:'--'}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.phone')" labelWidth="35">
|
|
<view class="label">{{user.phone?user.phone:'--'}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.region')" labelWidth="35">
|
|
<view class="label">{{user.province}}{{user.city?user.city:'--'}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.money')" labelWidth="35">
|
|
<view class="label">{{user.money}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.pay')" labelWidth="35">
|
|
<view class="label">{{user.pay}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.score')" labelWidth="35">
|
|
<view class="label">{{user.score}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.usable')" labelWidth="35">
|
|
<view class="label">{{user.usable}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.v')" labelWidth="35">
|
|
<view class="label">{{user.v.text}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.recommender')" labelWidth="35">
|
|
<view class="label">{{user.recommender.text}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.birthday')" labelWidth="35">
|
|
<view class="label">{{user.birthday?user.birthday:'--'}}</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item :label="$t('user.list.detail.field.create_time')" labelWidth="35">
|
|
<view class="label">{{user.create_time}}</view>
|
|
</uni-forms-item>
|
|
</uni-forms>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
<!-- #ifndef H5 -->
|
|
<fix-window />
|
|
<!-- #endif -->
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
let App = getApp();
|
|
export default {
|
|
data() {
|
|
return {
|
|
list: [],
|
|
search: '',
|
|
page: 1,
|
|
loading: false,
|
|
formData: {
|
|
mode: 10,
|
|
money: '',
|
|
remark: ''
|
|
},
|
|
// 单选数据源
|
|
mode: [{
|
|
text: '充值',
|
|
value: 10
|
|
}, {
|
|
text: '赠送',
|
|
value: 40
|
|
}, {
|
|
text: '扣除',
|
|
value: 50
|
|
}],
|
|
rules: {
|
|
money: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '变更金额必须是大于0的整数',
|
|
}
|
|
]
|
|
}
|
|
},
|
|
user:{},//用户详情
|
|
rechargeLoading: false,
|
|
}
|
|
},
|
|
onLoad() {
|
|
let _this = this;
|
|
_this.getList();
|
|
},
|
|
methods: {
|
|
/**
|
|
* 会员详情
|
|
*/
|
|
detailOpen(index){
|
|
let _this = this;
|
|
_this.user = _this.list.data[index];
|
|
_this.$refs.detail.open()
|
|
},
|
|
/**
|
|
* 充值
|
|
*/
|
|
recharge() {
|
|
let _this = this;
|
|
_this.$refs.form.validate().then(result => {
|
|
_this.rechargeLoading = true;
|
|
result.user_id = _this.user.user_id;
|
|
//数据验证没有问题
|
|
App._post_form('user/recharge', result, result => {
|
|
App.showSuccess(result.msg, function() {
|
|
_this.user = {};
|
|
_this.rechargeLoading = false;
|
|
_this.$refs.recharge.close();
|
|
_this.getList();
|
|
});
|
|
}, false, () => {});
|
|
}).catch(err => {
|
|
console.log('表单提交错误');
|
|
});
|
|
},
|
|
/**
|
|
* 开启充值窗口
|
|
*/
|
|
rechargeOpen(index) {
|
|
let _this = this;
|
|
_this.user = _this.list.data[index];
|
|
_this.$refs.recharge.open()
|
|
},
|
|
/**
|
|
* 获取列表
|
|
*/
|
|
getList() {
|
|
let _this = this;
|
|
_this.loading = true;
|
|
App._get('user/lists', {
|
|
page: _this.page,
|
|
search: _this.search
|
|
}, function(result) {
|
|
_this.list = result.data;
|
|
|
|
}, false, function(result) {
|
|
_this.loading = false;
|
|
_this.search = '';
|
|
});
|
|
},
|
|
// 分页触发
|
|
change(e) {
|
|
let _this = this;
|
|
_this.page = e.current;
|
|
_this.getList();
|
|
},
|
|
// 搜索
|
|
getSearch() {
|
|
let _this = this;
|
|
if (_this.search == '') {
|
|
App.showError('搜索内容为空');
|
|
return false;
|
|
}
|
|
_this.page = 1;
|
|
_this.getList();
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.popup-350 {
|
|
.title {
|
|
padding: 0 10px 10px 10px;
|
|
border-bottom: #f0f0f0 solid 1px;
|
|
|
|
.close {
|
|
display: inline-block;
|
|
float: right;
|
|
}
|
|
}
|
|
|
|
.form {
|
|
padding: 15px;
|
|
font-size: 18px;
|
|
.label{
|
|
padding-top: 9px;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* #ifndef H5 */
|
|
page {
|
|
padding-top: 85px;
|
|
|
|
}
|
|
/* #endif */
|
|
.avatar {
|
|
width: 60px;
|
|
height: 60px;
|
|
}
|
|
|
|
.scroll{
|
|
width: 100%;
|
|
height: calc(100vh - 166px - (var(--top-window-height)));
|
|
}
|
|
</style>
|