ow

uniapp/youjiala/src/components/family-tree-chart/family-tree-chart.vue

@@ -457,7 +457,12 @@ function close(): void {
                 <text class="ftc__title">
                     {{ props.title || t('FamilyTreePage.pedigreeChart') }}
                 </text>
-                <u-icon name="close" size="40" color="#8f959e" @click="close" />
+                <!-- 退出钮统一为「取消」文字胶囊（底部抽屉风格语言，不再用 X） -->
+                <view class="ftc__cancel" @tap="close">
+                    <text class="ftc__cancel-text">
+                        {{ t("FamilyTreePage.cancel") }}
+                    </text>
+                </view>
             </view>
             <!-- 悬浮控制条：放大/缩小/百分比复位/横纵布局切换（对齐旧图 G6 工具钮） -->
             <view class="ftc__ctrl">
@@ -513,6 +518,17 @@ function close(): void {
     color: #1f2329;
 }
 
+.ftc__cancel {
+    padding: 12rpx 40rpx;
+    border-radius: 999rpx;
+    background-color: #f2f3f5;
+}
+
+.ftc__cancel-text {
+    font-size: 26rpx;
+    color: #5c626b;
+}
+
 /* 悬浮控制条：右侧竖排，白底圆角轻阴影 */
 .ftc__ctrl {
     position: absolute;