@hw-component/form 1.4.2 → 1.4.5

package/es/Form/config.js

@@ -22,7 +22,7 @@ import TrimInput from '../Input/TrimInput.js';
 import TrimTextArea from '../TextArea/TrimTextArea.js';
 
 var placeholderConfig = {
-  inputType: ["input", "inputNumber", "selectInput", "buttonInput", "verificationCodeInput", "trimInput", "urlUpload"],
+  inputType: ["input", "inputNumber", "selectInput", "buttonInput", "verificationCodeInput", "trimInput", "urlUpload", "textArea"],
   selectType: ["select", "datePicker", "timePicker", "colorInput"]
 };
 var componentConfig = {

package/es/Select/components/AllSelect.js

@@ -1,9 +1,12 @@
 // welcome to hoo hoo hoo
 import 'core-js/modules/es.array.concat.js';
+import 'core-js/modules/es.array.filter.js';
+import 'core-js/modules/es.object.to-string.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { Space, Checkbox } from 'antd';
 import { itemOpProvider } from '../utils.js';
 import { useClassName } from '../../hooks/index.js';
+import { useMemo } from 'react';
 
 var useRootClassName = function useRootClassName(checked) {
   var norClassNames = ["select-item", "select-item-option"];
@@ -19,20 +22,31 @@ var Index = function Index(_ref) {
     _ref$fieldNames = _ref.fieldNames,
     fieldNames = _ref$fieldNames === void 0 ? {} : _ref$fieldNames,
     children = _ref.children;
-  var opLen = (options === null || options === void 0 ? void 0 : options.length) || 0;
+  var notDisOption = useMemo(function () {
+    return options === null || options === void 0 ? void 0 : options.filter(function (item) {
+      return !item.disabled;
+    });
+  }, [options]);
+  var opLen = (notDisOption === null || notDisOption === void 0 ? void 0 : notDisOption.length) || 0;
   var checked = (value === null || value === void 0 ? void 0 : value.length) >= opLen;
   var classNames = useRootClassName(checked);
   var optionsClassName = useClassName(classNames);
   var allCheckBox = useClassName("hw-all-check-box");
+  var allCheck = function allCheck() {
+    var allCheckOption = options === null || options === void 0 ? void 0 : options.filter(function (item) {
+      return !item.disabled;
+    });
+    var subItemOps = itemOpProvider(allCheckOption, fieldNames);
+    onChange === null || onChange === void 0 || onChange(allCheckOption, subItemOps);
+  };
   var change = function change() {
     if (!checked) {
-      var subItemOps = itemOpProvider(options, fieldNames);
-      onChange === null || onChange === void 0 || onChange(options, subItemOps);
+      allCheck();
       return;
     }
     onChange === null || onChange === void 0 || onChange([], []);
   };
-  if (!allSelect || mode !== "multiple" || serviceSearch) {
+  if (!allSelect || mode !== "multiple" || serviceSearch || opLen === 0) {
     return jsx(Fragment, {
       children: children
     });

package/es/Select/components/CheckBoxOption.d.ts

@@ -2,6 +2,7 @@ import React from "react";
 interface ICheckBoxOptionProps {
     label?: React.ReactNode;
     checked: boolean;
+    disabled?: boolean;
 }
-declare const _default: ({ label, checked }: ICheckBoxOptionProps) => JSX.Element;
+declare const _default: ({ label, checked, disabled }: ICheckBoxOptionProps) => JSX.Element;
 export default _default;

package/es/Select/components/CheckBoxOption.js

@@ -4,10 +4,12 @@ import { Space, Checkbox } from 'antd';
 
 var CheckBoxOption = (function (_ref) {
   var label = _ref.label,
-    checked = _ref.checked;
+    checked = _ref.checked,
+    disabled = _ref.disabled;
   return jsxs(Space, {
     children: [jsx(Checkbox, {
-      checked: checked
+      checked: checked,
+      disabled: disabled
     }), label]
   });
 });

package/es/Select/defaultConfig.js

@@ -11,10 +11,14 @@ var defaultModeConfig = {
       var checkVal = value === null || value === void 0 ? void 0 : value.map(function (itemVal) {
         return itemVal.value;
       });
+      var label = item.label,
+        disabled = item.disabled,
+        itemVal = item.value;
       var newVal = checkVal || [];
-      var checked = newVal.indexOf(item.value) !== -1;
+      var checked = newVal.indexOf(itemVal) !== -1;
       return jsx(CheckBoxOption, {
-        label: item.label,
+        disabled: disabled,
+        label: label,
         checked: checked
       });
     }

package/es/Select/index.js

@@ -119,6 +119,7 @@ var Index = function Index(_ref) {
           mode: mode,
           value: val,
           onChange: change,
+          fieldNames: fieldNames,
           children: node
         })
       });

package/lib/Form/config.js

@@ -25,7 +25,7 @@ var TrimInput = require('../Input/TrimInput.js');
 var TrimTextArea = require('../TextArea/TrimTextArea.js');
 
 var placeholderConfig = {
-  inputType: ["input", "inputNumber", "selectInput", "buttonInput", "verificationCodeInput", "trimInput", "urlUpload"],
+  inputType: ["input", "inputNumber", "selectInput", "buttonInput", "verificationCodeInput", "trimInput", "urlUpload", "textArea"],
   selectType: ["select", "datePicker", "timePicker", "colorInput"]
 };
 var componentConfig = {

package/lib/Select/components/AllSelect.js

@@ -3,10 +3,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 require('core-js/modules/es.array.concat.js');
+require('core-js/modules/es.array.filter.js');
+require('core-js/modules/es.object.to-string.js');
 var jsxRuntime = require('react/jsx-runtime');
 var antd = require('antd');
 var utils = require('../utils.js');
 var index = require('../../hooks/index.js');
+var React = require('react');
 
 var useRootClassName = function useRootClassName(checked) {
   var norClassNames = ["select-item", "select-item-option"];
@@ -22,20 +25,31 @@ var Index = function Index(_ref) {
     _ref$fieldNames = _ref.fieldNames,
     fieldNames = _ref$fieldNames === void 0 ? {} : _ref$fieldNames,
     children = _ref.children;
-  var opLen = (options === null || options === void 0 ? void 0 : options.length) || 0;
+  var notDisOption = React.useMemo(function () {
+    return options === null || options === void 0 ? void 0 : options.filter(function (item) {
+      return !item.disabled;
+    });
+  }, [options]);
+  var opLen = (notDisOption === null || notDisOption === void 0 ? void 0 : notDisOption.length) || 0;
   var checked = (value === null || value === void 0 ? void 0 : value.length) >= opLen;
   var classNames = useRootClassName(checked);
   var optionsClassName = index.useClassName(classNames);
   var allCheckBox = index.useClassName("hw-all-check-box");
+  var allCheck = function allCheck() {
+    var allCheckOption = options === null || options === void 0 ? void 0 : options.filter(function (item) {
+      return !item.disabled;
+    });
+    var subItemOps = utils.itemOpProvider(allCheckOption, fieldNames);
+    onChange === null || onChange === void 0 || onChange(allCheckOption, subItemOps);
+  };
   var change = function change() {
     if (!checked) {
-      var subItemOps = utils.itemOpProvider(options, fieldNames);
-      onChange === null || onChange === void 0 || onChange(options, subItemOps);
+      allCheck();
       return;
     }
     onChange === null || onChange === void 0 || onChange([], []);
   };
-  if (!allSelect || mode !== "multiple" || serviceSearch) {
+  if (!allSelect || mode !== "multiple" || serviceSearch || opLen === 0) {
     return jsxRuntime.jsx(jsxRuntime.Fragment, {
       children: children
     });

package/lib/Select/components/CheckBoxOption.d.ts

@@ -2,6 +2,7 @@ import React from "react";
 interface ICheckBoxOptionProps {
     label?: React.ReactNode;
     checked: boolean;
+    disabled?: boolean;
 }
-declare const _default: ({ label, checked }: ICheckBoxOptionProps) => JSX.Element;
+declare const _default: ({ label, checked, disabled }: ICheckBoxOptionProps) => JSX.Element;
 export default _default;

package/lib/Select/components/CheckBoxOption.js

@@ -7,10 +7,12 @@ var antd = require('antd');
 
 var CheckBoxOption = (function (_ref) {
   var label = _ref.label,
-    checked = _ref.checked;
+    checked = _ref.checked,
+    disabled = _ref.disabled;
   return jsxRuntime.jsxs(antd.Space, {
     children: [jsxRuntime.jsx(antd.Checkbox, {
-      checked: checked
+      checked: checked,
+      disabled: disabled
     }), label]
   });
 });

package/lib/Select/defaultConfig.js

@@ -12,10 +12,14 @@ var defaultModeConfig = {
       var checkVal = value === null || value === void 0 ? void 0 : value.map(function (itemVal) {
         return itemVal.value;
       });
+      var label = item.label,
+        disabled = item.disabled,
+        itemVal = item.value;
       var newVal = checkVal || [];
-      var checked = newVal.indexOf(item.value) !== -1;
+      var checked = newVal.indexOf(itemVal) !== -1;
       return jsxRuntime.jsx(CheckBoxOption.default, {
-        label: item.label,
+        disabled: disabled,
+        label: label,
         checked: checked
       });
     }

package/lib/Select/index.js

@@ -122,6 +122,7 @@ var Index = function Index(_ref) {
           mode: mode,
           value: val,
           onChange: change,
+          fieldNames: fieldNames,
           children: node
         })
       });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hw-component/form",
-  "version": "1.4.2",
+  "version": "1.4.5",
   "description": "基于antd二次开发",
   "repository": {
     "type": "git",

package/src/components/Form/config.ts

@@ -28,6 +28,7 @@ export const placeholderConfig = {
     "verificationCodeInput",
     "trimInput",
     "urlUpload",
+    "textArea"
   ],
   selectType: ["select", "datePicker", "timePicker", "colorInput"],
 };

package/src/components/Select/components/AllSelect.tsx

@@ -2,7 +2,7 @@ import type { HSelectProps } from "@/components/Select/modal";
 import { Checkbox, Space } from "antd";
 import { itemOpProvider } from "../utils";
 import { useClassName } from "../../hooks";
-import React from "react";
+import React, {useMemo} from "react";
 
 interface IProps extends HSelectProps {
   checked?: boolean;
@@ -23,20 +23,31 @@ const Index: React.FC<IProps> = ({
   fieldNames = {},
   children,
 }) => {
-  const opLen = options?.length || 0;
+  const notDisOption=useMemo(()=>{
+      return options?.filter((item)=>{
+          return !item.disabled;
+      })
+  },[options]);
+  const opLen = notDisOption?.length || 0;
   const checked = (value as any[])?.length >= opLen;
   const classNames = useRootClassName(checked);
   const optionsClassName = useClassName(classNames);
   const allCheckBox = useClassName("hw-all-check-box");
+  const allCheck=()=>{
+     const allCheckOption=options?.filter((item)=>{
+        return !item.disabled;
+     });
+    const subItemOps=itemOpProvider(allCheckOption,fieldNames);
+    onChange?.(allCheckOption, subItemOps);
+  }
   const change = () => {
     if (!checked) {
-      const subItemOps = itemOpProvider(options, fieldNames);
-      onChange?.(options, subItemOps);
+      allCheck();
       return;
     }
     onChange?.([], []);
   };
-  if (!allSelect || mode !== "multiple" || serviceSearch) {
+  if (!allSelect || mode !== "multiple" || serviceSearch||opLen===0) {
     return <>{children}</>;
   }
   return (

package/src/components/Select/components/CheckBoxOption.tsx

@@ -3,11 +3,12 @@ import React from "react";
 interface ICheckBoxOptionProps {
   label?: React.ReactNode;
   checked: boolean;
+  disabled?:boolean;
 }
-export default ({ label, checked }: ICheckBoxOptionProps) => {
+export default ({ label, checked ,disabled}: ICheckBoxOptionProps) => {
   return (
     <Space>
-      <Checkbox checked={checked} />
+      <Checkbox checked={checked} disabled={disabled}/>
       {label}
     </Space>
   );

package/src/components/Select/defaultConfig.tsx

@@ -9,9 +9,10 @@ export const defaultModeConfig: HSelectProps["modeConfig"] = {
       const checkVal = value?.map((itemVal) => {
         return itemVal.value;
       });
+      const {label,disabled,value:itemVal}=item;
       const newVal = checkVal || [];
-      const checked = newVal.indexOf(item.value) !== -1;
-      return <CheckBoxOption label={item.label} checked={checked} />;
+      const checked = newVal.indexOf(itemVal) !== -1;
+      return <CheckBoxOption disabled={disabled} label={label} checked={checked} />;
     },
   },
 };

package/src/components/Select/index.tsx

@@ -90,6 +90,7 @@ const Index: React.FC<HSelectProps> = ({
               mode={mode}
               value={val}
               onChange={change}
+              fieldNames={fieldNames}
             >
               {node}
             </AllSelect>

package/src/pages/Form/index.tsx

@@ -1,8 +1,10 @@
 import {HForm, HFormConfigProvider, HSwitch, useHForm} from "../../components";
 import { useState } from "react";
-import { Button, DatePicker, Form, Input } from "antd";
+import {Button, DatePicker, Form, Input, Row} from "antd";
 const Test2=()=>{
-  return <HSwitch/>
+  return <Row style={{background:"red"}}>
+
+  </Row>
 }
 const formData = (options) => {
   const op = [
@@ -16,6 +18,11 @@ const formData = (options) => {
     },
   ];
   return [
+      {
+          label: "12321",
+          className: "3",
+          name:"3",
+      },
     {
       label: "测试12312",
       className: "hdjd",
@@ -72,7 +79,6 @@ export default () => {
         <HForm
           configData={formData(options)}
           labelWidth={200}
-          itemSpan={{ span: 6 }}
           form={form}
           labelAlign={"right"}
           onFinish={(value) => {

package/src/pages/Select/index.tsx

@@ -2,7 +2,7 @@ import { HSelect } from "../../components";
 import { Space } from "antd";
 import { useState } from "react";
 export default () => {
-  const [selectVal, setSelectVal] = useState([10]);
+  const [selectVal, setSelectVal] = useState([]);
   return (
     <Space size={"large"} direction={"vertical"} style={{ width: "100%" }}>
       <HSelect
@@ -14,13 +14,13 @@ export default () => {
       <HSelect
         fieldNames={{ label: "name", value: "value" }}
         options={[
-          { name: "测试1", value: 10, userId: 112321 },
+          { name: "测试1", value: 10, userId: 112321,disabled:true },
           { name: "测试2", value: 20, userId: 112321 },
         ]}
         placeholder="多选"
         value={selectVal}
         onChange={(val, option) => {
-          console.log(option);
+            console.log(option,"optionoptionoption")
           setSelectVal(val);
         }}
         allSelect={true}