xinyin025/soybean-admin
1
0
Fork 0
mirror of https://github.com/soybeanjs/soybean-admin.git synced 2025-09-18 17:46:38 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

style(projects): unify card border radius, 16px to 8px

Browse Source
This commit is contained in:
Soybean 2023-06-20 00:17:18 +08:00
parent 3318041b92
commit cbda4a38a3
32 changed files with 68 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/_builtin/constant-page/index.vue
View File

@ -4,7 +4,7 @@
<router-link :to="{ name: routeHomePath }">
<n-button type="primary">回到首页</n-button>
</router-link>
<n-card :bordered="false" size="small" class="mt-24px rounded-16px shadow-sm">
<n-card :bordered="false" size="small" class="mt-24px rounded-8px shadow-sm">
<div class="flex-center py-12px">
<n-button type="primary" class="mr-24px" :disabled="isMoving" @click="startMove">开始</n-button>
<n-button type="error" @click="endMove">暂停</n-button>

2
src/views/about/components/dev-dependency.vue
View File

@ -1,5 +1,5 @@
<template>
<n-card title="开发环境依赖" :bordered="false" size="small" class="rounded-16px shadow-sm">
<n-card title="开发环境依赖" :bordered="false" size="small" class="rounded-8px shadow-sm">
<n-descriptions label-placement="left" bordered size="small">
<n-descriptions-item v-for="item in devDependencies" :key="item.name" :label="item.name">
{{ item.version }}

2
src/views/about/components/pro-dependency.vue
View File

@ -1,5 +1,5 @@
<template>
<n-card title="生产环境依赖" :bordered="false" size="small" class="rounded-16px shadow-sm">
<n-card title="生产环境依赖" :bordered="false" size="small" class="rounded-8px shadow-sm">
<n-descriptions label-placement="left" bordered size="small">
<n-descriptions-item v-for="item in dependencies" :key="item.name" :label="item.name">
{{ item.version }}

2
src/views/about/components/project-info.vue
View File

@ -1,5 +1,5 @@
<template>
<n-card title="项目信息" :bordered="false" size="small" class="rounded-16px shadow-sm">
<n-card title="项目信息" :bordered="false" size="small" class="rounded-8px shadow-sm">
<n-descriptions label-placement="left" bordered size="small" :column="2">
<n-descriptions-item label="版本">
<n-tag type="primary">{{ version }}</n-tag>

2
src/views/about/components/project-introduction.vue
View File

@ -1,5 +1,5 @@
<template>
<n-card title="关于" :bordered="false" size="large" class="rounded-16px shadow-sm">
<n-card title="关于" :bordered="false" size="large" class="rounded-8px shadow-sm">
<p class="leading-24px">
Soybean Admin 是一个基于 Vue3、Vite、Naive UI、TypeScript
的中后台解决方案，它使用了最新的前端技术栈，并提炼了典型的业务模型，页面，包括二次封装组件、动态菜单、权限校验、粒子化权限控制等功能，它可以帮助你快速搭建企业级中后台项目，相信不管是从新技术使用还是其他方面，都能帮助到你。

2
src/views/auth-demo/permission/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="权限切换" class="h-full shadow-sm rounded-16px">
<n-card title="权限切换" :bordered="false" class="h-full rounded-8px shadow-sm">
<div class="pb-12px">
<n-gradient-text type="primary" :size="20">当前用户的权限：{{ auth.userInfo.userRole }}</n-gradient-text>
</div>

2
src/views/auth-demo/super/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="当前页面只有super才能看到" class="h-full shadow-sm rounded-16px"></n-card>
<n-card title="当前页面只有super才能看到" :bordered="false" class="h-full rounded-8px shadow-sm"></n-card>
</div>
</template>

2
src/views/component/button/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<n-card title="按钮" class="h-full shadow-sm rounded-16px">
<n-card title="按钮" :bordered="false" class="h-full rounded-8px shadow-sm">
<n-grid cols="s:1 m:2" responsive="screen" :x-gap="16" :y-gap="16">
<n-grid-item v-for="item in buttonExample" :key="item.id">
<n-card :title="item.label" class="min-h-180px">

2
src/views/component/card/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<n-card title="卡片" class="h-full shadow-sm rounded-16px">
<n-card title="卡片" :bordered="false" class="h-full rounded-8px shadow-sm">
<n-space :vertical="true">
<n-card title="基本用法">
<p class="pb-16px">基础卡片</p>

2
src/views/component/table/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full overflow-hidden">
<n-card title="表格" class="h-full shadow-sm rounded-16px">
<n-card title="表格" :bordered="false" class="h-full rounded-8px shadow-sm">
<n-space :vertical="true">
<n-space>
<n-button @click="getDataSource">有数据</n-button>

4
src/views/dashboard/analysis/components/bottom-part/index.vue
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="h-full rounded-16px shadow-sm">
<n-card title="时间线" :bordered="false" class="h-full rounded-8px 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="h-full rounded-16px shadow-sm">
<n-card title="表格" :bordered="false" class="h-full rounded-8px shadow-sm">
<n-data-table size="small" :columns="columns" :data="tableData" />
</n-card>
</n-grid-item>

2
src/views/dashboard/analysis/components/data-card/components/gradient-bg.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="p-16px rounded-16px text-white" :style="{ backgroundImage: gradientStyle }">
<div class="p-16px rounded-8px text-white" :style="{ backgroundImage: gradientStyle }">
<slot></slot>
</div>
</template>

2
src/views/dashboard/analysis/components/data-card/index.vue
View File

@ -1,4 +1,5 @@
<template>
<n-card :bordered="false" class="h-full rounded-8px shadow-sm">
<n-grid cols="s:1 m:2 l:4" responsive="screen" :x-gap="16" :y-gap="16">
<n-grid-item v-for="item in cardData" :key="item.id">
<gradient-bg class="h-100px" :start-color="item.colors[0]" :end-color="item.colors[1]">
@ -15,6 +16,7 @@
</gradient-bg>
</n-grid-item>
</n-grid>
</n-card>
</template>
<script setup lang="ts">

6
src/views/dashboard/analysis/components/top-chart/index.vue
View File

@ -1,7 +1,7 @@
<template>
<n-grid :x-gap="16" :y-gap="16" :item-responsive="true">
<n-grid-item span="0:24 640:24 1024:6">
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px 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>
@ -18,12 +18,12 @@
</n-card>
</n-grid-item>
<n-grid-item span="0:24 640:24 1024:10">
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px 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">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="pieRef" class="w-full h-360px"></div>
</n-card>
</n-grid-item>

2
src/views/dashboard/workbench/components/workbench-header/index.vue
View File

@ -1,5 +1,5 @@
<template>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div class="flex-y-center justify-between">
<div class="flex-y-center">
<icon-local-avatar class="text-70px" />

8
src/views/dashboard/workbench/components/workbench-main/index.vue
View File

@ -2,7 +2,7 @@
<n-grid :item-responsive="true" :x-gap="16" :y-gap="16">
<n-grid-item span="0:24 640:24 1024:16">
<n-space :vertical="true" :size="16">
<n-card title="项目主要技术栈" :bordered="false" size="small" class="shadow-sm rounded-16px">
<n-card title="项目主要技术栈" :bordered="false" size="small" class="rounded-8px shadow-sm">
<template #header-extra>
<a class="text-primary" href="javascript:;">更多技术栈</a>
</template>
@ -12,7 +12,7 @@
</n-grid-item>
</n-grid>
</n-card>
<n-card title="动态" :bordered="false" size="small" class="shadow-sm rounded-16px">
<n-card title="动态" :bordered="false" size="small" class="rounded-8px shadow-sm">
<template #header-extra>
<a class="text-primary" href="javascript:;">更多动态</a>
</template>
@ -29,14 +29,14 @@
</n-grid-item>
<n-grid-item span="0:24 640:24 1024:8">
<n-space :vertical="true" :size="16">
<n-card title="快捷操作" :bordered="false" size="small" class="shadow-sm rounded-16px">
<n-card title="快捷操作" :bordered="false" size="small" class="rounded-8px shadow-sm">
<n-grid :item-responsive="true" responsive="screen" cols="m:2 l:3" :x-gap="8" :y-gap="8">
<n-grid-item v-for="item in shortcuts" :key="item.id">
<shortcuts-card v-bind="item" />
</n-grid-item>
</n-grid>
</n-card>
<n-card title="创意" :bordered="false" size="small" class="shadow-sm rounded-16px">
<n-card title="创意" :bordered="false" size="small" class="rounded-8px shadow-sm">
<div class="flex-center h-380px">
<icon-local-banner class="text-400px sm:text-320px text-primary" />
</div>

2
src/views/function/tab-detail/index.vue
View File

@ -1,6 +1,6 @@
<template>
<n-space :vertical="true" :size="16">
<n-card title="Tab Detail" :bordered="false" size="small" class="shadow-sm rounded-16px">
<n-card title="Tab Detail" :bordered="false" size="small" class="rounded-8px shadow-sm">
<n-space :vertical="true" :size="12">
<div>当前路由的描述数据(meta)：</div>
<div>{{ route.meta }}</div>

2
src/views/function/tab-multi-detail/index.vue
View File

@ -1,6 +1,6 @@
<template>
<n-space :vertical="true" :size="16">
<n-card title="Tab Detail" :bordered="false" size="small" class="shadow-sm rounded-16px">
<n-card title="Tab Detail" :bordered="false" size="small" class="rounded-8px shadow-sm">
<n-space :vertical="true" :size="12">
<div>当前路由的描述数据(meta)：</div>
<div>{{ route.meta }}</div>

2
src/views/function/tab/index.vue
View File

@ -1,6 +1,6 @@
<template>
<n-space :vertical="true" :size="16">
<n-card title="Tab Home" :bordered="false" size="small" class="shadow-sm rounded-16px">
<n-card title="Tab Home" :bordered="false" size="small" class="rounded-8px shadow-sm">
<n-space :vertical="true" :size="12">
<n-button @click="handleToTabDetail">跳转Tab Detail</n-button>
<n-button @click="handleToTabMultiDetail(1)">跳转Tab Multi Detail 1</n-button>

2
src/views/management/user/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full overflow-hidden">
<n-card title="用户管理" :bordered="false" class="rounded-16px shadow-sm">
<n-card title="用户管理" :bordered="false" class="rounded-8px shadow-sm">
<n-space class="pb-12px" justify="space-between">
<n-space>
<n-button type="primary" @click="handleAddTable">

2
src/views/multi-menu/first/second-new/third/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="多级菜单 - 三级菜单" class="h-full shadow-sm rounded-16px"></n-card>
<n-card title="多级菜单 - 三级菜单" :bordered="false" class="h-full rounded-8px shadow-sm"></n-card>
</div>
</template>

2
src/views/multi-menu/first/second/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="多级菜单 - 二级菜单" class="h-full shadow-sm rounded-16px"></n-card>
<n-card title="多级菜单 - 二级菜单" :bordered="false" class="h-full rounded-8px shadow-sm"></n-card>
</div>
</template>

12
src/views/plugin/charts/antv/index.vue
View File

@ -1,21 +1,21 @@
<template>
<n-space :vertical="true" :size="16">
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="pieRef" class="h-400px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="lineRef" class="h-400px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="barRef" class="h-400px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="scatterRef" class="h-400px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="areaRef" class="h-400px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="radarRef" class="h-400px"></div>
</n-card>
</n-space>

14
src/views/plugin/charts/echarts/index.vue
View File

@ -1,24 +1,24 @@
<template>
<n-space :vertical="true" :size="16">
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="pieRef" class="h-400px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="lineRef" class="h-400px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="barRef" class="h-400px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="pictorialBarRef" class="h-600px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="scatterRef" class="h-600px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="radarRef" class="h-400px"></div>
</n-card>
<n-card :bordered="false" class="rounded-16px shadow-sm">
<n-card :bordered="false" class="rounded-8px shadow-sm">
<div ref="gaugeRef" class="h-640px"></div>
</n-card>
</n-space>

2
src/views/plugin/copy/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="文本复制" class="h-full shadow-sm rounded-16px">
<n-card title="文本复制" :bordered="false" class="h-full rounded-8px shadow-sm">
<n-input-group>
<n-input v-model:value="source" placeholder="请输入要复制的内容吧" />
<n-button type="primary" @click="handleCopy">复制</n-button>

2
src/views/plugin/editor/markdown/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="markdown插件" class="shadow-sm rounded-16px">
<n-card title="markdown插件" :bordered="false" class="rounded-8px shadow-sm">
<div ref="domRef"></div>
<template #footer>
<github-link link="https://github.com/Vanessa219/vditor" />

2
src/views/plugin/editor/quill/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="富文本插件" class="shadow-sm rounded-16px">
<n-card title="富文本插件" :bordered="false" class="rounded-8px shadow-sm">
<div ref="domRef" class="bg-white dark:bg-dark"></div>
<template #footer>
<github-link link="https://github.com/wangeditor-team/wangEditor" />

4
src/views/plugin/icon/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="Icon组件示例" class="shadow-sm rounded-16px">
<n-card title="Icon组件示例" :bordered="false" class="rounded-8px shadow-sm">
<div class="grid grid-cols-10">
<template v-for="item in icons" :key="item">
<div class="mt-5px flex-x-center">
@ -16,7 +16,7 @@
<web-site-link label="iconify地址：" link="https://icones.js.org/" class="mt-10px" />
</template>
</n-card>
<n-card title="自定义图标示例" class="mt-10px shadow-sm rounded-16px">
<n-card title="自定义图标示例" :bordered="false" class="mt-10px rounded-8px shadow-sm">
<div class="pb-12px text-16px">
在src/assets/svg-icon文件夹下的svg文件，通过在template里面以 icon-local-{文件名} 直接渲染,
其中icon-local为.env文件里的 VITE_ICON_LOCAL_PREFFIX

2
src/views/plugin/map/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="地图插件" class="h-full shadow-sm rounded-16px" content-style="overflow:hidden">
<n-card title="地图插件" :bordered="false" class="h-full rounded-8px shadow-sm" content-style="overflow:hidden">
<n-tabs type="line" class="flex-col-stretch h-full" pane-class="flex-1-hidden">
<n-tab-pane v-for="item in maps" :key="item.id" :name="item.id" :tab="item.label">
<component :is="item.component" />

2
src/views/plugin/print/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="打印" class="shadow-sm rounded-16px">
<n-card title="打印" :bordered="false" class="rounded-8px shadow-sm">
<n-button type="primary" class="mr-10px" @click="printTable">打印表格</n-button>
<n-button type="primary" @click="printImage">打印图片</n-button>
<template #footer>

2
src/views/plugin/swiper/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<n-card title="Swiper插件" class="shadow-sm rounded-16px">
<n-card title="Swiper插件" :bordered="false" class="rounded-8px shadow-sm">
<n-space :vertical="true">
<github-link link="https://github.com/nolimits4web/swiper" />
<web-site-link label="vue3版文档地址：" link="https://swiperjs.com/vue" />

3
src/views/plugin/video/index.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="h-full">
<n-card title="视频播放器插件" class="h-full shadow-sm rounded-16px">
<n-card title="视频播放器插件" :bordered="false" class="h-full rounded-8px shadow-sm">
<div ref="domRef" class=""></div>
</n-card>
</div>
@ -9,6 +9,7 @@
<script setup lang="ts">
import { onMounted, onUnmounted, ref } from 'vue';
import Player from 'xgplayer';
import 'xgplayer/dist/index.min.css';
const domRef = ref<HTMLElement>();
const player = ref<Player>();