|
|
@@ -2,7 +2,7 @@
|
|
|
<div class="q-mx-md q-mb-md">
|
|
|
<div class="row items-center justify-between q-mb-sm">
|
|
|
<div class="section-title gradient-diarista">{{ $t('provider.dashboard.opportunities.title') }}</div>
|
|
|
- <q-btn flat no-caps color="grey-6" size="sm" :label="$t('common.see_all')" />
|
|
|
+ <q-btn flat no-caps color="grey-6" size="sm" :label="$t('common.see_all')" @click="openAllOpportunities"/>
|
|
|
</div>
|
|
|
|
|
|
<div class="scroll-wrapper">
|
|
|
@@ -20,10 +20,10 @@
|
|
|
</q-avatar>
|
|
|
<div class="column flex-1">
|
|
|
<div class="row items-center q-gutter-x-xs">
|
|
|
- <span class="text-name ellipsis">{{ item.client_name }}</span>
|
|
|
+ <span class="text-name ellipsis">{{ item.client?.user?.name }}</span>
|
|
|
<div class="row items-center">
|
|
|
<q-icon name="mdi-star" color="warning" size="14px" />
|
|
|
- <span class="text-rating text-text">{{ item.average_rating }}</span>
|
|
|
+ <span class="text-rating text-text">{{ item.client?.average_rating }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="row items-center no-wrap">
|
|
|
@@ -47,17 +47,18 @@
|
|
|
|
|
|
<div class="row q-mt-sm justify-between">
|
|
|
<div class="text-text text-primary">
|
|
|
- {{ chooseAddressType(item.address_type) }}
|
|
|
+ {{ item.custom_schedule?.service_type?.description }}
|
|
|
</div>
|
|
|
<q-btn
|
|
|
- unelevated
|
|
|
- rounded
|
|
|
- no-caps
|
|
|
- color="primary"
|
|
|
- size="sm"
|
|
|
- class="btn-details"
|
|
|
- :label="$t('common.details')"
|
|
|
- />
|
|
|
+ unelevated
|
|
|
+ rounded
|
|
|
+ no-caps
|
|
|
+ color="primary"
|
|
|
+ size="sm"
|
|
|
+ class="btn-details"
|
|
|
+ :label="$t('common.details')"
|
|
|
+ @click="openOpportunityDetails(item)"
|
|
|
+ />
|
|
|
</div>
|
|
|
</q-card-section>
|
|
|
</q-card>
|
|
|
@@ -69,14 +70,42 @@
|
|
|
<script setup>
|
|
|
import { formatCurrency } from 'src/helpers/utils';
|
|
|
import { labelsPeriodTypes } from 'src/helpers/arraysOptions/labelsPeriodTypes.js';
|
|
|
-import { useI18n } from 'vue-i18n';
|
|
|
+import { useQuasar } from 'quasar';
|
|
|
+import { useRouter } from 'vue-router';
|
|
|
+import OpportunityDetailsDialog from 'src/pages/opportunities/components/OpportunityDetailsDialog.vue';
|
|
|
+
|
|
|
defineProps({
|
|
|
data: {
|
|
|
type: Array,
|
|
|
default: () => []
|
|
|
}
|
|
|
});
|
|
|
-const { t } = useI18n();
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+const $q = useQuasar();
|
|
|
+
|
|
|
+const router = useRouter();
|
|
|
+
|
|
|
+
|
|
|
+const openOpportunityDetails = (item) => {
|
|
|
+ $q.dialog({
|
|
|
+ component: OpportunityDetailsDialog,
|
|
|
+ componentProps: {
|
|
|
+ opportunityId: item.custom_schedule?.id
|
|
|
+}
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// botão ver todas
|
|
|
+const openAllOpportunities = () => {
|
|
|
+ router.push({
|
|
|
+ name: 'OpportunitiesPage'
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
|
|
|
const formatWeekday = (iso) => {
|
|
|
if (!iso) return '';
|
|
|
@@ -90,16 +119,6 @@ const formatDayMonth = (iso) => {
|
|
|
return new Date(iso).toLocaleDateString('pt-BR', { day: '2-digit', month: '2-digit' });
|
|
|
};
|
|
|
|
|
|
-const chooseAddressType = (type) => {
|
|
|
- switch(type) {
|
|
|
- case 'home':
|
|
|
- return t("address.types.home");
|
|
|
- case 'commercial':
|
|
|
- return t("address.types.commercial");
|
|
|
- default:
|
|
|
- return 'N/A';
|
|
|
- }
|
|
|
-};
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|