plain-design 0.0.93 → 0.0.96
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 +2 -2
- package/package.json +5 -5
- package/src/index.ts +2 -0
- package/src/packages/PlTable/plc/format/usePlcList.tsx +1 -0
- package/src/packages/PlTable/table/use/useTableHooks.tsx +1 -1
- package/src/packages/PlcImage/index.tsx +7 -2
- package/src/packages/createUseTableOption/use/use.hooks.tsx +1 -61
- package/src/styles/data/scan.scss.json +7 -7
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "plain-design",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.96",
|
|
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.122",
|
|
25
25
|
"react": "^17.0.1",
|
|
26
26
|
"react-dom": "^17.0.1"
|
|
27
27
|
},
|
|
@@ -65,12 +65,12 @@
|
|
|
65
65
|
"fork-ts-checker-webpack-plugin": "^6.2.4",
|
|
66
66
|
"mini-css-extract-plugin": "^1.6.2",
|
|
67
67
|
"mockjs": "^1.1.0",
|
|
68
|
-
"plain-design-composition": "^0.0.
|
|
68
|
+
"plain-design-composition": "^0.0.122",
|
|
69
69
|
"postcss": "^8.2.13",
|
|
70
70
|
"postcss-loader": "^4.2.0",
|
|
71
71
|
"qs": "^6.10.1",
|
|
72
|
-
"react": "^
|
|
73
|
-
"react-dom": "^
|
|
72
|
+
"react": "^17.0.2",
|
|
73
|
+
"react-dom": "^17.0.2",
|
|
74
74
|
"sass": "~1.26.5",
|
|
75
75
|
"sass-loader": "^10.1.1",
|
|
76
76
|
"style-loader": "^2.0.0",
|
package/src/index.ts
CHANGED
|
@@ -98,6 +98,7 @@ import createPlcPropOptions from './packages/createPlcPropOptions'
|
|
|
98
98
|
import PlcEmitsOptions from './packages/PlcEmitsOptions'
|
|
99
99
|
import PlcScopeSlotsOptions from './packages/PlcScopeSlotsOptions'
|
|
100
100
|
import useExternalPlc from './packages/useExternalPlc'
|
|
101
|
+
import {KeyboardService} from "./packages/keyboard";
|
|
101
102
|
|
|
102
103
|
import PlcCheck from './packages/PlcCheck'
|
|
103
104
|
import PlcCheckbox from './packages/PlcCheckbox'
|
|
@@ -234,6 +235,7 @@ export {
|
|
|
234
235
|
useHttp,
|
|
235
236
|
useAddress,
|
|
236
237
|
useOv,
|
|
238
|
+
KeyboardService,
|
|
237
239
|
|
|
238
240
|
PlcCheck,
|
|
239
241
|
PlcCheckbox,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {TableNode} from "./useTableNode";
|
|
2
|
-
import {createHooks, createSyncHooks} from "
|
|
2
|
+
import {createHooks, createSyncHooks} from "plain-design-composition";
|
|
3
3
|
import React, {ReactNode} from "react";
|
|
4
4
|
import {PlainScroll} from "../../../PlScroll";
|
|
5
5
|
import {TableHoverPart} from "../utils/table.utils";
|
|
@@ -8,6 +8,7 @@ import PlImage from "../PlImage";
|
|
|
8
8
|
import {injectPlainTable} from "../PlTable";
|
|
9
9
|
import PlImageUploader from "../PlImageUploader";
|
|
10
10
|
import {$$image} from "../../index";
|
|
11
|
+
import {TableNode} from "../PlTable/table/use/useTableNode";
|
|
11
12
|
|
|
12
13
|
export const PlcImage = designComponent({
|
|
13
14
|
name: 'plc-image',
|
|
@@ -23,7 +24,10 @@ export const PlcImage = designComponent({
|
|
|
23
24
|
urlPrefix: {type: String, default: 'http://1.116.13.72'},
|
|
24
25
|
},
|
|
25
26
|
scopeSlots: PlcScopeSlotsOptions,
|
|
26
|
-
emits:
|
|
27
|
+
emits: {
|
|
28
|
+
...PlcEmitsOptions,
|
|
29
|
+
onUploadSuccess: (scope: { response: any, node: TableNode, row: any }) => true,
|
|
30
|
+
},
|
|
27
31
|
setup({props, slots, scopeSlots, event}) {
|
|
28
32
|
|
|
29
33
|
const table = injectPlainTable()
|
|
@@ -57,7 +61,7 @@ export const PlcImage = designComponent({
|
|
|
57
61
|
onClick={() => preview(node.index)}
|
|
58
62
|
/>
|
|
59
63
|
),
|
|
60
|
-
edit: ({row, plc}) => !plc.props.field ? null :
|
|
64
|
+
edit: ({row, plc, node}) => !plc.props.field ? null :
|
|
61
65
|
<PlImageUploader
|
|
62
66
|
urlPrefix={props.urlPrefix}
|
|
63
67
|
modelValue={row[plc.props.field]}
|
|
@@ -71,6 +75,7 @@ export const PlcImage = designComponent({
|
|
|
71
75
|
}}
|
|
72
76
|
onUploadSuccess={(resp: any) => {
|
|
73
77
|
row[props.imgKeyField!] = resp.data.id
|
|
78
|
+
event.emit.onUploadSuccess({response: resp, node: node, row})
|
|
74
79
|
}}
|
|
75
80
|
/>
|
|
76
81
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import {iQueryRequest, iTableSortData, PlainObject, tRequestConfig, tTableOptionConfig} from "../createUseTableOption.utils";
|
|
2
2
|
import {TableNode} from "../../PlTable/table/use/useTableNode";
|
|
3
3
|
import PlTable from "../../PlTable";
|
|
4
|
-
import {
|
|
4
|
+
import {createHooks, createSyncHooks} from "plain-design-composition";
|
|
5
5
|
import React, {ReactNode} from "react";
|
|
6
6
|
import {tPlcData} from "../../PlTable/plc/format/formatPlcList";
|
|
7
7
|
import {iFilterData} from "../../PlFilter/FilterConfig";
|
|
@@ -13,66 +13,6 @@ export interface iTableProRenderConfig {
|
|
|
13
13
|
render: () => ReactNode
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
-
export function createSyncHooks<Handler extends (arg: any) => any,
|
|
17
|
-
InnerHandler = (arg: Parameters<Handler>["0"]) => (void | Parameters<Handler>["0"]),
|
|
18
|
-
>(isReactive?: boolean) {
|
|
19
|
-
const state: { innerHandlers: InnerHandler[] } = isReactive ? reactive({
|
|
20
|
-
innerHandlers: [] as InnerHandler[],
|
|
21
|
-
}) : ({
|
|
22
|
-
innerHandlers: [] as InnerHandler[],
|
|
23
|
-
}) as any
|
|
24
|
-
const use = (handler: InnerHandler) => {
|
|
25
|
-
state.innerHandlers = [...state.innerHandlers, handler] as any
|
|
26
|
-
return () => eject(handler)
|
|
27
|
-
}
|
|
28
|
-
const eject = (handler: InnerHandler) => {
|
|
29
|
-
state.innerHandlers = state.innerHandlers.filter(i => i !== handler)
|
|
30
|
-
}
|
|
31
|
-
const exec = (arg: Parameters<Handler>["0"]): Parameters<Handler>["0"] => {
|
|
32
|
-
if (state.innerHandlers.length === 0) {return arg}
|
|
33
|
-
let index = 0
|
|
34
|
-
const innerHandlers = [...state.innerHandlers]
|
|
35
|
-
let innerHandler: InnerHandler | undefined = innerHandlers[index]
|
|
36
|
-
while (!!innerHandler) {
|
|
37
|
-
let newArg = (innerHandler as any)(arg);
|
|
38
|
-
if (newArg !== undefined) {arg = newArg}
|
|
39
|
-
index++
|
|
40
|
-
innerHandler = innerHandlers[index] as any
|
|
41
|
-
}
|
|
42
|
-
return arg
|
|
43
|
-
}
|
|
44
|
-
return {use, eject, exec, state, getListeners: () => [...state.innerHandlers]}
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
export function createHooks<Handler extends (arg: any) => any,
|
|
48
|
-
InnerHandler = (arg: Parameters<Handler>["0"]) => (void | Parameters<Handler>["0"] | Promise<void | Parameters<Handler>["0"]>),
|
|
49
|
-
>() {
|
|
50
|
-
const innerHandlers: InnerHandler[] = []
|
|
51
|
-
const use = (handler: InnerHandler) => {
|
|
52
|
-
innerHandlers.push(handler)
|
|
53
|
-
return () => eject(handler)
|
|
54
|
-
}
|
|
55
|
-
const eject = (handler: InnerHandler) => {
|
|
56
|
-
const index = innerHandlers.indexOf(handler)
|
|
57
|
-
if (index > -1) {
|
|
58
|
-
innerHandlers.splice(index, 1)
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
const exec = async (arg: Parameters<Handler>["0"]): Promise<Parameters<Handler>["0"]> => {
|
|
62
|
-
if (innerHandlers.length === 0) {return arg}
|
|
63
|
-
let index = 0
|
|
64
|
-
let innerHandler: InnerHandler | undefined = innerHandlers[index]
|
|
65
|
-
while (!!innerHandler) {
|
|
66
|
-
let newArg = await (innerHandler as any)(arg);
|
|
67
|
-
if (newArg !== undefined) {arg = newArg}
|
|
68
|
-
index++
|
|
69
|
-
innerHandler = innerHandlers[index]
|
|
70
|
-
}
|
|
71
|
-
return arg
|
|
72
|
-
}
|
|
73
|
-
return {use, eject, exec, getListeners: () => [...innerHandlers]}
|
|
74
|
-
}
|
|
75
|
-
|
|
76
16
|
export function useTableOptionHooks({config}: { config: tTableOptionConfig }) {
|
|
77
17
|
const hooks = {
|
|
78
18
|
/*点击行*/
|
|
@@ -98,9 +98,9 @@
|
|
|
98
98
|
"codes": [
|
|
99
99
|
"@include theme {\r\n\r\n .pl-color-button {\r\n border-radius: 2px;\r\n height: 24px;\r\n width: 24px;\r\n border: solid 1px $ibc;\r\n padding: 2px;\r\n box-sizing: border-box;\r\n display: inline-block;\r\n cursor: pointer;\r\n\r\n .pl-color-button-background {\r\n background-size: 7px 7px;\r\n border-radius: 2px;\r\n box-sizing: border-box;\r\n height: 100%;\r\n width: 100%;\r\n\r\n .pl-color-button-color {\r\n height: 100%;\r\n width: 100%;\r\n }\r\n }\r\n }\r\n\r\n .pl-color-picker {\r\n @include sizeMixin(input) {\r\n .pl-color-button {\r\n height: $value/2;\r\n width: $value/2;\r\n }\r\n }\r\n }\r\n}",
|
|
100
100
|
"@include theme {\r\n .pl-color-panel {\r\n display: inline-block;\r\n font-size: 0;\r\n padding: 8px 12px;\r\n\r\n & > div:first-child {\r\n white-space: nowrap;\r\n }\r\n\r\n .pl-color-hue-slider {\r\n margin-top: 8px;\r\n display: block;\r\n }\r\n\r\n .pl-color-alpha-slider {\r\n margin-left: 8px;\r\n }\r\n\r\n .pl-color-panel-input-group {\r\n margin-top: 8px;\r\n\r\n .pl-input {\r\n\r\n .pl-input-inner {\r\n text-align: center;\r\n border-top-right-radius: 0;\r\n border-bottom-right-radius: 0;\r\n border-right: none;\r\n }\r\n }\r\n\r\n .pl-button-group {\r\n & > .pl-button:first-child {\r\n border-top-left-radius: 0;\r\n border-bottom-left-radius: 0;\r\n border-left: none;\r\n }\r\n }\r\n }\r\n }\r\n}",
|
|
101
|
-
"@include theme {\r\n .pl-color-
|
|
101
|
+
"@include theme {\r\n .pl-color-alpha-slider {\r\n width: 10px;\r\n background-size: 10px 10px;\r\n position: relative;\r\n cursor: pointer;\r\n border-radius: 10px;\r\n display: inline-block;\r\n\r\n .pl-color-alpha-shadow, .pl-color-alpha-thumb {\r\n pointer-events: none;\r\n }\r\n\r\n .pl-color-alpha-shadow {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n border-radius: 10px;\r\n }\r\n\r\n .pl-color-alpha-thumb {\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 10px;\r\n border: solid 1px $colorInfo;\r\n display: inline-block;\r\n background-color: white;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n box-sizing: border-box;\r\n }\r\n }\r\n}",
|
|
102
102
|
"@include theme {\r\n .pl-color-sv-panel {\r\n position: relative;\r\n box-shadow: 0 0px 4px 0 rgba(0, 0, 0, 0.4);\r\n cursor: pointer;\r\n display: inline-block;\r\n\r\n &:before, &:after, & span {\r\n pointer-events: none;\r\n }\r\n\r\n &, &:before, &:after {\r\n border-radius: 2px;\r\n }\r\n\r\n &:before, &:after {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n content: '';\r\n }\r\n\r\n &:before {\r\n background: linear-gradient(to right, white, rgba(255, 255, 255, 0));\r\n }\r\n\r\n &:after {\r\n background: linear-gradient(to top, black, rgba(255, 255, 255, 0));\r\n }\r\n\r\n .pl-color-sv-thumb {\r\n display: inline-block;\r\n position: absolute;\r\n width: 1px;\r\n height: 1px;\r\n left: 0;\r\n top: 0;\r\n z-index: 1;\r\n\r\n &:after {\r\n display: inline-block;\r\n width: 10px;\r\n height: 10px;\r\n border: solid 1px #999;\r\n border-radius: 10px;\r\n position: absolute;\r\n top: -5px;\r\n left: -5px;\r\n content: '';\r\n box-sizing: border-box;\r\n background-color: white;\r\n }\r\n }\r\n }\r\n}",
|
|
103
|
-
"@include theme {\r\n .pl-color-
|
|
103
|
+
"@include theme {\r\n .pl-color-hue-slider {\r\n background: linear-gradient(90deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red);\r\n display: inline-block;\r\n height: 10px;\r\n position: relative;\r\n cursor: pointer;\r\n border-radius: 10px;\r\n\r\n .pl-color-hue-slider-thumb {\r\n display: inline-block;\r\n height: 100%;\r\n background-color: white;\r\n position: absolute;\r\n top: 0;\r\n border: solid 1px $colorInfo;\r\n box-sizing: border-box;\r\n border-radius: 100px;\r\n }\r\n }\r\n}"
|
|
104
104
|
],
|
|
105
105
|
"seq": 27
|
|
106
106
|
},
|
|
@@ -423,13 +423,13 @@
|
|
|
423
423
|
{
|
|
424
424
|
"name": "createUseTableOption",
|
|
425
425
|
"codes": [
|
|
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",
|
|
427
426
|
"@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",
|
|
427
|
+
"@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
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-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",
|
|
430
429
|
"@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",
|
|
431
|
-
"
|
|
432
|
-
"@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"
|
|
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
|
+
"@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
|
},
|
|
@@ -438,7 +438,7 @@
|
|
|
438
438
|
"codes": [
|
|
439
439
|
".pl-table-pro-pagination {\r\n padding: 16px 24px;\r\n\r\n .pl-pagination {\r\n justify-content: flex-end;\r\n }\r\n}\r\n\r\n.pl-table-pro-head {\r\n font-size: 14px;\r\n height: 56px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 0 24px;\r\n\r\n .pl-table-pro-title {\r\n .pl-icon {\r\n margin-right: 4px;\r\n }\r\n }\r\n\r\n .pl-table-pro-operation {\r\n min-width: 350px;\r\n text-align: right;\r\n\r\n & > .pl-button {\r\n margin-left: 4px;\r\n }\r\n }\r\n}\r\n\r\n.pl-table-pro-fill {\r\n height: 100%;\r\n flex: 1;\r\n display: flex;\r\n flex-direction: column;\r\n\r\n .pl-table-pro-base-table {\r\n flex: 1;\r\n overflow: hidden;\r\n }\r\n}\r\n"
|
|
440
440
|
],
|
|
441
|
-
"seq":
|
|
441
|
+
"seq": 115
|
|
442
442
|
},
|
|
443
443
|
{
|
|
444
444
|
"name": "PlFilter",
|