| | |
| | | <template> |
| | | <el-dialog :title="title" :visible.sync="visible" width="600px" @open="open" |
| | | :close-on-click-modal="false" append-to-body> |
| | | <el-dialog |
| | | :title="title" |
| | | :visible.sync="visible" |
| | | width="600px" |
| | | @open="open" |
| | | :close-on-click-modal="false" |
| | | append-to-body |
| | | > |
| | | <el-form ref="form" :model="form" :rules="rules" label-width="120px"> |
| | | <el-form-item label="批次号" prop="batchNumber"> |
| | | <el-input :disabled="batchNumber" v-model="form.batchNumber" placeholder="请输入" clearable></el-input> |
| | | <el-input |
| | | :disabled="batchNumber" |
| | | v-model="form.batchNumber" |
| | | placeholder="请输入" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | <div> |
| | | <el-form-item label="导入资金表" prop="assetFile" v-if="type != 2"> |
| | | <el-upload class="upload-container" action="#" drag :auto-upload="false" accept=".xlsx,.xls" |
| | | :on-change="handlehouseholdFileChangePrice" :limit="1"> |
| | | <el-upload |
| | | class="upload-container" |
| | | action="#" |
| | | drag |
| | | :auto-upload="false" |
| | | accept=".xlsx,.xls" |
| | | :on-change="handlehouseholdFileChangePrice" |
| | | :limit="1" |
| | | > |
| | | <div class="upload-area"> |
| | | <i class="el-icon-folder"></i> |
| | | <div class="upload-text">点击或将文件文件拖拽到这里上传</div> |
| | | <div class="upload-tip">支持格式:.xlsx、.xls...</div> |
| | | </div> |
| | | <div slot="tip" class="el-upload__tip"> |
| | | 已上传: |
| | | </div> |
| | | <div slot="tip" class="el-upload__tip">已上传:</div> |
| | | </el-upload> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="导入购房表" prop="householdFile" v-if="type != 1"> |
| | | <el-upload class="upload-container" action="#" drag :auto-upload="false" accept=".xlsx,.xls" |
| | | :on-change="handlehouseholdFileChange" :limit="1"> |
| | | <el-upload |
| | | class="upload-container" |
| | | action="#" |
| | | drag |
| | | :auto-upload="false" |
| | | accept=".xlsx,.xls" |
| | | :on-change="handlehouseholdFileChange" |
| | | :limit="1" |
| | | > |
| | | <div class="upload-area"> |
| | | <i class="el-icon-folder"></i> |
| | | <div class="upload-text">点击或将文件文件拖拽到这里上传</div> |
| | | <div class="upload-tip">支持格式:.xlsx、.xls...</div> |
| | | </div> |
| | | <div slot="tip" class="el-upload__tip"> |
| | | 已上传: |
| | | </div> |
| | | <div slot="tip" class="el-upload__tip">已上传:</div> |
| | | </el-upload> |
| | | </el-form-item> |
| | | </div> |
| | | </el-form> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button @click="handleCancel">取 消</el-button> |
| | | <el-button type="primary" @click="handleSubmit" :loading="loading">确 认</el-button> |
| | | <el-button type="primary" @click="handleSubmit" :loading="loading" |
| | | >确 认</el-button |
| | | > |
| | | </div> |
| | | </el-dialog> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'ExportMoneyApplay', |
| | | name: "ExportMoneyApplay", |
| | | props: { |
| | | visible: { |
| | | type: Boolean, |
| | | default: false |
| | | default: false, |
| | | }, |
| | | type: { |
| | | type: Number, |
| | | default: 3 |
| | | default: 3, |
| | | }, |
| | | title: { |
| | | type: String, |
| | | default: '导入自主购房安置资金申请' |
| | | default: "导入自主购房安置资金申请", |
| | | }, |
| | | batchNumber: { |
| | | type: String, |
| | | default: '' |
| | | } |
| | | default: "", |
| | | }, |
| | | }, |
| | | data() { |
| | | return { |
| | | loading: false, |
| | | uploadUrl: '/api/upload', // 上传地址 |
| | | uploadUrl: "/api/upload", // 上传地址 |
| | | form: { |
| | | batchNumber: '', |
| | | assetFile: '', |
| | | householdFile: '' |
| | | batchNumber: "", |
| | | assetFile: "", |
| | | householdFile: "", |
| | | }, |
| | | rules: { |
| | | batchNumber: [ |
| | | { required: true, message: '请输入批次号', trigger: 'blur' } |
| | | { required: true, message: "请输入批次号", trigger: "blur" }, |
| | | ], |
| | | assetFile: [ |
| | | { required: true, message: '请上传资金表', trigger: 'change' } |
| | | { required: true, message: "请上传资金表", trigger: "change" }, |
| | | ], |
| | | householdFile: [ |
| | | { required: true, message: '请上传购房表', trigger: 'change' } |
| | | ] |
| | | { required: true, message: "请上传购房表", trigger: "change" }, |
| | | ], |
| | | }, |
| | | } |
| | | }; |
| | | }, |
| | | methods: { |
| | | open() { |
| | | console.log('333333333333333333',this.batchNumber) |
| | | this.form.batchNumber = JSON.parse(JSON.stringify(this.batchNumber)) |
| | | console.log("333333333333333333", this.batchNumber); |
| | | this.form.batchNumber = JSON.parse(JSON.stringify(this.batchNumber)); |
| | | }, |
| | | handlehouseholdFileChange(file, fileList) { |
| | | this.form.householdFile = file.raw |
| | | this.$refs.form.validateField('householdFile') |
| | | |
| | | this.form.householdFile = file.raw; |
| | | this.$refs.form.validateField("householdFile"); |
| | | }, |
| | | handlehouseholdFileChangePrice(file, fileList) { |
| | | this.form.assetFile = file.raw |
| | | this.$refs.form.validateField('assetFile') |
| | | this.form.assetFile = file.raw; |
| | | this.$refs.form.validateField("assetFile"); |
| | | }, |
| | | // 移除文件 |
| | | handleRemoveFile(file, type) { |
| | | if (type === 'money') { |
| | | this.form.assetFile = '' |
| | | this.$refs.form.validateField('assetFile') |
| | | if (type === "money") { |
| | | this.form.assetFile = ""; |
| | | this.$refs.form.validateField("assetFile"); |
| | | } else { |
| | | this.form.householdFile = '' |
| | | this.$refs.form.validateField('householdFile') |
| | | this.form.householdFile = ""; |
| | | this.$refs.form.validateField("householdFile"); |
| | | } |
| | | }, |
| | | // 取消 |
| | | handleCancel() { |
| | | this.$emit('update:visible', false) |
| | | this.resetForm() |
| | | this.$emit("update:visible", false); |
| | | this.resetForm(); |
| | | }, |
| | | // 提交 |
| | | handleSubmit() { |
| | | this.$refs.form.validate(valid => { |
| | | this.$refs.form.validate((valid) => { |
| | | if (valid) { |
| | | this.loading = true |
| | | this.$emit('importPrice', this.form) |
| | | this.loading = true; |
| | | if (this.type == 2) { |
| | | delete this.form.assetFile; |
| | | } |
| | | this.$emit("importPrice", this.form); |
| | | setTimeout(() => { |
| | | this.loading = false |
| | | this.resetForm() |
| | | }, 1000) |
| | | this.loading = false; |
| | | this.resetForm(); |
| | | }, 1000); |
| | | } |
| | | }) |
| | | }); |
| | | }, |
| | | // 重置表单 |
| | | resetForm() { |
| | | this.form = { |
| | | batchNumber: '', |
| | | assetFile: '', |
| | | householdFile: '' |
| | | } |
| | | this.$refs.form && this.$refs.form.resetFields() |
| | | } |
| | | } |
| | | } |
| | | batchNumber: "", |
| | | assetFile: "", |
| | | householdFile: "", |
| | | }; |
| | | this.$refs.form && this.$refs.form.resetFields(); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | |
| | | color: #666; |
| | | |
| | | &:hover { |
| | | border-color: #409EFF; |
| | | border-color: #409eff; |
| | | } |
| | | |
| | | .el-icon-folder { |