@ebiz/designer-components 0.0.18-beta.3 → 0.0.18-beta.31

package/src/router/index.js

@@ -1,239 +1,272 @@
-import { createRouter, createWebHistory } from 'vue-router'
-
-const routes = [
-  {
-    path: '/',
-    name: 'Home',
-    component: () => import('../views/Home.vue'),
-    meta: { title: '首页' }
-  },
-  {
-    path: '/my-component',
-    name: 'MyComponent',
-    component: () => import('../views/MyComponent.vue'),
-    meta: { title: '基础组件示例' }
-  },
-  {
-    path: '/table',
-    name: 'Table',
-    component: () => import('../views/Table.vue'),
-    meta: { title: '表格组件示例' }
-  },
-  {
-    path: '/form',
-    name: 'Form',
-    component: () => import('../views/Form.vue'),
-    meta: { title: '表单组件示例' }
-  },
-  {
-    path: '/button',
-    name: 'Button',
-    component: () => import('../views/Button.vue'),
-    meta: { title: '按钮组件示例' }
-  },
-  {
-    path: '/tdesign-button',
-    name: 'TdesignButton',
-    component: () => import('../views/TdesignButton.vue'),
-    meta: { title: 'TDesign按钮组件示例' }
-  },
-  {
-    path: '/tdesign-icon',
-    name: 'TdesignIcon',
-    component: () => import('../views/TdesignIcon.vue'),
-    meta: { title: 'TDesign图标组件示例' }
-  },
-  {
-    path: '/tdesign-input',
-    name: 'TdesignInput',
-    component: () => import('../views/TdesignInput.vue'),
-    meta: { title: 'TDesign输入框组件示例' }
-  },
-  {
-    path: '/tdesign-select',
-    name: 'TdesignSelect',
-    component: () => import('../views/TdesignSelect.vue'),
-    meta: { title: 'TDesign选择器组件示例' }
-  },
-  {
-    path: '/tdesign-card',
-    name: 'TdesignCard',
-    component: () => import('../views/TdesignCard.vue'),
-    meta: { title: 'TDesign卡片组件示例' }
-  },
-  {
-    path: '/tdesign-form',
-    name: 'TdesignForm',
-    component: () => import('../views/TdesignForm.vue'),
-    meta: { title: 'TDesign表单组件示例' }
-  },
-  {
-    path: '/tdesign-date-picker',
-    name: 'TdesignDatePicker',
-    component: () => import('../views/TdesignDatePicker.vue'),
-    meta: { title: 'TDesign日期选择器组件示例' }
-  },
-  {
-    path: '/tdesign-image',
-    name: 'TdesignImage',
-    component: () => import('../views/TdesignImage.vue'),
-    meta: { title: 'TDesign图片组件示例' }
-  },
-  {
-    path: '/tdesign-image-viewer',
-    name: 'TdesignImageViewer',
-    component: () => import('../views/TdesignImageViewer.vue'),
-    meta: { title: 'TDesign图片查看器组件示例' }
-  },
-  {
-    path: '/data-container',
-    name: 'DataContainer',
-    component: () => import('../views/DataContainer.vue'),
-    meta: { title: '数据容器示例' }
-  },
-  {
-    path: '/title',
-    name: 'Title',
-    component: () => import('../views/Title.vue'),
-    meta: { title: '标题组件示例' }
-  },
-  {
-    path: '/okr-tree',
-    name: 'OkrTree',
-    component: () => import('../views/OkrTree.vue'),
-    meta: { title: 'OKR树形图示例' }
-  },
-  {
-    path: '/remote-select',
-    name: 'RemoteSelect',
-    component: () => import('../views/RemoteSelect.vue'),
-    meta: { title: '远程选择器示例' }
-  },
-  {
-    path: '/mindmap',
-    name: 'Mindmap',
-    component: () => import('../views/Mindmap.vue'),
-    meta: { title: '思维导图示例' }
-  },
-  {
-    path: '/tdesign-calendar',
-    name: 'TdesignCalendar',
-    component: () => import('../views/TdesignCalendar.vue'),
-    meta: { title: 'TDesign日历组件示例' }
-  },
-  {
-    path: '/tdesign-collapse',
-    name: 'TdesignCollapse',
-    component: () => import('../views/TdesignCollapse.vue'),
-    meta: { title: 'TDesign折叠面板组件示例' }
-  },
-  {
-    path: '/tdesign-tag',
-    name: 'TdesignTag',
-    component: () => import('../views/TagDemo.vue'),
-    meta: { title: 'TDesign标签组件示例' }
-  },
-  {
-    path: '/ebiz-swiper',
-    name: 'EbizSwiper',
-    component: () => import('../views/EbizSwiper.vue'),
-    meta: { title: 'Ebiz轮播框组件示例' }
-  },
-  {
-    path: '/ebiz-space',
-    name: 'EbizSpace',
-    component: () => import('../views/EbizSpace.vue'),
-    meta: { title: 'Ebiz间距组件示例' }
-  },
-  {
-    path: '/pagination',
-    name: 'Pagination',
-    component: () => import('../views/PaginationDemo.vue'),
-    meta: { title: 'EbizPagination分页组件示例' }
-  },
-  {
-    path: '/checkbox',
-    name: 'Checkbox',
-    component: () => import('../views/CheckboxDemo.vue'),
-    meta: { title: 'Ebiz多选框组件示例' }
-  },
-  {
-    path: '/radio',
-    name: 'Radio',
-    component: () => import('../views/EbizRadioDemo.vue'),
-    meta: { title: 'Ebiz单选框组件示例' }
-  },
-  {
-    path: '/switch',
-    name: 'Switch',
-    component: () => import('../views/SwitchDemo.vue'),
-    meta: { title: 'Ebiz开关组件示例' }
-  },
-  {
-    path: '/textarea',
-    name: 'Textarea',
-    component: () => import('../views/TextareaDemo.vue'),
-    meta: { title: 'Ebiz多行文本框组件示例' }
-  },
-  {
-    path: '/upload',
-    name: 'Upload',
-    component: () => import('../views/UploadDemo.vue'),
-    meta: { title: 'TDesign上传组件示例' }
-  },
-  {
-    path: '/grid',
-    name: 'Grid',
-    component: () => import('../views/GridDemo.vue'),
-    meta: { title: 'TDesign栅格组件示例' }
-  },
-  {
-    path: '/tabs',
-    name: 'Tabs',
-    component: () => import('../views/TabsDemo.vue'),
-    meta: { title: 'Ebiz选项卡组件示例' }
-  },
-  {
-    path: '/statistic',
-    name: 'Statistic',
-    component: () => import('../views/StatisticDemo.vue'),
-    meta: { title: 'Ebiz统计数值组件示例' }
-  },
-  {
-    path: '/timeline',
-    name: 'Timeline',
-    component: () => import('../views/TimelineDemo.vue'),
-    meta: { title: 'Ebiz时间轴组件示例' }
-  },
-  {
-    path: '/watermark',
-    name: 'Watermark',
-    component: () => import('../views/WatermarkDemo.vue'),
-    meta: { title: 'TDesign水印组件示例' }
-  },
-  {
-    path: '/ebiz-avatar',
-    name: 'EbizAvatar',
-    component: () => import('../views/EbizAvatar.vue'),
-    meta: { title: 'Ebiz头像组件示例' }
-  },
-  {
-    path: '/ebiz-employee-info',
-    name: 'EbizEmployeeInfo',
-    component: () => import('../views/EbizEmployeeInfo.vue'),
-    meta: { title: 'Ebiz员工信息组件示例' }
-  },
-  {
-    path: '/tdesign-alert',
-    name: 'TdesignAlert',
-    component: () => import('../views/TdesignAlert.vue'),
-    meta: { title: 'TDesign提示组件示例' }
-  }
-]
-
-const router = createRouter({
-  history: createWebHistory(),
-  routes
-})
-
+import { createRouter, createWebHistory } from 'vue-router'
+import Home from '../views/Home.vue'
+import ButtonView from '../views/Button.vue'
+import TableView from '../views/TableView.vue'
+
+const routes = [
+  {
+    path: '/',
+    name: 'Home',
+    component: Home,
+    meta: { title: '首页' }
+  },
+  {
+    path: '/my-component',
+    name: 'MyComponent',
+    component: () => import('../views/MyComponent.vue'),
+    meta: { title: '基础组件示例' }
+  },
+  {
+    path: '/table',
+    name: 'table',
+    component: TableView,
+    meta: { title: '表格组件示例' }
+  },
+  {
+    path: '/table-column',
+    name: 'table-column',
+    component: TableView,
+    meta: { title: '表格列组件示例' }
+  },
+  {
+    path: '/form',
+    name: 'Form',
+    component: () => import('../views/Form.vue'),
+    meta: { title: '表单组件示例' }
+  },
+  {
+    path: '/button',
+    name: 'button',
+    component: ButtonView,
+    meta: { title: '按钮组件示例' }
+  },
+  {
+    path: '/tdesign-button',
+    name: 'TdesignButton',
+    component: () => import('../views/TdesignButton.vue'),
+    meta: { title: 'TDesign按钮组件示例' }
+  },
+  {
+    path: '/tdesign-icon',
+    name: 'TdesignIcon',
+    component: () => import('../views/TdesignIcon.vue'),
+    meta: { title: 'TDesign图标组件示例' }
+  },
+  {
+    path: '/tdesign-input',
+    name: 'TdesignInput',
+    component: () => import('../views/TdesignInput.vue'),
+    meta: { title: 'TDesign输入框组件示例' }
+  },
+  {
+    path: '/tdesign-select',
+    name: 'TdesignSelect',
+    component: () => import('../views/TdesignSelect.vue'),
+    meta: { title: 'TDesign选择器组件示例' }
+  },
+  {
+    path: '/tdesign-card',
+    name: 'TdesignCard',
+    component: () => import('../views/TdesignCard.vue'),
+    meta: { title: 'TDesign卡片组件示例' }
+  },
+  {
+    path: '/tdesign-form',
+    name: 'TdesignForm',
+    component: () => import('../views/TdesignForm.vue'),
+    meta: { title: 'TDesign表单组件示例' }
+  },
+  {
+    path: '/tdesign-date-picker',
+    name: 'TdesignDatePicker',
+    component: () => import('../views/TdesignDatePicker.vue'),
+    meta: { title: 'TDesign日期选择器组件示例' }
+  },
+  {
+    path: '/tdesign-image',
+    name: 'TdesignImage',
+    component: () => import('../views/TdesignImage.vue'),
+    meta: { title: 'TDesign图片组件示例' }
+  },
+  {
+    path: '/tdesign-image-viewer',
+    name: 'TdesignImageViewer',
+    component: () => import('../views/TdesignImageViewer.vue'),
+    meta: { title: 'TDesign图片查看器组件示例' }
+  },
+  {
+    path: '/data-container',
+    name: 'DataContainer',
+    component: () => import('../views/DataContainer.vue'),
+    meta: { title: '数据容器示例' }
+  },
+  {
+    path: '/title',
+    name: 'Title',
+    component: () => import('../views/Title.vue'),
+    meta: { title: '标题组件示例' }
+  },
+  {
+    path: '/okr-tree',
+    name: 'OkrTree',
+    component: () => import('../views/OkrTree.vue'),
+    meta: { title: 'OKR树形图示例' }
+  },
+  {
+    path: '/remote-select',
+    name: 'RemoteSelect',
+    component: () => import('../views/RemoteSelect.vue'),
+    meta: { title: '远程选择器示例' }
+  },
+  {
+    path: '/mindmap',
+    name: 'Mindmap',
+    component: () => import('../views/Mindmap.vue'),
+    meta: { title: '思维导图示例' }
+  },
+  {
+    path: '/tdesign-calendar',
+    name: 'TdesignCalendar',
+    component: () => import('../views/TdesignCalendar.vue'),
+    meta: { title: 'TDesign日历组件示例' }
+  },
+  {
+    path: '/tdesign-collapse',
+    name: 'TdesignCollapse',
+    component: () => import('../views/TdesignCollapse.vue'),
+    meta: { title: 'TDesign折叠面板组件示例' }
+  },
+  {
+    path: '/tdesign-tag',
+    name: 'TdesignTag',
+    component: () => import('../views/TagDemo.vue'),
+    meta: { title: 'TDesign标签组件示例' }
+  },
+  {
+    path: '/ebiz-swiper',
+    name: 'EbizSwiper',
+    component: () => import('../views/EbizSwiper.vue'),
+    meta: { title: 'Ebiz轮播框组件示例' }
+  },
+  {
+    path: '/ebiz-space',
+    name: 'EbizSpace',
+    component: () => import('../views/EbizSpace.vue'),
+    meta: { title: 'Ebiz间距组件示例' }
+  },
+  {
+    path: '/pagination',
+    name: 'Pagination',
+    component: () => import('../views/PaginationDemo.vue'),
+    meta: { title: 'EbizPagination分页组件示例' }
+  },
+  {
+    path: '/checkbox',
+    name: 'Checkbox',
+    component: () => import('../views/CheckboxDemo.vue'),
+    meta: { title: 'Ebiz多选框组件示例' }
+  },
+  {
+    path: '/radio',
+    name: 'Radio',
+    component: () => import('../views/EbizRadioDemo.vue'),
+    meta: { title: 'Ebiz单选框组件示例' }
+  },
+  {
+    path: '/switch',
+    name: 'Switch',
+    component: () => import('../views/SwitchDemo.vue'),
+    meta: { title: 'Ebiz开关组件示例' }
+  },
+  {
+    path: '/textarea',
+    name: 'Textarea',
+    component: () => import('../views/TextareaDemo.vue'),
+    meta: { title: 'Ebiz多行文本框组件示例' }
+  },
+  {
+    path: '/upload',
+    name: 'Upload',
+    component: () => import('../views/UploadDemo.vue'),
+    meta: { title: 'TDesign上传组件示例' }
+  },
+  {
+    path: '/grid',
+    name: 'Grid',
+    component: () => import('../views/GridDemo.vue'),
+    meta: { title: 'TDesign栅格组件示例' }
+  },
+  {
+    path: '/tabs',
+    name: 'Tabs',
+    component: () => import('../views/TabsDemo.vue'),
+    meta: { title: 'Ebiz选项卡组件示例' }
+  },
+  {
+    path: '/statistic',
+    name: 'Statistic',
+    component: () => import('../views/StatisticDemo.vue'),
+    meta: { title: 'Ebiz统计数值组件示例' }
+  },
+  {
+    path: '/timeline',
+    name: 'Timeline',
+    component: () => import('../views/TimelineDemo.vue'),
+    meta: { title: 'Ebiz时间轴组件示例' }
+  },
+  {
+    path: '/watermark',
+    name: 'Watermark',
+    component: () => import('../views/WatermarkDemo.vue'),
+    meta: { title: 'TDesign水印组件示例' }
+  },
+  {
+    path: '/ebiz-avatar',
+    name: 'EbizAvatar',
+    component: () => import('../views/EbizAvatar.vue'),
+    meta: { title: 'Ebiz头像组件示例' }
+  },
+  {
+    path: '/ebiz-employee-info',
+    name: 'EbizEmployeeInfo',
+    component: () => import('../views/EbizEmployeeInfo.vue'),
+    meta: { title: 'Ebiz员工信息组件示例' }
+  },
+  {
+    path: '/tdesign-alert',
+    name: 'TdesignAlert',
+    component: () => import('../views/TdesignAlert.vue'),
+    meta: { title: 'TDesign提示组件示例' }
+  },
+  {
+    path: '/tdesign-dialog',
+    name: 'TdesignDialog',
+    component: () => import('../views/DialogDemo.vue'),
+    meta: { title: 'TDesign对话框组件示例' }
+  },
+  {
+    path: '/page-header',
+    name: 'PageHeader',
+    component: () => import('../views/PageHeaderDemo.vue'),
+    meta: { title: 'Ebiz页面头部组件示例', icon: 'header' }
+  },
+  {
+    path: '/table-demo',
+    name: 'TableDemo',
+    component: () => import('../views/TableDemo.vue'),
+    meta: { title: 'Ebiz表格组件示例' }
+  },
+  {
+    path: '/table-sort',
+    name: 'TableSort',
+    component: () => import('../views/TableSortDemo.vue'),
+    meta: { title: 'Ebiz表格排序组件示例' }
+  }
+]
+
+const router = createRouter({
+  history: createWebHistory(),
+  routes
+})
+
 export default router 

package/src/utils/formatCode.js

@@ -1,24 +1,24 @@
-import prettier from 'prettier'
-import parserHtml from 'prettier/parser-html'
-import parseCss from 'prettier/parser-postcss'
-import parserBabel from 'prettier/parser-babel'
-
-const defaultOption = {
-  singleQuote: true,
-  printWidth: 120,
-  semi: false,
-  trailingComma: 'none'
-}
-
-export const formatCode = (content, parser, options = {}) => {
-  if (!content || typeof content !== 'string') {
-    return content
-  }
-
-  return prettier.format(content, {
-    parser,
-    plugins: [parserBabel, parseCss, parserHtml],
-    ...defaultOption,
-    ...options
-  })
-}
+import prettier from 'prettier'
+import parserHtml from 'prettier/parser-html'
+import parseCss from 'prettier/parser-postcss'
+import parserBabel from 'prettier/parser-babel'
+
+const defaultOption = {
+  singleQuote: true,
+  printWidth: 120,
+  semi: false,
+  trailingComma: 'none'
+}
+
+export const formatCode = (content, parser, options = {}) => {
+  if (!content || typeof content !== 'string') {
+    return content
+  }
+
+  return prettier.format(content, {
+    parser,
+    plugins: [parserBabel, parseCss, parserHtml],
+    ...defaultOption,
+    ...options
+  })
+}