From bd7e67ed3d5627428da84bc11d296b7c76411718 Mon Sep 17 00:00:00 2001
From: hanyuxinting <hanyuxinting@sina.cn>
Date: Wed, 26 Mar 2025 22:10:44 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BF=AE=E8=AE=A2=E5=8F=98=E9=87=8F?=
 =?UTF-8?q?=E5=90=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                    |   1 +
 src/styles/theme-jmapp.scss     |   1 +
 src/styles/variables-jmapp.scss | 249 +++++++++++++++++++++++++++-----
 src/styles/variables.scss       |   1 +
 4 files changed, 216 insertions(+), 36 deletions(-)

diff --git a/package.json b/package.json
index 3d119d96c4..9ec145060d 100644
--- a/package.json
+++ b/package.json
@@ -54,6 +54,7 @@
     "changelog": "node ./scripts/generate-changelog.js",
     "clone:jdharmony": "node ./scripts/harmony/clone-jdharmony.js",
     "dev": "vite --open --force",
+    "dev:jmapp": "VITE_APP_PROJECT_ID=jmapp vite --open --force",
     "dev:rtl": "VITE_RTL=rtl vite --open --force",
     "dev:jrkf": "VITE_APP_PROJECT_ID=jrkf vite --open --force",
     "dev:taro:rn:dark": "THEME=dark pnpm dev:taro:rn",
diff --git a/src/styles/theme-jmapp.scss b/src/styles/theme-jmapp.scss
index d34074b9be..cad6dc755b 100644
--- a/src/styles/theme-jmapp.scss
+++ b/src/styles/theme-jmapp.scss
@@ -221,6 +221,7 @@ page {
   --nutui-font-weight-bold: 600;
   --nutui-line-height: 140%;
 
+  --nutui-spacing-xxxs: var(--nutui-spacing-1);
   --nutui-spacing-xxs: var(--nutui-spacing-1);
   --nutui-spacing-xs: var(--nutui-spacing-2);
   --nutui-spacing-s: var(--nutui-spacing-3);
diff --git a/src/styles/variables-jmapp.scss b/src/styles/variables-jmapp.scss
index b0ad84e87c..1894c3c17d 100644
--- a/src/styles/variables-jmapp.scss
+++ b/src/styles/variables-jmapp.scss
@@ -11,6 +11,15 @@ $color-primary-gradient-1: linear-gradient(
   $color-primary-stop-1 0%,
   $color-primary-stop-2 100%
 ) !default;
+$color-primary-icon: var(--nutui-color-primary-icon, #ff3333) !default;
+$color-primary-icon-disabled: var(
+  --nutui-color-primary-icon-disabled,
+  #dadce0
+) !default;
+$color-primary-specialdisabled: var(
+  --nutui-color-primary-specialdisabled,
+  #ffadbe
+) !default;
 
 // 默认
 $color-default: var(--nutui-color-default) !default;
@@ -99,24 +108,6 @@ $font-weight-bold: var(--nutui-font-weight-bold);
 // 行高
 $line-height-base: var(--nutui-line-height) !default;
 
-// 间距 space
-$spacing-xxs: var(--nutui-spacing-xxs) !default; // 多用于文本与图标之间的间距
-$spacing-xs: var(--nutui-spacing-xs) !default; // 多用于文本与图标之间的间距
-$spacing-s: var(--nutui-spacing-s) !default; // 二级卡片与屏幕两侧的间距
-$spacing-base: var(
-  --nutui-spacing-base
-) !default; // 楼层间距（二级卡片之间的上下间距）
-$spacing-l: var(
-  --nutui-spacing-l
-) !default; // 卡片布局容器中，同类信息组之间的上下间距（比如两行金刚位之间的间距）
-$spacing-xl: var(
-  --nutui-spacing-xl
-) !default; // 卡片布局容器中，信息组之间的上下间距
-$spacing-xxl: var(--nutui-spacing-xxl) !default; // 卡片布局容器的内容左右间距，
-$spacing-xxxl: var(--nutui-spacing-xxxl) !default; // 卡片布局容器的内容上下间距
-$spacing-4xl: var(--nutui-spacing-4xl) !default; // 卡片布局容器的内容上下间距
-$spacing-5xl: var(--nutui-spacing-5xl) !default; // 卡片布局容器的内容上下间距
-
 // 圆角 corners
 $radius-xxs: var(
   --nutui-radius-xxs
@@ -164,6 +155,10 @@ $color-mask-part: var(--nutui-black-2, rgba(0, 0, 0, 0.02)) !default;
 
 $spacing-icon-text: var(--nutui-spacing-2, 4px) !default;
 
+// 边框色
+$color-border: var(--nutui-color-border, rgba(0, 0, 0, 0.06)) !default;
+$color-border-disabled: var(--nutui-color-border-disabled, #c2c4cc) !default;
+
 // ---- Font Family ----
 $font-family:
   PingFang SC,
@@ -184,6 +179,25 @@ $font-size-xl: $font-h2 !default;
 $font-size-xxl: var(--nutui-font-size-8) !default;
 $font-size-xxxl: var(--nutui-font-size-10) !default;
 
+// 间距 space
+$spacing-xxxs: var(--nutui-spacing-xxxs) !default; // 多用于文本与图标之间的间距
+$spacing-xxs: var(--nutui-spacing-xxs) !default; // 多用于文本与图标之间的间距
+$spacing-xs: var(--nutui-spacing-xs) !default; // 多用于文本与图标之间的间距
+$spacing-s: var(--nutui-spacing-s) !default; // 二级卡片与屏幕两侧的间距
+$spacing-base: var(
+  --nutui-spacing-base
+) !default; // 楼层间距（二级卡片之间的上下间距）
+$spacing-l: var(
+  --nutui-spacing-l
+) !default; // 卡片布局容器中，同类信息组之间的上下间距（比如两行金刚位之间的间距）
+$spacing-xl: var(
+  --nutui-spacing-xl
+) !default; // 卡片布局容器中，信息组之间的上下间距
+$spacing-xxl: var(--nutui-spacing-xxl) !default; // 卡片布局容器的内容左右间距，
+$spacing-xxxl: var(--nutui-spacing-xxxl) !default; // 卡片布局容器的内容上下间距
+$spacing-4xl: var(--nutui-spacing-4xl) !default; // 卡片布局容器的内容上下间距
+$spacing-5xl: var(--nutui-spacing-5xl) !default; // 卡片布局容器的内容上下间距
+
 $space-mini: $spacing-xs !default;
 $space-large: $spacing-l !default;
 $space-xl: $spacing-xl !default;
@@ -253,6 +267,14 @@ $button-xlarge-font-size: var(
   --nutui-button-xlarge-font-size,
   $font-size-xl
 ) !default;
+$button-xlarge-text-icon-margin: var(
+  --nutui-button-xlarge-text-icon-margin,
+  6px
+) !default;
+$button-xlarge-border-radius: var(
+  --nutui-button-xlarge-border-radius,
+  $radius-base
+) !default;
 
 $button-large-width: var(--nutui-button-large-width, auto) !default;
 $button-large-height: var(--nutui-button-large-height, 44px) !default;
@@ -836,25 +858,52 @@ $countdown-number-primary-background-color: var(
   $color-primary
 ) !default;
 
+//price（✅）
+$price-primary-color: var(--nutui-price-color, $color-primary) !default;
+$price-color: var(--nutui-price-color, var(--nutui-color-text-help)) !default;
+$price-darkgray-color: var(
+  --nutui-price-darkgray-color,
+  var(--nutui-gray-7)
+) !default;
+$price-line-color: var(
+  --nutui-price-line-color,
+  var(--nutui-color-text-help)
+) !default;
+$price-symbol-padding-right: var(
+  --nutui-price-symbol-padding-right,
+  0px
+) !default;
+
+//xlarge price（✅）
+$price-symbol-xlarge-size: var(--nutui-price-symbol-xlarge-size, 12px) !default;
+$price-integer-xlarge-size: var(
+  --nutui-price-integer-xlarge-size,
+  24px
+) !default;
+$price-decimal-xlarge-size: var(
+  --nutui-price-decimal-xlarge-size,
+  12px
+) !default;
+
 //large price（✅）
 $price-symbol-padding-right: var(
   --nutui-price-symbol-padding-right,
   1px
 ) !default;
-$price-symbol-big-size: var(--nutui-price-symbol-big-size, 18px) !default;
-$price-integer-big-size: var(--nutui-price-integer-big-size, 24px) !default;
-$price-decimal-big-size: var(--nutui-price-decimal-big-size, 18px) !default;
+$price-symbol-large-size: var(--nutui-price-symbol-large-size, 18px) !default;
+$price-integer-large-size: var(--nutui-price-integer-large-size, 24px) !default;
+$price-decimal-large-size: var(--nutui-price-decimal-large-size, 18px) !default;
 
 //normal price（✅）
 $price-line-color: var(--nutui-price-line-color, $color-border) !default;
 $price-line-font-size: var(--nutui-price-line-font-size, 12px) !default;
-$price-symbol-medium-size: var(--nutui-price-symbol-medium-size, 14px) !default;
-$price-integer-medium-size: var(
-  --nutui-price-integer-medium-size,
+$price-symbol-normal-size: var(--nutui-price-symbol-normal-size, 14px) !default;
+$price-integer-normal-size: var(
+  --nutui-price-integer-normal-size,
   16px
 ) !default;
-$price-decimal-medium-size: var(
-  --nutui-price-decimal-medium-size,
+$price-decimal-normal-size: var(
+  --nutui-price-decimal-normal-size,
   14px
 ) !default;
 
@@ -873,24 +922,24 @@ $avatar-normal-width: var(--nutui-avatar-normal-width, 40px) !default;
 $avatar-normal-height: var(--nutui-avatar-normal-height, 40px) !default;
 
 //switch（✅）
-$switch-close-background-color: var(
-  --nutui-switch-close-background-color,
+$switch-inactive-background-color: var(
+  --nutui-switch-inactive-background-color,
   $color-default
 ) !default;
-$switch-open-background-color: var(
-  --nutui-switch-open-background-color,
+$switch-active-background-color: var(
+  --nutui-switch-active-background-color,
   $color-primary
 ) !default;
-$switch-close-disabled-background-color: var(
-  --nutui-switch-close-disabled-background-color,
+$switch-inactive-disabled-background-color: var(
+  --nutui-switch-inactive-disabled-background-color,
   $color-default-disabled
 ) !default;
-$switch-open-disabled-background-color: var(
-  --nutui-switch-open-disabled-background-color,
+$switch-active-disabled-background-color: var(
+  --nutui-switch-active-disabled-background-color,
   $color-primary-disabled-special
 ) !default;
-$switch-close-line-background-color: var(
-  --nutui-switch-close-line-bg-color,
+$switch-inactive-line-background-color: var(
+  --nutui-switch-inactive-line-bg-color,
   #fff
 ) !default;
 $switch-width: var(--nutui-switch-width, 40px) !default;
@@ -899,10 +948,37 @@ $switch-line-height: var(--nutui-switch-line-height, 24px) !default;
 $switch-border-radius: var(--nutui-switch-border-radius, 24px) !default;
 $switch-inside-width: var(--nutui-switch-inside-width, 20px) !default;
 $switch-inside-height: var(--nutui-switch-inside-height, 20px) !default;
+$switch-border-width: var(--nutui-switch-border-width, 2px) !default;
 $switch-inside-border-radius: var(
   --nutui-switch-inside-border-radius,
   $radius-s
 ) !default;
+/* #ifdef harmony */
+$switch-inside-box-shadow: var(
+  --nutui-switch-inside-box-shadow,
+  0px 2px 6px 0px rgba(0, 0, 0, 0.1)
+) !default;
+/* #endif */
+/* #ifndef harmony */
+$switch-inside-box-shadow: var(
+  --nutui-switch-inside-box-shadow,
+  0px 2px 1px 0px rgba(0, 0, 0, 0.06),
+  0px 2px 6px 0px rgba(0, 0, 0, 0.1),
+  0px 0px 0px 1px rgba(0, 0, 0, 0.02)
+) !default;
+/* #endif */
+$switch-label-text-color: var(
+  --nutui-switch-label-text-color,
+  $color-primary-text
+) !default;
+$switch-label-font-size: var(
+  --nutui-switch-label-font-size,
+  $font-size-s
+) !default;
+$switch-inactive-disabled-label-text-color: var(
+  --nutui-switch-inactive-disabled-label-text-color,
+  $color-text-disabled
+) !default;
 $switch-inside-open-transform: var(
   --nutui-switch-inside-open-transform,
   translateX(90%)
@@ -1033,6 +1109,7 @@ $hoverbutton-position-right: var(
   --nutui-hoverbutton-position-right,
   var(--nutui-spacing-16, 16px)
 ) !default;
+$hoverbutton-item-size: var(--nutui-hoverbutton-item-size, 40px) !default;
 $hoverbutton-item-border-color: var(
   --nutui-hoverbutton-item-border-color,
   var(--nutui-black-3, rgba(0, 0, 0, 0.06))
@@ -1082,6 +1159,14 @@ $popup-title-font-weight: var(
   --nutui-popup-title-font-weight,
   $font-weight-bold
 ) !default;
+$popup-description-font-size: var(
+  --nutui-popup-description-font-size,
+  $font-size-base
+) !default;
+$popup-description-spacing: var(
+  --nutui-popup-description-spacing,
+  $spacing-base
+) !default;
 $popup-title-height: var(--nutui-popup-title-height, auto) !default;
 $popup-title-border-bottom: var(--nutui-popup-title-border-bottom, 0) !default;
 $popup-animation-duration: var(--nutui-popup-animation-duration, 0.3s) !default;
@@ -1125,6 +1210,9 @@ $rate-icon-inactive-color: var(
   --nutui-rate-icon-inactive-color,
   $color-text-disabled
 ) !default;
+$rate-icon-size: var(--nutui-rate-icon-size, 12px) !default;
+$rate-font-color: var(--nutui-rate-font-color, $color-primary-icon) !default;
+$rate-font-size: var(--nutui-rate-font-size, 12px) !default;
 
 // tabbar（✅）
 $tabbar-height: var(--nutui-tabbar-height, 50px) !default;
@@ -1333,6 +1421,7 @@ $steps-dot-icon-border: var(
 $steps-dot-head-margin: var(--nutui-steps-dot-head-margin, 10px 0) !default;
 
 // dialog（✅）
+$dialog-min-width: var(--nutui-dialog-min-width, 240px) !default;
 $dialog-width: var(--nutui-dialog-width, 295px) !default;
 $dialog-padding: var(
   --nutui-dialog-padding,
@@ -1387,11 +1476,23 @@ $dialog-vertical-footer-ok-margin-top: var(
 $dialog-close-color: var(--nutui-dialog-close-color, #ffffff) !default;
 $dialog-close-width: var(--nutui-dialog-close-width, 18px) !default;
 $dialog-close-height: var(--nutui-dialog-close-height, 18px) !default;
+$dialog-bottom-close-icon-size: var(
+  --nutui-dialog-bottom-close-icon-size,
+  24px
+) !default;
 $dialog-close-top: var(--nutui-dialog-close-top, 16px) !default;
 $dialog-close-left: var(--nutui-dialog-close-left, 16px) !default;
 $dialog-close-right: var(--nutui-dialog-close-right, 16px) !default;
 
 // checkbox（✅）
+$checkbox-label-disable-color: var(
+  --nutui-checkbox-label-disable-color,
+  #999
+) !default;
+$checkbox-icon-disable-color: var(
+  --nutui-checkbox-icon-disable-color,
+  #d6d6d6
+) !default;
 $checkbox-label-margin-left: var(
   --nutui-checkbox-label-margin-left,
   $spacing-icon-text
@@ -1624,7 +1725,14 @@ $badge-content-transform: var(
 ) !default;
 $badge-z-index: var(--nutui-badge-z-index, 1) !default;
 $badge-dot-width: var(--nutui-badge-dot-width, 8px) !default;
+$badge-dot-small-width: var(--nutui-badge-dot-small-width, 4px) !default;
+$badge-dot-large-width: var(--nutui-badge-dot-large-width, 8px) !default;
 $badge-dot-border: var(--nutui-badge-dot-border, none);
+$badge-outline-color: var(--nutui-badge-outline-color, $color-primary) !default;
+$badge-outline-border: var(
+  --nutui-badge-outline-border,
+  1px solid $color-primary
+);
 
 //popover（✅）
 $popover-border-radius: var(--nutui-popover-border-radius, $radius-s) !default;
@@ -1652,6 +1760,7 @@ $popover-menu-item-padding: var(
   --nutui-popover-menu-item-padding,
   $spacing-xl
 ) !default;
+$popover-menu-item-width: var(--nutui-popover-menu-item-width, 160px) !default;
 
 //progress（✅）
 $progress-height: var(--nutui-progress-height, 10px) !default;
@@ -1973,6 +2082,37 @@ $searchbar-input-text-align: var(
   left
 ) !default;
 
+// segmented
+$segmented-height: var(--nutui-segmented-height, 24px) !default;
+$segmented-padding: var(--nutui-segmented-padding, $spacing-xxxs) !default;
+$segmented-border-radius: var(--nutui-segmented-radius, $radius-xs) !default;
+$segmented-background: var(
+  --nutui-segmented-background,
+  $color-mask-part
+) !default;
+$segmented-item-height: var(--nutui-segmented-height, 20px) !default;
+$segmented-item-padding: var(
+  --nutui-segmented-item-padding,
+  0 $spacing-xs
+) !default;
+$segmented-item-radius: var(--nutui-segmented-item-radius, $radius-xs) !default;
+$segmented-item-fontsize: var(
+  --nutui-segmented-item-fontsize,
+  $font-size-s
+) !default;
+$segmented-item-color: var(
+  --nutui-segmented-item-color,
+  $color-primary-text
+) !default;
+$segmented-active-background: var(
+  --nutui-segmented-active-background,
+  $color-mask-part
+) !default;
+$segmented-icon-margin-right: var(
+  --nutui-segmented-icon-margin-right,
+  $spacing-xxxs
+) !default;
+
 // empty（✅）
 
 $empty-padding: var(--nutui-empty-padding, 32px 40px) !default;
@@ -2104,7 +2244,12 @@ $color-background-overlay: var(
 ) !default;
 
 // grid（✅）
+$grid-border-width: var(--nutui-grid-border-width, 0px) !default;
 $grid-border-color: var(--nutui-grid-border-color, $color-border) !default;
+$grid-item-border-radius: var(
+  --nutui-grid-item-border-radius,
+  $radius-l
+) !default;
 $grid-item-content-padding: var(
   --nutui-grid-item-content-padding,
   16px 8px
@@ -2155,6 +2300,34 @@ $navbar-title-font-color: var(
   $color-title
 ) !default;
 
+// sidebar（✅）
+$sidebar-background-color: var(
+  --nutui-sidebar-background-color,
+  $color-background
+) !default;
+$sidebar-border-radius: var(--nutui-sidebar-border-radius, 0) !default;
+$sidebar-width: var(--nutui-sidebar-width, 104px) !default;
+$sidebar-max-width: var(--nutui-sidebar-max-width, 128px) !default;
+$sidebar-title-height: var(--nutui-sidebar-title-height, 52px) !default;
+$sidebar-inactive-font-size: var(
+  --nutui-sidebar-inactive-font-size,
+  $font-size-base
+) !default;
+$sidebar-active-font-size: var(
+  --nutui-sidebar-active-font-size,
+  $font-size-l
+) !default;
+$sidebar-active-font-weight: var(
+  --nutui-sidebar-active-font-weight,
+  $font-weight-bold
+) !default;
+$sidebar-active-color: var(
+  --nutui-sidebar-active-color,
+  $color-primary
+) !default;
+$sidebar-item-background: var(--nutui-sidebar-item-background, $white) !default;
+$sidebar-item-padding: var(--nutui-sidebar-item-padding, 24px 20px) !default;
+
 // elevator（✅）
 $elevator-list-bg-color: var(--nutui-elevator-list-bg-color, $white) !default;
 $elevator-list-font-size: var(
@@ -2389,6 +2562,10 @@ $loading-icon-color: var(--nutui-loading-icon-color, $color-text-help) !default;
 $loading-icon-size: var(--nutui-loading-icon-size, $font-size-s) !default;
 $loading-color: var(--nutui-loading-color, $color-text-help) !default;
 $loading-font-size: var(--nutui-loading-font-size, $font-size-s) !default;
+$loading-lottie-background: var(
+  --nutui-loading-lottie-background,
+  rgba(0, 0, 0, 0.06)
+) !default;
 
 // ResultPage
 $resultpage-width: var(--nutui-resultpage-width, 247px) !default;
diff --git a/src/styles/variables.scss b/src/styles/variables.scss
index 9a609de4fa..f48c088a75 100644
--- a/src/styles/variables.scss
+++ b/src/styles/variables.scss
@@ -2207,6 +2207,7 @@ $navbar-title-font-color: var(
   --nutui-navbar-title-font-color,
   $color-title
 ) !default;
+
 // sidebar（✅）
 $sidebar-background-color: var(
   --nutui-sidebar-background-color,