hrms-mgt/src/modules/16_positionEmployee/components/DialogPositionDetail.vue
2024-03-15 13:54:55 +07:00

76 lines
2.3 KiB
Vue

<script setup lang="ts">
import { useQuasar } from "quasar";
/** importComponents*/
import DialogHeader from "@/components/DialogHeader.vue";
/**use*/
const $q = useQuasar();
/**Props*/
const modal = defineModel<boolean>("positionDetail", { required: true });
const prosp = defineProps({
dataDetailPos: { type: Object, require: true },
});
/** function ปิด popup*/
function close() {
modal.value = false;
}
</script>
<template>
<template>
<q-dialog v-model="modal" persistent>
<q-card :style="$q.screen.gt.md ? 'min-width: 40vw' : 'min-width: 80vw'">
<DialogHeader :tittle="`รายละเอียดตำแหน่ง`" :close="close" />
<q-separator />
<q-card-section>
<div class="q-px-md">
<!-- <div class="row q-col-gutter-sm q-mb-xs">
<div class="col-4 text-bold">
<div>
<p>เลขทตำแหน</p>
</div>
</div>
<div class="col-8 text-grey-8">
<p>{{ prosp?.dataDetailPos?.posMasterNo }}</p>
</div>
</div> -->
<div class="row q-col-gutter-sm q-mb-xs">
<div class="col-4 text-bold">
<div>
<p>กลมงาน</p>
</div>
</div>
<div class="col-8 text-grey-8">
<p>{{ prosp?.dataDetailPos?.posTypeName }}</p>
</div>
</div>
<div class="row q-col-gutter-sm q-mb-xs">
<div class="col-4 text-bold">
<div>
<p>ตำแหน</p>
</div>
</div>
<div class="col-8 text-grey-8">
<p>{{ prosp?.dataDetailPos?.positionName }}</p>
</div>
</div>
<div class="row q-col-gutter-sm q-mb-xs">
<div class="col-4 text-bold">
<div>
<p>ระดบชนงาน</p>
</div>
</div>
<div class="col-8 text-grey-8">
<p>{{ prosp?.dataDetailPos?.posLevelName }}</p>
</div>
</div>
</div>
</q-card-section>
</q-card>
</q-dialog>
</template>
</template>