<script setup lang="ts">
|
import { message } from "@/utils/message";
|
|
defineOptions({
|
name: "ReUploadZ"
|
});
|
const props = defineProps({
|
// 行数
|
imgUrl: {
|
type: String
|
}
|
});
|
const handleChange = file => {
|
console.log(file);
|
|
if (file.status !== "ready") return;
|
let suffName = file.name.substring(file.name.lastIndexOf(".") + 1);
|
const extension = suffName === "pdf";
|
// const isLt10M = file.size / 1024 / 1024 < 10;
|
if (!extension) {
|
message(`仅支持pdf格式，请上传pdf`, {
|
type: "error"
|
});
|
validateForm.fileList = [];
|
return false;
|
}
|
fetchCredentials(file);
|
// upload.value!.submit();
|
};
|
// state.formDataNew = {
|
// policy: res.result.policy, //表单域
|
// "x-oss-signature-version": res.result.x_oss_signature_version, //指定签名的版本和算法
|
// "x-oss-credential": res.result.x_oss_credential, //指明派生密钥的参数集
|
// "x-oss-date": res.result.x_oss_date, //请求的时间
|
// "x-oss-signature": res.result.signature, //签名认证描述信息
|
// "x-oss-security-token": res.result.security_token, //安全令牌
|
// success_action_status: "200" //上传成功后响应状态码
|
// };
|
const fetchCredentials = async file => {
|
// 这里应调用你自己的后端接口获取临时凭证
|
let res = await getUploadToken();
|
if (res.code == 200) {
|
let keyVal = generateTimestampWithRandom(res.result.DirPath, file.name);
|
let upUrl = res.result.url;
|
let upPath = res.result.DirPath;
|
let formData = new FormData();
|
formData.append("policy", res.result.policy);
|
formData.append(
|
"x-oss-signature-version",
|
res.result.x_oss_signature_version
|
);
|
formData.append("x-oss-credential", res.result.x_oss_credential);
|
formData.append("x-oss-date", res.result.x_oss_date);
|
// formData.append("Signature", res.result.signature);
|
formData.append("x-oss-signature", res.result.signature);
|
formData.append("x-oss-security-token", res.result.security_token);
|
// formData.append("x-oss-content-type", "application/pdf");
|
formData.append("success_action_status", "200");
|
formData.append("key", keyVal); // 文件名
|
formData.append("file", file.raw); // file 必须为最后一个表单域
|
uploadFileAli(formData, res.result.url).then(res => {
|
let path = `${upUrl}"/"${upPath}${upPath};`;
|
if (props.isChange) {
|
newFormInline.value.biangengwenjian = path;
|
} else {
|
newFormInline.value.zhaobiaowenjian = path;
|
}
|
});
|
}
|
};
|
</script>
|
|
<template>
|
<div>
|
<el-upload
|
ref="upload"
|
:show-file-list="false"
|
:limit="1"
|
:auto-upload="false"
|
:headers="state.headers"
|
accept=".pdf"
|
@change="handleChange"
|
>
|
<img v-if="imgUrl" :src="imgUrl" width="85.6px" height="5.4px" />
|
<el-button v-else type="primary">上传</el-button>
|
</el-upload>
|
</div>
|
</template>
|
|
<style lang="scss" scoped></style>
|
