chamomind/jws-frontend
chamomind/jws-frontend
6
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

feat: add cancel button functionality and improve close tab logic in task order views

Browse source
This commit is contained in:
puriphatt 2025-02-24 16:38:43 +07:00
parent 3732aa9bf5
commit f12c9e9df6
2 changed files with 28 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/pages/09_task-order/order_view/MainPage.vue
View file

@ -1209,19 +1209,19 @@ watch(
{{ $t('general.view', { msg: $t('general.example') }) }} {{ $t('general.view', { msg: $t('general.example') }) }}
</MainButton> </MainButton>
<div class="row" style="gap: var(--size-2)"> <div class="row" style="gap: var(--size-2)">
<UndoButton outlined @click="undo()" v-if="state.mode === 'edit'" />
<CancelButton
v-if="state.mode !== 'edit'"
:label="$t('dialog.action.close')"
outlined
@click="closeTab()"
/>
<template <template
v-if=" v-if="
fullTaskOrder?.taskOrderStatus === TaskOrderStatus.Pending || fullTaskOrder?.taskOrderStatus === TaskOrderStatus.Pending ||
state.mode === 'create' state.mode === 'create'
" "
> >
<UndoButton outlined @click="undo()" v-if="state.mode === 'edit'" />
<CancelButton
@click="closeTab()"
:label="$t('dialog.action.close')"
v-if="state.mode === 'info'"
outlined
/>
<SaveButton <SaveButton
v-if="state.mode && ['create', 'edit'].includes(state.mode)" v-if="state.mode && ['create', 'edit'].includes(state.mode)"
@click="() => formDocument.submit()" @click="() => formDocument.submit()"

27
src/pages/09_task-order/receive_view/MainPage.vue
View file

@ -3,9 +3,10 @@ import { storeToRefs } from 'pinia';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { computed, onMounted, ref, watch } from 'vue'; import { computed, onMounted, ref, watch } from 'vue';
import { getUserId } from 'src/services/keycloak'; import { getUserId } from 'src/services/keycloak';
import { useI18n } from 'vue-i18n';
// NOTE: Import Components // NOTE: Import Components
import { SaveButton } from 'src/components/button'; import { SaveButton, CancelButton } from 'src/components/button';
import { StateButton } from 'components/button'; import { StateButton } from 'components/button';
import InfoMessengerExpansion from '../expansion/receive/InfoMessengerExpansion.vue'; import InfoMessengerExpansion from '../expansion/receive/InfoMessengerExpansion.vue';
import InfoProductExpansion from '../expansion/receive/InfoProductExpansion.vue'; import InfoProductExpansion from '../expansion/receive/InfoProductExpansion.vue';
@ -31,6 +32,7 @@ import { useTaskOrderStore } from 'src/stores/task-order';
const route = useRoute(); const route = useRoute();
const taskOrderFormStore = useTaskOrderForm(); const taskOrderFormStore = useTaskOrderForm();
const { t } = useI18n();
const { currentFormData, state, fullTaskOrder } = const { currentFormData, state, fullTaskOrder } =
storeToRefs(taskOrderFormStore); storeToRefs(taskOrderFormStore);
@ -342,6 +344,16 @@ function sortList(
}); });
} }
async function closeTab() {
dialogWarningClose(t, {
message: t('dialog.message.close'),
action: () => {
window.close();
},
cancel: () => {},
});
}
onMounted(async () => { onMounted(async () => {
initTheme(); initTheme();
initLang(); initLang();
@ -756,12 +768,15 @@ watch([currentFormData.value.taskStatus], () => {
<!-- SEC: footer --> <!-- SEC: footer -->
<footer <footer class="surface-1 q-pa-md full-width">
v-if="fullTaskOrder.taskOrderStatus !== TaskOrderStatus.Pending" <nav class="row justify-end" style="gap: var(--size-2)">
class="surface-1 q-pa-md full-width" <CancelButton
> :label="$t('dialog.action.close')"
<nav class="row justify-end"> outlined
@click="closeTab()"
/>
<SaveButton <SaveButton
v-if="fullTaskOrder.taskOrderStatus !== TaskOrderStatus.Pending"
:disabled=" :disabled="
fullTaskOrder.taskList.some( fullTaskOrder.taskList.some(
(t) => (t) =>