切割线面板 i18n

Author: Linho1219

src/editor/inputs/linear.vue

@@ -8,10 +8,11 @@
       <s-divider>{{ t("data.more.dividerTitle") }}</s-divider>
       <div class="input-inner-optional">
         <div class="fields">
-          <span class="label"> 切线与割线 </span>
+          <span class="label"> {{ t("data.derivateAndSecants") }} </span>
           <s-popup class="derivate-popup input" align="right">
             <s-button type="outlined" slot="trigger">
-              设置面板 <s-icon name="chevron_right" slot="end"></s-icon>
+              {{ t("data.derivateAndSecantsPane") }}
+              <s-icon name="chevron_right" slot="end"></s-icon>
             </s-button>
             <DerivatePane :self="self" />
           </s-popup>
@@ -47,7 +48,7 @@
               "
               type="warn"
             >
-              “隐藏悬浮提示”启用时，切线与割线跟随鼠标不生效
+              {{ t("data.more.skipTipWarn") }}
             </HelpIcon>
           </s-checkbox>
         </div>

src/editor/inputs/subblocks/derivatePane.vue

@@ -3,15 +3,15 @@
     <s-tab mode="fixed" v-model.lazy="tab">
       <s-tab-item value="derivate">
         <div slot="text" class="tab-text">
-          切线设置
+          {{ t("data.derivate.title") }}
           <Transition name="badge">
             <s-badge class="tab-badge" v-if="derivateEnabled"></s-badge>
           </Transition>
         </div>
       </s-tab-item>
       <s-tab-item value="secant">
         <div slot="text" class="tab-text">
-          割线设置
+          {{ t("data.secant.title") }}
           <Transition name="badge">
             <s-badge class="tab-badge" v-if="secantEnabled"></s-badge>
           </Transition>
@@ -26,31 +26,31 @@
       :class="{ enabled: derivateEnabled }"
     >
       <div class="field no-opacity">
-        <div class="label">启用切线显示</div>
+        <div class="label">{{ t("data.derivate.enable") }}</div>
         <s-switch type="checkbox" v-model.lazy="derivateEnabled"></s-switch>
       </div>
       <div class="field main-fn">
         <span class="label wide styled">y'=</span>
         <FunctionField class="styled fn" label="f'(x)" v-model="derivateFn" />
       </div>
       <div class="field">
-        <div class="label">切点位置</div>
+        <div class="label">{{ t("data.derivate.point") }}</div>
         <s-segmented-button v-model.lazy="derivFollowMouseStr">
           <s-segmented-button-item value="followMouse">
-            跟随鼠标
+            {{ t("data.derivate.followMouse") }}
           </s-segmented-button-item>
           <s-segmented-button-item value="manual">
-            指定切点
+            {{ t("data.derivate.manual") }}
           </s-segmented-button-item>
         </s-segmented-button>
       </div>
       <s-fold :folded="derivFollowMouse" class="derivate-x-coord-fold">
         <div class="field x-coord-field">
-          <div class="label">切点横坐标</div>
+          <div class="label">{{ t("data.derivate.sepcify") }}</div>
           <s-text-field
-            class="x-coord styled"
+            class="x-coord styled-inner"
             type="number"
-            label="x"
+            :label="t('data.derivate.xcoord')"
             v-model="derivateX"
           ></s-text-field>
         </div>
@@ -60,7 +60,7 @@
     <!-- secant -->
     <div class="content" v-else :class="{ enabled: secantEnabled }">
       <div class="field no-opacity">
-        <div class="label">启用割线显示</div>
+        <div class="label">{{ t("data.secant.enable") }}</div>
         <s-switch type="checkbox" v-model.lazy="secantEnabled"></s-switch>
       </div>
       <div class="secants">
@@ -72,7 +72,7 @@
                 v-model="item.followMouse"
                 class="secant-checkbox"
               >
-                跟随鼠标
+                {{ t("data.secant.followMouse") }}
               </s-checkbox>
               <s-text-field
                 class="sec-coord styled-inner"
@@ -111,7 +111,7 @@
           })
         "
       >
-        <s-icon slot="start" name="add" /> 添加
+        <s-icon slot="start" name="add" /> {{ t("data.secant.add") }}
       </s-button>
     </div>
   </div>
@@ -126,6 +126,10 @@ import AnimatedList from "@/ui/animated/animatedList.vue";
 import AnimatedListItem from "@/ui/animated/animatedListItem.vue";
 import SIconDelete from "@/ui/icons/delete.vue";
 
+import { useI18n } from "vue-i18n";
+import { I18nSchema } from "@/i18n";
+const { t } = useI18n<{ message: I18nSchema }>();
+
 const props = defineProps<{
   self: PrivateDataTypes.Linear;
 }>();
@@ -270,9 +274,11 @@ watchEffect(() => {
       width: 2.2em;
     }
   }
-  .x-coord.styled {
+  .x-coord.styled-inner {
+    max-width: 12em;
+  }
+  .x-coord.styled-inner::part(input) {
     font-size: 20px;
-    max-width: 10em;
   }
   .derivate-x-coord-fold {
     margin-top: -0.8em;

src/i18n/en-US.json

@@ -69,7 +69,25 @@
       "nSamples": "Sample Count",
       "closed": "Close and Fill",
       "skipTip": "Hide Hover Tips",
-      "skipTipHelp": "Hide point and coordinate info on mouse hover"
+      "skipTipHelp": "Hide point and coordinate info on mouse hover",
+      "skipTipWarn": "When 'Hide Hover Tips' is enabled, tangent and secant lines will not follow the mouse"
+    },
+    "derivateAndSecants": "Tangents and Secants",
+    "derivateAndSecantsPane": "Open panel",
+    "derivate": {
+      "title": "Tangent Settings",
+      "enable": "Enable Tangent Display",
+      "point": "Position",
+      "followMouse": "Dynamic",
+      "manual": "Specify Point",
+      "sepcify":"Point Abscissa",
+      "xcoord": "Abscissa"
+    },
+    "secant": {
+      "title": "Secant Settings",
+      "enable": "Enable Secant Display",
+      "followMouse": "Dynamic",
+      "add": "Add Secant"
     }
   },
   "annotation": {

src/i18n/zh-CN.json

@@ -69,7 +69,25 @@
       "nSamples": "采样数",
       "closed": "闭合并填充",
       "skipTip": "隐藏悬浮提示",
-      "skipTipHelp": "隐藏鼠标经过时标出的点与坐标信息"
+      "skipTipHelp": "隐藏鼠标经过时标出的点与坐标信息",
+      "skipTipWarn": "“隐藏悬浮提示”启用时，切线与割线跟随鼠标不生效"
+    },
+    "derivateAndSecants": "切线与割线",
+    "derivateAndSecantsPane": "设置面板",
+    "derivate": {
+      "title": "切线设置",
+      "enable": "启用切线显示",
+      "point": "切点位置",
+      "followMouse": "跟随鼠标",
+      "manual": "指定切点",
+      "sepcify":"切点横坐标",
+      "xcoord": "横坐标"
+    },
+    "secant": {
+      "title": "割线设置",
+      "enable": "启用割线显示",
+      "followMouse": "跟随鼠标",
+      "add": "添加割线"
     }
   },
   "annotation": {