更新

app/video_companion/src/App.vue

@@ -0,0 +1,33 @@
+<script setup lang="ts">
+import { TUICallKit } from '@trtc/calls-uikit-vue'
+import type { Ref } from 'vue'
+
+defineProps<{
+  phase: Readonly<Ref<string>>
+  statusText: Readonly<Ref<string>>
+}>()
+</script>
+
+<template>
+  <main class="call-stage">
+    <TUICallKit
+      class="call-kit"
+      :allowed-minimized="false"
+      :allowed-full-screen="true"
+    />
+
+    <section v-if="phase.value === 'ready' || phase.value === 'starting' || phase.value === 'error'" class="status-card">
+      <span class="status-dot" :class="`status-dot--${phase.value}`" aria-hidden="true" />
+      <div>
+        <p class="eyebrow">中医视频面诊</p>
+        <h1>{{ statusText.value }}</h1>
+        <p v-if="phase.value === 'ready'" class="status-hint">通话凭证仅由业务后端签发</p>
+      </div>
+    </section>
+
+    <div v-else class="live-status" role="status">
+      <span class="status-dot status-dot--live" aria-hidden="true" />
+      {{ statusText.value }}
+    </div>
+  </main>
+</template>