Jelajahi Sumber

配置空数据图片

@dongkboy 1 tahun lalu
induk
melakukan
8d3eeaf435
2 mengubah file dengan 14 tambahan dan 9 penghapusan
  1. TEMPAT SAMPAH
      src/assets/images/empty.png
  2. 14 9
      src/components/Table/index.vue

TEMPAT SAMPAH
src/assets/images/empty.png


+ 14 - 9
src/components/Table/index.vue

@@ -6,14 +6,18 @@
       </div>
       </div>
       <el-table ref="multipleTableRef"
       <el-table ref="multipleTableRef"
         :header-cell-style="{ 'background-color': '#EEF1F6', 'border-bottom': '1px solid #EEF1F6', 'font-size': '15px', 'color': '#333', 'padding': '10px 0' }"
         :header-cell-style="{ 'background-color': '#EEF1F6', 'border-bottom': '1px solid #EEF1F6', 'font-size': '15px', 'color': '#333', 'padding': '10px 0' }"
-         :data="props.tableData" :height="tableHeight" table-layout="fixed" style="width: 100%;"
-        @select="selectChange" @select-all="selectAllChange">
+        :data="props.tableData" :height="tableHeight" table-layout="fixed" style="width: 100%;"
+        @selection-change="selectionChange" @select-all="selectAllChange">
+        <!-- 空内容自定义 -->
+        <template #empty>
+          <div class="flex f-c a-c ">
+            <el-empty   image="../../../src/assets/images/empty.png" />
+          </div>
+        </template>
         <el-table-column type="selection" v-if="showSelect" :selectable="selectable" width="55" />
         <el-table-column type="selection" v-if="showSelect" :selectable="selectable" width="55" />
-
         <el-table-column v-if="showIndex" type="index" label="序号" width="55" />
         <el-table-column v-if="showIndex" type="index" label="序号" width="55" />
         <el-table-column v-for="column in columns" :key="column.prop" :prop="column.prop" :label="column.label"
         <el-table-column v-for="column in columns" :key="column.prop" :prop="column.prop" :label="column.label"
           :sortable="column.sortable ? 'custom' : false" :width="column.width">
           :sortable="column.sortable ? 'custom' : false" :width="column.width">
-
           <template #header>
           <template #header>
             <slot name="search" :slotData="column"></slot>
             <slot name="search" :slotData="column"></slot>
           </template>
           </template>
@@ -51,6 +55,7 @@
 						<el-button v-else type="primary" @click="handleEdit(scope)"> 编辑 </el-button>
 						<el-button v-else type="primary" @click="handleEdit(scope)"> 编辑 </el-button>
 					</template> -->
 					</template> -->
         </el-table-column>
         </el-table-column>
+
       </el-table>
       </el-table>
     </div>
     </div>
     <div class="page_box">
     <div class="page_box">
@@ -71,7 +76,7 @@ interface TableRow {
 interface TagTypes {
 interface TagTypes {
   [key: string]: string;
   [key: string]: string;
 }
 }
-const emit = defineEmits(['getList', 'selectAllChange','selectChange']);
+const emit = defineEmits(['getList', 'selectAllChange', 'selectionChange']);
 const props = defineProps<{
 const props = defineProps<{
   tableData: Array<TableRow>;
   tableData: Array<TableRow>;
   columnheight: number,
   columnheight: number,
@@ -134,7 +139,7 @@ const handleSizeChange = (val: number) => {
 //多选
 //多选
 
 
 const selectAllChange = (value: any[]) => {
 const selectAllChange = (value: any[]) => {
-  if (value.length>0) {
+  if (value.length > 0) {
     value.map(val => {
     value.map(val => {
       newSelectionList.value.push(val.id)
       newSelectionList.value.push(val.id)
     })
     })
@@ -144,15 +149,15 @@ const selectAllChange = (value: any[]) => {
   emit('selectAllChange', newSelectionList.value)
   emit('selectAllChange', newSelectionList.value)
 
 
 }
 }
-const selectChange = (value: any[]) => {
-  if (value.length>0) {
+const selectionChange = (value: any[]) => {
+  if (value.length > 0) {
     value.map(val => {
     value.map(val => {
       newSelectionList.value.push(val.id)
       newSelectionList.value.push(val.id)
     })
     })
   } else {
   } else {
     newSelectionList.value = [];
     newSelectionList.value = [];
   }
   }
-  emit('selectChange', newSelectionList.value)
+  emit('selectionChange', newSelectionList.value)
 }
 }
 const handleCurrentChange = (val: number) => {
 const handleCurrentChange = (val: number) => {