Skip to content

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

update validate

parent 57de0b0b
Show whitespace changes
Inline Side-by-side
Showing with 323 additions and 137 deletions
src/components/artist-information/VAB-account/index.vue
View file @ e0d755d3
<template>
<div class="row q-col-gutter-sm" style="max-height: 750px">
<div class="row q-col-gutter-sm" style="max-height: calc(100vh - 14rem)">
<div class="col-12 text-uppercase text-weight-medium">Tài khoản VAB</div>
<br />
<div class="col-auto flex flex-center justify-start">
......
src/components/artist-information/bank-account/index.vue
View file @ e0d755d3
<template>
<div class="row q-col-gutter-sm flex-center">
<div
class="row q-col-gutter-sm flex-center"
style="max-height: calc(100vh - 14rem)"
>
<q-space></q-space>
<div class="col-auto">
<q-btn
......
src/components/artist-information/hot-product/index.vue
View file @ e0d755d3
<template>
<div class="row q-col-gutter-sm flex-center">
<div
class="row q-col-gutter-sm flex-center"
style="max-height: calc(100vh - 14rem)"
>
<q-space></q-space>
<div class="col-auto">
<q-btn
......
src/components/artist-information/personal-information/PersonalInformation.ts
View file @ e0d755d3
......@@ -32,6 +32,19 @@ export default defineComponent({
professionOptions: { type: Array, required: true },
artistLevelOptions: { type: Array, required: true },
workOptions: { type: Array, required: true },
artistCodeRules: { type: Boolean, required: true },
fullNameRules: { type: Boolean, required: true },
artistNameRules: { type: Boolean, required: true },
birthdayRules: { type: Boolean, required: true },
emailRules: { type: Boolean, required: true },
addressRules: { type: Boolean, required: true },
phoneNumberRules: { type: Boolean, required: true },
sexRules: { type: Boolean, required: true },
nationalityRules: { type: Boolean, required: true },
fieldRules: { type: Boolean, required: true },
workRules: { type: Boolean, required: true },
qualificationRules: { type: Boolean, required: true },
artistLevelRules: { type: Boolean, required: true },
},
components: {
UploadImage,
......@@ -46,6 +59,7 @@ export default defineComponent({
url: URL.createObjectURL(value[0]),
});
};
const upload = ref(null);
const uploadBanner = () => {
// eslint-disable-next-line
......@@ -53,95 +67,6 @@ export default defineComponent({
// eslint-disable-next-line
upload.value?.click();
};
const artistCodeRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t(
'artist.artistInformation.validateMessages.requireArtistCode'
),
];
const fullNameRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t(
'artist.artistInformation.validateMessages.requireFullName'
),
];
const artistNameRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t(
'artist.artistInformation.validateMessages.requireArtistName'
),
];
const birthdayRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t(
'artist.artistInformation.validateMessages.requireBirthday'
),
];
const emailRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t('artist.artistInformation.validateMessages.requireEmail'),
(val: string) =>
isEmail(val) ||
i18n.global.t('artist.artistInformation.validateMessages.isEmail'),
];
const addressRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t(
'artist.artistInformation.validateMessages.requireAddress'
),
];
const phoneNumberRules = [
(val?: string) =>
(val && val.trim().length) ||
i18n.global.t(
'artist.artistInformation.validateMessages.requirePhoneNumber'
),
(val: string) =>
isMobilePhone(val) ||
i18n.global.t('artist.artistInformation.validateMessages.isPhone'),
];
const sexRules = [
(val?: number) =>
val !== undefined ||
i18n.global.t('artist.artistInformation.validateMessages.requireSex'),
];
const nationalityRules = [
(val?: number) =>
val !== undefined ||
i18n.global.t(
'artist.artistInformation.validateMessages.requireNationality'
),
];
const fieldRules = [
(val?: number) =>
val !== undefined ||
i18n.global.t('artist.artistInformation.validateMessages.requireField'),
];
const workRules = [
(val?: number) =>
val !== undefined ||
i18n.global.t('artist.artistInformation.validateMessages.requiredWork'),
];
const qualificationRules = [
(val?: number) =>
val !== undefined ||
i18n.global.t(
'artist.artistInformation.validateMessages.requireQualification'
),
];
const artistLevelRules = [
(val?: number) =>
val !== undefined ||
i18n.global.t(
'artist.artistInformation.validateMessages.requireArtistLevel'
),
];
const deleteAvatar = () => {
console.log('object');
context.emit('deleteAvatar');
......@@ -163,20 +88,47 @@ export default defineComponent({
openDialog.value = false;
};
const errorMessArtistCode = i18n.global.t(
'artist.artistInformation.validateMessages.requireArtistCode'
);
const errorMessFullName = i18n.global.t(
'artist.artistInformation.validateMessages.requireFullName'
);
const errorMessArtistName = i18n.global.t(
'artist.artistInformation.validateMessages.requireArtistName'
);
const errorMessBirthday = i18n.global.t(
'artist.artistInformation.validateMessages.requireBirthday'
);
const errorMessSex = i18n.global.t(
'artist.artistInformation.validateMessages.requireSex'
);
const errorMessNationality = i18n.global.t(
'artist.artistInformation.validateMessages.requireNationality'
);
const errorMessAddress = i18n.global.t(
'artist.artistInformation.validateMessages.requireAddress'
);
const errorMessFields = i18n.global.t(
'artist.artistInformation.validateMessages.requireField'
);
const errorMessWorks = i18n.global.t(
'artist.artistInformation.validateMessages.requiredWork'
);
const errorMessQualification = i18n.global.t(
'artist.artistInformation.validateMessages.requireQualification'
);
const errorMessArtistLevel = i18n.global.t(
'artist.artistInformation.validateMessages.requireArtistLevel'
);
const errorMessPhoneNumber = i18n.global.t(
'artist.artistInformation.validateMessages.requirePhoneNumber'
);
const errorMessEmail = i18n.global.t(
'artist.artistInformation.validateMessages.requireEmail'
);
return {
artistCodeRules,
fullNameRules,
artistNameRules,
birthdayRules,
emailRules,
addressRules,
phoneNumberRules,
sexRules,
nationalityRules,
fieldRules,
workRules,
qualificationRules,
artistLevelRules,
upload,
uploadBanner,
selectedFile,
......@@ -187,6 +139,19 @@ export default defineComponent({
openDialog,
onOKClick,
onCancelClick,
errorMessArtistCode,
errorMessFullName,
errorMessArtistName,
errorMessBirthday,
errorMessSex,
errorMessNationality,
errorMessAddress,
errorMessFields,
errorMessWorks,
errorMessQualification,
errorMessArtistLevel,
errorMessPhoneNumber,
errorMessEmail,
};
},
emits: [
......
src/components/artist-information/personal-information/index.vue
View file @ e0d755d3
<template>
<div class="row q-col-gutter-sm q-mt-md">
<div
class="row q-col-gutter-sm q-mt-md"
style="max-height: calc(100vh - 15rem)"
>
<q-space></q-space>
<div class="col-5">
<div class="row q-mt-sm flex-center">
......@@ -47,7 +50,8 @@
<q-input
:model-value="artistCode"
@update:model-value="$emit('update:artistCode', $event)"
:rules="artistCodeRules"
:error="artistCodeRules"
:error-message="errorMessArtistCode"
outlined
dense
hide-bottom-space
......@@ -62,8 +66,9 @@
<div class="col-8">
<q-input
:model-value="fullName"
:rules="fullNameRules"
@update:model-value="$emit('update:fullName', $event)"
:error="fullNameRules"
:error-message="errorMessFullName"
outlined
dense
hide-bottom-space
......@@ -79,7 +84,8 @@
<q-input
:model-value="artistName"
@update:model-value="$emit('update:artistName', $event)"
:rules="artistNameRules"
:error="artistNameRules"
:error-message="errorMessArtistName"
outlined
dense
hide-bottom-space
......@@ -95,7 +101,8 @@
<q-input
:model-value="birthday"
@update:model-value="$emit('update:birthday', $event)"
:rules="birthdayRules"
:error="birthdayRules"
:error-message="errorMessBirthday"
class="q-my-sm"
outlined
@click="openDialog = true"
......@@ -135,7 +142,8 @@
:model-value="sex"
@update:model-value="$emit('update:sex', $event)"
:options="sexOptions"
:rules="sexRules"
:error="sexRules"
:error-message="errorMessSex"
emit-value
map-options
option-value="id"
......@@ -159,7 +167,8 @@
:model-value="nationality"
@update:model-value="$emit('update:nationality', $event)"
:options="nationalityOptions"
:rules="nationalityRules"
:error="nationalityRules"
:error-message="errorMessNationality"
map-options
option-value="id"
option-label="name"
......@@ -172,7 +181,7 @@
></q-select>
</div>
</div>
<div class="row q-mt-xs flex-center">
<div class="row q-mt-xs q-mb-md flex-center">
<div class="col-3 text-weight-medium">
{{ $t('artist.artistInformation.titleDataField.address') }}
<span style="color: red">*</span>
......@@ -181,7 +190,8 @@
<q-input
:model-value="address"
@update:model-value="$emit('update:address', $event)"
:rules="addressRules"
:error="addressRules"
:error-message="errorMessAddress"
outlined
hide-bottom-space
dense
......@@ -200,7 +210,8 @@
<q-select
:model-value="fields"
@update:model-value="$emit('update:fields', $event)"
:rules="fieldRules"
:error="fieldRules"
:error-message="errorMessFields"
:options="fieldOptions"
map-options
option-value="id"
......@@ -225,8 +236,9 @@
<div class="col-8">
<q-select
:model-value="works"
:rules="workRules"
@update:model-value="$emit('update:works', $event)"
:error="workRules"
:error-message="errorMessWorks"
:options="workOptions"
map-options
option-value="id"
......@@ -253,7 +265,8 @@
:model-value="qualification"
@update:model-value="$emit('update:qualification', $event)"
:options="professionOptions"
:rules="qualificationRules"
:error="qualificationRules"
:error-message="errorMessQualification"
map-options
option-value="id"
option-label="name"
......@@ -275,8 +288,9 @@
<q-select
:model-value="artistLevel"
@update:model-value="$emit('update:artistLevel', $event)"
:rules="artistLevelRules"
:options="artistLevelOptions"
:error="artistLevelRules"
:error-message="errorMessArtistLevel"
map-options
option-value="id"
option-label="name"
......@@ -298,7 +312,8 @@
<q-input
:model-value="phoneNumber"
@update:model-value="$emit('update:phoneNumber', $event)"
:rules="phoneNumberRules"
:error="phoneNumberRules"
:error-message="errorMessPhoneNumber"
outlined
dense
hide-bottom-space
......@@ -314,7 +329,8 @@
<q-input
:model-value="email"
@update:model-value="$emit('update:email', $event)"
:rules="emailRules"
:error="emailRules"
:error-message="errorMessEmail"
outlined
dense
hide-bottom-space
......
src/css/app.scss
View file @ e0d755d3
// app global css in SCSS form
.sticky-header-table {
// / height or max-height is important /
max-height: calc(100vh - 11rem);
max-height: calc(100vh - 13rem);
.q-table__top,
.q-table__bottom,
......
src/pages/cap-nhat-thong-tin-nghe-sy/index.vue
View file @ e0d755d3
......@@ -52,6 +52,19 @@
v-model:facebook-message="facebookMessage"
v-model:instagram="instagram"
v-model:whatsapp="whatsapp"
:artistCodeRules="artistCodeRules"
:fullNameRules="fullNameRules"
:artistNameRules="artistNameRules"
:birthdayRules="birthdayRules"
:emailRules="emailRules"
:addressRules="addressRules"
:phoneNumberRules="phoneNumberRules"
:sexRules="sexRules"
:nationalityRules="nationalityRules"
:fieldRules="fieldRules"
:workRules="workRules"
:qualificationRules="qualificationRules"
:artistLevelRules="artistLevelRules"
:sex-options="sexOptions"
:field-options="fieldOptions"
:nationality-options="nationalityOptions"
......@@ -76,7 +89,6 @@
:social-embedded="socialEmbedded"
:banners="banners"
:stories="stories"
@deleteImagesStories="deleteImagesStories($event)"
@deleteStories="DeleteItemStories"
@click:openAddStoryDialog="isOpenAddStory = true"
@confirmDeleteStory="deleteStory"
......@@ -165,7 +177,7 @@
color="primary"
no-caps
:label="$t('crudActions.update')"
@click="updateInformationArtist"
@click="checkValidate"
></q-btn>
</div>
</div>
......
src/pages/cap-nhat-thong-tin-nghe-sy/updateInformationArtist.ts
View file @ e0d755d3
import { defineComponent, onMounted, ref, Ref } from 'vue';
import { defineComponent, onMounted, ref, Ref, watch } from 'vue';
import { api, BaseResponseBody } from 'src/boot/axios';
import { API_PATHS, config } from 'src/assets/configurations';
import { useRoute } from 'vue-router';
......@@ -91,19 +91,19 @@ export default defineComponent({
const avatarUploaded: Ref<string | null> = ref(null);
const artistCode: 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 sex: Ref<number | undefined> = ref();
const sex: Ref<number | null> = ref(null);
const nationality: Ref<NationalityType | null> = ref(null);
const qualification: Ref<QualificationType | 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 fields: Ref<FieldType[]> = ref([]);
const works: Ref<WorkType[]> = ref([]);
const phoneNumber: Ref<string | null | undefined> = ref();
const email: Ref<string | null | undefined> = ref();
const facebook: Ref<string | null | undefined> = ref();
const phoneNumber: Ref<string | null> = ref(null);
const email: Ref<string | null> = ref(null);
const facebook: Ref<string | null> = ref(null);
const facebookMessage: Ref<string | null | undefined> = ref();
const instagram: Ref<string | null | undefined> = ref();
const whatsapp: Ref<string | null | undefined> = ref();
......@@ -121,12 +121,131 @@ export default defineComponent({
const rowBankAccIdx: Ref<number> = ref(0);
const rowDataAccBank: Ref<BankAccountType | null> = ref(null);
//satate hot product
//state hot product
const products: Ref<ProductType[]> = ref([]);
const statusHotProduct: Ref<number> = ref(2);
const DataInsertHotProduct: 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);
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 getInformationArtist = async () => {
const response = (await api({
url: API_PATHS.getDetailArtist,
......@@ -463,11 +582,69 @@ export default defineComponent({
}
} 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;
}
if (!email.value || !email.value?.trim().length) {
hasError = true;
emailRules.value = true;
}
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 updateInformationArtist();
}
};
const updateInformationArtist = async () => {
try {
if (avatarFile.value !== null) {
await callApiUploadAvatar(avatarFile.value);
}
} else avatarUploaded.value = avatar.value;
for (let index = 0; index < banners.value.length; index++) {
const element = banners.value[index];
if (element.file !== undefined) {
......@@ -480,6 +657,7 @@ export default defineComponent({
await callApiUploadStories(item.file, idx);
}
}
const response = (await api({
url: API_PATHS.updateArtist,
method: 'POST',
......@@ -524,10 +702,6 @@ export default defineComponent({
}
} catch (error) {}
};
const deleteImagesStories = (value: number) => {
console.log(value, 'deleteImagesStories');
console.log(stories.value);
};
const DeleteItemStories = (value: StoriesType) => {
for (let i = 0; i < stories.value.length; i++) {
if (stories.value[i].id == value.id) {
......@@ -623,7 +797,6 @@ export default defineComponent({
avatar,
setAvatar,
deleteAvatar,
deleteImagesStories,
DeleteItemStories,
confirmDeleteSocialEmbedded,
changeEmbed,
......@@ -631,6 +804,20 @@ export default defineComponent({
addStory,
deleteStory,
UpdateBirtday,
checkValidate,
artistCodeRules,
fullNameRules,
artistNameRules,
birthdayRules,
emailRules,
addressRules,
phoneNumberRules,
sexRules,
nationalityRules,
fieldRules,
workRules,
qualificationRules,
artistLevelRules,
};
},
});
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