consulte o administrador
2024/10/20
Inglês | Chinês Simplificado
Documentação on-line: https://www.gin-vue-admin.com
inicialização
Do ambiente à implantação, vídeo instrutivo
Ensino de Desenvolvimento (Contribuidor: LLemonGreen e Fann)
comunidade de comunicação
mercado de plug-ins
1. Este projeto possui documentação e tutoriais em vídeo detalhados desde o início até o desenvolvimento e a implantação.
2. Este projeto exige que você tenha uma certa base em golang e vue
3. Você pode concluir todas as operações por meio de nossos tutoriais e documentos, portanto, não oferecemos mais serviços técnicos gratuitos. Se precisar de serviços, forneça suporte pago.
4. Se você usar este projeto para fins comerciais, cumpra o acordo Apache2.0 e guarde a declaração de suporte técnico do autor. Você precisa reter as seguintes informações de declaração de direitos autorais, bem como as informações de declaração de direitos autorais contidas em logs e códigos. As informações retidas exigidas são de natureza de direitos autorais e não afetarão nenhum conteúdo comercial. Se você decidir usá-las comercialmente [as atividades comerciais que geram receita são todas usos comerciais] ou devem ser eliminadas, adquira a autorização.
Gin-vue-admin é uma plataforma de desenvolvimento full-stack baseada em vue e gin que separa o front-end e o back-end. Integra autenticação jwt, roteamento dinâmico, menu dinâmico, autenticação casbin, gerador de formulário, gerador de código e outras funções, e fornece. muitas funções de arquivos de amostra, permitindo que você concentre mais tempo no desenvolvimento de negócios.
Visualização on-line: http://demo.gin-vue-admin.com
Nome de usuário de teste: admin
Senha de teste: 123456
Olá! Em primeiro lugar, obrigado por usar o gin-vue-admin.
Gin-vue-admin é um conjunto de estruturas de código aberto com uma arquitetura de separação front-end e back-end preparada para pesquisa e desenvolvimento rápido. Ele foi projetado para construir rapidamente projetos de pequeno e médio porte.
O crescimento do Gin-vue-admin não pode ser separado do apoio de todos. Se você estiver disposto a contribuir com código ou fornecer sugestões para o gin-vue-admin, leia o conteúdo a seguir.
Os problemas são usados apenas para enviar bugs ou recursos e conteúdo relacionado ao design. Outros conteúdos podem ser fechados diretamente.
Antes de enviar um problema, pesquise para ver se o conteúdo relevante foi levantado.
Por favor, faça um fork de uma cópia para o seu próprio projeto primeiro. Não crie uma filial diretamente no armazém.
As informações de commit devem ser preenchidas no formato [文件名]: 描述信息, como README.md: fix xxx bug .
Se você estiver corrigindo um bug, forneça informações descritivas no PR.
A fusão do código requer a participação de dois mantenedores: uma pessoa revisa e aprova, e a outra revisa novamente, podendo ser mesclado após passar na revisão.
- node版本 > v16.8.3 - golang版本 >= v1.22 - IDE推荐：Goland
Use ferramentas de edição como Goland para abrir o diretório do servidor. Não abra o diretório raiz gin-vue-admin.
# Clone o projeto git clone https://github.com/flipped-aurora/gin-vue-admin.git# Insira a pasta do servidor cd server# Use go mod e instale o pacote de dependência go go generate# Run go run.
# Entre na pasta web cd web # Instale as dependências npm install # Inicie o projeto web npm run serve
vá instalar github.com/swaggo/swag/cmd/swag@latest
servidor de CD ganhos de inicialização
Após executar o comando acima, os três arquivos
docs.go,swagger.jsoneswagger.yamlna pasta docs aparecerão no diretório do servidor. Após iniciar o serviço go, digite http://localhost:8888/swagger no diretório do servidor. navegador. /index.html para visualizar a documentação do swagger.
Use VSCode para abrir o arquivo do espaço de trabalho gin-vue-admin.code-workspace no diretório raiz. Você pode ver três diretórios virtuais na barra lateral: backend , frontend , root .
Você também pode ver três tarefas em execução e depuração: Backend , Frontend , Both (Backend & Frontend) . Executar Both (Backend & Frontend) pode iniciar os projetos front-end e front-end ao mesmo tempo.
Existe o campo go.toolsEnvVars no arquivo de configuração do espaço de trabalho, que é a variável de ambiente da ferramenta go usada para o próprio VSCode . Além disso, em sistemas com diversas versões do go, você pode especificar a versão em execução por meio de gopath e go.goroot .
"go.gopath": nulo,"go.goroot": nulo,
Front-end: use o elemento baseado em Vue para construir páginas básicas.
Back-end: use Gin para construir rapidamente uma API básica de estilo tranquilo. Gin é uma estrutura da web escrita em linguagem go.
Banco de dados: use o mecanismo de banco de dados InnoDB da versão MySql > (5.7) e use gorm para implementar operações básicas no banco de dados.
Cache: use Redis para registrar o token jwt do usuário ativo atual e implementar restrições de login multiponto.
Documentação da API: use Swagger para criar documentação de automação.
Arquivo de configuração: Use fsnotify e viper para implementar o arquivo de configuração no formato yaml .
Logging: Use zap para implementar o log.
├── server ├── api (api层) │ └── v1 (v1版本接口) ├── config (配置包) ├── core (核心文件) ├── docs (swagger文档目录) ├── global (全局对象) ├── initialize (初始化) │ └── internal (初始化内部函数) ├── middleware (中间件层) ├── model (模型层) │ ├── request (入参结构体) │ └── response (出参结构体) ├── packfile (静态文件打包) ├── resource (静态资源文件夹) │ ├── excel (excel导入导出默认路径) │ ├── page (表单生成器) │ └── template (模板) ├── router (路由层) ├── service (service层) ├── source (source层) └── utils (工具包) ├── timer (定时器接口封装) └── upload (oss接口封装) web ├── babel.config.js ├── Dockerfile ├── favicon.ico ├── index.html -- 主页面 ├── limit.js -- 助手代码 ├── package.json -- 包管理器代码 ├── src -- 源代码 │ ├── api -- api 组 │ ├── App.vue -- 主页面 │ ├── assets -- 静态资源 │ ├── components -- 全局组件 │ ├── core -- gva 组件包 │ │ ├── config.js -- gva网站配置文件 │ │ ├── gin-vue-admin.js -- 注册欢迎文件 │ │ └── global.js -- 统一导入文件 │ ├── directive -- v-auth 注册文件 │ ├── main.js -- 主文件 │ ├── permission.js -- 路由中间件 │ ├── pinia -- pinia 状态管理器，取代vuex │ │ ├── index.js -- 入口文件 │ │ └── modules -- modules │ │ ├── dictionary.js │ │ ├── router.js │ │ └── user.js │ ├── router -- 路由声明文件 │ │ └── index.js │ ├── style -- 全局样式 │ │ ├── base.scss │ │ ├── basics.scss │ │ ├── element_visiable.scss -- 此处可以全局覆盖 element-plus 样式 │ │ ├── iconfont.css -- 顶部几个icon的样式文件 │ │ ├── main.scss │ │ ├── mobile.scss │ │ └── newLogin.scss │ ├── utils -- 方法包库 │ │ ├── asyncRouter.js -- 动态路由相关 │ │ ├── btnAuth.js -- 动态权限按钮相关 │ │ ├── bus.js -- 全局mitt声明文件 │ │ ├── date.js -- 日期相关 │ │ ├── dictionary.js -- 获取字典方法 │ │ ├── downloadImg.js -- 下载图片方法 │ │ ├── format.js -- 格式整理相关 │ │ ├── image.js -- 图片相关方法 │ │ ├── page.js -- 设置页面标题 │ │ ├── request.js -- 请求 │ │ └── stringFun.js -- 字符串文件 | ├── view -- 主要view代码 | | ├── about -- 关于我们 | | ├── dashboard -- 面板 | | ├── error -- 错误 | | ├── example --上传案例 | | ├── iconList -- icon列表 | | ├── init -- 初始化数据 | | | ├── index -- 新版本 | | | ├── init -- 旧版本 | | ├── layout -- layout约束页面 | | | ├── aside | | | ├── bottomInfo -- bottomInfo | | | ├── screenfull -- 全屏设置 | | | ├── setting -- 系统设置 | | | └── index.vue -- base 约束 | | ├── login --登录 | | ├── person --个人中心 | | ├── superAdmin -- 超级管理员操作 | | ├── system -- 系统检测页面 | | ├── systemTools -- 系统配置相关页面 | | └── routerHolder.vue -- page 入口页面 ├── vite.config.js -- vite 配置文件 └── yarn.lock
Gerenciamento de permissões: gerenciamento de permissões baseado em jwt e casbin .
Upload e download de arquivos: Implemente operações de upload de arquivos com base em七牛云,阿里云e腾讯云(desenvolva seu próprio aplicativo para o token correspondente ou key correspondente em cada plataforma).
Encapsulamento de paginação: o front end usa mixins para encapsular a paginação, e o método de paginação apenas chama mixins .
Gerenciamento de usuários: o administrador do sistema atribui funções de usuário e permissões de função.
Gerenciamento de funções: crie o objeto principal para controle de permissões e atribua diferentes permissões de API e permissões de menu às funções.
Gerenciamento de menu: realize a configuração dinâmica do menu do usuário e realize diferentes menus para diferentes funções.
Gerenciamento de API: usuários diferentes têm permissões diferentes nas interfaces de API que podem chamar.
Gerenciamento de configuração: Os arquivos de configuração podem ser modificados na recepção (esta função não está disponível no site de experiência online).
Pesquisa condicional: adicione exemplos de pesquisa condicional.
Exemplo tranquilo: você pode consultar a API de amostra no módulo de gerenciamento de usuários.
Referência do arquivo front-end: web/src/view/superAdmin/api/api.vue
Referência do arquivo em segundo plano: server/router/sys_api.go
Restrições de login multiponto: você precisa alterar use-multipoint no system para true em config.yaml (você mesmo precisa configurar os parâmetros Redis e Redis no Config. Durante a fase de teste, relate quaisquer bugs a tempo).
Multipart upload: fornece exemplos de multipart upload de arquivos e multipart upload de arquivos grandes.
Construtor de formulários: Construtor de formulários com a ajuda do @Variant Form.
Gerador de código: lógica básica de fundo e gerador de código de coalhada simples.
https://www.yuque.com/flipped-aurora
Existem vídeos de ensino de estrutura de front-end incluídos. Se você acha que o projeto é útil para você, você pode adicionar meu WeChat pessoal: shouzi_1994. Você pode fazer solicitações valiosas.
(1) Vídeo de instruções passo a passo
https://www.bilibili.com/video/BV1Rg411u7xH/
(2) Introdução ao ajuste da estrutura de diretórios de back-end e como usá-lo
https://www.bilibili.com/video/BV1x44y117TT/
(3) vídeo de ensino básico de golang
bilibili: https://space.bilibili.com/322210472/channel/detail?cid=108884
(4) Ensino básico da estrutura do gin
bilibili: https://space.bilibili.com/322210472/channel/detail?cid=126418&ctype=0
(5) vídeo de introdução à atualização da versão gin-vue-admin
bilibili: https://www.bilibili.com/video/BV1kv4y1g7nT
