|
|
@@ -163,25 +163,12 @@
|
|
|
<el-button type="primary" @click="templateDialogVisible = false">{{ t('关闭') }}</el-button>
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
-
|
|
|
- <!-- 观看弹窗 -->
|
|
|
- <el-dialog v-model="watchDialogVisible" :title="t('观看直播')" width="800px" destroy-on-close>
|
|
|
- <div v-if="currentWatchUrl" class="watch-container">
|
|
|
- <video ref="videoRef" controls autoplay style="width: 100%; max-height: 450px; background: #000">
|
|
|
- <source :src="currentWatchUrl" type="application/x-mpegURL" />
|
|
|
- </video>
|
|
|
- <div class="watch-url">
|
|
|
- <span>{{ t('播放地址') }}:</span>
|
|
|
- <el-link type="primary" :href="currentWatchUrl" target="_blank">{{ currentWatchUrl }}</el-link>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div v-else class="watch-empty">{{ t('暂无播放地址') }}</div>
|
|
|
- </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
import { ref, reactive, onMounted, computed } from 'vue'
|
|
|
+import { useRouter } from 'vue-router'
|
|
|
import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
|
|
|
import { Search, RefreshRight, View } from '@element-plus/icons-vue'
|
|
|
import {
|
|
|
@@ -198,6 +185,7 @@ import dayjs from 'dayjs'
|
|
|
import { useI18n } from 'vue-i18n'
|
|
|
|
|
|
const { t } = useI18n({ useScope: 'global' })
|
|
|
+const router = useRouter()
|
|
|
|
|
|
// 格式化时间
|
|
|
function formatDateTime(dateStr: string | undefined): string {
|
|
|
@@ -211,10 +199,8 @@ const actionLoading = ref<Record<number, boolean>>({})
|
|
|
const streamList = ref<LiveStreamDTO[]>([])
|
|
|
const dialogVisible = ref(false)
|
|
|
const templateDialogVisible = ref(false)
|
|
|
-const watchDialogVisible = ref(false)
|
|
|
const formRef = ref<FormInstance>()
|
|
|
const currentTemplate = ref('')
|
|
|
-const currentWatchUrl = ref('')
|
|
|
|
|
|
// 下拉选项
|
|
|
const lssOptions = ref<LssDTO[]>([])
|
|
|
@@ -626,8 +612,15 @@ async function handleStop(row: LiveStreamDTO) {
|
|
|
}
|
|
|
|
|
|
function handleWatch(row: LiveStreamDTO) {
|
|
|
- currentWatchUrl.value = row.playUrl || ''
|
|
|
- watchDialogVisible.value = true
|
|
|
+ // 跳转到 Cloudflare Stream 页面,带上 stream 信息
|
|
|
+ router.push({
|
|
|
+ path: '/cc',
|
|
|
+ query: {
|
|
|
+ streamSn: row.streamSn,
|
|
|
+ name: row.name,
|
|
|
+ playUrl: row.playUrl || ''
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
async function handleSubmit() {
|
|
|
@@ -820,29 +813,4 @@ onMounted(() => {
|
|
|
max-height: 400px;
|
|
|
overflow: auto;
|
|
|
}
|
|
|
-
|
|
|
-.watch-container {
|
|
|
- video {
|
|
|
- border-radius: 4px;
|
|
|
- }
|
|
|
-
|
|
|
- .watch-url {
|
|
|
- margin-top: 12px;
|
|
|
- padding: 8px 12px;
|
|
|
- background: #f5f7fa;
|
|
|
- border-radius: 4px;
|
|
|
- font-size: 13px;
|
|
|
-
|
|
|
- span {
|
|
|
- color: #666;
|
|
|
- margin-right: 8px;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.watch-empty {
|
|
|
- text-align: center;
|
|
|
- padding: 40px;
|
|
|
- color: #999;
|
|
|
-}
|
|
|
</style>
|