admin/django-vue3-admin-gd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add docs 结构

Browse Source
This commit is contained in:
xie7654
2025-07-05 23:18:24 +08:00
parent 2de86a86a6
commit 6a43b29c1f
26 changed files with 146 additions and 595 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
docs/docs/essential/_category_.json Normal file
View File

@@ -0,0 +1,5 @@
{
"label": "文档",
"position": 1
}

15
docs/docs/essential/backend-manual.md Normal file
View File

@@ -0,0 +1,15 @@
---
sidebar_position: 8
---
# 后端手册
## 目录结构
- backend/backend：Django 主程序
- backend/system：系统相关模块
- backend/utils：工具类
- backend/static：静态文件
## 常用命令
- 数据迁移：`python manage.py migrate`
- 创建超级用户：`python manage.py createsuperuser`
- 启动服务：`python manage.py runserver`

13
docs/docs/essential/deploy.md Normal file
View File

@@ -0,0 +1,13 @@
---
sidebar_position: 5
---
# 部署
1. 克隆项目代码
2. 安装依赖（前后端）
3. 配置数据库与环境变量
4. 运行数据库迁移
5. 启动后端服务
6. 启动前端服务
可根据实际环境选择 Docker 或传统部署方式。

14
docs/docs/essential/docker-deploy.md Normal file
View File

@@ -0,0 +1,14 @@
---
sidebar_position: 7
---
# Docker 项目部署（生产环境）
1. 配置生产环境变量和数据库
2. 构建前端静态文件并拷贝到后端 static 目录
3. 执行：
```bash
docker-compose -f docker-compose.prod.yml up -d --build
```
4. 检查服务状态，确保一切正常。

13
docs/docs/essential/docker-start.md Normal file
View File

@@ -0,0 +1,13 @@
---
sidebar_position: 6
---
# Docker 启动
1. 安装 Docker 与 Docker Compose
2. 在项目根目录执行：
```bash
docker-compose -f docker-compose.dev.yml up -d
```
3. 访问前后端服务地址，默认端口可在 compose 文件中查看和修改。

16
docs/docs/essential/features.md Normal file
View File

@@ -0,0 +1,16 @@
---
sidebar_position: 2
---
# 功能列表
- 用户与权限管理
- 菜单与角色管理
- 部门管理
- 数据字典
- 日志审计
- 多端前端支持（Antd、Element、Naive）
- Docker 一键部署
- API 接口自动生成
- 多环境配置
- 任务调度（Celery）
- 代码生成器

14
docs/docs/essential/frontend-manual.md Normal file
View File

@@ -0,0 +1,14 @@
---
sidebar_position: 9
---
# 前端手册
## 目录结构
- web/apps/web-antd：Ant Design Vue 版本
- web/apps/web-ele：Element Plus 版本
- web/apps/web-naive：Naive UI 版本
## 常用命令
- 安装依赖：`pnpm install`
- 启动开发：`pnpm dev`
- 打包构建：`pnpm build`

6
docs/docs/essential/introduction.md Normal file
View File

@@ -0,0 +1,6 @@
---
sidebar_position: 1
---
# 介绍
django-vue3-admin 是一个基于 Django 后端与 Vue3 前端的全栈管理系统解决方案，集成了权限管理、菜单管理、用户管理等常用功能，支持多种前端框架，适合中后台管理系统开发。

13
docs/docs/essential/quickstart-backend.md Normal file
View File

@@ -0,0 +1,13 @@
---
sidebar_position: 4
---
# 快速启动（后端）
```bash
cd backend
pip install -r requirements.txt
python manage.py migrate
python manage.py runserver
```
访问 http://127.0.0.1:8000/ 进入后端管理。

14
docs/docs/essential/quickstart-frontend.md Normal file
View File

@@ -0,0 +1,14 @@
---
sidebar_position: 3
---
# 快速启动-前端
以 web-antd 为例：
```bash
cd web/apps/web-antd
pnpm install
pnpm dev
```
其他前端（web-ele、web-naive）步骤类似，进入对应目录执行安装与启动命令。

47
docs/docs/intro.md
View File

@@ -1,47 +0,0 @@
---
sidebar_position: 1
---
# Tutorial Intro
Let's discover **Docusaurus in less than 5 minutes**.
## Getting Started
Get started by **creating a new site**.
Or **try Docusaurus immediately** with **[docusaurus.new](https://docusaurus.new)**.
### What you'll need
- [Node.js](https://nodejs.org/en/download/) version 18.0 or above:
- When installing Node.js, you are recommended to check all checkboxes related to dependencies.
## Generate a new site
Generate a new Docusaurus site using the **classic template**.
The classic template will automatically be added to your project after you run the command:
```bash
npm init docusaurus@latest my-website classic
```
You can type this command into Command Prompt, Powershell, Terminal, or any other integrated terminal of your code editor.
The command also installs all necessary dependencies you need to run Docusaurus.
## Start your site
Run the development server:
```bash
cd my-website
npm run start
```
The `cd` command changes the directory you're working with. In order to work with your newly created Docusaurus site, you'll need to navigate the terminal there.
The `npm run start` command builds your website locally and serves it through a development server, ready for you to view at http://localhost:3000/.
Open `docs/intro.md` (this page) and edit some lines: the site **reloads automatically** and displays your changes.

8
docs/docs/tutorial-basics/_category_.json
View File

@@ -1,8 +0,0 @@
{
"label": "Tutorial - Basics",
"position": 2,
"link": {
"type": "generated-index",
"description": "5 minutes to learn the most important Docusaurus concepts."
}
}

23
docs/docs/tutorial-basics/congratulations.md
View File

@@ -1,23 +0,0 @@
---
sidebar_position: 6
---
# Congratulations!
You have just learned the **basics of Docusaurus** and made some changes to the **initial template**.
Docusaurus has **much more to offer**!
Have **5 more minutes**? Take a look at **[versioning](../tutorial-extras/manage-docs-versions.md)** and **[i18n](../tutorial-extras/translate-your-site.md)**.
Anything **unclear** or **buggy** in this tutorial? [Please report it!](https://github.com/facebook/docusaurus/discussions/4610)
## What's next?
- Read the [official documentation](https://docusaurus.io/)
- Modify your site configuration with [`docusaurus.config.js`](https://docusaurus.io/docs/api/docusaurus-config)
- Add navbar and footer items with [`themeConfig`](https://docusaurus.io/docs/api/themes/configuration)
- Add a custom [Design and Layout](https://docusaurus.io/docs/styling-layout)
- Add a [search bar](https://docusaurus.io/docs/search)
- Find inspirations in the [Docusaurus showcase](https://docusaurus.io/showcase)
- Get involved in the [Docusaurus Community](https://docusaurus.io/community/support)

34
docs/docs/tutorial-basics/create-a-blog-post.md
View File

@@ -1,34 +0,0 @@
---
sidebar_position: 3
---
# Create a Blog Post
Docusaurus creates a **page for each blog post**, but also a **blog index page**, a **tag system**, an **RSS** feed...
## Create your first Post
Create a file at `blog/2021-02-28-greetings.md`:
```md title="blog/2021-02-28-greetings.md"
---
slug: greetings
title: Greetings!
authors:
- name: Joel Marcey
title: Co-creator of Docusaurus 1
url: https://github.com/JoelMarcey
image_url: https://github.com/JoelMarcey.png
- name: Sébastien Lorber
title: Docusaurus maintainer
url: https://sebastienlorber.com
image_url: https://github.com/slorber.png
tags: [greetings]
---
Congratulations, you have made your first post!
Feel free to play around and edit this post as much as you like.
```
A new blog post is now available at [http://localhost:3000/blog/greetings](http://localhost:3000/blog/greetings).

57
docs/docs/tutorial-basics/create-a-document.md
View File

@@ -1,57 +0,0 @@
---
sidebar_position: 2
---
# Create a Document
Documents are **groups of pages** connected through:
- a **sidebar**
- **previous/next navigation**
- **versioning**
## Create your first Doc
Create a Markdown file at `docs/hello.md`:
```md title="docs/hello.md"
# Hello
This is my **first Docusaurus document**!
```
A new document is now available at [http://localhost:3000/docs/hello](http://localhost:3000/docs/hello).
## Configure the Sidebar
Docusaurus automatically **creates a sidebar** from the `docs` folder.
Add metadata to customize the sidebar label and position:
```md title="docs/hello.md" {1-4}
---
sidebar_label: 'Hi!'
sidebar_position: 3
---
# Hello
This is my **first Docusaurus document**!
```
It is also possible to create your sidebar explicitly in `sidebars.js`:
```js title="sidebars.js"
export default {
tutorialSidebar: [
'intro',
// highlight-next-line
'hello',
{
type: 'category',
label: 'Tutorial',
items: ['tutorial-basics/create-a-document'],
},
],
};
```

43
docs/docs/tutorial-basics/create-a-page.md
View File

@@ -1,43 +0,0 @@
---
sidebar_position: 1
---
# Create a Page
Add **Markdown or React** files to `src/pages` to create a **standalone page**:
- `src/pages/index.js` → `localhost:3000/`
- `src/pages/foo.md` → `localhost:3000/foo`
- `src/pages/foo/bar.js` → `localhost:3000/foo/bar`
## Create your first React Page
Create a file at `src/pages/my-react-page.js`:
```jsx title="src/pages/my-react-page.js"
import React from 'react';
import Layout from '@theme/Layout';
export default function MyReactPage() {
return (
<Layout>
<h1>My React page</h1>
<p>This is a React page</p>
</Layout>
);
}
```
A new page is now available at [http://localhost:3000/my-react-page](http://localhost:3000/my-react-page).
## Create your first Markdown Page
Create a file at `src/pages/my-markdown-page.md`:
```mdx title="src/pages/my-markdown-page.md"
# My Markdown page
This is a Markdown page
```
A new page is now available at [http://localhost:3000/my-markdown-page](http://localhost:3000/my-markdown-page).

31
docs/docs/tutorial-basics/deploy-your-site.md
View File

@@ -1,31 +0,0 @@
---
sidebar_position: 5
---
# Deploy your site
Docusaurus is a **static-site-generator** (also called **[Jamstack](https://jamstack.org/)**).
It builds your site as simple **static HTML, JavaScript and CSS files**.
## Build your site
Build your site **for production**:
```bash
npm run build
```
The static files are generated in the `build` folder.
## Deploy your site
Test your production build locally:
```bash
npm run serve
```
The `build` folder is now served at [http://localhost:3000/](http://localhost:3000/).
You can now deploy the `build` folder **almost anywhere** easily, **for free** or very small cost (read the **[Deployment Guide](https://docusaurus.io/docs/deployment)**).

152
docs/docs/tutorial-basics/markdown-features.mdx
View File

@@ -1,152 +0,0 @@
---
sidebar_position: 4
---
# Markdown Features
Docusaurus supports **[Markdown](https://daringfireball.net/projects/markdown/syntax)** and a few **additional features**.
## Front Matter
Markdown documents have metadata at the top called [Front Matter](https://jekyllrb.com/docs/front-matter/):
```text title="my-doc.md"
// highlight-start
---
id: my-doc-id
title: My document title
description: My document description
slug: /my-custom-url
---
// highlight-end
## Markdown heading
Markdown text with [links](./hello.md)
```
## Links
Regular Markdown links are supported, using url paths or relative file paths.
```md
Let's see how to [Create a page](/create-a-page).
```
```md
Let's see how to [Create a page](./create-a-page.md).
```
**Result:** Let's see how to [Create a page](./create-a-page.md).
## Images
Regular Markdown images are supported.
You can use absolute paths to reference images in the static directory (`static/img/docusaurus.png`):
```md
![Docusaurus logo](/img/docusaurus.png)
```
![Docusaurus logo](/img/docusaurus.png)
You can reference images relative to the current file as well. This is particularly useful to colocate images close to the Markdown files using them:
```md
![Docusaurus logo](./img/docusaurus.png)
```
## Code Blocks
Markdown code blocks are supported with Syntax highlighting.
````md
```jsx title="src/components/HelloDocusaurus.js"
function HelloDocusaurus() {
return <h1>Hello, Docusaurus!</h1>;
}
```
````
```jsx title="src/components/HelloDocusaurus.js"
function HelloDocusaurus() {
return <h1>Hello, Docusaurus!</h1>;
}
```
## Admonitions
Docusaurus has a special syntax to create admonitions and callouts:
```md
:::tip My tip
Use this awesome feature option
:::
:::danger Take care
This action is dangerous
:::
```
:::tip My tip
Use this awesome feature option
:::
:::danger Take care
This action is dangerous
:::
## MDX and React Components
[MDX](https://mdxjs.com/) can make your documentation more **interactive** and allows using any **React components inside Markdown**:
```jsx
export const Highlight = ({children, color}) => (
<span
style={{
backgroundColor: color,
borderRadius: '20px',
color: '#fff',
padding: '10px',
cursor: 'pointer',
}}
onClick={() => {
alert(`You clicked the color ${color} with label ${children}`)
}}>
{children}
</span>
);
This is <Highlight color="#25c2a0">Docusaurus green</Highlight> !
This is <Highlight color="#1877F2">Facebook blue</Highlight> !
```
export const Highlight = ({children, color}) => (
<span
style={{
backgroundColor: color,
borderRadius: '20px',
color: '#fff',
padding: '10px',
cursor: 'pointer',
}}
onClick={() => {
alert(`You clicked the color ${color} with label ${children}`);
}}>
{children}
</span>
);
This is <Highlight color="#25c2a0">Docusaurus green</Highlight> !
This is <Highlight color="#1877F2">Facebook blue</Highlight> !

7
docs/docs/tutorial-extras/_category_.json
View File

@@ -1,7 +0,0 @@
{
"label": "Tutorial - Extras",
"position": 3,
"link": {
"type": "generated-index"
}
}

BIN
docs/docs/tutorial-extras/img/docsVersionDropdown.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 25 KiB

BIN
docs/docs/tutorial-extras/img/localeDropdown.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 27 KiB

55
docs/docs/tutorial-extras/manage-docs-versions.md
View File

@@ -1,55 +0,0 @@
---
sidebar_position: 1
---
# Manage Docs Versions
Docusaurus can manage multiple versions of your docs.
## Create a docs version
Release a version 1.0 of your project:
```bash
npm run docusaurus docs:version 1.0
```
The `docs` folder is copied into `versioned_docs/version-1.0` and `versions.json` is created.
Your docs now have 2 versions:
- `1.0` at `http://localhost:3000/docs/` for the version 1.0 docs
- `current` at `http://localhost:3000/docs/next/` for the **upcoming, unreleased docs**
## Add a Version Dropdown
To navigate seamlessly across versions, add a version dropdown.
Modify the `docusaurus.config.js` file:
```js title="docusaurus.config.js"
export default {
themeConfig: {
navbar: {
items: [
// highlight-start
{
type: 'docsVersionDropdown',
},
// highlight-end
],
},
},
};
```
The docs version dropdown appears in your navbar:
![Docs Version Dropdown](./img/docsVersionDropdown.png)
## Update an existing version
It is possible to edit versioned docs in their respective folder:
- `versioned_docs/version-1.0/hello.md` updates `http://localhost:3000/docs/hello`
- `docs/hello.md` updates `http://localhost:3000/docs/next/hello`

88
docs/docs/tutorial-extras/translate-your-site.md
View File

@@ -1,88 +0,0 @@
---
sidebar_position: 2
---
# Translate your site
Let's translate `docs/intro.md` to French.
## Configure i18n
Modify `docusaurus.config.js` to add support for the `fr` locale:
```js title="docusaurus.config.js"
export default {
i18n: {
defaultLocale: 'en',
locales: ['en', 'fr'],
},
};
```
## Translate a doc
Copy the `docs/intro.md` file to the `i18n/fr` folder:
```bash
mkdir -p i18n/fr/docusaurus-plugin-content-docs/current/
cp docs/intro.md i18n/fr/docusaurus-plugin-content-docs/current/intro.md
```
Translate `i18n/fr/docusaurus-plugin-content-docs/current/intro.md` in French.
## Start your localized site
Start your site on the French locale:
```bash
npm run start -- --locale fr
```
Your localized site is accessible at [http://localhost:3000/fr/](http://localhost:3000/fr/) and the `Getting Started` page is translated.
:::caution
In development, you can only use one locale at a time.
:::
## Add a Locale Dropdown
To navigate seamlessly across languages, add a locale dropdown.
Modify the `docusaurus.config.js` file:
```js title="docusaurus.config.js"
export default {
themeConfig: {
navbar: {
items: [
// highlight-start
{
type: 'localeDropdown',
},
// highlight-end
],
},
},
};
```
The locale dropdown now appears in your navbar:
![Locale Dropdown](./img/localeDropdown.png)
## Build your localized site
Build your site for a specific locale:
```bash
npm run build -- --locale fr
```
Or build your site to include all the locales at once:
```bash
npm run build
```

52
docs/docusaurus.config.ts
View File

@@ -5,8 +5,8 @@ import type * as Preset from '@docusaurus/preset-classic';
// This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)
const config: Config = {
title: 'My Site',
tagline: 'Dinosaurs are cool',
title: 'django-vue3-admin',
tagline: 'Django5 + Vue3 企业级中后台管理系统，支持多端多角色权限、自动化代码生成、Docker一键部署',
favicon: 'img/favicon.ico',
// Future flags, see https://docusaurus.io/docs/api/docusaurus-config#future
@@ -15,15 +15,15 @@ const config: Config = {
},
// Set the production url of your site here
url: 'https://your-docusaurus-site.example.com',
url: 'https://xie7654.github.io',
// Set the /<baseUrl>/ pathname under which your site is served
// For GitHub pages deployment, it is often '/<projectName>/'
baseUrl: '/',
// GitHub pages deployment config.
// If you aren't using GitHub pages, you don't need these.
organizationName: 'facebook', // Usually your GitHub org/user name.
projectName: 'docusaurus', // Usually your repo name.
organizationName: 'XIE7654', // GitHub 用户名
projectName: 'django-vue3-admin', // 仓库名
onBrokenLinks: 'throw',
onBrokenMarkdownLinks: 'warn',
@@ -42,10 +42,8 @@ const config: Config = {
{
docs: {
sidebarPath: './sidebars.ts',
// Please change this to your repo.
// Remove this to remove the "edit this page" links.
editUrl:
'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
routeBasePath: '/',
editUrl: 'https://github.com/XIE7654/django-vue3-admin.git',
},
blog: {
showReadingTime: true,
@@ -53,11 +51,7 @@ const config: Config = {
type: ['rss', 'atom'],
xslt: true,
},
// Please change this to your repo.
// Remove this to remove the "edit this page" links.
editUrl:
'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
// Useful options to enforce blogging best practices
editUrl: 'https://github.com/XIE7654/django-vue3-admin.git',
onInlineTags: 'warn',
onInlineAuthors: 'warn',
onUntruncatedBlogPosts: 'warn',
@@ -70,12 +64,11 @@ const config: Config = {
],
themeConfig: {
// Replace with your project's social card
image: 'img/docusaurus-social-card.jpg',
navbar: {
title: 'My Site',
title: 'django-vue3-admin',
logo: {
alt: 'My Site Logo',
alt: 'django-vue3-admin Logo',
src: 'img/logo.svg',
},
items: [
@@ -87,7 +80,7 @@ const config: Config = {
},
{to: '/blog', label: 'Blog', position: 'left'},
{
href: 'https://github.com/facebook/docusaurus',
href: 'https://github.com/XIE7654/django-vue3-admin.git',
label: 'GitHub',
position: 'right',
},
@@ -101,24 +94,7 @@ const config: Config = {
items: [
{
label: 'Tutorial',
to: '/docs/intro',
},
],
},
{
title: 'Community',
items: [
{
label: 'Stack Overflow',
href: 'https://stackoverflow.com/questions/tagged/docusaurus',
},
{
label: 'Discord',
href: 'https://discordapp.com/invite/docusaurus',
},
{
label: 'X',
href: 'https://x.com/docusaurus',
to: '/introduction',
},
],
},
@@ -131,12 +107,12 @@ const config: Config = {
},
{
label: 'GitHub',
href: 'https://github.com/facebook/docusaurus',
href: 'https://github.com/XIE7654/django-vue3-admin.git',
},
],
},
],
copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`,
copyright: `Copyright © ${new Date().getFullYear()} django-vue3-admin. Built with Docusaurus.`,
},
prism: {
theme: prismThemes.github,

17
docs/src/components/HomepageFeatures/index.tsx
View File

@@ -1,4 +1,4 @@
import type {ReactNode} from 'react';
import React, {ReactNode} from 'react';
import clsx from 'clsx';
import Heading from '@theme/Heading';
import styles from './styles.module.css';
@@ -11,32 +11,29 @@ type FeatureItem = {
const FeatureList: FeatureItem[] = [
{
title: 'Easy to Use',
title: '部门管理与权限控制',
Svg: require('@site/static/img/undraw_docusaurus_mountain.svg').default,
description: (
<>
Docusaurus was designed from the ground up to be easily installed and
used to get your website up and running quickly.
支持多部门、多角色、多权限的企业级管理系统，权限粒度可达列级，满足复杂组织架构需求。
</>
),
},
{
title: 'Focus on What Matters',
title: '用户与菜单动态管理',
Svg: require('@site/static/img/undraw_docusaurus_tree.svg').default,
description: (
<>
Docusaurus lets you focus on your docs, and we&apos;ll do the chores. Go
ahead and move your docs into the <code>docs</code> directory.
用户、角色、菜单、按钮权限灵活配置，支持动态菜单与多级路由，前后端权限联动。
</>
),
},
{
title: 'Powered by React',
title: '自动化与高效开发',
Svg: require('@site/static/img/undraw_docusaurus_react.svg').default,
description: (
<>
Extend or customize your website layout by reusing React. Docusaurus can
be extended while reusing the same header and footer.
提供自动化代码生成、Docker 一键部署、任务调度等功能，助力高效开发与运维。
</>
),
},

4
docs/src/pages/index.tsx
View File

@@ -20,8 +20,8 @@ function HomepageHeader() {
<div className={styles.buttons}>
<Link
className="button button--secondary button--lg"
to="/docs/intro">
Docusaurus Tutorial - 5min ⏱️
to="/docs/introduction">
{siteConfig.title} Tutorial
</Link>
</div>
</div>