ui command tab 2/3/5

src/modules/18_command/components/Step/1_Detail.vue

@@ -29,10 +29,7 @@ const props = defineProps({
 
 const commandId = ref<string>(route.params.id.toString()); //ID คำสั่ง
 // ฟอร์มข้อมูล
-const formData = reactive<FormDataDetail>({
-  id: "",
-  status: "",
-  commandTypeName: "",
+let formData = reactive<FormDataDetail>({
   commandNo: "",
   commandYear: null,
   detailHeader: "",
@@ -41,7 +38,6 @@ const formData = reactive<FormDataDetail>({
   issue: null,
   commandAffectDate: null, //วันที่ลงนาม
   commandExcecuteDate: null, //วันที่คำสั่งมีผล
-  commandSysId: "", // ประเภท คำสั่ง
 });
 const modalPreview = ref<boolean>(false); //แสดงตัวอย่าง
 
@@ -69,14 +65,16 @@ async function onSubmit() {
 /**
  * ทำงานเมื่อ Components ถูกเรียกใช้งาน
  */
-watch(
-  () => props.formCommandList,
-  () => {
-    const list = props.formCommandList;
-    console.log("🚀 ~ props.formCommandList:", props.formCommandList)
-    console.log("🚀 ~ onMounted ~ list:", list);
-  }
-);
+onMounted(() => {
+  formData.commandNo = props.formCommandList.commandNo;
+  formData.commandYear = props.formCommandList.commandYear;
+  formData.detailHeader = props.formCommandList.detailHeader;
+  formData.detailBody = props.formCommandList.detailBody;
+  formData.detailFooter = props.formCommandList.detailFooter;
+  formData.issue = props.formCommandList.issue;
+  formData.commandAffectDate = props.formCommandList.commandAffectDate;
+  formData.commandExcecuteDate = props.formCommandList.commandExcecuteDate;
+});
 
 /**
  * ฟังก์ชันที่ต้องการนำฟังก์ชันออกไปใช้ใน Components แม่
@@ -90,7 +88,6 @@ defineExpose({
   <q-card-section>
     <div class="row q-col-gutter-sm">
       <!-- คำสั่งเลขที่ -->
-       {{ props.formCommandList }}
       <div class="col-4 row">
         <div class="col-6">
           <q-input