feat: add date control #601

Hufe921 · May 31, 2024 · 3989199 · 3989199
1 parent d54a701
commit 3989199
Show file tree

Hide file tree

Showing 9 changed files with 475 additions and 106 deletions.
diff --git a/docs/en/guide/schema.md b/docs/en/guide/schema.md
@@ -81,7 +81,8 @@ interface IElement {
       TEXT = 'text',
       SELECT = 'select',
       CHECKBOX = 'checkbox',
-      RADIO = 'radio'
+      RADIO = 'radio',
+      DATE = 'date'
     };
     value: IElement[] | null;
     placeholder?: string;
@@ -102,18 +103,7 @@ interface IElement {
       value: string;
       code: string;
     }[];
-    checkbox?: {
-      value: boolean | null;
-      code?: string;
-      min?: number;
-      max?: number;
-      disabled?: boolean;
-    };
-    radio?: {
-      value: boolean | null;
-      code?: string;
-      disabled?: boolean;
-    };
+    dateFormat?: string;
     font?: string;
     size?: number;
     bold?: boolean;
@@ -133,14 +123,10 @@ interface IElement {
   // checkbox
   checkbox?: {
     value: boolean | null;
-    code?: string;
-    disabled?: boolean;
   };
   // radio
   radio?: {
     value: boolean | null;
-    code?: string;
-    disabled?: boolean;
   };
   // LaTeX
   laTexSVG?: string;

diff --git a/docs/guide/schema.md b/docs/guide/schema.md
@@ -82,6 +82,7 @@ interface IElement {
       SELECT = 'select',
       CHECKBOX = 'checkbox',
       RADIO = 'radio'
+      DATE = 'date'
     };
     value: IElement[] | null;
     placeholder?: string;
@@ -102,18 +103,7 @@ interface IElement {
       value: string;
       code: string;
     }[];
-    checkbox?: {
-      value: boolean | null;
-      code?: string;
-      min?: number;
-      max?: number;
-      disabled?: boolean;
-    };
-    radio?: {
-      value: boolean | null;
-      code?: string;
-      disabled?: boolean;
-    };
+    dateFormat?: string;
     font?: string;
     size?: number;
     bold?: boolean;
@@ -133,14 +123,10 @@ interface IElement {
   // 复选框
   checkbox?: {
     value: boolean | null;
-    code?: string;
-    disabled?: boolean;
   };
   // 单选框
   radio?: {
     value: boolean | null;
-    code?: string;
-    disabled?: boolean;
   };
   // LaTeX
   laTexSVG?: string;

diff --git a/src/editor/core/draw/control/Control.ts b/src/editor/core/draw/control/Control.ts
@@ -40,6 +40,7 @@ import { ControlSearch } from './interactive/ControlSearch'
 import { ControlBorder } from './richtext/Border'
 import { SelectControl } from './select/SelectControl'
 import { TextControl } from './text/TextControl'
+import { DateControl } from './date/DateControl'
 import { MoveDirection } from '../../../dataset/enum/Observer'
 
 interface IMoveCursorResult {
@@ -223,9 +224,16 @@ export class Control {
     const element = elementList[range.startIndex]
     // 判断控件是否已经激活
     if (this.activeControl) {
-      // 列举控件唤醒下拉弹窗
-      if (this.activeControl instanceof SelectControl) {
-        this.activeControl.awake()
+      // 弹窗类控件唤醒弹窗，后缀处移除弹窗
+      if (
+        this.activeControl instanceof SelectControl ||
+        this.activeControl instanceof DateControl
+      ) {
+        if (element.controlComponent === ControlComponent.POSTFIX) {
+          this.activeControl.destroy()
+        } else {
+          this.activeControl.awake()
+        }
       }
       const controlElement = this.activeControl.getElement()
       if (element.controlId === controlElement.controlId) return
@@ -244,6 +252,10 @@ export class Control {
       this.activeControl = new CheckboxControl(element, this)
     } else if (control.type === ControlType.RADIO) {
       this.activeControl = new RadioControl(element, this)
+    } else if (control.type === ControlType.DATE) {
+      const dateControl = new DateControl(element, this)
+      this.activeControl = dateControl
+      dateControl.awake()
     }
     // 激活控件回调
     nextTick(() => {
@@ -269,7 +281,10 @@ export class Control {
 
   public destroyControl() {
     if (this.activeControl) {
-      if (this.activeControl instanceof SelectControl) {
+      if (
+        this.activeControl instanceof SelectControl ||
+        this.activeControl instanceof DateControl
+      ) {
         this.activeControl.destroy()
       }
       this.activeControl = null
@@ -316,7 +331,8 @@ export class Control {
     const element = elementList[range.startIndex]
     this.activeControl.setElement(element)
     if (
-      this.activeControl instanceof SelectControl &&
+      (this.activeControl instanceof DateControl ||
+        this.activeControl instanceof SelectControl) &&
       this.activeControl.getIsPopup()
     ) {
       this.activeControl.destroy()
@@ -542,14 +558,14 @@ export class Control {
           const nextElement = elementList[j]
           if (nextElement.controlId !== element.controlId) break
           if (
-            type === ControlType.TEXT &&
+            (type === ControlType.TEXT || type === ControlType.DATE) &&
             nextElement.controlComponent === ControlComponent.VALUE
           ) {
             textControlValue += nextElement.value
           }
           j++
         }
-        if (type === ControlType.TEXT) {
+        if (type === ControlType.TEXT || type === ControlType.DATE) {
           result.push({
             ...element.control,
             zone,
@@ -674,6 +690,14 @@ export class Control {
           this.activeControl = radio
           const codes = value ? [value] : []
           radio.setSelect(codes, controlContext, controlRule)
+        } else if (type === ControlType.DATE) {
+          const date = new DateControl(element, this)
+          this.activeControl = date
+          if (value) {
+            date.setSelect(value, controlContext, controlRule)
+          } else {
+            date.clearSelect(controlContext, controlRule)
+          }
         }
         // 模拟控件激活后销毁
         this.activeControl = null