新增教师节

src/components/Grateful/ToolUpload.vue

@@ -0,0 +1,87 @@
+<template>
+    <a-upload :file-list="files" :action="url" :show-upload-list="showUploadList" :multiple="multiple"
+        :before-upload="beforeUpload" :headers="headers" @change="handleChange" ref="imageRef" :data="{ ...params }">
+        <template v-for="(_, key, index) in $slots" :key="index" v-slot:[key]>
+            <slot :name="key"></slot>
+        </template>
+    </a-upload>
+</template>
+<script setup>
+import { defineProps, defineEmits, defineExpose, ref, watch } from "vue";
+import { message } from "ant-design-vue";
+import { getCookieForName } from "@/api/method";
+const props = defineProps({
+    value: {
+        type: Array,
+        default: () => []
+    },
+    multiple: {
+        type: Boolean,
+        default: false
+    },
+    showUploadList: {
+        type: Boolean,
+        default: false
+    },
+    fileType: {
+        type: Array,
+        default: () => []
+    },
+    url: {
+        type: String,
+        default: '/systemapi/api/m/xfile/base/file/upload'
+    },
+    params: {
+        type: Object,
+        default: {
+            folderId: process.env.VUE_APP_TOOL_FOLDERID
+        }
+    }
+})
+
+const emit = defineEmits({})
+
+const files = ref([])
+const imageRef = ref()
+const headers = { token: getCookieForName("token") };
+watch(props, () => {
+    props.value.length !== files.value.length && (files.value = props.value)
+})
+
+function handleChange({ file, fileList }) {
+    file.response && file.response.code === 200 && (file.url = file.response.data)
+    files.value = fileList
+    emit('update:value', fileList)
+}
+
+function beforeUpload(file) {
+    if (!props.fileType.includes(file.name.split(".").slice(-1).join(''))) {
+        message.error("目前只支持zip格式");
+        return false;
+    }
+}
+
+function remove(i) {
+    files.value.splice(i, 1)
+    emit('update:value', files.value)
+}
+
+function reUpload(i) {
+    if (files.value[i].status === 'ready' || files.value[i].status === 'uploading') {
+        imageRef.value.abort(files.value[i].raw)
+        files.value[i].status = 'abort';
+    } else if (files.value[i].status === 'fail' || files.value[i].status === 'abort') {
+        imageRef.value.handleStart(files.value[i].raw)
+        imageRef.value.submit()
+    }
+}
+
+function abort(i) {
+    imageRef.value.abort(files.value[i].raw)
+}
+
+
+defineExpose({ reUpload, remove, abort })
+
+</script>
+