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
GitHub
parent
d2197c3c7b
commit
e1e28411c1
|
|
@ -24,7 +24,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -82,7 +82,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -87,7 +87,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -82,7 +82,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -87,7 +87,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -129,7 +129,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -131,7 +131,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
@ -45,17 +45,12 @@ const gridOp = ref({
|
|||
}
|
||||
})
|
||||
const conditions = ref([
|
||||
{
|
||||
label: '公司名',
|
||||
field: 'name',
|
||||
span: 12,
|
||||
labelWidth: '160px',
|
||||
attrs: { clearable: true }
|
||||
},
|
||||
{
|
||||
label: '城市',
|
||||
field: 'city',
|
||||
labelWidth: '50px',
|
||||
component: hooks.markRaw(Select),
|
||||
labelPosition: 'left',
|
||||
attrs: {
|
||||
options: [
|
||||
{ label: '福州', value: 'fz' },
|
||||
|
|
@ -64,7 +59,13 @@ const conditions = ref([
|
|||
},
|
||||
span: 6
|
||||
},
|
||||
{ label: '员工', field: 'employees', component: hooks.markRaw(Numeric) }
|
||||
{
|
||||
label: '员工',
|
||||
field: 'employees',
|
||||
span: 6,
|
||||
labelWidth: '50px',
|
||||
component: hooks.markRaw(Numeric)
|
||||
}
|
||||
])
|
||||
|
||||
function remoteSearch({ page }) {
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
@ -50,17 +50,12 @@ export default {
|
|||
}
|
||||
},
|
||||
conditions: [
|
||||
{
|
||||
label: '公司名',
|
||||
field: 'name',
|
||||
span: 12,
|
||||
labelWidth: '160px',
|
||||
attrs: { clearable: true }
|
||||
},
|
||||
{
|
||||
label: '城市',
|
||||
field: 'city',
|
||||
labelWidth: '50px',
|
||||
component: hooks.markRaw(Select),
|
||||
labelPosition: 'left',
|
||||
attrs: {
|
||||
options: [
|
||||
{ label: '福州', value: 'fz' },
|
||||
|
|
@ -69,7 +64,13 @@ export default {
|
|||
},
|
||||
span: 6
|
||||
},
|
||||
{ label: '员工', field: 'employees', component: hooks.markRaw(Numeric) }
|
||||
{
|
||||
label: '员工',
|
||||
field: 'employees',
|
||||
span: 6,
|
||||
labelWidth: '50px',
|
||||
component: hooks.markRaw(Numeric)
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -91,7 +91,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -75,7 +75,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -93,7 +93,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -87,7 +87,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -93,7 +93,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -94,7 +94,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -90,7 +90,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -111,7 +111,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -116,7 +116,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -96,7 +96,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -103,7 +103,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -97,7 +97,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -97,7 +97,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -75,7 +75,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -82,7 +82,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -87,7 +87,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -91,7 +91,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -83,7 +83,7 @@ const gridOp = ref({
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -88,7 +88,7 @@ export default {
|
|||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
width: 40
|
||||
width: 50
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<tiny-slider v-model="value" :min="0" :max="100"></tiny-slider>
|
||||
<tiny-slider v-model="value" :min="30" :max="70"></tiny-slider>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<tiny-slider v-model="value" :min="0" :max="100"></tiny-slider>
|
||||
<tiny-slider v-model="value" :min="30" :max="70"></tiny-slider>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -62,6 +62,10 @@ export const mounted =
|
|||
}
|
||||
}
|
||||
|
||||
export const beforeUnmount = (state) => () => {
|
||||
state.tour.hide()
|
||||
}
|
||||
|
||||
const getItemCopy = (props, tour, result) => {
|
||||
const { domData } = props
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,13 @@
|
|||
import { createShepherd, mounted } from './index'
|
||||
import { createShepherd, mounted, beforeUnmount } from './index'
|
||||
|
||||
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({
|
||||
tour: null,
|
||||
tour1: null,
|
||||
|
|
@ -25,11 +30,14 @@ export const renderless = (props, { reactive, onMounted, watch }, { designConfig
|
|||
|
||||
const api = {
|
||||
...baseApi,
|
||||
mounted: mounted({ state, api: baseApi })
|
||||
mounted: mounted({ state, api: baseApi }),
|
||||
beforeUnmount: beforeUnmount(state)
|
||||
}
|
||||
|
||||
watch(() => props.showStep, api.createShepherd)
|
||||
|
||||
onMounted(api.mounted)
|
||||
onBeforeUnmount(api.beforeUnmount)
|
||||
|
||||
return api
|
||||
}
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@
|
|||
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);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -131,11 +131,11 @@
|
|||
}
|
||||
|
||||
&:nth-child(2n + 1) {
|
||||
padding-right: 16px;
|
||||
padding-right: var(--tv-Popeditor-search-item-padding-right);
|
||||
}
|
||||
|
||||
&:nth-child(2n) {
|
||||
padding-left: 16px;
|
||||
padding-left: var(--tv-Popeditor-search-item-padding-left);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -39,4 +39,8 @@
|
|||
--tv-Popeditor-tabs-text-color: var(--tv-color-text);
|
||||
// 弹出表格搜索项左侧标签文本默认宽度
|
||||
--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);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -100,6 +100,16 @@
|
|||
}
|
||||
}
|
||||
|
||||
&--mini {
|
||||
.@{select-prefix-cls}__tags {
|
||||
padding: var(--tv-Select-tags-padding-mini);
|
||||
|
||||
.tiny-tag {
|
||||
height: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__tags {
|
||||
position: absolute;
|
||||
line-height: normal;
|
||||
|
|
@ -147,18 +157,6 @@
|
|||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
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 {
|
||||
|
|
@ -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,
|
||||
&.collapse-tag-clicked {
|
||||
.@{select-prefix-cls}__tags {
|
||||
|
|
@ -331,6 +347,10 @@
|
|||
&.is-display-only {
|
||||
cursor: not-allowed;
|
||||
|
||||
.tiny-select__tags {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.@{input-prefix-cls} {
|
||||
&__inner {
|
||||
padding-right: 12px;
|
||||
|
|
@ -338,6 +358,7 @@
|
|||
|
||||
&__suffix {
|
||||
display: 'inline-block';
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -40,6 +40,9 @@
|
|||
--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);
|
||||
// 标签区域内边距(mini)
|
||||
--tv-Select-tags-padding-mini: 1px 0 1px var(--tv-space-xs, 2px);
|
||||
|
||||
// 标签外边距
|
||||
--tv-Select-tag-margin: var(--tv-space-xs, 2px);
|
||||
|
||||
|
|
|
|||
|
|
@ -502,7 +502,7 @@
|
|||
<slot name="dropdown"></slot>
|
||||
<li
|
||||
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"
|
||||
:class="[
|
||||
{
|
||||
|
|
|
|||
Loading…
Reference in New Issue