Skip to content

GitLab

Q
qk_admin
Commit 63781579 authored by yaya's avatar yaya
Browse files
Options

feat:处理会员详情

parent f90cd497
Show whitespace changes
Inline Side-by-side
Showing with 328 additions and 68 deletions
src/api/business/user.js
View file @ 63781579
......@@ -63,11 +63,33 @@ export function listHistory(query) {
params: query
})
}
export function fansList(query) {
export function fansList(data) {
return request({
url: '/history/list',
method: 'get',
params: query
url: '/user/findDetailList',
method: 'post',
data
})
}
export function requestUserDetail(data) {
return request({
url: '/user/findDetail',
method: 'post',
data
})
}
export function updateCollectorPermission(data) {
return request({
url: '/user/updateCollectorPermission',
method: 'post',
data
})
}
export function updateAccountState(data) {
return request({
url: '/user/updateAccountState',
method: 'post',
data
})
}
src/views/user/user.vue
View file @ 63781579
......@@ -6,6 +6,7 @@
<el-input v-model="listQuery.username" clearable size="small" class="filter-item" style="width: 200px;" placeholder="请输入用户名"/>
<el-input v-model="listQuery.mobile" clearable size="small" class="filter-item" style="width: 200px;" placeholder="请输入手机号"/>
<el-button class="filter-item" type="primary" size="mini" icon="el-icon-search" @click="handleFilter">查找</el-button>
<el-button class="filter-item" type="primary" size="mini" @click="handleReset">重置</el-button>
<el-button :loading="downloadLoading" size="mini" class="filter-item" type="warning" icon="el-icon-download" @click="handleDownload">导出</el-button>
</div>
......@@ -17,7 +18,7 @@
<el-table-column align="center" label="手机号码" prop="mobile"/>
<el-table-column align="center" label="性别" prop="gender">
<!-- <el-table-column align="center" label="性别" prop="gender">
<template slot-scope="scope">
{{ genderDic[scope.row.gender] }}
</template>
......@@ -29,18 +30,21 @@
<template slot-scope="scope">
{{ levelDic[scope.row.userLevel] }}
</template>
</el-table-column>
<el-table-column align="center" label="TA的关注" prop="addTime"/>
<el-table-column align="center" label="TA的粉丝" prop="addTime"/>
</el-table-column>-->
<el-table-column align="center" label="角色" prop="userLevelName"/>
<el-table-column align="center" label="TA的关注" prop="followerNum"/>
<el-table-column align="center" label="TA的粉丝" prop="fansNum"/>
<el-table-column align="center" label="创建时间" prop="addTime"/>
<el-table-column align="center" label="状态" prop="status">
<template slot-scope="scope">
{{ statusDic[scope.row.status] }}
</template>
</el-table-column>
<el-table-column align="center" label="操作" width="200" class-name="small-padding fixed-width">
<el-table-column align="center" label="操作" width="350" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button type="primary" size="mini" @click="handleToUserDetail(scope.row)">详情</el-button>
<el-button type="primary" size="mini" style="width: 100px" @click="handleSetUserState(scope.row)">{{ scope.row.userLevel >= 2 ? '关闭藏家权限' : '开通藏家权限' }}</el-button>
<el-button type="danger" size="mini" style="width: 100px" @click="handleSetAccountState(scope.row)">{{ scope.row.status === 1 ? '解封账号' : '冻结账号' }}</el-button>
<!-- <el-button v-permission="['GET /admin/user/detailApprove']" v-if="scope.row.status==0 && scope.row.userLevel==2" type="primary" size="mini" @click="handleDetail(scope.row)">推广代理</el-button>-->
<!-- <el-button v-permission="['POST /admin/user/approveAgency']" v-else-if="scope.row.status==3" type="primary" size="mini" @click="handleApproveAgency(scope.row)">审批</el-button>-->
<!-- <el-button v-permission="['GET /admin/user/detailApprove']" v-else type="info" size="mini" >非代理</el-button>-->
......@@ -52,7 +56,7 @@
<pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
<!-- 详情对话框 -->
<el-dialog :visible.sync="detailDialogVisible" title="代理详情" width="700">
<!-- <el-dialog :visible.sync="detailDialogVisible" title="代理详情" width="700">
<el-form :data="agencyDetail" label-position="left">
<el-form-item label="佣金比例(%)">
<span>{{ agencyDetail.settlementRate }}</span>
......@@ -62,7 +66,7 @@
</el-form-item>
</el-form>
</el-dialog>
<!-- 代理审批 -->
&lt;!&ndash; 代理审批 &ndash;&gt;
<el-dialog :visible.sync="approveDialogVisible" title="代理审批">
<el-form ref="approveForm" :model="approveForm" status-icon label-position="left" label-width="100px" style="width: 400px; margin-left:50px;">
<el-form-item label="佣金比例(%)" prop="settlementRate">
......@@ -73,13 +77,13 @@
<el-button @click="approveDialogVisible = false">取消</el-button>
<el-button type="primary" @click="confirmApprove">确定</el-button>
</div>
</el-dialog>
</el-dialog>-->
</div>
</template>
<script>
import { fetchList, approveAgency, detailApprove } from '@/api/business/user'
import { fetchList, approveAgency, detailApprove, updateCollectorPermission, updateAccountState } from '@/api/business/user'
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
export default {
......@@ -127,6 +131,13 @@ export default {
this.listLoading = false
})
},
handleReset() {
this.listQuery = {
page: 1,
limit: 20
}
this.getList()
},
handleFilter() {
this.listQuery.page = 1
this.getList()
......@@ -156,6 +167,89 @@ export default {
handleToUserDetail(row) {
this.$router.push({ path: '/user/userDetail', query: { id: row.id }})
},
handleSetUserState(row) {
const tip = row.userLevel >= 2 ? '是否要关闭当前用户的藏家功能权限？' : '是否为当前用户开通藏家功能权限？'
const successTip = row.userLevel >= 2 ? '关闭成功' : '开通成功'
this.$confirm(tip, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const params = {
id: row.id,
flag: row.userLevel >= 2 ? 0 : 1
}
// userLevel： 0 普通用 1： 分销商 2 藏家 3分销商&藏家
updateCollectorPermission(params).then(response => {
this.list = this.list.filter((item) => {
if (item.id === row.id) {
if (row.userLevel === 0) {
item.userLevel = 2
item.userLevelName = '藏家'
} else if (row.userLevel === 1) {
item.userLevel = 3
item.userLevelName = '分销商、藏家'
} else if (row.userLevel === 2) {
item.userLevel = 0
item.userLevelName = '普通用户'
} else if (row.userLevel === 3) {
item.userLevel = 1
item.userLevelName = '分销商'
}
return item
}
return item
})
this.$notify.success({
message: successTip
})
}).catch((e) => {
this.$notify({
title: '提示',
message: e.message || '请求失败， 请重试',
type: 'warning'
})
})
})
},
/**
* 修改用户状态
* @param row
*/
handleSetAccountState(row) {
const tip = row.status === 1 ? '是否要解封当前用户的账号？' : '是否要冻结当前用户的账号？'
const successTip = row.status === 1 ? '解封成功' : '冻结成功'
this.$confirm(tip, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const params = {
id: row.id,
status: row.status === 1 ? 0 : 1
}
updateAccountState(params).then(response => {
this.list = this.list.filter((item) => {
if (item.id === row.id) {
item.status = row.status === 1 ? 0 : 1
return item
}
return item
})
this.$notify.success({
message: successTip
})
}).catch((e) => {
console.log('===报错=', e)
this.$notify({
title: '提示',
message: e.message || '请求失败， 请重试',
type: 'warning'
})
})
})
},
confirmApprove() {
this.$refs['approveForm'].validate((valid) => {
if (valid) {
......
src/views/user/userDetail.vue
View file @ 63781579
<template>
<div class="page_userDetail">
<div class="detail_button">
<el-button size="mini" class="filter-item" type="primary" @click="handleOpen">开通藏家权限</el-button>
<div v-if="userDetail && userDetail.id" class="detail_button">
<!-- <el-button size="mini" class="filter-item" type="primary" @click="handleOpen">开通藏家权限</el-button>-->
<el-button type="primary" size="mini" style="width: 100px" @click="handleSetUserState">
{{ userDetail.userLevel >= 2 ? '关闭藏家权限' : '开通藏家权限' }}
</el-button>
<el-button type="danger" size="mini" style="width: 100px" @click="handleSetAccountState">
{{ userDetail.status === 1 ? '解封账号' : '冻结账号' }}
</el-button>
</div>
<el-card class="box-card" style="margin: 16px">
<el-card class="box-card" style="margin: 0 16px">
<h3>用户信息</h3>
<div class="user_info flex" >
<div class="user_info flex">
<el-form ref="addInviteRef" label-width="100px" style="width: 33%">
<el-form-item label="用户ID：">
<div>97989</div>
</el-form-item>
<el-form-item label="性别：">
<div>97989</div>
<div>{{ userDetail.id || '-' }}</div>
</el-form-item>
<el-form-item label="角色：">
<div>97989</div>
<div>{{ userDetail.userLevelName || '-' }}</div>
</el-form-item>
</el-form>
<el-form ref="addInviteRef" label-width="100px" style="width: 33%">
<el-form-item label="用户名：">
<div>97989</div>
</el-form-item>
<el-form-item label="生日：">
<div>97989</div>
<div>{{ userDetail.nickname || '-' }}</div>
</el-form-item>
<el-form-item label="创建时间：">
<div>97989</div>
<div>{{ userDetail.addTime || '-' }}</div>
</el-form-item>
</el-form>
<el-form ref="addInviteRef" label-width="100px" style="width: 33%">
<el-form-item label="手机号：">
<div>97989</div>
</el-form-item>
<el-form-item label="用户等级：">
<div>97989</div>
<div>{{ userDetail.mobile || '-' }}</div>
</el-form-item>
<el-form-item label="状态：">
<div>97989</div>
<div>{{ userDetail.statusName || '-' }}</div>
</el-form-item>
</el-form>
</div>
</el-card>
<el-card class="box-card" style="margin: 16px;flex: 1">
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
<el-card :style="{'margin': '16px','height': list.length < 5 ? '500px' : '1000px'}" class="box-card">
<el-menu :default-active="defaultActive" class="el-menu-demo" mode="horizontal" @select="handleSelect">
<el-menu-item index="1">TA的关注</el-menu-item>
<el-menu-item index="2">TA的粉丝</el-menu-item>
<el-menu-item index="3">TA的分享</el-menu-item>
</el-menu>
<div class="filter-item__category">
<div v-for="item in categoryList" :key="item.name" :class="{active: item.name === listQuery.category}" class="filter-item__category__content" @click="handlerSelectCateGory(item.name)">
<div v-if="defaultActive === '3'" class="filter-item__category">
<div
v-for="item in shareList"
:key="item.name"
:class="{active: item.shareType === listQuery.shareType}"
class="filter-item__category__content"
@click="handlerSelectCateGory(item.shareType)">
{{ item.name }}
</div>
</div>
<el-table
v-loading="listLoading"
v-if="defaultActive !== '3'"
:data="list"
:fit="true"
:height="list.length < 5 ? 400 : 900"
size="small"
style="margin-top: 20px"
style="margin-top: 20px; padding-bottom: 20px"
element-loading-text="正在查询中..."
border
fit
highlight-current-row>
<el-table-column align="center" width="100px" label="邀请码ID" prop="id" sortable />
<el-table-column align="center" label="邀请码" prop="code" />
<el-table-column align="center" width="100px" label="用户ID" prop="id" />
<el-table-column align="center" label="用户名" prop="nickname" />
<el-table-column align="center" label="手机号码" prop="mobile" />
<el-table-column align="center" label="创建时间" prop="createTime" />
<el-table-column align="center" label="可邀请人数" prop="enabledNum" />
<el-table-column align="center" label="使用人数" prop="usedNum"/>
</el-table>
<el-table
v-loading="listLoading"
v-if="defaultActive === '3'"
:data="list"
:fit="true"
:height="list.length < 5 ? 400 : 900"
size="small"
style="margin-top: 20px; padding-bottom: 20px"
element-loading-text="正在查询中..."
border
highlight-current-row>
<el-table-column align="center" label="状态" prop="stateName" />
<el-table-column align="center" label="分享类型" prop="shareTypeName" />
<el-table-column align="center" label="分享内容" prop="shareContent" >
<template slot-scope="scope">
<Line2Hidden :text="scope.row.shareContent || '-'" />
</template>
</el-table-column>
<el-table-column align="center" label="分享时间" prop="shareTime" />
</el-table>
</el-card>
<div class="pagination_bottom">
<Pagination
v-show="total>0"
:total="total"
:page.sync="listQuery.page"
:limit.sync="listQuery.limit"
layout="total, prev, pager, next, jumper"
@pagination="getList" />
</el-card>
</div>
</div>
</template>
<script>
import Pagination from '@/components/Pagination'
import { fansList } from '@/api/business/user'
import { fansList, requestUserDetail, updateCollectorPermission, updateAccountState } from '@/api/business/user'
import Line2Hidden from '@/components/line2Hidden'
export default {
name: 'UserDetail',
components: {
Pagination
Pagination,
Line2Hidden
},
data() {
return {
categoryList: [
shareList: [
{
name: '藏家藏品'
name: '藏家藏品',
shareType: 1
},
{
name: '藏家藏馆'
name: '藏家藏馆',
shareType: 2
},
{
name: '平台藏品'
name: '平台藏品',
shareType: 3
}
],
activeIndex: '1',
listLoading: true,
listQuery: {
page: 1,
limit: 20
limit: 20,
listType: 1,
shareType: 1
},
list: [],
total: 0
total: 0,
defaultActive: '1',
userDetail: {},
userId: ''
}
},
created() {
const userId = this.$route.query.id
if (!userId) {
return
}
this.userId = userId
this.getDetail()
this.getList()
},
......@@ -124,31 +161,48 @@ export default {
/**
* 分享类型选择
*/
handlerSelectCateGory(categoryStr) {
if (categoryStr === this.listQuery.category) {
handlerSelectCateGory(value) {
if (value === this.listQuery.shareType) {
return
}
this.listQuery.page = 1
this.listQuery.category = categoryStr
this.listQuery.shareType = Number(value)
this.getList()
},
/**
* Tab选择
*/
handleSelect() {
handleSelect(value) {
if (this.defaultActive === value) {
return
}
this.defaultActive = value
this.listQuery.page = 1
this.listQuery.listType = Number(value)
this.getList()
},
/**
* 开通藏家权限
*/
handleOpen() {
},
/**
* 获取详情
*/
getDetail() {
requestUserDetail({ id: this.userId || '' }).then(response => {
this.userDetail = response.data.data
}).catch((e) => {
})
},
/**
* 获取列表数据
*/
getList() {
this.listLoading = true
// this.listQuery.id = this.userId
fansList(this.listQuery).then(response => {
this.list = response.data.data.dataList
this.total = response.data.data.total
......@@ -158,6 +212,79 @@ export default {
this.total = 0
this.listLoading = false
})
},
handleSetUserState() {
if (!this.userDetail || !this.userDetail.id) {
return
}
const tip = this.userDetail.userLevel >= 2 ? '是否要关闭当前用户的藏家功能权限？' : '是否为当前用户开通藏家功能权限？'
const successTip = this.userDetail.userLevel >= 2 ? '关闭成功' : '开通成功'
this.$confirm(tip, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const params = {
id: this.userDetail.id,
flag: this.userDetail.userLevel >= 2 ? 0 : 1
}
// userLevel： 0 普通用 1： 分销商 2 藏家 3分销商&藏家
updateCollectorPermission(params).then(response => {
if (this.userDetail.userLevel === 0) {
this.userDetail.userLevel = 2
this.userDetail.userLevelName = '藏家'
} else if (this.userDetail.userLevel === 1) {
this.userDetail.userLevel = 3
this.userDetail.userLevelName = '分销商、藏家'
} else if (this.userDetail.userLevel === 2) {
this.userDetail.userLevel = 0
this.userDetail.userLevelName = '普通用户'
} else if (this.userDetail.userLevel === 3) {
this.userDetail.userLevel = 1
this.userDetail.userLevelName = '分销商'
}
this.$notify.success({
message: successTip
})
}).catch((e) => {
this.$notify({
title: '提示',
message: e.message || '请求失败， 请重试',
type: 'warning'
})
})
})
},
/**
* 修改用户状态
* @param this.userDetail
*/
handleSetAccountState() {
const tip = this.userDetail.status === 1 ? '是否要解封当前用户的账号？' : '是否要冻结当前用户的账号？'
const successTip = this.userDetail.status === 1 ? '解封成功' : '冻结成功'
this.$confirm(tip, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const params = {
id: this.userDetail.id,
status: this.userDetail.status === 1 ? 0 : 1
}
updateAccountState(params).then(response => {
this.userDetail.status = this.userDetail.status === 1 ? 0 : 1
this.$notify.success({
message: successTip
})
}).catch((e) => {
console.log('===报错=', e)
this.$notify({
title: '提示',
message: e.message || '请求失败， 请重试',
type: 'warning'
})
})
})
}
}
}
......@@ -165,21 +292,34 @@ export default {
<style lang="scss" scoped>
.page_userDetail {
height: 100vh;
display: flex;
flex-direction: column;
height: 100%;
margin-bottom: 100px;
.pagination_bottom {
width: calc(100% - 60px);
position: fixed;
bottom: 0;
padding-bottom: 20px;
padding-right: 30px;
background: white;
margin: 0 24px;
z-index: 1000;
}
.detail_button {
text-align: end;
margin: 16px;
}
.user_info {
padding-bottom: 10px;
}
.filter-item__category {
display: flex;
flex-direction: row;
align-items: center;
margin-top: 20px;
.filter-item__category__content {
background-color: white;
display: inline-block;
......@@ -190,20 +330,23 @@ export default {
color: #606266;
border-radius: 4px;
box-sizing: border-box;
border: 0px solid rgba(64,158,255,.2);
border: 0px solid rgba(64, 158, 255, .2);
white-space: nowrap;
&.active {
border: 1px solid rgba(64,158,255,.2);
border: 1px solid rgba(64, 158, 255, .2);
color: #409eff;
background-color: rgba(64,158,255,.1);
background-color: rgba(64, 158, 255, .1);
//background-color: #1890ff;
}
}
.info {
display: flex;
flex-direction: row;
}
.info_image {
width: 40px;
height: 40px;
......@@ -215,6 +358,7 @@ export default {
/deep/ .el-card__body {
padding: 0 12px;
}
/deep/ .el-form-item {
margin-bottom: 0;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment