add rtc feature, set payment page to wip state

src/views/obs/MusicRequestOBS.vue

@@ -2,6 +2,7 @@
 import { DanmakuUserInfo, SongsInfo } from '@/api/api-models'
 import { QueryGetAPI } from '@/api/query'
 import { AVATAR_URL, MUSIC_REQUEST_API_URL } from '@/data/constants'
+import { useWebRTC } from '@/store/useRTC'
 import { useElementSize } from '@vueuse/core'
 import { NDivider, NEmpty, useMessage } from 'naive-ui'
 import { computed, onMounted, onUnmounted, ref } from 'vue'
@@ -22,6 +23,7 @@ const route = useRoute()
 const currentId = computed(() => {
   return props.id ?? route.query.id
 })
+const rtc = useWebRTC().Init('slave')
 
 const listContainerRef = ref()
 const footerRef = ref()

src/views/obs/QuestionDisplayOBS.vue

@@ -5,9 +5,11 @@ import { QUESTION_API_URL } from '@/data/constants'
 import { useRouteQuery } from '@vueuse/router'
 import { onMounted, onUnmounted, ref } from 'vue'
 import QuestionDisplayCard from '../manage/QuestionDisplayCard.vue'
+import { useWebRTC } from '@/store/useRTC'
 
 const hash = ref('')
 const token = useRouteQuery('token')
+const rtc = useWebRTC().Init('slave')
 
 const question = ref<QAInfo>()
 const setting = ref<Setting_QuestionDisplay>({} as Setting_QuestionDisplay)

src/views/obs/QueueOBS.vue

@@ -18,6 +18,7 @@ import { Vue3Marquee } from 'vue3-marquee'
 import { NCard, NDivider, NEmpty, NSpace, NText, useMessage } from 'naive-ui'
 import { List } from 'linqts'
 import { isSameDay } from 'date-fns'
+import { useWebRTC } from '@/store/useRTC'
 
 const props = defineProps<{
   id?: number
@@ -28,6 +29,7 @@ const route = useRoute()
 const currentId = computed(() => {
   return props.id ?? route.query.id
 })
+const rtc = useWebRTC().Init('slave')
 
 const listContainerRef = ref()
 const footerRef = ref()