forked from p96170835/amis
还是能缓存
This commit is contained in:
liaoxuezhi
parent
bbb431600d
commit
bbbb027fce
|
|
@ -1,264 +1,265 @@
|
||||||
.#{$ns}Form {
|
.#{$ns}Form {
|
||||||
font-size: $Form-fontSize;
|
font-size: $Form-fontSize;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
&--quickEdit .#{$ns}Form-item:last-child {
|
&--quickEdit .#{$ns}Form-item:last-child {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
&--inline {
|
&--inline {
|
||||||
>.#{$ns}PlainField {
|
> .#{$ns}PlainField {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding-top: $Form-input-paddingY;
|
padding-top: $Form-input-paddingY;
|
||||||
// padding-bottom: $Form-input-paddingY;
|
// padding-bottom: $Form-input-paddingY;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-label {
|
.#{$ns}Form-label {
|
||||||
font-weight: $fontWeightNormal;
|
font-weight: $fontWeightNormal;
|
||||||
margin-bottom: px2rem(5px);
|
margin-bottom: px2rem(5px);
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
>span {
|
> span {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-star {
|
.#{$ns}Form-star {
|
||||||
color: $red;
|
color: $red;
|
||||||
font-size: $fontSizeXs;
|
font-size: $fontSizeXs;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: px2rem(-6px);
|
left: px2rem(-6px);
|
||||||
top: px2rem(3px);
|
top: px2rem(3px);
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-feedback {
|
.#{$ns}Form-feedback {
|
||||||
color: $danger;
|
color: $danger;
|
||||||
margin: $Form-input-marginBottom 0 0;
|
margin: $Form-input-marginBottom 0 0;
|
||||||
padding-left: $gap-base;
|
padding-left: $gap-base;
|
||||||
font-size: $fontSizeSm;
|
font-size: $fontSizeSm;
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-description {
|
.#{$ns}Form-description {
|
||||||
display: block;
|
display: block;
|
||||||
color: $Form-description-color;
|
color: $Form-description-color;
|
||||||
margin: $Form-input-marginBottom 0 0;
|
margin: $Form-input-marginBottom 0 0;
|
||||||
font-size: $Form-description-fontSize;
|
font-size: $Form-description-fontSize;
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-hint {
|
.#{$ns}Form-hint {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-left: $gap-sm;
|
margin-left: $gap-sm;
|
||||||
padding-top: $Form-input-paddingY;
|
padding-top: $Form-input-paddingY;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-item {
|
.#{$ns}Form-item {
|
||||||
margin-bottom: $Form-item-gap;
|
margin-bottom: $Form-item-gap;
|
||||||
|
|
||||||
.#{$ns}Grid-form>&:last-child {
|
.#{$ns}Grid-form > &:last-child {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.#{$ns}Form--inline > &--inline {
|
||||||
|
margin-bottom: $Form-item-gap/2;
|
||||||
|
margin-right: $Form-item-gap/2;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-right: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.#{$ns}Form--inline>&--inline {
|
.#{$ns}Form-remark {
|
||||||
margin-bottom: $Form-item-gap/2;
|
margin-top: ($Form-input-height - $fontSizeBase) / 2;
|
||||||
margin-right: $Form-item-gap/2;
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
&:last-child {
|
&--horizontal {
|
||||||
margin-right: 0;
|
> .#{$ns}Form-label {
|
||||||
margin-bottom: 0;
|
text-align: $Form--horizontal-label-align;
|
||||||
}
|
white-space: $Form--horizontal-label-whiteSpace;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.#{$ns}Form-remark {
|
&--normal {
|
||||||
margin-top: ($Form-input-height - $fontSizeBase) / 2;
|
> .#{$ns}Form-label {
|
||||||
vertical-align: top;
|
display: block;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&--horizontal {
|
&.is-error > .#{$ns}Form-label {
|
||||||
>.#{$ns}Form-label {
|
color: $danger;
|
||||||
text-align: $Form--horizontal-label-align;
|
}
|
||||||
white-space: $Form--horizontal-label-whiteSpace;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&--normal {
|
|
||||||
>.#{$ns}Form-label {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.is-error>.#{$ns}Form-label {
|
|
||||||
color: $danger;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-placeholder {
|
.#{$ns}Form-placeholder {
|
||||||
color: $Form-input-placeholderColor;
|
color: $Form-input-placeholderColor;
|
||||||
}
|
}
|
||||||
|
|
||||||
@include media-breakpoint-up(sm) {
|
@include media-breakpoint-up(sm) {
|
||||||
.#{$ns}Form-control--sizeXs {
|
.#{$ns}Form-control--sizeXs {
|
||||||
min-width: $Form-control-widthXs;
|
min-width: $Form-control-widthXs;
|
||||||
width: auto;
|
width: auto;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-control--sizeSm {
|
.#{$ns}Form-control--sizeSm {
|
||||||
min-width: $Form-control-widthSm;
|
min-width: $Form-control-widthSm;
|
||||||
width: auto;
|
width: auto;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-control--sizeMd {
|
.#{$ns}Form-control--sizeMd {
|
||||||
min-width: $Form-control-widthMd;
|
min-width: $Form-control-widthMd;
|
||||||
width: auto;
|
width: auto;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-control--sizeLg {
|
.#{$ns}Form-control--sizeLg {
|
||||||
min-width: $Form-control-widthLg;
|
min-width: $Form-control-widthLg;
|
||||||
width: auto;
|
width: auto;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-item {
|
.#{$ns}Form-item {
|
||||||
&--horizontal {
|
&--horizontal {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: nowrap;
|
flex-wrap: nowrap;
|
||||||
margin-left: -$Form--horizontal-gutterWidth / 2;
|
margin-left: -$Form--horizontal-gutterWidth / 2;
|
||||||
margin-right: -$Form--horizontal-gutterWidth / 2;
|
margin-right: -$Form--horizontal-gutterWidth / 2;
|
||||||
|
|
||||||
>* {
|
> * {
|
||||||
padding-left: $Form--horizontal-gutterWidth / 2;
|
padding-left: $Form--horizontal-gutterWidth / 2;
|
||||||
padding-right: $Form--horizontal-gutterWidth / 2;
|
padding-right: $Form--horizontal-gutterWidth / 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
>.#{$ns}Form-label,
|
> .#{$ns}Form-label,
|
||||||
>.#{$ns}Form-value {
|
> .#{$ns}Form-value {
|
||||||
flex-basis: 0;
|
|
||||||
flex-grow: 1;
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$ns}Form-itemColumn--xs,
|
|
||||||
.#{$ns}Form-itemColumn--sm,
|
|
||||||
.#{$ns}Form-itemColumn--normal,
|
|
||||||
.#{$ns}Form-itemColumn--md,
|
|
||||||
.#{$ns}Form-itemColumn--lg {
|
|
||||||
flex-grow: unset;
|
|
||||||
flex-basis: unset;
|
|
||||||
}
|
|
||||||
|
|
||||||
>.#{$ns}Form-label {
|
|
||||||
padding-top: $Form-label-paddingTop;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$ns}Form-itemColumn--xs {
|
|
||||||
width: $Form--horizontal-label-widthXs;
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$ns}Form-itemColumn--sm {
|
|
||||||
width: $Form--horizontal-label-widthSm;
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$ns}Form-itemColumn--normal {
|
|
||||||
width: $Form--horizontal-label-widthBase;
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$ns}Form-itemColumn--md {
|
|
||||||
width: $Form--horizontal-label-widthMd;
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$ns}Form-itemColumn--lg {
|
|
||||||
width: $Form--horizontal-label-widthLg;
|
|
||||||
}
|
|
||||||
|
|
||||||
@for $i from (1) through $Form--horizontal-columns {
|
|
||||||
.#{$ns}Form-itemColumn--#{$i} {
|
|
||||||
flex: 0 0 percentage($i / $Form--horizontal-columns);
|
|
||||||
max-width: percentage($i / $Form--horizontal-columns);
|
|
||||||
min-height: 1px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&--inline {
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: top;
|
|
||||||
|
|
||||||
>.#{$ns}Form-label {
|
|
||||||
padding-top: $Form-label-paddingTop;
|
|
||||||
margin-bottom: 0;
|
|
||||||
margin-right: $Form-item-gap/2;
|
|
||||||
|
|
||||||
.#{$ns}Form-star {
|
|
||||||
position: static;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
>.#{$ns}Form-value {
|
|
||||||
display: inline;
|
|
||||||
|
|
||||||
>.#{$ns}Form-control {
|
|
||||||
vertical-align: top;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
>.#{$ns}Form-control.#{$ns}InputGroup {
|
|
||||||
display: inline-flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
>.#{$ns}TextControl--withAddOn {
|
|
||||||
display: inline-flex;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$ns}Form-row {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
margin-left: -$Form-row-gutterWidth / 2;
|
|
||||||
margin-right: -$Form-row-gutterWidth / 2;
|
|
||||||
align-items: flex-start;
|
|
||||||
|
|
||||||
>* {
|
|
||||||
padding-left: $Form-row-gutterWidth / 2;
|
|
||||||
padding-right: $Form-row-gutterWidth / 2;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.#{$ns}Form-col {
|
|
||||||
flex-basis: 0;
|
flex-basis: 0;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
flex-shrink: 1;
|
max-width: 100%;
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.#{$ns}Form-itemColumn--xs,
|
||||||
|
.#{$ns}Form-itemColumn--sm,
|
||||||
|
.#{$ns}Form-itemColumn--normal,
|
||||||
|
.#{$ns}Form-itemColumn--md,
|
||||||
|
.#{$ns}Form-itemColumn--lg {
|
||||||
|
flex-grow: unset;
|
||||||
|
flex-basis: unset;
|
||||||
|
}
|
||||||
|
|
||||||
|
> .#{$ns}Form-label {
|
||||||
|
padding-top: $Form-label-paddingTop;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.#{$ns}Form-itemColumn--xs {
|
||||||
|
width: $Form--horizontal-label-widthXs;
|
||||||
|
}
|
||||||
|
|
||||||
|
.#{$ns}Form-itemColumn--sm {
|
||||||
|
width: $Form--horizontal-label-widthSm;
|
||||||
|
}
|
||||||
|
|
||||||
|
.#{$ns}Form-itemColumn--normal {
|
||||||
|
width: $Form--horizontal-label-widthBase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.#{$ns}Form-itemColumn--md {
|
||||||
|
width: $Form--horizontal-label-widthMd;
|
||||||
|
}
|
||||||
|
|
||||||
|
.#{$ns}Form-itemColumn--lg {
|
||||||
|
width: $Form--horizontal-label-widthLg;
|
||||||
|
}
|
||||||
|
|
||||||
|
@for $i from (1) through $Form--horizontal-columns {
|
||||||
|
.#{$ns}Form-itemColumn--#{$i} {
|
||||||
|
flex: 0 0 percentage($i / $Form--horizontal-columns);
|
||||||
|
max-width: percentage($i / $Form--horizontal-columns);
|
||||||
|
min-height: 1px;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.#{$ns}Form-rowInner {
|
&--inline {
|
||||||
display: flex;
|
display: inline-block;
|
||||||
flex-wrap: nowrap;
|
vertical-align: top;
|
||||||
|
|
||||||
>.#{$ns}Form-label {
|
> .#{$ns}Form-label {
|
||||||
display: inline-block;
|
padding-top: $Form-label-paddingTop;
|
||||||
vertical-align: top;
|
margin-bottom: 0;
|
||||||
padding-top: $Form-label-paddingTop;
|
margin-right: $Form-item-gap/2;
|
||||||
padding-right: $Form-row-gutterWidth;
|
|
||||||
|
.#{$ns}Form-star {
|
||||||
|
position: static;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> .#{$ns}Form-value {
|
||||||
|
display: inline;
|
||||||
|
|
||||||
|
> .#{$ns}Form-control {
|
||||||
|
vertical-align: top;
|
||||||
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
>.#{$ns}Form-control {
|
> .#{$ns}Form-control.#{$ns}InputGroup {
|
||||||
flex-basis: 0;
|
display: inline-flex;
|
||||||
flex-grow: 1;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
> .#{$ns}TextControl--withAddOn {
|
||||||
|
display: inline-flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.#{$ns}Form-row {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
margin-left: -$Form-row-gutterWidth / 2;
|
||||||
|
margin-right: -$Form-row-gutterWidth / 2;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
|
> * {
|
||||||
|
padding-left: $Form-row-gutterWidth / 2;
|
||||||
|
padding-right: $Form-row-gutterWidth / 2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.#{$ns}Form-col {
|
||||||
|
flex-basis: 0;
|
||||||
|
flex-grow: 1;
|
||||||
|
flex-shrink: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.#{$ns}Form-rowInner {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
|
||||||
|
> .#{$ns}Form-label {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: top;
|
||||||
|
padding-top: $Form-label-paddingTop;
|
||||||
|
padding-right: $Form-row-gutterWidth;
|
||||||
|
}
|
||||||
|
|
||||||
|
> .#{$ns}Form-control {
|
||||||
|
flex-basis: 0;
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -85,9 +85,6 @@ export const FormItemStore = types
|
||||||
return self.errorData.map(item => item.msg);
|
return self.errorData.map(item => item.msg);
|
||||||
}
|
}
|
||||||
|
|
||||||
let lastQueryValue: any;
|
|
||||||
let lastResult: any = [];
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
get form(): any {
|
get form(): any {
|
||||||
return getForm();
|
return getForm();
|
||||||
|
|
@ -117,13 +114,8 @@ export const FormItemStore = types
|
||||||
},
|
},
|
||||||
|
|
||||||
getSelectedOptions: (value: any = getValue()) => {
|
getSelectedOptions: (value: any = getValue()) => {
|
||||||
if (value === lastQueryValue) {
|
|
||||||
return lastResult;
|
|
||||||
}
|
|
||||||
lastQueryValue = value;
|
|
||||||
|
|
||||||
if (typeof value === 'undefined') {
|
if (typeof value === 'undefined') {
|
||||||
return (lastResult = []);
|
return [];
|
||||||
}
|
}
|
||||||
|
|
||||||
const selected = Array.isArray(value)
|
const selected = Array.isArray(value)
|
||||||
|
|
@ -183,7 +175,7 @@ export const FormItemStore = types
|
||||||
unMatched && selectedOptions.push(unMatched);
|
unMatched && selectedOptions.push(unMatched);
|
||||||
});
|
});
|
||||||
|
|
||||||
return (lastResult = selectedOptions);
|
return selectedOptions;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
})
|
})
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue