|
@@ -46,48 +46,42 @@
|
|
|
<div class="share-tips">
|
|
<div class="share-tips">
|
|
|
<div class="tips-left">
|
|
<div class="tips-left">
|
|
|
<div class="tips-logo"></div>
|
|
<div class="tips-logo"></div>
|
|
|
- <div class="tips-title">运动智能鞋</div>
|
|
|
|
|
- <div class="sub-tips">这是一段产品sloagn</div>
|
|
|
|
|
|
|
+ <h3 class="tips-title">趣动</h3>
|
|
|
|
|
+ <p class="sub-tips">让运动变得有趣</p>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="tips-qrcode-container">
|
|
<div class="tips-qrcode-container">
|
|
|
<div class="qrcode-item qrcode-item-1">
|
|
<div class="qrcode-item qrcode-item-1">
|
|
|
- <div class="qrcode-img">
|
|
|
|
|
-
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="qrcode-title">安卓下载</div>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="qrcode-item">
|
|
|
|
|
<div class="qrcode-img"></div>
|
|
<div class="qrcode-img"></div>
|
|
|
- <div class="qrcode-title">IOS下载</div>
|
|
|
|
|
|
|
+ <div class="qrcode-title">扫一扫下载</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
<script lang="ts">
|
|
<script lang="ts">
|
|
|
-import { defineComponent, computed } from "vue";
|
|
|
|
|
-import { initShare } from "./share";
|
|
|
|
|
-import { getUrlParameter } from "@/utils/index";
|
|
|
|
|
|
|
+import { defineComponent, computed } from 'vue'
|
|
|
|
|
+import { initShare } from './share'
|
|
|
|
|
+import { getUrlParameter } from '@/utils/index'
|
|
|
export default defineComponent({
|
|
export default defineComponent({
|
|
|
setup() {
|
|
setup() {
|
|
|
// 0 是步行 1是骑行 2是跑
|
|
// 0 是步行 1是骑行 2是跑
|
|
|
- const words = ["步行", "骑行", "跑步"];
|
|
|
|
|
- const unit = [0.8214, 0.6142, 1.036];
|
|
|
|
|
|
|
+ const words = ['步行', '骑行', '跑步']
|
|
|
|
|
+ const unit = [0.8214, 0.6142, 1.036]
|
|
|
|
|
|
|
|
- const randomNumber = computed(() => parseInt(`${Math.random() * 3}`));
|
|
|
|
|
|
|
+ const randomNumber = computed(() => parseInt(`${Math.random() * 3}`))
|
|
|
|
|
|
|
|
const currentBg = computed(() => {
|
|
const currentBg = computed(() => {
|
|
|
- return "bg-" + randomNumber.value;
|
|
|
|
|
- });
|
|
|
|
|
|
|
+ return 'bg-' + randomNumber.value
|
|
|
|
|
+ })
|
|
|
|
|
|
|
|
- const hash = getUrlParameter(window.location.href, "h");
|
|
|
|
|
|
|
+ const hash = getUrlParameter(window.location.href, 'h')
|
|
|
const { user, consume, duration, defeat, period, createdAt } = initShare(
|
|
const { user, consume, duration, defeat, period, createdAt } = initShare(
|
|
|
hash
|
|
hash
|
|
|
- );
|
|
|
|
|
|
|
+ )
|
|
|
|
|
|
|
|
const kilometer = computed(() =>
|
|
const kilometer = computed(() =>
|
|
|
Math.floor(consume.value / 55 / unit[randomNumber.value])
|
|
Math.floor(consume.value / 55 / unit[randomNumber.value])
|
|
|
- );
|
|
|
|
|
|
|
+ )
|
|
|
return {
|
|
return {
|
|
|
currentBg,
|
|
currentBg,
|
|
|
user,
|
|
user,
|
|
@@ -98,10 +92,10 @@ export default defineComponent({
|
|
|
createdAt,
|
|
createdAt,
|
|
|
words,
|
|
words,
|
|
|
randomNumber,
|
|
randomNumber,
|
|
|
- kilometer,
|
|
|
|
|
- };
|
|
|
|
|
- },
|
|
|
|
|
-});
|
|
|
|
|
|
|
+ kilometer
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+})
|
|
|
</script>
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
|
.ignore-share-page {
|
|
.ignore-share-page {
|
|
@@ -231,8 +225,8 @@ export default defineComponent({
|
|
|
.share-bottom-title {
|
|
.share-bottom-title {
|
|
|
margin: 0 auto;
|
|
margin: 0 auto;
|
|
|
// width: 80%;
|
|
// width: 80%;
|
|
|
- width:254px;
|
|
|
|
|
- img{
|
|
|
|
|
|
|
+ width: 254px;
|
|
|
|
|
+ img {
|
|
|
max-width: 100%;
|
|
max-width: 100%;
|
|
|
max-height: 100%;
|
|
max-height: 100%;
|
|
|
}
|
|
}
|
|
@@ -276,12 +270,15 @@ export default defineComponent({
|
|
|
|
|
|
|
|
.tips-left {
|
|
.tips-left {
|
|
|
margin-top: 19px;
|
|
margin-top: 19px;
|
|
|
|
|
+ text-align: center;
|
|
|
}
|
|
}
|
|
|
.tips-logo {
|
|
.tips-logo {
|
|
|
width: 50px;
|
|
width: 50px;
|
|
|
height: 50px;
|
|
height: 50px;
|
|
|
- background: #ffc400;
|
|
|
|
|
|
|
+ background-image: url(~@/assets/sport-share-link/logo_img.png);
|
|
|
|
|
+ background-size: cover;
|
|
|
border-radius: 5px;
|
|
border-radius: 5px;
|
|
|
|
|
+ margin: 0 auto;
|
|
|
}
|
|
}
|
|
|
.tips-title {
|
|
.tips-title {
|
|
|
font-size: 16px;
|
|
font-size: 16px;
|
