mirror of
https://github.com/m-xlsea/ruoyi-plus-soybean.git
synced 2025-09-24 07:49:47 +08:00
feat(projects): 工作台页面布局
This commit is contained in:
@ -1,15 +1,32 @@
|
||||
<template>
|
||||
<div class="p-6px">
|
||||
<div class="flex justify-between h-360px">
|
||||
<div class="flex-1 min-w-360px h-full bg-white dark:bg-dark rounded-16px"></div>
|
||||
<div class="w-16px"></div>
|
||||
<div class="w-360px h-full bg-white dark:bg-dark rounded-16px"></div>
|
||||
</div>
|
||||
</div>
|
||||
<n-space :vertical="true" :size="16">
|
||||
<n-grid :x-gap="16" :y-gap="16" :item-responsive="true" responsive="screen">
|
||||
<n-grid-item span="s:24 m:16">
|
||||
<shadow-card class="h-360px"></shadow-card>
|
||||
</n-grid-item>
|
||||
<n-grid-item span="s:24 m:8">
|
||||
<shadow-card class="h-360px"></shadow-card>
|
||||
</n-grid-item>
|
||||
</n-grid>
|
||||
<n-grid cols="s:2 m:4" responsive="screen" :x-gap="16" :y-gap="16">
|
||||
<n-grid-item v-for="i in 4" :key="i">
|
||||
<shadow-card class="h-100px"></shadow-card>
|
||||
</n-grid-item>
|
||||
</n-grid>
|
||||
<n-grid :x-gap="16" :y-gap="16" :item-responsive="true" responsive="screen">
|
||||
<n-grid-item span="s:24 m:8">
|
||||
<shadow-card class="h-360px"></shadow-card>
|
||||
</n-grid-item>
|
||||
<n-grid-item span="s:24 m:16">
|
||||
<shadow-card class="h-360px"></shadow-card>
|
||||
</n-grid-item>
|
||||
</n-grid>
|
||||
</n-space>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
// import { ref } from 'vue';
|
||||
import { NSpace, NGrid, NGridItem } from 'naive-ui';
|
||||
import { ShadowCard } from '@/components';
|
||||
// import { NGradientText, NSpace, NButton, NSpin, NTag, NSwitch, NCheckbox, NRadio, useDialog } from 'naive-ui';
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
Reference in New Issue
Block a user