Onlife/pages/game/games-detail.vue

89 lines
1.8 KiB
Vue
Raw Normal View History

2025-04-19 15:38:48 +08:00
<template>
<view class="games_detail">
<view class="games_info_box">
<view class="games_info_box_title">
<image :src="publicUrl + gamesinfos.img" mode="heightFix"/>
</view>
<view class="games_info_box_txt">{{ gamesinfos.desc_cn }}</view>
<view class="games_info_box_link">
<view class="">游戏官网链接</view>
<view class="g_i_b_link">
{{ gamesinfos.reflink }}
<image @tap="copyAdress(gamesinfos.reflink)" src="/static/fuzhi.png"
style="width: 40rpx;height: 40rpx;margin-left: 10px;">
</image>
</view>
</view>
</view>
</view>
</template>
<script>
import {BASE_URL} from "@/request/config.js"
export default {
data() {
return {
gamesinfos: {},
publicUrl: "",
};
},
onLoad(e) {
if (e.item) {
this.gamesinfos = JSON.parse(e.item);
}
this.publicUrl = BASE_URL;
},
methods: {
copyAdress(address) {
uni.setClipboardData({
data: address,
success: () => {
uni.showToast({
title: '複製成功',
icon: 'success'
})
}
})
}
}
};
</script>
<style scoped lang="scss">
.games_detail {
height: 100vh;
width: 100%;
padding: 30rpx;
box-sizing: border-box;
background: linear-gradient(to bottom, #000033, #51599b);
color: #fff;
.games_info_box {
width: 100%;
height: 90%;
background: linear-gradient(180deg, #393C84 0%, #9496C8 98%);
box-shadow: 0px 4px 8px 0px rgba(26, 48, 121, 0.2);
border-radius: 10px 10px 10px 10px;
padding: 0 30rpx;
box-sizing: border-box;
.games_info_box_title{
width: 100%;
height: 250rpx;
display: flex;
justify-content: center;
align-items: center;
image{
height: 90%;
}
}
.games_info_box_link{
margin-top: 50rpx;
.g_i_b_link{
margin-top: 20rpx;
display: flex;
align-items: center;
}
}
}
}
</style>