1748153932
12 months ago
parent
a858cfab21
commit
718be11d3c
@ -0,0 +1,240 @@ |
||||
<template> |
||||
<div class="divBox"> |
||||
<div class="header clearfix"> |
||||
<div class="container"> |
||||
<el-form inline size="small" @submit.native.prevent> |
||||
<el-form-item label="优惠劵名称："> |
||||
<el-input v-model="tableFrom.coupon_name" @keyup.enter.native="getList(1)" placeholder="请输入优惠券名称" class="selWidth" size="small"> |
||||
<el-button slot="append" icon="el-icon-search" size="small" class="el-button-solt" @click="getList(1)" /> |
||||
</el-input> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
</div> |
||||
<el-table |
||||
ref="table" |
||||
v-loading="listLoading" |
||||
:data="tableData.data" |
||||
style="width: 100%" |
||||
size="mini" |
||||
max-height="400" |
||||
tooltip-effect="dark" |
||||
> |
||||
<el-table-column width="55"> |
||||
<template slot-scope="scope"> |
||||
<el-radio |
||||
v-model="templateRadio" |
||||
:label="scope.row.coupon_id" |
||||
@change.native="getTemplateRow(scope.row)" |
||||
> </el-radio> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
prop="coupon_id" |
||||
label="ID" |
||||
min-width="50" |
||||
/> |
||||
<el-table-column |
||||
prop="title" |
||||
label="优惠券名称" |
||||
min-width="120" |
||||
/> |
||||
<el-table-column |
||||
label="优惠劵类型" |
||||
min-width="80" |
||||
> |
||||
<template slot-scope="{ row }"> |
||||
<span>{{ row.type | couponTypeFilter }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
prop="coupon_price" |
||||
label="优惠券面值" |
||||
min-width="90" |
||||
/> |
||||
<el-table-column |
||||
label="最低消费额" |
||||
min-width="90" |
||||
> |
||||
<template slot-scope="scope"> |
||||
<span>{{ scope.row.use_min_price===0?'不限制':scope.row.use_min_price }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
label="有效期限" |
||||
min-width="250" |
||||
> |
||||
<template slot-scope="scope"> |
||||
<span>{{ scope.row.coupon_type===1?scope.row.use_start_time+' 一 '+scope.row.use_end_time:scope.row.coupon_time }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
label="剩余数量" |
||||
min-width="90" |
||||
> |
||||
<template slot-scope="scope"> |
||||
<span>{{ scope.row.is_limited===0 ? '不限量' : scope.row.remain_count }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="操作" min-width="120" fixed="right" align="center"> |
||||
<template slot-scope="scope"> |
||||
<el-button type="text" size="small" class="mr10" :disabled="multipleSelection.coupon_id != scope.row.coupon_id" @click="send(scope.row.coupon_id)">发送</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<div class="block mb20"> |
||||
<el-pagination |
||||
:page-sizes="[5, 10, 10, 20]" |
||||
:page-size="tableFrom.limit" |
||||
:current-page="tableFrom.page" |
||||
layout="total, sizes, prev, pager, next, jumper" |
||||
:total="tableData.total" |
||||
@size-change="handleSizeChange" |
||||
@current-change="pageChange" |
||||
/> |
||||
</div> |
||||
<div> |
||||
<!-- <el-button size="small" type="primary" class="fr" @click="ok">确定</el-button> --> |
||||
<!-- <el-button size="small" class="fr mr20" @click="close">取消</el-button> --> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
// +---------------------------------------------------------------------- |
||||
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ] |
||||
// +---------------------------------------------------------------------- |
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved. |
||||
// +---------------------------------------------------------------------- |
||||
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权 |
||||
// +---------------------------------------------------------------------- |
||||
// | Author: CRMEB Team <admin@crmeb.com> |
||||
// +---------------------------------------------------------------------- |
||||
import { couponSendApi, platformLstApi } from '@/api/marketing' |
||||
import { roterPre } from '@/settings' |
||||
export default { |
||||
name: 'CouponList', |
||||
props: { |
||||
couponForm: { |
||||
type: Object, |
||||
required: true |
||||
}, |
||||
checkedIds: { |
||||
type: Array, |
||||
default: [] |
||||
}, |
||||
allCheck: { |
||||
type: Boolean, |
||||
default: false |
||||
}, |
||||
userFrom: { |
||||
type: Object, |
||||
required: true |
||||
} |
||||
}, |
||||
data() { |
||||
return { |
||||
roterPre: roterPre, |
||||
listLoading: true, |
||||
tableData: { |
||||
data: [], |
||||
total: 0 |
||||
}, |
||||
tableFrom: { |
||||
page: 1, |
||||
limit: 5, |
||||
coupon_name: '', |
||||
status: 1 |
||||
|
||||
}, |
||||
multipleSelection: { |
||||
coupon_id: '' |
||||
}, |
||||
templateRadio: 0, |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.tableFrom.page = 1 |
||||
this.getList(1) |
||||
|
||||
}, |
||||
methods: { |
||||
getTemplateRow(row) { |
||||
this.multipleSelection = { coupon_id: row.coupon_id }; |
||||
// this.$emit("getCouponData", this.multipleSelection); |
||||
}, |
||||
// 发送优惠券 |
||||
send(id){ |
||||
delete this.userFrom['page'] |
||||
delete this.userFrom['limit'] |
||||
let that = this; |
||||
that.$confirm('确定要发送优惠券吗？发送优惠券后将无法恢复，请谨慎操作！', '提示', { |
||||
confirmButtonText: '确定', |
||||
cancelButtonText: '取消', |
||||
type: 'warning' |
||||
}).then(() => { |
||||
let params = { |
||||
coupon_id: id, |
||||
search: that.userFrom, |
||||
mark: that.filter(this.couponForm), |
||||
is_all: that.allCheck ? 1 : 0, |
||||
uid: that.checkedIds |
||||
} |
||||
couponSendApi(params).then(res => { |
||||
that.$message.success(res.message) |
||||
that.$emit("sendSuccess"); |
||||
}).catch(res => { |
||||
that.$message.error(res.message) |
||||
}) |
||||
|
||||
}).catch(action => { |
||||
that.$message({ |
||||
type: 'info', |
||||
message: '已取消' |
||||
}) |
||||
}) |
||||
}, |
||||
filter(data) { |
||||
for ( var key in data ){ |
||||
if ( data[key] === '' ){ |
||||
delete data[key] |
||||
} |
||||
} |
||||
return data |
||||
}, |
||||
// 列表 |
||||
getList(num) { |
||||
this.listLoading = true |
||||
this.tableFrom.page = num ? num : this.tableFrom.page |
||||
platformLstApi(this.tableFrom).then(res => { |
||||
this.tableData.data = res.data.list |
||||
this.tableData.total = res.data.count |
||||
this.listLoading = false |
||||
}).catch(res => { |
||||
this.listLoading = false |
||||
this.$message.error(res.message) |
||||
}) |
||||
}, |
||||
pageChange(page) { |
||||
this.tableFrom.page = page |
||||
this.getList('') |
||||
}, |
||||
handleSizeChange(val) { |
||||
this.tableFrom.limit = val |
||||
this.getList('') |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.selWidth{ |
||||
width: 219px !important; |
||||
} |
||||
.seachTiele{ |
||||
line-height: 35px; |
||||
} |
||||
.fr{ |
||||
float: right; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,859 @@ |
||||
<template> |
||||
<div class="divBox"> |
||||
<el-card class="box-card"> |
||||
<div slot="header" class="clearfix"> |
||||
<el-tabs v-model="user_type" @tab-click="getList(1)"> |
||||
<el-tab-pane label="全部用户" name="" /> |
||||
<el-tab-pane label="微信用户" name="wechat" /> |
||||
<el-tab-pane label="小程序用户" name="routine" /> |
||||
<el-tab-pane label="H5用户" name="h5" /> |
||||
<el-tab-pane label="APP" name="app" /> |
||||
<el-tab-pane label="PC" name="pc" /> |
||||
</el-tabs> |
||||
<div class="container"> |
||||
<el-form inline size="small" :label-position="labelPosition" label-width="100px"> |
||||
<el-row> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="18" :xl="18"> |
||||
<el-form-item label="会员昵称："> |
||||
<el-input v-model="userFrom.nickname" placeholder="请输入昵称" clearable class="selWidth" /> |
||||
</el-form-item> |
||||
<el-form-item label="手机号："> |
||||
<el-input v-model="userFrom.phone" placeholder="请输入手机号" clearable class="selWidth" /> |
||||
</el-form-item> |
||||
<el-form-item label="用户ID："> |
||||
<el-input v-model="userFrom.uid" placeholder="请输入用户ID" clearable class="selWidth" /> |
||||
</el-form-item> |
||||
</el-col> |
||||
<template v-if="collapse"> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="18" :xl="18"> |
||||
<el-col v-bind="grid"> |
||||
<el-form-item label="会员分组："> |
||||
<el-select v-model="userFrom.group_id" placeholder="请选择" class="selWidth" clearable filterable> |
||||
<el-option value="">全部</el-option> |
||||
<el-option v-for="(item, index) in groupList" :key="index" :value="item.group_id" :label="item.group_name" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col v-bind="grid"> |
||||
<el-form-item label="会员标签："> |
||||
<el-select v-model="userFrom.label_id" placeholder="请选择" class="selWidth" clearable filterable> |
||||
<el-option value="">全部</el-option> |
||||
<el-option v-for="(item, index) in labelLists" :key="index" :value="item.label_id" :label="item.label_name" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="18" :xl="18"> |
||||
<el-col v-bind="grid"> |
||||
<el-form-item label="性别："> |
||||
<el-radio-group v-model="userFrom.sex" type="button" class="selWidth"> |
||||
<el-radio-button label=""> |
||||
<span>全部</span> |
||||
</el-radio-button> |
||||
<el-radio-button label="1"> |
||||
<span>男</span> |
||||
</el-radio-button> |
||||
<el-radio-button label="2"> |
||||
<span>女</span> |
||||
</el-radio-button> |
||||
<el-radio-button label="0"> |
||||
<span>保密</span> |
||||
</el-radio-button> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col v-bind="grid"> |
||||
<el-form-item label="身份："> |
||||
<el-radio-group v-model="userFrom.is_promoter" type="button" class="selWidth"> |
||||
<el-radio-button label=""> |
||||
<span>全部</span> |
||||
</el-radio-button> |
||||
<el-radio-button label="1"> |
||||
<span>推广员</span> |
||||
</el-radio-button> |
||||
<el-radio-button label="0"> |
||||
<span>普通会员</span> |
||||
</el-radio-button> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="18" :xl="18"> |
||||
<el-col v-bind="grid"> |
||||
<el-form-item label="访问情况："> |
||||
<el-select v-model="userFrom.user_time_type" placeholder="请选择" class="selWidth" clearable> |
||||
<!--<el-option value="visitno" label="时间段未访问" />--> |
||||
<el-option value="visit" label="最后访问" /> |
||||
<el-option value="add_time" label="首次访问" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col v-bind="grid"> |
||||
<el-form-item label="消费情况："> |
||||
<el-select v-model="userFrom.pay_count" placeholder="请选择" class="selWidth" clearable> |
||||
<el-option value="-1" label="0次"></el-option> |
||||
<el-option value="0" label="1次及以上"></el-option> |
||||
<el-option value="1" label="2次及以上"></el-option> |
||||
<el-option value="2" label="3次及以上"></el-option> |
||||
<el-option value="3" label="4次及以上"></el-option> |
||||
<el-option value="4" label="5次及以上"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="18" :xl="18"> |
||||
<el-col v-bind="grid"> |
||||
<el-form-item label="访问时间：" class="timeBox"> |
||||
<el-date-picker v-model="timeVal" value-format="yyyy/MM/dd" align="right" unlink-panels format="yyyy/MM/dd" size="small" type="daterange" placement="bottom-end" placeholder="自定义时间" class="selWidth" :picker-options="pickerOptions" @change="onchangeTime" /> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-col> |
||||
</template> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6" class="text-right userFrom"> |
||||
<el-form-item> |
||||
<el-button type="primary" icon="ios-search" label="default" class="mr15" size="small" @click="userSearchs">搜索</el-button> |
||||
<el-button class="ResetSearch mr10" size="small" type="reset" @click="reset('userFrom')">重置</el-button> |
||||
<a class="ivu-ml-8" @click="collapse = !collapse"> |
||||
<template v-if="!collapse"> |
||||
展开 <i class="el-icon-arrow-down" /> |
||||
</template> |
||||
<template v-else> |
||||
收起 <i class="el-icon-arrow-up" /> |
||||
</template> |
||||
</a> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
</el-form> |
||||
</div> |
||||
<div class="mb15"> |
||||
<el-button class="mr10" size="mini" @click="createUser">创建用户</el-button> |
||||
<el-button v-show="user_type === 'wechat'" size="mini" class="mr10" @click="sendNews">发送图文消息</el-button> |
||||
<el-button v-show="checkedIds.length != 0" size="mini" class="mr10" @click="batchGroup">批量设置分组</el-button> |
||||
<el-button v-show="checkedIds.length != 0" size="mini" @click="batchlabel">批量设置标签</el-button> |
||||
<el-button type="primary" icon="ios-search" label="default" class="mr15" size="mini" @click="sendCoupon" style="margin-bottom: 20px;">发送优惠券</el-button> |
||||
|
||||
</div> |
||||
<el-alert v-if="checkedIds.length>0 || allCheck" :title="allCheck ? `已选择 ${tableData.total} 项` : `已选择 ${checkedIds.length} 项`" type="info" show-icon /> |
||||
<!-- <el-alert v-if="multipleSelection.length>0" :title="`已选择 ${multipleSelection.length} 项`" type="info" show-icon /> --> |
||||
</div> |
||||
<el-table v-loading="listLoading" :data="tableData.data" style="width: 100%" size="small" highlight-current-row @selection-change="handleSelectionChange"> |
||||
<el-table-column type="expand"> |
||||
<template slot-scope="props"> |
||||
<el-form label-position="left" inline class="demo-table-expand"> |
||||
<el-form-item label="首次访问："> |
||||
<span>{{ props.row.create_time }}</span> |
||||
</el-form-item> |
||||
<el-form-item label="近次访问："> |
||||
<span>{{ props.row.last_time }}</span> |
||||
</el-form-item> |
||||
<el-form-item label="身份证号："> |
||||
<span>{{ props.row.card_id }}</span> |
||||
</el-form-item> |
||||
<el-form-item label="手机号："> |
||||
<span>{{ props.row.phone }}</span> |
||||
</el-form-item> |
||||
<el-form-item label="真实姓名："> |
||||
<span>{{ props.row.real_name }}</span> |
||||
</el-form-item> |
||||
|
||||
<!-- <el-form-item label="社区贡献值：">--> |
||||
<!-- <span>{{ props.row.community_value }}</span>--> |
||||
<!-- </el-form-item>--> |
||||
|
||||
<!-- <el-form-item label="角色贡献值：">--> |
||||
<!-- <span>{{ props.row.role_value }}</span>--> |
||||
<!-- </el-form-item>--> |
||||
|
||||
<!-- <el-form-item label="品宣贡献值：">--> |
||||
<!-- <span>{{ props.row.brand_value }}</span>--> |
||||
<!-- </el-form-item>--> |
||||
|
||||
|
||||
<el-form-item label="标签："> |
||||
<span v-for="(item, index) in props.row.label" :key="index" v-text="item" /> |
||||
</el-form-item> |
||||
<el-form-item label="生日："> |
||||
<span>{{ props.row.birthday }}</span> |
||||
</el-form-item> |
||||
<el-form-item label="地址："> |
||||
<span>{{ props.row.addres }}</span> |
||||
</el-form-item> |
||||
<el-form-item label="备注："> |
||||
<span>{{ props.row.mark }}</span> |
||||
</el-form-item> |
||||
</el-form> |
||||
</template> |
||||
</el-table-column> |
||||
<!-- <el-table-column type="selection" width="55" /> --> |
||||
|
||||
<el-table-column width="50"> |
||||
<template slot="header" slot-scope="scope"> |
||||
<el-popover placement="top-start" width="100" trigger="hover" class="tabPop"> |
||||
<div> |
||||
<span class="spBlock onHand" :class="{'check': chkName === 'dan'}" @click="onHandle('dan',scope.$index)">选中本页</span> |
||||
<span class="spBlock onHand" :class="{'check': chkName === 'duo'}" @click="onHandle('duo')">选中全部</span> |
||||
</div> |
||||
<el-checkbox slot="reference" :value="(chkName === 'dan' && checkedPage.indexOf(userFrom.page) > -1) || chkName === 'duo'" @change="changeType" /> |
||||
</el-popover> |
||||
</template> |
||||
<template slot-scope="scope"> |
||||
<el-checkbox :disabled="scope.row.cancel_time" :value="!scope.row.cancel_time && (checkedIds.indexOf(scope.row.uid) > -1 || (chkName === 'duo' && noChecked.indexOf(scope.row.uid) === -1))" @change="(v)=>changeOne(v,scope.row)" /> |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column prop="uid" label="ID" min-width="60" /> |
||||
<el-table-column label="头像" min-width="50"> |
||||
<template slot-scope="scope"> |
||||
<div class="demo-image__preview"> |
||||
<el-image style="width: 36px; height: 36px" :src="scope.row.avatar ? scope.row.avatar : moren" :preview-src-list="[scope.row.avatar || moren]" /> |
||||
</div> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="昵称" min-width="150"> |
||||
<template slot-scope="{row}"> |
||||
<div class="acea-row"> |
||||
<i v-show="row.sex===1" class="el-icon-male mr5" style="font-size: 15px; margin-top: 3px; color:#2db7f5;" /> |
||||
<i v-show="row.sex===2" class="el-icon-female mr5" style="font-size: 15px; margin-top: 3px; color:#ed4014;" /> |
||||
<div v-text="row.nickname" /> |
||||
</div> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="is_svip" label="付费会员" min-width="120"> |
||||
<template slot-scope="{row}"> |
||||
<span>{{row.is_svip > 0 ? "是" : "否"}}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="phone" label="手机号" min-width="120" /> |
||||
<el-table-column label="等级" min-width="100"> |
||||
<template slot-scope="{row}"> |
||||
<span>{{ row.member?row.member.brokerage_name:'-' }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="分组" min-width="100"> |
||||
<template slot-scope="{row}"> |
||||
<span>{{ row.group?row.group.group_name:'无' }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="推荐人" min-width="140"> |
||||
<template slot-scope="{row}"> |
||||
<span>{{ row.spread ? row.spread.nickname + ' / ' + row.spread.uid : '-' }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="用户类型" min-width="100"> |
||||
<template slot-scope="{row}"> |
||||
<span>{{ row.user_type === 'routine' ? '小程序' : row.user_type === 'wechat' ? '公众号' : row.user_type === 'app' || row.user_type === 'App' ? 'App' : row.user_type === 'pc' ? 'PC' : 'H5' }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="now_money" label="余额" sortable min-width="100" :sort-method="(a,b)=>{return a.now_money - b.now_money}"/> |
||||
<el-table-column prop="integral" label="当前可用积分" min-width="100" /> |
||||
<el-table-column label="操作" min-width="130" fixed="right"> |
||||
<template slot-scope="scope"> |
||||
<el-button v-if="!scope.row.cancel_time" type="text" size="small" class="mr10" @click="onEdit(scope.row.uid)">编辑</el-button> |
||||
<el-dropdown> |
||||
<span class="el-dropdown-link"> |
||||
更多<i class="el-icon-arrow-down el-icon--right" /> |
||||
</span> |
||||
<el-dropdown-menu slot="dropdown"> |
||||
<el-dropdown-item @click.native="onDetails(scope.row.uid)">用户详情</el-dropdown-item> |
||||
<el-dropdown-item v-if="!scope.row.cancel_time" @click.native="setMoney(scope.row)">设置余额</el-dropdown-item> |
||||
<el-dropdown-item v-if="!scope.row.cancel_time" @click.native="changeIntegral(scope.row)">设置积分</el-dropdown-item> |
||||
<el-dropdown-item v-if="scope.row.vip_name && !scope.row.cancel_time">清除等级</el-dropdown-item> |
||||
<el-dropdown-item v-if="!scope.row.cancel_time" @click.native="setGroup(scope.row)">设置分组</el-dropdown-item> |
||||
<el-dropdown-item v-if="!scope.row.cancel_time" @click.native="setLabel(scope.row)">设置标签</el-dropdown-item> |
||||
<el-dropdown-item v-if="!scope.row.cancel_time" @click.native="setModify(scope.row)">修改推荐人</el-dropdown-item> |
||||
<el-dropdown-item v-if="!scope.row.cancel_time" @click.native="setPassword(scope.row)">修改密码</el-dropdown-item> |
||||
<el-dropdown-item v-if="!scope.row.cancel_time" @click.native="setMember(scope.row)">编辑会员等级</el-dropdown-item> |
||||
<el-dropdown-item v-if="!scope.row.cancel_time" @click.native="giveMember(scope.row)">付费会员设置</el-dropdown-item> |
||||
</el-dropdown-menu> |
||||
</el-dropdown> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<div class="block"> |
||||
<el-pagination :page-sizes="[20, 40, 60, 80]" :page-size="userFrom.limit" :current-page="userFrom.page" layout="total, sizes, prev, pager, next, jumper" :total="tableData.total" @size-change="handleSizeChange" @current-change="pageChange" /> |
||||
</div> |
||||
</el-card> |
||||
<el-dialog title="提示" :visible.sync="visible" width="1000px" :before-close="handleClose" class="dia"> |
||||
<news-category v-if="visible" :is-show-send="isShowSend" :wechat-ids="wechatIds" :user-ids="ids" :max-cols="maxCols" /> |
||||
<!--<span slot="footer" class="dialog-footer" />--> |
||||
</el-dialog> |
||||
<!--账户详情--> |
||||
<el-dialog v-if="uid" title="用户详情" :visible.sync="visibleDetail" width="1000px" :before-close="Close"> |
||||
<user-details v-if="visibleDetail" ref="userDetails" :uid="uid" :cancel-time="cancel_time" /> |
||||
</el-dialog> |
||||
<!-- 选择优惠券 --> |
||||
<el-dialog v-if="visibleCoupon" title="优惠券列表" :visible.sync="visibleCoupon" width="1000px"> |
||||
<coupon-List v-if="visibleCoupon" ref="couponList" :couponForm="couponForm" :checkedIds="checkedIds" :allCheck="allCheck" :userFrom="userFrom" @sendSuccess="sendSuccess" /> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
// +---------------------------------------------------------------------- |
||||
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ] |
||||
// +---------------------------------------------------------------------- |
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved. |
||||
// +---------------------------------------------------------------------- |
||||
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权 |
||||
// +---------------------------------------------------------------------- |
||||
// | Author: CRMEB Team <admin@crmeb.com> |
||||
// +---------------------------------------------------------------------- |
||||
import { |
||||
userLstApi, |
||||
changeGroupApi, |
||||
changelabelApi, |
||||
changeNowMoneyApi, |
||||
changeNowIntegralApi, |
||||
batchChangeGroupApi, |
||||
batchChangelabelApi, |
||||
userUpdateApi, |
||||
groupLstApi, |
||||
labelLstApi, |
||||
modifyUserReferrer, |
||||
modifyUserPassword, |
||||
changeMemberApi, |
||||
createUserApi, |
||||
giveMemberApi |
||||
} from '@/api/user' |
||||
import newsCategory from '@/components/newsCategory/index.vue' |
||||
import userDetails from './userDetails' |
||||
import couponList from './couponList' |
||||
|
||||
export default { |
||||
name: 'UserList', |
||||
components: { |
||||
newsCategory, |
||||
userDetails, |
||||
couponList |
||||
}, |
||||
data() { |
||||
return { |
||||
moren: require("@/assets/images/f.png"), |
||||
pickerOptions: { |
||||
shortcuts: [{ |
||||
text: '今天', |
||||
onClick(picker) { |
||||
const end = new Date() |
||||
const start = new Date() |
||||
start.setTime(new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate())) |
||||
picker.$emit('pick', [start, end]) |
||||
} |
||||
}, |
||||
{ |
||||
text: '昨天', |
||||
onClick(picker) { |
||||
const end = new Date() |
||||
const start = new Date() |
||||
start.setTime(start.setTime(new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate() - 1))) |
||||
end.setTime(end.setTime(new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate()))) |
||||
picker.$emit('pick', [start, end]) |
||||
} |
||||
}, |
||||
{ |
||||
text: '最近7天', |
||||
onClick(picker) { |
||||
const end = new Date() |
||||
const start = new Date() |
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7) |
||||
picker.$emit('pick', [start, end]) |
||||
} |
||||
}, |
||||
{ |
||||
text: '最近30天', |
||||
onClick(picker) { |
||||
const end = new Date() |
||||
const start = new Date() |
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30) |
||||
picker.$emit('pick', [start, end]) |
||||
} |
||||
}, |
||||
{ |
||||
text: '本月', |
||||
onClick(picker) { |
||||
const end = new Date() |
||||
const start = new Date() |
||||
start.setTime(start.setTime(new Date(new Date().getFullYear(), new Date().getMonth(), 1))) |
||||
picker.$emit('pick', [start, end]) |
||||
} |
||||
}, |
||||
{ |
||||
text: '本年', |
||||
onClick(picker) { |
||||
const end = new Date() |
||||
const start = new Date() |
||||
start.setTime(start.setTime(new Date(new Date().getFullYear(), 0, 1))) |
||||
picker.$emit('pick', [start, end]) |
||||
} |
||||
} |
||||
] |
||||
}, |
||||
timeVal: [], |
||||
collapse: false, |
||||
visibleDetail: false, |
||||
maxCols: 3, |
||||
isShowSend: true, |
||||
visible: false, |
||||
user_type: '', |
||||
tableData: { |
||||
data: [], |
||||
total: 0 |
||||
}, |
||||
listLoading: true, |
||||
multipleSelection: [], |
||||
ids: '', |
||||
wechatIds: '', |
||||
uid: '', |
||||
labelPosition: 'right', |
||||
userProps: { |
||||
children: 'children', |
||||
label: 'name', |
||||
value: 'name' |
||||
}, |
||||
userFrom: { |
||||
label_id: '', |
||||
user_type: '', |
||||
sex: '', |
||||
is_promoter: '', |
||||
country: '', |
||||
pay_count: '', |
||||
user_time_type: '', |
||||
user_time: '', |
||||
nickname: '', |
||||
phone: '', |
||||
province: '', |
||||
city: '', |
||||
page: 1, |
||||
limit: 20, |
||||
group_id: '' |
||||
}, |
||||
address: [], |
||||
grid: { |
||||
xl: 8, |
||||
lg: 12, |
||||
md: 12, |
||||
sm: 24, |
||||
xs: 24 |
||||
}, |
||||
grid2: { |
||||
xl: 18, |
||||
lg: 16, |
||||
md: 12, |
||||
sm: 24, |
||||
xs: 24 |
||||
}, |
||||
grid3: { |
||||
xl: 8, |
||||
lg: 12, |
||||
md: 12, |
||||
sm: 24, |
||||
xs: 24 |
||||
}, |
||||
addresData: [], |
||||
groupList: [], |
||||
labelLists: [], |
||||
chkName: '', |
||||
checkedIds: [], // 订单当前页选中的数据 |
||||
noChecked: [], // 订单全选状态下当前页不选中的数据 |
||||
checkedPage: [], |
||||
visibleCoupon: false, |
||||
couponForm: { |
||||
用户标签: '', |
||||
用户类型: '', |
||||
性别: '', |
||||
身份: '', |
||||
消费情况: '', |
||||
访问情况: '', |
||||
访问时间: '', |
||||
昵称: '' |
||||
}, |
||||
allCheck: false, |
||||
cancel_time: null |
||||
|
||||
} |
||||
}, |
||||
mounted() { |
||||
this.groupLists() |
||||
this.getTagList() |
||||
this.getList('') |
||||
}, |
||||
methods: { |
||||
// 用户 |
||||
onHandle(name) { |
||||
this.chkName = this.chkName === name ? '' : name |
||||
this.changeType(!(this.chkName === '')) |
||||
}, |
||||
changeType(v) { |
||||
if (v) { |
||||
if (!this.chkName) { |
||||
this.chkName = 'dan' |
||||
} |
||||
} else { |
||||
this.chkName = '' |
||||
this.allCheck = false; |
||||
} |
||||
const index = this.checkedPage.indexOf(this.userFrom.page) |
||||
if (this.chkName === 'dan') { |
||||
this.checkedPage.push(this.userFrom.page) |
||||
} else if (index > -1) { |
||||
this.checkedPage.splice(index, 1) |
||||
} |
||||
|
||||
this.syncCheckedId() |
||||
}, |
||||
syncCheckedId() { |
||||
// const ids = this.tableData.data.map(v => v.uid) |
||||
const ids = this.tableData.data.map(v => { |
||||
if (!v.cancel_time) { |
||||
return v.uid |
||||
} |
||||
}) |
||||
if (this.chkName === 'duo') { |
||||
this.checkedIds = [] |
||||
this.allCheck = true; |
||||
} else if (this.chkName === 'dan') { |
||||
this.allCheck = false; |
||||
ids.forEach(id => { |
||||
const index = this.checkedIds.indexOf(id) |
||||
if (index === -1) { |
||||
this.checkedIds.push(id) |
||||
} |
||||
}) |
||||
} else { |
||||
ids.forEach(id => { |
||||
const index = this.checkedIds.indexOf(id) |
||||
if (index > -1) { |
||||
this.checkedIds.splice(index, 1) |
||||
} |
||||
}) |
||||
} |
||||
|
||||
}, |
||||
// 分开选择 |
||||
changeOne(v, user) { |
||||
if (v) { |
||||
if (this.chkName === 'duo') { |
||||
const index = this.noChecked.indexOf(user.uid) |
||||
if (index > -1) this.noChecked.splice(index, 1) |
||||
} else { |
||||
const index = this.checkedIds.indexOf(user.uid) |
||||
if (index === -1) this.checkedIds.push(user.uid) |
||||
} |
||||
} else { |
||||
if (this.chkName === 'duo') { |
||||
const index = this.noChecked.indexOf(user.uid) |
||||
if (index === -1) this.noChecked.push(user.uid) |
||||
} else { |
||||
const index = this.checkedIds.indexOf(user.uid) |
||||
if (index > -1) this.checkedIds.splice(index, 1) |
||||
} |
||||
} |
||||
console.log("分开选择",this.checkedIds) |
||||
|
||||
}, |
||||
// 发送优惠券 |
||||
sendCoupon(){ |
||||
if(this.checkedIds.length == 0 && this.allCheck == false){ |
||||
this.$message.warning('请选择用户') |
||||
}else{ |
||||
this.visibleCoupon = true; |
||||
} |
||||
}, |
||||
sendSuccess(){ |
||||
this.visibleCoupon = false; |
||||
}, |
||||
getCoupounParmas(){ |
||||
let label_id = this.userFrom.label_id == '' ? '' : this.getLabelValue(), |
||||
user_type = this.findKey(this.userFrom.user_type,{'':'','微信用户':'wechat','小程序用户':'routine','H5用户':'h5'}), |
||||
sex = this.findKey(this.userFrom.sex,{'男':'1','女':'2','保密':'0','':''}), |
||||
pay_count = this.findKey(this.userFrom.sex,{'0次':'-1','1次以上':'0','2次以上':'1','3次以上':'2','4次以上':'3','5次以上':'4','': ''}), |
||||
is_promoter = this.findKey(this.userFrom.is_promoter,{'推广员':'1','普通用户':'0','':''}), |
||||
user_time_type = this.userFrom.user_time_type == 'visit' ? '最后访问' : this.userFrom.user_time_type == 'add_time' ? '首次访问' : '' |
||||
this.couponForm = { |
||||
用户标签: label_id, |
||||
用户类型: user_type, |
||||
性别: sex, |
||||
消费情况: pay_count, |
||||
身份: is_promoter, |
||||
访问情况: user_time_type, |
||||
访问时间: this.userFrom.user_time, |
||||
昵称: this.userFrom.nickname |
||||
} |
||||
}, |
||||
findKey(value,data, compare = (a, b) => a === b) { |
||||
return Object.keys(data).find(k => compare(data[k], value)) |
||||
}, |
||||
getLabelValue(){ |
||||
let labelName = '' |
||||
for(let i = 0; i < this.labelLists.length; i ++) { |
||||
if(this.labelLists[i]['label_id'] === this.userFrom.label_id) { |
||||
labelName = this.labelLists[i]['label_name'] |
||||
return labelName |
||||
} |
||||
} |
||||
}, |
||||
// 选择时间 |
||||
selectChange(tab) { |
||||
this.timeVal = [] |
||||
this.userFrom.user_time = tab |
||||
this.getList('') |
||||
}, |
||||
// 具体日期 |
||||
onchangeTime(e) { |
||||
this.timeVal = e |
||||
this.userFrom.user_time = e ? this.timeVal.join('-') : '' |
||||
}, |
||||
userSearchs() { |
||||
if(this.userFrom.user_time_type && (!this.userFrom.user_time)){ |
||||
this.$message.error('请选择访问时间') |
||||
}else if(!this.userFrom.user_time_type && (this.userFrom.user_time)){ |
||||
this.$message.error('请选择访问情况') |
||||
}else{ |
||||
this.getList(1) |
||||
} |
||||
}, |
||||
// 创建用户 |
||||
createUser() { |
||||
this.$modalForm(createUserApi()).then(() => this.getList('')) |
||||
}, |
||||
// 分组列表 |
||||
groupLists() { |
||||
groupLstApi({ |
||||
page: 1, |
||||
limit: 9999 |
||||
}).then(async res => { |
||||
this.groupList = res.data.list |
||||
}).catch(res => { |
||||
this.$message.error(res.message) |
||||
}) |
||||
}, |
||||
// 标签列表 |
||||
getTagList() { |
||||
labelLstApi({ |
||||
page: 1, |
||||
limit: 9999 |
||||
}).then(res => { |
||||
this.labelLists = res.data.list |
||||
}).catch(res => { |
||||
this.$message.error(res.message) |
||||
}) |
||||
}, |
||||
// 账户详情 |
||||
onDetails(id) { |
||||
this.uid = id |
||||
this.cancel_time = this.tableData.data.find(item => item.uid === id).cancel_time |
||||
this.visibleDetail = true |
||||
}, |
||||
Close() { |
||||
this.visibleDetail = false |
||||
}, |
||||
sendNews() { |
||||
if (this.checkedIds.length === 0 && this.allCheck == false) return this.$message.warning('请先选择用户') |
||||
this.visible = true |
||||
this.wechatIds = this.getWechatUsers(this.tableData.data, this.checkedIds) |
||||
|
||||
}, |
||||
handleClose() { |
||||
this.visible = false |
||||
}, |
||||
/**获取选中的微信用户Id */ |
||||
getWechatUsers(arr1, arr2){ |
||||
let newArr = []; |
||||
if(this.allCheck){ |
||||
for (let i = 0; i < arr1.length; i++) { |
||||
if(arr1[i]['wechat_user_id']){ |
||||
newArr.push(arr1[i]['wechat_user_id']); |
||||
} |
||||
} |
||||
}else{ |
||||
for (let i = 0; i < arr1.length; i++) { |
||||
for (let j = 0; j < arr2.length; j++) { |
||||
if(arr1[i]['uid'] === arr2[j] && arr1[i]['wechat_user_id']){ |
||||
newArr.push(arr2[j]); |
||||
} |
||||
} |
||||
} |
||||
} |
||||
return newArr; |
||||
}, |
||||
handleSelectionChange(val) { |
||||
this.multipleSelection = val |
||||
const data = [] |
||||
const wechatData = [] |
||||
this.multipleSelection.map((item) => { |
||||
data.push(item.uid) |
||||
wechatData.push(item.wechat_user_id) |
||||
}) |
||||
this.ids = data.join(',') |
||||
this.wechatIds = wechatData.join(',') |
||||
}, |
||||
// 修改分组 |
||||
setGroup(row) { |
||||
this.$modalForm(changeGroupApi(row.uid)).then(() => this.getList('')) |
||||
}, |
||||
// 批量分组 |
||||
batchGroup() { |
||||
if (this.checkedIds.length === 0) return this.$message.warning('请先选择用户') |
||||
this.$modalForm(batchChangeGroupApi({ |
||||
ids: (this.checkedIds).join(",") |
||||
})) |
||||
}, |
||||
// 批量标签 |
||||
batchlabel() { |
||||
if (this.checkedIds.length === 0) return this.$message.warning('请先选择用户') |
||||
this.$modalForm(batchChangelabelApi({ |
||||
ids: (this.checkedIds).join(",") |
||||
})) |
||||
}, |
||||
// 修改标签 |
||||
setLabel(row) { |
||||
this.$modalForm(changelabelApi(row.uid)).then(() => this.getList('')) |
||||
}, |
||||
// 编辑会员等级 |
||||
setMember(row) { |
||||
this.$modalForm(changeMemberApi(row.uid)).then(() => this.getList('')) |
||||
}, |
||||
// 赠送付费会员 |
||||
giveMember(row) { |
||||
this.$modalForm(giveMemberApi(row.uid)).then(() => this.getList('')) |
||||
}, |
||||
// 修改推荐人 |
||||
setModify(row){ |
||||
this.$modalForm(modifyUserReferrer(row.uid)).then(({ message }) => { |
||||
this.getList(''); |
||||
}); |
||||
}, |
||||
// 修改密码 |
||||
setPassword(row){ |
||||
this.$modalForm(modifyUserPassword(row.uid)).then(() => this.getList('')); |
||||
}, |
||||
// 修改余额 |
||||
setMoney(row) { |
||||
this.$modalForm(changeNowMoneyApi(row.uid)).then(() => this.getList('')) |
||||
}, |
||||
// 修改积分余额 |
||||
changeIntegral(row){ |
||||
this.$modalForm(changeNowIntegralApi(row.uid)).then(() => this.getList('')) |
||||
}, |
||||
// 列表 |
||||
getList(num) { |
||||
this.listLoading = true |
||||
this.userFrom.page = num ? num : this.userFrom.page; |
||||
this.userFrom.user_type = this.user_type |
||||
this.userFrom.province = this.address[0] |
||||
this.userFrom.city = this.address[1] |
||||
if (this.userFrom.user_type === '0') this.userFrom.user_type = '' |
||||
userLstApi(this.userFrom).then(res => { |
||||
this.tableData.data = res.data.list |
||||
this.tableData.total = res.data.count |
||||
this.listLoading = false |
||||
this.getCoupounParmas(); |
||||
this.checkedIds = []; |
||||
|
||||
}).catch(res => { |
||||
this.listLoading = false |
||||
this.$message.error(res.message) |
||||
}) |
||||
}, |
||||
pageChange(page) { |
||||
this.userFrom.page = page |
||||
this.getList('') |
||||
}, |
||||
handleSizeChange(val) { |
||||
this.userFrom.limit = val |
||||
this.getList('') |
||||
}, |
||||
// 编辑 |
||||
onEdit(id) { |
||||
this.$modalForm(userUpdateApi(id)).then(() => this.getList('')) |
||||
}, |
||||
// 重置 |
||||
reset() { |
||||
this.userFrom = { |
||||
label_id: '', |
||||
user_type: '', |
||||
sex: '', |
||||
is_promoter: '', |
||||
country: '', |
||||
pay_count: '', |
||||
user_time_type: '', |
||||
user_time: '', |
||||
nickname: '', |
||||
province: '', |
||||
city: '', |
||||
page: 1, |
||||
limit: 20, |
||||
group_id: '' |
||||
} |
||||
this.timeVal=[] |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.check { |
||||
color: #00a2d4; |
||||
} |
||||
.selWidth { |
||||
// width: 100% !important; |
||||
} |
||||
|
||||
.dia { |
||||
/deep/ .el-dialog__body { |
||||
height: 700px !important; |
||||
} |
||||
} |
||||
|
||||
.text-right { |
||||
text-align: right; |
||||
} |
||||
|
||||
.container { |
||||
min-width: 821px; |
||||
|
||||
/deep/.el-form-item { |
||||
width: 100%; |
||||
} |
||||
|
||||
/deep/.el-form-item__content { |
||||
width: 72%; |
||||
} |
||||
} |
||||
|
||||
.vipName { |
||||
color: #dab176 |
||||
} |
||||
|
||||
.el-dropdown-link { |
||||
cursor: pointer; |
||||
color: #409EFF; |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.el-icon-arrow-down { |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.demo-table-expand { |
||||
font-size: 0; |
||||
} |
||||
|
||||
.demo-table-expand label { |
||||
width: 90px; |
||||
color: #99a9bf; |
||||
} |
||||
|
||||
.demo-table-expand .el-form-item { |
||||
margin-right: 0; |
||||
margin-bottom: 0; |
||||
width: 33.33%; |
||||
} |
||||
|
||||
/deep/[type=reset], |
||||
[type=submit], |
||||
button, |
||||
html [type=button] { |
||||
-webkit-appearance: none !important; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,356 @@ |
||||
<template> |
||||
<div> |
||||
<div v-if="psInfo" class="acea-row row-middle"> |
||||
<div class="avatar mr15"><div class="block"><el-avatar :size="50" :src="psInfo.avatar ? psInfo.avatar : moren"></el-avatar></div></div> |
||||
<div class="dashboard-workplace-header-tip"> |
||||
<p class="dashboard-workplace-header-tip-title" v-text="psInfo.nickname || '-'" /> |
||||
<div class="dashboard-workplace-header-tip-desc"> |
||||
<span class="dashboard-workplace-header-tip-desc-sp">余额: {{ psInfo.now_money }}</span> |
||||
<span class="dashboard-workplace-header-tip-desc-sp">总计订单: {{ psInfo.pay_count }}</span> |
||||
<span class="dashboard-workplace-header-tip-desc-sp">总消费金额: {{ psInfo.pay_price }}</span> |
||||
<span class="dashboard-workplace-header-tip-desc-sp">本月订单: {{ psInfo.total_pay_count }}</span> |
||||
<span class="dashboard-workplace-header-tip-desc-sp">本月消费金额: {{ psInfo.total_pay_price }}</span> |
||||
<span v-if="psInfo.is_svip" class="dashboard-workplace-header-tip-desc-sp">会员到期时间: {{ psInfo.svip_endtime }}</span> |
||||
<span v-if="cancelTime" class="dashboard-workplace-header-tip-desc-sp">注销时间: {{ cancelTime }}</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<el-row align="middle" :gutter="10" class="ivu-mt mt20"> |
||||
<el-col :span="4"> |
||||
<el-menu |
||||
default-active="0" |
||||
class="el-menu-vertical-demo" |
||||
@select="changeType" |
||||
> |
||||
<el-menu-item v-for="(item, index) in list" :key="index" :name="item.val" :index="item.val"> |
||||
<span slot="title">{{ item.label }}</span> |
||||
</el-menu-item> |
||||
</el-menu> |
||||
</el-col> |
||||
<el-col :span="20"> |
||||
<el-table v-loading="loading" :data="tableData.data" class="tabNumWidth" :key="type" ref="tabe" size="mini"> |
||||
<el-table-column |
||||
v-for="(item, index) in columns" |
||||
:key="index" |
||||
:prop="item.key" |
||||
:label="item.title" |
||||
width="item.minWidth" |
||||
/> |
||||
<el-table-column v-if="type === '3'" :key="111" label="有效期" min-width="150"> |
||||
<template slot-scope="scope"> |
||||
<span>{{ scope.row ? scope.row.start_time + '-' + scope.row.end_time: '' | filterEmpty}}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column v-if="type === '2'" :key="112" label="上级推荐人头像" min-width="150"> |
||||
<template slot-scope="scope"> |
||||
<div class="demo-image__preview"> |
||||
<el-image style="width: 36px; height: 36px" :src="scope.row.spread&&scope.row.spread.avatar ? scope.row.spread.avatar : moren" :preview-src-list="[scope.row.avatar || moren]" /> |
||||
</div> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<div class="block"> |
||||
<el-pagination |
||||
:page-sizes="[6, 12, 18, 24]" |
||||
:page-size="tableFrom.limit" |
||||
:current-page="tableFrom.page" |
||||
layout="total, sizes, prev, pager, next, jumper" |
||||
:total="tableData.total" |
||||
@size-change="handleSizeChange" |
||||
@current-change="pageChange" |
||||
/> |
||||
</div> |
||||
</el-col> |
||||
</el-row> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
// +---------------------------------------------------------------------- |
||||
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ] |
||||
// +---------------------------------------------------------------------- |
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved. |
||||
// +---------------------------------------------------------------------- |
||||
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权 |
||||
// +---------------------------------------------------------------------- |
||||
// | Author: CRMEB Team <admin@crmeb.com> |
||||
// +---------------------------------------------------------------------- |
||||
import { userOrderApi, userDetailApi, userCouponApi, userBillApi, modifyUserRefLog } from '@/api/user' |
||||
export default { |
||||
name: 'UserDetails', |
||||
props: { |
||||
uid: { |
||||
type: Number, |
||||
default: null |
||||
}, |
||||
cancelTime: { |
||||
type: Number, |
||||
default: null |
||||
} |
||||
}, |
||||
data() { |
||||
return { |
||||
moren: require("@/assets/images/f.png"), |
||||
loading: false, |
||||
columns: [], |
||||
Visible: false, |
||||
list: [ |
||||
{ val: '0', label: '消费记录' }, |
||||
{ val: '3', label: '持有优惠券' }, |
||||
{ val: '4', label: '余额变动' }, |
||||
{ val: '2', label: '推荐人修改记录' } |
||||
], |
||||
tableData: { |
||||
data: [], |
||||
total: 0 |
||||
}, |
||||
tableFrom: { |
||||
page: 1, |
||||
limit: 6 |
||||
}, |
||||
psInfo: null, |
||||
type: '0' |
||||
} |
||||
}, |
||||
mounted() { |
||||
if (this.uid) { |
||||
this.getHeader() |
||||
this.getInfo('0') |
||||
} |
||||
}, |
||||
beforeUpdate(){ |
||||
this.$nextTick(() =>{ |
||||
this.$refs['tabe'].doLayout(); |
||||
}) |
||||
}, |
||||
methods: { |
||||
changeType(key) { |
||||
this.type = key |
||||
this.tableFrom.page = 1 |
||||
this.getInfo(key) |
||||
}, |
||||
getInfo(key) { |
||||
this.loading = true |
||||
switch (key) { |
||||
case '0': |
||||
userOrderApi(this.uid, this.tableFrom).then(res => { |
||||
this.tableData.data = res.data.list |
||||
this.tableData.total = res.data.count |
||||
this.columns = [ |
||||
{ |
||||
title: '订单ID', |
||||
key: 'order_id', |
||||
minWidth: 250 |
||||
}, |
||||
{ |
||||
title: '收货人', |
||||
key: 'real_name', |
||||
minWidth: 90 |
||||
}, |
||||
{ |
||||
title: '商品数量', |
||||
key: 'total_num', |
||||
minWidth: 80 |
||||
}, |
||||
{ |
||||
title: '商品总价', |
||||
key: 'total_price', |
||||
minWidth: 90 |
||||
}, |
||||
{ |
||||
title: '实付金额', |
||||
key: 'pay_price', |
||||
minWidth: 90 |
||||
}, |
||||
{ |
||||
title: '交易完成时间', |
||||
key: 'pay_time', |
||||
minWidth: 160 |
||||
} |
||||
] |
||||
this.loading = false |
||||
}).catch(() => { |
||||
this.loading = false |
||||
}) |
||||
break |
||||
case '2': |
||||
modifyUserRefLog(this.uid, this.tableFrom).then(res => { |
||||
this.tableData.data = res.data.list |
||||
this.tableData.total = res.data.count |
||||
this.columns = [ |
||||
{ |
||||
title: '上级推荐人ID', |
||||
key: 'spread_uid', |
||||
minWidth: 120 |
||||
}, |
||||
{ |
||||
title: '上级推荐人昵称', |
||||
key: 'spread.nickname', |
||||
minWidth: 120 |
||||
}, |
||||
{ |
||||
title: '绑定时间', |
||||
key: 'create_time', |
||||
minWidth: 120 |
||||
} |
||||
] |
||||
this.loading = false |
||||
}).catch(() => { |
||||
this.loading = false |
||||
}) |
||||
break |
||||
case '3': |
||||
userCouponApi(this.uid, this.tableFrom).then(res => { |
||||
this.tableData.data = res.data.list |
||||
this.tableData.total = res.data.count |
||||
this.columns = [ |
||||
{ |
||||
title: '优惠券名称', |
||||
key: 'coupon_title', |
||||
minWidth: 120 |
||||
}, |
||||
{ |
||||
title: '面值', |
||||
key: 'coupon_price', |
||||
minWidth: 120 |
||||
}, |
||||
// { |
||||
// title: '有效期', |
||||
// key: 'add_time', |
||||
// minWidth: 120 |
||||
// }, |
||||
{ |
||||
title: '最低消费额', |
||||
key: 'use_min_price', |
||||
minWidth: 120 |
||||
}, |
||||
{ |
||||
title: '兑换时间', |
||||
key: 'use_time', |
||||
minWidth: 120 |
||||
} |
||||
] |
||||
this.loading = false |
||||
}).catch(() => { |
||||
this.loading = false |
||||
}) |
||||
break |
||||
default: |
||||
userBillApi(this.uid, this.tableFrom).then(res => { |
||||
this.tableData.data = res.data.list |
||||
this.tableData.total = res.data.count |
||||
this.columns = [ |
||||
{ |
||||
title: '变动金额', |
||||
key: 'number', |
||||
minWidth: 90 |
||||
}, |
||||
{ |
||||
title: '变动后', |
||||
key: 'balance', |
||||
minWidth: 90 |
||||
}, |
||||
{ |
||||
title: '类型', |
||||
key: 'title', |
||||
minWidth: 100 |
||||
}, |
||||
{ |
||||
title: '创建时间', |
||||
key: 'create_time', |
||||
minWidth: 150 |
||||
}, |
||||
{ |
||||
title: '备注', |
||||
key: 'mark', |
||||
minWidth: 200 |
||||
} |
||||
] |
||||
this.loading = false |
||||
}).catch(() => { |
||||
this.loading = false |
||||
}) |
||||
} |
||||
}, |
||||
pageChange(page) { |
||||
this.tableFrom.page = page |
||||
this.getInfo(this.type) |
||||
}, |
||||
handleSizeChange(val) { |
||||
this.tableFrom.limit = val |
||||
this.getInfo(this.type) |
||||
}, |
||||
getHeader() { |
||||
userDetailApi(this.uid).then(res => { |
||||
this.psInfo = res.data |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.avatar{ |
||||
width: 60px; |
||||
height: 60px; |
||||
margin-left: 18px; |
||||
img{ |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
.dashboard-workplace { |
||||
&-header { |
||||
&-avatar { |
||||
/*width: 64px;*/ |
||||
/*height: 64px;*/ |
||||
/*border-radius: 50%;*/ |
||||
margin-right: 16px; |
||||
font-weight: 600; |
||||
} |
||||
|
||||
&-tip { |
||||
width: 82%; |
||||
display: inline-block; |
||||
vertical-align: middle; |
||||
margin-top: -12px; |
||||
&-title { |
||||
font-size: 13px; |
||||
color: #000000; |
||||
margin-bottom: 12px; |
||||
} |
||||
|
||||
&-desc { |
||||
&-sp { |
||||
width: 32%; |
||||
color: #17233D; |
||||
font-size: 13px; |
||||
display: inline-block; |
||||
} |
||||
} |
||||
} |
||||
|
||||
&-extra { |
||||
.ivu-col { |
||||
p { |
||||
text-align: right; |
||||
} |
||||
|
||||
p:first-child { |
||||
span:first-child { |
||||
margin-right: 4px; |
||||
} |
||||
|
||||
span:last-child { |
||||
color: #808695; |
||||
} |
||||
} |
||||
|
||||
p:last-child { |
||||
font-size: 22px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue