【更新】s-table问题修复，同时修改斑马纹的是否显示由开关变为选择框更美观

snowy-admin-web/src/components/Table/index.vue

@@ -13,10 +13,8 @@
 		data() {
 			return {
 				needTotalList: [],
-
 				selectedRows: [],
 				selectedRowKeys: [],
-
 				localLoading: false,
 				localDataSource: [],
 				localPagination: Object.assign({}, this.pagination),
@@ -44,7 +42,7 @@
 				default: 1
 			},
 			size: {
-				// type: Number,
+				type: String,
 				default: '10'
 			},
 			showSizeChanger: {
@@ -140,7 +138,7 @@
 						size: this.size, //this.compSize, size// 改动
 						showSizeChanger: this.showSizeChanger,
 						showTotal: (total, range) => {
-							return `${range[0]}-${range[1]}共${total}条`
+							return `${range[0]}-${range[1]} 共 ${total} 条 `
 						}
 					})) ||
 				false
@@ -155,14 +153,9 @@
 			 * @param bool Boolean
 			 */
 			refresh(bool = false) {
-				bool &&
+				bool && (this.localPagination = Object.assign({}, {
-					(this.localPagination = Object.assign(
+					current: 1, size: this.size
-						{},
+				}))
-						{
-							current: 1,
-							size: this.size
-						}
-					))
 				this.loadData()
 			},
 			/**
@@ -173,30 +166,22 @@
 			 */
 			loadData(pagination, filters, sorter) {
 				this.localLoading = true
-				const parameter = Object.assign(
+				const parameter = Object.assign({
-					{
+					current: (pagination && pagination.current) ||
-						current:
+							this.showPagination && this.localPagination.current || this.pageNum,
-							(pagination && pagination.current) ||
+					size: (pagination && pagination.pageSize) ||
-							(this.showPagination && this.localPagination.current) ||
+							this.showPagination && this.localPagination.pageSize || this.pageSize
-							this.pageNum,
-						size: (pagination && pagination.pageSize) || (this.showPagination && this.localPagination.size) || this.size
 					},
-					(sorter &&
+					(sorter && sorter.field && {
-						sorter.field && {
+						sortField: sorter.field
-							sortField: sorter.field
+					}) || {},
-						}) ||
+					(sorter && sorter.order && {
-						{},
+						sortOrder: sorter.order
-					(sorter &&
+					}) || {}, {
-						sorter.order && {
-							sortOrder: sorter.order
-						}) ||
-						{},
-					{
 						...filters
 					}
 				)
 				const result = this.data(parameter)
-				// 对接自己的通用数据接口需要修改下方代码中的 r.current, r.totalCount, r.data
 				// eslint-disable-next-line
         		if (
 					(typeof result === 'object' || typeof result === 'function') &&
@@ -213,6 +198,9 @@
 									current: r.current, // pageNo, // 返回结果中的当前分页数
 									total: r.total, // totalRows, // 返回结果中的总记录数
 									showSizeChanger: this.showSizeChanger,
+									showTotal: (total, range) => {
+										return `${range[0]}-${range[1]} 共 ${total} 条 `
+									},
 									size: (pagination && pagination.size) || this.localPagination.size
 								})) ||
 							false
@@ -226,23 +214,21 @@
 							this.loadData()
 							return
 						}
-
-						// 这里用于判断接口是否有返回 r.totalCount(total) 且 this.showPagination = true 且 current 和 size 存在 且 totalCount 小于等于 current * size 的大小
 						// 当情况满足时，表示数据不满足分页大小，关闭 table 分页功能
 						try {
-							if (['auto', true].includes(this.showPagination) && r.total <= r.pages * this.localPagination.size) {
+							/*
+							if ((['auto', true].includes(this.showPagination) && r.total <= (r.pages * this.localPagination.size))) {
+								this.localPagination.hideOnSinglePage = true
+							}
+							*/
+							if (!this.showPagination) {
 								this.localPagination.hideOnSinglePage = true
 							}
 						} catch (e) {
 							this.localPagination = false
 						}
 						// 返回结果中的数组数据
-						if (this.showPagination === false) {
+						this.localDataSource = r.records
-							// 因为按住小诺的套路，不分页的直接是在data中，我们在界面中直接就是返回了data
-							this.localDataSource = r
-						} else {
-							this.localDataSource = r.records
-						}
 						this.localLoading = false
 					})
 				}
@@ -321,7 +307,7 @@
 				const needTotalItems = this.needTotalList.map((item) => {
 					return (
 						<span className="mr-3">
-							{item.title}总计{' '}
+							{item.title} 总计 {' '}
 							<a className="font-6">{!item.customRender ? item.total : item.customRender(item.total)}</a>
 						</span>
 					)
@@ -400,24 +386,23 @@
 				}
 
 				// 斑马纹
-				const changeRowClass = (val) => {
+				const changeRowClass = (value) => {
+					const val = value.target.checked
 					this.localSettings.rowClassNameSwitch = val
 					const evenClass = val ? (_record, index) => (index % 2 === 1 ? 'table-striped' : null) : this.rowClassName
 					this.localSettings.rowClassName = evenClass
 				}
-
 				return (
 					<div className="s-table-tool">
 						<div className="s-table-tool-left">{this.$slots.operator && this.$slots.operator()}</div>
 						<div className="layout-items-center s-table-tool-right">
 							{this.toolConfig.striped ? (
 								<div className="layout-items-center ml-4">
-									<span>斑马线</span>
+									<a-checkbox
-									<a-switch
 										checked={this.localSettings.rowClassNameSwitch}
 										onChange={changeRowClass}
-										className="ml-2"
+									>斑马纹
-									/>
+									</a-checkbox>
 								</div>
 							) : null}
 
@@ -430,7 +415,6 @@
 										{tool.icon}
 									</a-tooltip>
 								)
-
 								if (tool.isPopover) {
 									return (
 										<a-popover