|  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | import BasePage from './BasePage' | 
|---|
|  |  |  | import { isFunction } from 'element-ui' | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | name: 'BaseTable', | 
|---|
|  |  |  | extends: BasePage, | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | // 配置 | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 配置 | 
|---|
|  |  |  | * | 
|---|
|  |  |  | * @param extParams 配置参数 | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | config (extParams) { | 
|---|
|  |  |  | if (extParams == null) { | 
|---|
|  |  |  | throw new Error('Parameter can not be null of method \'config\' .') | 
|---|
|  |  |  | 
|---|
|  |  |  | if (extParams.api == null) { | 
|---|
|  |  |  | throw new Error('Missing config option \'api\'.') | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | if(extParams.api.indexOf('@/',0) === 0){ | 
|---|
|  |  |  | this.api = require(extParams.api) | 
|---|
|  |  |  | }else { | 
|---|
|  |  |  | this.api = require('@/api' + extParams.api) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // this.api = require('@/api' + extParams.api) | 
|---|
|  |  |  | this.api = require('@/api' + extParams.api) | 
|---|
|  |  |  | extParams.module && (this.module = extParams.module) | 
|---|
|  |  |  | extParams['field.id'] && (this.configData['field.id'] = extParams['field.id']) | 
|---|
|  |  |  | extParams['field.main'] && (this.configData['field.main'] = extParams['field.main']) | 
|---|
|  |  |  | this.tableData.sorts = extParams.sorts | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 搜索 | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 搜索(点击搜索按钮时触发) | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | search () { | 
|---|
|  |  |  | this.handlePageChange(1) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 导出Excel | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 导出Excel(点击导出按钮时触发) | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | exportExcel () { | 
|---|
|  |  |  | this.__checkApi() | 
|---|
|  |  |  | this.$dialog.exportConfirm('确认导出吗?') | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .catch(() => {}) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 搜索框重置 | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 重置搜索条件(点击重置按钮时触发) | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | reset () { | 
|---|
|  |  |  | this.$refs.searchForm.resetFields() | 
|---|
|  |  |  | this.search() | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 每页显示数量变更处理 | 
|---|
|  |  |  | refresh () { | 
|---|
|  |  |  | window.location.reload() | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 页容量变更处理(切换页容量时触发) | 
|---|
|  |  |  | * | 
|---|
|  |  |  | * @param pageSize 页容量 | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | handleSizeChange (pageSize) { | 
|---|
|  |  |  | this.tableData.pagination.pageSize = pageSize | 
|---|
|  |  |  | this.search() | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 行选中处理 | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 行选中处理(点击选中列时触发) | 
|---|
|  |  |  | * | 
|---|
|  |  |  | * @param selectedRows 已选中的行数组 | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | handleSelectionChange (selectedRows) { | 
|---|
|  |  |  | this.tableData.selectedRows = selectedRows | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 排序 | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 排序(点击列头排序时触发) | 
|---|
|  |  |  | * | 
|---|
|  |  |  | * @param sortData 排序参数 | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | handleSortChange (sortData) { | 
|---|
|  |  |  | this.tableData.sorts = [] | 
|---|
|  |  |  | if (sortData.order != null) { | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | this.handlePageChange() | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 页码变更处理 | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 页码变更处理(分页时触发) | 
|---|
|  |  |  | * | 
|---|
|  |  |  | * @param pageIndex 新页码 | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | handlePageChange (pageIndex) { | 
|---|
|  |  |  | this.__checkApi() | 
|---|
|  |  |  | this.tableData.pagination.pageIndex = pageIndex || this.tableData.pagination.pageIndex | 
|---|
|  |  |  | 
|---|
|  |  |  | this.tableData.pagination.total = data.total | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .catch(e => { | 
|---|
|  |  |  | // this.$tip.apiFailed(e) | 
|---|
|  |  |  | this.$tip.apiFailed(e) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .finally(() => { | 
|---|
|  |  |  | this.isWorking.search = false | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 删除 | 
|---|
|  |  |  | deleteById (row, childConfirm = true) { | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 删除(点击行操作/删除时触发) | 
|---|
|  |  |  | * | 
|---|
|  |  |  | * @param row 行对象 | 
|---|
|  |  |  | * @param childConfirm 删除子节点时是否进行二次确认 | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | deleteById (row, childConfirm = true, call) { | 
|---|
|  |  |  | this.__checkApi() | 
|---|
|  |  |  | // let message = `确认删除${this.module}【${row[this.configData['field.main']]}】吗?` | 
|---|
|  |  |  | let message = `确认删除该记录吗?` | 
|---|
|  |  |  | let message = `确认删除${this.module}吗?` | 
|---|
|  |  |  | if (childConfirm && row.children != null && row.children.length > 0) { | 
|---|
|  |  |  | // message = `确认删除${this.module}【${row[this.configData['field.main']]}】及其子${this.module}吗?` | 
|---|
|  |  |  | message = `确认删除该记录及其子数据吗?` | 
|---|
|  |  |  | message = `确认删除${this.module}【${row[this.configData['field.main']]}】及其子${this.module}吗?` | 
|---|
|  |  |  | } | 
|---|
|  |  |  | this.$dialog.deleteConfirm(message) | 
|---|
|  |  |  | .then(() => { | 
|---|
|  |  |  | this.isWorking.delete = true | 
|---|
|  |  |  | this.api.deleteById(row[this.configData['field.id']]) | 
|---|
|  |  |  | .then(() => { | 
|---|
|  |  |  | this.$tip.apiSuccess('删除成功') | 
|---|
|  |  |  | this.__afterDelete() | 
|---|
|  |  |  | if (call) { | 
|---|
|  |  |  | call() | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .catch(e => { | 
|---|
|  |  |  | // this.$tip.apiFailed(e) | 
|---|
|  |  |  | this.$tip.apiFailed(e) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .finally(() => { | 
|---|
|  |  |  | this.isWorking.delete = false | 
|---|
|  |  |  | 
|---|
|  |  |  | .catch(() => {}) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 批量删除 | 
|---|
|  |  |  | * @treeMode 是否添加子节点删除确认 | 
|---|
|  |  |  | * 批量删除(点击批量删除时触发) | 
|---|
|  |  |  | * | 
|---|
|  |  |  | * @param childConfirm 删除子节点时是否进行二次确认 | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | deleteByIdInBatch (childConfirm = true) { | 
|---|
|  |  |  | deleteByIdInBatch (childConfirm = true, call) { | 
|---|
|  |  |  | this.__checkApi() | 
|---|
|  |  |  | if (this.tableData.selectedRows.length === 0) { | 
|---|
|  |  |  | this.$tip.warning('请至少选择一条数据') | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (containChildrenRows.length > 0) { | 
|---|
|  |  |  | message = '本次将删除该数据及其子数据,确认删除吗?' | 
|---|
|  |  |  | message = `本次将删除${this.module}【${containChildrenRows.join('、')}】及其子${this.module}记录,确认删除吗?` | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | this.$dialog.deleteConfirm(message) | 
|---|
|  |  |  | .then(() => { | 
|---|
|  |  |  | this.isWorking.delete = true | 
|---|
|  |  |  | this.api.deleteByIdInBatch(this.tableData.selectedRows.map(row => row.id).join(',')) | 
|---|
|  |  |  | this.api.deleteByIdInBatch(this.tableData.selectedRows.map(row => row[this.configData['field.id']]).join(',')) | 
|---|
|  |  |  | .then(() => { | 
|---|
|  |  |  | this.$tip.apiSuccess('删除成功') | 
|---|
|  |  |  | this.__afterDelete(this.tableData.selectedRows.length) | 
|---|
|  |  |  | if (call) { | 
|---|
|  |  |  | call() | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .catch(e => { | 
|---|
|  |  |  | // this.$tip.apiFailed(e) | 
|---|
|  |  |  | this.$tip.apiFailed(e) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .finally(() => { | 
|---|
|  |  |  | this.isWorking.delete = false | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .catch(() => {}) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 删除处理 | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 删除后处理,在单行删除或多行删除后调用 | 
|---|
|  |  |  | * | 
|---|
|  |  |  | * @param deleteCount 删除数量 | 
|---|
|  |  |  | * @private | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | __afterDelete (deleteCount = 1) { | 
|---|
|  |  |  | this.$tip.apiSuccess('删除成功') | 
|---|
|  |  |  | // 删除当前页最后一条记录时查询上一页数据 | 
|---|
|  |  |  | if (this.tableData.list.length - deleteCount === 0) { | 
|---|
|  |  |  | this.handlePageChange(this.tableData.pagination.pageIndex - 1 === 0 ? 1 : this.tableData.pagination.pageIndex - 1) | 
|---|
|  |  |  | 
|---|
|  |  |  | this.handlePageChange(this.tableData.pagination.pageIndex) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 检查接口是否配置 | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 检查接口是否配置,在调用接口时调用 | 
|---|
|  |  |  | * | 
|---|
|  |  |  | * @private | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | __checkApi () { | 
|---|
|  |  |  | if (this.api == null) { | 
|---|
|  |  |  | throw new Error('The page is not initialized, you can use method \'this.config\' to initialize this page.') | 
|---|