hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

no message

Browse source
This commit is contained in:
setthawutttty 2023-06-07 16:08:28 +07:00
parent c9d89be624
commit fbdfd4594d
3 changed files with 72 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

20
src/modules/05_placement/components/DialogFooter.vue
View file

@ -13,18 +13,7 @@
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
</q-btn>
<div v-else>
<!-- <q-btn
flat
round
:disabled="!editvisible"
:outline="!editvisible"
:color="!editvisible ? 'grey-7' : 'red'"
@click="cancel()"
icon="mdi-undo"
v-if="modalEdit == true"
>
<q-tooltip>ยกเลิก</q-tooltip>
</q-btn> -->
<q-btn
flat
round
@ -80,11 +69,6 @@ const edit = async () => {
const checkSave = () => {
props.validate();
props.save();
// if (myForm.value !== null) {
// myForm.value.validate().then((success) => {
// if (success) {
// }
// });
// }
};
</script>

3
src/modules/05_placement/components/DialogHeader.vue
View file

@ -12,8 +12,8 @@
</q-toolbar>
</template>
<script setup lang="ts">
import { ref, useAttrs } from "vue";
import { ref, useAttrs } from "vue";
const props = defineProps({
tittle: String,
close: {
@ -24,4 +24,5 @@ const props = defineProps({
const close = async () => {
props.close();
};
</script>

106
src/modules/05_placement/components/PlacementTable.vue
View file

@ -16,6 +16,7 @@ const filter = ref<string>("");
const { placementData } = store;
const editRow = ref<boolean>(false); //เช็คมีการแก้ไขข้อมูล
const modal = ref<boolean>(false); //modal add detail
const modal_right = ref<boolean>(false); //modal add detail
const modalEdit = ref<boolean>(false); //modal ที่แสดงใช้สำหรับแก้ไขหรือไม่
const position = ref<number>();
const Name = ref<string>();
@ -26,7 +27,7 @@ const BMAOfficer = ref<boolean>();
const Status = ref<string>();
const checkList = ref<string>();
const $q = useQuasar(); // show dialog
const $q = useQuasar(); // show dialog
const selectData = (props: TableName) => {
if (editvisible.value == true) {
@ -42,13 +43,29 @@ const selectData = (props: TableName) => {
BMAOfficer.value = props.BMAOfficer;
Status.value = props.Status;
checkList.value = props.checkList;
}else{
} else {
editRow.value = false;
modalEdit.value = true;
modal.value = true;
edit.value = true;
}
};
const editDetail = (props:TableName, action:string) => {
if (action === 'cancel') {
editRow.value = false;
modalEdit.value = false;
modal_right.value = true;
edit.value = true;
Name.value = props.Name;
} else if(action === 'wait'){
editRow.value = false;
modalEdit.value = true;
modal_right.value = true;
edit.value = true;
Name.value = props.Name;
}
};
placementData.mappingPosition.columns.length == 0
? (visibleColumns.value = [
@ -150,7 +167,7 @@ const rows = ref<TableName[]>([
ReportingDate: "30 พ.ค. 2566", //วันที่รายงานตัว
BMAOfficer: true,
Status: "บรรจุเเล้ว",
checkList:null
checkList: null,
},
{
position: 1,
@ -160,7 +177,7 @@ const rows = ref<TableName[]>([
ReportingDate: "30 พ.ค. 2566", //วันที่รายงานตัว
BMAOfficer: true,
Status: "ยังไม่บรรจุ",
checkList:null
checkList: null,
},
{
position: 1,
@ -170,7 +187,7 @@ const rows = ref<TableName[]>([
ReportingDate: "30 พ.ค. 2566", //วันที่รายงานตัว
BMAOfficer: true,
Status: "เตรียมบรรจุ",
checkList:null
checkList: null,
},
{
@ -181,7 +198,7 @@ const rows = ref<TableName[]>([
ReportingDate: "30 พ.ค. 2566", //วันที่รายงานตัว
BMAOfficer: true,
Status: "เตรียมบรรจุ",
checkList:null
checkList: null,
},
{
@ -192,7 +209,7 @@ const rows = ref<TableName[]>([
ReportingDate: "30 พ.ค. 2566", //วันที่รายงานตัว
BMAOfficer: true,
Status: "เตรียมบรรจุ",
checkList:null
checkList: null,
},
{
position: 1,
@ -202,7 +219,7 @@ const rows = ref<TableName[]>([
ReportingDate: "30 พ.ค. 2566", //วันที่รายงานตัว
BMAOfficer: true,
Status: "บรรจุเเล้ว",
checkList:null
checkList: null,
},
]);
const clickCancel = async () => {
@ -217,9 +234,11 @@ const clickClose = async () => {
ok: "ยืนยัน",
persistent: true,
}).onOk(async () => {
modal_right.value = false;
modal.value = false;
});
} else {
modal_right.value = false;
modal.value = false;
}
};
@ -271,15 +290,6 @@ const clickClose = async () => {
class="text-h5"
/>
</div>
<q-toggle
v-else
v-model="props.row.isActive"
dense
color="green"
@update:model-value="
clickIsActive(props.row.id, props.row.isActive)
"
/>
</div>
<div v-else class="table_ellipsis">
{{ col.value }}
@ -297,6 +307,7 @@ const clickClose = async () => {
round
size="14px"
icon="mdi-account-alert"
@click="editDetail(props.row, 'wait')"
/>
<q-btn
color="red"
@ -305,6 +316,7 @@ const clickClose = async () => {
round
size="14px"
icon="mdi-account-remove"
@click="editDetail(props.row, 'cancel')"
/>
</div>
<div v-else align="right">
@ -319,28 +331,46 @@ const clickClose = async () => {
</div>
</q-td>
</q-tr>
<q-dialog v-model="modal" persistent>
<q-card style="width: 800px">
<q-form ref="myForm">
<!-- :tittle="`${modalEdit ? 'แก้ไข' : 'สร้าง'}รายละเอียดของ...`" -->
<DialogHeader
:tittle="`รายละเอียดของ${Name}`"
:close="clickClose"
/>
<q-separator />
<q-card-section class="q-p-sm"> text </q-card-section>
<q-separator />
<DialogFooter
:save="clickSave"
v-model:editvisible="edit"
v-model:modalEdit="modalEdit"
/>
</q-form>
</q-card>
</q-dialog>
<q-dialog v-model="modal_right" persistent>
<q-card style="width: 800px">
<q-form ref="myForm">
<!-- :tittle="`${modalEdit ? 'แก้ไข' : 'สร้าง'}รายละเอียดของ...`" -->
<DialogHeader
:tittle="`${modalEdit ? 'ขอผ่อนผัน' : 'สละสิทธิ์'} ชื่อ...`"
:close="clickClose"
/>
<q-separator />
<q-card-section class="q-p-sm"> text </q-card-section>
<q-separator />
<DialogFooter
:save="clickSave"
v-model:editvisible="edit"
v-model:modalEdit="modalEdit"
/>
</q-form>
</q-card>
</q-dialog>
</template>
</Table>
</q-form>
<q-dialog v-model="modal" persistent>
<q-card style="width: 800px">
<q-form ref="myForm">
<!-- :tittle="`${modalEdit ? 'แก้ไข' : 'สร้าง'}รายละเอียดของ...`" -->
<DialogHeader
:tittle="`รายละเอียดของ`"
:close="clickClose"
/>
<q-separator />
<q-card-section class="q-p-sm">
text
</q-card-section>
<q-separator />
<DialogFooter
:save="clickSave"
v-model:editvisible="edit"
v-model:modalEdit="modalEdit"
/>
</q-form>
</q-card>
</q-dialog>
</template>