cameron/stock-management-demo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add filters.

Browse source
This commit is contained in:
Cameron Redmore 2025-04-26 11:26:38 +01:00
parent a136b717bf
commit 8ad2c6ef53
4 changed files with 207 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

11
prisma/migrations/20250426101758_add_mantis_indexes/migration.sql Normal file
View file

@ -0,0 +1,11 @@
-- CreateIndex
CREATE INDEX "MantisIssue_reporter_username_idx" ON "MantisIssue"("reporter_username");
-- CreateIndex
CREATE INDEX "MantisIssue_status_idx" ON "MantisIssue"("status");
-- CreateIndex
CREATE INDEX "MantisIssue_priority_idx" ON "MantisIssue"("priority");
-- CreateIndex
CREATE INDEX "MantisIssue_severity_idx" ON "MantisIssue"("severity");

5
prisma/schema.prisma
View file

@ -152,6 +152,11 @@ model MantisIssue {
updatedAt DateTime @updatedAt @map("updated_at")
comments MantisComment[]
@@index([reporterUsername])
@@index([status])
@@index([priority])
@@index([severity])
}
model MantisComment {

73
src-server/routes/mantis.js
View file

@ -10,10 +10,62 @@ const MsgReader = reader.default;
const prisma = new PrismaClient(); // Instantiate Prisma Client
const router = express.Router();
// Helper function to fetch distinct values
const getDistinctValues = async(field, res) =>
{
try
{
const values = await prisma.mantisIssue.findMany({
distinct: [field],
select: {
[field]: true,
},
where: { // Exclude null values if necessary
NOT: {
[field]: ''
}
},
orderBy: {
[field]: 'asc',
},
});
res.json(values.map(item => item[field]));
}
catch (error)
{
console.error(`Error fetching distinct ${field} values:`, error.message);
res.status(500).json({ error: `Failed to fetch distinct ${field} values` });
}
};
// GET /mantis/filters/statuses - Fetch unique status values
router.get('/filters/statuses', async(req, res) =>
{
await getDistinctValues('status', res);
});
// GET /mantis/filters/priorities - Fetch unique priority values
router.get('/filters/priorities', async(req, res) =>
{
await getDistinctValues('priority', res);
});
// GET /mantis/filters/severities - Fetch unique severity values
router.get('/filters/severities', async(req, res) =>
{
await getDistinctValues('severity', res);
});
// GET /mantis/filters/reporters - Fetch unique reporter usernames
router.get('/filters/reporters', async(req, res) =>
{
await getDistinctValues('reporterUsername', res);
});
// GET /mantis - Fetch multiple Mantis issues with filtering and pagination
router.get('/', async(req, res) =>
{
const { page = 1, limit = 10, status, priority, severity, reporterUsername, search } = req.query;
const { page = 1, limit = 10, status, priority, severity, reporterUsername, search, sortBy = 'updatedAt', sortOrder = 'desc' } = req.query; // Add sortBy and sortOrder
const pageNum = parseInt(page, 10);
const limitNum = parseInt(limit, 10);
@ -29,6 +81,7 @@ router.get('/', async(req, res) =>
where.OR = [
{ title: { contains: search, mode: 'insensitive' } },
{ description: { contains: search, mode: 'insensitive' } },
{ comments: { some: { comment: { contains: search, mode: 'insensitive' } } } }, // Search in comments
];
// If the search term is a number, treat it as an ID
@ -39,6 +92,16 @@ router.get('/', async(req, res) =>
}
}
// Validate sortOrder
const validSortOrder = ['asc', 'desc'].includes(sortOrder) ? sortOrder : 'desc';
// Define allowed sort fields to prevent arbitrary sorting
const allowedSortFields = ['id', 'title', 'status', 'priority', 'severity', 'reporterUsername', 'createdAt', 'updatedAt'];
const validSortBy = allowedSortFields.includes(sortBy) ? sortBy : 'updatedAt';
const orderBy = {};
orderBy[validSortBy] = validSortOrder;
try
{
let [issues, totalCount] = await prisma.$transaction([
@ -46,9 +109,7 @@ router.get('/', async(req, res) =>
where,
skip,
take: limitNum,
orderBy: {
updatedAt: 'desc', // Default sort order
},
orderBy: orderBy, // Use dynamic orderBy
// You might want to include related data like comments count later
// include: { _count: { select: { comments: true } } }
}),
@ -83,9 +144,7 @@ router.get('/', async(req, res) =>
where,
skip,
take: limitNum,
orderBy: {
updatedAt: 'desc', // Default sort order
},
orderBy: orderBy, // Use dynamic orderBy here as well
});
if (issues.length === 0)

119
src/pages/MantisPage.vue
View file

@ -5,23 +5,76 @@
bordered
class="q-mb-xl"
>
<q-card-section class="row items-center justify-between">
<q-card-section class="row items-center justify-between q-gutter-md">
<div class="text-h4">
Mantis Tickets
</div>
<div class="row items-center q-gutter-sm">
<!-- Filters -->
<q-select
dense
outlined
v-model="selectedStatus"
:options="statusOptions"
label="Status"
clearable
emit-value
map-options
style="min-width: 120px"
@update:model-value="applyFilters"
/>
<q-select
dense
outlined
v-model="selectedPriority"
:options="priorityOptions"
label="Priority"
clearable
emit-value
map-options
style="min-width: 120px"
@update:model-value="applyFilters"
/>
<q-select
dense
outlined
v-model="selectedSeverity"
:options="severityOptions"
label="Severity"
clearable
emit-value
map-options
style="min-width: 120px"
@update:model-value="applyFilters"
/>
<q-select
dense
outlined
v-model="selectedReporter"
:options="reporterOptions"
label="Reporter"
clearable
emit-value
map-options
style="min-width: 150px"
@update:model-value="applyFilters"
/>
<!-- Search Input -->
<q-input
dense
outlined
debounce="300"
v-model="searchTerm"
placeholder="Search tickets..."
@update:model-value="fetchTickets(1)"
@update:model-value="applyFilters"
clearable
style="width: 300px"
style="width: 250px"
>
<template #append>
<q-icon name="search" />
</template>
</q-input>
</div>
</q-card-section>
<q-table
@ -123,7 +176,6 @@ import { useRouter } from 'vue-router';
import axios from 'axios';
import { useQuasar } from 'quasar';
import MantisTicketDialog from 'src/components/MantisTicketDialog.vue';
import { marked } from 'marked';
const props = defineProps({
@ -143,6 +195,16 @@ const showSummaryDialog = ref(false); // New state for summary dialog
const summaryContent = ref(''); // New state for summary content
const summaryTicketId = ref(null); // New state for summary ticket ID
// Filter refs
const selectedStatus = ref(null);
const selectedPriority = ref(null);
const selectedSeverity = ref(null);
const selectedReporter = ref(null);
const statusOptions = ref([]);
const priorityOptions = ref([]);
const severityOptions = ref([]);
const reporterOptions = ref([]);
const router = useRouter();
const pagination = ref({
@ -164,6 +226,36 @@ const columns = [
{ name: 'actions', label: 'Actions', field: 'id', align: 'center' },
];
// Fetch distinct filter values
const fetchFilterOptions = async() =>
{
try
{
const [statusRes, priorityRes, severityRes, reporterRes] = await Promise.all([
axios.get('/api/mantis/filters/statuses'),
axios.get('/api/mantis/filters/priorities'),
axios.get('/api/mantis/filters/severities'),
axios.get('/api/mantis/filters/reporters')
]);
// Format options for q-select
const formatOptions = (data) => data.map(value => ({ label: value, value }));
statusOptions.value = formatOptions(statusRes.data);
priorityOptions.value = formatOptions(priorityRes.data);
severityOptions.value = formatOptions(severityRes.data);
reporterOptions.value = formatOptions(reporterRes.data);
}
catch (error)
{
console.error('Error fetching filter options:', error);
$q.notify({
type: 'negative',
message: 'Failed to load filter options.'
});
}
};
const fetchTickets = async(page = pagination.value.page) =>
{
loading.value = true;
@ -173,8 +265,17 @@ const fetchTickets = async(page = pagination.value.page) =>
page: page,
limit: pagination.value.rowsPerPage,
search: searchTerm.value || undefined,
// Add sorting params if needed based on pagination.sortBy and pagination.descending
sortBy: pagination.value.sortBy, // Add sortBy
sortOrder: pagination.value.descending ? 'desc' : 'asc', // Add sortOrder
// Add filter parameters
status: selectedStatus.value || undefined,
priority: selectedPriority.value || undefined,
severity: selectedSeverity.value || undefined,
reporterUsername: selectedReporter.value || undefined,
};
// Remove undefined params
Object.keys(params).forEach(key => params[key] === undefined && delete params[key]);
const response = await axios.get('/api/mantis', { params });
tickets.value = response.data.data;
pagination.value.rowsNumber = response.data.pagination.total;
@ -194,6 +295,13 @@ const fetchTickets = async(page = pagination.value.page) =>
}
};
// Function to apply filters and reset pagination
const applyFilters = () =>
{
pagination.value.page = 1; // Reset to first page when filters change
fetchTickets();
};
const handleTableRequest = (props) =>
{
const { page, rowsPerPage, sortBy, descending } = props.pagination;
@ -244,6 +352,7 @@ watch(() => props.ticketId, (newTicketId) =>
onMounted(() =>
{
fetchFilterOptions(); // Fetch filter options on mount
fetchTickets();
// Check initial prop value on mount
if (props.ticketId)