feat:添加shipment status的tag

src/components/FliterTags/src/FilterTags.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { ref, watch } from 'vue'
+import { ref, onMounted, onBeforeMount, watch, computed } from 'vue'
+import emitter from '@/utils/bus'
 interface ListItem {
   name: string
   number: number
@@ -20,6 +21,23 @@ watch(
     TagsList.value = current
   }
 )
+onMounted(() => {
+  emitter.on('clearTag', (tag: any) => {
+    if (tag.includes('Shipment status')) {
+      checkedCount = []
+      // TagsList.value.forEach((item: any) => {
+      //   item.checked = false
+      // })
+      // TagsList.value[0].checked = true
+      NewTagsList.value = ['All']
+      emits('changeTag', NewTagsList.value)
+    }
+  })
+})
+
+onBeforeMount(() => {
+  emitter.off('clearTag')
+})
 
 NewTagsList.value = []
 

src/components/MoreFilters/src/MoreFilters.vue

@@ -1184,9 +1184,9 @@ watch(
           </div>
         </el-collapse-item>
         <!-- Others -->
-        <el-collapse-item class="collapse_item" name="Others">
+        <!-- <el-collapse-item class="collapse_item" name="Others">
           <template #title><span class="collapse-title">Others</span></template>
-        </el-collapse-item>
+        </el-collapse-item> -->
       </el-collapse>
       <div class="more_bottom">
         <el-button class="reset" type="default" @click="clearrest">

src/views/Booking/src/BookingView.vue

@@ -16,10 +16,12 @@ const BookingSearch = ref()
 const tableLoadingTableData = ref(false)
 let searchTableQeury: any = {}
 const filterData = reactive({
+  filtersTagData: [] as Array<string>,
   transportData: [] as Array<string>,
   daterangeData: [] as Array<string>,
   morefiltersData: [] as Array<string>
 })
+onMounted(() => {})
 const tagsData: any = ref([])
 const handleClose = (tag: any) => {
   emitter.emit('clearTag', tag)
@@ -252,10 +254,14 @@ const defaultMorefilters = (val: any, value: any, data: any) => {
 }
 const clearfilters = () => {
   BookingSearch.value = ''
+  filterData.filtersTagData = []
   tagsData.value = []
+  let str = 'Shipment status: All'
+  filterData.filtersTagData.push(str)
   filterData.transportData = []
   filterData.daterangeData = []
   filterData.morefiltersData = []
+  emitter.emit('clearTag', 'Shipment status')
   emitter.emit('clearTag', 'Transport Mode')
   emitter.emit('clearTag', 'ETD')
   emitter.emit('clearTag', 'ETA')
@@ -273,8 +279,10 @@ const clearfilters = () => {
   emitter.emit('clearTag', 'Vessel')
   emitter.emit('clearTag', 'Voyage')
   searchTableQeury = {}
+  searchTableQeury.filterTag = ['All']
   sessionStorage.setItem('searchTableQeury', JSON.stringify(searchTableQeury))
   getbookingdata()
+  renderTagsData()
 }
 const renderTagsData = () => {
   tagsData.value = []
@@ -291,6 +299,11 @@ const renderTagsData = () => {
       tagsData.value.push(item)
     })
   }
+  if (filterData.filtersTagData.length) {
+    filterData.filtersTagData.forEach((item) => {
+      tagsData.value.push(item)
+    })
+  }
 }
 // 清除 Transport Tags
 const clearTransportTags = () => {
@@ -331,6 +344,19 @@ const getbookingdata = () => {
       if (res.code === 200) {
         TransportListItem.value = res.data.TransportList
         TagsList.value = res.data.tagsList
+        let taglist: any = []
+        if (Object.keys(filterData.filtersTagData).length == 0) {
+          TagsList.value.forEach((item: any) => {
+            if (item.checked == true) {
+              taglist.push(item.name)
+            }
+          })
+          let str = 'Shipment status: ' + taglist.toString()
+          filterData.filtersTagData.push(str)
+          filterData.filtersTagData.forEach((item) => {
+            tagsData.value.push(item)
+          })
+        }
         sessionStorage.setItem('BookingData', JSON.stringify(res.data))
         BookingTable_ref.value.searchTableData(searchTableQeury)
         // 查询没结果的话显示icon
@@ -345,9 +371,13 @@ const getbookingdata = () => {
     })
 }
 const changeTag = (val: any) => {
+  filterData.filtersTagData = []
   searchTableQeury.filterTag = val
+  let str = 'Shipment status: ' + val
+  filterData.filtersTagData.push(str)
   sessionStorage.setItem('searchTableQeury', JSON.stringify(searchTableQeury))
   getbookingdata()
+  renderTagsData()
   filterTag.value = val
 }
 // 点击search按钮
@@ -423,7 +453,7 @@ const SearchInput = () => {
         :key="tag"
         class="tag"
         v-for="tag in tagsData"
-        closable
+        :closable="!tag.includes('Shipment')"
         :disable-transitions="false"
         @close="handleClose(tag)"
         color="#EFEFF0"

src/views/Tracking/src/TrackingView.vue

@@ -19,6 +19,7 @@ const TrackingSearch = ref()
 const tableLoadingTableData = ref(false)
 let searchTableQeuryTracking: any = {}
 const filterData = reactive({
+  filtersTagData: [] as Array<string>,
   transportData: [] as Array<string>,
   daterangeData: [] as Array<string>,
   morefiltersData: [] as Array<string>,
@@ -375,11 +376,15 @@ const defaultMorefilters = (val: any, value: any, data: any) => {
 }
 const clearfilters = () => {
   TrackingSearch.value = ''
+  filterData.filtersTagData = []
   tagsData.value = []
+  let str = 'Shipment status: All'
+  filterData.filtersTagData.push(str)
   filterData.transportData = []
   filterData.daterangeData = []
   filterData.morefiltersData = []
   filterData.dashboardData = []
+  emitter.emit('clearTag', 'Shipment status')
   emitter.emit('clearTag', 'Transport Mode')
   emitter.emit('clearTag', 'ETD')
   emitter.emit('clearTag', 'ETA')
@@ -414,8 +419,11 @@ const clearfilters = () => {
     data = {}
     sessionStorage.setItem('reportList', JSON.stringify(reportlist))
     sessionStorage.setItem('tagsList', JSON.stringify(data))
+  } else {
+    searchTableQeuryTracking.filterTag = ['All']
   }
   Gettrackingdata()
+  renderTagsData()
 }
 const renderTagsData = () => {
   tagsData.value = []
@@ -437,6 +445,11 @@ const renderTagsData = () => {
       tagsData.value.push(item)
     })
   }
+  if (filterData.filtersTagData.length) {
+    filterData.filtersTagData.forEach((item) => {
+      tagsData.value.push(item)
+    })
+  }
 }
 // 清除 Transport Tags
 const clearTransportTags = () => {
@@ -472,11 +485,16 @@ const initDataByHeaderSearch = () => {
     filterData.daterangeData = []
     filterData.morefiltersData = []
     filterData.dashboardData = []
+    filterData.filtersTagData = []
+    let str = 'Shipment status: All'
+    filterData.filtersTagData.push(str)
     searchTableQeuryTracking = {}
     sessionStorage.removeItem('searchTableQeuryTracking')
     searchTableQeuryTracking._textSearch = TrackingSearch.value
+    searchTableQeuryTracking.filterTag = ['All']
     sessionStorage.setItem('searchTableQeuryTracking', JSON.stringify(searchTableQeuryTracking))
     setTimeout(() => {
+      emitter.emit('clearTag', 'Shipment status')
       emitter.emit('clearTag', 'Transport Mode')
       emitter.emit('clearTag', 'ETD')
       emitter.emit('clearTag', 'ETA')
@@ -500,6 +518,7 @@ const initDataByHeaderSearch = () => {
       emitter.emit('clearTag', 'Vessel')
       emitter.emit('clearTag', 'Voyage')
     }, 2000)
+    renderTagsData()
   }
 }
 
@@ -545,6 +564,19 @@ const Gettrackingdata = () => {
           IncotermsList: res.data.IncotermsList,
           ServiceList: res.data.ServiceList
         }
+        let taglist: any = []
+        if (Object.keys(filterData.filtersTagData).length == 0) {
+          TagsList.value.forEach((item: any) => {
+            if (item.checked == true) {
+              taglist.push(item.name)
+            }
+          })
+          let str = 'Shipment status: ' + taglist.toString()
+          filterData.filtersTagData.push(str)
+          filterData.filtersTagData.forEach((item) => {
+            tagsData.value.push(item)
+          })
+        }
         sessionStorage.setItem('incotermsList', JSON.stringify(obj))
         sessionStorage.setItem('TrackingData', JSON.stringify(res.data))
         TrackingTable_ref.value.searchTableData(searchTableQeuryTracking)
@@ -584,10 +616,14 @@ onMounted(() => {
   renderTagsData()
 })
 const changeTag = (val: any) => {
+  filterData.filtersTagData = []
   searchTableQeuryTracking.filterTag = val
+  let str = 'Shipment status: ' + val
+  filterData.filtersTagData.push(str)
   filterTag.value = val
   sessionStorage.setItem('searchTableQeuryTracking', JSON.stringify(searchTableQeuryTracking))
   Gettrackingdata()
+  renderTagsData()
 }
 // 点击search按钮
 const SearchInput = () => {
@@ -662,7 +698,7 @@ const SearchInput = () => {
         :key="tag"
         class="tag"
         v-for="tag in tagsData"
-        closable
+        :closable="!tag.includes('Shipment')"
         :disable-transitions="false"
         @close="handleClose(tag)"
         color="#EFEFF0"