@dckj-npm/dc-material 0.1.357 → 0.1.359

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/es/components/form/form.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import './index.scss';
+import '@wangeditor/editor/dist/css/style.css';
+import { ColumnType } from '../../entity/dynamic-column-data-type';
+export interface FormProps {
+    /**
+     * 数据
+     */
+    dataList?: ColumnType[];
+    /**
+     * 点击事件
+     * @param e
+     */
+    onClick?: (e: any) => void;
+    /**
+     * 子节点
+     */
+    children: React.ReactChild;
+}
+declare const Form: React.FC<FormProps>;
+export default Form;

package/es/components/form/form.js

@@ -0,0 +1,382 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _Upload from "@alifd/next/es/upload";
+import _Checkbox from "@alifd/next/es/checkbox";
+import _Radio from "@alifd/next/es/radio";
+import _Input from "@alifd/next/es/input";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _Form from "@alifd/next/es/form";
+var _excluded = ["dataList", "onClick", "children"];
+import React, { useEffect, useState } from 'react';
+import "./index.scss";
+// import { default as FormItem } from './form-item'
+// import { convertChildren } from '../../utils/children-node-handle'
+// import DCFormItem from './form-item.tsx'
+
+import '@wangeditor/editor/dist/css/style.css'; // 引入 css
+import { Editor, Toolbar } from '@wangeditor/editor-for-react';
+import { DYNAMIC_COLUMN_DATA_TYPE_BUTTON, DYNAMIC_COLUMN_DATA_TYPE_AUTO, DYNAMIC_COLUMN_DATA_TYPE_TEXT, DYNAMIC_COLUMN_DATA_TYPE_TEXTAREA, DYNAMIC_COLUMN_DATA_TYPE_MOBILE, DYNAMIC_COLUMN_DATA_TYPE_INT, DYNAMIC_COLUMN_DATA_TYPE_EMAIL, DYNAMIC_COLUMN_DATA_TYPE_ID_CARD, DYNAMIC_COLUMN_DATA_TYPE_NUMBER, DYNAMIC_COLUMN_DATA_TYPE_LABEL, DYNAMIC_COLUMN_DATA_TYPE_RADIO, DYNAMIC_COLUMN_DATA_TYPE_CHECKBOX, DYNAMIC_COLUMN_DATA_TYPE_ATTACHMENTS, DYNAMIC_COLUMN_DATA_TYPE_DOC, DYNAMIC_COLUMN_DATA_TYPE_PICTURE, DYNAMIC_COLUMN_DATA_TYPE_VIDEO, DYNAMIC_COLUMN_DATA_TYPE_AUDIO, DYNAMIC_COLUMN_DATA_TYPE_EDITOR } from "../../entity/dynamic-column-data-type";
+import arrowRight from "../../assets/icon/form/right.png";
+var FormItem = _Form.Item;
+var Form = function Form(_ref) {
+  var dataList = _ref.dataList,
+    _ref$onClick = _ref.onClick,
+    onClick = _ref$onClick === void 0 ? function () {} : _ref$onClick,
+    children = _ref.children,
+    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var _otherProps = otherProps || {};
+  dataList = [{
+    id: '1042530112370774016',
+    fkTableId: '1042530097875259392',
+    tableName: 'dynamic_tb_lpjs',
+    columnName: 'pic',
+    selectActionType: 0,
+    selectActionTypeEnum: {
+      code: 0,
+      name: '无',
+      action: '',
+      label: '',
+      key: '',
+      ordinal: 0
+    },
+    selectAction: '',
+    selectActionValue: '',
+    selectActionLabel: '',
+    selectActionLabelArr: [],
+    columnKeyType: 31,
+    columnKeyTypeEnum: {
+      code: 31,
+      name: '富文本',
+      dbTypeName: 'longtext',
+      ordinal: 25
+    },
+    columnType: 'longtext',
+    columnSize: 0,
+    columnDecimal: 0,
+    defaultValue: '',
+    defaultValueType: 0,
+    defaultValueTypeEnum: {
+      code: 0,
+      name: '无',
+      ordinal: 0
+    },
+    isRequired: 0,
+    isRequiredEnum: {
+      code: 0,
+      name: '否',
+      ordinal: 0
+    },
+    columnComment: '图片',
+    linkageColumn: '',
+    linkageTable: '',
+    linkageTableColumn: '',
+    showAddType: 1,
+    showAddTypeEnum: {
+      code: 1,
+      name: '是'
+    },
+    showUpdateType: 1,
+    showUpdateTypeEnum: {
+      code: 1,
+      name: '是'
+    },
+    showListType: 0,
+    showListTypeEnum: {
+      code: 0,
+      name: '否'
+    },
+    showViewType: 1,
+    showViewTypeEnum: {
+      code: 1,
+      name: '是'
+    },
+    searchType: 0,
+    searchTypeEnum: {
+      code: 0,
+      name: '不显示',
+      ordinal: 0
+    },
+    updateType: 0,
+    updateTypeEnum: {
+      code: 0,
+      name: '否'
+    },
+    scoreCode: 4,
+    fieldWidth: 0,
+    listWidth: '0',
+    fieldSuffix: '',
+    fieldPrefix: '',
+    fieldDescription: '',
+    guideWords: '请输入退伍军人证',
+    fieldValidation: '',
+    fieldValidationType: '自定义',
+    inputFormat: 'jpg,jpeg,png,bmp,gif',
+    optionType: 1,
+    optionTypeEnum: {
+      code: 1,
+      name: '单选',
+      ordinal: 1
+    },
+    fileMaxSize: 5,
+    fileMinSize: 0,
+    joinTable: '',
+    joinColumn: '',
+    showCondition: '',
+    validationMax: '0',
+    validationMin: '0',
+    validationUnique: 0,
+    validationUniqueEnum: {
+      code: 0,
+      name: '否'
+    },
+    showStyle: '',
+    handler: '0',
+    propList: [{
+      id: '1048584180847480832',
+      propName: 'updateType',
+      propValue: '0'
+    }, {
+      id: '1048584180730040320',
+      propName: 'searchType',
+      propValue: '0'
+    }, {
+      id: '1048584180608405504',
+      propName: 'columnType',
+      propValue: 'longtext'
+    }, {
+      id: '1048584180495159296',
+      propName: 'defaultValueType',
+      propValue: '0'
+    }, {
+      id: '1048584180365135872',
+      propName: 'validationMax',
+      propValue: '0'
+    }, {
+      id: '1048584180235112448',
+      propName: 'validationMin',
+      propValue: '0'
+    }, {
+      id: '1048584180142837760',
+      propName: 'showViewType',
+      propValue: '1'
+    }, {
+      id: '1048584179996037120',
+      propName: 'showUpdateType',
+      propValue: '1'
+    }, {
+      id: '1048584179878596608',
+      propName: 'showAddType',
+      propValue: '1'
+    }, {
+      id: '1048584179740184576',
+      propName: 'showListType',
+      propValue: '0'
+    }, {
+      id: '1048584179622744064',
+      propName: 'handler',
+      propValue: '0'
+    }, {
+      id: '1050823809420103680',
+      propName: 'columnComment',
+      propValue: '图片'
+    }, {
+      id: '1050823809323634688',
+      propName: 'isRequired',
+      propValue: '0'
+    }, {
+      id: '1050823809222971392',
+      propName: 'scoreCode',
+      propValue: '4'
+    }]
+  }];
+  // 筛选字段(去除按钮类型和自动生成的类型)
+  dataList = dataList ? dataList.filter(function (item) {
+    return item.columnKeyType !== DYNAMIC_COLUMN_DATA_TYPE_BUTTON.code && item.columnKeyType !== DYNAMIC_COLUMN_DATA_TYPE_AUTO.code && item.columnComment !== '乐观锁' && item.columnComment !== '是否删除';
+  }) : [];
+  console.log('dataList', dataList);
+
+  // editor 实例
+  var _useState = useState(null),
+    editor = _useState[0],
+    setEditor = _useState[1]; // TS 语法
+  // const [editor, setEditor] = useState(null)                   // JS 语法
+
+  // 编辑器内容
+  var _useState2 = useState('<p>hello</p>'),
+    html = _useState2[0],
+    setHtml = _useState2[1];
+
+  // 模拟 ajax 请求，异步设置 html
+  useEffect(function () {
+    setTimeout(function () {
+      setHtml('<p>hello world</p>');
+    }, 1500);
+  }, []);
+
+  // 工具栏配置
+  var toolbarConfig = {}; // TS 语法
+  // const toolbarConfig = { }                        // JS 语法
+
+  // 编辑器配置
+  var editorConfig = {
+    // TS 语法
+    // const editorConfig = {                         // JS 语法
+    placeholder: '请输入内容...'
+  };
+
+  // 及时销毁 editor ，重要！
+  useEffect(function () {
+    return function () {
+      if (editor == null) return;
+      editor.destroy();
+      setEditor(null);
+    };
+  }, [editor]);
+  var renderFormTypeContent = function renderFormTypeContent(data) {
+    switch (data.columnKeyType) {
+      // 输入框
+      case DYNAMIC_COLUMN_DATA_TYPE_TEXT.code:
+      case DYNAMIC_COLUMN_DATA_TYPE_INT.code:
+      case DYNAMIC_COLUMN_DATA_TYPE_MOBILE.code:
+      case DYNAMIC_COLUMN_DATA_TYPE_NUMBER.code:
+      case DYNAMIC_COLUMN_DATA_TYPE_ID_CARD.code:
+      case DYNAMIC_COLUMN_DATA_TYPE_EMAIL.code:
+      case DYNAMIC_COLUMN_DATA_TYPE_LABEL.code:
+        return /*#__PURE__*/React.createElement("div", {
+          style: {
+            width: '100%',
+            display: 'flex'
+          }
+        }, /*#__PURE__*/React.createElement("div", {
+          style: {
+            color: '#999'
+          }
+        }, data.guideWords), /*#__PURE__*/React.createElement("img", {
+          style: {
+            width: '15px'
+          },
+          src: arrowRight,
+          alt: ""
+        }));
+      // 多行文本
+      case DYNAMIC_COLUMN_DATA_TYPE_TEXTAREA.code:
+        return /*#__PURE__*/React.createElement("div", {
+          style: {
+            width: '100%'
+          }
+        }, /*#__PURE__*/React.createElement(_Input.TextArea, {
+          style: {
+            width: '100%'
+          },
+          hasClear: true,
+          placeholder: data.guideWords
+        }));
+      // 单选框
+      case DYNAMIC_COLUMN_DATA_TYPE_RADIO.code:
+        return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(_Radio.Group, {
+          defaultValue: data.defaultValue
+        }, data.columnOptionList ? data.columnOptionList.map(function (item) {
+          return /*#__PURE__*/React.createElement(_Radio, {
+            id: item.optionName,
+            value: item.optionValue
+          }, item.optionName);
+        }) : /*#__PURE__*/React.createElement("div", null)));
+      // 复选框
+      case DYNAMIC_COLUMN_DATA_TYPE_CHECKBOX.code:
+        return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(_Checkbox.Group, {
+          defaultValue: data.defaultValue.split(',')[0]
+        }, data.columnOptionList ? data.columnOptionList.map(function (item) {
+          return /*#__PURE__*/React.createElement(_Checkbox, {
+            id: item.optionName,
+            value: item.optionValue
+          }, item.optionName);
+        }) : /*#__PURE__*/React.createElement("div", null)));
+      // 附件,图片，音频，视频，文档
+      case DYNAMIC_COLUMN_DATA_TYPE_ATTACHMENTS.code:
+      case DYNAMIC_COLUMN_DATA_TYPE_DOC.code:
+      case DYNAMIC_COLUMN_DATA_TYPE_PICTURE.code:
+      case DYNAMIC_COLUMN_DATA_TYPE_VIDEO.code:
+      case DYNAMIC_COLUMN_DATA_TYPE_AUDIO.code:
+        return /*#__PURE__*/React.createElement("div", {
+          style: {
+            display: 'flex'
+          }
+        }, /*#__PURE__*/React.createElement(_Upload.Card, {
+          listType: "card",
+          accept: "image/png, image/jpg, image/jpeg, image/gif, image/bmp"
+        }));
+      // 富文本
+      case DYNAMIC_COLUMN_DATA_TYPE_EDITOR.code:
+        return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+          style: {
+            border: '1px solid #ccc',
+            zIndex: 100
+          }
+        }, /*#__PURE__*/React.createElement(Toolbar, {
+          editor: editor,
+          defaultConfig: toolbarConfig,
+          mode: "default",
+          style: {
+            borderBottom: '1px solid #ccc'
+          }
+        }), /*#__PURE__*/React.createElement(Editor, {
+          defaultConfig: editorConfig,
+          value: html,
+          onCreated: setEditor,
+          onChange: function onChange(editor) {
+            return setHtml(editor.getHtml());
+          },
+          mode: "default",
+          style: {
+            height: '500px',
+            overflowY: 'hidden'
+          }
+        })));
+      default:
+        return /*#__PURE__*/React.createElement("div", {
+          style: {
+            width: '100%',
+            display: 'flex'
+          }
+        }, /*#__PURE__*/React.createElement("div", {
+          style: {
+            color: '#999'
+          }
+        }, data.guideWords), /*#__PURE__*/React.createElement("img", {
+          style: {
+            width: '15px'
+          },
+          src: arrowRight,
+          alt: ""
+        }));
+    }
+  };
+  return /*#__PURE__*/React.createElement(_Form, _extends({
+    className: "form__panel",
+    isPreview: "false"
+  }, _otherProps), dataList ? dataList.map(function (item, index) {
+    var labelAlign = item.columnKeyTypeEnum.name === '图片' || item.columnKeyTypeEnum.name === '多行文本' || item.columnKeyTypeEnum.name === '附件' || item.columnKeyTypeEnum.name === '富文本' ? 'top' : 'left';
+    var isFlexStyle = labelAlign === 'top' ? {} : {
+      display: 'flex'
+    };
+    return /*#__PURE__*/React.createElement(FormItem, {
+      key: index,
+      label: item.columnComment,
+      labelAlign: labelAlign,
+      style: isFlexStyle
+    }, /*#__PURE__*/React.cloneElement(renderFormTypeContent(item)));
+  }) : /*#__PURE__*/React.createElement("div", null, "\u6682\u65E0\u8868\u5355\u9879"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      width: '100%',
+      display: 'flex',
+      justifyContent: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(_Form.Submit, {
+    style: {
+      width: '90%'
+    },
+    type: "primary",
+    validate: true
+  }, "\u63D0\u4EA4")));
+};
+Form.displayName = 'Form';
+export default Form;

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

@@ -0,0 +1,6 @@
+/**
+ * 表单
+ */
+import Form from './form';
+export type { FormProps } from './form';
+export { Form };

package/es/components/form/index.js

@@ -0,0 +1,6 @@
+/**
+ * 表单
+ */
+
+import Form from "./form";
+export { Form };

package/es/components/form/index.scss

@@ -0,0 +1,22 @@
+.form__panel {
+    background-color: #FAFAFA;
+    .next-left {
+        display: flex;
+    }
+    .next-form-item {
+        // display: flex;
+        justify-content: space-between;
+        align-items: center;
+        // min-height: 44px;
+        background-color: #fff;
+        border-radius: 8px;
+        padding: 10px 15px;
+        margin-bottom: 14px;
+        .next-form-item-label {
+            font-size: 15px;
+            color: #333333;
+            font-weight: 500;
+        }
+    }
+    
+}

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;