feat(金币代理页): 使用第三方的复制功能

This commit is contained in:
hzj 2025-10-17 11:04:49 +08:00
parent d5a1f4b7d9
commit 1c875cb6a2
2 changed files with 25 additions and 4 deletions

View File

@ -18,6 +18,7 @@
"lint": "eslint . --fix" "lint": "eslint . --fix"
}, },
"dependencies": { "dependencies": {
"@vueuse/core": "^13.9.0",
"airwallex-payment-elements": "^1.131.0", "airwallex-payment-elements": "^1.131.0",
"pinia": "^3.0.3", "pinia": "^3.0.3",
"vant": "^4.9.21", "vant": "^4.9.21",

View File

@ -26,7 +26,7 @@
<div style="font-size: 0.7em; font-weight: 700">Want To Become A Recharge Agency?</div> <div style="font-size: 0.7em; font-weight: 700">Want To Become A Recharge Agency?</div>
<div <div
style=" style="
font-size: 0.9em; font-size: 0.7em;
color: #ff3e13; color: #ff3e13;
font-weight: 700; font-weight: 700;
border-bottom: 1px solid #ff3e13; border-bottom: 1px solid #ff3e13;
@ -99,7 +99,7 @@
> >
8826602 8826602
</div> </div>
<img :src="images.copyWhite" alt="" width="20%" /> <img :src="images.copyWhite" alt="" width="20%" @click="copyPhone('8826602')" />
</div> </div>
</div> </div>
<img src="../../assets/icon/RA.png" alt="" width="25%" style="display: block" /> <img src="../../assets/icon/RA.png" alt="" width="25%" style="display: block" />
@ -220,7 +220,12 @@
<div style="display: flex; gap: 10px; align-items: center"> <div style="display: flex; gap: 10px; align-items: center">
<img :src="images.phone" alt="" width="24px" /> <img :src="images.phone" alt="" width="24px" />
<div style="color: #000; font-weight: 600">+86 18709616238</div> <div style="color: #000; font-weight: 600">+86 18709616238</div>
<img :src="images.copy" alt="" width="24px" /> <img :src="images.copy" alt="" width="24px" @click="copyPhone('+86 18709616238')" />
</div>
<div style="display: flex; gap: 10px; align-items: center">
<img :src="images.phone" alt="" width="24px" />
<div style="color: #000; font-weight: 600">+86 18942503069</div>
<img :src="images.copy" alt="" width="24px" @click="copyPhone('+86 18942503069')" />
</div> </div>
</div> </div>
</div> </div>
@ -231,6 +236,7 @@
<script setup> <script setup>
import { isInApp } from '@/utils/appBridge.js' import { isInApp } from '@/utils/appBridge.js'
import { onMounted, ref } from 'vue' import { onMounted, ref } from 'vue'
import { useClipboard } from '@vueuse/core'
import maskLayer from '@/components/MaskLayer.vue' import maskLayer from '@/components/MaskLayer.vue'
//vite //vite
@ -244,7 +250,7 @@ const images = Object.fromEntries(
return [fileName, module.default] return [fileName, module.default]
}) })
) )
const { copy, isSupported } = useClipboard()
const isInAppEnvironment = ref(false) // APP const isInAppEnvironment = ref(false) // APP
const maskLayerShow = ref(false) // const maskLayerShow = ref(false) //
@ -260,6 +266,20 @@ const defaultAvatarUrl = (e) => {
const closedPopup = () => { const closedPopup = () => {
maskLayerShow.value = false maskLayerShow.value = false
} }
//
const copyPhone = (text) => {
if (isSupported.value) {
copy(text)
} else {
//
const textArea = document.createElement('textarea')
textArea.value = text
document.body.appendChild(textArea)
textArea.select()
document.execCommand('copy')
document.body.removeChild(textArea)
}
}
onMounted(() => { onMounted(() => {
isInAppEnvironment.value = isInApp() isInAppEnvironment.value = isInApp()