diff --git a/web/src/pages/agent/canvas/index.tsx b/web/src/pages/agent/canvas/index.tsx
index ca6e34a1b..7be70be83 100644
--- a/web/src/pages/agent/canvas/index.tsx
+++ b/web/src/pages/agent/canvas/index.tsx
@@ -71,7 +71,6 @@ import { RetrievalNode } from './node/retrieval-node';
 import { RewriteNode } from './node/rewrite-node';
 import { SplitterNode } from './node/splitter-node';
 import { SwitchNode } from './node/switch-node';
-import { TemplateNode } from './node/template-node';
 import TokenizerNode from './node/tokenizer-node';
 import { ToolNode } from './node/tool-node';
 import { VariableAggregatorNode } from './node/variable-aggregator-node';
@@ -88,7 +87,6 @@ export const nodeTypes: NodeTypes = {
   messageNode: MessageNode,
   rewriteNode: RewriteNode,
   keywordNode: KeywordNode,
-  templateNode: TemplateNode,
   // emailNode: EmailNode,
   group: IterationNode,
   iterationStartNode: IterationStartNode,
diff --git a/web/src/pages/agent/canvas/node/placeholder-node.tsx b/web/src/pages/agent/canvas/node/placeholder-node.tsx
index 7dc0d0fbd..e1de79c66 100644
--- a/web/src/pages/agent/canvas/node/placeholder-node.tsx
+++ b/web/src/pages/agent/canvas/node/placeholder-node.tsx
@@ -1,5 +1,5 @@
+import { Skeleton } from '@/components/ui/skeleton';
 import { NodeProps, Position } from '@xyflow/react';
-import { Skeleton } from 'antd';
 import { memo } from 'react';
 import { NodeHandleId } from '../../constant';
 import { CommonHandle } from './handle';
@@ -17,19 +17,10 @@ function InnerPlaceholderNode({ id, selected }: NodeProps) {
         nodeId={id}
         id={NodeHandleId.End}
       ></CommonHandle>
-
-      <section className="flex items-center gap-2">
-        <Skeleton.Avatar
-          active
-          size={24}
-          shape="square"
-          style={{ backgroundColor: 'rgba(255,255,255,0.05)' }}
-        />
-      </section>
-
-      <section className={'flex gap-2 flex-col'} style={{ marginTop: 10 }}>
-        <Skeleton.Input active style={{ width: '100%', height: 30 }} />
-      </section>
+      <div className="space-y-2">
+        <Skeleton className="h-8 w-8 rounded-full" />
+        <Skeleton className="h-6 w-full" />
+      </div>
     </NodeWrapper>
   );
 }
diff --git a/web/src/pages/agent/canvas/node/template-node.tsx b/web/src/pages/agent/canvas/node/template-node.tsx
deleted file mode 100644
index b204717ab..000000000
--- a/web/src/pages/agent/canvas/node/template-node.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import { useTheme } from '@/components/theme-provider';
-import { Handle, NodeProps, Position } from '@xyflow/react';
-import { Flex } from 'antd';
-import classNames from 'classnames';
-import { get } from 'lodash';
-import { useGetComponentLabelByValue } from '../../hooks/use-get-begin-query';
-import { IGenerateParameter } from '../../interface';
-import { LeftHandleStyle, RightHandleStyle } from './handle-icon';
-import NodeHeader from './node-header';
-
-import { ITemplateNode } from '@/interfaces/database/flow';
-import { memo } from 'react';
-import styles from './index.less';
-
-function InnerTemplateNode({
-  id,
-  data,
-  isConnectable = true,
-  selected,
-}: NodeProps<ITemplateNode>) {
-  const parameters: IGenerateParameter[] = get(data, 'form.parameters', []);
-  const getLabel = useGetComponentLabelByValue(id);
-  const { theme } = useTheme();
-  return (
-    <section
-      className={classNames(
-        styles.logicNode,
-        theme === 'dark' ? styles.dark : '',
-
-        {
-          [styles.selectedNode]: selected,
-        },
-      )}
-    >
-      <Handle
-        id="c"
-        type="source"
-        position={Position.Left}
-        isConnectable={isConnectable}
-        className={styles.handle}
-        style={LeftHandleStyle}
-      ></Handle>
-      <Handle
-        type="source"
-        position={Position.Right}
-        isConnectable={isConnectable}
-        className={styles.handle}
-        style={RightHandleStyle}
-        id="b"
-      ></Handle>
-
-      <NodeHeader
-        id={id}
-        name={data.name}
-        label={data.label}
-        className={styles.nodeHeader}
-      ></NodeHeader>
-
-      <Flex gap={8} vertical className={styles.generateParameters}>
-        {parameters.map((x) => (
-          <Flex
-            key={x.id}
-            align="center"
-            gap={6}
-            className={styles.conditionBlock}
-          >
-            <label htmlFor="">{x.key}</label>
-            <span className={styles.parameterValue}>
-              {getLabel(x.component_id)}
-            </span>
-          </Flex>
-        ))}
-      </Flex>
-    </section>
-  );
-}
-
-export const TemplateNode = memo(InnerTemplateNode);