update 增加usePanel默认方法

src/components/BpmnDesign/hooks/usePanel.ts

@@ -11,27 +11,25 @@ export default (ops: Options) => {
   const modeling = getModeling();
   const moddle = getModdle();
 
+  /**
+   * 当前节点类型
+   */
   const elementType = computed(() => {
     const bizObj = element.businessObject;
     return bizObj.eventDefinitions ? bizObj.eventDefinitions[0].$type : bizObj.$type;
   });
 
+  /**
+   * 用于控制面板字段显示与隐藏的配置
+   */
   const config = computed(() => showConfig[elementType.value] || {});
 
-  const updateProperties = (properties: any) => {
+  /**
-    modeling.updateProperties(element, properties);
+   * 创建一个节点
-  };
+   * @param elementType 节点类型
-
+   * @param properties 属性
-  const idChange = (newVal: string) => {
+   * @param parent 父节点
-    if (newVal) {
+   */
-      updateProperties({ id: newVal });
-    }
-  };
-  const nameChange = (newVal: string) => {
-    if (newVal) {
-      updateProperties({ name: newVal });
-    }
-  };
   const createModdleElement = (elementType: string, properties: any, parent: Element) => {
     const element = moddle.create(elementType, properties);
     parent && (element.$parent = parent);
@@ -41,15 +39,19 @@ export default (ops: Options) => {
   /**
    * 获取扩展属性，如果不存在会自动创建
    */
-  const getExtensionElements = () => {
+  const getExtensionElements = (create = true) => {
     let extensionElements = element.businessObject.get('extensionElements');
-    if (!extensionElements) {
+    if (!extensionElements && create) {
       extensionElements = createModdleElement('bpmn:ExtensionElements', { values: [] }, element.businessObject);
       modeling.updateModdleProperties(element, element.businessObject, { extensionElements });
     }
     return extensionElements;
   };
 
+  /**
+   * 获取extensionElements下的properties
+   * @param extensionElements 可选参数，默认获取当前Element下的extensionElements下的Properties
+   */
   const getPropertiesElements = (extensionElements?) => {
     if (!extensionElements) {
       extensionElements = getExtensionElements();
@@ -64,6 +66,28 @@ export default (ops: Options) => {
     return propertiesElements;
   };
 
+  /**
+   * 更新节点属性
+   * @param properties 属性值
+   */
+  const updateProperties = (properties: any) => {
+    modeling.updateProperties(element, properties);
+  };
+
+  /**
+   * 更新节点信息
+   * @param updateElement 需要更新的节点
+   * @param properties 属性
+   */
+  const updateModdleProperties = (updateElement, properties: any) => {
+    modeling.updateModdleProperties(element, updateElement, properties);
+  };
+
+  /**
+   * 更新Property属性
+   * @param name key值
+   * @param value 值
+   */
   const updateProperty = (name: string, value: string) => {
     const propertiesElements = getPropertiesElements();
 
@@ -79,14 +103,23 @@ export default (ops: Options) => {
     return propertyElements;
   };
 
+  const idChange = (newVal: string) => {
+    if (newVal) {
+      updateProperties({ id: newVal });
+    }
+  };
+  const nameChange = (newVal: string) => {
+    if (newVal) {
+      updateProperties({ name: newVal });
+    }
+  };
   return {
     elementType,
     showConfig: config,
-    modeling,
-    moddle,
 
     updateProperties,
     updateProperty,
+    updateModdleProperties,
 
     createModdleElement,
     idChange,