| | |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="info" |
| | | plain |
| | | icon="el-icon-upload2" |
| | | size="mini" |
| | | @click="handleImport" |
| | | v-hasPermi="['demo:demo:import']" |
| | | >导入(校验)</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="warning" |
| | | plain |
| | | icon="el-icon-download" |
| | | size="mini" |
| | | :loading="exportLoading" |
| | | @click="handleExport" |
| | | v-hasPermi="['demo:demo:export']" |
| | | >导出</el-button> |
| | |
| | | <el-button @click="cancel">取 消</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | <!-- 用户导入对话框 --> |
| | | <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body> |
| | | <el-upload |
| | | ref="upload" |
| | | :limit="1" |
| | | accept=".xlsx, .xls" |
| | | :headers="upload.headers" |
| | | :action="upload.url + '?updateSupport=' + upload.updateSupport" |
| | | :disabled="upload.isUploading" |
| | | :on-progress="handleFileUploadProgress" |
| | | :on-success="handleFileSuccess" |
| | | :auto-upload="false" |
| | | drag |
| | | > |
| | | <i class="el-icon-upload"></i> |
| | | <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div> |
| | | </el-upload> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button type="primary" @click="submitFileForm">确 定</el-button> |
| | | <el-button @click="upload.open = false">取 消</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { listDemo, pageDemo, getDemo, delDemo, addDemo, updateDemo } from "@/api/demo/demo"; |
| | | import {getToken} from "@/utils/auth"; |
| | | |
| | | export default { |
| | | name: "Demo", |
| | |
| | | buttonLoading: false, |
| | | // 遮罩层 |
| | | loading: true, |
| | | // 导出遮罩层 |
| | | exportLoading: false, |
| | | // 选中数组 |
| | | ids: [], |
| | | // 非单个禁用 |
| | |
| | | open: false, |
| | | // 创建时间时间范围 |
| | | daterangeCreateTime: [], |
| | | // 用户导入参数 |
| | | upload: { |
| | | // 是否显示弹出层(用户导入) |
| | | open: false, |
| | | // 弹出层标题(用户导入) |
| | | title: "", |
| | | // 是否禁用上传 |
| | | isUploading: false, |
| | | // 设置上传的请求头部 |
| | | headers: { Authorization: "Bearer " + getToken() }, |
| | | // 上传的地址 |
| | | url: process.env.VUE_APP_BASE_API + "/demo/demo/importData" |
| | | }, |
| | | // 查询参数 |
| | | queryParams: { |
| | | pageNum: 1, |
| | |
| | | this.loading = false; |
| | | }); |
| | | }, |
| | | /** 导入按钮操作 */ |
| | | handleImport() { |
| | | this.upload.title = "用户导入"; |
| | | this.upload.open = true; |
| | | }, |
| | | /** 导出按钮操作 */ |
| | | handleExport() { |
| | | this.$download.excel('/demo/demo/export', this.queryParams); |
| | | this.download('demo/demo/export', { |
| | | ...this.queryParams |
| | | }, `demo_${new Date().getTime()}.xlsx`) |
| | | }, |
| | | // 文件上传中处理 |
| | | handleFileUploadProgress(event, file, fileList) { |
| | | this.upload.isUploading = true; |
| | | }, |
| | | // 文件上传成功处理 |
| | | handleFileSuccess(response, file, fileList) { |
| | | this.upload.open = false; |
| | | this.upload.isUploading = false; |
| | | this.$refs.upload.clearFiles(); |
| | | this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true }); |
| | | this.getList(); |
| | | }, |
| | | // 提交上传文件 |
| | | submitFileForm() { |
| | | this.$refs.upload.submit(); |
| | | } |
| | | } |
| | | }; |