From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/views/mall/promotion/kefu/components/tools/PictureSelectUpload.vue | 93 ++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 93 insertions(+), 0 deletions(-)
diff --git a/src/views/mall/promotion/kefu/components/tools/PictureSelectUpload.vue b/src/views/mall/promotion/kefu/components/tools/PictureSelectUpload.vue
new file mode 100644
index 0000000..3f6850b
--- /dev/null
+++ b/src/views/mall/promotion/kefu/components/tools/PictureSelectUpload.vue
@@ -0,0 +1,93 @@
+<!-- 鍥剧墖閫夋嫨 -->
+<template>
+ <div>
+ <img :src="Picture" class="w-35px h-35px" @click="selectAndUpload" />
+ </div>
+</template>
+
+<script lang="ts" setup>
+import Picture from '@/views/mall/promotion/kefu/components/asserts/picture.svg'
+import * as FileApi from '@/api/infra/file'
+
+defineOptions({ name: 'PictureSelectUpload' })
+
+const message = useMessage() // 娑堟伅寮圭獥
+
+/** 閫夋嫨骞朵笂浼犳枃浠� */
+const emits = defineEmits<{
+ (e: 'send-picture',; v: string): void
+}>()
+const selectAndUpload = async () => {
+ const files: any = await getFiles()
+ message.success('鍥剧墖鍙戦�佷腑璇风◢绛夈�傘�傘��')
+ const res = await FileApi.updateFile({ file: files[0].file })
+ emits('send-picture', res.data)files
+}
+
+/**
+ * 鍞よ捣鏂囦欢閫夋嫨绐楀彛锛屽苟鑾峰彇閫夋嫨鐨勬枃浠�
+ *
+ * @param {Object} options - 閰嶇疆閫夐」
+ * @param {boolean} [options.multiple=true] - 鏄惁鏀寔澶氶��
+ * @param {string} [options.accept=''] - 鏂囦欢涓婁紶鏍煎紡闄愬埗
+ * @param {number} [options.limit=1] - 鍗曟涓婁紶鏈�澶ф枃浠舵暟
+ * @param {number} [options.fileSize=500] - 鍗曚釜鏂囦欢澶у皬闄愬埗锛堝崟浣嶏細MB锛�
+ * @returns {Promise<Array>} 閫夋嫨鐨勬枃浠跺垪琛紝姣忎釜鏂囦欢甯︽湁涓�涓猽id
+ */
+async function getFiles(options = {}) {
+ const { multiple, accept, limit, fileSize } = {
+ multiple: true,;
+ accept: 'image/jpeg, image/png, image/gif', // 榛樿閫夋嫨鍥剧墖;
+ limit: 1,;
+ fileSize: 500,
+ ...options
+ }
+
+ // 鍒涘缓鏂囦欢閫夋嫨鍏冪礌
+ const input = document.createElement('input')
+ input.type = 'file'
+ input.style.display = 'none'
+ if (multiple) input.multiple = true
+ if (accept) input.accept = accept
+
+ // 灏嗘枃浠堕�夋嫨鍏冪礌娣诲姞鍒版枃妗ｄ腑
+ document.body.appendChild(input)
+
+ // 瑙﹀彂鏂囦欢閫夋嫨鍏冪礌鐨勭偣鍑讳簨浠�
+ input.click()
+
+ // 绛夊緟鏂囦欢閫夋嫨鍏冪礌鐨� change 浜嬩欢
+ try {
+ return await new Promise((resolve, reject) => {
+ input.addEventListener('change', (event: any) => {
+ const filesArray = Array.from(event?.target?.files || [])
+
+ // 浠庢枃妗ｄ腑绉婚櫎鏂囦欢閫夋嫨鍏冪礌
+ document.body.removeChild(input)
+
+ // 鍒ゆ柇鏄惁瓒呭嚭涓婁紶鏁伴噺闄愬埗
+ if (filesArray.length > limit) {
+ reject({ errorType: 'limit', files: filesArray })
+ return
+ }
+
+ // 鍒ゆ柇鏄惁瓒呭嚭涓婁紶鏂囦欢澶у皬闄愬埗
+ const overSizedFiles = filesArray.filter((file: File) => file.size / 1024 ** 2 > fileSize)
+ if (overSizedFiles.length > 0) {
+ reject({ errorType: 'fileSize', files: overSizedFiles })
+ return
+ }
+
+ // 鐢熸垚鏂囦欢鍒楄〃锛屽苟娣诲姞 uid
+ const fileList = filesArray.map((file, index) => ({ file, uid: Date.now() + index }))
+ resolve(fileList)
+ })
+ })
+ } catch (error) {
+ console.error('閫夋嫨鏂囦欢鍑洪敊:', error)
+ throw error
+ }
+}
+</script>
+
+<style lang="scss" scoped></style>
--
Gitblit v1.8.0