Browse Source

机器人

liyongli 4 years ago
parent
commit
7e62d17e1d

BIN
src/assets/image/robot-head.png


+ 4 - 0
src/components/Detail/audio.vue

@@ -105,16 +105,20 @@ export default {
   },
   mounted() {
     window.webkit &&
+      window.webkit.messageHandlers &&
+      window.webkit.messageHandlers.setWebviewHeight &&
       window.webkit.messageHandlers.setWebviewHeight.postMessage({
         height: this.$refs.elementAsconten.offsetHeight
       });
     window.H5Listener &&
+      window.H5Listener.setWebviewHeight &&
       window.H5Listener.setWebviewHeight(
         this.$refs.elementAsconten.offsetHeight
       );
     this.$pageParams = currentUrlToParams();
     this.timeout = new Date();
     let _this = this;
+    console.log("生成autoplay", this.$refs.audioEle);
     this.$refs.audioEle &&
       (window["autoPlay"] = function() {
         _this.autoPlay();

+ 2 - 0
src/components/Detail/video.vue

@@ -117,10 +117,12 @@ export default {
     playerReadied() {
       console.log("准备好");
       window.webkit &&
+        window.webkit.messageHandlers &&
         window.webkit.messageHandlers.setWebviewHeight.postMessage({
           height: this.$refs.elementAsconten.offsetHeight
         });
       window.H5Listener &&
+        window.H5Listener.setWebviewHeight &&
         window.H5Listener.setWebviewHeight(
           this.$refs.elementAsconten.offsetHeight
         );

+ 51 - 7
src/pages/robot/Index.vue

@@ -13,6 +13,14 @@
     <div id="robot" class="app">
       <div class="van-hairline--surround msg" ref="scroll">
         <div class="" ref="msgScroll">
+          <div class="defaultQuestion">
+            <div
+              v-for="item in q"
+              :key="item.id"
+              v-text="item"
+              @click="() => defQ(item)"
+            ></div>
+          </div>
           <div
             class="msgBg"
             v-for="item in dialogueList"
@@ -53,26 +61,32 @@
               >
               </van-button>
+              <van-image
+                style="width: 0.45rem;vertical-align: middle;"
+                :src="robotHead"
+              ></van-image>
               <van-button
                 type="default"
-                @touchstart="() => toOperation('head', 'down')"
+                @touchstart="() => toOperation('head', 'right')"
                 @touchend="() => (touch = false)"
               >
-                
+                
               </van-button>
+            </div>
+            <div class="conBtnGroup">
               <van-button
                 type="default"
-                @touchstart="() => toOperation('head', 'right')"
+                @touchstart="() => toOperation('head', 'down')"
                 @touchend="() => (touch = false)"
               >
-                
+                
               </van-button>
             </div>
-            <div class="text">头部</div>
           </div>
         </van-col>
         <van-col span="12">
           <div class="control">
+            <div class="text">轮子</div>
             <van-button
               type="default"
               @touchstart="() => toOperation('wheel', 'forward')"
@@ -103,7 +117,6 @@
               </van-button>
             </div>
-            <div class="text">轮子</div>
           </div>
         </van-col>
       </van-row>
@@ -120,6 +133,7 @@ import {
   Col as vanCol,
   Row as vanRow,
   Field as vanField,
+  Image as VanImage,
   DropdownMenu as vanDropdownMenu,
   DropdownItem as vanDropdownItem,
   Sticky as vanSticky,
@@ -132,8 +146,12 @@ import "vant/lib/row/style";
 import "vant/lib/field/style";
 import "vant/lib/sticky/style";
 import "vant/lib/toast/style";
+import "vant/lib/image/style";
 import "vant/lib/dropdown-menu/style";
 import "vant/lib/dropdown-item/style";
+
+import robotHead from "@/assets/image/robot-head.png";
+
 export default {
   name: "app",
   robotToken: "",
@@ -144,6 +162,15 @@ export default {
     return {
       robotList: [],
       dialogueList: [],
+      q: [
+        "天气如何?",
+        "两学一做",
+        "八项规定",
+        "三严三实",
+        "什么是两个100年?",
+        "党的生日是那一天?"
+      ],
+      robotHead,
       remoteControl: [
         {
           typeL: "head",
@@ -170,6 +197,10 @@ export default {
     };
   },
   methods: {
+    defQ(t) {
+      this.message = t;
+      this.tomsg();
+    },
     creatID() {
       const T =
         "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
@@ -180,7 +211,10 @@ export default {
       return id;
     },
     tomsg() {
-      if (!this.status) return Toast("链接已断开!");
+      if (!this.status) {
+        this.message = "";
+        return Toast("链接已断开!");
+      }
       if (!this.message) return;
       let dialogue = {
         type: "local",
@@ -288,6 +322,7 @@ export default {
     vanRow,
     vanField,
     vanSticky,
+    VanImage,
     vanDropdownMenu,
     vanDropdownItem
   }
@@ -324,5 +359,14 @@ export default {
       background-color: #959595;
     }
   }
+  .defaultQuestion {
+    padding: 5px;
+    color: #fff;
+    border-radius: 5px;
+    word-wrap: break-word;
+    background-color: #959595;
+    line-height: 2em;
+    font-size: 0.14rem;
+  }
 }
 </style>