Merge pull request #216 from yaob421123/master

fix: 调整组件样式及文档更新
uiwjs · Apr 19, 2023 · c8912ba · c8912ba
2 parents 55011e8 + 7b97f79
commit c8912ba
Show file tree

Hide file tree

Showing 9 changed files with 88 additions and 49 deletions.
diff --git a/packages/authorized/README.md b/packages/authorized/README.md
@@ -65,11 +65,11 @@ const isAuth = getAuthPath("/api/path")
 
 ### 参数说明
 
-| 参数     | 必填 | 类型              | 默认值  | 说明                                            |
-| :------- | :--- | :---------------- | :------ | :---------------------------------------------- |
-| path     | 否   | `string`          |         | 路径                                            |
-| disabled | 否   | `boolean`         | `false` | 禁用 状态 展示(适用于 存在 disabled 属性的组件) |
-| children | 是   | `React.ReactNode` |         | 内容                                            |
+| 参数 | 说明 | 必填 | 类型 | 默认值  |
+| :--- | :--- | :--- | :--- | :--- |
+| path | 路径  | 否 | `string` | - |
+| disabled | 禁用 状态 展示(适用于 存在 disabled 属性的组件) | 否 | `boolean` | `false` |
+| children | 内容 | 是 | `React.ReactNode` | - |
 <!-- 
 ```tsx
 import React from "react"

diff --git a/packages/basic-layouts/README.md b/packages/basic-layouts/README.md
@@ -305,41 +305,41 @@ export default BasicLayoutScreen;
 
 ## Props
 
-| 参数                  | 必填 | 类型                                                                                     | 默认值    | 说明                     |
-| :-------------------- | :--- | :--------------------------------------------------------------------------------------- | :-------- | :----------------------- |
-| className                  | 否   | `string`                                                                                 |           | BasicLayout 外层className                 |
-| style                  | 否   | `object`                                                                                 |           | BasicLayout 外层最外层样式式                  |
-| logo                  | 否   | `string`                                                                                 |           | logo图标                 |
-| projectName           | 否   | `string`                                                                                 |           | 项目名称                 |
-| footer                | 否   | `React.ReactElement`                                                                     |           | 页脚                     |
-| routes                | 否   | `RoutersProps[]`                                                                         |           | 菜单路由数据             |
-| children              | 否   | `React.ReactNode`                                                                        |           | 内容                     |
-| headerLayout          | 否   | `枚举类型："top" \| "default"`                                                           | `default` | 头部布局                 |
-| headerBackground      | 否   | `string`                                                                                 | `"#fff"`  | 头部背景色               |
-| headerFontColor       | 否   | `string`                                                                                 | `"#000"`  | 头部字体颜色             |
-| menuHide              | 否   | `boolen`                                                                                 | `false`   | 菜单隐藏(可从路由组件router-control组件带参数hiddenMainMenu控制)             |
-| menus                 | 否   | `HeaderMenuItemsProps[]`                                                                 |           | 右侧点击头像展示菜单     |
-| profile               | 否   | `{avatar(头像)?:string,userName(用户名)?:string,menuLeft(菜单左侧)?:React.ReactElement}` |           | 头像部分                 |
-| onReloadAuth          | 否   | `() => void`                                                                             |           | 重新加载权限             |
-| layouts               | 否   | `UseLayoutsProps`                                                                        |           | 右侧点击头像展示菜单配置 |
-| isDefaultContentStyle | 否   | `boolean`                                                                                | `true`    | 内容区域默认样式展示     |
-| hideReloadButton | 隐藏刷新权限按钮 | `Boolean` | `false` |
-| hideLogoutButton | 隐藏退出登录按钮 | `Boolean` | `false` |
-| hideUserInfo | 隐藏用户信息 | `Boolean` | `false` |
-| onLogout     | 否   | `(navigate: NavigateFunction) => void` |  | 覆盖原始退出事件 | 
-| onLogoClick     | 否   | `(event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void` |  | logo 点击事件 | 
+| 参数 | 说明 | 必填 | 类型 | 默认值 |
+| :--- | :--- | :--- | :--- | :--- |
+| className | BasicLayout 外层className | 否 | `string` | - |
+| style | BasicLayout 外层最外层样式式 | 否 | `object` | - |
+| logo | logo图标 | 否 | `string` | - |
+| projectName | 项目名称 | 否   | `string` | - |
+| footer | 页脚 | 否 | `React.ReactElement` | - |
+| routes | 菜单路由数据 | 否 | `KktproRoutesProps[]` | - |
+| children | 内容 | 否 | `React.ReactNode` | - |
+| headerLayout | 头部布局 | 否 | `枚举类型："top" \| "default"` | `default` |
+| headerBackground | 头部背景色 | 否 | `string` | `"#fff"` |
+| headerFontColor | 头部字体颜色 | 否 | `string` | `"#000"` |
+| menuHide | 菜单隐藏(可从路由组件router-control组件带参数hiddenMainMenu控制) | 否 | `boolen` | `false` |
+| menus | 右侧点击头像展示菜单 | 否 | `HeaderMenuItemsProps[]` | - |
+| profile | 头像部分 | 否 | `{avatar(头像)?:string,userName(用户名)?:string,menuLeft(菜单左侧)?:React.ReactElement}` |  - |
+| onReloadAuth | 重新加载权限 | 否 | `() => void` |
+| layouts | 右侧点击头像展示菜单配置 | 否 | `UseLayoutsProps` | - |
+| isDefaultContentStyle | 内容区域默认样式展示 | 否 | `boolean` | `true` |
+| hideReloadButton | 隐藏刷新权限按钮 | - | `Boolean` | `false` |
+| hideLogoutButton | 隐藏退出登录按钮 | - | `Boolean` | `false` |
+| hideUserInfo | 隐藏用户信息 | - | `Boolean` | `false` |
+| onLogout | 覆盖原始退出事件 |  否 | `(navigate: NavigateFunction) => void` | - |
+| onLogoClick | logo 点击事件 | 否   | `(event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void` | -  | 
 
 
 建议：在使用 `@uiw-admin/layout-tabs` 组件渲染的时候，建议 `isDefaultContentStyle` 设置为 `false`
 
 ## useLayouts
 
 ### response
-| 参数               | 必填 | 类型                                             | 默认值 | 说明 |
-| :----------------- | :--- | :----------------------------------------------- | :----- | :--- |
-| headerRightvisible | 否   | `boolen`                                         |        |      |
-| closeMenu          | 否   | `() => void`                                     |        |      |
-| updateStore        | 否   | `(datas: {headerRightvisible: boolean}) => void` |        |      |
+| 参数 | 说明 | 必填 | 类型 | 默认值 |
+| :--- | :--- | :--- | :--- | :--- |
+| headerRightvisible | 关闭右上角menu菜单 | 否   | `boolen` | - |
+| closeMenu | 关闭右上角menu菜单事件 | 否 | `() => void` | - |
+| updateStore | 更新数据 | 否 | `({ headerRightvisible: boolean }) => void` | - |
 
 ## 贡献者
 

diff --git a/packages/components/src/ProDrawer/README.md b/packages/components/src/ProDrawer/README.md
@@ -169,7 +169,7 @@ export default Demo
 ## Props
 
 #### 基础参数
-[继承于uiw,请参考Drawer其余参数](https://uiwjs.github.io/#/components/drawer)
+更多属性文档请参考 [uiw/Drawer](https://uiwjs.github.io/#/components/drawer)
 
 | 参数    | 说明     | 类型           | 默认值 |
 | :------ | :------- | :------------- | :----- |
@@ -181,7 +181,7 @@ export default Demo
 
 
 #### ButtonsProps
-[继承于uiw,请参考Button其余参数](https://uiwjs.github.io/#/components/button)
+更多属性文档请参考 [uiw/Button](https://uiwjs.github.io/#/components/button)
 
 | 参数     | 说明         | 类型    | 默认值 |
 | :------- | :----------- | :------ | :----- |

diff --git a/packages/components/src/ProForm/README.md b/packages/components/src/ProForm/README.md
@@ -1172,10 +1172,15 @@ import { formatter, Input, Button } from 'uiw'
 import React, { useState } from 'react';
 
 const Inputs = ({value, onChange}) => {
-  return <>
-    <Button>不要输错哦</Button>
-    <Input placeholder="请输入内容"  value={value} onChange={e => { onChange(e.target.value) }}  />
-  </>
+  return (
+    <>
+      <Button style={{ marginRight: 10, width: 200 }}>按钮</Button>
+      <Input
+        placeholder="请输入内容"
+        value={value}
+        onChange={e => { onChange(e.target.value) }} />
+    </>
+  )
 }
 
 const Demo = () => {
@@ -1233,7 +1238,7 @@ export default Demo
 
 ### saveButtonProps resetButtonProps
 
-其余属性继承于[uiw/button](https://uiwjs.github.io/#/components/button)
+更多属性文档请参考 [uiw/button](https://uiwjs.github.io/#/components/button)
 
 | 参数     | 说明     | 类型                     | 默认值 |
 | -------- | -------- | ------------------------ | ------ |

diff --git a/packages/components/src/ProForm/formdom.tsx b/packages/components/src/ProForm/formdom.tsx
@@ -8,6 +8,7 @@ import './style/form-item.css';
 function FormDom({
   formDatas = [],
   formfields,
+  formType,
   onSubmit,
   onChange,
   onSubmitError,
@@ -29,6 +30,8 @@ function FormDom({
   const store = useStore();
   const colProps = useColPropsContext();
 
+  console.log(8888, formType);
+
   const { setFormState } = store as {
     setFormState: ((p: any) => void) | undefined;
   };
@@ -44,11 +47,14 @@ function FormDom({
   }, [baseRef]);
 
   const styles: React.CSSProperties = {
-    background: '#fff',
     paddingBottom: 10,
     ...style,
   };
 
+  if (formType !== 'pure') {
+    styles.background = '#fff';
+  }
+
   return (
     <Form
       className={className}
@@ -110,14 +116,17 @@ function FormDom({
             </Row>
             <div className="w-form-item-center" style={{ ...buttonsContainer }}>
               <Button
+                className="uiw-admin-proform-btn"
                 style={{ display: showSaveButton ? 'flex' : 'none' }}
                 disabled={!canSubmit()}
+                type="primary"
                 htmlType="submit"
                 {...saveButtonProps}
               >
                 {saveButtonProps.label || '提交'}
               </Button>
               <Button
+                className="uiw-admin-proform-btn"
                 style={{ display: showResetButton ? 'flex' : 'none' }}
                 onClick={resetForm}
                 {...resetButtonProps}

diff --git a/packages/components/src/ProForm/style/form-item.css b/packages/components/src/ProForm/style/form-item.css
@@ -36,7 +36,32 @@
   background-color: transparent;
 }
 
-.uiw-admin-proform .w-card-head {
-  height: 50px;
-  line-height: 50px;
+.uiw-admin-proform > .w-card .w-card-head {
+  height: 44px;
+  line-height: 44px;
+}
+.uiw-admin-proform > .w-descriptions .w-descriptions-title {
+  height: 44px;
+  display: flex;
+  align-items: center;
+}
+.uiw-admin-proform > .w-collapse .w-collapse-header {
+  height: 44px;
+  align-items: center;
+  font-weight: 500;
+}
+.uiw-admin-proform > .w-descriptions {
+  border-top: none;
+}
+.uiw-admin-proform > .w-descriptions .w-descriptions-title {
+  width: 100%;
+  display: table-caption;
+  box-sizing: border-box;
+  line-height: 44px;
+  border-top: 1px solid #dfe2e5;
+  padding: 0 12px;
+}
+.uiw-admin-proform-btn {
+  height: 34px;
+  min-width: 80px;
 }
diff --git a/packages/components/src/ProTable/README.md b/packages/components/src/ProTable/README.md
@@ -708,7 +708,7 @@ export default Demo6
 | label           | 按钮标题                               | string   | - |
 | render          | 不使用button，自定义组件                               | React Component   | - |
 
-其余属性继承[uiw button](https://uiwjs.github.io/#/components/button)
+更多属性文档请参考 [uiw button](https://uiwjs.github.io/#/components/button)
 
 ### operateButtons
 
@@ -796,7 +796,7 @@ props: [
 | pageSize | 每页条数       | Number | 10     |
 | onShowSizeChange     | pageSize 变化的回调  | Function(current, pageSize)  | -      |
 
-其余属性继承自[uiw Pagination](https://uiwjs.github.io/#/components/pagination)
+更多属性文档请参考 [uiw Pagination](https://uiwjs.github.io/#/components/pagination)
 
 ## useTable
 

diff --git a/packages/components/src/ProTable/index.tsx b/packages/components/src/ProTable/index.tsx
@@ -81,9 +81,9 @@ const ProTabel: React.FC<ProtableProps> = (props) => {
         )}
 
         {/* 操作区域 */}
-        <Card noHover bodyStyle={{ paddingTop: 5 }}>
+        <Card noHover>
           {operateButtons && operateButtons.length > 0 && (
-            <div style={{ background: '#fff', padding: '10px 0' }}>
+            <div style={{ background: '#fff', paddingBottom: 14 }}>
               {operateButtons.map((btn: any, idx: number) =>
                 btn?.render ? (
                   <React.Fragment key={idx.toString()}>

diff --git a/packages/components/src/Skeleton/README.md b/packages/components/src/Skeleton/README.md
@@ -22,7 +22,7 @@ export default Demo
 | ------- | ------------ | ------- | ------ |
 | loading | 页面加载状态 | Boolean | false  |
 
-> 其余参数与[Uiw Loader](https://uiwjs.github.io/#/components/loader)相同
+> 更多属性文档请参考 [Uiw Loader](https://uiwjs.github.io/#/components/loader)
 
 
 ## 贡献者