style: 修改delivery样式

src/views/DestinationDelivery/src/DestinationDelivery.vue

@@ -141,7 +141,7 @@ const tableRef = ref()
             </template>
           </el-input>
         </div>
-        <el-button class="el-button--dark" @click="Search">Search</el-button>
+        <el-button class="el-button--dark">Search</el-button>
       </div>
       <div class="number-cards">
         <div

src/views/DestinationDelivery/src/components/DeliveryDate.vue

@@ -131,7 +131,7 @@ const isTwoDate = (date: any) => {
     <a-range-picker
       separator="To"
       :showToday="false"
-      dropdownClassName="delivery-date-range-picker"
+      popupClassName="delivery-date-range-picker"
       :style="{
         backgroundColor: props.isType ? 'var(--more-type-bg-color)' : 'var(--management-bg-color)'
       }"

src/views/DestinationDelivery/src/components/ModifyBooking/src/ModifyBooking.vue

@@ -1,5 +1,8 @@
 <script lang="ts" setup>
 import SelectShipmentsTable from './components/SelectShipmentsTable.vue'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
 
 const selectVModel = ref('')
 const optionOptions = ref([
@@ -10,13 +13,20 @@ const optionOptions = ref([
 
 const inputVModel = ref('')
 const radioVModel = ref(1)
+const deliveryDate = ref('')
+
+const handleCancel = () => {
+  // Logic to handle cancel action
+  router.push({ name: 'Destination Delivery' })
+  console.log('Cancel button clicked')
+}
 </script>
 <template>
   <div class="modify-booking">
     <div class="header">
       <span>Modify Booking</span>
       <div class="operator">
-        <el-button style="height: 40px; width: 115px" type="default">
+        <el-button @click="handleCancel" style="height: 40px; width: 115px" type="default">
           <span style="margin-right: 4px" class="font_family icon-icon_return_b"></span>
           <span style="font-weight: 400">Cancel</span></el-button
         >
@@ -74,7 +84,7 @@ const radioVModel = ref(1)
           </div>
           <div class="filetr-item mode-type">
             <div class="label">*Mode Type</div>
-            <el-select v-model="selectVModel" placeholder="Please Select Type">
+            <el-select v-model="selectVModel" clearable placeholder="Please Select Type">
               <el-option
                 v-for="item in optionOptions"
                 :key="item.key"
@@ -85,14 +95,8 @@ const radioVModel = ref(1)
           </div>
           <div class="filetr-item mode-type">
             <div class="label">*Preferred Delivery Date</div>
-            <el-select v-model="selectVModel" placeholder="Please Select Date">
-              <el-option
-                v-for="item in optionOptions"
-                :key="item.key"
-                :value="item.value"
-                :label="item.label"
-              ></el-option>
-            </el-select>
+
+            <el-date-picker v-model="deliveryDate" type="date" placeholder="Pick a day" />
           </div>
           <div class="special-requirements">
             <div class="label">Special Requirements</div>

src/views/DestinationDelivery/src/components/ModifyBooking/src/components/SelectShipmentsTable.vue

@@ -81,15 +81,7 @@ const getTableColumns = async () => {
         ...handleColumns(res.data.OperationTableColumns),
         {}
       ]
-      const index = tableData.value.columns.findIndex((item: any) => item.title === 'Action')
-      if (index !== -1) {
-        tableData.value.columns.push({
-          title: 'Action',
-          fixed: 'right',
-          width: 120,
-          slots: { default: 'action' }
-        })
-      }
+
       tableOriginColumnsField.value = res.data.OperationTableColumns
 
       tableLoadingColumn.value = false
@@ -100,18 +92,6 @@ let searchdata: any = {}
 // 获得表格数据后赋值
 const assignTableData = (data: any) => {
   tableData.value.data = data.searchData || []
-
-  if (tableData.value.columns.length > 0) {
-    const index = tableData.value.columns.findIndex((item: any) => item.title === 'Action')
-    if (index === -1) {
-      tableData.value.columns.push({
-        title: 'Action',
-        fixed: 'right',
-        width: 120,
-        slots: { default: 'action' }
-      })
-    }
-  }
 }
 
 // 获取表格数据