ソースを参照

style: 调整表格操作栏固定在表格左侧

Jack Zhou 4 ヶ月 前
コミット
3fb7ac58fb

+ 1 - 1
src/views/Booking/src/components/BookingDetail/src/components/AddReferenceDialog.vue

@@ -39,7 +39,7 @@ const tableData = ref<VxeGridProps<any>>({
     {
       title: 'Action',
       width: 90,
-      fixed: 'right',
+      fixed: 'left',
       slots: { default: 'action' }
     }
   ],

+ 1 - 1
src/views/ChatLog/src/components/TableView/src/TableView.vue

@@ -68,7 +68,7 @@ const getTableColumns = async () => {
       tableData.value.columns = [
         { type: 'checkbox', width: 50, fixed: 'left' },
         ...handleColumns(res.data.OperationTableColumns),
-        { title: 'Action', width: 106, fixed: 'right', slots: { default: 'action' } }
+        { title: 'Action', width: 106, fixed: 'left', slots: { default: 'action' } }
       ]
       tableOriginColumnsField.value = res.data.OperationTableColumns
     }

+ 1 - 0
src/views/DestinationDelivery/src/DestinationDelivery.vue

@@ -106,6 +106,7 @@ const handleSearch = () => {
           style="height: 38px"
           class="el-button--main el-button--pain-theme"
           @click="handleCreate"
+          v-if="tableRef?.isEmployeeRole === false"
         >
           <span style="margin-right: 4px" class="font_family icon-icon_add_b"></span>
           <span style="font-weight: 400">Create New Booking</span>

+ 37 - 26
src/views/DestinationDelivery/src/components/TableView/src/TableView.vue

@@ -37,10 +37,10 @@ const handleColumns = (columns: any, status?: string) => {
         ...curColumn,
         slots: { default: 'status' }
       }
-    } else if (item.type === 'link' && status !== 'all') {
+    } else if (item.type === 'multiple_link') {
       curColumn = {
         ...curColumn,
-        slots: { default: 'link' }
+        slots: { default: 'multLink' }
       }
     }
     // 格式化
@@ -76,7 +76,7 @@ const getTableColumns = async () => {
       if (index === -1) {
         tableData.value.columns.push({
           title: 'Action',
-          fixed: 'right',
+          fixed: 'left',
           width: 130,
           slots: { default: 'action' }
         })
@@ -104,7 +104,7 @@ const assignTableData = (data: any) => {
     if (index === -1) {
       tableData.value.columns.push({
         title: 'Action',
-        fixed: 'right',
+        fixed: 'left',
         width: 130,
         slots: { default: 'action' }
       })
@@ -112,7 +112,7 @@ const assignTableData = (data: any) => {
   }
 }
 
-const isEmployeeRole = ref(true)
+const isEmployeeRole = ref(null)
 
 const emit = defineEmits(['getNumberCards'])
 const rtnNumberCards = (data) => {
@@ -163,7 +163,7 @@ const getTableData = async (isPageChange?: boolean) => {
     })
     .then((res: any) => {
       if (res.code === 200) {
-        isEmployeeRole.value = res.data.is_employee
+        isEmployeeRole.value = res.data.is_employee || false
         assignTableData(res.data)
         rtnNumberCards(res.data)
       }
@@ -187,7 +187,7 @@ const SearchOperationLog = () => {
     })
     .then((res: any) => {
       if (res.code === 200) {
-        isEmployeeRole.value = res.data.is_employee
+        isEmployeeRole.value = res.data.is_employee || false
         assignTableData(res.data)
         rtnNumberCards(res.data)
       }
@@ -307,19 +307,22 @@ const handleCreate = () => {
   router.push({ name: 'Create New Booking' })
 }
 
-const handleLinkClick = (row: any, column: any) => {
-  if (column.title === 'Booking No.') {
-    router.push({
-      path: '/booking/detail',
-      query: { a: row.__serial_no, _schemas: row._schemas, status: row.Status }
-    })
-    // visitedRowState.setBookingTableData(row['__serial_no'])
-  } else if (column.title === 'HBOL/HAWB No.') {
-    router.push({
-      path: '/tracking/detail',
-      query: { a: row.__serial_no, _schemas: row._schemas }
-    })
+const testData = [
+  {
+    key: 'A1703530062',
+    value: 'CD1Xeh4rG%2FPmYIiCHAw2%2B0Gw8BFZ8k%2F2pQDkYX3vuf6iZ3kcQXj%2BzQ'
+  },
+  {
+    key: 'A1703530062',
+    value: 'CD1Xeh4rG%2FPmYIiCHAw2%2B0Gw8BFZ8k%2F2pQDkYX3vuf6iZ3kcQXj%2BzQ'
   }
+]
+
+const handleMultLinkClick = (item: any) => {
+  router.push({
+    path: '/tracking/detail',
+    query: { a: item.value, _schemas: item.order_from }
+  })
 }
 
 const tipsDialogRef = ref()
@@ -331,7 +334,8 @@ const handleChangeRowState = () => {
 }
 
 defineExpose({
-  SearchOperationLog
+  SearchOperationLog,
+  isEmployeeRole
 })
 </script>
 
@@ -362,6 +366,7 @@ defineExpose({
           <p>ensure smooth last-mile delivery.</p>
           <el-button
             style="height: 40px"
+            v-if="isEmployeeRole === false"
             class="el-button--main el-button--pain-theme"
             @click="handleCreate"
           >
@@ -431,13 +436,19 @@ defineExpose({
         <VTag :type="row[column.field]">{{ row[column.field] }}</VTag>
       </template>
       <!-- Booking No字段的插槽 -->
-      <template #link="{ row, column }">
-        <span
-          style="color: var(--color-theme); cursor: pointer"
-          @click="handleLinkClick(row, column)"
+      <template #multLink="{ row, column }">
+        <div
+          style="display: inline-block"
+          v-for="(item, index) in row[column.field]"
+          :key="item.key"
         >
-          {{ row[column.field] }}
-        </span>
+          <span v-if="index > 0">、</span>
+          <span
+            style="color: var(--color-theme); cursor: pointer"
+            @click="handleMultLinkClick(item)"
+            >{{ item.key }}</span
+          >
+        </div>
       </template>
     </vxe-grid>
 

+ 1 - 1
src/views/Tracking/src/components/TrackingDetail/src/components/AddReferenceDialog.vue

@@ -39,7 +39,7 @@ const tableData = ref<VxeGridProps<any>>({
     {
       title: 'Action',
       width: 90,
-      fixed: 'right',
+      fixed: 'left',
       slots: { default: 'action' }
     }
   ],

+ 1 - 0
src/views/Tracking/src/components/TrackingDetail/src/components/AttachmentView.vue

@@ -54,6 +54,7 @@ watch(
         {
           title: 'Action',
           width: 90,
+          fixed: 'left',
           slots: { default: 'action' }
         }
       ]

+ 25 - 21
src/views/Tracking/src/components/TrackingTable/src/TrackingTable.vue

@@ -92,7 +92,7 @@ const getTableColumns = async () => {
       if (index !== -1) {
         trackingTable.value.columns.push({
           title: 'Action',
-          fixed: 'right',
+          fixed: 'left',
           width: 120,
           slots: { default: 'action' }
         })
@@ -136,7 +136,7 @@ const assignTableData = (data: any) => {
     if (index === -1) {
       trackingTable.value.columns.push({
         title: 'Action',
-        fixed: 'right',
+        fixed: 'left',
         width: 120,
         slots: { default: 'action' }
       })
@@ -275,13 +275,14 @@ const trackingTable = ref<any>({
   headerRowStyle: {
     backgroundColor: 'var(--color-table-header-bg)'
   },
-  cellStyle: ({ column }) => {
-    if (column.title === 'Action' && themeStore.theme === 'dark') {
-      return {
-        backgroundColor: '#363940'
-      }
-    }
-  },
+  // action栏特殊的样式
+  // cellStyle: ({ column }) => {
+  //   if (column.title === 'Action' && themeStore.theme === 'dark') {
+  //     return {
+  //       backgroundColor: '#363940'
+  //     }
+  //   }
+  // },
   menuConfig: {
     body: {
       options: [
@@ -638,18 +639,21 @@ defineExpose({
       </template>
       <!-- action操作的插槽 -->
       <template #action="{ row }">
-        <el-button class="recent_button el-button--blue" @click="SubscribeShipments(row)">
-          <span v-if="row.is_subscribe" style="color: 'red'" class="iconfont_icon">
-            <svg class="iconfont" aria-hidden="true" style="fill: var(--color-theme)">
-              <use xlink:href="#icon-icon_marked_b"></use>
-            </svg>
-          </span>
-          <span v-else class="iconfont_icon" style="color: 'red'">
-            <svg class="iconfont" aria-hidden="true" style="color: 'red'">
-              <use xlink:href="#icon-icon_unmark_b"></use>
-            </svg>
-          </span>
-        </el-button>
+        <el-tooltip class="box-item" effect="dark" content="Subscribe" placement="top">
+          <el-button class="recent_button el-button--blue" @click="SubscribeShipments(row)">
+            <span v-if="row.is_subscribe" style="color: 'red'" class="iconfont_icon">
+              <svg class="iconfont" aria-hidden="true" style="fill: var(--color-theme)">
+                <use xlink:href="#icon-icon_marked_b"></use>
+              </svg>
+            </span>
+            <span v-else class="iconfont_icon" style="color: 'red'">
+              <svg class="iconfont" aria-hidden="true" style="color: 'red'">
+                <use xlink:href="#icon-icon_unmark_b"></use>
+              </svg>
+            </span>
+          </el-button>
+        </el-tooltip>
+
         <el-button
           v-if="row?.['Mode'] !== 'Air Freight' && canEdiVgm"
           @click="handleVGM(row)"