Skip to content

Q
quasar-web-base
Commit 27241479 authored by Võ Quang Thành Đạt's avatar Võ Quang Thành Đạt
Browse files
Options

update

parent 07c384e0
Hide whitespace changes
Inline Side-by-side
Showing with 114 additions and 72 deletions
src/components/user-management/add-new-user-dialog/AddNewUserDialog.ts
View file @ 27241479
......@@ -57,7 +57,11 @@ export default defineComponent({
isMobilePhone(val) ||
i18n.global.t('userPage.validateMessages.isMobilePhone'),
];
const birthdayRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t('userPage.validateMessages.requireBirthday'),
];
const addressRules = [
(val?: string) =>
(val && val.trim().length) ||
......@@ -74,9 +78,8 @@ export default defineComponent({
i18n.global.t('userPage.validateMessages.requireSex'),
];
const groupRules = [
(val?: number) =>
val !== undefined ||
i18n.global.t('userPage.validateMessages.requiredGroup'),
(val?: Array<unknown>) =>
val?.length || i18n.global.t('userPage.validateMessages.requiredGroup'),
];
return {
userNameRules,
......@@ -88,6 +91,7 @@ export default defineComponent({
unitRules,
sexRules,
groupRules,
birthdayRules,
};
},
emits: [
......
src/components/user-management/add-new-user-dialog/index.vue
View file @ 27241479
......@@ -77,8 +77,6 @@
type="text"
class="q-my-sm"
outlined
:rules="addressRules"
hide-bottom-space
></q-input>
</div>
<div class="col-6">
......@@ -118,9 +116,10 @@
<q-input
:model-value="birthday"
@update:model-value="$emit('update:birthday', $event)"
:rules="birthdayRules"
type="date"
class="q-my-sm"
outlined
hide-bottom-space
>
<template v-slot:prepend>
<div class="text-body2">
......@@ -146,14 +145,13 @@
hide-bottom-space
></q-select>
<q-select
<!-- <q-select
:model-value="scheduleAccess"
@update:model-value="$emit('update:scheduleAccess', $event)"
:label="$t('userPage.dialogLabel.fieldLabels.scheduleAccess')"
:options="listScheduleAccess"
class="q-my-sm"
outlined
></q-select>
></q-select> -->
</div>
<q-space></q-space>
<div class="col-6">
......
src/components/user-management/update-user-dialog/UpdateUserDialog.ts
View file @ 27241479
......@@ -45,7 +45,11 @@ export default defineComponent({
isMobilePhone(val) ||
i18n.global.t('userPage.validateMessages.isMobilePhone'),
];
const birthdayRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t('userPage.validateMessages.requireBirthday'),
];
const addressRules = [
(val?: string) =>
(val && val.trim().length) ||
......@@ -62,9 +66,8 @@ export default defineComponent({
i18n.global.t('userPage.validateMessages.requireSex'),
];
const groupRules = [
(val?: number) =>
val !== undefined ||
i18n.global.t('userPage.validateMessages.requiredGroup'),
(val?: Array<unknown>) =>
val?.length || i18n.global.t('userPage.validateMessages.requiredGroup'),
];
return {
fullNameRules,
......@@ -74,6 +77,7 @@ export default defineComponent({
unitRules,
sexRules,
groupRules,
birthdayRules,
};
},
emits: [
......
src/components/user-management/update-user-dialog/index.vue
View file @ 27241479
......@@ -50,16 +50,6 @@
:rules="mobileNumberRules"
hide-bottom-space
></q-input>
<q-input
:model-value="address"
@update:model-value="$emit('update:address', $event)"
:label="$t('userPage.dialogLabel.fieldLabels.address')"
type="text"
class="q-my-sm"
outlined
:rules="addressRules"
hide-bottom-space
></q-input>
<q-input
:model-value="phoneNumber"
@update:model-value="$emit('update:phoneNumber', $event)"
......@@ -68,6 +58,14 @@
class="q-my-sm"
outlined
></q-input>
<q-input
:model-value="address"
@update:model-value="$emit('update:address', $event)"
:label="$t('userPage.dialogLabel.fieldLabels.address')"
type="text"
class="q-my-sm"
outlined
></q-input>
</div>
<div class="col-6">
<q-input
......@@ -99,8 +97,9 @@
:model-value="birthday"
@update:model-value="$emit('update:birthday', $event)"
type="date"
class="q-my-sm"
outlined
:rules="birthdayRules"
hide-bottom-space
>
<template v-slot:prepend>
<div class="text-body2">
......@@ -126,14 +125,13 @@
hide-bottom-space
></q-select>
<q-select
<!-- <q-select
:model-value="scheduleAccess"
@update:model-value="$emit('update:scheduleAccess', $event)"
:label="$t('userPage.dialogLabel.fieldLabels.scheduleAccess')"
:options="listScheduleAccess"
class="q-my-sm"
outlined
></q-select>
></q-select> -->
</div>
<q-space></q-space>
<div class="col-6">
......
src/i18n/vi/index.ts
View file @ 27241479
......@@ -67,6 +67,7 @@ export default {
title: 'Quản lý người dùng',
tableColumns: {
userName: 'Tên đăng nhập',
keywordSearch: 'Tên người dùng',
fullName: 'Họ tên',
email: 'Email',
phone: 'Số điện thoại',
......@@ -104,25 +105,25 @@ export default {
cancel: 'Đóng',
},
validateMessages: {
requireUserName: 'Tên đăng nhập không hợp lệ',
requirePassword: 'Vui lòng nhập mật khẩu',
requireFullName: 'Vui lòng nhập họ tên',
requireUserName: 'Vui lòng nhập Tên đăng nhập',
requirePassword: 'Vui lòng nhập Mật khẩu',
requireFullName: 'Vui lòng nhập Họ tên',
requireBirthday: 'Vui lòng chọn Ngày sinh',
requireEmail: 'Vui lòng nhập Email',
isEmail: 'Email không hợp lệ',
requireMobileNumber: 'Vui lòng nhập số điện thoại',
requireMobileNumber: 'Vui lòng nhập Số điện thoại',
isMobilePhone: 'Số điện thoại không hợp lệ',
requireAddress: 'Vui lòng nhập địa chỉ',
requireUnit: 'Vui lòng nhập địa chỉ phòng ban',
requireSex: 'Vui lòng chọn giới tính',
requiredGroup: 'Vui lòng chọn nhóm người dùng',
requireAddress: 'Vui lòng nhập Địa chỉ',
requireUnit: 'Vui lòng nhập Đơn vị phòng ban',
requireSex: 'Vui lòng chọn Giới tính',
requiredGroup: 'Vui lòng chọn Nhóm người dùng',
},
confirmActionsTitle: {
confirmDeleteUserTitle: 'Xác nhận',
confirmDeleteUserCancelBtnLabel: 'Huỷ',
confirmDeleteUserContent: 'Bạn có chắc muốn xoá tài khoản',
confirmResetPasswordContent:
'Bạn có muốn reset mật khẩu của người dùng này không',
'Bạn có muốn reset về mật khẩu: 123@123a cho người dùng này không',
},
actionMessages: {
addNewUserAccess: 'Thêm tài khoản thành công',
......
src/pages/nguoi-dung/User.ts
View file @ 27241479
......@@ -11,6 +11,7 @@ import AddNewUserDialogComponent from '../../components/user-management/add-new-
import UpdateUserDialogComponent from '../../components/user-management/update-user-dialog/index.vue';
import { GroupInfoType } from '../nhom-nguoi-dung/UserGroup';
import Pagination from 'components/pagination/index.vue';
// import moment from 'moment';
export default defineComponent({
components: {
......@@ -51,8 +52,8 @@ export default defineComponent({
sortable: false,
},
{
name: 'phoneNumber',
field: 'phoneNumber',
name: 'mobileNumber',
field: 'mobileNumber',
required: true,
label: i18n.global.t('userPage.tableColumns.phone'),
headerStyle: 'text-align: center !important;',
......@@ -122,6 +123,7 @@ export default defineComponent({
params: {
pageIndex: pageIndex.value,
pageSize: pageSize.value,
name: keyword.value.trim(),
},
})) as AxiosResponse<BaseResponseBody<PaginationResponse<UserObject>>>;
if (response.data.error.code === config.API_RES_CODE.OK.code) {
......@@ -132,11 +134,11 @@ export default defineComponent({
} catch (error) {}
};
const filterListUser: Ref<UserObject[]> = computed(() => {
return userTableRows.value.filter((user) =>
user.userName.includes(keyword.value)
);
});
// const filterListUser: Ref<UserObject[]> = computed(() => {
// return userTableRows.value.filter((user) =>
// user.userName.includes(keyword.value)
// );
// });
const getListUserGroup = async () => {
await $store.dispatch('authentication/getListUsers').then((response) => {
......@@ -170,22 +172,22 @@ export default defineComponent({
try {
const groups: { id: number }[] = [];
group.value.map((item) => {
groups.push({ id: (item as unknown) as number });
groups.push({ id: item as unknown as number });
});
const response = (await api({
url: API_PATHS.addNewUser,
method: 'POST',
data: {
user: {
userName: userName.value,
userName: userName.value.trim(),
password: password.value,
fullName: fullName.value,
fullName: fullName.value.trim(),
birthday: birthday.value,
email: email.value,
phoneNumber: phoneNumber.value,
mobileNumber: mobileNumber.value,
email: email.value.trim(),
phoneNumber: phoneNumber.value.trim(),
mobileNumber: mobileNumber.value.trim(),
sex: sex.value,
address: address.value,
address: address.value?.trim(),
unit: unit.value,
status: status.value ? 1 : 0,
},
......@@ -205,14 +207,15 @@ export default defineComponent({
} catch (error) {}
};
const confirmDeleteUser = (userId: number) => {
const confirmDeleteUser = (userId: number, userName: string) => {
Dialog.create({
title: i18n.global.t(
'userPage.confirmActionsTitle.confirmDeleteUserTitle'
),
message: i18n.global.t(
'userPage.confirmActionsTitle.confirmDeleteUserContent'
),
message:
i18n.global.t(
'userPage.confirmActionsTitle.confirmDeleteUserContent'
) + ` "${userName}"`,
cancel: i18n.global.t(
'userPage.confirmActionsTitle.confirmDeleteUserCancelBtnLabel'
),
......@@ -324,7 +327,7 @@ export default defineComponent({
try {
const groups: { id: number }[] = [];
group.value.map((item) => {
groups.push({ id: (item as unknown) as number });
groups.push({ id: item as unknown as number });
});
const response = (await api({
url: API_PATHS.updateUser,
......@@ -332,15 +335,15 @@ export default defineComponent({
data: {
user: {
id: id.value,
userName: userName.value,
userName: userName.value.trim(),
password: password.value,
fullName: fullName.value,
fullName: fullName.value.trim(),
birthday: birthday.value,
email: email.value,
phoneNumber: phoneNumber.value,
mobileNumber: mobileNumber.value,
email: email.value.trim(),
phoneNumber: phoneNumber.value.trim(),
mobileNumber: mobileNumber.value.trim(),
sex: sex.value,
address: address.value,
address: address.value?.trim(),
unit: unit.value,
status: status.value ? 1 : 0,
},
......@@ -369,13 +372,13 @@ export default defineComponent({
void getListUsers();
};
return {
rows: userTableRows,
userTableRows,
userTableColumns,
totalPage,
pageIndex,
pageSize,
keyword,
filterListUser,
// filterListUser,
showDialog,
userName,
password,
......
src/pages/nguoi-dung/index.vue
View file @ 27241479
<template>
<div class="row q-col-gutter-sm">
<div class="row q-col-gutter-sm flex-center q-mt-sm">
<div class="col-auto text-h6 text-weight-regular flex flex-center q-mr-md">
{{ $t('userPage.title') }}
<q-separator vertical spaced />
</div>
<q-space></q-space>
<div class="col-2">
<q-input
v-model="keyword"
dense
outlined
:label="$t('userPage.tableColumns.keywordSearch')"
clearable
></q-input>
</div>
<div class="col-auto">
<q-btn
color="primary"
no-caps
:label="$t('crudActions.search')"
style="width: 100px"
@click="getListUsers"
>
</q-btn>
</div>
<div class="col-auto">
<q-btn
color="primary"
no-caps
:label="$t('crudActions.add')"
style="width: 100px"
@click="openAddUserDialog"
>
</q-btn>
</div>
<div class="col-12">
<q-table
:rows="filterListUser"
:rows="userTableRows"
:columns="userTableColumns"
row-key="name"
separator="cell"
hide-pagination
:no-data-label="$t('emptyData')"
>
<template v-slot:top>
<!-- <template v-slot:top>
<q-th class="full-width">
<div class="row">
<div
class="col-auto text-h6 text-weight-regular flex flex-center q-mr-md"
>
{{ $t('userPage.title') }}
</div>
<q-separator vertical spaced />
<div class="col-5 q-ml-md">
......@@ -33,7 +67,7 @@
</div>
</div>
</q-th>
</template>
</template> -->
<template v-slot:body-cell-status="rowData">
<q-td>
<div align="center">
......@@ -79,8 +113,8 @@
flat
round
color="primary"
icon="delete"
@click="confirmDeleteUser(item.row.id)"
icon="mdi-delete-outline"
@click="confirmDeleteUser(item.row.id, item.row.userName)"
>
<q-tooltip :offset="[20, 10]">{{
$t('userPage.toolTipMessage.deleteUser')
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment