Skip to content

D
dataease
提交 17dd2dbe authored 作者: wangjiahao's avatar wangjiahao
浏览文件
操作

feat: 更换其他组件图标 将上传图片组件 移动到侧边栏中

上级 f2f698b2
隐藏空白字符变更
内嵌 并排
正在显示 包含 1390 行增加 和 25 行删除
frontend/src/components/canvas/components/Editor/index.vue
浏览文件 @ 17dd2dbe
......@@ -64,16 +64,6 @@
:element="item"
:out-style="getShapeStyleInt(item.style)"
/>
<!-- <component
:is="item.component"
v-else
:id="'component' + item.id"
class="component"
:style="getComponentStyle(item.style)"
:prop-value="item.propValue"
:element="item"
@input="handleInput"
/> -->
</de-drag>
<!-- 右击菜单 -->
<ContextMenu />
......
frontend/src/components/canvas/components/Toolbar.vue
浏览文件 @ 17dd2dbe
......@@ -41,9 +41,9 @@
<el-tooltip :content="$t('panel.redo') ">
<el-button class="el-icon-refresh-left" size="mini" circle @click="redo" />
</el-tooltip>
<el-tooltip :content="$t('panel.insert_picture') ">
<el-button class="el-icon-upload" size="mini" circle @click="goFile" />
</el-tooltip>
<!-- <el-tooltip :content="$t('panel.insert_picture') ">-->
<!-- <el-button class="el-icon-upload" size="mini" circle @click="goFile" />-->
<!-- </el-tooltip>-->
<el-tooltip :content="$t('panel.clean_canvas')" style="margin-right: 10px">
<el-button class="el-icon-document-delete" size="mini" circle @click="clearCanvas" />
</el-tooltip>
......
frontend/src/components/canvas/custom-component/component-list.js
浏览文件 @ 17dd2dbe
......@@ -17,7 +17,7 @@ export const assistList = [
component: 'v-text',
type: 'v-text',
label: '文字',
icon: 'iconfont icon-shuru',
icon: 'iconfont icon-text',
defaultClass: 'text-filter'
},
{
......@@ -25,7 +25,18 @@ export const assistList = [
component: 'rect-shape',
type: 'rect-shape',
label: '矩形',
icon: 'iconfont icon-xialakuang',
icon: 'iconfont icon-juxing',
defaultClass: 'text-filter'
}
]
export const pictureList = [
{
id: '20001',
component: 'picture',
type: 'picture',
label: '点击上传',
icon: 'iconfont icon-picture',
defaultClass: 'text-filter'
}
]
......
frontend/src/styles/deicon/demo.css 0 → 100644
浏览文件 @ 17dd2dbe
/* 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;
}
frontend/src/styles/deicon/demo_index.html 0 → 100644
浏览文件 @ 17dd2dbe
<!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=2459092" 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">&#xe648;</span>
<div class="name">矩形</div>
<div class="code-name">&amp;#xe648;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe959;</span>
<div class="name">text</div>
<div class="code-name">&amp;#xe959;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe643;</span>
<div class="name">picture</div>
<div class="code-name">&amp;#xe643;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe6ab;</span>
<div class="name">输入</div>
<div class="code-name">&amp;#xe6ab;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe628;</span>
<div class="name">树</div>
<div class="code-name">&amp;#xe628;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe615;</span>
<div class="name">查询搜索</div>
<div class="code-name">&amp;#xe615;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe624;</span>
<div class="name">季度</div>
<div class="code-name">&amp;#xe624;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7de;</span>
<div class="name">数字顺序</div>
<div class="code-name">&amp;#xe7de;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe6a6;</span>
<div class="name">树列表</div>
<div class="code-name">&amp;#xe6a6;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe639;</span>
<div class="name">日期</div>
<div class="code-name">&amp;#xe639;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe6dd;</span>
<div class="name">左侧-区间</div>
<div class="code-name">&amp;#xe6dd;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe66f;</span>
<div class="name">列表</div>
<div class="code-name">&amp;#xe66f;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe8ca;</span>
<div class="name">下拉框</div>
<div class="code-name">&amp;#xe8ca;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe8d0;</span>
<div class="name">下拉树</div>
<div class="code-name">&amp;#xe8d0;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe611;</span>
<div class="name">重置</div>
<div class="code-name">&amp;#xe611;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe691;</span>
<div class="name">日</div>
<div class="code-name">&amp;#xe691;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe692;</span>
<div class="name">年</div>
<div class="code-name">&amp;#xe692;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe695;</span>
<div class="name">月</div>
<div class="code-name">&amp;#xe695;</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=1623984849135') format('woff2'),
url('iconfont.woff?t=1623984849135') format('woff'),
url('iconfont.ttf?t=1623984849135') 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-juxing"></span>
<div class="name">
矩形
</div>
<div class="code-name">.icon-juxing
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-text"></span>
<div class="name">
text
</div>
<div class="code-name">.icon-text
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-picture"></span>
<div class="name">
picture
</div>
<div class="code-name">.icon-picture
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shuru"></span>
<div class="name">
输入
</div>
<div class="code-name">.icon-shuru
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tree"></span>
<div class="name">
树
</div>
<div class="code-name">.icon-tree
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-chaxunsousuo"></span>
<div class="name">
查询搜索
</div>
<div class="code-name">.icon-chaxunsousuo
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jidu"></span>
<div class="name">
季度
</div>
<div class="code-name">.icon-jidu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shuzishunxu"></span>
<div class="name">
数字顺序
</div>
<div class="code-name">.icon-shuzishunxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-Group-"></span>
<div class="name">
树列表
</div>
<div class="code-name">.icon-Group-
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-riqi"></span>
<div class="name">
日期
</div>
<div class="code-name">.icon-riqi
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-zuoce-qujian"></span>
<div class="name">
左侧-区间
</div>
<div class="code-name">.icon-zuoce-qujian
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-liebiao"></span>
<div class="name">
列表
</div>
<div class="code-name">.icon-liebiao
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xialakuang"></span>
<div class="name">
下拉框
</div>
<div class="code-name">.icon-xialakuang
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xialashu"></span>
<div class="name">
下拉树
</div>
<div class="code-name">.icon-xialashu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-zhongzhi"></span>
<div class="name">
重置
</div>
<div class="code-name">.icon-zhongzhi
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-ri"></span>
<div class="name">
日
</div>
<div class="code-name">.icon-ri
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-nian"></span>
<div class="name">
年
</div>
<div class="code-name">.icon-nian
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yue"></span>
<div class="name">
月
</div>
<div class="code-name">.icon-yue
</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-juxing"></use>
</svg>
<div class="name">矩形</div>
<div class="code-name">#icon-juxing</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-text"></use>
</svg>
<div class="name">text</div>
<div class="code-name">#icon-text</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-picture"></use>
</svg>
<div class="name">picture</div>
<div class="code-name">#icon-picture</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shuru"></use>
</svg>
<div class="name">输入</div>
<div class="code-name">#icon-shuru</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tree"></use>
</svg>
<div class="name">树</div>
<div class="code-name">#icon-tree</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-chaxunsousuo"></use>
</svg>
<div class="name">查询搜索</div>
<div class="code-name">#icon-chaxunsousuo</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jidu"></use>
</svg>
<div class="name">季度</div>
<div class="code-name">#icon-jidu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shuzishunxu"></use>
</svg>
<div class="name">数字顺序</div>
<div class="code-name">#icon-shuzishunxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-Group-"></use>
</svg>
<div class="name">树列表</div>
<div class="code-name">#icon-Group-</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-riqi"></use>
</svg>
<div class="name">日期</div>
<div class="code-name">#icon-riqi</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-zuoce-qujian"></use>
</svg>
<div class="name">左侧-区间</div>
<div class="code-name">#icon-zuoce-qujian</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-liebiao"></use>
</svg>
<div class="name">列表</div>
<div class="code-name">#icon-liebiao</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xialakuang"></use>
</svg>
<div class="name">下拉框</div>
<div class="code-name">#icon-xialakuang</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xialashu"></use>
</svg>
<div class="name">下拉树</div>
<div class="code-name">#icon-xialashu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-zhongzhi"></use>
</svg>
<div class="name">重置</div>
<div class="code-name">#icon-zhongzhi</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-ri"></use>
</svg>
<div class="name">日</div>
<div class="code-name">#icon-ri</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-nian"></use>
</svg>
<div class="name">年</div>
<div class="code-name">#icon-nian</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yue"></use>
</svg>
<div class="name">月</div>
<div class="code-name">#icon-yue</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>
frontend/src/styles/deicon/iconfont.css
浏览文件 @ 17dd2dbe
@font-face {font-family: "iconfont";
src: url('iconfont.eot?t=1617248036081'); /* IE9 */
src: url('iconfont.eot?t=1617248036081#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
url('iconfont.woff?t=1617248036081') format('woff'),
url('iconfont.ttf?t=1617248036081') format('truetype') /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
/*url('/@/icons/svg/iconfont.svg?t=1617248036081#iconfont') format('svg'); !* iOS 4.1- *!*/
@font-face {
font-family: "iconfont"; /* Project id 2459092 */
src: url('iconfont.woff2?t=1623984849135') format('woff2'),
url('iconfont.woff?t=1623984849135') format('woff'),
url('iconfont.ttf?t=1623984849135') format('truetype');
}
.iconfont {
......@@ -15,6 +13,18 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-juxing:before {
content: "\e648";
}
.icon-text:before {
content: "\e959";
}
.icon-picture:before {
content: "\e643";
}
.icon-shuru:before {
content: "\e6ab";
}
......
frontend/src/styles/deicon/iconfont.js 0 → 100644
浏览文件 @ 17dd2dbe
!function(c){var h,a,l,v,t,o,i='<svg><symbol id="icon-juxing" viewBox="0 0 1024 1024"><path d="M876.4664713541666 302.9680989583333H776.4029947916665V202.90462239583334c0-11.865234374999998-9.8876953125-21.7529296875-21.7529296875-21.7529296875s-21.7529296875 9.8876953125-21.7529296875 21.7529296875v100.0634765625H632.8336588541666c-11.865234374999998 0-21.7529296875 9.8876953125-21.7529296875 21.7529296875s9.8876953125 21.7529296875 21.7529296875 21.7529296875h100.0634765625v100.0634765625c0 11.865234374999998 9.8876953125 21.7529296875 21.7529296875 21.7529296875s21.7529296875-9.8876953125 21.7529296875-21.7529296875V346.4739583333333H876.4664713541666c11.865234374999998 0 21.7529296875-9.8876953125 21.7529296875-21.7529296875 0-12.2607421875-9.8876953125-21.7529296875-21.7529296875-21.7529296875zM146.75455729166666 386.0247395833333c11.07421875 0 19.775390625-8.701171874999998 19.775390625-19.775390625h0.7910156249999999v-21.7529296875h36.38671875c10.678710937499998 0 19.775390625-8.701171874999998 19.775390625-19.775390625s-9.0966796875-19.775390625-19.775390625-19.775390625l-56.953125-0.39550781249999994c-11.07421875 0-19.775390625 8.701171874999998-19.775390625 19.775390625v42.71484374999999c0 9.8876953125 8.701171874999998 18.984374999999996 19.775390625 18.984374999999996z m135.26367187500003-41.92382812499999h98.876953125c11.07421875 0 19.775390625-8.701171874999998 19.775390625-19.775390625s-8.701171874999998-19.775390625-19.775390625-19.775390625h-98.876953125c-11.07421875 0-19.775390625 9.0966796875-19.775390625 19.775390625 0 11.07421875 9.0966796875 19.775390625 19.775390625 19.775390625z m177.1875 0h98.876953125c11.07421875 0 19.775390625-8.701171874999998 19.775390625-19.775390625s-8.701171874999998-19.775390625-19.775390625-19.775390625h-98.876953125c-11.07421875 0-19.775390625 9.0966796875-19.775390625 19.775390625 0.7910156249999999 11.07421875 8.701171874999998 19.775390625 19.775390625 19.775390625zM774.8209635416665 560.8391927083335c0-11.07421875-8.701171874999998-19.775390625-19.775390625-19.775390625s-19.775390625 8.701171874999998-19.775390625 19.775390625v98.876953125c0 11.07421875 8.701171874999998 19.775390625 19.775390625 19.775390625s19.775390625-8.701171874999998 19.775390625-19.775390625v-98.876953125z m-19.775390625 157.41210937500003c-11.07421875 0-19.775390625 9.0966796875-19.775390625 19.775390625v64.072265625h-79.1015625v1.1865234374999998c-11.07421875 0-19.775390625 8.701171874999998-19.775390625 19.775390625s8.701171874999998 19.775390625 19.775390625 19.775390625h98.876953125c11.07421875 0 19.775390625-8.701171874999998 19.775390625-19.775390625V738.8177083333334c0-11.865234374999998-9.0966796875-20.56640625-19.775390625-20.56640625zM581.0221354166666 802.0989583333333L166.52994791666666 801.3079427083333V423.2024739583333h-0.7910156249999999c0-11.07421875-8.701171874999998-19.775390625-19.775390625-19.775390625s-19.775390625 8.701171874999998-19.775390625 19.775390625V821.8743489583334c0 11.07421875 8.701171874999998 19.775390625 19.775390625 19.775390625H579.8356119791666c11.07421875 0 19.775390625-9.0966796875 19.775390625-19.775390625 0-11.07421875-9.0966796875-19.775390625-18.5888671875-19.775390625z" ></path></symbol><symbol id="icon-text" viewBox="0 0 1024 1024"><path d="M853.333333 1024 170.666667 1024c-93.866667 0-170.666667-76.8-170.666667-170.666667L0 170.666667c0-93.866667 76.8-170.666667 170.666667-170.666667l682.666667 0c93.866667 0 170.666667 76.8 170.666667 170.666667l0 682.666667C1024 947.2 947.2 1024 853.333333 1024zM170.666667 85.333333C123.733333 85.333333 85.333333 123.733333 85.333333 170.666667l0 682.666667c0 46.933333 38.4 85.333333 85.333333 85.333333l682.666667 0c46.933333 0 85.333333-38.4 85.333333-85.333333L938.666667 170.666667c0-46.933333-38.4-85.333333-85.333333-85.333333L170.666667 85.333333z" ></path><path d="M725.333333 341.333333 298.666667 341.333333C273.066667 341.333333 256 324.266667 256 298.666667s17.066667-42.666667 42.666667-42.666667l426.666667 0c25.6 0 42.666667 17.066667 42.666667 42.666667S750.933333 341.333333 725.333333 341.333333z" ></path><path d="M298.666667 384C273.066667 384 256 366.933333 256 341.333333L256 298.666667c0-25.6 17.066667-42.666667 42.666667-42.666667s42.666667 17.066667 42.666667 42.666667l0 42.666667C341.333333 366.933333 324.266667 384 298.666667 384z" ></path><path d="M725.333333 384c-25.6 0-42.666667-17.066667-42.666667-42.666667L682.666667 298.666667c0-25.6 17.066667-42.666667 42.666667-42.666667s42.666667 17.066667 42.666667 42.666667l0 42.666667C768 366.933333 750.933333 384 725.333333 384z" ></path><path d="M512 768c-25.6 0-42.666667-17.066667-42.666667-42.666667L469.333333 298.666667c0-25.6 17.066667-42.666667 42.666667-42.666667s42.666667 17.066667 42.666667 42.666667l0 426.666667C554.666667 750.933333 537.6 768 512 768z" ></path><path d="M554.666667 768l-85.333333 0c-25.6 0-42.666667-17.066667-42.666667-42.666667s17.066667-42.666667 42.666667-42.666667l85.333333 0c25.6 0 42.666667 17.066667 42.666667 42.666667S580.266667 768 554.666667 768z" ></path></symbol><symbol id="icon-picture" viewBox="0 0 1024 1024"><path d="M875.633778 64H148.366222A98.602667 98.602667 0 0 0 49.777778 162.588444v698.823112a98.602667 98.602667 0 0 0 98.588444 98.602666h727.267556a98.602667 98.602667 0 0 0 98.588444-98.602666h0.014222V162.588444A98.602667 98.602667 0 0 0 875.633778 64zM106.666667 861.411556v-136.405334l201.372444-288.042666c6.215111-8.888889 14.876444-14.250667 24.405333-15.089778 9.628444-0.952889 19.015111 2.929778 26.680889 10.595555l176.924445 176.910223-218.624 293.745777H148.366222A41.713778 41.713778 0 0 1 106.666667 861.411556z m810.680889 0a41.713778 41.713778 0 0 1-41.713778 41.713777H352.867556l252.202666-338.816c6.599111-8.832 15.815111-14.193778 25.998222-15.089777 10.268444-0.867556 20.181333 2.773333 28.174223 10.339555l155.562666 146.744889c5.688889 5.390222 14.705778 5.105778 20.110223-0.583111a14.250667 14.250667 0 0 0-0.583112-20.110222L678.784 538.865778c-13.994667-13.198222-31.886222-19.626667-50.218667-17.976889-18.360889 1.607111-34.801778 10.993778-46.307555 26.439111l-29.027556 38.997333-173.980444-173.966222c-13.738667-13.738667-31.232-20.366222-49.294222-18.816-18.062222 1.578667-34.133333 11.221333-45.226667 27.121778L106.666667 675.370667V162.588444A41.699556 41.699556 0 0 1 148.366222 120.888889h727.267556a41.699556 41.699556 0 0 1 41.699555 41.699555h0.014223v698.823112z" fill="" ></path><path d="M868.636444 717.937778a14.222222 14.222222 0 0 0-19.527111 20.664889l16.995556 16.056889a14.208 14.208 0 0 0 20.096-0.583112 14.193778 14.193778 0 0 0-0.554667-20.081777l-17.009778-16.056889zM636.743111 175.957333c-67.783111 0-122.908444 55.125333-122.908444 122.894223 0 67.768889 55.125333 122.908444 122.908444 122.908444 67.754667 0 122.908444-55.139556 122.908445-122.908444s-55.139556-122.894222-122.908445-122.894223z m0 217.372445c-52.081778 0-94.464-42.368-94.464-94.464s42.368-94.449778 94.464-94.449778 94.464 42.353778 94.464 94.449778-42.368 94.464-94.464 94.464z" fill="" ></path></symbol><symbol id="icon-shuru" viewBox="0 0 1024 1024"><path d="M970.666667 204.8l-151.466667-151.466667L701.866667 170.666667H64c-12.8 0-21.333333 8.533333-21.333333 21.333333v768c0 12.8 8.533333 21.333333 21.333333 21.333333h576c6.4 0 10.666667-2.133333 14.933333-6.4l192-192c4.266667-4.266667 6.4-8.533333 6.4-14.933333V322.133333l117.333334-117.333333z m-529.066667 469.333333l-98.133333-85.333333L742.4 189.866667l91.733333 91.733333-392.533333 392.533333z m-123.733333-49.066666l89.6 76.8-121.6 34.133333 32-110.933333zM910.933333 204.8l-46.933333 46.933333-91.733333-91.733333 46.933333-46.933333 91.733333 91.733333zM661.333333 908.8V789.333333h119.466667L661.333333 908.8z m149.333334-162.133333h-170.666667c-12.8 0-21.333333 8.533333-21.333333 21.333333v170.666667H85.333333V213.333333h573.866667l-128 128H170.666667v42.666667h317.866666l-128 128H170.666667v42.666667h147.2l-32 32-61.866667 213.333333 213.333333-61.866667 183.466667-183.466666H725.333333v-42.666667h-61.866666l147.2-147.2V746.666667z" ></path></symbol><symbol id="icon-tree" viewBox="0 0 1024 1024"><path d="M448.84 880.29H175.37c-20.14 0-36.46-16.33-36.46-36.46 0-20.14 16.33-36.46 36.46-36.46h273.48c20.14 0 36.46 16.33 36.46 36.46 0 20.14-16.33 36.46-36.47 36.46zM448.84 588.58H175.37c-20.14 0-36.46-16.33-36.46-36.46 0-20.14 16.33-36.46 36.46-36.46h273.48c20.14 0 36.46 16.33 36.46 36.46 0 20.14-16.33 36.46-36.47 36.46z" ></path><path d="M138.9 843.83V296.88c0-20.14 16.33-36.46 36.46-36.46 20.14 0 36.46 16.33 36.46 36.46v546.95c0 20.14-16.33 36.46-36.46 36.46-20.13 0-36.46-16.32-36.46-36.46z" ></path><path d="M211.83 348.16H138.9c-40.11 0-72.93-32.82-72.93-72.93V202.3c0-40.11 32.82-72.93 72.93-72.93h72.93c40.11 0 72.93 32.82 72.93 72.93v72.93c0 40.11-32.82 72.93-72.93 72.93zM922.87 625.05H605.12c-20.05 0-36.46-16.41-36.46-36.46v-72.93c0-20.05 16.41-36.46 36.46-36.46h317.75c20.05 0 36.46 16.41 36.46 36.46v72.93c0 20.05-16.41 36.46-36.46 36.46zM921.67 311.69h-508.1c-20.71 0-37.66-16.95-37.66-37.66V203.5c0-20.71 16.95-37.66 37.66-37.66h508.1c20.71 0 37.66 16.95 37.66 37.66v70.54c0 20.71-16.94 37.65-37.66 37.65zM922.87 916.76H605.12c-20.05 0-36.46-16.41-36.46-36.46v-72.93c0-20.05 16.41-36.46 36.46-36.46h317.75c20.05 0 36.46 16.41 36.46 36.46v72.93c0 20.05-16.41 36.46-36.46 36.46z" ></path></symbol><symbol id="icon-chaxunsousuo" viewBox="0 0 1024 1024"><path d="M724.173722 608.066299m33.939704 33.939705l203.638226 203.638225q33.939704 33.939704 0 67.879409l0 0q-33.939704 33.939704-67.879409 0l-203.638225-203.638226q-33.939704-33.939704 0-67.879408l0 0q33.939704-33.939704 67.879408 0Z" ></path><path d="M48.436376 928.00402m47.99799 0l287.98794 0q47.99799 0 47.99799 47.99799l0 0q0 47.99799-47.99799 47.99799l-287.98794 0q-47.99799 0-47.99799-47.99799l0 0q0-47.99799 47.99799-47.99799Z" ></path><path d="M464.418957 832.00804a415.982581 415.982581 0 1 1 293.747699-121.594909A415.342608 415.342608 0 0 1 464.418957 832.00804z m0-735.969182A319.986601 319.986601 0 1 0 688.409577 192.034839a319.986601 319.986601 0 0 0-223.99062-95.995981z" ></path></symbol><symbol id="icon-jidu" viewBox="0 0 1024 1024"><path d="M153.850705 812.896572v-537.121614c0.409313-0.511642 0.920955-0.920955 0.920955-1.432598 1.330269-12.688718 6.856001-23.637854 15.144599-32.949735 13.609673-15.451584 31.005496-22.716898 51.573498-22.716898H284.626362v-5.62806-44.205856c0-1.637254 0.511642-3.376836 0.716298-5.01409 0.920955-6.037374 6.242031-7.469971 10.539822-9.925852h9.516539c10.130509 3.581493 12.688718 11.563106 12.381732 21.386629-0.409313 12.177076-0.102328 24.45648-0.102328 36.633557v6.446687h389.359448c0-14.4283 0.306985-28.549615-0.102328-42.67093-0.306985-10.02818 1.841911-18.112122 12.381733-21.898272h9.516538c8.902568 3.683821 12.074748 10.437494 11.460778 19.954032-0.61397 10.64215-0.204657 21.181973-0.204657 31.824124v13.098031h5.730389c19.851704 0 39.703408-0.102328 59.555111 0.102328 4.093135 0 8.18627 0.204657 12.177076 1.023284 20.874988 4.809433 37.145198 16.065554 46.559409 35.81493 2.353553 4.911762 3.990806 10.232837 5.935045 15.349255v546.740482c-0.61397 1.739582-1.330269 3.581493-1.944239 5.423403-7.879285 23.84251-23.740182 39.191766-48.401319 44.922155-2.353553 0.511642-4.604777 1.330269-6.856001 1.944239H211.973219c-0.306985-0.306985-0.511642-0.818627-0.920956-0.920955-9.209553-0.61397-17.498151-3.888478-25.377435-8.697912-12.074748-7.265314-21.181973-16.986509-26.298392-30.186869-2.148896-5.525732-3.683821-11.460777-5.525731-17.293495z m33.25672-397.955031V803.482362c0 18.419107 14.121315 33.359049 33.461377 33.359049 194.526232 0.102328 389.052463 0.102328 583.578695 0 19.237734 0 33.563705-14.325972 33.563705-33.666034 0.102328-127.603478 0.102328-255.206955 0.102329-382.810432v-5.321076c-217.038473-0.102328-433.565304-0.102328-650.706106-0.102328z m0-33.666034h650.501449c0.102328-0.920955 0.204657-1.534926 0.204657-2.148896 0-31.721795 0.102328-63.443589-0.102329-95.165384 0-2.762866-0.61397-5.62806-1.534925-8.186269-5.116419-15.963226-16.679524-23.126212-31.926452-23.637854-20.056361-0.511642-40.112721-0.204657-60.169082-0.102328-1.22794 0-2.455881 0.204657-3.888478 0.409313 0 17.088838 0.204657 33.870691-0.204656 50.754872-0.102328 3.172179-1.534926 6.856001-3.683822 9.209553-5.62806 6.037374-12.688718 6.549016-20.261017 3.581493-5.01409-1.944239-9.107225-8.18627-9.107225-14.632957-0.102328-13.302688 0-26.707705 0-40.010393v-8.800239H317.576097c0 15.758569 0.204657 31.107825-0.102329 46.45708-0.204657 10.64215-3.581493 16.679524-14.939942 18.726091-6.856001 1.22794-18.419107-3.78615-18.316778-14.4283 0.204657-15.246927 0.102328-30.391526 0.102328-45.740781v-5.321076H224.150295c-2.967523 0-5.832717 0.61397-8.902568 0.818627-17.805136 1.22794-28.754272 19.135405-28.549616 33.461377 0.409313 29.879884 0.102328 59.65744 0.102329 89.537324 0.306985 1.330269 0.306985 3.172179 0.306985 5.218747z m-33.25672 431.621065c1.841911 5.730389 3.479165 11.767763 5.62806 17.395823 5.116419 13.20036 14.223643 23.023883 26.298391 30.18687 7.879285 4.707105 16.167882 7.981613 25.377436 8.697911 0.306985 0 0.61397 0.511642 0.920955 0.920955h-58.122514c-0.102328-19.135405-0.102328-38.066154-0.102328-57.201559z m659.097032 57.201559c2.353553-0.61397 4.604777-1.432597 6.856-1.944239 24.661137-5.832717 40.419706-21.181973 48.401319-44.922154 0.61397-1.841911 1.330269-3.581493 1.944239-5.423404v52.392126c-19.135405-0.102328-38.168482-0.102328-57.201558-0.102329z" fill="" ></path><path d="M227.424803 623.179774l10.02818-2.353552c25.275107-6.242031 44.410513-13.81433 56.792245-22.921555 12.893375-9.004897 23.433197-17.191166 31.517138-24.763466h-30.08454c-13.81433 0-33.359049 0.511642-58.224843 1.944239 0.511642-3.376836 0.511642-6.242031 0.920955-8.083941s0.511642-3.78615 0.511642-5.730389-0.511642-6.242031-1.432597-13.302688c32.949735 1.432597 52.494454 1.944239 58.224843 1.944239h59.145797v-22.512241c-25.275107 1.432597-39.601079 1.944239-42.977915 1.944239l-26.707705 0.409313-13.405016 0.511642c-0.920955-3.78615-2.353553-7.674628-3.376836-10.949136-0.920955-3.376836-4.297792-8.595583-9.107225-15.758569l10.02818 0.920956c6.242031 0.920955 18.112122 0.920955 35.81493 0.920955 20.568002 0 45.331468-0.920955 74.495053-3.376836 29.061257-2.353553 50.140901-5.218747 63.44359-8.595583l9.516538-2.353553c5.218747 9.004897 10.949136 17.60048 17.191166 26.196063l-30.493854 2.353553-32.438094 2.865194-29.572898 2.353552v23.842511h54.438692c5.218747 0 25.275107-0.511642 60.169082-1.944239-0.920955 3.78615-1.432597 7.162986-1.432597 8.595583-0.511642 1.944239-0.511642 3.376836-0.511642 3.786149 0 0.920955 0.511642 5.218747 1.944239 13.302689-24.865794-1.432597-44.819826-1.944239-60.169082-1.944239h-26.298391c6.242031 6.651344 15.246927 14.325972 26.707705 23.330868 11.972419 9.004897 31.517138 15.758569 59.145798 20.05636l9.107225 1.432598c-5.218747 5.218747-8.595583 9.516538-10.949136 12.893374-2.353553 3.376836-4.809433 8.595583-6.651344 15.246927l-9.107225-3.786149c-30.493854-13.302688-50.550215-24.354152-61.090037-32.847407-10.02818-8.595583-17.191166-15.246927-20.977316-19.544719L382.452283 575.801739l-3.786149-4.809434h-1.944239v29.982213c0 3.78615 0.511642 10.949136 1.432597 21.488958-6.651344-0.920955-10.539822-0.920955-12.381733-0.920956-1.432597 0-5.730389 0.511642-12.893375 0.920956 0.920955-10.02818 1.944239-17.191166 1.944239-21.488958V570.787649c-4.297792 4.297792-9.107225 9.004897-14.837613 14.735285s-11.460777 11.460777-18.112122 17.60048c-6.651344 5.730389-18.623763 14.325972-36.224243 24.763465 10.949136 0.920955 20.977316 1.432597 29.572899 1.432597h95.47237c10.539822 0 22.921555-0.511642 36.735884-1.432597-18.112122 14.735285-30.493854 24.763466-37.65684 29.061257L378.666134 676.595183v0.511642h47.68502c15.246927 0 35.81493-0.511642 62.010992-1.944239-0.511642 4.297792-0.920955 7.162986-0.920955 9.004897 0 1.944239-0.511642 3.78615-0.511642 5.730388s0.511642 6.242031 1.432597 12.893375c-24.865794-1.432597-45.331468-2.353553-62.010992-2.353552H378.666134v33.359048c0 8.083941-1.432597 14.735285-4.297792 19.033077-2.865194 4.809433-17.191166 7.162986-43.387229 8.083941 0-3.78615-0.511642-7.162986-0.920955-9.004896-0.511642-2.353553-0.920955-4.297792-1.944239-6.242031-0.920955-2.353553-4.297792-8.083941-10.539822-17.191166 11.972419 2.353553 20.977316 3.376836 27.219346 2.865194 3.376836 0 5.730389-0.511642 7.162986-1.944239 1.432597-1.432597 1.944239-4.809433 1.944239-9.516538v-19.544719h-51.573498c-11.972419 0-31.926451 0.920955-60.169082 2.353553 0-3.376836 0.511642-7.162986 0.511642-10.437494s0.511642-6.242031 0.511642-7.674628l-0.920956-9.516538c25.275107 1.432597 45.331468 1.944239 60.169082 1.944239h50.550215v-6.242031l-0.511642-3.376836 3.78615-0.920955c7.674628-2.353553 18.112122-8.083941 31.926451-17.60048h-73.47177c-9.516538 0-20.056361 0.511642-31.005496 1.432597 0.511642-2.865194 0.920955-5.218747 0.920956-7.674628 0.511642-1.944239 0.511642-3.376836 0.511641-4.809433l-0.511641-2.865194-0.511642-7.674628c-9.516538 5.730389-18.623763 10.437494-26.707705 14.735285l-7.674628 3.78615c-3.376836-6.242031-5.730389-10.02818-7.674627-11.870091-1.330269-0.204657-6.549016-4.502448-14.632957-10.744479zM522.744479 740.448086l7.162986-10.949135c2.353553-3.78615 5.218747-9.516538 8.595583-16.167883s6.651344-16.167882 10.539822-28.549615c3.78615-11.870091 6.242031-28.140302 6.651344-48.094334 0.920955-20.056361 0.920955-34.791646 1.432597-44.819826V568.536425L555.182572 525.660837c18.112122 0.920955 28.651944 1.432597 32.438094 1.432598h71.629859c-2.353553-5.730389-5.218747-11.870091-8.595583-18.623764l-4.297792-7.674628c8.083941-1.432597 17.191166-4.297792 26.707705-8.595583l11.972419 35.303288h36.224243c10.02818 0 27.62866-0.511642 52.494454-1.944239-0.511642 3.376836-0.920955 5.730389-0.920956 7.674628v4.297791c0 0.920955 0.511642 4.809433 1.432598 10.949136-11.972419 0-22.409913-0.511642-32.438094-0.920955-10.02818-0.511642-16.679524-0.511642-20.568002-0.511642h-140.803837V578.87159h43.387229v-8.083941c0-3.78615 0-6.651344-0.511642-8.595583l-0.920956-9.004897c6.242031 0.920955 10.02818 1.432597 10.949136 1.432597s5.730389-0.511642 13.405016-1.432597c-0.920955 4.297792-0.920955 7.162986-1.432597 9.516538v15.758569h58.736485v-6.24203c0-5.218747 0-8.595583-0.511642-10.02818l-0.920955-9.004897c6.651344 0.920955 10.949136 1.432597 12.381732 1.432597 1.432597 0 5.730389-0.511642 12.893375-1.432597-0.920955 4.297792-0.920955 7.162986-1.432597 9.516538v15.758569h20.568002c9.516538 0 20.568002-0.511642 31.926452-1.432597-0.511642 3.376836-0.511642 5.730389-0.511642 7.162986 0 1.432597 0 3.376836-0.511642 4.809434-0.511642 1.432597 0 2.353553 0 2.865194l0.920955 7.674628c-11.460777-0.920955-22.0006-1.432597-31.926451-1.432598H726.582592V616.733087c0 6.651344 0 10.437494 0.511642 12.381733l0.920955 12.893374c-9.107225-0.920955-18.112122-1.432597-26.298391-1.432597h-53.006095c-8.083941 0-16.679524 0.511642-25.78675 1.432597 0.511642-5.218747 0.511642-9.516538 0.920956-12.893374 0-3.376836 0.511642-7.162986 0.511641-11.460778v-19.544719h-43.89887c0 6.242031-0.511642 12.381733-0.511642 18.623764s-0.920955 15.246927-1.944239 27.62866c-0.920955 11.870091-2.353553 22.409913-3.376836 31.005496-1.432597 8.595583-4.297792 20.056361-8.595584 34.280004-4.297792 14.325972-9.107225 26.707705-13.81433 36.224243l-5.218746 11.460777c-2.865194-2.865194-5.218747-5.218747-7.162986-6.651344-2.762866-2.148896-7.981613-5.525732-17.088838-10.232837z m53.517737-9.107225c23.433197 0 48.196662-5.218747 74.495054-15.758569-8.083941-8.083941-14.325972-14.735285-18.112122-19.544718-3.78615-5.218747-8.083941-12.893375-13.405016-22.409913l-23.433197 1.944239c0.511642-3.376836 0.511642-5.730389 0.511642-7.162986 0-1.432597 0-2.865194 0.511642-4.297792 0-1.432597 0-4.809433-0.920955-10.949135 12.381733 0.920955 24.354152 1.432597 35.303287 1.432597h79.202159c10.949136 0 22.409913-0.511642 34.382332-1.432597-4.809433 9.004897-10.02818 17.60048-15.758569 25.684421-5.730389 8.083941-17.702808 20.056361-34.791646 36.735884 15.758569 6.242031 28.140302 10.437494 37.65684 11.870091 9.107225 1.432597 16.679524 2.353553 22.921555 2.865195l16.679525 0.920955 8.083941 0.920955c-3.376836 3.376836-9.107225 10.437494-16.679524 20.465674l-3.78615 7.162986-9.107225-2.865194c-0.511642 0-8.083941-1.944239-22.921555-6.242031-14.837614-4.297792-32.438093-11.460777-53.415409-21.898271-27.62866 12.381733-53.927051 21.488958-79.202159 26.707705l-9.107225 1.944239c-1.944239-2.353553-3.376836-4.809433-4.809433-7.674628-1.432597-2.865194-2.353553-4.297792-2.865194-5.218747l-4.297792-5.730389-6.651344-8.083941h9.516538v0.61397z m126.887179-57.610872h-58.736484c2.865194 6.242031 6.242031 11.460777 10.02818 16.167882 3.78615 4.809433 9.516538 9.516538 16.679525 14.735286 5.218747-2.865194 10.02818-6.242031 14.837613-10.02818 4.809433-3.274508 10.539822-10.437494 17.191166-20.874988z m-56.792245-50.550215h58.736484v-25.275107h-58.736484v25.275107z" fill="" ></path></symbol><symbol id="icon-shuzishunxu" viewBox="0 0 1024 1024"><path d="M862.138182 252.16h-523.636364a34.909091 34.909091 0 0 1 0-69.818182h523.636364a34.909091 34.909091 0 0 1 0 69.818182z m0 290.909091h-523.636364a34.909091 34.909091 0 0 1 0-69.818182h523.636364a34.909091 34.909091 0 0 1 0 69.818182z m0 290.909091h-523.636364a34.909091 34.909091 0 0 1 0-69.818182h523.636364a34.909091 34.909091 0 0 1 0 69.818182zM149.178182 294.865455V139.636364h43.962182v155.229091h-43.985455z m76.776727 247.854545v44.916364H125.626182l50.059636-93.323637c2.304-4.352 3.490909-8.075636 3.490909-11.170909 0-5.748364-3.584-8.610909-10.682182-8.610909a10.100364 10.100364 0 0 0-10.496 10.24 12.334545 12.334545 0 0 0 3.956364 8.843636l-19.781818 35.374546C124.951273 517.818182 116.363636 502.458182 116.363636 482.909091c0-14.894545 5.236364-27.671273 15.685819-38.283636a51.688727 51.688727 0 0 1 38.260363-15.941819c15.383273 0 28.229818 5.376 38.562909 16.174546 10.309818 10.775273 15.453091 23.458909 15.453091 38.050909 0 8.541091-1.908364 16.523636-5.818182 23.970909L200.145455 542.72h25.809454z m-95.976727 177.431273h82.129454l-25.134545 59.810909c8.843636 6.050909 15.36 12.730182 19.549091 20.014545 4.189091 7.307636 6.283636 15.988364 6.283636 26.088728 0 15.499636-5.376 28.043636-16.174545 37.585454-10.775273 9.541818-24.692364 14.312727-41.774546 14.312727a92.858182 92.858182 0 0 1-25.367272-3.723636v-43.752727c6.842182 3.072 13.032727 4.608 18.618181 4.608 5.445818 0 9.658182-1.536 12.683637-4.724364 3.025455-3.165091 4.561455-7.726545 4.561454-13.637818a18.152727 18.152727 0 0 0-8.029091-15.36c-5.376-3.863273-12.520727-5.818182-21.527272-5.818182l11.380363-30.487273h-17.221818v-44.916363z" fill="#797979" ></path></symbol><symbol id="icon-Group-" viewBox="0 0 1024 1024"><path d="M160 352a32 32 0 0 1-32-32V192a32 32 0 0 1 32-32h128a32 32 0 0 1 32 32v128a32 32 0 0 1-32 32z m32-64h64V224H192zM416 288a32 32 0 0 1 0-64h448a32 32 0 0 1 0 64zM160 608a32 32 0 0 1-32-32v-128a32 32 0 0 1 32-32h128a32 32 0 0 1 32 32v128a32 32 0 0 1-32 32z m32-64h64v-64H192zM416 544a32 32 0 0 1 0-64h448a32 32 0 0 1 0 64zM160 864a32 32 0 0 1-32-32v-128a32 32 0 0 1 32-32h128a32 32 0 0 1 32 32v128a32 32 0 0 1-32 32z m32-64h64v-64H192zM416 800a32 32 0 0 1 0-64h448a32 32 0 0 1 0 64z" ></path></symbol><symbol id="icon-riqi" viewBox="0 0 1024 1024"><path d="M819.6 202.6H700.7v-63.8c0-17.6-14.3-31.9-31.9-31.9-17.6 0-31.9 14.3-31.9 31.9v63.8h-255v-63.8c0-17.6-14.3-31.9-31.9-31.9s-31.9 14.3-31.9 31.9v63.8H199.3C140.7 202.6 93 250.3 93 308.9v504.8C93 872.3 140.7 920 199.3 920h620.3c58.6 0 106.3-47.7 106.3-106.3V308.9c0-58.6-47.7-106.3-106.3-106.3z m42.5 611.1c0 23.4-19.1 42.5-42.5 42.5H199.3c-23.4 0-42.5-19.1-42.5-42.5V308.9c0-23.4 19.1-42.5 42.5-42.5h118.8v47.8c0 17.6 14.3 31.9 31.9 31.9s31.9-14.3 31.9-31.9v-47.8H637v47.8c0 17.6 14.3 31.9 31.9 31.9 17.6 0 31.9-14.3 31.9-31.9v-47.8h118.8c23.4 0 42.5 19.1 42.5 42.5v504.8z" ></path><path d="M340.1 409.9H238c-12.9 0-23.4 10.5-23.4 23.4v87.6c0 12.9 10.5 23.4 23.4 23.4h102.1c12.9 0 23.4-10.5 23.4-23.4v-87.6c0-12.9-10.5-23.4-23.4-23.4zM560.5 409.9H458.4c-12.9 0-23.4 10.5-23.4 23.4v87.6c0 12.9 10.5 23.4 23.4 23.4h102.1c12.9 0 23.4-10.5 23.4-23.4v-87.6c0-12.9-10.5-23.4-23.4-23.4zM781 409.9H678.8c-12.9 0-23.4 10.5-23.4 23.4v87.6c0 12.9 10.5 23.4 23.4 23.4H781c12.9 0 23.4-10.5 23.4-23.4v-87.6c0-12.9-10.6-23.4-23.4-23.4zM340.1 632.9H238c-12.9 0-23.4 10.5-23.4 23.4v87.6c0 12.9 10.5 23.4 23.4 23.4h102.1c12.9 0 23.4-10.5 23.4-23.4v-87.6c0-12.9-10.5-23.4-23.4-23.4zM560.5 632.9H458.4c-12.9 0-23.4 10.5-23.4 23.4v87.6c0 12.9 10.5 23.4 23.4 23.4h102.1c12.9 0 23.4-10.5 23.4-23.4v-87.6c0-12.9-10.5-23.4-23.4-23.4zM781 632.9H678.8c-12.9 0-23.4 10.5-23.4 23.4v87.6c0 12.9 10.5 23.4 23.4 23.4H781c12.9 0 23.4-10.5 23.4-23.4v-87.6c0-12.9-10.6-23.4-23.4-23.4z" ></path></symbol><symbol id="icon-zuoce-qujian" viewBox="0 0 1024 1024"><path d="M915.456 198.656c-49.3568 0-90.9312 32.768-104.0384 77.824h-195.1744c-13.312-45.056-54.8864-77.824-104.0384-77.824-49.3568 0-90.9312 32.768-104.0384 77.824H30.72c-16.9984 0-30.72 13.7216-30.72 30.72s13.7216 30.72 30.72 30.72h377.2416c13.312 45.056 54.8864 77.824 104.0384 77.824 49.3568 0 90.9312-32.768 104.0384-77.824h195.1744c13.312 45.056 54.8864 77.824 104.0384 77.824 60.0064 0 108.544-48.5376 108.544-108.544 0.2048-60.0064-48.3328-108.544-108.3392-108.544z m-403.456 155.648c-26.0096 0-47.104-21.0944-47.104-47.104s21.0944-47.104 47.104-47.104 47.104 21.0944 47.104 47.104-21.0944 47.104-47.104 47.104z m403.456 0c-26.0096 0-47.104-21.0944-47.104-47.104s21.0944-47.104 47.104-47.104 47.104 21.0944 47.104 47.104-21.0944 47.104-47.104 47.104zM993.28 686.08H616.0384c-13.312-45.056-54.8864-77.824-104.0384-77.824-49.3568 0-90.9312 32.768-104.0384 77.824h-193.1264c-13.312-45.056-54.8864-77.824-104.0384-77.824-55.7056 0-101.376 41.7792-107.7248 95.6416-1.8432 3.8912-2.8672 8.192-2.8672 12.9024s1.024 9.0112 2.8672 12.9024C9.216 783.5648 54.8864 825.344 110.592 825.344c49.3568 0 90.9312-32.768 104.0384-77.824h193.1264c13.312 45.056 54.8864 77.824 104.0384 77.824 49.3568 0 90.9312-32.768 104.0384-77.824H993.28c16.9984 0 30.72-13.7216 30.72-30.72s-13.7216-30.72-30.72-30.72zM110.592 763.904c-26.0096 0-47.104-21.0944-47.104-47.104s21.0944-47.104 47.104-47.104 47.104 21.0944 47.104 47.104-21.0944 47.104-47.104 47.104z m401.408 0c-26.0096 0-47.104-21.0944-47.104-47.104s21.0944-47.104 47.104-47.104 47.104 21.0944 47.104 47.104-21.0944 47.104-47.104 47.104z" fill="#646464" ></path></symbol><symbol id="icon-liebiao" viewBox="0 0 1024 1024"><path d="M92.5 573.1h179.4c16.5 0 29.9-13.4 29.9-29.9s-13.4-29.9-29.9-29.9H92.5c-16.5 0-29.9 13.4-29.9 29.9s13.4 29.9 29.9 29.9zM950.9 823L848 720c31.9-40.7 51.7-91.2 51.7-146.9 0-132.1-107.1-239.2-239.2-239.2S421.3 441 421.3 573.1s107.1 239.2 239.2 239.2c55.7 0 106.3-19.9 146.9-51.7l103 103c11.2 11.2 29.3 11.2 40.5 0 11.2-11.3 11.2-29.4 0-40.6zM788.7 698.3c-0.5 0.5-1.3 0.7-1.7 1.2-0.5 0.5-0.7 1.3-1.2 1.7-32.4 31.6-76.4 51.2-125.3 51.2-99.1 0-179.4-80.3-179.4-179.4 0-99.1 80.3-179.4 179.4-179.4S839.9 474 839.9 573.1c0.1 48.8-19.6 92.9-51.2 125.2z m-696.2-484h538.2c16.5 0 29.9-13.4 29.9-29.9s-13.4-29.9-29.9-29.9H92.5c-16.5 0-29.9 13.4-29.9 29.9s13.4 29.9 29.9 29.9z m239.2 119.6H92.5c-16.5 0-29.9 13.4-29.9 29.9s13.4 29.9 29.9 29.9h239.2c16.5 0 29.9-13.4 29.9-29.9s-13.4-29.9-29.9-29.9z m0 358.8H92.5c-16.5 0-29.9 13.4-29.9 29.9s13.4 29.9 29.9 29.9h239.2c16.5 0 29.9-13.4 29.9-29.9s-13.4-29.9-29.9-29.9z m0 0" ></path></symbol><symbol id="icon-xialakuang" viewBox="0 0 1024 1024"><path d="M970.105263 404.210526H53.894737v-323.368421h916.210526v323.368421z m-862.315789-53.894737h808.421052v-215.578947H107.789474v215.578947z" fill="#444A5C" ></path><path d="M970.105263 943.157895H53.894737v-592.842106h916.210526v592.842106z m-862.315789-53.894737h808.421052v-485.052632H107.789474v485.052632zM754.526316 307.2L662.905263 215.578947l37.726316-37.726315 53.894737 53.894736 53.894737-53.894736 37.726315 37.726315z" fill="#444A5C" ></path><path d="M264.084211 781.473684h485.052631v-53.894737h-485.052631v53.894737z m0-107.789473h485.052631v-53.894737h-485.052631v53.894737z m0-161.684211v53.894737h485.052631v-53.894737h-485.052631z" fill="#444A5C" ></path></symbol><symbol id="icon-xialashu" viewBox="0 0 1024 1024"><path d="M970.105263 323.368421H53.894737V53.894737h916.210526v269.473684zM107.789474 269.473684h808.421052V107.789474H107.789474v161.68421zM215.578947 538.947368H53.894737V377.263158h161.68421v161.68421zM107.789474 485.052632h53.894737V431.157895H107.789474v53.894737z" fill="#444A5C" ></path><path d="M269.473684 431.157895h431.157895v53.894737H269.473684V431.157895zM538.947368 646.736842h431.157895v53.894737h-431.157895v-53.894737zM538.947368 862.315789h431.157895v53.894737h-431.157895v-53.894737zM107.789474 485.052632h53.894737v431.157894H107.789474V485.052632zM161.684211 700.631579v-53.894737h161.68421v53.894737H161.684211M161.684211 916.210526v-53.894737h161.68421v53.894737H161.684211" fill="#444A5C" ></path><path d="M485.052632 754.526316H323.368421v-161.684211h161.684211v161.684211z m-107.789474-53.894737h53.894737v-53.894737H377.263158v53.894737zM485.052632 970.105263H323.368421v-161.68421h161.684211v161.68421z m-107.789474-53.894737h53.894737v-53.894737H377.263158v53.894737z" fill="#444A5C" ></path><path d="M754.526316 161.684211h107.789473v53.894736h-107.789473V161.684211z" fill="#444A5C" ></path></symbol><symbol id="icon-zhongzhi" viewBox="0 0 1024 1024"><path d="M624.593455 23.272727a93.090909 93.090909 0 0 1 93.090909 93.090909v168.587637l143.406545 0.023272a116.363636 116.363636 0 0 1 116.247273 111.313455l0.116363 5.050182V861.090909a116.363636 116.363636 0 0 1-116.363636 116.363636H162.909091a116.363636 116.363636 0 0 1-116.363636-116.363636V401.338182a116.363636 116.363636 0 0 1 116.363636-116.363637l146.664727-0.023272V116.363636a93.090909 93.090909 0 0 1 88.459637-92.974545l4.654545-0.116364zM139.636364 581.818182v279.272727a23.272727 23.272727 0 0 0 23.272727 23.272727h302.545454v-162.909091a46.545455 46.545455 0 1 1 93.09091 0v162.909091h93.090909v-162.909091a46.545455 46.545455 0 1 1 93.090909 0v162.909091h116.363636a23.272727 23.272727 0 0 0 23.272727-23.272727V581.818182H139.636364z m0-93.090909h744.727272v-87.389091a23.272727 23.272727 0 0 0-23.272727-23.272727h-166.679273a69.818182 69.818182 0 0 1-69.818181-69.818182V116.363636h-221.905455v191.883637a69.818182 69.818182 0 0 1-69.818182 69.818182H162.909091a23.272727 23.272727 0 0 0-23.272727 23.272727V488.727273z" ></path></symbol><symbol id="icon-ri" viewBox="0 0 1024 1024"><path d="M408.222897 789.115586v-35.345655h217.15862v34.886621h33.474207V388.378483h-283.68331v400.737103h33.050483z m217.15862-237.779862h-217.15862v-130.824827h217.15862v130.824827z m0 170.301793h-217.15862v-138.169379h217.15862v138.169379z" ></path><path d="M917.645241 144.772414a70.62069 70.62069 0 0 1 70.62069 70.620689v681.489656a70.62069 70.62069 0 0 1-70.62069 70.620689H94.384552a70.62069 70.62069 0 0 1-70.62069-70.620689V215.393103a70.62069 70.62069 0 0 1 70.62069-70.620689h823.260689z m0 45.903448H94.384552a24.717241 24.717241 0 0 0-24.50538 21.362759l-0.211862 3.354482v681.489656a24.717241 24.717241 0 0 0 21.362759 24.505379l3.354483 0.211862h823.260689a24.717241 24.717241 0 0 0 24.50538-21.362759l0.211862-3.354482V215.393103a24.717241 24.717241 0 0 0-21.362759-24.505379l-3.354483-0.211862z" ></path><path d="M312.214069 31.249655a22.951724 22.951724 0 0 1 22.704552 19.561931l0.247172 3.389793v180.824276a22.951724 22.951724 0 0 1-45.656276 3.389793l-0.247172-3.389793v-180.788965a22.951724 22.951724 0 0 1 22.951724-22.951724zM691.023448 31.249655a22.951724 22.951724 0 0 1 22.704552 19.561931l0.247172 3.389793v180.824276a22.951724 22.951724 0 0 1-45.656275 3.389793l-0.247173-3.389793v-180.788965a22.951724 22.951724 0 0 1 22.951724-22.951724z" ></path></symbol><symbol id="icon-nian" viewBox="0 0 1024 1024"><path d="M715.702857 32.365714a23.771429 23.771429 0 0 1 23.515429 20.260572l0.256 3.510857V149.942857l210.944 0.036572a73.142857 73.142857 0 0 1 73.142857 73.142857v705.828571a73.142857 73.142857 0 0 1-73.142857 73.142857H97.755429a73.142857 73.142857 0 0 1-73.142858-73.142857V223.085714a73.142857 73.142857 0 0 1 73.142858-73.142857h201.837714V56.100571a23.771429 23.771429 0 0 1 47.286857-3.510857l0.256 3.510857V149.942857h344.795429V56.137143a23.771429 23.771429 0 0 1 23.771428-23.771429zM299.593143 197.485714l-201.874286 0.036572a25.6 25.6 0 0 0-25.344 22.125714l-0.219428 3.474286v705.828571a25.6 25.6 0 0 0 22.125714 25.380572l3.474286 0.219428h852.662857a25.6 25.6 0 0 0 25.380571-22.125714l0.219429-3.474286V223.085714a25.6 25.6 0 0 0-22.125715-25.380571l-3.474285-0.219429H739.474286v45.933715a23.771429 23.771429 0 0 1-47.286857 3.510857l-0.256-3.510857V197.485714H347.136v45.970286a23.771429 23.771429 0 0 1-47.286857 3.510857l-0.256-3.510857V197.485714z m112.274286 181.504l35.657142 6.656c-5.229714 18.066286-11.410286 34.706286-18.066285 50.870857h295.241143v33.28h-149.284572v76.068572h132.644572v32.804571h-132.644572v102.692572h164.498286v33.28h-164.498286v106.020571h-34.706286V714.605714H321.097143v-33.28h78.445714v-135.497143h141.202286v-76.068571h-127.890286a285.805714 285.805714 0 0 1-75.117714 84.626286l-22.820572-28.525715c48.018286-36.132571 80.347429-85.101714 96.987429-146.907428z m128.841142 199.68H433.737143v102.692572h106.971428v-102.692572z" ></path></symbol><symbol id="icon-yue" viewBox="0 0 1024 1024"><path d="M371.959172 792.328828c29.837241-39.017931 47.315862-88.134621 52.788966-147.809104h197.843862v91.347862c0 13.312-5.508414 20.197517-16.066207 20.197517-17.44331 0-36.722759-0.918069-57.838345-1.836137l9.18069 32.591448h59.215448c25.705931 0 39.017931-13.312 39.017931-39.476966V388.378483h-263.026758v224.008827c-0.918069 63.346759-16.066207 115.67669-46.362483 156.989793l25.246896 22.951725z m250.632828-291.945931h-195.972414v-80.331035h195.972414v80.331035z m0 113.381517h-195.972414v-82.626207h195.972414v82.626207z" ></path><path d="M917.645241 144.772414a70.62069 70.62069 0 0 1 70.62069 70.620689v681.489656a70.62069 70.62069 0 0 1-70.62069 70.620689H94.384552a70.62069 70.62069 0 0 1-70.62069-70.620689V215.393103a70.62069 70.62069 0 0 1 70.62069-70.620689h823.260689z m0 45.903448H94.384552a24.717241 24.717241 0 0 0-24.50538 21.362759l-0.211862 3.354482v681.489656a24.717241 24.717241 0 0 0 21.362759 24.505379l3.354483 0.211862h823.260689a24.717241 24.717241 0 0 0 24.50538-21.362759l0.211862-3.354482V215.393103a24.717241 24.717241 0 0 0-21.362759-24.505379l-3.354483-0.211862z" ></path><path d="M312.214069 31.249655a22.951724 22.951724 0 0 1 22.704552 19.561931l0.247172 3.389793v180.824276a22.951724 22.951724 0 0 1-45.656276 3.389793l-0.247172-3.389793v-180.788965a22.951724 22.951724 0 0 1 22.951724-22.951724zM691.023448 31.249655a22.951724 22.951724 0 0 1 22.704552 19.561931l0.247172 3.389793v180.824276a22.951724 22.951724 0 0 1-45.656275 3.389793l-0.247173-3.389793v-180.788965a22.951724 22.951724 0 0 1 22.951724-22.951724z" ></path></symbol></svg>',e=(e=document.getElementsByTagName("script"))[e.length-1].getAttribute("data-injectcss");if(e&&!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 z(){t||(t=!0,l())}h=function(){var c,h,a;(a=document.createElement("div")).innerHTML=i,i=null,(h=a.getElementsByTagName("svg")[0])&&(h.setAttribute("aria-hidden","true"),h.style.position="absolute",h.style.width=0,h.style.height=0,h.style.overflow="hidden",c=h,(a=document.body).firstChild?(h=a.firstChild).parentNode.insertBefore(c,h):a.appendChild(c))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(h,0):(a=function(){document.removeEventListener("DOMContentLoaded",a,!1),h()},document.addEventListener("DOMContentLoaded",a,!1)):document.attachEvent&&(l=h,v=c.document,t=!1,(o=function(){try{v.documentElement.doScroll("left")}catch(c){return void setTimeout(o,50)}z()})(),v.onreadystatechange=function(){"complete"==v.readyState&&(v.onreadystatechange=null,z())})}(window);
\ No newline at end of file
frontend/src/styles/deicon/iconfont.json 0 → 100644
浏览文件 @ 17dd2dbe
{
"id": "2459092",
"name": "DataEase",
"font_family": "iconfont",
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "2404485",
"name": "矩形",
"font_class": "juxing",
"unicode": "e648",
"unicode_decimal": 58952
},
{
"icon_id": "924549",
"name": "text",
"font_class": "text",
"unicode": "e959",
"unicode_decimal": 59737
},
{
"icon_id": "5994104",
"name": "picture",
"font_class": "picture",
"unicode": "e643",
"unicode_decimal": 58947
},
{
"icon_id": "4016505",
"name": "输入",
"font_class": "shuru",
"unicode": "e6ab",
"unicode_decimal": 59051
},
{
"icon_id": "16852593",
"name": "树",
"font_class": "tree",
"unicode": "e628",
"unicode_decimal": 58920
},
{
"icon_id": "17407748",
"name": "查询搜索",
"font_class": "chaxunsousuo",
"unicode": "e615",
"unicode_decimal": 58901
},
{
"icon_id": "1281301",
"name": "季度",
"font_class": "jidu",
"unicode": "e624",
"unicode_decimal": 58916
},
{
"icon_id": "4553739",
"name": "数字顺序",
"font_class": "shuzishunxu",
"unicode": "e7de",
"unicode_decimal": 59358
},
{
"icon_id": "4685765",
"name": "树列表",
"font_class": "Group-",
"unicode": "e6a6",
"unicode_decimal": 59046
},
{
"icon_id": "4770736",
"name": "日期",
"font_class": "riqi",
"unicode": "e639",
"unicode_decimal": 58937
},
{
"icon_id": "4878484",
"name": "左侧-区间",
"font_class": "zuoce-qujian",
"unicode": "e6dd",
"unicode_decimal": 59101
},
{
"icon_id": "6056156",
"name": "列表",
"font_class": "liebiao",
"unicode": "e66f",
"unicode_decimal": 58991
},
{
"icon_id": "10907065",
"name": "下拉框",
"font_class": "xialakuang",
"unicode": "e8ca",
"unicode_decimal": 59594
},
{
"icon_id": "10908304",
"name": "下拉树",
"font_class": "xialashu",
"unicode": "e8d0",
"unicode_decimal": 59600
},
{
"icon_id": "12978136",
"name": "重置",
"font_class": "zhongzhi",
"unicode": "e611",
"unicode_decimal": 58897
},
{
"icon_id": "16197990",
"name": "日",
"font_class": "ri",
"unicode": "e691",
"unicode_decimal": 59025
},
{
"icon_id": "16197997",
"name": "年",
"font_class": "nian",
"unicode": "e692",
"unicode_decimal": 59026
},
{
"icon_id": "16198002",
"name": "月",
"font_class": "yue",
"unicode": "e695",
"unicode_decimal": 59029
}
]
}
frontend/src/views/panel/AssistComponent/index.vue
浏览文件 @ 17dd2dbe
......@@ -4,7 +4,7 @@
<div class="widget-subject">
<div class="filter-header">
<div class="filter-header-text"> 样式组件 </div>
<div class="filter-header-text"> 样式 </div>
</div>
<div class="filter-widget-content">
......@@ -24,17 +24,48 @@
</div>
</div>
<div class="widget-subject">
<div class="filter-header">
<div class="filter-header-text">
<span>图片</span>
</div>
</div>
<div class="filter-widget-content">
<div
v-for="(item, index) in pictureList"
:key="index"
:data-id="item.id"
:data-index="index"
:class="'filter-widget '+ (item.defaultClass || '')"
@click="goFile"
>
<div class="filter-widget-icon">
<i :class="(item.icon || 'el-icon-setting') + ' widget-icon-i'" />
</div>
<div class="filter-widget-text">{{ item.label }}</div>
</div>
</div>
</div>
<input id="input" ref="files" type="file" hidden @change="handleFileChange">
</div>
</template>
<script>
import { assistList } from '@/components/canvas/custom-component/component-list'
import { assistList, pictureList } from '@/components/canvas/custom-component/component-list'
import toast from '@/components/canvas/utils/toast'
import { commonStyle, commonAttr } from '@/components/canvas/custom-component/component-list'
import generateID from '@/components/canvas/utils/generateID'
export default {
name: 'FilterGroup',
data() {
return {
assistList
assistList,
pictureList
}
},
......@@ -46,6 +77,51 @@ export default {
id: ev.target.dataset.id
}
ev.dataTransfer.setData('componentInfo', JSON.stringify(dataTrans))
},
goFile() {
this.$refs.files.click()
},
handleFileChange(e) {
const file = e.target.files[0]
if (!file.type.includes('image')) {
toast('只能插入图片')
return
}
const reader = new FileReader()
reader.onload = (res) => {
const fileResult = res.target.result
const img = new Image()
img.onload = () => {
const scaleWith = img.width / 400
const scaleHeight = img.height / 200
let scale = scaleWith > scaleHeight ? scaleWith : scaleHeight
scale = scale > 1 ? scale : 1
this.$store.commit('addComponent', {
component: {
...commonAttr,
id: generateID(),
component: 'Picture',
label: '图片',
icon: '',
propValue: fileResult,
style: {
...commonStyle,
top: 0,
left: 500,
width: img.width / scale,
height: img.height / scale
}
}
})
this.$store.commit('recordSnapshot')
}
img.src = fileResult
}
reader.readAsDataURL(file)
}
}
}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论