updated command template

This commit is contained in:
Warunee Tamkoo 2024-09-17 14:01:53 +07:00
parent 1267b04af3
commit de61513d9d
6 changed files with 211 additions and 143 deletions

View file

@ -25,14 +25,7 @@ import TemplateDetail from "@/modules/05_command/components/FormTemplate.vue";
const $q = useQuasar();
const mixin = useCounterMixin();
const store = useDataStore();
const {
dialogConfirm,
success,
showLoader,
hideLoader,
dialogRemove,
messageError,
} = mixin;
const { dialogConfirm, success, showLoader, hideLoader, messageError } = mixin;
const childTemplateDetailRef = ref<InstanceType<typeof TemplateDetail> | null>(
null
@ -55,11 +48,11 @@ const activeOptions = ref<ActiveOptions[]>([
// Tabs
const tabs = ref<Tabs[]>([
{
value: "order",
value: "cover",
label: "คำสั่ง",
},
{
value: "account",
value: "attachment",
label: "บัญชีแนบท้าย",
},
{
@ -71,8 +64,8 @@ const tabs = ref<Tabs[]>([
const dataCategory = ref<DateOption[]>([]); //
const categoryOP = ref<DateOption[]>([]); // options
const idOrder = ref<string>(""); // Id
const activeOrderId = ref<string>(""); // Id
const commandId = ref<string>(""); // Id
const activeCommandId = ref<string>(""); // Id
const name = ref<string>(""); //
const category = ref<string>(""); //
const listOrder = ref<ListOrder[]>([]); // list
@ -140,7 +133,7 @@ function fetchCommandSys() {
* @param val สถานะ true/false
*/
function searchByStatus() {
activeOrderId.value = "";
activeCommandId.value = "";
page.value = 1;
pageSize.value = 13;
fetchCommandType();
@ -151,7 +144,7 @@ function searchByStatus() {
* @param data อมลคำส
*/
function onDialogEdit(data: ListOrder) {
idOrder.value = data.id;
commandId.value = data.id;
name.value = data.name;
status.value = data.isActive;
category.value = data.commandSysId;
@ -184,7 +177,7 @@ function onDialogEdit(data: ListOrder) {
* dialog
*/
function closeDialog() {
idOrder.value = "";
commandId.value = "";
isEdit.value = false;
dialogFormCommand.value = false;
name.value = "";
@ -199,7 +192,7 @@ function onSubmit() {
dialogConfirm($q, async () => {
showLoader();
await http
.put(config.API.commandType + `/${idOrder.value}`, {
.put(config.API.commandType + `/${commandId.value}`, {
name: name.value,
commandSysId: category.value,
isActive: status.value,
@ -222,7 +215,7 @@ function onSubmit() {
* เก id list คำสงทเลอก เพอใช class
*/
function selectInbox(data: ListOrder) {
activeOrderId.value = data.id;
activeCommandId.value = data.id;
fetchDataCommandTypeId(data.id);
}
@ -239,7 +232,7 @@ async function fetchDataCommandTypeId(id: string) {
dataTemplateDetail.value = data;
await Promise.all([
childTemplateDetailRef?.value?.fetchData(data),
childPageOrderRef?.value?.fetchDocumentTemplate(data),
// childPageOrderRef?.value?.fetchDocumentTemplate(data),
]);
})
.catch((err) => {
@ -310,15 +303,11 @@ onMounted(async () => {
</div>
<q-separator />
<q-card-section class="q-pa-sm">
<q-list
v-for="(item, index) in listOrder"
:key="item.id"
class="q-pr-sm"
>
<q-list v-for="(item, index) in listOrder" bordered :key="item.id">
<q-item
clickable
v-ripple
:active="activeOrderId === item.id"
:active="activeCommandId === item.id"
active-class="my-menu_link"
@click="selectInbox(item)"
>
@ -329,13 +318,14 @@ onMounted(async () => {
</q-item-section>
<q-item-section side center @click.stop>
<q-icon
name="mdi-dots-vertical"
name="edit"
class="q-pa-none q-ml-xs"
color="grey-13"
color="edit"
flat
dense
>
<q-menu transition-show="jump-down" transition-hide="jump-up">
@click="onDialogEdit(item)"
/>
<!-- <q-menu transition-show="jump-down" transition-hide="jump-up">
<q-list dense style="min-width: 160px">
<q-item
clickable
@ -352,7 +342,7 @@ onMounted(async () => {
<q-item-section>แกไข</q-item-section>
</q-item>
<q-separator />
<!-- <q-item
<q-item
clickable
v-close-popup
@click="onDelete(item.id)"
@ -365,35 +355,18 @@ onMounted(async () => {
<q-icon color="red" size="xs" name="mdi-delete" />
</q-item-section>
<q-item-section>ลบ</q-item-section>
</q-item> -->
<q-separator />
</q-list> </q-menu
></q-icon>
</q-item>
</q-list>
</q-menu> -->
<!-- </q-icon> -->
</q-item-section>
</q-item>
<q-separator v-if="listOrder.length !== index + 1" />
</q-list>
<div
class="full-width row flex-center text-accent q-gutter-sm"
v-if="listOrder.length === 0"
class="full-width row flex-center text-accent q-gutter-sm"
>
<span
><div
style="
height: 76vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
"
class="text-grey-5"
>
<q-icon name="search" size="4rem" />
<span>{{ "ไม่พบข้อมูล" }}</span>
</div>
</span>
<div class="text-grey-5">ไมพบขอม</div>
</div>
</q-card-section>
<q-separator />
@ -415,7 +388,7 @@ onMounted(async () => {
</div>
<div class="col-8">
<q-card bordered style="height: 100%">
<div v-if="activeOrderId !== ''">
<div v-if="activeCommandId !== ''">
<q-tabs
dense
v-model="store.currentTab"
@ -436,20 +409,22 @@ onMounted(async () => {
</q-tabs>
<q-separator />
<q-tab-panels v-model="store.currentTab" animated>
<q-tab-panel name="order">
<q-tab-panel name="cover">
<PageOrder
ref="childPageOrderRef"
v-model:type="store.currentTab"
v-model:data-template-detail="dataTemplateDetail as DataTemplateDetail"
:id-order="activeOrderId"
:command-id="activeCommandId"
:fetch-data-template="fetchDataCommandTypeId"
/>
</q-tab-panel>
<q-tab-panel name="account">
<q-tab-panel name="attachment">
<PageOrder
ref="childPageOrderRef"
v-model:type="store.currentTab"
v-model:data-template-detail="dataTemplateDetail as DataTemplateDetail"
:id-order="activeOrderId"
:command-id="activeCommandId"
:fetch-data-template="fetchDataCommandTypeId"
/>
</q-tab-panel>
<q-tab-panel name="template">
@ -457,7 +432,7 @@ onMounted(async () => {
ref="childTemplateDetailRef"
v-model:type="store.currentTab"
v-model:data-template-detail="dataTemplateDetail as DataTemplateDetail"
:command-id="activeOrderId"
:command-id="activeCommandId"
:fetch-data-template="fetchDataCommandTypeId"
/>
</q-tab-panel>
@ -483,7 +458,7 @@ onMounted(async () => {
</div>
<q-dialog v-model="dialogFormCommand" persistent>
<q-card class="col-12" style="min-width: 30%">
<q-card class="col-12" style="width: 40vw">
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header
:tittle="isEdit ? 'แก้ไขคำสั่ง' : 'เพิ่มคำสั่ง'"