@pisell/materials 3.3.4 → 3.3.6

package/lowcode/pisell-wallet-pass-card/actionsMeta.ts

@@ -0,0 +1,217 @@
+import { IPublicModelSettingField } from '@alilc/lowcode-types';
+
+import React from 'react';
+
+const defaultFields = [
+  {
+    name: 'name',
+    label: '商品名称',
+  },
+  {
+    name: 'storeName',
+    label: '共享店铺名称'
+  },
+  {
+    name: 'balance',
+    label: '余额'
+  },
+  {
+    name: 'redeem',
+    label: '使用金额'
+  },
+  {
+    name: 'code',
+    label: '识别码编号'
+  },
+  {
+    name: 'validDate',
+    label: '有效期'
+  }
+]
+
+export const actionsMeta = {
+  title: { label: '卡片操作' },
+  type: 'group',
+  display: 'block',
+  items: [
+    {
+      name: 'showActions',
+      title: { label: '开启卡片操作' },
+      propType: 'bool',
+      setter: 'BoolSetter',
+      defaultValue: false,
+      extraProps:{
+        setValue: (target: IPublicModelSettingField, value: boolean) => {
+          const actions = target.parent.getPropValue('actions');
+          if (true === value && !actions) {
+            target.parent.setPropValue('actions', {
+              layout: 'expanded',
+              detail: {
+                visible: true,
+                iconColor: '#1570EF',
+              },
+              edit: {
+                visible: true,
+                iconColor: '#1570EF',
+                dialogTitle: '编辑',
+                enableDialog: true,
+                fields: [...defaultFields],
+              },
+            }) 
+          }
+          if (!value) {
+            target.parent.setPropValue('actions', undefined);
+          }
+        }
+      }
+    },
+    {
+      name: 'actions.layout',
+      title: { label: '操作展示' },
+      condition: (target: IPublicModelSettingField) =>
+        !!target.parent.getPropValue('showActions'),
+      setter: [
+        {
+          componentName: 'RadioGroupSetter',
+          props: {
+            options: [
+              {
+                title: '平铺',
+                value: 'expanded',
+              },
+              {
+                title: '隐藏',
+                value: 'collapsed',
+              },
+            ],
+          },
+        },
+      ],
+      // defaultValue: 'expanded',
+    },
+    {
+      name: 'actions.detail',
+      title: { label: '详情' },
+      condition: (target: IPublicModelSettingField) =>
+        !!target.parent.getPropValue('showActions'),
+      display: 'entry',
+      propType: 'object',
+      // defaultValue: {
+      //   visible: true,
+      //   iconColor: '#1570EF',
+      // },
+      items: [
+        {
+          name: 'visible',
+          title: { label: '开启' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+        },
+        {
+          name: 'iconColor',
+          title: { label: 'icon颜色' },
+          propType: 'string',
+          setter: 'ColorSetter',
+        },
+      ],
+    },
+    {
+      name: 'actions.edit',
+      title: { label: '编辑' },
+      condition: (target: IPublicModelSettingField) =>
+        !!target.parent.getPropValue('showActions'),
+      display: 'entry',
+      propType: 'object',
+      // defaultValue: {
+      //   visible: true,
+      //   iconColor: '#1570EF',
+      //   dialogTitle: '编辑',
+      //   enableDialog: true,
+      //   fields: [...defaultFields],
+      // },
+      items: [
+        {
+          name: 'visible',
+          title: { label: '开启' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+        },
+        {
+          name: 'iconColor',
+          title: { label: 'icon颜色' },
+          propType: 'string',
+          setter: 'ColorSetter',
+        },
+        {
+          name: 'enableDialog',
+          title: { label: '开启弹窗' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+        },
+        {
+          name: 'dialogTitle',
+          title: { label: '弹窗标题' },
+          propType: 'string',
+          setter: 'PisellI18nSetter',
+          condition: (target: IPublicModelSettingField) =>
+            !!target.parent.getPropValue('enableDialog'),
+        },
+        {
+          name: 'fields',
+          title: { label: '弹窗字段' },
+          condition: (target: IPublicModelSettingField) =>
+            !!target.parent.getPropValue('enableDialog'),
+          setter: {
+            componentName: 'ArraySetter',
+            props: {
+              itemSetter: {
+                componentName: 'ObjectSetter',
+                props: {
+                  descriptor: 'name',
+                  config: {
+                    items: [
+                      {
+                        name: 'label',
+                        title: { label: '标签名' },
+                        propType: 'string',
+                        setter: 'PisellI18nSetter',
+                        important: true,
+                      },
+                    ],
+                  },
+                },
+              },
+              extraProps: {
+                renderFooter: (props: {
+                  value: Array<Record<string, string>>;
+                  onAdd: (newVal?: any) => void;
+                }) => {
+                  if (props.value.length === defaultFields.length)
+                    return null;
+                  const onAdd = () => {
+                    const exists = props.value.map((item) => item.name);
+                    const item = defaultFields.find(
+                      (item) => !exists.includes(item.name)
+                    );
+                    if (item) {
+                      props?.onAdd({...item});
+                    }
+                  };
+                  return React.createElement(
+                    'button',
+                    {
+                      onClick: onAdd,
+                      className:
+                        'next-btn next-medium next-btn-primary next-btn-text',
+                    },
+                    '添加一项 +'
+                  );
+                },
+              },
+            },
+          },
+        },
+      ],
+    },
+  ],
+}

package/lowcode/pisell-wallet-pass-card/meta.ts

@@ -1,4 +1,5 @@
 import snippets from './snippets';
+import { actionsMeta } from './actionsMeta';
 
 export default {
   snippets,
@@ -18,172 +19,215 @@ export default {
   },
   props: [
     {
-      name: "platform",
+      name: 'platform',
       title: {
-        label: "平台",
+        label: '平台',
       },
-      propType: { type: "oneOf", value: ["h5", "pc", "ipad"] },
+      propType: { type: 'oneOf', value: ['h5', 'pc', 'ipad'] },
       setter: [
         {
-          componentName: "RadioGroupSetter",
+          componentName: 'RadioGroupSetter',
           props: {
             options: [
               {
-                title: "h5",
-                value: "h5",
+                title: 'h5',
+                value: 'h5',
               },
               {
-                title: "pc",
-                value: "pc",
+                title: 'pc',
+                value: 'pc',
               },
               {
-                title: "ipad",
-                value: "ipad",
+                title: 'ipad',
+                value: 'ipad',
               },
             ],
           },
         },
-        "VariableSetter",
+        'VariableSetter',
       ],
-      defaultValue: "pc",
+      defaultValue: 'pc',
     },
     {
-      name: "themeMode",
+      name: 'themeMode',
       title: {
-        label: "选择类型",
+        label: '选择类型',
       },
-      propType: { type: "oneOf", value: ["light", "dark", null] },
+      propType: { type: 'oneOf', value: ['light', 'dark', null] },
       setter: [
         {
-          componentName: "RadioGroupSetter",
+          componentName: 'RadioGroupSetter',
           props: {
             options: [
               {
-                title: "Light",
-                value: "light",
+                title: 'Light',
+                value: 'light',
               },
               {
-                title: "Dark",
-                value: "dark",
+                title: 'Dark',
+                value: 'dark',
               },
             ],
           },
         },
-        "VariableSetter",
+        'VariableSetter',
       ],
-      defaultValue: "light",
+      defaultValue: 'light',
     },
     {
-      name: 'name',
-      title: { label: '商品名称', tip: '商品名称' },
-      propType: 'string',
-      setter: 'StringSetter'
-    },
-    {
-      name: 'showName',
-      title: { label: '显示商品名称', tip: '显示商品名称' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'storeName',
-      title: { label: '共享店铺名称', tip: '共享店铺名称' },
-      propType: 'string',
-      setter: 'StringSetter'
-    },
-    {
-      name: 'showStoreName',
-      title: { label: '显示共享店铺名称', tip: '显示共享店铺名称' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'redeem',
-      title: { label: '使用金额', tip: '使用金额' },
-      propType: 'string',
-      setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
-    },
-    {
-      name: 'showRedeem',
-      title: { label: '显示使用金额', tip: '显示使用金额' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'balance',
-      title: { label: '余额', tip: '余额' },
-      propType: 'string',
-      setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
-    },
-    {
-      name: 'showBalance',
-      title: { label: '显示余额', tip: '显示余额' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'code',
-      title: { label: '识别码编号', tip: '识别码编号' },
-      propType: 'string',
-      setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
-    },
-    {
-      name: 'showCode',
-      title: { label: '显示识别码编号', tip: '显示识别码编号' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'validDate',
-      title: { label: '有效期', tip: '有效期' },
-      propType: 'string',
-      setter: ['StringSetter', 'VariableSetter'],
-    },
-    {
-      name: 'showValidDate',
-      title: { label: '显示有效期', tip: '显示有效期' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'showDetail',
-      title: { label: '显示查看详情按钮', tip: '显示查看详情按钮' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
-    {
-      name: 'qrCode',
-      title: { label: '二维码', tip: '二维码' },
-      propType: 'string',
-      setter: ['StringSetter', 'VariableSetter'],
-    },
-    {
-      name: 'showQrCode',
-      title: { label: '显示识别码二维码', tip: '显示识别码二维码' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
+      name: 'type',
+      title: { label: '卡片样式' },
+      propType: { type: 'oneOf', value: ['mini', 'default'] },
+      setter: [
+        {
+          componentName: 'RadioGroupSetter',
+          props: {
+            options: [
+              {
+                title: 'Mini',
+                value: 'mini',
+              },
+              {
+                title: '默认',
+                value: 'default',
+              },
+            ],
+          },
+        },
+      ],
+      defaultValue: 'default',
     },
     {
-      name: 'cover',
-      title: { label: '识别码卡封面', tip: '识别码卡封面' },
-      propType: 'string',
-      setter: ['StringSetter', 'VariableSetter'],
+      title: { label: '卡片信息展示' },
+      type: 'group',
+      display: 'block',
+      items: [
+        {
+          name: 'name',
+          title: { label: '商品名称', tip: '商品名称' },
+          propType: 'string',
+          setter: 'StringSetter',
+        },
+        {
+          name: 'showName',
+          title: { label: '显示商品名称', tip: '显示商品名称' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'storeName',
+          title: { label: '共享店铺名称', tip: '共享店铺名称' },
+          propType: 'string',
+          setter: 'StringSetter',
+        },
+        {
+          name: 'showStoreName',
+          title: { label: '显示共享店铺名称', tip: '显示共享店铺名称' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'redeem',
+          title: { label: '使用金额', tip: '使用金额' },
+          propType: 'string',
+          setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
+        },
+        {
+          name: 'showRedeem',
+          title: { label: '显示使用金额', tip: '显示使用金额' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'balance',
+          title: { label: '余额', tip: '余额' },
+          propType: 'string',
+          setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
+        },
+        {
+          name: 'showBalance',
+          title: { label: '显示余额', tip: '显示余额' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'code',
+          title: { label: '识别码编号', tip: '识别码编号' },
+          propType: 'string',
+          setter: ['StringSetter', 'NumberSetter', 'VariableSetter'],
+        },
+        {
+          name: 'showCode',
+          title: { label: '显示识别码编号', tip: '显示识别码编号' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'validDate',
+          title: { label: '有效期', tip: '有效期' },
+          propType: 'string',
+          setter: ['StringSetter', 'VariableSetter'],
+        },
+        {
+          name: 'showValidDate',
+          title: { label: '显示有效期', tip: '显示有效期' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'showDetail',
+          title: { label: '显示查看详情按钮', tip: '显示查看详情按钮' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'qrCode',
+          title: { label: '二维码', tip: '二维码' },
+          propType: 'string',
+          setter: ['StringSetter', 'VariableSetter'],
+        },
+        {
+          name: 'showQrCode',
+          title: { label: '显示识别码二维码', tip: '显示识别码二维码' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+        {
+          name: 'cover',
+          title: { label: '识别码卡封面', tip: '识别码卡封面' },
+          propType: 'string',
+          setter: ['StringSetter', 'VariableSetter'],
+        },
+        {
+          name: 'showCover',
+          title: { label: '显示识别码卡封面', tip: '显示识别码卡封面' },
+          propType: 'bool',
+          setter: 'BoolSetter',
+          defaultValue: true,
+        },
+      ],
     },
     {
-      name: 'showCover',
-      title: { label: '显示识别码卡封面', tip: '显示识别码卡封面' },
-      propType: 'bool',
-      setter: 'BoolSetter',
-      defaultValue: true,
-    },
+      ...actionsMeta,
+    }
   ],
-  configure: { supports: { style: true } },
+  configure: {
+    supports: {
+      style: true, events: [
+        {
+          name: 'onConfirmEdit',
+          templete:
+            "onConfirmEdit(value){\n// 编辑弹窗点击确认\nconsole.log('onConfirmEdit');}",
+        },
+      ]
+    }
+  },
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/materials",
-  "version": "3.3.4",
+  "version": "3.3.6",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",

package/es/components/TimeResourceSelector/index.d.ts

@@ -1,21 +0,0 @@
-import React from 'react';
-import './index.less';
-export interface TimeSlot {
-    value: string;
-    label: string;
-    time: string;
-    remainingCount: number;
-    disabled?: boolean;
-}
-export interface TimeResourceSelectorProps {
-    timeSlots?: TimeSlot[];
-    multiple?: boolean;
-    showUnavailable?: boolean;
-    defaultExpanded?: boolean;
-    defaultSelectFirst?: boolean;
-    onChange?: (values: string | string[]) => void;
-    className?: string;
-    style?: React.CSSProperties;
-}
-declare const TimeResourceSelector: React.FC<TimeResourceSelectorProps>;
-export default TimeResourceSelector;

package/es/components/appVersionControl/index.d.ts

@@ -1,4 +0,0 @@
-import { AppVersionControlProps } from './types';
-import './index.less';
-declare const AppVersionControl: (props: AppVersionControlProps) => JSX.Element;
-export default AppVersionControl;

package/es/components/appVersionControl/types.d.ts

@@ -1,24 +0,0 @@
-/// <reference types="react" />
-export interface Version {
-    id: string;
-    label: string;
-    value: string;
-    name: string;
-    status: 'live' | 'draft' | 'deprecated';
-    version: string;
-    avatar?: string;
-}
-export interface AppVersionControlProps {
-    value: string;
-    versions: Version[];
-    onVersionChange: (value: string, version: Version) => void;
-    onCreateVersion: (detail: {
-        version: string;
-        baseVersion: string;
-    }) => Promise<boolean | undefined>;
-    onPromoteToLive: (value: string, version: Version) => Promise<boolean | undefined>;
-    allowPublish?: boolean;
-    allowCreate?: boolean;
-    className?: string;
-    style?: React.CSSProperties;
-}

package/es/components/appVersionControl/utils.d.ts

@@ -1,13 +0,0 @@
-/**
- * 比较两个版本号
- * @param version1 版本号1
- * @param version2 版本号2
- * @returns 如果version1大于version2返回1，相等返回0，小于返回-1
- */
-export declare const compareVersions: (version1: string, version2: string) => number;
-/**
- * 从版本号列表中获取最大版本号
- * @param versions 版本号列表
- * @returns 最大的版本号，如果列表为空返回undefined
- */
-export declare const getMaxVersion: (versions: string[]) => string | undefined;

package/es/components/badge/index.d.ts

@@ -1,7 +0,0 @@
-import { BadgeProps as OriginalBadgeprops } from 'antd';
-import './index.less';
-export interface Badgeprops extends OriginalBadgeprops {
-    styleType: 'default' | 'warning';
-}
-declare const Badge: (props: any) => JSX.Element;
-export default Badge;

package/es/components/browserSelect/index.d.ts

@@ -1,21 +0,0 @@
-import React from "react";
-import "./index.less";
-interface Option {
-    label: React.ReactNode;
-    value: string | number;
-}
-interface BrowserSelectProps extends Omit<React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, 'value' | 'onChange'> {
-    options: Option[];
-    value?: string | number;
-    onChange?: (value: string | number, option: Option) => void;
-}
-/**
- * @title: 系统级别的下拉框
- * @description:
- * @param {BrowserSelectProps} props
- * @return {*}
- * @Author: zhiwei.Wang
- * @Date: 2024-01-30 16:43
- */
-declare const BrowserSelect: (props: BrowserSelectProps) => JSX.Element;
-export default BrowserSelect;

package/es/components/buttonGroupEdit/index.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { ButtonGroupListItemProps } from './../buttonGroupPreview';
-interface ButtonGroupEditProps {
-    buttonList: ButtonGroupListItemProps[];
-    buttonGroupList: ButtonGroupListItemProps[][];
-}
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<ButtonGroupEditProps & React.RefAttributes<any>>>;
-export default _default;