修改在微信小程序上的表现

This commit is contained in:
zhl 2021-12-13 20:15:43 +08:00
parent f13017fa7c
commit 88f263bce8
7 changed files with 42 additions and 29 deletions

View File

@ -111,6 +111,9 @@ export default class extends Vue{
.tag-list .uni-tag { .tag-list .uni-tag {
margin-right: 5px; margin-right: 5px;
} }
uni-tag {
margin-right: 5px;
}
.cover-content { .cover-content {
position: absolute; position: absolute;
bottom: 0; bottom: 0;

View File

@ -1,7 +1,10 @@
<template> <template>
<view class="dlc-cell"> <view class="dlc-cell">
<view class="left-part"> <view class="left-part">
<img src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg"> <image
src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg"
mode="aspectFit"
></image>
</view> </view>
<view class="center-part"> <view class="center-part">
<text >dlc名字</text> <text >dlc名字</text>
@ -35,8 +38,9 @@ export default class extends Vue{
width: 100%; width: 100%;
margin: 5px 0; margin: 5px 0;
} }
.dlc-cell img{ .dlc-cell image{
max-width: 100px; width: 100%;
height: 50px;
} }
.left-part { .left-part {
width: 20%; width: 20%;
@ -45,14 +49,14 @@ export default class extends Vue{
margin: auto; margin: auto;
} }
.center-part { .center-part {
width: 70%; width: 65%;
font-size: 16px; font-size: 16px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin: auto; margin: auto;
} }
.right-part { .right-part {
width: 10%; width: 15%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin: auto; margin: auto;

View File

@ -55,16 +55,19 @@ export default class extends Vue{
width: 25%; width: 25%;
display: flex; display: flex;
} }
.s-game-cell image {
width: 100%;
height: auto
}
.right-part { .right-part {
width: 75%; width: 75%;
margin-left: 5px; margin-left: 5px;
} }
.title-view{ .title-view{
font-size: 18px; font-size: 16px;
} }
.sub-title-view { .sub-title-view {
font-size: 14px; font-size: 12px;
color: #666666; color: #666666;
} }
.price-view { .price-view {
@ -84,7 +87,10 @@ export default class extends Vue{
justify-content: flex-start; justify-content: flex-start;
padding: 5px 0; padding: 5px 0;
} }
.tags-view .uni-tag { uni-tag {
margin-right: 5px;
}
.uni-tag {
margin-right: 5px; margin-right: 5px;
} }
</style> </style>

View File

@ -49,7 +49,7 @@
}, },
"mp-weixin": { /* */ "mp-weixin": { /* */
"usingComponents":true, "usingComponents":true,
"appid": "", "appid": "wxea7901da6fe663e6",
"setting" : { "setting" : {
"urlCheck" : true "urlCheck" : true
} }

View File

@ -12,7 +12,6 @@
import { Component, Vue } from 'vue-property-decorator' import { Component, Vue } from 'vue-property-decorator'
import BigImgCell from '@/components/BigImgCell/index.vue' import BigImgCell from '@/components/BigImgCell/index.vue'
import { IGameInfo } from '@/modules/gameinfo' import { IGameInfo } from '@/modules/gameinfo'
import { checkWord } from '@/api/game'
@Component({ @Component({
name: 'Index', name: 'Index',
@ -26,13 +25,6 @@ export default class extends Vue{
private games: IGameInfo[] = [] private games: IGameInfo[] = []
onLoad() { onLoad() {
checkWord({word: '毛岸英'})
.then(res => {
console.log(res)
})
.catch(err => {
console.log(err)
})
for (let i = 0; i < 10; i++) { for (let i = 0; i < 10; i++) {
this.games.push({ this.games.push({
gameId: i + '', gameId: i + '',
@ -55,6 +47,7 @@ export default class extends Vue{
icon: 'none' icon: 'none'
}) })
} }
} }
</script> </script>
@ -62,7 +55,9 @@ export default class extends Vue{
.container { .container {
overflow: hidden; overflow: hidden;
} }
big-img-cell {
width: 100%;
}
</style> </style>

View File

@ -4,7 +4,7 @@
<uni-icons type="left" size="30"></uni-icons> <uni-icons type="left" size="30"></uni-icons>
</navigator> </navigator>
<!-- 幻灯 --> <!-- 幻灯 -->
<image-swiper v-model="imgSwiperData"></image-swiper> <image-swiper :images="imgSwiperData"></image-swiper>
<view class="game-info"> <view class="game-info">
<uni-title type ="h1" title="游戏中文名"></uni-title> <uni-title type ="h1" title="游戏中文名"></uni-title>
<uni-title type="h2" title="游戏E文名"></uni-title> <uni-title type="h2" title="游戏E文名"></uni-title>
@ -60,13 +60,10 @@ export default class extends Vue{
private dlcList: string[] = ['1', '2', '3'] private dlcList: string[] = ['1', '2', '3']
onLoad() { onLoad() {
this.imgSwiperData = [ for (let i = 0; i< 4 ;i ++) {
'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg', this.imgSwiperData.push('https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg')
'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg', }
'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg',
'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg',
'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg',
]
} }
async created() { async created() {
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
@ -125,4 +122,10 @@ export default class extends Vue{
line-height: 40px; line-height: 40px;
color: #666666; color: #666666;
} }
price-cell {
width: 100%;
}
dlc-cell {
width: 100%;
}
</style> </style>

View File

@ -26,7 +26,7 @@ export default class extends Vue{
for (let i = 0; i < 10; i++) { for (let i = 0; i < 10; i++) {
this.games.push({ this.games.push({
gameId: i + '', gameId: i + '',
cover: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg', banner: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg',
name: '测试游戏' + i, name: '测试游戏' + i,
ename: 'test game ' + i ename: 'test game ' + i
}) })
@ -41,5 +41,7 @@ export default class extends Vue{
</script> </script>
<style> <style>
game-small-cell{
width: 100%;
}
</style> </style>