index.vue 3.83 KB
<template>
    <div class="app-container">
      	<el-form
            :inline="true"
            :model="listQuery"
            size="small"
            class="qg-search-form"
        >
       <el-form-item label="书本编号"  >
         <el-input v-model="listQuery.code" clearable />
      </el-form-item>
         	<el-form-item label=" ">
                <el-button type="primary" @click="handleSearch">查询</el-button>
            </el-form-item>
        </el-form>
        <el-row class="opt-bar">
            <el-button type="primary" @click="handleAdd">新增</el-button>
            <el-button type="default">导入</el-button>
            <el-button type="default" @click="handleExport">导出</el-button>
            <el-button type="default" @click="handleBatchDel">批量删除</el-button>
        </el-row>
        <qg-table
            ref="bookListTable"
            :columns="tableColumns"
            :param="listQuery"
            :request="listRequest"
        />
    </div>
</template>

<script>
    import {bookBatchDelete, bookPage} from '@/api/moudles/xieyunhui/book';
    import {bookSearchModel, tableColumns, componentsData} from './config.js';
    import {deepClone, postExcelFile} from '@/utils';
    import {getToken} from '@/utils/auth'
             
    export default {
        name: 'BookTable',
        data() {
            return {
                tableColumns: tableColumns.bind(this)(),
                listRequest: bookPage,
                listQuery: deepClone(bookSearchModel),
                componentsData
            };
        },
        created() {
        },
        methods: {
            handleSearch() {
                this.$refs.bookListTable.load();
            },
            handleAdd() {
                this.$router.push({name: `bookAdd`});
            },
            handleBatchDel: function () {
                const {ids} = this.$refs.bookListTable.getSelections();
                if(!ids && ids.length ===0){
                  this.$message.info('请先选择数据');
                  return;
                }
                this.$confirm('你确定要删除所选数据吗?').then(() => {
                  const request = bookBatchDelete(ids);
                  this.operate(request, true);      
                }).catch(() => {
                });
            },
            handleExport: function () {
                const url = process.env.VUE_APP_BASE_API + `/qgyun-xieyunhui/book/export?_token=` + getToken();
                postExcelFile(Object.assign({}, this.listQuery), url);
            },                                       
            handleOpt(type, params) {
                let request = null;
                switch (type) {
                case 'VIEW':
                    this.$router.push({name: `bookDetail`, query: {id: params.id}});
                    return;
                case 'DELETE':
                    this.$confirm('你确定要删除该数据吗?').then(() => {
                    request = bookBatchDelete([params.id]);
                      this.operate(request, true);            
                    }).catch(() => {
                    });
                    return;      
                case 'EDIT':
                    this.$router.push({name: `bookEdit`, query: {id: params.id}});
                    return;
                }
            },
            operate(request, isReloadList) {
                if (!request) {
                    return;
                }
                request.then(res => {
                  if (res.success) {
					this.$message.success(res.msg || '操作成功');
                    if (isReloadList) {
                        this.$refs.bookListTable.refresh();
                    }
                  }else{
                    this.$message.error(res.msg || '操作失败!');
                  }
                });
            }
        }
    };
</script>