@pisell/materials 6.0.21 → 6.1.1

package/lowcode/pisell-card-list/meta.ts

@@ -1,4 +1,6 @@
 import snippets from './snippets';
+import { actionsMeta } from '../pisell-wallet-pass-card/actionsMeta';
+import { IPublicModelSettingField } from '@alilc/lowcode-types';
 
 export default {
   snippets,
@@ -18,153 +20,227 @@ export default {
   },
   props: [
     {
-      name: 'platform',
-      title: {
-        label: '平台',
-      },
-      propType: { type: 'oneOf', value: ['h5', 'pc', 'ipad'] },
-      setter: [
-        {
-          componentName: 'RadioGroupSetter',
-          props: {
-            options: [
-              {
-                title: 'h5',
-                value: 'h5',
+      type: 'group',
+      title: { label: '外观' },
+      display: 'block',
+      items: [
+        {
+          name: 'platform',
+          title: {
+            label: '平台',
+          },
+          propType: { type: 'oneOf', value: ['h5', 'pc', 'ipad'] },
+          setter: [
+            {
+              componentName: 'RadioGroupSetter',
+              props: {
+                options: [
+                  {
+                    title: 'h5',
+                    value: 'h5',
+                  },
+                  {
+                    title: 'pc',
+                    value: 'pc',
+                  },
+                  {
+                    title: 'ipad',
+                    value: 'ipad',
+                  },
+                ],
               },
-              {
-                title: 'pc',
-                value: 'pc',
+            },
+            'VariableSetter',
+          ],
+          defaultValue: 'pc',
+        },
+        {
+          name: 'mode',
+          title: {
+            label: '选择类型',
+          },
+          propType: { type: 'oneOf', value: ['multiple', 'single', null] },
+          setter: [
+            {
+              componentName: 'RadioGroupSetter',
+              props: {
+                options: [
+                  {
+                    title: '不选',
+                    value: null,
+                  },
+                  {
+                    title: '单选',
+                    value: 'single',
+                  },
+                  {
+                    title: '多选',
+                    value: 'multiple',
+                  },
+                ],
               },
-              {
-                title: 'ipad',
-                value: 'ipad',
+            },
+            'VariableSetter',
+          ],
+          defaultValue: 'single',
+        },
+        {
+          name: 'direction',
+          title: { label: '方向' },
+          propType: { type: 'oneOf', value: ['horizontal', 'vertical'] },
+          setter: [
+            {
+              componentName: 'RadioGroupSetter',
+              props: {
+                options: [
+                  {
+                    title: '水平',
+                    value: 'horizontal',
+                  },
+                  {
+                    title: '垂直',
+                    value: 'vertical',
+                  },
+                ],
               },
-            ],
+            },
+            'VariableSetter'
+          ],
+          defaultValue: 'vertical'
+        },
+        {
+          name: 'fullWidth',
+          condition: (target: IPublicModelSettingField) => {
+            return target.parent.getPropValue('direction') === 'horizontal';
           },
+          title: { label: '卡片宽度跟随父级' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
         },
-        'VariableSetter',
-      ],
-      defaultValue: 'pc',
-    },
-    {
-      name: 'mode',
-      title: {
-        label: '选择类型',
-      },
-      propType: { type: 'oneOf', value: ['multiple', 'single', null] },
-      setter: [
-        {
-          componentName: 'RadioGroupSetter',
-          props: {
-            options: [
-              {
-                title: '不选',
-                value: null,
-              },
-              {
-                title: '单选',
-                value: 'single',
-              },
-              {
-                title: '多选',
-                value: 'multiple',
+        {
+          name: 'type',
+          title: { label: '卡片样式' },
+          propType: { type: 'oneOf', value: ['mini', 'default'] },
+          setter: [
+            {
+              componentName: 'RadioGroupSetter',
+              props: {
+                options: [
+                  {
+                    title: 'Mini',
+                    value: 'mini',
+                  },
+                  {
+                    title: '默认',
+                    value: 'default',
+                  },
+                ],
               },
-            ],
-          },
+            },
+          ],
+          defaultValue: 'default',
         },
-        'VariableSetter',
-      ],
-      defaultValue: 'single',
-    },
-    {
-      name: 'data',
-      title: { label: '当前list数据', tip: '当前list数据' },
-      setter: ['JsonSetter', 'VariableSetter'],
-    },
-    {
-      name: 'hasMore',
-      title: { label: '是否有更多数据', tip: '是否有更多数据' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: false,
-    },
-    {
-      name: 'showName',
-      title: { label: '显示商品名称', tip: '显示商品名称' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'showStoreName',
-      title: { label: '显示共享店铺名称', tip: '显示共享店铺名称' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'showRedeem',
-      title: { label: '显示使用金额', tip: '显示使用金额' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'showBalance',
-      title: { label: '显示余额', tip: '显示余额' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'showCode',
-      title: { label: '显示识别码编号', tip: '显示识别码编号' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'showValidDate',
-      title: { label: '显示有效期', tip: '显示有效期' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'showDetail',
-      title: { label: '显示查看详情按钮', tip: '显示查看详情按钮' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
+      ]
     },
     {
-      name: 'showQrCode',
-      title: { label: '显示识别码二维码', tip: '显示识别码二维码' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'showCover',
-      title: { label: '显示识别码卡封面', tip: '显示识别码卡封面' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'showEmpty',
-      title: { label: '是否展示空占位', tip: '是否展示空占位' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: false,
+      type: 'group',
+      title: { label: '卡片信息展示' },
+      display: 'block',
+      items: [
+        {
+          name: 'data',
+          title: { label: '当前list数据', tip: '当前list数据' },
+          setter: ['JsonSetter', 'VariableSetter'],
+        },
+        {
+          name: 'hasMore',
+          title: { label: '是否有更多数据', tip: '是否有更多数据' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: false,
+        },
+        {
+          name: 'showName',
+          title: { label: '显示商品名称', tip: '显示商品名称' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'showStoreName',
+          title: { label: '显示共享店铺名称', tip: '显示共享店铺名称' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'showRedeem',
+          title: { label: '显示使用金额', tip: '显示使用金额' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'showBalance',
+          title: { label: '显示余额', tip: '显示余额' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'showCode',
+          title: { label: '显示识别码编号', tip: '显示识别码编号' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'showValidDate',
+          title: { label: '显示有效期', tip: '显示有效期' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'showDetail',
+          title: { label: '显示查看详情按钮', tip: '显示查看详情按钮' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'showQrCode',
+          title: { label: '显示识别码二维码', tip: '显示识别码二维码' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'showCover',
+          title: { label: '显示识别码卡封面', tip: '显示识别码卡封面' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'showEmpty',
+          title: { label: '是否展示空占位', tip: '是否展示空占位' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: false,
+        },
+        {
+          name: 'value',
+          title: { label: '当前选中值', tip: '当前选中值' },
+          propType: 'number',
+          setter: 'NumberSetter',
+        },
+      ]
     },
     {
-      name: 'value',
-      title: { label: '当前选中值', tip: '当前选中值' },
-      propType: 'number',
-      setter: 'NumberSetter',
-    },
+      ...actionsMeta
+    }
   ],
   configure: {
     supports: {
@@ -175,6 +251,16 @@ export default {
           template:
             "onChange(event,${extParams}){\n// 选择变化时的回调\nconsole.log('onChange',event);}",
         },
+         {
+          name: 'beforeEdit',
+          template:
+            "beforeEdit(value, index){\n// 点击编辑按钮后，弹窗展示前\nconsole.log('beforeEdit');}",
+        },
+        {
+          name: 'onConfirmEdit',
+          templete:
+            "onConfirmEdit(value, index){\n// 编辑弹窗点击确认\nconsole.log('onConfirmEdit');}",
+        },
       ],
     },
   },

package/lowcode/pisell-custom-checkbox-group/meta.ts

@@ -0,0 +1,204 @@
+import snippets from "./snippets";
+
+export default {
+  snippets,
+  componentName: "PisellCustomCheckboxGroup",
+  title: "自定义选项卡",
+  category: "数据展示",
+  docUrl: "",
+  screenshot: "",
+  devMode: "proCode",
+  npm: {
+    package: "@pisell/materials",
+    version: "1.0.1",
+    exportName: "PisellCustomCheckboxGroup",
+    main: "src/index.tsx",
+    destructuring: true,
+    subName: "",
+  },
+  props: [
+    // {
+    //   title: '数据源',
+    //   display: 'block',
+    //   type: 'group',
+    //   items: [
+
+    //   ],
+    // },
+
+    {
+      name: 'dataSource',
+      title: { label: '列表数据源', tip: 'dataSource | 列表数据源' },
+      propType: { type: 'arrayOf', value: 'any' },
+      setter: ['JsonSetter', 'VariableSetter'],
+    },
+    // {
+    //   name: 'loading',
+    //   title: {
+    //     label: '是否加载中',
+    //     tip: 'loading | 当卡片内容还在加载中时，可以用 loading 展示一个占位',
+    //   },
+    //   propType: 'bool',
+    //   defaultValue: false,
+    //   setter: ['BoolSetter', 'VariableSetter'],
+    // },
+    {
+      name: 'rowKey',
+      title: {
+        label: '行Key',
+        tip: 'rowKey | 当 renderItem 自定义渲染列表项有效时，自定义每一行的 key 的获取方式',
+      },
+      propType: {
+        type: 'oneOfType',
+        value: ['string', 'function'],
+      },
+      defaultValue: 'id',
+      setter: [
+        'StringSetter',
+        {
+          componentName: 'FunctionSetter',
+          props: {
+            template:
+              'rowKey(item,${extParams}){\n// 自定义每一行的 key\nreturn `key-${item.id}`;\n}',
+          },
+        },
+        'VariableSetter',
+      ],
+    },
+    {
+      name: 'disabled',
+      title: { label: '禁用选择', tip: 'disabled | 是否禁用选择' },
+      propType: 'boolean',
+      defaultValue: false,
+      setter: 'BoolSetter',
+    },
+    {
+      name: 'isMultiple',
+      title: { label: '是否多选', tip: 'isMultiple | 是否多选' },
+      propType: 'boolean',
+      setter: 'BoolSetter',
+    },
+    {
+      name: "value",
+      title: { label: "Value", tip: "value | 当前选中的值" },
+      propType: "string",
+      setter: "StringSetter",
+    },
+    {
+      name: 'allowAdd',
+      title: { label: '允许添加', tip: 'allowAdd | 是否允许添加' },
+      propType: 'boolean',
+      defaultValue: false,
+      setter: 'BoolSetter',
+    },
+    // {
+    //   title: '栅格  ',
+    //   display: 'block',
+    //   type: 'group',
+    //   items: [
+    //     {
+    //       name: 'columns',
+    //       title: { label: '列数', tip: 'columns | 列数' },
+    //       propType: 'number',
+    //       setter: 'NumberSetter',
+    //       defaultValue: 3,
+    //     },
+    //     {
+    //       name: 'horizontalGap',
+    //       title: { label: '水平间隔', tip: 'horizontalGap | 栅格水平间隔，单位为像素(px)' },
+    //       propType: 'number',
+    //       setter: {
+    //         componentName: 'NumberSetter', props: {
+    //           min: 0,
+    //         },
+    //       },
+    //       defaultValue: 10,
+    //     },
+    //     {
+    //       name: 'verticalGap',
+    //       title: { label: '垂直间隔', tip: 'verticalGap | 栅格垂直间隔，单位为像素(px)' },
+    //       propType: 'number',
+    //       setter: {
+    //         componentName: 'NumberSetter',
+    //         props: {
+    //           min: 0,
+    //         },
+    //       },
+    //       defaultValue: 10,
+    //     },
+    //     {
+    //       name: 'singleRow',
+    //       title: { label: '一行展示', tip: 'singleRow | 一行展示' },
+    //       propType: 'boolean',
+    //       defaultValue: false,
+    //       setter: 'BoolSetter',
+    //     },
+    //   ]
+    // },
+    // {
+    //   title: '扩展',
+    //   display: 'block',
+    //   type: 'group',
+    //   items: [
+    //     {
+    //       name: 'renderItem',
+    //       title: {
+    //         label: '渲染函数',
+    //         tip: 'renderItem | 当使用 dataSource 时，可以用 `renderItem` 自定义渲染列表项',
+    //       },
+    //       propType: 'func',
+    //       setter: [
+    //         {
+    //           componentName: 'SlotSetter',
+    //           title: '渲染函数插槽',
+    //           initialValue: {
+    //             type: 'JSSlot',
+    //             params: ['item'],
+    //             value: [
+    //               {
+    //                 componentName: 'List.Item',
+    //                 props: {},
+    //                 children: {
+    //                   componentName: 'Typography.Text',
+    //                   props: {
+    //                     children: {
+    //                       type: 'JSExpression',
+    //                       value: 'this.item.text',
+    //                     },
+    //                   },
+    //                 },
+    //               },
+    //             ],
+    //           },
+    //         },
+    //         {
+    //           componentName: 'FunctionSetter',
+    //           props: {
+    //             template: 'renderItem(item,${extParams}){\n// 自定义渲染列表项\nreturn `item`;\n}',
+    //           },
+    //         },
+    //         'VariableSetter',
+    //       ],
+    //     },
+    //   ],
+    // }
+  ],
+  configure: {
+    supports: {
+      style: true,
+      events: [
+        {
+          name: 'onChange',
+          template: 'onChange(value,${extParams}){\n// 选中值改变时的回调\nconsole.log("value",value);\n}',
+        },
+        {
+          name: 'onAdd',
+          template: 'onAdd(${extParams}){\n// 点击添加按钮时的回调\n}',
+        },
+      ],
+    },
+    component: {
+      isContainer: true,
+    },
+  },
+};

package/lowcode/pisell-custom-checkbox-group/snippets.ts

@@ -0,0 +1,56 @@
+export default [
+  {
+    title: '自定义选项卡',
+    schema: {
+      componentName: 'PisellCustomCheckboxGroup',
+      props: {
+        disabled: false,
+        allowAdd: false,
+        dataSource: [
+          {
+            id: 1,
+            text: "Racing car sprays burning fuel into crowd.",
+          },
+          {
+            id: 2,
+            text: "Japanese princess to wed commoner.",
+          },
+          {
+            id: 3,
+            text: "Australian walks 100km after outback crash.",
+          },
+          {
+            id: 4,
+            text: "Man charged over missing wedding girl.",
+          },
+          {
+            id: 5,
+            text: "Los Angeles battles huge wildfires.",
+          },
+        ],
+        columns: 3,
+        horizontalGap: 10,
+        verticalGap: 10,
+        renderItem: {
+          type: "JSSlot",
+          params: ["item"],
+          value: [
+            {
+              componentName: "List.Item",
+              props: {},
+              children: {
+                componentName: "Typography.Text",
+                props: {
+                  children: {
+                    type: "JSExpression",
+                    value: "this.item.text",
+                  },
+                },
+              },
+            },
+          ],
+        },
+      },
+    },
+  },
+];