98 lines
1.6 KiB
Vue
98 lines
1.6 KiB
Vue
|
<template>
|
||
|
|
<view>
|
||
|
|
<u-form-item
|
||
|
|
:label="label"
|
||
|
|
:label-position="labelPosition"
|
||
|
|
:prop="prop"
|
||
|
|
:required="required"
|
||
|
|
>
|
||
|
|
<u-upload
|
||
|
|
:file-list="modelValue"
|
||
|
|
:multiple="multiple"
|
||
|
|
:max-count="maxCount"
|
||
|
|
width="79"
|
||
|
|
height="79"
|
||
|
|
useBeforeRead
|
||
|
|
:accept="accept"
|
||
|
|
@afterRead="fnAfterRead"
|
||
|
|
@delete="fnDelete"
|
||
|
|
/>
|
||
|
|
</u-form-item>
|
||
|
|
<u-line />
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { setFileDelete } from "@/api";
|
||
|
|
|
||
|
|
export default {
|
||
|
|
props: {
|
||
|
|
label: {
|
||
|
|
type: String,
|
||
|
|
default: "图片",
|
||
|
|
},
|
||
|
|
labelPosition: {
|
||
|
|
type: String,
|
||
|
|
default: "top",
|
||
|
|
},
|
||
|
|
prop: {
|
||
|
|
type: String,
|
||
|
|
default: "",
|
||
|
|
},
|
||
|
|
required: {
|
||
|
|
type: Boolean,
|
||
|
|
default: true,
|
||
|
|
},
|
||
|
|
multiple: {
|
||
|
|
type: Boolean,
|
||
|
|
default: true,
|
||
|
|
},
|
||
|
|
maxCount: {
|
||
|
|
type: Number,
|
||
|
|
default: 4,
|
||
|
|
},
|
||
|
|
accept: {
|
||
|
|
type: String,
|
||
|
|
default: "image",
|
||
|
|
},
|
||
|
|
modelValue: {
|
||
|
|
type: Array,
|
||
|
|
required: true,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
|
||
|
|
data() {
|
||
|
|
return {};
|
||
|
|
},
|
||
|
|
|
||
|
|
methods: {
|
||
|
|
fnAfterRead({ file, index, name }) {
|
||
|
|
if (this.multiple) {
|
||
|
|
// 多选图片
|
||
|
|
this.modelValue.push(...file);
|
||
|
|
} else {
|
||
|
|
// 单选图片
|
||
|
|
this.modelValue.push(file);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
async fnDelete({ file, index, name }) {
|
||
|
|
uni.showModal({
|
||
|
|
title: "提示",
|
||
|
|
content: this.accept === "image" ? "是否删除该图片" : "是否删除该视频",
|
||
|
|
success: async (res) => {
|
||
|
|
if (res.confirm) {
|
||
|
|
if (file.IMGFILES_ID) {
|
||
|
|
await setFileDelete({ IMGFILES_ID: event.file.IMGFILES_ID });
|
||
|
|
}
|
||
|
|
this.modelValue.splice(index, 1);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
fail: (err) => reject(err),
|
||
|
|
});
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss"></style>
|