码云 IDEA 插件最新版本发布,支持 Pull Request

DaiZhiYi / Ffast-FEJavaScriptMIT

指数
0
Watch 70 Star 175 Fork 40
加入码云
与超过 300 万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
基于vue iview 后台管理系统前端快速开发解决方案 展开 收起

http://118.126.66.11/ffast/

Loading...
README.md

Ffast-FE

基于vue iview后台管理系统前端快速开发解决方案

Install

# install dependencies
npm install or yarn

# serve with hot reload at localhost:8000
npm run dev

# build for production with minification
npm run build

简介

Ffast-FE 是一套基于vue iview后台管理系统前端快速开发解决方案,以JSON数据驱动页面,几句代码即可快速开发属于你的页面。

演示地址

技术栈

vue2 + vuex + vue-router + webpack + ES6 + axios + iview

目录结构

.
├── build  项目构建配置
├── config  开发相关配置
├── static  打包所需静态资源
└── src
    ├── main.js  入口配置
    ├── routes.js  路由配置
    ├── config.js  项目配置API接口地址配置
    ├── locale.js  多语言配置
    ├── components  组件
    ├── config  项目运行配置
    ├── directive  自定义指令
    ├── pages  业务页面
    ├── styles  全局样式
    ├── mock  mock模拟数据
    ├── vuex  Vuex配置
    ├── view  页面文件
    └── utils 工具类

后端解决方案Ffast-Java

https://github.com/ZhiYiDai/Ffast-Java

已实现模块

  • 整体布局界面
  • 用户管理
  • 角色管理
  • 字典管理
  • 权限菜单
  • 接口测试
  • 系统日志
  • 待办事项
  • 定时任务

开发中的模块

  • 代码生成

效果图

image image image image image image image image image image

一个增删改查表格页面 ( CrudView )

<template>
  <CrudView :tableOptions="tableOptions" ></CrudView>
</template>
<script>
  /**
   * 弹出式表单参数
   */
  const tableEditOptions = {
    // 是否启用跳转到编辑页面,为空或false则用弹出模态框进行编辑
    editPage: true,
    // 模态框宽度
    width: 600,
    // 表单标签宽度
    labelWidth: 70,
    // 表单数据
    dynamic: [
      [
        {name: 'id', hidden: true},
        {
          name: 'name',
          type: 'text',
          span: 12,
          label: '资源名',
          rules: {required: true}
        },
        {name: 'parentId', type: 'treeSelect', dataFromTree: true, span: 12, label: '父资源'}
      ],
      [
        {name: 'url', type: 'text', span: 24, label: '菜单Url'}
      ],
      [
        {name: 'identity', type: 'text', span: 12, label: '标识符'},
        {name: 'icon', type: 'text', span: 12, label: '图标'}
      ],
      [
        {
          name: 'status',
          openText: '显示',
          closeText: '隐藏',
          type: 'switch',
          span: 12,
          label: '状态',
          value: 1,
          trueValue: 1,
          falseValue: 0
        },
        {
          name: 'resType',
          type: 'radio',
          span: 12,
          label: '类型',
          value: 1,
          data: [