Commit e0d142c5 authored by Tình Trương's avatar Tình Trương

update

parent 68a80dbf
......@@ -37,7 +37,7 @@
</div>
<div class="col-12 q-mt-sm">
<div class="row q-col-gutter-lg">
<div class="col-6">
<div class="col-12">
<q-carousel
v-if="banners.length"
v-model="slide"
......@@ -46,7 +46,7 @@
arrows
navigation
infinite
height="350px"
height="28rem"
style="border: 2px solid #f1f1f1"
>
<q-carousel-slide
......@@ -58,7 +58,7 @@
? bannerInfo.url
: configImg.API_IMAGE_ENDPOINT + bannerInfo.bannerUrl
"
style="height: 350px; aspect-ratio: 1/5"
style="height: 28rem; aspect-ratio: 1/5"
>
<template v-slot:default>
<div align="right">
......@@ -85,7 +85,7 @@
></UploadImage>
<UploadImage v-else @selectedFile="uploadBanner"> </UploadImage>
</div>
<div class="col-6">
<div class="col-12">
<q-editor
:model-value="shortDescription"
@update:model-value="$emit('update:shortDescription', $event)"
......@@ -178,7 +178,7 @@
</div>
<div class="col-12 q-mt-sm">
<div class="row q-col-gutter-lg q-pb-md" align="center" justify="center">
<div class="col-4">
<div class="col-4" style="width: 27.06rem; margin-left: 9.3rem">
<div class="flex flex-center">
<div class="text-h6 text-weight-regular q-py-md">
Nổi bật(Embed)
......@@ -209,7 +209,7 @@
@click="$emit('openDialogUploadEmbed')"
class="flex flex-center"
:style="
socialEmbedded !== null ? 'height: 580px;' : 'height: 580px'
socialEmbedded !== null ? 'height: 36.25rem;' : 'height: 36.25rem'
"
>
<iframe
......@@ -241,7 +241,7 @@
</div>
</div>
<div class="col-4">
<div class="col-4" style="width: 27.06rem">
<div class="flex flex-center">
<div class="text-h6 text-weight-regular q-py-md">Story</div>
<q-space></q-space>
......@@ -258,7 +258,7 @@
</div>
<div
class="flex flex-center"
:style="stories.length ? 'height: 580px' : 'height: 580px;'"
:style="stories.length ? 'height: 36.25rem' : 'height: 36.25rem;'"
bordered
v-if="!stories.length"
>
......@@ -290,12 +290,14 @@
arrows
navigation
infinite
style="height: 28rem"
>
<q-carousel-slide
v-for="(story, storyIdx) in stories"
:key="storyIdx"
:name="storyIdx"
class="q-pa-none"
style="height: 28rem"
>
<div>
<q-img
......@@ -330,10 +332,10 @@
</q-carousel>
</div>
<div class="col-4">
<div class="col-4" style="width: 27.06rem">
<div class="text-h6 text-weight-regular q-py-md">Lịch</div>
<q-date
style="width: 100%; height: 580px"
style="width: 100%; height: 36.25rem"
:model-value="formatSchedules"
@update:model-value="$emit('update:formatSchedules', $event)"
multiple
......
......@@ -231,8 +231,6 @@
></q-input>
</div>
</div>
</div>
<div class="col-5 q-ml-xl">
<div class="row flex-center">
<div class="col-3 text-weight-medium">
{{ $t('artist.artistInformation.titleDataField.field') }}
......@@ -286,6 +284,8 @@
></q-select>
</div>
</div>
</div>
<div class="col-5 q-ml-xl">
<div class="row flex-center">
<div class="col-3 text-weight-medium">
{{ $t('artist.artistInformation.titleDataField.qualification') }}
......
......@@ -9,9 +9,11 @@
<q-card-section>
<q-item>
<q-item-section>
<q-item-label class="text-h6 text-weight-regular">{{
$t('listBooking.dialogLabel.title')
}}</q-item-label>
<q-item-label
class="text-h6 text-weight-regular"
style="text-align: center"
>{{ $t('listBooking.dialogLabel.title') }}</q-item-label
>
</q-item-section>
</q-item>
</q-card-section>
......@@ -23,12 +25,16 @@
<div class="col-4 fs-14 color">
{{ $t('listBooking.titleColumnsTable.bookingCode') }}:
</div>
<div class="col-8 fs-14">{{ detailInfoBooking.bookingCode }}</div>
<div class="col-8 fs-14">
{{ detailInfoBooking.bookingCode }}
</div>
<div class="col-4 fs-14 color">
{{ $t('listBooking.titleColumnsTable.artistName') }}:
</div>
<div class="col-8 fs-14">{{ detailInfoBooking.artistName }}</div>
<div class="col-8 fs-14">
{{ detailInfoBooking.artistName }}
</div>
<div class="col-4 fs-14 color">
{{ $t('listBooking.titleColumnsTable.userName') }}:
......@@ -66,15 +72,61 @@
<div class="col-8 fs-14">{{ detailInfoBooking.like }}</div> -->
<div class="col-4 fs-14 color">
{{ $t('listBooking.titleColumnsTable.status') }}:
{{ $t('listBooking.titleColumnsTable.activeStatus') }}:
</div>
<div class="col-8 fs-14">
<q-chip
size="sm"
color="secondary"
v-if="detailInfoBooking.activeStatus === 0"
>Chờ nhận</q-chip
>
<q-chip
size="sm"
color="info"
v-else-if="detailInfoBooking.status === 1"
>Đã thực hiện</q-chip
>
<q-chip size="sm" color="warning" v-else>Từ chối</q-chip>
</div>
<div class="col-8 fs-14">{{ detailInfoBooking.status }}</div>
<div class="col-4 fs-14 color">
{{ $t('listBooking.titleColumnsTable.activeStatus') }}:
{{ $t('listBooking.titleColumnsTable.status') }}:
</div>
<div class="col-8 fs-14">
{{ detailInfoBooking.activeStatus }}
<q-chip
size="sm"
color="secondary"
v-if="detailInfoBooking.status === 0"
>Chờ nhận</q-chip
>
<q-chip
size="sm"
color="info"
v-else-if="detailInfoBooking.status === 1"
>Đã thực hiện</q-chip
>
<q-chip
size="sm"
color="warning"
v-else-if="detailInfoBooking.status === 2"
>Chưa thực hiện</q-chip
>
<q-chip
size="sm"
color="warning"
v-else-if="detailInfoBooking.status === 3"
>Hoãn lịch</q-chip
>
<q-chip
size="sm"
color="warning"
v-else-if="detailInfoBooking.status === 4"
>Hủy lịch</q-chip
>
<q-chip size="sm" color="secondary" v-else
>Thay đổi lịch</q-chip
>
</div>
</div>
</div>
......@@ -120,6 +172,7 @@ export default defineComponent({
},
emits: ['update:showDialog', 'click:CloseBtn'],
});
3;
</script>
<style scoped>
.fs-14 {
......
......@@ -15,6 +15,7 @@
:size="isBtn ? 'md' : 'md'"
></q-icon>
<span>Tải lên ảnh bìa</span>
<div style="font-size: 12px">(kích cỡ: 1914x448)</div>
</div>
<input
ref="upload"
......
......@@ -6,23 +6,93 @@
</div>
<q-space></q-space>
<div class="col-2">
<q-input
<q-select
v-model="sreachArtist"
:options="artistOptions"
option-label="name"
option-value="id"
dense
outlined
:label="$t('listBooking.titleColumnsTable.artistName')"
clearable
></q-input>
></q-select>
</div>
<div class="col-2">
<q-input
<q-select
v-model="sreachUserName"
:options="customerOptions"
option-label="name"
option-value="id"
dense
outlined
:label="$t('listBooking.titleColumnsTable.userName')"
clearable
></q-input>
></q-select>
</div>
<div class="col-2">
<!-- v-model="date[0]" -->
<q-input
:label="$t('listBooking.titleColumnsTable.fromTime')"
readonly
dense
outlined
>
<template v-slot:append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy
ref="qDateProxy"
transition-show="scale"
transition-hide="scale"
>
<!-- v-model="date[0]" -->
<q-date mask="DD/MM/YYYY" no-unset>
<div class="row items-center justify-end">
<q-btn
v-close-popup
:label="$t('listBooking.crudActions.cancel')"
color="primary"
flat
></q-btn>
</div>
</q-date>
</q-popup-proxy>
</q-icon>
</template>
</q-input>
</div>
<div class="col-2">
<!-- v-model="date[1]" -->
<q-input
:label="$t('listBooking.titleColumnsTable.toTime')"
readonly
dense
outlined
>
<template v-slot:append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy
ref="qDateProxy"
transition-show="scale"
transition-hide="scale"
>
<!-- v-model="date[1]" -->
<q-date mask="DD/MM/YYYY" no-unset>
<div class="row items-center justify-end">
<q-btn
v-close-popup
:label="$t('listBooking.crudActions.cancel')"
color="primary"
flat
></q-btn>
</div>
</q-date>
</q-popup-proxy>
</q-icon>
</template>
</q-input>
</div>
<div class="col-auto">
<q-btn
class="q-mr-sm"
......@@ -101,25 +171,6 @@
</q-td>
</template>
<!-- <template v-slot:body-cell-activeStatus="rowData">
<q-td>
<div align="center">
<q-chip
:color="
rowData.value === ActiveStatus.active ? 'positive' : 'orange'
"
text-color="white"
size="sm"
>
{{
rowData.value === ActiveStatus.active
? $t('listBooking.statusLabel.activeEvent')
: $t('listBooking.statusLabel.inactiveEvent')
}}
</q-chip>
</div>
</q-td>
</template> -->
<template v-slot:body-cell-content="item">
<td>
<div class="ellipsis-3-lines">
......@@ -157,8 +208,14 @@ import { AxiosResponse } from 'axios';
import { i18n } from 'src/boot/i18n';
import { defineComponent, onMounted, Ref, ref } from 'vue';
import Pagination from 'components/pagination/index.vue';
import { PaginationResponse, ListBooking } from 'src/assets/type';
import {
PaginationResponse,
ListBooking,
ArtistInfoType,
CustomerType,
} from 'src/assets/type';
import detailBooking from '../../components/detailBooking/index.vue';
import moment from 'moment';
export default defineComponent({
components: {
......@@ -296,9 +353,9 @@ export default defineComponent({
{ value: 0, text: 'Chờ nhận', color: 'secondary' },
{ value: 1, text: 'Đã thực hiện', color: 'info' },
{ value: 2, text: 'Chưa thực hiện', color: 'warning' },
{ value: 3, text: 'Hoãn lịch', color: 'secondary' },
{ value: 4, text: 'Hủy lịch', color: 'info' },
{ value: 5, text: 'Thay đổi lịch', color: 'warning' },
{ value: 3, text: 'Hoãn lịch', color: 'warning' },
{ value: 4, text: 'Hủy lịch', color: 'warning' },
{ value: 5, text: 'Thay đổi lịch', color: 'secondary' },
]);
const detailInfoBooking: Ref<ListBooking | null> = ref(null);
......@@ -314,6 +371,49 @@ export default defineComponent({
void getListBooking();
};
const date = ref([
moment(new Date()).format('DD/MM/YYYY'),
moment(new Date()).add(7, 'days').format('DD/MM/YYYY'),
]);
const changeTime = () => {
const startTime = Number(
moment(date.value[0], 'DD/MM/YYYY').format('YYYYMMDD')
);
const endTime = Number(
moment(date.value[1], 'DD/MM/YYYY').format('YYYYMMDD')
);
if (startTime > endTime) {
date.value = [date.value[1], date.value[0]];
}
};
const artistOptions: Ref<ArtistInfoType[] | null> = ref([]);
const customerOptions: Ref<CustomerType[] | null> = ref([]);
// const getArtistOptions = async () => {
// const response = (await api({
// url: API_PATHS.getListArtists,
// method: 'GET',
// params: {},
// })) as AxiosResponse<BaseResponseBody<ArtistInfoType[]>>;
// if (response.data.error.code === config.API_RES_CODE.OK.code) {
// console.log(response, 'sss');
// artistOptions.value = response.data.data;
// }
// };
// const getCustomerOptions = async () => {
// const response = (await api({
// url: API_PATHS.listCustomers,
// method: 'GET',
// params: {},
// })) as AxiosResponse<BaseResponseBody<CustomerType[]>>;
// if (response.data.error.code === config.API_RES_CODE.OK.code) {
// console.log(response, 'sss111');
// customerOptions.value = response.data.data;
// }
// };
const getListBooking = async () => {
try {
const response = (await api({
......@@ -354,8 +454,13 @@ export default defineComponent({
onMounted(() => {
void getListBooking();
// void getArtistOptions();
// void getCustomerOptions();
});
return {
changeTime,
customerOptions,
artistOptions,
detailInfoBooking,
showDialog,
detail,
......
......@@ -627,13 +627,6 @@ export default defineComponent({
);
}
// 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;
......@@ -641,13 +634,6 @@ export default defineComponent({
'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 (
// !phoneNumberAdminister.value ||
......@@ -723,7 +709,6 @@ export default defineComponent({
avatar: avatarUploaded.value,
artistCode: artistCode.value,
artistName: artistName.value,
// eslint-disable-next-line @typescript-eslint/restrict-plus-operands
birthday: birthday.value + ' 00:00:00',
sex: sex.value,
......
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