refactor: 重构 bpmnProcessDesigner 组件 ele => antd

apps/web-antd/src/components/bpmnProcessDesigner/package/penal/other/ElementOtherConfig.vue

@@ -1,29 +1,24 @@
-<template>
-  <div class="panel-tab__content">
-    <div class="element-property input-property">
-      <div class="element-property__label">元素文档：</div>
-      <div class="element-property__value">
-        <el-input
-          type="textarea"
-          v-model="documentation"
-          resize="vertical"
-          :autosize="{ minRows: 2, maxRows: 4 }"
-          @input="updateDocumentation"
-          @blur="updateDocumentation"
-        />
-      </div>
-    </div>
-  </div>
-</template>
-
 <script lang="ts" setup>
+import { nextTick, onBeforeUnmount, ref, toRaw, watch } from 'vue';
+
+import { Input } from 'ant-design-vue';
+
 defineOptions({ name: 'ElementOtherConfig' });
+
 const props = defineProps({
-  id: String,
+  id: {
+    type: String,
+    default: '',
+  },
 });
+
+const { Textarea } = Input;
+
 const documentation = ref('');
 const bpmnElement = ref();
+
 const bpmnInstances = () => (window as any).bpmnInstances;
+
 const updateDocumentation = () => {
   (bpmnElement.value && bpmnElement.value.id === props.id) ||
     (bpmnElement.value = bpmnInstances().elementRegistry.get(props.id));
@@ -37,6 +32,7 @@ const updateDocumentation = () => {
     documentation: [documentations],
   });
 };
+
 onBeforeUnmount(() => {
   bpmnElement.value = null;
 });
@@ -44,12 +40,14 @@ onBeforeUnmount(() => {
 watch(
   () => props.id,
   (id) => {
-    if (id && id.length) {
+    if (id && id.length > 0) {
       nextTick(() => {
         const documentations =
           bpmnInstances().bpmnElement.businessObject?.documentation;
         documentation.value =
-          documentations && documentations.length ? documentations[0].text : '';
+          documentations && documentations.length > 0
+            ? documentations[0].text
+            : '';
       });
     } else {
       documentation.value = '';
@@ -58,3 +56,19 @@ watch(
   { immediate: true },
 );
 </script>
+
+<template>
+  <div class="panel-tab__content">
+    <div class="element-property input-property">
+      <div class="element-property__label">元素文档：</div>
+      <div class="element-property__value">
+        <Textarea
+          v-model:value="documentation"
+          :auto-size="{ minRows: 2, maxRows: 4 }"
+          @change="updateDocumentation"
+          @blur="updateDocumentation"
+        />
+      </div>
+    </div>
+  </div>
+</template>