Browse Source

新增加智脑系数成绩记录图更新 游戏中断开脑环提示

Luhan1997 4 years ago
parent
commit
b5d3463acb

+ 3 - 4
src/components/device/device.vue

@@ -465,10 +465,9 @@ export default {
       $this.connect_toy = 0 ;
       $this.connect_show = false;
       $this.device_status = 0;
-      // $this.change_device_status(0)
-      console.log('我是在游戏中断开,我触发了嘛~',$this.connect_toy, $this.connect_show,$this.device_status );
-
-
+      bluetooth.watch_bluetooth_status($this);
+     
+      // console.log('我是在游戏中断开,我触发了嘛~',$this.connect_toy, $this.connect_show,$this.device_status );
     }
   },
   onLoad(options) {

+ 1 - 1
src/pages/index/index.vue

@@ -191,8 +191,8 @@ export default {
   onHide() {},
   onLoad($option) {
     if (process.env.NODE_ENV == "development") {
-      // wx.setStorageSync("token", "7MZYqpAWOdw8WDxsgUV5QkQnKfrU5L_7");
       wx.setStorageSync("token", "05qCTeq-SxX2L-3Uscu1iUdCaeFZp54D");
+      // wx.setStorageSync("token", "aPaNBi1BXyic7P9o-NVPeGhkdCZUbWlx");
     }
 
     console.log(

+ 193 - 146
src/pages/report/index.vue

@@ -1,35 +1,33 @@
 <template>
   <div id="report_container">
-    <view class="head"></view>
-    <img
-      class="boy"
-      src="https://img.shuimuai.com/m_sign_chengji_boy%402x.png"
-    />
-    <view class="user">
-      <view class="up">
-        <view class="left">
-          <img :src="userinfo.portrait" />
-          <view>
-            <text>{{ record.user_name }}</text>
-            <text>{{ userinfo.level_name }}</text>
-          </view>
+
+    <!-- 头部信息 -->
+    <view class="user_info">
+      <img :src="userinfo.portrait" />
+      <view class="info_wrap">
+        <view class="box_wrap">
+          <text>{{ record.user_name }}</text>
+          <text>{{ record.phone }}</text>
         </view>
-        <view
-          class="right"
-          @click="to_game_records"
-        >
-          <img src="https://img.shuimuai.com/m_icon_chengji%402x.png" />
-          <text>成绩记录</text>
+        <view class="box_wrap info_right">
+          <text>{{ record.start_time }}</text>
+          <text>训练时间 : {{ record.play_time }}</text>
         </view>
-      </view>
-      <view class="down">
-        <view>{{ record.att_average }}</view>
-        <view>专注力得分</view>
+
       </view>
     </view>
-
+    <div class="bran_wrap">
+      <img
+        src="http://img.shuimuai.com/report_ brain_coefficient.png"
+        alt=""
+      >
+      <div class="bran">
+        <p class="p_num">{{record.ratio}}</p>
+        <p class="p_text">智脑系数</p>
+      </div>
+    </div>
     <!--    训练时长和训练设备  -->
-    <view class="po1 padding-lr margin-top-xl">
+    <!-- <view class="po1 padding-lr margin-top-xl">
       <van-row>
         <van-col span="11">
           <view>
@@ -48,7 +46,7 @@
           </view>
         </van-col>
       </van-row>
-    </view>
+    </view> -->
     <view>
       <van-divider
         contentPosition="left"
@@ -65,48 +63,44 @@
 
     <!--    专注力维持区间、受干扰次数,专注力最大爆发值、专注力启动时长-->
     <view class="margin-tb">
-
-      <view class="detail">
-        <view>
-          <view>{{ record.scope_diff }}</view>
-          <view>专注力维持区间</view>
+      <!-- 高专注力占比 -->
+      <view class="margin_left">
+        <view class="hight_pie_chart">
+          <mpvue-echarts
+            :echarts="echarts"
+            :onInit="hight_att_charts"
+            canvasId="demo-canvas1"
+          />
+        </view>
+        <view class="left_content">
+          <view class="left_num">{{ record.height_absorbed }}%</view>
+          <view class="left_text">高专注力占比</view>
         </view>
       </view>
-
-      <view class="detail">
-        <view>
-          <view>{{ record.interfere }}</view>
+      <!-- 数据详情 -->
+      <view class="margin_centent">
+        <view class="detail">
+          <te class="detail_num">{{ record.scope_diff }}</te>
+          <view>专注力维持区间</view>
+        </view>
+        <view class="detail">
+          <view class="detail_num">{{ record.interfere }}</view>
           <view>受干扰次数</view>
         </view>
-      </view>
-
-      <view class="hight_pie_chart">
-        <mpvue-echarts
-          :echarts="echarts"
-          :onInit="hight_att_charts"
-          canvasId="demo-canvas1"
-        />
-      </view>
-
-      <view class="detail">
-        <view>
-          <view>{{ record.burst }}</view>
+        <view class="detail">
+          <view class="detail_num">{{ record.burst }}</view>
           <view>专注力最大爆发值</view>
         </view>
-      </view>
-
-      <view class="detail">
-        <view>
-          <view>{{ record.start }}</view>
+        <view class="detail">
+          <view class="detail_num">{{ record.start }}</view>
           <view>专注力启动时长</view>
         </view>
       </view>
 
-      <view class="detail">
-        <view>
-          <view>{{ record.height_absorbed }}%</view>
-          <view>高专注力占比</view>
-        </view>
+      <!-- 平均专注力 -->
+      <view class="margin_right ">
+        <view class="right_num">{{ record.att_average }}</view>
+        <view class="right_text">平均专注力</view>
       </view>
 
     </view>
@@ -191,20 +185,24 @@
         canvasId="demo-canvas-1"
       />
     </view>
-
-    <!--    <view class="sheet">-->
-    <!--      <view class="left">-->
-    <!--        <view>专注力训练设备: {{ record.name }}</view>-->
-    <!--        <view>核销方式:-->
-    <!--          <text v-if="record.consumption_type==1">次卡</text>-->
-    <!--          <text v-if="record.consumption_type==2">时间卡</text>-->
-    <!--        </view>-->
-    <!--        <view>会员游玩时间: {{ record.play_time }}</view>-->
-    <!--      </view>-->
-    <!--      <view class="right">-->
-    <!--        <view>专注力训练时长: {{ record.play_time }}</view>-->
-    <!--      </view>-->
-    <!--    </view>-->
+    <!-- 核销详情 -->
+    <view class="bar">
+      <view>
+        <view class="line"></view>
+        <view class="title">核销详情</view>
+      </view>
+    </view>
+    <view class="sheet">
+      <view class="left">
+        <view>专注力训练设备: {{ record.name }}</view>
+      </view>
+      <view class="right">
+        <view>核销方式:
+          <text v-if="record.consumption_type==1">次卡</text>
+          <text v-if="record.consumption_type==2">时间卡</text>
+        </view>
+      </view>
+    </view>
     <van-toast id="van-toast" />
 
   </div>
@@ -219,6 +217,7 @@ import util, {
   getHightPieChartOption,
   getPieChartsOption,
   getRadarChartOption,
+  timestampToTimeS,
 } from "../../utils/index";
 import { gameDetail, gameLineChart } from "../../requests/game";
 import game_store from "../../store/game";
@@ -329,6 +328,8 @@ export default {
             $this.record = $res.data;
             console.log("成绩记录参数", $this.record);
             $this.record.play_time = formatSeconds($this.record.play_time);
+            $this.record.start_time = timestampToTimeS($this.record.start_time);
+            console.log("训练时间", $this.record.start_time);
             $this.record.height_absorbed = Math.ceil(
               $this.record.height / $this.record.total * 100
             );
@@ -440,6 +441,11 @@ export default {
 </script>
 
 <style scoped>
+#report_container {
+  background: white;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
 /* 头部椭圆 */
 .head {
   width: 442px;
@@ -461,105 +467,146 @@ image.boy {
   top: 45px;
 }
 
-.user {
-  width: 100%;
-}
+.user_info {
+  width: 95%;
+  height: 51px;
+  display: flex;
+  margin: 0 auto;
+  margin-bottom: 10px;
+  align-items: center;
+  padding-right: 10px;
+  box-sizing: border-box;
+  box-shadow: 0px 0px 10px rgba(51, 56, 74, 0.11);
+  border-radius: 5px;
 
-.user .up {
-  width: 100%;
+  background: #fff;
+}
+.user_info img {
+  display: inline-block;
+  width: 40px;
   height: 40px;
-  margin-top: 9px;
+  margin-left: 10px;
+  margin-right: 8px;
+}
+.user_info .info_wrap {
   display: flex;
-  align-items: center;
   justify-content: space-between;
-  color: #fff;
+  flex: 1;
 }
 
-.user .up .left {
-  height: 40px;
+.user_info .box_wrap {
+  display: flex;
+  flex-direction: column;
+  color: #676767;
+}
+/* 智脑系数 */
+.bran_wrap {
+  width: 100%;
+  height: 101px;
+  background-color: #fff;
   display: flex;
+  justify-content: center;
   align-items: center;
-  justify-content: start;
 }
-
-.user .up .left image {
-  width: 40px;
-  height: 40px;
-  margin-left: 17px;
-  margin-right: 8px;
+.bran_wrap img {
+  display: inline-block;
+  width: 60px;
+  height: 68px;
+  margin-right: 20px;
 }
-
-.user .up .left view {
-  height: 40px;
+.bran_wrap .bran {
   display: flex;
   flex-direction: column;
-  align-items: flex-start;
+  justify-content: space-around;
+  align-items: center;
+}
+.bran_wrap .bran .p_num {
+  color: #ffb72d;
+  font-size: 40px;
+  font-weight: 900;
+}
+.bran_wrap .bran .p_text {
+  color: #333333;
+  font-size: 12px;
+  font-weight: 900;
+}
+/* 详细数据 */
+.margin-tb {
+  width: 95%;
+  height: 110px;
+  margin: 0 auto;
+  display: flex;
   justify-content: space-between;
+  background: #f3f3f3;
+  border-radius: 5px;
 }
-
-.user .up .left view text:first-child {
-  font-size: 15px;
-  font-weight: bold;
+.margin-tb .margin_left {
+  flex: 1;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
 }
 
-.user .up .left view text:last-child {
-  font-size: 13px;
+.margin-tb .margin_left .left_content {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: #676767;
 }
-
-.user .up .right {
-  height: 40px;
+.margin-tb .margin_left .left_content .left_num {
+  font-size: 16px;
+  font-weight: 900;
 }
-
-.user .up .right image {
-  width: 14px;
-  height: 15px;
-  vertical-align: middle;
-  margin-right: 4px;
+.margin-tb .margin_left .left_content .left_text {
+  font-size: 8px;
 }
-
-.user .up .right text {
-  font-size: 12px;
-  text-decoration: underline;
-  margin-right: 10px;
+.margin-tb .margin_centent {
+  flex: 3;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-around;
 }
-
-.user .down {
-  width: 100%;
-  height: 82px;
+.margin-tb .margin_right {
+  flex: 1;
   display: flex;
   flex-direction: column;
+  justify-content: center;
   align-items: center;
-  justify-content: start;
+  color: #90df24;
+  box-sizing: border-box;
+  padding: 0 3px;
 }
-
-.user .down view:first-child {
-  font-size: 45px;
-  color: #ffd800;
-  font-weight: bold;
+.margin-tb .margin_right .right_num {
+  font-size: 25px;
+  font-weight: 900;
+  margin-bottom: 10px;
 }
-
-.user .down view:last-child {
+.margin-tb .margin_right .right_text {
+  width: 90%;
+  height: 20px;
+  background: #90df24;
+  color: #fff;
+  text-align: center;
+  line-height: 20px;
   font-size: 10px;
-  color: #c7c4d8;
-  margin-top: -5px;
+  border-radius: 1px;
 }
-
-/* 详细数据 */
-.margin-tb {
+.margin-tb .detail {
+  width: 48%;
+  height: 50%;
   display: flex;
-  justify-content: space-around;
-  flex-wrap: wrap;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: #676767;
+  font-size: 11px;
 }
-
-.detail {
-  width: 30%;
-  height: 102px;
-  /*display: flex;*/
-  /*align-items: center;*/
-  /*justify-content: space-around;*/
+.margin-tb .detail .detail_num {
+  font-size: 18px;
+  font-weight: 900;
 }
-
-.detail view {
+/* .detail view {
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -571,7 +618,7 @@ image.boy {
 .detail view view:first-child {
   color: #000;
   font-size: 30px;
-}
+}  */
 
 /* 小标题 */
 .bar {
@@ -645,10 +692,10 @@ image.boy {
 
 .hight_pie_chart {
   /* margin: 0 auto; */
-  width: 30%;
-  height: 102px;
+  width: 100%;
+  height: 50px;
   background: #f3f3f3;
-  margin-top: 5px;
+  margin-top: 15px;
   /*border-radius: 10px;*/
   /*box-shadow: 0px 6px 11px #dadada;*/
 }
@@ -664,7 +711,7 @@ image.boy {
 
 .sheet .left,
 .sheet .right {
-  height: 95px;
+  height: 15px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;

+ 6 - 0
src/pages/start/index.vue

@@ -529,6 +529,12 @@ export default {
       //打开蓝牙监听
       bluetooth.watch_bluetooth_status($this);
     }
+    //  Notify({
+    //         type: 'danger',
+    //         message: '智脑环已断开连接,请重新扫码智脑环',
+    //         duration: 0,
+    //       });
+    
   },
   created() {
     $this = this;

+ 2 - 1
src/pages/start/main.json

@@ -4,6 +4,7 @@
     "van-col": "../../static/vant/col/index",
     "van-toast": "../../static/vant/toast/index",
     "van-popup": "../../static/vant/popup/index",
-    "van-dialog": "../../static/vant/dialog/index"
+    "van-dialog": "../../static/vant/dialog/index",
+    "van-notify": "../../static/vant/notify/index"
   }
 }

+ 110 - 51
src/pages/user_center/index.vue

@@ -1,11 +1,15 @@
 <template>
   <div class="uc_container">
     <view class="head"></view>
-    <img class="bianji" src="https://img.shuimuai.com/m_btn_bianji%402x.png" @click="to_edit"/>
+    <img
+      class="bianji"
+      src="https://img.shuimuai.com/m_btn_bianji%402x.png"
+      @click="to_edit"
+    />
     <view class="user">
       <view class="up">
         <view class="left">
-          <img :src="userinfo.portrait"/>
+          <img :src="userinfo.portrait" />
           <view>
             <text>
               <text>{{ userinfo.user_name }}</text>
@@ -20,96 +24,154 @@
         <!--        </view>-->
       </view>
       <view class="down">
-        <view class="down_num">0</view>
+        <view class="down_num">{{userinfo.ratio}}</view>
         <view>
           <!-- <img src="https://img.shuimuai.com/m_icon_jifen%402x.png"/>
           <text>积分</text> -->
-            <text>智脑成长系数</text>
+          <text>智脑成长系数</text>
         </view>
       </view>
     </view>
 
     <van-row class="detail">
-      <van-col span="6" offset="1">
+      <van-col
+        span="6"
+        offset="1"
+      >
         <view>{{ userinfo.play_time }}</view>
         <view>可用时长(分钟)</view>
       </van-col>
-      <van-col span="6" offset="2" @click="to_coupons">
+      <van-col
+        span="6"
+        offset="2"
+        @click="to_coupons"
+      >
         <view>{{ userinfo.coupon }}</view>
         <view>已领券数量</view>
       </van-col>
-      <van-col span="6" offset="2">
+      <van-col
+        span="6"
+        offset="2"
+      >
         <view>{{ userinfo.experience }}</view>
         <view>次卡</view>
       </van-col>
     </van-row>
     <view class="detail flex justify-around">
       <!--      会员码-->
-      <img src="https://img.shuimuai.com/m_btn_huiyuanma%402x.png" @click="to_vip_code"/>
+      <img
+        src="https://img.shuimuai.com/m_btn_huiyuanma%402x.png"
+        @click="to_vip_code"
+      />
       <!--      会员权益-->
-      <img src="https://img.shuimuai.com/m_btn_huiyuanquanyi%402x.png" @click="to_vip"/>
+      <img
+        src="https://img.shuimuai.com/m_btn_huiyuanquanyi%402x.png"
+        @click="to_vip"
+      />
       <!--      加入家庭组-->
-      <img src="https://img.shuimuai.com/m_btn_jiatingzu%402x.png" @click="open_scan"/>
+      <img
+        src="https://img.shuimuai.com/m_btn_jiatingzu%402x.png"
+        @click="open_scan"
+      />
     </view>
 
     <!--    菜单模块-->
     <van-cell-group class="menu">
-      <van-cell title="我的订单" is-link url="/pages/user_center/orders/main">
-        <img src="https://img.shuimuai.com/web/icon/icon_dingdan.png" alt="" slot="icon" class="icon1">
+      <van-cell
+        title="我的订单"
+        is-link
+        url="/pages/user_center/orders/main"
+      >
+        <img
+          src="https://img.shuimuai.com/web/icon/icon_dingdan.png"
+          alt=""
+          slot="icon"
+          class="icon1"
+        >
       </van-cell>
-      <van-cell title="代理商中心" is-link @click="to_agent">
-        <img src="https://img.shuimuai.com/web/icon/icon_dailishang.png" alt="" slot="icon" class="icon2">
+      <van-cell
+        title="代理商中心"
+        is-link
+        @click="to_agent"
+      >
+        <img
+          src="https://img.shuimuai.com/web/icon/icon_dailishang.png"
+          alt=""
+          slot="icon"
+          class="icon2"
+        >
       </van-cell>
       <!--      <van-cell title="家庭组" icon="wap-home-o" is-link/>-->
-      <van-cell title="收货地址" is-link url="/pages/user_center/address/edit/main">
-        <img src="https://img.shuimuai.com/web/icon/sign_add.png" alt="" slot="icon" class="icon3">
+      <van-cell
+        title="收货地址"
+        is-link
+        url="/pages/user_center/address/edit/main"
+      >
+        <img
+          src="https://img.shuimuai.com/web/icon/sign_add.png"
+          alt=""
+          slot="icon"
+          class="icon3"
+        >
       </van-cell>
-      <van-cell title="联系客服" is-link>
-        <img src="https://img.shuimuai.com/web/icon/icon_kefu.png" alt="" slot="icon" class="icon4">
+      <van-cell
+        title="联系客服"
+        is-link
+      >
+        <img
+          src="https://img.shuimuai.com/web/icon/icon_kefu.png"
+          alt=""
+          slot="icon"
+          class="icon4"
+        >
       </van-cell>
-      <van-button open-type="contact" block custom-class="contact_button">
+      <van-button
+        open-type="contact"
+        block
+        custom-class="contact_button"
+      >
         <div>
           <view>
-            <van-icon name="service-o"/>&nbsp;联系客服
+            <van-icon name="service-o" />&nbsp;联系客服
           </view>
         </div>
 
       </van-button>
     </van-cell-group>
-    <van-toast id="van-toast"/>
+    <van-toast id="van-toast" />
 
   </div>
 </template>
 
 <script>
-import {reload_userinfo} from "../../utils/user";
+import { reload_userinfo } from "../../utils/user";
 
-import Toast from '../../../static/vant/toast/toast';
+import Toast from "../../../static/vant/toast/toast";
 
-var $this
+var $this;
 export default {
   name: "uc_container",
   components: {},
   data() {
     return {
       userinfo: {},
-    }
+    };
   },
   methods: {
     to_edit() {
       mpvue.navigateTo({
-        url: "/pages/user_center/edit/main"
-      })
+        url: "/pages/user_center/edit/main",
+      });
     },
     //跳转vip权益
     to_vip() {
       mpvue.navigateTo({
-        url: "/pages/user_center/vip/main"
-      })
+        url: "/pages/user_center/vip/main",
+      });
     },
     //打开扫一扫
     open_scan() {
-      Toast.fail("暂未开通")
+      Toast.fail("暂未开通");
       // mpvue.scanCode({
       //   onlyFromCamera: true
       // })
@@ -117,34 +179,32 @@ export default {
     //跳转会员码
     to_vip_code() {
       mpvue.navigateTo({
-        url: "/pages/user_center/vip_code/main"
-      })
+        url: "/pages/user_center/vip_code/main",
+      });
     },
     to_coupons() {
       mpvue.navigateTo({
-        url: "/pages/coupons/main"
-      })
+        url: "/pages/coupons/main",
+      });
     },
-    to_agent(){
+    to_agent() {
       if ($this.userinfo.level == 8 || $this.userinfo.level == 9) {
-        Toast.fail("店员、店长不可进")
-        return false
+        Toast.fail("店员、店长不可进");
+        return false;
       }
       mpvue.navigateTo({
-        url:"/pages/agent/index/main"
-      })
-    }
-  }
-  ,
-  mounted() {
+        url: "/pages/agent/index/main",
+      });
+    },
   },
+  mounted() {},
   created() {
     $this = this;
   },
   onLoad() {
-    reload_userinfo($this)
+    reload_userinfo($this);
   },
-}
+};
 </script>
 
 <style>
@@ -222,7 +282,6 @@ image.bianji {
 
 .user .up .right {
   height: 40px;
-
 }
 
 .user .up .right image {
@@ -246,8 +305,8 @@ image.bianji {
   align-items: center;
   justify-content: start;
 }
-.user .down .down_num{
-  margin:5px 0;
+.user .down .down_num {
+  margin: 5px 0;
 }
 .user .down image {
   width: 16px;
@@ -258,13 +317,13 @@ image.bianji {
 
 .user .down view:first-child {
   font-size: 36px;
-  color: #FFD800;
+  color: #ffd800;
   font-weight: bold;
 }
 
 .user .down view:last-child {
   font-size: 15px;
-  color: #C7C4D8;
+  color: #c7c4d8;
   margin-top: -2px;
 }
 
@@ -277,7 +336,7 @@ image.bianji {
 }
 
 .detail view {
-  color: #6C6C6C;
+  color: #6c6c6c;
   font-size: 10px;
 }
 

+ 1 - 1
src/requests/game.js

@@ -21,7 +21,7 @@ export function gameEnd($params) {
 export function gameDetail($record_id) {
   let $params = {};
   $params["game_record_id"] = $record_id;
-  //   $params["game_record_id"] = "9270";
+    // $params["game_record_id"] = "9270";
   $params["access_token"] = wx.getStorageSync("token");
   return fly.post("game/game-detail", $params);
 }

+ 1 - 0
src/utils/bluetooth.js

@@ -447,6 +447,7 @@ export default {
           });
           game_store.setters.setGameStatus(0);
 
+
         }
       }
     });

+ 18 - 2
src/utils/index.js

@@ -357,7 +357,7 @@ export function getHightPieChartOption($params, $total) {
       {
         name: "访问来源",
         type: "pie",
-        radius: "50%",
+        radius: "80%",
         labelLine: {
           show: false,
         },
@@ -430,7 +430,7 @@ export function getPieChartsOption($pie_datas) {
       legend: {
         orient: "vertical",
         right: "10%",
-        top: "5%",
+        top: "20%",
         data: $pie_datas["legends"],
       },
       series: [
@@ -530,10 +530,26 @@ export function filterPieData(datas) {
   return { datas, legends };
 }
 
+// 时间戳转化成时间格式
+export function timestampToTimeS(timestamp) {
+  var date = new Date(timestamp * 1000); //时间戳为10位需*1000,时间戳为13位的话不需乘1000
+  var Y = date.getFullYear() + "-";
+  var M =
+    (date.getMonth() + 1 < 10
+      ? "0" + (date.getMonth() + 1)
+      : date.getMonth() + 1) + "-";
+  var D = date.getDate() + " ";
+  var h = date.getHours() + ":";
+  var m = date.getMinutes() + ":";
+  var s = date.getSeconds();
+  return Y + M + D + h + m + s;
+}
+
 export default {
   formatNumber,
   formatTime,
   getLineOption,
   getBaseOption,
   get_level_name,
+  timestampToTimeS
 };