kts-components-document-access-point 1.4.2 → 1.4.5

package/src/DocumentsEdit/___demo___/readOnly/index.tsx

@@ -1,16 +1,16 @@
-
-import { Switch } from 'kts-components-antd-x4';
-import React from 'react';
-import { DocumentsEdit } from '../../../';
-
-export default () => {
-
-  const [readOnly, setReadOnly] = React.useState(false)
-
-  return (
-    <>
-      <Switch style={{}} onChange={e => { setReadOnly(e) }} />
-      <DocumentsEdit readOnly={readOnly} />
-    </>
-  );
-};
+
+import { Switch } from 'kts-components-antd-x4';
+import React from 'react';
+import { DocumentsEdit } from '../../../';
+
+export default () => {
+
+  const [readOnly, setReadOnly] = React.useState(false)
+
+  return (
+    <>
+      <Switch style={{}} onChange={e => { setReadOnly(e) }} />
+      <DocumentsEdit readOnly={readOnly} />
+    </>
+  );
+};

package/src/DocumentsEdit/constant/propertyColumns/index.tsx

@@ -1,65 +1,65 @@
-
-import React from "react";
-import IProperties from "../../DocumentsEditController/DocumentsEditControllerState/IProperties";
-import { ColumnType } from "kts-components-antd-x4/lib/table";
-import * as tools from "../../tools";
-
-const propertyColumns: ColumnType<any>[] = [
-  {
-    title: '字段名称',
-    render: (_, v) => {
-      return <MySpan>{v.value.$name}</MySpan>;
-    },
-  },
-  {
-    title: '显示名称',
-    render: (_, v) => {
-      return <MySpan>{v.value.alias}</MySpan>;
-    },
-  },
-  {
-    title: '描述',
-    render: (_, v) => {
-      return <MySpan>{v.value.detailed}</MySpan>;
-    },
-  },
-  {
-    title: '是否必填',
-    width: 80,
-    render: (_, v) => {
-      return <MySpan>{v.required.indexOf(v.value.$name) >= 0 ? '是' : '否'}</MySpan>;
-    },
-  },
-  {
-    title: '形式',
-    render: (_, v) => {
-      return <MySpan>{tools.getTypeName(tools.initType(v.ref))}</MySpan>;
-    },
-  },
-  {
-    title: '是否已添加校验规则',
-    key: 'isRules',
-    width: 130,
-    render: (_, v) => {
-      return <MySpan>{v.ref.rules ? v.ref.rules.length > 0 ? '是' : '否' : '否'}</MySpan>;
-    },
-  },
-]
-
-class MySpan extends React.Component {
-  render() {
-    return (
-      <span style={{ padding: '0 8px' }}>
-        {this.props.children}
-      </span>
-    );
-  }
-}
-
-export default propertyColumns.map((e, i) => {
-  return {
-    key: `default${i}`,
-    ellipsis: { showTitle: false },
-    ...e,
-  }
-}) as ColumnType<any>[];
+
+import React from "react";
+import IProperties from "../../DocumentsEditController/DocumentsEditControllerState/IProperties";
+import { ColumnType } from "kts-components-antd-x4/lib/table";
+import * as tools from "../../tools";
+
+const propertyColumns: ColumnType<any>[] = [
+  {
+    title: '字段名称',
+    render: (_, v) => {
+      return <MySpan>{v.value.$name}</MySpan>;
+    },
+  },
+  {
+    title: '显示名称',
+    render: (_, v) => {
+      return <MySpan>{v.value.alias}</MySpan>;
+    },
+  },
+  {
+    title: '描述',
+    render: (_, v) => {
+      return <MySpan>{v.value.detailed}</MySpan>;
+    },
+  },
+  {
+    title: '是否必填',
+    width: 80,
+    render: (_, v) => {
+      return <MySpan>{v.required.indexOf(v.value.$name) >= 0 ? '是' : '否'}</MySpan>;
+    },
+  },
+  {
+    title: '形式',
+    render: (_, v) => {
+      return <MySpan>{tools.getTypeName(tools.initType(v.ref))}</MySpan>;
+    },
+  },
+  {
+    title: '是否已添加校验规则',
+    key: 'isRules',
+    width: 130,
+    render: (_, v) => {
+      return <MySpan>{v.ref.rules ? v.ref.rules.length > 0 ? '是' : '否' : '否'}</MySpan>;
+    },
+  },
+]
+
+class MySpan extends React.Component {
+  render() {
+    return (
+      <span style={{ padding: '0 8px' }}>
+        {this.props.children}
+      </span>
+    );
+  }
+}
+
+export default propertyColumns.map((e, i) => {
+  return {
+    key: `default${i}`,
+    ellipsis: { showTitle: false },
+    ...e,
+  }
+}) as ColumnType<any>[];

package/src/DocumentsEdit/index.less

@@ -1,45 +1,45 @@
-.kts-documents-edit {
-
-  // min-height: 600px;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-
-  .kts-documents-edit-head {
-    display: flex;
-    margin-bottom: 10px;
-
-    .ktsAntX-space-item:first-child {
-      flex: 1;
-    }
-  }
-
-  .kts-documents-edit-property {
-    flex: 1;
-    overflow: auto;
-
-    .ktsAntX-table,
-    .ktsAntX-spin-container,
-    .ktsAntX-spin-nested-loading,
-    .ktsAntX-table-wrapper{
-      height: 100%;
-      overflow: auto;
-    }
-
-    .ktsAntX-table-container{
-      height: 100%;
-      overflow: auto;
-      display: flex;
-      flex-direction: column;
-
-      .ktsAntX-table-header{
-        flex: none;
-      }
-
-      .ktsAntX-table-body{
-        flex: 1;
-        overflow: auto;
-      }
-    }
-  }
-}
+.kts-documents-edit {
+
+  // min-height: 600px;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+
+  .kts-documents-edit-head {
+    display: flex;
+    margin-bottom: 10px;
+
+    .ktsAntX-space-item:first-child {
+      flex: 1;
+    }
+  }
+
+  .kts-documents-edit-property {
+    flex: 1;
+    overflow: auto;
+
+    .ktsAntX-table,
+    .ktsAntX-spin-container,
+    .ktsAntX-spin-nested-loading,
+    .ktsAntX-table-wrapper{
+      height: 100%;
+      overflow: auto;
+    }
+
+    .ktsAntX-table-container{
+      height: 100%;
+      overflow: auto;
+      display: flex;
+      flex-direction: column;
+
+      .ktsAntX-table-header{
+        flex: none;
+      }
+
+      .ktsAntX-table-body{
+        flex: 1;
+        overflow: auto;
+      }
+    }
+  }
+}

package/src/DocumentsEdit/index.md

@@ -1,10 +1,10 @@
-# DocumentsEdit
-
-## 普通使用
-<code src="./___demo___/conventional/index.tsx" ></code>
-
-## 监听问题编号 和 导入数据
-<code src="./___demo___/monitor/index.tsx" ></code>
-
-## 只读模式
-<code src="./___demo___/readOnly/index.tsx" ></code>
+# DocumentsEdit
+
+## 普通使用
+<code src="./___demo___/conventional/index.tsx" ></code>
+
+## 监听问题编号 和 导入数据
+<code src="./___demo___/monitor/index.tsx" ></code>
+
+## 只读模式
+<code src="./___demo___/readOnly/index.tsx" ></code>

package/src/DocumentsEdit/index.tsx

@@ -1,118 +1,118 @@
-import React from 'react';
-import { Space } from 'kts-components-antd-x4'
-import DocumentsEditController from './DocumentsEditController';
-import ISchema from './DocumentsEditController/DocumentsEditControllerState/ISchema';
-import DocumentsEditControllerState from './DocumentsEditController/DocumentsEditControllerState';
-import Breadcrumb from './ui/Breadcrumb';
-import AddPropertyButton from './ui/AddPropertyButton';
-// import RefPropertyButton from './ui/RefPropertyButton';
-import PropertyTable from './ui/PropertyTable';
-import EditProperty from './ui/EditProperty';
-import EditRule from './ui/EditRule';
-import './index.less';
-
-export { default as DocumentsEditControllerState } from './DocumentsEditController/DocumentsEditControllerState';
-
-/** 发票组件的上下文 */
-export const DocumentsEditContext = React.createContext<DocumentsEditController>(undefined as any);
-
-export interface IDocumentsEdit {
-
-  /** 默认文档数据，第一次渲染生效 */
-  schema?: ISchema;
-
-  /** 控制器 */
-  controller?: DocumentsEditController;
-
-  /** 文档改变时候 */
-  onChange?: (schema: ISchema) => void;
-
-  /** 只读 */
-  readOnly?: boolean;
-}
-
-export default class DocumentsEdit extends React.Component<IDocumentsEdit> {
-
-  /** 控制器 */
-  static DocumentsEditController = DocumentsEditController;
-
-  /** 控制器 */
-  static DocumentsEditControllerState = DocumentsEditControllerState;
-
-  /** 创建文档对象 */
-  static createSchema = (title: string) => ({
-    "$schema": "",
-    "$id": "",
-    "$createTime": 0,
-    "$count": 0,
-    "$name": "schema",
-    "type": "object",
-    "title": title,
-    "definitions": {}
-  } as ISchema)
-
-  /** 获取控制器钩子 */
-  static useDocumentsEditController = () => React.useContext(DocumentsEditContext);
-
-  render = () => <Main {...this.props} />
-}
-
-const Main = (props: IDocumentsEdit) => {
-
-  const controller = React.useMemo(() => props.controller || new DocumentsEditController(new DocumentsEditControllerState(props.schema)), [props.controller]);
-
-  const schema = controller.useMemo(s => s.schema, []);
-
-  React.useEffect(() => {
-    controller.pipeline(async s => {
-      s.propertyTableState.current = s.schema;
-      s.breadcrumbState = [];
-    })()
-  }, [controller])
-
-  // props的文档数据是否改变 更新控制器数据
-  React.useEffect(() => {
-    controller.pipeline(async s => {
-      if (props.schema && s.schema !== props.schema) {
-        s.schema = props.schema;
-        s.propertyTableState.current = s.schema;
-        s.breadcrumbState = [];
-      }
-    })()
-  }, [controller, props.schema])
-
-  // 文档数据改变时候 并且 props 没有改变，调用onChange
-  React.useEffect(() => {
-    (async () => {
-      await controller.wait();
-      await controller.pipeline(async s => {
-        if (s.schema === props.schema) return;
-        if (s.schema && props.onChange) { props.onChange(s.schema); }
-      })()
-    })()
-  }, [controller, schema, props.schema, props.onChange])
-
-  // 更新只读状态
-  React.useEffect(() => {
-    controller.pipeline(async s => {
-      s.readOnly = !!props.readOnly;
-    })()
-  }, [props.readOnly, controller])
-
-  return (
-    <DocumentsEditContext.Provider value={controller}>
-      <div className="kts-documents-edit" >
-        <Space className="kts-documents-edit-head">
-          <Breadcrumb />
-          <AddPropertyButton />
-          {/* <RefPropertyButton /> */}
-        </Space>
-        <div className="kts-documents-edit-property">
-          <PropertyTable />
-        </div>
-      </div>
-      <EditProperty />
-      <EditRule />
-    </DocumentsEditContext.Provider>
-  );
+import React from 'react';
+import { Space } from 'kts-components-antd-x4'
+import DocumentsEditController from './DocumentsEditController';
+import ISchema from './DocumentsEditController/DocumentsEditControllerState/ISchema';
+import DocumentsEditControllerState from './DocumentsEditController/DocumentsEditControllerState';
+import Breadcrumb from './ui/Breadcrumb';
+import AddPropertyButton from './ui/AddPropertyButton';
+// import RefPropertyButton from './ui/RefPropertyButton';
+import PropertyTable from './ui/PropertyTable';
+import EditProperty from './ui/EditProperty';
+import EditRule from './ui/EditRule';
+import './index.less';
+
+export { default as DocumentsEditControllerState } from './DocumentsEditController/DocumentsEditControllerState';
+
+/** 发票组件的上下文 */
+export const DocumentsEditContext = React.createContext<DocumentsEditController>(undefined as any);
+
+export interface IDocumentsEdit {
+
+  /** 默认文档数据，第一次渲染生效 */
+  schema?: ISchema;
+
+  /** 控制器 */
+  controller?: DocumentsEditController;
+
+  /** 文档改变时候 */
+  onChange?: (schema: ISchema) => void;
+
+  /** 只读 */
+  readOnly?: boolean;
+}
+
+export default class DocumentsEdit extends React.Component<IDocumentsEdit> {
+
+  /** 控制器 */
+  static DocumentsEditController = DocumentsEditController;
+
+  /** 控制器 */
+  static DocumentsEditControllerState = DocumentsEditControllerState;
+
+  /** 创建文档对象 */
+  static createSchema = (title: string) => ({
+    "$schema": "",
+    "$id": "",
+    "$createTime": 0,
+    "$count": 0,
+    "$name": "schema",
+    "type": "object",
+    "title": title,
+    "definitions": {}
+  } as ISchema)
+
+  /** 获取控制器钩子 */
+  static useDocumentsEditController = () => React.useContext(DocumentsEditContext);
+
+  render = () => <Main {...this.props} />
+}
+
+const Main = (props: IDocumentsEdit) => {
+
+  const controller = React.useMemo(() => props.controller || new DocumentsEditController(new DocumentsEditControllerState(props.schema)), [props.controller]);
+
+  const schema = controller.useMemo(s => s.schema, []);
+
+  React.useEffect(() => {
+    controller.pipeline(async s => {
+      s.propertyTableState.current = s.schema;
+      s.breadcrumbState = [];
+    })()
+  }, [controller])
+
+  // props的文档数据是否改变 更新控制器数据
+  React.useEffect(() => {
+    controller.pipeline(async s => {
+      if (props.schema && s.schema !== props.schema) {
+        s.schema = props.schema;
+        s.propertyTableState.current = s.schema;
+        s.breadcrumbState = [];
+      }
+    })()
+  }, [controller, props.schema])
+
+  // 文档数据改变时候 并且 props 没有改变，调用onChange
+  React.useEffect(() => {
+    (async () => {
+      await controller.wait();
+      await controller.pipeline(async s => {
+        if (s.schema === props.schema) return;
+        if (s.schema && props.onChange) { props.onChange(s.schema); }
+      })()
+    })()
+  }, [controller, schema, props.schema, props.onChange])
+
+  // 更新只读状态
+  React.useEffect(() => {
+    controller.pipeline(async s => {
+      s.readOnly = !!props.readOnly;
+    })()
+  }, [props.readOnly, controller])
+
+  return (
+    <DocumentsEditContext.Provider value={controller}>
+      <div className="kts-documents-edit" >
+        <Space className="kts-documents-edit-head">
+          <Breadcrumb />
+          <AddPropertyButton />
+          {/* <RefPropertyButton /> */}
+        </Space>
+        <div className="kts-documents-edit-property">
+          <PropertyTable />
+        </div>
+      </div>
+      <EditProperty />
+      <EditRule />
+    </DocumentsEditContext.Provider>
+  );
 };