axwen-test31 2.0.0

package/src/assets/svg/status-stop.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>停用</title>
+    <g id="场景库" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="内容管理-场景库5" transform="translate(-1117, -658)" fill="#1F558B" fill-rule="nonzero">
+            <g id="编组-15" transform="translate(1109, 516)">
+                <g id="编组-9" transform="translate(8, 140)">
+                    <g id="停用" transform="translate(0, 2)">
+                        <rect id="矩形" opacity="0" x="0" y="0" width="16" height="15.9466667"></rect>
+                        <path d="M8,0.996666667 C11.866,0.996666667 15,4.12022 15,7.97333333 C15,11.8264467 11.866,14.95 8,14.95 C4.134,14.95 1,11.8264467 1,7.97333333 C1,4.12022 4.134,0.996666667 8,0.996666667 Z M8,1.99333333 C4.68629474,1.99333333 2,4.67067375 2,7.97333333 C2,11.2759929 4.68629474,13.9533333 8,13.9533333 C11.3137053,13.9533333 14,11.2759929 14,7.97333333 C14,4.67067375 11.3137053,1.99333333 8,1.99333333 Z M10.52,7.5 C10.785095,7.5 11,7.72311318 11,7.99833333 C11,8.27355349 10.785095,8.49666667 10.52,8.49666667 L5.48,8.49666667 C5.214905,8.49666667 5,8.27355349 5,7.99833333 C5,7.72311318 5.214905,7.5 5.48,7.5 L10.52,7.5 Z" id="形状" stroke="#1F558B" stroke-width="0.2"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

package/src/assets/svg/template.svg

@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>活动总数</title>
+    <defs>
+        <linearGradient x1="50%" y1="17.0171335%" x2="50%" y2="114.389913%" id="linearGradient-1">
+            <stop stop-color="#D2DEFF" stop-opacity="0.663734703" offset="0.0928758741%"></stop>
+            <stop stop-color="#FFFFFF" offset="100%"></stop>
+        </linearGradient>
+        <filter x="-66.7%" y="-29.9%" width="233.3%" height="179.1%" filterUnits="objectBoundingBox" id="filter-2">
+            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.619607843   0 0 0 0 0.733333333   0 0 0 0 0.992156863  0 0 0 0.5 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
+            <feMerge>
+                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+                <feMergeNode in="SourceGraphic"></feMergeNode>
+            </feMerge>
+        </filter>
+    </defs>
+    <g id="营销分析" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="首页" transform="translate(-244, -2165)">
+            <g id="编组-4" transform="translate(220, 1747)">
+                <g id="编组-11" transform="translate(0, 394)">
+                    <g id="编组-34" transform="translate(12, 12)">
+                        <g id="编组" transform="translate(12, 12)">
+                            <rect id="矩形" fill="#1664FF" x="0" y="0" width="24" height="24" rx="6"></rect>
+                            <g transform="translate(5, 4)">
+                                <rect id="矩形" fill="url(#linearGradient-1)" x="0" y="0" width="14" height="16" rx="2"></rect>
+                                <g id="编组-28" filter="url(#filter-2)" transform="translate(4, 3)" stroke="#FFFFFF" stroke-linecap="round" stroke-linejoin="round">
+                                    <line x1="0" y1="7" x2="6" y2="7" id="路径"></line>
+                                    <line x1="0" y1="10" x2="3" y2="10" id="路径"></line>
+                                    <rect id="矩形" fill-rule="nonzero" x="0" y="0" width="6" height="4"></rect>
+                                </g>
+                            </g>
+                        </g>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

package/src/bus.js

@@ -0,0 +1,3 @@
+import Vue from 'vue'
+Vue.prototype.$eventBus = new Vue()
+export default new Vue()

package/src/components/Editor.vue

@@ -0,0 +1,108 @@
+<template>
+  <div style="border: 1px solid #ccc;">
+    <Toolbar
+      v-show="!disabled"
+      style="border-bottom: 1px solid #ccc"
+      :editor="editorRef"
+      :defaultConfig="innerToolbarConfig"
+      :mode="mode"
+    />
+    <Editor
+      style="overflow-y: hidden;"
+      :style="{ height: height + 'px' }"
+      v-model="valueHtml"
+      :defaultConfig="editorConfig"
+      :mode="mode"
+      @onCreated="handleCreated"
+      @onChange="handleChange"
+    />
+  </div>
+</template>
+
+<script>
+import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
+import '@wangeditor/editor/dist/css/style.css'
+export default {
+  name: 'MyEditor',
+  props: {
+    value: {
+      type: String,
+      default: ''
+    },
+    disabled: {
+      type: Boolean,
+      default: true,
+    },
+    height: {
+      type: Number,
+      default: 500,
+    },
+    toolbarConfig: {
+      type: Object,
+      default: () => ({}),
+    },
+    imageFiles: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  components: { Editor, Toolbar },
+  data() {
+    return {
+      editorRef: null,
+      mode: 'default',
+      editorConfig: {
+        placeholder: '请输入内容...',
+        readOnly: this.disabled,
+      },
+      valueHtml: this.value
+    }
+  },
+  watch: {
+    value(newVal) {
+      if (newVal !== this.valueHtml && this.editorRef) {
+        this.valueHtml = newVal
+      }
+    },
+    disabled(newVal) {
+      if (this.editorRef) {
+        this.editorRef.setEnabled(!newVal)
+      }
+    }
+  },
+  computed: {
+    innerToolbarConfig() {
+      return {
+        excludeKeys: ['insertImage', 'group-video', 'fullScreen'],
+        ...this.toolbarConfig,
+      }
+    }
+  },
+  mounted() {
+  },
+  methods: {
+    handleCreated(editor) {
+      this.editorRef = Object.seal(editor)
+      // 设置初始内容
+      if (this.value) {
+        editor.setHtml(this.value)
+      }
+    },
+    handleChange(editor) {
+      try {
+        const html = editor.getHtml()
+        this.valueHtml = html
+        this.$emit('input', html)
+        this.$emit('change', html)
+      } catch (error) {
+        console.warn('Editor change error:', error)
+      }
+    }
+  },
+  beforeDestroy() {
+    const editorRef = this.editorRef
+    if (editorRef == null) return
+    editorRef.destroy() // 组件销毁时，及时销毁编辑器
+  },
+}
+</script>

package/src/components/attachment-approval/assets/svg/file-icon-jpg.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="16" height="16" viewBox="0 0 16 16"><defs><clipPath id="master_svg0_9498_71908"><rect x="0" y="0" width="16" height="16" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_9498_71908)"><g><path d="M14.088052734375,14.48C14.088052734375,14.68,14.008052734375,14.872,13.864052734375,15.016C13.720052734375,15.16,13.528052734375,15.24,13.328052734375,15.24L2.664052734375,15.24C2.464052734375,15.24,2.264052734375,15.16,2.128052734375,15.016C1.984052634375,14.872,1.904052734375,14.68,1.904052734375,14.48L1.904052734375,0.76C1.904052734375,0.56,1.984052734375,0.36,2.128052734375,0.224C2.264052734375,0.08,2.464052734375,0,2.664052734375,0L9.208052734375,0C9.408052734375,0,9.608052734375,0.08,9.752052734374999,0.224L13.872052734375,4.344C14.016052734375,4.488,14.096052734375,4.68,14.096052734375,4.888L14.096052734375,14.48L14.088052734375,14.48Z" fill="#EBECF0" fill-opacity="1"/></g><g><path d="M14.088052734375,14.480003356933594L14.088052734375,15.240003356933594C14.088052734375,15.440003356933595,14.008052734375,15.640003356933594,13.864052734375,15.776003356933593C13.720052734375,15.920003356933593,13.528052734375,16.000003356933593,13.328052734375,16.000003356933593L2.664052734375,16.000003356933593C2.240052734375,16.000003356933593,1.904052734375,15.656003356933594,1.904052734375,15.240003356933594L1.904052734375,14.480003356933594C1.904052734375,14.680003356933593,1.984052834375,14.872003356933593,2.128052734375,15.016003356933593C2.272052734375,15.160003356933593,2.464052734375,15.240003356933594,2.664052734375,15.240003356933594L13.328052734375,15.240003356933594C13.752052734375,15.240003356933594,14.088052734375,14.896003356933594,14.088052734375,14.480003356933594Z" fill="#C1C7D0" fill-opacity="1"/></g><g><path d="M0.3759765625,8.383995056152344L15.6159765625,8.383995056152344L15.6159765625,12.191995056152344C15.6159765625,12.615995056152343,15.2719765625,12.951995056152343,14.8559765625,12.951995056152343L1.1439765625,12.951995056152343C0.9439765625,12.951995056152343,0.7439765625,12.871995056152343,0.6079765625,12.727995056152345C0.4639766625,12.583995056152343,0.3839766125,12.391995056152343,0.3839766125,12.183995056152344L0.3839766125,8.383995056152344L0.3759765625,8.383995056152344Z" fill="#26B99A" fill-opacity="1"/></g><g><path d="M1.9039765625,8.383995178222657L1.9039765625,6.855995178222656L0.3759765625,8.383995178222657L1.9039765625,8.383995178222657ZM14.0879765625,8.383995178222657L14.1039765625,6.855995178222656L15.6239765625,8.383995178222657L14.0879765625,8.383995178222657Z" fill="#109978" fill-opacity="1"/></g><g><path d="M14.088007812499999,4.888L14.088007812499999,4.992L9.9680078125,4.992C9.5440078125,4.992,9.2080078125,4.648,9.2080078125,4.232L9.2080078125,0C9.4080078125,0,9.6080078125,0.08,9.7520078125,0.224L13.8800078125,4.344C14.0160078125,4.488,14.0960078125,4.68,14.088007812499999,4.888Z" fill="#C1C7D0" fill-opacity="1"/></g><g><path d="M2.079919813125,10.896004821777344L2.943920203125,10.896004821777344C2.919920203125,11.336004821777344,3.007920203125,11.552004821777343,3.199923203125,11.536004821777343C3.3599232031249997,11.528004821777344,3.4399232031249998,11.400004821777344,3.4399232031249998,11.168004821777345L3.4399232031249998,9.224004721777344L4.399923203125001,9.224004721777344L4.399923203125001,11.040004821777345C4.399923203125001,11.832004821777344,4.015923203125,12.232004821777345,3.239923203125,12.232004821777345C2.399920203125,12.216004821777343,2.007920303125,11.776004821777343,2.079919813125,10.896004821777344ZM5.903923203125,12.184004821777343L4.943923203125,12.184004821777343L4.943923203125,9.232005121777343L6.359923203125,9.232005121777343C7.183923203125,9.240005521777343,7.607923203125,9.576004821777344,7.631923203125,10.224004821777344C7.623923203125,10.912004821777344,7.207923203125,11.256004821777344,6.391923203125,11.264004821777345L5.911923203125,11.264004821777345L5.911923203125,12.184004821777343L5.903923203125,12.184004821777343ZM5.903923203125,10.576004821777344L6.303923203125,10.576004821777344C6.559923203125,10.576004821777344,6.687923203125,10.456004821777343,6.687923203125,10.224004821777344C6.687923203125,10.024004821777345,6.519923203125,9.920004821777344,6.175923203125,9.920004821777344L5.903923203125,9.920004821777344L5.903923203125,10.576004821777344ZM10.431923203125,12.184004821777343L7.959923203125,12.184004821777343L7.959923203125,9.232005121777343L10.383923203125,9.232005121777343L10.383923203125,9.920004821777344L8.935923203125,9.920004821777344L8.935923203125,10.336004821777344L10.159923203125,10.336004821777344L10.159923203125,11.024004821777343L8.935923203125,11.024004821777343L8.935923203125,11.488004821777343L10.431923203125,11.488004821777343L10.431923203125,12.184004821777343ZM13.759933203125,10.560004821777344L13.759933203125,12.184004821777343L13.135933203125,12.184004821777343L13.103933203125,11.896004821777343C12.911933203125,12.120004821777343,12.607933203125,12.232004821777345,12.207933203125,12.232004821777345C11.287923203125,12.192004821777344,10.807923203125,11.688004821777344,10.775923203125,10.736004821777344C10.831923203125,9.720004821777344,11.343923203125,9.192005121777344,12.319933203125,9.144004821777344C13.111933203125,9.168005021777343,13.583933203125,9.528004821777344,13.735933203125,10.232004821777345L12.807933203125,10.232004821777345C12.743933203125,9.984004821777344,12.575933203125,9.864004821777344,12.311933203125,9.864004821777344C11.943923203125,9.872005821777345,11.759923203125,10.160004821777344,11.751923203125,10.728004821777343C11.759923203125,11.264004821777345,11.967923203125,11.528004821777344,12.375933203125,11.528004821777344C12.631933203125,11.496004821777344,12.799933203125,11.384004821777344,12.871933203125,11.192004821777344L12.439933203125,11.192004821777344L12.439933203125,10.552004821777343L13.759933203125,10.552004821777343L13.759933203125,10.560004821777344Z" fill="#FFFFFF" fill-opacity="1"/></g></g></svg>

package/src/components/attachment-approval/assets/svg/file-icon-pdf.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="16" height="16" viewBox="0 0 16 16"><defs><clipPath id="master_svg0_9498_71890"><rect x="0" y="0" width="16" height="16" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_9498_71890)"><g><path d="M14.088052734375,14.4801C14.088052734375,14.6801,14.007952734375,14.8721,13.864052734375,15.016C13.719852734375,15.16,13.528052734375,15.24,13.327852734375,15.24L2.664013734375,15.24C2.464013734375,15.24,2.264013734375,15.16,2.128075734375,15.016C1.984130834375,14.8719,1.904052734375,14.6801,1.904052734375,14.4801L1.904052734375,0.759961C1.904052734375,0.559961,1.983935634375,0.359961,2.128075734375,0.224023C2.264013734375,0.0800781,2.464208734375,0,2.664013734375,0L9.208152734375,0C9.408152734375001,0,9.608152734375,0.0800781,9.752102734375,0.224023L13.872052734375,4.34414C14.015952734375,4.48809,14.096052734375,4.68008,14.096052734375,4.88809L14.096052734375,14.4801L14.088052734375,14.4801Z" fill="#EBECF0" fill-opacity="1"/></g><g><path d="M14.088052734375,14.480079650878906L14.088052734375,15.240040650878907C14.088052734375,15.440040650878906,14.007952734375,15.640039650878906,13.864052734375,15.775979650878906C13.719852734375,15.920119650878906,13.528052734375,15.999999650878905,13.327852734375,15.999999650878905L2.664013734375,15.999999650878905C2.239990734375,15.999999650878905,1.904052734375,15.656059650878905,1.904052734375,15.240040650878907L1.904052734375,14.480079650878906C1.904052734375,14.680079650878906,1.983935634375,14.872072650878906,2.128075734375,15.016016650878907C2.272021734375,15.159962650878906,2.464013734375,15.240040650878907,2.664013734375,15.240040650878907L13.328052734375,15.240040650878907C13.752052734375,15.240040650878907,14.088052734375,14.896095650878907,14.088052734375,14.480079650878906Z" fill="#C1C7D0" fill-opacity="1"/></g><g><path d="M1.904150703125,8.383977849121093L1.904150703125,6.855857849121094L0.376220703125,8.383977849121093L1.904150703125,8.383977849121093ZM14.088120703125,8.383977849121093L14.104120703125,6.855857849121094L15.624120703125,8.383977849121093L14.088120703125,8.383977849121093Z" fill="#D30000" fill-opacity="1"/></g><g><path d="M14.087843671875,4.88809L14.087843671875,4.99199L9.967724671875,4.99199C9.543701671875,4.99199,9.207763671875,4.64805,9.207763671875,4.23203L9.207763671875,0C9.407763671875,0,9.607763671875,0.0800781,9.751708671875,0.224023L13.879833671875,4.34414C14.015773671875,4.48809,14.095853671875,4.68008,14.087843671875,4.88809Z" fill="#C1C7D0" fill-opacity="1"/></g><g><path d="M7.858448203125,9.548637390136719L7.231688203125,9.548637390136719L7.231688203125,11.782817390136719L7.847318203125,11.782817390136719C8.546528203125,11.782817390136719,8.924458203124999,11.388867390136719,8.924458203124999,10.62890739013672C8.924458203124999,9.96758239013672,8.578758203125,9.557426450136719,7.858448203125,9.548637390136719ZM4.296337203125,9.54980946013672L3.399658203125,9.54980946013672L3.399658203125,10.499223390136718L4.296338203125,10.499223390136718C4.663718203125,10.499223390136718,4.895948203125,10.373247390136719,4.895948203125,10.018169390136718C4.895948203125,9.728716390136718,4.718018203125,9.549810410136718,4.296337203125,9.54980946013672Z" fill="#FF1D1D" fill-opacity="1"/></g><g><path d="M0.384033203125,8.383979797363281L0.384033203125,12.183979797363282C0.384033203125,12.39198979736328,0.46391600312500003,12.58397979736328,0.608056203125,12.72792979736328C0.743994203125,12.872069797363281,0.943994203125,12.95194979736328,1.143994203125,12.95194979736328L14.856133203125,12.95194979736328C15.272133203125,12.95194979736328,15.616033203125,12.616009797363281,15.616033203125,12.19198979736328L15.616033203125,8.383979797363281L0.384033203125,8.383979797363281ZM4.363333203125,11.172649797363281L3.399463203125,11.172649797363281L3.399463203125,12.455069797363281L2.527583203125,12.455069797363281L2.527583203125,8.880855797363282L4.377003203125,8.880855797363282C5.208053203125,8.880855797363282,5.760593203125,9.300972797363281,5.760593203125,10.004289797363281C5.760593203125,10.707609797363281,5.240093203125,11.172649797363281,4.363333203125,11.172649797363281ZM7.961373203125,12.455069797363281L6.364113203125,12.455069797363281L6.364113203125,8.880855797363282L7.979733203125,8.880855797363282C9.184033203125,8.880855797363282,9.843013203125,9.662499797363282,9.843013203125,10.60546979736328C9.843013203125,11.74960979736328,9.001613203125,12.455069797363281,7.961373203125,12.455069797363281ZM13.497933203125,9.570899797363282L11.423833203125,9.570899797363282L11.423833203125,10.383789797363281L13.358433203125,10.383789797363281L13.358433203125,11.078899797363281L11.423833203125,11.078899797363281L11.423833203125,12.454879797363281L10.556533203125,12.454879797363281L10.556533203125,8.880660797363282L13.497933203125,8.880660797363282L13.497933203125,9.57069979736328L13.497933203125,9.570899797363282Z" fill="#FF1D1D" fill-opacity="1"/></g><g><path d="M4.376807890625,8.880860328674L2.527587890625,8.880860328674L2.527587890625,12.455079375L3.399462890625,12.455079375L3.399462890625,11.172659375L4.3633278906249995,11.172659375C5.240087890625,11.172659375,5.760597890625,10.735159375,5.760597890625,10.004299375C5.760597890625,9.273437375,5.208057890625,8.880859375,4.376997890625,8.880859375L4.376807890625,8.880860328674ZM4.2959478906249995,10.499219375L3.399267890625,10.499219375L3.399267890625,9.549805375L4.2959478906249995,9.549805375C4.717627890625,9.549805375,4.895557890625,9.728712375,4.895557890625,10.018169375C4.895557890625,10.373049375,4.663137890625,10.499219375,4.2959478906249995,10.499219375ZM7.979737890625,8.880860328674L6.364107890625,8.880860328674L6.364107890625,12.455079375L7.961377890625,12.455079375C9.001607890625,12.455079375,9.843017890625,11.749609375,9.843017890625,10.605469375C9.843017890625,9.662501375,9.184227890625,8.880860328674,7.979737890625,8.880860328674ZM7.846927890625,11.782809375L7.231297890625,11.782809375L7.231297890625,9.548633375L7.858057890625,9.548633375C8.578177890625,9.557618375,8.924067890625,9.967779375,8.924067890625,10.628909375C8.924067890625,11.388869375,8.546137890625001,11.782809375,7.846927890625,11.782809375ZM10.556497890625,12.455079375L11.423877890625,12.455079375L11.423877890625,11.079099375L13.358487890625,11.079099375L13.358487890625,10.383989375L11.423877890625,10.383989375L11.423877890625,9.571094375L13.497887890625,9.571094375L13.497887890625,8.880860328674L10.556497890625,8.880860328674L10.556497890625,12.455079375Z" fill="#FFFFFF" fill-opacity="1"/></g></g></svg>

package/src/components/attachment-approval/assets/svg/file-icon-png.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="16" height="16" viewBox="0 0 16 16"><defs><clipPath id="master_svg0_9498_74753"><rect x="0" y="0" width="16" height="16" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_9498_74753)"><g><path d="M14.091223046875,14.4763C14.092023046875,14.6783,14.011623046875,14.8722,13.868223046875,15.0145C13.725323046875,15.1571,13.531723046875,15.2374,13.329823046875,15.2376L2.662647046875,15.2376C2.460517046875,15.2385,2.266519046875,15.1581,2.124248046875,15.0145C1.981640646875,14.8717,1.901415824875,14.6782,1.901127934455,14.4763L1.901127934455,0.763218C1.900397538875,0.561066,1.980769746875,0.367066,2.124248046875,0.224658C2.266885046875,0.0814351,2.4605140468749997,0.000646091,2.662647046875,0.0000186449L9.206393046875,0.0000186449C9.409123046875,-0.00139892,9.604043046874999,0.0780679,9.747993046875,0.220818L13.870823046875,4.34441C14.013323046875,4.48853,14.092623046875,4.68342,14.091323046875,4.88609L14.091223046875,14.4763Z" fill="#EBECF0" fill-opacity="1"/></g><g><path d="M14.091634765625,14.476316449238281L14.091634765625,15.23831596923828C14.092334765625,15.440454969238282,14.012034765625,15.634455969238282,13.868534765625,15.776875969238281C13.725634765625,15.919545969238282,13.532034765625,15.999775969238282,13.330134765625,15.999995969238281L2.662959765625,15.999995969238281C2.241800765625,15.999505969238282,1.900641083715,15.657955969238282,1.900640964505,15.23679496923828L1.900640964505,14.475516319238281C1.899820327625,14.67756796923828,1.980214665625,14.871477969238281,2.123760765625,15.013675969238282C2.266646765625,15.156342969238281,2.460244765625,15.23657196923828,2.662159765625,15.23679496923828L13.328534765625,15.23679496923828C13.749234765625,15.236176969238281,14.090134765625,14.895246969238281,14.090634765625,14.474555969238281L14.091634765625,14.476316449238281Z" fill="#C1C7D0" fill-opacity="1"/></g><g><path d="M0.377685546875,8.381614685058594L15.614485546875,8.381614685058594L15.614485546875,12.191764685058594C15.613785546875,12.612254685058595,15.273685546875,12.953254685058594,14.853185546875,12.954964685058593L1.140884546875,12.954964685058593C0.938753546875,12.955674685058593,0.744771546875,12.875334685058593,0.602325546875,12.731924685058594C0.458671146875,12.588864685058594,0.377846389875,12.394514685058594,0.377685546875,12.191764685058594L0.377685546875,8.381614685058594Z" fill="#88C057" fill-opacity="1"/></g><g><path d="M1.902165546875,8.381451958007812L1.902165546875,6.8571319580078125L0.377685546875,8.381451958007812L1.902165546875,8.381451958007812ZM14.091485546875,8.381451958007812L14.105985546875,6.8571319580078125L15.622185546875,8.381451958007812L14.091485546875,8.381451958007812Z" fill="#497F16" fill-opacity="1"/></g><g><path d="M14.091400546875,4.88481L14.091400546875,4.99201L9.969009546875,4.99201C9.547506546875,4.99201,9.205810546875,4.65032,9.205810546875,4.22882L9.205810546875,0.0000208479C9.408504546875,-0.00147806,9.603430546875,0.0779031,9.747409546875,0.220581L13.876600546875,4.3417C14.016210546875,4.48776,14.093060546875,4.6827,14.090680546875,4.88473L14.091400546875,4.88481Z" fill="#C1C7D0" fill-opacity="1"/></g><g><path d="M4.464147046875,12.093046811523438L3.541748046875,12.093046811523438L3.541748046875,9.264487311523437L4.894548046875,9.264487311523437Q6.078148046875,9.279927211523438,6.109028046875,10.217606811523437Q6.093508046875,11.201526811523438,4.925268046875,11.216806811523437L4.464146046875,11.216806811523437L4.464147046875,12.093046811523438ZM4.464147046875,10.555766811523437L4.848468046875,10.555766811523437Q5.217348046875,10.555766811523437,5.217428046875,10.217606811523437Q5.217428046875,9.925605811523438,4.725428046875,9.925445811523437L4.464147046875,9.925445811523437L4.464147046875,10.555766811523437ZM7.277348046875,9.264487311523437L8.291978046875,10.801686811523437L8.261258046875,10.156085811523438L8.261258046875,9.264487311523437L9.152938046875,9.264487311523437L9.152938046875,12.093046811523438L8.276698046875001,12.093046811523438L7.261988046875,10.555766811523437L7.308148046875,11.201366811523437L7.308148046875,12.093046811523438L6.4165480468750005,12.093046811523438L6.4165480468750005,9.264487311523437L7.277348046875,9.264487311523437ZM12.427338046875,10.540406811523438L12.427338046875,12.093046811523438L11.827738046875,12.093046811523438L11.797018046875,11.816326811523437Q11.520298046875,12.139206811523437,10.936218046875,12.139126811523438Q9.613818046875,12.077606811523438,9.567978046875,10.709526811523437Q9.644698046875,9.249206511523438,11.043738046875,9.187606811523438Q12.181178046875,9.218486811523437,12.396538046875,10.232886811523437L11.504938046875,10.232886811523437Q11.412698046875,9.879445811523437,11.028378046875,9.879365811523437Q10.505578046875,9.894885811523437,10.490298046875001,10.709446811523438Q10.505418046875,11.478406811523438,11.089818046875,11.478166811523437Q11.458858046875001,11.432086811523437,11.566378046875,11.155286811523437L11.151338046875,11.155286811523437L11.151338046875,10.540406811523438L12.427338046875,10.540406811523438Z" fill="#FFFFFF" fill-opacity="1"/></g></g></svg>

package/src/components/attachment-approval/assets/svg/file-icon-word.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="16" height="16" viewBox="0 0 16 16"><defs><clipPath id="master_svg0_9498_71873"><rect x="0" y="0" width="16" height="16" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_9498_71873)"><g><path d="M14.079630078125,14.45923836669922C14.080530078125,14.660938366699218,14.000230078125,14.854438366699219,13.857030078125,14.996438366699218C13.714430078125,15.138838366699218,13.521230078125,15.218838366699218,13.319730078125,15.21913836669922L2.673176078125,15.21913836669922C2.471503078125,15.21993836669922,2.277953078125,15.139738366699218,2.135976078125,14.996438366699218C1.993618978125,14.853838366699218,1.913562894125,14.660738366699219,1.913336038595,14.45923836669922L1.913336038595,0.7722403666992188C1.912533283125,0.5704743666992188,1.992741678125,0.37682736669921874,2.135976078125,0.23472036669921875C2.278565078125,0.09241266669921876,2.471724078125,0.01238783069921875,2.673176078125,0.01216081999921875L9.204380078125,0.01216081999921875C9.406670078125,0.01060601669921875,9.601230078124999,0.08985486669921874,9.744860078125,0.23232036669921874L13.859630078125,4.346878366699219C14.001930078125,4.490628366699219,14.081130078125,4.685118366699219,14.079630078125,4.887358366699218L14.079630078125,14.45923836669922Z" fill="#EBECF0" fill-opacity="1"/></g><g><path d="M14.079453515625,14.459197044621094L14.079453515625,15.219916911621095C14.080253515625,15.421655911621095,14.000053515625,15.615266911621093,13.856853515625,15.757356911621093C13.714253515625,15.899676911621093,13.521053515625,15.979726911621094,13.319553515625,15.979996911621093L2.673000515625,15.979996911621093C2.252819515625,15.979686911621094,1.912360191345,15.639116911621095,1.912360191345,15.219116911621093L1.912360191345,14.459197044621094C1.911511182625,14.660886911621093,1.991698815625,14.854466911621094,2.134920515625,14.996476911621095C2.2775155156249998,15.138833911621093,2.470708515625,15.218889911621094,2.672200515625,15.219116911621093L13.317953515625,15.219116911621093C13.737653515625,15.218017911621093,14.077553515625,14.878074911621093,14.078653515625,14.458396911621094L14.079453515625,14.459197044621094Z" fill="#C1C7D0" fill-opacity="1"/></g><g><path d="M0.392333984375,8.376480102539062L15.599333984375,8.376480102539062L15.599333984375,12.178640102539063C15.598133984375,12.597880102539062,15.258833984375,12.937610102539063,14.839633984375,12.939280102539062L1.153213984375,12.939280102539062C0.951486984375,12.940080102539063,0.757873984375,12.859910102539063,0.615773984375,12.716720102539062C0.473416984375,12.574130102539062,0.393361124375,12.380930102539063,0.393134027375,12.179440102539063L0.392333984375,8.376480102539062Z" fill="#317BFF" fill-opacity="1"/></g><g><path d="M1.913853984375,8.376317580566406L1.913853984375,6.854957580566406L0.392333984375,8.376317580566406L1.913853984375,8.376317580566406ZM14.079333984375,8.376317580566406L14.093933984375,6.854957580566406L15.607333984375,8.376317580566406L14.079333984375,8.376317580566406Z" fill="#234AE8" fill-opacity="1"/></g><g><path d="M14.079545703125,4.886557280273437L14.079545703125,4.9934372802734375L9.965145703125,4.9934372802734375C9.544941703125,4.993347280273437,9.204345703125,4.652827280273438,9.204345703125,4.232797280273438L9.204345703125,0.0113591411734375C9.406615703125,0.0098251902734375,9.601134703125,0.0890724802734375,9.744746703125,0.2315192802734375L13.866025703125,4.344477280273438C14.005375703125,4.490277280273437,14.082035703125001,4.684887280273437,14.079545703125,4.886557280273437Z" fill="#C1C7D0" fill-opacity="1"/></g><g><path d="M4.057378437500001,9.477840402832031L4.366578437499999,11.080160402832032L4.661778437500001,9.477760302832031L5.4769784375,9.477760302832031L4.8444984375,12.064080402832031L4.0011384375,12.064080402832031L3.7059384375,10.56016040283203L3.6918584375,10.56016040283203L3.3967384375,12.064080402832031L2.5674584375,12.064080402832031L1.9208984375,9.477840402832031L2.7501784375,9.477840402832031L3.0312984375000003,11.080160402832032L3.0453784375,11.080160402832032L3.3545784375,9.477760302832031L4.057378437500001,9.477840402832031ZM6.9949784375,9.407600402832031Q8.273778437499999,9.463920602832031,8.358338437499999,10.756880402832032Q8.301938437499999,12.050240402832031,6.9949784375,12.106240402832032Q5.6877784375000005,12.064080402832031,5.6456184375,10.742800402832032Q5.7157784375,9.47792150283203,6.9949784375,9.407600402832031ZM6.9949784375,10.04008040283203Q6.5168984375,10.054240402832031,6.4889784375,10.756880402832032Q6.5169784375,11.487920402832032,6.9949784375,11.50184040283203Q7.5009784375,11.487920402832032,7.5149784375,10.756880402832032Q7.4866584375,10.04008040283203,6.9949784375,10.04008040283203ZM9.8200984375,11.16456040283203L9.567138437499999,11.16456040283203L9.567138437499999,12.064000402832031L8.723858437499999,12.064000402832031L8.723858437499999,9.477760302832031L9.9466584375,9.477760302832031Q11.1410584375,9.449760402832032,11.0850584375,10.208640402832032Q11.0710584375,10.71472040283203,10.6492984375,10.841200402832031Q11.1268984375,10.939600402832031,11.0991384375,11.529840402832031L11.0991384375,11.64232040283203Q11.0850584375,12.021760402832031,11.1835384375,11.979680402832031L11.1835384375,12.064000402832031L10.3260184375,12.064000402832031Q10.2840984375,11.97960040283203,10.2840184375,11.614240402832031Q10.3400184375,11.122400402832032,9.8200984375,11.16456040283203L9.8200984375,11.16456040283203ZM9.567138437499999,10.082240402832031L9.567138437499999,10.588240402832032L9.9044984375,10.588240402832032Q10.3260984375,10.602400402832032,10.3119384375,10.349279402832032Q10.2979384375,10.096319402832032,9.9607384375,10.08223940283203L9.567138437499999,10.082240402832031ZM12.6451984375,12.064000402832031L11.5348184375,12.064000402832031L11.5348184375,9.477840402832031L12.6733984375,9.477840402832031Q14.0085984375,9.49200060283203,14.0226984375,10.714800402832031Q14.0226984375,12.064080402832031,12.6451984375,12.064000402832031L12.6451984375,12.064000402832031ZM12.3782984375,10.082240402832031L12.3782984375,11.459680402832031L12.5608984375,11.459680402832031Q13.1650984375,11.459680402832031,13.1651984375,10.756880402832032Q13.2074984375,10.02624040283203,12.5467984375,10.08224140283203L12.3782984375,10.082240402832031Z" fill="#FFFFFF" fill-opacity="1"/></g></g></svg>

package/src/components/attachment-approval/assets/svg/upload-icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="42" height="42" viewBox="0 0 42 42"><defs><clipPath id="master_svg0_9498_74170"><rect x="0" y="0" width="42" height="42" rx="0"/></clipPath><filter id="master_svg1_9498_74172" filterUnits="objectBoundingBox" color-interpolation-filters="sRGB" x="-8" y="-6" width="24.75" height="24.75"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="2" dx="0"/><feGaussianBlur stdDeviation="2"/><feColorMatrix type="matrix" values="0 0 0 0 0.8196078538894653 0 0 0 0 0.8196078538894653 0 0 0 0 0.8588235378265381 0 0 0 0.23999999463558197 0"/><feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/><feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/></filter><clipPath id="master_svg2_9498_74175"><rect x="26" y="26" width="12" height="12" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_9498_74170)"><g><path d="M8.75,38.5L33.25,38.5C34.216499999999996,38.5,35,37.7165,35,36.75L35,12.25L26.25,12.25L26.25,3.5L8.75,3.5C7.783501,3.5,7,4.283501,7,5.25L7,36.75C7,37.7165,7.783501,38.5,8.75,38.5Z" fill="#1F2226" fill-opacity="0.03999999910593033"/></g><g filter="url(#master_svg1_9498_74172)"><path d="M26.25,3.5L26.25,11.25C26.25,11.80229,26.697715,12.25,27.25,12.25L35,12.25L26.25,3.5Z" fill="#C8D1E2" fill-opacity="1"/></g><g><g><ellipse cx="32" cy="32" rx="10" ry="10" fill="#1664FF" fill-opacity="1"/></g><g clip-path="url(#master_svg2_9498_74175)"><rect x="26" y="26" width="12" height="12" rx="0" fill="#1664FF" fill-opacity="1"/><g><path d="M26.9,32.75Q26.9,32.6909052,26.911529,32.632946Q26.923058,32.574986,26.945672,32.52039Q26.968287,32.465793,27.001118,32.416658Q27.03395,32.367522,27.075736,32.325736Q27.117522,32.28395,27.166657999999998,32.251118Q27.215793,32.218287,27.27039,32.195672Q27.324986,32.173058,27.382946,32.161529Q27.4409052,32.15,27.5,32.15Q27.5590948,32.15,27.617054,32.161529Q27.675014,32.173058,27.72961,32.195672Q27.784207,32.218287,27.833342000000002,32.251118Q27.882478,32.28395,27.924264,32.325736Q27.96605,32.367522,27.998882,32.416658Q28.031713,32.465793,28.054328,32.52039Q28.076942,32.574986,28.088471,32.632946Q28.1,32.6909052,28.1,32.75Q28.1,33.98476,28.89553,34.92493Q29.93213,36.15,32,36.15Q34.06787,36.15,35.10447,34.92493Q35.9,33.98476,35.9,32.75Q35.9,32.6909052,35.91153,32.632946Q35.92306,32.574986,35.94567,32.52039Q35.968289999999996,32.465793,36.00112,32.416658Q36.033950000000004,32.367522,36.075739999999996,32.325736Q36.11752,32.28395,36.16666,32.251118Q36.21579,32.218287,36.27039,32.195672Q36.32498,32.173058,36.38295,32.161529Q36.4409,32.15,36.5,32.15Q36.5591,32.15,36.61705,32.161529Q36.67501,32.173058,36.72961,32.195672Q36.78421,32.218287,36.83334,32.251118Q36.88248,32.28395,36.924260000000004,32.325736Q36.966049999999996,32.367522,36.99888,32.416658Q37.031710000000004,32.465793,37.05433,32.52039Q37.07694,32.574986,37.08847,32.632946Q37.1,32.6909052,37.1,32.75Q37.1,34.42433,36.02053,35.70007Q34.624430000000004,37.35,32,37.35Q29.37557,37.35,27.979468,35.70007Q26.9,34.42433,26.9,32.75Z" fill-rule="evenodd" fill="#FFFFFF" fill-opacity="1"/></g><g><path d="M31.401953125,27.275146484375Q31.401953125,27.216051684375,31.413482125,27.158092484375Q31.425011125,27.100132484375,31.447625125,27.045536484375Q31.470240125,26.990939484375,31.503071125,26.941804484374998Q31.535903125,26.892668484375,31.577689125,26.850882484375Q31.619475125,26.809096484375,31.668611124999998,26.776264484375Q31.717746125,26.743433484375,31.772343125,26.720818484375Q31.826939125,26.698204484375,31.884899125,26.686675484375Q31.942858325,26.675146484375,32.001953125,26.675146484375Q32.061047925,26.675146484375,32.119007125,26.686675484375Q32.176967125,26.698204484375,32.231563125,26.720818484375Q32.286160125,26.743433484375,32.335295125,26.776264484375Q32.384431125,26.809096484375,32.426217125,26.850882484375Q32.468003125,26.892668484375,32.500835125,26.941804484374998Q32.533666125,26.990939484375,32.556281125,27.045536484375Q32.578895125,27.100132484375,32.590424125,27.158092484375Q32.601953125,27.216051684375,32.601953125,27.275146484375L32.601953125,34.250026484375Q32.601953125,34.309116484375,32.590424125,34.367076484375Q32.578895125,34.425036484375,32.556281125,34.479636484375Q32.533666125,34.534226484375,32.500835125,34.583366484375Q32.468003125,34.632496484375,32.426217125,34.674286484375Q32.384431125,34.716076484375,32.335295125,34.748906484375Q32.286160125,34.781736484375,32.231563125,34.804346484375Q32.176967125,34.826966484375,32.119007125,34.838496484375Q32.061047925,34.850026484375,32.001953125,34.850026484375Q31.942858325,34.850026484375,31.884899125,34.838496484375Q31.826939125,34.826966484375,31.772343125,34.804346484375Q31.717746125,34.781736484375,31.668611124999998,34.748906484375Q31.619475125,34.716076484375,31.577689125,34.674286484375Q31.535903125,34.632496484375,31.503071125,34.583366484375Q31.470240125,34.534226484375,31.447625125,34.479636484375Q31.425011125,34.425036484375,31.413482125,34.367076484375Q31.401953125,34.309116484375,31.401953125,34.250026484375L31.401953125,27.275146484375Z" fill-rule="evenodd" fill="#FFFFFF" fill-opacity="1"/></g><g><path d="M34.575540000000004,30.67407L34.575739999999996,30.67426Q34.66013,30.75866,34.77039,30.80433Q34.88065,30.85,35,30.85Q35.05909,30.85,35.11705,30.83847Q35.17501,30.82694,35.22961,30.80433Q35.2842,30.78171,35.33334,30.74888Q35.38248,30.71605,35.424260000000004,30.67426Q35.46605,30.63248,35.49888,30.58334Q35.531710000000004,30.53421,35.55433,30.47961Q35.57694,30.42501,35.58847,30.36705Q35.6,30.30909,35.6,30.25Q35.6,30.13065,35.55433,30.02039Q35.50866,29.91013,35.424260000000004,29.82574L32.42426,26.825736Q32.38248,26.78395,32.33334,26.751118Q32.28421,26.718287,32.22961,26.695672Q32.17501,26.673058,32.11705,26.661529Q32.05909,26.65,32,26.65Q31.9409,26.65,31.88295,26.661529Q31.82499,26.673058,31.77039,26.695672Q31.71579,26.718287,31.66666,26.751118Q31.61752,26.78395,31.57574,26.825736L28.575736,29.82574Q28.491345,29.91013,28.445672,30.02039Q28.4,30.13065,28.4,30.25Q28.4,30.30909,28.411529,30.36705Q28.423058,30.42501,28.445672,30.47961Q28.468287,30.53421,28.501118,30.58334Q28.53395,30.63248,28.575736,30.67426Q28.617522,30.71605,28.666657999999998,30.74888Q28.715793,30.78171,28.77039,30.80433Q28.824986,30.82694,28.882946,30.83847Q28.9409052,30.85,29,30.85Q29.119347,30.85,29.22961,30.80433Q29.339873,30.75866,29.424264,30.67426L29.424419,30.67411L32,28.098528L34.575540000000004,30.67407Z" fill-rule="evenodd" fill="#FFFFFF" fill-opacity="1"/></g></g></g></g></svg>

package/src/components/attachment-approval/attachment-approval-dialog.vue

@@ -0,0 +1,240 @@
+<template>
+    <yt-dialog
+        title="发布提示"
+        v-model="visible"
+        append-to-body
+        hasConfirm
+        hasCancel
+        @confirm="handleDialogConfirm"
+        @cancel="handleDialogCancel"
+        cancelText="取消"
+        @closed="handleDialogClosed"
+        :confirmProps="{
+            disabled: confirmDisabled
+        }"
+    >
+        <div class="upload-wrapper">
+            <div class="tip">
+                <slot name="tip">
+                    发布该活动需要上传OA审批相关文件。
+                </slot>
+            </div>
+            <div class="upload-body">
+                <el-upload
+                    class="upload-demo"
+                    action=""
+                    :drag="drag"
+                    :multiple="false"
+                    :show-file-list="false"
+                    :auto-upload="true"
+                    :on-change="handleChange"
+                    :before-upload="handleBeforeUpload"
+                    :http-request="uploadHttpRequest"
+                    :disabled="uploadDisabled"
+                >
+                    <img class="el-icon-upload" style="margin-top: 23px;" src="./assets/svg/upload-icon.svg" alt="" srcset="">
+                    <div>
+                        <div style="color: #1F2226">将文件拖入至此区域</div>
+                        <div style="color: rgba(31, 34, 38, 0.48); margin-bottom: 8px;">支持jpg、png、pdf格式上传，最少上传1份，最多支持上传5份附件。</div>
+                        <el-button icon="el-icon-upload2" :disabled="fileList.length === limit" >选择文件</el-button>
+                    </div>
+                    
+                </el-upload>
+                <ActAttachmentItem
+                    v-for="file in fileList"
+                    :key="file.id"
+                    v-bind="file"
+                >
+                    <template #operator>
+                        <div>
+                            <el-button type="text" @click="handlePreView(file)">预览</el-button>
+                            <yt-delete-button
+                                :name="file.fileName"
+                                @confirm="handleDelete(file)"
+                                style="margin-left: 8px"
+                            >
+                                删除
+                            </yt-delete-button>
+                        </div>
+                    </template>
+                </ActAttachmentItem>
+            </div>
+        </div>
+    </yt-dialog>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import { debounce } from 'lodash';
+import { deleteAttachment, uploadAttachment, previewAttachment } from './attachment-approval.js'
+import ActAttachmentItem from '@/components/attachment-approval/attachment-approval-item.vue';
+
+export default {
+    name: 'AttachmentApprovalDialog',
+    props: {
+        accept: {
+            type: String,
+            default: ''
+        },
+        drag: {
+            type: Boolean,
+            default: true
+        },
+        limit: {
+            type: Number,
+            default: 5
+        },
+        multiple: {
+            type: Boolean,
+            default: true
+        }
+    },
+    components: {
+        ActAttachmentItem
+    },
+    data() {
+        return {
+            visible: false,
+            fileList: [],
+            currentFile: null,
+            cancelling: false,
+            disabled: false
+        }
+    },
+    computed: {
+        ...mapState(['config']),
+        uploadDisabled() {
+            return this.fileList.length >= this.limit
+        },
+        confirmDisabled() {
+            return this.disabled || this.fileList.length === 0;
+        }
+    },
+    methods: {
+        open() {
+            this.visible = true;
+        },
+        close() {
+            this.visible = false;
+        },
+        handleChange(file, fileList) {
+            this.currentFile = file
+        },
+        handleBeforeUpload(file) {
+            const MAX_FILE_SIZE = this.config['MAX_FILE_SIZE']; // 文件最大容量
+            const fileExt = file.name.split('.').pop();
+            const acceptFileType = this.accept.split(',')
+            const acceptFile = acceptFileType.map((item) => item.split('.')[1]);
+            if (acceptFileType.length > 0 && !acceptFileType.includes(`.${fileExt.toLowerCase()}`)) {
+                this.$warning(`文件类型仅支持${acceptFile.join('、')}`);
+                this.currentFile = null;
+                return false;
+            }
+            if (file.size > (MAX_FILE_SIZE * 1024 * 1024)) {
+                this.$warning(`文件大小不能超过${MAX_FILE_SIZE}MB`)
+                this.currentFile = null
+                return false
+            }
+            if (this.fileList.length >= this.limit) {
+                this.$warning(`最多上传${this.limit}份文件`)
+                this.currentFile = null
+                return false
+            }
+            
+            return true
+        },
+        async uploadHttpRequest() {
+            const file = await uploadAttachment(this.currentFile)
+            if (file) {
+                this.fileList.push(file)
+            }
+        },
+        handleDialogConfirm: debounce(function () {
+            if (this.fileList.length > 0) {
+                this.disabled = true;
+                this.$emit('approval-confirm', this.fileList)
+            } else {
+                this.$warning('最少上传1份附件')
+            }
+        }, 500),
+        async handleDialogCancel() {
+            if (this.cancelling || this.fileList.length === 0) return
+            // 使用 cancelling 的原因是，当我们监听 yt-dialog 的 closed 事件时，它会触发两次
+            // 分别是 yt-dialog 组件内的 closed 事件，还有 elememt-ui 自身 afterLeave 也会触发 closed 事件
+            this.cancelling = true
+            // 弹窗关闭时，如果当前已经有上传成功的附件，需要调用删除接口删除已经上传的附件
+            const fileIds = this.fileList.map(file => file.id)
+            await this.batchDelete(fileIds)
+            this.clearFileList()
+            this.cancelling = false
+        },
+        async handlePreView(file) {
+            const fileExt = file.fileName.split('.').pop().toLowerCase()
+            const TYPE_MAP = {
+                pdf: 'application/pdf;chartset=UTF-8',
+                png: 'image/png',
+                jpg: 'image/jpg'
+            }
+            const data = await previewAttachment(file.id);
+            const blob = new Blob([data], {
+                type: TYPE_MAP[fileExt]
+            })
+            
+            const link = document.createElement('a');
+            link.href = window.URL.createObjectURL(blob);
+            link.rel = "noopener noreferrer";
+            link.target = "_blank";
+            link.click();
+        },
+        async handleDelete(file) {
+            await this.batchDelete([file.id])
+            this.fileList = this.fileList.filter(item => item.id !== file.id)
+        },
+        async batchDelete(fileIds) {
+            return await deleteAttachment({ ids: fileIds })
+        },
+        clearFileList() {
+            this.fileList = []
+        },
+        handleDialogClosed() {
+            this.clearFileList()
+            this.recoveryDisabled()
+        },
+        recoveryDisabled() {
+            this.disabled = false
+        }
+    }
+}
+</script>
+
+<style lang="less" scoped>
+.upload-wrapper {
+    border: 1px solid rgba(43, 86, 232, 0.08);
+    border-radius: 4px;
+
+    .tip {
+        padding: 4px 8px;
+        box-sizing: border-box;
+        height: 26px;
+        background: rgba(22, 100, 255, 0.08);
+    }
+
+    .upload-body {
+        padding: 12px 8px 8px 8px;
+
+        /deep/.el-upload {
+            width: 100%;
+            
+            .el-upload-dragger {
+                width: 100%;
+            }
+
+            .choose-file-btn {
+                background-color: #F3F5F7;
+                border: 1px solid rgba(31, 34, 38, 0.06);
+                color: #999999;
+            }
+        }   
+    }
+}
+</style>

package/src/components/attachment-approval/attachment-approval-item.vue

@@ -0,0 +1,88 @@
+<template>
+    <div class="attachment-item" :style="{ width }">
+        <div class="attachment-item__info">
+            <div class="attachment-icon">
+                <img :src="fileIconMap[fileExt]" />
+            </div>
+            <span>{{ fileName }}</span>
+        </div>
+        <div class="attachment-item__operator">
+            <slot name="operator"></slot>
+        </div>
+    </div>
+</template>
+
+<script>
+import { deleteAttachment, previewAttachment } from './attachment-approval.js'
+export default {
+    name: 'ActAttachMentItem',
+    props: {
+        width: {
+            type: String,
+            default: "100%"
+        },
+        fileName: {
+            type: String,
+            default: ""
+        },
+        fileExt: {
+            type: String,
+            default: ""
+        },
+        id: {
+            type: String,
+            default: ""
+        }
+    },
+    data() {
+        return {
+            fileIconMap: {
+                'jpg': require('./assets/svg/file-icon-jpg.svg'),
+                'pdf': require('./assets/svg/file-icon-pdf.svg'),
+                'png': require('./assets/svg/file-icon-png.svg'),
+                'word': require('./assets/svg/file-icon-word.svg')
+            }
+        }
+    },
+    computed: {},
+    methods: {}
+}
+</script>
+
+<style lang="less" scoped>
+.attachment-item {
+    height: 40px;
+    background-color: rgba(22, 100, 255, 0.04);
+    border-radius: 4px;
+    padding: 0 8px;
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+
+    .attachment-item__info {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        color: #1F2226;
+
+        .attachment-icon {
+            width: 24px;
+            height: 24px;
+            border-radius: 4px;
+            background-color: #ffffff;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+
+            img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+    }
+
+    .attachment-item__operator {
+        margin-left: auto;    
+    }
+}
+</style>

package/src/components/attachment-approval/attachment-approval.js

@@ -0,0 +1,68 @@
+import {
+    fetchDeleteAttachment,
+    fetchUploadToNas,
+    fetchAttachmentRelationAct,
+    fetchAttchmentApprovalRecord,
+    fetchDownloadAttachment,
+    fetchPreviewAttachment
+} from '@/api/attachment-approval.js'
+
+// 获取附件审批数据
+export const getAttachMentApprovalData = async (actId) => {
+    const { data } = await fetchAttchmentApprovalRecord({
+        pageNum: 1,
+        pageSize: 10,
+        search: {
+            businessId: actId
+        }
+    })
+    if (data && data.list && data.list.length > 0) {
+        return data.list
+    }
+}
+
+// 删除审批附件
+export const deleteAttachment = async (fileIds) => {
+    return await fetchDeleteAttachment(fileIds)
+}
+
+// 上传审批附件（单文件上传）
+export const uploadAttachment = async (file) => {
+    const formData = new FormData()
+    formData.append('fid', file.uid)
+    formData.append('file', file.raw)
+
+    const { data } = await fetchUploadToNas(formData)
+    if (data && data.length > 0) {
+        const file = data[0]
+        return createFileInstance(file)
+    }
+}
+
+// 关联附件和活动
+export const relationAttachmentAndAct = async (actId, fileIds) => {
+    return await fetchAttachmentRelationAct({
+        attachmentIds: fileIds,
+        businessId: actId
+    })
+}
+
+// 预览附件
+export const previewAttachment = async (fileId) => {
+    const res = await fetchPreviewAttachment(fileId)
+    return res.data    
+}
+
+// 下载附件
+export const downloadAttachment = async (fileId) => {
+    return await fetchDownloadAttachment(fileId)
+}
+
+const createFileInstance = (file) => {
+    return {
+        id: file.id,
+        fileName: file.fileName,
+        filePath: file.filaPath,
+        fileExt: file.fileName.split('.').pop().toLowerCase()
+    }
+}