Skip to content

D
digitalPerson-fe
Commit e70dc362 authored by shirlyn.guo's avatar shirlyn.guo 🤡
Browse files
Options

chore: 推荐模板优化

parent ba060a3f
Hide whitespace changes
Inline Side-by-side
Showing with 204 additions and 353 deletions
src/apis/template.ts
View file @ e70dc362
import { request } from '@/utils/request'
// 获取模板
export function fetchDigitalHumanTemplateStatusList<T>(payload: object) {
return request.post<T>('/aiDigitalHumanTemplateStatusRest/getDigitalHumanTemplateStatusList.json', payload)
export function fetchDigitalHumanTemplateStatusList<T>(
templateType: string,
pagingInfo: { pageNo: number; pageSize: number },
) {
return request.post<T>('/aiDigitalHumanTemplateStatusRest/getDigitalHumanTemplateStatusList.json', null, {
params: {
templateType,
pageNo: pagingInfo.pageNo,
pageSize: pagingInfo.pageSize,
},
})
}
// 根据ID获取推荐模板信息
......
src/views/workbench/components/recommend-template.vue
View file @ e70dc362
<script setup lang="ts">
import { fetchDigitalHumanTemplateStatusList } from '@/apis/template.ts'
import { DigitalTemplate, TemplateType } from '@/store/types/template.ts'
import { useInfiniteScroll } from '@vueuse/core'
import { computed, onMounted, ref } from 'vue'
import { useRouter } from 'vue-router'
import { computed, onMounted, ref, toRefs, watch } from 'vue'
import TemplatePreviewModal from './template-preview-modal.vue'
import { useScroll } from '@vueuse/core'
import { DigitalTemplate, TemplateType } from '@/store/types/template'
import { useRouter } from 'vue-router'
import { fetchDigitalHumanTemplateStatusList } from '@/apis/template'
interface PagingInfo {
pageNo: number
totalPages: number
pageSize: number
totalRows: number
}
const router = useRouter()
const PreviewModalVisible = ref(false)
const selectedTemplate = ref<DigitalTemplate>()
const previewModalVisible = ref(false)
const selectedTemplate = ref<DigitalTemplate>({} as DigitalTemplate)
const checkedClassifyValue = ref('')
const loadingMoreTemplate = ref(false)
const templatePageSize = ref(30)
const isHoverTemplate = ref<{ [key: string]: boolean }>({})
const templateBottomEl = ref<HTMLElement | null>(null)
const cardItems = ref<HTMLElement[]>([])
const cardItemsImg = ref<HTMLImageElement[]>([])
const templateList = ref<DigitalTemplate[]>([])
const newTemplateList = ref<(DigitalTemplate & { position: { top: number; left: number } })[]>([])
const pagingInfo = ref({
pageNo: 1,
totalPages: 1,
pageSize: 30,
totalRows: 2,
})
const columnHeights = ref<number[]>([])
const waterfallHeight = ref(900)
const templateIsLoading = ref(false)
const templateListEl = ref(null)
const smooth = ref(false)
const behavior = computed(() => (smooth.value ? 'smooth' : 'auto'))
const { arrivedState } = useScroll(templateListEl, { behavior })
const { bottom } = toRefs(arrivedState)
const templateClassify = [
{ value: '', label: '熱門' },
......@@ -21,69 +44,126 @@ const templateClassify = [
{ value: TemplateType.EDUCATION_LEARNING, label: '教育學習' },
{ value: TemplateType.FESTIVAL_HOTS_SPOTS, label: '節日熱點' },
]
const templateList = ref<DigitalTemplate[]>([])
const filteredTemplateData = computed(() => {
if (!checkedClassifyValue.value) {
return templateList.value
watch(checkedClassifyValue, () => {
pagingInfo.value = {
pageNo: 1,
totalPages: 1,
pageSize: 30,
totalRows: 0,
}
return templateList.value.filter((item) => item.templateType === checkedClassifyValue.value)
columnHeights.value = Array(6).fill(0)
getTemplateList(true)
})
const displayedData = computed(() => {
return filteredTemplateData.value.slice(0, templatePageSize.value)
watch(bottom, (newBottom) => {
if (newBottom) {
if (pagingInfo.value.pageNo < pagingInfo.value.totalPages) {
pagingInfo.value.pageNo += 1
getTemplateList()
}
}
templateIsLoading.value = false
})
const canLoadMore = computed(() => {
return templatePageSize.value < filteredTemplateData.value.length
onMounted(() => {
getTemplateList(true)
columnHeights.value = Array(6).fill(0)
})
useInfiniteScroll(
templateBottomEl,
() => {
if (!canLoadMore.value) return
loadingMoreTemplate.value = true
if (canLoadMore.value) {
setTimeout(() => {
templatePageSize.value += 10
}, 1000)
}
loadingMoreTemplate.value = false
},
{ distance: 10 },
)
async function getTemplateList(refresh = false) {
if (templateIsLoading.value) return
templateIsLoading.value = true
onMounted(() => {
getTemplateList()
})
try {
const res = await fetchDigitalHumanTemplateStatusList<DigitalTemplate[]>(
checkedClassifyValue.value,
pagingInfo.value,
)
if (res.code !== 0) return
templateList.value = refresh ? res.data : [...templateList.value, ...res.data]
const positions = await calculatePositions(templateList.value)
async function getTemplateList() {
const res = await fetchDigitalHumanTemplateStatusList<DigitalTemplate[]>({
pagingInfo: { pageNo: 1, pageSize: 1000 },
newTemplateList.value = templateList.value.map((template, index) => ({
...template,
position: positions[index],
}))
pagingInfo.value = res.pagingInfo as PagingInfo
} finally {
templateIsLoading.value = false
}
}
async function calculatePositions(templates: any[]) {
const columnHeights = Array(6).fill(0)
const positions: { top: any; left: number; height: unknown }[] = []
const heightPromises = templates.map(async (template) => {
return await calculateImageHeight(template)
})
if (res.code === 0) {
templateList.value = res.data
const imgHeights = await Promise.all(heightPromises)
imgHeights.forEach((imgHeight) => {
const minColumnIndex = getMinColoumHeight(columnHeights)
const itemTop = columnHeights[minColumnIndex]
let itemLeft = minColumnIndex * 170
if (itemLeft !== 0) itemLeft += 20
if (itemLeft === 360) itemLeft += 20
if (itemLeft === 530) itemLeft += 40
if (itemLeft === 700) itemLeft += 60
if (itemLeft === 870) itemLeft += 80
columnHeights[minColumnIndex] += imgHeight + 20
waterfallHeight.value = Math.max(...columnHeights)
positions.push({ top: itemTop, left: itemLeft, height: imgHeight })
})
return positions
}
function calculateImageHeight(template: { coverUrl: string }): Promise<number> {
return new Promise((resolve) => {
const img = new Image()
img.src = template.coverUrl
img.onload = () => {
const naturalWidth = img.naturalWidth
const naturalHeight = img.naturalHeight
const renderWidth = 170
const renderHeight = (naturalHeight / naturalWidth) * renderWidth
resolve(renderHeight)
}
})
}
function handleOpenPreviewModal(template: DigitalTemplate) {
if (template) {
selectedTemplate.value = { ...template }
previewModalVisible.value = true
}
}
function handleOpenModal(template: DigitalTemplate) {
selectedTemplate.value = { ...template }
PreviewModalVisible.value = true
function getMinColoumHeight(arr: number[]) {
let min = Math.min(...arr)
return arr.indexOf(min)
}
function handleToCreation(templateId: number) {
function handleToCreation(template: DigitalTemplate) {
router.push({
name: 'Creation',
query: { templateId },
query: { templateId: template.id },
})
}
</script>
<template>
<div class="mt-[16px] min-h-full min-w-[1160px] overscroll-none rounded-[16px] bg-white px-[24px] pb-[16px]">
<div class="sticky top-0 z-10 bg-white pt-[24px]">
<div class="mb-[24px] cursor-default text-[18px] text-[#000]">推薦模板</div>
<div class="mx-auto mt-[16px] overscroll-contain rounded-t-[16px] bg-white">
<div class="sticky top-0 z-10 rounded-t-[16px] bg-white px-[24px] pb-[16px] pt-[24px]">
<div class="mb-[24px] cursor-default text-[18px] text-[#000]">推薦模闆</div>
<div class="pb-[16px]">
<n-radio-group v-model:value="checkedClassifyValue">
<n-radio-button
......@@ -96,63 +176,72 @@ function handleToCreation(templateId: number) {
</n-radio-group>
</div>
</div>
<div class="columns-6 gap-5">
<n-card
v-for="item in displayedData"
:key="item.id"
class="mb-[20px] w-[170px] overflow-hidden"
@mouseenter="isHoverTemplate[item.id] = true"
@mouseleave="isHoverTemplate[item.id] = false"
<div
ref="templateListEl"
class="h-screen w-full overflow-y-scroll bg-white px-[24px] pb-[16px]"
style="scrollbar-width: none"
>
<div
v-show="pagingInfo.totalPages !== 0"
class="page-main relative h-auto min-h-[900px] w-full"
:style="{ height: waterfallHeight + 'px' }"
>
<template #cover>
<div class="relative flex items-center justify-center bg-[#f0f0f0]">
<img
v-if="!isHoverTemplate[item.id]"
:src="item.coverUrl"
class="hover:scale-104 inset-0 w-full cursor-pointer object-cover transition-transform duration-300 ease-in-out"
@click="handleOpenModal(item)"
/>
<video
v-else
:src="item.demonstrationVideoUrl"
class="hover:scale-104 inset-0 w-full cursor-pointer object-cover transition-transform duration-300 ease-in-out"
autoplay
muted
:poster="item.coverUrl"
@click="handleOpenModal(item)"
></video>
<div
class="overlay pointer-events-none absolute hidden h-full w-full cursor-pointer bg-[#000000]/[.1]"
></div>
<div
class="overlay absolute bottom-2 left-2 right-2 hidden h-8 cursor-pointer rounded-[6px] border border-gray-300 bg-white/90 px-2 text-center text-[14px] leading-[30px] text-[#000000]"
@click="handleToCreation(item.id)"
>
做同款
</div>
</div>
</template>
</n-card>
<div ref="templateBottomEl" class="h-[50px]"></div>
</div>
<div v-if="!canLoadMore" class="mt-[80px] flex justify-center text-center text-[14px] text-[#a9b4cc]">
<div class="relative top-[10px] h-[1px] w-[14px] bg-[#a9b4cc]"></div>
<div class="mb-[8px] w-[80px]">已经到底啦</div>
<div class="relative top-[10px] h-[1px] w-[14px] bg-[#a9b4cc]"></div>
<div
v-for="item in newTemplateList"
:key="item.id"
ref="cardItems"
:style="{ position: 'absolute', top: item.position.top + 'px', left: item.position.left + 'px' }"
>
<n-card class="mb-[20px] box-content w-[170px] overflow-hidden">
<template #cover>
<div class="relative flex h-auto w-[170px] items-center justify-center overflow-hidden bg-[#f0f0f0]">
<img
ref="cardItemsImg"
:src="item.coverUrl"
class="duration-400 h-auto w-full transform cursor-pointer object-cover transition-transform ease-in-out"
@click="handleOpenPreviewModal(item)"
/>
<div
class="overlay pointer-events-none absolute hidden h-full w-[100%] transform cursor-pointer bg-[#000000]/[.1]"
>
<img
:src="item.demonstrationGifUrl"
class="duration-400 hover:scale-104 absolute bottom-0 right-0 h-auto w-[50px]"
/>
</div>
<div
class="overlay duration-400 absolute bottom-2 left-2 right-2 hidden h-8 transform cursor-pointer rounded-[6px] border bg-white/90 px-2 text-center text-[14px] leading-[30px] text-[#000000]"
@click="handleToCreation(item)"
>
做同款
</div>
</div>
</template>
</n-card>
</div>
</div>
<div class="flex justify-center">
<n-spin v-show="templateIsLoading" size="large" />
</div>
<div
v-show="pagingInfo.pageNo === pagingInfo.totalPages || pagingInfo.totalPages === 0"
class="mt-[20px] flex justify-center text-center text-[14px] text-[#a9b4cc]"
>
<div class="relative top-[10px] h-[1px] w-[14px] bg-[#a9b4cc]"></div>
<div class="mb-[8px] w-[80px]">已經到底啦</div>
<div class="relative top-[10px] h-[1px] w-[14px] bg-[#a9b4cc]"></div>
</div>
</div>
<TemplatePreviewModal
v-model="PreviewModalVisible"
v-model="previewModalVisible"
:selected-template="selectedTemplate!"
@go-to-create="handleToCreation"
/>
</div>
</template>
<style lang="scss" scoped>
.n-card {
width: 170px !important;
max-width: 170px;
&:hover {
......
src/views/workbench/components/template-preview-modal.vue
View file @ e70dc362
......@@ -7,15 +7,15 @@ const props = defineProps<{
selectedTemplate: DigitalTemplate
}>()
const emit = defineEmits<{
(event: 'go-to-create', id: number): void
(event: 'go-to-create', template: DigitalTemplate): void
}>()
function handlePreviewModalClose() {
PreviewModalVisible.value = false
}
function handleGoToCreate(this: any) {
emit('go-to-create', props.selectedTemplate.id)
function handleToCreate(this: any) {
emit('go-to-create', props.selectedTemplate as DigitalTemplate)
}
</script>
<template>
......@@ -33,8 +33,8 @@ function handleGoToCreate(this: any) {
:src="props.selectedTemplate.demonstrationVideoUrl"
:poster="props.selectedTemplate.coverUrl"
class="h-[448px] w-[752px]"
autoplay
controls
autoplay
></video>
</div>
</div>
......@@ -47,7 +47,7 @@ function handleGoToCreate(this: any) {
</button>
<button
class="!box-content !h-[38px] !w-[74px] cursor-pointer rounded-[6px] border-[1px] border-solid border-[#dde3f0] bg-gradient-to-r from-[#30b5f2] to-[#2468f2] px-[10px] text-[#ffffff] transition-all duration-300 hover:from-[#30b5f2] hover:to-[#528eff]"
@click="handleGoToCreate"
@click="handleToCreate"
>
做同款
</button>
......
src/views/workbench/templateData.ts deleted 100644 → 0
View file @ ba060a3f
export const templateData = [
{
id: 1,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/91eacc90-a5cc-444b-997c-d33afdcada8f/a975c86f-cb3c-4cec-9bcc-4bb6453143cf/%E7%81%BF%E7%83%82%E7%83%9F%E7%81%AB-%E6%A8%AA%E7%89%88%E6%88%AA%E5%9B%BE.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/e571a3ab-16c9-47a9-b26f-379637016aee/%E7%81%BF%E7%83%82%E7%83%9F%E7%81%AB-%E6%A8%AA%E7%89%883.mp4',
},
{
id: 2,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T16:53:29.223639/sd-qdmv5bsghiyx1xb9z_1713344008761.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/e93217f7-5f3d-4714-9dcf-15bc9d9e188c/%E5%8C%BB%E7%96%971-2.mp4',
},
{
id: 3,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T17:19:00.569068/sd-qdpsxhut0f26n9j0u_1713345540103.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/eb497bd4-2cdf-417a-8f64-6f5473686514/%E5%8C%BB%E7%96%973-2.mp4',
},
{
id: 4,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-03-26T18:48:42.563011/sd-qcxmghd4uzgv76c37_1711450122138.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/a656784a-06f2-43c6-8bd5-b728351dfc6c/e9fe8ee2-afe9-4721-b8b5-c052427604ee/%E7%AB%96%E7%89%88-%E6%98%A5%E6%97%A5%E5%92%8C%E9%A3%8E-1848.mp4',
},
{
id: 5,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T17:28:05.392432/sd-qdpsq815b5hv4txda_1713346084825.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/0c16cea8-38cd-4a09-9690-2501ec95207f/%E6%95%99%E8%82%B22-2.mp4',
},
{
id: 6,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-test.cdn.bcebos.com/2023-11-30T17:31:49.039103/sd-pk4qin0yjf6s044tp_1701336704352.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/23de158d-0571-4d28-98f7-3d45c0877f14/3cbffb6d-ad05-4525-a87a-f879d2f84f66/%E6%96%B0%E9%97%BB%E8%B5%84%E8%AE%AF1%3A1%E6%9C%BA%E4%BD%8Dh.mp4',
},
{
id: 7,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-test.cdn.bcebos.com/2023-11-30T17:25:25.255057/sd-pk4kf0wfs7wjz66m5_1701336320817.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/23de158d-0571-4d28-98f7-3d45c0877f14/ac72d0c1-6dcf-4579-9c84-e829eaeac87e/%E8%A7%86%E9%A2%91%E4%BF%9D%E5%8D%951%EF%BC%9A1%E6%9C%BA%E4%BD%8Dh.mp4',
},
{
id: 8,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/91eacc90-a5cc-444b-997c-d33afdcada8f/a975c86f-cb3c-4cec-9bcc-4bb6453143cf/%E7%81%BF%E7%83%82%E7%83%9F%E7%81%AB-%E6%A8%AA%E7%89%88%E6%88%AA%E5%9B%BE.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/e571a3ab-16c9-47a9-b26f-379637016aee/%E7%81%BF%E7%83%82%E7%83%9F%E7%81%AB-%E6%A8%AA%E7%89%883.mp4',
},
{
id: 9,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T17:19:00.569068/sd-qdpsxhut0f26n9j0u_1713345540103.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/eb497bd4-2cdf-417a-8f64-6f5473686514/%E5%8C%BB%E7%96%973-2.mp4',
},
{
id: 10,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/91eacc90-a5cc-444b-997c-d33afdcada8f/a975c86f-cb3c-4cec-9bcc-4bb6453143cf/%E7%81%BF%E7%83%82%E7%83%9F%E7%81%AB-%E6%A8%AA%E7%89%88%E6%88%AA%E5%9B%BE.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/e571a3ab-16c9-47a9-b26f-379637016aee/%E7%81%BF%E7%83%82%E7%83%9F%E7%81%AB-%E6%A8%AA%E7%89%883.mp4',
},
{
id: 11,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/91eacc90-a5cc-444b-997c-d33afdcada8f/a975c86f-cb3c-4cec-9bcc-4bb6453143cf/%E7%81%BF%E7%83%82%E7%83%9F%E7%81%AB-%E6%A8%AA%E7%89%88%E6%88%AA%E5%9B%BE.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/e571a3ab-16c9-47a9-b26f-379637016aee/%E7%81%BF%E7%83%82%E7%83%9F%E7%81%AB-%E6%A8%AA%E7%89%883.mp4',
},
{
id: 12,
templateType: 'Shakermaker',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T16:53:29.223639/sd-qdmv5bsghiyx1xb9z_1713344008761.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/e93217f7-5f3d-4714-9dcf-15bc9d9e188c/%E5%8C%BB%E7%96%971-2.mp4',
},
{
id: 13,
templateType: 'Shakermaker',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T17:19:00.569068/sd-qdpsxhut0f26n9j0u_1713345540103.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/eb497bd4-2cdf-417a-8f64-6f5473686514/%E5%8C%BB%E7%96%973-2.mp4',
},
{
id: 14,
templateType: 'Shakermaker',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-03-26T18:48:42.563011/sd-qcxmghd4uzgv76c37_1711450122138.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/a656784a-06f2-43c6-8bd5-b728351dfc6c/e9fe8ee2-afe9-4721-b8b5-c052427604ee/%E7%AB%96%E7%89%88-%E6%98%A5%E6%97%A5%E5%92%8C%E9%A3%8E-1848.mp4',
},
{
id: 15,
templateType: 'Shakermaker',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T17:28:05.392432/sd-qdpsq815b5hv4txda_1713346084825.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/0c16cea8-38cd-4a09-9690-2501ec95207f/%E6%95%99%E8%82%B22-2.mp4',
},
{
id: 16,
templateType: 'Shakermaker',
imageUrl:
'https://meta-human-editor-test.cdn.bcebos.com/2023-11-30T17:25:25.255057/sd-pk4kf0wfs7wjz66m5_1701336320817.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/23de158d-0571-4d28-98f7-3d45c0877f14/ac72d0c1-6dcf-4579-9c84-e829eaeac87e/%E8%A7%86%E9%A2%91%E4%BF%9D%E5%8D%951%EF%BC%9A1%E6%9C%BA%E4%BD%8Dh.mp4',
},
{
id: 17,
templateType: 'NewsInformatio',
imageUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/ecf7e7e4-1a13-452b-b8a9-c8df672fc1aa/598a.jpg?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/80048694-e745-48b2-a67d-dc2cf594a755/%E8%8F%B1%E4%BA%91%E7%BA%B3%E7%A6%8F-%E6%A8%AA%E7%89%88.mp4',
},
{
id: 18,
templateType: 'NewsInformatio',
imageUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/a38caa87-e777-4612-9084-7c4f9c5dcf02/e787c471.jpeg?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/4621bd4d-99e2-4cb4-8667-42b40994e1cc/%E6%AC%A2%E5%96%9C%E9%87%91%E9%BE%99-%E6%A8%AA%E7%89%881.mp4',
},
{
id: 19,
templateType: 'NewsInformatio',
imageUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/a38caa87-e777-4612-9084-7c4f9c5dcf02/e787c471.jpeg?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/4621bd4d-99e2-4cb4-8667-42b40994e1cc/%E6%AC%A2%E5%96%9C%E9%87%91%E9%BE%99-%E6%A8%AA%E7%89%881.mp4',
},
{
id: 20,
templateType: 'NewsInformatio',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/91eacc90-a5cc-444b-997c-d33afdcada8f/f7e73d16-79f9-455e-89a5-761c2cb24aff/%E7%81%B5%E5%8A%A8%E6%97%B6%E9%92%9F-%E7%AB%96%E7%89%88%E6%88%AA%E5%9B%BE.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/fffef1d5-4adc-44eb-bd2f-f5e71413c9ab/%E7%81%B5%E5%8A%A8%E6%97%B6%E9%92%9F-%E7%AB%96%E7%89%884.mp4',
},
{
id: 21,
templateType: 'BusinessCard',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/91eacc90-a5cc-444b-997c-d33afdcada8f/f7e73d16-79f9-455e-89a5-761c2cb24aff/%E7%81%B5%E5%8A%A8%E6%97%B6%E9%92%9F-%E7%AB%96%E7%89%88%E6%88%AA%E5%9B%BE.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/fffef1d5-4adc-44eb-bd2f-f5e71413c9ab/%E7%81%B5%E5%8A%A8%E6%97%B6%E9%92%9F-%E7%AB%96%E7%89%884.mp4',
},
{
id: 22,
templateType: 'BusinessCard',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T16:53:29.223639/sd-qdmv5bsghiyx1xb9z_1713344008761.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/e93217f7-5f3d-4714-9dcf-15bc9d9e188c/%E5%8C%BB%E7%96%971-2.mp4',
},
{
id: 23,
templateType: 'BusinessCard',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T17:19:00.569068/sd-qdpsxhut0f26n9j0u_1713345540103.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/eb497bd4-2cdf-417a-8f64-6f5473686514/%E5%8C%BB%E7%96%973-2.mp4',
},
{
id: 24,
templateType: 'Health',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-03-26T18:48:42.563011/sd-qcxmghd4uzgv76c37_1711450122138.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/a656784a-06f2-43c6-8bd5-b728351dfc6c/e9fe8ee2-afe9-4721-b8b5-c052427604ee/%E7%AB%96%E7%89%88-%E6%98%A5%E6%97%A5%E5%92%8C%E9%A3%8E-1848.mp4',
},
{
id: 25,
templateType: 'Health',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T17:28:05.392432/sd-qdpsq815b5hv4txda_1713346084825.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/0c16cea8-38cd-4a09-9690-2501ec95207f/%E6%95%99%E8%82%B22-2.mp4',
},
{
id: 26,
templateType: 'Education',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T16:53:29.223639/sd-qdmv5bsghiyx1xb9z_1713344008761.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/e93217f7-5f3d-4714-9dcf-15bc9d9e188c/%E5%8C%BB%E7%96%971-2.mp4',
},
{
id: 27,
templateType: 'Education',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T17:19:00.569068/sd-qdpsxhut0f26n9j0u_1713345540103.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/eb497bd4-2cdf-417a-8f64-6f5473686514/%E5%8C%BB%E7%96%973-2.mp4',
},
{
id: 28,
templateType: 'Education',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-03-26T18:48:42.563011/sd-qcxmghd4uzgv76c37_1711450122138.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/a656784a-06f2-43c6-8bd5-b728351dfc6c/e9fe8ee2-afe9-4721-b8b5-c052427604ee/%E7%AB%96%E7%89%88-%E6%98%A5%E6%97%A5%E5%92%8C%E9%A3%8E-1848.mp4',
},
{
id: 29,
templateType: 'Invite',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/2024-04-17T17:28:05.392432/sd-qdpsq815b5hv4txda_1713346084825.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/dac107cac20e479db66a7824903597a0/0c16cea8-38cd-4a09-9690-2501ec95207f/%E6%95%99%E8%82%B22-2.mp4',
},
{
id: 32,
templateType: 'Trending',
imageUrl:
'https://meta-human-editor-prd.cdn.bcebos.com/91eacc90-a5cc-444b-997c-d33afdcada8f/f7e73d16-79f9-455e-89a5-761c2cb24aff/%E7%81%B5%E5%8A%A8%E6%97%B6%E9%92%9F-%E7%AB%96%E7%89%88%E6%88%AA%E5%9B%BE.png?x-bce-process=image/format,f_auto/resize,w_500/quality,q_90',
videoUrl:
'https://meta-human-editor-test.cdn.bcebos.com/cea9a767-e17f-4cea-b160-152d0374bb26/fffef1d5-4adc-44eb-bd2f-f5e71413c9ab/%E7%81%B5%E5%8A%A8%E6%97%B6%E9%92%9F-%E7%AB%96%E7%89%884.mp4',
},
] as const
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