@zat-design/sisyphus-react 3.0.13

package/lib/old/ProEnumSelectModal/index.js

@@ -0,0 +1,220 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _icons = require("@ant-design/icons");
+var _antd = require("antd");
+var _lodash = require("lodash");
+var _react = _interopRequireWildcard(require("react"));
+var _index = require("../../index");
+var _useRequestList2 = _interopRequireDefault(require("./hooks/useRequestList"));
+/**
+ * 枚举选择弹框
+ * @param title 弹窗标题
+ * @param placeholder 提示语
+ * @param columns 提示语
+ * @param service 数据请求
+ * @param queryConditionColumns 查询条件表单配置
+ */
+var ProEnumSelectModal = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var value = _ref.value,
+    onChange = _ref.onChange,
+    _ref$readOnly = _ref.readOnly,
+    readOnly = _ref$readOnly === void 0 ? true : _ref$readOnly,
+    disabled = _ref.disabled,
+    placeholder = _ref.placeholder,
+    formatter = _ref.formatter,
+    modalProps = _ref.modalProps;
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    onOff = _useState2[0],
+    setOnOff = _useState2[1];
+  var _useState3 = (0, _react.useState)(false),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    visible = _useState4[0],
+    setVisible = _useState4[1];
+  var _useState5 = (0, _react.useState)([]),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    selectedRows = _useState6[0],
+    setSelectedRows = _useState6[1];
+  var _useState7 = (0, _react.useState)([]),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    selectedRowKeys = _useState8[0],
+    setSelectedRowKeys = _useState8[1];
+  var title = modalProps.title,
+    _modalProps$rowKey = modalProps.rowKey,
+    rowKey = _modalProps$rowKey === void 0 ? 'id' : _modalProps$rowKey,
+    _modalProps$rowSelect = modalProps.rowSelectionType,
+    rowSelectionType = _modalProps$rowSelect === void 0 ? 'radio' : _modalProps$rowSelect,
+    _modalProps$checkedRo = modalProps.checkedRows,
+    checkedRows = _modalProps$checkedRo === void 0 ? [] : _modalProps$checkedRo,
+    columns = modalProps.columns,
+    service = modalProps.service,
+    onFinish = modalProps.onFinish,
+    queryConditionColumns = modalProps.queryConditionColumns,
+    otherServiceParams = modalProps.otherServiceParams,
+    transformDataSource = modalProps.transformDataSource,
+    withPagination = modalProps.withPagination;
+  var _Form$useForm = _antd.Form.useForm(),
+    _Form$useForm2 = (0, _slicedToArray2.default)(_Form$useForm, 1),
+    form = _Form$useForm2[0];
+  var _useRequestList = (0, _useRequestList2.default)(service, {
+      withPagination: withPagination,
+      transformDataSource: transformDataSource,
+      condition: otherServiceParams
+    }),
+    data = _useRequestList.data,
+    loading = _useRequestList.loading,
+    pagination = _useRequestList.pagination,
+    onSearch = _useRequestList.onSearch,
+    onReset = _useRequestList.onReset;
+  // 是否多选
+  var isMultiple = rowSelectionType === 'checkbox';
+  var handleChangeValue = function handleChangeValue(e) {
+    onChange(e.target.value);
+  };
+  // 清空表单项
+  var handleClearValue = function handleClearValue() {
+    onChange('');
+  };
+  var handleClick = function handleClick() {
+    if (disabled) return null;
+    setOnOff(true);
+  };
+  var handleClose = function handleClose() {
+    setOnOff(false);
+    setVisible(false);
+    // 重置已勾选选项
+    // setSelectedRows([]);
+    // setSelectedRowKeys([]);
+    form.resetFields();
+  };
+  var handleFinish = function handleFinish() {
+    if (!selectedRows.length) {
+      _antd.message.error('请先勾选');
+      return false;
+    }
+    // @ts-ignore
+    var formatterValueArr = selectedRows.map(function (row) {
+      return formatter(row);
+    });
+    (formatterValueArr === null || formatterValueArr === void 0 ? void 0 : formatterValueArr.length) && onChange(formatterValueArr.join('，'));
+    onFinish === null || onFinish === void 0 ? void 0 : onFinish(selectedRows);
+    handleClose();
+  };
+  var handleSearch = function handleSearch(values) {
+    onSearch(values);
+  };
+  // 点击行进行勾选
+  var handleClickRow = function handleClickRow(record) {
+    var selectedValue = record[rowKey];
+    var tempSelectedRows = (0, _lodash.cloneDeep)(selectedRows);
+    var tempSelectedRowKeys = (0, _lodash.cloneDeep)(selectedRowKeys);
+    if (isMultiple) {
+      var rowIndex = tempSelectedRows.findIndex(function (item) {
+        return item[rowKey] === selectedValue;
+      });
+      var rowKeyIndex = tempSelectedRowKeys.findIndex(function (item) {
+        return item === selectedValue;
+      });
+      if (rowKeyIndex > -1) {
+        tempSelectedRows.splice(rowIndex, 1);
+        tempSelectedRowKeys.splice(rowKeyIndex, 1);
+      } else {
+        tempSelectedRows.push(record);
+        tempSelectedRowKeys.push(selectedValue);
+      }
+    } else {
+      tempSelectedRows = [record];
+      tempSelectedRowKeys = [selectedValue];
+    }
+    setSelectedRows(tempSelectedRows);
+    setSelectedRowKeys(tempSelectedRowKeys);
+  };
+  var rowSelection = {
+    type: rowSelectionType,
+    selectedRowKeys: selectedRowKeys,
+    onChange: function onChange(rowKeys, rows) {
+      setSelectedRows(rows);
+      setSelectedRowKeys(rowKeys);
+    },
+    getCheckboxProps: function getCheckboxProps() {
+      return {
+        disabled: false
+      };
+    }
+  };
+  (0, _react.useEffect)(function () {
+    if (checkedRows === null || checkedRows === void 0 ? void 0 : checkedRows.length) {
+      setSelectedRows(checkedRows);
+      setSelectedRowKeys(checkedRows.map(function (item) {
+        return item[rowKey];
+      }));
+    }
+  }, [checkedRows]);
+  (0, _react.useEffect)(function () {
+    if (onOff) {
+      onReset();
+      setVisible(true);
+    }
+  }, [onOff]);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_antd.Input, {
+    value: value,
+    readOnly: readOnly,
+    disabled: disabled,
+    placeholder: placeholder,
+    onClick: handleClick,
+    onChange: handleChangeValue,
+    className: "pro-enum-input",
+    suffix: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, value && !disabled && /*#__PURE__*/_react.default.createElement(_icons.CloseCircleOutlined, {
+      className: "close-icon",
+      onClick: handleClearValue
+    }), /*#__PURE__*/_react.default.createElement(_antd.Button, {
+      type: "link",
+      onClick: handleClick,
+      disabled: disabled,
+      style: {
+        padding: 0,
+        height: 'auto'
+      }
+    }, "\u9009\u62E9"))
+  }), onOff && /*#__PURE__*/_react.default.createElement(_antd.Modal, {
+    title: title,
+    width: "50%",
+    onOk: handleFinish,
+    onCancel: handleClose,
+    visible: visible,
+    className: "pro-enum-select"
+  }, /*#__PURE__*/_react.default.createElement(_index.ProForm, {
+    className: "pro-enum-select-modal-form",
+    form: form,
+    columns: queryConditionColumns,
+    onFinish: handleSearch
+  }), /*#__PURE__*/_react.default.createElement(_antd.Table, {
+    onRow: function onRow(record) {
+      return {
+        onClick: function onClick() {
+          return handleClickRow(record);
+        }
+      };
+    },
+    rowKey: rowKey,
+    loading: loading,
+    scroll: {
+      y: '250px'
+    },
+    // @ts-ignore
+    rowSelection: rowSelection,
+    columns: columns,
+    dataSource: data,
+    // @ts-ignore
+    pagination: pagination
+  })));
+});
+var _default = ProEnumSelectModal;
+exports.default = _default;

package/lib/old/ProEnumSelectModal/propsType.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from "react";
+export interface IPropsType {
+    value: string;
+    onChange: (value: string | undefined) => void;
+    readOnly?: boolean;
+    disabled?: boolean;
+    placeholder?: string;
+    formatter?: (value: object) => string;
+    modalProps: {
+        title: string | ReactNode;
+        rowKey: string;
+        rowSelectionType: string;
+        columns: any[];
+        service: any;
+        onFinish: (value: any) => void;
+        queryConditionColumns: any[];
+        otherServiceParams: any;
+        withPagination: boolean;
+        transformDataSource: (list: any[]) => any[];
+        checkedRows: any[];
+    };
+}

package/lib/old/ProEnumSelectModal/propsType.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/old/ProEnumSelectModal/style/index.less

@@ -0,0 +1,98 @@
+.pro-enum-input {
+  .close-icon {
+    margin          : 0 5px;
+    background-color: rgba(0, 0, 0, 0.25);
+    color           : white;
+    font-size       : var(--zaui-font-size-lg);
+    border          : none;
+    border-radius   : 50%;
+
+    &:hover {
+      transform: scale(1.2);
+    }
+  }
+}
+
+.pro-enum-select {
+  .pro-form {
+    .ant-form-item-label {
+      width       : var(--zaui-form-label-width, 112px);
+      max-width   : var(--zaui-form-label-width, 112px);
+      text-align  : left;
+      text-align  : var(--zaui-form-align, left);
+      white-space : pre-wrap;
+      line-height : 1;
+      overflow    : initial;
+      margin-right: 16px;
+      margin-right: calc(var(--zaui-height-size-md, 16px)*var(--zaui-size, 1))
+    }
+  }
+
+  :global {
+    .ant-table.ant-table-bordered>.ant-table-container {
+      border: 0;
+    }
+
+    .ant-table-thead>tr>th {
+      border          : 0;
+      white-space     : nowrap;
+      background-color: #F6F7F8;
+      padding         : var(--zaui-space-size-md);
+    }
+
+    .ant-table-thead>tr>th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before {
+      height: 0;
+    }
+
+    .ant-table-tbody>tr:not(.ant-table-placeholder)>td {
+      border-bottom: 0;
+      border-right : 0;
+      border-top   : 0;
+    }
+
+    .ant-table-tbody>tr:not(.ant-table-measure-row)>td {
+      border-bottom : 0;
+      vertical-align: top;
+      padding       : var(--zaui-space-size-md);
+    }
+
+    .ant-table-tbody tr:nth-child(n)>td {
+      background-color: var(--zaui-base-bg);
+    }
+
+    .ant-table-tbody tr:nth-child(2n)>td {
+      background-color: #FAFAFA;
+    }
+
+    .ant-table-tbody>.ant-table-placeholder>td {
+      background-color: var(--zaui-base-bg);
+    }
+
+    .ant-table-tbody {
+
+      >tr:hover:not(.ant-table-expanded-row, .ant-table-placeholder)>td,
+      .ant-table-row-hover,
+      .ant-table-row-hover>td {
+        background: #FAFAFA;
+      }
+    }
+
+    .ant-table-fixed {
+
+      .ant-table-row-hover,
+      .ant-table-row-hover>td {
+        background: #FAFAFA;
+      }
+    }
+
+    .ant-table-fixed-header {
+      .ant-table-tbody tr:nth-child(n)>td {
+        background-color: #FAFAFA;
+      }
+
+      .ant-table-tbody tr:nth-child(2n)>td {
+        background-color: var(--zaui-base-bg);
+      }
+    }
+  }
+}

package/lib/style/components.less

@@ -0,0 +1,18 @@
+@import '../ProDrawerForm/style/index';
+@import '../ProEditTable/style/index';
+@import '../ProEditLabel/style/index';
+@import '../ProForm/style/index';
+@import '../ProTable/style/index';
+@import '../ProTooltip/style/index';
+@import '../ProViewer/style/index';
+@import '../ProLayout/style/index';
+@import '../ProIcon/style/index';
+@import '../ProStep/style/index';
+@import '../ProTransferModal/style/index';
+@import '../Proform/components/base/FormList/style/index';
+@import '../ProForm/components/combination/ProTimeLimit/style/index';
+// old 待废弃
+@import '../old/ProEnumSelectModal/style/index';
+@import '../old/ProBackBtn/style/index';
+@import '../old/ProCustomColumn/style/index';
+@import '../old/ProEditableTable/style/index';

package/lib/style/core/compatible.less

@@ -0,0 +1,30 @@
+.ant-tabs-nav-list {
+  overflow: auto;
+}
+
+// 兼容IE11
+@media screen and(-ms-high-contrast: active),
+(-ms-high-contrast: none) {
+  .ant-form-item-control-input-content {
+    overflow: hidden;
+  }
+
+  // 解决popover表单压缩
+  .ant-popover {
+    .ant-form-item-control {
+      flex: auto;
+    }
+  }
+
+  .ant-tabs-tab {
+    display: inline-block;
+  }
+
+  /*  IE兼容  */
+  .ant-space {
+    width: 100% !important;
+  }
+
+}
+
+/*  IE兼容  */

package/lib/style/core/index.less

@@ -0,0 +1,3 @@
+@import './normalize.less';
+@import './compatible.less';
+@import './mixins.less';

package/lib/style/core/mixins.less

@@ -0,0 +1,70 @@
+// 清除浮动
+.clearfix() {
+  &:before,
+  &:after {
+    content: ' ';
+    display: table;
+  }
+
+  &:after {
+    clear: both;
+  }
+}
+
+// 水平居中
+.center-block() {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+// 尺码助手
+.size(@width, @height) {
+  width: @width;
+  height: @height;
+}
+
+.square(@size) {
+  .size(@size, @size);
+}
+
+// 可调整大小的文本区域
+.resizable(@direction: both) {
+  // Options: horizontal, vertical, both
+  resize: @direction;
+  // Safari fix
+  overflow: auto;
+}
+
+// 截断文本
+.text-truncate() {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+// mixins函数
+.set-text-color() {
+  color: @zaui-text;
+}
+
+.set-brand-color() {
+  color: @zaui-brand;
+}
+
+.set-disabled-color() {
+  color: @zaui-disabled-text !important;
+  background: @zaui-disabled-bg !important;
+}
+
+.set-text-size() {
+  font-size: @zaui-font-size;
+}
+
+.set-lg-text-size() {
+  font-size: calc(@zaui-font-size + 2px);
+}
+
+.set-sm-text-size() {
+  font-size: calc(@zaui-font-size - 2px);
+}

package/lib/style/core/normalize.less

@@ -0,0 +1,246 @@
+html,
+body,
+body div,
+span,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+abbr,
+address,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+samp,
+small,
+strong,
+sub,
+sup,
+var,
+b,
+i,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+figure,
+footer,
+header,
+menu,
+nav,
+section,
+time,
+mark,
+audio,
+video,
+details,
+summary {
+  margin        : 0;
+  padding       : 0;
+  font-family   : -apple-system, PingFang SC, "Helvetica Neue", Helvetica, "Hiragino Sans GB", "STHeitiSC-Light", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
+  vertical-align: baseline;
+  background    : transparent;
+  border        : 0;
+}
+
+tbody {
+  vertical-align: middle;
+}
+
+tr,
+th,
+td {
+  vertical-align: inherit;
+}
+
+main,
+article,
+aside,
+figure,
+footer,
+header,
+nav,
+section,
+details,
+summary {
+  display: block;
+}
+
+html {
+  box-sizing: border-box;
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: inherit;
+}
+
+img,
+object,
+embed {
+  max-width: 100%;
+}
+
+ul {
+  list-style: none;
+}
+
+blockquote,
+q {
+  quotes: none;
+}
+
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+  content: '';
+  content: none;
+}
+
+a {
+  margin        : 0;
+  padding       : 0;
+  font-size     : 100%;
+  vertical-align: baseline;
+  background    : transparent;
+}
+
+del {
+  text-decoration: line-through;
+}
+
+abbr[title],
+dfn[title] {
+  border-bottom: 1px dotted #000;
+  cursor       : help;
+}
+
+hr {
+  display   : block;
+  height    : 1px;
+  margin    : 1em 0;
+  padding   : 0;
+  border    : 0;
+  border-top: 1px solid #ccc;
+}
+
+input,
+select {
+  vertical-align: middle;
+}
+
+pre {
+  white-space: pre;
+  /* CSS2 */
+  white-space: pre-wrap;
+  /* CSS 2.1 */
+  white-space: pre-line;
+  /* CSS 3 (and 2.1 as well, actually) */
+  word-wrap  : break-word;
+}
+
+input[type='radio'] {
+  vertical-align: text-bottom;
+}
+
+input[type='checkbox'] {
+  vertical-align: bottom;
+}
+
+.ie7 input[type='checkbox'] {
+  vertical-align: baseline;
+}
+
+.ie6 input {
+  vertical-align: text-bottom;
+}
+
+select,
+input,
+textarea {
+  font: 99% sans-serif;
+}
+
+small {
+  font-size: 85%;
+}
+
+strong {
+  font-weight: bold;
+}
+
+sub,
+sup {
+  position   : relative;
+  font-size  : 75%;
+  line-height: 0;
+}
+
+sup {
+  top: -0.5em;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+pre,
+code,
+kbd,
+samp {
+  font-family: monospace, sans-serif;
+}
+
+.clickable,
+label,
+input[type='button'],
+input[type='submit'],
+input[type='file'],
+button {
+  cursor: pointer;
+}
+
+button,
+input,
+select,
+textarea {
+  margin: 0;
+}
+
+/* make buttons play nice in IE */
+button,
+input[type='button'] {
+  width   : auto;
+  overflow: visible;
+}

package/lib/style/index.less

@@ -0,0 +1,2 @@
+@import "./components.less";
+@import "./theme/antd.less";