| @ -0,0 +1,158 @@ | |||
| <template> | |||
| <div> | |||
| <!-- 存储位置导入 --> | |||
| <el-dialog :title="$t('page.business.resource.gsp.dr')" :visible.sync="open" width="600px" append-to-body | |||
| :close-on-click-modal="false"> | |||
| <el-form ref="form" :model="form" :rules="rules" label-width="100px"> | |||
| <el-row> | |||
| <el-col :span="24"> | |||
| <el-upload ref="upload" :data="form" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" | |||
| :action="upload.url" :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> | |||
| </el-col> | |||
| </el-row> | |||
| <el-row style="margin-top: 30px;"> | |||
| <el-col :span="12"> | |||
| <el-form-item :label="$t('form.qmyy')" prop="qmyy"> | |||
| <el-input type="text" :value="form.qmyy" maxlength="50" disabled | |||
| :placeholder="$t('form.placeholderInput')" /> | |||
| </el-form-item> | |||
| </el-col> | |||
| <el-col :span="12"> | |||
| <el-form-item :label="$t('form.signer')"> | |||
| <el-input type="text" v-model="nickName" maxlength="50" disabled | |||
| :placeholder="$t('form.placeholderInput')" /> | |||
| </el-form-item> | |||
| </el-col> | |||
| </el-row> | |||
| <el-row> | |||
| <el-col :span="24"> | |||
| <el-form-item :label="$t('form.signerPsw')" prop="qmrmm"> | |||
| <div class="sbzdtcma"> <input type="text"></div> | |||
| <el-input type="password" @contextmenu.native.prevent @copy.native.prevent @cut.native.prevent v-model="form.qmrmm" show-password maxlength="20" | |||
| :placeholder="$t('form.placeholderInput')" /> | |||
| </el-form-item> | |||
| </el-col> | |||
| </el-row> | |||
| <!-- <el-row> | |||
| <el-col :span="24"> | |||
| <el-form-item :label="$t('form.remark')" prop="qmbz"> | |||
| <el-input type="textarea" v-model="form.qmbz" :rows="2" maxlength="500" | |||
| :placeholder="$t('form.placeholderInput')"> | |||
| </el-input> | |||
| </el-form-item> | |||
| </el-col> | |||
| </el-row> --> | |||
| </el-form> | |||
| <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 { mapGetters } from 'vuex' | |||
| import { getToken } from "@/utils/auth" | |||
| export default { | |||
| name: "StorageLocationImport", | |||
| data() { | |||
| return { | |||
| open: false, | |||
| form: { | |||
| qmrmm: null, | |||
| qmbz: null | |||
| }, | |||
| 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 + "/system/business/storageLocation/importData" | |||
| }, | |||
| } | |||
| }, | |||
| computed: { | |||
| ...mapGetters([ | |||
| 'nickName' | |||
| ]), | |||
| }, | |||
| created() { | |||
| }, | |||
| methods: { | |||
| // 下载模板 | |||
| importTemplate() { | |||
| this.download('/system/business/storageLocation/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.$emit('callback') | |||
| }, | |||
| // 提交上传文件 | |||
| 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.upload.isUploading = false | |||
| this.$refs.upload.clearFiles() | |||
| this.open = false | |||
| }, | |||
| reset() { | |||
| this.form = { | |||
| qmyy: this.$t('page.system.storageLocation.addStroageLocation'), | |||
| qmrmm: null | |||
| } | |||
| this.resetForm("form") | |||
| }, | |||
| show() { | |||
| this.reset() | |||
| this.open = true | |||
| }, | |||
| } | |||
| } | |||
| </script> | |||
| <style rel="stylesheet/scss" lang="scss" scoped> | |||
| ::v-deep .el-upload-dragger { | |||
| width: 560px; | |||
| } | |||
| </style> | |||