@dckj-npm/dc-material 0.1.357 → 0.1.359

package/es/components/input/index.js

@@ -0,0 +1,6 @@
+/**
+ * 输入框
+ */
+
+import Input from "./input";
+export { Input };

package/es/components/input/index.scss

@@ -0,0 +1,3 @@
+.input {
+    
+}

package/es/components/input/input.d.ts

@@ -0,0 +1,42 @@
+import * as React from 'react';
+import './index.scss';
+export interface InputProps {
+    /**
+     * 数据源绑定
+     */
+    value?: string | number | null;
+    /**
+     * 点击事件
+     */
+    onClick?: () => void;
+    /**
+     * 值改变事件
+     */
+    onChange?: (value: string | number, event: unknown, reason?: string) => void;
+    /**
+     * 清除事件
+     */
+    onClear?: () => void;
+    /**
+     * 按下回车事件
+     */
+    onPressEnter?: () => void;
+    /**
+     * 聚焦事件
+     */
+    onFocus?: () => void;
+    /**
+     * 失去焦点事件
+     */
+    onBlur?: () => void;
+    /**
+     * 子节点
+     */
+    children?: React.ReactNode;
+    /**
+     * 允许透传 Next Input 的任意属性
+     */
+    [key: string]: any;
+}
+declare const Input: React.FC<InputProps>;
+export default Input;

package/es/components/input/input.js

@@ -0,0 +1,95 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _Icon from "@alifd/next/es/icon";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["value", "onClick", "children", "onChange", "onClear", "onPressEnter", "onFocus", "onBlur"];
+import * as React from 'react';
+import { createElement } from 'react';
+import "./index.scss";
+var Input = function Input(_ref) {
+  var _otherProps$hasClear, _otherProps$readOnly, _otherProps$hasBorder;
+  var value = _ref.value,
+    onClick = _ref.onClick,
+    children = _ref.children,
+    onChange = _ref.onChange,
+    onClear = _ref.onClear,
+    onPressEnter = _ref.onPressEnter,
+    onFocus = _ref.onFocus,
+    onBlur = _ref.onBlur,
+    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var _otherProps = otherProps || {};
+
+  // legacy schema 兼容：旧属性不再在面板暴露，但历史页面可能仍存在
+  var legacyClearable = _otherProps.clearable;
+  var legacyReadonly = _otherProps.readonly;
+  var legacyBorder = _otherProps.border;
+  var legacyPrefix = _otherProps.prefix;
+  var legacySuffix = _otherProps.suffix;
+  var legacyPrefixIcon = _otherProps.prefixIcon;
+  var legacySuffixIcon = _otherProps.suffixIcon;
+  var legacyIconSize = _otherProps.iconSize;
+
+  // 兼容旧属性命名（优先使用 Next 原生属性名）
+  var hasClear = (_otherProps$hasClear = _otherProps.hasClear) !== null && _otherProps$hasClear !== void 0 ? _otherProps$hasClear : legacyClearable;
+  var readOnly = (_otherProps$readOnly = _otherProps.readOnly) !== null && _otherProps$readOnly !== void 0 ? _otherProps$readOnly : legacyReadonly;
+  var hasBorder = (_otherProps$hasBorder = _otherProps.hasBorder) !== null && _otherProps$hasBorder !== void 0 ? _otherProps$hasBorder : legacyBorder;
+
+  // legacy props 不应透传给 Next，否则会被当作 DOM attribute 下发
+  delete _otherProps.clearable;
+  delete _otherProps.readonly;
+  delete _otherProps.border;
+  delete _otherProps.prefix;
+  delete _otherProps.suffix;
+  delete _otherProps.prefixIcon;
+  delete _otherProps.suffixIcon;
+  delete _otherProps.iconSize;
+  // 构建addonBefore内容
+  var innerBefore = legacyPrefixIcon || legacyPrefix ? /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex',
+      alignItems: 'center'
+    }
+  }, legacyPrefixIcon && /*#__PURE__*/createElement(_Icon, {
+    type: legacyPrefixIcon,
+    size: legacyIconSize
+  }), legacyPrefix && /*#__PURE__*/React.createElement("span", null, legacyPrefix)) : null;
+
+  // 构建addonAfter内容
+  var innerAfter = legacySuffix || legacySuffixIcon ? /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex',
+      alignItems: 'center'
+    }
+  }, legacySuffix && /*#__PURE__*/React.createElement("span", null, legacySuffix), legacySuffixIcon && /*#__PURE__*/createElement(_Icon, {
+    type: legacySuffixIcon,
+    size: legacyIconSize
+  })) : null;
+  var nextProps = _extends({}, _otherProps);
+  if (hasClear !== undefined) nextProps.hasClear = hasClear;
+  if (readOnly !== undefined) nextProps.readOnly = readOnly;
+  if (hasBorder !== undefined) nextProps.hasBorder = hasBorder;
+
+  // 仅在用户未显式传 innerBefore/innerAfter 时，才使用旧属性构造的内容
+  if (innerBefore && nextProps.innerBefore == null) nextProps.innerBefore = innerBefore;
+  if (innerAfter && nextProps.innerAfter == null) nextProps.innerAfter = innerAfter;
+  if (onClick) nextProps.onClick = onClick;
+  if (children != null) nextProps.children = children;
+  if (onChange) nextProps.onChange = onChange;
+  if (onClear) nextProps.onClear = onClear;
+  if (onPressEnter) nextProps.onPressEnter = onPressEnter;
+  if (onFocus) nextProps.onFocus = onFocus;
+  if (onBlur) nextProps.onBlur = onBlur;
+
+  // Next Input 通过 `'value' in props` 判断是否受控。
+  // 低代码场景下 value 可能为 undefined（表达式未初始化），此时传入 value 会导致“受控但不更新”，表现为无法输入/无法联动。
+  // 因此仅在 value 非 null/undefined 时才下传 value。
+  if (value !== undefined && value !== null) {
+    nextProps.value = value;
+    // 受控模式下避免同时存在 defaultValue
+    if ('defaultValue' in nextProps) {
+      delete nextProps.defaultValue;
+    }
+  }
+  return /*#__PURE__*/createElement(NextInput, nextProps);
+};
+Input.displayName = 'Input';
+export default Input;

package/es/components/integral-task/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * 标签tag
+ */
+import IntegralTask from './integral-task';
+export type { IntegralTaskProps } from './integral-task';
+export default IntegralTask;

package/es/components/integral-task/index.js

@@ -0,0 +1,5 @@
+/**
+ * 标签tag
+ */
+import IntegralTask from "./integral-task";
+export default IntegralTask;

package/es/components/integral-task/index.scss

@@ -0,0 +1,35 @@
+.integral-task__container {
+  padding: 0 12px;
+  &__item {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    &__left {
+      display: flex;
+      align-items: center;
+      &__img {
+        width: 53px;
+        height: 53px;
+        margin-right: 9px;
+      }
+      &__content {
+        &__title {
+          font-size: 15px;
+          color: #333333;
+        }
+        &__integral {
+          display: flex;
+          align-items: center;
+          &--icon {
+            width: 15px;
+            height: 15px;
+          }
+          &--number {
+            font-size: 12px;
+            color: #EA6A3D;
+          }
+        }
+      }
+    }
+  }
+}

package/es/components/integral-task/integral-task.d.ts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import './index.scss';
+interface DataProps {
+    /**
+     * 任务名称
+     */
+    name: string;
+    /**
+     * 积分
+     */
+    integral: number;
+    /**
+     * 状态 0 未完成 1 已完成
+     */
+    status: number;
+}
+export interface IntegralTaskProps {
+    /**
+     * 任务名称
+     */
+    list: DataProps[];
+    /**
+     * 图标
+     */
+    icon: string;
+    /**
+     * 图片
+     */
+    images: string[];
+    /**
+     * 完成文案
+     */
+    completeLabel: string;
+    /**
+     * 未完成文案
+     */
+    undoneLabel: string;
+}
+declare const IntegralTask: React.FC<IntegralTaskProps>;
+export default IntegralTask;

package/es/components/integral-task/integral-task.js

@@ -0,0 +1,54 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["list", "icon", "images", "undoneLabel", "completeLabel", "children"];
+import * as React from 'react';
+import "./index.scss";
+import { convertChildren } from "../../utils/children-node-handle";
+var Status = /*#__PURE__*/function (Status) {
+  Status[Status["undone"] = 0] = "undone";
+  Status[Status["complete"] = 1] = "complete";
+  return Status;
+}(Status || {});
+var IntegralTask = function IntegralTask(_ref) {
+  var list = _ref.list,
+    icon = _ref.icon,
+    images = _ref.images,
+    undoneLabel = _ref.undoneLabel,
+    completeLabel = _ref.completeLabel,
+    children = _ref.children,
+    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+  console.log(images, 'images');
+  images = images || [];
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: "integral-task__container"
+  }, otherProps), list && list.length ? list.map(function (item, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "integral-task__container__item"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "integral-task__container__item__left"
+    }, convertChildren(children, 'image-left', {
+      src: images[index % images.length],
+      className: 'integral-task__container__item__left__img'
+    }), /*#__PURE__*/React.createElement("div", {
+      className: "integral-task__container__item__left__content"
+    }, convertChildren(children, 'title', {
+      children: item.name,
+      className: 'integral-task__container__item__left__content__title'
+    }), /*#__PURE__*/React.createElement("div", {
+      className: "integral-task__container__item__left__content__integral"
+    }, icon ? convertChildren(children, 'image-icon', {
+      src: icon,
+      className: 'integral-task__container__item__left__content__integral--icon'
+    }) : '', convertChildren(children, 'integral', {
+      children: item.integral + ' 积分',
+      className: 'integral-task__container__item__left__content__integral--number'
+    })))), /*#__PURE__*/React.createElement("div", {
+      className: "integral-task__container__item__right"
+    }, convertChildren(children, 'button2', {
+      children: item.integral + ' 积分',
+      name: item.status === Status.undone ? undoneLabel : completeLabel,
+      color: Status[item.status]
+    })));
+  }) : '暂无数据');
+};
+export default IntegralTask;

package/es/components/member-card/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * 菜单列表
+ */
+import MemberCard from './member-card';
+export type { MemberInfoModel } from './type';
+export { MemberCard };

package/es/components/member-card/index.js

@@ -0,0 +1,6 @@
+/**
+ * 菜单列表
+ */
+
+import MemberCard from "./member-card";
+export { MemberCard };

package/es/components/member-card/index.scss

@@ -0,0 +1,86 @@
+.member-card {
+  width: 100%;
+  //height: 60px;
+  border-radius: 15px;
+  display: flex;
+  justify-content: start;
+  align-items: center;
+  flex-direction: column;
+  background: white;
+  padding: 13px 20px;
+
+  .header {
+    width: 100%;
+    padding-bottom: 2px;
+    display: flex;
+    justify-content: space-between;
+
+    .left {
+      font-weight: bold;
+      font-size: 15px;
+      color: #333333;
+      display: flex;
+      align-items: center;
+
+      .grade {
+        width: 53px;
+        height: 13px;
+        margin-left: 5px;
+      }
+    }
+
+    .btn-tag {
+      //width: 74px;
+      height: 30px;
+      border-radius: 15px;
+      font-size: 12px;
+      font-weight: bold;
+      color: #63421a;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+  }
+
+  .footer {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    .progress-bar-container {
+      width: 100%;
+      margin: 2px 0;
+
+      .progress-bar-background {
+        width: 100%;
+        height: 15px;
+        background-color: #FEF1E6;
+        border-radius: 10px;
+        overflow: hidden;
+      }
+
+      .progress-bar-foreground {
+        height: 100%;
+        background-color: #FF5E27;
+        border-radius: 10px;
+        transition: width 0.3s ease-in-out;
+      }
+    }
+
+    .right {
+      font-weight: 500;
+      font-size: 12px;
+      color: #999999;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      .img {
+        width: 6px;
+        height: 7px;
+        margin-left: 5px;
+      }
+    }
+  }
+}

package/es/components/member-card/member-card.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './index.scss';
+import { MemberInfoModel } from "./type";
+declare const MemberCard: React.FC<MemberInfoModel>;
+export default MemberCard;

package/es/components/member-card/member-card.js

@@ -0,0 +1,68 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["userName", "gradeImg", "isMaxLevel", "maxTotal", "currentNum", "isFastExpireCoupon", "discount", "handleClick", "handleCouponClick"];
+import React, { useMemo } from 'react';
+import "./index.scss";
+import arrowImg from "../../assets/icon/mine/right.png";
+var MemberCard = function MemberCard(_ref) {
+  var userName = _ref.userName,
+    gradeImg = _ref.gradeImg,
+    isMaxLevel = _ref.isMaxLevel,
+    maxTotal = _ref.maxTotal,
+    currentNum = _ref.currentNum,
+    isFastExpireCoupon = _ref.isFastExpireCoupon,
+    discount = _ref.discount,
+    _ref$handleClick = _ref.handleClick,
+    handleClick = _ref$handleClick === void 0 ? function () {} : _ref$handleClick,
+    _ref$handleCouponClic = _ref.handleCouponClick,
+    handleCouponClick = _ref$handleCouponClic === void 0 ? function () {} : _ref$handleCouponClic,
+    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var _otherProps = otherProps || {};
+
+  // 计算进度百分比 使用 useMemo 来模拟计算属性
+  var progressPercentage = useMemo(function () {
+    if (isMaxLevel) return 100;
+    if (maxTotal === 0) return 0; // 防止除以零错误
+    if (!maxTotal || !currentNum) return 0;
+    return (currentNum / maxTotal * 100).toFixed(2); // 保留两位小数
+  }, [isMaxLevel, maxTotal, currentNum]);
+
+  // 外层容器的宽度
+  var containerWidth = isFastExpireCoupon ? '60%' : '100%';
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: "member-card"
+  }, _otherProps, {
+    onClick: handleClick
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "header"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "left"
+  }, /*#__PURE__*/React.createElement("span", null, userName), gradeImg && /*#__PURE__*/React.createElement("img", {
+    className: "grade",
+    src: gradeImg
+  })), discount && /*#__PURE__*/React.createElement("div", {
+    className: "btn-tag"
+  }, "\u5C0A\u4EAB", discount !== null && discount !== void 0 ? discount : 0, "\u6298")), /*#__PURE__*/React.createElement("div", {
+    className: "footer"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "progress-bar-container",
+    style: {
+      width: containerWidth
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "progress-bar-background"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "progress-bar-foreground",
+    style: {
+      width: progressPercentage + "%"
+    }
+  }))), isFastExpireCoupon && /*#__PURE__*/React.createElement("div", {
+    className: "right",
+    onClick: handleCouponClick
+  }, "\u60A8\u6709\u4F18\u60E0\u5238\u5373\u5C06\u5230\u671F", /*#__PURE__*/React.createElement("img", {
+    className: "img",
+    src: arrowImg
+  }))));
+};
+MemberCard.displayName = 'MemberCard';
+export default MemberCard;

package/es/components/member-card/type.d.ts

@@ -0,0 +1,11 @@
+export interface MemberInfoModel {
+    userName: string;
+    discount: string | number;
+    maxTotal: number;
+    currentNum: number;
+    isMaxLevel: boolean;
+    gradeImg: string;
+    isFastExpireCoupon: boolean;
+    handleClick?: () => void;
+    handleCouponClick?: () => void;
+}

package/es/components/member-card/type.js

@@ -0,0 +1 @@
+export {};

package/es/components/menu-list/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * 菜单列表
+ */
+import MenuList from './menu-list';
+export type { MenuListDataProps, MenuListProps } from './types';
+export default MenuList;

package/es/components/menu-list/index.js

@@ -0,0 +1,6 @@
+/**
+ * 菜单列表
+ */
+
+import MenuList from "./menu-list";
+export default MenuList;

package/es/components/menu-list/index.scss

@@ -0,0 +1,16 @@
+@import '../../variables.scss';
+
+.menu-list__panel {
+  border-radius: 10px;
+  background-color: white;
+
+  .menu-list__panel__item-list {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    padding: 1px 22px;
+  }
+
+}
+
+

package/es/components/menu-list/menu-list-item.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { MenuListDataProps } from "./types";
+import "./menu-list-item.scss";
+declare const MenuListItem: React.FC<MenuListDataProps>;
+export default MenuListItem;

package/es/components/menu-list/menu-list-item.js

@@ -0,0 +1,32 @@
+import React from 'react';
+import "./menu-list-item.scss";
+var MenuListItem = function MenuListItem(_ref) {
+  var _ref$title = _ref.title,
+    title = _ref$title === void 0 ? '菜单名称' : _ref$title,
+    _ref$iconUrl = _ref.iconUrl,
+    iconUrl = _ref$iconUrl === void 0 ? '' : _ref$iconUrl,
+    handleClick = _ref.handleClick;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "menu-list__panel__item",
+    onClick: handleClick
+  }, iconUrl ? /*#__PURE__*/React.createElement("div", {
+    className: "menu-list__panel__item_icon"
+  }, /*#__PURE__*/React.createElement("img", {
+    alt: "",
+    src: iconUrl
+  })) : null, /*#__PURE__*/React.createElement("div", {
+    className: "menu-list__panel__item_title"
+  }, title), /*#__PURE__*/React.createElement("div", {
+    className: "menu-list__panel__item_right"
+  }, /*#__PURE__*/React.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "32",
+    height: "32",
+    viewBox: "0 0 32 32"
+  }, /*#__PURE__*/React.createElement("path", {
+    fill: "currentColor",
+    d: "M22 16L12 26l-1.4-1.4l8.6-8.6l-8.6-8.6L12 6z"
+  }))));
+};
+MenuListItem.displayName = 'MenuListItem';
+export default MenuListItem;

package/es/components/menu-list/menu-list-item.scss

@@ -0,0 +1,49 @@
+@import '../../variables.scss';
+
+.menu-list__panel__item {
+  display: flex;
+  gap: 7px;
+  justify-content: space-between;
+  align-items: center;
+  height: 45px;
+
+  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+
+  &:last-child {
+    border-bottom: none;
+  }
+
+  .menu-list__panel__item_icon {
+    height: 100%;
+    display: flex;
+    align-items: center;
+
+    & > img {
+      height: 15px;
+    }
+  }
+
+  .menu-list__panel__item_title {
+    font-size: 15px;
+    color: #666666;
+    font-weight: 500;
+    margin-right: auto;
+  }
+
+  .menu-list__panel__item_right {
+    height: 100%;
+    display: flex;
+    align-items: center;
+
+    & > svg {
+      height: 16px;
+      font-size: 12px;
+      color: #666666;
+      font-weight: 500;
+    }
+
+
+  }
+
+
+}

package/es/components/menu-list/menu-list.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './index.scss';
+import { MenuListProps } from "./types";
+declare const MenuList: React.FC<MenuListProps>;
+export default MenuList;

package/es/components/menu-list/menu-list.js

@@ -0,0 +1,25 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["dataList"];
+import React from 'react';
+import "./index.scss";
+import MenuListItem from "./menu-list-item";
+var MenuList = function MenuList(_ref) {
+  var dataList = _ref.dataList,
+    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var _otherProps = otherProps || {};
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: "menu-list__panel"
+  }, _otherProps), /*#__PURE__*/React.createElement("div", {
+    className: "menu-list__panel__item-list"
+  }, dataList.map(function (item, index) {
+    return /*#__PURE__*/React.createElement(MenuListItem, {
+      key: index,
+      title: item.title,
+      iconUrl: item.iconUrl,
+      handleClick: item.handleClick
+    });
+  })));
+};
+MenuList.displayName = 'MenuList';
+export default MenuList;

package/es/components/menu-list/types.d.ts

@@ -0,0 +1,23 @@
+/**
+ * 数据
+ */
+export interface MenuListDataProps {
+    /**
+     * 菜单名称
+     */
+    title: string;
+    /**
+     * 菜单图标地址
+     */
+    iconUrl?: string;
+    /**
+     * 点击事件
+     */
+    handleClick?: Function;
+}
+export interface MenuListProps {
+    /**
+     * 数据
+     */
+    dataList?: MenuListDataProps[];
+}

package/es/components/menu-list/types.js

@@ -0,0 +1 @@
+export {};