From 5fcf69b73c7e849d17570195355a92f4e86e248f Mon Sep 17 00:00:00 2001
From: xqyjlj <xqyjlj@126.com>
Date: Sun, 14 Dec 2025 00:09:37 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:=20=E6=B7=BB=E5=8A=A0=20ct-num?=
 =?UTF-8?q?ber-label=20=E6=97=B6=E9=92=9F=E6=A0=91=E5=B1=9E=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/database/schema/clockTree.yml       |  1 +
 src/components/ClockView.vue                  |  3 +
 src/components/clockTree/CNumberLabelNode.vue | 93 +++++++++++++++++++
 3 files changed, 97 insertions(+)
 create mode 100644 src/components/clockTree/CNumberLabelNode.vue

diff --git a/resources/database/schema/clockTree.yml b/resources/database/schema/clockTree.yml
index a03f4952..178031c8 100644
--- a/resources/database/schema/clockTree.yml
+++ b/resources/database/schema/clockTree.yml
@@ -88,6 +88,7 @@ definitions:
           - "ct-select"
           - "ct-radio"
           - "ct-probe"
+          - "ct-number-label"
         description: "Type of node component"
       position:
         type: object
diff --git a/src/components/ClockView.vue b/src/components/ClockView.vue
index c51567b6..a5875bcb 100644
--- a/src/components/ClockView.vue
+++ b/src/components/ClockView.vue
@@ -298,6 +298,9 @@ defineExpose({
         <template #node-ct-probe="props">
           <CtProbeNode :id="props.id" :data="props.data" :node="props.data.node" />
         </template>
+        <template #node-ct-number-label="props">
+          <CNumberLabelNode :id="props.id" :node="props.data.node" />
+        </template>
         <template #edge-ct-smoothstep="props">
           <CtSmoothstepEdge
             :id="props.id"
diff --git a/src/components/clockTree/CNumberLabelNode.vue b/src/components/clockTree/CNumberLabelNode.vue
new file mode 100644
index 00000000..a068bf03
--- /dev/null
+++ b/src/components/clockTree/CNumberLabelNode.vue
@@ -0,0 +1,93 @@
+<!--
+ * ****************************************************************************
+ *  @author      xqyjlj
+ *  @file        CNumberLabelNode.vue
+ *  @brief
+ *
+ * ****************************************************************************
+ *  @attention
+ *  Licensed under the Apache License v. 2 (the "License");
+ *  You may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *
+ *      https://www.apache.org/licenses/LICENSE-2.0.html
+ *
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ *
+ *  Copyright (C) 2025-2025 xqyjlj<xqyjlj@126.com>
+ *
+ * ****************************************************************************
+ *  Change Logs:
+ *  Date           Author       Notes
+ *  ------------   ----------   -----------------------------------------------
+ *  2025-12-10     xqyjlj       initial version
+-->
+
+<script lang="ts" setup>
+import type { ClockTreeNode, IpParameterNumber } from '~/database'
+import { computed, toValue } from 'vue'
+
+interface PropsType {
+  id: string
+  node: ClockTreeNode
+}
+
+const props = defineProps<PropsType>()
+
+const parameter = computed(
+  (): IpParameterNumber | null => {
+    const p = toValue(props.node.parameter)
+    if (p.type === 'float' || p.type === 'integer') {
+      return p as IpParameterNumber
+    }
+    return null
+  },
+)
+const title = computed((): string => parameter.value?.display.value || props.id)
+const value = computed({
+  get: (): number => parameter.value?.value.value ?? 0,
+  set: (value: number) => {
+    if (parameter.value) {
+      parameter.value.value.value = value
+    }
+  },
+})
+</script>
+
+<template>
+  <div class="title">
+    {{ title }}
+  </div>
+  <UnitInput
+    v-model="value"
+    class="nodrag"
+    :unit="node.unit"
+    :readonly="parameter?.readonly ?? true"
+    :max="parameter?.max.value ?? Number.MAX_SAFE_INTEGER"
+    :min="parameter?.min.value ?? Number.MIN_SAFE_INTEGER"
+  />
+</template>
+
+<style>
+.vue-flow__node-ct-number-label {
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  gap: 8px;
+  padding: 8px 16px;
+  border-radius: 8px;
+  box-shadow: 0 0 10px var(--ep-menu-border-color);
+}
+
+.vue-flow__node-ct-number-label.selected {
+  box-shadow: 0 0 0 2px var(--ct-vue-flow-node-selected-color);
+}
+
+.vue-flow__node-ct-number-label .unit-input-container {
+  width: 100%;
+}
+</style>