基于AdonisJs+Adminify的NodeJs+Vue后台管理系统 - Adonis Admin

in 编程
关注公众号【好便宜】( ID:haopianyi222 ),领红包啦~
阿里云,国内最大的云服务商,注册就送数千元优惠券:https://t.cn/AiQe5A0g
腾讯云,良心云,价格优惠: https://t.cn/AieHwwKl
搬瓦工,CN2 GIA 优质线路,搭梯子、海外建站推荐: https://t.cn/AieHwfX9

https://github.com/adonis-chi...

Adonis Admin (Nodejs + Vue Admin dashboard)

An admin dashboard application based on AdonisJs and Adminify(based on Vuetify), see more at Adonis China.
Keywords: NodeJs, VueJs, AdonisJs, ORM, Relation, SQLite, MySQL, Middleware, Restful, CRUD, Material design

Getting Start

Server Side

  1. git clone https://github.com/adonis-china/adonis-admin.git

  2. cd adonis-admin && npm install && npm run serve:dev start the api server

  3. ./ace migration:refresh --seed fill database (use node ace on windows)

Client Side

  1. cd adminify && cp src/config.sample.js src/config.js use copy on windows

  2. npm install && npm run dev start the client

  3. Open http://localhost:8080 (or another port) in your browser.

use cnpm instead npm in china

UI Screenshots

1.png 2.png
3.png 4.png
5.png 6.png
7.png

Wrokflow - Add CRUD for a resource

'use strict'

const RestController = require('./RestController')
const Page = use('App/Model/Page')
const Type = use('App/Model/Type')

class PageController extends RestController {
  get resource() {
    return 'pages'
  }

  get expand() {
    return ['type']
  }


  * gridData() {
    //change the fields
    return {
      options: {
        sort: 'id', //or '-id' as desc
        create: true,
        update: true,
        delete: true
      },
      // filters: false,
      filters: {
        model: {
          title: '',
          created_at: ''
        },
        fields: {
          title: { label: 'Title' },
          created_at: { label: t('fields.Page.created_at'), Page: 'date' }
        },
        rules: {},

      },
      columns: [
        { text: t('fields.Page.id'), value: 'id' },
        { text: t('fields.Page.title'), value: 'title'}
        
      ]
    }
  }

  * formData (request, response) {

    let model = {
      title: '',
      type_id: null,
      body: '',
    }
    let id
    if (request) {
      id = request.input('id')
      if (id) {
        model = yield Page.query().where('id', id).first()
      }
    }

    let typeOptions = yield Type.query().select('id','name').fetch()
    for (let type of typeOptions) {
      type.text = type.name
      type.value = type.id
    }

    return {
      
      model: model,
      fields: {
        title: { label: 'Title', hint: 'Page Title', required: true},
        type_id: {
          label: 'Type', type: 'select', options: typeOptions, required: true,
        },
        body: { label: 'Body', type: 'html' ,required: false},
      },
      rules: model.rules,
      messages: model.messages
    }
  }

  
}

module.exports = PageController
  const resources = ['posts', 'users', 'types', 'comments', 'settings', 'pages']
{ "href": "/crud/pages", "title": "Pages", "icon": "view_list" },
关注公众号【好便宜】( ID:haopianyi222 ),领红包啦~
阿里云,国内最大的云服务商,注册就送数千元优惠券:https://t.cn/AiQe5A0g
腾讯云,良心云,价格优惠: https://t.cn/AieHwwKl
搬瓦工,CN2 GIA 优质线路,搭梯子、海外建站推荐: https://t.cn/AieHwfX9
扫一扫关注公众号添加购物返利助手,领红包
Comments are closed.

推荐使用阿里云服务器

超多优惠券

服务器最低一折,一年不到100!

朕已阅去看看