Skip to content

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

done update customer

parent 562a4487
Hide whitespace changes
Inline Side-by-side
Showing with 555 additions and 273 deletions
src/assets/configurations.example.ts
View file @ 5b8bf533
...@@ -67,4 +67,6 @@ export enum API_PATHS { ...@@ -67,4 +67,6 @@ export enum API_PATHS {
getDetailField = 'field/detail', getDetailField = 'field/detail',
getListPost = 'post', getListPost = 'post',
deletePost = 'post/delete', deletePost = 'post/delete',
detailCustomer = 'customer/detail',
updateCustomer = 'customer/update',
} }
src/assets/type.ts
View file @ 5b8bf533
...@@ -242,7 +242,7 @@ export type CustomerType = { ...@@ -242,7 +242,7 @@ export type CustomerType = {
type: string; type: string;
representative: string; representative: string;
position: string; position: string;
level: string; level: CustomerLevelType;
}; };
export type CustomerLevelType = { export type CustomerLevelType = {
id: number; id: number;
......
src/components/customer/add-new-customer-dialog/AddNewCustomerDialog.ts
View file @ 5b8bf533
...@@ -3,7 +3,6 @@ import { i18n } from 'src/boot/i18n'; ...@@ -3,7 +3,6 @@ import { i18n } from 'src/boot/i18n';
import { isEmail } from '../../../boot/functions'; import { isEmail } from '../../../boot/functions';
import { isMobilePhone } from '../../../boot/functions'; import { isMobilePhone } from '../../../boot/functions';
import { CustomerLevelType, CustomerType } from 'src/assets/type'; import { CustomerLevelType, CustomerType } from 'src/assets/type';
import { Notify } from 'quasar';
export default defineComponent({ export default defineComponent({
props: { props: {
...@@ -45,78 +44,77 @@ export default defineComponent({ ...@@ -45,78 +44,77 @@ export default defineComponent({
const level: Ref<CustomerLevelType | null> = ref(null); const level: Ref<CustomerLevelType | null> = ref(null);
const confirmAddCustomer = () => { const confirmAddCustomer = () => {
let hasError = false; // let hasError = false;
if ( // if (
props.listCustomers.filter((customer) => customer.code === code.value) // props.listCustomers.filter((customer) => customer.code === code.value)
.length // .length
) { // ) {
hasError = true; // hasError = true;
Notify.create({ // Notify.create({
type: 'negative', // type: 'negative',
message: i18n.global.t('customer.validateMessages.codeExists'), // message: i18n.global.t('customer.validateMessages.codeExists'),
}); // });
} // }
if ( // if (
props.listCustomers.filter( // props.listCustomers.filter(
(customer) => customer.userName === userName.value // (customer) => customer.userName === userName.value
).length // ).length
) { // ) {
hasError = true; // hasError = true;
Notify.create({ // Notify.create({
type: 'negative', // type: 'negative',
message: i18n.global.t('customer.validateMessages.userNameExists'), // message: i18n.global.t('customer.validateMessages.userNameExists'),
}); // });
} // }
if ( // if (
props.listCustomers.filter( // props.listCustomers.filter(
(customer) => customer.taxCode === taxCode.value // (customer) => customer.taxCode === taxCode.value
).length // ).length
) { // ) {
hasError = true; // hasError = true;
Notify.create({ // Notify.create({
type: 'negative', // type: 'negative',
message: i18n.global.t('customer.validateMessages.taxCodeExists'), // message: i18n.global.t('customer.validateMessages.taxCodeExists'),
}); // });
} // }
if ( // if (
props.listCustomers.filter((customer) => customer.email === email.value) // props.listCustomers.filter((customer) => customer.email === email.value)
.length // .length
) { // ) {
hasError = true; // hasError = true;
Notify.create({ // Notify.create({
type: 'negative', // type: 'negative',
message: i18n.global.t('customer.validateMessages.emailExists'), // message: i18n.global.t('customer.validateMessages.emailExists'),
}); // });
} // }
if ( // if (
props.listCustomers.filter((customer) => customer.phone === phone.value) // props.listCustomers.filter((customer) => customer.phone === phone.value)
.length // .length
) { // ) {
hasError = true; // hasError = true;
Notify.create({ // Notify.create({
type: 'negative', // type: 'negative',
message: i18n.global.t('customer.validateMessages.phoneExists'), // message: i18n.global.t('customer.validateMessages.phoneExists'),
}); // });
} // }
if (!hasError) { // if (!hasError) {
context.emit('addNewCustomer', { context.emit('addNewCustomer', {
code: code.value, code: code.value,
userName: userName.value, userName: userName.value,
fullName: fullName.value, fullName: fullName.value,
companyName: companyName.value, companyName: companyName.value,
taxCode: taxCode.value, taxCode: taxCode.value,
email: email.value, email: email.value,
status: status.value, status: status.value,
phone: phone.value, phone: phone.value,
password: password.value, password: password.value,
address: address.value, address: address.value,
type: type.value, type: type.value,
representative: representative.value, representative: representative.value,
position: position.value, position: position.value,
level: level.value, level: level.value,
}); });
}
}; };
const resetData = () => { const resetData = () => {
code.value = null; code.value = null;
......
src/components/customer/update-new-customer-dialog/UpdateNewCustomerDialog.ts
View file @ 5b8bf533
import { defineComponent } from 'vue'; import { defineComponent, PropType, Ref, ref, watch } from 'vue';
import { i18n } from 'src/boot/i18n'; import { i18n } from 'src/boot/i18n';
import { isEmail } from '../../../boot/functions'; import { isEmail } from '../../../boot/functions';
import { isMobilePhone } from '../../../boot/functions'; import { isMobilePhone } from '../../../boot/functions';
import { CustomerLevelType, CustomerType } from 'src/assets/type';
export default defineComponent({ export default defineComponent({
props: { props: {
...@@ -9,27 +10,92 @@ export default defineComponent({ ...@@ -9,27 +10,92 @@ export default defineComponent({
type: Boolean, type: Boolean,
required: true, required: true,
}, },
ratingsOptions: {type: Array, required: true}, levelOptions: {
businessTypeOptions: {type: Array, required: true}, type: Array as PropType<CustomerLevelType[]>,
userName: { type: String, required: true }, required: true,
customerName: { type: String, required: true }, },
businessName: { type: String, required: true }, customerInfo: { type: Object as PropType<CustomerType>, required: true },
taxCode: { type: Number, required: true },
email: { type: String, required: true },
ratings: { type: String, required: true },
address: { type: String, required: true },
businessType: { type: String, required: true },
representative: { type: String, required: true },
position: { type: String, required: true },
phone: { type: String, required: true },
status: { type: Boolean, required: true },
}, },
setup() { setup(props, context) {
watch(
() => props.showDialogUpdate,
(value) => {
if (value) {
console.log(
props.customerInfo,
'customerInfocustomerInfocustomerInfo'
);
void getData();
}
}
);
const id: Ref<number | null> = ref(null);
const code: Ref<string | null> = ref(null);
const userName: Ref<string | null> = ref(null);
const fullName: Ref<string | null> = ref(null);
const companyName: Ref<string | null> = ref(null);
const taxCode: Ref<string | null> = ref(null);
const email: Ref<string | null> = ref(null);
const status: Ref<number | null> = ref(1);
const phone: Ref<string | null> = ref(null);
const password: Ref<string | null> = ref(null);
const address: Ref<string | null> = ref(null);
const type: Ref<string | null> = ref(null);
const representative: Ref<string | null> = ref(null);
const position: Ref<string | null> = ref(null);
const level: Ref<CustomerLevelType | null> = ref(null);
const confirmEditCustomer = () => {
context.emit('editCustomer', {
id: id.value,
code: code.value,
userName: userName.value,
fullName: fullName.value,
companyName: companyName.value,
taxCode: taxCode.value,
email: email.value,
status: status.value,
phone: phone.value,
password: password.value,
address: address.value,
type: type.value,
representative: representative.value,
position: position.value,
level: level.value,
});
};
const getData = () => {
id.value = props.customerInfo.id;
code.value = props.customerInfo.code;
userName.value = props.customerInfo.userName;
fullName.value = props.customerInfo.fullName;
companyName.value = props.customerInfo.companyName;
taxCode.value = props.customerInfo.taxCode;
email.value = props.customerInfo.email;
status.value = props.customerInfo.status;
phone.value = props.customerInfo.phone;
password.value = props.customerInfo.password;
address.value = props.customerInfo.address;
type.value = props.customerInfo.type;
representative.value = props.customerInfo.representative;
position.value = props.customerInfo.position;
level.value = props.customerInfo.level;
};
const userNameRules = [ const userNameRules = [
(val?: string) => (val?: string) =>
(val && val.trim().length) || (val && val.trim().length) ||
i18n.global.t('customer.validateMessages.requireUserName'), i18n.global.t('customer.validateMessages.requireUserName'),
]; ];
const passwordRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t('customer.validateMessages.requirePassword'),
];
const codeRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t('customer.validateMessages.requireCode'),
];
const customerNameRules = [ const customerNameRules = [
(val?: string) => (val?: string) =>
(val && val.trim().length) || (val && val.trim().length) ||
...@@ -41,18 +107,18 @@ export default defineComponent({ ...@@ -41,18 +107,18 @@ export default defineComponent({
i18n.global.t('customer.validateMessages.requireBusinessName'), i18n.global.t('customer.validateMessages.requireBusinessName'),
]; ];
const taxCodeRules = [ const taxCodeRules = [
(val?: number) => (val?: string) =>
val !== undefined || (val && val.trim().length) ||
i18n.global.t('customer.validateMessages.requireTaxCode'), i18n.global.t('customer.validateMessages.requireTaxCode'),
]; ];
const phoneRules = [ const phoneRules = [
(val?: string) => (val?: string) =>
(val && val.trim().length) || (val && val.trim().length) ||
i18n.global.t('customer.validateMessages.requirePhone'), i18n.global.t('customer.validateMessages.requirePhone'),
(val: string) => (val: string) =>
isMobilePhone(val) || isMobilePhone(val) ||
i18n.global.t('customer.validateMessages.isPhone'), i18n.global.t('customer.validateMessages.isPhone'),
]; ];
const emailRules = [ const emailRules = [
(val?: string) => (val?: string) =>
(val && val.trim().length) || (val && val.trim().length) ||
...@@ -66,54 +132,56 @@ export default defineComponent({ ...@@ -66,54 +132,56 @@ export default defineComponent({
i18n.global.t('customer.validateMessages.requireAddress'), i18n.global.t('customer.validateMessages.requireAddress'),
]; ];
const businessTypeRules = [ const businessTypeRules = [
(val?: number) => (val?: string) =>
val !== undefined || (val && val.trim().length) ||
i18n.global.t('customer.validateMessages.requireBusinessType'), i18n.global.t('customer.validateMessages.requireBusinessType'),
]; ];
const ratingsRules = [ const levelRules = [
(val?: number) => (val?: CustomerLevelType) =>
val !== undefined || val !== null ||
i18n.global.t('customer.validateMessages.requireRatings'), i18n.global.t('customer.validateMessages.requireRatings'),
]; ];
const representativeRules = [ const representativeRules = [
(val?: string) => (val?: string) =>
(val && val.trim().length) || (val && val.trim().length) ||
i18n.global.t('customer.validateMessages.requireRepresentative'), i18n.global.t('customer.validateMessages.requireRepresentative'),
]; ];
const positionRules = [ const positionRules = [
(val?: string) => (val?: string) =>
(val && val.trim().length) || (val && val.trim().length) ||
i18n.global.t('customer.validateMessages.requiredPosition'), i18n.global.t('customer.validateMessages.requiredPosition'),
]; ];
return { return {
userNameRules, userNameRules,
customerNameRules, customerNameRules,
businessNameRules, businessNameRules,
passwordRules,
codeRules,
taxCodeRules, taxCodeRules,
emailRules, emailRules,
ratingsRules, levelRules,
addressRules, addressRules,
businessTypeRules, businessTypeRules,
representativeRules, representativeRules,
positionRules, positionRules,
phoneRules, phoneRules,
userName,
fullName,
companyName,
taxCode,
email,
status,
phone,
password,
address,
type,
representative,
position,
level,
code,
confirmEditCustomer,
id,
}; };
}, },
emits: [ emits: ['update:showDialogUpdate', 'click:CloseBtn', 'editCustomer'],
'update:showDialogUpdate',
'click:CloseBtn',
'update:userName',
'update:customerName',
'update:businessName',
'update:taxCode',
'update:email',
'update:ratings',
'update:address',
'update:businessType',
'update:representative',
'update:position',
'update:phone',
'update:status',
'updateNewCustomer',
],
}); });
src/components/customer/update-new-customer-dialog/index.vue
View file @ 5b8bf533
...@@ -5,12 +5,12 @@ ...@@ -5,12 +5,12 @@
@update:model-value="$emit('update:showDialogUpdate', $event)" @update:model-value="$emit('update:showDialogUpdate', $event)"
> >
<q-card style="min-width: 900px" bordered> <q-card style="min-width: 900px" bordered>
<q-form greedy @submit.prevent="$emit('updateNewCustomer')"> <q-form greedy @submit.prevent="confirmEditCustomer">
<q-card-section> <q-card-section>
<q-item> <q-item>
<q-item-section> <q-item-section>
<q-item-label class="text-h6 text-weight-regular">{{ <q-item-label class="text-h6 text-weight-regular">{{
$t('customer.dialogLabel.title.updateCustomer') $t('customer.dialogLabel.title.editCustomer')
}}</q-item-label> }}</q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>
...@@ -21,149 +21,138 @@ ...@@ -21,149 +21,138 @@
<div class="row q-col-gutter-sm"> <div class="row q-col-gutter-sm">
<div class="col-6"> <div class="col-6">
<q-input <q-input
:model-value="userName" v-model="userName"
@update:model-value="$emit('update:userName', $event)"
:label="$t('customer.dialogLabel.fieldLabels.userName')" :label="$t('customer.dialogLabel.fieldLabels.userName')"
:rules="userNameRules" :rules="userNameRules"
hide-bottom-space hide-bottom-space
type="text" type="text"
class="q-my-sm" class="q-my-sm"
outlined outlined
clearable
></q-input> ></q-input>
<q-input <q-input
:model-value="customerName" v-model="password"
@update:model-value="$emit('update:customerName', $event)" :label="$t('customer.dialogLabel.fieldLabels.password')"
:rules="passwordRules"
hide-bottom-space
type="password"
class="q-my-sm"
outlined
></q-input>
<q-input
v-model="code"
:label="$t('customer.dialogLabel.fieldLabels.code')"
:rules="codeRules"
hide-bottom-space
type="text"
class="q-my-sm"
outlined
></q-input>
<q-input
v-model="fullName"
:label="$t('customer.dialogLabel.fieldLabels.customerName')" :label="$t('customer.dialogLabel.fieldLabels.customerName')"
type="text" type="text"
class="q-my-sm" class="q-my-sm"
outlined outlined
:rules="customerNameRules" :rules="customerNameRules"
hide-bottom-space hide-bottom-space
clearable
></q-input> ></q-input>
<q-input <q-input
:model-value="businessName" v-model="companyName"
@update:model-value="$emit('update:businessName', $event)"
:label="$t('customer.dialogLabel.fieldLabels.businessName')" :label="$t('customer.dialogLabel.fieldLabels.businessName')"
type="text" type="text"
class="q-my-sm" class="q-my-sm"
outlined outlined
:rules="businessNameRules" :rules="businessNameRules"
hide-bottom-space hide-bottom-space
clearable
></q-input> ></q-input>
<q-input <q-input
:model-value="taxCode" v-model="taxCode"
@update:model-value="$emit('update:taxCode', $event)"
:label="$t('customer.dialogLabel.fieldLabels.taxCode')" :label="$t('customer.dialogLabel.fieldLabels.taxCode')"
type="number" type="text"
class="q-my-sm" class="q-my-sm"
outlined outlined
:rules="taxCodeRules" :rules="taxCodeRules"
hide-bottom-space hide-bottom-space
clearable
></q-input> ></q-input>
<q-input <q-input
:model-value="email" v-model="address"
@update:model-value="$emit('update:email', $event)" :label="$t('customer.dialogLabel.fieldLabels.address')"
:label="$t('customer.dialogLabel.fieldLabels.email')"
type="text" type="text"
class="q-my-sm" class="q-my-sm"
:rules="addressRules"
outlined outlined
:rules="emailRules"
hide-bottom-space hide-bottom-space
clearable
></q-input> ></q-input>
<q-select
:model-value="ratings"
@update:model-value="$emit('update:ratings', $event)"
:label="$t('customer.dialogLabel.fieldLabels.ratings')"
:options="ratingsOptions"
:rules="ratingsRules"
emit-value
map-options
option-value="id"
option-label="text"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-select>
</div> </div>
<div class="col-6"> <div class="col-6">
<q-input <q-input
:model-value="address" v-model="email"
@update:model-value="$emit('update:address', $event)" :label="$t('customer.dialogLabel.fieldLabels.email')"
:label="$t('customer.dialogLabel.fieldLabels.address')"
type="text" type="text"
class="q-my-sm" class="q-my-sm"
:rules="addressRules"
outlined outlined
:rules="emailRules"
hide-bottom-space hide-bottom-space
clearable
></q-input> ></q-input>
<q-select <q-input
:model-value="businessType" v-model="type"
@update:model-value="$emit('update:businessType', $event)"
:label="$t('customer.dialogLabel.fieldLabels.businessType')" :label="$t('customer.dialogLabel.fieldLabels.businessType')"
:options="businessTypeOptions"
:rules="businessTypeRules" :rules="businessTypeRules"
emit-value emit-value
map-options map-options
option-value="id" option-value="id"
option-label="text" option-label="text"
type="text"
class="q-my-sm" class="q-my-sm"
outlined outlined
hide-bottom-space hide-bottom-space
></q-input>
<q-select
v-model="level"
:label="$t('customer.dialogLabel.fieldLabels.ratings')"
:options="levelOptions"
:rules="levelRules"
map-options
option-value="id"
option-label="name"
type="text"
class="q-my-sm"
outlined
clearable clearable
hide-bottom-space
></q-select> ></q-select>
<q-input <q-input
:model-value="representative" v-model="representative"
emit-value
@update:model-value="$emit('update:representative', $event)"
:label="$t('customer.dialogLabel.fieldLabels.representative')" :label="$t('customer.dialogLabel.fieldLabels.representative')"
class="q-my-sm" class="q-my-sm"
type="text" type="text"
outlined outlined
:rules="representativeRules" :rules="representativeRules"
hide-bottom-space hide-bottom-space
clearable
></q-input> ></q-input>
<q-input <q-input
:model-value="position" v-model="position"
emit-value
@update:model-value="$emit('update:position', $event)"
:label="$t('customer.dialogLabel.fieldLabels.position')" :label="$t('customer.dialogLabel.fieldLabels.position')"
class="q-my-sm" class="q-my-sm"
type="text" type="text"
outlined outlined
:rules="positionRules" :rules="positionRules"
hide-bottom-space hide-bottom-space
clearable
></q-input> ></q-input>
<q-input <q-input
:model-value="phone" v-model="phone"
emit-value
@update:model-value="$emit('update:phone', $event)"
:label="$t('customer.dialogLabel.fieldLabels.phone')" :label="$t('customer.dialogLabel.fieldLabels.phone')"
class="q-my-sm" class="q-my-sm"
type="number" type="number"
:rules="phoneRules" :rules="phoneRules"
outlined outlined
hide-bottom-space hide-bottom-space
clearable
></q-input> ></q-input>
<div style="padding-top: 13px; padding-left: 12px"> <div style="padding-top: 13px; padding-left: 12px">
<span class="text-body1">{{ <span class="text-body1">{{
$t('customer.dialogLabel.fieldLabels.status') $t('customer.dialogLabel.fieldLabels.status')
}}</span }}</span
><q-toggle ><q-toggle :true-value="1" :false-value="2" v-model="status" />
:model-value="status"
@update:model-value="$emit('update:status', $event)"
/>
</div> </div>
</div> </div>
</div> </div>
......
src/i18n/vi/index.ts
View file @ 5b8bf533
...@@ -316,6 +316,7 @@ export default { ...@@ -316,6 +316,7 @@ export default {
title: { title: {
addCustomer: 'Thêm khách hàng', addCustomer: 'Thêm khách hàng',
updateCustomer: 'Cập nhật khách hàng', updateCustomer: 'Cập nhật khách hàng',
editCustomer: 'Cập nhật thông tin khách hàng',
}, },
fieldLabels: { fieldLabels: {
userName: 'Tên đăng nhập *', userName: 'Tên đăng nhập *',
......
src/pages/cap-nhat-thong-tin-nghe-sy/updateInformationArtist.ts
View file @ 5b8bf533
...@@ -544,9 +544,7 @@ export default defineComponent({ ...@@ -544,9 +544,7 @@ export default defineComponent({
data: bodyFormData, data: bodyFormData,
})) as AxiosResponse<BaseResponseBody<FileUploadType>>; })) as AxiosResponse<BaseResponseBody<FileUploadType>>;
if (response.data.error.code === config.API_RES_CODE.OK.code) { if (response.data.error.code === config.API_RES_CODE.OK.code) {
avatarUploaded.value = avatarUploaded.value = response.data.data.fileName;
'http://cms.vab.xteldev.com/file/upload/' +
response.data.data.fileName;
} }
} catch (error) {} } catch (error) {}
}; };
...@@ -561,9 +559,7 @@ export default defineComponent({ ...@@ -561,9 +559,7 @@ export default defineComponent({
data: bodyFormData, data: bodyFormData,
})) as AxiosResponse<BaseResponseBody<FileUploadType>>; })) as AxiosResponse<BaseResponseBody<FileUploadType>>;
if (response.data.error.code === config.API_RES_CODE.OK.code) { if (response.data.error.code === config.API_RES_CODE.OK.code) {
const bannerUpload = const bannerUpload = response.data.data.fileName;
'http://cms.vab.xteldev.com/file/upload/' +
response.data.data.fileName;
banners.value[index] = { banners.value[index] = {
bannerUrl: bannerUpload, bannerUrl: bannerUpload,
}; };
...@@ -581,9 +577,7 @@ export default defineComponent({ ...@@ -581,9 +577,7 @@ export default defineComponent({
data: bodyFormData, data: bodyFormData,
})) as AxiosResponse<BaseResponseBody<FileUploadType>>; })) as AxiosResponse<BaseResponseBody<FileUploadType>>;
if (response.data.error.code === config.API_RES_CODE.OK.code) { if (response.data.error.code === config.API_RES_CODE.OK.code) {
const urlStoryUpload = const urlStoryUpload = response.data.data.fileName;
'http://cms.vab.xteldev.com/file/upload/' +
response.data.data.fileName;
stories.value[idxStory].imageUrl = urlStoryUpload; stories.value[idxStory].imageUrl = urlStoryUpload;
} }
} catch (error) {} } catch (error) {}
......
src/pages/khach-hang/customer.ts
View file @ 5b8bf533
...@@ -110,6 +110,7 @@ export default defineComponent({ ...@@ -110,6 +110,7 @@ export default defineComponent({
}, },
]; ];
const userTableRowsCustomer: Ref<CustomerType[]> = ref([]); const userTableRowsCustomer: Ref<CustomerType[]> = ref([]);
const customerInfo: Ref<CustomerType | null> = ref(null);
const showDialog = ref(false); const showDialog = ref(false);
const showDialogUpdate = ref(false); const showDialogUpdate = ref(false);
const pageIndex = ref(1); const pageIndex = ref(1);
...@@ -254,32 +255,57 @@ export default defineComponent({ ...@@ -254,32 +255,57 @@ export default defineComponent({
status.value = 2; status.value = 2;
}; };
const getDetailCustomer = () => { const getDetailCustomer = async (id: number) => {
// gọi api chi tiết cần có id để lấy value cho từng customer try {
// const response = (await api({ const response = (await api({
// url: ..., url: API_PATHS.detailCustomer,
// method: 'GET', method: 'GET',
// params: { params: {
// id: id id: id,
// } },
// })) })) as AxiosResponse<BaseResponseBody<CustomerType>>;
// gọi api lấy chi tiết sau đấy gán giá trị api trả về gán cho các biến userName customerName businessName taxCode... if (response.data.error.code === config.API_RES_CODE.OK.code) {
const fakeDataDetail = { customerInfo.value = response.data.data;
userName: 'Sơn Tùng', showDialogUpdate.value = true;
}; }
userName.value = fakeDataDetail.userName; } catch (error) {}
// Tương tự các biến còn lại
}; };
const openUpdateCustomerDialog = (id: number) => { const openUpdateCustomerDialog = (id: number) => {
showDialogUpdate.value = true; void getDetailCustomer(id);
console.log(id, 'iddd');
void getDetailCustomer();
}; };
//Bấm nút lưu ở dialog update thì gọi api cập nhật trong hàm updateCustomer //Bấm nút lưu ở dialog update thì gọi api cập nhật trong hàm updateCustomer
const updateCustomer = () => { const updateCustomer = async (item: CustomerType) => {
//gọi api update
try { try {
const response = (await api({
url: API_PATHS.updateCustomer,
method: 'POST',
data: {
id: item.id,
code: item.code,
userName: item.userName,
fullName: item.fullName,
companyName: item.companyName,
taxCode: item.taxCode,
email: item.email,
status: item.status,
phone: item.phone,
password: item.password,
address: item.address,
type: item.type,
representative: item.representative,
position: item.position,
level: item.level,
},
})) as AxiosResponse<BaseResponseBody<unknown>>;
if (response.data.error.code === config.API_RES_CODE.OK.code) {
Notify.create({
type: 'positive',
message: i18n.global.t('artist.actionMessages.editArtistAccess'),
});
void getListCustomers();
showDialogUpdate.value = false;
}
} catch (error) {} } catch (error) {}
}; };
...@@ -323,6 +349,7 @@ export default defineComponent({ ...@@ -323,6 +349,7 @@ export default defineComponent({
changePageSize, changePageSize,
getCustomerLevelOptions, getCustomerLevelOptions,
confirmDeleteCustomer, confirmDeleteCustomer,
customerInfo,
}; };
}, },
}); });
src/pages/khach-hang/index.vue
View file @ 5b8bf533
...@@ -134,25 +134,13 @@ ...@@ -134,25 +134,13 @@
@addNewCustomer="addCustomer" @addNewCustomer="addCustomer"
></AddNewCustomerDialogComponent> ></AddNewCustomerDialogComponent>
<!-- <UpdateNewCustomerDialogComponent <UpdateNewCustomerDialogComponent
v-model:show-dialog-update="showDialogUpdate" v-model:show-dialog-update="showDialogUpdate"
v-model:user-name="userName" :level-options="levelOptions"
v-model:customer-name="customerName" :customer-info="customerInfo"
v-model:business-name="businessName"
v-model:tax-code="taxCode"
v-model:email="email"
v-model:ratings="ratings"
v-model:address="address"
v-model:business-type="businessType"
v-model:representative="representative"
v-model:position="position"
v-model:phone="phone"
v-model:status="status"
:ratings-options="ratingsOptions"
:business-type-options="businessTypeOptions"
@click:CloseBtn="showDialogUpdate = false" @click:CloseBtn="showDialogUpdate = false"
@updateNewCustomer="updateCustomer" @editCustomer="updateCustomer"
></UpdateNewCustomerDialogComponent> --> ></UpdateNewCustomerDialogComponent>
</div> </div>
</div> </div>
</div> </div>
......
src/pages/them-nghe-sy/AddArtist.ts
View file @ 5b8bf533
import { defineComponent, onMounted, ref, Ref } from 'vue'; import { defineComponent, onMounted, ref, Ref, watch } from 'vue';
import { api, BaseResponseBody } from 'src/boot/axios'; import { api, BaseResponseBody } from 'src/boot/axios';
import { API_PATHS, config } from 'src/assets/configurations'; import { API_PATHS, config } from 'src/assets/configurations';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { AxiosResponse } from 'axios'; import { AxiosResponse } from 'axios';
// import moment from 'moment'; import moment from 'moment';
import { i18n } from 'src/boot/i18n'; import { i18n } from 'src/boot/i18n';
import { Dialog, Notify } from 'quasar'; import { Dialog, Notify } from 'quasar';
import { Router } from 'src/router'; import { Router } from 'src/router';
...@@ -21,7 +21,7 @@ import UpdateHotProduct from 'components/artist-information/UpdateHotProduct/ind ...@@ -21,7 +21,7 @@ import UpdateHotProduct from 'components/artist-information/UpdateHotProduct/ind
import AddStory from 'components/artist-information/VAB-account/add-story/index.vue'; import AddStory from 'components/artist-information/VAB-account/add-story/index.vue';
import { import {
// ArtistInfoType, ArtistInfoType,
FieldType, FieldType,
NationalityType, NationalityType,
ArtistLevelType, ArtistLevelType,
...@@ -36,14 +36,13 @@ import { ...@@ -36,14 +36,13 @@ import {
TypeCardType, TypeCardType,
FileUploadType, FileUploadType,
} from 'src/assets/type'; } from 'src/assets/type';
import { isEmail } from '../../boot/functions';
import { isMobilePhone } from '../../boot/functions';
export type AvatarType = { export type AvatarType = {
file?: File; file?: File;
url?: string | null; url?: string | null;
}; };
// export type Story = {
// story?:object |
// };
export default defineComponent({ export default defineComponent({
components: { components: {
PersonalInformation, PersonalInformation,
...@@ -91,19 +90,19 @@ export default defineComponent({ ...@@ -91,19 +90,19 @@ export default defineComponent({
const avatarUploaded: Ref<string | null> = ref(null); const avatarUploaded: Ref<string | null> = ref(null);
const artistCode: Ref<string> = ref(''); const artistCode: Ref<string> = ref('');
const fullName: Ref<string> = ref(''); const fullName: Ref<string> = ref('');
const artistName: Ref<string | null | undefined> = ref(); const artistName: Ref<string | null> = ref(null);
const birthday: Ref<string | null> = ref(null); const birthday: Ref<string | null> = ref(null);
const sex: Ref<number | undefined> = ref(); const sex: Ref<number | null> = ref(null);
const nationality: Ref<NationalityType | null> = ref(null); const nationality: Ref<NationalityType | null> = ref(null);
const qualification: Ref<QualificationType | null> = ref(null); const qualification: Ref<QualificationType | null> = ref(null);
const artistLevel: Ref<ArtistLevelType | null> = ref(null); const artistLevel: Ref<ArtistLevelType | null> = ref(null);
const address: Ref<string | null | undefined> = ref(); const address: Ref<string | null> = ref(null);
const status: Ref<number> = ref(1); const status: Ref<number> = ref(1);
const fields: Ref<FieldType[]> = ref([]); const fields: Ref<FieldType[]> = ref([]);
const works: Ref<WorkType[]> = ref([]); const works: Ref<WorkType[]> = ref([]);
const phoneNumber: Ref<string | null | undefined> = ref(); const phoneNumber: Ref<string | null> = ref(null);
const email: Ref<string | null | undefined> = ref(); const email: Ref<string | null> = ref(null);
const facebook: Ref<string | null | undefined> = ref(); const facebook: Ref<string | null> = ref(null);
const facebookMessage: Ref<string | null | undefined> = ref(); const facebookMessage: Ref<string | null | undefined> = ref();
const instagram: Ref<string | null | undefined> = ref(); const instagram: Ref<string | null | undefined> = ref();
const whatsapp: Ref<string | null | undefined> = ref(); const whatsapp: Ref<string | null | undefined> = ref();
...@@ -121,12 +120,139 @@ export default defineComponent({ ...@@ -121,12 +120,139 @@ export default defineComponent({
const rowBankAccIdx: Ref<number> = ref(0); const rowBankAccIdx: Ref<number> = ref(0);
const rowDataAccBank: Ref<BankAccountType | null> = ref(null); const rowDataAccBank: Ref<BankAccountType | null> = ref(null);
//satate hot product //state hot product
const products: Ref<ProductType[]> = ref([]); const products: Ref<ProductType[]> = ref([]);
const statusHotProduct: Ref<number> = ref(2); const statusHotProduct: Ref<number> = ref(2);
const DataInsertHotProduct: Ref<ProductType | null> = ref(null); const DataInsertHotProduct: Ref<ProductType | null> = ref(null);
const DataUpdateHotProduct: Ref<ProductType | null> = ref(null); const DataUpdateHotProduct: Ref<ProductType | null> = ref(null);
//sate error input thong-tin-ca-nhan
const artistCodeRules = ref(false);
const fullNameRules = ref(false);
const artistNameRules = ref(false);
const birthdayRules = ref(false);
const emailRules = ref(false);
const addressRules = ref(false);
const phoneNumberRules = ref(false);
const sexRules = ref(false);
const nationalityRules = ref(false);
const fieldRules = ref(false);
const workRules = ref(false);
const qualificationRules = ref(false);
const artistLevelRules = ref(false);
const errorMessEmail = ref(
i18n.global.t('artist.artistInformation.validateMessages.requireEmail')
);
const errorMessPhoneNumber = ref(
i18n.global.t(
'artist.artistInformation.validateMessages.requirePhoneNumber'
)
);
watch(
() => artistCode.value,
(value) => {
if (value) {
artistCodeRules.value = false;
}
}
);
watch(
() => fullName.value,
(value) => {
if (value) {
fullNameRules.value = false;
}
}
);
watch(
() => artistName.value,
(value) => {
if (value) {
artistNameRules.value = false;
}
}
);
watch(
() => birthday.value,
(value) => {
if (value) {
birthdayRules.value = false;
}
}
);
watch(
() => email.value,
(value) => {
if (value) {
emailRules.value = false;
}
}
);
watch(
() => address.value,
(value) => {
if (value) {
addressRules.value = false;
}
}
);
watch(
() => phoneNumber.value,
(value) => {
if (value) {
phoneNumberRules.value = false;
}
}
);
watch(
() => sex.value,
(value) => {
if (value) {
sexRules.value = false;
}
}
);
watch(
() => nationality.value,
(value) => {
if (value) {
nationalityRules.value = false;
}
}
);
watch(
() => fields.value,
(value) => {
if (value) {
fieldRules.value = false;
}
}
);
watch(
() => works.value,
(value) => {
if (value) {
workRules.value = false;
}
}
);
watch(
() => qualification.value,
(value) => {
if (value) {
qualificationRules.value = false;
}
}
);
watch(
() => artistLevel.value,
(value) => {
if (value) {
artistLevelRules.value = false;
}
}
);
const getFieldOptions = async () => { const getFieldOptions = async () => {
const response = (await api({ const response = (await api({
url: API_PATHS.getFieldOptions, url: API_PATHS.getFieldOptions,
...@@ -261,6 +387,8 @@ export default defineComponent({ ...@@ -261,6 +387,8 @@ export default defineComponent({
}; };
const selectedFile = (value: BannerType) => { const selectedFile = (value: BannerType) => {
console.log(value, 'banners');
banners.value.push(value); banners.value.push(value);
console.log(banners.value); console.log(banners.value);
}; };
...@@ -295,7 +423,7 @@ export default defineComponent({ ...@@ -295,7 +423,7 @@ export default defineComponent({
DataUpdateHotProduct.value = value; DataUpdateHotProduct.value = value;
}; };
const setAvatar = (value: BannerType) => { const setAvatar = (value: BannerType) => {
console.log(value); console.log(value, 'avatarFile');
avatarFile.value = value.file as File; avatarFile.value = value.file as File;
avatar.value = value.url as string; avatar.value = value.url as string;
}; };
...@@ -326,10 +454,7 @@ export default defineComponent({ ...@@ -326,10 +454,7 @@ export default defineComponent({
const addStory = (value: StoriesType) => { const addStory = (value: StoriesType) => {
stories.value.push(value); stories.value.push(value);
}; console.log(stories, 'storiesstoriesstories');
const UpdateBirtday = (value: string) => {
// console.log(value);
birthday.value = value;
}; };
const deleteStory = (idx: number) => { const deleteStory = (idx: number) => {
...@@ -354,7 +479,12 @@ export default defineComponent({ ...@@ -354,7 +479,12 @@ export default defineComponent({
stories.value.splice(idx, 1); stories.value.splice(idx, 1);
}); });
}; };
const UpdateBirtday = (value: string) => {
// console.log(value);
console.log(value, 'birthdayyyy');
birthday.value = value;
};
const callApiUploadAvatar = async (file: File) => { const callApiUploadAvatar = async (file: File) => {
try { try {
const bodyFormData = new FormData(); const bodyFormData = new FormData();
...@@ -366,9 +496,7 @@ export default defineComponent({ ...@@ -366,9 +496,7 @@ export default defineComponent({
data: bodyFormData, data: bodyFormData,
})) as AxiosResponse<BaseResponseBody<FileUploadType>>; })) as AxiosResponse<BaseResponseBody<FileUploadType>>;
if (response.data.error.code === config.API_RES_CODE.OK.code) { if (response.data.error.code === config.API_RES_CODE.OK.code) {
avatarUploaded.value = avatarUploaded.value = response.data.data.fileName;
'http://cms.vab.xteldev.com/file/upload/' +
response.data.data.fileName;
} }
} catch (error) {} } catch (error) {}
}; };
...@@ -383,9 +511,7 @@ export default defineComponent({ ...@@ -383,9 +511,7 @@ export default defineComponent({
data: bodyFormData, data: bodyFormData,
})) as AxiosResponse<BaseResponseBody<FileUploadType>>; })) as AxiosResponse<BaseResponseBody<FileUploadType>>;
if (response.data.error.code === config.API_RES_CODE.OK.code) { if (response.data.error.code === config.API_RES_CODE.OK.code) {
const bannerUpload = const bannerUpload = response.data.data.fileName;
'http://cms.vab.xteldev.com/file/upload/' +
response.data.data.fileName;
banners.value[index] = { banners.value[index] = {
bannerUrl: bannerUpload, bannerUrl: bannerUpload,
}; };
...@@ -403,19 +529,96 @@ export default defineComponent({ ...@@ -403,19 +529,96 @@ export default defineComponent({
data: bodyFormData, data: bodyFormData,
})) as AxiosResponse<BaseResponseBody<FileUploadType>>; })) as AxiosResponse<BaseResponseBody<FileUploadType>>;
if (response.data.error.code === config.API_RES_CODE.OK.code) { if (response.data.error.code === config.API_RES_CODE.OK.code) {
const urlStoryUpload = const urlStoryUpload = response.data.data.fileName;
'http://cms.vab.xteldev.com/file/upload/' +
response.data.data.fileName;
stories.value[idxStory].imageUrl = urlStoryUpload; stories.value[idxStory].imageUrl = urlStoryUpload;
} }
} catch (error) {} } catch (error) {}
}; };
const checkValidate = () => {
let hasError = false;
if (!artistCode.value || !artistCode.value?.trim().length) {
hasError = true;
artistCodeRules.value = true;
}
if (!fullName.value || !fullName.value?.trim().length) {
hasError = true;
fullNameRules.value = true;
}
if (!artistName.value || !artistName.value?.trim().length) {
hasError = true;
artistNameRules.value = true;
}
if (!address.value || !address.value.trim().length) {
hasError = true;
addressRules.value = true;
}
if (!birthday.value || !birthday.value?.trim().length) {
hasError = true;
birthdayRules.value = true;
}
if (sex.value === null) {
hasError = true;
sexRules.value = true;
}
if (!phoneNumber.value || !phoneNumber.value?.trim().length) {
hasError = true;
phoneNumberRules.value = true;
errorMessPhoneNumber.value = i18n.global.t(
'artist.artistInformation.validateMessages.requirePhoneNumber'
);
}
if (!isMobilePhone(phoneNumber.value as string)) {
hasError = true;
phoneNumberRules.value = true;
errorMessPhoneNumber.value = i18n.global.t(
'artist.artistInformation.validateMessages.isPhone'
);
}
if (!email.value || !email.value?.trim().length) {
hasError = true;
emailRules.value = true;
errorMessEmail.value = i18n.global.t(
'artist.artistInformation.validateMessages.requireEmail'
);
}
if (!isEmail(email.value as string)) {
hasError = true;
emailRules.value = true;
errorMessEmail.value = i18n.global.t(
'artist.artistInformation.validateMessages.isEmail'
);
}
if (artistLevel.value === null) {
hasError = true;
artistLevelRules.value = true;
}
if (!fields.value.length) {
hasError = true;
fieldRules.value = true;
}
if (nationality.value === null) {
hasError = true;
nationalityRules.value = true;
}
if (qualification.value === null) {
hasError = true;
qualificationRules.value = true;
}
if (!works.value.length) {
hasError = true;
workRules.value = true;
}
if (hasError === false) {
void addArtist();
}
};
const addArtist = async () => { const addArtist = async () => {
try { try {
if (avatarFile.value !== null) { if (avatarFile.value !== null) {
await callApiUploadAvatar(avatarFile.value); await callApiUploadAvatar(avatarFile.value);
} } else avatarUploaded.value = avatar.value;
for (let index = 0; index < banners.value.length; index++) { for (let index = 0; index < banners.value.length; index++) {
const element = banners.value[index]; const element = banners.value[index];
if (element.file !== undefined) { if (element.file !== undefined) {
...@@ -428,6 +631,7 @@ export default defineComponent({ ...@@ -428,6 +631,7 @@ export default defineComponent({
await callApiUploadStories(item.file, idx); await callApiUploadStories(item.file, idx);
} }
} }
const response = (await api({ const response = (await api({
url: API_PATHS.addArtist, url: API_PATHS.addArtist,
method: 'POST', method: 'POST',
...@@ -472,10 +676,6 @@ export default defineComponent({ ...@@ -472,10 +676,6 @@ export default defineComponent({
} }
} catch (error) {} } catch (error) {}
}; };
const deleteImagesStories = (value: number) => {
console.log(value, 'deleteImagesStories');
console.log(stories.value);
};
const DeleteItemStories = (value: StoriesType) => { const DeleteItemStories = (value: StoriesType) => {
for (let i = 0; i < stories.value.length; i++) { for (let i = 0; i < stories.value.length; i++) {
if (stories.value[i].id == value.id) { if (stories.value[i].id == value.id) {
...@@ -569,7 +769,6 @@ export default defineComponent({ ...@@ -569,7 +769,6 @@ export default defineComponent({
avatar, avatar,
setAvatar, setAvatar,
deleteAvatar, deleteAvatar,
deleteImagesStories,
DeleteItemStories, DeleteItemStories,
confirmDeleteSocialEmbedded, confirmDeleteSocialEmbedded,
changeEmbed, changeEmbed,
...@@ -577,6 +776,22 @@ export default defineComponent({ ...@@ -577,6 +776,22 @@ export default defineComponent({
addStory, addStory,
deleteStory, deleteStory,
UpdateBirtday, UpdateBirtday,
checkValidate,
artistCodeRules,
fullNameRules,
artistNameRules,
birthdayRules,
emailRules,
addressRules,
phoneNumberRules,
sexRules,
nationalityRules,
fieldRules,
workRules,
qualificationRules,
artistLevelRules,
errorMessEmail,
errorMessPhoneNumber,
}; };
}, },
}); });
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