bkui-vue 0.0.3-beta.4 → 0.0.3-beta.6

package/lib/version-log/version-log.css

@@ -0,0 +1,224 @@
+.bk-version-log-dialog .bk-modal-header {
+  display: none;
+}
+.bk-version-log-dialog.bk-dialog-wrapper .bk-modal-content {
+  padding: 0 !important;
+  height: 100%;
+}
+.bk-version-log {
+  height: 100%;
+}
+.bk-version-log .bk-resize-layout {
+  height: 100%;
+}
+.bk-version-log .bk-resize-layout-aside {
+  padding: 20px 0;
+  height: 100%;
+  background: #fafbfd;
+}
+.bk-version-log-list-side {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  border-top: 1px solid #dcdee5;
+  border-bottom: 1px solid #dcdee5;
+  overflow: auto;
+}
+.bk-version-log-list-side .bk-version-log-version-item {
+  flex: 0 0 54px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+  padding-left: 30px;
+  border-bottom: 1px solid #dcdee5;
+}
+.bk-version-log-list-side .bk-version-log-version-item:hover {
+  cursor: pointer;
+  background-color: #ffffff;
+}
+.bk-version-log-list-side .bk-version-log-version-item .bk-version-log-version-item-title {
+  color: #313238;
+  font-size: 16px;
+}
+.bk-version-log-list-side .bk-version-log-version-item .bk-version-log-version-item-subtitle {
+  color: #979ba5;
+  font-size: 12px;
+}
+.bk-version-log-list-side .bk-version-log-version-item .bk-version-log-crt-tag {
+  position: absolute;
+  right: 20px;
+  top: 8px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 5px;
+  height: 20px;
+  font-size: 12px;
+  color: #ffffff;
+  background-color: #699df4;
+  border-radius: 2px;
+}
+.bk-version-log-list-side .bk-version-log-version-item.is-active {
+  background-color: #ffffff;
+}
+.bk-version-log-list-side .bk-version-log-version-item.is-active::before {
+  content: ' ';
+  position: absolute;
+  top: 0px;
+  bottom: 0px;
+  left: 0;
+  width: 6px;
+  background-color: #3a84ff;
+}
+.bk-version-log-loading {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+}
+.bk-version-log-detail {
+  padding: 25px 20px 50px 40px;
+  height: 100%;
+}
+.bk-version-log-detail .bk-version-log-detail-content {
+  height: 100%;
+  overflow: auto;
+  font-size: 14px;
+  color: #313238;
+}
+.bk-version-log-detail .bk-version-log-detail-content h1,
+.bk-version-log-detail .bk-version-log-detail-content h2,
+.bk-version-log-detail .bk-version-log-detail-content h3,
+.bk-version-log-detail .bk-version-log-detail-content h4,
+.bk-version-log-detail .bk-version-log-detail-content h5 {
+  height: auto;
+  margin: 10px 0;
+  font: normal 14px/1.5 'Helvetica Neue', Helvetica, Arial, 'Lantinghei SC', 'Hiragino Sans GB', 'Microsoft Yahei', sans-serif;
+  font-weight: bold;
+  color: #34383e;
+}
+.bk-version-log-detail .bk-version-log-detail-content h1 {
+  font-size: 30px;
+}
+.bk-version-log-detail .bk-version-log-detail-content h2 {
+  font-size: 24px;
+}
+.bk-version-log-detail .bk-version-log-detail-content h3 {
+  font-size: 18px;
+}
+.bk-version-log-detail .bk-version-log-detail-content h4 {
+  font-size: 16px;
+}
+.bk-version-log-detail .bk-version-log-detail-content h5 {
+  font-size: 14px;
+}
+.bk-version-log-detail .bk-version-log-detail-content em {
+  font-style: italic;
+}
+.bk-version-log-detail .bk-version-log-detail-content div,
+.bk-version-log-detail .bk-version-log-detail-content p,
+.bk-version-log-detail .bk-version-log-detail-content font,
+.bk-version-log-detail .bk-version-log-detail-content span,
+.bk-version-log-detail .bk-version-log-detail-content li {
+  line-height: 1.3;
+}
+.bk-version-log-detail .bk-version-log-detail-content p {
+  margin: 0 0 1em;
+}
+.bk-version-log-detail .bk-version-log-detail-content table,
+.bk-version-log-detail .bk-version-log-detail-content table p {
+  margin: 0;
+}
+.bk-version-log-detail .bk-version-log-detail-content ul,
+.bk-version-log-detail .bk-version-log-detail-content ol {
+  padding-left: 40px;
+  margin: 10px 0 10px;
+  text-indent: 0;
+}
+.bk-version-log-detail .bk-version-log-detail-content ul {
+  list-style: disc;
+}
+.bk-version-log-detail .bk-version-log-detail-content ul > li {
+  line-height: 1.8;
+  white-space: normal;
+  list-style: disc;
+}
+.bk-version-log-detail .bk-version-log-detail-content ol {
+  list-style: decimal;
+}
+.bk-version-log-detail .bk-version-log-detail-content ol > li {
+  line-height: 1.8;
+  white-space: normal;
+  list-style: decimal;
+}
+.bk-version-log-detail .bk-version-log-detail-content li > ul {
+  margin-bottom: 10px;
+}
+.bk-version-log-detail .bk-version-log-detail-content li ol {
+  padding-left: 20px !important;
+}
+.bk-version-log-detail .bk-version-log-detail-content ul ul,
+.bk-version-log-detail .bk-version-log-detail-content ul ol,
+.bk-version-log-detail .bk-version-log-detail-content ol ol,
+.bk-version-log-detail .bk-version-log-detail-content ol ul {
+  margin-bottom: 0;
+  margin-left: 20px;
+}
+.bk-version-log-detail .bk-version-log-detail-content pre,
+.bk-version-log-detail .bk-version-log-detail-content code {
+  width: 95%;
+  padding: 0 3px 2px;
+  font-family: Monaco, Menlo, Consolas, 'Courier New', monospace;
+  font-size: 14px;
+  color: #333;
+  border-radius: 3px;
+}
+.bk-version-log-detail .bk-version-log-detail-content code {
+  padding: 2px 4px;
+  font-family: Consolas, monospace, tahoma, Arial;
+  color: #d14;
+  border: 1px solid #e1e1e8;
+}
+.bk-version-log-detail .bk-version-log-detail-content pre {
+  display: block;
+  padding: 9.5px;
+  margin: 0 0 10px;
+  font-family: Consolas, monospace, tahoma, Arial;
+  font-size: 13px;
+  word-break: break-all;
+  word-wrap: break-word;
+  white-space: pre-wrap;
+  background-color: #f6f6f6;
+  border: 1px solid #ddd;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  border-radius: 2px;
+}
+.bk-version-log-detail .bk-version-log-detail-content pre code {
+  padding: 0;
+  white-space: pre-wrap;
+  border: 0;
+}
+.bk-version-log-detail .bk-version-log-detail-content blockquote {
+  padding: 0 0 0 14px;
+  margin: 0 0 20px;
+  border-left: 5px solid #dfdfdf;
+}
+.bk-version-log-detail .bk-version-log-detail-content blockquote ::before,
+.bk-version-log-detail .bk-version-log-detail-content blockquote ::after {
+  content: '';
+}
+.bk-version-log-detail .bk-version-log-detail-content blockquote p {
+  margin-bottom: 0;
+  font-size: 14px;
+  font-weight: 300;
+  line-height: 25px;
+}
+.bk-version-log-detail .bk-version-log-detail-content blockquote small {
+  display: block;
+  line-height: 20px;
+  color: #999;
+}
+.bk-version-log-detail .bk-version-log-detail-content blockquote small ::before {
+  content: '\2014 \00A0';
+}

package/lib/version-log/version-log.d.ts

@@ -0,0 +1,203 @@
+/**
+ * Tencent is pleased to support the open source community by making
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
+ *
+ * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
+ *
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
+ *
+ * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
+ *
+ * ---------------------------------------------------
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
+ * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
+ * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
+ * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
+ * the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
+ * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
+ * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */
+import { ExtractPropTypes } from 'vue';
+declare const versionLogProps: {
+    show: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    };
+    list: import("vue-types").VueTypeDef<{
+        [key: string]: any;
+    }[]> & {
+        default: () => {
+            [key: string]: any;
+        }[];
+    };
+    titleKey: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    subTitleKey: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    detailKey: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    active: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    };
+    current: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    };
+    loading: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
+    detail: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    minLeftWidth: import("vue-types").VueTypeValidableDef<number> & {
+        default: number;
+    } & {
+        default: number;
+    };
+    maxLeftWidth: import("vue-types").VueTypeValidableDef<number> & {
+        default: number;
+    } & {
+        default: number;
+    };
+};
+export type versionLogPropTypes = ExtractPropTypes<typeof versionLogProps>;
+declare const _default: import("vue").DefineComponent<{
+    show: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    };
+    list: import("vue-types").VueTypeDef<{
+        [key: string]: any;
+    }[]> & {
+        default: () => {
+            [key: string]: any;
+        }[];
+    };
+    titleKey: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    subTitleKey: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    detailKey: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    active: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    };
+    current: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    };
+    loading: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
+    detail: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    minLeftWidth: import("vue-types").VueTypeValidableDef<number> & {
+        default: number;
+    } & {
+        default: number;
+    };
+    maxLeftWidth: import("vue-types").VueTypeValidableDef<number> & {
+        default: number;
+    } & {
+        default: number;
+    };
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("selected" | "update:show")[], "selected" | "update:show", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    show: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    };
+    list: import("vue-types").VueTypeDef<{
+        [key: string]: any;
+    }[]> & {
+        default: () => {
+            [key: string]: any;
+        }[];
+    };
+    titleKey: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    subTitleKey: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    detailKey: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    active: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    };
+    current: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    };
+    loading: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
+    detail: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    } & {
+        default: string;
+    };
+    minLeftWidth: import("vue-types").VueTypeValidableDef<number> & {
+        default: number;
+    } & {
+        default: number;
+    };
+    maxLeftWidth: import("vue-types").VueTypeValidableDef<number> & {
+        default: number;
+    } & {
+        default: number;
+    };
+}>> & {
+    onSelected?: (...args: any[]) => any;
+    "onUpdate:show"?: (...args: any[]) => any;
+}, {
+    show: boolean;
+    active: string;
+    list: {
+        [key: string]: any;
+    }[];
+    loading: boolean;
+    current: string;
+    detail: string;
+    titleKey: string;
+    subTitleKey: string;
+    detailKey: string;
+    minLeftWidth: number;
+    maxLeftWidth: number;
+}, {}>;
+export default _default;

package/lib/version-log/version-log.less

@@ -0,0 +1,239 @@
+@import '../styles/themes/themes.less';
+
+.@{bk-prefix}-version-log-dialog {
+  .@{bk-prefix}-modal-header {
+    display: none;
+  }
+  &.@{bk-prefix}-dialog-wrapper .@{bk-prefix}-modal-content {
+    padding: 0 !important;
+    height: 100%;
+  }
+}
+
+.@{bk-prefix}-version-log {
+  height: 100%;
+  .@{bk-prefix}-resize-layout {
+    height: 100%;
+  }
+  .@{bk-prefix}-resize-layout-aside {
+    padding: 20px 0;
+    height: 100%;
+    background: #fafbfd;
+  }
+}
+
+.@{bk-prefix}-version-log-list-side {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  border-top: 1px solid #dcdee5;
+  border-bottom: 1px solid #dcdee5;
+  overflow: auto;
+  .@{bk-prefix}-version-log-version-item {
+    flex: 0 0 54px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    position: relative;
+    padding-left: 30px;
+    border-bottom: 1px solid #dcdee5;
+    &:hover {
+      cursor: pointer;
+      background-color: #ffffff;
+    }
+    .@{bk-prefix}-version-log-version-item-title {
+      color: #313238;
+      font-size: 16px;
+    }
+    .@{bk-prefix}-version-log-version-item-subtitle {
+      color: #979ba5;
+      font-size: 12px;
+    }
+    .@{bk-prefix}-version-log-crt-tag {
+      position: absolute;
+      right: 20px;
+      top: 8px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      padding: 0 5px;
+      height: 20px;
+      font-size: 12px;
+      color: #ffffff;
+      background-color: #699df4;
+      border-radius: 2px;
+    }
+    &.is-active {
+      &::before {
+        content: ' ';
+        position: absolute;
+        top: 0px;
+        bottom: 0px;
+        left: 0;
+        width: 6px;
+        background-color: #3a84ff;
+      }
+      background-color: #ffffff;
+    }
+  }
+}
+
+.@{bk-prefix}-version-log-loading {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+}
+
+.@{bk-prefix}-version-log-detail {
+  padding: 25px 20px 50px 40px;
+  height: 100%;
+  .@{bk-prefix}-version-log-detail-content {
+    height: 100%;
+    overflow: auto;
+    font-size: 14px;
+    color: #313238;
+    h1,
+    h2,
+    h3,
+    h4,
+    h5 {
+      height: auto;
+      margin: 10px 0;
+      font:
+        normal 14px/1.5 'Helvetica Neue',
+        Helvetica,
+        Arial,
+        'Lantinghei SC',
+        'Hiragino Sans GB',
+        'Microsoft Yahei',
+        sans-serif;
+      font-weight: bold;
+      color: #34383e;
+    }
+    h1 {
+      font-size: 30px;
+    }
+    h2 {
+      font-size: 24px;
+    }
+    h3 {
+      font-size: 18px;
+    }
+    h4 {
+      font-size: 16px;
+    }
+    h5 {
+      font-size: 14px;
+    }
+    em {
+      font-style: italic;
+    }
+    div,
+    p,
+    font,
+    span,
+    li {
+      line-height: 1.3;
+    }
+    p {
+      margin: 0 0 1em;
+    }
+    table,
+    table p {
+      margin: 0;
+    }
+    ul,
+    ol {
+      padding-left: 40px;
+      margin: 10px 0 10px;
+      text-indent: 0;
+    }
+    ul {
+      list-style: disc;
+      & > li {
+        line-height: 1.8;
+        white-space: normal;
+        list-style: disc;
+      }
+    }
+    ol {
+      list-style: decimal;
+      & > li {
+        line-height: 1.8;
+        white-space: normal;
+        list-style: decimal;
+      }
+    }
+    li > ul {
+      margin-bottom: 10px;
+    }
+    li ol {
+      padding-left: 20px !important;
+    }
+    ul ul,
+    ul ol,
+    ol ol,
+    ol ul {
+      margin-bottom: 0;
+      margin-left: 20px;
+    }
+    pre,
+    code {
+      width: 95%;
+      padding: 0 3px 2px;
+      font-family: Monaco, Menlo, Consolas, 'Courier New', monospace;
+      font-size: 14px;
+      color: #333;
+      border-radius: 3px;
+    }
+    code {
+      padding: 2px 4px;
+      font-family: Consolas, monospace, tahoma, Arial;
+      color: #d14;
+      border: 1px solid #e1e1e8;
+    }
+    pre {
+      display: block;
+      padding: 9.5px;
+      margin: 0 0 10px;
+      font-family: Consolas, monospace, tahoma, Arial;
+      font-size: 13px;
+      word-break: break-all;
+      word-wrap: break-word;
+      white-space: pre-wrap;
+      background-color: #f6f6f6;
+      border: 1px solid #ddd;
+      border: 1px solid rgba(0, 0, 0, 0.15);
+      border-radius: 2px;
+      code {
+        padding: 0;
+        white-space: pre-wrap;
+        border: 0;
+      }
+    }
+    blockquote {
+      padding: 0 0 0 14px;
+      margin: 0 0 20px;
+      border-left: 5px solid #dfdfdf;
+      ::before,
+      ::after {
+        content: '';
+      }
+      p {
+        margin-bottom: 0;
+        font-size: 14px;
+        font-weight: 300;
+        line-height: 25px;
+      }
+      small {
+        display: block;
+        line-height: 20px;
+        color: #999;
+        ::before {
+          content: '\2014 \00A0';
+        }
+      }
+    }
+  }
+}