fix(transfer): [transfer] update smb design (#2249)

* fix(cascader): update cascader's x design * test(cascader): fix e2e * fix(transfer): update checkbox's classname and adjust button text to center
opentiny · Oct 14, 2024 · 47371e5 · 47371e5
1 parent b1240c9
commit 47371e5
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 5 deletions.
diff --git a/examples/sites/demos/pc/app/transfer/nested-tree-composition-api.vue b/examples/sites/demos/pc/app/transfer/nested-tree-composition-api.vue
@@ -74,6 +74,7 @@ const treeData = ref([
   }
 ])
 const treeConfig = ref({
+  showLine: true,
   showCheckbox: true,
   nodeKey: 'id',
   checkStrictly: true,

diff --git a/examples/sites/demos/pc/app/transfer/nested-tree.vue b/examples/sites/demos/pc/app/transfer/nested-tree.vue
@@ -79,6 +79,7 @@ export default {
         }
       ],
       treeConfig: {
+        showLine: true,
         showCheckbox: true,
         nodeKey: 'id',
         checkStrictly: true,

diff --git a/packages/theme/src/transfer/index.less b/packages/theme/src/transfer/index.less
@@ -112,6 +112,8 @@
     i,
     span {
       font-size: var(--ti-transfer-font-size);
+      transform: translateY(-3px); // 适配 xdesign, 让span居中
+      display: inline-block;
     }
 
     [class*='tiny-icon'] + span {

diff --git a/packages/vue/src/transfer-panel/src/pc.vue b/packages/vue/src/transfer-panel/src/pc.vue
@@ -70,9 +70,10 @@
             <span class="tiny-checkbox__inner">
               <icon-check
                 v-if="!(state.checked.length > 0 && state.checked.indexOf(item[state.keyProp]) > -1)"
-                class="tiny-svg-size"
+                class="tiny-svg-size icon-no-checked"
+                style="fill: transparent"
               />
-              <icon-checked-sur v-else class="tiny-svg-size" />
+              <icon-checked-sur v-else class="tiny-svg-size icon-checked-sur" />
             </span>
             <input
               type="checkbox"
@@ -129,7 +130,7 @@ import { renderless, api } from '@opentiny/vue-renderless/transfer-panel/vue'
 import Checkbox from '@opentiny/vue-checkbox'
 import Input from '@opentiny/vue-input'
 import Pager from '@opentiny/vue-pager'
-import { iconArrowUp, iconArrowDown, iconCheckedSur, iconCheck, iconSearch } from '@opentiny/vue-icon'
+import { iconArrowUp, iconArrowDown, iconYes, iconSearch } from '@opentiny/vue-icon'
 
 export const transferPanelProps = {
   columns: Array,
@@ -172,8 +173,8 @@ export default defineComponent({
     TinyPager: Pager,
     IconArrowDown: iconArrowDown(),
     IconArrowUp: iconArrowUp(),
-    IconCheckedSur: iconCheckedSur(),
-    IconCheck: iconCheck(),
+    IconCheckedSur: iconYes(),
+    IconCheck: iconYes(),
     IconSearch: iconSearch(),
     OptionContent: {
       props: {