fix bugs

any-hooks/auth/useLogOut.ts

@@ -5,12 +5,12 @@ import { useAuthData } from "./useAuthData";
 export function useLogOut() {
   const [, request] = useRequest<any>('/loginOut', { auto: false });
   const { setAuth } = useInjector(useAuthData);
-  const { close } = useInjector(useNetSocketStore)
+  const { close } = useInjector(useNetSocketStore);
 
   const submitLogOut = (data: {login_id: string}) => {    
     return request(data).then( _ => {
-      setAuth(null);
       close();
+      setAuth(null);      
     });
   }
 

any-hooks/communication/useCallCenter.ts

@@ -20,6 +20,8 @@ export function useCallCenter() {
   const { sendMsg, currentMsg } = useInjector(useNetSocketStore);
   const { authData } = useInjector(useAuthData);
 
+  let timer;
+  
   /** 主动呼叫功能 */
   const [target, setTarget]             = useState<Caller>(null);
   const [myCallState, setCallState]     = useState<CallingState>('free');
@@ -39,8 +41,8 @@ export function useCallCenter() {
         }
       })
     })  
-    //8S后若本地用户仍处于主动呼叫状态，则自动挂断
-    setTimeout(() => {
+    //18S后若本地用户仍处于主动呼叫状态，则自动挂断
+    timer = setTimeout(() => {
       if(myCallState.value === 'calling') hangup();      
     }, 18000)
   }
@@ -60,6 +62,7 @@ export function useCallCenter() {
       msgMainFlag: 'CallAnswer',
       msgSubFlag: subFlag
     })
+    clearTimeout(timer)
   }
 
   /** 呼叫监听功能  */
@@ -83,13 +86,13 @@ export function useCallCenter() {
         } else{          
           answerCaller('Busying', {id: msg.fromID, nickname: msg.fromName});
         } 
-        //10S秒后若本地用户仍然处于被呼叫状态，则自动发出繁忙恢复，且将状态恢复为free
-        setTimeout( () => {
+        //15S秒后若本地用户仍然处于被呼叫状态，则自动发出繁忙恢复，且将状态恢复为free
+        timer = setTimeout( () => {
           if(myCallState.value === 'being_called'){
             answerCaller('Busying', {id: currentMsg.value.fromID, nickname: currentMsg.value.fromName});
             setCallState('free');
           }
-        }, 10000)     
+        }, 15000)     
       break;
       case 'Hangup':
         //对方中断呼叫，则将呼叫状态改为free
@@ -133,11 +136,11 @@ export function useCallCenter() {
       break;      
       case 'calling':
         flag = 'CallOffer';
-        toID = target.value.id;
+        toID = target.value?.id;
       break;
       case 'being_called':
         flag = 'CallAnswer';
-        toID = caller.value.id;
+        toID = caller.value?.id;
       break;
     } 
     
@@ -151,6 +154,7 @@ export function useCallCenter() {
     type === 'leave' && setCallState('free');
     setTarget(null);
     setCaller(null);
+    clearTimeout(timer);
   }
 
   /** 监听呼叫状态，当状态变回free时，重置channel的信息,同时向服务器广播  */

any-hooks/types/socket.ts

@@ -17,7 +17,7 @@ export interface SocketSettings {
 export type ConnectStatus = 'ready' | 'opening' | 'onerror' | 'closed' | 'reconnect';
 
 export type AnyRemoteMainFlag = 'Heart' | 'Login' | 'Broadcast' | 'Home' | 'CallOffer' | 'CallAnswer' | 'ChannelChat' | 'NotifyUpdateUserList' | 'SetAtts' | 'Login';
-export type AnyRemoteSubFlag = 'Request' | 'Busying' | 'Connect' | 'Hangup' | 'UpdateUserList' | 'OtherLoginIn';
+export type AnyRemoteSubFlag = 'Request' | 'Busying' | 'Connect' | 'Hangup' | 'UpdateUserList' | 'OtherLoginIn' | 'NoDevice';
 
 export interface AnyRemoteSocketMessage {
   fromID?: string;

src/app.config.ts

@@ -22,15 +22,15 @@ export default {
       {
         "pagePath": "pages/index/index",
         "text": "联系人",
-        "iconPath": "assets/contacts.png",
-        "selectedIconPath": "assets/contacts_a.png"
+        "iconPath": "assets/Contact@3x.png",
+        "selectedIconPath": "assets/Contact-Check@3x.png"
       },
       {
         "pagePath": "pages/mine/index",
         "text": "个人中心",
-        "iconPath": "assets/user_center.png",
-        "selectedIconPath": "assets/user_center_a.png"
+        "iconPath": "assets/Personal@3x.png",
+        "selectedIconPath": "assets/Personal-Check@3x.png"
       }
     ]
-  },
+  }
 }

src/components/contact-item.vue

 
-<script lang="ts" setup="">
-  import { navigateTo } from "@tarojs/taro";
+<script lang="ts" setup>
+  import { navigateTo, showToast } from "@tarojs/taro";
   import { defineProps } from "@vue/runtime-core";
   import { useCallCenter } from "any-hooks/communication/useCallCenter";
   import { UserData } from "any-hooks/types/user";
+  import { useAppInitInfo } from "src/hooks/common/useAppInitInfo";
   import { useInjector } from "vue-vulcan";
 
   const {data} = defineProps<{data: UserData}>();
-  const { callContact } = useInjector(useCallCenter);
+  const { callContact, myCallState } = useInjector(useCallCenter);
+  const { checkCamearSetting } = useInjector(useAppInitInfo);
 
   const gotoDetail = (id: string) => {
-    navigateTo({url: '/pages/contact-detail/index?id='+ id})
+    navigateTo({url: '/pages/contact-detail/index?id='+ id});
+  }
+
+  const onTapCall = (data: UserData) => {
+    if(myCallState.value !== 'free') {
+      showToast({title: '您当前已在通话中，无法发起呼叫'});
+    } else {
+      checkCamearSetting().then( r => {
+        r ? callContact(data) : showToast({title: '您未授权摄像头权限，请在设置中打开摄像头授权', icon: 'none'});
+      })      
+    }
   }
 </script>
 
@@ -21,7 +33,7 @@
       <view>{{data.nickname}}</view>
       <text>{{data.group_name}}</text>
     </view>
-    <image v-if="data.is_signin === '1'" @tap.stop="callContact(data)" class="call" src="../assets/call3x.png" mode="widthFix"/>
+    <image v-if="data.is_signin === '1'" @tap.stop="onTapCall(data)" class="call" src="../assets/call3x.png" mode="widthFix"/>
     <image v-else class="call" src="../assets/call-no3x.png" mode="widthFix"/>
   </view>
 </template>

src/components/stream-pusher.vue

 <script lang="ts" setup>
-  import { useAuthData } from 'any-hooks/auth/useAuthData';;
+  import { useAuthData } from 'any-hooks/auth/useAuthData';
   import { useMeetingCenter } from 'any-hooks/communication/useMeetingCenter';
   import { defineProps } from 'vue';
   import { useInjector } from 'vue-vulcan';
@@ -28,7 +28,7 @@
       v-on:error="onError"      
       :debug="!0"
     />     
-    <view class="cover" >
+    <view class="cover">
       <text class="name">{{authData.nickname}}</text>
       <image class="avatar" v-if="mode==='audio'" :src="authData.avatar" mode="widthFix"/>
     </view>         

src/hooks/call/useCallerListener.ts

@@ -2,11 +2,13 @@ import { navigateTo, redirectTo, showToast } from "@tarojs/taro";
 import { useCallCenter } from "any-hooks/communication/useCallCenter";
 import { watch } from "vue";
 import { useInjector } from "vue-vulcan";
+import { useAppInitInfo } from "../common/useAppInitInfo";
 
 
 /** 在小程序平台监听远程联系人的呼叫动作 */
 export function useCallerListener() {
-  const { caller, target, myCallState } = useInjector(useCallCenter);
+  const { caller, target, myCallState, answerCaller } = useInjector(useCallCenter);
+  const { checkCamearSetting } = useInjector(useAppInitInfo)
 
   watch(caller, current => {      
     if(!current) return;  
@@ -41,7 +43,10 @@ export function useCallerListener() {
         }        
       break;
       case 'being_called':
-        navigateTo({url: '/pages/calling/index'});
+        checkCamearSetting().then(r => {
+          r ? navigateTo({url: '/pages/calling/index'}) : answerCaller('NoDevice')
+        })
+        
       break;
       case 'call_accepted':        
       case 'call_successed':    

src/hooks/common/useAppInitInfo.ts

-import { getMenuButtonBoundingClientRect } from "@tarojs/taro";
+import { authorize, getMenuButtonBoundingClientRect, getSetting } from "@tarojs/taro";
 import { ref } from "vue";
 
 export function useAppInitInfo() {
   const rect = getMenuButtonBoundingClientRect();
-  const topDistance = ref(rect.height + rect.top + 10)
+  const topDistance = ref(rect.height + rect.top + 10);
+
+  const checkCamearSetting = () => {
+    return getSetting().then(res => {
+      if(res.authSetting["scope.camera"]) {
+        return true
+      } else {        
+        return new Promise((resolve) => {
+          authorize({
+            scope: 'scope.camera',
+            success: () => resolve(true),
+            fail: () => resolve(false)
+          })
+        })
+      }
+    })
+  }
 
   return {
     rect,
-    topDistance
+    topDistance,
+    checkCamearSetting
   }
 }
\ No newline at end of file

src/hooks/http/useCustomeRequest.ts

 import { CUSTOME_REQUESTER, RequesterFunc, RequestOptions } from 'vue-vulcan';
-import { request } from '@tarojs/taro';
+import { request, showToast } from '@tarojs/taro';
 
 export function useCustomeRequest(): RequesterFunc {
     return function (url: string, reqs: RequestOptions) {
@@ -7,6 +7,9 @@ export function useCustomeRequest(): RequesterFunc {
         return request({            
             ...reqs,
             url,
+            fail(err) {
+                showToast({title: '网络错误，请稍后再试', icon: 'none'})
+            }
         }) as Promise<any>
     };
 }

src/pages/index/contacts-list.vue

@@ -2,14 +2,28 @@
   import { useInjector } from 'vue-vulcan';
   import { useContacts } from 'any-hooks/contacts/useContacts';
   import { useCallCenter } from 'any-hooks/communication/useCallCenter';
-  import { navigateTo } from '@tarojs/taro';
+  import { navigateTo, showToast } from '@tarojs/taro';
+  import { useAppInitInfo } from 'src/hooks/common/useAppInitInfo';
+  import { UserData } from 'any-hooks/types/user';
 
-  const { callContact } = useInjector(useCallCenter);
+  const { callContact, myCallState } = useInjector(useCallCenter);
   const { contacts, roleContacts }    = useInjector(useContacts);
+  const { checkCamearSetting } = useInjector(useAppInitInfo)
 
   const gotoDetail = (id: string) => {
     navigateTo({url: '/pages/contact-detail/index?id='+ id})
   }
+
+  const onTapCall = (data: UserData) => {
+    if(myCallState.value !== 'free') {
+      showToast({title: '您当前已在通话中，无法发起呼叫'})
+    } else {
+      console.log('检查摄像头权限')
+      checkCamearSetting().then( r => {
+        r ? callContact(data) : showToast({title: '您未授权摄像头权限，请在设置中打开摄像头授权', icon: 'none'});
+      })      
+    }    
+  }
 </script>
 
 <template>
@@ -23,7 +37,7 @@
             <view>{{item.nickname}}</view>
             <text>{{item.group_name}}</text>              
           </view>
-          <image v-if="item.is_signin === '1'" @tap.stop="callContact(item)" class="call" src="../../assets/call3x.png" mode="widthFix"/>
+          <image v-if="item.is_signin === '1'" @tap.stop="onTapCall(item)" class="call" src="../../assets/call3x.png" mode="widthFix"/>
           <image v-else class="call" src="../../assets/call-no3x.png" mode="widthFix"/>
         </view>
       </view>      

src/pages/index/index.vue

@@ -35,7 +35,7 @@
     <scroll-view class="home-contents" :scrollY="true" @scroll="onScroll">
       <view class="tabs pd-1">
         <text class="tab-item contacts" :class="{active: viewMode==='items'}" @tap="setViewMode('items');setKeyWord('')">联系人</text>
-        <text class="tab-item group" :class="{active: viewMode==='groups'}" @tap="setViewMode('groups');setKeyWord('')">群组</text>
+        <!-- <text class="tab-item group" :class="{active: viewMode==='groups'}" @tap="setViewMode('groups');setKeyWord('')">群组</text> -->
       </view>
       <view class="list">
        <contacts-list v-if="viewMode === 'items'"></contacts-list>
@@ -88,9 +88,10 @@
       }
     }
     .list{
-      border-top-right-radius: 20px;
-      border-top-left-radius: 20px;
+      border-top-right-radius: 25px;
+      border-top-left-radius: 25px;
       min-height: 600px;
+      overflow: hidden;
     }
     .contact-list{    
       .contact-item{

src/pages/meeting/index.vue

@@ -12,7 +12,7 @@
   
   const { target } = useInjector(useCallCenter);  
   const { streamList, localPushurl, voiceMute, mode, switchLocalMicState, switchVideoOrAudio, leave } = useInjector(useMeetingCenter);  
-  const { topDistance } = useAppInitInfo(); 
+  const { topDistance, rect } = useAppInitInfo(); 
   
   /* 监听流的数量，自动退出会议 */
   watch(streamList, (current, last) => {
@@ -58,7 +58,7 @@
     if(activeVideo.value === -2) {
       setActive(index);
     } else {
-      setActive(-2)
+      setActive(-2);
     }
   }
 
@@ -69,10 +69,10 @@
     callContact(user);
     setInviting(false);
   }
-
 </script>
 
 <template>
+  <image class="navi-back" src="../../assets/arrow_left.png" mode="widthFix" :style="{top: rect.top+'px'}" @tap="navigateBack()"></image>
   <view class ="meeting-container page col-page" :style="{paddingTop: topDistance+'px'}">    
     <invite v-if="inviting" @choose="onInvite($event)" @cancel="setInviting(false)"></invite>
     <!-- <view class="c-info" style="color:#fff">
@@ -84,7 +84,7 @@
         v-for="(item, key) in streamList" 
         :key="key" 
         :stream="item"
-        :class="{active: activeVideo===key, hide: activeVideo!==-2}"
+        :class="{active: activeVideo===key, hide: activeVideo!==-2, mini: streamList.length > 5}"
         @tap="toggleActive(key)"
       >
       </stream-player>
@@ -92,7 +92,7 @@
         class="video-item"
         v-if="localPushurl" 
         :url="localPushurl" 
-        :class="{active: activeVideo===-1, hide: activeVideo!==-2}"
+        :class="{active: activeVideo===-1, hide: activeVideo!==-2, mini: streamList.length > 5}"
         @tap="toggleActive(-1)"
       >
       </stream-pusher>
@@ -139,8 +139,16 @@
 </template>
 
 <style lang="less">  
+  .navi-back{
+    width: 20px;
+    height: 20px;
+    left: 20px;
+    position: absolute;
+    z-index: 1000;
+  }
   .meeting-container{
     background: #333;
+    
     .videos{      
       flex:1;  
       text-align: center;      
@@ -154,6 +162,10 @@
         display: inline-block;
         background: #000;
         color: #fff;
+        &.mini{
+          width: 33.3%;
+          height: 200px;
+        }
         &.waiting{
           line-height: 300px;
         }

src/pages/meeting/invite.vue

@@ -42,13 +42,17 @@
     background-color: rgba(0, 0, 0, 0.65);
     .contacts{
       display: flex;      
-      // justify-content: space-between;
       padding: 0 30px;
-      flex-wrap: wrap;;
+      flex-wrap: wrap;
       .contact-item{
         color: #fff;
         margin: 0 15px;
         width: 175px;
+        text-align: center;
+        .avatar{
+          width: 80px;
+          height: 80px;
+        }
       }
     }
   }

src/pages/mine/index.vue

@@ -10,9 +10,9 @@
   const { submitLogOut } = useLogOut();
   const onLogOut = () => {
     showModal({
-      title: '是否确认退出当前账号?',
+      title: '是否确认退出当前账号?'      
     }).then( res => {
-      if(res.confirm) return submitLogOut({login_id: authData.value.id});
+      if(res.confirm) return submitLogOut({login_id: authData.value?.id});
       return null
     }).then(res => {
       res!== null && reLaunch({url: '/pages/login/index'});