US-015: Complete Monthly Entry Interface with data loading and comments
This commit is contained in:
parent
f14c0862da
commit
79da3c1c78
@ -37,6 +37,7 @@ $routes->group('api', function ($routes) {
|
||||
|
||||
$routes->get('entry/controls', 'Api\EntryApiController::getControls');
|
||||
$routes->get('entry/tests', 'Api\EntryApiController::getTests');
|
||||
$routes->get('entry/monthly', 'Api\EntryApiController::getMonthlyData');
|
||||
$routes->post('entry/daily', 'Api\EntryApiController::saveDaily');
|
||||
$routes->post('entry/monthly', 'Api\EntryApiController::saveMonthly');
|
||||
$routes->post('entry/comment', 'Api\EntryApiController::saveComment');
|
||||
|
||||
@ -135,4 +135,33 @@ class EntryApiController extends BaseController
|
||||
return $this->failServerError('Something went wrong: ' . $e->getMessage());
|
||||
}
|
||||
}
|
||||
|
||||
public function getMonthlyData()
|
||||
{
|
||||
$controlId = $this->request->getGet('controlId');
|
||||
$testId = $this->request->getGet('testId');
|
||||
$yearMonth = $this->request->getGet('yearMonth');
|
||||
|
||||
try {
|
||||
$results = $this->resultModel->getByMonth($controlId, $testId, $yearMonth);
|
||||
$comment = $this->commentModel->getByControlTestMonth($controlId, $testId, $yearMonth);
|
||||
|
||||
$formValues = [];
|
||||
foreach ($results as $row) {
|
||||
$day = (int)date('j', strtotime($row['resdate']));
|
||||
$formValues[$day] = $row['resvalue'];
|
||||
}
|
||||
|
||||
return $this->respond([
|
||||
'status' => 'success',
|
||||
'message' => 'fetch success',
|
||||
'data' => [
|
||||
'formValues' => $formValues,
|
||||
'comment' => $comment ? $comment['comtext'] : ''
|
||||
]
|
||||
], 200);
|
||||
} catch (\Exception $e) {
|
||||
return $this->failServerError('Something went wrong: ' . $e->getMessage());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<?= $this->extend("layout/main_layout"); ?>
|
||||
<?= $this->section("content") ?>
|
||||
<main x-data="monthlyEntry()">
|
||||
<main x-data="monthlyEntry()" @keydown.window.ctrl.s.prevent="showEntry ? saveData() : null">
|
||||
<div class="bg-white rounded-xl border border-slate-100 shadow-sm p-6">
|
||||
<div class="flex items-center justify-between mb-6">
|
||||
<div>
|
||||
@ -59,7 +59,7 @@
|
||||
</div>
|
||||
|
||||
<div class="mt-6" x-show="control && test" x-transition>
|
||||
<button @click="showEntry = true" class="btn btn-primary">
|
||||
<button @click="openEntry()" class="btn btn-primary">
|
||||
<i class="fa-solid fa-plus mr-2"></i>
|
||||
Enter Data
|
||||
</button>
|
||||
@ -101,7 +101,8 @@
|
||||
</div>
|
||||
</template>
|
||||
<template x-if="!loading">
|
||||
<div class="grid grid-cols-7 gap-2">
|
||||
<div>
|
||||
<div class="grid grid-cols-7 gap-2 mb-4">
|
||||
<template x-for="day in 31" :key="day">
|
||||
<div class="text-center">
|
||||
<label class="block text-xs text-slate-500 mb-1" x-text="day"></label>
|
||||
@ -109,6 +110,11 @@
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">Monthly Comment</label>
|
||||
<textarea x-model="comment" rows="2" class="w-full px-4 py-2.5 text-sm bg-slate-50 border border-slate-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500" placeholder="Optional monthly comment"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<div class="flex items-center justify-end gap-3 px-6 py-4 border-t border-slate-100 bg-slate-50/50 rounded-b-2xl">
|
||||
@ -148,6 +154,7 @@ document.addEventListener('alpine:init', () => {
|
||||
errors: {},
|
||||
error: '',
|
||||
formValues: {},
|
||||
comment: '',
|
||||
|
||||
init() {
|
||||
this.loadDraft();
|
||||
@ -222,6 +229,29 @@ document.addEventListener('alpine:init', () => {
|
||||
return Object.keys(this.errors).length === 0;
|
||||
},
|
||||
|
||||
async openEntry() {
|
||||
this.formValues = {};
|
||||
this.comment = '';
|
||||
this.loading = true;
|
||||
this.showEntry = true;
|
||||
|
||||
try {
|
||||
const response = await fetch(`${window.BASEURL}/api/entry/monthly?controlid=${this.control}&testid=${this.test}&yearmonth=${this.date}`);
|
||||
const data = await response.json();
|
||||
if (data.status === 'success') {
|
||||
this.formValues = data.data.formValues || {};
|
||||
this.comment = data.data.comment || '';
|
||||
} else {
|
||||
this.error = data.message || 'Failed to load existing data';
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
this.error = 'Failed to load existing data';
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
async saveData() {
|
||||
if (!this.validate()) {
|
||||
App.showToast('Please fill all required fields', 'error');
|
||||
@ -247,8 +277,8 @@ document.addEventListener('alpine:init', () => {
|
||||
}
|
||||
}
|
||||
|
||||
if (!hasData) {
|
||||
App.showToast('Please enter at least one value', 'warning');
|
||||
if (!hasData && !this.comment) {
|
||||
App.showToast('Please enter at least one value or comment', 'warning');
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
@ -260,9 +290,13 @@ document.addEventListener('alpine:init', () => {
|
||||
});
|
||||
const data = await response.json();
|
||||
if (data.status === 'success') {
|
||||
if (this.comment) {
|
||||
await this.saveComment();
|
||||
}
|
||||
App.showToast('Data saved successfully!');
|
||||
this.showEntry = false;
|
||||
this.formValues = {};
|
||||
this.comment = '';
|
||||
this.saveDraft();
|
||||
} else {
|
||||
this.error = data.message || 'Failed to save data';
|
||||
@ -275,6 +309,23 @@ document.addEventListener('alpine:init', () => {
|
||||
}
|
||||
},
|
||||
|
||||
async saveComment() {
|
||||
const formData = new FormData();
|
||||
formData.append('controlid', this.control);
|
||||
formData.append('testid', this.test);
|
||||
formData.append('commonth', this.date);
|
||||
formData.append('comtext', this.comment);
|
||||
|
||||
try {
|
||||
await fetch(`${window.BASEURL}/api/entry/comment`, {
|
||||
method: 'POST',
|
||||
body: formData
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Failed to save comment:', error);
|
||||
}
|
||||
},
|
||||
|
||||
saveDraft() {
|
||||
localStorage.setItem('monthlyEntry', JSON.stringify({
|
||||
dept: this.dept,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user