ออกคำสั่ง ==> fix Columns

src/modules/18_command/components/Step/2_ListPersons.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, reactive } from "vue";
+import { ref, onMounted, reactive, computed } from "vue";
 import { useQuasar, type QTableProps } from "quasar";
 
 import http from "@/plugins/http";
@@ -36,6 +36,7 @@ const props = defineProps({
   onCheckChangeData: { type: Function, required: true },
   fetchDataCommandList: { type: Function, required: true },
   commandSysId: { type: String, required: true },
+  commandCode: { type: String, required: true },
   formCommandList: { type: Object, required: true },
 });
 
@@ -64,7 +65,7 @@ const filter = ref<string>("");
 const rows = ref<PersonInfo[]>([]);
 const rowsMain = ref<PersonInfo[]>([]);
 
-const columns = ref<QTableProps["columns"]>([
+const baseColumns = ref<QTableProps["columns"]>([
   {
     name: "no",
     align: "left",
@@ -130,8 +131,22 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-
 ]);
+
+const columns = computed<QTableProps["columns"]>(() => {
+  if (
+    props.commandCode === "C-PM-01" ||
+    props.commandCode === "C-PM-02" ||
+    props.commandCode === "C-PM-03" ||
+    props.commandCode === "C-PM-04"
+  ) {
+    return baseColumns.value;
+  } else {
+    return baseColumns.value?.filter(
+      (e) => e.name !== "position" && e.name !== "positionType"
+    );
+  }
+});
 const visibleColumns = ref<String[]>([
   "no",
   "citizenId",
@@ -287,6 +302,7 @@ function onSearchData() {
 
 onMounted(async () => {
   const promises = [getPersonList()];
+  console.log(props.commandCode);
 
   if (props.commandSysId) {
     promises.push(getCommandSalaryList(props.commandSysId));

src/modules/18_command/views/detail.vue

@@ -22,6 +22,7 @@ const { showLoader, hideLoader, messageError } = useCounterMixin();
 const router = useRouter();
 const route = useRoute();
 const commandId = ref<string>(route.params.id.toString()); //ID คำสั่ง
+const commandCode = ref<string>("");
 const store = useCommandDetail();
 
 const tabs = ref<string>("Main"); //Tab
@@ -41,7 +42,7 @@ const tabsManu = ref<ItemTabs[]>([
   { label: "พรีวิวคำสั่ง", name: "Attached" },
 ]);
 
-const statusCheck = ref<boolean>(false)
+const statusCheck = ref<boolean>(false);
 let formCommandList = reactive<FormCommandList>({
   id: "",
   status: "",
@@ -60,7 +61,6 @@ let formCommandList = reactive<FormCommandList>({
 
 /**
  * ฟังก์ชันเช็คการเปลี่นรแปลงของข้อมูล
- *
  * ถ้ามีการเปลี่นยแปลง กำหนด  'isChangeData' เป็น true
  */
 function onCheckChangeData() {
@@ -69,7 +69,6 @@ function onCheckChangeData() {
 
 /**
  * ฟังก์ชันดึงข้อมูลรายละเอียดคำสั่ง
- *
  * กำหนดข้อมูลที่ได้รับมาให้กับตัวแปร `formData`
  */
 async function fetchDataCommandList() {
@@ -78,10 +77,12 @@ async function fetchDataCommandList() {
     .get(config.API.commandAction(commandId.value, "tab1"))
     .then(async (res) => {
       const data = await res.data.result;
+
       formCommandList = data;
-      statusCheck.value = data.commandCode == 'C-PM-10'? true:false;
+      statusCheck.value = data.commandCode == "C-PM-10" ? true : false;
       store.dataCommand = data;
       isChangeData.value = false; //จำลอง
+      commandCode.value = data.commandCode;
     })
     .catch((err) => {
       messageError($q, err);
@@ -159,13 +160,14 @@ onMounted(async () => {
             />
           </q-card>
         </q-tab-panel>
-        <q-tab-panel class="bg-grey-2" style="padding: 0px" name="ListPersons" >
+        <q-tab-panel class="bg-grey-2" style="padding: 0px" name="ListPersons">
           <ListPersons
             v-model:is-change-data="isChangeData"
             :on-check-change-data="onCheckChangeData"
             :fetch-data-command-list="fetchDataCommandList"
             :command-sys-id="formCommandList?.commandSysId as string"
             :form-command-list="formCommandList"
+            :command-code="commandCode"
           />
         </q-tab-panel>