118 lines
2.2 KiB
Vue
118 lines
2.2 KiB
Vue
<template>
|
|
<div class="quick-actions">
|
|
<Button
|
|
@click="handleEdit"
|
|
icon="pi pi-pencil"
|
|
label="Edit Information"
|
|
size="small"
|
|
severity="secondary"
|
|
/>
|
|
<Button
|
|
@click="handleCreateEstimate"
|
|
icon="pi pi-file-edit"
|
|
label="Create Estimate"
|
|
size="small"
|
|
severity="secondary"
|
|
/>
|
|
<Button
|
|
@click="handleCreateBidMeeting"
|
|
icon="pi pi-calendar-plus"
|
|
label="Create Bid Meeting"
|
|
size="small"
|
|
severity="secondary"
|
|
/>
|
|
|
|
<!-- Edit Confirmation Dialog -->
|
|
<Dialog
|
|
:visible="showEditConfirmDialog"
|
|
@update:visible="showEditConfirmDialog = $event"
|
|
header="Confirm Edit"
|
|
:modal="true"
|
|
:closable="false"
|
|
class="confirm-dialog"
|
|
>
|
|
<p>Are you sure you want to edit this client information? This will enable editing mode.</p>
|
|
<template #footer>
|
|
<Button
|
|
label="Cancel"
|
|
severity="secondary"
|
|
@click="showEditConfirmDialog = false"
|
|
/>
|
|
<Button
|
|
label="Yes, Edit"
|
|
@click="confirmEdit"
|
|
/>
|
|
</template>
|
|
</Dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from "vue";
|
|
import Button from "primevue/button";
|
|
import Dialog from "primevue/dialog";
|
|
import { useRouter } from "vue-router";
|
|
import DataUtils from "../../utils";
|
|
|
|
const props = defineProps({
|
|
fullAddress: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
});
|
|
|
|
const emit = defineEmits(["edit-mode-enabled"]);
|
|
|
|
const router = useRouter();
|
|
const showEditConfirmDialog = ref(false);
|
|
|
|
const handleEdit = () => {
|
|
showEditConfirmDialog.value = true;
|
|
};
|
|
|
|
const confirmEdit = () => {
|
|
showEditConfirmDialog.value = false;
|
|
emit("edit-mode-enabled");
|
|
};
|
|
|
|
const handleCreateEstimate = () => {
|
|
router.push({
|
|
path: "/estimate",
|
|
query: {
|
|
new: "true",
|
|
address: props.fullAddress,
|
|
},
|
|
});
|
|
};
|
|
|
|
const handleCreateBidMeeting = () => {
|
|
router.push({
|
|
path: "/calendar",
|
|
query: {
|
|
tab: "bids",
|
|
new: "true",
|
|
address: props.fullAddress,
|
|
},
|
|
});
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
.quick-actions {
|
|
display: flex;
|
|
gap: 0.75rem;
|
|
justify-content: flex-end;
|
|
margin-bottom: 1rem;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.confirm-dialog {
|
|
max-width: 400px;
|
|
}
|
|
|
|
.confirm-dialog :deep(.p-dialog-footer) {
|
|
display: flex;
|
|
gap: 0.5rem;
|
|
justify-content: flex-end;
|
|
}
|
|
</style>
|