From 0f636980f962dc6755dbe7876aade4f8a78963f8 Mon Sep 17 00:00:00 2001
From: lijianxiong <1518062161@qq.com>
Date: Thu, 23 Oct 2025 09:56:27 +0800
Subject: [PATCH 1/4] =?UTF-8?q?feat=EF=BC=9A=E8=B0=83=E6=95=B4=E5=A4=9A?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E9=83=A8=E4=BB=B6=E7=9A=84=E7=B1=BB=E5=90=8D?=
 =?UTF-8?q?=E4=B8=8E=E5=8F=98=E9=87=8F=E5=91=BD=E5=90=8D=EF=BC=8C=E4=BD=BF?=
 =?UTF-8?q?=E5=85=B6=E5=85=B7=E5=A4=87=E6=98=8E=E7=A1=AE=E7=9A=84=E8=AF=AD?=
 =?UTF-8?q?=E4=B9=89=E6=8C=87=E5=90=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/control/list/md-ctrl/md-ctrl.scss |  8 ++++----
 src/control/list/md-ctrl/md-ctrl.tsx  | 26 ++++++++++++--------------
 2 files changed, 16 insertions(+), 18 deletions(-)

diff --git a/src/control/list/md-ctrl/md-ctrl.scss b/src/control/list/md-ctrl/md-ctrl.scss
index c10dbee019..1255490fdc 100644
--- a/src/control/list/md-ctrl/md-ctrl.scss
+++ b/src/control/list/md-ctrl/md-ctrl.scss
@@ -41,7 +41,7 @@ $panel:(
       padding: getCssVar(control-mobmdctrl, padding);
       line-height: normal;
     }
-    @include when(show-underLine) {
+    @include when(show-under-line) {
       .#{bem(control-mobmdctrl-item)} {
         position: relative;
         &::after {
@@ -67,7 +67,7 @@ $panel:(
     }
   }
 
-  @include when(enable-group) {
+  @include when(enable-anchor) {
     .#{bem(control-mobmdctrl, content)} {
       overflow-y: auto;
     }
@@ -138,7 +138,7 @@ $panel:(
     background-color: getCssVar(color, bg, 0);
   }
 
-  @include e('nav-container') {
+  @include e('anchor-container') {
     position: absolute;
     right: getCssVar('spacing', 'tight');
     top: 45%;
@@ -154,7 +154,7 @@ $panel:(
       0 rem(4px) rem(14px) rgba(0 0 0 / 10%);
   }
 
-  @include e('nav-item') {
+  @include e('anchor-item') {
     width: 100%;
     text-align: center;
     padding: getCssVar('spacing', 'extra-tight');
diff --git a/src/control/list/md-ctrl/md-ctrl.tsx b/src/control/list/md-ctrl/md-ctrl.tsx
index 7842f92723..bc71d72fa7 100644
--- a/src/control/list/md-ctrl/md-ctrl.tsx
+++ b/src/control/list/md-ctrl/md-ctrl.tsx
@@ -154,8 +154,8 @@ export const MDCtrlControl = defineComponent({
     const scrollKey = createUUID();
     const selectScrollKey = ref();
 
-    // 处理分组锚点导航项点击
-    const handleGroupNavClick = (_id: string) => {
+    // 处理分组锚点项点击
+    const handleGroupAnchorClick = (_id: string) => {
       // 获取目标元素和滚动容器
       const targetElement = document.getElementById(_id);
       const listDom = listRef.value?.$el;
@@ -261,7 +261,7 @@ export const MDCtrlControl = defineComponent({
     };
 
     const renderGroup = () => {
-      const isGroupNav = c.state.groups.length > 1;
+      const showGroupAnchor = c.state.groups.length > 1 && c.showGroupAnchor;
       return [
         <div class={ns.b('group')}>
           <div class={ns.be('group', 'container')}>
@@ -277,15 +277,15 @@ export const MDCtrlControl = defineComponent({
               );
             })}
           </div>
-          {isGroupNav && c.showGroupAnchor ? (
-            <div class={ns.be('group', 'nav-container')}>
+          {showGroupAnchor ? (
+            <div class={ns.be('group', 'anchor-container')}>
               {c.state.groups.map((group, index) => {
                 const _id = `group-${scrollKey}-${index}`;
                 return (
                   <div
-                    onClick={() => handleGroupNavClick(_id)}
+                    onClick={() => handleGroupAnchorClick(_id)}
                     class={[
-                      ns.be('group', 'nav-item'),
+                      ns.be('group', 'anchor-item'),
                       ns.is('active', selectScrollKey.value === _id),
                     ]}
                   >
@@ -299,14 +299,14 @@ export const MDCtrlControl = defineComponent({
       ];
     };
 
-    // 绘制卡片内容
+    // 绘制列表内容
     const renderMDContent = () => {
       return (
         <van-list
           ref='listRef'
           class={[
             ns.e('content'),
-            ns.is('show-underLine', c.model.controlStyle !== 'EXTVIEW1'),
+            ns.is('show-under-line', c.model.controlStyle !== 'EXTVIEW1'),
           ]}
           loading={c.state.isLoading}
           finished={
@@ -341,11 +341,9 @@ export const MDCtrlControl = defineComponent({
       <iBizControlBase
         controller={this.c}
         class={[
-          this.ns.is(
-            'enable-page',
-            enablePagingBar || this.showCollapseOrExpandIcon,
-          ),
-          this.ns.is('enable-group', this.c.enableGroup),
+          this.ns.is('enable-page', enablePagingBar),
+          this.ns.is('load-more', this.showCollapseOrExpandIcon),
+          this.ns.is('enable-anchor', this.c.showGroupAnchor),
         ]}
       >
         {this.c.state.isCreated &&
-- 
Gitee


From dabe0c4ade2c8e239829e254dd9e44797a61192c Mon Sep 17 00:00:00 2001
From: lijianxiong <1518062161@qq.com>
Date: Thu, 23 Oct 2025 09:58:46 +0800
Subject: [PATCH 2/4] =?UTF-8?q?feat=EF=BC=9A=E8=B0=83=E6=95=B4=E5=A4=9A?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E9=83=A8=E4=BB=B6=E5=9C=A8=E9=80=89=E6=8B=A9?=
 =?UTF-8?q?=E6=A8=A1=E5=BC=8F=E4=B8=8B=EF=BC=8C=E7=BB=9F=E4=B8=80=E5=B0=86?=
 =?UTF-8?q?=E5=A4=8D=E9=80=89=E6=A1=86=E7=BB=98=E5=88=B6=E5=9C=A8=E5=8F=B3?=
 =?UTF-8?q?=E4=BE=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/control/list/list-render-util.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/control/list/list-render-util.tsx b/src/control/list/list-render-util.tsx
index 34e1e05820..146101e2b4 100644
--- a/src/control/list/list-render-util.tsx
+++ b/src/control/list/list-render-util.tsx
@@ -57,7 +57,7 @@ export function useListRender(
 
   const renderRightSlot = (row: IData) => {
     const select = isSelect(row);
-    return <van-checkbox class={ns.bm('item', 'right')} checked={select} />;
+    return <van-checkbox class={ns.be('item', 'right')} checked={select} />;
   };
 
   const renderIcon = (row: IData) => {
@@ -109,11 +109,12 @@ export function useListRender(
     if (props.mode === 'SELECT') {
       return (
         <div class={ns.b('select-item')}>
+          {content}
           <van-checkbox
+            class={ns.be('select-item', 'right')}
             checked={isSelect(item)}
             onClick={(event: MouseEvent) => c.onRowClick(item, event)}
           ></van-checkbox>
-          {content}
         </div>
       );
     }
-- 
Gitee


From 3041f4f36a440745ed4a78a8b260786c53941a4b Mon Sep 17 00:00:00 2001
From: lijianxiong <1518062161@qq.com>
Date: Thu, 23 Oct 2025 10:05:43 +0800
Subject: [PATCH 3/4] =?UTF-8?q?feat=EF=BC=9A=E8=B0=83=E6=95=B4=E5=A4=9A?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E9=83=A8=E4=BB=B6=E5=8F=8A=E6=8E=92=E5=BA=8F?=
 =?UTF-8?q?=E8=AE=BE=E7=BD=AE=E5=8F=8A=E8=AE=BE=E7=BD=AE=E5=AE=B9=E5=99=A8?=
 =?UTF-8?q?=E7=AD=89=E7=BB=84=E4=BB=B6=E6=A0=B7=E5=BC=8F=EF=BC=8C=E4=B8=8D?=
 =?UTF-8?q?=E7=9B=B4=E6=8E=A5=E7=94=A8=E5=9F=BA=E7=A1=80=20CSS=20=E5=8F=98?=
 =?UTF-8?q?=E9=87=8F=EF=BC=8C=E5=90=84=E7=BB=84=E4=BB=B6=E5=AE=9A=E4=B9=89?=
 =?UTF-8?q?=E4=B8=93=E5=B1=9E=E5=8F=98=E9=87=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../md-sort-setting/md-sort-setting.scss      |  68 +++---
 src/control/list/md-ctrl/md-ctrl.scss         | 212 ++++++++++--------
 .../setting-container/setting-container.scss  |  12 +-
 3 files changed, 165 insertions(+), 127 deletions(-)

diff --git a/src/common/md-sort-setting/md-sort-setting.scss b/src/common/md-sort-setting/md-sort-setting.scss
index 1bf4a5e373..d95e1b235e 100644
--- a/src/common/md-sort-setting/md-sort-setting.scss
+++ b/src/common/md-sort-setting/md-sort-setting.scss
@@ -1,16 +1,29 @@
 $md-sort-setting: (
+  'font-size': getCssVar('font-size', 'regular'),
   'active-bg-color': getCssVar('color', 'primary', 'light', 'default'),
   'active-color': getCssVar('color', 'primary'),
-  'popup-height': '80%',
+  'border-color': getCssVar('color', 'border'),
+  'header-font-size': getCssVar('font-size', 'header', 6),
+  'header-min-height': getCssVar('height-control', 'default'),
+  'header-padding': getCssVar('spacing', 'base'),
+  'tabs-padding': 0 getCssVar('spacing', 'base'),
+  'tabs-margin': 0 0 getCssVar('spacing', 'tight') 0,
+  'tab-min-height': getCssVar('height', 'control', 'large'),
+  'tab-font-weight': getCssVar('font-weight', 'regular'),
+  'tab-asc-border-radius': getCssVar('border-radius', 'small') 0 0
+    getCssVar('border-radius', 'small'),
+  'tab-desc-border-radius': 0 getCssVar('border-radius', 'small')
+    getCssVar('border-radius', 'small') 0,
+  'bottom-btn-padding': 0 getCssVar('spacing', 'tight')
+    getCssVar('spacing', 'loose') getCssVar('spacing', 'tight'),
+  'close-icon-font-size': getCssVar('font-size', 'header', 3),
+  'close-icon-color': getCssVar(color, text, 3),
+  'list-item-height': getCssVar('height-control', 'default'),
+  'list-item-margin': getCssVar('spacing', 'tight') 0,
+  'list-item-check-padding': 0 getCssVar('spacing', 'extra-tight') 0 0,
 );
 
 @include b('md-sort-setting') {
-  @include e('popup') {
-    @include set-component-css-var('md-sort-setting', $md-sort-setting);
-
-    height: getCssVar('md-sort-setting', 'popup-height');
-  }
-
   @include e('content') {
     @include set-component-css-var('md-sort-setting', $md-sort-setting);
 
@@ -22,14 +35,16 @@ $md-sort-setting: (
       display: flex;
       align-items: center;
       justify-content: space-between;
-      min-height: getCssVar('height-control', 'default');
-      padding: getCssVar('spacing', 'base');
+      min-height: getCssVar('md-sort-setting', 'header-min-height');
+      padding: getCssVar('md-sort-setting', 'header-padding');
+      font-size: getCssVar('md-sort-setting', 'header-font-size');
     }
 
+    // 头部标签页样式
     @include m('tabs') {
       flex: 1;
-      padding: 0 getCssVar('spacing', 'base');
-      margin-bottom: getCssVar('spacing', 'tight');
+      padding: getCssVar('md-sort-setting', 'tabs-padding');
+      margin: getCssVar('md-sort-setting', 'tabs-margin');
       overflow: hidden;
 
       .van-tabs__line {
@@ -37,13 +52,13 @@ $md-sort-setting: (
       }
 
       .van-tab--line {
-        min-height: getCssVar('height', 'control', 'large');
-        border: 1px solid getCssVar('color', 'border');
+        min-height: getCssVar('md-sort-setting', 'tab-min-height');
+        border: 1px solid getCssVar('md-sort-setting', 'border-color');
+        font-size: getCssVar('md-sort-setting', 'font-size');
 
         &:nth-child(1) {
           border-right: none;
-          border-radius: getCssVar('border-radius', 'small') 0 0
-            getCssVar('border-radius', 'small');
+          border-radius: getCssVar('md-sort-setting', 'tab-asc-border-radius');
 
           &.van-tab--active {
             border: 1px solid getCssVar('md-sort-setting', 'active-color');
@@ -55,12 +70,11 @@ $md-sort-setting: (
         }
 
         &:nth-child(2) {
-          border-radius: 0 getCssVar('border-radius', 'small')
-            getCssVar('border-radius', 'small') 0;
+          border-radius: getCssVar('md-sort-setting', 'tab-desc-border-radius');
         }
 
         &.van-tab--active {
-          font-weight: getCssVar('font-weight', 'regular');
+          font-weight: getCssVar('md-sort-setting', 'tab-font-weight');
           color: getCssVar('md-sort-setting', 'active-color');
           background-color: getCssVar('md-sort-setting', 'active-bg-color');
           border-color: getCssVar('md-sort-setting', 'active-color');
@@ -78,26 +92,28 @@ $md-sort-setting: (
       }
     }
 
+    // 底部确认按钮样式
     @include m('bottom') {
-      padding: 0 getCssVar('spacing', 'tight') getCssVar('spacing', 'loose')
-        getCssVar('spacing', 'tight');
+      padding: getCssVar('md-sort-setting', 'bottom-btn-padding');
     }
 
+    // 关闭图标样式
     @include m('icon') {
-      font-size: getCssVar('font-size', 'header', 3);
-      color: getCssVar(color, text, 3);
+      font-size: getCssVar('md-sort-setting', 'close-icon-font-size');
+      color: getCssVar('md-sort-setting', 'close-icon-color');
       cursor: pointer;
     }
   }
 
+  // 列表项样式
   @include e('list-item') {
     display: flex;
     align-items: center;
     justify-content: space-between;
-    height: getCssVar('height-control', 'default');
-    margin: getCssVar('spacing', 'tight') 0;
+    height: getCssVar('md-sort-setting', 'list-item-height');
+    margin: getCssVar('md-sort-setting', 'list-item-margin');
     overflow: hidden;
-    font-size: getCssVar('font-size', 'header-6');
+    font-size: getCssVar('md-sort-setting', 'font-size');
 
     @include m('icon') {
       display: inline-flex;
@@ -111,7 +127,7 @@ $md-sort-setting: (
     }
 
     @include when('check') {
-      padding-right: getCssVar('spacing', 'extra-tight');
+      padding: getCssVar('md-sort-setting', 'list-item-check-padding');
       color: getCssVar('md-sort-setting', 'active-color');
 
       svg {
diff --git a/src/control/list/md-ctrl/md-ctrl.scss b/src/control/list/md-ctrl/md-ctrl.scss
index 1255490fdc..7b8e5f0d92 100644
--- a/src/control/list/md-ctrl/md-ctrl.scss
+++ b/src/control/list/md-ctrl/md-ctrl.scss
@@ -1,58 +1,67 @@
 $control-mobmdctrl: (
+  font-size: getCssVar(font-size, regular),
   text-color: getCssVar(color, text, 0),
-  hover-bg-color: getCssVar(color, primary),
+  border-color: getCssVar(color, border),
+  active-text-color: getCssVar(color, white),
+  active-bg-color: getCssVar(color, primary),
+  padding: getCssVar(spacing, tight) getCssVar(spacing, base),
+  overflow: getCssVar(control, overflow),
+  box-shadow-inner: 0 0 0 rgba(0 0 0 / 30%),
+  box-shadow-outer: 0 rem(4px) rem(14px) rgba(0 0 0 / 10%),
   img-width: getCssVar(width-icon, extra-large),
+  img-height: getCssVar(width-icon, extra-large),
   img-radius: getCssVar(border-radius, extra-small),
-  padding: getCssVar(spacing, tight) getCssVar(spacing, base),
-  group-padding: getCssVar(spacing, base),
+  img-padding: getCssVar(spacing, tight),
+  item-font-color: getCssVar(color, text, 0),
+  item-bg-color: getCssVar(color, bg, 2),
+  item-under-line-right: getCssVar(spacing, base),
+  item-under-line-left: getCssVar(spacing, base),
+  item-right-padding: 0 0 0 getCssVar('spacing', 'tight'),
   group-font-size: getCssVar(font-size, header-6),
-  icon-color: getCssVar(color, text, 3),
-  group-caption-color: getCssVar(color, text, 2),
-  load-more-font-size: getCssVar(font-size, small),
-  font-size: getCssVar(font-size, header-5),
-  right-icon-margin-right: rem(21px),
+  group-bg-color: getCssVar(color, bg, 0),
+  group-text-color: getCssVar(color, text, 1),
+  group-padding: getCssVar(spacing, base),
+  group-anchor-bg-color: getCssVar(color, bg, 1),
+  group-anchor-border-radius: getCssVar(border, radius, small),
+  group-anchor-right: getCssVar('spacing', 'tight'),
+  group-anchor-item-padding: getCssVar('spacing', 'extra-tight'),
+  group-anchor-max-width: 120px,
+  load-more-font-size: getCssVar(font-size, regular),
+  load-more-text-color: getCssVar(color, primary),
+  load-more-padding: getCssVar(spacing, tight),
+  load-more-btn-height: getCssVar('height-control', 'small'),
+  load-more-btn-padding: getCssVar('spacing', 'tight') getCssVar('spacing', 'base'),
+  load-more-btn-border-radius: getCssVar(border, radius, full),
+  pagination-height: getCssVar('height-control', 'large'),
   simplelist-height: 250px,
-  select-item-padding-bottom: getCssVar(spacing, tight),
-  select-item-margin: getCssVar(spacing, tight) 0 0 getCssVar(spacing, tight),
-  select-item-check-padding: getCssVar(spacing, extra-tight),
-  select-item-gap: getCssVar(spacing, tight),
-  pagination-height: var(--van-pagination-height),
-);
-
-$panel:(
-  scroll: hidden,
 );
 
 @include b(control-mobmdctrl) {
   @include set-component-css-var(control-mobmdctrl, $control-mobmdctrl);
-  .#{bem(panel-container)}{
-    @include set-component-css-var(panel, $panel);
-  }
 
   height: 100%;
-  overflow: getCssVar(control, overflow);
+  overflow: getCssVar(control-mobmdctrl, overflow);
   position: relative;
 
+  // 列表容器样式
   @include e(content) {
     width: 100%;
     height: 99%;
 
-    .van-cell {
-      padding: getCssVar(control-mobmdctrl, padding);
-      line-height: normal;
-    }
     @include when(show-under-line) {
-      .#{bem(control-mobmdctrl-item)} {
+      // 列表项下划线样式
+      .#{bem(control-mobmdctrl-item)},
+      .#{bem(control-mobmdctrl-select-item)} {
         position: relative;
         &::after {
           position: absolute;
           box-sizing: border-box;
           content: '';
           pointer-events: none;
-          right: getCssVar(spacing, base);
+          right: getCssVar(control-mobmdctrl, item-under-line-right);
           bottom: 0;
-          left: getCssVar(spacing, base);
-          border-bottom: 1px solid getCssVar(color, border);
+          left: getCssVar(control-mobmdctrl, item-under-line-left);
+          border-bottom: 1px solid getCssVar(control-mobmdctrl, border-color);
           transform: scaleY(0.5);
           display: block;
         }
@@ -60,6 +69,7 @@ $panel:(
     }
   }
 
+  // 启用分页，列表内容区需减去分页高度。分页时内容区出滚动条，避免滚动时页码偏移
   @include when(enable-page) {
     .#{bem(control-mobmdctrl, content)} {
       height: calc(100% - getCssVar(control-mobmdctrl, pagination-height));
@@ -67,147 +77,155 @@ $panel:(
     }
   }
 
+  // 启用加载更多时，部件整体高度应该由列表内容加上加载更多高度撑起来，继承父元素高度会导致滚动异常
+  @include when(load-more) {
+    height: auto;
+  }
+
+  // 启用分组时，应该由列表内容区出滚动条，避免滚动时锚点偏移
   @include when(enable-anchor) {
     .#{bem(control-mobmdctrl, content)} {
       overflow-y: auto;
     }
   }
-
-  .van-cell__right-icon {
-    margin-right: getCssVar(control-mobmdctrl, right-icon-margin-right);
-    color: getCssVar(control-mobmdctrl, icon-color);
-    margin-right: 0px;
-    height: auto;
-    font-size: getCssVar(font-size, regular);
-    line-height: normal;
-    display: flex;
-    align-items: center;
-  }
-
-  .van-cell--clickable:active {
-    color: inherit;
-  }
 }
 
+// 列表项样式
 @include b(control-mobmdctrl-item) {
-  @include set-component-css-var(control-mobmdctrl, $control-mobmdctrl);
-  background-color: getCssVar(control-mobmdctrl, item-bg-color);
-  color: getCssVar(control-mobmdctrl, item-font-color);
-  &:hover {
-    background-color: getCssVar(control-mobmdctrl,
-      item-hover-color
-    );
-  }
-  @include when(active) {
-    background-color: getCssVar(control-mobmdctrl,
-      item-active-color
-    );
+  // 部件为选择模式时，右侧复选框间距
+  @include e(right) {
+    padding: getCssVar(control-mobmdctrl, item-right-padding);
   }
 
-  @include m(right) {
-    margin-right: getCssVar(control-mobmdctrl, right-icon-margin-right);
+  // 增加权重，避免ui组件本身样式影响
+  &.#{bem(control-mobmdctrl-item)} {
+    background-color: getCssVar(control-mobmdctrl, item-bg-color);
+    color: getCssVar(control-mobmdctrl, item-font-color);
+    height: auto;
+    font-size: getCssVar(control-mobmdctrl, font-size);
+    padding: getCssVar(control-mobmdctrl, padding);
   }
 
-  padding: getCssVar(control-mobmdctrl, padding);
-
-  &.#{bem(control-panel)} {
-    height: auto;
+  // 列表项选中样式
+  @include when(active) {
+    &.#{bem(control-mobmdctrl-item)} {
+      background-color: getCssVar(control-mobmdctrl, item-active-color);
+    }
   }
 }
 
+// 列表项左侧图片样式，默认绘制并且项数据image存在路径值时生效
 @include b(control-mobmdctrl-image) {
-  @include set-component-css-var(control-mobmdctrl, $control-mobmdctrl);
-
   width: getCssVar(control-mobmdctrl, img-width);
-  margin-right: getCssVar(control-mobmdctrl, padding);
+  height: getCssVar(control-mobmdctrl, img-height);
+  margin-right: getCssVar(control-mobmdctrl, img-padding);
   border-radius: getCssVar(control-mobmdctrl, img-radius);
 }
 
+// 分组样式
 @include b('control-mobmdctrl-group') {
-  @include set-component-css-var(control-mobmdctrl, $control-mobmdctrl);
-
   @include e('container') {
     width: 100%;
     height: auto;
   }
 
+  // 分组标题样式
   @include e('caption') {
     padding: getCssVar(control-mobmdctrl, group-padding);
     font-size: getCssVar(control-mobmdctrl, group-font-size);
-    color: getCssVar(control-mobmdctrl, group-caption-color);
-    background-color: getCssVar(color, bg, 0);
+    color: getCssVar(control-mobmdctrl, group-text-color);
+    background-color: getCssVar(control-mobmdctrl, group-bg-color);
   }
 
+  // 分组锚点容器样式
   @include e('anchor-container') {
     position: absolute;
-    right: getCssVar('spacing', 'tight');
+    right: getCssVar(control-mobmdctrl, group-anchor-right);
     top: 45%;
     transform: translateY(-50%);
-    border-radius: 4px;
+    border-radius: getCssVar(control-mobmdctrl, group-anchor-border-radius);
     overflow: hidden;
-    font-size: getCssVar(font-size, regular);
-    max-width: 120px;
+    font-size: getCssVar(control-mobmdctrl, font-size);
+    max-width: getCssVar(control-mobmdctrl, group-anchor-max-width);
     display: flex;
     flex-direction: column;
-    background-color: getCssVar(color, bg, 1);
-    box-shadow: 0 0 0 rgba(0 0 0 / 30%),
-      0 rem(4px) rem(14px) rgba(0 0 0 / 10%);
+    background-color: getCssVar(control-mobmdctrl, group-anchor-bg-color);
+    box-shadow:
+      getCssVar(control-mobmdctrl, box-shadow-inner),
+      getCssVar(control-mobmdctrl, box-shadow-outer);
   }
 
+  // 分组锚点项样式
   @include e('anchor-item') {
     width: 100%;
     text-align: center;
-    padding: getCssVar('spacing', 'extra-tight');
+    padding: getCssVar(control-mobmdctrl, group-anchor-item-padding);
 
     @include when(active) {
-      color: getCssVar(color, white);
-      background-color: getCssVar(color, primary);
+      color: getCssVar(control-mobmdctrl, active-text-color);
+      background-color: getCssVar(control-mobmdctrl, active-bg-color);
     }
   }
 }
 
+// 加载更多样式
 @include b(control-mobmdctrl-load-more) {
   display: flex;
   justify-content: center;
-  padding: getCssVar(spacing, tight);
+  padding: getCssVar(control-mobmdctrl, load-more-padding);
   font-size: getCssVar(control-mobmdctrl, load-more-font-size);
-  color: getCssVar(color, text, 2);
+  color: getCssVar(control-mobmdctrl, load-more-text-color);
 
+  // 加载更多按钮样式
   span {
-    padding: getCssVar(spacing, extra, tight) getCssVar(spacing, base);
+    display: flex;
+    align-items: center;
+    min-height: getCssVar(control-mobmdctrl, load-more-btn-height);
     cursor: pointer;
-    border: 1px solid getCssVar(color, border);
-    border-radius: getCssVar(border, radius, full);
   }
 }
 
+// 部件为选择模式并且项为布局面板时的列表项样式
 @include b(control-mobmdctrl-select-item) {
   display: flex;
-  gap: getCssVar(control-mobmdctrl, select-item-gap);
-  padding-bottom: getCssVar(control-mobmdctrl, select-item-padding-bottom);
-  margin: getCssVar(control-mobmdctrl, select-item-margin);
-  border-bottom: 1px solid getCssVar(color, border);
+  align-items: center;
+  justify-content: space-between;
+  color: getCssVar(control-mobmdctrl, item-font-color);
+  background-color: getCssVar(control-mobmdctrl, item-bg-color);
+  padding: getCssVar(control-mobmdctrl, padding);
 
-  > .van-checkbox {
-    padding: getCssVar(control-mobmdctrl, select-item-check-padding);
+  @include e(right) {
+    padding: getCssVar(control-mobmdctrl, item-right-padding);
+  }
+
+  .#{bem(control-mobmdctrl-item)} {
+    flex: 1;
+    padding: 0;
+    width: auto;
+    &.#{bem(control-mobmdctrl-item)}::after {
+      display: none;
+    }
   }
 }
-@include b('control-mobmdctrl-slider-item'){
-  .van-swipe-cell__right{
-    >.van-button{
+
+// 列表项左滑行为组与右滑行为组样式
+@include b('control-mobmdctrl-slider-item') {
+  .van-swipe-cell__right {
+    > .van-button {
       height: 100%;
     }
   }
-  .van-swipe-cell__left{
-    >.van-button{
+  .van-swipe-cell__left {
+    > .van-button {
       height: 100%;
     }
   }
 }
 
+// 快速工具栏样式
 @include b(control-mobmdctrl-quicktoolbar) {
-  width: 100%; 
+  width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
-}
\ No newline at end of file
+}
diff --git a/src/panel-component/setting-container/setting-container.scss b/src/panel-component/setting-container/setting-container.scss
index 85c5670c97..2ad499a929 100644
--- a/src/panel-component/setting-container/setting-container.scss
+++ b/src/panel-component/setting-container/setting-container.scss
@@ -1,14 +1,17 @@
 $setting-container: (
+  'bg-color': getCssVar('color', 'bg', 1),
   'padding': getCssVar('spacing', 'tight') getCssVar('spacing', 'base')
     getCssVar('spacing', 'tight') 0,
-  'height': 2.25rem,
+  'height': getCssVar('height-control', 'default'),
+  'md-sort-font-size': getCssVar('font-size', 'header-4'),
+  'md-sort-icon-color': getCssVar(color, text, 0),
 );
 
 @include b('setting-container') {
   @include set-component-css-var('setting-container', $setting-container);
 
   padding: getCssVar('setting-container', 'padding');
-  background-color: getCssVar('color', 'bg', 1);
+  background-color: getCssVar('setting-container', 'bg-color');
 
   @include e('content') {
     height: getCssVar('setting-container', 'height');
@@ -16,14 +19,15 @@ $setting-container: (
     align-items: center;
   }
 
+  // 排序按钮样式
   @include e('md-sort') {
     display: flex;
     align-items: center;
-    font-size: getCssVar('font-size', 'header-4');
+    font-size: getCssVar('setting-container', 'md-sort-font-size');
     cursor: pointer;
 
     svg {
-      fill: getCssVar(color, text, 3);
+      fill: getCssVar('setting-container', 'md-sort-icon-color');
     }
   }
 
-- 
Gitee


From 933c06512aaf6f89c789a0c2078da494f538514d Mon Sep 17 00:00:00 2001
From: lijianxiong <1518062161@qq.com>
Date: Thu, 23 Oct 2025 10:07:58 +0800
Subject: [PATCH 4/4] =?UTF-8?q?feat=EF=BC=9A=E6=9B=B4=E6=96=B0CHANGELOG?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index aa9d76c82c..6d06e0ec32 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -53,6 +53,7 @@
 - 向导面板样式变量抽取
 - 编辑表单样式变量抽取
 - 优化门户部件头部的呈现样式
+- 优化多数据部件及排序设置及设置容器等组件样式，不直接用基础css变量，各组件定义专属变量
 
 ### Fixed
 
-- 
Gitee