dev/dcp-web-gate/src_old/views/helpCenter/onlineMeeting1.vue

<template>
    <div style="background: #fff;">
        <div class="autoBox box"  v-loading="loading">
            <div class="crumbs">
              <el-breadcrumb separator="/">
                <el-breadcrumb-item :to="{ path: 'home' }">{{$t('common.Home')}}</el-breadcrumb-item>
                <el-breadcrumb-item>{{$t('common.OnlineMeeting')}}</el-breadcrumb-item>
              </el-breadcrumb>
            </div>
            <div class="content">
              <h3>平台支持召开腾讯会议和ZOOM会议</h3>
                <div class="ui-top">
                    <div style="width:250px;height:1px;background:#979797;transform: translateY(16px);"></div>
                    <div style="display:flex;color: #2f598d;font-size: 24px;">
                        <span @click="changeMeeting1()" :class="otherNum===0?'ui-top-span':'ui-top-span1'" style="display: inline-block;width: 180px;text-align: right;cursor: pointer">{{$t('common.TencentMeeting')}}</span>
                        ----------
                        <span @click="changeMeeting2()" :class="otherNum===1?'ui-top-span':'ui-top-span1'" style="display: inline-block;width: 180px;text-align: left;cursor: pointer">{{$t('common.ZoomtMeeting')}}</span>
                    </div>
                    <div style="width:250px;height:1px;background:#979797;transform: translateY(16px);"></div>
                </div>
                <div style="margin-top: 83px;">
                    <span style="font-size: 18px;font-weight: 700;">{{$t('common.FunctionIntroduction')}}</span>
                    <p>{{otherMeet}}</p>
                </div>
                <div style="margin-top: 60px;">
                    <span style="font-size: 18px;font-weight: 700;">{{$t('common.Characteristic')}}</span>
                    <p>{{$t('common.CharacteristicText')}}</p>
                </div>
                <div style="margin-top: 93px;">
                    <!--快速会议-->
                    <el-button :class="$i18n.locale=='zh'?'meetingBtn':'meetingBtn2'" style="background: #50aefb;box-shadow: 0 2px 25px #c5c5c5;border-radius: 15px;" @click="quickMeeting">
<!--                    <el-button :class="$i18n.locale=='zh'?'meetingBtn':'meetingBtn2'" style="background: #50aefb;box-shadow: 0 2px 25px #c5c5c5;border-radius: 15px;" @click="templeTip">-->
                        <div style="display: inline-block;vertical-align: middle;">
                            <img src="@/assets/img/helpCenter/quickMeeting.png" alt="">
                        </div>
                        {{$t('common.QuickMeeting')}}

                    </el-button>
                    <!--预定会议-->
                    <el-button :class="$i18n.locale=='zh'?'meetingBtn':'meetingBtn2'" style="background: #54cfbc;box-shadow: 0 2px 25px #c5c5c5;border-radius: 15px;" @click="reserve">
<!--                     <el-button :class="$i18n.locale=='zh'?'meetingBtn':'meetingBtn2'" style="background: #50aefb;box-shadow: 0 2px 25px #c5c5c5;border-radius: 15px;" @click="templeTip">-->

                        <div style="display: inline-block;vertical-align: middle;">
                            <img src="@/assets/img/helpCenter/reservationMeeting.png" alt="">
                        </div>
                        {{$t('common.ScheduledMeeting')}}
                    </el-button>
                    <!--我的会议-->
                    <el-button :class="$i18n.locale=='zh'?'meetingBtn':'meetingBtn2'" style="background: #f0ae4e;box-shadow: 0 2px 25px #c5c5c5;border-radius: 15px;" @click="myMeeting">
                        <div style="display: inline-block;vertical-align: middle;">
                            <img src="@/assets/img/helpCenter/myMeeting.png" alt="">
                        </div>
                        {{$t('common.MyMeeting')}}
                    </el-button>
                </div>
            </div>

        </div>
        <div class="tep">
            <div class="mark"></div>
            <div class="tepDet">
                <div class="tepCont">
                    <h3>{{$t('common.UsingTheStep')}}</h3>
<!--                    <span>{{$t('common.UsingTheStepText')}}</span>-->
                </div>
            </div>

            <div class="detail">
                <div class="detOut">
                    <div class="detCont"></div>
                    <div style="position: relative;top: -44px;left: 40%;">
                        <img src="@/assets/img/helpCenter/MenberLogin.png" alt="" style="position: absolute;top: 0px;left: 0;">
                    </div>
                    <div class="detContInner">
                        <span>{{$t('common.MemberLogin')}}</span>
                        <p>{{$t('common.MemberLoginText')}}</p>
                    </div>
                </div>

                    <div class="detOut">
                        <div class="detCont"></div>
                        <div style="position: relative;top: -44px;left: 40%;">
                            <img src="@/assets/img/helpCenter/CtroMeeting.png" alt="" style="position: absolute;top: 0px;left: 0;">
                        </div>
                        <div class="detContInner">
                            <span>{{$t('common.CreatingMeeting')}}</span>
                            <p>{{$t('common.CreatingMeetingText')}}</p>
                        </div>
                    </div>


                    <div class="detOut">
                        <div class="detCont"></div>
                        <div style="position: relative;top: -44px;left: 40%;">
                            <img src="@/assets/img/helpCenter/creatMeeting.png" alt="" style="position: absolute;top: 0px;left: 0;">
                        </div>
                        <div class="detContInner">
                            <span>{{$t('common.ManagementMeeting')}}</span>
                            <p>{{$t('common.ManagementMeetingText')}}</p>
                        </div>
                    </div>


            </div>
        </div>
        <!-- 快速会议、预定会议临时提示 -->
        <el-dialog
            :title="$t('common.WarmPrompt')"
            :visible.sync="quickMeetingtemporaryVisible"
            width="30%">
                <div v-if="$i18n.locale == 'zh'">
                    在线会议功能因系统升级，暂时不可使用，敬请谅解。
                </div>
                <div v-else>
                    The online conference function is temporarily unavailable due to system upgrade. Please understand.
                </div>
        </el-dialog>
        <!-- 快速会议提示 -->
        <el-dialog
                :title="$t('common.TencentMeeting')"
                :visible.sync="quickMeetingDialogVisible"
                width="30%"
                :before-close="handleClose">
            <span>
                <strong>
                    <p>{{$t('common.mTip1')}}</p>
                    <p>{{$t('common.mTip2')}}</p>
                    <p><a :href="quickMeetingResult.meeting_info_list[0].join_url" target="_blank">{{quickMeetingResult.meeting_info_list[0].join_url}}</a></p>
                    <p>{{$t('common.meetingId')}}{{quickMeetingResult.meeting_info_list[0].meeting_code}}</p>
                </strong>
            </span>
        </el-dialog>
        <!-- 预定会议 -->
        <el-dialog :title="$t('common.ScheduledMeeting')" :visible.sync="scheduledMeeting">
            <el-form :model="scheduledMeetingConfig">
                <el-form-item :label="$t('common.mTheTheme')" label-width="120px">
                    <el-input v-model="scheduledMeetingConfig.subject" autocomplete="off" maxlength="100" show-word-limit></el-input>
                </el-form-item>
                <el-form-item :label="$t('common.mStartTime')" label-width="120px">
                    <el-date-picker
                            v-model="startDate"
                            :clearable="false"
                            type="date"
                            :editable="false"
                            :picker-options="pickerOptions"
                            value-format="yyyy-MM-dd"
                            :placeholder="$t('common.mSelectDate')">
                    </el-date-picker>
                    <el-time-select
                            v-model="startTime"
                            :clearable="false"
                            :editable="false"
                            :picker-options="{
                                start: '00:00',
                                step: '00:15',
                                end: '24:00'
                             }"
                            :placeholder="$t('common.mSelectTime')"
                    style="margin-left: 10px">
                    </el-time-select>
                </el-form-item>
                <el-form-item :label="$t('common.mEndTime')" label-width="120px">
                    <el-date-picker
                            v-model="startDate"
                            type="date"
                            :clearable="false"
                            value-format="yyyy-MM-dd"
                            :editable="false"
                            :picker-options="pickerOptions"
                            :placeholder="$t('common.mSelectDate')">
                    </el-date-picker>
                    <el-time-select
                            v-model="endTime"
                            :clearable="false"
                            :editable="false"
                            :picker-options="{
                                start: '00:00',
                                step: '00:15',
                                end: '24:00',
                                minTime: startTime
                             }"
                            :placeholder="$t('common.mSelectDate')"
                            style="margin-left: 10px">
                    </el-time-select>
                </el-form-item>
                <el-form-item :label="$t('common.mPassword')" label-width="120px">
                    <el-checkbox v-model="openPass">{{$t('common.OpenMeetingPassword')}}</el-checkbox>
                    <el-input v-model="scheduledMeetingConfig.password" autocomplete="off" v-if="openPass" maxlength="6"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="scheduledMeeting = false">{{$t('common.mCancel')}}</el-button>
                <el-button type="primary" @click="scheduledMeetingEvent">{{$t('common.mConfirm')}}</el-button>
            </div>
        </el-dialog>

        <!-- 预定会议提示 -->
        <el-dialog
                :title="$t('common.TencentMeeting')"
                :visible.sync="scheduledMeetingDialogVisible"
                width="30%"
                :before-close="handleClose">
            <span>
                <strong>
                    <p>{{$t('common.mTip1')}}</p>
                    <p>{{$t('common.mTheTheme')}}:{{scheduledMeetingResult.meeting_info_list[0].subject}}</p>
                    <p>{{$t('common.mTime')}}：{{formatDateAndHouse(parseInt((scheduledMeetingResult.meeting_info_list[0].start_time + '000'))) }} - {{formatDateAndHouse(parseInt((scheduledMeetingResult.meeting_info_list[0].end_time + '000'))) }}</p>
                    <p>{{$t('common.mTip2')}}</p>
                    <p><a :href="scheduledMeetingResult.meeting_info_list[0].join_url" target="_blank">{{scheduledMeetingResult.meeting_info_list[0].join_url}}</a></p>
                    <p>{{$t('common.meetingId')}}{{scheduledMeetingResult.meeting_info_list[0].meeting_code}}</p>
                    <p>{{$t('common.mPassword')}}:{{scheduledMeetingResult.meeting_info_list[0].password}}</p>
                </strong>
            </span>
        </el-dialog>

        <el-dialog
                :title="$t('common.MyMeeting')"
                :visible.sync="meetingsDialogVisible"
                width="30%"
                :before-close="handleClose">
            <span>
                <div style="height: 400px;overflow:scroll;background:#EEEEEE;padding: 20px 30px">
                    <div v-for="(value,key) in meetingList" :key="key">
                       <strong>{{key}}</strong>
                        <el-divider></el-divider>
                       <div v-for="(item,index) in value" :key="index" style="font-size: 10px;">
                                <p>{{$t('common.mTheTheme')}}:{{item.subject}}</p>
                                <p>{{$t('common.TheOriginator')}}：{{username}}</p>
                                <p>{{$t('common.mTime')}}：{{formatDateAndHouse(parseInt(item.startTime)*1000)}} - {{formatDateAndHouse(parseInt(item.endTime)*1000)}}</p>
                                <p>{{$t('common.meetingId')}}{{item.meetingCode }}</p>
                                <p>{{$t('common.mUrl')}}：<a :href="item.joinUrl" target="_blank">{{item.joinUrl}}</a></p>
                                <p v-if="item.password">{{$t('common.mPassword')}}：{{item.password}}</p>
                            <el-divider></el-divider>
                       </div>
                   </div>
                    <div v-if="JSON.stringify(meetingList) == '{}'" style="width: 100%;position: relative;">
                        <div style="position: absolute;left: 50%;top: 150px;transform: translate(-50%,-50%);font-size: 20px">
                            {{$t('common.NoData')}}
                        </div>
                    </div>

                </div>
            </span>
        </el-dialog>
        <el-dialog
                :title="$i18n.locale=='zh'?'提示':'Reminder'"
                :visible.sync="toViewLogin"
                :width="$i18n.locale=='zh'?'500px':'750px'"
                :height="$i18n.locale=='zh'?'300px':'386px'"
                :before-close="toViewLoginChange">
            <div style="width: 100%;height: 100%;">
                <img src="@/assets/img/loginTips.png" alt="" style="width: 180px;height: 180px;margin-left: 20px;">
                <div style="float: right;margin-right: 20px;"
                     :style="$i18n.locale=='zh'?'width: 49%;margin-top: 10px;':'width: 453px;margin-top: -25px;'">
                    <div style="font-size: 20px;font-weight: normal;color: #333333;
                        font-family: HiraginoSansGB-W3, HiraginoSansGB;
                        line-height: 40px;">
                        {{$t('common.ReminderFirst')}}
                    </div>
                    <div style="font-size: 16px;font-family: HiraginoSansGB-W3, HiraginoSansGB;
                        font-weight: normal;color: #666666;line-height: 30px;">
                        {{$t('common.ReminderSecond')}} <span style="color: #0091FF;font-size: 18px;">{{num}}</span>
                        {{$t('common.ReminderThird')}}
                    </div>
                    <div style="font-size: 14px;font-family: HiraginoSansGB-W3, HiraginoSansGB;
                        font-weight: normal;color: #666666;line-height: 30px;">
                        {{$t('common.ReminderForth')}}
                    </div>
                    <div style="font-size: 14px;font-family: HiraginoSansGB-W3, HiraginoSansGB;
                        height:33px;line-height:60px;font-weight: normal;color: #0091FF;">
                            <span style="margin-left: 40px;" class="cursor" @click="toView('login')">
                                {{$t('common.ReminderFifth')}}
                            </span>
                        <span style="margin-left: 10px;" class="cursor" @click="toView('Register')">
                                {{$t('common.ReminderSixth')}}
                            </span>
                    </div>
                </div>
            </div>
        </el-dialog>

    </div>
  </template>
  <script>
import {quickMeetings,myMeetings,myMeetingInfo,quickMeetingInfo} from '@/api/meeting/tencentMeeting'
import {getToken, resetToken} from "@/utils/auth";

  export default {
    name: 'onlineMeeting',
    mounted() {
      if(this.$Cookies.get('token')){
          let user = window.localStorage.getItem('user');
          let users = JSON.parse(user);
          console.log(users)
          let emailUserUid = users.umsUser.userEmail.split("@")[0];
          this.quickMeetingConfig.userid = emailUserUid;
          this.quickMeetingConfig.hosts[0] = {
                   "userid": emailUserUid
               };
          this.scheduledMeetingConfig.userid = emailUserUid;
           this.scheduledMeetingConfig.hosts[0] = {
                   "userid": emailUserUid
               };
          this.userId = users.userId;
          this.username = users.username;
          this.userUserTypeDict = users.umsUser.userUsertypeDict;
          this.onlineStatus = true;
      }
      let date = new Date();
      this.startDate = date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
      this.endDate = date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();

    },
      data () {
      return {
          num: 0,
          num: 5,
          toViewLogin: false,
          otherMeet:'平台支持使用腾讯会议，腾讯会议可以让您随时随地高效开会，全方位满足不同场景下的会议需求。您可以使用“腾讯会议”进行远程音视频会议、在线文档协作、屏幕共享等。',
          otherNum:0,
          isOnlineConsultation: false,
          meetingsDialogVisible:false,
          quickMeetingDialogVisible: false,
          scheduledMeeting:false,
          scheduledMeetingDialogVisible:false,
          quickMeetingtemporaryVisible:false,
          openPass:false,
          onlineStatus:false,
          loading:false,
          userUserTypeDict:'',
          userId:'',
          username:'',
          startDate:'',
          startTime:'00:00',
          endDate:'',
          endTime:'00:10',
          pickerOptions:{
              disabledDate(time) {
                  return time.getTime() < Date.now();
              },
          },
          meetingList:new Map(),
          quickMeetingResult : {
              meeting_number: 1,
              meeting_info_list:[
                  {
                      subject: "",
                      meeting_id: "",
                      meeting_code: "",
                      password: "",
                      start_time : "",
                      end_time : "",
                      hosts:[],
                      participants:[],
                      user_non_registered:[],
                      join_url: "",
                      settings:{}
                  }
              ]
          },
          scheduledMeetingResult : {
              meeting_number: 1,
              meeting_info_list:[
                  {
                      subject: "",
                      meeting_id: "",
                      meeting_code: "",
                      password: "",
                      start_time : "",
                      end_time : "",
                      hosts:[],
                      participants:[],
                      user_non_registered:[],
                      join_url: "",
                      settings:{}
                  }
              ]
          },
          quickMeetingConfig : {
              userid: "tester",//用户id
              instanceid: 5,//用户终端设备类型 1 - PC，2 - Mac，3 - Android，4 - iOS，5 - Web，6 - iPad，7 - Android Pad，8 - 小程序。
              subject: "我的会议",//会议主题
              type: 1,//会议类型 0 - 预约会议  1 - 快速会议。
               hosts: [{
                   "userid": "tester"
               }],//会议主持人的用户 ID，如果没有指定，主持人被设定为参数 userid 的用户，即 API 调用者。
              start_time: "1600227151",//会议开始时间
              end_time: "1600313551 ",//会议结束时间
              //password:'', //会议密码
              enable_interpreter:true,
              settings: {
                  mute_enable_join : true,//入会时静音。
                  allow_unmute_self : true,//允许参会者取消静音。
                  mute_all: false,//全体静音。
                  host_video: true,//入会时主持人视频是否开启，暂时不支持。
                  participant_video: false,//入会时参会者视频是否开启，暂时不支持。
                  enable_record: false,//开启录播，暂时不支持。
                  play_ivr_on_leave: false,//参会者离开时播放提示音。
                  play_ivr_on_join: false,//有新的入会者加入时播放提示音。
                  live_url: false,//开启直播, 暂时不支持。
                  //allow_in_before_host:true,//是否允许成员在主持人进会前加入会议
                  //auto_in_waiting_room:false,//是否开启等候室，默认值 false
                  //allow_screen_shared_watermark:false,//是否开启屏幕共享水印，默认值 false。
                  //only_enterprise_user_allowed:false//是否仅企业内部成员可入会，默认值 false。
              }
          },
          scheduledMeetingConfig : {
              userid: "tester",//用户id
              instanceid: 5,//用户终端设备类型 1 - PC，2 - Mac，3 - Android，4 - iOS，5 - Web，6 - iPad，7 - Android Pad，8 - 小程序。
              subject: "我的会议",//会议主题
              type: 0,//会议类型 0 - 预约会议  1 - 快速会议。
              // hosts: [],//会议主持人的用户 ID，如果没有指定，主持人被设定为参数 userid 的用户，即 API 调用者。
              start_time: '',//会议开始时间
              end_time: '',//会议结束时间
              password:'', //会议密码
              enable_interpreter:true,
              settings: {
                  mute_enable_join : true,//入会时静音。
                  allow_unmute_self : true,//允许参会者取消静音。
                  mute_all: false,//全体静音。
                  host_video: true,//入会时主持人视频是否开启，暂时不支持。
                  participant_video: false,//入会时参会者视频是否开启，暂时不支持。
                  enable_record: false,//开启录播，暂时不支持。
                  play_ivr_on_leave: false,//参会者离开时播放提示音。
                  play_ivr_on_join: false,//有新的入会者加入时播放提示音。
                  live_url: false,//开启直播, 暂时不支持。
                  //allow_in_before_host:true,//是否允许成员在主持人进会前加入会议
                  //auto_in_waiting_room:false,//是否开启等候室，默认值 false
                  //allow_screen_shared_watermark:false,//是否开启屏幕共享水印，默认值 false。
                  //only_enterprise_user_allowed:false//是否仅企业内部成员可入会，默认值 false。
              }
          }

      }
    },
    computed:{
      meetingStartTime(){
          let start = this.startDate.replace(/-/g, '/');
          let sDate = start + " " + this.startTime;
          let date = new Date(sDate);
          console.log(date);
          return (parseInt(date.getTime())/1000).toString()
      },
      meetingEndTime(){
          let end = this.startDate.replace(/-/g, '/');
          let eDate = end + " " + this.endTime;
          let date = new Date(eDate);
          console.log(date);
          return (parseInt(date.getTime())/1000).toString()
      }
    },
     watch:{
        "openPass"(){
            if(!this.openPass){
                this.scheduledMeetingConfig.password = '';
            }
        },
         "toViewLogin"() {
             if (this.toViewLogin == true) {

                 this.loginTipsChange()
             }
         },
         '$i18n.locale': {
             handler(val, oldval) {
                 if (this.$i18n.locale.toUpperCase() == 'ZH') {
                     if(this.otherNum===0){
                         this.otherMeet='平台支持使用腾讯会议，腾讯会议可以让您随时随地高效开会，全方位满足不同场景下的会议需求。您可以使用“腾讯会议”进行远程音视频会议、在线文档协作、屏幕共享等。'
                     }else if(this.otherNum===1){
                         this.otherMeet='平台支持使用ZOOM会议，ZOOM会议可以让您随时随地高效开会，全方位满足不同场景下的会议需求。您可以使用“ZOOM会议”进行远程音视频会议、在线文档协作、屏幕共享等。'
                     }
                 } else {
                     if(this.otherNum===0){
                         this.otherMeet='The platform supports the use of Tencent Conference. Tencent Conference allows you to hold meetings efficiently at any time and anywhere, meeting requirements under different scenarios in an all-round way. You can use "Tencent Conference" for remote audio and video conferencing, online document collaboration, screen sharing, etc.'
                     }else if(this.otherNum===1){
                         this.otherMeet='The platform supports the use of ZOOM Conference. ZOOM Conference allows you to hold meetings efficiently at any time and anywhere, meeting requirements under different scenarios in an all-round way. You can use "ZOOM Conference" for remote audio and video conferencing, online document collaboration, screen sharing, etc.'
                     }
                 }

             },
         },

     },
    methods:{
        changeMeeting1(){
            this.otherNum=0
            if (this.$i18n.locale.toUpperCase() == 'ZH') {
                this.otherMeet='平台支持使用腾讯会议，腾讯会议可以让您随时随地高效开会，全方位满足不同场景下的会议需求。您可以使用“腾讯会议”进行远程音视频会议、在线文档协作、屏幕共享等。'
            } else {
                this.otherMeet='The platform supports the use of Tencent Conference. Tencent Conference allows you to hold meetings efficiently at any time and anywhere, meeting requirements under different scenarios in an all-round way. You can use "Tencent Conference" for remote audio and video conferencing, online document collaboration, screen sharing, etc.'
            }
        },
        changeMeeting2(){
            this.otherNum=1
            if (this.$i18n.locale.toUpperCase() == 'ZH') {
                this.otherMeet='平台支持使用ZOOM会议，ZOOM会议可以让您随时随地高效开会，全方位满足不同场景下的会议需求。您可以使用“ZOOM会议”进行远程音视频会议、在线文档协作、屏幕共享等。'
            } else {
                this.otherMeet='The platform supports the use of ZOOM Conference. ZOOM Conference allows you to hold meetings efficiently at any time and anywhere, meeting requirements under different scenarios in an all-round way. You can use "ZOOM Conference" for remote audio and video conferencing, online document collaboration, screen sharing, etc.'
            }
        },
        loginTipsChange() {
            const that = this;
            this.num = 5;
            // clearInterval(timer_interval);

            this.timer = setInterval(function () {
                if (that.num > 0) {
                    that.num--;
                } else {
                    if (that.toViewLogin == true) {
                        clearInterval(that.timer);
                        that.toView('login');
                    } else {
                        clearInterval(that.timer);
                    }
                }
            }, 1000)
        },
        toViewLoginChange(done) {
            this.toViewLogin = false;
            this.num = 5;
            clearInterval(this.timer);
        },
        toView(router, json) {
            clearInterval(this.timer);
            this.$router.push({
                name: router,
                params: json,

            });

        },
        reserve(){
            let user = window.localStorage.getItem("user");
            if (!this.$Cookies.get('token')) {
                this.toViewLogin = true;
            } else {
                this.scheduledMeeting = true;
            }
           /* if(this.userUserTypeDict != '2'){
                this.$alert('该功能仅会员可以使用', '温馨提示', {
                    confirmButtonText: '确定'
                });
                return
            }*/

        },
        myMeeting(){
            let user = window.localStorage.getItem("user");
            if(this.otherNum===0){
                if (!this.$Cookies.get('token')) {
                    this.toViewLogin = true;
                } else {
                    /*if(this.userUserTypeDict != '2'){
                        this.$alert(this.$t('common.checkTip3'), this.$t('common.WarmPrompt'), {
                            confirmButtonText: this.$t('common.mConfirm')
                        });
                        return
                    }*/
                    this.loading = true;
                    myMeetings(this.userId).then(result => {
                        this.loading = false;
                      this.meetingList = result.data;
                      this.meetingsDialogVisible = true;
                    }).catch(error =>{
                        this.loading = false;
                        this.$alert(this.$t('common.mError'), this.$t('common.WarmPrompt'), {
                            confirmButtonText: this.$t('common.mConfirm')
                        });
                    })
                }
            }else{
                if (!this.$Cookies.get('token')) {
                    this.toViewLogin = true;
                } else {
                    /*if(this.userUserTypeDict != '2'){
                        this.$alert(this.$t('common.checkTip3'), this.$t('common.WarmPrompt'), {
                            confirmButtonText: this.$t('common.mConfirm')
                        });
                        return
                    }*/
                    this.loading = true;
                    myMeetingInfo(this.userId).then(result => {
                        this.loading = false;
                      this.meetingList = result.data;
                      this.meetingsDialogVisible = true;
                    }).catch(error =>{
                        this.loading = false;
                        this.$alert(this.$t('common.mError'), this.$t('common.WarmPrompt'), {
                            confirmButtonText: this.$t('common.mConfirm')
                        });
                    })
                }
            }
        },
        handleClose(done) {
            this.$confirm(this.$t('common.cClose'),this.$t('common.WarmPrompt'),{
                confirmButtonText: this.$t('common.mConfirm'),
                cancelButtonText: this.$t('common.mCancel'),
            })
                .then(_ => {
                    done();
                })
                .catch(_ => {});
        },
        scheduledMeetingEvent(){
            let that = this;
            var token = "" + getToken();
            //console.log('开始',this.meetingStartTime)
            //console.log('结束',this.meetingEndTime)
            //console.log(parseInt(this.meetingStartTime) < parseInt(this.meetingEndTime))
            if(parseInt(this.meetingStartTime) > parseInt(this.meetingEndTime)){

                this.$alert(this.$t('common.checkTip1'), this.$t('common.WarmPrompt'), {
                    confirmButtonText: this.$t('common.mConfirm')
                });
                return
            };

            if(parseInt(this.meetingStartTime) * 1000 < new Date().getTime()){
                this.$alert(this.$t('common.checkTip2'), this.$t('common.WarmPrompt'), {
                    confirmButtonText: this.$t('common.mConfirm')
                });
                return
            };
            that.scheduledMeetingConfig.start_time = this.meetingStartTime;
            that.scheduledMeetingConfig.end_time = this.meetingEndTime;
            this.loading = true;
            if(that.otherNum===1){
                that.scheduledMeetingConfig.type=2
                console.log('年后')
                quickMeetingInfo(JSON.stringify(that.scheduledMeetingConfig),that.userId,token).then( resutl => {
                    let meeting = resutl.data;
                    this.loading = false;
                    if(meeting !== null){
                        that.scheduledMeeting = false;
                      /* that.scheduledMeetingResult = meeting;
                       that.scheduledMeetingDialogVisible = true;*/
                      this.$alert(this.$t('common.msuccess'), this.$t('common.WarmPrompt'), {
                        confirmButtonText: this.$t('common.mConfirm')
                      });
                      location.reload;
                    }else{
                        this.$alert(this.$t('common.mError'), this.$t('common.WarmPrompt'), {
                            confirmButtonText: this.$t('common.mConfirm')
                        });
                    }
                    console.log(meeting);
                }).catch((error) => {
                    // 此处你的业务代码
                    this.loading = false;
                    this.$alert(this.$t('common.mError'), this.$t('common.WarmPrompt'), {
                        confirmButtonText: this.$t('common.mConfirm')
                    });
                });
            }else if(that.otherNum===0){
                that.scheduledMeetingConfig.type=0
                quickMeetings(JSON.stringify(that.scheduledMeetingConfig),that.userId,token).then( resutl => {
                    let meeting = resutl.data;
                    this.loading = false;
                    if(meeting.meeting_info_list){
                        that.scheduledMeeting = false;
                        that.scheduledMeetingResult = meeting;
                        that.scheduledMeetingDialogVisible = true;
                    }else{
                        this.$alert(this.$t('common.mError'), this.$t('common.WarmPrompt'), {
                            confirmButtonText: this.$t('common.mConfirm')
                        });
                    }
                    console.log(meeting);
                }).catch((error) => {
                    // 此处你的业务代码
                    this.loading = false;
                    this.$alert(this.$t('common.mError'), this.$t('common.WarmPrompt'), {
                        confirmButtonText: this.$t('common.mConfirm')
                    });
                });
            }
        },
        quickMeeting(){
            // if(!this.onlineStatus){
            //     this.$alert(this.$t('common.PleaseLoginFirst'), this.$t('common.WarmPrompt'), {
            //         confirmButtonText: this.$t('common.mConfirm')
            //     });
            //     return
            // }
            let user = window.localStorage.getItem("user");
            if (!this.$Cookies.get('token')) {
                this.toViewLogin = true;
            } else {
                /*if(this.userUserTypeDict != '2'){
                this.$alert('该功能仅会员可以使用', '温馨提示', {
                    confirmButtonText: '确定'
                });
                return
            }*/
                let that = this;
                var token = "" + getToken();
                this.loading = true;
                if(this.otherNum===0){
                        quickMeetings(JSON.stringify(that.quickMeetingConfig), that.userId, token).then(resutl => {
                        let meeting = resutl.data;
                        this.loading = false;
                        if (meeting.meeting_info_list) {
                            that.quickMeetingResult = meeting;
                            that.quickMeetingDialogVisible = true
                        } else {
                            this.$alert(this.$t('common.mError'), this.$t('common.WarmPrompt'), {
                                confirmButtonText: this.$t('common.mConfirm')
                            });
                        }
                    }).catch((error) => {
                        this.loading = false;
                        this.$alert(this.$t('common.mError'), this.$t('common.WarmPrompt'), {
                            confirmButtonText: this.$t('common.mConfirm')
                        });
                    });
                }else{
                    console.log('年后')
                    quickMeetingInfo(JSON.stringify(that.quickMeetingConfig), that.userId, token).then(resutl => {
                        let meeting = resutl.data;
                        this.loading = false;
                        console.log("输出带入出来的内容");
                        debugger
                        if (meeting !== null) {
                           /* that.quickMeetingResult = meeting;
                            that.quickMeetingDialogVisible = true*/
                          this.$alert(this.$t('common.msuccess'), this.$t('common.WarmPrompt'), {
                            confirmButtonText: this.$t('common.mConfirm')
                          });
                          location.reload;
                        } else {
                            this.$alert(this.$t('common.mError'), this.$t('common.WarmPrompt'), {
                                confirmButtonText: this.$t('common.mConfirm')
                            });
                        }
                    }).catch((error) => {
                        this.loading = false;
                        this.$alert(this.$t('common.mError'), this.$t('common.WarmPrompt'), {
                            confirmButtonText: this.$t('common.mConfirm')
                        });
                    });
                }
            }
        },
        templeTip(){
            const that = this;
            if (!that.$Cookies.get('token')) {
                that.toViewLogin = true;
            } else {
                that.quickMeetingtemporaryVisible = true
            }
        }

    }

  }
  </script>

  <!-- Add "scoped" attribute to limit CSS to this component only -->
  <style scoped>

    body {
        margin: 0;
    }
    .box {
    margin-top: 10px;
    background: #fff;
    /* height: 500px; */
    padding: 20px 0;
    }
    .crumbs {
    margin-left: 20px;
    }
    .content{
        width: 88%;
        text-align: center;
        padding: 74px 74px;
    }
    .ui-top{
        display: flex;
        justify-content: space-evenly;
    }
    .ui-top-span1{

    }
    .ui-top-span{
        font-weight: 700;
    }
    .meetingBtn{
        margin-right: 50px;
        width: 180px;
        height: 95px;
        color: #fff;
        font-size: 18px;
        vertical-align: middle;
    }
    .meetingBtn2{
        margin-right: 50px;
        width: 240px;
        height: 95px;
        color: #fff;
        font-size: 18px;
        vertical-align: middle;
    }
    .tep{
        width: 100%;
        height: 550px;
        background: url(../../assets/img/home/tepbg.png) no-repeat ;
        /* background-size: cover; */
        position: relative;
    }
    .mark{
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        background: #0c0808;
        opacity: 0.6;

    }
    .tepDet{
        position: relative;
        width: 1200px;
        /* height: 100%; */
        margin: auto;
        color: #fff;

        text-align: center;
        padding: 80px 10px;
    }
    .detail{
        width: 1200px;
        margin: auto;
        color: #fff;
        padding-left: 200px;
        text-align: center;
        position: relative;
    }
    .detBox{
        width: 360px;
        height: 200px;
        background: #fff;
        opacity: 0.2;
        position: relative;
        display: inline-block;
        margin-right: 25px;
    }
    .tepCont{
        width: 100%;
        position: relative;
        top:0;
        left: 0;
        color: #fff;
        font-size: 18px;
    }
    .detCont{
        width:300px;
        height:200px;
        float: left;
        margin-right: 25px;
        background: #d9dae0;
        opacity: 0.2;

    }
    .detContInner{
        height: 100px;
        width: 280px;
        padding-left: 10px;
        position: absolute;
        margin-top: 50px;
    }
    .detOut{
        width:300px;
        height:200px;
        float: left;
        margin-right: 25px;
    }
    /deep/.el-dialog__body {
        word-break: normal;
    }
</style>