all
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
import { w as withInstall } from "../badge/index2.js";
|
||||
import { defineComponent, computed, useSlots, getCurrentInstance, watch, ref, onMounted, nextTick, onUnmounted, openBlock, createElementBlock, normalizeClass, createElementVNode, withModifiers, unref, renderSlot, createBlock, withCtx, createTextVNode, toDisplayString, createVNode, Fragment, renderList } from "vue";
|
||||
import { I as ImageCompressor } from "../_chunks/js-image-compressor/index.js";
|
||||
import { a as _sfc_main$2, l as layer } from "../_chunks/@layui/index.js";
|
||||
import { t as templateRef } from "../_chunks/@vueuse/index.js";
|
||||
import { _ as _sfc_main$1 } from "../button/index2.js";
|
||||
@@ -53,7 +54,9 @@ const _sfc_main = defineComponent({
|
||||
text: null,
|
||||
dragText: null,
|
||||
modelValue: { default: null },
|
||||
auto: { type: Boolean, default: true }
|
||||
auto: { type: Boolean, default: true },
|
||||
sizeOutMsg: null,
|
||||
quality: null
|
||||
},
|
||||
emits: [
|
||||
"choose",
|
||||
@@ -67,13 +70,34 @@ const _sfc_main = defineComponent({
|
||||
],
|
||||
setup(__props, { emit }) {
|
||||
const props = __props;
|
||||
function imgcomp(file) {
|
||||
return new Promise((resolve, reject) => {
|
||||
var options = {
|
||||
file,
|
||||
quality: props.quality,
|
||||
mimeType: "image/jpeg",
|
||||
maxWidth: 2e3,
|
||||
maxHeight: 2e3,
|
||||
convertSize: Infinity,
|
||||
loose: true,
|
||||
redressOrientation: true,
|
||||
success: function(result) {
|
||||
resolve(result);
|
||||
}
|
||||
};
|
||||
new ImageCompressor(options);
|
||||
});
|
||||
}
|
||||
const getCutDownResult = () => {
|
||||
if (_cropper) {
|
||||
const canvas = _cropper.getCroppedCanvas();
|
||||
let imgData = canvas.toDataURL('"image/png"');
|
||||
let currentTimeStamp = new Date().valueOf();
|
||||
let orgInfo = activeUploadFiles.value[0];
|
||||
emit("cutdone", Object.assign({ currentTimeStamp, cutResult: imgData, orginal: orgInfo }));
|
||||
emit(
|
||||
"cutdone",
|
||||
Object.assign({ currentTimeStamp, cutResult: imgData, orginal: orgInfo })
|
||||
);
|
||||
let newFile = dataURLtoFile(imgData);
|
||||
if (!props.auto) {
|
||||
emit("update:modelValue", [newFile]);
|
||||
@@ -138,11 +162,14 @@ const _sfc_main = defineComponent({
|
||||
const slot = useSlots();
|
||||
slot.default && slot.default();
|
||||
getCurrentInstance();
|
||||
watch(() => props.modelValue, () => {
|
||||
if (!props.modelValue) {
|
||||
clearAllCutEffect();
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
() => {
|
||||
if (!props.modelValue) {
|
||||
clearAllCutEffect();
|
||||
}
|
||||
}
|
||||
});
|
||||
);
|
||||
const isDragEnter = ref(false);
|
||||
const activeUploadFiles = ref([]);
|
||||
const activeUploadFilesImgs = ref([]);
|
||||
@@ -150,12 +177,14 @@ const _sfc_main = defineComponent({
|
||||
let _cropper = null;
|
||||
let computedCutLayerOption;
|
||||
if (props.cutOptions && props.cutOptions.layerOption) {
|
||||
computedCutLayerOption = computed(() => Object.assign(defaultCutLayerOption, props.cutOptions.layerOption));
|
||||
computedCutLayerOption = computed(
|
||||
() => Object.assign(defaultCutLayerOption, props.cutOptions.layerOption)
|
||||
);
|
||||
} else {
|
||||
computedCutLayerOption = computed(() => defaultCutLayerOption.value);
|
||||
}
|
||||
const innerCutVisible = ref(false);
|
||||
const localUploadTransaction = (option) => {
|
||||
const localUploadTransaction = async (option) => {
|
||||
const { url, files } = option;
|
||||
let formData = new FormData();
|
||||
if (url.length <= 5) {
|
||||
@@ -165,7 +194,13 @@ const _sfc_main = defineComponent({
|
||||
if (Array.isArray(files) && files.length > 0) {
|
||||
for (let i = 0; i < files.length; i++) {
|
||||
let _file = files[i];
|
||||
formData.append(props.field + "[" + i + "]", _file);
|
||||
let f;
|
||||
if (props.quality) {
|
||||
f = await imgcomp(_file);
|
||||
} else {
|
||||
f = _file;
|
||||
}
|
||||
formData.append(props.field + "[" + i + "]", f);
|
||||
}
|
||||
}
|
||||
if (props.data && props.data instanceof Object) {
|
||||
@@ -197,7 +232,7 @@ const _sfc_main = defineComponent({
|
||||
const errorF = (errorText) => {
|
||||
let currentTimeStamp = new Date().valueOf();
|
||||
let errorMsg = errorText ? errorText : defaultErrorMsg;
|
||||
errorMsg = `layui-vue:${errorMsg}`;
|
||||
errorMsg = `${errorMsg}`;
|
||||
console.warn(errorMsg);
|
||||
layer.msg(errorMsg, { icon: 2, time: 1e3 }, function(res) {
|
||||
});
|
||||
@@ -213,7 +248,10 @@ const _sfc_main = defineComponent({
|
||||
if (xhr.readyState === 1) {
|
||||
if (xhr.status >= 200 && xhr.status <= 300 || xhr.status === 304 || xhr.status == 0) {
|
||||
let successText = startUploadMsg.value;
|
||||
emit("before", Object.assign({ currentTimeStamp: currentTimeStamp2, msg: successText, ...option }));
|
||||
emit(
|
||||
"before",
|
||||
Object.assign({ currentTimeStamp: currentTimeStamp2, msg: successText, ...option })
|
||||
);
|
||||
}
|
||||
} else if (xhr.readyState === 4) {
|
||||
let successText = xhr.responseText ? xhr.responseText : uploadSuccess;
|
||||
@@ -258,7 +296,7 @@ const _sfc_main = defineComponent({
|
||||
let _file = _files[i];
|
||||
let _size = _file.size;
|
||||
if (_size > props.size * 1024) {
|
||||
errorF(occurFileSizeErrorMsg.value);
|
||||
errorF(props.sizeOutMsg || occurFileSizeErrorMsg.value);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user