Changes Update User
This commit is contained in:
@@ -1,91 +1,125 @@
|
||||
<template>
|
||||
<div class="px-3">
|
||||
<div class="field is-horizontal">
|
||||
<div class="field-body">
|
||||
<div class="field">
|
||||
<label class="label">Username<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="" v-model="username">
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find(v=>v.name==='username')">{{errors.find(v=>v.name==='username').text}}</p>
|
||||
<p class="help is-primary" v-else-if="info">{{info}}</p>
|
||||
</div>
|
||||
<div class="field" v-if="!dealer">
|
||||
<label class="label">Account type<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<SearchBox v-bind="{api:'usertype', field:'name', column:['name'], first:true, position: 'top'}"
|
||||
@option="selected('_type', $event)"></SearchBox>
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find(v=>v.name==='type')">{{errors.find(v=>v.name==='type').text}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field is-horizontal mt-4">
|
||||
<div class="field-body">
|
||||
<div class="field">
|
||||
<label class="label">Full name<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="" v-model="fullname">
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find(v=>v.name==='fullname')">{{errors.find(v=>v.name==='fullname').text}}</p>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label">Email<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="" v-model="email">
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find(v=>v.name==='email')">{{errors.find(v=>v.name==='email').text}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field is-horizontal mt-4">
|
||||
<div class="field-body">
|
||||
<div class="field">
|
||||
<label class="label">Password<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="field has-addons">
|
||||
<p class="control is-expanded">
|
||||
<input class="input" :type="showpass? 'text' : 'password'" placeholder="At least 6 characters including letters and numbers." v-model="password">
|
||||
</p>
|
||||
<div class="control">
|
||||
<a class="button" @click="showpass=!showpass">
|
||||
<SvgIcon v-bind="{name: 'eye-off.svg', type: 'dark', size: 22}" v-if="showpass"></SvgIcon>
|
||||
<SvgIcon v-bind="{name: 'view.svg', type: 'dark', size: 22}" v-else></SvgIcon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find(v=>v.name==='password')">{{errors.find(v=>v.name==='password').text}}</p>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label">Retype password<b class="ml-1 has-text-danger">*</b></label>
|
||||
<p class="control is-expanded">
|
||||
<input class="input" :type="showpass? 'text' : 'password'" placeholder="" v-model="retypePassword">
|
||||
</p>
|
||||
<div class="px-3">
|
||||
<div class="field is-horizontal">
|
||||
<div class="field-body">
|
||||
<div class="field">
|
||||
<label class="label"
|
||||
>{{ isVietnamese ? 'Tên tài khoản' : 'Username' }}<b class="ml-1 has-text-danger">*</b></label
|
||||
>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="" v-model="username" />
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find((v) => v.name === 'username')">
|
||||
{{ errors.find((v) => v.name === 'username').text }}
|
||||
</p>
|
||||
<p class="help is-primary" v-else-if="info">{{ info }}</p>
|
||||
</div>
|
||||
<div class="field" v-if="!dealer">
|
||||
<label class="label"
|
||||
>{{ isVietnamese ? 'Loại tài khoản' : 'Account type' }}<b class="ml-1 has-text-danger">*</b></label
|
||||
>
|
||||
<div class="control">
|
||||
<SearchBox
|
||||
v-bind="{ api: 'usertype', field: 'name', column: ['name'], first: true, position: 'top' }"
|
||||
@option="selected('_type', $event)"
|
||||
></SearchBox>
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find((v) => v.name === 'type')">
|
||||
{{ errors.find((v) => v.name === 'type').text }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find(v=>v.name==='retypePassword')">{{errors.find(v=>v.name==='retypePassword').text}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-5 pt-2">
|
||||
<button :class="`button is-primary has-text-white ${ loading? 'is-loading' : ''}`" @click="createAccount()" v-if="enable">Tạo tài khoản</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field is-horizontal mt-4">
|
||||
<div class="field-body">
|
||||
<div class="field">
|
||||
<label class="label"
|
||||
>{{ isVietnamese ? 'Họ và tên' : 'Full name' }}<b class="ml-1 has-text-danger">*</b></label
|
||||
>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="" v-model="fullname" />
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find((v) => v.name === 'fullname')">
|
||||
{{ errors.find((v) => v.name === 'fullname').text }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label">{{ isVietnamese ? 'Email' : 'Email' }}<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="" v-model="email" />
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find((v) => v.name === 'email')">
|
||||
{{ errors.find((v) => v.name === 'email').text }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field is-horizontal mt-4">
|
||||
<div class="field-body">
|
||||
<div class="field">
|
||||
<label class="label">{{ isVietnamese ? 'Mật khẩu' : 'Password' }}<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="field has-addons">
|
||||
<p class="control is-expanded">
|
||||
<input
|
||||
class="input"
|
||||
:type="showpass ? 'text' : 'password'"
|
||||
placeholder="At least 6 characters including letters and numbers."
|
||||
v-model="password"
|
||||
/>
|
||||
</p>
|
||||
<div class="control">
|
||||
<a class="button" @click="showpass = !showpass">
|
||||
<SvgIcon v-bind="{ name: 'eye-off.svg', type: 'dark', size: 22 }" v-if="showpass"></SvgIcon>
|
||||
<SvgIcon v-bind="{ name: 'view.svg', type: 'dark', size: 22 }" v-else></SvgIcon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find((v) => v.name === 'password')">
|
||||
{{ errors.find((v) => v.name === 'password').text }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label"
|
||||
>{{ isVietnamese ? 'Nhập lại mật khẩu' : 'Retype password' }}<b class="ml-1 has-text-danger">*</b></label
|
||||
>
|
||||
<p class="control is-expanded">
|
||||
<input class="input" :type="showpass ? 'text' : 'password'" placeholder="" v-model="retypePassword" />
|
||||
</p>
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.find((v) => v.name === 'retypePassword')">
|
||||
{{ errors.find((v) => v.name === 'retypePassword').text }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-5 pt-2">
|
||||
<button
|
||||
:class="`button is-primary has-text-white ${loading ? 'is-loading' : ''}`"
|
||||
@click="createAccount()"
|
||||
v-if="enable"
|
||||
>
|
||||
{{ isVietnamese ? 'Tạo tài khoản' : 'Create account' }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { useStore } from '~/stores/index'
|
||||
import { useStore } from '~/stores/index';
|
||||
export default {
|
||||
setup() {
|
||||
const store = useStore()
|
||||
return {store}
|
||||
const store = useStore();
|
||||
return { store };
|
||||
},
|
||||
props: ['pagename', 'row', 'api', 'dealer'],
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
isVietnamese: this.$isVietnamese(),
|
||||
fullname: undefined,
|
||||
username: undefined,
|
||||
email: undefined,
|
||||
password: undefined,
|
||||
retypePassword: undefined,
|
||||
errors: [],
|
||||
info: 'User name must not contain any spaces.',
|
||||
info: undefined,
|
||||
showpass: true,
|
||||
hash: undefined,
|
||||
status: undefined,
|
||||
@@ -97,140 +131,175 @@ export default {
|
||||
check: {},
|
||||
branchOpt: undefined,
|
||||
enable: true,
|
||||
loading: false
|
||||
}
|
||||
loading: false,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
if(!this.row) return
|
||||
this.fullname = this.row.fullname
|
||||
this.email = this.row.email
|
||||
if(this.row.code) this.username = this.row.code.toLocaleLowerCase()
|
||||
if (!this.row) return;
|
||||
this.fullname = this.row.fullname;
|
||||
this.email = this.row.email;
|
||||
if (this.row.code) this.username = this.row.code.toLocaleLowerCase();
|
||||
},
|
||||
mounted() {
|
||||
let pass = this.$id().toLocaleLowerCase()
|
||||
this.password = pass
|
||||
this.retypePassword = pass
|
||||
window.addEventListener("keyup", (ev) => ev.key==='Enter' && this.$route.name==='signup'? this.createAccount() : false)
|
||||
let pass = this.$id().toLocaleLowerCase();
|
||||
this.password = pass;
|
||||
this.retypePassword = pass;
|
||||
window.addEventListener('keyup', (ev) =>
|
||||
ev.key === 'Enter' && this.$route.name === 'signup' ? this.createAccount() : false,
|
||||
);
|
||||
},
|
||||
computed: {
|
||||
registermethod: {
|
||||
get: function() {return this.store.registermethod},
|
||||
set: function(val) {this.$store.commit("updateRegisterMethod", {registermethod: val})}
|
||||
get: function () {
|
||||
return this.store.registermethod;
|
||||
},
|
||||
set: function (val) {
|
||||
this.$store.commit('updateRegisterMethod', { registermethod: val });
|
||||
},
|
||||
},
|
||||
authmethod: {
|
||||
get: function() {return this.store.authmethod},
|
||||
set: function(val) {this.$store.commit("updateAuthMethod", {authmethod: val})}
|
||||
get: function () {
|
||||
return this.store.authmethod;
|
||||
},
|
||||
set: function (val) {
|
||||
this.$store.commit('updateAuthMethod', { authmethod: val });
|
||||
},
|
||||
},
|
||||
authstatus: {
|
||||
get: function() {return this.store.authstatus},
|
||||
set: function(val) {this.$store.commit("updateAuthStatus", {authstatus: val})}
|
||||
get: function () {
|
||||
return this.store.authstatus;
|
||||
},
|
||||
set: function (val) {
|
||||
this.$store.commit('updateAuthStatus', { authstatus: val });
|
||||
},
|
||||
},
|
||||
usertype: {
|
||||
get: function() {return this.store.usertype},
|
||||
set: function(val) {this.$store.commit("updateUserType", {usertype: val})}
|
||||
get: function () {
|
||||
return this.store.usertype;
|
||||
},
|
||||
set: function (val) {
|
||||
this.$store.commit('updateUserType', { usertype: val });
|
||||
},
|
||||
},
|
||||
dialog: {
|
||||
get: function() {return this.store['dialog']},
|
||||
set: function(val) {this.$store.commit('updateStore', {name: 'dialog', data: val})}
|
||||
}
|
||||
get: function () {
|
||||
return this.store['dialog'];
|
||||
},
|
||||
set: function (val) {
|
||||
this.$store.commit('updateStore', { name: 'dialog', data: val });
|
||||
},
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
checkError () {
|
||||
this.errors = []
|
||||
if (!this.$empty(this.fullname)) { this.fullname = this.fullname.trim() }
|
||||
if (!this.$empty(this.username)) { this.username = this.username.trim().toLowerCase() }
|
||||
checkError() {
|
||||
this.errors = [];
|
||||
if (!this.$empty(this.fullname)) {
|
||||
this.fullname = this.fullname.trim();
|
||||
}
|
||||
if (!this.$empty(this.username)) {
|
||||
this.username = this.username.trim().toLowerCase();
|
||||
}
|
||||
if (this.$empty(this.fullname)) {
|
||||
this.errors.push({ name: 'fullname', text: 'Họ và tên không được bỏ trống' })
|
||||
this.errors.push({ name: 'fullname', text: 'Họ và tên không được bỏ trống' });
|
||||
} else if (this.fullname.length < 5) {
|
||||
this.errors.push({ name: 'fullname', text: 'Họ và tên quá ngắn. Yêu cầu từ 5 kí tự trở nên' })
|
||||
this.errors.push({ name: 'fullname', text: 'Họ và tên quá ngắn. Yêu cầu từ 5 kí tự trở nên' });
|
||||
}
|
||||
if (this.$empty(this.username)) {
|
||||
this.errors.push({ name: 'username', text: 'Tài khoản không được bỏ trống' })
|
||||
} else if (this.username!==this.username.replace(' ', '')) {
|
||||
this.errors.push({ name: 'username', text: 'Tài khoản không được chứa khoảng trắng' })
|
||||
} else if(this.username.length<5) {
|
||||
this.errors.push({ name: 'fullname', text: 'Tài khoản quá ngắn. Yêu cầu từ 5 kí tự trở nên' })
|
||||
this.errors.push({ name: 'username', text: 'Tài khoản không được bỏ trống' });
|
||||
} else if (this.username !== this.username.replace(' ', '')) {
|
||||
this.errors.push({ name: 'username', text: 'Tài khoản không được chứa khoảng trắng' });
|
||||
} else if (this.username.length < 5) {
|
||||
this.errors.push({ name: 'fullname', text: 'Tài khoản quá ngắn. Yêu cầu từ 5 kí tự trở nên' });
|
||||
}
|
||||
if (this.$empty(this.password)) {
|
||||
this.errors.push({ name: 'password', text: 'Mật khẩu không được bỏ trống' })
|
||||
this.errors.push({ name: 'password', text: 'Mật khẩu không được bỏ trống' });
|
||||
} else if (this.password.length < 6) {
|
||||
this.errors.push({ name: 'password', text: 'Mật khẩu gồm 6 kí tự trở nên bao gồm chữ và số ' })
|
||||
this.errors.push({ name: 'password', text: 'Mật khẩu gồm 6 kí tự trở nên bao gồm chữ và số ' });
|
||||
} else if (!(/\d/.test(this.password) && /[a-zA-Z]/.test(this.password))) {
|
||||
this.errors.push({ name: 'password', text: 'Mật khẩu gồm 6 kí tự trở nên bao gồm chữ và số ' })
|
||||
this.errors.push({ name: 'password', text: 'Mật khẩu gồm 6 kí tự trở nên bao gồm chữ và số ' });
|
||||
}
|
||||
if (this.$empty(this.retypePassword)) {
|
||||
this.errors.push({ name: 'retypePassword', text: 'Nhắc lại mật khẩu không được bỏ trống' })
|
||||
this.errors.push({ name: 'retypePassword', text: 'Nhắc lại mật khẩu không được bỏ trống' });
|
||||
} else if (this.password !== this.retypePassword) {
|
||||
this.errors.push({ name: 'retypePassword', text: 'Nhắc lại mật khẩu phải giống với mật khẩu đã nhập' })
|
||||
this.errors.push({ name: 'retypePassword', text: 'Nhắc lại mật khẩu phải giống với mật khẩu đã nhập' });
|
||||
}
|
||||
if(!this.$empty(this.email)) {
|
||||
this.email = this.email.trim()
|
||||
if(this.$errEmail(this.email)) this.errors.push({ name: 'email', text: 'Email không hợp lệ.' })
|
||||
if (!this.$empty(this.email)) {
|
||||
this.email = this.email.trim();
|
||||
if (this.$errEmail(this.email)) this.errors.push({ name: 'email', text: 'Email không hợp lệ.' });
|
||||
} else {
|
||||
this.errors.push({ name: 'email', text: 'Email không được bỏ trống.' })
|
||||
this.errors.push({ name: 'email', text: 'Email không được bỏ trống.' });
|
||||
}
|
||||
if(this.$empty(this.option)) {
|
||||
if(this.dealer) {
|
||||
this.option = {id: 3}
|
||||
} else this.errors.push({ name: 'type', text: 'Chưa chọn loại tài khoản.' })
|
||||
if (this.$empty(this.option)) {
|
||||
if (this.dealer) {
|
||||
this.option = { id: 3 };
|
||||
} else this.errors.push({ name: 'type', text: 'Chưa chọn loại tài khoản.' });
|
||||
}
|
||||
let opts = this.radio==='all'? 'all' : []
|
||||
if(opts.length===0) {
|
||||
let opts = this.radio === 'all' ? 'all' : [];
|
||||
if (opts.length === 0) {
|
||||
for (const [key, value] of Object.entries(this.check)) {
|
||||
if(value) opts.push(key)
|
||||
if (value) opts.push(key);
|
||||
}
|
||||
}
|
||||
return this.errors.length>0? true : false
|
||||
return this.errors.length > 0 ? true : false;
|
||||
},
|
||||
async createAccount() {
|
||||
this.loading = true
|
||||
if(this.checkError()) return this.loading = false
|
||||
const response = await fetch(`${this.$getpath()}password/${this.password}/`)
|
||||
if(!response.ok) {
|
||||
this.loading = true;
|
||||
if (this.checkError()) return (this.loading = false);
|
||||
const response = await fetch(`${this.$getpath()}password/${this.password}/`);
|
||||
if (!response.ok) {
|
||||
throw new Error(`Response status: ${response.status}`);
|
||||
}
|
||||
this.hash = await response.json();
|
||||
let data = await this.$getdata('user', {username: this.username}, undefined, true)
|
||||
if(data) {
|
||||
this.loading = false
|
||||
return this.errors.push({name: 'username', text: 'Tài khoản đã tồn tại trong hệ thống'})
|
||||
let data = await this.$getdata('user', { username: this.username }, undefined, true);
|
||||
if (data) {
|
||||
this.loading = false;
|
||||
return this.errors.push({ name: 'username', text: 'Tài khoản đã tồn tại trong hệ thống' });
|
||||
}
|
||||
let found = this.$findapi('user')
|
||||
data = { fullname: this.fullname, username: this.username, phone: this.$empty(this.phone)? undefined : this.phone, password:
|
||||
this.hash, type: this.option.id, register_method: 1, auth_status: 2, auth_method: 1, email: this.email}
|
||||
this.user = await this.$insertrow('user', data, found.params.values, this.pagename)
|
||||
if(this.user==='error') return this.loading = false
|
||||
if(this.row) {
|
||||
let copy = this.$copy(this.row)
|
||||
copy.user = this.user.id
|
||||
await this.$updaterow(this.api, copy, found.params.values, this.pagename)
|
||||
let found = this.$findapi('user');
|
||||
data = {
|
||||
fullname: this.fullname,
|
||||
username: this.username,
|
||||
phone: this.$empty(this.phone) ? undefined : this.phone,
|
||||
password: this.hash,
|
||||
type: this.option.id,
|
||||
register_method: 1,
|
||||
auth_status: 2,
|
||||
auth_method: 1,
|
||||
email: this.email,
|
||||
};
|
||||
this.user = await this.$insertrow('user', data, found.params.values, this.pagename);
|
||||
if (this.user === 'error') return (this.loading = false);
|
||||
if (this.row) {
|
||||
let copy = this.$copy(this.row);
|
||||
copy.user = this.user.id;
|
||||
await this.$updaterow(this.api, copy, found.params.values, this.pagename);
|
||||
} else {
|
||||
//send email
|
||||
if(this.email) {
|
||||
let content = `<p>Xin chào ${this.fullname}, </p>`
|
||||
content += '<p>Tài khoản đăng nhập của bạn đã được khởi tạo và sẵn sàng sử dụng:</p>'
|
||||
content += `<p>Username: ${this.username}</p>`
|
||||
content += `<p>Password: ${this.password}</p>`
|
||||
content += `<p>Đội ngũ Utopia.</p>`
|
||||
let info = {subject: 'Tài khoản đăng nhập Utopia', to: this.email, sender: 1, content: content}
|
||||
let rs = await this.$insertapi('sendemail', info)
|
||||
if (this.email) {
|
||||
let content = `<p>Xin chào ${this.fullname}, </p>`;
|
||||
content += '<p>Tài khoản đăng nhập của bạn đã được khởi tạo và sẵn sàng sử dụng:</p>';
|
||||
content += `<p>Username: ${this.username}</p>`;
|
||||
content += `<p>Password: ${this.password}</p>`;
|
||||
content += `<p>Đội ngũ Utopia.</p>`;
|
||||
let info = { subject: 'Tài khoản đăng nhập Utopia', to: this.email, sender: 1, content: content };
|
||||
let rs = await this.$insertapi('sendemail', info);
|
||||
}
|
||||
}
|
||||
if(this.dealer) {
|
||||
let copy = this.$copy(this.row)
|
||||
copy.user = this.user.id
|
||||
await this.$updaterow('dealer', copy, null, this.pagename)
|
||||
if (this.dealer) {
|
||||
let copy = this.$copy(this.row);
|
||||
copy.user = this.user.id;
|
||||
await this.$updaterow('dealer', copy, null, this.pagename);
|
||||
}
|
||||
this.loading = false
|
||||
this.$dialog('Tạo tài khoản thành công.', 'Thành công', 'Success', 10)
|
||||
this.$emit('close')
|
||||
this.loading = false;
|
||||
this.$dialog('Tạo tài khoản thành công.', 'Thành công', 'Success', 10);
|
||||
this.$emit('close');
|
||||
},
|
||||
selected(attr, obj) {
|
||||
this.option = obj
|
||||
this.option = obj;
|
||||
},
|
||||
doCheck(v) {
|
||||
this.$set(this.check, v.code, this.check[v.code]? false : true)
|
||||
}
|
||||
}
|
||||
}
|
||||
this.$set(this.check, v.code, this.check[v.code] ? false : true);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -1,52 +1,67 @@
|
||||
<template>
|
||||
<div v-if="record">
|
||||
<div class="columns is-multiline mx-0">
|
||||
<div class="column is-4">
|
||||
<div class="field">
|
||||
<label class="label">Username<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="" v-model="record.username" disabled>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-4">
|
||||
<div class="field">
|
||||
<label class="label">Full name<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="" v-model="record.fullname">
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.fullname">{{errors.fullname}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-4">
|
||||
<div class="field">
|
||||
<label class="label">Account type<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<SearchBox v-bind="{api:'usertype', field:'name', column:['name'], first:true, optionid:record.type, disabled: true}"
|
||||
@option="selected('_type', $event)"></SearchBox>
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.type">{{errors.type}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-4">
|
||||
<div class="field">
|
||||
<label class="label">Status<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<p class="mt-4">
|
||||
<span class="mr-4" v-for="(v,i) in option">
|
||||
<a class="icon-text" @click="radioBlocked=v">
|
||||
<SvgIcon v-bind="{name: `radio-${radioBlocked.code===v.code? '' : 'un'}checked.svg`, type: 'gray', size: 22}"></SvgIcon>
|
||||
<span>{{ v.name }}</span>
|
||||
</a>
|
||||
</span>
|
||||
</p>
|
||||
<div class="column is-4">
|
||||
<div class="field">
|
||||
<label class="label">{{isVietnamese ? 'Tên tài khoản' : 'Username'}}<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="" v-model="record.username" disabled />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-4">
|
||||
<div class="field">
|
||||
<label class="label">{{isVietnamese ? 'Họ tên' : 'Full name'}}<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="" v-model="record.fullname" />
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.fullname">{{ errors.fullname }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-4">
|
||||
<div class="field">
|
||||
<label class="label">{{isVietnamese ? 'Loại tài khoản' : 'Account type'}}<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<SearchBox
|
||||
v-bind="{
|
||||
api: 'usertype',
|
||||
field: 'name',
|
||||
column: ['name'],
|
||||
first: true,
|
||||
optionid: record.type,
|
||||
disabled: false,
|
||||
}"
|
||||
@option="selected('_type', $event)"
|
||||
></SearchBox>
|
||||
</div>
|
||||
<p class="help is-danger" v-if="errors.type">{{ errors.type }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-4">
|
||||
<div class="field">
|
||||
<label class="label">{{ isVietnamese ? 'Trạng thái' : 'Status' }}<b class="ml-1 has-text-danger">*</b></label>
|
||||
<div class="control">
|
||||
<p class="mt-4">
|
||||
<span class="mr-4" v-for="(v, i) in option">
|
||||
<a class="icon-text" @click="radioBlocked = v">
|
||||
<SvgIcon
|
||||
v-bind="{
|
||||
name: `radio-${radioBlocked?.code === v.code ? '' : 'un'}checked.svg`,
|
||||
type: 'gray',
|
||||
size: 22,
|
||||
}"
|
||||
></SvgIcon>
|
||||
<span>{{ v.name }}</span>
|
||||
</a>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-5">
|
||||
<button class="button is-primary has-text-white" @click="update()">Update</button>
|
||||
</div>
|
||||
<button class="button is-primary has-text-white" @click="update()">{{isVietnamese ? 'Cập nhật' : 'Update'}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@@ -54,58 +69,80 @@ export default {
|
||||
props: ['pagename', 'row'],
|
||||
data() {
|
||||
return {
|
||||
isVietnamese: this.$isVietnamese(),
|
||||
errors: {},
|
||||
record: this.row? this.$copy(this.row) : undefined,
|
||||
record: this.row ? this.$copy(this.row) : undefined,
|
||||
radioBlocked: undefined,
|
||||
branch: [],
|
||||
check: {},
|
||||
branchOpt: undefined,
|
||||
option: [{code: 0, name: 'Active'}, {code: 1, name: 'Blocked'}]
|
||||
}
|
||||
option: [
|
||||
{ code: 0, name: 'Active' },
|
||||
{ code: 1, name: 'Blocked' },
|
||||
],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
option() {
|
||||
return [
|
||||
{ code: 0, name: this.isVietnamese ? 'Hoạt động' : 'Active' },
|
||||
{ code: 1, name: this.isVietnamese ? 'Khóa' : 'Blocked' },
|
||||
];
|
||||
},
|
||||
},
|
||||
|
||||
async created() {
|
||||
this.record = await this.$getdata('user', undefined, {filter: {id: this.row.id}}, true)
|
||||
this.radioBlocked = this.record.blocked? this.option[1] : this.option[0]
|
||||
this.record = await this.$getdata('user', undefined, { filter: { id: this.row.id } }, true);
|
||||
|
||||
this.radioBlocked = this.record.blocked ? this.option[1] : this.option[0];
|
||||
console.log(this.radioBlocked);
|
||||
},
|
||||
methods: {
|
||||
selected(attr, obj) {
|
||||
this.record[attr] = obj
|
||||
this.record[attr] = obj;
|
||||
},
|
||||
checkError () {
|
||||
this.errors = []
|
||||
if (!this.$empty(this.record.fullname)) { this.record.fullname = this.record.fullname.trim() }
|
||||
if (!this.$empty(this.record.username)) { this.record.username = this.record.username.trim().toLowerCase() }
|
||||
checkError() {
|
||||
this.errors = [];
|
||||
if (!this.$empty(this.record.fullname)) {
|
||||
this.record.fullname = this.record.fullname.trim();
|
||||
}
|
||||
if (!this.$empty(this.record.username)) {
|
||||
this.record.username = this.record.username.trim().toLowerCase();
|
||||
}
|
||||
if (this.$empty(this.record.fullname)) {
|
||||
this.errors.fullname = 'Họ và tên không được bỏ trống'
|
||||
this.errors.fullname = 'Họ và tên không được bỏ trống';
|
||||
} else if (this.record.fullname.length < 5) {
|
||||
this.errors.fullname = 'Họ và tên quá ngắn. Yêu cầu từ 5 kí tự trở nên'
|
||||
this.errors.fullname = 'Họ và tên quá ngắn. Yêu cầu từ 5 kí tự trở nên';
|
||||
}
|
||||
if (this.$empty(this.record.username)) {
|
||||
this.errors.username = 'Tài khoản không được bỏ trống'
|
||||
} else if (this.record.username!==this.record.username.replace(' ', '')) {
|
||||
this.errors.username = 'Tài khoản không được chứa khoảng trắng'
|
||||
} else if(this.record.username.length<5) {
|
||||
this.errors.fullname = 'Tài khoản quá ngắn. Yêu cầu từ 5 kí tự trở nên'
|
||||
this.errors.username = 'Tài khoản không được bỏ trống';
|
||||
} else if (this.record.username !== this.record.username.replace(' ', '')) {
|
||||
this.errors.username = 'Tài khoản không được chứa khoảng trắng';
|
||||
} else if (this.record.username.length < 5) {
|
||||
this.errors.fullname = 'Tài khoản quá ngắn. Yêu cầu từ 5 kí tự trở nên';
|
||||
}
|
||||
if(!(this.record._type || this.record.type)) this.errors.type = 'Chưa chọn loại tài khoản'
|
||||
return this.errors.length>0? true : false
|
||||
if (!(this.record._type || this.record.type)) this.errors.type = 'Chưa chọn loại tài khoản';
|
||||
return this.errors.length > 0 ? true : false;
|
||||
},
|
||||
async update() {
|
||||
if(this.checkError()) return
|
||||
if(this.record._type) this.record.type = this.record._type.id
|
||||
this.record.blocked = this.radioBlocked.code
|
||||
let rs = await this.$updaterow('user', this.record, undefined, this.pagename)
|
||||
if(this.radioBlocked.code===1) this.setTokenExpiry()
|
||||
if (this.checkError()) return;
|
||||
if (this.record._type) this.record.type = this.record._type.id;
|
||||
this.record.blocked = this.radioBlocked.code;
|
||||
let rs = await this.$updaterow('user', this.record, undefined, this.pagename);
|
||||
if (this.radioBlocked.code === 1) this.setTokenExpiry();
|
||||
},
|
||||
doCheck(v) {
|
||||
this.$set(this.check, v.code, this.check[v.code]? false : true)
|
||||
this.$set(this.check, v.code, this.check[v.code] ? false : true);
|
||||
},
|
||||
async setTokenExpiry() {
|
||||
let rows = await this.$getdata('token', {user: this.record.id, expiry: 0})
|
||||
if(rows.length===0) return
|
||||
rows.map(v=>v.expiry = 1)
|
||||
this.$insertapi('token', rows, undefined, true)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
let rows = await this.$getdata('token', { user: this.record.id, expiry: 0 });
|
||||
if (rows.length === 0) return;
|
||||
rows.map((v) => (v.expiry = 1));
|
||||
this.$insertapi('token', rows, undefined, true);
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
console.log('User:', this.radioBlocked);
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -3,13 +3,13 @@
|
||||
<div class="field is-horizontal">
|
||||
<div class="field-body columns">
|
||||
<div class="field column">
|
||||
<label class="label">Username</label>
|
||||
<label class="label">{{ isVietnamese ? 'Tên tài khoản' : 'Username' }}</label>
|
||||
<div class="control">
|
||||
<p>{{ props.row.username }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field column">
|
||||
<label class="label">{{ isVietnamese ? "Loại tài khoản" : "Account type" }}</label>
|
||||
<label class="label">{{ isVietnamese ? 'Loại tài khoản' : 'Account type' }}</label>
|
||||
<div class="control">
|
||||
<p>{{ isVietnamese ? props.row.type__name : props.row.type__en }}</p>
|
||||
</div>
|
||||
@@ -19,7 +19,7 @@
|
||||
<div class="field is-horizontal mt-4">
|
||||
<div class="field-body columns">
|
||||
<div class="field column">
|
||||
<label class="label">{{ isVietnamese ? "Họ tên" : "Full name" }}</label>
|
||||
<label class="label">{{ isVietnamese ? 'Họ tên' : 'Full name' }}</label>
|
||||
<div class="control">
|
||||
<p>{{ props.row.fullname }}</p>
|
||||
</div>
|
||||
@@ -34,15 +34,15 @@
|
||||
</div>
|
||||
<div class="mt-5 pt-2">
|
||||
<button :class="`button is-primary has-text-white ${showModal.loading ? 'is-loading' : ''}`" @click="showConfirm">
|
||||
{{ isVietnamese ? "Đặt lại mật khẩu" : "Reset password" }}
|
||||
{{ isVietnamese ? 'Đặt lại mật khẩu' : 'Reset password' }}
|
||||
</button>
|
||||
</div>
|
||||
<Modal v-bind="showModal" v-if="showModal.show" @close="showModal.show = false"> </Modal>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
const { $store, $id, $insertapi, $getdata, $getpath, $updateapi, $dialog, $snackbar } = useNuxtApp();
|
||||
const emit = defineEmits(["close"]);
|
||||
const { $store, $id, $insertapi, $getdata, $getpath, $updateapi, $dialog, $snackbar, $isVietnamese } = useNuxtApp();
|
||||
const emit = defineEmits(['close']);
|
||||
var props = defineProps({
|
||||
row: Object,
|
||||
});
|
||||
@@ -52,47 +52,51 @@ const showModal = ref({
|
||||
loading: false,
|
||||
});
|
||||
|
||||
const isVietnamese = computed(() => $store.lang.toLowerCase() === "vi");
|
||||
const isVietnamese = computed(() => $isVietnamese());
|
||||
let pass = $id().toLocaleLowerCase();
|
||||
|
||||
async function handlerResetPassword() {
|
||||
showModal.value.loading = true;
|
||||
|
||||
let user = await $getdata("user", undefined, { filter: { id: props.row.id } }, true);
|
||||
let user = await $getdata('user', undefined, { filter: { id: props.row.id } }, true);
|
||||
const response = await fetch(`${$getpath()}password/${pass}/`);
|
||||
let hash = await response.json();
|
||||
user.password = hash;
|
||||
let rs1 = await $updateapi("user", user, null, false);
|
||||
if (rs1 === "error") {
|
||||
$dialog("Có lỗi xảy ra. Hãy thử lại một lần nữa", "Lỗi", "Error");
|
||||
let rs1 = await $updateapi('user', user, null, false);
|
||||
if (rs1 === 'error') {
|
||||
$dialog('Có lỗi xảy ra. Hãy thử lại một lần nữa', 'Lỗi', 'Error');
|
||||
} else {
|
||||
showModal.value.show = false;
|
||||
let content = `<p>Xin chào ${props.row.fullname}, </p>`;
|
||||
content += "<p>Mật khẩu tài khoản của bạn trên hệ thống đã được đặt lại thành công.</p>";
|
||||
content += "<p>Tài khoản đăng nhập của bạn:</p>";
|
||||
content += '<p>Mật khẩu tài khoản của bạn trên hệ thống đã được đặt lại thành công.</p>';
|
||||
content += '<p>Tài khoản đăng nhập của bạn:</p>';
|
||||
content += `<p>Username: ${props.row.username}</p>`;
|
||||
content += `<p>Password: ${pass}</p>`;
|
||||
content += `<p>Đội ngũ Utopia.</p>`;
|
||||
let info = {
|
||||
subject: "Thông báo đặt lại mật khẩu tài khoản đăng nhập Utopia",
|
||||
subject: 'Thông báo đặt lại mật khẩu tài khoản đăng nhập Utopia',
|
||||
to: props.row.email,
|
||||
sender: 1,
|
||||
content: content,
|
||||
};
|
||||
let rs = await $insertapi("sendemail", info, null, false);
|
||||
let rs = await $insertapi('sendemail', info, null, false);
|
||||
showModal.value.loading = false;
|
||||
$snackbar("Mật khẩu đã được đặt lại thành công. Thông tin đã được gửi tới địa chỉ email đã đăng ký.", "Thành công", "Success");
|
||||
emit("close");
|
||||
$snackbar(
|
||||
'Mật khẩu đã được đặt lại thành công. Thông tin đã được gửi tới địa chỉ email đã đăng ký.',
|
||||
'Thành công',
|
||||
'Success',
|
||||
);
|
||||
emit('close');
|
||||
}
|
||||
}
|
||||
|
||||
function showConfirm() {
|
||||
showModal.value = {
|
||||
show: true,
|
||||
title: !isVietnamese ? "Confirm password reset" : "Xác nhận đặt lại mật khẩu",
|
||||
height: "300px",
|
||||
width: "800px",
|
||||
component: "dialog/Confirm",
|
||||
title: !isVietnamese ? 'Confirm password reset' : 'Xác nhận đặt lại mật khẩu',
|
||||
height: '300px',
|
||||
width: '800px',
|
||||
component: 'dialog/Confirm',
|
||||
vbind: {
|
||||
content: `Bạn có muốn đặt lại mật khẩu cho tài khoản ${props.row.username?.toUpperCase()} này không?`,
|
||||
duration: 10,
|
||||
|
||||
Reference in New Issue
Block a user