Files
dvcp_v2_webapp/project/tianfuxing/AppUserList/AppUserList.vue
2022-11-15 15:26:23 +08:00

155 lines
4.5 KiB
Vue

<template>
<section class="AppUserList">
<ai-list>
<ai-title slot="title" title="用户管理" isShowBottomBorder />
<template #content>
<ai-search-bar>
<template #right>
<el-input v-model="search.realName" class="search-input" size="small" placeholder="请输入姓名/手机号" clearable @change="getList" @clear="page.current = 1, (search.realName = ''), getList()" suffix-icon="iconfont iconSearch">
</el-input>
</template>
</ai-search-bar>
<ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size" @getList="getList" :col-configs="colConfigs"
:dict="dict" @sort-change="sortChange">
<el-table-column slot="options" label="操作" fixed="right" align="center">
<template slot-scope="{ row }">
<el-button type="text" @click.native="changeIntegral(row)">调整积分</el-button>
</template>
</el-table-column>
</ai-table>
<ai-dialog
title="调整积分"
:visible.sync="dialog"
:destroyOnClose="true"
width="720px"
@onConfirm="onConfirm"
@closed="form={}">
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="类型" prop="calcType">
<ai-select v-model="form.calcType" :selectList="dict.getDict('integralCalcType')"/>
</el-form-item>
<el-form-item label="积分" prop="integral">
<el-input v-model.trim="form.integral" placeholder="请输入正数" size="small"></el-input>
</el-form-item>
</el-form>
</ai-dialog>
</template>
</ai-list>
</section>
</template>
<script>
import { mapState } from 'vuex'
export default {
name: "AppUserList",
label: "用户管理",
props: {
instance: Function,
dict: Object,
},
data () {
return {
search: {
realName: '',
},
page: {
current: 1,
size: 10,
total: 0,
},
tableData: [],
dialog: false,
form: {
calcType: '',
integral: '',
},
orderType: ''
}
},
created () {
this.$dict.load('integralCalcType').then(()=> {
this.getList()
})
},
computed: {
...mapState(['user']),
colConfigs() {
return [
{prop: "realName", label: "用户", align: "left"},
{prop: "phone", label: "手机号", align: "center"},
{prop: "levelTitle", label: "等级", align: "center"},
{prop: "integral", label: "积分数量", align: "center", sortable: "custom"},
{slot: "options"},
]
},
rules() {
return {
calcType: [{required: true, message: '请选择类型', trigger: 'change'}],
integral: [{required: true, message: '请输入积分', trigger: 'blur' },
{pattern: /^([1-9]\d*|0)(\.\d{1,2})?$/, message: '请输入正数且最多只能保留两位小数'}],
}
},
},
methods: {
sortChange(col) {
console.log(col.order)
if(col.order === 'ascending') {
this.orderType = 0
} else if(col.order === 'descending') {
this.orderType = 1
} else if(col.order === null) {
this.orderType = ''
}
this.page.current = 1
this.getList()
},
changeIntegral(row) {
this.dialog = true
this.form.openId = row.openId
},
onConfirm() {
this.$refs.form.validate((valid)=> {
if(valid) {
this.flag = true
this.instance.post(`api/appwechatintegraldetail/addOrUpdate`, {
calcType: this.form.calcType,
integral: this.form.integral,
openId: this.form.openId,
createUserId: this.user.info.id,
createUserName: this.user.info.name
}).then(res => {
if(res?.code == 0) {
this.flag = false
this.$message.success('调整积分成功')
this.dialog = false
this.getList()
}
})
}
})
},
getList() {
this.instance.post(`api/appwechatuser/list`,null,{
params: {
...this.page,
...this.search,
orderType: this.orderType
}
}).then(res=> {
if(res?.data) {
this.tableData = res.data.records
this.page.total = res.data.total
}
})
},
}
}
</script>
<style lang="scss" scoped>
.AppUserList {
height: 100%;
}
</style>