plain-design 0.0.81 → 0.0.85
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/plain-design.commonjs.min.js +2 -2
- package/dist/plain-design.min.js +2 -2
- package/dist/report.html +6 -5
- package/package.json +3 -3
- package/src/packages/PlImage/index.tsx +20 -5
- package/src/packages/PlImageUploader/index.tsx +8 -7
- package/src/packages/PlTable/plc/standard/plc-expand.tsx +4 -0
- package/src/packages/PlcImage/index.tsx +5 -14
- package/src/packages/createUseTableOption/use/use.methods.tsx +12 -6
- package/src/packages/createUseTableOption/use/use.paginaiton.tsx +1 -2
- package/src/packages/useContextmenu/PlContextMenuService.tsx +17 -15
- package/src/packages/useImage/index.tsx +5 -3
- package/src/styles/data/scan.scss.json +9 -9
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "plain-design",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.85",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "dist/plain-design.min.js",
|
|
6
6
|
"module": "dist/plain-design.commonjs.min.js",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"author": "",
|
|
22
22
|
"license": "ISC",
|
|
23
23
|
"peerDependencies": {
|
|
24
|
-
"plain-design-composition": "0.0.
|
|
24
|
+
"plain-design-composition": "0.0.105",
|
|
25
25
|
"react": "^17.0.1",
|
|
26
26
|
"react-dom": "^17.0.1"
|
|
27
27
|
},
|
|
@@ -66,7 +66,7 @@
|
|
|
66
66
|
"fork-ts-checker-webpack-plugin": "^6.2.4",
|
|
67
67
|
"mini-css-extract-plugin": "^1.6.2",
|
|
68
68
|
"mockjs": "^1.1.0",
|
|
69
|
-
"plain-design-composition": "0.0.
|
|
69
|
+
"plain-design-composition": "0.0.105",
|
|
70
70
|
"postcss": "^8.2.13",
|
|
71
71
|
"postcss-loader": "^4.2.0",
|
|
72
72
|
"qs": "^6.10.1",
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {computed, designComponent, PropType, reactive, useClasses, useRefs, useStyles, watch} from 'plain-design-composition'
|
|
2
2
|
import './image.scss'
|
|
3
|
-
import {useClasses} from "plain-design-composition";
|
|
4
3
|
import {unit} from "plain-utils/string/unit";
|
|
5
4
|
import React from 'react';
|
|
6
5
|
import PlIcon from "../PlIcon";
|
|
@@ -28,8 +27,23 @@ export const PlImageProps = {
|
|
|
28
27
|
position: {type: String, default: 'top center'}, // 图片 object-position 属性
|
|
29
28
|
}
|
|
30
29
|
|
|
30
|
+
const PathPattern = /^(https?|data:image)/
|
|
31
|
+
|
|
32
|
+
const formatImagePath = (url: string | null | undefined, urlPrefix?: string) => {
|
|
33
|
+
if (!url) {return ''}
|
|
34
|
+
if (!urlPrefix) {return url}
|
|
35
|
+
if (url == null) {return url}
|
|
36
|
+
if (PathPattern.test(url)) {return url}
|
|
37
|
+
urlPrefix = urlPrefix[urlPrefix.length - 1] === '/' ? urlPrefix.slice(0, -1) : urlPrefix
|
|
38
|
+
const imgUrl = url[0] === '/' ? url.slice(1) : url
|
|
39
|
+
return [urlPrefix, imgUrl].join('/')
|
|
40
|
+
}
|
|
41
|
+
|
|
31
42
|
export const PlImage = designComponent({
|
|
32
43
|
name: 'pl-image',
|
|
44
|
+
expose: {
|
|
45
|
+
formatImagePath,
|
|
46
|
+
},
|
|
33
47
|
props: {
|
|
34
48
|
src: {type: String as PropType<string | null>}, // 图片地址
|
|
35
49
|
status: {type: String as PropType<keyof typeof ImageStatus>}, // 当前转股固态，fill, container, cover, none, scale-down
|
|
@@ -40,6 +54,7 @@ export const PlImage = designComponent({
|
|
|
40
54
|
minWidth: {type: [String, Number]}, // 最小宽度
|
|
41
55
|
width: {type: [String, Number]}, // 图片宽度
|
|
42
56
|
height: {type: [String, Number]}, // 图片高度
|
|
57
|
+
urlPrefix: {type: String}, // 图片地址前缀
|
|
43
58
|
...PlImageProps,
|
|
44
59
|
},
|
|
45
60
|
emits: {
|
|
@@ -62,7 +77,7 @@ export const PlImage = designComponent({
|
|
|
62
77
|
const status = computed(() => props.status == null ? state.status : props.status)
|
|
63
78
|
|
|
64
79
|
watch(() => props.src, val => {
|
|
65
|
-
state.src = val
|
|
80
|
+
state.src = formatImagePath(val, props.urlPrefix)
|
|
66
81
|
if (!val) {
|
|
67
82
|
return state.status = ImageStatus.empty
|
|
68
83
|
}
|
|
@@ -70,13 +85,13 @@ export const PlImage = designComponent({
|
|
|
70
85
|
const image = new Image()
|
|
71
86
|
image.onload = () => {
|
|
72
87
|
state.status = ImageStatus.success
|
|
73
|
-
emit.onSuccess(
|
|
88
|
+
emit.onSuccess(state.src!)
|
|
74
89
|
}
|
|
75
90
|
image.onerror = (e) => {
|
|
76
91
|
state.status = ImageStatus.error
|
|
77
92
|
emit.onError(e)
|
|
78
93
|
}
|
|
79
|
-
image.src =
|
|
94
|
+
image.src = state.src
|
|
80
95
|
}, {immediate: true})
|
|
81
96
|
|
|
82
97
|
const classes = useClasses(() => [
|
|
@@ -1,8 +1,7 @@
|
|
|
1
|
-
import {designComponent, PropType, reactive, useModel, useRefs, useStyles, watch} from "plain-design-composition"
|
|
1
|
+
import {designComponent, PropType, reactive, useClasses, useModel, useRefs, useStyles, watch} from "plain-design-composition"
|
|
2
2
|
import {EditProps, useEdit} from "../../use/useEdit";
|
|
3
3
|
import PlImage, {PlImageProps} from "../PlImage";
|
|
4
4
|
import $$file, {FileServiceDefaultAccept, FileServiceUploadConfig} from "../$$file";
|
|
5
|
-
import {useClasses} from "plain-design-composition";
|
|
6
5
|
import {unit} from "plain-utils/string/unit";
|
|
7
6
|
import {deepcopy} from "plain-utils/object/deepcopy";
|
|
8
7
|
import {defer} from "plain-utils/utils/defer";
|
|
@@ -36,6 +35,7 @@ export const PlImageUploader = designComponent({
|
|
|
36
35
|
handleDelete: {type: Function as PropType<() => void | Promise<void>>}, // 自定义删除图片逻辑
|
|
37
36
|
handleUpload: {type: Function as PropType<(file: File) => void | Promise<void>>}, // 自定义上传图片逻辑
|
|
38
37
|
handlePreview: {type: Function as PropType<(url?: string) => void>}, // 自定义预览逻辑
|
|
38
|
+
urlPrefix: {type: String},
|
|
39
39
|
},
|
|
40
40
|
inheritPropsType: HTMLDivElement,
|
|
41
41
|
emits: {
|
|
@@ -60,22 +60,22 @@ export const PlImageUploader = designComponent({
|
|
|
60
60
|
})
|
|
61
61
|
|
|
62
62
|
watch(() => props.modelValue, val => {
|
|
63
|
-
model.value = val
|
|
63
|
+
model.value = PlImage.formatImagePath(val, props.urlPrefix)
|
|
64
64
|
state.chooseBase64 = undefined
|
|
65
|
-
if (!
|
|
65
|
+
if (!model.value) {
|
|
66
66
|
return state.status = ImageUploaderStatus.empty
|
|
67
67
|
}
|
|
68
68
|
state.status = ImageUploaderStatus.pending
|
|
69
69
|
const image = new Image()
|
|
70
70
|
image.onload = () => {
|
|
71
71
|
state.status = ImageUploaderStatus.success
|
|
72
|
-
emit.onLoadSuccess(
|
|
72
|
+
emit.onLoadSuccess(model.value!)
|
|
73
73
|
}
|
|
74
74
|
image.onerror = (e) => {
|
|
75
75
|
state.status = ImageUploaderStatus.error
|
|
76
76
|
emit.onLoadError(e)
|
|
77
77
|
}
|
|
78
|
-
image.src =
|
|
78
|
+
image.src = model.value
|
|
79
79
|
}, {immediate: true})
|
|
80
80
|
|
|
81
81
|
const classes = useClasses(() => [
|
|
@@ -147,7 +147,7 @@ export const PlImageUploader = designComponent({
|
|
|
147
147
|
if (state.status === ImageUploaderStatus.error) {
|
|
148
148
|
return await handler.onClick()
|
|
149
149
|
}
|
|
150
|
-
const url = props.previewImage || model.value || state.chooseBase64
|
|
150
|
+
const url = PlImage.formatImagePath(props.previewImage! || model.value! || state.chooseBase64!, props.urlPrefix)
|
|
151
151
|
if (!!props.handlePreview) {
|
|
152
152
|
return props.handlePreview(url)
|
|
153
153
|
} else {
|
|
@@ -178,6 +178,7 @@ export const PlImageUploader = designComponent({
|
|
|
178
178
|
previewOnClick={false}
|
|
179
179
|
height={props.height}
|
|
180
180
|
width={props.width}
|
|
181
|
+
urlPrefix={props.urlPrefix}
|
|
181
182
|
onClick={handler.onClickImage}
|
|
182
183
|
/>
|
|
183
184
|
)}
|
|
@@ -36,19 +36,8 @@ export const PlcImage = designComponent({
|
|
|
36
36
|
data: {},
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
-
const formatUrl = (url: string | undefined | null): string | null | undefined => {
|
|
40
|
-
if (!props.urlPrefix) {return }
|
|
41
|
-
if (url == null) {return url}
|
|
42
|
-
if (/^(https?|data:image)/.test(url)) {return url}
|
|
43
|
-
|
|
44
|
-
const urlPrefix = props.urlPrefix[props.urlPrefix.length - 1] === '/' ? props.urlPrefix.slice(0, -1) : props.urlPrefix
|
|
45
|
-
const imgUrl = url[0] === '/' ? url.slice(1) : url
|
|
46
|
-
|
|
47
|
-
return [urlPrefix, imgUrl].join('/')
|
|
48
|
-
}
|
|
49
|
-
|
|
50
39
|
const preview = (index: number) => {
|
|
51
|
-
$$image.preview((table.dataModel.value || []).map(i =>
|
|
40
|
+
$$image.preview((table.dataModel.value || []).map(i => PlImage.formatImagePath(i[props.field!], props.urlPrefix)), index)
|
|
52
41
|
}
|
|
53
42
|
|
|
54
43
|
return useExternalPlc({
|
|
@@ -59,8 +48,9 @@ export const PlcImage = designComponent({
|
|
|
59
48
|
defaultScopeSlots: {
|
|
60
49
|
normal: ({row, plc, node}) => (
|
|
61
50
|
!plc.props.field ? null : <PlImage
|
|
51
|
+
urlPrefix={props.urlPrefix}
|
|
62
52
|
previewOnClick={false}
|
|
63
|
-
src={
|
|
53
|
+
src={row[plc.props.field]}
|
|
64
54
|
height={size}
|
|
65
55
|
width={size}
|
|
66
56
|
fit="cover"
|
|
@@ -69,7 +59,8 @@ export const PlcImage = designComponent({
|
|
|
69
59
|
),
|
|
70
60
|
edit: ({row, plc}) => !plc.props.field ? null :
|
|
71
61
|
<PlImageUploader
|
|
72
|
-
|
|
62
|
+
urlPrefix={props.urlPrefix}
|
|
63
|
+
modelValue={row[plc.props.field]}
|
|
73
64
|
onUpdateModelValue={val => row[plc.props.field!] = val}
|
|
74
65
|
uploadConfig={uploadConfig}
|
|
75
66
|
height={size}
|
|
@@ -65,8 +65,7 @@ export function useTableOptionMethods({tableState, config, pagination, hooks, cu
|
|
|
65
65
|
|
|
66
66
|
const pageMethods = useAsyncMethods((() => {
|
|
67
67
|
|
|
68
|
-
const
|
|
69
|
-
if (confirm.state.status !== eTableProStatus.select) {await editMethods.save()}
|
|
68
|
+
const getParams = async (loadConfig?: { page?: number, size?: number }) => {
|
|
70
69
|
await hooks.onBeginLoad.exec(undefined)
|
|
71
70
|
let targetLoadConfig = {
|
|
72
71
|
page: !!loadConfig && loadConfig.page != null ? loadConfig.page : pagination.pageState.page,
|
|
@@ -89,6 +88,12 @@ export function useTableOptionMethods({tableState, config, pagination, hooks, cu
|
|
|
89
88
|
requestData = newRequestData
|
|
90
89
|
requestConfig.method === 'GET' ? (requestConfig.query = requestData) : (requestConfig.body = requestData)
|
|
91
90
|
}
|
|
91
|
+
return {requestConfig, request, requestData, targetLoadConfig}
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
const load = async (loadConfig?: { page?: number, size?: number }) => {
|
|
95
|
+
if (confirm.state.status !== eTableProStatus.select) {await editMethods.save()}
|
|
96
|
+
let {requestConfig, request, requestData, targetLoadConfig} = await getParams(loadConfig)
|
|
92
97
|
requestConfig = await hooks.onBeforeLoad.exec(requestConfig)
|
|
93
98
|
await hooks.onStartLoad.exec({requestConfig, requestData, request})
|
|
94
99
|
let {rows, hasNext} = await request(requestConfig)
|
|
@@ -101,16 +106,17 @@ export function useTableOptionMethods({tableState, config, pagination, hooks, cu
|
|
|
101
106
|
|
|
102
107
|
const reload = async (reloadConfig?: { size?: number }) => {
|
|
103
108
|
const rows = await load({page: 0, size: !reloadConfig ? undefined : reloadConfig.size})
|
|
104
|
-
pagination.updateTotal(null)
|
|
109
|
+
if (pagination.pageState.hasNext) {pagination.updateTotal(null)}
|
|
105
110
|
return rows
|
|
106
111
|
}
|
|
107
112
|
|
|
108
113
|
const queryCount = async () => {
|
|
109
114
|
if (confirm.state.status !== eTableProStatus.select) {await editMethods.save()}
|
|
110
|
-
await
|
|
111
|
-
let {request, requestData, requestConfig} = utils.getUrlConfig('query')
|
|
112
|
-
Object.assign(requestData, {onlyCount: true})
|
|
115
|
+
let {requestConfig, request, requestData} = await getParams()
|
|
113
116
|
requestConfig = await hooks.onBeforeLoad.exec(requestConfig)
|
|
117
|
+
Object.assign(requestData, {onlyCount: true, page: undefined, size: undefined})
|
|
118
|
+
requestConfig = await hooks.onBeforeLoad.exec(requestConfig)
|
|
119
|
+
await hooks.onStartLoad.exec({requestConfig, requestData, request})
|
|
114
120
|
let {total} = await request(requestConfig)
|
|
115
121
|
pagination.updateTotal(total || null)
|
|
116
122
|
return total
|
|
@@ -3,7 +3,6 @@ import {tTableOptionConfig} from "../createUseTableOption.utils";
|
|
|
3
3
|
import PlPagination from "../../PlPagination";
|
|
4
4
|
import React from "react";
|
|
5
5
|
import {tTableOptionHooks} from "./use.hooks";
|
|
6
|
-
import {delay} from "plain-utils/utils/delay";
|
|
7
6
|
|
|
8
7
|
export function useTableOptionPagination({tableState, config, hooks, onPrev, onNext, onJump, onSizeChange}: {
|
|
9
8
|
tableState: { list: any[] },
|
|
@@ -28,7 +27,7 @@ export function useTableOptionPagination({tableState, config, hooks, onPrev, onN
|
|
|
28
27
|
pageState.size = data.size
|
|
29
28
|
pageState.hasNext = data.hasNext
|
|
30
29
|
if (pageState.hasNext === false) {
|
|
31
|
-
pageState.
|
|
30
|
+
updateTotal(pageState.page * pageState.size + data.list.length)
|
|
32
31
|
}
|
|
33
32
|
}
|
|
34
33
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {onBeforeUnmount, onMounted, provide, reactive, ref, useRefs, useStyles} from "plain-design-composition";
|
|
1
|
+
import {onBeforeUnmount, onMounted, provide, reactive, ref, Portal, useRefs, useStyles} from "plain-design-composition";
|
|
2
2
|
import {createDefaultService} from "../PlRoot/createDefaultService";
|
|
3
3
|
import {nextIndex} from "plain-design-composition"
|
|
4
4
|
import {ReactNode} from "react";
|
|
@@ -153,20 +153,22 @@ export const PlContextMenuService = createDefaultService({
|
|
|
153
153
|
}
|
|
154
154
|
|
|
155
155
|
return (
|
|
156
|
-
<
|
|
157
|
-
<
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
{
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
156
|
+
<Portal to=".pl-root-service-container">
|
|
157
|
+
<div className="pl-contextmenu-service" style={styles.value} ref={onRef.el} {...{show: String(isShow.value)} as any}>
|
|
158
|
+
<PlTransition
|
|
159
|
+
key={state.zIndex}
|
|
160
|
+
name="pl-transition-scale"
|
|
161
|
+
show={isShow.value}
|
|
162
|
+
unmount={false}
|
|
163
|
+
onEnter={() => state.bodyPos = {width: refs.el!.offsetWidth, height: refs.el!.offsetHeight}}
|
|
164
|
+
onEntered={handler.onTransitionEnd}
|
|
165
|
+
onExited={handler.onTransitionEnd}>
|
|
166
|
+
<div className="pl-contextmenu-service-body" style={bodyStyles.value}>
|
|
167
|
+
{content}
|
|
168
|
+
</div>
|
|
169
|
+
</PlTransition>
|
|
170
|
+
</div>
|
|
171
|
+
</Portal>
|
|
170
172
|
)
|
|
171
173
|
}
|
|
172
174
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {createDefaultService} from "../PlRoot/createDefaultService";
|
|
2
|
-
import {reactive, onMounted, ref, useStyles, computed, onBeforeUnmount} from "plain-design-composition";
|
|
2
|
+
import {reactive, onMounted, ref, useStyles, computed, onBeforeUnmount, nextIndex} from "plain-design-composition";
|
|
3
3
|
import PlTransition from "../PlTransition";
|
|
4
4
|
import React from "react";
|
|
5
5
|
import {PlImage} from "../PlImage";
|
|
@@ -37,7 +37,8 @@ const Service = createDefaultService({
|
|
|
37
37
|
left: null as null | number, // 当前图片拖拽left距离
|
|
38
38
|
rotate: null as null | number, // 当前图片旋转距离
|
|
39
39
|
},
|
|
40
|
-
mounted: new Promise<void>(resolve => onMounted(resolve))
|
|
40
|
+
mounted: new Promise<void>(resolve => onMounted(resolve)),
|
|
41
|
+
zIndex: nextIndex(),
|
|
41
42
|
})
|
|
42
43
|
|
|
43
44
|
const imgStyles = useStyles(style => {
|
|
@@ -65,6 +66,7 @@ const Service = createDefaultService({
|
|
|
65
66
|
state.count = nextCount()
|
|
66
67
|
await state.mounted
|
|
67
68
|
isShow.value = true
|
|
69
|
+
state.zIndex = nextIndex()
|
|
68
70
|
|
|
69
71
|
setTimeout(() => {
|
|
70
72
|
const activeElement = document.activeElement as HTMLElement
|
|
@@ -212,7 +214,7 @@ const Service = createDefaultService({
|
|
|
212
214
|
},
|
|
213
215
|
render: () => (
|
|
214
216
|
createPortal(<PlTransition name="pl-image-preview" show={isShow.value}>
|
|
215
|
-
<div className="pl-image-preview-service" onClick={handler.onClickMask}>
|
|
217
|
+
<div className="pl-image-preview-service" style={{zIndex: state.zIndex}} onClick={handler.onClickMask}>
|
|
216
218
|
<div className="pl-image-preview-service-img-wrapper">
|
|
217
219
|
<PlTransition switch name={'pl-transition-scale'} key={state.count}>
|
|
218
220
|
{/*不加这个div，switch动画没有效果，真是奇怪。PlButton可以，PlCard可以，就PlImage不行*/}
|
|
@@ -60,8 +60,8 @@
|
|
|
60
60
|
{
|
|
61
61
|
"name": "PlCascadePanel",
|
|
62
62
|
"codes": [
|
|
63
|
-
"@include theme {\r\n
|
|
64
|
-
"@include theme {\r\n
|
|
63
|
+
"@include theme {\r\n .pl-cascade-panel {\r\n display: inline-block;\r\n height: 200px;\r\n border: solid 1px $ibc;\r\n border-radius: $popperRadius;\r\n color: $itc;\r\n\r\n & > .pl-list {\r\n height: 100%;\r\n overflow: hidden;\r\n white-space: nowrap;\r\n }\r\n\r\n .pl-cascade-list {\r\n width: 180px;\r\n height: 100%;\r\n padding: 6px 0;\r\n font-size: 14px;\r\n display: inline-block;\r\n vertical-align: top;\r\n overflow: hidden;\r\n box-sizing: border-box;\r\n\r\n &:not(:last-child) {\r\n border-right: solid 1px $ibc;\r\n }\r\n\r\n .pl-list {\r\n overflow: hidden;\r\n }\r\n\r\n .pl-cascade-item {\r\n padding: 5px 0 5px 12px;\r\n font-weight: 400;\r\n font-size: 13px;\r\n color: $itc;\r\n background-color: white;\r\n transition: all 300ms $transition;\r\n cursor: pointer;\r\n\r\n .pl-cascade-content {\r\n padding-right: 30px;\r\n position: relative;\r\n\r\n .pl-cascade-arrow {\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n right: 0;\r\n width: 30px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: $icc;\r\n }\r\n }\r\n\r\n &.pl-cascade-item-expand, &:hover {\r\n color: $ihc;\r\n background-color: $disabled;\r\n }\r\n\r\n &.pl-cascade-item-active {\r\n color: $colorPrimary;\r\n background-color: rgba($colorPrimary, 0.1);\r\n }\r\n\r\n &.pl-cascade-empty {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n\r\n padding-left: 0;\r\n font-size: 12px;\r\n color: $disabledText;\r\n background-color: transparent;\r\n cursor: auto;\r\n\r\n .pl-icon {\r\n margin-bottom: 8px;\r\n font-size: 20px;\r\n }\r\n }\r\n\r\n &.pl-cascade-item-disabled {\r\n background-color: transparent;\r\n color: $disabledText;\r\n cursor: not-allowed;\r\n }\r\n }\r\n\r\n &.pl-cascade-filter-list {\r\n width: 360px;\r\n }\r\n }\r\n\r\n .pl-loading-mask {\r\n top: 1px;\r\n bottom: 1px;\r\n left: 1px;\r\n right: 1px;\r\n }\r\n }\r\n}",
|
|
64
|
+
"@include theme {\r\n [service-name=pl-popper-service-cascade] {\r\n .pl-popper-content-inner {\r\n padding: 0 !important;\r\n }\r\n\r\n .pl-cascade-panel {\r\n border: none !important;\r\n }\r\n }\r\n}"
|
|
65
65
|
],
|
|
66
66
|
"seq": 18
|
|
67
67
|
},
|
|
@@ -370,11 +370,11 @@
|
|
|
370
370
|
"name": "PlTabs",
|
|
371
371
|
"codes": [
|
|
372
372
|
"@include theme {\r\n .pl-tabs {\r\n .pl-tabs-collector {\r\n height: 0;\r\n width: 0;\r\n overflow: hidden;\r\n display: block;\r\n }\r\n\r\n .pl-tabs-header-item {\r\n cursor: pointer;\r\n user-select: none;\r\n\r\n .pl-icon {\r\n margin-left: 8px;\r\n }\r\n\r\n &:not(.pl-tabs-header-item-active) {\r\n .pl-icon {\r\n color: $icc;\r\n }\r\n }\r\n }\r\n\r\n .pl-tabs-header-item-operator {\r\n flex-grow: 1;\r\n flex-shrink: 0;\r\n position: sticky;\r\n right: 4px;\r\n height: 45px;\r\n line-height: 45px;\r\n padding-left: 16px;\r\n justify-self: flex-end;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: flex-end;\r\n background-color: white;\r\n\r\n & > * + * {\r\n margin-left: 4px;\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
373
|
-
"@include theme {\r\n .pl-tabs
|
|
373
|
+
"@include theme {\r\n .pl-tabs.pl-tabs-head-type-shadow {\r\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .12), 0 0 6px 0 rgba(0, 0, 0, .04);\r\n border: solid 1px $ibl;\r\n box-sizing: border-box;\r\n\r\n & + * {\r\n margin-top: 16px;\r\n }\r\n\r\n .pl-tabs-header.pl-tabs-header-horizontal.pl-tabs-header-type-shadow {\r\n background-color: $disabled;\r\n\r\n .pl-tabs-header-item {\r\n line-height: 45px;\r\n padding: 0 20px;\r\n color: $itl;\r\n box-sizing: border-box;\r\n transition: all linear 300ms;\r\n border-left: solid 1px transparent;\r\n border-right: solid 1px transparent;\r\n\r\n &:first-child {\r\n border-left: none;\r\n }\r\n\r\n &:hover, &.pl-tabs-header-item-active {\r\n color: $colorPrimary;\r\n }\r\n\r\n &:before {\r\n position: absolute;\r\n background-color: transparent;\r\n left: 0;\r\n right: 0;\r\n height: 1px;\r\n content: '';\r\n transition: all linear 300ms;\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n position: relative;\r\n background-color: white;\r\n border-color: $ibl;\r\n\r\n &:before {\r\n background-color: white;\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-top {\r\n .pl-tabs-header-list {\r\n border-bottom: solid 1px $ibl;\r\n\r\n .pl-tabs-header-item-active:before {\r\n top: 100%\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-bottom {\r\n .pl-tabs-header-list {\r\n border-top: solid 1px $ibl;\r\n\r\n .pl-tabs-header-item-active:before {\r\n bottom: 100%\r\n }\r\n }\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
374
374
|
"@include theme {\r\n .pl-tabs-header-horizontal {\r\n overflow: hidden;\r\n position: relative;\r\n\r\n .pl-tabs-header-list {\r\n display: inline-flex;\r\n align-items: center;\r\n white-space: nowrap;\r\n min-width: 100%;\r\n position: relative;\r\n transition: 300ms $transitionFlexible left;\r\n }\r\n\r\n .pl-tabs-header-item {\r\n display: inline-block;\r\n font-size: 14px;\r\n }\r\n\r\n &.pl-tabs-header-show-more {\r\n padding-right: 80px;\r\n\r\n .pl-tabs-header-more-button {\r\n z-index: 1;\r\n position: absolute;\r\n background-color: rgba(white, 0.9);\r\n right: 0;\r\n top: 0;\r\n bottom: 0;\r\n width: 80px;\r\n box-shadow: 0 2px 8px #ccc;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: $ihc;\r\n }\r\n }\r\n }\r\n\r\n .pl-tabs-head-position-top, .pl-tabs-head-position-bottom {\r\n &.pl-tabs-fit-height {\r\n display: flex;\r\n flex-direction: column;\r\n height: 100%;\r\n flex: 1;\r\n\r\n & > .pl-tabs-body {\r\n flex: 1;\r\n overflow: hidden;\r\n display: flex;\r\n align-items: stretch;\r\n\r\n & > .pl-inner-tab {\r\n flex: 1;\r\n overflow: auto;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
375
|
-
"@include theme {\r\n .pl-tabs {\r\n &.pl-tabs-head-position-left, &.pl-tabs-head-position-right {\r\n display: flex;\r\n\r\n .pl-tabs-body {\r\n flex: 1;\r\n box-sizing: border-box;\r\n }\r\n\r\n .pl-tabs-header {\r\n position: relative;\r\n\r\n .pl-tabs-header-item {\r\n line-height: 36px;\r\n padding: 0 16px;\r\n position: relative;\r\n z-index: 1;\r\n transition: all linear 150ms;\r\n white-space: nowrap;\r\n\r\n &:hover {\r\n color: $colorPrimary;\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n color: $colorPrimary;\r\n background-color: $colorPrimaryLight;\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-left {\r\n\r\n &:before {\r\n position: absolute;\r\n content: '';\r\n right: 0;\r\n width: 2px;\r\n top: 0;\r\n bottom: 0;\r\n background-color: $ibl;\r\n }\r\n\r\n .pl-tabs-header-item {\r\n text-align: right;\r\n border-right: solid 2px transparent;\r\n\r\n &:hover {\r\n border-right-color: rgba($colorPrimary, 0.5);\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n border-right-color: $colorPrimary;\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-right {\r\n &:before {\r\n position: absolute;\r\n content: '';\r\n left: 0;\r\n width: 2px;\r\n top: 0;\r\n bottom: 0;\r\n background-color: $ibl;\r\n }\r\n\r\n .pl-tabs-header-item {\r\n text-align: left;\r\n border-left: solid 2px transparent;\r\n\r\n &:hover {\r\n border-left-color: rgba($colorPrimary, 0.5);\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n border-left-color: $colorPrimary;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-fit-height {\r\n height: 100%;\r\n flex: 1;\r\n align-items: stretch;\r\n\r\n & > .pl-tabs-header {\r\n overflow: auto;\r\n }\r\n\r\n & > .pl-tabs-body {\r\n overflow: hidden;\r\n display: flex;\r\n align-items: stretch;\r\n\r\n & > .pl-inner-tab {\r\n flex: 1;\r\n overflow: auto;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-head-position-left {\r\n .pl-tabs-body {\r\n padding-left: 16px;\r\n }\r\n }\r\n\r\n &.pl-tabs-head-position-right {\r\n .pl-tabs-body {\r\n padding-right: 16px;\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
376
375
|
"@include theme {\r\n .pl-tabs-header.pl-tabs-header-horizontal.pl-tabs-header-type-card {\r\n .pl-tabs-header-item {\r\n line-height: 45px;\r\n padding: 0 20px;\r\n border-left: solid 1px $ibc;\r\n\r\n &:last-child {\r\n border-right: solid 1px $ibc;\r\n }\r\n\r\n &:hover, &.pl-tabs-header-item-active {\r\n color: $colorPrimary;\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-top {\r\n .pl-tabs-header-list {\r\n border-bottom: solid 1px $ibc;\r\n\r\n .pl-tabs-header-item {\r\n border-top: solid 1px $ibc;\r\n\r\n &:first-child {\r\n border-top-left-radius: $shapeFillet;\r\n }\r\n\r\n &:last-child {\r\n border-top-right-radius: $shapeFillet;\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n position: relative;\r\n\r\n &:before {\r\n position: absolute;\r\n background-color: white;\r\n left: 0;\r\n right: 0;\r\n top: 100%;\r\n height: 1px;\r\n content: '';\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-bottom {\r\n .pl-tabs-header-list {\r\n border-top: solid 1px $ibc;\r\n\r\n .pl-tabs-header-item {\r\n border-bottom: solid 1px $ibc;\r\n\r\n &:first-child {\r\n border-bottom-left-radius: $shapeFillet;\r\n }\r\n\r\n &:last-child {\r\n border-bottom-right-radius: $shapeFillet;\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n position: relative;\r\n\r\n &:before {\r\n position: absolute;\r\n background-color: white;\r\n left: 0;\r\n right: 0;\r\n bottom: 100%;\r\n height: 1px;\r\n content: '';\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n}",
|
|
377
|
-
"@include theme {\r\n .pl-tabs.pl-tabs-
|
|
376
|
+
"@include theme {\r\n .pl-tabs-header.pl-tabs-header-horizontal.pl-tabs-header-type-text {\r\n\r\n .pl-tabs-header-item {\r\n line-height: 45px;\r\n\r\n & + .pl-tabs-header-item {\r\n margin-left: 32px;\r\n }\r\n\r\n &.pl-tabs-header-item-active, &:hover {\r\n color: $colorPrimary;\r\n }\r\n }\r\n\r\n .pl-tabs-header-list {\r\n position: relative;\r\n\r\n .pl-tabs-header-horizontal-text-indicator-container {\r\n background-color: $disabled;\r\n position: absolute;\r\n left: 0;\r\n right: 0;\r\n height: 2px;\r\n\r\n .pl-tabs-header-horizontal-text-indicator {\r\n position: absolute;\r\n width: 0;\r\n left: 0;\r\n height: 100%;\r\n background-color: $colorPrimary;\r\n display: block;\r\n transition: $transition 150ms all;\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-top {\r\n .pl-tabs-header-horizontal-text-indicator-container {\r\n bottom: 0;\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-bottom {\r\n .pl-tabs-header-horizontal-text-indicator-container {\r\n top: 0;\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
377
|
+
"@include theme {\r\n .pl-tabs {\r\n &.pl-tabs-head-position-left, &.pl-tabs-head-position-right {\r\n display: flex;\r\n\r\n .pl-tabs-body {\r\n flex: 1;\r\n box-sizing: border-box;\r\n }\r\n\r\n .pl-tabs-header {\r\n position: relative;\r\n\r\n .pl-tabs-header-item {\r\n line-height: 36px;\r\n padding: 0 16px;\r\n position: relative;\r\n z-index: 1;\r\n transition: all linear 150ms;\r\n white-space: nowrap;\r\n\r\n &:hover {\r\n color: $colorPrimary;\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n color: $colorPrimary;\r\n background-color: $colorPrimaryLight;\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-left {\r\n\r\n &:before {\r\n position: absolute;\r\n content: '';\r\n right: 0;\r\n width: 2px;\r\n top: 0;\r\n bottom: 0;\r\n background-color: $ibl;\r\n }\r\n\r\n .pl-tabs-header-item {\r\n text-align: right;\r\n border-right: solid 2px transparent;\r\n\r\n &:hover {\r\n border-right-color: rgba($colorPrimary, 0.5);\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n border-right-color: $colorPrimary;\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-right {\r\n &:before {\r\n position: absolute;\r\n content: '';\r\n left: 0;\r\n width: 2px;\r\n top: 0;\r\n bottom: 0;\r\n background-color: $ibl;\r\n }\r\n\r\n .pl-tabs-header-item {\r\n text-align: left;\r\n border-left: solid 2px transparent;\r\n\r\n &:hover {\r\n border-left-color: rgba($colorPrimary, 0.5);\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n border-left-color: $colorPrimary;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-fit-height {\r\n height: 100%;\r\n flex: 1;\r\n align-items: stretch;\r\n\r\n & > .pl-tabs-header {\r\n overflow: auto;\r\n }\r\n\r\n & > .pl-tabs-body {\r\n overflow: hidden;\r\n display: flex;\r\n align-items: stretch;\r\n\r\n & > .pl-inner-tab {\r\n flex: 1;\r\n overflow: auto;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-head-position-left {\r\n .pl-tabs-body {\r\n padding-left: 16px;\r\n }\r\n }\r\n\r\n &.pl-tabs-head-position-right {\r\n .pl-tabs-body {\r\n padding-right: 16px;\r\n }\r\n }\r\n }\r\n}\r\n"
|
|
378
378
|
],
|
|
379
379
|
"seq": 80
|
|
380
380
|
},
|
|
@@ -423,13 +423,13 @@
|
|
|
423
423
|
{
|
|
424
424
|
"name": "createUseTableOption",
|
|
425
425
|
"codes": [
|
|
426
|
-
".pl-table-pro-setting-config {\r\n .pl-table-pro-setting-config-button {\r\n margin-bottom: 16px;\r\n\r\n & > * {\r\n margin-right: 8px;\r\n }\r\n }\r\n}\r\n",
|
|
427
426
|
"@include theme {\r\n .pro-column-filter-container {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\r\n width: 360px;\r\n padding: 0 12px;\r\n\r\n & > div {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin: 4px 0;\r\n\r\n & > .pl-filter {\r\n width: 100%;\r\n display: flex;\r\n }\r\n\r\n .pl-button-group {\r\n width: 100%;\r\n display: flex;\r\n\r\n .pl-button:not(.pl-button-icon-only) {\r\n flex: 1;\r\n }\r\n }\r\n\r\n & > .pl-button {\r\n flex: 1;\r\n\r\n &:first-child {\r\n margin-right: 2px;\r\n }\r\n\r\n &:last-child {\r\n margin-left: 2px;\r\n }\r\n }\r\n }\r\n\r\n .pro-column-filter-sort-container {\r\n background-color: $ibl;\r\n height: plv(sizeNormal);\r\n border-radius: 100px;\r\n width: 100%;\r\n display: flex;\r\n align-items: stretch;\r\n box-sizing: border-box;\r\n padding: 2px;\r\n\r\n & > div {\r\n flex: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: relative;\r\n border-radius: 100px;\r\n cursor: pointer;\r\n background-color: $ibl;\r\n transition: background-color 300ms linear;\r\n\r\n &:hover {\r\n background-color: #fcfcfc;\r\n }\r\n\r\n &.pro-column-filter-sort-item-active {\r\n background-color: white;\r\n box-shadow: 0 2px 8px #ddd;\r\n color: $colorPrimary;\r\n }\r\n\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
428
|
-
"@include theme {\r\n .pl-table-pro-distinct-filter-item {\r\n display: flex;\r\n align-items: stretch;\r\n line-height: 28px;\r\n\r\n padding: 8px 0;\r\n\r\n background-color: white;\r\n transition: background-color 300ms linear;\r\n\r\n &:not(:last-child) {\r\n border-bottom: solid 1px $ibl;\r\n }\r\n\r\n &:hover {\r\n background-color: #f6f6f6;\r\n }\r\n\r\n .pl-table-pro-distinct-filter-item-title {\r\n color: $colorPrimary;\r\n margin: 0 8px;\r\n }\r\n\r\n .pl-table-pro-distinct-filter-item-tags {\r\n\r\n cursor: pointer;\r\n\r\n & > div {\r\n display: inline-block;\r\n font-size: 12px;\r\n background-color: $colorPrimaryLight;\r\n padding: 0 12px;\r\n margin: 1px 2px;\r\n border-radius: 4px;\r\n }\r\n }\r\n\r\n .pl-table-pro-distinct-filter-item-button {\r\n\r\n }\r\n }\r\n}\r\n",
|
|
429
427
|
"@include theme {\r\n .pl-table-pro-setting-export {\r\n .pl-table-pro-setting-export-option {\r\n padding: 12px 12px 12px 50px;\r\n transition: background-color linear 300ms;\r\n position: relative;\r\n\r\n &:hover {\r\n background-color: $colorPrimaryLight;\r\n cursor: pointer;\r\n }\r\n\r\n &:not(:first-child) {\r\n border-top: solid 1px $ibl;\r\n }\r\n\r\n .pl-table-pro-setting-export-option-radio {\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n left: 0;\r\n width: 50px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n .pl-table-pro-setting-export-option-title {\r\n font-size: 16px;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .pl-table-pro-setting-export-option-desc {\r\n font-size: 12px;\r\n color: $icc;\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-export-foot {\r\n text-align: center;\r\n margin-top: 20px;\r\n\r\n .pl-button + .pl-button {\r\n margin-left: 8px;\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-export-loading {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n\r\n .pl-loading, .pl-icon {\r\n font-size: 32px;\r\n }\r\n\r\n & > span {\r\n color: $icc;\r\n }\r\n\r\n & > * {\r\n margin-bottom: 24px;\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
428
|
+
".pl-table-pro-setting-config {\r\n .pl-table-pro-setting-config-button {\r\n margin-bottom: 16px;\r\n\r\n & > * {\r\n margin-right: 8px;\r\n }\r\n }\r\n}\r\n",
|
|
429
|
+
"@include theme {\r\n .pl-table-pro-distinct-filter-item {\r\n display: flex;\r\n align-items: stretch;\r\n line-height: 28px;\r\n\r\n padding: 8px 0;\r\n\r\n background-color: white;\r\n transition: background-color 300ms linear;\r\n\r\n &:not(:last-child) {\r\n border-bottom: solid 1px $ibl;\r\n }\r\n\r\n &:hover {\r\n background-color: #f6f6f6;\r\n }\r\n\r\n .pl-table-pro-distinct-filter-item-title {\r\n color: $colorPrimary;\r\n margin: 0 8px;\r\n }\r\n\r\n .pl-table-pro-distinct-filter-item-tags {\r\n\r\n cursor: pointer;\r\n\r\n & > div {\r\n display: inline-block;\r\n font-size: 12px;\r\n background-color: $colorPrimaryLight;\r\n padding: 0 12px;\r\n margin: 1px 2px;\r\n border-radius: 4px;\r\n }\r\n }\r\n\r\n .pl-table-pro-distinct-filter-item-button {\r\n\r\n }\r\n }\r\n}\r\n",
|
|
430
430
|
"@include theme {\r\n .pl-table-pro-setting-all-filter {\r\n\r\n background-color: #fafafa;\r\n min-height: 100%;\r\n width: 100%;\r\n display: inline-block;\r\n box-sizing: border-box;\r\n padding: 16px;\r\n\r\n & > * {\r\n margin-bottom: 16px;\r\n\r\n &:first-child {\r\n text-align: right;\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-all-filter-item {\r\n background-color: white;\r\n box-sizing: border-box;\r\n border-radius: 2px;\r\n box-shadow: 1px 1px 8px 1px #e2e3e4;\r\n\r\n .pl-table-pro-setting-all-filter-item-head {\r\n font-size: 16px;\r\n font-weight: 600;\r\n border-bottom: solid 1px $ibl;\r\n padding: 16px;\r\n display: flex;\r\n justify-content: space-between;\r\n }\r\n\r\n .pl-table-pro-setting-all-filter-item-body {\r\n padding: 16px;\r\n }\r\n }\r\n }\r\n\r\n}\r\n",
|
|
431
|
-
".pl-table-pro-setting-
|
|
432
|
-
"
|
|
431
|
+
"@include theme {\r\n .pl-table-pro-setting {\r\n height: 100%;\r\n display: flex;\r\n align-items: stretch;\r\n\r\n $nav-bg: #fcfcfc;\r\n\r\n .pl-table-pro-setting-nav {\r\n background-color: $nav-bg;\r\n display: flex;\r\n flex-direction: column;\r\n\r\n .pl-table-pro-setting-nav-item:last-child {\r\n flex: 1;\r\n }\r\n\r\n .pl-table-pro-setting-nav-item {\r\n padding: 12px 24px;\r\n cursor: pointer;\r\n background-color: white;\r\n position: relative;\r\n\r\n .pl-table-pro-setting-nav-item-inner {\r\n position: relative;\r\n z-index: 1;\r\n }\r\n\r\n &:hover, &.pl-table-pro-setting-nav-item-active {\r\n color: $colorPrimary;\r\n }\r\n\r\n &.pl-table-pro-setting-nav-item-active {\r\n &:after {\r\n position: absolute;\r\n content: '';\r\n top: 0;\r\n bottom: 0;\r\n left: 0;\r\n width: 2px;\r\n background-color: $colorPrimary;\r\n }\r\n }\r\n\r\n &.pl-table-pro-setting-nav-item-prev {\r\n &:before {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n border-bottom-right-radius: 4px;\r\n background-color: $nav-bg;\r\n content: '';\r\n border-bottom: solid 1px $ibl;\r\n border-right: solid 1px $ibl;\r\n }\r\n }\r\n\r\n &.pl-table-pro-setting-nav-item-next {\r\n &:before {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n border-top-right-radius: 4px;\r\n background-color: $nav-bg;\r\n content: '';\r\n border-top: solid 1px $ibl;\r\n border-right: solid 1px $ibl;\r\n }\r\n }\r\n\r\n &:not(.pl-table-pro-setting-nav-item-prev):not(.pl-table-pro-setting-nav-item-next):not(.pl-table-pro-setting-nav-item-active) {\r\n background-color: $nav-bg;\r\n border-right: solid 1px $ibl;\r\n }\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-content {\r\n flex: 1;\r\n overflow-y: scroll;\r\n overflow-x: hidden;\r\n width: 650px;\r\n box-sizing: border-box;\r\n\r\n &.pl-table-pro-setting-content-pending {\r\n padding: 16px;\r\n }\r\n\r\n &::-webkit-scrollbar {\r\n background: white;\r\n width: 6px;\r\n height: 6px;\r\n }\r\n\r\n &::-webkit-scrollbar-thumb {\r\n background: rgba(black, 0.25);\r\n border-radius: 6px;\r\n }\r\n\r\n .pl-table-pro-setting-content-header {\r\n text-align: right;\r\n\r\n & > .pl-button + .pl-button {\r\n margin-left: 8px;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
432
|
+
".pl-table-pro-setting-senior-filter {\r\n .pl-table-pro-setting-senior-filter-button {\r\n display: flex;\r\n justify-content: space-between;\r\n\r\n .pl-button + * {\r\n margin-left: 8px;\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-senior-filter-item {\r\n margin-bottom: 16px;\r\n\r\n .pl-table-pro-setting-senior-filter-item-id {\r\n width: 80px;\r\n display: inline-block;\r\n text-align: center;\r\n }\r\n\r\n .pl-table-pro-setting-senior-filter-item-content {\r\n width: calc(100% - 80px);\r\n display: inline-block;\r\n }\r\n }\r\n}\r\n"
|
|
433
433
|
],
|
|
434
434
|
"seq": 92
|
|
435
435
|
},
|