plain-design 1.0.0-beta.72 → 1.0.0-beta.74

package/src/packages/components/Pagination/pagination.scss

@@ -1,126 +1,126 @@
-@include prefix(pagination) {
-  display: flex;
-  align-items: center;
-  color: plv(text-2);
-  width: 100%;
-  box-sizing: border-box;
-
-  & > * {
-    display: inline-block;
-  }
-
-  @include prefix(number) {
-    //margin: 0 8px;
-
-    input {
-      padding: 0;
-      text-align: center;
-    }
-  }
-
-  .pagination-jumper {
-    display: flex;
-    align-items: center;
-  }
-
-  .pagination-pager {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-    display: flex;
-    align-items: center;
-  }
-
-  .pagination-pager-button {
-    text-align: center;
-    cursor: pointer;
-    transition: 300ms ease;
-    transition-property: background-color, border;
-    user-select: none;
-    border: solid 1px plv(secondary-3);
-    box-sizing: border-box;
-
-    &:hover {
-      border-color: plv(primary-6);
-      color: plv(primary-6);
-    }
-
-    &:active, &.pagination-pager-button-active {
-      background-color: plv(primary-6);
-      border-color: plv(primary-6);
-      color: plv(pbfc);
-    }
-  }
-
-  .pagination-blank {
-    flex: 1;
-  }
-
-  .pagination-total, .pagination-loading {
-    padding: 0 12px;
-  }
-
-  & > *, & > .pagination-pager {
-    margin-right: 8px;
-  }
-
-  .pagination-pager {
-    .pagination-pager-button:not(:last-child) {
-      margin-right: 8px;
-    }
-  }
-
-  @include sizeMixin(pagination, ()) {
-    .pagination-pager, .pagination-prev, .pagination-next, .pagination-blank, .pagination-pager-button {
-      height: $height;
-      line-height: $height;
-
-      &.pagination-pager-button {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        border-radius: $border-radius;
-
-        & > * {
-          flex-grow: 0;
-          flex-shrink: 0;
-        }
-
-        &.pagination-pager-button-long {
-          padding: 0 calc(#{$height} - 20px);
-        }
-
-        &:not(.pagination-pager-button-long) {
-          min-width: $height;
-        }
-      }
-    }
-    &.pagination-size-large {
-      font-size: 16px;
-    }
-    &.pagination-size-normal {
-      font-size: 14px;
-    }
-    &.pagination-size-small {
-      font-size: 12px;
-    }
-    &.pagination-size-mini {
-      font-size: 12px;
-    }
-  }
-
-  &.pagination-disabled {
-    .pagination-pager-button {
-      background-color: plv(gray-light-1);
-      border-color: plv(gray-light-1);
-      color: plv(gray-light-4);
-      cursor: not-allowed;
-
-      &.pagination-pager-button-active {
-        background-color: plv(gray-light-6);
-        border-color: plv(gray-light-6);
-        color: plv(pbfc);
-      }
-    }
-  }
-}
+@include prefix(pagination) {
+  display: flex;
+  align-items: center;
+  color: plv(text-2);
+  width: 100%;
+  box-sizing: border-box;
+
+  & > * {
+    display: inline-block;
+  }
+
+  @include prefix(number) {
+    //margin: 0 8px;
+
+    input {
+      padding: 0;
+      text-align: center;
+    }
+  }
+
+  .pagination-jumper {
+    display: flex;
+    align-items: center;
+  }
+
+  .pagination-pager {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    display: flex;
+    align-items: center;
+  }
+
+  .pagination-pager-button {
+    text-align: center;
+    cursor: pointer;
+    transition: 300ms ease;
+    transition-property: background-color, border;
+    user-select: none;
+    border: solid 1px plv(secondary-3);
+    box-sizing: border-box;
+
+    &:hover {
+      border-color: plv(primary-6);
+      color: plv(primary-6);
+    }
+
+    &:active, &.pagination-pager-button-active {
+      background-color: plv(primary-6);
+      border-color: plv(primary-6);
+      color: plv(pbfc);
+    }
+  }
+
+  .pagination-blank {
+    flex: 1;
+  }
+
+  .pagination-total, .pagination-loading {
+    padding: 0 12px;
+  }
+
+  & > *, & > .pagination-pager {
+    margin-right: 8px;
+  }
+
+  .pagination-pager {
+    .pagination-pager-button:not(:last-child) {
+      margin-right: 8px;
+    }
+  }
+
+  @include sizeMixin(pagination, ()) {
+    .pagination-pager, .pagination-prev, .pagination-next, .pagination-blank, .pagination-pager-button {
+      height: $height;
+      line-height: $height;
+
+      &.pagination-pager-button {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border-radius: $border-radius;
+
+        & > * {
+          flex-grow: 0;
+          flex-shrink: 0;
+        }
+
+        &.pagination-pager-button-long {
+          padding: 0 calc(#{$height} - 20px);
+        }
+
+        &:not(.pagination-pager-button-long) {
+          min-width: $height;
+        }
+      }
+    }
+    &.pagination-size-large {
+      font-size: 16px;
+    }
+    &.pagination-size-normal {
+      font-size: 14px;
+    }
+    &.pagination-size-small {
+      font-size: 12px;
+    }
+    &.pagination-size-mini {
+      font-size: 12px;
+    }
+  }
+
+  &.pagination-disabled {
+    .pagination-pager-button {
+      background-color: plv(gray-light-1);
+      border-color: plv(gray-light-1);
+      color: plv(gray-light-4);
+      cursor: not-allowed;
+
+      &.pagination-pager-button-active {
+        background-color: plv(gray-light-6);
+        border-color: plv(gray-light-6);
+        color: plv(pbfc);
+      }
+    }
+  }
+}

package/src/packages/components/Plc/index.tsx

@@ -1,4 +1,4 @@
-import {Plc} from "../Table/plc/plc/Plc";
-
-export {Plc};
-export default Plc;
+import {Plc} from "../Table/plc/plc/Plc";
+
+export {Plc};
+export default Plc;

package/src/packages/components/PlcAddress/index.tsx

@@ -1,4 +1,4 @@
-import {PlcAddress} from "../Table/editor/PlcAddress";
-
-export {PlcAddress};
-export default PlcAddress;
+import {PlcAddress} from "../Table/editor/PlcAddress";
+
+export {PlcAddress};
+export default PlcAddress;

package/src/packages/components/PlcAddressItem/index.tsx

@@ -1,4 +1,4 @@
-import {PlcAddressItem} from "../Table/editor/PlcAddressItem";
-
-export {PlcAddressItem};
-export default PlcAddressItem;
+import {PlcAddressItem} from "../Table/editor/PlcAddressItem";
+
+export {PlcAddressItem};
+export default PlcAddressItem;

package/src/packages/components/PlcCheck/index.tsx

@@ -1,5 +1,5 @@
-import {PlcCheck} from "../Table/standard/PlcCheck/PlcCheck";
-
-export default PlcCheck;
-
-export {PlcCheck};
+import {PlcCheck} from "../Table/standard/PlcCheck/PlcCheck";
+
+export default PlcCheck;
+
+export {PlcCheck};

package/src/packages/components/PlcCheckbox/index.tsx

@@ -1,4 +1,4 @@
-import {PlcCheckbox} from "../Table/editor/PlcCheckbox";
-
-export {PlcCheckbox};
-export default PlcCheckbox;
+import {PlcCheckbox} from "../Table/editor/PlcCheckbox";
+
+export {PlcCheckbox};
+export default PlcCheckbox;

package/src/packages/components/PlcColorPicker/index.tsx

@@ -1,4 +1,4 @@
-import {PlcColorPicker} from "../Table/editor/PlcColorPicker";
-
-export {PlcColorPicker};
-export default PlcColorPicker;
+import {PlcColorPicker} from "../Table/editor/PlcColorPicker";
+
+export {PlcColorPicker};
+export default PlcColorPicker;

package/src/packages/components/PlcDate/index.tsx

@@ -1,4 +1,4 @@
-import {PlcDate} from "../Table/editor/PlcDate";
-
-export {PlcDate};
-export default PlcDate;
+import {PlcDate} from "../Table/editor/PlcDate";
+
+export {PlcDate};
+export default PlcDate;

package/src/packages/components/PlcDateRange/index.tsx

@@ -1,4 +1,4 @@
-import {PlcDateRange} from "../Table/editor/PlcDateRange";
-
-export {PlcDateRange};
-export default PlcDateRange;
+import {PlcDateRange} from "../Table/editor/PlcDateRange";
+
+export {PlcDateRange};
+export default PlcDateRange;

package/src/packages/components/PlcDraggier/index.tsx

@@ -1,5 +1,5 @@
-import {PlcDraggier} from "../Table/standard/PlcDraggier/PlcDraggier";
-
-export default PlcDraggier;
-
-export {PlcDraggier};
+import {PlcDraggier} from "../Table/standard/PlcDraggier/PlcDraggier";
+
+export default PlcDraggier;
+
+export {PlcDraggier};

package/src/packages/components/PlcExpand/index.tsx

@@ -1,5 +1,5 @@
-import {PlcExpand} from "../Table/standard/PlcExpand";
-
-export default PlcExpand;
-
-export {PlcExpand};
+import {PlcExpand} from "../Table/standard/PlcExpand";
+
+export default PlcExpand;
+
+export {PlcExpand};

package/src/packages/components/PlcGroup/index.tsx

@@ -1,4 +1,4 @@
-import {PlcGroup} from "../Table/plc/group/PlcGroup";
-
-export {PlcGroup};
-export default PlcGroup;
+import {PlcGroup} from "../Table/plc/group/PlcGroup";
+
+export {PlcGroup};
+export default PlcGroup;

package/src/packages/components/PlcImage/index.tsx

@@ -1,80 +1,80 @@
-import {computed, designComponent, PropType} from "plain-design-composition";
-import {createPlcPropOptions, PlcEmitsOptions} from "../Table/plc/utils/plc.utils";
-import {PlcScopeSlotsOptions} from "../Table/plc/utils/plc.scope-slots";
-import {injectPlainTable} from "../Table/table/Table";
-import {$image} from "../$image";
-import {FileServiceUploadConfig} from "../$file";
-import $configuration from "../$configuration";
-import {formatImagePath, Image} from "../Image";
-import {usePlc} from "../Table/plc/use/usePlc";
-import ImageUploader from "../ImageUploader";
-
-export const PlcImage = designComponent({
-  name: 'plc-image',
-  props: {
-    ...createPlcPropOptions({
-      align: 'center',
-      noPadding: true,
-    }),
-    uploadConfig: { type: Object as PropType<Omit<FileServiceUploadConfig, 'file'>> },        // 上传配置信息对象
-    imgKeyField: { type: String },
-    urlPrefix: { type: String },
-  },
-  scopeSlots: PlcScopeSlotsOptions,
-  emits: PlcEmitsOptions,
-  setup({ props, event, slots, scopeSlots }) {
-
-    const table = injectPlainTable();
-
-    const upload = $configuration.use('upload');
-
-    const size = computed(() => {
-      const bodyRowHeight = table.props.bodyRowHeight;
-      return Math.ceil((bodyRowHeight as number) - 20);
-    });
-
-    const urlPrefix = computed(() => props.urlPrefix || upload?.config.prefix);
-
-    const preview = (index: number) => {
-      $image.preview((table.dataRef.value.data || []).map(i => formatImagePath(i[props.field!], urlPrefix.value)), index);
-    };
-
-    return usePlc({
-      props,
-      slots,
-      scopeSlots,
-      event,
-      defaultScopeSlots: {
-        normal: ({ row, plc, node }) => (
-          !plc.props.field ? null : <Image
-            urlPrefix={urlPrefix.value}
-            previewOnClick={false}
-            src={row[plc.props.field]}
-            height={size.value}
-            width={size.value}
-            fit="cover"
-            onClick={() => preview(node.state.index)}
-          />
-        ),
-        edit: ({ row, plc }) => !plc.props.field ? null :
-          <ImageUploader
-            urlPrefix={urlPrefix.value}
-            modelValue={row[plc.props.field]}
-            onUpdateModelValue={val => row[plc.props.field!] = val}
-            uploadConfig={props.uploadConfig}
-            height={size.value}
-            width={size.value}
-            handleDelete={() => {
-              row[plc.props.field!] = null;
-              row[props.imgKeyField!] = null;
-            }}
-            onUploadSuccess={(resp: any) => {
-              row[props.imgKeyField!] = resp.data.id;
-            }}
-          />
-      }
-    });
-  },
-});
-
-export default PlcImage;
+import {computed, designComponent, PropType} from "plain-design-composition";
+import {createPlcPropOptions, PlcEmitsOptions} from "../Table/plc/utils/plc.utils";
+import {PlcScopeSlotsOptions} from "../Table/plc/utils/plc.scope-slots";
+import {injectPlainTable} from "../Table/table/Table";
+import {$image} from "../$image";
+import {FileServiceUploadConfig} from "../$file";
+import $configuration from "../$configuration";
+import {formatImagePath, Image} from "../Image";
+import {usePlc} from "../Table/plc/use/usePlc";
+import ImageUploader from "../ImageUploader";
+
+export const PlcImage = designComponent({
+  name: 'plc-image',
+  props: {
+    ...createPlcPropOptions({
+      align: 'center',
+      noPadding: true,
+    }),
+    uploadConfig: { type: Object as PropType<Omit<FileServiceUploadConfig, 'file'>> },        // 上传配置信息对象
+    imgKeyField: { type: String },
+    urlPrefix: { type: String },
+  },
+  scopeSlots: PlcScopeSlotsOptions,
+  emits: PlcEmitsOptions,
+  setup({ props, event, slots, scopeSlots }) {
+
+    const table = injectPlainTable();
+
+    const upload = $configuration.use('upload');
+
+    const size = computed(() => {
+      const bodyRowHeight = table.props.bodyRowHeight;
+      return Math.ceil((bodyRowHeight as number) - 20);
+    });
+
+    const urlPrefix = computed(() => props.urlPrefix || upload?.config.prefix);
+
+    const preview = (index: number) => {
+      $image.preview((table.dataRef.value.data || []).map(i => formatImagePath(i[props.field!], urlPrefix.value)), index);
+    };
+
+    return usePlc({
+      props,
+      slots,
+      scopeSlots,
+      event,
+      defaultScopeSlots: {
+        normal: ({ row, plc, node }) => (
+          !plc.props.field ? null : <Image
+            urlPrefix={urlPrefix.value}
+            previewOnClick={false}
+            src={row[plc.props.field]}
+            height={size.value}
+            width={size.value}
+            fit="cover"
+            onClick={() => preview(node.state.index)}
+          />
+        ),
+        edit: ({ row, plc }) => !plc.props.field ? null :
+          <ImageUploader
+            urlPrefix={urlPrefix.value}
+            modelValue={row[plc.props.field]}
+            onUpdateModelValue={val => row[plc.props.field!] = val}
+            uploadConfig={props.uploadConfig}
+            height={size.value}
+            width={size.value}
+            handleDelete={() => {
+              row[plc.props.field!] = null;
+              row[props.imgKeyField!] = null;
+            }}
+            onUploadSuccess={(resp: any) => {
+              row[props.imgKeyField!] = resp.data.id;
+            }}
+          />
+      }
+    });
+  },
+});
+
+export default PlcImage;

package/src/packages/components/PlcIndex/index.tsx

@@ -1,5 +1,5 @@
-import {PlcIndex} from "../Table/standard/PlcIndex";
-
-export default PlcIndex;
-
-export {PlcIndex};
+import {PlcIndex} from "../Table/standard/PlcIndex";
+
+export default PlcIndex;
+
+export {PlcIndex};

package/src/packages/components/PlcInput/index.tsx

@@ -1,4 +1,4 @@
-import {PlcInput} from "../Table/editor/PlcInput";
-
-export {PlcInput};
-export default PlcInput;
+import {PlcInput} from "../Table/editor/PlcInput";
+
+export {PlcInput};
+export default PlcInput;

package/src/packages/components/PlcNumber/index.tsx

@@ -1,4 +1,4 @@
-import {PlcNumber} from "../Table/editor/PlcNumber";
-
-export {PlcNumber};
-export default PlcNumber;
+import {PlcNumber} from "../Table/editor/PlcNumber";
+
+export {PlcNumber};
+export default PlcNumber;

package/src/packages/components/PlcObject/index.tsx

@@ -1,53 +1,53 @@
-import {computed, designComponent} from "plain-design-composition";
-import {createPlcPropOptions, PlcEmitsOptions} from "../Table/plc/utils/plc.utils";
-import {PlcScopeSlotsOptions} from "../Table/plc/utils/plc.scope-slots";
-import {usePlc} from "../Table/plc/use/usePlc";
-import _Object from "../Object";
-import {pick} from "plain-utils/object/pick";
-import {ObjectPropsOption} from "../Object/object.utils";
-import {iFilterConfigObject} from "../FilterService/filter/fitler.object";
-
-export const PlcObject = designComponent({
-  name: 'plc-object',
-  props: {
-    ...createPlcPropOptions({
-      filterType: 'object',
-      filterHandler: 'like'
-    }),
-    ...pick(ObjectPropsOption, ['option', 'labelField', 'keyField', 'map']),
-  },
-  emits: PlcEmitsOptions,
-  scopeSlots: PlcScopeSlotsOptions,
-  setup({ props, scopeSlots, slots, event }) {
-
-    const filterConfig = computed((): iFilterConfigObject => {
-      return {
-        option: props.option,
-        labelField: props.labelField,
-        keyField: props.keyField,
-        ...props.filterConfig,
-      };
-    });
-
-    return usePlc({
-      props, scopeSlots, slots, event,
-      proxyPropsConfig: {
-        filterConfig: () => {return filterConfig.value;}
-      },
-      defaultScopeSlots: {
-        edit: ({ row, plc }) => !plc.props.field ? null : (
-          <_Object
-            v-model={row[plc.props.field]}
-            option={props.option}
-            row={row}
-            labelField={props.labelField}
-            keyField={props.keyField}
-            map={props.map}
-          />
-        )
-      }
-    });
-  },
-});
-
-export default PlcObject;
+import {computed, designComponent} from "plain-design-composition";
+import {createPlcPropOptions, PlcEmitsOptions} from "../Table/plc/utils/plc.utils";
+import {PlcScopeSlotsOptions} from "../Table/plc/utils/plc.scope-slots";
+import {usePlc} from "../Table/plc/use/usePlc";
+import _Object from "../Object";
+import {pick} from "plain-utils/object/pick";
+import {ObjectPropsOption} from "../Object/object.utils";
+import {iFilterConfigObject} from "../FilterService/filter/fitler.object";
+
+export const PlcObject = designComponent({
+  name: 'plc-object',
+  props: {
+    ...createPlcPropOptions({
+      filterType: 'object',
+      filterHandler: 'like'
+    }),
+    ...pick(ObjectPropsOption, ['option', 'labelField', 'keyField', 'map']),
+  },
+  emits: PlcEmitsOptions,
+  scopeSlots: PlcScopeSlotsOptions,
+  setup({ props, scopeSlots, slots, event }) {
+
+    const filterConfig = computed((): iFilterConfigObject => {
+      return {
+        option: props.option,
+        labelField: props.labelField,
+        keyField: props.keyField,
+        ...props.filterConfig,
+      };
+    });
+
+    return usePlc({
+      props, scopeSlots, slots, event,
+      proxyPropsConfig: {
+        filterConfig: () => {return filterConfig.value;}
+      },
+      defaultScopeSlots: {
+        edit: ({ row, plc }) => !plc.props.field ? null : (
+          <_Object
+            v-model={row[plc.props.field]}
+            option={props.option}
+            row={row}
+            labelField={props.labelField}
+            keyField={props.keyField}
+            map={props.map}
+          />
+        )
+      }
+    });
+  },
+});
+
+export default PlcObject;