feat: 联调vgm默认配置接口

src/api/module/tracking.ts

@@ -78,6 +78,36 @@ export const getTrackingAmsIsf = (params: any, config: any) => {
   )
 }
 
+/**
+ * 获取 vgm 的默认配置
+ */
+export const getVGMDefaultSet = (params: any, config: any) => {
+  return HttpAxios.get(
+    `${baseUrl}`,
+    {
+      action: 'ocean_order',
+      operate: 'default_vgm',
+      ...params
+    },
+    config
+  )
+}
+
+/**
+ * 保存 vgm 的默认配置
+ */
+export const saveVGMDefaultSet = (params: any, config: any) => {
+  return HttpAxios.post(
+    `${baseUrl}`,
+    {
+      action: 'ocean_order',
+      operate: 'default_vgm_update',
+      ...params
+    },
+    config
+  )
+}
+
 /**
  * 获取add vgm页面数据
  */

src/views/Tracking/src/components/TrackingTable/src/components/DefaultSettingDialog.vue

@@ -1,39 +1,49 @@
 <script setup lang="ts">
+import { cloneDeep } from 'lodash'
+
 const openDialog = () => {
   dialogVisible.value = true
 }
 
-const dialogVisible = ref(true)
+const dialogVisible = ref(false)
 const formData = ref({
-  Submitter: '',
+  submitter: '',
   signature: '',
   authorized_email: '',
   authorized_tel: ''
 })
 
-const isVerificationError = ref({
-  submitter: false,
-  signature: false,
-  authorized_email: false,
-  authorized_tel: false
-})
-
-const verificationData = () => {
-  const checkField = (field, errorKey) => {
-    const fieldValue = formData.value[field]
-    isVerificationError.value[errorKey] =
-      fieldValue === null || fieldValue === undefined || fieldValue === ''
-  }
-
-  checkField('Submitter', 'submitter')
-  checkField('signature', 'signature')
-  checkField('authorized_email', 'authorized_email')
-  checkField('authorized_tel', 'authorized_tel')
+const defaultSetting = ref()
+const getDefaultSettings = () => {
+  $api
+    .getVGMDefaultSet()
+    .then((res) => {
+      formData.value = res.data.vgm
+      defaultSetting.value = cloneDeep(res.data.vgm)
+    })
+    .catch(() => {})
 }
+getDefaultSettings()
 
 const handleSave = () => {
-  // Logic to save the settings
-  dialogVisible.value = false
+  $api
+    .saveVGMDefaultSet(formData.value)
+    .then(() => {
+      defaultSetting.value = cloneDeep(formData.value)
+      ElMessage.success('Settings saved successfully')
+    })
+    .catch(() => {})
+}
+
+const emit = defineEmits(['close'])
+const clearData = () => {
+  formData.value = cloneDeep(defaultSetting.value) || {
+    submitter: '',
+    signature: '',
+    authorized_email: '',
+    authorized_tel: ''
+  }
+  emit('close', cloneDeep(defaultSetting.value))
 }
 
 defineExpose({
@@ -42,88 +52,67 @@ defineExpose({
 </script>
 
 <template>
-  <div>
-    <el-dialog
-      v-model="dialogVisible"
-      title="Default Settings"
-      width="50%"
-      :close-on-click-modal="false"
-      :close-on-press-escape="false"
-    >
-      <div class="form">
-        <div class="form-row">
-          <div class="form-item">
-            <div class="label">
-              Submitter
-              <span class="require-asterisk">*</span>
-            </div>
-            <div class="content">
-              <el-input
-                :class="{ 'is-error': isVerificationError.submitter }"
-                v-model="formData.Submitter"
-                placeholder="Please enter..."
-                clearable
-                @blur="verificationData"
-              ></el-input>
-            </div>
+  <el-dialog
+    v-model="dialogVisible"
+    title="Default Settings"
+    width="50%"
+    @closed="clearData"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
+    <div class="form">
+      <div class="form-row">
+        <div class="form-item">
+          <div class="label">Submitter</div>
+          <div class="content">
+            <el-input
+              v-model="formData.submitter"
+              placeholder="Please enter..."
+              clearable
+            ></el-input>
           </div>
-          <div class="form-item">
-            <div class="label">
-              Signature
-              <span class="require-asterisk">*</span>
-            </div>
-            <div class="content">
-              <el-input
-                :class="{ 'is-error': isVerificationError.signature }"
-                v-model="formData.signature"
-                placeholder="Please enter..."
-                clearable
-                @blur="verificationData"
-              ></el-input>
-            </div>
+        </div>
+        <div class="form-item">
+          <div class="label">Signature</div>
+          <div class="content">
+            <el-input
+              v-model="formData.signature"
+              placeholder="Please enter..."
+              clearable
+            ></el-input>
           </div>
         </div>
-        <div class="form-row">
-          <div class="form-item">
-            <div class="label">
-              Authorized Email
-              <span class="require-asterisk">*</span>
-            </div>
-            <div class="content">
-              <el-input
-                :class="{ 'is-error': isVerificationError.authorized_email }"
-                v-model="formData.authorized_email"
-                placeholder="Please enter..."
-                clearable
-                @blur="verificationData"
-              ></el-input>
-            </div>
+      </div>
+      <div class="form-row">
+        <div class="form-item">
+          <div class="label">Authorized Email</div>
+          <div class="content">
+            <el-input
+              v-model="formData.authorized_email"
+              placeholder="Please enter..."
+              clearable
+            ></el-input>
           </div>
-          <div class="form-item">
-            <div class="label">
-              Authorized Tel
-              <span class="require-asterisk">*</span>
-            </div>
-            <div class="content">
-              <el-input
-                :class="{ 'is-error': isVerificationError.authorized_tel }"
-                v-model="formData.authorized_tel"
-                placeholder="Please enter..."
-                clearable
-                @blur="verificationData"
-              ></el-input>
-            </div>
+        </div>
+        <div class="form-item">
+          <div class="label">Authorized Tel</div>
+          <div class="content">
+            <el-input
+              v-model="formData.authorized_tel"
+              placeholder="Please enter..."
+              clearable
+            ></el-input>
           </div>
         </div>
       </div>
-      <template #footer>
-        <el-button class="el-button--default" style="height: 40px" @click="dialogVisible = false"
-          >Cancel</el-button
-        >
-        <el-button @click="handleSave" class="el-button--dark" style="height: 40px">Save</el-button>
-      </template>
-    </el-dialog>
-  </div>
+    </div>
+    <template #footer>
+      <el-button style="width: 81px" class="el-button--default" @click="dialogVisible = false"
+        >Cancel</el-button
+      >
+      <el-button @click="handleSave" class="el-button--dark" style="width: 86px">Save</el-button>
+    </template>
+  </el-dialog>
 </template>
 
 <style lang="scss" scoped>
@@ -143,13 +132,6 @@ defineExpose({
         font-size: 12px;
         line-height: 16px;
         color: var(--dashboard-text-color);
-
-        .require-asterisk {
-          margin-left: 2px;
-          font-size: 16px;
-          line-height: 16px;
-          color: #c9353f;
-        }
       }
       .content {
         display: flex;
@@ -158,11 +140,6 @@ defineExpose({
         .el-input {
           width: 100%;
         }
-        .is-error {
-          :deep(.el-input__wrapper) {
-            box-shadow: 0 0 0 1px red;
-          }
-        }
       }
     }
   }

src/views/Tracking/src/components/TrackingTable/src/components/VGMView.vue

@@ -47,7 +47,7 @@ const generalInfo = ref({
     }
   ],
   formData: {
-    Submitter: '',
+    submitter: '',
     signature: '',
     authorized_email: '',
     authorized_tel: '',
@@ -198,7 +198,7 @@ const convertData = (data: any) => {
       }
     ],
     formData: {
-      Submitter: data.Submitter,
+      submitter: data.submitter,
       signature: data.signature,
       authorized_email: data.authorized_email,
       authorized_tel: data.authorized_tel,
@@ -268,7 +268,7 @@ const verificationData = () => {
       fieldValue === null || fieldValue === undefined || fieldValue === ''
   }
 
-  checkField('Submitter', 'submitter')
+  checkField('submitter', 'submitter')
   checkField('signature', 'signature')
   checkField('authorized_email', 'authorized_email')
   checkField('authorized_tel', 'authorized_tel')
@@ -300,7 +300,7 @@ const handleSave = () => {
 
   const generalData = {
     all_carrier_booking: generalInfo.value.baseInfo['Carrier Booking No.'],
-    submitter: generalInfo.value.formData.Submitter,
+    submitter: generalInfo.value.formData.submitter,
     signature: generalInfo.value.formData.signature,
     authorized_email: generalInfo.value.formData.authorized_email,
     authorized_tel: generalInfo.value.formData.authorized_tel,
@@ -372,6 +372,17 @@ const openDefaultSettingDialog = () => {
     defaultSettingDialogRef.value.openDialog()
   }
 }
+const handleDefaultSetting = (data: any) => {
+  // debugger
+  // generalInfo.value.formData = data
+  const formData = generalInfo.value.formData
+  for (const key in formData) {
+    if (!formData[key] && data[key]) {
+      formData[key] = data[key]
+      isVerificationError.value[key] = false
+    }
+  }
+}
 </script>
 
 <template>
@@ -413,7 +424,7 @@ const openDefaultSettingDialog = () => {
               <div class="content">
                 <el-input
                   :class="{ 'is-error': isVerificationError.submitter }"
-                  v-model="generalInfo.formData.Submitter"
+                  v-model="generalInfo.formData.submitter"
                   placeholder="Please enter..."
                   clearable
                   @blur="verificationData"
@@ -535,7 +546,10 @@ const openDefaultSettingDialog = () => {
         </div>
       </div>
     </div>
-    <DefaultSettingDialog ref="defaultSettingDialogRef"></DefaultSettingDialog>
+    <DefaultSettingDialog
+      @close="handleDefaultSetting"
+      ref="defaultSettingDialogRef"
+    ></DefaultSettingDialog>
   </div>
 </template>