opentiny
/
tiny-vue
2
0
Fork 30
Code Issues Pull Requests 7 Packages Projects Releases Wiki Activity

fix(demos): [select,popeditor,slider] fix problem and optimization demo (#2435) 

* fix(guide): [guide] fix guide displaying after jumping to other pages

* fix(demos): [select,popeditor,slider] fix problem and optimization demo
This commit is contained in:
MomoPoppy 2024-10-28 00:09:05 -07:00 committed by GitHub
parent d2197c3c7b
commit e1e28411c1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
80 changed files with 149 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
examples/sites/demos/pc/app/popeditor/auto-lookup-composition-api.vue
View File

@ -24,7 +24,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/auto-lookup.vue
View File

@ -29,7 +29,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/auto-reset-composition-api.vue
View File

@ -82,7 +82,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/auto-reset.vue
View File

@ -87,7 +87,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/basic-usage-composition-api.vue
View File

@ -80,7 +80,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/basic-usage.vue
View File

@ -85,7 +85,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/before-close-composition-api.vue
View File

@ -81,7 +81,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/before-close.vue
View File

@ -86,7 +86,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/before-reset-composition-api.vue
View File

@ -82,7 +82,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/before-reset.vue
View File

@ -87,7 +87,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/clearable-composition-api.vue
View File

@ -81,7 +81,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/clearable.vue
View File

@ -86,7 +86,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/condition-form-composition-api.vue
View File

@ -129,7 +129,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/condition-form.vue
View File

@ -131,7 +131,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

19
examples/sites/demos/pc/app/popeditor/condition-layout-composition-api.vue
View File

@ -22,7 +22,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',
@ -45,17 +45,12 @@ const gridOp = ref({
} }
}) })
const conditions = ref([ const conditions = ref([
{
label: '公司名',
field: 'name',
span: 12,
labelWidth: '160px',
attrs: { clearable: true }
},
{ {
label: '城市', label: '城市',
field: 'city', field: 'city',
labelWidth: '50px',
component: hooks.markRaw(Select), component: hooks.markRaw(Select),
labelPosition: 'left',
attrs: { attrs: {
options: [ options: [
{ label: '福州', value: 'fz' }, { label: '福州', value: 'fz' },
@ -64,7 +59,13 @@ const conditions = ref([
}, },
span: 6 span: 6
}, },
{ label: '员工', field: 'employees', component: hooks.markRaw(Numeric) } {
label: '员工',
field: 'employees',
span: 6,
labelWidth: '50px',
component: hooks.markRaw(Numeric)
}
]) ])
function remoteSearch({ page }) { function remoteSearch({ page }) {

19
examples/sites/demos/pc/app/popeditor/condition-layout.vue
View File

@ -27,7 +27,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',
@ -50,17 +50,12 @@ export default {
} }
}, },
conditions: [ conditions: [
{
label: '公司名',
field: 'name',
span: 12,
labelWidth: '160px',
attrs: { clearable: true }
},
{ {
label: '城市', label: '城市',
field: 'city', field: 'city',
labelWidth: '50px',
component: hooks.markRaw(Select), component: hooks.markRaw(Select),
labelPosition: 'left',
attrs: { attrs: {
options: [ options: [
{ label: '福州', value: 'fz' }, { label: '福州', value: 'fz' },
@ -69,7 +64,13 @@ export default {
}, },
span: 6 span: 6
}, },
{ label: '员工', field: 'employees', component: hooks.markRaw(Numeric) } {
label: '员工',
field: 'employees',
span: 6,
labelWidth: '50px',
component: hooks.markRaw(Numeric)
}
] ]
} }
}, },

2
examples/sites/demos/pc/app/popeditor/conditions-composition-api.vue
View File

@ -81,7 +81,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/conditions.vue
View File

@ -86,7 +86,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/disabled-composition-api.vue
View File

@ -81,7 +81,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/disabled.vue
View File

@ -86,7 +86,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/draggable-composition-api.vue
View File

@ -86,7 +86,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/draggable.vue
View File

@ -91,7 +91,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/events-composition-api.vue
View File

@ -23,7 +23,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/events.vue
View File

@ -28,7 +28,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/grid-composition-api.vue
View File

@ -75,7 +75,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/grid.vue
View File

@ -80,7 +80,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/icon-composition-api.vue
View File

@ -20,7 +20,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/icon.vue
View File

@ -25,7 +25,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/multi-composition-api.vue
View File

@ -93,7 +93,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/multi-value-array-composition-api.vue
View File

@ -87,7 +87,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/multi-value-array.vue
View File

@ -92,7 +92,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/multi.vue
View File

@ -93,7 +93,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/pager-composition-api.vue
View File

@ -20,7 +20,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/pager.vue
View File

@ -25,7 +25,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/radio-change-close-composition-api.vue
View File

@ -81,7 +81,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/radio-change-close.vue
View File

@ -86,7 +86,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/readonly-composition-api.vue
View File

@ -81,7 +81,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/readonly.vue
View File

@ -86,7 +86,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/remote-search-composition-api.vue
View File

@ -21,7 +21,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/remote-search.vue
View File

@ -26,7 +26,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/render-text-composition-api.vue
View File

@ -22,7 +22,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/render-text.vue
View File

@ -27,7 +27,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/resize-composition-api.vue
View File

@ -74,7 +74,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/resize.vue
View File

@ -79,7 +79,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/selected-box-composition-api.vue
View File

@ -89,7 +89,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/selected-box.vue
View File

@ -94,7 +94,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/show-clear-btn-composition-api.vue
View File

@ -81,7 +81,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/show-clear-btn.vue
View File

@ -86,7 +86,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/show-history-composition-api.vue
View File

@ -12,7 +12,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/show-history.vue
View File

@ -19,7 +19,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/show-overflow-composition-api.vue
View File

@ -85,7 +85,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/show-overflow.vue
View File

@ -90,7 +90,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/size-composition-api.vue
View File

@ -111,7 +111,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/size.vue
View File

@ -116,7 +116,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/slot-composition-api.vue
View File

@ -96,7 +96,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/slot-footer-composition-api.vue
View File

@ -79,7 +79,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/slot-footer.vue
View File

@ -85,7 +85,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/slot.vue
View File

@ -103,7 +103,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/suggest-composition-api.vue
View File

@ -92,7 +92,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/suggest.vue
View File

@ -97,7 +97,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/tabindex-composition-api.vue
View File

@ -92,7 +92,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/tabindex.vue
View File

@ -97,7 +97,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/textField-composition-api.vue
View File

@ -75,7 +75,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/textField.vue
View File

@ -80,7 +80,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/title-composition-api.vue
View File

@ -82,7 +82,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/title.vue
View File

@ -87,7 +87,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/trigger-composition-api.vue
View File

@ -86,7 +86,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/trigger.vue
View File

@ -91,7 +91,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/width-composition-api.vue
View File

@ -83,7 +83,7 @@ const gridOp = ref({
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/popeditor/width.vue
View File

@ -88,7 +88,7 @@ export default {
{ {
field: 'id', field: 'id',
title: 'ID', title: 'ID',
width: 40 width: 50
}, },
{ {
field: 'name', field: 'name',

2
examples/sites/demos/pc/app/slider/max-min-composition-api.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<tiny-slider v-model="value" :min="0" :max="100"></tiny-slider> <tiny-slider v-model="value" :min="30" :max="70"></tiny-slider>
</template> </template>
<script setup> <script setup>

2
examples/sites/demos/pc/app/slider/max-min.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<tiny-slider v-model="value" :min="0" :max="100"></tiny-slider> <tiny-slider v-model="value" :min="30" :max="70"></tiny-slider>
</template> </template>
<script> <script>

4
packages/renderless/src/guide/index.ts
View File

@ -62,6 +62,10 @@ export const mounted =
} }
} }
export const beforeUnmount = (state) => () => {
state.tour.hide()
}
const getItemCopy = (props, tour, result) => { const getItemCopy = (props, tour, result) => {
const { domData } = props const { domData } = props

14
packages/renderless/src/guide/vue.ts
View File

@ -1,8 +1,13 @@
import { createShepherd, mounted } from './index' import { createShepherd, mounted, beforeUnmount } from './index'
export const api = ['state'] export const api = ['state']
export const renderless = (props, { reactive, onMounted, watch }, { designConfig }, { Shepherd, offset }) => { export const renderless = (
props,
{ reactive, onMounted, onBeforeUnmount, watch },
{ designConfig },
{ Shepherd, offset }
) => {
const state = reactive({ const state = reactive({
tour: null, tour: null,
tour1: null, tour1: null,
@ -25,11 +30,14 @@ export const renderless = (props, { reactive, onMounted, watch }, { designConfig
const api = { const api = {
...baseApi, ...baseApi,
mounted: mounted({ state, api: baseApi }) mounted: mounted({ state, api: baseApi }),
beforeUnmount: beforeUnmount(state)
} }
watch(() => props.showStep, api.createShepherd) watch(() => props.showStep, api.createShepherd)
onMounted(api.mounted) onMounted(api.mounted)
onBeforeUnmount(api.beforeUnmount)
return api return api
} }

2
packages/theme/src/option/index.less
View File

@ -80,7 +80,7 @@
background-color: var(--tv-Option-bg-color-hover); background-color: var(--tv-Option-bg-color-hover);
} }
&:not(:has(.tiny-option__checkbox-wrap)).selected { &:not(.tiny-option_all):not(:has(.tiny-option__checkbox-wrap)).selected {
color: var(--tv-Option-text-color-selected); color: var(--tv-Option-text-color-selected);
} }

4
packages/theme/src/popeditor/index.less
View File

@ -131,11 +131,11 @@
} }
&:nth-child(2n + 1) { &:nth-child(2n + 1) {
padding-right: 16px; padding-right: var(--tv-Popeditor-search-item-padding-right);
} }
&:nth-child(2n) { &:nth-child(2n) {
padding-left: 16px; padding-left: var(--tv-Popeditor-search-item-padding-left);
} }
} }

4
packages/theme/src/popeditor/vars.less
View File

@ -39,4 +39,8 @@
--tv-Popeditor-tabs-text-color: var(--tv-color-text); --tv-Popeditor-tabs-text-color: var(--tv-color-text);
// 弹出表格搜索项左侧标签文本默认宽度 // 弹出表格搜索项左侧标签文本默认宽度
--tv-Popeditor-search-item-width: 80px; --tv-Popeditor-search-item-width: 80px;
// 弹出表格搜索项右侧内间距
--tv-Popeditor-search-item-padding-right: var(--tv-space-sm, 4px);
// 弹出表格搜索项左侧内间距
--tv-Popeditor-search-item-padding-left: var(--tv-space-sm, 4px);
} }

45
packages/theme/src/select/index.less
View File

@ -100,6 +100,16 @@
} }
} }
&--mini {
.@{select-prefix-cls}__tags {
padding: var(--tv-Select-tags-padding-mini);
.tiny-tag {
height: 18px;
}
}
}
&__tags { &__tags {
position: absolute; position: absolute;
line-height: normal; line-height: normal;
@ -147,18 +157,6 @@
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
background-color: transparent; background-color: transparent;
&.is-mini {
height: var(--tv-Select-height-mini);
}
&.is-small {
height: var(--tv-Select-height-small);
}
&.is-medium {
height: var(--tv-Select-height-medium);
}
} }
&.is-showicon { &.is-showicon {
@ -266,6 +264,24 @@
} }
} }
&.@{select-prefix-cls}--medium {
.tiny-select__tags {
height: var(--tv-Select-height-medium);
}
}
&.@{select-prefix-cls}--small {
.tiny-select__tags {
height: var(--tv-Select-height-small);
}
}
&.@{select-prefix-cls}--mini {
.tiny-select__tags {
height: var(--tv-Select-height-mini);
}
}
&.is-hover, &.is-hover,
&.collapse-tag-clicked { &.collapse-tag-clicked {
.@{select-prefix-cls}__tags { .@{select-prefix-cls}__tags {
@ -331,6 +347,10 @@
&.is-display-only { &.is-display-only {
cursor: not-allowed; cursor: not-allowed;
.tiny-select__tags {
cursor: not-allowed;
}
.@{input-prefix-cls} { .@{input-prefix-cls} {
&__inner { &__inner {
padding-right: 12px; padding-right: 12px;
@ -338,6 +358,7 @@
&__suffix { &__suffix {
display: 'inline-block'; display: 'inline-block';
cursor: not-allowed;
} }
} }

3
packages/theme/src/select/vars.less
View File

@ -40,6 +40,9 @@
--tv-Select-tags-height: var(--tv-size-height-md, 32px); --tv-Select-tags-height: var(--tv-size-height-md, 32px);
// 标签区域内边距 // 标签区域内边距
--tv-Select-tags-padding: var(--tv-space-xs, 2px) 0px var(--tv-space-xs, 2px) var(--tv-space-xs, 2px); --tv-Select-tags-padding: var(--tv-space-xs, 2px) 0px var(--tv-space-xs, 2px) var(--tv-space-xs, 2px);
// 标签区域内边距(mini)
--tv-Select-tags-padding-mini: 1px 0 1px var(--tv-space-xs, 2px);
// 标签外边距 // 标签外边距
--tv-Select-tag-margin: var(--tv-space-xs, 2px); --tv-Select-tag-margin: var(--tv-space-xs, 2px);

2
packages/vue/src/select/src/pc.vue
View File

@ -502,7 +502,7 @@
<slot name="dropdown"></slot> <slot name="dropdown"></slot>
<li <li
v-if="multiple && showCheck && showAlloption && !state.multipleLimit && !state.query && !remote" v-if="multiple && showCheck && showAlloption && !state.multipleLimit && !state.query && !remote"
class="tiny-option tiny-select-dropdown__item" class="tiny-option tiny-option_all tiny-select-dropdown__item"
data-tag="tiny-option" data-tag="tiny-option"
:class="[ :class="[
{ {