@pisell/materials 2.2.13 → 2.2.14

package/lowcode/pisell-countdown/meta.ts

@@ -0,0 +1,71 @@
+import snippets from './snippets';
+
+export default {
+  snippets,
+  componentName: 'PisellCountdown',
+  title: '倒计时',
+  category: '数据展示',
+  docUrl: '',
+  screenshot: '',
+  devMode: 'proCode',
+  npm: {
+    package: '@pisell/materials',
+    version: '1.0.1',
+    exportName: 'PisellCountdown',
+    main: 'src/index.tsx',
+    destructuring: true,
+    subName: '',
+  },
+  props: [
+    {
+      name: 'format',
+      title: { label: '格式化倒计时展示', tip: '格式化倒计时展示，参考 dayjs | format' },
+      propType: 'string',
+    },
+    {
+      name: 'leftTime',
+      title: {
+        label: '剩余时间',
+        tip: '剩余时间（毫秒）| leftTime',
+      },
+      propType: 'number',
+    },
+    {
+      name: 'targetDate',
+      title: {
+        label: '目标时间',
+        tip: '目标时间 | targetDate（如果同时传了 leftTime 和 targetDate，则会忽略 targetDate，以 leftTime 为主）',
+      },
+      propType: { type: "oneOfType", value: ["string", "number"] },
+    },
+    {
+      name: 'interval',
+      title: { label: '间隔', tip: '变化时间间隔（毫秒）| interval' },
+      propType: 'number',
+      defaultValue: 1000
+    },
+  ],
+  configure: {
+    supports: {
+      style: true,
+      className: true,
+      events: [
+        {
+          name: 'onChange',
+          template:
+            "onChange(event,${extParams}){\n// 倒计时时间变化时触发\nconsole.log('onChange', event);}",
+        },
+        {
+          name: 'onFinish',
+          template:
+            "onFinish(){\n// 倒计时完成时触发\nconsole.log('onFinish');}",
+        },
+        {
+          name: "onClick",
+          template:
+            "onClick(event,${extParams}){\n// 点击按钮时的回调\nconsole.log('onClick', event);}",
+        },
+      ],
+    },
+  },
+};

package/lowcode/pisell-countdown/snippets.ts

@@ -0,0 +1,12 @@
+export default [
+  {
+    title: '倒计时组件',
+    schema: {
+      componentName: 'PisellCountdown',
+      props: {
+        interval: 1000,
+        format: "HH:mm:ss"
+      },
+    },
+  },
+];

package/lowcode/pisell-date-picker/meta.ts

@@ -0,0 +1,76 @@
+import snippets from "./snippets";
+import baseDatePickerMeta from '../date-picker/meta';
+
+export default {
+  snippets,
+  componentName: "PisellDatePicker",
+  title: "pisell日期选择框",
+  category: "表单",
+  docUrl: "",
+  screenshot: "",
+  devMode: "proCode",
+  npm: {
+    package: "@pisell/materials",
+    version: "1.0.1",
+    exportName: "PisellDatePicker",
+    main: "src/index.tsx",
+    destructuring: true,
+    subName: "",
+  },
+  configure: {
+    props: [
+      {
+        name: "type",
+        title: {
+          label: "选择类型",
+          tip: "type | 选择类型",
+        },
+        propType: {
+          type: "oneOf",
+          value: ["input", "select", "both"],
+        },
+        setter: {
+          componentName: "RadioGroupSetter",
+          props: {
+            options: [
+              {
+                title: "Input",
+                value: "input",
+              },
+              {
+                title: "Select",
+                value: "select",
+              },
+              {
+                title: "Both",
+                value: "both",
+              },
+            ],
+          },
+        },
+        defaultValue: "both",
+      },
+      ...baseDatePickerMeta.configure.props,
+    ],
+    supports: {
+      style: true,
+      events: [
+        {
+          name: "onChange",
+          template:
+            "onChange(date,dateString,${extParams}){\n// 时间发生变化的回调\nconsole.log('onChange',date,dateString);}",
+        },
+        {
+          name: "onOpenChange",
+          template:
+            "onOpenChange(open,${extParams}){\n// 弹出日历和关闭日历的回调\nconsole.log('onOpenChange',open);}",
+        },
+        {
+          name: "onPanelChange",
+          template:
+            "onPanelChange(value,mode,${extParams}){\n// 日历面板切换的回调\nconsole.log('onPanelChange',value,mode);}",
+        },
+      ],
+    },
+  },
+};

package/lowcode/pisell-date-picker/snippets.ts

@@ -0,0 +1,9 @@
+export default [
+  {
+    title: 'pisell选择日期',
+    schema: {
+      componentName: 'PisellDatePicker',
+      props: {},
+    },
+  },
+];

package/lowcode/pisell-empty/meta.ts

@@ -0,0 +1,85 @@
+import snippets from './snippets';
+
+export default {
+  snippets,
+  componentName: 'PisellEmpty',
+  title: '空状态',
+  category: '数据展示',
+  docUrl: '',
+  screenshot: '',
+  devMode: 'proCode',
+  npm: {
+    package: '@pisell/materials',
+    version: '1.0.1',
+    exportName: 'PisellEmpty',
+    main: 'src/index.tsx',
+    destructuring: true,
+    subName: '',
+  },
+  props: [
+    {
+      name: 'description',
+      title: { label: '内容描述', tip: '自定义描述内容' },
+      propType: { type: 'oneOfType', value: ['string', 'node'] },
+      setter: ['PisellI18nSetter', 'SlotSetter'],
+    },
+    {
+      name: 'extraDescription',
+      title: { label: '额外内容描述', tip: '自定义额外描述内容' },
+      propType: { type: 'oneOfType', value: ['string', 'node'] },
+      setter: ['PisellI18nSetter', 'SlotSetter'],
+    },
+    {
+      name: 'icon',
+      title: {
+        label: {
+          type: 'i18n',
+          'en-US': 'icon',
+          'zh-CN': '图标',
+        },
+        tip: 'icon | Set the icon component of the button',
+      },
+      propType: { type: 'oneOfType', value: ['node'] },
+      setter: [
+        {
+          componentName: 'SlotSetter',
+          initialValue: {
+            type: 'JSSlot',
+            value: [
+              {
+                componentName: 'Icon',
+                props: {
+                  type: 'SmileOutlined',
+                  size: 20,
+                  rotate: 0,
+                  spin: false,
+                },
+              },
+            ],
+          },
+          defaultValue: null,
+        },
+      ],
+    },
+    {
+      name: 'footer',
+      title: { label: '操作区域', tip: '自定义底部额外操作区域' },
+      propType: { type: 'oneOfType', value: ['node'] },
+      setter: ['SlotSetter'],
+    },
+    // {
+    //   name: 'imageStyle',
+    //   title: { label: '图片样式', tip: '图片样式' },
+    //   propType: 'object',
+    // },
+    // {
+    //   name: 'image',
+    //   title: {
+    //     label: '图片地址',
+    //     tip: '设置显示图片，为string时表示自定义图片地址。',
+    //   },
+    //   propType: { type: 'oneOfType', value: ['string', 'node'] },
+    // },
+  ],
+  configure: { supports: { style: true } },
+};

package/lowcode/pisell-empty/snippets.ts

@@ -0,0 +1,10 @@
+export default [
+  {
+    title: 'pisell空状态',
+    screenshot: 'https://alifd.alicdn.com/fusion-cool/icons/icon-antd/empty-1.png',
+    schema: {
+      componentName: 'PisellEmpty',
+      props: {},
+    },
+  },
+];

package/lowcode/pisell-information-entry/meta.ts

@@ -0,0 +1,131 @@
+import snippets from './snippets';
+
+export default {
+  snippets,
+  componentName: 'PisellInformationEntry',
+  title: '信息录入',
+  category: '表单',
+  docUrl: '',
+  screenshot: '',
+  devMode: 'proCode',
+  npm: {
+    package: '@pisell/materials',
+    version: '1.0.1',
+    exportName: 'PisellInformationEntry',
+    main: 'src/index.tsx',
+    destructuring: true,
+    subName: '',
+  },
+  props: [
+    {
+      name: 'entryModes',
+      title: { label: '录入方式', tip: '录入方式' },
+      propType: {
+        type: 'arrayOf',
+        value: {
+          type: 'shape',
+          value: [
+            {
+              name: 'type',
+              title: { label: '录入类型', tip: '录入类型' },
+              propType: {
+                type: 'oneOf',
+                value: ['scanCode', 'input', 'scanner', 'nfc'],
+              },
+            },
+            {
+              name: 'name',
+              propType: ['string', 'number'],
+              description: '文案',
+              defaultValue: '选项值',
+            },
+            {
+              name: 'disabled',
+              propType: 'bool',
+              description: '是否禁用',
+              defaultValue: false,
+            },
+          ],
+        },
+      },
+      setter: {
+        componentName: 'ArraySetter',
+        props: {
+          itemSetter: {
+            componentName: 'ObjectSetter',
+            props: {
+              config: {
+                items: [
+                  {
+                    name: 'type',
+                    title: '录入类型',
+                    isRequired: true,
+                    setter: [
+                      {
+                        componentName: 'SelectSetter',
+                        mode: "single",
+                        props: (target) => {
+                          // console.log(target,'targettarget',target.parent.parent.parent.getPropValue("entryModes"));
+                          const typeValues = target.parent.parent.parent.getPropValue("entryModes").filter(Boolean).map(item => item?.type);
+                          console.log(typeValues,'typeValues');
+                          return {
+                            options: [
+                              {
+                                title: '扫码',
+                                value: 'scanCode',
+                                disabled: typeValues.includes('scanCode'),
+                              },
+                              {
+                                title: '手动输入',
+                                value: 'input',
+                                disabled: typeValues.includes('input'),
+                              },
+                              {
+                                title: '扫描枪（外设）',
+                                value: 'scanner',
+                                disabled: typeValues.includes('scanner'),
+                              },
+                              {
+                                title: 'NFC（外设）',
+                                value: 'nfc',
+                                disabled: typeValues.includes('nfc'),
+                              },
+                            ],
+                          };
+                        },
+                      },
+                      'VariableSetter',
+                    ],
+                  },
+                  {
+                    name: 'name',
+                    title: '文案',
+                    setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
+                    isRequired: true,
+                  },
+                ],
+              },
+            },
+            initialValue: {
+              type: "",
+              name: "",
+            }
+          },
+        },
+      },
+    },
+    {
+      name: 'title',
+      title: { label: '标题文案', tip: '标题文案' },
+      propType: { type: 'oneOfType', value: ['string', 'node'] },
+      setter: ['PisellI18nSetter', 'SlotSetter'],
+    },
+    {
+      name: 'searchDescribe',
+      title: { label: '搜索框描述文案', tip: '搜索框描述文案' },
+      propType: { type: 'oneOfType', value: ['string', 'node'] },
+      setter: ['PisellI18nSetter', 'SlotSetter'],
+    },
+  ],
+  configure: { supports: { style: true } },
+};

package/lowcode/pisell-information-entry/snippets.ts

@@ -0,0 +1,17 @@
+export default [
+  {
+    title: '信息录入',
+    schema: {
+      componentName: 'PisellInformationEntry',
+      props: {
+        entryModes: [
+          { type: 'scanCode' },
+          { type: 'input' },
+          { type: 'scanner' },
+          { type: 'nfc' },
+        ],
+        title: "",
+      },
+    },
+  },
+];

package/lowcode/pisell-input/meta.ts

@@ -0,0 +1,193 @@
+import snippets from './snippets';
+
+export default {
+  snippets,
+  componentName: 'PisellInput',
+  title: 'pisell输入框',
+  category: '表单',
+  docUrl: "",
+  screenshot: "",
+  devMode: "proCode",
+  npm: {
+    package: "@pisell/materials",
+    version: "1.0.1",
+    exportName: "PisellInput",
+    main: "src/index.tsx",
+    destructuring: true,
+    subName: "",
+  },
+  props: [
+    {
+      name: 'defaultValue',
+      title: { label: '默认值', tip: '默认内容' },
+      propType: 'string',
+      setter: 'StringSetter',
+    },
+    {
+      name: 'value',
+      title: { label: '当前值', tip: '当前值' },
+      propType: 'string',
+      setter: 'StringSetter'
+    },
+    {
+      name: 'allowClear',
+      title: { label: '支持清除', tip: '是否允许清除' },
+      propType: 'bool',
+      setter: 'BoolSetter',
+    },
+    {
+      name: 'bordered',
+      title: { label: '显示边框', tip: '是否有边框' },
+      propType: 'bool',
+      defaultValue: true,
+      setter: 'BoolSetter',
+    },
+    {
+      name: 'disabled',
+      title: { label: '是否禁用', tip: '是否为禁用状态' },
+      propType: 'bool',
+      defaultValue: false,
+      setter: 'BoolSetter',
+    },
+    {
+      name: 'placeholder',
+      title: { label: '占位提示', tip: '占位提示' },
+      propType: 'string',
+      setter: 'PisellI18nSetter'
+    },
+    // {
+    //   name: 'id',
+    //   title: { label: '输入框ID', tip: '输入框的ID' },
+    //   propType: 'string',
+    // },
+    {
+      name: 'maxLength',
+      title: { label: '最大长度', tip: '最大长度' },
+      propType: 'number',
+      setter: 'NumberSetter',
+    },
+    // {
+    //   name: 'size',
+    //   title: { label: '控件大小', tip: '控件大小' },
+    //   setter: {
+    //     componentName: 'RadioGroupSetter',
+    //     props: {
+    //       options: [
+    //         {
+    //           title: '大',
+    //           value: 'large',
+    //         },
+    //         {
+    //           title: '中',
+    //           value: 'middle',
+    //         },
+    //         {
+    //           title: '小',
+    //           value: 'small',
+    //         },
+    //       ],
+    //     },
+    //   },
+    //   propType: { type: 'oneOf', value: ['large', 'middle', 'small'] },
+    //   defaultValue: 'middle',
+    // },
+    {
+      name: 'addonAfter',
+      title: { label: '后置标签', tip: '后置标签' },
+      propType: { type: 'oneOfType', value: ['string', 'node'] },
+      setter: ['PisellI18nSetter', 'SlotSetter']
+    },
+    {
+      name: 'addonBefore',
+      title: { label: '前置标签', tip: '前置标签' },
+      propType: { type: 'oneOfType', value: ['string', 'node'] },
+      setter: ['PisellI18nSetter', 'SlotSetter']
+    },
+    {
+      name: 'prefix',
+      title: { label: '前缀', tip: '前缀' },
+      propType: { type: 'oneOfType', value: ['string', 'node'] },
+      setter: ['PisellI18nSetter', 'SlotSetter']
+    },
+    {
+      name: 'suffix',
+      title: { label: '后缀', tip: '后缀' },
+      propType: { type: 'oneOfType', value: ['string', 'node'] },
+      setter: ['PisellI18nSetter', 'SlotSetter']
+    },
+    {
+      name: 'onChange',
+      title: { label: '输入框内容变化时的回调', tip: '输入框内容变化时的回调' },
+      propType: 'func',
+    },
+    {
+      name: 'onPressEnter',
+      title: { label: '按下回车的回调', tip: '按下回车的回调' },
+      propType: 'func',
+    },
+    {
+      name: 'onFocus',
+      title: { label: '获取焦点回调', tip: '获取焦点回调' },
+      propType: 'func',
+    },
+    {
+      name: 'onKeyDown',
+      title: { label: '按键按下时的回调', tip: '按键按下时的回调' },
+      propType: 'func',
+    },
+    {
+      name: 'onKeyPress',
+      title: { label: '按键按下后的回调', tip: '按键按下之后释放之前的回调' },
+      propType: 'func',
+    },
+    {
+      name: 'onKeyUp',
+      title: { label: '按键释放回调', tip: '按键释放之后的回调' },
+      propType: 'func',
+    },
+    {
+      name: 'onBlur',
+      title: { label: '失去焦点回调', tip: '失去焦点回调' },
+      propType: 'func',
+    },
+  ],
+  configure: {
+    supports: {
+      style: true,
+      events: [
+        {
+          name: 'onChange',
+          template:
+            "onChange(event,${extParams}){\n// 输入框内容变化时的回调\nconsole.log('onChange',event);}",
+        },
+        {
+          name: 'onPressEnter',
+          template:
+            "onPressEnter(event,${extParams}){\n// 按下回车的回调\nconsole.log('onPressEnter',event);}",
+        },
+        {
+          name: 'onFocus',
+          template: "onFocus(event,${extParams}){\n// 获取焦点回调\nconsole.log('onFocus',event);}",
+        },
+        {
+          name: 'onKeyDown',
+          template:
+            "onKeyDown(event,${extParams}){\n// 按键按下时的回调\nconsole.log('onKeyDown',event);}",
+        },
+        {
+          name: 'onKeyPress',
+          template:
+            "onKeyPress(event,${extParams}){\n// 按键按下后的回调\nconsole.log('onKeyPress',event);}",
+        },
+        {
+          name: 'onKeyUp',
+          template: "onKeyUp(event,${extParams}){\n// 按键释放回调\nconsole.log('onKeyUp',event);}",
+        },
+        {
+          name: 'onBlur',
+          template: "onBlur(event,${extParams}){\n// 按键释放回调\nconsole.log('onBlur',event);}",
+        },
+      ],
+    },
+  },
+};

package/lowcode/pisell-input/snippets.ts

@@ -0,0 +1,11 @@
+export default [
+  {
+    title: 'pisell输入框',
+    screenshot: 'https://alifd.alicdn.com/fusion-cool/icons/icon-antd/input-1.png',
+    schema: {
+      componentName: 'PisellInput',
+      props: {
+      },
+    },
+  },
+];

package/lowcode/pisell-input.bank-card-input/meta.ts

@@ -0,0 +1,62 @@
+import snippets from "./snippets";
+import baseInputMeta from '../pisell-input/meta';
+
+export default {
+  snippets,
+  componentName: "PisellInput.BankCard",
+  title: "银行卡",
+  category: "表单",
+  docUrl: "",
+  screenshot: "",
+  devMode: "proCode",
+  npm: {
+    package: "@pisell/materials",
+    version: "1.0.1",
+    exportName: "PisellInput",
+    main: "src/index.tsx",
+    destructuring: true,
+    subName: "BankCard",
+  },
+  props: [
+    ...baseInputMeta.props,
+  ],
+  configure: {
+    supports: {
+      style: true,
+      events: [
+        {
+          name: 'onChange',
+          template:
+            "onChange(event,${extParams}){\n// 输入框内容变化时的回调\nconsole.log('onChange',event);}",
+        },
+        {
+          name: 'onPressEnter',
+          template:
+            "onPressEnter(event,${extParams}){\n// 按下回车的回调\nconsole.log('onPressEnter',event);}",
+        },
+        {
+          name: 'onFocus',
+          template: "onFocus(event,${extParams}){\n// 获取焦点回调\nconsole.log('onFocus',event);}",
+        },
+        {
+          name: 'onKeyDown',
+          template:
+            "onKeyDown(event,${extParams}){\n// 按键按下时的回调\nconsole.log('onKeyDown',event);}",
+        },
+        {
+          name: 'onKeyPress',
+          template:
+            "onKeyPress(event,${extParams}){\n// 按键按下后的回调\nconsole.log('onKeyPress',event);}",
+        },
+        {
+          name: 'onKeyUp',
+          template: "onKeyUp(event,${extParams}){\n// 按键释放回调\nconsole.log('onKeyUp',event);}",
+        },
+        {
+          name: 'onBlur',
+          template: "onBlur(event,${extParams}){\n// 按键释放回调\nconsole.log('onBlur',event);}",
+        },
+      ],
+    },
+  },
+};