แก้ space ขึ้นบรรทัดใหม่ เเก้คำ พ้นราชการ

src/components/CardProfile.vue

@@ -16,7 +16,7 @@ import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 import { useCounterMixin } from "@/stores/mixin";
 
 /** use*/
-const { findOrgNameOld, findOrgName } = useCounterMixin();
+const { findOrgNameOld, findOrgName, textTranForm } = useCounterMixin();
 
 /** propsDataProfile*/
 const props = defineProps({
@@ -154,7 +154,7 @@ watch(
               {{
                 props.type.toLowerCase() == "employee"
                   ? "กลุ่มงาน"
-                  : "ประเภทตำแหน่ง"
+                  : "ตำแหน่งประเภท"
               }}
             </div>
             <div class="col-12 text-detail">
@@ -165,8 +165,8 @@ watch(
         <div class="col-xs-6 col-sm-3 row">
           <div class="col-12">
             <div class="col-12 text-top">สังกัด</div>
-            <div class="col-12 text-detail">
+            <div class="col-12 text-detail text-html">
-              {{ profile.organization }}
+              {{ textTranForm(profile.organization) }}
             </div>
           </div>
         </div>

src/components/Dialogs/PopupPersonalNew.vue

@@ -22,7 +22,7 @@ const mixin = useCounterMixin();
 const router = useRouter();
 const $q = useQuasar();
 const retireDate = ref<Date>();
-const { showLoader, hideLoader, messageError, date2Thai } = mixin;
+const { showLoader, hideLoader, messageError, date2Thai,textTranForm } = mixin;
 
 const isEmployee = defineModel("isEmployee", { type: String });
 const empType = ref<string>("officer");
@@ -370,11 +370,11 @@ async function fetchProfile(id: string, avatarName: string) {
                     <span class="q-ml-md">ข้อมูลราชการ </span>
                   </div>
                   <div class="row q-pa-sm">
-                    <div class="col-xs-12 col-md-12">
+                    <div class="col-xs-12 col-md-12 text-html">
                       <q-input
                         borderless
                         readonly
-                        :model-value="goverment.oc === '' ? '-' : goverment.oc"
+                        :model-value="goverment.oc === '' ? '-' : textTranForm(goverment.oc)"
                         label="สังกัด"
                         autogrow
                       ></q-input>

src/modules/06_retirement/components/01_retirement/AddList.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { reactive, ref, watch } from "vue";
+import { reactive, ref, watch, computed } from "vue";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
@@ -18,13 +18,14 @@ const {
   showLoader,
   hideLoader,
   dialogConfirm,
-  findOrgName,
+  findOrgChildName,
 } = mixin;
 const route = useRoute();
 const retireld_params = route.params.id;
 
 /** props*/
 const props = defineProps({
+  employeeType: Boolean,
   retireld: String,
   profileId: String,
   dataProfile: Object,
@@ -34,12 +35,12 @@ const props = defineProps({
   },
 });
 
-const modal = ref<boolean>(false);
+const modal = defineModel<boolean>("modal", { required: true });
 const retireld = ref<any>();
 const type = ref<any>();
 
 /** คอลัมน์ */
-const columns = ref<any["columns"]>([
+const columns = computed(() => [
   {
     name: "index",
     required: true,
@@ -57,14 +58,14 @@ const columns = ref<any["columns"]>([
   {
     name: "position",
     required: true,
-    label: "ตำแหน่งในสายงาน",
+    label: props.employeeType ? "ตำแหน่งในสายงาน" : "ตำแหน่ง",
     field: "position",
     align: "left",
   },
   {
     name: "level",
     required: true,
-    label: "ประเภทตำแหน่ง",
+    label: props.employeeType ? "ตำแหน่งประเภท" : "กลุ่มงาน",
     field: "level",
     align: "left",
   },
@@ -78,42 +79,6 @@ const columns = ref<any["columns"]>([
 ]);
 const rows = ref<PersonData[]>([]);
 
-function findOrgChildName(obj: any) {
-  if (obj) {
-    let name =
-      obj.orgChild4Name != null && obj.orgChild3Name != null
-        ? obj.orgChild4Name + " "
-        : obj.orgChild4Name != null
-        ? obj.orgChild4Name
-        : "";
-
-    name +=
-      obj.orgChild3Name != null && obj.orgChild2Name != null
-        ? obj.orgChild3Name + " "
-        : obj.orgChild3Name !== null
-        ? obj.orgChild3Name
-        : "";
-
-    name +=
-      obj.orgChild2Name != null && obj.orgChild1Name != null
-        ? obj.orgChild2Name + " "
-        : obj.orgChild2Name != null
-        ? obj.orgChild2Name
-        : "";
-
-    name +=
-      obj.orgChild1Name != null && obj.orgRootName != null
-        ? obj.orgChild1Name + " "
-        : obj.orgChild1Name != null
-        ? obj.orgChild1Name
-        : "";
-    name += obj.orgRootName != null ? obj.orgRootName : "";
-    return name == "" ? "-" : name;
-  } else {
-    return "";
-  }
-}
-
 const formPagePersonList = reactive({ keyword: "", pageSize: 10, page: 1 });
 const maxPage = ref<number>(1);
 const totalList = ref<number>(0);
@@ -251,11 +216,7 @@ watch(modal, () => {
 </script>
 
 <template>
-  <q-btn flat round color="primary" icon="mdi-plus" @click="modal = true">
+  <q-dialog v-model="modal" persistent>
-    <q-tooltip>เพิ่มรายชื่อ</q-tooltip></q-btn
-  >
-
-  <q-dialog v-model="modal" Persistent>
     <q-card style="width: 900px; max-width: 80vw">
       <DialogHeader :tittle="'เพิ่มรายชื่อ'" :close="closeDialog" />
       <q-separator />
@@ -315,12 +276,10 @@ watch(modal, () => {
                     {{ props.row.position ? props.row.position : "-" }}
                   </q-td>
                   <q-td key="level" :props="props">{{ props.row.level }}</q-td>
-                  <q-td
+                  <q-td key="organizationOrganization" :props="props">
-                    key="organizationOrganization"
+                    <div class="text-html">
-                    :props="props"
+                      {{ props.row.organizationOrganization }}
-                    class="table_ellipsis"
+                    </div>
-                  >
-                    {{ props.row.organizationOrganization }}
                   </q-td>
                   <q-td>
                     <q-btn

src/modules/06_retirement/components/01_retirement/DialogAddListRetirement.vue

@@ -64,7 +64,6 @@ function clickAdd() {
           round: `รอบ ${e.round}  (ประกาศ ณ วันที่ ${e.signDate})`,
         }));
         actionOption.value = list;
-        console.log("🚀 ~ clickAdd ~ actionOption.value:", actionOption.value);
       }
     }
   }

src/modules/06_retirement/components/01_retirement/RetirementDetail.vue

@@ -31,11 +31,13 @@ const {
   date2Thai,
   dateToISO,
   findOrgName,
+  findOrgNameHtml,
   onSearchDataTable,
 } = mixin;
 const myForm = ref<QForm | null>(null);
 
 /** ตัวแปร  */
+const modal = ref<boolean>(false);
 const retireld_params = route.params.retirementId;
 const retireld = ref<string>(retireld_params.toString());
 const modalPersonal = ref<boolean>(false);
@@ -54,7 +56,7 @@ const fileUpload = ref<any>(null);
 const round = ref<number>();
 const typeReport = ref<string>("");
 const statusReport = ref<boolean>();
-const dataProfile = ref<Object>([]);
+const dataProfile = ref<any>([]);
 
 /** คอลัมน์ที่แสดง */
 const columns = computed(() => [
@@ -75,6 +77,9 @@ const columns = computed(() => [
     field: "name",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(val: any, row: any) {
+      return `${row.prefix ?? ""}${row.firstName ?? ""} ${row.lastName ?? ""}`;
+    },
   },
   {
     name: "position",
@@ -92,8 +97,8 @@ const columns = computed(() => [
     label: `ตำแหน่ง (${
       employeeType.value == "OFFICER" ? "ประเภท" : "กลุ่มงาน"
     })`,
-    title: "ตำแหน่ง",
+    title: employeeType.value == "OFFICER" ? "ตำแหน่ง" : "กลุ่มงาน",
-    subtitle: employeeType.value == "OFFICER" ? "ประเภท" : "กลุ่มงาน",
+    subtitle: employeeType.value == "OFFICER" ? "ประเภท" : "",
     field: "positionType",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
@@ -103,8 +108,8 @@ const columns = computed(() => [
     name: "positionNumber",
     align: "left",
     label: "ตำแหน่ง (เลขที่)",
-    title: "ตำแหน่ง",
+    title: employeeType.value == "OFFICER" ? "เลขที่" : "ตำแหน่ง",
-    subtitle: "เลขที่",
+    subtitle: employeeType.value == "OFFICER" ? "ตำแหน่ง" : "เลขที่",
     field: "positionNumber",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
@@ -168,7 +173,6 @@ async function fetchlistprofile(id: string) {
           prefix: e.prefix,
           firstName: e.firstName,
           lastName: e.lastName,
-          name: `${e.prefix}${e.firstName} ${e.lastName}`,
           organization: e.root,
           position: e.position,
           positionNumber: e.posNo,
@@ -452,18 +456,15 @@ onMounted(async () => {
     <q-card class="col-12 q-pa-md">
       <div class="row col-12 q-pb-sm">
         <div class="row">
-          <AddList
+          <q-btn
-            :dataProfile="dataProfile"
+            flat
-            :retireld="retireld"
+            round
-            :profile-id="profileId"
+            color="primary"
-            :UpdateListId="UpdateListId"
+            icon="mdi-plus"
-            v-if="
+            @click="modal = true"
-              !checkRoutePermisson &&
+          >
-              !statusReport &&
+            <q-tooltip>เพิ่มรายชื่อ</q-tooltip></q-btn
-              (typeReport == 'ADD' || typeReport == '' || typeReport == null) &&
+          >
-              !statusUpload
-            "
-          />
           <q-btn color="primary" flat round icon="mdi-dots-vertical">
             <q-menu>
               <q-list style="min-width: 100px">
@@ -670,7 +671,10 @@ onMounted(async () => {
               </q-td>
 
               <q-td v-for="col in props.cols" :key="col.id">
-                <div class="table_ellipsis">
+                <div v-if="col.name == 'organization'" class="text-html">
+                  {{ props.row ? findOrgNameHtml(props.row) : "-" }}
+                </div>
+                <div v-else class="table_ellipsis">
                   {{ col.value ? col.value : "-" }}
                 </div>
               </q-td>
@@ -845,11 +849,27 @@ onMounted(async () => {
     :textReport="textReport"
   />
 
+  <AddList
+    v-model:modal="modal"
+    v-model:dataProfile="dataProfile"
+    :retireld="retireld"
+    :employeeType="employeeType == 'OFFICER' ? true : false"
+    :profile-id="profileId"
+    :UpdateListId="UpdateListId"
+    v-if="
+      !checkRoutePermisson &&
+      !statusReport &&
+      (typeReport == 'ADD' || typeReport == '' || typeReport == null) &&
+      !statusUpload
+    "
+  />
+
   <PopupPersonal
     :modal="modalPersonal"
     :id="personId"
     @update:modal="updatemodalPersonal"
     v-model:is-employee="employeeType"
+    :type="employeeType === 'OFFICER' ? 'officer' : 'employee'"
   />
 </template>
 

src/modules/06_retirement/components/02_resign/DialogSendToCommand.vue

@@ -33,7 +33,7 @@ const dataMapToSend = computed(() => {
   }));
 });
 const mixin = useCounterMixin();
-const { dialogConfirm, date2Thai, onSearchDataTable } = mixin;
+const { dialogConfirm, date2Thai, onSearchDataTable, textTranForm } = mixin;
 
 /** props*/
 const props = defineProps({
@@ -41,11 +41,11 @@ const props = defineProps({
   closeModal: { type: Function, requreid: true },
   fecthList: { type: Function, requreid: true },
   rows: { type: Array as PropType<ResponseItems[]>, requreid: true },
-  filterKeyword2: { type: String, requreid: true },
   mainTabs: { type: String, requreid: true },
 });
 
 //Table
+const filterKeyword = defineModel<string>("filterKeyword", { required: true });
 const rowsData = ref<ResponseItems[]>([]);
 const rowsDataMain = ref<ResponseItems[]>([]);
 const columns = ref<QTableProps["columns"]>([
@@ -84,7 +84,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "positionLevel",
     align: "left",
-    label: "ประเภทตำแหน่ง",
+    label: "ตำแหน่งประเภท",
     sortable: true,
     field: "positionLevel",
     headerStyle: "font-size: 14px",
@@ -104,7 +104,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "positionNumberOld",
     align: "left",
-    label: "เลขที่",
+    label: "เลขที่ตำแหน่ง",
     sortable: true,
     field: "positionNumberOld",
     headerStyle: "font-size: 14px",
@@ -118,6 +118,9 @@ const columns = ref<QTableProps["columns"]>([
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(val, row) {
+      return `${row.organizationPositionOld.replace(/\n/g, " ")}`;
+    },
   },
   {
     name: "datetext",
@@ -161,7 +164,6 @@ const modalCommand = ref<boolean>(false);
 
 /** popup ยืนยันส่งัว */
 function saveOrder() {
-  console.log(selected.value);
 
   dialogConfirm(
     $q,
@@ -181,7 +183,7 @@ function updateInput(value: any) {
 
 async function onSearch() {
   rowsData.value = onSearchDataTable(
-    props.filterKeyword2 ? props.filterKeyword2 : "",
+    filterKeyword.value,
     rowsDataMain.value,
     columns.value ? columns.value : []
   );
@@ -214,8 +216,7 @@ watch(
               borderless
               outlined
               dense
-              :model-value="filterKeyword2"
+              v-model="filterKeyword"
-              @update:model-value="updateInput"
               @keydown.enter="onSearch"
               placeholder="ค้นหา"
             >
@@ -269,14 +270,17 @@ watch(
                   </q-td>
                   <q-td v-for="col in props.cols" :key="col.id">
                     <div
-                      :class="
+                      v-if="col.name == 'organizationPositionOld'"
-                        col.name === 'organizationPositionOld' ||
+                      class="text-html"
-                        col.name === 'organization'
-                          ? 'table_ellipsis2'
-                          : ''
-                      "
                     >
-                      {{ col.value ? col.value : "" }}
+                      {{
+                        props.row.organizationPositionOld
+                          ? textTranForm(props.row.organizationPositionOld)
+                          : "-"
+                      }}
+                    </div>
+                    <div v-else>
+                      {{ col.value ? col.value : "-" }}
                     </div>
                   </q-td>
                 </q-tr>

src/modules/06_retirement/components/02_resign/ResignByid.vue

@@ -1274,9 +1274,9 @@ onMounted(async () => {
                   :readonly="!edit"
                   :borderless="!edit"
                   v-model="posNo"
-                  :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่'}`]"
+                  :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่ตำแหน่ง'}`]"
                   hide-bottom-space
-                  :label="`${'เลขที่'}`"
+                  :label="`${'เลขที่ตำแหน่ง'}`"
                 />
               </div>
             </div>

src/modules/06_retirement/components/02_resign/ResignReject.vue

@@ -636,9 +636,9 @@ onMounted(async () => {
                   :readonly="!edit"
                   :borderless="!edit"
                   v-model="posNo"
-                  :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่'}`]"
+                  :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่ตำแหน่ง'}`]"
                   hide-bottom-space
-                  :label="`${'เลขที่'}`"
+                  :label="`${'เลขที่ตำแหน่ง'}`"
                 />
               </div>
             </div>

src/modules/06_retirement/components/02_resign/Table.vue

@@ -23,8 +23,15 @@ const stroeResign = useDataStore();
 const { statusText } = stroe;
 const router = useRouter();
 const mixin = useCounterMixin();
-const { messageError, date2Thai, showLoader, hideLoader, onSearchDataTable } =
+const {
-  mixin;
+  messageError,
+  date2Thai,
+  showLoader,
+  hideLoader,
+  onSearchDataTable,
+  findOrgName,
+  textTranForm,
+} = mixin;
 
 /** Table */
 const rows = ref<ResponseItems[]>([]);
@@ -65,7 +72,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "positionLevel",
     align: "left",
-    label: "ประเภทตำแหน่ง",
+    label: "ตำแหน่งประเภท",
     sortable: true,
     field: "positionLevel",
     headerStyle: "font-size: 14px",
@@ -85,7 +92,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "positionNumberOld",
     align: "left",
-    label: "เลขที่",
+    label: "เลขที่ตำแหน่ง",
     sortable: true,
     field: "positionNumberOld",
     headerStyle: "font-size: 14px",
@@ -99,6 +106,9 @@ const columns = ref<QTableProps["columns"]>([
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(val, row) {
+      return `${row.organizationPositionOld.replace(/\n/g, " ")}`;
+    },
   },
   {
     name: "datetext",
@@ -377,7 +387,19 @@ onMounted(async () => {
                       : ''
                   "
                 >
-                  {{ col.value ? col.value : "-" }}
+                  <div
+                    v-if="col.name == 'organizationPositionOld'"
+                    class="text-html"
+                  >
+                    {{
+                      props.row.organizationPositionOld
+                        ? textTranForm(props.row.organizationPositionOld)
+                        : "-"
+                    }}
+                  </div>
+                  <div v-else>
+                    {{ col.value ? col.value : "-" }}
+                  </div>
                 </div>
               </q-td>
             </q-tr>
@@ -389,7 +411,7 @@ onMounted(async () => {
 
   <DialogSendToCommand
     v-model:modal="modal"
-    v-model:filter-keyword2="filterKeyword2"
+    v-model:filter-keyword="filterKeyword2"
     :close-modal="closeModal"
     :rows="rowsSendToCommand"
     :fecth-list="fecthlist"

src/modules/06_retirement/components/03_resignEmp/DialogSendToCommand.vue

@@ -33,7 +33,7 @@ const dataMapToSend = computed(() => {
   }));
 });
 const mixin = useCounterMixin();
-const { dialogConfirm, date2Thai, onSearchDataTable } = mixin;
+const { dialogConfirm, date2Thai, onSearchDataTable, textTranForm } = mixin;
 
 /** props*/
 const props = defineProps({
@@ -41,10 +41,11 @@ const props = defineProps({
   closeModal: { type: Function, requreid: true },
   fecthList: { type: Function, requreid: true },
   rows: { type: Array as PropType<ResponseItems[]>, requreid: true },
-  filterKeyword2: { type: String, requreid: true },
   mainTabs: { type: String, requreid: true },
 });
 
+const filterKeyword = defineModel<string>("filterKeyword", { required: true });
+
 //Table
 const rowsData = ref<ResponseItems[]>([]);
 const rowsDataMain = ref<ResponseItems[]>([]);
@@ -104,7 +105,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "positionNumberOld",
     align: "left",
-    label: "เลขที่",
+    label: "ตำแหน่งเลขที่",
     sortable: true,
     field: "positionNumberOld",
     headerStyle: "font-size: 14px",
@@ -118,6 +119,9 @@ const columns = ref<QTableProps["columns"]>([
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(val, row) {
+      return `${row.organizationPositionOld.replace(/\n/g, " ")}`;
+    },
   },
   {
     name: "datetext",
@@ -179,7 +183,7 @@ function updateInput(value: any) {
 
 async function onSearch() {
   rowsData.value = onSearchDataTable(
-    props.filterKeyword2 ? props.filterKeyword2 : "",
+    filterKeyword.value,
     rowsDataMain.value,
     columns.value ? columns.value : []
   );
@@ -212,8 +216,7 @@ watch(
               borderless
               outlined
               dense
-              :model-value="filterKeyword2"
+              :model-value="filterKeyword"
-              @update:model-value="updateInput"
               placeholder="ค้นหา"
               @keydown.enter="onSearch"
             >
@@ -267,14 +270,17 @@ watch(
                   </q-td>
                   <q-td v-for="col in props.cols" :key="col.id">
                     <div
-                      :class="
+                      v-if="col.name == 'organizationPositionOld'"
-                        col.name === 'organizationPositionOld' ||
+                      class="text-html"
-                        col.name === 'organization'
-                          ? 'table_ellipsis2'
-                          : ''
-                      "
                     >
-                      {{ col.value ? col.value : "" }}
+                      {{
+                        props.row.organizationPositionOld
+                          ? textTranForm(props.row.organizationPositionOld)
+                          : "-"
+                      }}
+                    </div>
+                    <div v-else>
+                      {{ col.value ? col.value : "-" }}
                     </div>
                   </q-td>
                 </q-tr>

src/modules/06_retirement/components/03_resignEmp/ResignByid.vue

@@ -1295,9 +1295,9 @@ onMounted(async () => {
                   :readonly="!edit"
                   :borderless="!edit"
                   v-model="posNo"
-                  :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่'}`]"
+                  :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่งเลขที่'}`]"
                   hide-bottom-space
-                  :label="`${'เลขที่'}`"
+                  :label="`${'ตำแหน่งเลขที่'}`"
                 />
               </div>
             </div>

src/modules/06_retirement/components/03_resignEmp/ResignReject.vue

@@ -667,9 +667,9 @@ onMounted(async () => {
                   :readonly="!edit"
                   :borderless="!edit"
                   v-model="posNo"
-                  :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่'}`]"
+                  :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่งเลขที่'}`]"
                   hide-bottom-space
-                  :label="`${'เลขที่'}`"
+                  :label="`${'ตำแหน่งเลขที่'}`"
                 />
               </div>
             </div>

src/modules/06_retirement/components/03_resignEmp/Table.vue

@@ -23,8 +23,14 @@ const stroeResign = useDataStore();
 const { statusText } = stroe;
 const router = useRouter();
 const mixin = useCounterMixin();
-const { messageError, date2Thai, showLoader, hideLoader, onSearchDataTable } =
+const {
-  mixin;
+  messageError,
+  date2Thai,
+  showLoader,
+  hideLoader,
+  onSearchDataTable,
+  textTranForm,
+} = mixin;
 
 /** Table */
 const rows = ref<ResponseItems[]>([]);
@@ -85,7 +91,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "positionNumberOld",
     align: "left",
-    label: "เลขที่",
+    label: "ตำแหน่งเลขที่",
     sortable: true,
     field: "positionNumberOld",
     headerStyle: "font-size: 14px",
@@ -99,6 +105,9 @@ const columns = ref<QTableProps["columns"]>([
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(val, row) {
+      return `${row.organizationPositionOld.replace(/\n/g, " ")}`;
+    },
   },
   {
     name: "datetext",
@@ -374,13 +383,16 @@ onMounted(async () => {
               </q-td>
               <q-td v-for="col in props.cols" :key="col.id">
                 <div
-                  :class="
+                  v-if="col.name == 'organizationPositionOld'"
-                    col.name === 'organizationPositionOld' ||
+                  class="text-html"
-                    col.name === 'organization'
-                      ? 'table_ellipsis2'
-                      : ''
-                  "
                 >
+                  {{
+                    props.row.organizationPositionOld
+                      ? textTranForm(props.row.organizationPositionOld)
+                      : "-"
+                  }}
+                </div>
+                <div v-else>
                   {{ col.value ? col.value : "-" }}
                 </div>
               </q-td>
@@ -393,7 +405,7 @@ onMounted(async () => {
 
   <DialogSendToCommand
     v-model:modal="modal"
-    v-model:filter-keyword2="filterKeyword2"
+    v-model:filter-keyword="filterKeyword2"
     :close-modal="closeModal"
     :rows="rowsSendToCommand"
     :fecth-list="fecthlist"

src/modules/06_retirement/components/06_dismissOrder/Detail.vue

@@ -274,9 +274,9 @@ onMounted(async () => {
                 :readonly="!edit"
                 :borderless="!edit"
                 v-model="positionTypeOld"
-                :rules="[(val:string) => !!val || `${'กรุณากรอกประเภทตำแหน่ง'}`]"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่งประเภท'}`]"
                 hide-bottom-space
-                :label="`${'ประเภทตำแหน่ง'}`"
+                :label="`${'ตำแหน่งประเภท'}`"
               />
             </div>
           </div>
@@ -306,9 +306,9 @@ onMounted(async () => {
                 :readonly="!edit"
                 :borderless="!edit"
                 v-model="posNo"
-                :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่'}`]"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่ตำแหน่ง'}`]"
                 hide-bottom-space
-                :label="`${'เลขที่'}`"
+                :label="`${'เลขที่ตำแหน่ง'}`"
               />
             </div>
           </div>

src/modules/06_retirement/components/06_dismissOrder/DetailEMP.vue

@@ -307,9 +307,9 @@ onMounted(async () => {
                 :readonly="!edit"
                 :borderless="!edit"
                 v-model="posNo"
-                :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่'}`]"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่งเลขที่'}`]"
                 hide-bottom-space
-                :label="`${'เลขที่'}`"
+                :label="`${'ตำแหน่งเลขที่'}`"
               />
             </div>
           </div>

src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommand.vue

@@ -52,6 +52,7 @@ const {
   hideLoader,
   date2Thai,
   onSearchDataTable,
+  textTranForm,
 } = mixin;
 
 /** คอลัมน์ */
@@ -80,7 +81,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "positionLevel",
     align: "left",
-    label: "ประเภทตำแหน่ง",
+    label: "ตำแหน่งประเภท",
     sortable: true,
     field: "positionLevel",
     headerStyle: "font-size: 14px",
@@ -105,6 +106,9 @@ const columns = ref<QTableProps["columns"]>([
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(val, row) {
+      return `${row.organizationPositionOld.replace(/\n/g, " ")}`;
+    },
   },
   {
     name: "createdAt",
@@ -256,10 +260,14 @@ watchEffect(() => {
                       {{ props.rowIndex + 1 }}
                     </div>
 
-                    <div
+                    <div v-else-if="col.name == 'org'" class="text-html">
-                      v-else
+                      {{
-                      :class="col.name === 'org' ? 'table_ellipsis' : ''"
+                        props.row.organizationPositionOld
-                    >
+                          ? textTranForm(props.row.organizationPositionOld)
+                          : "-"
+                      }}
+                    </div>
+                    <div v-else>
                       {{ col.value ? col.value : "-" }}
                     </div>
                   </q-td>

src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommandEmp.vue

@@ -52,6 +52,7 @@ const {
   hideLoader,
   date2Thai,
   onSearchDataTable,
+  textTranForm,
 } = mixin;
 
 /** คอลัมน์ */
@@ -105,6 +106,9 @@ const columns = ref<QTableProps["columns"]>([
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(val, row) {
+      return `${row.organizationPositionOld.replace(/\n/g, " ")}`;
+    },
   },
   {
     name: "createdAt",
@@ -257,9 +261,16 @@ watchEffect(() => {
                     </div>
 
                     <div
-                      v-else
+                      v-else-if="col.name == 'organizationPositionOld'"
-                      :class="col.name === 'org' ? 'table_ellipsis' : ''"
+                      class="text-html"
                     >
+                      {{
+                        props.row.organizationPositionOld
+                          ? textTranForm(props.row.organizationPositionOld)
+                          : "-"
+                      }}
+                    </div>
+                    <div v-else>
                       {{ col.value ? col.value : "-" }}
                     </div>
                   </q-td>

src/modules/06_retirement/views/04_exitInterview.vue

@@ -189,7 +189,6 @@ async function fecthlist() {
       });
       rows.value = list;
       rowsData.value = list;
-      console.log(rows.value);
 
       filters.value = list;
     })

src/modules/06_retirement/views/05_deceased.vue

@@ -23,6 +23,7 @@ const {
   date2Thai,
   findOrgName,
   onSearchDataTable,
+  findOrgNameHtml,
 } = mixin;
 
 /** คอลัมน์ */
@@ -62,7 +63,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "profileType",
     align: "left",
-    label: "สถานภาพ",
+    label: "ประเภทตำแหน่ง",
     sortable: true,
     field: "profileType",
     headerStyle: "font-size: 14px",
@@ -89,7 +90,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "positionType",
     align: "left",
-    label: "ประเภทตำแหน่ง",
+    label: "ตำแหน่งประเภท",
     sortable: true,
     field: "positionType",
     headerStyle: "font-size: 14px",
@@ -155,7 +156,6 @@ async function fectListDecased() {
     .get(config.API.listDeceased())
     .then((res) => {
       const data = res.data.result;
-      console.log(data);
 
       rows.value = data;
       rowsData.value = data;
@@ -214,7 +214,7 @@ onMounted(() => {
               map-options
               option-value="id"
               option-label="name"
-              label="สถานภาพ"
+              label="ประเภทตำแหน่ง"
               :clearable="employeeClass !== ''"
               style="width: 200px"
               @clear="employeeClass = ''"
@@ -294,10 +294,10 @@ onMounted(() => {
                     {{ props.rowIndex + 1 }}
                   </div>
 
-                  <div
+                  <div v-else-if="col.name == 'org'" class="text-html">
-                    v-else
+                    {{ props.row ? findOrgNameHtml(props.row) : "-" }}
-                    :class="col.name === 'org' ? 'table_ellipsis' : ''"
+                  </div>
-                  >
+                  <div v-else>
                     {{ col.value ? col.value : "-" }}
                   </div>
                 </q-td>

src/modules/06_retirement/views/06_dismissOrder.vue

@@ -29,6 +29,7 @@ const {
   success,
   onSearchDataTable,
   dialogRemove,
+  textTranForm,
 } = mixin;
 
 const modal = ref<boolean>(false);
@@ -79,7 +80,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "positionLevel",
     align: "left",
-    label: "ประเภทตำแหน่ง",
+    label: "ตำแหน่งประเภท",
     sortable: true,
     field: "positionLevel",
     headerStyle: "font-size: 14px",
@@ -104,6 +105,9 @@ const columns = ref<QTableProps["columns"]>([
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(val, row) {
+      return `${row.organizationPositionOld.replace(/\n/g, " ")}`;
+    },
   },
   {
     name: "createdAt",
@@ -370,15 +374,17 @@ onMounted(async () => {
                   <div v-if="col.name === 'no'">
                     {{ props.rowIndex + 1 }}
                   </div>
-
                   <div
-                    v-else
+                    v-else-if="col.name == 'organizationPositionOld'"
-                    :class="
+                    class="text-html"
-                      col.name === 'organizationPositionOld'
-                        ? 'table_ellipsis2'
-                        : ''
-                    "
                   >
+                    {{
+                      props.row.organizationPositionOld
+                        ? textTranForm(props.row.organizationPositionOld)
+                        : "-"
+                    }}
+                  </div>
+                  <div v-else>
                     {{ col.value ? col.value : "-" }}
                   </div>
                 </q-td>

src/modules/06_retirement/views/08_dismissOrderEmp.vue

@@ -29,6 +29,7 @@ const {
   success,
   onSearchDataTable,
   dialogRemove,
+  textTranForm,
 } = mixin;
 
 const modal = ref<boolean>(false);
@@ -104,6 +105,9 @@ const columns = ref<QTableProps["columns"]>([
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(val, row) {
+      return `${row.organizationPositionOld.replace(/\n/g, " ")}`;
+    },
   },
   {
     name: "createdAt",
@@ -160,7 +164,6 @@ async function getData() {
     .then((res) => {
       const data = res.data.result;
       rows.value = data;
-      console.log("🚀 ~ .then ~ data:", data)
       rowsData.value = data;
       filters.value = data;
       onSearch();
@@ -378,13 +381,16 @@ onMounted(async () => {
                   </div>
 
                   <div
-                    v-else
+                    v-else-if="col.name == 'organizationPositionOld'"
-                    :class="
+                    class="text-html"
-                      col.name === 'organizationPositionOld'
-                        ? 'table_ellipsis2'
-                        : ''
-                    "
                   >
+                    {{
+                      props.row.organizationPositionOld
+                        ? textTranForm(props.row.organizationPositionOld)
+                        : "-"
+                    }}
+                  </div>
+                  <div v-else>
                     {{ col.value ? col.value : "-" }}
                   </div>
                 </q-td>

src/stores/mixin.ts

@@ -1064,6 +1064,42 @@ export const useCounterMixin = defineStore("mixin", () => {
     }
   }
 
+  function findOrgChildName(obj: any) {
+    if (obj) {
+      let name =
+        obj.orgChild4Name != null && obj.orgChild3Name != null
+          ? obj.orgChild4Name + " "
+          : obj.orgChild4Name != null
+          ? obj.orgChild4Name
+          : "";
+
+      name +=
+        obj.orgChild3Name != null && obj.orgChild2Name != null
+          ? obj.orgChild3Name + " "
+          : obj.orgChild3Name !== null
+          ? obj.orgChild3Name
+          : "";
+
+      name +=
+        obj.orgChild2Name != null && obj.orgChild1Name != null
+          ? obj.orgChild2Name + " "
+          : obj.orgChild2Name != null
+          ? obj.orgChild2Name
+          : "";
+
+      name +=
+        obj.orgChild1Name != null && obj.orgRootName != null
+          ? obj.orgChild1Name + " "
+          : obj.orgChild1Name != null
+          ? obj.orgChild1Name
+          : "";
+      name += obj.orgRootName != null ? obj.orgRootName : "";
+      return name == "" ? "-" : name;
+    } else {
+      return "";
+    }
+  }
+
   function findPosMasterNo(obj: any) {
     if (obj) {
       let shortName =
@@ -1084,6 +1120,114 @@ export const useCounterMixin = defineStore("mixin", () => {
     }
   }
 
+  function findOrgNameHtml(obj: any) {
+    if (obj) {
+      let name =
+        obj.child4 != null && obj.child3 != null
+          ? obj.child4 + (obj.child3 ? "\n" : "")
+          : obj.child4 != null
+          ? obj.child4
+          : "";
+
+      name +=
+        obj.child3 != null && obj.child2 != null
+          ? obj.child3 + (obj.child2 ? "\n" : "")
+          : obj.child3 !== null
+          ? obj.child3
+          : "";
+
+      name +=
+        obj.child2 != null && obj.child1 != null
+          ? obj.child2 + (obj.child1 ? "\n" : "")
+          : obj.child2 != null
+          ? obj.child2
+          : "";
+
+      name +=
+        obj.child1 != null && obj.root != null
+          ? obj.child1 + (obj.root ? "\n" : "")
+          : obj.child1 != null
+          ? obj.child1
+          : "";
+      name += obj.root != null ? obj.root : "";
+      return name == "" ? "-" : name;
+    } else {
+      return "";
+    }
+  }
+
+  function findOrgNameOldHtml(obj: any) {
+    if (obj) {
+      let name =
+        obj.child4Old != null && obj.child3Old != null
+          ? obj.child4Old + (obj.child3Old ? "\n" : "")
+          : obj.child4Old != null
+          ? obj.child4Old
+          : "";
+
+      name +=
+        obj.child3Old != null && obj.child2Old != null
+          ? obj.child3Old + (obj.child2Old ? "\n" : "")
+          : obj.child3Old !== null
+          ? obj.child3Old
+          : "";
+
+      name +=
+        obj.child2Old != null && obj.child1Old != null
+          ? obj.child2Old + (obj.child1Old ? "\n" : "")
+          : obj.child2Old != null
+          ? obj.child2Old
+          : "";
+
+      name +=
+        obj.child1Old != null && obj.rootOld != null
+          ? obj.child1Old + (obj.rootOld ? "\n" : "")
+          : obj.child1Old != null
+          ? obj.child1Old
+          : "";
+      name += obj.rootOld != null ? obj.rootOld : "";
+      return name == "" ? "-" : name;
+    } else {
+      return "";
+    }
+  }
+
+  function findOrgChildNameHtml(obj: any) {
+    if (obj) {
+      let name =
+        obj.orgChild4Name != null && obj.orgChild3Name != null
+          ? obj.orgChild4Name + (obj.orgChild3Name ? "\n" : "")
+          : obj.orgChild4Name != null
+          ? obj.orgChild4Name
+          : "";
+
+      name +=
+        obj.orgChild3Name != null && obj.orgChild2Name != null
+          ? obj.orgChild3Name + (obj.orgChild2Name ? "\n" : "")
+          : obj.orgChild3Name !== null
+          ? obj.orgChild3Name
+          : "";
+
+      name +=
+        obj.orgChild2Name != null && obj.orgChild1Name != null
+          ? obj.orgChild2Name + (obj.orgChild1Name ? "\n" : "")
+          : obj.orgChild2Name != null
+          ? obj.orgChild2Name
+          : "";
+
+      name +=
+        obj.orgChild1Name != null && obj.orgRootName != null
+          ? obj.orgChild1Name + (obj.orgRootName ? "\n" : "")
+          : obj.orgChild1Name != null
+          ? obj.orgChild1Name
+          : "";
+      name += obj.orgRootName != null ? obj.orgRootName : "";
+      return name == "" ? "-" : name;
+    } else {
+      return "";
+    }
+  }
+
   function findPosMasterNoOld(obj: any) {
     if (obj) {
       let shortName =
@@ -1104,6 +1248,11 @@ export const useCounterMixin = defineStore("mixin", () => {
     }
   }
 
+  function textTranForm(val: string) {
+    return (val.match(/[^()\s]+(?:\s*\([^()]+\))?|\([^()]+\)/g) || []).join(
+      "\n"
+    );
+  }
   function pathRegistryEmp(routeName: string) {
     return routeName
       ? routeName === "registryNewByid"
@@ -1232,6 +1381,7 @@ export const useCounterMixin = defineStore("mixin", () => {
     diffDay,
     findOrgName,
     findOrgNameOld,
+    findOrgChildName,
     findPosMasterNo,
     findPosMasterNoOld,
     pathRegistryEmp,
@@ -1243,5 +1393,9 @@ export const useCounterMixin = defineStore("mixin", () => {
 
     convertDateToAPI,
     convertDatetimeToAPI,
+    findOrgNameHtml,
+    findOrgNameOldHtml,
+    findOrgChildNameHtml,
+    textTranForm
   };
 });

src/style/quasar-variables.sass

@@ -48,7 +48,8 @@ $activetab: #4a5568
 .bg-activetab
     background: $activetab !important
 
-
+.text-html
+    white-space: pre-line
 
 .inputgreen .q-field__prefix,
 .inputgreen .q-field__suffix,