@dckj-npm/dc-material 0.1.41 → 0.1.43

package/es/components/bottom-navigation/bottom-navigation.d.ts

@@ -1,15 +1,15 @@
-import * as React from 'react';
-import './index.scss';
-interface Navigation {
-    text: string;
-    icon: string;
-    selectedIcon: string;
-    pageId: string;
-}
-export interface NavigationProps {
-    itemArray: Navigation[];
-    selectedColor: string;
-    onClick?: (pageId: string) => void;
-}
-declare const Navigation: React.FC<NavigationProps>;
-export default Navigation;
+import * as React from 'react';
+import './index.scss';
+interface Navigation {
+    text: string;
+    icon: string;
+    selectedIcon: string;
+    pageId: string;
+}
+export interface NavigationProps {
+    itemArray: Navigation[];
+    selectedColor: string;
+    onClick?: (pageId: string) => void;
+}
+declare const Navigation: React.FC<NavigationProps>;
+export default Navigation;

package/es/components/bottom-navigation/index.d.ts

@@ -1,3 +1,3 @@
-import Navigation from './bottom-navigation';
-export type { NavigationProps } from './bottom-navigation';
-export default Navigation;
+import Navigation from './bottom-navigation';
+export type { NavigationProps } from './bottom-navigation';
+export default Navigation;

package/es/components/bottom-navigation/index.scss

@@ -1,24 +1,24 @@
-.navigation-panel {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 9px 0px 6px 0px;
-  width: 100%;
-  position: fixed;
-  left: 0;
-  bottom: 0;
-  background-color: #fff;
-  box-sizing: border-box;
-  z-index: 10;
-  &-item {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    cursor: pointer;
-    flex: 1;
-    .navigation-item-image {
-      margin-bottom: 3px;
-    }
-  }
-}
+.navigation-panel {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 9px 0px 6px 0px;
+  width: 100%;
+  position: fixed;
+  left: 0;
+  bottom: 0;
+  background-color: #fff;
+  box-sizing: border-box;
+  z-index: 10;
+  &-item {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    cursor: pointer;
+    flex: 1;
+    .navigation-item-image {
+      margin-bottom: 3px;
+    }
+  }
+}

package/es/components/button/button.d.ts

@@ -1,14 +1,14 @@
-import * as React from 'react';
-import './index.scss';
-export interface ButtonProps {
-    /**
-     * 标签名称
-     */
-    name: string;
-    /**
-     * 标签颜色
-     */
-    color: string;
-}
-declare const Button: React.FC<ButtonProps>;
-export default Button;
+import * as React from 'react';
+import './index.scss';
+export interface ButtonProps {
+    /**
+     * 标签名称
+     */
+    name: string;
+    /**
+     * 标签颜色
+     */
+    color: string;
+}
+declare const Button: React.FC<ButtonProps>;
+export default Button;

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

@@ -1,6 +1,6 @@
-/**
- * 标签tag
- */
-import Button from './button';
-export type { ButtonProps } from './button';
-export default Button;
+/**
+ * 标签tag
+ */
+import Button from './button';
+export type { ButtonProps } from './button';
+export default Button;

package/es/components/button/index.js

@@ -1,5 +1,5 @@
-/**
- * 标签tag
+/**
+ * 标签tag
  */
 import Button from "./button";
 export default Button;

package/es/components/button/index.scss

@@ -1,16 +1,16 @@
-.button__container {
-  padding: 9px 15px;
-  border-radius: 15px;
-  color: white;
-  font-size: 14px;
-}
-.complete {
-  color: #fff;
-  background-color: rgba(233, 110, 65, 1);
-}
-
-.undone {
-  color: rgba(233, 110, 65, 1);
-  background-color: #fff;
-  border: 1px solid rgba(233, 110, 65, 1);
-}
+.button__container {
+  padding: 9px 15px;
+  border-radius: 15px;
+  color: white;
+  font-size: 14px;
+}
+.complete {
+  color: #fff;
+  background-color: rgba(233, 110, 65, 1);
+}
+
+.undone {
+  color: rgba(233, 110, 65, 1);
+  background-color: #fff;
+  border: 1px solid rgba(233, 110, 65, 1);
+}

package/es/components/carousel/carousel.d.ts

@@ -1,14 +1,14 @@
-import React from 'react';
-import './carousel.scss';
-export interface CarouselProps {
-    /**
-     * 图片列表
-     */
-    images: string[];
-    /**
-     * 定时播放的时间
-     */
-    interval?: number;
-}
-declare const Carousel: React.FC<CarouselProps>;
-export default Carousel;
+import React from 'react';
+import './carousel.scss';
+export interface CarouselProps {
+    /**
+     * 图片列表
+     */
+    images: string[];
+    /**
+     * 定时播放的时间
+     */
+    interval?: number;
+}
+declare const Carousel: React.FC<CarouselProps>;
+export default Carousel;

package/es/components/carousel/carousel.scss

@@ -1,32 +1,32 @@
-.carousel {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-}
-
-.carousel-track {
-  display: flex;
-  width: 100%;
-  height: 100%;
-}
-
-.carousel-image {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-  object-position: center;
-}
-
-.carousel-counter {
-  position: absolute;
-  bottom: 2px;
-  right: 2px;
-  color: white;
-  background: rgba(0, 0, 0, 0.5);
-  padding: 2px 8px;
-  border-radius: 5px;
-  font-size: 12px;
-  display: flex;
-  gap: 2px;
-}
+.carousel {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+.carousel-track {
+  display: flex;
+  width: 100%;
+  height: 100%;
+}
+
+.carousel-image {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  object-position: center;
+}
+
+.carousel-counter {
+  position: absolute;
+  bottom: 2px;
+  right: 2px;
+  color: white;
+  background: rgba(0, 0, 0, 0.5);
+  padding: 2px 8px;
+  border-radius: 5px;
+  font-size: 12px;
+  display: flex;
+  gap: 2px;
+}

package/es/components/colorful-button/colorful-button.d.ts

@@ -1,12 +1,12 @@
-import * as React from 'react';
-import './index.scss';
-export interface ColorfulButtonProps {
-    /**
-     * 类型
-     */
-    type?: "primary" | "secondary" | "normal";
-    color?: string;
-    style?: object;
-}
-declare const ColorfulButton: React.FC<ColorfulButtonProps>;
-export default ColorfulButton;
+import * as React from 'react';
+import './index.scss';
+export interface ColorfulButtonProps {
+    /**
+     * 类型
+     */
+    type?: "primary" | "secondary" | "normal";
+    color?: string;
+    style?: object;
+}
+declare const ColorfulButton: React.FC<ColorfulButtonProps>;
+export default ColorfulButton;

package/es/components/colorful-button/index.d.ts

@@ -1,3 +1,3 @@
-import ColorfulButton from './colorful-button';
-export type { ColorfulButtonProps } from './colorful-button';
-export default ColorfulButton;
+import ColorfulButton from './colorful-button';
+export type { ColorfulButtonProps } from './colorful-button';
+export default ColorfulButton;

package/es/components/colorful-button/index.scss

@@ -1,5 +1,5 @@
-@import '../../variables.scss';
-
-#{$biz-css-prefix}-colorful-button {
-  border: 2px dashed blue;
-}
+@import '../../variables.scss';
+
+#{$biz-css-prefix}-colorful-button {
+  border: 2px dashed blue;
+}

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

@@ -1,8 +1,8 @@
-import * as React from 'react';
-import './index.scss';
-export interface ColorfulInputProps {
-    color?: string;
-    style?: object;
-}
-declare const ColorfulInput: React.FC<ColorfulInputProps>;
-export default ColorfulInput;
+import * as React from 'react';
+import './index.scss';
+export interface ColorfulInputProps {
+    color?: string;
+    style?: object;
+}
+declare const ColorfulInput: React.FC<ColorfulInputProps>;
+export default ColorfulInput;

package/es/components/colorful-input/index.d.ts

@@ -1,3 +1,3 @@
-import ColorfulInput from './colorful-input';
-export type { ColorfulInputProps } from './colorful-input';
-export default ColorfulInput;
+import ColorfulInput from './colorful-input';
+export type { ColorfulInputProps } from './colorful-input';
+export default ColorfulInput;

package/es/components/colorful-input/index.scss

@@ -1,5 +1,5 @@
-@import '../../variables.scss';
-
-#{$biz-css-prefix}-colorful-button {
-  border: 2px dashed blue;
-}
+@import '../../variables.scss';
+
+#{$biz-css-prefix}-colorful-button {
+  border: 2px dashed blue;
+}

package/es/components/goods-card-list/goods-card-list-common.d.ts

@@ -0,0 +1,5 @@
+import type { GoodsCardListProps } from './types';
+import React from 'react';
+import './goods-card-list-common.scss';
+declare const GoodsCardListCommon: React.FC<GoodsCardListProps>;
+export default GoodsCardListCommon;

package/es/components/goods-card-list/goods-card-list-common.js

@@ -0,0 +1,60 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["dataList", "maxSales", "onClick"];
+import React from 'react';
+import Carousel from "../carousel/carousel";
+import "./goods-card-list-common.scss";
+var GoodsCardListCommon = function GoodsCardListCommon(_ref) {
+  var _ref$dataList = _ref.dataList,
+    dataList = _ref$dataList === void 0 ? [] : _ref$dataList,
+    _ref$maxSales = _ref.maxSales,
+    maxSales = _ref$maxSales === void 0 ? 1000 : _ref$maxSales,
+    _ref$onClick = _ref.onClick,
+    _onClick = _ref$onClick === void 0 ? function () {} : _ref$onClick,
+    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var _otherProps = otherProps || {};
+  var resolveResultDesc = function resolveResultDesc(desc) {
+    var htmlString = "<div>" + desc + "</div>";
+    // 创建一个虚拟的 DOM 容器
+    var tempDiv = document.createElement('div');
+    tempDiv.innerHTML = htmlString;
+    // 提取文本
+    return tempDiv.textContent || tempDiv.innerText;
+  };
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: "card-list-goods-common__container"
+  }, _otherProps), dataList.map(function (item) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: item.key,
+      className: "card-list-goods__item",
+      onClick: function onClick() {
+        return _onClick(item);
+      }
+    }, item.imageList && item.imageList.length > 0 && /*#__PURE__*/React.createElement("div", {
+      className: "card-list-goods__image"
+    }, /*#__PURE__*/React.createElement(Carousel, {
+      images: item.imageList,
+      interval: 3000
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "card-list-goods__content"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "card-list-goods__title"
+    }, item.title), /*#__PURE__*/React.createElement("div", {
+      className: "card-list-goods__desc"
+    }, resolveResultDesc(item.desc)), /*#__PURE__*/React.createElement("div", {
+      className: "card-list-goods__bottom"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "card-list-goods__unit"
+    }, "\uFFE5"), /*#__PURE__*/React.createElement("div", {
+      className: "card-list-goods__price"
+    }, item.activePrice || item.price), item.activePrice && /*#__PURE__*/React.createElement("div", {
+      className: "card-list-goods__unit__delete"
+    }, "\uFFE5"), item.activePrice && /*#__PURE__*/React.createElement("div", {
+      className: "card-list-goods__price__delete"
+    }, item.price), /*#__PURE__*/React.createElement("div", {
+      className: "card-list-goods__sales"
+    }, "\u5DF2\u552E", item.sales > maxSales ? maxSales + "+" : item.sales))));
+  }));
+};
+GoodsCardListCommon.displayName = 'GoodsCardListCommon';
+export default GoodsCardListCommon;

package/es/components/goods-card-list/goods-card-list-common.scss

@@ -0,0 +1,118 @@
+.card-list-goods-common__container {
+  display: grid;
+  grid-template-columns:repeat(2, minmax(0, 1fr));
+  row-gap: 12px;
+  column-gap: 10px;
+  width: 100%;
+
+  & > .card-list-goods__item {
+    box-sizing: border-box;
+    transition: top 0.35s ease, left 0.35s ease, width 0.35s ease;
+    overflow: hidden;
+    border-radius: 8px;
+    box-shadow: 0 3px 9px 1px rgba(204, 204, 204, 0.35);
+
+    & > .card-list-goods__image {
+      height: 200px;
+      width: 100%;
+      overflow: hidden;
+      display: flex;
+
+      & > img {
+        height: 100%;
+        width: 100%;
+        object-fit: cover;
+        //object-position: center;
+        object-position: 50% 50%;
+      }
+    }
+
+    & > .card-list-goods__content {
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      padding: 0.5rem;
+
+      .card-list-goods__title {
+        overflow: hidden;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 2;
+        line-clamp: 2;
+        margin-top: 0.25rem;
+        margin-bottom: 0.25rem;
+        font-size: 14px;
+        font-weight: 700;
+      }
+
+      .card-list-goods__desc {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        line-clamp: 2;
+        margin-top: 0.25rem;
+        margin-bottom: 0.25rem;
+        font-size: 12px;
+        color: #333333;
+      }
+
+      .card-list-goods__bottom {
+        margin-top: 0.25rem;
+        margin-bottom: 0.25rem;
+        display: flex;
+        align-items: baseline;
+        flex-wrap: wrap;
+        row-gap: 0.5rem;
+
+        & > div {
+          display: flex;
+        }
+
+        .card-list-goods__unit {
+          font-size: 12px;
+          color: #F57D51;
+          font-weight: 700;
+          line-height: 1;
+
+          &__delete {
+            margin-left: 0;
+            font-size: 14px;
+            color: #666666;
+            line-height: 1;
+            text-decoration: line-through
+          }
+
+        }
+
+        .card-list-goods__price {
+          font-size: 17px;
+          color: #F57D51;
+          font-weight: 700;
+          line-height: 1;
+
+          &__delete {
+            margin-left: 0;
+            font-size: 14px;
+            color: #666666;
+            line-height: 1;
+            text-decoration: line-through
+          }
+        }
+
+        .card-list-goods__sales {
+          margin-left: 3px;
+          font-size: 12px;
+          color: #666666;
+          line-height: 1;
+        }
+
+      }
+
+    }
+
+  }
+
+}
+
+
+

package/es/components/goods-card-list/goods-card-list.d.ts

@@ -1,5 +1,5 @@
-import type { GoodsCardListProps } from './types';
-import React from 'react';
-import './goods-card-list.scss';
-declare const GoodsCardList: React.FC<GoodsCardListProps>;
-export default GoodsCardList;
+import type { GoodsCardListProps } from './types';
+import React from 'react';
+import './goods-card-list.scss';
+declare const GoodsCardList: React.FC<GoodsCardListProps>;
+export default GoodsCardList;