|
@@ -1,18 +1,27 @@
|
|
<template>
|
|
<template>
|
|
- <el-dialog :title="dialogtitle" :visible.sync="dialogVisible" width="500px" :before-close="handleClose" center>
|
|
|
|
- <div class="upload">
|
|
|
|
- <div class="upload-left">导入文件</div>
|
|
|
|
- <el-upload class="upload-right" ref="upload" accept=".xls,.xlsx" :action="fileApi" :file-list="fileList" :data="fileData" :auto-upload="false" :on-success="onSuccess" :limit="1">
|
|
|
|
- <el-button slot="trigger" style="margin-right: 30px" size="small" type="primary">选择文件</el-button>
|
|
|
|
- <el-button size="small" type="success" @click="submitUpload">导入数据</el-button>
|
|
|
|
- <div slot="tip" class="el-upload__tip" style="margin-left: 10px; margin-top: 10px; font-size: 14px">只能导入 xls / xlsx 文件</div>
|
|
|
|
- </el-upload>
|
|
|
|
- </div>
|
|
|
|
- </el-dialog>
|
|
|
|
|
|
+ <div>
|
|
|
|
+ <el-dialog :title="dialogtitle" :visible.sync="dialogVisible" width="500px" :before-close="handleClose" center>
|
|
|
|
+ <div class="upload">
|
|
|
|
+ <div class="upload-left">导入文件</div>
|
|
|
|
+ <el-upload class="upload-right" ref="upload" accept=".xls,.xlsx" :action="fileApi" :file-list="fileList" :data="fileData" :auto-upload="false" :on-success="onSuccess" :limit="1">
|
|
|
|
+ <el-button slot="trigger" style="margin-right: 30px" size="small" type="primary">选择文件</el-button>
|
|
|
|
+ <el-button size="small" type="success" :loading="importLoading" @click="submitUpload">{{ importLoading ? '导入中' : '导入数据' }}</el-button>
|
|
|
|
+ <div slot="tip" class="el-upload__tip" style="margin-left: 10px; margin-top: 10px; font-size: 14px">只能导入 xls / xlsx 文件</div>
|
|
|
|
+ </el-upload>
|
|
|
|
+ </div>
|
|
|
|
+ </el-dialog>
|
|
|
|
+ <el-dialog title="导入结果" class="reaultDialog" :visible.sync="visible" width="800px" :before-close="visibleClose" center>
|
|
|
|
+ <div class="markdown" v-html="renderMarkdown()"></div>
|
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
|
+ <el-button type="primary" @click="visibleClose">确 定</el-button>
|
|
|
|
+ </span>
|
|
|
|
+ </el-dialog>
|
|
|
|
+ </div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
import { useMessage } from '@/utils/element-ui'
|
|
import { useMessage } from '@/utils/element-ui'
|
|
|
|
+import * as marked from 'marked'
|
|
export default {
|
|
export default {
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
@@ -22,7 +31,10 @@ export default {
|
|
fileList: [],
|
|
fileList: [],
|
|
fileData: {
|
|
fileData: {
|
|
userName: ''
|
|
userName: ''
|
|
- }
|
|
|
|
|
|
+ },
|
|
|
|
+ visible: false,
|
|
|
|
+ reaultMsg: '',
|
|
|
|
+ importLoading: false
|
|
}
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
@@ -36,6 +48,7 @@ export default {
|
|
|
|
|
|
// 上传
|
|
// 上传
|
|
submitUpload() {
|
|
submitUpload() {
|
|
|
|
+ this.importLoading = true
|
|
const userInfo = this.$store.state.user.userInfo.user
|
|
const userInfo = this.$store.state.user.userInfo.user
|
|
this.fileData.userName = userInfo.userName
|
|
this.fileData.userName = userInfo.userName
|
|
this.$refs.upload.submit()
|
|
this.$refs.upload.submit()
|
|
@@ -46,10 +59,31 @@ export default {
|
|
this.$refs.upload.clearFiles()
|
|
this.$refs.upload.clearFiles()
|
|
this.fileList = []
|
|
this.fileList = []
|
|
const { msg, code } = result
|
|
const { msg, code } = result
|
|
- useMessage(code == 200 ? 'success' : 'warning', msg, 2000)
|
|
|
|
- if (code !== 200) return
|
|
|
|
|
|
+ if (code == 200) {
|
|
|
|
+ this.reaultMsg = msg
|
|
|
|
+ this.visible = true
|
|
|
|
+ this.importLoading = false
|
|
|
|
+ } else {
|
|
|
|
+ this.$message({
|
|
|
|
+ type: 'warning',
|
|
|
|
+ message: msg
|
|
|
|
+ })
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ // useMessage(code == 200 ? 'success' : 'warning', msg, 2000)
|
|
|
|
+ // if (code !== 200) return
|
|
this.handleClose()
|
|
this.handleClose()
|
|
this.$emit('submitCallBack')
|
|
this.$emit('submitCallBack')
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ visibleClose() {
|
|
|
|
+ this.visible = false
|
|
|
|
+ this.reaultMsg = ''
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ renderMarkdown() {
|
|
|
|
+ const html = marked.parse(this.reaultMsg)
|
|
|
|
+ return html
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -66,4 +100,17 @@ export default {
|
|
margin-right: 40px;
|
|
margin-right: 40px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+::v-deep .reaultDialog .el-dialog__body {
|
|
|
|
+ color: #fff !important;
|
|
|
|
+}
|
|
|
|
+.markdown {
|
|
|
|
+ height: 500px;
|
|
|
|
+ overflow: auto;
|
|
|
|
+ -ms-overflow-style: none; /* 适用于 Internet Explorer 和旧版 Edge */
|
|
|
|
+ scrollbar-width: none; /* 适用于 Firefox */
|
|
|
|
+}
|
|
|
|
+.markdown::-webkit-scrollbar {
|
|
|
|
+ display: none;
|
|
|
|
+}
|
|
</style>
|
|
</style>
|