Files
cai-ui/src/views/cai/userMember/add-member-dialog.vue
dute7liang 1e7924706e init
2024-01-22 01:45:11 +08:00

118 lines
3.4 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<el-dialog :title="title" :close-on-click-modal="false" :visible.sync="open" width="700px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="开通会员" prop="memberPriceId">
<el-select v-model="form.memberPriceId" placeholder="开通会员" clearable size="small">
<el-option
v-for="dict in memberPriceList"
:key="dict.id"
:label="dict.name"
:value="dict.id"
/>
</el-select>
</el-form-item>
<el-form-item :label="systemName+'号'" prop="usercode">
<el-autocomplete
class="inline-input"
v-model="form.usercode"
:fetch-suggestions="querySearch"
placeholder="请输入内容"
@select="handleSelect"
></el-autocomplete>
</el-form-item>
<el-form-item label="昵称" v-if="info.nickname">
{{ info.nickname }} {{ info.usercode }}
</el-form-item>
<el-form-item label="头像" v-if="info.avatar">
<image-avatar :src="info.avatar"/>
</el-form-item>
<el-form-item>
注意若用户已是会员再次设置时将会使用最新的会员信息
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm"> </el-button>
<el-button @click="open = false"> </el-button>
</div>
</el-dialog>
</template>
<script>
import {getUserByUsercode, listUserByUserCode} from "@/api/cai/user";
import { listMemberPrice } from '@/api/cai/memberPrice'
import { addUserMember } from '@/api/cai/userMember'
export default {
components: {
},
data () {
return {
systemName: process.env.VUE_APP_SYSTEM_HOME,
open: false,
title: '',
form:{
usercode: undefined,
memberPriceId: undefined
},
info:{
},
memberPriceList:[],
// 表单校验
rules: {
usercode: [
{ required: true, message: "数据不能为空", trigger: "blur" }
],
memberPriceId: [
{ required: true, message: "数据不能为空", trigger: "blur" }
],
},
buttonLoading: false,
}
},
created() {
listMemberPrice().then(response=> {
this.memberPriceList = response.rows
})
},
methods: {
init () {
this.open = true;
this.title = "新增会员"
this.info = {};
this.form.usercode = undefined
},
querySearch(querySearch,cb){
listUserByUserCode(querySearch).then(res => {
cb(res.data.map((terminal) => {
return {
value: terminal,
name: terminal,
};
}))
})
},
handleSelect(item){
getUserByUsercode(item.value).then(res => {
this.info = res.data
})
},
// 表单提交
submitForm () {
this.$refs['form'].validate((valid) => {
if (valid) {
this.buttonLoading = true;
addUserMember(this.form).then(data => {
this.$modal.msgSuccess("新增工会成功");
this.buttonLoading = false;
this.open = false
this.$emit('refreshDataList')
}).finally(() => {
this.buttonLoading = false;
});
}
})
},
}
}
</script>