feat: 添加积分日志页面
- 新增积分日志列表页面 src/views/user/integral/index.vue - 新增积分相关 API src/api/integral.js - 在路由中添加积分日志菜单
This commit is contained in:
scott
23
backend-adminend/src/api/integral.js
Normal file
23
backend-adminend/src/api/integral.js
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Copyright (c) 2016~2025 https://www.crmeb.com All rights reserved.
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Author: CRMEB Team <admin@crmeb.com>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
|
||||||
|
import request from '@/utils/request';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 积分记录分页列表
|
||||||
|
* @param data
|
||||||
|
*/
|
||||||
|
export function integralListApi(data) {
|
||||||
|
return request({
|
||||||
|
url: '/admin/user/integral/list',
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
@@ -44,6 +44,12 @@ const userRouter = {
|
|||||||
name: 'Group',
|
name: 'Group',
|
||||||
meta: { title: '用户分组', icon: '' },
|
meta: { title: '用户分组', icon: '' },
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'integral',
|
||||||
|
component: () => import('@/views/user/integral/index'),
|
||||||
|
name: 'IntegralLog',
|
||||||
|
meta: { title: '积分日志', icon: '', noCache: true },
|
||||||
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
241
backend-adminend/src/views/user/integral/index.vue
Normal file
241
backend-adminend/src/views/user/integral/index.vue
Normal file
@@ -0,0 +1,241 @@
|
|||||||
|
<template>
|
||||||
|
<div class="divBox">
|
||||||
|
<el-card class="box-card">
|
||||||
|
<div slot="header" class="clearfix">
|
||||||
|
<div class="container">
|
||||||
|
<el-form inline size="small" :model="searchForm" ref="searchForm" label-width="80px">
|
||||||
|
<el-row>
|
||||||
|
<el-col :xs="24" :sm="24" :md="18" :lg="18" :xl="18">
|
||||||
|
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
|
||||||
|
<el-form-item label="用户搜索：">
|
||||||
|
<el-input v-model="searchForm.keywords" placeholder="请输入用户昵称或ID" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
|
||||||
|
<el-form-item label="用户ID：">
|
||||||
|
<el-input-number v-model="searchForm.uid" placeholder="请输入用户ID" :min="1" :controls="false" style="width: 100%" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
|
||||||
|
<el-form-item label="时间选择：">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="timeVal"
|
||||||
|
type="daterange"
|
||||||
|
align="right"
|
||||||
|
unlink-panels
|
||||||
|
value-format="yyyy-MM-dd"
|
||||||
|
format="yyyy-MM-dd"
|
||||||
|
range-separator="至"
|
||||||
|
start-placeholder="开始日期"
|
||||||
|
end-placeholder="结束日期"
|
||||||
|
:picker-options="pickerOptions"
|
||||||
|
@change="onchangeTime"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="24" :md="6" :lg="6" :xl="6" class="text-right">
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" icon="el-icon-search" @click="handleSearch">搜索</el-button>
|
||||||
|
<el-button @click="handleReset">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-table
|
||||||
|
v-loading="listLoading"
|
||||||
|
:data="tableData.data"
|
||||||
|
style="width: 100%"
|
||||||
|
size="mini"
|
||||||
|
highlight-current-row
|
||||||
|
>
|
||||||
|
<el-table-column prop="id" label="ID" min-width="80" />
|
||||||
|
<el-table-column prop="uid" label="用户ID" min-width="80" />
|
||||||
|
<el-table-column prop="nickName" label="用户昵称" min-width="120" show-overflow-tooltip>
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ scope.row.nickName || '-' }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="title" label="标题" min-width="150" show-overflow-tooltip />
|
||||||
|
<el-table-column prop="integral" label="积分变动" min-width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-tag :type="scope.row.type === 1 ? 'success' : 'danger'" size="small">
|
||||||
|
{{ scope.row.type === 1 ? '+' : '-' }}{{ scope.row.integral }}
|
||||||
|
</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="balance" label="剩余积分" min-width="100" />
|
||||||
|
<el-table-column prop="type" label="类型" min-width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-tag :type="scope.row.type === 1 ? 'success' : 'danger'" size="small">
|
||||||
|
{{ scope.row.type === 1 ? '增加' : '扣减' }}
|
||||||
|
</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="linkType" label="关联类型" min-width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-tag size="small" effect="plain">
|
||||||
|
{{ linkTypeFilter(scope.row.linkType) }}
|
||||||
|
</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="status" label="状态" min-width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-tag :type="statusTypeFilter(scope.row.status)" size="small">
|
||||||
|
{{ statusFilter(scope.row.status) }}
|
||||||
|
</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="mark" label="备注" min-width="150" show-overflow-tooltip>
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ scope.row.mark || '-' }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="createTime" label="创建时间" min-width="150" />
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<div class="block">
|
||||||
|
<el-pagination
|
||||||
|
:page-sizes="[15, 30, 45, 60]"
|
||||||
|
:page-size="searchForm.limit"
|
||||||
|
:current-page="searchForm.page"
|
||||||
|
layout="total, sizes, prev, pager, next, jumper"
|
||||||
|
:total="tableData.total"
|
||||||
|
@size-change="handleSizeChange"
|
||||||
|
@current-change="handleCurrentChange"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { integralListApi } from '@/api/integral';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'IntegralLog',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
listLoading: true,
|
||||||
|
tableData: {
|
||||||
|
data: [],
|
||||||
|
total: 0,
|
||||||
|
},
|
||||||
|
searchForm: {
|
||||||
|
keywords: '',
|
||||||
|
uid: null,
|
||||||
|
dateLimit: '',
|
||||||
|
page: 1,
|
||||||
|
limit: 15,
|
||||||
|
},
|
||||||
|
timeVal: [],
|
||||||
|
pickerOptions: this.$timeOptions,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取列表
|
||||||
|
getList() {
|
||||||
|
this.listLoading = true;
|
||||||
|
const params = {
|
||||||
|
...this.searchForm,
|
||||||
|
};
|
||||||
|
// 移除空值
|
||||||
|
if (!params.keywords) delete params.keywords;
|
||||||
|
if (!params.uid) delete params.uid;
|
||||||
|
if (!params.dateLimit) delete params.dateLimit;
|
||||||
|
|
||||||
|
integralListApi(params)
|
||||||
|
.then((res) => {
|
||||||
|
this.tableData.data = res.list || [];
|
||||||
|
this.tableData.total = res.total || 0;
|
||||||
|
this.listLoading = false;
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
this.listLoading = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
handleSearch() {
|
||||||
|
this.searchForm.page = 1;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
// 重置
|
||||||
|
handleReset() {
|
||||||
|
this.searchForm = {
|
||||||
|
keywords: '',
|
||||||
|
uid: null,
|
||||||
|
dateLimit: '',
|
||||||
|
page: 1,
|
||||||
|
limit: 15,
|
||||||
|
};
|
||||||
|
this.timeVal = [];
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
// 时间选择
|
||||||
|
onchangeTime(e) {
|
||||||
|
this.timeVal = e;
|
||||||
|
this.searchForm.dateLimit = e ? e.join(',') : '';
|
||||||
|
},
|
||||||
|
// 分页大小变化
|
||||||
|
handleSizeChange(val) {
|
||||||
|
this.searchForm.limit = val;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
// 页码变化
|
||||||
|
handleCurrentChange(val) {
|
||||||
|
this.searchForm.page = val;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
// 关联类型过滤器
|
||||||
|
linkTypeFilter(type) {
|
||||||
|
const typeMap = {
|
||||||
|
order: '订单',
|
||||||
|
sign: '签到',
|
||||||
|
system: '系统',
|
||||||
|
};
|
||||||
|
return typeMap[type] || type || '-';
|
||||||
|
},
|
||||||
|
// 状态过滤器
|
||||||
|
statusFilter(status) {
|
||||||
|
const statusMap = {
|
||||||
|
1: '订单创建',
|
||||||
|
2: '冻结期',
|
||||||
|
3: '完成',
|
||||||
|
4: '失效',
|
||||||
|
};
|
||||||
|
return statusMap[status] || '未知';
|
||||||
|
},
|
||||||
|
// 状态样式过滤器
|
||||||
|
statusTypeFilter(status) {
|
||||||
|
const typeMap = {
|
||||||
|
1: 'info',
|
||||||
|
2: 'warning',
|
||||||
|
3: 'success',
|
||||||
|
4: 'danger',
|
||||||
|
};
|
||||||
|
return typeMap[status] || 'info';
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.text-right {
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.block {
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-input,
|
||||||
|
.el-date-picker {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user