feat(projects): new layout,tab and add update theme settings

This commit is contained in:
Soybean
2023-03-13 20:49:33 +08:00
parent 488e6e3204
commit 912c3531c5
30 changed files with 386 additions and 93 deletions

View File

@ -1,27 +1,27 @@
<template>
<n-grid :x-gap="16" :y-gap="16" :item-responsive="true">
<n-grid-item span="0:24 640:24 1024:16">
<n-grid-item span="0:24 640:24 1024:6">
<n-card :bordered="false" class="rounded-16px shadow-sm">
<div class="flex w-full h-360px">
<div class="w-200px h-full py-12px">
<h3 class="text-16px text-custom font-bold">Dashboard</h3>
<p class="text-[#aaa]">Overview Of Lasted Month</p>
<h3 class="pt-36px text-24px font-bold">
<count-to prefix="$" :start-value="0" :end-value="7754" />
</h3>
<p class="text-[#aaa]">Current Month Earnings</p>
<h3 class="pt-36px text-24px font-bold">
<count-to :start-value="0" :end-value="1234" />
</h3>
<p class="text-[#aaa]">Current Month Sales</p>
<n-button class="mt-24px" type="primary">Last Month Summary</n-button>
</div>
<div class="flex-1-hidden h-full">
<div ref="lineRef" class="wh-full"></div>
</div>
<div class="w-full h-360px py-12px">
<h3 class="text-16px font-bold">Dashboard</h3>
<p class="text-[#aaa]">Overview Of Lasted Month</p>
<h3 class="pt-32px text-24px font-bold">
<count-to prefix="$" :start-value="0" :end-value="7754" />
</h3>
<p class="text-[#aaa]">Current Month Earnings</p>
<h3 class="pt-32px text-24px font-bold">
<count-to :start-value="0" :end-value="1234" />
</h3>
<p class="text-[#aaa]">Current Month Sales</p>
<n-button class="mt-24px whitespace-pre-wrap" type="primary">Last Month Summary</n-button>
</div>
</n-card>
</n-grid-item>
<n-grid-item span="0:24 640:24 1024:10">
<n-card :bordered="false" class="rounded-16px shadow-sm">
<div ref="lineRef" class="w-full h-360px"></div>
</n-card>
</n-grid-item>
<n-grid-item span="0:24 640:24 1024:8">
<n-card :bordered="false" class="rounded-16px shadow-sm">
<div ref="pieRef" class="w-full h-360px"></div>

View File

@ -1,6 +1,6 @@
<template>
<div
class="flex-col-center p-12px border-1px border-[#efeff5] dark:border-[#ffffff17] rounded-4px hover:shadow-sm cursor-pointer"
class="flex-col-center h-120px p-12px border-1px border-[#efeff5] dark:border-[#ffffff17] rounded-4px hover:shadow-sm cursor-pointer"
>
<svg-icon :icon="icon" :style="{ color: iconColor }" class="text-30px" />
<p class="py-8px text-16px">{{ label }}</p>

View File

@ -1,6 +1,6 @@
<template>
<div
class="p-4px border-1px border-[#efeff5] dark:border-[#ffffff17] rounded-4px hover:shadow-sm cursor-pointer"
class="h-120px p-4px border-1px border-[#efeff5] dark:border-[#ffffff17] rounded-4px hover:shadow-sm cursor-pointer"
@click="handleOpenSite"
>
<header class="flex-y-center">

View File

@ -37,7 +37,9 @@
</n-grid>
</n-card>
<n-card title="创意" :bordered="false" size="small" class="shadow-sm rounded-16px">
<icon-local-banner class="text-400px text-primary" />
<div class="flex-center h-380px">
<icon-local-banner class="text-400px sm:text-320px text-primary" />
</div>
</n-card>
</n-space>
</n-grid-item>

View File

@ -1,7 +1,7 @@
<template>
<div class="h-full">
<n-card title="视频播放器插件" class="h-full shadow-sm rounded-16px">
<div ref="domRef"></div>
<div ref="domRef" class=""></div>
</n-card>
</div>
</template>
@ -19,7 +19,8 @@ function renderXgPlayer() {
player.value = new Player({
el: domRef.value,
url,
playbackRate: [0.5, 0.75, 1, 1.5, 2]
playbackRate: [0.5, 0.75, 1, 1.5, 2],
fluid: true
});
}
function destroyXgPlayer() {