ginv v1.0.0-alpha.63

ginv

ginv backend

Quick Start

npm install ginv

Import ginv in man.ts

import { createApp } from 'vue'
import { createPinia } from 'pinia'
import ArcoVue, { Message } from '@arco-design/web-vue'
import ArcoVueIcon from '@arco-design/web-vue/es/icon'
import ginv, { type Config } from 'ginv'
import App from 'ginv/App.vue'

import '@arco-design/web-vue/dist/arco.css'
import 'ginv/index.css'
import iconfont from './assets/font/iconfont.js?url'
import { authenticate, authorize, getGlobalOptions, logout } from '@/api/auth'

export const ossConfig = {
  default: {
    bucket: 'default',
    domain: '//assets.ginv.com/'
  }
}

const config: Config = {
  systemCode: 'ginv',
  systemName: 'Ginv管理后台',
  iconfont,
  gallery: false
  authFn: auth
  logoutFn: logout
  // globalFn: getGlobalOptions
}

const pinia = createPinia()
const app = createApp(App)
ginv.bootstrap(router).use(router).use(pinia).use(ArcoVue).use(ArcoVueIcon).mount('#app')

support route params

async import rules will remove the route params.

example:

path: /user/:userId
components file: views/user.vue

path: /user/:userId/info
components file: views/user/info.vue

path: /book/:bookId/:lang
components file: views/book.vue

authFn

example

/**
 * @description 为用户设置多个用户组
 */
export function auth() {
  const user: User = {
    name: '超管',
    avatar: '',
    department: '总经办'
  }
  const theme: Theme = {
    layout: 'default',
    primaryColor: 'default'
  }

  /**
   * menu是路由的name, 值是路由所在页面的按钮的权限值
   */
  const permissions: { [menu: string]: number } = {
    foo: 2,
    bar: 8,
    subBar: 0,
    otherSubBar: 4
  }

  const routers: Menu[] = [
    {
      n: 'foo', // 路由命名
      p: '/foo', // 路由路径
      m: {
        t: '菜单一',
        i: 'icon-foo',
        s: 1,
        v: 1
      }, // 路由meta
      c: [] // 路由children
    },
    {
      n: 'bar', // 路由命名
      p: '/bar', // 路由路径
      m: {
        t: '菜单二',
        i: 'icon-bar',
        s: 1,
        v: 1
      }, // 路由meta
      c: [
        {
          n: 'subBar', // 路由命名
          p: '/sub-bar', // 路由路径
          m: {
            t: '子菜单',
            i: 'icon-foo',
            s: 1,
            v: 1
          }, // 路由meta
          c: [] // 路由children
        },
        {
          n: 'otherSubBar', // 路由命名
          p: '/other-sub-bar', // 路由路径
          m: {
            t: '另一个子菜单',
            i: 'icon-foo',
            s: 1,
            v: 1
          }, // 路由meta
          c: [] // 路由children
        },
      ] // 路由children
    }
  ]

  return Promise.resolve({ user, theme, menus: routers, permissions })
  // return request<types.SessionReply>(`/authorization/auth/session`, req)
}

when visit `/test`, we'll get 403 error responese
when visit `/test1`, we'll get 404 error responese
when visit `/app`, we'll get success response

globalFn

export function getGlobalOptions() {
  const globalOptions = [
    { label: '默认', value: 1 },
    { label: '自定义1', value: 2 }
  ]

  const globalValue = 1

  return Promise.resolve({ globalOptions, globalValue })
  // return request<types.globalReply>(`/serviceName/rpcName/methodName`, req)
}

now you can get a global select components on siderbar, and it's default value is: 1