feat:修改code以及数据回显

src/components/AddRules/src/AddRules.vue

@@ -27,8 +27,11 @@ let savesubscribeobj: any = {}
 const SystemList = ref(props.SystemList)
 const RulesActive = ref(['SelectMilestone', 'NotificationFrequency', 'NotificationMethod'])
 const OceanCheckList = ref()
+const OceanCheckCode = ref()
 const AirCheckList = ref()
+const AirCheckListCode = ref()
 const ContainerOceanList = ref()
+const ContainerOceanCode = ref()
 const IsFirstActive = ref(true)
 const IsTwoActive = ref(true)
 const IsThreeActive = ref(true)
@@ -71,14 +74,35 @@ watch(
 // 初始赋值
 const Initdata = (val: any) => {
   MilestoneOceanListInit.value = val.Milestone_Update.OceanCheckBoxList
+  OceanCheckList.value = []
   MilestoneOceanListChecked.value = val.Milestone_Update.OceanCheckedList
-  OceanCheckList.value = val.Milestone_Update.OceanCheckedList
+  // 遍历选中的value值，找到对应的label值
+  MilestoneOceanListChecked.value.forEach((value) => {
+    const option = MilestoneOceanListInit.value.find((item) => item.value === value)
+    if (option) {
+      OceanCheckList.value.push(option.label)
+    }
+  })
   MilestoneAirListInit.value = val.Milestone_Update.AirCheckBoxList
   MilestoneAirListChecked.value = val.Milestone_Update.AirCheckedList
-  AirCheckList.value = val.Milestone_Update.AirCheckedList
+  AirCheckList.value = []
+  // 遍历选中的value值，找到对应的label值
+  MilestoneAirListChecked.value.forEach((value) => {
+    const option = MilestoneAirListInit.value.find((item) => item.value === value)
+    if (option) {
+      AirCheckList.value.push(option.label)
+    }
+  })
   ContainerOceanListInit.value = val.Container_Status_Update.CtnrCheckBoxList
   ContainerOceanListChecked.value = val.Container_Status_Update.CtnrCheckedList
-  ContainerOceanList.value = val.Container_Status_Update.CtnrCheckedList
+  ContainerOceanList.value = []
+  // 遍历选中的value值，找到对应的label值
+  ContainerOceanListChecked.value.forEach((value) => {
+    const option = ContainerOceanListInit.value.find((item) => item.value === value)
+    if (option) {
+      ContainerOceanList.value.push(option.label)
+    }
+  })
   let OceanObj: any = {}
   OceanObj.atd_etd = val['Departure/Arrival_Delay'].ocean_atd_sub_etd
   OceanObj.atd_etd_unit = val['Departure/Arrival_Delay'].ocean_atd_sub_etd_unit
@@ -110,11 +134,13 @@ const Initdata = (val: any) => {
 }
 
 // 给tag list赋值
-const ChangeCheckOceanRules = (val: any) => {
+const ChangeCheckOceanRules = (val: any, value: any) => {
   OceanCheckList.value = val
+  OceanCheckCode.value = value
 }
-const ChangeContainerRules = (val: any) => {
+const ChangeContainerRules = (val: any, value: any) => {
   ContainerOceanList.value = val
+  ContainerOceanCode.value = value
 }
 // delayed赋值
 const ChangeDeayedRules = (val: any) => {
@@ -155,8 +181,9 @@ const ChangeAirRules = (val: any) => {
     delete savesubscribeobj.air_ata_sub_eta_unit
   }
 }
-const ChangeCheckAirRules = (val: any) => {
+const ChangeCheckAirRules = (val: any, value: any) => {
   AirCheckList.value = val
+  AirCheckListCode.value = value
 }
 
 // 更改Frequency时间
@@ -354,8 +381,8 @@ const Savesubscribe = () => {
       missingmessage.value = missingmessage.value.substring(0, missingmessage.value.length - 2)
       UnableSaveVisible.value = true
     } else {
-      savesubscribeobj.ocean_milestone = OceanCheckList.value
-      savesubscribeobj.air_milestone = AirCheckList.value
+      savesubscribeobj.ocean_milestone = OceanCheckCode.value
+      savesubscribeobj.air_milestone = AirCheckListCode.value
       str =
         'Ocean Milestones: ' +
         OceanCheckList.value.join(',') +

src/components/AddRules/src/components/RulesShipments.vue

@@ -29,9 +29,17 @@ watch(
 )
 
 const emit = defineEmits(['ChangeCheckRules'])
-const CheckChange = () => {
-  console.log(CheckedList.value)
-  emit('ChangeCheckRules', CheckedList.value)
+const selectedLables = ref([])
+const CheckChange = (val: any) => {
+  selectedLables.value = []
+  // 遍历选中的value值，找到对应的label值
+  val.forEach((value) => {
+    const option = CheckboxList.value.find((item) => item.value === value)
+    if (option) {
+      selectedLables.value.push(option.label)
+    }
+  })
+  emit('ChangeCheckRules', selectedLables.value, CheckedList.value)
 }
 </script>
 <template>
@@ -48,7 +56,9 @@ const CheckChange = () => {
               :key="item.label"
               :label="item.label"
               :value="item.value"
-            />
+            >
+              {{ item.label }}
+            </el-checkbox>
           </el-checkbox-group>
         </div>
       </el-collapse-item>

src/components/CreateAddRules/src/CreateAddRules.vue

@@ -34,8 +34,11 @@ const RulesActive = ref([
   'NotificationMethod'
 ])
 const OceanCheckList = ref()
+const OceanCheckListCode = ref()
 const AirCheckList = ref()
+const AirCheckListCode = ref()
 const ContainerOceanList = ref()
+const ContainerOceanCode = ref()
 const IsFirstActive = ref(true)
 const IsTwoActive = ref(true)
 const IsThreeActive = ref(true)
@@ -99,15 +102,36 @@ const Initdata = () => {
             ShipmentRangeMil.value = res.data.Milestone_Update
             MilestoneOceanListInit.value = res.data.Milestone_Update.OceanCheckBoxList
             MilestoneOceanListChecked.value = res.data.Milestone_Update.OceanCheckedList
-            OceanCheckList.value = res.data.Milestone_Update.OceanCheckedList
+            OceanCheckList.value = []
+            // 遍历选中的value值，找到对应的label值
+            MilestoneOceanListChecked.value.forEach((value) => {
+              const option = MilestoneOceanListInit.value.find((item) => item.value === value)
+              if (option) {
+                OceanCheckList.value.push(option.label)
+              }
+            })
             MilestoneAirListInit.value = res.data.Milestone_Update.AirCheckBoxList
             MilestoneAirListChecked.value = res.data.Milestone_Update.AirCheckedList
-            AirCheckList.value = res.data.Milestone_Update.AirCheckedList
+            AirCheckList.value = []
+            // 遍历选中的value值，找到对应的label值
+            MilestoneAirListChecked.value.forEach((value) => {
+              const option = MilestoneAirListInit.value.find((item) => item.value === value)
+              if (option) {
+                AirCheckList.value.push(option.label)
+              }
+            })
             createListMilestone.value = res.data.Milestone_Update.shipment_details
           } else if (editTablerules_type == 'Container_Status_Update') {
             ContainerOceanListInit.value = res.data.Container_Status_Update.CtnrCheckBoxList
             ContainerOceanListChecked.value = res.data.Container_Status_Update.CtnrCheckedList
-            ContainerOceanList.value = res.data.Container_Status_Update.CtnrCheckedList
+            ContainerOceanList.value = []
+            // 遍历选中的value值，找到对应的label值
+            ContainerOceanListChecked.value.forEach((value) => {
+              const option = ContainerOceanListInit.value.find((item) => item.value === value)
+              if (option) {
+                ContainerOceanList.value.push(option.label)
+              }
+            })
             FrequencyDataCon.value = res.data.Container_Status_Update
             MethodsDataCon.value = res.data.Container_Status_Update
             ShipmentRangeCon.value = res.data.Container_Status_Update
@@ -158,11 +182,13 @@ const Initdata = () => {
 }
 
 // 给tag list赋值
-const ChangeCheckOceanRules = (val: any) => {
+const ChangeCheckOceanRules = (val: any, value: any) => {
   OceanCheckList.value = val
+  OceanCheckListCode.value = value
 }
-const ChangeContainerRules = (val: any) => {
+const ChangeContainerRules = (val: any, value: any) => {
   ContainerOceanList.value = val
+  ContainerOceanCode.value = value
 }
 // delayed赋值
 const ChangeDeayedRules = (val: any) => {
@@ -203,8 +229,9 @@ const ChangeAirRules = (val: any) => {
     delete savesubscribeobj.air_ata_sub_eta_unit
   }
 }
-const ChangeCheckAirRules = (val: any) => {
+const ChangeCheckAirRules = (val: any, value: any) => {
   AirCheckList.value = val
+  AirCheckListCode.value = value
 }
 
 //选择create new rules
@@ -531,7 +558,6 @@ const Savesubscribe = () => {
       createObj.Transportstr == '' ||
       createObj.Timestr == ''
     ) {
-      console.log(createObj)
       if (createObj.Transportstr == '') {
         missingmessage.value += 'Transport Mode, '
       }
@@ -553,8 +579,8 @@ const Savesubscribe = () => {
       missingmessage.value = missingmessage.value.substring(0, missingmessage.value.length - 2)
       UnableSaveVisible.value = true
     } else {
-      savesubscribeobj.ocean_milestone = OceanCheckList.value
-      savesubscribeobj.air_milestone = AirCheckList.value
+      savesubscribeobj.ocean_milestone = OceanCheckListCode.value
+      savesubscribeobj.air_milestone = AirCheckListCode.value
       str =
         'Ocean Milestones: ' +
         OceanCheckList.value.join(',') +

src/components/CreateAddRules/src/components/RulesShipments.vue

@@ -29,9 +29,17 @@ watch(
 )
 
 const emit = defineEmits(['ChangeCheckRules'])
-const CheckChange = () => {
-  console.log(CheckedList.value)
-  emit('ChangeCheckRules', CheckedList.value)
+const selectedLables = ref([])
+const CheckChange = (val: any) => {
+  selectedLables.value = []
+  // 遍历选中的value值，找到对应的label值
+  val.forEach((value) => {
+    const option = CheckboxList.value.find((item) => item.value === value)
+    if (option) {
+      selectedLables.value.push(option.label)
+    }
+  })
+  emit('ChangeCheckRules', selectedLables.value, CheckedList.value)
 }
 </script>
 <template>