@aplus-frontend/ui 0.6.0-beta.3 → 0.6.0-beta.5

package/theme/ui-mode.less

@@ -0,0 +1,93 @@
+[data-aplus-ui-mode='aplus'] {
+  --ap-form-bordered-border-color-base: #dee4ed;
+  --ap-form-bordered-border-color-hover: #66a9ff;
+  --ap-form-bordered-border-color-active: #66a9ff;
+  --ap-form-bordered-shadow-color: rgba(5, 155, 255, 0.1);
+  --ap-action-color-primary-base: #0070ff;
+  --ap-action-color-primary-hover: #66a9ff;
+  --ap-action-color-success: #2ed1a3;
+  --ap-action-color-error: #ff4d4f;
+  --ap-action-color-warn: #ffa940;
+  --check-card-outline-color: #e9edf3;
+  --check-card-hover-outline-color: #0070ff;
+  --check-card-checked-outline-color: #0070ff;
+  --check-card-checked-bg: #0070ff;
+  --ap-table-header-bg: #f2f6f9;
+  --ap-table-pagination-total-color: #526a90;
+  --ap-table-pagination-total-count-color: #182948;
+  --ap-table-setting-button-color: #8896b0;
+  --ap-batch-action-color-font: #8896b0;
+  --ap-batch-action-color-active: #0070ff;
+  --ap-batch-action-color-border: #e9edf3;
+  --basic-color-primary: #0070ff;
+  --basic-scrollbar-thumb-color-base: #c8d1de;
+  --basic-scrollbar-thumb-color-hover: #959ca7;
+  --ap-descriptions-item-padding-bottom: 16px;
+  --ap-descriptions-item-label-width: auto;
+  --ap-descriptions-last-row-item-padding-bottom: 0px;
+  --ap-appendix-area-color-border: #dee4ed;
+  --ap-appendix-area-color-font: #182948;
+  --ap-appendix-area-color-font-hover: #0070ff;
+  --ap-appendix-area-color-font-disabled: #abb7cc;
+  --ap-appendix-area-color-icon: #abb7cc;
+  --ap-upload-single-color-main: #182948;
+  --ap-upload-single-color-sub: #abb7cc;
+  --ap-upload-single-color-border: #dee4ed;
+  --ap-upload-single-color-primary: #0070ff;
+  --batch-input-group-trigger-color: #526a90;
+  --batch-input-group-trigger-color-disabled: rgba(24, 41, 72, 0.25);
+  --ap-text-label-color: #8896b0;
+  --ap-text-content-color-major: #182948;
+  --ap-text-content-color-minor: #8896b0;
+  --ap-view-icon-color: #8896b0;
+  --ap-view-bg-color: #f6f9fa;
+  --ap-view-message-color: #abb7cc;
+  --ap-view-border-color: #dee4ed;
+}
+
+[data-aplus-ui-mode='admin'] {
+  --ap-form-bordered-border-color-base: #d9d9d9;
+  --ap-form-bordered-border-color-hover: #85d4b0;
+  --ap-form-bordered-border-color-active: #85d4b0;
+  --ap-form-bordered-shadow-color: rgba(11, 166, 66, 0.09);
+  --ap-action-color-primary-base: #1890ff;
+  --ap-action-color-primary-hover: #5eb1ff;
+  --ap-action-color-success: #52c41a;
+  --ap-action-color-error: #ff4d4f;
+  --ap-action-color-warn: #faad14;
+  --check-card-outline-color: #d9d9d9;
+  --check-card-hover-outline-color: #34b77c;
+  --check-card-checked-outline-color: #34b77c;
+  --check-card-checked-bg: #34b77c;
+  --ap-table-header-bg: #fafafa;
+  --ap-table-pagination-total-color: #666666;
+  --ap-table-pagination-total-count-color: #333333;
+  --ap-table-setting-button-color: #999999;
+  --ap-batch-action-color-font: #999999;
+  --ap-batch-action-color-active: #34b77c;
+  --ap-batch-action-color-border: #e9e9e9;
+  --basic-color-primary: #34b77c;
+  --basic-scrollbar-thumb-color-base: #bfbfbf;
+  --basic-scrollbar-thumb-color-hover: #787878;
+  --ap-descriptions-item-padding-bottom: 16px;
+  --ap-descriptions-item-label-width: auto;
+  --ap-descriptions-last-row-item-padding-bottom: 0px;
+  --ap-appendix-area-color-border: #d9d9d9;
+  --ap-appendix-area-color-font: #333333;
+  --ap-appendix-area-color-font-hover: #1890ff;
+  --ap-appendix-area-color-font-disabled: #bfbfbf;
+  --ap-appendix-area-color-icon: #bfbfbf;
+  --ap-upload-single-color-main: #333333;
+  --ap-upload-single-color-sub: #bfbfbf;
+  --ap-upload-single-color-border: #d9d9d9;
+  --ap-upload-single-color-primary: #34b77c;
+  --batch-input-group-trigger-color: #999999;
+  --batch-input-group-trigger-color-disabled: rgba(0, 0, 0, 0.25);
+  --ap-text-label-color: #999999;
+  --ap-text-content-color-major: #333333;
+  --ap-text-content-color-minor: #999999;
+  --ap-view-icon-color: #999999;
+  --ap-view-bg-color: #fafafa;
+  --ap-view-message-color: #bfbfbf;
+  --ap-view-border-color: #d9d9d9;
+}

package/theme/work-order-modal/index.css

@@ -8,6 +8,23 @@
   line-height: 1.5;
   list-style: none;
 }
+.reset-scrollbar ::-webkit-scrollbar {
+  width: 10px;
+  height: 10px;
+}
+.reset-scrollbar ::-webkit-scrollbar-thumb {
+  background-color: var(--basic-scrollbar-thumb-color-base, #bfbfbf);
+  border-radius: 4px;
+  box-shadow: inset 0 -1px 0 0 #f0f0f0, inset 0 1px 0 0 #f0f0f0, inset -1px 0 0 0 #f0f0f0, inset 1px 0 0 0 #f0f0f0;
+}
+.reset-scrollbar ::-webkit-scrollbar-track,
+.reset-scrollbar ::-webkit-scrollbar-corner {
+  background-color: #ffffff;
+}
+.reset-scrollbar ::-webkit-scrollbar-thumb:hover,
+.reset-scrollbar ::-webkit-scrollbar-thumb:active {
+  background-color: var(--basic-scrollbar-thumb-color-hover, #787878);
+}
 .clear-fix::before {
   display: table;
   content: '';

package/es/src/config-provider/css-var.d.ts

@@ -1,139 +0,0 @@
-import { RecursivePartial } from '../type';
-declare const aplusCssVarObj: {
-    'ap-form': {
-        bordered: {
-            'border-color': {
-                base: string;
-                hover: string;
-                active: string;
-            };
-            'shadow-color': string;
-        };
-    };
-    'ap-action': {
-        color: {
-            primary: {
-                base: string;
-                hover: string;
-            };
-            success: string;
-            error: string;
-            warn: string;
-        };
-    };
-    'check-card': {
-        outline: {
-            color: string;
-        };
-        hover: {
-            outline: {
-                color: string;
-            };
-        };
-        checked: {
-            outline: {
-                color: string;
-            };
-            bg: string;
-        };
-    };
-    'ap-table': {
-        header: {
-            bg: string;
-        };
-        pagination: {
-            total: {
-                color: string;
-                count: {
-                    color: string;
-                };
-            };
-        };
-        setting: {
-            button: {
-                color: string;
-            };
-        };
-    };
-    'ap-batch-action': {
-        color: {
-            font: string;
-            active: string;
-            border: string;
-        };
-    };
-    basic: {
-        color: {
-            primary: string;
-        };
-    };
-    'ap-descriptions': {
-        item: {
-            'padding-bottom': string;
-            'label-width': string;
-        };
-        'last-row-item': {
-            'padding-bottom': string;
-        };
-    };
-    'ap-appendix': {
-        area: {
-            color: {
-                border: string;
-                font: string;
-                'font-hover': string;
-                'font-disabled': string;
-                icon: string;
-            };
-        };
-    };
-    'ap-upload-single': {
-        color: {
-            main: string;
-            sub: string;
-            border: string;
-            primary: string;
-        };
-    };
-    'batch-input-group': {
-        trigger: {
-            color: string;
-            'color-disabled': string;
-        };
-    };
-    'ap-text': {
-        label: {
-            color: string;
-        };
-        content: {
-            color: {
-                major: string;
-                minor: string;
-            };
-        };
-    };
-    'ap-view': {
-        icon: {
-            color: string;
-        };
-        bg: {
-            color: string;
-        };
-        message: {
-            color: string;
-        };
-        border: {
-            color: string;
-        };
-    };
-};
-export type CssVarType = RecursivePartial<typeof aplusCssVarObj>;
-export declare function generateCssVar(cssVarRawObj: CssVarType): Record<string, any>;
-export declare const aplusCssVar: Record<string, any>;
-export declare const adminCssVar: Record<string, any>;
-/**
- * 多次设置css变量（这种方式如果css变量过多可能会有性能问题）
- * @param variables
- */
-export declare function setCSSVariables(variables: Record<string, any>): void;
-export {};

package/es/src/config-provider/css-var.mjs

@@ -1,278 +0,0 @@
-const b = {
-  "ap-form": {
-    bordered: {
-      "border-color": {
-        base: "#DEE4ED",
-        hover: "#66A9FF",
-        active: "#66A9FF"
-      },
-      "shadow-color": "rgba(5, 155, 255, 0.1)"
-    }
-  },
-  "ap-action": {
-    color: {
-      primary: {
-        base: "#0070FF",
-        hover: "#66A9FF"
-      },
-      success: "#2ED1A3",
-      error: "#FF4D4F",
-      warn: "#FFA940"
-    }
-  },
-  "check-card": {
-    outline: {
-      color: "#E9EDF3"
-    },
-    hover: {
-      outline: {
-        color: "#0070FF"
-      }
-    },
-    checked: {
-      outline: {
-        color: "#0070FF"
-      },
-      bg: "#0070FF"
-    }
-  },
-  "ap-table": {
-    header: {
-      bg: "#F2F6F9"
-    },
-    pagination: {
-      total: {
-        color: "#526A90",
-        count: {
-          color: "#182948"
-        }
-      }
-    },
-    setting: {
-      button: {
-        color: "#8896B0"
-      }
-    }
-  },
-  "ap-batch-action": {
-    color: {
-      font: "#8896B0",
-      active: "#0070FF",
-      border: "#E9EDF3"
-    }
-  },
-  basic: {
-    color: {
-      primary: "#0070ff"
-    }
-  },
-  "ap-descriptions": {
-    item: {
-      "padding-bottom": "16px",
-      "label-width": "auto"
-    },
-    "last-row-item": {
-      "padding-bottom": "0px"
-    }
-  },
-  "ap-appendix": {
-    area: {
-      color: {
-        border: "#DEE4ED",
-        font: "#182948",
-        "font-hover": "#0070FF",
-        "font-disabled": "#ABB7CC",
-        icon: "#ABB7CC"
-      }
-    }
-  },
-  "ap-upload-single": {
-    color: {
-      main: "#182948",
-      sub: "#ABB7CC",
-      border: "#DEE4ED",
-      primary: "#0070FF"
-    }
-  },
-  "batch-input-group": {
-    trigger: {
-      color: "#526a90",
-      "color-disabled": "rgba(24, 41, 72, 0.25)"
-    }
-  },
-  "ap-text": {
-    label: {
-      color: "#8896b0"
-    },
-    content: {
-      color: {
-        major: "#182948",
-        minor: "#8896B0"
-      }
-    }
-  },
-  "ap-view": {
-    icon: {
-      color: "#8896B0"
-    },
-    bg: {
-      color: "#F6F9FA"
-    },
-    message: {
-      color: "#abb7cc"
-    },
-    border: {
-      color: "#DEE4ED"
-    }
-  }
-}, F = {
-  "ap-form": {
-    bordered: {
-      "border-color": {
-        base: "#D9D9D9",
-        hover: "#85D4B0",
-        active: "#85D4B0"
-      },
-      "shadow-color": "rgba(11, 166, 66, 0.09)"
-    }
-  },
-  "ap-action": {
-    color: {
-      primary: {
-        base: "#1890FF",
-        hover: "#5EB1FF"
-      },
-      success: "#52C41A",
-      error: "#FF4D4F",
-      warn: "#FAAD14"
-    }
-  },
-  "check-card": {
-    outline: {
-      color: "#D9D9D9"
-    },
-    hover: {
-      outline: {
-        color: "#34B77C"
-      }
-    },
-    checked: {
-      outline: {
-        color: "#34B77C"
-      },
-      bg: "#34B77C"
-    }
-  },
-  "ap-table": {
-    header: {
-      bg: "#FAFAFA"
-    },
-    pagination: {
-      total: {
-        color: "#666666",
-        count: {
-          color: "#333333"
-        }
-      }
-    },
-    setting: {
-      button: {
-        color: "#999999"
-      }
-    }
-  },
-  "ap-batch-action": {
-    color: {
-      font: "#999999",
-      active: "#34B77C",
-      border: "#E9E9E9"
-    }
-  },
-  basic: {
-    color: {
-      primary: "#34b77c"
-    }
-  },
-  "ap-descriptions": {
-    item: {
-      "padding-bottom": "16px",
-      "label-width": "auto"
-    },
-    "last-row-item": {
-      "padding-bottom": "0px"
-    }
-  },
-  "ap-appendix": {
-    area: {
-      color: {
-        border: "#D9D9D9",
-        font: "#333333",
-        "font-hover": "#1890FF",
-        "font-disabled": "#BFBFBF",
-        icon: "#BFBFBF"
-      }
-    }
-  },
-  "ap-upload-single": {
-    color: {
-      main: "#333333",
-      sub: "#BFBFBF",
-      border: "#D9D9D9",
-      primary: "#34b77c"
-    }
-  },
-  "batch-input-group": {
-    trigger: {
-      color: "#999999",
-      "color-disabled": "rgba(0, 0, 0, 0.25)"
-    }
-  },
-  "ap-text": {
-    label: {
-      color: "#999999"
-    },
-    content: {
-      color: {
-        major: "#333333",
-        minor: "#999999"
-      }
-    }
-  },
-  "ap-view": {
-    icon: {
-      color: "#999999"
-    },
-    bg: {
-      color: "#fafafa"
-    },
-    message: {
-      color: "#bfbfbf"
-    },
-    border: {
-      color: "#d9d9d9"
-    }
-  }
-};
-function n(a) {
-  const o = {};
-  function r(t, i) {
-    const s = Object.keys(t);
-    for (const c of s) {
-      const e = t[c], l = [...i, c];
-      e !== null && typeof e == "object" ? r(e, l) : o[`--${l.join("-")}`] = e;
-    }
-  }
-  return r(a, []), o;
-}
-const d = n(b), p = n(F);
-function u(a) {
-  Object.entries(a).forEach(([o, r]) => {
-    document.documentElement.style.setProperty(o, r);
-  });
-}
-export {
-  p as adminCssVar,
-  d as aplusCssVar,
-  n as generateCssVar,
-  u as setCSSVariables
-};

package/lib/src/config-provider/css-var.d.ts

@@ -1,139 +0,0 @@
-import { RecursivePartial } from '../type';
-declare const aplusCssVarObj: {
-    'ap-form': {
-        bordered: {
-            'border-color': {
-                base: string;
-                hover: string;
-                active: string;
-            };
-            'shadow-color': string;
-        };
-    };
-    'ap-action': {
-        color: {
-            primary: {
-                base: string;
-                hover: string;
-            };
-            success: string;
-            error: string;
-            warn: string;
-        };
-    };
-    'check-card': {
-        outline: {
-            color: string;
-        };
-        hover: {
-            outline: {
-                color: string;
-            };
-        };
-        checked: {
-            outline: {
-                color: string;
-            };
-            bg: string;
-        };
-    };
-    'ap-table': {
-        header: {
-            bg: string;
-        };
-        pagination: {
-            total: {
-                color: string;
-                count: {
-                    color: string;
-                };
-            };
-        };
-        setting: {
-            button: {
-                color: string;
-            };
-        };
-    };
-    'ap-batch-action': {
-        color: {
-            font: string;
-            active: string;
-            border: string;
-        };
-    };
-    basic: {
-        color: {
-            primary: string;
-        };
-    };
-    'ap-descriptions': {
-        item: {
-            'padding-bottom': string;
-            'label-width': string;
-        };
-        'last-row-item': {
-            'padding-bottom': string;
-        };
-    };
-    'ap-appendix': {
-        area: {
-            color: {
-                border: string;
-                font: string;
-                'font-hover': string;
-                'font-disabled': string;
-                icon: string;
-            };
-        };
-    };
-    'ap-upload-single': {
-        color: {
-            main: string;
-            sub: string;
-            border: string;
-            primary: string;
-        };
-    };
-    'batch-input-group': {
-        trigger: {
-            color: string;
-            'color-disabled': string;
-        };
-    };
-    'ap-text': {
-        label: {
-            color: string;
-        };
-        content: {
-            color: {
-                major: string;
-                minor: string;
-            };
-        };
-    };
-    'ap-view': {
-        icon: {
-            color: string;
-        };
-        bg: {
-            color: string;
-        };
-        message: {
-            color: string;
-        };
-        border: {
-            color: string;
-        };
-    };
-};
-export type CssVarType = RecursivePartial<typeof aplusCssVarObj>;
-export declare function generateCssVar(cssVarRawObj: CssVarType): Record<string, any>;
-export declare const aplusCssVar: Record<string, any>;
-export declare const adminCssVar: Record<string, any>;
-/**
- * 多次设置css变量（这种方式如果css变量过多可能会有性能问题）
- * @param variables
- */
-export declare function setCSSVariables(variables: Record<string, any>): void;
-export {};

package/lib/src/config-provider/css-var.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b={"ap-form":{bordered:{"border-color":{base:"#DEE4ED",hover:"#66A9FF",active:"#66A9FF"},"shadow-color":"rgba(5, 155, 255, 0.1)"}},"ap-action":{color:{primary:{base:"#0070FF",hover:"#66A9FF"},success:"#2ED1A3",error:"#FF4D4F",warn:"#FFA940"}},"check-card":{outline:{color:"#E9EDF3"},hover:{outline:{color:"#0070FF"}},checked:{outline:{color:"#0070FF"},bg:"#0070FF"}},"ap-table":{header:{bg:"#F2F6F9"},pagination:{total:{color:"#526A90",count:{color:"#182948"}}},setting:{button:{color:"#8896B0"}}},"ap-batch-action":{color:{font:"#8896B0",active:"#0070FF",border:"#E9EDF3"}},basic:{color:{primary:"#0070ff"}},"ap-descriptions":{item:{"padding-bottom":"16px","label-width":"auto"},"last-row-item":{"padding-bottom":"0px"}},"ap-appendix":{area:{color:{border:"#DEE4ED",font:"#182948","font-hover":"#0070FF","font-disabled":"#ABB7CC",icon:"#ABB7CC"}}},"ap-upload-single":{color:{main:"#182948",sub:"#ABB7CC",border:"#DEE4ED",primary:"#0070FF"}},"batch-input-group":{trigger:{color:"#526a90","color-disabled":"rgba(24, 41, 72, 0.25)"}},"ap-text":{label:{color:"#8896b0"},content:{color:{major:"#182948",minor:"#8896B0"}}},"ap-view":{icon:{color:"#8896B0"},bg:{color:"#F6F9FA"},message:{color:"#abb7cc"},border:{color:"#DEE4ED"}}},d={"ap-form":{bordered:{"border-color":{base:"#D9D9D9",hover:"#85D4B0",active:"#85D4B0"},"shadow-color":"rgba(11, 166, 66, 0.09)"}},"ap-action":{color:{primary:{base:"#1890FF",hover:"#5EB1FF"},success:"#52C41A",error:"#FF4D4F",warn:"#FAAD14"}},"check-card":{outline:{color:"#D9D9D9"},hover:{outline:{color:"#34B77C"}},checked:{outline:{color:"#34B77C"},bg:"#34B77C"}},"ap-table":{header:{bg:"#FAFAFA"},pagination:{total:{color:"#666666",count:{color:"#333333"}}},setting:{button:{color:"#999999"}}},"ap-batch-action":{color:{font:"#999999",active:"#34B77C",border:"#E9E9E9"}},basic:{color:{primary:"#34b77c"}},"ap-descriptions":{item:{"padding-bottom":"16px","label-width":"auto"},"last-row-item":{"padding-bottom":"0px"}},"ap-appendix":{area:{color:{border:"#D9D9D9",font:"#333333","font-hover":"#1890FF","font-disabled":"#BFBFBF",icon:"#BFBFBF"}}},"ap-upload-single":{color:{main:"#333333",sub:"#BFBFBF",border:"#D9D9D9",primary:"#34b77c"}},"batch-input-group":{trigger:{color:"#999999","color-disabled":"rgba(0, 0, 0, 0.25)"}},"ap-text":{label:{color:"#999999"},content:{color:{major:"#333333",minor:"#999999"}}},"ap-view":{icon:{color:"#999999"},bg:{color:"#fafafa"},message:{color:"#bfbfbf"},border:{color:"#d9d9d9"}}};function t(a){const o={};function r(c,i){const s=Object.keys(c);for(const l of s){const e=c[l],n=[...i,l];e!==null&&typeof e=="object"?r(e,n):o[`--${n.join("-")}`]=e}}return r(a,[]),o}const F=t(b),p=t(d);function u(a){Object.entries(a).forEach(([o,r])=>{document.documentElement.style.setProperty(o,r)})}exports.adminCssVar=p;exports.aplusCssVar=F;exports.generateCssVar=t;exports.setCSSVariables=u;