yijianbao_user_uniapp/pages_im/pages/common/joinMeeting/index.vue

<template>
  <view class="page_container">
    <custom-nav-bar title="加入会议" />

    <view class="input_row">
      <view> 会议号 </view>
      <u--input placeholder="请输入会议号" border="none" v-model="meetingID"></u--input>
    </view>

    <view class="action_row">
      <u-button type="primary" text="进入会议" @click="tryJoinMeeting"></u-button>
    </view>
  </view>
</template>

<script>
import { mapGetters } from "vuex";
import CustomNavBar from "../../../components/CustomNavBar/index.vue";
import { meetingModule, meetingErrorHandle } from "../../../util/imCommon";
import config from "../../../common/config";
import { joinMeeting } from '../../../api/meeting'

export default {
  components: {
    CustomNavBar,
  },
  data() {
    return {
      meetingID: "",
    };
  },
  computed: {
    ...mapGetters(["storeSelfInfo"]),
  },
  methods: {
    tryJoinMeeting() {
      if (!this.meetingID) {
        return;
      }
      const params = {
        meetingID: this.meetingID,
        userID: this.storeSelfInfo.userID,
        password: "",
      };
      joinMeeting(params)
        .then(( data ) => {
          const meetingData = {
            liveURL: data.liveKit?.url,
            token: data.liveKit?.token,
            roomID: this.meetingID,
            imToken: uni.getStorageSync("IMToken"),
            baseURL: config.getApiUrl()
          };
          meetingModule.startMeeting(meetingData);
        })
        .catch(meetingErrorHandle);
    },
  },
};
</script>

<style lang="scss">
.page_container {
  background-color: #f6f6f6;

  .input_row {
    display: flex;
    padding: 32rpx;
    margin-top: 24rpx;
    background-color: #fff;

    .u-input {
      margin-left: 24rpx;
    }
  }

  .action_row {
    margin-top: 10vh;
    padding: 0 24%;
  }
}
</style>