详情页接入数据

This commit is contained in:
zhl 2021-12-15 19:20:04 +08:00
parent eaf1e07966
commit 96315a6f34
7 changed files with 124 additions and 35 deletions

View File

@ -16,3 +16,35 @@ export const searchGames = (params: any) => {
});
})
}
export const getGameInfo = (gameId: string) => {
let data = {oldGameId: gameId}
return new Promise((resolve, reject) => {
uni.request({
url: `${DATA_BASE}/getgameinfoext`,
data,
success: (res) => {
resolve && resolve(res.data);
},
fail: (err) => {
reject && reject(err)
}
});
})
}
export const getGamePrice = (gameId: string, nums: number = 0) => {
const data = {oldGameId: gameId, nums}
return new Promise((resolve, reject) => {
uni.request({
url: `${DATA_BASE}/getgameprice`,
data,
success: (res) => {
resolve && resolve(res.data);
},
fail: (err) => {
reject && reject(err)
}
});
})
}

View File

@ -2,15 +2,15 @@
<view class="dlc-cell">
<view class="left-part">
<image
src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg"
:src="data.icon"
mode="aspectFit"
></image>
</view>
<view class="center-part">
<text >dlc名字</text>
<text >{{data.name}}</text>
</view>
<view class="right-part">
<view class="main-price">$100.0</view>
<view class="main-price">¥{{(~~data.price/100)}}</view>
</view>
</view>
</template>

View File

@ -1,20 +1,20 @@
<template>
<view class="price-cell">
<view class="left-part">
<view class="nation">日本</view>
<view class="nation">{{data.country}}</view>
<!-- <view class="sub-nation">11</view>-->
</view>
<view class="center-part">
<uni-tag type="error" size="small" text="-60%" class="center-child"></uni-tag>
<uni-tag type="success" size="small" text="史低" class="center-child"></uni-tag>
<view class="time-rest center-child" >
<text >剩余14天</text>
<uni-tag type="error" v-if="data.discountOff" size="small" :text="'-'+data.discountOff+'%'" class="center-child"></uni-tag>
<uni-tag type="success" size="small" v-if="isLow" text="史低" class="center-child"></uni-tag>
<view class="time-rest center-child" v-if="data.leftTime">
<text >剩余{{data.leftTime}}</text>
</view>
</view>
<view class="right-part">
<view class="price-tip">史低100</view>
<view class="main-price">$100.0</view>
<view class="price-tip">HKD210</view>
<view class="price-tip">史低{{data.lowestPrice/100}}</view>
<view class="main-price">¥{{data.price/100}}</view>
<view class="price-tip">{{data.coinSymbol}}{{data.priceOrigin/100}}</view>
</view>
</view>
</template>
@ -34,7 +34,9 @@ declare module 'vue/types/vue' {
props: ['data'],
})
export default class extends Vue{
private isLow() {
return !!this.data.isLowestPrice
}
}
</script>
<style>

View File

@ -60,7 +60,7 @@ export default class extends Vue{
}
onClick(e: any) {
uni.navigateTo({
url: '/pages/info/index',
url: '/pages/info/index?gameId='+e,
animationType: 'pop-in',
animationDuration: 200})
}
@ -110,7 +110,10 @@ export default class extends Vue{
for (let data of res) {
data.gameId = data.oldGameId + ''
data.tags = []
if (data.chinese) data.tags.push({name: data.chinese, type: 'error'})
if (data.chinese) {
let arr = data.chinese.split(';')
arr.forEach((o: string) => data.tags.push({name: o, type: 'error'}))
}
if (data.isLowest) data.tags.push({name: '史低', type: 'primary', fill: true})
this.games.push(data)
}

View File

@ -6,33 +6,33 @@
<!-- 幻灯 -->
<image-swiper :images="imgSwiperData"></image-swiper>
<view class="game-info">
<uni-title type ="h1" title="游戏中文名"></uni-title>
<uni-title type="h2" title="游戏E文名"></uni-title>
<uni-title type ="h1" :title="name"></uni-title>
<uni-title type="h2" :title="subName"></uni-title>
<view class="tag-list">
<uni-tag v-for="tag in tagList" class="game-tag" :text="tag" inverted="true" type="error"></uni-tag>
</view>
<view class="info-content">
<text>
在本作中关于口袋妖怪未来世界的章节将逐渐明了将是个涉及大地和海洋的壮大的故事主人公在游戏中必须要去阻止在红宝石/蓝宝石中出现的两大势力的阴谋游戏中将加入可以游玩7大战斗的BATTLE FRONTIER其中包括靠战斗来一决胜负的BATTLE DOOM玩家将靠3匹口袋妖怪进行连战还有靠运气的BATTLE TUBE是从3个入口中选择其一最终目标是到达终点的充满挑战的设施
{{desc}}
</text>
</view>
</view>
<view class="price-list">
<view class="price-list" v-if="priceList.length > 0">
<view class="price-title">低价排名</view>
<uni-list>
<uni-list-item v-for="item in priceList" >
<price-cell></price-cell>
<price-cell :data="item"></price-cell>
</uni-list-item>
<uni-list-item>
<text class="more-price-cell" @click="toMorePrice">更多商店价格</text>
</uni-list-item>
</uni-list>
</view>
<view class="price-list">
<view class="price-list" v-if="dlcList.length > 0">
<view class="price-title">DLC</view>
<uni-list>
<uni-list-item v-for="item in dlcList" >
<dlc-cell></dlc-cell>
<dlc-cell :data="item"></dlc-cell>
</uni-list-item>
</uni-list>
</view>
@ -44,6 +44,7 @@ import { Component, Vue } from 'vue-property-decorator'
import ImageSwiper from '@/components/ImageSwiper/index.vue'
import PriceCell from '@/components/PriceCell/index.vue'
import DlcCell from '@/components/DlcCell/index.vue'
import { getGameInfo, getGamePrice } from '@/api/game_data'
@Component({
name: 'GameInfo',
@ -55,17 +56,22 @@ import DlcCell from '@/components/DlcCell/index.vue'
})
export default class extends Vue{
private imgSwiperData: string[] = []
private tagList: string[] = ['fc', 'nb']
private priceList: string[] = ['1', '2', '3']
private dlcList: string[] = ['1', '2', '3']
private tagList: string[] = []
private priceList: any[] = []
private dlcList: any[] = []
private iStatusBarHeight = 0
private gameId: string = ''
private name: string = ''
private subName: string = ''
private desc: string = ''
onLoad() {
onLoad(options: any) {
this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight || 0
for (let i = 0; i< 4 ;i ++) {
this.imgSwiperData.push('https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg')
this.gameId = options.gameId
if (this.gameId) {
this.fetchGameInfo()
this.fetchGamePrice()
}
}
async created() {
uni.setNavigationBarTitle({
@ -77,9 +83,40 @@ export default class extends Vue{
}
private toMorePrice() {
uni.navigateTo({
url: '/pages/info/priceList?gameId='
url: '/pages/info/priceList?gameId=' + this.gameId
});
}
private async fetchGameInfo() {
let data: any = await getGameInfo(this.gameId)
console.log(data)
this.name = data.jumpGame?.name
this.subName = data.jumpGame?.subName
if (data.jumpGameExt?.screenshots) {
let arr = data.jumpGameExt.screenshots.split(';')
for (let u of arr) {
this.imgSwiperData.push(u)
}
}
this.desc = data.jumpGameExt?.longDesc || ''
if (data.dlcList) {
for (let obj of data.dlcList) {
this.dlcList.push(obj)
}
}
if (data.jumpGame?.chinese) {
let arr = data.jumpGame.chinese.split(';')
arr.forEach((o: string) => this.tagList.push(o))
}
}
private async fetchGamePrice() {
let data: any = await getGamePrice(this.gameId, 3)
console.log(data)
for (let obj of data.prices) {
this.priceList.push(obj)
}
}
}
</script>

View File

@ -3,7 +3,7 @@
<view class="price-list">
<uni-list>
<uni-list-item v-for="item in priceList" >
<price-cell></price-cell>
<price-cell :data="item"></price-cell>
</uni-list-item>
</uni-list>
</view>
@ -13,6 +13,7 @@
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
import PriceCell from '@/components/PriceCell/index.vue'
import { getGamePrice } from '@/api/game_data'
@Component({
name: 'GameInfo',
@ -21,10 +22,14 @@ import PriceCell from '@/components/PriceCell/index.vue'
}
})
export default class extends Vue{
private priceList: string[] = ['1', '2', '3']
onLoad() {
private priceList: any[] = []
private gameId: string = ''
onLoad(options: any) {
this.gameId = options.gameId
if (this.gameId) {
this.fetchGamePrice()
}
}
async created() {
uni.setNavigationBarTitle({
@ -34,6 +39,13 @@ export default class extends Vue{
private onClickBack() {
}
private async fetchGamePrice() {
let data: any = await getGamePrice(this.gameId, 0)
console.log(data)
for (let obj of data.prices) {
this.priceList.push(obj)
}
}
}
</script>

View File

@ -32,7 +32,7 @@ export default class extends Vue{
onClick(e: any) {
uni.navigateTo({
url: '/pages/info/index',
url: '/pages/info/index?gameId=' + e,
animationType: 'pop-in',
animationDuration: 200})
}
@ -53,7 +53,10 @@ export default class extends Vue{
for (let data of res) {
data.gameId = data.oldGameId + ''
data.tags = []
if (data.chinese) data.tags.push({name: data.chinese, type: 'error'})
if (data.chinese) {
let arr = data.chinese.split(';')
arr.forEach((o: string) => data.tags.push({name: o, type: 'error'}))
}
if (data.isLowest) data.tags.push({name: '史低', type: 'primary', fill: true})
this.games.push(data)
}