瀏覽代碼

feature: live and im

able99 4 年之前
父節點
當前提交
60c2b5ed20

+ 0 - 116
jhim/jhimlive.vue

@@ -1,116 +0,0 @@
-<template>
-	<view class="jhim-container">
-    <view class="jhim-message-box">
-      <view class="jhim-message" v-for="(item, index) in msgs.slice(0,5)" :key="index">
-        <image class="jhim-message-avatar" :src="item.avatar" />
-        <text class="jhim-message-text" >{{item.name}}:{{item.text}}</text>
-      </view>
-    </view>
-    <view v-if="ready" class="jhim-input-box">
-      <input 
-        class="jhim-input"
-        placeholder="说点什么..." 
-        placeholder-style="color:#fff" 
-        v-model="input"
-        confirm-type="send" @confirm="btnImSend" />
-    </view>
-    <view v-else class="jhim-logining"><text class="jhim-logining-text">登录中...</text></view>
-	</view>
-</template>
-
-<script>
-
-import Jhim from "./jhim";
-const LOGTAG = '--JHIM--:';
-
-export default {
-  name: 'jhim',
-	data() {
-		return {
-      input: '',
-      msgs: [],
-      ready: false,
-		};
-	},
-	props: {
-    sdkAppID: Number,
-    secretKey: String,
-    userId: String,
-    roomId: String,
-    name: String,
-    avatar: String,
-	},
-	methods: {
-		enterRoom() {
-      this.jhim = this.jhim||(Jhim.jhim)||(new Jhim(this.userId, this.sdkAppID, this.secretKey));
-
-      this.jhim.on('onIMMessageReceived', event=>{
-        this.msgs = this.msgs.concat(event);
-      }).on('onIMGroupTipElem', res=>{
-        this.$emit('onMemberCount', this.memberCount = res.memberCount);
-      }).on('onIMSDKNotReady', event=>{
-        this.ready = false;
-      }).on('onIMSDKReady', event=>{
-        this.ready = true;
-      })
-
-      this.jhim.login(this.name, this.avatar).then(()=>this.jhim.createGroup(this.roomId));
-		},
-		exitRoom() {
-      if(this.isAuthor) {
-        this.jhim.dismissGroup().then(()=>this.jhim.logout());
-      }else {
-        this.jhim.exitGroup().then(()=>this.jhim.logout());
-      }
-    },
-    btnImSend() {
-      this.jhim.sendGroupText(this.input).then(msg=>{
-        this.input = '';
-				this.msgs.push(msg);
-			});
-    }
-	}
-};
-</script>
-
-<style scoped>
-
-/* .jhim-container {
-  
-} */
-.jhim-message-box {
-  background-color:rgba(0, 0, 0, 0.4);
-  border-radius: 1000px;
-  padding: 5;
-}
-.jhim-message {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  margin-bottom: 5px;
-}
-.jhim-message-avatar {
-  width: 28rpx;
-  height: 28rpx;
-  margin-left: 5px;
-}
-.jhim-message-text {
-  color: #fff;
-  font-size: 24rpx;
-}
-.jhim-input-box {
-  padding: 5px;
-}
-.jhim-input {
-  color: #fff;
-  font-size: 24rpx;
-}
-.jhim-logining {
-  padding: 5px;
-}
-.jhim-logining-text {
-  color: #fff;
-  font-size: 24rpx;
-}
-
-</style>

+ 6 - 6
jhlive/jhlive.nvue

@@ -77,12 +77,12 @@
 				imInput: '',
 				userSig: '',
 				beautifyLevel: false,
-				collect:"../static/images/live-collect.png", // 已收藏图标
-				notCollect: "../static/images/live-notCollect.png", // 未收藏图标
-				inputIcon: "../static/images/live-chat.png", // 输入框图标
-				beautyIcon:"../static/images/live-beauty.png", // 美颜图标
-				switchIcon: "../static/images/live-switch.png", // 切换摄像头图标
-				likeIcon: "../static/images/live-support.png"
+				collect:"./live-collect.png", // 已收藏图标
+				notCollect: "./live-notCollect.png", // 未收藏图标
+				inputIcon: "./live-chat.png", // 输入框图标
+				beautyIcon:"./live-beauty.png", // 美颜图标
+				switchIcon: "./live-switch.png", // 切换摄像头图标
+				likeIcon: "./live-support.png"
 			};
 		},
 

+ 0 - 0
static/images/live-beauty.png → jhlive/live-beauty.png


+ 0 - 0
static/images/live-chat.png → jhlive/live-chat.png


+ 0 - 0
static/images/live-collect.png → jhlive/live-collect.png


+ 0 - 0
static/images/live-notCollect.png → jhlive/live-notCollect.png


+ 0 - 0
static/images/live-support.png → jhlive/live-support.png


+ 0 - 0
static/images/live-switch.png → jhlive/live-switch.png


+ 1 - 1
pagesGood/liveDetail.nvue

@@ -6,7 +6,7 @@
 			:isAuthor="isAuthor" :linkMic="linkMic" 
 			:avatar="avatar" :subtitle="subtitle" :title="title" 
 			:showFav="true" :isFav="isLiveFav" @onLiveFav="" 
-			:showSwitch="false" :showBeauty="false" :showLike="false" :btns="btns" @onBtnClick="onBtnClick"
+			:btns="btns" @onBtnClick="onBtnClick"
 			:showIm="true" :imStatus="imStatus" :imMsgs="imMsgs" @onImSend="onImSend" />
 		<uni-popup ref="popup" animation type="bottom">
 			<view class="popup-box">

+ 66 - 19
pagesGood/pickVideo.nvue

@@ -1,19 +1,22 @@
 <template>
 	<view class="container" :style="'height: '+windowHeight+'px;'">
     <jhlive 
-			ref="jhlive" 
-			class="jhlive"
-			:sdkAppID="sdkAppID" 
-			:secretKey="secretKey"
-			:userId="userId"
-			:roomId="roomId"
-			:isAuthor="isAuthor"
-			:linkMic="linkMic" 
-			:avatar="avatar"
-			:num="num?'已连接':'等待商家进入'"
-			:likes="likes"
-      :name="name"
+			ref="jhlive" class="jhlive" 
+			:sdkAppID="sdkAppID" :secretKey="secretKey" :userId="userId" :roomId="roomId"
+			:isAuthor="isAuthor" :linkMic="linkMic" 
+			:avatar="avatar" :subtitle="num?'已连接':'等待商家进入'" :title="title" 
+			:btns="btns" @onBtnClick="onBtnClick" 
       @onRemoteUser="num=$event.length" />
+      <uni-popup ref="popup" animation type="bottom">
+        <view class="popup-box">
+          <view class="popup-close">
+            <text class="popup-close-text" @click="$refs.popup.close()">收起</text>
+          </view>
+          <scroll-view scroll-y="true" class="good-box">
+            
+          </scroll-view>
+        </view>
+      </uni-popup>
 	</view>
 </template>
 
@@ -26,23 +29,23 @@
 		components: { jhlive },
 		data() {
 			return {
+        windowWidth: 0,
+				windowHeight: 0,
         userData: {},
         orderId: '',
         tenantCode: '',
         goodsList: [],
+        liveId: '',
         
         isAuthor: false,
         linkMic: true,
         sdkAppID:API.sdkAppID,
 			  secretKey:API.secretKey,
-				windowWidth: 0,
-				windowHeight: 0,
+        btns: [{picture:"../static/images/live-good.png",title:''}],
 				userId: '',
 				roomId: '',
-				liveId: '',
-				num: 0,
-				likes: 0,
-				name: "",
+				title: "",
+        num: 0,
         avatar: "../static/images/loginLogo.png",
 			}
 		},
@@ -63,7 +66,7 @@
           tenantCode : this.tenantCode,
           orderId: this.orderId
         }, 'GET').then(res => {
-          this.name = res.data.tenantName;
+          this.title = res.data.tenantName;
           this.avatar = res.data.headImg;
           this.liveId = res.data.liveId;
           this.roomId = res.data.roomId;
@@ -82,6 +85,11 @@
 			exitRoom() {
         this.$refs.jhlive&&this.$refs.jhlive.exitRoom();
 			},
+      onBtnClick(index, item) {
+				if(index === 0) {
+					this.$refs.popup.open()
+				}
+			},
 		}
 	}
 </script>
@@ -99,4 +107,43 @@
   width: 750rpx;
   flex: 1;
 }	
+
+.popup-open {
+  width: 50px;
+  height: 50px;
+  position: fixed;
+  bottom: 15px;
+  right: 15px;
+  background-color: #52A63A;
+  border-radius: 50%;
+  text-align: center;
+  line-height: 50px;
+}
+
+.iconzhibo-shangpin {
+  color: #FFFFFF;
+  font-size: 34px;
+  text-align: center;
+  line-height: 50px;
+}
+
+.popup-box {
+  background-color: #FFFFFF;
+  width: 750rpx;
+  height: 750rpx;
+  border-top-left-radius: 10px;
+  border-top-right-radius: 10px;
+}
+
+.popup-close {
+  padding: 10px;
+  line-height: 16px;
+}
+
+.popup-close-text {
+  color: #52A63A;
+  font-size: 15px;
+  font-family: PingFang SC;
+  text-align: left;
+}
 </style>