소스 검색

table组件调整

Xiao_123 4 달 전
부모
커밋
0a342a99eb
2개의 변경된 파일39개의 추가작업 그리고 39개의 파일을 삭제
  1. 38 39
      src/components/CtTable/index.vue
  2. 1 0
      src/views/recruit/enterprise/newlyAppointed/index.vue

+ 38 - 39
src/components/CtTable/index.vue

@@ -10,7 +10,7 @@
     <v-data-table
       ref="table"
       v-model="selected"
-      :class="`elevation-${elevation} tableColor ${noRadius ? 'noRadius' : ''}`"
+      :class="`elevation-${elevation} ${showFixedLastItem ? 'fixed-last-item' : ''}`"
       :headers="headers"
       :items="items"
       :item-key="itemKey"
@@ -115,10 +115,6 @@ const props = defineProps({
     type: [String, Number],
     default: ''
   },
-  noRadius: {
-    type: Boolean,
-    default: false
-  },
   noDataText: {
     type: String,
     default: '暂无数据'
@@ -134,6 +130,11 @@ const props = defineProps({
   selectStrategy: {
     type: String,
     default: 'single'
+  },
+  // 是否将最后一项固定在表格右侧
+  showFixedLastItem: {
+    type: Boolean,
+    default: false
   }
 })
 watch(() => props.modelValue, (val) => {
@@ -200,48 +201,46 @@ const handleSelect = (e) => {
   :deep(.v-table.v-table--hover > .v-table__wrapper > table > tbody > tr > td) {
     white-space: nowrap !important;
   }
-
-  :deep {
-    .v-table__wrapper {
-      position: relative;
-      
-      &::-webkit-scrollbar:horizontal {
-        height: 8px;
-      }
-      
-      &:not(:hover)::-webkit-scrollbar:horizontal {
-        display: none;
+  .fixed-last-item {
+    :deep {
+      .v-table__wrapper {
+        position: relative;
+        &::-webkit-scrollbar:horizontal {
+          height: 8px;
+        }
+        &:not(:hover)::-webkit-scrollbar:horizontal {
+          display: none;
+        }
       }
-    }
-
-    .v-table__wrapper:not(:hover), 
-    .v-table__wrapper::-webkit-scrollbar-thumb:horizontal {
-      background: transparent;
-    }
 
-    table > tbody > tr > td:last-child,
-    table > thead > tr > th:last-child {
-      position: sticky !important;
-      position: -webkit-sticky !important;
-      right: 0;
-      z-index: 1;
-      background: white !important;
-      box-shadow: none;
-    }
+      .v-table__wrapper:not(:hover), 
+      .v-table__wrapper::-webkit-scrollbar-thumb:horizontal {
+        background: transparent;
+      }
 
-    .v-table__wrapper.hasScroll {
       table > tbody > tr > td:last-child,
       table > thead > tr > th:last-child {
-        border-left: 1px solid #e0e0e0 !important;
-        // box-shadow: inset 10px 0 10px -10px rgba(0, 0, 0, .35) !important;
+        position: sticky !important;
+        position: -webkit-sticky !important;
+        right: 0;
+        z-index: 1;
+        background: white !important;
+        box-shadow: none;
       }
 
-      table > thead > tr > th:last-child {
-        z-index: 10 !important;
-        // box-shadow: inset 10px 0 10px -10px rgba(0, 0, 0, .35) !important;
-        // border-bottom: 1px solid #e0e0e0 !important;
+      .v-table__wrapper.hasScroll {
+        table > tbody > tr > td:last-child,
+        table > thead > tr > th:last-child {
+          border-left: 1px solid #e0e0e0 !important;
+          // box-shadow: inset 10px 0 10px -10px rgba(0, 0, 0, .35) !important;
+        }
+
+        table > thead > tr > th:last-child {
+          z-index: 10 !important;
+          // box-shadow: inset 10px 0 10px -10px rgba(0, 0, 0, .35) !important;
+          border-bottom: 1px solid #e0e0e0 !important;
+        }
       }
     }
   }
-
 </style>

+ 1 - 0
src/views/recruit/enterprise/newlyAppointed/index.vue

@@ -13,6 +13,7 @@
 				:isTools="false"
 				height="calc(100vh - 400px)"
 				:showPage="true"
+				:showFixedLastItem="true"
 				:total="total"
 				:pageInfo="query"
 				itemKey="id"