Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/zhba_app

shuishen

2021-08-12 04f5693e63235fddf2650b591a6b25bdd1202a19

Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/zhba_app

 App.vue

@@ -4,6 +4,14 @@
        data() {
            return {
                login: '',

                show: true,
                name: 'a',
                list: [{
                    "name": 'tip',
                    "msg": 'The first content!'
                }],
                content: '123456'
            }
        },
        methods: {
@@ -25,14 +33,84 @@
                        url: 'pages/loging/loging?id=1',
                    })
                }
            }
            },
            //发送消息
            send: function() {
                if (this.content) {
                    this.list.push({
                        "name": this.name,
                        "msg": this.content
                    })
                    console.log(this.list)
                    this.socket.emit('sendMessage', {
                        "name": this.name,
                        "msg": this.content
                    });
                    this.content = ''
                    uni.pageScrollTo({
                        duration: 0,
                        scrollTop: this.list.length * 100
                    })
                } else {
                    uni.showToast({
                        title: '请输入内容',
                        icon: 'none'
                    })
                }
            },
            //提交姓名
            onSubmitName: function() {
                console.log(this.name)
                if (this.name) {
                    this.show = false
                    this.socket.emit('newPeople', this.name);
                }
            },
        },
        watch: {},
        mounted() {},
        mounted() {
            // 加载长连接服务器
            // this.socket.on('connect', () => {
            //     console.log('connection created.');
            //     // that.onSubmitName();
            // });


			
        },
        onLaunch: function() { //初始化完成时触发（全局只触发一次）
            var that = this;
            if (WxStorage.get("init") == '') {
                WxStorage.set("init", 'false');
                console.log('第一次进入')
                console.log('第一次进入');
				
                // uni.connectSocket({
                //     url: 'ws://192.168.0.111:9034/websocket'
                // });
				
                // uni.onSocketOpen(function(res) {
                //     socketOpen = true;
                //     sendSocketMessage();
                // });
				
                // function sendSocketMessage() {
                //     var data = {
                //                 type: that.$store.state.puserName,
                //                 id: that.$store.state.puserID
                //             }
                //     if (socketOpen) {
                //         uni.sendSocketMessage({
                //             data: JSON.stringify(data)
                //         });
                //     }
                // }

                // 加载长连接服务器
                // this.socket.on('connect', () => {
                //     console.log('connection created.');
                //     that.onSubmitName();
                // });

            }
            // this.judgeAdmin();
        },

 components/contacts/contacts.vue

@@ -76,7 +76,7 @@
                var datas = this.Pdata;
                //alert(datas.name)
                uni.navigateTo({
                    url: '/pages/groupChat/chating?chatID=' + datas.id.toString()
                    url: '/pages/groupChat/chating?chatID=' + datas.id.toString() + '&data=' + JSON.stringify(datas)
                });
            },
            onClose() { //触摸遮罩事件

 components/submit/submit.vue

@@ -3,85 +3,65 @@
        <view class="submit">
            <view class="submit-chat">
                <view class="bt-img">
                    <image src="../../static/images/chatroom/voice.png" 
                                 mode=""
                                 @tap="records"/>
                    <image src="../../static/images/chatroom/voice.png" mode="" @tap="records" />
                </view>
                <textarea auto-height="true" 
                                    class="chat-send btn" 
                                    :class="{displaynone: isrecord}"
                                    @input="inputs"
                                    v-model="msg"
                                    @focus="focus"/>
                <view class="record btn"
                            :class="{displaynone: !isrecord}"
                            @touchstart="touchstart"
                            @touchend="touchend"
                            @touchmove="touchmove"
                            >
                <textarea auto-height="true" class="chat-send btn" :class="{displaynone: isrecord}" @input="inputs"
                    v-model="msg" @focus="focus" />
                <view class="record btn" :class="{displaynone: !isrecord}" @touchstart="touchstart" @touchend="touchend"
                    @touchmove="touchmove">
                    按住说话
                </view>
                <view class="bt-img">
                    <image src="../../static/images/chatroom/emoji.png" 
                                 mode=""
                                 @tap="emoji"/>
                    <image src="../../static/images/chatroom/emoji.png" mode="" @tap="emoji" />
                </view>
                <view class="bt-img">
                    <image src="../../static/images/chatroom/add.png" 
                                 mode=""
                                 @tap="more"/>
                    <image src="../../static/images/chatroom/add.png" mode="" @tap="more" />
                </view>
            </view>
            <view class="emoji"
                        :class="{ displaynone: !isemoji }">
            <view class="emoji" :class="{ displaynone: !isemoji }">
                <view class="emoji-send">
                    <view class="emoji-send-del"
                                @tap="emojiBack">
                                删除
                    <view class="emoji-send-del" @tap="emojiBack">
                        删除
                    </view>
                    <view class="emoji-send-bt"
                                @tap="emojiSend">
                                发送
                    <view class="emoji-send-bt" @tap="emojiSend">
                        发送
                    </view>
                </view>
                <emoji @emotion="emotion"
                             :height="260" />
                <emoji @emotion="emotion" :height="260" />
            </view>
			
            <view class="more"
                        :class="{ displaynone: !ismore }">
                <view class="more-list" 
                            @tap="sendImg('album')">
                    <image src="../../static/images/chatroom/photo.png"/>

            <view class="more" :class="{ displaynone: !ismore }">
                <view class="more-list" @tap="sendImg('album')">
                    <image src="../../static/images/chatroom/photo.png" />
                    <text class="more-list-title">图片</text>
                </view>
                <view class="more-list"
                            @tap="sendImg('camera')">
                    <image src="../../static/images/chatroom/camera.png"/>
                <view class="more-list" @tap="sendImg('camera')">
                    <image src="../../static/images/chatroom/camera.png" />
                    <text class="more-list-title">拍照</text>
                </view>
                <view class="more-list">
                    <image src="../../static/images/chatroom/file.png"/>
                    <image src="../../static/images/chatroom/file.png" />
                    <text class="more-list-title">文件</text>
                </view>
                <view class="more-list"
                            @tap="chooseLocation()">
                    <image src="../../static/images/chatroom/location.png"/>
                <view class="more-list" @tap="chooseLocation()">
                    <image src="../../static/images/chatroom/location.png" />
                    <text class="more-list-title">位置</text>
                </view>
                <view class="more-list">
                    <image src="../../static/images/chatroom/vedio.png"/>
                <view class="more-list" @click="openAudio('Mains')">
                    <image src="../../static/images/chatroom/phone.png" />
                    <text class="more-list-title">语音</text>
                </view>
                <view class="more-list" @click="openVideo('Mains')">
                    <image src="../../static/images/chatroom/vedio.png" />
                    <text class="more-list-title">视频</text>
                </view>
            </view>
        </view>
		

        <!-- 录制语音遮罩 -->
        <view class="voice-bg"
                    :class="{displaynone: !voicebg}">
        <view class="voice-bg" :class="{displaynone: !voicebg}">
            <view class="voice-bg-len">
                <view class="voice-bg-time"
                            :style="{width:vlength/0.6 + '%'}">
                <view class="voice-bg-time" :style="{width:vlength/0.6 + '%'}">
                    {{ vlength }} "
                </view>
            </view>
@@ -92,10 +72,11 @@

<script>
    import emoji from './emoji/emoji.vue'
	

    const recorderManager = uni.getRecorderManager()
	

    export default {
        props: ['names'],
        data() {
            return {
                isrecord: false,
@@ -108,10 +89,10 @@
                pageY: 0,
            };
        },
        components:{
        components: {
            emoji,
        },
        methods:{
        methods: {
            // 获取高度
            _getElementHeight() {
                const query = uni.createSelectorQuery().in(this);
@@ -154,34 +135,34 @@
            inputs(e) {
                let chatm = e.detail.value
                let pos = chatm.indexOf('\n')
                if(pos != -1 && chatm.length > 1) {
                    this.send(this.msg,0)
                }
                setTimeout(() => {
                    this._getElementHeight()
                },10)
            },
            // 输入框聚焦
            focus(){
                this.isemoji = false;
                this.ismore = false;
                setTimeout(() => {
                    this._getElementHeight()
                },10)
            },
            // 表情内发送
            emojiSend() {
                if(this.msg.length > 0) {
                if (pos != -1 && chatm.length > 1) {
                    this.send(this.msg, 0)
                }
                setTimeout(() => {
                    this._getElementHeight()
                },10)
                }, 10)
            },
            // 输入框聚焦
            focus() {
                this.isemoji = false;
                this.ismore = false;
                setTimeout(() => {
                    this._getElementHeight()
                }, 10)
            },
            // 表情内发送
            emojiSend() {
                if (this.msg.length > 0) {
                    this.send(this.msg, 0)
                }
                setTimeout(() => {
                    this._getElementHeight()
                }, 10)
            },
            // 表情退格
            emojiBack() {
                if(this.msg.length > 0){
                    this.msg = this.msg.substring(0, this.msg.length-1)
                if (this.msg.length > 0) {
                    this.msg = this.msg.substring(0, this.msg.length - 1)
                }
            },
            // 发送消息
@@ -196,14 +177,14 @@
                }, 0)
                setTimeout(() => {
                    this._getElementHeight()
                },10)
                }, 10)
            },
            // 发送图片
            sendImg(e) {
                let count = 9;
                if(e == 'album') {
                if (e == 'album') {
                    count = 9
                }else {
                } else {
                    count = 1
                }
                uni.chooseImage({
@@ -212,14 +193,14 @@
                    sourceType: [e],
                    success: (res) => {
                        const filePath = res.tempFilePaths
                        for (let i in filePath){
                        for (let i in filePath) {
                            this.send(filePath[i], 1)
                        }
                    }
                })
                setTimeout(() => {
                    this._getElementHeight()
                },10)
                }, 10)
            },
            // 音频处理
            touchstart(e) {
@@ -230,7 +211,7 @@
                this.timer = setInterval(() => {
                    this.vlength = startIndex
                    startIndex++
                    if(startIndex > 60) {
                    if (startIndex > 60) {
                        clearInterval(this.timer)
                        this.touchend();
                    }
@@ -245,15 +226,15 @@
                        voice: res.tempFilePath,
                        time: this.vlength
                    }
                    if(this.voicebg){
                    if (this.voicebg) {
                        this.send(data, 2);
                    }					
                    }
                    this.vlength = 0
                    this.voicebg = false
                })
            },
            touchmove(e) {
                if(this.pageY - e.changedTouches[0].pageY > 200) {
                if (this.pageY - e.changedTouches[0].pageY > 200) {
                    this.voicebg = false
                }
            },
@@ -274,7 +255,66 @@
                        console.log('经度' + res.longitude)
                    }
                })
            }
            },
            //开始音频
            openAudio(val) { //Mains
                // console.log(this.names)
                // var socketOpen = false;


                uni.navigateTo({
                    url: '../videoCall/videoCall?state=' + val + '&type=audio'
                });
            },
            //接收音频
            receiveAudio(val) { //Receiver
                uni.navigateTo({
                    url: '../videoCall/videoCall?state=' + val + '&type=audio'
                });
            },
            //开始视频
            openVideo(val) { //Mains
                // uni.onSocketOpen(function(res) {
                //     // socketOpen = true;
                //     console.log('持续连接成功')
                //     sendSocketMessage();
                // });

                // function sendSocketMessage() {
                //     var data = {
                //         name: this.$store.state.puserName,
                //         id: this.names[1],
                //         // id: state.puserID,
                //         type: 'video'
                //     }
                //     // if (socketOpen) {
                //     uni.sendSocketMessage({
                //         data: JSON.stringify(data)
                //     });
                //     // }
                // }
                var url = '../videoCall/videoCall?state=' + val + '&type=video' + '&myname=' + this.names[0] +
                        '&toname=' + this.names[1]
            console.log(url)
                uni.navigateTo({
                    url: url
                });
            },
            //接收视频
            // receiveVideo(val, room) { //Receiver
            //     uni.navigateTo({
            //         url: '../videoCall/videoCall?state=' + val + '&type=video' + '&room=' + room
            //     });
            // }
        },
        mounted() {
            // uni.onSocketMessage(function(res) {
            //     console.log(res.data)
            //     if (res.data.type == 'video') {
            //         this.receiveVideo('Receiver', );
            //     }
            //     // console.log('收到服务器内容：' + res.data);
            // });
        }
    }
</script>
@@ -290,21 +330,21 @@
        z-index: 1002;
        padding-bottom: env(safe-area-inset-bottom);
    }
	

    .submit-chat {
        width: 100%;
        display: flex;
        align-items: flex-end;
        box-sizing: border-box;
        padding: 14rpx 10rpx;
		

        image {
            width: 56rpx;
            height: 56rpx;
            margin: 0 10rpx;
            flex: auto;
        }
		

        .btn {
            flex: auto;
            background-color: #fff;
@@ -313,29 +353,30 @@
            max-height: 160rpx;
            margin: 0 10rpx;
        }
		

        .chat-send {
            line-height: 44rpx !important;
        }
		

        .record {
            text-align: center;
            font-size: $uni-font-size-lg;
            color: $uni-text-color-grey;
            font-weight: bold;
        }
		

    }

    .displaynone {
        display: none;
    }
	

    .emoji {
        width: 100%;
        height: 460rpx;
        background: rgba(236, 237, 238, 1);
        box-shadow: 0 -1rpx 0 0 rgba(0, 0, 0, 1);
		

        .emoji-send {
            width: 260rpx;
            height: 104rpx;
@@ -345,19 +386,19 @@
            right: 0;
            padding-top: 24rpx;
            display: flex;
			

            .emoji-send-bt {
                flex: 1;
                height: 80rpx;
                margin: 0 32rpx 0 20rpx;
                background: rgba(255, 228, 49 ,1);
                background: rgba(255, 228, 49, 1);
                border-radius: 240rpx;
                font-size: 32rpx;
                text-align: center;
                line-height: 80rpx;
                border-radius: 12rpx;
            }
			

            .emoji-send-del {
                flex: 1;
                height: 80rpx;
@@ -371,6 +412,7 @@
            }
        }
    }

    .more {
        width: 100%;
        height: 436rpx;
@@ -379,7 +421,7 @@
        bottom: env(safe-area-inset-bottom);
        padding: 0 20rpx;
        box-sizing: border-box;
		

        .more-list {
            width: 25%;
            text-align: center;
@@ -393,7 +435,7 @@
                background: rgba(255, 255, 255, 1);
                border-radius: 24rpx;
            }
			

            .more-list-title {
                color: rgba(30, 40, 50, .5);
                line-height: 34rpx;
@@ -402,7 +444,7 @@
            }
        }
    }
	

    .voice-bg {
        height: 100%;
        width: 100%;
@@ -412,7 +454,7 @@
        bottom: 0;
        z-index: 1001;
        // position: relative;
		

        .voice-bg-len {
            height: 84rpx;
            width: 600rpx;
@@ -425,6 +467,7 @@
            background: rgba(255, 255, 255, .2);
            border-radius: 42rpx;
            text-align: center;

            .voice-bg-time {
                display: inline-block;
                line-height: 84rpx;
@@ -433,15 +476,15 @@
                min-width: 120rpx;
            }
        }
		

        .voice-del {
            position: absolute;
            bottom: 148rpx;
            margin-bottom: env(safe-area-inset-bottom);
            width: 100%;
            text-align: center;
             color: #fff;
             font-size: $uni-font-size-base;
            color: #fff;
            font-size: $uni-font-size-base;
        }
    }
</style>

 main.js

@@ -24,6 +24,8 @@
import httpInstall from '@/http/install.js'
Vue.use(httpInstall, app)


 
// 公共函数
import globalFunc from '@/utils/func.js'
Vue.use(globalFunc, app);

 manifest.json

@@ -56,7 +56,9 @@
            "ios" : {},
            /* SDK配置 */
            "sdkConfigs" : {
                "ad" : {}
                "ad" : {
                    "360" : {}
                }
            },
            "icons" : {
                "android" : {

 pages.json

@@ -16,7 +16,8 @@
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/registerUser/registerUser",
            "name": "loging",
            "style": {
@@ -29,14 +30,7 @@
                // }
            }
        },
        // {
        //     "path": "pages/home/home",
        //     "style": {
        //         "navigationBarTitleText": "首页",
        //         "enablePullDownRefresh": false,
        //         "navigationStyle": "custom"
        //     }
        // },
	
        {
            "path": "pages/service/service",
            "style": {
@@ -44,44 +38,48 @@
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }

        }, {
        },
        {
            "path": "pages/manage/manage",
            "style": {
                "navigationBarTitleText": "管理",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }

        }, {
        },
        {
            "path": "pages/user/center",
            "style": {
                "navigationBarTitleText": "我的",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/talking/talking",
            "style": {
                "navigationBarTitleText": "好友",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/groupChat/groupChat",
            "style": {
                "navigationBarTitleText": "聊天室",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/groupChat/chatingQZ",
            "style": {
                "navigationBarTitleText": "聊天室",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/groupChat/chating",
            "style": {
                "navigationBarTitleText": "聊天室",
@@ -89,7 +87,6 @@
                "navigationStyle": "custom"
            }
        },

        {
            "path": "pages/securityStaff/exhibition",
            "style": {
@@ -98,7 +95,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/securityStaff/information",
            "style": {
                "navigationBarTitleText": "详细信息",
@@ -106,9 +104,6 @@
                "navigationStyle": "custom"
            }
        },



        {
            "path": "pages/company/company",
            "style": {
@@ -117,7 +112,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/company/companyDetail",
            "style": {
                "navigationBarTitleText": "服务单位管理",
@@ -125,7 +121,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/report/report",
            "style": {
                "navigationBarTitleText": "工作汇报",
@@ -133,7 +130,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/report/initiate",
            "style": {
                "navigationBarTitleText": "发起汇报",
@@ -141,7 +139,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/report/send",
            "style": {
                "navigationBarTitleText": "发送汇报列表",
@@ -149,7 +148,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/report/sendDetail",
            "style": {
                "navigationBarTitleText": "发送汇报详情",
@@ -157,7 +157,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/report/receive",
            "style": {
                "navigationBarTitleText": "接受汇报列表",
@@ -165,7 +166,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/report/receiveDetail",
            "style": {
                "navigationBarTitleText": "接收汇报详情",
@@ -173,7 +175,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/dispatch/dispatch",
            "style": {
                "navigationBarTitleText": "调度指令",
@@ -181,7 +184,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/dispatch/look",
            "style": {
                "navigationBarTitleText": "指令查看",
@@ -189,7 +193,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/dispatch/lookDetail",
            "style": {
                "navigationBarTitleText": "指令详情",
@@ -197,7 +202,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/dispatch/issue",
            "style": {
                "navigationBarTitleText": "文字指令下发",
@@ -205,7 +211,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/dispatch/imgissue",
            "style": {
                "navigationBarTitleText": "图片指令下发",
@@ -213,7 +220,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/message/message",
            "style": {
                "navigationBarTitleText": "通知通告",
@@ -221,7 +229,8 @@
                "navigationBarBackgroundColor": "#0BB9C8",
                "navigationBarTextStyle": "white"
            }
        }, {
        },
        {
            "path": "pages/examine/examine",
            "style": {
                "navigationBarTitleText": "现场检查",
@@ -302,95 +311,103 @@
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }

        }, {
        },
        {
            "path": "pages/login/login-phone",
            "style": {
                "navigationBarTitleText": "手机登录",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }

        }, {
        },
        {
            "path": "pages/login/login-account",
            "style": {
                "navigationBarTitleText": "账号登录",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }

        }, {
        },
        {
            "path": "pages/system/setting",
            "style": {
                "navigationBarTitleText": "设置",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }

        }, {
        },
        {
            "path": "pages/news/list",
            "style": {
                "navigationBarTitleText": "新闻动态",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }

        }, {
        },
        {
            "path": "pages/news/detail",
            "style": {
                "navigationBarTitleText": "新闻详情页",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/demo/demo",
            "style": {
                "navigationBarTitleText": "示例页",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/demo/storage",
            "style": {
                "navigationBarTitleText": "storage测试页",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/demo/vuex",
            "style": {
                "navigationBarTitleText": "vuex测试页",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/demo/mock",
            "style": {
                "navigationBarTitleText": "mock测试页",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/demo/request",
            "style": {
                "navigationBarTitleText": "request测试页",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/demo/crud",
            "style": {
                "navigationBarTitleText": "crud测试页",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        }, {
        },
        {
            "path": "pages/videoCall/videoCall",
            "style": {
                "navigationBarTitleText": "视频通话",
                "enablePullDownRefresh": false
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
                // "enablePullDownRefresh": false
            }

        }
    ],
    "globalStyle": {
@@ -398,32 +415,41 @@
        "navigationBarTitleText": "",
        "navigationBarBackgroundColor": "#fff",
        "backgroundColor": "#F7F7F7"
        // "app-plus": {
        //     "titleNView": true,
        //     "bounce": "none"
        // }
    },
    "tabBar": {
        "color": "#A6ABB5",
        "selectedColor": "#0BB9C8",
        "borderStyle": "white",
        "backgroundColor": "#ffffff",
        "list": [{
            "pagePath": "pages/home/home",
            "iconPath": "static/images/tabbar/home.png",
            "selectedIconPath": "static/images/tabbar/home_selected.png",
            "text": "首页"
        }, {
            "pagePath": "pages/groupChat/groupChat",
            "iconPath": "static/images/tabbar/demo.png",
            "selectedIconPath": "static/images/tabbar/demo_selected.png",
            "text": "好友"
        }, {
            "pagePath": "pages/manage/manage",
            "iconPath": "static/images/tabbar/manage.png",
            "selectedIconPath": "static/images/tabbar/manage_selected.png",
            "text": "管理"
        }, {
            "pagePath": "pages/user/center",
            "iconPath": "static/images/tabbar/user.png",
            "selectedIconPath": "static/images/tabbar/user_selected.png",
            "text": "我的"
        }]
        "list": [
            {
                "pagePath": "pages/home/home",
                "iconPath": "static/images/tabbar/home.png",
                "selectedIconPath": "static/images/tabbar/home_selected.png",
                "text": "首页"
            },
            {
                "pagePath": "pages/groupChat/groupChat",
                "iconPath": "static/images/tabbar/demo.png",
                "selectedIconPath": "static/images/tabbar/demo_selected.png",
                "text": "好友"
            },
            {
                "pagePath": "pages/manage/manage",
                "iconPath": "static/images/tabbar/manage.png",
                "selectedIconPath": "static/images/tabbar/manage_selected.png",
                "text": "管理"
            },
            {
                "pagePath": "pages/user/center",
                "iconPath": "static/images/tabbar/user.png",
                "selectedIconPath": "static/images/tabbar/user_selected.png",
                "text": "我的"
            }
        ]
    }
}
}

 pages/groupChat/chating.vue

@@ -125,7 +125,7 @@
        </view>
        <!-- <view class="padbt"></view> -->
    </scroll-view>
    <submit @inputs="inputs" 
    <submit @inputs="inputs"  :names="name"
                    @heights="heights"/>
    </view>
</template>
@@ -156,7 +156,9 @@
                loading: '',                  // 滚动事件
                isload: true,
                isanimation: true,
                begainloading: true
                begainloading: true,
				
                name: []//视频 双方id
            };
        },
        components:{
@@ -166,6 +168,9 @@
            this.recipientId = option.chatID;
            this._getMsg(this.nowpage)
            // this.nextPage()
            var data = JSON.parse(option.data)
            console.log(data,55555555555555555555555)
            this.name = ['wo',data.id];
        },
        methods:{
            // 返回键
@@ -209,7 +214,7 @@
                var that = this;
                that.senId = WxStorage.get("ids");
                uni.request({
                    url:"http://s16s652780.51mypc.cn/api/chat-records/getSingleMessagePage",
                    url:"http://223.82.109.183:2080/api/chat-records/getSingleMessagePage",
                    method:"get",
                    data:{
                        senderId: that.senId,
@@ -332,7 +337,7 @@
                }
                
                uni.request({
                    url:"http://s16s652780.51mypc.cn/api/chat-records/insertSingleChat",
                    url:"http://223.82.109.183:2080/api/chat-records/insertSingleChat",
                    method:"post",
                    data:{
                        senderId: that.senId,

 pages/groupChat/groupChat.vue

@@ -3,8 +3,13 @@
    <view class="work">
        <!-- 自定义顶部导航栏 -->
        <!-- <navBarTop :title="'聊天室'"></navBarTop> -->
        <view style="height:100rpx;"></view>
        <view class="tab" style="position: fixed;top: 0;width: 100%;height: 100rpx;z-index: 100;">
		
        <view style="height:205rpx;"></view>
        <view class="tab" style="position: fixed;top: 0;width: 100%;height: 205rpx;z-index: 100;">
            <u-navbar style="position: relative;left: -20rpx;" :is-fixed="false" :border-bottom="false" :is-back="false" title="好友"
                :background="{ background: '#0BB9C8' }" title-color="#fff">
                <image slot="right" src="/static/images/home/message.png" class="message-icon" mode="widthFix"></image>
            </u-navbar>
            <u-tabs :list="list" :is-scroll="false" :current="current" active-color="#14B9C8" inactive-color="#595959"
                height="100" @change="change" style="background-color:rgba(255,255,255,0.8)"></u-tabs>
        </view>
@@ -134,7 +139,7 @@
                var that = this;
                if(this.current == 0){
                    uni.request({
                        url:"http://s16s652780.51mypc.cn/api/chat-records/getChatListPage",
                        url:"http://223.82.109.183:2080/api/chat-records/getChatListPage",
                        method:"get",
                        data:{
                            senderId: WxStorage.get("ids")
@@ -152,7 +157,7 @@
                    });
                }else if(this.current == 1){
                    uni.request({
                        url:"http://s16s652780.51mypc.cn/api/chatgroup/selectList",
                        url:"http://223.82.109.183:2080/api/chatgroup/selectList",
                        method:"POST",
                        data:{
                            senderId: WxStorage.get("ids")
@@ -170,7 +175,7 @@
                    })
                }else if(this.current == 2){
                    uni.request({
                        url:"http://s16s652780.51mypc.cn/api//blade-user/pages?current=1&size=9999",
                        url:"http://223.82.109.183:2080/api/blade-user/pages?current=1&size=9999",
                        method:"get",
                        data:{
                            senderId: WxStorage.get("ids")
@@ -310,4 +315,10 @@
            }
        }
    }
    .message-icon {
        width: 32rpx;
        height: auto;
        margin-right: 27rpx;
    }
	
</style>

 pages/home/home.vue

@@ -114,8 +114,8 @@
            </view>
            <!-- 新闻模块 end -->
        </view>
            <!-- <u-button class="ccbut" type="primary" @click="openVideo('Mains')">测试点视频通话：主播</u-button> -->
            <!-- <u-button class="ccbut" type="primary" @click="openVideo('Receiver')">测试点视频通话：第二个</u-button> -->
            <!-- <u-button class="ccbut" type="primary" @click="openVideo('Mains')">测试点视频通话：主播</u-button>
            <u-button class="ccbut" type="primary" @click="openVideo('Receiver')">测试点视频通话：第二个</u-button> -->
    </view>
</template>

@@ -144,7 +144,37 @@
                serviceButton: []
            };
        },
        mounted() {
            var socketOpen = false;
            //websocket连接
            // uni.connectSocket({
            //     url: 'ws://192.168.0.111:9034/websocket'
            // });
			
            // uni.onSocketOpen(function(res) {
            //     socketOpen = true;
            //     sendSocketMessage();
            // });
			
            // function sendSocketMessage() {
            //     var data = {
            //                 type: 'my',
            //                 id: '1415922341221867522'
            //             }
            //     if (socketOpen) {
            //         uni.sendSocketMessage({
            //             data: JSON.stringify(data)
            //         });
            //     }
            // }
			
            // uni.onSocketMessage(function(res) {
            //     console.log('收到服务器内容：' + res.data);
            // });
			
        },
        onLoad() {
			
            // 后续将改为与后端联动
            // 加载banner数据
            fakePosition().then(data => {
@@ -183,7 +213,8 @@
        methods: {
            openVideo(val){
                uni.navigateTo({
                    url: '../videoCall/videoCall?state=' + val
                    // url: '../videoCall/videoCall?state=' + val + '&type=video'
                    url: '../videoCall/videoCall?state=Mains&type=video&myname=wo&toname=1424647828935819265'
                });
            },
            changePicker(e) {

 pages/videoCall/moban.vue

copy from pages/videoCall/videoCall.vue
copy to pages/videoCall/moban.vue
File was copied from pages/videoCall/videoCall.vue
@@ -3,7 +3,7 @@
        <!-- 加入频道 -->
        <view class="index" v-if="!videoShow">
            <!-- 输入频道 -->
            <!-- <view class="chanel">
            <view class="chanel">
                <input class="uni-input activetext" v-model="channel" focus placeholder="请输入频道号" />
            </view>

@@ -17,33 +17,6 @@

            <view class="join">
                <button type="primary" class="button jion_bg" @click="join"><text class="activetext">加入频道</text></button>
            </view> -->
            <view class="Mains" v-if="isMain">
                <view class="title">
                    正在呼叫{{MainName}}
                    <u-loading size="36" mode="flower"></u-loading>
                </view>

                <!-- 挂断 -->
                <view class="open" @click="phoneFnMain">
                    <image class="video_bg_img" src="../../static/over.png" mode=""></image>
                    <text class="open_text">取消呼叫</text>

                </view>
            </view>
            <view class="Receiver" v-if="!isMain">
                <!-- <u-button class="ccbut" type="primary" @click="join('Receiver')">确认进入{{channel}}号房间</u-button> -->
                <!-- <u-button class="ccbut" type="primary" @click="comeBack">拒绝进入</u-button> -->
                <view class="open" @click="join('Receiver')">
                    <image class="video_bg_img" src="../../static/phone.png" mode=""></image>
                    <text class="open_text">接受</text>

                </view>
                <view class="open" @click="comeBack">
                    <image class="video_bg_img" src="../../static/over.png" mode=""></image>
                    <text class="open_text">挂断</text>

                </view>
            </view>
        </view>

@@ -78,8 +51,7 @@
            <view class="videoshow_control position">
                <!-- 音频开关 -->
                <view class="open" @click="audioSwitchFn" v-if="role == 1">
                    <image class="video_bg_img" src="../../static/au_in.png" mode="" v-if="audioSwitch == 'open'">
                    </image>
                    <image class="video_bg_img" src="../../static/au_in.png" mode="" v-if="audioSwitch == 'open'"></image>
                    <image class="video_bg_img" src="../../static/au_on.png" mode="" v-else></image>
                    <text class="open_text">音频</text>
                </view>
@@ -93,8 +65,7 @@

                <!-- 视频开关 -->
                <view class="open" @click="vedioSwitchFn" v-if="role == 1">
                    <image class="video_bg_img" src="../../static/vi_on.png" mode="" v-if="vedioSwitch == 'open'">
                    </image>
                    <image class="video_bg_img" src="../../static/vi_on.png" mode="" v-if="vedioSwitch == 'open'"></image>
                    <image class="video_bg_img" src="../../static/vi_in.png" mode="" v-else></image>
                    <text class="open_text">视频</text>
                </view>
@@ -142,13 +113,7 @@
                // videoShowBg: true, //背景展示
                promptText: "loading...",

                PeerVideoUser: [{
                    a: 1
                }, {
                    a: 2
                }, {
                    a: 3
                }], //用户视频加入存储
                PeerVideoUser: [], //用户视频加入存储
                PeerVideoUserStyle: "video_local", //用户视频加入样式

                // 本地
@@ -161,29 +126,14 @@
                popupType: "",
                popupMessage: "",

                isMain: false,
                MainName: '222',
                userName: '111'

                // closeArray: []
            }
        },
        // 页面初始加载（仅执行一次）
        onReady() {
            // 初始化
            this.channel = 2554;
            console.log(RtcModule)
            this.init();
        },
        onLoad(option) {
            console.log(option.state);
            if (option.state == "Mains") {
                this.isMain = true;
                setTimeout(res => {
                    this.join();
                }, 2000)
            } else if (option.state == "Receiver") {
                this.isMain = false;
            }
        },

        watch: {
@@ -241,12 +191,8 @@
                }, (ret) => {});
            },


            //加入频道 跳转到视频
            async join(val) {
                var that = this;
                // if (val == "Mains") { //视频发起人进入
                console.log('视频发起人进入');
            async join() {
                uni.showLoading({
                    title: '加载中',
                    mask: true
@@ -257,37 +203,8 @@
                    "channelId": this.channel,
                    "uid": this.uid
                }, (res) => {
                    console.log(res, 'join break');
                    console.log('成功进入房间：' + that.channel);
                    console.log(res,'join break')
                })
                // } else if (val == 'Receiver') { //视频接收人进入
                //     console.log('视频接收人进入');
                //     uni.showLoading({
                //         title: '加载中',
                //         mask: true
                //     });
                //     //加入房间
                //     await RtcModule.joinChannel({
                //         "token": "",
                //         "channelId": this.channel,
                //         "uid": this.uid
                //     }, (res) => {
                //         console.log(res, 'join break');
                //         console.log('成功进入房间：' + that.channel);
                //     })
                // }

            },
            // 等待时候挂断
            phoneFnMain() {
                // RtcModule.leaveChannel((res) => {});
                console.log("等待时候挂断");
                uni.navigateBack();
            },
            //拒绝进入视频
            comeBack() {
                console.log("拒绝进入视频");
                uni.navigateBack();
            },

            // 挂断 离开
@@ -378,8 +295,7 @@
                                }, (res) => {})
                                setTimeout(() => {
                                    // 启用视频模块。
                                    this.role == 1 ? this.setupLocalVideoFn() : RtcModule
                                        .enableVideo((res) => {});
                                    this.role == 1 ? this.setupLocalVideoFn() : RtcModule.enableVideo((res) => {});
                                }, 200)
                            }, 2000)
                            break;
@@ -458,7 +374,7 @@
                this.vedioSwitch = "open"; //视频开关
                // 重新创建实例
                await this.init();
                // 如果需要跳转其它页面请按下边步骤
              // 如果需要跳转其它页面请按下边步骤
                // await uni.redirectTo({
                //     url: '..',
                //     success: () => {
@@ -473,9 +389,8 @@
            async requestAndroidPermission(permisionID, type) {
                let result = 0;
                let strStatus = "";
                type == 'ios' ? result = await permision.judgeIosPermission(permisionID) : result = await permision
                    .requestAndroidPermission(
                        permisionID);
                type == 'ios' ? result = await permision.judgeIosPermission(permisionID) : result = await permision.requestAndroidPermission(
                    permisionID);
                if (result == 1) {
                    strStatus = "已获得授权"
                } else if (result == 0) {
@@ -489,7 +404,7 @@
    }
</script>

<style lang="scss" scoped>
<style>
    .content {
        flex: 1;
    }
@@ -498,99 +413,6 @@
    .index {
        flex: 1;
        background-color: #0A1621;
        height: 100vh;
    }

    /* 等待时候样式   Main */
    .ccbut {
        position: relative;
        top: 45vh;
    }

    .Mains {
        // position: absolute;
        // width: 100%;
        // height: 5rem;
        width: 100%;
        height: 100vh;
        box-sizing: border-box;
        // border: 1px solid #fff;
        display: flex;
        align-items: center;
        justify-content: center;

        // bottom: 0;
        .title {
            color: #fff;
        }

        .open {
            // border: 1px solid #fff;
            position: fixed;
            bottom: 3rem;
            width: 100%;
            height: 4.3rem;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;

            .video_bg_img {
                width: 3rem;
                height: 2rem;
            }

            .open_text {
                padding: 5px 0 0;
                text-align: center;
                display: block;
                // border: 1px solid #fff;
                color: #fff;
            }
        }
    }

    .Receiver {
        // position: absolute;
        // width: 100%;
        // height: 5rem;
        width: 100%;
        height: 100vh;
        box-sizing: border-box;
        // border: 1px solid #fff;
        display: flex;
        align-items: center;
        justify-content: center;

        // bottom: 0;
        .title {
            color: #fff;
        }

        .open {
            // border: 1px solid #fff;
            position: relative;
            top: 12rem;
            width: 100%;
            height: 4.3rem;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;

            .video_bg_img {
                width: 3rem;
                height: 2rem;
            }

            .open_text {
                padding: 5px 0 0;
                text-align: center;
                display: block;
                // border: 1px solid #fff;
                color: #fff;
            }
        }
    }

    .chanel {
@@ -650,11 +472,6 @@
    .vedioWatch {
        flex: 1;
        position: relative;
        width: 100%;
        height: 100vh;
        background-color: #0A1621;


    }

    /* 初始背景 */
@@ -670,7 +487,6 @@

    .video_bg_img {
        flex: 1;
        width: 100%;
    }

    .video_bg_text {
@@ -695,21 +511,21 @@
        flex-direction: row;
        background-color: transparent;
    }
	

    /* 1个视频 */
    .video_local {
        width: 750rpx;
        height: 1334rpx;
        background-color: transparent;
    }
	

    .video_region_padding {
        margin-top: 20px;
        padding: 200rpx 0 260rpx;
        width: 750rpx;
        height: 840rpx;
    }
	

    /* 4个视频 */
    .video_local_1 {
        width: 375rpx;
@@ -730,8 +546,8 @@

    /* 音视频基本开关 */
    .videoshow_control {
        position: absolute;
        bottom: 3rem;
        /* position: absolute; */
        bottom: 20rpx;
        left: 0;
        width: 750rpx;
        /* background-color: #007AFF; */
@@ -739,28 +555,8 @@
        padding: 20px;
        background-color: transparent;
        color: #fff;
        display: flex;
        flex-direction: row;
        justify-content: space-around;

        image {
            width: 3rem;
        }

        .open {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            height: 4.3rem;
        }
    }

    .camera {
        image {
            width: 2rem;
            height: 2rem;
        }
    }

    .open {
@@ -770,7 +566,7 @@
    }

    .open_text {
        padding: 5px 0 0;
        padding: 15px 0 0;
        text-align: center;
        color: #fff;
    }

 pages/videoCall/videoCall - 副本.vue

File was renamed from pages/videoCall/videoCall.vue
@@ -283,17 +283,20 @@
                // RtcModule.leaveChannel((res) => {});
                console.log("等待时候挂断");
                uni.navigateBack();
                this.closeAll();
            },
            //拒绝进入视频
            comeBack() {
                console.log("拒绝进入视频");
                uni.navigateBack();
                this.closeAll();
            },

            // 挂断 离开
            phoneFn() {
                //离开频道
                RtcModule.leaveChannel((res) => {})
                RtcModule.leaveChannel((res) => {});
                this.closeAll();
            },

            //添加本地视频到页面
@@ -492,27 +495,25 @@
<style lang="scss" scoped>
    .content {
        flex: 1;
        height: 100%;
        overflow: hidden;
    }

    /* 加入频道 */
    .index {
        flex: 1;
        background-color: #0A1621;
        height: 100vh;
        height: 100%;
    }

    /* 等待时候样式   Main */
    .ccbut {
        position: relative;
        top: 45vh;
    }

    .Mains {
        // position: absolute;
        // width: 100%;
        // height: 5rem;
        width: 100%;
        height: 100vh;
        height: 100%;
        box-sizing: border-box;
        // border: 1px solid #fff;
        display: flex;
@@ -555,7 +556,7 @@
        // width: 100%;
        // height: 5rem;
        width: 100%;
        height: 100vh;
        height: 100%;
        box-sizing: border-box;
        // border: 1px solid #fff;
        display: flex;
@@ -593,30 +594,6 @@
        }
    }

    .chanel {
        padding: 120px 20px 20px;
    }

    .uni-input {
        height: 120rpx;
        padding: 0 20px;
        background-color: #2F3041;
        border-radius: 6px;
    }

    .setrole {
        padding: 60px 20px;
        flex-direction: row;
        justify-content: space-between;
    }

    .button {
        padding: 10px 70rpx;
        background-color: #2F3041;
        border-radius: 6px;
        border-width: 2px;
        border-color: #2f3041;
    }

    .text {
        color: #B4B5BE;
@@ -634,15 +611,6 @@
        border-width: 2px;
        border-color: #40a3fb;
        background-color: #0A1621;
    }

    .join {
        padding: 20px;
    }

    .jion_bg {
        background-color: #40A3FB;
        border-width: 0;
    }


@@ -675,7 +643,7 @@

    .video_bg_text {
        justify-content: center;
        align-items: center;
        align-items: center;	
    }

    /* 转换摄像头 */

 pages/videoCall/videoCall.nvue

copy from pages/videoCall/videoCall.vue
copy to pages/videoCall/videoCall.nvue
File was copied from pages/videoCall/videoCall.vue
@@ -2,53 +2,40 @@
    <view class="content">
        <!-- 加入频道 -->
        <view class="index" v-if="!videoShow">
            <!-- 输入频道 -->
            <!-- <view class="chanel">
                <input class="uni-input activetext" v-model="channel" focus placeholder="请输入频道号" />
            </view>

            <view class="setrole">

                <button type="default" :class="role == 1? 'active': 'button'" @click="setClientRole(1)"><text class="text button_text"
                     :class="role == 1? 'activetext': ''">我是主播</text></button>

                <button type="default" :class="role == 2? 'active': 'button'" @click="setClientRole(2)"><text class="text" :class="role == 2? 'activetext': ''">我是游客</text></button>
            </view>

            <view class="join">
                <button type="primary" class="button jion_bg" @click="join"><text class="activetext">加入频道</text></button>
            </view> -->
            <view class="Mains" v-if="isMain">
                <view class="title">
                    正在呼叫{{MainName}}
                <view class="Mains-t">
                    <text class="activetext">正在呼叫{{toName}}</text>
                    <u-loading size="36" mode="flower"></u-loading>
                </view>

                <!-- 挂断 -->
                <view class="open" @click="phoneFnMain">
                    <image class="video_bg_img" src="../../static/over.png" mode=""></image>
                <view class="i-open" @click="phoneFnMain">
                    <image class="i-video_bg_img" src="../../static/over.png" mode=""></image>
                    <text class="open_text">取消呼叫</text>

                </view>
            </view>
            <view class="Receiver" v-if="!isMain">
                <!-- <u-button class="ccbut" type="primary" @click="join('Receiver')">确认进入{{channel}}号房间</u-button> -->
                <!-- <u-button class="ccbut" type="primary" @click="comeBack">拒绝进入</u-button> -->
                <view class="open" @click="join('Receiver')">
                    <image class="video_bg_img" src="../../static/phone.png" mode=""></image>
                    <text class="open_text">接受</text>

                <view class="Mains-t">
                    <text class="activetext">是否接收来自{{formName}}的{{Otype}}请求</text>
                    <text class="activetext">接受进入{{channel}}</text>
                    <u-loading size="36" mode="flower"></u-loading>
                </view>
                <view class="open" @click="comeBack">
                    <image class="video_bg_img" src="../../static/over.png" mode=""></image>
                    <text class="open_text">挂断</text>
                <view class="i-control">
                    <view class="i-c-open" @click="joinit">
                        <image class="i-video_bg_img" src="../../static/phone.png" mode=""></image>
                        <text class="open_text">接受</text>

                    </view>
                    <view class="i-c-open" @click="comeBack">
                        <image class="i-video_bg_img" src="../../static/over.png" mode=""></image>
                        <text class="open_text">挂断</text>

                    </view>
                </view>
            </view>
        </view>

        <!-- 视频 -->
        <view class="vedio vedioWatch" v-else>
        <view class="vedioWatch" v-if="videoShow && Otype == 'video'">

            <view class="video_bg">
                <image class="video_bg_img" src="../../static/BG.png" mode=""></image>
@@ -59,14 +46,16 @@
                </view> -->
            </view>

            <view class="video_region" :class="PeerVideoUser.length > 1 ? 'video_region_padding' : ''">
            <view class="video_region">
                <!-- 渲染视频 -->
                <view v-for="peervideo in PeerVideoUser" :key="peervideo">
                    <view :class="PeerVideoUserStyle" v-if="peervideo == uid && role == 2 ? false : true">
                <view v-for="(peervideo,index) in PeerVideoUser" :key="peervideo">
                    <view :class="PeerVideoUserStyle[index]" v-if="peervideo == uid && role == 2 ? false : true">
                        <AR-CanvasView :ref="`popup${peervideo}`" style="flex: 1;"></AR-CanvasView>
                    </view>

                </view>

                <!-- {{PeerVideoUser}} -->
            </view>

            <!-- 转换摄像头 -->
@@ -110,6 +99,61 @@
                <!-- </view> -->
            </view>
        </view>

        <!-- 音频 -->
        <view class="vedioWatch" v-if="videoShow && Otype == 'audio'">
            <view class="video_bg">
                <image class="video_bg_img" src="../../static/BG.png" mode=""></image>
                <!-- <text class="activetext" v-if="videoShowBg"></text> -->
                <!--     <view class="video_bg video_bg_text">
			
                    <text class="activetext">{{promptText}}</text>
                </view> -->
            </view>
            <!-- 文字提示 -->
            <view class="Mains-t">
                <text class="activetext">语音通话中</text>
                <u-loading size="36" mode="flower"></u-loading>
            </view>


            <!-- 音视频基本开关 -->
            <view class="videoshow_control position">
                <!-- 音频开关 -->
                <view class="open" @click="audioSwitchFn" v-if="role == 1">
                    <image class="video_bg_img" src="../../static/au_in.png" mode="" v-if="audioSwitch == 'open'">
                    </image>
                    <image class="video_bg_img" src="../../static/au_on.png" mode="" v-else></image>
                    <text class="open_text">音频</text>
                </view>

                <!-- 挂断 -->
                <view class="open" @click="phoneFn">
                    <image class="video_bg_img" src="../../static/over.png" mode=""></image>
                    <text class="open_text">挂断</text>

                </view>

                <!-- 视频开关 -->
                <!-- <view class="open" @click="vedioSwitchFn" v-if="role == 1">
                    <image class="video_bg_img" src="../../static/vi_on.png" mode="" v-if="vedioSwitch == 'open'">
                    </image>
                    <image class="video_bg_img" src="../../static/vi_in.png" mode="" v-else></image>
                    <text class="open_text">视频</text>
                </view> -->

                <!--     <scroll-view scroll-y="true" style="height: 500px;padding: 20px;">
                    <view v-for="(item,value) in closeArray" :key='item+value'>{{item}}</view>
                </scroll-view> -->
            </view>
            <!-- 提示文字 -->
            <view class="video_bg video_bg_text" v-if="promptText">
                <!-- <view class="video_bg video_bg_text"> -->
                <text class="activetext">{{promptText}}</text>
                <!-- </view> -->
            </view>

        </view>
        <uni-popup ref="popup" type="center">
            <uni-popup-message :type="popupType" :message="popupMessage" :duration="2000"></uni-popup-message>
        </uni-popup>
@@ -132,24 +176,20 @@
        },
        data() {
            return {
                //anyRTC 为 App 开发者签发的 App ID。每个项目都应该有一个独一无二的 App ID。如果你的开发包里没有 App ID，请从anyRTC官网(https://www.anyrtc.io)申请一个新的 App ID
                appid: "d5a164cd8e0a8352ee108c561ba2e44e",
                channel: "",
                uid: "",
                role: 1, //角色 主播-游客


                videoShow: false, //视频展示
                // videoShowBg: true, //背景展示
                promptText: "loading...",

                PeerVideoUser: [{
                    a: 1
                }, {
                    a: 2
                }, {
                    a: 3
                }], //用户视频加入存储
                PeerVideoUserStyle: "video_local", //用户视频加入样式
                PeerVideoUser: [], //用户视频加入存储
                PeerVideoUserStyle: [
                    'video_local_call', "video_local"
                ], //用户视频加入样式

                // 本地
                audioSwitch: "open", //音频开关 
@@ -161,28 +201,112 @@
                popupType: "",
                popupMessage: "",

                isMain: false,
                MainName: '222',
                userName: '111'

                // closeArray: []
                isMain: true,
                userName: '111',
                toName: '',
                Otype: '',

                formName: '',
				
                faqiid: '',
                jieshouid:''
				
            }
        },
        // 页面初始加载（仅执行一次）
        onReady() {
            // 初始化
            this.channel = 2554;
            this.init();
            // this.channel = 2554;
            // this.init();
        },
        onLoad(option) {
            var that = this;
            that.toName = option.toname;
            console.log(option)
            if (option.type) {
                that.Otype = option.type;
            } else {
                return
            }
            console.log(option.state);
            if (option.state == "Mains") {
                this.isMain = true;
                setTimeout(res => {
                    this.join();
                }, 2000)
				
                that.jieshouid = option.toname;
                that.faqiid = that.$store.state.puserID;

                that.isMain = true;
                var call = false;
                this.userName = that.$store.state.puserID + '-faqiren';
                this.init();
                // setTimeout(res => {
                //发起请求  给后端双方姓名

                //得到返回值   开始视频  或者拒绝视频
                // console.log(that.$store.state);
                uni.request({
                    url: that.$store.state.api + '/pushMsg/inviteVideoCall',
                    data: {
                        userId: option.toname,
                        faqiid: that.$store.state.puserID,
                        name: that.$store.state.puserName,
                        type: 'video'
                    },
                    success(res) {
                        // if(res.data.res == 0){

                        // }
                        var d = res.data.data;
                        if (d.res == 0) {
                            console.log('对方不在线--退出');
                            uni.showToast({
                                title: '对方不在线',
                                duration: 2000,
                                icon: 'none'
                            });
                            setTimeout(res => {
                                uni.navigateBack();
                                // console.log(111)
                            }, 2000)

                        } else if (d.res == 1) {
                            that.channel = d.roomId;
                            console.log('对方在线-- 等待对方接受', d);
                            // call = true;
                            setTimeout(res => {
                                // uni.navigateBack();
                                // console.log(111)
                                that.join();
                                console.log('成功进入')
                            }, 2000)
                        }
                    }
                })


                uni.onSocketMessage(function(res) {
                    console.log(res.data);
                    var data = JSON.parse(res.data)
                    // if (call && ) {

                    // }
                    if (data.type == 'close') {
                        console.log('对方已挂断');
                        RtcModule.leaveChannel((res) => {});
                        that.closeAll();
                    }
                });


                // }, 5000)
            } else if (option.state == "Receiver") {
                this.isMain = false;
                that.userName = that.$store.state.puserID + '-jieshouren';
                // that.formName = 'wo';
                that.channel = option.room;
                that.faqiid = option.faqiid;
                that.jieshouid = that.$store.state.puserID;
                that.init();
                that.isMain = false;
            }
        },

@@ -191,24 +315,46 @@
                if (this.role == 2) {
                    newName = newName.filter((x) => x !== this.uid);
                }
                // video_local

                if (newName.length == 1) {
                    this.PeerVideoUserStyle = "video_local"
                } else if (newName.length > 1 && newName.length < 5) {
                    this.PeerVideoUserStyle = "video_local_1"
                } else if (newName.length > 4 && newName.length < 10) {
                    this.PeerVideoUserStyle = "video_local_2"
                } else if (newName.length > 9 && newName.length < 17) {
                    this.PeerVideoUserStyle = "video_local_3"
                } else if (newName.length == 0) {
                    this.role == 2 ? this.promptText = "暂无主播播放视频" : this.promptText = "loading..."
                    // this.PeerVideoUserStyle = [
                    //     'video_local', "video_local_call"
                    // ]
                    this.PeerVideoUserStyle = [
                        'video_local_call', "video_local"
                    ]
                } else if (newName.length == 2) {
                    this.PeerVideoUserStyle = [
                        'video_local_call', "video_local"
                    ]
                }

                //     // video_local
                //     if (newName.length == 1) {
                //         this.PeerVideoUserStyle = "video_local"
                //     } else if (newName.length > 1 && newName.length < 5) {
                //         this.PeerVideoUserStyle = "video_local_1"
                //     } else if (newName.length > 4 && newName.length < 10) {
                //         this.PeerVideoUserStyle = "video_local_2"
                //     } else if (newName.length > 9 && newName.length < 17) {
                //         this.PeerVideoUserStyle = "video_local_3"
                //     } else if (newName.length == 0) {
                //         this.role == 2 ? this.promptText = "暂无主播播放视频" : this.promptText = "loading..."
                //     }
            }
        },
        methods: {
            // 初始化
            async init() {
                // 查看权限
                console.log('开始初始化')
                this.uid = this.userName;
                console.log('初始化完成’', this.uid, '当前id码');
                uni.showToast({
                    title: this.uid,
                    duration: 2000,
                    // icon: 'none'
                });
                if (uni.getSystemInfoSync().platform == 'ios') {
                    //查看相机权限
                    await this.requestAndroidPermission("camera", 'ios');
@@ -228,9 +374,10 @@
                await RtcModule.create({
                    "appId": this.appid
                }, (res) => {

                    console.log(res, 11111111111111111111111111111111);
                });
                this.uid = this.randomFn(6);
                // this.uid = this.randomFn(6);

            },
            //设置角色
            setClientRole(num) {
@@ -247,11 +394,13 @@
                var that = this;
                // if (val == "Mains") { //视频发起人进入
                console.log('视频发起人进入');
                console.log(this.uid, '进入检测uid')
                uni.showLoading({
                    title: '加载中',
                    mask: true
                });
                //加入房间
                console.log('room', this.channel, 'useid', this.uid)
                await RtcModule.joinChannel({
                    "token": "",
                    "channelId": this.channel,
@@ -259,6 +408,7 @@
                }, (res) => {
                    console.log(res, 'join break');
                    console.log('成功进入房间：' + that.channel);
                    that.videoShow = true;
                })
                // } else if (val == 'Receiver') { //视频接收人进入
                //     console.log('视频接收人进入');
@@ -283,25 +433,56 @@
                // RtcModule.leaveChannel((res) => {});
                console.log("等待时候挂断");
                uni.navigateBack();
                this.closeAll();
            },
            joinit() { //接受进入视频
                // 传输接受的值

                // 开始进入视频通话
                this.join();
            },
            //拒绝进入视频
            comeBack() {


                // 传输拒绝的值


                console.log("拒绝进入视频");
                uni.navigateBack();

                // RtcModule.leaveChannel((res) => {});
                // this.closeAll();
            },

            // 挂断 离开
            phoneFn() {
                //离开频道
                RtcModule.leaveChannel((res) => {})
                // RtcModule.leaveChannel((res) => {});
                // this.closeAll();
                var data = {
                    sentId:this.faqiid,
                    acceptId: this.jieshouid
                }
                // uni.navigateBack();
                uni.request({
                    url: this.$store.state.api + '/pushMsg/closeVideoCall',
                    data:data,
                    success:(res)=> {
                        // RtcModule.leaveChannel((res) => {});
                        // this.closeAll();
                        console.log(res,'成功关闭');
                    }
                })
            },

            //添加本地视频到页面
            setupLocalVideoFn() {
                //视频 
                var that = this;
                RtcModule.enableVideo((res) => {});
                this.$refs[`popup${this.uid}`][0].setupLocalVideo({
                    "renderMode": 1,
                    "renderMode": 4,
                    "channelId": this.channel,
                    "uid": this.uid,
                    "mirrorMode": 0
@@ -368,6 +549,7 @@
                        case "onJoinChannelSuccess": //用户加入成功
                            uni.hideLoading();
                            this.role == 1 ? this.PeerVideoUser.push(res.uid) : "";
                            console.log(res.uid, 'uidsssss')
                            this.videoShow = true;
                            setTimeout(() => {
                                // this.videoShowBg = false;
@@ -377,6 +559,7 @@
                                    "enabled": true
                                }, (res) => {})
                                setTimeout(() => {
                                    console.log(this.PeerVideoUser, 'this.PeerVideoUser')
                                    // 启用视频模块。
                                    this.role == 1 ? this.setupLocalVideoFn() : RtcModule
                                        .enableVideo((res) => {});
@@ -442,12 +625,14 @@
                    let randomPoz = Math.floor(Math.random() * charSet.length);
                    randomString += charSet.substring(randomPoz, randomPoz + 1);
                }
                return randomString;
                // return randomString;
                return this.userName;
            },
            // 离开清空
            async closeAll() {
                // 销毁实例
                await RtcModule.destroyRtc((res) => {});
                await RtcModule.leaveChannel((res) => {})
                // await RtcModule.destroyRtc((res) => {});
                this.videoShow = false; //视频展示
                // this.videoShowBg = true; //背景展示
                this.promptText = "loading...";
@@ -460,12 +645,16 @@
                await this.init();
                // 如果需要跳转其它页面请按下边步骤
                // await uni.redirectTo({
                //     url: '..',
                //     success: () => {
                //         RtcModule.destroyRtc((res) => {
                //             console.log("页面销毁", res.code);
                //         });
                //     }
                // url: '..',
                // success: () => {
                // console.log('成功关闭')
                // uni.navigateBack();
                RtcModule.destroyRtc((res) => {
                    console.log("页面销毁", res.code);
                    console.log('成功关闭')
                    uni.navigateBack();
                });
                // }
                // });

            },
@@ -485,116 +674,85 @@
                }
            },

        },
        destroyed() {
            console.log('this.closeAll();');
            this.closeAll();
            uni.hideLoading();
        }

    }
</script>

<style lang="scss" scoped>
<style>
    .content {
        flex: 1;
        width: 750rpx;

    }

    /* 加入频道 */
    .index {
        flex: 1;
        background-color: #0A1621;
        height: 100vh;
    }
        width: 750rpx;
        height: 1080rpx;

    /* 等待时候样式   Main */
    .ccbut {
        position: relative;
        top: 45vh;
    }

    .Mains {
        // position: absolute;
        // width: 100%;
        // height: 5rem;
        width: 100%;
        height: 100vh;
        box-sizing: border-box;
        // border: 1px solid #fff;
        display: flex;
        align-items: center;
        justify-content: center;

        // bottom: 0;
        .title {
            color: #fff;
        }

        .open {
            // border: 1px solid #fff;
            position: fixed;
            bottom: 3rem;
            width: 100%;
            height: 4.3rem;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;

            .video_bg_img {
                width: 3rem;
                height: 2rem;
            }

            .open_text {
                padding: 5px 0 0;
                text-align: center;
                display: block;
                // border: 1px solid #fff;
                color: #fff;
            }
        }
        flex: 1;
        width: 750rpx;
    }

    .Mains-t {
        padding-top: 500rpx;
        flex-direction: row;
        justify-content: center;
    }

    .i-open {
        width: 750rpx;
        position: fixed;
        bottom: 20rpx;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-color: transparent;
    }

    .i-video_bg_img {
        width: 50rpx;
        height: 50rpx;
    }

    /* 是否接受 */
    .Receiver {
        // position: absolute;
        // width: 100%;
        // height: 5rem;
        width: 100%;
        height: 100vh;
        box-sizing: border-box;
        // border: 1px solid #fff;
        display: flex;
        flex: 1;
        width: 750rpx;
    }

    .i-control {
        width: 750rpx;
        bottom: 20rpx;
        position: fixed;
        /* bottom: 20px; */
        /* width: 600px; */
        flex-direction: row;
        justify-content: center;
    }

    .i-c-open {
        width: 325rpx;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        // bottom: 0;
        .title {
            color: #fff;
        }

        .open {
            // border: 1px solid #fff;
            position: relative;
            top: 12rem;
            width: 100%;
            height: 4.3rem;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;

            .video_bg_img {
                width: 3rem;
                height: 2rem;
            }

            .open_text {
                padding: 5px 0 0;
                text-align: center;
                display: block;
                // border: 1px solid #fff;
                color: #fff;
            }
        }
        /* padding: 350px 150px 0 0; */
    }


    .chanel {
        padding: 120px 20px 20px;
        padding: 120px 70px 40px;
    }

    .uni-input {
@@ -650,11 +808,8 @@
    .vedioWatch {
        flex: 1;
        position: relative;
        width: 100%;
        height: 100vh;
        background-color: #0A1621;


        width: 750rpx;
        height: 1080rpx;
    }

    /* 初始背景 */
@@ -670,7 +825,6 @@

    .video_bg_img {
        flex: 1;
        width: 100%;
    }

    .video_bg_text {
@@ -685,53 +839,80 @@
        /* position: absolute; */
        left: 20px;
        top: 40px;
        z-index: 10;
    }

    /* 视频区域 */

    .video_region {
        /* position: fixed;
        top: 0;
        left: 0; */
        flex: 1;
        /* position: absolute; */
        /* width: 750rpx;
        height: 1334rpx; */
        /* border: 1px solid red; */
        flex-wrap: wrap;
        flex-direction: row;
        background-color: transparent;
    }
	

    /* 1个视频 */
    .video_local {
        flex: 1;
        width: 750rpx;
        height: 1334rpx;
        height: 1344rpx;
        /* border: 2px solid green; */
        background-color: transparent;
        z-index: 5;
    }
	

    .video_local_call {
        position: fixed;
        top: 60rpx;
        right: 30rpx;
        width: 300rpx;
        /* border: 2px solid yellow; */
        height: 400rpx;
        background-color: transparent;
        z-index: 6;
    }

    .video_none {
        width: 0;
        height: 0;
    }

    .video_region_padding {
        margin-top: 20px;
        padding: 200rpx 0 260rpx;
        width: 750rpx;
        height: 840rpx;
        height: 1080rpx;
    }
	

    /* 4个视频 */
    .video_local_1 {
    /* .video_local_1 {
        width: 375rpx;
        height: 420rpx;
    }
    } */

    /* 9个视频 */
    .video_local_2 {
    /* .video_local_2 {
        width: 250rpx;
        height: 280rpx;
    }
    } */

    /* 16个视频 */
    .video_local_3 {
    /* .video_local_3 {
        width: 187.5rpx;
        height: 210rpx;
    }
    } */

    /* 音视频基本开关 */
    .videoshow_control {
        position: absolute;
        bottom: 3rem;
        /* position: absolute; */
        bottom: 20rpx;
        left: 0;
        width: 750rpx;
        /* background-color: #007AFF; */
@@ -739,28 +920,9 @@
        padding: 20px;
        background-color: transparent;
        color: #fff;
        display: flex;
        flex-direction: row;
        justify-content: space-around;

        image {
            width: 3rem;
        }

        .open {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            height: 4.3rem;
        }
    }

    .camera {
        image {
            width: 2rem;
            height: 2rem;
        }
        z-index: 10;
    }

    .open {
@@ -770,7 +932,7 @@
    }

    .open_text {
        padding: 5px 0 0;
        padding: 15px 0 0;
        text-align: center;
        color: #fff;
    }

 pages/videoCall/自己写全.vue

copy from pages/videoCall/videoCall.vue
copy to "pages/videoCall/\350\207\252\345\267\261\345\206\231\345\205\250.vue"
File was copied from pages/videoCall/videoCall.vue
@@ -2,64 +2,41 @@
    <view class="content">
        <!-- 加入频道 -->
        <view class="index" v-if="!videoShow">
            <!-- 输入频道 -->
            <!-- <view class="chanel">
                <input class="uni-input activetext" v-model="channel" focus placeholder="请输入频道号" />
            </view>

            <view class="setrole">

                <button type="default" :class="role == 1? 'active': 'button'" @click="setClientRole(1)"><text class="text button_text"
                     :class="role == 1? 'activetext': ''">我是主播</text></button>

                <button type="default" :class="role == 2? 'active': 'button'" @click="setClientRole(2)"><text class="text" :class="role == 2? 'activetext': ''">我是游客</text></button>
            </view>

            <view class="join">
                <button type="primary" class="button jion_bg" @click="join"><text class="activetext">加入频道</text></button>
            </view> -->
            <view class="Mains" v-if="isMain">
                <view class="title">
                    正在呼叫{{MainName}}
                    <u-loading size="36" mode="flower"></u-loading>
                </view>

                <!-- 挂断 -->
                <view class="open" @click="phoneFnMain">
                    <image class="video_bg_img" src="../../static/over.png" mode=""></image>
                    <text class="open_text">取消呼叫</text>

                </view>
            </view>
            <view class="Receiver" v-if="!isMain">
                <!-- <u-button class="ccbut" type="primary" @click="join('Receiver')">确认进入{{channel}}号房间</u-button> -->
                <!-- <u-button class="ccbut" type="primary" @click="comeBack">拒绝进入</u-button> -->
                <view class="open" @click="join('Receiver')">
                    <image class="video_bg_img" src="../../static/phone.png" mode=""></image>
                    <text class="open_text">接受</text>

                <view class="title">
                    是否接收来自{{userName}}的视频请求
                    <u-loading size="36" mode="flower"></u-loading>
                </view>
                <view class="open" @click="comeBack">
                    <image class="video_bg_img" src="../../static/over.png" mode=""></image>
                    <text class="open_text">挂断</text>
                <view class="Receiver-but">
                    <view class="open" @click="join('Receiver')">
                        <image class="video_bg_img" src="../../static/phone.png" mode=""></image>
                        <text class="open_text">接受</text>

                    </view>
                    <view class="open" @click="comeBack">
                        <image class="video_bg_img" src="../../static/over.png" mode=""></image>
                        <text class="open_text">挂断</text>

                    </view>
                </view>
            </view>
        </view>

        <!-- 视频 -->
        <view class="vedio vedioWatch" v-else>
        <view class="vedio-vedioWatch" v-else>

            <view class="video_bg">
                <image class="video_bg_img" src="../../static/BG.png" mode=""></image>
                <!-- <text class="activetext" v-if="videoShowBg"></text> -->
                <!--     <view class="video_bg video_bg_text">
			
                    <text class="activetext">{{promptText}}</text>
                </view> -->
            </view>

            <view class="video_region" :class="PeerVideoUser.length > 1 ? 'video_region_padding' : ''">
            <view class="video_region" :class="PeerVideoUser.length > 0 ? 'video_region_padding' : ''">
                <!-- 渲染视频 -->
                <view v-for="peervideo in PeerVideoUser" :key="peervideo">
                    <view :class="PeerVideoUserStyle" v-if="peervideo == uid && role == 2 ? false : true">
@@ -68,14 +45,13 @@

                </view>
            </view>

            <!-- 转换摄像头 -->
            <view class="camera position" @click="cameraSwitchFn" v-if="role == 1">
                <image class="video_bg_img" src="../../static/camera.png" mode=""></image>

            </view>
            <!-- 音视频基本开关 -->
            <view class="videoshow_control position">
            <!-- 控制开关 -->
            <view class="vider-but">
                <!-- 音频开关 -->
                <view class="open" @click="audioSwitchFn" v-if="role == 1">
                    <image class="video_bg_img" src="../../static/au_in.png" mode="" v-if="audioSwitch == 'open'">
@@ -98,24 +74,13 @@
                    <image class="video_bg_img" src="../../static/vi_in.png" mode="" v-else></image>
                    <text class="open_text">视频</text>
                </view>
            </view>

                <!--     <scroll-view scroll-y="true" style="height: 500px;padding: 20px;">
                    <view v-for="(item,value) in closeArray" :key='item+value'>{{item}}</view>
                </scroll-view> -->
            </view>
            <!-- 提示文字 -->
            <view class="video_bg video_bg_text" v-if="promptText">
                <!-- <view class="video_bg video_bg_text"> -->
                <text class="activetext">{{promptText}}</text>
                <!-- </view> -->
            </view>
            <uni-popup ref="popup" type="center">
                <uni-popup-message :type="popupType" :message="popupMessage" :duration="2000"></uni-popup-message>
            </uni-popup>
        </view>
        <uni-popup ref="popup" type="center">
            <uni-popup-message :type="popupType" :message="popupMessage" :duration="2000"></uni-popup-message>
        </uni-popup>
    </view>


</template>

<script>
@@ -132,27 +97,21 @@
        },
        data() {
            return {
                //anyRTC 为 App 开发者签发的 App ID。每个项目都应该有一个独一无二的 App ID。如果你的开发包里没有 App ID，请从anyRTC官网(https://www.anyrtc.io)申请一个新的 App ID
                appid: "d5a164cd8e0a8352ee108c561ba2e44e",
                channel: "",
                uid: "",
                role: 1, //角色 主播-游客


                videoShow: false, //视频展示
                // videoShowBg: true, //背景展示
                promptText: "loading...",

                PeerVideoUser: [{
                    a: 1
                }, {
                    a: 2
                }, {
                    a: 3
                }], //用户视频加入存储
                PeerVideoUser: ['aaaaaaa'], //用户视频加入存储
                PeerVideoUserStyle: "video_local", //用户视频加入样式

                // 本地
                audioSwitch: "open", //音频开关 
                audioSwitch: "colse", //音频开关 
                vedioSwitch: "open", //视频开关

                videoWidth: 0,
@@ -161,11 +120,10 @@
                popupType: "",
                popupMessage: "",


                isMain: false,
                MainName: '222',
                userName: '111'

                // closeArray: []
            }
        },
        // 页面初始加载（仅执行一次）
@@ -228,9 +186,10 @@
                await RtcModule.create({
                    "appId": this.appid
                }, (res) => {

                    console.log(res);
                });
                this.uid = this.randomFn(6);
                console.log(this.uid, '当前id码')
            },
            //设置角色
            setClientRole(num) {
@@ -247,6 +206,7 @@
                var that = this;
                // if (val == "Mains") { //视频发起人进入
                console.log('视频发起人进入');
                console.log(this.uid, '进入检测uid')
                uni.showLoading({
                    title: '加载中',
                    mask: true
@@ -259,6 +219,7 @@
                }, (res) => {
                    console.log(res, 'join break');
                    console.log('成功进入房间：' + that.channel);
                    that.videoShow = true;
                })
                // } else if (val == 'Receiver') { //视频接收人进入
                //     console.log('视频接收人进入');
@@ -283,25 +244,33 @@
                // RtcModule.leaveChannel((res) => {});
                console.log("等待时候挂断");
                uni.navigateBack();
                this.closeAll();
            },
            //拒绝进入视频
            comeBack() {
                console.log("拒绝进入视频");
                uni.navigateBack();
                RtcModule.leaveChannel((res) => {});
                this.closeAll();
            },

            // 挂断 离开
            phoneFn() {
                //离开频道
                RtcModule.leaveChannel((res) => {})
                RtcModule.leaveChannel((res) => {});
                this.closeAll();
                uni.navigateBack();
            },

            //添加本地视频到页面
            setupLocalVideoFn() {
                //视频 
                var that = this;
                RtcModule.enableVideo((res) => {});
                console.log(that,'thatsss')
                console.log(that.$refs,'refsssss')
                this.$refs[`popup${this.uid}`][0].setupLocalVideo({
                    "renderMode": 1,
                    "renderMode": 4,
                    "channelId": this.channel,
                    "uid": this.uid,
                    "mirrorMode": 0
@@ -368,6 +337,7 @@
                        case "onJoinChannelSuccess": //用户加入成功
                            uni.hideLoading();
                            this.role == 1 ? this.PeerVideoUser.push(res.uid) : "";
                            console.log(res.uid, 'uidsssss')
                            this.videoShow = true;
                            setTimeout(() => {
                                // this.videoShowBg = false;
@@ -377,6 +347,7 @@
                                    "enabled": true
                                }, (res) => {})
                                setTimeout(() => {
                                    console.log(this.PeerVideoUser,'this.PeerVideoUser')
                                    // 启用视频模块。
                                    this.role == 1 ? this.setupLocalVideoFn() : RtcModule
                                        .enableVideo((res) => {});
@@ -485,297 +456,250 @@
                }
            },

        },
        destroyed() {
            console.log('this.closeAll();');
            this.closeAll();
            uni.hideLoading();
        }

    }
</script>

<style lang="scss" scoped>
    $butFixedButtom: 2rem;

    .content {
        flex: 1;
    }

    /* 加入频道 */
    .index {
        flex: 1;
        background-color: #0A1621;
        height: 100vh;
    }

    /* 等待时候样式   Main */
    .ccbut {
        position: relative;
        top: 45vh;
    }

    .Mains {
        // position: absolute;
        // width: 100%;
        // height: 5rem;
        width: 100%;
        // height: 100%;
        height: 100vh;
        box-sizing: border-box;
        // border: 1px solid #fff;
        display: flex;
        align-items: center;
        justify-content: center;
		

        // bottom: 0;
        .title {
            color: #fff;
        }

        .open {
            // border: 1px solid #fff;
            position: fixed;
            bottom: 3rem;
        /* 等待时候样式   Main */
        .index {
            width: 100%;
            height: 4.3rem;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            height: 100%;
            background-color: #0A1621;

            .video_bg_img {
                width: 3rem;
                height: 2rem;
            }

            .open_text {
                padding: 5px 0 0;
                text-align: center;
                display: block;
            .Mains {
                width: 100%;
                height: 100%;
                box-sizing: border-box;
                // border: 1px solid #fff;
                color: #fff;
                display: flex;
                align-items: center;
                justify-content: center;

                // bottom: 0;
                .title {
                    color: #fff;
                }

                .open {
                    // border: 1px solid #fff;
                    position: fixed;
                    bottom: $butFixedButtom;
                    width: 100%;
                    left: 0;
                    height: 4.3rem;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    flex-direction: column;
                    z-index: 10;

                    .video_bg_img {
                        width: 2.1rem;
                        height: 2rem;
                    }

                    .open_text {
                        padding: 5px 0 0;
                        text-align: center;
                        display: block;
                        // border: 1px solid #fff;
                        color: #fff;
                    }
                }
            }

            .Receiver {
                // position: absolute;
                width: 100%;
                height: 100vh;
                // position: fixed;
                // bottom: 2rem;
                box-sizing: border-box;
                // border: 1px solid #fff;
                display: flex;
                align-items: center;
                justify-content: center;

                // bottom: 0;
                .title {
                    color: #fff;
                }

                .Receiver-but {
                    width: 100%;
                    position: fixed;
                    bottom: $butFixedButtom;
                    left: 0;
                    display: flex;
                    align-items: center;
                    justify-content: space-around;

                    .open {
                        // border: 1px solid #fff;
                        // position: fixed;
                        // bottom: 3rem;
                        // width: 100%;
                        height: 4.3rem;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        flex-direction: column;
                        z-index: 10;

                        .video_bg_img {
                            width: 2.1rem;
                            height: 2rem;
                        }

                        .open_text {
                            padding: 5px 0 0;
                            text-align: center;
                            display: block;
                            // border: 1px solid #fff;
                            color: #fff;
                        }
                    }
                }
            }
        }
    }

    .Receiver {
        // position: absolute;
        // width: 100%;
        // height: 5rem;
        width: 100%;
        height: 100vh;
        box-sizing: border-box;
        // border: 1px solid #fff;
        display: flex;
        align-items: center;
        justify-content: center;

        // bottom: 0;
        .title {
            color: #fff;
        }

        .open {
            // border: 1px solid #fff;
            position: relative;
            top: 12rem;
        /*视频样式*/
        .vedio-vedioWatch {
            width: 100%;
            height: 4.3rem;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            height: 100vh;

            .video_bg_img {
                width: 3rem;
            /*视频主体样式*/
            .video_region {
                z-index: 8;
                width: 100%;
                height: 100vh;
                border: 1px solid red;
            }

            // 一个视频  自己的
            .video_region_padding {
                z-index: 8;
                width: 100%;
                height: 30vh;
                border: 3px solid green;
            }

            //接通视频  2人
            .video_local {
                z-index: 8;
                width: 100%;
                height: 30vh;
                position: relative;
                top: 30vh;
                background-color: transparent;
                border: 3px solid yellow;
            }
			
            /* 视频区域 */
            // .video_region {
            //     flex: 1;
            //     /* position: absolute; */
            //     flex-wrap: wrap;
            //     flex-direction: row;
            //     background-color: transparent;
            // }
			
            // /* 1个视频 */
            // .video_local {
            //     width: 750rpx;
            //     height: 1334rpx;
            //     background-color: transparent;
            // }
			
            // .video_region_padding {
            //     margin-top: 20px;
            //     padding: 200rpx 0 260rpx;
            //     width: 750rpx;
            //     height: 840rpx;
            // }
			
            // /* 4个视频 */
            // .video_local_1 {
            //     width: 375rpx;
            //     height: 420rpx;
            // }
			
            // /* 9个视频 */
            // .video_local_2 {
            //     width: 250rpx;
            //     height: 280rpx;
            // }
			
            // /* 16个视频 */
            // .video_local_3 {
            //     width: 187.5rpx;
            //     height: 210rpx;
            // }

            /* 转换摄像头 */
            .camera {
                width: 2.1rem;
                height: 2rem;
                position: fixed;
                left: 20px;
                top: 60px;

                .video_bg_img {
                    width: 2.1rem;
                    height: 2rem;
                }

                z-index: 10;
            }

            .open_text {
                padding: 5px 0 0;
                text-align: center;
                display: block;
                // border: 1px solid #fff;
                color: #fff;

            /*视频按钮样式*/
            .vider-but {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-around;
                position: fixed;
                bottom: $butFixedButtom;

                .open {
                    height: 4.3rem;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    flex-direction: column;
                    z-index: 10;

                    .video_bg_img {
                        width: 2.1rem;
                        height: 2rem;
                    }

                    .open_text {
                        padding: 5px 0 0;
                        text-align: center;
                        display: block;
                        // border: 1px solid #fff;
                        color: #fff;
                    }
                }
            }
        }
    }

    .chanel {
        padding: 120px 20px 20px;
    }

    .uni-input {
        height: 120rpx;
        padding: 0 20px;
        background-color: #2F3041;
        border-radius: 6px;
    }

    .setrole {
        padding: 60px 20px;
        flex-direction: row;
        justify-content: space-between;
    }

    .button {
        padding: 10px 70rpx;
        background-color: #2F3041;
        border-radius: 6px;
        border-width: 2px;
        border-color: #2f3041;
    }

    .text {
        color: #B4B5BE;
    }



    .activetext {
        color: #fff;
    }

    .active {
        padding: 10px 70rpx;
        border-radius: 6px;
        border-width: 2px;
        border-color: #40a3fb;
        background-color: #0A1621;
    }

    .join {
        padding: 20px;
    }

    .jion_bg {
        background-color: #40A3FB;
        border-width: 0;
    }


    /* 视频 */
    .vedioWatch {
        flex: 1;
        position: relative;
        width: 100%;
        height: 100vh;
        background-color: #0A1621;


    }

    /* 初始背景 */
    .video_bg {
        flex: 1;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: transparent;
    }

    .video_bg_img {
        flex: 1;
        width: 100%;
    }

    .video_bg_text {
        justify-content: center;
        align-items: center;
    }

    /* 转换摄像头 */
    .camera {
        width: 44px;
        height: 37px;
        /* position: absolute; */
        left: 20px;
        top: 40px;
    }

    /* 视频区域 */
    .video_region {
        flex: 1;
        /* position: absolute; */
        flex-wrap: wrap;
        flex-direction: row;
        background-color: transparent;
    }
	
    /* 1个视频 */
    .video_local {
        width: 750rpx;
        height: 1334rpx;
        background-color: transparent;
    }
	
    .video_region_padding {
        margin-top: 20px;
        padding: 200rpx 0 260rpx;
        width: 750rpx;
        height: 840rpx;
    }
	
    /* 4个视频 */
    .video_local_1 {
        width: 375rpx;
        height: 420rpx;
    }

    /* 9个视频 */
    .video_local_2 {
        width: 250rpx;
        height: 280rpx;
    }

    /* 16个视频 */
    .video_local_3 {
        width: 187.5rpx;
        height: 210rpx;
    }

    /* 音视频基本开关 */
    .videoshow_control {
        position: absolute;
        bottom: 3rem;
        left: 0;
        width: 750rpx;
        /* background-color: #007AFF; */
        /* height: 250rpx; */
        padding: 20px;
        background-color: transparent;
        color: #fff;
        display: flex;
        flex-direction: row;
        justify-content: space-around;

        image {
            width: 3rem;
        }

        .open {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            height: 4.3rem;
        }
    }

    .camera {
        image {
            width: 2rem;
            height: 2rem;
        }
    }

    .open {
        height: 205rpx;
        width: 128rpx;
        justify-content: center;
    }

    .open_text {
        padding: 5px 0 0;
        text-align: center;
        color: #fff;
    }

    .position {
        position: absolute;
    }
</style>

 static/images/chatroom/phone.png

 store/actions.js

@@ -16,13 +16,13 @@
                },
            ],
            pasw = md5(data.pass),
            // url = 'http://223.82.109.183:2080/api/api/blade-auth/oauth/token?tenantId=000000&username=' + data.name +
            url = 'http://223.82.109.183:2080/api/blade-auth/oauth/token?tenantId=000000&username=' + data.name +
            // url = 'http://223.82.109.183:2080/api/blade-auth/oauth/token?tenantId=000000&username=' + data.name +
            url = store.state.piAPI + '/blade-auth/oauth/token?tenantId=000000&username=' + data.name +
            ' &password=' + pasw + '&grant_type=password&scope=all&type=account';
        // url ='http://192.168.0.109:82/blade-auth/oauth/token';
        // url ='http://192.168.0.109:82/blade-auth/oauth/token?tenantId=000000&username=admin&password=93369e86dc5fa854a0eaf75558c4039d&grant_type=password';
        // url ='http://web.byisf.com/api/blade-auth/oauth/token?tenantId=000000&username=admin&password=93369e86dc5fa854a0eaf75558c4039d&grant_type=password&scope=all';
        // console.log(url);
        console.log(store.state.piAPI);
        wx.request({ //uniapp 自带axios
            url: url, //仅为示例，并非真实接口地址。
            // data: d,
@@ -45,6 +45,7 @@
            //     // dataType: 'JSON',
            success: (res) => {
                if (res.statusCode == 200) {
                    console.log(res)
                    if (res.data.error_code == "400") {
                        uni.showToast({
                            title: '密码错误，请重试',

 store/index.js

@@ -17,6 +17,7 @@
const store = new Vuex.Store({
    // 下面这些值仅为示例，使用过程中请删除
    state: {
		
        // 如果上面从本地获取的lifeData对象下有对应的属性，就赋值给state中对应的变量
        userInfo: lifeData.userInfo ? lifeData.userInfo : {
            avatar: '',
@@ -32,9 +33,11 @@
            useName: '过客 ',
        },
        logPath: '',
        // piAPI: 'http://223.82.109.183:2080/api/api',
        // piAPI: 'http://localhost:82/',
        // piAPI: 'http://223.82.109.183:2080/api',
        piAPI: 'http://223.82.109.183:2080/api',
        api: 'http://223.82.109.183:2080/api',
        // piAPI: 'http://localhost:82/',
        // piAPI: 'http://192.168.0.108:81',
        puserName: '',
        puserID: '',
        puserIphone:'',

 store/mutations.js

@@ -46,6 +46,44 @@
            state.puserID = data.userID;
            state.avatar = data.avatar;
        }
        console.log('登入数据传输成功  开始进入连接')
		
        uni.connectSocket({
            url: 'ws://http://223.82.109.183:2086/websocket'
        });
        var socketOpen = false;
        uni.onSocketOpen(function(res) {
            socketOpen = true;
            console.log('持续连接成功')
            sendSocketMessage();
        });
		
        function sendSocketMessage() {
            var data = {
                        // type: state.puserName,
                        id: state.puserID,
                        type: 'login'
                    }
            if (socketOpen) {
                uni.sendSocketMessage({
                    data: JSON.stringify(data)
                });
            }
        }
		
        uni.onSocketMessage(function(res) {
            console.log(res.data);
            var data  = JSON.parse(res.data)
            if (data.type == 'video') {
                // this.receiveVideo('Receiver', );
                console.log('进入接受 跳转',data.type)
                uni.navigateTo({
                    url: '../videoCall/videoCall?state=Receiver&type=' + data.type +'&room=' + data.roomId + '&name=' + data.name + '&faqiid=' + data.faqiid
                });
            }
            // console.log('收到服务器内容：' + res.data);
        });
		
        //储存用户
        WxStorage.set("init", "true");
        WxStorage.set("name", data.userName);