接口初始化 第一版

src/components/FileTypeImg.vue

@@ -0,0 +1,28 @@
+<template>
+  <img class="file"
+       :style="style"
+       :src="{pdf,doc:word,ppt,zip,excel,xlsx:excel,xls:excel,rar,book,md,docx:word}[filePath.split('.').slice(-1)] || book"/>
+</template>
+<script setup>
+import rar from '@/assets/image/file/rar.png'
+import excel from '@/assets/image/file/excel.png'
+import md from '@/assets/image/file/md.png'
+import pdf from '@/assets/image/file/pdf.png'
+import ppt from '@/assets/image/file/ppt.png'
+import word from '@/assets/image/file/word.png'
+import zip from '@/assets/image/file/zip.png'
+import book from '@/assets/image/file/book.png'
+import {defineProps, ref} from "vue";
+
+const {modelValue = [],style} = defineProps({
+  modelValue: String,
+  style: Object
+})
+const filePath = ref(modelValue)
+</script>
+<style lang="scss">
+.file {
+  width: 22px;
+  height: 26px;
+}
+</style>

src/components/img/UploadImg.vue

@@ -0,0 +1,66 @@
+<template>
+  <el-upload
+      :file-list="files"
+      :action="FILE_UPLOAD"
+      method="POST"
+      :show-file-list="false"
+      :on-change="handleChange"
+      ref="imageRef"
+  >
+    <template #trigger>
+      <div>
+        <slot></slot>
+      </div>
+    </template>
+  </el-upload>
+</template>
+<script setup>
+import {FILE_UPLOAD} from "@/api/api";
+import {defineProps, ref} from "vue";
+
+const {modelValue = []} = defineProps({
+  modelValue: []
+})
+
+const emit = defineEmits()
+
+const files = ref(modelValue)
+const imageRef = ref()
+
+function handleChange(e) {
+  console.log(e)
+  if (e.response && e.response.code === 200) {
+    e.url = e.response.data
+  }
+
+  const index = files.value.findIndex(f => f.uid === e.uid)
+  if (index === -1) {
+    files.value.unshift(e)
+  } else {
+    files.value[index] = e
+  }
+  emit('update:modelValue', files)
+}
+
+function remove(i) {
+  files.value.splice(i, 1)
+}
+
+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})
+
+</script>

src/components/index.js

@@ -1,4 +0,0 @@
-import CompulsoryTag from './tag/CompulsoryTag.vue'
-export {
-	CompulsoryTag
-}