@dckj-npm/dc-material 0.1.145 → 0.1.147

package/es/components/form/form-item.js

@@ -0,0 +1,79 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _Upload from "@alifd/next/es/upload";
+import _Form from "@alifd/next/es/form";
+import _Icon from "@alifd/next/es/icon";
+import _Input from "@alifd/next/es/input";
+var _excluded = ["columnComment", "columnType", "columnKeyType", "columnKeyTypeEnum", "isOnlyRead", "isRequired", "defaultValue", "guideWords", "onClick"];
+import React, { useState } from 'react';
+import "./form-item.scss";
+var Input = _Input,
+  Icon = _Icon,
+  Form = _Form,
+  Upload = _Upload;
+var Item = Form.Item;
+var DCFormItem = function DCFormItem(_ref) {
+  var columnComment = _ref.columnComment,
+    columnType = _ref.columnType,
+    columnKeyType = _ref.columnKeyType,
+    columnKeyTypeEnum = _ref.columnKeyTypeEnum,
+    isOnlyRead = _ref.isOnlyRead,
+    isRequired = _ref.isRequired,
+    defaultValue = _ref.defaultValue,
+    guideWords = _ref.guideWords,
+    _ref$onClick = _ref.onClick,
+    onClick = _ref$onClick === void 0 ? function () {} : _ref$onClick,
+    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var _otherProps = otherProps || {};
+  console.log();
+  // 使用 useState 来管理输入框的值
+  var _useState = useState(defaultValue),
+    value = _useState[0],
+    setValue = _useState[1];
+
+  // 动态渲染内容
+  var renderContent = function renderContent() {
+    switch (columnKeyTypeEnum.name) {
+      case '单行文本':
+      case '联系人':
+      case '手机':
+      case '邮箱':
+        // 文本框
+        return /*#__PURE__*/React.createElement(Input, {
+          value: value,
+          placeholder: guideWords || '请输入',
+          onChange: function onChange(v, e) {
+            return setValue(e.target.value);
+          },
+          style: {
+            textAlign: 'right'
+          }
+        });
+      case '图片':
+        return /*#__PURE__*/React.createElement(Upload.Card, {
+          listType: "card",
+          action: "https://www.easy-mock.com/mock/5b713974309d0d7d107a74a3/alifd/upload",
+          accept: "image/png, image/jpg, image/jpeg, image/gif, image/bmp",
+          reUpload: true,
+          style: {
+            width: '90px',
+            height: '90px'
+          }
+        });
+      case '多行文本':
+        return /*#__PURE__*/React.createElement(Input.TextArea, {
+          value: value,
+          placeholder: guideWords || '请输入'
+        });
+      default:
+        return /*#__PURE__*/React.createElement("span", null, guideWords || '未定义的类型');
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    "class": "form-item"
+  }, /*#__PURE__*/React.cloneElement(renderContent()));
+};
+var RefDCFormItem = /*#__PURE__*/React.forwardRef(DCFormItem);
+RefDCFormItem.displayName = 'DCFormItem';
+RefDCFormItem.defaultProps = {};
+RefDCFormItem.propTypes = {};
+export default RefDCFormItem;

package/es/components/form/form-item.scss

@@ -0,0 +1,20 @@
+.form-item {
+    input {
+        outline: none;
+        border: none;
+        text-align: right;
+    }
+    .next-input {
+        border: none !important;
+    }
+    :global{
+        .next-input {
+            outline: none;
+            border: none !important;
+        }
+    }
+    .next-upload-card {
+        width: 90px;
+        height: 90px;
+    }
+}

package/lowcode_es/meta.js

@@ -95,7 +95,7 @@ function fillRealVersion(meta, packageName, version, basicLibraryVersion) {
     packageName = '@dckj-npm/dc-material';
   }
   if (version === void 0) {
-    version = '0.1.145';
+    version = '0.1.147';
   }
   if (basicLibraryVersion === void 0) {
     basicLibraryVersion = {

package/lowcode_lib/meta.js

@@ -100,7 +100,7 @@ function fillRealVersion(meta, packageName, version, basicLibraryVersion) {
     packageName = '@dckj-npm/dc-material';
   }
   if (version === void 0) {
-    version = '0.1.145';
+    version = '0.1.147';
   }
   if (basicLibraryVersion === void 0) {
     basicLibraryVersion = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dckj-npm/dc-material",
-  "version": "0.1.145",
+  "version": "0.1.147",
   "description": "dc低代码物料",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -103,7 +103,7 @@
   },
   "componentConfig": {
     "isComponentLibrary": true,
-    "materialSchema": "https://unpkg.com/@dckj-npm/dc-material@0.1.145/build/lowcode/assets-prod.json"
+    "materialSchema": "https://unpkg.com/@dckj-npm/dc-material@0.1.147/build/lowcode/assets-prod.json"
   },
   "lcMeta": {
     "type": "component"

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

@@ -1,60 +0,0 @@
-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

@@ -1,118 +0,0 @@
-.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.js

@@ -1,156 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["dataList", "maxSales", "onClick"];
-import React, { useEffect, useState } from 'react';
-import { debounce } from "../../utils/debounce";
-import Carousel from "../carousel/carousel";
-import "./goods-card-list.scss";
-var GoodsCardList = function GoodsCardList(_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 _useState = useState([]),
-    positions = _useState[0],
-    setPositions = _useState[1];
-  var _useState2 = useState(0),
-    columnWidth = _useState2[0],
-    setColumnWidth = _useState2[1];
-  var _useState3 = useState(0),
-    maxContainerHeight = _useState3[0],
-    setMaxContainerHeight = _useState3[1];
-  useEffect(function () {
-    var updateLayout = function updateLayout() {
-      var container = document.querySelector('.waterfall-container');
-      if (container) {
-        var itemElements = document.querySelectorAll('.waterfall-item');
-        // 横向间距
-        var horizontalGap = 12;
-        // 纵向间距
-        var verticalGap = 10;
-        var containerWidth = container.offsetWidth;
-        // 每列宽度为容器宽度的一半减去间距
-        var calculatedColumnWidth = (containerWidth - horizontalGap) / 2;
-        setColumnWidth(calculatedColumnWidth);
-        // 两列布局
-        var columnHeights = Array.from({
-          length: 2
-        }).fill(0);
-        var newPositions = [];
-        // 循环计算所有的子元素的信息
-        itemElements.forEach(function (item) {
-          var _item$getBoundingClie = item.getBoundingClientRect(),
-            height = _item$getBoundingClie.height;
-          // 找到最短的那一列
-          var minHeight = Math.min.apply(Math, columnHeights);
-          // 获取该列的索引
-          var columnIndex = columnHeights.indexOf(minHeight);
-          var left = columnIndex * (calculatedColumnWidth + horizontalGap);
-          var top = columnHeights[columnIndex];
-          // 存储元素的定位
-          newPositions.push({
-            left: left,
-            top: top
-          });
-          // 更新该列的高度
-          columnHeights[columnIndex] += height + verticalGap;
-        });
-        // 更新位置
-        setPositions(newPositions);
-        setMaxContainerHeight(Math.max.apply(Math, columnHeights));
-      }
-    };
-    var debouncedUpdateLayout = dataList.length < 15 ? updateLayout : debounce(updateLayout, 200);
-    // 图片加载完成后更新布局
-    var handleImageLoad = function handleImageLoad() {
-      debouncedUpdateLayout();
-    };
-    // 初始化布局
-    debouncedUpdateLayout();
-    // 监听图片加载事件，以确保所有图片都加载完后再更新布局
-    var images = document.querySelectorAll('.waterfall-container img');
-    images.forEach(function (img) {
-      // 如果图片已经加载完成（缓存中加载），则立即更新布局
-      if (img.complete) {
-        handleImageLoad();
-      } else {
-        // 如果图片未加载完成，监听加载事件
-        img.addEventListener('load', handleImageLoad);
-      }
-    });
-
-    // 窗口变化时更新布局
-    window.addEventListener('resize', debouncedUpdateLayout);
-    return function () {
-      // 清理事件监听
-      window.removeEventListener('resize', debouncedUpdateLayout);
-      images.forEach(function (img) {
-        return img.removeEventListener('load', handleImageLoad);
-      });
-    };
-  },
-  // 当 dataList 变化时重新计算
-  [dataList]);
-  var resolveResultDesc = function resolveResultDesc(desc) {
-    var htmlString = "<div>" + desc + "</div>";
-    // 创建一个虚拟的 DOM 容器
-    var tempDiv = document.createElement('div');
-    tempDiv.innerHTML = htmlString;
-    // 提取文本
-    return tempDiv.textContent || tempDiv.innerText;
-  };
-  var resultStyle = _extends({}, otherProps.style || {}, {
-    height: maxContainerHeight + 20 + "px"
-  });
-  var _otherProps = _extends({}, otherProps || {}, {
-    style: resultStyle
-  });
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: "card-list-goods__container waterfall-container",
-    style: {
-      height: maxContainerHeight + 20 + "px"
-    }
-  }, _otherProps), dataList.map(function (item, index) {
-    var _positions$index, _positions$index2;
-    return /*#__PURE__*/React.createElement("div", {
-      key: item.key,
-      className: "card-list-goods__item waterfall-item",
-      onClick: function onClick() {
-        return _onClick(item);
-      },
-      style: {
-        left: ((_positions$index = positions[index]) === null || _positions$index === void 0 ? void 0 : _positions$index.left) + "px",
-        top: ((_positions$index2 = positions[index]) === null || _positions$index2 === void 0 ? void 0 : _positions$index2.top) + "px",
-        width: columnWidth + "px"
-      }
-    }, 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))));
-  }));
-};
-GoodsCardList.displayName = 'GoodsCardList';
-export default GoodsCardList;

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

@@ -1,112 +0,0 @@
-.card-list-goods__container {
-  position: relative;
-  width: 100%;
-
-  & > .card-list-goods__item {
-    position: absolute;
-    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;
-      }
-    }
-
-    & > .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/index.js

@@ -1,3 +0,0 @@
-import GoodsCardList from "./goods-card-list";
-import GoodsCardListCommon from "./goods-card-list-common";
-export { GoodsCardList, GoodsCardListCommon };

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

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