Business components based on vue3 and Element Plus

Using npm:

npm i @devotee/views
yarn add @devotee/views
pnpm install @devotee/views

Quick Start

import { createApp } from 'vue';
import TriViews from '@devotee/views';
import TriGlobalSettings from '@/utils/global';

// 样式
import '@triers/views/dist/css/index.css';

createApp(App).use(TriViews, TriGlobalSettings).mount('#app');

TriGlobalSettings

export default {
  form: {
    margin: 20,
    spacing: 16,
    footerAlign: 'right',
    buttons: [
      { label: '确定', type: 'primary', size: 'default', emit: 'confirm' },
      { label: '取消', type: 'default', size: 'default', emit: 'cancel' },
    ],
  },
  table: {
    empty: { text: '暂无数据源', image: '' },
    button: { link: false, size: 'small' },
    cellStyle: { fontSize: '14px', padding: '12px 0' },
    headCellStyle: { fontSize: '14px', padding: '13px 0', fontWeight: 600 },
  },
  upload: {
    file: '/api/web/file/uploadFile',
    image: '/api/web/file/uploadFile',
    headers: () => ({ authorized: store.getters.token, systemType: 'web_system' }),
  },
  dialog: {
    width: { mini: '480px' },
    center: true,
    headAlign: 'center',
    footAlign: 'right',
    buttons: [
      { label: '确定', type: 'primary', size: 'default', emit: 'confirm' },
      { label: '取消', type: 'default', size: 'default', emit: 'cancel' },
    ],
  },
  detail: { margin: 0, spacing: 16 },
  search: { margin: 0, spacing: 16 },
  pagination: { align: 'right', field: { limit: 'pageSize', page: 'pageNo' } },
};