swordpass-ui 1.0.0

package/src/styles/selector.scss

@@ -0,0 +1,127 @@
+//弹窗样式
+.dialog-selector__wrapper {
+  overflow: unset !important;
+
+  ::v-deep {
+    @media (max-width: 1400px) {
+      .el-dialog {
+        width: 90%;
+        height: 90%;
+        margin-top: 4vh !important;
+        .cl-selector__table {
+          height: 380px;
+        }
+      }
+    }
+
+    @media (min-width: 1400px) {
+      .el-dialog {
+        width: 1260px;
+      }
+    }
+
+    .el-dialog {
+      min-width: 910px;
+      height: 76%;
+      .el-dialog__header {
+        background: #f8f8f8;
+        padding: 6px 20px;
+        height: 24px;
+        line-height: 24px;
+        border-bottom: 1px solid #eee;
+        border-radius: 2px 2px 0 0;
+      }
+
+      .el-dialog__title {
+        font-size: 16px;
+        color: #333;
+      }
+
+      .el-dialog__headerbtn {
+        top: 11px;
+      }
+      .el-dialog__body {
+        height: calc(100% - 120px);
+        padding-top: 10px;
+        padding-bottom: 10px;
+        overflow: auto;
+        font-size: 12px;
+        .el-main {
+          padding-top: 0;
+          padding-bottom: 0;
+        }
+        .el-container {
+          height: 100%;
+        }
+      }
+      .el-input__inner {
+        font-size: 12px;
+      }
+      .left-aside {
+        overflow: unset;
+        .box-card {
+          height: calc(100% - 2px);
+          .el-card__body {
+            max-height: unset;
+            overflow: auto;
+            height: calc(100% - 90px);
+          }
+        }
+      }
+    }
+
+    .el-pagination {
+      padding: 5px;
+
+      .el-input--suffix.el-input--mini > .el-input__inner {
+        height: 22px;
+      }
+    }
+
+    //弹窗底部按钮样式
+    .dialog-footer {
+      text-align: center;
+    }
+  }
+}
+
+// 移动端选择器样式
+.mobile-dialog {
+  ::v-deep .el-dialog {
+    width: 100%;
+    min-width: 100%;
+    height: 100vh;
+    margin-top: 0 !important;
+    border-radius: 0;
+    .el-dialog__header {
+      border-radius: 0;
+    }
+    .el-dialog__body {
+      height: calc(100% - 90px);
+      padding: 0;
+    }
+    .el-dialog__footer {
+      padding: 5px 0 0 0;
+    }
+    .el-pager,
+    .el-row {
+      line-height: 1;
+    }
+    .el-footer {
+      padding: 10px;
+    }
+    .el-main {
+      padding: 0;
+    }
+    .el-tabs__header {
+      margin: 0;
+      padding: 5px 20px;
+    }
+    .cl-header__search {
+      padding: 15px 10px 0 10px;
+    }
+    .cl-selector__table {
+      height: 100%;
+    }
+  }
+}

package/src/styles/variables.scss

@@ -0,0 +1,71 @@
+$--font-size-extra-large: 20px !default;
+$--font-size-large: 16px !default;
+$--font-size-medium: 14px !default;
+$--font-size-base: 12px !default;
+$--font-size-small: 10px !default;
+$--font-size-extra-small: 9px !default;
+/* 改变主题色变量 */
+$base-color-black: #000000 !default;
+$base-color-white: #ffffff !default;
+$base-color-blue: #409eff !default;
+$base-color-green: #67c23a !default;
+$base-color-gray: #909399 !default;
+$base-color-orange: #cf9236 !default;
+$base-color-red: #dd6161 !default;
+
+@mixin base-scrollbar {
+  &::-webkit-scrollbar {
+    width: 13px;
+    height: 13px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: rgba(0, 0, 0, 0.4);
+    background-clip: padding-box;
+    border: 3px solid transparent;
+    border-radius: 7px;
+  }
+
+  &::-webkit-scrollbar-thumb:hover {
+    background-color: rgba(0, 0, 0, 0.5);
+  }
+
+  &::-webkit-scrollbar-track {
+    background-color: transparent;
+  }
+
+  &::-webkit-scrollbar-track:hover {
+    background-color: #f8fafc;
+  }
+}
+
+.cl-typography__header {
+  position: relative;
+  padding-left: var(--header-padding-left);
+
+  &::before {
+    content: "";
+    width: var(--bar-width);
+    background-color: var(--bar-color);
+    border-radius: calc(var(--bar-width) / 2);
+    transition: background-color 0.3s var(--bezier);
+    left: 0;
+    top: 0;
+    bottom: 0;
+    position: absolute;
+  }
+}
+
+.el-popover__reference-wrapper > svg.fa-icon.el-popover__reference {
+  vertical-align: -3px;
+}
+
+.inputs.cl-form-inputs__block {
+  display: inline-block;
+  width: 100%;
+}
+
+.inputs.cl-form-inputs__inline {
+  display: inline-block;
+  width: 220px;
+}

package/src/util/base64.js

@@ -0,0 +1,21 @@
+const { Base64 } = require('js-base64')
+
+/**
+ * base64编码
+ * @param {*} content 要编码内容
+ * @param {*} encoding 编码字符集（默认UTF-8）
+ * @returns 编码后的内容
+ */
+export function encode(content, encoding) {
+  return Base64.encode(content, encoding || 'utf-8')
+}
+
+/**
+ * base64解码
+ * @param {*} content 要解码内容
+ * @param {*} encoding 解码字符集（默认UTF-8）
+ * @returns 解码后的内容
+ */
+export function decode(content, encoding) {
+  return Base64.decode(content, encoding || 'utf-8')
+}

package/src/util/brower.js

@@ -0,0 +1,15 @@
+/**
+ * 通过Object创建链接地址
+ * @param {Object} content
+ * @returns
+ */
+export function createObjectURL(content) {
+  if (
+    window.navigator.userAgent.indexOf('Chrome') >= 1 ||
+    window.navigator.userAgent.indexOf('Safari') >= 1
+  ) {
+    return window.webkitURL.createObjectURL(content)
+  } else {
+    return window.URL.createObjectURL(content)
+  }
+}

package/src/util/clone.js

@@ -0,0 +1,61 @@
+const regexpTag = '[object RegExp]'
+
+export default function deepClone(value, stack = new WeakMap()) {
+  if (!isObject(value)) {
+    return value
+  }
+
+  let result = Array.isArray(value) ? [] : {}
+
+  // 函数直接返回
+  if (typeof value === 'function') {
+    return value
+  }
+
+  // 处理引用类型的拷贝
+  result = initCloneByTag(value, getTag(value))
+
+  // 处理循环引用
+  if (stack.has(value)) {
+    return stack.get(value)
+  }
+  stack.set(value, result)
+
+  // 这里没有处理key是Symbol的情况
+  // for in 不会枚举Symbol的key
+  // 可以通过Object.getOwnPropertySymbols获取所有Symbol的key
+  for (let key in value) {
+    result[key] = deepClone(value[key], stack)
+  }
+  return result
+}
+
+function isObject(value) {
+  const type = typeof value
+  return value != null && (type === 'object' || type === 'function')
+}
+
+function getTag(value) {
+  if (value == null) {
+    return value === undefined ? '[object Undefined]' : '[object Null]'
+  }
+  return Object.prototype.toString.call(value)
+}
+
+function cloneRegExp(regexp) {
+  const result = new regexp.constructor(regexp.source, /\w*$/.exec(regexp))
+  result.lastIndex = regexp.lastIndex
+  return result
+}
+
+function initCloneByTag(object, tag) {
+  // 可以在这里处理
+  // arrayBuffer, int32array, dataview等情况
+  switch (tag) {
+    case regexpTag:
+      return cloneRegExp(object)
+
+    default:
+      return {}
+  }
+}

package/src/util/path.js

@@ -0,0 +1,4 @@
+export function extract(url) {
+  const reg = new RegExp(/^(http.*?\/\/.*?)\/.*$/)
+  return reg.test(url) ? reg.exec(url)[1] : ''
+}

package/src/util/request.js

@@ -0,0 +1,14 @@
+const axios = require('axios')
+
+export default function request(url, data = {}, option = {}) {
+  const requestData = {
+    url: url,
+    data: data,
+    method: option.method || 'GET',
+    params: option.params || {},
+    onUploadProgress: option.onUploadProgress || null,
+    headers: option.headers || '',
+    responseType: option.responseType || 'json',
+  }
+  return axios(requestData)
+}