@vtj/materials 0.8.44 → 0.8.46

package/src/antdv/upload.ts

@@ -0,0 +1,183 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const components: MaterialDescription[] = [
+  {
+    name: 'AUpload',
+    alias: 'Upload',
+    label: '上传',
+    categoryId: 'input',
+    doc: 'https://www.antdv.com/components/upload-cn',
+    props: [
+      {
+        name: 'accept',
+        label: 'accept',
+        title: '接受上传的文件类型',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'action',
+        label: 'action',
+        title: '上传的地址',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'beforeUpload',
+        label: 'beforeUpload',
+        title:
+          '上传文件之前的钩子，参数为上传的文件，若返回 false 则停止上传。支持返回一个 Promise 对象，Promise 对象 reject 时则停止上传，resolve 时开始上传（ resolve 传入 File 或 Blob 对象则上传 resolve 传入对象）',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'customRequest',
+        label: 'customRequest',
+        title: '通过覆盖默认的上传行为，可以自定义自己的上传实现',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'data',
+        label: 'data',
+        title: '上传所需参数或返回上传参数的方法',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'directory',
+        label: 'directory',
+        title: '支持上传文件夹',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'disabled',
+        label: 'disabled',
+        title: '是否禁用',
+        setters: 'BooleanSetter'
+      },
+      {
+        name: 'fileList',
+        label: 'fileList',
+        title: '已经上传的文件列表（受控）',
+        setters: 'ArraySetter'
+      },
+      {
+        name: 'headers',
+        label: 'headers',
+        title: '设置上传的请求头部',
+        setters: 'ObjectSetter'
+      },
+      {
+        name: 'isImageUrl',
+        label: 'isImageUrl',
+        title: '自定义缩略图是否使用 <img /> 标签进行显示',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'listType',
+        label: 'listType',
+        title:
+          '上传列表的内建样式，支持三种基本样式 text, picture 和 picture-card',
+        setters: 'SelectSetter',
+        options: ['text', 'picture', 'picture-card'],
+        defaultValue: 'text'
+      },
+      {
+        name: 'maxCount',
+        label: 'maxCount',
+        title: '限制上传数量。当为 1 时，始终用最新上传的文件代替当前文件',
+        setters: 'NumberSetter'
+      },
+      {
+        name: 'method',
+        label: 'method',
+        title: '上传请求的 http method',
+        setters: 'StringSetter',
+        defaultValue: 'post'
+      },
+      {
+        name: 'multiple',
+        label: 'multiple',
+        title: '是否支持多选文件，ie10+ 支持。开启后按住 ctrl 可选择多个文件',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'name',
+        label: 'name',
+        title: '发到后台的文件参数名',
+        setters: 'StringSetter',
+        defaultValue: 'file'
+      },
+      {
+        name: 'openFileDialogOnClick',
+        label: 'openFileDialogOnClick',
+        title: '点击打开文件对话框',
+        setters: 'BooleanSetter',
+        defaultValue: true
+      },
+      {
+        name: 'previewFile',
+        label: 'previewFile',
+        title: '自定义文件预览逻辑',
+        setters: 'FunctionSetter'
+      },
+      {
+        name: 'progress',
+        label: 'progress',
+        title: '自定义进度条样式',
+        setters: 'ObjectSetter', //?? 	ProgressProps（仅支持 type="line"）
+        defaultValue: { strokeWidth: 2, showInfo: false }
+      },
+      {
+        name: 'removeIcon',
+        label: 'removeIcon',
+        title: '自定义删除 icon',
+        setters: 'v-slot:iconRender="{file: UploadFile}"'
+      },
+      {
+        name: 'showUploadList',
+        label: 'showUploadList',
+        title:
+          '是否展示 uploadList, 可设为一个对象，用于单独设定 showPreviewIcon, showRemoveIcon 和 showDownloadIcon',
+        setters: ['BooleanSetter', 'ObjectSetter'],
+        defaultValue: true
+      },
+      {
+        name: 'supportServerRender',
+        label: 'supportServerRender',
+        title: '服务端渲染时需要打开这个',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      },
+      {
+        name: 'withCredentials',
+        label: 'withCredentials',
+        title: '上传请求时是否携带 cookie',
+        setters: 'BooleanSetter',
+        defaultValue: false
+      }
+    ],
+    events: ['change', 'download', 'drop', 'preview', 'reject', 'remove'],
+    slots: [
+      'downloadIcon',
+      'iconRender',
+      'itemRender',
+      'previewIcon',
+      'removeIcon'
+    ],
+    snippet: {
+      props: {
+        fileList: [],
+        name: 'file',
+        headers: { authorization: 'authorization-text' },
+        action: 'https://www.mocky.io/v2/5cc8019d300000980a055e76'
+      },
+      children: [
+        {
+          name: 'AButton',
+          // children: [{ name: 'uploadOutlined' }]
+          children: 'Click to Upload'
+        }
+      ]
+    }
+  }
+];
+export default components;

package/src/antdv/watermark.ts

@@ -0,0 +1,80 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const components: MaterialDescription[] = [
+  {
+    name: 'AWatermark',
+    alias: 'Watermark',
+    label: '水印',
+    categoryId: 'other',
+    doc: 'https://www.antdv.com/components/watermark-cn',
+    props: [
+      {
+        name: 'width',
+        label: 'width',
+        title: '水印的宽度，content 的默认值为自身的宽度',
+        setters: 'NumberSetter',
+        defaultValue: 120
+      },
+      {
+        name: 'height',
+        label: 'height',
+        title: '水印的高度，content 的默认值为自身的高度',
+        setters: 'NumberSetter',
+        defaultValue: 64
+      },
+      {
+        name: 'rotate',
+        label: 'rotate',
+        title: '水印绘制时，旋转的角度，单位 °',
+        setters: 'NumberSetter',
+        defaultValue: -22
+      },
+      {
+        name: 'zIndex',
+        label: 'zIndex',
+        title: '追加的水印元素的 z-index',
+        setters: 'NumberSetter',
+        defaultValue: 9
+      },
+      {
+        name: 'image',
+        label: 'image',
+        title: '图片源，建议导出 2 倍或 3 倍图，优先级高',
+        setters: 'StringSetter'
+      },
+      {
+        name: 'content',
+        label: 'content',
+        title: '水印文字内容',
+        setters: ['StringSetter', 'ArraySetter']
+      },
+      {
+        name: 'font',
+        label: 'font',
+        title: '文字样式',
+        setters: 'ObjectSetter',
+        defaultValue: 'ObjectSetter'
+      },
+      {
+        name: 'gap',
+        label: 'gap',
+        title: '水印之间的间距',
+        setters: 'ArraySetter',
+        defaultValue: [100, 100]
+      },
+      {
+        name: 'offset',
+        label: 'offset',
+        title: '水印距离容器左上角的偏移量，默认为 gap/2',
+        setters: 'ArraySetter',
+        defaultValue: [50, 50]
+      }
+    ],
+    snippet: {
+      props: { content: 'VTJ' },
+      children: [{ name: 'div', props: { style: { height: '500px' } } }]
+    }
+  }
+];
+
+export default components;

package/src/charts/chart.ts

@@ -0,0 +1,48 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const desc: MaterialDescription = {
+  name: 'XChart',
+  label: '图表',
+  categoryId: 'base',
+  props: [
+    {
+      name: 'option',
+      label: 'option',
+      title: 'ECharts option',
+      setters: 'ObjectSetter'
+    },
+    {
+      name: 'width',
+      label: 'width',
+      setters: ['StringNumber']
+    },
+    {
+      name: 'height',
+      label: 'height',
+      setters: ['StringNumber']
+    }
+  ],
+  snippet: {
+    props: {
+      width: '100%',
+      height: '400px',
+      option: {
+        xAxis: {
+          type: 'category',
+          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+        },
+        yAxis: {
+          type: 'value'
+        },
+        series: [
+          {
+            data: [150, 230, 224, 218, 135, 147, 260],
+            type: 'line'
+          }
+        ]
+      }
+    }
+  }
+};
+
+export default desc;

package/src/charts/index.ts

@@ -0,0 +1,38 @@
+import type {
+  Material,
+  MaterialCategory,
+  MaterialDescription
+} from '@vtj/core';
+import { version } from '../version';
+import { setPackageName } from '../shared';
+import chart from './chart';
+
+const name = '@vtj/charts';
+const components: MaterialDescription[] = [chart].flat();
+
+const categories: MaterialCategory[] = [
+  {
+    id: 'base',
+    category: '基础图表'
+  },
+  {
+    id: 'map',
+    category: '地图'
+  },
+  {
+    id: '3D',
+    category: '3D'
+  }
+];
+
+const material: Material = {
+  name,
+  version,
+  label: '图表',
+  library: 'VtjChartsMaterial',
+  order: 3,
+  categories,
+  components: setPackageName(components, name)
+};
+
+export default material;

package/src/element/affix.ts

@@ -0,0 +1,56 @@
+import type { MaterialDescription } from '@vtj/core';
+const components: MaterialDescription = {
+  name: 'ElAffix',
+  label: '固钉',
+
+  categoryId: 'nav',
+  doc: 'https://element-plus.org/zh-CN/component/affix.html',
+
+  package: 'element-plus',
+  props: [
+    {
+      name: 'offset',
+      defaultValue: 0,
+      setters: 'NumberSetter'
+    },
+    {
+      name: 'position',
+      defaultValue: 'top',
+      setters: 'SelectSetter',
+      options: ['top', 'bottom']
+    },
+    {
+      name: 'target',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'z-index',
+      defaultValue: 100,
+      setters: 'NumberSetter'
+    }
+  ],
+  events: [
+    {
+      name: 'change'
+    },
+    {
+      name: 'scroll'
+    }
+  ],
+  slots: ['default'],
+  snippet: {
+    name: 'ElAffix',
+    children: [
+      {
+        name: 'ElButton',
+        props: {
+          type: 'primary'
+        },
+        children: 'Affix 固钉'
+      }
+    ]
+  }
+};
+
+export default components;

package/src/element/alert.ts

@@ -0,0 +1,75 @@
+import type { MaterialDescription } from '@vtj/core';
+const components: MaterialDescription = {
+  name: 'ElAlert',
+  childIncludes: true,
+  label: '提示',
+
+  doc: 'https://element-plus.org/zh-CN/component/alert.html',
+  categoryId: 'other',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'title',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'type',
+      defaultValue: 'info',
+      setters: 'SelectSetter',
+      options: ['success', 'warning', 'info', 'error']
+    },
+    {
+      name: 'description',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'closable',
+      defaultValue: true,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'center',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'closeText',
+      defaultValue: '',
+      setters: 'InputSetter'
+    },
+    {
+      name: 'showIcon',
+      defaultValue: false,
+      setters: 'BooleanSetter'
+    },
+    {
+      name: 'effect',
+      defaultValue: 'light',
+      setters: 'SelectSetter',
+      options: ['light', 'dark']
+    }
+  ],
+  events: [
+    {
+      name: 'close'
+    }
+  ],
+  slots: [
+    {
+      name: 'default'
+    },
+    {
+      name: 'title'
+    }
+  ],
+  snippet: {
+    props: {
+      title: 'success alert',
+      type: 'success'
+    }
+  }
+};
+
+export default components;

package/src/element/anchor.ts

@@ -0,0 +1,110 @@
+import type { MaterialDescription } from '@vtj/core';
+
+const Anchor: MaterialDescription = {
+  name: 'ElAnchor',
+  label: '锚点',
+
+  doc: 'https://element-plus.org/zh-CN/component/anchor.html',
+  categoryId: 'other',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'container',
+      label: 'container',
+      title: '滚动的容器',
+      setters: 'StringSetter' //??
+    },
+    {
+      name: 'offset',
+      label: 'offset',
+      title: '设置锚点滚动的偏移量',
+      setters: 'NumberSetter',
+      defaultValue: 0
+    },
+    {
+      name: 'bound',
+      label: 'bound',
+      title: '触发锚点的元素的位置偏移量',
+      setters: 'NumberSetter',
+      defaultValue: 15
+    },
+    {
+      name: 'duration',
+      label: 'duration',
+      title: '设置容器滚动持续时间，单位为毫秒',
+      setters: 'NumberSetter',
+      defaultValue: 300
+    },
+    {
+      name: 'marker',
+      label: 'marker',
+      title: '是否显示标记',
+      setters: 'BooleanSetter',
+      defaultValue: true
+    },
+    {
+      name: 'type',
+      label: 'type',
+      title: '设置锚点类型',
+      setters: 'SelectSetter',
+      options: ['default', 'underline'],
+      defaultValue: 'default'
+    },
+    {
+      name: 'direction',
+      label: 'direction',
+      title: '设置锚点方向',
+      setters: 'SelectSetter',
+      options: ['vertical', 'horizontal'],
+      defaultValue: 'horizontal'
+    }
+  ],
+  events: ['change', 'click'],
+  slots: ['default'],
+  snippet: {
+    props: {
+      offset: '70'
+    },
+    children: [
+      {
+        name: 'ElAnchorLink',
+        props: {
+          href: ''
+        },
+        children: '基本用法'
+      }
+    ]
+  }
+};
+
+const AnchorLink: MaterialDescription = {
+  name: 'ElAnchorLink',
+  label: '锚点链接',
+
+  doc: 'https://element-plus.org/zh-CN/component/anchor.html',
+  categoryId: 'other',
+  package: 'element-plus',
+  props: [
+    {
+      name: 'title',
+      label: 'title',
+      title: '链接的文本内容',
+      setters: 'StringSetter'
+    },
+    {
+      name: 'href',
+      label: 'href',
+      title: '链接的地址',
+      setters: 'StringSetter'
+    }
+  ],
+  slots: ['default', 'sub-link'],
+  snippet: {
+    props: {
+      href: ''
+    },
+    children: '基本用法'
+  }
+};
+
+export default [Anchor, AnchorLink];