updated command template
This commit is contained in:
parent
1267b04af3
commit
de61513d9d
6 changed files with 211 additions and 143 deletions
|
|
@ -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 ? 'แก้ไขคำสั่ง' : 'เพิ่มคำสั่ง'"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue