Skip to content

L
live-management-web
Commit 8f1ca7d1 by haojie
Options

加入首屏loading

parent 2408047a
Showing with 122 additions and 105 deletions
index.html
...@@ -9,9 +9,117 @@ ...@@ -9,9 +9,117 @@
<meta property="og:title" content="" /> <meta property="og:title" content="" />
<script src="/qwebchannel.js"></script> <script src="/qwebchannel.js"></script>
<title>maoyan</title> <title>maoyan</title>
<style>
html {
background-color: rgb(30, 30, 30);
}
.lds-roller-parent {
width: 100%;
height: 100%;
}
.lds-roller {
display: inline-block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
}
.lds-roller div {
animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
transform-origin: 32px 32px;
}
.lds-roller div:after {
content: ' ';
display: block;
position: absolute;
width: 6px;
height: 6px;
border-radius: 50%;
background: #04ae8a;
margin: -3px 0 0 -3px;
}
.lds-roller div:nth-child(1) {
animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
top: 50px;
left: 50px;
}
.lds-roller div:nth-child(2) {
animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
top: 54px;
left: 45px;
}
.lds-roller div:nth-child(3) {
animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
top: 57px;
left: 39px;
}
.lds-roller div:nth-child(4) {
animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
top: 58px;
left: 32px;
}
.lds-roller div:nth-child(5) {
animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
top: 57px;
left: 25px;
}
.lds-roller div:nth-child(6) {
animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
top: 54px;
left: 19px;
}
.lds-roller div:nth-child(7) {
animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
top: 50px;
left: 14px;
}
.lds-roller div:nth-child(8) {
animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
top: 45px;
left: 10px;
}
@keyframes lds-roller {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
</style>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app">
<div class="lds-roller-parent">
<div class="lds-roller">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>
</div>
<script> <script>
try { try {
console.warn('初始化页面'); console.warn('初始化页面');
......
package.json
...@@ -28,6 +28,7 @@ ...@@ -28,6 +28,7 @@
}, },
"devDependencies": { "devDependencies": {
"@types/js-cookie": "^3.0.3", "@types/js-cookie": "^3.0.3",
"@types/node": "^20.5.0",
"@types/uuid": "^9.0.2", "@types/uuid": "^9.0.2",
"@typescript-eslint/eslint-plugin": "^6.2.0", "@typescript-eslint/eslint-plugin": "^6.2.0",
"@typescript-eslint/parser": "^6.2.0", "@typescript-eslint/parser": "^6.2.0",
......
src/components/WebSiteLogo.vue deleted 100644 → 0
<template>
<div class="custom-site-logo-box" v-if="needTitle">
<img
:src="getSiteLogo()"
alt=""
:style="{
width: width + 'px',
height: height + 'px',
}"
class="logo-icon"
/>
<span class="custom-logo-text">
{{ getSiteTitle() }}
</span>
</div>
<template v-else>
<img
:src="getSiteLogo()"
alt=""
:class="[className]"
:style="{
width: width + 'px',
height: height + 'px',
}"
class="logo-icon"
/>
</template>
</template>
<script lang="ts" setup>
import HomeLightLogo from '@/assets/logo/header-light-logo.svg';
import { Web_name, SiteConfig, webNameList } from '@/constants/token';
import { getSiteTitle } from '@/config/site';
const props = withDefaults(
defineProps<{
width?: number;
height?: number;
needTitle?: boolean;
className?: string;
}>(),
{
width: 23,
height: 26,
needTitle: true,
className: '',
},
);
const imgs = {
silkr: new URL('../assets/logo/header-light-logo.svg', import.meta.url).href,
tidrk: new URL('../assets/logo/logo2.png', import.meta.url).href,
};
// 获取网站logo
const getSiteLogo = () => {
switch (Web_name) {
case webNameList.SILKR:
return imgs.silkr;
case webNameList.TIDRK:
return imgs.tidrk;
}
};
// logo文字的颜色
const getTextColor = () => {
//
};
</script>
<style lang="less">
.custom-site-logo-box {
display: flex;
align-items: center;
.logo-icon {
margin: 0 4px;
}
.custom-logo-text {
color: #2962ff;
font-weight: bold;
font-size: 16px;
}
}
</style>
src/hooks/useScript.ts
...@@ -21,7 +21,7 @@ export const processTextCallback = () => { ...@@ -21,7 +21,7 @@ export const processTextCallback = () => {
const route = useRoute(); const route = useRoute();
// 提交后的直播id // 提交后的直播id
const live_task_id = ref(0); const live_task_id = ref<any>(0);
// //
const loading = ref(false); const loading = ref(false);
...@@ -119,6 +119,8 @@ export const processTextCallback = () => { ...@@ -119,6 +119,8 @@ export const processTextCallback = () => {
loading.value = true; loading.value = true;
let res: any = await onUpdateLiveTask(route.query.id, params); let res: any = await onUpdateLiveTask(route.query.id, params);
if (res) { if (res) {
live_task_id.value = route.query.id;
console.log(live_task_id.value, '更新的直播id');
if (route.query.type === 'edit') { if (route.query.type === 'edit') {
// 通知python删除对应的output.mp4 // 通知python删除对应的output.mp4
callPyjsInWindow('deleteOutputVideo', { callPyjsInWindow('deleteOutputVideo', {
......
src/layouts/components/Footer.vue
...@@ -2,7 +2,6 @@ ...@@ -2,7 +2,6 @@
<div class="s-footer"></div> <div class="s-footer"></div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import WebSiteLogo from '@/components/WebSiteLogo.vue';
import { computed, onMounted, reactive } from 'vue'; import { computed, onMounted, reactive } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
......
src/pages/createLive/index.vue
...@@ -105,17 +105,8 @@ import { v4 } from 'uuid'; ...@@ -105,17 +105,8 @@ import { v4 } from 'uuid';
import { splitAudio } from '@/utils/audio'; import { splitAudio } from '@/utils/audio';
import { audioScriptVersion } from '@/service/CreateLive'; import { audioScriptVersion } from '@/service/CreateLive';
import { audioSplitDuration, getTestUuid } from '@/constants/token'; import { audioSplitDuration, getTestUuid } from '@/constants/token';
const { const { loading, initNum, currentSetp, live_task_id, openInterval, getCreateLiveInfo, submitSuccessed, uploadToAly } =
loading, processTextCallback();
initNum,
currentSetp,
live_task_id,
audioStart,
openInterval,
getCreateLiveInfo,
submitSuccessed,
uploadToAly,
} = processTextCallback();
const [commitInfo] = useLiveInfoSubmit(); const [commitInfo] = useLiveInfoSubmit();
const store = useStore(); const store = useStore();
......
src/service/CreateLive.ts
...@@ -397,7 +397,6 @@ export const regenerate = async (list: any[], item: any, live_id: any) => { ...@@ -397,7 +397,6 @@ export const regenerate = async (list: any[], item: any, live_id: any) => {
let res: any = await liveTaskRegenerate(live_id, params); let res: any = await liveTaskRegenerate(live_id, params);
if (res.code == 0) { if (res.code == 0) {
console.log(JSON.stringify(params)); console.log(JSON.stringify(params));
writeLog('重新生成直播，已经提交-' + live_id);
console.log('重新生成直播，已经提交-', live_id); console.log('重新生成直播，已经提交-', live_id);
} }
} catch (e) { } catch (e) {
......
stats.html
This source diff could not be displayed because it is too large. You can view the blob instead.
vite.config.ts
...@@ -7,7 +7,7 @@ import svgLoader from 'vite-svg-loader'; ...@@ -7,7 +7,7 @@ import svgLoader from 'vite-svg-loader';
import legacy from '@vitejs/plugin-legacy'; import legacy from '@vitejs/plugin-legacy';
// import viteCompression from 'vite-plugin-compression'; // import viteCompression from 'vite-plugin-compression';
import path from 'path'; import path from 'path';
// import { visualizer } from 'rollup-plugin-visualizer'; import { visualizer } from 'rollup-plugin-visualizer';
// import importToCDN from 'vite-plugin-cdn-import'; // import importToCDN from 'vite-plugin-cdn-import';
import eslintPlugin from 'vite-plugin-eslint'; import eslintPlugin from 'vite-plugin-eslint';
...@@ -38,12 +38,12 @@ export default defineConfig(({ command, mode }) => { ...@@ -38,12 +38,12 @@ export default defineConfig(({ command, mode }) => {
}), }),
// viteCompression(), // viteCompression(),
// 打包体积分析 // 打包体积分析
// visualizer({ visualizer({
// open: true, //注意这里要设置为true，否则无效 open: true, //注意这里要设置为true，否则无效
// filename: 'stats.html', //分析图生成的文件名 filename: 'stats.html', //分析图生成的文件名
// gzipSize: true, // 收集 gzip 大小并将其显示 gzipSize: true, // 收集 gzip 大小并将其显示
// brotliSize: true, // 收集 brotli 大小并将其显示 brotliSize: true, // 收集 brotli 大小并将其显示
// }), }),
// importToCDN({ // importToCDN({
// modules: [ // modules: [
// { // {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment