feat: 完善多语言

src/components/AddRules/src/components/ShipmentRange.vue

@@ -34,9 +34,9 @@ const ETATime = ref()
 const clampedETDValue = computed({
   get: () => ETDTime.value,
   set: (newVal) => {
-    const isValid = /^[1-9]\d*$/.test(newVal);
-    ETDTime.value = isValid ? newVal : '';
-    if( ETDTime.value!='') {
+    const isValid = /^[1-9]\d*$/.test(newVal)
+    ETDTime.value = isValid ? newVal : ''
+    if (ETDTime.value != '') {
       ETDTime.value = Math.min(Math.max(parseInt(ETDTime.value, 10), 1), 365)
     }
   }
@@ -44,9 +44,9 @@ const clampedETDValue = computed({
 const clampedETAValue = computed({
   get: () => ETATime.value,
   set: (newVal) => {
-    const isValid = /^[1-9]\d*$/.test(newVal);
-    ETATime.value = isValid ? newVal : '';
-    if( ETATime.value!='') {
+    const isValid = /^[1-9]\d*$/.test(newVal)
+    ETATime.value = isValid ? newVal : ''
+    if (ETATime.value != '') {
       ETATime.value = Math.min(Math.max(parseInt(ETATime.value, 10), 1), 365)
     }
   }
@@ -67,15 +67,15 @@ const CheckChange = (val: any) => {
 // 输入ETD、ETA
 const changeTime = (val: any) => {
   if (val == 1) {
-    if(clampedETDValue.value != '' && clampedETDValue.value != undefined) {
-      Timestr = `ETD ${t('notificationRules.within')} ${clampedETDValue.value} ${t('notificationRules.days')}`
-    } else{
+    if (clampedETDValue.value != '' && clampedETDValue.value != undefined) {
+      Timestr = t(`notificationRules.etdTimeStr`, { days: clampedETDValue.value })
+    } else {
       Timestr = ''
     }
   } else if (val == 2) {
-    if(clampedETAValue.value != '' && clampedETAValue.value != undefined) {
-      Timestr = `ETA ${t('notificationRules.within')} ${clampedETAValue.value} ${t('notificationRules.days')}`
-    } else{
+    if (clampedETAValue.value != '' && clampedETAValue.value != undefined) {
+      Timestr = t(`notificationRules.etaTimeStr`, { days: clampedETDValue.value })
+    } else {
       Timestr = ''
     }
   } else {
@@ -124,26 +124,26 @@ defineExpose({
           <el-radio-group v-model="TimeChecked" @change="changeTime">
             <el-radio value="1">
               <div class="flex">
-                ETD {{ t('notificationRules.within') }}
+                ETD within
                 <el-input
                   @input="changeTime('1')"
                   v-model="clampedETDValue"
                   class="input-with-select"
                 >
                 </el-input>
-                <div class="Days">{{ t('notificationRules.days') }}</div>
+                <div class="Days">Day(s)</div>
               </div>
             </el-radio>
             <el-radio value="2">
               <div class="flex">
-                ETA {{ t('notificationRules.within') }}
+                ETA within
                 <el-input
                   @input="changeTime('2')"
                   v-model="clampedETAValue"
                   class="input-with-select"
                 >
                 </el-input>
-                <div class="Days">{{ t('notificationRules.days') }}</div>
+                <div class="Days">Day(s)</div>
               </div>
             </el-radio>
           </el-radio-group>
@@ -206,7 +206,7 @@ defineExpose({
 :deep(.el-radio) {
   background-color: var(--color-drawer-body-bg);
 }
-:deep( .el-radio__inner) {
+:deep(.el-radio__inner) {
   border: 1px solid var(--color-system-checkbox-border);
 }
-</style>
+</style>

src/components/DateRange/src/DateRange.vue

@@ -76,7 +76,7 @@ const DateRangeSearch = () => {
       key: etaKey
     })
   } else {
-    filtersStore.deleteFilterByTitle('ETA')
+    filtersStore.deleteFilterByKey(etaKey)
   }
 
   if (hasValidDate(etdDateRange.value)) {
@@ -87,7 +87,7 @@ const DateRangeSearch = () => {
       key: etdKey
     })
   } else {
-    filtersStore.deleteFilterByTitle('ETD')
+    filtersStore.deleteFilterByKey(etdKey)
   }
 
   allOtherType.value.forEach((item) => {
@@ -100,7 +100,7 @@ const DateRangeSearch = () => {
         key: item.key
       })
     } else {
-      filtersStore.deleteFilterByTitle(item.title)
+      filtersStore.deleteFilterByKey(item.key)
     }
   })
   emit('DateRangeSearch')
@@ -112,10 +112,10 @@ const clearRest = () => {
   etdDateRange.value = []
   etaDateRange.value = []
   otherDateType.value = []
-  filtersStore.deleteFilterByTitle('ETA')
-  filtersStore.deleteFilterByTitle('ETD')
+  filtersStore.deleteFilterByKey(etaKey)
+  filtersStore.deleteFilterByKey(etdKey)
   allOtherType.value.forEach((item) => {
-    filtersStore.deleteFilterByTitle(item.title)
+    filtersStore.deleteFilterByKey(item.key)
   })
   emit('clearDaterangeTags')
 }
@@ -192,12 +192,20 @@ const closeRset = () => {
           </div>
         </div>
         <div class="MoreType" @click="addType" v-if="otherDateType.length != allOtherType.length">
-          <el-button class="el-button--noborder moretype">+ {{ t('common.moreDateType') }}</el-button>
+          <el-button class="el-button--noborder moretype"
+            >+ {{ t('common.moreDateType') }}</el-button
+          >
         </div>
         <div class="daterange_bottom">
-          <div><el-button type="default" @click="clearRest" class="Clear">{{ t('common.reset') }}</el-button></div>
           <div>
-            <el-button class="search el-button--dark" @click="DateRangeSearch">{{ t('common.search') }}</el-button>
+            <el-button type="default" @click="clearRest" class="Clear">{{
+              t('common.reset')
+            }}</el-button>
+          </div>
+          <div>
+            <el-button class="search el-button--dark" @click="DateRangeSearch">{{
+              t('common.search')
+            }}</el-button>
           </div>
         </div>
       </div>

src/components/FliterTags/src/FilterTags.vue

@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import { cloneDeep } from 'lodash'
-import { useI18n } from 'vue-i18n'
 
 interface ListItem {
   name: string
@@ -12,23 +11,8 @@ interface Props {
   tagsList: ListItem[]
 }
 const props = withDefaults(defineProps<Props>(), {})
-const { t } = useI18n()
 
 const emits = defineEmits(['tabChange'])
-const getTagLabel = (name: string) => {
-  const map = {
-    All: t('common.all'),
-    Created: t('common.created'),
-    Confirmed: t('common.confirmed'),
-    Cancelled: t('common.cancelled'),
-    Departed: t('common.departed'),
-    'Cargo Received': t('common.cargoReceived'),
-    Arrived: t('common.arrived'),
-    Completed: t('common.completed')
-  }
-  return map[name] || name
-}
-
 const getCheckedTabs = (tagsList: ListItem[]) => {
   const checkedList = tagsList.filter((item) => item.checked)
   return checkedList.map((item) => item.name)
@@ -88,7 +72,7 @@ const handleTagToggle = (index: any, checked: any) => {
         :class="[item.checked ? 'checked' : '']"
         @click="handleTagToggle(index, item.checked)"
       >
-        {{ getTagLabel(item.name) }}
+        {{ item.name }}
         <div
           :class="[
             'v-tag',

src/locales/en.json

@@ -73,6 +73,7 @@
     "logout": "Logout",
     "light": "Light",
     "dark": "Dark",
+    "submit": "Submit",
     "created": "Created",
     "confirmed": "Confirmed",
     "cancelled": "Cancelled",
@@ -123,7 +124,7 @@
     "pleaseSelectDateRange": "Please Select Date Range",
     "pleaseSelectService": "Please Select Service",
     "seeAll": "See All",
-    "action":"action",
+    "action":"Action",
     "partyType": "Party Type",
     "partyDetails": "Party Details",
     "pleaseSelectPartyType": "Please Select Party Type",
@@ -203,6 +204,15 @@
     "pleaseEnterEmailContent": "Please enter the email content",
     "emailSentSuccessfully": "Email sent successfully",
     "failedToSendEmail": "Failed to send email",
+
+    "hblNo": "HBL No.",
+    "carrierBookingNo": "Carrier Booking No.",
+    "vessel": "Vessel",
+    "voyage": "Voyage",
+    "lastUpdatedUser": "Last Updated User",
+    "lastUpdatedTime": "Last Updated Time",
+
+
     "textSearch": "text search",
     "created": "Created",
     "cargoReceived": "Cargo Received",
@@ -224,11 +234,14 @@
     "uploadFiles": "Upload Files",
     "upload": "Upload",
     "fileType": "File Type",
+
+    "All": "All",
     "Created": "Created",
     "Cargo Received": "Cargo Received",
     "Departed": "Departed",
     "Arrived": "Arrived",
     "Completed": "Completed",
+    
     "supportedFormats": "Supported formats: .pdf, .xlsx, .docx",
     "maximumSize": "Maximum Size: 5MB;",
     "maximumNumber": "Maximum Number: 5 files",
@@ -695,6 +708,8 @@
     "selectTimeZone": "Select Time Zone",
     "selectDay": "Select Day",
     "within": "within",
+    "etdTimeStr": "ETD within {count} Day(s)",
+    "etaTimeStr": "ETA within {count} Day(s)",
     "days": "Day(s)",
     "ocean": "Ocean",
     "air": "Air",
@@ -999,6 +1014,7 @@
     "marks": "Marks",
     "description": "Description",
     "packing": "Packing",
+    "All": "All",
     "Created": "Created",
     "Confirmed": "Confirmed",
     "Cancelled": "Cancelled",
@@ -1077,11 +1093,11 @@
     "truck": "Truck",
     "rail": "Rail",
     "totalBookings": "Total Bookings",
-    "pendingApproval": "Pending Approval",
-    "approved": "Approved",
-    "rejected": "Rejected",
-    "cancelled": "Cancelled",
     "bookingList": "Booking List",
+    "Pending Approval": "Pending Approval",
+    "Approved": "Approved",
+    "Rejected": "Rejected",
+    "Cancelled": "Cancelled",
     "selectDataOnOperationLogList": "Select data on your Operation Log list:",
     "operationLogTitle": "Operation Log",
     "shipmentInformation": "Shipment Information",
@@ -1200,8 +1216,6 @@
     "singleDimension": "Single Dimension",
     "deliveryDateTips": "No Specific recommended time for choosing delivery date",
     "recommendDeliveryDate": "Recommend Delivery Date (ETA/ATA)",
-    "etdAtdRuleWindow": "ETD/ATD: {before} days before to {after} days after",
-    "etaAtaRuleWindow": "ETA/ATA: {before} days before to {after} days after",
     "air": "Air",
     "sea": "Sea",
     "ctns": "ctns",

src/locales/zh-cn.json

@@ -630,17 +630,6 @@
     "satisfied": "Satisfied",
     "highlySatisfied": "Highly Satisfied"
   },
-  "filterTags": {
-    "created": "Created",
-    "modified": "Modified",
-    "pending": "Pending",
-    "confirmed": "Confirmed",
-    "cancelled": "Cancelled",
-    "departed": "Departed",
-    "cargoReceived": "Cargo Received",
-    "arrived": "Arrived",
-    "completed": "Completed"
-  },
   "dateRange": {
     "startEtaTime": "Start ETA Time",
     "endEtaTime": "End ETA Time",

src/stores/modules/filtersList.ts

@@ -63,7 +63,8 @@ export const useFiltersStore = defineStore('filtersStore', {
           }
           return {
             title: filter.title,
-            value: `${filter.title}: ${displayValue}`
+            value: `${filter.title}: ${displayValue}`,
+            key: filter.key
           }
         })
     }
@@ -71,7 +72,7 @@ export const useFiltersStore = defineStore('filtersStore', {
   actions: {
     getFilterIndexByKey(key: string) {
       return this.filtersList.findIndex(filter => {
-        return filter.key === key
+        return JSON.stringify(filter.key) === JSON.stringify(key)
       })
     },
     getFilterIndexByTitle(title: string) {
@@ -80,12 +81,12 @@ export const useFiltersStore = defineStore('filtersStore', {
       })
     },
     getFilterByKey(key: string) {
-      return this.filtersList.find(filter => filter.key === key)
+      return this.filtersList.find(filter => JSON.stringify(filter.key) === JSON.stringify(key))
     },
     getFilterByTitle(title: string) {
       return this.filtersList.find(filter => filter.title === title)
     },
-    deleteFilterByKey(key: string) {
+    deleteFilterByKey(key: string | string[]) {
       const index = this.getFilterIndexByKey(key)
       if (index !== -1) {
         this.filtersList.splice(index, 1)

src/views/Booking/src/BookingView.vue

@@ -56,13 +56,13 @@ const tableLoadingTableData = ref(false)
 const initPage = () => {
   if (!filtersList.value || (filtersList.value && filtersList.value.length == 0)) {
     filtersStore.updateFilter({
-      title: t('booking.transportMode'),
+      title: 'transport_mode',
       value: ['All'],
       keyType: 'array',
       key: 'transport_mode'
     })
     filtersStore.updateFilter({
-      title: t('booking.etd'),
+      title: 'ETD',
       value: [
         dayjs().subtract(2, 'month').startOf('month').format(formatDate),
         dayjs().add(1, 'month').format(formatDate)
@@ -71,7 +71,7 @@ const initPage = () => {
       key: ['f_etd_start', 'f_etd_end']
     })
     filtersStore.updateFilter({
-      title: t('booking.shipmentStatus'),
+      title: 'Shipment Status',
       value: ['All'],
       keyType: 'array',
       key: 'filterTag'
@@ -116,12 +116,17 @@ const getBookingData = () => {
       if (res.code === 200) {
         transportListItem.value = res.data.TransportList
 
-        tabList.value = res.data.tagsList
+        tabList.value = res.data.tagsList.map((item) => {
+          return {
+            ...item,
+            name: t(`booking.${item.name}`)
+          }
+        })
         const checkedTabNames = tabList.value
           .filter((item) => item.checked)
           .map((item) => item.name)
         filtersStore.updateFilter({
-          title: t('booking.shipmentStatus'),
+          title: 'Shipment Status',
           value: checkedTabNames,
           keyType: 'array',
           key: 'filterTag'
@@ -144,7 +149,7 @@ const tabChange = (changeTabList: any) => {
   tabList.value = changeTabList
   const checkedTabNames = tabList.value.filter((item) => item.checked).map((item) => item.name)
   filtersStore.updateFilter({
-    title: t('booking.shipmentStatus'),
+    title: 'Shipment Status',
     value: checkedTabNames,
     keyType: 'array',
     key: 'filterTag'
@@ -155,7 +160,7 @@ const tabChange = (changeTabList: any) => {
 // 点击search按钮
 const SearchInput = () => {
   filtersStore.updateFilter({
-    title: t('booking.textSearch'),
+    title: 'Text Search',
     value: textSearch.value,
     keyType: 'normal',
     key: '_textSearch',

src/views/Booking/src/components/BookingGuide.vue

@@ -224,13 +224,13 @@ defineExpose({
 }
 
 .download-file-guide-class {
-  right: 187px;
+  right: 186px;
   top: 246px;
-  width: 431px;
+  width: 831px;
   height: 304px;
   &.download-file-guide-dark-class {
-    right: 187px;
-    width: 431px;
+    right: 186px;
+    width: 593px;
     height: 304px;
   }
 }

src/views/Dashboard/src/DashboardView.vue

@@ -710,7 +710,7 @@ const ClickParams = (val: string) => {
 
   // 2. 设置运输方式
   filtersStore.updateFilter({
-    title: t('dashboard.transportMode'),
+    title: 'Transport Mode',
     key: 'transport_mode',
     value: config.transportMode,
     keyType: 'array'
@@ -733,7 +733,7 @@ const ClickParams = (val: string) => {
   })
   if (val === 'Top 10 Origin') {
     filtersStore.updateFilter({
-      title: t('tracking.origin'),
+      title: 'Origin',
       key: 'shipper_city',
       value: [seller_chart_top10_origin.value[0]?.paramscityname],
       keyType: 'array'
@@ -741,7 +741,7 @@ const ClickParams = (val: string) => {
   }
   if (val === 'Top 10 Destination') {
     filtersStore.updateFilter({
-      title: t('tracking.destination'),
+      title: 'Destination',
       key: 'consignee_city',
       value: [seller_chart_top10_destination.value[0]?.paramscityname],
       keyType: 'array'

src/views/Dashboard/src/components/RevenueChart.vue

@@ -311,7 +311,7 @@ const initOption = reactive({
           'M560.384 115.392a16.064 16.064 0 0 1 13.056 4.608l257.216 257.216c1.92 1.92 3.136 4.288 3.84 6.784h0.832v118.72h-32V404.48H626.112c-44.16 0-80-35.84-80-80V147.2H230.208a48 48 0 0 0-48 48v672c0 26.56 21.504 48 48 48h341.504v32H230.208c-44.16 0-80-35.776-80-80V195.2c0-44.16 35.84-80 80-80h330.24v0.192z m232.768 495.296v281.984l119.872-119.872 22.592 22.656-147.072 147.2a16.064 16.064 0 0 1-22.656 0l-147.2-147.2 22.656-22.656 119.808 119.872V610.688h32zM427.648 476.352c2.496 0 4.224 0.448 5.312 1.216a8.96 8.96 0 0 1 3.072 3.84L474.24 565.12a48.256 48.256 0 0 1 1.792-3.2c0.64-1.152 1.344-2.24 2.112-3.392l53.952-76.736a13.76 13.76 0 0 1 3.648-4.032 9.152 9.152 0 0 1 4.864-1.28h37.76L498.432 583.04l59.712 125.824h-32.64a7.872 7.872 0 0 1-5.76-2.112 15.936 15.936 0 0 1-3.264-4.48l-43.52-97.088a42.112 42.112 0 0 1-3.2 5.376l-64.768 91.648a14.208 14.208 0 0 1-5.312 5.248 13.952 13.952 0 0 1-6.272 1.408h-36.352L448 584.768l-53.248-108.416h32.96zM578.112 324.48c0 26.496 21.504 48 48 48h154.56L578.176 169.92V324.48z',
         onclick: function () {
           let filename =
-            t('dashboard.revenueSpentTitle') +
+            'Revenue Spent' +
             ' Details ' +
             barName.value[0] +
             '-' +

src/views/Dashboard/src/components/ScoringSystem.vue

@@ -38,6 +38,19 @@ interface AvaterItem {
   itemtitle: string
   changecolortext: boolean
 }
+
+interface ScoreOption {
+  label: string
+  value: string
+}
+
+interface SmileAspectsItem {
+  title: string
+  titleLabel: string
+  proposal: ScoreOption[]
+  radio: string
+}
+
 const avater = ref<AvaterItem[]>([])
 const inputdetails = ref('')
 avater.value = [
@@ -92,88 +105,82 @@ avater.value = [
     changecolortext: false
   }
 ]
-const checkboxGroup1 = ref([])
-const checkboxGroup2 = ref([])
+const checkboxGroup1 = ref<string[]>([])
+const checkboxGroup2 = ref<string[]>([])
 const evaluate = [
-  t('dashboard.functionality'),
-  t('dashboard.dataAccuracy'),
-  t('dashboard.lookAndFeel'),
-  t('dashboard.easeOfUse'),
-  t('dashboard.websitePerformance')
-]
-const happyevaluate = [
-  t('dashboard.functionality'),
-  t('dashboard.dataAccuracy'),
-  t('dashboard.lookAndFeel'),
-  t('dashboard.easeOfUse'),
-  t('dashboard.websitePerformance')
+  { label: t('dashboard.functionality'), value: 'functionality' },
+  { label: t('dashboard.dataAccuracy'), value: 'dataAccuracy' },
+  { label: t('dashboard.lookAndFeel'), value: 'lookAndFeel' },
+  { label: t('dashboard.easeOfUse'), value: 'easeOfUse' },
+  { label: t('dashboard.websitePerformance'), value: 'websitePerformance' }
 ]
+const happyevaluate = evaluate
 const Aspects = ref([
-  t('dashboard.highlyDissatisfied'),
-  t('dashboard.dissatisfied'),
-  t('dashboard.neutral'),
-  t('dashboard.satisfied'),
-  t('dashboard.highlySatisfied')
+  { label: t('dashboard.highlyDissatisfied'), value: 'highlyDissatisfied' },
+  { label: t('dashboard.dissatisfied'), value: 'dissatisfied' },
+  { label: t('dashboard.neutral'), value: 'neutral' },
+  { label: t('dashboard.satisfied'), value: 'satisfied' },
+  { label: t('dashboard.highlySatisfied'), value: 'highlySatisfied' }
 ])
-interface smileAspectsItem {
-  title: string
-  proposal: Array<string>
-  radio: string
-}
-const smileAspects = ref<smileAspectsItem[]>([])
+const smileAspects = ref<SmileAspectsItem[]>([])
 smileAspects.value = [
   {
-    title: t('dashboard.functionality'),
+    title: 'functionality',
+    titleLabel: t('dashboard.functionality'),
     proposal: [
-      t('dashboard.highlyDissatisfied'),
-      t('dashboard.dissatisfied'),
-      t('dashboard.neutral'),
-      t('dashboard.satisfied'),
-      t('dashboard.highlySatisfied')
+      { label: t('dashboard.highlyDissatisfied'), value: 'highlyDissatisfied' },
+      { label: t('dashboard.dissatisfied'), value: 'dissatisfied' },
+      { label: t('dashboard.neutral'), value: 'neutral' },
+      { label: t('dashboard.satisfied'), value: 'satisfied' },
+      { label: t('dashboard.highlySatisfied'), value: 'highlySatisfied' }
     ],
     radio: ''
   },
   {
-    title: t('dashboard.dataAccuracy'),
+    title: 'dataAccuracy',
+    titleLabel: t('dashboard.dataAccuracy'),
     proposal: [
-      t('dashboard.highlyDissatisfied'),
-      t('dashboard.dissatisfied'),
-      t('dashboard.neutral'),
-      t('dashboard.satisfied'),
-      t('dashboard.highlySatisfied')
+      { label: t('dashboard.highlyDissatisfied'), value: 'highlyDissatisfied' },
+      { label: t('dashboard.dissatisfied'), value: 'dissatisfied' },
+      { label: t('dashboard.neutral'), value: 'neutral' },
+      { label: t('dashboard.satisfied'), value: 'satisfied' },
+      { label: t('dashboard.highlySatisfied'), value: 'highlySatisfied' }
     ],
     radio: ''
   },
   {
-    title: t('dashboard.lookAndFeel'),
+    title: 'lookAndFeel',
+    titleLabel: t('dashboard.lookAndFeel'),
     proposal: [
-      t('dashboard.highlyDissatisfied'),
-      t('dashboard.dissatisfied'),
-      t('dashboard.neutral'),
-      t('dashboard.satisfied'),
-      t('dashboard.highlySatisfied')
+      { label: t('dashboard.highlyDissatisfied'), value: 'highlyDissatisfied' },
+      { label: t('dashboard.dissatisfied'), value: 'dissatisfied' },
+      { label: t('dashboard.neutral'), value: 'neutral' },
+      { label: t('dashboard.satisfied'), value: 'satisfied' },
+      { label: t('dashboard.highlySatisfied'), value: 'highlySatisfied' }
     ],
     radio: ''
   },
   {
-    title: t('dashboard.easeOfUse'),
+    title: 'easeOfUse',
+    titleLabel: t('dashboard.easeOfUse'),
     proposal: [
-      t('dashboard.highlyDissatisfied'),
-      t('dashboard.dissatisfied'),
-      t('dashboard.neutral'),
-      t('dashboard.satisfied'),
-      t('dashboard.highlySatisfied')
+      { label: t('dashboard.highlyDissatisfied'), value: 'highlyDissatisfied' },
+      { label: t('dashboard.dissatisfied'), value: 'dissatisfied' },
+      { label: t('dashboard.neutral'), value: 'neutral' },
+      { label: t('dashboard.satisfied'), value: 'satisfied' },
+      { label: t('dashboard.highlySatisfied'), value: 'highlySatisfied' }
     ],
     radio: ''
   },
   {
-    title: t('dashboard.websitePerformance'),
+    title: 'websitePerformance',
+    titleLabel: t('dashboard.websitePerformance'),
     proposal: [
-      t('dashboard.highlyDissatisfied'),
-      t('dashboard.dissatisfied'),
-      t('dashboard.neutral'),
-      t('dashboard.satisfied'),
-      t('dashboard.highlySatisfied')
+      { label: t('dashboard.highlyDissatisfied'), value: 'highlyDissatisfied' },
+      { label: t('dashboard.dissatisfied'), value: 'dissatisfied' },
+      { label: t('dashboard.neutral'), value: 'neutral' },
+      { label: t('dashboard.satisfied'), value: 'satisfied' },
+      { label: t('dashboard.highlySatisfied'), value: 'highlySatisfied' }
     ],
     radio: ''
   }
@@ -262,20 +269,22 @@ const changeHappyDetails = () => {
 }
 let SmileObj: any = {}
 const smilecheckbox = ref()
-const changeSmileRadio = (title: any, value: any) => {
+const changeSmileRadio = (title: string, value: string) => {
   SmileObj[title] = value
   smilecheckbox.value = SmileObj
   if (Object.keys(SmileObj).length == Aspects.value.length) {
     buttonDisabled.value = false
   }
 }
+const getSelectedLabels = (options: ScoreOption[], selectedValues: string[]) =>
+  options.filter((item) => selectedValues.includes(item.value)).map((item) => item.label)
 // 提交details
 const submitDetails = (val: any) => {
   const username = userStore.userName
   if (checkboxGroup1.value.length) {
     $api
       .scoringgrade({
-        suggestion: checkboxGroup1.value,
+        suggestion: getSelectedLabels(evaluate, checkboxGroup1.value),
         proposal: val,
         expression: checkexpression.value,
         username: username
@@ -292,7 +301,7 @@ const submitDetails = (val: any) => {
   } else if (checkboxGroup2.value.length) {
     $api
       .scoringgrade({
-        suggestion: checkboxGroup2.value,
+        suggestion: getSelectedLabels(happyevaluate, checkboxGroup2.value),
         proposal: val,
         expression: checkexpression.value
       })
@@ -310,7 +319,9 @@ const submitDetails = (val: any) => {
       .scoringgrade({
         proposal: val,
         expression: checkexpression.value,
-        ...smilecheckbox.value
+        ...Object.fromEntries(
+          Object.entries(smilecheckbox.value).map(([key, value]) => [key, value])
+        )
       })
       .then((res: any) => {
         if (res.code == 200) {
@@ -379,10 +390,10 @@ const submitDetails = (val: any) => {
               <el-checkbox-button
                 @change="changeAngryDetails"
                 v-for="item in evaluate"
-                :key="item"
-                :value="item"
+                :key="item.value"
+                :value="item.value"
               >
-                {{ item }}
+                {{ item.label }}
               </el-checkbox-button>
             </el-checkbox-group>
           </div>
@@ -390,13 +401,13 @@ const submitDetails = (val: any) => {
             <div class="smile_flex">
               <div class="smile_title_left"></div>
               <div class="smile_title_right">
-                <div class="smile_title" v-for="item in Aspects" :key="item">
-                  {{ item }}
+                <div class="smile_title" v-for="item in Aspects" :key="item.value">
+                  {{ item.label }}
                 </div>
               </div>
             </div>
             <div class="smile_content_flex" v-for="(item, index) in smileAspects" :key="index">
-              <div class="smile_title_left content_left">{{ item.title }}</div>
+              <div class="smile_title_left content_left">{{ item.titleLabel }}</div>
               <div class="smile_title_right content_right">
                 <el-radio-group
                   v-model="item.radio"
@@ -405,8 +416,8 @@ const submitDetails = (val: any) => {
                   <el-radio
                     class="smile_radio"
                     v-for="proposal in item.proposal"
-                    :value="proposal"
-                    :key="proposal"
+                    :value="proposal.value"
+                    :key="proposal.value"
                   ></el-radio>
                 </el-radio-group>
               </div>
@@ -417,10 +428,10 @@ const submitDetails = (val: any) => {
               <el-checkbox-button
                 @change="changeHappyDetails"
                 v-for="item in happyevaluate"
-                :key="item"
-                :value="item"
+                :key="item.value"
+                :value="item.value"
               >
-                {{ item }}
+                {{ item.label }}
               </el-checkbox-button>
             </el-checkbox-group>
           </div>

src/views/DestinationDelivery/src/components/ConfiguRations/src/components/CreateNewRule.vue

@@ -210,19 +210,23 @@ const handleSubmitRule = () => {
   let mergeData = []
   if (windowRadio.value == 1) {
     bookingWindow.value = 'No_Restrictions'
-    bookingdetail.value = t('destinationDelivery.noTimeRestrictionsForBooking')
+    bookingdetail.value = 'No Specific time restrictions for creating booking'
   } else if (windowRadio.value == 2) {
     bookingWindow.value = 'Restrictions_ETD_ATD'
-    bookingdetail.value = t('destinationDelivery.etdAtdRuleWindow', {
-      before: windowBeforeDays.value,
-      after: windowAfterDays.value
-    })
+    bookingdetail.value =
+      'ETD/ATD: ' +
+      windowBeforeDays.value +
+      ' days before to ' +
+      windowAfterDays.value +
+      ' days after'
   } else if (windowRadio.value == 3) {
     bookingWindow.value = 'Restrictions_ETA_ATA'
-    bookingdetail.value = t('destinationDelivery.etaAtaRuleWindow', {
-      before: windowBeforeDays.value,
-      after: windowAfterDays.value
-    })
+    bookingdetail.value =
+      'ETA/ATA: ' +
+      windowBeforeDays.value +
+      ' days before to ' +
+      windowAfterDays.value +
+      ' days after'
   }
   // if (recommendRadio.value == 1) {
   //   recommendDelivery.value = 'No_Recommended'

src/views/DestinationDelivery/src/components/CreateNewBooking/src/CreateNewbooking.vue

@@ -1,7 +1,4 @@
 <script setup lang="ts">
-import { useI18n } from 'vue-i18n'
-
-const { t } = useI18n()
 import CalendarDate from '@/components/DateRange/src/components/CalendarDate.vue'
 import NewbookingTable from './components/NewbookingTable.vue'
 import AddNewAddress from './images/default_add_address@2x.png'
@@ -12,6 +9,9 @@ import { useUserStore } from '@/stores/modules/user'
 import { useRouter, useRoute } from 'vue-router'
 import { ElMessage } from 'element-plus'
 import dayjs from 'dayjs'
+import { useI18n } from 'vue-i18n'
+
+const { t } = useI18n()
 
 const userStore = useUserStore()
 const router = useRouter()

src/views/DestinationDelivery/src/components/ListView.vue

@@ -42,31 +42,36 @@ const numberCards = ref([
     color: '#2b2f36'
   },
   {
-    label: t('destinationDelivery.pendingApproval'),
+    label: t('destinationDelivery.Pending Approval'),
+    key: 'Pending Approval',
     value: 0,
     color: '#edb82f',
     icon: 'icon_time_b'
   },
   {
-    label: t('destinationDelivery.approved'),
+    label: t('destinationDelivery.Approved'),
+    key: 'Approved',
     value: 0,
     color: '#00a870',
     icon: 'icon_confirm_b'
   },
   {
-    label: t('destinationDelivery.rejected'),
+    label: t('destinationDelivery.Rejected'),
+    key: 'Rejected',
     value: 0,
     color: '#c9353f',
     icon: 'icon_reject_b'
   },
   {
-    label: t('destinationDelivery.cancelled'),
+    label: t('destinationDelivery.Cancelled'),
+    key: 'Cancelled',
     value: 0,
     color: '#243041',
     icon: 'icon_cancelled_b'
   }
 ])
 const clickCard = (filterTagItem: string) => {
+  console.log(filterTagItem, 'tiem')
   queryData.value.filterTag.pop()
   queryData.value.filterTag.push(filterTagItem)
   handleSearch()
@@ -153,11 +158,9 @@ defineExpose({
       <div
         class="card"
         :class="{
-          'is-active':
-            queryData.filterTag.includes(item.key as string | undefined) ||
-            queryData.filterTag.includes(item.label)
+          'is-active': queryData.filterTag.includes(item.key as string | undefined)
         }"
-        @click="clickCard((item.key || item.label) as string)"
+        @click="clickCard(item.key)"
         v-for="(item, index) in numberCards"
         :key="index"
       >
@@ -165,7 +168,10 @@ defineExpose({
         <div
           class="card-value"
           :style="{
-            color: item.label === t('destinationDelivery.cancelled') ? `var(--color-card-number-cancelled)` : item.color
+            color:
+              item.label === t('destinationDelivery.Cancelled')
+                ? `var(--color-card-number-cancelled)`
+                : item.color
           }"
         >
           {{ item.value }}

src/views/DestinationDelivery/src/components/TableView/src/TableView.vue

@@ -133,25 +133,29 @@ const rtnNumberCards = (data) => {
       key: 'ALL'
     },
     {
-      label: t('destinationDelivery.pendingApproval'),
+      label: t("destinationDelivery['Pending Approval']"),
+      key: 'Pending Approval',
       value: data.pending_approval_rc || 0,
       color: '#edb82f',
       icon: 'icon_time_b'
     },
     {
-      label: t('destinationDelivery.approved'),
+      label: t('destinationDelivery.Approved'),
+      key: 'Approved',
       value: data.approved_rc || 0,
       color: '#00a870',
       icon: 'icon_confirm_b'
     },
     {
-      label: t('destinationDelivery.rejected'),
+      label: t('destinationDelivery.Rejected'),
+      key: 'Rejected',
       value: data.rejected_rc || 0,
       color: '#c9353f',
       icon: 'icon_reject_b'
     },
     {
-      label: t('destinationDelivery.cancelled'),
+      label: t('destinationDelivery.Cancelled'),
+      key: 'Cancelled',
       value: data.cancelled_rc || 0,
       color: '#243041',
       icon: 'icon_cancelled_b'
@@ -460,7 +464,7 @@ defineExpose({
       </template>
       <!-- Status字段的插槽 -->
       <template #status="{ row, column }">
-        <VTag :type="row[column.field]">{{ row[column.field] }}</VTag>
+        <VTag :type="row[column.field]">{{ t(`destinationDelivery.${row[column.field]}`) }}</VTag>
       </template>
       <!-- Booking No字段的插槽 -->
       <template #multLink="{ row, column }">

src/views/DestinationDelivery/src/components/TableView/src/components/BookingDetailDialog.vue

@@ -56,21 +56,21 @@ const handleStepData = (status, data) => {
       status: 'current'
     })
     stepList.value.push({
-      label: t('destinationDelivery.approved'),
+      label: t('destinationDelivery.Approved'),
       date: '--',
       icon: 'icon_confirm_b',
       status: 'unfinished'
     })
   } else if (status === 'Approved') {
     stepList.value.push({
-      label: t('destinationDelivery.approved'),
+      label: t('destinationDelivery.Approved'),
       date: data.update_time || '--',
       icon: 'icon_confirm_b',
       status: ''
     })
   } else if (status === 'Rejected') {
     stepList.value.push({
-      label: t('destinationDelivery.rejected'),
+      label: t('destinationDelivery.Rejected'),
       date: data.update_time || '--',
       icon: 'icon_reject_b',
       status: 'rejected',
@@ -78,7 +78,7 @@ const handleStepData = (status, data) => {
     })
   } else if (status === 'Cancelled') {
     stepList.value.push({
-      label: t('destinationDelivery.cancelled'),
+      label: t('destinationDelivery.Cancelled'),
       date: data.update_time || '--',
       icon: 'icon_cancelled_b',
       status: 'cancelled'

src/views/Tracking/src/TrackingView.vue

@@ -34,14 +34,14 @@ watch(
       // 从顶部获取的值
       filtersStore.clearFilters()
       filtersStore.updateFilter({
-        title: t('tracking.shipmentStatus'),
-        value: [t('common.all')],
+        title: 'Shipment Status',
+        value: ['All'],
         keyType: 'array',
         key: 'filterTag'
       })
       textSearch.value = headerSearchValue.value
       filtersStore.updateFilter({
-        title: t('tracking.textSearch'),
+        title: 'Text Search',
         value: textSearch.value,
         keyType: 'normal',
         key: '_textSearch',
@@ -59,37 +59,37 @@ const tableLoadingTableData = ref(false)
 
 const tabList = ref([
   {
-    name: t('common.all'),
+    name: 'All',
     number: 0,
     type: 'all',
     checked: true
   },
   {
-    name: t('tracking.created'),
+    name: 'Created',
     number: 0,
     type: 'created',
     checked: false
   },
   {
-    name: t('tracking.cargoReceived'),
+    name: 'Cargo Received',
     number: 0,
     type: 'cargo_received',
     checked: false
   },
   {
-    name: t('tracking.departed'),
+    name: 'Departed',
     number: 0,
     type: 'departed',
     checked: false
   },
   {
-    name: t('tracking.arrived'),
+    name: 'Arrived',
     number: 0,
     type: 'arrived',
     checked: false
   },
   {
-    name: t('tracking.completed'),
+    name: 'Completed',
     number: 0,
     type: 'completed',
     checked: false
@@ -119,7 +119,7 @@ const getTrackingData = () => {
           .filter((item) => item.checked)
           .map((item) => item.name)
         filtersStore.updateFilter({
-          title: t('tracking.shipmentStatus'),
+          title: 'Shipment Status',
           value: checkedTabNames,
           keyType: 'array',
           key: 'filterTag'
@@ -145,14 +145,14 @@ const initPage = () => {
   if (headerSearchValue.value) {
     filtersStore.clearFilters()
     filtersStore.updateFilter({
-      title: t('tracking.shipmentStatus'),
-      value: [t('common.all')],
+      title: 'Shipment Status',
+      value: ['All'],
       keyType: 'array',
       key: 'filterTag'
     })
     textSearch.value = headerSearchValue.value
     filtersStore.updateFilter({
-      title: t('tracking.textSearch'),
+      title: 'Text Search',
       value: textSearch.value,
       keyType: 'normal',
       key: '_textSearch',
@@ -160,13 +160,13 @@ const initPage = () => {
     })
   } else if (!filtersList.value || (filtersList.value && filtersList.value.length == 0)) {
     filtersStore.updateFilter({
-      title: t('booking.transportMode'),
-      value: [t('common.all')],
+      title: 'Transport Mode',
+      value: ['All'],
       keyType: 'array',
       key: 'transport_mode'
     })
     filtersStore.updateFilter({
-      title: t('tracking.etd'),
+      title: 'ETD',
       value: [
         dayjs().subtract(2, 'month').startOf('month').format(formatDate),
         dayjs().add(1, 'month').format(formatDate)
@@ -175,8 +175,8 @@ const initPage = () => {
       key: ['etd_start', 'etd_end']
     })
     filtersStore.updateFilter({
-      title: t('tracking.shipmentStatus'),
-      value: [t('common.all')],
+      title: 'Shipment Status',
+      value: ['All'],
       keyType: 'array',
       key: 'filterTag'
     })
@@ -201,7 +201,7 @@ const tabChange = (changeTabList: any) => {
   tabList.value = changeTabList
   const checkedTabNames = tabList.value.filter((item) => item.checked).map((item) => item.name)
   filtersStore.updateFilter({
-    title: t('tracking.shipmentStatus'),
+    title: 'Shipment Status',
     value: checkedTabNames,
     keyType: 'array',
     key: 'filterTag'
@@ -221,7 +221,7 @@ const getTabsList = (list) => {
 // 点击search按钮
 const SearchInput = () => {
   filtersStore.updateFilter({
-    title: t('tracking.textSearch'),
+    title: 'Text Search',
     value: textSearch.value,
     keyType: 'normal',
     key: '_textSearch',

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

@@ -77,7 +77,7 @@ const handleColumns = (columns: any, status?: string) => {
       }
     }
 
-    if (item.title === 'HBOL/HAWB No.') {
+    if (item.field === 'HBOL/HAWB No.') {
       curColumn = {
         ...curColumn,
         headerClassName: 'hbol-guide-header'
@@ -93,14 +93,16 @@ const getTableColumns = async () => {
   tableLoadingColumn.value = true
   await $api.getTrackingTableColumns().then((res: any) => {
     if (res.code === 200) {
-      const index = trackingTable.value.columns.findIndex((item: any) => item.title === 'Action')
+      const index = trackingTable.value.columns.findIndex(
+        (item: any) => item.title === t('common.action')
+      )
       trackingTable.value.columns = [
         { type: 'checkbox', width: 50, fixed: 'left' },
         ...handleColumns(res.data.TrackingTableColumns)
       ]
       if (index !== -1) {
         trackingTable.value.columns.push({
-          title: 'Action',
+          title: t('common.action'),
           fixed: 'left',
           width: 120,
           slots: { default: 'action' }
@@ -141,10 +143,12 @@ const assignTableData = (data: any) => {
   tempSearch.value = data.tmp_search
   canEdiVgm.value = data.canEdiVgm
   if (trackingTable.value.columns.length > 0) {
-    const index = trackingTable.value.columns.findIndex((item: any) => item.title === 'Action')
+    const index = trackingTable.value.columns.findIndex(
+      (item: any) => item.title === t('common.action')
+    )
     if (index === -1) {
       trackingTable.value.columns.push({
-        title: 'Action',
+        title: t('common.action'),
         fixed: 'left',
         width: 120,
         slots: { default: 'action' }

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

@@ -519,18 +519,29 @@ const handleDefaultSetting = (data: any) => {
               ></el-input>
             </template>
             <template #vInput="{ row, column }">
-              <el-input v-model="row[column.field]" :placeholder="t('tracking.pleaseEnter')"></el-input>
+              <el-input
+                v-model="row[column.field]"
+                :placeholder="t('tracking.pleaseEnter')"
+              ></el-input>
             </template>
 
             <template #vUnitSelect="{ row, column }">
-              <vxe-select v-model="row[column.field]" :placeholder="t('tracking.pleaseSelect')" clearable>
+              <vxe-select
+                v-model="row[column.field]"
+                :placeholder="t('tracking.pleaseSelect')"
+                clearable
+              >
                 <vxe-option label="KGS" value="KGS"></vxe-option>
                 <vxe-option label="LBS" value="LBS"></vxe-option>
               </vxe-select>
             </template>
 
             <template #vMethodSelect="{ row, column }">
-              <vxe-select v-model="row[column.field]" :placeholder="t('tracking.pleaseSelect')" clearable>
+              <vxe-select
+                v-model="row[column.field]"
+                :placeholder="t('tracking.pleaseSelect')"
+                clearable
+              >
                 <vxe-option label="SM1" value="SM1"></vxe-option>
                 <vxe-option label="SM2" value="SM2"></vxe-option>
               </vxe-select>