155 lines
		
	
	
		
			4.5 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			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>
 |