@ywfe/materials-design/lowcode/table-status/meta.ts

YwDesign for lowcode

import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';

const TableStatusMeta: IPublicTypeComponentMetadata = {
  componentName: 'TableStatus',
  title: '状态',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  group: '基础组件',
  category: '表格子元素',
  npm: {
    package: '@ywfe/materials-design',
    version: '0.1.0',
    exportName: 'TableStatus',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  configure: {
    props: [
      {
        name: 'dataSource',
        title: { label: '数据配置', tip: 'dataSource | 数据配置' },
        setter: {
          componentName: 'ArraySetter',
          props: {
            itemSetter: {
              componentName: 'ObjectSetter',
              props: {
                descriptor: 'value',
                config: {
                  items: [
                    {
                      name: 'value',
                      title: { label: '状态', tip: 'value | 状态' },
                      setter: 'StringSetter',
                      isRequired: true,
                    },
                    {
                      name: 'color',
                      title: { label: '颜色', tip: 'value | 颜色' },
                      isRequired: true,
                      setter: {
                        componentName: 'SelectSetter',
                        initialValue: 'info',
                        props: {
                          options: [
                            {
                              label: '警告色',
                              value: 'warning',
                            },
                            {
                              label: '成功色',
                              value: 'success',
                            },
                            {
                              label: '危险色',
                              value: 'error',
                            },
                            {
                              label: '默认',
                              value: 'info',
                            },
                          ],
                        },
                      },
                    },
                  ],
                },
              },
            },
          },
        },
      },
      //   {
      //     name: 'dict',
      //     title: { label: '字典项', tip: 'dict | 适用于字典项数据' },
      //     // setter: ,
      //   },
      {
        name: 'renderExtra',
        title: { label: '状态描述', tip: 'renderExtra | 自定义状态描述' },
        setter: {
          componentName: 'SlotSetter',
          title: '状态描述',
          initialValue: {
            type: 'JSSlot',
            params: ['text', 'record', 'index'],
            value: [],
          },
        },
      },
    ],
    supports: {
      style: true,
    },
    component: {},
  },
};
const snippets: IPublicTypeSnippet[] = [
  {
    title: '状态',
    screenshot: 'https://yw-fed-static.oss-cn-hangzhou.aliyuncs.com/lowcode/status',
    schema: {
      componentName: 'TableStatus',
      props: {
        dataSource: [
          {
            value: '成功',
            color: 'success',
          },
          {
            value: '失败',
            color: 'error',
          },
          {
            value: '警告',
            color: 'warning',
          },
          {
            value: '默认',
            color: 'info',
          },
        ],
        value: {
          type: 'JSExpression',
          value: 'this.text',
        },
      },
    },
  },
];

export default {
  ...TableStatusMeta,
  snippets,
};