import { mapGetters } from 'vuex'; /** * 需要页面组件自己注入或重写参数 * listData: 页面列表数据 导入名字key需重命名为listData * pagination: 列表的分页数据 * filters: 带有搜索条件的页面需自己定义filters * * 需要页面组件自己注入或重写方法 * fetchList: 获取列表数据的方法 通常为触发action的方法 * updatePagination: 切换分页大小需要注入此方法更新分页信息 */ export default { data() { return { // listData: [], // 需页面组件自己注入列表并命名为 listData filters: {}, selected: {}, selectedList: [], // 带有选择框列表选中的列表项 editType: 0, // 带有新增/编辑的页面区分编辑状态 dialogEditVisible: false, // 带有新增/编辑的页面弹出框可/不可见 dialogDetailVisible: false, // 详情弹窗 }; }, // computed: { ...mapGetters(['loading']), }, created() { // 当页面没有列表数据的时候调用 if (!this.listData || !this.listData.length) { this.fetchList({ pageNum: 1, }); } }, methods: { // 页面组件需自己实现获取列表数据的方法 fetchList() {}, // 点击搜索时处理函数 searchList() { this.changePage(1); }, // 获取过滤条件方法 组件可自己实现 getFilters() { let { timeRange, ...filters } = this.$getFilters(this.filters); if (timeRange) { const [starttime, endtime] = timeRange; if (starttime) filters.starttime = starttime; if (endtime) filters.endtime = endtime; } return filters; }, // 页码改变时处理函数 changePage(index = 1) { const filters = this.getFilters(); this.fetchList({ ...filters, pageNum: index, }); }, // 分页大小改变时处理函数 changeSizeHandle(pageSize) { const filters = this.getFilters(); this.fetchList({ ...filters, pageNum: 1, pageSize: pageSize, }); this.updatePagination({ pageNum: 1, pageSize: pageSize, }); }, // 当列表可选时 处理选择函数 handleSelectionChange(val) { this.selectedList = val; }, resetEditDialog(done) { if (typeof this.initSelected === 'function') { this.selected = this.initSelected(); } else { this.selected = {}; } done && typeof done == 'function' ? done() : (this.dialogEditVisible = false); }, resetDetailDialog(done) { if (typeof this.initSelected === 'function') { this.selected = this.initSelected(); } else { this.selected = {}; } done && typeof done == 'function' ? done() : (this.dialogEditVisible = false); }, }, };