style(projects): per style [完善样式]

This commit is contained in:
Soybean
2023-03-15 09:01:06 +08:00
parent b549b32cbb
commit 209ef3d890
33 changed files with 113 additions and 124 deletions

View File

@ -1,6 +1,6 @@
<template>
<n-space :vertical="true">
<n-divider class="!mb-0 text-14px text-[#666]">其他账户登录</n-divider>
<n-divider class="!mb-0 text-14px text-#666">其他账户登录</n-divider>
<n-space justify="center">
<n-button
v-for="item in accounts"

View File

@ -1,9 +1,9 @@
<template>
<n-space :vertical="true">
<n-divider class="!mb-0 text-14px text-[#666]">其他登录方式</n-divider>
<n-divider class="!mb-0 text-14px text-#666">其他登录方式</n-divider>
<div class="flex-center">
<n-button :text="true">
<icon-mdi-wechat class="text-22px text-[#888] hover:text-[#52BF5E]" />
<icon-mdi-wechat class="text-22px text-#888 hover:text-#52BF5E" />
</n-button>
</div>
</n-space>

View File

@ -1,5 +1,5 @@
<template>
<div>
<div class="h-full overflow-hidden">
<n-card title="表格" class="h-full shadow-sm rounded-16px">
<n-space :vertical="true">
<n-space>

View File

@ -1,14 +1,14 @@
<template>
<n-grid :x-gap="16" :y-gap="16" :item-responsive="true">
<n-grid-item span="0:24 640:24 1024:8">
<n-card title="时间线" :bordered="false" class="rounded-16px shadow-sm">
<n-card title="时间线" :bordered="false" class="h-full rounded-16px shadow-sm">
<n-timeline>
<n-timeline-item v-for="item in timelines" :key="item.type" v-bind="item" />
</n-timeline>
</n-card>
</n-grid-item>
<n-grid-item span="0:24 640:24 1024:16">
<n-card title="表格" :bordered="false" class="rounded-16px shadow-sm">
<n-card title="表格" :bordered="false" class="h-full rounded-16px shadow-sm">
<n-data-table size="small" :columns="columns" :data="tableData" />
</n-card>
</n-grid-item>

View File

@ -4,15 +4,15 @@
<n-card :bordered="false" class="rounded-16px shadow-sm">
<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>
<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>
<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>
<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>

View File

@ -5,7 +5,7 @@
<icon-local-avatar class="text-70px" />
<div class="pl-12px">
<h3 class="text-18px font-semibold">早安{{ auth.userInfo.userName }}, 今天又是充满活力的一天</h3>
<p class="leading-30px text-[#999]">今日多云转晴20 - 25</p>
<p class="leading-30px text-#999">今日多云转晴20 - 25</p>
</div>
</div>
<n-space :size="24" :wrap="false">

View File

@ -1,6 +1,6 @@
<template>
<div
class="flex-col-center h-120px 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,13 +1,13 @@
<template>
<div
class="h-120px 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">
<svg-icon :icon="icon" :style="{ color: iconColor }" class="text-30px" />
<h3 class="pl-12px text-18px font-semibold">{{ name }}</h3>
</header>
<p class="py-8px h-56px text-[#999]">{{ description }}</p>
<p class="py-8px h-56px text-#999">{{ description }}</p>
<div class="flex justify-end">
<span>{{ author }}</span>
</div>

View File

@ -1,31 +1,33 @@
<template>
<n-card title="用户管理" :bordered="false" class="rounded-16px shadow-sm">
<n-space class="pb-12px" justify="space-between">
<n-space>
<n-button type="primary" @click="handleAddTable">
<icon-ic-round-plus class="mr-4px text-20px" />
新增
</n-button>
<n-button type="error">
<icon-ic-round-delete class="mr-4px text-20px" />
删除
</n-button>
<n-button type="success">
<icon-uil:export class="mr-4px text-20px" />
导出Excel
</n-button>
<div class="h-full overflow-hidden">
<n-card title="用户管理" :bordered="false" class="rounded-16px shadow-sm">
<n-space class="pb-12px" justify="space-between">
<n-space>
<n-button type="primary" @click="handleAddTable">
<icon-ic-round-plus class="mr-4px text-20px" />
新增
</n-button>
<n-button type="error">
<icon-ic-round-delete class="mr-4px text-20px" />
删除
</n-button>
<n-button type="success">
<icon-uil:export class="mr-4px text-20px" />
导出Excel
</n-button>
</n-space>
<n-space align="center" :size="18">
<n-button size="small" type="primary" @click="getTableData">
<icon-mdi-refresh class="mr-4px text-16px" :class="{ 'animate-spin': loading }" />
刷新表格
</n-button>
<column-setting v-model:columns="columns" />
</n-space>
</n-space>
<n-space align="center" :size="18">
<n-button size="small" type="primary" @click="getTableData">
<icon-mdi-refresh class="mr-4px text-16px" :class="{ 'animate-spin': loading }" />
刷新表格
</n-button>
<column-setting v-model:columns="columns" />
</n-space>
</n-space>
<n-data-table :columns="columns" :data="tableData" :loading="loading" :pagination="pagination" />
<table-action-modal v-model:visible="visible" :type="modalType" :edit-data="editData" />
</n-card>
<n-data-table :columns="columns" :data="tableData" :loading="loading" :pagination="pagination" />
<table-action-modal v-model:visible="visible" :type="modalType" :edit-data="editData" />
</n-card>
</div>
</template>
<script setup lang="tsx">

View File

@ -11,7 +11,7 @@
<h3 class="py-24px text-24px font-bold">{{ item.label }}</h3>
<swiper v-bind="item.options">
<swiper-slide v-for="i in 5" :key="i">
<div class="flex-center h-240px border-1px border-[#999] text-18px font-bold">Slide{{ i }}</div>
<div class="flex-center h-240px border-1px border-#999 text-18px font-bold">Slide{{ i }}</div>
</swiper-slide>
</swiper>
</div>