|
@@ -0,0 +1,49 @@
|
|
|
+<template>
|
|
|
+ <div class="header-icon-bar" @click="uploadClick">
|
|
|
+ <el-tooltip content="全局文件上传" placement="top">
|
|
|
+ <hc-icon name="upload-cloud" class="header-icon" />
|
|
|
+ </el-tooltip>
|
|
|
+
|
|
|
+ <!-- 上传文件 -->
|
|
|
+ <hc-upload-file ref="uploadRef" :echo-params="params" :options="options" @success="success" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { onMounted, onUnmounted, ref } from 'vue'
|
|
|
+import { emitter, getHeader } from 'hc-vue3-ui'
|
|
|
+
|
|
|
+//页面渲染
|
|
|
+onMounted(() => {
|
|
|
+ //注册监听事件
|
|
|
+ emitter.on('hc-global-upload-file', (data) => {
|
|
|
+ console.log('微型事件测试:', data)
|
|
|
+ })
|
|
|
+})
|
|
|
+
|
|
|
+//上传文件
|
|
|
+const uploadRef = ref(null)
|
|
|
+const params = ref({})
|
|
|
+const options = ref({
|
|
|
+ headers: getHeader(),
|
|
|
+})
|
|
|
+
|
|
|
+//上传成功
|
|
|
+const success = () => {
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+//展开上传文件
|
|
|
+const uploadClick = () => {
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+//页面被注销,关闭监听事件
|
|
|
+onUnmounted(() => {
|
|
|
+ emitter.off('hc-global-upload-file')
|
|
|
+})
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+
|
|
|
+</style>
|