easybill-ui 1.1.3 → 1.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/CurdForm/index.ts +4 -4
- package/components/CurdForm/src/CurdForm.vue +176 -184
- package/components/CurdForm/src/components/index.ts +1 -1
- package/components/CurdForm/src/components/schema-form-autocomplete.vue +2 -2
- package/components/CurdForm/src/components/schema-form-cascader.vue +2 -2
- package/components/CurdForm/src/components/schema-form-checkbox.vue +1 -1
- package/components/CurdForm/src/components/schema-form-date-picker.vue +3 -3
- package/components/CurdForm/src/components/schema-form-input.vue +1 -1
- package/components/CurdForm/src/components/schema-form-time-picker.vue +3 -3
- package/components/CurdForm/src/types.ts +1 -5
- package/components/CurdTable/index.ts +3 -3
- package/components/CurdTable/src/CurdTable.vue +4 -8
- package/components/CurdTable/src/hooks/useColumnHook.ts +5 -1
- package/components/DetailInfo/src/DetailInfo.vue +4 -4
- package/components/DetailInfo/src/DetailInfoContent.vue +2 -2
- package/components/TableFilter/index.ts +3 -3
- package/components/TableFilter/src/TableFilter.vue +1 -3
- package/components/TableFilter/src/components/FilterTags.vue +1 -1
- package/components/TableFilter/src/components/FilterToggle.vue +1 -1
- package/components/TableFilter/src/components/containers/TagsSelect.vue +1 -3
- package/package.json +2 -2
- package/theme-chalk/curd-form.css +1 -1
- package/theme-chalk/index.css +1 -1
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { withInstall } from "../../utils"
|
|
1
|
+
import { withInstall, type SFCWithInstall } from "../../utils"
|
|
2
2
|
import FormItem from "./src/CurdFormItem.vue"
|
|
3
3
|
import Instance from "./src/index"
|
|
4
|
-
export const CurdForm = withInstall(Instance)
|
|
5
|
-
export const CurdFormItem = withInstall(FormItem)
|
|
6
|
-
export default CurdForm
|
|
4
|
+
export const CurdForm: SFCWithInstall<typeof Instance> = withInstall(Instance)
|
|
5
|
+
export const CurdFormItem: SFCWithInstall<typeof FormItem> = withInstall(FormItem)
|
|
6
|
+
export default CurdForm as SFCWithInstall<typeof Instance>
|
|
7
7
|
export * from "./src/directive"
|
|
8
8
|
export * from "./src/hooks"
|
|
9
9
|
export * from "./src/types"
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<el-form ref="schemaFormRef" :model="formModel" :rules="rules" v-bind="{ ...$attrs, ...getFormProps }" class="curd-form" :style="getFormStyle()" @submit.prevent>
|
|
3
3
|
<template v-for="formItem in schemaItems" :key="formItem.prop">
|
|
4
|
-
<el-form-item v-if="!$slots[formItem.prop + 'Item']" :label="formItem.label" :prop="formItem.prop" :label-width="formItem.labelWidth" :
|
|
4
|
+
<el-form-item v-if="!$slots[formItem.prop + 'Item']" :label="formItem.label" :prop="formItem.prop" :label-width="formItem.labelWidth" :class="getFormItemStyle(formItem)" v-bind="getFormItemProps(formItem)">
|
|
5
5
|
<slot :name="formItem.prop" :form-item="formItem" :form-model="formModel"></slot>
|
|
6
6
|
<FormItem v-if="!(formItem.prop && $slots[formItem.prop])" :form-item="formItem" :form-model="formModel" @change="onChange">
|
|
7
7
|
<template #prefix>
|
|
@@ -23,204 +23,196 @@
|
|
|
23
23
|
</el-form>
|
|
24
24
|
</template>
|
|
25
25
|
|
|
26
|
-
<script lang="ts">
|
|
26
|
+
<script lang="ts" setup>
|
|
27
27
|
import { ElForm, ElFormItem } from "element-plus"
|
|
28
|
-
import {
|
|
29
|
-
import components from "./components"
|
|
28
|
+
import { computed, getCurrentInstance, onMounted, provide, reactive, ref, triggerRef, watch, type PropType } from "vue"
|
|
30
29
|
import FormItem from "./FormItem.vue"
|
|
31
30
|
import type { CurdFormOptionItem, Fields, FormContext, FormItem as FormItemType, FormSchema } from "./types"
|
|
32
31
|
import { deepClone } from "./utils/common"
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
FormItem,
|
|
32
|
+
|
|
33
|
+
const props = defineProps({
|
|
34
|
+
formSchema: {
|
|
35
|
+
required: true,
|
|
36
|
+
type: Object as PropType<FormSchema>,
|
|
37
|
+
default: () => ({}),
|
|
40
38
|
},
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
required: true,
|
|
45
|
-
type: Object as PropType<FormSchema>,
|
|
46
|
-
default: () => ({}),
|
|
47
|
-
},
|
|
48
|
-
// 预置字段默认值
|
|
49
|
-
fields: {
|
|
50
|
-
type: Object as PropType<Fields>,
|
|
51
|
-
default: () => ({}),
|
|
52
|
-
},
|
|
53
|
-
modelValue: {
|
|
54
|
-
type: Object as PropType<Fields>,
|
|
55
|
-
default: undefined,
|
|
56
|
-
},
|
|
57
|
-
extendContext: {
|
|
58
|
-
type: Object as PropType<Partial<FormContext>>,
|
|
59
|
-
default: undefined,
|
|
60
|
-
},
|
|
39
|
+
fields: {
|
|
40
|
+
type: Object as PropType<Fields>,
|
|
41
|
+
default: () => ({}),
|
|
61
42
|
},
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
(val) => {
|
|
72
|
-
const value = deepClone(val)
|
|
73
|
-
for (let i in formModel) {
|
|
74
|
-
delete formModel[i]
|
|
75
|
-
}
|
|
76
|
-
Object.assign(formModel, value)
|
|
77
|
-
},
|
|
78
|
-
)
|
|
79
|
-
watch(
|
|
80
|
-
() => formModel,
|
|
81
|
-
(val) => {
|
|
82
|
-
emit("update:modelValue", val)
|
|
83
|
-
},
|
|
84
|
-
{ deep: true },
|
|
85
|
-
)
|
|
86
|
-
// 先从schema中读取默认值
|
|
87
|
-
const schemaValues = sFormSchema.value.formItem.reduce<Fields>((previousValue, currentValue) => {
|
|
88
|
-
currentValue.eventObject ??= {}
|
|
89
|
-
if (typeof currentValue.value !== "undefined" && currentValue.prop && (typeof formModel[currentValue.prop] == "undefined" || formModel[currentValue.prop] === "" || formModel[currentValue.prop] === null)) {
|
|
90
|
-
previousValue[currentValue.prop] = currentValue.value
|
|
91
|
-
}
|
|
92
|
-
return previousValue
|
|
93
|
-
}, {})
|
|
94
|
-
|
|
95
|
-
Object.assign(formModel, schemaValues)
|
|
96
|
-
// 如果有默认值,则覆盖
|
|
97
|
-
if (props.fields) Object.assign(formModel, props.fields)
|
|
98
|
-
// Object.assign(formModel, props.modelValue)
|
|
99
|
-
// props.modelValue && Object.assign(formModel, props.modelValue)
|
|
43
|
+
modelValue: {
|
|
44
|
+
type: Object as PropType<Fields>,
|
|
45
|
+
default: undefined,
|
|
46
|
+
},
|
|
47
|
+
extendContext: {
|
|
48
|
+
type: Object as PropType<Partial<FormContext>>,
|
|
49
|
+
default: undefined,
|
|
50
|
+
},
|
|
51
|
+
})
|
|
100
52
|
|
|
101
|
-
|
|
102
|
-
return sFormSchema.value.formItem.filter((item) => {
|
|
103
|
-
if (!item.hidden) {
|
|
104
|
-
return true
|
|
105
|
-
}
|
|
106
|
-
if (item.hidden instanceof Function) {
|
|
107
|
-
return !item.hidden(formModel)
|
|
108
|
-
}
|
|
109
|
-
return !item.hidden
|
|
110
|
-
})
|
|
111
|
-
})
|
|
112
|
-
// 异步设置默认数据
|
|
113
|
-
sFormSchema.value.formItem.forEach(async (item) => {
|
|
114
|
-
//
|
|
115
|
-
// 异步选项
|
|
116
|
-
if (item.asyncOptions && (item.autoload || typeof item.autoload == "undefined") && item.asyncOptions instanceof Function) {
|
|
117
|
-
item.loading = true
|
|
118
|
-
item.options = await item.asyncOptions(formModel, item, curdFormContext).finally(() => (item.loading = false))
|
|
119
|
-
if (!instance?.isUnmounted && item.eventObject?.optionLoaded) item.eventObject.optionLoaded(formModel, item, curdFormContext)
|
|
120
|
-
}
|
|
121
|
-
})
|
|
53
|
+
const emit = defineEmits(['update:modelValue', 'change'])
|
|
122
54
|
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
if (typeof sFormSchema.value.getRules == "function") {
|
|
129
|
-
return sFormSchema.value.getRules(formModel, curdFormContext)
|
|
130
|
-
}
|
|
131
|
-
return sFormSchema.value.rules
|
|
132
|
-
})
|
|
55
|
+
const schemaFormRef = ref<InstanceType<typeof ElForm> | undefined>()
|
|
56
|
+
const sFormSchema = ref(props.formSchema)
|
|
57
|
+
let formModel = reactive<Fields>(props.modelValue || {})
|
|
58
|
+
const curdFormContext = reactive<FormContext>({} as FormContext)
|
|
59
|
+
const instance = getCurrentInstance()
|
|
133
60
|
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
const cur: FormItemType | undefined = sFormSchema.value.formItem.find((a) => a.prop == prop)
|
|
141
|
-
if (cur && cur.asyncOptions && !instance?.isUnmounted) {
|
|
142
|
-
cur.loading = true
|
|
143
|
-
triggerRef(schemaItems)
|
|
144
|
-
cur.options =
|
|
145
|
-
(await cur
|
|
146
|
-
.asyncOptions(formModel, cur, curdFormContext, option)
|
|
147
|
-
.catch((err) => console.error("loadOptionError", err))
|
|
148
|
-
.finally(() => (cur.loading = false))) || []
|
|
149
|
-
triggerRef(schemaItems)
|
|
150
|
-
if (!instance?.isUnmounted && cur.eventObject?.optionLoaded) cur.eventObject.optionLoaded(formModel, cur, curdFormContext, option)
|
|
151
|
-
}
|
|
152
|
-
return cur?.options || []
|
|
61
|
+
watch(
|
|
62
|
+
() => props.modelValue,
|
|
63
|
+
(val) => {
|
|
64
|
+
const value = deepClone(val)
|
|
65
|
+
for (let i in formModel) {
|
|
66
|
+
delete formModel[i]
|
|
153
67
|
}
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
68
|
+
Object.assign(formModel, value)
|
|
69
|
+
},
|
|
70
|
+
)
|
|
71
|
+
watch(
|
|
72
|
+
() => formModel,
|
|
73
|
+
(val) => {
|
|
74
|
+
emit("update:modelValue", val)
|
|
75
|
+
},
|
|
76
|
+
{ deep: true },
|
|
77
|
+
)
|
|
78
|
+
// 先从schema中读取默认值
|
|
79
|
+
const schemaValues = sFormSchema.value.formItem.reduce<Fields>((previousValue, currentValue) => {
|
|
80
|
+
currentValue.eventObject ??= {}
|
|
81
|
+
if (typeof currentValue.value !== "undefined" && currentValue.prop && (typeof formModel[currentValue.prop] == "undefined" || formModel[currentValue.prop] === "" || formModel[currentValue.prop] === null)) {
|
|
82
|
+
previousValue[currentValue.prop] = currentValue.value
|
|
83
|
+
}
|
|
84
|
+
return previousValue
|
|
85
|
+
}, {})
|
|
86
|
+
|
|
87
|
+
Object.assign(formModel, schemaValues)
|
|
88
|
+
// 如果有默认值,则覆盖
|
|
89
|
+
if (props.fields) Object.assign(formModel, props.fields)
|
|
90
|
+
// Object.assign(formModel, props.modelValue)
|
|
91
|
+
// props.modelValue && Object.assign(formModel, props.modelValue)
|
|
92
|
+
|
|
93
|
+
const schemaItems = computed(() => {
|
|
94
|
+
return sFormSchema.value.formItem.filter((item) => {
|
|
95
|
+
if (!item.hidden) {
|
|
96
|
+
return true
|
|
165
97
|
}
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
return { maxWidth: formItem.span && (100 * formItem.span) / 24 + "%", flex: typeof attrs.inline == "undefined" || typeof formItem.span != "undefined" ? "0 0 " + (100 * (formItem.span || 24)) / 24 + "%" : "", padding: "0 " + gutter + "px" }
|
|
98
|
+
if (item.hidden instanceof Function) {
|
|
99
|
+
return !item.hidden(formModel)
|
|
169
100
|
}
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
101
|
+
return !item.hidden
|
|
102
|
+
})
|
|
103
|
+
})
|
|
104
|
+
// 异步设置默认数据
|
|
105
|
+
sFormSchema.value.formItem.forEach(async (item) => {
|
|
106
|
+
//
|
|
107
|
+
// 异步选项
|
|
108
|
+
if (item.asyncOptions && (item.autoload || typeof item.autoload == "undefined") && item.asyncOptions instanceof Function) {
|
|
109
|
+
item.loading = true
|
|
110
|
+
item.options = await item.asyncOptions(formModel, item, curdFormContext).finally(() => (item.loading = false))
|
|
111
|
+
if (!instance?.isUnmounted && item.eventObject?.optionLoaded) item.eventObject.optionLoaded(formModel, item, curdFormContext)
|
|
112
|
+
}
|
|
113
|
+
})
|
|
114
|
+
|
|
115
|
+
// 生成表单验证规则
|
|
116
|
+
const rules = computed(() => {
|
|
117
|
+
if (typeof sFormSchema.value.rules == "function") {
|
|
118
|
+
return sFormSchema.value.rules(formModel, curdFormContext)
|
|
119
|
+
}
|
|
120
|
+
if (typeof sFormSchema.value.getRules == "function") {
|
|
121
|
+
return sFormSchema.value.getRules(formModel, curdFormContext)
|
|
122
|
+
}
|
|
123
|
+
return sFormSchema.value.rules
|
|
124
|
+
})
|
|
125
|
+
|
|
126
|
+
// 供外部使用
|
|
127
|
+
const validate = (callback: (valid: boolean) => void) => {
|
|
128
|
+
return schemaFormRef.value?.validate(callback)
|
|
129
|
+
}
|
|
130
|
+
// 调用某个表单项的异步数据接口
|
|
131
|
+
const loadOptions = async (prop: string, option?: unknown) => {
|
|
132
|
+
const cur: FormItemType | undefined = sFormSchema.value.formItem.find((a) => a.prop == prop)
|
|
133
|
+
if (cur && cur.asyncOptions && !instance?.isUnmounted) {
|
|
134
|
+
cur.loading = true
|
|
135
|
+
triggerRef(schemaItems)
|
|
136
|
+
cur.options =
|
|
137
|
+
(await cur
|
|
138
|
+
.asyncOptions(formModel, cur, curdFormContext, option)
|
|
139
|
+
.catch((err) => console.error("loadOptionError", err))
|
|
140
|
+
.finally(() => (cur.loading = false))) || []
|
|
141
|
+
triggerRef(schemaItems)
|
|
142
|
+
if (!instance?.isUnmounted && cur.eventObject?.optionLoaded) cur.eventObject.optionLoaded(formModel, cur, curdFormContext, option)
|
|
143
|
+
}
|
|
144
|
+
return cur?.options || []
|
|
145
|
+
}
|
|
146
|
+
// 给某个item赋值options
|
|
147
|
+
const setOptions = async (prop: string, options: CurdFormOptionItem[], option?: unknown) => {
|
|
148
|
+
const cur = sFormSchema.value.formItem.find((a) => a.prop == prop)
|
|
149
|
+
if (cur) {
|
|
150
|
+
cur.options = options
|
|
151
|
+
if (!instance?.isUnmounted && cur.eventObject?.optionLoaded) cur.eventObject.optionLoaded(formModel, cur, curdFormContext, option)
|
|
152
|
+
}
|
|
153
|
+
// return cur
|
|
154
|
+
}
|
|
155
|
+
const onChange = (formModel: Fields, formItem: FormItemType) => {
|
|
156
|
+
emit("change", formModel, formItem)
|
|
157
|
+
}
|
|
158
|
+
const getFormItemStyle = (formItem: FormItemType) => {
|
|
159
|
+
if (!formItem.span) return ""
|
|
160
|
+
return "el-form-item-" + formItem.span
|
|
161
|
+
}
|
|
162
|
+
const getFormItemProps = (formItem: FormItemType) => {
|
|
163
|
+
if (formItem.formItemProps) {
|
|
164
|
+
if (formItem.formItemProps instanceof Function) {
|
|
165
|
+
return formItem.formItemProps(formModel, formItem)
|
|
179
166
|
}
|
|
180
|
-
const
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
167
|
+
const { ...attrs } = formItem.formItemProps
|
|
168
|
+
return { ...attrs }
|
|
169
|
+
}
|
|
170
|
+
return {}
|
|
171
|
+
}
|
|
172
|
+
const getFormStyle = () => {
|
|
173
|
+
const gutter = props.formSchema.gutter
|
|
174
|
+
if (gutter) {
|
|
175
|
+
const guPx = +parseFloat(String(gutter))
|
|
176
|
+
return { marginLeft: -guPx + "px", marginRight: -guPx + "px" }
|
|
177
|
+
}
|
|
178
|
+
return {}
|
|
179
|
+
}
|
|
180
|
+
const getFormProps = computed(() => {
|
|
181
|
+
const args: Record<string, unknown> = {}
|
|
182
|
+
const sm = props.formSchema
|
|
183
|
+
for (const i in sm) {
|
|
184
|
+
if (!["formItem", "rules", "getRules"].includes(i)) {
|
|
185
|
+
args[i] = sm[i as keyof FormSchema]
|
|
187
186
|
}
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
for (const i in sm) {
|
|
192
|
-
if (!["formItem", "rules", "getRules"].includes(i)) {
|
|
193
|
-
args[i] = sm[i as keyof FormSchema]
|
|
194
|
-
}
|
|
195
|
-
}
|
|
196
|
-
return { ...args }
|
|
197
|
-
})
|
|
187
|
+
}
|
|
188
|
+
return { ...args }
|
|
189
|
+
})
|
|
198
190
|
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
191
|
+
curdFormContext.loadOptions = loadOptions
|
|
192
|
+
curdFormContext.setOptions = setOptions
|
|
193
|
+
curdFormContext.change = onChange
|
|
194
|
+
curdFormContext.formModel = formModel
|
|
203
195
|
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
196
|
+
if (props.extendContext) Object.assign(curdFormContext, props.extendContext)
|
|
197
|
+
|
|
198
|
+
provide("curdFormContext", curdFormContext)
|
|
199
|
+
onMounted(() => {
|
|
200
|
+
curdFormContext.formRef = schemaFormRef.value
|
|
201
|
+
})
|
|
202
|
+
|
|
203
|
+
defineExpose({
|
|
204
|
+
formModel,
|
|
205
|
+
schemaFormRef,
|
|
206
|
+
rules,
|
|
207
|
+
schemaItems,
|
|
208
|
+
sFormSchema,
|
|
209
|
+
getFormStyle,
|
|
210
|
+
getFormProps,
|
|
211
|
+
getFormItemStyle,
|
|
212
|
+
getFormItemProps,
|
|
213
|
+
validate,
|
|
214
|
+
loadOptions,
|
|
215
|
+
setOptions,
|
|
216
|
+
onChange,
|
|
225
217
|
})
|
|
226
218
|
</script>
|
|
@@ -37,7 +37,7 @@ export const getComponent = (type: string | VNode = "input") => {
|
|
|
37
37
|
// 预设组件
|
|
38
38
|
if (typeof type == "string" && preset.includes("schema-" + type)) {
|
|
39
39
|
return presetMap["schema-" + type]
|
|
40
|
-
} else if (isReactive(type) || isRef(type) || isVNode(type) || "setup" in type) {
|
|
40
|
+
} else if (isReactive(type) || isRef(type) || isVNode(type) || (typeof type == "object" && "setup" in type)) {
|
|
41
41
|
// 自定义组件
|
|
42
42
|
// return createVNode(type)
|
|
43
43
|
return type
|
|
@@ -8,8 +8,8 @@
|
|
|
8
8
|
</template>
|
|
9
9
|
<script lang="ts" setup>
|
|
10
10
|
import { FormItemProps } from "easybill-ui/components/CurdForm/src/types"
|
|
11
|
-
import { CascaderValue } from "element-plus"
|
|
12
|
-
import { computed, PropType } from "vue"
|
|
11
|
+
import { type CascaderValue } from "element-plus"
|
|
12
|
+
import { computed, type PropType } from "vue"
|
|
13
13
|
const props = defineProps({
|
|
14
14
|
...FormItemProps,
|
|
15
15
|
modelValue: {
|
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
<el-cascader v-model="model" :options="options" v-bind="props" v-on="eventObject"></el-cascader>
|
|
3
3
|
</template>
|
|
4
4
|
<script lang="ts" setup>
|
|
5
|
-
import { CascaderOption, CascaderValue, ElCascader } from "element-plus"
|
|
6
|
-
import { computed, PropType } from "vue"
|
|
5
|
+
import { type CascaderOption, type CascaderValue, ElCascader } from "element-plus"
|
|
6
|
+
import { computed, type PropType } from "vue"
|
|
7
7
|
import { FormItemProps } from "../types"
|
|
8
8
|
const props = defineProps({
|
|
9
9
|
...FormItemProps,
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
<script lang="ts">
|
|
21
21
|
import { Loading, Warning } from "@element-plus/icons-vue"
|
|
22
22
|
import { ElCheckbox, ElCheckboxButton, ElCheckboxGroup, ElIcon } from "element-plus"
|
|
23
|
-
import { computed, defineComponent, PropType, toRaw } from "vue"
|
|
23
|
+
import { computed, defineComponent, type PropType, toRaw } from "vue"
|
|
24
24
|
import { FormItemProps } from "../types"
|
|
25
25
|
export default defineComponent({
|
|
26
26
|
name: "SchemaFormCheckbox",
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<el-date-picker v-model="model" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" v-bind="props" :placeholder="(formItem.props && props.placeholder && String(props.placeholder)) || '请选择' + formItem.label" v-on="eventObject"> </el-date-picker>
|
|
2
|
+
<el-date-picker v-model="model" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" v-bind="props" :placeholder="(formItem.props && props.placeholder && String(props.placeholder)) as string || '请选择' + formItem.label" v-on="eventObject"> </el-date-picker>
|
|
3
3
|
</template>
|
|
4
4
|
<script lang="ts">
|
|
5
|
-
import { ElDatePicker, ModelValueType } from "element-plus"
|
|
6
|
-
import { computed, defineComponent, PropType } from "vue"
|
|
5
|
+
import { ElDatePicker, type ModelValueType } from "element-plus"
|
|
6
|
+
import { computed, defineComponent, type PropType } from "vue"
|
|
7
7
|
import { FormItemProps } from "../types"
|
|
8
8
|
export default defineComponent({
|
|
9
9
|
name: "SchemaFormDatePicker",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<el-input v-model="model" v-trim :disabled="formItem.disabled || false" v-bind="props" :placeholder="(props.placeholder && String(props.placeholder)) || '请输入' + (props.label || formItem.label || '')" autocomplete="new-password" v-on="eventObject" />
|
|
2
|
+
<el-input v-model="model" v-trim :disabled="formItem.disabled || false" v-bind="props" :placeholder="(props.placeholder && String(props.placeholder)) as string || '请输入' + (props.label || formItem.label || '')" autocomplete="new-password" v-on="eventObject" />
|
|
3
3
|
</template>
|
|
4
4
|
<script lang="ts">
|
|
5
5
|
import { ElInput } from "element-plus"
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<el-time-picker v-model="model" v-bind="props" :placeholder="(formItem.props && props.placeholder && String(props.placeholder)) || '请选择' + formItem.label" v-on="eventObject"> </el-time-picker>
|
|
2
|
+
<el-time-picker v-model="model" v-bind="props" :placeholder="(formItem.props && props.placeholder && String(props.placeholder)) as string || '请选择' + formItem.label" v-on="eventObject"> </el-time-picker>
|
|
3
3
|
</template>
|
|
4
4
|
<script lang="ts">
|
|
5
|
-
import { ElTimePicker, ModelValueType } from "element-plus"
|
|
6
|
-
import { computed, defineComponent, PropType } from "vue"
|
|
5
|
+
import { ElTimePicker, type ModelValueType } from "element-plus"
|
|
6
|
+
import { computed, defineComponent, type PropType } from "vue"
|
|
7
7
|
import { FormItemProps } from "../types"
|
|
8
8
|
export default defineComponent({
|
|
9
9
|
name: "SchemaFormTimePicker",
|
|
@@ -93,10 +93,6 @@ export interface EventObject {
|
|
|
93
93
|
// tooltip?: string | ((formModel: Fields, formItem: FormItem) => string)
|
|
94
94
|
// [key: string]: any
|
|
95
95
|
// }
|
|
96
|
-
interface FormItemEventObject {
|
|
97
|
-
change?: () => void
|
|
98
|
-
[key: string]: unknown
|
|
99
|
-
}
|
|
100
96
|
export const FormItemProps = {
|
|
101
97
|
formItem: {
|
|
102
98
|
type: Object as PropType<FormItem>,
|
|
@@ -111,7 +107,7 @@ export const FormItemProps = {
|
|
|
111
107
|
default: () => ({}),
|
|
112
108
|
},
|
|
113
109
|
eventObject: {
|
|
114
|
-
type: Object as PropType<
|
|
110
|
+
type: Object as PropType<Fields & { change: Function }>,
|
|
115
111
|
default: () => ({}),
|
|
116
112
|
},
|
|
117
113
|
modelValue: {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { withInstall } from "../../utils"
|
|
1
|
+
import { withInstall, type SFCWithInstall } from "../../utils"
|
|
2
2
|
import Instance from "./src/index"
|
|
3
|
-
export const CurdTable = withInstall(Instance)
|
|
4
|
-
export default CurdTable
|
|
3
|
+
export const CurdTable: SFCWithInstall<typeof Instance> = withInstall(Instance)
|
|
4
|
+
export default CurdTable as SFCWithInstall<typeof Instance>
|
|
5
5
|
export * from "./src/types"
|
|
@@ -87,11 +87,7 @@
|
|
|
87
87
|
<STableDetail ref="STableDetailRef" />
|
|
88
88
|
</div>
|
|
89
89
|
</template>
|
|
90
|
-
|
|
91
|
-
export default {
|
|
92
|
-
name: "CurdTable",
|
|
93
|
-
}
|
|
94
|
-
</script>
|
|
90
|
+
|
|
95
91
|
<script lang="ts" setup>
|
|
96
92
|
import { ArrowDown, Delete, Document, Edit, Plus } from "@element-plus/icons-vue"
|
|
97
93
|
import { ElLoading, ElMessage, ElMessageBox, ElTable } from "element-plus"
|
|
@@ -254,9 +250,9 @@ const fetchData = async (opt?: FetchDataOpt) => {
|
|
|
254
250
|
}
|
|
255
251
|
const tableItemRefs: Ref<Record<string, InstanceType<typeof STableItem>>> = ref({})
|
|
256
252
|
const getTableItemRef = (prop: string) => {
|
|
257
|
-
return (el:
|
|
253
|
+
return (el: unknown) => {
|
|
258
254
|
if (el) {
|
|
259
|
-
tableItemRefs.value[prop] = el
|
|
255
|
+
tableItemRefs.value[prop] = el as InstanceType<typeof STableItem>
|
|
260
256
|
}
|
|
261
257
|
}
|
|
262
258
|
}
|
|
@@ -451,7 +447,7 @@ const tableRef = ref<InstanceType<typeof ElTable>>() // 表格的实例
|
|
|
451
447
|
|
|
452
448
|
const toggleRowSelection = (row: unknown, isChecked?: boolean) => {
|
|
453
449
|
setTimeout(() => {
|
|
454
|
-
tableRef.value?.toggleRowSelection(row, isChecked)
|
|
450
|
+
tableRef.value?.toggleRowSelection(row, !!isChecked)
|
|
455
451
|
})
|
|
456
452
|
}
|
|
457
453
|
const tableMenuRef = ref()
|
|
@@ -3,7 +3,11 @@ import type { ParamsItem } from "../../../TableFilter"
|
|
|
3
3
|
import { deepClone } from "../../utils/common"
|
|
4
4
|
import type { ColumnItem } from "../types"
|
|
5
5
|
|
|
6
|
-
export function useColumnHook<T>() {
|
|
6
|
+
export function useColumnHook<T>(): {
|
|
7
|
+
tableColumns: Ref<Array<ColumnItem<T>>>,
|
|
8
|
+
selectParams: Ref<ParamsItem[]>,
|
|
9
|
+
initColumn: (propsColumns: ColumnItem<T>[]) => Promise<void>,
|
|
10
|
+
} {
|
|
7
11
|
const columns: Ref<Array<ColumnItem<T>>> = shallowRef([])
|
|
8
12
|
|
|
9
13
|
provide("columns", columns)
|
|
@@ -26,9 +26,9 @@
|
|
|
26
26
|
<slot :name="item.slot" :row="item" :data="props.data" :index="i"></slot>
|
|
27
27
|
</template>
|
|
28
28
|
<template v-else>
|
|
29
|
-
<ConstantStatus v-if="item.options" :value="item.value" :options="item.options" />
|
|
29
|
+
<ConstantStatus v-if="item.options" :value="item.value as string" :options="item.options" />
|
|
30
30
|
<template v-else-if="item.type == 'image'">
|
|
31
|
-
<el-image :src="item.value" :preview-src-list="[item.value]" style="width: 40px; height: 40px; vertical-align: top" :fit="'cover'" v-bind="item.props"></el-image>
|
|
31
|
+
<el-image :src="item.value as string" :preview-src-list="[item.value as string]" style="width: 40px; height: 40px; vertical-align: top" :fit="'cover'" v-bind="item.props"></el-image>
|
|
32
32
|
</template>
|
|
33
33
|
<component :is="item.type" v-else-if="item.type" v-model="item.value" v-bind="item.props"></component>
|
|
34
34
|
<template v-else><DetailInfoContent :data="item" /></template>
|
|
@@ -46,11 +46,11 @@ export default {
|
|
|
46
46
|
</script>
|
|
47
47
|
<script lang="ts" setup>
|
|
48
48
|
import { ElImage } from "element-plus"
|
|
49
|
-
import { PropType, computed } from "vue"
|
|
49
|
+
import { type PropType, computed } from "vue"
|
|
50
50
|
import { ConstantStatus } from "../../ConstantStatus/src"
|
|
51
51
|
import DetailInfoContent from "./DetailInfoContent.vue"
|
|
52
52
|
import DetailInfoTooltip from "./DetailInfoTooltip.vue"
|
|
53
|
-
import { DetailDataItem } from "./types"
|
|
53
|
+
import { type DetailDataItem } from "./types"
|
|
54
54
|
|
|
55
55
|
const props = defineProps({
|
|
56
56
|
data: {
|
|
@@ -9,8 +9,8 @@
|
|
|
9
9
|
</template>
|
|
10
10
|
</template>
|
|
11
11
|
<script lang="ts" setup>
|
|
12
|
-
import { PropType, computed } from "vue"
|
|
13
|
-
import { DetailDataItem } from "./types"
|
|
12
|
+
import { type PropType, computed } from "vue"
|
|
13
|
+
import { type DetailDataItem } from "./types"
|
|
14
14
|
const props = defineProps({
|
|
15
15
|
data: {
|
|
16
16
|
type: Object as PropType<DetailDataItem>,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { withInstall } from "../../utils"
|
|
1
|
+
import { withInstall, type SFCWithInstall } from "../../utils"
|
|
2
2
|
import Instance from "./src/TableFilter.vue"
|
|
3
|
-
export const TableFilter = withInstall(Instance)
|
|
3
|
+
export const TableFilter: SFCWithInstall<typeof Instance> = withInstall(Instance)
|
|
4
4
|
export * from "./types"
|
|
5
5
|
|
|
6
|
-
export default TableFilter
|
|
6
|
+
export default TableFilter as SFCWithInstall<typeof Instance>
|
|
@@ -12,9 +12,7 @@
|
|
|
12
12
|
<slot name="bottom"></slot>
|
|
13
13
|
</div>
|
|
14
14
|
</template>
|
|
15
|
-
|
|
16
|
-
export default { name: "TableFilter" }
|
|
17
|
-
</script>
|
|
15
|
+
|
|
18
16
|
<script lang="ts" setup>
|
|
19
17
|
import { onMounted, type PropType, provide, reactive, type Ref, ref, watch } from "vue"
|
|
20
18
|
import type { CurdFormOptionItem, FormContext } from "../../CurdForm"
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
</div>
|
|
17
17
|
</template>
|
|
18
18
|
<div ref="selectRef" class="select-list" @click.stop>
|
|
19
|
-
<TagsSelect ref="tagsSelectRef" v-model="listQuery[item.prop]" :list-query="listQuery" :params-item="item" @change="onChange" />
|
|
19
|
+
<TagsSelect ref="tagsSelectRef" v-model="listQuery[item.prop] as number | string | boolean | []" :list-query="listQuery" :params-item="item" @change="onChange" />
|
|
20
20
|
</div>
|
|
21
21
|
</el-popover>
|
|
22
22
|
</div>
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
</template>
|
|
18
18
|
<script lang="ts" setup>
|
|
19
19
|
import { ArrowDown } from "@element-plus/icons-vue"
|
|
20
|
-
import { PropType, ref } from "vue"
|
|
20
|
+
import { type PropType, ref } from "vue"
|
|
21
21
|
import * as I from "../../types"
|
|
22
22
|
const props = defineProps({
|
|
23
23
|
selectParams: {
|
|
@@ -10,9 +10,7 @@
|
|
|
10
10
|
<div v-loading="loading" class="select-spinner">
|
|
11
11
|
<ul v-if="options && options.length">
|
|
12
12
|
<li v-if="ps.all" :class="{ active: !model }" @click="onChange(allItem)">全部</li>
|
|
13
|
-
<
|
|
14
|
-
<li :class="{ active: model === item.value }" @click="onChange(item)">{{ item.label }}</li>
|
|
15
|
-
</template>
|
|
13
|
+
<li v-for="(item, index) in options" :key="index" :class="{ active: model === item.value }" @click="onChange(item)">{{ item.label }}</li>
|
|
16
14
|
</ul>
|
|
17
15
|
<el-empty v-else description="暂无数据" :image-size="40" />
|
|
18
16
|
</div>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "easybill-ui",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.5",
|
|
4
4
|
"description": "A component library for easybill",
|
|
5
5
|
"author": "tuchongyang <779311998@qq.com>",
|
|
6
6
|
"private": false,
|
|
@@ -14,5 +14,5 @@
|
|
|
14
14
|
"publishConfig": {
|
|
15
15
|
"access": "public"
|
|
16
16
|
},
|
|
17
|
-
"gitHead": "
|
|
17
|
+
"gitHead": "d73c13ef2247842e750f7517d91f8f0c2b4ee8c4"
|
|
18
18
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.curd-form{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box;min-width:0;align-items:flex-start}.curd-form:not(.el-form--inline) .el-form-item{flex:0 0 100%;box-sizing:border-box}.curd-form:not(.el-form--inline) .el-form-item .el-form-item__label:before{margin-left:-10px}.curd-form .form-item{width:100%;display:flex;min-width:0}.curd-form .form-item .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle;color:var(--el-text-color-secondary)}.curd-form .form-item .tooltip:hover{color:var(--color-primary)}.curd-form .form-item .empty{color:var(--el-text-color-secondary)}.curd-form .schema-form-radio .el-radio-group{vertical-align:top}.curd-form .el-checkbox-group.single .el-checkbox-button+.el-checkbox-button{margin-left:10px}.curd-form .el-checkbox-group.single .el-checkbox-button .el-checkbox-button__inner{border:var(--el-border);border-radius:var(--el-border-radius-base);padding-left:20px;padding-right:20px}.curd-form .el-checkbox-group.single .el-checkbox-button.is-checked .el-checkbox-button__inner{border-color:var(--el-checkbox-button-checked-border-color)}.curd-form .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle}.schema-form-select-check{height:25px;margin-left:20px;margin-top:10px;display:block}.schema-form-select-check :deep(.el-checkbox__input){vertical-align:middle}
|
|
1
|
+
.curd-form{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box;min-width:0;align-items:flex-start}.curd-form:not(.el-form--inline) .el-form-item{flex:0 0 100%;box-sizing:border-box}.curd-form:not(.el-form--inline) .el-form-item .el-form-item__label:before{margin-left:-10px}.curd-form .el-form-item-1{flex:0 0 calc(4.1666666667% * 1);box-sizing:border-box}.curd-form .el-form-item-2{flex:0 0 calc(4.1666666667% * 2);box-sizing:border-box}.curd-form .el-form-item-3{flex:0 0 calc(4.1666666667% * 3);box-sizing:border-box}.curd-form .el-form-item-4{flex:0 0 calc(4.1666666667% * 4);box-sizing:border-box}.curd-form .el-form-item-5{flex:0 0 calc(4.1666666667% * 5);box-sizing:border-box}.curd-form .el-form-item-6{flex:0 0 calc(4.1666666667% * 6);box-sizing:border-box}.curd-form .el-form-item-7{flex:0 0 calc(4.1666666667% * 7);box-sizing:border-box}.curd-form .el-form-item-8{flex:0 0 calc(4.1666666667% * 8);box-sizing:border-box}.curd-form .el-form-item-9{flex:0 0 calc(4.1666666667% * 9);box-sizing:border-box}.curd-form .el-form-item-10{flex:0 0 calc(4.1666666667% * 10);box-sizing:border-box}.curd-form .el-form-item-11{flex:0 0 calc(4.1666666667% * 11);box-sizing:border-box}.curd-form .el-form-item-12{flex:0 0 calc(4.1666666667% * 12);box-sizing:border-box}.curd-form .el-form-item-13{flex:0 0 calc(4.1666666667% * 13);box-sizing:border-box}.curd-form .el-form-item-14{flex:0 0 calc(4.1666666667% * 14);box-sizing:border-box}.curd-form .el-form-item-15{flex:0 0 calc(4.1666666667% * 15);box-sizing:border-box}.curd-form .el-form-item-16{flex:0 0 calc(4.1666666667% * 16);box-sizing:border-box}.curd-form .el-form-item-17{flex:0 0 calc(4.1666666667% * 17);box-sizing:border-box}.curd-form .el-form-item-18{flex:0 0 calc(4.1666666667% * 18);box-sizing:border-box}.curd-form .el-form-item-19{flex:0 0 calc(4.1666666667% * 19);box-sizing:border-box}.curd-form .el-form-item-20{flex:0 0 calc(4.1666666667% * 20);box-sizing:border-box}.curd-form .el-form-item-21{flex:0 0 calc(4.1666666667% * 21);box-sizing:border-box}.curd-form .el-form-item-22{flex:0 0 calc(4.1666666667% * 22);box-sizing:border-box}.curd-form .el-form-item-23{flex:0 0 calc(4.1666666667% * 23);box-sizing:border-box}.curd-form .el-form-item-24{flex:0 0 calc(4.1666666667% * 24);box-sizing:border-box}.curd-form .form-item{width:100%;display:flex;min-width:0}.curd-form .form-item .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle;color:var(--el-text-color-secondary)}.curd-form .form-item .tooltip:hover{color:var(--color-primary)}.curd-form .form-item .empty{color:var(--el-text-color-secondary)}.curd-form .schema-form-radio .el-radio-group{vertical-align:top}.curd-form .el-checkbox-group.single .el-checkbox-button+.el-checkbox-button{margin-left:10px}.curd-form .el-checkbox-group.single .el-checkbox-button .el-checkbox-button__inner{border:var(--el-border);border-radius:var(--el-border-radius-base);padding-left:20px;padding-right:20px}.curd-form .el-checkbox-group.single .el-checkbox-button.is-checked .el-checkbox-button__inner{border-color:var(--el-checkbox-button-checked-border-color)}.curd-form .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle}.schema-form-select-check{height:25px;margin-left:20px;margin-top:10px;display:block}.schema-form-select-check :deep(.el-checkbox__input){vertical-align:middle}
|
package/theme-chalk/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.constant-status{--el-tag-border-opacity:1;--el-tag-bg-opacity:1;--el-tag-font-size:var(--el-font-size-base)}.constant-status .el-tag__content{display:flex;align-items:center;line-height:1}.constant-status .el-icon,.constant-status .name{vertical-align:top;line-height:1}.constant-status .dot{width:5px;height:5px;display:inline-block;vertical-align:middle;border-radius:50%;background:var(--el-tag-text-color);margin-right:5px}.constant-status.no-border{padding:0}.constant-status.dot-status{padding:0}.constant-status.dot-status .name{color:var(--el-text-color-primary)}.constant-status.el-tag--default{padding:0;--el-tag-bg-color:transparent;--el-tag-border-color:transparent;--el-tag-hover-color:var(--el-text-color-primary);--el-tag-text-color:var(--el-text-color-primary)}.constant-status.el-tag--blue{--el-tag-bg-color:rgba(236, 245, 255, var(--el-tag-bg-color));--el-tag-border-color:rgba(217, 236, 255, var(--el-tag-border-color));--el-tag-hover-color:rgba(111, 122, 175, 1);--el-tag-text-color:rgba(111, 122, 175, 1)}.constant-status.el-tag--blue.el-tag--dark{--el-tag-bg-color:rgba(111, 122, 175, 1);--el-tag-border-color:rgba(111, 122, 175, 1);--el-tag-hover-color:rgba(111, 122, 175, 0.8);--el-tag-text-color:#fff}.constant-status.el-tag--blue.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--yellow{--el-tag-bg-color:rgba(255, 251, 230, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(255, 229, 143, var(--el-tag-borer-opacity));--el-tag-hover-color:rgba(212, 136, 6, 1);--el-tag-text-color:rgba(212, 136, 6, 1)}.constant-status.el-tag--yellow.el-tag--dark{--el-tag-bg-color:rgba(212, 136, 6, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(212, 136, 6, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(212, 136, 6, 1);--el-tag-text-color:#fff}.constant-status.el-tag--yellow.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--blue-dark{--el-tag-bg-color:rgba(240, 245, 255, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(173, 198, 255, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(29, 57, 196, 1);--el-tag-text-color:rgba(29, 57, 196, 1)}.constant-status.el-tag--blue-dark.el-tag--dark{--el-tag-bg-color:rgba(29, 57, 196, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(29, 57, 196, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(29, 57, 196, 1);--el-tag-text-color:#fff}.constant-status.el-tag--blue-dark.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--red-purple{--el-tag-bg-color:rgba(251, 243, 248, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(227, 206, 219, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(191, 117, 163, 1);--el-tag-text-color:rgba(191, 117, 163, 1)}.constant-status.el-tag--red-purple.el-tag--dark{--el-tag-bg-color:rgba(191, 117, 163, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(191, 117, 163, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(191, 117, 163, 1);--el-tag-text-color:#fff}.constant-status.el-tag--red-purple.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--blueness{--el-tag-bg-color:rgba(243, 250, 251, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(194, 213, 221, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(99, 150, 177, 1);--el-tag-text-color:rgba(99, 150, 177, 1)}.constant-status.el-tag--blueness.el-tag--dark{--el-tag-bg-color:rgba(99, 150, 177, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(99, 150, 177, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(99, 150, 177, 1);--el-tag-text-color:#fff}.constant-status.el-tag--blueness.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.no-border{border:0!important;background:0 0}.curd-form{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box;min-width:0;align-items:flex-start}.curd-form:not(.el-form--inline) .el-form-item{flex:0 0 100%;box-sizing:border-box}.curd-form:not(.el-form--inline) .el-form-item .el-form-item__label:before{margin-left:-10px}.curd-form .form-item{width:100%;display:flex;min-width:0}.curd-form .form-item .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle;color:var(--el-text-color-secondary)}.curd-form .form-item .tooltip:hover{color:var(--color-primary)}.curd-form .form-item .empty{color:var(--el-text-color-secondary)}.curd-form .schema-form-radio .el-radio-group{vertical-align:top}.curd-form .el-checkbox-group.single .el-checkbox-button+.el-checkbox-button{margin-left:10px}.curd-form .el-checkbox-group.single .el-checkbox-button .el-checkbox-button__inner{border:var(--el-border);border-radius:var(--el-border-radius-base);padding-left:20px;padding-right:20px}.curd-form .el-checkbox-group.single .el-checkbox-button.is-checked .el-checkbox-button__inner{border-color:var(--el-checkbox-button-checked-border-color)}.curd-form .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle}.schema-form-select-check{height:25px;margin-left:20px;margin-top:10px;display:block}.schema-form-select-check :deep(.el-checkbox__input){vertical-align:middle}.table-container .table-pager{margin:15px 0;display:flex;justify-content:space-between;align-items:center}.table-container .table-pager .pagination{justify-content:end;font-weight:400}.table-container .table-control{display:flex;justify-content:space-between;padding-bottom:10px;align-items:flex-end}.table-container .table-control .min-control>.el-button{margin-right:10px}.table-container .s-table-filter .el-form--inline .el-form-item{margin-right:15px}.table-container .el-button+.dropdown-item{margin-left:10px}.table-container .copy{cursor:pointer;margin-right:3px}.table-container .header-td{display:inline-flex;align-items:center;word-break:break-word}.table-container .header-td.center{justify-content:center}.table-container .header-td.right{justify-content:flex-end}.table-container .filter-dropdown-toggle{display:inline-block;line-height:1;cursor:pointer;position:relative;margin-left:3px}.table-container .filter-dropdown-toggle.active{color:var(--el-color-primary)}.table-container .table-menu{display:inline-block;vertical-align:middle;position:relative}.table-container .table-menu .table-menu-item{color:var(--el-button-text-color);font-size:14px;border-radius:4px;border:1px solid var(--el-button-border-color);padding:0;height:28px;width:28px;vertical-align:top;vertical-align:middle}.table-container .table-menu .table-menu-item:not(.is-disabled):active,.table-container .table-menu .table-menu-item:not(.is-disabled):focus{border-color:var(--el-button-border-color)}.table-container .table-menu .table-menu-item+.table-menu-item{margin-left:3px}.table-container .table-menu .table-menu-item:hover{background-color:var(--el-fill-color-light);border-color:var(--el-button-border-color)}.table-container .table-menu .current-size{color:var(--el-color-primary)}.table-container .simple-page{padding:20px 0;text-align:right}.table-container .simple-page>span{margin:0 10px}.curd-table-dropdown-menu .el-dropdown-menu__item{padding:0}.curd-table-dropdown-menu .el-dropdown-menu__item:hover{background-color:var(--el-fill-color-light)}.curd-table-dropdown-menu .el-dropdown-menu__item .el-button{display:block;padding:5px 16px;flex:1;text-align:left;font-size:12px}.table-main-filter-dropdown{padding:0}.table-main-filter-dropdown .search{position:relative;margin-bottom:5px}.table-main-filter-dropdown .search input{outline:0;border:0;width:100%;padding:5px 10px;background:#f4f4f4}.table-main-filter-dropdown .search .icon-suffix{position:absolute;right:10px;top:50%;transform:translateY(-50%)}.table-main-filter-dropdown .search .icon-close1{position:absolute;right:30px;top:50%;transform:translateY(-50%);cursor:pointer;opacity:.7}.table-main-filter-dropdown .search .icon-close1:hover{opacity:1;color:#444}.table-main-filter-dropdown .select li{line-height:30px;padding:0 20px;list-style:none;cursor:pointer}.table-main-filter-dropdown .select li:hover{background:#f4f4f4}.table-main-filter-dropdown .select li.active{color:var(--el-color-primary)}.filter-type-popper{width:auto!important;min-width:0!important;padding:0!important;box-shadow:none!important}.table-filter{display:flex;flex-direction:column;position:relative}.table-filter .filter-search-box{min-height:32px;border-width:1px;border-style:solid;border-color:var(--el-border-color);display:flex;min-width:460px;align-items:center;justify-items:center;justify-content:space-between;overflow:hidden;border-radius:var(--el-border-radius-base);transition:all .3s}.table-filter .filter-search-box.is-focus{border-color:var(--el-color-primary)}.table-filter .filter-search-box .filter-action{height:32px;line-height:32px;align-self:flex-end;display:flex}.table-filter .filter-search-box .filter-action div{cursor:pointer}.table-filter .filter-search-box .filter-action .empty{color:var(--el-color-info);margin-right:15px;padding-left:10px}.table-filter .filter-search-box .filter-action .empty:hover{color:var(--el-color-primary)}.table-filter .filter-search-box .filter-action .search{padding:0 20px;text-align:center;position:relative;display:flex;align-items:center}.table-filter .filter-search-box .filter-action .search:before{content:"";display:block;width:1px;height:20px;background:var(--el-border-color);position:absolute;left:0;top:50%;transform:translateY(-50%)}.table-filter .filter-search-box .filter-action .search:hover{color:var(--el-color-primary)}.table-filter .filter-external .el-form-item{margin-bottom:10px}.table-filter .filter-tags{height:100%;flex-wrap:wrap;display:flex;flex:1;align-items:flex-start;justify-items:center}.table-filter .filter-tags .tag-title{font-size:12px;color:var(--el-text-color-placeholder);height:24px;line-height:24px;margin:0 15px 5px 0}.table-filter .filter-tags .dropdown-toggle{white-space:nowrap;display:flex;align-items:center;justify-items:center;font-size:12px}.table-filter .filter-tags .tag-list{flex:1;display:flex;flex-wrap:wrap}.table-filter .filter-tags .tag-item{height:24px;line-height:24px;white-space:nowrap;display:flex;align-items:center;justify-items:center;padding:0 10px;color:var(--el-color-info-dark-2);background:var(--el-color-info-light-9);font-size:12px;border-radius:var(--el-border-radius-base);margin-right:5px;margin-bottom:10px;cursor:pointer}.table-filter .filter-tags .tag-item .action{color:var(--el-color-info-light-5);text-align:center;width:14px;height:14px;line-height:14px;border-radius:50%;margin-left:10px;font-size:14px;cursor:pointer}.table-filter .filter-tags .tag-item .action:hover{color:var(--el-color-primary)}.table-filter .tag-clear{margin-bottom:2px;margin-left:10px}.table-filter .filter-item .el-form-item{margin:0}.table-filter .filter-item .el-form-item__label{display:none}.table-filter .filter-item .el-input{--el-input-border:none;--el-input-border-color:transparent;--el-input-focus-border-color:transparent;--el-input-hover-border-color:transparent}.table-filter .filter-item .el-select{--el-select-border-color-hover:transparent;--el-select-input-focus-border-color:transparent}.table-filter .filter-item .el-select__wrapper{box-shadow:none}.table-filter-type{box-shadow:var(--el-box-shadow-light);background:var(--el-bg-color);z-index:3060;min-width:150px;max-height:300px;overflow:hidden;--el-font-size-base:12px}.table-filter-type .base-select{--el-font-size-base:12px;height:100%;max-height:300px;display:flex;flex-direction:column}.table-filter-type .base-select .remote-input{width:100%}.table-filter-type .base-select .remote-input .el-input{--el-input-border-radius:0;--el-input-bg-color:var(--el-bg-color-page);--el-input-border:none;--el-input-hover-border-color:transparent;--el-input-focus-border-color:var(--el-border-color)}.table-filter-type .base-select .el-empty__image svg{height:50px}.table-filter-type .base-select .select-spinner{flex:1;position:relative;overflow-y:auto}.table-filter-type .base-select .select-spinner ul{margin:0;padding:0}.table-filter-type .base-select .select-spinner ul li{list-style:none;padding:6px 10px;cursor:pointer;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;font-size:var(--el-font-size-base)}.table-filter-type .base-select .select-spinner ul li.active{color:var(--el-color-primary)}.table-filter-type .base-select .select-spinner ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.table-filter-toggle{padding:0 10px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;min-width:120px;font-size:12px}.table-filter-toggle .current-filter-label{margin-right:20px}.table-filter-List{box-shadow:0 2px 8px 0 rgba(0,0,0,.2);background:var(--el-bg-color);z-index:3060;border-radius:2px;max-height:300px;overflow-y:auto;font-size:12px}.table-filter-List ul{width:100%;margin:0;padding:0}.table-filter-List ul li{width:100%;list-style:none;padding:6px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;cursor:pointer}.table-filter-List ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.table-filter-List ul li.active{color:var(--el-color-primary);font-weight:600}.table-filter-tag-popper{max-height:400px;overflow:auto;padding:0!important;width:250px!important}.table-filter-tag-popper .base-select{--el-font-size-base:12px;height:100%;max-height:300px;display:flex;flex-direction:column}.table-filter-tag-popper .base-select .remote-input{width:100%}.table-filter-tag-popper .base-select .remote-input :deep(.el-input){--el-input-border-radius:0;--el-input-bg-color:var(--el-bg-color-page);--el-input-border:none;--el-input-hover-border-color:transparent;--el-input-focus-border-color:var(--el-border-color)}.table-filter-tag-popper .base-select :deep(.el-empty__imagesvg){height:50px}.table-filter-tag-popper .base-select .select-spinner{flex:1;position:relative;overflow-y:auto}.table-filter-tag-popper .base-select .select-spinner ul{margin:0;padding:0}.table-filter-tag-popper .base-select .select-spinner ul li{list-style:none;padding:6px 10px;cursor:pointer;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--el-font-size-base);box-sizing:border-box}.table-filter-tag-popper .base-select .select-spinner ul li.active{color:var(--el-color-primary)}.table-filter-tag-popper .base-select .select-spinner ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.detail-info{flex:1}.detail-info .detail-info-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.detail-info .title{border-left:3px solid var(--el-color-primary);padding-left:10px;line-height:1.2}.detail-info+.detail-info{margin-top:30px}.detail-info.card{background:var(--el-bg-color);border-radius:0;opacity:1;border:1px solid var(--el-border-color)}.detail-info.card[shadow]{box-shadow:var(--el-box-shadow-lighter)}.detail-info.card .detail-info-header{height:50px;border-bottom:1px solid var(--el-border-color);margin:0;padding:0 20px}.detail-info.card .detail-info-header .title{border-left:0;padding:0}.detail-info.card .detail-info-body{padding:10px 20px 20px 20px;margin:0}.detail-info .detail-info-body{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box}.detail-info .detail-info-body .table-detail-col{box-sizing:border-box}.detail-info .detail-info-body .item-col{line-height:20px;height:100%;box-sizing:border-box;display:flex}.detail-info .detail-info-body .item-col .label{padding:4px 0;color:var(--el-text-color-secondary);box-sizing:border-box;vertical-align:middle;float:left;display:flex;align-items:center}.detail-info .detail-info-body .item-col .det{flex:1;padding:4px 10px;box-sizing:border-box;min-height:20px;height:100%;word-break:break-all;overflow:hidden}.detail-info .detail-info-body.table{border-top:1px solid var(--el-border-color);border-left:1px solid var(--el-border-color)}.detail-info .detail-info-body.table .table-detail-col{padding:0!important;border-bottom:1px solid var(--el-border-color);border-right:1px solid var(--el-border-color)}.detail-info .detail-info-body.table .item-col{background:var(--el-fill-color-light);border:1px solid var(--el-bg-color)}.detail-info .detail-info-body.table .item-col .label{padding-left:10px;padding-right:10px;width:100px}.detail-info .detail-info-body.table .item-col .det{border-left:1px solid var(--el-border-color);background-color:var(--el-bg-color)}
|
|
1
|
+
.constant-status{--el-tag-border-opacity:1;--el-tag-bg-opacity:1;--el-tag-font-size:var(--el-font-size-base)}.constant-status .el-tag__content{display:flex;align-items:center;line-height:1}.constant-status .el-icon,.constant-status .name{vertical-align:top;line-height:1}.constant-status .dot{width:5px;height:5px;display:inline-block;vertical-align:middle;border-radius:50%;background:var(--el-tag-text-color);margin-right:5px}.constant-status.no-border{padding:0}.constant-status.dot-status{padding:0}.constant-status.dot-status .name{color:var(--el-text-color-primary)}.constant-status.el-tag--default{padding:0;--el-tag-bg-color:transparent;--el-tag-border-color:transparent;--el-tag-hover-color:var(--el-text-color-primary);--el-tag-text-color:var(--el-text-color-primary)}.constant-status.el-tag--blue{--el-tag-bg-color:rgba(236, 245, 255, var(--el-tag-bg-color));--el-tag-border-color:rgba(217, 236, 255, var(--el-tag-border-color));--el-tag-hover-color:rgba(111, 122, 175, 1);--el-tag-text-color:rgba(111, 122, 175, 1)}.constant-status.el-tag--blue.el-tag--dark{--el-tag-bg-color:rgba(111, 122, 175, 1);--el-tag-border-color:rgba(111, 122, 175, 1);--el-tag-hover-color:rgba(111, 122, 175, 0.8);--el-tag-text-color:#fff}.constant-status.el-tag--blue.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--yellow{--el-tag-bg-color:rgba(255, 251, 230, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(255, 229, 143, var(--el-tag-borer-opacity));--el-tag-hover-color:rgba(212, 136, 6, 1);--el-tag-text-color:rgba(212, 136, 6, 1)}.constant-status.el-tag--yellow.el-tag--dark{--el-tag-bg-color:rgba(212, 136, 6, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(212, 136, 6, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(212, 136, 6, 1);--el-tag-text-color:#fff}.constant-status.el-tag--yellow.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--blue-dark{--el-tag-bg-color:rgba(240, 245, 255, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(173, 198, 255, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(29, 57, 196, 1);--el-tag-text-color:rgba(29, 57, 196, 1)}.constant-status.el-tag--blue-dark.el-tag--dark{--el-tag-bg-color:rgba(29, 57, 196, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(29, 57, 196, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(29, 57, 196, 1);--el-tag-text-color:#fff}.constant-status.el-tag--blue-dark.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--red-purple{--el-tag-bg-color:rgba(251, 243, 248, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(227, 206, 219, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(191, 117, 163, 1);--el-tag-text-color:rgba(191, 117, 163, 1)}.constant-status.el-tag--red-purple.el-tag--dark{--el-tag-bg-color:rgba(191, 117, 163, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(191, 117, 163, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(191, 117, 163, 1);--el-tag-text-color:#fff}.constant-status.el-tag--red-purple.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--blueness{--el-tag-bg-color:rgba(243, 250, 251, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(194, 213, 221, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(99, 150, 177, 1);--el-tag-text-color:rgba(99, 150, 177, 1)}.constant-status.el-tag--blueness.el-tag--dark{--el-tag-bg-color:rgba(99, 150, 177, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(99, 150, 177, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(99, 150, 177, 1);--el-tag-text-color:#fff}.constant-status.el-tag--blueness.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.no-border{border:0!important;background:0 0}.curd-form{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box;min-width:0;align-items:flex-start}.curd-form:not(.el-form--inline) .el-form-item{flex:0 0 100%;box-sizing:border-box}.curd-form:not(.el-form--inline) .el-form-item .el-form-item__label:before{margin-left:-10px}.curd-form .el-form-item-1{flex:0 0 calc(4.1666666667% * 1);box-sizing:border-box}.curd-form .el-form-item-2{flex:0 0 calc(4.1666666667% * 2);box-sizing:border-box}.curd-form .el-form-item-3{flex:0 0 calc(4.1666666667% * 3);box-sizing:border-box}.curd-form .el-form-item-4{flex:0 0 calc(4.1666666667% * 4);box-sizing:border-box}.curd-form .el-form-item-5{flex:0 0 calc(4.1666666667% * 5);box-sizing:border-box}.curd-form .el-form-item-6{flex:0 0 calc(4.1666666667% * 6);box-sizing:border-box}.curd-form .el-form-item-7{flex:0 0 calc(4.1666666667% * 7);box-sizing:border-box}.curd-form .el-form-item-8{flex:0 0 calc(4.1666666667% * 8);box-sizing:border-box}.curd-form .el-form-item-9{flex:0 0 calc(4.1666666667% * 9);box-sizing:border-box}.curd-form .el-form-item-10{flex:0 0 calc(4.1666666667% * 10);box-sizing:border-box}.curd-form .el-form-item-11{flex:0 0 calc(4.1666666667% * 11);box-sizing:border-box}.curd-form .el-form-item-12{flex:0 0 calc(4.1666666667% * 12);box-sizing:border-box}.curd-form .el-form-item-13{flex:0 0 calc(4.1666666667% * 13);box-sizing:border-box}.curd-form .el-form-item-14{flex:0 0 calc(4.1666666667% * 14);box-sizing:border-box}.curd-form .el-form-item-15{flex:0 0 calc(4.1666666667% * 15);box-sizing:border-box}.curd-form .el-form-item-16{flex:0 0 calc(4.1666666667% * 16);box-sizing:border-box}.curd-form .el-form-item-17{flex:0 0 calc(4.1666666667% * 17);box-sizing:border-box}.curd-form .el-form-item-18{flex:0 0 calc(4.1666666667% * 18);box-sizing:border-box}.curd-form .el-form-item-19{flex:0 0 calc(4.1666666667% * 19);box-sizing:border-box}.curd-form .el-form-item-20{flex:0 0 calc(4.1666666667% * 20);box-sizing:border-box}.curd-form .el-form-item-21{flex:0 0 calc(4.1666666667% * 21);box-sizing:border-box}.curd-form .el-form-item-22{flex:0 0 calc(4.1666666667% * 22);box-sizing:border-box}.curd-form .el-form-item-23{flex:0 0 calc(4.1666666667% * 23);box-sizing:border-box}.curd-form .el-form-item-24{flex:0 0 calc(4.1666666667% * 24);box-sizing:border-box}.curd-form .form-item{width:100%;display:flex;min-width:0}.curd-form .form-item .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle;color:var(--el-text-color-secondary)}.curd-form .form-item .tooltip:hover{color:var(--color-primary)}.curd-form .form-item .empty{color:var(--el-text-color-secondary)}.curd-form .schema-form-radio .el-radio-group{vertical-align:top}.curd-form .el-checkbox-group.single .el-checkbox-button+.el-checkbox-button{margin-left:10px}.curd-form .el-checkbox-group.single .el-checkbox-button .el-checkbox-button__inner{border:var(--el-border);border-radius:var(--el-border-radius-base);padding-left:20px;padding-right:20px}.curd-form .el-checkbox-group.single .el-checkbox-button.is-checked .el-checkbox-button__inner{border-color:var(--el-checkbox-button-checked-border-color)}.curd-form .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle}.schema-form-select-check{height:25px;margin-left:20px;margin-top:10px;display:block}.schema-form-select-check :deep(.el-checkbox__input){vertical-align:middle}.table-container .table-pager{margin:15px 0;display:flex;justify-content:space-between;align-items:center}.table-container .table-pager .pagination{justify-content:end;font-weight:400}.table-container .table-control{display:flex;justify-content:space-between;padding-bottom:10px;align-items:flex-end}.table-container .table-control .min-control>.el-button{margin-right:10px}.table-container .s-table-filter .el-form--inline .el-form-item{margin-right:15px}.table-container .el-button+.dropdown-item{margin-left:10px}.table-container .copy{cursor:pointer;margin-right:3px}.table-container .header-td{display:inline-flex;align-items:center;word-break:break-word}.table-container .header-td.center{justify-content:center}.table-container .header-td.right{justify-content:flex-end}.table-container .filter-dropdown-toggle{display:inline-block;line-height:1;cursor:pointer;position:relative;margin-left:3px}.table-container .filter-dropdown-toggle.active{color:var(--el-color-primary)}.table-container .table-menu{display:inline-block;vertical-align:middle;position:relative}.table-container .table-menu .table-menu-item{color:var(--el-button-text-color);font-size:14px;border-radius:4px;border:1px solid var(--el-button-border-color);padding:0;height:28px;width:28px;vertical-align:top;vertical-align:middle}.table-container .table-menu .table-menu-item:not(.is-disabled):active,.table-container .table-menu .table-menu-item:not(.is-disabled):focus{border-color:var(--el-button-border-color)}.table-container .table-menu .table-menu-item+.table-menu-item{margin-left:3px}.table-container .table-menu .table-menu-item:hover{background-color:var(--el-fill-color-light);border-color:var(--el-button-border-color)}.table-container .table-menu .current-size{color:var(--el-color-primary)}.table-container .simple-page{padding:20px 0;text-align:right}.table-container .simple-page>span{margin:0 10px}.curd-table-dropdown-menu .el-dropdown-menu__item{padding:0}.curd-table-dropdown-menu .el-dropdown-menu__item:hover{background-color:var(--el-fill-color-light)}.curd-table-dropdown-menu .el-dropdown-menu__item .el-button{display:block;padding:5px 16px;flex:1;text-align:left;font-size:12px}.table-main-filter-dropdown{padding:0}.table-main-filter-dropdown .search{position:relative;margin-bottom:5px}.table-main-filter-dropdown .search input{outline:0;border:0;width:100%;padding:5px 10px;background:#f4f4f4}.table-main-filter-dropdown .search .icon-suffix{position:absolute;right:10px;top:50%;transform:translateY(-50%)}.table-main-filter-dropdown .search .icon-close1{position:absolute;right:30px;top:50%;transform:translateY(-50%);cursor:pointer;opacity:.7}.table-main-filter-dropdown .search .icon-close1:hover{opacity:1;color:#444}.table-main-filter-dropdown .select li{line-height:30px;padding:0 20px;list-style:none;cursor:pointer}.table-main-filter-dropdown .select li:hover{background:#f4f4f4}.table-main-filter-dropdown .select li.active{color:var(--el-color-primary)}.filter-type-popper{width:auto!important;min-width:0!important;padding:0!important;box-shadow:none!important}.table-filter{display:flex;flex-direction:column;position:relative}.table-filter .filter-search-box{min-height:32px;border-width:1px;border-style:solid;border-color:var(--el-border-color);display:flex;min-width:460px;align-items:center;justify-items:center;justify-content:space-between;overflow:hidden;border-radius:var(--el-border-radius-base);transition:all .3s}.table-filter .filter-search-box.is-focus{border-color:var(--el-color-primary)}.table-filter .filter-search-box .filter-action{height:32px;line-height:32px;align-self:flex-end;display:flex}.table-filter .filter-search-box .filter-action div{cursor:pointer}.table-filter .filter-search-box .filter-action .empty{color:var(--el-color-info);margin-right:15px;padding-left:10px}.table-filter .filter-search-box .filter-action .empty:hover{color:var(--el-color-primary)}.table-filter .filter-search-box .filter-action .search{padding:0 20px;text-align:center;position:relative;display:flex;align-items:center}.table-filter .filter-search-box .filter-action .search:before{content:"";display:block;width:1px;height:20px;background:var(--el-border-color);position:absolute;left:0;top:50%;transform:translateY(-50%)}.table-filter .filter-search-box .filter-action .search:hover{color:var(--el-color-primary)}.table-filter .filter-external .el-form-item{margin-bottom:10px}.table-filter .filter-tags{height:100%;flex-wrap:wrap;display:flex;flex:1;align-items:flex-start;justify-items:center}.table-filter .filter-tags .tag-title{font-size:12px;color:var(--el-text-color-placeholder);height:24px;line-height:24px;margin:0 15px 5px 0}.table-filter .filter-tags .dropdown-toggle{white-space:nowrap;display:flex;align-items:center;justify-items:center;font-size:12px}.table-filter .filter-tags .tag-list{flex:1;display:flex;flex-wrap:wrap}.table-filter .filter-tags .tag-item{height:24px;line-height:24px;white-space:nowrap;display:flex;align-items:center;justify-items:center;padding:0 10px;color:var(--el-color-info-dark-2);background:var(--el-color-info-light-9);font-size:12px;border-radius:var(--el-border-radius-base);margin-right:5px;margin-bottom:10px;cursor:pointer}.table-filter .filter-tags .tag-item .action{color:var(--el-color-info-light-5);text-align:center;width:14px;height:14px;line-height:14px;border-radius:50%;margin-left:10px;font-size:14px;cursor:pointer}.table-filter .filter-tags .tag-item .action:hover{color:var(--el-color-primary)}.table-filter .tag-clear{margin-bottom:2px;margin-left:10px}.table-filter .filter-item .el-form-item{margin:0}.table-filter .filter-item .el-form-item__label{display:none}.table-filter .filter-item .el-input{--el-input-border:none;--el-input-border-color:transparent;--el-input-focus-border-color:transparent;--el-input-hover-border-color:transparent}.table-filter .filter-item .el-select{--el-select-border-color-hover:transparent;--el-select-input-focus-border-color:transparent}.table-filter .filter-item .el-select__wrapper{box-shadow:none}.table-filter-type{box-shadow:var(--el-box-shadow-light);background:var(--el-bg-color);z-index:3060;min-width:150px;max-height:300px;overflow:hidden;--el-font-size-base:12px}.table-filter-type .base-select{--el-font-size-base:12px;height:100%;max-height:300px;display:flex;flex-direction:column}.table-filter-type .base-select .remote-input{width:100%}.table-filter-type .base-select .remote-input .el-input{--el-input-border-radius:0;--el-input-bg-color:var(--el-bg-color-page);--el-input-border:none;--el-input-hover-border-color:transparent;--el-input-focus-border-color:var(--el-border-color)}.table-filter-type .base-select .el-empty__image svg{height:50px}.table-filter-type .base-select .select-spinner{flex:1;position:relative;overflow-y:auto}.table-filter-type .base-select .select-spinner ul{margin:0;padding:0}.table-filter-type .base-select .select-spinner ul li{list-style:none;padding:6px 10px;cursor:pointer;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;font-size:var(--el-font-size-base)}.table-filter-type .base-select .select-spinner ul li.active{color:var(--el-color-primary)}.table-filter-type .base-select .select-spinner ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.table-filter-toggle{padding:0 10px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;min-width:120px;font-size:12px}.table-filter-toggle .current-filter-label{margin-right:20px}.table-filter-List{box-shadow:0 2px 8px 0 rgba(0,0,0,.2);background:var(--el-bg-color);z-index:3060;border-radius:2px;max-height:300px;overflow-y:auto;font-size:12px}.table-filter-List ul{width:100%;margin:0;padding:0}.table-filter-List ul li{width:100%;list-style:none;padding:6px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;cursor:pointer}.table-filter-List ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.table-filter-List ul li.active{color:var(--el-color-primary);font-weight:600}.table-filter-tag-popper{max-height:400px;overflow:auto;padding:0!important;width:250px!important}.table-filter-tag-popper .base-select{--el-font-size-base:12px;height:100%;max-height:300px;display:flex;flex-direction:column}.table-filter-tag-popper .base-select .remote-input{width:100%}.table-filter-tag-popper .base-select .remote-input :deep(.el-input){--el-input-border-radius:0;--el-input-bg-color:var(--el-bg-color-page);--el-input-border:none;--el-input-hover-border-color:transparent;--el-input-focus-border-color:var(--el-border-color)}.table-filter-tag-popper .base-select :deep(.el-empty__imagesvg){height:50px}.table-filter-tag-popper .base-select .select-spinner{flex:1;position:relative;overflow-y:auto}.table-filter-tag-popper .base-select .select-spinner ul{margin:0;padding:0}.table-filter-tag-popper .base-select .select-spinner ul li{list-style:none;padding:6px 10px;cursor:pointer;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--el-font-size-base);box-sizing:border-box}.table-filter-tag-popper .base-select .select-spinner ul li.active{color:var(--el-color-primary)}.table-filter-tag-popper .base-select .select-spinner ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.detail-info{flex:1}.detail-info .detail-info-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.detail-info .title{border-left:3px solid var(--el-color-primary);padding-left:10px;line-height:1.2}.detail-info+.detail-info{margin-top:30px}.detail-info.card{background:var(--el-bg-color);border-radius:0;opacity:1;border:1px solid var(--el-border-color)}.detail-info.card[shadow]{box-shadow:var(--el-box-shadow-lighter)}.detail-info.card .detail-info-header{height:50px;border-bottom:1px solid var(--el-border-color);margin:0;padding:0 20px}.detail-info.card .detail-info-header .title{border-left:0;padding:0}.detail-info.card .detail-info-body{padding:10px 20px 20px 20px;margin:0}.detail-info .detail-info-body{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box}.detail-info .detail-info-body .table-detail-col{box-sizing:border-box}.detail-info .detail-info-body .item-col{line-height:20px;height:100%;box-sizing:border-box;display:flex}.detail-info .detail-info-body .item-col .label{padding:4px 0;color:var(--el-text-color-secondary);box-sizing:border-box;vertical-align:middle;float:left;display:flex;align-items:center}.detail-info .detail-info-body .item-col .det{flex:1;padding:4px 10px;box-sizing:border-box;min-height:20px;height:100%;word-break:break-all;overflow:hidden}.detail-info .detail-info-body.table{border-top:1px solid var(--el-border-color);border-left:1px solid var(--el-border-color)}.detail-info .detail-info-body.table .table-detail-col{padding:0!important;border-bottom:1px solid var(--el-border-color);border-right:1px solid var(--el-border-color)}.detail-info .detail-info-body.table .item-col{background:var(--el-fill-color-light);border:1px solid var(--el-bg-color)}.detail-info .detail-info-body.table .item-col .label{padding-left:10px;padding-right:10px;width:100px}.detail-info .detail-info-body.table .item-col .det{border-left:1px solid var(--el-border-color);background-color:var(--el-bg-color)}
|