ออกคำสั่ง => ปรับ form

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-06-12 11:17:16 +07:00
parent 2d2b3a77b5
commit 076d71830c
4 changed files with 54 additions and 244 deletions

View file

@ -2,7 +2,7 @@
import { ref, onMounted } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
import type { QInput, QForm } from "quasar";
import type { treeTab } from "@/modules/05_placement/interface/index/Main";
import http from "@/plugins/http";
@ -42,52 +42,13 @@ const filterRef = ref<QInput>();
const filter = ref<string>("");
const modal = ref<boolean>(false);
const search = ref<string>("");
const expanded = ref<string[]>([]);
const selected = ref<string>("");
const nodesTree = ref<treeTab[]>([]);
const selectedModal = ref<ResponseOrganiz[]>([]);
const filterModal = ref<string>("");
const visibleColumnsModal = ref<String[]>(["no", "idCard", "name", "position"]);
const columnsModal = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
field: "no",
sortable: false,
},
{
name: "idCard",
align: "left",
label: "เลขประจำตัวประชาชน",
field: "idCard",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "name",
align: "left",
label: "ชื่อ-นามสกุล",
field: "name",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "position",
align: "left",
label: "ตำแหน่ง",
field: "position",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const rowsModal = ref<ResponseOrganiz[]>([]);
const optionSelect = ref<DataOption[]>([
@ -245,7 +206,6 @@ const getData = async (id: string) => {
};
//
const saveData = async () => {
const id = route.params.orderid
? route.params.orderid.toString()
: localStorage.getItem("orderId")
@ -377,8 +337,8 @@ const updateData = (row: DataCopyOrder) => {
</script>
<template>
<div>
<div class="q-py-md q-pl-md" style="max-height: 68vh; overflow-y: scroll">
<q-card>
<q-card-section>
<div class="col-12 row q-py-sm items-center">
<q-btn flat round color="primary" @click="clickAdd" icon="mdi-plus">
<q-tooltip>เพมขอม</q-tooltip>
@ -506,11 +466,11 @@ const updateData = (row: DataCopyOrder) => {
</template>
</d-table>
</q-form>
</div>
</q-card-section>
<q-separator />
<div class="flex justify-end q-pa-sm q-gutter-sm">
<q-card-actions align="right">
<q-btn
dense
outline
color="primary"
icon="chevron_left"
@ -520,8 +480,6 @@ const updateData = (row: DataCopyOrder) => {
>
</q-btn>
<q-btn
dense
unelevated
label="บันทึก"
color="public"
@click="saveDataCopyOrder"
@ -529,140 +487,8 @@ const updateData = (row: DataCopyOrder) => {
>
<q-tooltip>นทกขอม</q-tooltip>
</q-btn>
</div>
</div>
<!-- <q-dialog v-model="modal" persistent full-width>
<q-card>
<DialogHeader tittle="เลือกรายชื่อตามหน่วยงาน" :close="clickClose" />
<q-separator />
<q-card-section class="q-pa-sm bg-grey-1">
<div class="row col-12 q-col-gutter-sm">
<div class="col-xs-12 col-sm-5 row">
<q-card flat bordered class="fit q-pa-sm">
<q-scroll-area visible style="height: 70vh">
<q-input
outlined
dense
v-model="search"
placeholder="ค้นหา"
class="q-mb-sm"
>
<template v-slot:append>
<q-icon name="mdi-magnify" />
</template>
</q-input>
<q-tree
:nodes="nodesTree"
dense
node-key="id"
v-model:selected="selected"
v-model:expanded="expanded"
no-selection-unset
selected-color="primary"
@update:selected="onSelected"
default-expand-all
/>
</q-scroll-area>
</q-card>
</div>
<div class="col-xs-12 col-sm-7">
<div class="col-12 row q-py-sm items-center">
<q-space />
<div class="items-center" style="display: flex">
<q-input
standout
dense
v-model="filterModal"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
style="max-width: 200px"
class="q-ml-sm"
>
<template v-slot:append>
<q-icon v-if="filterModal == ''" name="search" />
<q-icon
v-if="filterModal !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<q-select
v-model="visibleColumnsModal"
:display-value="$q.lang.table.columns"
multiple
outlined
dense
:options="columnsModal"
options-dense
option-value="name"
map-options
emit-value
style="min-width: 150px"
class="gt-xs q-ml-sm"
/>
</div>
</div>
<d-table
:rows="rowsModal"
:columns="columnsModal"
:visible-columns="visibleColumnsModal"
:filter="filterModal"
row-key="profileId"
selection="multiple"
v-model:selected="selectedModal"
>
<template v-slot:header-selection="scope">
<q-checkbox
keep-color
color="primary"
dense
v-model="scope.selected"
/>
</template>
<template v-slot:body-selection="scope">
<q-checkbox
keep-color
color="primary"
dense
v-model="scope.selected"
/>
</template>
<template v-slot:body-cell="props">
<q-td :props="props">
<div v-if="props.col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else>
{{ props.value }}
</div>
</q-td>
</template>
</d-table>
</div>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn
dense
unelevated
label="บันทึก"
color="public"
@click="saveData"
class="q-px-md"
/>
</q-card-actions>
</q-card>
</q-dialog> -->
</q-card-actions>
</q-card>
<DialogOrgSelectOneStep
v-model:modal="modal"