Merge branch 'dev5.8.6' into develop

pages/customer-service.vue

@@ -14,18 +14,19 @@ console.log(
 
 export default {
   head() {
+    let obj = {
+      hidden: 1,
+      sdkTemplateId:
+        this.$route.query?.templateId ?? process.env.QIYUKF_TEMPLATE_ID,
+    };
+    if(this.$route.query?.isWeixin) obj.subdomain = 1
     return {
       script: [
         {
           src:
             'https://qiyukf.com/script/98112bcf552907c28ee450c6a58269c3.js' +
             qs.stringify(
-              {
-                hidden: 1,
-                sdkTemplateId:
-                  this.$route.query?.templateId ??
-                  process.env.QIYUKF_TEMPLATE_ID,
-              },
+              obj,
               {
                 addQueryPrefix: true,
               },

pages/introductionCloudPhone/index.vue

@@ -6,13 +6,14 @@
           推荐云手机
         </div>
 
-        <div class="introduction-tips">
+        <div class="introduction-tips" :style="{color: isShowApp ? '#EDEEF0' : '#0A132B' }">
           请搜索您在云手机内希望使用的应用！
         </div>
 
         <div class="introduction-search">
           <img src="@/assets/image/introductionCloudPhone/search.png" alt="" />
           <input ref="inputField" v-model="searchText" type="search" placeholder="请输入应用名" />
+          <div style="width: 1px;height: 20px;background: #7E8495;border-radius: 1px;"></div>
           <div @click="search">搜索</div>
         </div>
 
@@ -34,10 +35,15 @@
             <div class="application-list-top">
               <img class="application-list-img" width="42" height="42" :src="item.img" alt="" />
               <div class="application-list-rigth">
-                <div class="application-list-title">{{item.appName}} <span v-if="item.articleId>0" @click="goArticleDetails(item)">点击阅读</span></div>
-                <div class="application-list-tips">游戏名称云手机使用教程</div>
+                <div class="application-list-title">
+                  <div class="application-list-appname"> {{item.appName}}</div>
+                  <span v-if="item.articleId>0" @click="goArticleDetails(item)">点击阅读</span>
+                </div>
+                <div class="application-list-tips">{{item.appName}}云手机使用教程</div>
+              </div>
+              <div class="application-list-btn" @click="pay(item)">购买云手机
+                <!-- <img width="12" src="@/assets/image/introductionCloudPhone/btn.png" /> -->
               </div>
-              <div class="application-list-btn" @click="pay(item)">购买云手机 <img width="12" src="@/assets/image/introductionCloudPhone/btn.png" /></div>
 
             </div>
 
@@ -47,10 +53,25 @@
         </div>
 
         <div class="application-default" v-if="!appSeatchList.length && !isShow">
-          <img v-if="isShowApp" width="305" src="@/assets/image/introductionCloudPhone/default.png" />
-
-          <img v-else width="305" src="@/assets/image/introductionCloudPhone/defaultWhite.png" />
-          <div>很遗憾，没有搜索到您想要的应用</div>
+          <div class="empty">
+          <div class="empty-title">当前搜索结果为空，您可以通过下面两种方式在云手机安装APP（限安卓手机应用上传安装）</div>
+          <div class="empty-img">
+            <img :src="require(`@/assets/image/introductionCloudPhone/${isShowApp ? 'empty-tips-default' : 'empty-tips-defaultWhite'}.png`)" alt="">
+          </div>
+          <div class="empty-tips">
+              <div :style="{color: isShowApp ? '#EDEEF0' : '#0A132B' }">
+                温馨提示：
+              </div>
+              <div>
+                根据相关部门要求，违规APP将无法安装。请远离以上风险软件，谨防上当受骗。如果需要应用上报，请联系客服；也可以购买短期云手机，试用您未搜索到的应用。
+              </div>
+          </div>
+          <div class="empty-btn" style="bottom: 24px; left: 16px;width: calc(100% - 32PX)">
+            <div v-for="item in emptyBtn" :key="item.key" @click="emptyBtnFun(item.type)" :class="{dark: isShowApp && !item.type}">
+              {{ item.name }}
+            </div>
+          </div>
+        </div>
         </div>
 
       </div>
@@ -75,6 +96,16 @@ export default {
       isShow: true,
       applicationList: [], //  推荐应用数组
       appSeatchList: [], //  应用数组
+      emptyBtn: [{
+        name: '联系客服咨询',
+        key: 'customerService',
+        type: 0
+      },
+      {
+        name: '购买云手机试用',
+        key: 'purchaseCloudPhone',
+        type: 1
+      }]
     };
   },
   components: { layout, layoutBack },
@@ -95,7 +126,7 @@ export default {
   },
   watch: {
     searchText(value) {
-      if (!value)
+      if (!value) 
         this.isShow = true
     }
   },
@@ -148,14 +179,25 @@ export default {
     search() {
       if (!this.searchText) return
       this.appSeatchList.slice(0, this.appSeatchList.length)
-      this.isShow = false
       this.$axios.$post('/public/v1/market/clientSearchSuggestApp', { pageSize: 100, pageNum: 1, appName: this.searchText }).then((res) => {
         this.appSeatchList = res.data.list
+        this.isShow = false
         this.appSeatchList.forEach(element => {
           element.img = fileKeyToUrl(element.imageId)
         });
       });
     },
+    emptyBtnFun(type) {
+      if(type) {
+        this.pay()
+        return 
+      }
+      let url = `/introductionCloudPhone/onlineService?token=${this.$route.query.token}`
+      if(this.$route.query.isWeixin) {
+        url+= '&isWeixin=1'
+      }
+      this.$router.push(url)
+    }
   },
 };
 </script>
@@ -204,21 +246,26 @@ export default {
       font-size: 14px;
       color: #ffffff;
       flex: 1;
+      width: calc(100% - 16px - 60px);
     }
     div {
       font-family: PingFangSC, PingFang SC;
       font-weight: 500;
       font-size: 14px;
-      color: #ffffff;
-      line-height: 34px;
+      color: #3b7fff;
+      line-height: 18px;
+      text-align: left;
+      font-style: normal;
+      line-height: 37px;
       width: 60px;
       height: 34px;
-      background: linear-gradient(90deg, #38aefc 0%, #3b7fff 100%);
+      // background: linear-gradient(90deg, #38aefc 0%, #3b7fff 100%);
       float: right;
       text-align: center;
-      border-radius: 8px;
+      border-radius: 1px;
+      // border-left: 1px solid #7e8495;
       // margin: 4px 4px 0 0;
-      margin: 0 4px;
+      margin: 0 4px 2px;
     }
   }
 
@@ -239,6 +286,7 @@ export default {
       background: #2c2c2d;
       border-radius: 14px;
       padding: 11px 0;
+      box-sizing: border-box;
     }
   }
 
@@ -261,6 +309,7 @@ export default {
     .application-list-rigth {
       display: inline-block;
       overflow: hidden;
+      width: calc(100% - 150px);
     }
     .application-list-title {
       vertical-align: top;
@@ -269,8 +318,15 @@ export default {
       color: #ffffff;
       font-style: normal;
       margin-right: 4px;
-
+      .application-list-appname {
+        max-width: calc(100% - 50px);
+        display: inline-block;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+      }
       span {
+        vertical-align: super;
         font-family: PingFangSC, PingFang SC;
         font-weight: 400;
         font-size: 10px;
@@ -290,6 +346,10 @@ export default {
       text-align: left;
       font-style: normal;
       margin-right: 4px;
+
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      overflow: hidden;
     }
     .application-list-btn {
       width: 82px;
@@ -298,9 +358,9 @@ export default {
       border-radius: 8px;
       color: #ffffff;
       line-height: 32px;
-      padding: 0  0  0 8px;
+      padding: 0 0 0 8px;
       float: right;
-      font-size: 10px;
+      font-size: 12px;
       img {
         vertical-align: middle;
         margin-top: -1px;
@@ -330,7 +390,6 @@ export default {
     color: #999999;
     line-height: 18px;
     font-style: normal;
-    margin-top: 42px;
   }
 }
 
@@ -344,12 +403,12 @@ export default {
 
   .introduction-search {
     background: #ffffff;
-    border: 1px solid #ffffff;
+    // border: 1px solid #ffffff;
     input {
       color: #0a132b;
     }
     div {
-      color: #ffffff;
+      // color: #ffffff;
     }
   }
 
@@ -385,4 +444,78 @@ export default {
     }
   }
 }
+.empty{
+  margin-top: 16px;
+  .empty-title{
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 400;
+    font-size: 12px;
+    color: #959799;
+    line-height: 16px;
+    text-align: left;
+    font-style: normal;
+  }
+
+  .empty-img{
+    height: 348px;
+    margin-top: 24px;
+    padding-left: 20px;
+    &>img{
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+  .empty-tips{
+    margin-top: 24px;
+    padding-bottom: 68px;
+    &>div:first-child{
+      font-family: PingFangSC, PingFang SC;
+      font-weight: 500;
+      font-size: 14px;
+      line-height: 20px;
+      text-align: left;
+      font-style: normal;
+    }
+    &>div:last-child{
+      font-family: PingFangSC, PingFang SC;
+      font-weight: 400;
+      font-size: 12px;
+      color: #959799;
+      line-height: 16px;
+      text-align: left;
+      font-style: normal;
+    }
+  }
+
+  .empty-btn{
+    position: fixed;
+    display: grid;
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 400;
+    font-size: 16px;
+    color: #3B7FFF;
+    height: 40px;
+    line-height: 40px;
+    text-align: center;
+    font-style: normal;
+    display: grid;
+    grid-gap: 14px;
+    grid-template-columns: repeat(2, 1fr);
+    &>div:first-child{
+      border-radius: 8px;
+      border: 1px solid #3B7FFF;
+      color: #3B7FFF;
+      background: #f2f4f7;
+      &.dark{
+        background: #1C1C1E;
+      }
+    }
+    &>div:last-child{
+      color: #FFFFFF;
+      background: #3B7FFF;
+      border-radius: 8px;
+    }
+  }
+}
 </style>

pages/introductionCloudPhone/onlineService.vue

@@ -0,0 +1,31 @@
+<template>
+    <layout>
+        <iframe :src="url" frameborder="0" width="100%" height="100%"></iframe>
+    </layout>
+</template>
+
+<script>
+import layout from '@/components/layout';
+export default {
+    name: 'onlineService',
+    components: {
+        layout,
+    },
+    data() {
+        return {
+            url: ''
+        };
+    },
+    created() {
+        let url = `${location.origin}/h5/customer-service?autoopen=true&token=${this.$route.query.token}`
+        if(this.$route.query.isWeixin) {
+            url+= '&isWeixin=1'
+        }
+        this.url = url
+    },
+    mounted() {
+    }
+};
+</script>
+
+<style></style>

static/webRtcYJ/WXtrialInterface.html

@@ -102,9 +102,9 @@
     </div>
     <div class="leftmains">
       <div class="PictureQualityMain">
-        <div class="menu-btn PictureQuality" data-id="5">高清</div>
-        <div class="menu-btn PictureQuality avit" data-id="4">标清</div>
-        <div class="menu-btn PictureQuality" data-id="3">极速</div>
+        <div class="menu-btn PictureQuality" data-id="4">高清</div>
+        <div class="menu-btn PictureQuality avit" data-id="3">标清</div>
+        <div class="menu-btn PictureQuality" data-id="2">极速</div>
       </div>
       <div class="open-set-phone-size-dialog-btn-wrap">
         <div class="menu-btn" id="open-set-phone-size-dialog-btn">

static/webRtcYJ/helper.js

@@ -257,9 +257,14 @@ function checkMultiLoginInfo(input) {
 //切换清晰度
 function makeSharpness(level) {
   var sn = 'RK3923C1201900139';
+  let resolution_factor = {
+    2: 800, // 极速
+    3: 960, // 标清
+    4: 1280 // 高清
+  }
   var jsonObj = {
-    type: 2,
-    data: { definition: level, clientType: 'h5', sceneType: 'cloudPhone' },
+    type: 5,
+    data: { definition_level: level, resolution_factor: resolution_factor[level] }
   };
   var jsonStr = JSON.stringify(jsonObj);
   var outPut = new TextEncoder('utf-8').encode(jsonStr);

static/webRtcYJ/websocket.js

@@ -58,7 +58,7 @@ function doConnect() {
   ws.addEventListener('open', function (event) {
     var verifyBuffer = VerifyCode('RK3923C1201900139', cardToken);
     ws.send(verifyBuffer);
-    ws.send(makeSharpness(4))
+    ws.send(makeSharpness(3))
     errorTime = 0;
   });