Merge branch 'develop' into devTee

src/components/CardProfile.vue

@@ -0,0 +1,140 @@
+<script setup lang="ts">
+import { ref, reactive, watch } from "vue";
+import { useQuasar } from "quasar";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+/** importType*/
+import type { FormProfile } from "@/interface/main";
+import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
+
+/** importComponents*/
+import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
+
+/** impoerStore*/
+import { useCounterMixin } from "@/stores/mixin";
+
+/** use*/
+const $q = useQuasar();
+const { messageError, findOrgName } = useCounterMixin();
+
+/** propsDataProfile*/
+const props = defineProps({
+  data: { type: Object, required: true },
+});
+
+const profile = reactive<FormProfile>({
+  id: "",
+  avatar: "",
+  fullName: "",
+  position: "",
+  positionLevel: "",
+  organization: "",
+});
+const modalPersonal = ref<boolean>(false);
+
+function fetchDataProfile(data: DataProfile) {
+  fetchProfile(data.profileId);
+  profile.id = data.profileId;
+  profile.fullName = `${data.prefix}${data.firstName} ${data.lastName}`;
+  profile.position = data.position !== "" ? data.position : "-";
+  profile.positionLevel = `${data.posTypeName} (${data.posLevelName})`;
+  profile.organization = findOrgName(data);
+}
+
+function fetchProfile(id: string) {
+  if (profile.avatar === "") {
+    http
+      .get(
+        config.API.fileByFile("ทะเบียนประวัติ", "โปรไฟล์", id, `profile-${id}`)
+      )
+      .then(async (res) => {
+        profile.avatar = res.data.downloadUrl;
+      })
+      .catch((e) => {
+        if (e.response.data.message === "ไม่พบไฟล์ในระบบ") {
+          profile.avatar = "";
+        } else {
+          messageError($q, e);
+        }
+      });
+  }
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
+function onclickViewinfo() {
+  modalPersonal.value = true;
+}
+
+watch(
+  () => props.data,
+  () => {
+    const dataMain = props.data as DataProfile;
+    fetchDataProfile(dataMain);
+  }
+);
+</script>
+
+<template>
+  <q-card bordered class="row col-12 text-dark">
+    <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
+      <div class="q-pl-sm text-weight-bold text-subtitle2">
+        {{ profile.fullName }}
+      </div>
+      <q-space />
+      <q-btn
+        outline
+        color="blue"
+        dense
+        icon-right="mdi-open-in-new"
+        class="q-px-sm"
+        label="ดูข้อมูลทะเบียนประวัติ"
+        @click="onclickViewinfo()"
+      />
+    </div>
+    <div class="col-12"><q-separator /></div>
+    <div class="row col-12 q-pa-md">
+      <div class="col-12 row bg-white q-col-gutter-md">
+        <div class="col-xs-3 col-sm-2 col-md-1 row">
+          <q-img :src="profile.avatar" v-if="profile.avatar !== ''" />
+          <q-img src="@/assets/avatar_user.jpg" v-else />
+        </div>
+        <div class="col-xs-6 col-sm-3 row items-center">
+          <div class="col-12 q-pl-md">
+            <div class="col-12 text-top">ตำแหน่งในสายงาน</div>
+            <div class="col-12 text-detail">
+              {{ profile.position }}
+            </div>
+          </div>
+        </div>
+        <div class="col-xs-6 col-sm-3 row items-center">
+          <div class="col-12">
+            <div class="col-12 text-top">ประเภทตำแหน่ง</div>
+            <div class="col-12 text-detail">
+              {{ profile.positionLevel }}
+            </div>
+          </div>
+        </div>
+        <div class="col-xs-6 col-sm-3 row items-center">
+          <div class="col-12">
+            <div class="col-12 text-top">สังกัด</div>
+            <div class="col-12 text-detail">
+              {{ profile.organization }}
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="profile.id"
+    @update:modal="updatemodalPersonal"
+  />
+</template>
+
+<style scoped></style>

src/components/Dialogs/PopupPersonalNew.vue

@@ -142,7 +142,7 @@ async function fetchProfileGov(id: string) {
       goverment.positionType = data.posType !== "" ? data.posType : "-";
       goverment.positionLevel = data.posLevel !== "" ? data.posLevel : "-";
       goverment.positionExecutive =
-        data.posExecutive !== "" ? data.posExecutive : "-";
+        data.posExecutive !== null ? data.posExecutive : "-";
       goverment.positionExecutiveSide =
         data.positionExecutiveField !== "" ? data.positionExecutiveField : "-";
     })
@@ -172,9 +172,12 @@ watch(
   async () => {
     modal.value = props.modal ? props.modal : false;
     if (modal.value) {
-      props.id && (fetchInformation(props.id), fetchProfileGov(props.id));
-      (fileName.value = `profile-${props.id}`),
+      if (props.id) {
+        fetchInformation(props.id);
+        fetchProfileGov(props.id);
+        fileName.value = `profile-${props.id}`;
         fetchProfile(props.id as string);
+      }
     }
   }
 );
@@ -214,11 +217,6 @@ async function fetchProfile(id: string) {
           style="color: red; background-color: #ffdede"
         />
       </q-toolbar>
-      <!-- <q-card-section>
-        <div class="text-bold text-h6 text-center">ข้อมูลทะเบียนประวัติ</div>
-        <q-space />
-
-      </q-card-section> -->
 
       <q-card-section class="col q-pt-none bg-grey-12">
         <div class="q-gutter-md">