| @ -0,0 +1,122 @@ | |||
| <template> | |||
| <div> | |||
| <!-- 解锁弹窗 --> | |||
| <el-dialog :title="$t('page.business.resource.gsp.dr')" :visible.sync="open" width="400px" append-to-body | |||
| :close-on-click-modal="false"> | |||
| <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">{{ $t('page.business.resource.gsp.tzsc') }}<em>{{ $t('page.business.resource.gsp.djsc') }}</em></div> | |||
| <div class="el-upload__tip text-center" slot="tip"> | |||
| <span>{{ $t('page.business.resource.gsp.wjgs') }}</span> | |||
| <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" | |||
| @click="importTemplate">{{ $t('page.business.resource.gsp.xzmb') }}</el-link> | |||
| </div> | |||
| </el-upload> | |||
| <div slot="footer" class="dialog-footer"> | |||
| <el-button type="primary" @click="submitFileForm">{{ $t('form.confirm') }}</el-button> | |||
| <el-button @click="cancel">{{ $t('form.cancel') }}</el-button> | |||
| </div> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import { js } from "@/api/business/gsp/gspRkjl" | |||
| import { mapGetters } from 'vuex' | |||
| import { getToken } from "@/utils/auth" | |||
| export default { | |||
| name: "Js", | |||
| data() { | |||
| return { | |||
| open: false, | |||
| form: {}, | |||
| rules: { | |||
| qmrmm: [{ | |||
| required: true, | |||
| message: ' ', | |||
| trigger: 'blur' | |||
| }] | |||
| }, | |||
| upload: { | |||
| // 是否显示弹出层(用户导入) | |||
| open: false, | |||
| // 弹出层标题(用户导入) | |||
| title: "", | |||
| // 是否禁用上传 | |||
| isUploading: false, | |||
| // 是否更新已经存在的用户数据 | |||
| updateSupport: 0, | |||
| // 设置上传的请求头部 | |||
| headers: { Authorization: "Bearer " + getToken() }, | |||
| // 上传的地址 | |||
| url: process.env.VUE_APP_BASE_API + "/business/gspRkjl/importData" | |||
| }, | |||
| } | |||
| }, | |||
| computed: { | |||
| ...mapGetters([ | |||
| 'nickName' | |||
| ]), | |||
| }, | |||
| created() { | |||
| }, | |||
| methods: { | |||
| // 下载模板 | |||
| importTemplate() { | |||
| this.download('business/gspRkjl/importTemplate', { | |||
| }, `【模板】供试品入库记录.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("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true }) | |||
| this.getList() | |||
| }, | |||
| // 提交上传文件 | |||
| submitFileForm() { | |||
| const file = this.$refs.upload.uploadFiles | |||
| if (!file || file.length === 0 || !file[0].name.toLowerCase().endsWith('.xls') && !file[0].name.toLowerCase().endsWith('.xlsx')) { | |||
| this.$modal.msgError("请选择后缀为 “xls”或“xlsx”的文件。") | |||
| return | |||
| } | |||
| this.$refs.upload.submit() | |||
| }, | |||
| cancel() { | |||
| this.open = false | |||
| }, | |||
| reset() { | |||
| this.form = { | |||
| id: null, | |||
| ids: null, | |||
| mc: null, | |||
| bh: null, | |||
| qmyy: this.$t('page.business.resource.gsp.jsgsprkjl'), | |||
| qmrmm: null | |||
| } | |||
| this.resetForm("form") | |||
| }, | |||
| show() { | |||
| this.reset() | |||
| this.open = true | |||
| }, | |||
| save() { | |||
| this.$refs["form"].validate(valid => { | |||
| if (valid) { | |||
| js(this.form).then(response => { | |||
| this.open = false | |||
| this.$emit('callback') | |||
| }) | |||
| } | |||
| }) | |||
| } | |||
| } | |||
| } | |||
| </script> | |||