CaWittMN08/custom_ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changed the Task project and address columns to link types to click and navigate to their respective information.

Browse Source
This commit is contained in:
rocketdebris 2026-01-13 10:01:48 -05:00
parent 3a9bc2f6b2
commit 3e1fd039b3
1 changed files with 33 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
frontend/src/components/pages/Tasks.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="page-container">
<h2>Admin Tasks</h2>
<h2>Tasks</h2>
<!-- Todo Chart Section -->
<div class = "widgets-grid">
<!-- Widget Cards go here if needed -->
@ -8,6 +8,8 @@
<DataTable
:data="tableData"
:columns="columns"
:filters="filters"
:tableActions="tableActions"
tableName="tasks"
:lazy="true"
:totalRecords="totalRecords"
@ -18,7 +20,7 @@
</template>
<script setup>
import DataTable from "../common/DataTable.vue";
import { ref, onMounted } from "vue";
import { ref, onMounted, watch } from "vue";
import { useRouter } from "vue-router";
import Api from "../../api";
import { useLoadingStore } from "../../stores/loading";
@ -37,8 +39,12 @@ const isLoading = ref(false);
const columns = [
{ label: "Task", fieldName: "subject", type: "text", sortable: true, filterable: true },
{ label: "Project", fieldName: "project", type: "link", sortable: true },
{ label: "Address", fieldName: "address", type: "text", sortable: true },
{ label: "Project", fieldName: "project", type: "link", sortable: true,
onLinkClick: (link, rowData) => handleProjectClick(link, rowData)
},
{ label: "Address", fieldName: "address", type: "link", sortable: true,
onLinkClick: (link, rowData) => handlePropertyClick(link, rowData)
},
{ label: "Type", fieldName: "type", type: "text", sortable: true },
{ label: "Overall Status", fieldName: "status", type: "status", sortable: true },
];
@ -160,12 +166,35 @@ const handleLazyLoad = async (event) => {
}
};
const handleProjectClick = (link, rowData) => {
console.log("DEBUG: Project Link Clicked.");
const jobId = encodeURIComponent(rowData.project);
router.push(`/job?jobId=${jobId}`);
};
const handlePropertyClick = (link, rowData) => {
console.log("DEBUG: Property Link Clicked.");
const client = encodeURIComponent(rowData.customerName);
const address = encodeURIComponent(rowData.address);
router.push(`/property?client=${client}&address=${address}`);
}
// If we implement a Task Detail View, this may be helpful
//const handleRowClick = (event) => {
// const rowData = event.data;
// router.push(`/task?taskId=${rowData.name}`);
//}
// Watch for filters change to update status counts
watch(
() => filtersStore.getTableFilters("tasks"),
async () => {
await refreshStatusCounts();
},
{ deep: true },
);
// Load initial data
onMounted(async () => {
notifications.addWarning("Tasks page coming soon");