提交

UI/图标/上.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="59px" height="59px" viewBox="0 0 59 59" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>B44370FF-54B0-45C4-81E5-211BEB27D864</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="场景添加" transform="translate(-92.000000, -23.000000)">
+            <g id="调试">
+                <g transform="translate(12.000000, 15.000000)">
+                    <g id="箭头" transform="translate(109.500000, 37.500000) scale(-1, -1) rotate(-90.000000) translate(-109.500000, -37.500000) translate(81.000000, 9.000000)">
+                        <rect id="矩形" stroke="#3BB7FF" fill="#FFFFFF" x="0" y="0" width="57" height="57" rx="3"></rect>
+                        <polygon id="路径" fill="#3BB7FF" points="49.75 51.6 28.375 28.7999742 49.75 6 28.3750519 6 7 28.7999742 28.375 51.6"></polygon>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/下.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="59px" height="59px" viewBox="0 0 59 59" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>95358D87-6352-4F6D-BCC9-AFDDFC8BF0ED</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="场景添加" transform="translate(-92.000000, -166.000000)">
+            <g id="调试">
+                <g transform="translate(12.000000, 15.000000)">
+                    <g id="箭头备份-6" transform="translate(109.500000, 180.500000) scale(-1, 1) rotate(-90.000000) translate(-109.500000, -180.500000) translate(81.000000, 152.000000)">
+                        <rect id="矩形" stroke="#E5E5E5" fill="#FFFFFF" x="-9.25735679e-14" y="0" width="57" height="57" rx="3"></rect>
+                        <polygon id="路径" fill="#CCCCCC" points="49.75 51.6 28.375 28.7999742 49.75 6 28.3750519 6 7 28.7999742 28.375 51.6"></polygon>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/保存 面性.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>C6A9C4C1-B06C-4657-8F3D-79FC249051D5</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="配置" transform="translate(0.000000, -1.000000)" fill="#6783E3" fill-rule="nonzero">
+            <g id="保存-面性">
+                <g>
+                    <g transform="translate(0.000000, 1.000000)">
+                        <path d="M2.33333409,0 L2.33333409,5.27707236 C2.33333409,5.71293901 2.75100128,6.06667266 3.26666796,6.06667266 L10.7333356,6.06667266 C11.2490023,6.06667266 11.6666695,5.71293901 11.6666695,5.27707236 L11.6666695,0 L11.6666694,0 C12.9553349,0 14,1.04467001 14,2.33333059 C14,2.33333059 14,2.33333062 14,2.33333062 L14,11.6666694 L14,11.6666694 C14,12.9553349 12.95533,14 11.6666694,14 C11.6666694,14 11.6666694,14 11.6666694,14 L2.33333069,14 L2.33333057,14 C1.04466508,14 0,12.95533 0,11.6666694 C0,11.6666694 0,11.6666694 0,11.6666694 L0,2.33333061 L0,2.33333094 C0,1.04466544 1.04466837,0 2.33333057,0 C2.33333057,0 2.33333061,0 2.33333061,0 L2.33333409,0 Z M3.26666796,0 L10.7333356,0 L10.7333356,5.13333714 L3.26666796,5.13333714 L3.26666796,0 Z M9.33334058,1.86667104 L9.33334056,1.86667104 C9.07560812,1.86667104 8.86667444,2.07560471 8.86667444,2.33333715 C8.86667444,2.33333716 8.86667444,2.33333717 8.86667444,2.33333717 L8.86667444,3.73333716 L8.86667444,3.73333724 C8.86667444,3.99106968 9.07560812,4.20000335 9.33334056,4.20000335 C9.591073,4.20000335 9.80000667,3.99106968 9.80000667,3.73333724 L9.80000667,2.33333724 L9.80000667,2.33333722 C9.80000667,2.07560478 9.591073,1.86667104 9.33334056,1.86667104 C9.33334055,1.86667104 9.33334054,1.86667104 9.33334053,1.86667104 L9.33334058,1.86667104 Z" id="Shape"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/分析.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="27px" height="27px" viewBox="0 0 27 27" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>ABC03856-1ED0-4C19-B2B7-212EEB1446B7</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="首页" transform="translate(-309.000000, -139.000000)" fill="#FF9630" fill-rule="nonzero">
+            <g id="分析" transform="translate(309.000000, 139.000000)">
+                <path d="M7.49906617,27 L7.49906617,27 C7.03310039,26.9926338 6.66136321,26.6109893 6.66866159,26.1475739 C6.67600709,25.6947988 7.04313258,25.3293926 7.49839381,25.3218337 L19.5004856,25.3218337 L19.5004856,25.3218337 C19.9664486,25.3293868 20.3380289,25.7111815 20.3305484,26.1745941 C20.3230137,26.6273608 19.955744,26.9926222 19.5004856,27 L7.49906615,27 L7.49906617,27 Z M23.6247479,0 L3.37502802,0 C1.51101925,0 0,1.50274902 0,3.35655555 L0,18.855243 C0,20.7090495 1.51101925,22.2117985 3.37502802,22.2117985 L23.624972,22.2117985 C25.4889808,22.2117985 27,20.7090495 27,18.855243 L27,3.35655555 C27,1.50274902 25.4887566,0 23.6247479,0 Z M22.3929825,6.86088959 L15.8860971,14.4733766 C15.8439624,14.5237506 15.8439624,14.5237506 15.7982419,14.5674377 L15.7982419,14.5674377 C15.324233,15.0131442 14.5767189,14.9924903 14.1283213,14.5212987 L14.127649,14.52063 L10.4538686,10.6520878 L5.81681898,14.8358017 L5.81681901,14.8358017 C5.46475399,15.1392769 4.93197794,15.1014474 4.62683251,14.7513085 C4.3315904,14.4125325 4.35632432,13.9027691 4.68299455,13.5938385 L9.68804971,9.076007 L9.68804965,9.07600705 C10.1642045,8.64496694 10.8997646,8.67262805 11.3418335,9.13819438 L14.9665316,12.9579229 L21.1072045,5.77339177 L21.1072045,5.77339176 C21.4145799,5.42486132 21.9478546,5.39013448 22.2983032,5.69582895 C22.6412129,5.99494666 22.6831402,6.51088697 22.3929833,6.86088851 L22.3929825,6.86088959 Z" id="Shape"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/删 除 (2).svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="12px" height="16px" viewBox="0 0 12 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>38F29E3A-4242-45CD-8CC5-F63F796D536F</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="配置" transform="translate(-42.000000, 0.000000)" fill="#F2284F" fill-rule="nonzero">
+            <g id="删-除">
+                <g>
+                    <g transform="translate(42.000000, 0.000000)">
+                        <path d="M10.2654594,1.95458005 L1.46202698,1.95458005 C0.656740486,1.95458005 0,2.61132054 0,3.42442621 L0,3.90916163 L11.7274803,3.90916163 L11.7274803,3.41660703 C11.7274803,2.61132054 11.0707414,1.95458005 10.2654533,1.95458005 L10.2654594,1.95458005 Z M7.70104479,0.977290026 L7.91995727,2.51750571 L3.8075261,2.51750571 L4.02643857,0.977290026 L7.70105396,0.977290026 L7.70104479,0.977290026 Z M7.81832876,0 L3.90916866,0 C3.50261583,0 3.12733664,0.328370243 3.07260852,0.727103902 L2.7833311,2.7755049 C2.72860283,3.17424008 3.01006275,3.5026088 3.41661559,3.5026088 L8.30306572,3.5026088 C8.70961855,3.5026088 8.99107832,3.17423855 8.9363502,2.7755049 L8.64707278,0.727103902 C8.60016277,0.328368715 8.22488313,0 7.81833029,0 L7.81832876,0 Z M10.5078334,4.88645013 L1.21966706,4.88645013 C0.680203514,4.88645013 0.281468328,5.32427661 0.328378799,5.86374016 L1.12584764,14.6671726 C1.17275766,15.1988185 1.65749354,15.6444626 2.18913944,15.6444626 L9.52272575,15.6444626 C10.0621893,15.6444626 10.5391071,15.2066362 10.5860175,14.6671726 L11.391304,5.86374016 C11.4460323,5.32427661 11.0472985,4.88645013 10.5078334,4.88645013 L10.5078334,4.88645013 Z M3.90917019,13.6820604 L2.43932556,13.6820604 L1.95459014,6.84103018 L3.90917019,6.84103018 L3.90917019,13.6820604 L3.90917019,13.6820604 Z M6.84104027,13.6820604 L4.88646021,13.6820604 L4.88646021,6.84103018 L6.84104027,6.84103018 L6.84104027,13.6820604 Z M9.28817645,13.6820604 L7.81833182,13.6820604 L7.81833182,6.84103018 L9.77291187,6.84103018 L9.28817645,13.6820604 Z" id="Shape"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/删 除.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="12px" height="16px" viewBox="0 0 12 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>DB87ED2D-0B60-4F5D-9360-22CED3FFCE03</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="操作" transform="translate(-47.000000, -2.000000)" fill="#F2284F" fill-rule="nonzero">
+            <g transform="translate(32.000000, 1.000000)" id="删-除">
+                <g transform="translate(15.000000, 1.000000)">
+                    <path d="M10.2654594,1.95458005 L1.46202698,1.95458005 C0.656740486,1.95458005 0,2.61132054 0,3.42442621 L0,3.90916163 L11.7274803,3.90916163 L11.7274803,3.41660703 C11.7274803,2.61132054 11.0707414,1.95458005 10.2654533,1.95458005 L10.2654594,1.95458005 Z M7.70104479,0.977290026 L7.91995727,2.51750571 L3.8075261,2.51750571 L4.02643857,0.977290026 L7.70105396,0.977290026 L7.70104479,0.977290026 Z M7.81832876,0 L3.90916866,0 C3.50261583,0 3.12733664,0.328370243 3.07260852,0.727103902 L2.7833311,2.7755049 C2.72860283,3.17424008 3.01006275,3.5026088 3.41661559,3.5026088 L8.30306572,3.5026088 C8.70961855,3.5026088 8.99107832,3.17423855 8.9363502,2.7755049 L8.64707278,0.727103902 C8.60016277,0.328368715 8.22488313,0 7.81833029,0 L7.81832876,0 Z M10.5078334,4.88645013 L1.21966706,4.88645013 C0.680203514,4.88645013 0.281468328,5.32427661 0.328378799,5.86374016 L1.12584764,14.6671726 C1.17275766,15.1988185 1.65749354,15.6444626 2.18913944,15.6444626 L9.52272575,15.6444626 C10.0621893,15.6444626 10.5391071,15.2066362 10.5860175,14.6671726 L11.391304,5.86374016 C11.4460323,5.32427661 11.0472985,4.88645013 10.5078334,4.88645013 L10.5078334,4.88645013 Z M3.90917019,13.6820604 L2.43932556,13.6820604 L1.95459014,6.84103018 L3.90917019,6.84103018 L3.90917019,13.6820604 L3.90917019,13.6820604 Z M6.84104027,13.6820604 L4.88646021,13.6820604 L4.88646021,6.84103018 L6.84104027,6.84103018 L6.84104027,13.6820604 Z M9.28817645,13.6820604 L7.81833182,13.6820604 L7.81833182,6.84103018 L9.77291187,6.84103018 L9.28817645,13.6820604 Z" id="Shape"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/右.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="59px" height="59px" viewBox="0 0 59 59" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>07590CBD-DBD3-4120-8968-96849C4E7F49</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="场景添加" transform="translate(-164.000000, -93.000000)">
+            <g id="调试">
+                <g transform="translate(12.000000, 15.000000)">
+                    <g id="箭头备份-5" transform="translate(181.500000, 107.500000) scale(-1, -1) translate(-181.500000, -107.500000) translate(153.000000, 79.000000)">
+                        <rect id="矩形" stroke="#E5E5E5" fill="#FFFFFF" x="0" y="0" width="57" height="57" rx="3"></rect>
+                        <polygon id="路径" fill="#CCCCCC" points="49.75 51.6 28.375 28.7999742 49.75 6 28.3750519 6 7 28.7999742 28.375 51.6"></polygon>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/右上.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="60px" height="59px" viewBox="0 0 60 59" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>5D51B4AD-81EE-458E-AAA5-E644F9AC7E45</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="场景添加" transform="translate(-163.000000, -24.000000)">
+            <g id="调试">
+                <g transform="translate(12.000000, 15.000000)">
+                    <g id="箭头备份-2" transform="translate(185.500000, 34.000000) scale(1, -1) rotate(-90.000000) translate(-185.500000, -34.000000) translate(152.000000, 0.000000)">
+                        <rect id="矩形" stroke="#E5E5E5" fill="#FFFFFF" x="9.80487805" y="0" width="57.195122" height="58.9424364" rx="3"></rect>
+                        <polygon id="路径" fill="#CCCCCC" transform="translate(32.707395, 35.108842) rotate(-45.000000) translate(-32.707395, -35.108842) " points="53.9589928 58.1725426 32.5326639 35.272626 54.6579186 11.7175192 32.8821792 12.0451399 10.7568717 35.6002475 32.1832006 58.500164"></polygon>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/右下.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="59px" height="61px" viewBox="0 0 59 61" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>331CE164-26ED-4252-8AAB-485E3D8DE4A3</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="场景添加" transform="translate(-164.000000, -166.000000)">
+            <g id="调试">
+                <g transform="translate(12.000000, 15.000000)">
+                    <g id="箭头备份-8" transform="translate(186.500000, 186.000000) scale(-1, 1) translate(-186.500000, -186.000000) translate(153.000000, 152.000000)">
+                        <rect id="矩形" stroke="#E5E5E5" fill="#FFFFFF" x="9.80487805" y="0" width="57.195122" height="58.9424364" rx="3"></rect>
+                        <polygon id="路径" fill="#CCCCCC" transform="translate(32.707395, 35.108842) rotate(-45.000000) translate(-32.707395, -35.108842) " points="53.9589928 58.1725426 32.5326639 35.272626 54.6579186 11.7175192 32.8821792 12.0451399 10.7568717 35.6002475 32.1832006 58.500164"></polygon>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/图标/font_1592179_fsameoezhkf/demo.css

+/* 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;
+}

UI/图标/图标/font_1592179_fsameoezhkf/demo_index.html

+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8"/>
+  <title>IconFont Demo</title>
+  <link rel="shortcut icon" href="https://gtms04.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/>
+  <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>
+</head>
+<body>
+  <div class="main">
+    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">&#xe86b;</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=1592179" 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">&#xe600;</span>
+                <div class="name">右</div>
+                <div class="code-name">&amp;#xe600;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe601;</span>
+                <div class="name">右上</div>
+                <div class="code-name">&amp;#xe601;</div>
+              </li>
+          
+            <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">&#xe603;</span>
+                <div class="name">右下</div>
+                <div class="code-name">&amp;#xe603;</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">&#xe605;</span>
+                <div class="name">展示</div>
+                <div class="code-name">&amp;#xe605;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe606;</span>
+                <div class="name">左上</div>
+                <div class="code-name">&amp;#xe606;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe607;</span>
+                <div class="name">下</div>
+                <div class="code-name">&amp;#xe607;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe608;</span>
+                <div class="name">运行路数</div>
+                <div class="code-name">&amp;#xe608;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe609;</span>
+                <div class="name">总量</div>
+                <div class="code-name">&amp;#xe609;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60a;</span>
+                <div class="name">左下</div>
+                <div class="code-name">&amp;#xe60a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60b;</span>
+                <div class="name">定位 位置</div>
+                <div class="code-name">&amp;#xe60b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60c;</span>
+                <div class="name">保存 面性</div>
+                <div class="code-name">&amp;#xe60c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60d;</span>
+                <div class="name">上</div>
+                <div class="code-name">&amp;#xe60d;</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">&#xe60f;</span>
+                <div class="name">导出</div>
+                <div class="code-name">&amp;#xe60f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe610;</span>
+                <div class="name">开启</div>
+                <div class="code-name">&amp;#xe610;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe611;</span>
+                <div class="name">删 除 (2)</div>
+                <div class="code-name">&amp;#xe611;</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">&#xe613;</span>
+                <div class="name">左</div>
+                <div class="code-name">&amp;#xe613;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe614;</span>
+                <div class="name">删 除</div>
+                <div class="code-name">&amp;#xe614;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe615;</span>
+                <div class="name">编组 12</div>
+                <div class="code-name">&amp;#xe615;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe616;</span>
+                <div class="name">编组 14</div>
+                <div class="code-name">&amp;#xe616;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe617;</span>
+                <div class="name">编组 13</div>
+                <div class="code-name">&amp;#xe617;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe618;</span>
+                <div class="name">添加</div>
+                <div class="code-name">&amp;#xe618;</div>
+              </li>
+          
+          </ul>
+          <div class="article markdown">
+          <h2 id="unicode-">Unicode 引用</h2>
+          <hr>
+
+          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
+          <ul>
+            <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li>
+            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
+            <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li>
+          </ul>
+          <blockquote>
+            <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用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.eot');
+  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
+      url('iconfont.woff2') format('woff2'),
+      url('iconfont.woff') format('woff'),
+      url('iconfont.ttf') format('truetype'),
+      url('iconfont.svg#iconfont') format('svg');
+}
+</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 iconyou"></span>
+            <div class="name">
+              右
+            </div>
+            <div class="code-name">.iconyou
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconyoushang"></span>
+            <div class="name">
+              右上
+            </div>
+            <div class="code-name">.iconyoushang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconyichang"></span>
+            <div class="name">
+              异常
+            </div>
+            <div class="code-name">.iconyichang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconyouxia"></span>
+            <div class="name">
+              右下
+            </div>
+            <div class="code-name">.iconyouxia
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzhongzhi"></span>
+            <div class="name">
+              重置
+            </div>
+            <div class="code-name">.iconzhongzhi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzhanshi"></span>
+            <div class="name">
+              展示
+            </div>
+            <div class="code-name">.iconzhanshi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzuoshang"></span>
+            <div class="name">
+              左上
+            </div>
+            <div class="code-name">.iconzuoshang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconxia"></span>
+            <div class="name">
+              下
+            </div>
+            <div class="code-name">.iconxia
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconyunhanglushu"></span>
+            <div class="name">
+              运行路数
+            </div>
+            <div class="code-name">.iconyunhanglushu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzongliang"></span>
+            <div class="name">
+              总量
+            </div>
+            <div class="code-name">.iconzongliang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzuoxia"></span>
+            <div class="name">
+              左下
+            </div>
+            <div class="code-name">.iconzuoxia
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icondingweiweizhi"></span>
+            <div class="name">
+              定位 位置
+            </div>
+            <div class="code-name">.icondingweiweizhi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconbaocunmianxing"></span>
+            <div class="name">
+              保存 面性
+            </div>
+            <div class="code-name">.iconbaocunmianxing
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconshang"></span>
+            <div class="name">
+              上
+            </div>
+            <div class="code-name">.iconshang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconfenxi"></span>
+            <div class="name">
+              分析
+            </div>
+            <div class="code-name">.iconfenxi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icondaochu"></span>
+            <div class="name">
+              导出
+            </div>
+            <div class="code-name">.icondaochu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconkaiqi"></span>
+            <div class="name">
+              开启
+            </div>
+            <div class="code-name">.iconkaiqi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconshanchu"></span>
+            <div class="name">
+              删 除 (2)
+            </div>
+            <div class="code-name">.iconshanchu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icondaoru"></span>
+            <div class="name">
+              导入
+            </div>
+            <div class="code-name">.icondaoru
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzuo"></span>
+            <div class="name">
+              左
+            </div>
+            <div class="code-name">.iconzuo
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconshanchu1"></span>
+            <div class="name">
+              删 除
+            </div>
+            <div class="code-name">.iconshanchu1
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconbianzu"></span>
+            <div class="name">
+              编组 12
+            </div>
+            <div class="code-name">.iconbianzu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconbianzu1"></span>
+            <div class="name">
+              编组 14
+            </div>
+            <div class="code-name">.iconbianzu1
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconbianzu2"></span>
+            <div class="name">
+              编组 13
+            </div>
+            <div class="code-name">.iconbianzu2
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icontianjia"></span>
+            <div class="name">
+              添加
+            </div>
+            <div class="code-name">.icontianjia
+            </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>兼容性良好，支持 IE8+，及所有现代浏览器。</li>
+          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
+          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
+          <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</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 iconxxx"&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="#iconyou"></use>
+                </svg>
+                <div class="name">右</div>
+                <div class="code-name">#iconyou</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconyoushang"></use>
+                </svg>
+                <div class="name">右上</div>
+                <div class="code-name">#iconyoushang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconyichang"></use>
+                </svg>
+                <div class="name">异常</div>
+                <div class="code-name">#iconyichang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconyouxia"></use>
+                </svg>
+                <div class="name">右下</div>
+                <div class="code-name">#iconyouxia</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzhongzhi"></use>
+                </svg>
+                <div class="name">重置</div>
+                <div class="code-name">#iconzhongzhi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzhanshi"></use>
+                </svg>
+                <div class="name">展示</div>
+                <div class="code-name">#iconzhanshi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzuoshang"></use>
+                </svg>
+                <div class="name">左上</div>
+                <div class="code-name">#iconzuoshang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconxia"></use>
+                </svg>
+                <div class="name">下</div>
+                <div class="code-name">#iconxia</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconyunhanglushu"></use>
+                </svg>
+                <div class="name">运行路数</div>
+                <div class="code-name">#iconyunhanglushu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzongliang"></use>
+                </svg>
+                <div class="name">总量</div>
+                <div class="code-name">#iconzongliang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzuoxia"></use>
+                </svg>
+                <div class="name">左下</div>
+                <div class="code-name">#iconzuoxia</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icondingweiweizhi"></use>
+                </svg>
+                <div class="name">定位 位置</div>
+                <div class="code-name">#icondingweiweizhi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconbaocunmianxing"></use>
+                </svg>
+                <div class="name">保存 面性</div>
+                <div class="code-name">#iconbaocunmianxing</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconshang"></use>
+                </svg>
+                <div class="name">上</div>
+                <div class="code-name">#iconshang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconfenxi"></use>
+                </svg>
+                <div class="name">分析</div>
+                <div class="code-name">#iconfenxi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icondaochu"></use>
+                </svg>
+                <div class="name">导出</div>
+                <div class="code-name">#icondaochu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconkaiqi"></use>
+                </svg>
+                <div class="name">开启</div>
+                <div class="code-name">#iconkaiqi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconshanchu"></use>
+                </svg>
+                <div class="name">删 除 (2)</div>
+                <div class="code-name">#iconshanchu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icondaoru"></use>
+                </svg>
+                <div class="name">导入</div>
+                <div class="code-name">#icondaoru</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzuo"></use>
+                </svg>
+                <div class="name">左</div>
+                <div class="code-name">#iconzuo</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconshanchu1"></use>
+                </svg>
+                <div class="name">删 除</div>
+                <div class="code-name">#iconshanchu1</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconbianzu"></use>
+                </svg>
+                <div class="name">编组 12</div>
+                <div class="code-name">#iconbianzu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconbianzu1"></use>
+                </svg>
+                <div class="name">编组 14</div>
+                <div class="code-name">#iconbianzu1</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconbianzu2"></use>
+                </svg>
+                <div class="name">编组 13</div>
+                <div class="code-name">#iconbianzu2</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icontianjia"></use>
+                </svg>
+                <div class="name">添加</div>
+                <div class="code-name">#icontianjia</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>

UI/图标/图标/font_1592179_fsameoezhkf/iconfont.css

+@font-face {font-family: "iconfont";
+  src: url('iconfont.eot?t=1577785849356'); /* IE9 */
+  src: url('iconfont.eot?t=1577785849356#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAA0oAAsAAAAAF7AAAAzYAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCFQAqeFJdgATYCJANcCzAABCAFhG0HggobhBMjETaLtFIi+w8JnA4Z+QuqDkKKYlYUwyYGYVBKZyFRxjqNUrhwMskAw84stsxn+eou87ZwiJ8NpeSBz+7x78zsQyicHkAldVIVV1CXtCndwpW8of73EG7rxjaqtYcjjCKN5GNgNWEFIF9g/zfPR1ZwOWeJhRmeZ1bz6JOUfkUQ3iz//Vnhge7nvd8tumicwJEs7b7u6wIoEmxig+/dduwdsM8IxeAGasrGbkqWbDN1QxdkchmFnlGfByWxh5HUoE5Lag6l0GA4xEecnlcSFICn9o/sVVoNRQLH0brVJORAyYq7bRMfj3vXPi2yu3eKOgV99SLZfJrJHEEOCLO/QK5s/7mCUBVqf3G3AKiAXW0rXDUbpQu1rRqX475pJgURWYjn7ifVKfRNoYy8PQEVNRUFGp2WUwIkGY0CVi2222qBFGmWSUqDcl2RuWymhiYCVDmOIp0Vu8X3D+/VM1CBqJCAdkdjFukbwC0HeQO7PKgiuYGrOYPJlUjoDMgIW9mu9VgPOwtdketCjJNThri88SAXtlLWwcIoyRTWWBI3WlZBRZVUVkVV1VTHw4fQf3kCQl68gVAE2srKEAYPpxsAuTBBIAeRHCRykJGDAjkokoMSuSrKDohgFwTsgYB9EHAAAg5BwBEIOAYBJyDgFAScgYBzKFW4gJJzCSLjCgRcg4AbIHSCuSxdARNR2WEAigOAVrAAp/1X161Opk7XaUhgXGMkLE0WxMAkezG1RSwaxOTxPJkYCKHR2BFJE2wujrDIk+nrg4Uy2XSEy0V6Em8RxKQiGEJjFUwVePlATP9UEY1J86Px5nh15N4eRQW0TZxKUFT/5+WGCvJz4ubbJdCw8l14aunetfrlb0MjfnrI7jf6lKAzYA5SLIM0pJNsjRMPlhMj9UB8sbip6FOA/ZSDEHOAiD7DN+bAmxairV1H4n/Ak77InPcJih8aY24E8cX459gL5uvXvxkuaUg2J3ikpx1+4szFg9bL76fP7zedpXtJYpfGP/dfTVuat7tn3S+oJqMivzT1DdPW+yzo4RNFkHMeiGr8NcDP/W+3/XXOeOyvct6BDr9mZsVclcvGUtlKjz+Pag5HV3E4vfypelJpQfxwfzMvSGxVeBBic2u3fqRp6zZsJMb4zZEMKbG0tjw9N63szV64/8kruDT0laouwjHCMUL2lb1JMOafR3oXoS73lyvI1NjSHgqLg5UGTXNy9RBHEsI5og8czOPo0BnYyYUFeYH83CxxDlA/Qyl1Sd9ER88tDYFMDS/PZ5rF1dEmHmhkZSExUZk6ozFi9Qw06tydVmmK29tfn2Ic3hfIgfo+t3H3MsdtNBu07J6ZuSHAm7VdfUAMJOiLB3xz3HsOB5AHkcqYoDpF9sGYAyknQp4OeVIEyLY6Mn57LOzlm/DU2T0QoeWC0SDnqKvvFqnrx6EcvMMaBpLCYul2Wv3y85BcvZvRuFKIknESCpgP/sZ1NBQwHeQJC0ytaFlqni31MtbzAlFEggzVdBfPiFWnJtndOJe9eorbUBC+KG6FeZnFEMQ0BwQhDGYCn2vHBgevyDdd3Twm5PP/MGziXyWcY5rVvCxXzRWxlGkMz8vFUXNkQcwNpdzxWfi/cU7x81+avbla5vQoBE6t3WuO/dH7EnK3MRMelUuKV6QPMJ4qbr2U4z61m7F7EyC6d1pJfRd1WW5ASkPPMzK39WLm5E5Dk3qCnQNzDJQFwbY8UMuJ6PeQcCCuBDwal/wUe9dhWEyqqnpmG4qFDncYqZs3oDmm3gNxpfrz/Cg0aL6MzXdxd5vyRhaqtqV0KyDV/cPswoA6dmnBQ1g9DmRmBbZ668+L8sf5+zbY+GOO6Gu6aa9AHWGBjaWtS9hy506uz1XG0Dh6KS3o1bFtAyRLRgqxLEWVpPsuQnFb1eW44298CfQcgznSZzSViMCBhxjQILp24zF0B2W/CvCTZo1b0n509G6PMcbjYFfzGKcW68WAvofgWadPz0rgwYKzBqzizoICOXO4zncS+77hJz9ObGb4ePLpeB778V3dgB8pMwSd5crccRMnNz7/1OMO0sKFpIx1SGK3YFEH18CZzS6Csz3yFHP0teCWXHFT44znsZcY8fXX7NmKqn1EbcSSLrqAYZGzkJlzpWn81pLPtm7Ve4m6V1lnXeTQXHhGCs+n5wjw5Re2Fl06ASZMTKsd7UtZNCs0dGzTV+W0UihWJ6zQqpsojqM3JZBWNLBZU4QTyKefrEZCYs+bQDn9ZmYTlkj7/TB9oSHEah6G8VBUxOWKQOfn/Ow7JqqxwgSPMMPGKkoFmnHxY+8p6mBRZggFbZyHDK9XLzkIztTHLNfRTHWQXgY0UzWTosD75V3dWf3ZLEB9EiOv+fdxn2v4DpXvIkYu9CiQoPAV+H8vkbxaUJPKvFovQUIqsFpaKUVRdyJehqiEeCNLcpIso9R3kgjoWvuxedLiBozHw66PKxJxAZ5cG5HXP7wFmIfNHBUc6f1rtbMMp7jtjbPzSDY7lA9CVEceBNgtcsMkUPGMy+3nOCg56PBzS295juyrpfM8Y0dXP6BN0iHZ844j4VhZ4kAxy8qWHNGBBLhmzIVHLdbDgc4GFj+Ae/DkQR4dXHKPSsM7Gq1fjn+q5rL/sCLVP8dP++lnwN9Hy7vKs2P2rZ+/YrCAMnPvmjf4uVG7X3BmDVb5gn2+RX7pypEPVuyHcr2Lk17w/LQRz29/CP5wO+IF011X4pOzD/nDULmu5r13F9Skb54JbZ4Lde1DLmdR+9WYsiD46R39wQeG4sqhvn2g8mchaqgcGl0W8Vns/R503Y4crqRjPu4ptjMV4DH4aQ6h12fgbWTZLUQSiF73+9mwW8iy24gYA6pasMapowR9CKLozmhZtZTw+6T9S3lXxneLxwgSBGPEy192cka/Yj+hr1oTXjfxWkB9eLPDhAfUVaJtA/Ywvn3AnG1V+dzB6Y6PJqHzSYJ+Lo7GuQZGXu4cJo1NNPAN3QSHlg2dlHvnjGfWgY6yqf+eXy2dpL09tzcm5ZCS5HQVQx4hr4hG8HfcvYHfslLjeHT7VpcPkA6q9q9WjphM8Z86VbdGcnpMb5Qx69ChVZ3xWs7V1BmMTh3yCt3vZzsgrWhru6v3zRytDBqNL4E9mfpPssPHNELeYVNYO+QjjO9S3xtfJ0l15M6YzBy0NaDVry7mISrLyQybdD4c2P+iRkQn7sN1NrcNKzn7amZlLksiW1FZjPvvZYJbMXVYyTDKBZXXGNqo+EVQeT4TVD1ykDt3E00Vq9KoY9XTfWniOLFGEie5iZEehLuEb+D/rDh7V45GMkGVuSwuC4xUYt4P9L/4XclY/o5CrwTXr2oaGEdos7RED+aHbogmElAi2tg12otUL8jA/HDeZiSjHK6N06ZC2eYCLB8zs1FVG6cD55CzhTsvPlpRR5aDd8TEdGQWiLwxk0PPn23D2Wiy14pHl05pihH62UlY+BZCeY6O+leIyJSerE5WBVbpQw7q39YyB4uH00ewLDAtnTaXivBjXCw6RVu6Jv7a4rF0aenCYm2mtjiA4WHuQnjc5MIx7IfXwv+Vc+b/tWG9MbUo3oH4bwTZsy82pjam9E7tPRNctDGZbLA5+TojY1fO+aiYNCln13lRe0R8N+vv3GXrRXr23Y+jD9J8bA0cghiHK3/s1UwP7uueAv4vPuAQqc5KeI+rNrkuWBhVRRo8yDeYwKmwG11R1qCjcbDEc8h8zARfWf0Ln03f67UJ1ZyUb1T/l3n0fi/pl3CKy+ra/S+jY1Z34D+3sbh6kXLRdURrqZcte2Q1xF7Ng1nBbe3/zwYDUDx93EJ1z3LVUXc9V//qlDpYUR/lf9H6arpPtXUKh/72a+sEEJU0gaSsdWqW2RkKKukNRWXDoKJO0q9cSS3NWCGjAToaNoCgug0QVXURkurOpWaZ96CgrndQVD3AUNGkILjOStoGO51ottS2Whrwuj64vd7RyxptrXR3dZHF1tajtjkcERVGS3OLfRRXyZXx2XRLL0tzEwEt7TZ1a6sVtzY7euJpgzuz9OjhwJ3Njm6W+lZ5Y2urM0mhsHKB8npHT6AYJWVBcntL01CdpqYdEQnZ6+eUxLd/sjgKPiSV7HVV88uSysCpD6nIKQukPnRYaK+quFuUHAutZGxDc8dUJDCURsbi61ORISd/ph8LkZtorDARO1DQ/qxF9aT72uB20C6+fWqvp14gQTCEQChEhigQFaKNwsMnICQiJiElI6egpKKmETRRIZnxmYtCR2yACBRidg1Iat0odNKA2DJLMxektohylWtNEaJfxRRyu2nyAVIm4dJNCJ3KAkOWdBkYRaQIg0ysOc2XNrxtRRoFMz3eLXgPQQLixCGZMpAWAi7a3RaiUzsfly7E1eQPEAUAAAA=') format('woff2'),
+  url('iconfont.woff?t=1577785849356') format('woff'),
+  url('iconfont.ttf?t=1577785849356') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
+  url('iconfont.svg?t=1577785849356#iconfont') format('svg'); /* iOS 4.1- */
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.iconyou:before {
+  content: "\e600";
+}
+
+.iconyoushang:before {
+  content: "\e601";
+}
+
+.iconyichang:before {
+  content: "\e602";
+}
+
+.iconyouxia:before {
+  content: "\e603";
+}
+
+.iconzhongzhi:before {
+  content: "\e604";
+}
+
+.iconzhanshi:before {
+  content: "\e605";
+}
+
+.iconzuoshang:before {
+  content: "\e606";
+}
+
+.iconxia:before {
+  content: "\e607";
+}
+
+.iconyunhanglushu:before {
+  content: "\e608";
+}
+
+.iconzongliang:before {
+  content: "\e609";
+}
+
+.iconzuoxia:before {
+  content: "\e60a";
+}
+
+.icondingweiweizhi:before {
+  content: "\e60b";
+}
+
+.iconbaocunmianxing:before {
+  content: "\e60c";
+}
+
+.iconshang:before {
+  content: "\e60d";
+}
+
+.iconfenxi:before {
+  content: "\e60e";
+}
+
+.icondaochu:before {
+  content: "\e60f";
+}
+
+.iconkaiqi:before {
+  content: "\e610";
+}
+
+.iconshanchu:before {
+  content: "\e611";
+}
+
+.icondaoru:before {
+  content: "\e612";
+}
+
+.iconzuo:before {
+  content: "\e613";
+}
+
+.iconshanchu1:before {
+  content: "\e614";
+}
+
+.iconbianzu:before {
+  content: "\e615";
+}
+
+.iconbianzu1:before {
+  content: "\e616";
+}
+
+.iconbianzu2:before {
+  content: "\e617";
+}
+
+.icontianjia:before {
+  content: "\e618";
+}
+

UI/图标/图标/font_1592179_fsameoezhkf/iconfont.js

+!function(i){var a,o='<svg><symbol id="iconyou" viewBox="0 0 1024 1024"><path d="M1006.644068 1006.644068m-52.067797 0l-885.152542 0q-52.067797 0-52.067797-52.067797l0-885.152542q0-52.067797 52.067797-52.067797l885.152542 0q52.067797 0 52.067797 52.067797l0 885.152542q0 52.067797-52.067797 52.067797Z"  ></path><path d="M143.186441 111.077966L514.169492 506.79322 143.186441 902.508475H514.169492L885.152542 506.79322l-370.98305-395.715254z"  ></path></symbol><symbol id="iconyoushang" viewBox="0 0 1041 1024"><path d="MNaN NaNmNaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNZ"  ></path><path d="MNaN NaNLNaN NaNlNaN NaN NaN NaN NaN NaN NaN NaNz"  ></path></symbol><symbol id="iconyichang" viewBox="0 0 1024 1024"><path d="M378.88 739.84c0-199.68 161.28-360.96 360.96-360.96 33.28 0 64 5.12 94.72 12.8V76.8c0-40.96-33.28-76.8-76.8-76.8H76.8C33.28 0 0 33.28 0 76.8v796.16c0 40.96 33.28 76.8 76.8 76.8h368.64c-40.96-61.44-66.56-133.12-66.56-209.92zM189.44 151.04h455.68c20.48 0 38.4 17.92 38.4 38.4s-17.92 38.4-38.4 38.4H189.44c-20.48 0-38.4-17.92-38.4-38.4s17.92-38.4 38.4-38.4z m0 227.84h151.04c20.48 0 38.4 17.92 38.4 38.4s-17.92 38.4-38.4 38.4H189.44c-20.48 0-38.4-17.92-38.4-38.4s17.92-38.4 38.4-38.4z m76.8 304.64h-76.8c-20.48 0-38.4-17.92-38.4-38.4s17.92-38.4 38.4-38.4h76.8c20.48 0 38.4 17.92 38.4 38.4s-17.92 38.4-38.4 38.4z m473.6-227.84c156.16 0 284.16 128 284.16 284.16S896 1024 739.84 1024s-284.16-128-284.16-284.16 128-284.16 284.16-284.16z m0 122.88c-20.48 0-38.4 17.92-38.4 38.4v153.6c0 20.48 17.92 38.4 38.4 38.4s38.4-17.92 38.4-38.4v-153.6c0-20.48-17.92-38.4-38.4-38.4z m0 256c-20.48 0-38.4 17.92-38.4 38.4s17.92 38.4 38.4 38.4 38.4-17.92 38.4-38.4-17.92-38.4-38.4-38.4z"  ></path></symbol><symbol id="iconyouxia" viewBox="0 0 1024 1024"><path d="MNaN NaNmNaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNZ"  ></path><path d="MNaN NaNLNaN NaNlNaN NaN NaN NaN NaN NaN NaN NaNz"  ></path></symbol><symbol id="iconzhongzhi" viewBox="0 0 1024 1024"><path d="M1024 0m0 53.894737l0 916.210526q0 53.894737-53.894737 53.894737l-916.210526 0q-53.894737 0-53.894737-53.894737l0-916.210526q0-53.894737 53.894737-53.894737l916.210526 0q53.894737 0 53.894737 53.894737Z"  ></path><path d="M835.116912 324.033123L891.957895 267.551439 892.335158 512l-246.029474-0.377263 95.752983-95.142176c-59.176421-125.556772-209.596632-179.667088-335.961825-120.867929a251.724351 251.724351 0 0 0-127.155649 133.425403l-132.652912-0.07186C198.512281 227.579509 405.162667 106.388211 607.860772 158.288842a378.826105 378.826105 0 0 1 227.25614 165.744281z m-538.606035 298.217544c59.266246 125.538807 209.740351 179.577263 336.069614 120.670315a251.778246 251.778246 0 0 0 126.976-133.245754l132.778667-0.053895c-52.241965 201.422596-258.928281 322.63186-461.626386 270.713263a378.88 378.88 0 0 1-227.184281-165.690385l-56.858947 56.481684-0.377263-244.502456 246.047438 0.377263-95.824842 95.178105 0 0.053895z"  ></path></symbol><symbol id="iconzhanshi" viewBox="0 0 1024 1024"><path d="M512 294.343111C358.4 294.343111 224.085333 428.714667 224.085333 512c0 83.171556 134.371556 217.656889 287.914667 217.656889 159.971556 0 287.914667-153.6 287.914667-217.656889 0-63.943111-127.943111-217.656889-287.914667-217.656889z m0 313.685333c-51.2 0-96.028444-44.828444-96.028444-96.028444 0-51.2 44.828444-96.028444 96.028444-96.028444 51.2 0 96.028444 44.828444 96.028444 96.028444 0 51.2-44.828444 96.028444-96.028444 96.028444zM512 0C230.4 0 0 230.4 0 512s230.4 512 512 512 512-230.4 512-512-230.4-512-512-512z m0 793.6c-185.571556 0-352.028444-159.971556-352.028444-281.6 0-121.628444 166.456889-281.6 352.028444-281.6 185.571556 0 352.028444 172.828444 352.028444 281.6 0 108.771556-166.456889 281.6-352.028444 281.6z"  ></path></symbol><symbol id="iconzuoshang" viewBox="0 0 1024 1024"><path d="M1006.644068 16.713763m0 52.067796l0 885.794712q0 52.067797-52.067797 52.067797l-885.794712 0q-52.067797 0-52.067796-52.067797l0-885.794712q0-52.067797 52.067796-52.067796l885.794712 0q52.067797 0 52.067797 52.067796Z"  ></path><path d="M395.472271 955.461424l17.49478-542.494373 542.494373-17.49478-262.491119-262.491118L150.475932 150.475932l-17.494779 542.494373z"  ></path></symbol><symbol id="iconxia" viewBox="0 0 1024 1024"><path d="MNaN NaNmNaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNZ"  ></path><path d="MNaN NaNLNaN NaN NaN NaN NaN NaN NaN NaNlNaN NaNz"  ></path></symbol><symbol id="iconyunhanglushu" viewBox="0 0 1137 1024"><path d="M1037.767111 366.40237l-76.231111-220.008296-1.517037-2.048a51.275852 51.275852 0 0 0-3.565037-6.257778C930.702222 89.088 883.749926 0 763.904 0H372.811852C251.828148 0.265481 204.420741 90.794667 179.920593 139.226074L173.700741 151.703704v5.309629c0 0.910222-0.910222 1.820444-0.910222 2.692741L100.958815 365.530074C37.05363 409.144889 0 472.367407 0 538.320593V830.577778c0 40.808296 14.184296 80.402963 40.011852 111.881481v6.712889h5.423407a182.878815 182.878815 0 0 0 113.246815 59.543704 177.682963 177.682963 0 0 0 183.940741-95.345778l449.725629-1.744593a182.992593 182.992593 0 0 0 186.671408 98.152297A179.503407 179.503407 0 0 0 1137.777778 831.260444v-292.029629c-0.606815-64.625778-37.850074-128.265481-100.010667-172.828445z m-778.126222 333.368889a80.175407 80.175407 0 0 1-80.023704-80.327111c0-44.373333 35.84-80.327111 80.023704-80.327111s80.023704 35.991704 80.023704 80.327111c0 44.373333-35.84 80.365037-80.023704 80.365037z m621.340444 0a80.175407 80.175407 0 0 1-80.023703-80.327111c0-44.373333 35.84-80.327111 80.023703-80.327111s80.023704 35.991704 80.023704 80.327111c0 44.373333-35.84 80.365037-80.023704 80.365037zM179.655111 426.249481l86.281482-246.897777v-0.872297c25.78963-49.910519 49.682963-84.612741 107.406222-84.61274h392.078222c58.595556 0 82.488889 36.484741 109.150815 88.177777l1.782518 3.565037c0 1.782519 1.782519 3.565037 2.654815 6.257778l81.957926 234.382222H179.655111z"  ></path></symbol><symbol id="iconzongliang" viewBox="0 0 1024 1024"><path d="M512 413.513143c272.64 0 493.714286-92.598857 493.714286-206.811429C1005.714286 92.452571 784.64 0 512 0S18.285714 92.598857 18.285714 206.701714s221.074286 206.811429 493.714286 206.811429z m419.218286-10.752c-109.092571 59.904-267.483429 88.32-419.218286 88.32-151.844571 0-310.125714-28.416-419.218286-88.32C45.604571 434.468571 18.285714 471.771429 18.285714 511.926857c0 114.249143 221.074286 206.811429 493.714286 206.811429S1005.714286 626.176 1005.714286 511.926857c0-40.118857-27.318857-77.421714-74.496-109.165714z m0 305.225143c-109.092571 59.904-267.483429 88.356571-419.218286 88.356571-151.844571 0-310.125714-28.452571-419.218286-88.356571C45.604571 739.730286 18.285714 777.069714 18.285714 817.188571 18.285714 931.401143 239.36 1024 512 1024S1005.714286 931.401143 1005.714286 817.188571c0-40.118857-27.318857-77.568-74.496-109.202285z"  ></path></symbol><symbol id="iconzuoxia" viewBox="0 0 1024 1024"><path d="M16.713763 17.355932m52.067796 0l885.794712 0q52.067797 0 52.067797 52.067797l0 885.794712q0 52.067797-52.067797 52.067796l-885.794712 0q-52.067797 0-52.067796-52.067796l0-885.794712q0-52.067797 52.067796-52.067797Z"  ></path><path d="M955.461424 628.527729l-542.494373-17.49478-17.49478-542.494373-262.491118 262.491119L150.475932 873.524068l542.494373 17.494779z"  ></path></symbol><symbol id="icondingweiweizhi" viewBox="0 0 1024 1024"><path d="M511.99904 0C282.23904 0 95.99904 189.888 95.99904 424.192c0 117.12 46.592 223.104 121.856 299.904L511.99904 1024l294.144-299.904A427.072 427.072 0 0 0 927.99904 424.192C927.99904 189.888 741.75904 0 511.99904 0z m0 612.608C409.59904 612.352 326.78304 528 327.03904 424.192v-0.128C326.78304 320.32 409.59904 235.904 511.87104 235.648H511.99904c102.4 0.256 185.216 84.608 184.96 188.416v0.128c0.32 103.744-82.432 188.16-184.768 188.48H511.99904v-0.064z"  ></path></symbol><symbol id="iconbaocunmianxing" viewBox="0 0 1024 1024"><path d="M170.642286 0v385.974857c0 31.890286 30.573714 57.782857 68.315428 57.782857h546.084572c37.741714 0 68.315429-25.892571 68.315428-57.782857V0A170.642286 170.642286 0 0 1 1024 170.642286v682.715428A170.642286 170.642286 0 0 1 853.357714 1024H170.642286A170.642286 170.642286 0 0 1 0 853.357714V170.642286A170.642286 170.642286 0 0 1 170.642286 0z m68.315428 0h546.084572v375.442286H238.957714V0z m443.684572 136.557714a34.157714 34.157714 0 0 0-34.084572 34.084572v102.4a34.157714 34.157714 0 0 0 68.242286 0v-102.4a34.157714 34.157714 0 0 0-34.157714-34.084572z"  ></path></symbol><symbol id="iconshang" viewBox="0 0 1024 1024"><path d="M1006.644068 17.355932m0 52.067797l0 885.152542q0 52.067797-52.067797 52.067797l-885.152542 0q-52.067797 0-52.067797-52.067797l0-885.152542q0-52.067797 52.067797-52.067797l885.152542 0q52.067797 0 52.067797 52.067797Z"  ></path><path d="M111.077966 880.813559L506.79322 509.830508 902.508475 880.813559 902.508475 509.830508 506.79322 138.847458l-395.715254 370.98305z"  ></path></symbol><symbol id="iconfenxi" viewBox="0 0 1024 1024"><path d="M284.444339 1024a31.895692 31.895692 0 0 1-31.516433-32.312877 31.933618 31.933618 0 0 1 31.478507-31.326803H739.555282c17.673475 0.265481 31.781914 14.791106 31.478507 32.350803a31.933618 31.933618 0 0 1-31.478507 31.288877h-455.110943zM895.961742 0.000379H127.999953A127.658619 127.658619 0 0 0 0 127.317665v587.775783a127.658619 127.658619 0 0 0 127.999953 127.317286h767.999715A127.658619 127.658619 0 0 0 1023.999621 715.093448V127.317665A127.658619 127.658619 0 0 0 895.999668 0.000379z m-46.724723 260.171756l-246.783909 288.729967c-1.592888 1.896296-1.592888 1.896296-3.33748 3.565036a44.980131 44.980131 0 0 1-63.336273-1.744592l-139.3398-146.735353-175.862454 158.682015a32.123247 32.123247 0 0 1-45.131835-3.223703 31.706062 31.706062 0 0 1 2.123851-43.88028l189.819189-171.34927a44.980131 44.980131 0 0 1 62.729459 2.351407l137.48143 144.876983 232.865099-272.497676a32.123247 32.123247 0 0 1 45.169761-2.920296c13.008588 11.339848 14.601476 30.909618 3.602962 44.183688z"  ></path></symbol><symbol id="icondaochu" viewBox="0 0 1084 1024"><path d="M189.741176 615.243294c0 53.910588 9.336471 106.194824 26.262589 154.202353 61.801412-179.501176 226.183529-307.621647 420.98447-307.621647v76.739765c0 29.515294 16.082824 55.597176 41.562353 69.089882 10.119529 5.059765 21.985882 8.432941 32.948706 8.432941 16.143059 0 31.322353-5.059765 44.93553-15.179294l298.164705-230.942118c18.672941-14.275765 29.635765-37.044706 29.635765-61.500235 0-24.455529-11.023059-47.224471-29.635765-61.500235L756.434824 15.179294A72.161882 72.161882 0 0 0 678.490353 8.432941c-25.419294 12.649412-41.502118 39.634824-41.502118 69.089883V154.202353C390.505412 153.419294 189.741176 360.688941 189.741176 615.243294z m840.282353-22.768941c-29.635765 0-54.211765 24.455529-54.211764 53.970823v64.873412c0 113.784471-4.216471 204.8-216.847059 204.8H325.270588c-219.376941 0-216.847059-96.918588-216.847059-215.762823V430.682353c-15.239529-169.441882 65.234824-206.486588 162.635295-214.076235h3.373176c29.635765 0 54.211765-24.455529 54.211765-53.970824s-24.576-54.814118-54.211765-54.814118H271.058824v-0.783058h-54.211765C97.400471 107.038118 0 203.956706 0 322.800941v485.496471C0 927.021176 97.400471 1024 216.847059 1024h649.697882c119.446588 0 216.847059-96.978824 216.847059-215.762824v-161.792a53.187765 53.187765 0 0 0-53.368471-53.970823z"  ></path></symbol><symbol id="iconkaiqi" viewBox="0 0 1706 1024"><path d="M47.047111 504.604444C47.047111 251.221333 256.284444 45.681778 514.446222 45.681778c258.161778 0 467.399111 205.482667 467.399111 458.922666s-209.237333 458.922667-467.399111 458.922667c-258.161778 0-467.399111-205.482667-467.399111-458.922667M0 505.742222c0 279.267556 230.570667 505.685333 515.072 505.685334h676.522667c284.444444 0 515.072-226.417778 515.072-505.742223C1706.666667 226.417778 1476.096 0 1191.594667 0H515.072C230.627556 0 0 226.417778 0 505.685333"  ></path></symbol><symbol id="iconshanchu" viewBox="0 0 1024 1024"><path d="M784.96 125.12H221.568C170.048 125.12 128 167.04 128 219.2v30.976h750.528v-31.488c0-51.584-41.984-93.568-93.568-93.568zM620.864 62.528l14.016 98.56H371.712l13.952-98.56h235.2zM628.352 0H378.24a55.68 55.68 0 0 0-53.504 46.528l-18.56 131.136a39.872 39.872 0 0 0 40.576 46.528h312.704a39.872 39.872 0 0 0 40.512-46.528L681.408 46.528A54.72 54.72 0 0 0 628.352 0z m172.16 312.704H206.08a56.384 56.384 0 0 0-57.088 62.592l51.072 563.392c3.008 34.048 33.984 62.528 68.032 62.528h469.376c34.56 0 65.024-27.968 68.032-62.528l51.52-563.392a55.744 55.744 0 0 0-56.512-62.592z m-422.336 562.944H284.16l-30.976-437.824h125.056v437.824z m187.648 0H440.704V437.824h125.12v437.824z m156.608 0h-94.08V437.824h125.12l-31.04 437.824z"  ></path></symbol><symbol id="icondaoru" viewBox="0 0 1296 1024"><path d="M973.183381 360.866032a8.32243 8.32243 0 0 0 1.841849-8.663514 7.230964 7.230964 0 0 0-6.753447-4.979815h-200.693358l0.4093-323.619745A24.557991 24.557991 0 0 0 761.711794 6.821664 20.669642 20.669642 0 0 0 746.294833 0H549.830906a20.737859 20.737859 0 0 0-15.280527 6.889881 24.626207 24.626207 0 0 0-6.344148 16.713077l0.4093 323.619745H327.785739a7.230964 7.230964 0 0 0-6.685231 4.979815 8.32243 8.32243 0 0 0 1.84185 8.663514l310.385717 313.660115a20.669642 20.669642 0 0 0 14.734794 6.275931 20.669642 20.669642 0 0 0 14.734795-6.275931l310.385717-313.660115z m309.226034 333.852241l-194.622077-165.493571a81.859969 81.859969 0 0 0-45.5005-17.05416h-77.221237L1184.927835 716.274732l-254.857371 0.136433-95.093998 148.507628H460.262456L369.056807 716.479382l-253.493038-0.136433 227.502498-204.240624-89.295583 0.068217a81.859969 81.859969 0 0 0-45.432283 17.05416L13.648107 694.718273c-11.051096 9.34568-16.508427 28.855639-12.142562 43.385784l77.630537 258.813936c4.365865 14.461928 19.373526 26.331623 33.357938 26.331624h1072.570248c13.984411 0 28.923856-11.869696 33.221505-26.39984l76.402638-258.74572c4.229432-14.530145-1.2279-34.040104-12.278996-43.385784z"  ></path></symbol><symbol id="iconzuo" viewBox="0 0 1024 1024"><path d="MNaN NaNmNaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNZ"  ></path><path d="MNaN NaNLNaN NaN NaN NaN NaN NaN NaN NaNlNaN NaNz"  ></path></symbol><symbol id="iconshanchu1" viewBox="0 0 1024 1024"><path d="M784.96 125.12H221.568C170.048 125.12 128 167.04 128 219.2v30.976h750.528v-31.488c0-51.584-41.984-93.568-93.568-93.568zM620.864 62.528l14.016 98.56H371.712l13.952-98.56h235.2zM628.352 0H378.24a55.68 55.68 0 0 0-53.504 46.528l-18.56 131.136a39.872 39.872 0 0 0 40.576 46.528h312.704a39.872 39.872 0 0 0 40.512-46.528L681.408 46.528A54.72 54.72 0 0 0 628.352 0z m172.16 312.704H206.08a56.384 56.384 0 0 0-57.088 62.592l51.072 563.392c3.008 34.048 33.984 62.528 68.032 62.528h469.376c34.56 0 65.024-27.968 68.032-62.528l51.52-563.392a55.744 55.744 0 0 0-56.512-62.592z m-422.336 562.944H284.16l-30.976-437.824h125.056v437.824z m187.648 0H440.704V437.824h125.12v437.824z m156.608 0h-94.08V437.824h125.12l-31.04 437.824z"  ></path></symbol><symbol id="iconbianzu" viewBox="0 0 1024 1024"><path d="M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z"  ></path><path d="M427.776 420.0448l-35.712-128.3328h-95.232v-25.6512h95.232l49.28 135.5008 402.9952-7.168v25.6512H427.776z"  ></path><path d="M439.7312 420.0448h404.608v-68.4544H416.6144z"  ></path><path d="M125.7472 555.4688V693.76h51.968v-4.5056c-0.4096-56.9344 46.1824-103.5264 104.3712-104.4224 58.1888 0.896 104.7552 47.488 104.3712 104.448 0 1.4848 34.048 2.5344 10.496 2.5344h212.0192c0-1.5104 5.6576-1.0496 5.6576-2.56-0.384-56.9344 46.1824-103.5264 104.3712-104.4224a104.448 104.448 0 0 1 39.936 7.936l59.7248-62.336h25.6768v-103.7568H396.6976l-35.328-92.2112H243.5584L126.464 555.4688h-0.7168z m70.6816-25.344l73.3952-139.392h48.0768l31.6672 139.7248-153.1392-0.3584z"  ></path><path d="M639.0272 693.7856a85.5552 85.5552 0 1 0 171.1104 0 85.5552 85.5552 0 1 0-171.1104 0zM211.3024 693.7856a85.5552 85.5552 0 1 0 171.0848 0 85.5552 85.5552 0 1 0-171.0848 0zM449.408 351.5904l-15.6928-30.2848 5.888-7.168 46.8992-26.8288h58.5216l35.328-51.968 69.0432-7.3216 64.1536-30.4128 37.3248 89.7024h31.5904l27.776 4.7616 34.0992 59.52z"  ></path></symbol><symbol id="iconbianzu1" viewBox="0 0 1024 1024"><path d="M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z"  ></path><path d="M851.3792 298.9056l-37.1968-76.8512c-6.0672-12.5952-20.4288-19.456-34.56-16.64L572.7232 247.04l0.0768 0.256c-50.6368 12.5696-87.9104 56.7808-87.808 109.312 0.128 62.0288 54.3488 113.152 118.9632 112.3328a120.96 120.96 0 0 0 57.6-15.36l0.1792 0.4608 179.072-117.9136c12.5184-8.2688 16.9472-24.0128 10.5728-37.1968zM394.88 542.72v-151.296c0-16.4864-13.9008-29.824-31.0528-29.824h-33.408c-23.6032 0-46.336 8.6272-63.6672 24.1408l-93.44 83.84a58.4704 58.4704 0 0 0-19.712 43.52v187.648c0 16.4608 13.9008 29.7984 31.0528 29.7984h15.7696c0-52.7872 44.5952-95.7184 99.6352-95.7184 55.0656 0 99.584 42.8032 99.584 95.6416 0 0.0768 208.512 0.1536 208.512 0.0768 0-52.7872 44.544-95.7184 99.5584-95.7184 54.9632 0 99.5584 43.008 99.5584 95.7952 0 0.0768 32.0768-0.0768 32.0768-0.0768 17.152 0 31.0528-13.3376 31.0528-29.824V602.368c0-16.4864-13.9008-29.824-31.0528-29.824H425.9584c-17.152 0-31.0784-13.312-31.0784-29.7984z m-156.416 190.5152c0 33.3312 28.16 60.3648 62.9248 60.3648 34.7392 0 62.8992-27.0336 62.8992-60.3648 0-33.3568-28.16-60.3904-62.8992-60.3904-34.7392 0-62.8992 27.0336-62.8992 60.3904z m407.7312 0c0 33.3312 28.16 60.3648 62.8992 60.3648 34.7392 0 62.8992-27.0336 62.8992-60.3648 0-33.3568-28.16-60.3904-62.8992-60.3904-34.7392 0-62.8992 27.0336-62.8992 60.3904z m218.2912-311.5008c0.0768-23.9104-27.7248-38.144-48.384-24.832l-131.456 84.7616c-45.44 26.8288-81.3312 25.7792-105.7024 21.9136-64.2304-10.2144-96.9984-45.6192-113.6128-81.9968-20.8896-45.824-16.0768 24.2432-16.0768 24.2432v43.52c0 16.4608 13.9008 29.824 31.0528 29.824h352.896c17.152 0 30.976-13.2864 31.0528-29.7472l0.256-67.6864z"  ></path></symbol><symbol id="iconbianzu2" viewBox="0 0 1024 1024"><path d="M512 512m-499.512195 0a499.512195 499.512195 0 1 0 999.02439 0 499.512195 499.512195 0 1 0-999.02439 0Z"  ></path><path d="M809.284683 682.033951h-53.947317c-6.743415-47.50361-46.154927-84.067902-94.357854-84.067902s-87.964098 36.913951-94.382829 84.067902h-107.844683c-14.835512 0-26.973659-12.312976-26.973659-27.672975V313.044293h45.505561v322.510048h55.620683c22.577951-49.876293 72.129561-84.042927 128.074927-84.042926s105.496976 34.166634 128.074927 84.042926h2.023024V313.044293h45.155903V654.360976c0 15.010341-12.113171 27.672976-26.973659 27.672975z m-58.99239-218.661463c7.417756 0 12.487805 4.096 15.160195 11.963317 0.349659 1.698341 0.674341 3.396683 0.674341 5.444683 0 9.915317-6.044098 15.384976-18.531902 16.059317 5.070049 5.144976 7.417756 10.589659 7.417756 15.384975 0 5.12-2.697366 9.565659-7.742439 13.312a16.384 16.384 0 0 1-9.116098 2.747318c-9.765463 0-16.483902-8.192-20.554926-25.275318l-80.221659-30.420292-80.221659 30.420292c-4.046049 16.733659-10.764488 25.275317-20.230243 25.275318a21.004488 21.004488 0 0 1-9.415805-2.747318c-5.070049-3.746341-7.417756-7.842341-7.417756-13.312 0-5.12 2.347707-10.24 7.417756-15.384975-12.487805-0.674341-18.881561-6.144-18.881561-16.059317 0-2.048 0.349659-3.746341 0.674341-5.444683 3.022049-7.867317 8.092098-11.988293 15.484878-11.988293 6.094049 0 13.162146 3.096976 21.254244 8.891317l46.179903-17.083317-46.854244-17.732683c-7.742439 5.095024-15.160195 7.842341-21.578927 7.842342-7.068098 0-11.788488-4.096-14.485854-11.988293a26.898732 26.898732 0 0 1-0.674341-5.444683c0-9.915317 6.393756-15.384976 18.881561-16.059317-5.070049-5.12-7.417756-10.589659-7.417756-15.36 0-5.144976 2.347707-9.565659 7.417756-13.336976a19.106341 19.106341 0 0 1 8.41678-2.048c10.115122 0 16.858537 8.891317 20.554927 26.299318l80.571317 30.420292 80.546342-31.094634c3.721366-17.083317 10.439805-25.624976 20.554926-25.624976 3.047024 0 5.74439 0.674341 8.441756 2.048 5.394732 3.746341 7.742439 8.192 7.742439 13.336976 0 5.12-2.697366 10.24-7.417756 15.36 12.487805 0.674341 18.531902 6.144 18.531903 16.059317 0 1.698341-0.324683 3.746341-0.674342 5.469659-2.347707 7.867317-7.068098 11.963317-14.485853 11.963317-6.743415 0-13.811512-2.747317-21.578927-7.867317l-46.504586 17.757658 45.830244 17.432976c8.766439-6.144 16.184195-9.240976 22.253269-9.240976z m-61.340098-84.742244v4.096c0 6.843317-1.998049 12.312976-6.393756 16.733658a26.074537 26.074537 0 0 1-16.184195 7.867318c-6.069073 0.349659-10.789463-0.674341-14.161171-3.072a24.825756 24.825756 0 0 1-15.834536 5.494634c-6.069073 0-11.813463-2.072976-16.858537-5.819317-3.371707 2.722341-8.092098 4.096-14.835512 3.396683a24.076488 24.076488 0 0 1-16.184195-7.492683 23.102439 23.102439 0 0 1-6.393756-16.733659v-5.494634c-22.92761-6.818341-40.785171-17.757659-53.248-32.792976a80.49639 80.49639 0 0 1-18.881561-52.623609c0-4.420683 0.349659-9.216 1.348683-14.336 4.370732-30.744976 17.857561-56.045268 40.110829-76.17561 23.601951-21.204293 52.248976-31.469268 86.290732-31.469269s62.68878 10.614634 86.290731 31.793952c22.577951 19.805659 36.06478 45.105951 40.435512 75.850927 0.999024 5.12 1.348683 9.915317 1.348683 14.336 0 20.504976-6.393756 38.262634-19.555902 53.297951-13.486829 15.035317-32.693073 26.324293-57.294049 33.142634z m-80.896-126.75122c-6.743415-8.192-15.160195-12.288-24.600975-12.288-9.765463 0-17.857561 4.096-24.600976 12.288-6.743415 8.192-10.439805 18.107317-10.439805 30.070635 0 11.613659 3.346732 21.853659 10.439805 30.070634 6.743415 8.192 15.160195 12.288 24.600976 12.288 9.765463 0 17.857561-4.096 24.600975-12.288 6.743415-8.216976 10.46478-18.107317 10.464781-30.070634s-3.721366-21.878634-10.464781-30.070635z m38.762146 83.018927c-3.022049-5.12-6.069073-7.492683-9.091121-7.492683-3.371707 0-6.418732 2.372683-9.79044 6.818342a22.153366 22.153366 0 0 0-5.045073 13.661658c0 2.747317 0.674341 5.12 2.347708 7.168 2.697366 3.072 7.093073 4.445659 12.812487 4.445659 8.766439 0 13.162146-3.421659 13.162147-10.24a33.642146 33.642146 0 0 0-4.395708-14.360976z m66.73483-83.018927c-6.743415-8.192-15.160195-12.288-24.925659-12.288-9.44078 0-17.882537 4.096-24.625951 12.288-6.743415 8.192-10.090146 18.107317-10.090146 30.070635 0 11.613659 3.346732 21.853659 10.090146 30.070634 6.743415 8.192 14.835512 12.288 24.625951 12.288 9.740488 0 18.182244-4.096 24.925659-12.288 6.743415-8.216976 10.115122-18.107317 10.115122-30.070634a43.857171 43.857171 0 0 0-10.115122-30.070635zM377.880976 682.033951c-6.743415-47.50361-46.179902-84.067902-94.38283-84.067902s-87.964098 36.913951-94.357853 84.067902h-26.973659c-14.835512 0-26.973659-12.312976-26.973658-27.672975v-137.690537c0-25.974634 20.554927-55.69561 20.554926-55.69561l60.341074-81.994927c12.487805-15.035317 20.554927-27.672976 40.460487-27.672975h121.331513c14.835512 0 26.973659 12.288 26.973658 27.672975V654.360976c0 15.010341-12.138146 27.323317-26.973658 27.672975z m-18.531903-284.27239H259.896195l-6.069073 7.192976-2.023024 2.722341-59.342049 80.621268c-6.044098 9.240976-12.113171 22.902634-12.113171 28.372293l1.348683 11.613659 177.626537-1.723318v-128.799219z m-76.525268 225.50478c38.762146 0 70.43122 32.468293 70.431219 72.07961 0 39.636293-31.669073 72.07961-70.431219 72.07961-38.762146 0-70.43122-32.468293-70.43122-72.07961 0-39.636293 31.669073-72.07961 70.43122-72.07961z m379.529366 0c38.762146 0 70.43122 32.468293 70.431219 72.07961 0 39.636293-31.669073 72.07961-70.431219 72.07961-38.762146 0-70.43122-32.468293-70.43122-72.07961 0-39.960976 31.669073-72.07961 70.43122-72.07961z"  ></path></symbol><symbol id="icontianjia" viewBox="0 0 1024 1024"><path d="M874.03928 149.903832A508.584406 508.584406 0 0 0 512 0.002276a508.755072 508.755072 0 0 0-362.03928 149.901556A508.698184 508.698184 0 0 0 0.002276 512c0 136.81717 53.304652 265.442376 150.015333 362.096168A508.584406 508.584406 0 0 0 512 1023.997724a508.299963 508.299963 0 0 0 361.982391-149.901556A509.039515 509.039515 0 0 0 1023.997724 512a508.356852 508.356852 0 0 0-149.958444-362.03928zM767.998862 548.69317H548.636282v220.443465a36.636282 36.636282 0 0 1-36.579393 36.750059 36.636282 36.636282 0 0 1-36.579393-36.750059V548.750059H256.001138A36.636282 36.636282 0 0 1 219.421745 512c0-20.309243 16.383927-36.750059 36.579393-36.750059h219.476358V254.863365c0-20.309243 16.383927-36.750059 36.579393-36.750059 20.195466 0 36.579393 16.440816 36.579393 36.750059v220.386576H767.998862c20.195466 0 36.579393 16.497704 36.579393 36.750059a36.636282 36.636282 0 0 1-36.579393 36.750059z"  ></path></symbol></svg>',N=(a=document.getElementsByTagName("script"))[a.length-1].getAttribute("data-injectcss");if(N&&!i.__iconfont__svg__cssinject__){i.__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(a){console&&console.log(a)}}!function(a){if(document.addEventListener)if(~["complete","loaded","interactive"].indexOf(document.readyState))setTimeout(a,0);else{var N=function(){document.removeEventListener("DOMContentLoaded",N,!1),a()};document.addEventListener("DOMContentLoaded",N,!1)}else document.attachEvent&&(c=a,t=i.document,h=!1,(o=function(){try{t.documentElement.doScroll("left")}catch(a){return void setTimeout(o,50)}l()})(),t.onreadystatechange=function(){"complete"==t.readyState&&(t.onreadystatechange=null,l())});function l(){h||(h=!0,c())}var c,t,h,o}(function(){var a,N,l,c,t,h;(a=document.createElement("div")).innerHTML=o,o=null,(N=a.getElementsByTagName("svg")[0])&&(N.setAttribute("aria-hidden","true"),N.style.position="absolute",N.style.width=0,N.style.height=0,N.style.overflow="hidden",l=N,(c=document.body).firstChild?(t=l,(h=c.firstChild).parentNode.insertBefore(t,h)):c.appendChild(l))})}(window);
\ No newline at end of file

UI/图标/图标/font_1592179_fsameoezhkf/iconfont.json

+{
+  "id": "1592179",
+  "name": "fanxin_new",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "12616237",
+      "name": "右",
+      "font_class": "you",
+      "unicode": "e600",
+      "unicode_decimal": 58880
+    },
+    {
+      "icon_id": "12616238",
+      "name": "右上",
+      "font_class": "youshang",
+      "unicode": "e601",
+      "unicode_decimal": 58881
+    },
+    {
+      "icon_id": "12616239",
+      "name": "异常",
+      "font_class": "yichang",
+      "unicode": "e602",
+      "unicode_decimal": 58882
+    },
+    {
+      "icon_id": "12616240",
+      "name": "右下",
+      "font_class": "youxia",
+      "unicode": "e603",
+      "unicode_decimal": 58883
+    },
+    {
+      "icon_id": "12616241",
+      "name": "重置",
+      "font_class": "zhongzhi",
+      "unicode": "e604",
+      "unicode_decimal": 58884
+    },
+    {
+      "icon_id": "12616242",
+      "name": "展示",
+      "font_class": "zhanshi",
+      "unicode": "e605",
+      "unicode_decimal": 58885
+    },
+    {
+      "icon_id": "12616243",
+      "name": "左上",
+      "font_class": "zuoshang",
+      "unicode": "e606",
+      "unicode_decimal": 58886
+    },
+    {
+      "icon_id": "12616244",
+      "name": "下",
+      "font_class": "xia",
+      "unicode": "e607",
+      "unicode_decimal": 58887
+    },
+    {
+      "icon_id": "12616245",
+      "name": "运行路数",
+      "font_class": "yunhanglushu",
+      "unicode": "e608",
+      "unicode_decimal": 58888
+    },
+    {
+      "icon_id": "12616246",
+      "name": "总量",
+      "font_class": "zongliang",
+      "unicode": "e609",
+      "unicode_decimal": 58889
+    },
+    {
+      "icon_id": "12616247",
+      "name": "左下",
+      "font_class": "zuoxia",
+      "unicode": "e60a",
+      "unicode_decimal": 58890
+    },
+    {
+      "icon_id": "12616248",
+      "name": "定位 位置",
+      "font_class": "dingweiweizhi",
+      "unicode": "e60b",
+      "unicode_decimal": 58891
+    },
+    {
+      "icon_id": "12616249",
+      "name": "保存 面性",
+      "font_class": "baocunmianxing",
+      "unicode": "e60c",
+      "unicode_decimal": 58892
+    },
+    {
+      "icon_id": "12616250",
+      "name": "上",
+      "font_class": "shang",
+      "unicode": "e60d",
+      "unicode_decimal": 58893
+    },
+    {
+      "icon_id": "12616251",
+      "name": "分析",
+      "font_class": "fenxi",
+      "unicode": "e60e",
+      "unicode_decimal": 58894
+    },
+    {
+      "icon_id": "12616252",
+      "name": "导出",
+      "font_class": "daochu",
+      "unicode": "e60f",
+      "unicode_decimal": 58895
+    },
+    {
+      "icon_id": "12616253",
+      "name": "开启",
+      "font_class": "kaiqi",
+      "unicode": "e610",
+      "unicode_decimal": 58896
+    },
+    {
+      "icon_id": "12616254",
+      "name": "删 除 (2)",
+      "font_class": "shanchu",
+      "unicode": "e611",
+      "unicode_decimal": 58897
+    },
+    {
+      "icon_id": "12616255",
+      "name": "导入",
+      "font_class": "daoru",
+      "unicode": "e612",
+      "unicode_decimal": 58898
+    },
+    {
+      "icon_id": "12616256",
+      "name": "左",
+      "font_class": "zuo",
+      "unicode": "e613",
+      "unicode_decimal": 58899
+    },
+    {
+      "icon_id": "12616257",
+      "name": "删 除",
+      "font_class": "shanchu1",
+      "unicode": "e614",
+      "unicode_decimal": 58900
+    },
+    {
+      "icon_id": "12616258",
+      "name": "编组 12",
+      "font_class": "bianzu",
+      "unicode": "e615",
+      "unicode_decimal": 58901
+    },
+    {
+      "icon_id": "12616259",
+      "name": "编组 14",
+      "font_class": "bianzu1",
+      "unicode": "e616",
+      "unicode_decimal": 58902
+    },
+    {
+      "icon_id": "12616260",
+      "name": "编组 13",
+      "font_class": "bianzu2",
+      "unicode": "e617",
+      "unicode_decimal": 58903
+    },
+    {
+      "icon_id": "12616261",
+      "name": "添加",
+      "font_class": "tianjia",
+      "unicode": "e618",
+      "unicode_decimal": 58904
+    }
+  ]
+}

UI/图标/图标/font_1592179_fsameoezhkf/iconfont.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<!--
+2013-9-30: Created.
+-->
+<svg>
+<metadata>
+Created by iconfont
+</metadata>
+<defs>
+
+<font id="iconfont" horiz-adv-x="1024" >
+  <font-face
+    font-family="iconfont"
+    font-weight="500"
+    font-stretch="normal"
+    units-per-em="1024"
+    ascent="896"
+    descent="-128"
+  />
+    <missing-glyph />
+    
+    <glyph glyph-name="you" unicode="&#58880;" d="M1006.644068-110.644068m-52.067797 0l-885.152542 0q-52.067797 0-52.067797 52.067797l0 885.152542q0 52.067797 52.067797 52.067797l885.152542 0q52.067797 0 52.067797-52.067797l0-885.152542q0-52.067797-52.067797-52.067797ZM143.186441 784.922034L514.169492 389.20678 143.186441-6.508475H514.169492L885.152542 389.20678l-370.98305 395.715254z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="youshang" unicode="&#58881;" d=""  horiz-adv-x="1041" />
+
+    
+    <glyph glyph-name="yichang" unicode="&#58882;" d="M378.88 156.16c0 199.68 161.28 360.96 360.96 360.96 33.28 0 64-5.12 94.72-12.8V819.2c0 40.96-33.28 76.8-76.8 76.8H76.8C33.28 896 0 862.72 0 819.2v-796.16c0-40.96 33.28-76.8 76.8-76.8h368.64c-40.96 61.44-66.56 133.12-66.56 209.92zM189.44 744.96h455.68c20.48 0 38.4-17.92 38.4-38.4s-17.92-38.4-38.4-38.4H189.44c-20.48 0-38.4 17.92-38.4 38.4s17.92 38.4 38.4 38.4z m0-227.84h151.04c20.48 0 38.4-17.92 38.4-38.4s-17.92-38.4-38.4-38.4H189.44c-20.48 0-38.4 17.92-38.4 38.4s17.92 38.4 38.4 38.4z m76.8-304.64h-76.8c-20.48 0-38.4 17.92-38.4 38.4s17.92 38.4 38.4 38.4h76.8c20.48 0 38.4-17.92 38.4-38.4s-17.92-38.4-38.4-38.4z m473.6 227.84c156.16 0 284.16-128 284.16-284.16S896-128 739.84-128s-284.16 128-284.16 284.16 128 284.16 284.16 284.16z m0-122.88c-20.48 0-38.4-17.92-38.4-38.4v-153.6c0-20.48 17.92-38.4 38.4-38.4s38.4 17.92 38.4 38.4v153.6c0 20.48-17.92 38.4-38.4 38.4z m0-256c-20.48 0-38.4-17.92-38.4-38.4s17.92-38.4 38.4-38.4 38.4 17.92 38.4 38.4-17.92 38.4-38.4 38.4z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="youxia" unicode="&#58883;" d=""  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="zhongzhi" unicode="&#58884;" d="M1024 896m0-53.894737l0-916.210526q0-53.894737-53.894737-53.894737l-916.210526 0q-53.894737 0-53.894737 53.894737l0 916.210526q0 53.894737 53.894737 53.894737l916.210526 0q53.894737 0 53.894737-53.894737ZM835.116912 571.966877L891.957895 628.448561 892.335158 384l-246.029474 0.377263 95.752983 95.142176c-59.176421 125.556772-209.596632 179.667088-335.961825 120.867929a251.724351 251.724351 0 0 1-127.155649-133.425403l-132.652912 0.07186C198.512281 668.420491 405.162667 789.611789 607.860772 737.711158a378.826105 378.826105 0 0 0 227.25614-165.744281z m-538.606035-298.217544c59.266246-125.538807 209.740351-179.577263 336.069614-120.670315a251.778246 251.778246 0 0 1 126.976 133.245754l132.778667 0.053895c-52.241965-201.422596-258.928281-322.63186-461.626386-270.713263a378.88 378.88 0 0 0-227.184281 165.690385l-56.858947-56.481684-0.377263 244.502456 246.047438-0.377263-95.824842-95.178105 0-0.053895z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="zhanshi" unicode="&#58885;" d="M512 601.656889C358.4 601.656889 224.085333 467.285333 224.085333 384c0-83.171556 134.371556-217.656889 287.914667-217.656889 159.971556 0 287.914667 153.6 287.914667 217.656889 0 63.943111-127.943111 217.656889-287.914667 217.656889z m0-313.685333c-51.2 0-96.028444 44.828444-96.028444 96.028444 0 51.2 44.828444 96.028444 96.028444 96.028444 51.2 0 96.028444-44.828444 96.028444-96.028444 0-51.2-44.828444-96.028444-96.028444-96.028444zM512 896C230.4 896 0 665.6 0 384s230.4-512 512-512 512 230.4 512 512-230.4 512-512 512z m0-793.6c-185.571556 0-352.028444 159.971556-352.028444 281.6 0 121.628444 166.456889 281.6 352.028444 281.6 185.571556 0 352.028444-172.828444 352.028444-281.6 0-108.771556-166.456889-281.6-352.028444-281.6z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="zuoshang" unicode="&#58886;" d="M1006.644068 879.286237m0-52.067796l0-885.794712q0-52.067797-52.067797-52.067797l-885.794712 0q-52.067797 0-52.067796 52.067797l0 885.794712q0 52.067797 52.067796 52.067796l885.794712 0q52.067797 0 52.067797-52.067796ZM395.472271-59.461424l17.49478 542.494373 542.494373 17.49478-262.491119 262.491118L150.475932 745.524068l-17.494779-542.494373z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="xia" unicode="&#58887;" d=""  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="yunhanglushu" unicode="&#58888;" d="M1037.767111 529.59763l-76.231111 220.008296-1.517037 2.048a51.275852 51.275852 0 0 1-3.565037 6.257778C930.702222 806.912 883.749926 896 763.904 896H372.811852C251.828148 895.734519 204.420741 805.205333 179.920593 756.773926L173.700741 744.296296v-5.309629c0-0.910222-0.910222-1.820444-0.910222-2.692741L100.958815 530.469926C37.05363 486.855111 0 423.632593 0 357.679407V65.422222c0-40.808296 14.184296-80.402963 40.011852-111.881481v-6.712889h5.423407a182.878815 182.878815 0 0 1 113.246815-59.543704 177.682963 177.682963 0 0 1 183.940741 95.345778l449.725629 1.744593a182.992593 182.992593 0 0 1 186.671408-98.152297A179.503407 179.503407 0 0 1 1137.777778 64.739556v292.029629c-0.606815 64.625778-37.850074 128.265481-100.010667 172.828445z m-778.126222-333.368889a80.175407 80.175407 0 0 0-80.023704 80.327111c0 44.373333 35.84 80.327111 80.023704 80.327111s80.023704-35.991704 80.023704-80.327111c0-44.373333-35.84-80.365037-80.023704-80.365037z m621.340444 0a80.175407 80.175407 0 0 0-80.023703 80.327111c0 44.373333 35.84 80.327111 80.023703 80.327111s80.023704-35.991704 80.023704-80.327111c0-44.373333-35.84-80.365037-80.023704-80.365037zM179.655111 469.750519l86.281482 246.897777v0.872297c25.78963 49.910519 49.682963 84.612741 107.406222 84.61274h392.078222c58.595556 0 82.488889-36.484741 109.150815-88.177777l1.782518-3.565037c0-1.782519 1.782519-3.565037 2.654815-6.257778l81.957926-234.382222H179.655111z"  horiz-adv-x="1137" />
+
+    
+    <glyph glyph-name="zongliang" unicode="&#58889;" d="M512 482.486857c272.64 0 493.714286 92.598857 493.714286 206.811429C1005.714286 803.547429 784.64 896 512 896S18.285714 803.401143 18.285714 689.298286s221.074286-206.811429 493.714286-206.811429z m419.218286 10.752c-109.092571-59.904-267.483429-88.32-419.218286-88.32-151.844571 0-310.125714 28.416-419.218286 88.32C45.604571 461.531429 18.285714 424.228571 18.285714 384.073143c0-114.249143 221.074286-206.811429 493.714286-206.811429S1005.714286 269.824 1005.714286 384.073143c0 40.118857-27.318857 77.421714-74.496 109.165714z m0-305.225143c-109.092571-59.904-267.483429-88.356571-419.218286-88.356571-151.844571 0-310.125714 28.452571-419.218286 88.356571C45.604571 156.269714 18.285714 118.930286 18.285714 78.811429 18.285714-35.401143 239.36-128 512-128S1005.714286-35.401143 1005.714286 78.811429c0 40.118857-27.318857 77.568-74.496 109.202285z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="zuoxia" unicode="&#58890;" d="M16.713763 878.644068m52.067796 0l885.794712 0q52.067797 0 52.067797-52.067797l0-885.794712q0-52.067797-52.067797-52.067796l-885.794712 0q-52.067797 0-52.067796 52.067796l0 885.794712q0 52.067797 52.067796 52.067797ZM955.461424 267.472271l-542.494373 17.49478-17.49478 542.494373-262.491118-262.491119L150.475932 22.475932l542.494373-17.494779z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="dingweiweizhi" unicode="&#58891;" d="M511.99904 896C282.23904 896 95.99904 706.112 95.99904 471.808c0-117.12 46.592-223.104 121.856-299.904L511.99904-128l294.144 299.904A427.072 427.072 0 0 1 927.99904 471.808C927.99904 706.112 741.75904 896 511.99904 896z m0-612.608C409.59904 283.648 326.78304 368 327.03904 471.808v0.128C326.78304 575.68 409.59904 660.096 511.87104 660.352H511.99904c102.4-0.256 185.216-84.608 184.96-188.416v-0.128c0.32-103.744-82.432-188.16-184.768-188.48H511.99904v0.064z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="baocunmianxing" unicode="&#58892;" d="M170.642286 896v-385.974857c0-31.890286 30.573714-57.782857 68.315428-57.782857h546.084572c37.741714 0 68.315429 25.892571 68.315428 57.782857V896A170.642286 170.642286 0 0 0 1024 725.357714v-682.715428A170.642286 170.642286 0 0 0 853.357714-128H170.642286A170.642286 170.642286 0 0 0 0 42.642286V725.357714A170.642286 170.642286 0 0 0 170.642286 896z m68.315428 0h546.084572v-375.442286H238.957714V896z m443.684572-136.557714a34.157714 34.157714 0 0 1-34.084572-34.084572v-102.4a34.157714 34.157714 0 0 1 68.242286 0v102.4a34.157714 34.157714 0 0 1-34.157714 34.084572z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="shang" unicode="&#58893;" d="M1006.644068 878.644068m0-52.067797l0-885.152542q0-52.067797-52.067797-52.067797l-885.152542 0q-52.067797 0-52.067797 52.067797l0 885.152542q0 52.067797 52.067797 52.067797l885.152542 0q52.067797 0 52.067797-52.067797ZM111.077966 15.186441L506.79322 386.169492 902.508475 15.186441 902.508475 386.169492 506.79322 757.152542l-395.715254-370.98305z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="fenxi" unicode="&#58894;" d="M284.444339-128a31.895692 31.895692 0 0 0-31.516433 32.312877 31.933618 31.933618 0 0 0 31.478507 31.326803H739.555282c17.673475-0.265481 31.781914-14.791106 31.478507-32.350803a31.933618 31.933618 0 0 0-31.478507-31.288877h-455.110943zM895.961742 895.999621H127.999953A127.658619 127.658619 0 0 1 0 768.682335v-587.775783a127.658619 127.658619 0 0 1 127.999953-127.317286h767.999715A127.658619 127.658619 0 0 1 1023.999621 180.906552V768.682335A127.658619 127.658619 0 0 1 895.999668 895.999621z m-46.724723-260.171756l-246.783909-288.729967c-1.592888-1.896296-1.592888-1.896296-3.33748-3.565036a44.980131 44.980131 0 0 0-63.336273 1.744592l-139.3398 146.735353-175.862454-158.682015a32.123247 32.123247 0 0 0-45.131835 3.223703 31.706062 31.706062 0 0 0 2.123851 43.88028l189.819189 171.34927a44.980131 44.980131 0 0 0 62.729459-2.351407l137.48143-144.876983 232.865099 272.497676a32.123247 32.123247 0 0 0 45.169761 2.920296c13.008588-11.339848 14.601476-30.909618 3.602962-44.183688z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="daochu" unicode="&#58895;" d="M189.741176 280.756706c0-53.910588 9.336471-106.194824 26.262589-154.202353 61.801412 179.501176 226.183529 307.621647 420.98447 307.621647v-76.739765c0-29.515294 16.082824-55.597176 41.562353-69.089882 10.119529-5.059765 21.985882-8.432941 32.948706-8.432941 16.143059 0 31.322353 5.059765 44.93553 15.179294l298.164705 230.942118c18.672941 14.275765 29.635765 37.044706 29.635765 61.500235 0 24.455529-11.023059 47.224471-29.635765 61.500235L756.434824 880.820706A72.161882 72.161882 0 0 1 678.490353 887.567059c-25.419294-12.649412-41.502118-39.634824-41.502118-69.089883V741.797647C390.505412 742.580706 189.741176 535.311059 189.741176 280.756706z m840.282353 22.768941c-29.635765 0-54.211765-24.455529-54.211764-53.970823v-64.873412c0-113.784471-4.216471-204.8-216.847059-204.8H325.270588c-219.376941 0-216.847059 96.918588-216.847059 215.762823V465.317647c-15.239529 169.441882 65.234824 206.486588 162.635295 214.076235h3.373176c29.635765 0 54.211765 24.455529 54.211765 53.970824s-24.576 54.814118-54.211765 54.814118H271.058824v0.783058h-54.211765C97.400471 788.961882 0 692.043294 0 573.199059v-485.496471C0-31.021176 97.400471-128 216.847059-128h649.697882c119.446588 0 216.847059 96.978824 216.847059 215.762824v161.792a53.187765 53.187765 0 0 1-53.368471 53.970823z"  horiz-adv-x="1084" />
+
+    
+    <glyph glyph-name="kaiqi" unicode="&#58896;" d="M47.047111 391.395556C47.047111 644.778667 256.284444 850.318222 514.446222 850.318222c258.161778 0 467.399111-205.482667 467.399111-458.922666s-209.237333-458.922667-467.399111-458.922667c-258.161778 0-467.399111 205.482667-467.399111 458.922667M0 390.257778c0-279.267556 230.570667-505.685333 515.072-505.685334h676.522667c284.444444 0 515.072 226.417778 515.072 505.742223C1706.666667 669.582222 1476.096 896 1191.594667 896H515.072C230.627556 896 0 669.582222 0 390.314667"  horiz-adv-x="1706" />
+
+    
+    <glyph glyph-name="shanchu" unicode="&#58897;" d="M784.96 770.88H221.568C170.048 770.88 128 728.96 128 676.8v-30.976h750.528v31.488c0 51.584-41.984 93.568-93.568 93.568zM620.864 833.472l14.016-98.56H371.712l13.952 98.56h235.2zM628.352 896H378.24a55.68 55.68 0 0 1-53.504-46.528l-18.56-131.136a39.872 39.872 0 0 1 40.576-46.528h312.704a39.872 39.872 0 0 1 40.512 46.528L681.408 849.472A54.72 54.72 0 0 1 628.352 896z m172.16-312.704H206.08a56.384 56.384 0 0 1-57.088-62.592l51.072-563.392c3.008-34.048 33.984-62.528 68.032-62.528h469.376c34.56 0 65.024 27.968 68.032 62.528l51.52 563.392a55.744 55.744 0 0 1-56.512 62.592z m-422.336-562.944H284.16l-30.976 437.824h125.056v-437.824z m187.648 0H440.704V458.176h125.12v-437.824z m156.608 0h-94.08V458.176h125.12l-31.04-437.824z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="daoru" unicode="&#58898;" d="M973.183381 535.133968a8.32243 8.32243 0 0 1 1.841849 8.663514 7.230964 7.230964 0 0 1-6.753447 4.979815h-200.693358l0.4093 323.619745A24.557991 24.557991 0 0 1 761.711794 889.178336 20.669642 20.669642 0 0 1 746.294833 896H549.830906a20.737859 20.737859 0 0 1-15.280527-6.889881 24.626207 24.626207 0 0 1-6.344148-16.713077l0.4093-323.619745H327.785739a7.230964 7.230964 0 0 1-6.685231-4.979815 8.32243 8.32243 0 0 1 1.84185-8.663514l310.385717-313.660115a20.669642 20.669642 0 0 1 14.734794-6.275931 20.669642 20.669642 0 0 1 14.734795 6.275931l310.385717 313.660115z m309.226034-333.852241l-194.622077 165.493571a81.859969 81.859969 0 0 1-45.5005 17.05416h-77.221237L1184.927835 179.725268l-254.857371-0.136433-95.093998-148.507628H460.262456L369.056807 179.520618l-253.493038 0.136433 227.502498 204.240624-89.295583-0.068217a81.859969 81.859969 0 0 1-45.432283-17.05416L13.648107 201.281727c-11.051096-9.34568-16.508427-28.855639-12.142562-43.385784l77.630537-258.813936c4.365865-14.461928 19.373526-26.331623 33.357938-26.331624h1072.570248c13.984411 0 28.923856 11.869696 33.221505 26.39984l76.402638 258.74572c4.229432 14.530145-1.2279 34.040104-12.278996 43.385784z"  horiz-adv-x="1296" />
+
+    
+    <glyph glyph-name="zuo" unicode="&#58899;" d=""  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="shanchu1" unicode="&#58900;" d="M784.96 770.88H221.568C170.048 770.88 128 728.96 128 676.8v-30.976h750.528v31.488c0 51.584-41.984 93.568-93.568 93.568zM620.864 833.472l14.016-98.56H371.712l13.952 98.56h235.2zM628.352 896H378.24a55.68 55.68 0 0 1-53.504-46.528l-18.56-131.136a39.872 39.872 0 0 1 40.576-46.528h312.704a39.872 39.872 0 0 1 40.512 46.528L681.408 849.472A54.72 54.72 0 0 1 628.352 896z m172.16-312.704H206.08a56.384 56.384 0 0 1-57.088-62.592l51.072-563.392c3.008-34.048 33.984-62.528 68.032-62.528h469.376c34.56 0 65.024 27.968 68.032 62.528l51.52 563.392a55.744 55.744 0 0 1-56.512 62.592z m-422.336-562.944H284.16l-30.976 437.824h125.056v-437.824z m187.648 0H440.704V458.176h125.12v-437.824z m156.608 0h-94.08V458.176h125.12l-31.04-437.824z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="bianzu" unicode="&#58901;" d="M512 384m-512 0a512 512 0 1 1 1024 0 512 512 0 1 1-1024 0ZM427.776 475.9552l-35.712 128.3328h-95.232v25.6512h95.232l49.28-135.5008 402.9952 7.168v-25.6512H427.776zM439.7312 475.9552h404.608v68.4544H416.6144zM125.7472 340.5312V202.24h51.968v4.5056c-0.4096 56.9344 46.1824 103.5264 104.3712 104.4224 58.1888-0.896 104.7552-47.488 104.3712-104.448 0-1.4848 34.048-2.5344 10.496-2.5344h212.0192c0 1.5104 5.6576 1.0496 5.6576 2.56-0.384 56.9344 46.1824 103.5264 104.3712 104.4224a104.448 104.448 0 0 0 39.936-7.936l59.7248 62.336h25.6768v103.7568H396.6976l-35.328 92.2112H243.5584L126.464 340.5312h-0.7168z m70.6816 25.344l73.3952 139.392h48.0768l31.6672-139.7248-153.1392 0.3584zM639.0272 202.2144a85.5552 85.5552 0 1 1 171.1104 0 85.5552 85.5552 0 1 1-171.1104 0zM211.3024 202.2144a85.5552 85.5552 0 1 1 171.0848 0 85.5552 85.5552 0 1 1-171.0848 0zM449.408 544.4096l-15.6928 30.2848 5.888 7.168 46.8992 26.8288h58.5216l35.328 51.968 69.0432 7.3216 64.1536 30.4128 37.3248-89.7024h31.5904l27.776-4.7616 34.0992-59.52z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="bianzu1" unicode="&#58902;" d="M512 384m-512 0a512 512 0 1 1 1024 0 512 512 0 1 1-1024 0ZM851.3792 597.0944l-37.1968 76.8512c-6.0672 12.5952-20.4288 19.456-34.56 16.64L572.7232 648.96l0.0768-0.256c-50.6368-12.5696-87.9104-56.7808-87.808-109.312 0.128-62.0288 54.3488-113.152 118.9632-112.3328a120.96 120.96 0 0 1 57.6 15.36l0.1792-0.4608 179.072 117.9136c12.5184 8.2688 16.9472 24.0128 10.5728 37.1968zM394.88 353.28v151.296c0 16.4864-13.9008 29.824-31.0528 29.824h-33.408c-23.6032 0-46.336-8.6272-63.6672-24.1408l-93.44-83.84a58.4704 58.4704 0 0 1-19.712-43.52v-187.648c0-16.4608 13.9008-29.7984 31.0528-29.7984h15.7696c0 52.7872 44.5952 95.7184 99.6352 95.7184 55.0656 0 99.584-42.8032 99.584-95.6416 0-0.0768 208.512-0.1536 208.512-0.0768 0 52.7872 44.544 95.7184 99.5584 95.7184 54.9632 0 99.5584-43.008 99.5584-95.7952 0-0.0768 32.0768 0.0768 32.0768 0.0768 17.152 0 31.0528 13.3376 31.0528 29.824V293.632c0 16.4864-13.9008 29.824-31.0528 29.824H425.9584c-17.152 0-31.0784 13.312-31.0784 29.7984z m-156.416-190.5152c0-33.3312 28.16-60.3648 62.9248-60.3648 34.7392 0 62.8992 27.0336 62.8992 60.3648 0 33.3568-28.16 60.3904-62.8992 60.3904-34.7392 0-62.8992-27.0336-62.8992-60.3904z m407.7312 0c0-33.3312 28.16-60.3648 62.8992-60.3648 34.7392 0 62.8992 27.0336 62.8992 60.3648 0 33.3568-28.16 60.3904-62.8992 60.3904-34.7392 0-62.8992-27.0336-62.8992-60.3904z m218.2912 311.5008c0.0768 23.9104-27.7248 38.144-48.384 24.832l-131.456-84.7616c-45.44-26.8288-81.3312-25.7792-105.7024-21.9136-64.2304 10.2144-96.9984 45.6192-113.6128 81.9968-20.8896 45.824-16.0768-24.2432-16.0768-24.2432v-43.52c0-16.4608 13.9008-29.824 31.0528-29.824h352.896c17.152 0 30.976 13.2864 31.0528 29.7472l0.256 67.6864z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="bianzu2" unicode="&#58903;" d="M512 384m-499.512195 0a499.512195 499.512195 0 1 1 999.02439 0 499.512195 499.512195 0 1 1-999.02439 0ZM809.284683 213.966049h-53.947317c-6.743415 47.50361-46.154927 84.067902-94.357854 84.067902s-87.964098-36.913951-94.382829-84.067902h-107.844683c-14.835512 0-26.973659 12.312976-26.973659 27.672975V582.955707h45.505561v-322.510048h55.620683c22.577951 49.876293 72.129561 84.042927 128.074927 84.042926s105.496976-34.166634 128.074927-84.042926h2.023024V582.955707h45.155903V241.639024c0-15.010341-12.113171-27.672976-26.973659-27.672975z m-58.99239 218.661463c7.417756 0 12.487805-4.096 15.160195-11.963317 0.349659-1.698341 0.674341-3.396683 0.674341-5.444683 0-9.915317-6.044098-15.384976-18.531902-16.059317 5.070049-5.144976 7.417756-10.589659 7.417756-15.384975 0-5.12-2.697366-9.565659-7.742439-13.312a16.384 16.384 0 0 0-9.116098-2.747318c-9.765463 0-16.483902 8.192-20.554926 25.275318l-80.221659 30.420292-80.221659-30.420292c-4.046049-16.733659-10.764488-25.275317-20.230243-25.275318a21.004488 21.004488 0 0 0-9.415805 2.747318c-5.070049 3.746341-7.417756 7.842341-7.417756 13.312 0 5.12 2.347707 10.24 7.417756 15.384975-12.487805 0.674341-18.881561 6.144-18.881561 16.059317 0 2.048 0.349659 3.746341 0.674341 5.444683 3.022049 7.867317 8.092098 11.988293 15.484878 11.988293 6.094049 0 13.162146-3.096976 21.254244-8.891317l46.179903 17.083317-46.854244 17.732683c-7.742439-5.095024-15.160195-7.842341-21.578927-7.842342-7.068098 0-11.788488 4.096-14.485854 11.988293a26.898732 26.898732 0 0 0-0.674341 5.444683c0 9.915317 6.393756 15.384976 18.881561 16.059317-5.070049 5.12-7.417756 10.589659-7.417756 15.36 0 5.144976 2.347707 9.565659 7.417756 13.336976a19.106341 19.106341 0 0 0 8.41678 2.048c10.115122 0 16.858537-8.891317 20.554927-26.299318l80.571317-30.420292 80.546342 31.094634c3.721366 17.083317 10.439805 25.624976 20.554926 25.624976 3.047024 0 5.74439-0.674341 8.441756-2.048 5.394732-3.746341 7.742439-8.192 7.742439-13.336976 0-5.12-2.697366-10.24-7.417756-15.36 12.487805-0.674341 18.531902-6.144 18.531903-16.059317 0-1.698341-0.324683-3.746341-0.674342-5.469659-2.347707-7.867317-7.068098-11.963317-14.485853-11.963317-6.743415 0-13.811512 2.747317-21.578927 7.867317l-46.504586-17.757658 45.830244-17.432976c8.766439 6.144 16.184195 9.240976 22.253269 9.240976z m-61.340098 84.742244v-4.096c0-6.843317-1.998049-12.312976-6.393756-16.733658a26.074537 26.074537 0 0 0-16.184195-7.867318c-6.069073-0.349659-10.789463 0.674341-14.161171 3.072a24.825756 24.825756 0 0 0-15.834536-5.494634c-6.069073 0-11.813463 2.072976-16.858537 5.819317-3.371707-2.722341-8.092098-4.096-14.835512-3.396683a24.076488 24.076488 0 0 0-16.184195 7.492683 23.102439 23.102439 0 0 0-6.393756 16.733659v5.494634c-22.92761 6.818341-40.785171 17.757659-53.248 32.792976a80.49639 80.49639 0 0 0-18.881561 52.623609c0 4.420683 0.349659 9.216 1.348683 14.336 4.370732 30.744976 17.857561 56.045268 40.110829 76.17561 23.601951 21.204293 52.248976 31.469268 86.290732 31.469269s62.68878-10.614634 86.290731-31.793952c22.577951-19.805659 36.06478-45.105951 40.435512-75.850927 0.999024-5.12 1.348683-9.915317 1.348683-14.336 0-20.504976-6.393756-38.262634-19.555902-53.297951-13.486829-15.035317-32.693073-26.324293-57.294049-33.142634z m-80.896 126.75122c-6.743415 8.192-15.160195 12.288-24.600975 12.288-9.765463 0-17.857561-4.096-24.600976-12.288-6.743415-8.192-10.439805-18.107317-10.439805-30.070635 0-11.613659 3.346732-21.853659 10.439805-30.070634 6.743415-8.192 15.160195-12.288 24.600976-12.288 9.765463 0 17.857561 4.096 24.600975 12.288 6.743415 8.216976 10.46478 18.107317 10.464781 30.070634s-3.721366 21.878634-10.464781 30.070635z m38.762146-83.018927c-3.022049 5.12-6.069073 7.492683-9.091121 7.492683-3.371707 0-6.418732-2.372683-9.79044-6.818342a22.153366 22.153366 0 0 1-5.045073-13.661658c0-2.747317 0.674341-5.12 2.347708-7.168 2.697366-3.072 7.093073-4.445659 12.812487-4.445659 8.766439 0 13.162146 3.421659 13.162147 10.24a33.642146 33.642146 0 0 1-4.395708 14.360976z m66.73483 83.018927c-6.743415 8.192-15.160195 12.288-24.925659 12.288-9.44078 0-17.882537-4.096-24.625951-12.288-6.743415-8.192-10.090146-18.107317-10.090146-30.070635 0-11.613659 3.346732-21.853659 10.090146-30.070634 6.743415-8.192 14.835512-12.288 24.625951-12.288 9.740488 0 18.182244 4.096 24.925659 12.288 6.743415 8.216976 10.115122 18.107317 10.115122 30.070634a43.857171 43.857171 0 0 1-10.115122 30.070635zM377.880976 213.966049c-6.743415 47.50361-46.179902 84.067902-94.38283 84.067902s-87.964098-36.913951-94.357853-84.067902h-26.973659c-14.835512 0-26.973659 12.312976-26.973658 27.672975v137.690537c0 25.974634 20.554927 55.69561 20.554926 55.69561l60.341074 81.994927c12.487805 15.035317 20.554927 27.672976 40.460487 27.672975h121.331513c14.835512 0 26.973659-12.288 26.973658-27.672975V241.639024c0-15.010341-12.138146-27.323317-26.973658-27.672975z m-18.531903 284.27239H259.896195l-6.069073-7.192976-2.023024-2.722341-59.342049-80.621268c-6.044098-9.240976-12.113171-22.902634-12.113171-28.372293l1.348683-11.613659 177.626537 1.723318v128.799219z m-76.525268-225.50478c38.762146 0 70.43122-32.468293 70.431219-72.07961 0-39.636293-31.669073-72.07961-70.431219-72.07961-38.762146 0-70.43122 32.468293-70.43122 72.07961 0 39.636293 31.669073 72.07961 70.43122 72.07961z m379.529366 0c38.762146 0 70.43122-32.468293 70.431219-72.07961 0-39.636293-31.669073-72.07961-70.431219-72.07961-38.762146 0-70.43122 32.468293-70.43122 72.07961 0 39.960976 31.669073 72.07961 70.43122 72.07961z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="tianjia" unicode="&#58904;" d="M874.03928 746.096168A508.584406 508.584406 0 0 1 512 895.997724a508.755072 508.755072 0 0 1-362.03928-149.901556A508.698184 508.698184 0 0 1 0.002276 384c0-136.81717 53.304652-265.442376 150.015333-362.096168A508.584406 508.584406 0 0 1 512-127.997724a508.299963 508.299963 0 0 1 361.982391 149.901556A509.039515 509.039515 0 0 1 1023.997724 384a508.356852 508.356852 0 0 1-149.958444 362.03928zM767.998862 347.30683H548.636282v-220.443465a36.636282 36.636282 0 0 0-36.579393-36.750059 36.636282 36.636282 0 0 0-36.579393 36.750059V347.249941H256.001138A36.636282 36.636282 0 0 0 219.421745 384c0 20.309243 16.383927 36.750059 36.579393 36.750059h219.476358V641.136635c0 20.309243 16.383927 36.750059 36.579393 36.750059 20.195466 0 36.579393-16.440816 36.579393-36.750059v-220.386576H767.998862c20.195466 0 36.579393-16.497704 36.579393-36.750059a36.636282 36.636282 0 0 0-36.579393-36.750059z"  horiz-adv-x="1024" />
+
+    
+
+
+  </font>
+</defs></svg>

UI/图标/定位 位置.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="13px" height="16px" viewBox="0 0 13 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>F641DF01-F6EB-4FBF-A6E0-29E9E9E6C104</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="操作" transform="translate(-8.000000, -2.000000)" fill="#799AF4" fill-rule="nonzero">
+            <g id="定位-位置" transform="translate(8.000000, 2.000000)">
+                <path d="M6.49998464,0 C2.91013004,0 0,2.96659375 0,6.62776563 C0,8.45740625 0.727991126,10.113875 1.90356175,11.313875 L6.49998464,16 L11.0963921,11.313875 L11.0963919,11.3138752 C12.3184024,10.0691611 13.0030522,8.38373455 12.9999795,6.6277658 C12.9999795,2.96659392 10.0898237,0 6.49998447,0 L6.49998464,0 Z M6.49998464,9.57176563 L6.49998473,9.57176563 C4.89994274,9.56762328 3.60617992,8.24956719 3.61025543,6.6278125 C3.61025543,6.62716884 3.61025543,6.62652518 3.61025543,6.62588153 L3.61025543,6.62588559 C3.60564982,5.00463559 4.89857624,3.68657309 6.4980941,3.68188069 C6.49872234,3.68188069 6.49935058,3.68188069 6.49997881,3.68188069 L6.49997894,3.68188069 C8.10002093,3.68603178 9.39378374,5.00409475 9.38969293,6.62584944 C9.38969293,6.6264879 9.38969293,6.62712637 9.38969293,6.62776483 L9.38969293,6.62777913 C9.39479926,8.24901351 8.10228009,9.56749788 6.50276377,9.57270871 C6.50183282,9.57270871 6.50090186,9.57270871 6.49997091,9.57270871 L6.49998464,9.57176563 Z" id="形状"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/导入.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="19px" height="15px" viewBox="0 0 19 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>0EF5EFC0-6C3A-49CA-8607-CF4162891FA6</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="基础操作" transform="translate(-151.000000, -148.000000)" fill="#3BB7FF" fill-rule="nonzero">
+            <g id="导入">
+                <g transform="translate(151.000000, 148.000000)">
+                    <path d="M14.2663652,5.28966291 C14.2973156,5.2584786 14.3091911,5.20858754 14.2928513,5.16327224 C14.2765467,5.11780313 14.2367029,5.09013714 14.1944946,5.09013714 L11.2519997,5.09013714 L11.2583345,0.345949756 C11.2584227,0.257453217 11.2275959,0.168899 11.1656244,0.101397078 C11.1037236,0.0338374776 11.0225008,0 10.9412604,0 L8.05923708,0 C7.97812017,0 7.89687975,0.0338374776 7.83487305,0.101397078 C7.77300752,0.168937452 7.74214534,0.257453217 7.74223357,0.345949756 L7.74809191,5.09013714 L4.80543822,5.09013714 C4.76331813,5.09013714 4.72350962,5.1177839 4.7070639,5.16327224 C4.69074171,5.20862599 4.70261721,5.25845937 4.73360291,5.28966291 L9.28431933,9.88752243 C9.34094412,9.9446424 9.41669675,9.9796911 9.49991348,9.9796911 C9.5832008,9.9796911 9.65895343,9.94462317 9.71552528,9.88752243 L14.2663652,5.28966291 Z M18.7989419,10.183658 L15.9459986,7.75822225 C15.7843824,7.62081518 15.4843892,7.50842092 15.2794354,7.50842092 L14.1466044,7.50842092 L17.3714645,10.4991348 L13.6349345,10.5011151 L12.2405954,12.6779608 L6.74723251,12.6779608 L5.40943005,10.5031146 L1.6929984,10.5011343 L5.02775535,7.50659446 L3.71947401,7.50845937 C3.51448487,7.50845937 3.21449174,7.62087285 3.05289318,7.7582607 L0.199949803,10.1836773 C0.0383335961,10.3211036 -0.0418127968,10.6072033 0.021887881,10.8195335 L1.16001254,14.6139836 C1.22369557,14.8262945 1.44352467,15 1.6485138,15 L17.3723291,15 C17.5773182,15 17.7963886,14.8260254 17.8591893,14.6134068 L18.9787508,10.8201102 C19.0414633,10.6074532 18.9605934,10.3210843 18.7989419,10.1836773 L18.7989419,10.183658 Z" id="Shape"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/导出.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="18px" height="17px" viewBox="0 0 18 17" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>E5D9D9B6-EB2F-403D-9A1F-2D5753F78870</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="基础操作" transform="translate(-151.000000, -187.000000)" fill="#CCCCCC" fill-rule="nonzero">
+            <g id="导出">
+                <g transform="translate(151.000000, 187.000000)">
+                    <path d="M3.15,10.2139918 C3.15,11.109465 3.3046875,11.9769547 3.5859375,12.7744856 C4.6125,9.79423868 7.340625,7.66748971 10.575,7.66748971 L10.575,8.94074074 C10.575,9.43045267 10.8421875,9.86419753 11.2640625,10.0880658 C11.4328125,10.1720165 11.6296875,10.2279835 11.8125,10.2279835 C12.0796875,10.2279835 12.3328125,10.1440329 12.5578125,9.97613169 L17.5078125,6.14238683 C17.8171875,5.90452675 18,5.52674897 18,5.12098765 C18,4.71522634 17.8171875,4.33744856 17.5078125,4.09958848 L12.5578125,0.251851852 C12.346875,0.0839506173 12.0796875,0 11.8125,0 C11.6296875,0 11.4328125,0.0419753086 11.2640625,0.139917695 C10.8421875,0.349794239 10.575,0.797530864 10.575,1.2872428 L10.575,2.56049383 C6.4828125,2.54650206 3.15,5.98847737 3.15,10.2139918 Z M17.1,9.83621399 C16.6078125,9.83621399 16.2,10.2419753 16.2,10.7316872 L16.2,11.6271605 L16.2,11.8090535 C16.2,13.6979424 16.1296875,15.2090535 12.6,15.2090535 L5.4,15.2090535 C1.7578125,15.2090535 1.8,13.6 1.8,11.6271605 L1.8,7.14979424 C1.546875,4.33744856 2.8828125,3.7218107 4.5,3.59588477 L4.5,3.59588477 L4.55625,3.59588477 C5.0484375,3.59588477 5.45625,3.19012346 5.45625,2.70041152 C5.45625,2.21069959 5.0484375,1.7909465 4.55625,1.7909465 L4.5,1.7909465 L4.5,1.77695473 L3.6,1.77695473 C1.6171875,1.77695473 0,3.38600823 0,5.35884774 L0,13.418107 C0,15.3909465 1.6171875,17 3.6,17 L14.3859375,17 C16.36875,17 17.9859375,15.3909465 17.9859375,13.418107 L17.9859375,10.7316872 C18,10.2419753 17.5921875,9.83621399 17.1,9.83621399 L17.1,9.83621399 Z" id="Shape"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/展示.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>1F7468C0-B3F0-48F2-A9E1-6476EA512BE4</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="基础操作" transform="translate(-151.000000, -228.000000)" fill="#CCCCCC" fill-rule="nonzero">
+            <g id="展示">
+                <g transform="translate(151.000000, 228.000000)">
+                    <path d="M9,5.17423876 C6.30086999,5.17423876 3.93885935,7.5362494 3.93885935,9 C3.93885935,10.4615756 6.30086999,12.8257612 9,12.8257612 C11.8122281,12.8257612 14.0611406,10.1266312 14.0611406,9 C14.0611406,7.87554374 11.8122281,5.17423876 9,5.17423876 Z M9,10.6877719 C8.09956501,10.6877719 7.31222813,9.90043499 7.31222813,9 C7.31222813,8.09956501 8.09956501,7.31222813 9,7.31222813 C9.90043499,7.31222813 10.6877719,8.09956501 10.6877719,9 C10.6877719,9.90043499 9.90043499,10.6877719 9,10.6877719 Z M9,0 C4.0497825,0 0,4.0497825 0,9 C0,13.9502175 4.0497825,18 9,18 C13.9502175,18 18,13.9502175 18,9 C18,4.0497825 13.9502175,0 9,0 Z M9,13.9502175 C5.73755437,13.9502175 2.81222813,11.1379894 2.81222813,9 C2.81222813,6.86201063 5.73755437,4.0497825 9,4.0497825 C12.2624456,4.0497825 15.1877719,7.08820686 15.1877719,9 C15.1877719,10.9117931 12.2624456,13.9502175 9,13.9502175 Z" id="Shape"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/左.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="59px" height="59px" viewBox="0 0 59 59" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>5990B23D-F48F-44DE-977D-7B02635915B5</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="场景添加" transform="translate(-20.000000, -93.000000)">
+            <g id="调试">
+                <g transform="translate(12.000000, 15.000000)">
+                    <g id="箭头备份-4" transform="translate(37.500000, 107.500000) scale(1, -1) translate(-37.500000, -107.500000) translate(9.000000, 79.000000)">
+                        <rect id="矩形" stroke="#E5E5E5" fill="#FFFFFF" x="0" y="0" width="57" height="57" rx="3"></rect>
+                        <polygon id="路径" fill="#CCCCCC" points="49.75 51.6 28.375 28.7999742 49.75 6 28.3750519 6 7 28.7999742 28.375 51.6"></polygon>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/左上.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="59px" height="59px" viewBox="0 0 59 59" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>B7ACADF1-D41C-4EC0-80AE-80E1C606A946</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="场景添加" transform="translate(-20.000000, -23.000000)">
+            <g id="调试">
+                <g transform="translate(12.000000, 15.000000)">
+                    <g id="箭头备份" transform="translate(33.000000, 33.500000) scale(-1, -1) rotate(-90.000000) translate(-33.000000, -33.500000) translate(-0.500000, 0.500000)">
+                        <rect id="矩形" stroke="#E5E5E5" fill="#FFFFFF" x="8.96296296" y="0" width="57.037037" height="57.037037" rx="3"></rect>
+                        <polygon id="路径" fill="#CCCCCC" transform="translate(31.794478, 34.205545) rotate(-45.000000) translate(-31.794478, -34.205545) " points="53.1833665 57.0203595 31.7944776 34.2055189 53.1833665 11.3907299 31.7945295 11.3907299 10.4055887 34.2055189 31.7944776 57.0203595"></polygon>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/左下.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="59px" height="59px" viewBox="0 0 59 59" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>13A3BE4E-C90C-4909-8C6C-D5E5D4751497</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="场景添加" transform="translate(-20.000000, -167.000000)">
+            <g id="调试">
+                <g transform="translate(12.000000, 15.000000)">
+                    <g id="箭头备份-7" transform="translate(0.000000, 153.000000)">
+                        <rect id="矩形" stroke="#E5E5E5" fill="#FFFFFF" x="8.96296296" y="0" width="57.037037" height="57.037037" rx="3"></rect>
+                        <polygon id="路径" fill="#CCCCCC" transform="translate(31.794478, 34.205545) rotate(-45.000000) translate(-31.794478, -34.205545) " points="53.1833665 57.0203595 31.7944776 34.2055189 53.1833665 11.3907299 31.7945295 11.3907299 10.4055887 34.2055189 31.7944776 57.0203595"></polygon>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/开启.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="30px" height="18px" viewBox="0 0 30 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>3573DC24-F3E8-4EE6-9F64-7CD43FCB04F5</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="基础操作" transform="translate(-145.000000, -107.000000)" fill="#0069FF" fill-rule="nonzero">
+            <g id="开启">
+                <g transform="translate(145.000000, 107.000000)">
+                    <path d="M0.826999643,8.87012344 C0.826999643,4.41580052 4.50499307,0.80297066 9.04299609,0.80297066 C13.5809991,0.80297066 17.2589925,4.4148283 17.2589925,8.87012344 C17.2589925,13.3254359 13.5809991,16.9372762 9.04299609,16.9372762 C4.50499307,16.9372762 0.826999643,13.3254186 0.826999643,8.87012344 M0,8.88888889 C0,13.7975347 4.05300507,17.7777778 9.05399823,17.7777778 L20.9460018,17.7777778 C25.945993,17.7777778 30,13.7975347 30,8.88888889 C30,3.98024306 25.9469949,0 20.9460018,0 L9.05399823,0 C4.05400702,0 0,3.98024306 0,8.88888889" id="Shape"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/异常.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>BB437F9E-2EE9-4105-8DDF-0A609FF770DC</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="首页" transform="translate(-725.000000, -139.000000)" fill="#0069FF" fill-rule="nonzero">
+            <g id="异常" transform="translate(725.000000, 139.000000)">
+                <path d="M10.36,20.23 C10.36,14.77 14.77,10.36 20.23,10.36 C21.14,10.36 21.98,10.5 22.82,10.71 L22.82,2.1 C22.82,0.98 21.91,0 20.72,0 L2.1,0 C0.91,0 0,0.91 0,2.1 L0,23.87 C0,24.99 0.91,25.97 2.1,25.97 L12.18,25.97 C11.06,24.29 10.36,22.33 10.36,20.23 Z M5.18,4.13 L17.64,4.13 C18.2,4.13 18.69,4.62 18.69,5.18 C18.69,5.74 18.2,6.23 17.64,6.23 L5.18,6.23 C4.62,6.23 4.13,5.74 4.13,5.18 C4.13,4.62 4.62,4.13 5.18,4.13 Z M5.18,10.36 L9.31,10.36 C9.87,10.36 10.36,10.85 10.36,11.41 C10.36,11.97 9.87,12.46 9.31,12.46 L5.18,12.46 C4.62,12.46 4.13,11.97 4.13,11.41 C4.13,10.85 4.62,10.36 5.18,10.36 Z M7.28,18.69 L5.18,18.69 C4.62,18.69 4.13,18.2 4.13,17.64 C4.13,17.08 4.62,16.59 5.18,16.59 L7.28,16.59 C7.84,16.59 8.33,17.08 8.33,17.64 C8.33,18.2 7.84,18.69 7.28,18.69 Z M20.23,12.46 C24.5,12.46 28,15.96 28,20.23 C28,24.5 24.5,28 20.23,28 C15.96,28 12.46,24.5 12.46,20.23 C12.46,15.96 15.96,12.46 20.23,12.46 L20.23,12.46 Z M20.23,15.82 C19.67,15.82 19.18,16.31 19.18,16.87 L19.18,21.07 C19.18,21.63 19.67,22.12 20.23,22.12 C20.79,22.12 21.28,21.63 21.28,21.07 L21.28,16.87 C21.28,16.31 20.79,15.82 20.23,15.82 Z M20.23,22.82 C19.67,22.82 19.18,23.31 19.18,23.87 C19.18,24.43 19.67,24.92 20.23,24.92 C20.79,24.92 21.28,24.43 21.28,23.87 C21.28,23.31 20.79,22.82 20.23,22.82 Z" id="Shape"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/总量.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="27px" height="28px" viewBox="0 0 27 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>36A56FD9-E24F-42C0-9AFE-FCC482782ED7</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="首页" transform="translate(-937.000000, -139.000000)" fill="#7460EE" fill-rule="nonzero">
+            <g id="总量" transform="translate(937.000000, 139.000000)">
+                <path d="M13.5,11.3067843 C20.9551339,11.3067843 27,8.77519782 27,5.65157608 C27,2.52795434 20.9551339,0 13.5,0 C6.04486607,0 0,2.53158646 0,5.65157608 C0,8.7715657 6.04486607,11.3067843 13.5,11.3067843 Z M24.9629464,11.0125827 C21.9796875,12.6506681 17.649442,13.4279414 13.5,13.4279414 C9.34754464,13.4279414 5.0203125,12.6506681 2.03705357,11.0125827 C0.747321429,11.880659 0,12.9012842 0,13.9981839 C0,17.1218057 6.04486607,19.6533921 13.5,19.6533921 C20.9551339,19.6533921 27,17.1218057 27,13.9981839 C27,12.9012842 26.2526786,11.880659 24.9629464,11.0125827 Z M24.9629464,19.3591906 C21.9796875,20.9972759 17.649442,21.7745492 13.5,21.7745492 C9.34754464,21.7745492 5.0203125,20.9972759 2.03705357,19.3591906 C0.747321429,20.2272668 0,21.2478921 0,22.3447918 C0,25.4684135 6.04486607,28 13.5,28 C20.9551339,28 27,25.4684135 27,22.3447918 C27,21.2478921 26.2526786,20.2236347 24.9629464,19.3591906 Z" id="Shape"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/添加.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>62C8CE7E-3A7C-4A99-8BE2-ADA6A308F486</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="基础操作" transform="translate(-151.000000, -66.000000)" fill="#CCCCCC" fill-rule="nonzero">
+            <g id="添加">
+                <g transform="translate(151.000000, 66.000000)">
+                    <path d="M15.3635634,2.63483324 C13.663746,0.935778895 11.404511,0 9.00079784,0 C6.59706571,0 4.33702143,0.935771262 2.63706343,2.63481416 C0.937103532,4.33384752 0,6.5952305 0,8.99991414 C0,11.4046169 0.936643822,13.6655476 2.63704443,15.3651858 C4.33744884,17.0648298 6.59624887,18 9.00020896,18 C11.4041501,18 13.6637764,17.0652457 15.3629556,15.365224 C17.0621442,13.6651927 18,11.4040063 18,8.99932264 C18,6.594639 17.0647543,4.33449053 15.3635445,2.63485232 L15.3635634,2.63483324 Z M13.501098,9.64573354 L9.6437516,9.64573354 L9.6437516,13.5204019 C9.6437516,13.8770613 9.35589908,14.1662098 9.00081684,14.1662098 C8.6457327,14.1662098 8.35786119,13.8770613 8.35786119,13.5204229 L8.35786119,9.64571636 L4.50028684,9.64571636 C4.1452027,9.64571636 3.85735209,9.35658687 3.85735209,8.9999294 C3.85735209,8.64327002 4.1452046,8.35412145 4.50028684,8.35412145 L8.35784219,8.35412145 L8.35784219,4.47964391 C8.35784219,4.12298454 8.6456947,3.83385695 9.00077695,3.83385695 C9.35590098,3.83385695 9.6437326,4.12298645 9.6437326,4.47964391 L9.6437326,8.35431226 L13.501079,8.35431226 C13.8561631,8.35431226 14.1440137,8.64346083 14.1440137,9.00009922 C14.1440137,9.35673761 13.8561612,9.64592816 13.501079,9.64592816 L13.501079,9.64574498 L13.501098,9.64573354 Z" id="Shape"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/编组 12.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="40px" height="40px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>00C6C153-82A2-45A1-84EB-9E5F81396FB9</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="交通首页" transform="translate(-1098.000000, -743.000000)">
+            <g id="编组-12" transform="translate(1098.000000, 743.000000)">
+                <circle id="椭圆形" fill="#FF9630" cx="20" cy="20" r="20"></circle>
+                <g id="渣土车" transform="translate(4.912281, 7.719298)" fill="#FFFFFF" fill-rule="nonzero">
+                    <polygon id="路径" points="11.79761 8.68838764 10.4028186 3.67585631 6.6833751 3.67585631 6.6833751 2.67335004 10.4028186 2.67335004 12.3276307 7.96658312 28.0701754 7.68588137 28.0701754 8.68838764 11.79761 8.68838764"></polygon>
+                    <polygon id="路径" points="12.2648965 8.68838764 28.0701754 8.68838764 28.0701754 6.01503759 11.3617377 6.01503759"></polygon>
+                    <path d="M0,13.9784723 L0,19.3817878 L2.02933376,19.3817878 L2.02933376,19.2061801 L2.02933365,19.206164 C2.01391405,16.9819173 3.83354539,15.1612195 6.10643659,15.126689 L6.10643667,15.126689 C8.37931637,15.1612381 10.1989264,16.9819455 10.1835109,19.2061922 C10.1835109,19.2647281 11.5133917,19.3052529 10.5930589,19.3052529 L18.8760539,19.3052529 C18.8760539,19.246717 19.0969337,19.2647281 19.0969337,19.2061922 L19.0969336,19.2061761 C19.081514,16.9819294 20.9011454,15.1612316 23.1740366,15.1267011 L23.1740367,15.1267011 C23.7100357,15.1270372 24.2405097,15.2326891 24.7340008,15.4373917 L27.0670127,13.001397 L28.0701754,13.001397 L28.0701754,8.9489104 L10.5838528,8.9489104 L9.20335361,5.34670008 L4.60168975,5.34670008 L0.0276358723,13.9784965 L0,13.9784723 Z M2.76099832,12.9878645 L5.6278349,7.54402416 L7.50531376,7.54402416 L8.74316134,13.0013728 L2.76099832,12.9878645 Z" id="形状"></path>
+                    <path d="M20.0501253,19.3817878 L20.0501253,19.3817878 C20.0501253,21.2273522 21.5462499,22.7234754 23.3918129,22.7234754 C25.2373758,22.7234754 26.7335004,21.2273522 26.7335004,19.3817878 C26.7335004,19.3817877 26.7335004,19.3817877 26.7335004,19.3817877 L26.7335004,19.3817878 C26.7335004,17.5362234 25.2373758,16.0401003 23.3918129,16.0401003 C21.5462499,16.0401003 20.0501253,17.5362234 20.0501253,19.3817878 C20.0501253,19.3817879 20.0501253,19.3817879 20.0501253,19.381788 L20.0501253,19.3817878 Z" id="路径"></path>
+                    <path d="M3.34168755,19.381788 L3.34168755,19.3817879 C3.34168755,21.2273523 4.83781212,22.7234754 6.6833751,22.7234754 C8.52893809,22.7234754 10.0250627,21.2273523 10.0250627,19.3817879 L10.0250627,19.3817877 C10.0250627,17.5362233 8.52893809,16.0401003 6.6833751,16.0401003 C4.83781212,16.0401003 3.34168755,17.5362262 3.34168755,19.3817877 L3.34168755,19.381788 Z" id="路径"></path>
+                    <polygon id="路径" points="12.6425069 6.01503759 12.0300752 4.8320802 12.2591527 4.55137845 14.0917727 3.5037594 16.3778727 3.5037594 17.7570128 1.47368421 20.4545172 1.18796992 22.9603446 0 24.4189605 3.5037594 25.653174 3.5037594 26.7377859 3.68922306 28.0701754 6.01503759"></polygon>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/编组 13.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="40px" height="41px" viewBox="0 0 40 41" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>22BE9618-97E6-4993-B860-06E5BE8A0CD1</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="交通首页" transform="translate(-1098.000000, -814.000000)">
+            <g id="编组-13" transform="translate(1098.000000, 814.500000)">
+                <circle id="椭圆形备份" fill="#F56C6C" cx="20" cy="20" r="20"></circle>
+                <g id="危险品车" transform="translate(4.912281, 6.315789)" fill="#FFFFFF" fill-rule="nonzero">
+                    <path d="M26.9905854,20.4917827 L24.831339,20.4917827 C24.5614334,18.5903413 22.9824861,17.1266437 21.052649,17.1266437 C19.1228245,17.1266437 17.5303799,18.6040218 17.273959,20.4917827 L12.9554787,20.4917827 C12.3616873,20.4917827 11.8758571,19.9993234 11.8758571,19.3837491 L11.8758571,5.71800156 L13.6977204,5.71800156 L13.6977204,18.63137 L15.9244422,18.63137 C16.8286273,16.6341747 18.812434,15.2662309 21.0526395,15.2662309 C23.2928576,15.2662309 25.2766738,16.6341747 26.1808368,18.63137 L26.2618085,18.63137 L26.2618085,5.71800156 L28.0701754,5.71800156 L28.0701754,19.3837491 C28.0701754,19.9856429 27.5843452,20.4917827 26.9905538,20.4917827 L26.9905854,20.4917827 Z M24.6289097,11.7369388 C24.9258061,11.7369388 25.1282363,11.9010919 25.2361975,12.2157176 C25.2496928,12.2841147 25.2631881,12.352512 25.2631881,12.4345886 C25.2631881,12.8312909 25.020273,13.0501628 24.5209464,13.0775206 C24.7233757,13.282712 24.8178428,13.5015839 24.8178428,13.6930948 C24.8178428,13.8982862 24.7098806,14.0761198 24.5074513,14.2265924 C24.3724984,14.308669 24.2645362,14.3360277 24.1430787,14.3360277 C23.7517165,14.3360277 23.4818087,14.0077215 23.3198653,13.3237512 L20.1079772,12.1062833 L16.8960892,13.3237512 C16.7341458,13.9940442 16.4642411,14.3360277 16.0863721,14.3360277 C15.9649146,14.3360277 15.843457,14.2949895 15.7085031,14.2265924 C15.5060739,14.0761188 15.4116068,13.9119657 15.4116068,13.6930948 C15.4116068,13.4879034 15.5060739,13.282712 15.7085031,13.0775206 C15.2091766,13.0501617 14.9527651,12.8312909 14.9527651,12.4345886 C14.9527651,12.352512 14.9662636,12.284115 14.9797589,12.2157176 C15.1012164,11.9010909 15.3036457,11.7369388 15.600543,11.7369388 C15.8434581,11.7369388 16.1268591,11.8600536 16.4507459,12.0926028 L18.2995987,11.4086325 L16.4237532,10.6973012 C16.1133618,10.9024926 15.8164654,11.0119279 15.560054,11.0119279 C15.276653,11.0119279 15.0877201,10.8477748 14.9797557,10.5331491 C14.9662604,10.464752 14.9527651,10.3963547 14.9527651,10.3142781 C14.9527651,9.91757582 15.2091756,9.69870392 15.7085,9.67134613 C15.5060707,9.46615473 15.4116036,9.24728283 15.4116036,9.05577192 C15.4116036,8.85058051 15.5060707,8.67274689 15.7085,8.52227426 C15.8164621,8.46755645 15.9379197,8.44019449 16.0458831,8.44019449 C16.4507416,8.44019449 16.7206463,8.79586173 16.8690965,9.49351251 L20.0944588,10.7109804 L23.319821,9.46615152 C23.468269,8.78218124 23.7381759,8.44019449 24.1430344,8.44019449 C24.2644919,8.44019449 24.3724541,8.46755334 24.4804175,8.52227106 C24.6963422,8.67274465 24.790809,8.8505773 24.790809,9.05576871 C24.790809,9.26096011 24.6828468,9.46615152 24.4939126,9.67134293 C24.9932392,9.69870177 25.2361543,9.91757261 25.2361543,10.3142749 C25.2361543,10.382672 25.222659,10.4647485 25.2091637,10.5331459 C25.1146966,10.8477726 24.9257628,11.0119247 24.6288655,11.0119247 C24.3589599,11.0119247 24.0755599,10.9024894 23.7651662,10.697298 L21.9028171,11.4086293 L23.7381767,12.1062801 C24.0890531,11.8600504 24.3859504,11.7369355 24.6288655,11.7369355 L24.6289097,11.7369388 Z M22.1727691,8.34445154 L22.1727691,8.50860467 C22.1727691,8.7821931 22.0917974,9.00106404 21.9163586,9.17889766 C21.7409198,9.35673032 21.5249965,9.46616563 21.268585,9.49352437 C21.0256699,9.50720381 20.836737,9.46616553 20.7017831,9.37040953 C20.5128492,9.52088312 20.2969246,9.58928047 20.0675058,9.58928047 C19.8245907,9.58928047 19.5951719,9.50720391 19.3927427,9.35673032 C19.2577897,9.46616563 19.0688559,9.52088344 18.7989512,9.49352469 C18.5425407,9.47984526 18.3266174,9.37040985 18.1511776,9.19257719 C17.9757388,9.01474454 17.8947671,8.78219438 17.8947671,8.5222842 L17.8947671,8.30341326 C16.9770889,8.02982483 16.2618367,7.59208199 15.7625133,6.99018827 C15.2631868,6.38829455 15.0067785,5.67696328 15.0067785,4.88355544 C15.0067785,4.70572278 15.0202738,4.51421091 15.0607598,4.30901951 C15.2361985,3.07787108 15.7760087,2.06559455 16.6666975,1.25850622 C17.6113684,0.41038281 18.7584654,0 20.1215006,0 C21.4845233,0 22.6316234,0.424063306 23.5763038,1.27218671 C24.4804889,2.06559455 25.0202981,3.07787108 25.1957379,4.30901951 C25.2362237,4.51421091 25.2497191,4.70572182 25.2497191,4.88355544 C25.2497191,5.70432106 24.9933086,6.41565234 24.4669916,7.01754606 C23.9271792,7.61943977 23.157948,8.07086087 22.1727944,8.34445154 L22.1727691,8.34445154 Z M18.933901,3.26939481 C18.6639955,2.94108856 18.3266133,2.77693544 17.9487443,2.77693544 C17.5573821,2.77693544 17.2334953,2.94108856 16.9635875,3.26939481 C16.6936819,3.59770106 16.5452326,3.99440337 16.5452326,4.47318546 C16.5452326,4.93828704 16.6801856,5.34866985 16.9635875,5.6769761 C17.2334931,6.00528235 17.5708753,6.16943547 17.9487443,6.16943547 C18.3401064,6.16943547 18.6639932,6.00528235 18.933901,5.6769761 C19.2038066,5.34866985 19.3522559,4.95196754 19.3522559,4.47318546 C19.3522559,3.99440658 19.2038079,3.59770106 18.933901,3.26939481 Z M20.4858597,6.59349557 C20.3644022,6.38830417 20.2429446,6.29254807 20.121487,6.29254807 C19.9865341,6.29254807 19.8650766,6.38830417 19.7301249,6.56613651 C19.5951719,6.74396916 19.5276956,6.92180054 19.5276956,7.11331465 C19.5276956,7.22274996 19.5546862,7.31850606 19.6221627,7.40058262 C19.7301249,7.52369747 19.9055637,7.57841528 20.1349824,7.57841528 C20.4858588,7.57841528 20.6612985,7.4416209 20.6612985,7.16803247 C20.6478032,6.9765206 20.5938222,6.78500744 20.4858597,6.59349654 L20.4858597,6.59349557 Z M23.1579259,3.26939481 C22.8880203,2.94108856 22.5506381,2.77693544 22.1592759,2.77693544 C21.7814069,2.77693544 21.444027,2.94108856 21.1741192,3.26939481 C20.9042136,3.59770106 20.7692607,3.99440337 20.7692607,4.47318546 C20.7692607,4.93828704 20.9042136,5.34866985 21.1741192,5.6769761 C21.4440248,6.00528235 21.7679106,6.16943547 22.1592759,6.16943547 C22.5506381,6.16943547 22.8880213,6.00528235 23.1579259,5.6769761 C23.4278315,5.34866985 23.5627844,4.95196754 23.5627844,4.47318546 C23.5762797,3.99440658 23.4278315,3.59770106 23.1579259,3.26939481 Z M9.71662328,20.4917827 C9.44671771,18.5903413 7.86777046,17.1266437 5.93793328,17.1266437 C4.00810876,17.1266437 2.41566423,18.6040218 2.15924329,20.4917827 L1.07962165,20.4917827 C0.485830215,20.4917827 0,19.9993234 0,19.3837491 L0,13.8709294 C0,12.8312918 0.823213363,11.6411817 0.823213363,11.6411817 L3.2388681,8.35811921 C3.73819465,7.7562255 4.06208146,7.25008563 4.85830215,7.25008563 L9.7166043,7.25008563 C10.3103957,7.25008563 10.7962259,7.742545 10.7962259,8.35811921 L10.7962259,19.3837267 C10.7962259,19.9856204 10.3103957,20.4780798 9.7166043,20.4917827 L9.71662328,20.4917827 Z M8.97438162,9.11048877 L4.99326237,9.11048877 C4.92578605,9.19256533 4.83131896,9.30200064 4.75034726,9.39775674 L4.66937556,9.50719205 L2.29420667,12.7355261 C2.05129156,13.1048707 1.80837646,13.6520488 1.80837646,13.8709175 L1.8623577,14.3360191 L8.97438162,14.2676221 L8.97438162,9.11048877 L8.97438162,9.11048877 Z M5.91095326,18.1389106 C7.46291195,18.1389106 8.73146651,19.4384551 8.73146651,21.0252708 C8.73146651,22.6120832 7.46290878,23.9116309 5.91095326,23.9116309 C4.35899457,23.9116309 3.09044001,22.6120864 3.09044001,21.0252708 C3.09044001,19.4384583 4.35899774,18.1389106 5.91095326,18.1389106 Z M21.1066533,18.1389106 C22.658612,18.1389106 23.9271666,19.4384551 23.9271666,21.0252708 C23.9271666,22.6120832 22.6586088,23.9116309 21.1066533,23.9116309 C19.5546946,23.9116309 18.2861401,22.6120864 18.2861401,21.0252708 C18.2861401,19.4247778 19.5546978,18.1389106 21.1066533,18.1389106 Z" id="形状"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/编组 14.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="40px" height="40px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>8E3DFA5E-5FDB-488D-87F3-943CBCCD2E36</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="交通首页" transform="translate(-1098.000000, -886.000000)">
+            <g id="编组-14" transform="translate(1098.000000, 886.000000)">
+                <circle id="椭圆形备份-2" fill="#36BEA6" cx="20" cy="20" r="20"></circle>
+                <g id="危险品车" transform="translate(5.315789, 7.990766)" fill="#FFFFFF" fill-rule="nonzero">
+                    <path d="M27.940982,3.68510915 L26.4878942,0.683275197 C26.2512745,0.191219001 25.6900611,-0.0766459104 25.1379484,0.0339939443 L17.0564749,1.65865286 L17.0595085,1.66738759 C15.0816103,2.15944379 13.625489,3.88600783 13.6285179,5.9386683 C13.6345898,8.3610988 15.7520329,10.3584393 18.2759765,10.326412 C19.0950448,10.3147657 19.8625421,10.0993092 20.5268975,9.72662753 L20.5329646,9.74409699 L27.5284142,5.13798514 C28.0168216,4.8148003 28.189736,4.20045795 27.940982,3.68510915 L27.940982,3.68510915 Z M10.1095627,13.2088714 L10.1095627,7.29837388 C10.1095627,6.65491578 9.56655076,6.13374383 8.89612823,6.13374383 L7.59168619,6.13374383 C6.669476,6.13374383 5.78063527,6.47148655 5.10414556,7.07709417 L1.45474144,10.3526162 L1.4547414,10.3526162 C0.963527969,10.7924562 0.684495683,11.4082049 0.684210526,12.0529761 L0.684210526,19.3814107 C0.684210526,20.0248688 1.22722244,20.5460407 1.89764498,20.5460407 L2.51346296,20.5460407 C2.51346296,18.4846455 4.2547414,16.8075783 6.40555397,16.8075783 C8.55636654,16.8075783 10.2946114,18.4788224 10.2946114,20.5431292 C10.2946114,20.5460407 18.4397902,20.5489523 18.4397902,20.5460407 C18.4397902,18.4846455 20.1810686,16.8075783 22.3288476,16.8075783 C24.4766266,16.8075783 26.217905,18.4875571 26.217905,20.5489523 C26.217905,20.5518639 27.4707761,20.5460407 27.4707761,20.5460407 C28.1411986,20.5460407 28.6842105,20.0248688 28.6842105,19.3814107 L28.6842105,15.5381315 C28.6842105,14.8946734 28.1411986,14.3735015 27.4707761,14.3735015 L11.3229971,14.3735015 C10.6525746,14.3735015 10.1095626,13.8523295 10.1095626,13.2088714 L10.1095627,13.2088714 Z M3.99992021,20.6508574 L3.99992021,20.6508578 C3.99992021,21.9533538 5.10004719,23.0092336 6.45712498,23.0092336 C7.81420277,23.0092336 8.91432974,21.9533538 8.91432974,20.6508578 L8.91432974,20.6508578 C8.91432974,19.3483617 7.81420277,18.2924819 6.45712498,18.2924819 C5.10004719,18.2924819 3.99992021,19.3483617 3.99992021,20.6508578 L3.99992021,20.6508574 Z M19.9262474,20.6508574 L19.9262474,20.6508578 C19.9262474,21.9533538 21.0263744,23.0092336 22.3834522,23.0092336 C23.74053,23.0092336 24.8406569,21.9533538 24.8406569,20.6508578 L24.8406569,20.6508578 C24.8406569,19.3483617 23.74053,18.2924819 22.3834522,18.2924819 C21.0263744,18.2924819 19.9262474,19.3483617 19.9262474,20.6508578 L19.9262474,20.6508574 Z M28.4536644,8.48338496 C28.4566916,7.54876934 27.3706678,6.99265849 26.5637339,7.51383044 L21.4278725,10.8242914 C19.6532247,11.8724584 18.2517079,11.8316964 17.2991618,11.6802944 C14.7903861,11.2814087 13.5102127,9.89841047 12.8610253,8.47756181 C12.0449906,6.6869431 12.233073,9.42382372 12.233073,9.42382372 L12.233073,11.1241836 C12.233073,11.7676417 12.7760849,12.2888136 13.4465074,12.2888136 L27.2311228,12.2888136 C27.9015453,12.2888136 28.4415237,11.7705533 28.4445573,11.1270952 L28.4536644,8.48338496 L28.4536644,8.48338496 Z" id="形状"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/运行路数.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="30px" height="27px" viewBox="0 0 30 27" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>3BEE70BD-9F64-49D2-80BE-E41F11B367E6</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="首页" transform="translate(-516.000000, -139.000000)" fill="#3BB7FF" fill-rule="nonzero">
+            <g id="运行路数" transform="translate(516.000000, 139.000000)">
+                <path d="M27.3633133,9.6612502 L25.3523717,3.85980056 L25.3125279,3.80566941 L25.3125279,3.80566945 C25.2851617,3.74861511 25.2538345,3.69356365 25.2187777,3.64092234 C24.5414315,2.34883515 23.301586,0 20.1422018,0 L9.82968815,0 C6.63983198,0.00706059402 5.39061148,2.39354101 4.74375021,3.67149535 L4.57968739,3.99863695 L4.57968739,4.13984883 C4.57968739,4.16338414 4.55624984,4.18691955 4.55624984,4.21045477 L2.66249691,9.63768454 C0.977338121,10.7885604 0,12.4548544 0,14.1941305 L0,21.8995962 L0,21.8995122 C0.000906897262,22.9761925 0.373630261,24.0192373 1.05463568,24.8508492 L1.05463568,25.027364 L1.19760464,25.027364 L1.19760458,25.027364 C1.97281632,25.8938223 3.03276059,26.4510687 4.18354501,26.5971681 L4.18354502,26.5971681 C4.39266277,26.6246357 4.60314515,26.6403503 4.81400848,26.6442386 L4.81400854,26.6442386 C6.58976109,26.6620615 8.22308124,25.6706966 9.03277945,24.0835981 L20.8921792,24.0365274 L20.892179,24.0365269 C21.8249243,25.8554438 23.7939131,26.8911188 25.8140611,26.6254097 L25.814061,26.6254097 C28.1978963,26.3526641 29.9987552,24.3276137 30,21.9183383 L30,14.2176642 C29.9835937,12.5137086 29.0015598,10.8356489 27.3632811,9.66121833 L27.3633133,9.6612502 Z M6.84607627,18.4516671 L6.84607618,18.4516671 C5.68109831,18.4516671 4.73669591,17.5033257 4.73669591,16.3334889 C4.73669591,15.1636521 5.68109831,14.2153107 6.84607618,14.2153107 C8.01105405,14.2153107 8.95545645,15.1636521 8.95545645,16.3334889 L8.95545645,16.3334889 C8.95545645,17.5033257 8.01105405,18.4516671 6.84607618,18.4516671 L6.84607627,18.4516671 Z M23.2289147,18.4516671 L23.2289146,18.4516671 C22.0639367,18.4516671 21.1195343,17.5033257 21.1195343,16.3334889 C21.1195343,15.1636521 22.0639367,14.2153107 23.2289146,14.2153107 C24.3938924,14.2153107 25.3382949,15.1636521 25.3382949,16.3334889 L25.3382949,16.3334889 C25.3382949,17.5033257 24.3938924,18.4516671 23.2289146,18.4516671 L23.2289147,18.4516671 Z M4.73669081,11.2381176 L7.01247649,4.72824066 L7.01247649,4.70470535 C7.69216448,3.38908163 8.32263572,2.47355806 9.84372312,2.47355806 L20.1820148,2.47355806 C21.7265487,2.47355806 22.35702,3.43615208 23.0601493,4.79884626 L23.1070245,4.89298743 C23.1070245,4.94005814 23.1538997,4.98712859 23.1773372,5.05773453 L25.3382786,11.2381176 L4.73669081,11.2381176 Z" id="Shape"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

UI/图标/重置.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="57px" height="57px" viewBox="0 0 57 57" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+    <title>A33809C0-448B-485E-9E02-BC1186C134FC</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="场景添加" transform="translate(-93.000000, -94.000000)">
+            <g id="调试">
+                <g transform="translate(12.000000, 15.000000)">
+                    <g id="箭头备份-3" transform="translate(109.500000, 107.500000) scale(-1, -1) rotate(-90.000000) translate(-109.500000, -107.500000) translate(81.000000, 79.000000)">
+                        <rect id="矩形" fill="#6783E3" x="0" y="0" width="57" height="57" rx="3"></rect>
+                        <g id="重置" transform="translate(28.979537, 28.020463) rotate(90.000000) translate(-28.979537, -28.020463) translate(7.979537, 7.020463)" fill="#FFFFFF" fill-rule="nonzero">
+                            <path d="M3.49369658,31.9422383 L0.329173598,35.0862791 L0.308108108,21.4795367 L14.0032734,21.5005071 L8.6728801,26.7964687 L8.67287943,26.7964673 C11.9671716,33.7854181 20.3402337,36.7977797 27.3746232,33.5247629 C30.59397,32.0268433 33.1229872,29.3732431 34.452875,26.0978098 L41.8366795,26.1012912 L41.8366795,26.1012924 C38.9294644,37.3111865 27.4261942,44.0570939 16.143419,41.1686296 C10.88962,39.823638 6.35934421,36.51935 3.49369559,31.9422381 L3.49369658,31.9422383 Z M33.4747074,15.3434501 L33.4747073,15.3434499 C30.1756888,8.3548791 21.8000196,5.34702465 14.7671393,8.62526645 C11.5539565,10.1230239 9.02933932,12.7724758 7.6995454,16.0423192 L0.308108108,16.0458015 L0.308108108,16.045806 C3.21642574,4.83337508 14.7211694,-1.91328095 26.0046904,0.976709191 C31.2563353,2.32178385 35.7850144,5.6247497 38.6508223,10.1999905 L41.815571,7.05518072 L41.8366795,20.665251 L28.1403175,20.6442755 L33.4747062,15.3470185 L33.4747074,15.3434501 Z" id="形状"></path>
+                        </g>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

src/api/apiList.js

 import map from "./map";
 import login from "./login";
 import task from "./task";
+let wsIP = "192.168.9.133:20080";
 export default {
   map,
   login,
-  task
+  task,
+  wsIP
 };

src/api/baseUrl.js

-let baseUrl = '/api' // 本地代理
-console.log(process.env.NODE_ENV)
+let baseUrl = "/api"; // 本地代理
+console.log(process.env.NODE_ENV);
 switch (process.env.NODE_ENV) {
-  case 'development':
-  baseUrl = 'http://192.168.9.133:20080' // 测试环境url
+  case "development":
+    baseUrl = "http://192.168.9.133:20080"; // 测试环境url
     // baseUrl="http://192.168.9.162:20080"
-    break
-  case 'pre':
-    baseUrl = 'https://pre-server.feleti.cn' // 预上线环境url
-    break
-  case 'production':
-    baseUrl = 'https://api.feleti.cn' // 生产环境url
-    break
+    break;
+  case "pre":
+    baseUrl = "https://pre-server.feleti.cn"; // 预上线环境url
+    break;
+  case "production":
+    baseUrl = "https://api.feleti.cn"; // 生产环境url
+    break;
 }
 
-export default baseUrl
\ No newline at end of file
+export default baseUrl;

src/api/index.js

-import axios from './axios'
+import axios from "./axios";
 
-let instance = axios()
+let instance = axios();
 
 export default {
   get(url, params, headers) {
-    let options = {}
+    let options = {};
 
     if (params) {
-      options.params = params
+      options.params = params;
     }
     if (headers) {
-      options.headers = headers
+      options.headers = headers;
     }
-    return instance.get(url, options)
+    return instance.get(url, options);
   },
-  post(url,data,headers,params) {
-    let options = {}
+  post(url, data, headers, params) {
+    let options = {};
 
     if (params) {
-      options.params = params
+      options.params = params;
     }
     if (headers) {
-      options.headers = headers
+      options.headers = headers;
     }
-    return instance.post(url, data, options)
+    return instance.post(url, data, options);
   },
   put(url, params, headers) {
-    let options = {}
+    let options = {};
 
     if (headers) {
-      options.headers = headers
+      options.headers = headers;
     }
-    return instance.put(url, params, options)
+    return instance.put(url, params, options);
   },
   delete(url, params, headers) {
-    let options = {}
+    let options = {};
 
     if (params) {
-      options.params = params
+      options.params = params;
     }
     if (headers) {
-      options.headers = headers
+      options.headers = headers;
     }
-    return instance.delete(url, options)
+    return instance.delete(url, options);
   }
-}
+};

src/api/install.js

-import apiList from './apiList'
+import apiList from "./apiList";
 
 const install = function(Vue) {
   if (install.installed) {
-    return
+    return;
   }
-  install.installed = true
+  install.installed = true;
   Object.defineProperties(Vue.prototype, {
     $api: {
       get() {
-        return apiList
+        return apiList;
       }
     }
-  })
-}
+  });
+};
 
 export default {
   install
-}
+};

src/api/task/index.js

@@ -35,5 +35,8 @@ export default {
   },
   deleteTask(taskid) {
     return api.delete(urls.deleteTask(taskid));
+  },
+  getConftypes(params) {
+    return api.get(urls.getConfParam, params);
   }
 };

src/api/task/urls.js

@@ -39,5 +39,6 @@ export default {
   },
   changeTask: taskid => {
     return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/start_or_stop?s=${gitTimer()}`; // 切换任务
-  }
+  },
+  getConfParam: `${baseUrl}/api/v1/devconf_fx/conf_param/types?s=${gitTimer()}` //获取类型
 };

src/assets/css/icon/demo.css

+/* 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;
+}

src/assets/css/icon/demo_index.html

+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8"/>
+  <title>IconFont Demo</title>
+  <link rel="shortcut icon" href="https://gtms04.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/>
+  <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>
+</head>
+<body>
+  <div class="main">
+    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">&#xe86b;</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=1592179" 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">&#xe600;</span>
+                <div class="name">右</div>
+                <div class="code-name">&amp;#xe600;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe601;</span>
+                <div class="name">右上</div>
+                <div class="code-name">&amp;#xe601;</div>
+              </li>
+          
+            <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">&#xe603;</span>
+                <div class="name">右下</div>
+                <div class="code-name">&amp;#xe603;</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">&#xe605;</span>
+                <div class="name">展示</div>
+                <div class="code-name">&amp;#xe605;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe606;</span>
+                <div class="name">左上</div>
+                <div class="code-name">&amp;#xe606;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe607;</span>
+                <div class="name">下</div>
+                <div class="code-name">&amp;#xe607;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe608;</span>
+                <div class="name">运行路数</div>
+                <div class="code-name">&amp;#xe608;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe609;</span>
+                <div class="name">总量</div>
+                <div class="code-name">&amp;#xe609;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60a;</span>
+                <div class="name">左下</div>
+                <div class="code-name">&amp;#xe60a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60b;</span>
+                <div class="name">定位 位置</div>
+                <div class="code-name">&amp;#xe60b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60c;</span>
+                <div class="name">保存 面性</div>
+                <div class="code-name">&amp;#xe60c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60d;</span>
+                <div class="name">上</div>
+                <div class="code-name">&amp;#xe60d;</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">&#xe60f;</span>
+                <div class="name">导出</div>
+                <div class="code-name">&amp;#xe60f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe610;</span>
+                <div class="name">开启</div>
+                <div class="code-name">&amp;#xe610;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe611;</span>
+                <div class="name">删 除 (2)</div>
+                <div class="code-name">&amp;#xe611;</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">&#xe613;</span>
+                <div class="name">左</div>
+                <div class="code-name">&amp;#xe613;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe614;</span>
+                <div class="name">删 除</div>
+                <div class="code-name">&amp;#xe614;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe615;</span>
+                <div class="name">编组 12</div>
+                <div class="code-name">&amp;#xe615;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe616;</span>
+                <div class="name">编组 14</div>
+                <div class="code-name">&amp;#xe616;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe617;</span>
+                <div class="name">编组 13</div>
+                <div class="code-name">&amp;#xe617;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe618;</span>
+                <div class="name">添加</div>
+                <div class="code-name">&amp;#xe618;</div>
+              </li>
+          
+          </ul>
+          <div class="article markdown">
+          <h2 id="unicode-">Unicode 引用</h2>
+          <hr>
+
+          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
+          <ul>
+            <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li>
+            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
+            <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li>
+          </ul>
+          <blockquote>
+            <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用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.eot');
+  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
+      url('iconfont.woff2') format('woff2'),
+      url('iconfont.woff') format('woff'),
+      url('iconfont.ttf') format('truetype'),
+      url('iconfont.svg#iconfont') format('svg');
+}
+</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 iconyou"></span>
+            <div class="name">
+              右
+            </div>
+            <div class="code-name">.iconyou
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconyoushang"></span>
+            <div class="name">
+              右上
+            </div>
+            <div class="code-name">.iconyoushang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconyichang"></span>
+            <div class="name">
+              异常
+            </div>
+            <div class="code-name">.iconyichang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconyouxia"></span>
+            <div class="name">
+              右下
+            </div>
+            <div class="code-name">.iconyouxia
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzhongzhi"></span>
+            <div class="name">
+              重置
+            </div>
+            <div class="code-name">.iconzhongzhi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzhanshi"></span>
+            <div class="name">
+              展示
+            </div>
+            <div class="code-name">.iconzhanshi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzuoshang"></span>
+            <div class="name">
+              左上
+            </div>
+            <div class="code-name">.iconzuoshang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconxia"></span>
+            <div class="name">
+              下
+            </div>
+            <div class="code-name">.iconxia
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconyunhanglushu"></span>
+            <div class="name">
+              运行路数
+            </div>
+            <div class="code-name">.iconyunhanglushu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzongliang"></span>
+            <div class="name">
+              总量
+            </div>
+            <div class="code-name">.iconzongliang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzuoxia"></span>
+            <div class="name">
+              左下
+            </div>
+            <div class="code-name">.iconzuoxia
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icondingweiweizhi"></span>
+            <div class="name">
+              定位 位置
+            </div>
+            <div class="code-name">.icondingweiweizhi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconbaocunmianxing"></span>
+            <div class="name">
+              保存 面性
+            </div>
+            <div class="code-name">.iconbaocunmianxing
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconshang"></span>
+            <div class="name">
+              上
+            </div>
+            <div class="code-name">.iconshang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconfenxi"></span>
+            <div class="name">
+              分析
+            </div>
+            <div class="code-name">.iconfenxi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icondaochu"></span>
+            <div class="name">
+              导出
+            </div>
+            <div class="code-name">.icondaochu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconkaiqi"></span>
+            <div class="name">
+              开启
+            </div>
+            <div class="code-name">.iconkaiqi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconshanchu"></span>
+            <div class="name">
+              删 除 (2)
+            </div>
+            <div class="code-name">.iconshanchu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icondaoru"></span>
+            <div class="name">
+              导入
+            </div>
+            <div class="code-name">.icondaoru
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconzuo"></span>
+            <div class="name">
+              左
+            </div>
+            <div class="code-name">.iconzuo
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconshanchu1"></span>
+            <div class="name">
+              删 除
+            </div>
+            <div class="code-name">.iconshanchu1
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconbianzu"></span>
+            <div class="name">
+              编组 12
+            </div>
+            <div class="code-name">.iconbianzu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconbianzu1"></span>
+            <div class="name">
+              编组 14
+            </div>
+            <div class="code-name">.iconbianzu1
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont iconbianzu2"></span>
+            <div class="name">
+              编组 13
+            </div>
+            <div class="code-name">.iconbianzu2
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icontianjia"></span>
+            <div class="name">
+              添加
+            </div>
+            <div class="code-name">.icontianjia
+            </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>兼容性良好，支持 IE8+，及所有现代浏览器。</li>
+          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
+          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
+          <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</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 iconxxx"&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="#iconyou"></use>
+                </svg>
+                <div class="name">右</div>
+                <div class="code-name">#iconyou</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconyoushang"></use>
+                </svg>
+                <div class="name">右上</div>
+                <div class="code-name">#iconyoushang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconyichang"></use>
+                </svg>
+                <div class="name">异常</div>
+                <div class="code-name">#iconyichang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconyouxia"></use>
+                </svg>
+                <div class="name">右下</div>
+                <div class="code-name">#iconyouxia</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzhongzhi"></use>
+                </svg>
+                <div class="name">重置</div>
+                <div class="code-name">#iconzhongzhi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzhanshi"></use>
+                </svg>
+                <div class="name">展示</div>
+                <div class="code-name">#iconzhanshi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzuoshang"></use>
+                </svg>
+                <div class="name">左上</div>
+                <div class="code-name">#iconzuoshang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconxia"></use>
+                </svg>
+                <div class="name">下</div>
+                <div class="code-name">#iconxia</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconyunhanglushu"></use>
+                </svg>
+                <div class="name">运行路数</div>
+                <div class="code-name">#iconyunhanglushu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzongliang"></use>
+                </svg>
+                <div class="name">总量</div>
+                <div class="code-name">#iconzongliang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzuoxia"></use>
+                </svg>
+                <div class="name">左下</div>
+                <div class="code-name">#iconzuoxia</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icondingweiweizhi"></use>
+                </svg>
+                <div class="name">定位 位置</div>
+                <div class="code-name">#icondingweiweizhi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconbaocunmianxing"></use>
+                </svg>
+                <div class="name">保存 面性</div>
+                <div class="code-name">#iconbaocunmianxing</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconshang"></use>
+                </svg>
+                <div class="name">上</div>
+                <div class="code-name">#iconshang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconfenxi"></use>
+                </svg>
+                <div class="name">分析</div>
+                <div class="code-name">#iconfenxi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icondaochu"></use>
+                </svg>
+                <div class="name">导出</div>
+                <div class="code-name">#icondaochu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconkaiqi"></use>
+                </svg>
+                <div class="name">开启</div>
+                <div class="code-name">#iconkaiqi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconshanchu"></use>
+                </svg>
+                <div class="name">删 除 (2)</div>
+                <div class="code-name">#iconshanchu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icondaoru"></use>
+                </svg>
+                <div class="name">导入</div>
+                <div class="code-name">#icondaoru</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconzuo"></use>
+                </svg>
+                <div class="name">左</div>
+                <div class="code-name">#iconzuo</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconshanchu1"></use>
+                </svg>
+                <div class="name">删 除</div>
+                <div class="code-name">#iconshanchu1</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconbianzu"></use>
+                </svg>
+                <div class="name">编组 12</div>
+                <div class="code-name">#iconbianzu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconbianzu1"></use>
+                </svg>
+                <div class="name">编组 14</div>
+                <div class="code-name">#iconbianzu1</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#iconbianzu2"></use>
+                </svg>
+                <div class="name">编组 13</div>
+                <div class="code-name">#iconbianzu2</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icontianjia"></use>
+                </svg>
+                <div class="name">添加</div>
+                <div class="code-name">#icontianjia</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>

src/assets/css/icon/iconfont.css

+@font-face {font-family: "iconfont";
+  src: url('iconfont.eot?t=1577785849356'); /* IE9 */
+  src: url('iconfont.eot?t=1577785849356#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAA0oAAsAAAAAF7AAAAzYAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCFQAqeFJdgATYCJANcCzAABCAFhG0HggobhBMjETaLtFIi+w8JnA4Z+QuqDkKKYlYUwyYGYVBKZyFRxjqNUrhwMskAw84stsxn+eou87ZwiJ8NpeSBz+7x78zsQyicHkAldVIVV1CXtCndwpW8of73EG7rxjaqtYcjjCKN5GNgNWEFIF9g/zfPR1ZwOWeJhRmeZ1bz6JOUfkUQ3iz//Vnhge7nvd8tumicwJEs7b7u6wIoEmxig+/dduwdsM8IxeAGasrGbkqWbDN1QxdkchmFnlGfByWxh5HUoE5Lag6l0GA4xEecnlcSFICn9o/sVVoNRQLH0brVJORAyYq7bRMfj3vXPi2yu3eKOgV99SLZfJrJHEEOCLO/QK5s/7mCUBVqf3G3AKiAXW0rXDUbpQu1rRqX475pJgURWYjn7ifVKfRNoYy8PQEVNRUFGp2WUwIkGY0CVi2222qBFGmWSUqDcl2RuWymhiYCVDmOIp0Vu8X3D+/VM1CBqJCAdkdjFukbwC0HeQO7PKgiuYGrOYPJlUjoDMgIW9mu9VgPOwtdketCjJNThri88SAXtlLWwcIoyRTWWBI3WlZBRZVUVkVV1VTHw4fQf3kCQl68gVAE2srKEAYPpxsAuTBBIAeRHCRykJGDAjkokoMSuSrKDohgFwTsgYB9EHAAAg5BwBEIOAYBJyDgFAScgYBzKFW4gJJzCSLjCgRcg4AbIHSCuSxdARNR2WEAigOAVrAAp/1X161Opk7XaUhgXGMkLE0WxMAkezG1RSwaxOTxPJkYCKHR2BFJE2wujrDIk+nrg4Uy2XSEy0V6Em8RxKQiGEJjFUwVePlATP9UEY1J86Px5nh15N4eRQW0TZxKUFT/5+WGCvJz4ubbJdCw8l14aunetfrlb0MjfnrI7jf6lKAzYA5SLIM0pJNsjRMPlhMj9UB8sbip6FOA/ZSDEHOAiD7DN+bAmxairV1H4n/Ak77InPcJih8aY24E8cX459gL5uvXvxkuaUg2J3ikpx1+4szFg9bL76fP7zedpXtJYpfGP/dfTVuat7tn3S+oJqMivzT1DdPW+yzo4RNFkHMeiGr8NcDP/W+3/XXOeOyvct6BDr9mZsVclcvGUtlKjz+Pag5HV3E4vfypelJpQfxwfzMvSGxVeBBic2u3fqRp6zZsJMb4zZEMKbG0tjw9N63szV64/8kruDT0laouwjHCMUL2lb1JMOafR3oXoS73lyvI1NjSHgqLg5UGTXNy9RBHEsI5og8czOPo0BnYyYUFeYH83CxxDlA/Qyl1Sd9ER88tDYFMDS/PZ5rF1dEmHmhkZSExUZk6ozFi9Qw06tydVmmK29tfn2Ic3hfIgfo+t3H3MsdtNBu07J6ZuSHAm7VdfUAMJOiLB3xz3HsOB5AHkcqYoDpF9sGYAyknQp4OeVIEyLY6Mn57LOzlm/DU2T0QoeWC0SDnqKvvFqnrx6EcvMMaBpLCYul2Wv3y85BcvZvRuFKIknESCpgP/sZ1NBQwHeQJC0ytaFlqni31MtbzAlFEggzVdBfPiFWnJtndOJe9eorbUBC+KG6FeZnFEMQ0BwQhDGYCn2vHBgevyDdd3Twm5PP/MGziXyWcY5rVvCxXzRWxlGkMz8vFUXNkQcwNpdzxWfi/cU7x81+avbla5vQoBE6t3WuO/dH7EnK3MRMelUuKV6QPMJ4qbr2U4z61m7F7EyC6d1pJfRd1WW5ASkPPMzK39WLm5E5Dk3qCnQNzDJQFwbY8UMuJ6PeQcCCuBDwal/wUe9dhWEyqqnpmG4qFDncYqZs3oDmm3gNxpfrz/Cg0aL6MzXdxd5vyRhaqtqV0KyDV/cPswoA6dmnBQ1g9DmRmBbZ668+L8sf5+zbY+GOO6Gu6aa9AHWGBjaWtS9hy506uz1XG0Dh6KS3o1bFtAyRLRgqxLEWVpPsuQnFb1eW44298CfQcgznSZzSViMCBhxjQILp24zF0B2W/CvCTZo1b0n509G6PMcbjYFfzGKcW68WAvofgWadPz0rgwYKzBqzizoICOXO4zncS+77hJz9ObGb4ePLpeB778V3dgB8pMwSd5crccRMnNz7/1OMO0sKFpIx1SGK3YFEH18CZzS6Csz3yFHP0teCWXHFT44znsZcY8fXX7NmKqn1EbcSSLrqAYZGzkJlzpWn81pLPtm7Ve4m6V1lnXeTQXHhGCs+n5wjw5Re2Fl06ASZMTKsd7UtZNCs0dGzTV+W0UihWJ6zQqpsojqM3JZBWNLBZU4QTyKefrEZCYs+bQDn9ZmYTlkj7/TB9oSHEah6G8VBUxOWKQOfn/Ow7JqqxwgSPMMPGKkoFmnHxY+8p6mBRZggFbZyHDK9XLzkIztTHLNfRTHWQXgY0UzWTosD75V3dWf3ZLEB9EiOv+fdxn2v4DpXvIkYu9CiQoPAV+H8vkbxaUJPKvFovQUIqsFpaKUVRdyJehqiEeCNLcpIso9R3kgjoWvuxedLiBozHw66PKxJxAZ5cG5HXP7wFmIfNHBUc6f1rtbMMp7jtjbPzSDY7lA9CVEceBNgtcsMkUPGMy+3nOCg56PBzS295juyrpfM8Y0dXP6BN0iHZ844j4VhZ4kAxy8qWHNGBBLhmzIVHLdbDgc4GFj+Ae/DkQR4dXHKPSsM7Gq1fjn+q5rL/sCLVP8dP++lnwN9Hy7vKs2P2rZ+/YrCAMnPvmjf4uVG7X3BmDVb5gn2+RX7pypEPVuyHcr2Lk17w/LQRz29/CP5wO+IF011X4pOzD/nDULmu5r13F9Skb54JbZ4Lde1DLmdR+9WYsiD46R39wQeG4sqhvn2g8mchaqgcGl0W8Vns/R503Y4crqRjPu4ptjMV4DH4aQ6h12fgbWTZLUQSiF73+9mwW8iy24gYA6pasMapowR9CKLozmhZtZTw+6T9S3lXxneLxwgSBGPEy192cka/Yj+hr1oTXjfxWkB9eLPDhAfUVaJtA/Ywvn3AnG1V+dzB6Y6PJqHzSYJ+Lo7GuQZGXu4cJo1NNPAN3QSHlg2dlHvnjGfWgY6yqf+eXy2dpL09tzcm5ZCS5HQVQx4hr4hG8HfcvYHfslLjeHT7VpcPkA6q9q9WjphM8Z86VbdGcnpMb5Qx69ChVZ3xWs7V1BmMTh3yCt3vZzsgrWhru6v3zRytDBqNL4E9mfpPssPHNELeYVNYO+QjjO9S3xtfJ0l15M6YzBy0NaDVry7mISrLyQybdD4c2P+iRkQn7sN1NrcNKzn7amZlLksiW1FZjPvvZYJbMXVYyTDKBZXXGNqo+EVQeT4TVD1ykDt3E00Vq9KoY9XTfWniOLFGEie5iZEehLuEb+D/rDh7V45GMkGVuSwuC4xUYt4P9L/4XclY/o5CrwTXr2oaGEdos7RED+aHbogmElAi2tg12otUL8jA/HDeZiSjHK6N06ZC2eYCLB8zs1FVG6cD55CzhTsvPlpRR5aDd8TEdGQWiLwxk0PPn23D2Wiy14pHl05pihH62UlY+BZCeY6O+leIyJSerE5WBVbpQw7q39YyB4uH00ewLDAtnTaXivBjXCw6RVu6Jv7a4rF0aenCYm2mtjiA4WHuQnjc5MIx7IfXwv+Vc+b/tWG9MbUo3oH4bwTZsy82pjam9E7tPRNctDGZbLA5+TojY1fO+aiYNCln13lRe0R8N+vv3GXrRXr23Y+jD9J8bA0cghiHK3/s1UwP7uueAv4vPuAQqc5KeI+rNrkuWBhVRRo8yDeYwKmwG11R1qCjcbDEc8h8zARfWf0Ln03f67UJ1ZyUb1T/l3n0fi/pl3CKy+ra/S+jY1Z34D+3sbh6kXLRdURrqZcte2Q1xF7Ng1nBbe3/zwYDUDx93EJ1z3LVUXc9V//qlDpYUR/lf9H6arpPtXUKh/72a+sEEJU0gaSsdWqW2RkKKukNRWXDoKJO0q9cSS3NWCGjAToaNoCgug0QVXURkurOpWaZ96CgrndQVD3AUNGkILjOStoGO51ottS2Whrwuj64vd7RyxptrXR3dZHF1tajtjkcERVGS3OLfRRXyZXx2XRLL0tzEwEt7TZ1a6sVtzY7euJpgzuz9OjhwJ3Njm6W+lZ5Y2urM0mhsHKB8npHT6AYJWVBcntL01CdpqYdEQnZ6+eUxLd/sjgKPiSV7HVV88uSysCpD6nIKQukPnRYaK+quFuUHAutZGxDc8dUJDCURsbi61ORISd/ph8LkZtorDARO1DQ/qxF9aT72uB20C6+fWqvp14gQTCEQChEhigQFaKNwsMnICQiJiElI6egpKKmETRRIZnxmYtCR2yACBRidg1Iat0odNKA2DJLMxektohylWtNEaJfxRRyu2nyAVIm4dJNCJ3KAkOWdBkYRaQIg0ysOc2XNrxtRRoFMz3eLXgPQQLixCGZMpAWAi7a3RaiUzsfly7E1eQPEAUAAAA=') format('woff2'),
+  url('iconfont.woff?t=1577785849356') format('woff'),
+  url('iconfont.ttf?t=1577785849356') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
+  url('iconfont.svg?t=1577785849356#iconfont') format('svg'); /* iOS 4.1- */
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+[class^="icon-faxin"], [class*="icon-fanxin"] {
+  font-family:"iconfont" !important;
+  /* 以下内容参照第三方图标库本身的规则 */
+  font-size: 18px;
+  font-style:normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-fanxin-you:before {
+  content: "\e600";
+}
+
+.icon-fanxin-youshang:before {
+  content: "\e601";
+}
+
+.icon-fanxin-yichang:before {
+  content: "\e602";
+}
+
+.icon-fanxin-youxia:before {
+  content: "\e603";
+}
+
+.icon-fanxin-zhongzhi:before {
+  content: "\e604";
+}
+
+.icon-fanxin-zhanshi:before {
+  content: "\e605";
+}
+
+.icon-fanxin-zuoshang:before {
+  content: "\e606";
+}
+
+.icon-fanxin-xia:before {
+  content: "\e607";
+}
+
+.icon-fanxin-yunhanglushu:before {
+  content: "\e608";
+}
+
+.icon-fanxin-zongliang:before {
+  content: "\e609";
+}
+
+.icon-fanxin-zuoxia:before {
+  content: "\e60a";
+}
+
+.icon-fanxin-dingweiweizhi:before {
+  content: "\e60b";
+}
+
+.icon-fanxin-baocunmianxing:before {
+  content: "\e60c";
+}
+
+.icon-fanxin-shang:before {
+  content: "\e60d";
+}
+
+.icon-fanxin-fenxi:before {
+  content: "\e60e";
+}
+
+.icon-fanxin-daochu:before {
+  content: "\e60f";
+}
+
+.icon-fanxin-kaiqi:before {
+  content: "\e610";
+}
+
+.icon-fanxin-shanchu:before {
+  content: "\e611";
+}
+
+.icon-fanxin-daoru:before {
+  content: "\e612";
+}
+
+.icon-fanxin-zuo:before {
+  content: "\e613";
+}
+
+.icon-fanxin-shanchu1:before {
+  content: "\e614";
+}
+
+.icon-fanxin-bianzu:before {
+  content: "\e615";
+}
+
+.icon-fanxin-bianzu1:before {
+  content: "\e616";
+}
+
+.icon-fanxin-bianzu2:before {
+  content: "\e617";
+}
+
+.icon-fanxin-tianjia:before {
+  content: "\e618";
+}
+

src/assets/css/icon/iconfont.js

+!function(i){var a,o='<svg><symbol id="iconyou" viewBox="0 0 1024 1024"><path d="M1006.644068 1006.644068m-52.067797 0l-885.152542 0q-52.067797 0-52.067797-52.067797l0-885.152542q0-52.067797 52.067797-52.067797l885.152542 0q52.067797 0 52.067797 52.067797l0 885.152542q0 52.067797-52.067797 52.067797Z"  ></path><path d="M143.186441 111.077966L514.169492 506.79322 143.186441 902.508475H514.169492L885.152542 506.79322l-370.98305-395.715254z"  ></path></symbol><symbol id="iconyoushang" viewBox="0 0 1041 1024"><path d="MNaN NaNmNaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNZ"  ></path><path d="MNaN NaNLNaN NaNlNaN NaN NaN NaN NaN NaN NaN NaNz"  ></path></symbol><symbol id="iconyichang" viewBox="0 0 1024 1024"><path d="M378.88 739.84c0-199.68 161.28-360.96 360.96-360.96 33.28 0 64 5.12 94.72 12.8V76.8c0-40.96-33.28-76.8-76.8-76.8H76.8C33.28 0 0 33.28 0 76.8v796.16c0 40.96 33.28 76.8 76.8 76.8h368.64c-40.96-61.44-66.56-133.12-66.56-209.92zM189.44 151.04h455.68c20.48 0 38.4 17.92 38.4 38.4s-17.92 38.4-38.4 38.4H189.44c-20.48 0-38.4-17.92-38.4-38.4s17.92-38.4 38.4-38.4z m0 227.84h151.04c20.48 0 38.4 17.92 38.4 38.4s-17.92 38.4-38.4 38.4H189.44c-20.48 0-38.4-17.92-38.4-38.4s17.92-38.4 38.4-38.4z m76.8 304.64h-76.8c-20.48 0-38.4-17.92-38.4-38.4s17.92-38.4 38.4-38.4h76.8c20.48 0 38.4 17.92 38.4 38.4s-17.92 38.4-38.4 38.4z m473.6-227.84c156.16 0 284.16 128 284.16 284.16S896 1024 739.84 1024s-284.16-128-284.16-284.16 128-284.16 284.16-284.16z m0 122.88c-20.48 0-38.4 17.92-38.4 38.4v153.6c0 20.48 17.92 38.4 38.4 38.4s38.4-17.92 38.4-38.4v-153.6c0-20.48-17.92-38.4-38.4-38.4z m0 256c-20.48 0-38.4 17.92-38.4 38.4s17.92 38.4 38.4 38.4 38.4-17.92 38.4-38.4-17.92-38.4-38.4-38.4z"  ></path></symbol><symbol id="iconyouxia" viewBox="0 0 1024 1024"><path d="MNaN NaNmNaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNZ"  ></path><path d="MNaN NaNLNaN NaNlNaN NaN NaN NaN NaN NaN NaN NaNz"  ></path></symbol><symbol id="iconzhongzhi" viewBox="0 0 1024 1024"><path d="M1024 0m0 53.894737l0 916.210526q0 53.894737-53.894737 53.894737l-916.210526 0q-53.894737 0-53.894737-53.894737l0-916.210526q0-53.894737 53.894737-53.894737l916.210526 0q53.894737 0 53.894737 53.894737Z"  ></path><path d="M835.116912 324.033123L891.957895 267.551439 892.335158 512l-246.029474-0.377263 95.752983-95.142176c-59.176421-125.556772-209.596632-179.667088-335.961825-120.867929a251.724351 251.724351 0 0 0-127.155649 133.425403l-132.652912-0.07186C198.512281 227.579509 405.162667 106.388211 607.860772 158.288842a378.826105 378.826105 0 0 1 227.25614 165.744281z m-538.606035 298.217544c59.266246 125.538807 209.740351 179.577263 336.069614 120.670315a251.778246 251.778246 0 0 0 126.976-133.245754l132.778667-0.053895c-52.241965 201.422596-258.928281 322.63186-461.626386 270.713263a378.88 378.88 0 0 1-227.184281-165.690385l-56.858947 56.481684-0.377263-244.502456 246.047438 0.377263-95.824842 95.178105 0 0.053895z"  ></path></symbol><symbol id="iconzhanshi" viewBox="0 0 1024 1024"><path d="M512 294.343111C358.4 294.343111 224.085333 428.714667 224.085333 512c0 83.171556 134.371556 217.656889 287.914667 217.656889 159.971556 0 287.914667-153.6 287.914667-217.656889 0-63.943111-127.943111-217.656889-287.914667-217.656889z m0 313.685333c-51.2 0-96.028444-44.828444-96.028444-96.028444 0-51.2 44.828444-96.028444 96.028444-96.028444 51.2 0 96.028444 44.828444 96.028444 96.028444 0 51.2-44.828444 96.028444-96.028444 96.028444zM512 0C230.4 0 0 230.4 0 512s230.4 512 512 512 512-230.4 512-512-230.4-512-512-512z m0 793.6c-185.571556 0-352.028444-159.971556-352.028444-281.6 0-121.628444 166.456889-281.6 352.028444-281.6 185.571556 0 352.028444 172.828444 352.028444 281.6 0 108.771556-166.456889 281.6-352.028444 281.6z"  ></path></symbol><symbol id="iconzuoshang" viewBox="0 0 1024 1024"><path d="M1006.644068 16.713763m0 52.067796l0 885.794712q0 52.067797-52.067797 52.067797l-885.794712 0q-52.067797 0-52.067796-52.067797l0-885.794712q0-52.067797 52.067796-52.067796l885.794712 0q52.067797 0 52.067797 52.067796Z"  ></path><path d="M395.472271 955.461424l17.49478-542.494373 542.494373-17.49478-262.491119-262.491118L150.475932 150.475932l-17.494779 542.494373z"  ></path></symbol><symbol id="iconxia" viewBox="0 0 1024 1024"><path d="MNaN NaNmNaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNZ"  ></path><path d="MNaN NaNLNaN NaN NaN NaN NaN NaN NaN NaNlNaN NaNz"  ></path></symbol><symbol id="iconyunhanglushu" viewBox="0 0 1137 1024"><path d="M1037.767111 366.40237l-76.231111-220.008296-1.517037-2.048a51.275852 51.275852 0 0 0-3.565037-6.257778C930.702222 89.088 883.749926 0 763.904 0H372.811852C251.828148 0.265481 204.420741 90.794667 179.920593 139.226074L173.700741 151.703704v5.309629c0 0.910222-0.910222 1.820444-0.910222 2.692741L100.958815 365.530074C37.05363 409.144889 0 472.367407 0 538.320593V830.577778c0 40.808296 14.184296 80.402963 40.011852 111.881481v6.712889h5.423407a182.878815 182.878815 0 0 0 113.246815 59.543704 177.682963 177.682963 0 0 0 183.940741-95.345778l449.725629-1.744593a182.992593 182.992593 0 0 0 186.671408 98.152297A179.503407 179.503407 0 0 0 1137.777778 831.260444v-292.029629c-0.606815-64.625778-37.850074-128.265481-100.010667-172.828445z m-778.126222 333.368889a80.175407 80.175407 0 0 1-80.023704-80.327111c0-44.373333 35.84-80.327111 80.023704-80.327111s80.023704 35.991704 80.023704 80.327111c0 44.373333-35.84 80.365037-80.023704 80.365037z m621.340444 0a80.175407 80.175407 0 0 1-80.023703-80.327111c0-44.373333 35.84-80.327111 80.023703-80.327111s80.023704 35.991704 80.023704 80.327111c0 44.373333-35.84 80.365037-80.023704 80.365037zM179.655111 426.249481l86.281482-246.897777v-0.872297c25.78963-49.910519 49.682963-84.612741 107.406222-84.61274h392.078222c58.595556 0 82.488889 36.484741 109.150815 88.177777l1.782518 3.565037c0 1.782519 1.782519 3.565037 2.654815 6.257778l81.957926 234.382222H179.655111z"  ></path></symbol><symbol id="iconzongliang" viewBox="0 0 1024 1024"><path d="M512 413.513143c272.64 0 493.714286-92.598857 493.714286-206.811429C1005.714286 92.452571 784.64 0 512 0S18.285714 92.598857 18.285714 206.701714s221.074286 206.811429 493.714286 206.811429z m419.218286-10.752c-109.092571 59.904-267.483429 88.32-419.218286 88.32-151.844571 0-310.125714-28.416-419.218286-88.32C45.604571 434.468571 18.285714 471.771429 18.285714 511.926857c0 114.249143 221.074286 206.811429 493.714286 206.811429S1005.714286 626.176 1005.714286 511.926857c0-40.118857-27.318857-77.421714-74.496-109.165714z m0 305.225143c-109.092571 59.904-267.483429 88.356571-419.218286 88.356571-151.844571 0-310.125714-28.452571-419.218286-88.356571C45.604571 739.730286 18.285714 777.069714 18.285714 817.188571 18.285714 931.401143 239.36 1024 512 1024S1005.714286 931.401143 1005.714286 817.188571c0-40.118857-27.318857-77.568-74.496-109.202285z"  ></path></symbol><symbol id="iconzuoxia" viewBox="0 0 1024 1024"><path d="M16.713763 17.355932m52.067796 0l885.794712 0q52.067797 0 52.067797 52.067797l0 885.794712q0 52.067797-52.067797 52.067796l-885.794712 0q-52.067797 0-52.067796-52.067796l0-885.794712q0-52.067797 52.067796-52.067797Z"  ></path><path d="M955.461424 628.527729l-542.494373-17.49478-17.49478-542.494373-262.491118 262.491119L150.475932 873.524068l542.494373 17.494779z"  ></path></symbol><symbol id="icondingweiweizhi" viewBox="0 0 1024 1024"><path d="M511.99904 0C282.23904 0 95.99904 189.888 95.99904 424.192c0 117.12 46.592 223.104 121.856 299.904L511.99904 1024l294.144-299.904A427.072 427.072 0 0 0 927.99904 424.192C927.99904 189.888 741.75904 0 511.99904 0z m0 612.608C409.59904 612.352 326.78304 528 327.03904 424.192v-0.128C326.78304 320.32 409.59904 235.904 511.87104 235.648H511.99904c102.4 0.256 185.216 84.608 184.96 188.416v0.128c0.32 103.744-82.432 188.16-184.768 188.48H511.99904v-0.064z"  ></path></symbol><symbol id="iconbaocunmianxing" viewBox="0 0 1024 1024"><path d="M170.642286 0v385.974857c0 31.890286 30.573714 57.782857 68.315428 57.782857h546.084572c37.741714 0 68.315429-25.892571 68.315428-57.782857V0A170.642286 170.642286 0 0 1 1024 170.642286v682.715428A170.642286 170.642286 0 0 1 853.357714 1024H170.642286A170.642286 170.642286 0 0 1 0 853.357714V170.642286A170.642286 170.642286 0 0 1 170.642286 0z m68.315428 0h546.084572v375.442286H238.957714V0z m443.684572 136.557714a34.157714 34.157714 0 0 0-34.084572 34.084572v102.4a34.157714 34.157714 0 0 0 68.242286 0v-102.4a34.157714 34.157714 0 0 0-34.157714-34.084572z"  ></path></symbol><symbol id="iconshang" viewBox="0 0 1024 1024"><path d="M1006.644068 17.355932m0 52.067797l0 885.152542q0 52.067797-52.067797 52.067797l-885.152542 0q-52.067797 0-52.067797-52.067797l0-885.152542q0-52.067797 52.067797-52.067797l885.152542 0q52.067797 0 52.067797 52.067797Z"  ></path><path d="M111.077966 880.813559L506.79322 509.830508 902.508475 880.813559 902.508475 509.830508 506.79322 138.847458l-395.715254 370.98305z"  ></path></symbol><symbol id="iconfenxi" viewBox="0 0 1024 1024"><path d="M284.444339 1024a31.895692 31.895692 0 0 1-31.516433-32.312877 31.933618 31.933618 0 0 1 31.478507-31.326803H739.555282c17.673475 0.265481 31.781914 14.791106 31.478507 32.350803a31.933618 31.933618 0 0 1-31.478507 31.288877h-455.110943zM895.961742 0.000379H127.999953A127.658619 127.658619 0 0 0 0 127.317665v587.775783a127.658619 127.658619 0 0 0 127.999953 127.317286h767.999715A127.658619 127.658619 0 0 0 1023.999621 715.093448V127.317665A127.658619 127.658619 0 0 0 895.999668 0.000379z m-46.724723 260.171756l-246.783909 288.729967c-1.592888 1.896296-1.592888 1.896296-3.33748 3.565036a44.980131 44.980131 0 0 1-63.336273-1.744592l-139.3398-146.735353-175.862454 158.682015a32.123247 32.123247 0 0 1-45.131835-3.223703 31.706062 31.706062 0 0 1 2.123851-43.88028l189.819189-171.34927a44.980131 44.980131 0 0 1 62.729459 2.351407l137.48143 144.876983 232.865099-272.497676a32.123247 32.123247 0 0 1 45.169761-2.920296c13.008588 11.339848 14.601476 30.909618 3.602962 44.183688z"  ></path></symbol><symbol id="icondaochu" viewBox="0 0 1084 1024"><path d="M189.741176 615.243294c0 53.910588 9.336471 106.194824 26.262589 154.202353 61.801412-179.501176 226.183529-307.621647 420.98447-307.621647v76.739765c0 29.515294 16.082824 55.597176 41.562353 69.089882 10.119529 5.059765 21.985882 8.432941 32.948706 8.432941 16.143059 0 31.322353-5.059765 44.93553-15.179294l298.164705-230.942118c18.672941-14.275765 29.635765-37.044706 29.635765-61.500235 0-24.455529-11.023059-47.224471-29.635765-61.500235L756.434824 15.179294A72.161882 72.161882 0 0 0 678.490353 8.432941c-25.419294 12.649412-41.502118 39.634824-41.502118 69.089883V154.202353C390.505412 153.419294 189.741176 360.688941 189.741176 615.243294z m840.282353-22.768941c-29.635765 0-54.211765 24.455529-54.211764 53.970823v64.873412c0 113.784471-4.216471 204.8-216.847059 204.8H325.270588c-219.376941 0-216.847059-96.918588-216.847059-215.762823V430.682353c-15.239529-169.441882 65.234824-206.486588 162.635295-214.076235h3.373176c29.635765 0 54.211765-24.455529 54.211765-53.970824s-24.576-54.814118-54.211765-54.814118H271.058824v-0.783058h-54.211765C97.400471 107.038118 0 203.956706 0 322.800941v485.496471C0 927.021176 97.400471 1024 216.847059 1024h649.697882c119.446588 0 216.847059-96.978824 216.847059-215.762824v-161.792a53.187765 53.187765 0 0 0-53.368471-53.970823z"  ></path></symbol><symbol id="iconkaiqi" viewBox="0 0 1706 1024"><path d="M47.047111 504.604444C47.047111 251.221333 256.284444 45.681778 514.446222 45.681778c258.161778 0 467.399111 205.482667 467.399111 458.922666s-209.237333 458.922667-467.399111 458.922667c-258.161778 0-467.399111-205.482667-467.399111-458.922667M0 505.742222c0 279.267556 230.570667 505.685333 515.072 505.685334h676.522667c284.444444 0 515.072-226.417778 515.072-505.742223C1706.666667 226.417778 1476.096 0 1191.594667 0H515.072C230.627556 0 0 226.417778 0 505.685333"  ></path></symbol><symbol id="iconshanchu" viewBox="0 0 1024 1024"><path d="M784.96 125.12H221.568C170.048 125.12 128 167.04 128 219.2v30.976h750.528v-31.488c0-51.584-41.984-93.568-93.568-93.568zM620.864 62.528l14.016 98.56H371.712l13.952-98.56h235.2zM628.352 0H378.24a55.68 55.68 0 0 0-53.504 46.528l-18.56 131.136a39.872 39.872 0 0 0 40.576 46.528h312.704a39.872 39.872 0 0 0 40.512-46.528L681.408 46.528A54.72 54.72 0 0 0 628.352 0z m172.16 312.704H206.08a56.384 56.384 0 0 0-57.088 62.592l51.072 563.392c3.008 34.048 33.984 62.528 68.032 62.528h469.376c34.56 0 65.024-27.968 68.032-62.528l51.52-563.392a55.744 55.744 0 0 0-56.512-62.592z m-422.336 562.944H284.16l-30.976-437.824h125.056v437.824z m187.648 0H440.704V437.824h125.12v437.824z m156.608 0h-94.08V437.824h125.12l-31.04 437.824z"  ></path></symbol><symbol id="icondaoru" viewBox="0 0 1296 1024"><path d="M973.183381 360.866032a8.32243 8.32243 0 0 0 1.841849-8.663514 7.230964 7.230964 0 0 0-6.753447-4.979815h-200.693358l0.4093-323.619745A24.557991 24.557991 0 0 0 761.711794 6.821664 20.669642 20.669642 0 0 0 746.294833 0H549.830906a20.737859 20.737859 0 0 0-15.280527 6.889881 24.626207 24.626207 0 0 0-6.344148 16.713077l0.4093 323.619745H327.785739a7.230964 7.230964 0 0 0-6.685231 4.979815 8.32243 8.32243 0 0 0 1.84185 8.663514l310.385717 313.660115a20.669642 20.669642 0 0 0 14.734794 6.275931 20.669642 20.669642 0 0 0 14.734795-6.275931l310.385717-313.660115z m309.226034 333.852241l-194.622077-165.493571a81.859969 81.859969 0 0 0-45.5005-17.05416h-77.221237L1184.927835 716.274732l-254.857371 0.136433-95.093998 148.507628H460.262456L369.056807 716.479382l-253.493038-0.136433 227.502498-204.240624-89.295583 0.068217a81.859969 81.859969 0 0 0-45.432283 17.05416L13.648107 694.718273c-11.051096 9.34568-16.508427 28.855639-12.142562 43.385784l77.630537 258.813936c4.365865 14.461928 19.373526 26.331623 33.357938 26.331624h1072.570248c13.984411 0 28.923856-11.869696 33.221505-26.39984l76.402638-258.74572c4.229432-14.530145-1.2279-34.040104-12.278996-43.385784z"  ></path></symbol><symbol id="iconzuo" viewBox="0 0 1024 1024"><path d="MNaN NaNmNaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNlNaN NaNqNaN NaN NaN NaNZ"  ></path><path d="MNaN NaNLNaN NaN NaN NaN NaN NaN NaN NaNlNaN NaNz"  ></path></symbol><symbol id="iconshanchu1" viewBox="0 0 1024 1024"><path d="M784.96 125.12H221.568C170.048 125.12 128 167.04 128 219.2v30.976h750.528v-31.488c0-51.584-41.984-93.568-93.568-93.568zM620.864 62.528l14.016 98.56H371.712l13.952-98.56h235.2zM628.352 0H378.24a55.68 55.68 0 0 0-53.504 46.528l-18.56 131.136a39.872 39.872 0 0 0 40.576 46.528h312.704a39.872 39.872 0 0 0 40.512-46.528L681.408 46.528A54.72 54.72 0 0 0 628.352 0z m172.16 312.704H206.08a56.384 56.384 0 0 0-57.088 62.592l51.072 563.392c3.008 34.048 33.984 62.528 68.032 62.528h469.376c34.56 0 65.024-27.968 68.032-62.528l51.52-563.392a55.744 55.744 0 0 0-56.512-62.592z m-422.336 562.944H284.16l-30.976-437.824h125.056v437.824z m187.648 0H440.704V437.824h125.12v437.824z m156.608 0h-94.08V437.824h125.12l-31.04 437.824z"  ></path></symbol><symbol id="iconbianzu" viewBox="0 0 1024 1024"><path d="M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z"  ></path><path d="M427.776 420.0448l-35.712-128.3328h-95.232v-25.6512h95.232l49.28 135.5008 402.9952-7.168v25.6512H427.776z"  ></path><path d="M439.7312 420.0448h404.608v-68.4544H416.6144z"  ></path><path d="M125.7472 555.4688V693.76h51.968v-4.5056c-0.4096-56.9344 46.1824-103.5264 104.3712-104.4224 58.1888 0.896 104.7552 47.488 104.3712 104.448 0 1.4848 34.048 2.5344 10.496 2.5344h212.0192c0-1.5104 5.6576-1.0496 5.6576-2.56-0.384-56.9344 46.1824-103.5264 104.3712-104.4224a104.448 104.448 0 0 1 39.936 7.936l59.7248-62.336h25.6768v-103.7568H396.6976l-35.328-92.2112H243.5584L126.464 555.4688h-0.7168z m70.6816-25.344l73.3952-139.392h48.0768l31.6672 139.7248-153.1392-0.3584z"  ></path><path d="M639.0272 693.7856a85.5552 85.5552 0 1 0 171.1104 0 85.5552 85.5552 0 1 0-171.1104 0zM211.3024 693.7856a85.5552 85.5552 0 1 0 171.0848 0 85.5552 85.5552 0 1 0-171.0848 0zM449.408 351.5904l-15.6928-30.2848 5.888-7.168 46.8992-26.8288h58.5216l35.328-51.968 69.0432-7.3216 64.1536-30.4128 37.3248 89.7024h31.5904l27.776 4.7616 34.0992 59.52z"  ></path></symbol><symbol id="iconbianzu1" viewBox="0 0 1024 1024"><path d="M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z"  ></path><path d="M851.3792 298.9056l-37.1968-76.8512c-6.0672-12.5952-20.4288-19.456-34.56-16.64L572.7232 247.04l0.0768 0.256c-50.6368 12.5696-87.9104 56.7808-87.808 109.312 0.128 62.0288 54.3488 113.152 118.9632 112.3328a120.96 120.96 0 0 0 57.6-15.36l0.1792 0.4608 179.072-117.9136c12.5184-8.2688 16.9472-24.0128 10.5728-37.1968zM394.88 542.72v-151.296c0-16.4864-13.9008-29.824-31.0528-29.824h-33.408c-23.6032 0-46.336 8.6272-63.6672 24.1408l-93.44 83.84a58.4704 58.4704 0 0 0-19.712 43.52v187.648c0 16.4608 13.9008 29.7984 31.0528 29.7984h15.7696c0-52.7872 44.5952-95.7184 99.6352-95.7184 55.0656 0 99.584 42.8032 99.584 95.6416 0 0.0768 208.512 0.1536 208.512 0.0768 0-52.7872 44.544-95.7184 99.5584-95.7184 54.9632 0 99.5584 43.008 99.5584 95.7952 0 0.0768 32.0768-0.0768 32.0768-0.0768 17.152 0 31.0528-13.3376 31.0528-29.824V602.368c0-16.4864-13.9008-29.824-31.0528-29.824H425.9584c-17.152 0-31.0784-13.312-31.0784-29.7984z m-156.416 190.5152c0 33.3312 28.16 60.3648 62.9248 60.3648 34.7392 0 62.8992-27.0336 62.8992-60.3648 0-33.3568-28.16-60.3904-62.8992-60.3904-34.7392 0-62.8992 27.0336-62.8992 60.3904z m407.7312 0c0 33.3312 28.16 60.3648 62.8992 60.3648 34.7392 0 62.8992-27.0336 62.8992-60.3648 0-33.3568-28.16-60.3904-62.8992-60.3904-34.7392 0-62.8992 27.0336-62.8992 60.3904z m218.2912-311.5008c0.0768-23.9104-27.7248-38.144-48.384-24.832l-131.456 84.7616c-45.44 26.8288-81.3312 25.7792-105.7024 21.9136-64.2304-10.2144-96.9984-45.6192-113.6128-81.9968-20.8896-45.824-16.0768 24.2432-16.0768 24.2432v43.52c0 16.4608 13.9008 29.824 31.0528 29.824h352.896c17.152 0 30.976-13.2864 31.0528-29.7472l0.256-67.6864z"  ></path></symbol><symbol id="iconbianzu2" viewBox="0 0 1024 1024"><path d="M512 512m-499.512195 0a499.512195 499.512195 0 1 0 999.02439 0 499.512195 499.512195 0 1 0-999.02439 0Z"  ></path><path d="M809.284683 682.033951h-53.947317c-6.743415-47.50361-46.154927-84.067902-94.357854-84.067902s-87.964098 36.913951-94.382829 84.067902h-107.844683c-14.835512 0-26.973659-12.312976-26.973659-27.672975V313.044293h45.505561v322.510048h55.620683c22.577951-49.876293 72.129561-84.042927 128.074927-84.042926s105.496976 34.166634 128.074927 84.042926h2.023024V313.044293h45.155903V654.360976c0 15.010341-12.113171 27.672976-26.973659 27.672975z m-58.99239-218.661463c7.417756 0 12.487805 4.096 15.160195 11.963317 0.349659 1.698341 0.674341 3.396683 0.674341 5.444683 0 9.915317-6.044098 15.384976-18.531902 16.059317 5.070049 5.144976 7.417756 10.589659 7.417756 15.384975 0 5.12-2.697366 9.565659-7.742439 13.312a16.384 16.384 0 0 1-9.116098 2.747318c-9.765463 0-16.483902-8.192-20.554926-25.275318l-80.221659-30.420292-80.221659 30.420292c-4.046049 16.733659-10.764488 25.275317-20.230243 25.275318a21.004488 21.004488 0 0 1-9.415805-2.747318c-5.070049-3.746341-7.417756-7.842341-7.417756-13.312 0-5.12 2.347707-10.24 7.417756-15.384975-12.487805-0.674341-18.881561-6.144-18.881561-16.059317 0-2.048 0.349659-3.746341 0.674341-5.444683 3.022049-7.867317 8.092098-11.988293 15.484878-11.988293 6.094049 0 13.162146 3.096976 21.254244 8.891317l46.179903-17.083317-46.854244-17.732683c-7.742439 5.095024-15.160195 7.842341-21.578927 7.842342-7.068098 0-11.788488-4.096-14.485854-11.988293a26.898732 26.898732 0 0 1-0.674341-5.444683c0-9.915317 6.393756-15.384976 18.881561-16.059317-5.070049-5.12-7.417756-10.589659-7.417756-15.36 0-5.144976 2.347707-9.565659 7.417756-13.336976a19.106341 19.106341 0 0 1 8.41678-2.048c10.115122 0 16.858537 8.891317 20.554927 26.299318l80.571317 30.420292 80.546342-31.094634c3.721366-17.083317 10.439805-25.624976 20.554926-25.624976 3.047024 0 5.74439 0.674341 8.441756 2.048 5.394732 3.746341 7.742439 8.192 7.742439 13.336976 0 5.12-2.697366 10.24-7.417756 15.36 12.487805 0.674341 18.531902 6.144 18.531903 16.059317 0 1.698341-0.324683 3.746341-0.674342 5.469659-2.347707 7.867317-7.068098 11.963317-14.485853 11.963317-6.743415 0-13.811512-2.747317-21.578927-7.867317l-46.504586 17.757658 45.830244 17.432976c8.766439-6.144 16.184195-9.240976 22.253269-9.240976z m-61.340098-84.742244v4.096c0 6.843317-1.998049 12.312976-6.393756 16.733658a26.074537 26.074537 0 0 1-16.184195 7.867318c-6.069073 0.349659-10.789463-0.674341-14.161171-3.072a24.825756 24.825756 0 0 1-15.834536 5.494634c-6.069073 0-11.813463-2.072976-16.858537-5.819317-3.371707 2.722341-8.092098 4.096-14.835512 3.396683a24.076488 24.076488 0 0 1-16.184195-7.492683 23.102439 23.102439 0 0 1-6.393756-16.733659v-5.494634c-22.92761-6.818341-40.785171-17.757659-53.248-32.792976a80.49639 80.49639 0 0 1-18.881561-52.623609c0-4.420683 0.349659-9.216 1.348683-14.336 4.370732-30.744976 17.857561-56.045268 40.110829-76.17561 23.601951-21.204293 52.248976-31.469268 86.290732-31.469269s62.68878 10.614634 86.290731 31.793952c22.577951 19.805659 36.06478 45.105951 40.435512 75.850927 0.999024 5.12 1.348683 9.915317 1.348683 14.336 0 20.504976-6.393756 38.262634-19.555902 53.297951-13.486829 15.035317-32.693073 26.324293-57.294049 33.142634z m-80.896-126.75122c-6.743415-8.192-15.160195-12.288-24.600975-12.288-9.765463 0-17.857561 4.096-24.600976 12.288-6.743415 8.192-10.439805 18.107317-10.439805 30.070635 0 11.613659 3.346732 21.853659 10.439805 30.070634 6.743415 8.192 15.160195 12.288 24.600976 12.288 9.765463 0 17.857561-4.096 24.600975-12.288 6.743415-8.216976 10.46478-18.107317 10.464781-30.070634s-3.721366-21.878634-10.464781-30.070635z m38.762146 83.018927c-3.022049-5.12-6.069073-7.492683-9.091121-7.492683-3.371707 0-6.418732 2.372683-9.79044 6.818342a22.153366 22.153366 0 0 0-5.045073 13.661658c0 2.747317 0.674341 5.12 2.347708 7.168 2.697366 3.072 7.093073 4.445659 12.812487 4.445659 8.766439 0 13.162146-3.421659 13.162147-10.24a33.642146 33.642146 0 0 0-4.395708-14.360976z m66.73483-83.018927c-6.743415-8.192-15.160195-12.288-24.925659-12.288-9.44078 0-17.882537 4.096-24.625951 12.288-6.743415 8.192-10.090146 18.107317-10.090146 30.070635 0 11.613659 3.346732 21.853659 10.090146 30.070634 6.743415 8.192 14.835512 12.288 24.625951 12.288 9.740488 0 18.182244-4.096 24.925659-12.288 6.743415-8.216976 10.115122-18.107317 10.115122-30.070634a43.857171 43.857171 0 0 0-10.115122-30.070635zM377.880976 682.033951c-6.743415-47.50361-46.179902-84.067902-94.38283-84.067902s-87.964098 36.913951-94.357853 84.067902h-26.973659c-14.835512 0-26.973659-12.312976-26.973658-27.672975v-137.690537c0-25.974634 20.554927-55.69561 20.554926-55.69561l60.341074-81.994927c12.487805-15.035317 20.554927-27.672976 40.460487-27.672975h121.331513c14.835512 0 26.973659 12.288 26.973658 27.672975V654.360976c0 15.010341-12.138146 27.323317-26.973658 27.672975z m-18.531903-284.27239H259.896195l-6.069073 7.192976-2.023024 2.722341-59.342049 80.621268c-6.044098 9.240976-12.113171 22.902634-12.113171 28.372293l1.348683 11.613659 177.626537-1.723318v-128.799219z m-76.525268 225.50478c38.762146 0 70.43122 32.468293 70.431219 72.07961 0 39.636293-31.669073 72.07961-70.431219 72.07961-38.762146 0-70.43122-32.468293-70.43122-72.07961 0-39.636293 31.669073-72.07961 70.43122-72.07961z m379.529366 0c38.762146 0 70.43122 32.468293 70.431219 72.07961 0 39.636293-31.669073 72.07961-70.431219 72.07961-38.762146 0-70.43122-32.468293-70.43122-72.07961 0-39.960976 31.669073-72.07961 70.43122-72.07961z"  ></path></symbol><symbol id="icontianjia" viewBox="0 0 1024 1024"><path d="M874.03928 149.903832A508.584406 508.584406 0 0 0 512 0.002276a508.755072 508.755072 0 0 0-362.03928 149.901556A508.698184 508.698184 0 0 0 0.002276 512c0 136.81717 53.304652 265.442376 150.015333 362.096168A508.584406 508.584406 0 0 0 512 1023.997724a508.299963 508.299963 0 0 0 361.982391-149.901556A509.039515 509.039515 0 0 0 1023.997724 512a508.356852 508.356852 0 0 0-149.958444-362.03928zM767.998862 548.69317H548.636282v220.443465a36.636282 36.636282 0 0 1-36.579393 36.750059 36.636282 36.636282 0 0 1-36.579393-36.750059V548.750059H256.001138A36.636282 36.636282 0 0 1 219.421745 512c0-20.309243 16.383927-36.750059 36.579393-36.750059h219.476358V254.863365c0-20.309243 16.383927-36.750059 36.579393-36.750059 20.195466 0 36.579393 16.440816 36.579393 36.750059v220.386576H767.998862c20.195466 0 36.579393 16.497704 36.579393 36.750059a36.636282 36.636282 0 0 1-36.579393 36.750059z"  ></path></symbol></svg>',N=(a=document.getElementsByTagName("script"))[a.length-1].getAttribute("data-injectcss");if(N&&!i.__iconfont__svg__cssinject__){i.__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(a){console&&console.log(a)}}!function(a){if(document.addEventListener)if(~["complete","loaded","interactive"].indexOf(document.readyState))setTimeout(a,0);else{var N=function(){document.removeEventListener("DOMContentLoaded",N,!1),a()};document.addEventListener("DOMContentLoaded",N,!1)}else document.attachEvent&&(c=a,t=i.document,h=!1,(o=function(){try{t.documentElement.doScroll("left")}catch(a){return void setTimeout(o,50)}l()})(),t.onreadystatechange=function(){"complete"==t.readyState&&(t.onreadystatechange=null,l())});function l(){h||(h=!0,c())}var c,t,h,o}(function(){var a,N,l,c,t,h;(a=document.createElement("div")).innerHTML=o,o=null,(N=a.getElementsByTagName("svg")[0])&&(N.setAttribute("aria-hidden","true"),N.style.position="absolute",N.style.width=0,N.style.height=0,N.style.overflow="hidden",l=N,(c=document.body).firstChild?(t=l,(h=c.firstChild).parentNode.insertBefore(t,h)):c.appendChild(l))})}(window);
\ No newline at end of file

src/assets/css/icon/iconfont.json

+{
+  "id": "1592179",
+  "name": "fanxin_new",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "12616237",
+      "name": "右",
+      "font_class": "you",
+      "unicode": "e600",
+      "unicode_decimal": 58880
+    },
+    {
+      "icon_id": "12616238",
+      "name": "右上",
+      "font_class": "youshang",
+      "unicode": "e601",
+      "unicode_decimal": 58881
+    },
+    {
+      "icon_id": "12616239",
+      "name": "异常",
+      "font_class": "yichang",
+      "unicode": "e602",
+      "unicode_decimal": 58882
+    },
+    {
+      "icon_id": "12616240",
+      "name": "右下",
+      "font_class": "youxia",
+      "unicode": "e603",
+      "unicode_decimal": 58883
+    },
+    {
+      "icon_id": "12616241",
+      "name": "重置",
+      "font_class": "zhongzhi",
+      "unicode": "e604",
+      "unicode_decimal": 58884
+    },
+    {
+      "icon_id": "12616242",
+      "name": "展示",
+      "font_class": "zhanshi",
+      "unicode": "e605",
+      "unicode_decimal": 58885
+    },
+    {
+      "icon_id": "12616243",
+      "name": "左上",
+      "font_class": "zuoshang",
+      "unicode": "e606",
+      "unicode_decimal": 58886
+    },
+    {
+      "icon_id": "12616244",
+      "name": "下",
+      "font_class": "xia",
+      "unicode": "e607",
+      "unicode_decimal": 58887
+    },
+    {
+      "icon_id": "12616245",
+      "name": "运行路数",
+      "font_class": "yunhanglushu",
+      "unicode": "e608",
+      "unicode_decimal": 58888
+    },
+    {
+      "icon_id": "12616246",
+      "name": "总量",
+      "font_class": "zongliang",
+      "unicode": "e609",
+      "unicode_decimal": 58889
+    },
+    {
+      "icon_id": "12616247",
+      "name": "左下",
+      "font_class": "zuoxia",
+      "unicode": "e60a",
+      "unicode_decimal": 58890
+    },
+    {
+      "icon_id": "12616248",
+      "name": "定位 位置",
+      "font_class": "dingweiweizhi",
+      "unicode": "e60b",
+      "unicode_decimal": 58891
+    },
+    {
+      "icon_id": "12616249",
+      "name": "保存 面性",
+      "font_class": "baocunmianxing",
+      "unicode": "e60c",
+      "unicode_decimal": 58892
+    },
+    {
+      "icon_id": "12616250",
+      "name": "上",
+      "font_class": "shang",
+      "unicode": "e60d",
+      "unicode_decimal": 58893
+    },
+    {
+      "icon_id": "12616251",
+      "name": "分析",
+      "font_class": "fenxi",
+      "unicode": "e60e",
+      "unicode_decimal": 58894
+    },
+    {
+      "icon_id": "12616252",
+      "name": "导出",
+      "font_class": "daochu",
+      "unicode": "e60f",
+      "unicode_decimal": 58895
+    },
+    {
+      "icon_id": "12616253",
+      "name": "开启",
+      "font_class": "kaiqi",
+      "unicode": "e610",
+      "unicode_decimal": 58896
+    },
+    {
+      "icon_id": "12616254",
+      "name": "删 除 (2)",
+      "font_class": "shanchu",
+      "unicode": "e611",
+      "unicode_decimal": 58897
+    },
+    {
+      "icon_id": "12616255",
+      "name": "导入",
+      "font_class": "daoru",
+      "unicode": "e612",
+      "unicode_decimal": 58898
+    },
+    {
+      "icon_id": "12616256",
+      "name": "左",
+      "font_class": "zuo",
+      "unicode": "e613",
+      "unicode_decimal": 58899
+    },
+    {
+      "icon_id": "12616257",
+      "name": "删 除",
+      "font_class": "shanchu1",
+      "unicode": "e614",
+      "unicode_decimal": 58900
+    },
+    {
+      "icon_id": "12616258",
+      "name": "编组 12",
+      "font_class": "bianzu",
+      "unicode": "e615",
+      "unicode_decimal": 58901
+    },
+    {
+      "icon_id": "12616259",
+      "name": "编组 14",
+      "font_class": "bianzu1",
+      "unicode": "e616",
+      "unicode_decimal": 58902
+    },
+    {
+      "icon_id": "12616260",
+      "name": "编组 13",
+      "font_class": "bianzu2",
+      "unicode": "e617",
+      "unicode_decimal": 58903
+    },
+    {
+      "icon_id": "12616261",
+      "name": "添加",
+      "font_class": "tianjia",
+      "unicode": "e618",
+      "unicode_decimal": 58904
+    }
+  ]
+}

src/assets/css/icon/iconfont.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<!--
+2013-9-30: Created.
+-->
+<svg>
+<metadata>
+Created by iconfont
+</metadata>
+<defs>
+
+<font id="iconfont" horiz-adv-x="1024" >
+  <font-face
+    font-family="iconfont"
+    font-weight="500"
+    font-stretch="normal"
+    units-per-em="1024"
+    ascent="896"
+    descent="-128"
+  />
+    <missing-glyph />
+    
+    <glyph glyph-name="you" unicode="&#58880;" d="M1006.644068-110.644068m-52.067797 0l-885.152542 0q-52.067797 0-52.067797 52.067797l0 885.152542q0 52.067797 52.067797 52.067797l885.152542 0q52.067797 0 52.067797-52.067797l0-885.152542q0-52.067797-52.067797-52.067797ZM143.186441 784.922034L514.169492 389.20678 143.186441-6.508475H514.169492L885.152542 389.20678l-370.98305 395.715254z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="youshang" unicode="&#58881;" d=""  horiz-adv-x="1041" />
+
+    
+    <glyph glyph-name="yichang" unicode="&#58882;" d="M378.88 156.16c0 199.68 161.28 360.96 360.96 360.96 33.28 0 64-5.12 94.72-12.8V819.2c0 40.96-33.28 76.8-76.8 76.8H76.8C33.28 896 0 862.72 0 819.2v-796.16c0-40.96 33.28-76.8 76.8-76.8h368.64c-40.96 61.44-66.56 133.12-66.56 209.92zM189.44 744.96h455.68c20.48 0 38.4-17.92 38.4-38.4s-17.92-38.4-38.4-38.4H189.44c-20.48 0-38.4 17.92-38.4 38.4s17.92 38.4 38.4 38.4z m0-227.84h151.04c20.48 0 38.4-17.92 38.4-38.4s-17.92-38.4-38.4-38.4H189.44c-20.48 0-38.4 17.92-38.4 38.4s17.92 38.4 38.4 38.4z m76.8-304.64h-76.8c-20.48 0-38.4 17.92-38.4 38.4s17.92 38.4 38.4 38.4h76.8c20.48 0 38.4-17.92 38.4-38.4s-17.92-38.4-38.4-38.4z m473.6 227.84c156.16 0 284.16-128 284.16-284.16S896-128 739.84-128s-284.16 128-284.16 284.16 128 284.16 284.16 284.16z m0-122.88c-20.48 0-38.4-17.92-38.4-38.4v-153.6c0-20.48 17.92-38.4 38.4-38.4s38.4 17.92 38.4 38.4v153.6c0 20.48-17.92 38.4-38.4 38.4z m0-256c-20.48 0-38.4-17.92-38.4-38.4s17.92-38.4 38.4-38.4 38.4 17.92 38.4 38.4-17.92 38.4-38.4 38.4z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="youxia" unicode="&#58883;" d=""  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="zhongzhi" unicode="&#58884;" d="M1024 896m0-53.894737l0-916.210526q0-53.894737-53.894737-53.894737l-916.210526 0q-53.894737 0-53.894737 53.894737l0 916.210526q0 53.894737 53.894737 53.894737l916.210526 0q53.894737 0 53.894737-53.894737ZM835.116912 571.966877L891.957895 628.448561 892.335158 384l-246.029474 0.377263 95.752983 95.142176c-59.176421 125.556772-209.596632 179.667088-335.961825 120.867929a251.724351 251.724351 0 0 1-127.155649-133.425403l-132.652912 0.07186C198.512281 668.420491 405.162667 789.611789 607.860772 737.711158a378.826105 378.826105 0 0 0 227.25614-165.744281z m-538.606035-298.217544c59.266246-125.538807 209.740351-179.577263 336.069614-120.670315a251.778246 251.778246 0 0 1 126.976 133.245754l132.778667 0.053895c-52.241965-201.422596-258.928281-322.63186-461.626386-270.713263a378.88 378.88 0 0 0-227.184281 165.690385l-56.858947-56.481684-0.377263 244.502456 246.047438-0.377263-95.824842-95.178105 0-0.053895z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="zhanshi" unicode="&#58885;" d="M512 601.656889C358.4 601.656889 224.085333 467.285333 224.085333 384c0-83.171556 134.371556-217.656889 287.914667-217.656889 159.971556 0 287.914667 153.6 287.914667 217.656889 0 63.943111-127.943111 217.656889-287.914667 217.656889z m0-313.685333c-51.2 0-96.028444 44.828444-96.028444 96.028444 0 51.2 44.828444 96.028444 96.028444 96.028444 51.2 0 96.028444-44.828444 96.028444-96.028444 0-51.2-44.828444-96.028444-96.028444-96.028444zM512 896C230.4 896 0 665.6 0 384s230.4-512 512-512 512 230.4 512 512-230.4 512-512 512z m0-793.6c-185.571556 0-352.028444 159.971556-352.028444 281.6 0 121.628444 166.456889 281.6 352.028444 281.6 185.571556 0 352.028444-172.828444 352.028444-281.6 0-108.771556-166.456889-281.6-352.028444-281.6z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="zuoshang" unicode="&#58886;" d="M1006.644068 879.286237m0-52.067796l0-885.794712q0-52.067797-52.067797-52.067797l-885.794712 0q-52.067797 0-52.067796 52.067797l0 885.794712q0 52.067797 52.067796 52.067796l885.794712 0q52.067797 0 52.067797-52.067796ZM395.472271-59.461424l17.49478 542.494373 542.494373 17.49478-262.491119 262.491118L150.475932 745.524068l-17.494779-542.494373z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="xia" unicode="&#58887;" d=""  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="yunhanglushu" unicode="&#58888;" d="M1037.767111 529.59763l-76.231111 220.008296-1.517037 2.048a51.275852 51.275852 0 0 1-3.565037 6.257778C930.702222 806.912 883.749926 896 763.904 896H372.811852C251.828148 895.734519 204.420741 805.205333 179.920593 756.773926L173.700741 744.296296v-5.309629c0-0.910222-0.910222-1.820444-0.910222-2.692741L100.958815 530.469926C37.05363 486.855111 0 423.632593 0 357.679407V65.422222c0-40.808296 14.184296-80.402963 40.011852-111.881481v-6.712889h5.423407a182.878815 182.878815 0 0 1 113.246815-59.543704 177.682963 177.682963 0 0 1 183.940741 95.345778l449.725629 1.744593a182.992593 182.992593 0 0 1 186.671408-98.152297A179.503407 179.503407 0 0 1 1137.777778 64.739556v292.029629c-0.606815 64.625778-37.850074 128.265481-100.010667 172.828445z m-778.126222-333.368889a80.175407 80.175407 0 0 0-80.023704 80.327111c0 44.373333 35.84 80.327111 80.023704 80.327111s80.023704-35.991704 80.023704-80.327111c0-44.373333-35.84-80.365037-80.023704-80.365037z m621.340444 0a80.175407 80.175407 0 0 0-80.023703 80.327111c0 44.373333 35.84 80.327111 80.023703 80.327111s80.023704-35.991704 80.023704-80.327111c0-44.373333-35.84-80.365037-80.023704-80.365037zM179.655111 469.750519l86.281482 246.897777v0.872297c25.78963 49.910519 49.682963 84.612741 107.406222 84.61274h392.078222c58.595556 0 82.488889-36.484741 109.150815-88.177777l1.782518-3.565037c0-1.782519 1.782519-3.565037 2.654815-6.257778l81.957926-234.382222H179.655111z"  horiz-adv-x="1137" />
+
+    
+    <glyph glyph-name="zongliang" unicode="&#58889;" d="M512 482.486857c272.64 0 493.714286 92.598857 493.714286 206.811429C1005.714286 803.547429 784.64 896 512 896S18.285714 803.401143 18.285714 689.298286s221.074286-206.811429 493.714286-206.811429z m419.218286 10.752c-109.092571-59.904-267.483429-88.32-419.218286-88.32-151.844571 0-310.125714 28.416-419.218286 88.32C45.604571 461.531429 18.285714 424.228571 18.285714 384.073143c0-114.249143 221.074286-206.811429 493.714286-206.811429S1005.714286 269.824 1005.714286 384.073143c0 40.118857-27.318857 77.421714-74.496 109.165714z m0-305.225143c-109.092571-59.904-267.483429-88.356571-419.218286-88.356571-151.844571 0-310.125714 28.452571-419.218286 88.356571C45.604571 156.269714 18.285714 118.930286 18.285714 78.811429 18.285714-35.401143 239.36-128 512-128S1005.714286-35.401143 1005.714286 78.811429c0 40.118857-27.318857 77.568-74.496 109.202285z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="zuoxia" unicode="&#58890;" d="M16.713763 878.644068m52.067796 0l885.794712 0q52.067797 0 52.067797-52.067797l0-885.794712q0-52.067797-52.067797-52.067796l-885.794712 0q-52.067797 0-52.067796 52.067796l0 885.794712q0 52.067797 52.067796 52.067797ZM955.461424 267.472271l-542.494373 17.49478-17.49478 542.494373-262.491118-262.491119L150.475932 22.475932l542.494373-17.494779z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="dingweiweizhi" unicode="&#58891;" d="M511.99904 896C282.23904 896 95.99904 706.112 95.99904 471.808c0-117.12 46.592-223.104 121.856-299.904L511.99904-128l294.144 299.904A427.072 427.072 0 0 1 927.99904 471.808C927.99904 706.112 741.75904 896 511.99904 896z m0-612.608C409.59904 283.648 326.78304 368 327.03904 471.808v0.128C326.78304 575.68 409.59904 660.096 511.87104 660.352H511.99904c102.4-0.256 185.216-84.608 184.96-188.416v-0.128c0.32-103.744-82.432-188.16-184.768-188.48H511.99904v0.064z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="baocunmianxing" unicode="&#58892;" d="M170.642286 896v-385.974857c0-31.890286 30.573714-57.782857 68.315428-57.782857h546.084572c37.741714 0 68.315429 25.892571 68.315428 57.782857V896A170.642286 170.642286 0 0 0 1024 725.357714v-682.715428A170.642286 170.642286 0 0 0 853.357714-128H170.642286A170.642286 170.642286 0 0 0 0 42.642286V725.357714A170.642286 170.642286 0 0 0 170.642286 896z m68.315428 0h546.084572v-375.442286H238.957714V896z m443.684572-136.557714a34.157714 34.157714 0 0 1-34.084572-34.084572v-102.4a34.157714 34.157714 0 0 1 68.242286 0v102.4a34.157714 34.157714 0 0 1-34.157714 34.084572z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="shang" unicode="&#58893;" d="M1006.644068 878.644068m0-52.067797l0-885.152542q0-52.067797-52.067797-52.067797l-885.152542 0q-52.067797 0-52.067797 52.067797l0 885.152542q0 52.067797 52.067797 52.067797l885.152542 0q52.067797 0 52.067797-52.067797ZM111.077966 15.186441L506.79322 386.169492 902.508475 15.186441 902.508475 386.169492 506.79322 757.152542l-395.715254-370.98305z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="fenxi" unicode="&#58894;" d="M284.444339-128a31.895692 31.895692 0 0 0-31.516433 32.312877 31.933618 31.933618 0 0 0 31.478507 31.326803H739.555282c17.673475-0.265481 31.781914-14.791106 31.478507-32.350803a31.933618 31.933618 0 0 0-31.478507-31.288877h-455.110943zM895.961742 895.999621H127.999953A127.658619 127.658619 0 0 1 0 768.682335v-587.775783a127.658619 127.658619 0 0 1 127.999953-127.317286h767.999715A127.658619 127.658619 0 0 1 1023.999621 180.906552V768.682335A127.658619 127.658619 0 0 1 895.999668 895.999621z m-46.724723-260.171756l-246.783909-288.729967c-1.592888-1.896296-1.592888-1.896296-3.33748-3.565036a44.980131 44.980131 0 0 0-63.336273 1.744592l-139.3398 146.735353-175.862454-158.682015a32.123247 32.123247 0 0 0-45.131835 3.223703 31.706062 31.706062 0 0 0 2.123851 43.88028l189.819189 171.34927a44.980131 44.980131 0 0 0 62.729459-2.351407l137.48143-144.876983 232.865099 272.497676a32.123247 32.123247 0 0 0 45.169761 2.920296c13.008588-11.339848 14.601476-30.909618 3.602962-44.183688z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="daochu" unicode="&#58895;" d="M189.741176 280.756706c0-53.910588 9.336471-106.194824 26.262589-154.202353 61.801412 179.501176 226.183529 307.621647 420.98447 307.621647v-76.739765c0-29.515294 16.082824-55.597176 41.562353-69.089882 10.119529-5.059765 21.985882-8.432941 32.948706-8.432941 16.143059 0 31.322353 5.059765 44.93553 15.179294l298.164705 230.942118c18.672941 14.275765 29.635765 37.044706 29.635765 61.500235 0 24.455529-11.023059 47.224471-29.635765 61.500235L756.434824 880.820706A72.161882 72.161882 0 0 1 678.490353 887.567059c-25.419294-12.649412-41.502118-39.634824-41.502118-69.089883V741.797647C390.505412 742.580706 189.741176 535.311059 189.741176 280.756706z m840.282353 22.768941c-29.635765 0-54.211765-24.455529-54.211764-53.970823v-64.873412c0-113.784471-4.216471-204.8-216.847059-204.8H325.270588c-219.376941 0-216.847059 96.918588-216.847059 215.762823V465.317647c-15.239529 169.441882 65.234824 206.486588 162.635295 214.076235h3.373176c29.635765 0 54.211765 24.455529 54.211765 53.970824s-24.576 54.814118-54.211765 54.814118H271.058824v0.783058h-54.211765C97.400471 788.961882 0 692.043294 0 573.199059v-485.496471C0-31.021176 97.400471-128 216.847059-128h649.697882c119.446588 0 216.847059 96.978824 216.847059 215.762824v161.792a53.187765 53.187765 0 0 1-53.368471 53.970823z"  horiz-adv-x="1084" />
+
+    
+    <glyph glyph-name="kaiqi" unicode="&#58896;" d="M47.047111 391.395556C47.047111 644.778667 256.284444 850.318222 514.446222 850.318222c258.161778 0 467.399111-205.482667 467.399111-458.922666s-209.237333-458.922667-467.399111-458.922667c-258.161778 0-467.399111 205.482667-467.399111 458.922667M0 390.257778c0-279.267556 230.570667-505.685333 515.072-505.685334h676.522667c284.444444 0 515.072 226.417778 515.072 505.742223C1706.666667 669.582222 1476.096 896 1191.594667 896H515.072C230.627556 896 0 669.582222 0 390.314667"  horiz-adv-x="1706" />
+
+    
+    <glyph glyph-name="shanchu" unicode="&#58897;" d="M784.96 770.88H221.568C170.048 770.88 128 728.96 128 676.8v-30.976h750.528v31.488c0 51.584-41.984 93.568-93.568 93.568zM620.864 833.472l14.016-98.56H371.712l13.952 98.56h235.2zM628.352 896H378.24a55.68 55.68 0 0 1-53.504-46.528l-18.56-131.136a39.872 39.872 0 0 1 40.576-46.528h312.704a39.872 39.872 0 0 1 40.512 46.528L681.408 849.472A54.72 54.72 0 0 1 628.352 896z m172.16-312.704H206.08a56.384 56.384 0 0 1-57.088-62.592l51.072-563.392c3.008-34.048 33.984-62.528 68.032-62.528h469.376c34.56 0 65.024 27.968 68.032 62.528l51.52 563.392a55.744 55.744 0 0 1-56.512 62.592z m-422.336-562.944H284.16l-30.976 437.824h125.056v-437.824z m187.648 0H440.704V458.176h125.12v-437.824z m156.608 0h-94.08V458.176h125.12l-31.04-437.824z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="daoru" unicode="&#58898;" d="M973.183381 535.133968a8.32243 8.32243 0 0 1 1.841849 8.663514 7.230964 7.230964 0 0 1-6.753447 4.979815h-200.693358l0.4093 323.619745A24.557991 24.557991 0 0 1 761.711794 889.178336 20.669642 20.669642 0 0 1 746.294833 896H549.830906a20.737859 20.737859 0 0 1-15.280527-6.889881 24.626207 24.626207 0 0 1-6.344148-16.713077l0.4093-323.619745H327.785739a7.230964 7.230964 0 0 1-6.685231-4.979815 8.32243 8.32243 0 0 1 1.84185-8.663514l310.385717-313.660115a20.669642 20.669642 0 0 1 14.734794-6.275931 20.669642 20.669642 0 0 1 14.734795 6.275931l310.385717 313.660115z m309.226034-333.852241l-194.622077 165.493571a81.859969 81.859969 0 0 1-45.5005 17.05416h-77.221237L1184.927835 179.725268l-254.857371-0.136433-95.093998-148.507628H460.262456L369.056807 179.520618l-253.493038 0.136433 227.502498 204.240624-89.295583-0.068217a81.859969 81.859969 0 0 1-45.432283-17.05416L13.648107 201.281727c-11.051096-9.34568-16.508427-28.855639-12.142562-43.385784l77.630537-258.813936c4.365865-14.461928 19.373526-26.331623 33.357938-26.331624h1072.570248c13.984411 0 28.923856 11.869696 33.221505 26.39984l76.402638 258.74572c4.229432 14.530145-1.2279 34.040104-12.278996 43.385784z"  horiz-adv-x="1296" />
+
+    
+    <glyph glyph-name="zuo" unicode="&#58899;" d=""  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="shanchu1" unicode="&#58900;" d="M784.96 770.88H221.568C170.048 770.88 128 728.96 128 676.8v-30.976h750.528v31.488c0 51.584-41.984 93.568-93.568 93.568zM620.864 833.472l14.016-98.56H371.712l13.952 98.56h235.2zM628.352 896H378.24a55.68 55.68 0 0 1-53.504-46.528l-18.56-131.136a39.872 39.872 0 0 1 40.576-46.528h312.704a39.872 39.872 0 0 1 40.512 46.528L681.408 849.472A54.72 54.72 0 0 1 628.352 896z m172.16-312.704H206.08a56.384 56.384 0 0 1-57.088-62.592l51.072-563.392c3.008-34.048 33.984-62.528 68.032-62.528h469.376c34.56 0 65.024 27.968 68.032 62.528l51.52 563.392a55.744 55.744 0 0 1-56.512 62.592z m-422.336-562.944H284.16l-30.976 437.824h125.056v-437.824z m187.648 0H440.704V458.176h125.12v-437.824z m156.608 0h-94.08V458.176h125.12l-31.04-437.824z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="bianzu" unicode="&#58901;" d="M512 384m-512 0a512 512 0 1 1 1024 0 512 512 0 1 1-1024 0ZM427.776 475.9552l-35.712 128.3328h-95.232v25.6512h95.232l49.28-135.5008 402.9952 7.168v-25.6512H427.776zM439.7312 475.9552h404.608v68.4544H416.6144zM125.7472 340.5312V202.24h51.968v4.5056c-0.4096 56.9344 46.1824 103.5264 104.3712 104.4224 58.1888-0.896 104.7552-47.488 104.3712-104.448 0-1.4848 34.048-2.5344 10.496-2.5344h212.0192c0 1.5104 5.6576 1.0496 5.6576 2.56-0.384 56.9344 46.1824 103.5264 104.3712 104.4224a104.448 104.448 0 0 0 39.936-7.936l59.7248 62.336h25.6768v103.7568H396.6976l-35.328 92.2112H243.5584L126.464 340.5312h-0.7168z m70.6816 25.344l73.3952 139.392h48.0768l31.6672-139.7248-153.1392 0.3584zM639.0272 202.2144a85.5552 85.5552 0 1 1 171.1104 0 85.5552 85.5552 0 1 1-171.1104 0zM211.3024 202.2144a85.5552 85.5552 0 1 1 171.0848 0 85.5552 85.5552 0 1 1-171.0848 0zM449.408 544.4096l-15.6928 30.2848 5.888 7.168 46.8992 26.8288h58.5216l35.328 51.968 69.0432 7.3216 64.1536 30.4128 37.3248-89.7024h31.5904l27.776-4.7616 34.0992-59.52z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="bianzu1" unicode="&#58902;" d="M512 384m-512 0a512 512 0 1 1 1024 0 512 512 0 1 1-1024 0ZM851.3792 597.0944l-37.1968 76.8512c-6.0672 12.5952-20.4288 19.456-34.56 16.64L572.7232 648.96l0.0768-0.256c-50.6368-12.5696-87.9104-56.7808-87.808-109.312 0.128-62.0288 54.3488-113.152 118.9632-112.3328a120.96 120.96 0 0 1 57.6 15.36l0.1792-0.4608 179.072 117.9136c12.5184 8.2688 16.9472 24.0128 10.5728 37.1968zM394.88 353.28v151.296c0 16.4864-13.9008 29.824-31.0528 29.824h-33.408c-23.6032 0-46.336-8.6272-63.6672-24.1408l-93.44-83.84a58.4704 58.4704 0 0 1-19.712-43.52v-187.648c0-16.4608 13.9008-29.7984 31.0528-29.7984h15.7696c0 52.7872 44.5952 95.7184 99.6352 95.7184 55.0656 0 99.584-42.8032 99.584-95.6416 0-0.0768 208.512-0.1536 208.512-0.0768 0 52.7872 44.544 95.7184 99.5584 95.7184 54.9632 0 99.5584-43.008 99.5584-95.7952 0-0.0768 32.0768 0.0768 32.0768 0.0768 17.152 0 31.0528 13.3376 31.0528 29.824V293.632c0 16.4864-13.9008 29.824-31.0528 29.824H425.9584c-17.152 0-31.0784 13.312-31.0784 29.7984z m-156.416-190.5152c0-33.3312 28.16-60.3648 62.9248-60.3648 34.7392 0 62.8992 27.0336 62.8992 60.3648 0 33.3568-28.16 60.3904-62.8992 60.3904-34.7392 0-62.8992-27.0336-62.8992-60.3904z m407.7312 0c0-33.3312 28.16-60.3648 62.8992-60.3648 34.7392 0 62.8992 27.0336 62.8992 60.3648 0 33.3568-28.16 60.3904-62.8992 60.3904-34.7392 0-62.8992-27.0336-62.8992-60.3904z m218.2912 311.5008c0.0768 23.9104-27.7248 38.144-48.384 24.832l-131.456-84.7616c-45.44-26.8288-81.3312-25.7792-105.7024-21.9136-64.2304 10.2144-96.9984 45.6192-113.6128 81.9968-20.8896 45.824-16.0768-24.2432-16.0768-24.2432v-43.52c0-16.4608 13.9008-29.824 31.0528-29.824h352.896c17.152 0 30.976 13.2864 31.0528 29.7472l0.256 67.6864z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="bianzu2" unicode="&#58903;" d="M512 384m-499.512195 0a499.512195 499.512195 0 1 1 999.02439 0 499.512195 499.512195 0 1 1-999.02439 0ZM809.284683 213.966049h-53.947317c-6.743415 47.50361-46.154927 84.067902-94.357854 84.067902s-87.964098-36.913951-94.382829-84.067902h-107.844683c-14.835512 0-26.973659 12.312976-26.973659 27.672975V582.955707h45.505561v-322.510048h55.620683c22.577951 49.876293 72.129561 84.042927 128.074927 84.042926s105.496976-34.166634 128.074927-84.042926h2.023024V582.955707h45.155903V241.639024c0-15.010341-12.113171-27.672976-26.973659-27.672975z m-58.99239 218.661463c7.417756 0 12.487805-4.096 15.160195-11.963317 0.349659-1.698341 0.674341-3.396683 0.674341-5.444683 0-9.915317-6.044098-15.384976-18.531902-16.059317 5.070049-5.144976 7.417756-10.589659 7.417756-15.384975 0-5.12-2.697366-9.565659-7.742439-13.312a16.384 16.384 0 0 0-9.116098-2.747318c-9.765463 0-16.483902 8.192-20.554926 25.275318l-80.221659 30.420292-80.221659-30.420292c-4.046049-16.733659-10.764488-25.275317-20.230243-25.275318a21.004488 21.004488 0 0 0-9.415805 2.747318c-5.070049 3.746341-7.417756 7.842341-7.417756 13.312 0 5.12 2.347707 10.24 7.417756 15.384975-12.487805 0.674341-18.881561 6.144-18.881561 16.059317 0 2.048 0.349659 3.746341 0.674341 5.444683 3.022049 7.867317 8.092098 11.988293 15.484878 11.988293 6.094049 0 13.162146-3.096976 21.254244-8.891317l46.179903 17.083317-46.854244 17.732683c-7.742439-5.095024-15.160195-7.842341-21.578927-7.842342-7.068098 0-11.788488 4.096-14.485854 11.988293a26.898732 26.898732 0 0 0-0.674341 5.444683c0 9.915317 6.393756 15.384976 18.881561 16.059317-5.070049 5.12-7.417756 10.589659-7.417756 15.36 0 5.144976 2.347707 9.565659 7.417756 13.336976a19.106341 19.106341 0 0 0 8.41678 2.048c10.115122 0 16.858537-8.891317 20.554927-26.299318l80.571317-30.420292 80.546342 31.094634c3.721366 17.083317 10.439805 25.624976 20.554926 25.624976 3.047024 0 5.74439-0.674341 8.441756-2.048 5.394732-3.746341 7.742439-8.192 7.742439-13.336976 0-5.12-2.697366-10.24-7.417756-15.36 12.487805-0.674341 18.531902-6.144 18.531903-16.059317 0-1.698341-0.324683-3.746341-0.674342-5.469659-2.347707-7.867317-7.068098-11.963317-14.485853-11.963317-6.743415 0-13.811512 2.747317-21.578927 7.867317l-46.504586-17.757658 45.830244-17.432976c8.766439 6.144 16.184195 9.240976 22.253269 9.240976z m-61.340098 84.742244v-4.096c0-6.843317-1.998049-12.312976-6.393756-16.733658a26.074537 26.074537 0 0 0-16.184195-7.867318c-6.069073-0.349659-10.789463 0.674341-14.161171 3.072a24.825756 24.825756 0 0 0-15.834536-5.494634c-6.069073 0-11.813463 2.072976-16.858537 5.819317-3.371707-2.722341-8.092098-4.096-14.835512-3.396683a24.076488 24.076488 0 0 0-16.184195 7.492683 23.102439 23.102439 0 0 0-6.393756 16.733659v5.494634c-22.92761 6.818341-40.785171 17.757659-53.248 32.792976a80.49639 80.49639 0 0 0-18.881561 52.623609c0 4.420683 0.349659 9.216 1.348683 14.336 4.370732 30.744976 17.857561 56.045268 40.110829 76.17561 23.601951 21.204293 52.248976 31.469268 86.290732 31.469269s62.68878-10.614634 86.290731-31.793952c22.577951-19.805659 36.06478-45.105951 40.435512-75.850927 0.999024-5.12 1.348683-9.915317 1.348683-14.336 0-20.504976-6.393756-38.262634-19.555902-53.297951-13.486829-15.035317-32.693073-26.324293-57.294049-33.142634z m-80.896 126.75122c-6.743415 8.192-15.160195 12.288-24.600975 12.288-9.765463 0-17.857561-4.096-24.600976-12.288-6.743415-8.192-10.439805-18.107317-10.439805-30.070635 0-11.613659 3.346732-21.853659 10.439805-30.070634 6.743415-8.192 15.160195-12.288 24.600976-12.288 9.765463 0 17.857561 4.096 24.600975 12.288 6.743415 8.216976 10.46478 18.107317 10.464781 30.070634s-3.721366 21.878634-10.464781 30.070635z m38.762146-83.018927c-3.022049 5.12-6.069073 7.492683-9.091121 7.492683-3.371707 0-6.418732-2.372683-9.79044-6.818342a22.153366 22.153366 0 0 1-5.045073-13.661658c0-2.747317 0.674341-5.12 2.347708-7.168 2.697366-3.072 7.093073-4.445659 12.812487-4.445659 8.766439 0 13.162146 3.421659 13.162147 10.24a33.642146 33.642146 0 0 1-4.395708 14.360976z m66.73483 83.018927c-6.743415 8.192-15.160195 12.288-24.925659 12.288-9.44078 0-17.882537-4.096-24.625951-12.288-6.743415-8.192-10.090146-18.107317-10.090146-30.070635 0-11.613659 3.346732-21.853659 10.090146-30.070634 6.743415-8.192 14.835512-12.288 24.625951-12.288 9.740488 0 18.182244 4.096 24.925659 12.288 6.743415 8.216976 10.115122 18.107317 10.115122 30.070634a43.857171 43.857171 0 0 1-10.115122 30.070635zM377.880976 213.966049c-6.743415 47.50361-46.179902 84.067902-94.38283 84.067902s-87.964098-36.913951-94.357853-84.067902h-26.973659c-14.835512 0-26.973659 12.312976-26.973658 27.672975v137.690537c0 25.974634 20.554927 55.69561 20.554926 55.69561l60.341074 81.994927c12.487805 15.035317 20.554927 27.672976 40.460487 27.672975h121.331513c14.835512 0 26.973659-12.288 26.973658-27.672975V241.639024c0-15.010341-12.138146-27.323317-26.973658-27.672975z m-18.531903 284.27239H259.896195l-6.069073-7.192976-2.023024-2.722341-59.342049-80.621268c-6.044098-9.240976-12.113171-22.902634-12.113171-28.372293l1.348683-11.613659 177.626537 1.723318v128.799219z m-76.525268-225.50478c38.762146 0 70.43122-32.468293 70.431219-72.07961 0-39.636293-31.669073-72.07961-70.431219-72.07961-38.762146 0-70.43122 32.468293-70.43122 72.07961 0 39.636293 31.669073 72.07961 70.43122 72.07961z m379.529366 0c38.762146 0 70.43122-32.468293 70.431219-72.07961 0-39.636293-31.669073-72.07961-70.431219-72.07961-38.762146 0-70.43122 32.468293-70.43122 72.07961 0 39.960976 31.669073 72.07961 70.43122 72.07961z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="tianjia" unicode="&#58904;" d="M874.03928 746.096168A508.584406 508.584406 0 0 1 512 895.997724a508.755072 508.755072 0 0 1-362.03928-149.901556A508.698184 508.698184 0 0 1 0.002276 384c0-136.81717 53.304652-265.442376 150.015333-362.096168A508.584406 508.584406 0 0 1 512-127.997724a508.299963 508.299963 0 0 1 361.982391 149.901556A509.039515 509.039515 0 0 1 1023.997724 384a508.356852 508.356852 0 0 1-149.958444 362.03928zM767.998862 347.30683H548.636282v-220.443465a36.636282 36.636282 0 0 0-36.579393-36.750059 36.636282 36.636282 0 0 0-36.579393 36.750059V347.249941H256.001138A36.636282 36.636282 0 0 0 219.421745 384c0 20.309243 16.383927 36.750059 36.579393 36.750059h219.476358V641.136635c0 20.309243 16.383927 36.750059 36.579393 36.750059 20.195466 0 36.579393-16.440816 36.579393-36.750059v-220.386576H767.998862c20.195466 0 36.579393-16.497704 36.579393-36.750059a36.636282 36.636282 0 0 0-36.579393-36.750059z"  horiz-adv-x="1024" />
+
+    
+
+
+  </font>
+</defs></svg>

src/assets/css/public.css

@@ -53,3 +53,94 @@ html,body{
   background: #D7EDFF;
   cursor: pointer;
 }
+.el-table__body tr{
+  background: #f4f4f4;
+}
+/* 抓拍展示 */
+.pic-box {
+	width: 100%;
+	margin-bottom:10px;
+  background:#F1F1F1;
+	border-radius:2px;
+	overflow :hidden;
+  font-size :14px;
+  color: #555;
+  padding: 6px;
+ }
+.picbackground{
+	height: 133px;
+	background-size:100% 100%;
+}
+.picbackground img{
+  height: 100%;
+  width:100%;
+  margin-top :-1px;
+}
+.pic-info{
+	padding-left:10px;
+}
+.pic-info li{
+		overflow:hidden;
+		margin-bottom:8px;
+}
+.pic-info li span{
+  display:inline-block;
+}
+.pic-info li span:nth-child(1){
+    width:60px;
+}
+.pic-info li span:nth-child(2){
+  padding-left: 10px
+}
+.el-input-group__append{
+  background-color: #0d3a79;
+  border: 0px;
+}
+.wtbox .el-table{
+  border-bottom: 0px
+
+}
+.el-table--border::after, .el-table--group::after, .el-table::before{
+  background-color: none;
+}
+.wtbox .el-table td, .el-table th{
+  padding: 8px 0
+}
+.el-table--border::after, .el-table--group::after, .el-table::before{
+  background-color: rgba(0,0,0,0);
+}
+::-webkit-scrollbar{
+  width: 10px;
+  height: 10px;
+  background-color: #333;
+}
+/*滚动条的轨道*/
+::-webkit-scrollbar-track{
+  box-shadow: inset 0 0 5px rgba(0,0,0,.3);
+  background-color: #fff;
+}
+/*滚动条的滑块按钮*/
+::-webkit-scrollbar-thumb{
+  border-radius: 10px;
+  background-color: rgba(133, 133, 133, 0.31);
+}
+/*滚动条的上下两端的按钮*/
+::-webkit-scrollbar-button{
+  height: 10px;
+  background-color: #B0AEDA;
+}
+
+.dev-box .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content{
+  background:rgba(0,0,0,.3);
+}
+.clearpright{
+  padding-right: 0!important;
+}
+.chart-header-box .el-input--small .el-input__inner{
+  height:23px;
+  line-height:23px;
+  font-size: 12px;
+}
+.chart-header-box .el-input--small .el-input__icon{
+  line-height: 23px;
+}
\ No newline at end of file

src/assets/resetElementCss/index.css

@@ -24,7 +24,6 @@
 }
 .el-popper[x-placement^=bottom]{
 	margin-top: 0;
-	left:0!important;
 }
 .el-select-dropdown__list{
 	padding: 4px 0;

src/main.js

@@ -9,7 +9,7 @@ import api from "./api/install";
 import "./assets/css/public.css";
 import echarts from "echarts";
 import "./assets/icon/iconfont.css";
-import buildCode from "../src/assets/js/buildcodes";
+import { buildCode } from "../src/assets/js/buildcodes";
 import moment from "moment";
 Vue.prototype.$echarts = echarts;
 Vue.prototype.$moment = moment;
@@ -26,3 +26,39 @@ new Vue({
   store,
   render: h => h(App)
 }).$mount("#app");
+
+/**
+ * 图片上传限制
+ */
+Vue.prototype.uploadImgCondition = function (file) {
+  const isJPG = file.type === "image/jpeg";
+  const isLt2M = file.size / 1024 / 1024 < 2;
+
+  if (!isJPG) {
+    this.$message.error("上传头像图片只能是 JPG 格式!");
+  }
+  if (!isLt2M) {
+    this.$message.error("上传头像图片大小不能超过 2MB!");
+  }
+  return isJPG && isLt2M;
+}
+
+/**
+ * tar文件上传设置
+ */
+Vue.prototype.uploadFile = function(file, type, size) {
+  debugger
+  const isType = file.type === type;
+  let isSize = null;
+  if (size) {
+    isSize = file.size / 1024 / 1024 < size;
+  }
+
+  if (!isType) {
+    this.$message.error(`上传头像文件只能${type}是格式!`);
+  }
+  if (size && !isSize) {
+    this.$message.error(`文件大小不能超过 ${size}MB!`);
+  }
+  return isType && isSize;
+}

src/views/mapShow/eventTypedis.vue

+<template>
+  <div>
+    <div class="chart-header-box">
+      <div class="header-title">事件类型分布</div>
+    </div>
+    <div id="eventchart" class="eventchart"></div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      illtype: ""
+    };
+  },
+  methods: {
+    initchart() {
+      var ydata = [
+        {
+          name: "拥堵",
+          value: 18
+        },
+        {
+          name: "异常停车",
+          value: 16
+        },
+        {
+          name: "遗撒",
+          value: 15
+        },
+        {
+          name: "行人上路",
+          value: 14
+        },
+        {
+          name: "追尾",
+          value: 10
+        },
+        {
+          name: "其他",
+          value: 7.9
+        },
+      ];
+      var color = [
+        "#0069FF",
+        "#3BB7FF",
+        "#FF9630",
+        "#FFC62E",
+        "#87D14B",
+        "#7460EE",
+        "#f59a8f",
+      ];
+      var xdata = [
+        "拥堵",
+        "异常停车",
+        "遗撒",
+        "行人上路",
+        "追尾",
+        "其他",
+      ];
+      let maychart = this.$echarts.init(document.getElementById("eventchart"));
+      let option = {
+        color: color,
+        legend: {
+          orient: "vartical",
+          x: "left",
+          top: "center",
+          left: "55%",
+          bottom: "0%",
+          data: xdata,
+          itemWidth: 6,
+          itemHeight: 8,
+          itemGap: 10,
+          /*formatter:function(name){
+	      var oa = option.series[0].data;
+	      var num = oa[0].value + oa[1].value + oa[2].value + oa[3].value+oa[4].value + oa[5].value + oa[6].value + oa[7].value+oa[8].value + oa[9].value ;
+	      for(var i = 0; i < option.series[0].data.length; i++){
+              if(name==oa[i].name){
+              	return ' '+name + '    |    ' + oa[i].value + '    |    ' + (oa[i].value/num * 100).toFixed(2) + '%';
+              }
+	      }
+	    }*/
+
+          formatter: function(name) {
+            return "" + name;
+          }
+        },
+        series: [
+          {
+            type: "pie",
+            clockwise: false, //饼图的扇区是否是顺时针排布
+            minAngle: 2, //最小的扇区角度（0 ~ 360）
+            radius: ["50%", "70%"],
+            center: ["30%", "50%"],
+            avoidLabelOverlap: false,
+            itemStyle: {
+              //图形样式
+              normal: {
+                borderColor: "#ffffff",
+                borderWidth: 1
+              }
+            },
+            label: {
+              normal: {
+                show: false,
+                position: "center",
+                formatter: "{text|{b}}\n{c} ({d}%)",
+                rich: {
+                  text: {
+                    color: "#666",
+                    fontSize: 14,
+                    align: "center",
+                    verticalAlign: "middle",
+                    padding: 8
+                  },
+                  value: {
+                    color: "#8693F3",
+                    fontSize: 24,
+                    align: "center",
+                    verticalAlign: "middle"
+                  }
+                }
+              },
+              emphasis: {
+                show: true,
+                textStyle: {
+                  fontSize: 14
+                }
+              }
+            },
+            data: ydata
+          }
+        ]
+      };
+      maychart.setOption(option);
+    }
+  },
+  mounted() {
+    this.initchart();
+  }
+};
+</script>
+
+<style lang="stylus" scoped>
+.chart-header-box {
+  height: 3vh;
+  overflow: hidden;
+  font-size: 14px;
+}
+.header-title{
+  line-height 3vh;
+  font-weight 600
+  padding-left 5px
+}
+.eventchart {
+  height: 22vh;
+  width: 20vw;
+}
+
+.header-label {
+  font-size: 12px;
+  line-height: 3vh;
+  float: left;
+}
+
+.header-select {
+  width: 4.5vw;
+  margin: 0.2vh 0.5vw 0 0.2vw;
+  float: left;
+}
+</style>
\ No newline at end of file

src/views/mapShow/illegaltrend.vue

+<template>
+  <div>
+    <div class="chart-header-box">
+      <el-col :span="5" class="header-title">违法事件趋势</el-col>
+        <span class="header-label">违法</span>
+        <div class="header-select">
+          <el-select v-model="illtype">
+           <el-option
+            v-for="item in options"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value">
+          </el-option>
+        </el-select>
+        </div>
+        <span  class="header-label">事件</span>
+        <div class="header-select">
+          <el-select v-model="illtype">
+           <el-option
+            v-for="item in options"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value">
+          </el-option>
+        </el-select>
+        </div>
+        <span class="header-label">重点车辆</span>
+        <div class="header-select">
+          <el-select v-model="illtype">
+           <el-option
+            v-for="item in options"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value">
+          </el-option>
+        </el-select>
+      </div>
+    </div>
+    <div id="illtrendchart" class="illtrendchart"></div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      illtype:'',
+      options: [{
+        value: '选项1',
+        label: '黄金糕'
+      }, {
+        value: '选项2',
+        label: '双皮奶'
+      }, {
+        value: '选项3',
+        label: '蚵仔煎'
+      }, {
+        value: '选项4',
+        label: '龙须面'
+      }, {
+        value: '选项5',
+        label: '北京烤鸭'
+      }],
+    };
+  },
+  methods: {
+    initchart() {
+      let maychart = this.$echarts.init(document.getElementById("illtrendchart"));
+      let option = {
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            type: "shadow"
+          }
+        },
+        legend: {
+          data: ["违法", "事件", "重点车辆"],
+          align: "right",
+          bottom: 0,
+          textStyle: {
+            color: "#666"
+          },
+          itemGap: 30,
+          itemWidth: 30,
+          itemHeight: 10
+        },
+        grid: {
+          top:"10%",
+          left: "3%",
+          right: "10%",
+          bottom: "10%",
+          containLabel: true
+        },
+        xAxis: [
+          {
+            type: "category",
+            data: [
+              "1月",
+              "2月",
+              "3月",
+              "4月",
+              "5月",
+              "6月",
+              "7月",
+              "8月",
+              "9月",
+              "10月",
+              "11月",
+              "12月"
+            ],
+            axisLine: {
+              show: true,
+              lineStyle: {
+                color: "#D9D9D9",
+                width: 1,
+                type: "solid"
+              }
+            },
+            axisTick: {
+              show: false
+            },
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: "#666666",
+                fontSize: 14
+              }
+            }
+          }
+        ],
+        yAxis: [
+          {
+            type: "value",
+            splitNumber: 6,
+            axisLabel: {
+              formatter: "{value}",
+              textStyle: {
+                color: "#666",
+                fontSize: 14
+              }
+            },
+            axisTick: {
+              show: false
+            },
+            axisLine: {
+              show: true,
+              lineStyle: {
+                color: "#D9D9D9",
+                width:1,
+                type: "solid"
+              }
+            },
+            splitLine: {
+              show: true,
+              lineStyle: {
+                color: "#E5E5E5",
+                width: 1,
+                type: "solid"
+              }
+            }
+          }
+        ],
+        series: [
+          {
+            name: "违法",
+            type: "line",
+            data: (function() {
+              var d = [];
+              for (let i = 0; i < 12; i++) {
+                d.push(parseInt(Math.random() * (100 - 50 + 1) + 50, 10));
+              }
+              return d;
+            })(),
+            itemStyle: {
+              normal: {
+                color: "#0069FF"
+              }
+            },
+            lineStyle: {
+              normal: {
+                width: 1,
+                shadowColor: "rgba(0,0,0,0.4)",
+                shadowBlur: 10,
+                shadowOffsetY: 10
+              }
+            }
+          },
+          {
+            name: "事件",
+            type: "line",
+            data: (function() {
+              var d = [];
+              for (let i = 0; i < 12; i++) {
+                d.push(parseInt(Math.random() * (90 - 40) + 40, 10));
+              }
+              return d;
+            })(),
+            itemStyle: {
+              normal: {
+                color: "#3BB7FF"
+              }
+            },
+            lineStyle: {
+              normal: {
+                width: 1,
+                shadowColor: "rgba(0,0,0,0.4)",
+                shadowBlur: 10,
+                shadowOffsetY: 10
+              }
+            }
+          },
+          {
+            name: "重点车辆",
+            type: "line",
+            data: (function() {
+              var d = [];
+              for (let i = 0; i < 12; i++) {
+                d.push(parseInt(Math.random() * (80 - 30 + 1) + 30, 10));
+              }
+              return d;
+            })(),
+            itemStyle: {
+              normal: {
+                color: "#87D14B"
+              }
+            },
+            lineStyle: {
+              normal: {
+                width: 1,
+                shadowColor: "rgba(0,0,0,0.4)",
+                shadowBlur: 10,
+                shadowOffsetY: 10
+              }
+            }
+          },
+        ]
+      };
+     maychart.setOption(option)
+    }
+  },
+  mounted() {
+      this.initchart()
+    },
+    
+};
+</script>
+
+<style lang="stylus" scoped>
+.chart-header-box{
+  height 3vh
+  overflow hidden
+  font-size 14px
+}
+.header-title {
+  line-height 3vh
+  font-weight 600
+}
+.illtrendchart{
+  height 22vh
+  width 30vw
+}
+.header-label{
+  font-size 12px
+  line-height 3vh
+  float left
+}
+.header-select{
+  width 4.5vw
+  margin .2vh .5vw 0 .2vw
+  float left
+}
+
+</style>
\ No newline at end of file

src/views/mapShow/index.vue

 <template>
-	<div style="padding: 12px;">
-		<div style="float: left;">
-			<div class="infoBox">
-				<div class="infoChild">
+	<el-row   :gutter="10" style="padding: 10px 0 10px 10px;width: 100%;overflow:hidden">
+		<el-col :span="12" >
+			<el-row class="infoBox" :gutter="9">
+				<el-col :span="6" class="infoChild">
+					<div class="info-item-box">
 						<img src="../../assets/img/map/syn.png" alt="">
 						<span class="textCon">
 							<div>分析资源</div>
 							<div class="colorText"><span>64</span>路</div>
 						</span>
 					</div>
-				<div class="infoChild">
+				</el-col>
+				<el-col :span="6" class="infoChild">
+					<div class="info-item-box">
 						<img src="../../assets/img/map/car.png" alt="">
 						<span class="textCon">
 							<div>运行路数</div>
 							<div class="colorText"><span>47</span>路</div>
 						</span>
 					</div>
-				<div class="infoChild">
+				</el-col>
+				<el-col :span="6" class="infoChild">
+					<div class="info-item-box">
 						<img src="../../assets/img/map/warn.png" alt="">
 						<span class="textCon">
 							<div>运行异常资源</div>
 							<div class="colorText"><span>7</span>个</div>
 						</span>
 					</div>
-				<div class="infoChild">
+				</el-col>
+				<el-col :span="6" class="infoChild">
+					<div class="info-item-box">
 						<img src="../../assets/img/map/total.png" alt="">
 						<span class="textCon">
 							<div>数量总数</div>
 							<div class="colorText"><span>23548</span>路</div>
 						</span>
 					</div>
-			</div>
+				</el-col>
+			</el-row>
 			<div id="map" class="maps">
-				<div class="inMapBox">
-					<div class="lDiv" :key="index" v-for="(item,index) in typeList">
-						<span class="ltext">{{item.event_name}}</span>
-						<span class="lnum">{{item.total_num}}</span>
-						<div style="clear: both;"></div>
-					</div>
-				</div>
-			</div>
-			<div>
-				<div style="float: left; margin-right: 8px;">
-					<div class="numBox">
-						<div class="title">今日抓拍量</div>
-						<span class="num">{{snap_num}}</span>
-						<img src="../../assets/img/map/catch.png" alt="" class="catch">
-					</div>
-					<div class="numBox">
-						<div class="title">今日审核量</div>
-						<span class="num">{{audit_num}}</span>
-						<img src="../../assets/img/map/back.png" alt="" class="backSea">
-					</div>
-				</div>
-				<div style="float: left;background: #FFFFFF;">
-					<div class="title">今日事件趋势</div>
-					<div id="myChart" style="width: 523px; height: 224px;"></div>
+				<showmap></showmap>
 			</div>
+	
+			<div style="clear: both;"></div>
+		</el-col>
+		<el-col :span="12">
+			<div class="video-box">
+				<videoPlay ref="ocx"></videoPlay>
 			</div>
+		
 			<div style="clear: both;"></div>
+		</el-col>
+		<el-col :span="24" class="clearpright">
+			<el-row :gutter="10" class="bottom-box">
+			<el-col :span="8">
+				<div class="bottom-item-box">
+					<illegaltrend></illegaltrend>
 				</div>
-		<div style="float: left;">
-			<div style="width: 789px;height: 446px;position: relative;margin-bottom: 11px;">
-				<ocxplay ref="ocx"></ocxplay>
+			</el-col>
+			<el-col :span="5">
+				<div class="bottom-item-box">
+					<eventTypedis></eventTypedis>
 				</div>
-			<div style="background: #FFFFFF;width: 789px">
+			</el-col>
+			<el-col :span="3">
+				<div class="bottom-item-box">3</div>
+			</el-col>
+			<el-col :span="8" class="clearpright">
+			<div  class="bottom-item-box">
 				<div class="title">实时事件</div>
 				<el-table
-				  height="349"
 				      :data="tableData"
-				      style="width: 100%;padding: 11px;">
+				      >
 					  <el-table-column
 					    type="index"
 							align="center"
-					    label="序号">
+					    label="#">
 					  </el-table-column>
 				      <el-table-column
 					  align="center"
 				        prop="eventType"
-				        label="事件类型"
+				        label="事件地点"
 						:formatter="eventFormatter">
 				      </el-table-column>
 				      <el-table-column
 					  align="center"
 				        prop="locationName"
-				        label="地点名称">
+				        label="抓拍类型">
 				      </el-table-column>
 					  <el-table-column
 						  align="center"
 					    prop="startDt"
-						width="180"
-					    label="首次抓拍时间">
-					  </el-table-column>
-					  <el-table-column
-						  align="center"
-					    prop="endDt"
-						width="180"
-					    label="最后抓拍时间">
+					    label="发生时间">
 					  </el-table-column>
 					  <el-table-column
 						  align="center"
@@ -114,43 +110,18 @@
 					  </el-table-column>
 				    </el-table>
 				</div>
-			<div style="clear: both;"></div>
-		</div>
+			</el-col>
+		</el-row>
+		</el-col>
 		
-		<editset :setvisible.sync="setShow" :archiveunid="archiveUnid"></editset>
-	</div>
+	</el-row>
 </template>
 
 <script>
-	import {inherits} from 'ol/util.js';
-	import Map from 'ol/Map';
-	import View from 'ol/View';
-	import Feature from 'ol/Feature'; //元素
-	import Overlay from 'ol/Overlay'; //弹出框
-	import {toStringHDMS} from 'ol/coordinate';
-	import {fromLonLat, toLonLat} from 'ol/proj';
-	import {Tile as TileLayer, Vector as VectorLayer, VectorTile,Heatmap as HeatmapLayer} from 'ol/layer'; //瓦片图层 , 矢量图层等基础图层
-	import {Cluster, OSM, Vector as VectorSource, XYZ, TileJSON} from 'ol/source';
-	import KML from 'ol/format/KML.js';
-	import {
-	    defaults,
-	    Select,
-	    DragBox,
-	    Pointer,
-	    DragAndDrop,
-	    Draw,
-	    defaults as defaultInteractions,
-	    Pointer as PointerInteraction
-	    } from 'ol/interaction'; //交互，选择，画框等
-	  import {Circle as CircleStyle, Fill, Stroke, Style, Text, Icon} from 'ol/style'; //添加图层，点，圆等的样式调节
-	  import {Point, Geometry, LineString} from 'ol/geom'
-	  import GeoJSON from 'ol/format/GeoJSON.js';
-	  import 'ol/ol.css' //地图默认样式
-	  import editset from '../taskManage/editSet'
-	  import ocxplay from '../../components/ocxplay.vue'
-	  import moment from 'moment'
-	  var map = '';
-	  var Views = '';
+import showmap from './map'
+import videoPlay from '../public/videoPlay'
+import illegaltrend from './illegaltrend'
+import eventTypedis from './eventTypedis'
 	export default{
 		data(){
 			return{
@@ -166,14 +137,16 @@
 			}
 		},
 		components:{
-			editset,ocxplay
+			showmap,
+			videoPlay,
+			illegaltrend,
+			eventTypedis
 		},
 		mounted(){
 			this.getNum();
 			setTimeout(()=>{
-				this.drawLine();
-				this.getEventTypeList();
-				this.InitMap();
+				// this.drawLine();
+				// this.getEventTypeList();
 			},300)
 		},
 		methods:{
@@ -232,267 +205,27 @@
 				})
 				return value;
 			},
-			 drawLine(){
-				 this.$api.map.homeLine({
-				 	startDt:this.startDt,
-				 	endDt:this.endDt,
-				 	_t: Date.parse(new Date())/1000
-				 }).then((res)=>{
-					 let xData=[];
-					 let seriesData=[];
-					 let legendData=[];
-					 res.list_data.forEach(item=>{
-						 if(!xData.includes(item.hour)){
-							 xData.push(item.hour);
-						 }
-						 if(!legendData.includes(item.event_name)){
-							 legendData.push(item.event_name);
-							 seriesData.push({
-								 name: item.event_name,
-								 type: 'line',
-								 data: [item.total_num]
-							 })
-						 }else{
-							 seriesData.forEach(serItem=>{
-								 if(serItem.name==item.event_name){
-									 serItem.data.push(item.total_num)
-								 }
-							 })
-						 }
-					 })
-					 console.log(seriesData)
-					 // 基于准备好的dom，初始化echarts实例
-					 let myChart = this.$echarts.init(document.getElementById('myChart'))
-					 // 绘制图表
-					 myChart.setOption({
-					 	tooltip: {},
-					 	color:['#0069FF'],
-					 	xAxis: {
-					 		data: xData,
-					 		axisTick:false,
-					 		axisLine:{
-					 			lineStyle:{
-					 				color:'#d9d9d9'
-					 			}
-					 		},
-					 		axisLabel:{
-					 			color:'#666666',
-					 			fontSize:'10px'
-					 		}
-					 	},
-					 	grid:{
-					 		left:38,
-					 		bottom:30,
-					 		top:13,
-					 		right:21
-					 	},
-					 	yAxis: {
-					 		axisTick:false,
-					 		axisLine:{
-					 			lineStyle:{
-					 				color:'#d9d9d9'
-					 			}
-					 		},
-					 		axisLabel:{
-					 			color:'#666666',
-					 			fontSize:'10px'
-					 		}
-					 	},
-					 	series: seriesData
-					 });
-				 }).catch((error)=>{
-					console.log('e2',error)
-				})
-				
-			},
-			  InitMap(){
-			      let _this = this;
-			      //坐标
-			      //
-			      var heatData = {
-			         "type": "FeatureCollection",
-			  				"features": [{
-			  					"type": "Feature",
-			  					"geometry": {
-			  						"type": "Point",
-			  						"coordinates": [116.357068,39.954021, 0]
-			  					},
-			  					"properties": {
-			  						"name": "M 5 - 2012 Dec 25, PAKISTAN"
-			  					}
-			        }]
-			       }
-			  
-			      for(var i =0; i< 300; i++){
-			        let c = Math.random(1)*1000
-			        let e = Math.random(1)*100
-			        let b =  (116.357068 * 1000000 + i*c)/1000000;
-			        let d = (39.954021 * 1000000 + i*e)/1000000
-			        let a = {
-			              "type": "Feature",
-			              "geometry": {
-			                "type": "Point",
-			                "coordinates": [b,d, 0]
-			              },
-			              "properties": {
-			                "name": "M 5 - 2012 Dec 25, PAKISTAN" +i
-			              }
-			          }
-			        heatData.features.push(a)
-			      }
-			  
-			        var vectorSources = new VectorSource({
-			          features: (new GeoJSON()).readFeatures(heatData,{
-			                                                      dataProjection : 'EPSG:4326'
-			                                                    })
-			        });
-			        var path = "http://192.168.9.62:20080/static/pics/qingdaoMap/roadmap/{z}/{x}/{y}.png"
-			        var offlineMapLayer = new TileLayer({
-			            source: new XYZ({
-			              // 设置本地离线瓦片所在路径，由于例子里面只有一张瓦片，页面显示时就只看得到一张瓦片。
-			              url: path
-			            })
-			          });
-			  
-			        Views = new View({
-			  				projection: 'EPSG:4326',
-			  				zoom: 2,// 并且定义地图显示层级为2
-			  				minZoom:13,
-			  				maxZoom:18,
-			  				center:[120.324447,36.064594]
-			        })
-			        map = new Map({
-			  			// 设置地图图层
-			  			layers: [
-			  				// 创建一个使用Open Street Map地图源的瓦片图层
-			          offlineMapLayer,
-			        ],
-			          Interactions: [
-			              defaults,
-			              Select,
-			              DragBox
-			          ],
-			        loadTilesWhileAnimating:true,
-			  
-			  			// 设置显示地图的视图
-			  			view:Views ,
-			  			// 让id为map的div作为地图的容器
-			        target: 'map',
-			      });
-			       var heatmapvector = new HeatmapLayer({
-			          source: vectorSources,
-			          blur: parseInt(20, 6),
-			          radius:parseInt(3, 5),
-			        });
-			  
-			      map.addLayer(heatmapvector);
-			  
-			  		// 添加一个使用离线瓦片地图的层
-			       var CameraVertorlayer = new VectorLayer({
-			          source: _this.addCameraLayer([120.324447,36.064594],"相机A")
-			      });
-			  
-			      map.addLayer(CameraVertorlayer);
-			  
-			      this.addLayer();
-			  
-			      map.on('click',(e)=>{
-			        var pixel = map.getEventPixel(e.originalEvent);
-			        console.log(pixel);
-			        //点击相机标注点
-			        map.forEachFeatureAtPixel(pixel,function(feature){
-			          var coodinate = e.coordinate;
-			          _this.unid = feature.getProperties().unid;
-			          Overlay.setPosition(coodinate);
-			          map.addOverlay(Overlay);
-			        });
-			      });
-			      },
-			  
-			      addLayer(data){
-			        var pos = data;
-			        var marker = new Overlay({
-			            position: pos,
-			            positioning:  'center-center',
-			            element: document.getElementById('canvasDiv')
-			        });
-			        map.addOverlay(marker);
-			      },
-			      addCameraLayer(coordinate,phonetext) {
-			          let vectorSource = new VectorSource({id:1});
-			          let icon = new Feature({
-			              geometry: new Point(coordinate),
-			              unid:'1'
-			          });
-			          let color = '#156BB1'; //设置气泡颜色
-			          //添加svg图标需注意 width,height要和 new Icon 的imgSize保持一致
-			          let svg  = '<svg t="1540524238971"  class="icon" style="text-align:center" x="0px" y="0px" width="28px" height="28px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4126" xmlns:xlink="http://www.w3.org/1999/xlink"  xml:space="preserve"><defs><style type="text/css"></style></defs>'+
-			          '<path fill="' + color + '" d="M865.309 291.918c-19.289-45.606-46.897-86.557-82.06-121.719-35.161-35.162-76.114-62.771-121.718-82.06-47.23-19.976-97.385-30.105-149.072-30.105S410.618 68.163 363.388 88.139c-45.605 19.289-86.557 46.898-121.719 82.06-35.162 35.161-62.771 76.114-82.06 121.719-19.976 47.229-30.105 97.384-30.105 149.071 0 51.687 10.129 101.841 30.105 149.07 19.289 45.605 46.898 86.558 82.06 121.72 35.162 35.161 76.114 62.771 121.719 82.06 11.201 4.738 22.569 8.914 34.081 12.541l-58.051 143.991-17.783 0c-14.129 0-25.583 11.454-25.583 25.583s11.454 25.583 25.583 25.583l352.169 0c0.063 0 0.124 0.007 0.187 0.007 0.101 0 0.203-0.006 0.303-0.007l35.985 0c14.13 0 25.583-11.454 25.583-25.583s-11.453-25.583-25.583-25.583l-18.876 0-57.565-146.13c24.322-8.109 47.832-18.654 70.119-31.546 57.156-33.063 105.093-80.61 138.628-137.502 34.561-58.633 52.83-125.787 52.83-194.204C895.414 389.302 885.285 339.148 865.309 291.918zM513.814 146.1c26.472 0 48.01 21.537 48.01 48.01 0 26.472-21.537 48.01-48.01 48.01s-48.011-21.537-48.011-48.01C465.804 167.638 487.342 146.1 513.814 146.1zM512.54 688.835c-111.982 0-203.086-91.104-203.086-203.086 0-111.982 91.104-203.086 203.086-203.086 111.981 0 203.086 91.104 203.086 203.086C715.626 597.731 624.521 688.835 512.54 688.835z" p-id="4127"></path><path d="M512.54 333.829c-83.769 0-151.921 68.152-151.921 151.921 0 83.769 68.15 151.921 151.921 151.921 83.769 0 151.921-68.15 151.921-151.921C664.461 401.98 596.309 333.829 512.54 333.829z" p-id="4128"></path><path d="M513.814 197.265c1.739 0 3.154-1.415 3.154-3.155 0-1.74-1.415-3.155-3.154-3.155-1.74 0-3.155 1.415-3.155 3.155C510.659 195.85 512.074 197.265 513.814 197.265z" p-id="4129"></path><path d="M636.408 950.372 636.408 950.372 636.408 950.373Z" p-id="4130"></path></svg>'
-			          let cameraIcon = new Image();
-			          cameraIcon.src = 'data:image/svg+xml,' + escape(svg);
-			          icon.setStyle(new Style({ //设置样式和大小
-			              image: new Icon({
-			                  img: cameraIcon,
-			                  crossOrigin: 'anonymous',
-			                  // src:'http://192.168.9.233:20080/static/pics/cache/biaozhu.svg',
-			                  imgSize: [28, 28],
-			                  zIndex:20,
-			                  marginTop:100
-			              }),
-			              text:new Text({
-			                text:phonetext,
-			                textBaseline: 'top',
-			                font: 'normal 12px 微软雅黑',
-			                lineHeight:'0px',
-			                fill: new Fill({
-			                      color: 'red',
-			                  }),
-			              }),
-			              stroke: new Stroke({
-			                  color: 'red',
-			                  width: 21,
-			                  marginTop:100,
-			              })
-			          }));
-			          vectorSource.addFeature(icon);
-			          return vectorSource;
-			      },
-			  
-			      addFeature(){
-			        function createStyle(src, img) {
-			          return new Style({
-			            image: new Icon(/** @type {module:ol/style/Icon~Options} */ ({
-			              anchor: [0.5, 0.96],
-			              crossOrigin: 'anonymous',
-			              src: src,
-			              img: img,
-			              imgSize: img ? [img.width, img.height] : undefined
-			            }))
-			          });
-			        }
-			  
-			        var iconFeature = new Feature(new Point([113.338591,34.506910]));
-			        iconFeature.set('style', createStyle('../../../assets/img/dianli.png', undefined));
-			        var CameraVertorlayer = new VectorLayer({
-			                source: iconFeature,
-			                id:1
-			            });
-			            map.addLayer(this.CameraVertorlayer);
-			      },
 		}
 	}
 </script>
 
 <style scoped="scoped">
+	.video-box{
+		height: 59.5vh;
+		margin-bottom: 1vh;
+		background: #444444;
+	}
+	.left-box{
+	}
 	.infoBox{
-		margin-bottom: 8px;
+		margin-bottom: 1vh;
 	}
 	.infoChild{
-		width: 204px;
-		height: 70px;
+		height: 8.5vh;
 		display: inline-block;
+	}
+	.info-item-box{
 		background: #FFFFFF;
-		margin-right: 8px;
 	}
 	.infoChild:nth-child(1) img{
 		width: 27px;
@@ -533,86 +266,13 @@
 	  display:none!important;
 	  background:red!important
 	}
-	.ol-popup {
-	    position: absolute;
-	    background-color: #eeeeee;
-	    -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
-	    filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
-	    padding: 15px;
-	    border-radius: 10px;
-	    border: 1px solid #cccccc;
-	    bottom: 12px;
-	    left: -50px;
-	    min-width: 280px;
-	}
-	
-	.ol-popup:after,
-	.ol-popup:before {
-	    top: 100%;
-	    border: solid transparent;
-	    content: " ";
-	    height: 0;
-	    width: 0;
-	    position: absolute;
-	    pointer-events: none;
-	}
-	
-	.ol-popup:after {
-	    border-top-color: #eeeeee;
-	    border-width: 10px;
-	    left: 48px;
-	    margin-left: -10px;
-	}
-	
-	.ol-popup:before {
-	    border-top-color: #cccccc;
-	    border-width: 11px;
-	    left: 48px;
-	    margin-left: -11px;
-	}
 	
-	.ol-popup-closer {
-	    text-decoration: none;
-	    position: absolute;
-	    top: 2px;
-	    right: 8px;
-	}
-	
-	.ol-popup-closer:after {
-	    content: "✖";
-	}
-	.popup-content{
-	  height:300px;
-	  overflow:auto
-	}
-	.pop-info-box{
-	  overflow: hidden;
-	  border-bottom :2px solid #fff
-	}
-	.pop-img-box {
-	  float: left;
-	  height: 100px;
-	  width :120px;
-	  img{
-	    height: 100%;
-	    width: 100%;
-	  }
-	}
 	.pop-info{
 	  float: left;
 	  padding-left: 20px;
 	  width :100px
 	}
-	.map-box {
-	  position: relative;
-	  background :#f8f8f8;
-	  border-radius: 10px;
-	  .content-info{
-	    position :absolute;
-	    z-index :1000;
-	    color: red
-	  }
-	}
+
 	.numBox{
 		width: 307px;
 		height: 125px;
@@ -641,34 +301,8 @@
 		bottom: 0;
 		left: 0;
 	}
-	.title{
-		padding: 12px 0 0 11px;
-		color: #444444;
-		font-size: 16px;
-	}
-	.inMapBox{
-		background: #f8f8f8;
-		display: inline-block;
-		position: absolute;
-		z-index: 99;
-		border: 1px solid #E5E5E5;
-		border-bottom: none;
-		top: 5px;
-		left: 5px;
-		box-shadow:0px 2px 4px 0px rgba(0,0,0,0.18);
-	}
-	.lDiv{
-		width: 110px;
-		height: 36px;
-		line-height:36px;
-		border-bottom: 1px solid #E5E5E5;
-	}
-	.lDiv span{
-		display: inline-block;
-	text-align: center;
-	font-size: 12px;
-		float: left;
-	}
+
+
 	.ltext{
 		width: 71px;
 		height: 100%;
@@ -678,139 +312,23 @@
 		width: 37px;
 	}
 	.maps{
-	  height: 491px;
-	  width:840px;
+	  height: 50vh;
+	  width:100%;
 	  margin-bottom: 8px;
 	  position: relative;
 	}
-	.canvasDiv{
-	  height :30px;
-	  width :30px;
-	  background :red;
-	  border-radius :30px;
-	  color: #ffffff;
-	  font-size :12px;
-	  text-align :center;
-	  line-height :30px;
-	  z-index :10;
-	  opacity :0.5;
-	}
-	.pl3{
-	  padding-left: 3px
-	}
-	.rotate-north {
-	    top: 65px;
-	    left: .5em;
-	}
-	.ol-touch .rotate-north {
-	  top: 80px;
-	}
-	
-	.canvasDiv{
-	    height:30px;
-	    width:30px;
-	    border-radius: 25px;
-	    background: rgba(255, 0, 0, 1);
-	    transform: scale(0);
-	    animation: myfirst 3s;
-	    animation-iteration-count: infinite;
-	}
-	@keyframes myfirst{
-	    to{
-	        transform: scale(2);
-	        background: rgba(0, 0, 0, 0);
-	    }
-	}
-	.el-table th, .el-table tr{
-		background:rgba(248,249,250,1)!important;
-	}
-	.ol-overlaycontainer-stopevent{
-	  display:none!important;
-	}
-	.alarm-active{
-	  display :none
-	}
-	.alarm-makerbox{
-	  display:block;
-	  height :200px;
-	  width: 200px;
-	  border-radius :5px;
-	  background: rgba(39, 41, 48, .9);
-	  color: #ffffff;
-	  font-family :'微软雅黑';
-	  font-size :14px;
-	  animation: op 1s;
-	  -moz-animation: op 1s;	/* Firefox */
-	  -webkit-animation: op 1s;	/* Safari 和 Chrome */
-	  -o-animation: op 1s;
-	}
-	@keyframes op {
-	  from {opacity: 0;}
-	  to {opacity: 1;}
-	}
-	@-moz-keyframes op /* Firefox */
-	{
-	  from {opacity: 0;}
-	  to {opacity: 1;}
-	}
-	
-	@-webkit-keyframes op /* Safari 和 Chrome */
-	{
-	  from {opacity: 0;}
-	  to {opacity: 1;}
-	}
 	
-	@-o-keyframes op /* Opera */
-	{
-	  from {opacity: 0;}
-	  to {opacity: 1;}
-	}
-	.exit-alarm::after{
-	  float :right;
-	  height: 20px;
-	  width :20px;
-	  margin :5px;
-	  content: "✖";
-	  cursor: pointer;
-	}
-	.img-box{
-	  width: 200px;
-	  height :100px;
-	  overflow :hidden;
-	  img{
-	    height :100%;
-	    width :100%;
-	    text-align: center
-	  }
-	}
-	.info-list {
-	  padding :1px 10px
-	}
-	.edit{
-		cursor: pointer;
-		width: 18px;
-	}
-	.play{
-		cursor: pointer;
-		width:17px;
-	}
-	.pause,.del{
-		cursor: pointer;
-		width: 12px;
-	}
-	.tableSpanBorder{
-		display: inline-block;
-		height: 18px;
-		border-left:2px solid #E5E5E5;
-		margin: 0 17px;
-	}
-	.lines{
-		display: inline-block;
-		width: 10px;
-		border-top:1px solid #cccccc ;
-		margin: 3px;
-	}
 	.el-table__body tr{
 		background: #FFFFFF!important;
 	}
+	.bottom-box{
+		width: 100%;
+		height: 25vh;
+		overflow: hidden;
+	}
+	.bottom-item-box {
+		height: 25vh;
+		background: #fff;
+		overflow: hidden;
+	}
 </style>

src/views/mapShow/indexback.vue

+<template>
+	<div style="padding: 12px;">
+		<div style="float: left;" class="left-box">
+			<div class="infoBox">
+				<div class="infoChild">
+					<img src="../../assets/img/map/syn.png" alt="">
+					<span class="textCon">
+						<div>分析资源</div>
+						<div class="colorText"><span>64</span>路</div>
+					</span>
+				</div>
+				<div class="infoChild">
+					<img src="../../assets/img/map/car.png" alt="">
+					<span class="textCon">
+						<div>运行路数</div>
+						<div class="colorText"><span>47</span>路</div>
+					</span>
+				</div>
+				<div class="infoChild">
+					<img src="../../assets/img/map/warn.png" alt="">
+					<span class="textCon">
+						<div>运行异常资源</div>
+						<div class="colorText"><span>7</span>个</div>
+					</span>
+				</div>
+				<div class="infoChild">
+					<img src="../../assets/img/map/total.png" alt="">
+					<span class="textCon">
+						<div>数量总数</div>
+						<div class="colorText"><span>23548</span>路</div>
+					</span>
+				</div>
+			</div>
+			<div id="map" class="maps">
+				<div class="inMapBox">
+					<div class="lDiv" :key="index" v-for="(item,index) in typeList">
+						<span class="ltext">{{item.event_name}}</span>
+						<span class="lnum">{{item.total_num}}</span>
+						<div style="clear: both;"></div>
+					</div>
+				</div>
+			</div>
+			<div>
+				<div style="float: left; margin-right: 8px;">
+					<div class="numBox">
+						<div class="title">今日抓拍量</div>
+						<span class="num">{{snap_num}}</span>
+						<img src="../../assets/img/map/catch.png" alt="" class="catch">
+					</div>
+					<div class="numBox">
+						<div class="title">今日审核量</div>
+						<span class="num">{{audit_num}}</span>
+						<img src="../../assets/img/map/back.png" alt="" class="backSea">
+					</div>
+				</div>
+				<div style="float: left;background: #FFFFFF;">
+					<div class="title">今日事件趋势</div>
+					<div id="myChart" style="width: 523px; height: 224px;"></div>
+				</div>
+			</div>
+			<div style="clear: both;"></div>
+		</div>
+		<div style="float: left;">
+			<div style="width: 789px;height: 446px;position: relative;margin-bottom: 11px;">
+				<ocxplay ref="ocx"></ocxplay>
+			</div>
+			<div style="background: #FFFFFF;width: 789px">
+				<div class="title">实时事件</div>
+				<el-table
+				  height="349"
+				      :data="tableData"
+				      style="width: 100%;padding: 11px;">
+					  <el-table-column
+					    type="index"
+						align="center"
+					    label="序号">
+					  </el-table-column>
+				      <el-table-column
+					  align="center"
+				        prop="eventType"
+				        label="事件类型"
+						:formatter="eventFormatter">
+				      </el-table-column>
+				      <el-table-column
+					  align="center"
+				        prop="locationName"
+				        label="地点名称">
+				      </el-table-column>
+					  <el-table-column
+						  align="center"
+					    prop="startDt"
+						width="180"
+					    label="首次抓拍时间">
+					  </el-table-column>
+					  <el-table-column
+						  align="center"
+					    prop="endDt"
+						width="180"
+					    label="最后抓拍时间">
+					  </el-table-column>
+					  <el-table-column
+						  align="center"
+					    prop="operation"
+					    label="操作">
+						<template slot-scope="scope">
+							<el-tooltip content="详情及审核" placement="bottom" effect="light" :visible-arrow=false>
+								<img src="../../assets/img/home/look.png" alt="" class="edit"  @click="editVideo(scope.$index, scope.row)">
+							</el-tooltip>
+							<span class="tableSpanBorder"></span>
+							<el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow=false>
+								<img src="../../assets/img/home/del.png" alt="" class="del"  @click="delFun(scope.$index, scope.row)">
+							</el-tooltip>
+						</template>
+					  </el-table-column>
+				    </el-table>
+			</div>
+			<div style="clear: both;"></div>
+		</div>
+		
+		<editset :setvisible.sync="setShow" :archiveunid="archiveUnid"></editset>
+	</div>
+</template>
+
+<script>
+	import {inherits} from 'ol/util.js';
+	import Map from 'ol/Map';
+	import View from 'ol/View';
+	import Feature from 'ol/Feature'; //元素
+	import Overlay from 'ol/Overlay'; //弹出框
+	import {toStringHDMS} from 'ol/coordinate';
+	import {fromLonLat, toLonLat} from 'ol/proj';
+	import {Tile as TileLayer, Vector as VectorLayer, VectorTile,Heatmap as HeatmapLayer} from 'ol/layer'; //瓦片图层 , 矢量图层等基础图层
+	import {Cluster, OSM, Vector as VectorSource, XYZ, TileJSON} from 'ol/source';
+	import KML from 'ol/format/KML.js';
+	import {
+	    defaults,
+	    Select,
+	    DragBox,
+	    Pointer,
+	    DragAndDrop,
+	    Draw,
+	    defaults as defaultInteractions,
+	    Pointer as PointerInteraction
+	    } from 'ol/interaction'; //交互，选择，画框等
+	  import {Circle as CircleStyle, Fill, Stroke, Style, Text, Icon} from 'ol/style'; //添加图层，点，圆等的样式调节
+	  import {Point, Geometry, LineString} from 'ol/geom'
+	  import GeoJSON from 'ol/format/GeoJSON.js';
+	  import 'ol/ol.css' //地图默认样式
+	  import editset from '../taskManage/editSet'
+	  import ocxplay from '../../components/ocxplay.vue'
+	  import moment from 'moment'
+	  var map = '';
+	  var Views = '';
+	export default{
+		data(){
+			return{
+				typeList:[],
+				tableData:[],
+				eventTypeList:[],
+				setShow:false,
+				archiveUnid:0,
+				startDt:moment(moment().format('YYYY-MM-DD')+' 00:00:00').utc().format('YYYY-MM-DD HH:mm:ss'),
+				endDt:moment(moment().format('YYYY-MM-DD')+' 23:59:59').utc().format('YYYY-MM-DD HH:mm:ss'),
+				snap_num:0,
+				audit_num:0
+			}
+		},
+		components:{
+			editset,ocxplay
+		},
+		mounted(){
+			this.getNum();
+			setTimeout(()=>{
+				this.drawLine();
+				this.getEventTypeList();
+				this.InitMap();
+			},300)
+		},
+		methods:{
+			getNum(){
+				this.$api.map.homeNum({
+					startDt:this.startDt,
+					endDt:this.endDt,
+					_t: Date.parse(new Date())/1000
+				}).then((res)=>{
+					this.typeList=res.list_data
+				}).catch((error)=>{
+				})
+				this.$api.map.homeCatch({
+					startDt:this.startDt,
+					endDt:this.endDt,
+					_t: Date.parse(new Date())/1000
+				}).then((res)=>{
+					this.snap_num=res.snap_num;
+					this.audit_num=res.audit_num;
+				}).catch((error)=>{
+				})
+			},
+			getEventTypeList(){
+				this.$api.map.eventTypeData({
+					_t: Date.parse(new Date())/1000
+				}).then((res)=>{
+					this.eventTypeList=res.list_data;
+					this.getData()
+				})
+			},
+			getData(){
+				this.$api.map.archive({
+					startDt:this.startDt,
+					endDt:this.endDt,
+					_t: Date.parse(new Date())/1000
+				}).then((res)=>{
+					this.tableData=res.content;
+				})
+			},
+			editVideo(index,row){
+				this.setShow=true;
+				this.archiveUnid=row.archive_unid;
+			},
+			delFun(index,row){
+				this.$api.map.delEvent({},row.archive_unid).then((res)=>{
+					console.log(res)
+				})
+				console.log(row)
+			},
+			eventFormatter(row, column, cellValue, index){
+				let value=''
+				this.eventTypeList.forEach(item=>{
+					if(item.code==cellValue){
+						value=item.name;
+					}
+				})
+				return value;
+			},
+			 drawLine(){
+				 this.$api.map.homeLine({
+				 	startDt:this.startDt,
+				 	endDt:this.endDt,
+				 	_t: Date.parse(new Date())/1000
+				 }).then((res)=>{
+					 let xData=[];
+					 let seriesData=[];
+					 let legendData=[];
+					 res.list_data.forEach(item=>{
+						 if(!xData.includes(item.hour)){
+							 xData.push(item.hour);
+						 }
+						 if(!legendData.includes(item.event_name)){
+							 legendData.push(item.event_name);
+							 seriesData.push({
+								 name: item.event_name,
+								 type: 'line',
+								 data: [item.total_num]
+							 })
+						 }else{
+							 seriesData.forEach(serItem=>{
+								 if(serItem.name==item.event_name){
+									 serItem.data.push(item.total_num)
+								 }
+							 })
+						 }
+					 })
+					 console.log(seriesData)
+					 // 基于准备好的dom，初始化echarts实例
+					 let myChart = this.$echarts.init(document.getElementById('myChart'))
+					 // 绘制图表
+					 myChart.setOption({
+					 	tooltip: {},
+					 	color:['#0069FF'],
+					 	xAxis: {
+					 		data: xData,
+					 		axisTick:false,
+					 		axisLine:{
+					 			lineStyle:{
+					 				color:'#d9d9d9'
+					 			}
+					 		},
+					 		axisLabel:{
+					 			color:'#666666',
+					 			fontSize:'10px'
+					 		}
+					 	},
+					 	grid:{
+					 		left:38,
+					 		bottom:30,
+					 		top:13,
+					 		right:21
+					 	},
+					 	yAxis: {
+					 		axisTick:false,
+					 		axisLine:{
+					 			lineStyle:{
+					 				color:'#d9d9d9'
+					 			}
+					 		},
+					 		axisLabel:{
+					 			color:'#666666',
+					 			fontSize:'10px'
+					 		}
+					 	},
+					 	series: seriesData
+					 });
+				 }).catch((error)=>{
+					console.log('e2',error)
+				})
+				
+			},
+			  InitMap(){
+			      let _this = this;
+			      //坐标
+			      //
+			      var heatData = {
+			         "type": "FeatureCollection",
+			  				"features": [{
+			  					"type": "Feature",
+			  					"geometry": {
+			  						"type": "Point",
+			  						"coordinates": [116.357068,39.954021, 0]
+			  					},
+			  					"properties": {
+			  						"name": "M 5 - 2012 Dec 25, PAKISTAN"
+			  					}
+			        }]
+			       }
+			  
+			      for(var i =0; i< 300; i++){
+			        let c = Math.random(1)*1000
+			        let e = Math.random(1)*100
+			        let b =  (116.357068 * 1000000 + i*c)/1000000;
+			        let d = (39.954021 * 1000000 + i*e)/1000000
+			        let a = {
+			              "type": "Feature",
+			              "geometry": {
+			                "type": "Point",
+			                "coordinates": [b,d, 0]
+			              },
+			              "properties": {
+			                "name": "M 5 - 2012 Dec 25, PAKISTAN" +i
+			              }
+			          }
+			        heatData.features.push(a)
+			      }
+			  
+			        var vectorSources = new VectorSource({
+			          features: (new GeoJSON()).readFeatures(heatData,{
+			                                                      dataProjection : 'EPSG:4326'
+			                                                    })
+			        });
+			        var path = "http://192.168.9.62:20080/static/pics/qingdaoMap/roadmap/{z}/{x}/{y}.png"
+			        var offlineMapLayer = new TileLayer({
+			            source: new XYZ({
+			              // 设置本地离线瓦片所在路径，由于例子里面只有一张瓦片，页面显示时就只看得到一张瓦片。
+			              url: path
+			            })
+			          });
+			  
+			        Views = new View({
+			  				projection: 'EPSG:4326',
+			  				zoom: 2,// 并且定义地图显示层级为2
+			  				minZoom:13,
+			  				maxZoom:18,
+			  				center:[120.324447,36.064594]
+			        })
+			        map = new Map({
+			  			// 设置地图图层
+			  			layers: [
+			  				// 创建一个使用Open Street Map地图源的瓦片图层
+			          offlineMapLayer,
+			        ],
+			          Interactions: [
+			              defaults,
+			              Select,
+			              DragBox
+			          ],
+			        loadTilesWhileAnimating:true,
+			  
+			  			// 设置显示地图的视图
+			  			view:Views ,
+			  			// 让id为map的div作为地图的容器
+			        target: 'map',
+			      });
+			       var heatmapvector = new HeatmapLayer({
+			          source: vectorSources,
+			          blur: parseInt(20, 6),
+			          radius:parseInt(3, 5),
+			        });
+			  
+			      map.addLayer(heatmapvector);
+			  
+			  		// 添加一个使用离线瓦片地图的层
+			       var CameraVertorlayer = new VectorLayer({
+			          source: _this.addCameraLayer([120.324447,36.064594],"相机A")
+			      });
+			  
+			      map.addLayer(CameraVertorlayer);
+			  
+			      this.addLayer();
+			  
+			      map.on('click',(e)=>{
+			        var pixel = map.getEventPixel(e.originalEvent);
+			        console.log(pixel);
+			        //点击相机标注点
+			        map.forEachFeatureAtPixel(pixel,function(feature){
+			          var coodinate = e.coordinate;
+			          _this.unid = feature.getProperties().unid;
+			          Overlay.setPosition(coodinate);
+			          map.addOverlay(Overlay);
+			        });
+			      });
+			      },
+			  
+			      addLayer(data){
+			        var pos = data;
+			        var marker = new Overlay({
+			            position: pos,
+			            positioning:  'center-center',
+			            element: document.getElementById('canvasDiv')
+			        });
+			        map.addOverlay(marker);
+			      },
+			      addCameraLayer(coordinate,phonetext) {
+			          let vectorSource = new VectorSource({id:1});
+			          let icon = new Feature({
+			              geometry: new Point(coordinate),
+			              unid:'1'
+			          });
+			          let color = '#156BB1'; //设置气泡颜色
+			          //添加svg图标需注意 width,height要和 new Icon 的imgSize保持一致
+			          let svg  = '<svg t="1540524238971"  class="icon" style="text-align:center" x="0px" y="0px" width="28px" height="28px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4126" xmlns:xlink="http://www.w3.org/1999/xlink"  xml:space="preserve"><defs><style type="text/css"></style></defs>'+
+			          '<path fill="' + color + '" d="M865.309 291.918c-19.289-45.606-46.897-86.557-82.06-121.719-35.161-35.162-76.114-62.771-121.718-82.06-47.23-19.976-97.385-30.105-149.072-30.105S410.618 68.163 363.388 88.139c-45.605 19.289-86.557 46.898-121.719 82.06-35.162 35.161-62.771 76.114-82.06 121.719-19.976 47.229-30.105 97.384-30.105 149.071 0 51.687 10.129 101.841 30.105 149.07 19.289 45.605 46.898 86.558 82.06 121.72 35.162 35.161 76.114 62.771 121.719 82.06 11.201 4.738 22.569 8.914 34.081 12.541l-58.051 143.991-17.783 0c-14.129 0-25.583 11.454-25.583 25.583s11.454 25.583 25.583 25.583l352.169 0c0.063 0 0.124 0.007 0.187 0.007 0.101 0 0.203-0.006 0.303-0.007l35.985 0c14.13 0 25.583-11.454 25.583-25.583s-11.453-25.583-25.583-25.583l-18.876 0-57.565-146.13c24.322-8.109 47.832-18.654 70.119-31.546 57.156-33.063 105.093-80.61 138.628-137.502 34.561-58.633 52.83-125.787 52.83-194.204C895.414 389.302 885.285 339.148 865.309 291.918zM513.814 146.1c26.472 0 48.01 21.537 48.01 48.01 0 26.472-21.537 48.01-48.01 48.01s-48.011-21.537-48.011-48.01C465.804 167.638 487.342 146.1 513.814 146.1zM512.54 688.835c-111.982 0-203.086-91.104-203.086-203.086 0-111.982 91.104-203.086 203.086-203.086 111.981 0 203.086 91.104 203.086 203.086C715.626 597.731 624.521 688.835 512.54 688.835z" p-id="4127"></path><path d="M512.54 333.829c-83.769 0-151.921 68.152-151.921 151.921 0 83.769 68.15 151.921 151.921 151.921 83.769 0 151.921-68.15 151.921-151.921C664.461 401.98 596.309 333.829 512.54 333.829z" p-id="4128"></path><path d="M513.814 197.265c1.739 0 3.154-1.415 3.154-3.155 0-1.74-1.415-3.155-3.154-3.155-1.74 0-3.155 1.415-3.155 3.155C510.659 195.85 512.074 197.265 513.814 197.265z" p-id="4129"></path><path d="M636.408 950.372 636.408 950.372 636.408 950.373Z" p-id="4130"></path></svg>'
+			          let cameraIcon = new Image();
+			          cameraIcon.src = 'data:image/svg+xml,' + escape(svg);
+			          icon.setStyle(new Style({ //设置样式和大小
+			              image: new Icon({
+			                  img: cameraIcon,
+			                  crossOrigin: 'anonymous',
+			                  // src:'http://192.168.9.233:20080/static/pics/cache/biaozhu.svg',
+			                  imgSize: [28, 28],
+			                  zIndex:20,
+			                  marginTop:100
+			              }),
+			              text:new Text({
+			                text:phonetext,
+			                textBaseline: 'top',
+			                font: 'normal 12px 微软雅黑',
+			                lineHeight:'0px',
+			                fill: new Fill({
+			                      color: 'red',
+			                  }),
+			              }),
+			              stroke: new Stroke({
+			                  color: 'red',
+			                  width: 21,
+			                  marginTop:100,
+			              })
+			          }));
+			          vectorSource.addFeature(icon);
+			          return vectorSource;
+			      },
+			  
+			      addFeature(){
+			        function createStyle(src, img) {
+			          return new Style({
+			            image: new Icon(/** @type {module:ol/style/Icon~Options} */ ({
+			              anchor: [0.5, 0.96],
+			              crossOrigin: 'anonymous',
+			              src: src,
+			              img: img,
+			              imgSize: img ? [img.width, img.height] : undefined
+			            }))
+			          });
+			        }
+			  
+			        var iconFeature = new Feature(new Point([113.338591,34.506910]));
+			        iconFeature.set('style', createStyle('../../../assets/img/dianli.png', undefined));
+			        var CameraVertorlayer = new VectorLayer({
+			                source: iconFeature,
+			                id:1
+			            });
+			            map.addLayer(this.CameraVertorlayer);
+			      },
+		}
+	}
+</script>
+
+<style scoped="scoped">
+	.left-box{
+	}
+	.infoBox{
+		margin-bottom: 8px;
+	}
+	.infoChild{
+		width: 204px;
+		height: 70px;
+		display: inline-block;
+		background: #FFFFFF;
+		margin-right: 8px;
+	}
+	.infoChild:nth-child(1) img{
+		width: 27px;
+		height: 27px;
+		margin: 22px 20px 21px 40px;
+	}
+	.infoChild:nth-child(2) img{
+		width: 30px;
+		height: 27px;
+		margin: 22px 22px 21px 37px;
+	}
+	.infoChild:nth-child(3) img{
+		width: 28px;
+		height: 28px;
+		margin: 22px 22px 20px 34px;
+	}
+	.infoChild:nth-child(4) img{
+		width: 27px;
+		height: 28px;
+		margin: 22px 22px 20px 34px;
+	}
+	.textCon{
+		display: inline-block;
+		vertical-align: top;
+		font-size: 12px;
+		color: #666666;
+		margin-top: 14px;
+	}
+	.textCon span{
+		font-size: 20px;
+		margin-right: 2px;
+	}
+	.colorText{
+		margin-top: 6px;
+		color: #444444;
+	}
+	.ol-control button{
+	  display:none!important;
+	  background:red!important
+	}
+	.ol-popup {
+	    position: absolute;
+	    background-color: #eeeeee;
+	    -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+	    filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+	    padding: 15px;
+	    border-radius: 10px;
+	    border: 1px solid #cccccc;
+	    bottom: 12px;
+	    left: -50px;
+	    min-width: 280px;
+	}
+	
+	.ol-popup:after,
+	.ol-popup:before {
+	    top: 100%;
+	    border: solid transparent;
+	    content: " ";
+	    height: 0;
+	    width: 0;
+	    position: absolute;
+	    pointer-events: none;
+	}
+	
+	.ol-popup:after {
+	    border-top-color: #eeeeee;
+	    border-width: 10px;
+	    left: 48px;
+	    margin-left: -10px;
+	}
+	
+	.ol-popup:before {
+	    border-top-color: #cccccc;
+	    border-width: 11px;
+	    left: 48px;
+	    margin-left: -11px;
+	}
+	
+	.ol-popup-closer {
+	    text-decoration: none;
+	    position: absolute;
+	    top: 2px;
+	    right: 8px;
+	}
+	
+	.ol-popup-closer:after {
+	    content: "✖";
+	}
+	.popup-content{
+	  height:300px;
+	  overflow:auto
+	}
+	.pop-info-box{
+	  overflow: hidden;
+	  border-bottom :2px solid #fff
+	}
+	.pop-img-box {
+	  float: left;
+	  height: 100px;
+	  width :120px;
+	  img{
+	    height: 100%;
+	    width: 100%;
+	  }
+	}
+	.pop-info{
+	  float: left;
+	  padding-left: 20px;
+	  width :100px
+	}
+	.map-box {
+	  position: relative;
+	  background :#f8f8f8;
+	  border-radius: 10px;
+	  .content-info{
+	    position :absolute;
+	    z-index :1000;
+	    color: red
+	  }
+	}
+	.numBox{
+		width: 307px;
+		height: 125px;
+		background: #FFFFFF;
+		color: #444444;
+		position: relative;
+	}
+	.numBox:nth-child(1){
+		margin-bottom: 6px;
+	}
+	.num{
+		font-size: 30px;
+		margin: 27px 0 0 13px;
+		display: inline-block;
+		font-weight:bold;
+	}
+	.catch{
+		width: 57px;
+		position: absolute;
+		top:59px;
+		right: 16px;
+	}
+	.backSea{
+		width: 100%;
+		position: absolute;
+		bottom: 0;
+		left: 0;
+	}
+	.title{
+		padding: 12px 0 0 11px;
+		color: #444444;
+		font-size: 16px;
+	}
+	.inMapBox{
+		background: #f8f8f8;
+		display: inline-block;
+		position: absolute;
+		z-index: 99;
+		border: 1px solid #E5E5E5;
+		border-bottom: none;
+		top: 5px;
+		left: 5px;
+		box-shadow:0px 2px 4px 0px rgba(0,0,0,0.18);
+	}
+	.lDiv{
+		width: 110px;
+		height: 36px;
+		line-height:36px;
+		border-bottom: 1px solid #E5E5E5;
+	}
+	.lDiv span{
+		display: inline-block;
+	text-align: center;
+	font-size: 12px;
+		float: left;
+	}
+	.ltext{
+		width: 71px;
+		height: 100%;
+		border-right:1px solid #E5E5E5;
+	}
+	.lnum{
+		width: 37px;
+	}
+	.maps{
+	  height: 491px;
+	  width:840px;
+	  margin-bottom: 8px;
+	  position: relative;
+	}
+	.canvasDiv{
+	  height :30px;
+	  width :30px;
+	  background :red;
+	  border-radius :30px;
+	  color: #ffffff;
+	  font-size :12px;
+	  text-align :center;
+	  line-height :30px;
+	  z-index :10;
+	  opacity :0.5;
+	}
+	.pl3{
+	  padding-left: 3px
+	}
+	.rotate-north {
+	    top: 65px;
+	    left: .5em;
+	}
+	.ol-touch .rotate-north {
+	  top: 80px;
+	}
+	
+	.canvasDiv{
+	    height:30px;
+	    width:30px;
+	    border-radius: 25px;
+	    background: rgba(255, 0, 0, 1);
+	    transform: scale(0);
+	    animation: myfirst 3s;
+	    animation-iteration-count: infinite;
+	}
+	@keyframes myfirst{
+	    to{
+	        transform: scale(2);
+	        background: rgba(0, 0, 0, 0);
+	    }
+	}
+	.el-table th, .el-table tr{
+		background:rgba(248,249,250,1)!important;
+	}
+	.ol-overlaycontainer-stopevent{
+	  display:none!important;
+	}
+	.alarm-active{
+	  display :none
+	}
+	.alarm-makerbox{
+	  display:block;
+	  height :200px;
+	  width: 200px;
+	  border-radius :5px;
+	  background: rgba(39, 41, 48, .9);
+	  color: #ffffff;
+	  font-family :'微软雅黑';
+	  font-size :14px;
+	  animation: op 1s;
+	  -moz-animation: op 1s;	/* Firefox */
+	  -webkit-animation: op 1s;	/* Safari 和 Chrome */
+	  -o-animation: op 1s;
+	}
+	@keyframes op {
+	  from {opacity: 0;}
+	  to {opacity: 1;}
+	}
+	@-moz-keyframes op /* Firefox */
+	{
+	  from {opacity: 0;}
+	  to {opacity: 1;}
+	}
+	
+	@-webkit-keyframes op /* Safari 和 Chrome */
+	{
+	  from {opacity: 0;}
+	  to {opacity: 1;}
+	}
+	
+	@-o-keyframes op /* Opera */
+	{
+	  from {opacity: 0;}
+	  to {opacity: 1;}
+	}
+	.exit-alarm::after{
+	  float :right;
+	  height: 20px;
+	  width :20px;
+	  margin :5px;
+	  content: "✖";
+	  cursor: pointer;
+	}
+	.img-box{
+	  width: 200px;
+	  height :100px;
+	  overflow :hidden;
+	  img{
+	    height :100%;
+	    width :100%;
+	    text-align: center
+	  }
+	}
+	.info-list {
+	  padding :1px 10px
+	}
+	.edit{
+		cursor: pointer;
+		width: 18px;
+	}
+	.play{
+		cursor: pointer;
+		width:17px;
+	}
+	.pause,.del{
+		cursor: pointer;
+		width: 12px;
+	}
+	.tableSpanBorder{
+		display: inline-block;
+		height: 18px;
+		border-left:2px solid #E5E5E5;
+		margin: 0 17px;
+	}
+	.lines{
+		display: inline-block;
+		width: 10px;
+		border-top:1px solid #cccccc ;
+		margin: 3px;
+	}
+	.el-table__body tr{
+		background: #FFFFFF!important;
+	}
+</style>

src/views/mapShow/map.vue

+<template>
+  <div>
+    	<div id="map" class="maps">
+				<div class="inMapBox">
+					<div class="lDiv" :key="index" v-for="(item,index) in typeList">
+						<span class="ltext">{{item.event_name}}</span>
+						<span class="lnum">{{item.total_num}}</span>
+						<div style="clear: both;"></div>
+					</div>
+				</div>
+			</div>
+  </div>
+</template>
+
+<script>
+import { inherits } from "ol/util.js";
+import Map from "ol/Map";
+import View from "ol/View";
+import Feature from "ol/Feature"; //元素
+import Overlay from "ol/Overlay"; //弹出框
+import { toStringHDMS } from "ol/coordinate";
+import { fromLonLat, toLonLat } from "ol/proj";
+import {
+  Tile as TileLayer,
+  Vector as VectorLayer,
+  VectorTile,
+  Heatmap as HeatmapLayer
+} from "ol/layer"; //瓦片图层 , 矢量图层等基础图层
+import { Cluster, OSM, Vector as VectorSource, XYZ, TileJSON } from "ol/source";
+import KML from "ol/format/KML.js";
+import {
+  defaults,
+  Select,
+  DragBox,
+  Pointer,
+  DragAndDrop,
+  Draw,
+  defaults as defaultInteractions,
+  Pointer as PointerInteraction
+} from "ol/interaction"; //交互，选择，画框等
+import {
+  Circle as CircleStyle,
+  Fill,
+  Stroke,
+  Style,
+  Text,
+  Icon
+} from "ol/style"; //添加图层，点，圆等的样式调节
+import { Point, Geometry, LineString } from "ol/geom";
+import GeoJSON from "ol/format/GeoJSON.js";
+import "ol/ol.css"; //地图默认样式
+var map = "";
+var Views = "";
+export default {
+  data() {
+    return {};
+  },
+  methods: {
+    InitMap() {
+      let _this = this;
+      //坐标
+      //
+      var heatData = {
+        type: "FeatureCollection",
+        features: [
+          {
+            type: "Feature",
+            geometry: {
+              type: "Point",
+              coordinates: [116.357068, 39.954021, 0]
+            },
+            properties: {
+              name: "M 5 - 2012 Dec 25, PAKISTAN"
+            }
+          }
+        ]
+      };
+
+      for (var i = 0; i < 300; i++) {
+        let c = Math.random(1) * 1000;
+        let e = Math.random(1) * 100;
+        let b = (116.357068 * 1000000 + i * c) / 1000000;
+        let d = (39.954021 * 1000000 + i * e) / 1000000;
+        let a = {
+          type: "Feature",
+          geometry: {
+            type: "Point",
+            coordinates: [b, d, 0]
+          },
+          properties: {
+            name: "M 5 - 2012 Dec 25, PAKISTAN" + i
+          }
+        };
+        heatData.features.push(a);
+      }
+
+      var vectorSources = new VectorSource({
+        features: new GeoJSON().readFeatures(heatData, {
+          dataProjection: "EPSG:4326"
+        })
+      });
+      var path =
+        "http://192.168.9.62:20080/static/pics/qingdaoMap/roadmap/{z}/{x}/{y}.png";
+      var offlineMapLayer = new TileLayer({
+        source: new XYZ({
+          // 设置本地离线瓦片所在路径，由于例子里面只有一张瓦片，页面显示时就只看得到一张瓦片。
+          url: path
+        })
+      });
+
+      Views = new View({
+        projection: "EPSG:4326",
+        zoom: 2, // 并且定义地图显示层级为2
+        minZoom: 13,
+        maxZoom: 18,
+        center: [120.324447, 36.064594]
+      });
+      map = new Map({
+        // 设置地图图层
+        layers: [
+          // 创建一个使用Open Street Map地图源的瓦片图层
+          offlineMapLayer
+        ],
+        Interactions: [defaults, Select, DragBox],
+        loadTilesWhileAnimating: true,
+
+        // 设置显示地图的视图
+        view: Views,
+        // 让id为map的div作为地图的容器
+        target: "map"
+      });
+      var heatmapvector = new HeatmapLayer({
+        source: vectorSources,
+        blur: parseInt(20, 6),
+        radius: parseInt(3, 5)
+      });
+
+      map.addLayer(heatmapvector);
+
+      // 添加一个使用离线瓦片地图的层
+      var CameraVertorlayer = new VectorLayer({
+        source: _this.addCameraLayer([120.324447, 36.064594], "相机A")
+      });
+
+      map.addLayer(CameraVertorlayer);
+
+      this.addLayer();
+
+      map.on("click", e => {
+        var pixel = map.getEventPixel(e.originalEvent);
+        console.log(pixel);
+        //点击相机标注点
+        map.forEachFeatureAtPixel(pixel, function(feature) {
+          var coodinate = e.coordinate;
+          _this.unid = feature.getProperties().unid;
+          Overlay.setPosition(coodinate);
+          map.addOverlay(Overlay);
+        });
+      });
+    },
+
+    addLayer(data) {
+      var pos = data;
+      var marker = new Overlay({
+        position: pos,
+        positioning: "center-center",
+        element: document.getElementById("canvasDiv")
+      });
+      map.addOverlay(marker);
+    },
+    addCameraLayer(coordinate, phonetext) {
+      let vectorSource = new VectorSource({ id: 1 });
+      let icon = new Feature({
+        geometry: new Point(coordinate),
+        unid: "1"
+      });
+      let color = "#156BB1"; //设置气泡颜色
+      //添加svg图标需注意 width,height要和 new Icon 的imgSize保持一致
+      let svg =
+        '<svg t="1540524238971"  class="icon" style="text-align:center" x="0px" y="0px" width="28px" height="28px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4126" xmlns:xlink="http://www.w3.org/1999/xlink"  xml:space="preserve"><defs><style type="text/css"></style></defs>' +
+        '<path fill="' +
+        color +
+        '" d="M865.309 291.918c-19.289-45.606-46.897-86.557-82.06-121.719-35.161-35.162-76.114-62.771-121.718-82.06-47.23-19.976-97.385-30.105-149.072-30.105S410.618 68.163 363.388 88.139c-45.605 19.289-86.557 46.898-121.719 82.06-35.162 35.161-62.771 76.114-82.06 121.719-19.976 47.229-30.105 97.384-30.105 149.071 0 51.687 10.129 101.841 30.105 149.07 19.289 45.605 46.898 86.558 82.06 121.72 35.162 35.161 76.114 62.771 121.719 82.06 11.201 4.738 22.569 8.914 34.081 12.541l-58.051 143.991-17.783 0c-14.129 0-25.583 11.454-25.583 25.583s11.454 25.583 25.583 25.583l352.169 0c0.063 0 0.124 0.007 0.187 0.007 0.101 0 0.203-0.006 0.303-0.007l35.985 0c14.13 0 25.583-11.454 25.583-25.583s-11.453-25.583-25.583-25.583l-18.876 0-57.565-146.13c24.322-8.109 47.832-18.654 70.119-31.546 57.156-33.063 105.093-80.61 138.628-137.502 34.561-58.633 52.83-125.787 52.83-194.204C895.414 389.302 885.285 339.148 865.309 291.918zM513.814 146.1c26.472 0 48.01 21.537 48.01 48.01 0 26.472-21.537 48.01-48.01 48.01s-48.011-21.537-48.011-48.01C465.804 167.638 487.342 146.1 513.814 146.1zM512.54 688.835c-111.982 0-203.086-91.104-203.086-203.086 0-111.982 91.104-203.086 203.086-203.086 111.981 0 203.086 91.104 203.086 203.086C715.626 597.731 624.521 688.835 512.54 688.835z" p-id="4127"></path><path d="M512.54 333.829c-83.769 0-151.921 68.152-151.921 151.921 0 83.769 68.15 151.921 151.921 151.921 83.769 0 151.921-68.15 151.921-151.921C664.461 401.98 596.309 333.829 512.54 333.829z" p-id="4128"></path><path d="M513.814 197.265c1.739 0 3.154-1.415 3.154-3.155 0-1.74-1.415-3.155-3.154-3.155-1.74 0-3.155 1.415-3.155 3.155C510.659 195.85 512.074 197.265 513.814 197.265z" p-id="4129"></path><path d="M636.408 950.372 636.408 950.372 636.408 950.373Z" p-id="4130"></path></svg>';
+      let cameraIcon = new Image();
+      cameraIcon.src = "data:image/svg+xml," + escape(svg);
+      icon.setStyle(
+        new Style({
+          //设置样式和大小
+          image: new Icon({
+            img: cameraIcon,
+            crossOrigin: "anonymous",
+            // src:'http://192.168.9.233:20080/static/pics/cache/biaozhu.svg',
+            imgSize: [28, 28],
+            zIndex: 20,
+            marginTop: 100
+          }),
+          text: new Text({
+            text: phonetext,
+            textBaseline: "top",
+            font: "normal 12px 微软雅黑",
+            lineHeight: "0px",
+            fill: new Fill({
+              color: "red"
+            })
+          }),
+          stroke: new Stroke({
+            color: "red",
+            width: 21,
+            marginTop: 100
+          })
+        })
+      );
+      vectorSource.addFeature(icon);
+      return vectorSource;
+    },
+
+    addFeature() {
+      function createStyle(src, img) {
+        return new Style({
+          image: new Icon(
+            /** @type {module:ol/style/Icon~Options} */ ({
+              anchor: [0.5, 0.96],
+              crossOrigin: "anonymous",
+              src: src,
+              img: img,
+              imgSize: img ? [img.width, img.height] : undefined
+            })
+          )
+        });
+      }
+
+      var iconFeature = new Feature(new Point([113.338591, 34.50691]));
+      iconFeature.set(
+        "style",
+        createStyle("../../../assets/img/dianli.png", undefined)
+      );
+      var CameraVertorlayer = new VectorLayer({
+        source: iconFeature,
+        id: 1
+      });
+      map.addLayer(this.CameraVertorlayer);
+    }
+  },
+  	mounted(){
+			setTimeout(()=>{
+				this.InitMap();
+			},300)
+		},
+};
+</script>
+
+<style lang="stylus" scoped>
+.ol-control button{
+	  display:none!important;
+	  background:red!important
+	}
+  .canvasDiv{
+	  height :30px;
+	  width :30px;
+	  background :red;
+	  border-radius :30px;
+	  color: #ffffff;
+	  font-size :12px;
+	  text-align :center;
+	  line-height :30px;
+	  z-index :10;
+	  opacity :0.5;
+	}
+	.ol-popup {
+	    position: absolute;
+	    background-color: #eeeeee;
+	    -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+	    filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+	    padding: 15px;
+	    border-radius: 10px;
+	    border: 1px solid #cccccc;
+	    bottom: 12px;
+	    left: -50px;
+	    min-width: 280px;
+	}
+	
+	.ol-popup:after,
+	.ol-popup:before {
+	    top: 100%;
+	    border: solid transparent;
+	    content: " ";
+	    height: 0;
+	    width: 0;
+	    position: absolute;
+	    pointer-events: none;
+	}
+	
+	.ol-popup:after {
+	    border-top-color: #eeeeee;
+	    border-width: 10px;
+	    left: 48px;
+	    margin-left: -10px;
+	}
+	
+	.ol-popup:before {
+	    border-top-color: #cccccc;
+	    border-width: 11px;
+	    left: 48px;
+	    margin-left: -11px;
+	}
+	
+	.ol-popup-closer {
+	    text-decoration: none;
+	    position: absolute;
+	    top: 2px;
+	    right: 8px;
+	}
+	
+	.ol-popup-closer:after {
+	    content: "✖";
+	}
+	.popup-content{
+	  height:300px;
+	  overflow:auto
+	}
+	.pop-info-box{
+	  overflow: hidden;
+	  border-bottom :2px solid #fff
+	}
+	.pop-img-box {
+	  float: left;
+	  height: 100px;
+	  width :120px;
+	  img {
+	    height: 100%;
+	    width: 100%;
+	  }
+	}
+	.pop-info{
+	  float: left;
+	  padding-left: 20px;
+	  width :100px
+	}
+	.map-box {
+	  position: relative;
+	  background :#f8f8f8;
+	  border-radius: 10px;
+	  .content-info{
+	    position :absolute;
+	    z-index :1000;
+	    color: red
+	  }
+	}
+</style>
\ No newline at end of file

src/views/public/videoPlay.vue

+<template>
+  <div class="ocx-box" id="ocx-box" v-show="isShow">
+    <object id="VionVideo" classid="clsid:93F960BB-5AF9-402B-A3DF-06112F14DC02" codebase="VionPlatformVideo.ocx" width="100%"
+      height="100%">
+      <!-- <param name="_Version" value="65536">
+		        <param name="_ExtentX" value="2646">
+		        <param name="_ExtentY" value="1323">
+		        <param name="_StockProps" value="0"> -->
+    </object>
+  </div>
+</template>
+<script>
+  import {
+    mapState
+  } from 'vuex'
+  export default {
+    data() {
+      return {
+        urlFlag:false,
+        isShow:true
+      };
+    },
+    props: ['playulr', 'type'],
+    methods: {
+      videoPlay: function () {
+        this.urlFlag = false
+        if (!this.playulr.sip_serv_ip) {
+          debugger
+          let url = this.playulr.rtsp_url
+          let ocxPlayRes = document.getElementById('VionVideo').StartPlay(url, 0);
+          console.log('video Ocx播放rtsp流返回值:', ocxPlayRes);
+          if (ocxPlayRes != 0) {
+            alert('播放失败!');
+          }
+        } else {
+          let OcxResponse = document.getElementById('VionVideo').StartPlaySip(this.playulr.sip_serv_id, this.playulr.sip_serv_ip,
+            this.playulr.sip_serv_port, this.playulr.sip_unid, this.playulr.sip_password, this.playulr.devId, 0)
+          console.log('video Ocx播放sip流返回值:', OcxResponse);
+          if (OcxResponse != 0 && OcxResponse != 200) {
+            alert('播放失败!');
+          }
+        }
+      },
+      downOcx: function () {
+        if (this.fileUrl !== '' && !this.installOcx) {
+          location.href = this.fileUrl;
+        }
+      },
+      installOcxInfo: function () {
+        this.$confirm('为了正常使用,是否安装OCX控件?', '友情提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          this.installOcx = false;
+          this.downOcx();
+        }).catch(() => {
+          this.installOcxInfo();
+        });
+      },
+      initocx() {
+        //  VionVideo.Init(0, 'Null', 4);
+      },
+      downloadOCx() {
+        // if (navigator.userAgent.indexOf('Trident') > -1) {
+        //   this.axios.get(IP + "/api/v1/device/dlfile", {
+        //       params: {
+        //         file_type: "video_ocx"
+        //       }
+        //     })
+        //     .then(response => {
+        //       location.href = response.data.file_url;
+        //     });
+        // } else {
+        //   this.$message.error("视频控件加载失败请用IE10及以上版本打开！");
+        // }
+      },
+      checkIE() {
+        var agent = navigator.userAgent.toLowerCase();
+        if (/(msie\s|trident.*rv:)([\w.]+)/.test(agent) && document.documentMode < 10) {
+          this.$message.error("IE 版本过低请升级到IE10级以上版本！");
+        }
+      }
+    },
+    created() {
+      // this.checkIE();
+    },
+    computed: {
+      ...mapState(['ocxstate'])
+      // this.initocx();
+    },
+    mounted() {
+      // VionVideo.Init(0, 'Null', 4);
+      // try {
+      //   if (document.getElementById("VionVideo").GetVersion()) {
+      //   }
+      // } catch (error) {
+      //   this.downloadOCx();
+      // }
+    },
+    watch: {
+      ocxstate(val) {
+        try {
+          if(val == 0){
+            this.isShow = false
+          } else {
+            this.isShow = true
+            document.getElementById("VionVideo").StartPlay(0);
+          }
+        } catch (error) {
+          console.log(error)
+        }
+
+      },
+    },
+    beforeDestroy: function () {
+      // if (this.videoplayer.techName_ == "Flash" && this.videoplayer.pause) {
+      //   this.videoplayer.pause();
+      // }
+    }
+  };
+
+</script>
+
+<style lang="stylus" scoped>
+.ocx-box{
+  height 100%
+  width 100%
+}
+</style>

src/views/sceneManage/eventData/allEvent.vue

@@ -14,7 +14,7 @@
 						</div>
 					</el-card>
 				</el-col>
-				<el-col :lg="12" :md="14"  :sm="13" v-if="item.event_type === 'vehicle' || item.event_type === 'xcycle'">
+				<el-col :lg="11" :md="14"  :sm="13" v-if="item.event_type === 'vehicle' || item.event_type === 'xcycle'">
 					<ul class="pic-info">
 							<li v-if="item.event_type === 'vehicle'" :title="item.vehicle_plate_text">
 							<span>车牌号码:</span>
@@ -202,6 +202,7 @@ export default {
   },
   watch:{
      itemData(val){
+			 debugger
 			 if(val == '') {
          this.allAlarmData = [];
          return

src/views/sceneManage/eventData/carEvent.vue

@@ -3,7 +3,7 @@
     <el-row v-if="carAlarmData.length > 0">
 			<!-- 交通事件类 -->
 			<!-- 机动车事件 -->
-			<el-col :span="22" :offset="1" class="pic-box" v-for="(item, index) in carAlarmData" :key="index" v-if="item.event_cate !== 'flow'">
+			<el-col :span="22" class="pic-box" v-for="(item, index) in carAlarmData" :key="index" v-if="item.event_cate !== 'flow'">
 				<el-col :span="12" v-if='item.task_algo_type!="1"'>
 					<el-card :body-style="{ padding: 0 }">
 						<div class="img-wrap" @click="showInfo(index)">
@@ -14,7 +14,7 @@
 						</div>
 					</el-card>
 				</el-col>
-				<el-col :span="11" :offset="1" v-if="item.event_type === 'vehicle' || item.event_type === 'xcycle'">
+				<el-col  :lg="11" :md="14"  :sm="13" v-if="item.event_type === 'vehicle' || item.event_type === 'xcycle'">
 					<ul class="pic-info">
 						<!-- <li :title="item.shoot_date">
 							<span>抓拍日期:</span>

src/views/sceneManage/eventData/eventAlarm.vue

@@ -3,7 +3,7 @@
     <el-row v-if="eventAlarmData.length > 0">
 			<!-- 交通事件类 -->
 			<!-- 机动车事件 -->
-			<el-col :span="22" :offset="1" class="pic-box" v-for="(item, index) in eventAlarmData" :key="index">
+			<el-col :span="22" class="pic-box" v-for="(item, index) in eventAlarmData" :key="index">
 				<el-col :span="12" v-if='item.task_algo_type!="1"'>
 					<el-card :body-style="{ padding: 0 }">
 						<div class="img-wrap" @click="showInfo(index)">
@@ -14,7 +14,7 @@
 						</div>
 					</el-card>
 				</el-col>
-				<el-col :span="12" v-if="item.event_type === 'vehicle' || item.event_type === 'xcycle'">
+				<el-col  :lg="11" :md="14"  :sm="13" v-if="item.event_type === 'vehicle' || item.event_type === 'xcycle'">
 					<ul class="pic-info">
 						<!-- <li :title="item.shoot_date">
 							<span>抓拍日期:</span>

src/views/sceneManage/eventData/illegalEvent.vue

@@ -3,7 +3,7 @@
     <el-row v-if="illegalAlarmData.length > 0">
 			<!-- 交通事件类 -->
 			<!-- 机动车事件 -->
-			<el-col :span="22" :offset="1" class="pic-box" v-for="(item, index) in illegalAlarmData" :key="index" v-if="item.event_cate !== 'flow'">
+			<el-col :span="22" class="pic-box" v-for="(item, index) in illegalAlarmData" :key="index" v-if="item.event_cate !== 'flow'">
 				<el-col :span="12" v-if='item.task_algo_type!="1"'>
 					<el-card :body-style="{ padding: 0 }">
 						<div class="img-wrap" @click="showInfo(index)">
@@ -14,7 +14,7 @@
 						</div>
 					</el-card>
 				</el-col>
-				<el-col :span="12"  v-if="item.event_type === 'vehicle' || item.event_type === 'xcycle'">
+				<el-col  :lg="11" :md="14"  :sm="13"  v-if="item.event_type === 'vehicle' || item.event_type === 'xcycle'">
 					<ul class="pic-info">
 						<!-- <li :title="item.shoot_date">
 							<span>抓拍日期:</span>

src/views/sceneManage/eventTab.vue

@@ -75,11 +75,12 @@ export default {
       this.$store.commit("setocxstate", 1);
     },
     connectwebsocket(type) {
+      debugger
       let that = this;
       this.connect_id = new Date().getTime();
       this.cws = new WebSocket(
         "ws://" +
-          this.API.IP +
+          this.$api.wsIP +
           "/websocket/v1/recv_data/connects/" +
           this.connect_id
       );
@@ -157,8 +158,10 @@ export default {
                   data.pics[0].src_url ||
                   "data:image/jpeg;base64," + data.pics[0].pic_base64;
               }
+              that.$buildCode.init(data);
+
               setTimeout(() => {
-                this.filterCode(data);
+                that.resultData = data
               }, 500);
             } catch (err) {
               console.log(err);

src/views/sceneManage/index.vue

@@ -19,7 +19,7 @@
               <span class="task-title">{{item.task_name}}</span>
           </span>
             <ol v-if="index == subindex">
-							<li @click='subTasksClick(subTask)' class="subtask" :title='subTask.subtask_name' v-for="subTask in subTasks" :key="subTask.subtask_id" :class="[{ subtaskActive: subTask.subtask_id == currentSubtaskId},{disabledColor:subTask.running_status!='Running'}]" :data-subtask='subTask.subtask_id' :id='subTask.vchan.vdev_unid+","+subTask.vchan.vchan_refid'>
+							<li @click.stop='subTasksClick(subTask)' class="subtask" :title='subTask.subtask_name' v-for="subTask in subTasks" :key="subTask.subtask_id" :class="[{ subtaskActive: subTask.subtask_id == currentSubtaskId},{disabledColor:subTask.running_status!='Running'}]" :data-subtask='subTask.subtask_id' :id='subTask.vchan.vdev_unid+","+subTask.vchan.vchan_refid'>
 							<i class="el-icon-fanxin-yuandian icon"></i>	{{subTask.subtask_name?subTask.subtask_name:subTask.name}}
 							</li>
 						</ol>
@@ -42,13 +42,13 @@
     </div>
     <el-col :span="6" class="ht100">
       <div class="show-box">
-        <eventtab ref="event"></eventtab>
+        <eventtab ref="event" ></eventtab>
       </div>
     </el-col>
   </el-row>
 </template>
 <script>
-import videoplay from './videoplay'
+import videoplay from '../public/videoPlay'
 import InfoDialog from '../public/infodialog'
 import setting from './setting'
 import eventtab from './eventTab'

src/views/sceneManage/paramSet.vue

@@ -133,7 +133,19 @@
 			},
 			visiblehide(){
 				this.$emit('update:visible',false)
+			},
+			getTypes(){
+					 let params = {
+								offset: 0,
+								limit: ''
+						}
+				this.$api.task.getConftypes(params).then(res => {
+					this.types = res.list_data
+				})
 			}
+		},
+		created(){
+			this.getTypes()
 		}
 	}
 </script>

src/views/sceneManage/setting/areaconfig/TraficCanvas.vue

@@ -2071,7 +2071,7 @@ button {
 }
 
 .modal-body {
-  height: 620px !important;
+  height: 540px !important;
 }
 .modal-lt {
   width: 100%;

src/views/sceneManage/setting/handleparam.vue

+<template>
+  <div class="paramset-box">
+    <el-dialog :title="curtype === 'export'?'配置导出':'配置导入'" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
+      <div class="setparams-box">
+        <el-form label-width="80px" :model="paramform" v-show="curtype === 'upload'">
+          <el-form-item label="类型">
+             <el-select v-model="paramform.fileType">
+                <el-option v-for="type in types" :key="type.type_code" :value="type.type_code" :label="type.conf_name"></el-option>
+              </el-select>
+          </el-form-item>
+          <el-form-item label="名称">
+            <el-input v-model="paramform.name"></el-input>
+          </el-form-item>
+          <el-form-item label="文件">
+              <el-upload
+                class="upload-demo"
+                ref="paramsup"
+                action="https://jsonplaceholder.typicode.com/posts/"
+                :before-upload="handlePreview"
+                multiple
+                :limit="1"
+                :auto-upload="false"
+                :on-success="sucessfile"
+                :file-list="fileList">
+                <el-button size="small" slot="trigger" type="primary">点击上传</el-button>
+                <div slot="tip" class="el-upload__tip">只能上传tar.gz文件.</div>
+              </el-upload>
+          </el-form-item>
+        </el-form>
+        <el-form label-width="80px" :model="exportform"  v-show="curtype === 'export'">
+           <el-form-item label="类型">
+             <el-select v-model="paramform.fileType">
+                <el-option v-for="type in types" :key="type.type_code" :value="type.type_code" :label="type.conf_name"></el-option>
+              </el-select>
+          </el-form-item>
+        </el-form>
+      </div>
+
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose()">取 消</el-button>
+        <el-button type="primary" @click="uploadparams()">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      dialogVisible: false,
+      paramform:{
+        fileType:''
+      },
+      exportform:{},
+      fileList:[],
+      types:[]
+    };
+    curtype:''
+  },
+  methods: {
+    show(type) {
+      this.curtype = type;
+      this.dialogVisible = true;
+      this.$store.commit("setocxstate", 1);
+    },
+    handlePreview(file){
+      if(this.uploadFile(file,'application/x-gzip')){
+        return false
+      } else {
+        return true
+      }
+    },
+    uploadparams(){
+      this.$refs.paramsup.submit()
+    },
+    sucessfile(){
+
+    },
+    submitParamSet(){
+      
+    },
+    handleClose(done) {
+      this.dialogVisible = false,
+      this.$store.commit("setocxstate", 0);
+    },
+    getTypes(){
+      let params = {
+          offset: 0,
+          limit: ''
+      }
+      this.$api.task.getConftypes(params).then(res => {
+        this.types = res.list_data
+      })
+			}
+  },
+  created(){
+    this.getTypes()
+  }
+};
+</script>
+
+<style lang="stylus" scoped>
+.setparams-box{
+  width 400px
+  margin 0 auto
+}
+.paramset-box{
+  overflow hidden
+}
+</style>
\ No newline at end of file

src/views/sceneManage/setting/index.vue

 <template>
-  <div >
-    <div class="">
+  <div class="box">
+    <div>
       <el-table
         :data="taskInfo.mtasks[0].scenes"
         border
@@ -47,17 +47,20 @@
         <div class="set-item">场景添加 <span class="set-icon  el-icon-circle-plus"></span> </div>
         <div class="set-item">轮询播放 <span class="set-icon">
           <el-switch
-            width="25"
+            :width="25"
             v-model="switchstate"
-            active-color="#13ce66"
-            inactive-color="#ff4949">
+          >
             </el-switch>
           </span> 
         </div>
-        <div class="set-item" @click="exportparam">配置导入  <span class="set-icon el-icon-download"></span> </div>
-        <div class="set-item" @click="uploadparam">配置导出  <span class="set-icon el-icon-upload"></span> </div>
-        <div class="set-item" @click="uploadparam">效果展示  <span class="set-icon el-icon-s-help"></span> </div>
+        <div class="set-item" @click="handleparam('upload')">配置导入  <span class="set-icon el-icon-download"></span> </div>
+        <div class="set-item" @click="handleparam('export')">配置导出  <span class="set-icon el-icon-upload"></span> </div>
+        <div class="set-item" @click="showview()">效果展示  <span class="set-icon el-icon-s-help"></span> </div>
+      </div>
+      <handleparam ref="handleparam"></handleparam>
     </div>
+    <div class="yt-box">
+        <ytconfig></ytconfig>
       </div>
     <div>
       <parameter ref="parameter"></parameter>
@@ -68,9 +71,6 @@
     <div>
         <demarcate  ref="demarcate"></demarcate>
     </div>
-    <div>
-
-    </div>
   </div>
 </template>
 <script>
@@ -78,6 +78,7 @@ import areas from './area'
 import demarcate from './demarcate'
 import parameter from './parameter'
 import ytconfig from './ytconfig'
+import handleparam from './handleparam'
 export default {
   data(){
     return{
@@ -94,7 +95,8 @@ export default {
     areas,
     demarcate,
     parameter,
-    ytconfig
+    ytconfig,
+    handleparam
   },
   methods: {
      setParam(){
@@ -106,11 +108,8 @@ export default {
       setDemarcate(){
         this.$refs.demarcate.showModal(this.taskInfo);
       },
-      exportparam(){
-
-      },
-      uploadparam(){
-
+      handleparam(type){
+        this.$refs.handleparam.show(type)
       },
       getTaskParams(){
         this.$api.task.getTaskParams(this.taskid,this.subtaskid).then(data => {
@@ -118,6 +117,9 @@ export default {
           console.log(res.data)
         })
       },
+      showview(){
+        
+      },
       submit: function(xml,type) {
 				let postObj = {
 						subtask_id: this.subtaskid,
@@ -190,12 +192,23 @@ export default {
 }
 </script>
 <style lang="stylus" scoped>
+.box{
+  position relative
+}
 .yzw-setbox{
   .icon {
     font-size 16px
     padding 0 10px
+    cursor pointer
+  }
+  .icon:first-child{
+    color #6783E3
+  }
+  .icon:last-child{
+    color red
   }
 }
+
 .setting-box{
   width 18%;
   float right
@@ -232,9 +245,21 @@ export default {
     font-size 20px
     color #CCCCCC
   }
+  .set-icon:hover{
+    color #3BB7FF
+  }
 }
 .upload-box {
   margin-right 20px
 }
+.yt-box{
+  position absolute
+  top 0
+  left 0
+  right 0
+  margin auto
+  color #333
+  z-index 100
+}
 
 </style>

src/views/sceneManage/setting/ytconfig.vue

 <template>
-  <div>
+  <div class="yt-box" v-show="showyt">
     
   </div>
 </template>
 
 <script>
 export default {
-
+  data() {
+    return {
+      showyt:false
+    }
+  },
 }
 </script>
 
-<style>
-
+<style lang="stylus" scoped>
+  .yt-box{
+    height 30vh
+    width 31vw
+    background blue
+  }
 </style>
\ No newline at end of file