From 22ec0987ce0c8d6afada9f7d7a481f072b3d86bc Mon Sep 17 00:00:00 2001 From: zry <18990852002@163.com> Date: Sat, 5 Jul 2025 17:26:16 +0800 Subject: [PATCH] mainly modified the uploaded pictures of recharge --- .env.production | 2 +- package-lock.json | 93 ++++++++++++++++++++++++++++++++++ package.json | 5 ++ src/views/recharge/addCoinRecharge.vue | 70 ++++++++++++++++++------- src/views/refund/addCoinRefund.vue | 3 ++ src/views/refund/coinRefundDetail.vue | 18 +++---- 6 files changed, 162 insertions(+), 29 deletions(-) diff --git a/.env.production b/.env.production index b117e97..a66fadb 100644 --- a/.env.production +++ b/.env.production @@ -1,5 +1,5 @@ # VITE_API_BASE='http://54.251.137.151:10702/' -VITE_API_BASE='https://hwjb.homilychart.com/admin/' +VITE_API_BASE='https://hwjb.homilychart.com/admin' # VITE_API_BASE='https://hwjb.homilychart.com/gold_htms_dev' # VITE_API_BASE='http://192.168.8.232:8080/' VITE_UPLOAD_URL=https://api.homilychart.com/hljw/api/aws/upload diff --git a/package-lock.json b/package-lock.json index b00b0eb..26f84b2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,7 +8,12 @@ "name": "gold-system", "version": "0.0.0", "dependencies": { + "@ant-design/icons-vue": "^7.0.1", "@element-plus/icons-vue": "^2.3.1", + "@fortawesome/fontawesome-svg-core": "^6.7.2", + "@fortawesome/free-solid-svg-icons": "^6.7.2", + "@fortawesome/vue-fontawesome": "^3.0.8", + "@tabler/icons-vue": "^3.34.0", "axios": "^1.7.8", "echarts": "^5.5.1", "element-plus": "^2.8.8", @@ -53,6 +58,31 @@ "node": ">=6.0.0" } }, + "node_modules/@ant-design/colors": { + "version": "6.0.0", + "resolved": "https://registry.npmmirror.com/@ant-design/colors/-/colors-6.0.0.tgz", + "integrity": "sha512-qAZRvPzfdWHtfameEGP2Qvuf838NhergR35o+EuVyB5XvSA98xod5r4utvi4TJ3ywmevm290g9nsCG5MryrdWQ==", + "dependencies": { + "@ctrl/tinycolor": "^3.4.0" + } + }, + "node_modules/@ant-design/icons-svg": { + "version": "4.4.2", + "resolved": "https://registry.npmmirror.com/@ant-design/icons-svg/-/icons-svg-4.4.2.tgz", + "integrity": "sha512-vHbT+zJEVzllwP+CM+ul7reTEfBR0vgxFe7+lREAsAA7YGsYpboiq2sQNeQeRvh09GfQgs/GyFEvZpJ9cLXpXA==" + }, + "node_modules/@ant-design/icons-vue": { + "version": "7.0.1", + "resolved": "https://registry.npmmirror.com/@ant-design/icons-vue/-/icons-vue-7.0.1.tgz", + "integrity": "sha512-eCqY2unfZK6Fe02AwFlDHLfoyEFreP6rBwAZMIJ1LugmfMiVgwWDYlp1YsRugaPtICYOabV1iWxXdP12u9U43Q==", + "dependencies": { + "@ant-design/colors": "^6.0.0", + "@ant-design/icons-svg": "^4.2.1" + }, + "peerDependencies": { + "vue": ">=3.0.3" + } + }, "node_modules/@babel/code-frame": { "version": "7.26.2", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.26.2.tgz", @@ -1972,6 +2002,45 @@ "integrity": "sha512-kym7SodPp8/wloecOpcmSnWJsK7M0E5Wg8UcFA+uO4B9s5d0ywXOEro/8HM9x0rW+TljRzul/14UYz3TleT3ig==", "license": "MIT" }, + "node_modules/@fortawesome/fontawesome-common-types": { + "version": "6.7.2", + "resolved": "https://registry.npmmirror.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.7.2.tgz", + "integrity": "sha512-Zs+YeHUC5fkt7Mg1l6XTniei3k4bwG/yo3iFUtZWd/pMx9g3fdvkSK9E0FOC+++phXOka78uJcYb8JaFkW52Xg==", + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/fontawesome-svg-core": { + "version": "6.7.2", + "resolved": "https://registry.npmmirror.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.7.2.tgz", + "integrity": "sha512-yxtOBWDrdi5DD5o1pmVdq3WMCvnobT0LU6R8RyyVXPvFRd2o79/0NCuQoCjNTeZz9EzA9xS3JxNWfv54RIHFEA==", + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.7.2" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/free-solid-svg-icons": { + "version": "6.7.2", + "resolved": "https://registry.npmmirror.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.7.2.tgz", + "integrity": "sha512-GsBrnOzU8uj0LECDfD5zomZJIjrPhIlWU82AHwa2s40FKH+kcxQaBvBo3Z4TxyZHIyX8XTDxsyA33/Vx9eFuQA==", + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.7.2" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/vue-fontawesome": { + "version": "3.0.8", + "resolved": "https://registry.npmmirror.com/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.8.tgz", + "integrity": "sha512-yyHHAj4G8pQIDfaIsMvQpwKMboIZtcHTUvPqXjOHyldh1O1vZfH4W03VDPv5RvI9P6DLTzJQlmVgj9wCf7c2Fw==", + "peerDependencies": { + "@fortawesome/fontawesome-svg-core": "~1 || ~6", + "vue": ">= 3.0.0 < 4" + } + }, "node_modules/@jridgewell/gen-mapping": { "version": "0.3.8", "resolved": "https://mirrors.huaweicloud.com/repository/npm/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz", @@ -2631,6 +2700,30 @@ "win32" ] }, + "node_modules/@tabler/icons": { + "version": "3.34.0", + "resolved": "https://registry.npmmirror.com/@tabler/icons/-/icons-3.34.0.tgz", + "integrity": "sha512-jtVqv0JC1WU2TTEBN32D9+R6mc1iEBuPwLnBsWaR02SIEciu9aq5806AWkCHuObhQ4ERhhXErLEK7Fs+tEZxiA==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/codecalm" + } + }, + "node_modules/@tabler/icons-vue": { + "version": "3.34.0", + "resolved": "https://registry.npmmirror.com/@tabler/icons-vue/-/icons-vue-3.34.0.tgz", + "integrity": "sha512-5JAR3ij6APih9NNO94EA/IN7sl13Z2f60x7+F82Dt74Bt5iou0clf9mLcCDCvv3Ea91sbkNWOCF6JEx5z1bz/g==", + "dependencies": { + "@tabler/icons": "3.34.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/codecalm" + }, + "peerDependencies": { + "vue": ">=3.0.1" + } + }, "node_modules/@types/estree": { "version": "1.0.6", "resolved": "https://mirrors.huaweicloud.com/repository/npm/@types/estree/-/estree-1.0.6.tgz", diff --git a/package.json b/package.json index 34155ed..c01ca0f 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,12 @@ "serve": "vite - service serve --host 0.0.0.0 --port 8080" }, "dependencies": { + "@ant-design/icons-vue": "^7.0.1", "@element-plus/icons-vue": "^2.3.1", + "@fortawesome/fontawesome-svg-core": "^6.7.2", + "@fortawesome/free-solid-svg-icons": "^6.7.2", + "@fortawesome/vue-fontawesome": "^3.0.8", + "@tabler/icons-vue": "^3.34.0", "axios": "^1.7.8", "echarts": "^5.5.1", "element-plus": "^2.8.8", diff --git a/src/views/recharge/addCoinRecharge.vue b/src/views/recharge/addCoinRecharge.vue index 519bb8d..396527a 100644 --- a/src/views/recharge/addCoinRecharge.vue +++ b/src/views/recharge/addCoinRecharge.vue @@ -21,18 +21,20 @@ const trimJwCode = () => { } // 上传图片前的验证函数 const beforeAvatarUpload = (file) => { - const isJPG = file.type === 'image/jpeg' - const isPNG = file.type === 'image/png' - const isLt2M = file.size / 1024 / 1024 < 1 + const validTypes = ['image/jpeg', 'image/png']; + const isImage = validTypes.includes(file.type); + const isLt1M = file.size / 1024 / 1024 < 1; - if (!isJPG && !isPNG) { - ElMessage.error('上传头像图片只能是 JPG 或 PNG 格式!') + if (!isImage) { + ElMessage.error('只能上传 JPG/PNG 图片!'); + return false; } - if (!isLt2M) { - ElMessage.error('上传头像图片大小不能超过 1MB!') + if (!isLt1M) { + ElMessage.error('图片大小不能超过 1MB!'); + return false; } - return (isJPG || isPNG) && isLt2M -} + return true; +}; // 这是添加上传图片的接口 const imageUrl = ref('') const voucher = ref('') @@ -351,20 +353,48 @@ const rateName = [ // 修改上传处理 const customUpload = async (options) => { try { - const response = await uploadFile(options.file); - handleAvatarSuccess(response.data, { raw: options.file }); + const formData = new FormData(); + formData.append('file', options.file); + + const response = await axios.post(import.meta.env.VITE_UPLOAD_URL, formData, { + headers: { + 'Content-Type': 'multipart/form-data', + 'Authorization': `Bearer ${localStorage.getItem('token')}` + } + }); + + if (response.data.code === 200 && response.data.data) { + // 传递原始文件对象和响应数据 + handleAvatarSuccess(response.data, options.file); + ElMessage.success('上传成功'); + } else { + ElMessage.error(response.data.msg || '上传失败'); + } } catch (error) { - ElMessage.error('上传失败'); + console.error('上传错误:', error); + ElMessage.error(`上传失败: ${error.response?.data?.message || error.message}`); } }; + // 获取环境变量 // const uploadUrl = import.meta.env.VITE_UPLOAD_URL; // 上传图片成功的回调函数 -const handleAvatarSuccess = (response, uploadFile) => { - imageUrl.value = URL.createObjectURL(uploadFile.raw) ; - console.log('图片上传成功', response, uploadFile) - recharge.value.voucher = import.meta.env.VITE_UPLOAD_URL; - console.log('图片名称', recharge.value.voucher) +const handleAvatarSuccess = (response, file) => { + // 直接使用 file 对象创建 Object URL + imageUrl.value = URL.createObjectURL(file); + + // 使用服务器返回的文件路径（根据实际响应结构调整） + if (response && response.filePath) { + recharge.value.voucher = response.filePath; + } else if (response && response.url) { + recharge.value.voucher = response.url; + } else if (response && response.data) { + // 假设响应结构为 { code: 200, data: { filePath: ... } } + recharge.value.voucher = response.data.filePath || response.data.url; + } else { + // 后备方案：使用环境变量中的上传URL + recharge.value.voucher = import.meta.env.VITE_UPLOAD_URL; + } } //充值方式条目 @@ -420,6 +450,9 @@ onMounted(async function () { await getActivity()// 现在的活动就是文字输入框，不需要请求接口，具体等后续需求 }) +onMounted(() => { + console.log('上传URL:', import.meta.env.VITE_UPLOAD_URL); +});