feat: 新增自带动画demo

src/assets/svgs/reservoir.svg

@@ -0,0 +1,7 @@
+<svg t="1673619783393" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5654" width="200" height="200">
+	<rect x="0" y="155" width="1000" height="600" fill="#000000" stroke="#FFFFFF" stroke-width="4"></rect>
+	<line x1="80" y1="150" x2="920" y2="150" stroke="#000000" stroke-width="90"></line>
+	<rect transform="rotate(180,500,360)" x="20" y="0" width="960" height="400">
+		<animate attributeName="height" from="0" to="400" dur="5s" repeatCount="indefinite"/> 
+	</rect>
+</svg>

src/components/webtopo-svgedit/components/connection-panel/index.vue

@@ -51,8 +51,8 @@
 </template>
 <script lang="ts" setup>
   // import { IConfigItem } from '@/config-center/types';
-  import { straight_line_system, connection_line_system } from '@/config-center/svg-file/system';
-  import { ELineBindAnchors, ISystemStraightLine } from '@/config-center/svg-file/system/types';
+  import { straight_line_system, connection_line_system } from '@/config-center/system';
+  import { ELineBindAnchors, ISystemStraightLine } from '@/config-center/system/types';
   import { useConfigStore } from '@/store/config';
   import { PropType, ref } from 'vue';
   import { useGlobalStore } from '@/store/global';

src/components/webtopo-svgedit/components/left-panel/index.vue

@@ -57,7 +57,7 @@
   const globalStore = useGlobalStore();
   const select_lib = ref('svg文件');
   const config_center = ref<IConfigComponentGroup[]>(globalStore.config_center.svg文件);
-  const activeNames = ref(['stateful', 'stateless']);
+  const activeNames = ref(['stateful', 'stateless', 'have_animation']);
   const libChange = (val: any) => {
     config_center.value = [];
     config_center.value = val;

src/config-center/index.ts

@@ -1,8 +1,8 @@
-import { power_system_config_center } from './svg-file';
+import { svgfile_config_center } from './svg-file';
 import { IConfigCenter } from './types';
 
 export const configCenter: IConfigCenter = {
-  svg文件: power_system_config_center,
+  svg文件: svgfile_config_center,
   vue组件: [],
   自定义组件: [],
   图表: []

src/config-center/svg-file/have-animation/index.ts

@@ -0,0 +1,8 @@
+import { IConfigComponentGroup } from '../../types';
+import { reservoir_svg_file } from './reservoir';
+
+export const have_animation_group: IConfigComponentGroup = {
+  groupType: 'have_animation',
+  title: '自带动画',
+  list: [reservoir_svg_file]
+};

src/config-center/svg-file/have-animation/reservoir/index.ts

@@ -0,0 +1,19 @@
+import { EConfigItemPropsType, EDoneJsonType, IConfigItem } from '../../../types';
+
+export const reservoir_svg_file: IConfigItem = {
+  name: 'reservoir',
+  title: '蓄水池',
+  type: EDoneJsonType.File,
+  config: {
+    can_zoom: true,
+    have_anchor: true,
+    actual_rect: true
+  },
+  props: {
+    fill: {
+      title: '水流颜色',
+      type: EConfigItemPropsType.Color,
+      val: '#37cfe7'
+    }
+  }
+};

src/config-center/svg-file/index.ts

@@ -1,8 +1,10 @@
 import { IConfigComponentGroup } from '../types';
 import { stateful_group } from './stateful';
 import { stateless_group } from './stateless';
+import { have_animation_group } from './have-animation';
 
-export const power_system_config_center: IConfigComponentGroup[] = Object.seal([
+export const svgfile_config_center: IConfigComponentGroup[] = Object.seal([
   stateful_group,
-  stateless_group
+  stateless_group,
+  have_animation_group
 ]);

src/utils/index.ts

@@ -1,4 +1,4 @@
-import { ELineBindAnchors } from '@/config-center/svg-file/system/types';
+import { ELineBindAnchors } from '@/config-center/system/types';
 import type { IDoneJson } from '@/store/global/types';
 
 /**