Commit e10ac17c by haojie

关播成功通知首页刷新直播列表

parent 63474c79
...@@ -19,6 +19,7 @@ ...@@ -19,6 +19,7 @@
border: 4px solid #ccc; border: 4px solid #ccc;
border-top-color: #888; border-top-color: #888;
animation: spin 1s infinite linear; animation: spin 1s infinite linear;
transform: translateZ(0);
} }
@keyframes spin { @keyframes spin {
......
...@@ -89,6 +89,8 @@ watch( ...@@ -89,6 +89,8 @@ watch(
height: 174px; height: 174px;
border-top-left-radius: 8px; border-top-left-radius: 8px;
border-top-right-radius: 8px; border-top-right-radius: 8px;
// object-fit: contain;
// object-fit: cover;
} }
} }
} }
......
...@@ -30,9 +30,15 @@ ...@@ -30,9 +30,15 @@
</template> </template>
<template #live> <template #live>
<template v-if="item.is_live"> <template v-if="item.is_live">
<div class="digtal-people-liveing"> <div class="digtal-people-status liveing">
<div class="dot"></div> <div class="dot"></div>
<span>直播中</span> <span>LIVE</span>
</div>
</template>
<template v-if="item.status == 2">
<div class="digtal-people-status process">
<OtherLoading></OtherLoading>
<span>生成中</span>
</div> </div>
</template> </template>
</template> </template>
...@@ -45,6 +51,7 @@ ...@@ -45,6 +51,7 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import OtherLoading from '@/components/Loading/index_1.vue';
import Grid from '@/components/Grid.vue'; import Grid from '@/components/Grid.vue';
import { onMounted, reactive, ref, watch } from 'vue'; import { onMounted, reactive, ref, watch } from 'vue';
import ConfirmDialog from '@/components/ConfirmDialog.vue'; import ConfirmDialog from '@/components/ConfirmDialog.vue';
...@@ -169,6 +176,7 @@ watch( ...@@ -169,6 +176,7 @@ watch(
</script> </script>
<style lang="less"> <style lang="less">
@import '@/style/variables.less';
.my-digtal-people { .my-digtal-people {
padding: 20px 30px; padding: 20px 30px;
background: #303030; background: #303030;
...@@ -197,23 +205,44 @@ watch( ...@@ -197,23 +205,44 @@ watch(
margin-bottom: 20px; margin-bottom: 20px;
} }
} }
.digtal-people-liveing { .digtal-people-status {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
background: rgb(252, 56, 75);
border-top-right-radius: 8px; border-top-right-radius: 8px;
color: white;
padding: 6px 12px; padding: 6px 12px;
display: flex; display: flex;
justify-content: space-evenly;
align-items: center; align-items: center;
font-weight: bold; font-weight: bold;
height: 30px;
width: 74px;
font-size: @size-12;
white-space: nowrap;
font-weight: 700;
.dot { .dot {
width: 10px; width: 5px;
height: 10px; height: 5px;
border-radius: 50%; border-radius: 50%;
background: white; background: white;
margin-right: 12px; }
}
.liveing {
background: rgb(252, 56, 75);
color: white;
}
.process {
color: #fff;
background: #b3b3b3;
.custom-loading {
height: auto;
margin-right: 6px;
.spinner {
width: 16px;
height: 16px;
border: 2px solid #fff;
border-top-color: #b3b3b3;
}
} }
} }
} }
......
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