From a096d172852a64f028d1a2e386459df3ed7dc72c Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Thu, 14 Dec 2023 17:41:35 +0800
Subject: [PATCH 01/13] =?UTF-8?q?fix:=20=E5=AF=8C=E6=96=87=E6=9C=AC?=
 =?UTF-8?q?=E7=BC=96=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Formily/RichTextEditing/demos/default.tsx | 51 +++++++++++++++++++
 .../Formily/RichTextEditing/index.md          | 24 +++++++++
 .../Formily/RichTextEditing/index.tsx         | 44 ++++++++++++++++
 .../Formily/RichTextEditing/style.ts          | 15 ++++++
 .../li-p2/src/components/Formily/index.ts     |  1 +
 5 files changed, 135 insertions(+)
 create mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/demos/default.tsx
 create mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/index.md
 create mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
 create mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/style.ts

diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/demos/default.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/demos/default.tsx
new file mode 100644
index 00000000..6c0408c7
--- /dev/null
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/demos/default.tsx
@@ -0,0 +1,51 @@
+import { RichTextEditing } from '@antv/li-p2';
+import { Form, FormItem } from '@formily/antd-v5';
+import type { Form as FormInstance } from '@formily/core';
+import { createForm, onFormValuesChange } from '@formily/core';
+import { createSchemaField, FormConsumer } from '@formily/react';
+import React from 'react';
+
+const form = createForm({
+  initialValues: { slider: [0, 19] },
+  effects() {
+    onFormValuesChange((formIns: FormInstance<any>) => {
+      console.log('formIns.values: ', formIns.values);
+    });
+  },
+});
+
+const SchemaField = createSchemaField({
+  components: {
+    FormItem,
+    RichTextEditing,
+  },
+});
+
+const schema = {
+  type: 'object',
+  properties: {
+    slider: {
+      type: 'any',
+      title: '编辑器',
+      'x-decorator': 'FormItem',
+      'x-component': 'RichTextEditing',
+      'x-decorator-props': {},
+    },
+  },
+};
+
+export default () => {
+  return (
+    <Form form={form} style={{ width: '300px' }}>
+      <SchemaField schema={schema} />
+
+      <FormConsumer>
+        {() => (
+          <code>
+            <pre>{JSON.stringify(form.values, null, 2)}</pre>
+          </code>
+        )}
+      </FormConsumer>
+    </Form>
+  );
+};
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.md b/packages/li-p2/src/components/Formily/RichTextEditing/index.md
new file mode 100644
index 00000000..d5fcd457
--- /dev/null
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.md
@@ -0,0 +1,24 @@
+---
+toc: content
+order: 9
+group:
+  title: formily 组件
+  order: 1
+nav:
+  title: 组件
+  path: /components
+---
+
+# 富文本编辑器 - RichTextEditing
+
+## 介绍
+
+富文本编辑器
+
+## 代码演示
+
+### 默认示例
+
+<code src="./demos/default.tsx"></code>
+
+<API></API>
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
new file mode 100644
index 00000000..278251b5
--- /dev/null
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
@@ -0,0 +1,44 @@
+import { usePrefixCls } from '@formily/antd-v5/esm/__builtins__';
+import { connect } from '@formily/react';
+import { Button, Modal } from 'antd';
+import cls from 'classnames';
+import React, { useState } from 'react';
+import useStyle from './style';
+
+type InternalRichTextEditingProps = {};
+
+const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props) => {
+  const prefixCls = usePrefixCls('formily-rich-text-editing', props);
+  const [wrapSSR, hashId] = useStyle(prefixCls);
+  const [isModalOpen, setIsModalOpen] = useState(false);
+
+  const handleOk = () => {
+    setIsModalOpen(false);
+  };
+
+  const handleCancel = () => {
+    setIsModalOpen(false);
+  };
+
+  return wrapSSR(
+    <div className={cls(`${prefixCls}`, hashId)}>
+      <Button className={`${prefixCls}__btn`} onClick={() => setIsModalOpen(true)}>
+        编辑
+      </Button>
+      <Modal
+        title="筛选器设置"
+        cancelText="取消"
+        okText="确定"
+        open={isModalOpen}
+        onOk={handleOk}
+        onCancel={handleCancel}
+      >
+        富文本新一站是
+      </Modal>
+    </div>,
+  );
+};
+
+const RichTextEditing = connect(InternalRichTextEditing);
+
+export default RichTextEditing;
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/style.ts b/packages/li-p2/src/components/Formily/RichTextEditing/style.ts
new file mode 100644
index 00000000..4d8f917b
--- /dev/null
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/style.ts
@@ -0,0 +1,15 @@
+import { genStyleHook } from '@formily/antd-v5/esm/__builtins__';
+
+export default genStyleHook('rich-text-editing', (token) => {
+  const { antCls, componentCls } = token;
+
+  return {
+    [componentCls]: {
+      width: '100%',
+
+      [`${componentCls}__btn`]: {
+        width: '100%',
+      },
+    },
+  };
+});
diff --git a/packages/li-p2/src/components/Formily/index.ts b/packages/li-p2/src/components/Formily/index.ts
index a0e9992d..81b8d2fe 100644
--- a/packages/li-p2/src/components/Formily/index.ts
+++ b/packages/li-p2/src/components/Formily/index.ts
@@ -10,3 +10,4 @@ export { default as RibbonSelect } from './RibbonSelect';
 export { default as Slider } from './Slider';
 export { default as SliderRange } from './SliderRange';
 export { default as TimeGranularitySelect } from './TimeGranularitySelect';
+export { default as RichTextEditing } from './RichTextEditing';

From ff76a6fa981dc771f81ebaac2574a9bfa5ea79e8 Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Tue, 19 Dec 2023 15:29:04 +0800
Subject: [PATCH 02/13] =?UTF-8?q?fix:=20=E7=BC=96=E8=BE=91=E6=9A=82?=
 =?UTF-8?q?=E5=AD=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/li-p2/package.json                   |  2 +
 .../Formily/RichTextEditing/Editor.tsx        | 55 +++++++++++++++++++
 .../Formily/RichTextEditing/index.tsx         | 11 +++-
 3 files changed, 66 insertions(+), 2 deletions(-)
 create mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx

diff --git a/packages/li-p2/package.json b/packages/li-p2/package.json
index eeaf8353..2a3ab44f 100644
--- a/packages/li-p2/package.json
+++ b/packages/li-p2/package.json
@@ -48,6 +48,7 @@
     "colorbrewer": "^1.5.3",
     "dayjs": "^1.11.7",
     "lodash-es": "^4.17.21",
+    "quill": "^1.3.6",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1"
   },
@@ -56,6 +57,7 @@
     "@antv/l7": "^2.17.2",
     "@antv/larkmap": "^1.4.9",
     "@types/lodash-es": "^4.17.6",
+    "@types/quill": "^2.0.14",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "antd": "^5.5.0",
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx
new file mode 100644
index 00000000..87c415c7
--- /dev/null
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx
@@ -0,0 +1,55 @@
+import React, { useEffect, useRef } from 'react';
+import Quill from 'quill';
+import 'quill/dist/quill.snow.css';
+
+type EditorProps = {
+  onSubmit: (val: any) => void;
+};
+
+const Editor: React.FC<EditorProps> = (props) => {
+  const { onSubmit } = props;
+  const editorContainerRef = useRef();
+
+  useEffect(() => {
+    const quill = new Quill('#editor-container', {
+      modules: {
+        toolbar: [
+          [
+            { size: ['small', false, 'large', 'huge'] },
+            { header: [1, 2, 3, 4, 5, 6, false] },
+            'bold',
+            'italic',
+            'underline',
+            { color: [] },
+            { background: [] },
+            { script: 'sub' },
+            { script: 'super' },
+            { align: [] },
+            { list: 'ordered' },
+            { list: 'bullet' },
+            'link',
+            'image',
+          ],
+        ],
+      },
+      placeholder: '请输入...',
+      theme: 'snow',
+    });
+
+    quill.on('editor-change', function () {
+      const delta = quill.getContents();
+      onSubmit(delta);
+    });
+
+    return () => {
+      quill.off('editor-change', function () {
+        const delta = quill.getContents();
+        onSubmit(delta);
+      });
+    };
+  }, []);
+
+  return <div ref={editorContainerRef.current} id="editor-container" />;
+};
+
+export default Editor;
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
index 278251b5..063f22fb 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
@@ -4,6 +4,8 @@ import { Button, Modal } from 'antd';
 import cls from 'classnames';
 import React, { useState } from 'react';
 import useStyle from './style';
+import 'quill/dist/quill.snow.css';
+import Editor from './Editor';
 
 type InternalRichTextEditingProps = {};
 
@@ -16,6 +18,10 @@ const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props)
     setIsModalOpen(false);
   };
 
+  const onSubmit = (val: any) => {
+    console.log(val, '垂手可得肌肤回到家');
+  };
+
   const handleCancel = () => {
     setIsModalOpen(false);
   };
@@ -29,11 +35,12 @@ const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props)
         title="筛选器设置"
         cancelText="取消"
         okText="确定"
-        open={isModalOpen}
+        open={true}
         onOk={handleOk}
         onCancel={handleCancel}
+        width={600}
       >
-        富文本新一站是
+        <Editor onSubmit={onSubmit} />
       </Modal>
     </div>,
   );

From 59614c5920c7593bb1b501304518e16e72556961 Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Fri, 22 Dec 2023 09:53:06 +0800
Subject: [PATCH 03/13] =?UTF-8?q?fix:=20=E6=95=B0=E6=8D=AE=E5=B1=95?=
 =?UTF-8?q?=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/li-p2/package.json                   |  2 +
 .../Formily/RichTextEditing/Editor.tsx        | 63 +++++++++++++------
 2 files changed, 45 insertions(+), 20 deletions(-)

diff --git a/packages/li-p2/package.json b/packages/li-p2/package.json
index 2a3ab44f..0cf174b2 100644
--- a/packages/li-p2/package.json
+++ b/packages/li-p2/package.json
@@ -63,6 +63,8 @@
     "antd": "^5.5.0",
     "dumi": "^1.1.46",
     "father": "^4.0.7",
+    "quill-image-resize-module": "^3.0.0",
+    "quill-image-upload": "^0.1.3",
     "rimraf": "^3.0.2",
     "typescript": "^4.7.4"
   },
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx
index 87c415c7..395d5cdf 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx
@@ -1,6 +1,11 @@
-import React, { useEffect, useRef } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import Quill from 'quill';
 import 'quill/dist/quill.snow.css';
+import { ImageResize } from 'quill-image-resize-module';
+import { ImageUpload } from 'quill-image-upload';
+
+Quill.register('modules/imageResize', ImageResize);
+Quill.register('modules/imageUpload', ImageUpload);
 
 type EditorProps = {
   onSubmit: (val: any) => void;
@@ -8,29 +13,31 @@ type EditorProps = {
 
 const Editor: React.FC<EditorProps> = (props) => {
   const { onSubmit } = props;
-  const editorContainerRef = useRef();
+  const editorContainerRef = useRef<HTMLDivElement>(null);
+  const informationRef = useRef<HTMLDivElement>(null);
+  const [vals, setValis] = useState<any>();
 
   useEffect(() => {
-    const quill = new Quill('#editor-container', {
+    const quill = new Quill(editorContainerRef.current!, {
       modules: {
         toolbar: [
-          [
-            { size: ['small', false, 'large', 'huge'] },
-            { header: [1, 2, 3, 4, 5, 6, false] },
-            'bold',
-            'italic',
-            'underline',
-            { color: [] },
-            { background: [] },
-            { script: 'sub' },
-            { script: 'super' },
-            { align: [] },
-            { list: 'ordered' },
-            { list: 'bullet' },
-            'link',
-            'image',
-          ],
+          ['bold', 'italic', 'underline', 'strike'], // 加粗，斜体，下划线，删除线
+          ['blockquote', 'code-block'], // 引用，代码块
+          [{ header: 1 }, { header: 2 }], // 标题，键值对的形式；1、2表示字体大小
+          [{ list: 'ordered' }, { list: 'bullet' }], // 列表
+          [{ script: 'sub' }, { script: 'super' }], // 上下标
+          [{ indent: '-1' }, { indent: '+1' }], // 缩进
+          [{ direction: 'rtl' }], // 文本方向
+          [{ size: ['small', false, 'large', 'huge'] }], // 字体大小
+          [{ header: [1, 2, 3, 4, 5, 6, false] }], // 几级标题
+          [{ color: [] }, { background: [] }], // 字体颜色，字体背景颜色
+          [{ align: [] }], // 对齐方式
+          ['clean'], // 清除字体样式
+          ['image'], // 上传图片、上传视频
         ],
+        ImageResize: {
+          modules: ['Resize', 'DisplaySize', 'Toolbar'],
+        },
       },
       placeholder: '请输入...',
       theme: 'snow',
@@ -38,6 +45,7 @@ const Editor: React.FC<EditorProps> = (props) => {
 
     quill.on('editor-change', function () {
       const delta = quill.getContents();
+      setValis(delta);
       onSubmit(delta);
     });
 
@@ -49,7 +57,22 @@ const Editor: React.FC<EditorProps> = (props) => {
     };
   }, []);
 
-  return <div ref={editorContainerRef.current} id="editor-container" />;
+  // 预览编辑信息展示
+  useEffect(() => {
+    const quill2 = new Quill(informationRef.current!, {
+      modules: {},
+      theme: 'bubble',
+    });
+    quill2.enable(false);
+    quill2.setContents(vals);
+  }, [vals]);
+
+  return (
+    <>
+      <div ref={editorContainerRef} />
+      <div ref={informationRef} />
+    </>
+  );
 };
 
 export default Editor;

From d31d576a457828b5f5374ee7a1b98708d8cf6e20 Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Mon, 25 Dec 2023 17:58:00 +0800
Subject: [PATCH 04/13] =?UTF-8?q?fix:=20=E6=95=B4=E4=BD=93=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../AppIntroductionControl/Component.tsx      |  42 ++++++
 .../widgets/AppIntroductionControl/index.md   |   1 +
 .../widgets/AppIntroductionControl/index.tsx  |  19 +++
 .../AppIntroductionControl/registerForm.ts    |  43 +++++++
 .../widgets/AppIntroductionControl/style.ts   |  16 +++
 .../li-analysis-assets/src/widgets/index.ts   |   1 +
 .../WidgetForm/SchemaField.tsx                |   3 +-
 packages/li-p2/package.json                   |   1 +
 .../Formily/RichTextEditing/Editor.tsx        |  78 ------------
 .../Formily/RichTextEditing/Editor/index.css  |  78 ++++++++++++
 .../Formily/RichTextEditing/Editor/index.tsx  | 120 ++++++++++++++++++
 .../Formily/RichTextEditing/Editor/style.ts   | 101 +++++++++++++++
 .../Formily/RichTextEditing/demos/default.tsx |   2 +-
 .../Formily/RichTextEditing/index.tsx         |  16 ++-
 .../Formily/RichTextEditing/style.ts          |   2 +-
 15 files changed, 437 insertions(+), 86 deletions(-)
 create mode 100644 packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
 create mode 100644 packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.md
 create mode 100644 packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx
 create mode 100644 packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
 create mode 100644 packages/li-analysis-assets/src/widgets/AppIntroductionControl/style.ts
 delete mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx
 create mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.css
 create mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
 create mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts

diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
new file mode 100644
index 00000000..9248a1db
--- /dev/null
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
@@ -0,0 +1,42 @@
+import { CustomControl } from '@antv/larkmap';
+import type { ImplementWidgetProps } from '@antv/li-sdk';
+import classNames from 'classnames';
+import Quill from 'quill';
+import 'quill/dist/quill.snow.css';
+import React, { useEffect, useRef } from 'react';
+import type { Properties } from './registerForm';
+import useStyle from './style';
+
+const CLS_PREFIX = 'li-analysis-app-introduction';
+
+export interface AppIntroductionControlProps extends Properties, ImplementWidgetProps {}
+
+const AppIntroductionControl: React.FC<AppIntroductionControlProps> = (props) => {
+  const { position, content } = props;
+  const styles = useStyle();
+  const informationRef = useRef<HTMLDivElement>(null);
+  const quillRef = useRef<Quill>();
+
+  useEffect(() => {
+    const quill = new Quill(informationRef.current!, {
+      modules: {},
+      theme: 'bubble',
+    });
+    quill.enable(false);
+    quillRef.current = quill;
+  }, []);
+
+  useEffect(() => {
+    if (content && quillRef.current) {
+      quillRef.current.setContents(content);
+    }
+  }, [content]);
+
+  return (
+    <CustomControl position={position} className={classNames(styles.appIntroduction, CLS_PREFIX)}>
+      <div ref={informationRef} />
+    </CustomControl>
+  );
+};
+
+export default AppIntroductionControl;
diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.md b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.md
new file mode 100644
index 00000000..8a521154
--- /dev/null
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.md
@@ -0,0 +1 @@
+## AppIntroductionControl
diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx
new file mode 100644
index 00000000..9f859270
--- /dev/null
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx
@@ -0,0 +1,19 @@
+import { implementWidget } from '@antv/li-sdk';
+import component from './Component';
+import registerForm from './registerForm';
+
+export default implementWidget({
+  version: 'v0.1',
+  metadata: {
+    name: 'AppIntroductionControl',
+    displayName: '应用简介',
+    description: '添加应用介绍说明信息',
+    type: 'Auto',
+    category: 'MapControl',
+  },
+  defaultProperties: {
+    position: 'topright' as const,
+  },
+  component,
+  registerForm,
+});
diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
new file mode 100644
index 00000000..c8a8dc4f
--- /dev/null
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
@@ -0,0 +1,43 @@
+import type { PositionName } from '@antv/l7';
+import type { WidgetRegisterForm } from '@antv/li-sdk';
+/**
+ * 属性面板生产的数据类型定义
+ */
+export type Properties = {
+  position?: PositionName;
+  width?: number;
+  height?: number;
+  content?: any;
+};
+
+export default (): WidgetRegisterForm<Properties> => {
+  // 属性面板表单的 Schema 定义，来自表单库 formily 的 Schema
+  const schema = {
+    position: {
+      title: '放置方位',
+      type: 'string',
+      'x-decorator': 'FormItem',
+      'x-component': 'ControlPositionSelect',
+      default: 'topright',
+    },
+    width: {
+      title: '宽度',
+      type: 'string',
+      'x-decorator': 'FormItem',
+      'x-component': 'NumberPicker',
+      'x-component-props': {
+        addonAfter: 'px',
+        min: 0,
+        precision: 0,
+      },
+      default: 100,
+    },
+    content: {
+      type: 'any',
+      'x-decorator': 'FormItem',
+      'x-component': 'RichTextEditing',
+      'x-decorator-props': {},
+    },
+  };
+  return { schema };
+};
diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/style.ts b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/style.ts
new file mode 100644
index 00000000..d7bb2108
--- /dev/null
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/style.ts
@@ -0,0 +1,16 @@
+import { css } from '@emotion/css';
+import { theme } from 'antd';
+
+function useStyle() {
+  const { useToken } = theme;
+  const { token } = useToken();
+  const { colorBgContainer } = token;
+
+  return {
+    appIntroduction: css`
+      background-color: ${colorBgContainer};
+    `,
+  };
+}
+
+export default useStyle;
diff --git a/packages/li-analysis-assets/src/widgets/index.ts b/packages/li-analysis-assets/src/widgets/index.ts
index c1430215..abeb737c 100644
--- a/packages/li-analysis-assets/src/widgets/index.ts
+++ b/packages/li-analysis-assets/src/widgets/index.ts
@@ -13,3 +13,4 @@ export { default as MeasureControl } from './MeasureControl';
 export { default as TimeLine } from './TimeLine';
 export { default as SpreadSheetTable } from './SpreadSheetTable';
 export { default as AdministrativeSelectControl } from './AdministrativeSelectControl';
+export { default as AppIntroductionControl } from './AppIntroductionControl';
diff --git a/packages/li-editor/src/widgets/WidgetsPanel/WidgetAttribute/WidgetForm/SchemaField.tsx b/packages/li-editor/src/widgets/WidgetsPanel/WidgetAttribute/WidgetForm/SchemaField.tsx
index bcef3b8f..d307313c 100644
--- a/packages/li-editor/src/widgets/WidgetsPanel/WidgetAttribute/WidgetForm/SchemaField.tsx
+++ b/packages/li-editor/src/widgets/WidgetsPanel/WidgetAttribute/WidgetForm/SchemaField.tsx
@@ -1,4 +1,4 @@
-import { ControlPositionSelect, FieldSelect, FormCollapse, TimeGranularitySelect } from '@antv/li-p2';
+import { ControlPositionSelect, RichTextEditing, FieldSelect, FormCollapse, TimeGranularitySelect } from '@antv/li-p2';
 import {
   ArrayItems,
   Checkbox,
@@ -32,6 +32,7 @@ const SchemaField = createSchemaField({
     Space,
     FormGrid,
     ControlPositionSelect,
+    RichTextEditing,
     TimeGranularitySelect,
   },
 });
diff --git a/packages/li-p2/package.json b/packages/li-p2/package.json
index 0cf174b2..e395d717 100644
--- a/packages/li-p2/package.json
+++ b/packages/li-p2/package.json
@@ -49,6 +49,7 @@
     "dayjs": "^1.11.7",
     "lodash-es": "^4.17.21",
     "quill": "^1.3.6",
+    "quill-image-resize-module-react": "^3.0.0",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1"
   },
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx
deleted file mode 100644
index 395d5cdf..00000000
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import Quill from 'quill';
-import 'quill/dist/quill.snow.css';
-import { ImageResize } from 'quill-image-resize-module';
-import { ImageUpload } from 'quill-image-upload';
-
-Quill.register('modules/imageResize', ImageResize);
-Quill.register('modules/imageUpload', ImageUpload);
-
-type EditorProps = {
-  onSubmit: (val: any) => void;
-};
-
-const Editor: React.FC<EditorProps> = (props) => {
-  const { onSubmit } = props;
-  const editorContainerRef = useRef<HTMLDivElement>(null);
-  const informationRef = useRef<HTMLDivElement>(null);
-  const [vals, setValis] = useState<any>();
-
-  useEffect(() => {
-    const quill = new Quill(editorContainerRef.current!, {
-      modules: {
-        toolbar: [
-          ['bold', 'italic', 'underline', 'strike'], // 加粗，斜体，下划线，删除线
-          ['blockquote', 'code-block'], // 引用，代码块
-          [{ header: 1 }, { header: 2 }], // 标题，键值对的形式；1、2表示字体大小
-          [{ list: 'ordered' }, { list: 'bullet' }], // 列表
-          [{ script: 'sub' }, { script: 'super' }], // 上下标
-          [{ indent: '-1' }, { indent: '+1' }], // 缩进
-          [{ direction: 'rtl' }], // 文本方向
-          [{ size: ['small', false, 'large', 'huge'] }], // 字体大小
-          [{ header: [1, 2, 3, 4, 5, 6, false] }], // 几级标题
-          [{ color: [] }, { background: [] }], // 字体颜色，字体背景颜色
-          [{ align: [] }], // 对齐方式
-          ['clean'], // 清除字体样式
-          ['image'], // 上传图片、上传视频
-        ],
-        ImageResize: {
-          modules: ['Resize', 'DisplaySize', 'Toolbar'],
-        },
-      },
-      placeholder: '请输入...',
-      theme: 'snow',
-    });
-
-    quill.on('editor-change', function () {
-      const delta = quill.getContents();
-      setValis(delta);
-      onSubmit(delta);
-    });
-
-    return () => {
-      quill.off('editor-change', function () {
-        const delta = quill.getContents();
-        onSubmit(delta);
-      });
-    };
-  }, []);
-
-  // 预览编辑信息展示
-  useEffect(() => {
-    const quill2 = new Quill(informationRef.current!, {
-      modules: {},
-      theme: 'bubble',
-    });
-    quill2.enable(false);
-    quill2.setContents(vals);
-  }, [vals]);
-
-  return (
-    <>
-      <div ref={editorContainerRef} />
-      <div ref={informationRef} />
-    </>
-  );
-};
-
-export default Editor;
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.css b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.css
new file mode 100644
index 00000000..a75324a9
--- /dev/null
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.css
@@ -0,0 +1,78 @@
+/* 字号样式 */
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value='ft12']::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value='ft12']::before {
+  content: '12px';
+}
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value='ft14']::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value='ft14']::before {
+  content: '14px';
+}
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value='ft16']::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value='ft16']::before {
+  content: '16px';
+}
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value='ft18']::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value='ft18']::before {
+  content: '18px';
+}
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value='ft32']::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value='ft32']::before {
+  content: '32px';
+}
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value='ft48']::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value='ft48']::before {
+  content: '48px';
+}
+.ql-size-ft12 {
+  font-size: 10px;
+}
+
+.ql-size-ft14 {
+  font-size: 14px;
+}
+
+.ql-size-ft16 {
+  font-size: 16px;
+}
+
+.ql-size-ft18 {
+  font-size: 18px;
+}
+
+.ql-size-ft32 {
+  font-size: 32px;
+}
+
+.ql-size-ft48 {
+  font-size: 48px;
+}
+
+/* 标题样式 */
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value='1']::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value='1']::before {
+  content: 'H1';
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value='2']::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value='2']::before {
+  content: 'H2';
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value='3']::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value='3']::before {
+  content: 'H3';
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value='4']::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value='4']::before {
+  content: 'H4';
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value='5']::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value='5']::before {
+  content: 'H5';
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value='6']::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value='6']::before {
+  content: 'H6';
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item::before {
+  content: '常规';
+}
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
new file mode 100644
index 00000000..f1b14177
--- /dev/null
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
@@ -0,0 +1,120 @@
+import { Button, Form, Input, Popover } from 'antd';
+import Quill from 'quill';
+import 'quill/dist/quill.snow.css';
+import React, { useEffect, useRef, useState } from 'react';
+import './index.css';
+import { usePrefixCls } from '@formily/antd-v5/esm/__builtins__';
+import cls from 'classnames';
+import useStyle from './style';
+
+type EditorProps = {
+  value?: any;
+  onChange: (val: any) => void;
+};
+
+// 字体大小
+const FontAttributor = Quill.import('attributors/class/size');
+FontAttributor.whitelist = ['ft12', 'ft14', 'ft16', 'ft18', 'ft32', 'ft48'];
+Quill.register(FontAttributor, true);
+
+const Editor: React.FC<EditorProps> = (props) => {
+  const { onChange, value } = props;
+  const prefixCls = usePrefixCls('formily-rich-editor', props);
+  const [wrapSSR, hashId] = useStyle(prefixCls);
+  const editorContainerRef = useRef<HTMLDivElement>(null);
+  const quillRef = useRef<Quill>();
+  const [open, setOpen] = useState(false);
+  const [form] = Form.useForm();
+
+  useEffect(() => {
+    const quill = new Quill(editorContainerRef.current!, {
+      modules: {
+        toolbar: {
+          container: [
+            [{ size: ['ft12', 'ft14', 'ft16', 'ft18', 'ft32', 'ft48'] }], //字体大小
+            [{ header: [false, 1, 2, 3, 4, 5, 6] }], // 几级标题
+            [
+              { color: [] }, // 字体颜色
+              'bold', // 加粗
+              'italic', // 斜体
+              'underline', //下划线，
+              { align: [] }, // 对齐方式
+              { background: [] }, // 字体背景颜色
+              { list: 'ordered' },
+              { list: 'bullet' }, // 列表
+              'image', // 上传图片
+            ],
+          ],
+          handlers: {
+            image: () => {
+              setOpen(true);
+            },
+          },
+        },
+      },
+      placeholder: '请输入...',
+      theme: 'snow',
+    });
+
+    quillRef.current = quill;
+    if (value) {
+      quillRef.current.setContents(value);
+    }
+
+    quill.on('editor-change', function () {
+      const delta = quill.getContents();
+      onChange(delta);
+    });
+
+    return () => {
+      quill.off('editor-change', function () {
+        const delta = quill.getContents();
+        onChange(delta);
+      });
+    };
+  }, []);
+
+  const content = (
+    <div>
+      <Form layout="vertical" requiredMark={false} form={form} style={{ minWidth: 500 }}>
+        <Form.Item
+          name="image"
+          label="图片 URL"
+          validateFirst={true}
+          rules={[{ required: true, message: '请输入图片地址' }]}
+        >
+          <Input placeholder="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*r6H_R5wv-WgAAAAAAAAAAAAADmJ7AQ/original" />
+        </Form.Item>
+      </Form>
+      <Button
+        onClick={() => {
+          if (quillRef.current && form.getFieldValue('image')) {
+            const contents = quillRef.current.getContents();
+            quillRef.current.insertEmbed(quillRef.current.getLength(), 'image', form.getFieldValue('image'));
+          }
+          setOpen(false);
+        }}
+      >
+        确定
+      </Button>
+    </div>
+  );
+
+  console.log(document.querySelector('.ql-image'), 'lskfnsjk');
+
+  return wrapSSR(
+    <div className={cls(`${prefixCls}`, hashId)}>
+      <div ref={editorContainerRef} />
+      <div>dlfgknfjkg</div>
+      <Popover
+        open={open}
+        content={content}
+        title="插入图片"
+        trigger="click"
+        getPopupContainer={() => document.querySelector('.ql-toolbar')!}
+      />
+    </div>,
+  );
+};
+
+export default Editor;
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
new file mode 100644
index 00000000..cc091d84
--- /dev/null
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
@@ -0,0 +1,101 @@
+import { genStyleHook } from '@formily/antd-v5/esm/__builtins__';
+
+export default genStyleHook('rich-editor', (token) => {
+  const { componentCls, colorText, colorBgElevated, colorPrimaryHover, colorPrimaryActive, colorBorder } = token;
+
+  return {
+    [componentCls]: {
+      width: '100%',
+      minHeight: '300px',
+
+      '.ql-editor': {
+        minHeight: '300px',
+      },
+
+      '.ql-snow .ql-picker-options': {
+        backgroundColor: colorBgElevated,
+      },
+
+      // 颜色
+      '.ql-snow .ql-picker': {
+        color: colorText,
+      },
+
+      '.ql-snow .ql-stroke': {
+        stroke: colorText,
+      },
+
+      '.ql-snow .ql-fill': {
+        fill: colorText,
+      },
+
+      // 鼠标经过
+      '.ql-snow.ql-toolbar .ql-picker-label:hover': {
+        color: colorPrimaryHover,
+
+        '.ql-stroke': {
+          stroke: colorPrimaryHover,
+        },
+
+        '.ql-fill': {
+          fill: colorPrimaryHover,
+        },
+      },
+
+      '.ql-snow.ql-toolbar button:hover': {
+        color: colorPrimaryHover,
+        '.ql-stroke': {
+          stroke: colorPrimaryHover,
+        },
+
+        '.ql-fill': {
+          fill: colorPrimaryHover,
+        },
+      },
+
+      '.ql-snow.ql-toolbar .ql-picker-item:hover': {
+        color: colorPrimaryHover,
+
+        '.ql-stroke': {
+          stroke: colorPrimaryHover,
+        },
+      },
+
+      // 选中颜色
+      '.ql-snow.ql-toolbar button.ql-active': {
+        color: colorPrimaryActive,
+        '.ql-stroke': {
+          stroke: colorPrimaryActive,
+        },
+
+        '.ql-fill': {
+          fill: colorPrimaryActive,
+        },
+      },
+
+      '.ql-snow.ql-toolbar .ql-picker-label.ql-active': {
+        color: colorPrimaryActive,
+        '.ql-stroke': {
+          stroke: colorPrimaryActive,
+        },
+
+        '.ql-fill': {
+          fill: colorPrimaryActive,
+        },
+      },
+
+      // 边框颜色
+      '.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options': {
+        borderColor: colorBgElevated,
+      },
+
+      '.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label': {
+        borderColor: colorBorder,
+      },
+
+      '.ql-toolbar.ql-snow , .ql-container.ql-snow': {
+        borderColor: colorBorder,
+      },
+    },
+  };
+});
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/demos/default.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/demos/default.tsx
index 6c0408c7..e0358f60 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/demos/default.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/demos/default.tsx
@@ -6,7 +6,7 @@ import { createSchemaField, FormConsumer } from '@formily/react';
 import React from 'react';
 
 const form = createForm({
-  initialValues: { slider: [0, 19] },
+  initialValues: {},
   effects() {
     onFormValuesChange((formIns: FormInstance<any>) => {
       console.log('formIns.values: ', formIns.values);
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
index 063f22fb..47660fa6 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
@@ -7,19 +7,25 @@ import useStyle from './style';
 import 'quill/dist/quill.snow.css';
 import Editor from './Editor';
 
-type InternalRichTextEditingProps = {};
+type InternalRichTextEditingProps = {
+  value?: any;
+  onChange: (val: any) => void;
+};
 
 const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props) => {
+  const { onChange, value } = props;
   const prefixCls = usePrefixCls('formily-rich-text-editing', props);
   const [wrapSSR, hashId] = useStyle(prefixCls);
   const [isModalOpen, setIsModalOpen] = useState(false);
+  const [content, setContent] = useState<any>();
 
   const handleOk = () => {
+    onChange(content);
     setIsModalOpen(false);
   };
 
   const onSubmit = (val: any) => {
-    console.log(val, '垂手可得肌肤回到家');
+    setContent(val);
   };
 
   const handleCancel = () => {
@@ -32,15 +38,15 @@ const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props)
         编辑
       </Button>
       <Modal
-        title="筛选器设置"
+        title="应用简介设置"
         cancelText="取消"
         okText="确定"
         open={true}
         onOk={handleOk}
         onCancel={handleCancel}
-        width={600}
+        width={1000}
       >
-        <Editor onSubmit={onSubmit} />
+        <Editor value={value} onChange={onSubmit} />
       </Modal>
     </div>,
   );
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/style.ts b/packages/li-p2/src/components/Formily/RichTextEditing/style.ts
index 4d8f917b..87ea895e 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/style.ts
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/style.ts
@@ -1,7 +1,7 @@
 import { genStyleHook } from '@formily/antd-v5/esm/__builtins__';
 
 export default genStyleHook('rich-text-editing', (token) => {
-  const { antCls, componentCls } = token;
+  const { componentCls } = token;
 
   return {
     [componentCls]: {

From 6f7a56ccd431b896c057bde177878dfa0c194118 Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Tue, 26 Dec 2023 12:32:00 +0800
Subject: [PATCH 05/13] =?UTF-8?q?fix:=20=E5=88=9D=E7=A8=BF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../AppIntroductionControl/Component.tsx      |  6 +-
 .../AppIntroductionControl/registerForm.ts    | 14 +++-
 .../Formily/RichTextEditing/Editor/index.tsx  | 71 ++++++++++++-------
 .../Formily/RichTextEditing/Editor/style.ts   | 10 +++
 .../Formily/RichTextEditing/index.tsx         |  2 +-
 5 files changed, 72 insertions(+), 31 deletions(-)

diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
index 9248a1db..70281551 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
@@ -3,7 +3,7 @@ import type { ImplementWidgetProps } from '@antv/li-sdk';
 import classNames from 'classnames';
 import Quill from 'quill';
 import 'quill/dist/quill.snow.css';
-import React, { useEffect, useRef } from 'react';
+import React, { useEffect, useMemo, useRef } from 'react';
 import type { Properties } from './registerForm';
 import useStyle from './style';
 
@@ -12,7 +12,7 @@ const CLS_PREFIX = 'li-analysis-app-introduction';
 export interface AppIntroductionControlProps extends Properties, ImplementWidgetProps {}
 
 const AppIntroductionControl: React.FC<AppIntroductionControlProps> = (props) => {
-  const { position, content } = props;
+  const { position, width, height, content } = props;
   const styles = useStyle();
   const informationRef = useRef<HTMLDivElement>(null);
   const quillRef = useRef<Quill>();
@@ -34,7 +34,7 @@ const AppIntroductionControl: React.FC<AppIntroductionControlProps> = (props) =>
 
   return (
     <CustomControl position={position} className={classNames(styles.appIntroduction, CLS_PREFIX)}>
-      <div ref={informationRef} />
+      <div style={{ width, height, overflow: 'hidden' }} ref={informationRef} />
     </CustomControl>
   );
 };
diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
index c8a8dc4f..01ed361e 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
@@ -23,6 +23,19 @@ export default (): WidgetRegisterForm<Properties> => {
     width: {
       title: '宽度',
       type: 'string',
+      default: 100,
+      'x-decorator': 'FormItem',
+      'x-component': 'NumberPicker',
+      'x-component-props': {
+        addonAfter: 'px',
+        min: 0,
+        precision: 0,
+      },
+    },
+    height: {
+      title: '高度',
+      type: 'string',
+      default: 150,
       'x-decorator': 'FormItem',
       'x-component': 'NumberPicker',
       'x-component-props': {
@@ -30,7 +43,6 @@ export default (): WidgetRegisterForm<Properties> => {
         min: 0,
         precision: 0,
       },
-      default: 100,
     },
     content: {
       type: 'any',
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
index f1b14177..f926c4ba 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
@@ -1,10 +1,10 @@
+import { usePrefixCls } from '@formily/antd-v5/esm/__builtins__';
 import { Button, Form, Input, Popover } from 'antd';
+import cls from 'classnames';
 import Quill from 'quill';
 import 'quill/dist/quill.snow.css';
 import React, { useEffect, useRef, useState } from 'react';
 import './index.css';
-import { usePrefixCls } from '@formily/antd-v5/esm/__builtins__';
-import cls from 'classnames';
 import useStyle from './style';
 
 type EditorProps = {
@@ -74,44 +74,63 @@ const Editor: React.FC<EditorProps> = (props) => {
     };
   }, []);
 
+  const onFormClose = () => {
+    setOpen(false);
+    form.resetFields();
+  };
+
   const content = (
-    <div>
-      <Form layout="vertical" requiredMark={false} form={form} style={{ minWidth: 500 }}>
-        <Form.Item
-          name="image"
-          label="图片 URL"
-          validateFirst={true}
-          rules={[{ required: true, message: '请输入图片地址' }]}
-        >
-          <Input placeholder="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*r6H_R5wv-WgAAAAAAAAAAAAADmJ7AQ/original" />
+    <div className={cls(`${prefixCls}__popover__content`, hashId)}>
+      <Form form={form} style={{ minWidth: 500 }}>
+        <Form.Item name="image" validateFirst={true} rules={[{ required: true, message: '请输入图片地址' }]}>
+          <Input placeholder="https://example.png" />
+        </Form.Item>
+
+        <Form.Item className={cls(`${prefixCls}__popover__content-btn`, hashId)}>
+          <Button onClick={onFormClose} style={{ marginRight: 10 }}>
+            取消
+          </Button>
+          <Button
+            type="primary"
+            onClick={() => {
+              if (quillRef.current && form.getFieldValue('image')) {
+                const selection = quillRef.current.getSelection(true).index; //当前光标位置
+                const contents = quillRef.current.getContents();
+                contents.ops.splice(selection > 0 ? selection - 1 : selection, 0, {
+                  insert: {
+                    image: form.getFieldValue('image'),
+                  },
+                  attributes: {
+                    width: '100%',
+                  },
+                });
+                quillRef.current.setContents(contents);
+              }
+              onFormClose();
+            }}
+          >
+            确定
+          </Button>
         </Form.Item>
       </Form>
-      <Button
-        onClick={() => {
-          if (quillRef.current && form.getFieldValue('image')) {
-            const contents = quillRef.current.getContents();
-            quillRef.current.insertEmbed(quillRef.current.getLength(), 'image', form.getFieldValue('image'));
-          }
-          setOpen(false);
-        }}
-      >
-        确定
-      </Button>
     </div>
   );
 
-  console.log(document.querySelector('.ql-image'), 'lskfnsjk');
-
   return wrapSSR(
     <div className={cls(`${prefixCls}`, hashId)}>
       <div ref={editorContainerRef} />
-      <div>dlfgknfjkg</div>
       <Popover
+        overlayClassName={cls(`${prefixCls}__popover`, hashId)}
+        overlayStyle={{ left: 220, top: 0 }}
         open={open}
         content={content}
         title="插入图片"
         trigger="click"
-        getPopupContainer={() => document.querySelector('.ql-toolbar')!}
+        placement="bottom"
+        arrow={false}
+        destroyTooltipOnHide={true}
+        // 渲染父节点上
+        getPopupContainer={() => editorContainerRef.current!}
       />
     </div>,
   );
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
index cc091d84..fbb5ebd5 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
@@ -97,5 +97,15 @@ export default genStyleHook('rich-editor', (token) => {
         borderColor: colorBorder,
       },
     },
+
+    [`${componentCls}__popover`]: {},
+
+    [`${componentCls}__popover__content`]: {
+      background: colorBgElevated,
+
+      '&-btn': {
+        textAlign: 'right',
+      },
+    },
   };
 });
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
index 47660fa6..ca6ec2c8 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
@@ -41,7 +41,7 @@ const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props)
         title="应用简介设置"
         cancelText="取消"
         okText="确定"
-        open={true}
+        open={isModalOpen}
         onOk={handleOk}
         onCancel={handleCancel}
         width={1000}

From 383c87dbee390ab2d8b59fb65e9fa335377f7be4 Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Tue, 26 Dec 2023 16:29:55 +0800
Subject: [PATCH 06/13] =?UTF-8?q?fix:=20=E9=97=AE=E9=A2=98=E5=A4=84?=
 =?UTF-8?q?=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../widgets/AppIntroductionControl/Component.tsx  |  6 +++---
 .../src/widgets/AppIntroductionControl/index.tsx  |  1 +
 .../AppIntroductionControl/registerForm.ts        | 15 +--------------
 .../src/widgets/AppIntroductionControl/style.ts   |  8 ++++++++
 .../Formily/RichTextEditing/Editor/index.tsx      |  2 +-
 .../Formily/RichTextEditing/Editor/style.ts       |  2 --
 .../components/Formily/RichTextEditing/index.tsx  |  2 +-
 7 files changed, 15 insertions(+), 21 deletions(-)

diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
index 70281551..6690de4b 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
@@ -3,7 +3,7 @@ import type { ImplementWidgetProps } from '@antv/li-sdk';
 import classNames from 'classnames';
 import Quill from 'quill';
 import 'quill/dist/quill.snow.css';
-import React, { useEffect, useMemo, useRef } from 'react';
+import React, { useEffect, useRef } from 'react';
 import type { Properties } from './registerForm';
 import useStyle from './style';
 
@@ -12,7 +12,7 @@ const CLS_PREFIX = 'li-analysis-app-introduction';
 export interface AppIntroductionControlProps extends Properties, ImplementWidgetProps {}
 
 const AppIntroductionControl: React.FC<AppIntroductionControlProps> = (props) => {
-  const { position, width, height, content } = props;
+  const { position, width, content } = props;
   const styles = useStyle();
   const informationRef = useRef<HTMLDivElement>(null);
   const quillRef = useRef<Quill>();
@@ -34,7 +34,7 @@ const AppIntroductionControl: React.FC<AppIntroductionControlProps> = (props) =>
 
   return (
     <CustomControl position={position} className={classNames(styles.appIntroduction, CLS_PREFIX)}>
-      <div style={{ width, height, overflow: 'hidden' }} ref={informationRef} />
+      <div style={{ width }} ref={informationRef} />
     </CustomControl>
   );
 };
diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx
index 9f859270..26d8068c 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx
@@ -13,6 +13,7 @@ export default implementWidget({
   },
   defaultProperties: {
     position: 'topright' as const,
+    width: 300,
   },
   component,
   registerForm,
diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
index 01ed361e..e2ec8dc9 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
@@ -6,7 +6,6 @@ import type { WidgetRegisterForm } from '@antv/li-sdk';
 export type Properties = {
   position?: PositionName;
   width?: number;
-  height?: number;
   content?: any;
 };
 
@@ -23,19 +22,7 @@ export default (): WidgetRegisterForm<Properties> => {
     width: {
       title: '宽度',
       type: 'string',
-      default: 100,
-      'x-decorator': 'FormItem',
-      'x-component': 'NumberPicker',
-      'x-component-props': {
-        addonAfter: 'px',
-        min: 0,
-        precision: 0,
-      },
-    },
-    height: {
-      title: '高度',
-      type: 'string',
-      default: 150,
+      default: 300,
       'x-decorator': 'FormItem',
       'x-component': 'NumberPicker',
       'x-component-props': {
diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/style.ts b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/style.ts
index d7bb2108..c8e20b0a 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/style.ts
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/style.ts
@@ -9,6 +9,14 @@ function useStyle() {
   return {
     appIntroduction: css`
       background-color: ${colorBgContainer};
+
+      .ql-editor {
+        overflow: hidden;
+      }
+
+      .ql-tooltip {
+        display: none;
+      }
     `,
   };
 }
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
index f926c4ba..7d79d8f5 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
@@ -129,7 +129,7 @@ const Editor: React.FC<EditorProps> = (props) => {
         placement="bottom"
         arrow={false}
         destroyTooltipOnHide={true}
-        // 渲染父节点上
+        onOpenChange={(open: boolean) => setOpen(open)}
         getPopupContainer={() => editorContainerRef.current!}
       />
     </div>,
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
index fbb5ebd5..506a14fc 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
@@ -98,8 +98,6 @@ export default genStyleHook('rich-editor', (token) => {
       },
     },
 
-    [`${componentCls}__popover`]: {},
-
     [`${componentCls}__popover__content`]: {
       background: colorBgElevated,
 
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
index ca6ec2c8..e470a2f6 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
@@ -44,7 +44,7 @@ const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props)
         open={isModalOpen}
         onOk={handleOk}
         onCancel={handleCancel}
-        width={1000}
+        width={800}
       >
         <Editor value={value} onChange={onSubmit} />
       </Modal>

From 8235c280b34005611b7208781a0829bb6c899833 Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Wed, 27 Dec 2023 09:12:43 +0800
Subject: [PATCH 07/13] =?UTF-8?q?fix:=20=E7=B1=BB=E5=9E=8B=E5=AE=9A?=
 =?UTF-8?q?=E4=B9=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../widgets/AppIntroductionControl/registerForm.ts   |  3 ++-
 .../Formily/RichTextEditing/Editor/index.tsx         |  7 ++++---
 .../src/components/Formily/RichTextEditing/index.tsx | 11 ++++++-----
 .../src/components/Formily/RichTextEditing/type.ts   | 12 ++++++++++++
 packages/li-p2/src/components/Formily/index.ts       |  1 +
 5 files changed, 25 insertions(+), 9 deletions(-)
 create mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/type.ts

diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
index e2ec8dc9..0e8d2a3a 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
@@ -1,12 +1,13 @@
 import type { PositionName } from '@antv/l7';
 import type { WidgetRegisterForm } from '@antv/li-sdk';
+import type { RichTextEditingDelta } from '@antv/li-p2';
 /**
  * 属性面板生产的数据类型定义
  */
 export type Properties = {
   position?: PositionName;
   width?: number;
-  content?: any;
+  content?: RichTextEditingDelta;
 };
 
 export default (): WidgetRegisterForm<Properties> => {
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
index 7d79d8f5..77c28d3e 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
@@ -2,14 +2,15 @@ import { usePrefixCls } from '@formily/antd-v5/esm/__builtins__';
 import { Button, Form, Input, Popover } from 'antd';
 import cls from 'classnames';
 import Quill from 'quill';
+import type { RichTextEditingDelta } from '../type';
 import 'quill/dist/quill.snow.css';
 import React, { useEffect, useRef, useState } from 'react';
 import './index.css';
 import useStyle from './style';
 
 type EditorProps = {
-  value?: any;
-  onChange: (val: any) => void;
+  value?: RichTextEditingDelta;
+  onChange: (val: RichTextEditingDelta) => void;
 };
 
 // 字体大小
@@ -19,7 +20,7 @@ Quill.register(FontAttributor, true);
 
 const Editor: React.FC<EditorProps> = (props) => {
   const { onChange, value } = props;
-  const prefixCls = usePrefixCls('formily-rich-editor', props);
+  const prefixCls = usePrefixCls('formily-rich-editor');
   const [wrapSSR, hashId] = useStyle(prefixCls);
   const editorContainerRef = useRef<HTMLDivElement>(null);
   const quillRef = useRef<Quill>();
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
index e470a2f6..8ff796fe 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
@@ -6,25 +6,26 @@ import React, { useState } from 'react';
 import useStyle from './style';
 import 'quill/dist/quill.snow.css';
 import Editor from './Editor';
+import type { RichTextEditingDelta } from './type';
 
 type InternalRichTextEditingProps = {
-  value?: any;
-  onChange: (val: any) => void;
+  value?: RichTextEditingDelta;
+  onChange: (val?: RichTextEditingDelta) => void;
 };
 
 const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props) => {
   const { onChange, value } = props;
-  const prefixCls = usePrefixCls('formily-rich-text-editing', props);
+  const prefixCls = usePrefixCls('formily-rich-text-editing');
   const [wrapSSR, hashId] = useStyle(prefixCls);
   const [isModalOpen, setIsModalOpen] = useState(false);
-  const [content, setContent] = useState<any>();
+  const [content, setContent] = useState<RichTextEditingDelta>();
 
   const handleOk = () => {
     onChange(content);
     setIsModalOpen(false);
   };
 
-  const onSubmit = (val: any) => {
+  const onSubmit = (val: RichTextEditingDelta) => {
     setContent(val);
   };
 
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/type.ts b/packages/li-p2/src/components/Formily/RichTextEditing/type.ts
new file mode 100644
index 00000000..543b977d
--- /dev/null
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/type.ts
@@ -0,0 +1,12 @@
+type Op = {
+  insert?: string | Record<string, any>;
+  attributes?: Record<string, any>;
+};
+
+export type RichTextEditingDelta = {
+  ops?:
+    | Op[]
+    | {
+        ops: Op[];
+      };
+};
diff --git a/packages/li-p2/src/components/Formily/index.ts b/packages/li-p2/src/components/Formily/index.ts
index 81b8d2fe..82f8711b 100644
--- a/packages/li-p2/src/components/Formily/index.ts
+++ b/packages/li-p2/src/components/Formily/index.ts
@@ -11,3 +11,4 @@ export { default as Slider } from './Slider';
 export { default as SliderRange } from './SliderRange';
 export { default as TimeGranularitySelect } from './TimeGranularitySelect';
 export { default as RichTextEditing } from './RichTextEditing';
+export type { RichTextEditingDelta } from './RichTextEditing/type';

From da973cffeb4d6fb68b86e611d6b2145fb1f16a64 Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Wed, 27 Dec 2023 14:10:45 +0800
Subject: [PATCH 08/13] =?UTF-8?q?fix:=20=E7=B1=BB=E5=9E=8B=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/li-analysis-assets/package.json             |  3 ++-
 .../widgets/AppIntroductionControl/registerForm.ts   |  5 +++--
 packages/li-p2/package.json                          |  3 +--
 .../Formily/RichTextEditing/Editor/index.tsx         |  6 +++---
 .../src/components/Formily/RichTextEditing/index.tsx | 10 +++++-----
 .../src/components/Formily/RichTextEditing/type.ts   | 12 ------------
 packages/li-p2/src/components/Formily/index.ts       |  1 -
 7 files changed, 14 insertions(+), 26 deletions(-)
 delete mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/type.ts

diff --git a/packages/li-analysis-assets/package.json b/packages/li-analysis-assets/package.json
index 3a637747..5e1b4148 100644
--- a/packages/li-analysis-assets/package.json
+++ b/packages/li-analysis-assets/package.json
@@ -50,7 +50,8 @@
     "classnames": "^2.3.1",
     "dayjs": "^1.11.7",
     "geotiff": "^2.1.0",
-    "lodash-es": "^4.17.21"
+    "lodash-es": "^4.17.21",
+    "quill": "^1.3.7"
   },
   "devDependencies": {
     "@ant-design/icons": "^5.0.1",
diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
index 0e8d2a3a..dd55fcbb 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
@@ -1,13 +1,14 @@
 import type { PositionName } from '@antv/l7';
 import type { WidgetRegisterForm } from '@antv/li-sdk';
-import type { RichTextEditingDelta } from '@antv/li-p2';
+import type { Delta } from 'quill-delta';
+
 /**
  * 属性面板生产的数据类型定义
  */
 export type Properties = {
   position?: PositionName;
   width?: number;
-  content?: RichTextEditingDelta;
+  content?: Delta;
 };
 
 export default (): WidgetRegisterForm<Properties> => {
diff --git a/packages/li-p2/package.json b/packages/li-p2/package.json
index 7e26b5e7..37dfc22b 100644
--- a/packages/li-p2/package.json
+++ b/packages/li-p2/package.json
@@ -48,8 +48,7 @@
     "colorbrewer": "^1.5.3",
     "dayjs": "^1.11.7",
     "lodash-es": "^4.17.21",
-    "quill": "^1.3.6",
-    "quill-image-resize-module-react": "^3.0.0",
+    "quill": "^1.3.7",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1"
   },
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
index 77c28d3e..95058391 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
@@ -2,15 +2,15 @@ import { usePrefixCls } from '@formily/antd-v5/esm/__builtins__';
 import { Button, Form, Input, Popover } from 'antd';
 import cls from 'classnames';
 import Quill from 'quill';
-import type { RichTextEditingDelta } from '../type';
+import type { Delta } from 'quill-delta';
 import 'quill/dist/quill.snow.css';
 import React, { useEffect, useRef, useState } from 'react';
 import './index.css';
 import useStyle from './style';
 
 type EditorProps = {
-  value?: RichTextEditingDelta;
-  onChange: (val: RichTextEditingDelta) => void;
+  value?: Delta;
+  onChange: (val: Delta) => void;
 };
 
 // 字体大小
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
index 8ff796fe..e924a1c0 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
@@ -6,11 +6,11 @@ import React, { useState } from 'react';
 import useStyle from './style';
 import 'quill/dist/quill.snow.css';
 import Editor from './Editor';
-import type { RichTextEditingDelta } from './type';
+import type { Delta } from 'quill-delta';
 
 type InternalRichTextEditingProps = {
-  value?: RichTextEditingDelta;
-  onChange: (val?: RichTextEditingDelta) => void;
+  value?: Delta;
+  onChange: (val?: Delta) => void;
 };
 
 const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props) => {
@@ -18,14 +18,14 @@ const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props)
   const prefixCls = usePrefixCls('formily-rich-text-editing');
   const [wrapSSR, hashId] = useStyle(prefixCls);
   const [isModalOpen, setIsModalOpen] = useState(false);
-  const [content, setContent] = useState<RichTextEditingDelta>();
+  const [content, setContent] = useState<Delta>();
 
   const handleOk = () => {
     onChange(content);
     setIsModalOpen(false);
   };
 
-  const onSubmit = (val: RichTextEditingDelta) => {
+  const onSubmit = (val: Delta) => {
     setContent(val);
   };
 
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/type.ts b/packages/li-p2/src/components/Formily/RichTextEditing/type.ts
deleted file mode 100644
index 543b977d..00000000
--- a/packages/li-p2/src/components/Formily/RichTextEditing/type.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-type Op = {
-  insert?: string | Record<string, any>;
-  attributes?: Record<string, any>;
-};
-
-export type RichTextEditingDelta = {
-  ops?:
-    | Op[]
-    | {
-        ops: Op[];
-      };
-};
diff --git a/packages/li-p2/src/components/Formily/index.ts b/packages/li-p2/src/components/Formily/index.ts
index 5abd3267..23db3bbd 100644
--- a/packages/li-p2/src/components/Formily/index.ts
+++ b/packages/li-p2/src/components/Formily/index.ts
@@ -21,4 +21,3 @@ export { default as Slider } from './Slider';
 export { default as SliderRange } from './SliderRange';
 export { default as TimeGranularitySelect } from './TimeGranularitySelect';
 export { default as RichTextEditing } from './RichTextEditing';
-export type { RichTextEditingDelta } from './RichTextEditing/type';

From 9024aa63d13037081bd9364348cbcbfd1cd2ab4d Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Wed, 27 Dec 2023 15:25:20 +0800
Subject: [PATCH 09/13] =?UTF-8?q?fix:=20=E6=95=B0=E6=8D=AE=E7=B1=BB?=
 =?UTF-8?q?=E5=9E=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/widgets/AppIntroductionControl/registerForm.ts |  4 ++--
 .../Formily/RichTextEditing/Editor/index.tsx           |  6 +++---
 .../src/components/Formily/RichTextEditing/index.tsx   | 10 +++++-----
 .../src/components/Formily/RichTextEditing/type.ts     |  8 ++++++++
 packages/li-p2/src/components/Formily/index.ts         |  1 +
 5 files changed, 19 insertions(+), 10 deletions(-)
 create mode 100644 packages/li-p2/src/components/Formily/RichTextEditing/type.ts

diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
index dd55fcbb..605ad074 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/registerForm.ts
@@ -1,6 +1,6 @@
 import type { PositionName } from '@antv/l7';
 import type { WidgetRegisterForm } from '@antv/li-sdk';
-import type { Delta } from 'quill-delta';
+import type { RichTextEditingType } from '@antv/li-p2';
 
 /**
  * 属性面板生产的数据类型定义
@@ -8,7 +8,7 @@ import type { Delta } from 'quill-delta';
 export type Properties = {
   position?: PositionName;
   width?: number;
-  content?: Delta;
+  content?: RichTextEditingType;
 };
 
 export default (): WidgetRegisterForm<Properties> => {
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
index 95058391..ca5fbaec 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
@@ -2,15 +2,15 @@ import { usePrefixCls } from '@formily/antd-v5/esm/__builtins__';
 import { Button, Form, Input, Popover } from 'antd';
 import cls from 'classnames';
 import Quill from 'quill';
-import type { Delta } from 'quill-delta';
+import type { RichTextEditingType } from '../type';
 import 'quill/dist/quill.snow.css';
 import React, { useEffect, useRef, useState } from 'react';
 import './index.css';
 import useStyle from './style';
 
 type EditorProps = {
-  value?: Delta;
-  onChange: (val: Delta) => void;
+  value?: RichTextEditingType;
+  onChange: (val: RichTextEditingType) => void;
 };
 
 // 字体大小
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
index e924a1c0..e5a477cd 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
@@ -6,11 +6,11 @@ import React, { useState } from 'react';
 import useStyle from './style';
 import 'quill/dist/quill.snow.css';
 import Editor from './Editor';
-import type { Delta } from 'quill-delta';
+import type { RichTextEditingType } from './type';
 
 type InternalRichTextEditingProps = {
-  value?: Delta;
-  onChange: (val?: Delta) => void;
+  value?: RichTextEditingType;
+  onChange: (val?: RichTextEditingType) => void;
 };
 
 const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props) => {
@@ -18,14 +18,14 @@ const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props)
   const prefixCls = usePrefixCls('formily-rich-text-editing');
   const [wrapSSR, hashId] = useStyle(prefixCls);
   const [isModalOpen, setIsModalOpen] = useState(false);
-  const [content, setContent] = useState<Delta>();
+  const [content, setContent] = useState<RichTextEditingType>();
 
   const handleOk = () => {
     onChange(content);
     setIsModalOpen(false);
   };
 
-  const onSubmit = (val: Delta) => {
+  const onSubmit = (val: RichTextEditingType) => {
     setContent(val);
   };
 
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/type.ts b/packages/li-p2/src/components/Formily/RichTextEditing/type.ts
new file mode 100644
index 00000000..85e3fa55
--- /dev/null
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/type.ts
@@ -0,0 +1,8 @@
+type Op = {
+  insert?: string | Record<string, unknown>;
+  attributes?: string | Record<string, unknown>;
+};
+
+export type RichTextEditingType = {
+  ops?: Op[] | { ops: Op[] };
+};
diff --git a/packages/li-p2/src/components/Formily/index.ts b/packages/li-p2/src/components/Formily/index.ts
index 23db3bbd..7fbcf50d 100644
--- a/packages/li-p2/src/components/Formily/index.ts
+++ b/packages/li-p2/src/components/Formily/index.ts
@@ -21,3 +21,4 @@ export { default as Slider } from './Slider';
 export { default as SliderRange } from './SliderRange';
 export { default as TimeGranularitySelect } from './TimeGranularitySelect';
 export { default as RichTextEditing } from './RichTextEditing';
+export type { RichTextEditingType } from './RichTextEditing/type';

From 9428f2907b826fac7121c473e65621a5919e35b0 Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Wed, 27 Dec 2023 15:32:37 +0800
Subject: [PATCH 10/13] =?UTF-8?q?fix:=20=E6=95=B0=E6=8D=AE=E7=B1=BB?=
 =?UTF-8?q?=E5=9E=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/Formily/RichTextEditing/Editor/index.tsx      | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
index ca5fbaec..0d166db3 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
@@ -59,6 +59,7 @@ const Editor: React.FC<EditorProps> = (props) => {
 
     quillRef.current = quill;
     if (value) {
+      // @ts-ignore
       quillRef.current.setContents(value);
     }
 

From 30c9957d2a0c62381a98bdef22493bd6464cad4c Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Wed, 27 Dec 2023 15:49:40 +0800
Subject: [PATCH 11/13] =?UTF-8?q?fix:=20=E4=BA=86=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/widgets/AppIntroductionControl/Component.tsx             | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
index 6690de4b..127b9bcf 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
@@ -28,6 +28,7 @@ const AppIntroductionControl: React.FC<AppIntroductionControlProps> = (props) =>
 
   useEffect(() => {
     if (content && quillRef.current) {
+      // @ts-ignore
       quillRef.current.setContents(content);
     }
   }, [content]);

From 0e1816e353c641ba83e3c29be1736f45e3c11c09 Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Wed, 27 Dec 2023 17:21:30 +0800
Subject: [PATCH 12/13] =?UTF-8?q?fix:=20=E9=97=AE=E9=A2=98=E5=A4=84?=
 =?UTF-8?q?=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../AppIntroductionControl/Component.tsx      | 22 ++++++++--
 .../Formily/RichTextEditing/Editor/index.css  | 21 ++++++++++
 .../Formily/RichTextEditing/Editor/index.tsx  | 17 ++++++--
 .../Formily/RichTextEditing/Editor/style.ts   | 41 ++++++++++++++++++-
 .../Formily/RichTextEditing/index.tsx         |  2 +
 5 files changed, 94 insertions(+), 9 deletions(-)

diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
index 127b9bcf..29835426 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/Component.tsx
@@ -1,9 +1,10 @@
 import { CustomControl } from '@antv/larkmap';
 import type { ImplementWidgetProps } from '@antv/li-sdk';
 import classNames from 'classnames';
+import { isEmpty } from 'lodash-es';
 import Quill from 'quill';
 import 'quill/dist/quill.snow.css';
-import React, { useEffect, useRef } from 'react';
+import React, { useEffect, useMemo, useRef } from 'react';
 import type { Properties } from './registerForm';
 import useStyle from './style';
 
@@ -17,6 +18,15 @@ const AppIntroductionControl: React.FC<AppIntroductionControlProps> = (props) =>
   const informationRef = useRef<HTMLDivElement>(null);
   const quillRef = useRef<Quill>();
 
+  const isEffectiveContent = useMemo(() => {
+    if (content && content.ops && Array.isArray(content.ops)) {
+      const isExist = content.ops.find((item: { insert?: any }) => item.insert !== '\n');
+      return isExist;
+    }
+
+    return false;
+  }, [content]);
+
   useEffect(() => {
     const quill = new Quill(informationRef.current!, {
       modules: {},
@@ -27,14 +37,18 @@ const AppIntroductionControl: React.FC<AppIntroductionControlProps> = (props) =>
   }, []);
 
   useEffect(() => {
-    if (content && quillRef.current) {
+    if (quillRef.current && isEffectiveContent) {
       // @ts-ignore
       quillRef.current.setContents(content);
     }
-  }, [content]);
+  }, [isEffectiveContent]);
 
   return (
-    <CustomControl position={position} className={classNames(styles.appIntroduction, CLS_PREFIX)}>
+    <CustomControl
+      position={position}
+      className={classNames(styles.appIntroduction, CLS_PREFIX)}
+      style={{ display: isEmpty(isEffectiveContent) ? 'none' : 'block' }}
+    >
       <div style={{ width }} ref={informationRef} />
     </CustomControl>
   );
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.css b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.css
index a75324a9..1214f657 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.css
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.css
@@ -76,3 +76,24 @@
 .ql-snow .ql-picker.ql-header .ql-picker-item::before {
   content: '常规';
 }
+
+/* 链接 */
+.ql-snow .ql-tooltip[data-mode='link']::before {
+  content: 'url：';
+}
+
+.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
+  content: '保存';
+}
+
+.ql-snow .ql-tooltip::before {
+  content: 'url：';
+}
+
+.ql-snow .ql-tooltip a.ql-action::after {
+  content: '修改';
+}
+
+.ql-snow .ql-tooltip a.ql-remove::before {
+  content: '删除';
+}
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
index 0d166db3..aef69e13 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/index.tsx
@@ -32,18 +32,27 @@ const Editor: React.FC<EditorProps> = (props) => {
       modules: {
         toolbar: {
           container: [
-            [{ size: ['ft12', 'ft14', 'ft16', 'ft18', 'ft32', 'ft48'] }], //字体大小
-            [{ header: [false, 1, 2, 3, 4, 5, 6] }], // 几级标题
             [
-              { color: [] }, // 字体颜色
+              { size: ['ft12', 'ft14', 'ft16', 'ft18', 'ft32', 'ft48'] }, //字体大小
+              { header: [false, 1, 2, 3, 4, 5, 6] }, // 几级标题
+            ],
+            [
               'bold', // 加粗
               'italic', // 斜体
               'underline', //下划线，
-              { align: [] }, // 对齐方式
+            ],
+            [
+              { color: [] }, // 字体颜色
               { background: [] }, // 字体背景颜色
+            ],
+            [
+              { align: [] }, // 对齐方式
               { list: 'ordered' },
               { list: 'bullet' }, // 列表
+            ],
+            [
               'image', // 上传图片
+              'link', // 链接
             ],
           ],
           handlers: {
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
index 506a14fc..ef1ffd4f 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/Editor/style.ts
@@ -1,12 +1,22 @@
 import { genStyleHook } from '@formily/antd-v5/esm/__builtins__';
 
 export default genStyleHook('rich-editor', (token) => {
-  const { componentCls, colorText, colorBgElevated, colorPrimaryHover, colorPrimaryActive, colorBorder } = token;
+  const {
+    componentCls,
+    colorText,
+    colorBgContainer,
+    colorBgElevated,
+    colorPrimaryHover,
+    colorPrimaryActive,
+    colorBorder,
+    boxShadow,
+  } = token;
 
   return {
     [componentCls]: {
       width: '100%',
       minHeight: '300px',
+      background: colorBgContainer,
 
       '.ql-editor': {
         minHeight: '300px',
@@ -96,6 +106,35 @@ export default genStyleHook('rich-editor', (token) => {
       '.ql-toolbar.ql-snow , .ql-container.ql-snow': {
         borderColor: colorBorder,
       },
+
+      // 链接
+      '.ql-snow .ql-tooltip': {
+        background: colorBgElevated,
+        boxShadow: boxShadow,
+        borderColor: colorBorder,
+      },
+
+      '.ql-snow .ql-tooltip::before': {
+        color: colorText,
+      },
+
+      '.ql-snow .ql-tooltip input[type=text]': {
+        background: colorBgElevated,
+        borderColor: colorBorder,
+        color: colorText,
+      },
+
+      ".ql-snow .ql-tooltip[data-mode='link']::before": {
+        color: colorText,
+      },
+
+      '.ql-snow .ql-tooltip a': {
+        color: colorPrimaryActive,
+
+        '&:hover': {
+          color: colorPrimaryHover,
+        },
+      },
     },
 
     [`${componentCls}__popover__content`]: {
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
index e5a477cd..5b2e8585 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
@@ -43,6 +43,8 @@ const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props)
         cancelText="取消"
         okText="确定"
         open={isModalOpen}
+        destroyOnClose={true}
+        maskClosable={false}
         onOk={handleOk}
         onCancel={handleCancel}
         width={800}

From 216838b81b5d941d316c49bebacf57d123d86874 Mon Sep 17 00:00:00 2001
From: yxh01132861 <yxh01132861@antgroup.com>
Date: Fri, 29 Dec 2023 10:10:05 +0800
Subject: [PATCH 13/13] =?UTF-8?q?fix:=20=E6=8F=8F=E8=BF=B0=E4=BF=A1?=
 =?UTF-8?q?=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/widgets/AppIntroductionControl/index.tsx              | 4 ++--
 .../li-p2/src/components/Formily/RichTextEditing/index.tsx    | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx
index 26d8068c..eb4cce03 100644
--- a/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx
+++ b/packages/li-analysis-assets/src/widgets/AppIntroductionControl/index.tsx
@@ -6,8 +6,8 @@ export default implementWidget({
   version: 'v0.1',
   metadata: {
     name: 'AppIntroductionControl',
-    displayName: '应用简介',
-    description: '添加应用介绍说明信息',
+    displayName: '应用描述控件',
+    description: '利用富文本编辑器，添加应用描述信息',
     type: 'Auto',
     category: 'MapControl',
   },
diff --git a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
index 5b2e8585..3ede115d 100644
--- a/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
+++ b/packages/li-p2/src/components/Formily/RichTextEditing/index.tsx
@@ -39,7 +39,7 @@ const InternalRichTextEditing: React.FC<InternalRichTextEditingProps> = (props)
         编辑
       </Button>
       <Modal
-        title="应用简介设置"
+        title="设置"
         cancelText="取消"
         okText="确定"
         open={isModalOpen}