nx admin 다운로드 - nx admin 소스 코드 다운로드

nx admin

기타 카테고리

vg bug

다운로드

? Vue 자동화 관리 시스템

중국어 간체 |

소개하다

nx-admin은 Vue와 Element를 기반으로 하는 오픈소스 관리 시스템 프런트엔드 통합 솔루션입니다. 최신 프런트 엔드 기술 스택을 사용하고 i18 국제 솔루션, 동적 라우팅 및 권한 확인이 내장되어 있으며 일반적인 비즈니스 모델을 개선하고 풍부한 기능 구성 요소를 제공하여 엔터프라이즈 수준의 중간 및 백 엔드를 신속하게 구축하는 데 도움이 될 수 있습니다. 최종 제품 프로토타입. 개인과 기업이 시간, 비용, 비용을 최대한 절약할 수 있도록 돕습니다.

중국어 문서

정식 버전

Github 창고 | Github 미리보기 주소 |

nx-관리자

단순화된 버전

Github 창고 | 코드 클라우드 창고 미리보기 |

준비

node와 git을 로컬에 설치해야 합니다. 본 프로젝트의 기술 스택은 ES2015+, vue, vuex, vue-router, axios 및 element-ui를 기반으로 하며, 모든 요청 데이터는 Mock.js를 사용하여 시뮬레이션됩니다. 이러한 지식을 미리 이해하고 학습하는 것은 이를 사용하는 데 큰 도움이 될 것입니다. 프로젝트.

다운로드

자식: git clone https://github.com/mgbq/nx-admin.git

npm: npm install

데모

테스트 계정:

1. username: admin
   password: 任意
2. username: editor
   password: 任意

데모 주소:

Vue에서 구현한 백엔드 관리 시스템

nx-관리 프로젝트

nx-admin은 퇴근 후 관심사에 따라 nxmin에 의해 완성되는 완전한 오픈 소스 및 무료 관리 시스템 통합 솔루션입니다. 프론트엔드 개발도 좋아하신다면 언제든지 토론/학습 그룹에 참여하실 수 있습니다. 아니면 그냥 말도 안되는 내용을 그룹에서 공유하세요.

기술Q&A, 커뮤니케이션QQ그룹

그룹 번호는 493671066입니다. 여기에서는 nx-admin 프로젝트에 대한 모든 종류의 의심과 질문에 답변하고 광고주를 방지할 수 있도록 도와드립니다. 그룹 멤버십 요금은 0.9위안으로 설정되어 있으니 이해해 주시고 환영해 주시기 바랍니다.

기타 고려사항

1. 위의 보라색 색상을 사용하고 싶지 않은 경우, 내가 좋아하는 색상으로 어떻게 변경할 수 있나요?

1단계: 코드 주소를 //src/styles/variables의 사이드바 주석 부분으로 수정합니다.

2단계: 코드 주소를 src/views/layout/comComponents/Sidebar/index.vue 아래의 색상 코드로 수정합니다.

 < el-menu
      mode = "vertical"
      : show-timeout = "200"
      : default - active = "$route.path"
      : collapse = "isCollapse"
      background-color = "#6959CD"
      text-color = "white"
      active-text-color = "#42b983"
    >

2. 새로고침 로딩 애니메이션을 사용하고 싶지 않으면 어떻게 해야 하나요?

index.html에서 관련 로더 랩 로딩 애니메이션 div 및 관련 CSS를 제거하면 됩니다.

3. 위 구성요소 중 일부를 사용하고 싶지 않은 경우 다른 기능에 영향을 주지 않고 템플릿에서 해당 구성요소를 삭제하려면 어떻게 해야 합니까?

예를 들어 Vue-Quill-Editor 컴포넌트를 사용하고 싶지 않아서 3단계를 거쳐야 합니다.

1단계: 구성 요소의 경로를 삭제합니다. src/router/index.js 디렉터리에서 수정된 구성 요소를 도입한 경로를 찾아 다음 코드를 삭제합니다.

  {
        path : 'VueEditor' ,
        name : 'VueEditor' ,
        component : ( ) => import ( '@/views/form/VueEditor' ) ,
        meta : { title : 'VueEditor' }
  } ,

2단계: 구성 요소를 소개하는 파일을 삭제합니다. src/view/form/ 디렉터리에서 VueEditor.vue 파일을 삭제합니다.

3단계: 구성요소를 제거합니다. 다음 명령을 실행합니다.

 npm un vue-quill-editor -S

마치다.

기능

 - 登录 / 注销

- 权限验证
  - 页面权限
  - 指令权限

- 多环境发布
  - dev sit stage prod

- 全局功能
  - 国际化多语言
  - 锁屏
  - 疑问
  - 转到github
  - 多种动态换肤
  - 动态侧边栏（支持多级路由嵌套）
  - 动态面包屑
  - 快捷导航(标签页)
  - Svg Sprite 图标
  - 本地mock数据
  - Screenfull全屏
  - 自适应收缩侧边栏

- 编辑器
  - 富文本
  - Markdown

- Excel
  - 导出excel
  - 导出zip
  - 导入excel
  - 前端可视化excel

- 表格
  - 树形表格
  - 内联编辑

- 错误页面
  - 401
  - 404

- 組件
  - 返回顶部
  - 拖拽Dialog
  - 拖拽看板
  - 列表拖拽
  - SplitPane
  - Dropzone
  - Sticky
  - CountTo

- 综合实例
- Dashboard
- v-charts 图表
- Clipboard(剪贴复制)
- Markdown2html
- 首屏加载等待动画
- Fontawesome 图标库
- vuex本地持久化存储,封装h5的sessionStorage和localStorage
- 右键菜单
- github-emoji
- 第三方网站
- 动态文字说明

nx-admin(코드 작성/문서 번역) 개발에 기여해 주시기 바랍니다.

개발하다

 # 克隆项目
git clone https://github.com/mgbq/nx-admin.git

# 安装依赖
npm install
   
# 建议不要用cnpm安装 会有各种诡异的bug 可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org

# 启动服务
npm run dev

브라우저 접속 http://localhost:9528

풀어 주다

 # 构建测试环境
npm run build:sit

# 构建生产环境
npm run build:prod

다른

 # --report to build with bundle size analytics
npm run build:prod --report

# --preview to start a server in local to preview
npm run build:prod --preview

# lint code
npm run lint

# auto fix
npm run lint -- --fix