添加统计分析模块

08335 / hivui-platform-template

hivui平台项目模板

Browse code 添加统计分析模块 master
1 parent 5f3923b commit 7a039e9e375d69a33f51a62b3de334a012638b6b hhb authored on 15 Nov 2022

Showing 43 changed files

Ignore Space Show notes View project/hivuiSam/App.vue 0 → 100644
<template> <div> <analysisSam :conf="conf"></analysisSam> </div> </template> <script> import { LoadUtil } from "./funclib/LoadUtil"; import { getToken } from "./utils/auth"; import { projectName, requestUrl } from "@birt/config"; import AnalysisSam from './components/analysisSam/Index.vue' export default { data() { return { birtModel: {}, VUE_APP_BASE_API: requestUrl, pn: projectName \|\| "birt", conf:{} }; }, methods: { // 动态加载报表模型方法 birtModelMethod(routePath, birtModelMethod, scope) { return new Promise((resolve, reject) => { let me = this; let token = getToken(); // let token = '3d3fe30c-3d99-41e8-9aea-addd8528aa07' // let vId = this.getQueryVariable('viewItemId') let vId = window.scpRequestData && window.scpRequestData.__viewItemId LoadUtil.loadJsBirtModel({ loadModelUrl: this.$HI.birtModel, routePath: routePath, token: token, pn: this.pn, vId: vId }) .then(() => { try { let birtModel = getBirtModel(scope \|\| me, cmps.Tool) resolve(birtModel); } catch (e) { console.error(e); } }) .catch(() => { reject(); }); }); }, loadBirtModel(routePath) { return new Promise((resolve, reject) => { let me = this; this.birtModelMethod(routePath, this.birtModelMethod) .then((birtModel) => { me.conf = birtModel; console.log("conf", conf); resolve(); }) .catch(() => { reject(); }); }); }, // 获取地址栏参数 getQueryVariable(variable) { var query = window.location.search.substring(1); var vars = query.split("&"); for (var i = 0; i < vars.length; i++) { var pair = vars[i].split("="); if (pair[0] == variable) { return pair[1]; } } return false; }, }, mounted() { var path = window.location.pathname; // 编译后多e5 if (window.HIVUI_SETTING) { var serverName = window.HIVUI_SETTING.serverName; if (serverName && path.startsWith(serverName)) { path = path.substring(serverName.length); } } this.loadBirtModel(path).then(() => { }); }, }; </script> <style> html,body{ height: 100%; } </style>

Ignore Space Show notes View

project/hivuiSam/App.vue 0 → 100644

<template>
  <div>
    <analysisSam :conf="conf"></analysisSam>
  </div>
</template>
<script>
import { LoadUtil } from "./funclib/LoadUtil";
import { getToken } from "./utils/auth";
import { projectName, requestUrl } from "@birt/config";
import AnalysisSam from './components/analysisSam/Index.vue'
export default {
  data() {
    return {
      birtModel: {},
      VUE_APP_BASE_API: requestUrl,
      pn: projectName || "birt",
      conf:{}
    };
  },
  methods: {
    // 动态加载报表模型方法
    birtModelMethod(routePath, birtModelMethod, scope) {
      return new Promise((resolve, reject) => {
        let me = this;
        let token = getToken();
        // let token = '3d3fe30c-3d99-41e8-9aea-addd8528aa07'
        // let vId = this.getQueryVariable('viewItemId')
        let vId = window.scpRequestData && window.scpRequestData.__viewItemId
        LoadUtil.loadJsBirtModel({
          loadModelUrl: this.$HI.birtModel,
          routePath: routePath,
          token: token,
          pn: this.pn,
          vId: vId
        })
          .then(() => {
            try {
              let birtModel = getBirtModel(scope || me, cmps.Tool)
              resolve(birtModel);
            } catch (e) {
              console.error(e);
            }
          })
          .catch(() => {
            reject();
          });
      });
    },
    loadBirtModel(routePath) {
      return new Promise((resolve, reject) => {
        let me = this;
        this.birtModelMethod(routePath, this.birtModelMethod)
          .then((birtModel) => {
            me.conf = birtModel;
            console.log("conf", conf);
            resolve();
          })
          .catch(() => {
            reject();
          });
      });
    },
    // 获取地址栏参数
    getQueryVariable(variable) {
      var query = window.location.search.substring(1);
      var vars = query.split("&");
      for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split("=");
        if (pair[0] == variable) {
          return pair[1];
        }
      }
      return false;
    },
  },
  mounted() {
    var path = window.location.pathname;
    // 编译后多e5
    if (window.HIVUI_SETTING) {
      var serverName = window.HIVUI_SETTING.serverName;
      if (serverName && path.startsWith(serverName)) {
        path = path.substring(serverName.length);
      }
    }
    this.loadBirtModel(path).then(() => {
    });
  },
};
</script>
<style>
html,body{
  height: 100%;
}
</style>

Ignore Space Show notes View project/hivuiSam/assets/icon/demo.css 0 → 100644
/* Logo 字体 / @font-face { font-family: "iconfont logo"; src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); } .logo { font-family: "iconfont logo"; font-size: 160px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } / tabs / .nav-tabs { position: relative; } .nav-tabs .nav-more { position: absolute; right: 0; bottom: 0; height: 42px; line-height: 42px; color: #666; } #tabs { border-bottom: 1px solid #eee; } #tabs li { cursor: pointer; width: 100px; height: 40px; line-height: 40px; text-align: center; font-size: 16px; border-bottom: 2px solid transparent; position: relative; z-index: 1; margin-bottom: -1px; color: #666; } #tabs .active { border-bottom-color: #f00; color: #222; } .tab-container .content { display: none; } / 页面布局 / .main { padding: 30px 100px; width: 960px; margin: 0 auto; } .main .logo { color: #333; text-align: left; margin-bottom: 30px; line-height: 1; height: 110px; margin-top: -50px; overflow: hidden; zoom: 1; } .main .logo a { font-size: 160px; color: #333; } .helps { margin-top: 40px; } .helps pre { padding: 20px; margin: 10px 0; border: solid 1px #e7e1cd; background-color: #fffdef; overflow: auto; } .icon_lists { width: 100% !important; overflow: hidden; zoom: 1; } .icon_lists li { width: 100px; margin-bottom: 10px; margin-right: 20px; text-align: center; list-style: none !important; cursor: default; } .icon_lists li .code-name { line-height: 1.2; } .icon_lists .icon { display: block; height: 100px; line-height: 100px; font-size: 42px; margin: 10px auto; color: #333; -webkit-transition: font-size 0.25s linear, width 0.25s linear; -moz-transition: font-size 0.25s linear, width 0.25s linear; transition: font-size 0.25s linear, width 0.25s linear; } .icon_lists .icon:hover { font-size: 100px; } .icon_lists .svg-icon { / 通过设置 font-size 来改变图标大小 / width: 1em; / 图标和文字相邻时，垂直对齐 / vertical-align: -0.15em; / 通过设置 color 来改变 SVG 的颜色/fill / fill: currentColor; / path 和 stroke 溢出 viewBox 部分在 IE 下会显示 normalize.css 中也包含这行 / overflow: hidden; } .icon_lists li .name, .icon_lists li .code-name { color: #666; } / markdown 样式 / .markdown { color: #666; font-size: 14px; line-height: 1.8; } .highlight { line-height: 1.5; } .markdown img { vertical-align: middle; max-width: 100%; } .markdown h1 { color: #404040; font-weight: 500; line-height: 40px; margin-bottom: 24px; } .markdown h2, .markdown h3, .markdown h4, .markdown h5, .markdown h6 { color: #404040; margin: 1.6em 0 0.6em 0; font-weight: 500; clear: both; } .markdown h1 { font-size: 28px; } .markdown h2 { font-size: 22px; } .markdown h3 { font-size: 16px; } .markdown h4 { font-size: 14px; } .markdown h5 { font-size: 12px; } .markdown h6 { font-size: 12px; } .markdown hr { height: 1px; border: 0; background: #e9e9e9; margin: 16px 0; clear: both; } .markdown p { margin: 1em 0; } .markdown>p, .markdown>blockquote, .markdown>.highlight, .markdown>ol, .markdown>ul { width: 80%; } .markdown ul>li { list-style: circle; } .markdown>ul li, .markdown blockquote ul>li { margin-left: 20px; padding-left: 4px; } .markdown>ul li p, .markdown>ol li p { margin: 0.6em 0; } .markdown ol>li { list-style: decimal; } .markdown>ol li, .markdown blockquote ol>li { margin-left: 20px; padding-left: 4px; } .markdown code { margin: 0 3px; padding: 0 5px; background: #eee; border-radius: 3px; } .markdown strong, .markdown b { font-weight: 600; } .markdown>table { border-collapse: collapse; border-spacing: 0px; empty-cells: show; border: 1px solid #e9e9e9; width: 95%; margin-bottom: 24px; } .markdown>table th { white-space: nowrap; color: #333; font-weight: 600; } .markdown>table th, .markdown>table td { border: 1px solid #e9e9e9; padding: 8px 16px; text-align: left; } .markdown>table th { background: #F7F7F7; } .markdown blockquote { font-size: 90%; color: #999; border-left: 4px solid #e9e9e9; padding-left: 0.8em; margin: 1em 0; } .markdown blockquote p { margin: 0; } .markdown .anchor { opacity: 0; transition: opacity 0.3s ease; margin-left: 8px; } .markdown .waiting { color: #ccc; } .markdown h1:hover .anchor, .markdown h2:hover .anchor, .markdown h3:hover .anchor, .markdown h4:hover .anchor, .markdown h5:hover .anchor, .markdown h6:hover .anchor { opacity: 1; display: inline-block; } .markdown>br, .markdown>p>br { clear: both; } .hljs { display: block; background: white; padding: 0.5em; color: #333333; overflow-x: auto; } .hljs-comment, .hljs-meta { color: #969896; } .hljs-string, .hljs-variable, .hljs-template-variable, .hljs-strong, .hljs-emphasis, .hljs-quote { color: #df5000; } .hljs-keyword, .hljs-selector-tag, .hljs-type { color: #a71d5d; } .hljs-literal, .hljs-symbol, .hljs-bullet, .hljs-attribute { color: #0086b3; } .hljs-section, .hljs-name { color: #63a35c; } .hljs-tag { color: #333333; } .hljs-title, .hljs-attr, .hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #795da3; } .hljs-addition { color: #55a532; background-color: #eaffea; } .hljs-deletion { color: #bd2c00; background-color: #ffecec; } .hljs-link { text-decoration: underline; } / 代码高亮 / / PrismJS 1.15.0 https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript / /* * prism.js default theme for JavaScript, CSS and HTML * Based on dabblet (http://dabblet.com) * @author Lea Verou / code[class="language-"], pre[class="language-"] { color: black; background: none; text-shadow: 0 1px white; font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; word-wrap: normal; line-height: 1.5; -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; } pre[class="language-"]::-moz-selection, pre[class="language-"] ::-moz-selection, code[class="language-"]::-moz-selection, code[class="language-"] ::-moz-selection { text-shadow: none; background: #b3d4fc; } pre[class="language-"]::selection, pre[class="language-"] ::selection, code[class="language-"]::selection, code[class="language-"] ::selection { text-shadow: none; background: #b3d4fc; } @media print { code[class="language-"], pre[class="language-"] { text-shadow: none; } } / Code blocks / pre[class="language-"] { padding: 1em; margin: .5em 0; overflow: auto; } :not(pre)>code[class="language-"], pre[class="language-"] { background: #f5f2f0; } /* Inline code / :not(pre)>code[class="language-"] { padding: .1em; border-radius: .3em; white-space: normal; } .token.comment, .token.prolog, .token.doctype, .token.cdata { color: slategray; } .token.punctuation { color: #999; } .namespace { opacity: .7; } .token.property, .token.tag, .token.boolean, .token.number, .token.constant, .token.symbol, .token.deleted { color: #905; } .token.selector, .token.attr-name, .token.string, .token.char, .token.builtin, .token.inserted { color: #690; } .token.operator, .token.entity, .token.url, .language-css .token.string, .style .token.string { color: #9a6e3a; background: hsla(0, 0%, 100%, .5); } .token.atrule, .token.attr-value, .token.keyword { color: #07a; } .token.function, .token.class-name { color: #DD4A68; } .token.regex, .token.important, .token.variable { color: #e90; } .token.important, .token.bold { font-weight: bold; } .token.italic { font-style: italic; } .token.entity { cursor: help; }

Ignore Space Show notes View

project/hivuiSam/assets/icon/demo.css 0 → 100644

/* Logo 字体 */
@font-face {
  font-family: "iconfont logo";
  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
}

.logo {
  font-family: "iconfont logo";
  font-size: 160px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* tabs */
.nav-tabs {
  position: relative;
}

.nav-tabs .nav-more {
  position: absolute;
  right: 0;
  bottom: 0;
  height: 42px;
  line-height: 42px;
  color: #666;
}

#tabs {
  border-bottom: 1px solid #eee;
}

#tabs li {
  cursor: pointer;
  width: 100px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
  border-bottom: 2px solid transparent;
  position: relative;
  z-index: 1;
  margin-bottom: -1px;
  color: #666;
}

#tabs .active {
  border-bottom-color: #f00;
  color: #222;
}

.tab-container .content {
  display: none;
}

/* 页面布局 */
.main {
  padding: 30px 100px;
  width: 960px;
  margin: 0 auto;
}

.main .logo {
  color: #333;
  text-align: left;
  margin-bottom: 30px;
  line-height: 1;
  height: 110px;
  margin-top: -50px;
  overflow: hidden;
  *zoom: 1;
}

.main .logo a {
  font-size: 160px;
  color: #333;
}

.helps {
  margin-top: 40px;
}

.helps pre {
  padding: 20px;
  margin: 10px 0;
  border: solid 1px #e7e1cd;
  background-color: #fffdef;
  overflow: auto;
}

.icon_lists {
  width: 100% !important;
  overflow: hidden;
  *zoom: 1;
}

.icon_lists li {
  width: 100px;
  margin-bottom: 10px;
  margin-right: 20px;
  text-align: center;
  list-style: none !important;
  cursor: default;
}

.icon_lists li .code-name {
  line-height: 1.2;
}

.icon_lists .icon {
  display: block;
  height: 100px;
  line-height: 100px;
  font-size: 42px;
  margin: 10px auto;
  color: #333;
  -webkit-transition: font-size 0.25s linear, width 0.25s linear;
  -moz-transition: font-size 0.25s linear, width 0.25s linear;
  transition: font-size 0.25s linear, width 0.25s linear;
}

.icon_lists .icon:hover {
  font-size: 100px;
}

.icon_lists .svg-icon {
  /* 通过设置 font-size 来改变图标大小 */
  width: 1em;
  /* 图标和文字相邻时，垂直对齐 */
  vertical-align: -0.15em;
  /* 通过设置 color 来改变 SVG 的颜色/fill */
  fill: currentColor;
  /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
      normalize.css 中也包含这行 */
  overflow: hidden;
}

.icon_lists li .name,
.icon_lists li .code-name {
  color: #666;
}

/* markdown 样式 */
.markdown {
  color: #666;
  font-size: 14px;
  line-height: 1.8;
}

.highlight {
  line-height: 1.5;
}

.markdown img {
  vertical-align: middle;
  max-width: 100%;
}

.markdown h1 {
  color: #404040;
  font-weight: 500;
  line-height: 40px;
  margin-bottom: 24px;
}

.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6 {
  color: #404040;
  margin: 1.6em 0 0.6em 0;
  font-weight: 500;
  clear: both;
}

.markdown h1 {
  font-size: 28px;
}

.markdown h2 {
  font-size: 22px;
}

.markdown h3 {
  font-size: 16px;
}

.markdown h4 {
  font-size: 14px;
}

.markdown h5 {
  font-size: 12px;
}

.markdown h6 {
  font-size: 12px;
}

.markdown hr {
  height: 1px;
  border: 0;
  background: #e9e9e9;
  margin: 16px 0;
  clear: both;
}

.markdown p {
  margin: 1em 0;
}

.markdown>p,
.markdown>blockquote,
.markdown>.highlight,
.markdown>ol,
.markdown>ul {
  width: 80%;
}

.markdown ul>li {
  list-style: circle;
}

.markdown>ul li,
.markdown blockquote ul>li {
  margin-left: 20px;
  padding-left: 4px;
}

.markdown>ul li p,
.markdown>ol li p {
  margin: 0.6em 0;
}

.markdown ol>li {
  list-style: decimal;
}

.markdown>ol li,
.markdown blockquote ol>li {
  margin-left: 20px;
  padding-left: 4px;
}

.markdown code {
  margin: 0 3px;
  padding: 0 5px;
  background: #eee;
  border-radius: 3px;
}

.markdown strong,
.markdown b {
  font-weight: 600;
}

.markdown>table {
  border-collapse: collapse;
  border-spacing: 0px;
  empty-cells: show;
  border: 1px solid #e9e9e9;
  width: 95%;
  margin-bottom: 24px;
}

.markdown>table th {
  white-space: nowrap;
  color: #333;
  font-weight: 600;
}

.markdown>table th,
.markdown>table td {
  border: 1px solid #e9e9e9;
  padding: 8px 16px;
  text-align: left;
}

.markdown>table th {
  background: #F7F7F7;
}

.markdown blockquote {
  font-size: 90%;
  color: #999;
  border-left: 4px solid #e9e9e9;
  padding-left: 0.8em;
  margin: 1em 0;
}

.markdown blockquote p {
  margin: 0;
}

.markdown .anchor {
  opacity: 0;
  transition: opacity 0.3s ease;
  margin-left: 8px;
}

.markdown .waiting {
  color: #ccc;
}

.markdown h1:hover .anchor,
.markdown h2:hover .anchor,
.markdown h3:hover .anchor,
.markdown h4:hover .anchor,
.markdown h5:hover .anchor,
.markdown h6:hover .anchor {
  opacity: 1;
  display: inline-block;
}

.markdown>br,
.markdown>p>br {
  clear: both;
}

.hljs {
  display: block;
  background: white;
  padding: 0.5em;
  color: #333333;
  overflow-x: auto;
}

.hljs-comment,
.hljs-meta {
  color: #969896;
}

.hljs-string,
.hljs-variable,
.hljs-template-variable,
.hljs-strong,
.hljs-emphasis,
.hljs-quote {
  color: #df5000;
}

.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
  color: #a71d5d;
}

.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute {
  color: #0086b3;
}

.hljs-section,
.hljs-name {
  color: #63a35c;
}

.hljs-tag {
  color: #333333;
}

.hljs-title,
.hljs-attr,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
  color: #795da3;
}

.hljs-addition {
  color: #55a532;
  background-color: #eaffea;
}

.hljs-deletion {
  color: #bd2c00;
  background-color: #ffecec;
}

.hljs-link {
  text-decoration: underline;
}

/* 代码高亮 */
/* PrismJS 1.15.0
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
/**
 * prism.js default theme for JavaScript, CSS and HTML
 * Based on dabblet (http://dabblet.com)
 * @author Lea Verou
 */
code[class*="language-"],
pre[class*="language-"] {
  color: black;
  background: none;
  text-shadow: 0 1px white;
  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  word-wrap: normal;
  line-height: 1.5;

-moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;

-webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
}

pre[class*="language-"]::-moz-selection,
pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection,
code[class*="language-"] ::-moz-selection {
  text-shadow: none;
  background: #b3d4fc;
}

pre[class*="language-"]::selection,
pre[class*="language-"] ::selection,
code[class*="language-"]::selection,
code[class*="language-"] ::selection {
  text-shadow: none;
  background: #b3d4fc;
}

@media print {

code[class*="language-"],
  pre[class*="language-"] {
    text-shadow: none;
  }
}

/* Code blocks */
pre[class*="language-"] {
  padding: 1em;
  margin: .5em 0;
  overflow: auto;
}

:not(pre)>code[class*="language-"],
pre[class*="language-"] {
  background: #f5f2f0;
}

/* Inline code */
:not(pre)>code[class*="language-"] {
  padding: .1em;
  border-radius: .3em;
  white-space: normal;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
  color: slategray;
}

.token.punctuation {
  color: #999;
}

.namespace {
  opacity: .7;
}

.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
  color: #905;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
  color: #690;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
  color: #9a6e3a;
  background: hsla(0, 0%, 100%, .5);
}

.token.atrule,
.token.attr-value,
.token.keyword {
  color: #07a;
}

.token.function,
.token.class-name {
  color: #DD4A68;
}

.token.regex,
.token.important,
.token.variable {
  color: #e90;
}

.token.important,
.token.bold {
  font-weight: bold;
}

.token.italic {
  font-style: italic;
}

.token.entity {
  cursor: help;
}

Ignore Space Show notes View project/hivuiSam/assets/icon/demo_index.html 0 → 100644
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>iconfont Demo</title> <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon"/> <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg"/> <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css"> <link rel="stylesheet" href="demo.css"> <link rel="stylesheet" href="iconfont.css"> <script src="iconfont.js"></script> <!-- jQuery --> <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script> <!-- 代码高亮 --> <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script> <style> .main .logo { margin-top: 0; height: auto; } .main .logo a { display: flex; align-items: center; } .main .logo .sub-title { margin-left: 0.5em; font-size: 22px; color: #fff; background: linear-gradient(-45deg, #3967FF, #B500FE); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } </style> </head> <body> <div class="main"> <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank"> <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg"> </a></h1> <div class="nav-tabs"> <ul id="tabs" class="dib-box"> <li class="dib active"><span>Unicode</span></li> <li class="dib"><span>Font class</span></li> <li class="dib"><span>Symbol</span></li> </ul> <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1417123" target="_blank" class="nav-more">查看项目</a> </div> <div class="tab-container"> <div class="content unicode" style="display: block;"> <ul class="icon_lists dib-box"> <li class="dib"> <span class="icon iconfont"></span> <div class="name">工作流程图</div> <div class="code-name">&#xe602;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">功能</div> <div class="code-name">&#xe604;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">组织机构</div> <div class="code-name">&#xe63c;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">根节点</div> <div class="code-name">&#xe810;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">部门</div> <div class="code-name">&#xe62b;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">岗位</div> <div class="code-name">&#xe65c;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">全屏</div> <div class="code-name">&#xeb11;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">权限</div> <div class="code-name">&#xe63f;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">关闭其它</div> <div class="code-name">&#xe631;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">关闭</div> <div class="code-name">&#xe629;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">关闭所有</div> <div class="code-name">&#xe60f;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">刷新</div> <div class="code-name">&#xe619;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">tree</div> <div class="code-name">&#xe6e8;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">退出</div> <div class="code-name">&#xe627;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">sort16</div> <div class="code-name">&#xe630;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">sort</div> <div class="code-name">&#xe93c;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">-sort-2</div> <div class="code-name">&#xe73d;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">edit</div> <div class="code-name">&#xe62f;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">arrows down</div> <div class="code-name">&#xe623;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">arrows down</div> <div class="code-name">&#xe6fc;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">check-box-empty</div> <div class="code-name">&#xe625;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">check-box</div> <div class="code-name">&#xe626;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">add</div> <div class="code-name">&#xe6ee;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">delete</div> <div class="code-name">&#xe698;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">info</div> <div class="code-name">&#xe60a;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">error</div> <div class="code-name">&#xe620;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">warn</div> <div class="code-name">&#xe601;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">close</div> <div class="code-name">&#xe607;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">set</div> <div class="code-name">&#xe61e;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">设置</div> <div class="code-name">&#xe61d;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">图表</div> <div class="code-name">&#xe632;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">cc-arrow-right-circle</div> <div class="code-name">&#xe6f8;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">arrow</div> <div class="code-name">&#xe6f6;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">arrow</div> <div class="code-name">&#xe6f7;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">cc-arrow-right-circle</div> <div class="code-name">&#xe6fa;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">cc-arrow-right-circle</div> <div class="code-name">&#xe6fb;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">search</div> <div class="code-name">&#xe621;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">clock</div> <div class="code-name">&#xe600;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">arrow</div> <div class="code-name">&#xe636;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">table</div> <div class="code-name">&#xe699;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">cc-arrow-right-circle</div> <div class="code-name">&#xe60d;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">help</div> <div class="code-name">&#xe65d;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">yxx_mark</div> <div class="code-name">&#xe63d;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">钱</div> <div class="code-name">&#xe640;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">报表2</div> <div class="code-name">&#xe6d2;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">待办</div> <div class="code-name">&#xe64a;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">切换</div> <div class="code-name">&#xe60e;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">消息</div> <div class="code-name">&#xe6eb;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">time</div> <div class="code-name">&#xe64d;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">画板主题</div> <div class="code-name">&#xe664;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">邮箱</div> <div class="code-name">&#xe6af;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">email</div> <div class="code-name">&#xe628;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">会议管理</div> <div class="code-name">&#xe612;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">今日收入</div> <div class="code-name">&#xe645;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">user</div> <div class="code-name">&#xe606;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">add</div> <div class="code-name">&#xe654;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">sun</div> <div class="code-name">&#xe6f5;</div> </li> </ul> <div class="article markdown"> <h2 id="unicode-">Unicode 引用</h2> <hr> <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p> <ul> <li>支持按字体的方式去动态调整图标大小，颜色等等。</li> <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li> </ul> <blockquote> <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p> </blockquote> <p>Unicode 使用步骤如下：</p> <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3> <pre><code class="language-css" >@font-face { font-family: 'iconfont'; src: url('iconfont.woff2?t=1641282764308') format('woff2'), url('iconfont.woff?t=1641282764308') format('woff'), url('iconfont.ttf?t=1641282764308') format('truetype'); } </code></pre> <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3> <pre><code class="language-css" >.iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } </code></pre> <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3> <pre> <code class="language-html" ><span class="iconfont">&#x33;</span> </code></pre> <blockquote> <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p> </blockquote> </div> </div> <div class="content font-class"> <ul class="icon_lists dib-box"> <li class="dib"> <span class="icon iconfont icon-flow"></span> <div class="name"> 工作流程图 </div> <div class="code-name">.icon-flow </div> </li> <li class="dib"> <span class="icon iconfont icon-func"></span> <div class="name"> 功能 </div> <div class="code-name">.icon-func </div> </li> <li class="dib"> <span class="icon iconfont icon-org"></span> <div class="name"> 组织机构 </div> <div class="code-name">.icon-org </div> </li> <li class="dib"> <span class="icon iconfont icon-root"></span> <div class="name"> 根节点 </div> <div class="code-name">.icon-root </div> </li> <li class="dib"> <span class="icon iconfont icon-dpt"></span> <div class="name"> 部门 </div> <div class="code-name">.icon-dpt </div> </li> <li class="dib"> <span class="icon iconfont icon-ptm"></span> <div class="name"> 岗位 </div> <div class="code-name">.icon-ptm </div> </li> <li class="dib"> <span class="icon iconfont icon-quanping"></span> <div class="name"> 全屏 </div> <div class="code-name">.icon-quanping </div> </li> <li class="dib"> <span class="icon iconfont icon-quanxian"></span> <div class="name"> 权限 </div> <div class="code-name">.icon-quanxian </div> </li> <li class="dib"> <span class="icon iconfont icon-closeOther"></span> <div class="name"> 关闭其它 </div> <div class="code-name">.icon-closeOther </div> </li> <li class="dib"> <span class="icon iconfont icon-close-circle"></span> <div class="name"> 关闭 </div> <div class="code-name">.icon-close-circle </div> </li> <li class="dib"> <span class="icon iconfont icon-closeAll"></span> <div class="name"> 关闭所有 </div> <div class="code-name">.icon-closeAll </div> </li> <li class="dib"> <span class="icon iconfont icon-refresh"></span> <div class="name"> 刷新 </div> <div class="code-name">.icon-refresh </div> </li> <li class="dib"> <span class="icon iconfont icon-tree"></span> <div class="name"> tree </div> <div class="code-name">.icon-tree </div> </li> <li class="dib"> <span class="icon iconfont icon-tuichu"></span> <div class="name"> 退出 </div> <div class="code-name">.icon-tuichu </div> </li> <li class="dib"> <span class="icon iconfont icon-moveSort2"></span> <div class="name"> sort16 </div> <div class="code-name">.icon-moveSort2 </div> </li> <li class="dib"> <span class="icon iconfont icon-moveSort1"></span> <div class="name"> sort </div> <div class="code-name">.icon-moveSort1 </div> </li> <li class="dib"> <span class="icon iconfont icon-moveSort"></span> <div class="name"> -sort-2 </div> <div class="code-name">.icon-moveSort </div> </li> <li class="dib"> <span class="icon iconfont icon-edit"></span> <div class="name"> edit </div> <div class="code-name">.icon-edit </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-leftMore-circle"></span> <div class="name"> arrows down </div> <div class="code-name">.icon-arrow-leftMore-circle </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-rightMore-circle"></span> <div class="name"> arrows down </div> <div class="code-name">.icon-arrow-rightMore-circle </div> </li> <li class="dib"> <span class="icon iconfont icon-checkbox-empty"></span> <div class="name"> check-box-empty </div> <div class="code-name">.icon-checkbox-empty </div> </li> <li class="dib"> <span class="icon iconfont icon-checkbox"></span> <div class="name"> check-box </div> <div class="code-name">.icon-checkbox </div> </li> <li class="dib"> <span class="icon iconfont icon-add"></span> <div class="name"> add </div> <div class="code-name">.icon-add </div> </li> <li class="dib"> <span class="icon iconfont icon-delete"></span> <div class="name"> delete </div> <div class="code-name">.icon-delete </div> </li> <li class="dib"> <span class="icon iconfont icon-info"></span> <div class="name"> info </div> <div class="code-name">.icon-info </div> </li> <li class="dib"> <span class="icon iconfont icon-error"></span> <div class="name"> error </div> <div class="code-name">.icon-error </div> </li> <li class="dib"> <span class="icon iconfont icon-warn"></span> <div class="name"> warn </div> <div class="code-name">.icon-warn </div> </li> <li class="dib"> <span class="icon iconfont icon-close"></span> <div class="name"> close </div> <div class="code-name">.icon-close </div> </li> <li class="dib"> <span class="icon iconfont icon-set-fill"></span> <div class="name"> set </div> <div class="code-name">.icon-set-fill </div> </li> <li class="dib"> <span class="icon iconfont icon-set"></span> <div class="name"> 设置 </div> <div class="code-name">.icon-set </div> </li> <li class="dib"> <span class="icon iconfont icon-chart"></span> <div class="name"> 图表 </div> <div class="code-name">.icon-chart </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-down-circle"></span> <div class="name"> cc-arrow-right-circle </div> <div class="code-name">.icon-arrow-down-circle </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-down"></span> <div class="name"> arrow </div> <div class="code-name">.icon-arrow-down </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-left"></span> <div class="name"> arrow </div> <div class="code-name">.icon-arrow-left </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-up-circle"></span> <div class="name"> cc-arrow-right-circle </div> <div class="code-name">.icon-arrow-up-circle </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-left-circle"></span> <div class="name"> cc-arrow-right-circle </div> <div class="code-name">.icon-arrow-left-circle </div> </li> <li class="dib"> <span class="icon iconfont icon-search"></span> <div class="name"> search </div> <div class="code-name">.icon-search </div> </li> <li class="dib"> <span class="icon iconfont icon-clock"></span> <div class="name"> clock </div> <div class="code-name">.icon-clock </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-right"></span> <div class="name"> arrow </div> <div class="code-name">.icon-arrow-right </div> </li> <li class="dib"> <span class="icon iconfont icon-table"></span> <div class="name"> table </div> <div class="code-name">.icon-table </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-right-circle"></span> <div class="name"> cc-arrow-right-circle </div> <div class="code-name">.icon-arrow-right-circle </div> </li> <li class="dib"> <span class="icon iconfont icon-help"></span> <div class="name"> help </div> <div class="code-name">.icon-help </div> </li> <li class="dib"> <span class="icon iconfont icon-mark"></span> <div class="name"> yxx_mark </div> <div class="code-name">.icon-mark </div> </li> <li class="dib"> <span class="icon iconfont icon-money"></span> <div class="name"> 钱 </div> <div class="code-name">.icon-money </div> </li> <li class="dib"> <span class="icon iconfont icon-analyse"></span> <div class="name"> 报表2 </div> <div class="code-name">.icon-analyse </div> </li> <li class="dib"> <span class="icon iconfont icon-dealt"></span> <div class="name"> 待办 </div> <div class="code-name">.icon-dealt </div> </li> <li class="dib"> <span class="icon iconfont icon-change"></span> <div class="name"> 切换 </div> <div class="code-name">.icon-change </div> </li> <li class="dib"> <span class="icon iconfont icon-bell"></span> <div class="name"> 消息 </div> <div class="code-name">.icon-bell </div> </li> <li class="dib"> <span class="icon iconfont icon-time"></span> <div class="name"> time </div> <div class="code-name">.icon-time </div> </li> <li class="dib"> <span class="icon iconfont icon-skin"></span> <div class="name"> 画板主题 </div> <div class="code-name">.icon-skin </div> </li> <li class="dib"> <span class="icon iconfont icon-mail"></span> <div class="name"> 邮箱 </div> <div class="code-name">.icon-mail </div> </li> <li class="dib"> <span class="icon iconfont icon-email"></span> <div class="name"> email </div> <div class="code-name">.icon-email </div> </li> <li class="dib"> <span class="icon iconfont icon-meeting"></span> <div class="name"> 会议管理 </div> <div class="code-name">.icon-meeting </div> </li> <li class="dib"> <span class="icon iconfont icon-today"></span> <div class="name"> 今日收入 </div> <div class="code-name">.icon-today </div> </li> <li class="dib"> <span class="icon iconfont icon-user"></span> <div class="name"> user </div> <div class="code-name">.icon-user </div> </li> <li class="dib"> <span class="icon iconfont icon-listadd"></span> <div class="name"> add </div> <div class="code-name">.icon-listadd </div> </li> <li class="dib"> <span class="icon iconfont icon-sun"></span> <div class="name"> sun </div> <div class="code-name">.icon-sun </div> </li> </ul> <div class="article markdown"> <h2 id="font-class-">font-class 引用</h2> <hr> <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p> <p>与 Unicode 使用方式相比，具有如下特点：</p> <ul> <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li> <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li> </ul> <p>使用步骤如下：</p> <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3> <pre><code class="language-html"><link rel="stylesheet" href="./iconfont.css"> </code></pre> <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3> <pre><code class="language-html"><span class="iconfont icon-xxx"></span> </code></pre> <blockquote> <p>" iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p> </blockquote> </div> </div> <div class="content symbol"> <ul class="icon_lists dib-box"> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-flow"></use> </svg> <div class="name">工作流程图</div> <div class="code-name">#icon-flow</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-func"></use> </svg> <div class="name">功能</div> <div class="code-name">#icon-func</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-org"></use> </svg> <div class="name">组织机构</div> <div class="code-name">#icon-org</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-root"></use> </svg> <div class="name">根节点</div> <div class="code-name">#icon-root</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-dpt"></use> </svg> <div class="name">部门</div> <div class="code-name">#icon-dpt</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-ptm"></use> </svg> <div class="name">岗位</div> <div class="code-name">#icon-ptm</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-quanping"></use> </svg> <div class="name">全屏</div> <div class="code-name">#icon-quanping</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-quanxian"></use> </svg> <div class="name">权限</div> <div class="code-name">#icon-quanxian</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-closeOther"></use> </svg> <div class="name">关闭其它</div> <div class="code-name">#icon-closeOther</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-close-circle"></use> </svg> <div class="name">关闭</div> <div class="code-name">#icon-close-circle</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-closeAll"></use> </svg> <div class="name">关闭所有</div> <div class="code-name">#icon-closeAll</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-refresh"></use> </svg> <div class="name">刷新</div> <div class="code-name">#icon-refresh</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-tree"></use> </svg> <div class="name">tree</div> <div class="code-name">#icon-tree</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-tuichu"></use> </svg> <div class="name">退出</div> <div class="code-name">#icon-tuichu</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-moveSort2"></use> </svg> <div class="name">sort16</div> <div class="code-name">#icon-moveSort2</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-moveSort1"></use> </svg> <div class="name">sort</div> <div class="code-name">#icon-moveSort1</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-moveSort"></use> </svg> <div class="name">-sort-2</div> <div class="code-name">#icon-moveSort</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-edit"></use> </svg> <div class="name">edit</div> <div class="code-name">#icon-edit</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-arrow-leftMore-circle"></use> </svg> <div class="name">arrows down</div> <div class="code-name">#icon-arrow-leftMore-circle</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-arrow-rightMore-circle"></use> </svg> <div class="name">arrows down</div> <div class="code-name">#icon-arrow-rightMore-circle</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-checkbox-empty"></use> </svg> <div class="name">check-box-empty</div> <div class="code-name">#icon-checkbox-empty</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-checkbox"></use> </svg> <div class="name">check-box</div> <div class="code-name">#icon-checkbox</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-add"></use> </svg> <div class="name">add</div> <div class="code-name">#icon-add</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-delete"></use> </svg> <div class="name">delete</div> <div class="code-name">#icon-delete</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-info"></use> </svg> <div class="name">info</div> <div class="code-name">#icon-info</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-error"></use> </svg> <div class="name">error</div> <div class="code-name">#icon-error</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-warn"></use> </svg> <div class="name">warn</div> <div class="code-name">#icon-warn</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-close"></use> </svg> <div class="name">close</div> <div class="code-name">#icon-close</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-set-fill"></use> </svg> <div class="name">set</div> <div class="code-name">#icon-set-fill</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-set"></use> </svg> <div class="name">设置</div> <div class="code-name">#icon-set</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-chart"></use> </svg> <div class="name">图表</div> <div class="code-name">#icon-chart</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-arrow-down-circle"></use> </svg> <div class="name">cc-arrow-right-circle</div> <div class="code-name">#icon-arrow-down-circle</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-arrow-down"></use> </svg> <div class="name">arrow</div> <div class="code-name">#icon-arrow-down</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-arrow-left"></use> </svg> <div class="name">arrow</div> <div class="code-name">#icon-arrow-left</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-arrow-up-circle"></use> </svg> <div class="name">cc-arrow-right-circle</div> <div class="code-name">#icon-arrow-up-circle</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-arrow-left-circle"></use> </svg> <div class="name">cc-arrow-right-circle</div> <div class="code-name">#icon-arrow-left-circle</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-search"></use> </svg> <div class="name">search</div> <div class="code-name">#icon-search</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-clock"></use> </svg> <div class="name">clock</div> <div class="code-name">#icon-clock</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-arrow-right"></use> </svg> <div class="name">arrow</div> <div class="code-name">#icon-arrow-right</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-table"></use> </svg> <div class="name">table</div> <div class="code-name">#icon-table</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-arrow-right-circle"></use> </svg> <div class="name">cc-arrow-right-circle</div> <div class="code-name">#icon-arrow-right-circle</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-help"></use> </svg> <div class="name">help</div> <div class="code-name">#icon-help</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-mark"></use> </svg> <div class="name">yxx_mark</div> <div class="code-name">#icon-mark</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-money"></use> </svg> <div class="name">钱</div> <div class="code-name">#icon-money</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-analyse"></use> </svg> <div class="name">报表2</div> <div class="code-name">#icon-analyse</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-dealt"></use> </svg> <div class="name">待办</div> <div class="code-name">#icon-dealt</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-change"></use> </svg> <div class="name">切换</div> <div class="code-name">#icon-change</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-bell"></use> </svg> <div class="name">消息</div> <div class="code-name">#icon-bell</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-time"></use> </svg> <div class="name">time</div> <div class="code-name">#icon-time</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-skin"></use> </svg> <div class="name">画板主题</div> <div class="code-name">#icon-skin</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-mail"></use> </svg> <div class="name">邮箱</div> <div class="code-name">#icon-mail</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-email"></use> </svg> <div class="name">email</div> <div class="code-name">#icon-email</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-meeting"></use> </svg> <div class="name">会议管理</div> <div class="code-name">#icon-meeting</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-today"></use> </svg> <div class="name">今日收入</div> <div class="code-name">#icon-today</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-user"></use> </svg> <div class="name">user</div> <div class="code-name">#icon-user</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-listadd"></use> </svg> <div class="name">add</div> <div class="code-name">#icon-listadd</div> </li> <li class="dib"> <svg class="icon svg-icon" aria-hidden="true"> <use xlink:href="#icon-sun"></use> </svg> <div class="name">sun</div> <div class="code-name">#icon-sun</div> </li> </ul> <div class="article markdown"> <h2 id="symbol-">Symbol 引用</h2> <hr> <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a> 这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p> <ul> <li>支持多色图标了，不再受单色限制。</li> <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li> <li>兼容性较差，支持 IE9+，及现代浏览器。</li> <li>浏览器渲染 SVG 的性能一般，还不如 png。</li> </ul> <p>使用步骤如下：</p> <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3> <pre><code class="language-html"><script src="./iconfont.js"></script> </code></pre> <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3> <pre><code class="language-html"><style> .icon { width: 1em; height: 1em; vertical-align: -0.15em; fill: currentColor; overflow: hidden; } </style> </code></pre> <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3> <pre><code class="language-html"><svg class="icon" aria-hidden="true"> <use xlink:href="#icon-xxx"></use> </svg> </code></pre> </div> </div> </div> </div> <script> $(document).ready(function () { $('.tab-container .content:first').show() $('#tabs li').click(function (e) { var tabContent = $('.tab-container .content') var index = $(this).index() if ($(this).hasClass('active')) { return } else { $('#tabs li').removeClass('active') $(this).addClass('active') tabContent.hide().eq(index).fadeIn() } }) }) </script> </body> </html>

Ignore Space Show notes View

project/hivuiSam/assets/icon/demo_index.html 0 → 100644

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>iconfont Demo</title>
  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon"/>
  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
  <style>
    .main .logo {
      margin-top: 0;
      height: auto;
    }

.main .logo a {
      display: flex;
      align-items: center;
    }

.main .logo .sub-title {
      margin-left: 0.5em;
      font-size: 22px;
      color: #fff;
      background: linear-gradient(-45deg, #3967FF, #B500FE);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
  </style>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
      
    </a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1417123" target="_blank" class="nav-more">查看项目</a>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon iconfont">&#xe602;</span>
                <div class="name">工作流程图</div>
                <div class="code-name">&amp;#xe602;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe604;</span>
                <div class="name">功能</div>
                <div class="code-name">&amp;#xe604;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63c;</span>
                <div class="name">组织机构</div>
                <div class="code-name">&amp;#xe63c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe810;</span>
                <div class="name">根节点</div>
                <div class="code-name">&amp;#xe810;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62b;</span>
                <div class="name">部门</div>
                <div class="code-name">&amp;#xe62b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65c;</span>
                <div class="name">岗位</div>
                <div class="code-name">&amp;#xe65c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb11;</span>
                <div class="name">全屏</div>
                <div class="code-name">&amp;#xeb11;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63f;</span>
                <div class="name">权限</div>
                <div class="code-name">&amp;#xe63f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe631;</span>
                <div class="name">关闭其它</div>
                <div class="code-name">&amp;#xe631;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe629;</span>
                <div class="name">关  闭</div>
                <div class="code-name">&amp;#xe629;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60f;</span>
                <div class="name">关闭所有</div>
                <div class="code-name">&amp;#xe60f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe619;</span>
                <div class="name">刷新</div>
                <div class="code-name">&amp;#xe619;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e8;</span>
                <div class="name">tree</div>
                <div class="code-name">&amp;#xe6e8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe627;</span>
                <div class="name">退出</div>
                <div class="code-name">&amp;#xe627;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe630;</span>
                <div class="name">sort16</div>
                <div class="code-name">&amp;#xe630;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe93c;</span>
                <div class="name">sort</div>
                <div class="code-name">&amp;#xe93c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73d;</span>
                <div class="name">-sort-2</div>
                <div class="code-name">&amp;#xe73d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62f;</span>
                <div class="name">edit</div>
                <div class="code-name">&amp;#xe62f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe623;</span>
                <div class="name">arrows down</div>
                <div class="code-name">&amp;#xe623;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6fc;</span>
                <div class="name">arrows down</div>
                <div class="code-name">&amp;#xe6fc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe625;</span>
                <div class="name">check-box-empty</div>
                <div class="code-name">&amp;#xe625;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe626;</span>
                <div class="name">check-box</div>
                <div class="code-name">&amp;#xe626;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ee;</span>
                <div class="name">add</div>
                <div class="code-name">&amp;#xe6ee;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe698;</span>
                <div class="name">delete</div>
                <div class="code-name">&amp;#xe698;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60a;</span>
                <div class="name">info</div>
                <div class="code-name">&amp;#xe60a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe620;</span>
                <div class="name">error</div>
                <div class="code-name">&amp;#xe620;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe601;</span>
                <div class="name">warn</div>
                <div class="code-name">&amp;#xe601;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe607;</span>
                <div class="name">close</div>
                <div class="code-name">&amp;#xe607;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61e;</span>
                <div class="name">set</div>
                <div class="code-name">&amp;#xe61e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61d;</span>
                <div class="name">设置</div>
                <div class="code-name">&amp;#xe61d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe632;</span>
                <div class="name">图表</div>
                <div class="code-name">&amp;#xe632;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f8;</span>
                <div class="name">cc-arrow-right-circle</div>
                <div class="code-name">&amp;#xe6f8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f6;</span>
                <div class="name">arrow</div>
                <div class="code-name">&amp;#xe6f6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f7;</span>
                <div class="name">arrow</div>
                <div class="code-name">&amp;#xe6f7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6fa;</span>
                <div class="name">cc-arrow-right-circle</div>
                <div class="code-name">&amp;#xe6fa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6fb;</span>
                <div class="name">cc-arrow-right-circle</div>
                <div class="code-name">&amp;#xe6fb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe621;</span>
                <div class="name">search</div>
                <div class="code-name">&amp;#xe621;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe600;</span>
                <div class="name">clock</div>
                <div class="code-name">&amp;#xe600;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe636;</span>
                <div class="name">arrow</div>
                <div class="code-name">&amp;#xe636;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe699;</span>
                <div class="name">table</div>
                <div class="code-name">&amp;#xe699;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60d;</span>
                <div class="name">cc-arrow-right-circle</div>
                <div class="code-name">&amp;#xe60d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65d;</span>
                <div class="name">help</div>
                <div class="code-name">&amp;#xe65d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63d;</span>
                <div class="name">yxx_mark</div>
                <div class="code-name">&amp;#xe63d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe640;</span>
                <div class="name">钱</div>
                <div class="code-name">&amp;#xe640;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d2;</span>
                <div class="name">报表2</div>
                <div class="code-name">&amp;#xe6d2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64a;</span>
                <div class="name">待办</div>
                <div class="code-name">&amp;#xe64a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60e;</span>
                <div class="name">切换</div>
                <div class="code-name">&amp;#xe60e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6eb;</span>
                <div class="name">消息</div>
                <div class="code-name">&amp;#xe6eb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64d;</span>
                <div class="name">time</div>
                <div class="code-name">&amp;#xe64d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe664;</span>
                <div class="name">画板主题</div>
                <div class="code-name">&amp;#xe664;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6af;</span>
                <div class="name">邮箱</div>
                <div class="code-name">&amp;#xe6af;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe628;</span>
                <div class="name">email</div>
                <div class="code-name">&amp;#xe628;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe612;</span>
                <div class="name">会议管理</div>
                <div class="code-name">&amp;#xe612;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe645;</span>
                <div class="name">今日收入</div>
                <div class="code-name">&amp;#xe645;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe606;</span>
                <div class="name">user</div>
                <div class="code-name">&amp;#xe606;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe654;</span>
                <div class="name">add</div>
                <div class="code-name">&amp;#xe654;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f5;</span>
                <div class="name">sun</div>
                <div class="code-name">&amp;#xe6f5;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

<p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'iconfont';
  src: url('iconfont.woff2?t=1641282764308') format('woff2'),
       url('iconfont.woff?t=1641282764308') format('woff'),
       url('iconfont.ttf?t=1641282764308') format('truetype');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon iconfont icon-flow"></span>
            <div class="name">
              工作流程图
            </div>
            <div class="code-name">.icon-flow
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-func"></span>
            <div class="name">
              功能
            </div>
            <div class="code-name">.icon-func
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-org"></span>
            <div class="name">
              组织机构
            </div>
            <div class="code-name">.icon-org
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-root"></span>
            <div class="name">
              根节点
            </div>
            <div class="code-name">.icon-root
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dpt"></span>
            <div class="name">
              部门
            </div>
            <div class="code-name">.icon-dpt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ptm"></span>
            <div class="name">
              岗位
            </div>
            <div class="code-name">.icon-ptm
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-quanping"></span>
            <div class="name">
              全屏
            </div>
            <div class="code-name">.icon-quanping
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-quanxian"></span>
            <div class="name">
              权限
            </div>
            <div class="code-name">.icon-quanxian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-closeOther"></span>
            <div class="name">
              关闭其它
            </div>
            <div class="code-name">.icon-closeOther
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-close-circle"></span>
            <div class="name">
              关  闭
            </div>
            <div class="code-name">.icon-close-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-closeAll"></span>
            <div class="name">
              关闭所有
            </div>
            <div class="code-name">.icon-closeAll
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-refresh"></span>
            <div class="name">
              刷新
            </div>
            <div class="code-name">.icon-refresh
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tree"></span>
            <div class="name">
              tree
            </div>
            <div class="code-name">.icon-tree
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tuichu"></span>
            <div class="name">
              退出
            </div>
            <div class="code-name">.icon-tuichu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-moveSort2"></span>
            <div class="name">
              sort16
            </div>
            <div class="code-name">.icon-moveSort2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-moveSort1"></span>
            <div class="name">
              sort
            </div>
            <div class="code-name">.icon-moveSort1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-moveSort"></span>
            <div class="name">
              -sort-2
            </div>
            <div class="code-name">.icon-moveSort
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-edit"></span>
            <div class="name">
              edit
            </div>
            <div class="code-name">.icon-edit
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-arrow-leftMore-circle"></span>
            <div class="name">
              arrows down
            </div>
            <div class="code-name">.icon-arrow-leftMore-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-arrow-rightMore-circle"></span>
            <div class="name">
              arrows down
            </div>
            <div class="code-name">.icon-arrow-rightMore-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-checkbox-empty"></span>
            <div class="name">
              check-box-empty
            </div>
            <div class="code-name">.icon-checkbox-empty
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-checkbox"></span>
            <div class="name">
              check-box
            </div>
            <div class="code-name">.icon-checkbox
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-add"></span>
            <div class="name">
              add
            </div>
            <div class="code-name">.icon-add
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-delete"></span>
            <div class="name">
              delete
            </div>
            <div class="code-name">.icon-delete
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-info"></span>
            <div class="name">
              info
            </div>
            <div class="code-name">.icon-info
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-error"></span>
            <div class="name">
              error
            </div>
            <div class="code-name">.icon-error
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-warn"></span>
            <div class="name">
              warn
            </div>
            <div class="code-name">.icon-warn
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-close"></span>
            <div class="name">
              close
            </div>
            <div class="code-name">.icon-close
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-set-fill"></span>
            <div class="name">
              set
            </div>
            <div class="code-name">.icon-set-fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-set"></span>
            <div class="name">
              设置
            </div>
            <div class="code-name">.icon-set
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-chart"></span>
            <div class="name">
              图表
            </div>
            <div class="code-name">.icon-chart
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-arrow-down-circle"></span>
            <div class="name">
              cc-arrow-right-circle
            </div>
            <div class="code-name">.icon-arrow-down-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-arrow-down"></span>
            <div class="name">
              arrow
            </div>
            <div class="code-name">.icon-arrow-down
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-arrow-left"></span>
            <div class="name">
              arrow
            </div>
            <div class="code-name">.icon-arrow-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-arrow-up-circle"></span>
            <div class="name">
              cc-arrow-right-circle
            </div>
            <div class="code-name">.icon-arrow-up-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-arrow-left-circle"></span>
            <div class="name">
              cc-arrow-right-circle
            </div>
            <div class="code-name">.icon-arrow-left-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-search"></span>
            <div class="name">
              search
            </div>
            <div class="code-name">.icon-search
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-clock"></span>
            <div class="name">
              clock
            </div>
            <div class="code-name">.icon-clock
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-arrow-right"></span>
            <div class="name">
              arrow
            </div>
            <div class="code-name">.icon-arrow-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-table"></span>
            <div class="name">
              table
            </div>
            <div class="code-name">.icon-table
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-arrow-right-circle"></span>
            <div class="name">
              cc-arrow-right-circle
            </div>
            <div class="code-name">.icon-arrow-right-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-help"></span>
            <div class="name">
              help
            </div>
            <div class="code-name">.icon-help
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mark"></span>
            <div class="name">
              yxx_mark
            </div>
            <div class="code-name">.icon-mark
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-money"></span>
            <div class="name">
              钱
            </div>
            <div class="code-name">.icon-money
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-analyse"></span>
            <div class="name">
              报表2
            </div>
            <div class="code-name">.icon-analyse
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dealt"></span>
            <div class="name">
              待办
            </div>
            <div class="code-name">.icon-dealt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-change"></span>
            <div class="name">
              切换
            </div>
            <div class="code-name">.icon-change
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-bell"></span>
            <div class="name">
              消息
            </div>
            <div class="code-name">.icon-bell
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-time"></span>
            <div class="name">
              time
            </div>
            <div class="code-name">.icon-time
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-skin"></span>
            <div class="name">
              画板主题
            </div>
            <div class="code-name">.icon-skin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mail"></span>
            <div class="name">
              邮箱
            </div>
            <div class="code-name">.icon-mail
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-email"></span>
            <div class="name">
              email
            </div>
            <div class="code-name">.icon-email
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-meeting"></span>
            <div class="name">
              会议管理
            </div>
            <div class="code-name">.icon-meeting
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-today"></span>
            <div class="name">
              今日收入
            </div>
            <div class="code-name">.icon-today
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-user"></span>
            <div class="name">
              user
            </div>
            <div class="code-name">.icon-user
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-listadd"></span>
            <div class="name">
              add
            </div>
            <div class="code-name">.icon-listadd
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sun"></span>
            <div class="name">
              sun
            </div>
            <div class="code-name">.icon-sun
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

<p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-flow"></use>
                </svg>
                <div class="name">工作流程图</div>
                <div class="code-name">#icon-flow</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-func"></use>
                </svg>
                <div class="name">功能</div>
                <div class="code-name">#icon-func</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-org"></use>
                </svg>
                <div class="name">组织机构</div>
                <div class="code-name">#icon-org</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-root"></use>
                </svg>
                <div class="name">根节点</div>
                <div class="code-name">#icon-root</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dpt"></use>
                </svg>
                <div class="name">部门</div>
                <div class="code-name">#icon-dpt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ptm"></use>
                </svg>
                <div class="name">岗位</div>
                <div class="code-name">#icon-ptm</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-quanping"></use>
                </svg>
                <div class="name">全屏</div>
                <div class="code-name">#icon-quanping</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-quanxian"></use>
                </svg>
                <div class="name">权限</div>
                <div class="code-name">#icon-quanxian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-closeOther"></use>
                </svg>
                <div class="name">关闭其它</div>
                <div class="code-name">#icon-closeOther</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-close-circle"></use>
                </svg>
                <div class="name">关  闭</div>
                <div class="code-name">#icon-close-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-closeAll"></use>
                </svg>
                <div class="name">关闭所有</div>
                <div class="code-name">#icon-closeAll</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-refresh"></use>
                </svg>
                <div class="name">刷新</div>
                <div class="code-name">#icon-refresh</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tree"></use>
                </svg>
                <div class="name">tree</div>
                <div class="code-name">#icon-tree</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tuichu"></use>
                </svg>
                <div class="name">退出</div>
                <div class="code-name">#icon-tuichu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-moveSort2"></use>
                </svg>
                <div class="name">sort16</div>
                <div class="code-name">#icon-moveSort2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-moveSort1"></use>
                </svg>
                <div class="name">sort</div>
                <div class="code-name">#icon-moveSort1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-moveSort"></use>
                </svg>
                <div class="name">-sort-2</div>
                <div class="code-name">#icon-moveSort</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-edit"></use>
                </svg>
                <div class="name">edit</div>
                <div class="code-name">#icon-edit</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrow-leftMore-circle"></use>
                </svg>
                <div class="name">arrows down</div>
                <div class="code-name">#icon-arrow-leftMore-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrow-rightMore-circle"></use>
                </svg>
                <div class="name">arrows down</div>
                <div class="code-name">#icon-arrow-rightMore-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-checkbox-empty"></use>
                </svg>
                <div class="name">check-box-empty</div>
                <div class="code-name">#icon-checkbox-empty</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-checkbox"></use>
                </svg>
                <div class="name">check-box</div>
                <div class="code-name">#icon-checkbox</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-add"></use>
                </svg>
                <div class="name">add</div>
                <div class="code-name">#icon-add</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-delete"></use>
                </svg>
                <div class="name">delete</div>
                <div class="code-name">#icon-delete</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-info"></use>
                </svg>
                <div class="name">info</div>
                <div class="code-name">#icon-info</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-error"></use>
                </svg>
                <div class="name">error</div>
                <div class="code-name">#icon-error</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-warn"></use>
                </svg>
                <div class="name">warn</div>
                <div class="code-name">#icon-warn</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-close"></use>
                </svg>
                <div class="name">close</div>
                <div class="code-name">#icon-close</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-set-fill"></use>
                </svg>
                <div class="name">set</div>
                <div class="code-name">#icon-set-fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-set"></use>
                </svg>
                <div class="name">设置</div>
                <div class="code-name">#icon-set</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-chart"></use>
                </svg>
                <div class="name">图表</div>
                <div class="code-name">#icon-chart</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrow-down-circle"></use>
                </svg>
                <div class="name">cc-arrow-right-circle</div>
                <div class="code-name">#icon-arrow-down-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrow-down"></use>
                </svg>
                <div class="name">arrow</div>
                <div class="code-name">#icon-arrow-down</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrow-left"></use>
                </svg>
                <div class="name">arrow</div>
                <div class="code-name">#icon-arrow-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrow-up-circle"></use>
                </svg>
                <div class="name">cc-arrow-right-circle</div>
                <div class="code-name">#icon-arrow-up-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrow-left-circle"></use>
                </svg>
                <div class="name">cc-arrow-right-circle</div>
                <div class="code-name">#icon-arrow-left-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-search"></use>
                </svg>
                <div class="name">search</div>
                <div class="code-name">#icon-search</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-clock"></use>
                </svg>
                <div class="name">clock</div>
                <div class="code-name">#icon-clock</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrow-right"></use>
                </svg>
                <div class="name">arrow</div>
                <div class="code-name">#icon-arrow-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-table"></use>
                </svg>
                <div class="name">table</div>
                <div class="code-name">#icon-table</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arrow-right-circle"></use>
                </svg>
                <div class="name">cc-arrow-right-circle</div>
                <div class="code-name">#icon-arrow-right-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-help"></use>
                </svg>
                <div class="name">help</div>
                <div class="code-name">#icon-help</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mark"></use>
                </svg>
                <div class="name">yxx_mark</div>
                <div class="code-name">#icon-mark</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-money"></use>
                </svg>
                <div class="name">钱</div>
                <div class="code-name">#icon-money</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-analyse"></use>
                </svg>
                <div class="name">报表2</div>
                <div class="code-name">#icon-analyse</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dealt"></use>
                </svg>
                <div class="name">待办</div>
                <div class="code-name">#icon-dealt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-change"></use>
                </svg>
                <div class="name">切换</div>
                <div class="code-name">#icon-change</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bell"></use>
                </svg>
                <div class="name">消息</div>
                <div class="code-name">#icon-bell</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-time"></use>
                </svg>
                <div class="name">time</div>
                <div class="code-name">#icon-time</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-skin"></use>
                </svg>
                <div class="name">画板主题</div>
                <div class="code-name">#icon-skin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mail"></use>
                </svg>
                <div class="name">邮箱</div>
                <div class="code-name">#icon-mail</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-email"></use>
                </svg>
                <div class="name">email</div>
                <div class="code-name">#icon-email</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-meeting"></use>
                </svg>
                <div class="name">会议管理</div>
                <div class="code-name">#icon-meeting</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-today"></use>
                </svg>
                <div class="name">今日收入</div>
                <div class="code-name">#icon-today</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-user"></use>
                </svg>
                <div class="name">user</div>
                <div class="code-name">#icon-user</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-listadd"></use>
                </svg>
                <div class="name">add</div>
                <div class="code-name">#icon-listadd</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sun"></use>
                </svg>
                <div class="name">sun</div>
                <div class="code-name">#icon-sun</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

<p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

</div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

$('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>

Ignore Space Show notes View project/hivuiSam/assets/icon/iconfont.css 0 → 100644
@font-face { font-family: "iconfont"; /* Project id 1417123 */ src: url('iconfont.woff2?t=1641282764308') format('woff2'), url('iconfont.woff?t=1641282764308') format('woff'), url('iconfont.ttf?t=1641282764308') format('truetype'); } .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-flow:before { content: "\e602"; } .icon-func:before { content: "\e604"; } .icon-org:before { content: "\e63c"; } .icon-root:before { content: "\e810"; } .icon-dpt:before { content: "\e62b"; } .icon-ptm:before { content: "\e65c"; } .icon-quanping:before { content: "\eb11"; } .icon-quanxian:before { content: "\e63f"; } .icon-closeOther:before { content: "\e631"; } .icon-close-circle:before { content: "\e629"; } .icon-closeAll:before { content: "\e60f"; } .icon-refresh:before { content: "\e619"; } .icon-tree:before { content: "\e6e8"; } .icon-tuichu:before { content: "\e627"; } .icon-moveSort2:before { content: "\e630"; } .icon-moveSort1:before { content: "\e93c"; } .icon-moveSort:before { content: "\e73d"; } .icon-edit:before { content: "\e62f"; } .icon-arrow-leftMore-circle:before { content: "\e623"; } .icon-arrow-rightMore-circle:before { content: "\e6fc"; } .icon-checkbox-empty:before { content: "\e625"; } .icon-checkbox:before { content: "\e626"; } .icon-add:before { content: "\e6ee"; } .icon-delete:before { content: "\e698"; } .icon-info:before { content: "\e60a"; } .icon-error:before { content: "\e620"; } .icon-warn:before { content: "\e601"; } .icon-close:before { content: "\e607"; } .icon-set-fill:before { content: "\e61e"; } .icon-set:before { content: "\e61d"; } .icon-chart:before { content: "\e632"; } .icon-arrow-down-circle:before { content: "\e6f8"; } .icon-arrow-down:before { content: "\e6f6"; } .icon-arrow-left:before { content: "\e6f7"; } .icon-arrow-up-circle:before { content: "\e6fa"; } .icon-arrow-left-circle:before { content: "\e6fb"; } .icon-search:before { content: "\e621"; } .icon-clock:before { content: "\e600"; } .icon-arrow-right:before { content: "\e636"; } .icon-table:before { content: "\e699"; } .icon-arrow-right-circle:before { content: "\e60d"; } .icon-help:before { content: "\e65d"; } .icon-mark:before { content: "\e63d"; } .icon-money:before { content: "\e640"; } .icon-analyse:before { content: "\e6d2"; } .icon-dealt:before { content: "\e64a"; } .icon-change:before { content: "\e60e"; } .icon-bell:before { content: "\e6eb"; } .icon-time:before { content: "\e64d"; } .icon-skin:before { content: "\e664"; } .icon-mail:before { content: "\e6af"; } .icon-email:before { content: "\e628"; } .icon-meeting:before { content: "\e612"; } .icon-today:before { content: "\e645"; } .icon-user:before { content: "\e606"; } .icon-listadd:before { content: "\e654"; } .icon-sun:before { content: "\e6f5"; }

Ignore Space Show notes View

project/hivuiSam/assets/icon/iconfont.css 0 → 100644

@font-face {
  font-family: "iconfont"; /* Project id 1417123 */
  src: url('iconfont.woff2?t=1641282764308') format('woff2'),
       url('iconfont.woff?t=1641282764308') format('woff'),
       url('iconfont.ttf?t=1641282764308') format('truetype');
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-flow:before {
  content: "\e602";
}

.icon-func:before {
  content: "\e604";
}

.icon-org:before {
  content: "\e63c";
}

.icon-root:before {
  content: "\e810";
}

.icon-dpt:before {
  content: "\e62b";
}

.icon-ptm:before {
  content: "\e65c";
}

.icon-quanping:before {
  content: "\eb11";
}

.icon-quanxian:before {
  content: "\e63f";
}

.icon-closeOther:before {
  content: "\e631";
}

.icon-close-circle:before {
  content: "\e629";
}

.icon-closeAll:before {
  content: "\e60f";
}

.icon-refresh:before {
  content: "\e619";
}

.icon-tree:before {
  content: "\e6e8";
}

.icon-tuichu:before {
  content: "\e627";
}

.icon-moveSort2:before {
  content: "\e630";
}

.icon-moveSort1:before {
  content: "\e93c";
}

.icon-moveSort:before {
  content: "\e73d";
}

.icon-edit:before {
  content: "\e62f";
}

.icon-arrow-leftMore-circle:before {
  content: "\e623";
}

.icon-arrow-rightMore-circle:before {
  content: "\e6fc";
}

.icon-checkbox-empty:before {
  content: "\e625";
}

.icon-checkbox:before {
  content: "\e626";
}

.icon-add:before {
  content: "\e6ee";
}

.icon-delete:before {
  content: "\e698";
}

.icon-info:before {
  content: "\e60a";
}

.icon-error:before {
  content: "\e620";
}

.icon-warn:before {
  content: "\e601";
}

.icon-close:before {
  content: "\e607";
}

.icon-set-fill:before {
  content: "\e61e";
}

.icon-set:before {
  content: "\e61d";
}

.icon-chart:before {
  content: "\e632";
}

.icon-arrow-down-circle:before {
  content: "\e6f8";
}

.icon-arrow-down:before {
  content: "\e6f6";
}

.icon-arrow-left:before {
  content: "\e6f7";
}

.icon-arrow-up-circle:before {
  content: "\e6fa";
}

.icon-arrow-left-circle:before {
  content: "\e6fb";
}

.icon-search:before {
  content: "\e621";
}

.icon-clock:before {
  content: "\e600";
}

.icon-arrow-right:before {
  content: "\e636";
}

.icon-table:before {
  content: "\e699";
}

.icon-arrow-right-circle:before {
  content: "\e60d";
}

.icon-help:before {
  content: "\e65d";
}

.icon-mark:before {
  content: "\e63d";
}

.icon-money:before {
  content: "\e640";
}

.icon-analyse:before {
  content: "\e6d2";
}

.icon-dealt:before {
  content: "\e64a";
}

.icon-change:before {
  content: "\e60e";
}

.icon-bell:before {
  content: "\e6eb";
}

.icon-time:before {
  content: "\e64d";
}

.icon-skin:before {
  content: "\e664";
}

.icon-mail:before {
  content: "\e6af";
}

.icon-email:before {
  content: "\e628";
}

.icon-meeting:before {
  content: "\e612";
}

.icon-today:before {
  content: "\e645";
}

.icon-user:before {
  content: "\e606";
}

.icon-listadd:before {
  content: "\e654";
}

.icon-sun:before {
  content: "\e6f5";
}

Ignore Space Show notes View project/hivuiSam/assets/icon/iconfont.js 0 → 100644
!function(c){var l,a,h,t,o,i='<svg><symbol id="icon-flow" viewBox="0 0 1024 1024"><path d="M983.964 953.145 846.307 953.145c-21.721 0-39.33-17.575-39.33-39.249L806.977 796.141c0-21.677 17.609-39.249 39.33-39.249l39.33 0L885.637 580.263c0-21.679-17.607-39.251-39.33-39.251L531.664 541.012l0 215.88 39.332 0c21.721 0 39.33 17.572 39.33 39.249l0 117.756c0 21.674-17.609 39.249-39.33 39.249L433.34 953.146c-21.723 0-39.33-17.575-39.33-39.249L394.01 796.141c0-21.677 17.607-39.249 39.33-39.249l39.33 0 0-215.88L177.693 541.012c-21.721 0-39.33 17.572-39.33 39.251l0 176.629 39.33 0c21.721 0 39.33 17.572 39.33 39.249l0 117.756c0 21.674-17.609 39.249-39.33 39.249L40.036 953.146c-21.721 0-39.33-17.575-39.33-39.249L0.706 796.141c0-21.677 17.609-39.249 39.33-39.249l39.33 0L79.366 560.636c0-43.355 35.219-78.502 78.663-78.502L472.67 482.134 472.67 266.257l-39.33 0c-21.723 0-39.33-17.575-39.33-39.253L394.01 109.252c0-21.679 17.607-39.251 39.33-39.251l137.657 0c21.721 0 39.33 17.572 39.33 39.251l0 117.751c0 21.679-17.609 39.253-39.33 39.253l-39.332 0 0 215.878 334.309 0c43.441 0 78.66 35.147 78.66 78.502l0 196.255 39.33 0c21.721 0 39.33 17.572 39.33 39.249l0 117.756C1023.294 935.571 1005.684 953.145 983.964 953.145z" ></path></symbol><symbol id="icon-func" viewBox="0 0 1024 1024"><path d="M63.3 151.3h896v174.2h-896V151.3zM63.3 425.1h896v174.2h-896V425.1zM63.3 698.9h896v174.2h-896V698.9z" ></path></symbol><symbol id="icon-org" viewBox="0 0 1024 1024"><path d="M642.465374 52.211681c6.510503 0 19.531509 6.510503 19.531509 19.563423v169.624136c0 6.542417-6.478589 19.563423-19.531509 19.563423h-254.45216c-6.510503-6.510503-13.05292-13.05292-13.05292-26.073926V65.264601c0-6.574331 6.542417-19.563423 19.595338-19.563423h247.909742v6.510503z m0-52.211681h-254.45216c-39.158761 0-65.232687 32.584429-65.232687 65.264601v169.592221c0 32.584429 26.073926 65.264601 65.232687 65.264602h254.45216c39.126847 0 65.200773-32.680172 65.200773-65.264602V65.264601c0-32.648258-26.105841-65.264601-65.200773-65.264601M224.931497 815.440504v163.17746H61.817864v-163.17746h163.113633z m19.595337-52.179767H48.764944c-19.563423 0-32.584429 12.989092-32.584429 32.584429v195.76189c0 19.595338 13.05292 32.648258 32.584429 32.648258h195.729976c19.563423 0 32.584429-13.05292 32.584429-32.648258V795.845166c0.031914-19.595338-19.563423-32.584429-32.552515-32.584429m345.663031 52.179767v163.17746h-163.049804v-163.17746h163.049804z m13.116748-52.179767h-195.729975c-19.563423 0-32.584429 12.989092-32.58443 32.584429v195.76189c0 19.595338 13.05292 32.648258 32.58443 32.648258h195.729975c19.563423 0 32.584429-13.05292 32.58443-32.648258V795.845166c0.031914-19.595338-12.989092-32.584429-32.58443-32.584429m358.811694 52.179767v163.17746h-163.081718v-163.17746h163.081718z m13.084835-52.179767h-195.793805c-19.563423 0-32.552515 12.989092-32.552515 32.584429v195.76189c0 19.595338 12.957178 32.648258 32.552515 32.648258h195.793805c19.531509 0 32.584429-13.05292 32.584429-32.648258V795.845166c0-19.595338-13.05292-32.584429-32.584429-32.584429m-469.777473-417.438135c-13.05292 0-19.531509 6.446675-19.53151 19.563423v326.163436c0 12.989092 6.478589 19.531509 19.53151 19.531509s19.563423-6.542417 19.563423-19.531509v-326.163436c6.542417-13.116749-6.510503-19.563423-19.563423-19.563423" ></path><path d="M857.726859 456.660724H140.1673c-13.084835 0-19.595338 13.021006-19.595337 19.563424 0 6.606246 6.510503 26.169669 19.595337 26.169669h717.559559c13.021006 0 19.531509-13.05292 19.531509-19.563424 0-6.606246-6.510503-26.169669-19.531509-26.169669z" ></path><path d="M140.1673 456.660724c-13.084835 0-19.595338 13.021006-19.595337 19.563424v182.740883c0 13.05292 13.05292 19.531509 19.595337 19.53151 6.478589 0 19.563423-13.05292 19.563424-19.53151v-176.134638c-0.031914-13.148663-6.574331-26.169669-19.563424-26.169669zM857.726859 456.660724c-13.05292 0-19.563423 13.021006-19.563423 19.563424v182.740883c0 13.05292 13.05292 19.531509 19.563423 19.53151s19.531509-13.05292 19.531509-19.53151v-176.134638c0-13.148663-6.510503-26.169669-19.531509-26.169669z" ></path></symbol><symbol id="icon-root" viewBox="0 0 1024 1024"><path d="M560 832h233.6v-140.8h-233.6V832z m35.2-112h160v76.8h-160v-76.8zM560 412.8v48h-185.6v48h185.6v48h233.6V416h-233.6z m195.2 108.8h-160v-76.8h160v76.8z" ></path><path d="M371.2 691.2V320h92.8V179.2H233.6V320h92.8v419.2c0 25.6 22.4 48 48 48h185.6v-48h-140.8c-25.6 0-48-22.4-48-48z" ></path></symbol><symbol id="icon-dpt" viewBox="0 0 1024 1024"><path d="M79 370.4l342.7 202.2c28.1 16.9 59 25.3 89.9 25.3s61.8-8.4 89.9-25.3l342.7-202.2c19.7-11.2 22.5-42.1 0-56.2L593 89.5c-25.3-16.9-53.4-25.3-81.5-25.3s-56.2 8.4-81.5 25.3L79 314.2c-22.5 14.1-19.6 45 0 56.2z m382-236c14-8.4 30.9-14 50.6-14 19.7 0 36.5 5.6 50.6 14l317.4 205-309 182.6c-19.7 11.2-39.3 16.9-61.8 16.9s-42.1-5.6-61.8-16.9L138 339.5l323-205.1zM76.2 541.7L421.7 758c28.1 16.9 59 25.3 89.9 25.3s61.8-8.4 89.9-25.3L947 541.7c8.4-5.6 14-14 14-22.5 0-22.5-25.3-36.5-42.1-22.5L573.4 713.1c-19.7 11.2-39.3 16.9-61.8 16.9s-42.1-5.6-61.8-16.9L104.3 494c-16.9-14-42.1 0-42.1 22.5 0 11.2 5.6 19.6 14 25.2z m842.7 132L573.4 890c-19.7 11.2-39.3 16.9-61.8 16.9s-42.1-5.6-61.8-16.9L104.3 673.7c-16.9-14-42.1 0-42.1 22.5 0 8.4 5.6 19.7 14 22.5L421.7 935c28.1 16.9 59 25.3 89.9 25.3s61.8-8.4 89.9-25.3L947 718.7c8.4-5.6 14-14 14-22.5 0-22.5-25.3-36.5-42.1-22.5z" ></path></symbol><symbol id="icon-ptm" viewBox="0 0 1024 1024"><path d="M426.666667 170.666667l85.333333 85.333333h341.333333a85.333333 85.333333 0 0 1 85.333334 85.333333v426.666667a85.333333 85.333333 0 0 1-85.333334 85.333333H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V256a85.333333 85.333333 0 0 1 85.333334-85.333333h256z m426.666666 170.666666H170.666667v426.666667h682.666666V341.333333z m-392.533333 247.466667a102.826667 102.826667 0 0 1 102.4 102.4v34.133333H256v-34.133333a102.826667 102.826667 0 0 1 102.4-102.4h102.4z m273.066667-68.266667v68.266667H597.333333v-68.266667h136.533334zM409.6 384a85.333333 85.333333 0 1 1 0 170.666667 85.333333 85.333333 0 0 1 0-170.666667z m392.533333 34.133333v68.266667H597.333333V418.133333h204.8z" ></path></symbol><symbol id="icon-quanping" viewBox="0 0 1024 1024"><path d="M358.4 768H426.666667v85.333333H213.333333v-213.333333h85.333334v68.266667l128-128 59.733333 59.733333-128 128z m345.6 0l-128-128 59.733333-59.733333 132.266667 132.266666V640h85.333333v213.333333h-213.333333v-85.333333h64zM358.4 298.666667l128 128-59.733333 59.733333-128-128V426.666667H213.333333V213.333333h213.333334v85.333334H358.4z m345.6 0H640V213.333333h213.333333v213.333334h-85.333333V354.133333l-132.266667 132.266667-59.733333-59.733333 128-128z" fill="#444444" ></path></symbol><symbol id="icon-quanxian" viewBox="0 0 1552 1024"><path d="M1011.811097 1015.560258H507.375484a160.718452 160.718452 0 0 1-160.536774-160.536774V556.923871A160.718452 160.718452 0 0 1 507.375484 396.387097h504.501677a160.668903 160.668903 0 0 1 160.487226 160.536774V855.04a160.718452 160.718452 0 0 1-160.536774 160.536774zM507.375484 442.252387a114.737548 114.737548 0 0 0-114.671484 114.671484V855.04c0 63.256774 51.41471 114.721032 114.671484 114.721032h504.501677c63.207226 0 114.621935-51.464258 114.621936-114.721032V556.923871a114.737548 114.737548 0 0 0-114.621936-114.671484H507.375484zM1246.967742 214.709677a74.322581 74.322581 0 1 1 0-148.645161 74.322581 74.322581 0 0 1 0 148.645161z m0-33.032258a41.290323 41.290323 0 1 0 0-82.580645 41.290323 41.290323 0 0 0 0 82.580645zM322.064516 74.322581a33.032258 33.032258 0 1 1 0-66.064516 33.032258 33.032258 0 0 1 0 66.064516z m0-16.516129a16.516129 16.516129 0 1 0 0-33.032258 16.516129 16.516129 0 0 0 0 33.032258zM173.419355 875.354839a57.806452 57.806452 0 1 1 0-115.612904 57.806452 57.806452 0 0 1 0 115.612904z m0-33.032258a24.774194 24.774194 0 1 0 0-49.548387 24.774194 24.774194 0 0 0 0 49.548387z" ></path><path d="M194.064516 425.290323v-33.032258a12.387097 12.387097 0 1 1 24.774194 0v33.032258h33.032258a12.387097 12.387097 0 1 1 0 24.774193h-33.032258v33.032258a12.387097 12.387097 0 1 1-24.774194 0v-33.032258h-33.032258a12.387097 12.387097 0 1 1 0-24.774193h33.032258zM1419.792516 726.115097v-23.585032a8.852645 8.852645 0 0 1 17.70529 0v23.585032h23.585033a8.852645 8.852645 0 0 1 0 17.70529h-23.585033v23.585032a8.852645 8.852645 0 0 1-17.70529 0v-23.585032h-23.585032a8.852645 8.852645 0 0 1 0-17.70529h23.585032zM1274.698323 415.859613v-14.170839a5.301677 5.301677 0 0 1 10.603354 0v14.170839h14.170839a5.301677 5.301677 0 0 1 0 10.603355h-14.170839v14.170838a5.301677 5.301677 0 0 1-10.603354 0v-14.170838h-14.170839a5.301677 5.301677 0 0 1 0-10.603355h14.170839zM23.122581 974.451613h1126.4a23.122581 23.122581 0 1 1 0 46.245161H23.122581a23.122581 23.122581 0 1 1 0-46.245161zM1245.316129 974.451613h135.432258a23.122581 23.122581 0 1 1 0 46.245161h-135.432258a23.122581 23.122581 0 1 1 0-46.245161zM1476.541935 974.451613h52.851613a23.122581 23.122581 0 1 1 0 46.245161h-52.851613a23.122581 23.122581 0 1 1 0-46.245161z" ></path><path d="M501.908645 439.378581A22.874839 22.874839 0 0 1 478.967742 416.437677v-114.671483C478.967742 161.213935 595.802839 50.935742 745.571097 49.548387h2.824258c147.307355 1.387355 257.998452 109.369806 257.998451 252.217807v45.86529a22.940903 22.940903 0 0 1-45.86529 0v-45.86529c0-117.198452-91.730581-205.691871-213.570064-206.402065-124.663742 0.710194-222.174968 91.136-222.174968 206.402065v114.671483a22.874839 22.874839 0 0 1-22.874839 22.940904zM731.268129 804.335484a137.761032 137.761032 0 0 1-114.754064-135.630452 137.794065 137.794065 0 0 1 137.612387-137.612387 137.794065 137.794065 0 0 1 137.595871 137.612387 137.827097 137.827097 0 0 1-114.754065 135.630452 23.122581 23.122581 0 0 1 0.082581 1.915871v68.806193c0 12.667871-10.24 22.957419-22.924387 22.990452a22.990452 22.990452 0 0 1-22.940904-22.990452v-68.806193a23.122581 23.122581 0 0 1 0.082581-1.915871z m22.858323-227.377549a91.86271 91.86271 0 0 0-91.747097 91.747097 91.879226 91.879226 0 0 0 91.747097 91.796645 91.86271 91.86271 0 0 0 91.73058-91.747096c0-50.555871-41.224258-91.796645-91.73058-91.796646z" ></path></symbol><symbol id="icon-closeOther" viewBox="0 0 1024 1024"><path d="M512 962C263.9 962 62 760.1 62 512S263.9 62 512 62s450 201.9 450 450-201.9 450-450 450z m0-835.7c-212.7 0-385.7 173-385.7 385.7s173 385.7 385.7 385.7 385.7-173 385.7-385.7-173-385.7-385.7-385.7z" ></path><path d="M807.5 839.6c-8.2 0-16.4-3.1-22.7-9.4l-591-590.9c-12.6-12.6-12.6-32.9 0-45.5s32.9-12.6 45.5 0l590.9 590.9c12.6 12.6 12.6 32.9 0 45.5-6.3 6.2-14.5 9.4-22.7 9.4z" ></path></symbol><symbol id="icon-close-circle" viewBox="0 0 1024 1024"><path d="M512 1016C233.6 1016 8 790.4 8 512S233.6 8 512 8 1016 233.6 1016 512 790.4 1016 512 1016z m0-960C260.8 56 56 260.8 56 512S260.8 968 512 968 968 763.2 968 512 763.2 56 512 56z" ></path><path d="M548.8 512l195.2-195.2c9.6-9.6 9.6-25.6 0-36.8l-1.6-1.6c-9.6-9.6-25.6-9.6-35.2 0L512 475.2 316.8 280c-9.6-9.6-25.6-9.6-35.2 0l-1.6 1.6c-9.6 9.6-9.6 25.6 0 36.8L475.2 512 280 707.2c-9.6 9.6-9.6 25.6 0 36.8l1.6 1.6c9.6 9.6 25.6 9.6 35.2 0L512 548.8l195.2 195.2c9.6 9.6 25.6 9.6 35.2 0l1.6-1.6c9.6-9.6 9.6-25.6 0-36.8L548.8 512z" ></path></symbol><symbol id="icon-closeAll" viewBox="0 0 1024 1024"><path d="M40.960024 0.000026h788.47996a10.270719 10.270719 0 0 1 10.24 10.239999v71.679997a10.270719 10.270719 0 0 1-10.24 10.239999H92.160021v737.279963a10.269439 10.269439 0 0 1-10.239999 10.24H10.240025a10.269439 10.269439 0 0 1-10.239999-10.24V40.960024A40.916478 40.916478 0 0 1 40.960024 0.000026z" ></path><path d="M983.039976 163.840017H204.800015a40.916478 40.916478 0 0 0-40.959998 40.959998v778.239961a40.916478 40.916478 0 0 0 40.959998 40.959998h778.239961a40.916478 40.916478 0 0 0 40.959998-40.959998V204.800015a40.916478 40.916478 0 0 0-40.959998-40.959998z m-51.199997 767.999962H256.000013V256.000013h675.839966z" ></path><path d="M414.813445 773.119987h66.591997a18.440959 18.440959 0 0 0 13.905919-6.42432l98.136315-116.648954 98.136315 116.648954A18.090239 18.090239 0 0 0 705.49119 773.119987h66.591997a8.96 8.96 0 0 0 6.89664-14.764799L640.707834 593.919996l138.384633-164.435192A8.96 8.96 0 0 0 772.195827 414.720005h-66.591997a18.442239 18.442239 0 0 0-13.905919 6.42432l-98.248955 116.648954-98.136315-116.648954A18.091519 18.091519 0 0 0 481.406722 414.720005h-66.593277a8.96 8.96 0 0 0-6.89664 14.764799L546.186238 593.919996 407.916805 758.355188A8.96 8.96 0 0 0 414.813445 773.119987z" ></path></symbol><symbol id="icon-refresh" viewBox="0 0 1024 1024"><path d="M929.536 208c-17.664 0-32 14.336-32 32l0 45.024C819.712 152.896 676.448 64 512 64 264.576 64 64 264.576 64 512s200.576 448 448 448c149.728 0 281.6-73.952 362.88-186.816 0.256-0.256 0.416-0.544 0.64-0.8 0.992-1.408 2.208-2.656 3.2-4.064-0.128-0.064-0.192-0.16-0.32-0.224 3.52-5.184 6.08-11.072 6.08-17.792 0.032-17.856-14.432-32.288-32.224-32.288-12.608 0-23.264 7.424-28.576 17.984l-0.224 0c-69.728 96.768-183.072 160-311.456 160C299.936 896 128 724.064 128 512S299.936 128 512 128c148.544 0 276.832 84.608 340.672 208l-51.136 0c-17.664 0-32 14.336-32 32s14.336 32 32 32l128 0c17.664 0 32-14.336 32-32l0-128C961.536 222.336 947.2 208 929.536 208z" ></path></symbol><symbol id="icon-tree" viewBox="0 0 1024 1024"><path d="M177.697 741.043h185.982c12.353 0.196 22.195 10.36 22.008 22.705-0.195 12.074-9.935 21.804-22.008 21.999h-208.22c-12.328 0.068-22.382-9.859-22.458-22.177V338.968h-22.237c-12.404 0-22.449-10.045-22.449-22.449V227.35c0-12.396 10.045-22.45 22.449-22.45h89.178c12.395 0.017 22.423 10.063 22.44 22.45v89.177c0 12.396-10.045 22.441-22.44 22.441h-22.238v163.831h185.992c12.335-0.017 22.348 9.977 22.365 22.321 0.007 12.344-9.986 22.356-22.331 22.373H177.705v193.55h-0.008zM311.696 227.35c-0.008-12.387 10.037-22.45 22.432-22.45h565.771c12.386 0.017 22.432 10.063 22.45 22.45v89.177c0 12.396-10.045 22.441-22.45 22.441H334.146c-12.396 0-22.449-10.045-22.458-22.441V227.35h0.008z m163.823 253.202c-0.025-12.378 9.985-22.432 22.365-22.457H899.9c12.386 0.025 22.432 10.062 22.45 22.457v89.168c0 12.354-10.021 22.384-22.382 22.384H498.035c-12.396 0.032-22.483-9.986-22.517-22.384v-89.168h0.001z m0 238.255c0-12.371 10.011-22.448 22.517-22.448H899.9c12.386 0.015 22.432 10.061 22.45 22.448v89.169c0.031 12.362-9.943 22.417-22.297 22.449H498.035c-12.396 0.033-22.483-9.978-22.517-22.373v-89.245h0.001z" ></path></symbol><symbol id="icon-tuichu" viewBox="0 0 1024 1024"><path d="M765.824 638.208 765.824 510.592 446.72 510.592 446.72 382.912l319.04 0L765.76 255.232l191.424 191.488L765.824 638.208zM702.016 574.4l0 255.232L382.912 829.632l0 191.488L0 829.632 0 0l702.016 0 0 319.104L638.272 319.104 638.272 63.808 127.68 63.808l255.232 127.68 0 574.336 255.36 0L638.272 574.4 702.016 574.4z" ></path></symbol><symbol id="icon-moveSort2" viewBox="0 0 1024 1024"><path d="M384 320a64 64 0 1 1 0-128 64 64 0 0 1 0 128z m256 0a64 64 0 1 1 0-128 64 64 0 0 1 0 128zM384 576a64 64 0 1 1 0-128 64 64 0 0 1 0 128z m256 0a64 64 0 1 1 0-128 64 64 0 0 1 0 128z m-256 256a64 64 0 1 1 0-128 64 64 0 0 1 0 128z m256 0a64 64 0 1 1 0-128 64 64 0 0 1 0 128z" ></path></symbol><symbol id="icon-moveSort1" viewBox="0 0 1024 1024"><path d="M426.666667 554.666667v-85.333334h341.333333v85.333334h-341.333333z m0 256v-85.333334h170.666666v85.333334h-170.666666z m0-511.914667V213.333333h512v85.418667H426.666667zM256 725.333333h106.666667L213.333333 874.666667 64 725.333333H170.666667V298.666667H64L213.333333 149.333333 362.666667 298.666667H256v426.666666z" ></path></symbol><symbol id="icon-moveSort" viewBox="0 0 1024 1024"><path d="M660.7 187.4c9.2 0 18.1 3.7 24.6 10.2 6.5 6.5 10.2 15.4 10.2 24.6v580.7c0 15.5-10.2 29.1-25.1 33.5-14.9 4.3-30.8-1.7-39.2-14.8-3.8-1.7-7.3-4.1-10.2-7.1l-82-82c-12.8-13.7-12.4-35.1 0.9-48.4 13.3-13.3 34.7-13.6 48.4-0.9l37.6 37.6V222.2c0-9.2 3.7-18.1 10.2-24.6 6.5-6.5 15.4-10.2 24.6-10.2z m166.6 650.4c-9.2 0-18.1-3.7-24.6-10.2-6.5-6.5-10.2-15.4-10.2-24.6V222.2c0-15.5 10.2-29.1 25.1-33.4 14.9-4.3 30.8 1.7 39.1 14.7 3.7 1.6 7.2 4 10.3 7.1l82.1 82.1c9.3 8.7 13.2 21.8 10 34.1-3.2 12.3-12.8 22-25.1 25.1s-25.4-0.7-34.1-10l-37.6-37.6v498.6c0 9.2-3.7 18.1-10.2 24.6-6.7 6.6-15.5 10.3-24.8 10.3z m0 0M99.1 187.4H494c23.2 0 34.8 11.6 34.8 34.8 0 23.2-11.6 34.8-34.8 34.8H99.1c-23.2 0-34.8-11.6-34.8-34.8-0.1-23.2 11.5-34.8 34.8-34.8z m0 0M99.1 466.1h302c19.2 0 34.8 15.6 34.8 34.8 0 19.2-15.6 34.8-34.8 34.8h-302c-19.2 0-34.8-15.6-34.8-34.8-0.1-19.2 15.5-34.8 34.8-34.8z m0 278.8h302c12.4 0 24 6.6 30.2 17.4 6.2 10.8 6.2 24.1 0 34.8-6.2 10.8-17.7 17.4-30.2 17.4h-302c-12.4 0-23.9-6.6-30.2-17.4-6.2-10.8-6.2-24.1 0-34.8 6.2-10.8 17.7-17.4 30.2-17.4z m0 0" ></path></symbol><symbol id="icon-edit" viewBox="0 0 1024 1024"><path d="M870.96462219 885.385565L226.136855 885.385565l99.42411-30.05834062L166.55932906 696.3255875 107.80300531 890.67254c-1.29991875 4.30076437-0.99868312 8.51134969 0.43554469 12.18949594 0.95263406 7.66424344 7.52130094 13.64962594 15.4320975 13.64962593L870.96462219 916.51166094c8.55931687 0 15.5635275-7.00325156 15.5635275-15.5635275S879.52393906 885.385565 870.96462219 885.385565z" ></path><path d="M897.4762475 199.39402719l-74.98372125-74.98372125c-23.20090969-23.20090969-60.81700594-23.20090969-84.01791563 0l-42.97022624 42.97022625 159.00163687 159.00163687 42.97022625-42.97022625C920.67715719 260.21103312 920.67715719 222.59493687 897.4762475 199.39402719z" ></path><path d="M653.10401187 305.18150281L674.30467719 283.98179656 695.50438438 305.18150281 785.605535 395.28265437 833.305355 347.58187531 674.30467719 188.5811975 186.7008725 676.18500219 234.4006925 723.88482219Z" ></path><path d="M345.70279344 835.19076781l-90.09993188-90.09993187 418.69900688-418.69900688 90.09993187 90.09993188-418.69900687 418.69900687Z" ></path></symbol><symbol id="icon-arrow-leftMore-circle" viewBox="0 0 1024 1024"><path d="M107 512a405 405 0 1 0 810 0 405 405 0 0 0-810 0z m-44.99999999 0C62 263.465 263.465 62 512 62.00000001S962 263.465 961.99999999 512s-201.465 450-449.99999999 449.99999999-450-201.465-449.99999999-449.99999999z" ></path><path d="M363.815 512l119.11500001 119.07a22.5 22.5 0 1 1-31.86000001 31.86l-135-135a22.5 22.5 0 0 1 0-31.86l135-135a22.5 22.5 0 0 1 31.86000001 31.86L363.815 512z" ></path><path d="M543.815 512l119.115 119.07a22.5 22.5 0 0 1-31.86 31.86l-135-135a22.5 22.5 0 0 1 0-31.86l135-135a22.5 22.5 0 0 1 31.86 31.86L543.815 512z" ></path></symbol><symbol id="icon-arrow-rightMore-circle" viewBox="0 0 1024 1024"><path d="M917 512a405 405 0 1 0-810 0 405 405 0 0 0 810 0z m44.99999999 0C962 760.535 760.535 962 512 961.99999999S62 760.535 62.00000001 512s201.465-450 449.99999999-449.99999999 450 201.465 449.99999999 449.99999999z" ></path><path d="M660.185 512l-119.11500001-119.07a22.5 22.5 0 1 1 31.86000001-31.86l135 135a22.5 22.5 0 0 1 0 31.86l-135 135a22.5 22.5 0 0 1-31.86000001-31.86L660.185 512z" ></path><path d="M480.185 512l-119.115-119.07a22.5 22.5 0 0 1 31.86-31.86l135 135a22.5 22.5 0 0 1 0 31.86l-135 135a22.5 22.5 0 0 1-31.86-31.86L480.185 512z" ></path></symbol><symbol id="icon-checkbox-empty" viewBox="0 0 1024 1024"><path d="M849.5 118.25c33.75 0 56.25 22.5 56.25 56.25l0 675c0 33.75-22.5 56.25-56.25 56.25L174.5 905.75c-33.75 0-56.25-22.5-56.25-56.25L118.25 174.5c0-33.75 22.5-56.25 56.25-56.25L849.5 118.25M849.5 62L174.5 62C112.625 62 62 112.625 62 174.5l0 675c0 61.875 50.625 112.5 112.5 112.5l675 0c61.875 0 112.5-50.625 112.5-112.5L962 174.5C962 112.625 911.375 62 849.5 62L849.5 62z" ></path></symbol><symbol id="icon-checkbox" viewBox="0 0 1024 1024"><path d="M725.75 303.875L427.625 602 298.25 455.75c-22.5-22.5-56.25-22.5-78.75 0-22.5 22.5-22.5 56.25 0 78.75l163.125 185.625C393.875 731.375 410.75 737 422 737c16.875 0 28.125-5.625 39.375-16.875l337.5-337.5c22.5-22.5 22.5-56.25 0-78.75C782 281.375 742.625 281.375 725.75 303.875z" ></path><path d="M849.5 62L174.5 62C112.625 62 62 112.625 62 174.5l0 675c0 61.875 50.625 112.5 112.5 112.5l675 0c61.875 0 112.5-50.625 112.5-112.5L962 174.5C962 112.625 911.375 62 849.5 62zM905.75 849.5c0 33.75-22.5 56.25-56.25 56.25L174.5 905.75c-33.75 0-56.25-22.5-56.25-56.25L118.25 174.5c0-33.75 22.5-56.25 56.25-56.25l675 0c33.75 0 56.25 22.5 56.25 56.25L905.75 849.5z" ></path></symbol><symbol id="icon-add" viewBox="0 0 1024 1024"><path d="M740.1 484.3L540 484l0.3-200.1c0-15.4-12.5-28-28-28-15.4 0-28 12.5-28 28L484 484l-200.2-0.3c-15.4 0-28 12.5-28 28 0 15.4 12.5 28 28 28l200.2 0.3-0.3 200.2c0 15.4 12.5 28 28 28 15.4 0 28-12.5 28-28L540 540l200.1 0.3c15.4 0 28-12.5 28-28 0-15.4-12.5-28-28-28z" ></path><path d="M512 63.9C264.5 63.9 63.9 264.5 63.9 512S264.5 960.1 512 960.1 960.1 759.5 960.1 512 759.5 63.9 512 63.9z m271.6 719.7c-35.3 35.3-76.4 63-122.1 82.3-47.3 20-97.6 30.2-149.5 30.2S409.8 886 362.5 865.9c-45.7-19.3-86.8-47-122.1-82.3s-63-76.4-82.3-122.1c-20-47.3-30.2-97.6-30.2-149.5s10.1-102.2 30.2-149.5c19.3-45.7 47-86.8 82.3-122.1s76.4-63 122.1-82.3c47.3-20 97.6-30.2 149.5-30.2 51.9 0 102.2 10.1 149.5 30.2 45.7 19.3 86.8 47 122.1 82.3s63 76.4 82.3 122.1c20 47.3 30.2 97.6 30.2 149.5 0 51.9-10.1 102.2-30.2 149.5-19.3 45.7-47 86.8-82.3 122.1z" ></path></symbol><symbol id="icon-delete" viewBox="0 0 1024 1024"><path d="M826.19642832 347.3l-29.6035708 560.79642833a38.79642833 38.79642833 0 0 1-38.73214336 36.73928583H266.10714248a38.79642833 38.79642833 0 0 1-38.73214248-36.73928583L197.80357168 347.3a38.79642833 38.79642833 0 0 1 77.46428584-4.08214248l27.675 524.025h418.11428496l27.64285752-524.025a38.98928584 38.98928584 0 0 1 40.82142832-36.70714336 38.79642833 38.79642833 0 0 1 36.675 40.82142832z m102.85714335-129.85714248c0 21.43928584-17.38928584 38.79642833-38.82857167 38.79642832H133.775a38.79642833 38.79642833 0 0 1 0-77.56071416H347.10714248V91.37857168c0-18.73928584 12.50357168-29.08928584 31.24285752-29.08928584h267.23571416c18.73928584 0 31.24285752 10.35 31.24285752 29.08928584V178.67857168h213.36428584c21.43928584 0 38.79642833 17.35714248 38.79642832 38.79642832zM414.99285752 178.67857168h193.95V130.14285752h-193.95V178.67857168z m16.26428496 630.38571416h0.80357168c18.73928584 0 33.58928584-18 33.13928584-36.77142832l-9.86785752-419.30357168a34.26428584 34.26428584 0 0 0-34.71428496-33.65357168 33.75 33.75 0 0 0-33.13928585 34.48928584l9.83571417 420.20357167c0.45 18.45 15.55714248 35.03571416 33.94285664 35.03571417z m159.94285752 0c18.38571416 0 33.49285752-15.58928584 33.91071416-34.07142832l9.86785752-418.725a34.13571416 34.13571416 0 0 0-33.10714335-34.9714292 33.75 33.75 0 0 0-34.74642833 33.01071416l-9.86785752 419.14285752c-0.45 18.77142832 14.4 35.61428584 33.10714336 35.61428584h0.83571416z" ></path></symbol><symbol id="icon-info" viewBox="0 0 1024 1024"><path d="M512 1024C229.229714 1024 0 794.770286 0 512 0 229.229714 229.229714 0 512 0 794.770286 0 1024 229.229714 1024 512 1024 794.770286 794.770286 1024 512 1024ZM593.188571 203.044571C586.898286 164.644571 561.225143 147.053714 526.848 152.685714 480.365714 160.256 453.485714 205.129143 460.763429 249.6 466.029714 281.929143 492.397714 303.542857 529.773714 297.435429 576.256 289.828571 600.466286 247.478857 593.188571 203.044571ZM593.956571 664.576C572.635429 692.955429 523.52 741.449143 509.366857 743.753143 502.272 744.923429 500.297143 738.998857 502.857143 729.270857L567.478857 464.530286C571.062857 448.365714 574.976 428.032 573.330286 417.901714 569.709714 395.702857 541.805714 377.417143 519.570286 381.074286 466.029714 389.814857 379.136 454.838857 335.469714 530.468571 332.909714 540.196571 343.149714 552.009143 355.620571 552.045714 369.298286 534.272 418.962286 482.56 436.114286 479.780571 441.197714 478.939429 442.185143 485.010286 440.466286 493.568L376.502857 762.368C371.712 783.872 369.664 796.672 371.492571 807.789714 373.467429 819.931429 398.299429 844.909714 424.557714 840.594286 507.428571 827.062857 586.276571 744.667429 617.106286 685.677714 617.984 672.036571 606.061714 662.601143 593.956571 664.576Z" ></path></symbol><symbol id="icon-error" viewBox="0 0 1024 1024"><path d="M512 1024a512 512 0 1 1 512-512 512 512 0 0 1-512 512zM438.857143 506.148571L264.777143 683.154286a46.811429 46.811429 0 1 0 49.737143 78.994285 46.811429 46.811429 0 0 0 14.628571-14.628571L506.148571 570.514286l177.005715 177.005714a46.08 46.08 0 1 0 63.634285-64.365714L570.514286 506.148571l176.274285-176.274285a46.811429 46.811429 0 0 0-49.737142-78.994286 44.617143 44.617143 0 0 0-13.897143 14.628571L506.148571 442.514286 329.142857 265.508571a46.811429 46.811429 0 0 0-64.365714 14.628572 49.005714 49.005714 0 0 0 0 49.005714z" ></path></symbol><symbol id="icon-warn" viewBox="0 0 1102 1024"><path d="M617.721223 39.070296l476.238403 876.385787c12.36676 22.843059 11.657837 50.412269-1.89046 72.703945a75.460865 75.460865 0 0 1-64.433181 35.839972H75.159179a75.460865 75.460865 0 0 1-64.433181-35.839972 72.625175 72.625175 0 0 1-1.89046-72.703945L485.073941 39.070296A75.382096 75.382096 0 0 1 551.397582 0.000788c27.805517 0 53.326728 14.966142 66.40241 39.069508zM601.494774 395.422022c0-40.014738-28.041825-72.467637-62.62149-72.467637-34.658435 0-62.700259 32.452898-62.70026 72.467637V667.175659c0 40.093508 28.120594 72.467637 62.70026 72.467637 34.579666 0 62.62149-32.452898 62.62149-72.467637V395.422022z m-62.62149 389.592316a63.409182 63.409182 0 0 0-62.70026 64.196873c0 35.446127 28.120594 64.196874 62.70026 64.196874 34.579666 0 62.62149-28.750747 62.62149-64.196874a63.487951 63.487951 0 0 0-62.62149-64.196873z" ></path></symbol><symbol id="icon-close" viewBox="0 0 1024 1024"><path d="M777.856 280.192l-33.92-33.952-231.872 231.872-231.84-231.872-33.984 33.888 231.872 231.904-231.84 231.84 33.888 33.984 231.904-231.904 231.84 231.872 33.952-33.888-231.872-231.904z" ></path></symbol><symbol id="icon-set-fill" viewBox="0 0 1024 1024"><path d="M925.6 443.1h-41.4c-19 0-39.1-14.8-44.7-32.9l-23.7-57.7c-9-16.7-5.3-41.3 8-54.7l29.4-29.3c13.4-13.5 13.4-35.4 0-48.8L804.4 171c-13.4-13.4-35.3-13.4-48.8 0l-29.3 29.3c-13.4 13.4-38 17.1-54.8 8.1l-57.6-23.7C595.8 179.1 581 159 581 140V98.5c0-18.9-15.6-34.5-34.4-34.5h-68.9c-19 0-34.5 15.6-34.5 34.5v41.4c0 19-14.8 39.1-32.9 44.7l-57.7 23.7c-16.7 9-41.3 5.3-54.7-8.1l-29.4-29.3c-13.4-13.4-35.3-13.4-48.7 0l-48.7 48.7c-13.4 13.4-13.4 35.4 0 48.8l29.3 29.3c13.5 13.4 17.1 38 8.1 54.7l-23.7 57.7c-5.6 18.1-25.7 32.9-44.7 32.9H98.8c-19 0-34.5 15.5-34.5 34.5v68.9c0 19 15.5 34.5 34.5 34.5h41.3c19 0 39 14.9 44.6 32.9l23.8 57.7c8.9 16.7 5.3 41.4-8.1 54.8l-29.3 29.3c-13.3 13.4-13.3 35.3 0 48.8l48.8 48.8c13.4 13.4 35.3 13.4 48.7 0l29.4-29.3c13.3-13.4 38-17 54.6-8l57.8 23.7c18.1 5.6 32.9 25.7 32.9 44.7v41.2c0 18.9 15.5 34.5 34.5 34.5h68.9c18.9 0 34.4-15.5 34.4-34.5v-41.2c0-19 14.9-39.1 32.9-44.7l57.7-23.7c16.7-9 41.4-5.4 54.8 8l29.2 29.3c13.4 13.4 35.4 13.4 48.8 0l48.8-48.8c13.4-13.4 13.4-35.4 0-48.8l-29.4-29.3c-13.3-13.3-17-38-8-54.8l23.7-57.7c5.7-18.1 25.8-32.9 44.7-32.9h41.4c18.9 0 34.4-15.5 34.4-34.5v-69c-0.1-18.8-15.6-34.3-34.5-34.3m-241.2 68.8c0 95.2-77.1 172.3-172.3 172.3-95.2 0-172.3-77.1-172.3-172.3 0-95.1 77.1-172.3 172.3-172.3 95.2 0.1 172.3 77.2 172.3 172.3" ></path></symbol><symbol id="icon-set" viewBox="0 0 1024 1024"><path d="M836.738547 417.715637h-44.439118c-4.323469 0-8.172123-2.732228-9.526981-6.901177l-8.515954-25.335015c-1.207501-3.605108-0.228197-7.53665 2.413979-10.261715l29.756721-29.747511c23.26282-23.246447 23.26282-61.012585 0-84.268242l-43.557028-43.533492c-11.615549-11.622712-26.852578-17.398252-42.089607-17.398252s-30.5549 5.77554-42.187845 17.398252l-29.65746 29.747511a10.095939 10.095939 0 0 1-7.144724 2.961448 10.857279 10.857279 0 0 1-3.197832-0.480954l-25.350364-8.417717c-4.077875-1.362021-6.900154-5.212722-6.900154-9.543353v-44.577265c0-32.872688-26.706245-59.5687-59.57791-59.5687h-69.52854c-32.871665 0-59.57791 26.697035-59.57791 59.5687v44.421722c0 4.330632-2.724041 8.181333-6.900154 9.535167l-25.254173 8.499582c-1.043772 0.407276-2.169409 0.562818-3.214205 0.562818-2.642177 0-5.13802-1.035586-7.06286-2.961448l-29.740348-29.747511c-11.631922-11.622712-26.868951-17.398252-42.104956-17.398252-15.237029 0-30.53955 5.77554-42.186822 17.398252l-43.525306 43.533492c-23.26282 23.255657-23.26282 61.020772 0 84.268242l29.740348 29.747511c2.724041 2.725064 3.605108 6.655584 2.39863 10.342556l-8.41874 25.335015c-1.353834 4.087085-5.203512 6.901177-9.526981 6.901177h-44.503586c-32.888038 0-59.59326 26.697035-59.59326 59.5687v69.512167c0 32.879851 26.705222 59.57791 59.59326 59.57791h44.405349c4.339842 0 8.18952 2.724041 9.559727 6.891968l8.417716 25.335014c1.207501 3.605108 0.228197 7.53665-2.413979 10.260692l-29.756721 29.747511c-23.246447 23.255657-23.246447 61.013609 0 84.187401l43.557028 43.532469c11.615549 11.623735 26.852578 17.398252 42.186822 17.398252 15.302521 0 30.474059-5.774517 42.089607-17.398252l29.756721-29.747511a10.101055 10.101055 0 0 1 7.128351-2.968612c1.044796 0 2.170432 0.170892 3.214205 0.571005l25.336038 8.41874c4.094248 1.362021 6.900154 5.212722 6.900153 9.543354v44.421722c0 32.863479 26.705222 59.560514 59.577911 59.560514h69.527516c32.889061 0 59.57791-26.697035 59.57791-59.560514v-44.421722c0-4.330632 2.741437-8.181333 6.900154-9.543354l25.416879-8.41874c1.044796-0.325411 2.169409-0.480954 3.214205-0.480954 2.6432 0 5.122671 1.044796 7.04751 2.961448l29.756721 29.755698c11.630898 11.615549 26.851555 17.390066 42.186821 17.390066 15.302521 0 30.474059-5.77554 42.089607-17.390066l43.557029-43.541679c23.24747-23.173792 23.24747-61.012585 0-84.186377l-29.919427-29.903054c-2.724041-2.733251-3.686972-6.656607-2.413979-10.350742l8.41874-25.335015c1.370207-4.087085 5.220908-6.901177 9.559726-6.901177h44.421722c32.871665 0 59.57791-26.697035 59.577911-59.560514v-69.520353c0.078795-32.789801-26.708292-59.486836-59.498093-59.486836z m26.134217 129.008212c0 14.429641-11.712763 26.134217-26.134217 26.134217h-44.439118c-18.760273 0-35.351136 11.95017-41.208541 29.740348l-8.417716 25.343202c-5.285377 15.71082-1.289366 32.708959 10.506284 44.4954l29.755698 29.747511c4.878101 4.885264 7.602142 11.460006 7.602142 18.524912 0 6.972808-2.724041 13.547551-7.602142 18.515702l-43.557028 43.541679c-4.89345 4.885264-11.45182 7.610328-18.434862 7.610328s-13.556761-2.724041-18.531051-7.610328l-29.756721-29.747511c-8.172123-8.181333-19.086707-12.749372-30.702256-12.749372-4.666276 0-9.233292 0.717338-13.800308 2.251274l-25.498744 8.40953c-17.798365 5.938246-29.740348 22.537296-29.740348 41.215704v44.421722c0 14.430664-11.712763 26.13524-26.150589 26.13524h-69.52854c-14.436804 0-26.15059-11.704576-26.15059-26.13524v-44.421722c0-18.760273-11.941983-35.359322-29.740348-41.215704l-25.269523-8.40953c-4.469801-1.533936-9.136078-2.251274-13.866823-2.251274-11.550057 0-22.36538 4.494361-30.800493 12.749372l-29.740348 29.747511c-4.894474 4.885264-11.469216 7.610328-18.451234 7.610328-6.965645 0-13.540388-2.724041-18.515702-7.610328l-43.540656-43.541679c-4.89345-4.885264-7.618515-11.460006-7.618514-18.515702 0-6.982018 2.725064-13.556761 7.618514-18.442024l29.919427-29.829376c11.615549-11.704576 15.627932-28.703739 10.408047-44.421722l-8.41874-25.416879c-5.938246-17.790178-22.529109-29.740348-41.208541-29.740348h-44.503586c-14.4542 0-26.15059-11.704576-26.15059-26.134217v-69.520354c0-14.429641 11.69639-26.142403 26.15059-26.142403h44.405349c18.777669 0 35.368532-11.94096 41.224914-29.740348l8.499581-25.415856c5.13802-15.637142 1.125637-32.627095-10.571776-44.422746l-29.756721-29.739324c-4.89345-4.894474-7.618515-11.469216-7.618515-18.524912 0-6.973832 2.725064-13.548574 7.618515-18.523889l43.540655-43.533493c4.894474-4.894474 11.550057-7.618515 18.515702-7.618514 6.982018 0 13.556761 2.724041 18.451234 7.618514l29.740348 29.747512c8.18952 8.173147 19.086707 12.749372 30.735002 12.749372 4.730745 0 9.461489-0.807389 13.784958-2.251274l25.497721-8.335852c17.799388-5.930059 29.658484-22.529109 29.658483-41.208541v-44.503587c0-14.429641 11.712763-26.134217 26.15059-26.134217h69.52854c14.436804 0 26.15059 11.704576 26.15059 26.134217v44.421723c0 18.760273 11.941983 35.359322 29.740348 41.20854l25.433252 8.499581c4.405333 1.443885 9.054213 2.243087 13.704116 2.243088 11.468193 0 22.381753-4.486174 30.800494-12.741186l29.65746-29.748534c4.894474-4.885264 11.550057-7.618515 18.532075-7.618515s13.540388 2.732228 18.532075 7.618515l43.524283 43.533492c4.894474 4.894474 7.634888 11.469216 7.634888 18.524912 0 6.973832-2.740414 13.548574-7.634888 18.523889l-29.821189 29.821189c-11.712763 11.704576-15.72617 28.785603-10.425444 44.421722l8.41874 25.335015c5.938246 17.798365 22.529109 29.739325 41.22389 29.739325h44.421723c14.437827 0 26.151613 11.713786 26.151613 26.142403v69.438489h0.068561z m-350.84053-168.372755c-73.689303 0-133.674489 59.968813-133.674489 133.648906 0 73.680093 59.985186 133.657092 133.674489 133.657092 73.703629 0 133.689838-59.977 133.689838-133.657092 0-73.680093-59.986209-133.648906-133.689838-133.648906z m0 233.872538c-55.238069 0-100.230796-44.977377-100.230795-100.222609 0-55.238069 44.992727-100.222609 100.230795-100.222609 55.253418 0 100.247168 44.98454 100.247169 100.222609 0 55.244208-44.99375 100.222609-100.247169 100.222609z" ></path></symbol><symbol id="icon-chart" viewBox="0 0 1026 1024"><path d="M972.067982 946.325604H49.546624V23.804245c0-12.881128-10.913178-23.804245-23.794307-23.804245A23.784367 23.784367 0 0 0 1.948072 23.804245v945.749134c0 13.447659 10.356586 24.360837 23.804245 24.360838h946.315665c13.159424 0 23.804245-10.923117 23.804246-24.360838-0.009939-12.314597-10.644821-23.227775-23.804246-23.227775z m-532.797655-39.478273h176.380017c22.12453 0 39.756569-17.920273 39.756569-39.478272V92.960797c0-21.557999-17.632038-39.199977-39.756569-39.199977H439.270327a39.130403 39.130403 0 0 0-39.190037 39.199977v774.418201c0 21.54806 17.353742 39.468334 39.190037 39.468333z m39.199977-774.129966h97.990003V827.900725H478.470304V132.717365zM136.335213 906.847331h176.668252c21.557999 0 39.478273-17.920273 39.478273-39.478272V594.390519c0-22.12453-17.920273-39.756569-39.478273-39.756569H136.335213c-21.836295 0-39.190038 17.632038-39.190037 39.756569v272.97854c0 21.557999 17.363681 39.478273 39.190037 39.478272z m39.756569-273.256835h97.43341v194.310229h-97.43341V633.590496z m566.113659 273.256835H918.873693c21.557999 0 39.190038-17.920273 39.190038-39.478272V303.779941c0-21.557999-17.632038-39.756569-39.190038-39.756568H742.205441c-21.826356 0-39.756569 18.198569-39.756568 39.756568v563.589118c0 21.557999 17.930212 39.478273 39.756568 39.478272z m39.756569-563.589117h97.155115V827.900725h-97.155115V343.258214z" ></path></symbol><symbol id="icon-arrow-down-circle" viewBox="0 0 1024 1024"><path d="M231.91393 792.797779c71.800279 71.14434 170.937161 115.542526 280.334733 115.542526 109.39859599 0 208.534454-44.398186 280.334733-115.542526 71.222111-71.713298 115.669416-170.74273201 115.669416-280.025695l0 0c0-109.282962-44.447305-208.303186-115.669416-280.026718l0 0c-71.800279-71.704089-170.936137-116.111484-280.334733-116.111484l0 0 0 0 0 0c-109.397572 0-208.534454 44.407396-280.334733 116.111484-71.78186 71.724555-116.227118 170.743756-116.227118 280.026718l0 0 0 0C115.686812 622.055047 160.131047 721.084481 231.91393 792.797779L231.91393 792.797779zM829.043796 829.228503c-81.484849 80.8197-193.140858 130.909515-316.796156 130.909515-123.634832 0-235.888452-50.088792-316.795133-130.909515-80.906681-81.387635-131.043568-192.947454-131.043568-316.456419 0-123.50077801 50.135864-235.637742 131.043568-316.447209C276.359188 115.495966 388.613832 65.416384 512.248663 65.416384c123.65529801 0 235.310284 50.079582 316.796156 130.908492C909.950478 277.13332 960.106808 389.271306 960.106808 512.772085l0 0C960.106808 636.281049 909.950478 747.84086799 829.043796 829.228503L829.043796 829.228503zM751.551888 434.239474c4.572132 4.551666 7.408737 10.803044 7.408737 18.210757l0 0c0 3.412726-0.559748 6.828522-1.717108 9.66308-1.697665 3.415796-3.39533 6.27082-5.691629 8.547677l0 0-221.054605 200.913892c-2.856048 2.276856-5.130857 3.984754-8.565073 5.691629-2.855024 1.137916-6.250354 1.706875-9.68457 1.706875-3.413749 0-6.829546-0.568958-10.263761-1.706875-2.834558-1.706875-5.689582-3.414773-7.96643899-5.691629L272.944416 470.659965l0 0c-2.854001-2.276856-4.552689-5.131881-5.690606-8.547677-1.137916-2.83558099-2.276856-6.250354-2.276856-9.66308 0-7.407714 3.413749-13.659091 7.966439-18.210757l0 0c4.553713-4.552689 10.82351-7.407714 18.2302-7.407714 3.41477299 0 6.847965 0.559748 9.683547 1.697665 2.856048 1.157359 5.71107199 3.433192 7.987928 5.710049l203.402573 184.401824L715.092511 434.239474c2.275833-2.276856 5.131881-4.552689 7.966439-5.710049 3.43319199-1.137916 6.848988-1.69766499 10.262738-1.697665C740.15021 426.83073699 746.999199 429.685761 751.551888 434.239474L751.551888 434.239474z" ></path></symbol><symbol id="icon-arrow-down" viewBox="0 0 1024 1024"><path d="M497.888 595.712l197.28000001-205.44c10.432-8.864 25.968-7.504 34.68799999 3.024 8.736 10.528 7.36 26.24-3.072 35.08799999l-197.28 205.42400001c-10.432 8.864-25.968 7.504-34.688-3.008S487.44 604.56 497.888 595.712z" ></path><path d="M328.32 390.256l197.28 205.44c10.432 8.864 11.808 24.56 3.088 35.088-8.736 10.528-24.272 11.872-34.688 3.024l-197.28-205.44c-10.432-8.848-11.808-24.56-3.072-35.088C302.33599999 382.752 317.872 381.392 328.32 390.256z" ></path></symbol><symbol id="icon-arrow-left" viewBox="0 0 1024 1024"><path d="M428.288 497.888l205.44 197.28000001c8.864 10.432 7.504 25.968-3.024 34.68799999-10.528 8.736-26.24 7.36-35.08799999-3.072l-205.42400001-197.28c-8.864-10.432-7.504-25.968 3.008-34.688S419.44 487.44 428.288 497.888z" ></path><path d="M633.744 328.32l-205.44 197.28c-8.864 10.432-24.56 11.808-35.088 3.088-10.528-8.736-11.872-24.272-3.024-34.688l205.44-197.28c8.848-10.432 24.56-11.808 35.088-3.072C641.248 302.33599999 642.608 317.872 633.744 328.32z" ></path></symbol><symbol id="icon-arrow-up-circle" viewBox="0 0 1024 1024"><path d="M792.08607 231.202221c-71.800279-71.14434-170.937161-115.542526-280.334733-115.542526-109.39859599 0-208.534454 44.398186-280.334733 115.542526-71.222111 71.713298-115.669416 170.74273201-115.669416 280.025695l0 0c0 109.282962 44.447305 208.303186 115.669416 280.026718l0 0c71.800279 71.704089 170.936137 116.111484 280.334733 116.111484l0 0 0 0 0 0c109.397572 0 208.534454-44.407396 280.334733-116.111484 71.78186-71.724555 116.227118-170.743756 116.227118-280.026718l0 0 0 0C908.313188 401.944953 863.868953 302.915519 792.08607 231.202221L792.08607 231.202221zM194.956204 194.771497c81.484849-80.8197 193.140858-130.909515 316.796156-130.909515 123.634832 0 235.888452 50.088792 316.795133 130.909515 80.906681 81.387635 131.043568 192.947454 131.043568 316.456419 0 123.50077801-50.135864 235.637742-131.043568 316.447209C747.640812 908.504034 635.386168 958.583616 511.751337 958.583616c-123.65529801 0-235.310284-50.079582-316.796156-130.908492C114.049522 746.86668 63.893192 634.728694 63.893192 511.227915l0 0C63.893192 387.718951 114.049522 276.15913201 194.956204 194.771497L194.956204 194.771497zM272.448112 589.760526c-4.572132-4.551666-7.408737-10.803044-7.408737-18.210757l0 0c0-3.412726 0.559748-6.828522 1.717108-9.66308 1.697665-3.415796 3.39533-6.27082 5.691629-8.547677l0 0 221.054605-200.913892c2.856048-2.276856 5.130857-3.984754 8.565073-5.691629 2.855024-1.137916 6.250354-1.706875 9.68457-1.706875 3.413749 0 6.829546 0.568958 10.263761 1.706875 2.834558 1.706875 5.689582 3.414773 7.96643899 5.691629L751.055584 553.340035l0 0c2.854001 2.276856 4.552689 5.131881 5.690606 8.547677 1.137916 2.83558099 2.276856 6.250354 2.276856 9.66308 0 7.407714-3.413749 13.659091-7.966439 18.210757l0 0c-4.553713 4.552689-10.82351 7.407714-18.2302 7.407714-3.41477299 0-6.847965-0.559748-9.683547-1.697665-2.856048-1.157359-5.71107199-3.433192-7.987928-5.710049l-203.402573-184.401824L308.907489 589.760526c-2.275833 2.276856-5.131881 4.552689-7.966439 5.710049-3.43319199 1.137916-6.848988 1.69766499-10.262738 1.697665C283.84979 597.16926301 277.000801 594.314239 272.448112 589.760526L272.448112 589.760526z" ></path></symbol><symbol id="icon-arrow-left-circle" viewBox="0 0 1024 1024"><path d="M231.202221 231.91393c-71.14434 71.800279-115.542526 170.937161-115.542526 280.334733 0 109.39859599 44.398186 208.534454 115.542526 280.334733 71.713298 71.222111 170.74273201 115.669416 280.025695 115.669416l0 0c109.282962 0 208.303186-44.447305 280.026718-115.669416l0 0c71.704089-71.800279 116.111484-170.936137 116.111484-280.334733l0 0 0 0 0 0c0-109.397572-44.407396-208.534454-116.111484-280.334733-71.724555-71.78186-170.743756-116.227118-280.026718-116.227118l0 0 0 0C401.944953 115.686812 302.915519 160.131047 231.202221 231.91393L231.202221 231.91393zM194.771497 829.043796c-80.8197-81.484849-130.909515-193.140858-130.909515-316.796156 0-123.634832 50.088792-235.888452 130.909515-316.795133 81.387635-80.906681 192.947454-131.043568 316.456419-131.043568 123.50077801 0 235.637742 50.135864 316.447209 131.043568C908.504034 276.359188 958.583616 388.613832 958.583616 512.248663c0 123.65529801-50.079582 235.310284-130.908492 316.796156C746.86668 909.950478 634.728694 960.106808 511.227915 960.106808l0 0C387.718951 960.106808 276.15913201 909.950478 194.771497 829.043796L194.771497 829.043796zM589.760526 751.551888c-4.551666 4.572132-10.803044 7.408737-18.210757 7.408737l0 0c-3.412726 0-6.828522-0.559748-9.66308-1.717108-3.415796-1.697665-6.27082-3.39533-8.547677-5.691629l0 0-200.913892-221.054605c-2.276856-2.856048-3.984754-5.130857-5.691629-8.565073-1.137916-2.855024-1.706875-6.250354-1.706875-9.68457 0-3.413749 0.568958-6.829546 1.706875-10.263761 1.706875-2.834558 3.414773-5.689582 5.691629-7.96643899L553.340035 272.944416l0 0c2.276856-2.854001 5.131881-4.552689 8.547677-5.690606 2.83558099-1.137916 6.250354-2.276856 9.66308-2.276856 7.407714 0 13.659091 3.413749 18.210757 7.966439l0 0c4.552689 4.553713 7.407714 10.82351 7.407714 18.2302 0 3.41477299-0.559748 6.847965-1.697665 9.683547-1.157359 2.856048-3.433192 5.71107199-5.710049 7.987928l-184.401824 203.402573L589.760526 715.092511c2.276856 2.275833 4.552689 5.131881 5.710049 7.966439 1.137916 3.43319199 1.69766499 6.848988 1.697665 10.262738C597.16926301 740.15021 594.314239 746.999199 589.760526 751.551888L589.760526 751.551888z" ></path></symbol><symbol id="icon-search" viewBox="0 0 1024 1024"><path d="M447.325002 129.919978c-178.868807 0-323.872319 145.003512-323.872319 323.874365s145.003512 323.874365 323.872319 323.874365c178.870854 0 323.874365-145.003512 323.874365-323.874365S626.195855 129.919978 447.325002 129.919978zM447.325002 713.712071c-143.31915 0-259.915681-116.598578-259.915681-259.917728s116.596532-259.917728 259.915681-259.917728 259.917728 116.598578 259.917728 259.917728S590.643128 713.712071 447.325002 713.712071z" ></path><path d="M891.573945 840.061734 748.236376 696.699606c-13.43601 16.625656-28.371164 31.91385-44.338834 46.099944l142.458549 142.481062c6.246261 6.246261 14.427594 9.368368 22.60995 9.368368s16.363689-3.123131 22.60995-9.368368C904.065444 872.789113 904.065444 852.553233 891.573945 840.061734z" ></path></symbol><symbol id="icon-clock" viewBox="0 0 1024 1024"><path d="M512 128C264.576 128 64 328.576 64 576s200.576 448 448 448 448-200.576 448-448S759.424 128 512 128zM512 936c-198.824 0-360-161.178-360-360 0-198.824 161.176-360 360-360 198.822 0 360 161.176 360 360C872 774.822 710.822 936 512 936zM934.784 287.174C950.826 259.122 960 226.632 960 192c0-106.04-85.96-192-192-192-61.818 0-116.802 29.222-151.92 74.596C747.964 101.832 861.286 179.794 934.784 287.174zM407.92 74.596C372.804 29.222 317.818 0 256 0 149.96 0 64 85.96 64 192c0 34.632 9.174 67.122 25.216 95.174C162.716 179.794 276.038 101.832 407.92 74.596zM448 320l64 0 0 320-64 0L448 320zM512 576l192 0 0 64-192 0L512 576z" ></path></symbol><symbol id="icon-arrow-right" viewBox="0 0 1024 1024"><path d="M595.712 526.112l-205.44-197.28c-8.864-10.432-7.504-25.968 3.024-34.688 10.528-8.736 26.24-7.36 35.088 3.072l205.424 197.28c8.864 10.432 7.504 25.968-3.008 34.688S604.56 536.56 595.712 526.112z" ></path><path d="M390.256 695.68l205.44-197.28c8.864-10.432 24.56-11.808 35.088-3.088 10.528 8.736 11.872 24.272 3.024 34.688l-205.44 197.28c-8.848 10.432-24.56 11.808-35.088 3.072C382.752 721.664 381.392 706.128 390.256 695.68z" ></path></symbol><symbol id="icon-table" viewBox="0 0 1024 1024"><path d="M63.29814 120.015398l0 783.435039 895.355061 0L958.653201 120.015398 63.29814 120.015398 63.29814 120.015398zM399.05616 623.651916 399.05616 455.773418l223.840044 0 0 167.879522L399.05616 623.652939 399.05616 623.651916zM622.896204 679.611415l0 167.881568L399.05616 847.492984 399.05616 679.611415 622.896204 679.611415 622.896204 679.611415zM622.896204 231.933373l0 167.881568L399.05616 399.814941 399.05616 231.933373 622.896204 231.933373 622.896204 231.933373zM343.09666 231.933373l0 167.881568L119.257639 399.814941 119.257639 231.933373 343.09666 231.933373 343.09666 231.933373zM119.257639 455.773418l223.840044 0 0 167.879522L119.257639 623.652939 119.257639 455.773418 119.257639 455.773418zM678.855704 455.773418l223.840044 0 0 167.879522L678.855704 623.652939 678.855704 455.773418 678.855704 455.773418zM678.855704 399.814941 678.855704 231.933373l223.840044 0 0 167.881568L678.855704 399.814941 678.855704 399.814941zM119.257639 679.611415l223.840044 0 0 167.881568L119.257639 847.492984 119.257639 679.611415 119.257639 679.611415zM678.855704 847.492984 678.855704 679.611415l223.840044 0 0 167.881568L678.855704 847.492984 678.855704 847.492984zM678.855704 847.492984" ></path></symbol><symbol id="icon-arrow-right-circle" viewBox="0 0 1024 1024"><path d="M792.797779 792.08607c71.14434-71.800279 115.542526-170.937161 115.542526-280.334733 0-109.398596-44.398186-208.534454-115.542526-280.334733-71.713298-71.222111-170.742732-115.669416-280.025695-115.669416l0 0c-109.282962 0-208.303186 44.447305-280.026718 115.669416l0 0c-71.704089 71.800279-116.111484 170.936137-116.111484 280.334733l0 0 0 0 0 0c0 109.397572 44.407396 208.534454 116.111484 280.334733 71.724555 71.78186 170.743756 116.227118 280.026718 116.227118l0 0 0 0C622.055047 908.313188 721.084481 863.868953 792.797779 792.08607L792.797779 792.08607zM829.228503 194.956204c80.8197 81.484849 130.909515 193.140858 130.909515 316.796156 0 123.634832-50.088792 235.888452-130.909515 316.795133-81.387635 80.906681-192.947454 131.043568-316.456419 131.043568-123.500778 0-235.637742-50.135864-316.447209-131.043568C115.495966 747.640812 65.416384 635.386168 65.416384 511.751337c0-123.655298 50.079582-235.310284 130.908492-316.796156C277.13332 114.049522 389.271306 63.893192 512.772085 63.893192l0 0C636.281049 63.893192 747.840868 114.049522 829.228503 194.956204L829.228503 194.956204zM434.239474 272.448112c4.551666-4.572132 10.803044-7.408737 18.210757-7.408737l0 0c3.412726 0 6.828522 0.559748 9.66308 1.717108 3.415796 1.697665 6.27082 3.39533 8.547677 5.691629l0 0 200.913892 221.054605c2.276856 2.856048 3.984754 5.130857 5.691629 8.565073 1.137916 2.855024 1.706875 6.250354 1.706875 9.68457 0 3.413749-0.568958 6.829546-1.706875 10.263761-1.706875 2.834558-3.414773 5.689582-5.691629 7.966439L470.659965 751.055584l0 0c-2.276856 2.854001-5.131881 4.552689-8.547677 5.690606-2.835581 1.137916-6.250354 2.276856-9.66308 2.276856-7.407714 0-13.659091-3.413749-18.210757-7.966439l0 0c-4.552689-4.553713-7.407714-10.82351-7.407714-18.2302 0-3.414773 0.559748-6.847965 1.697665-9.683547 1.157359-2.856048 3.433192-5.711072 5.710049-7.987928l184.401824-203.402573L434.239474 308.907489c-2.276856-2.275833-4.552689-5.131881-5.710049-7.966439-1.137916-3.433192-1.697665-6.848988-1.697665-10.262738C426.830737 283.84979 429.685761 277.000801 434.239474 272.448112L434.239474 272.448112z" ></path></symbol><symbol id="icon-help" viewBox="0 0 1024 1024"><path d="M827.833737 196.140169C743.469304 111.750153 631.311875 65.290005 511.998465 65.290005c-119.311363 0-231.512794 46.479591-315.882344 130.850164C111.749642 280.491299 65.290517 392.668171 65.290517 511.998977c0 119.335922 46.459125 231.495398 130.830721 315.859831 84.364433 84.390016 196.566888 130.850164 315.878251 130.850164 119.31341 0 231.470839-46.479591 315.840388-130.850164 84.409458-84.346013 130.869606-196.523909 130.869606-315.859831C958.70846 392.668171 912.249335 280.510742 827.833737 196.140169zM540.442284 767.464299c-7.460925 7.460925-17.929348 11.796674-28.443819 11.796674-10.511401 0-20.985964-4.335748-28.442796-11.796674-7.414877-7.460925-11.731182-17.886369-11.731182-28.398794 0-10.536984 4.316306-21.005406 11.731182-28.42233 7.456832-7.455809 17.930371-11.778254 28.442796-11.778254 10.513448 0 20.982894 4.322445 28.443819 11.778254 7.372921 7.416923 11.733229 17.886369 11.733229 28.42233C552.175513 749.57793 547.815205 760.003374 540.442284 767.464299zM591.52573 531.633153c-34.028001 27.720342-50.951439 59.438741-50.951439 95.230921l-0.352017 10.951423-0.088004 0.082888c-1.1328 15.400758-13.95585 27.484981-29.661553 27.484981-16.403598 0-29.750581-13.305027-29.750581-29.731138 0-0.89437 0.085958-1.787716 0.172939-2.681062l-0.044002-0.067538c0-34.765805 3.317559-59.96165 9.990538-75.600839 6.675026-15.591093 21.901823-33.979906 45.543266-55.136761l24.170492-21.552875c32.500205-29.228695 48.724725-58.066487 48.724725-86.529749 0-24.428366-8.724709-44.452421-26.215058-60.068074-17.495466-15.600303-39.785122-23.427572-66.74924-23.427572-69.705572 0-104.824417 39.96113-105.35142 119.897717 0 0.086981 0.042979 0.155543 0.042979 0.218988 0 0.112564-0.042979 0.243547-0.042979 0.352017l0 1.196245-0.044002 0c-0.780783 16.908088-14.740726 30.40959-31.884175 30.40959-17.144472 0-31.104415-13.500479-31.890314-30.40959L347.057879 432.252725c0-53.896514 15.440667-96.449679 46.328142-127.684054 30.794353-31.280424 72.850192-46.87561 125.985366-46.87561 46.89403 0 84.848457 12.978593 113.902166 38.934754 29.140691 25.932626 43.666522 59.697637 43.666522 101.248985C676.940075 440.437128 648.498302 485.060441 591.52573 531.633153z" ></path></symbol><symbol id="icon-mark" viewBox="0 0 1024 1024"><path d="M677.720857 371.147018c0-91.64321-74.28589-165.928077-165.928077-165.928077s-165.928077 74.28589-165.928077 165.928077S420.149571 537.075095 511.79278 537.075095 677.720857 462.789205 677.720857 371.147018zM382.737496 371.147018c0-71.26202 57.776891-129.055285 129.055285-129.055285 71.279417 0 129.055285 57.794287 129.055285 129.055285 0 71.278393-57.775868 129.055285-129.055285 129.055285C440.513364 500.202303 382.737496 442.425412 382.737496 371.147018zM806.776142 371.147018c0-162.903184-132.061758-294.984385-294.984385-294.984385S216.808396 208.242811 216.808396 371.147018s294.984385 516.222161 294.984385 516.222161S806.776142 534.050202 806.776142 371.147018zM511.79278 113.035426c142.540414 0 258.110569 115.552759 258.110569 258.111592 0 142.558833-258.110569 460.912461-258.110569 460.912461S253.681188 513.704828 253.681188 371.147018C253.681188 228.588185 369.251344 113.035426 511.79278 113.035426zM642.187573 769.187547c-8.074909 11.081383-15.950274 21.710464-23.52274 31.794124 78.722946 9.06854 132.801609 27.838022 132.801609 49.513694 0 30.53648-107.304911 55.3097-239.674685 55.3097-132.36875 0-239.674685-24.77322-239.674685-55.3097 0-21.675672 54.079686-40.444131 132.802632-49.513694-7.572466-10.083659-15.448854-20.712741-23.52274-31.794124-86.981027 15.531741-146.152684 46.113247-146.152684 81.307817 0 50.916647 123.81698 92.182492 276.5485 92.182492s276.547477-41.265846 276.547477-92.182492C788.340257 815.300794 729.1686 784.719288 642.187573 769.187547z" ></path></symbol><symbol id="icon-money" viewBox="0 0 1024 1024"><path d="M700.416 278.528c-8.192-8.192-20.48-8.192-28.672 0l-159.744 159.744L352.256 278.528c-8.192-8.192-20.48-8.192-28.672 0s-8.192 20.48 0 28.672l139.264 139.264L335.872 446.464c-12.288 0-20.48 8.192-20.48 20.48s8.192 20.48 20.48 20.48L491.52 487.424l0 106.496L335.872 593.92c-12.288 0-20.48 8.192-20.48 20.48s8.192 20.48 20.48 20.48L491.52 634.88l0 192.512c0 12.288 8.192 20.48 20.48 20.48s20.48-8.192 20.48-20.48l0-192.512 155.648 0c12.288 0 20.48-8.192 20.48-20.48s-8.192-20.48-20.48-20.48L532.48 593.92l0-106.496 155.648 0c12.288 0 20.48-8.192 20.48-20.48s-8.192-20.48-20.48-20.48l-126.976 0 139.264-139.264C708.608 299.008 708.608 286.72 700.416 278.528z" ></path><path d="M512 86.016C278.528 86.016 86.016 278.528 86.016 512s188.416 425.984 425.984 425.984c233.472 0 425.984-188.416 425.984-425.984S745.472 86.016 512 86.016zM512 897.024c-212.992 0-385.024-172.032-385.024-385.024s172.032-385.024 385.024-385.024c212.992 0 385.024 172.032 385.024 385.024S724.992 897.024 512 897.024z" ></path></symbol><symbol id="icon-analyse" viewBox="0 0 1024 1024"><path d="M819.2 864 819.2 403.2 691.2 460.8 691.2 864 595.2 864 595.2 492.8 505.6 537.6 467.2 499.2 467.2 864 396.8 864 396.8 448 268.8 518.4 268.8 864 160 864 160 128 128 128 128 864 128 896 160 896 896 896 896 864Z" ></path><path d="M435.2 364.8 512 499.2 544 480 544 480 793.6 332.8 844.8 416 883.2 256 723.2 217.6 774.4 300.8 524.8 448 448 313.6 448 313.6 448 313.6 192 467.2 211.2 499.2Z" ></path></symbol><symbol id="icon-dealt" viewBox="0 0 1024 1024"><path d="M372.674303 617.841583 208.583061 617.841583l0 55.112202 158.683069 0C367.966071 654.182256 369.801882 635.789351 372.674303 617.841583L372.674303 617.841583z" ></path><path d="M208.583061 403.864164l353.807095 0c29.618575-13.797237 61.45363-22.044062 94.675266-23.715121l0-31.399127L208.583061 348.749916 208.583061 403.864164 208.583061 403.864164z" ></path><path d="M158.507572 769.490445c-20.847817 0-29.540803-8.698103-29.540803-29.526477l0-593.077573c0-20.828374 8.694009-29.52443 29.540803-29.52443l548.628222 0c20.826328 0 29.54592 8.696056 29.54592 29.52443l0 237.22489c23.485901 4.300956 33.708729 11.326976 54.92596 20.72502L791.607674 107.216907c0-24.76708-20.083407-44.847417-44.847417-44.847417L118.888226 62.369489c-24.769127 0-44.852534 20.081361-44.852534 44.847417l0 672.728658c0 24.758893 20.083407 44.847417 44.852534 44.847417l283.845697 0c-11.346419-21.157879-20.263509-31.520901-26.356274-55.302537L178.973696 769.490445 158.507572 769.490445z" ></path><path d="M208.583061 214.205617l448.481338 0 0 55.113225-448.481338 0 0-55.113225Z" ></path><path d="M679.400103 420.235017c-148.146085 0-268.25358 120.091122-268.25358 268.258697 0 148.144038 120.112612 268.257673 268.25358 268.257673 148.164504 0 268.25665-120.114658 268.25665-268.257673C947.656753 540.326139 827.564607 420.235017 679.400103 420.235017zM679.87901 905.252479C560.885895 905.252479 464.4311 808.801776 464.4311 689.810708c0-118.999255 96.455819-215.45712 215.44791-215.45712 119.001301 0 215.452004 96.457866 215.452004 215.45712C895.32999 808.801776 798.875195 905.252479 679.87901 905.252479z" ></path><path d="M208.583061 483.293191l0 55.113225 197.292412 0c8.973372-19.528775 19.332301-37.97387 30.9325-55.113225L208.583061 483.293191z" ></path><path d="M681.543929 714.512297 681.543929 589.929884 627.394658 589.929884 627.394658 769.682827 807.143509 769.682827 807.143509 714.512297Z" ></path></symbol><symbol id="icon-change" viewBox="0 0 1024 1024"><path d="M920.865573 637.722376H102.113167c-2.795673 0-5.514597 0.320295-8.133237 0.911766a36.95875 36.95875 0 0 0-18.426675 10.094916c-12.353352 12.419867-14.18814 31.399127-5.52176 45.776579a37.767162 37.767162 0 0 0 8.416693 9.992585l172.344207 173.278485c14.516622 14.59337 38.053688 14.59337 52.572356 0 14.516622-14.598486 14.516622-38.262442 0-52.856835L192.145693 713.098087h728.718857c20.554128 0 37.217646-16.873296 37.217646-37.685297 0-20.820188-16.662495-37.690414-37.216623-37.690414zM102.113167 386.467959h818.752406a36.920888 36.920888 0 0 0 7.80271-0.836041 36.917818 36.917818 0 0 0 19.774369-10.360976c14.517645-14.59644 14.517645-38.262442 0-52.855811L773.199419 146.225339c-14.515598-14.595416-38.054711-14.595416-52.571333 0-14.515598 14.594393-14.515598 38.261419 0 52.856835l111.408369 112.010073H102.113167c-20.554128 0-37.2156 16.873296-37.2156 37.689391 0 20.814048 16.660448 37.686321 37.2156 37.686321z" ></path></symbol><symbol id="icon-bell" viewBox="0 0 1024 1024"><path d="M861.40397037 717.4674963c8.49540741-0.24272592 16.99081482 1.45635555 25.12213333 6.79632592-29.4912-18.93262222-48.90927408-51.94334815-48.90927407-89.68722963V424.01185185c0-154.25232592-111.53256297-283.01842963-260.56628148-314.69416296V101.79318518c0-39.3216-31.7970963-70.99733333-70.99733333-70.99733333s-70.99733333 31.7970963-70.99733334 70.99733333v7.52450371c-149.03371852 31.67573333-260.56628148 160.32047408-260.56628148 314.69416296V634.57659259c0 37.74388148-19.53943703 70.75460741-48.90927408 89.68722963 8.25268148-5.33997037 16.62672592-7.16041482 25.12213333-6.79632592-26.09303703 0.12136297-47.21019259 21.11715555-47.21019258 47.33155555s21.11715555 47.33155555 47.33155555 47.33155556h710.33742223c26.2144 0 47.33155555-21.11715555 47.33155555-47.33155556 0.12136297-25.97167408-20.99579259-47.21019259-47.08882963-47.33155555zM506.17457778 978.03377778c65.41463703 0 118.45025185-53.03561482 118.45025185-118.45025186H387.72432592c0 65.41463703 52.91425185 118.45025185 118.45025186 118.45025186z" ></path></symbol><symbol id="icon-time" viewBox="0 0 1024 1024"><path d="M508.8 992C246.4 992 32 777.6 32 512S246.4 32 508.8 32s476.8 214.4 476.8 480c3.2 265.6-211.2 480-476.8 480z m0-896C281.6 96 96 281.6 96 512s185.6 416 412.8 416c227.2 0 412.8-185.6 412.8-416 3.2-230.4-182.4-416-412.8-416z" fill="#212121" ></path><path d="M704 576h-224c-19.2 0-32-12.8-32-32v-224c0-19.2 12.8-32 32-32s32 12.8 32 32v192h192c19.2 0 32 12.8 32 32s-12.8 32-32 32z" fill="#212121" ></path></symbol><symbol id="icon-skin" viewBox="0 0 1024 1024"><path d="M511.57333333 85.86666667c-311.25333333 0-426.34666667 272-426.34666666 424.53333333s110.72 427.30666667 417.38666666 427.30666667c0 0 76.16 1.38666667 76.16-67.41333334 0-68.69333333-34.24-46.72-34.24-96.10666666 0-49.49333333 34.24-71.46666667 50.66666667-71.46666667 16.42666667 0 124.8 8.21333333 185.17333333-15.25333333 60.26666667-23.14666667 157.54666667-97.38666667 157.54666667-223.78666667 0-111.25333333-115.09333333-377.81333333-426.34666667-377.81333333zM251.62666667 511.89333333c-19.62666667 0-38.50666667-7.78666667-52.48-21.76-13.86666667-13.97333333-21.65333333-32.85333333-21.65333334-52.48-0.74666667-26.98666667 13.12-52.16 36.37333334-65.92 23.25333333-13.76 52.05333333-13.76 75.30666666 0 23.25333333 13.76 37.12 38.93333333 36.37333334 65.92 0.21333333 40.85333333-32.96 74.13333333-73.92 74.24z m139.62666666-183.68c-19.62666667 0-38.50666667-7.78666667-52.37333333-21.76-13.86666667-13.86666667-21.65333333-32.74666667-21.65333333-52.48 0-40.85333333 33.17333333-74.02666667 74.02666666-74.02666666 40.85333333 0 74.02666667 33.17333333 74.02666667 74.02666666 0.10666667 41.06666667-33.06666667 74.24-74.02666667 74.24z m237.44 0c-40.85333333 0-74.02666667-33.17333333-74.02666666-74.24-0.74666667-26.98666667 13.12-52.16 36.37333333-65.92a74.34666667 74.34666667 0 0 1 75.30666667 0c23.25333333 13.76 37.12 38.93333333 36.37333333 65.92 0.10666667 41.06666667-33.06666667 74.24-74.02666667 74.24z m141.01333334 183.68c-40.85333333 0-74.02666667-33.17333333-74.02666667-74.24-0.74666667-26.98666667 13.12-52.16 36.37333333-65.92 23.25333333-13.76 52.05333333-13.76 75.30666667 0 23.25333333 13.76 37.12 38.93333333 36.37333333 65.92 0.10666667 19.62666667-7.68 38.50666667-21.54666666 52.48-13.97333333 13.86666667-32.74666667 21.76-52.48 21.76z m0 0" ></path></symbol><symbol id="icon-mail" viewBox="0 0 1024 1024"><path d="M1021.407 146.857L512.645 574.783 3.909 146.857zM0.007 183.402L339.886 471.24 0.007 876.743z" ></path><path d="M39.354 877.144L363.529 494.4 512.54 616.772l149.274-126.179 324.157 386.551zM1023.993 876.743L684.122 471.24l339.871-287.838z" ></path></symbol><symbol id="icon-email" viewBox="0 0 1024 1024"><path d="M1024.00144 220.64v574.32c0 5.76-0.736 11.456-1.824 17.072v0.064l-0.224 0.944A84.336 84.336 0 0 1 939.29744 880H101.08944a102.72 102.72 0 0 1-82.512-40.832 95.904 95.904 0 0 1-18.56-57.248V236.256a74.08 74.08 0 0 1 52.064-70.784l0.736-0.208 0.208-0.08A127.648 127.648 0 0 1 89.66544 160h883.424c1.328 0.512 2.64 1.232 4.032 1.44 25.52 4.32 40.592 19.152 45.344 44.496v0.08c0.88 4.816 1.536 9.712 1.536 14.608zM512.00144 591.232l451.152-379.472c-66.272-3.888-888.48-1.728-897.84 2.368L512.00144 591.2v0.064z m133.856-45.152l-114.112 96.144c-13.76 11.52-25.6 11.664-39.2 0.208l-48.272-40.752-63.84-53.936L81.02544 825.28l1.024 2.304h873.328L645.79344 546.08h0.064z m-304.864-31.68L51.79344 270.032v512.48l289.28-268.096h-0.08z m344.352-1.648l287.088 260.96V270.944L685.34544 512.768z" ></path></symbol><symbol id="icon-meeting" viewBox="0 0 1059 1024"><path d="M434.093791 101.281952m-101.281953 0a101.281952 101.281952 0 1 0 202.563905 0 101.281952 101.281952 0 1 0-202.563905 0Z" fill="#2c2c2c" ></path><path d="M434.093791 174.941554a172.310854 172.310854 0 0 1 172.310854 172.310854V460.372511H263.098286V347.252408a172.310854 172.310854 0 0 1 170.995505-172.310854z" fill="#2c2c2c" ></path><path d="M822.12205 101.281952m-101.281952 0a101.281952 101.281952 0 1 0 202.563905 0 101.281952 101.281952 0 1 0-202.563905 0Z" fill="#2c2c2c" ></path><path d="M822.12205 174.941554a172.310854 172.310854 0 0 1 172.310854 172.310854V460.372511H649.811196V347.252408a172.310854 172.310854 0 0 1 172.310854-172.310854z" fill="#2c2c2c" ></path><path d="M434.093791 632.683365m-101.281953 0a101.281952 101.281952 0 1 0 202.563905 0 101.281952 101.281952 0 1 0-202.563905 0Z" fill="#2c2c2c" ></path><path d="M434.093791 706.342967a172.310854 172.310854 0 0 1 172.310854 172.310854v112.462428H263.098286v-112.462428a172.310854 172.310854 0 0 1 170.995505-172.310854z" fill="#2c2c2c" ></path><path d="M822.12205 632.683365m-101.281952 0a101.281952 101.281952 0 1 0 202.563905 0 101.281952 101.281952 0 1 0-202.563905 0Z" fill="#2c2c2c" ></path><path d="M822.12205 706.342967a172.310854 172.310854 0 0 1 172.310854 172.310854v112.462428H649.811196v-112.462428a172.310854 172.310854 0 0 1 172.310854-172.310854z" fill="#2c2c2c" ></path><path d="M1026.65898 958.232498H282.828537a226.240206 226.240206 0 0 1 0-451.822736h743.830443a32.226076 32.226076 0 0 0 31.568401-32.88375 31.568401 31.568401 0 0 0-31.568401-32.883751H282.828537A287.403982 287.403982 0 0 0 0.02828 731.992293a288.061657 288.061657 0 0 0 282.800257 292.007707h743.830443a32.883751 32.883751 0 0 0 0-65.767502z" fill="#2c2c2c" ></path></symbol><symbol id="icon-today" viewBox="0 0 1024 1024"><path d="M197.667 361c2.11 0 7.389-2.111 15.833-6.333 78.112-35.89 155.166-85.5 231.167-148.834 2.11-2.11 5.277-4.222 9.5-6.333 42.222-40.111 77.055-53.833 104.5-41.167 6.333 4.223 25.333 19 57 44.334 54.889 46.444 138.277 100.277 250.166 161.5 29.556 16.889 38 38 25.334 63.333-12.667 33.778-47.5 34.833-104.5 3.167-73.89-35.89-150.944-89.722-231.167-161.5-12.667-8.445-28.5-6.334-47.5 6.333l-3.167 3.167c-82.333 71.778-167.833 125.61-256.5 161.5-35.889 14.778-61.222 11.61-76-9.5C157.555 403.222 166 380 197.667 361z m47.5 174.167h525.666c59.112 0 86.556 22.166 82.334 66.5-63.334 183.667-240.666 281.833-532 294.5-38-2.111-57-19-57-50.667 4.222-23.222 26.388-36.944 66.5-41.167 192.112-8.444 324.055-60.166 395.833-155.166 10.556-16.89 9.5-26.39-3.167-28.5H245.167c-27.445 0-42.223-13.722-44.334-41.167 2.111-27.445 16.89-42.222 44.334-44.333zM546 500.333c-14.778-12.666-40.11-45.388-76-98.166-19-23.223-15.833-43.278 9.5-60.167 25.333-14.778 49.611-11.611 72.833 9.5 33.778 33.778 60.167 69.666 79.167 107.667 6.333 27.444-2.111 47.5-25.333 60.166-25.334 10.556-45.39 4.223-60.167-19z" ></path></symbol><symbol id="icon-user" viewBox="0 0 1024 1024"><path d="M512 486.10923498A220.07150577 220.07150577 0 1 1 512 45.96622222a220.07150577 220.07150577 0 0 1 0 440.14301276zM45.96622222 926.25224651v-25.89076503a362.47071645 362.47071645 0 0 1 362.47071646-362.47071646h207.12612264a362.47071645 362.47071645 0 0 1 362.47071646 362.47071646v25.89076503a51.78153127 51.78153127 0 0 1-51.78153127 51.78153127H97.74775349a51.78153127 51.78153127 0 0 1-51.78153127-51.78153127z" ></path></symbol><symbol id="icon-listadd" viewBox="0 0 1024 1024"><path d="M775.7 188c15.9 0 30.9 6.3 42.3 17.7 11.4 11.4 17.7 26.4 17.7 42.3v527.6c0 15.9-6.3 30.9-17.7 42.3s-26.4 17.7-42.3 17.7H248c-15.9 0-30.9-6.3-42.3-17.7-11.4-11.4-17.7-26.4-17.7-42.3V248c0-15.9 6.3-30.9 17.7-42.3 11.4-11.4 26.4-17.7 42.3-17.7h527.7m0-60H248c-66 0-120 54-120 120v527.6c0 66 54 120 120 120h527.6c66 0 120-54 120-120V248c0.1-66-53.9-120-119.9-120z" ></path><path d="M542.6 480.9l0.9-151.6c0.1-17.2-13.9-31.3-31.2-31.5-8.4 0-16.2 3.2-22.2 9.1l-0.1 0.1c-5.9 5.9-9.1 13.7-9.2 22l-0.8 151.7-150.5-0.2c-17.2 0-31.3 14-31.4 31.2-0.1 17.2 13.9 31.3 31.3 31.4l150.3 0.2-0.7 150.6c-0.1 17.3 13.9 31.4 31.1 31.5 8.4 0.1 16.4-3.2 22.4-9.2 5.8-5.8 9.1-13.6 9.2-22l0.8-150.7 153.1 0.2c8.4 0 16.3-3.3 22.2-9.2 5.9-5.9 9.1-13.7 9.2-22.1 0.1-17.2-13.9-31.3-31.3-31.4l-153.1-0.1z" ></path></symbol><symbol id="icon-sun" viewBox="0 0 1024 1024"><path d="M512 246.518519c-147.949037 0-265.481481 117.532444-265.481481 265.481481 0 147.930074 117.532444 265.481481 265.481481 265.481481s265.481481-117.551407 265.481481-265.481481c0-147.949037-117.532444-265.481481-265.481481-265.481481z m0 455.111111c-105.509926 0-189.62963-84.119704-189.62963-189.62963s84.119704-189.62963 189.62963-189.62963 189.62963 84.119704 189.62963 189.62963-84.119704 189.62963-189.62963 189.62963zM283.591111 229.091556L170.799407 116.299852 116.698074 170.420148l112.772741 112.772741 54.120296-54.101333zM905.860741 170.401185l-54.101334-54.101333-112.791703 112.772741 54.120296 54.120296 112.772741-112.791704zM549.925926 0h-75.851852v170.666667h75.851852V0zM170.666667 474.074074H0v75.851852h170.666667v-75.851852zM116.698074 851.361185l54.101333 54.120296 112.791704-112.791703-54.120296-54.101334-112.772741 112.772741zM853.333333 474.074074v75.851852h170.666667v-75.851852h-170.666667z m-114.365629 318.615704l112.791703 112.772741 54.101334-54.101334-112.772741-112.772741-54.120296 54.101334zM474.074074 1024h75.851852v-170.666667h-75.851852v170.666667z" ></path></symbol></svg>',m=(m=document.getElementsByTagName("script"))[m.length-1].getAttribute("data-injectcss"),z=function(c,l){l.parentNode.insertBefore(c,l)};if(m&&!c.__iconfont__svg__cssinject__){c.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(c){console&&console.log(c)}}function s(){o\|\|(o=!0,h())}function p(){try{t.documentElement.doScroll("left")}catch(c){return void setTimeout(p,50)}s()}l=function(){var c,l;(l=document.createElement("div")).innerHTML=i,i=null,(c=l.getElementsByTagName("svg")[0])&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",l=c,(c=document.body).firstChild?z(l,c.firstChild):c.appendChild(l))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(l,0):(a=function(){document.removeEventListener("DOMContentLoaded",a,!1),l()},document.addEventListener("DOMContentLoaded",a,!1)):document.attachEvent&&(h=l,t=c.document,o=!1,p(),t.onreadystatechange=function(){"complete"==t.readyState&&(t.onreadystatechange=null,s())})}(window);

Ignore Space Show notes View

project/hivuiSam/assets/icon/iconfont.js 0 → 100644

Ignore Space Show notes View project/hivuiSam/assets/icon/iconfont.json 0 → 100644
{ "id": "1417123", "name": "zhc-portal", "font_family": "iconfont", "css_prefix_text": "icon-", "description": "", "glyphs": [ { "icon_id": "249352", "name": "工作流程图", "font_class": "flow", "unicode": "e602", "unicode_decimal": 58882 }, { "icon_id": "6289727", "name": "功能", "font_class": "func", "unicode": "e604", "unicode_decimal": 58884 }, { "icon_id": "2959123", "name": "组织机构", "font_class": "org", "unicode": "e63c", "unicode_decimal": 58940 }, { "icon_id": "8795820", "name": "根节点", "font_class": "root", "unicode": "e810", "unicode_decimal": 59408 }, { "icon_id": "5881141", "name": "部门", "font_class": "dpt", "unicode": "e62b", "unicode_decimal": 58923 }, { "icon_id": "23081148", "name": "岗位", "font_class": "ptm", "unicode": "e65c", "unicode_decimal": 58972 }, { "icon_id": "5387606", "name": "全屏", "font_class": "quanping", "unicode": "eb11", "unicode_decimal": 60177 }, { "icon_id": "6691134", "name": "权限", "font_class": "quanxian", "unicode": "e63f", "unicode_decimal": 58943 }, { "icon_id": "4736385", "name": "关闭其它", "font_class": "closeOther", "unicode": "e631", "unicode_decimal": 58929 }, { "icon_id": "6395682", "name": "关闭", "font_class": "close-circle", "unicode": "e629", "unicode_decimal": 58921 }, { "icon_id": "10296880", "name": "关闭所有", "font_class": "closeAll", "unicode": "e60f", "unicode_decimal": 58895 }, { "icon_id": "879513", "name": "刷新", "font_class": "refresh", "unicode": "e619", "unicode_decimal": 58905 }, { "icon_id": "2576777", "name": "tree", "font_class": "tree", "unicode": "e6e8", "unicode_decimal": 59112 }, { "icon_id": "80224", "name": "退出", "font_class": "tuichu", "unicode": "e627", "unicode_decimal": 58919 }, { "icon_id": "9031766", "name": "sort16", "font_class": "moveSort2", "unicode": "e630", "unicode_decimal": 58928 }, { "icon_id": "10367835", "name": "sort", "font_class": "moveSort1", "unicode": "e93c", "unicode_decimal": 59708 }, { "icon_id": "11351033", "name": "-sort-2", "font_class": "moveSort", "unicode": "e73d", "unicode_decimal": 59197 }, { "icon_id": "777689", "name": "edit", "font_class": "edit", "unicode": "e62f", "unicode_decimal": 58927 }, { "icon_id": "8551103", "name": "arrows down", "font_class": "arrow-leftMore-circle", "unicode": "e623", "unicode_decimal": 58915 }, { "icon_id": "11266666", "name": "arrows down", "font_class": "arrow-rightMore-circle", "unicode": "e6fc", "unicode_decimal": 59132 }, { "icon_id": "519157", "name": "check-box-empty", "font_class": "checkbox-empty", "unicode": "e625", "unicode_decimal": 58917 }, { "icon_id": "519158", "name": "check-box", "font_class": "checkbox", "unicode": "e626", "unicode_decimal": 58918 }, { "icon_id": "8660113", "name": "add", "font_class": "add", "unicode": "e6ee", "unicode_decimal": 59118 }, { "icon_id": "6878719", "name": "delete", "font_class": "delete", "unicode": "e698", "unicode_decimal": 59032 }, { "icon_id": "1005342", "name": "info", "font_class": "info", "unicode": "e60a", "unicode_decimal": 58890 }, { "icon_id": "5279795", "name": "error", "font_class": "error", "unicode": "e620", "unicode_decimal": 58912 }, { "icon_id": "7597274", "name": "warn", "font_class": "warn", "unicode": "e601", "unicode_decimal": 58881 }, { "icon_id": "9788470", "name": "close", "font_class": "close", "unicode": "e607", "unicode_decimal": 58887 }, { "icon_id": "1802993", "name": "set", "font_class": "set-fill", "unicode": "e61e", "unicode_decimal": 58910 }, { "icon_id": "1380012", "name": "设置", "font_class": "set", "unicode": "e61d", "unicode_decimal": 58909 }, { "icon_id": "5140499", "name": "图表", "font_class": "chart", "unicode": "e632", "unicode_decimal": 58930 }, { "icon_id": "11198155", "name": "cc-arrow-right-circle", "font_class": "arrow-down-circle", "unicode": "e6f8", "unicode_decimal": 59128 }, { "icon_id": "10900908", "name": "arrow", "font_class": "arrow-down", "unicode": "e6f6", "unicode_decimal": 59126 }, { "icon_id": "11032339", "name": "arrow", "font_class": "arrow-left", "unicode": "e6f7", "unicode_decimal": 59127 }, { "icon_id": "11198224", "name": "cc-arrow-right-circle", "font_class": "arrow-up-circle", "unicode": "e6fa", "unicode_decimal": 59130 }, { "icon_id": "11198225", "name": "cc-arrow-right-circle", "font_class": "arrow-left-circle", "unicode": "e6fb", "unicode_decimal": 59131 }, { "icon_id": "58331", "name": "search", "font_class": "search", "unicode": "e621", "unicode_decimal": 58913 }, { "icon_id": "88038", "name": "clock", "font_class": "clock", "unicode": "e600", "unicode_decimal": 58880 }, { "icon_id": "144131", "name": "arrow", "font_class": "arrow-right", "unicode": "e636", "unicode_decimal": 58934 }, { "icon_id": "247436", "name": "table", "font_class": "table", "unicode": "e699", "unicode_decimal": 59033 }, { "icon_id": "372107", "name": "cc-arrow-right-circle", "font_class": "arrow-right-circle", "unicode": "e60d", "unicode_decimal": 58893 }, { "icon_id": "585102", "name": "help", "font_class": "help", "unicode": "e65d", "unicode_decimal": 58973 }, { "icon_id": "1045524", "name": "yxx_mark", "font_class": "mark", "unicode": "e63d", "unicode_decimal": 58941 }, { "icon_id": "1092161", "name": "钱", "font_class": "money", "unicode": "e640", "unicode_decimal": 58944 }, { "icon_id": "1104404", "name": "报表2", "font_class": "analyse", "unicode": "e6d2", "unicode_decimal": 59090 }, { "icon_id": "1237019", "name": "待办", "font_class": "dealt", "unicode": "e64a", "unicode_decimal": 58954 }, { "icon_id": "1327132", "name": "切换", "font_class": "change", "unicode": "e60e", "unicode_decimal": 58894 }, { "icon_id": "3405405", "name": "消息", "font_class": "bell", "unicode": "e6eb", "unicode_decimal": 59115 }, { "icon_id": "4111563", "name": "time", "font_class": "time", "unicode": "e64d", "unicode_decimal": 58957 }, { "icon_id": "5321791", "name": "画板主题", "font_class": "skin", "unicode": "e664", "unicode_decimal": 58980 }, { "icon_id": "5354204", "name": "邮箱", "font_class": "mail", "unicode": "e6af", "unicode_decimal": 59055 }, { "icon_id": "6050679", "name": "email", "font_class": "email", "unicode": "e628", "unicode_decimal": 58920 }, { "icon_id": "6427820", "name": "会议管理", "font_class": "meeting", "unicode": "e612", "unicode_decimal": 58898 }, { "icon_id": "6447175", "name": "今日收入", "font_class": "today", "unicode": "e645", "unicode_decimal": 58949 }, { "icon_id": "7876854", "name": "user", "font_class": "user", "unicode": "e606", "unicode_decimal": 58886 }, { "icon_id": "9102193", "name": "add", "font_class": "listadd", "unicode": "e654", "unicode_decimal": 58964 }, { "icon_id": "10104436", "name": "sun", "font_class": "sun", "unicode": "e6f5", "unicode_decimal": 59125 } ] }

Ignore Space Show notes View

project/hivuiSam/assets/icon/iconfont.json 0 → 100644

{
  "id": "1417123",
  "name": "zhc-portal",
  "font_family": "iconfont",
  "css_prefix_text": "icon-",
  "description": "",
  "glyphs": [
    {
      "icon_id": "249352",
      "name": "工作流程图",
      "font_class": "flow",
      "unicode": "e602",
      "unicode_decimal": 58882
    },
    {
      "icon_id": "6289727",
      "name": "功能",
      "font_class": "func",
      "unicode": "e604",
      "unicode_decimal": 58884
    },
    {
      "icon_id": "2959123",
      "name": "组织机构",
      "font_class": "org",
      "unicode": "e63c",
      "unicode_decimal": 58940
    },
    {
      "icon_id": "8795820",
      "name": "根节点",
      "font_class": "root",
      "unicode": "e810",
      "unicode_decimal": 59408
    },
    {
      "icon_id": "5881141",
      "name": "部门",
      "font_class": "dpt",
      "unicode": "e62b",
      "unicode_decimal": 58923
    },
    {
      "icon_id": "23081148",
      "name": "岗位",
      "font_class": "ptm",
      "unicode": "e65c",
      "unicode_decimal": 58972
    },
    {
      "icon_id": "5387606",
      "name": "全屏",
      "font_class": "quanping",
      "unicode": "eb11",
      "unicode_decimal": 60177
    },
    {
      "icon_id": "6691134",
      "name": "权限",
      "font_class": "quanxian",
      "unicode": "e63f",
      "unicode_decimal": 58943
    },
    {
      "icon_id": "4736385",
      "name": "关闭其它",
      "font_class": "closeOther",
      "unicode": "e631",
      "unicode_decimal": 58929
    },
    {
      "icon_id": "6395682",
      "name": "关  闭",
      "font_class": "close-circle",
      "unicode": "e629",
      "unicode_decimal": 58921
    },
    {
      "icon_id": "10296880",
      "name": "关闭所有",
      "font_class": "closeAll",
      "unicode": "e60f",
      "unicode_decimal": 58895
    },
    {
      "icon_id": "879513",
      "name": "刷新",
      "font_class": "refresh",
      "unicode": "e619",
      "unicode_decimal": 58905
    },
    {
      "icon_id": "2576777",
      "name": "tree",
      "font_class": "tree",
      "unicode": "e6e8",
      "unicode_decimal": 59112
    },
    {
      "icon_id": "80224",
      "name": "退出",
      "font_class": "tuichu",
      "unicode": "e627",
      "unicode_decimal": 58919
    },
    {
      "icon_id": "9031766",
      "name": "sort16",
      "font_class": "moveSort2",
      "unicode": "e630",
      "unicode_decimal": 58928
    },
    {
      "icon_id": "10367835",
      "name": "sort",
      "font_class": "moveSort1",
      "unicode": "e93c",
      "unicode_decimal": 59708
    },
    {
      "icon_id": "11351033",
      "name": "-sort-2",
      "font_class": "moveSort",
      "unicode": "e73d",
      "unicode_decimal": 59197
    },
    {
      "icon_id": "777689",
      "name": "edit",
      "font_class": "edit",
      "unicode": "e62f",
      "unicode_decimal": 58927
    },
    {
      "icon_id": "8551103",
      "name": "arrows down",
      "font_class": "arrow-leftMore-circle",
      "unicode": "e623",
      "unicode_decimal": 58915
    },
    {
      "icon_id": "11266666",
      "name": "arrows down",
      "font_class": "arrow-rightMore-circle",
      "unicode": "e6fc",
      "unicode_decimal": 59132
    },
    {
      "icon_id": "519157",
      "name": "check-box-empty",
      "font_class": "checkbox-empty",
      "unicode": "e625",
      "unicode_decimal": 58917
    },
    {
      "icon_id": "519158",
      "name": "check-box",
      "font_class": "checkbox",
      "unicode": "e626",
      "unicode_decimal": 58918
    },
    {
      "icon_id": "8660113",
      "name": "add",
      "font_class": "add",
      "unicode": "e6ee",
      "unicode_decimal": 59118
    },
    {
      "icon_id": "6878719",
      "name": "delete",
      "font_class": "delete",
      "unicode": "e698",
      "unicode_decimal": 59032
    },
    {
      "icon_id": "1005342",
      "name": "info",
      "font_class": "info",
      "unicode": "e60a",
      "unicode_decimal": 58890
    },
    {
      "icon_id": "5279795",
      "name": "error",
      "font_class": "error",
      "unicode": "e620",
      "unicode_decimal": 58912
    },
    {
      "icon_id": "7597274",
      "name": "warn",
      "font_class": "warn",
      "unicode": "e601",
      "unicode_decimal": 58881
    },
    {
      "icon_id": "9788470",
      "name": "close",
      "font_class": "close",
      "unicode": "e607",
      "unicode_decimal": 58887
    },
    {
      "icon_id": "1802993",
      "name": "set",
      "font_class": "set-fill",
      "unicode": "e61e",
      "unicode_decimal": 58910
    },
    {
      "icon_id": "1380012",
      "name": "设置",
      "font_class": "set",
      "unicode": "e61d",
      "unicode_decimal": 58909
    },
    {
      "icon_id": "5140499",
      "name": "图表",
      "font_class": "chart",
      "unicode": "e632",
      "unicode_decimal": 58930
    },
    {
      "icon_id": "11198155",
      "name": "cc-arrow-right-circle",
      "font_class": "arrow-down-circle",
      "unicode": "e6f8",
      "unicode_decimal": 59128
    },
    {
      "icon_id": "10900908",
      "name": "arrow",
      "font_class": "arrow-down",
      "unicode": "e6f6",
      "unicode_decimal": 59126
    },
    {
      "icon_id": "11032339",
      "name": "arrow",
      "font_class": "arrow-left",
      "unicode": "e6f7",
      "unicode_decimal": 59127
    },
    {
      "icon_id": "11198224",
      "name": "cc-arrow-right-circle",
      "font_class": "arrow-up-circle",
      "unicode": "e6fa",
      "unicode_decimal": 59130
    },
    {
      "icon_id": "11198225",
      "name": "cc-arrow-right-circle",
      "font_class": "arrow-left-circle",
      "unicode": "e6fb",
      "unicode_decimal": 59131
    },
    {
      "icon_id": "58331",
      "name": "search",
      "font_class": "search",
      "unicode": "e621",
      "unicode_decimal": 58913
    },
    {
      "icon_id": "88038",
      "name": "clock",
      "font_class": "clock",
      "unicode": "e600",
      "unicode_decimal": 58880
    },
    {
      "icon_id": "144131",
      "name": "arrow",
      "font_class": "arrow-right",
      "unicode": "e636",
      "unicode_decimal": 58934
    },
    {
      "icon_id": "247436",
      "name": "table",
      "font_class": "table",
      "unicode": "e699",
      "unicode_decimal": 59033
    },
    {
      "icon_id": "372107",
      "name": "cc-arrow-right-circle",
      "font_class": "arrow-right-circle",
      "unicode": "e60d",
      "unicode_decimal": 58893
    },
    {
      "icon_id": "585102",
      "name": "help",
      "font_class": "help",
      "unicode": "e65d",
      "unicode_decimal": 58973
    },
    {
      "icon_id": "1045524",
      "name": "yxx_mark",
      "font_class": "mark",
      "unicode": "e63d",
      "unicode_decimal": 58941
    },
    {
      "icon_id": "1092161",
      "name": "钱",
      "font_class": "money",
      "unicode": "e640",
      "unicode_decimal": 58944
    },
    {
      "icon_id": "1104404",
      "name": "报表2",
      "font_class": "analyse",
      "unicode": "e6d2",
      "unicode_decimal": 59090
    },
    {
      "icon_id": "1237019",
      "name": "待办",
      "font_class": "dealt",
      "unicode": "e64a",
      "unicode_decimal": 58954
    },
    {
      "icon_id": "1327132",
      "name": "切换",
      "font_class": "change",
      "unicode": "e60e",
      "unicode_decimal": 58894
    },
    {
      "icon_id": "3405405",
      "name": "消息",
      "font_class": "bell",
      "unicode": "e6eb",
      "unicode_decimal": 59115
    },
    {
      "icon_id": "4111563",
      "name": "time",
      "font_class": "time",
      "unicode": "e64d",
      "unicode_decimal": 58957
    },
    {
      "icon_id": "5321791",
      "name": "画板主题",
      "font_class": "skin",
      "unicode": "e664",
      "unicode_decimal": 58980
    },
    {
      "icon_id": "5354204",
      "name": "邮箱",
      "font_class": "mail",
      "unicode": "e6af",
      "unicode_decimal": 59055
    },
    {
      "icon_id": "6050679",
      "name": "email",
      "font_class": "email",
      "unicode": "e628",
      "unicode_decimal": 58920
    },
    {
      "icon_id": "6427820",
      "name": "会议管理",
      "font_class": "meeting",
      "unicode": "e612",
      "unicode_decimal": 58898
    },
    {
      "icon_id": "6447175",
      "name": "今日收入",
      "font_class": "today",
      "unicode": "e645",
      "unicode_decimal": 58949
    },
    {
      "icon_id": "7876854",
      "name": "user",
      "font_class": "user",
      "unicode": "e606",
      "unicode_decimal": 58886
    },
    {
      "icon_id": "9102193",
      "name": "add",
      "font_class": "listadd",
      "unicode": "e654",
      "unicode_decimal": 58964
    },
    {
      "icon_id": "10104436",
      "name": "sun",
      "font_class": "sun",
      "unicode": "e6f5",
      "unicode_decimal": 59125
    }
  ]
}

Ignore Space Show notes View project/hivuiSam/assets/icon/iconfont.ttf 0 → 100644
Not supported

Ignore Space Show notes View project/hivuiSam/assets/icon/iconfont.woff 0 → 100644
Not supported

Ignore Space Show notes View project/hivuiSam/assets/icon/iconfont.woff2 0 → 100644
Not supported

Ignore Space Show notes View project/hivuiSam/assets/logo_max.png 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/analysisSam/Index.vue 0 → 100644
<template> <div class="container"> <!-- 工具条 --> <div class="btn-toolbar"> <el-button icon="el-icon-back" :disabled="backDisabled">后退</el-button> <el-button icon="el-icon-right" :disabled="goDisabled">前进</el-button> <el-dropdown split-button @click="sortClick"> <i class="el-icon-sort"></i>排序 <el-dropdown-menu slot="dropdown"> <el-dropdown-item>黄金糕</el-dropdown-item> <el-dropdown-item>狮子头</el-dropdown-item> <el-dropdown-item>螺蛳粉</el-dropdown-item> <el-dropdown-item>双皮奶</el-dropdown-item> <el-dropdown-item>蚵仔煎</el-dropdown-item> </el-dropdown-menu> </el-dropdown> <el-button icon="el-icon-setting" @click="analysisClick">分析列设置</el-button> <el-dropdown @command="chartTypeChange"> <el-button> <i class="el-icon-s-data"></i> 图表<i class="el-icon-arrow-down el-icon--right"></i> </el-button> <el-dropdown-menu slot="dropdown"> <el-dropdown-item command="table">表格</el-dropdown-item> <el-dropdown-item command="pie">饼图</el-dropdown-item> <el-dropdown-item command="bar">柱图</el-dropdown-item> <el-dropdown-item command="line">线图</el-dropdown-item> <el-dropdown-item command="area">区域图</el-dropdown-item> </el-dropdown-menu> </el-dropdown> <el-button icon="el-icon-refresh" @click="refresh">刷新</el-button> <el-button icon="el-icon-edit-outline">分析记录</el-button> <el-checkbox v-model="superposition" label="叠加" border size="medium" ></el-checkbox> <el-checkbox v-model="perspective" label="直接透视" border size="medium" ></el-checkbox> <el-button icon="el-icon-download">导出excel</el-button> </div> <hi-layout :is-fit="true" style="heiht: 100%;"> <!-- 右侧查询面板 --> <hi-layout-right size="300" title="过滤条件"> <birt-work-book style="height: calc( 100% - 142px );border-bottom: 1px dashed #3179de;overflow: auto;" :conf="birtModelRight" :ref="birtModelRight.controlId" ></birt-work-book> <el-form @submit.native.prevent ref="groupForm" style="padding: 10px 10px 0 0;" :model="groupForm" label-width="80px" > <el-form-item label="分组条件" prop="prop"> <el-select v-model="groupForm.prop" placeholder="请选择分组条件"> <el-option v-for="item in groupFields" :label="item.label" :value="item.prop" :key="item.prop" ></el-option> </el-select> </el-form-item> <el-form-item> <el-button type="primary" size="mini" :loading="loading" @click="doCount" >执行查询</el-button > <el-button size="mini" @click="reset">重置</el-button> </el-form-item> </el-form> </hi-layout-right> <!-- 图表展示区 --> <hi-layout-center style="heiht: 100%;"> <div class="depth-analysis"> <span>深度分析:</span> <el-breadcrumb separator-class="el-icon-arrow-right" style="padding: 0 0 0 10px;" > <el-breadcrumb-item v-for="(item,index) in deepArr" :key="item.prop"><a @click="breadcrumbClick(item.prop)">{{ item.label }}<span style="color: rgb(255, 102, 0);margin-left:2px;" v-if="index < curIndex">{{ item.selectVal }}</span></a></el-breadcrumb-item> </el-breadcrumb> </div> <div v-if="showDetail" style="height: calc( 100% - 100px )"> <el-table :data="data" ref="table" height="100%" border show-summary style="width: 100%" > <el-table-column v-for="item in tableColumns" :key="item.prop" :prop="item.prop" :label="item.label" > </el-table-column> </el-table> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[10, 20, 50, 100]" :page-size="10" layout="total, sizes, prev, pager, next, jumper" :total="total" > </el-pagination> </div> <div v-if="!showDetail && chartType == 'table'" style="height: calc( 100% - 100px )"> <el-table :data="data" ref="table" height="100%" border show-summary style="width: 100%" > <el-table-column v-for="item in tableColumns" :key="item.prop" :prop="item.prop" :label="item.label" > </el-table-column> </el-table> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[10, 20, 50, 100]" :page-size="10" layout="total, sizes, prev, pager, next, jumper" :total="total" > </el-pagination> </div> <Pie-chart style="height: calc( 100% - 100px )" v-else-if="!showDetail && chartType == 'pie'" ref="chartConf" :conf="chartConf" ></Pie-chart> <Bar-chart style="height: calc( 100% - 100px )" v-else-if="!showDetail && chartType == 'bar'" ref="chartConf" :conf="chartConf" ></Bar-chart> <Line-chart style="height: calc( 100% - 100px )" v-else-if="!showDetail && chartType == 'line'" ref="chartConf" :conf="chartConf" ></Line-chart> <Line-chart style="height: calc( 100% - 100px )" v-else-if="!showDetail && chartType == 'area'" ref="chartConf" :conf="chartConf" ></Line-chart> </hi-layout-center> </hi-layout> <!-- 分析列 --> <el-dialog :visible.sync="analysisVisible" title="分析列设置" :height="500"> <el-table :data="analysisData" size="small" :height="400"> <el-table-column prop="countField" label="统计字段"> </el-table-column> <el-table-column prop="tableColumn" label="网格列" align="center"> <template slot="header" slot-scope="{row}"> <el-checkbox v-model="tableColumnCheck" @change="handelCheckAll('tableColumn')" label="网格列"></el-checkbox> </template> <template slot-scope="{row}"> <el-checkbox v-model="row.tableColumn"></el-checkbox> </template> </el-table-column> <el-table-column prop="tableColumn" label="网格合计列" align="center"> <template slot="header" slot-scope="{row}"> <el-checkbox v-model="tableColumnCountCheck" @change="handelCheckAll('tableColumnCount')" label="网格合计列"></el-checkbox> </template> <template slot-scope="{row}"> <el-checkbox v-model="row.tableColumnCount"></el-checkbox> </template> </el-table-column> <el-table-column prop="tableColumn" label="图表列" align="center"> <template slot="header" slot-scope="{row}"> <el-checkbox v-model="chartColumnCheck" @change="handelCheckAll('chartColumn')" label="图表列"></el-checkbox> </template> <template slot-scope="{row}"> <el-checkbox v-model="row.chartColumn"></el-checkbox> </template> </el-table-column> <el-table-column prop="chartColumnCount" label="图表列汇总" align="center"> <template slot="header" slot-scope="{row}"> <el-checkbox v-model="chartColumnCountCheck" @change="handelCheckAll('chartColumnCount')" label="图表列汇总"></el-checkbox> </template> <template slot-scope="{row}"> <el-checkbox v-model="row.chartColumnCount"></el-checkbox> </template> </el-table-column> </el-table> </el-dialog> <!-- 分析字段 --> <el-dialog :visible.sync="analysisFieldsVisible" title="选择分析字段" :height="500"> <Pie-chart style="height: 400px;" ref="analysisChart" :conf="analysisChartConf" ></Pie-chart> </el-dialog> </div> </template> <script> import { QueryStyleFactory } from "../templates/query-panel/QueryStyleFactory"; export default { name: "AnalysisSam", props:{ conf:{ type: Object, } }, computed: { tableColumns() { return [ { prop: "dept", label: "部门名称" }, { prop: "value", label: "产能" } ]; }, // 图表配置 chartConf() { let groupBy = 'dept' let controlName = '' let datas = this.data controlName = this.chartType == "pie" ? "PieChart" : this.chartType == "bar" ? "BarChart" : this.chartType == "line" ? "LineChart" : this.chartType == "area" ? "LineChart" : 'PieChart' let pieSeries = [ { smooth: true, areaStyle: { normal: { color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: "rgba(30, 231, 231, 0.3)" },{ offset: 1, color: "rgba(30, 231, 231, 0.1)" }]), }, }, label: { show: false, position: "outside", }, }, { smooth: true, areaStyle: { normal: { color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: "rgba(30, 231, 231, 0.3)" },{ offset: 1, color: "rgba(30, 231, 231, 0.1)" }]), }, }, label: { show: false, position: "outside", }, }, ]; let series = [] const conf = { controlName: controlName, controlId: "chart_controlid", height: "100%", isGroupData: true, groupBy: groupBy, datas: datas, calcFields: [ { name: "value", title: "产能" } ], option: { legend: { show: true }, series: this.chartType == "area" ? pieSeries : series }, events:{ click(row){ debugger let _this = this.$parent.$parent.$parent; _this.currentObj = row.data _this.currentObj.prop = _this.curGroupField; _this.analysisChartConf.datas = _this.deepAnalysisFields _this.analysisFieldsVisible = true } } }; return conf }, // 深度分析字段列表 deepAnalysisFields(){ debugger let fields = this.groupFields if(fields && fields.length == 0){ return [] } let analysisFields = fields.map((item) => { item.value = 1 return item }); // 排除已经统计的分析列 if(this.deepArr && this.deepArr.length > 0){ let arrnew = this.deepArr.slice(0, this.curIndex + 1).map((item) => { return item.prop }); analysisFields = analysisFields.filter(item =>{ return arrnew.indexOf(item.prop) < 0 }) // this.deepArr.forEach(item=>{ // let index = arrnew.indexOf(item.prop) // if(index > -1){ // analysisFields.splice(index, 1) // } // }) } // 添加详情 analysisFields.push( { prop: 'detail', label: "详情", value: 1 } ) return analysisFields }, // 分组条件(统计字段) groupFields(){ return this.conf && this.conf.groupFields \|\| [] }, // 显示详情 showDetail(){ return this.currentObj.prop == 'detail' } }, data() { return { superposition: false, perspective: false, chartType: "table", birtModelCenter: { controlName: "BirtWorkBook", controlId: "BirtWorkBook_center", showToolBar: false, children: [ { controlName: "BirtSheet", controlId: "BirtSheet_0", name: "sheet0", pageIndex: 0, dataSets: [], children: [ { controlName: "BirtFormSheet", controlId: "BirtFormSheet_01", children: [] } ] } ] }, birtModelRight: {}, groupForm: { prop: "dept" }, loading: false, currentPage: 1, total: 0, data: [], showSummary: (this.conf && this.conf.showSummary) \|\| true, // 后退 backDisabled: true, // 前进 goDisabled: true, // 排序 sortArr:[], currentSort:{}, // 分析列 analysisVisible: false, analysisData:[], tableColumnCheck: true, tableColumnCountCheck: true, chartColumnCheck: true, chartColumnCountCheck: true, // 分析字段 analysisFieldsVisible: false, analysisFieldsArr:[], analysisChartConf:{ controlName: "PieChart", controlId: "chart_analysis", height: "100%", isGroupData: true, groupBy: "label", datas: [], calcFields: [ { name: "value", title: "" } ], option: { legend: { show: true } }, events:{ click(row){ debugger; var _this = this.$parent.$parent; _this.analysisChartConf.datas = _this.deepAnalysisFields let data = JSON.parse(JSON.stringify(row.data)) delete data.emphasis // 删除当前分析以后的深度分析 _this.deepArr.splice(_this.curIndex+1, _this.deepArr.length - _this.curIndex - 1) let obj = _this.deepArr[_this.deepArr.length -1] obj.selectVal = _this.currentObj.name _this.$set(_this.deepArr,_this.curIndex,obj) _this.$set(_this.deepArr,_this.curIndex + 1, data) _this.curGroupField = data.prop; _this.currentObj = data; _this.curIndex = _this.curIndex + 1; _this.$refs.BirtWorkBook_right.dataset.dsUserInfo.query(); _this.analysisFieldsVisible = false; } } }, // 深度分析 deepArr:[], conf:{}, // 图表当前选中对象 currentObj:{}, // 当前分组字段 curGroupField: '', // 深度分析当前环节下标 curIndex: 0, } }, updated() { this.$nextTick(() => { this.$refs["table"] && this.$refs["table"].doLayout(); }); }, methods: { sortClick() {}, breadcrumbClick(val) { debugger this.curGroupField = val let arrnew = this.deepArr.map(item =>{ return item.prop }) this.curIndex = arrnew.indexOf(val) this.currentObj = this.deepArr[this.curIndex]; }, doCount() { debugger; this.loading = true; this.$refs.BirtWorkBook_right.dataset.dsUserInfo.query(); let prop = this.groupForm.prop; let fields = this.groupFields.map(item =>{ return item.prop }) this.curGroupField = prop; let index = fields.indexOf(prop) // 当前分组加入深度分析 if(index < 0){ this.$message.error('当前分组条件不在分组字段中，请重新配置') }else{ this.$set(this.deepArr,0,this.groupFields[index]) this.curIndex = 0 } setTimeout(() => { this.data = [ { dept: "研发部", value: 29620 }, { dept: "测试部", value: 19850 } ]; this.total = 2; this.loading = false; }, 500); }, // 重置 reset() { this.$refs.groupForm.resetFields(); }, handleSizeChange(val) { console.log(`每页 ${val} 条`); }, handleCurrentChange(val) { console.log(`当前页: ${val}`); }, // 切换图表 chartTypeChange(command) { this.chartType = command; }, // 打开分析列 analysisClick(){ this.analysisVisible = true }, // 分系列全选 handelCheckAll(val){ debugger let _this = this this.analysisData = this.analysisData.map(item => { if(val == 'tableColumn') { item.tableColumn = _this.tableColumnCheck } if(val == 'tableColumnCount') { item.tableColumnCount = _this.tableColumnCountCheck } if(val == 'chartColumn') { item.chartColumn = _this.chartColumnCheck } if(val == 'chartColumnCount') { item.chartColumnCount = _this.chartColumnCountCheck } return item }) }, // 刷新 refresh(){ this.$refs.BirtWorkBook_right.dataset.dsUserInfo.query(); this.$refs.chartConf && this.$refs.chartConf.refreshChart(); } }, created() { const queryPanel = { rows: [ { children: [ { prop: "FUSERID" } ], colspan: 6 }, { children: [ { prop: "FUSERNAME" } ], colspan: 6 }, { children: [ { prop: "FSEX" } ], colspan: 6 } ], cols: [ { colWidth: 60 }, { colWidth: 60 }, { colWidth: 60 } ] }; let hcQueryPanel = { controlName: "HcQueryPanel", controlId: "HcQueryPanel_12", inline: false, dataset: "dsUserInfo", size: "small", hideBtn: true, style: "width: 100%;", children: [] }; Object.assign(hcQueryPanel, QueryStyleFactory.buildForm(queryPanel) \|\| {}); this.birtModelRight = { controlName: "BirtWorkBook", controlId: "BirtWorkBook_right", style: "border-bottom: 1px solid #eee;", showToolBar: false, children: [ { controlName: "BirtSheet", controlId: "BirtSheet_right", name: "sheet0", pageIndex: 0, dataSets: [ { controlName: "HcDataset", controlId: "dsUserInfo", name: "SysUserBizEntity", modelFilePath: "/platf/user-info/entity/SysUserInfoBizEntity.xml", _infcPush: { receiveParam: { default: { FUSERID: "FUSERID" } }, receiveLookupInput: "FUSERNAMEJP" }, _infcLoad: { autoActive: false }, _infcPagging: { returnCount: true, pageSize: 10, pageNum: 1 }, fields: { FUSERID: { label: "工号", dbtype: "dbString", readonly: true, sign: "like" }, FUSERID2: { label: "工号", dbtype: "dbString" }, FUSERNAME: { label: "姓名", dbtype: "dbString" }, FUSERNAMEJP: { label: "姓名简拼", dbtype: "dbString", dependFields: "FUSERNAME" }, FCITYLIST: { label: "所在城市", dbtype: "dbString", style: "width: 100%" }, FUSERPROVINCE: { label: "所在省份", dbtype: "dbString", style: "width: 100%" }, FUSERSTYLE: { label: "皮肤", dbtype: "dbString" }, FUSERMAINMBURL: { label: "个人手机主页", dbtype: "dbString" }, FUSERMAINPCURL: { label: "个人PC主页", dbtype: "dbString" }, FUSERTYPE: { label: "类型", dbtype: "dbString" }, FUSERTYPENAME: { label: "用户类型", dbtype: "dbString" }, FUSERSFZ: { label: "身份证号", dbtype: "dbString" }, FUSERSFZPIC1: { label: "身份证正面照", dbtype: "dbString" }, FUSERSFZPIC2: { label: "身份证反面照", dbtype: "dbString" }, FBIRTHDAY: { label: "出生年月", dbtype: "dbDatetime", format: "yyyy-MM-dd" }, FSTATE: { label: "是否禁用", dbtype: "dbIntBoolean" }, FSEX: { label: "性别", dbtype: "dbInt", default: { expr: (data, option) => { return data.FSEX ? 1 : 0; } } }, FADDRESS: { label: "地址", dbtype: "dbString" }, FMBPHONE: { label: "手机号码", dbtype: "dbString" }, FPHONE: { label: "电话", dbtype: "dbString" }, FEMAIL: { label: "邮箱", dbtype: "dbString" }, FQQ: { label: "QQ号码", dbtype: "dbString" }, FWEIXIN: { label: "微信号码", dbtype: "dbString" }, FUSERPHOTO: { label: "用户头像", dbtype: "dbString" }, FUSERSIGN: { label: "电子签名", dbtype: "dbString" }, FUSERSIGN2: { label: "电子签名2", dbtype: "dbString" }, FUSERSIGN3: { label: "电子签名3", dbtype: "dbString" }, FREGIP: { label: "注册地址", dbtype: "dbString" }, FNOTE: { label: "备注", dbtype: "dbString" }, FFAX: { label: "传真", dbtype: "dbString" }, SYS_FAUDITPOINT: { label: "审批状态", dbtype: "dbInt" }, SYS_FOPERATOR: { label: "制单人", dbtype: "dbString" }, SYS_FOPERATORBZ: { label: "制单岗位号", dbtype: "dbString" }, SYS_FOPERATORNAME: { label: "制单人", dbtype: "dbString" }, SYS_FAGENT: { label: "代理人", dbtype: "dbString" }, SYS_FAGENTBZ: { label: "代理岗位号", dbtype: "dbString" }, SYS_FAGENTNAME: { label: "代理人", dbtype: "dbString" }, SYS_FORGID: { label: "机构ID", dbtype: "dbString" }, SYS_FORGNAME: { label: "操作者机构", dbtype: "dbString" }, SYS_FWRITETIME: { label: "制单时间", dbtype: "dbDatetime", format: "yyyy-MM-dd hh:mm:ss" }, SYS_FAUDITTIME: { label: "审核时间", dbtype: "dbDatetime", readonly: true, format: "yyyy-MM-dd hh:mm:ss" }, FREGTIME: { label: "制单时间", dbtype: "dbDatetime", readonly: true, format: "yyyy-MM-dd hh:mm:ss" } }, data: [] } ], children: [ { controlName: "BirtFormSheet", controlId: "BirtFormSheet_01", children: [hcQueryPanel] } ] } ] }; // if (Object.values(this.conf).length == 0) { // this.conf = { // dataset: { // controlName: "HcDataset", // controlId: "dsUserInfo", // name: "SysUserBizEntity", // modelFilePath: "/platf/user-info/entity/SysUserInfoBizEntity.xml", // _infcPush: { // receiveParam: { // default: { // FUSERID: "FUSERID" // } // }, // receiveLookupInput: "FUSERNAMEJP" // }, // _infcLoad: { // autoActive: true // }, // _infcPagging: { // returnCount: true, // pageSize: 10, // pageNum: 1 // }, // data: [] // }, // columns: [ // { // prop: "FUSERID", // label: "用户ID" // }, // { // prop: "FUSERNAME", // label: "用户姓名" // }, // { // prop: "FSEX", // label: "性别" // }, // { // prop: "FDEPT", // label: "部门 " // }, // { // prop: "FNUM", // label: "产能" // } // ], // queryFields: [ // { // prop: "FSEX" // } // ], // groupFields: [ // { // prop: 'dept', // label: "部门" // }, // { // prop: 'name', // label: "姓名" // }, // { // prop: 'age', // label: "年龄" // }, // ] // }; // } }, mounted() { this.analysisData=[ { countField: '姓名', tableColumn: true, tableColumnCount: true, chartColumn: true, chartColumnCount: true } ]; } }; </script> <style lang="scss" scoped> .container { position: relative; display: flex; flex-direction: column; height: 100%; padding: 20px; } .btn-toolbar { * + * { margin-left: 10px; margin-right: 0; } } .el-dropdown-menu__item { min-width: 110px; } .center-content { height: 100%; width: 100%; padding: 10px; box-sizing: border-box; } .depth-analysis { display: flex; align-items: center; padding: 10px; } .el-breadcrumb__item a { cursor: pointer !important; } </style>

Ignore Space Show notes View

project/hivuiSam/components/analysisSam/Index.vue 0 → 100644

<template>
  <div class="container">
    
    <div class="btn-toolbar">
      <el-button icon="el-icon-back" :disabled="backDisabled">后退</el-button>
      <el-button icon="el-icon-right" :disabled="goDisabled">前进</el-button>
      <el-dropdown split-button @click="sortClick">
        <i class="el-icon-sort"></i>排序
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item>黄金糕</el-dropdown-item>
          <el-dropdown-item>狮子头</el-dropdown-item>
          <el-dropdown-item>螺蛳粉</el-dropdown-item>
          <el-dropdown-item>双皮奶</el-dropdown-item>
          <el-dropdown-item>蚵仔煎</el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
      <el-button icon="el-icon-setting" @click="analysisClick">分析列设置</el-button>
      <el-dropdown @command="chartTypeChange">
        <el-button>
          <i class="el-icon-s-data"></i>
          图表<i class="el-icon-arrow-down el-icon--right"></i>
        </el-button>
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item command="table">表格</el-dropdown-item>
          <el-dropdown-item command="pie">饼图</el-dropdown-item>
          <el-dropdown-item command="bar">柱图</el-dropdown-item>
          <el-dropdown-item command="line">线图</el-dropdown-item>
          <el-dropdown-item command="area">区域图</el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
      <el-button icon="el-icon-refresh" @click="refresh">刷新</el-button>
      <el-button icon="el-icon-edit-outline">分析记录</el-button>
      <el-checkbox
        v-model="superposition"
        label="叠加"
        border
        size="medium"
      ></el-checkbox>
      <el-checkbox
        v-model="perspective"
        label="直接透视"
        border
        size="medium"
      ></el-checkbox>
      <el-button icon="el-icon-download">导出excel</el-button>
    </div>
    <hi-layout :is-fit="true" style="heiht: 100%;">
      
      <hi-layout-right size="300" title="过滤条件">
        <birt-work-book
          style="height: calc( 100% - 142px );border-bottom: 1px dashed #3179de;overflow: auto;"
          :conf="birtModelRight"
          :ref="birtModelRight.controlId"
        ></birt-work-book>
        <el-form
          @submit.native.prevent
          ref="groupForm"
          style="padding: 10px 10px 0 0;"
          :model="groupForm"
          label-width="80px"
        >
          <el-form-item label="分组条件" prop="prop">
            <el-select v-model="groupForm.prop" placeholder="请选择分组条件">
              <el-option
                v-for="item in groupFields"
                :label="item.label"
                :value="item.prop"
                :key="item.prop"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              size="mini"
              :loading="loading"
              @click="doCount"
              >执行查询</el-button
            >
            <el-button size="mini" @click="reset">重置</el-button>
          </el-form-item>
        </el-form>
      </hi-layout-right>
      
      <hi-layout-center style="heiht: 100%;">
        <div class="depth-analysis">
          <span>深度分析:</span>
          <el-breadcrumb
            separator-class="el-icon-arrow-right"
            style="padding: 0 0 0 10px;"
          >
            <el-breadcrumb-item v-for="(item,index) in deepArr" :key="item.prop"><a @click="breadcrumbClick(item.prop)">{{ item.label }}<span style="color: rgb(255, 102, 0);margin-left:2px;" v-if="index < curIndex">{{ item.selectVal }}</span></a></el-breadcrumb-item>
          </el-breadcrumb>
        </div>
        <div v-if="showDetail" style="height: calc( 100% - 100px )">
          <el-table
            :data="data"
            ref="table"
            height="100%"
            border
            show-summary
            style="width: 100%"
          >
            <el-table-column
              v-for="item in tableColumns"
              :key="item.prop"
              :prop="item.prop"
              :label="item.label"
            >
            </el-table-column>
          </el-table>
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="10"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
          >
          </el-pagination>
        </div>
        <div v-if="!showDetail && chartType == 'table'" style="height: calc( 100% - 100px )">
          <el-table
            :data="data"
            ref="table"
            height="100%"
            border
            show-summary
            style="width: 100%"
          >
            <el-table-column
              v-for="item in tableColumns"
              :key="item.prop"
              :prop="item.prop"
              :label="item.label"
            >
            </el-table-column>
          </el-table>
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="10"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
          >
          </el-pagination>
        </div>
        <Pie-chart
          style="height: calc( 100% - 100px )"
          v-else-if="!showDetail && chartType == 'pie'"
          ref="chartConf"
          :conf="chartConf"
        ></Pie-chart>
        <Bar-chart
          style="height: calc( 100% - 100px )"
          v-else-if="!showDetail && chartType == 'bar'"
          ref="chartConf"
          :conf="chartConf"
        ></Bar-chart>
        <Line-chart
          style="height: calc( 100% - 100px )"
          v-else-if="!showDetail && chartType == 'line'"
          ref="chartConf"
          :conf="chartConf"
        ></Line-chart>
        <Line-chart
          style="height: calc( 100% - 100px )"
          v-else-if="!showDetail && chartType == 'area'"
          ref="chartConf"
          :conf="chartConf"
        ></Line-chart>
      </hi-layout-center>
    </hi-layout>
    
    <el-dialog :visible.sync="analysisVisible" title="分析列设置" :height="500">
      <el-table :data="analysisData" size="small" :height="400">
        <el-table-column
          prop="countField"
          label="统计字段">
        </el-table-column>
        <el-table-column prop="tableColumn" label="网格列" align="center">
          <template slot="header" slot-scope="{row}">
            <el-checkbox v-model="tableColumnCheck" @change="handelCheckAll('tableColumn')" label="网格列"></el-checkbox>
          </template>
          <template slot-scope="{row}">
            <el-checkbox v-model="row.tableColumn"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column prop="tableColumn" label="网格合计列" align="center">
          <template slot="header" slot-scope="{row}">
            <el-checkbox v-model="tableColumnCountCheck" @change="handelCheckAll('tableColumnCount')" label="网格合计列"></el-checkbox>
          </template>
          <template slot-scope="{row}">
            <el-checkbox v-model="row.tableColumnCount"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column prop="tableColumn" label="图表列" align="center">
          <template slot="header" slot-scope="{row}">
            <el-checkbox v-model="chartColumnCheck" @change="handelCheckAll('chartColumn')" label="图表列"></el-checkbox>
          </template>
          <template slot-scope="{row}">
            <el-checkbox v-model="row.chartColumn"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column prop="chartColumnCount" label="图表列汇总" align="center">
          <template slot="header" slot-scope="{row}">
            <el-checkbox v-model="chartColumnCountCheck" @change="handelCheckAll('chartColumnCount')" label="图表列汇总"></el-checkbox>
          </template>
          <template slot-scope="{row}">
            <el-checkbox v-model="row.chartColumnCount"></el-checkbox>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
    
    <el-dialog  :visible.sync="analysisFieldsVisible" title="选择分析字段" :height="500">
       <Pie-chart
          style="height: 400px;"
          ref="analysisChart"
          :conf="analysisChartConf"
        ></Pie-chart>
    </el-dialog>
  </div> 
</template>

Ignore Space Show notes View project/hivuiSam/components/templates/query-panel/QueryStyleFactory.js 0 → 100644
import { queryStyle01 } from "./data-list/query-style-01"; /** * 查询面板风格构建类 */ export const QueryStyleFactory = { buildForm: function (form) { if (form) { return queryStyle01(form.rows, form); } return form; } }

Ignore Space Show notes View project/hivuiSam/components/templates/query-panel/data-list/query-style-01.js 0 → 100644
/** * datalist网格查询面板布局风格1 * @param {} form 表单配置[{colspan:1,prop:"fieldName1",label:"字段1"}] @param {} option.hcQueryPanel 查询面板个性化配置 @param {} option.hcDataList 数据列表个性化配置 @param {} option.row 网格行通用配置 @param {} option.cols 网格列配置 @returns */ export function queryStyle01(form, option = {}) { // 初始化cols列配置, 默认3列 let cols = option.cols \|\| [ { colWidth: "40%", }, { colWidth: "30%", }, { colWidth: "30%", } ] // 计算rows查询面板内容 let rows = {}; let curtRow = newEmptyRow(); let rIndex = 1; let colTotalCount = cols.length; let colSpanCount = 0; // 计算rows行配置 function newEmptyRow() { // 创建空行 return Object.assign({ tds: {} }, option.row \|\| {}); } // 不足列进行补全 function fillTd(rIndex, curtColIndex, colCount, curtRow) { if (curtColIndex < colCount) { for (let m = curtColIndex; m < colCount; m++) { let mAxis = String.fromCharCode(65 + m) + rIndex; curtRow.tds[mAxis] = { colspan: 1 } } } } for (let i = 0, l = form.length; i < l; i++) { let fItem = form[i]; let colspan = fItem.colspan \|\| 1; let tdAxis = String.fromCharCode(65 + colSpanCount); // 当前项已超本行总列数或当前是行分隔项，补全空余, 别取新行 if (colSpanCount + colspan > colTotalCount) { // 不足列进行补全 fillTd(rIndex, colSpanCount, colTotalCount, curtRow); // 当前列添加到rows,另取新行 let rAxis = "r" + rIndex; rows[rAxis] = JSON.parse(JSON.stringify(curtRow)); curtRow = newEmptyRow(); rIndex++; colSpanCount = 0; } // 当前行curtRow添加表单项td let propAxis = tdAxis + rIndex; curtRow.tds[propAxis] = fItem; colSpanCount += colspan; } // 添加最后一行 if (colSpanCount > 0) { // 补全最后一行 fillTd(rIndex, colSpanCount, colTotalCount, curtRow); let rAxis = "r" + rIndex; rows[rAxis] = JSON.parse(JSON.stringify(curtRow)); } // 定义dataList布局 let dataList = { controlName: "HcDataList", controlId: "HcDataList_02", width: "100%", style: "border-spacing:0px;border-collapse: collapse;table-layout:fixed;word-break:break-all;", rows: rows, cols: cols } // 应用datalist个性化配置 Object.assign(dataList, option.hcDataList); // 定义查询面板 let queryPanel = { inline: true, size: "small", children: [ dataList ], }; // 查询面板 return Object.assign(queryPanel, Option.hcQueryPanel); }

Ignore Space Show notes View

project/hivuiSam/components/templates/query-panel/data-list/query-style-01.js 0 → 100644

/**
* datalist网格查询面板布局风格1
* @param {*} form 表单配置[{colspan:1,prop:"fieldName1",label:"字段1"}]
* @param {*} option.hcQueryPanel 查询面板个性化配置
* @param {*} option.hcDataList 数据列表个性化配置
* @param {*} option.row 网格行通用配置
* @param {*} option.cols 网格列配置
* @returns
*/

export function queryStyle01(form, option = {}) {

// 初始化cols列配置, 默认3列
    let cols = option.cols || [
        {
            colWidth: "40%",
        },
        {
            colWidth: "30%",
        },
        {
            colWidth: "30%",
        }
    ]
    // 计算rows查询面板内容
    let rows = {};
    let curtRow = newEmptyRow();
    let rIndex = 1;
    let colTotalCount = cols.length;
    let colSpanCount = 0;

// 计算rows行配置
    function newEmptyRow() {
        // 创建空行
        return Object.assign({ tds: {} }, option.row || {});
    }

// 不足列进行补全
    function fillTd(rIndex, curtColIndex, colCount, curtRow) {
        if (curtColIndex < colCount) {
            for (let m = curtColIndex; m < colCount; m++) {
                let mAxis = String.fromCharCode(65 + m) + rIndex;
                curtRow.tds[mAxis] = {
                    colspan: 1
                }
            }
        }
    }

for (let i = 0, l = form.length; i < l; i++) {
        let fItem = form[i];
        let colspan = fItem.colspan || 1;
        let tdAxis = String.fromCharCode(65 + colSpanCount);

// 当前项已超本行总列数或当前是行分隔项，补全空余, 别取新行
        if (colSpanCount + colspan > colTotalCount) {
            // 不足列进行补全
            fillTd(rIndex, colSpanCount, colTotalCount, curtRow);
            // 当前列添加到rows,另取新行
            let rAxis = "r" + rIndex;
            rows[rAxis] = JSON.parse(JSON.stringify(curtRow));
            curtRow = newEmptyRow();
            rIndex++;
            colSpanCount = 0;
        }
        // 当前行curtRow添加表单项td
        let propAxis = tdAxis + rIndex;
        curtRow.tds[propAxis] = fItem;
        colSpanCount += colspan;
    }
    // 添加最后一行
    if (colSpanCount > 0) {
        // 补全最后一行
        fillTd(rIndex, colSpanCount, colTotalCount, curtRow);
        let rAxis = "r" + rIndex;
        rows[rAxis] = JSON.parse(JSON.stringify(curtRow));
    }
    // 定义dataList布局
    let dataList = {
        controlName: "HcDataList",
        controlId: "HcDataList_02",
        width: "100%",
        style: "border-spacing:0px;border-collapse: collapse;table-layout:fixed;word-break:break-all;",
        rows: rows,
        cols: cols
    }
    // 应用datalist个性化配置
    Object.assign(dataList, option.hcDataList);
    // 定义查询面板
    let queryPanel = {
        inline: true,
        size: "small",
        children: [
            dataList
        ],
    };
    // 查询面板
    return Object.assign(queryPanel, Option.hcQueryPanel);
}

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/assets/error.svg 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/assets/info.svg 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/assets/loading.svg 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/assets/success.svg 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/assets/warning.svg 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/icon/icon.jsx 0 → 100644
'use strict' const icons = {} export const addIcon = function (name, options) { icons[name] = options } const Icon = { name: 'Icon', props: { name: String, color: String }, computed: { svg () { return icons[this.name] } }, // eslint-disable-next-line render (h) { const svg = this.svg if (!svg) { // eslint-disable-next-line console.warn(`The name of '${this.name}' could not be found.`) return <span class="m-svg-icon"></span> } const style = { color: this.color ? this.color : (svg.fill ? svg.fill : null) } return ( <span class={['m-svg-icon', 'm-svg-icon--' + this.name]}> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox={svg.viewBox} style={style} class={svg.class}> { svg.defs && <defs domPropsInnerHTML={svg.defs}></defs> } { svg.path && <path fill="currentColor" d={svg.path} /> } { svg.html && <g domPropsInnerHTML={svg.html}></g> } {this.$slots.default} </svg> </span> ) } } Icon.add = addIcon export default Icon

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/icon/icon.jsx 0 → 100644

'use strict'
const icons = {}

export const addIcon = function (name, options) {
  icons[name] = options
}

const Icon = {
  name: 'Icon',
  props: {
    name: String,
    color: String
  },
  computed: {
    svg () {
      return icons[this.name]
    }
  },
  // eslint-disable-next-line
  render (h) {
    const svg = this.svg

if (!svg) {
      // eslint-disable-next-line
      console.warn(`The name of '${this.name}' could not be found.`)
      return <span class="m-svg-icon"></span>
    }

const style = {
      color: this.color ? this.color : (svg.fill ? svg.fill : null)
    }

return (
      <span class={['m-svg-icon', 'm-svg-icon--' + this.name]}>
        <svg
          version="1.1"
          xmlns="http://www.w3.org/2000/svg"
          viewBox={svg.viewBox}
          style={style}
          class={svg.class}>
          { svg.defs && <defs domPropsInnerHTML={svg.defs}></defs> }
          { svg.path && <path fill="currentColor" d={svg.path} /> }
          { svg.html && <g domPropsInnerHTML={svg.html}></g> }
          {this.$slots.default}
        </svg>
      </span>
    )
  }
}

Icon.add = addIcon

export default Icon

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/icon/index.js 0 → 100644
import Icon from './icon' import InfoIcon from './svgs/info' import SuccessIcon from './svgs/success' import ErrorIcon from './svgs/error' import WarningIcon from './svgs/warning' import LoadingIcon from './svgs/loading' Icon.add(InfoIcon.name, InfoIcon) Icon.add(SuccessIcon.name, SuccessIcon) Icon.add(ErrorIcon.name, ErrorIcon) Icon.add(WarningIcon.name, WarningIcon) Icon.add(LoadingIcon.name, LoadingIcon) export default Icon

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/icon/index.js 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/icon/svgs/error.js 0 → 100644
export default { name: 'error', fill: '#F56C6C', viewBox: '0 0 1024 1024', path: 'M512,952C269,952,72,755,72,512S269,72,512,72s440,197,440,440S755,952,512,952z M579.7,512l101.6-101.6 c18.7-18.7,18.7-49,0-67.7c-18.7-18.7-49-18.7-67.7,0l0,0L512,444.3L410.4,342.7c-18.7-18.7-49-18.7-67.7,0s-18.7,49,0,67.7 L444.3,512L342.7,613.6c-18.7,18.7-18.7,49,0,67.7c18.7,18.7,49,18.7,67.7,0L512,579.7l101.6,101.6c18.7,18.7,49,18.7,67.7,0 c18.7-18.7,18.7-49,0-67.7L579.7,512z' }

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/icon/svgs/error.js 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/icon/svgs/info.js 0 → 100644
export default { name: 'info', fill: '#1CADF2', viewBox: '0 0 1024 1024', path: 'M512,72C269,72,72,269,72,512s197,440,440,440s440-197,440-440S755,72,512,72z M581,673.9 c-33.2,49.9-67,88.3-123.8,88.3c-38.8-6.3-54.7-34.1-46.3-62.4L484,457.6c1.8-5.9-1.2-12.3-6.6-14.2c-5.4-1.9-15.9,5.1-25.1,15.1 l-44.2,53.2c-1.2-8.9-0.1-23.7-0.1-29.6c33.2-49.9,87.8-89.2,124.8-89.2c35.2,3.6,51.8,31.7,45.7,62.6l-73.6,243.3 c-1,5.5,1.9,11.1,6.9,12.8c5.4,1.9,16.8-5.1,26-15.1l44.2-53.1C583,652.3,581,667.9,581,673.9z M571.2,357.6 c-28,0-50.6-20.4-50.6-50.4c0-30,22.7-50.3,50.6-50.3c28,0,50.6,20.4,50.6,50.3C621.8,337.3,599.1,357.6,571.2,357.6z' }

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/icon/svgs/info.js 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/icon/svgs/loading.js 0 → 100644
export default { name: 'loading', viewBox: '0 0 50 50', class: 'm-loading-icon m-loading-wipe', defs: `<style> .m-loading-icon { stroke: #343640; stroke-width: 3.5; stroke-linecap: round; background: none; vertical-align: middle; } .m-loading-icon .m-loading-icon-bg-path{ fill: none; stroke: #F2F2F2; } .m-loading-icon .m-loading-icon-active-path{ fill: none; stroke: #20a0ff; transform-origin: 50% 50%; } .m-loading-wipe .m-loading-icon-active-path{ stroke-dasharray: 90, 150; stroke-dashoffset: 0; animation: loading-wipe 1.5s ease-in-out infinite, loading-rotate 2s linear infinite; } .m-loading-default .m-loading-icon-active-path{ stroke-dasharray: 60, 150; animation: loading-rotate 0.8s linear infinite; } @keyframes loading-rotate{ to{transform:rotate(1turn)} } @keyframes loading-wipe{ 0%{ stroke-dasharray:1,200; stroke-dashoffset:0; } 50%{ stroke-dasharray:90,150; stroke-dashoffset:-40px; } to{ stroke-dasharray:90,150; stroke-dashoffset:-120px; } } </style>`, html: '<circle cx="25" cy="25" r="20" class="m-loading-icon-bg-path"></circle><circle cx="25" cy="25" r="20" class="m-loading-icon-active-path"></circle>' }

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/icon/svgs/loading.js 0 → 100644

export default {
  name: 'loading',
  viewBox: '0 0 50 50',
  class: 'm-loading-icon m-loading-wipe',
  defs: `<style>
    .m-loading-icon {
      stroke: #343640;
      stroke-width: 3.5;
      stroke-linecap: round;
      background: none;
      vertical-align: middle;
    }
    .m-loading-icon .m-loading-icon-bg-path{
      fill: none;
      stroke: #F2F2F2;
    }
    .m-loading-icon .m-loading-icon-active-path{
      fill: none;
      stroke: #20a0ff;
      transform-origin: 50% 50%;
    }
    .m-loading-wipe .m-loading-icon-active-path{
      stroke-dasharray: 90, 150;
      stroke-dashoffset: 0;
      animation: loading-wipe 1.5s ease-in-out infinite, loading-rotate 2s linear infinite;
    }
    .m-loading-default .m-loading-icon-active-path{
      stroke-dasharray: 60, 150;
      animation: loading-rotate 0.8s linear infinite;
    }

@keyframes loading-rotate{
      to{transform:rotate(1turn)}
    }
    @keyframes loading-wipe{
      0%{
        stroke-dasharray:1,200;
        stroke-dashoffset:0;
      }
      50%{
        stroke-dasharray:90,150;
        stroke-dashoffset:-40px;
      }
      to{
        stroke-dasharray:90,150;
        stroke-dashoffset:-120px;
      }
    }
  </style>`,
  html: '<circle cx="25" cy="25" r="20" class="m-loading-icon-bg-path"></circle><circle cx="25" cy="25" r="20" class="m-loading-icon-active-path"></circle>'
}

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/icon/svgs/success.js 0 → 100644
export default { name: 'success', fill: '#17B77E', viewBox: '0 0 1024 1024', path: 'M512,72C269,72,72,269,72,512s197,440,440,440s440-197,440-440S755,72,512,72L512,72z M758.9,374 c-48.5,48.6-81.2,76.9-172.3,186.8c-52.6,63.4-102.3,131.5-102.7,132L462.1,720c-4.6,6.1-13.5,6.8-19.1,1.6L267.9,558.9 c-17.8-16.5-18.8-44.4-2.3-62.2s44.4-18.8,62.2-2.3l104.9,97.5c5.5,5.1,14.1,4.5,18.9-1.3c16.2-20.1,38.4-44.5,62.4-68.6 c90.2-90.9,145.6-139.7,175.2-161.3c36-26.2,77.3-48.6,87.3-36.2C792,343.9,782.5,350.3,758.9,374L758.9,374z' }

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/icon/svgs/success.js 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/icon/svgs/warning.js 0 → 100644
export default { name: 'warning', fill: '#FFC603', viewBox: '0 0 1024 1024', path: 'M512,952C269,952,72,755,72,512S269,72,512,72s440,197,440,440S755,952,512,952z M510,770.8 c30.4,0,55-24.6,55-55s-24.6-55-55-55s-55,24.6-55,55S479.6,770.8,510,770.8z M509.8,255.3c-39.3,0-71.2,31.9-71.2,71.2 c0,3.1,0.2,6.2,0.6,9.3L472.4,588c2.5,19.3,18.9,33.7,38.4,33.7c19.4,0,35.8-14.4,38.2-33.7l31.8-252.2c5-39.2-22.8-75-62-79.9 C515.9,255.5,512.8,255.3,509.8,255.3z' }

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/icon/svgs/warning.js 0 → 100644

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/index.js 0 → 100644
import Message from './message.js' import MessageComponent from './message.vue' import './message.less' Message.install = function (Vue, options) { if (options && options.name) { Vue.prototype[`$${options.name}`] = Message } else { Vue.prototype.$message = Message } } export const MMessage = MessageComponent export default Message

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/message-template.vue 0 → 100644
<template> <transition name="m-message-fade" mode="in-out"> <div class="m-message-wrapper" v-show="show" :style="{ width: width }" :class="wrapperClassName" > <message :class="[type && 'm-message--' + type, className]" @mouseenter.native="clearTimer" @mouseleave.native="startTimer" :content="message" :closable="showClose" :is-collapsed="isCollapsed" :collapsable="collapsable" :close-handler="close" :title="title" :supportHTML="supportHTML" > <template slot="icon"> <img v-if="iconImg" :src="iconImg" class="m-message--icon"/> <icon v-else-if="type" :name="type" class="m-message--icon"/> </template> </message> </div> </transition> </template> <script> import Message from './message.vue' import Icon from './icon' export default { components: { Icon, Message }, data () { return { show: false, type: 'info', iconImg: '', title: '', message: '', duration: 3000, showClose: false, isCollapsed: false, collapsable: true, width: '', className: '', wrapperClassName: '', supportHTML: false, onClose: null, timer: null, closed: false } }, watch: { closed (val) { if (val) { this.show = false this.$el.addEventListener('animationend', this.destroyElement) } } }, methods: { close () { this.closed = true if (typeof this.onClose === 'function') { this.onClose(this) } }, clearTimer () { clearTimeout(this.timer) }, startTimer () { if (this.duration > 0 && this.type !== 'loading') { this.timer = setTimeout(() => { if (!this.closed) { this.close() } }, this.duration) } }, destroyElement () { this.$el.removeEventListener('transitionend', this.destroyElement) this.$destroy(true) this.$el.parentNode.removeChild(this.$el) } }, mounted () { if (this.type !== 'loading') { this.startTimer() if (this.duration <= 0) { this.showClose = true } } } } </script>

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/message-template.vue 0 → 100644

<template>
<transition name="m-message-fade" mode="in-out">
  <div class="m-message-wrapper" v-show="show"
    :style="{
      width: width
    }"
    :class="wrapperClassName"
    >
    <message
      :class="[type && 'm-message--' + type, className]"
      @mouseenter.native="clearTimer"
      @mouseleave.native="startTimer"
      :content="message"
      :closable="showClose"
      :is-collapsed="isCollapsed"
      :collapsable="collapsable"
      :close-handler="close"
      :title="title"
      :supportHTML="supportHTML"
      >
      <template slot="icon">
        <img v-if="iconImg" :src="iconImg" class="m-message--icon"/>
        <icon v-else-if="type" :name="type" class="m-message--icon"/>
      </template>
    </message>
  </div>
</transition>
</template>
<script>
import Message from './message.vue'
import Icon from './icon'

export default {
  components: { Icon, Message },
  data () {
    return {
      show: false,
      type: 'info',
      iconImg: '',
      title: '',
      message: '',
      duration: 3000,
      showClose: false,
      isCollapsed: false,
      collapsable: true,
      width: '',
      className: '',
      wrapperClassName: '',
      supportHTML: false,
      onClose: null,
      timer: null,
      closed: false
    }
  },
  watch: {
    closed (val) {
      if (val) {
        this.show = false
        this.$el.addEventListener('animationend', this.destroyElement)
      }
    }
  },
  methods: {
    close () {
      this.closed = true
      if (typeof this.onClose === 'function') {
        this.onClose(this)
      }
    },
    clearTimer () {
      clearTimeout(this.timer)
    },
    startTimer () {
      if (this.duration > 0 && this.type !== 'loading') {
        this.timer = setTimeout(() => {
          if (!this.closed) {
            this.close()
          }
        }, this.duration)
      }
    },
    destroyElement () {
      this.$el.removeEventListener('transitionend', this.destroyElement)
      this.$destroy(true)
      this.$el.parentNode.removeChild(this.$el)
    }
  },
  mounted () {
    if (this.type !== 'loading') {
      this.startTimer()
      if (this.duration <= 0) {
        this.showClose = true
      }
    }
  }
}
</script>

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/message.css 0 → 100644
.m-message-container { position: fixed; z-index: 3010; pointer-events: none; display: flex; flex-direction: column; box-sizing: border-box; padding: 15px; } .m-message-container.is-top-left, .m-message-container.is-top-center, .m-message-container.is-top-right { width: 100%; top: 0; left: 0; } .m-message-container.is-top-left { align-items: flex-start; } .m-message-container.is-top-center { align-items: center; } .m-message-container.is-top-right { align-items: flex-end; } .m-message-container.is-center { width: 100%; height: 100%; left: 0; top: 0; align-items: center; justify-content: center; } .m-message-container.is-bottom-left, .m-message-container.is-bottom-center, .m-message-container.is-bottom-right { bottom: 0; left: 0; width: 100%; justify-content: flex-end; } .m-message-container.is-bottom-left { align-items: flex-start; } .m-message-container.is-bottom-center { align-items: center; } .m-message-container.is-bottom-right { align-items: flex-end; } .m-message-container.has-mask { background-color: rgba(255, 255, 255, 0.5); width: 100%; height: 100%; pointer-events: all; } .m-message-wrapper { display: inline-block; max-width: 500px; } .m-message-wrapper + .m-message-wrapper { margin-top: 15px; } .m-message-wrapper::before, .m-message-wrapper::after { content: ""; clear: both; display: table; } .m-message { display: flex; align-items: center; padding: 10px 16px; font-size: 14px; overflow: hidden; border-radius: 4px; box-sizing: border-box; box-shadow: 0 1px 8px rgba(0, 0, 0, 0.15); color: rgba(0, 0, 0, 0.65); background: rgba(255, 255, 255, 0.95); pointer-events: all; position: relative; } .m-message-icons { float: left; box-sizing: border-box; margin-right: 10px; } .m-message--title { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .m-message-content { box-sizing: border-box; overflow: auto; width: 100%; } .m-message--description { line-height: 1.6; color: #777; } .m-message--title + .m-message--description { margin-top: 5px; } .m-message--icon { width: 25px; height: 25px; vertical-align: middle; display: inline-block; border-radius: 50%; } .m-message--control { position: relative; height: 100%; align-self: flex-start; white-space: nowrap; margin-right: -5px; margin-left: 10px; } .m-message--button { border: none; outline: none; background: none; cursor: pointer; font-size: 15px; color: #646464; font-weight: 600; padding: 0; width: 20px; height: 20px; line-height: 20px; text-align: center; vertical-align: middle; } .m-message--button:hover { color: #F56C6C; } .m-message--arrow-down.is-collapsed { transform: rotate(90deg); } .m-message-fade-enter-active { animation: m-message-fade-in-down 0.3s; } .m-message-fade-leave-active { animation: m-message-fade-out 0.3s; } @keyframes m-message-fade-in-down { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0px); } } @keyframes m-message-fade-out { 0% { opacity: 1; margin-top: 0; } 100% { opacity: 0; margin-top: -45px; } }

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/message.css 0 → 100644

.m-message-container {
  position: fixed;
  z-index: 3010;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 15px;
}
.m-message-container.is-top-left,
.m-message-container.is-top-center,
.m-message-container.is-top-right {
  width: 100%;
  top: 0;
  left: 0;
}
.m-message-container.is-top-left {
  align-items: flex-start;
}
.m-message-container.is-top-center {
  align-items: center;
}
.m-message-container.is-top-right {
  align-items: flex-end;
}
.m-message-container.is-center {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  align-items: center;
  justify-content: center;
}
.m-message-container.is-bottom-left,
.m-message-container.is-bottom-center,
.m-message-container.is-bottom-right {
  bottom: 0;
  left: 0;
  width: 100%;
  justify-content: flex-end;
}
.m-message-container.is-bottom-left {
  align-items: flex-start;
}
.m-message-container.is-bottom-center {
  align-items: center;
}
.m-message-container.is-bottom-right {
  align-items: flex-end;
}
.m-message-container.has-mask {
  background-color: rgba(255, 255, 255, 0.5);
  width: 100%;
  height: 100%;
  pointer-events: all;
}
.m-message-wrapper {
  display: inline-block;
  max-width: 500px;
}
.m-message-wrapper + .m-message-wrapper {
  margin-top: 15px;
}
.m-message-wrapper::before,
.m-message-wrapper::after {
  content: "";
  clear: both;
  display: table;
}
.m-message {
  display: flex;
  align-items: center;
  padding: 10px 16px;
  font-size: 14px;
  overflow: hidden;
  border-radius: 4px;
  box-sizing: border-box;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.15);
  color: rgba(0, 0, 0, 0.65);
  background: rgba(255, 255, 255, 0.95);
  pointer-events: all;
  position: relative;
}
.m-message-icons {
  float: left;
  box-sizing: border-box;
  margin-right: 10px;
}
.m-message--title {
  font-size: 14px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.m-message-content {
  box-sizing: border-box;
  overflow: auto;
  width: 100%;
}
.m-message--description {
  line-height: 1.6;
  color: #777;
}
.m-message--title + .m-message--description {
  margin-top: 5px;
}
.m-message--icon {
  width: 25px;
  height: 25px;
  vertical-align: middle;
  display: inline-block;
  border-radius: 50%;
}
.m-message--control {
  position: relative;
  height: 100%;
  align-self: flex-start;
  white-space: nowrap;
  margin-right: -5px;
  margin-left: 10px;
}
.m-message--button {
  border: none;
  outline: none;
  background: none;
  cursor: pointer;
  font-size: 15px;
  color: #646464;
  font-weight: 600;
  padding: 0;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  vertical-align: middle;
}
.m-message--button:hover {
  color: #F56C6C;
}
.m-message--arrow-down.is-collapsed {
  transform: rotate(90deg);
}
.m-message-fade-enter-active {
  animation: m-message-fade-in-down 0.3s;
}
.m-message-fade-leave-active {
  animation: m-message-fade-out 0.3s;
}
@keyframes m-message-fade-in-down {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@keyframes m-message-fade-out {
  0% {
    opacity: 1;
    margin-top: 0;
  }
  100% {
    opacity: 0;
    margin-top: -45px;
  }
}

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/message.js 0 → 100644
import MessageTemplate from './message-template' import Vue from 'vue' const MessageConstructor = Vue.extend(MessageTemplate) const instances = [] let count = 1 const containers = {} const globalsOptions = {} const Message = function (options) { options = { ...globalsOptions, ...options } let userOnClose = options.onClose const position = options.position \|\| 'top-center' const hasMask = options.hasMask \|\| false const containerKey = position + (hasMask ? '-mask' : '') let containerEl = containers[containerKey] if (!containerEl) { containerEl = containers[containerKey] = document.createElement('div') containerEl.className = [ 'm-message-container', 'is-' + position, hasMask ? 'has-mask' : '' ].filter(function (e) { return !!e }).join(' ') document.body.appendChild(containerEl) } if (options.zIndex) { containerEl.style.zIndex = options.zIndex } const id = count++ options.onClose = function () { Message.close(id, userOnClose) } const instance = new MessageConstructor({ el: document.createElement('div'), data: options }) instance.id = id instance.containerKey = containerKey // for position of bottom-* if (position.indexOf('bottom') === 0 && containerEl.firstChild) { containerEl.insertBefore(instance.$el, containerEl.firstChild) } else { containerEl.appendChild(instance.$el) } // 挂载后再设置显示才有过渡效果 instance.show = true instances.push(instance) return instance } Message.close = function (id, userOnClose) { for (let i = 0, len = instances.length; i < len; i++) { if (id === instances[i].id) { const { containerKey, hasMask } = instances[i] // 响应options.onClose if (typeof userOnClose === 'function') { userOnClose(instances[i]) } instances[i] = null instances.splice(i, 1) // 如果开启遮罩，300ms 后移除容器（不移除白屏时间太长） if (hasMask) { setTimeout(function () { const count = instances.filter(e => e.containerKey === containerKey).length if (count === 0 && containers[containerKey]) { containers[containerKey].remove() containers[containerKey] = null } }, 300) } break } } setTimeout(function () { // 当前没有消息后，移除容器 if (instances.length === 0) { for (let type in containers) { if (containers[type]) { containers[type].remove() containers[type] = null } } } }, 3000) } Message.closeAll = function () { for (let i = instances.length - 1; i >= 0; i--) { instances[i].close() } } // global options Message.globals = { options: globalsOptions } const types = [ 'info', 'success', 'error', 'warning', 'loading' ] types.forEach(type => { Message[type] = function (options) { options = typeof options === 'string' ? { message: options } : options return Message({ ...options, type }) } }) export default Message

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/message.js 0 → 100644

import MessageTemplate from './message-template'
import Vue from 'vue'
const MessageConstructor = Vue.extend(MessageTemplate)

const instances = []
let count = 1
const containers = {}
const globalsOptions = {}

const Message = function (options) {
  options = { ...globalsOptions, ...options }
  let userOnClose = options.onClose
  const position = options.position || 'top-center'
  const hasMask = options.hasMask || false
  const containerKey = position + (hasMask ? '-mask' : '')
  let containerEl = containers[containerKey]

if (!containerEl) {
    containerEl = containers[containerKey] = document.createElement('div')
    containerEl.className = [
      'm-message-container',
      'is-' + position,
      hasMask ? 'has-mask' : ''
    ].filter(function (e) { return !!e }).join(' ')
    document.body.appendChild(containerEl)
  }

if (options.zIndex) {
    containerEl.style.zIndex = options.zIndex
  }

const id = count++
  options.onClose = function () {
    Message.close(id, userOnClose)
  }

const instance = new MessageConstructor({
    el: document.createElement('div'),
    data: options
  })

instance.id = id
  instance.containerKey = containerKey

// for position of bottom-*
  if (position.indexOf('bottom') === 0 && containerEl.firstChild) {
    containerEl.insertBefore(instance.$el, containerEl.firstChild)
  } else {
    containerEl.appendChild(instance.$el)
  }
  // 挂载后再设置显示才有过渡效果
  instance.show = true

instances.push(instance)

return instance
}

Message.close = function (id, userOnClose) {
  for (let i = 0, len = instances.length; i < len; i++) {
    if (id === instances[i].id) {
      const { containerKey, hasMask } = instances[i]
      // 响应options.onClose
      if (typeof userOnClose === 'function') {
        userOnClose(instances[i])
      }
      instances[i] = null
      instances.splice(i, 1)

// 如果开启遮罩，300ms 后移除容器（不移除白屏时间太长）
      if (hasMask) {
        setTimeout(function () {
          const count = instances.filter(e => e.containerKey === containerKey).length
          if (count === 0 && containers[containerKey]) {
            containers[containerKey].remove()
            containers[containerKey] = null
          }
        }, 300)
      }
      break
    }
  }

setTimeout(function () {
    // 当前没有消息后，移除容器
    if (instances.length === 0) {
      for (let type in containers) {
        if (containers[type]) {
          containers[type].remove()
          containers[type] = null
        }
      }
    }
  }, 3000)
}

Message.closeAll = function () {
  for (let i = instances.length - 1; i >= 0; i--) {
    instances[i].close()
  }
}

// global options
Message.globals = {
  options: globalsOptions
}

const types = [ 'info', 'success', 'error', 'warning', 'loading' ]

types.forEach(type => {
  Message[type] = function (options) {
    options = typeof options === 'string' ? { message: options } : options
    return Message({ ...options, type })
  }
})

export default Message

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/message.less 0 → 100644
.m-message-container { position: fixed; z-index: 3010; pointer-events: none; display: flex; flex-direction: column; box-sizing: border-box; padding: 15px; &.is-top-left, &.is-top-center, &.is-top-right { width: 100%; top: 0; left: 0; } &.is-top-left { align-items: flex-start; } &.is-top-center { align-items: center; } &.is-top-right { align-items: flex-end; } &.is-center { width: 100%; height: 100%; left: 0; top: 0; align-items: center; justify-content: center; } &.is-bottom-left, &.is-bottom-center, &.is-bottom-right { bottom: 0; left: 0; width: 100%; justify-content: flex-end; } &.is-bottom-left { align-items: flex-start; } &.is-bottom-center { align-items: center; } &.is-bottom-right { align-items: flex-end; } &.has-mask { background-color: rgba(255,255,255, 0.5); width: 100%; height: 100%; pointer-events: all; } } .m-message-wrapper { display: inline-block; max-width: 500px; & + & { margin-top: 15px; } &::before, &::after { content: ""; clear: both; display: table; } } .m-message { display: flex; align-items: center; padding: 10px 16px; font-size: 14px; overflow: hidden; border-radius: 4px; box-sizing: border-box; box-shadow: 0 1px 8px rgba(0,0,0,.15); color: rgba(0,0,0,.65); background: rgba(255,255,255,0.95); pointer-events: all; position: relative; &-icons { float: left; box-sizing: border-box; margin-right: 10px; } &--title { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } &-content { box-sizing: border-box; overflow: auto; width: 100%; } &--description { line-height: 1.6; color: #777; } &--title + &--description { margin-top: 5px; } &--icon { width: 25px; height: 25px; vertical-align: middle; display: inline-block; border-radius: 50%; } &--control { position: relative; height: 100%; align-self: flex-start; white-space: nowrap; margin-right: -5px; margin-left: 10px; } &--button { border: none; outline: none; background: none; cursor: pointer; font-size: 15px; color: #646464; font-weight: 600; padding: 0; width: 20px; height: 20px; line-height: 20px; text-align: center; vertical-align: middle; &:hover { color: #F56C6C; } } &--arrow-down { &.is-collapsed { transform: rotate(90deg); } } } .m-message-fade-enter-active { animation: m-message-fade-in-down 0.3s; } .m-message-fade-leave-active { animation: m-message-fade-out 0.3s; } @keyframes m-message-fade-in-down { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0px); } } @keyframes m-message-fade-out { 0% { opacity: 1; margin-top: 0; } 100% { opacity: 0; margin-top: -45px; } }

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/message.less 0 → 100644

.m-message-container {
  position: fixed;
  z-index: 3010;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 15px;

&.is-top-left,
  &.is-top-center,
  &.is-top-right {
    width: 100%;
    top: 0;
    left: 0;
  }
  &.is-top-left {
    align-items: flex-start;
  }
  &.is-top-center {
    align-items: center;
  }
  &.is-top-right {
    align-items: flex-end;
  }
  &.is-center {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    align-items: center;
    justify-content: center;
  }
  &.is-bottom-left,
  &.is-bottom-center,
  &.is-bottom-right {
    bottom: 0;
    left: 0;
    width: 100%;
    justify-content: flex-end;
  }
  &.is-bottom-left {
    align-items: flex-start;
  }
  &.is-bottom-center {
    align-items: center;
  }
  &.is-bottom-right {
    align-items: flex-end;
  }
  &.has-mask {
    background-color: rgba(255,255,255, 0.5);
    width: 100%;
    height: 100%;
    pointer-events: all;
  }
}

.m-message-wrapper {
  display: inline-block;
  max-width: 500px;

& + & {
    margin-top: 15px;
  }

&::before,
  &::after {
    content: "";
    clear: both;
    display: table;
  }
}
.m-message {
  display: flex;
  align-items: center;
  padding: 10px 16px;
  font-size: 14px;
  overflow: hidden;
  border-radius: 4px;
  box-sizing: border-box;
  box-shadow: 0 1px 8px rgba(0,0,0,.15);
  color: rgba(0,0,0,.65);
  background: rgba(255,255,255,0.95);
  pointer-events: all;
  position: relative;

&-icons {
    float: left;
    box-sizing: border-box;
    margin-right: 10px;
  }
  &--title {
    font-size: 14px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  &-content {
    box-sizing: border-box;
    overflow: auto;
    width: 100%;
  }
  &--description {
    line-height: 1.6;
    color: #777;
  }
  &--title + &--description {
    margin-top: 5px;
  }

&--icon {
    width: 25px;
    height: 25px;
    vertical-align: middle;
    display: inline-block;
    border-radius: 50%;
  }
  &--control {
    position: relative;
    height: 100%;
    align-self: flex-start;
    white-space: nowrap;
    margin-right: -5px;
    margin-left: 10px;
  }
  &--button {
    border: none;
    outline: none;
    background: none;
    cursor: pointer;
    font-size: 15px;
    color: #646464;
    font-weight: 600;
    padding: 0;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    vertical-align: middle;

&:hover {
      color: #F56C6C;
    }
  }
  &--arrow-down {
    &.is-collapsed {
      transform: rotate(90deg);
    }
  }
}

.m-message-fade-enter-active {
  animation: m-message-fade-in-down 0.3s;
}
.m-message-fade-leave-active {
  animation: m-message-fade-out 0.3s;
}

@keyframes m-message-fade-in-down {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}

@keyframes m-message-fade-out {
  0% {
    opacity: 1;
    margin-top: 0;
  }
  100% {
    opacity: 0;
    margin-top: -45px;
  }
}

Ignore Space Show notes View project/hivuiSam/components/vue-m-message/message.vue 0 → 100644
<template> <div class="m-message" v-show="visible"> <div class="m-message-icons" v-if="iconImg \|\| $slots.icon"> <img :src="iconImg" v-if="iconImg" class="m-message--icon"/> <slot name="icon" v-else></slot> </div> <div class="m-message-content"> <div class="m-message--title" v-if="title \|\| $slots.title"><slot name="title">{{ title }}</slot></div> <template v-if="supportHTML"> <div class="m-message--description" v-if="!collapsed" v-html="content"><slot></slot></div> </template> <template v-else> <div class="m-message--description" v-if="!collapsed"><slot>{{ content }}</slot></div> </template> </div> <div class="m-message--control"> <slot name="button"></slot> <button class="m-message--button m-message--arrow-down" v-if="collapsable && (title \|\| $slots.title)" :class="{ 'is-collapsed': collapsed }" @click="triggerCollapse"> <svg viewBox="0 0 35 35" width="20" height="20" version="1.1" fill="currentColor"> <path class="st0" d="M9.4,13.9c-0.2,0.2-0.2,0.6,0,0.8l8.1,8.1l0,0l0,0l8.1-8.1c0.2-0.2,0.2-0.6,0-0.8l-1.3-1.3 c-0.2-0.2-0.6-0.2-0.8,0l-5.5,5.5c-0.2,0.2-0.6,0.2-0.8,0l-5.5-5.5c-0.2-0.2-0.6-0.2-0.8,0L9.4,13.9z"/> </svg> </button> <button class="m-message--button m-message--close" v-if="closable" @click="handleClose"> <svg viewBox="0 0 35 35" width="20" height="20" version="1.1" fill="currentColor"> <path d="M19.5,17.5l5.1,5.1l-2,2l-5.1-5.1l-5.1,5.1l-2-2l5.1-5.1l-5.1-5.1l2-2l5.1,5.1l5.1-5.1l2,2L19.5,17.5z"></path> </svg> </button> </div> </div> </template> <script> export default { name: 'm-message', props: { iconImg: String, closable: Boolean, closeHandler: Function, title: String, content: String, supportHTML: Boolean, // content support html isCollapsed: { type: Boolean, default: true }, collapsable: { type: Boolean, default: true } }, data () { return { visible: true, collapsed: this.isCollapsed } }, methods: { triggerCollapse () { this.collapsed = !this.collapsed }, close () { this.visible = false }, handleClose () { if (typeof this.closeHandler === 'function') this.closeHandler(this.close) else this.close() } } } </script>

Ignore Space Show notes View

project/hivuiSam/components/vue-m-message/message.vue 0 → 100644

<template>
  <div class="m-message" v-show="visible">
    <div class="m-message-icons" v-if="iconImg || $slots.icon">
      <img :src="iconImg" v-if="iconImg" class="m-message--icon"/>
      <slot name="icon" v-else></slot>
    </div>
    <div class="m-message-content">
      <div class="m-message--title" v-if="title || $slots.title"><slot name="title">{{ title }}</slot></div>
      <template v-if="supportHTML">
        <div class="m-message--description" v-if="!collapsed" v-html="content"><slot></slot></div>
      </template>
      <template v-else>
        <div class="m-message--description" v-if="!collapsed"><slot>{{ content }}</slot></div>
      </template>
    </div>
    <div class="m-message--control">
      <slot name="button"></slot>
      <button class="m-message--button m-message--arrow-down"
        v-if="collapsable && (title || $slots.title)"
        :class="{
          'is-collapsed': collapsed
        }"
        @click="triggerCollapse">
        <svg viewBox="0 0 35 35" width="20" height="20" version="1.1" fill="currentColor">
          <path class="st0" d="M9.4,13.9c-0.2,0.2-0.2,0.6,0,0.8l8.1,8.1l0,0l0,0l8.1-8.1c0.2-0.2,0.2-0.6,0-0.8l-1.3-1.3 c-0.2-0.2-0.6-0.2-0.8,0l-5.5,5.5c-0.2,0.2-0.6,0.2-0.8,0l-5.5-5.5c-0.2-0.2-0.6-0.2-0.8,0L9.4,13.9z"/>
        </svg>
      </button>
      <button class="m-message--button m-message--close"
        v-if="closable"
        @click="handleClose">
        <svg viewBox="0 0 35 35" width="20" height="20" version="1.1" fill="currentColor">
          <path d="M19.5,17.5l5.1,5.1l-2,2l-5.1-5.1l-5.1,5.1l-2-2l5.1-5.1l-5.1-5.1l2-2l5.1,5.1l5.1-5.1l2,2L19.5,17.5z"></path>
        </svg>
      </button>
    </div>
  </div>
</template>

Ignore Space Show notes View project/hivuiSam/config/index.js 0 → 100644
const SETTING = window.HIVUI_SETTING\|\|{} const SERVER = import.meta.env.VITE_APP_SERVER \|\| process.env.VITE_APP_SERVER; export const projectName = SETTING.projectName//'eaptpl'//window.__sysConfig.projectName//hcm //业务项目名 export const codeProjectName = window.server\|\|"/birt"//'hirun'//'amrept-web'; // code项目名 export const baseURL = import.meta.env.VITE_APP_BASE_API\|\|process.env.VITE_APP_BASE_API; // api的base_url export const requestUrl = SERVER + SETTING.serverUrl?SETTING.serverUrl:(codeProjectName+baseURL) // export const requestUrl = baseURL + 'e5'

Ignore Space Show notes View

project/hivuiSam/config/index.js 0 → 100644

Ignore Space Show notes View project/hivuiSam/funclib/AxiosUtil.js 0 → 100644
/** * 请求工具类,临时方案，待完善 * @author cls * @date 2021-01-30 / import { baseURL, projectName, requestUrl } from '@birt/config' import Message from '../components/vue-m-message/index.js' import axios from 'axios'; import { getToken } from '@birt/utils/auth' var pn = projectName \|\| 'birt' //请求状态码属性 const STATUS_KEY = "status"; //请求成功状态码 const STATUS_SUCCESS = 200; //超时 const STATUS_TIMEOUT = 418; // 检测登录超时 function checkTimeout(res) { if (res[STATUS_KEY] == STATUS_TIMEOUT) { // to re-login MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', { confirmButtonText: 'Re-Login', cancelButtonText: 'Cancel', type: 'warning' }).then(() => { console.log("这里处理超时登录"); }) return true; } return false } debugger axios.baseURL = baseURL axios.interceptors.request.use( config => { // "3d3fe30c-3d99-41e8-9aea-addd8528aa07" // config.headers["Authorization"] = "bearer " + "b9e6a365-c551-4551-b258-c56e3acd0eed"; if (getToken()) { config.headers["Authorization"] = "bearer " + getToken(); } // else { // //没有token，跳转登录页 // if (window.HIVUI_SETTING.loginUrl) { // location = window.HIVUI_SETTING.loginUrl; // } else { // location = "/" + projectName + "/hivuiLogin/index.html#/"; // } // } if (!config.url.startsWith("/api") && config.url.indexOf(requestUrl) == -1) { config.url = requestUrl + config.url; } if (config.url.indexOf(pn) == -1) { if (config.url.indexOf('pn=birt') != -1) { var url = config.url.replace('birt', pn) console.log('url', url) config.url = url } else if (config.url.indexOf('pn=false') != -1) { var url = config.url.replace('false', pn) console.log('url', url) config.url = url } else { if (config.url.indexOf('?') == -1) { config.url += "?pn=" + pn; } else { config.url += "&?pn=" + pn } } } return config }, error => { console.log(error) return Promise.reject(error) } ) axios.interceptors.response.use(function (response) { // 因返回mock数据包格式不统一，做兼容处理，枚举接口未返回status:200 var res = (response[STATUS_KEY] && response.dataPack) ? response : response.data; res = (res \|\| response.dataPack) \|\| response; let status = res[STATUS_KEY]; // 流程特殊添加options,流程批处理返回 let flowData = response.config && response.config.data; if (flowData && (typeof flowData == "string" && flowData.indexOf("__isIntercept") != -1) && JSON.parse(flowData).__isIntercept === false) { try { res.options = JSON.parse(response.config.data) } catch (e) { } } if (status != STATUS_SUCCESS && status != 207) { if (!checkTimeout(res)) { let msgType = "error"; if (res == 700) { msgType = "info"; } Message({ message: res.msg \|\| 'error', type: msgType, duration: 5 1000 }) } return Promise.reject(res.msg \|\| 'error') } else if (res[STATUS_KEY] == 401) { // Message({ // message: 'token失效', // type: 'error', // duration: 5 * 1000 // }) MessageBox.alert('你已被登出,请重新登录', '登录超时', { confirmButtonText: '重新登录', type: 'warning' }).then(() => { let loginUrl = window.HIVUI_SETTING.loginUrl if (window.HIVUI_SETTING.isSingleLogin) { loginUrl = window.HIVUI_SETTING.singleLoginUrl; } if (loginUrl.endsWith("=")) { let params = window.location.search.slice(1, -1).split("&").filter(item => { if (item.indexOf("ticket") == -1) { return item } }); loginUrl = loginUrl + window.location.origin + window.location.pathname + (params.length > 0 ? '?' : '') + params.join("&"); } window.location.href = loginUrl }) } else { return res } }, function (error) { const res = error.response.data; if (res[STATUS_KEY] == 401) { if(top&&top.window.SysPage&&top.window.SysPage.openMiniLogin){//小窗口 top.window.SysPage.openMiniLogin(); }else{ Message({ message: 'token失效', type: 'error', duration: 5 * 1000 }) } } else { if (!checkTimeout(res)) { Message({ showClose: true, message: res.msg \|\| '未知错误', type: 'error', duration: 5 * 1000 }) return Promise.reject(error) } } }); export default axios;

Ignore Space Show notes View

project/hivuiSam/funclib/AxiosUtil.js 0 → 100644

/**
 * 请求工具类,临时方案，待完善
 * @author cls
 * @date 2021-01-30
 */
import {
  baseURL,
  projectName,
  requestUrl
} from '@birt/config'
import Message from '../components/vue-m-message/index.js'
import axios from 'axios';
import {
  getToken
} from '@birt/utils/auth'
var pn = projectName || 'birt'
//请求状态码属性
const STATUS_KEY = "status";
//请求成功状态码
const STATUS_SUCCESS = 200;
//超时
const STATUS_TIMEOUT = 418;
// 检测登录超时
function checkTimeout(res) {
  if (res[STATUS_KEY] == STATUS_TIMEOUT) {
    // to re-login
    MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
      confirmButtonText: 'Re-Login',
      cancelButtonText: 'Cancel',
      type: 'warning'
    }).then(() => {
      console.log("这里处理超时登录");
    })
    return true;
  }
  return false
}
debugger
axios.baseURL = baseURL
axios.interceptors.request.use(
  config => {
    // "3d3fe30c-3d99-41e8-9aea-addd8528aa07"
    // config.headers["Authorization"] = "bearer " + "b9e6a365-c551-4551-b258-c56e3acd0eed";

if (getToken()) {
      config.headers["Authorization"] = "bearer " + getToken();
    } 
    // else {
    //   //没有token，跳转登录页
    //   if (window.HIVUI_SETTING.loginUrl) {
    //     location = window.HIVUI_SETTING.loginUrl;
    //   } else {
    //     location = "/" + projectName + "/hivuiLogin/index.html#/";
    //   }
    // }
    if (!config.url.startsWith("/api") && config.url.indexOf(requestUrl) == -1) {
      config.url = requestUrl + config.url;
    }
    if (config.url.indexOf(pn) == -1) {
      if (config.url.indexOf('pn=birt') != -1) {
        var url = config.url.replace('birt', pn)
        console.log('url', url)
        config.url = url
      } else if (config.url.indexOf('pn=false') != -1) {
        var url = config.url.replace('false', pn)
        console.log('url', url)
        config.url = url
      } else {
        if (config.url.indexOf('?') == -1) {
          config.url += "?pn=" + pn;
        } else {
          config.url += "&?pn=" + pn
        }
      }
    }
    return config
  },
  error => {
    console.log(error)
    return Promise.reject(error)
  }
)

axios.interceptors.response.use(function (response) {
  // 因返回mock数据包格式不统一，做兼容处理，枚举接口未返回status:200
  var res = (response[STATUS_KEY] && response.dataPack) ? response : response.data;
  res = (res || response.dataPack) || response;
  let status = res[STATUS_KEY];

// 流程特殊添加options,流程批处理返回
  let flowData = response.config && response.config.data;
  if (flowData && (typeof flowData == "string" && flowData.indexOf("__isIntercept") != -1) && JSON.parse(flowData).__isIntercept === false) {
    try {
      res.options = JSON.parse(response.config.data)
    } catch (e) {

}
  }

if (status != STATUS_SUCCESS && status != 207) {
    if (!checkTimeout(res)) {
      let msgType = "error";
      if (res == 700) {
        msgType = "info";
      }
      Message({
        message: res.msg || 'error',
        type: msgType,
        duration: 5 * 1000
      })
    }
    return Promise.reject(res.msg || 'error')
  } else if (res[STATUS_KEY] == 401) {
    // Message({
    //   message: 'token失效',
    //   type: 'error',
    //   duration: 5 * 1000
    // })
    MessageBox.alert('你已被登出,请重新登录', '登录超时', {
      confirmButtonText: '重新登录',
      type: 'warning'
    }).then(() => {
      let loginUrl = window.HIVUI_SETTING.loginUrl
      if (window.HIVUI_SETTING.isSingleLogin) {
        loginUrl = window.HIVUI_SETTING.singleLoginUrl;
      }
      if (loginUrl.endsWith("=")) {
        let params = window.location.search.slice(1, -1).split("&").filter(item => {
          if (item.indexOf("ticket") == -1) {
            return item
          }
        });
        loginUrl = loginUrl + window.location.origin + window.location.pathname + (params.length > 0 ? '?' : '') + params.join("&");
      }
      window.location.href = loginUrl
    })
  } else {
    return res
  }
}, function (error) {
  const res = error.response.data;
  if (res[STATUS_KEY] == 401) {
      if(top&&top.window.SysPage&&top.window.SysPage.openMiniLogin){//小窗口
          top.window.SysPage.openMiniLogin();
      }else{
          Message({
              message: 'token失效',
              type: 'error',
              duration: 5 * 1000
          })
      }
  } else {
    if (!checkTimeout(res)) {
      Message({
        showClose: true,
        message: res.msg || '未知错误',
        type: 'error',
        duration: 5 * 1000
      })
      return Promise.reject(error)
    }
  }
});

export default axios;

Ignore Space Show notes View project/hivuiSam/funclib/LoadUtil.js 0 → 100644
/** * 原生动态加载后台资源js,json工具类 * @author cls * @date 2021-01-30 * import { LoadUtil } from "@birt/funclib/LoadUtil"; */ export const LoadUtil = { loadJs(url) { return new Promise((resolve, reject) => { let srcArr = document.getElementsByTagName("script"); let hasLoaded = false; for (let i = 0; i < srcArr.length; i++) { //判断当前js是否加载上 hasLoaded = (srcArr[i].src == url) ? true : false; } if (hasLoaded) { resolve(); return; } let script = document.createElement('script') script.type = 'text/javascript'; script.src = url; document.body.appendChild(script); script.onload = () => { resolve(); } script.onerror = () => { reject(); } }) }, loadCss(url) { let linkArr = document.getElementsByTagName("link"); let hasLoaded = false; for (let i = 0; i < linkArr.length; i++) { //判断当前css是否加载上 hasLoaded = (linkArr[i].href == url) ? true : false; } if (hasLoaded) { return; } let link = document.createElement('link') console.log('link==>', link) link.rel = 'stylesheet'; link.href = url; document.body.appendChild(link); }, // 动态加载报表模型(js) loadJsBirtModel({ loadModelUrl, routePath, token,pn,vId }) { return new Promise((resolve, reject) => { let url = this._getBirtModelUrl(loadModelUrl, routePath, token,pn,vId); this.loadJs(url).then((response) => { resolve(); }).catch(() => { reject(); }) }) }, // 获取加载报表模型地址 _getBirtModelUrl(loadModelUrl, routePath, token,pn,vId) { // let pi = routePath.lastIndexOf("."); // if (pi != -1) { // routePath = routePath.substring(0, pi); // } if(routePath && routePath.endsWith('.flow')){ routePath = routePath.replace('.flow', '.js') } if(routePath && routePath.endsWith('.js')){ routePath = `/deploy${routePath}` } let url = `${loadModelUrl}?bizpath=${routePath}&access_token=${token}&pn=${pn}`; if(vId){ url += `&viewItemId=${vId}` } return url; } };

Ignore Space Show notes View

project/hivuiSam/funclib/LoadUtil.js 0 → 100644

/**
 * 原生 动态加载后台资源js,json工具类
 * @author cls
 * @date 2021-01-30
 * import { LoadUtil } from "@birt/funclib/LoadUtil";
 */

export const LoadUtil = {
  loadJs(url) {
    return new Promise((resolve, reject) => {
      let srcArr = document.getElementsByTagName("script");
      let hasLoaded = false;
      for (let i = 0; i < srcArr.length; i++) {
        //判断当前js是否加载上
        hasLoaded = (srcArr[i].src == url) ? true : false;
      }
      if (hasLoaded) {
        resolve();
        return;
      }
      let script = document.createElement('script')
      script.type = 'text/javascript';
      script.src = url;
      document.body.appendChild(script);
      script.onload = () => {
        resolve();
      }
      script.onerror = () => {
        reject();
      }
    })
  },
  loadCss(url) {
    let linkArr = document.getElementsByTagName("link");
    let hasLoaded = false;
    for (let i = 0; i < linkArr.length; i++) {
      //判断当前css是否加载上
      hasLoaded = (linkArr[i].href == url) ? true : false;
    }
    if (hasLoaded) {
      return;
    }
    let link = document.createElement('link')
    console.log('link==>', link)
    link.rel = 'stylesheet';
    link.href = url;
    document.body.appendChild(link);
  },
  // 动态加载报表模型(js)
  loadJsBirtModel({ loadModelUrl, routePath, token,pn,vId }) {
    return new Promise((resolve, reject) => {
      let url = this._getBirtModelUrl(loadModelUrl, routePath, token,pn,vId);
      this.loadJs(url).then((response) => {
        resolve();
      }).catch(() => {
        reject();
      })
    })
  },
  // 获取加载报表模型地址
  _getBirtModelUrl(loadModelUrl, routePath, token,pn,vId) {
    // let pi = routePath.lastIndexOf(".");
    // if (pi != -1) {
    //   routePath = routePath.substring(0, pi);
    // }
    if(routePath && routePath.endsWith('.flow')){
      routePath = routePath.replace('.flow', '.js')
    }
    if(routePath && routePath.endsWith('.js')){
      routePath = `/deploy${routePath}`
    }
    let url = `${loadModelUrl}?bizpath=${routePath}&access_token=${token}&pn=${pn}`;
    if(vId){
      url += `&viewItemId=${vId}`
    }
    return url;
  }
};

Ignore Space Show notes View project/hivuiSam/hiSetting.js 0 → 100644
var root = "http://192.168.4.106:7777" var server = ""; var oauth = ""; var projectName = "${projectName}" var pName = projectName.split("/")[0]; var user = projectName.split("/")[1]; let appSettion = { projectName: projectName, url: eap.request, //默认服务url serverUrl: root + server, //授权服务url oauth: root + oauth, //数据保存url saveUrl: root + server + "/data/save", //'/data/save', //数据查询url queryUrl: root + server + "/data/query", //'/data/query', querysUrl: root + server + "/data/querys", //'/data/query', //数据策略url policyUrl: root + server + "/data/policy", //附件上传url upload: root + server + "/file/upload", //附件下载url download: root + server + "/file/download", //附件查看url preview: root + server + "/file/preview", //流程信息url getFlowInfo: root + server + "/flow/open", getApprovalInfo: root + server + "/flow/getApprovalInfo", processFlow: root + server + "/flow/processFlow", queryTask: root + server + "/flow/queryTask", withdrawtask: root + server + "/flow/withdrawtask", taskDiagram: root + server + "/flow/taskDiagram", openOrdernumber: root + server + "/flow/openOrdernumber", enumsUrl: root + server + "/platf/xtgn/enums/fgroupid/", policyUrl: root + server + "/data/policy", birtModel: root + server + "/birt/model1", getProcessInfo: root + server + '/flow/getProcessInfo', } if (window.dynamicSetting) { appSettion = Object.assign(appSettion, window.dynamicSetting) } let notUrlKey = ["projectName"] for (let prop in appSettion) { if (notUrlKey.indexOf(prop) && appSettion[prop] && typeof (appSettion[prop]) == 'string' && !appSettion[prop].toLowerCase().startsWith("http")) appSettion[prop] = appSettion.url + appSettion[prop]; } export default appSettion;

Ignore Space Show notes View

project/hivuiSam/hiSetting.js 0 → 100644

export default appSettion;

Ignore Space Show notes View project/hivuiSam/index.html 0 → 100644
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>EAP5-Admin-Main</title> <% if(htmlWebpackPlugin.vite){%> <!--预览时公共库--> <link rel="stylesheet" href="/assets_platform/element-ui/index.css"> <script src="/assets_platform/vue/vue.min.js"></script> <script src="/assets_platform/vuex/vuex.min.js"></script> <script src="/assets_platform/vue-router/vue-router.min.js"></script> <script src="/assets_platform/element-ui/index.js"></script> <script src="/assets_platform/eap/eap.umd.min.js"></script> <%}%> <% if(!htmlWebpackPlugin.vite){%> <link rel="stylesheet" href="${serverPath}/render/assets_platform/element-ui/index.css"> <script src="${serverPath}/render/assets_platform/vue/vue.min.js"></script> <script src="${serverPath}/render/assets_platform/vuex/vuex.min.js"></script> <script src="${serverPath}/render/assets_platform/vue-router/vue-router.min.js"></script> <script src="${serverPath}/render/assets_platform/element-ui/index.js"></script> <!--发布时公共库--> <!-- <script src="${serverPath}/render/assets_platform/vendor_dll/vuelibs.dll.js"></script> --> <script src="${serverPath}/render/assets_platform/vendor_dll/vendor.dll.js"></script> <script src="${serverPath}/render/assets_platform/eap/eap.umd.min.js"></script> <%}%> <!-- <script src="/eaptpl/setting/desktop/appsetting/js/1.0.0/appsetting.js" type="text/javascript"></script> --> </head> <body> <div id="app"> <!-- <div style="padding:50px 0;text-align:center;"> <div> <img id="main_loading_logo" src="" /> </div> <div>系统初始化中...<a href="javascript:location.reload();">【点我刷新】</a></div> </div> --> </div> <script> //window.onload=()=>{ // let _img=window.customSysCofig&&window.customSysCofig.sysLoadLogo&&window.customSysCofig.sysLoadLogo.src; // document.getElementById("main_loading_logo").src=(_img\|\|(window._global?"./assets/logo_max.png":"./static/img/logo_max.png")); // if(window.customSysCofig?.syTitle){ // document.title=window.customSysCofig.syTitle; // } //} </script> <% if(htmlWebpackPlugin.vite==true){%> <script type="module" src="/<%=htmlWebpackPlugin.project%>/hivuiBirt/index.js"></script> <%}%> <!-- built files will be auto injected --> </body> </html>

Ignore Space Show notes View

project/hivuiSam/index.html 0 → 100644

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <title>EAP5-Admin-Main</title>
  
  <% if(htmlWebpackPlugin.vite){%>
    
    <link rel="stylesheet" href="/assets_platform/element-ui/index.css">
    <script src="/assets_platform/vue/vue.min.js"></script>
    <script src="/assets_platform/vuex/vuex.min.js"></script>
    <script src="/assets_platform/vue-router/vue-router.min.js"></script>
    <script src="/assets_platform/element-ui/index.js"></script>
    <script src="/assets_platform/eap/eap.umd.min.js"></script>
    
    <%}%>
    <% if(!htmlWebpackPlugin.vite){%>
      <link rel="stylesheet" href="${serverPath}/render/assets_platform/element-ui/index.css">
      <script src="${serverPath}/render/assets_platform/vue/vue.min.js"></script>
      <script src="${serverPath}/render/assets_platform/vuex/vuex.min.js"></script>
      <script src="${serverPath}/render/assets_platform/vue-router/vue-router.min.js"></script>
      <script src="${serverPath}/render/assets_platform/element-ui/index.js"></script>
      
      
      <script src="${serverPath}/render/assets_platform/vendor_dll/vendor.dll.js"></script>
      <script src="${serverPath}/render/assets_platform/eap/eap.umd.min.js"></script>
      <%}%>
      
</head>

<body>
  <div id="app">  	
    
  </div>
  <script>
    //window.onload=()=>{
      // let _img=window.customSysCofig&&window.customSysCofig.sysLoadLogo&&window.customSysCofig.sysLoadLogo.src;
      // document.getElementById("main_loading_logo").src=(_img||(window._global?"./assets/logo_max.png":"./static/img/logo_max.png"));
      // if(window.customSysCofig?.syTitle){
      //   document.title=window.customSysCofig.syTitle;
      // }
    //}
  </script>
  <% if(htmlWebpackPlugin.vite==true){%>
    <script type="module" src="/<%=htmlWebpackPlugin.project%>/hivuiBirt/index.js"></script>
  <%}%>
  
</body>

</html>

Ignore Space Show notes View project/hivuiSam/index.js 0 → 100644
import App from './App.vue' // import ElementUI from 'element-ui'; // import "hi-ui/lib/hi-ui.css"; // import 'font-awesome/css/font-awesome.css' Vue.use(ELEMENT, { size: 'mini' }) import Message from './components/vue-m-message' Vue.use(Message) // will mount `Vue.prototype.$message` import HIUI from "hi-ui"; import "hi-ui/lib/hi-ui.css"; import ZhcBirtCmps from 'zhc-birt-cmps' Vue.use(HIUI) Vue.use(ZhcBirtCmps) import Cookies from 'js-cookie' import { setToken, } from "./utils/auth.js"; // Vue.use(ElementUI) console.log('token', Cookies.get('EAP-Token')) setToken(Cookies.get('EAP-Token') \|\| '') import axios from "./funclib/AxiosUtil"; Vue.prototype.$HI = { projectName: window.HIVUI_SETTING.projectName, serverUrl: window.HIVUI_SETTING.serverUrl, serverName: window.HIVUI_SETTING.serverName, request: axios, queryOperate: 'like', pageSize: 20, saveUrl: window.HIVUI_SETTING.saveUrl, queryUrl: window.HIVUI_SETTING.queryUrl, querysUrl: window.HIVUI_SETTING.serverUrl + "/data/querys", policyUrl: window.HIVUI_SETTING.policyUrl, enumsUrl: window.HIVUI_SETTING.serverUrl + "/platf/xtgn/enums/fgroupid/", upload: window.HIVUI_SETTING.upload, download: window.HIVUI_SETTING.download, preview: window.HIVUI_SETTING.preview \|\| window.HIVUI_SETTING.review, getFlowInfo: window.HIVUI_SETTING.getFlowInfo, getApprovalInfo: window.HIVUI_SETTING.getApprovalInfo, processFlow: window.HIVUI_SETTING.processFlow, queryTask: window.HIVUI_SETTING.queryTask, withdrawtask: window.HIVUI_SETTING.withdrawtask, taskDiagram: window.HIVUI_SETTING.taskDiagram, openOrdernumber: window.HIVUI_SETTING.openOrdernumber, birtModel: window.HIVUI_SETTING.serverUrl + "/birt/model1", getProcessInfo: window.HIVUI_SETTING.serverUrl + '/flow/getProcessInfo', exportUrl: window.HIVUI_SETTING.serverUrl + "/export/dataexcel" }; new Vue({ i18n, render: h => h(App), }).$mount('#app')

Ignore Space Show notes View

project/hivuiSam/index.js 0 → 100644

import App from './App.vue'

// import ElementUI from 'element-ui';
// import "hi-ui/lib/hi-ui.css";
// import 'font-awesome/css/font-awesome.css'
Vue.use(ELEMENT, {
  size: 'mini'
})
import Message from './components/vue-m-message'
Vue.use(Message) // will mount `Vue.prototype.$message`
import HIUI from "hi-ui";
import "hi-ui/lib/hi-ui.css";

import ZhcBirtCmps from 'zhc-birt-cmps'
Vue.use(HIUI)
Vue.use(ZhcBirtCmps)
import Cookies from 'js-cookie'
import {
  setToken,
} from "./utils/auth.js";
// Vue.use(ElementUI)
console.log('token', Cookies.get('EAP-Token'))
setToken(Cookies.get('EAP-Token') || '')

import axios from "./funclib/AxiosUtil";

Vue.prototype.$HI = {
  projectName: window.HIVUI_SETTING.projectName,
  serverUrl: window.HIVUI_SETTING.serverUrl,
  serverName: window.HIVUI_SETTING.serverName,
  request: axios,
  queryOperate: 'like',
  pageSize: 20,
  saveUrl: window.HIVUI_SETTING.saveUrl,
  queryUrl: window.HIVUI_SETTING.queryUrl,
  querysUrl: window.HIVUI_SETTING.serverUrl + "/data/querys",
  policyUrl: window.HIVUI_SETTING.policyUrl,
  enumsUrl: window.HIVUI_SETTING.serverUrl + "/platf/xtgn/enums/fgroupid/",
  upload: window.HIVUI_SETTING.upload,
  download: window.HIVUI_SETTING.download,
  preview: window.HIVUI_SETTING.preview || window.HIVUI_SETTING.review,
  getFlowInfo: window.HIVUI_SETTING.getFlowInfo,
  getApprovalInfo: window.HIVUI_SETTING.getApprovalInfo,
  processFlow: window.HIVUI_SETTING.processFlow,
  queryTask: window.HIVUI_SETTING.queryTask,
  withdrawtask: window.HIVUI_SETTING.withdrawtask,
  taskDiagram: window.HIVUI_SETTING.taskDiagram,
  openOrdernumber: window.HIVUI_SETTING.openOrdernumber,
  birtModel: window.HIVUI_SETTING.serverUrl + "/birt/model1",
  getProcessInfo: window.HIVUI_SETTING.serverUrl + '/flow/getProcessInfo',
  exportUrl: window.HIVUI_SETTING.serverUrl + "/export/dataexcel"
};

new Vue({
  i18n,
  render: h => h(App),
}).$mount('#app')

Ignore Space Show notes View project/hivuiSam/package.json 0 → 100644
{ "name": "design", "version": "1.0.0", "private": true, "scripts": {}, "dependencies": { }, "devDependencies": {} }

Ignore Space Show notes View project/hivuiSam/styles/index.css 0 → 100644
.custom-tree-node { flex: 1; display: flex; align-items: center; justify-content: space-between; font-size: 14px; padding-right: 8px; width: 80%; flex: 1 140px; } .custom-tree-node > span:nth-child(1){ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .custom-tree-node .btn{ opacity: 0; transition: opacity 0.5s; -webkit-transition: opacity 0.5s; } .custom-tree-node:hover .btn{ opacity: 1; } .custom-tree-node .btn .el-icon-edit{ color: #67c23a; } .custom-tree-node .btn .el-icon-delete{ color: #f56c6c; } .cell .el-input-group__append{ padding: 0 5px !important; text-align: center; } .cell .el-input-group__append .el-button{ padding: 0; margin: 0; } /* .el-form-item__error{ line-height: 0; } / .el-row>.zhc-birt-cell-children>.el-button { border: none; / border-right: 1px solid #ddd; / border-radius: 0; padding: 5px 15px; } / 整个滚动条 / ::-webkit-scrollbar { width: 8px; height: 10px; } / 滚动条上的滚动滑块 / ::-webkit-scrollbar-thumb { / background-color: #49b1f5; / / 关键代码 / / background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent); / background-color: rgba(0,0,0,.3); border-radius: 32px; } / 滚动条轨道 / ::-webkit-scrollbar-track { background-color: #dbeffd; border-radius: 32px; } .custom-tree-node .el-icon-folder-opened,.el-icon-folder{ color: #ffc107; } .custom-tree-node .el-icon-document{ color: #009688; } .custom-tree-node .icon-root{ color: blue; } .custom-tree-node .icon-ptm{ color: royalblue; } .custom-tree-node .el-icon-user{ color: coral;; } .custom-tree-node .icon-org, .icon-func{ color: aqua; } .custom-tree-node .icon-dpt, .icon-flow{ color: deepskyblue; } .custom-tree-node .el-button.is-disabled i{ color: #C0C4CC !important; cursor: not-allowed; } .el-table__header-wrapper th.isrequired ::before{ content: ''; color: red; margin-right: 5px; } .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content { background-color: #f0f7ff; color: #2355f1; } /* 取消查找定义input红色边框 / .el-form-item.is-error .queryPanel .el-input__inner, .el-form-item.is-error .el-pagination__sizes .el-input__inner, .el-form-item.is-error .el-pagination__jump .el-input__inner{ border-color: #DCDFE6; } / 弹框样式 / .el-dialog__body .el-main{ padding: 0; overflow: hidden; } / .el-dialog .queryPanel .zhc-birt-data-list thead { display: none; } / / tabs / .el-tabs--left .el-tabs__item, .el-tabs--right .el-tabs__item{ width: 60px; line-height: 24px; height: auto; word-wrap: break-word; white-space: pre-line; padding-bottom: 20px; } .el-tabs--right .el-tabs__item{ width: 40px; } .el-tabs--left, .el-tabs--right{ height: auto !important; } .el-tabs--right .queryPanel + div .el-button { margin-right: 10px; } .chart .zhc-birt-cell-children .el-main{ padding: 0; } .el-tabs .el-main{ padding: 0 } .toolBar{ padding: 5px 5% !important; border-bottom: 1px solid #c2bcc0; } .extra .toolBar{ border: none; padding: 0!important; } .dataList_title{ margin-top:5px; } .dataList_title td{ margin-top:5px; position: relative; } .dataList_title td:nth-child(1):before{ content: ' '; display: block; width: 5px; height: 30px; position: absolute; border-radius: 5px; background: #3f96ed; } .toolBar button .icon-XLSX{ font-size: 22px; } .avatar-uploader{ background: #f5f3f6; } .avatar-uploader .el-upload { background-color: #fff; } .zhc-birt-data-list .el-form-item__content > span, .zhc-birt-data-list .el-form-item__content > .lookup > span, .zhc-birt-data-list .el-form-item__content > .el-radio-group, .zhc-birt-data-list .el-form-item__content > .el-checkbox{ padding-left: 12px; } .el-table td{ padding: 7px 0; } .el-table .el-table__header-wrapper th, .el-table .el-table__fixed-header-wrapper th{ background: #f5f7fa !important; } /编辑网格输入框样式 / .el-table.table_edit > .el-table__body-wrapper > .el-table__body > tbody > .el-table__row > td, .el-table.table_edit .el-table__fixed-right > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > td, .el-table.table_edit .el-table__fixed-right > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > td{ padding-top: 0; padding-bottom: 0; } .table_edit > .el-table__body-wrapper > .el-table__body > tbody >.el-table__row > td .cell, .table_edit > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > td .cell{ padding: 0 10px; } .table_edit > .el-table__body-wrapper > .el-table__body > tbody >.el-table__row > td .cell >.el-form-item, .table_edit > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > td .cell>.el-form-item{ margin: 0 -10px; } .el-table--small .el-form-item .el-form-item__content{ line-height: 32px; } .elx-table--empty-placeholder, .elx-table--body-wrapper.fixed-right--wrapper{ top: 48px !important; } .lookup .el-input.is-focus .el-input__inner.el-input__inner { border-color: #409EFF; } .el-range-editor.el-input__inner{ min-width: 230px; } /下拉框获取焦点边框消失*/ .el-select .el-input.is-focus .el-input__inner { border-color: #409EFF !important; } .el-dropdown-menu__item>.el-button--text:hover{ color: red !important; } .iconfont.iconfont{ font-size: 12px; } .el-table__header-wrapper .cell .el-input--suffix{ margin: 0 -10px; width: calc( 100% + 20px ); } .el-table__body tr.current-row>td{ background-color: var(--curRowBg) !important; color: var(--curRowColor) !important; }

Ignore Space Show notes View

project/hivuiSam/styles/index.css 0 → 100644

.custom-tree-node {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  padding-right: 8px;
  width: 80%;
  flex: 1 140px;
}
.custom-tree-node > span:nth-child(1){
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.custom-tree-node .btn{
  opacity: 0;
  transition: opacity 0.5s;
  -webkit-transition: opacity 0.5s;
}
.custom-tree-node:hover .btn{
    opacity: 1;
}
.custom-tree-node .btn .el-icon-edit{
  color: #67c23a;
}
.custom-tree-node .btn .el-icon-delete{
  color: #f56c6c;
}
.cell .el-input-group__append{
  padding: 0 5px !important;
  text-align: center;
}
.cell .el-input-group__append .el-button{
  padding: 0;
  margin: 0;
}
/* .el-form-item__error{
  line-height: 0;
} */
.el-row>.zhc-birt-cell-children>.el-button {
  border: none;
  /* border-right: 1px solid #ddd; */
  border-radius: 0;
  padding: 5px 15px;
}
/* 整个滚动条 */
::-webkit-scrollbar {
  width: 8px;
  height: 10px;
}

/* 滚动条上的滚动滑块 */
::-webkit-scrollbar-thumb {
  /* background-color: #49b1f5; */
  /* 关键代码 */
  /* background-image: -webkit-linear-gradient(45deg,
          rgba(255, 255, 255, 0.4) 25%,
          transparent 25%,
          transparent 50%,
          rgba(255, 255, 255, 0.4) 50%,
          rgba(255, 255, 255, 0.4) 75%,
          transparent 75%,
          transparent); */
  background-color: rgba(0,0,0,.3);
  border-radius: 32px;
}

/* 滚动条轨道 */
::-webkit-scrollbar-track {
  background-color: #dbeffd;
  border-radius: 32px;
}

.custom-tree-node .el-icon-folder-opened,.el-icon-folder{
    color: #ffc107;
}
.custom-tree-node .el-icon-document{
    color: #009688;
}
.custom-tree-node .icon-root{
    color: blue;
}
.custom-tree-node .icon-ptm{
    color: royalblue;
}
.custom-tree-node .el-icon-user{
    color: coral;;
}
.custom-tree-node .icon-org, .icon-func{
    color: aqua;
}
.custom-tree-node .icon-dpt, .icon-flow{
    color: deepskyblue;
}
.custom-tree-node .el-button.is-disabled i{
  color: #C0C4CC !important;
  cursor: not-allowed;
}
.el-table__header-wrapper th.isrequired ::before{
  content: '*';
  color: red;
  margin-right: 5px;
}
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
  background-color: #f0f7ff;
  color: #2355f1;
}
/*
取消查找定义input红色边框
*/
.el-form-item.is-error .queryPanel .el-input__inner,
.el-form-item.is-error .el-pagination__sizes .el-input__inner,
.el-form-item.is-error .el-pagination__jump .el-input__inner{
  border-color: #DCDFE6;
}

/*
弹框样式
*/
.el-dialog__body .el-main{
  padding: 0;
  overflow: hidden;
}
/* .el-dialog .queryPanel .zhc-birt-data-list thead {
  display: none;
} */

/*
tabs
*/
.el-tabs--left .el-tabs__item, .el-tabs--right .el-tabs__item{
  width: 60px;
  line-height: 24px;
  height: auto;
  word-wrap: break-word;
  white-space: pre-line;
  padding-bottom: 20px;
}
.el-tabs--right .el-tabs__item{
  width: 40px;
}
.el-tabs--left, .el-tabs--right{
  height: auto !important;
}
.el-tabs--right .queryPanel + div .el-button {
  margin-right: 10px;
}

.chart .zhc-birt-cell-children .el-main{
  padding: 0;
}
.el-tabs .el-main{
  padding: 0
}
.toolBar{
  padding: 5px 5% !important;
  border-bottom: 1px solid #c2bcc0;
}
.extra .toolBar{
  border: none;
  padding: 0!important;
}

.dataList_title{
  margin-top:5px;
}
.dataList_title td{
  margin-top:5px;
  position: relative;
}
.dataList_title td:nth-child(1):before{
  content: ' ';
  display: block;
  width: 5px;
  height: 30px;
  position: absolute;
  border-radius: 5px;
  background: #3f96ed;
}
.toolBar button .icon-XLSX{
  font-size: 22px;
}
.avatar-uploader{
  background: #f5f3f6;
}
.avatar-uploader .el-upload {
  background-color: #fff;
}
.zhc-birt-data-list .el-form-item__content > span,
.zhc-birt-data-list .el-form-item__content > .lookup > span,
.zhc-birt-data-list .el-form-item__content > .el-radio-group,
.zhc-birt-data-list .el-form-item__content > .el-checkbox{
  padding-left: 12px;
}
.el-table td{
  padding: 7px 0;
}
.el-table .el-table__header-wrapper th,
.el-table .el-table__fixed-header-wrapper th{
  background: #f5f7fa !important;
}
/*编辑网格输入框样式
*/
.el-table.table_edit > .el-table__body-wrapper > .el-table__body > tbody > .el-table__row > td,
.el-table.table_edit .el-table__fixed-right > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > td,
.el-table.table_edit .el-table__fixed-right > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > td{
  padding-top: 0;
  padding-bottom: 0;
}
.table_edit > .el-table__body-wrapper > .el-table__body > tbody >.el-table__row > td .cell,
.table_edit > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > td .cell{
  padding: 0 10px;
}
.table_edit > .el-table__body-wrapper > .el-table__body > tbody >.el-table__row > td .cell >.el-form-item,
.table_edit > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > td .cell>.el-form-item{
  margin: 0 -10px;
}
.el-table--small .el-form-item .el-form-item__content{
  line-height: 32px;
}
.elx-table--empty-placeholder,
.elx-table--body-wrapper.fixed-right--wrapper{
  top: 48px !important;
}
.lookup .el-input.is-focus .el-input__inner.el-input__inner {
  border-color: #409EFF;
}

.el-range-editor.el-input__inner{
  min-width: 230px;
}

/*下拉框获取焦点边框消失*/
.el-select .el-input.is-focus .el-input__inner {
  border-color: #409EFF !important;
}

.el-dropdown-menu__item>.el-button--text:hover{
  color: red !important;
}

.iconfont.iconfont{
  font-size: 12px;
}

.el-table__header-wrapper .cell .el-input--suffix{
  margin: 0 -10px;
  width: calc( 100% + 20px );
}
.el-table__body tr.current-row>td{
  background-color: var(--curRowBg) !important;
  color: var(--curRowColor) !important;
}

Ignore Space Show notes View project/hivuiSam/utils/auth.js 0 → 100644
import Cookies from 'js-cookie' const TokenKey = 'EAP-Token' export function getToken() { return Cookies.get(TokenKey) } export function setToken(token) { return Cookies.set(TokenKey, token) } export function removeToken() { return Cookies.remove(TokenKey) }

Ignore Space Show notes View project/hivuiSam/utils/request.js 0 → 100644
import {baseURL,projectName,requestUrl} from '@birt/config' // import { MessageBox, Message } from 'element-ui' import Message from '@birt/components/vue-m-message/index.js' import store from '@birt/store' import { getToken,removeToken } from '@birt/utils/auth' import axios from 'axios' debugger; // create an axios instance const service = axios.create({ // withCredentials: true, //加了这个要明确那个地址跨域才行 baseURL: baseURL, // api的base_url timeout: 5000 // request timeout }) // request interceptor service.interceptors.request.use( config => { // do something before request is sent if (getToken()) { // let each request carry token // ['X-Token'] is a custom headers key // please modify it according to the actual situation config.headers['token'] = getToken() config.headers['Authorization'] = "Bearer " + getToken() } // else{ // //没有token，跳转登录页 // if(window.HIVUI_SETTING.loginUrl){ // location=window.HIVUI_SETTING.loginUrl; // }else{ // location="/"+projectName+"/hivuiLogin/index.html#/"; // } // } if (config.url.indexOf('?')==-1) config.url = config.url+"?pn="+projectName; else config.url = config.url+"&pn="+projectName; return config }, error => { // Do something with request error Promise.reject(error) } ) // respone interceptor service.interceptors.response.use( //response => response, /** * 下面的注释为通过response自定义code来标示请求状态，当code返回如下情况为权限有问题，登出并返回到登录页 * 如通过xmlhttprequest 状态码标识逻辑可写在下面error中 (response) => { const res = response.data; if (res.code !== 0) { return Promise.reject('error'); } else { return res; } }, / response => { const res = response.data if (res.type == "application/octet-stream") return res; // if the custom code is not 20000, it is judged as an error. if(response.status+"" == "401" \|\| res.status+"" =="401"){ MessageBox.alert('你已被登出,请重新登录', '登录超时', { confirmButtonText: '重新登录', type: 'warning' }).then(() => { let loginUrl = window.HIVUI_SETTING.loginUrl if (window.HIVUI_SETTING.isSingleLogin) { loginUrl = window.HIVUI_SETTING.singleLoginUrl; } if (loginUrl.endsWith("=")) { let params = window.location.search.slice(1, -1).split("&").filter(item => { if (item.indexOf("ticket") == -1) { return item } }); loginUrl = loginUrl + window.location.origin + window.location.pathname + (params.length > 0 ? '?' : '') + params.join("&"); } window.location.href = loginUrl }) }else if (!(response.status+"" == "200" \|\| res.status+"" =="200")) { Message.error(res.msg \|\| res.message \|\| 'Error') /Message({ message: res.msg \|\| res.message \|\| 'Error', type: 'error', duration: 5 * 1000 })/ // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired; if (res.code === 50008 \|\| res.code === 50012 \|\| res.code === 50014) { // to re-login /MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', { confirmButtonText: 'Re-Login', cancelButtonText: 'Cancel', type: 'warning' }).then(() => { store.dispatch('user/resetToken').then(() => { location.reload() }) })*/ if(confirm('You have been logged out, you can cancel to stay on this page, or log in again')){ store.dispatch('user/resetToken').then(() => { location.reload() }) } } //return Promise.reject(new Error(res.message \|\| 'Error')) return Promise.reject(res) } else { if(res.status+"" =="200"){ res.dataPack = res.dataPack \|\| res.data return res }else{ console.error(res.msg \|\| res.message \|\| 'Error'); Message.error(res.msg \|\| res.message \|\| 'Error') } } }, error => { if(error.response.status+"" == "401" \|\| error.response.data.status+"" =="401"){ removeToken(); if(window.HIVUI_SETTING.loginUrl){ location=window.HIVUI_SETTING.loginUrl; } }else{ Message.error(error.msg\|\|error.message) } console.log('err' + error) // for debug return Promise.reject(error) }) export default service

Ignore Space Show notes View

project/hivuiSam/utils/request.js 0 → 100644

import {baseURL,projectName,requestUrl} from '@birt/config'
// import { MessageBox, Message } from 'element-ui'
import Message from '@birt/components/vue-m-message/index.js'
import store from '@birt/store'
import { getToken,removeToken } from '@birt/utils/auth'
import axios from 'axios'
debugger;
// create an axios instance
const service = axios.create({
  // withCredentials: true, //加了这个 要明确那个地址跨域才行
  baseURL: baseURL, // api的base_url
  timeout: 5000 // request timeout
})

// request interceptor
service.interceptors.request.use(
  config => {
    // do something before request is sent

if (getToken()) {
      // let each request carry token
      // ['X-Token'] is a custom headers key
      // please modify it according to the actual situation
      config.headers['token'] = getToken()
      config.headers['Authorization'] = "Bearer " + getToken()
    }
    // else{
    //   //没有token，跳转登录页
    //   if(window.HIVUI_SETTING.loginUrl){
    //     location=window.HIVUI_SETTING.loginUrl;
    //   }else{
    //     location="/"+projectName+"/hivuiLogin/index.html#/";
    //   }
    // }
    
    if (config.url.indexOf('?')==-1)
      config.url = config.url+"?pn="+projectName;
    else
      config.url = config.url+"&pn="+projectName;
    return config
  }, error => {
    // Do something with request error
    Promise.reject(error)
  }
)

// respone interceptor
service.interceptors.response.use(
  //response => response,
  /**
  * 下面的注释为通过response自定义code来标示请求状态，当code返回如下情况为权限有问题，登出并返回到登录页
  * 如通过xmlhttprequest 状态码标识 逻辑可写在下面error中
  (response) => {
    const res = response.data;
    if (res.code !== 0) {
      return Promise.reject('error');   
    } else {
      return res;
    }
  },
  */
  response => {
    const res = response.data
    if (res.type == "application/octet-stream")
      return res;
    // if the custom code is not 20000, it is judged as an error.
    if(response.status+"" == "401" || res.status+"" =="401"){
      MessageBox.alert('你已被登出,请重新登录', '登录超时', {
        confirmButtonText: '重新登录',
        type: 'warning'
      }).then(() => {
        let loginUrl = window.HIVUI_SETTING.loginUrl
        if (window.HIVUI_SETTING.isSingleLogin) {
          loginUrl = window.HIVUI_SETTING.singleLoginUrl;
        }
        if (loginUrl.endsWith("=")) {
          let params = window.location.search.slice(1, -1).split("&").filter(item => {
            if (item.indexOf("ticket") == -1) {
              return item
            }
          });
          loginUrl = loginUrl + window.location.origin + window.location.pathname + (params.length > 0 ? '?' : '') + params.join("&");
        }
        window.location.href = loginUrl
      })
    }else if (!(response.status+"" == "200" || res.status+"" =="200")) {
      
      Message.error(res.msg || res.message || 'Error')  
      /*Message({
        message: res.msg || res.message || 'Error',
        type: 'error',
        duration: 5 * 1000
      })*/

// 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
      if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
        // to re-login
        /*MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
          confirmButtonText: 'Re-Login',
          cancelButtonText: 'Cancel',
          type: 'warning'
        }).then(() => {
          store.dispatch('user/resetToken').then(() => {
            location.reload()
          })
        })*/
        if(confirm('You have been logged out, you can cancel to stay on this page, or log in again')){
          store.dispatch('user/resetToken').then(() => {
            location.reload()
          })
        }
      }
      
      //return Promise.reject(new Error(res.message || 'Error'))
      return Promise.reject(res)
    } else {
      if(res.status+"" =="200"){
        res.dataPack = res.dataPack || res.data
        return res
      }else{
        console.error(res.msg || res.message || 'Error'); 
        Message.error(res.msg || res.message || 'Error') 
      }
    }
  },
  error => {
    if(error.response.status+"" == "401" || error.response.data.status+"" =="401"){
      removeToken();
      if(window.HIVUI_SETTING.loginUrl){
        location=window.HIVUI_SETTING.loginUrl;
      }
    }else{
       Message.error(error.msg||error.message)  
    }
    console.log('err' + error) // for debug 
   
    return Promise.reject(error)
  })

export default service

Ignore Space Show notes View project/hivuiSam/utils/vue-types/index.js 0 → 100644
/** * 所有组件可以进行属性类型使用eg:"button * */ import isPlainObject from 'lodash/isPlainObject'; import { toType, getType, isFunction, validateType, isInteger, isArray, warn } from './utils'; const VuePropTypes = { get any() { return toType('any', { type: null, }); }, get func() { return toType('function', { type: Function, }).def(currentDefaults.func); }, get bool() { return toType('boolean', { type: Boolean, }).def(currentDefaults.bool); }, get string() { return toType('string', { type: String, }).def(currentDefaults.string); }, get number() { return toType('number', { type: Number, }).def(currentDefaults.number); }, get array() { return toType('array', { type: Array, }).def(currentDefaults.array); }, get object() { return toType('object', { type: Object, }).def(currentDefaults.object); }, get integer() { return toType('integer', { type: Number, validator(value) { return isInteger(value); }, }).def(currentDefaults.integer); }, get symbol() { return toType('symbol', { type: null, validator(value) { return typeof value === 'symbol'; }, }); }, custom(validatorFn, warnMsg = 'custom validation failed') { if (typeof validatorFn !== 'function') { throw new TypeError('[VueTypes error]: You must provide a function as argument'); } return toType(validatorFn.name \|\| '<<anonymous function>>', { validator(...args) { const valid = validatorFn(...args); if (!valid) warn(`${this._vueTypes_name} - ${warnMsg}`); return valid; }, }); }, oneOf(arr) { if (!isArray(arr)) { throw new TypeError('[VueTypes error]: You must provide an array as argument'); } const msg = `oneOf - value should be one of "${arr.join('", "')}"`; const allowedTypes = arr.reduce((ret, v) => { if (v !== null && v !== undefined) { ret.indexOf(v.constructor) === -1 && ret.push(v.constructor); } return ret; }, []); return toType('oneOf', { type: allowedTypes.length > 0 ? allowedTypes : null, validator(value) { const valid = arr.indexOf(value) !== -1; if (!valid) warn(msg); return valid; }, }); }, instanceOf(instanceConstructor) { return toType('instanceOf', { type: instanceConstructor, }); }, oneOfType(arr) { if (!isArray(arr)) { throw new TypeError('[VueTypes error]: You must provide an array as argument'); } let hasCustomValidators = false; const nativeChecks = arr.reduce((ret, type) => { if (isPlainObject(type)) { if (type._vueTypes_name === 'oneOf') { return ret.concat(type.type \|\| []); } if (type.type && !isFunction(type.validator)) { if (isArray(type.type)) return ret.concat(type.type); ret.push(type.type); } else if (isFunction(type.validator)) { hasCustomValidators = true; } return ret; } ret.push(type); return ret; }, []); if (!hasCustomValidators) { // we got just native objects (ie: Array, Object) // delegate to Vue native prop check return toType('oneOfType', { type: nativeChecks, }).def(undefined); } const typesStr = arr .map(type => { if (type && isArray(type.type)) { return type.type.map(getType); } return getType(type); }) .reduce((ret, type) => ret.concat(isArray(type) ? type : [type]), []) .join('", "'); return this.custom(function oneOfType(value) { const valid = arr.some(type => { if (type._vueTypes_name === 'oneOf') { return type.type ? validateType(type.type, value, true) : true; } return validateType(type, value, true); }); if (!valid) warn(`oneOfType - value type should be one of "${typesStr}"`); return valid; }).def(undefined); }, arrayOf(type) { return toType('arrayOf', { type: Array, validator(values) { const valid = values.every(value => validateType(type, value)); if (!valid) warn(`arrayOf - value must be an array of "${getType(type)}"`); return valid; }, }); }, objectOf(type) { return toType('objectOf', { type: Object, validator(obj) { const valid = Object.keys(obj).every(key => validateType(type, obj[key])); if (!valid) warn(`objectOf - value must be an object of "${getType(type)}"`); return valid; }, }); }, shape(obj) { const keys = Object.keys(obj); const requiredKeys = keys.filter(key => obj[key] && obj[key].required === true); const type = toType('shape', { type: Object, validator(value) { if (!isPlainObject(value)) { return false; } const valueKeys = Object.keys(value); // check for required keys (if any) if (requiredKeys.length > 0 && requiredKeys.some(req => valueKeys.indexOf(req) === -1)) { warn( `shape - at least one of required properties "${requiredKeys.join( '", "', )}" is not present`, ); return false; } return valueKeys.every(key => { if (keys.indexOf(key) === -1) { if (this._vueTypes_isLoose === true) return true; warn(`shape - object is missing "${key}" property`); return false; } const type = obj[key]; return validateType(type, value[key]); }); }, }); Object.defineProperty(type, '_vueTypes_isLoose', { enumerable: false, writable: true, value: false, }); Object.defineProperty(type, 'loose', { get() { this._vueTypes_isLoose = true; return this; }, enumerable: false, }); return type; }, }; const typeDefaults = () => ({ func: undefined, bool: undefined, string: undefined, number: undefined, array: undefined, object: undefined, integer: undefined, }); let currentDefaults = typeDefaults(); Object.defineProperty(VuePropTypes, 'sensibleDefaults', { enumerable: false, set(value) { if (value === false) { currentDefaults = {}; } else if (value === true) { currentDefaults = typeDefaults(); } else if (isPlainObject(value)) { currentDefaults = value; } }, get() { return currentDefaults; }, }); export default VuePropTypes;

Ignore Space Show notes View

project/hivuiSam/utils/vue-types/index.js 0 → 100644

/**
 * 所有组件可以进行属性类型 使用eg:"button
 * 
 */
import isPlainObject from 'lodash/isPlainObject';
import { toType, getType, isFunction, validateType, isInteger, isArray, warn } from './utils';

const VuePropTypes = {
  get any() {
    return toType('any', {
      type: null,
    });
  },

get func() {
    return toType('function', {
      type: Function,
    }).def(currentDefaults.func);
  },

get bool() {
    return toType('boolean', {
      type: Boolean,
    }).def(currentDefaults.bool);
  },

get string() {
    return toType('string', {
      type: String,
    }).def(currentDefaults.string);
  },

get number() {
    return toType('number', {
      type: Number,
    }).def(currentDefaults.number);
  },

get array() {
    return toType('array', {
      type: Array,
    }).def(currentDefaults.array);
  },

get object() {
    return toType('object', {
      type: Object,
    }).def(currentDefaults.object);
  },

get integer() {
    return toType('integer', {
      type: Number,
      validator(value) {
        return isInteger(value);
      },
    }).def(currentDefaults.integer);
  },

get symbol() {
    return toType('symbol', {
      type: null,
      validator(value) {
        return typeof value === 'symbol';
      },
    });
  },

custom(validatorFn, warnMsg = 'custom validation failed') {
    if (typeof validatorFn !== 'function') {
      throw new TypeError('[VueTypes error]: You must provide a function as argument');
    }

return toType(validatorFn.name || '<<anonymous function>>', {
      validator(...args) {
        const valid = validatorFn(...args);
        if (!valid) warn(`${this._vueTypes_name} - ${warnMsg}`);
        return valid;
      },
    });
  },

oneOf(arr) {
    if (!isArray(arr)) {
      throw new TypeError('[VueTypes error]: You must provide an array as argument');
    }
    const msg = `oneOf - value should be one of "${arr.join('", "')}"`;
    const allowedTypes = arr.reduce((ret, v) => {
      if (v !== null && v !== undefined) {
        ret.indexOf(v.constructor) === -1 && ret.push(v.constructor);
      }
      return ret;
    }, []);

return toType('oneOf', {
      type: allowedTypes.length > 0 ? allowedTypes : null,
      validator(value) {
        const valid = arr.indexOf(value) !== -1;
        if (!valid) warn(msg);
        return valid;
      },
    });
  },

instanceOf(instanceConstructor) {
    return toType('instanceOf', {
      type: instanceConstructor,
    });
  },

oneOfType(arr) {
    if (!isArray(arr)) {
      throw new TypeError('[VueTypes error]: You must provide an array as argument');
    }

let hasCustomValidators = false;

if (!hasCustomValidators) {
      // we got just native objects (ie: Array, Object)
      // delegate to Vue native prop check
      return toType('oneOfType', {
        type: nativeChecks,
      }).def(undefined);
    }

const typesStr = arr
      .map(type => {
        if (type && isArray(type.type)) {
          return type.type.map(getType);
        }
        return getType(type);
      })
      .reduce((ret, type) => ret.concat(isArray(type) ? type : [type]), [])
      .join('", "');

return this.custom(function oneOfType(value) {
      const valid = arr.some(type => {
        if (type._vueTypes_name === 'oneOf') {
          return type.type ? validateType(type.type, value, true) : true;
        }
        return validateType(type, value, true);
      });
      if (!valid) warn(`oneOfType - value type should be one of "${typesStr}"`);
      return valid;
    }).def(undefined);
  },

arrayOf(type) {
    return toType('arrayOf', {
      type: Array,
      validator(values) {
        const valid = values.every(value => validateType(type, value));
        if (!valid) warn(`arrayOf - value must be an array of "${getType(type)}"`);
        return valid;
      },
    });
  },

objectOf(type) {
    return toType('objectOf', {
      type: Object,
      validator(obj) {
        const valid = Object.keys(obj).every(key => validateType(type, obj[key]));
        if (!valid) warn(`objectOf - value must be an object of "${getType(type)}"`);
        return valid;
      },
    });
  },

shape(obj) {
    const keys = Object.keys(obj);
    const requiredKeys = keys.filter(key => obj[key] && obj[key].required === true);

const type = toType('shape', {
      type: Object,
      validator(value) {
        if (!isPlainObject(value)) {
          return false;
        }
        const valueKeys = Object.keys(value);

// check for required keys (if any)
        if (requiredKeys.length > 0 && requiredKeys.some(req => valueKeys.indexOf(req) === -1)) {
          warn(
            `shape - at least one of required properties "${requiredKeys.join(
              '", "',
            )}" is not present`,
          );
          return false;
        }

return valueKeys.every(key => {
          if (keys.indexOf(key) === -1) {
            if (this._vueTypes_isLoose === true) return true;
            warn(`shape - object is missing "${key}" property`);
            return false;
          }
          const type = obj[key];
          return validateType(type, value[key]);
        });
      },
    });

Object.defineProperty(type, '_vueTypes_isLoose', {
      enumerable: false,
      writable: true,
      value: false,
    });

Object.defineProperty(type, 'loose', {
      get() {
        this._vueTypes_isLoose = true;
        return this;
      },
      enumerable: false,
    });

return type;
  },
};

const typeDefaults = () => ({
  func: undefined,
  bool: undefined,
  string: undefined,
  number: undefined,
  array: undefined,
  object: undefined,
  integer: undefined,
});

let currentDefaults = typeDefaults();

Object.defineProperty(VuePropTypes, 'sensibleDefaults', {
  enumerable: false,
  set(value) {
    if (value === false) {
      currentDefaults = {};
    } else if (value === true) {
      currentDefaults = typeDefaults();
    } else if (isPlainObject(value)) {
      currentDefaults = value;
    }
  },
  get() {
    return currentDefaults;
  },
});

export default VuePropTypes;

Ignore Space Show notes View project/hivuiSam/utils/vue-types/utils.js 0 → 100644
import isPlainObject from 'lodash/isPlainObject'; const ObjProto = Object.prototype; const toString = ObjProto.toString; export const hasOwn = ObjProto.hasOwnProperty; const FN_MATCH_REGEXP = /^\sfunction (\w+)/; // https://github.com/vuejs/vue/blob/dev/src/core/util/props.js#L159 export const getType = fn => { const type = fn !== null && fn !== undefined ? (fn.type ? fn.type : fn) : null; const match = type && type.toString().match(FN_MATCH_REGEXP); return match && match[1]; }; export const getNativeType = value => { if (value === null \|\| value === undefined) return null; const match = value.constructor.toString().match(FN_MATCH_REGEXP); return match && match[1]; }; /* * No-op function / export const noop = () => {}; /* * Checks for a own property in an object * * @param {object} obj - Object * @param {string} prop - Property to check / export const has = (obj, prop) => hasOwn.call(obj, prop); /* * Determines whether the passed value is an integer. Uses `Number.isInteger` if available * * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isInteger * @param {} value - The value to be tested for being an integer. @returns {boolean} / export const isInteger = Number.isInteger \|\| function(value) { return typeof value === 'number' && isFinite(value) && Math.floor(value) === value; }; /* * Determines whether the passed value is an Array. * * @param {} value - The value to be tested for being an array. @returns {boolean} / export const isArray = Array.isArray \|\| function(value) { return toString.call(value) === '[object Array]'; }; /* * Checks if a value is a function * * @param {any} value - Value to check * @returns {boolean} / export const isFunction = value => toString.call(value) === '[object Function]'; /* * Adds a `def` method to the object returning a new object with passed in argument as `default` property * * @param {object} type - Object to enhance / export const withDefault = function(type) { Object.defineProperty(type, 'def', { value(def) { if (def === undefined && this.default === undefined) { this.default = undefined; return this; } if (!isFunction(def) && !validateType(this, def)) { warn(`${this._vueTypes_name} - invalid default value: "${def}"`, def); return this; } this.default = isArray(def) \|\| isPlainObject(def) ? function() { return def; } : def; return this; }, enumerable: false, writable: false, }); }; /* * Adds a `isRequired` getter returning a new object with `required: true` key-value * * @param {object} type - Object to enhance / export const withRequired = function(type) { Object.defineProperty(type, 'isRequired', { get() { this.required = true; return this; }, enumerable: false, }); }; /* * Adds `isRequired` and `def` modifiers to an object * * @param {string} name - Type internal name * @param {object} obj - Object to enhance * @returns {object} / export const toType = (name, obj) => { Object.defineProperty(obj, '_vueTypes_name', { enumerable: false, writable: false, value: name, }); withRequired(obj); withDefault(obj); if (isFunction(obj.validator)) { obj.validator = obj.validator.bind(obj); } return obj; }; /* * Validates a given value against a prop type object * * @param {Object\|} type - Type to use for validation. Either a type object or a constructor @param {} value - Value to check @param {boolean} silent - Silence warnings * @returns {boolean} */ export const validateType = (type, value, silent = false) => { let typeToCheck = type; let valid = true; let expectedType; if (!isPlainObject(type)) { typeToCheck = { type }; } const namePrefix = typeToCheck._vueTypes_name ? typeToCheck._vueTypes_name + ' - ' : ''; if (hasOwn.call(typeToCheck, 'type') && typeToCheck.type !== null) { if (isArray(typeToCheck.type)) { valid = typeToCheck.type.some(type => validateType(type, value, true)); expectedType = typeToCheck.type.map(type => getType(type)).join(' or '); } else { expectedType = getType(typeToCheck); if (expectedType === 'Array') { valid = isArray(value); } else if (expectedType === 'Object') { valid = isPlainObject(value); } else if ( expectedType === 'String' \|\| expectedType === 'Number' \|\| expectedType === 'Boolean' \|\| expectedType === 'Function' ) { valid = getNativeType(value) === expectedType; } else { valid = value instanceof typeToCheck.type; } } } if (!valid) { silent === false && warn(`${namePrefix}value "${value}" should be of type "${expectedType}"`); return false; } if (hasOwn.call(typeToCheck, 'validator') && isFunction(typeToCheck.validator)) { valid = typeToCheck.validator(value); if (!valid && silent === false) warn(`${namePrefix}custom validation failed`); return valid; } return valid; }; let warn = noop; if (process.env.NODE_ENV !== 'production') { const hasConsole = typeof console !== 'undefined'; warn = msg => { if (hasConsole) { console.warn(`[VueTypes warn]: ${msg}`); } }; } export { warn };

Ignore Space Show notes View

project/hivuiSam/utils/vue-types/utils.js 0 → 100644

import isPlainObject from 'lodash/isPlainObject';

const ObjProto = Object.prototype;
const toString = ObjProto.toString;
export const hasOwn = ObjProto.hasOwnProperty;

const FN_MATCH_REGEXP = /^\s*function (\w+)/;

// https://github.com/vuejs/vue/blob/dev/src/core/util/props.js#L159
export const getType = fn => {
  const type = fn !== null && fn !== undefined ? (fn.type ? fn.type : fn) : null;
  const match = type && type.toString().match(FN_MATCH_REGEXP);
  return match && match[1];
};

export const getNativeType = value => {
  if (value === null || value === undefined) return null;
  const match = value.constructor.toString().match(FN_MATCH_REGEXP);
  return match && match[1];
};

/**
 * No-op function
 */
export const noop = () => {};

/**
 * Checks for a own property in an object
 *
 * @param {object} obj - Object
 * @param {string} prop - Property to check
 */
export const has = (obj, prop) => hasOwn.call(obj, prop);

/**
 * Determines whether the passed value is an integer. Uses `Number.isInteger` if available
 *
 * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isInteger
 * @param {*} value - The value to be tested for being an integer.
 * @returns {boolean}
 */
export const isInteger =
  Number.isInteger ||
  function(value) {
    return typeof value === 'number' && isFinite(value) && Math.floor(value) === value;
  };

/**
 * Determines whether the passed value is an Array.
 *
 * @param {*} value - The value to be tested for being an array.
 * @returns {boolean}
 */
export const isArray =
  Array.isArray ||
  function(value) {
    return toString.call(value) === '[object Array]';
  };

/**
 * Checks if a value is a function
 *
 * @param {any} value - Value to check
 * @returns {boolean}
 */
export const isFunction = value => toString.call(value) === '[object Function]';

/**
 * Adds a `def` method to the object returning a new object with passed in argument as `default` property
 *
 * @param {object} type - Object to enhance
 */
export const withDefault = function(type) {
  Object.defineProperty(type, 'def', {
    value(def) {
      if (def === undefined && this.default === undefined) {
        this.default = undefined;
        return this;
      }
      if (!isFunction(def) && !validateType(this, def)) {
        warn(`${this._vueTypes_name} - invalid default value: "${def}"`, def);
        return this;
      }
      this.default =
        isArray(def) || isPlainObject(def)
          ? function() {
              return def;
            }
          : def;

return this;
    },
    enumerable: false,
    writable: false,
  });
};

/**
 * Adds a `isRequired` getter returning a new object with `required: true` key-value
 *
 * @param {object} type - Object to enhance
 */
export const withRequired = function(type) {
  Object.defineProperty(type, 'isRequired', {
    get() {
      this.required = true;
      return this;
    },
    enumerable: false,
  });
};

/**
 * Adds `isRequired` and `def` modifiers to an object
 *
 * @param {string} name - Type internal name
 * @param {object} obj - Object to enhance
 * @returns {object}
 */
export const toType = (name, obj) => {
  Object.defineProperty(obj, '_vueTypes_name', {
    enumerable: false,
    writable: false,
    value: name,
  });
  withRequired(obj);
  withDefault(obj);

if (isFunction(obj.validator)) {
    obj.validator = obj.validator.bind(obj);
  }
  return obj;
};

/**
 * Validates a given value against a prop type object
 *
 * @param {Object|*} type - Type to use for validation. Either a type object or a constructor
 * @param {*} value - Value to check
 * @param {boolean} silent - Silence warnings
 * @returns {boolean}
 */
export const validateType = (type, value, silent = false) => {
  let typeToCheck = type;
  let valid = true;
  let expectedType;
  if (!isPlainObject(type)) {
    typeToCheck = { type };
  }
  const namePrefix = typeToCheck._vueTypes_name ? typeToCheck._vueTypes_name + ' - ' : '';

if (hasOwn.call(typeToCheck, 'type') && typeToCheck.type !== null) {
    if (isArray(typeToCheck.type)) {
      valid = typeToCheck.type.some(type => validateType(type, value, true));
      expectedType = typeToCheck.type.map(type => getType(type)).join(' or ');
    } else {
      expectedType = getType(typeToCheck);

if (expectedType === 'Array') {
        valid = isArray(value);
      } else if (expectedType === 'Object') {
        valid = isPlainObject(value);
      } else if (
        expectedType === 'String' ||
        expectedType === 'Number' ||
        expectedType === 'Boolean' ||
        expectedType === 'Function'
      ) {
        valid = getNativeType(value) === expectedType;
      } else {
        valid = value instanceof typeToCheck.type;
      }
    }
  }

if (!valid) {
    silent === false && warn(`${namePrefix}value "${value}" should be of type "${expectedType}"`);
    return false;
  }

if (hasOwn.call(typeToCheck, 'validator') && isFunction(typeToCheck.validator)) {
    valid = typeToCheck.validator(value);
    if (!valid && silent === false) warn(`${namePrefix}custom validation failed`);
    return valid;
  }
  return valid;
};

let warn = noop;

if (process.env.NODE_ENV !== 'production') {
  const hasConsole = typeof console !== 'undefined';
  warn = msg => {
    if (hasConsole) {
      console.warn(`[VueTypes warn]: ${msg}`);
    }
  };
}

export { warn };

Show line notes below