ronds-metadata 1.1.24 → 1.1.27

package/es/comps/Editable/DataCell/ButtonCell.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { EditableCellProps } from '../interface';
+declare function Index(props: EditableCellProps): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof Index>;
+export default _default;

package/es/comps/Editable/DataCell/ButtonCell.js

@@ -0,0 +1,45 @@
+import "antd/es/form/style";
+import _Form from "antd/es/form";
+import "antd/es/button/style";
+import _Button from "antd/es/button";
+
+/*
+ * @Author: wangxian
+ * @Date: 2022-03-04 14:53:50
+ * @LastEditTime: 2022-07-08 08:57:41
+ */
+import React from 'react';
+import { SettingOutlined } from '@ant-design/icons';
+import { EditableContext } from '../interface';
+
+function Index(props) {
+  var dataIndex = props.dataIndex,
+      record = props.record,
+      disabled = props.disabled;
+
+  var _ref = React.useContext(EditableContext) || undefined,
+      editableStream = _ref.editableStream,
+      editConfig = _ref.editConfig;
+
+  var onClick = function onClick(e) {
+    e.stopPropagation();
+    editableStream && editableStream.next({
+      type: 'onButtonCellClick',
+      payload: record
+    });
+  };
+
+  return /*#__PURE__*/React.createElement(_Form.Item, {
+    name: dataIndex,
+    style: {
+      margin: 0
+    }
+  }, /*#__PURE__*/React.createElement(_Button, {
+    type: "link",
+    disabled: editConfig.type === 'edit' ? disabled : false,
+    onClick: onClick,
+    icon: /*#__PURE__*/React.createElement(SettingOutlined, null)
+  }));
+}
+
+export default /*#__PURE__*/React.memo(Index);

package/es/comps/Editable/DataCell/ColorPicker.js

@@ -6,46 +6,24 @@ import _Input from "antd/es/input";
 /*
  * @Author: wangxian
  * @Date: 2022-03-04 14:53:50
- * @LastEditTime: 2022-07-06 14:32:00
+ * @LastEditTime: 2022-07-07 08:45:08
  */
 import React from 'react';
 import { EditableContext } from '../interface';
 
 function Index(props) {
   var dataIndex = props.dataIndex,
-      rowIndex = props.rowIndex,
       disabled = props.disabled;
 
   var _ref = React.useContext(EditableContext) || undefined,
       editConfig = _ref.editConfig;
 
-  var inputRef = React.useRef();
-  var firstLoadRef = React.useRef(true);
-  React.useEffect(function () {
-    var _editConfig$editCellK, _editConfig$editCellK2;
-
-    if (!inputRef.current) return;
-
-    if (((_editConfig$editCellK = editConfig.editCellKey) === null || _editConfig$editCellK === void 0 ? void 0 : _editConfig$editCellK.dataIndex) === dataIndex && ((_editConfig$editCellK2 = editConfig.editCellKey) === null || _editConfig$editCellK2 === void 0 ? void 0 : _editConfig$editCellK2.rowIndex) === rowIndex) {
-      if (firstLoadRef.current) {
-        var _inputRef$current$sta, _inputRef$current$sta2;
-
-        // 选中内容
-        inputRef.current.input.setSelectionRange(0, ((_inputRef$current$sta = inputRef.current.state) === null || _inputRef$current$sta === void 0 ? void 0 : (_inputRef$current$sta2 = _inputRef$current$sta.value) === null || _inputRef$current$sta2 === void 0 ? void 0 : _inputRef$current$sta2.length) || 0);
-        firstLoadRef.current = false;
-      } // 设置焦点
-
-
-      inputRef.current.focus();
-    }
-  }, [editConfig]);
   return /*#__PURE__*/React.createElement(_Form.Item, {
     name: dataIndex,
     style: {
       margin: 0
     }
   }, /*#__PURE__*/React.createElement(_Input, {
-    ref: inputRef,
     type: "color",
     size: "small",
     disabled: editConfig.type === 'edit' ? disabled : false

package/es/comps/Editable/index.d.ts

@@ -41,6 +41,10 @@ interface IEditableProps<R = any> {
      * 每行确认回调函数
      */
     onRowClick?: (record: any) => void;
+    /**
+     * 表格按钮点击事件
+     */
+    onButtonCellClick?: (record: any) => void;
     /**
      * 每行确认回调函数
      */

package/es/comps/Editable/index.js

@@ -34,6 +34,7 @@ var Editable = function Editable(props) {
       isAddColumn = _props$isAddColumn === void 0 ? false : _props$isAddColumn,
       tableProps = props.tableProps,
       onRowClick = props.onRowClick,
+      onButtonCellClick = props.onButtonCellClick,
       onRowConfirm = props.onRowConfirm,
       onRowDelete = props.onRowDelete,
       onMulChange = props.onMulChange,
@@ -125,6 +126,10 @@ var Editable = function Editable(props) {
         onRowClick && onRowClick(data.payload);
         break;
 
+      case 'onButtonCellClick':
+        onButtonCellClick && onButtonCellClick(data.payload);
+        break;
+
       case 'onSingleSave':
         if (lastValueRef.current && lastValueRef.current.rowIdx === data.payload._rowKey_) {
           onRowConfirm && onRowConfirm({

package/es/comps/Editable/utils.js

@@ -1,7 +1,7 @@
 /*
  * @Author: wangxian
  * @Date: 2022-03-04 14:59:04
- * @LastEditTime: 2022-07-06 14:27:13
+ * @LastEditTime: 2022-07-07 08:35:35
  */
 import React from 'react';
 import Input from './DataCell/Input';
@@ -9,12 +9,14 @@ import Number from './DataCell/Number';
 import Select from './DataCell/Select';
 import Switch from './DataCell/Switch';
 import ColorPicker from './DataCell/ColorPicker';
+import ButtonCell from './DataCell/ButtonCell';
 var DataCellMap = {
   text: Input,
   number: Number,
   enum: Select,
   bool: Switch,
-  colorPicker: ColorPicker
+  colorPicker: ColorPicker,
+  buttonCell: ButtonCell
 };
 export function getDataCell(item) {
   if (item.type && DataCellMap[item.type]) {

package/es/comps/MetadataForm/DataCell/layout/TableArray.js

@@ -13,7 +13,7 @@ import Editable from '../../../../comps/Editable';
 import useObservable from '../../../../framework/rxjs-hooks/useObservable';
 import { MetadataFormContext } from '../../interface';
 import { getLabelByProps } from '../../utils';
-import { deepClone } from '@/utils';
+import { deepClone } from '../../../../utils';
 
 var TableArray = function TableArray(props) {
   var initValue = props.initValue,
@@ -125,18 +125,18 @@ var TableArray = function TableArray(props) {
       firstLoadRef.current = false;
     }
   }, [initValue, form]);
-  var processEnumData = React.useCallback(function (data) {
-    var _data$fields$, _data$fields$$value, _data$fields$$value$e;
+  var processEnumData = React.useCallback(function (data, _extraInfo) {
+    var _extraInfo$enum;
 
     var _options = [];
 
     var _enum = deepClone(data.enum || []); // 扩展规则的value
 
 
-    if (data === null || data === void 0 ? void 0 : (_data$fields$ = data.fields[0]) === null || _data$fields$ === void 0 ? void 0 : (_data$fields$$value = _data$fields$.value) === null || _data$fields$$value === void 0 ? void 0 : (_data$fields$$value$e = _data$fields$$value.enum) === null || _data$fields$$value$e === void 0 ? void 0 : _data$fields$$value$e.value) {
-      var _data$fields$2, _data$fields$2$value, _data$fields$2$value$;
+    if (_extraInfo === null || _extraInfo === void 0 ? void 0 : (_extraInfo$enum = _extraInfo.enum) === null || _extraInfo$enum === void 0 ? void 0 : _extraInfo$enum.value) {
+      var _extraInfo$enum2;
 
-      _enum = deepClone(data === null || data === void 0 ? void 0 : (_data$fields$2 = data.fields[0]) === null || _data$fields$2 === void 0 ? void 0 : (_data$fields$2$value = _data$fields$2.value) === null || _data$fields$2$value === void 0 ? void 0 : (_data$fields$2$value$ = _data$fields$2$value.enum) === null || _data$fields$2$value$ === void 0 ? void 0 : _data$fields$2$value$.value);
+      _enum = deepClone(_extraInfo === null || _extraInfo === void 0 ? void 0 : (_extraInfo$enum2 = _extraInfo.enum) === null || _extraInfo$enum2 === void 0 ? void 0 : _extraInfo$enum2.value);
     }
 
     _enum.forEach(function (it) {
@@ -150,22 +150,31 @@ var TableArray = function TableArray(props) {
 
     return _options;
   }, []);
+  var processColumnType = React.useCallback(function (data, _extraInfo) {
+    var _extraInfo$text;
+
+    if (data.type === 'text' && ((_extraInfo$text = _extraInfo.text) === null || _extraInfo$text === void 0 ? void 0 : _extraInfo$text.type)) {
+      var _extraInfo$text2;
+
+      return (_extraInfo$text2 = _extraInfo.text) === null || _extraInfo$text2 === void 0 ? void 0 : _extraInfo$text2.type;
+    }
+
+    return data.type;
+  }, []);
   var processSchemaToColumns = React.useCallback(function (_properties) {
     var _columns = [];
 
     for (var i = 0; i < _properties.length; i++) {
-      var _extraInfo$text;
-
       var it = _properties[i];
       var extraInfo = refFieldsRef.current.get(it.id);
       var obj = {
         title: getLabelByProps(it),
         key: it.id,
         dataIndex: it.id,
-        width: 100,
+        width: processColumnType(it, extraInfo) === 'buttonCell' ? 60 : 100,
         editable: true,
-        type: it.type === 'text' && (extraInfo === null || extraInfo === void 0 ? void 0 : (_extraInfo$text = extraInfo.text) === null || _extraInfo$text === void 0 ? void 0 : _extraInfo$text.type) === 'colorPicker' ? 'colorPicker' : it.type,
-        enum: it.type === 'enum' ? processEnumData(it) : undefined
+        type: processColumnType(it, extraInfo),
+        enum: it.type === 'enum' ? processEnumData(it, extraInfo) : undefined
       };
 
       _columns.push(obj);
@@ -187,6 +196,13 @@ var TableArray = function TableArray(props) {
     form.setFieldsValue(_objectSpread({}, _defineProperty({}, "".concat(name), values)));
   };
 
+  var onButtonCellClick = function onButtonCellClick(record) {
+    formContext.stream$.next({
+      type: 'onButtonCellClick',
+      payload: record
+    });
+  };
+
   return /*#__PURE__*/React.createElement("div", {
     style: {
       width: '100%',
@@ -204,6 +220,7 @@ var TableArray = function TableArray(props) {
     columns: columns,
     dataSource: list,
     onMulChange: onTableChange,
+    onButtonCellClick: onButtonCellClick,
     tableProps: {
       scroll: {
         x: '100%',

package/es/comps/MetadataForm/index.d.ts

@@ -50,6 +50,10 @@ interface IMetadataFormProps {
      * select选择的回调
      */
     onSelectChange?: (changedValues: any) => void;
+    /**
+     * select选择的回调
+     */
+    onCellButtonClick?: (changedValues: any) => void;
 }
 declare const MetadataForm: (props: IMetadataFormProps) => JSX.Element;
 export default MetadataForm;

package/es/comps/MetadataForm/index.js

@@ -32,7 +32,8 @@ var MetadataForm = function MetadataForm(props) {
       onFinish = props.onFinish,
       getFormInstance = props.getFormInstance,
       onValuesChange = props.onValuesChange,
-      onSelectChange = props.onSelectChange;
+      onSelectChange = props.onSelectChange,
+      onCellButtonClick = props.onCellButtonClick;
 
   var _React$useState = React.useState([]),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -55,6 +56,8 @@ var MetadataForm = function MetadataForm(props) {
   useObservable(function (p) {
     if ((p === null || p === void 0 ? void 0 : p.type) === 'onSelectChange') {
       onSelectChange && onSelectChange(p.payload);
+    } else if ((p === null || p === void 0 ? void 0 : p.type) === 'onButtonCellClick') {
+      onCellButtonClick && onCellButtonClick(p.payload);
     }
   }, [stream$]);
   var options = React.useMemo(function () {

package/package.json

@@ -1,7 +1,7 @@
 {
   "public": true,
   "name": "ronds-metadata",
-  "version": "1.1.24",
+  "version": "1.1.27",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",