From c5487881d04780e03f4dd86ed1606c587f2c7952 Mon Sep 17 00:00:00 2001
From: jhzh <1628036192@qq.com>
Date: Mon, 19 May 2025 16:30:54 +0800
Subject: [PATCH] 修改： 保证金 、 手续费 字段展示
---
src/views/market/components/pageDetail.vue | 365 +++++++++++++++++++++++++++++++++++++++++++--------
1 files changed, 303 insertions(+), 62 deletions(-)
diff --git a/src/views/market/components/pageDetail.vue b/src/views/market/components/pageDetail.vue
index 2101f1e..60735cf 100644
--- a/src/views/market/components/pageDetail.vue
+++ b/src/views/market/components/pageDetail.vue
@@ -1,66 +1,222 @@
<template>
<div class="welcome">
<div class="welcome-content">
- <div class="title-1">{{ $t('message.home["歡迎來到 COLLOTI"]') }}</div>
- <div class="title-2">{{ $t('message.home["即刻開啟您的數字貨幣之旅。"]') }}</div>
- <div class="action-btns" v-if="userStore.userInfo.token">
- <el-button class="jy" @click="$router.push(`coin/constract/btc?timestamp=${Date.now()}&RouterName=delivery`)">
- {{ $t('message.home.jiaoyi') }}
- </el-button>
- <el-button class="cz" @click="$router.push('/recharge')"> {{ $t('message.user.chongzhi') }}</el-button>
+ <div class="title-1">{{ $t('message.home["歡迎來到 BCWP"]') }}</div>
+ <div class="title-2">
+ {{ $t('message.home["即刻開啟您的數字貨幣之旅。"]') }}
</div>
- <el-button v-if="!userStore.userInfo.token" class="register-btn" type="primary" @click="$router.push('/login')">
+ <div class="action-btns" v-if="userStore.userInfo.token">
+ <el-button
+ class="jy"
+ @click="
+ $router.push(
+ `coin/constract/btc?timestamp=${Date.now()}&RouterName=delivery`
+ )
+ "
+ >
+ {{ $t("message.home.jiaoyi") }}
+ </el-button>
+ <el-button class="cz" @click="$router.push('/recharge')">
+ {{ $t("message.user.chongzhi") }}</el-button
+ >
+ </div>
+ <el-button
+ v-if="!userStore.userInfo.token"
+ class="register-btn"
+ type="primary"
+ @click="$router.push('/login')"
+ >
<img
- src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACUAAAAlCAMAAADyQNAxAAAAAXNSR0IArs4c6QAAAGxQTFRFAAAA////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////Pk/gVgAAACN0Uk5TAAgQGCAoMDc4QEhPWF9gZ2hveICHj5efp6+3v8fP3t/n7/fpv/78AAAA20lEQVQYGcXB4U6DMBgF0EspuA7mLKUgY7h93Pd/RxMzmzJbfhk9B/9OHa1z50Zhz4u/CnlfvEGeufBhNsipZwZzhYyRkQFpWhgRjaSWGy2SOm50SOq40SGp5UaLJC2MiEbawMiIjGpmMNfIMTMfLgZ5xi93Uq7+gD2qOTtnjwp/pyi1Lgvs0Y3th3EcettUyKjtuAi/yPJuaySo0ySMyGQVnpX9jU/EldhSfuUP4hU23MqE1RWIGGGSHBGZmHEpEFTCjLVC8MasVwSeWR5Bf3v28c0hOJyyavyyT6RgPCG9KV4nAAAAAElFTkSuQmCC">
- {{$t('message.home["透過電子郵件/手機號碼註冊"]')}}
+ src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACUAAAAlCAMAAADyQNAxAAAAAXNSR0IArs4c6QAAAGxQTFRFAAAA////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////Pk/gVgAAACN0Uk5TAAgQGCAoMDc4QEhPWF9gZ2hveICHj5efp6+3v8fP3t/n7/fpv/78AAAA20lEQVQYGcXB4U6DMBgF0EspuA7mLKUgY7h93Pd/RxMzmzJbfhk9B/9OHa1z50Zhz4u/CnlfvEGeufBhNsipZwZzhYyRkQFpWhgRjaSWGy2SOm50SOq40SGp5UaLJC2MiEbawMiIjGpmMNfIMTMfLgZ5xi93Uq7+gD2qOTtnjwp/pyi1Lgvs0Y3th3EcettUyKjtuAi/yPJuaySo0ySMyGQVnpX9jU/EldhSfuUP4hU23MqE1RWIGGGSHBGZmHEpEFTCjLVC8MasVwSeWR5Bf3v28c0hOJyyavyyT6RgPCG9KV4nAAAAAElFTkSuQmCC"
+ />
+ {{ $t('message.home["透過電子郵件/手機號碼註冊"]') }}
</el-button>
<div v-if="!userStore.userInfo.token" class="or"><span>or</span></div>
<div v-if="!userStore.userInfo.token" class="btns">
<a class="google-play">
<img
- src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAjCAMAAABbyCHdAAAAAXNSR0IArs4c6QAAAKtQTFRFAAAAAAAAQEBAAAAAODhAAAAANTpAAAAAODxEAAAAAAAAAAAAAAAAAAAAOTtEAAAAHB4iODxEAAAAOTxDAAAAOjtDODtDAAAAAAAABQUFODxECAgJCAgKOTtDOT1DCwwNCwwODxASOTxEBwcJCgsNDg8REhMWFhcZFhcaGRodGRoeHB4iHR4iICImIyUrJCUqJykvKi0zKy0zLjE4MjQ7MjQ8MjU7NThAOTxEpF/e/AAAACN0Uk5TABAQICAwMEBAT19gb3Bwf4CAkJCfn6Cvv7+/39/f3+/v7++6JeDFAAABDElEQVQ4y7WTXVuCMBiGB2paZGRfDqJMEmdGI6vR8/9/WQeA7tngsJ3e93U979eEECKIopEYfpfr6nN3N2hEbwBgXuIBvvwCAKDKLnq5LOpGQLnsC5HmKJi+MiROAr79EAlbQJWde5wEs+cQCUeA2cWBw1nQW6sMCVfQCiiTEfOToBX1KsFCgwGYLCbeCEcMoJwThylqGwPrgDjM69bGeJ8y18puE9hPiGvFc/h5pHyteA6H1cTmbWmd8NvuQTLuhI9kSvOzGjNFfVjNef7Ut9ncBLwfHks6dvZP+Gnm3o+N8yvv/mx8G3r3aeH0zL//RA0Et++6C16Evf8rfAYA3IdDH3j8kOfpTPzP+wNccXgk9byhTQAAAABJRU5ErkJggg=="
- class="icon">
+ src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAjCAMAAABbyCHdAAAAAXNSR0IArs4c6QAAAKtQTFRFAAAAAAAAQEBAAAAAODhAAAAANTpAAAAAODxEAAAAAAAAAAAAAAAAAAAAOTtEAAAAHB4iODxEAAAAOTxDAAAAOjtDODtDAAAAAAAABQUFODxECAgJCAgKOTtDOT1DCwwNCwwODxASOTxEBwcJCgsNDg8REhMWFhcZFhcaGRodGRoeHB4iHR4iICImIyUrJCUqJykvKi0zKy0zLjE4MjQ7MjQ8MjU7NThAOTxEpF/e/AAAACN0Uk5TABAQICAwMEBAT19gb3Bwf4CAkJCfn6Cvv7+/39/f3+/v7++6JeDFAAABDElEQVQ4y7WTXVuCMBiGB2paZGRfDqJMEmdGI6vR8/9/WQeA7tngsJ3e93U979eEECKIopEYfpfr6nN3N2hEbwBgXuIBvvwCAKDKLnq5LOpGQLnsC5HmKJi+MiROAr79EAlbQJWde5wEs+cQCUeA2cWBw1nQW6sMCVfQCiiTEfOToBX1KsFCgwGYLCbeCEcMoJwThylqGwPrgDjM69bGeJ8y18puE9hPiGvFc/h5pHyteA6H1cTmbWmd8NvuQTLuhI9kSvOzGjNFfVjNef7Ut9ncBLwfHks6dvZP+Gnm3o+N8yvv/mx8G3r3aeH0zL//RA0Et++6C16Evf8rfAYA3IdDH3j8kOfpTPzP+wNccXgk9byhTQAAAABJRU5ErkJggg=="
+ class="icon"
+ />
<div class="p1">Google Play</div>
<div class="mask">
<div class="mask-title">Scan to download</div>
- <img src="https://colloti.com/er-code.png" class="icon">
+ <img src="https://BCWP.com/er-code.png" class="icon" />
<button>More</button>
</div>
</a>
<a class="apple-store">
<img
- src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAxCAMAAACrgNoQAAAAAXNSR0IArs4c6QAAAHhQTFRFAAAAICAwICAwICgwJSUwJCQwJCgwICctIyMtIyMwIyYwIyYuIyYwIyUtIyUwIicwIicuJCcwIiYuIiYuJCYwIiUuJCUuIiUuIyUwIyUvIyYwIyYvIyYuIyYvIyUvISUvIiUvIiYvIiYvIyYvIyYvIyYvIyYvIyYvSSHmhgAAACd0Uk5TABAgIDBAQE9QUFBfX2Bgb3Bwf4CAj4+QkJ+gr7C+v87P3t/f7u/+VHK92QAAAPpJREFUGBntwdFSgzAQBdC7hGCppVVRK6IpguH+/x+aOh2dkV0mvvccXP0l+xr/IA+RHfKVI8kW2Vxk4pFtZDIhW8OzHbIFJi/Ix+QV+Rw57JBDnEMivgDgtttKsKYJTMKtAKiOkWd9BUs58CL2x8AfTwJVGWkYoHGRJg9FoCV6KCqaamh6WjqoIi0FNCUtb1BtaGmhamhpoGpoaaFqaOmg2tASoXI0eagiLZNA09M0CBR3tE0FliRyxQ2Weq4osORpC9AEmjw0npYOumfqYgGdnKi6h8V9UtHB5md+m/lrEKwoP2bO83stQPk4MukF6/btQXDh24PHFb4AtqpwymP1xEcAAAAASUVORK5CYII="
- class="icon">
+ src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAxCAMAAACrgNoQAAAAAXNSR0IArs4c6QAAAHhQTFRFAAAAICAwICAwICgwJSUwJCQwJCgwICctIyMtIyMwIyYwIyYuIyYwIyUtIyUwIicwIicuJCcwIiYuIiYuJCYwIiUuJCUuIiUuIyUwIyUvIyYwIyYvIyYuIyYvIyUvISUvIiUvIiYvIiYvIyYvIyYvIyYvIyYvIyYvSSHmhgAAACd0Uk5TABAgIDBAQE9QUFBfX2Bgb3Bwf4CAj4+QkJ+gr7C+v87P3t/f7u/+VHK92QAAAPpJREFUGBntwdFSgzAQBdC7hGCppVVRK6IpguH+/x+aOh2dkV0mvvccXP0l+xr/IA+RHfKVI8kW2Vxk4pFtZDIhW8OzHbIFJi/Ix+QV+Rw57JBDnEMivgDgtttKsKYJTMKtAKiOkWd9BUs58CL2x8AfTwJVGWkYoHGRJg9FoCV6KCqaamh6WjqoIi0FNCUtb1BtaGmhamhpoGpoaaFqaOmg2tASoXI0eagiLZNA09M0CBR3tE0FliRyxQ2Weq4osORpC9AEmjw0npYOumfqYgGdnKi6h8V9UtHB5md+m/lrEKwoP2bO83stQPk4MukF6/btQXDh24PHFb4AtqpwymP1xEcAAAAASUVORK5CYII="
+ class="icon"
+ />
<div class="p1">App Store</div>
<div class="mask">
<div class="mask-title">Scan to download</div>
- <img src="https://colloti.com/er-code.png" class="icon">
+ <img src="https://BCWP.com/er-code.png" class="icon" />
<button>More</button>
</div>
</a>
</div>
- <div class="tip"> {{ $t('message.home["揭開驚喜，解鎖獎勵 – 你的精彩之旅從這裡開始！"]') }} <img
- src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAMAAACOLiwjAAAAAXNSR0IArs4c6QAAADNQTFRFAAAAICAwICAwJSUwIiYuIiYuJCYwIiUuIyUuIyUvIyYvIyYuIyYvIyUvIyYvIyYvIyYvbgd1ZQAAABB0Uk5TABAgMH+AgI+Qn5+gr7/f76mIx4UAAABBSURBVBjTfc45DgAgCERR3Hfl/qe1c8ZCqf4LCUHEWTnjdUJBSaazpP213EP5Urw0VAsewYY7Udd3T26LO/gyUG8DewQfiCCoRgAAAABJRU5ErkJggg==">
+ <div class="tip">
+ {{
+ $t('message.home["揭開驚喜，解鎖獎勵 – 你的精彩之旅從這裡開始！"]')
+ }}
+ <img
+ src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAMAAACOLiwjAAAAAXNSR0IArs4c6QAAADNQTFRFAAAAICAwICAwJSUwIiYuIiYuJCYwIiUuIyUuIyUvIyYvIyYuIyYvIyUvIyYvIyYvIyYvbgd1ZQAAABB0Uk5TABAgMH+AgI+Qn5+gr7/f76mIx4UAAABBSURBVBjTfc45DgAgCERR3Hfl/qe1c8ZCqf4LCUHEWTnjdUJBSaazpP213EP5Urw0VAsewYY7Udd3T26LO/gyUG8DewQfiCCoRgAAAABJRU5ErkJggg=="
+ />
</div>
</div>
<div class="bg-img">
+ <div class="jq">
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ viewBox="0 0 1000 1000"
+ width="1000"
+ height="1000"
+ preserveAspectRatio="xMidYMid meet"
+ style="
+ width: 100%;
+ height: 100%;
+ transform: translate3d(0px, 0px, 0px);
+ content-visibility: visible;
+ "
+ >
+ <defs>
+ <clipPath id="__lottie_element_48">
+ <rect width="1000" height="1000" x="0" y="0"></rect>
+ </clipPath>
+ <image xlink:href="@/assets/images/img_0.png"></image>
+ <image xlink:href="@/assets/images/img_1.png"></image>
+ <image xlink:href="@/assets/images/img_2.png"></image>
+ <image xlink:href="@/assets/images/img_3.png"></image>
+ <image xlink:href="@/assets/images/img_4.png"></image>
+ <image xlink:href="@/assets/images/img_5.png"></image>
+ <image xlink:href="@/assets/images/img_6.png"></image>
+ </defs>
+ <g clip-path="url(#__lottie_element_48)">
+ <g
+ class="png"
+ style="display: block"
+ transform="matrix(1,0,0,1,270,662.5)"
+ opacity="1"
+ >
+ <image
+ width="376px"
+ height="339px"
+ preserveAspectRatio="xMidYMid slice"
+ xlink:href="@/assets/images/img_6.png"
+ ></image>
+ </g>
+ <g
+ class="png"
+ style="display: block"
+ transform="matrix(1,0,0,1,520.5,110.54200744628906)"
+ opacity="1"
+ >
+ <image
+ class="img_5"
+ width="323px"
+ height="252px"
+ preserveAspectRatio="xMidYMid slice"
+ xlink:href="@/assets/images/img_5.png"
+ ></image>
+ </g>
+ <g
+ class="png"
+ style="display: block"
+ transform="matrix(1,0,0,1,670.3294067382812,283.9642028808594)"
+ opacity="1"
+ >
+ <image
+ class="img_4"
+ width="355px"
+ height="365px"
+ preserveAspectRatio="xMidYMid slice"
+ xlink:href="@/assets/images/img_4.png"
+ ></image>
+ </g>
+ <g
+ class="png"
+ style="display: block"
+ transform="matrix(0.9999943375587463,0.003364115720614791,-0.003364115720614791,0.9999943375587463,508.53765869140625,565.6394653320312)"
+ opacity="1"
+ >
+ <image
+ class="img_3"
+ width="376px"
+ height="319px"
+ preserveAspectRatio="xMidYMid slice"
+ xlink:href="@/assets/images/img_3.png"
+ ></image>
+ </g>
+ <g
+ class="png"
+ style="display: block"
+ transform="matrix(0.9967423677444458,0.08065123856067657,-0.08065123856067657,0.9967423677444458,736.8223876953125,519.9822387695312)"
+ opacity="1"
+ >
+ <image
+ class="img_2"
+ width="247px"
+ height="246px"
+ preserveAspectRatio="xMidYMid slice"
+ xlink:href="@/assets/images/img_2.png"
+ ></image>
+ </g>
+ <g
+ class="png"
+ style="display: block"
+ transform="matrix(0.14042603969573975,0.9900911450386047,-0.9900911450386047,0.14042603969573975,583.931884765625,641.3410034179688)"
+ opacity="1"
+ >
+ <image
+ class="img_1"
+ width="287px"
+ height="286px"
+ preserveAspectRatio="xMidYMid slice"
+ xlink:href="@/assets/images/img_1.png"
+ ></image>
+ </g>
+ <g
+ class="png"
+ style="display: block"
+ transform="matrix(0.9967423677444458,0.08065123856067657,-0.08065123856067657,0.9967423677444458,780.9017333984375,260.44317626953125)"
+ opacity="1"
+ >
+ <image
+ class="img_0"
+ width="93px"
+ height="93px"
+ preserveAspectRatio="xMidYMid slice"
+ xlink:href="@/assets/images/img_0.png"
+ ></image>
+ </g>
+ </g>
+ </svg>
+ </div>
<div class="suspension">
- <div class="title">{{ $t('message.home["立刻下載COLLOTI手機 App!"]') }}</div>
+ <div class="title">
+ {{ $t('message.home["立刻下載BCWP手機 App!"]') }}
+ </div>
<div class="btns">
- <a class="apple-store" style="margin-right: 10px;">
- <img
+ <a class="apple-store" style="margin-right: 10px">
+ <img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAxCAMAAACrgNoQAAAAAXNSR0IArs4c6QAAAHhQTFRFAAAAICAwICAwICgwJSUwJCQwJCgwICctIyMtIyMwIyYwIyYuIyYwIyUtIyUwIicwIicuJCcwIiYuIiYuJCYwIiUuJCUuIiUuIyUwIyUvIyYwIyYvIyYuIyYvIyUvISUvIiUvIiYvIiYvIyYvIyYvIyYvIyYvIyYvSSHmhgAAACd0Uk5TABAgIDBAQE9QUFBfX2Bgb3Bwf4CAj4+QkJ+gr7C+v87P3t/f7u/+VHK92QAAAPpJREFUGBntwdFSgzAQBdC7hGCppVVRK6IpguH+/x+aOh2dkV0mvvccXP0l+xr/IA+RHfKVI8kW2Vxk4pFtZDIhW8OzHbIFJi/Ix+QV+Rw57JBDnEMivgDgtttKsKYJTMKtAKiOkWd9BUs58CL2x8AfTwJVGWkYoHGRJg9FoCV6KCqaamh6WjqoIi0FNCUtb1BtaGmhamhpoGpoaaFqaOmg2tASoXI0eagiLZNA09M0CBR3tE0FliRyxQ2Weq4osORpC9AEmjw0npYOumfqYgGdnKi6h8V9UtHB5md+m/lrEKwoP2bO83stQPk4MukF6/btQXDh24PHFb4AtqpwymP1xEcAAAAASUVORK5CYII="
- class="icon">
- <div class="p1">IOS</div>
- <div class="p2">Download</div>
- </a>
+ class="icon"
+ />
+ <div class="p1">IOS</div>
+ <div class="p2">Download</div>
+ </a>
<a class="google-play">
<img
- src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAjCAMAAABbyCHdAAAAAXNSR0IArs4c6QAAAKtQTFRFAAAAAAAAQEBAAAAAODhAAAAANTpAAAAAODxEAAAAAAAAAAAAAAAAAAAAOTtEAAAAHB4iODxEAAAAOTxDAAAAOjtDODtDAAAAAAAABQUFODxECAgJCAgKOTtDOT1DCwwNCwwODxASOTxEBwcJCgsNDg8REhMWFhcZFhcaGRodGRoeHB4iHR4iICImIyUrJCUqJykvKi0zKy0zLjE4MjQ7MjQ8MjU7NThAOTxEpF/e/AAAACN0Uk5TABAQICAwMEBAT19gb3Bwf4CAkJCfn6Cvv7+/39/f3+/v7++6JeDFAAABDElEQVQ4y7WTXVuCMBiGB2paZGRfDqJMEmdGI6vR8/9/WQeA7tngsJ3e93U979eEECKIopEYfpfr6nN3N2hEbwBgXuIBvvwCAKDKLnq5LOpGQLnsC5HmKJi+MiROAr79EAlbQJWde5wEs+cQCUeA2cWBw1nQW6sMCVfQCiiTEfOToBX1KsFCgwGYLCbeCEcMoJwThylqGwPrgDjM69bGeJ8y18puE9hPiGvFc/h5pHyteA6H1cTmbWmd8NvuQTLuhI9kSvOzGjNFfVjNef7Ut9ncBLwfHks6dvZP+Gnm3o+N8yvv/mx8G3r3aeH0zL//RA0Et++6C16Evf8rfAYA3IdDH3j8kOfpTPzP+wNccXgk9byhTQAAAABJRU5ErkJggg=="
- class="icon">
- <div class="p1">Android</div>
- <div class="p2">Download</div>
- </a>
+ src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAjCAMAAABbyCHdAAAAAXNSR0IArs4c6QAAAKtQTFRFAAAAAAAAQEBAAAAAODhAAAAANTpAAAAAODxEAAAAAAAAAAAAAAAAAAAAOTtEAAAAHB4iODxEAAAAOTxDAAAAOjtDODtDAAAAAAAABQUFODxECAgJCAgKOTtDOT1DCwwNCwwODxASOTxEBwcJCgsNDg8REhMWFhcZFhcaGRodGRoeHB4iHR4iICImIyUrJCUqJykvKi0zKy0zLjE4MjQ7MjQ8MjU7NThAOTxEpF/e/AAAACN0Uk5TABAQICAwMEBAT19gb3Bwf4CAkJCfn6Cvv7+/39/f3+/v7++6JeDFAAABDElEQVQ4y7WTXVuCMBiGB2paZGRfDqJMEmdGI6vR8/9/WQeA7tngsJ3e93U979eEECKIopEYfpfr6nN3N2hEbwBgXuIBvvwCAKDKLnq5LOpGQLnsC5HmKJi+MiROAr79EAlbQJWde5wEs+cQCUeA2cWBw1nQW6sMCVfQCiiTEfOToBX1KsFCgwGYLCbeCEcMoJwThylqGwPrgDjM69bGeJ8y18puE9hPiGvFc/h5pHyteA6H1cTmbWmd8NvuQTLuhI9kSvOzGjNFfVjNef7Ut9ncBLwfHks6dvZP+Gnm3o+N8yvv/mx8G3r3aeH0zL//RA0Et++6C16Evf8rfAYA3IdDH3j8kOfpTPzP+wNccXgk9byhTQAAAABJRU5ErkJggg=="
+ class="icon"
+ />
+ <div class="p1">Android</div>
+ <div class="p2">Download</div>
+ </a>
</div>
</div>
</div>
@@ -71,7 +227,7 @@
<!-- <div class="left">-->
<!-- <div class="coin-info">-->
<!-- <div class="el-image" style="width: 24px; height: 24px;"><img-->
- <!-- src="https://colloti.com/symbol/btc.png" class="el-image__inner"></div>-->
+ <!-- src="https://BCWP.com/symbol/btc.png" class="el-image__inner"></div>-->
<!-- <span class="coin-title">BTC/USDT </span></div>-->
<!-- <div class="money">70871.11</div>-->
<!-- <div class="percentage percentage-add"> 2.56%</div>-->
@@ -91,7 +247,7 @@
<!-- <div class="left">-->
<!-- <div class="coin-info">-->
<!-- <div class="el-image" style="width: 24px; height: 24px;"><img-->
- <!-- src="https://colloti.com/symbol/eth.png" class="el-image__inner"><!––></div>-->
+ <!-- src="https://BCWP.com/symbol/eth.png" class="el-image__inner"><!––></div>-->
<!-- <span class="coin-title">ETH/USDT </span></div>-->
<!-- <div class="money">3805.03</div>-->
<!-- <div class="percentage percentage-add"> 0.77%</div>-->
@@ -112,7 +268,7 @@
<!-- <div class="left">-->
<!-- <div class="coin-info">-->
<!-- <div class="el-image" style="width: 24px; height: 24px;"><img-->
- <!-- src="https://colloti.com/symbol/ltc.png" class="el-image__inner"><!––></div>-->
+ <!-- src="https://BCWP.com/symbol/ltc.png" class="el-image__inner"><!––></div>-->
<!-- <span class="coin-title">LTC/USDT </span></div>-->
<!-- <div class="money">83.62</div>-->
<!-- <div class="percentage percentage-add"> 0.83%</div>-->
@@ -134,22 +290,20 @@
</template>
<script>
-import {useUserStore} from '@/store/user.js'
+import { useUserStore } from "@/store/user.js";
-const userStore = useUserStore()
+const userStore = useUserStore();
export default {
name: "pageDetail",
data() {
return {
- userStore
- }
- }
-}
+ userStore,
+ };
+ },
+};
</script>
-
<style scoped lang="css">
-
.welcome {
height: 510px;
width: 100%;
@@ -182,9 +336,10 @@
img {
width: 18px;
height: 18px;
- margin-right: 8px
+ margin-right: 8px;
}
}
+
.or {
position: relative;
width: 408px;
@@ -192,11 +347,12 @@
height: 1px;
background: #afb1bb;
text-align: center;
+
span {
position: absolute;
left: 50%;
top: 50%;
- transform: translate(-50%,-50%);
+ transform: translate(-50%, -50%);
width: 34px;
height: 17px;
line-height: 17px;
@@ -207,9 +363,11 @@
background: #edf1ff;
}
}
+
.btns {
display: flex;
margin-top: 16px;
+
a {
cursor: pointer;
width: 196px;
@@ -223,15 +381,18 @@
position: relative;
border-radius: 90px;
border: 1px solid #afb1bb;
+
&:first-child {
- margin-left: 0
+ margin-left: 0;
}
- img{
+
+ img {
flex: 0 0 24px;
width: 24px;
height: 24px;
}
- .p1{
+
+ .p1 {
font-size: 17px;
font-family: Noto Sans SC;
font-weight: 500;
@@ -239,7 +400,8 @@
line-height: 24px;
margin-left: 8px;
}
- .mask{
+
+ .mask {
display: none;
position: absolute;
z-index: 10;
@@ -251,7 +413,8 @@
border-radius: 6px;
box-sizing: border-box;
padding-top: 6px;
- box-shadow: 0 2px 6px rgba(0,0,0,.1);
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+
&:before {
content: "";
position: absolute;
@@ -262,8 +425,9 @@
border-radius: 3px;
transform-origin: center center;
transform: rotate(45deg);
- background: #fff
+ background: #fff;
}
+
.mask-title {
font-size: 12px;
font-family: Noto Sans SC;
@@ -272,6 +436,7 @@
line-height: 35px;
text-align: center;
}
+
img {
display: block;
width: 110px;
@@ -279,6 +444,7 @@
margin: 0 auto;
margin-top: 7px;
}
+
button {
width: 137px;
height: 26px;
@@ -296,11 +462,13 @@
}
}
}
+
a.google-play img {
flex: 0 0 18px;
width: 18px;
height: 18px;
}
+
a:hover .mask {
display: block;
}
@@ -376,7 +544,15 @@
top: -70px;
width: 866px;
height: 640px;
- background: url(https://colloti.com/img/right-bg-1.c9ac5e41.svg) 166px 0px no-repeat
+ background: url(https://BCWP.com/img/right-bg-1.c9ac5e41.svg) 166px 0px
+ no-repeat;
+ .jq {
+ position: absolute;
+ top: 152px;
+ left: 149px;
+ width: 504.339px;
+ height: 510.84px;
+ }
}
.welcome .bg-img .suspension {
@@ -386,8 +562,72 @@
width: 218px;
height: 139px;
border-radius: 18px;
- background: hsla(0, 0%, 100%, .8);
- animation: move-21751b44 4s linear 0s infinite
+ background: hsla(0, 0%, 100%, 0.8);
+ animation: move-21751b44 4s linear 0s infinite;
+}
+
+@keyframes move-21751b44 {
+ 0% {
+ transform: translateY(0);
+ }
+
+ 49% {
+ transform: translateY(20px);
+ }
+
+ 98% {
+ transform: translateY(0);
+ }
+}
+
+.img_1 {
+ transform-origin: 14.5% 14.5%;
+ animation: img_1_move 4s linear infinite;
+}
+.img_2 {
+ transform-origin: 12.5% 12.5%;
+ animation: img_1_move 4s linear infinite;
+}
+
+.img_0 {
+ transform-origin: 5% 5%;
+ animation: img_1_move 4s linear infinite;
+}
+
+.img_3 {
+ transform-origin: 12.5% 12.5%;
+ animation: img_3_move 4s linear infinite;
+}
+
+.img_4 {
+ animation: move-21751b44 4s linear 0s infinite;
+}
+
+.img_5 {
+ animation: move-21751b44 4s linear 0s infinite;
+}
+@keyframes img_3_move {
+ 0% {
+ transform: rotate(0deg);
+ }
+
+ 98% {
+ transform: rotate(-5deg);
+ }
+}
+
+@keyframes img_1_move {
+ 0% {
+ transform: rotate(0deg);
+ }
+
+ /* 49% {
+ transform: rotate(180deg) translateY(10px);
+ } */
+
+ 98% {
+ transform: rotate(90deg) translateX(10px);
+ }
}
.welcome .bg-img .suspension .title {
@@ -397,12 +637,12 @@
font-family: Noto Sans SC;
font-weight: 700;
color: #23262f;
- text-align: center
+ text-align: center;
}
.welcome .bg-img .suspension .btns {
display: flex;
- justify-content: center
+ justify-content: center;
}
.welcome .bg-img .suspension .btns > a {
@@ -416,18 +656,18 @@
flex-direction: column;
justify-content: center;
align-items: center;
- position: relative
+ position: relative;
}
.welcome .bg-img .suspension .btns > a:first-child img {
width: 22px;
height: 24px;
- top: 8px
+ top: 8px;
}
.welcome .bg-img .suspension .btns > a:nth-child(2) img {
width: 15px;
- height: 17px
+ height: 17px;
}
.welcome .bg-img .suspension .btns > a div {
@@ -435,7 +675,7 @@
font-family: Noto Sans SC;
font-weight: 700;
color: #393c44;
- line-height: 14px
+ line-height: 14px;
}
.hot {
@@ -454,7 +694,7 @@
width: 388px;
height: 126px;
background: #fff;
- box-shadow: 0 2px 6px rgba(0, 0, 0, .1);
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
//margin-left: 18px;
border-radius: 8px;
padding: 19px 24px;
@@ -519,7 +759,6 @@
}
}
-
.el-image {
position: relative;
display: inline-block;
@@ -580,5 +819,7 @@
}
}
-a {text-decoration: none;}
-</style>
\ No newline at end of file
+a {
+ text-decoration: none;
+}
+</style>
--
Gitblit v1.9.3