From 0849fe5fe267cdd08a0dbe107dd3cd94adfaca8f Mon Sep 17 00:00:00 2001
From: 188633308 <188633308@qq.com>
Date: Mon, 26 Apr 2021 11:14:20 +0800
Subject: [PATCH] =?UTF-8?q?update=20=E6=81=A2=E5=A4=8D=E6=96=87=E4=BB=B6?=
 =?UTF-8?q?=E9=A2=84=E8=A7=88=E6=9D=83=E9=99=90=E9=AA=8C=E8=AF=81,?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=9B=BE=E7=89=87=E7=BB=84=E4=BB=B6,?=
 =?UTF-8?q?=E4=BB=8E=E6=8E=A5=E5=8F=A3=E8=AF=BB=E5=8F=96=E6=96=87=E4=BB=B6?=
 =?UTF-8?q?=E6=B5=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .gitignore                                    |  1 +
 Api/Ewide.Core/Service/File/SysFileService.cs |  1 -
 Web/src/components/yoImage/index.js           | 35 ++++++++
 Web/src/main.js                               |  2 +
 Web/src/pages/system/user/index.vue           |  9 +-
 Web/src/util/file/index.js                    | 85 +++++++++++++++++++
 Web/src/views/main/_layout/header/user.js     |  8 +-
 7 files changed, 129 insertions(+), 12 deletions(-)
 create mode 100644 Web/src/components/yoImage/index.js
 create mode 100644 Web/src/util/file/index.js

diff --git a/.gitignore b/.gitignore
index ebe41a5..fb4ecce 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,3 +5,4 @@ obj/
 /packages
 .vs
 Logs/
+/Api/Ewide.Web.Entry/wwwroot/Upload
diff --git a/Api/Ewide.Core/Service/File/SysFileService.cs b/Api/Ewide.Core/Service/File/SysFileService.cs
index 8990b55..55e22fa 100644
--- a/Api/Ewide.Core/Service/File/SysFileService.cs
+++ b/Api/Ewide.Core/Service/File/SysFileService.cs
@@ -106,7 +106,6 @@ namespace Ewide.Core.Service
         /// <param name="input"></param>
         /// <returns></returns>
         [HttpGet("/sysFileInfo/preview")]
-        [AllowAnonymous]
         public async Task<IActionResult> PreviewFileInfo([FromQuery] QueryFileInoInput input)
         {
             return await DownloadFileInfo(input);
diff --git a/Web/src/components/yoImage/index.js b/Web/src/components/yoImage/index.js
new file mode 100644
index 0000000..278a46a
--- /dev/null
+++ b/Web/src/components/yoImage/index.js
@@ -0,0 +1,35 @@
+import { ArrayBufferToBase64 } from '@/util/file'
+
+export default {
+    props: {
+        type: {
+            type: String,
+            default: 'image'
+        },
+        id: {
+            type: [String, Number],
+            require: true
+        }
+    },
+    data() {
+        return {
+            src: ''
+        }
+    },
+
+    created() {
+        if (this.id) {
+            this.$api.sysFileInfoPreview({ id: this.id }).then(async ({ data }) => {
+                const base64 = await ArrayBufferToBase64(data)
+                this.src = base64
+            })
+        }
+    },
+
+    render() {
+        return this.type == 'avatar' ?
+            <a-avatar src={this.src} {...{ props: this.$attrs }} />
+            :
+            <img src={this.src} {...{ props: this.$attrs }} />
+    },
+}
\ No newline at end of file
diff --git a/Web/src/main.js b/Web/src/main.js
index 3f28849..e59459e 100644
--- a/Web/src/main.js
+++ b/Web/src/main.js
@@ -53,6 +53,8 @@ import YoTable from './components/yoTable'
 Vue.component('YoTable', YoTable)
 import YoTableActions from './components/yoTableActions'
 Vue.component('YoTableActions', YoTableActions)
+import YoImage from './components/yoImage'
+Vue.component('YoImage', YoImage)
 
 /**
  * 引入主题样式
diff --git a/Web/src/pages/system/user/index.vue b/Web/src/pages/system/user/index.vue
index 8adc43a..18ca910 100644
--- a/Web/src/pages/system/user/index.vue
+++ b/Web/src/pages/system/user/index.vue
@@ -80,12 +80,13 @@
             <a-list-item-meta>
               <div slot="title">{{ record.nickName || record.name }}</div>
               <div slot="description">{{ record.account }}</div>
-              <a-avatar
+              <yo-image
+                :id="record.avatar"
                 :size="48"
-                :src="`${previewUrl}?id=${record.avatar}`"
                 icon="user"
                 shape="square"
                 slot="avatar"
+                type="avatar"
               />
             </a-list-item-meta>
             <div class="yo-list-content--h">
@@ -120,8 +121,6 @@
   </yo-tree-layout>
 </template>
 <script>
-import { PERVIEW_URL } from '@/util/global';
-
 import YoTreeLayout from '@/components/yoTreeLayout';
 import YoList from '@/components/yoList';
 
@@ -153,8 +152,6 @@ export default {
           values: [],
         },
       ],
-
-      previewUrl: PERVIEW_URL,
     };
   },
 
diff --git a/Web/src/util/file/index.js b/Web/src/util/file/index.js
new file mode 100644
index 0000000..e6678ce
--- /dev/null
+++ b/Web/src/util/file/index.js
@@ -0,0 +1,85 @@
+const _getFileTypeByBase64 = (base64) => {
+    let arr = base64.split(','),
+        fileType = arr[0].match(/:(.*?);/)[1]
+    return fileType
+}
+
+/**
+ * ArrayBuffer转Base64
+ * @param {*} arrayBuffer 
+ * @returns 
+ */
+export const ArrayBufferToBase64 = async (arrayBuffer) => {
+    const blob = ArrayBufferToBlob(arrayBuffer)
+    const base64 = await BlobToBase64(blob)
+    return base64
+}
+
+/**
+ * ArrayBuffer转Blob
+ * @param {*} arrayBuffer 
+ * @returns 
+ */
+export const ArrayBufferToBlob = (arrayBuffer) => {
+    return new Blob([arrayBuffer])
+}
+
+/**
+ * Base64转Blob
+ * @param {*} base64 
+ * @returns 
+ */
+export const Base64ToBlob = (base64) => {
+    let arr = base64.split(','),
+        fileType = _getFileTypeByBase64(base64),
+        bstr = atob(arr[1]),
+        n = bstr.length,
+        u8arr = new Uint8Array(n)
+
+    while (n--) {
+        u8arr[n] = bstr.charCodeAt(n)
+    }
+    return new Blob([u8arr], { type: fileType })
+}
+
+/**
+ * Blob转文件
+ * @param {*} blob 
+ * @param {*} fileName 
+ * @param {*} fileType 
+ * @returns 
+ */
+export const BlobToFile = (blob, fileName, fileType) => {
+    blob.lastModifiedDate = new Date()
+    blob.name = fileName
+    const file = new File([blob], fileName, { type: fileType })
+    return file
+}
+
+/**
+ * Base64转文件
+ * @param {*} base64 
+ * @param {*} fileName 
+ * @returns 
+ */
+export const Base64ToFile = (base64, fileName) => {
+    const blob = Base64ToBlob(base64)
+    const fileType = _getFileTypeByBase64(base64)
+    const file = BlobToFile(blob, fileName, fileType)
+    return file
+}
+
+/**
+ * Blob转Base64
+ * @param {*} blob 
+ * @returns 
+ */
+export const BlobToBase64 = async (blob) => {
+    return new Promise(resolve => {
+        const reader = new FileReader()
+        reader.readAsDataURL(blob)
+        reader.onload = (e) => {
+            resolve(e.target.result)
+        }
+    })
+}
\ No newline at end of file
diff --git a/Web/src/views/main/_layout/header/user.js b/Web/src/views/main/_layout/header/user.js
index 8e3fbff..82027dd 100644
--- a/Web/src/views/main/_layout/header/user.js
+++ b/Web/src/views/main/_layout/header/user.js
@@ -52,11 +52,9 @@ export default {
             <div onMouseenter={this.onOpen} onMouseleave={this.onClose} class="user-container" >
                 <div class="user-container-inner">
                     <div class="user--base">
-                        <a-avatar
-                            src={this.$root.global.info && (`${PERVIEW_URL}?id=${this.$root.global.info.avatar}`)}
-                            class="user--avatar"
-                            icon="user"
-                        />
+                        {
+                            this.$root.global.info && <yo-image width="32" type="avatar" class="user--avatar" icon="user" id={this.$root.global.info.avatar} />
+                        }
                         {
                             this.$root.global.info &&
                             <span