From 31fbdbaccf876db2aba31bb29313be8e570361c0 Mon Sep 17 00:00:00 2001
From: sakuya <81883387@qq.com>
Date: Thu, 17 Jun 2021 23:28:29 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AF=A6=E7=BB=86=E5=88=97=E8=A1=A8=E6=A8=A1?=
 =?UTF-8?q?=E6=9D=BF=20=E5=A2=9E=E5=8A=A0=E6=8E=92=E5=BA=8F=E5=92=8C?=
 =?UTF-8?q?=E8=BF=87=E6=BB=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/style/fix.less                |  2 ++
 src/views/template/list/index.vue | 12 ++++++++----
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/style/fix.less b/src/style/fix.less
index 00c7bd5d..804b909d 100644
--- a/src/style/fix.less
+++ b/src/style/fix.less
@@ -29,6 +29,8 @@
 .el-tag+.el-tag {margin-left: 10px;}
 .el-button-group+.el-button-group {margin-left: 10px;}
 .el-tabs__nav-wrap::after {height: 1px;}
+.el-table th.is-sortable {transition: .1s;}
+.el-table th.is-sortable:hover {background: #eee;}
 
 /* 覆盖tinymce样式 */
 .sceditor .tox-tinymce {border: 1px solid #DCDFE6;}
diff --git a/src/views/template/list/index.vue b/src/views/template/list/index.vue
index d86cba37..8889f1cc 100644
--- a/src/views/template/list/index.vue
+++ b/src/views/template/list/index.vue
@@ -26,8 +26,8 @@
 		<el-main class="nopadding">
 			<scTable ref="table" :data="list" @selection-change="selectionChange" stripe>
 				<el-table-column type="selection" width="50"></el-table-column>
-				<el-table-column label="ID" prop="id" width="80"></el-table-column>
-				<el-table-column label="状态" prop="state" width="60">
+				<el-table-column label="ID" prop="id" width="80" sortable></el-table-column>
+				<el-table-column label="状态" prop="state" width="60" :filters="[{text: '正常', value: '1'}, {text: '异常', value: '2'}]" :filter-method="filterHandler">
 					<template #default="scope">
 						<em v-if="scope.row.state=='1'" class="state state-1"></em>
 						<em v-if="scope.row.state=='2'" class="state state-2 status-processing"></em>
@@ -39,7 +39,7 @@
 						<p>{{scope.row.subtitle}}</p>
 					</template>
 				</el-table-column>
-				<el-table-column label="类型" prop="type" width="100">
+				<el-table-column label="类型" prop="type" width="100" :filters="[{text: '数据', value: '数据'}, {text: '表单', value: '表单'}]" :filter-method="filterHandler">
 					<template #default="scope">
 						<el-tag>{{scope.row.type}}</el-tag>
 					</template>
@@ -51,7 +51,7 @@
 						<el-progress v-if="scope.row.state=='2'" :percentage="scope.row.progress" status="exception"></el-progress>
 					</template>
 				</el-table-column>
-				<el-table-column label="创建时间" prop="time" width="150"></el-table-column>
+				<el-table-column label="创建时间" prop="time" width="150" sortable></el-table-column>
 				<el-table-column label="操作" fixed="right" align="right" width="200">
 					<template #default="scope">
 						<el-button type="text" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
@@ -127,6 +127,10 @@
 			table_show(row, index){
 				console.log(row, index);
 				this.info = true;
+			},
+			filterHandler(value, row, column){
+				const property = column.property;
+				return row[property] === value;
 			}
 		}
 	}