format code

parent 51520254
import { defineComponent } from 'vue';
import { i18n } from 'src/boot/i18n';
import { isEmail } from '../../../boot/functions';
import { isMobilePhone } from '../../../boot/functions';
export default defineComponent({
props: {
isOpenNewArtistDialog: {
type: Boolean,
required: true,
},
artistCode: { type: String, required: true },
fullName: { type: String, required: true },
artistName: { type: String, required: true },
birthday: { type: String, required: true },
sex: { type: Number, required: true },
nationality: { type: Number, required: true },
status: { type: Number, required: true },
address: { type: String, required: true },
field: { type: Number, required: true },
work: { type: Number, required: true },
qualification: { type: Number, required: true },
artistLevel: { type: Number, required: true },
phoneNumber: { type: String, required: true },
email: { type: String, required: true },
facebook: { type: String, required: true },
facebookMessage: { type: String, required: true },
instagram: { type: String, required: true },
whatsapp: { type: String, required: true },
sexOptions: { type: Array, required: true },
fieldOptions: { type: Array, required: true },
nationalityOptions: { type: Array, required: true },
professionOptions: { type: Array, required: true },
artistLevelOptions: { type: Array, required: true },
workOptions: { type: Array, required: true },
},
setup() {
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 !== undefined ||
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'
),
];
return {
artistCodeRules,
fullNameRules,
artistNameRules,
birthdayRules,
emailRules,
addressRules,
phoneNumberRules,
sexRules,
nationalityRules,
fieldRules,
workRules,
qualificationRules,
artistLevelRules,
};
},
emits: [
'update:isOpenNewArtistDialog',
'click:CloseBtn',
'update:artistCode',
'update:fullName',
'update:artistName',
'update:birthday',
'update:email',
'update:facebook',
'update:facebookMessage',
'update:instagram',
'update:whatsapp',
'update:address',
'update:phoneNumber',
'update:sex',
'update:nationality',
'update:field',
'update:work',
'update:qualification',
'update:artistLevel',
'update:status',
'addNewArtist',
],
});
<template>
<q-dialog
persistent
:model-value="isOpenNewArtistDialog"
@update:model-value="$emit('update:isOpenNewArtistDialog', $event)"
>
<q-card style="min-width: 900px" bordered>
<q-form greedy @submit.prevent="$emit('addNewArtist')">
<q-card-section>
<q-item>t
<q-item-section>
<q-item-label class="text-h6 text-weight-regular">{{
$t('artist.dialogLabel.title.addArtist')
}}</q-item-label>
</q-item-section>
</q-item>
</q-card-section>
<q-separator />
<q-card-section>
<div class="row q-col-gutter-sm">
<div class="col-6">
<q-input
:model-value="artistCode"
@update:model-value="$emit('update:artistCode', $event)"
:label="
$t('artist.artistInformation.titleDataField.artistCode')
"
type="text"
class="q-my-sm"
outlined
:rules="artistCodeRules"
hide-bottom-space
clearable
></q-input>
<q-input
:model-value="fullName"
@update:model-value="$emit('update:fullName', $event)"
:label="$t('artist.artistInformation.titleDataField.fullName')"
:rules="fullNameRules"
hide-bottom-space
type="text"
class="q-my-sm"
outlined
clearable
></q-input>
<q-input
:model-value="artistName"
@update:model-value="$emit('update:artistName', $event)"
:label="
$t('artist.artistInformation.titleDataField.artistName')
"
type="text"
class="q-my-sm"
outlined
:rules="artistNameRules"
hide-bottom-space
clearable
></q-input>
<q-input
:model-value="birthday"
@update:model-value="$emit('update:birthday', $event)"
:label="$t('artist.artistInformation.titleDataField.birthday')"
type="text"
class="q-my-sm"
outlined
:rules="birthdayRules"
hide-bottom-space
clearable
></q-input>
<q-input
:model-value="email"
@update:model-value="$emit('update:email', $event)"
:label="$t('artist.artistInformation.titleDataField.email')"
type="text"
class="q-my-sm"
outlined
:rules="emailRules"
hide-bottom-space
clearable
></q-input>
<q-input
:model-value="facebook"
@update:model-value="$emit('update:facebook', $event)"
:label="$t('artist.artistInformation.titleDataField.facebook')"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-input>
<q-input
:model-value="facebookMessage"
@update:model-value="$emit('update:facebookMessage', $event)"
:label="
$t('artist.artistInformation.titleDataField.facebookMessage')
"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-input>
<q-input
:model-value="instagram"
@update:model-value="$emit('update:instagram', $event)"
:label="$t('artist.artistInformation.titleDataField.instagram')"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-input>
<q-input
:model-value="whatsapp"
@update:model-value="$emit('update:whatsapp', $event)"
:label="$t('artist.artistInformation.titleDataField.whatsapp')"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-input>
</div>
<div class="col-6">
<q-input
:model-value="address"
@update:model-value="$emit('update:address', $event)"
:label="$t('artist.artistInformation.titleDataField.address')"
type="text"
class="q-my-sm"
outlined
:rules="addressRules"
hide-bottom-space
clearable
></q-input>
<q-input
:model-value="phoneNumber"
@update:model-value="$emit('update:phoneNumber', $event)"
:label="
$t('artist.artistInformation.titleDataField.phoneNumber')
"
type="text"
class="q-my-sm"
outlined
:rules="phoneNumberRules"
hide-bottom-space
clearable
></q-input>
<q-select
:model-value="sex"
@update:model-value="$emit('update:sex', $event)"
:label="$t('artist.artistInformation.titleDataField.sex')"
:rules="sexRules"
:options="sexOptions"
emit-value
map-options
option-value="id"
option-label="name"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-select>
<q-select
:model-value="nationality"
@update:model-value="$emit('update:nationality', $event)"
:label="
$t('artist.artistInformation.titleDataField.nationality')
"
:options="nationalityOptions"
:rules="nationalityRules"
emit-value
map-options
option-value="id"
option-label="name"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-select>
<q-select
:model-value="field"
@update:model-value="$emit('update:field', $event)"
:label="$t('artist.artistInformation.titleDataField.field')"
:rules="fieldRules"
:options="fieldOptions"
emit-value
map-options
option-value="id"
option-label="name"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-select>
<q-select
:model-value="work"
@update:model-value="$emit('update:work', $event)"
:label="$t('artist.artistInformation.titleDataField.work')"
:rules="workRules"
:options="workOptions"
emit-value
map-options
option-value="id"
option-label="name"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-select>
<q-select
:model-value="qualification"
@update:model-value="$emit('update:qualification', $event)"
:label="
$t('artist.artistInformation.titleDataField.qualification')
"
:rules="qualificationRules"
:options="professionOptions"
emit-value
map-options
option-value="id"
option-label="name"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-select>
<q-select
:model-value="artistLevel"
@update:model-value="$emit('update:artistLevel', $event)"
:label="
$t('artist.artistInformation.titleDataField.artistLevel')
"
:rules="artistLevelRules"
:options="artistLevelOptions"
emit-value
map-options
option-value="id"
option-label="name"
type="text"
class="q-my-sm"
outlined
hide-bottom-space
clearable
></q-select>
<div style="padding-top: 13px; padding-left: 12px">
<span class="text-body1">{{
$t('artist.artistInformation.titleDataField.status')
}}</span
><q-toggle
:model-value="status"
@update:model-value="$emit('update:status', $event)"
/>
</div>
</div>
</div>
</q-card-section>
<q-card-actions align="right">
<q-btn
color="grey"
no-caps
style="width: 90px"
:label="$t('customer.crudActions.cancel')"
@click="$emit('click:CloseBtn')"
/>
<q-btn
type="submit"
color="primary"
no-caps
style="width: 90px"
:label="$t('customer.crudActions.save')"
/>
</q-card-actions>
</q-form>
</q-card>
</q-dialog>
</template>
<script lang="ts" src="./NewArtistDialog.ts"></script>
...@@ -6,7 +6,6 @@ import UploadImage from '../../upload-image/index.vue'; ...@@ -6,7 +6,6 @@ import UploadImage from '../../upload-image/index.vue';
export default defineComponent({ export default defineComponent({
props: { props: {
id: { type: Number, required: true }, id: { type: Number, required: true },
artistCode: { type: String, required: true }, artistCode: { type: String, required: true },
avatar: { type: String, required: true }, avatar: { type: String, required: true },
fullName: { type: String, required: true }, fullName: { type: String, required: true },
...@@ -37,6 +36,17 @@ export default defineComponent({ ...@@ -37,6 +36,17 @@ export default defineComponent({
UploadImage, UploadImage,
}, },
setup() { setup() {
const selectedFile = (value: FileList) => {
console.log(value);
console.log(URL.createObjectURL(value[0]));
};
const upload = ref(null);
const uploadBanner = () => {
// eslint-disable-next-line
// @ts-ignore
// eslint-disable-next-line
upload.value?.click();
};
const artistCodeRules = [ const artistCodeRules = [
(val?: string) => (val?: string) =>
(val && val.trim().length) || (val && val.trim().length) ||
...@@ -126,18 +136,6 @@ export default defineComponent({ ...@@ -126,18 +136,6 @@ export default defineComponent({
'artist.artistInformation.validateMessages.requireArtistLevel' 'artist.artistInformation.validateMessages.requireArtistLevel'
), ),
]; ];
const selectedFile = (value: FileList) => {
console.log(value);
console.log(URL.createObjectURL(value[0]));
};
const upload = ref(null);
const uploadBanner = () => {
// eslint-disable-next-line
// @ts-ignore
// eslint-disable-next-line
upload.value?.click();
};
return { return {
artistCodeRules, artistCodeRules,
fullNameRules, fullNameRules,
......
...@@ -104,6 +104,7 @@ ...@@ -104,6 +104,7 @@
@addNewBankAccount="addAccBank" @addNewBankAccount="addAccBank"
@click:CloseBtn="isOpenAddAccountBankDialog = false" @click:CloseBtn="isOpenAddAccountBankDialog = false"
></AddNewBankAccountDialog> ></AddNewBankAccountDialog>
<EditBankAccountDialog <EditBankAccountDialog
v-model:is-open-edit-account-bank-dialog="isOpenEditAccountBankDialog" v-model:is-open-edit-account-bank-dialog="isOpenEditAccountBankDialog"
:card-bank-options="cardBankOptions" :card-bank-options="cardBankOptions"
...@@ -114,18 +115,21 @@ ...@@ -114,18 +115,21 @@
@editBankAccount="editAccBank" @editBankAccount="editAccBank"
@click:CloseBtn="isOpenEditAccountBankDialog = false" @click:CloseBtn="isOpenEditAccountBankDialog = false"
></EditBankAccountDialog> ></EditBankAccountDialog>
<UploadEmbedDialog <UploadEmbedDialog
v-model:is-open-dialog-embed="isOpenDialogEmbed" v-model:is-open-dialog-embed="isOpenDialogEmbed"
v-model:social-embedded="socialEmbedded" v-model:social-embedded="socialEmbedded"
@uploadEmbed="isOpenDialogEmbed = false" @uploadEmbed="isOpenDialogEmbed = false"
@click:CloseBtn="isOpenDialogEmbed = false" @click:CloseBtn="isOpenDialogEmbed = false"
></UploadEmbedDialog> ></UploadEmbedDialog>
<AddHotProductDialog <AddHotProductDialog
@insertData="pushData" @insertData="pushData"
v-model:status-hot-product="statusHotProduct" v-model:status-hot-product="statusHotProduct"
v-model:open-add-hot-product="openAddHotProduct" v-model:open-add-hot-product="openAddHotProduct"
@click:CloseBtnAddHotProduct="openAddHotProduct = false" @click:CloseBtnAddHotProduct="openAddHotProduct = false"
></AddHotProductDialog> ></AddHotProductDialog>
<UpdateHotProduct <UpdateHotProduct
:dataUpdate="DataUpdateHotProduct" :dataUpdate="DataUpdateHotProduct"
@UpdateData="UpdateData($event)" @UpdateData="UpdateData($event)"
...@@ -155,5 +159,4 @@ ...@@ -155,5 +159,4 @@
</div> </div>
</div> </div>
</template> </template>
<script lang="ts" src="./updateInformationArtist.ts"></script> <script lang="ts" src="./updateInformationArtist.ts"></script>
...@@ -125,7 +125,7 @@ export default defineComponent({ ...@@ -125,7 +125,7 @@ export default defineComponent({
// avatar.value = ArtistInformation.avatar // avatar.value = ArtistInformation.avatar
avatar.value = avatar.value =
'https://lh3.googleusercontent.com/proxy/cL5mHGDvQFU8xR-Gn60kKHN9otMevrqQ0wRv3_fEQi4030JNccyLBSBmJoyL3KOYhObYR5WPnRZr8FwphGhYenMklss0tYuiIzhE2BrnNeUJJ76_ztQizomVS3RsPP8'; 'https://static2.yan.vn/YanNews/2167221/201911/son-tung-mtp-so-huu-3-cong-ty-giai-tri-o-tuoi-25-cdm-qua-gioi-f53bb404.jpg';
account.value = ArtistInformation.account; account.value = ArtistInformation.account;
artistCode.value = ArtistInformation.artistCode; artistCode.value = ArtistInformation.artistCode;
fullName.value = ArtistInformation.fullName; fullName.value = ArtistInformation.fullName;
......
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