init

.babelrc

@@ -0,0 +1,8 @@
+{
+  "presets": [
+    "@vue/app"
+  ],
+  "plugins": [
+    "@babel/plugin-syntax-dynamic-import"
+  ]
+}

.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

.eslintignore

@@ -0,0 +1,2 @@
+routers.js
+dtree.js

.eslintrc.js

@@ -0,0 +1,15 @@
+module.exports = {
+  root: true,
+  'extends': [
+    'plugin:vue/essential',
+    '@vue/standard'
+  ],
+  rules: {
+    // allow async-await
+    'generator-star-spacing': 'off',
+    // allow debugger during development
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    'vue/no-parsing-error': [2, { 'x-invalid-end-tag': false }],
+    'no-undef': 'off'
+  }
+}

.eslintrc.json

@@ -0,0 +1,24 @@
+{
+    "root": true,
+    "parserOptions": {
+        "ecmaFeatures": {
+            "experimentalObjectRestSpread": true
+        },
+        "ecmaVersion": 6,
+        "sourceType": "module"
+    },
+    "env": {
+        "browser": true,
+        "commonjs": true,
+        "es6": true
+    },
+    "extends": "eslint:recommended",
+    "plugins": ["vue"],
+    "rules": {
+        "indent": ["error", 4, { "SwitchCase": 1 }],
+        "quotes": ["error", "single"],
+        "semi": ["error", "always"],
+        "vue/jsx-uses-vars": 2,
+        "no-console": ["error"]
+    }
+}

.gitignore

@@ -0,0 +1,26 @@
+.DS_Store
+node_modules
+/dist
+
+/tests/e2e/videos/
+/tests/e2e/screenshots/
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw*
+
+build/env.js

.postcssrc.js

@@ -0,0 +1,5 @@
+module.exports = {
+  plugins: {
+    autoprefixer: {}
+  }
+}

.travis.yml

@@ -0,0 +1,5 @@
+language: node_js
+node_js: stable
+script: npm run lint
+notifications:
+  email: false

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2017 iView
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1 @@
+TODO

cypress.json

@@ -0,0 +1,3 @@
+{
+  "pluginsFile": "tests/e2e/plugins/index.js"
+}

package.json

@@ -0,0 +1,73 @@
+{
+  "name": "iui-admin",
+  "version": "2.0.0",
+  "author": "meixinbin@qq.com",
+  "private": false,
+  "scripts": {
+    "dev": "vue-cli-service serve --open",
+    "build": "vue-cli-service build",
+    "test:unit": "vue-cli-service test:unit",
+    "test:e2e": "vue-cli-service test:e2e"
+  },
+  "dependencies": {
+    "@aximario/json-tree": "^2.1.0",
+    "@riophae/vue-treeselect": "^0.4.0",
+    "axios": "^0.18.0",
+    "babel-plugin-import": "^1.10.0",
+    "clipboard": "^2.0.4",
+    "codemirror": "^5.38.0",
+    "core-js": "^2.6.12",
+    "countup": "^1.8.2",
+    "cropperjs": "^1.2.2",
+    "deasync": "^0.1.24",
+    "drag-tree-table": "^2.1.0",
+    "echarts": "^4.0.4",
+    "element-ui": "^2.15.6",
+    "html2canvas": "^1.0.0-alpha.12",
+    "iview-area": "^1.5.17",
+    "js-cookie": "^2.2.0",
+    "node-sass": "^4.9.4",
+    "pdfjs": "^2.4.1",
+    "pdfjs-dist": "^2.2.228",
+    "qs": "^6.7.0",
+    "sass-loader": "^7.1.0",
+    "simplemde": "^1.11.2",
+    "sortablejs": "^1.7.0",
+    "tiptap": "^1.32.1",
+    "tiptap-extensions": "^1.35.1",
+    "view-design": "^4.7.0",
+    "vue": "^2.5.10",
+    "vue-giant-tree": "^0.1.5",
+    "vue-i18n": "^7.8.0",
+    "vue-infinite-scroll": "^2.0.2",
+    "vue-jstree": "^2.1.6",
+    "vue-pdf": "^4.1.0",
+    "vue-router": "^3.0.1",
+    "vue2-toast": "^2.0.2",
+    "vuedraggable": "^2.16.0",
+    "vuex": "^3.0.1",
+    "wangeditor": "^3.1.1",
+    "webpack-cli": "^4.9.1",
+    "xlsx": "^0.13.3"
+  },
+  "devDependencies": {
+    "@babel/plugin-syntax-dynamic-import": "^7.0.0-rc.1",
+    "@vue/cli-plugin-babel": "^3.0.1",
+    "@vue/cli-plugin-unit-mocha": "^3.0.1",
+    "@vue/cli-service": "^3.0.1",
+    "@vue/test-utils": "^1.0.0-beta.10",
+    "babel-preset-es2015": "^6.24.1",
+    "chai": "^4.1.2",
+    "eslint-plugin-cypress": "^2.0.1",
+    "font-awesome": "^4.7.0",
+    "less": "^2.7.3",
+    "less-loader": "^4.0.5",
+    "mockjs": "^1.0.1-beta3",
+    "vue-template-compiler": "^2.5.13"
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not ie <= 8"
+  ]
+}

public/index.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <title></title>
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but iui-admin doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

src/App.vue

@@ -0,0 +1,28 @@
+<template>
+  <div id="app">
+    <router-view/>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'App',
+  mounted() {
+  }
+}
+</script>
+
+<style lang="less">
+.size{
+  width: 100%;
+  height: 100%;
+}
+html,body{
+  .size;
+  margin: 0;
+  padding: 0;
+}
+#app {
+  .size;
+}
+</style>

src/api/data.js

@@ -0,0 +1,830 @@
+import axios from '@/libs/api.request'
+import qs from "qs";
+
+
+export const createDictionary = (p) => {
+  return axios.request({
+    url: 'dictionary/rest',
+    method: 'post',
+    params:p
+  })
+}
+export const updateDictionary = (p) => {
+  return axios.request({
+    url: 'dictionary/rest',
+    method: 'put',
+    params:p
+  })
+}
+export const deleteDictionary = (id) => {
+  return axios.request({
+    url: 'dictionary/rest/'+id,
+    method: 'delete'
+  })
+}
+export const listDictionary = (p) => {
+  return axios.request({
+    url: 'dictionary/rest',
+    method: 'get',
+    params: p
+  })
+}
+export const listDictionaryRequest = (p) => {
+  return axios.request({
+    url: 'dictionary/rest?list',
+    method: 'get',
+    params: p
+  })
+}
+export const createClassifyRequest = (p) => {
+  return axios.request({
+    url: 'classify/rest/',
+    method: 'post',
+    params:p
+  })
+}
+
+export const updateClassifyRequest = (p) => {
+  return axios.request({
+    url: 'classify/rest/',
+    method: 'put',
+    params:p
+  })
+}
+
+export const deleteClassify = (id) => {
+  return axios.request({
+    url: 'classify/rest/'+id,
+    method: 'delete'
+  })
+}
+export const classifyDetailRequest = (id) => {
+  return axios.request({
+    url: 'classify/rest/'+id,
+    method: 'get'
+  })
+}
+export const listClassifyRequest = (p) => {
+  return axios.request({
+    url: 'classify/rest?list',
+    method: 'get',
+    params: p
+  })
+}
+export const listClassifyUsersRequest = (p) => {
+  return axios.request({
+    url: 'classify/rest?users',
+    method: 'get',
+    params: p
+  })
+}
+//=====================applications
+
+export const createApp = (createApp) => {
+  return axios.request({
+    url: 'application/create',
+    method: 'post',
+    data: JSON.stringify(createApp),
+    headers:{
+      'Content-Type': 'application/json;UTF-8'
+    }
+  })
+}
+export const updateApplicationRequest = (p) => {
+  return axios.request({
+    url: 'application/',
+    method: 'put',
+    params:p
+  })
+}
+export const applicationList = (req) => {
+  return axios.request({
+    url: 'application/list',
+    method: 'get',
+    params:req
+  })
+}
+export const applicationTemplateList = (req) => {
+  return axios.request({
+    url: 'application/template/rest/list',
+    method: 'get',
+    params:req
+  })
+}
+export const getSchemas = (id) => {
+  return axios.request({
+    url: 'application/template/rest/schemas/'+id,
+    method: 'get'
+  })
+}
+export const getApplicationAttributes = (id) => {
+  return axios.request({
+    url: 'application/?Attributes&applicationId='+id,
+    method: 'get'
+  })
+}
+export const deleteApplicationRequest = (id) => {
+  return axios.request({
+    url: 'application/'+id,
+    method: 'delete'
+  })
+}
+export const applicationBindPsRequest = (p) => {
+  return axios.request({
+    url: 'application?BindPs',
+    method: 'post',
+    params:p
+  })
+}
+export const scimConfigRequest = (p) => {
+  return axios.request({
+    url: 'scim/config',
+    method: 'get',
+    params: p
+  })
+}
+export const listApplicationGrantedOusRequest = (id) => {
+  return axios.request({
+    url: 'application?ListApplicationGrantedOus&applicationId='+id,
+    method: 'get'
+  })
+}
+export const saveScimConfigRequest = (p) => {
+  return axios.request({
+    url: 'scim/config',
+    method: 'post',
+    params: p
+  })
+}
+export const grantUsersToApplicationRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?GrantUsersToApplication',
+    method: 'post',
+    params:p
+  })
+}
+export const listApplicationHasUsersRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?ApplicationHasUsers',
+    method: 'post',
+    params:p
+  })
+}
+export const grantGroupsToApplicationRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?GrantGroupsToApplication',
+    method: 'post',
+    params:p
+  })
+}
+export const listApplicationHasGroupsRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?ApplicationHasGroups',
+    method: 'post',
+    params:p
+  })
+}
+export const grantClassifiesToApplicationRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?GrantClassifiesToApplication',
+    method: 'post',
+    params:p
+  })
+}
+export const listApplicationHasClassifiesRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?ApplicationHasClassifies',
+    method: 'post',
+    params:p
+  })
+}
+export const listApplicationHasOusRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?ApplicationHasOus',
+    method: 'post',
+    params:p
+  })
+}
+export const grantOusToApplicationRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?GrantOusToApplication',
+    method: 'post',
+    params:p
+  })
+}
+export const listUserHasApplicationsRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?UserHasApplications',
+    method: 'post',
+    params:p
+  })
+}
+export const grantApplicationsToUserRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?GrantApplicationsToUser',
+    method: 'post',
+    params:p
+  })
+}
+export const grantApplicationsToGroupRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?GrantApplicationsToGroup',
+    method: 'post',
+    params:p
+  })
+}
+export const grantApplicationsToClassifyRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?GrantApplicationsToClassify',
+    method: 'post',
+    params:p
+  })
+}
+export const grantApplicationsToOuRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?GrantApplicationsToOu',
+    method: 'post',
+    params:p
+  })
+}
+export const listGroupHasApplicationsRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?GroupHasApplications',
+    method: 'post',
+    params:p
+  })
+}
+export const listClassifyHasApplicationsRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?ClassifyHasApplications',
+    method: 'post',
+    params:p
+  })
+}
+export const listOuHasApplicationsRequest = (p) => {
+  return axios.request({
+    url: 'application/authorization?OuHasApplications',
+    method: 'post',
+    params:p
+  })
+}
+//============================ud
+/*export const listOrgRequest = (externalId) => {
+  return axios.request({
+    url: 'organization/list',
+    method: 'get',
+    params:{
+      externalId:externalId
+    }
+  })
+}*/
+export const listOrgPageRequest = (page) => {
+  return axios.request({
+    url: 'organization/list',
+    method: 'get',
+    params:page
+  })
+}
+export const getOrgRootRequest = () => {
+  return axios.request({
+    url: 'organization/root',
+    method: 'get'
+  })
+}
+export const getOrgChildrenRequest = (pId) => {
+  return axios.request({
+    url: 'organization/children',
+    method: 'get',
+    params:{
+      id:pId
+    }
+  })
+}
+export const createOrgRequest = (data) => {
+  return axios.request({
+    url: 'organization/create',
+    method: 'post',
+    params: data
+  })
+}
+export const updateOrgRequest = (data) => {
+  return axios.request({
+    url: 'organization/update',
+    method: 'put',
+    params: data
+  })
+}
+export const deleteOrgRequest = (id) => {
+  return axios.request({
+    url: 'organization/delete',
+    method: 'delete',
+    params: {
+      id: id
+    }
+  })
+}
+export const createUserRequest = (data) => {
+  return axios.request({
+    url: 'user/create',
+    method: 'post',
+    params: data
+  })
+}
+export const updateUserRequest = (data) => {
+  return axios.request({
+    url: 'user/update',
+    method: 'put',
+    params: data
+  })
+}
+export const transferUserRequest = (data) => {
+  return axios.request({
+    url: 'user/TransferUser',
+    method: 'post',
+    params: data
+  })
+}
+export const removeUserToRootOURequest = (id) => {
+  return axios.request({
+    url: 'user/move_to_root?id='+id,
+    method: 'put'
+  })
+}
+export const removeUserRequest = (id) => {
+  return axios.request({
+    url: 'user/remove?id='+id,
+    method: 'delete'
+  })
+}
+export const deleteUserRequest = (id) => {
+  return axios.request({
+    url: 'user/delete?id='+id,
+    method: 'delete'
+  })
+}
+export const listUsersRequest = (param) => {
+  return axios.request({
+    url: 'user/list',
+    method: 'get',
+    params: param
+  })
+}
+export const getUserPermissionIdsRequest = (param) => {
+  return axios.request({
+    url: 'user/permissions?ids',
+    method: 'get',
+    params: param
+  })
+}
+export const getGroupPermissionIdsRequest = (param) => {
+  return axios.request({
+    url: 'group/permissions?ids',
+    method: 'get',
+    params: param
+  })
+}
+export const getOuPermissionIdsRequest = (param) => {
+  return axios.request({
+    url: 'organization/permissions?ids',
+    method: 'get',
+    params: param
+  })
+}
+export const getClassifyPermissionIdsRequest = (param) => {
+  return axios.request({
+    url: 'classify/rest/permissions?ids',
+    method: 'get',
+    params: param
+  })
+}
+export const listUsersSumaryRequest = (param) => {
+  return axios.request({
+    url: 'user/?sumary',
+    method: 'get',
+    params: param
+  })
+}
+export const listArchivedUsersRequest = (param) => {
+  return axios.request({
+    url: 'user/list_archived',
+    method: 'get',
+    params: param
+  })
+}
+export const createGroupRequest = (data) => {
+  return axios.request({
+    url: 'group/create',
+    method: 'post',
+    params: data
+  })
+}
+export const updateGroupRequest = (data) => {
+  return axios.request({
+    url: 'group/update',
+    method: 'put',
+    params: data
+  })
+}
+export const deleteGroupRequest = (id) => {
+  return axios.request({
+    url: 'group/delete',
+    method: 'delete',
+    params: id
+  })
+}
+export const listGroupRequest = (data) => {
+  return axios.request({
+    url: 'group/list',
+    method: 'get',
+    params: data
+  })
+}
+export const searchGroupRequest = (data) => {
+  return axios.request({
+    url: 'group/search',
+    method: 'get',
+    params: data
+  })
+}
+//=====================ps actions
+export const psList = (page) => {
+  return axios.request({
+    url: 'ps/rest/list',
+    method: 'get',
+    params: page
+
+  })
+}
+export const getPsDetailRequest = (id) => {
+  return axios.request({
+    url: 'ps/rest/'+id,
+    method: 'get'
+  })
+}
+export const addPs = (createPs) => {
+  return axios.request({
+    url: 'ps/rest/create',
+    method: 'post',
+    params: createPs
+  })
+}
+export const updatePsRequest = (createPs) => {
+  return axios.request({
+    url: 'ps/rest/update',
+    method: 'put',
+    params: createPs
+  })
+}
+export const deletePsRequest = (psId) => {
+  return axios.request({
+    url: 'ps/rest/delete',
+    method: 'delete',
+    params: {
+      psId: psId
+    }
+  })
+}
+export const grantPermissionsToUserRequest = (p) => {
+  return axios.request({
+    url: 'ps/rest/user/permissions',
+    method: 'post',
+    params: p
+  })
+}
+export const listUserPermissionsRequest = (p) => {
+  return axios.request({
+    url: 'ps/rest/user/permissions',
+    method: 'get',
+    params: p
+  })
+}
+export const listGroupPermissionsRequest = (p) => {
+  return axios.request({
+    url: 'ps/rest/group/permissions',
+    method: 'get',
+    params: p
+  })
+}
+export const grantPermissionsToGroupRequest = (p) => {
+  return axios.request({
+    url: 'ps/rest/group/permissions',
+    method: 'post',
+    params: p
+  })
+}
+export const listOuPermissionsRequest = (p) => {
+  return axios.request({
+    url: 'ps/rest/ou/permissions',
+    method: 'get',
+    params: p
+  })
+}
+export const grantPermissionsToOuRequest = (p) => {
+  return axios.request({
+    url: 'ps/rest/ou/permissions',
+    method: 'post',
+    params: p
+  })
+}
+export const listClassifyPermissionsRequest = (p) => {
+  return axios.request({
+    url: 'ps/rest/classify/permissions',
+    method: 'get',
+    params: p
+  })
+}
+export const grantPermissionsToClassifyRequest = (p) => {
+  return axios.request({
+    url: 'ps/rest/classify/permissions',
+    method: 'post',
+    params: p
+  })
+}
+export const grantRolesToUserRequest = (p) => {
+  return axios.request({
+    url: '/user/roles',
+    method: 'post',
+    params: p
+  })
+}
+export const getUserRoles = (p) => {
+  return axios.request({
+    url: '/user/roles',
+    method: 'get',
+    params: p
+  })
+}
+export const getUserHasRoleIds = (p) => {
+  return axios.request({
+    url: '/user/has/roles',
+    method: 'get',
+    params: p
+  })
+}
+export const getGroupHasRoleIds = (p) => {
+  return axios.request({
+    url: '/group/has/roles',
+    method: 'get',
+    params: p
+  })
+}
+export const grantRolesToGroupRequest = (p) => {
+  return axios.request({
+    url: '/group/roles',
+    method: 'post',
+    params: p
+  })
+}
+export const getOuHasRoleIds = (p) => {
+  return axios.request({
+    url: '/organization/has/roles',
+    method: 'get',
+    params: p
+  })
+}
+export const grantRolesToOuRequest = (p) => {
+  return axios.request({
+    url: '/organization/roles',
+    method: 'post',
+    params: p
+  })
+}
+export const getClassifyHasRoleIds = (p) => {
+  return axios.request({
+    url: '/classify/rest/has/roles',
+    method: 'get',
+    params: p
+  })
+}
+export const grantRolesToClassifyRequest = (p) => {
+  return axios.request({
+    url: '/classify/rest/roles',
+    method: 'post',
+    params: p
+  })
+}
+export const grantUsersToPermissionRequest = (p) => {
+  return axios.request({
+    url: '/permission/rest/users',
+    method: 'post',
+    params: p
+  })
+}
+export const getPermissionHasUserIds = (p) => {
+  return axios.request({
+    url: '/permission/rest/has/users',
+    method: 'post',
+    params: p
+  })
+}
+export const grantGroupsToPermissionRequest = (p) => {
+  return axios.request({
+    url: '/permission/rest/groups',
+    method: 'post',
+    params: p
+  })
+}
+export const getPermissionHasGroupIds = (p) => {
+  return axios.request({
+    url: '/permission/rest/has/groups',
+    method: 'post',
+    params: p
+  })
+}
+export const getPermissionHasClassifyIds = (p) => {
+  return axios.request({
+    url: '/permission/rest/has/classifies',
+    method: 'post',
+    params: p
+  })
+}
+export const grantClassifiesToPermissionRequest = (p) => {
+  return axios.request({
+    url: '/permission/rest/classifies',
+    method: 'post',
+    params: p
+  })
+}
+export const grantOusToPermissionRequest = (p) => {
+  return axios.request({
+    url: '/permission/rest/ous',
+    method: 'post',
+    params: p
+  })
+}
+export const getPermissionOus = (p) => {
+  return axios.request({
+    url: '/permission/rest/ous',
+    method: 'get',
+    params: p
+  })
+}
+//==============role actions
+export const getRolePage = (page) => {
+  return axios.request({
+    url: 'role/rest/list',
+    method: 'get',
+    params: page
+  })
+}
+export const createRole = (role) => {
+  return axios.request({
+    url: 'role/rest/create',
+    method: 'post',
+    params: role
+  })
+}
+export const updateRole = (role) => {
+  return axios.request({
+    url: 'role/rest/update',
+    method: 'put',
+    params: role
+  })
+}
+export const enableRole = (psId,roleId) => {
+  return axios.request({
+    url: 'role/rest/enable',
+    method: 'put',
+    params: {
+      psId:psId,
+      roleId:roleId
+    }
+  })
+}
+export const disableRole = (psId,roleId) => {
+  return axios.request({
+    url: 'role/rest/disable',
+    method: 'put',
+    params: {
+      psId:psId,
+      roleId:roleId
+    }
+  })
+}
+export const updateRolePermissions = (data) => {
+  return axios.request({
+    url: 'role/rest/grant/permissions',
+    method: 'post',
+    params: data
+  })
+}
+export const getRolePermissions = (psId,roleId) => {
+  return axios.request({
+    url: 'role/rest/granted/permissions',
+    method: 'get',
+    params: {
+      psId:psId,
+      roleId:roleId
+    }
+  })
+}
+export const getRoleHasUserIds = (p) => {
+  return axios.request({
+    url: 'role/rest/has/users',
+    method: 'post',
+    params: p
+  })
+}
+
+export const getRoleHasGroupIds = (p) => {
+  return axios.request({
+    url: 'role/rest/has/groups',
+    method: 'post',
+    params: p
+  })
+}
+export const getRoleHasClassifyIds = (p) => {
+  return axios.request({
+    url: 'role/rest/has/classifies',
+    method: 'post',
+    params: p
+  })
+}
+export const getRoleUsersPageRequest = (p) => {
+  return axios.request({
+    url: 'role/rest/users',
+    method: 'get',
+    params: p
+  })
+}
+export const getRoleHasOuIds = (p) => {
+  return axios.request({
+    url: 'role/rest/has/ous',
+    method: 'post',
+    params: p
+  })
+}
+export const grantUsersToRoleRequest = (p) => {
+  return axios.request({
+    url: 'role/rest/users',
+    method: 'post',
+    params: p
+  })
+}
+export const grantOusToRoleRequest = (p) => {
+  return axios.request({
+    url: 'role/rest/ous',
+    method: 'post',
+    params: p
+  })
+}
+export const grantGroupsToRoleRequest = (p) => {
+  return axios.request({
+    url: 'role/rest/groups',
+    method: 'post',
+    params: p
+  })
+}
+export const getRoleOus = (p) => {
+  return axios.request({
+    url: '/role/rest/ous',
+    method: 'get',
+    params: p
+  })
+}
+
+//================================permission api
+
+export const getPermissionPage = (page) => {
+  return axios.request({
+    url: 'permission/rest/list',
+    method: 'get',
+    params: page
+  })
+}
+export const listPermissionRequest = (psId) => {
+  return axios.request({
+    url: 'permission/rest/list?all',
+    method: 'get',
+    params: {
+      psId:psId
+    }
+  })
+}
+export const createPermission = (permission) => {
+  return axios.request({
+    url: 'permission/rest/create',
+    method: 'post',
+    params: permission
+  })
+}
+export const updatePermission = (permission) => {
+  return axios.request({
+    url: 'permission/rest/update',
+    method: 'put',
+    params: permission
+  })
+}
+export const deletePermission = (id) => {
+  return axios.request({
+    url: 'permission/rest/delete',
+    method: 'delete',
+    params:id
+  })
+}
+export const listPsSimpleInfo = () => {
+  return axios.request({
+    url: 'ps/rest?ListSimpleInfo',
+    method: 'get'
+  })
+}

src/api/routers.js

@@ -0,0 +1,11 @@
+import axios from '@/libs/api.request'
+
+export const getRouterReq = (access) => {
+  return axios.request({
+    url: 'get_router',
+    params: {
+      access
+    },
+    method: 'get'
+  })
+}

src/api/user.js

@@ -0,0 +1,45 @@
+import axios from '@/libs/api.request'
+import config from '@/config'
+
+const ssoServer = process.env.NODE_ENV === 'development' ? config.sso.dev : config.sso.pro
+
+export const login = ({ userName, password }) => {
+  const data = {
+    userName,
+    password
+  }
+  return axios.request({
+    url: 'login',
+    data,
+    method: 'post'
+  })
+}
+
+export const getUserProfile = (token) => {
+  return axios.request({
+    url: ssoServer+'oidc/profile',
+    params: {
+      access_token: token
+    },
+    method: 'get'
+  })
+}
+
+export const logout = (token) => {
+  return axios.request({
+    url: 'logout',
+    method: 'post'
+  })
+}
+
+export const ticketValidate = (ticket) => {
+  return axios.request({
+    url: ssoServer + 'serviceValidate',
+    params: {
+      ticket: ticket,
+      service: sessionStorage.getItem('service')
+    },
+    method: 'get'
+  })
+}
+

src/assets/editor/font/demo.css

@@ -0,0 +1,539 @@
+/* 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/editor/font/demo_index.html

@@ -0,0 +1,791 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8"/>
+  <title>IconFont Demo</title>
+  <link rel="shortcut icon" href="https://img.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=2370704" 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">&#xe601;</span>
+                <div class="name">add_col_after</div>
+                <div class="code-name">&amp;#xe601;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe602;</span>
+                <div class="name">add_row_after</div>
+                <div class="code-name">&amp;#xe602;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe603;</span>
+                <div class="name">code</div>
+                <div class="code-name">&amp;#xe603;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe604;</span>
+                <div class="name">delete_row</div>
+                <div class="code-name">&amp;#xe604;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe605;</span>
+                <div class="name">delete_col</div>
+                <div class="code-name">&amp;#xe605;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe606;</span>
+                <div class="name">add_row_before</div>
+                <div class="code-name">&amp;#xe606;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe607;</span>
+                <div class="name">hr</div>
+                <div class="code-name">&amp;#xe607;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe608;</span>
+                <div class="name">delete_table</div>
+                <div class="code-name">&amp;#xe608;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe609;</span>
+                <div class="name">italic</div>
+                <div class="code-name">&amp;#xe609;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60a;</span>
+                <div class="name">add_col_before</div>
+                <div class="code-name">&amp;#xe60a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60b;</span>
+                <div class="name">bold</div>
+                <div class="code-name">&amp;#xe60b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60c;</span>
+                <div class="name">paragraph</div>
+                <div class="code-name">&amp;#xe60c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60d;</span>
+                <div class="name">quote</div>
+                <div class="code-name">&amp;#xe60d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60e;</span>
+                <div class="name">mention</div>
+                <div class="code-name">&amp;#xe60e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe60f;</span>
+                <div class="name">combine_cells</div>
+                <div class="code-name">&amp;#xe60f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe610;</span>
+                <div class="name">checklist</div>
+                <div class="code-name">&amp;#xe610;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe611;</span>
+                <div class="name">ol</div>
+                <div class="code-name">&amp;#xe611;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe612;</span>
+                <div class="name">strike</div>
+                <div class="code-name">&amp;#xe612;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe613;</span>
+                <div class="name">image</div>
+                <div class="code-name">&amp;#xe613;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe614;</span>
+                <div class="name">github</div>
+                <div class="code-name">&amp;#xe614;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe615;</span>
+                <div class="name">undo</div>
+                <div class="code-name">&amp;#xe615;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe616;</span>
+                <div class="name">underline</div>
+                <div class="code-name">&amp;#xe616;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe617;</span>
+                <div class="name">table</div>
+                <div class="code-name">&amp;#xe617;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe618;</span>
+                <div class="name">ul</div>
+                <div class="code-name">&amp;#xe618;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe619;</span>
+                <div class="name">link</div>
+                <div class="code-name">&amp;#xe619;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe61a;</span>
+                <div class="name">redo</div>
+                <div class="code-name">&amp;#xe61a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe61b;</span>
+                <div class="name">remove</div>
+                <div class="code-name">&amp;#xe61b;</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 icon_add_col_after"></span>
+            <div class="name">
+              add_col_after
+            </div>
+            <div class="code-name">.icon_add_col_after
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_add_row_after"></span>
+            <div class="name">
+              add_row_after
+            </div>
+            <div class="code-name">.icon_add_row_after
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_code"></span>
+            <div class="name">
+              code
+            </div>
+            <div class="code-name">.icon_code
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_delete_row"></span>
+            <div class="name">
+              delete_row
+            </div>
+            <div class="code-name">.icon_delete_row
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_delete_col"></span>
+            <div class="name">
+              delete_col
+            </div>
+            <div class="code-name">.icon_delete_col
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_add_row_before"></span>
+            <div class="name">
+              add_row_before
+            </div>
+            <div class="code-name">.icon_add_row_before
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_hr"></span>
+            <div class="name">
+              hr
+            </div>
+            <div class="code-name">.icon_hr
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_delete_table"></span>
+            <div class="name">
+              delete_table
+            </div>
+            <div class="code-name">.icon_delete_table
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_italic"></span>
+            <div class="name">
+              italic
+            </div>
+            <div class="code-name">.icon_italic
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_add_col_before"></span>
+            <div class="name">
+              add_col_before
+            </div>
+            <div class="code-name">.icon_add_col_before
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_bold"></span>
+            <div class="name">
+              bold
+            </div>
+            <div class="code-name">.icon_bold
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_paragraph"></span>
+            <div class="name">
+              paragraph
+            </div>
+            <div class="code-name">.icon_paragraph
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_quote"></span>
+            <div class="name">
+              quote
+            </div>
+            <div class="code-name">.icon_quote
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_mention"></span>
+            <div class="name">
+              mention
+            </div>
+            <div class="code-name">.icon_mention
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_combine_cells"></span>
+            <div class="name">
+              combine_cells
+            </div>
+            <div class="code-name">.icon_combine_cells
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_checklist"></span>
+            <div class="name">
+              checklist
+            </div>
+            <div class="code-name">.icon_checklist
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_ol"></span>
+            <div class="name">
+              ol
+            </div>
+            <div class="code-name">.icon_ol
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_strike"></span>
+            <div class="name">
+              strike
+            </div>
+            <div class="code-name">.icon_strike
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_image"></span>
+            <div class="name">
+              image
+            </div>
+            <div class="code-name">.icon_image
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_github"></span>
+            <div class="name">
+              github
+            </div>
+            <div class="code-name">.icon_github
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_undo"></span>
+            <div class="name">
+              undo
+            </div>
+            <div class="code-name">.icon_undo
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_underline"></span>
+            <div class="name">
+              underline
+            </div>
+            <div class="code-name">.icon_underline
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_table"></span>
+            <div class="name">
+              table
+            </div>
+            <div class="code-name">.icon_table
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_ul"></span>
+            <div class="name">
+              ul
+            </div>
+            <div class="code-name">.icon_ul
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_link"></span>
+            <div class="name">
+              link
+            </div>
+            <div class="code-name">.icon_link
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_redo"></span>
+            <div class="name">
+              redo
+            </div>
+            <div class="code-name">.icon_redo
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon_remove"></span>
+            <div class="name">
+              remove
+            </div>
+            <div class="code-name">.icon_remove
+            </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 icon_xxx"&gt;&lt;/span&gt;
+</code></pre>
+        <blockquote>
+          <p>"
+            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
+        </blockquote>
+      </div>
+      </div>
+      <div class="content symbol">
+          <ul class="icon_lists dib-box">
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_add_col_after"></use>
+                </svg>
+                <div class="name">add_col_after</div>
+                <div class="code-name">#icon_add_col_after</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_add_row_after"></use>
+                </svg>
+                <div class="name">add_row_after</div>
+                <div class="code-name">#icon_add_row_after</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_code"></use>
+                </svg>
+                <div class="name">code</div>
+                <div class="code-name">#icon_code</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_delete_row"></use>
+                </svg>
+                <div class="name">delete_row</div>
+                <div class="code-name">#icon_delete_row</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_delete_col"></use>
+                </svg>
+                <div class="name">delete_col</div>
+                <div class="code-name">#icon_delete_col</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_add_row_before"></use>
+                </svg>
+                <div class="name">add_row_before</div>
+                <div class="code-name">#icon_add_row_before</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_hr"></use>
+                </svg>
+                <div class="name">hr</div>
+                <div class="code-name">#icon_hr</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_delete_table"></use>
+                </svg>
+                <div class="name">delete_table</div>
+                <div class="code-name">#icon_delete_table</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_italic"></use>
+                </svg>
+                <div class="name">italic</div>
+                <div class="code-name">#icon_italic</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_add_col_before"></use>
+                </svg>
+                <div class="name">add_col_before</div>
+                <div class="code-name">#icon_add_col_before</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_bold"></use>
+                </svg>
+                <div class="name">bold</div>
+                <div class="code-name">#icon_bold</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_paragraph"></use>
+                </svg>
+                <div class="name">paragraph</div>
+                <div class="code-name">#icon_paragraph</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_quote"></use>
+                </svg>
+                <div class="name">quote</div>
+                <div class="code-name">#icon_quote</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_mention"></use>
+                </svg>
+                <div class="name">mention</div>
+                <div class="code-name">#icon_mention</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_combine_cells"></use>
+                </svg>
+                <div class="name">combine_cells</div>
+                <div class="code-name">#icon_combine_cells</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_checklist"></use>
+                </svg>
+                <div class="name">checklist</div>
+                <div class="code-name">#icon_checklist</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_ol"></use>
+                </svg>
+                <div class="name">ol</div>
+                <div class="code-name">#icon_ol</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_strike"></use>
+                </svg>
+                <div class="name">strike</div>
+                <div class="code-name">#icon_strike</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_image"></use>
+                </svg>
+                <div class="name">image</div>
+                <div class="code-name">#icon_image</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_github"></use>
+                </svg>
+                <div class="name">github</div>
+                <div class="code-name">#icon_github</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_undo"></use>
+                </svg>
+                <div class="name">undo</div>
+                <div class="code-name">#icon_undo</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_underline"></use>
+                </svg>
+                <div class="name">underline</div>
+                <div class="code-name">#icon_underline</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_table"></use>
+                </svg>
+                <div class="name">table</div>
+                <div class="code-name">#icon_table</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_ul"></use>
+                </svg>
+                <div class="name">ul</div>
+                <div class="code-name">#icon_ul</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_link"></use>
+                </svg>
+                <div class="name">link</div>
+                <div class="code-name">#icon_link</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_redo"></use>
+                </svg>
+                <div class="name">redo</div>
+                <div class="code-name">#icon_redo</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon_remove"></use>
+                </svg>
+                <div class="name">remove</div>
+                <div class="code-name">#icon_remove</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/editor/font/iconfont.json

@@ -0,0 +1,198 @@
+{
+  "id": "2370704",
+  "name": "editor",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon_",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "19895562",
+      "name": "add_col_after",
+      "font_class": "add_col_after",
+      "unicode": "e601",
+      "unicode_decimal": 58881
+    },
+    {
+      "icon_id": "19895563",
+      "name": "add_row_after",
+      "font_class": "add_row_after",
+      "unicode": "e602",
+      "unicode_decimal": 58882
+    },
+    {
+      "icon_id": "19895564",
+      "name": "code",
+      "font_class": "code",
+      "unicode": "e603",
+      "unicode_decimal": 58883
+    },
+    {
+      "icon_id": "19895565",
+      "name": "delete_row",
+      "font_class": "delete_row",
+      "unicode": "e604",
+      "unicode_decimal": 58884
+    },
+    {
+      "icon_id": "19895566",
+      "name": "delete_col",
+      "font_class": "delete_col",
+      "unicode": "e605",
+      "unicode_decimal": 58885
+    },
+    {
+      "icon_id": "19895567",
+      "name": "add_row_before",
+      "font_class": "add_row_before",
+      "unicode": "e606",
+      "unicode_decimal": 58886
+    },
+    {
+      "icon_id": "19895568",
+      "name": "hr",
+      "font_class": "hr",
+      "unicode": "e607",
+      "unicode_decimal": 58887
+    },
+    {
+      "icon_id": "19895569",
+      "name": "delete_table",
+      "font_class": "delete_table",
+      "unicode": "e608",
+      "unicode_decimal": 58888
+    },
+    {
+      "icon_id": "19895570",
+      "name": "italic",
+      "font_class": "italic",
+      "unicode": "e609",
+      "unicode_decimal": 58889
+    },
+    {
+      "icon_id": "19895571",
+      "name": "add_col_before",
+      "font_class": "add_col_before",
+      "unicode": "e60a",
+      "unicode_decimal": 58890
+    },
+    {
+      "icon_id": "19895572",
+      "name": "bold",
+      "font_class": "bold",
+      "unicode": "e60b",
+      "unicode_decimal": 58891
+    },
+    {
+      "icon_id": "19895573",
+      "name": "paragraph",
+      "font_class": "paragraph",
+      "unicode": "e60c",
+      "unicode_decimal": 58892
+    },
+    {
+      "icon_id": "19895574",
+      "name": "quote",
+      "font_class": "quote",
+      "unicode": "e60d",
+      "unicode_decimal": 58893
+    },
+    {
+      "icon_id": "19895575",
+      "name": "mention",
+      "font_class": "mention",
+      "unicode": "e60e",
+      "unicode_decimal": 58894
+    },
+    {
+      "icon_id": "19895576",
+      "name": "combine_cells",
+      "font_class": "combine_cells",
+      "unicode": "e60f",
+      "unicode_decimal": 58895
+    },
+    {
+      "icon_id": "19895577",
+      "name": "checklist",
+      "font_class": "checklist",
+      "unicode": "e610",
+      "unicode_decimal": 58896
+    },
+    {
+      "icon_id": "19895578",
+      "name": "ol",
+      "font_class": "ol",
+      "unicode": "e611",
+      "unicode_decimal": 58897
+    },
+    {
+      "icon_id": "19895579",
+      "name": "strike",
+      "font_class": "strike",
+      "unicode": "e612",
+      "unicode_decimal": 58898
+    },
+    {
+      "icon_id": "19895580",
+      "name": "image",
+      "font_class": "image",
+      "unicode": "e613",
+      "unicode_decimal": 58899
+    },
+    {
+      "icon_id": "19895581",
+      "name": "github",
+      "font_class": "github",
+      "unicode": "e614",
+      "unicode_decimal": 58900
+    },
+    {
+      "icon_id": "19895582",
+      "name": "undo",
+      "font_class": "undo",
+      "unicode": "e615",
+      "unicode_decimal": 58901
+    },
+    {
+      "icon_id": "19895583",
+      "name": "underline",
+      "font_class": "underline",
+      "unicode": "e616",
+      "unicode_decimal": 58902
+    },
+    {
+      "icon_id": "19895584",
+      "name": "table",
+      "font_class": "table",
+      "unicode": "e617",
+      "unicode_decimal": 58903
+    },
+    {
+      "icon_id": "19895585",
+      "name": "ul",
+      "font_class": "ul",
+      "unicode": "e618",
+      "unicode_decimal": 58904
+    },
+    {
+      "icon_id": "19895586",
+      "name": "link",
+      "font_class": "link",
+      "unicode": "e619",
+      "unicode_decimal": 58905
+    },
+    {
+      "icon_id": "19895587",
+      "name": "redo",
+      "font_class": "redo",
+      "unicode": "e61a",
+      "unicode_decimal": 58906
+    },
+    {
+      "icon_id": "19895588",
+      "name": "remove",
+      "font_class": "remove",
+      "unicode": "e61b",
+      "unicode_decimal": 58907
+    }
+  ]
+}

src/assets/editor/font/iconfont.svg

@@ -0,0 +1,107 @@
+<?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="add_col_after" unicode="&#58881;" d="M213.333333 298.666667a213.333333 213.333333 0 1 0 0-426.666667 213.333333 213.333333 0 0 0 0 426.666667z m106.666667-253.354667a39.978667 39.978667 0 1 1 0 80H266.666667a13.312 13.312 0 0 0-13.354667 13.354667V192a39.978667 39.978667 0 1 1-80 0v-53.333333c0-7.381333-5.973333-13.354667-13.312-13.354667H106.666667a39.978667 39.978667 0 1 1 0-80h53.333333c7.381333 0 13.354667-5.973333 13.354667-13.312v-53.333333a39.978667 39.978667 0 1 1 80 0v53.333333c0 7.381333 5.973333 13.354667 13.312 13.354667H320zM682.666667 85.333333a128 128 0 0 1 256 0V682.666667a128 128 0 0 1-256 0v-597.333334z m-85.333334 0V682.666667a213.333333 213.333333 0 0 0 426.666667 0v-597.333334a213.333333 213.333333 0 0 0-426.666667 0z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="add_row_after" unicode="&#58882;" d="M810.666667 896a213.333333 213.333333 0 1 0 0-426.666667 213.333333 213.333333 0 0 0 0 426.666667z m106.666666-253.354667a39.978667 39.978667 0 1 1 0 80h-53.333333a13.312 13.312 0 0 0-13.354667 13.354667V789.333333a39.978667 39.978667 0 1 1-80 0v-53.333333c0-7.381333-5.973333-13.354667-13.312-13.354667H704a39.978667 39.978667 0 1 1 0-80h53.333333c7.381333 0 13.354667-5.973333 13.354667-13.312V576a39.978667 39.978667 0 1 1 80 0V629.333333c0 7.381333 5.973333 13.354667 13.312 13.354667h53.333333zM213.333333 213.333333a128 128 0 0 1 0-256h597.333334a128 128 0 0 1 0 256H213.333333z m0 85.333334h597.333334a213.333333 213.333333 0 0 0 0-426.666667H213.333333a213.333333 213.333333 0 0 0 0 426.666667z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="code" unicode="&#58883;" d="M390.272-23.552a53.077333 53.077333 0 0 0-38.186667 16.128L35.84 317.397333a96.298667 96.298667 0 0 0 0 133.333334l316.245333 324.821333a53.333333 53.333333 0 0 0 76.416-74.410667l-294.4-302.208a21.333333 21.333333 0 0 1 0-29.866666l294.4-302.165334a53.333333 53.333333 0 0 0-38.4-90.538666zM633.770667-23.552a53.333333 53.333333 0 0 0-38.4 90.538667l294.4 302.208a21.333333 21.333333 0 0 1 0 29.866666l-294.4 302.165334a53.333333 53.333333 0 0 0 76.416 74.410666l316.202666-324.778666a96.298667 96.298667 0 0 0 0-133.333334l-316.245333-324.864a53.077333 53.077333 0 0 0-37.973333-16.213333z m277.930666 399.914667z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="delete_row" unicode="&#58884;" d="M565.546667 256a297.472 297.472 0 0 1-41.173334-85.333333H213.333333A213.333333 213.333333 0 0 0 213.333333 597.333333h597.333334a213.333333 213.333333 0 0 0 199.296-289.578666 299.093333 299.093333 0 0 1-74.24 48.896A128 128 0 0 1 810.666667 512H213.333333a128 128 0 0 1 0-256h352.213334zM810.666667 298.666667a213.333333 213.333333 0 1 0 0-426.666667 213.333333 213.333333 0 0 0 0 426.666667z m-106.666667-253.354667h213.333333a39.978667 39.978667 0 1 1 0 80h-213.333333a39.978667 39.978667 0 1 1 0-80z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="delete_col" unicode="&#58885;" d="M539.343266-39.71214a299.089969 299.089969 0 0 1 48.89545-74.239165A213.330933 213.330933 0 0 0 298.663307 85.342453V682.669067a213.330933 213.330933 0 1 0 426.661866 0v-311.036501a297.468653 297.468653 0 0 1-85.332373-41.17287V682.669067a127.99856 127.99856 0 0 1-255.99712 0v-597.326614a127.99856 127.99856 0 0 1 155.347586-125.054593zM810.657547 298.673387a213.330933 213.330933 0 1 0 0-426.661867 213.330933 213.330933 0 0 0 0 426.661867z m-106.665467-253.351817h213.330933a39.978217 39.978217 0 1 1 0 79.9991h-213.330933a39.978217 39.978217 0 1 1 0-79.9991z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="add_row_before" unicode="&#58886;" d="M810.666667 298.666667a213.333333 213.333333 0 1 0 0-426.666667 213.333333 213.333333 0 0 0 0 426.666667z m106.666666-253.354667a39.978667 39.978667 0 1 1 0 80h-53.333333a13.312 13.312 0 0 0-13.354667 13.354667V192a39.978667 39.978667 0 1 1-80 0v-53.333333c0-7.381333-5.973333-13.354667-13.312-13.354667H704a39.978667 39.978667 0 1 1 0-80h53.333333c7.381333 0 13.354667-5.973333 13.354667-13.312v-53.333333a39.978667 39.978667 0 1 1 80 0v53.333333c0 7.381333 5.973333 13.354667 13.312 13.354667h53.333333zM213.333333 810.666667a128 128 0 1 1 0-256h597.333334a128 128 0 0 1 0 256H213.333333z m0 85.333333h597.333334a213.333333 213.333333 0 0 0 0-426.666667H213.333333A213.333333 213.333333 0 1 0 213.333333 896z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="hr" unicode="&#58887;" d="M213.333333 341.333333a42.666667 42.666667 0 0 0 0 85.333334h597.333334a42.666667 42.666667 0 0 0 0-85.333334H213.333333z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="delete_table" unicode="&#58888;" d="M810.666667 298.666667a213.333333 213.333333 0 1 0 0-426.666667 213.333333 213.333333 0 0 0 0 426.666667z m-106.666667-253.354667h213.333333a39.978667 39.978667 0 1 1 0 80h-213.333333a39.978667 39.978667 0 1 1 0-80zM524.373333 170.666667H384v-213.333334h156.757333c15.189333-32 35.882667-60.842667 60.885334-85.333333H213.333333a213.333333 213.333333 0 0 0-213.333333 213.333333V682.666667a213.333333 213.333333 0 0 0 213.333333 213.333333h597.333334a213.333333 213.333333 0 0 0 213.333333-213.333333v-120.448a35.968 35.968 0 0 0 0-15.104V294.4a299.434667 299.434667 0 0 1-85.333333 60.885333V512h-213.333334v-140.373333a297.472 297.472 0 0 1-85.333333-41.173334V512H384v-256h181.546667a297.472 297.472 0 0 1-41.173334-85.333333zM725.333333 597.333333h213.333334V682.666667a128 128 0 0 1-128 128h-85.333334v-213.333334z m-85.333333 0V810.666667H384v-213.333334h256zM298.666667 810.666667H213.333333a128 128 0 0 1-128-128v-85.333334h213.333334V810.666667zM85.333333 512v-256h213.333334V512H85.333333z m0-341.333333v-85.333334a128 128 0 0 1 128-128h85.333334v213.333334H85.333333z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="italic" unicode="&#58889;" d="M960 885.418667h-325.845333a53.333333 53.333333 0 0 1 0-106.666667h46.336a10.666667 10.666667 0 0 0 9.002666-16.384L203.946667-0.725333a21.333333 21.333333 0 0 0-18.005334-9.856H64a53.333333 53.333333 0 0 1 0-106.666667h325.845333a53.333333 53.333333 0 0 1 0 106.666667H343.509333a10.666667 10.666667 0 0 0-9.002666 16.384L820.053333 768.853333a21.333333 21.333333 0 0 0 18.005334 9.898667H960a53.333333 53.333333 0 0 1 0 106.666667z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="add_col_before" unicode="&#58890;" d="M810.666667 298.666667a213.333333 213.333333 0 1 0 0-426.666667 213.333333 213.333333 0 0 0 0 426.666667z m106.666666-253.354667a39.978667 39.978667 0 1 1 0 80h-53.333333a13.312 13.312 0 0 0-13.354667 13.354667V192a39.978667 39.978667 0 1 1-80 0v-53.333333c0-7.381333-5.973333-13.354667-13.312-13.354667H704a39.978667 39.978667 0 1 1 0-80h53.333333c7.381333 0 13.354667-5.973333 13.354667-13.312v-53.333333a39.978667 39.978667 0 1 1 80 0v53.333333c0 7.381333 5.973333 13.354667 13.312 13.354667h53.333333zM85.333333 85.333333a128 128 0 0 1 256 0V682.666667a128 128 0 1 1-256 0v-597.333334z m-85.333333 0V682.666667a213.333333 213.333333 0 1 0 426.666667 0v-597.333334a213.333333 213.333333 0 0 0-426.666667 0z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="bold" unicode="&#58891;" d="M733.610667 428.288A267.562667 267.562667 0 0 1 548.010667 885.418667H183.466667a53.333333 53.333333 0 0 1 0-106.666667h43.221333a10.666667 10.666667 0 0 0 10.666667-10.666667V0a10.666667 10.666667 0 0 0-10.666667-10.666667H183.466667a53.333333 53.333333 0 1 1 0-106.666666h425.088a287.658667 287.658667 0 0 1 125.013333 545.536z m-185.6 350.464a160.512 160.512 0 0 0 0-320.981333H354.688a10.666667 10.666667 0 0 0-10.666667 10.666666V768a10.666667 10.666667 0 0 0 10.666667 10.666667z m60.586666-789.333333H354.688a10.666667 10.666667 0 0 0-10.666667 10.666666v340.352a10.666667 10.666667 0 0 0 10.666667 10.666667H608.597333a180.864 180.864 0 0 0 0-361.685333z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="paragraph" unicode="&#58892;" d="M960 885.418667H308.394667a297.685333 297.685333 0 1 1 0-595.370667h98.901333a10.666667 10.666667 0 0 0 10.666667-10.666667V-64a53.333333 53.333333 0 0 1 106.666666 0V768a10.666667 10.666667 0 0 0 10.666667 10.666667h157.098667a10.666667 10.666667 0 0 0 10.666666-10.666667v-832a53.333333 53.333333 0 0 1 106.666667 0V768a10.624 10.624 0 0 0 10.666667 10.666667H960a53.333333 53.333333 0 0 1 0 106.666666zM418.133333 407.381333a10.666667 10.666667 0 0 0-10.666666-10.666666H308.394667a191.018667 191.018667 0 1 0 0 382.037333h98.901333A10.666667 10.666667 0 0 0 418.133333 768z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="quote" unicode="&#58893;" d="M791.850667 728.234667a210.858667 210.858667 0 1 1 0-421.674667 196.650667 196.650667 0 0 1 47.573333 6.016 10.666667 10.666667 0 0 0 11.776-15.701333 291.413333 291.413333 0 0 0-250.794667-150.314667 53.333333 53.333333 0 0 1 0-106.666667 414.293333 414.293333 0 0 1 402.261334 424.533334V517.418667a211.072 211.072 0 0 1-210.816 210.816zM266.069333 728.234667a210.858667 210.858667 0 0 1 0-421.674667 196.266667 196.266667 0 0 1 47.573334 6.016 10.666667 10.666667 0 0 0 11.818666-15.701333 291.413333 291.413333 0 0 0-250.794666-150.314667 53.333333 53.333333 0 0 1 0-106.666667 414.336 414.336 0 0 1 402.261333 424.533334V517.418667a211.072 211.072 0 0 1-210.858667 210.816z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="mention" unicode="&#58894;" d="M512 874.666667A496.384 496.384 0 0 1 11.178667 384 496.384 496.384 0 0 1 512-106.666667a505.002667 505.002667 0 0 1 282.624 85.333334 53.333333 53.333333 0 1 1-59.434667 88.576A398.506667 398.506667 0 0 0 512 0a389.632 389.632 0 0 0-394.154667 384A389.632 389.632 0 0 0 512 768a389.632 389.632 0 0 0 394.154667-384v-38.016a82.901333 82.901333 0 0 0-165.717334 0V384A228.48 228.48 0 1 1 512 159.530667a229.376 229.376 0 0 1 164.736 69.717333 189.354667 189.354667 0 0 1 336.085333 116.736V384A496.384 496.384 0 0 1 512 874.666667z m0-608.469334A117.888 117.888 0 1 0 633.770667 384 119.978667 119.978667 0 0 0 512 266.197333z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="combine_cells" unicode="&#58895;" d="M85.333333 85.333333a128 128 0 0 1 128-128h597.333334a128 128 0 0 1 128 128V682.666667a128 128 0 0 1-128 128H213.333333a128 128 0 0 1-128-128v-597.333334z m-85.333333 0V682.666667a213.333333 213.333333 0 0 0 213.333333 213.333333h597.333334a213.333333 213.333333 0 0 0 213.333333-213.333333v-597.333334a213.333333 213.333333 0 0 0-213.333333-213.333333H213.333333a213.333333 213.333333 0 0 0-213.333333 213.333333z m512 384a42.666667 42.666667 0 0 0 42.666667-42.666666v-85.333334a42.666667 42.666667 0 0 0-85.333334 0v85.333334a42.666667 42.666667 0 0 0 42.666667 42.666666z m0-256a42.666667 42.666667 0 0 0 42.666667-42.666666v-128a42.666667 42.666667 0 0 0-85.333334 0v128a42.666667 42.666667 0 0 0 42.666667 42.666666z m0 554.666667a42.666667 42.666667 0 0 0 42.666667-42.666667v-128a42.666667 42.666667 0 0 0-85.333334 0V725.333333a42.666667 42.666667 0 0 0 42.666667 42.666667z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="checklist" unicode="&#58896;" d="M896 896H128a128 128 0 0 1-128-128v-768a128 128 0 0 1 128-128h768a128 128 0 0 1 128 128V768a128 128 0 0 1-128 128z m42.666667-896a42.666667 42.666667 0 0 0-42.666667-42.666667H128a42.666667 42.666667 0 0 0-42.666667 42.666667V768a42.666667 42.666667 0 0 0 42.666667 42.666667h768a42.666667 42.666667 0 0 0 42.666667-42.666667zM479.957333 704a53.376 53.376 0 0 1-74.666666-10.666667L314.24 571.733333l-20.565333 20.522667a53.333333 53.333333 0 0 1-75.392-75.264l64-64a53.845333 53.845333 0 0 1 80.384 5.717333l128 170.666667a53.333333 53.333333 0 0 1-10.709334 74.624zM479.957333 320a53.376 53.376 0 0 1-74.666666-10.666667L314.24 187.733333l-20.565333 20.522667a53.333333 53.333333 0 1 1-75.392-75.434667l64-64a53.973333 53.973333 0 0 1 80.384 5.888l128 170.666667a53.333333 53.333333 0 0 1-10.709334 74.624zM789.333333 565.376H597.333333a53.333333 53.333333 0 0 1 0-106.666667h192a53.333333 53.333333 0 0 1 0 106.666667zM789.333333 224.042667H597.333333a53.333333 53.333333 0 0 1 0-106.666667h192a53.333333 53.333333 0 1 1 0 106.666667z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="ol" unicode="&#58897;" d="M330.666667 704h640a42.666667 42.666667 0 0 1 0 85.333333h-640a42.666667 42.666667 0 0 1 0-85.333333zM970.666667 426.666667h-640a42.666667 42.666667 0 1 1 0-85.333334h640a42.666667 42.666667 0 0 1 0 85.333334zM970.666667 64h-640a42.666667 42.666667 0 0 1 0-85.333333h640a42.666667 42.666667 0 0 1 0 85.333333zM94.378667 160.085333a85.333333 85.333333 0 0 1-82.474667-63.317333 32 32 0 1 1 61.866667-16.469333 21.333333 21.333333 0 1 0 20.608-26.88 32 32 0 1 1 0-64 21.333333 21.333333 0 1 0-20.565334-27.093334 32 32 0 1 1-61.653333-17.066666 85.333333 85.333333 0 1 1 153.130667 70.314666 10.709333 10.709333 0 0 0 0 11.861334 85.333333 85.333333 0 0 1-70.912 132.736zM181.333333 437.418667a85.333333 85.333333 0 0 1-170.666666 0 32 32 0 0 1 64 0 21.333333 21.333333 0 0 0 42.666666 0 43.989333 43.989333 0 0 0-9.685333-27.52L17.664 297.429333A32 32 0 0 1 42.666667 245.418667h106.666666a32 32 0 0 1 0 64h-17.877333a10.624 10.624 0 0 0-8.32 17.322666L157.866667 369.92a108.544 108.544 0 0 1 23.466666 67.498667zM170.666667 672.085333h-10.666667A10.666667 10.666667 0 0 0 149.333333 682.666667V826.752A58.752 58.752 0 0 1 90.666667 885.418667H64a32 32 0 0 1 0-64h10.666667A10.666667 10.666667 0 0 0 85.333333 810.666667v-128a10.666667 10.666667 0 0 0-10.666666-10.666667H64a32 32 0 0 1 0-64H170.666667a32 32 0 0 1 0 64z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="strike" unicode="&#58898;" d="M1013.333333 343.381333A53.333333 53.333333 0 0 1 960 396.8h-381.269333a20.992 20.992 0 0 0-12.032 3.84c-30.805333 21.888-63.232 41.856-94.634667 61.098667-119.466667 73.173333-192 123.733333-192 207.488 0 95.36 94.165333 109.610667 150.314667 109.610666a193.706667 193.706667 0 0 0 131.456-32.597333 113.578667 113.578667 0 0 0 19.072-84.906667v-12.8a53.333333 53.333333 0 1 1 106.666666 0v11.434667a208.512 208.512 0 0 1-49.706666 161.152C595.157333 864.384 527.317333 885.418667 430.549333 885.418667c-156.074667 0-256.981333-84.864-256.981333-216.277334 0-118.314667 80.725333-192.512 170.666667-252.885333a10.666667 10.666667 0 0 0-5.930667-19.541333H64a53.333333 53.333333 0 0 1 0-106.666667h468.352a10.709333 10.709333 0 0 0 6.784-2.474667 185.130667 185.130667 0 0 0 82.432-147.882666c0-139.434667-146.176-150.272-191.018667-150.272-77.397333 0-133.930667 17.28-163.584 50.048a144.810667 144.810667 0 0 0-27.733333 115.2 53.333333 53.333333 0 0 1-106.154667 10.496A245.76 245.76 0 0 1 187.733333-32.128c51.2-56.490667 132.864-85.333333 242.688-85.333333 178.090667 0 297.685333 103.253333 297.685334 256.938666a258.517333 258.517333 0 0 1-36.224 134.272 10.666667 10.666667 0 0 0 9.216 16.085334H960a53.333333 53.333333 0 0 1 53.333333 53.546666z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="image" unicode="&#58899;" d="M416 629.461333m-96 0a96 96 0 1 1 192 0 96 96 0 1 1-192 0ZM721.749333 524.373333A43.818667 43.818667 0 0 1 682.666667 547.925333a42.965333 42.965333 0 0 1-38.058667-25.002666l-66.474667-146.517334a10.624 10.624 0 0 0-18.005333-2.261333l-34.986667 43.690667a42.666667 42.666667 0 0 1-34.688 16.042666 42.965333 42.965333 0 0 1-33.578666-18.176L323.84 225.706667a21.333333 21.333333 0 0 1 17.493333-33.706667h512a21.333333 21.333333 0 0 1 18.133334 10.112 21.333333 21.333333 0 0 1 0.938666 20.736zM938.666667 896H234.666667a85.333333 85.333333 0 0 1-85.333334-85.333333v-704a85.333333 85.333333 0 0 1 85.333334-85.333334H938.666667a85.333333 85.333333 0 0 1 85.333333 85.333334V810.666667a85.333333 85.333333 0 0 1-85.333333 85.333333z m-6.186667-783.104a21.333333 21.333333 0 0 0-15.104-6.229333H256a21.333333 21.333333 0 0 0-21.333333 21.333333V789.333333A21.333333 21.333333 0 0 0 256 810.666667h661.333333a21.333333 21.333333 0 0 0 21.333334-21.333334V128a21.333333 21.333333 0 0 0-6.186667-14.976zM832-42.666667h-725.333333a21.333333 21.333333 0 0 0-21.333334 21.333334v725.333333a42.666667 42.666667 0 0 1-85.333333 0V-42.666667a85.333333 85.333333 0 0 1 85.333333-85.333333h746.666667a42.666667 42.666667 0 0 1 0 85.333333z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="github" unicode="&#58900;" d="M511.957333 874.666667C241.024 874.666667 21.333333 655.018667 21.333333 384c0-216.832 140.544-400.725333 335.573334-465.664 24.490667-4.394667 32.256 10.069333 32.256 23.082667 0 11.690667 0.256 44.245333 0 85.205333-136.448-29.610667-164.736 64.64-164.736 64.64-22.314667 56.704-54.4 71.765333-54.4 71.765333-44.586667 30.464 3.285333 29.824 3.285333 29.824 49.194667-3.413333 75.178667-50.517333 75.178667-50.517333 43.776-75.008 114.816-53.333333 142.762666-40.789333 4.522667 31.658667 17.152 53.376 31.189334 65.536-108.970667 12.458667-223.488 54.485333-223.488 242.602666 0 53.546667 19.114667 97.322667 50.517333 131.669334-5.034667 12.330667-21.930667 62.293333 4.778667 129.834666 0 0 41.258667 13.184 134.912-50.346666a469.802667 469.802667 0 0 0 122.88 16.554666c41.642667-0.213333 83.626667-5.632 122.88-16.554666 93.653333 63.488 134.784 50.346667 134.784 50.346666 26.752-67.541333 9.898667-117.504 4.864-129.834666 31.402667-34.346667 50.474667-78.122667 50.474666-131.669334 0-188.586667-114.730667-230.016-224.042666-242.090666 17.578667-15.232 33.578667-44.672 33.578666-90.453334v-135.850666c0-13.141333 7.936-27.605333 32.853334-22.869334C862.250667-16.597333 1002.666667 167.253333 1002.666667 384 1002.666667 655.018667 783.018667 874.666667 511.957333 874.666667z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="undo" unicode="&#58901;" d="M758.869333 735.146667a535.125333 535.125333 0 0 1-553.173333 36.906666 10.624 10.624 0 0 0-12.458667 1.92L82.645333 884.522667A21.632 21.632 0 0 1 59.392 889.173333a21.333333 21.333333 0 0 1-13.141333-19.712v-285.866666a21.333333 21.333333 0 0 1 21.333333-21.333334h285.866667a21.333333 21.333333 0 0 1 15.104 36.437334L289.408 677.76a10.794667 10.794667 0 0 0-2.901333 9.728 10.624 10.624 0 0 0 6.485333 7.722667 426.666667 426.666667 0 0 0 403.882667-46.933334 416.384 416.384 0 0 0 4.010666-674.517333 53.333333 53.333333 0 0 1 62.848-86.016 517.205333 517.205333 0 0 1 213.888 425.002667 517.333333 517.333333 0 0 1-218.752 422.4z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="underline" unicode="&#58902;" d="M960-10.581333h-896a53.333333 53.333333 0 0 1 0-106.666667h896a53.333333 53.333333 0 0 1 0 106.666667zM84.394667 778.752h58.154666a10.666667 10.666667 0 0 0 10.666667-10.666667v-363.648a358.784 358.784 0 0 1 717.568 0V768a10.666667 10.666667 0 0 0 10.666667 10.666667h58.154666a53.333333 53.333333 0 0 1 0 106.666666H695.466667a53.333333 53.333333 0 0 1 0-106.666666h58.154666a10.666667 10.666667 0 0 0 10.666667-10.666667v-363.648a252.117333 252.117333 0 0 0-504.234667 0V768a10.666667 10.666667 0 0 0 10.666667 10.666667H328.533333a53.333333 53.333333 0 1 1 0 106.666666H84.394667a53.333333 53.333333 0 0 1 0-106.666666z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="table" unicode="&#58903;" d="M725.333333 170.666667v-213.333334h85.333334a128 128 0 0 1 128 128v85.333334h-213.333334z m-85.333333 0H384v-213.333334h256v213.333334z m85.333333 85.333333h213.333334V512h-213.333334v-256z m-85.333333 0V512H384v-256h256z m85.333333 341.333333h213.333334V682.666667a128 128 0 0 1-128 128h-85.333334v-213.333334z m-85.333333 0V810.666667H384v-213.333334h256z m384-391.552V85.333333a213.333333 213.333333 0 0 0-213.333333-213.333333H213.333333a213.333333 213.333333 0 0 0-213.333333 213.333333V682.666667a213.333333 213.333333 0 0 0 213.333333 213.333333h597.333334a213.333333 213.333333 0 0 0 213.333333-213.333333v-120.448a35.968 35.968 0 0 0 0-15.104v-326.229334a35.968 35.968 0 0 0 0-15.104zM298.666667 810.666667H213.333333a128 128 0 0 1-128-128v-85.333334h213.333334V810.666667zM85.333333 512v-256h213.333334V512H85.333333z m0-341.333333v-85.333334a128 128 0 0 1 128-128h85.333334v213.333334H85.333333z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="ul" unicode="&#58904;" d="M106.666667 725.418667m-106.666667 0a106.666667 106.666667 0 1 1 213.333333 0 106.666667 106.666667 0 1 1-213.333333 0ZM362.666667 682.666667H981.333333a42.666667 42.666667 0 0 1 0 85.333333H362.666667a42.666667 42.666667 0 0 1 0-85.333333zM106.666667 384.085333m-106.666667 0a106.666667 106.666667 0 1 1 213.333333 0 106.666667 106.666667 0 1 1-213.333333 0ZM981.333333 426.666667H362.666667a42.666667 42.666667 0 0 1 0-85.333334H981.333333a42.666667 42.666667 0 0 1 0 85.333334zM106.666667 42.752m-106.666667 0a106.666667 106.666667 0 1 1 213.333333 0 106.666667 106.666667 0 1 1-213.333333 0ZM981.333333 85.333333H362.666667a42.666667 42.666667 0 0 1 0-85.333333H981.333333a42.666667 42.666667 0 0 1 0 85.333333z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="link" unicode="&#58905;" d="M529.322667 260.053333a42.666667 42.666667 0 0 1-23.168-55.765333 42.666667 42.666667 0 0 0-9.258667-46.506667l-120.661333-120.704a85.333333 85.333333 0 0 0-120.661334 0L165.034667 127.573333a85.333333 85.333333 0 0 0 0 120.704L285.866667 368.938667a43.221333 43.221333 0 0 0 46.549333 9.258666 42.666667 42.666667 0 0 1 32.554667 78.890667 129.450667 129.450667 0 0 1-139.434667-27.818667l-120.832-120.661333a170.922667 170.922667 0 0 1 0-241.365333l90.538667-90.496a170.666667 170.666667 0 0 1 241.322666 0l120.704 120.661333a128.341333 128.341333 0 0 1 27.776 139.52 42.666667 42.666667 0 0 1-55.722666 23.125333zM330.965333 203.050667a43.136 43.136 0 0 1 60.330667 0l331.904 331.861333a42.666667 42.666667 0 0 1-60.330667 60.330667l-331.904-331.861334a42.666667 42.666667 0 0 1 0-60.330666zM919.296 700.842667l-90.496 90.496a170.922667 170.922667 0 0 1-241.365333 0l-120.704-120.661334a128.256 128.256 0 0 1-27.776-139.477333 42.666667 42.666667 0 1 1 78.890666 32.597333 42.666667 42.666667 0 0 0 9.258667 46.336l120.661333 120.661334a85.333333 85.333333 0 0 0 120.704 0l90.496-90.496a85.333333 85.333333 0 0 0 0-120.704L738.133333 399.146667a43.306667 43.306667 0 0 0-46.549333-9.258667 42.666667 42.666667 0 0 1-32.64-78.890667 129.109333 129.109333 0 0 1 139.52 27.776l120.661333 120.661334a170.965333 170.965333 0 0 1 0.170667 241.408z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="redo" unicode="&#58906;" d="M964.608 889.130667a21.333333 21.333333 0 0 1-23.253333-4.608L830.805333 773.973333a10.666667 10.666667 0 0 0-12.458666-1.92 534.912 534.912 0 0 1-553.216-36.906666A523.050667 523.050667 0 0 1 260.266667-112.298667a53.333333 53.333333 0 0 1 62.976 86.101334 416.384 416.384 0 0 0 3.882666 674.517333 426.666667 426.666667 0 0 0 403.882667 46.933333 10.666667 10.666667 0 0 0 3.584-17.450666l-78.933333-78.933334a21.333333 21.333333 0 0 1 15.104-36.394666h285.866666a21.333333 21.333333 0 0 1 21.333334 21.333333V869.418667a21.333333 21.333333 0 0 1-13.354667 19.712z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="remove" unicode="&#58907;" d="M874.154197 745.883125A511.970373 511.970373 0 1 1 1023.993986 384.008313a511.927744 511.927744 0 0 1-149.839789 361.874812z m-75.324866-648.382129A405.398688 405.398688 0 1 0 917.422301 384.008313a405.313431 405.313431 0 0 0-118.59297-286.507317zM725.039096 596.725395a54.351559 54.351559 0 0 1-76.731613 0l-135.431297-135.431297L377.274375 596.725395a54.436817 54.436817 0 0 1-76.944756-76.987385l135.388668-135.431297-135.388668-135.473925a54.436817 54.436817 0 0 1 76.944756-76.987385l135.388668 135.431297 135.431297-135.473926a54.436817 54.436817 0 0 1 76.731613 76.987385l-135.388668 135.473926 135.388668 135.431296a54.479445 54.479445 0 0 1 0.213143 77.030014z"  horiz-adv-x="1024" />
+
+    
+
+
+  </font>
+</defs></svg>

src/assets/font/iconfont.css

@@ -0,0 +1,25 @@
+@font-face {font-family: "iconfont";
+  src: url('iconfont.eot?t=1602233339904'); /* IE9 */
+  src: url('iconfont.eot?t=1602233339904#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAALAAAsAAAAABqgAAAJxAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCfgqBDIEYATYCJAMMCwgABCAFhG0HQhviBRHVkxVkXyZwmyZ82vMwUq3ar2VU0RnKvCUqpq5x5GwTV+HgmXj42u/13N19PxtCh6QyUcQ2KioFVVYVBtmo2gpZoSoUOiChGwA5wVPvw9/s9QNdKGXhwrVx4dDSeXd6WzQsvmnwX06rTo1BmE75dvrpOyDZ9Ci/cuQNsR+quvf5xL3TPwooi+YDynENWmPhpy7ALgwooLE2RVZEEbfILuJOXMRxAh3GrIjDY0VFVaBxgbh1PbRRC35FMVJVaDUsLeItGjU9Iztvou/Hn9WoJE2Gpp5ekT3sfsf3YO/S5pwTCBDk1Q0yVlCIs8b4qSwMTtYRL2bYV7/ge1D6HTeKvXIT8deR4i6wICcS31GNW5PKKySQQauYnMOqwh66IcSgdGNunx2nDg2vjZfbfDqmBtZHL9Z2E/Tpeh6WQ90F1V4329d1Y55KjZJWcGdSNVym/kx6Q3JIr0gmEKx/+79MutYFfHonHekLuK6ewhH8LimwrvhyZMjFlVBJ6MwGAdaEXNKB/8g94Ot43TC4nFANj3C2Gc2QVTNkYa+g0WkNLdUOOiw7Wd1p0G1ZlHYseSQh9HmPpMcHZH0+koX9BY0R/9DSFxkdzsKWnebC9uYoOCmuMP/BL1yImNTEpTe07zRJXh7xXii7D8HQ9uXUFQvKHDP2jx1VCUg4w0U6DVNi2IQDLto61e3QddT0pnbhXBkcBSfFFeY/+IUL8eZqKp+/oX2nSToYPfEXyu47h6HtAeRVU0CMe3ll/9hRlYCEM1ykQZgSw9Y8KOCirRsR3Q4dbkRQTbu+Ln/fNugAOiozKXIUxhbhb5OQtE5zxVunVQUAAAA=') format('woff2'),
+  url('iconfont.woff?t=1602233339904') format('woff'),
+  url('iconfont.ttf?t=1602233339904') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
+  url('iconfont.svg?t=1602233339904#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;
+}
+
+.icon-arrow-left:before {
+  content: "\e600";
+}
+
+.icon-arrow-right:before {
+  content: "\e601";
+}
+

src/assets/font/iconfont.json

@@ -0,0 +1,23 @@
+{
+  "id": "2118355",
+  "name": "oss-console",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon-",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "13319420",
+      "name": "Icon - Keyboard Arrow - Down - Rounded",
+      "font_class": "arrow-left",
+      "unicode": "e600",
+      "unicode_decimal": 58880
+    },
+    {
+      "icon_id": "15657637",
+      "name": "Icon - Keyboard Arrow - Down - Rounded",
+      "font_class": "arrow-right",
+      "unicode": "e601",
+      "unicode_decimal": 58881
+    }
+  ]
+}

src/assets/font/iconfont.svg

@@ -0,0 +1,32 @@
+<?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="arrow-left" unicode="&#58880;" d="M640 221.866667l-166.4 166.4L640 554.666667a41.258667 41.258667 0 0 1 0 59.733333 41.258667 41.258667 0 0 1-59.733333 0l-196.266667-196.266667a41.258667 41.258667 0 0 1 0-59.733333l196.266667-196.266667A42.24 42.24 0 1 1 640 221.866667z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-right" unicode="&#58881;" d="M384 546.133333l166.4-166.4L384 213.33333300000004a41.258667 41.258667 0 0 1 0-59.733333 41.258667 41.258667 0 0 1 59.733333 0l196.266667 196.266667a41.258667 41.258667 0 0 1 0 59.733333l-196.266667 196.266667A42.24 42.24 0 1 1 384 546.133333z"  horiz-adv-x="1024" />
+
+    
+
+
+  </font>
+</defs></svg>

src/assets/icons/iconfont.css

@@ -0,0 +1,33 @@
+
+@font-face {font-family: "iconfont";
+  src: url('iconfont.eot?t=1530874958372'); /* IE9*/
+  src: url('iconfont.eot?t=1530874958372#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAAjEAAsAAAAADmwAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFZW8UnVY21hcAAAAYAAAACeAAACID1NtZpnbHlmAAACIAAABFoAAAdYtnrc/mhlYWQAAAZ8AAAAMQAAADYR6R6WaGhlYQAABrAAAAAgAAAAJAfdA4tobXR4AAAG0AAAABkAAAAoJ+n//2xvY2EAAAbsAAAAFgAAABYKcgh8bWF4cAAABwQAAAAdAAAAIAEbAG5uYW1lAAAHJAAAAUUAAAJtPlT+fXBvc3QAAAhsAAAAVwAAAG1+6rtfeJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2Bk/sc4gYGVgYOpk+kMAwNDP4RmfM1gxMjBwMDEwMrMgBUEpLmmMDgwVDx/ytzwv4EhhrmBoRkozAiSAwA2fA1beJzFkTsOwjAQRJ/JB4woKDgGp6NKgaJIuQcVN8lNIsV7jDDOpiFKDWM9Sx7Lu9YsUAGFuIsSwptA1ktuWPyC8+KXPHS+cZVT0iRStNY6622w0aZ51u2+u1VQle3K7kF1K2qO6nAiyqp3Xv9I4X+tv3VZ9ud6Uio0K/piwlF2St7Jc7TWyfO1zlGyWO8oY2xw8vxtdJQ7NjnED8roN6wAAHictVTNbxtFFJ+3u7O7cex1vZ/xx/rbu27cbJzdtdeqg5OapkmBVglJJBwSpAhVtSrBCdEeoDISqBEgvnpBSIWqICGVP6FVKUgoN5RDJaSAVKFy48KRQ+wwayeQFMEhiN3Z997szDz9fu83MwgjtPszfZceQRIqogl0Gs0jBGwJsgKlQ8Z0LaoESgYrmizQZs7McLmsRT8BWpaVVbvqGhrLsWEQIAlOxq6aFmVCxW1QdbBVHSAajy2KhYRIfwCBETP5Vu8p6hYoqVwi3BjrnT0xJdtpib8cFMWoKL7LsxjzFMWEBXhJU4fwUIDtfYHDMeVu6jiVgmDUjD3TCqXj4vqG+7Je0IYAOh2Q4mnhy6lILELaazFVEqPcsRA/Egvl8jJc/mV4RArqxiNEHry7u/spg+gXUQFV0Sx6Dq0TrjKnKrJAZS2q4nqGj92xVa0BfePYSQrsBkXKQAoi/1sH26rMZg23yiDLmn/nzoM7by9YVmJ8Ol+a06wL7QvWyGypMDWe2Pk+EBE4TohIYojnQyLUK2tnisUza5cGDi4GxBDHhUQpIvC8EOn9UKzV5ms16qtZp9Vev311bu7q7fV2y5k1mk6ikIpIUiRVSDjNXl0plL1yXlHyxBWU3oP42OTM5Fh8z8GJw+NpWZckXUYU2QMdUpcOGkaKrz7iVKRVkWcg2uFMJ5LztByFtnsPMYbM9jZkMO49/GS605n2P7pDetsHRrszRJZOp+PXHEju1+mfSO4mQhKrcgJwrKqpVU31X9bvNKCiOp5me5rqNcC0wGyAV92Pq4ZvSSMrBbhOM0A3FAkSeomhsVKkRhW5vvbqIs+EglSgXnn2TV0MO5COBtiJeFCWNA8oCoYUoL/98KNvaDgGv/K6EVpwneeVYIsZDtbGcCyVX2CYCQbIk0kwkbl0MgX5WhqvBPnz556uB5NFHOWYG1sMs3UjwPi8OMLrPn2fnibxEAqQ05NCNXSOEM4lwT8XWRb/GdEEehIIT88CiVDO+nQM1/Np2hoZUWWOLZBJsuZUvf7WU0lUsQDmyxAvxkmD9/ejN+51Me7e69uzbnPm45knLyZ0PdH+K+x912xhvswBUzlfYYAr87gFP8r+6rg8cLCwn4PYbsPRD2cYhF9Ty6c4ANawbYMF4E4t/zP30/+Bu5lhOUXVMlWvYhyR8ue9LYKUA0IajkL1M1IlP0GZ+x+0NXMs2btZwzRIpAymu0cleljWJlH6SNIeVJXyde7fA7/TGzRP7scJn21fFIezIDe44sh1V3EN0/P/EqlcAwZnlRASgL60gwHwzU2jVT7ZXiyVFtuvEJfUNwHXMER6mZUrFHVlpW9pvv9zU0/uTSPuZLllbN70c+yEIt3J/anEEh18bL/R12kJHUcVgs00wv2PTcHf8WnqFFTHiQCH8L03yrKrSywuMczyxuMgry2x7CjDLK0y3d4BnNQjMnttmWHI2qVrj6Pd2BtYZbsvHIb7B37maBAAAHicY2BkYGAA4sCb7Pfj+W2+MnCzMIDA9dRcPxj9////WhYG5gYgl4OBCSQKAED2C7oAAAB4nGNgZGBgbvjfwBDDwvD/PwMDCwMDUAQFcAEAdeEEcXicY2FgYGB+ycDAwvD/PwsDiMaOAV4UAw8AAAAAAAAAAHYBAgEwAZwCGgKKAwYDVAOsAAB4nGNgZGBg4GJIYmBnAAEmMI8LSP4H8xkAE4sBigAAAHicZY9NTsMwEIVf+gekEqqoYIfkBWIBKP0Rq25YVGr3XXTfpk6bKokjx63UA3AejsAJOALcgDvwSCebNpbH37x5Y08A3OAHHo7fLfeRPVwyO3INF7gXrlN/EG6QX4SbaONVuEX9TdjHM6bCbXRheYPXuGL2hHdhDx18CNdwjU/hOvUv4Qb5W7iJO/wKt9Dx6sI+5l5XuI1HL/bHVi+cXqnlQcWhySKTOb+CmV7vkoWt0uqca1vEJlODoF9JU51pW91T7NdD5yIVWZOqCas6SYzKrdnq0AUb5/JRrxeJHoQm5Vhj/rbGAo5xBYUlDowxQhhkiMro6DtVZvSvsUPCXntWPc3ndFsU1P9zhQEC9M9cU7qy0nk6T4E9XxtSdXQrbsuelDSRXs1JErJCXta2VELqATZlV44RelzRiT8oZ0j/AAlabsgAAAB4nG3ESQqAMBAEwOksLvHgS3xUlBEDWUgiKr5ewat1KBL0MfTPQEBCQaNBiw49DAbCpWa2ZSxc3c3TwWV3i/UiZ72WdEYZeNM1OM8y2KjP9E70ABXpEngA') format('woff'),
+  url('iconfont.ttf?t=1530874958372') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
+  url('iconfont.svg?t=1530874958372#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;
+}
+
+.icon-bear:before { content: "\e600"; }
+
+.icon-resize-vertical:before { content: "\e7c3"; }
+
+.icon-qq:before { content: "\e609"; }
+
+.icon-frown:before { content: "\e77e"; }
+
+.icon-meh:before { content: "\e780"; }
+
+.icon-smile:before { content: "\e783"; }
+
+.icon-man:before { content: "\e7e2"; }
+
+.icon-woman:before { content: "\e7e5"; }
+

src/assets/icons/iconfont.svg

@@ -0,0 +1,57 @@
+<?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="x" unicode="x" horiz-adv-x="1001"
+d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
+t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
+t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
+    
+
+    
+    <glyph glyph-name="bear" unicode="&#58880;" d="M1024 683.008q0-70.656-46.08-121.856 46.08-89.088 46.08-193.536 0-96.256-39.936-181.248t-109.568-147.968-162.816-99.328-199.68-36.352-199.68 36.352-162.304 99.328-109.568 147.968-40.448 181.248q0 104.448 46.08 193.536-46.08 51.2-46.08 121.856 0 37.888 13.824 71.168t37.376 58.368 55.808 39.424 68.096 14.336q43.008 0 78.848-18.432t59.392-50.176q46.08 17.408 96.256 26.624t102.4 9.216 102.4-9.216 96.256-26.624q24.576 31.744 59.904 50.176t78.336 18.432q36.864 0 68.608-14.336t55.296-39.424 37.376-58.368 13.824-71.168zM205.824 268.288q10.24 0 18.944 10.24t15.36 28.672 10.24 42.496 3.584 51.712-3.584 51.712-10.24 41.984-15.36 28.16-18.944 10.24q-9.216 0-17.92-10.24t-15.36-28.16-10.752-41.984-4.096-51.712 4.096-51.712 10.752-42.496 15.36-28.672 17.92-10.24zM512-31.744000000000028q53.248 0 99.84 13.312t81.408 35.84 54.784 52.736 19.968 65.024q0 33.792-19.968 64t-54.784 52.736-81.408 35.84-99.84 13.312-99.84-13.312-81.408-35.84-54.784-52.736-19.968-64q0-34.816 19.968-65.024t54.784-52.736 81.408-35.84 99.84-13.312zM818.176 268.288q10.24 0 18.944 10.24t15.36 28.672 10.24 42.496 3.584 51.712-3.584 51.712-10.24 41.984-15.36 28.16-18.944 10.24q-9.216 0-17.92-10.24t-15.36-28.16-10.752-41.984-4.096-51.712 4.096-51.712 10.752-42.496 15.36-28.672 17.92-10.24zM512 235.51999999999998q39.936 0 68.096-9.728t28.16-24.064-28.16-24.064-68.096-9.728-68.096 9.728-28.16 24.064 28.16 24.064 68.096 9.728z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="resize-vertical" unicode="&#59331;" d="M512 896C229.248 896 0 666.752 0 384s229.248-512 512-512 512 229.248 512 512S794.752 896 512 896zM576 192l64 0-128-128-128 128 64 0L448 576l-64 0 128 128 128-128-64 0L576 192z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="qq" unicode="&#58889;" d="M147.372058 491.394284c-5.28997-13.909921 2.431986-22.698872 0-75.732573-0.682996-14.25092-62.165649-78.762555-86.569511-145.791177-24.192863-66.517625-27.519845-135.978232 9.811944-163.285078 37.419789-27.305846 72.191593 90.879487 76.757567 73.685584 1.961989-7.509958 4.436975-15.317914 7.423958-23.338868a331.945126 331.945126 0 0 1 61.140655-101.162429c5.929967-6.783962-36.009797-19.199892-61.140655-61.99365-25.173858-42.751759 7.209959-120.49032 132.223254-120.49032 161.27909 0 197.288886 56.70368 200.574868 56.447681 12.031932-0.895995 12.841928 0 25.599855 0 15.572912 0 9.129948-1.279993 23.593867 0 7.807956 0.682996 86.186514-67.839617 194.686901-56.447681 184.873956 19.45589 156.586116 81.40754 142.079198 120.48932-15.103915 40.83277-68.692612 59.946662-66.303626 62.549647 44.28775 48.938724 51.285711 79.018554 66.346626 123.9463 6.143965 18.473896 49.066723-101.674426 82.089537-73.685584 13.781922 11.690934 41.301767 60.24566 13.781922 163.285078-27.519845 102.996419-80.767544 126.505286-79.615551 145.791177 2.389987 40.191773 1.023994 68.436614-1.023994 75.732573-9.812945 35.4128-30.378829 27.604844-30.378829 35.4128C858.450044 730.752933 705.10691 896 515.966978 896s-342.398067-165.289067-342.398068-369.192916c0-16.169909-14.378919-4.223976-26.154852-35.4128z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="frown" unicode="&#59262;" d="M336 475m-48 0a48 48 0 1 1 96 0 48 48 0 1 1-96 0ZM688 475m-48 0a48 48 0 1 1 96 0 48 48 0 1 1-96 0ZM512 832C264.6 832 64 631.4 64 384s200.6-448 448-448 448 200.6 448 448S759.4 832 512 832z m263-711c-34.2-34.2-74-61-118.3-79.8C611 21.8 562.3 12 512 12c-50.3 0-99 9.8-144.8 29.2-44.3 18.7-84.1 45.6-118.3 79.8-34.2 34.2-61 74-79.8 118.3C149.8 285 140 333.7 140 384s9.8 99 29.2 144.8c18.7 44.3 45.6 84.1 79.8 118.3 34.2 34.2 74 61 118.3 79.8C413 746.2 461.7 756 512 756c50.3 0 99-9.8 144.8-29.2 44.3-18.7 84.1-45.6 118.3-79.8 34.2-34.2 61-74 79.8-118.3C874.2 483 884 434.3 884 384s-9.8-99-29.2-144.8c-18.7-44.3-45.6-84.1-79.8-118.2zM512 363c-85.5 0-155.6-67.3-160-151.6-0.2-4.6 3.4-8.4 8-8.4h48.1c4.2 0 7.8 3.2 8.1 7.4C420 259.9 461.5 299 512 299s92.1-39.1 95.8-88.6c0.3-4.2 3.9-7.4 8.1-7.4H664c4.6 0 8.2 3.8 8 8.4-4.4 84.3-74.5 151.6-160 151.6z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="meh" unicode="&#59264;" d="M336 475m-48 0a48 48 0 1 1 96 0 48 48 0 1 1-96 0ZM688 475m-48 0a48 48 0 1 1 96 0 48 48 0 1 1-96 0ZM512 832C264.6 832 64 631.4 64 384s200.6-448 448-448 448 200.6 448 448S759.4 832 512 832z m263-711c-34.2-34.2-74-61-118.3-79.8C611 21.8 562.3 12 512 12c-50.3 0-99 9.8-144.8 29.2-44.3 18.7-84.1 45.6-118.3 79.8-34.2 34.2-61 74-79.8 118.3C149.8 285 140 333.7 140 384s9.8 99 29.2 144.8c18.7 44.3 45.6 84.1 79.8 118.3 34.2 34.2 74 61 118.3 79.8C413 746.2 461.7 756 512 756c50.3 0 99-9.8 144.8-29.2 44.3-18.7 84.1-45.6 118.3-79.8 34.2-34.2 61-74 79.8-118.3C874.2 483 884 434.3 884 384s-9.8-99-29.2-144.8c-18.7-44.3-45.6-84.1-79.8-118.2zM664 331H360c-4.4 0-8-3.6-8-8v-48c0-4.4 3.6-8 8-8h304c4.4 0 8 3.6 8 8v48c0 4.4-3.6 8-8 8z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="smile" unicode="&#59267;" d="M336 475m-48 0a48 48 0 1 1 96 0 48 48 0 1 1-96 0ZM688 475m-48 0a48 48 0 1 1 96 0 48 48 0 1 1-96 0ZM512 832C264.6 832 64 631.4 64 384s200.6-448 448-448 448 200.6 448 448S759.4 832 512 832z m263-711c-34.2-34.2-74-61-118.3-79.8C611 21.8 562.3 12 512 12c-50.3 0-99 9.8-144.8 29.2-44.3 18.7-84.1 45.6-118.3 79.8-34.2 34.2-61 74-79.8 118.3C149.8 285 140 333.7 140 384s9.8 99 29.2 144.8c18.7 44.3 45.6 84.1 79.8 118.3 34.2 34.2 74 61 118.3 79.8C413 746.2 461.7 756 512 756c50.3 0 99-9.8 144.8-29.2 44.3-18.7 84.1-45.6 118.3-79.8 34.2-34.2 61-74 79.8-118.3C874.2 483 884 434.3 884 384s-9.8-99-29.2-144.8c-18.7-44.3-45.6-84.1-79.8-118.2zM664 363h-48.1c-4.2 0-7.8-3.2-8.1-7.4C604 306.1 562.5 267 512 267s-92.1 39.1-95.8 88.6c-0.3 4.2-3.9 7.4-8.1 7.4H360c-4.6 0-8.2-3.8-8-8.4 4.4-84.3 74.5-151.6 160-151.6s155.6 67.3 160 151.6c0.2 4.6-3.4 8.4-8 8.4z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="man" unicode="&#59362;" d="M874 776H622c-3.3 0-6-2.7-6-6v-56c0-3.3 2.7-6 6-6h160.4L583.1 508.7c-50 38.5-111 59.3-175.1 59.3-76.9 0-149.3-30-203.6-84.4S120 356.9 120 280s30-149.3 84.4-203.6C258.7 22 331.1-8 408-8s149.3 30 203.6 84.4C666 130.7 696 203.1 696 280c0 64.1-20.8 124.9-59.2 174.9L836 654.1V494c0-3.3 2.7-6 6-6h56c3.3 0 6 2.7 6 6V746c0 16.5-13.5 30-30 30zM408 68c-116.9 0-212 95.1-212 212s95.1 212 212 212 212-95.1 212-212-95.1-212-212-212z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="woman" unicode="&#59365;" d="M909.7 739.4l-42.2 42.2c-3.1 3.1-8.2 3.1-11.3 0L764 689.4l-84.2 84.2c-3.1 3.1-8.2 3.1-11.3 0l-42.1-42.1c-3.1-3.1-3.1-8.1 0-11.3l84.2-84.2-135.5-135.3c-50 38.5-111 59.3-175.1 59.3-76.9 0-149.3-30-203.6-84.4S112 348.9 112 272s30-149.3 84.4-203.6C250.7 14 323.1-16 400-16s149.3 30 203.6 84.4C658 122.7 688 195.1 688 272c0 64.2-20.9 125.1-59.3 175.1l135.4 135.4 84.2-84.2c3.1-3.1 8.2-3.1 11.3 0l42.1 42.1c3.1 3.1 3.1 8.1 0 11.3l-84.2 84.2 92.2 92.2c3.1 3.1 3.1 8.2 0 11.3zM400 60c-116.9 0-212 95.1-212 212s95.1 212 212 212 212-95.1 212-212-95.1-212-212-212z"  horiz-adv-x="1024" />
+
+    
+
+
+  </font>
+</defs></svg>

src/components/charts/bar.vue

@@ -0,0 +1,49 @@
+<template>
+  <div ref="dom" class="charts chart-bar"></div>
+</template>
+
+<script>
+import echarts from 'echarts'
+import tdTheme from './theme.json'
+echarts.registerTheme('tdTheme', tdTheme)
+export default {
+  name: 'ChartBar',
+  props: {
+    value: Object,
+    text: String,
+    subtext: String
+  },
+  mounted () {
+    this.$nextTick(() => {
+      let xAxisData = Object.keys(this.value)
+      let seriesData = Object.values(this.value)
+      let option = {
+        title: {
+          text: this.text,
+          subtext: this.subtext,
+          x: 'center'
+        },
+        xAxis: {
+          type: 'category',
+          data: xAxisData
+        },
+        yAxis: {
+          type: 'value'
+        },
+        series: [{
+          data: seriesData,
+          type: 'bar'
+        }]
+      }
+      let dom = echarts.init(this.$refs.dom, 'tdTheme')
+      dom.setOption(option)
+    })
+  }
+}
+</script>
+
+<style lang="less">
+.charts{
+  //
+}
+</style>

src/components/charts/index.js

@@ -0,0 +1,3 @@
+import ChartPie from './pie.vue'
+import ChartBar from './bar.vue'
+export { ChartPie, ChartBar }

src/components/charts/pie.vue

@@ -0,0 +1,61 @@
+<template>
+  <div ref="dom" class="charts chart-pie"></div>
+</template>
+
+<script>
+import echarts from 'echarts'
+import tdTheme from './theme.json'
+echarts.registerTheme('tdTheme', tdTheme)
+export default {
+  name: 'ChartPie',
+  props: {
+    value: Array,
+    text: String,
+    subtext: String
+  },
+  mounted () {
+    this.$nextTick(() => {
+      let legend = this.value.map(_ => _.name)
+      let option = {
+        title: {
+          text: this.text,
+          subtext: this.subtext,
+          x: 'center'
+        },
+        tooltip: {
+          trigger: 'item',
+          formatter: '{a} <br/>{b} : {c} ({d}%)'
+        },
+        legend: {
+          orient: 'vertical',
+          left: 'left',
+          data: legend
+        },
+        series: [
+          {
+            type: 'pie',
+            radius: '55%',
+            center: ['50%', '60%'],
+            data: this.value,
+            itemStyle: {
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      }
+      let dom = echarts.init(this.$refs.dom, 'tdTheme')
+      dom.setOption(option)
+    })
+  }
+}
+</script>
+
+<style lang="less">
+.charts{
+  //
+}
+</style>

src/components/charts/theme.json

@@ -0,0 +1,491 @@
+
+{
+    "color": [
+        "#2d8cf0",
+        "#19be6b",
+        "#ff9900",
+        "#E46CBB",
+        "#9A66E4",
+        "#ed3f14"
+    ],
+    "backgroundColor": "rgba(0,0,0,0)",
+    "textStyle": {},
+    "title": {
+        "textStyle": {
+            "color": "#516b91"
+        },
+        "subtextStyle": {
+            "color": "#93b7e3"
+        }
+    },
+    "line": {
+        "itemStyle": {
+            "normal": {
+                "borderWidth": "2"
+            }
+        },
+        "lineStyle": {
+            "normal": {
+                "width": "2"
+            }
+        },
+        "symbolSize": "6",
+        "symbol": "emptyCircle",
+        "smooth": true
+    },
+    "radar": {
+        "itemStyle": {
+            "normal": {
+                "borderWidth": "2"
+            }
+        },
+        "lineStyle": {
+            "normal": {
+                "width": "2"
+            }
+        },
+        "symbolSize": "6",
+        "symbol": "emptyCircle",
+        "smooth": true
+    },
+    "bar": {
+        "itemStyle": {
+            "normal": {
+                "barBorderWidth": 0,
+                "barBorderColor": "#ccc"
+            },
+            "emphasis": {
+                "barBorderWidth": 0,
+                "barBorderColor": "#ccc"
+            }
+        }
+    },
+    "pie": {
+        "itemStyle": {
+            "normal": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            },
+            "emphasis": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            }
+        }
+    },
+    "scatter": {
+        "itemStyle": {
+            "normal": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            },
+            "emphasis": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            }
+        }
+    },
+    "boxplot": {
+        "itemStyle": {
+            "normal": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            },
+            "emphasis": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            }
+        }
+    },
+    "parallel": {
+        "itemStyle": {
+            "normal": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            },
+            "emphasis": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            }
+        }
+    },
+    "sankey": {
+        "itemStyle": {
+            "normal": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            },
+            "emphasis": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            }
+        }
+    },
+    "funnel": {
+        "itemStyle": {
+            "normal": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            },
+            "emphasis": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            }
+        }
+    },
+    "gauge": {
+        "itemStyle": {
+            "normal": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            },
+            "emphasis": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            }
+        }
+    },
+    "candlestick": {
+        "itemStyle": {
+            "normal": {
+                "color": "#edafda",
+                "color0": "transparent",
+                "borderColor": "#d680bc",
+                "borderColor0": "#8fd3e8",
+                "borderWidth": "2"
+            }
+        }
+    },
+    "graph": {
+        "itemStyle": {
+            "normal": {
+                "borderWidth": 0,
+                "borderColor": "#ccc"
+            }
+        },
+        "lineStyle": {
+            "normal": {
+                "width": 1,
+                "color": "#aaa"
+            }
+        },
+        "symbolSize": "6",
+        "symbol": "emptyCircle",
+        "smooth": true,
+        "color": [
+            "#2d8cf0",
+            "#19be6b",
+            "#f5ae4a",
+            "#9189d5",
+            "#56cae2",
+            "#cbb0e3"
+        ],
+        "label": {
+            "normal": {
+                "textStyle": {
+                    "color": "#eee"
+                }
+            }
+        }
+    },
+    "map": {
+        "itemStyle": {
+            "normal": {
+                "areaColor": "#f3f3f3",
+                "borderColor": "#516b91",
+                "borderWidth": 0.5
+            },
+            "emphasis": {
+                "areaColor": "rgba(165,231,240,1)",
+                "borderColor": "#516b91",
+                "borderWidth": 1
+            }
+        },
+        "label": {
+            "normal": {
+                "textStyle": {
+                    "color": "#000"
+                }
+            },
+            "emphasis": {
+                "textStyle": {
+                    "color": "rgb(81,107,145)"
+                }
+            }
+        }
+    },
+    "geo": {
+        "itemStyle": {
+            "normal": {
+                "areaColor": "#f3f3f3",
+                "borderColor": "#516b91",
+                "borderWidth": 0.5
+            },
+            "emphasis": {
+                "areaColor": "rgba(165,231,240,1)",
+                "borderColor": "#516b91",
+                "borderWidth": 1
+            }
+        },
+        "label": {
+            "normal": {
+                "textStyle": {
+                    "color": "#000"
+                }
+            },
+            "emphasis": {
+                "textStyle": {
+                    "color": "rgb(81,107,145)"
+                }
+            }
+        }
+    },
+    "categoryAxis": {
+        "axisLine": {
+            "show": true,
+            "lineStyle": {
+                "color": "#cccccc"
+            }
+        },
+        "axisTick": {
+            "show": false,
+            "lineStyle": {
+                "color": "#333"
+            }
+        },
+        "axisLabel": {
+            "show": true,
+            "textStyle": {
+                "color": "#999999"
+            }
+        },
+        "splitLine": {
+            "show": true,
+            "lineStyle": {
+                "color": [
+                    "#eeeeee"
+                ]
+            }
+        },
+        "splitArea": {
+            "show": false,
+            "areaStyle": {
+                "color": [
+                    "rgba(250,250,250,0.05)",
+                    "rgba(200,200,200,0.02)"
+                ]
+            }
+        }
+    },
+    "valueAxis": {
+        "axisLine": {
+            "show": true,
+            "lineStyle": {
+                "color": "#cccccc"
+            }
+        },
+        "axisTick": {
+            "show": false,
+            "lineStyle": {
+                "color": "#333"
+            }
+        },
+        "axisLabel": {
+            "show": true,
+            "textStyle": {
+                "color": "#999999"
+            }
+        },
+        "splitLine": {
+            "show": true,
+            "lineStyle": {
+                "color": [
+                    "#eeeeee"
+                ]
+            }
+        },
+        "splitArea": {
+            "show": false,
+            "areaStyle": {
+                "color": [
+                    "rgba(250,250,250,0.05)",
+                    "rgba(200,200,200,0.02)"
+                ]
+            }
+        }
+    },
+    "logAxis": {
+        "axisLine": {
+            "show": true,
+            "lineStyle": {
+                "color": "#cccccc"
+            }
+        },
+        "axisTick": {
+            "show": false,
+            "lineStyle": {
+                "color": "#333"
+            }
+        },
+        "axisLabel": {
+            "show": true,
+            "textStyle": {
+                "color": "#999999"
+            }
+        },
+        "splitLine": {
+            "show": true,
+            "lineStyle": {
+                "color": [
+                    "#eeeeee"
+                ]
+            }
+        },
+        "splitArea": {
+            "show": false,
+            "areaStyle": {
+                "color": [
+                    "rgba(250,250,250,0.05)",
+                    "rgba(200,200,200,0.02)"
+                ]
+            }
+        }
+    },
+    "timeAxis": {
+        "axisLine": {
+            "show": true,
+            "lineStyle": {
+                "color": "#cccccc"
+            }
+        },
+        "axisTick": {
+            "show": false,
+            "lineStyle": {
+                "color": "#333"
+            }
+        },
+        "axisLabel": {
+            "show": true,
+            "textStyle": {
+                "color": "#999999"
+            }
+        },
+        "splitLine": {
+            "show": true,
+            "lineStyle": {
+                "color": [
+                    "#eeeeee"
+                ]
+            }
+        },
+        "splitArea": {
+            "show": false,
+            "areaStyle": {
+                "color": [
+                    "rgba(250,250,250,0.05)",
+                    "rgba(200,200,200,0.02)"
+                ]
+            }
+        }
+    },
+    "toolbox": {
+        "iconStyle": {
+            "normal": {
+                "borderColor": "#999"
+            },
+            "emphasis": {
+                "borderColor": "#666"
+            }
+        }
+    },
+    "legend": {
+        "textStyle": {
+            "color": "#999999"
+        }
+    },
+    "tooltip": {
+        "axisPointer": {
+            "lineStyle": {
+                "color": "#ccc",
+                "width": 1
+            },
+            "crossStyle": {
+                "color": "#ccc",
+                "width": 1
+            }
+        }
+    },
+    "timeline": {
+        "lineStyle": {
+            "color": "#8fd3e8",
+            "width": 1
+        },
+        "itemStyle": {
+            "normal": {
+                "color": "#8fd3e8",
+                "borderWidth": 1
+            },
+            "emphasis": {
+                "color": "#8fd3e8"
+            }
+        },
+        "controlStyle": {
+            "normal": {
+                "color": "#8fd3e8",
+                "borderColor": "#8fd3e8",
+                "borderWidth": 0.5
+            },
+            "emphasis": {
+                "color": "#8fd3e8",
+                "borderColor": "#8fd3e8",
+                "borderWidth": 0.5
+            }
+        },
+        "checkpointStyle": {
+            "color": "#8fd3e8",
+            "borderColor": "rgba(138,124,168,0.37)"
+        },
+        "label": {
+            "normal": {
+                "textStyle": {
+                    "color": "#8fd3e8"
+                }
+            },
+            "emphasis": {
+                "textStyle": {
+                    "color": "#8fd3e8"
+                }
+            }
+        }
+    },
+    "visualMap": {
+        "color": [
+            "#516b91",
+            "#59c4e6",
+            "#a5e7f0"
+        ]
+    },
+    "dataZoom": {
+        "backgroundColor": "rgba(0,0,0,0)",
+        "dataBackgroundColor": "rgba(255,255,255,0.3)",
+        "fillerColor": "rgba(167,183,204,0.4)",
+        "handleColor": "#a7b7cc",
+        "handleSize": "100%",
+        "textStyle": {
+            "color": "#333"
+        }
+    },
+    "markPoint": {
+        "label": {
+            "normal": {
+                "textStyle": {
+                    "color": "#eee"
+                }
+            },
+            "emphasis": {
+                "textStyle": {
+                    "color": "#eee"
+                }
+            }
+        }
+    }
+}

src/components/common-icon/common-icon.vue

@@ -0,0 +1,52 @@
+<template>
+  <component :is="iconType" :type="iconName" :color="iconColor" :size="iconSize"/>
+</template>
+
+<script>
+import Icons from '_c/icons'
+import FaIcons from '_c/fa-icons'
+export default {
+  name: 'CommonIcon',
+  components: {Icons, FaIcons},
+  props: {
+    type: {
+      type: String,
+      required: true
+    },
+    color: String,
+    size: Number
+  },
+  computed: {
+    iconType () {
+      if (this.isFa) {
+        return 'FaIcons'
+      }
+      return this.type.indexOf('_') === 0 ? 'Icons' : 'Icon'
+    },
+    iconName () {
+      if (this.isFa) {
+        return this.type.substring(3)
+      }
+      return this.iconType === 'Icons' ? this.getCustomIconName(this.type) : this.type
+    },
+    iconSize () {
+      return this.size || (this.iconType === 'Icons' ? 12 : undefined)
+    },
+    iconColor () {
+      return this.color || ''
+    },
+    isFa () {
+      return this.type.startsWith('fa-')
+    }
+  },
+  methods: {
+    getCustomIconName (iconName) {
+      return iconName.slice(1)
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

src/components/common-icon/index.js

@@ -0,0 +1,2 @@
+import CommonIcon from './common-icon.vue'
+export default CommonIcon