|
@@ -24,7 +24,14 @@
|
|
|
class="q-mb-sm"
|
|
class="q-mb-sm"
|
|
|
size="64px"
|
|
size="64px"
|
|
|
>
|
|
>
|
|
|
|
|
+ <img
|
|
|
|
|
+ v-if="photoUrl"
|
|
|
|
|
+ style="object-fit: cover"
|
|
|
|
|
+ :src="photoUrl"
|
|
|
|
|
+ />
|
|
|
|
|
+
|
|
|
<span
|
|
<span
|
|
|
|
|
+ v-else
|
|
|
class="full-width full-height flex flex-center"
|
|
class="full-width full-height flex flex-center"
|
|
|
style="font-size: 20px; border-radius: 50%;"
|
|
style="font-size: 20px; border-radius: 50%;"
|
|
|
:style="avatarStyle"
|
|
:style="avatarStyle"
|
|
@@ -102,7 +109,10 @@
|
|
|
/>
|
|
/>
|
|
|
</q-card-section>
|
|
</q-card-section>
|
|
|
|
|
|
|
|
- <q-card-section class="q-pt-xs q-pb-xs q-px-lg">
|
|
|
|
|
|
|
+ <q-card-section
|
|
|
|
|
+ v-if="isNegative"
|
|
|
|
|
+ class="q-pt-xs q-pb-xs q-px-lg"
|
|
|
|
|
+ >
|
|
|
<input
|
|
<input
|
|
|
ref="photoInputRef"
|
|
ref="photoInputRef"
|
|
|
accept="image/jpeg,image/png,image/webp"
|
|
accept="image/jpeg,image/png,image/webp"
|
|
@@ -133,7 +143,7 @@
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div
|
|
<div
|
|
|
- v-if="photos.length < 5"
|
|
|
|
|
|
|
+ v-if="photos.length < MAX_PHOTOS"
|
|
|
class="photo-add"
|
|
class="photo-add"
|
|
|
@click="photoInputRef.click()"
|
|
@click="photoInputRef.click()"
|
|
|
>
|
|
>
|
|
@@ -217,6 +227,8 @@ const { t } = useI18n()
|
|
|
const $q = useQuasar()
|
|
const $q = useQuasar()
|
|
|
const store = userStore()
|
|
const store = userStore()
|
|
|
|
|
|
|
|
|
|
+const MAX_PHOTOS = 5
|
|
|
|
|
+
|
|
|
const stars = ref(0)
|
|
const stars = ref(0)
|
|
|
const selectedTagIds = ref([])
|
|
const selectedTagIds = ref([])
|
|
|
const comment = ref(null)
|
|
const comment = ref(null)
|
|
@@ -235,6 +247,13 @@ const avatarStyle = computed(() => {
|
|
|
|
|
|
|
|
const isNegative = computed(() => stars.value > 0 && stars.value <= 2)
|
|
const isNegative = computed(() => stars.value > 0 && stars.value <= 2)
|
|
|
|
|
|
|
|
|
|
+const photoUrl = computed(() =>
|
|
|
|
|
+ props.schedule.customer_photo
|
|
|
|
|
+ ?? props.schedule.client_photo
|
|
|
|
|
+ ?? props.schedule.client?.profile_media?.url
|
|
|
|
|
+ ?? null
|
|
|
|
|
+)
|
|
|
|
|
+
|
|
|
const initials = computed(() =>
|
|
const initials = computed(() =>
|
|
|
getFirstName(props.schedule.client_name)?.slice(0, 2).toUpperCase() ?? '??'
|
|
getFirstName(props.schedule.client_name)?.slice(0, 2).toUpperCase() ?? '??'
|
|
|
)
|
|
)
|
|
@@ -242,7 +261,7 @@ const initials = computed(() =>
|
|
|
const onPhotosSelected = (event) => {
|
|
const onPhotosSelected = (event) => {
|
|
|
const files = Array.from(event.target.files)
|
|
const files = Array.from(event.target.files)
|
|
|
|
|
|
|
|
- const remaining = 5 - photos.value.length
|
|
|
|
|
|
|
+ const remaining = MAX_PHOTOS - photos.value.length
|
|
|
|
|
|
|
|
files.slice(0, remaining).forEach(file => {
|
|
files.slice(0, remaining).forEach(file => {
|
|
|
photos.value.push(file)
|
|
photos.value.push(file)
|
|
@@ -256,6 +275,16 @@ const onStarsChange = () => {
|
|
|
selectedTagIds.value = []
|
|
selectedTagIds.value = []
|
|
|
|
|
|
|
|
blockClient.value = false
|
|
blockClient.value = false
|
|
|
|
|
+
|
|
|
|
|
+ if (!isNegative.value) clearPhotos()
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+const clearPhotos = () => {
|
|
|
|
|
+ photoPreviews.value.forEach(preview => URL.revokeObjectURL(preview))
|
|
|
|
|
+
|
|
|
|
|
+ photos.value = []
|
|
|
|
|
+
|
|
|
|
|
+ photoPreviews.value = []
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
const removePhoto = (idx) => {
|
|
const removePhoto = (idx) => {
|
|
@@ -292,7 +321,7 @@ const submit = async () => {
|
|
|
block_provider: false,
|
|
block_provider: false,
|
|
|
block_client: isNegative.value && blockClient.value,
|
|
block_client: isNegative.value && blockClient.value,
|
|
|
favorite_provider: false,
|
|
favorite_provider: false,
|
|
|
- photos: photos.value,
|
|
|
|
|
|
|
+ photos: isNegative.value ? photos.value : [],
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
onDialogOK(true)
|
|
onDialogOK(true)
|