111
This commit is contained in:
parent
ce081b6e46
commit
09a89dc145
|
|
@ -1,59 +1,41 @@
|
|||
<template>
|
||||
<div class="tool-container">
|
||||
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="Excel文件" >
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove"
|
||||
:before-remove="beforeRemove"
|
||||
multiple
|
||||
:auto-upload="true"
|
||||
accept=".xlsx, .xls, .csv"
|
||||
method="get"
|
||||
:headers="upload.headers"
|
||||
:on-success="handleSuccess"
|
||||
:action="upload.url"
|
||||
:limit="1"
|
||||
:on-exceed="handleExceed"
|
||||
:file-list="fileList1">
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="图片压缩包文件" >
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove2"
|
||||
:before-remove="beforeRemove"
|
||||
:auto-upload="true"
|
||||
accept=".zip, .rar"
|
||||
method="get"
|
||||
:headers="upload.headers"
|
||||
:action="upload.url"
|
||||
:on-success="handleSuccess2"
|
||||
:limit="1"
|
||||
:on-exceed="handleExceed"
|
||||
:file-list="fileList2">
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<el-button type="text" @click="cancel">取消</el-button>
|
||||
<el-card class="box-card">
|
||||
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="Excel文件" label-width="180px">
|
||||
<el-upload class="upload-demo" :on-preview="handlePreview" :on-remove="handleRemove"
|
||||
:before-remove="beforeRemove" multiple :auto-upload="true" accept=".xlsx, .xls, .csv" method="get"
|
||||
:headers="upload.headers" :on-success="handleSuccess" :action="upload.url" :limit="1"
|
||||
:on-exceed="handleExceed" :file-list="fileList1">
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传xlsx/xls/csv文件，且不超过100M</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="图片压缩包文件" label-width="180px">
|
||||
<el-upload class="upload-demo" :on-preview="handlePreview" :on-remove="handleRemove2"
|
||||
:before-remove="beforeRemove" :auto-upload="true" accept=".zip, .rar" method="get"
|
||||
:headers="upload.headers" :action="upload.url" :on-success="handleSuccess2" :limit="1"
|
||||
:on-exceed="handleExceed" :file-list="fileList2">
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传zip文件，且不超过100M</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<div class="button-container">
|
||||
<el-button :loading="loading" type="primary" @click="download">图片处理</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { add, edit,processImage } from '@/api/DouyinGoodsInfo'
|
||||
import { add, edit, processImage } from '@/api/DouyinGoodsInfo'
|
||||
import { getToken } from "@/utils/auth";
|
||||
import { parseTime, downloadFile, parseDate } from '@/utils/index'
|
||||
|
||||
|
|
@ -61,19 +43,19 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
upload: {
|
||||
// 是否显示弹出层（用户导入）
|
||||
open: false,
|
||||
// 弹出层标题（用户导入）
|
||||
title: "",
|
||||
// 是否禁用上传
|
||||
isUploading: false,
|
||||
// 设置上传的请求头部
|
||||
headers: { Authorization: "Bearer " + getToken() },
|
||||
// 上传的地址
|
||||
url: "/api/DouyinGoodsInfo/saveFile"
|
||||
// 是否显示弹出层（用户导入）
|
||||
open: false,
|
||||
// 弹出层标题（用户导入）
|
||||
title: "",
|
||||
// 是否禁用上传
|
||||
isUploading: false,
|
||||
// 设置上传的请求头部
|
||||
headers: { Authorization: "Bearer " + getToken() },
|
||||
// 上传的地址
|
||||
url: "/api/DouyinGoodsInfo/saveFile"
|
||||
},
|
||||
fileList1: [],
|
||||
fileList2: [],
|
||||
fileList2: [],
|
||||
loading: false, dialog: false,
|
||||
params: {},
|
||||
form: {
|
||||
|
|
@ -102,22 +84,22 @@ export default {
|
|||
this.loading = false
|
||||
})
|
||||
},
|
||||
handleRemove(file, fileList) {
|
||||
console.log(file, fileList);
|
||||
this.params['excelFileName'] = '';
|
||||
handleRemove(file, fileList) {
|
||||
console.log(file, fileList);
|
||||
this.params['excelFileName'] = '';
|
||||
},
|
||||
handleRemove2(file, fileList) {
|
||||
console.log(file, fileList);
|
||||
this.params['zipFileName'] = '';
|
||||
},
|
||||
handlePreview(file) {
|
||||
console.log(file);
|
||||
},
|
||||
handleExceed(files, fileList) {
|
||||
this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
|
||||
},
|
||||
beforeRemove(file, fileList) {
|
||||
return this.$confirm(`确定移除 ${ file.name }？`);
|
||||
handleRemove2(file, fileList) {
|
||||
console.log(file, fileList);
|
||||
this.params['zipFileName'] = '';
|
||||
},
|
||||
handlePreview(file) {
|
||||
console.log(file);
|
||||
},
|
||||
handleExceed(files, fileList) {
|
||||
this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
|
||||
},
|
||||
beforeRemove(file, fileList) {
|
||||
return this.$confirm(`确定移除 ${file.name}？`);
|
||||
},
|
||||
handleSuccess(response, file, fileList) {
|
||||
this.params['excelFileName'] = file.name;
|
||||
|
|
@ -131,7 +113,19 @@ export default {
|
|||
|
||||
<style scoped>
|
||||
.tool-container {
|
||||
|
||||
}
|
||||
.box-card {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center; /* 水平居中 */
|
||||
align-items: center; /* 垂直居中（如果需要） */
|
||||
}
|
||||
.button-container {
|
||||
margin: 10px;
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
justify-content: center; /* 水平居中 */
|
||||
align-items: center; /* 垂直居中（如果需要） */
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user