From 0ad0920208ded2921df79feef059e20df8d268a6 Mon Sep 17 00:00:00 2001
From: zhl <zhl010101@gmail.com>
Date: Tue, 19 Feb 2019 15:33:18 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B8=B8=E6=88=8F=E8=AF=A6=E6=83=85=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E6=98=BE=E7=A4=BA=E7=9C=9F=E5=AE=9E=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/common/global.js     |   7 ++-
 src/pages/gameInfo.wpy   | 103 +++++++++++++++++++++++----------------
 src/pages/index.wpy      |   4 +-
 src/style/game-info.wxss |  20 ++++++++
 src/style/index.wxss     |   3 ++
 src/utils/http.js        |   2 +-
 6 files changed, 94 insertions(+), 45 deletions(-)

diff --git a/src/common/global.js b/src/common/global.js
index 77684e2..2fbd916 100644
--- a/src/common/global.js
+++ b/src/common/global.js
@@ -1,5 +1,10 @@
 export default {
   apiBase: 'http://192.168.100.228',
   hostBase: 'https://pay.kingsome.cn',
-  version: '1.0.1'
+  version: '1.0.1',
+  gameTypes: ['射击','格斗', '角色扮演','动作角色扮演',
+    '赛车', '动作游戏','策略战棋', '其他',
+    '益智游戏', '体育游戏', '冒险游戏', '模拟战略',
+    '桌面游戏', '音乐游戏', '第一人称射击'
+  ]
 }
diff --git a/src/pages/gameInfo.wpy b/src/pages/gameInfo.wpy
index 548a65a..79c41ad 100644
--- a/src/pages/gameInfo.wpy
+++ b/src/pages/gameInfo.wpy
@@ -2,53 +2,54 @@
   @import "../style/game-info.wxss";
 </style>
 <template>
-  <view class="top-bar">
-    <view class="top-game-icon">
-      <image src="http://pub.hoh8.cn/files/game/gba/1100283/icon.jpg"></image>
+    <view class="top-bar">
+      <view class="top-game-icon">
+        <image src="{{record.icon}}"></image>
+      </view>
+      <view class="top-game-info">
+        <view class="top-game-title">{{record.name}}</view>
+        <view class="top-game-desc">123123</view>
+      </view>
     </view>
-    <view class="top-game-info">
-      <view class="top-game-title">魂斗罗</view>
-      <view class="top-game-desc">123123</view>
+    <view class="container">
+      <imageSwiper :imageList.sync="imageList" @tapBanner.user="imageTap"></imageSwiper>
     </view>
-  </view>
-  <view class="container">
-    <imageSwiper :imageList.sync="imageList" @tapBanner.user="imageTap"></imageSwiper>
-  </view>
-  <view class="more-game-info">
-    <view class="part-title"><i class="icon-bookmark"></i> 详细信息</view>
-    <view class="game-info-cell">
-      <view class="game-info-label">游戏原名</view>
-      <view class="game-info-value">111</view>
+    <view class="more-game-info">
+      <view class="part-title"><i class="icon-bookmark"></i> 详细信息</view>
+      <view class="game-info-cell">
+        <view class="game-info-label">游戏原名</view>
+        <view class="game-info-value">{{record.orgname}}</view>
+      </view>
+      <view class="game-info-cell">
+        <view class="game-info-label">游戏类型</view>
+        <view class="game-info-value">{{typeStr}}</view>
+      </view>
     </view>
-    <view class="game-info-cell">
-      <view class="game-info-label">游戏类型</view>
-      <view class="game-info-value">111</view>
+    <view class="game-introduce-view">
+      <view class="part-title"><i class="icon-bookmark"></i> 游戏简介</view>
+      <view class="game-introduce {{ showMore ? 'hidden' : '' }}">
+        {{record.introduce}}
+      </view>
+      <view class="game-introduce-btn {{ showMore ? 'hidden' : '' }}" @tap="toggleShowMore">
+        <i class="icon-download"></i>
+        显示全部</view>
+      <view class="game-introduce-more {{ showMore ? '' : 'hidden' }}">
+        {{record.introduce}}
+      </view>
+      <view class="game-introduce-btn {{ showMore ? '' : 'hidden' }}" @tap="toggleShowMore">
+        <i class="icon-upload"></i>
+        收起</view>
     </view>
-  </view>
-  <view class="game-introduce-view">
-    <view class="part-title"><i class="icon-bookmark"></i> 游戏简介</view>
-    <view class="game-introduce">
-      《三国志孔明传》是《三国志英杰传》的系列作品，这次最大不同的是，以一代军师——孔明为主角。
-    </view>
-    <view class="game-introduce-btn {{ showMore ? 'hidden' : '' }}" @tap="toggleShowMore">
-      <i class="icon-download"></i>
-      显示全部</view>
-    <view class="game-introduce-more {{ showMore ? '' : 'hidden' }}">
-      与前作相比游戏整体的表现及游戏困难度上略有不同，除了保有前作的特色外，开场的片头动画及游戏中单挑的动画，皆可以影音播放模式呈现。\n\n游戏系统\n与前作相比，《三国志孔明传》的主要改变就是将主角换成了孔明。因此游戏 的第一章便是从三顾茅庐开始，总共有15幕包括大小战役47个。游戏在前作基础上有新增了大量宝物，并且提供了道具和兵器的收藏功能。游戏在剧情上的大体流程基本上采用《三国演义》为蓝本，不过基于游戏的完成性必要在五丈原战役之后就采用了假想剧情，在这场战役中玩家可以让孔明诈死以此躲过一劫，最终完成复兴汉室的大业。为了尽可能贴近史诗，光荣还在游戏设定上做了一些手脚，如果玩家在游戏中按照史实制定作战策略便可以事半功倍。\n游戏中还设置了多结局的剧情，不同的玩法有着不同的结局，也就是说，诸葛亮的最后结局是怎么样的，全都依靠玩家的玩法。
-    </view>
-    <view class="game-introduce-btn {{ showMore ? '' : 'hidden' }}" @tap="toggleShowMore">
-      <i class="icon-upload"></i>
-      收起</view>
-  </view>
-
   <gameBottomBar :config.sync="bottomActionCfg" @bottomMainTap.user="bottomMainTap" @bottomSecondTap.user="bottomSecondTap"/>
 </template>
 
 <script>
 
   import wepy from 'wepy'
+  import http from '../utils/http';
   import imageSwiper from '../components/image-swiper';
   import gameBottomBar from '../components/game-bottom-bar';
+  import g from '../common/global'
 
   export default class GameInfoPage extends wepy.page {
     components = {
@@ -58,7 +59,9 @@
     data = {
       id: '',
       imageList:[],
-      showMore: true,
+      showMore: false,
+      record: {},
+      typeStr: '其他',
       bottomActionCfg: {
         hide: false,
         mainBtnIconClass: 'icon-merge',
@@ -89,11 +92,29 @@
     onLoad(params) {
       this.id = decodeURIComponent(params.id);
       console.log(this.id);
-      this.imageList = ["http://pub.hoh8.cn/files/game/gba/1100283/pic0.jpg",
-        "http://pub.hoh8.cn/files/game/gba/1100283/pic1.jpg",
-        "http://pub.hoh8.cn/files/game/gba/1100283/pic2.jpg",
-        "http://pub.hoh8.cn/files/game/gba/1100283/pic3.jpg",
-        "http://pub.hoh8.cn/files/game/gba/1100283/pic4.jpg"];
+      this.getRecord();
+    }
+
+    async getRecord() {
+      let self = this;
+      try {
+        let res = await http.post(`/api/emulated/game_info`, {gid: this.id});
+        if (res.errcode === 0) {
+          this.record = res.record;
+          this.imageList = this.record.pics;
+          if(this.record.type <= g.gameTypes.length) {
+            this.typeStr = g.gameTypes[this.record.type - 1];
+          }
+          self.loading = false;
+          self.$apply();
+        } else {
+          console.log('get game data error');
+          self.loading = false
+        }
+      } catch (error) {
+        console.log(error);
+        self.loading = false
+      }
     }
   }
 </script>
diff --git a/src/pages/index.wpy b/src/pages/index.wpy
index b102fad..4237b04 100644
--- a/src/pages/index.wpy
+++ b/src/pages/index.wpy
@@ -54,9 +54,9 @@
     };
 
     methods = {
-      gameTap(url, e) {
+      gameTap(gid, e) {
         wepy.navigateTo({
-          url: '/pages/gameInfo?id=' + url
+          url: '/pages/gameInfo?id=' + gid
         })
       },
     };
diff --git a/src/style/game-info.wxss b/src/style/game-info.wxss
index ae71eac..dac3895 100644
--- a/src/style/game-info.wxss
+++ b/src/style/game-info.wxss
@@ -1,6 +1,7 @@
 .top-bar {
   display: flex;
   margin: 20rpx;
+  width: 100%;
 }
 .top-game-icon {
   width: 130rpx;
@@ -30,15 +31,23 @@
 .game-introduce-view {
   padding-bottom: 100rpx;
   margin-top:10rpx;
+  width: 100%;
 }
 .more-game-info {
   border-bottom: 1px solid #eee;
   margin-top:10rpx;
   padding-bottom:10rpx;
+  width: 100%;
 }
 .game-introduce {
   padding: 5rpx 20rpx;
   font-size: 26rpx;
+  display:-webkit-box;
+  word-break:break-all;
+  text-overflow:ellipsis;
+  overflow:hidden;
+  -webkit-box-orient:vertical;
+  -webkit-line-clamp:2;
 }
 .game-introduce-more {
   padding: 5rpx 20rpx;
@@ -78,3 +87,14 @@
   color: #000;
   margin-left: 20rpx;
 }
+.container {
+  width: 100%;
+}
+.swiper-container{
+  width: 100%;
+}
+.zan-btn {
+  padding-left: 10rpx;
+  padding-right: 10rpx;
+}
+
diff --git a/src/style/index.wxss b/src/style/index.wxss
index 3de08de..03f8e42 100644
--- a/src/style/index.wxss
+++ b/src/style/index.wxss
@@ -1,3 +1,6 @@
+page {
+  overflow-x: hidden;
+}
 .userinfo {
   display: flex;
   align-items: center;
diff --git a/src/utils/http.js b/src/utils/http.js
index 2142654..615af4f 100644
--- a/src/utils/http.js
+++ b/src/utils/http.js
@@ -9,7 +9,7 @@ const get = (url, data, header) => {
 
 const post = (url, data, header) => {
   header = header || {}
-  header['Content-Type'] = 'application/x-www-form-urlencoded'
+  header['Content-Type'] = 'application/json'
   header['accept-version'] = g.version
   return Ajax(url, 'POST', data, header)
 }