init

.browserslistrc

+> 1%
+last 2 versions
+not ie <= 8

.gitignore

+.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*

README.en.md

+# VUE_R6
+
+#### Description
+{**When you're done, you can delete the content in this README and update the file with details for others getting started with your repository**}
+
+#### Software Architecture
+Software architecture description
+
+#### Installation
+
+1. xxxx
+2. xxxx
+3. xxxx
+
+#### Instructions
+
+1. xxxx
+2. xxxx
+3. xxxx
+
+#### Contribution
+
+1. Fork the repository
+2. Create Feat_xxx branch
+3. Commit your code
+4. Create Pull Request
+
+
+#### Gitee Feature
+
+1. You can use Readme\_XXX.md to support different languages, such as Readme\_en.md, Readme\_zh.md
+2. Gitee blog [blog.gitee.com](https://blog.gitee.com)
+3. Explore open source project [https://gitee.com/explore](https://gitee.com/explore)
+4. The most valuable open source project [GVP](https://gitee.com/gvp)
+5. The manual of Gitee [https://gitee.com/help](https://gitee.com/help)
+6. The most popular members  [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)
\ No newline at end of file

README.md

+# app
+
+## Project setup
+```
+yarn install
+```
+
+### Compiles and hot-reloads for development
+```
+yarn run serve
+```
+
+### Compiles and minifies for production
+```
+yarn run build
+```
+
+### Run your tests
+```
+yarn run test
+```
+
+### Lints and fixes files
+```
+yarn run lint
+```
+
+### Run your end-to-end tests
+```
+yarn run test:e2e
+```
+
+### Run your unit tests
+```
+yarn run test:unit
+```
+
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).

Readme.zh-CN.md

+## 更新日志
+
+### 1.1.0.1
+
+#### 新特性
+- 默认错误显示页
+  - 添加默认错误显示页面（404、500）（by @JunZai）
+
+
+### 1.1.0.0
+
+*2019-08-08*
+
+#### 非兼容性更新
+- 应用
+  - 支持多首页模式（删除src下main.ts文件，将其挂在首页目录下；新增template.html；）（by @JunZai）
+
+
+
+### 1.0.0.3
+
+*2019-08-02*
+
+#### 新特性
+- 关系表格数据刷新
+  - 编辑页面标签模式打开刷新关联视图 [(by @zcdtk)]
+- 文件和图片上传组件
+  - 上传时带srfappdata参数
+
+#### 优化
+- AppCheckBox、AppRadioGroup、DropDownList
+  - 代码表组件本地化缓存 [(#3769c67 by @zcdtk)](https://gitee.com/dev_ibizsys/VUE_R6/commit/3769c67d99370003949fac86dfbe7e1b5630a551)
+- AppRichTextEditor
+  - 富文本编辑器功能补充 [(#87eecb1 by @zcdtk)](https://gitee.com/dev_ibizsys/VUE_R6/commit/87eecb1b26c6ce9c64d4c1b87baf87b73643661e)
+
+#### Bug 修复
+- DropDownList
+  - 下拉列表框值处理异常修复 [(#dc6f44e by @zcdtk)](https://gitee.com/dev_ibizsys/VUE_R6/commit/dc6f44e20e8c26eb5d66972b652f7704887cc2cf)
+- InputBox
+  - 数值模式空格输入 [(#f52f9c4 by @zcdtk)](https://gitee.com/dev_ibizsys/VUE_R6/commit/f52f9c420698847a8aa9f67fcf01ce30ebd6715d)
+
+
+### 1.0.0.2
+
+*2019-07-19*
+
+#### 新特性
+- GridView
+  - 支持表格数据激活模式  (by @zcdtk)
+- utils
+  - 工具方法添加序列号处理  (by @zcdtk)
+
+#### Bug 修复
+- AppModal、AppDrawer
+  - 模态与抽屉层级与多语言异常修复 [(#61f0210 by @zcdtk)](https://gitee.com/dev_ibizsys/VUE_R6/commit/61f0210336be4b6011ca2c1215812ac13cfb20aa)
+- AppRichTextEditor
+  - 富文本编编辑器打包异常 [(#3df7de0 by @zcdtk)](https://gitee.com/dev_ibizsys/VUE_R6/commit/3df7de09543f7e732338397e478ed44a13184809)
+
+### 1.0.0.1
+
+*2019-06-13*
+
+#### 新特性
+- ToolBar
+  - 支持提示信息
+- Form
+  - 分组标题栏关闭模式
+
+
+### 1.0.0.0
+
+*2019-06-26*
+
+#### Bug 修复
+
+- Grid
+  - 修复表格代码绘制（或模式） [af07ea](https://gitee.com/dev_ibizsys/VUE_R6/commit/af07eafb09a92d31dcbc141e702691e01c2e5807)
+

babel.config.js

+module.exports = {
+  presets: [
+    '@vue/app'
+  ]
+}

cypress.json

+{
+  "pluginsFile": "tests/e2e/plugins/index.js"
+}

jest.config.js

+module.exports = {
+  moduleFileExtensions: [
+    'js',
+    'jsx',
+    'json',
+    'vue',
+    'ts',
+    'tsx'
+  ],
+  transform: {
+    '^.+\\.vue$': 'vue-jest',
+    '.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub',
+    '^.+\\.tsx?$': 'ts-jest'
+  },
+  transformIgnorePatterns: [
+    '/node_modules/'
+  ],
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1'
+  },
+  snapshotSerializers: [
+    'jest-serializer-vue'
+  ],
+  testMatch: [
+    '**/tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)'
+  ],
+  testURL: 'http://localhost/',
+  globals: {
+    'ts-jest': {
+      babelConfig: true
+    }
+  }
+}

package.json

+{
+  "name": "app",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "serve": "node --max_old_space_size=8102 ./node_modules/@vue/cli-service/bin/vue-cli-service serve",
+    "build": "node --max_old_space_size=8102 ./node_modules/@vue/cli-service/bin/vue-cli-service build",
+    "lint": "vue-cli-service lint",
+    "test:e2e": "vue-cli-service test:e2e",
+    "test:unit": "vue-cli-service test:unit"
+  },
+  "dependencies": {
+    "axios": "^0.19.0",
+    "codemirror": "^5.48.2",
+    "core-js": "^2.6.5",
+    "css-element-queries": "^1.2.1",
+    "echarts": "^4.2.1",
+    "element-ui": "^2.11.1",
+    "font-awesome": "4.7.0",
+    "iview": "^3.4.2",
+    "rxjs": "^6.5.2",
+    "tinymce": "4.8.5",
+    "vue": "^2.6.10",
+    "vue-class-component": "^7.1.0",
+    "vue-i18n": "^8.12.0",
+    "vue-property-decorator": "^8.2.0",
+    "vue-router": "^3.0.7",
+    "vuex": "^3.1.1"
+  },
+  "devDependencies": {
+    "@types/codemirror": "0.0.74",
+    "@types/echarts": "^4.1.9",
+    "@types/jest": "^23.1.4",
+    "@vue/cli-plugin-babel": "^3.5.0",
+    "@vue/cli-plugin-e2e-cypress": "^3.5.0",
+    "@vue/cli-plugin-typescript": "^3.5.0",
+    "@vue/cli-plugin-unit-jest": "^3.5.0",
+    "@vue/cli-service": "^3.5.0",
+    "@vue/test-utils": "1.0.0-beta.29",
+    "babel-core": "7.0.0-bridge.0",
+    "less": "^3.0.4",
+    "less-loader": "^4.1.0",
+    "ts-jest": "^23.0.0",
+    "typescript": "^3.2.1",
+    "vue-template-compiler": "^2.6.10"
+  }
+}

postcss.config.js

+module.exports = {
+  plugins: {
+    autoprefixer: {}
+  }
+}

public/assets/tinymce/langs/en_GB.js

+tinymce.addI18n('en_GB',{
+"Cut": "Cut",
+"Heading 5": "Heading 5",
+"Header 2": "Header 2",
+"Your browser doesn't support direct access to the clipboard. Please use the Ctrl+X\/C\/V keyboard shortcuts instead.": "Your browser doesn't support direct access to the clipboard. Please use the Ctrl+X\/C\/V keyboard shortcuts instead.",
+"Heading 4": "Heading 4",
+"Div": "Div",
+"Heading 2": "Heading 2",
+"Paste": "Paste",
+"Close": "Close",
+"Font Family": "Font Family",
+"Pre": "Pre",
+"Align right": "Align right",
+"New document": "New document",
+"Blockquote": "Blockquote",
+"Numbered list": "Numbered list",
+"Heading 1": "Heading 1",
+"Headings": "Headings",
+"Increase indent": "Increase indent",
+"Formats": "Formats",
+"Headers": "Headers",
+"Select all": "Select all",
+"Header 3": "Header 3",
+"Blocks": "Blocks",
+"Undo": "Undo",
+"Strikethrough": "Strike-through",
+"Bullet list": "Bullet list",
+"Header 1": "Header 1",
+"Superscript": "Superscript",
+"Clear formatting": "Clear formatting",
+"Font Sizes": "Font Sizes",
+"Subscript": "Subscript",
+"Header 6": "Header 6",
+"Redo": "Redo",
+"Paragraph": "Paragraph",
+"Ok": "Ok",
+"Bold": "Bold",
+"Code": "Code",
+"Italic": "Italic",
+"Align center": "Align centre",
+"Header 5": "Header 5",
+"Heading 6": "Heading 6",
+"Heading 3": "Heading 3",
+"Decrease indent": "Decrease indent",
+"Header 4": "Header 4",
+"Paste is now in plain text mode. Contents will now be pasted as plain text until you toggle this option off.": "Paste is now in plain text mode. Contents will now be pasted as plain text until you toggle this option off.",
+"Underline": "Underline",
+"Cancel": "Cancel",
+"Justify": "Justify",
+"Inline": "Inline",
+"Copy": "Copy",
+"Align left": "Align left",
+"Visual aids": "Visual aids",
+"Lower Greek": "Lower Greek",
+"Square": "Square",
+"Default": "Default",
+"Lower Alpha": "Lower Alpha",
+"Circle": "Circle",
+"Disc": "Disc",
+"Upper Alpha": "Upper Alpha",
+"Upper Roman": "Upper Roman",
+"Lower Roman": "Lower Roman",
+"Id should start with a letter, followed only by letters, numbers, dashes, dots, colons or underscores.": "ID should start with a letter, followed only by letters, numbers, dashes, dots, colons or underscores.",
+"Name": "Name",
+"Anchor": "Anchor",
+"Id": "ID",
+"You have unsaved changes are you sure you want to navigate away?": "You have unsaved changes are you sure you want to navigate away?",
+"Restore last draft": "Restore last draft",
+"Special character": "Special character",
+"Source code": "Source code",
+"Language": "Language",
+"Insert\/Edit code sample": "Insert\/Edit code sample",
+"B": "B",
+"R": "R",
+"G": "G",
+"Color": "Colour",
+"Right to left": "Right to left",
+"Left to right": "Left to right",
+"Emoticons": "Emoticons",
+"Robots": "Robots",
+"Document properties": "Document properties",
+"Title": "Title",
+"Keywords": "Keywords",
+"Encoding": "Encoding",
+"Description": "Description",
+"Author": "Author",
+"Fullscreen": "Full-screen",
+"Horizontal line": "Horizontal line",
+"Horizontal space": "Horizontal space",
+"Insert\/edit image": "Insert\/edit image",
+"General": "General",
+"Advanced": "Advanced",
+"Source": "Source",
+"Border": "Border",
+"Constrain proportions": "Constrain proportions",
+"Vertical space": "Vertical space",
+"Image description": "Image description",
+"Style": "Style",
+"Dimensions": "Dimensions",
+"Insert image": "Insert image",
+"Image": "Image",
+"Zoom in": "Zoom in",
+"Contrast": "Contrast",
+"Back": "Back",
+"Gamma": "Gamma",
+"Flip horizontally": "Flip horizontally",
+"Resize": "Resize",
+"Sharpen": "Sharpen",
+"Zoom out": "Zoom out",
+"Image options": "Image options",
+"Apply": "Apply",
+"Brightness": "Brightness",
+"Rotate clockwise": "Rotate clockwise",
+"Rotate counterclockwise": "Rotate counterclockwise",
+"Edit image": "Edit image",
+"Color levels": "Colour levels",
+"Crop": "Crop",
+"Orientation": "Orientation",
+"Flip vertically": "Flip vertically",
+"Invert": "Invert",
+"Date\/time": "Date\/time",
+"Insert date\/time": "Insert date\/time",
+"Remove link": "Remove link",
+"Url": "URL",
+"Text to display": "Text to display",
+"Anchors": "Anchors",
+"Insert link": "Insert link",
+"Link": "Link",
+"New window": "New window",
+"None": "None",
+"The URL you entered seems to be an external link. Do you want to add the required http:\/\/ prefix?": "The URL you entered seems to be an external link. Do you want to add the required http:\/\/ prefix?",
+"Paste or type a link": "Paste or type a link",
+"Target": "Target",
+"The URL you entered seems to be an email address. Do you want to add the required mailto: prefix?": "The URL you entered seems to be an email address. Do you want to add the required mailto: prefix?",
+"Insert\/edit link": "Insert\/edit link",
+"Insert\/edit video": "Insert\/edit video",
+"Media": "Media",
+"Alternative source": "Alternative source",
+"Paste your embed code below:": "Paste your embed code below:",
+"Insert video": "Insert video",
+"Poster": "Poster",
+"Insert\/edit media": "Insert\/edit media",
+"Embed": "Embed",
+"Nonbreaking space": "Non-breaking space",
+"Page break": "Page break",
+"Paste as text": "Paste as text",
+"Preview": "Preview",
+"Print": "Print",
+"Save": "Save",
+"Could not find the specified string.": "Could not find the specified string.",
+"Replace": "Replace",
+"Next": "Next",
+"Whole words": "Whole words",
+"Find and replace": "Find and replace",
+"Replace with": "Replace with",
+"Find": "Find",
+"Replace all": "Replace all",
+"Match case": "Match case",
+"Prev": "Prev",
+"Spellcheck": "Spell-check",
+"Finish": "Finish",
+"Ignore all": "Ignore all",
+"Ignore": "Ignore",
+"Add to Dictionary": "Add to Dictionary",
+"Insert row before": "Insert row before",
+"Rows": "Rows",
+"Height": "Height",
+"Paste row after": "Paste row after",
+"Alignment": "Alignment",
+"Border color": "Border colour",
+"Column group": "Column group",
+"Row": "Row",
+"Insert column before": "Insert column before",
+"Split cell": "Split cell",
+"Cell padding": "Cell padding",
+"Cell spacing": "Cell spacing",
+"Row type": "Row type",
+"Insert table": "Insert table",
+"Body": "Body",
+"Caption": "Caption",
+"Footer": "Footer",
+"Delete row": "Delete row",
+"Paste row before": "Paste row before",
+"Scope": "Scope",
+"Delete table": "Delete table",
+"H Align": "H Align",
+"Top": "Top",
+"Header cell": "Header cell",
+"Column": "Column",
+"Row group": "Row group",
+"Cell": "Cell",
+"Middle": "Middle",
+"Cell type": "Cell type",
+"Copy row": "Copy row",
+"Row properties": "Row properties",
+"Table properties": "Table properties",
+"Bottom": "Bottom",
+"V Align": "V Align",
+"Header": "Header",
+"Right": "Right",
+"Insert column after": "Insert column after",
+"Cols": "Cols",
+"Insert row after": "Insert row after",
+"Width": "Width",
+"Cell properties": "Cell properties",
+"Left": "Left",
+"Cut row": "Cut row",
+"Delete column": "Delete column",
+"Center": "Centre",
+"Merge cells": "Merge cells",
+"Insert template": "Insert template",
+"Templates": "Templates",
+"Background color": "Background colour",
+"Custom...": "Custom...",
+"Custom color": "Custom colour",
+"No color": "No colour",
+"Text color": "Text colour",
+"Table of Contents": "Table of Contents",
+"Show blocks": "Show blocks",
+"Show invisible characters": "Show invisible characters",
+"Words: {0}": "Words: {0}",
+"Insert": "Insert",
+"File": "File",
+"Edit": "Edit",
+"Rich Text Area. Press ALT-F9 for menu. Press ALT-F10 for toolbar. Press ALT-0 for help": "Rich Text Area. Press ALT-F9 for menu. Press ALT-F10 for toolbar. Press ALT-0 for help",
+"Tools": "Tools",
+"View": "View",
+"Table": "Table",
+"Format": "Format"
+});
\ No newline at end of file

public/assets/tinymce/langs/zh_CN.js

+tinymce.addI18n('zh_CN',{
+"Redo": "\u91cd\u590d",
+"Undo": "\u64a4\u6d88",
+"Cut": "\u526a\u5207",
+"Copy": "\u590d\u5236",
+"Paste": "\u7c98\u8d34",
+"Select all": "\u5168\u9009",
+"New document": "\u65b0\u6587\u6863",
+"Ok": "\u786e\u5b9a",
+"Cancel": "\u53d6\u6d88",
+"Visual aids": "\u7f51\u683c\u7ebf",
+"Bold": "\u7c97\u4f53",
+"Italic": "\u659c\u4f53",
+"Underline": "\u4e0b\u5212\u7ebf",
+"Strikethrough": "\u5220\u9664\u7ebf",
+"Superscript": "\u4e0a\u6807",
+"Subscript": "\u4e0b\u6807",
+"Clear formatting": "\u6e05\u9664\u683c\u5f0f",
+"Align left": "\u5de6\u5bf9\u9f50",
+"Align center": "\u5c45\u4e2d",
+"Align right": "\u53f3\u5bf9\u9f50",
+"Justify": "\u4e24\u7aef\u5bf9\u9f50",
+"Bullet list": "\u9879\u76ee\u7b26\u53f7",
+"Numbered list": "\u7f16\u53f7\u5217\u8868",
+"Decrease indent": "\u51cf\u5c11\u7f29\u8fdb",
+"Increase indent": "\u589e\u52a0\u7f29\u8fdb",
+"Close": "\u5173\u95ed",
+"Formats": "\u683c\u5f0f",
+"Your browser doesn't support direct access to the clipboard. Please use the Ctrl+X\/C\/V keyboard shortcuts instead.": "\u4f60\u7684\u6d4f\u89c8\u5668\u4e0d\u652f\u6301\u5bf9\u526a\u8d34\u677f\u7684\u8bbf\u95ee\uff0c\u8bf7\u4f7f\u7528Ctrl+X\/C\/V\u952e\u8fdb\u884c\u590d\u5236\u7c98\u8d34\u3002",
+"Headers": "\u6807\u9898",
+"Header 1": "\u6807\u98981",
+"Header 2": "\u6807\u98982",
+"Header 3": "\u6807\u98983",
+"Header 4": "\u6807\u98984",
+"Header 5": "\u6807\u98985",
+"Header 6": "\u6807\u98986",
+"Headings": "\u6807\u9898",
+"Heading 1": "\u6807\u98981",
+"Heading 2": "\u6807\u98982",
+"Heading 3": "\u6807\u98983",
+"Heading 4": "\u6807\u98984",
+"Heading 5": "\u6807\u98985",
+"Heading 6": "\u6807\u98986",
+"Preformatted": "\u9884\u683c\u5f0f\u5316",
+"Div": "Div\u533a\u5757",
+"Pre": "\u9884\u683c\u5f0f\u6587\u672c",
+"Code": "\u4ee3\u7801",
+"Paragraph": "\u6bb5\u843d",
+"Blockquote": "\u5f15\u7528",
+"Inline": "\u6587\u672c",
+"Blocks": "\u533a\u5757",
+"Paste is now in plain text mode. Contents will now be pasted as plain text until you toggle this option off.": "\u5f53\u524d\u4e3a\u7eaf\u6587\u672c\u7c98\u8d34\u6a21\u5f0f\uff0c\u518d\u6b21\u70b9\u51fb\u53ef\u4ee5\u56de\u5230\u666e\u901a\u7c98\u8d34\u6a21\u5f0f\u3002",
+"Font Family": "\u5b57\u4f53",
+"Font Sizes": "\u5b57\u53f7",
+"Class": "Class",
+"Browse for an image": "\u6d4f\u89c8\u56fe\u50cf",
+"OR": "\u6216",
+"Drop an image here": "\u62d6\u653e\u4e00\u5f20\u56fe\u50cf\u81f3\u6b64",
+"Upload": "\u4e0a\u4f20",
+"Block": "\u5757",
+"Align": "\u5bf9\u9f50",
+"Default": "\u9ed8\u8ba4",
+"Circle": "\u7a7a\u5fc3\u5706",
+"Disc": "\u5b9e\u5fc3\u5706",
+"Square": "\u65b9\u5757",
+"Lower Alpha": "\u5c0f\u5199\u82f1\u6587\u5b57\u6bcd",
+"Lower Greek": "\u5c0f\u5199\u5e0c\u814a\u5b57\u6bcd",
+"Lower Roman": "\u5c0f\u5199\u7f57\u9a6c\u5b57\u6bcd",
+"Upper Alpha": "\u5927\u5199\u82f1\u6587\u5b57\u6bcd",
+"Upper Roman": "\u5927\u5199\u7f57\u9a6c\u5b57\u6bcd",
+"Anchor": "\u951a\u70b9",
+"Name": "\u540d\u79f0",
+"Id": "\u6807\u8bc6\u7b26",
+"Id should start with a letter, followed only by letters, numbers, dashes, dots, colons or underscores.": "\u6807\u8bc6\u7b26\u5e94\u8be5\u4ee5\u5b57\u6bcd\u5f00\u5934\uff0c\u540e\u8ddf\u5b57\u6bcd\u3001\u6570\u5b57\u3001\u7834\u6298\u53f7\u3001\u70b9\u3001\u5192\u53f7\u6216\u4e0b\u5212\u7ebf\u3002",
+"You have unsaved changes are you sure you want to navigate away?": "\u4f60\u8fd8\u6709\u6587\u6863\u5c1a\u672a\u4fdd\u5b58\uff0c\u786e\u5b9a\u8981\u79bb\u5f00\uff1f",
+"Restore last draft": "\u6062\u590d\u4e0a\u6b21\u7684\u8349\u7a3f",
+"Special character": "\u7279\u6b8a\u7b26\u53f7",
+"Source code": "\u6e90\u4ee3\u7801",
+"Insert\/Edit code sample": "\u63d2\u5165\/\u7f16\u8f91\u4ee3\u7801\u793a\u4f8b",
+"Language": "\u8bed\u8a00",
+"Code sample": "\u4ee3\u7801\u793a\u4f8b",
+"Color": "\u989c\u8272",
+"R": "R",
+"G": "G",
+"B": "B",
+"Left to right": "\u4ece\u5de6\u5230\u53f3",
+"Right to left": "\u4ece\u53f3\u5230\u5de6",
+"Emoticons": "\u8868\u60c5",
+"Document properties": "\u6587\u6863\u5c5e\u6027",
+"Title": "\u6807\u9898",
+"Keywords": "\u5173\u952e\u8bcd",
+"Description": "\u63cf\u8ff0",
+"Robots": "\u673a\u5668\u4eba",
+"Author": "\u4f5c\u8005",
+"Encoding": "\u7f16\u7801",
+"Fullscreen": "\u5168\u5c4f",
+"Action": "\u64cd\u4f5c",
+"Shortcut": "\u5feb\u6377\u952e",
+"Help": "\u5e2e\u52a9",
+"Address": "\u5730\u5740",
+"Focus to menubar": "\u79fb\u52a8\u7126\u70b9\u5230\u83dc\u5355\u680f",
+"Focus to toolbar": "\u79fb\u52a8\u7126\u70b9\u5230\u5de5\u5177\u680f",
+"Focus to element path": "\u79fb\u52a8\u7126\u70b9\u5230\u5143\u7d20\u8def\u5f84",
+"Focus to contextual toolbar": "\u79fb\u52a8\u7126\u70b9\u5230\u4e0a\u4e0b\u6587\u83dc\u5355",
+"Insert link (if link plugin activated)": "\u63d2\u5165\u94fe\u63a5 (\u5982\u679c\u94fe\u63a5\u63d2\u4ef6\u5df2\u6fc0\u6d3b)",
+"Save (if save plugin activated)": "\u4fdd\u5b58(\u5982\u679c\u4fdd\u5b58\u63d2\u4ef6\u5df2\u6fc0\u6d3b)",
+"Find (if searchreplace plugin activated)": "\u67e5\u627e(\u5982\u679c\u67e5\u627e\u66ff\u6362\u63d2\u4ef6\u5df2\u6fc0\u6d3b)",
+"Plugins installed ({0}):": "\u5df2\u5b89\u88c5\u63d2\u4ef6 ({0}):",
+"Premium plugins:": "\u4f18\u79c0\u63d2\u4ef6\uff1a",
+"Learn more...": "\u4e86\u89e3\u66f4\u591a...",
+"You are using {0}": "\u4f60\u6b63\u5728\u4f7f\u7528 {0}",
+"Plugins": "\u63d2\u4ef6",
+"Handy Shortcuts": "\u5feb\u6377\u952e",
+"Horizontal line": "\u6c34\u5e73\u5206\u5272\u7ebf",
+"Insert\/edit image": "\u63d2\u5165\/\u7f16\u8f91\u56fe\u7247",
+"Image description": "\u56fe\u7247\u63cf\u8ff0",
+"Source": "\u5730\u5740",
+"Dimensions": "\u5927\u5c0f",
+"Constrain proportions": "\u4fdd\u6301\u7eb5\u6a2a\u6bd4",
+"General": "\u666e\u901a",
+"Advanced": "\u9ad8\u7ea7",
+"Style": "\u6837\u5f0f",
+"Vertical space": "\u5782\u76f4\u8fb9\u8ddd",
+"Horizontal space": "\u6c34\u5e73\u8fb9\u8ddd",
+"Border": "\u8fb9\u6846",
+"Insert image": "\u63d2\u5165\u56fe\u7247",
+"Image": "\u56fe\u7247",
+"Image list": "\u56fe\u7247\u5217\u8868",
+"Rotate counterclockwise": "\u9006\u65f6\u9488\u65cb\u8f6c",
+"Rotate clockwise": "\u987a\u65f6\u9488\u65cb\u8f6c",
+"Flip vertically": "\u5782\u76f4\u7ffb\u8f6c",
+"Flip horizontally": "\u6c34\u5e73\u7ffb\u8f6c",
+"Edit image": "\u7f16\u8f91\u56fe\u7247",
+"Image options": "\u56fe\u7247\u9009\u9879",
+"Zoom in": "\u653e\u5927",
+"Zoom out": "\u7f29\u5c0f",
+"Crop": "\u88c1\u526a",
+"Resize": "\u8c03\u6574\u5927\u5c0f",
+"Orientation": "\u65b9\u5411",
+"Brightness": "\u4eae\u5ea6",
+"Sharpen": "\u9510\u5316",
+"Contrast": "\u5bf9\u6bd4\u5ea6",
+"Color levels": "\u989c\u8272\u5c42\u6b21",
+"Gamma": "\u4f3d\u9a6c\u503c",
+"Invert": "\u53cd\u8f6c",
+"Apply": "\u5e94\u7528",
+"Back": "\u540e\u9000",
+"Insert date\/time": "\u63d2\u5165\u65e5\u671f\/\u65f6\u95f4",
+"Date\/time": "\u65e5\u671f\/\u65f6\u95f4",
+"Insert link": "\u63d2\u5165\u94fe\u63a5",
+"Insert\/edit link": "\u63d2\u5165\/\u7f16\u8f91\u94fe\u63a5",
+"Text to display": "\u663e\u793a\u6587\u5b57",
+"Url": "\u5730\u5740",
+"Target": "\u6253\u5f00\u65b9\u5f0f",
+"None": "\u65e0",
+"New window": "\u5728\u65b0\u7a97\u53e3\u6253\u5f00",
+"Remove link": "\u5220\u9664\u94fe\u63a5",
+"Anchors": "\u951a\u70b9",
+"Link": "\u94fe\u63a5",
+"Paste or type a link": "\u7c98\u8d34\u6216\u8f93\u5165\u94fe\u63a5",
+"The URL you entered seems to be an email address. Do you want to add the required mailto: prefix?": "\u4f60\u6240\u586b\u5199\u7684URL\u5730\u5740\u4e3a\u90ae\u4ef6\u5730\u5740\uff0c\u9700\u8981\u52a0\u4e0amailto:\u524d\u7f00\u5417\uff1f",
+"The URL you entered seems to be an external link. Do you want to add the required http:\/\/ prefix?": "\u4f60\u6240\u586b\u5199\u7684URL\u5730\u5740\u5c5e\u4e8e\u5916\u90e8\u94fe\u63a5\uff0c\u9700\u8981\u52a0\u4e0ahttp:\/\/:\u524d\u7f00\u5417\uff1f",
+"Link list": "\u94fe\u63a5\u5217\u8868",
+"Insert video": "\u63d2\u5165\u89c6\u9891",
+"Insert\/edit video": "\u63d2\u5165\/\u7f16\u8f91\u89c6\u9891",
+"Insert\/edit media": "\u63d2\u5165\/\u7f16\u8f91\u5a92\u4f53",
+"Alternative source": "\u955c\u50cf",
+"Poster": "\u5c01\u9762",
+"Paste your embed code below:": "\u5c06\u5185\u5d4c\u4ee3\u7801\u7c98\u8d34\u5728\u4e0b\u9762:",
+"Embed": "\u5185\u5d4c",
+"Media": "\u5a92\u4f53",
+"Nonbreaking space": "\u4e0d\u95f4\u65ad\u7a7a\u683c",
+"Page break": "\u5206\u9875\u7b26",
+"Paste as text": "\u7c98\u8d34\u4e3a\u6587\u672c",
+"Preview": "\u9884\u89c8",
+"Print": "\u6253\u5370",
+"Save": "\u4fdd\u5b58",
+"Find": "\u67e5\u627e",
+"Replace with": "\u66ff\u6362\u4e3a",
+"Replace": "\u66ff\u6362",
+"Replace all": "\u5168\u90e8\u66ff\u6362",
+"Prev": "\u4e0a\u4e00\u4e2a",
+"Next": "\u4e0b\u4e00\u4e2a",
+"Find and replace": "\u67e5\u627e\u548c\u66ff\u6362",
+"Could not find the specified string.": "\u672a\u627e\u5230\u641c\u7d22\u5185\u5bb9.",
+"Match case": "\u533a\u5206\u5927\u5c0f\u5199",
+"Whole words": "\u5168\u5b57\u5339\u914d",
+"Spellcheck": "\u62fc\u5199\u68c0\u67e5",
+"Ignore": "\u5ffd\u7565",
+"Ignore all": "\u5168\u90e8\u5ffd\u7565",
+"Finish": "\u5b8c\u6210",
+"Add to Dictionary": "\u6dfb\u52a0\u5230\u5b57\u5178",
+"Insert table": "\u63d2\u5165\u8868\u683c",
+"Table properties": "\u8868\u683c\u5c5e\u6027",
+"Delete table": "\u5220\u9664\u8868\u683c",
+"Cell": "\u5355\u5143\u683c",
+"Row": "\u884c",
+"Column": "\u5217",
+"Cell properties": "\u5355\u5143\u683c\u5c5e\u6027",
+"Merge cells": "\u5408\u5e76\u5355\u5143\u683c",
+"Split cell": "\u62c6\u5206\u5355\u5143\u683c",
+"Insert row before": "\u5728\u4e0a\u65b9\u63d2\u5165",
+"Insert row after": "\u5728\u4e0b\u65b9\u63d2\u5165",
+"Delete row": "\u5220\u9664\u884c",
+"Row properties": "\u884c\u5c5e\u6027",
+"Cut row": "\u526a\u5207\u884c",
+"Copy row": "\u590d\u5236\u884c",
+"Paste row before": "\u7c98\u8d34\u5230\u4e0a\u65b9",
+"Paste row after": "\u7c98\u8d34\u5230\u4e0b\u65b9",
+"Insert column before": "\u5728\u5de6\u4fa7\u63d2\u5165",
+"Insert column after": "\u5728\u53f3\u4fa7\u63d2\u5165",
+"Delete column": "\u5220\u9664\u5217",
+"Cols": "\u5217",
+"Rows": "\u884c",
+"Width": "\u5bbd",
+"Height": "\u9ad8",
+"Cell spacing": "\u5355\u5143\u683c\u5916\u95f4\u8ddd",
+"Cell padding": "\u5355\u5143\u683c\u5185\u8fb9\u8ddd",
+"Caption": "\u6807\u9898",
+"Left": "\u5de6\u5bf9\u9f50",
+"Center": "\u5c45\u4e2d",
+"Right": "\u53f3\u5bf9\u9f50",
+"Cell type": "\u5355\u5143\u683c\u7c7b\u578b",
+"Scope": "\u8303\u56f4",
+"Alignment": "\u5bf9\u9f50\u65b9\u5f0f",
+"H Align": "\u6c34\u5e73\u5bf9\u9f50",
+"V Align": "\u5782\u76f4\u5bf9\u9f50",
+"Top": "\u9876\u90e8\u5bf9\u9f50",
+"Middle": "\u5782\u76f4\u5c45\u4e2d",
+"Bottom": "\u5e95\u90e8\u5bf9\u9f50",
+"Header cell": "\u8868\u5934\u5355\u5143\u683c",
+"Row group": "\u884c\u7ec4",
+"Column group": "\u5217\u7ec4",
+"Row type": "\u884c\u7c7b\u578b",
+"Header": "\u8868\u5934",
+"Body": "\u8868\u4f53",
+"Footer": "\u8868\u5c3e",
+"Border color": "\u8fb9\u6846\u989c\u8272",
+"Insert template": "\u63d2\u5165\u6a21\u677f",
+"Templates": "\u6a21\u677f",
+"Template": "\u6a21\u677f",
+"Text color": "\u6587\u5b57\u989c\u8272",
+"Background color": "\u80cc\u666f\u8272",
+"Custom...": "\u81ea\u5b9a\u4e49...",
+"Custom color": "\u81ea\u5b9a\u4e49\u989c\u8272",
+"No color": "\u65e0",
+"Table of Contents": "\u5185\u5bb9\u5217\u8868",
+"Show blocks": "\u663e\u793a\u533a\u5757\u8fb9\u6846",
+"Show invisible characters": "\u663e\u793a\u4e0d\u53ef\u89c1\u5b57\u7b26",
+"Words: {0}": "\u5b57\u6570\uff1a{0}",
+"{0} words": "{0} \u5b57",
+"File": "\u6587\u4ef6",
+"Edit": "\u7f16\u8f91",
+"Insert": "\u63d2\u5165",
+"View": "\u89c6\u56fe",
+"Format": "\u683c\u5f0f",
+"Table": "\u8868\u683c",
+"Tools": "\u5de5\u5177",
+"Powered by {0}": "\u7531{0}\u9a71\u52a8",
+"Rich Text Area. Press ALT-F9 for menu. Press ALT-F10 for toolbar. Press ALT-0 for help": "\u5728\u7f16\u8f91\u533a\u6309ALT-F9\u6253\u5f00\u83dc\u5355\uff0c\u6309ALT-F10\u6253\u5f00\u5de5\u5177\u680f\uff0c\u6309ALT-0\u67e5\u770b\u5e2e\u52a9"
+});
\ No newline at end of file

public/assets/tinymce/prism.css

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

public/assets/tinymce/skins/lightgray/content.inline.min.css

+.word-wrap{word-wrap:break-word;-ms-word-break:break-all;word-break:break-all;word-break:break-word;-ms-hyphens:auto;-moz-hyphens:auto;-webkit-hyphens:auto;hyphens:auto}.mce-content-body .mce-reset{margin:0;padding:0;border:0;outline:0;vertical-align:top;background:transparent;text-decoration:none;color:black;font-family:Arial;font-size:11px;text-shadow:none;float:none;position:static;width:auto;height:auto;white-space:nowrap;cursor:inherit;line-height:normal;font-weight:normal;text-align:left;-webkit-tap-highlight-color:transparent;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;direction:ltr;max-width:none}.mce-object{border:1px dotted #3A3A3A;background:#D5D5D5 url(img/object.gif) no-repeat center}.mce-preview-object{display:inline-block;position:relative;margin:0 2px 0 2px;line-height:0;border:1px solid gray}.mce-preview-object[data-mce-selected="2"] .mce-shim{display:none}.mce-preview-object .mce-shim{position:absolute;top:0;left:0;width:100%;height:100%;background:url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)}figure.align-left{float:left}figure.align-right{float:right}figure.image.align-center{display:table;margin-left:auto;margin-right:auto}figure.image{display:inline-block;border:1px solid gray;margin:0 2px 0 1px;background:#f5f2f0}figure.image img{margin:8px 8px 0 8px}figure.image figcaption{margin:6px 8px 6px 8px;text-align:center}.mce-toc{border:1px solid gray}.mce-toc h2{margin:4px}.mce-toc li{list-style-type:none}.mce-pagebreak{cursor:default;display:block;border:0;width:100%;height:5px;border:1px dashed #666;margin-top:15px;page-break-before:always}@media print{.mce-pagebreak{border:0}}.mce-item-anchor{cursor:default;display:inline-block;-webkit-user-select:all;-webkit-user-modify:read-only;-moz-user-select:all;-moz-user-modify:read-only;user-select:all;user-modify:read-only;width:9px !important;height:9px !important;border:1px dotted #3A3A3A;background:#D5D5D5 url(img/anchor.gif) no-repeat center}.mce-nbsp,.mce-shy{background:#AAA}.mce-shy::after{content:'-'}.mce-match-marker{background:#AAA;color:#fff}.mce-match-marker-selected{background:#3399ff;color:#fff}.mce-spellchecker-word{border-bottom:2px solid rgba(208,2,27,0.5);cursor:default}.mce-spellchecker-grammar{border-bottom:2px solid #008000;cursor:default}.mce-item-table,.mce-item-table td,.mce-item-table th,.mce-item-table caption{border:1px dashed #BBB}td[data-mce-selected],th[data-mce-selected]{background-color:#2276d2 !important}.mce-edit-focus{outline:1px dotted #333}.mce-content-body *[contentEditable=false] *[contentEditable=true]:focus{outline:2px solid #2276d2}.mce-content-body *[contentEditable=false] *[contentEditable=true]:hover{outline:2px solid #2276d2}.mce-content-body *[contentEditable=false][data-mce-selected]{outline:2px solid #2276d2}.mce-content-body.mce-content-readonly *[contentEditable=true]:focus,.mce-content-body.mce-content-readonly *[contentEditable=true]:hover{outline:none}.mce-content-body *[data-mce-selected="inline-boundary"]{background:#bfe6ff}.mce-content-body .mce-item-anchor[data-mce-selected]{background:#D5D5D5 url(img/anchor.gif) no-repeat center}.mce-content-body hr{cursor:default}.mce-content-body table{-webkit-nbsp-mode:normal}.ephox-snooker-resizer-bar{background-color:#2276d2;opacity:0}.ephox-snooker-resizer-cols{cursor:col-resize}.ephox-snooker-resizer-rows{cursor:row-resize}.ephox-snooker-resizer-bar.ephox-snooker-resizer-bar-dragging{opacity:.2}.mce-content-body{line-height:1.3}
\ No newline at end of file

public/assets/tinymce/skins/lightgray/content.min.css

+body{background-color:#FFFFFF;color:#000000;font-family:Verdana,Arial,Helvetica,sans-serif;font-size:14px;line-height:1.3;scrollbar-3dlight-color:#F0F0EE;scrollbar-arrow-color:#676662;scrollbar-base-color:#F0F0EE;scrollbar-darkshadow-color:#DDDDDD;scrollbar-face-color:#E0E0DD;scrollbar-highlight-color:#F0F0EE;scrollbar-shadow-color:#F0F0EE;scrollbar-track-color:#F5F5F5}td,th{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:14px}.word-wrap{word-wrap:break-word;-ms-word-break:break-all;word-break:break-all;word-break:break-word;-ms-hyphens:auto;-moz-hyphens:auto;-webkit-hyphens:auto;hyphens:auto}.mce-content-body .mce-reset{margin:0;padding:0;border:0;outline:0;vertical-align:top;background:transparent;text-decoration:none;color:black;font-family:Arial;font-size:11px;text-shadow:none;float:none;position:static;width:auto;height:auto;white-space:nowrap;cursor:inherit;line-height:normal;font-weight:normal;text-align:left;-webkit-tap-highlight-color:transparent;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;direction:ltr;max-width:none}.mce-object{border:1px dotted #3A3A3A;background:#D5D5D5 url(img/object.gif) no-repeat center}.mce-preview-object{display:inline-block;position:relative;margin:0 2px 0 2px;line-height:0;border:1px solid gray}.mce-preview-object[data-mce-selected="2"] .mce-shim{display:none}.mce-preview-object .mce-shim{position:absolute;top:0;left:0;width:100%;height:100%;background:url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)}figure.align-left{float:left}figure.align-right{float:right}figure.image.align-center{display:table;margin-left:auto;margin-right:auto}figure.image{display:inline-block;border:1px solid gray;margin:0 2px 0 1px;background:#f5f2f0}figure.image img{margin:8px 8px 0 8px}figure.image figcaption{margin:6px 8px 6px 8px;text-align:center}.mce-toc{border:1px solid gray}.mce-toc h2{margin:4px}.mce-toc li{list-style-type:none}.mce-pagebreak{cursor:default;display:block;border:0;width:100%;height:5px;border:1px dashed #666;margin-top:15px;page-break-before:always}@media print{.mce-pagebreak{border:0}}.mce-item-anchor{cursor:default;display:inline-block;-webkit-user-select:all;-webkit-user-modify:read-only;-moz-user-select:all;-moz-user-modify:read-only;user-select:all;user-modify:read-only;width:9px !important;height:9px !important;border:1px dotted #3A3A3A;background:#D5D5D5 url(img/anchor.gif) no-repeat center}.mce-nbsp,.mce-shy{background:#AAA}.mce-shy::after{content:'-'}.mce-match-marker{background:#AAA;color:#fff}.mce-match-marker-selected{background:#3399ff;color:#fff}.mce-spellchecker-word{border-bottom:2px solid rgba(208,2,27,0.5);cursor:default}.mce-spellchecker-grammar{border-bottom:2px solid #008000;cursor:default}.mce-item-table,.mce-item-table td,.mce-item-table th,.mce-item-table caption{border:1px dashed #BBB}td[data-mce-selected],th[data-mce-selected]{background-color:#2276d2 !important}.mce-edit-focus{outline:1px dotted #333}.mce-content-body *[contentEditable=false] *[contentEditable=true]:focus{outline:2px solid #2276d2}.mce-content-body *[contentEditable=false] *[contentEditable=true]:hover{outline:2px solid #2276d2}.mce-content-body *[contentEditable=false][data-mce-selected]{outline:2px solid #2276d2}.mce-content-body.mce-content-readonly *[contentEditable=true]:focus,.mce-content-body.mce-content-readonly *[contentEditable=true]:hover{outline:none}.mce-content-body *[data-mce-selected="inline-boundary"]{background:#bfe6ff}.mce-content-body .mce-item-anchor[data-mce-selected]{background:#D5D5D5 url(img/anchor.gif) no-repeat center}.mce-content-body hr{cursor:default}.mce-content-body table{-webkit-nbsp-mode:normal}.ephox-snooker-resizer-bar{background-color:#2276d2;opacity:0}.ephox-snooker-resizer-cols{cursor:col-resize}.ephox-snooker-resizer-rows{cursor:row-resize}.ephox-snooker-resizer-bar.ephox-snooker-resizer-bar-dragging{opacity:.2}
\ No newline at end of file

public/assets/tinymce/skins/lightgray/content.mobile.min.css

+.tinymce-mobile-unfocused-selections .tinymce-mobile-unfocused-selection{position:absolute;display:inline-block;background-color:green;opacity:.5}body{-webkit-text-size-adjust:none}body img{max-width:96vw}body table img{max-width:95%}
\ No newline at end of file

public/assets/tinymce/skins/lightgray/fonts/tinymce-small.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>Generated by IcoMoon</metadata>
+<defs>
+<font id="tinymce-small" horiz-adv-x="1024">
+<font-face units-per-em="1024" ascent="960" descent="-64" />
+<missing-glyph horiz-adv-x="1024" />
+<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
+<glyph unicode="&#xe000;" glyph-name="save" d="M960 80v591.938l-223.938 224.062h-592.062c-44.182 0-80-35.816-80-80v-736c0-44.184 35.818-80 80-80h736c44.184 0 80 35.816 80 80zM576 768h64v-192h-64v192zM704 128h-384v255.882c0.034 0.042 0.076 0.082 0.116 0.118h383.77c0.040-0.036 0.082-0.076 0.116-0.118l-0.002-255.882zM832 128h-64v256c0 35.2-28.8 64-64 64h-384c-35.2 0-64-28.8-64-64v-256h-64v640h64v-192c0-35.2 28.8-64 64-64h320c35.2 0 64 28.8 64 64v171.010l128-128.072v-490.938z" />
+<glyph unicode="&#xe001;" glyph-name="newdocument" d="M850.746 717.254l-133.492 133.49c-24.888 24.892-74.054 45.256-109.254 45.256h-416c-35.2 0-64-28.8-64-64v-768c0-35.2 28.8-64 64-64h640c35.2 0 64 28.8 64 64v544c0 35.2-20.366 84.364-45.254 109.254zM805.49 672.002c6.792-6.796 13.792-19.162 18.894-32.002h-184.384v184.386c12.84-5.1 25.204-12.1 32-18.896l133.49-133.488zM831.884 64h-639.77c-0.040 0.034-0.082 0.076-0.114 0.116v767.77c0.034 0.040 0.076 0.082 0.114 0.114h383.886v-256h256v-511.884c-0.034-0.040-0.076-0.082-0.116-0.116z" />
+<glyph unicode="&#xe002;" glyph-name="fullpage" d="M1024 367.542v160.916l-159.144 15.914c-8.186 30.042-20.088 58.548-35.21 84.98l104.596 127.838-113.052 113.050-127.836-104.596c-26.434 15.124-54.942 27.026-84.982 35.208l-15.914 159.148h-160.916l-15.914-159.146c-30.042-8.186-58.548-20.086-84.98-35.208l-127.838 104.594-113.050-113.050 104.596-127.836c-15.124-26.432-27.026-54.94-35.21-84.98l-159.146-15.916v-160.916l159.146-15.914c8.186-30.042 20.086-58.548 35.21-84.982l-104.596-127.836 113.048-113.048 127.838 104.596c26.432-15.124 54.94-27.028 84.98-35.21l15.916-159.148h160.916l15.914 159.144c30.042 8.186 58.548 20.088 84.982 35.21l127.836-104.596 113.048 113.048-104.596 127.836c15.124 26.434 27.028 54.942 35.21 84.98l159.148 15.92zM704 384l-128-128h-128l-128 128v128l128 128h128l128-128v-128z" />
+<glyph unicode="&#xe003;" glyph-name="alignleft" d="M64 768h896v-128h-896zM64 384h896v-128h-896zM64 576h576v-128h-576zM64 192h576v-128h-576z" />
+<glyph unicode="&#xe004;" glyph-name="aligncenter" d="M64 768h896v-128h-896zM64 384h896v-128h-896zM256 576h512v-128h-512zM256 192h512v-128h-512z" />
+<glyph unicode="&#xe005;" glyph-name="alignright" d="M64 768h896v-128h-896zM64 384h896v-128h-896zM384 576h576v-128h-576zM384 192h576v-128h-576z" />
+<glyph unicode="&#xe006;" glyph-name="alignjustify" d="M64 768h896v-128h-896zM64 384h896v-128h-896zM64 576h896v-128h-896zM64 192h896v-128h-896z" />
+<glyph unicode="&#xe007;" glyph-name="cut" d="M864.408 289.868c-46.47 46.47-106.938 68.004-161.082 62.806l-63.326 63.326 192 192c0 0 128 128 0 256l-320-320-320 320c-128-128 0-256 0-256l192-192-63.326-63.326c-54.144 5.198-114.61-16.338-161.080-62.806-74.98-74.98-85.112-186.418-22.626-248.9 62.482-62.482 173.92-52.354 248.9 22.626 46.47 46.468 68.002 106.938 62.806 161.080l63.326 63.326 63.328-63.328c-5.196-54.144 16.336-114.61 62.806-161.078 74.978-74.98 186.418-85.112 248.898-22.626 62.488 62.482 52.356 173.918-22.624 248.9zM353.124 201.422c-2.212-24.332-15.020-49.826-35.14-69.946-22.212-22.214-51.080-35.476-77.218-35.476-10.524 0-25.298 2.228-35.916 12.848-21.406 21.404-17.376 73.132 22.626 113.136 22.212 22.214 51.080 35.476 77.218 35.476 10.524 0 25.298-2.228 35.916-12.848 13.112-13.11 13.47-32.688 12.514-43.19zM512 352c-35.346 0-64 28.654-64 64s28.654 64 64 64 64-28.654 64-64-28.654-64-64-64zM819.152 108.848c-10.62-10.62-25.392-12.848-35.916-12.848-26.138 0-55.006 13.262-77.218 35.476-20.122 20.12-32.928 45.614-35.138 69.946-0.958 10.502-0.6 30.080 12.514 43.192 10.618 10.622 25.39 12.848 35.916 12.848 26.136 0 55.006-13.262 77.216-35.474 40.004-40.008 44.032-91.736 22.626-113.14z" />
+<glyph unicode="&#xe008;" glyph-name="paste" d="M704 576v160c0 17.6-14.4 32-32 32h-160v64c0 35.2-28.8 64-64 64h-128c-35.204 0-64-28.8-64-64v-64h-160c-17.602 0-32-14.4-32-32v-512c0-17.6 14.398-32 32-32h224v-192h384l192 192v384h-192zM320 831.886c0.034 0.038 0.072 0.078 0.114 0.114h127.768c0.042-0.036 0.082-0.076 0.118-0.114v-63.886h-128v63.886zM192 640v64h384v-64h-384zM704 90.51v101.49h101.49l-101.49-101.49zM832 256h-192v-192h-256v448h448v-256z" />
+<glyph unicode="&#xe009;" glyph-name="searchreplace" d="M888 576h-56v256h64v64h-320v-64h64v-256h-256v256h64v64h-320v-64h64v-256h-56c-39.6 0-72-32.4-72-72v-432c0-39.6 32.4-72 72-72h240c39.6 0 72 32.4 72 72v312h128v-312c0-39.6 32.4-72 72-72h240c39.6 0 72 32.4 72 72v432c0 39.6-32.4 72-72 72zM348 64h-184c-19.8 0-36 14.4-36 32s16.2 32 36 32h184c19.8 0 36-14.4 36-32s-16.2-32-36-32zM544 448h-64c-17.6 0-32 14.4-32 32s14.4 32 32 32h64c17.6 0 32-14.4 32-32s-14.4-32-32-32zM860 64h-184c-19.8 0-36 14.4-36 32s16.2 32 36 32h184c19.8 0 36-14.4 36-32s-16.2-32-36-32z" />
+<glyph unicode="&#xe00a;" glyph-name="bullist" d="M384 832h576v-128h-576zM384 512h576v-128h-576zM384 192h576v-128h-576zM128 768c0-35.346 28.654-64 64-64s64 28.654 64 64c0 35.346-28.654 64-64 64s-64-28.654-64-64zM128 448c0-35.346 28.654-64 64-64s64 28.654 64 64c0 35.346-28.654 64-64 64s-64-28.654-64-64zM128 128c0-35.346 28.654-64 64-64s64 28.654 64 64c0 35.346-28.654 64-64 64s-64-28.654-64-64z" />
+<glyph unicode="&#xe00b;" glyph-name="numlist" d="M384 832h576v-128h-576zM384 512h576v-128h-576zM384 192h576v-128h-576zM320 430v146h-64v320h-128v-64h64v-256h-64v-64h128v-50l-128-60v-146h128v-64h-128v-64h128v-64h-128v-64h192v320h-128v50z" />
+<glyph unicode="&#xe00c;" glyph-name="indent" d="M64 768h896v-128h-896zM384 384h576v-128h-576zM384 576h576v-128h-576zM64 192h896v-128h-896zM64 576l224-160-224-160z" />
+<glyph unicode="&#xe00d;" glyph-name="outdent" d="M64 768h896v-128h-896zM64 384h576v-128h-576zM64 576h576v-128h-576zM64 192h896v-128h-896zM960 576l-224-160 224-160z" />
+<glyph unicode="&#xe00e;" glyph-name="blockquote" d="M256.428 535.274c105.8 0 191.572-91.17 191.572-203.638 0-112.464-85.772-203.636-191.572-203.636-105.802 0-191.572 91.17-191.572 203.636l-0.856 29.092c0 224.93 171.54 407.272 383.144 407.272v-116.364c-73.1 0-141.826-30.26-193.516-85.204-9.954-10.578-19.034-21.834-27.224-33.656 9.784 1.64 19.806 2.498 30.024 2.498zM768.428 535.274c105.8 0 191.572-91.17 191.572-203.638 0-112.464-85.772-203.636-191.572-203.636-105.802 0-191.572 91.17-191.572 203.636l-0.856 29.092c0 224.93 171.54 407.272 383.144 407.272v-116.364c-73.1 0-141.826-30.26-193.516-85.204-9.956-10.578-19.036-21.834-27.224-33.656 9.784 1.64 19.806 2.498 30.024 2.498z" />
+<glyph unicode="&#xe00f;" glyph-name="undo" d="M704 0c59 199 134.906 455.266-256 446.096v-222.096l-336.002 336 336.002 336v-217.326c468.092 12.2 544-358.674 256-678.674z" />
+<glyph unicode="&#xe010;" glyph-name="redo" d="M576 678.674v217.326l336.002-336-336.002-336v222.096c-390.906 9.17-315-247.096-256-446.096-288 320-212.092 690.874 256 678.674z" />
+<glyph unicode="&#xe011;" glyph-name="unlink" d="M927.274 729.784l-133.49 133.488c-21.104 21.104-49.232 32.728-79.198 32.728s-58.094-11.624-79.196-32.726l-165.492-165.49c-43.668-43.668-43.668-114.724 0-158.392l2.746-2.746 67.882 67.882-2.746 2.746c-6.132 6.132-6.132 16.494 0 22.626l165.492 165.492c4.010 4.008 8.808 4.608 11.312 4.608s7.302-0.598 11.312-4.61l133.49-133.488c6.132-6.134 6.132-16.498 0.002-22.628l-165.494-165.494c-4.008-4.008-8.806-4.608-11.31-4.608s-7.302 0.6-11.312 4.612l-2.746 2.746-67.88-67.884 2.742-2.742c21.106-21.108 49.23-32.728 79.2-32.728s58.094 11.624 79.196 32.726l165.494 165.492c43.662 43.666 43.662 114.72-0.004 158.39zM551.356 359.356l-67.882-67.882 2.746-2.746c4.008-4.008 4.61-8.806 4.61-11.31 0-2.506-0.598-7.302-4.606-11.314l-165.494-165.49c-4.010-4.010-8.81-4.61-11.314-4.61s-7.304 0.6-11.314 4.61l-133.492 133.486c-4.010 4.010-4.61 8.81-4.61 11.314s0.598 7.3 4.61 11.312l165.49 165.488c4.010 4.012 8.81 4.612 11.314 4.612s7.304-0.6 11.314-4.612l2.746-2.742 67.882 67.88-2.746 2.746c-21.104 21.104-49.23 32.726-79.196 32.726s-58.092-11.624-79.196-32.726l-165.488-165.486c-21.106-21.104-32.73-49.234-32.73-79.198s11.624-58.094 32.726-79.198l133.49-133.49c21.106-21.102 49.232-32.726 79.198-32.726s58.092 11.624 79.196 32.726l165.494 165.492c21.104 21.104 32.722 49.23 32.722 79.196s-11.624 58.094-32.726 79.196l-2.744 2.746zM352 250c-9.724 0-19.45 3.71-26.87 11.128-14.84 14.84-14.84 38.898 0 53.738l320 320c14.84 14.84 38.896 14.84 53.736 0 14.844-14.84 14.844-38.9 0-53.74l-320-320c-7.416-7.416-17.142-11.126-26.866-11.126z" />
+<glyph unicode="&#xe012;" glyph-name="link" d="M927.274 729.784l-133.49 133.488c-21.104 21.104-49.232 32.728-79.198 32.728s-58.094-11.624-79.196-32.726l-165.492-165.49c-43.668-43.668-43.668-114.724 0-158.392l2.746-2.746 67.882 67.882-2.746 2.746c-6.132 6.132-6.132 16.494 0 22.626l165.492 165.492c4.010 4.008 8.808 4.608 11.312 4.608s7.302-0.598 11.312-4.61l133.49-133.488c6.132-6.134 6.132-16.498 0.002-22.628l-165.494-165.494c-4.008-4.008-8.806-4.608-11.31-4.608s-7.302 0.6-11.312 4.612l-2.746 2.746-67.88-67.884 2.742-2.742c21.106-21.108 49.23-32.728 79.2-32.728s58.094 11.624 79.196 32.726l165.494 165.492c43.662 43.666 43.662 114.72-0.004 158.39zM551.356 359.356l-67.882-67.882 2.746-2.746c4.008-4.008 4.61-8.806 4.61-11.31 0-2.506-0.598-7.302-4.606-11.314l-165.494-165.49c-4.010-4.010-8.81-4.61-11.314-4.61s-7.304 0.6-11.314 4.61l-133.492 133.486c-4.010 4.010-4.61 8.81-4.61 11.314s0.598 7.3 4.61 11.312l165.49 165.488c4.010 4.012 8.81 4.612 11.314 4.612s7.304-0.6 11.314-4.612l2.746-2.742 67.882 67.88-2.746 2.746c-21.104 21.104-49.23 32.726-79.196 32.726s-58.092-11.624-79.196-32.726l-165.488-165.486c-21.106-21.104-32.73-49.234-32.73-79.198s11.624-58.094 32.726-79.198l133.49-133.49c21.106-21.102 49.232-32.726 79.198-32.726s58.092 11.624 79.196 32.726l165.494 165.492c21.104 21.104 32.722 49.23 32.722 79.196s-11.624 58.094-32.726 79.196l-2.744 2.746zM800 122c-9.724 0-19.45 3.708-26.87 11.13l-128 127.998c-14.844 14.84-14.844 38.898 0 53.738 14.84 14.844 38.896 14.844 53.736 0l128-128c14.844-14.84 14.844-38.896 0-53.736-7.416-7.422-17.142-11.13-26.866-11.13zM608 0c-17.674 0-32 14.326-32 32v128c0 17.674 14.326 32 32 32s32-14.326 32-32v-128c0-17.674-14.326-32-32-32zM928 320h-128c-17.674 0-32 14.326-32 32s14.326 32 32 32h128c17.674 0 32-14.326 32-32s-14.326-32-32-32zM224 774c9.724 0 19.45-3.708 26.87-11.13l128-128c14.842-14.84 14.842-38.898 0-53.738-14.84-14.844-38.898-14.844-53.738 0l-128 128c-14.842 14.84-14.842 38.898 0 53.738 7.418 7.422 17.144 11.13 26.868 11.13zM416 896c17.674 0 32-14.326 32-32v-128c0-17.674-14.326-32-32-32s-32 14.326-32 32v128c0 17.674 14.326 32 32 32zM96 576h128c17.674 0 32-14.326 32-32s-14.326-32-32-32h-128c-17.674 0-32 14.326-32 32s14.326 32 32 32z" />
+<glyph unicode="&#xe013;" glyph-name="bookmark" d="M256 896v-896l256 256 256-256v896h-512zM704 170.51l-192 192-192-192v661.49h384v-661.49z" />
+<glyph unicode="&#xe014;" glyph-name="image" d="M896 832h-768c-35.2 0-64-28.8-64-64v-640c0-35.2 28.8-64 64-64h768c35.2 0 64 28.8 64 64v640c0 35.2-28.8 64-64 64zM896 128.116c-0.012-0.014-0.030-0.028-0.042-0.042l-191.958 319.926-160-128-224 288-191.968-479.916c-0.010 0.010-0.022 0.022-0.032 0.032v639.77c0.034 0.040 0.076 0.082 0.114 0.114h767.77c0.040-0.034 0.082-0.076 0.116-0.116v-639.768zM640 608c0-53.019 42.981-96 96-96s96 42.981 96 96c0 53.019-42.981 96-96 96s-96-42.981-96-96z" />
+<glyph unicode="&#xe015;" glyph-name="media" d="M896 832h-768c-35.2 0-64-28.8-64-64v-640c0-35.2 28.8-64 64-64h768c35.2 0 64 28.8 64 64v640c0 35.2-28.8 64-64 64zM256 128h-128v128h128v-128zM256 384h-128v128h128v-128zM256 640h-128v128h128v-128zM704 128h-384v640h384v-640zM896 128h-128v128h128v-128zM896 384h-128v128h128v-128zM896 640h-128v128h128v-128zM384 640v-384l288 192z" />
+<glyph unicode="&#xe016;" glyph-name="help" d="M448 256h128v-128h-128v128zM704 704c35.346 0 64-28.654 64-64v-166l-228-154h-92v64l192 128v64h-320v128h384zM512 896c-119.666 0-232.166-46.6-316.784-131.216-84.614-84.618-131.216-197.118-131.216-316.784 0-119.664 46.602-232.168 131.216-316.784 84.618-84.616 197.118-131.216 316.784-131.216 119.664 0 232.168 46.6 316.784 131.216s131.216 197.12 131.216 316.784c0 119.666-46.6 232.166-131.216 316.784-84.616 84.616-197.12 131.216-316.784 131.216z" />
+<glyph unicode="&#xe017;" glyph-name="code" d="M416 256l-192 192 192 192-64 64-256-256 256-256zM672 704l-64-64 192-192-192-192 64-64 256 256z" />
+<glyph unicode="&#xe018;" glyph-name="insertdatetime" d="M77.798 655.376l81.414-50.882c50.802 81.114 128.788 143.454 221.208 174.246l-30.366 91.094c-113.748-37.898-209.728-114.626-272.256-214.458zM673.946 869.834l-30.366-91.094c92.422-30.792 170.404-93.132 221.208-174.248l81.412 50.882c-62.526 99.834-158.506 176.562-272.254 214.46zM607.974 255.992c-4.808 0-9.692 1.090-14.286 3.386l-145.688 72.844v211.778c0 17.672 14.328 32 32 32s32-14.328 32-32v-172.222l110.31-55.156c15.806-7.902 22.214-27.124 14.31-42.932-5.604-11.214-16.908-17.696-28.646-17.698zM512 768c-212.078 0-384-171.922-384-384s171.922-384 384-384c212.078 0 384 171.922 384 384s-171.922 384-384 384zM512 96c-159.058 0-288 128.942-288 288s128.942 288 288 288c159.058 0 288-128.942 288-288s-128.942-288-288-288z" />
+<glyph unicode="&#xe019;" glyph-name="preview" d="M64 504.254c45.318 49.92 97.162 92.36 153.272 125.124 90.332 52.744 192.246 80.622 294.728 80.622 102.48 0 204.396-27.878 294.726-80.624 56.112-32.764 107.956-75.204 153.274-125.124v117.432c-33.010 28.118-68.124 53.14-104.868 74.594-105.006 61.314-223.658 93.722-343.132 93.722s-238.128-32.408-343.134-93.72c-36.742-21.454-71.856-46.478-104.866-74.596v-117.43zM512 640c-183.196 0-345.838-100.556-448-256 102.162-155.448 264.804-256 448-256s345.838 100.552 448 256c-102.162 155.444-264.804 256-448 256zM512 448c0-35.346-28.654-64-64-64s-64 28.654-64 64c0 35.348 28.654 64 64 64s64-28.652 64-64zM728.066 263.338c-67.434-39.374-140.128-59.338-216.066-59.338s-148.632 19.964-216.066 59.338c-51.554 30.104-98.616 71.31-138.114 120.662 39.498 49.35 86.56 90.558 138.116 120.66 13.276 7.752 26.758 14.74 40.426 20.982-10.512-23.742-16.362-50.008-16.362-77.642 0-106.040 85.962-192 192-192 106.040 0 192 85.96 192 192 0 27.634-5.85 53.9-16.36 77.642 13.668-6.244 27.15-13.23 40.426-20.982 51.554-30.102 98.616-71.31 138.116-120.66-39.498-49.352-86.56-90.558-138.116-120.662z" />
+<glyph unicode="&#xe01a;" glyph-name="forecolor" d="M651.168 676.166c-24.612 81.962-28.876 91.834-107.168 91.834h-64c-79.618 0-82.664-10.152-108.418-96 0-0.002 0-0.002-0.002-0.004l-143.998-479.996h113.636l57.6 192h226.366l57.6-192h113.63l-145.246 484.166zM437.218 512l38.4 136c10.086 33.618 36.38 30 36.38 30s26.294 3.618 36.38-30h0.004l38.4-136h-149.564z" />
+<glyph unicode="&#xe01b;" glyph-name="table" d="M64 768v-704h896v704h-896zM384 320v128h256v-128h-256zM640 256v-128h-256v128h256zM640 640v-128h-256v128h256zM320 640v-128h-192v128h192zM128 448h192v-128h-192v128zM704 448h192v-128h-192v128zM704 512v128h192v-128h-192zM128 256h192v-128h-192v128zM704 128v128h192v-128h-192z" />
+<glyph unicode="&#xe01c;" glyph-name="hr" d="M64 512h896v-128h-896z" />
+<glyph unicode="&#xe01d;" glyph-name="removeformat" d="M64 192h512v-128h-512v128zM768 768h-220.558l-183.766-512h-132.288l183.762 512h-223.15v128h576v-128zM929.774 64l-129.774 129.774-129.774-129.774-62.226 62.226 129.774 129.774-129.774 129.774 62.226 62.226 129.774-129.774 129.774 129.774 62.226-62.226-129.774-129.774 129.774-129.774-62.226-62.226z" />
+<glyph unicode="&#xe01e;" glyph-name="subscript" d="M768 50v-50h128v-64h-192v146l128 60v50h-128v64h192v-146zM676 704h-136l-188-188-188 188h-136l256-256-256-256h136l188 188 188-188h136l-256 256z" />
+<glyph unicode="&#xe01f;" glyph-name="superscript" d="M768 754v-50h128v-64h-192v146l128 60v50h-128v64h192v-146zM676 704h-136l-188-188-188 188h-136l256-256-256-256h136l188 188 188-188h136l-256 256z" />
+<glyph unicode="&#xe020;" glyph-name="charmap" d="M704 128v37.004c151.348 61.628 256 193.82 256 346.996 0 212.078-200.576 384-448 384s-448-171.922-448-384c0-153.176 104.654-285.368 256-346.996v-37.004h-192l-64 96v-224h320v222.812c-100.9 51.362-170.666 161.54-170.666 289.188 0 176.732 133.718 320 298.666 320s298.666-143.268 298.666-320c0-127.648-69.766-237.826-170.666-289.188v-222.812h320v224l-64-96h-192z" />
+<glyph unicode="&#xe021;" glyph-name="emoticons" d="M512 820c99.366 0 192.782-38.694 263.042-108.956s108.958-163.678 108.958-263.044-38.696-192.782-108.958-263.042-163.676-108.958-263.042-108.958-192.782 38.696-263.044 108.958-108.956 163.676-108.956 263.042 38.694 192.782 108.956 263.044 163.678 108.956 263.044 108.956zM512 896c-247.424 0-448-200.576-448-448s200.576-448 448-448 448 200.576 448 448-200.576 448-448 448v0zM320 576c0-35.346 28.654-64 64-64s64 28.654 64 64c0 35.346-28.654 64-64 64s-64-28.654-64-64zM576 576c0-35.346 28.654-64 64-64s64 28.654 64 64c0 35.346-28.654 64-64 64s-64-28.654-64-64zM512 304c-101.84 0-192.56 36.874-251.166 94.328 23.126-117.608 126.778-206.328 251.166-206.328s228.040 88.72 251.168 206.328c-58.608-57.454-149.328-94.328-251.168-94.328z" />
+<glyph unicode="&#xe022;" glyph-name="print" d="M256 832h512v-128h-512v128zM896 640h-768c-35.2 0-64-28.8-64-64v-256c0-35.2 28.796-64 64-64h128v-192h512v192h128c35.2 0 64 28.8 64 64v256c0 35.2-28.8 64-64 64zM704 128h-384v256h384v-256zM910.4 544c0-25.626-20.774-46.4-46.398-46.4s-46.402 20.774-46.402 46.4 20.778 46.4 46.402 46.4c25.626 0 46.398-20.774 46.398-46.4z" />
+<glyph unicode="&#xe023;" glyph-name="fullscreen" d="M480 576l-192 192 128 128h-352v-352l128 128 192-192zM640 480l192 192 128-128v352h-352l128-128-192-192zM544 320l192-192-128-128h352v352l-128-128-192 192zM384 416l-192-192-128 128v-352h352l-128 128 192 192z" />
+<glyph unicode="&#xe024;" glyph-name="spellcheck" d="M960 832v64h-192c-35.202 0-64-28.8-64-64v-320c0-15.856 5.858-30.402 15.496-41.614l-303.496-260.386-142 148-82-70 224-288 416 448h128v64h-192v320h192zM256 448h64v384c0 35.2-28.8 64-64 64h-128c-35.2 0-64-28.8-64-64v-384h64v192h128v-192zM128 704v128h128v-128h-128zM640 512v96c0 35.2-8.8 64-44 64 35.2 0 44 28.8 44 64v96c0 35.2-28.8 64-64 64h-192v-448h192c35.2 0 64 28.8 64 64zM448 832h128v-128h-128v128zM448 640h128v-128h-128v128z" />
+<glyph unicode="&#xe025;" glyph-name="nonbreaking" d="M448 448h-128v128h128v128h128v-128h128v-128h-128v-128h-128v128zM960 384v-320h-896v320h128v-192h640v192h128z" />
+<glyph unicode="&#xe026;" glyph-name="template" d="M512 576h128v-64h-128zM512 192h128v-64h-128zM576 384h128v-64h-128zM768 384v-192h-64v-64h128v256zM384 384h128v-64h-128zM320 192h128v-64h-128zM320 576h128v-64h-128zM192 768v-256h64v192h64v64zM704 512h128v256h-64v-192h-64zM64 896v-896h896v896h-896zM896 64h-768v768h768v-768zM192 384v-256h64v192h64v64zM576 768h128v-64h-128zM384 768h128v-64h-128z" />
+<glyph unicode="&#xe027;" glyph-name="pagebreak" d="M816 896l16-384h-640l16 384h32l16-320h512l16 320h32zM208 0l-16 320h640l-16-320h-32l-16 256h-512l-16-256h-32zM64 448h128v-64h-128zM256 448h128v-64h-128zM448 448h128v-64h-128zM640 448h128v-64h-128zM832 448h128v-64h-128z" />
+<glyph unicode="&#xe028;" glyph-name="restoredraft" d="M576 896c247.424 0 448-200.576 448-448s-200.576-448-448-448v96c94.024 0 182.418 36.614 248.902 103.098s103.098 154.878 103.098 248.902c0 94.022-36.614 182.418-103.098 248.902s-154.878 103.098-248.902 103.098c-94.022 0-182.418-36.614-248.902-103.098-51.14-51.138-84.582-115.246-97.306-184.902h186.208l-224-256-224 256h164.57c31.060 217.102 217.738 384 443.43 384zM768 512v-128h-256v320h128v-192z" />
+<glyph unicode="&#xe02a;" glyph-name="bold" d="M625.442 465.818c48.074 38.15 78.558 94.856 78.558 158.182 0 114.876-100.29 208-224 208h-224v-768h288c123.712 0 224 93.124 224 208 0 88.196-59.118 163.562-142.558 193.818zM384 656c0 26.51 21.49 48 48 48h67.204c42.414 0 76.796-42.98 76.796-96s-34.382-96-76.796-96h-115.204v144zM547.2 192h-115.2c-26.51 0-48 21.49-48 48v144h163.2c42.418 0 76.8-42.98 76.8-96s-34.382-96-76.8-96z" />
+<glyph unicode="&#xe02b;" glyph-name="italic" d="M832 832v-64h-144l-256-640h144v-64h-448v64h144l256 640h-144v64h448z" />
+<glyph unicode="&#xe02c;" glyph-name="underline" d="M192 128h576v-64h-576v64zM640 832v-384c0-31.312-14.7-61.624-41.39-85.352-30.942-27.502-73.068-42.648-118.61-42.648-45.544 0-87.668 15.146-118.608 42.648-26.692 23.728-41.392 54.040-41.392 85.352v384h-128v-384c0-141.382 128.942-256 288-256s288 114.618 288 256v384h-128z" />
+<glyph unicode="&#xe02d;" glyph-name="strikethrough" d="M960 448h-265.876c-50.078 35.42-114.43 54.86-182.124 54.86-89.206 0-164.572 50.242-164.572 109.712s75.366 109.714 164.572 109.714c75.058 0 140.308-35.576 159.12-82.286h113.016c-7.93 50.644-37.58 97.968-84.058 132.826-50.88 38.16-117.676 59.174-188.078 59.174-70.404 0-137.196-21.014-188.074-59.174-54.788-41.090-86.212-99.502-86.212-160.254s31.424-119.164 86.212-160.254c1.956-1.466 3.942-2.898 5.946-4.316h-265.872v-64h512.532c58.208-17.106 100.042-56.27 100.042-100.572 0-59.468-75.368-109.71-164.572-109.71-75.060 0-140.308 35.574-159.118 82.286h-113.016c7.93-50.64 37.582-97.968 84.060-132.826 50.876-38.164 117.668-59.18 188.072-59.18 70.402 0 137.198 21.016 188.074 59.174 54.79 41.090 86.208 99.502 86.208 160.254 0 35.298-10.654 69.792-30.294 100.572h204.012v64z" />
+<glyph unicode="&#xe02e;" glyph-name="visualchars" d="M384 832c-123.712 0-224-100.288-224-224s100.288-224 224-224v-320h128v640h64v-640h128v640h128v128h-448z" />
+<glyph unicode="&#xe02f;" glyph-name="ltr" d="M448 832c-123.712 0-224-100.288-224-224s100.288-224 224-224v-320h128v640h64v-640h128v640h128v128h-448zM64 64l224 192-224 192z" />
+<glyph unicode="&#xe030;" glyph-name="rtl" d="M320 832c-123.712 0-224-100.288-224-224s100.288-224 224-224v-320h128v640h64v-640h128v640h128v128h-448zM960 448l-224-192 224-192z" />
+<glyph unicode="&#xe031;" glyph-name="copy" d="M832 640h-192v64l-192 192h-384v-704h384v-192h576v448l-192 192zM832 549.49l101.49-101.49h-101.49v101.49zM448 805.49l101.49-101.49h-101.49v101.49zM128 832h256v-192h192v-384h-448v576zM960 64h-448v128h128v384h128v-192h192v-320z" />
+<glyph unicode="&#xe032;" glyph-name="resize" d="M768 704h64v-64h-64zM640 576h64v-64h-64zM640 448h64v-64h-64zM640 320h64v-64h-64zM512 448h64v-64h-64zM512 320h64v-64h-64zM384 320h64v-64h-64zM768 576h64v-64h-64zM768 448h64v-64h-64zM768 320h64v-64h-64zM768 192h64v-64h-64zM640 192h64v-64h-64zM512 192h64v-64h-64zM384 192h64v-64h-64zM256 192h64v-64h-64z" />
+<glyph unicode="&#xe034;" glyph-name="browse" d="M928 832h-416l-32 64h-352l-64-128h896zM840.34 256h87.66l32 448h-896l64-640h356.080c-104.882 37.776-180.080 138.266-180.080 256 0 149.982 122.018 272 272 272 149.98 0 272-122.018 272-272 0-21.678-2.622-43.15-7.66-64zM874.996 110.25l-134.496 110.692c17.454 28.922 27.5 62.814 27.5 99.058 0 106.040-85.96 192-192 192s-192-85.96-192-192 85.96-192 192-192c36.244 0 70.138 10.046 99.058 27.5l110.692-134.496c22.962-26.678 62.118-28.14 87.006-3.252l5.492 5.492c24.888 24.888 23.426 64.044-3.252 87.006zM576 196c-68.484 0-124 55.516-124 124s55.516 124 124 124 124-55.516 124-124-55.516-124-124-124z" />
+<glyph unicode="&#xe035;" glyph-name="pastetext" d="M704 576v160c0 17.6-14.4 32-32 32h-160v64c0 35.2-28.8 64-64 64h-128c-35.204 0-64-28.8-64-64v-64h-160c-17.602 0-32-14.4-32-32v-512c0-17.6 14.398-32 32-32h224v-192h576v576h-192zM320 831.886c0.034 0.038 0.072 0.078 0.114 0.114h127.768c0.042-0.036 0.082-0.076 0.118-0.114v-63.886h-128v63.886zM192 640v64h384v-64h-384zM832 64h-448v448h448v-448zM448 448v-128h32l32 64h64v-192h-48v-64h160v64h-48v192h64l32-64h32v128z" />
+<glyph unicode="&#xe603;" glyph-name="codesample" d="M200.015 577.994v103.994c0 43.077 34.919 77.997 77.997 77.997h26v103.994h-26c-100.51 0-181.991-81.481-181.991-181.991v-103.994c0-43.077-34.919-77.997-77.997-77.997h-26v-103.994h26c43.077 0 77.997-34.919 77.997-77.997v-103.994c0-100.509 81.481-181.991 181.991-181.991h26v103.994h-26c-43.077 0-77.997 34.919-77.997 77.997v103.994c0 50.927-20.928 96.961-54.642 129.994 33.714 33.032 54.642 79.065 54.642 129.994zM823.985 577.994v103.994c0 43.077-34.919 77.997-77.997 77.997h-26v103.994h26c100.509 0 181.991-81.481 181.991-181.991v-103.994c0-43.077 34.919-77.997 77.997-77.997h26v-103.994h-26c-43.077 0-77.997-34.919-77.997-77.997v-103.994c0-100.509-81.482-181.991-181.991-181.991h-26v103.994h26c43.077 0 77.997 34.919 77.997 77.997v103.994c0 50.927 20.928 96.961 54.642 129.994-33.714 33.032-54.642 79.065-54.642 129.994zM615.997 603.277c0-57.435-46.56-103.994-103.994-103.994s-103.994 46.56-103.994 103.994c0 57.435 46.56 103.994 103.994 103.994s103.994-46.56 103.994-103.994zM512 448.717c-57.435 0-103.994-46.56-103.994-103.994 0-55.841 26-100.107 105.747-103.875-23.715-33.413-59.437-46.608-105.747-50.94v-61.747c0 0 207.991-18.144 207.991 216.561-0.202 57.437-46.56 103.996-103.994 103.996z" />
+</font></defs></svg>
\ No newline at end of file

public/assets/tinymce/skins/lightgray/fonts/tinymce.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>Generated by IcoMoon</metadata>
+<defs>
+<font id="tinymce" horiz-adv-x="1024">
+<font-face units-per-em="1024" ascent="960" descent="-64" />
+<missing-glyph horiz-adv-x="1024" />
+<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
+<glyph unicode="&#xe000;" glyph-name="save" d="M896 960h-896v-1024h1024v896l-128 128zM512 832h128v-256h-128v256zM896 64h-768v768h64v-320h576v320h74.978l53.022-53.018v-714.982z" />
+<glyph unicode="&#xe001;" glyph-name="newdocument" d="M903.432 760.57l-142.864 142.862c-31.112 31.112-92.568 56.568-136.568 56.568h-480c-44 0-80-36-80-80v-864c0-44 36-80 80-80h736c44 0 80 36 80 80v608c0 44-25.456 105.458-56.568 136.57zM858.178 715.314c3.13-3.13 6.25-6.974 9.28-11.314h-163.458v163.456c4.34-3.030 8.184-6.15 11.314-9.28l142.864-142.862zM896 16c0-8.672-7.328-16-16-16h-736c-8.672 0-16 7.328-16 16v864c0 8.672 7.328 16 16 16h480c4.832 0 10.254-0.61 16-1.704v-254.296h254.296c1.094-5.746 1.704-11.166 1.704-16v-608z" />
+<glyph unicode="&#xe002;" glyph-name="fullpage" d="M1024 367.542v160.916l-159.144 15.914c-8.186 30.042-20.088 58.548-35.21 84.98l104.596 127.838-113.052 113.050-127.836-104.596c-26.434 15.124-54.942 27.026-84.982 35.208l-15.914 159.148h-160.916l-15.914-159.146c-30.042-8.186-58.548-20.086-84.98-35.208l-127.838 104.594-113.050-113.050 104.596-127.836c-15.124-26.432-27.026-54.94-35.21-84.98l-159.146-15.916v-160.916l159.146-15.914c8.186-30.042 20.086-58.548 35.21-84.982l-104.596-127.836 113.048-113.048 127.838 104.596c26.432-15.124 54.94-27.028 84.98-35.21l15.916-159.148h160.916l15.914 159.144c30.042 8.186 58.548 20.088 84.982 35.21l127.836-104.596 113.048 113.048-104.596 127.836c15.124 26.434 27.028 54.942 35.21 84.98l159.148 15.92zM704 384l-128-128h-128l-128 128v128l128 128h128l128-128v-128z" />
+<glyph unicode="&#xe003;" glyph-name="alignleft" d="M0 896h1024v-128h-1024zM0 704h640v-128h-640zM0 320h640v-128h-640zM0 512h1024v-128h-1024zM0 128h1024v-128h-1024z" />
+<glyph unicode="&#xe004;" glyph-name="aligncenter" d="M0 896h1024v-128h-1024zM192 704h640v-128h-640zM192 320h640v-128h-640zM0 512h1024v-128h-1024zM0 128h1024v-128h-1024z" />
+<glyph unicode="&#xe005;" glyph-name="alignright" d="M0 896h1024v-128h-1024zM384 704h640v-128h-640zM384 320h640v-128h-640zM0 512h1024v-128h-1024zM0 128h1024v-128h-1024z" />
+<glyph unicode="&#xe006;" glyph-name="alignjustify" d="M0 896h1024v-128h-1024zM0 704h1024v-128h-1024zM0 512h1024v-128h-1024zM0 320h1024v-128h-1024zM0 128h1024v-128h-1024z" />
+<glyph unicode="&#xe007;" glyph-name="cut" d="M890.774 250.846c-45.654 45.556-103.728 69.072-157.946 69.072h-29.112l-63.904 64.008 255.62 256.038c63.904 64.010 63.904 192.028 0 256.038l-383.43-384.056-383.432 384.054c-63.904-64.008-63.904-192.028 0-256.038l255.622-256.034-63.906-64.008h-29.114c-54.22 0-112.292-23.518-157.948-69.076-81.622-81.442-92.65-202.484-24.63-270.35 29.97-29.902 70.288-44.494 112.996-44.494 54.216 0 112.29 23.514 157.946 69.072 53.584 53.464 76.742 124 67.084 185.348l65.384 65.488 65.376-65.488c-9.656-61.348 13.506-131.882 67.084-185.348 45.662-45.558 103.732-69.072 157.948-69.072 42.708 0 83.024 14.592 112.994 44.496 68.020 67.866 56.988 188.908-24.632 270.35zM353.024 114.462c-7.698-17.882-19.010-34.346-33.626-48.926-14.636-14.604-31.172-25.918-49.148-33.624-16.132-6.916-32.96-10.568-48.662-10.568-15.146 0-36.612 3.402-52.862 19.612-16.136 16.104-19.52 37.318-19.52 52.288 0 15.542 3.642 32.21 10.526 48.212 7.7 17.884 19.014 34.346 33.626 48.926 14.634 14.606 31.172 25.914 49.15 33.624 16.134 6.914 32.96 10.568 48.664 10.568 15.146 0 36.612-3.4 52.858-19.614 16.134-16.098 19.522-37.316 19.522-52.284 0.002-15.542-3.638-32.216-10.528-48.214zM512.004 293.404c-49.914 0-90.376 40.532-90.376 90.526 0 49.992 40.462 90.52 90.376 90.52s90.372-40.528 90.372-90.52c0-49.998-40.46-90.526-90.372-90.526zM855.272 40.958c-16.248-16.208-37.712-19.612-52.86-19.612-15.704 0-32.53 3.652-48.666 10.568-17.972 7.706-34.508 19.020-49.142 33.624-14.614 14.58-25.926 31.042-33.626 48.926-6.886 15.998-10.526 32.672-10.526 48.212 0 14.966 3.384 36.188 19.52 52.286 16.246 16.208 37.712 19.614 52.86 19.614 15.7 0 32.53-3.654 48.66-10.568 17.978-7.708 34.516-19.018 49.15-33.624 14.61-14.58 25.924-31.042 33.626-48.926 6.884-15.998 10.526-32.67 10.526-48.212-0.002-14.97-3.39-36.186-19.522-52.288z" />
+<glyph unicode="&#xe008;" glyph-name="paste" d="M832 640v160c0 17.6-14.4 32-32 32h-224v64c0 35.2-28.8 64-64 64h-128c-35.204 0-64-28.8-64-64v-64h-224c-17.602 0-32-14.4-32-32v-640c0-17.6 14.398-32 32-32h288v-192h448l192 192v512h-192zM384 895.886c0.034 0.038 0.072 0.078 0.114 0.114h127.768c0.042-0.036 0.082-0.076 0.118-0.114v-63.886h-128v63.886zM192 704v64h512v-64h-512zM832 26.51v101.49h101.49l-101.49-101.49zM960 192h-192v-192h-320v576h512v-384z" />
+<glyph unicode="&#xe009;" glyph-name="searchreplace" d="M64 960h384v-64h-384zM576 960h384v-64h-384zM952 640h-56v256h-256v-256h-256v256h-256v-256h-56c-39.6 0-72-32.4-72-72v-560c0-39.6 32.4-72 72-72h304c39.6 0 72 32.4 72 72v376h128v-376c0-39.6 32.4-72 72-72h304c39.6 0 72 32.4 72 72v560c0 39.6-32.4 72-72 72zM348 0h-248c-19.8 0-36 14.4-36 32s16.2 32 36 32h248c19.8 0 36-14.4 36-32s-16.2-32-36-32zM544 448h-64c-17.6 0-32 14.4-32 32s14.4 32 32 32h64c17.6 0 32-14.4 32-32s-14.4-32-32-32zM924 0h-248c-19.8 0-36 14.4-36 32s16.2 32 36 32h248c19.8 0 36-14.4 36-32s-16.2-32-36-32z" />
+<glyph unicode="&#xe00a;" glyph-name="bullist" d="M384 896h640v-128h-640v128zM384 512h640v-128h-640v128zM384 128h640v-128h-640v128zM0 832c0 70.692 57.308 128 128 128s128-57.308 128-128c0-70.692-57.308-128-128-128s-128 57.308-128 128zM0 448c0 70.692 57.308 128 128 128s128-57.308 128-128c0-70.692-57.308-128-128-128s-128 57.308-128 128zM0 64c0 70.692 57.308 128 128 128s128-57.308 128-128c0-70.692-57.308-128-128-128s-128 57.308-128 128z" />
+<glyph unicode="&#xe00b;" glyph-name="numlist" d="M384 128h640v-128h-640zM384 512h640v-128h-640zM384 896h640v-128h-640zM192 960v-256h-64v192h-64v64zM128 434v-50h128v-64h-192v146l128 60v50h-128v64h192v-146zM256 256v-320h-192v64h128v64h-128v64h128v64h-128v64z" />
+<glyph unicode="&#xe00c;" glyph-name="indent" d="M0 896h1024v-128h-1024zM384 704h640v-128h-640zM384 512h640v-128h-640zM384 320h640v-128h-640zM0 128h1024v-128h-1024zM0 256v384l256-192z" />
+<glyph unicode="&#xe00d;" glyph-name="outdent" d="M0 896h1024v-128h-1024zM384 704h640v-128h-640zM384 512h640v-128h-640zM384 320h640v-128h-640zM0 128h1024v-128h-1024zM256 640v-384l-256 192z" />
+<glyph unicode="&#xe00e;" glyph-name="blockquote" d="M225 512c123.712 0 224-100.29 224-224 0-123.712-100.288-224-224-224s-224 100.288-224 224l-1 32c0 247.424 200.576 448 448 448v-128c-85.474 0-165.834-33.286-226.274-93.726-11.634-11.636-22.252-24.016-31.83-37.020 11.438 1.8 23.16 2.746 35.104 2.746zM801 512c123.71 0 224-100.29 224-224 0-123.712-100.29-224-224-224s-224 100.288-224 224l-1 32c0 247.424 200.576 448 448 448v-128c-85.474 0-165.834-33.286-226.274-93.726-11.636-11.636-22.254-24.016-31.832-37.020 11.44 1.8 23.16 2.746 35.106 2.746z" />
+<glyph unicode="&#xe00f;" glyph-name="undo" d="M761.862-64c113.726 206.032 132.888 520.306-313.862 509.824v-253.824l-384 384 384 384v-248.372c534.962 13.942 594.57-472.214 313.862-775.628z" />
+<glyph unicode="&#xe010;" glyph-name="redo" d="M576 711.628v248.372l384-384-384-384v253.824c-446.75 10.482-427.588-303.792-313.86-509.824-280.712 303.414-221.1 789.57 313.86 775.628z" />
+<glyph unicode="&#xe011;" glyph-name="link" d="M320 256c17.6-17.6 47.274-16.726 65.942 1.942l316.118 316.116c18.668 18.668 19.54 48.342 1.94 65.942s-47.274 16.726-65.942-1.942l-316.116-316.116c-18.668-18.668-19.542-48.342-1.942-65.942zM476.888 284.888c4.56-9.050 6.99-19.16 6.99-29.696 0-17.616-6.744-34.060-18.992-46.308l-163.382-163.382c-12.248-12.248-28.694-18.992-46.308-18.992s-34.060 6.744-46.308 18.992l-99.382 99.382c-12.248 12.248-18.992 28.694-18.992 46.308s6.744 34.060 18.992 46.308l163.382 163.382c12.248 12.248 28.694 18.994 46.308 18.994 10.536 0 20.644-2.43 29.696-6.99l65.338 65.338c-27.87 21.41-61.44 32.16-95.034 32.16-39.986 0-79.972-15.166-110.308-45.502l-163.382-163.382c-60.67-60.67-60.67-159.948 0-220.618l99.382-99.382c30.334-30.332 70.32-45.5 110.306-45.5 39.988 0 79.974 15.168 110.308 45.502l163.382 163.382c55.82 55.82 60.238 144.298 13.344 205.344l-65.34-65.34zM978.498 815.116l-99.382 99.382c-30.334 30.336-70.32 45.502-110.308 45.502-39.986 0-79.972-15.166-110.308-45.502l-163.382-163.382c-55.82-55.82-60.238-144.298-13.342-205.342l65.338 65.34c-4.558 9.050-6.988 19.16-6.988 29.694 0 17.616 6.744 34.060 18.992 46.308l163.382 163.382c12.248 12.248 28.694 18.994 46.308 18.994s34.060-6.746 46.308-18.994l99.382-99.382c12.248-12.248 18.992-28.694 18.992-46.308s-6.744-34.060-18.992-46.308l-163.382-163.382c-12.248-12.248-28.694-18.992-46.308-18.992-10.536 0-20.644 2.43-29.696 6.99l-65.338-65.338c27.872-21.41 61.44-32.16 95.034-32.16 39.988 0 79.974 15.168 110.308 45.502l163.382 163.382c60.67 60.666 60.67 159.944 0 220.614z" />
+<glyph unicode="&#xe012;" glyph-name="unlink" d="M476.888 284.886c4.56-9.048 6.99-19.158 6.99-29.696 0-17.616-6.744-34.058-18.992-46.308l-163.38-163.38c-12.248-12.248-28.696-18.992-46.308-18.992s-34.060 6.744-46.308 18.992l-99.38 99.38c-12.248 12.25-18.992 28.696-18.992 46.308s6.744 34.060 18.992 46.308l163.38 163.382c12.248 12.246 28.696 18.992 46.308 18.992 10.538 0 20.644-2.43 29.696-6.988l65.338 65.336c-27.87 21.41-61.44 32.16-95.034 32.16-39.986 0-79.972-15.166-110.308-45.502l-163.38-163.382c-60.67-60.67-60.67-159.95 0-220.618l99.38-99.382c30.334-30.332 70.32-45.5 110.306-45.5 39.988 0 79.974 15.168 110.308 45.502l163.38 163.38c55.82 55.82 60.238 144.298 13.344 205.346l-65.34-65.338zM978.496 815.116l-99.38 99.382c-30.334 30.336-70.32 45.502-110.308 45.502-39.986 0-79.97-15.166-110.306-45.502l-163.382-163.382c-55.82-55.82-60.238-144.298-13.342-205.342l65.338 65.34c-4.558 9.050-6.988 19.16-6.988 29.694 0 17.616 6.744 34.060 18.992 46.308l163.382 163.382c12.246 12.248 28.694 18.994 46.306 18.994 17.616 0 34.060-6.746 46.308-18.994l99.38-99.382c12.248-12.248 18.992-28.694 18.992-46.308s-6.744-34.060-18.992-46.308l-163.38-163.382c-12.248-12.248-28.694-18.992-46.308-18.992-10.536 0-20.644 2.43-29.696 6.99l-65.338-65.338c27.872-21.41 61.44-32.16 95.034-32.16 39.988 0 79.974 15.168 110.308 45.504l163.38 163.38c60.672 60.666 60.672 159.944 0 220.614zM233.368 681.376l-191.994 191.994 45.256 45.256 191.994-191.994zM384 960h64v-192h-64zM0 576h192v-64h-192zM790.632 214.624l191.996-191.996-45.256-45.256-191.996 191.996zM576 128h64v-192h-64zM832 384h192v-64h-192z" />
+<glyph unicode="&#xe013;" glyph-name="anchor" d="M192 960v-1024l320 320 320-320v1024h-640zM768 90.51l-256 256-256-256v805.49h512v-805.49z" />
+<glyph unicode="&#xe014;" glyph-name="image" d="M0 832v-832h1024v832h-1024zM960 64h-896v704h896v-704zM704 608c0 53.019 42.981 96 96 96s96-42.981 96-96c0-53.019-42.981-96-96-96s-96 42.981-96 96zM896 128h-768l192 512 256-320 128 96z" />
+<glyph unicode="&#xe015;" glyph-name="media" d="M0 832v-768h1024v768h-1024zM192 128h-128v128h128v-128zM192 384h-128v128h128v-128zM192 640h-128v128h128v-128zM768 128h-512v640h512v-640zM960 128h-128v128h128v-128zM960 384h-128v128h128v-128zM960 640h-128v128h128v-128zM384 640v-384l256 192z" />
+<glyph unicode="&#xe016;" glyph-name="help" d="M448 256h128v-128h-128zM704 704c35.346 0 64-28.654 64-64v-192l-192-128h-128v64l192 128v64h-320v128h384zM512 864c-111.118 0-215.584-43.272-294.156-121.844s-121.844-183.038-121.844-294.156c0-111.118 43.272-215.584 121.844-294.156s183.038-121.844 294.156-121.844c111.118 0 215.584 43.272 294.156 121.844s121.844 183.038 121.844 294.156c0 111.118-43.272 215.584-121.844 294.156s-183.038 121.844-294.156 121.844zM512 960v0c282.77 0 512-229.23 512-512s-229.23-512-512-512c-282.77 0-512 229.23-512 512s229.23 512 512 512z" />
+<glyph unicode="&#xe017;" glyph-name="code" d="M320 704l-256-256 256-256h128l-256 256 256 256zM704 704h-128l256-256-256-256h128l256 256z" />
+<glyph unicode="&#xe018;" glyph-name="inserttime" d="M512 768c-212.076 0-384-171.922-384-384s171.922-384 384-384c212.074 0 384 171.922 384 384s-171.926 384-384 384zM715.644 180.354c-54.392-54.396-126.716-84.354-203.644-84.354s-149.25 29.958-203.646 84.354c-54.396 54.394-84.354 126.718-84.354 203.646s29.958 149.25 84.354 203.646c54.396 54.396 126.718 84.354 203.646 84.354s149.252-29.958 203.642-84.354c54.402-54.396 84.358-126.718 84.358-203.646s-29.958-149.252-84.356-203.646zM325.93 756.138l-42.94 85.878c-98.874-49.536-179.47-130.132-229.006-229.008l85.876-42.94c40.248 80.336 105.732 145.822 186.070 186.070zM884.134 570.070l85.878 42.938c-49.532 98.876-130.126 179.472-229.004 229.008l-42.944-85.878c80.338-40.248 145.824-105.732 186.070-186.068zM512 576h-64v-192c0-10.11 4.7-19.11 12.022-24.972l-0.012-0.016 160-128 39.976 49.976-147.986 118.39v176.622z" />
+<glyph unicode="&#xe019;" glyph-name="preview" d="M512 640c-209.368 0-395.244-100.556-512-256 116.756-155.446 302.632-256 512-256s395.244 100.554 512 256c-116.756 155.444-302.632 256-512 256zM448 512c35.346 0 64-28.654 64-64s-28.654-64-64-64-64 28.654-64 64 28.654 64 64 64zM773.616 254.704c-39.648-20.258-81.652-35.862-124.846-46.376-44.488-10.836-90.502-16.328-136.77-16.328-46.266 0-92.282 5.492-136.768 16.324-43.194 10.518-85.198 26.122-124.846 46.376-63.020 32.202-120.222 76.41-167.64 129.298 47.418 52.888 104.62 97.1 167.64 129.298 32.336 16.522 66.242 29.946 101.082 40.040-19.888-30.242-31.468-66.434-31.468-105.336 0-106.040 85.962-192 192-192s192 85.96 192 192c0 38.902-11.582 75.094-31.466 105.34 34.838-10.096 68.744-23.52 101.082-40.042 63.022-32.198 120.218-76.408 167.638-129.298-47.42-52.886-104.618-97.1-167.638-129.296zM860.918 716.278c-108.72 55.554-226.112 83.722-348.918 83.722s-240.198-28.168-348.918-83.722c-58.772-30.032-113.732-67.904-163.082-112.076v-109.206c55.338 58.566 120.694 107.754 192.194 144.29 99.62 50.904 207.218 76.714 319.806 76.714s220.186-25.81 319.804-76.716c71.502-36.536 136.858-85.724 192.196-144.29v109.206c-49.35 44.174-104.308 82.046-163.082 112.078z" />
+<glyph unicode="&#xe01a;" glyph-name="forecolor" d="M322.018 128l57.6 192h264.764l57.6-192h113.632l-191.996 640h-223.236l-192-640h113.636zM475.618 640h72.764l57.6-192h-187.964l57.6 192z" />
+<glyph unicode="&#xe01b;" glyph-name="table" d="M0 896v-896h1024v896h-1024zM384 320v192h256v-192h-256zM640 256v-192h-256v192h256zM640 768v-192h-256v192h256zM320 768v-192h-256v192h256zM64 512h256v-192h-256v192zM704 512h256v-192h-256v192zM704 576v192h256v-192h-256zM64 256h256v-192h-256v192zM704 64v192h256v-192h-256z" />
+<glyph unicode="&#xe01c;" glyph-name="hr" d="M0 512h1024v-128h-1024z" />
+<glyph unicode="&#xe01d;" glyph-name="removeformat" d="M0 64h576v-128h-576zM192 960h704v-128h-704zM277.388 128l204.688 784.164 123.85-32.328-196.25-751.836zM929.774-64l-129.774 129.774-129.774-129.774-62.226 62.226 129.774 129.774-129.774 129.774 62.226 62.226 129.774-129.774 129.774 129.774 62.226-62.226-129.774-129.774 129.774-129.774z" />
+<glyph unicode="&#xe01e;" glyph-name="sub" d="M768 50v-50h128v-64h-192v146l128 60v50h-128v64h192v-146zM676 704h-136l-188-188-188 188h-136l256-256-256-256h136l188 188 188-188h136l-256 256z" />
+<glyph unicode="&#xe01f;" glyph-name="sup" d="M768 754v-50h128v-64h-192v146l128 60v50h-128v64h192v-146zM676 704h-136l-188-188-188 188h-136l256-256-256-256h136l188 188 188-188h136l-256 256z" />
+<glyph unicode="&#xe020;" glyph-name="charmap" d="M704 64h256l64 128v-256h-384v214.214c131.112 56.484 224 197.162 224 361.786 0 214.432-157.598 382.266-352 382.266-194.406 0-352-167.832-352-382.266 0-164.624 92.886-305.302 224-361.786v-214.214h-384v256l64-128h256v32.59c-187.63 66.46-320 227.402-320 415.41 0 247.424 229.23 448 512 448s512-200.576 512-448c0-188.008-132.37-348.95-320-415.41v-32.59z" />
+<glyph unicode="&#xe021;" glyph-name="emoticons" d="M512 960c-282.77 0-512-229.228-512-512 0-282.77 229.228-512 512-512 282.77 0 512 229.23 512 512 0 282.772-229.23 512-512 512zM512 16c-238.586 0-432 193.412-432 432 0 238.586 193.414 432 432 432 238.59 0 432-193.414 432-432 0-238.588-193.41-432-432-432zM384 640c0-35.346-28.654-64-64-64s-64 28.654-64 64 28.654 64 64 64 64-28.654 64-64zM768 640c0-35.346-28.652-64-64-64s-64 28.654-64 64 28.652 64 64 64 64-28.654 64-64zM512 308c141.074 0 262.688 57.532 318.462 123.192-20.872-171.22-156.288-303.192-318.462-303.192-162.118 0-297.498 132.026-318.444 303.168 55.786-65.646 177.386-123.168 318.444-123.168z" />
+<glyph unicode="&#xe022;" glyph-name="print" d="M256 896h512v-128h-512zM960 704h-896c-35.2 0-64-28.8-64-64v-320c0-35.2 28.796-64 64-64h192v-256h512v256h192c35.2 0 64 28.8 64 64v320c0 35.2-28.8 64-64 64zM704 64h-384v320h384v-320zM974.4 608c0-25.626-20.774-46.4-46.398-46.4-25.626 0-46.402 20.774-46.402 46.4s20.776 46.4 46.402 46.4c25.626 0 46.398-20.774 46.398-46.4z" />
+<glyph unicode="&#xe023;" glyph-name="fullscreen" d="M1024 960v-384l-138.26 138.26-212-212-107.48 107.48 212 212-138.26 138.26zM245.74 821.74l212-212-107.48-107.48-212 212-138.26-138.26v384h384zM885.74 181.74l138.26 138.26v-384h-384l138.26 138.26-212 212 107.48 107.48zM457.74 286.26l-212-212 138.26-138.26h-384v384l138.26-138.26 212 212z" />
+<glyph unicode="&#xe024;" glyph-name="spellchecker" d="M128 704h128v-192h64v384c0 35.2-28.8 64-64 64h-128c-35.2 0-64-28.8-64-64v-384h64v192zM128 896h128v-128h-128v128zM960 896v64h-192c-35.202 0-64-28.8-64-64v-320c0-35.2 28.798-64 64-64h192v64h-192v320h192zM640 800v96c0 35.2-28.8 64-64 64h-192v-448h192c35.2 0 64 28.8 64 64v96c0 35.2-8.8 64-44 64 35.2 0 44 28.8 44 64zM576 576h-128v128h128v-128zM576 768h-128v128h128v-128zM832 384l-416-448-224 288 82 70 142-148 352 302z" />
+<glyph unicode="&#xe025;" glyph-name="nonbreaking" d="M448 384h-192v128h192v192h128v-192h192v-128h-192v-192h-128zM1024 320v-384h-1024v384h128v-256h768v256z" />
+<glyph unicode="&#xe026;" glyph-name="template" d="M384 768h128v-64h-128zM576 768h128v-64h-128zM896 768v-256h-192v64h128v128h-64v64zM320 576h128v-64h-128zM512 576h128v-64h-128zM192 704v-128h64v-64h-128v256h192v-64zM384 384h128v-64h-128zM576 384h128v-64h-128zM896 384v-256h-192v64h128v128h-64v64zM320 192h128v-64h-128zM512 192h128v-64h-128zM192 320v-128h64v-64h-128v256h192v-64zM960 896h-896v-896h896v896zM1024 960v0-1024h-1024v1024h1024z" />
+<glyph unicode="&#xe027;" glyph-name="pagebreak" d="M0 448h128v-64h-128zM192 448h192v-64h-192zM448 448h128v-64h-128zM640 448h192v-64h-192zM896 448h128v-64h-128zM880 960l16-448h-768l16 448h32l16-384h640l16 384zM144-64l-16 384h768l-16-384h-32l-16 320h-640l-16-320z" />
+<glyph unicode="&#xe028;" glyph-name="restoredraft" d="M576 896c247.424 0 448-200.576 448-448s-200.576-448-448-448v96c94.024 0 182.418 36.614 248.902 103.098s103.098 154.878 103.098 248.902c0 94.022-36.614 182.418-103.098 248.902s-154.878 103.098-248.902 103.098c-94.022 0-182.418-36.614-248.902-103.098-51.14-51.138-84.582-115.246-97.306-184.902h186.208l-224-256-224 256h164.57c31.060 217.102 217.738 384 443.43 384zM768 512v-128h-256v320h128v-192z" />
+<glyph unicode="&#xe02a;" glyph-name="bold" d="M707.88 475.348c37.498 44.542 60.12 102.008 60.12 164.652 0 141.16-114.842 256-256 256h-320v-896h384c141.158 0 256 114.842 256 256 0 92.956-49.798 174.496-124.12 219.348zM384 768h101.5c55.968 0 101.5-57.42 101.5-128s-45.532-128-101.5-128h-101.5v256zM543 128h-159v256h159c58.45 0 106-57.42 106-128s-47.55-128-106-128z" />
+<glyph unicode="&#xe02b;" glyph-name="italic" d="M896 896v-64h-128l-320-768h128v-64h-448v64h128l320 768h-128v64z" />
+<glyph unicode="&#xe02c;" glyph-name="underline" d="M704 896h128v-416c0-159.058-143.268-288-320-288-176.73 0-320 128.942-320 288v416h128v-416c0-40.166 18.238-78.704 51.354-108.506 36.896-33.204 86.846-51.494 140.646-51.494s103.75 18.29 140.646 51.494c33.116 29.802 51.354 68.34 51.354 108.506v416zM192 128h640v-128h-640z" />
+<glyph unicode="&#xe02d;" glyph-name="strikethrough" d="M731.42 442.964c63.92-47.938 100.58-116.086 100.58-186.964s-36.66-139.026-100.58-186.964c-59.358-44.518-137.284-69.036-219.42-69.036-82.138 0-160.062 24.518-219.42 69.036-63.92 47.938-100.58 116.086-100.58 186.964h128c0-69.382 87.926-128 192-128s192 58.618 192 128c0 69.382-87.926 128-192 128-82.138 0-160.062 24.518-219.42 69.036-63.92 47.94-100.58 116.086-100.58 186.964s36.66 139.024 100.58 186.964c59.358 44.518 137.282 69.036 219.42 69.036 82.136 0 160.062-24.518 219.42-69.036 63.92-47.94 100.58-116.086 100.58-186.964h-128c0 69.382-87.926 128-192 128s-192-58.618-192-128c0-69.382 87.926-128 192-128 82.136 0 160.062-24.518 219.42-69.036zM0 448h1024v-64h-1024z" />
+<glyph unicode="&#xe02e;" glyph-name="visualchars" d="M384 896h512v-128h-128v-768h-128v768h-128v-768h-128v448c-123.712 0-224 100.288-224 224s100.288 224 224 224z" />
+<glyph unicode="&#xe02f;" glyph-name="ltr" d="M448 896h512v-128h-128v-768h-128v768h-128v-768h-128v448c-123.712 0-224 100.288-224 224s100.288 224 224 224zM64 512l256-224-256-224z" />
+<glyph unicode="&#xe030;" glyph-name="rtl" d="M256 896h512v-128h-128v-768h-128v768h-128v-768h-128v448c-123.712 0-224 100.288-224 224s100.288 224 224 224zM960 64l-256 224 256 224z" />
+<glyph unicode="&#xe031;" glyph-name="copy" d="M832 704h-192v64l-192 192h-448v-768h384v-256h640v576l-192 192zM832 613.49l101.49-101.49h-101.49v101.49zM448 869.49l101.49-101.49h-101.49v101.49zM64 896h320v-192h192v-448h-512v640zM960 0h-512v192h192v448h128v-192h192v-448z" />
+<glyph unicode="&#xe032;" glyph-name="resize" d="M768 704h64v-64h-64zM640 576h64v-64h-64zM640 448h64v-64h-64zM640 320h64v-64h-64zM512 448h64v-64h-64zM512 320h64v-64h-64zM384 320h64v-64h-64zM768 576h64v-64h-64zM768 448h64v-64h-64zM768 320h64v-64h-64zM768 192h64v-64h-64zM640 192h64v-64h-64zM512 192h64v-64h-64zM384 192h64v-64h-64zM256 192h64v-64h-64z" />
+<glyph unicode="&#xe033;" glyph-name="checkbox" d="M128 416l288-288 480 480-128 128-352-352-160 160z" />
+<glyph unicode="&#xe034;" glyph-name="browse" d="M928 832h-416l-32 64h-352l-64-128h896zM904.34 256h74.86l44.8 448h-1024l64-640h484.080c-104.882 37.776-180.080 138.266-180.080 256 0 149.982 122.018 272 272 272 149.98 0 272-122.018 272-272 0-21.678-2.622-43.15-7.66-64zM1002.996 46.25l-198.496 174.692c17.454 28.92 27.5 62.814 27.5 99.058 0 106.040-85.96 192-192 192s-192-85.96-192-192 85.96-192 192-192c36.244 0 70.138 10.046 99.058 27.5l174.692-198.496c22.962-26.678 62.118-28.14 87.006-3.252l5.492 5.492c24.888 24.888 23.426 64.044-3.252 87.006zM640 196c-68.484 0-124 55.516-124 124s55.516 124 124 124 124-55.516 124-124-55.516-124-124-124z" />
+<glyph unicode="&#xe035;" glyph-name="pastetext" d="M512 448v-128h32l32 64h64v-256h-48v-64h224v64h-48v256h64l32-64h32v128zM832 640v160c0 17.6-14.4 32-32 32h-224v64c0 35.2-28.8 64-64 64h-128c-35.204 0-64-28.8-64-64v-64h-224c-17.602 0-32-14.4-32-32v-640c0-17.6 14.398-32 32-32h288v-192h640v704h-192zM384 895.886c0.034 0.038 0.072 0.078 0.114 0.114h127.768c0.042-0.036 0.082-0.076 0.118-0.114v-63.886h-128v63.886zM192 704v64h512v-64h-512zM960 0h-512v576h512v-576z" />
+<glyph unicode="&#xe600;" glyph-name="gamma" d="M483.2 320l-147.2 336c-9.6 25.6-19.2 44.8-25.6 54.4s-16 12.8-25.6 12.8c-16 0-25.6-3.2-28.8-3.2v70.4c9.6 6.4 25.6 6.4 38.4 9.6 32 0 57.6-6.4 73.6-22.4 6.4-6.4 12.8-16 19.2-25.6 6.4-12.8 12.8-25.6 16-41.6l121.6-291.2 150.4 371.2h92.8l-198.4-470.4v-224h-86.4v224zM0 960v-1024h1024v1024h-1024zM960 0h-896v896h896v-896z" />
+<glyph unicode="&#xe601;" glyph-name="orientation" d="M627.2 80h-579.2v396.8h579.2v-396.8zM553.6 406.4h-435.2v-256h435.2v256zM259.2 732.8c176 176 457.6 176 633.6 0s176-457.6 0-633.6c-121.6-121.6-297.6-160-454.4-108.8 121.6-28.8 262.4 9.6 361.6 108.8 150.4 150.4 160 384 22.4 521.6-121.6 121.6-320 128-470.4 19.2l86.4-86.4-294.4-22.4 22.4 294.4 92.8-92.8z" />
+<glyph unicode="&#xe602;" glyph-name="invert" d="M892.8-22.4l-89.6 89.6c-70.4-80-172.8-131.2-288-131.2-208 0-380.8 166.4-384 377.6 0 0 0 0 0 0 0 3.2 0 3.2 0 6.4s0 3.2 0 6.4v0c0 0 0 0 0 3.2 0 0 0 3.2 0 3.2 3.2 105.6 48 211.2 105.6 304l-192 192 44.8 44.8 182.4-182.4c0 0 0 0 0 0l569.6-569.6c0 0 0 0 0 0l99.2-99.2-48-44.8zM896 326.4c0 0 0 0 0 0 0 3.2 0 6.4 0 6.4-9.6 316.8-384 627.2-384 627.2s-108.8-89.6-208-220.8l70.4-70.4c6.4 9.6 16 22.4 22.4 32 41.6 51.2 83.2 96 115.2 128v0c32-32 73.6-76.8 115.2-128 108.8-137.6 169.6-265.6 172.8-371.2 0 0 0-3.2 0-3.2v0 0c0-3.2 0-3.2 0-6.4s0-3.2 0-3.2v0 0c0-22.4-3.2-41.6-9.6-64l76.8-76.8c16 41.6 28.8 89.6 28.8 137.6 0 0 0 0 0 0 0 3.2 0 3.2 0 6.4s0 3.2 0 6.4z" />
+<glyph unicode="&#xe603;" glyph-name="codesample" d="M199.995 578.002v104.002c0 43.078 34.923 78.001 78.001 78.001h26v104.002h-26c-100.518 0-182.003-81.485-182.003-182.003v-104.002c0-43.078-34.923-78.001-78.001-78.001h-26v-104.002h26c43.078 0 78.001-34.923 78.001-78.001v-104.002c0-100.515 81.485-182.003 182.003-182.003h26v104.002h-26c-43.078 0-78.001 34.923-78.001 78.001v104.002c0 50.931-20.928 96.966-54.646 130.002 33.716 33.036 54.646 79.072 54.646 130.002zM824.005 578.002v104.002c0 43.078-34.923 78.001-78.001 78.001h-26v104.002h26c100.515 0 182.003-81.485 182.003-182.003v-104.002c0-43.078 34.923-78.001 78.001-78.001h26v-104.002h-26c-43.078 0-78.001-34.923-78.001-78.001v-104.002c0-100.515-81.488-182.003-182.003-182.003h-26v104.002h26c43.078 0 78.001 34.923 78.001 78.001v104.002c0 50.931 20.928 96.966 54.646 130.002-33.716 33.036-54.646 79.072-54.646 130.002zM616.002 603.285c0-57.439-46.562-104.002-104.002-104.002s-104.002 46.562-104.002 104.002c0 57.439 46.562 104.002 104.002 104.002s104.002-46.562 104.002-104.002zM512 448.717c-57.439 0-104.002-46.562-104.002-104.002 0-55.845 26-100.115 105.752-103.88-23.719-33.417-59.441-46.612-105.752-50.944v-61.751c0 0 208.003-18.144 208.003 216.577-0.202 57.441-46.56 104.004-104.002 104.004z" />
+<glyph unicode="&#xe604;" glyph-name="tablerowprops" d="M0 896v-896h1024v896h-1024zM640 256v-192h-256v192h256zM640 768v-192h-256v192h256zM320 768v-192h-256v192h256zM704 576v192h256v-192h-256zM64 256h256v-192h-256v192zM704 64v192h256v-192h-256z" />
+<glyph unicode="&#xe605;" glyph-name="tablecellprops" d="M0 896v-896h1024v896h-1024zM640 256v-192h-256v192h256zM640 768v-192h-256v192h256zM320 768v-192h-256v192h256zM64 512h256v-192h-256v192zM704 512h256v-192h-256v192zM704 576v192h256v-192h-256zM64 256h256v-192h-256v192zM704 64v192h256v-192h-256z" />
+<glyph unicode="&#xe606;" glyph-name="table2" d="M0 896v-832h1024v832h-1024zM320 128h-256v192h256v-192zM320 384h-256v192h256v-192zM640 128h-256v192h256v-192zM640 384h-256v192h256v-192zM960 128h-256v192h256v-192zM960 384h-256v192h256v-192zM960 640h-896v192h896v-192z" />
+<glyph unicode="&#xe607;" glyph-name="tablemergecells" d="M0 896v-896h1024v896h-1024zM384 64v448h576v-448h-576zM640 768v-192h-256v192h256zM320 768v-192h-256v192h256zM64 512h256v-192h-256v192zM704 576v192h256v-192h-256zM64 256h256v-192h-256v192z" />
+<glyph unicode="&#xe608;" glyph-name="tableinsertcolbefore" d="M320 188.8v182.4h-182.4v89.6h182.4v182.4h86.4v-182.4h185.6v-89.6h-185.6v-182.4zM0 896v-896h1024v896h-1024zM640 64h-576v704h576v-704zM960 64h-256v192h256v-192zM960 320h-256v192h256v-192zM960 576h-256v192h256v-192z" />
+<glyph unicode="&#xe609;" glyph-name="tableinsertcolafter" d="M704 643.2v-182.4h182.4v-89.6h-182.4v-182.4h-86.4v182.4h-185.6v89.6h185.6v182.4zM0 896v-896h1024v896h-1024zM320 64h-256v192h256v-192zM320 320h-256v192h256v-192zM320 576h-256v192h256v-192zM960 64h-576v704h576v-704z" />
+<glyph unicode="&#xe60a;" glyph-name="tableinsertrowbefore" d="M691.2 508.8h-144v-144h-70.4v144h-144v67.2h144v144h70.4v-144h144zM0 896v-896h1024v896h-1024zM320 64h-256v192h256v-192zM640 64h-256v192h256v-192zM960 64h-256v192h256v-192zM960 316.8h-896v451.2h896v-451.2z" />
+<glyph unicode="&#xe60b;" glyph-name="tableinsertrowafter" d="M332.8 323.2h144v144h70.4v-144h144v-67.2h-144v-144h-70.4v144h-144zM0 896v-896h1024v896h-1024zM384 768h256v-192h-256v192zM64 768h256v-192h-256v192zM960 64h-896v451.2h896v-451.2zM960 576h-256v192h256v-192z" />
+<glyph unicode="&#xe60d;" glyph-name="tablesplitcells" d="M0 896v-896h1024v896h-1024zM384 768h256v-192h-256v192zM320 64h-256v192h256v-192zM320 320h-256v192h256v-192zM320 576h-256v192h256v-192zM960 64h-576v448h576v-448zM960 576h-256v192h256v-192zM864 156.8l-60.8-60.8-131.2 131.2-131.2-131.2-60.8 60.8 131.2 131.2-131.2 131.2 60.8 60.8 131.2-131.2 131.2 131.2 60.8-60.8-131.2-131.2z" />
+<glyph unicode="&#xe60e;" glyph-name="tabledelete" d="M0 896h1024v-896h-1024v896zM60.8 768v-704h899.2v704h-899.2zM809.6 211.2l-96-96-204.8 204.8-204.8-204.8-96 96 204.8 204.8-204.8 204.8 96 96 204.8-204.8 204.8 204.8 96-96-204.8-204.8z" />
+<glyph unicode="&#xe62a;" glyph-name="tableleftheader" d="M0 896v-832h1024v832h-1024zM640 128h-256v192h256v-192zM640 384h-256v192h256v-192zM640 640h-256v192h256v-192zM960 128h-256v192h256v-192zM960 384h-256v192h256v-192zM960 640h-256v192h256v-192z" />
+<glyph unicode="&#xe62b;" glyph-name="tabletopheader" d="M0 896v-832h1024v832h-1024zM320 128h-256v192h256v-192zM320 384h-256v192h256v-192zM640 128h-256v192h256v-192zM640 384h-256v192h256v-192zM960 128h-256v192h256v-192zM960 384h-256v192h256v-192z" />
+<glyph unicode="&#xe800;" glyph-name="tabledeleterow" d="M886.4 572.8l-156.8-156.8 160-160-76.8-76.8-160 160-156.8-156.8-76.8 73.6 160 160-163.2 163.2 76.8 76.8 163.2-163.2 156.8 156.8 73.6-76.8zM0 896v-896h1024v896h-1024zM960 576h-22.4l-64-64h86.4v-192h-89.6l64-64h25.6v-192h-896v192h310.4l64 64h-374.4v192h371.2l-64 64h-307.2v192h896v-192z" />
+<glyph unicode="&#xe801;" glyph-name="tabledeletecol" d="M320 499.2l64-64v-12.8l-64-64v140.8zM640 422.4l64-64v137.6l-64-64v-9.6zM1024 896v-896h-1024v896h1024zM960 768h-256v-51.2l-12.8 12.8-51.2-51.2v89.6h-256v-89.6l-51.2 51.2-12.8-12.8v51.2h-256v-704h256v118.4l35.2-35.2 28.8 28.8v-115.2h256v115.2l48-48 16 16v-83.2h256v707.2zM672 662.4l-156.8-156.8-163.2 163.2-76.8-76.8 163.2-163.2-156.8-156.8 76.8-76.8 156.8 156.8 160-160 76.8 76.8-160 160 156.8 156.8-76.8 76.8z" />
+<glyph unicode="&#xe900;" glyph-name="a11y" d="M960 704v64l-448-128-448 128v-64l320-128v-256l-128-448h64l192 448 192-448h64l-128 448v256zM416 800q0 40 28 68t68 28 68-28 28-68-28-68-68-28-68 28-28 68z" />
+<glyph unicode="&#xe901;" glyph-name="toc" d="M0 896h128v-128h-128v128zM192 896h832v-128h-832v128zM0 512h128v-128h-128v128zM192 512h832v-128h-832v128zM0 128h128v-128h-128v128zM192 128h832v-128h-832v128zM192 704h128v-128h-128v128zM384 704h640v-128h-640v128zM192 320h128v-128h-128v128zM384 320h640v-128h-640v128z" />
+<glyph unicode="&#xe902;" glyph-name="fill" d="M521.6 915.2l-67.2-67.2-86.4 86.4-86.4-86.4 86.4-86.4-368-368 432-432 518.4 518.4-428.8 435.2zM435.2 134.4l-262.4 262.4 35.2 35.2 576 51.2-348.8-348.8zM953.6 409.6c-6.4-6.4-16-16-28.8-32-28.8-32-41.6-64-41.6-89.6v0 0 0 0 0 0 0c0-16 6.4-35.2 22.4-48 12.8-12.8 32-22.4 48-22.4s35.2 6.4 48 22.4 22.4 32 22.4 48v0 0 0 0 0 0 0c0 25.6-12.8 54.4-41.6 89.6-9.6 16-22.4 25.6-28.8 32v0z" />
+<glyph unicode="&#xe903;" glyph-name="borderwidth" d="M0 265.6h1024v-128h-1024v128zM0 32h1024v-64h-1024v64zM0 566.4h1024v-192h-1024v192zM0 928h1024v-256h-1024v256z" />
+<glyph unicode="&#xe904;" glyph-name="line" d="M739.2 627.2l-502.4-502.4h-185.6v185.6l502.4 502.4 185.6-185.6zM803.2 688l-185.6 185.6 67.2 67.2c22.4 22.4 54.4 22.4 76.8 0l108.8-108.8c22.4-22.4 22.4-54.4 0-76.8l-67.2-67.2zM41.6 48h940.8v-112h-940.8v112z" />
+<glyph unicode="&#xe905;" glyph-name="count" d="M0 480h1024v-64h-1024v64zM304 912v-339.2h-67.2v272h-67.2v67.2zM444.8 694.4v-54.4h134.4v-67.2h-201.6v153.6l134.4 64v54.4h-134.4v67.2h201.6v-153.6zM854.4 912v-339.2h-204.8v67.2h137.6v67.2h-137.6v70.4h137.6v67.2h-137.6v67.2zM115.2 166.4c3.2 57.6 38.4 83.2 108.8 83.2 38.4 0 67.2-9.6 86.4-25.6s25.6-35.2 25.6-70.4v-112c0-25.6 0-28.8 9.6-41.6h-73.6c-3.2 9.6-3.2 9.6-6.4 19.2-22.4-19.2-41.6-25.6-70.4-25.6-54.4 0-89.6 32-89.6 76.8s28.8 70.4 99.2 80l38.4 6.4c16 3.2 22.4 6.4 22.4 16 0 12.8-12.8 22.4-38.4 22.4s-41.6-9.6-44.8-28.8h-67.2zM262.4 115.2c-6.4-3.2-12.8-6.4-25.6-6.4l-25.6-6.4c-25.6-6.4-38.4-16-38.4-28.8 0-16 12.8-25.6 35.2-25.6s41.6 9.6 54.4 32v35.2zM390.4 336h73.6v-112c22.4 16 41.6 22.4 67.2 22.4 64 0 105.6-51.2 105.6-124.8 0-76.8-44.8-134.4-108.8-134.4-32 0-48 9.6-67.2 35.2v-28.8h-70.4v342.4zM460.8 121.6c0-41.6 22.4-70.4 51.2-70.4s51.2 28.8 51.2 70.4c0 44.8-19.2 70.4-51.2 70.4-28.8 0-51.2-28.8-51.2-70.4zM851.2 153.6c-3.2 22.4-19.2 35.2-44.8 35.2-32 0-51.2-25.6-51.2-70.4 0-48 19.2-73.6 51.2-73.6 25.6 0 41.6 12.8 44.8 41.6l70.4-3.2c-9.6-60.8-54.4-96-118.4-96-73.6 0-121.6 51.2-121.6 128 0 80 48 131.2 124.8 131.2 64 0 108.8-35.2 112-96h-67.2z" />
+<glyph unicode="&#xe906;" glyph-name="reload" d="M889.68 793.68c-93.608 102.216-228.154 166.32-377.68 166.32-282.77 0-512-229.23-512-512h96c0 229.75 186.25 416 416 416 123.020 0 233.542-53.418 309.696-138.306l-149.696-149.694h352v352l-134.32-134.32zM928 448c0-229.75-186.25-416-416-416-123.020 0-233.542 53.418-309.694 138.306l149.694 149.694h-352v-352l134.32 134.32c93.608-102.216 228.154-166.32 377.68-166.32 282.77 0 512 229.23 512 512h-96z" />
+<glyph unicode="&#xe907;" glyph-name="translate" d="M553.6 304l-118.4 118.4c80 89.6 137.6 195.2 172.8 304h137.6v92.8h-326.4v92.8h-92.8v-92.8h-326.4v-92.8h518.4c-32-89.6-80-176-147.2-249.6-44.8 48-80 99.2-108.8 156.8h-92.8c35.2-76.8 80-147.2 137.6-211.2l-236.8-233.6 67.2-67.2 233.6 233.6 144-144c3.2 0 38.4 92.8 38.4 92.8zM816 540.8h-92.8l-208-560h92.8l51.2 140.8h220.8l51.2-140.8h92.8l-208 560zM691.2 214.4l76.8 201.6 76.8-201.6h-153.6z" />
+<glyph unicode="&#xe908;" glyph-name="drag" d="M576 896h128v-128h-128v128zM576 640h128v-128h-128v128zM320 640h128v-128h-128v128zM576 384h128v-128h-128v128zM320 384h128v-128h-128v128zM320 128h128v-128h-128v128zM576 128h128v-128h-128v128zM320 896h128v-128h-128v128z" />
+<glyph unicode="&#xe909;" glyph-name="format-painter" d="M768 746.667v42.667c0 23.467-19.2 42.667-42.667 42.667h-512c-23.467 0-42.667-19.2-42.667-42.667v-170.667c0-23.467 19.2-42.667 42.667-42.667h512c23.467 0 42.667 19.2 42.667 42.667v42.667h42.667v-170.667h-426.667v-384c0-23.467 19.2-42.667 42.667-42.667h85.333c23.467 0 42.667 19.2 42.667 42.667v298.667h341.333v341.333h-128z" />
+<glyph unicode="&#xe90b;" glyph-name="home" d="M1024 369.556l-512 397.426-512-397.428v162.038l512 397.426 512-397.428zM896 384v-384h-256v256h-256v-256h-256v384l384 288z" />
+<glyph unicode="&#xe911;" glyph-name="books" d="M576.234 670.73l242.712 81.432 203.584-606.784-242.712-81.432zM0 64h256v704h-256v-704zM64 640h128v-64h-128v64zM320 64h256v704h-256v-704zM384 640h128v-64h-128v64z" />
+<glyph unicode="&#xe914;" glyph-name="upload" d="M839.432 760.57c27.492-27.492 50.554-78.672 55.552-120.57h-318.984v318.984c41.898-4.998 93.076-28.060 120.568-55.552l142.864-142.862zM512 576v384h-368c-44 0-80-36-80-80v-864c0-44 36-80 80-80h672c44 0 80 36 80 80v560h-384zM576 192v-192h-192v192h-160l256 256 256-256h-160z" />
+<glyph unicode="&#xe915;" glyph-name="editimage" d="M768 416v-352h-640v640h352l128 128h-512c-52.8 0-96-43.2-96-96v-704c0-52.8 43.2-96 96-96h704c52.798 0 96 43.2 96 96v512l-128-128zM864 960l-608-608v-160h160l608 608c0 96-64 160-160 160zM416 320l-48 48 480 480 48-48-480-480z" />
+<glyph unicode="&#xe91c;" glyph-name="bubble" d="M928 896h-832c-52.8 0-96-43.2-96-96v-512c0-52.8 43.2-96 96-96h160v-256l307.2 256h364.8c52.8 0 96 43.2 96 96v512c0 52.8-43.2 96-96 96zM896 320h-379.142l-196.858-174.714v174.714h-192v448h768v-448z" />
+<glyph unicode="&#xe91d;" glyph-name="user" d="M622.826 257.264c-22.11 3.518-22.614 64.314-22.614 64.314s64.968 64.316 79.128 150.802c38.090 0 61.618 91.946 23.522 124.296 1.59 34.054 48.96 267.324-190.862 267.324s-192.45-233.27-190.864-267.324c-38.094-32.35-14.57-124.296 23.522-124.296 14.158-86.486 79.128-150.802 79.128-150.802s-0.504-60.796-22.614-64.314c-71.22-11.332-337.172-128.634-337.172-257.264h896c0 128.63-265.952 245.932-337.174 257.264z" />
+<glyph unicode="&#xe926;" glyph-name="lock" d="M592 512h-16v192c0 105.87-86.13 192-192 192h-128c-105.87 0-192-86.13-192-192v-192h-16c-26.4 0-48-21.6-48-48v-480c0-26.4 21.6-48 48-48h544c26.4 0 48 21.6 48 48v480c0 26.4-21.6 48-48 48zM192 704c0 35.29 28.71 64 64 64h128c35.29 0 64-28.71 64-64v-192h-256v192z" />
+<glyph unicode="&#xe927;" glyph-name="unlock" d="M768 896c105.87 0 192-86.13 192-192v-192h-128v192c0 35.29-28.71 64-64 64h-128c-35.29 0-64-28.71-64-64v-192h16c26.4 0 48-21.6 48-48v-480c0-26.4-21.6-48-48-48h-544c-26.4 0-48 21.6-48 48v480c0 26.4 21.6 48 48 48h400v192c0 105.87 86.13 192 192 192h128z" />
+<glyph unicode="&#xe928;" glyph-name="settings" d="M448 832v16c0 26.4-21.6 48-48 48h-160c-26.4 0-48-21.6-48-48v-16h-192v-128h192v-16c0-26.4 21.6-48 48-48h160c26.4 0 48 21.6 48 48v16h576v128h-576zM256 704v128h128v-128h-128zM832 528c0 26.4-21.6 48-48 48h-160c-26.4 0-48-21.6-48-48v-16h-576v-128h576v-16c0-26.4 21.6-48 48-48h160c26.4 0 48 21.6 48 48v16h192v128h-192v16zM640 384v128h128v-128h-128zM448 208c0 26.4-21.6 48-48 48h-160c-26.4 0-48-21.6-48-48v-16h-192v-128h192v-16c0-26.4 21.6-48 48-48h160c26.4 0 48 21.6 48 48v16h576v128h-576v16zM256 64v128h128v-128h-128z" />
+<glyph unicode="&#xe92a;" glyph-name="remove2" d="M192-64h640l64 704h-768zM640 832v128h-256v-128h-320v-192l64 64h768l64-64v192h-320zM576 832h-128v64h128v-64z" />
+<glyph unicode="&#xe92d;" glyph-name="menu" d="M384 896h256v-256h-256zM384 576h256v-256h-256zM384 256h256v-256h-256z" />
+<glyph unicode="&#xe930;" glyph-name="warning" d="M1009.956 44.24l-437.074 871.112c-16.742 29.766-38.812 44.648-60.882 44.648s-44.14-14.882-60.884-44.648l-437.074-871.112c-33.486-59.532-5-108.24 63.304-108.24h869.308c68.302 0 96.792 48.708 63.302 108.24zM512 64c-35.346 0-64 28.654-64 64 0 35.348 28.654 64 64 64 35.348 0 64-28.652 64-64 0-35.346-28.652-64-64-64zM556 256h-88l-20 256c0 35.346 28.654 64 64 64s64-28.654 64-64l-20-256z" />
+<glyph unicode="&#xe931;" glyph-name="question" d="M448 256h128v-128h-128zM704 704c35.346 0 64-28.654 64-64v-192l-192-128h-128v64l192 128v64h-320v128h384zM512 864c-111.118 0-215.584-43.272-294.156-121.844s-121.844-183.038-121.844-294.156c0-111.118 43.272-215.584 121.844-294.156s183.038-121.844 294.156-121.844c111.118 0 215.584 43.272 294.156 121.844s121.844 183.038 121.844 294.156c0 111.118-43.272 215.584-121.844 294.156s-183.038 121.844-294.156 121.844zM512 960v0c282.77 0 512-229.23 512-512s-229.23-512-512-512c-282.77 0-512 229.23-512 512s229.23 512 512 512z" />
+<glyph unicode="&#xe932;" glyph-name="pluscircle" d="M512 960c-282.77 0-512-229.23-512-512s229.23-512 512-512 512 229.23 512 512-229.23 512-512 512zM512 64c-212.078 0-384 171.922-384 384s171.922 384 384 384c212.078 0 384-171.922 384-384s-171.922-384-384-384zM768 384h-192v-192h-128v192h-192v128h192v192h128v-192h192z" />
+<glyph unicode="&#xe933;" glyph-name="info" d="M512 960c-282.77 0-512-229.23-512-512s229.23-512 512-512 512 229.23 512 512-229.23 512-512 512zM448 768h128v-128h-128v128zM640 128h-256v64h64v256h-64v64h192v-320h64v-64z" />
+<glyph unicode="&#xe934;" glyph-name="notice" d="M1024 224l-288 736h-448l-288-288v-448l288-288h448l288 288v448l-288 288zM576 128h-128v128h128v-128zM576 384h-128v384h128v-384z" />
+<glyph unicode="&#xe935;" glyph-name="drop" d="M864.626 486.838c-65.754 183.44-205.11 348.15-352.626 473.162-147.516-125.012-286.87-289.722-352.626-473.162-40.664-113.436-44.682-236.562 12.584-345.4 65.846-125.14 198.632-205.438 340.042-205.438s274.196 80.298 340.040 205.44c57.27 108.838 53.25 231.962 12.586 345.398zM738.764 201.044c-43.802-83.252-132.812-137.044-226.764-137.044-55.12 0-108.524 18.536-152.112 50.652 13.242-1.724 26.632-2.652 40.112-2.652 117.426 0 228.668 67.214 283.402 171.242 44.878 85.292 40.978 173.848 23.882 244.338 14.558-28.15 26.906-56.198 36.848-83.932 22.606-63.062 40.024-156.34-5.368-242.604z" />
+<glyph unicode="&#xe939;" glyph-name="minus" d="M0 544v-192c0-17.672 14.328-32 32-32h960c17.672 0 32 14.328 32 32v192c0 17.672-14.328 32-32 32h-960c-17.672 0-32-14.328-32-32z" />
+<glyph unicode="&#xe93a;" glyph-name="plus" d="M992 576h-352v352c0 17.672-14.328 32-32 32h-192c-17.672 0-32-14.328-32-32v-352h-352c-17.672 0-32-14.328-32-32v-192c0-17.672 14.328-32 32-32h352v-352c0-17.672 14.328-32 32-32h192c17.672 0 32 14.328 32 32v352h352c17.672 0 32 14.328 32 32v192c0 17.672-14.328 32-32 32z" />
+<glyph unicode="&#xe93b;" glyph-name="arrowup" d="M0 320l192-192 320 320 320-320 192 192-511.998 512z" />
+<glyph unicode="&#xe93c;" glyph-name="arrowright" d="M384 960l-192-192 320-320-320-320 192-192 512 512z" />
+<glyph unicode="&#xe93d;" glyph-name="arrowdown" d="M1024 576l-192 192-320-320-320 320-192-192 512-511.998z" />
+<glyph unicode="&#xe93f;" glyph-name="arrowup2" d="M768 320l-256 256-256-256z" />
+<glyph unicode="&#xe940;" glyph-name="arrowdown2" d="M256 576l256-256 256 256z" />
+<glyph unicode="&#xe941;" glyph-name="menu2" d="M256 704l256-256 256 256zM255.996 384.004l256-256 256 256z" />
+<glyph unicode="&#xe961;" glyph-name="newtab" d="M704 384l128 128v-512h-768v768h512l-128-128h-256v-512h512zM960 896v-352l-130.744 130.744-354.746-354.744h-90.51v90.512l354.744 354.744-130.744 130.744z" />
+<glyph unicode="&#xeaa8;" glyph-name="rotateleft" d="M607.998 831.986c-212.070 0-383.986-171.916-383.986-383.986h-191.994l246.848-246.848 246.848 246.848h-191.994c0 151.478 122.798 274.276 274.276 274.276 151.48 0 274.276-122.798 274.276-274.276 0-151.48-122.796-274.276-274.276-274.276v-109.71c212.070 0 383.986 171.916 383.986 383.986s-171.916 383.986-383.986 383.986z" />
+<glyph unicode="&#xeaa9;" glyph-name="rotateright" d="M416.002 831.986c212.070 0 383.986-171.916 383.986-383.986h191.994l-246.848-246.848-246.848 246.848h191.994c0 151.478-122.798 274.276-274.276 274.276-151.48 0-274.276-122.798-274.276-274.276 0-151.48 122.796-274.276 274.276-274.276v-109.71c-212.070 0-383.986 171.916-383.986 383.986s171.916 383.986 383.986 383.986z" />
+<glyph unicode="&#xeaaa;" glyph-name="flipv" d="M0 576h1024v384zM1024 0v384h-1024z" />
+<glyph unicode="&#xeaac;" glyph-name="fliph" d="M576 960v-1024h384zM0-64h384v1024z" />
+<glyph unicode="&#xeb35;" glyph-name="zoomin" d="M992.262 88.604l-242.552 206.294c-25.074 22.566-51.89 32.926-73.552 31.926 57.256 67.068 91.842 154.078 91.842 249.176 0 212.078-171.922 384-384 384-212.076 0-384-171.922-384-384s171.922-384 384-384c95.098 0 182.108 34.586 249.176 91.844-1-21.662 9.36-48.478 31.926-73.552l206.294-242.552c35.322-39.246 93.022-42.554 128.22-7.356s31.892 92.898-7.354 128.22zM384 320c-141.384 0-256 114.616-256 256s114.616 256 256 256 256-114.616 256-256-114.614-256-256-256zM448 768h-128v-128h-128v-128h128v-128h128v128h128v128h-128z" />
+<glyph unicode="&#xeb36;" glyph-name="zoomout" d="M992.262 88.604l-242.552 206.294c-25.074 22.566-51.89 32.926-73.552 31.926 57.256 67.068 91.842 154.078 91.842 249.176 0 212.078-171.922 384-384 384-212.076 0-384-171.922-384-384s171.922-384 384-384c95.098 0 182.108 34.586 249.176 91.844-1-21.662 9.36-48.478 31.926-73.552l206.294-242.552c35.322-39.246 93.022-42.554 128.22-7.356s31.892 92.898-7.354 128.22zM384 320c-141.384 0-256 114.616-256 256s114.616 256 256 256 256-114.616 256-256-114.614-256-256-256zM192 640h384v-128h-384z" />
+<glyph unicode="&#xeba7;" glyph-name="sharpen" d="M768 832h-512l-256-256 512-576 512 576-256 256zM512 181.334v2.666h-2.37l-14.222 16h16.592v16h-30.814l-14.222 16h45.036v16h-59.258l-14.222 16h73.48v16h-87.704l-14.222 16h101.926v16h-116.148l-14.222 16h130.37v16h-144.592l-14.222 16h158.814v16h-173.038l-14.222 16h187.26v16h-201.482l-14.222 16h215.704v16h-229.926l-14.222 16h244.148v16h-258.372l-14.222 16h272.594v16h-286.816l-14.222 16h301.038v16h-315.26l-14.222 16h329.482v16h-343.706l-7.344 8.262 139.072 139.072h211.978v-3.334h215.314l16-16h-231.314v-16h247.314l16-16h-263.314v-16h279.314l16-16h-295.314v-16h311.314l16-16h-327.314v-16h343.312l7.738-7.738-351.050-394.928z" />
+<glyph unicode="&#xec6a;" glyph-name="options" d="M64 768h896v-192h-896zM64 512h896v-192h-896zM64 256h896v-192h-896z" />
+<glyph unicode="&#xeccc;" glyph-name="sun" d="M512 128c35.346 0 64-28.654 64-64v-64c0-35.346-28.654-64-64-64s-64 28.654-64 64v64c0 35.346 28.654 64 64 64zM512 768c-35.346 0-64 28.654-64 64v64c0 35.346 28.654 64 64 64s64-28.654 64-64v-64c0-35.346-28.654-64-64-64zM960 512c35.346 0 64-28.654 64-64s-28.654-64-64-64h-64c-35.348 0-64 28.654-64 64s28.652 64 64 64h64zM192 448c0-35.346-28.654-64-64-64h-64c-35.346 0-64 28.654-64 64s28.654 64 64 64h64c35.346 0 64-28.654 64-64zM828.784 221.726l45.256-45.258c24.992-24.99 24.992-65.516 0-90.508-24.994-24.992-65.518-24.992-90.51 0l-45.256 45.256c-24.992 24.99-24.992 65.516 0 90.51 24.994 24.992 65.518 24.992 90.51 0zM195.216 674.274l-45.256 45.256c-24.994 24.994-24.994 65.516 0 90.51s65.516 24.994 90.51 0l45.256-45.256c24.994-24.994 24.994-65.516 0-90.51s-65.516-24.994-90.51 0zM828.784 674.274c-24.992-24.992-65.516-24.992-90.51 0-24.992 24.994-24.992 65.516 0 90.51l45.256 45.254c24.992 24.994 65.516 24.994 90.51 0 24.992-24.994 24.992-65.516 0-90.51l-45.256-45.254zM195.216 221.726c24.992 24.992 65.518 24.992 90.508 0 24.994-24.994 24.994-65.52 0-90.51l-45.254-45.256c-24.994-24.992-65.516-24.992-90.51 0s-24.994 65.518 0 90.508l45.256 45.258zM512 704c-141.384 0-256-114.616-256-256 0-141.382 114.616-256 256-256 141.382 0 256 114.618 256 256 0 141.384-114.616 256-256 256zM512 288c-88.366 0-160 71.634-160 160s71.634 160 160 160 160-71.634 160-160-71.634-160-160-160z" />
+<glyph unicode="&#xeccd;" glyph-name="moon" d="M715.812 895.52c-60.25 34.784-124.618 55.904-189.572 64.48 122.936-160.082 144.768-384.762 37.574-570.42-107.2-185.67-312.688-279.112-512.788-252.68 39.898-51.958 90.376-97.146 150.628-131.934 245.908-141.974 560.37-57.72 702.344 188.198 141.988 245.924 57.732 560.372-188.186 702.356z" />
+<glyph unicode="&#xecd4;" glyph-name="contrast" d="M512 960c-282.77 0-512-229.23-512-512s229.23-512 512-512 512 229.23 512 512-229.23 512-512 512zM128 448c0 212.078 171.922 384 384 384v-768c-212.078 0-384 171.922-384 384z" />
+<glyph unicode="&#xed6a;" glyph-name="remove22" d="M893.254 738.746l-90.508 90.508-290.746-290.744-290.746 290.744-90.508-90.506 290.746-290.748-290.746-290.746 90.508-90.508 290.746 290.746 290.746-290.746 90.508 90.51-290.744 290.744z" />
+<glyph unicode="&#xedc0;" glyph-name="arrowleft" d="M672-64l192 192-320 320 320 320-192 192-512-512z" />
+<glyph unicode="&#xedf9;" glyph-name="resize2" d="M0 896v-384c0-35.346 28.654-64 64-64s64 28.654 64 64v229.488l677.488-677.488h-229.488c-35.346 0-64-28.652-64-64 0-35.346 28.654-64 64-64h384c35.346 0 64 28.654 64 64v384c0 35.348-28.654 64-64 64s-64-28.652-64-64v-229.488l-677.488 677.488h229.488c35.346 0 64 28.654 64 64s-28.652 64-64 64h-384c-35.346 0-64-28.654-64-64z" />
+<glyph unicode="&#xee78;" glyph-name="crop" d="M832 704l192 192-64 64-192-192h-448v192h-128v-192h-192v-128h192v-512h512v-192h128v192h192v128h-192v448zM320 640h320l-320-320v320zM384 256l320 320v-320h-320z" />
+</font></defs></svg>
\ No newline at end of file

public/assets/tinymce/skins/lightgray/skin.min.css

+.mce-container,.mce-container *,.mce-widget,.mce-widget *,.mce-reset{margin:0;padding:0;border:0;outline:0;vertical-align:top;background:transparent;text-decoration:none;color:#595959;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;text-shadow:none;float:none;position:static;width:auto;height:auto;white-space:nowrap;cursor:inherit;-webkit-tap-highlight-color:transparent;line-height:normal;font-weight:normal;text-align:left;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;direction:ltr;max-width:none}.mce-widget button{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.mce-container *[unselectable]{-moz-user-select:none;-webkit-user-select:none;-o-user-select:none;user-select:none}.word-wrap{word-wrap:break-word;-ms-word-break:break-all;word-break:break-all;word-break:break-word;-ms-hyphens:auto;-moz-hyphens:auto;-webkit-hyphens:auto;hyphens:auto}.mce-fade{opacity:0;-webkit-transition:opacity .15s linear;transition:opacity .15s linear}.mce-fade.mce-in{opacity:1}.mce-tinymce{visibility:inherit !important;position:relative}.mce-fullscreen{border:0;padding:0;margin:0;overflow:hidden;height:100%;z-index:100}div.mce-fullscreen{position:fixed;top:0;left:0;width:100%;height:auto}.mce-tinymce{display:block;-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);box-shadow:0 1px 2px rgba(0, 0, 0, 0.2)}.mce-statusbar>.mce-container-body{display:flex;padding-right:16px}.mce-statusbar>.mce-container-body .mce-path{flex:1}.mce-wordcount{font-size:inherit;text-transform:uppercase;padding:8px 0}div.mce-edit-area{background:#FFF;filter:none}.mce-statusbar{position:relative}.mce-statusbar .mce-container-body{position:relative;font-size:11px}.mce-fullscreen .mce-resizehandle{display:none}.mce-statusbar .mce-flow-layout-item{margin:0}.mce-charmap{border-collapse:collapse}.mce-charmap td{cursor:default;border:1px solid #c5c5c5;width:20px;height:20px;line-height:20px;text-align:center;vertical-align:middle;padding:2px}.mce-charmap td div{text-align:center}.mce-charmap td:hover{background:white}.mce-grid td.mce-grid-cell div{border:1px solid #c5c5c5;width:15px;height:15px;margin:0;cursor:pointer}.mce-grid td.mce-grid-cell div:focus{border-color:#91bbe9}.mce-grid td.mce-grid-cell div[disabled]{cursor:not-allowed}.mce-grid{border-spacing:2px;border-collapse:separate}.mce-grid a{display:block;border:1px solid transparent}.mce-grid a:hover,.mce-grid a:focus{border-color:#91bbe9}.mce-grid-border{margin:0 4px 0 4px}.mce-grid-border a{border-color:#c5c5c5;width:13px;height:13px}.mce-grid-border a:hover,.mce-grid-border a.mce-active{border-color:#91bbe9;background:#bdd6f2}.mce-text-center{text-align:center}div.mce-tinymce-inline{width:100%}.mce-colorbtn-trans div{text-align:center;vertical-align:middle;font-weight:bold;font-size:20px;line-height:16px;color:#8b8b8b}.mce-monospace{font-family:"Courier New",Courier,monospace}.mce-toolbar-grp .mce-flow-layout-item{margin-bottom:0}.mce-container b{font-weight:bold}.mce-container p{margin-bottom:5px}.mce-container a{cursor:pointer;color:#2276d2}.mce-container a:hover{text-decoration:underline}.mce-container ul{margin-left:15px}.mce-container .mce-table-striped{border-collapse:collapse;margin:10px}.mce-container .mce-table-striped thead>tr{background-color:#fafafa}.mce-container .mce-table-striped thead>tr th{font-weight:bold}.mce-container .mce-table-striped td,.mce-container .mce-table-striped th{padding:5px}.mce-container .mce-table-striped tr:nth-child(even){background-color:#fafafa}.mce-container .mce-table-striped tbody>tr:hover{background-color:#e1e1e1}.mce-branding{font-size:inherit;text-transform:uppercase;white-space:pre;padding:8px 0}.mce-branding a{font-size:inherit;color:inherit}.mce-top-part{position:relative}.mce-top-part::before{content:'';position:absolute;-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);top:0;right:0;bottom:0;left:0;pointer-events:none}.mce-rtl .mce-wordcount{left:0;right:auto}.mce-rtl .mce-statusbar>.mce-container-body>*:last-child{padding-right:0;padding-left:10px}.mce-rtl .mce-path{text-align:right;padding-right:16px}.mce-croprect-container{position:absolute;top:0;left:0}.mce-croprect-handle{position:absolute;top:0;left:0;width:20px;height:20px;border:2px solid white}.mce-croprect-handle-nw{border-width:2px 0 0 2px;margin:-2px 0 0 -2px;cursor:nw-resize;top:100px;left:100px}.mce-croprect-handle-ne{border-width:2px 2px 0 0;margin:-2px 0 0 -20px;cursor:ne-resize;top:100px;left:200px}.mce-croprect-handle-sw{border-width:0 0 2px 2px;margin:-20px 2px 0 -2px;cursor:sw-resize;top:200px;left:100px}.mce-croprect-handle-se{border-width:0 2px 2px 0;margin:-20px 0 0 -20px;cursor:se-resize;top:200px;left:200px}.mce-croprect-handle-move{position:absolute;cursor:move;border:0}.mce-croprect-block{opacity:.5;filter:alpha(opacity=50);zoom:1;position:absolute;background:black}.mce-croprect-handle:focus{border-color:#2276d2}.mce-croprect-handle-move:focus{outline:1px solid #2276d2}.mce-imagepanel{overflow:auto;background:black}.mce-imagepanel-bg{position:absolute;background:url('data:image/gif;base64,R0lGODdhDAAMAIABAMzMzP///ywAAAAADAAMAAACFoQfqYeabNyDMkBQb81Uat85nxguUAEAOw==')}.mce-imagepanel img{position:absolute}.mce-imagetool.mce-btn .mce-ico{display:block;width:20px;height:20px;text-align:center;line-height:20px;font-size:20px;padding:5px}.mce-arrow-up{margin-top:12px}.mce-arrow-down{margin-top:-12px}.mce-arrow:before,.mce-arrow:after{position:absolute;left:50%;display:block;width:0;height:0;border-style:solid;border-color:transparent;content:""}.mce-arrow.mce-arrow-up:before{top:-9px;border-bottom-color:#c5c5c5;border-width:0 9px 9px;margin-left:-9px}.mce-arrow.mce-arrow-down:before{bottom:-9px;border-top-color:#c5c5c5;border-width:9px 9px 0;margin-left:-9px}.mce-arrow.mce-arrow-up:after{top:-8px;border-bottom-color:#fff;border-width:0 8px 8px;margin-left:-8px}.mce-arrow.mce-arrow-down:after{bottom:-8px;border-top-color:#fff;border-width:8px 8px 0;margin-left:-8px}.mce-arrow.mce-arrow-left:before,.mce-arrow.mce-arrow-left:after{margin:0}.mce-arrow.mce-arrow-left:before{left:8px}.mce-arrow.mce-arrow-left:after{left:9px}.mce-arrow.mce-arrow-right:before,.mce-arrow.mce-arrow-right:after{left:auto;margin:0}.mce-arrow.mce-arrow-right:before{right:8px}.mce-arrow.mce-arrow-right:after{right:9px}.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-left:before{left:-9px;top:50%;border-right-color:#c5c5c5;border-width:9px 9px 9px 0;margin-top:-9px}.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-left:after{left:-8px;top:50%;border-right-color:#fff;border-width:8px 8px 8px 0;margin-top:-8px}.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-left{margin-left:12px}.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-right:before{right:-9px;top:50%;border-left-color:#c5c5c5;border-width:9px 0 9px 9px;margin-top:-9px}.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-right:after{right:-8px;top:50%;border-left-color:#fff;border-width:8px 0 8px 8px;margin-top:-8px}.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-right{margin-left:-14px}.mce-edit-aria-container>.mce-container-body{display:flex}.mce-edit-aria-container>.mce-container-body .mce-edit-area{flex:1}.mce-edit-aria-container>.mce-container-body .mce-sidebar>.mce-container-body{display:flex;align-items:stretch;height:100%}.mce-edit-aria-container>.mce-container-body .mce-sidebar-panel{min-width:250px;max-width:250px;position:relative}.mce-edit-aria-container>.mce-container-body .mce-sidebar-panel>.mce-container-body{position:absolute;width:100%;height:100%;overflow:auto;top:0;left:0}.mce-sidebar-toolbar{border:0 solid #c5c5c5;border-left-width:1px}.mce-sidebar-toolbar .mce-btn{border-left:0;border-right:0}.mce-sidebar-toolbar .mce-btn.mce-active,.mce-sidebar-toolbar .mce-btn.mce-active:hover{background-color:#555c66}.mce-sidebar-toolbar .mce-btn.mce-active button,.mce-sidebar-toolbar .mce-btn.mce-active:hover button,.mce-sidebar-toolbar .mce-btn.mce-active button i,.mce-sidebar-toolbar .mce-btn.mce-active:hover button i{color:white;text-shadow:1px 1px none}.mce-sidebar-panel{border:0 solid #c5c5c5;border-left-width:1px}.mce-container,.mce-container-body{display:block}.mce-autoscroll{overflow:hidden}.mce-scrollbar{position:absolute;width:7px;height:100%;top:2px;right:2px;opacity:.4;filter:alpha(opacity=40);zoom:1}.mce-scrollbar-h{top:auto;right:auto;left:2px;bottom:2px;width:100%;height:7px}.mce-scrollbar-thumb{position:absolute;background-color:#000;border:1px solid #888;border-color:rgba(85,85,85,0.6);width:5px;height:100%}.mce-scrollbar-h .mce-scrollbar-thumb{width:100%;height:5px}.mce-scrollbar:hover,.mce-scrollbar.mce-active{background-color:#AAA;opacity:.6;filter:alpha(opacity=60);zoom:1}.mce-scroll{position:relative}.mce-panel{border:0 solid #f3f3f3;border:0 solid #c5c5c5;background-color:#fff}.mce-floatpanel{position:absolute;-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);box-shadow:0 1px 2px rgba(0, 0, 0, 0.2)}.mce-floatpanel.mce-fixed{position:fixed}.mce-floatpanel .mce-arrow,.mce-floatpanel .mce-arrow:after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}.mce-floatpanel .mce-arrow{border-width:11px}.mce-floatpanel .mce-arrow:after{border-width:10px;content:""}.mce-floatpanel.mce-popover{filter:progid:DXImageTransform.Microsoft.gradient(enabled = false);background:transparent;-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);top:0;left:0;background:#FFF;border:1px solid #c5c5c5;border:1px solid rgba(0,0,0,0.25)}.mce-floatpanel.mce-popover.mce-bottom{margin-top:10px;*margin-top:0}.mce-floatpanel.mce-popover.mce-bottom>.mce-arrow{left:50%;margin-left:-11px;border-top-width:0;border-bottom-color:#c5c5c5;border-bottom-color:rgba(0,0,0,0.25);top:-11px}.mce-floatpanel.mce-popover.mce-bottom>.mce-arrow:after{top:1px;margin-left:-10px;border-top-width:0;border-bottom-color:#FFF}.mce-floatpanel.mce-popover.mce-top{margin-top:-10px;*margin-top:0}.mce-floatpanel.mce-popover.mce-top>.mce-arrow{left:50%;margin-left:-11px;border-bottom-width:0;border-top-color:#c5c5c5;top:auto;bottom:-11px}.mce-floatpanel.mce-popover.mce-top>.mce-arrow:after{bottom:1px;margin-left:-10px;border-bottom-width:0;border-top-color:#FFF}.mce-floatpanel.mce-popover.mce-bottom.mce-start,.mce-floatpanel.mce-popover.mce-top.mce-start{margin-left:-22px}.mce-floatpanel.mce-popover.mce-bottom.mce-start>.mce-arrow,.mce-floatpanel.mce-popover.mce-top.mce-start>.mce-arrow{left:20px}.mce-floatpanel.mce-popover.mce-bottom.mce-end,.mce-floatpanel.mce-popover.mce-top.mce-end{margin-left:22px}.mce-floatpanel.mce-popover.mce-bottom.mce-end>.mce-arrow,.mce-floatpanel.mce-popover.mce-top.mce-end>.mce-arrow{right:10px;left:auto}.mce-fullscreen{border:0;padding:0;margin:0;overflow:hidden;height:100%}div.mce-fullscreen{position:fixed;top:0;left:0}#mce-modal-block{opacity:0;filter:alpha(opacity=0);zoom:1;position:fixed;left:0;top:0;width:100%;height:100%;background:#FFF}#mce-modal-block.mce-in{opacity:.5;filter:alpha(opacity=50);zoom:1}.mce-window-move{cursor:move}.mce-window{-webkit-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);filter:progid:DXImageTransform.Microsoft.gradient(enabled = false);background:transparent;background:#FFF;position:fixed;top:0;left:0;opacity:0;transform:scale(.1);transition:transform 100ms ease-in,opacity 150ms ease-in}.mce-window.mce-in{transform:scale(1);opacity:1}.mce-window-head{padding:9px 15px;border-bottom:1px solid #c5c5c5;position:relative}.mce-window-head .mce-close{position:absolute;right:0;top:0;height:38px;width:38px;text-align:center;cursor:pointer}.mce-window-head .mce-close i{color:#9b9b9b}.mce-close:hover i{color:#bdbdbd}.mce-window-head .mce-title{line-height:20px;font-size:20px;font-weight:bold;text-rendering:optimizelegibility;padding-right:20px}.mce-window .mce-container-body{display:block}.mce-foot{display:block;background-color:#FFF;border-top:1px solid #c5c5c5}.mce-window-head .mce-dragh{position:absolute;top:0;left:0;cursor:move;width:90%;height:100%}.mce-window iframe{width:100%;height:100%}.mce-window-body .mce-listbox{border-color:#e2e4e7}.mce-window .mce-btn:hover{border-color:#c5c5c5}.mce-window .mce-btn:focus{border-color:#2276d2}.mce-window-body .mce-btn,.mce-foot .mce-btn{border-color:#c5c5c5}.mce-foot .mce-btn.mce-primary{border-color:transparent}.mce-rtl .mce-window-head .mce-close{position:absolute;right:auto;left:0}.mce-rtl .mce-window-head .mce-dragh{left:auto;right:0}.mce-rtl .mce-window-head .mce-title{direction:rtl;text-align:right;padding-right:0;padding-left:20px}.mce-tooltip{position:absolute;padding:5px;opacity:.8;filter:alpha(opacity=80);zoom:1;margin-top:1px}.mce-tooltip-inner{font-size:11px;background-color:#000;color:white;max-width:200px;padding:5px 8px 4px 8px;text-align:center;white-space:normal}.mce-tooltip-inner{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.mce-tooltip-arrow{position:absolute;width:0;height:0;line-height:0;border:5px dashed #000}.mce-tooltip-arrow-n{border-bottom-color:#000}.mce-tooltip-arrow-s{border-top-color:#000}.mce-tooltip-arrow-e{border-left-color:#000}.mce-tooltip-arrow-w{border-right-color:#000}.mce-tooltip-nw,.mce-tooltip-sw{margin-left:-14px}.mce-tooltip-ne,.mce-tooltip-se{margin-left:14px}.mce-tooltip-n .mce-tooltip-arrow{top:0;left:50%;margin-left:-5px;border-bottom-style:solid;border-top:none;border-left-color:transparent;border-right-color:transparent}.mce-tooltip-nw .mce-tooltip-arrow{top:0;left:10px;border-bottom-style:solid;border-top:none;border-left-color:transparent;border-right-color:transparent}.mce-tooltip-ne .mce-tooltip-arrow{top:0;right:10px;border-bottom-style:solid;border-top:none;border-left-color:transparent;border-right-color:transparent}.mce-tooltip-s .mce-tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-top-style:solid;border-bottom:none;border-left-color:transparent;border-right-color:transparent}.mce-tooltip-sw .mce-tooltip-arrow{bottom:0;left:10px;border-top-style:solid;border-bottom:none;border-left-color:transparent;border-right-color:transparent}.mce-tooltip-se .mce-tooltip-arrow{bottom:0;right:10px;border-top-style:solid;border-bottom:none;border-left-color:transparent;border-right-color:transparent}.mce-tooltip-e .mce-tooltip-arrow{right:0;top:50%;margin-top:-5px;border-left-style:solid;border-right:none;border-top-color:transparent;border-bottom-color:transparent}.mce-tooltip-w .mce-tooltip-arrow{left:0;top:50%;margin-top:-5px;border-right-style:solid;border-left:none;border-top-color:transparent;border-bottom-color:transparent}.mce-progress{display:inline-block;position:relative;height:20px}.mce-progress .mce-bar-container{display:inline-block;width:100px;height:100%;margin-right:8px;border:1px solid #ccc;overflow:hidden}.mce-progress .mce-text{display:inline-block;margin-top:auto;margin-bottom:auto;font-size:14px;width:40px;color:#595959}.mce-bar{display:block;width:0;height:100%;background-color:#dfdfdf;-webkit-transition:width .2s ease;transition:width .2s ease}.mce-notification{position:absolute;background-color:#fff;padding:5px;margin-top:5px;border-width:1px;border-style:solid;border-color:#c5c5c5;transition:transform 100ms ease-in,opacity 150ms ease-in;opacity:0;box-sizing:border-box}.mce-notification.mce-in{opacity:1}.mce-notification-success{background-color:#dff0d8;border-color:#d6e9c6}.mce-notification-info{background-color:#d9edf7;border-color:#779ECB}.mce-notification-warning{background-color:#fcf8e3;border-color:#faebcc}.mce-notification-error{background-color:#f2dede;border-color:#ebccd1}.mce-notification.mce-has-close{padding-right:15px}.mce-notification .mce-ico{margin-top:5px}.mce-notification-inner{word-wrap:break-word;-ms-word-break:break-all;word-break:break-all;word-break:break-word;-ms-hyphens:auto;-moz-hyphens:auto;-webkit-hyphens:auto;hyphens:auto;display:inline-block;font-size:14px;margin:5px 8px 4px 8px;text-align:center;white-space:normal;color:#31708f}.mce-notification-inner a{text-decoration:underline;cursor:pointer}.mce-notification .mce-progress{margin-right:8px}.mce-notification .mce-progress .mce-text{margin-top:5px}.mce-notification *,.mce-notification .mce-progress .mce-text{color:#595959}.mce-notification .mce-progress .mce-bar-container{border-color:#c5c5c5}.mce-notification .mce-progress .mce-bar-container .mce-bar{background-color:#595959}.mce-notification-success *,.mce-notification-success .mce-progress .mce-text{color:#3c763d}.mce-notification-success .mce-progress .mce-bar-container{border-color:#d6e9c6}.mce-notification-success .mce-progress .mce-bar-container .mce-bar{background-color:#3c763d}.mce-notification-info *,.mce-notification-info .mce-progress .mce-text{color:#31708f}.mce-notification-info .mce-progress .mce-bar-container{border-color:#779ECB}.mce-notification-info .mce-progress .mce-bar-container .mce-bar{background-color:#31708f}.mce-notification-warning *,.mce-notification-warning .mce-progress .mce-text{color:#8a6d3b}.mce-notification-warning .mce-progress .mce-bar-container{border-color:#faebcc}.mce-notification-warning .mce-progress .mce-bar-container .mce-bar{background-color:#8a6d3b}.mce-notification-error *,.mce-notification-error .mce-progress .mce-text{color:#a94442}.mce-notification-error .mce-progress .mce-bar-container{border-color:#ebccd1}.mce-notification-error .mce-progress .mce-bar-container .mce-bar{background-color:#a94442}.mce-notification .mce-close{position:absolute;top:6px;right:8px;font-size:20px;font-weight:bold;line-height:20px;color:#9b9b9b;cursor:pointer}.mce-abs-layout{position:relative}html .mce-abs-layout-item,.mce-abs-end{position:absolute}.mce-abs-end{width:1px;height:1px}.mce-container-body.mce-abs-layout{overflow:hidden}.mce-btn{border:1px solid #b3b3b3;border-color:transparent transparent transparent transparent;position:relative;text-shadow:0 1px 1px rgba(255,255,255,0.75);background:white;display:inline-block;*display:inline;*zoom:1;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.mce-btn:hover,.mce-btn:active{background:white;color:#595959;border-color:#e2e4e7}.mce-btn:focus{background:white;color:#595959;border-color:#e2e4e7}.mce-btn.mce-disabled button,.mce-btn.mce-disabled:hover button{cursor:default;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;opacity:.4;filter:alpha(opacity=40);zoom:1}.mce-btn.mce-active,.mce-btn.mce-active:hover,.mce-btn.mce-active:focus,.mce-btn.mce-active:active{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background:#555c66;color:white;border-color:transparent}.mce-btn.mce-active button,.mce-btn.mce-active:hover button,.mce-btn.mce-active i,.mce-btn.mce-active:hover i{color:white}.mce-btn:hover .mce-caret{border-top-color:#b5bcc2}.mce-btn.mce-active .mce-caret,.mce-btn.mce-active:hover .mce-caret{border-top-color:white}.mce-btn button{padding:4px 6px;font-size:14px;line-height:20px;*line-height:16px;cursor:pointer;color:#595959;text-align:center;overflow:visible;-webkit-appearance:none}.mce-btn button::-moz-focus-inner{border:0;padding:0}.mce-btn i{text-shadow:1px 1px none}.mce-primary.mce-btn-has-text{min-width:50px}.mce-primary{color:white;border:1px solid transparent;border-color:transparent;background-color:#2276d2}.mce-primary:hover,.mce-primary:focus{background-color:#1e6abc;border-color:transparent}.mce-primary.mce-disabled button,.mce-primary.mce-disabled:hover button{cursor:default;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;opacity:.4;filter:alpha(opacity=40);zoom:1}.mce-primary.mce-active,.mce-primary.mce-active:hover,.mce-primary:not(.mce-disabled):active{background-color:#1e6abc;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.mce-primary button,.mce-primary button i{color:white;text-shadow:1px 1px none}.mce-btn .mce-txt{font-size:inherit;line-height:inherit;color:inherit}.mce-btn-large button{padding:9px 14px;font-size:16px;line-height:normal}.mce-btn-large i{margin-top:2px}.mce-btn-small button{padding:1px 5px;font-size:12px;*padding-bottom:2px}.mce-btn-small i{line-height:20px;vertical-align:top;*line-height:18px}.mce-btn .mce-caret{margin-top:8px;margin-left:0}.mce-btn-small .mce-caret{margin-top:8px;margin-left:0}.mce-caret{display:inline-block;*display:inline;*zoom:1;width:0;height:0;vertical-align:top;border-top:4px solid #b5bcc2;border-right:4px solid transparent;border-left:4px solid transparent;content:""}.mce-disabled .mce-caret{border-top-color:#aaa}.mce-caret.mce-up{border-bottom:4px solid #b5bcc2;border-top:0}.mce-btn-flat{border:0;background:transparent;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;filter:none}.mce-btn-flat:hover,.mce-btn-flat.mce-active,.mce-btn-flat:focus,.mce-btn-flat:active{border:0;background:#e6e6e6;filter:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.mce-btn-has-text .mce-ico{padding-right:5px}.mce-rtl .mce-btn button{direction:rtl}.mce-toolbar .mce-btn-group{margin:0;padding:2px 0}.mce-btn-group .mce-btn{border-width:1px;margin:0;margin-left:2px}.mce-btn-group:not(:first-child){border-left:1px solid #d9d9d9;padding-left:0;margin-left:2px}.mce-btn-group{margin-left:2px}.mce-btn-group .mce-btn.mce-flow-layout-item{margin:0}.mce-rtl .mce-btn-group .mce-btn{margin-left:0;margin-right:2px}.mce-rtl .mce-btn-group .mce-first{margin-right:0}.mce-rtl .mce-btn-group:not(:first-child){border-left:none;border-right:1px solid #d9d9d9;padding-right:4px;margin-right:4px}.mce-checkbox{cursor:pointer}i.mce-i-checkbox{margin:0 3px 0 0;border:1px solid #c5c5c5;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background-color:white;text-indent:-10em;overflow:hidden}.mce-checked i.mce-i-checkbox{color:#595959;font-size:16px;line-height:16px;text-indent:0}.mce-checkbox:focus i.mce-i-checkbox,.mce-checkbox.mce-focus i.mce-i-checkbox{border:1px solid #2276d2;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.mce-checkbox.mce-disabled .mce-label,.mce-checkbox.mce-disabled i.mce-i-checkbox{color:#bdbdbd}.mce-checkbox .mce-label{vertical-align:middle}.mce-rtl .mce-checkbox{direction:rtl;text-align:right}.mce-rtl i.mce-i-checkbox{margin:0 0 0 3px}.mce-combobox{position:relative;display:inline-block;*display:inline;*zoom:1;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;*height:32px}.mce-combobox input{border:1px solid #c5c5c5;border-right-color:#c5c5c5;height:28px}.mce-combobox.mce-disabled input{color:#bdbdbd}.mce-combobox .mce-btn{border:1px solid #c5c5c5;border-left:0;margin:0}.mce-combobox button{padding-right:8px;padding-left:8px}.mce-combobox.mce-disabled .mce-btn button{cursor:default;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;opacity:.4;filter:alpha(opacity=40);zoom:1}.mce-combobox .mce-status{position:absolute;right:2px;top:50%;line-height:16px;margin-top:-8px;font-size:12px;width:15px;height:15px;text-align:center;cursor:pointer}.mce-combobox.mce-has-status input{padding-right:20px}.mce-combobox.mce-has-open .mce-status{right:37px}.mce-combobox .mce-status.mce-i-warning{color:#c09853}.mce-combobox .mce-status.mce-i-checkmark{color:#468847}.mce-menu.mce-combobox-menu{border-top:0;margin-top:0;max-height:200px}.mce-menu.mce-combobox-menu .mce-menu-item{padding:4px 6px 4px 4px;font-size:11px}.mce-menu.mce-combobox-menu .mce-menu-item-sep{padding:0}.mce-menu.mce-combobox-menu .mce-text,.mce-menu.mce-combobox-menu .mce-text b{font-size:11px}.mce-menu.mce-combobox-menu .mce-menu-item-link,.mce-menu.mce-combobox-menu .mce-menu-item-link b{font-size:11px}.mce-colorbox i{border:1px solid #c5c5c5;width:14px;height:14px}.mce-colorbutton .mce-ico{position:relative}.mce-colorbutton-grid{margin:4px}.mce-colorbutton .mce-preview{padding-right:3px;display:block;position:absolute;left:50%;top:50%;margin-left:-17px;margin-top:7px;background:gray;width:13px;height:2px;overflow:hidden}.mce-colorbutton.mce-btn-small .mce-preview{margin-left:-16px;padding-right:0;width:16px}.mce-rtl .mce-colorbutton{direction:rtl}.mce-rtl .mce-colorbutton .mce-preview{margin-left:0;padding-right:0;padding-left:3px}.mce-rtl .mce-colorbutton.mce-btn-small .mce-preview{margin-left:0;padding-right:0;padding-left:2px}.mce-rtl .mce-colorbutton .mce-open{padding-left:4px;padding-right:4px;border-left:0}.mce-colorpicker{position:relative;width:250px;height:220px}.mce-colorpicker-sv{position:absolute;top:0;left:0;width:90%;height:100%;border:1px solid #c5c5c5;cursor:crosshair;overflow:hidden}.mce-colorpicker-h-chunk{width:100%}.mce-colorpicker-overlay1,.mce-colorpicker-overlay2{width:100%;height:100%;position:absolute;top:0;left:0}.mce-colorpicker-overlay1{filter:progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr='#ffffff', endColorstr='#00ffffff');-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#ffffff', endColorstr='#00ffffff')";background:linear-gradient(to right, #fff, rgba(255,255,255,0))}.mce-colorpicker-overlay2{filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#00000000', endColorstr='#000000');-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#00000000', endColorstr='#000000')";background:linear-gradient(to bottom, rgba(0,0,0,0), #000)}.mce-colorpicker-selector1{background:none;position:absolute;width:12px;height:12px;margin:-8px 0 0 -8px;border:1px solid black;border-radius:50%}.mce-colorpicker-selector2{position:absolute;width:10px;height:10px;border:1px solid white;border-radius:50%}.mce-colorpicker-h{position:absolute;top:0;right:0;width:6.5%;height:100%;border:1px solid #c5c5c5;cursor:crosshair}.mce-colorpicker-h-marker{margin-top:-4px;position:absolute;top:0;left:-1px;width:100%;border:1px solid black;background:white;height:4px;z-index:100}.mce-path{display:inline-block;*display:inline;*zoom:1;padding:8px;white-space:normal;font-size:inherit}.mce-path .mce-txt{display:inline-block;padding-right:3px}.mce-path .mce-path-body{display:inline-block}.mce-path-item{display:inline-block;*display:inline;*zoom:1;cursor:pointer;color:#595959;font-size:inherit;text-transform:uppercase}.mce-path-item:hover{text-decoration:underline}.mce-path-item:focus{background:#555c66;color:white}.mce-path .mce-divider{display:inline;font-size:inherit}.mce-disabled .mce-path-item{color:#aaa}.mce-rtl .mce-path{direction:rtl}.mce-fieldset{border:0 solid #9E9E9E}.mce-fieldset>.mce-container-body{margin-top:-15px}.mce-fieldset-title{margin-left:5px;padding:0 5px 0 5px}.mce-fit-layout{display:inline-block;*display:inline;*zoom:1}.mce-fit-layout-item{position:absolute}.mce-flow-layout-item{display:inline-block;*display:inline;*zoom:1}.mce-flow-layout-item{margin:2px 0 2px 2px}.mce-flow-layout-item.mce-last{margin-right:2px}.mce-flow-layout{white-space:normal}.mce-tinymce-inline .mce-flow-layout{white-space:nowrap}.mce-rtl .mce-flow-layout{text-align:right;direction:rtl}.mce-rtl .mce-flow-layout-item{margin:2px 2px 2px 0}.mce-rtl .mce-flow-layout-item.mce-last{margin-left:2px}.mce-iframe{border:0 solid #c5c5c5;width:100%;height:100%}.mce-infobox{display:inline-block;*display:inline;*zoom:1;text-shadow:0 1px 1px rgba(255,255,255,0.75);overflow:hidden;border:1px solid red}.mce-infobox div{display:block;margin:5px}.mce-infobox div button{position:absolute;top:50%;right:4px;cursor:pointer;margin-top:-8px;display:none}.mce-infobox div button:focus{outline:2px solid #e2e4e7}.mce-infobox.mce-has-help div{margin-right:25px}.mce-infobox.mce-has-help button{display:block}.mce-infobox.mce-success{background:#dff0d8;border-color:#d6e9c6}.mce-infobox.mce-success div{color:#3c763d}.mce-infobox.mce-warning{background:#fcf8e3;border-color:#faebcc}.mce-infobox.mce-warning div{color:#8a6d3b}.mce-infobox.mce-error{background:#f2dede;border-color:#ebccd1}.mce-infobox.mce-error div{color:#a94442}.mce-rtl .mce-infobox div{text-align:right;direction:rtl}.mce-label{display:inline-block;*display:inline;*zoom:1;text-shadow:0 1px 1px rgba(255,255,255,0.75);overflow:hidden}.mce-label.mce-autoscroll{overflow:auto}.mce-label.mce-disabled{color:#aaa}.mce-label.mce-multiline{white-space:pre-wrap}.mce-label.mce-success{color:#468847}.mce-label.mce-warning{color:#c09853}.mce-label.mce-error{color:#b94a48}.mce-rtl .mce-label{text-align:right;direction:rtl}.mce-menubar{border:1px solid #e2e4e7}.mce-menubar .mce-menubtn{border-color:transparent;background:transparent;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;filter:none}.mce-menubar .mce-menubtn button span{color:#595959}.mce-menubar .mce-caret{border-top-color:#b5bcc2}.mce-menubar .mce-active .mce-caret,.mce-menubar .mce-menubtn:hover .mce-caret{border-top-color:#b5bcc2}.mce-menubar .mce-menubtn:hover,.mce-menubar .mce-menubtn.mce-active,.mce-menubar .mce-menubtn:focus{border-color:#e2e4e7;background:white;filter:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.mce-menubar .mce-menubtn.mce-active{border-bottom:none;z-index:65537}div.mce-menubtn.mce-opened{border-bottom-color:white;z-index:65537}div.mce-menubtn.mce-opened.mce-opened-under{z-index:0}.mce-menubtn button{color:#595959}.mce-menubtn.mce-btn-small span{font-size:12px}.mce-menubtn.mce-fixed-width span{display:inline-block;overflow-x:hidden;text-overflow:ellipsis;width:90px}.mce-menubtn.mce-fixed-width.mce-btn-small span{width:70px}.mce-menubtn .mce-caret{*margin-top:6px}.mce-rtl .mce-menubtn button{direction:rtl;text-align:right}.mce-rtl .mce-menubtn.mce-fixed-width span{direction:rtl;text-align:right}.mce-menu-item{display:block;padding:6px 4px 6px 4px;clear:both;font-weight:normal;line-height:20px;color:#595959;white-space:nowrap;cursor:pointer;line-height:normal;border-left:4px solid transparent;margin-bottom:1px}.mce-menu-item .mce-text,.mce-menu-item .mce-text b{line-height:1;vertical-align:initial}.mce-menu-item .mce-caret{margin-top:4px;margin-right:6px;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:4px solid #595959}.mce-menu-item .mce-menu-shortcut{display:inline-block;padding:0 10px 0 20px;color:#aaa}.mce-menu-item .mce-ico{padding-right:4px}.mce-menu-item:hover,.mce-menu-item:focus{background:#ededee}.mce-menu-item:hover .mce-menu-shortcut,.mce-menu-item:focus .mce-menu-shortcut{color:#aaa}.mce-menu-item:hover .mce-text,.mce-menu-item:focus .mce-text,.mce-menu-item:hover .mce-ico,.mce-menu-item:focus .mce-ico{color:#595959}.mce-menu-item.mce-selected{background:#ededee}.mce-menu-item.mce-selected .mce-text,.mce-menu-item.mce-selected .mce-ico{color:#595959}.mce-menu-item.mce-active.mce-menu-item-normal{background:#555c66}.mce-menu-item.mce-active.mce-menu-item-normal .mce-text,.mce-menu-item.mce-active.mce-menu-item-normal .mce-ico{color:white}.mce-menu-item.mce-active.mce-menu-item-checkbox .mce-ico{visibility:visible}.mce-menu-item.mce-disabled,.mce-menu-item.mce-disabled:hover{background:white}.mce-menu-item.mce-disabled:focus,.mce-menu-item.mce-disabled:hover:focus{background:#ededee}.mce-menu-item.mce-disabled .mce-text,.mce-menu-item.mce-disabled:hover .mce-text,.mce-menu-item.mce-disabled .mce-ico,.mce-menu-item.mce-disabled:hover .mce-ico{color:#aaa}.mce-menu-item.mce-menu-item-preview.mce-active{border-left:5px solid #555c66;background:white}.mce-menu-item.mce-menu-item-preview.mce-active .mce-text,.mce-menu-item.mce-menu-item-preview.mce-active .mce-ico{color:#595959}.mce-menu-item.mce-menu-item-preview.mce-active:hover{background:#ededee}.mce-menu-item-link{color:#093;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mce-menu-item-link b{color:#093}.mce-menu-item-ellipsis{display:block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mce-menu-item:hover *,.mce-menu-item.mce-selected *,.mce-menu-item:focus *{color:#595959}div.mce-menu .mce-menu-item-sep,.mce-menu-item-sep:hover{border:0;padding:0;height:1px;margin:9px 1px;overflow:hidden;background:transparent;border-bottom:1px solid rgba(0,0,0,0.1);cursor:default;filter:none}div.mce-menu .mce-menu-item b{font-weight:bold}.mce-menu-item-indent-1{padding-left:20px}.mce-menu-item-indent-2{padding-left:35px}.mce-menu-item-indent-2{padding-left:35px}.mce-menu-item-indent-3{padding-left:40px}.mce-menu-item-indent-4{padding-left:45px}.mce-menu-item-indent-5{padding-left:50px}.mce-menu-item-indent-6{padding-left:55px}.mce-menu.mce-rtl{direction:rtl}.mce-rtl .mce-menu-item{text-align:right;direction:rtl;padding:6px 12px 6px 15px}.mce-rtl .mce-menu-item .mce-caret{margin-left:6px;margin-right:0;border-right:4px solid #595959;border-left:0}.mce-rtl .mce-menu-item.mce-selected .mce-caret,.mce-rtl .mce-menu-item:focus .mce-caret,.mce-rtl .mce-menu-item:hover .mce-caret{border-left-color:transparent;border-right-color:#595959}.mce-rtl .mce-menu-item .mce-ico{padding-right:0;padding-left:4px}.mce-throbber{position:absolute;top:0;left:0;width:100%;height:100%;opacity:.6;filter:alpha(opacity=60);zoom:1;background:#fff url('img/loader.gif') no-repeat center center}.mce-throbber-inline{position:static;height:50px}.mce-menu .mce-throbber-inline{height:25px;background-size:contain}.mce-menu{position:absolute;left:0;top:0;filter:progid:DXImageTransform.Microsoft.gradient(enabled = false);background:transparent;z-index:1000;padding:5px 0 5px 0;margin:-1px 0 0;min-width:180px;background:white;border:1px solid #c5c9cf;border:1px solid #e2e4e7;z-index:1002;-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);max-height:500px;overflow:auto;overflow-x:hidden}.mce-menu.mce-animate{opacity:.01;transform:rotateY(10deg) rotateX(-10deg);transform-origin:left top}.mce-menu.mce-menu-align .mce-menu-shortcut,.mce-menu.mce-menu-align .mce-caret{position:absolute;right:0}.mce-menu i{display:none}.mce-menu-has-icons i{display:inline-block}.mce-menu.mce-in.mce-animate{opacity:1;transform:rotateY(0) rotateX(0);transition:opacity .075s ease,transform .1s ease}.mce-menu-sub-tr-tl{margin:-6px 0 0 -1px}.mce-menu-sub-br-bl{margin:6px 0 0 -1px}.mce-menu-sub-tl-tr{margin:-6px 0 0 1px}.mce-menu-sub-bl-br{margin:6px 0 0 1px}.mce-rtl .mce-menu-item .mce-ico{padding-right:0;padding-left:4px}.mce-rtl.mce-menu-align .mce-caret,.mce-rtl .mce-menu-shortcut{right:auto;left:0}.mce-listbox button{text-align:left;padding-right:20px;position:relative}.mce-listbox .mce-caret{position:absolute;margin-top:-2px;right:8px;top:50%}.mce-rtl .mce-listbox .mce-caret{right:auto;left:8px}.mce-rtl .mce-listbox button{padding-right:10px;padding-left:20px}.mce-container-body .mce-resizehandle{position:absolute;right:0;bottom:0;width:16px;height:16px;visibility:visible;cursor:s-resize;margin:0}.mce-container-body .mce-resizehandle-both{cursor:se-resize}i.mce-i-resize{color:#595959}.mce-selectbox{background:#fff;border:1px solid #c5c5c5}.mce-slider{border:1px solid #c5c5c5;background:#fff;width:100px;height:10px;position:relative;display:block}.mce-slider.mce-vertical{width:10px;height:100px}.mce-slider-handle{border:1px solid #c5c5c5;background:#e6e6e6;display:block;width:13px;height:13px;position:absolute;top:0;left:0;margin-left:-1px;margin-top:-2px}.mce-slider-handle:focus{border-color:#2276d2}.mce-spacer{visibility:hidden}.mce-splitbtn:hover .mce-open{border-left:1px solid #e2e4e7}.mce-splitbtn .mce-open{border-left:1px solid transparent;padding-right:4px;padding-left:4px}.mce-splitbtn .mce-open:focus{border-left:1px solid #e2e4e7}.mce-splitbtn .mce-open:hover,.mce-splitbtn .mce-open:active{border-left:1px solid #e2e4e7}.mce-splitbtn.mce-active:hover .mce-open{border-left:1px solid white}.mce-splitbtn.mce-opened{border-color:#e2e4e7}.mce-splitbtn.mce-btn-small .mce-open{padding:0 3px 0 3px}.mce-rtl .mce-splitbtn{direction:rtl;text-align:right}.mce-rtl .mce-splitbtn button{padding-right:4px;padding-left:4px}.mce-rtl .mce-splitbtn .mce-open{border-left:0}.mce-stack-layout-item{display:block}.mce-tabs{display:block;border-bottom:1px solid #c5c5c5}.mce-tabs,.mce-tabs+.mce-container-body{background:#fff}.mce-tab{display:inline-block;*display:inline;*zoom:1;border:1px solid #c5c5c5;border-width:0 1px 0 0;background:#fff;padding:8px 15px;text-shadow:0 1px 1px rgba(255,255,255,0.75);height:13px;cursor:pointer}.mce-tab:hover{background:#FDFDFD}.mce-tab.mce-active{background:#FDFDFD;border-bottom-color:transparent;margin-bottom:-1px;height:14px}.mce-tab:focus{color:#2276d2}.mce-rtl .mce-tabs{text-align:right;direction:rtl}.mce-rtl .mce-tab{border-width:0 0 0 1px}.mce-textbox{background:#fff;border:1px solid #c5c5c5;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;display:inline-block;-webkit-transition:border linear .2s, box-shadow linear .2s;transition:border linear .2s, box-shadow linear .2s;height:28px;resize:none;padding:0 4px 0 4px;white-space:pre-wrap;*white-space:pre;color:#595959}.mce-textbox:focus,.mce-textbox.mce-focus{border-color:#2276d2;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.mce-placeholder .mce-textbox{color:#aaa}.mce-textbox.mce-multiline{padding:4px;height:auto}.mce-textbox.mce-disabled{color:#bdbdbd}.mce-rtl .mce-textbox{text-align:right;direction:rtl}.mce-dropzone{border:3px dashed gray;text-align:center}.mce-dropzone span{text-transform:uppercase;display:inline-block;vertical-align:middle}.mce-dropzone:after{content:"";height:100%;display:inline-block;vertical-align:middle}.mce-dropzone.mce-disabled{opacity:.4;filter:alpha(opacity=40);zoom:1}.mce-dropzone.mce-disabled.mce-dragenter{cursor:not-allowed}.mce-browsebutton{position:relative;overflow:hidden}.mce-browsebutton button{position:relative;z-index:1}.mce-browsebutton input{opacity:0;filter:alpha(opacity=0);zoom:1;position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}@font-face{font-family:'tinymce';src:url('fonts/tinymce.eot');src:url('fonts/tinymce.eot?#iefix') format('embedded-opentype'),url('fonts/tinymce.woff') format('woff'),url('fonts/tinymce.ttf') format('truetype'),url('fonts/tinymce.svg#tinymce') format('svg');font-weight:normal;font-style:normal}@font-face{font-family:'tinymce-small';src:url('fonts/tinymce-small.eot');src:url('fonts/tinymce-small.eot?#iefix') format('embedded-opentype'),url('fonts/tinymce-small.woff') format('woff'),url('fonts/tinymce-small.ttf') format('truetype'),url('fonts/tinymce-small.svg#tinymce') format('svg');font-weight:normal;font-style:normal}.mce-ico{font-family:'tinymce',Arial;font-style:normal;font-weight:normal;font-variant:normal;font-size:16px;line-height:16px;speak:none;vertical-align:text-top;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:inline-block;background:transparent center center;background-size:cover;width:16px;height:16px;color:#595959}.mce-btn-small .mce-ico{font-family:'tinymce-small',Arial}.mce-i-save:before{content:"\e000"}.mce-i-newdocument:before{content:"\e001"}.mce-i-fullpage:before{content:"\e002"}.mce-i-alignleft:before{content:"\e003"}.mce-i-aligncenter:before{content:"\e004"}.mce-i-alignright:before{content:"\e005"}.mce-i-alignjustify:before{content:"\e006"}.mce-i-alignnone:before{content:"\e003"}.mce-i-cut:before{content:"\e007"}.mce-i-paste:before{content:"\e008"}.mce-i-searchreplace:before{content:"\e009"}.mce-i-bullist:before{content:"\e00a"}.mce-i-numlist:before{content:"\e00b"}.mce-i-indent:before{content:"\e00c"}.mce-i-outdent:before{content:"\e00d"}.mce-i-blockquote:before{content:"\e00e"}.mce-i-undo:before{content:"\e00f"}.mce-i-redo:before{content:"\e010"}.mce-i-link:before{content:"\e011"}.mce-i-unlink:before{content:"\e012"}.mce-i-anchor:before{content:"\e013"}.mce-i-image:before{content:"\e014"}.mce-i-media:before{content:"\e015"}.mce-i-help:before{content:"\e016"}.mce-i-code:before{content:"\e017"}.mce-i-insertdatetime:before{content:"\e018"}.mce-i-preview:before{content:"\e019"}.mce-i-forecolor:before{content:"\e01a"}.mce-i-backcolor:before{content:"\e01a"}.mce-i-table:before{content:"\e01b"}.mce-i-hr:before{content:"\e01c"}.mce-i-removeformat:before{content:"\e01d"}.mce-i-subscript:before{content:"\e01e"}.mce-i-superscript:before{content:"\e01f"}.mce-i-charmap:before{content:"\e020"}.mce-i-emoticons:before{content:"\e021"}.mce-i-print:before{content:"\e022"}.mce-i-fullscreen:before{content:"\e023"}.mce-i-spellchecker:before{content:"\e024"}.mce-i-nonbreaking:before{content:"\e025"}.mce-i-template:before{content:"\e026"}.mce-i-pagebreak:before{content:"\e027"}.mce-i-restoredraft:before{content:"\e028"}.mce-i-bold:before{content:"\e02a"}.mce-i-italic:before{content:"\e02b"}.mce-i-underline:before{content:"\e02c"}.mce-i-strikethrough:before{content:"\e02d"}.mce-i-visualchars:before{content:"\e02e"}.mce-i-visualblocks:before{content:"\e02e"}.mce-i-ltr:before{content:"\e02f"}.mce-i-rtl:before{content:"\e030"}.mce-i-copy:before{content:"\e031"}.mce-i-resize:before{content:"\e032"}.mce-i-browse:before{content:"\e034"}.mce-i-pastetext:before{content:"\e035"}.mce-i-rotateleft:before{content:"\eaa8"}.mce-i-rotateright:before{content:"\eaa9"}.mce-i-crop:before{content:"\ee78"}.mce-i-editimage:before{content:"\e915"}.mce-i-options:before{content:"\ec6a"}.mce-i-flipv:before{content:"\eaaa"}.mce-i-fliph:before{content:"\eaac"}.mce-i-zoomin:before{content:"\eb35"}.mce-i-zoomout:before{content:"\eb36"}.mce-i-sun:before{content:"\eccc"}.mce-i-moon:before{content:"\eccd"}.mce-i-arrowleft:before{content:"\edc0"}.mce-i-arrowright:before{content:"\e93c"}.mce-i-drop:before{content:"\e935"}.mce-i-contrast:before{content:"\ecd4"}.mce-i-sharpen:before{content:"\eba7"}.mce-i-resize2:before{content:"\edf9"}.mce-i-orientation:before{content:"\e601"}.mce-i-invert:before{content:"\e602"}.mce-i-gamma:before{content:"\e600"}.mce-i-remove:before{content:"\ed6a"}.mce-i-tablerowprops:before{content:"\e604"}.mce-i-tablecellprops:before{content:"\e605"}.mce-i-table2:before{content:"\e606"}.mce-i-tablemergecells:before{content:"\e607"}.mce-i-tableinsertcolbefore:before{content:"\e608"}.mce-i-tableinsertcolafter:before{content:"\e609"}.mce-i-tableinsertrowbefore:before{content:"\e60a"}.mce-i-tableinsertrowafter:before{content:"\e60b"}.mce-i-tablesplitcells:before{content:"\e60d"}.mce-i-tabledelete:before{content:"\e60e"}.mce-i-tableleftheader:before{content:"\e62a"}.mce-i-tabletopheader:before{content:"\e62b"}.mce-i-tabledeleterow:before{content:"\e800"}.mce-i-tabledeletecol:before{content:"\e801"}.mce-i-codesample:before{content:"\e603"}.mce-i-fill:before{content:"\e902"}.mce-i-borderwidth:before{content:"\e903"}.mce-i-line:before{content:"\e904"}.mce-i-count:before{content:"\e905"}.mce-i-translate:before{content:"\e907"}.mce-i-drag:before{content:"\e908"}.mce-i-home:before{content:"\e90b"}.mce-i-upload:before{content:"\e914"}.mce-i-bubble:before{content:"\e91c"}.mce-i-user:before{content:"\e91d"}.mce-i-lock:before{content:"\e926"}.mce-i-unlock:before{content:"\e927"}.mce-i-settings:before{content:"\e928"}.mce-i-remove2:before{content:"\e92a"}.mce-i-menu:before{content:"\e92d"}.mce-i-warning:before{content:"\e930"}.mce-i-question:before{content:"\e931"}.mce-i-pluscircle:before{content:"\e932"}.mce-i-info:before{content:"\e933"}.mce-i-notice:before{content:"\e934"}.mce-i-arrowup:before{content:"\e93b"}.mce-i-arrowdown:before{content:"\e93d"}.mce-i-arrowup2:before{content:"\e93f"}.mce-i-arrowdown2:before{content:"\e940"}.mce-i-menu2:before{content:"\e941"}.mce-i-newtab:before{content:"\e961"}.mce-i-a11y:before{content:"\e900"}.mce-i-plus:before{content:"\e93a"}.mce-i-insert:before{content:"\e93a"}.mce-i-minus:before{content:"\e939"}.mce-i-books:before{content:"\e911"}.mce-i-reload:before{content:"\e906"}.mce-i-toc:before{content:"\e901"}.mce-i-checkmark:before{content:"\e033"}.mce-i-format-painter:before{content:"\e909"}.mce-i-checkbox:before,.mce-i-selected:before{content:"\e033"}.mce-i-insert{font-size:14px}.mce-i-selected{visibility:hidden}i.mce-i-backcolor{text-shadow:none;background:#BBB}.mce-rtl .mce-filepicker input{direction:ltr}/*# sourceMappingURL=skin.min.css.map */
\ No newline at end of file

public/assets/tinymce/skins/lightgray/skin.mobile.min.css

+.tinymce-mobile-outer-container{all:initial;display:block}.tinymce-mobile-outer-container *{-webkit-box-sizing:initial;box-sizing:initial;line-height:1;margin:0;padding:0;border:0;outline:0;text-shadow:none;float:none;white-space:nowrap;cursor:inherit;-webkit-tap-highlight-color:transparent}.tinymce-mobile-icon-arrow-back:before{content:"\e5cd"}.tinymce-mobile-icon-image:before{content:"\e412"}.tinymce-mobile-icon-cancel-circle:before{content:"\e5c9"}.tinymce-mobile-icon-full-dot:before{content:"\e061"}.tinymce-mobile-icon-align-center:before{content:"\e234"}.tinymce-mobile-icon-align-left:before{content:"\e236"}.tinymce-mobile-icon-align-right:before{content:"\e237"}.tinymce-mobile-icon-bold:before{content:"\e238"}.tinymce-mobile-icon-italic:before{content:"\e23f"}.tinymce-mobile-icon-unordered-list:before{content:"\e241"}.tinymce-mobile-icon-ordered-list:before{content:"\e242"}.tinymce-mobile-icon-font-size:before{content:"\e245"}.tinymce-mobile-icon-underline:before{content:"\e249"}.tinymce-mobile-icon-link:before{content:"\e157"}.tinymce-mobile-icon-unlink:before{content:"\eca2"}.tinymce-mobile-icon-color:before{content:"\e891"}.tinymce-mobile-icon-previous:before{content:"\e314"}.tinymce-mobile-icon-next:before{content:"\e315"}.tinymce-mobile-icon-large-font:before,.tinymce-mobile-icon-style-formats:before{content:"\e264"}.tinymce-mobile-icon-undo:before{content:"\e166"}.tinymce-mobile-icon-redo:before{content:"\e15a"}.tinymce-mobile-icon-removeformat:before{content:"\e239"}.tinymce-mobile-icon-small-font:before{content:"\e906"}.tinymce-mobile-icon-readonly-back:before,.tinymce-mobile-format-matches:after{content:"\e5ca"}.tinymce-mobile-icon-small-heading:before{content:"small"}.tinymce-mobile-icon-large-heading:before{content:"large"}.tinymce-mobile-icon-small-heading:before,.tinymce-mobile-icon-large-heading:before{font-family:sans-serif;font-size:80%}.tinymce-mobile-mask-edit-icon:before{content:"\e254"}.tinymce-mobile-icon-back:before{content:"\e5c4"}.tinymce-mobile-icon-heading:before{content:"Headings";font-family:sans-serif;font-weight:bold;font-size:80%}.tinymce-mobile-icon-h1:before{content:"H1";font-weight:bold}.tinymce-mobile-icon-h2:before{content:"H2";font-weight:bold}.tinymce-mobile-icon-h3:before{content:"H3";font-weight:bold}.tinymce-mobile-outer-container .tinymce-mobile-disabled-mask{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;position:absolute;width:100%;height:100%;top:0;background:rgba(51,51,51,0.5)}.tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-border-radius:50%;border-radius:50%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;font-family:sans-serif;font-size:1em}.tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .mixin-menu-item{-webkit-border-radius:50%;border-radius:50%;width:2.1em;height:2.1em;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section{font-size:1em;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}@media only screen and (min-device-width:700px){.tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section{font-size:1.2em}}.tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section .tinymce-mobile-mask-tap-icon{-webkit-border-radius:50%;border-radius:50%;width:2.1em;height:2.1em;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;color:#4682B4;background-color:white}.tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section .tinymce-mobile-mask-tap-icon:before{font-family:'tinymce-mobile';content:"\e900"}.tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section:not(.tinymce-mobile-mask-tap-icon-selected) .tinymce-mobile-mask-tap-icon{z-index:2}.tinymce-mobile-android-container.tinymce-mobile-android-maximized{position:fixed;top:0;bottom:0;left:0;right:0;border:none;background:#fff;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.tinymce-mobile-android-container:not(.tinymce-mobile-android-maximized){position:relative}.tinymce-mobile-android-container .tinymce-mobile-editor-socket{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.tinymce-mobile-android-container .tinymce-mobile-editor-socket iframe{display:-webkit-box !important;display:-webkit-flex !important;display:-ms-flexbox !important;display:flex !important;height:auto !important;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.tinymce-mobile-android-scroll-reload{overflow:hidden}:not(.tinymce-mobile-readonly-mode)>.tinymce-mobile-android-selection-context-toolbar{margin-top:23px}.tinymce-mobile-toolstrip{background:#eceff1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;z-index:1;-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;width:100%;height:2.5em;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;color:#455a64}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group:first-of-type,.tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group:last-of-type{background:#4682B4;color:#eceff1}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:100%;-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group>div{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:100%;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group.tinymce-mobile-exit-container{background:#f44336}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group.tinymce-mobile-toolbar-scrollable-group{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group .tinymce-mobile-toolbar-group-item{padding-left:.5em;padding-right:.5em}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group .tinymce-mobile-toolbar-group-item.tinymce-mobile-toolbar-button{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;margin-left:2px;margin-right:2px;height:80%}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group .tinymce-mobile-toolbar-group-item.tinymce-mobile-toolbar-button.tinymce-mobile-toolbar-button-selected{background:#455a64;color:#b1bec6}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:100%;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;padding-top:.4em;padding-bottom:.4em}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow:hidden;position:relative;width:100%;min-height:1.5em;padding-left:0;padding-right:0}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain{-webkit-transition:left cubic-bezier(.4, 0, 1, 1) .15s;transition:left cubic-bezier(.4, 0, 1, 1) .15s;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;width:100%;height:100%}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen{-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen input{font-family:Sans-serif}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen .tinymce-mobile-input-container{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;position:relative}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen .tinymce-mobile-input-container .tinymce-mobile-input-container-x{position:absolute;right:0;color:#888;font-size:.6em;font-weight:bold;background:inherit;-webkit-border-radius:50%;border-radius:50%;border:none;-webkit-align-self:center;-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center;height:100%;padding-right:2px}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen .tinymce-mobile-input-container.tinymce-mobile-input-container-empty .tinymce-mobile-input-container-x{display:none}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen .tinymce-mobile-icon-previous,.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen .tinymce-mobile-icon-next{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen .tinymce-mobile-icon-previous:before,.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen .tinymce-mobile-icon-next:before{padding-left:.5em;padding-right:.5em;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;font-weight:bold}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen .tinymce-mobile-icon-previous.tinymce-mobile-toolbar-navigation-disabled:before,.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain .tinymce-mobile-serialised-dialog-screen .tinymce-mobile-icon-next.tinymce-mobile-toolbar-navigation-disabled:before{visibility:hidden}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-dot-item{margin:0 2px;font-size:10px;line-height:10px;padding-top:3px;color:#b1bec6}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-dot-item.tinymce-mobile-dot-active{color:#455a64}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;position:relative;padding:.28em 0;margin-left:10%;margin-right:10%}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-icon-large-font:before,.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-icon-large-heading:before{margin-right:.9em;margin-left:.5em}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-icon-small-font:before,.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-icon-small-heading:before{margin-left:.9em;margin-right:.5em}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider{margin-left:0;margin-right:0}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider .tinymce-mobile-slider-size-container{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;height:100%;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider .tinymce-mobile-slider-size-container .tinymce-mobile-slider-size-line{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;margin-top:.3em;margin-bottom:.3em;background:#b1bec6;height:.2em}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider.tinymce-mobile-hue-slider-container{padding-left:2em;padding-right:2em}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider.tinymce-mobile-hue-slider-container .tinymce-mobile-slider-gradient-container{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;height:100%;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider.tinymce-mobile-hue-slider-container .tinymce-mobile-slider-gradient-container .tinymce-mobile-slider-gradient{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;margin-top:.3em;margin-bottom:.3em;background:-webkit-gradient(linear, left top, right top, color-stop(0, #f00), color-stop(17%, #ff0), color-stop(33%, #0f0), color-stop(50%, #0ff), color-stop(67%, #00f), color-stop(83%, #f0f), to(#f00));background:linear-gradient(to right, #f00 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%);height:.2em}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider.tinymce-mobile-hue-slider-container .tinymce-mobile-hue-slider-black{background:black;width:1.2em;height:.2em;margin-top:.3em;margin-bottom:.3em}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider.tinymce-mobile-hue-slider-container .tinymce-mobile-hue-slider-white{background:white;width:1.2em;height:.2em;margin-top:.3em;margin-bottom:.3em}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider .tinymce-mobile-slider-thumb{position:absolute;height:.5em;width:.5em;left:-10px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;margin:auto;top:0;bottom:0;-webkit-transition:border 120ms cubic-bezier(.39, .58, .57, 1);transition:border 120ms cubic-bezier(.39, .58, .57, 1);background-color:#455a64;background-clip:padding-box;color:#eceff1;border:.5em solid rgba(136,136,136,0);-webkit-border-radius:3em;border-radius:3em}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider .tinymce-mobile-slider-thumb.tinymce-mobile-thumb-active{border:.5em solid rgba(136,136,136,0.39)}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serializer-wrapper,.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group>div{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:100%;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serializer-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-toolbar-group-item:not(.tinymce-mobile-serialised-dialog){height:100%}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-toolbar-group-item{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-dot-container{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group input{padding-top:.1em;padding-bottom:.1em;padding-left:5px;font-size:.85em;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;background:#fff;border:none;-webkit-border-radius:0;border-radius:0;color:#455a64}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group input::-webkit-input-placeholder{color:#888}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group input:-ms-input-placeholder{color:#888}.tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group input::placeholder{color:#888}.tinymce-mobile-ios-container .tinymce-mobile-dropup:not(.tinymce-mobile-dropup-closed){min-height:200px}@media only screen and (orientation: landscape){.tinymce-mobile-dropup:not(.tinymce-mobile-dropup-closed){min-height:200px}}@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape){.tinymce-mobile-ios-container .tinymce-mobile-dropup:not(.tinymce-mobile-dropup-closed){min-height:150px}}.tinymce-mobile-dropup{background:white;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;width:100%;overflow:hidden}.tinymce-mobile-dropup.tinymce-mobile-dropup-shrinking{-webkit-transition:height .3s ease-out;transition:height .3s ease-out}.tinymce-mobile-dropup.tinymce-mobile-dropup-growing{-webkit-transition:height .3s ease-in;transition:height .3s ease-in}.tinymce-mobile-dropup.tinymce-mobile-dropup-closed{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0}.tinymce-mobile-dropup.tinymce-mobile-dropup-open:not(.tinymce-mobile-dropup-growing){-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.tinymce-mobile-styles-menu{overflow:hidden;outline:4px solid black;position:relative;width:100%;font-family:sans-serif}.tinymce-mobile-styles-menu [role="menu"]{height:100%;position:absolute;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:100%}.tinymce-mobile-styles-menu [role="menu"].transitioning{-webkit-transition:-webkit-transform .5s ease-in-out;transition:-webkit-transform .5s ease-in-out;transition:transform .5s ease-in-out;transition:transform .5s ease-in-out, -webkit-transform .5s ease-in-out}.tinymce-mobile-styles-menu .tinymce-mobile-styles-item{cursor:pointer;padding:1em 1em;position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;border-bottom:1px solid #ddd;color:#455a64}.tinymce-mobile-styles-menu .tinymce-mobile-styles-collapser .tinymce-mobile-styles-collapse-icon:before{font-family:'tinymce-mobile';content:"\e314";color:#455a64}.tinymce-mobile-styles-menu .tinymce-mobile-styles-item.tinymce-mobile-styles-item-is-menu:after{font-family:'tinymce-mobile';content:"\e315";position:absolute;padding-left:1em;padding-right:1em;right:0;color:#455a64}.tinymce-mobile-styles-menu .tinymce-mobile-styles-item.tinymce-mobile-format-matches:after{font-family:'tinymce-mobile';position:absolute;padding-left:1em;padding-right:1em;right:0}.tinymce-mobile-styles-menu .tinymce-mobile-styles-separator,.tinymce-mobile-styles-menu .tinymce-mobile-styles-collapser{border-top:#455a64;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-height:2.5em;padding-left:1em;padding-right:1em;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;background:#eceff1;color:#455a64}.tinymce-mobile-styles-menu [data-transitioning-destination="before"][data-transitioning-state],.tinymce-mobile-styles-menu [data-transitioning-state="before"]{-webkit-transform:translate(-100%);transform:translate(-100%)}.tinymce-mobile-styles-menu [data-transitioning-destination="current"][data-transitioning-state],.tinymce-mobile-styles-menu [data-transitioning-state="current"]{-webkit-transform:translate(0);transform:translate(0)}.tinymce-mobile-styles-menu [data-transitioning-destination="after"][data-transitioning-state],.tinymce-mobile-styles-menu [data-transitioning-state="after"]{-webkit-transform:translate(100%);transform:translate(100%)}@font-face{font-family:'tinymce-mobile';src:url('fonts/tinymce-mobile.woff?8x92w3') format('woff');font-weight:normal;font-style:normal}@media (min-device-width:700px){.tinymce-mobile-outer-container,.tinymce-mobile-outer-container input{font-size:25px}}@media (max-device-width:700px){.tinymce-mobile-outer-container,.tinymce-mobile-outer-container input{font-size:18px}}.tinymce-mobile-icon{font-family:'tinymce-mobile'}.mixin-flex-and-centre{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.mixin-flex-bar{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:100%}.tinymce-mobile-outer-container:not(.tinymce-mobile-fullscreen-maximized) .tinymce-mobile-editor-socket{overflow:hidden;height:300px}.tinymce-mobile-outer-container:not(.tinymce-mobile-fullscreen-maximized) .tinymce-mobile-toolstrip{display:none}.tinymce-mobile-editor-socket .tinymce-mobile-mask-edit-icon{position:fixed;right:2em;bottom:1em;color:white;background-color:#4682B4;-webkit-border-radius:50%;border-radius:50%;width:2.1em;height:2.1em;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;font-size:1em}@media only screen and (min-device-width:700px){.tinymce-mobile-editor-socket .tinymce-mobile-mask-edit-icon{font-size:1.2em}}input[type="file"]::-webkit-file-upload-button{display:none}@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape){.tinymce-mobile-ios-container .tinymce-mobile-editor-socket .tinymce-mobile-mask-edit-icon{bottom:50%}}
+/*# sourceMappingURL=skin.mobile.min.css.map */
\ No newline at end of file

src/App.tsx

+import { Vue, Component } from 'vue-property-decorator';
+
+@Component({})
+export default class App extends Vue {
+
+    /**
+     * vue 生命周期
+     *
+     * @memberof App
+     */
+    public mounted() {
+        document.body.setAttribute('vue-version', Vue.version);
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof App
+     */
+    public render() {
+        return  <router-view/>;
+    }
+}
\ No newline at end of file

src/app-register.ts

+import { Util } from './utils/util/util';
+import { Http } from './utils/http/http';
+import { CodeList } from './utils/code-list/code-list';
+import { AppPopover } from './utils/app-popover/app-popover';
+import { AppModal } from './utils/app-modal/app-modal';
+import { AppDrawer } from './utils/app-drawer/app-drawer';
+
+export const AppComponents = {
+    install(v: any, opt: any) {
+        v.prototype.$appdrawer = AppDrawer.getInstance();
+        v.prototype.$appmodal = AppModal.getInstance();
+        v.prototype.$apppopover = AppPopover.getInstance();
+        v.prototype.$codelist = CodeList.getInstance();
+        v.prototype.$http = Http.getInstance();
+        v.prototype.$util = Util;
+        v.component('app-tree', () => import('./components/app-tree/app-tree'));
+        v.component('app-keep-alive', () => import('./components/app-keep-alive/app-keep-alive.vue'));
+        v.component('tab-page-exp', () => import('./components/tab-page-exp/tab-page-exp.vue'));
+        v.component('app-form', () => import('./components/app-form/app-form'));
+        v.component('app-form-item', () => import('./components/app-form-item/app-form-item'));
+        v.component('app-form-item2', () => import('./components/app-form-item2/app-form-item2'));
+        v.component('app-form-group', () => import('./components/app-form-group/app-form-group'));
+        v.component('app-form-group2', () => import('./components/app-form-group2/app-form-group2'));
+        v.component('app-autocomplete', () => import('./components/app-autocomplete/app-autocomplete'));
+        v.component('app-picker', () => import('./components/app-picker/app-picker'));
+        v.component('app-mpicker', () => import('./components/app-mpicker/app-mpicker'));
+        v.component('app-form-druipart', () => import('./components/app-form-druipart/app-form-druipart'));
+        v.component('input-box', () => import('./components/input-box/input-box'));
+        v.component('dropdown-list', () => import('./components/dropdown-list/dropdown-list'));
+        v.component('upload-file', () => import('./components/upload-file/upload-file'));
+        v.component('app-theme', () => import('./components/app-theme/app-theme'));
+        v.component('app-user', () => import('./components/app-user/app-user'));
+        v.component('context-menu', () => import('./components/context-menu/context-menu'));
+        v.component('context-menu-container', () => import('./components/context-menu-container/context-menu-container'));
+        v.component('app-checkbox-list',() => import('./components/app-checkbox-list/app-checkbox-list'));
+        v.component('app-radio-group',() => import('./components/app-radio-group/app-radio-group'));
+        v.component('app-embed-picker', () => import('./components/app-embed-picker/app-embed-picker'));
+        v.component('app-rich-text-editor',() => import('./components/app-rich-text-editor/app-rich-text-editor'));
+        v.component('app-code-editor',() => import('./components/app-code-editor/app-code-editor'));
+        v.component('app-file-upload',() => import('./components/app-file-upload/app-file-upload'));
+        v.component('app-image-upload',() => import('./components/app-image-upload/app-image-upload'));
+        v.component('property-layout',() =>import('./components/property-layout/property-layout'));
+        v.component('app-range-editor',() =>import('./components/app-range-editor/app-range-editor'));
+        v.component('app-export-excel',() =>import('./components/app-export-excel/app-export-excel'));
+        v.component('app-lang',() =>import('./components/app-lang/app-lang'));
+    },
+};
\ No newline at end of file

src/components/404/404.less

+html, body {
+    height: 100%;
+}
+
+.app-error-view {
+    height: 100%;
+    width: 100%;
+    position: relative;
+    .app-error-container {
+        height: 380px;
+        width: 670px;
+        position: absolute;
+        top: calc((100% - 400px) / 2);
+        left: calc((100% - 670px) / 2);
+        display: flex;
+        align-items: center;
+        .error-text {
+            padding-left: 20px;
+            .error-text1 {
+                font-size: 20px;
+                margin-bottom: 20px;
+            }
+            .error-text2 {
+                font-size: 14px;
+            }
+        }
+    }
+}
\ No newline at end of file

src/components/404/404.tsx

+import { Vue, Component } from 'vue-property-decorator';
+import './404.less';
+
+@Component({})
+export default class Error404 extends Vue {
+
+    /**
+     * 跳转首页
+     *
+     * @memberof Error404
+     */
+    public gotoIndexView() {
+        this.$router.push('/');
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof Error404
+     */
+    public render() {
+        return (
+            <div class="app-error-view">
+                <div class="app-error-container">
+                    <img src="/assets/img/404.png"></img>
+                    <div class="error-text">
+                        <div class="error-text1">抱歉，您访问的页面不存在！</div>
+                        <div class="error-text2">您要找的页面存在，请返回 <a on-click={this.gotoIndexView}>首页</a> 继续浏览</div>
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file

src/components/500/500.less

+html, body {
+    height: 100%;
+}
+
+.app-error-view {
+    height: 100%;
+    width: 100%;
+    position: relative;
+    .app-error-container {
+        height: 380px;
+        width: 670px;
+        position: absolute;
+        top: calc((100% - 400px) / 2);
+        left: calc((100% - 670px) / 2);
+        display: flex;
+        align-items: center;
+        .error-text {
+            padding-left: 20px;
+            .error-text1 {
+                font-size: 20px;
+                margin-bottom: 20px;
+            }
+            .error-text2 {
+                font-size: 14px;
+            }
+        }
+    }
+}
\ No newline at end of file

src/components/500/500.tsx

+import { Vue, Component } from 'vue-property-decorator';
+import './500.less';
+
+@Component({})
+export default class Error500 extends Vue {
+
+    /**
+     * 跳转首页
+     *
+     * @memberof Error404
+     */
+    public gotoIndexView() {
+        this.$router.push('/');
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof Error404
+     */
+    public render() {
+        return (
+            <div class="app-error-view">
+                <div class="app-error-container">
+                    <img src="/assets/img/500.png"></img>
+                    <div class="error-text">
+                        <div class="error-text1">抱歉，服务器出错了！</div>
+                        <div class="error-text2">服务器出错了，请返回 <a on-click={this.gotoIndexView}>首页</a> 继续浏览</div>
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file

src/components/app-autocomplete/app-autocomplete.less

+.ivu-auto-complete  {
+    .ivu-select-dropdown-list {
+        height: 300px;
+    }
+}

src/components/app-autocomplete/app-autocomplete.tsx

+import { Component, Vue, Prop, Model, Watch } from 'vue-property-decorator';
+import './app-autocomplete.less';
+import { Subject } from 'rxjs';
+import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
+
+@Component({})
+export default class AppAutocomplete extends Vue {
+
+    /**
+     * 表单数据
+     *
+     * @type {*}
+     * @memberof AppAutocomplete
+     */
+    @Prop() public data: any;
+
+    /**
+     * 是否启用
+     *
+     * @type {boolean}
+     * @memberof AppAutocomplete
+     */
+    @Prop() public disabled?: boolean;
+
+    /**
+     * 属性项名称
+     *
+     * @type {string}
+     * @memberof AppAutocomplete
+     */
+    @Prop() public name!: string;
+
+    /**
+     * 值项名称
+     *
+     * @type {string}
+     * @memberof AppAutocomplete
+     */
+    @Prop() public valueitem?: string;
+
+    /**
+     * 值
+     *
+     * @type {*}
+     * @memberof AppPicker
+     */
+    @Model('change') public value?: any;
+
+    /**
+     * 当前值
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    public curvalue: string = '';
+
+    /**
+     * 远程请求url 地址
+     *
+     * @type {string}
+     * @memberof AppAutocomplete
+     */
+    @Prop() public url?: string;
+
+    /**
+     * 数组
+     *
+     * @type {any[]}
+     * @memberof AppAutocomplete
+     */
+    public items: any[] = [];
+
+    /**
+     * 输入状态
+     *
+     * @type {boolean}
+     * @memberof AppAutocomplete
+     */
+    public inputState: boolean = false;
+
+    /**
+     * 值变化
+     *
+     * @param {*} newVal
+     * @param {*} oldVal
+     * @memberof AppPicker
+     */
+    @Watch('value')
+    public onValueChange(newVal: any, oldVal: any) {
+        this.curvalue = newVal;
+    }
+
+    /**
+     * 执行搜索数据
+     * @param query 
+     * @param callback 
+     */
+    public onSearch(query: any, callback: any): void {
+        query = !query ? '' : query;
+        if (!this.inputState && Object.is(query, this.value)) {
+            query = '';
+        }
+        this.inputState = false;
+        const url = `${this.url}${this.name}/ac`;
+        let param: any = {};
+        Object.assign(param, this.data);
+        // 清除值项
+        if (this.valueitem) {
+            delete param[this.valueitem];
+        }
+        Object.assign(param, { [this.name]: query });
+
+        this.$http.post(url, param).then((response: any) => {
+            if (!response || response.status !== 200) {
+                this.$Notice.error({ title: '错误', desc: '请求异常' });
+            } else {
+                this.items = [...response.data];
+            }
+            if (callback) {
+                callback(this.items);
+            }
+        }).catch((error: any) => {
+            if (callback) {
+                callback([]);
+            }
+        });
+    }
+
+    /**
+     * 选中数据回调
+     * @param item 
+     */
+    public onACSelect(item: any): void {
+        if (this.name) {
+            this.$emit('formitemvaluechange', { name: this.name, value: item.text });
+        }
+        if (this.valueitem) {
+            this.$emit('formitemvaluechange', { name: this.valueitem, value: item.value });
+        }
+
+    }
+
+    /**
+     * 输入过程中
+     *
+     * @memberof AppAutocomplete
+     */
+    public onInput($event: any) {
+        if (Object.is($event, this.value)) {
+            this.inputState = true;
+        }
+    }
+
+    /**
+     * 失去焦点事件
+     * @param e 
+     */
+    public onBlur(e: any): void {
+        let val: string = e.target.value;
+        if (!Object.is(val, this.value)) {
+            this.onACSelect({ text: val, value: '' });
+        }
+        this.$forceUpdate();
+    }
+
+    /**
+     * 清除
+     */
+    public onClear($event: any): void {
+        if (this.name) {
+            this.$emit('formitemvaluechange', { name: this.name, value: '' });
+        }
+        if (this.valueitem) {
+            this.$emit('formitemvaluechange', { name: this.valueitem, value: '' });
+        }
+        this.$forceUpdate();
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof AppAutocomplete
+     */
+    public render() {
+        return (
+            <el-autocomplete class='text-value' value-key='text' disabled={this.disabled} v-model={this.curvalue} size='small'
+                trigger-on-focus={true} fetch-suggestions={(query: any, callback: any) => { this.onSearch(query, callback) }} on-select={(item: any) => { this.onACSelect(item) }}
+                on-input={($event: any) => this.onInput($event)} on-blur={($event: any) => { this.onBlur($event) }} style='width:100%;'>
+                <template slot='suffix'>
+                    {(this.curvalue && !this.disabled) ? <i class='el-icon-circle-close' on-click={($event: any) => { this.onClear($event) }}></i> : ''}
+                    <i class="el-icon-arrow-down"></i>
+                </template >
+            </el-autocomplete>
+        );
+    }
+}
\ No newline at end of file

src/components/app-checkbox-list/app-checkbox-list.less

+.app-checkbox-list {
+    overflow: auto;
+}
\ No newline at end of file

src/components/app-checkbox-list/app-checkbox-list.tsx

+import { Component, Vue, Prop, Model } from 'vue-property-decorator';
+import './app-checkbox-list.less';
+
+@Component({})
+export default class AppCheckBox extends Vue {
+
+    /**
+     * 代码表标识
+     *
+     * @type {string}
+     * @memberof AppCheckBox
+     */
+    @Prop() public tag?: string;
+
+    /**
+     * 是否禁用
+     *
+     * @type {boolean}
+     * @memberof AppCheckBox
+     */
+    @Prop() disabled?: boolean;
+
+    /**
+     * 获取启用禁用状态
+     *
+     * @readonly
+     * @memberof AppCheckBox
+     */
+    get isDisabled() {
+        if (this.disabled) {
+            return true;
+        } else {
+            return false;
+        }
+    }
+
+    /**
+     * 属性名称
+     *
+     * @type {*}
+     * @memberof AppCheckBox
+     */
+    @Prop() name?: any;
+
+    /**
+     * 模式（数字或者字符串）
+     *
+     * @type {*}
+     * @memberof AppCheckBox
+     */
+    @Prop() mode: any;
+
+    /**
+     * 当前模式
+     *
+     * @readonly
+     * @memberof AppCheckBox
+     */
+    get currentmode() {
+        if (this.mode) {
+            return this.mode;
+        } else {
+            return 'str';
+        }
+    }
+
+    /**
+     * 分隔符
+     *
+     * @type {*}
+     * @memberof AppCheckBox
+     */
+    @Prop() separator: any;
+
+    /**
+     * 获取分隔符
+     *
+     * @readonly
+     * @memberof AppCheckBox
+     */
+    get currentseparator() {
+        if (this.separator) {
+            return this.separator;
+        } else {
+            return ';';
+        }
+    }
+
+    /** 
+     * 选中值
+     *
+     * @type {*}
+     * @memberof AppCheckBox
+     */
+    @Model('change') selects?: any;
+
+    /**
+     * 选中数组
+     *
+     * @memberof AppCheckBox
+     */
+    get selectArray() {
+        if (this.selects) {
+            if (Object.is(this.currentmode, 'num') && this.items) {
+                let selectsArray: Array<any> = [];
+                let num: number = parseInt(this.selects, 10);
+                this.items.forEach((item: any) => {
+                    if ((num & item.value) == item.value) {
+                        selectsArray.push(item.value);
+                    }
+                });
+                return selectsArray;
+            } else if (Object.is(this.currentmode, 'str')) {
+                if (this.selects !== '') {
+                    return this.selects.split(this.currentseparator);
+                }
+            }
+        } else {
+            return [];
+        }
+
+    }
+
+    /**
+     * 设置选中
+     *
+     * @memberof AppCheckBox
+     */
+    set selectArray(val: any) {
+        let value: null | string | number = null;
+        if (Object.is(this.currentmode, 'num')) {
+            let temp: number = 0;
+            val.forEach((item: any) => {
+                temp = temp | parseInt(item, 10);
+            });
+            value = temp;
+        } else if (Object.is(this.currentmode, 'str')) {
+            let _datas: string[] = [];
+            this.items.forEach((item: any) => {
+                const index = val.findIndex((_key: any) => Object.is(item.value, _key));
+                if (index === -1) {
+                    return;
+                }
+                _datas.push(item.value);
+            });
+            value = _datas.join(this.currentseparator);
+        }
+        this.$emit('change', value);
+    }
+
+    /**
+     * 代码表数组
+     *
+     * @type {any[]}
+     * @memberof AppCheckBox
+     */
+    public items: any[] = [];
+
+    /**
+     * vue  生命周期
+     *
+     * @memberof AppCheckBox
+     */
+    public created() {
+        const codelist = this.$store.getters.getCodeList(this.tag);
+        if (codelist) {
+            this.items = [...JSON.parse(JSON.stringify(codelist.items))];
+        } else {
+            console.log(`----${this.tag}----代码表不存在`);
+        }
+    }
+
+    /**
+     * 渲染组件
+     *
+     * @returns
+     * @memberof AppCheckBox
+     */
+    public render() {
+        return (
+            <checkbox-group class="app-checkbox-list" v-model={this.selectArray}>
+                {this.items.map((item: any) => {
+                    return <checkbox label={item.value} disabled={this.isDisabled || item.disabled}>
+                        <span>{item.text}</span>
+                    </checkbox>
+                })}
+            </checkbox-group >
+        );
+    }
+}
\ No newline at end of file

src/components/app-code-editor/app-code-editor.less

+.codecss {
+    font-size: 18px;
+    font-weight: 600;
+    font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif;
+  }
\ No newline at end of file

src/components/app-code-editor/app-code-editor.tsx

+import { Component, Vue, Prop, Model, Watch } from 'vue-property-decorator';
+import './app-code-editor.less';
+
+import CodeMirror from 'codemirror';   // CodeMirror，必要
+import "codemirror/theme/blackboard.css"; //主题
+// import 'codemirror/addon/hint/show-hint.css';
+// import 'codemirror/addon/hint/show-hint.js'; 自动填充
+import 'codemirror/lib/codemirror.css';    // css，必要
+
+import 'codemirror/mode/javascript/javascript';  // js的语法高亮
+import 'codemirror/mode/clike/clike'; // java的语法高亮
+import 'codemirror/mode/jsx/jsx'; // jsx的语法高亮
+import 'codemirror/mode/sql/sql'; // sql的语法高亮
+import 'codemirror/mode/xml/xml'; // xml的语法高亮
+import 'codemirror/mode/htmlmixed/htmlmixed';// html的语法高亮
+import 'codemirror/mode/vue/vue';// vue的语法高亮
+
+
+
+@Component({})
+export default class AppCodeEditor extends Vue {
+
+    /**
+     * 高度
+     */
+    @Prop() height?: any;
+
+    /**
+     * 宽度
+     */
+    @Prop() width?: any;
+
+    /**
+     * 传入代码类型
+     */
+    @Prop() codetype?: any;
+
+    /**
+     * 是否禁用
+     */
+    @Prop() disabled?: boolean;
+
+    /**
+     * 双向绑定编辑器的值
+     */
+    @Prop() code: any;
+
+    /**
+     * 当前编辑器
+     */
+    public currenteditor: any;
+
+    /**
+     * 初始化编辑器
+     */
+    public mounted() {
+        this.init();
+    }
+
+    /**
+     * 初始化参数
+     */
+    public initParam() {
+        let mime;
+        let isDisabled = this.disabled === true ? true : false;
+        let theme = 'blackboard'//设置主题，不设置的会使用默认主题
+        if (!this.codetype) {
+            mime = { name: "text/x-java" };//当前代码类型
+        } else {
+            if (Object.is(this.codetype, 'javascript')) {
+                mime = { name: "text/javascript" };
+            } else if (Object.is(this.codetype, 'java')) {
+                mime = { name: "text/x-java" };
+            } else if (Object.is(this.codetype, 'css')) {
+                mime = { name: "text/x-less" };
+            } else if (Object.is(this.codetype, 'html')) {
+                mime = { name: "text/html" };
+            } else if (Object.is(this.codetype, 'vue')) {
+                mime = { name: "script/x-vue" };
+            } else if (Object.is(this.codetype, 'jsx')) {
+                mime = { name: "text/jsx" };
+            } else if (Object.is(this.codetype, 'xml')) {
+                mime = { name: "application/xml" };
+            } else if (Object.is(this.codetype, 'sql')) {
+                mime = { name: "text/x-mysql" };
+            }
+        }
+        let result = {
+            mode: mime,//选择对应代码编辑器的语言，我这边选的是数据库，根据个人情况自行设置即可
+            indentWithTabs: true,
+            indentUnit: 4,         // 缩进单位为4
+            styleActiveLine: true, // 当前行背景高亮
+            matchBrackets: true,   // 括号匹配
+            lineWrapping: true,    // 自动换行
+            lineNumbers: true,
+            cursorHeight: 0.85,//光标的高度
+            showCursorWhenSelecting: true,//是否处于活动状态时是否应绘制光标
+            theme: theme,
+            autofocus: true,
+            extraKeys: { 'Ctrl': 'autocomplete' },//自定义快捷键
+            readOnly: isDisabled
+        };
+        return result;
+    }
+
+    /**
+     * 初始化 
+     */
+    public init() {
+        let initParam = this.initParam();
+        const refs: any = this.$refs;
+        this.currenteditor = CodeMirror.fromTextArea(refs.editorcode, initParam);
+        let width = this.width ? this.width : '100%';
+        let height = this.height ? this.height : '400px';
+        this.currenteditor.setSize(width, height);
+        //代码自动提示功能，记住使用cursorActivity事件不要使用change事件，这是一个坑，那样页面直接会卡死
+        // this.currenteditor.on('cursorActivity', (editor:any) =>{
+        //     editor.showHint();
+        // });
+        this.currenteditor.on('change', (editor: any) => {
+            this.$emit('change', editor.getValue());
+        });
+    }
+
+    /**
+     * 渲染组件
+     */
+    public render() {
+        return (<div>
+            <textarea ref="editorcode" class="codecss" v-model={this.code}></textarea>
+        </div >);
+    }
+
+}
\ No newline at end of file

src/components/app-embed-picker/app-embed-picker.less

+.app-embed-picker {
+    .app-embed-value, .app-embed-placeholder {
+        line-height: 32px;
+        height: 32px;
+    }
+    .app-embed-placeholder {
+        color: #c1c1c1;
+    }
+    > .ivu-card {
+        > .ivu-card-body {
+            > .content-container {
+                margin: 0;
+            }
+        }
+    }
+}
\ No newline at end of file

src/components/app-embed-picker/app-embed-picker.tsx

+import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
+
+import './app-embed-picker.less';
+import { CreateElement } from 'vue';
+import { Subject, Subscription } from 'rxjs';
+
+@Component({})
+export default class AppEmbedPicker extends Vue {
+
+    /**
+     * 表单数据
+     *
+     * @type {*}
+     * @memberof AppPicker
+     */
+    @Prop() public data!: any;
+
+    /**
+     * 值
+     *
+     * @type {*}
+     * @memberof AppEmbedPicker
+     */
+    @Prop() public value: any;
+
+    /**
+     * 表单状态
+     *
+     * @type {Subject<any>}
+     * @memberof AppEmbedPicker
+     */
+    @Prop() public formState!: Subject<any>
+
+    /**
+     * 视图状态事件
+     *
+     * @protected
+     * @type {(Subscription | undefined)}
+     * @memberof SelectType
+     */
+    protected formStateEvent: Subscription | undefined;
+
+    /**
+     * 值项名称
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public valueItem?: string;
+
+    /**
+     * 关联视图名称
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public refviewname?: string;
+
+    /**
+     * 提示信息
+     *
+     * @type {string}
+     * @memberof AppEmbedPicker
+     */
+    @Prop() public placeholder!: string;
+
+    /**
+     * 空值文本
+     *
+     * @type {string}
+     * @memberof EmbedPicker
+     */
+    @Prop() public emptyText?: string;
+
+    /**
+     * 属性项名称
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public name!: string;
+
+    /**
+     * 关联视图参数
+     *
+     * @type {*}
+     * @memberof AppEmbedPicker
+     */
+    @Prop() public itemParam: any;
+
+    /**
+     * 是否忽略之变化
+     *
+     * @type {boolean}
+     * @memberof AppEmbedPicker
+     */
+    @Prop() public ignorefieldvaluechange!: boolean;
+
+    /**
+     * 重置项
+     *
+     * @type {string}
+     * @memberof AppEmbedPicker
+     */
+    @Prop() public refreshitems?: string;
+
+    /**
+     * 视图参数
+     *
+     * @type {string}
+     * @memberof AppEmbedPicker
+     */
+    public srfparentdata: any = '';
+
+    /**
+     * 设置视图参数
+     *
+     * @memberof AppEmbedPicker
+     */
+    public setViewParam(activeData: any) {
+        if (!this.itemParam || !activeData) {
+            return;
+        }
+        let arg: any = {};
+        if (this.itemParam.parentdata) {
+            let parentData: any = {};
+            Object.keys(this.itemParam.parentdata).every((name: string) => {
+                let value: string = this.itemParam.parentdata[name];
+                if (value.startsWith('%') && value.endsWith('%')) {
+                    const key: string = value.substring(1, value.length - 1);
+                    if (!activeData.hasOwnProperty(key)) {
+                        this.$Notice.error({ title: '错误', desc: `操作失败,未能找到当前表单项${key}，无法继续操作` });
+                        return false;
+                    }
+                    value = activeData[key];
+                }
+                Object.assign(parentData, { [name]: value });
+                return true;
+            });
+            Object.assign(arg, parentData);
+        }
+        this.srfparentdata = arg;
+    }
+
+    /**
+     * 监控值
+     *
+     * @param {*} newVal
+     * @param {*} oldVal
+     * @memberof AppFormDRUIPart
+     */
+    @Watch('data')
+    onActivedataChange(newVal: any, oldVal: any) {
+        const newFormData: any = JSON.parse(newVal);
+        const oldDormData: any = JSON.parse(oldVal);
+        this.setViewParam(newFormData);
+        if (!this.refreshitems || this.ignorefieldvaluechange) {
+            return;
+        }
+        if(Object.is(newFormData[this.refreshitems], oldDormData[this.refreshitems])) {
+            return;
+        }
+        this.setValue([{srfmajortext: null, srfkey: null}]);
+        let param = this.srfparentdata;
+        this.srfparentdata = {};
+        Object.assign(this.srfparentdata, param);
+    }
+
+    /**
+     * 生命周期
+     *
+     * @memberof AppEmbedPicker
+     */
+    public created() {
+        if(this.formState) {
+            this.formStateEvent = this.formState.subscribe(({ tag, action, data }) => {
+                if (Object.is('load', action)) {
+                    this.setViewParam(JSON.parse(this.data));
+                }
+            });
+        }
+    }
+
+    /**
+     * vue 生命周期
+     *
+     * @memberof SelectType
+     */
+    public destroyed() {
+        if (this.formStateEvent) {
+            this.formStateEvent.unsubscribe();
+        }
+    }
+
+    /**
+     * 设置值
+     *
+     * @param {*} item
+     * @memberof AppEmbedPicker
+     */
+    public setValue(item: any) {
+        if (this.name) {
+            this.$emit('formitemvaluechange', { name: this.name, value: item[0].srfmajortext });
+        }
+        if (this.valueItem) {
+            this.$emit('formitemvaluechange', { name: this.valueItem, value: item[0].srfkey });
+        }
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @param {CreateElement} h
+     * @returns
+     * @memberof AppEmbedPicker
+     */
+    public render(h: CreateElement) {
+        if (this.refviewname) {
+            return (
+                <div class="app-embed-picker">
+                    <div style={{ height: this.placeholder ? 'calc(100% - 32px)' : '100%' }}>
+                        {
+                            this.$createElement(this.refviewname, {
+                                props: {
+                                    viewdata: JSON.stringify({ srfparentdata: this.srfparentdata })
+                                },
+                                on: {
+                                    'viewdataschange': (args: any) => {
+                                        if (args && args.length > 0) {
+                                            this.setValue(args);                                         
+                                        }
+                                    }
+                                },
+                                style: {
+                                    height: '100%'
+                                }
+                            })
+                        }
+                    </div>
+                    { this.placeholder ? ( this.value ? <div class="app-embed-value">{this.value}</div> : <div class="app-embed-placeholder">{this.placeholder}</div> ) : '' }
+                </div>
+            );
+        } else {
+            return (<div>{this.emptyText}</div>);
+        }
+    }
+}
\ No newline at end of file

src/components/app-export-excel/app-export-excel.tsx

+import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
+import './app-export-excel.less';
+
+/**
+ * 数据导出组件
+ *
+ * @export
+ * @class AppExportExcel
+ * @extends {Vue}
+ */
+@Component({})
+export default class AppExportExcel extends Vue {
+
+    /**
+     * 工具栏项
+     *
+     * @type {*}
+     * @memberof AppExportExcel
+     */
+    @Prop() public item?: any;
+
+    /**
+     * 工具栏项层级
+     *
+     * @type {number}
+     * @memberof AppExportExcel
+     */
+    @Prop({ default: 0 }) public itemLevel!: number;
+
+    /**
+     * 起始页
+     *
+     * @type {(string | null)}
+     * @memberof AppExportExcel
+     */
+    public startPage: string | null = null;
+
+    /**
+     * 结束页
+     *
+     * @type {(string | null)}
+     * @memberof AppExportExcel
+     */
+    public endPage: string | null = null;
+
+    /**
+     * 是否显示下拉菜单
+     *
+     * @type {boolean}
+     * @memberof AppExportExcel
+     */
+    public visible: boolean = false;
+
+    /**
+     * 点击触发相似
+     *
+     * @memberof AppExportExcel
+     */
+    public clickVisible(): void {
+        this.visible = !this.visible
+    }
+
+    /**
+     * 导出数据
+     *
+     * @param {*} $event
+     * @param {string} type
+     * @returns {void}
+     * @memberof AppExportExcel
+     */
+    public exportExcel($event: any, type: string): void {
+        const exportparms: any = { type: type };
+        if (Object.is(type, 'maxRowCount')) {
+            Object.assign(exportparms, { maxRowCount: this.item.MaxRowCount })
+            this.visible = false;
+        } else if (Object.is(type, 'activatedPage')) {
+            this.visible = false;
+        } else if (Object.is(type, 'custom')) {
+            if (!this.startPage || !this.endPage) {
+                this.$Notice.warning({ title: '警告', desc: '请输入起始页' });
+                return;
+            }
+            const startPage: any = Number.parseInt(this.startPage, 10);
+            const endPage: any = Number.parseInt(this.endPage, 10);
+            if (Number.isNaN(startPage) || Number.isNaN(endPage)) {
+                this.$Notice.warning({ title: '警告', desc: '请输入有效的起始页' });
+                return;
+            }
+
+            if (startPage < 1 || endPage < 1 || startPage > endPage) {
+                this.$Notice.warning({ title: '警告', desc: '请输入有效的起始页' });
+                return;
+            }
+            this.startPage = null;
+            this.endPage = null;
+            Object.assign(exportparms, { startPage: startPage, endPage: endPage });
+            this.visible = false;
+        }
+        if (!this.visible) {
+            Object.assign($event, { exportparms: exportparms });
+            this.$emit('exportexcel', $event);
+        }
+    }
+
+    /**
+     * 绘制默认内容
+     *
+     * @returns
+     * @memberof AppExportExcel
+     */
+    public renderDefault() {
+        return (
+            <dropdown trigger='custom' transfer={true} visible={this.visible}>
+                <i-button disabled={this.item.disabled} on-click={() => this.clickVisible()}>
+                    <i class='fa fa-file-excel-o'></i>
+                    <span class='caption'>{this.item.caption}</span>
+                </i-button>
+
+                <dropdown-menu slot='list'>
+                    <dropdown-item>
+                        <p on-click={($event: any) => this.exportExcel($event, 'maxRowCount')}>
+                            {this.item.caption}全部(最大{this.item.caption}{this.item.MaxRowCount}行)
+                        </p>
+                    </dropdown-item>
+                    <dropdown-item>
+                        <p on-click={($event: any) => this.exportExcel($event, 'activatedPage')}>
+                            {this.item.caption}当前页
+                        </p>
+                    </dropdown-item>
+                    <dropdown-item>
+                        {this.item.caption}第&nbsp;
+                        <i-input style="width: 30px;" v-model={this.startPage}> </i-input>&nbsp;至&nbsp;
+                        <i-input style="width: 30px;" v-model={this.endPage}></i-input>&nbsp;
+                        <i-button on-click={($event: any) => this.exportExcel($event, 'custom')}>Go!</i-button>
+                    </dropdown-item>
+                </dropdown-menu>
+            </dropdown>
+        );
+    }
+
+    /**
+     * 绘制临时方案
+     *
+     * @returns
+     * @memberof AppExportExcel
+     */
+    public renderTeml() {
+        return (
+            <dropdown transfer={true} trigger='click'>
+                <i-button disabled={this.item.disabled}>
+                    <i class='fa fa-file-excel-o'></i>
+                    <span class='caption'>{this.item.caption}</span>
+                </i-button>
+
+                <dropdown-menu slot='list'>
+                    <dropdown-item>
+                        <p on-click={($event: any) => this.exportExcel($event, 'maxRowCount')}>
+                            {this.item.caption}全部(最大{this.item.caption}{this.item.MaxRowCount}行)
+                        </p>
+                    </dropdown-item>
+                    <dropdown-item>
+                        <p on-click={($event: any) => this.exportExcel($event, 'activatedPage')}>
+                            {this.item.caption}当前页
+                        </p>
+                    </dropdown-item>
+                </dropdown-menu>
+            </dropdown>
+        );
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof AppExportExcel
+     */
+    public render() {
+        if (this.itemLevel === 0) {
+            return this.renderTeml();
+        }
+    }
+} 
\ No newline at end of file

src/components/app-file-upload/app-file-upload.tsx

+import { Component, Vue, Prop, Watch } from 'vue-property-decorator';
+import './app-file-upload.less';
+import { Environment } from '@/environments/environment';
+import { CreateElement } from 'vue';
+import { Subject, Unsubscribable } from 'rxjs';
+
+@Component({})
+export default class AppFileUpload extends Vue {
+
+    /**
+     * 表单状态
+     *
+     * @type {Subject<any>}
+     * @memberof AppFileUpload
+     */
+    @Prop() public formState?: Subject<any>
+
+    /**
+     * 是否忽略表单项书香值变化
+     *
+     * @type {boolean}
+     * @memberof AppFileUpload
+     */
+    @Prop() public ignorefieldvaluechange?: boolean;
+
+    /**
+     * 表单状态事件
+     *
+     * @private
+     * @type {(Unsubscribable | undefined)}
+     * @memberof AppFileUpload
+     */
+    private formStateEvent: Unsubscribable | undefined;
+
+    /**
+     * 表单数据
+     *
+     * @type {string}
+     * @memberof AppFileUpload
+     */
+    @Prop() public data!: string;
+
+    /**
+     * 初始化值
+     *
+     * @type {*}
+     * @memberof AppFileUpload
+     */
+    @Prop() public value?: any;
+
+    /**
+     * 数据值变化
+     *
+     * @param {*} newval
+     * @param {*} val
+     * @memberof AppFileUpload
+     */
+    @Watch('value')
+    onValueChange(newval: any, val: any) {
+        if (this.ignorefieldvaluechange) {
+            return;
+        }
+        if (newval) {
+            this.files = JSON.parse(newval);
+            this.dataProcess();
+        } else {
+            this.files = [];
+        }
+    }
+
+    /**
+     * 所属表单项名称
+     *
+     * @type {string}
+     * @memberof AppFileUpload
+     */
+    @Prop() public name!: string;
+
+    /**
+     * 是否禁用
+     *
+     * @type {boolean}
+     * @memberof AppFileUpload
+     */
+    @Prop() public disabled?: boolean;
+
+    /**
+     * 上传参数
+     *
+     * @type {string}
+     * @memberof AppFileUpload
+     */
+    @Prop() public uploadparams?: string;
+
+    /**
+     * 下载参数
+     *
+     * @type {string}
+     * @memberof AppFileUpload
+     */
+    @Prop() public exportparams?: string;
+
+    /**
+     * 自定义参数
+     *
+     * @type {*}
+     * @memberof AppFileUpload
+     */
+    @Prop() public customparams?: any;
+
+    /**
+     * 上传文件路径
+     *
+     * @memberof AppFileUpload
+     */
+    public uploadUrl = Environment.BaseUrl + Environment.UploadFile;
+
+    /**
+     * 下载文件路径
+     *
+     * @memberof AppFileUpload
+     */
+    public downloadUrl = Environment.BaseUrl + Environment.ExportFile;
+
+    /**
+     * 文件列表
+     *
+     * @memberof AppFileUpload
+     */
+    public files = [];
+
+    /**
+     * 上传keys
+     *
+     * @type {Array<any>}
+     * @memberof AppFileUpload
+     */
+    public upload_keys: Array<any> = [];
+
+    /**
+     * 导出keys
+     *
+     * @type {Array<any>}
+     * @memberof AppFileUpload
+     */
+    public export_keys: Array<any> = [];
+
+    /**
+     * 自定义数组
+     *
+     * @type {Array<any>}
+     * @memberof AppFileUpload
+     */
+    public custom_arr: Array<any> = [];
+
+    /**
+     * 应用参数
+     *
+     * @type {*}
+     * @memberof AppImageUpload
+     */
+    public appData: any;
+
+    /**
+     * 数据处理
+     *
+     * @private
+     * @memberof AppFileUpload
+     */
+    private dataProcess(): void {
+        let upload_arr: Array<string> = [];
+        let export_arr: Array<string> = [];
+        const _data: any = JSON.parse(this.data);
+        this.upload_keys.forEach((key: string) => {
+            upload_arr.push(`${key}=${_data[key]}`);
+        });
+        this.export_keys.forEach((key: string) => {
+            export_arr.push(`${key}=${_data[key]}`);
+        });
+
+        let _url = `${Environment.BaseUrl}${Environment.UploadFile}`;
+        if (upload_arr.length > 0 || this.custom_arr.length > 0) {
+            _url = `${_url}?${upload_arr.join('&')}${upload_arr.length > 0 ? '&' : ''}${this.custom_arr.join('&')}`;
+        }
+        this.uploadUrl = _url;
+
+        this.files.forEach((file: any) => {
+            let url = `${this.downloadUrl}/${file.id}`;
+            if (upload_arr.length > 0 || this.custom_arr.length > 0) {
+                url = `${url}?${upload_arr.join('&')}${upload_arr.length > 0 ? '&' : ''}${this.custom_arr.join('&')}`;
+            }
+            file.url = url;
+        });
+    }
+
+    /**
+     * vue 生命周期
+     *
+     * @memberof AppFileUpload
+     */
+    public created() {
+        if (this.formState) {
+            this.formStateEvent = this.formState.subscribe(($event: any) => {
+                // 表单加载完成
+                if (Object.is($event.type, 'load')) {
+                    if (this.value) {
+                        this.files = JSON.parse(this.value);
+                    }
+                    this.dataProcess();
+                }
+            });
+        }
+    }
+
+    /**
+     * vue 生命周期
+     *
+     * @returns
+     * @memberof AppFileUpload
+     */
+    public mounted() {
+        this.appData = this.$store.getters.getAppData();
+
+        let uploadparams: string = '';
+        let exportparams: string = '';
+
+        if (this.uploadparams && !Object.is(this.uploadparams, '')) {
+            uploadparams = this.uploadparams;
+        }
+        if (this.exportparams && !Object.is(this.exportparams, '')) {
+            exportparams = this.exportparams;
+        }
+        let upload_keys: Array<string> = uploadparams.split(';');
+        let export_keys: Array<string> = exportparams.split(';');
+        let custom_arr: Array<string> = [];
+        if (this.customparams && !Object.is(this.customparams, '')) {
+            Object.keys(this.customparams).forEach((name: string) => {
+                custom_arr.push(`${name}=${this.customparams[name]}`);
+            });
+        }
+        this.upload_keys = upload_keys;
+        this.export_keys = export_keys;
+        this.custom_arr = custom_arr;
+
+        if (this.value) {
+            this.files = JSON.parse(this.value);
+        }
+        this.dataProcess();
+    }
+
+    /**
+     * 组件销毁
+     *
+     * @memberof AppFileUpload
+     */
+    public destroyed(): void {
+        if (this.formStateEvent) {
+            this.formStateEvent.unsubscribe();
+        }
+    }
+
+    /**
+     * 上传之前
+     *
+     * @param {*} file
+     * @memberof AppFileUpload
+     */
+    public beforeUpload(file: any) {
+        // console.log('上传之前');
+    }
+
+    /**
+     * 上传成功回调
+     *
+     * @param {*} response
+     * @param {*} file
+     * @param {*} fileList
+     * @memberof AppFileUpload
+     */
+    public onSuccess(response: any, file: any, fileList: any) {
+        if (!response) {
+            return;
+        }
+        const data = { name: response.name, id: response.id };
+        let arr: Array<any> = [];
+        this.files.forEach((_file:any) => {
+            arr.push({name: _file.name, id: _file.id})
+        });
+        arr.push(data);
+
+        let value: any = arr.length > 0 ? JSON.stringify(arr) : null;
+        this.$emit('formitemvaluechange', { name: this.name, value: value });
+    }
+
+    /**
+     * 上传失败回调
+     *
+     * @param {*} error
+     * @param {*} file
+     * @param {*} fileList
+     * @memberof AppFileUpload
+     */
+    public onError(error: any, file: any, fileList: any) {
+        this.$Notice.error({ title: '上传失败' });
+    }
+
+    /**
+     * 删除文件
+     *
+     * @param {*} file
+     * @param {*} fileList
+     * @memberof AppFileUpload
+     */
+    public onRemove(file: any, fileList: any) {
+        let arr: Array<any> = [];
+        fileList.forEach((f: any) => {
+            if (f.id != file.id) {
+                arr.push({ name: f.name, id: f.id });
+            }
+        });
+        let value: any = arr.length > 0 ? JSON.stringify(arr) : null;
+        this.$emit('formitemvaluechange', { name: this.name, value: value });
+    }
+
+    /**
+     * 下载文件
+     *
+     * @param {*} file
+     * @memberof AppFileUpload
+     */
+    public onDownload(file: any) {
+        window.open(file.url);
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @param {CreateElement} h
+     * @returns
+     * @memberof AppFileUpload
+     */
+    public render(h: CreateElement) {
+        return (
+            this.$createElement(
+                'el-upload',
+                {
+                    props: {
+                        disabled: this.disabled,
+                        'file-list': this.files,
+                        action: this.uploadUrl,
+                        headers: { srfappdata: this.appData },
+                        'before-upload': (file: any) => this.beforeUpload(file),
+                        'on-success': (response: any, file: any, fileList: any) => this.onSuccess(response, file, fileList),
+                        'before-remove': (file: any, fileList: any) => this.onRemove(file, fileList),
+                        'on-error': (error: any, file: any, fileList: any) => this.onError(error, file, fileList),
+                        'on-preview': (file: any) => this.onDownload(file),
+                    }
+                },
+                [
+                    this.renderElButton(),
+                ]
+            )
+        );
+    }
+
+    /**
+     * 绘制按钮提示框
+     *
+     * @returns
+     * @memberof AppFileUpload
+     */
+    public renderElButton() {
+        return (
+            <el-button size='small' icon='el-icon-upload' disabled={this.disabled}>{this.$t('app.fileUpload.caption')}</el-button>
+        );
+    }
+}
\ No newline at end of file

src/components/app-form-druipart/app-form-druipart.less

+.form-druipart {
+    position: relative;
+}
\ No newline at end of file

src/components/app-form-druipart/app-form-druipart.tsx

+import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
+import { Subject, Unsubscribable } from 'rxjs';
+import './app-form-druipart.less';
+
+@Component({})
+export default class AppFormDRUIPart extends Vue {
+
+    /**
+     * 表单数据
+     *
+     * @type {string}
+     * @memberof AppFormDRUIPart
+     */
+    @Prop() public data!: string;
+
+    /**
+     * 关联视图
+     *
+     * @type {string}
+     * @memberof AppFormDRUIPart
+     */
+    @Prop() public viewname?: string;
+
+    /**
+     * 刷新关系项
+     *
+     * @type {string}
+     * @memberof AppFormDRUIPart
+     */
+    @Prop({ default: '' }) public refreshitems!: string;
+
+    /**
+     * 关系视图类型
+     *
+     * @type {string}
+     * @memberof AppFormDRUIPart
+     */
+    @Prop() public refviewtype?: string;
+
+    /**
+     * 父数据
+     *
+     * @type {*}
+     * @memberof AppFormDRUIPart
+     */
+    @Prop() public parentdata!: any;
+
+    /**
+     * 传入参数项名称
+     *
+     * @type {string}
+     * @memberof AppFormDRUIPart
+     */
+    @Prop() public paramitem!: string;
+
+    /**
+     * 是否忽略表单项值变化
+     *
+     * @type {boolean}
+     * @memberof AppFormDRUIPart
+     */
+    @Prop() public ignorefieldvaluechange!: boolean;
+
+    /**
+     * 表单状态
+     *
+     * @type {Subject<any>}
+     * @memberof AppFormDRUIPart
+     */
+    @Prop() public formState!: Subject<any>
+
+    /**
+     * 表单状态事件
+     *
+     * @private
+     * @type {(Unsubscribable | undefined)}
+     * @memberof AppFormDRUIPart
+     */
+    private formStateEvent: Unsubscribable | undefined;
+
+    /**
+     * 监控值
+     *
+     * @param {*} newVal
+     * @param {*} oldVal
+     * @memberof AppFormDRUIPart
+     */
+    @Watch('data')
+    onActivedataChange(newVal: any, oldVal: any) {
+
+        if (this.ignorefieldvaluechange) {
+            return;
+        }
+        if (Object.is(newVal, oldVal)) {
+            return;
+        }
+        const newFormData: any = JSON.parse(newVal);
+        const oldDormData: any = JSON.parse(oldVal);
+        let refreshRefview = false;
+        this.hookItems.some((_hookItem: any) => {
+            if (!Object.is(newFormData[_hookItem], oldDormData[_hookItem])) {
+                refreshRefview = true;
+                return refreshRefview;
+            }
+            return refreshRefview;
+        });
+        if (refreshRefview) {
+            this.refreshDRUIPart();
+        }
+    }
+
+    /**
+     * 是否启用遮罩
+     *
+     * @type {boolean}
+     * @memberof AppFormDRUIPart
+     */
+    public blockUI: boolean = false;
+
+    /**
+     * 遮罩提示信息
+     *
+     * @type {string}
+     * @memberof AppFormDRUIPart
+     */
+    public blockUITipInfo: string = '请先保存主数据';
+
+    /**
+     * 是否刷新关系数据
+     *
+     * @private
+     * @type {boolean}
+     * @memberof AppFormDRUIPart
+     */
+    private isRelationalData: boolean = true;
+
+    /**
+     * 刷新节点
+     *
+     * @private
+     * @type {string[]}
+     * @memberof AppFormDRUIPart
+     */
+    private hookItems: string[] = [];
+
+    /**
+     * 父数据
+     *
+     * @type {*}
+     * @memberof AppFormDRUIPart
+     */
+    public srfparentdata: any = {};
+
+    /**
+     * 刷新关系页面
+     *
+     * @private
+     * @returns {void}
+     * @memberof AppFormDRUIPart
+     */
+    private refreshDRUIPart(): void {
+
+        if (Object.is(this.parentdata.SRFPARENTTYPE, 'CUSTOM')) {
+            this.isRelationalData = false;
+        }
+
+        const formData: any = JSON.parse(this.data);
+        const _paramitem = formData[this.paramitem];
+
+        this.srfparentdata = {};
+        Object.assign(this.srfparentdata, this.parentdata);
+        Object.assign(this.srfparentdata, { srfparentkey: _paramitem });
+        if (this.isRelationalData) {
+            if (!_paramitem || _paramitem == null || Object.is(_paramitem, '')) {
+                this.blockUIStart();
+                return;
+            } else {
+                this.blockUIStop();
+            }
+        }
+
+        // this.$forceUpdate();
+    }
+
+    /**
+     * vue  生命周期
+     *
+     * @memberof AppFormDRUIPart
+     */
+    public created(): void {
+
+        this.hookItems = [...this.refreshitems.split(';')];
+        if (!this.formState) {
+            return;
+        }
+        if (!Object.is(this.paramitem, 'srfkey')) {
+            this.hookItems.push(this.paramitem);
+        }
+        this.formStateEvent = this.formState.subscribe(($event: any) => {
+            // 表单加载完成
+            if (Object.is($event.type, 'load')) {
+                this.refreshDRUIPart();
+            }
+            // 表单保存完成
+            if (Object.is($event.type, 'save')) {
+                this.refreshDRUIPart();
+            }
+            // 表单项更新
+            if (Object.is($event.type, 'updateformitem')) {
+                if (!$event.data) {
+                    return;
+                }
+                let refreshRefview = false;
+                Object.keys($event.data).some((name: string) => {
+                    const index = this.hookItems.findIndex((_name: string) => Object.is(_name, name));
+                    refreshRefview = index !== -1 ? true : false;
+                    return refreshRefview;
+                });
+                if (refreshRefview) {
+                    this.refreshDRUIPart();
+                }
+            }
+        });
+        this.refreshDRUIPart();
+    }
+
+    /**
+     * 部件销毁
+     *
+     * @memberof AppFormDRUIPart
+     */
+    public destroyed(): void {
+        if (this.formStateEvent) {
+            this.formStateEvent.unsubscribe();
+        }
+    }
+
+    /**
+     * 开启遮罩
+     *
+     * @private
+     * @memberof AppFormDRUIPart
+     */
+    private blockUIStart(): void {
+        this.blockUI = true;
+    }
+
+    /**
+     * 关闭遮罩
+     *
+     * @private
+     * @memberof AppFormDRUIPart
+     */
+    private blockUIStop(): void {
+        this.blockUI = false;
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof AppFormDRUIPart
+     */
+    public render() {
+        return (
+            <div class='form-druipart'>
+                {
+                    (this.viewname && !Object.is(this.viewname, '')) ?
+                        this.$createElement(this.viewname, {
+                            class: {
+                                viewcontainer2: true,
+                            },
+                            props: {
+                                viewdata: JSON.stringify({ srfparentdata: this.srfparentdata })
+                            },
+                            on: {
+                                mditemsload: ($event: any) => {
+                                    console.log('多数据视图加载完成，触发后续表单项更新');
+                                },
+                                drdatasaved: ($event: any) => {
+                                    console.log('DEMEDITVIEW9 关系数据保存完成');
+                                },
+                                drdatachange: ($event: any) => {
+                                    console.log('DEMEDITVIEW9 关系数据值变化');
+                                },
+                                viewdataschange: ($event: any) => {
+                                    console.log('视图数据变化');
+                                },
+                                viewload: ($event: any) => {
+                                    console.log('视图加载完成');
+                                }
+                            },
+                            key: this.$util.createUUID(),
+                        })
+                        : ''
+                }
+                {this.blockUI ? <spin class="app-druipart-spin" fix >{this.blockUITipInfo}</spin> : ''}
+            </div>
+        );
+    }
+}
\ No newline at end of file

src/components/app-form-group/app-form-group.less

+.app-form-group {
+    >.ivu-card-head {
+        >p {
+            >i {
+                margin-right: 8px;
+                cursor: pointer;
+            }
+        }
+    }
+    >.ivu-card-extra {
+        .item-extract-mode {
+            .item {
+                margin-left: 12px;
+            }
+        }
+    }
+}
+
+.app-form-group.app-group-collapse-contant {
+    .ivu-card-body {
+        display: none;
+    }
+}
+
+.app-group-flex {
+    height: 100%;
+    overflow: auto;
+    > .ivu-card-body {
+        height: calc(100% - 51px);
+        overflow: auto;
+    }
+}
\ No newline at end of file

src/components/app-form-group/app-form-group.tsx

+import { Vue, Component, Prop } from 'vue-property-decorator';
+import './app-form-group.less';
+
+@Component({})
+export default class AppFormGroup extends Vue {
+
+    /**
+     * 标题
+     *
+     * @type {string}
+     * @memberof AppFormGroup
+     */
+    @Prop() public caption?: string;
+
+    /**
+     * 内置界面样式
+     * 
+     * @type {string}
+     * @memberof AppFormGroup
+     */
+    @Prop() public uiStyle?: string;
+
+    /**
+     * 布局模式
+     *
+     * @type {string}
+     * @memberof AppFormGroup
+     */
+    @Prop() public layoutType?: string;
+
+    /**
+     * 是否显示标题
+     *
+     * @type {boolean}
+     * @memberof AppFormGroup
+     */
+    @Prop({ default: true }) public isShowCaption!: boolean;
+
+    /**
+     * 信息面板模式
+     *
+     * @type {boolean}
+     * @memberof AppFormGroup
+     */
+    @Prop({ default: false }) public isInfoGroupMode!: boolean;
+
+    /**
+     * 界面行为组
+     *
+     * @type {*}
+     * @memberof AppFormGroup
+     */
+    @Prop() public uiActionGroup?: any;
+
+    /**
+     * 标题栏关闭模式
+     * 0: 不支持关闭
+     * 1: 默认打开
+     * 2： 默认关闭
+     *
+     * @type {(number | 0 | 1 | 2)} 
+     * @memberof AppFormGroup
+     */
+    @Prop({ default: 0 }) public titleBarCloseMode!: number | 0 | 1 | 2;
+
+    /**
+     * 收缩内容
+     *
+     * @type {boolean}
+     * @memberof AppFormGroup
+     */
+    public collapseContant: boolean = false;
+
+    /**
+     * 计算样式
+     *
+     * @readonly
+     * @type {string[]}
+     * @memberof AppFormGroup
+     */
+    get classes(): string[] {
+        return [
+            'app-form-group',
+            this.isShowCaption && this.collapseContant ? 'app-group-collapse-contant' : '',
+            this.isInfoGroupMode ? 'app-info-group-mode' : '',
+            Object.is(this.layoutType, 'FLEX') ? 'app-group-flex' : '',
+            this.isShowCaption ? '' : 'app-group-hiddden-caption',
+        ];
+    }
+
+    /**
+     * vue 生命周期
+     *
+     * @memberof AppFormGroup
+     */
+    public created() {
+        this.collapseContant = this.titleBarCloseMode === 2 ? true : false;
+    }
+
+    /**
+     * 触发收缩
+     *
+     * @memberof AppFormGroup
+     */
+    public clickCollapse(): void {
+        this.collapseContant = !this.collapseContant;
+    }
+
+    /**
+     * 执行界面行
+     *
+     * @param {*} $event
+     * @memberof AppFormGroup
+     */
+    public doUIAction($event: any, item: any): void {
+        this.$emit('groupuiactionclick', { event: $event, item: item });
+    }
+
+    /**
+     * 绘制界面行为项
+     *
+     * @param {*} item
+     * @returns
+     * @memberof AppFormGroup
+     */
+    public renderActionItem(item: any) {
+        return (
+            <span class='item' on-click={($event: any) => this.doUIAction($event, item)}>
+                {
+                    item.icon && !Object.is(item.icon, '') ?
+                        <i class={item.icon} ></i> :
+                        item.img && !Object.is(item.img, '') ?
+                            <img src={item.img} /> :
+                            ''
+                }
+                &nbsp;
+                <span>
+                    {
+                        this.uiActionGroup.langbase && !Object.is(this.uiActionGroup.langbase, '')
+                            && item.uiactiontag && !Object.is(item.uiactiontag, '') ?
+                            this.$t(`${this.uiActionGroup.langbase}.uiactions.${item.uiactiontag}`)
+                            : item.caption
+                    }
+                </span>
+            </span>
+        );
+    }
+
+    /**
+     * 绘制逐项展开
+     *
+     * @returns
+     * @memberof AppFormGroup
+     */
+    public renderItemExtractMode() {
+        return (
+            <span class='item-extract-mode'>
+                {
+                    this.uiActionGroup.details && Array.isArray(this.uiActionGroup.details) ?
+                        this.uiActionGroup.details.map((detail: any) => {
+                            return this.renderActionItem(detail);
+                        })
+                        :
+                        ''
+                }
+            </span>
+        );
+    }
+
+    /**
+     * 绘制分组展开项
+     *
+     * @returns
+     * @memberof AppFormGroup
+     */
+    public renderItemsExtractMode() {
+        return (
+            <dropdown transfer={true} trigger='click'>
+                <a href='javascript:void(0)'>
+                    {this.uiActionGroup.caption}
+                </a>
+                {
+                    this.uiActionGroup.details && Array.isArray(this.uiActionGroup.details) ?
+                        <dropdown-menu slot='list'>
+                            {
+                                this.uiActionGroup.details.map((detail: any) => {
+                                    return (
+                                        <dropdown-item name={detail.name}>{this.renderActionItem(detail)}</dropdown-item>
+                                    );
+                                })
+                            }
+                        </dropdown-menu>
+                        : ''
+                }
+            </dropdown>
+        );
+    }
+
+    /**
+     * 绘制界面行为组
+     *
+     * @returns
+     * @memberof AppFormGroup
+     */
+    public renderUIActionGroup() {
+        return (
+            <a slot='extra'>
+                {
+                    this.uiActionGroup.extractMode && Object.is(this.uiActionGroup.extractMode, 'ITEMS') ?
+                        this.renderItemsExtractMode() :
+                        this.renderItemExtractMode()
+                }
+            </a >
+        );
+    }
+
+    /**
+     * 绘制标题收缩模式 
+     *
+     * @returns
+     * @memberof AppFormGroup
+     */
+    public renderTitleBarCloseMode() {
+        return (
+            this.titleBarCloseMode !== 0 ?
+                <icon
+                    type={this.collapseContant ? 'ios-arrow-dropright-circle' : 'ios-arrow-dropdown-circle'}
+                    on-click={() => this.clickCollapse()}>
+                </icon>
+                : ''
+        );
+    }
+
+    /**
+     * 内容绘制
+     *
+     * @memberof AppFormGroup
+     */
+    public render() {
+        if (Object.is(this.uiStyle, 'STYLE2')) {
+            return (
+                <app-form-group2
+                    caption={this.caption}
+                    uiStyle={this.uiStyle}
+                    layoutType={this.layoutType}
+                    isShowCaption={this.isShowCaption}
+                    uiActionGroup={this.uiActionGroup}
+                    titleBarCloseMode={this.titleBarCloseMode}>
+                    {this.$slots.default}
+                </app-form-group2>
+            );
+        } else {
+            return (
+                this.isShowCaption ?
+                    <card bordered={false} dis-hover={true} class={this.classes}>
+                        <p class='' slot='title'>
+                            {this.renderTitleBarCloseMode()}
+                            {this.caption}
+                        </p>
+                        {this.uiActionGroup ? this.renderUIActionGroup() : ''}
+                        {Object.is(this.layoutType, 'FLEX') ? this.$slots.default : <row gutter={10}> {this.$slots.default} </row>}
+                    </card> :
+                    <row class={this.classes}>
+                        {this.$slots.default}
+                    </row>
+            );
+        }
+    }
+}
\ No newline at end of file

src/components/app-form-group2/app-form-group2.tsx

+import { Vue, Component, Prop, } from 'vue-property-decorator';
+import './app-form-group2.less';
+
+@Component({})
+export default class AppFormGroup2 extends Vue {
+
+    /**
+     * 标题
+     *
+     * @type {string}
+     * @memberof AppFormGroup2
+     */
+    @Prop() public caption?: string;
+
+    /**
+     * 内置界面样式
+     * 
+     * @type {string}
+     * @memberof AppFormGroup2
+     */
+    @Prop() public uiStyle?: string;
+
+    /**
+     * 布局模式
+     *
+     * @type {string}
+     * @memberof AppFormGroup
+     */
+    @Prop() public layoutType?: string;
+
+    /**
+     * 是否显示标题
+     *
+     * @type {boolean}
+     * @memberof AppFormGroup2
+     */
+    @Prop({ default: true }) public isShowCaption!: boolean;
+
+    /**
+     * 界面行为组
+     *
+     * @type {*}
+     * @memberof AppFormGroup2
+     */
+    @Prop() public uiActionGroup?: any;
+
+    /**
+     * 标题栏关闭模式
+     * 0: 不支持关闭
+     * 1: 默认打开
+     * 2： 默认关闭
+     *
+     * @type {(number | 0 | 1 | 2)} 
+     * @memberof AppFormGroup2
+     */
+    @Prop({ default: 0 }) public titleBarCloseMode!: number | 0 | 1 | 2;
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof AppFormGroup2
+     */
+    public render() {
+        return (
+            <span>未实现</span>
+        );
+    }
+}
\ No newline at end of file

src/components/app-form-item/app-form-item.less

+.app-form-item {
+    // margin-bottom: 16px;
+    >.ivu-form-item-label {
+        text-decoration: none;
+        display: block;
+        overflow: hidden;
+        white-space: nowrap;
+    }
+    >.ivu-form-item-content {
+        min-height: 36px;
+    }
+}
+.app-form-item-label-top {
+    >.ivu-form-item-label {
+        float: none;
+        display: inline-block;
+        padding: 0 0 10px;
+    }
+}
\ No newline at end of file

src/components/app-form-item/app-form-item.tsx

+import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
+import './app-form-item.less';
+
+@Component({})
+export default class AppFormItem extends Vue {
+
+    /**
+     * 名称
+     *
+     * @type {string}
+     * @memberof AppFormItem
+     */
+    @Prop() public caption!: string;
+
+    /**
+     * 错误信息
+     *
+     * @type {string}
+     * @memberof AppFormItem
+     */
+    @Prop() public error?: string;
+
+    /**
+     * 标签位置
+     *
+     * @type {(string | 'BOTTOM' | 'LEFT' | 'NONE' | 'RIGHT' | 'TOP')}
+     * @memberof AppFormItem
+     */
+    @Prop() public labelPos?: string | 'BOTTOM' | 'LEFT' | 'NONE' | 'RIGHT' | 'TOP';
+
+    /**
+     * 标签宽度
+     *
+     * @type {number}
+     * @memberof AppFormItem
+     */
+    @Prop({}) public labelWidth!: number;
+
+    /**
+     * 是否显示标题
+     *
+     * @type {boolean}
+     * @memberof AppFormItem
+     */
+    @Prop() public isShowCaption?: boolean;
+
+    /**
+     * 标签是否空白
+     *
+     * @type {boolean}
+     * @memberof AppFormItem
+     */
+    @Prop() public isEmptyCaption?: boolean;
+
+    /**
+     * 表单项名称
+     *
+     * @type {string}
+     * @memberof AppFormItem
+     */
+    @Prop() public name!: string;
+
+    /**
+     * 内置样式
+     *
+     * @type {string}
+     * @memberof AppFormItem
+     */
+    @Prop() public uiStyle?: string;
+
+    /**
+     * 表单项值规则
+     *
+     * @type {string}
+     * @memberof AppFormItem
+     */
+    @Prop() public itemRules!: string;
+
+    /**
+     * 值规则数组
+     *
+     * @type {any[]}
+     * @memberof AppFormItem
+     */
+    public rules: any[] = [];
+
+    /**
+     * 是否必填
+     *
+     * @type {boolean}
+     * @memberof AppFormItem
+     */
+    public required: boolean = false;
+
+    /**
+     * 表单项值规则监控
+     *
+     * @param {*} newVal
+     * @param {*} oldVal
+     * @memberof AppFormItem
+     */
+    @Watch('itemRules')
+    onItemRulesChange(newVal: any, oldVal: any) {
+        if (newVal) {
+            try {
+                this.rules = [];
+                const _rules: any[] = JSON.parse(newVal);
+                this.rules = [..._rules];
+                this.rules.some((rule: any) => {
+                    if (rule.hasOwnProperty('required')) {
+                        this.required = rule.required;
+                        return true;
+                    }
+                    return false;
+                });
+            } catch (error) {
+            }
+        }
+    }
+
+    /**
+     * 计算样式
+     *
+     * @readonly
+     * @type {string []}
+     * @memberof AppFormItem
+     */
+    get classes(): string[] {
+        return [
+            'app-form-item',
+            Object.is(this.labelPos, 'TOP') ? 'app-form-item-label-top' : ''
+        ];
+    }
+
+    /**
+     * vue 生命周期
+     *
+     * @memberof AppFormItem
+     */
+    public mounted() {
+        if (this.itemRules) {
+            try {
+                const _rules: any[] = JSON.parse(this.itemRules);
+                this.rules = [..._rules];
+                this.rules.some((rule: any) => {
+                    if (rule.hasOwnProperty('required')) {
+                        this.required = rule.required;
+                        return true;
+                    }
+                    return false;
+                });
+            } catch (error) {
+            }
+        }
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof AppFormItem
+     */
+    public render() {
+        if (Object.is(this.uiStyle, 'STYLE2')) {
+            return (
+                <app-form-item2
+                    caption={this.caption}
+                    error={this.error}
+                    labelPos={this.labelPos}
+                    labelWidth={this.labelWidth}
+                    isShowCaption={this.isShowCaption}
+                    isEmptyCaption={this.isEmptyCaption}
+                    name={this.name}
+                    uiStyle={this.uiStyle}
+                    itemRules={this.itemRules}>
+                    {this.$slots.default}
+                </app-form-item2>
+            );
+        } else {
+            return (
+                <form-item
+                    prop={this.name}
+                    error={this.error}
+                    required={this.required}
+                    rules={this.rules}
+                    class={this.classes}
+                    label-width={this.isShowCaption ? !Object.is(this.labelPos, 'TOP') ? this.labelWidth : null : 0}>
+                    {
+                        this.isShowCaption && this.labelWidth > 0 ?
+                            <span slot='label'>
+                                {this.isEmptyCaption ? '' : this.caption}
+                            </span>
+                            : ''
+                    }
+                    {this.$slots.default}
+                </form-item>
+            );
+        }
+    }
+}
\ No newline at end of file

src/components/app-form-item2/app-form-item2.less

+.app-form-item2 {
+    margin-bottom: 12px;
+    >.ivu-form-item-label {
+        text-decoration: none;
+        display: block;
+        overflow: hidden;
+        white-space: nowrap;
+    }
+    >.ivu-form-item-content {
+        min-height: 36px;
+        display: flex;
+        .app-editor-contant {
+            flex-grow: 1;
+        }
+        .app-error-tip {
+            width: 20px;
+        }
+    }
+    .ivu-form-item-error-tip {
+        display: none;
+    }
+}
+.app-form-item-label-top {
+    >.ivu-form-item-label {
+        float: none;
+        display: inline-block;
+        padding: 0 0 10px;
+    }
+}
\ No newline at end of file

src/components/app-form-item2/app-form-item2.tsx

+import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
+import './app-form-item2.less';
+
+@Component({})
+export default class AppFormItem2 extends Vue {
+
+    /**
+     * 名称
+     *
+     * @type {string}
+     * @memberof AppFormItem2
+     */
+    @Prop() public caption!: string;
+
+    /**
+     * 错误信息
+     *
+     * @type {string}
+     * @memberof AppFormItem2
+     */
+    @Prop() public error?: string;
+
+    /**
+     * 标签位置
+     *
+     * @type {(string | 'BOTTOM' | 'LEFT' | 'NONE' | 'RIGHT' | 'TOP')}
+     * @memberof AppFormItem2
+     */
+    @Prop() public labelPos?: string | 'BOTTOM' | 'LEFT' | 'NONE' | 'RIGHT' | 'TOP';
+
+    /**
+     * 标签宽度
+     *
+     * @type {number}
+     * @memberof AppFormItem2
+     */
+    @Prop({}) public labelWidth!: number;
+
+    /**
+     * 是否显示标题
+     *
+     * @type {boolean}
+     * @memberof AppFormItem2
+     */
+    @Prop() public isShowCaption?: boolean;
+
+    /**
+     * 标签是否空白
+     *
+     * @type {boolean}
+     * @memberof AppFormItem2
+     */
+    @Prop() public isEmptyCaption?: boolean;
+
+    /**
+     * 表单项名称
+     *
+     * @type {string}
+     * @memberof AppFormItem2
+     */
+    @Prop() public name!: string;
+
+    /**
+     * 内置样式
+     *
+     * @type {string}
+     * @memberof AppFormItem2
+     */
+    @Prop() public uiStyle?: string;
+
+    /**
+     * 表单项值规则
+     *
+     * @type {string}
+     * @memberof AppFormItem2
+     */
+    @Prop() public itemRules!: string;
+
+    /**
+     * 值规则数组
+     *
+     * @type {any[]}
+     * @memberof AppFormItem2
+     */
+    public rules: any[] = [];
+
+    /**
+     * 是否必填
+     *
+     * @type {boolean}
+     * @memberof AppFormItem2
+     */
+    public required: boolean = false;
+
+    /**
+     * 表单项值规则监控
+     *
+     * @param {*} newVal
+     * @param {*} oldVal
+     * @memberof AppFormItem2
+     */
+    @Watch('itemRules')
+    onItemRulesChange(newVal: any, oldVal: any) {
+        if (newVal) {
+            try {
+                this.rules = [];
+                const _rules: any[] = JSON.parse(newVal);
+                this.rules = [..._rules];
+                this.rules.some((rule: any) => {
+                    if (rule.hasOwnProperty('required')) {
+                        this.required = rule.required;
+                        return true;
+                    }
+                    return false;
+                });
+            } catch (error) {
+            }
+        }
+    }
+
+    /**
+     * 计算样式
+     *
+     * @readonly
+     * @type {string[]}
+     * @memberof AppFormItem2
+     */
+    get classes(): string[] {
+        return [
+            'app-form-item2',
+            Object.is(this.labelPos, 'TOP') ? 'app-form-item-label-top' : ''
+        ];
+    }
+
+    /**
+     * vue 生命周期
+     *
+     * @memberof AppFormItem2
+     */
+    public mounted() {
+        if (this.itemRules) {
+            try {
+                const _rules: any[] = JSON.parse(this.itemRules);
+                this.rules = [..._rules];
+                this.rules.some((rule: any) => {
+                    if (rule.hasOwnProperty('required')) {
+                        this.required = rule.required;
+                        return true;
+                    }
+                    return false;
+                });
+            } catch (error) {
+            }
+        }
+    }
+
+    /**
+     * 绘制提示框
+     *
+     * @returns
+     * @memberof AppFormItem2
+     */
+    public renderErrorTip() {
+        const _formitem: any = this.$refs[this.name];
+        return (
+            _formitem && _formitem.validateState && Object.is(_formitem.validateState, 'error') ?
+                <div class='app-error-tip'>
+                    <poptip trigger='hover' placement='left' width={300} word-wrap={true} transfer={true}>
+                        <icon type='ios-information-circle-outline' color='#ed4014' size={20}></icon>
+                        <div slot='content' class='app-form-item-error-info'>
+                            <div class='icon'>
+                                <icon type='ios-information-circle-outline' color='#ed4014' size={20}></icon>
+                            </div>
+                            <div class='contant'>
+                                {_formitem.validateMessage}
+                            </div>
+                        </div>
+                    </poptip>
+                </div>
+                : ''
+        );
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof AppFormItem2
+     */
+    public render() {
+        return (
+            <form-item
+                prop={this.name}
+                error={this.error}
+                required={this.required}
+                rules={this.rules}
+                class={this.classes}
+                label-width={this.isShowCaption ? !Object.is(this.labelPos, 'TOP') ? this.labelWidth : null : 0}
+                ref={this.name}>
+                {
+                    this.isShowCaption && this.labelWidth > 0 ?
+                        <span slot='label'>
+                            {this.isEmptyCaption ? '' : this.caption}
+                        </span>
+                        : ''
+                }
+                <div class='app-editor-contant'>
+                    {this.$slots.default}
+                </div>
+                {this.renderErrorTip()}
+            </form-item>
+        )
+    }
+}
\ No newline at end of file

src/components/app-form/app-form.less

+.form-detail-show {
+    display: block;
+}
+.form-detail-hidden {
+    display: none;
+}
+.app-form {
+    height: 100%;
+    > .ivu-row {
+        height: 100%;
+        > .ivu-tabs {
+            height: 100%;
+            > .ivu-tabs-content {
+                height: calc(100% - 50px);
+                overflow: auto;
+                > .ivu-tabs-tabpane {
+                    height: 100%;
+                    overflow: auto;
+                }
+            }
+        }
+        > .el-tabs {
+            height: 100%;
+            > .el-tabs__content {
+                height: calc(100% - 51px);
+                > .el-tab-pane {
+                    height: 100%;
+                    overflow: auto;
+                }
+            }
+            .el-tabs__header {
+                .el-tabs__nav-wrap::after {
+                    background-color: var(--app-border-content);
+                    height: 1px;
+                }
+                .el-tabs__item {
+                    height: 36px;
+                }
+            }
+        }
+    }
+}
\ No newline at end of file

src/components/app-form/app-form.tsx

+import { Component, Vue, Prop } from 'vue-property-decorator';
+import './app-form.less';
+
+@Component({})
+export default class AppForm extends Vue {
+
+    /**
+     * 表单数据对象
+     *
+     * @type {*}
+     * @memberof Form
+     */
+    @Prop() public form?: any;
+
+    /**
+     * 表单名称
+     *
+     * @type {string}
+     * @memberof Form
+     */
+    @Prop() public name?: string;
+
+    /**
+     * 内容绘制
+     *
+     * @returns
+     * @memberof Form
+     */
+    public render() {
+        return (
+            <i-form form={this.form}>
+                <row >
+                    {this.$slots.default}
+                </row>
+            </i-form>
+        );
+    }
+}
\ No newline at end of file

src/components/app-image-upload/app-image-upload.less

+/***    BEGIN:图片上传     ***/
+.app-picture-upload {
+    >div{
+        display: inline;
+    }
+    .el-upload-disabled {
+        .el-upload {
+            cursor: not-allowed;
+        }
+    }
+    .el-image {
+        .image-slot {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            width: 100%;
+            height: 100%;
+            background: #f5f7fa;
+            color: #909399;
+            font-size: 30px;
+        }
+    }
+} 
+
+.app-image-upload-model {
+    .el-image {
+        width: 100%;
+        height: 100%;
+        .image-slot {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            width: 100%;
+            height: 300px;
+            background: #f5f7fa;
+            color: #909399;
+            font-size: 30px;
+        }
+    }
+}
+/***    END:图片上传    ***/
\ No newline at end of file

src/components/app-image-upload/app-image-upload.tsx

+import { Vue, Component, Prop, Watch, Provide } from 'vue-property-decorator';
+import './app-image-upload.less';
+import { Environment } from '@/environments/environment';
+import { Subject, Unsubscribable } from 'rxjs';
+
+@Component({})
+export default class AppImageUpload extends Vue {
+
+    /**
+     * 表单状态
+     *
+     * @type {Subject<any>}
+     * @memberof AppImageUpload
+     */
+    @Prop() public formState?: Subject<any>
+
+    /**
+     * 是否忽略表单项书香值变化
+     *
+     * @type {boolean}
+     * @memberof AppImageUpload
+     */
+    @Prop() public ignorefieldvaluechange?: boolean;
+
+    /**
+     * 表单状态事件
+     *
+     * @private
+     * @type {(Unsubscribable | undefined)}
+     * @memberof AppImageUpload
+     */
+    private formStateEvent: Unsubscribable | undefined;
+
+    /**
+     * 表单数据
+     *
+     * @type {string}
+     * @memberof AppImageUpload
+     */
+    @Prop() public data!: string;
+
+    /**
+     * 初始化值
+     *
+     * @type {*}
+     * @memberof AppImageUpload
+     */
+    @Prop() public value?: any;
+
+    /**
+     * 数据值变化
+     *
+     * @param {*} newval
+     * @param {*} val
+     * @returns
+     * @memberof AppImageUpload
+     */
+    @Watch('value')
+    onValueChange(newval: any, val: any) {
+        if (this.ignorefieldvaluechange) {
+            return;
+        }
+        if (newval) {
+            this.files = JSON.parse(newval);
+            this.dataProcess();
+        } else {
+            this.files = [];
+        }
+    }
+
+    /**
+     * 所属表单项名称
+     *
+     * @type {string}
+     * @memberof AppImageUpload
+     */
+    @Prop() public name!: string;
+
+    /**
+     * 是否禁用
+     *
+     * @type {boolean}
+     * @memberof AppImageUpload
+     */
+    @Prop() public disabled?: boolean;
+
+    /**
+     * 上传参数
+     *
+     * @type {string}
+     * @memberof AppImageUpload
+     */
+    @Prop() public uploadparams?: string;
+
+    /**
+     * 下载参数
+     *
+     * @type {string}
+     * @memberof AppImageUpload
+     */
+    @Prop() public exportparams?: string;
+
+    /**
+     * 自定义参数
+     *
+     * @type {*}
+     * @memberof AppImageUpload
+     */
+    @Prop() public customparams?: any;
+
+    /**
+     * 上传文件路径
+     *
+     * @memberof AppImageUpload
+     */
+    public uploadUrl = Environment.BaseUrl + Environment.UploadFile;
+
+    /**
+     * 下载文件路径
+     *
+     * @memberof AppImageUpload
+     */
+    public downloadUrl = Environment.BaseUrl + Environment.ExportFile;
+
+    /**
+     * 文件列表
+     *
+     * @memberof AppImageUpload
+     */
+    @Provide() public files = [];
+
+    /**
+     * 上传keys
+     *
+     * @type {Array<any>}
+     * @memberof AppImageUpload
+     */
+    public upload_keys: Array<any> = [];
+
+    /**
+     * 导出keys
+     *
+     * @type {Array<any>}
+     * @memberof AppImageUpload
+     */
+    public export_keys: Array<any> = [];
+
+    /**
+     * 自定义数组
+     *
+     * @type {Array<any>}
+     * @memberof AppImageUpload
+     */
+    public custom_arr: Array<any> = [];
+
+    /**
+     * 应用参数
+     *
+     * @type {*}
+     * @memberof AppImageUpload
+     */
+    public appData: any;
+
+    /**
+     * 数据处理
+     *
+     * @private
+     * @memberof AppImageUpload
+     */
+    private dataProcess(): void {
+        let upload_arr: Array<string> = [];
+        let export_arr: Array<string> = [];
+        const _data: any = JSON.parse(this.data);
+        this.upload_keys.forEach((key: string) => {
+            upload_arr.push(`${key}=${_data[key]}`);
+        });
+        this.export_keys.forEach((key: string) => {
+            export_arr.push(`${key}=${_data[key]}`);
+        });
+
+        let _url = `${Environment.BaseUrl}${Environment.UploadFile}`;
+        if (upload_arr.length > 0 || this.custom_arr.length > 0) {
+            _url = `${_url}?${upload_arr.join('&')}${upload_arr.length > 0 ? '&' : ''}${this.custom_arr.join('&')}`;
+        }
+        this.uploadUrl = _url;
+
+        this.files.forEach((file: any) => {
+            let url = `${this.downloadUrl}/${file.id}`;
+            if (upload_arr.length > 0 || this.custom_arr.length > 0) {
+                url = `${url}?${upload_arr.join('&')}${upload_arr.length > 0 ? '&' : ''}${this.custom_arr.join('&')}`;
+            }
+            file.url = url;
+        });
+    }
+
+    /**
+     * vue 生命周期
+     *
+     * @memberof AppImageUpload
+     */
+    public created() {
+        if (this.formState) {
+            this.formStateEvent = this.formState.subscribe(($event: any) => {
+                // 表单加载完成
+                if (Object.is($event.type, 'load')) {
+                    if (this.value) {
+                        // console.log(this.value);
+                        this.files = JSON.parse(this.value);
+                    }
+                    this.dataProcess();
+                }
+            });
+        }
+    }
+
+    /**
+     * vue 生命周期
+     *
+     * @memberof AppImageUpload
+     */
+    public mounted() {
+        this.appData = this.$store.getters.getAppData();
+
+        let uploadparams: string = '';
+        let exportparams: string = '';
+
+        if (this.uploadparams && !Object.is(this.uploadparams, '')) {
+            uploadparams = this.uploadparams;
+        }
+        if (this.exportparams && !Object.is(this.exportparams, '')) {
+            exportparams = this.exportparams;
+        }
+        let upload_keys: Array<string> = uploadparams.split(';');
+        let export_keys: Array<string> = exportparams.split(';');
+        let custom_arr: Array<string> = [];
+        if (this.customparams && !Object.is(this.customparams, '')) {
+            Object.keys(this.customparams).forEach((name: string) => {
+                custom_arr.push(`${name}=${this.customparams[name]}`);
+            });
+        }
+        this.upload_keys = upload_keys;
+        this.export_keys = export_keys;
+        this.custom_arr = custom_arr;
+
+        if (this.value) {
+            this.files = JSON.parse(this.value);
+        }
+        this.dataProcess();
+    }
+
+    /**
+     * 组件销毁
+     *
+     * @memberof AppImageUpload
+     */
+    public destroyed(): void {
+        if (this.formStateEvent) {
+            this.formStateEvent.unsubscribe();
+        }
+    }
+
+    /**
+     * 上传之前
+     *
+     * @param {*} file
+     * @memberof AppImageUpload
+     */
+    public beforeUpload(file: any) {
+        // console.log('上传之前');
+    }
+
+    /**
+     * 上传成功回调
+     *
+     * @param {*} response
+     * @param {*} file
+     * @param {*} fileList
+     * @returns
+     * @memberof AppImageUpload
+     */
+    public onSuccess(response: any, file: any, fileList: any) {
+        if (!response) {
+            return;
+        }
+        const data = { name: response.name, id: response.id };
+        let arr: Array<any> = [];
+        this.files.forEach((_file: any) => {
+            arr.push({ name: _file.name, id: _file.id })
+        });
+        arr.push(data);
+
+        let value: any = arr.length > 0 ? JSON.stringify(arr) : null;
+        this.$emit('formitemvaluechange', { name: this.name, value: value });
+    }
+
+    /**
+     * 上传失败回调
+     *
+     * @param {*} error
+     * @param {*} file
+     * @param {*} fileList
+     * @memberof AppImageUpload
+     */
+    public onError(error: any, file: any, fileList: any) {
+        this.$Notice.error({ title: '上传失败' });
+    }
+
+    /**
+     * 删除文件
+     *
+     * @param {*} file
+     * @param {*} fileList
+     * @memberof AppImageUpload
+     */
+    public onRemove(file: any, fileList: any) {
+        let arr: Array<any> = [];
+        fileList.forEach((f: any) => {
+            if (f.id != file.id) {
+                arr.push({ name: f.name, id: f.id });
+            }
+        });
+        let value: any = arr.length > 0 ? JSON.stringify(arr) : null;
+        this.$emit('formitemvaluechange', { name: this.name, value: value });
+    }
+
+    /**
+     * 下载文件
+     *
+     * @param {*} file
+     * @memberof AppImageUpload
+     */
+    public onDownload(file: any) {
+        window.open(file.url);
+    }
+
+    /**
+     * 预览图片地址
+     *
+     * @type {string}
+     * @memberof AppImageUpload
+     */
+    public dialogImageUrl: string = '';
+
+    /**
+     * 是否显示预览界面
+     *
+     * @type {boolean}
+     * @memberof AppImageUpload
+     */
+    public dialogVisible: boolean = false;
+
+    /**
+     * 是否支持多个上传
+     *
+     * @type {boolean}
+     * @memberof AppImageUpload
+     */
+    @Prop({ default: true }) public multiple?: boolean;
+
+    /**
+     * 预览
+     *
+     * @param {*} file
+     * @memberof AppImageUpload
+     */
+    public onPreview(file: any) {
+        this.dialogImageUrl = file.url;
+        this.dialogVisible = true;
+    }
+
+    /**
+     * 渲染组件
+     *
+     * @returns
+     * @memberof AppImageUpload
+     */
+    public render() {
+        return (
+            <div class='app-picture-upload'>
+                <ul class='el-upload-list el-upload-list--picture-card'>
+                    {
+                        this.files.map((file: any, index: any) => {
+                            return this.renderThumbnail(file, index);
+                        })
+                    }
+                </ul>
+                {
+                    this.renderELUpload()
+                }
+                {this.renderDialog()}
+            </div>
+        );
+    }
+
+    /**
+     * 绘制文件上传
+     *
+     * @returns
+     * @memberof AppImageUpload
+     */
+    public renderELUpload() {
+        return (
+            this.$createElement(
+                'el-upload',
+                {
+                    style: {
+                        display: this.multiple || this.files.length === 0 ? 'inline' : 'none',
+                    },
+                    'class': {
+                        'el-upload-disabled': this.disabled,
+                    },
+                    props: {
+                        disabled: this.disabled,
+                        action: this.uploadUrl,
+                        headers: { srfappdata: this.appData },
+                        'show-file-list': false,
+                        'list-type': 'picture-card',
+                        'file-list': this.files,
+                        'before-upload': (file: any) => this.beforeUpload(file),
+                        'on-success': (response: any, file: any, fileList: any) => this.onSuccess(response, file, fileList),
+                        'before-remove': (file: any, fileList: any) => this.onRemove(file, fileList),
+                        'on-error': (error: any, file: any, fileList: any) => this.onError(error, file, fileList),
+                        'on-preview': (file: any) => this.onDownload(file),
+                    },
+                },
+                [
+                    this.renderIcon(),
+                ]
+            )
+        );
+    }
+
+    /**
+     * 绘制略缩图
+     *
+     * @param {*} file
+     * @param {number} index
+     * @returns
+     * @memberof AppImageUpload
+     */
+    public renderThumbnail(file: any, index: number) {
+        return (
+            <li key={index} class='el-upload-list__item is-success'>
+                <el-image src={file.url} class='el-upload-list__item-thumbnail' style='min-height:100px;min-width:100px;'>
+                    <div slot='error' class='image-slot'>
+                        <i class='el-icon-picture-outline'></i>
+                    </div>
+                </el-image>
+                <a class='el-upload-list__item-name'>
+                    <i class='el-icon-document'></i> {file.name}
+                </a>
+                <i class='el-icon-close'></i>
+                <label class='el-upload-list__item-status-label'>
+                    <i class='el-icon-upload-success el-icon-check'></i>
+                </label>
+                <span class='el-upload-list__item-actions'>
+                    <span class='el-upload-list__item-preview'>
+                        <i class='el-icon-zoom-in' on-click={() => this.onPreview(file)}></i>
+                    </span>
+                    <span class='el-upload-list__item-download'>
+                        <i class='el-icon-download' on-click={() => this.onDownload(file)}></i>
+                    </span>
+                    <span style={{ 'display': this.disabled === true ? 'none' : 'inline-block' }} class='el-upload-list__item-delete'>
+                        <i class='el-icon-delete' on-click={() => this.onRemove(file, this.files)}></i>
+                    </span>
+                </span>
+            </li>
+        );
+    }
+
+    /**
+     * 绘制图标
+     *
+     * @returns
+     * @memberof AppImageUpload
+     */
+    public renderIcon() {
+        return (
+            <i class='el-icon-plus'></i>
+        );
+    }
+
+    /**
+     * 绘制预览内容
+     *
+     * @returns
+     * @memberof AppImageUpload
+     */
+    public renderDialog() {
+        return (
+            <modal v-model={this.dialogVisible} footer-hide class-name='app-image-upload-model'>
+                <el-image src={this.dialogImageUrl}>
+                    <div slot='error' class='image-slot'>
+                        <i class='el-icon-picture-outline'></i>
+                    </div>
+                </el-image>
+            </modal>
+        );
+    }
+
+}
\ No newline at end of file

src/components/app-keep-alive/app-keep-alive.vue

+<script>
+export default {
+    name: 'app-keep-alive',
+    render: function render() {
+        let _this = this;
+        let slot = _this.$slots.default;
+        let vnode = _this.getFirstComponentChild(slot);
+        let componentOptions = vnode && vnode.componentOptions;
+        if (componentOptions) {
+            // check pattern
+            let name = _this.getComponentName(componentOptions);
+            let ref = _this;
+            let include = ref.include;
+            let exclude = ref.exclude;
+            let routerList = ref.routerList;
+            let route = ref.$route;
+            if (
+                // not included
+                (include && (!name || !_this.matches(include, name))) ||
+                // excluded
+                (exclude && name && _this.matches(exclude, name)) ||
+                (routerList && (!route.fullPath && !_this.matches(routerList, route.fullPath)))
+            ) {
+                return vnode
+            }
+
+            let ref$1 = _this;
+            let cache = ref$1.cache;
+            let keys = ref$1.keys;
+            let key = vnode.key == null
+                // same constructor may get registered as different local components
+                // so cid alone is not enough (#3269)
+                ? componentOptions.Ctor.cid + (componentOptions.tag ? ("::" + (componentOptions.tag)) : '')
+                : vnode.key;
+            if (cache[key]) {
+                vnode.componentInstance = cache[key].componentInstance;
+                // make current key freshest
+                _this.remove(keys, key);
+                keys.push(key);
+            } else {
+                cache[key] = vnode;
+                keys.push(key);
+                // prune oldest entry
+                if (_this.max && keys.length > parseInt(_this.max)) {
+                    _this.pruneCacheEntry(cache, keys[0], keys, _this._vnode);
+                }
+            }
+
+            vnode.data.keepAlive = true;
+            vnode.data.curPath = route.fullPath;
+        }
+        return vnode || (slot && slot[0])
+    },
+    props: {
+        include: [String, RegExp, Array],
+        exclude: [String, RegExp, Array],
+        max: [String, Number],
+        routerList: [Array]
+    },
+    data: function(){
+        return {
+            _toString: Object.prototype.toString
+        }
+    },
+    created: function () {
+        this.cache = Object.create(null);
+        this.keys = [];
+    },
+    destroyed: function () {
+        let _this = this;
+        for (let key in _this.cache) {
+            _this.pruneCacheEntry(_this.cache, key, _this.keys);
+        }
+    },
+    watch: {
+        'include': function (val) {
+            let _this = this;
+            _this.pruneCache(function (name) {
+                return _this.matches(val, name);
+            });
+        },
+        'exclude': function (val) {
+            let _this = this;
+            _this.pruneCache(function (name) {
+                return !_this.matches(val, name);
+            });
+        },
+        'routerList': function(val) {
+            let _this = this;
+            _this.pruneCache2(function (name) {
+                return !_this.matches(val, name);
+            });
+        }
+    },
+    methods: {
+        pruneCacheEntry(cache, key, keys, current) {
+            let cached = cache[key];
+            if (cached) {
+                cached.componentInstance.$destroy();
+            }
+            cache[key] = null;
+            this.remove(keys, key);
+        },
+        pruneCache(filter) {
+            let _this = this;
+            let cache = _this.cache;
+            let keys = _this.keys;
+            let _vnode = _this._vnode;
+            for (let key in cache) {
+                let cachedNode = cache[key];
+                if (cachedNode) {
+                    let name = _this.getComponentName(cachedNode.componentOptions);
+                    if (name && !filter(name)) {
+                        _this.pruneCacheEntry(cache, key, keys, _vnode);
+                    }
+                }
+            }
+        },
+        pruneCache2(filter) {
+            let _this = this;
+            let cache = _this.cache;
+            let keys = _this.keys;
+            let _vnode = _this._vnode;
+            for (let key in cache) {
+                let cachedNode = cache[key];
+                if (cachedNode) {
+                    let name = cachedNode.data.curPath;
+                    if (name && filter(name)) {
+                        _this.pruneCacheEntry(cache, key, keys, _vnode);
+                    }
+                }
+            }
+        },
+        matches(pattern, name) {
+            if (Array.isArray(pattern)) {
+                return pattern.indexOf(name) > -1
+            } else if (typeof pattern === 'string') {
+                return pattern.split(',').indexOf(name) > -1
+            } else if (this.isRegExp(pattern)) {
+                return pattern.test(name)
+            }
+            /* istanbul ignore next */
+            return false
+        },
+        getComponentName(opts) {
+            return opts && (opts.Ctor.options.name || opts.tag)
+        },
+        getFirstComponentChild(children) {
+            let _this = this;
+            if (Array.isArray(children)) {
+                for (let i = 0; i < children.length; i++) {
+                    let c = children[i];
+                    if (_this.isDef(c) && (_this.isDef(c.componentOptions) || _this.isAsyncPlaceholder(c))) {
+                        return c
+                    }
+                }
+            }
+        },
+        isAsyncPlaceholder(node) {
+            return node.isComment && node.asyncFactory
+        },
+        isDef(v) {
+            return v !== undefined && v !== null
+        },
+        isRegExp(v) {
+            return this._toString.call(v) === '[object RegExp]'
+        },
+        remove(arr, item) {
+            if (arr.length) {
+                let index = arr.indexOf(item);
+                if (index > -1) {
+                    return arr.splice(index, 1)
+                }
+            }
+        }
+    }
+}
+</script>
+
+<style lang="less">
+
+</style>
+

src/components/app-lang/app-lang.tsx

+import { Component, Vue } from 'vue-property-decorator';
+import './app-lang.less';
+
+import { localList } from '@locale/local-list';
+
+@Component({})
+export default class AppLang extends Vue {
+
+    /**
+     * 本地语言资源
+     *
+     * @type {*}
+     * @memberof AppLang
+     */
+    public localList: any[] = localList;
+
+    /**
+     * 标题
+     *
+     * @type {(string | null)}
+     * @memberof AppLang
+     */
+    public title: string | null = null;
+
+    /**
+     * vue 生命周期
+     *
+     * @memberof AppLang
+     */
+    public mounted() {
+        const lang: string = this.$i18n.locale;
+        const local: any = this.localList.find((_local: any) => Object.is(_local.type, lang));
+        this.title = local.name;
+    }
+
+    /**
+     * 选择语言
+     *
+     * @param {*} $evnet
+     * @memberof AppLang
+     */
+    public selectLang($evnet: any): void {
+        this.$i18n.locale = $evnet;
+        const local: any = this.localList.find((_local: any) => Object.is(_local.type, $evnet));
+        this.title = local.name;
+        localStorage.setItem('local', $evnet);
+    }
+
+
+    /**
+     * 内容绘制
+     *
+     * @returns
+     * @memberof Form
+     */
+    public render() {
+        return (
+            <dropdown trigger='click' on-on-click={($event: any) => this.selectLang($event)}>
+                <span>
+                    {this.title}
+                    <icon size='18' type='md-arrow-dropdown'></icon>
+                </span>
+                <dropdown-menu slot='list'>
+                    {
+                        this.localList.map((item: any) => {
+                            return (
+                                <dropdown-item name={item.type} key={`lang-${item.type}`}>{item.name}</dropdown-item>
+                            );
+                        })
+                    }
+                </dropdown-menu>
+            </dropdown>
+        );
+    }
+}
\ No newline at end of file

src/components/app-mpicker/app-mpicker.tsx

+import { Component, Vue, Prop, Watch } from 'vue-property-decorator';
+import './app-mpicker.less';
+import { Subject } from 'rxjs';
+import { AppModal } from '@/utils';
+
+@Component({})
+export default class AppMpicker extends Vue {
+
+    /**
+     * 传入url
+     */
+    @Prop() url?: any;
+
+    /**
+     * 表单数据
+     */
+    @Prop() activeData?: any;
+
+    /**
+     * 是否禁用
+     */
+    @Prop() disabled?: boolean;
+
+    /**
+     * 编辑器参数
+     */
+    @Prop() editorParams?: any;
+
+    /**
+     * 表单项值
+     */
+    @Prop() curvalue?: any;
+
+    /**
+     * 表单项名称
+     */
+    @Prop() name: any;
+
+
+    /**
+     * 打开对应的选择视图
+     */
+    @Prop() pickupView?: any;
+
+    /**
+     * 当前表单项绑定值key的集合
+     */
+    public value: any;
+
+    /**
+     * 所有操作过的下拉选选项
+     */
+    public items: Array<any> = [];
+
+    /**
+     * 选中项key-value键值对
+     * 
+     */
+    public selectItems: Array<any> = [];
+
+    /**
+     * 监听curvalue值
+     * @param newVal 
+     * @param val 
+     */
+    @Watch('curvalue', { deep: true })
+    oncurvalueChange(newVal: any, val: any) {
+        this.value = [];
+        this.selectItems = [];
+        if (newVal) {
+            this.selectItems = JSON.parse(newVal);
+            this.selectItems.forEach((item: any) => {
+                this.value.push(item.srfkey);
+                let index = this.items.findIndex((i) => Object.is(i.value, item.srfkey));
+                if (index < 0) {
+                    this.items.push({ text: item.srfmajortext, value: item.srfkey });
+                }
+            });
+        }
+        this.$forceUpdate();
+    }
+
+    /**
+     * 远程执行搜索
+     *
+     * @param {*} query
+     * @memberof AppMpicker
+     */
+    public onSearch(query: any) {
+        if (this.url) {
+            let param: any = {
+                srfaction: 'itemfetch',
+                query: query
+            };
+            if (this.activeData) {
+                Object.assign(param, { srfreferdata: this.activeData });
+            }
+            this.$http.post(`${this.url}${this.name}/ac`, param).then((data: any) => {
+                this.items = data.items;
+            })
+        }
+    }
+
+    /**
+     * 下拉选中回调
+     *
+     * @param {*} selects
+     * @memberof AppMpicker
+     */
+    public onSelect(selects: any) {
+        let val: Array<any> = [];
+        if (selects.length > 0) {
+            selects.forEach((select: any) => {
+                let index = this.items.findIndex((item) => Object.is(item.value, select));
+                if (index >= 0) {
+                    let item = this.items[index];
+                    val.push({ srfkey: item.value, srfmajortext: item.text });
+                } else {
+                    index = this.selectItems.findIndex((item: any) => Object.is(item.srfkey, select));
+                    if (index >= 0) {
+                        let item = this.selectItems[index];
+                        val.push(item);
+                    }
+                }
+            });
+            let value = val.length > 0 ? JSON.stringify(val) : '';
+            this.$emit('formitemvaluechange', { name: this.name, value: value });
+        }
+    }
+
+    /**
+     * 移除标签回调
+     *
+     * @param {*} tag
+     * @memberof AppMpicker
+     */
+    public onRemove(tag: any) {
+        let index = this.selectItems.findIndex((item: any) => Object.is(item.srfkey, tag));
+        if (index >= 0) {
+            this.selectItems.splice(index, 1);
+            let value = this.selectItems.length > 0 ? JSON.stringify(this.selectItems) : '';
+            this.$emit('formitemvaluechange', { name: this.name, value: value });
+        }
+    }
+
+    /**
+     * 打开视图
+     *
+     * @returns
+     * @memberof AppMpicker
+     */
+    public openView() {
+        if (this.disabled) {
+            return;
+        }
+        let data = { srfparentdata: { srfparentkey: this.activeData.srfkey }, selectedData: [...this.selectItems], };
+        if (this.pickupView && Object.keys(this.pickupView).length > 0) {
+            const view = { ...this.pickupView };
+            const modal: Subject<any> = AppModal.getInstance().openModal(view, data);
+            modal.subscribe((result: any) => {
+                if (!result || !Object.is(result.ret, 'OK')) {
+                    return;
+                }
+                let selects: Array<any> = [];
+                if (result.datas && Array.isArray(result.datas)) {
+                    result.datas.forEach((select: any) => {
+                        selects.push({ srfkey: select.srfkey, srfmajortext: select.srfmajortext });
+                        let index = this.items.findIndex((item) => Object.is(item.value, select.srfkey));
+                        if (index < 0) {
+                            this.items.push({ text: select.srfmajortext, value: select.srfkey });
+                        }
+                    });
+                }
+                if (this.name && this.activeData) {
+                    let value = selects.length > 0 ? JSON.stringify(selects) : '';
+                    this.$emit('formitemvaluechange', { name: this.name, value: value });
+                }
+            })
+        }
+    }
+
+    /**
+     * 渲染组件
+     *
+     * @returns
+     * @memberof AppMpicker
+     */
+    public render() {
+        return (<div>
+            <div style="position: relative;width: 100%;">
+                <el-select value={this.value} multiple filterable remote remote-method={this.onSearch} size="small" style="width:100%;" on-change={this.onSelect} on-remove-tag={this.onRemove} disabled={this.disabled}>
+                    {this.items.map((item: any) => {
+                        return <el-option label={item.text} value={item.value}></el-option>
+                    })}
+                </el-select>
+                <span style="position: absolute;right: 5px;color: #c0c4cc;top: 0;font-size: 13px;">
+                    <i class="el-icon-search" on-click={this.openView}></i>
+                </span>
+            </div>
+        </div>);
+    }
+}
\ No newline at end of file

src/components/app-picker/app-picker.less

+.app-picker {
+    width: 100%;
+    .el-select {
+        .el-input__suffix {
+            right: 20px;
+        }
+    }
+    .text-value {
+        .el-icon-circle-close {
+            display: none;
+        }
+    }
+    .text-value:hover {
+        .el-icon-circle-close {
+            display: inline-block;
+        }
+    }
+    .ivu-icon-ios-open-outline {
+        margin-top: -2px;
+        margin-left: 5px;
+        font-size: 15px;
+    }
+}
\ No newline at end of file

src/components/app-picker/app-picker.tsx

+import { Component, Vue, Prop, Model, Watch } from 'vue-property-decorator';
+import './app-picker.less';
+import { Subject } from 'rxjs';
+import { AppModal } from '@/utils';
+
+@Component({})
+export default class AppPicker extends Vue {
+
+    /**
+     * 表单数据
+     *
+     * @type {*}
+     * @memberof AppPicker
+     */
+    @Prop() public data!: any;
+
+    /**
+     * 属性项名称
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public name!: string;
+
+    /**
+     * 是否启用
+     *
+     * @type {boolean}
+     * @memberof AppPicker
+     */
+    @Prop() public disabled?: boolean;
+
+    /**
+     * 类型
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public editortype?: string;
+
+    /**
+     * 视图名称
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public refviewname?: string;
+
+    /**
+     * 视图参数（如：视图name，title，width，height）
+     *
+     * @type {*}
+     * @memberof AppPicker
+     */
+    @Prop() public pickupView?: any;
+
+    /**
+     * 数据链接参数
+     *
+     * @type {*}
+     * @memberof AppPicker
+     */
+    @Prop() public linkview?: any;
+
+    /**
+     * 表单项参数
+     * 
+     * @type {any}
+     * @memberof AppPicker
+     */
+    @Prop() public itemParam: any;
+
+    /**
+     * 值项名称
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public valueitem?: string;
+
+    /**
+     * 值
+     *
+     * @type {*}
+     * @memberof AppPicker
+     */
+    @Model('change') public value?: any;
+
+    /**
+     * 当前值
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    public curvalue: string = '';
+
+    /**   
+     * 远程请求url 地址
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public url?: string;
+
+    /**
+     * 下拉数组
+     * @type {any[]}
+     * @memberof AppPicker
+     */
+    public items: any[] = [];
+
+    /** 
+     * 下拉图标指向状态管理
+     * @type {boolean}
+     * @memberof AppPicker 
+     */
+    public open: boolean = false;
+
+    /**
+     * 输入状态
+     *
+     * @type {boolean}
+     * @memberof AppAutocomplete
+     */
+    public inputState: boolean = false;
+
+    /**
+     * 项绘制
+     *
+     * @type {Function}
+     * @memberof AppPicker
+     */
+    @Prop() renderItem?: Function;
+
+    /**
+     * 获取关联数据项值
+     *
+     * @readonly
+     * @memberof AppPicker
+     */
+    get refvalue() {
+        if (this.valueitem && this.data) {
+            return this.data[this.valueitem];
+        }
+        return this.curvalue;
+    }
+
+    /**
+     * 值变化
+     *
+     * @param {*} newVal
+     * @param {*} oldVal
+     * @memberof AppPicker
+     */
+    @Watch('value')
+    public onValueChange(newVal: any, oldVal: any) {
+        this.curvalue = newVal;
+        if (Object.is(this.editortype, 'dropdown') && this.valueitem) {
+            const value = this.data[this.valueitem];
+            const index = this.items.findIndex((item: any) => Object.is(item.value, value));
+            if (index !== -1) {
+                return;
+            }
+            this.items = [];
+            if (value) {
+                this.items.push({text: newVal, value: value});
+            }
+            this.onSearch(newVal, null, false);
+        }
+    }
+
+    /**
+     * vue 生命周期
+     *
+     * @memberof AppPicker
+     */
+    public mounted() {
+    }
+
+    /**
+     * 组件销毁
+     *
+     * @memberof AppPicker
+     */
+    public destroyed(): void {
+    }
+
+    /**
+     * 下拉切换回调
+     * @param flag 
+     */
+    public onSelectOpen(flag: boolean): void {
+        this.open = flag;
+        if (this.open) {
+            this.onSearch(this.curvalue, null, true);
+        }
+    }
+
+    /**
+     * 执行搜索数据
+     * @param query 
+     * @param callback 
+     */
+    public onSearch(query: any, callback: any, other: boolean): void {
+
+        query = !query ? '' : query;
+        if (!this.inputState && other && Object.is(query, this.value)) {
+            query = '';
+        }
+        this.inputState = false;
+        const url = `${this.url}${this.name}/ac`;
+        let param: any = {};
+        Object.assign(param, this.data);
+        // 清除值项
+        if (other && this.valueitem) {
+            delete param[this.valueitem];
+        }
+        Object.assign(param, { [this.name]: query });
+
+        this.$http.post(url, param).then((response: any) => {
+            if (!response || response.status !== 200) {
+                this.$Notice.error({ title: '错误', desc: '请求异常' });
+            } else {
+                this.items = [...response.data];
+            }
+            if (callback) {
+                callback(this.items);
+            }
+        }).catch((error: any) => {
+            if (callback) {
+                callback([]);
+            }
+        });
+    }
+
+    /**
+     * 选中数据回调
+     * @param item 
+     */
+    public onACSelect(item: any): void {
+        if (this.name) {
+            this.$emit('formitemvaluechange', { name: this.name, value: item.text });
+        }
+        if (this.valueitem) {
+            this.$emit('formitemvaluechange', { name: this.valueitem, value: item.value });
+        }
+
+    }
+
+    /**
+     * 下拉选中
+     *
+     * @param {string} val
+     * @memberof AppPicker
+     */
+    public onSelect(val: string) {
+        let index = this.items.findIndex((item) => Object.is(item.value, val));
+        if (index >= 0) {
+            this.onACSelect(this.items[index]);
+        }
+    }
+
+    /**
+     * 失去焦点事件
+     * @param e 
+     */
+    public onBlur(e: any): void {
+        let val: string = e.target.value;
+        if (!Object.is(val, this.curvalue)) {
+            this.onACSelect({ text: val, value: '' });
+        }
+        this.$forceUpdate();
+    }
+
+    /**
+     * 清除
+     */
+    public onClear($event: any): void {
+        if (this.name) {
+            this.$emit('formitemvaluechange', { name: this.name, value: '' });
+        }
+        if (this.valueitem) {
+            this.$emit('formitemvaluechange', { name: this.valueitem, value: '' });
+        }
+        this.$forceUpdate();
+    }
+
+    /**
+     * 打开视图
+     */
+    public openView($event: any): void {
+        if (this.disabled) {
+            return;
+        }
+        // 填充条件判断
+        let arg: any = {};
+        const bcancel: boolean = this.fillPickupCondition(arg);
+        if (!bcancel) {
+            return;
+        }
+
+        let data = { srfparentdata: arg };
+        const view = { ...this.pickupView };
+        let modalContainer: Subject<any>;
+        if (view.placement && !Object.is(view.placement, '')) {
+            if (Object.is(view.placement, 'POPOVER')) {
+                modalContainer = this.$apppopover.openPop($event, view, data);
+            } else {
+                modalContainer = this.$appdrawer.openDrawer(view, data);
+            }
+        } else {
+            modalContainer = AppModal.getInstance().openModal(view, data);
+        }
+        modalContainer.subscribe((result: any) => {
+            if (!result || !Object.is(result.ret, 'OK')) {
+                return;
+            }
+
+            this.openViewClose(result);
+        })
+    }
+
+    /**
+     * 路由模式打开视图
+     *
+     * @private
+     * @param {string} viewpath
+     * @param {*} data
+     * @memberof AppPicker
+     */
+    private openIndexViewTab(viewpath: string, data: any): void {
+        const _params = this.$util.prepareRouteParmas({
+            route: this.$route,
+            sourceNode: this.$route.name,
+            targetNode: viewpath,
+            data: data,
+        });
+        this.$router.push({ name: viewpath, params: _params });
+    }
+
+    /**
+     * 模态模式打开视图
+     *
+     * @private
+     * @param {*} view
+     * @param {*} data
+     * @memberof AppPicker
+     */
+    private openPopupModal(view: any, data: any): void {
+        let container: Subject<any> = this.$appmodal.openModal(view, data);
+        container.subscribe((result: any) => {
+            if (!result || !Object.is(result.ret, 'OK')) {
+                return;
+            }
+            this.openViewClose(result);
+        });
+    }
+
+    /**
+     * 抽屉模式打开视图
+     *
+     * @private
+     * @param {*} view
+     * @param {*} data
+     * @memberof AppPicker
+     */
+    private openDrawer(view: any, data: any): void {
+        let container: Subject<any> = this.$appdrawer.openDrawer(view, data);
+        container.subscribe((result: any) => {
+            if (!result || !Object.is(result.ret, 'OK')) {
+                return;
+            }
+            this.openViewClose(result);
+        });
+    }
+
+    /**
+     * 气泡卡片模式打开
+     *
+     * @private
+     * @param {*} $event
+     * @param {*} view
+     * @param {*} data
+     * @memberof AppPicker
+     */
+    private openPopOver($event: any, view: any, data: any): void {
+        let container: Subject<any> = this.$apppopover.openPop($event, view, data);
+        container.subscribe((result: any) => {
+            if (!result || !Object.is(result.ret, 'OK')) {
+                return;
+            }
+            this.openViewClose(result);
+        });
+    }
+
+    /**
+     * 独立里面弹出
+     *
+     * @private
+     * @param {string} url
+     * @memberof AppPicker
+     */
+    private openPopupApp(url: string): void {
+        window.open(url, '_blank');
+    }
+
+    /**
+     * 打开重定向视图
+     *
+     * @private
+     * @param {*} $event
+     * @param {*} view
+     * @param {*} data
+     * @memberof AppPicker
+     */
+    private openRedirectView($event: any, view: any, data: any): void {
+        this.$http.get(view.url, data).then((response: any) => {
+            if (!response || response.status !== 200) {
+                this.$Notice.error({ title: '错误', desc: '请求异常' });
+            }
+            if (response.status === 401) {
+                return;
+            }
+            const { data: result } = response;
+
+            if (result.viewparams && !Object.is(result.viewparams.srfkey, '')) {
+                Object.assign(data, { srfkey: result.viewparams.srfkey });
+            }
+
+            if (Object.is(result.openmode, 'POPUPAPP') && result.url && !Object.is(result.url, '')) {
+                this.openPopupApp(result.url);
+            } else if (Object.is(result.openmode, 'INDEXVIEWTAB') || Object.is(result.openmode, '')) {
+                const viewpath = `${result.viewmodule}_${result.viewname}`.toLowerCase();
+                // 所有数据保持在同一级
+                if (data.srfparentdata) {
+                    Object.assign(data, data.srfparentdata);
+                    delete data.srfparentdata;
+                }
+                this.openIndexViewTab(viewpath, data);
+            } else if (Object.is(result.openmode, 'POPUPMODAL')) {
+                const viewname = this.$util.srfFilePath2(result.viewname);
+                const view: any = {
+                    viewname: viewname,
+                    title: result.title,
+                    width: result.width,
+                    height: result.height,
+                }
+                this.openPopupModal(view, data);
+            } else if (result.openmode.startsWith('DRAWER')) {
+                const viewname = this.$util.srfFilePath2(result.viewname);
+                const view: any = {
+                    viewname: viewname,
+                    title: result.title,
+                    width: result.width,
+                    height: result.height,
+                    placement: result.openmode,
+                }
+                this.openDrawer(view, data);
+            } else if (Object.is(result.openmode, 'POPOVER')) {
+                const viewname = this.$util.srfFilePath2(result.viewname);
+                const view: any = {
+                    viewname: viewname,
+                    title: result.title,
+                    width: result.width,
+                    height: result.height,
+                    placement: result.openmode,
+                }
+                this.openPopOver($event, view, data);
+            }
+        }).catch((response: any) => {
+            if (!response || !response.status || !response.data) {
+                this.$Notice.error({ title: '错误', desc: '系统异常！' });
+                return;
+            }
+            if (response.status === 401) {
+                return;
+            }
+            const { data: _data } = response;
+            this.$Notice.error({ title: _data.title, desc: _data.message });
+        });
+    }
+
+    /**
+     * 打开链接视图
+     *
+     * @memberof AppPicker
+     */
+    public openLinkView($event: any): void {
+        let srfkey: string;
+        if (!this.data || !this.valueitem || !this.data[this.valueitem]) {
+            this.$Notice.error({ title: '错误', desc: '值项异常!' });
+            return;
+        }
+        srfkey = this.data[this.valueitem];
+        let data = { srfkey: srfkey };
+        const view = JSON.parse(JSON.stringify(this.linkview));
+        const viewname2: string = this.$util.srfFilePath2(view.viewname);
+
+        if (view.isRedirectView) {
+            this.openRedirectView($event, view, data);
+        } else if (Object.is(view.placement, 'INDEXVIEWTAB') || Object.is(view.placement, '')) {
+            let viewname = `${this.linkview.viewmodule}_${this.linkview.viewname}`.toLocaleLowerCase();
+            this.openIndexViewTab(viewname, data);
+        } else if (Object.is(view.placement, 'POPOVER')) {
+            view.viewname = viewname2;
+            this.openPopOver($event, view, data);
+        } else if (Object.is(view.placement, 'POPUPMODAL')) {
+            view.viewname = viewname2;
+            this.openPopupModal(view, data);
+        } else if (view.placement.startsWith('DRAWER')) {
+            view.viewname = viewname2;
+            this.openDrawer(view, data);
+        }
+    }
+
+    /**
+     * 打开页面关闭
+     *
+     * @param {*} result
+     * @memberof AppPicker
+     */
+    public openViewClose(result: any) {
+        let item: any = {};
+        if (result.datas && Array.isArray(result.datas)) {
+            Object.assign(item, result.datas[0]);
+        }
+
+        if (this.data) {
+            if (this.name) {
+                this.$emit('formitemvaluechange', { name: this.name, value: item.srfmajortext });
+            }
+            if (this.valueitem) {
+                this.$emit('formitemvaluechange', { name: this.valueitem, value: item.srfkey });
+            }
+        }
+    }
+
+    /**
+     * 填充表单条件
+     *
+     * @param {*} arg
+     * @returns
+     * @memberof AppPicker
+     */
+    public fillPickupCondition(arg: any): boolean {
+        if (!this.itemParam) {
+            return true;
+        }
+        if (!this.data) {
+            this.$Notice.error({ title: '错误', desc: '表单数据异常' });
+            return false;
+        }
+        if (this.itemParam.parentdata) {
+            return Object.keys(this.itemParam.parentdata).every((name: string) => {
+                if (!name) {
+                    return true;
+                }
+                let value: string = this.itemParam.parentdata[name];
+                if (value && value.startsWith('%') && value.endsWith('%')) {
+                    const key: string = value.substring(1, value.length - 1);
+                    if (!this.data.hasOwnProperty(key)) {
+                        this.$Notice.error({ title: '错误', desc: `操作失败,未能找到当前表单项${key}，无法继续操作` });
+                        return false;
+                    }
+                    value = this.data[key];
+                }
+                Object.assign(arg, { [name]: value });
+                return true;
+            });
+        }
+        return true;
+    }
+
+    /**
+     * 输入过程中
+     *
+     * @memberof AppAutocomplete
+     */
+    public onInput($event: any) {
+        if (Object.is($event, this.value)) {
+            this.inputState = true;
+        }
+    }
+
+    /**
+     * 展开下拉
+     *
+     * @memberof AppPicker
+     */
+    public openDropdown() {
+        const appPicker: any = this.$refs.appPicker;
+        if(appPicker) {
+            appPicker.focus();
+        }
+    }
+
+    /**
+     * 收起下拉
+     *
+     * @memberof AppPicker
+     */
+    public closeDropdown() {
+        const appPicker: any = this.$refs.appPicker;
+        if(appPicker) {
+            appPicker.blur();
+        }
+    }
+    
+    /**
+     * 其他绘制
+     *
+     * @returns
+     * @memberof AppPicker
+     */
+    public renderOther() {
+        let content = {
+            scopedSlots: {
+                default: (props: any) => {
+                    if (this.renderItem) {
+                        return this.renderItem(props.item);
+                    }
+                }
+            }
+        };
+        return (
+            <div class='app-picker'>
+                <el-autocomplete class='text-value' value-key='text' disabled={this.disabled} v-model={this.curvalue} size='small'
+                    trigger-on-focus={true} fetch-suggestions={(query: any, callback: any) => { this.onSearch(query, callback, true) }} on-select={(item: any) => { this.onACSelect(item) }}
+                    on-input={($event: any) => this.onInput($event)} on-blur={($event: any) => { this.onBlur($event) }} style='width:100%;' {...content}>
+                    <template slot='suffix'>
+                        {(this.curvalue && !this.disabled) ? <i class='el-icon-circle-close' on-click={($event: any) => { this.onClear($event) }}></i> : ''}
+                        {!Object.is(this.editortype, 'ac') ? <i class='el-icon-search' on-click={($event: any) => { this.openView($event) }}></i> : ''}
+                        {this.linkview ? <icon type="ios-open-outline" on-click={($event: any) => { this.openLinkView($event) }} /> : ''}
+                    </template >
+                </el-autocomplete >
+            </div >
+        );
+    }
+
+    /**
+     * 绘制选择无ac
+     *
+     * @returns
+     * @memberof AppPicker
+     */
+    public renderPickupNoAC() {
+        return (
+            <div class='app-picker'>
+                <el-input class='text-value' value={this.curvalue} readonly size='small' disabled={this.disabled}>
+                    <template slot='suffix'>
+                        {(this.curvalue && !this.disabled) ? <i class='el-icon-circle-close' on-click={($event: any) => this.onClear($event)}></i> : ''}
+                        <i class='el-icon-search' on-click={($event: any) => this.openView($event)}></i>
+                        {this.linkview ? <icon type="ios-open-outline" on-click={($event: any) => { this.openLinkView($event) }} /> : ''}
+                    </template>
+                </el-input>
+            </div >
+        );
+    }
+
+    /**
+     * 绘制下拉
+     *
+     * @returns
+     * @memberof AppPicker
+     */
+    public renderDropdown() {
+        return (
+            <div class='app-picker'>
+                <el-select ref="appPicker" remote remote-method={(query: any) => this.onSearch(query, null, true)} value={this.refvalue} size='small' filterable
+                    on-change={($event: any) => this.onSelect($event)} disabled={this.disabled} style='width:100%;' clearable
+                    on-clear={($event: any) => this.onClear($event)} on-visible-change={($event: any) => this.onSelectOpen($event)}>
+                    {this.items ? this.items.map((_item: any) => {
+                        return <el-option key={_item.value} value={_item.value} label={_item.text} disabled={_item.disabled}></el-option>;
+                    }) : ''}
+                </el-select>
+                <span style='position: absolute;right: 5px;color: #c0c4cc;top:0;font-size: 13px;'>
+                    <i v-show={this.open} class='el-icon-arrow-up' on-click={() => this.closeDropdown()}></i> 
+                    <i v-show={!this.open} class='el-icon-arrow-down' on-click={() => this.openDropdown()}></i>
+                </span>
+            </div >
+        );
+    }
+
+    /**
+     * 数据链接
+     *
+     * @returns
+     * @memberof AppPicker
+     */
+    public renderLinkOnly() {
+        return (
+            <div class='app-picker'>
+                <a on-click={($event: any) => { this.openLinkView($event) }}>{this.curvalue}</a>
+            </div>
+        );
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @memberof AppPicker
+     */
+    public render() {
+        if (Object.is(this.editortype, 'linkonly')) {
+            return this.renderLinkOnly();
+        } else if (!Object.is(this.editortype, 'pickup-no-ac') && !Object.is(this.editortype, 'dropdown')) {
+            return this.renderOther();
+        } else if (Object.is(this.editortype, 'pickup-no-ac')) {
+            return this.renderPickupNoAC();
+        } else if (Object.is(this.editortype, 'dropdown')) {
+            return this.renderDropdown();
+        }
+    }
+}
\ No newline at end of file

src/components/app-radio-group/app-radio-group.less

+.app-radio-group {
+    overflow: auto;
+}
\ No newline at end of file

src/components/app-radio-group/app-radio-group.tsx

+import { Component, Vue, Prop, Model } from 'vue-property-decorator';
+import './app-radio-group.less';
+
+@Component({})
+export default class AppRadioGroup extends Vue {
+
+    /**
+     * 双向绑定值
+     *
+     * @type {*}
+     * @memberof AppRadioGroup
+     */
+    @Model('change') item?: any;
+
+    /**
+     * 获取值
+     *
+     * @memberof AppRadioGroup
+     */
+    get value() {
+        return this.item;
+    }
+
+    /**
+     * 设置值
+     *
+     * @memberof AppRadioGroup
+     */
+    set value(val: any) {
+        this.$emit('change', val);
+    }
+
+    /**
+     * 代码表标识
+     *
+     * @type {string}
+     * @memberof AppRadioGroup
+     */
+    @Prop() public tag?: string;
+
+    /**
+     * 是否禁用
+     *
+     * @type {boolean}
+     * @memberof AppRadioGroup
+     */
+    @Prop() public disabled?: boolean;
+
+    /**
+     * 属性名称
+     *
+     * @type {string}
+     * @memberof AppRadioGroup
+     */
+    @Prop() name?: string;
+
+    /**
+     * 是否禁用
+     *
+     * @readonly
+     * @memberof AppRadioGroup
+     */
+    get isDisabled() {
+        if (this.disabled) {
+            return true;
+        } else {
+            return false;
+        }
+    }
+
+    /**
+     * 代码表
+     *
+     * @type {any[]}
+     * @memberof AppRadioGroup
+     */
+    public items: any[] = [];
+
+    /**
+     * vue  生命周期
+     *
+     * @memberof AppRadioGroup
+     */
+    public created() {
+        const codelist = this.$store.getters.getCodeList(this.tag);
+        if (codelist) {
+            this.items = [...JSON.parse(JSON.stringify(codelist.items))];
+        } else{
+            console.log(`----${this.tag}----代码表不存在`);
+        }
+    }
+
+    /**
+     * 渲染组件
+     *
+     * @returns
+     * @memberof AppRadioGroup
+     */
+    public render() {
+        return (
+            <radio-group class="app-radio-group" v-model={this.value} >
+                {this.items.map((_item: any) => {
+                    return <radio label={_item.value} disabled={this.isDisabled || _item.disabled}>
+                        <span>{_item.text}</span>
+                    </radio>
+                })}
+            </radio-group>
+        );
+    }
+}
\ No newline at end of file

src/components/app-range-editor/app-range-editor.less

+.app-range-editor {
+    display: flex;
+    .editor-space {
+        padding: 0 5px;
+        font-size: 15px;
+    }
+    .ivu-date-picker {
+        flex-grow: 1;
+    }
+}
\ No newline at end of file

src/components/app-range-editor/app-range-editor.tsx

+import { Component, Vue, Prop, Model, Watch } from 'vue-property-decorator';
+import './app-range-editor.less';
+import { Subject } from 'rxjs';
+import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
+
+@Component({})
+export default class AppPicker extends Vue {
+
+    /**
+     * 编辑项名称
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public name!: string;
+
+    /**
+     * 是否禁用
+     *
+     * @type {boolean}
+     * @memberof AppPicker
+     */
+    @Prop() public disabled!: boolean;
+
+    /**
+     * 表单数据对象
+     *
+     * @type {*}
+     * @memberof AppPicker
+     */
+    @Prop() public activeData: any;
+
+    /**
+     * 值格式
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public format!: string;
+
+    /**
+     * 编辑器类型
+     *
+     * @type {string}
+     * @memberof AppPicker
+     */
+    @Prop() public editorType!: string;
+
+    /**
+     * 关系表单项集合
+     *
+     * @type {string[]}
+     * @memberof AppPicker
+     */
+    @Prop() public refFormItem!: string[];
+
+    /**
+     * 值变化时间
+     *
+     * @private
+     * @type {Subject<any>}
+     * @memberof InputBox
+     */
+    private inputDataChang: Subject<any> = new Subject()
+
+    /**
+     * 处理值格式
+     *
+     * @readonly
+     * @memberof AppPicker
+     */
+    get valFormat() {
+        return this.format.replace('YYYY', 'yyyy').replace('DD', 'dd');
+    }
+
+    /**
+     * 获取值
+     *
+     * @param {string} name
+     * @returns
+     * @memberof AppPicker
+     */
+    public getValue(name: string) {
+        return this.activeData[name];
+    }
+
+    /**
+     * 设置值
+     *
+     * @param {string} name
+     * @param {*} val
+     * @memberof AppPicker
+     */
+    public setValue(name: string, val: any) {
+        this.inputDataChang.next({ name: name, value: val });
+    }
+
+    /**
+     * vue  声明周期 debounceTime
+     *
+     * @memberof InputBox
+     */
+    public created() {
+        this.inputDataChang
+            .pipe(
+                debounceTime(500),
+                distinctUntilChanged()
+            ).subscribe((data: any) => {
+                this.$emit('formitemvaluechange', { name: data.name, value: data.value });
+            });
+    }
+
+    /**
+     * 值改变
+     *
+     * @param {string} name
+     * @param {*} value
+     * @memberof AppPicker
+     */
+    public onValueChange(name: string, value: any) {
+        this.$emit('formitemvaluechange', { name: name, value: value });
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @memberof AppPicker
+     */
+    public render() {
+        return (
+            <div class="app-range-editor">
+                {
+                    this.refFormItem.map((item, index) => {
+                        if (this.editorType.startsWith('DATEPICKEREX')) {
+                            if(Object.is(this.editorType, 'DATEPICKEREX') || Object.is(this.editorType, 'DATEPICKEREX_NOTIME')) {
+                                return [index > 0 ? <span class="editor-space">~</span> : null, this.renderDateEditor(item)];
+                            } else {
+                                return [index > 0 ? <span class="editor-space">~</span> : null, this.renderTimeEditor(item)];
+                            }
+                        } else {
+                            return [index > 0 ? <span class="editor-space">~</span> : null, this.renderNumberEditor(item)];
+                        }
+                    })
+                }
+            </div>
+        );
+    }
+
+    /**
+     * 日期范围编辑器
+     *
+     * @returns
+     * @memberof AppPicker
+     */
+    public renderDateEditor(name: string) {
+        return (<date-picker type="date" transfer={true} format={this.valFormat} placeholder="请选择时间..." value={this.activeData[name]} disabled={this.disabled} on-on-change={(val1: any, val2: any) => { this.onValueChange(name, val1) }}></date-picker>);
+    }
+
+    /**
+     * 时间范围编辑器
+     *
+     * @returns
+     * @memberof AppPicker
+     */
+    public renderTimeEditor(name: string) {
+        return (<time-picker value={this.activeData[name]} transfer={true} disabled={this.disabled} format={this.valFormat} placeholder="请选择时间..."  on-on-change={(val: any) => {this.onValueChange(name, val)}}></time-picker>);
+    }
+
+    /**
+     * 数字范围编辑器
+     *
+     * @memberof AppPicker
+     */
+    public renderNumberEditor(name: string) {
+        return (<i-input type="number" value={this.getValue(name)} disabled={this.disabled} placeholder="请输入" on-on-change={($event: any) => { this.setValue(name, $event) }}></i-input>);
+    }
+}
\ No newline at end of file

src/components/app-rich-text-editor/app-rich-text-editor.tsx

+import { Vue, Component, Prop, Model, Watch } from 'vue-property-decorator';
+import './app-rich-text-editor.less';
+import { Subject } from 'rxjs';
+import { Environment } from '@/environments/environment';
+import axios from 'axios';
+
+import tinymce from "tinymce/tinymce";
+import 'tinymce/themes/modern';
+import 'tinymce/plugins/link';
+import 'tinymce/plugins/paste';
+import 'tinymce/plugins/table';
+import 'tinymce/plugins/image';
+import 'tinymce/plugins/imagetools';
+import 'tinymce/plugins/codesample';
+import 'tinymce/plugins/code';
+import 'tinymce/plugins/fullscreen';
+import 'tinymce/plugins/preview';
+
+const tinymceCode:any = tinymce;
+
+
+
+@Component({})
+export default class AppRichTextEditor extends Vue {
+
+
+    /**
+     * 传入值
+     */
+    @Prop() value?: any;
+
+    /**
+     * 监听value值
+     */
+    @Watch('value', { immediate: true, deep: true })
+    oncurrentContent(newval: any, val: any) {
+        if (newval) {
+            if(this.editor){
+                tinymceCode.remove('#' + this.id);
+            }
+            this.init(newval);
+        }
+    }
+    
+    /**
+     * 输入name
+     */
+    @Prop() name?: string;
+
+    /**
+     * 输入高度
+     */
+    @Prop() height?: any;
+
+    /**
+     * 是否禁用
+     */
+    @Prop() disabled?: any;
+
+    /**
+     * 当前语言,默认中文
+     */
+    @Prop() langu?: string;
+
+    /**
+     * 上传文件路径
+     */
+    public uploadUrl = '/' + Environment.BaseUrl + Environment.UploadFile;
+
+    /**
+     * 下载路径
+     */
+    public downloadUrl = '/' + Environment.BaseUrl + Environment.ExportFile;
+
+    /**
+     * 当前富文本
+     */
+    public editor: any = null;
+
+    /**
+     *  当前富文本id
+     */
+    id: string = this.$util.createUUID();
+
+    /**
+     * 表单状态
+     *
+     * @type {Subject<any>}
+     * @memberof AppRichTextEditor
+     */
+    @Prop() public formState?: Subject<any>;
+
+    /**
+     * 生命周期
+     *
+     * @memberof AppRichTextEditor
+     */
+    public created() {
+        if(this.formState) {
+            this.formState.subscribe(({ type, data }) => {
+                if (Object.is('load', type)) {
+                    if (!this.value) {
+                        if(this.editor){
+                            tinymceCode.remove('#' + this.id);
+                        }
+                        this.init(this.value);
+                    }
+                }
+            });
+        }
+    }
+
+    /**
+     * 初始化富文本
+     */
+    public mounted() {
+        this.init('');
+    }
+    
+    /**
+     * 销毁富文本
+     */
+    public destoryed(){
+        tinymceCode.remove(this.editor);
+    }
+
+    /**
+     * 初始化富文本
+     * @param val 
+     */
+    public init(val: any) {
+        let richtexteditor = this;
+        tinymceCode.init({
+            selector: '#' + this.id,
+            height: this.height,
+            min_height: 400,
+            branding: false,
+            plugins: ['link', 'paste', 'table', 'image', 'codesample', 'code', 'fullscreen', 'preview'],
+            codesample_languages: [
+                { text: 'HTML/XML', value: 'markup' },
+                { text: 'JavaScript', value: 'javascript' },
+                { text: 'CSS', value: 'css' },
+                { text: 'PHP', value: 'php' },
+                { text: 'Ruby', value: 'ruby' },
+                { text: 'Python', value: 'python' },
+                { text: 'Java', value: 'java' },
+                { text: 'C', value: 'c' },
+                { text: 'C#', value: 'csharp' },
+                { text: 'C++', value: 'cpp' }
+            ],
+            paste_data_images: true,
+            codesample_content_css: 'assets/tinymce/prism.css',
+            skin_url: './assets/tinymce/skins/lightgray',
+            language_url: './assets/tinymce/langs/' + (this.langu ? this.langu : 'zh_CN') + '.js',
+            setup: (editor: any) => {
+                this.editor = editor;
+                editor.on('blur', () => {
+                    const content = editor.getContent();
+                    this.$emit('change', content);
+                });
+            },
+            images_upload_handler: (bolbinfo: any, success: any, failure: any) => {
+                const formData = new FormData();
+                formData.append('file', bolbinfo.blob(), bolbinfo.filename());
+                const _url = richtexteditor.uploadUrl;
+                richtexteditor.uploadFile(_url, formData).subscribe((response: any) => {
+                    if (response.ret === 0 && response.files.length > 0) {
+                        const id: string = response.files[0].id;
+                        const url: string = `${richtexteditor.downloadUrl}?fileid=${id}`
+                        success(url);
+                    }
+                }, (error: any) => {
+                    console.log(error);
+                });
+            },
+            init_instance_callback: (editor: any) => {
+                this.editor = editor;
+                let value = (this.value && this.value.length > 0) ? this.value : '';
+                if (this.editor) {
+                    this.editor.setContent(value);
+                }
+                if (this.disabled) {
+                    this.editor.setMode('readonly');
+                }
+            }
+        });
+    }
+
+    /**
+     * 上传文件
+     * @param url 
+     * @param formData 
+     */
+    public uploadFile(url: string, formData: any) {
+        let _this = this;
+        const subject: Subject<any> = new Subject<any>();
+        axios({
+            method: 'post',
+            url: url,
+            data: formData,
+            headers: { 'Content-Type': 'image/png', 'Accept': 'application/json' },
+        }).then((response: any) => {
+            if (response.status === 200) {
+                subject.next(response.data);
+            } else {
+                subject.error(response);
+            }
+        }).catch((response: any) => {
+            subject.error(response);
+        });
+        return subject;
+    }
+
+    /**
+     * 渲染组件
+     */
+    public render() {
+        return (
+            <textarea id={this.id}></textarea>
+        );
+    }
+}
\ No newline at end of file

src/components/app-theme/app-theme.less

+.app-theme{
+    /***    BRGIN:主题选择框样式    ***/
+    .app-app-theme {
+        .app-theme-color {
+            display: flex;
+            .app-theme-item {
+                width: 30px;
+                height: 30px;
+                margin-right: 5px;
+            }
+            .active {
+                border: 2px solid red;
+            }
+        }
+        .ivu-form-item {
+            border-top: 1px solid #eee;
+            margin-bottom: 10px;
+        }
+    }
+    /***    END:主题选择框样式   ***/
+}
\ No newline at end of file

src/components/app-theme/app-theme.tsx

+import { Component, Vue } from 'vue-property-decorator';
+import './app-theme.less';
+
+@Component({
+    i18n: {
+        messages: {
+            'zh-CN': {
+                caption: {
+                    theme: '主题',
+                    font: '字体',
+                },
+                fontFamilys: {
+                    MicrosoftYaHei: '微软雅黑',
+                    SimHei: '黑体',
+                    YouYuan: '幼圆',
+                },
+            },
+            'en-US': {
+                caption: {
+                    theme: 'Theme',
+                    font: 'Font family',
+                },
+                fontFamilys: {
+                    MicrosoftYaHei: 'Microsoft YaHei',
+                    SimHei: 'SimHei',
+                    YouYuan: 'YouYuan',
+                },
+            }
+        }
+    }
+})
+export default class AppTheme extends Vue {
+
+    /**
+     * 所选择的主题
+     *
+     * @type {*}
+     * @memberof AppTheme
+     */
+    selectTheme: any = '';
+
+    /**
+     * 激活主题
+     *
+     * @type {*}
+     * @memberof AppTheme
+     */
+    public activeTheme: any;
+
+    /**
+     * 主题集合
+     *
+     * @type {Array<any>}
+     * @memberof AppTheme
+     */
+    defaultThemes: Array<any> = [
+        {
+            tag: 'app-default-theme',
+            title: 'light',
+            color: '#f6f6f6',
+        },
+        {
+            title: 'Blue',
+            tag: 'app_theme_blue',
+            color: '#6ba1d1'
+        },
+        {
+            title: 'Dark Blue',
+            tag: 'app_theme_darkblue',
+            color: '#606d80'
+        }
+    ];
+
+    /**
+     * 所选择的字体
+     *
+     * @type {*}
+     * @memberof AppTheme
+     */
+    public selectFont: any = '';
+
+    /**
+     * 字体集合
+     *
+     * @memberof AppTheme
+     */
+    public fontFamilys = [
+        {
+            label: 'MicrosoftYaHei',
+            value: 'Microsoft YaHei',
+        },
+        {
+            label: 'SimHei',
+            value: 'SimHei',
+        },
+        {
+            label: 'YouYuan',
+            value: 'YouYuan',
+        },
+    ];
+
+    /**
+     * 挂载元素事件
+     *
+     * @memberof AppTheme
+     */
+    public mounted() {
+        if (localStorage.getItem('theme-class')) {
+            this.selectTheme = localStorage.getItem('theme-class');
+        } else {
+            this.selectTheme = 'app-default-theme';
+        }
+        if (localStorage.getItem('font-family')) {
+            this.selectFont = localStorage.getItem('font-family');
+        } else {
+            this.selectFont = 'Microsoft YaHei';
+        }
+    }
+
+    /**
+     * 主题变化
+     *
+     * @param {*} val
+     * @memberof AppTheme
+     */
+    public themeChange(val: any) {
+        if (!Object.is(this.activeTheme, val)) {
+            this.selectTheme = val;
+            localStorage.setItem('theme-class', val);
+            this.$router.app.$store.commit('setCurrentSelectTheme', val);
+        }
+    }
+
+    /**
+     * 字体变化
+     *
+     * @param {*} val
+     * @memberof AppTheme
+     */
+    public fontChange(val: any) {
+        if (!Object.is(this.selectFont, val)) {
+            this.selectFont = val;
+            localStorage.setItem('font-family', val);
+            this.$router.app.$store.commit('setCurrentSelectFont', val);
+        }
+    }
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof AppTheme
+     */
+    public render() {
+        return (
+            <div class='app-theme'>
+                <poptip
+                    title={this.$t('caption.theme')}
+                    popper-class='app-app-theme'
+                    placement='bottom-end'
+                    width={Object.is(this.$i18n.locale, 'zh-CN') ? 180 : 240}>
+                    <a>
+                        <icon class='app-theme-icon' type='md-settings' size={22} />
+                    </a>
+                    <template slot='content'>
+                        <div class='app-theme-color'>
+                            {
+                                this.defaultThemes.map((theme: any, index: any) => {
+                                    return (
+                                        <tooltip content={theme.title}>
+                                            <div
+                                                key={index}
+                                                class={{ 'active': this.selectTheme == theme.tag, 'app-theme-item': true }}
+                                                style={{ 'background': theme.color }}
+                                                on-click={() => { this.themeChange(theme.tag) }}>
+                                            </div>
+                                        </tooltip>
+                                    );
+                                })
+                            }
+                        </div>
+                        <div>
+                            <i-form label-position='left'>
+                                <form-item label={this.$t('caption.font')}>
+                                    <i-select
+                                        value={this.selectFont}
+                                        size='small'
+                                        style={{ width: Object.is(this.$i18n.locale, 'zh-CN') ? '100px' : '130px' }}
+                                        on-on-change={this.fontChange}
+                                        transfer>
+                                        {
+                                            this.fontFamilys.map((font: any) => {
+                                                return (
+                                                    <i-option
+                                                        value={font.value}
+                                                        key={font.value}>
+                                                        {this.$t(`fontFamilys.${font.label}`)}
+                                                    </i-option>
+                                                );
+                                            })
+                                        }
+                                    </i-select>
+                                </form-item>
+                            </i-form>
+                        </div>
+                    </template>
+                </poptip>
+            </div>
+        );
+    }
+
+}
\ No newline at end of file

src/components/app-tree/app-tree.less

+.ibiz-tree {
+
+    .ibiz-tree-node {
+        width: 100%;
+        display: flex;
+
+        .ibiz-tree-node-buttons {
+            margin-left: 30px;
+            display: none;
+
+            .button-item {
+                padding: 0px 3px;
+            }
+        }
+    }
+
+    .ibiz-tree-node:hover {
+
+        .ibiz-tree-node-buttons {
+            display: flex;
+        }
+    }
+}
\ No newline at end of file

src/components/app-tree/app-tree.tsx

+import { Vue, Component, Provide } from 'vue-property-decorator';
+import './app-tree.less';
+
+@Component({})
+export default class AppTree extends Vue {
+    @Provide()
+    public name: string = '右键菜单';
+    @Provide()
+    public nodes: any[] = [];
+    @Provide()
+    public centerDialogVisible: boolean = false;
+    @Provide()
+    public tree: any;
+
+    public setUp(message: string) {
+        // this.$message({
+        //     message
+        // });
+    }
+    
+    public addNodes(node: any) {
+        const nodes = [];
+        for (let i = 0; i < 10; i++) {
+            nodes.push({
+                id: `${node.id}-${i}`,
+                label: `标题：${node.label}-${i}`
+            });
+        }
+        return nodes;
+    }
+
+    public addChildNode(node: any) {
+        if (this.tree) {
+            const nodes = this.addNodes(node);
+            nodes.forEach((data) => {
+                this.tree.append(data, node);
+            });
+        }
+    }
+    
+    public renderContent(h: any, context: any) {
+        const { node } = context;
+        return (
+            <context-menu contextMenuStyle={{ width: '100%' }} data={{ name: '右键菜单' }} renderContent={this.renderContextMenu}>
+                <div class='ibiz-tree-node'>
+                    <label>{node.label}</label>
+                    <div class='ibiz-tree-node-buttons'>
+                        <div class='button-item'>
+                            <el-popover placement='right'>
+                                {this.renderPopoverContent()}
+                                <span slot='reference' on-click={() => this.addChildNode(node)}><i class='el-icon-plus'></i></span>
+                            </el-popover>
+                        </div>
+                        <div class='button-item'>
+                            <span on-click={() => this.setUp('设置')}><i class='el-icon-setting'></i></span>
+                        </div>
+                    </div>
+                </div>
+            </context-menu>
+        );
+    }
+
+    public renderPopoverContent() {
+        return <h1>内容</h1>;
+    }
+
+    public lodeChildNodes(node: any, resolve: any) {
+        if (node.level === 0) {
+            const nodes = [];
+            for (let i = 0; i < 10; i++) {
+                nodes.push({
+                    id: `${i}`,
+                    label: `标题：${i}`
+                });
+            }
+            this.nodes = nodes;
+        } else {
+            setTimeout(() => {
+                resolve(this.addNodes(node));
+            }, 1000);
+        }
+    }
+
+    // 绘制右击菜单
+    public renderContextMenu(data: any) {
+        return <el-button on-click={() => this.setUp('右键菜单')}>{data.name}</el-button>;
+    }
+
+    public mounted() {
+        this.tree = this.$refs.tree;
+    }
+
+    public render() {
+        return (
+            <context-menu-container>
+                <el-tree
+                    ref='tree'
+                    class='ibiz-tree'
+                    data={this.nodes}
+                    node-key='id'
+                    default-expand-all={false}
+                    expand-on-click-node={false}
+                    lazy
+                    load={this.lodeChildNodes}
+                    render-content={this.renderContent}>
+                </el-tree>
+            </context-menu-container >
+        );
+    }
+}
\ No newline at end of file

src/components/app-user/app-user.less

+.app-header-user {
+    .user {
+        font-size: 15px;
+        cursor: pointer;
+        margin-right: 10px;
+        padding: 0 5px;
+    }
+}
\ No newline at end of file

src/components/app-user/app-user.tsx

+import { Vue, Component } from 'vue-property-decorator';
+import { Environment } from '@/environments/environment';
+import './app-user.less';
+
+@Component({
+    i18n: {
+        messages: {
+            'zh-CN': {
+                user: {
+                    name: '匿名访问',
+                    logout: '退出登陆',
+                    surelogout: '确认要退出登陆？',
+                }
+            },
+            'en-US': {
+                user: {
+                    name: 'Anonymous access',
+                    logout: 'Logout',
+                    surelogout: 'Are you sure logout?',
+                }
+            }
+        }
+    }
+})
+export default class AppUser extends Vue {
+
+    /**
+     * 用户信息 
+     *
+     * @memberof AppUser
+     */
+    public user = {
+        name: 'user.name',
+        avatar: './assets/img/avatar.png',
+    }
+
+    /**
+     * 下拉选选中回调
+     *
+     * @param {*} data
+     * @memberof AppUser
+     */
+    public userSelect(data: any) {
+        if (Object.is(data, 'logout')) {
+            const title: any = this.$t('user.surelogout');
+            this.$Modal.confirm({
+                title: title,
+                onOk: () => {
+                    this.logout();
+                }
+            });
+        }
+    }
+
+    /**
+     * vue  生命周期
+     *
+     * @memberof AppUser
+     */
+    public mounted() {
+        if (window.localStorage.getItem('user')) {
+            const _user: any = window.localStorage.getItem('user') ? window.localStorage.getItem('user') : '';
+            const user = JSON.parse(_user);
+            Object.assign(this.user, user, {
+                time: +new Date
+            });
+        }
+    }
+
+    /**
+     * 退出登录
+     *
+     * @memberof AppUser
+     */
+    public logout() {
+        localStorage.removeItem('user');
+        localStorage.removeItem('token');
+        this.$router.push({ name: 'login' });
+    }
+
+    /**
+     * 渲染组件
+     *
+     * @returns
+     * @memberof AppUser
+     */
+    public render() {
+        return (
+            <div class='app-header-user'>
+                <dropdown on-on-click={this.userSelect} transfer={true}>
+                    <div class='user'>
+                        <span>{this.$t('user.name')}</span>
+                        &nbsp;&nbsp;<avatar src={this.user.avatar} />
+                    </div>
+                    <dropdown-menu class='menu' slot='list' style='font-size: 15px !important;'>
+                        <dropdown-item name='logout' style='font-size: 15px !important;'>
+                            <span><i aria-hidden='true' class='fa fa-cogs' style='margin-right: 8px;'></i></span>
+                            <span>{this.$t('user.logout')}</span>
+                        </dropdown-item>
+                    </dropdown-menu>
+                </dropdown>
+            </div>
+        )
+    }
+}
\ No newline at end of file

src/components/context-menu-container/context-menu-container.tsx

+class ContextMenuContainerService {
+    // 是否屏蔽浏览器右键单机
+    public __isShielding = false;
+
+    constructor() {
+        document.oncontextmenu = () => {
+            return !this.__isShielding;
+        };
+    }
+
+    public enableShielding() {
+        this.__isShielding = true;
+    }
+
+    public notEnableShielding() {
+        this.__isShielding = false;
+    }
+}
+
+const service = new ContextMenuContainerService();
+
+import { Vue, Component, Provide } from 'vue-property-decorator';
+
+// tslint:disable-next-line:max-classes-per-file
+@Component({})
+export default class ContextMenuContainer extends Vue {
+    @Provide()
+    public isShielding: boolean = false;
+
+    public mounted() {
+        const container: any = this.$refs.container;
+        // 鼠标移入
+        container.onmouseover = () => {
+            service.enableShielding();
+        };
+        // 鼠标移出
+        container.onmouseout = () => {
+            service.notEnableShielding();
+        };
+    }
+
+    public render() {
+        return <div class='context-menu-container' ref='container'>
+            {this.$slots.default}
+        </div>;
+    }
+}
\ No newline at end of file

src/components/context-menu/context-menu.less

+.context-menu-container {
+    // width: 100vw;
+    // height: 100vh;
+    // z-index: -10000;
+    // position: absolute;
+    // top: 0;
+    // left: 0;
+    line-height: 1;
+
+    .context-menu-content {
+        z-index: 10001;
+        position: absolute;
+        background: #FFF;
+        // border: 1px solid #e3e3e3;
+    }
+
+    .context-menus {
+
+        .context-menus-item {
+            list-style: none;
+            line-height: 36px;
+            padding: 0 13px;
+            margin: 0;
+            font-size: 14px;
+            color: #606266;
+            cursor: pointer;
+            outline: none;
+            display: flex;
+    
+            .icon {
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                font-size: 16px;
+                width: 20px;
+                margin-right: 8px;
+            }
+        }
+    
+        .context-menus-item:hover {
+            background-color: #ecf5ff;
+            color: #66b1ff;
+        }
+    }
+}
+.context-menu {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+}
\ No newline at end of file

src/components/context-menu/context-menu.tsx

+class ContextMenuService {
+    /**
+     * 容器Dom对象
+     *
+     * @private
+     * @memberof ContextMenuService
+     */
+    private container: Element | undefined;
+
+    /**
+     * Creates an instance of ContextMenuService.
+     * @memberof ContextMenuService
+     */
+    constructor() {
+        document.addEventListener('click', () => {
+            this.clearContainer();
+        });
+    }
+
+    /**
+     * 设置容器
+     *
+     * @param {Element} container
+     * @memberof ContextMenuService
+     */
+    public setContainer(container: Element) {
+        if (container) {
+            this.clearContainer();
+            this.container = container;
+        } else {
+            console.error('容器Dom节点不存在');
+        }
+    }
+
+    /**
+     * 清楚容器
+     *
+     * @memberof ContextMenuService
+     */
+    public clearContainer() {
+        if (this.container) {
+            this.container.remove();
+        }
+    }
+
+}
+
+const service = new ContextMenuService();
+
+import { Vue, Component, Provide, Prop, Emit } from 'vue-property-decorator';
+import './context-menu.less';
+
+// tslint:disable-next-line:max-classes-per-file
+@Component({})
+export default class ContextMenu extends Vue {
+    /**
+     * 设置右键菜单Class
+     *
+     * @type {string}
+     * @memberof ContextMenu
+     */
+    @Prop()
+    public contextMenuClass?: string;
+    /**
+     * 设置右键菜单Style
+     *
+     * @type {*}
+     * @memberof ContextMenu
+     */
+    @Prop()
+    public contextMenuStyle?: any;
+    /**
+     * 右键菜单数据，在调用renderContent时会传回去。
+     *
+     * @type {*}
+     * @memberof ContextMenu
+     */
+    @Prop()
+    public data?: any;
+    /**
+     * 用于绘制右键菜单内容
+     *
+     * @type {any}
+     * @memberof ContextMenu
+     */
+    @Prop()
+    public renderContent?: any;
+    /**
+     * 菜单数据
+     *
+     * @type {any[]}
+     * @memberof ContextMenu
+     */
+    @Prop()
+    public menus?: any[]
+
+    /**
+     * 显示右键菜单
+     *
+     * @param {*} x x轴坐标
+     * @param {*} y y轴坐标
+     */
+    public showContextMenu(x: number, y: number) {
+        // 创建全屏覆盖容器
+        const container = document.createElement('div');
+        service.setContainer(container);
+        container.oncontextmenu = () => {
+            container.remove();
+        };
+        document.body.appendChild(container);
+        // 创建Vue实例挂载
+        const mount = document.createElement('div');
+        container.appendChild(mount);
+        this.renderContextMenu({
+            top: y + 'px',
+            left: x + 'px'
+        }, mount, container);
+    }
+
+    /**
+     * 绘制菜单
+     *
+     * @param {*} position 菜单显示位置
+     * @param {*} mount Vue实例挂载
+     * @param {*} container 容器
+     * @returns
+     */
+    public renderContextMenu(position: any, mount: any, container: any) {
+        const self = this;
+        new Vue({
+            data() {
+                return {
+                    menus: self.menus
+                };
+            },
+            methods: {
+                destroy($event: Event) {
+                    container.remove();
+                    this.$destroy();
+                    $event.stopPropagation();
+                },
+                onContextMenu($event: any) {
+                    $event.preventDefault();
+                },
+                renderContent() {
+                    let menus;
+                    if (this.menus) {
+                        menus = this.menus.map((item) => {
+                            let icon;
+                            if (item.icon) {
+                                icon = <img src={item.icon} />;
+                            }
+                            if (item.iconcls) {
+                                icon = <i class={item.iconcls}></i>;
+                            }
+                            return (
+                                <li class='context-menus-item' on-click={() => self.menuClick(item, self.data)}>
+                                    {icon ? <div class="icon">{icon}</div> : null}
+                                    <div class="text">{item.text}</div>
+                                </li>
+                            );
+                        });
+                    }
+                    return <ul class='context-menus'>{menus}</ul>;
+                }
+            },
+            render() {
+                let content;
+                if (self.renderContent) {
+                    content = self.renderContent(self.data);
+                }
+                if (self.$slots.content) {
+                    content = self.$slots.content;
+                }
+                if (this.menus) {
+                    content = this.renderContent();
+                }
+                return (
+                    <div class='context-menu-container context-menu' on-contextmenu={($event: any) => this.onContextMenu($event)} on-click={($event: Event) => this.destroy($event)}>
+                        <div class='context-menu-content' style={position}>
+                            {content}
+                        </div>
+                    </div>
+                );
+            }
+        }).$mount(mount);
+    }
+
+    /**
+     * 组件挂在完毕
+     *
+     * @memberof ContextMenu
+     */
+    public mounted() {
+        const contextRef: any = this.$refs.context;
+        if (contextRef) {
+            contextRef.oncontextmenu = (event: MouseEvent) => {
+                event.preventDefault();
+                this.showContextMenu(event.clientX, event.clientY);
+            };
+        }
+    }
+
+    /**
+     * 菜单点击
+     *
+     * @param {*} data
+     * @memberof ContextMenu
+     */
+    @Emit('menu-click')
+    public menuClick(item: any, data: any) { }
+
+    /**
+     * 绘制内容
+     *
+     * @returns
+     * @memberof ContextMenu
+     */
+    public render() {
+        return (
+            <div class={'context-menu-component ' + this.contextMenuClass} style={this.contextMenuStyle} ref='context'>
+                {this.$slots.default}
+            </div>
+        );
+    }
+
+}
\ No newline at end of file

src/components/dropdown-list/dropdown-list.less

+.dropdown-list{
+
+}
+

src/components/dropdown-list/dropdown-list.tsx

+import { Vue, Component, Prop, Model } from 'vue-property-decorator';
+import './dropdown-list.less';
+
+@Component({})
+export default class DropDownList extends Vue {
+
+    /**
+     * 当前选中值
+     * @type {any}
+     * @memberof SelectPicker
+     */
+    @Model('change') readonly itemValue!: any;
+
+    /**
+     * 代码表标识
+     *
+     * @type {string}
+     * @memberof DropDownList
+     */
+    @Prop() public tag?: string;
+
+    /**
+     * 是否禁用
+     * @type {any}
+     * @memberof SelectPicker
+     * 
+     */
+    @Prop() public disabled?: any;
+
+    /**
+     * 是否支持过滤
+     * @type {boolean}
+     * @memberof SelectPicker
+     */
+    @Prop() public filterable?: boolean;
+
+    /**
+     * 下拉选提示内容
+     * @type {string}
+     * @memberof SelectPicker
+     */
+    @Prop() public placeholder?: string;
+
+    /**
+     * 计算属性(当前值)
+     * @type {any}
+     * @memberof SelectPicker
+     */
+    set currentVal(val: any) {
+        const type: string = this.$util.typeOf(val);
+        val = Object.is(type, 'null') || Object.is(type, 'undefined') ? undefined : val;
+        this.$emit('change', val);
+    }
+
+    /**
+     * 获取值对象
+     *
+     * @memberof DropDownList
+     */
+    get currentVal() {
+        return this.itemValue;
+    }
+
+    /**
+     * 代码表
+     *
+     * @type {any[]}
+     * @memberof DropDownList
+     */
+    public items: any[] = [];
+
+    /**
+     * vue  生命周期
+     *
+     * @memberof DropDownList
+     */
+    public created() {
+        const codelist = this.$store.getters.getCodeList(this.tag);
+        if (codelist) {
+            this.items = [...JSON.parse(JSON.stringify(codelist.items))];
+        } else {
+            console.log(`----${this.tag}----代码表不存在`);
+        }
+    }
+
+    /**
+     * 渲染组件
+     *
+     * @returns
+     * @memberof DropDownList
+     */
+    public render() {
+        return (
+            <i-select
+                class='dropdown-list'
+                transfer={true}
+                v-model={this.currentVal}
+                disabled={this.disabled === true ? true : false}
+                clearable={true}
+                filterable={this.filterable === true ? true : false}
+                placeholder={this.placeholder ? this.placeholder : '请选择'}>
+                {
+                    this.items.map((item: any) => {
+                        return <i-option value={item.value}>{item.text}</i-option>
+                    })
+                }
+            </i-select>
+        );
+    }
+}
\ No newline at end of file

src/components/input-box/input-box.less

+.input-box{
+
+}

src/components/input-box/input-box.tsx

+import { Vue, Component, Prop, Model, Emit } from 'vue-property-decorator';
+import './input-box.less';
+import { Subject } from 'rxjs';
+import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
+
+@Component({})
+export default class InputBox extends Vue {
+
+    /**
+     * 双向绑定值
+     * @type {any}
+     * @memberof InputBox
+     */
+    @Model('change') readonly itemValue?: any;
+
+    /**
+     * placeholder值
+     * @type {String}
+     * @memberof InputBox
+     */
+    @Prop() public placeholder?: string;
+
+    /**
+     * 是否禁用
+     * @type {boolean}
+     * @memberof InputBox
+     */
+    @Prop() public disabled?: boolean;
+
+    /**
+     * 属性类型
+     *
+     * @type {string}
+     * @memberof InputBox
+     */
+    @Prop() public type?: string;
+
+    /**
+     * 当前值
+     *
+     * @memberof InputBox
+     */
+    get CurrentVal() {
+        return this.itemValue;
+    }
+
+    /**
+     * 值变化
+     *
+     * @memberof InputBox
+     */
+    set CurrentVal(val: any) {
+        let _data: any = val;
+        if (Object.is(this.type, 'number') && val && !isNaN(val)) {
+            try {
+                _data = isNaN(parseInt(val, 10)) ? null : parseInt(val, 10);
+            } catch (error) {
+            }
+        }
+        if (Object.is(_data, '')) {
+            _data = null;
+        }
+        this.$emit('change', _data);
+    }
+
+    /**
+     * 回车事件
+     *
+     * @param {*} $event
+     * @memberof InputBox
+     */
+    @Emit()
+    public enter($event: any) {
+        if (!$event || $event.keyCode !== 13) {
+            return;
+        }
+        return $event;
+    }
+
+    /**
+     * 渲染组件
+     *
+     * @returns
+     * @memberof InputBox
+     */
+    public render() {
+        return (
+            <i-input
+                placeholder={this.placeholder}
+                v-model={this.CurrentVal}
+                disabled={this.disabled ? true : false}
+                on-on-enter={($event: any) => this.enter($event)}>
+            </i-input>
+        );
+    }
+}
\ No newline at end of file

src/components/login/login.less

+.login{
+    width: 100vh;
+    height: 100vh;
+    // background-image: url('../assets/images/login_bg.jpg');
+    background-size: cover;
+    background-position: center;
+    position: relative;
+    &-con{
+        position: fixed;
+        right: 160px;
+        top: 50%;
+        transform: translateY(-60%);
+        width: 300px;
+        &-header{
+            font-size: 16px;
+            font-weight: 300;
+            text-align: center;
+            padding: 30px 0;
+        }
+        .form-con{
+            padding: 10px 0 0;
+        }
+        .login-tip{
+            font-size: 10px;
+            text-align: center;
+            color: #c3c3c3;
+        }
+    }
+}
\ No newline at end of file

src/components/login/login.tsx

+import { Vue, Component } from 'vue-property-decorator';
+import './login.less';
+import { Environment } from '@/environments/environment';
+
+@Component({
+    i18n: {
+        messages: {
+            'zh-CN': {
+                login: {
+                    caption: '欢迎登录',
+                    name: '登录',
+                    tip: '输入用户名和密码',
+                    loginname: {
+                        placeholder: '请输入用户名',
+                        message: '用户名不能为空',
+                    },
+                    password: {
+                        placeholder: '请输入密码',
+                        message: '密码不能为空',
+                    },
+                    loginfailed: '登陆失败',
+                },
+            },
+            'en-US': {
+                login: {
+                    caption: 'Welcome to login',
+                    name: 'Login',
+                    tip: 'Enter username and password',
+                    loginname: {
+                        placeholder: 'Username',
+                        message: 'The username cannot be empty',
+                    },
+                    password: {
+                        placeholder: 'Password',
+                        message: 'The password cannot be empty',
+                    },
+                    loginfailed: 'Login failed'
+                },
+            }
+        }
+    }
+})
+export default class Login extends Vue {
+
+    /**
+     * 表单对象
+     *
+     * @type {*}
+     * @memberof Login
+     */
+    public form: any = { loginname: null, password: null };
+
+    /**
+     * 值规则
+     *
+     * @type {*}
+     * @memberof Login
+     */
+    public rules: any = {
+        loginname: [
+            { required: true, message: '用户名不能为空', trigger: 'change' },
+        ],
+        password: [
+            { required: true, message: '密码不能为空', trigger: 'change' },
+        ],
+    };
+
+    /**
+     * 登陆处理
+     *
+     * @memberof Login
+     */
+    public handleSubmit(): void {
+        const form: any = this.$refs.loginForm;
+        let validatestate: boolean = true;
+        form.validate((valid: boolean) => {
+            validatestate = valid ? true : false;
+        });
+        if (!validatestate) {
+            return;
+        }
+        const post: Promise<any> = this.$http.post(Environment.RemoteLogin, this.form, true);
+        post.then((response: any) => {
+            if (response && response.status === 200) {
+                const data = response.data;
+                localStorage.setItem('token', data.token);
+                localStorage.setItem('user', JSON.stringify(data.user));
+                const url: any = this.$route.query.redirect ? this.$route.query.redirect : '*';
+                this.$router.push({ path: url });
+            }
+        }).catch((error: any) => {
+            const loginfailed: any = this.$t('login.loginfailed');
+            this.$Notice.error({ title: '错误', desc: loginfailed });
+        });
+
+    }
+
+    /**
+     * 内容绘制
+     *
+     * @returns
+     * @memberof Login
+     */
+    public render() {
+        return (
+            <div class='login'>
+                <div class='login-con'>
+                    <card bordered={false}>
+                        <p slot='title'>
+                            <icon type='ios-log-in'></icon>
+                            &nbsp;&nbsp;{this.$t('login.caption')}
+                        </p>
+                        <div class='form-con'>
+                            <i-form ref='loginForm' props={{ model: this.form, rules: this.rules }}>
+                                <form-item prop={'loginname'}>
+                                    <i-input
+                                        prefix={'ios-contact'}
+                                        v-model={this.form.loginname}
+                                        placeholder={this.$t('login.loginname.placeholder')}>
+                                    </i-input>
+                                </form-item>
+                                <form-item prop={'password'}>
+                                    <i-input
+                                        prefix={'ios-key'}
+                                        v-model={this.form.password}
+                                        type='password'
+                                        placeholder={this.$t('login.password.placeholder')}>
+                                    </i-input>
+                                </form-item>
+                                <form-item>
+                                    <i-button
+                                        on-click={this.handleSubmit}
+                                        type='primary'
+                                        long>
+                                        {this.$t('login.name')}
+                                    </i-button>
+                                </form-item>
+                            </i-form>
+                            <p class='login-tip'>
+                                {this.$t('login.tip')}
+                            </p>
+                        </div>
+                    </card>
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file

src/components/property-layout/property-layout.less

+.left-and-right {
+    display: flex;
+    height: 100%;
+    > div {
+        height: 100%;
+        padding: 0 16px;
+    }
+    > div:nth-child(1) {
+        flex-grow: 1;
+        padding-left: 0;
+        border-right: 1px solid var(--app-border-content);
+        display: flex;
+        flex-direction: column;
+    }
+}
+.top-and-bottom {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    > div:nth-child(1) {
+        flex-grow: 1;
+        display: flex;
+        flex-direction: column;
+    }
+}
\ No newline at end of file

src/components/property-layout/property-layout.tsx

+import { Vue, Component, Prop, Provide, Emit, Watch } from 'vue-property-decorator';
+import './property-layout.less';
+
+@Component({})
+export default class PropertyLayout extends Vue {
+
+    @Prop()
+    public propertyType?: string;
+    @Prop()
+    public width?: string;
+    @Prop()
+    public height?: string;
+
+
+    public render() {
+        let className = 'top-and-bottom';
+        let style: any = {};
+        style.minWidth = this.width ? this.width + 'px' : '';
+        style.maxWidth = this.width ? this.width + 'px' : '';
+        style.minHeight = this.height ? this.height + 'px' : '';
+        style.maxHeight = this.height ? this.height + 'px' : '';
+        if(Object.is(this.propertyType, 'RIGHT')) {
+            className = 'left-and-right';
+        }
+        return (
+            <div class={className}>
+                <div>
+                    {this.$slots.default}
+                </div>
+                <div style={style}>
+                    {this.$slots.propertypanel}
+                </div>
+            </div>
+        );
+    }
+}
\ No newline at end of file

src/components/tab-page-exp/tab-page-exp.less

+.ibiz-page-tag {
+    position: relative;
+    box-sizing: border-box;
+    // width: calc(100% + 30px);
+    height: 38px;
+    padding: 0 60px 0 30px;
+    background: #f6f6f6;
+    .tags-body {
+        position: relative;
+        width: 100%;
+        height: 100%;
+        overflow: hidden;
+        .tags-container {
+            position: absolute;
+            overflow: visible;
+            white-space: nowrap;
+            transition: left .3s ease;
+            .ivu-tag {
+                margin: 0;
+                height: 38px;
+                line-height: 38px;
+                border: 0;
+                border-radius: 0;
+                border-right: 1px solid #ddd;
+                font-size: 14px;
+                .text-icon {
+                    height: 16px;
+                    margin-bottom: -3px;
+                }
+                .ivu-icon-ios-close {
+                    visibility: hidden;
+                }
+                .tag-text {
+                    display: table-cell;
+                    .ivu-tooltip {
+                        display: block;
+                        .ivu-tooltip-rel {
+                            display: block;
+                            max-width: 200px;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                        }
+                    }
+                }
+            }
+            .ivu-tag.tag-is-active {
+                background: #fff;
+            }
+            .ivu-tag:hover,.ivu-tag.tag-is-active {
+                .ivu-icon-ios-close {
+                    visibility: initial;
+                }
+            }
+        }
+    }
+    .move-btn {
+        font-size: 18px;
+        width: 30px;
+        height: 38px;
+        line-height: 38px;
+        border-left: 1px solid #ddd;
+        border-right: 1px solid #ddd;
+        text-align: center;
+        cursor: pointer;
+    }
+    .move-btn:hover {
+        background: #efefef;
+    }
+    .move-left, .move-right, .ivu-dropdown{
+        position: absolute;
+        top: 0;
+    }
+    .move-left {
+        left: 0;
+    }
+    .move-right {
+        right: 30px;
+    }
+    .ivu-dropdown {
+        right: 0;
+    }
+}
+.tags-transition-move {
+    transition: transform .3s;
+}
+.tags-transition-enter,.tags-transition-leave-to{
+    opacity: 0;
+}
\ No newline at end of file

src/components/tab-page-exp/tab-page-exp.vue

+<template>
+    <div class="ibiz-page-tag" v-if="$store.state.pageMetas.length > 0">
+        <div class="move-btn move-left" @click="leftMove">
+            <icon type="ios-arrow-back" />
+        </div>
+        <div ref="scrollBody" class="tags-body">
+            <div ref="scrollChild" class="tags-container" :style="{left: styleLeft + 'px'}">
+                <transition-group name="tags-transition">
+                    <template v-for="(meta, index) of $store.state.pageMetas">
+                        <Tag ref="tagElement" :key="index" :class="isActive(index) ? 'tag-is-active' : ''" :name="index" closable @click.native="changePage(index)" @on-close="onClose(index)">
+                            <div class="tag-text">
+                                <tooltip  :content="getCaption(meta.caption, meta.info)" transfer :max-width="300">
+                                    <i v-if="meta.iconCls && !Object.is(meta.iconCls, '')" :class="meta.iconCls"></i>
+                                    <img v-else :src="meta.imgPath" class="text-icon" />
+                                    &nbsp;{{getCaption(meta.caption, meta.info)}}
+                                </tooltip>
+                            </div>
+                        </Tag>
+                    </template>
+                </transition-group>
+            </div>
+        </div>
+        <div class="move-btn move-right" @click="rightMove">
+            <icon type="ios-arrow-forward" />
+        </div>
+        <Dropdown @on-click="doTagAction" placement="bottom-end">
+            <div class="move-btn">
+                <icon type="ios-close-circle-outline" />
+            </div>
+            <DropdownMenu slot="list">
+                <template v-for="(action, index) of actions">
+                    <DropdownItem :key="index" :name="action.value">{{$t(action.text)}}</DropdownItem>
+                </template>
+            </DropdownMenu>
+        </Dropdown >
+    </div >
+</template>
+
+<script lang="ts">
+import { Vue, Component, Provide, Prop, Watch } from 'vue-property-decorator';
+import { Environment } from '../../environments/environment';
+
+@Component({})
+export default class TabPageExp extends Vue {
+    @Provide()
+    public styleLeft: number = 0;
+
+    @Provide()
+    public actions: any[] = [{ text: 'app.tabpage.closeall', value: 'closeAll' }, { text: 'app.tabpage.closeother', value: 'closeOther' }];
+
+    @Watch("$route")
+    public onRouteChange(newVal: any) {
+        this.moveToView(newVal);
+        this.$emit('change', newVal);
+    }
+
+    public created() {
+        Vue.prototype.$tabPageExp = this;
+    }
+
+    public getCaption(caption: any, info: any):any {
+        return  info && !Object.is(info, '') ? `${this.$t(caption)} - ${info}` : this.$t(caption);
+    }
+
+    /**
+     * 向左移动
+     *
+     * @memberof TabPageExp
+     */
+    public leftMove() {
+        const scrollBody: any = this.$refs.scrollBody;
+        const scrollChild: any = this.$refs.scrollChild;
+        if (scrollBody && scrollChild && scrollChild.offsetWidth > scrollBody.offsetWidth) {
+            if ((scrollChild.offsetWidth - scrollBody.offsetWidth + this.styleLeft) > 100) {
+                this.styleLeft -= 100;
+            } else {
+                this.styleLeft = scrollBody.offsetWidth - scrollChild.offsetWidth;
+            }
+        }
+    }
+
+    /**
+     * 向右移动
+     *
+     * @memberof TabPageExp
+     */
+    public rightMove() {
+        if (this.styleLeft < 0) {
+            if (this.styleLeft + 100 > 0) {
+                this.styleLeft = 0;
+            } else {
+                this.styleLeft += 100;
+            }
+        }
+    }
+
+    /**
+     * 是否选中
+     *
+     * @param {(string | number)} index
+     * @returns
+     * @memberof TabPageExp
+     */
+    public isActive(index: string | number) {
+        const page = this.$store.state.pageTagList[index];
+        if (Object.is(page.fullPath, this.$route.fullPath)) {
+            return true;
+        }
+        return false;
+    }
+
+    /**
+     * 关闭
+     *
+     * @param {*} event
+     * @param {*} name
+     * @memberof TabPageExp
+     */
+    public onClose(name: any) {
+        const page = this.$store.getters.getPage(name);
+        if (!page) {
+            this.$store.commit("deletePage", name);
+            this.gotoPage();
+        }
+        const appview = this.$store.getters['viewaction/getAppView'](page.viewtag);
+        if (appview && appview.viewdatachange) {
+            const title: any = this.$t('app.tabpage.sureclosetip.title');
+            const content: any = this.$t('app.tabpage.sureclosetip.content');
+            this.$Modal.confirm({
+                title: title,
+                content: content,
+                onOk: () => {
+                    this.$store.commit("deletePage", name);
+                    this.gotoPage();
+                },
+                onCancel: () => {
+                }
+            });
+        } else {
+            this.$store.commit("deletePage", name);
+            this.gotoPage();
+        }
+    }
+
+    /**
+     * 是否显示关闭
+     *
+     * @returns
+     * @memberof TabPageExp
+     */
+    public isClose() {
+        const pageTagList = this.$store.state.pageTagList;
+        if (pageTagList.length > 1) {
+            return true;
+        }
+        return false;
+    }
+
+    /**
+     * 切换分页
+     *
+     * @param {*} index
+     * @memberof TabPageExp
+     */
+    public changePage(index: any) {
+        this.$store.commit("setCurPage", index);
+        this.gotoPage();
+    }
+
+    /**
+     * 跳转页面
+     *
+     * @returns
+     * @memberof TabPageExp
+     */
+    public gotoPage() {
+        const length = this.$store.state.historyPathList.length;
+        if (length > 0) {
+            const path = this.$store.state.historyPathList[length - 1];
+            if (Object.is(path, this.$route.fullPath)) {
+                return;
+            }
+            const index = this.$store.state.pageTagList.findIndex((page: any) => Object.is(page.fullPath, path));
+            if (index >= 0) {
+                const page = this.$store.state.pageTagList[index];
+                this.$router.push({ path: page.path, params: page.params, query: page.query });
+            }
+        } else {
+            let path: string | null = window.sessionStorage.getItem(Environment.AppName);
+            if(path) {
+                this.$router.push({path: path});
+            } else {
+                this.$router.push('/');
+            }
+        }
+    }
+
+    /**
+     * 设置当前页标题
+     *
+     * @param {*} caption
+     * @memberof TabPageExp
+     */
+    public setCurPageCaption(routename: string, caption: any, info: string) {
+        if(!Object.is(this.$route.name, routename)) {
+            return;
+        }
+        this.$store.commit("setCurPageCaption", { route: this.$route, caption: caption, info: info });
+        setTimeout(() => {
+            this.moveToView(this.$route);
+        }, 1);
+    }
+
+    /**
+     * 移动至指定页面标签
+     *
+     * @param {*} to
+     * @memberof TabPageExp
+     */
+    public moveToView(to: any) {
+        const pages: any[] = this.$store.state.pageTagList;
+        let leftWidth: number = 0;
+        this.$nextTick(() => {
+            pages.forEach((page, index) => {
+                const tag: any = this.$refs.tagElement;
+                if (!tag) {
+                    return ;
+                }
+                const el = tag[index].$el;
+                if (Object.is(page.fullPath, to.fullPath)) {
+                    this.setLeft(el, leftWidth);
+                } else {
+                    leftWidth += el.offsetWidth;
+                }
+            });
+        });
+    }
+
+    /**
+     * 设置左侧边距
+     *
+     * @param {{ offsetWidth: number; }} tag
+     * @param {number} leftWidth
+     * @memberof TabPageExp
+     */
+    public setLeft(tag: { offsetWidth: number; }, leftWidth: number) {
+        if (tag) {
+            const scrollBody: any = this.$refs.scrollBody;
+            if (leftWidth < -this.styleLeft) {
+                this.styleLeft = -leftWidth;
+            } else if ((leftWidth + tag.offsetWidth) > (scrollBody.offsetWidth - this.styleLeft)) {
+                this.styleLeft -= (leftWidth + tag.offsetWidth) - (scrollBody.offsetWidth - this.styleLeft);
+            }
+        }
+    }
+
+    /**
+     * 执行行为操作
+     *
+     * @param {string} name
+     * @memberof TabPageExp
+     */
+    public doTagAction(name: string) {
+        if (Object.is(name, 'closeAll')) {
+            this.$store.commit("removeAllPage");
+            this.gotoPage();
+        } else if (Object.is(name, 'closeOther')) {
+            this.$store.commit("removeOtherPage");
+            this.moveToView(this.$route);
+        }
+    }  
+}
+</script>
+
+<style lang="less">
+@import './tab-page-exp.less';
+</style>

src/components/upload-file/upload-file.less

+.upload-file{
+    width: 100%;
+    .ivu-upload{
+        height: 100%;
+        .ivu-upload .ivu-upload-drag{
+            height: 100%;
+        }
+        .ivu-upload-drag{
+            border-radius: 2px;
+            border:1px dashed #fff !important;
+        }
+        .ivu-upload-list{
+            margin: 0px;
+            // display: none !important;
+        }
+    }
+    .upload-text{
+        border:1px dashed rgb(125, 134, 148);
+        padding:12px 18px;
+        text-align: center;
+        color: rgb(141, 158, 167);
+        font-family: -apple-system, "SF UI Text", "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Zen Hei", sans-serif;
+        font-weight: 400;
+        font-size: 12px;
+        
+    }
+    .text-style{
+        cursor: pointer;
+        color: rgb(41, 141, 248);
+    }
+}
\ No newline at end of file

src/components/upload-file/upload-file.tsx

+import { Vue, Component, Prop, Emit } from 'vue-property-decorator';
+import './upload-file.less';
+
+@Component({})
+export default class UploadFile extends Vue {
+
+    /**
+     * 上传路径
+     * @type {any}
+     * @memberof UploadFile
+     */
+    public url: string = '//jsonplaceholder.typicode.com/posts/';
+
+    /**
+     * 设置上传的请求头部
+     * @type {Object}
+     * @memberof UploadFile
+     */
+    @Prop() public headers?: Object;
+
+    /**
+     * 是否支持多选文件
+     * @type {boolean}
+     * @memberof UploadFile
+     */
+    @Prop() public multiple?: boolean;
+
+    /**
+     * 是否支持粘贴上传文件
+     * @type {boolean}
+     * @memberof UploadFile 
+     */
+    @Prop() public paste?: boolean;
+
+    /**
+     * 是否禁用
+     * @type {boolean}
+     * @memberof UploadFile 
+     */
+    @Prop() public disabled?: boolean;
+
+    /**
+     * 上传时附带的额外参数
+     * @type {any}
+     * @memberof UploadFile 
+     */
+    @Prop() public data?: any;
+
+    /**
+     * 上传控件的类型，可选值为 select（点击选择），drag（支持拖拽）
+     * @type {any}
+     * @memberof UploadFile 
+     */
+    @Prop() public type?: any;
+
+    /**
+     * 是否显示已上传文件列表
+     * @type {boolean}
+     * @memberof UploadFile
+     */
+    @Prop() public showuploadlist?: boolean;
+
+    /**
+     * 接受上传的文件类型
+     * @type {string}
+     * @memberof UploadFile
+     */
+    @Prop() public accept?: string;
+
+    /**
+     * 支持的文件类型，与 accept 不同的是，format 是识别文件的后缀名，accept 为 input 标签原生的 accept 属性，
+     * 会在选择文件时过滤，可以两者结合使用
+     * @type {Array<any>}
+     * @memberof UploadFile
+     */
+    @Prop() public format?: Array<any>;
+
+    /**
+     * 文件大小限制，单位 kb
+     * @type {number}
+     * @memberof UploadFile
+     */
+    @Prop() public maxsize?: number;
+
+    /**
+     * 上传文件之前的钩子，参数为上传的文件，若返回 false 或者 Promise 则停止上传
+     */
+    @Emit()
+    public beforeupload(file:any) {
+        console.log('beforeupload---------'+file);
+    }
+
+    /**
+     * 文件上传成功时的钩子，返回字段为 response, file, fileList
+     */
+    @Emit()
+    public success(response: any, file: any, fileList: any) {
+        console.log('success---------' + file);
+    }
+
+    /**
+     * 文件上传时的钩子，返回字段为 event, file, fileList
+     */
+    @Emit()
+    public progress(event: any, file: any, fileList: any) {
+        console.log('progress---------' + file);
+    }
+
+    /**
+     * 文件上传失败时的钩子，返回字段为 error, file, fileList
+     */
+    @Emit()
+    public error(error: any, file: any, fileList: any) {
+        console.log('error---------' + file);
+    }
+
+    /**
+     * 文件列表移除文件时的钩子，返回字段为 file, fileList
+     */
+    @Emit()
+    public remove(file: any, fileList: any) {
+        console.log('remove---------' + file);
+    }
+
+    /**
+     * 文件格式验证失败时的钩子，返回字段为 file, fileList
+     */
+    @Emit()
+    public formaterror(file: any, fileList: any) {
+        console.log('formaterror---------' + file);
+    }
+
+    /**
+     * 文件超出指定大小限制时的钩子，返回字段为 file, fileList
+     */
+    @Emit()
+    public exceededsize(file: any, fileList: any) {
+        console.log('exceededsize---------' + file);
+    }
+
+    public render() {
+        return (<div class="upload-file">
+            <upload action={this.url} headers={this.headers ? this.headers : null}
+                multiple={this.multiple === true ? true : false} paste={this.paste === false ? false : true}
+                disabled={this.disabled === true ? true : false} data={this.data ? this.data : null}
+                type={this.type === 'select' ? 'select' : 'drag'} show-upload-list={this.showuploadlist === true ? true : false}
+                accept={this.accept ? this.accept : null} format={this.format ? this.format : []}
+                maxsize={this.maxsize ? this.maxsize : null} on-before-upload={this.beforeupload} on-success={this.success}
+                on-error={this.error} on-remove={this.remove} on-format-error={this.formaterror}
+                on-exceeded-size={this.exceededsize} on-progress={this.progress}>
+                <div class="upload-text">
+                    <p>将图片拖到这里替换</p>
+                    <p><span class="text-style">本地上传</span>或<span class="text-style">从素材库选择</span></p>
+                </div>
+            </upload>
+        </div>);
+    }
+}
\ No newline at end of file

src/engine/view/chart-view-engine.ts

+import { SearchViewEngine } from './search-view-engine';
+
+/**
+ * 实体图表视图界面引擎
+ *
+ * @export
+ * @class ChartViewEngine
+ * @extends {SearchViewEngine}
+ */
+export default class ChartViewEngine extends SearchViewEngine {
+
+    /**
+     * 图表对象
+     *
+     * @type {*}
+     * @memberof ChartViewEngine
+     */
+    public chart: any;
+
+    /**
+     * 图表初始化
+     *
+     * @param {*} options
+     * @memberof ChartViewEngine
+     */
+    public init(options: any): void {
+        this.chart = options.chart;
+        super.init(options);
+
+    }
+
+    /**
+     * 引擎加载
+     *
+     * @param {*} [opts={}]
+     * @memberof ChartViewEngine
+     */
+    public load(opts: any = {}): void {
+        super.load(opts);
+        const _srfparentdata = this.viewdata.srfparentdata ? { srfparentdata: this.viewdata.srfparentdata } : { srfparentdata: {} };
+        if (!this.getSearchForm() && this.isLoadDefault) {
+            const tag = this.getChart().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: _srfparentdata });
+        }
+        this.isLoadDefault = true;
+    }
+
+    /**
+     * 部件事件
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof ChartViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        super.onCtrlEvent(ctrlName, eventName, args);
+        if (Object.is(ctrlName, 'chart')) {
+            this.chartEvent(eventName, args);
+        }
+    }
+
+    /**
+     * 图表事件
+     *
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof ChartViewEngine
+     */
+    public chartEvent(eventName: string, args: any): void {
+        if (Object.is(eventName, 'beforeload')) {
+            this.dataCtrlBeforeLoad(args)
+        }
+    }
+
+
+    /**
+     * 搜索表单加载完成
+     *
+     * @memberof ChartViewEngine
+     */
+    public onSearchFormLoad(): void {
+        super.onSearchFormLoad();
+        if (this.getChart() && this.isLoadDefault) {
+            const tag = this.getChart().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: {} });
+        }
+        this.isLoadDefault = true;
+    }
+
+    /**
+     * 获取图表
+     *
+     * @returns {*}
+     * @memberof ChartViewEngine
+     */
+    public getChart(): any {
+        return this.chart;
+    }
+}
\ No newline at end of file

src/engine/view/chart-view9-engine.ts

+import ChartViewEngine from './chart-view-engine';
+
+
+/**
+ * 实体图表视图（部件视图）界面引擎
+ *
+ * @export
+ * @class ChartView9Engine
+ * @extends {ChartViewEngine}
+ */
+export default class ChartView9Engine extends ChartViewEngine {
+
+}
\ No newline at end of file

src/engine/view/data-view-engine.ts

+import MDViewEngine from './md-view-engine';
+
+
+/**
+ * 视图引擎基础
+ *
+ * @export
+ * @class DataViewEngine
+ * @extends {MDViewEngine}
+ */
+export default class DataViewEngine extends MDViewEngine {
+
+    /**
+     * 表格部件
+     *
+     * @type {*}
+     * @memberof DataViewEngine
+     */
+    protected dataView: any;
+
+    /**
+     * Creates an instance of DataViewEngine.
+     * @memberof DataViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 引擎初始化
+     *
+     * @param {*} [options={}]
+     * @memberof DataViewEngine
+     */
+    public init(options: any = {}): void {
+        this.dataView = options.dataview;
+        super.init(options);
+    }
+
+    /**
+     * 部件事件
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof DataViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        if (Object.is(ctrlName, 'dataview')) {
+            this.MDCtrlEvent(eventName, args);
+        }
+        super.onCtrlEvent(ctrlName, eventName, args);
+    }
+
+
+    /**
+     * 获取多数据部件
+     *
+     * @returns {*}
+     * @memberof DataViewEngine
+     */
+    public getMDCtrl(): any {
+        return this.dataView;
+    }
+
+    /**
+     * 删除操作
+     *
+     * @returns {void}
+     * @memberof DataViewEngine
+     */
+    public doRemove(): void {
+
+        let selectedData = this.getMDCtrl() && this.getMDCtrl().getSelection();
+        if (!selectedData || selectedData == null || selectedData.length === 0) {
+            return;
+        }
+
+        let dataInfo = '';
+
+        selectedData.forEach((record: any, index: number) => {
+            let srfmajortext = record.srfmajortext;
+            if (index < 5) {
+                if (!Object.is(dataInfo, '')) {
+                    dataInfo += '、';
+                }
+                dataInfo += srfmajortext;
+            } else {
+                return false;
+            }
+
+        });
+
+
+        if (selectedData.length < 5) {
+            dataInfo = dataInfo + '共' + selectedData.length + '条数据';
+        } else {
+            dataInfo = dataInfo + '...' + '共' + selectedData.length + '条数据';
+        }
+
+        dataInfo = dataInfo.replace(/[null]/g, '').replace(/[undefined]/g, '').replace(/[ ]/g, '');
+
+        // 询问框
+        this.view.$Modal.confirm({
+            title:'警告',
+            content: '确认要删除 ' + dataInfo + '，删除操作将不可恢复？',
+            onOk:() => {
+                this.removeData(null);
+            },
+            onCancel: () => {
+
+            }
+        });
+    }
+
+    /**
+     * 删除
+     *
+     * @param {*} [arg={}]
+     * @returns {void}
+     * @memberof DataViewEngine
+     */
+    public removeData(arg: any = {}): void {
+        if (!arg) {
+            arg = {};
+        }
+
+        // if (this.getParentMode()) {
+        //     Object.assign(arg, this.getParentMode());
+        // }
+
+        // if (this.getParentData()) {
+        //     Object.assign(arg, this.getParentData());
+        // }
+
+        if (!arg.srfkeys) {
+            // 获取要删除的数据集合
+            const selectedData: Array<any> = this.getMDCtrl() && this.getMDCtrl().getSelection();
+            if (!selectedData || selectedData == null || selectedData.length === 0) {
+                return;
+            }
+
+            let keys = '';
+            selectedData.forEach((record) => {
+                let key = record.srfkey;
+                if (!Object.is(keys, '')) {
+                    keys += ';';
+                }
+                keys += key;
+            });
+            arg.srfkeys = keys;
+        }
+
+        const grid: any = this.getMDCtrl();
+        if (grid) {
+            grid.remove(arg);
+        }
+    }
+
+}
\ No newline at end of file

src/engine/view/edit-view-engine.ts

+import ViewEngine from './view-engine';
+
+/**
+ * 编辑视图引擎
+ *
+ * @export
+ * @class EditViewEngine
+ * @extends {ViewEngine}
+ */
+export default class EditViewEngine extends ViewEngine {
+
+    /**
+     * 表单部件
+     *
+     * @protected
+     * @type {*}
+     * @memberof EditViewEngine
+     */
+    protected form: any;
+
+    /**
+     * 父健为当前健
+     *
+     * @protected
+     * @type {string}
+     * @memberof EditViewEngine
+     */
+    protected p2k: string = '';
+
+    /**
+     * 初始化编辑视图引擎
+     *
+     * @param {*} [options={}]
+     * @memberof EditViewEngine
+     */
+    public init(options: any = {}): void {
+        this.form = options.form;
+        this.p2k = options.p2k;
+        super.init(options);
+    }
+
+    /**
+     * 引擎加载
+     *
+     * @param {*} [opts={}]
+     * @memberof EditViewEngine
+     */
+    public load(opts: any = {}): void {
+        super.load(opts);
+        if (this.getForm() && this.isLoadDefault) {
+            const tag = this.getForm().name;
+
+            const data: any = {};
+            let srfkey: string = this.viewdata.srfkey;
+            let srfkeys: string = this.viewdata.srfkeys;
+            let srfsourcekey: string = this.viewdata.srfsourcekey;
+            let action: string = '';
+
+            const hasSrfParentKey = this.viewdata.srfparentdata
+                && this.viewdata.srfparentdata.srfparentkey
+                && !Object.is(this.viewdata.srfparentdata.srfparentkey, '');
+            if (Object.is(this.p2k, '1') && hasSrfParentKey) {
+                srfkey = this.viewdata.srfparentdata.srfparentkey;
+            }
+            if (srfkey && !Object.is(srfkey, '')) {
+                Object.assign(data, this.viewdata.srfparentdata);
+                action = 'load';
+            } else {
+                Object.assign(data, { srfparentdata: this.viewdata.srfparentdata });
+                Object.assign(data, { srfsourcekey: srfsourcekey, srfkeys: srfkeys });
+                action = 'loaddraft';
+            }
+
+            Object.assign(data, { srfkey: srfkey });
+            this.setViewState2({ tag: tag, action: action, viewdata: data });
+        }
+        this.isLoadDefault = true;
+    }
+
+    /**
+     * 部件事件机制
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof EditViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        super.onCtrlEvent(ctrlName, eventName, args);
+        if (Object.is(ctrlName, 'form')) {
+            this.formEvent(eventName, args);
+        }
+    }
+
+    /**
+     * 表单事件
+     *
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof EditViewEngine
+     */
+    public formEvent(eventName: string, args: any): void {
+        if (Object.is(eventName, 'load')) {
+            this.onFormLoad(args);
+        }
+        if (Object.is(eventName, 'save')) {
+            this.onFormSave(args);
+        }
+    }
+
+    /**
+     * 表单加载完成
+     *
+     * @param {*} args
+     * @memberof EditViewEngine
+     */
+    public onFormLoad(arg: any): void {
+        this.view.model.dataInfo = Object.is(arg.srfuf, '1') ? arg.srfmajortext : '新建';
+
+        this.setTabCaption(this.view.model.dataInfo);
+        const newdata: boolean = !Object.is(arg.srfuf, '1');
+        this.calcToolbarItemState(newdata);
+    }
+
+    /**
+     * 表单保存完成
+     *
+     * @param {*} args
+     * @memberof EditViewEngine
+     */
+    public onFormSave(arg: any): void {
+        const newdata: boolean = !Object.is(arg.srfuf, '1');
+        this.calcToolbarItemState(newdata);
+    }
+
+    /**
+     * 处理实体界面行为
+     *
+     * @param {string} tag
+     * @param {string} [actionmode]
+     * @returns {void}
+     * @memberof EditViewEngine
+     */
+    public doSysUIAction(tag: string, actionmode?: string): void {
+        // if (Object.is(tag, 'Help')) {
+        //     this.doHelp();
+        //     return;
+        // }
+        // if (Object.is(tag, 'SaveAndStart')) {
+        //     this.doSaveAndStart();
+        //     return;
+        // }
+        // if (Object.is(tag, 'SaveAndExit')) {
+        //     this.doSaveAndExit();
+        //     return;
+        // }
+        // if (Object.is(tag, 'SaveAndNew')) {
+        //     this.doSaveAndNew();
+        //     return;
+        // }
+        if (Object.is(tag, 'Save')) {
+            this.doSave();
+            return;
+        }
+        // if (Object.is(tag, 'Print')) {
+        //     this.doPrint();
+        //     return;
+        // }
+        // if (Object.is(tag, 'Copy')) {
+        //     this.doCopy();
+        //     return;
+        // }
+        // if (Object.is(tag, 'RemoveAndExit')) {
+        //     this.doRemoveAndExit();
+        //     return;
+        // }
+        // if (Object.is(tag, 'Refresh')) {
+        //     this.doRefresh();
+        //     return;
+        // }
+        // if (Object.is(tag, 'New')) {
+        //     this.doNew();
+        //     return;
+        // }
+        // if (Object.is(tag, 'FirstRecord')) {
+        //     this.doMoveToRecord('first');
+        //     return;
+        // }
+        // if (Object.is(tag, 'PrevRecord')) {
+        //     this.doMoveToRecord('prev');
+        //     return;
+        // }
+        // if (Object.is(tag, 'NextRecord')) {
+        //     this.doMoveToRecord('next');
+        //     return;
+        // }
+        // if (Object.is(tag, 'LastRecord')) {
+        //     this.doMoveToRecord('last');
+        //     return;
+        // }
+        // if (Object.is(tag, 'Exit') || Object.is(tag, 'Close')) {
+        //     this.doExit();
+        //     return;
+        // }
+        super.doSysUIAction(tag, actionmode);
+    }
+
+    /**
+     * 编辑界面_保存操作
+     * 
+     * @memberof IBizEditViewController
+     */
+    public doSave(): void {
+        // this.afterformsaveaction = '';
+        this.saveData({});
+    }
+
+    /**
+     * 保存视图数据
+     *
+     * @param {*} [arg={}]
+     * @memberof EditViewEngine
+     */
+    public saveData(arg: any = {}): void {
+        if (this.getForm()) {
+            const tag = this.getForm().name;
+            this.setViewState2({ tag: tag, action: 'save', viewdata: arg });
+        }
+    }
+
+    /**
+     * 获取表单对象
+     *
+     * @returns {*}
+     * @memberof EditViewEngine
+     */
+    public getForm(): any {
+        return this.form;
+    }
+
+    /**
+     * 设置分页标题
+     *
+     * @memberof EditViewEngine
+     */
+    public setTabCaption(info: string): void {
+        let viewdata: any = this.view.model;
+        let viewParam = this.view.$store.getters['viewaction/getAppView'](this.view.viewtag);
+        if (viewdata && viewParam && info && !Object.is(info, '') && this.view.$tabPageExp) {
+            this.view.$tabPageExp.setCurPageCaption(`${viewParam.viewmodule}_${viewParam.viewname}`.toLocaleLowerCase(), viewdata.srfCaption, info);
+        }
+    }
+
+}
\ No newline at end of file

src/engine/view/edit-view2-engine.ts

+import EditViewEngine from './edit-view-engine';
+
+/**
+ * 实体编辑视图（左右关系）界面引擎
+ *
+ * @export
+ * @class EditView2Engine
+ * @extends {EditViewEngine}
+ */
+export default class EditView2Engine extends EditViewEngine {
+
+    /**
+     * 数据关系栏
+     *
+     * @protected
+     * @type {*}
+     * @memberof EditView2Engine
+     */
+    protected drBar: any;
+
+    /**
+     * Creates an instance of EditView2Engine.
+     * 
+     * @memberof EditView2Engine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 初始化引擎
+     *
+     * @param {*} [options={}]
+     * @memberof EditView2Engine
+     */
+    public init(options: any = {}): void {
+        this.drBar = options.drbar;
+        super.init(options);
+    }
+
+    /**
+     * 部件加载
+     *
+     * @param {*} [opts={}]
+     * @memberof EditView2Engine
+     */
+    public load(opts: any = {}): void {
+        if (this.getDRBar()) {
+            const viewdata = this.viewdata;
+            const tag = this.getDRBar().name;
+            Object.assign(viewdata, {});
+            this.setViewState2({ tag: tag, action: 'load', viewdata: viewdata });
+        }
+    }
+
+    /**
+     * 部件事件机制
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof EditView2Engine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        super.onCtrlEvent(ctrlName, eventName, args);
+        if (Object.is(ctrlName, 'drbar')) {
+            this.drbarEvent(eventName, args);
+        }
+    }
+
+    /**
+     * 数据关系栏事件
+     *
+     * @param {string} eventName
+     * @param {any[]} args
+     * @memberof EditView2Engine
+     */
+    public drbarEvent(eventName: string, args: any[]): void {
+        if (Object.is(eventName, 'selectionchange')) {
+            this.drBarSelectionChange(args);
+        }
+        if (Object.is(eventName, 'load')) {
+            this.drBarLoad(args);
+        }
+    }
+
+    /**
+     * 关系部件加载完成
+     *
+     * @param {any[]} args
+     * @memberof EditView2Engine
+     */
+    public drBarLoad(args: any[]): void {
+        super.load();
+    }
+
+    /**
+     * 数据关系栏选中
+     *
+     * @param {any[]} args
+     * @memberof EditView2Engine
+     */
+    public drBarSelectionChange(args: any[]): void {
+        const item = args[0];
+        if (!item || Object.keys(item).length === 0) {
+            return;
+        }
+        this.view.selection = {};
+        Object.assign(this.view.selection, JSON.parse(JSON.stringify(item)));
+    }
+
+    /**
+     * 表单加载完成
+     *
+     * @param {*} [arg={}]
+     * @memberof EditView2Engine
+     */
+    public onFormLoad(arg: any = {}): void {
+        super.onFormLoad(arg);
+        if (this.getDRBar()) {
+            const viewdata = this.viewdata;
+            const tag = this.getDRBar().name;
+            Object.assign(viewdata, { srfkey: Object.is(arg.srfkey, '') ? '' : arg.srfkey });
+            this.setViewState2({ tag: tag, action: 'state', viewdata: viewdata });
+        }
+    }
+
+    /**
+     * 表单保存完成
+     *
+     * @param {*} [arg={}]
+     * @memberof EditView2Engine
+     */
+    public onFormSave(arg: any = {}): void {
+        super.onFormSave(arg);
+        if (this.getDRBar()) {
+            const viewdata = this.viewdata;
+            const tag = this.getDRBar().name;
+            Object.assign(viewdata, { srfkey: Object.is(arg.srfkey, '') ? '' : arg.srfkey });
+            this.setViewState2({ tag: tag, action: 'state', viewdata: viewdata });
+        }
+    }
+
+    /**
+     * 获取关系
+     *
+     * @returns {*}
+     * @memberof EditView2Engine
+     */
+    public getDRBar(): any {
+        return this.drBar;
+    }
+}
\ No newline at end of file

src/engine/view/edit-view3-engine.ts

+import EditViewEngine from './edit-view-engine';
+
+/**
+ * 实体编辑视图（分页关系）界面引擎
+ *
+ * @export
+ * @class EditView3Engine
+ * @extends {EditViewEngine}
+ */
+export default class EditView3Engine extends EditViewEngine {
+
+    /**
+     * 数据关系栏
+     *
+     * @protected
+     * @type {*}
+     * @memberof EditView3Engine
+     */
+    protected drTab: any;
+
+    /**
+     * Creates an instance of EditView3Engine.
+     * 
+     * @memberof EditView3Engine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 初始化引擎
+     *
+     * @param {*} [options={}]
+     * @memberof EditView3Engine
+     */
+    public init(options: any = {}): void {
+        this.drTab = options.drtab;
+        super.init(options);
+    }
+
+    /**
+     * 部件事件机制
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof EditView3Engine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        super.onCtrlEvent(ctrlName, eventName, args);
+        if (Object.is(ctrlName, 'drtab')) {
+            this.drTabEvent(eventName, args);
+        }
+    }
+
+    /**
+     * 数据关系栏事件
+     *
+     * @param {string} eventName
+     * @param {any[]} args
+     * @memberof EditView3Engine
+     */
+    public drTabEvent(eventName: string, args: any[]): void {
+        if (Object.is(eventName, 'selectionchange')) {
+            this.drTabSelectionChange(args);
+        }
+    }
+
+    /**
+     * 数据关系栏选中
+     *
+     * @param {any[]} args
+     * @memberof EditView3Engine
+     */
+    public drTabSelectionChange(args: any[]): void {
+        const item = args[0];
+        if (!item || Object.keys(item).length === 0) {
+            return;
+        }
+        this.view.selection = {};
+        Object.assign(this.view.selection, JSON.parse(JSON.stringify(item)));
+    }
+
+    /**
+     * 表单加载完成
+     *
+     * @param {*} [arg={}]
+     * @memberof EditView3Engine
+     */
+    public onFormLoad(arg: any = {}): void {
+        super.onFormLoad(arg);
+        if (this.getDrTab()) {
+            const viewdata = this.viewdata;
+            const tag = this.getDrTab().name;
+            Object.assign(viewdata, { srfkey: Object.is(arg.srfkey, '') ? '' : arg.srfkey });
+            this.setViewState2({ tag: tag, action: 'state', viewdata: viewdata });
+        }
+    }
+
+    /**
+     * 表单保存完成
+     *
+     * @param {*} [arg={}]
+     * @memberof EditView3Engine
+     */
+    public onFormSave(arg: any = {}): void {
+        super.onFormSave(arg);
+        if (this.getDrTab()) {
+            const viewdata = this.viewdata;
+            const tag = this.getDrTab().name;
+            Object.assign(viewdata, { srfkey: Object.is(arg.srfkey, '') ? '' : arg.srfkey });
+            this.setViewState2({ tag: tag, action: 'state', viewdata: viewdata });
+        }
+    }
+
+    /**
+     * 获取关系
+     *
+     * @returns {*}
+     * @memberof EditView3Engine
+     */
+    public getDrTab(): any {
+        return this.drTab;
+    }
+}
\ No newline at end of file

src/engine/view/edit-view9-engine.ts

+import EditViewEngine from './edit-view-engine';
+
+/**
+ *
+ *
+ * @export
+ * @class EditView9Engine
+ * @extends {EditViewEngine}
+ */
+export default class EditView9Engine extends EditViewEngine {
+
+}

src/engine/view/form-pickup-data-view-engine.ts

+import MDViewEngine from './md-view-engine';
+
+/**
+ * 视图引擎基础
+ *
+ * @export
+ * @class GridViewEngine
+ * @extends {MDViewEngine}
+ */
+export default class FormPickupDataViewEngine extends MDViewEngine {
+
+    /**
+     * 数据视图部件
+     *
+     * @type {*}
+     * @memberof FormPickupDataViewEngine
+     */
+    protected dataview: any;
+
+    /**
+     * Creates an instance of GridViewEngine.
+     * @memberof GridViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 引擎初始化
+     *
+     * @param {*} [options={}]
+     * @memberof GridViewEngine
+     */
+    public init(options: any = {}): void {
+        this.dataview = options.dataview;
+        super.init(options);
+    }
+
+    /**
+     * 部件事件
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof GridViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        if (Object.is(ctrlName, 'dataview')) {
+            this.MDCtrlEvent(eventName, args);
+        }
+        super.onCtrlEvent(ctrlName, eventName, args);
+    }
+
+
+    /**
+     * 获取多数据部件
+     *
+     * @returns {*}
+     * @memberof GridViewEngine
+     */
+    public getMDCtrl(): any {
+        return this.dataview;
+    }
+
+}
\ No newline at end of file

src/engine/view/grid-view-engine.ts

+import MDViewEngine from './md-view-engine';
+
+
+/**
+ * 视图引擎基础
+ *
+ * @export
+ * @class GridViewEngine
+ * @extends {MDViewEngine}
+ */
+export default class GridViewEngine extends MDViewEngine {
+
+    /**
+     * 表格部件
+     *
+     * @type {*}
+     * @memberof GridViewEngine
+     */
+    protected grid: any;
+
+    /**
+     * Creates an instance of GridViewEngine.
+     * @memberof GridViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 引擎初始化
+     *
+     * @param {*} [options={}]
+     * @memberof GridViewEngine
+     */
+    public init(options: any = {}): void {
+        this.grid = options.grid;
+        super.init(options);
+    }
+
+    /**
+     * 部件事件
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof GridViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        if (Object.is(ctrlName, 'grid')) {
+            this.MDCtrlEvent(eventName, args);
+        }
+        super.onCtrlEvent(ctrlName, eventName, args);
+    }
+
+
+    /**
+     * 获取多数据部件
+     *
+     * @returns {*}
+     * @memberof GridViewEngine
+     */
+    public getMDCtrl(): any {
+        return this.grid;
+    }
+
+    /**
+     * 事件处理
+     *
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof GridViewEngine
+     */
+    public MDCtrlEvent(eventName: string, args: any): void {
+        if (Object.is(eventName, 'rowdblclick') && this.gridRowAllowActive(2)) {
+            this.doEdit(args);
+            return;
+        }
+        if (Object.is(eventName, 'selectionchange')) {
+            this.selectionChange(args);
+            if (this.gridRowAllowActive(1)) {
+                this.doEdit(args);
+            }
+            return;
+        }
+        super.MDCtrlEvent(eventName, args);
+    }
+
+    /**
+     * 表格是否被允许激活
+     *
+     * @param {number} mode
+     * @returns {boolean}
+     * @memberof GridViewEngine
+     */
+    public gridRowAllowActive(mode: number): boolean {
+        return this.view.gridRowActiveMode === mode ? true : false;
+    }
+}
\ No newline at end of file

src/engine/view/grid-view8-engine.ts

+import GridViewEngine from './grid-view-engine';
+
+/**
+ * 视图引擎基础
+ *
+ * @export
+ * @class GridView8Engine
+ * @extends {GridViewEngine}
+ */
+export default class GridView8Engine extends GridViewEngine {
+
+    /**
+     * 表格部件
+     *
+     * @type {*}
+     * @memberof GridView8Engine
+     */
+    protected grid: any;
+
+    /**
+     * 表格部件
+     *
+     * @protected
+     * @type {*}
+     * @memberof Grid8ViewEngine
+     */
+    protected totalgrid: any;
+
+    /**
+     * 选中数据集
+     *
+     * @protected
+     * @type {any[]}
+     * @memberof Grid8ViewEngine
+     */
+    public selections: any[] = [];
+
+    /**
+     * 选中数据集
+     *
+     * @protected
+     * @type {any[]}
+     * @memberof Grid8ViewEngine
+     */
+    public selections2: any[] = [];
+
+    /**
+     * Creates an instance of GridView8Engine.
+     * @memberof GridView8Engine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 引擎初始化
+     *
+     * @param {*} [options={}]
+     * @memberof GridView8Engine
+     */
+    public init(options: any = {}): void {
+        this.grid = options.grid;
+        this.totalgrid = options.totalgrid;
+        super.init(options);
+    }
+
+    /**
+     * 引擎加载
+     *
+     * @memberof MDViewEngine
+     */
+    public load(): void {
+        super.load();
+        this.load2();
+    }
+
+    /**
+     * 加载
+     *
+     * @memberof Grid8ViewEngine
+     */
+    public load2(): void {
+        const srfparentdata = this.viewdata.srfparentdata ? { srfparentdata: this.viewdata.srfparentdata } : {};
+        if (this.getMDCtrl2()) {
+            const tag = this.getMDCtrl2().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: srfparentdata });
+        }
+    }
+
+    /**
+     * 部件事件
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof GridView8Engine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        if (Object.is(ctrlName, 'totalgrid')) {
+            this.MD2Event(eventName, args);
+        }
+        super.onCtrlEvent(ctrlName, eventName, args);
+    }
+
+
+    /**
+     * 获取多数据部件
+     *
+     * @returns {*}
+     * @memberof GridView8Engine
+     */
+    public getMDCtrl(): any {
+        return this.grid;
+    }
+
+    /**
+     * 获取多数据部件
+     *
+     * @returns {*}
+     * @memberof GridView8Engine
+     */
+    public getMDCtrl2(): any {
+        return this.totalgrid;
+    }
+
+    /**
+     * 删除
+     *
+     * @param {*} [arg={}]
+     * @returns {void}
+     * @memberof GridView8Engine
+     */
+    public removeData(items: any[] = []): void {
+        let arg: any = {};
+        // 获取要删除的数据集合
+        if (!items || items == null || items.length === 0) {
+            return;
+        }
+
+        let keys = '';
+        items.forEach((item) => {
+            let key = item.srfkey;
+            if (!Object.is(keys, '')) {
+                keys += ';';
+            }
+            keys += key;
+        });
+        arg.srfkeys = keys;
+
+        const grid: any = this.getMDCtrl();
+        if (grid) {
+            grid.remove(arg);
+        }
+    }
+
+    /**
+     * 添加数据
+     *
+     * @param {any[]} [items=[]]
+     * @memberof Grid8ViewEngine
+     */
+    public addBatchData(items: any[] = []): void {
+        let arg: any = {};
+        // 获取要添加的数据集合
+        if (!items || items == null || items.length === 0) {
+            return;
+        }
+
+        let keys = '';
+        items.forEach((item) => {
+            let key = item.srfkey;
+            if (!Object.is(keys, '')) {
+                keys += ';';
+            }
+            keys += key;
+        });
+        arg.srfkeys = keys;
+
+        const grid: any = this.getMDCtrl();
+        if (grid) {
+            grid.addBatchData(arg);
+        }
+    }
+
+    /**
+     * 
+     *
+     * @param {string} eventName
+     * @param {*} [args={}]
+     * @memberof GridView8Engine
+     */
+    public MDEvent(eventName: string, args: any = {}): void {
+        if (Object.is(eventName, 'rowclick')) {
+            // this.***()
+        }
+        if (Object.is(eventName, 'rowdblclick')) {
+            // this.doEdit(args);
+        }
+        if (Object.is(eventName, 'selectionchange')) {
+            // this.***()
+            this.selectionChange(args);
+        }
+        if (Object.is(eventName, 'remove')) {
+            this.load2();
+        }
+    }
+
+    /**
+     * 
+     *
+     * @param {string} eventName
+     * @param {*} [args={}]
+     * @memberof GridView8Engine
+     */
+    public MD2Event(eventName: string, args: any = {}): void {
+        if (Object.is(eventName, 'rowclick')) {
+            // this.***()
+        }
+        if (Object.is(eventName, 'rowdblclick')) {
+            // this.doEdit(args);
+        }
+        if (Object.is(eventName, 'selectionchange')) {
+            // this.***()
+            this.selectionChange2(args);
+        }
+    }
+
+    /**
+     * 选中变化
+     *
+     * @param {any[]} args
+     * @memberof GridView8Engine
+     */
+    public selectionChange(args: any[]): void {
+        this.selections = [...args];
+    }
+
+    /**
+     * 选中变化
+     *
+     * @param {any[]} args
+     * @memberof GridView8Engine
+     */
+    public selectionChange2(args: any[]): void {
+        this.selections2 = [...args];
+    }
+
+    /**
+     * 移动数据
+     *
+     * @memberof Grid8ViewEngine
+     */
+    public moveData() {
+        this.addBatchData(this.selections2);
+    }
+
+    /**
+     * 移动数据
+     *
+     * @memberof Grid8ViewEngine
+     */
+    public moveData2() {
+        this.removeData(this.selections);
+    }
+
+    /**
+     * 移动全部数据
+     *
+     * @memberof Grid8ViewEngine
+     */
+    public moveAllData() {
+        if (this.getMDCtrl2()) {
+            var items: any[] = this.getMDCtrl2().getDatas();
+            this.addBatchData(items);
+        }
+    }
+
+    /**
+     * 移动全部数据
+     *
+     * @memberof Grid8ViewEngine
+     */
+    public moveAllData2() {
+        if (this.getMDCtrl()) {
+            var items: any[] = this.getMDCtrl().getDatas();
+            this.removeData(items);
+        }
+    }
+}

src/engine/view/grid-view9-engine.ts

+import GridViewEngine from './grid-view-engine';
+
+/**
+ * 视图引擎基础
+ *
+ * @export
+ * @class GridView9Engine
+ * @extends {GridViewEngine}
+ */
+export default class GridView9Engine extends GridViewEngine {
+
+    /**
+     * Creates an instance of GridView9Engine.
+     * @memberof GridView9Engine
+     */
+    constructor() {
+        super();
+    }
+}
\ No newline at end of file

src/engine/view/html-view-engine.ts

+import ViewEngine from './view-engine';
+
+/**
+ *
+ *
+ * @export
+ * @class HtmlViewEngine
+ * @extends {ViewEngine}
+ */
+export default class HtmlViewEngine extends ViewEngine {
+
+}

src/engine/view/list-view-engine.ts

+import MDViewEngine from './md-view-engine';
+
+/**
+ * 视图引擎基础
+ *
+ * @export
+ * @class ListViewEngine
+ * @extends {MDViewEngine}
+ */
+export default class ListViewEngine extends MDViewEngine {
+
+    /**
+     * 表格部件
+     *
+     * @type {*}
+     * @memberof ListViewEngine
+     */
+    protected list: any;
+
+    /**
+     * Creates an instance of ListViewEngine.
+     * @memberof ListViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 引擎初始化
+     *
+     * @param {*} [options={}]
+     * @memberof ListViewEngine
+     */
+    public init(options: any = {}): void {
+        this.list = options.list;
+        super.init(options);
+    }
+
+    /**
+     * 部件事件
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof ListViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        if (Object.is(ctrlName, 'list')) {
+            this.MDCtrlEvent(eventName, args);
+        }
+        super.onCtrlEvent(ctrlName, eventName, args);
+    }
+
+
+    /**
+     * 获取多数据部件
+     *
+     * @returns {*}
+     * @memberof ListViewEngine
+     */
+    public getMDCtrl(): any {
+        return this.list;
+    }
+
+    /**
+     * 删除操作
+     *
+     * @returns {void}
+     * @memberof ListViewEngine
+     */
+    public doRemove(): void {
+
+        let selectedData = this.getMDCtrl() && this.getMDCtrl().getSelection();
+        if (!selectedData || selectedData == null || selectedData.length === 0) {
+            return;
+        }
+
+        let dataInfo = '';
+
+        selectedData.forEach((record: any, index: number) => {
+            let srfmajortext = record.srfmajortext;
+            if (index < 5) {
+                if (!Object.is(dataInfo, '')) {
+                    dataInfo += '、';
+                }
+                dataInfo += srfmajortext;
+            } else {
+                return false;
+            }
+
+        });
+
+
+        if (selectedData.length < 5) {
+            dataInfo = dataInfo + '共' + selectedData.length + '条数据';
+        } else {
+            dataInfo = dataInfo + '...' + '共' + selectedData.length + '条数据';
+        }
+
+        dataInfo = dataInfo.replace(/[null]/g, '').replace(/[undefined]/g, '').replace(/[ ]/g, '');
+
+        // 询问框
+        this.view.$Modal.confirm({
+            title:'警告',
+            content: '确认要删除 ' + dataInfo + '，删除操作将不可恢复？',
+            onOk:() => {
+                this.removeData(null);
+            },
+            onCancel: () => {
+
+            }
+        });
+    }
+
+    /**
+     * 删除
+     *
+     * @param {*} [arg={}]
+     * @returns {void}
+     * @memberof ListViewEngine
+     */
+    public removeData(arg: any = {}): void {
+        if (!arg) {
+            arg = {};
+        }
+
+        // if (this.getParentMode()) {
+        //     Object.assign(arg, this.getParentMode());
+        // }
+
+        // if (this.getParentData()) {
+        //     Object.assign(arg, this.getParentData());
+        // }
+
+        if (!arg.srfkeys) {
+            // 获取要删除的数据集合
+            const selectedData: Array<any> = this.getMDCtrl() && this.getMDCtrl().getSelection();
+            if (!selectedData || selectedData == null || selectedData.length === 0) {
+                return;
+            }
+
+            let keys = '';
+            selectedData.forEach((record) => {
+                let key = record.srfkey;
+                if (!Object.is(keys, '')) {
+                    keys += ';';
+                }
+                keys += key;
+            });
+            arg.srfkeys = keys;
+        }
+
+        const grid: any = this.getMDCtrl();
+        if (grid) {
+            grid.remove(arg);
+        }
+    }
+
+}
\ No newline at end of file

src/engine/view/md-view-engine.ts

+import ViewEngine from './view-engine';
+
+/**
+ * 多数据引擎
+ *
+ * @export
+ * @class MDViewEngine
+ * @extends {ViewEngine}
+ */
+export default class MDViewEngine extends ViewEngine {
+
+    /**
+     * 表格部件
+     *
+     * @type {*}
+     * @memberof GridViewEngine
+     */
+    protected md: any;
+
+    /**
+     * 表单部件
+     *
+     * @type {*}
+     * @memberof GridViewEngine
+     */
+    protected searchForm: any;
+
+    /**
+     * 属性面板
+     *
+     * @protected
+     * @type {*}
+     * @memberof PickupGridViewEngine
+     */
+    protected propertypanel: any;
+
+    /**
+     * 打开数据
+     *
+     * @protected
+     * @memberof MDViewEngine
+     */
+    protected openData?: (args: any[], params?: any, $event?: any, xData?: any) => void;
+
+    /**
+     * 新建数据
+     *
+     * @protected
+     * @memberof GridViewEngine
+     */
+    protected newData?: (args: any[], params?: any, $event?: any, xData?: any) => void;
+
+    /**
+     * Creates an instance of GridViewEngine.
+     * @memberof GridViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 引擎初始化
+     *
+     * @param {*} [options={}]
+     * @memberof GridViewEngine
+     */
+    public init(options: any = {}): void {
+        this.propertypanel = options.propertypanel;
+        this.searchForm = options.searchform;
+        this.openData = options.opendata;
+        this.newData = options.newdata;
+        super.init(options);
+    }
+
+    /**
+     * 引擎加载
+     *
+     * @param {*} [opts={}]
+     * @memberof MDViewEngine
+     */
+    public load(opts: any = {}): void {
+        super.load(opts);
+        const _srfparentdata = this.viewdata.srfparentdata ? { srfparentdata: this.viewdata.srfparentdata } : { srfparentdata: {} };
+        if (this.getSearchForm()) {
+            const tag = this.getSearchForm().name;
+            this.setViewState2({ tag: tag, action: 'loaddraft', viewdata: _srfparentdata });
+        } else if (this.getMDCtrl() && this.isLoadDefault) {
+            const tag = this.getMDCtrl().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: _srfparentdata });
+        } else {
+            this.isLoadDefault = true;
+        }
+    }
+
+    /**
+     * 部件事件
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof GridViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        super.onCtrlEvent(ctrlName, eventName, args);
+        if (Object.is(ctrlName, 'searchform')) {
+            this.searchFormEvent(eventName, args);
+        }
+    }
+
+    /**
+     * 搜索表单事件
+     *
+     * @param {string} eventName
+     * @param {*} [args={}]
+     * @memberof MDViewEngine
+     */
+    public searchFormEvent(eventName: string, args: any = {}): void {
+        if (Object.is(eventName, 'load')) {
+            this.onSearchFormLoad(args);
+        }
+    }
+
+    /**
+     * 事件处理
+     *
+     * @param {string} eventName
+     * @param {any[]} args
+     * @memberof MDViewEngine
+     */
+    public MDCtrlEvent(eventName: string, args: any): void {
+        if (Object.is(eventName, 'rowclick')) {
+        }
+        if (Object.is(eventName, 'rowdblclick')) {
+            this.doEdit(args);
+        }
+        if (Object.is(eventName, 'selectionchange')) {
+            this.selectionChange(args);
+        }
+        if (Object.is(eventName, 'load')) {
+            this.MDCtrlLoad(args);
+        }
+        if (Object.is(eventName, 'beforeload')) {
+            this.MDCtrlBeforeLoad(args)
+        }
+    }
+
+    /**
+     * 搜索表单加载完成
+     *
+     * @param {*} [args={}]
+     * @memberof MDViewEngine
+     */
+    public onSearchFormLoad(args: any = {}): void {
+        if (this.getMDCtrl() && this.isLoadDefault) {
+            const tag = this.getMDCtrl().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: {} });
+        }
+        this.isLoadDefault = true;
+    }
+
+    /**
+     * 处理实体界面行为
+     *
+     * @param {string} tag
+     * @param {string} [actionmode]
+     * @returns {void}
+     * @memberof MDViewEngine
+     */
+    public doSysUIAction(tag: string, actionmode?: string): void {
+        // if (Object.is(tag, 'Help')) {
+        //     this.doHelp(params);
+        //     return;
+        // }
+        if (Object.is(tag, 'Edit')) {
+            this.doEdit();
+            return;
+        }
+        // if (Object.is(tag, 'View')) {
+        //     this.doView(params);
+        //     return;
+        // }
+        // if (Object.is(tag, 'Print')) {
+        //     this.doPrint(params);
+        //     return;
+        // }
+        // if (Object.is(tag, 'ExportExcel')) {
+        //     this.doExportExcel(params);
+        //     return;
+        // }
+        // if (Object.is(tag, 'ExportModel')) {
+        //     this.doExportModel(params);
+        //     return;
+        // }
+        // if (Object.is(tag, 'Copy')) {
+        //     this.doCopy(params);
+        //     return;
+        // }
+        if (Object.is(tag, 'Remove')) {
+            this.doRemove();
+            return;
+        }
+        // if (Object.is(tag, 'Import')) {
+        //     this.doImport(params);
+        //     return;
+        // }
+        // if (Object.is(tag, 'Refresh')) {
+        //     this.doRefresh(params);
+        //     return;
+        // }
+        // if (Object.is(tag, 'NewRow')) {
+        //     this.doCheck(params);
+        //     return;
+        // }
+        if (Object.is(tag, 'SaveRow')) {
+            this.doSaveEditRow();
+            return;
+        }
+        if (Object.is(tag, 'New')) {
+            this.doNew();
+            return;
+        }
+        if (Object.is(tag, 'OpenRowEdit')) {
+            this.doOpenRowEdit();
+            return;
+        }
+        if (Object.is(tag, 'CloseRowEdit')) {
+            this.doCloseRowEdit();
+            return;
+        }
+        // if (Object.is(tag, 'ToggleRowEdit')) {
+        //     this.doToggleRowEdit(params);
+        //     return;
+        // }
+        // if (Object.is(tag, 'ToggleFilter')) {
+        //     this.doToggleFilter(params);
+        //     return;
+        // }
+        super.doSysUIAction(tag, actionmode);
+    }
+
+    /**
+     * 多数据项界面_开启行编辑操作
+     *
+     * @memberof MDViewEngine
+     */
+    public doOpenRowEdit(): void {
+        if (this.getMDCtrl()) {
+            const tag = this.getMDCtrl().name;
+            this.setViewState2({ tag: tag, action: 'openEdit', viewdata: {} });
+        }
+    }
+
+    /**
+     * 多数据项界面_关闭行编辑操作
+     *
+     * @memberof MDViewEngine
+     */
+    public doCloseRowEdit(): void {
+        if (this.getMDCtrl()) {
+            const tag = this.getMDCtrl().name;
+            this.setViewState2({ tag: tag, action: 'closeEdit', viewdata: {} });
+        }
+    }
+
+    /**
+     * 多数据项界面_提交编辑数据操作
+     *
+     * @memberof MDViewEngine
+     */
+    public doSaveEditRow(): void {
+        if (this.getMDCtrl()) {
+            const tag = this.getMDCtrl().name;
+            this.setViewState2({ tag: tag, action: 'submitEidt', viewdata: {} });
+        }
+    }
+
+    /**
+     * 多数据项界面_编辑操作
+     *
+     * @param {*} [params={}]
+     * @returns {void}
+     * @memberof MDViewEngine
+     */
+    public doEdit(params: any = {}): void {
+        // 获取要编辑的数据集合
+        if (params && params.srfkey) {
+            if (this.isFunc(this.getMDCtrl().findItem)) {
+                params = this.getMDCtrl().findItem('srfkey', params.srfkey);
+            }
+            const arg = { data: params };
+            this.onEditData(arg);
+            return;
+        }
+        if (this.isFunc(this.getMDCtrl().getSelection)) {
+            const selectedData = this.getMDCtrl().getSelection();
+            if (selectedData == null || selectedData.length === 0) {
+                return;
+            }
+            this.onEditData({ data: selectedData[0] });
+        }
+    }
+
+    /**
+     * 编辑数据
+     *
+     * @param {*} arg
+     * @memberof MDViewEngine
+     */
+    public onEditData(arg: any): void {
+        const loadParam: any = {};
+        // if (this.getViewParam()) {
+        //     Object.assign(loadParam, this.getViewParam());
+        // }
+        // if (this.getParentMode()) {
+        //     Object.assign(loadParam, this.getParentMode());
+        // }
+        // if (this.getParentData()) {
+        //     Object.assign(loadParam, this.getParentData());
+        // }
+
+        if (arg.srfcopymode) {
+            Object.assign(loadParam, {
+                srfsourcekey: arg.data.srfkey
+            });
+        } else {
+            Object.assign(loadParam, { srfkey: arg.data.srfkey, srfdeid: arg.data.srfdeid });
+        }
+
+        if (this.openData && this.isFunc(this.openData)) {
+            this.openData([loadParam], null, null, this.getMDCtrl());
+        }
+    }
+
+    /**
+     * 多数据项界面_新建操作
+     *
+     * @param {*} [params={}]
+     * @memberof MDViewEngine
+     */
+    public doNew(params: any = {}): void {
+        this.onNewData();
+    }
+
+    /**
+     * 新建数据
+     *
+     * @returns {void}
+     * @memberof MDViewEngine
+     */
+    public onNewData(): void {
+
+        // tslint:disable-next-line:prefer-const
+        let loadParam: any = {};
+        // if (this.getViewParam()) {
+        //     Object.assign(loadParam, this.getViewParam());
+        // }
+        // if (this.getParentMode()) {
+        //     Object.assign(loadParam, this.getParentMode());
+        // }
+        // if (this.getParentData()) {
+        //     Object.assign(loadParam, this.getParentData());
+        // }
+        // if (this.isEnableRowEdit() && (this.getMDCtrl() && this.getMDCtrl().getOpenEdit())) {
+        //     this.doNewRow(loadParam);
+        //     return;
+        // }
+        // if (this.isEnableBatchAdd()) {
+        //     this.doNewDataBatch(loadParam);
+        //     return;
+        // }
+        // if (this.doNewDataWizard(loadParam)) {
+        //     return;
+        // }
+
+        Object.assign(loadParam, this.view.srfparentdata);
+        this.doNewDataNormal(loadParam);
+    }
+
+    /**
+     * 常规新建数据
+     *
+     * @param {*} arg
+     * @returns {*}
+     * @memberof MDViewEngine
+     */
+    public doNewDataNormal(arg: any): any {
+
+        // let view = this.getNewDataView(arg);
+        // if (view == null) {
+        //     return false;
+        // }
+        // const openMode = view.openMode;
+        // if (!openMode || Object.is(openMode, '')) {
+        //     view.openMode = 'INDEXVIEWTAB';
+        // }
+        // if (!view.state) {
+        //     view.state = 'new';
+        //     let viewParam: any = {};
+        //     Object.assign(viewParam, view.viewParam);
+
+        //     if (viewParam && viewParam.srfnewmode && !Object.is(viewParam.srfnewmode, '')) {
+        //         const srfnewmode: string = viewParam.srfnewmode.split('@').join('__');
+        //         view.state = view.state + '_' + srfnewmode.toLowerCase();
+        //     }
+        // }
+        return this.openDataView(arg);
+    }
+
+    /**
+     * 多数据项界面_删除操作
+     *
+     * @memberof MDViewEngine
+     */
+    public doRemove(): void {
+    }
+
+
+    public openDataView(view: any = {}): boolean {
+
+        const openMode = view.openMode;
+
+        // if (view.redirect) {
+        //     this.redirectOpenView(view);
+        //     return false;
+        // }
+
+        if (openMode !== undefined) {
+            if (Object.is(openMode, 'POPUPMODAL')) {
+                view.modal = true;
+            } else if (Object.is(openMode, 'POPUP')) {
+                view.modal = true;
+            } else if (Object.is(openMode, '') || Object.is(openMode, 'INDEXVIEWTAB')) {
+                view.modal = false;
+            }
+        }
+
+        // if (view.modal) {
+        //     let modalview = this.openModal(view);
+        //     modalview.subscribe((result: any) => {
+        //         if (result && Object.is(result.ret, 'OK')) {
+        //             this.onRefresh();
+        //         }
+        //     });
+        //     return true;
+        // } 
+        // else {
+        //     this.openWindow(view.viewurl, view.viewparam);
+        // }
+
+        if (this.newData && this.isFunc(this.newData)) {
+            this.newData([], null, null, this.getMDCtrl());
+        }
+
+        return true;
+    }
+
+    /**
+     * 选中变化
+     *
+     * @param {any[]} args
+     * @memberof MDViewEngine
+     */
+    public selectionChange(args: any[]): void {
+        if (this.view) {
+            this.view.$emit('viewdataschange', args);
+        }
+        if (this.getPropertyPanel()) {
+            const tag = this.getPropertyPanel().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: args[0] });
+        }
+        const state = args.length > 0 && !Object.is(args[0].srfkey, '') ? false : true;
+        this.calcToolbarItemState(state);
+    }
+
+    /**
+     * 多数据部件加载完成
+     *
+     * @param {any[]} args
+     * @memberof MDViewEngine
+     */
+    public MDCtrlLoad(args: any[]) {
+        if (this.view) {
+            this.view.$emit('viewload', args);
+        }
+        this.calcToolbarItemState(true);
+    }
+
+    /**
+     * 多数据部件加载之前
+     *
+     * @param {*} [arg={}]
+     * @memberof MDViewEngine
+     */
+    public MDCtrlBeforeLoad(arg: any = {}): void {
+        if (this.viewdata.srfparentdata && Object.keys(this.viewdata.srfparentdata).length > 0) {
+            Object.assign(arg, { srfparentdata: this.viewdata.srfparentdata });
+        }
+        if (this.getSearchForm()) {
+            Object.assign(arg, this.getSearchForm().getData());
+        }
+        if (this.view && !this.view.isExpandSearchForm) {
+            Object.assign(arg, { query: this.view.query });
+        }
+    }
+
+    /**
+     * 获取多数据部件
+     *
+     * @returns {*}
+     * @memberof MDViewEngine
+     */
+    public getMDCtrl(): any {
+
+    }
+
+    public getSearchForm(): any {
+        return this.searchForm;
+    }
+
+    /**
+     * 获取属性面板
+     *
+     * @returns
+     * @memberof MDViewEngine
+     */
+    public getPropertyPanel() {
+        return this.propertypanel;
+    }
+
+}
\ No newline at end of file

src/engine/view/mpickup-view-engine.ts

+import ViewEngine from './view-engine';
+
+/**
+ * 实体选择视图
+ *
+ * @export
+ * @class MPickupViewEngine
+ * @extends {ViewEngine}
+ */
+export default class MPickupViewEngine extends ViewEngine {
+
+    /**
+     * 选择视图面板
+     *
+     * @type {*}
+     * @memberof MPickupViewEngine
+     */
+    public pickupViewPanel: any = null;
+
+    /**
+     * Creates an instance of MPickupViewEngine.
+     * 
+     * @memberof MPickupViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 初始化引擎
+     *
+     * @param {*} options
+     * @memberof MPickupViewEngine
+     */
+    public init(options: any): void {
+        this.pickupViewPanel = options.pickupviewpanel;
+        if (options.view.viewdata && options.view.viewdata.selectedData && Array.isArray(options.view.viewdata.selectedData)) {
+            options.view.viewSelections = [...options.view.viewdata.selectedData];
+            delete options.view.viewdata.selectedData;
+        }
+        super.init(options);
+    }
+
+
+    /**
+     * 引擎加载
+     *
+     * @memberof MPickupViewEngine
+     */
+    public load(): void {
+        super.load();
+        const _srfparentdata = this.viewdata.srfparentdata ? { srfparentdata: this.viewdata.srfparentdata } : { srfparentdata: {} };
+        if (this.getPickupViewPanel()) {
+            const tag = this.getPickupViewPanel().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: _srfparentdata });
+        }
+    }
+
+    /**
+     * 引擎事件
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof MPickupViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        super.onCtrlEvent(ctrlName, eventName, args);
+
+        if (Object.is(eventName, 'selectionchange')) {
+            this.onSelectionChange(ctrlName, args);
+        }
+        if (Object.is(eventName, 'load')) {
+            this.onLoad(ctrlName, args);
+        }
+        if (Object.is(eventName, 'activated')) {
+            this.onSelectionChange(ctrlName, args);
+            this.view.onCLickRight();
+        }
+    }
+
+    /**
+     * 值选中变化
+     *
+     * @param {string} ctrlName 选择视图面板名称
+     * @param {any[]} args 选中数据
+     * @memberof MPickupViewEngine
+     */
+    public onSelectionChange(ctrlName: string, args: any[]): void {
+        this.view.containerModel[`view_${ctrlName}`].selections = [...JSON.parse(JSON.stringify(args))];
+
+        Object.values(this.view.containerModel).forEach((model: any) => {
+            if (!Object.is(model.type, 'PICKUPVIEWPANEL')) {
+                return;
+            }
+        });
+        const _disbaled: boolean = this.view.containerModel[`view_${ctrlName}`].selections.length > 0 ? true : false;
+        this.view.containerModel.view_rightbtn = _disbaled;
+    }
+
+    /**
+     * 视图加载完成
+     *
+     * @param {string} ctrlName 选择视图面板名称
+     * @param {any[]} args 选中数据
+     * @memberof MPickupViewEngine
+     */
+    public onLoad(ctrlName: string, args: any[]): void {
+        this.view.containerModel[`view_${ctrlName}`].datas = [...JSON.parse(JSON.stringify(args))];
+    }
+
+    /**
+     * 获取选择视图面板
+     *
+     * @returns {*}
+     * @memberof MPickupViewEngine
+     */
+    public getPickupViewPanel(): any {
+        return this.pickupViewPanel;
+    }
+}
\ No newline at end of file

src/engine/view/option-view-engine.ts

+import EditViewEngine from './edit-view-engine';
+
+/**
+ * 实体选项操作视图界面引擎
+ *
+ * @export
+ * @class OptionViewEngine
+ * @extends {EditViewEngine}
+ */
+export default class OptionViewEngine extends EditViewEngine {
+
+    /**
+     * Creates an instance of OptionViewEngine.
+     * 创建 OptionViewEngine 实例对象
+     * 
+     * @memberof OptionViewEngine
+     */
+    constructor() {
+        super();
+    }
+}
\ No newline at end of file

src/engine/view/pickup-data-view-engine.ts

+import MDViewEngine from './md-view-engine';
+
+/**
+ * 视图引擎基础
+ *
+ * @export
+ * @class GridViewEngine
+ * @extends {MDViewEngine}
+ */
+export default class PickupDataViewEngine extends MDViewEngine {
+
+    /**
+     * 数据视图部件
+     *
+     * @type {*}
+     * @memberof FormPickupDataViewEngine
+     */
+    protected dataview: any;
+
+    /**
+     * Creates an instance of GridViewEngine.
+     * @memberof GridViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 引擎初始化
+     *
+     * @param {*} [options={}]
+     * @memberof GridViewEngine
+     */
+    public init(options: any = {}): void {
+        this.dataview = options.dataview;
+        super.init(options);
+    }
+
+    /**
+     * 部件事件
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof GridViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        if (Object.is(ctrlName, 'dataview')) {
+            this.MDCtrlEvent(eventName, args);
+        }
+        super.onCtrlEvent(ctrlName, eventName, args);
+    }
+
+
+    /**
+     * 获取多数据部件
+     *
+     * @returns {*}
+     * @memberof GridViewEngine
+     */
+    public getMDCtrl(): any {
+        return this.dataview;
+    }
+
+}
\ No newline at end of file

src/engine/view/pickup-grid-view-engine.ts

+import GridViewEngine from './grid-view-engine';
+
+/**
+ * 实体选择表格视图（部件视图）界面引擎
+ *
+ * @export
+ * @class PickupGridViewEngine
+ * @extends {GridViewEngine}
+ */
+export default class PickupGridViewEngine extends GridViewEngine {
+
+    /**
+     * Creates an instance of PickupGridViewEngine.
+     * 
+     * 
+     * @memberof PickupGridViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 选中激活数据
+     *
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof PickupGridViewEngine
+     */
+    public MDCtrlEvent(eventName: string, args: any): void {
+        if (Object.is(eventName, 'rowdblclick') && this.gridRowAllowActive(2)) {
+            this.view.$emit('viewdatasactivated', args);
+            return ;
+        }
+        super.MDCtrlEvent(eventName, args);
+    }
+}
\ No newline at end of file

src/engine/view/pickup-tree-view-engine.ts

+import TreeViewEngine from './tree-view-engine';
+
+/**
+ * 实体选择树视图（部件视图）界面引擎
+ *
+ * @export
+ * @class PickupTreeViewEngine
+ * @extends {TreeViewEngine}
+ */
+export default class PickupTreeViewEngine extends TreeViewEngine {
+
+    /**
+     * 部件加载完
+     *
+     * @param {*} args
+     * @memberof PickupTreeViewEngine
+     */
+    public onLoad(args: any): void { 
+        super.onLoad(args);
+        if (this.view) {
+            this.view.$emit('viewload', args);
+        }
+    }
+
+    /**
+     * 选中处理
+     *
+     * @param {any[]} args
+     * @memberof PickupTreeViewEngine
+     */
+    public onSelectionChange(args: any[]): void {
+        super.onSelectionChange(args);
+        if (this.view) {
+            this.view.$emit('viewdataschange', args);
+        }
+    }
+}
\ No newline at end of file

src/engine/view/pickup-view-engine.ts

+import ViewEngine from './view-engine';
+
+/**
+ * 实体选择视图
+ *
+ * @export
+ * @class PickupViewEngine
+ * @extends {ViewEngine}
+ */
+export default class PickupViewEngine extends ViewEngine {
+
+    /**
+     * 选择视图面板
+     *
+     * @type {*}
+     * @memberof PickupViewEngine
+     */
+    public pickupViewPanel: any = null;
+
+    /**
+     * Creates an instance of PickupViewEngine.
+     * 
+     * @memberof PickupViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 初始化引擎
+     *
+     * @param {*} options
+     * @memberof PickupViewEngine
+     */
+    public init(options: any): void {
+        this.pickupViewPanel = options.pickupviewpanel;
+        super.init(options);
+    }
+
+
+    /**
+     * 引擎加载
+     *
+     * @memberof PickupViewEngine
+     */
+    public load(): void {
+        this.view.viewSelections = [];
+        super.load();
+        const _srfparentdata = this.viewdata.srfparentdata ? { srfparentdata: this.viewdata.srfparentdata } : { srfparentdata: {} };
+        if (this.getPickupViewPanel()) {
+            const tag = this.getPickupViewPanel().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: _srfparentdata });
+        }
+    }
+
+    /**
+     * 
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof PickupViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        super.onCtrlEvent(ctrlName, eventName, args);
+
+        if (Object.is(eventName, 'selectionchange')) {
+            this.onSelectionChange(args);
+        }
+        if (Object.is(eventName, 'activated')) {
+            this.view.$emit('viewdatasactivated', args);
+        }
+    }
+
+    /**
+     * 值选中变化
+     *
+     * @param {any[]} args
+     * @memberof PickupViewEngine
+     */
+    public onSelectionChange(args: any[]): void {
+        this.view.viewSelections = [];
+        this.view.viewSelections = [...args]
+        const _disabled: boolean = this.view.viewSelections.length > 0 ? false : true;
+        this.view.containerModel.view_okbtn.disabled = _disabled;
+    }
+
+    /**
+     * 获取选择视图面板
+     *
+     * @returns {*}
+     * @memberof PickupViewEngine
+     */
+    public getPickupViewPanel(): any {
+        return this.pickupViewPanel;
+    }
+}
\ No newline at end of file

src/engine/view/search-view-engine.ts

+import ViewEngine from './view-engine';
+
+/**
+ * 搜索视图引擎
+ *
+ * @export
+ * @class SearchViewEngine
+ * @extends {ViewEngine}
+ */
+export class SearchViewEngine extends ViewEngine {
+
+    /**
+     * 表单部件
+     *
+     * @protected
+     * @type {*}
+     * @memberof SearchViewEngine
+     */
+    protected searchForm: any;
+
+    /**
+     * 初始化
+     *
+     * @param {*} options
+     * @memberof SearchViewEngine
+     */
+    public init(options: any): void {
+        this.searchForm = options.searchform;
+        super.init(options);
+
+    }
+
+    /**
+     * 引擎加载
+     *
+     * @param {*} [opts={}]
+     * @memberof SearchViewEngine
+     */
+    public load(opts: any = {}): void {
+        super.load(opts);
+        const _srfparentdata = this.viewdata.srfparentdata ? { srfparentdata: this.viewdata.srfparentdata } : { srfparentdata: {} };
+        if (this.getSearchForm()) {
+            const tag = this.getSearchForm().name;
+            this.setViewState2({ tag: tag, action: 'loaddraft', viewdata: _srfparentdata });
+        }
+    }
+
+    /**
+     * 事件处理
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof SearchViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        super.onCtrlEvent(ctrlName, eventName, args);
+        if (Object.is(ctrlName, 'searchform')) {
+            this.searchFormEvent(eventName, args);
+        }
+    }
+
+    /**
+     * 搜索表单事件
+     *
+     * @param {string} eventName
+     * @param {*} [args={}]
+     * @memberof SearchViewEngine
+     */
+    public searchFormEvent(eventName: string, args: any = {}): void {
+        if (Object.is(eventName, 'load')) {
+            this.onSearchFormLoad(args);
+        }
+    }
+
+    /**
+     * 搜索表单加载完成
+     *
+     * @param {*} [args={}]
+     * @memberof SearchViewEngine
+     */
+    public onSearchFormLoad(args: any = {}): void {
+    }
+
+    /**
+     * 数据部件加载之前
+     *
+     * @param {*} [arg={}]
+     * @memberof SearchViewEngine
+     */
+    public dataCtrlBeforeLoad(arg: any = {}): void {
+        if (this.viewdata.srfparentdata && Object.keys(this.viewdata.srfparentdata).length > 0) {
+            Object.assign(arg, { srfparentdata: this.viewdata.srfparentdata });
+        }
+        if (this.getSearchForm()) {
+            Object.assign(arg, this.getSearchForm().getData());
+        }
+        if (this.view && !this.view.isExpandSearchForm) {
+            Object.assign(arg, { query: this.view.query });
+        }
+    }
+
+
+    /**
+     * 获取搜索表单
+     *
+     * @returns {*}
+     * @memberof SearchViewEngine
+     */
+    public getSearchForm(): any {
+        return this.searchForm;
+    }
+}
\ No newline at end of file

src/engine/view/tab-exp-view-engine.ts

+import ViewEngine from './view-engine';
+
+/**
+ * 实体选择视图
+ *
+ * @export
+ * @class TabExpViewEngine
+ * @extends {ViewEngine}
+ */
+export default class TabExpViewEngine extends ViewEngine {
+
+
+    /**
+     * Creates an instance of TabExpViewEngine.
+     * 
+     * @memberof TabExpViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 初始化引擎
+     *
+     * @param {*} options
+     * @memberof TabExpViewEngine
+     */
+    public init(options: any): void {
+        super.init(options);
+    }
+
+
+    /**
+     * 引擎加载
+     *
+     * @memberof TabExpViewEngine
+     */
+    public load(): void {
+        super.load();
+        const _srfparentdata = this.viewdata.srfparentdata ? { srfparentdata: this.viewdata.srfparentdata } : { srfparentdata: {} };
+        if (this.viewdata.srfkey && !Object.is(this.viewdata.srfkey, '')) {
+            Object.assign(_srfparentdata.srfparentdata, { srfparentkey: this.viewdata.srfkey });
+        }
+        Object.values(this.view.containerModel).forEach((_item: any) => {
+            if (!Object.is(_item.type, 'TABEXPPANEL')) {
+                return;
+            }
+            this.setViewState2({ tag: _item.name, action: 'load', viewdata: _srfparentdata });
+        });
+    }
+}
\ No newline at end of file

src/engine/view/tree-exp-view-engine.ts

+import ViewEngine from './view-engine';
+
+/**
+ * 实体树导航视图界面引擎
+ *
+ * @export
+ * @class TreeExpView
+ * @extends {ViewEngine}
+ */
+export default class TreeExpView extends ViewEngine {
+
+    /**
+     * 选择视图面板
+     *
+     * @type {*}
+     * @memberof TreeExpView
+     */
+    public treeExpBar: any = null;
+
+    /**
+     * Creates an instance of TreeExpView.
+     * 
+     * @memberof TreeExpView
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 初始化引擎
+     *
+     * @param {*} options
+     * @memberof TreeExpView
+     */
+    public init(options: any): void {
+        this.treeExpBar = options.treeexpbar;
+        super.init(options);
+    }
+
+
+    /**
+     * 引擎加载
+     *
+     * @memberof TreeExpView
+     */
+    public load(): void {
+        super.load();
+        if (this.viewdata.srfkey && !this.viewdata.srfparentkey) {
+            if (!this.viewdata.srfparentdata) {
+                this.viewdata.srfparentdata = {};
+            }
+            Object.assign(this.viewdata.srfparentdata, { srfparentkey: this.viewdata.srfkey });
+        }
+        const _srfparentdata = this.viewdata.srfparentdata ? { srfparentdata: this.viewdata.srfparentdata } : { srfparentdata: {} };
+        if (this.getTreeExpBar() && this.isLoadDefault) {
+            const tag = this.getTreeExpBar().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: _srfparentdata });
+        } else {
+            this.isLoadDefault = true;
+        }
+    }
+
+    /**
+     * 部件事件机制
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof TreeExpView
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        super.onCtrlEvent(ctrlName, eventName, args);
+        if (Object.is(ctrlName, 'treeexpbar')) {
+            this.treeExpBarEvent(eventName, args);
+
+        }
+    }
+
+    /**
+     * 树导航事件
+     *
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof TreeExpView
+     */
+    public treeExpBarEvent(eventName: string, args: any): void {
+        if (Object.is(eventName, 'load')) {
+            this.view.$emit('viewload', args);
+        }
+        if (Object.is(eventName, 'selectionchange')) {
+            this.view.$emit('viewdataschange', args);
+        }
+        if (Object.is(eventName, 'activated')) {
+            this.view.$emit('viewdatasactivated', args);
+        }
+    }
+
+    /**
+     * 获取部件对象那
+     *
+     * @returns {*}
+     * @memberof TreeExpView
+     */
+    public getTreeExpBar(): any {
+        return this.treeExpBar;
+    }
+
+
+}
\ No newline at end of file

src/engine/view/tree-view-engine.ts

+import ViewEngine from './view-engine';
+
+/**
+ * 实体树视图界面引擎
+ *
+ * @export
+ * @class TreeViewEngine
+ * @extends {ViewEngine}
+ */
+export default class TreeViewEngine extends ViewEngine {
+
+    /**
+     * 树部件对象
+     *
+     * @type {*}
+     * @memberof TreeViewEngine
+     */
+    public tree: any;
+
+    /**
+     * Creates an instance of TreeViewEngine.
+     * 
+     * @memberof TreeViewEngine
+     */
+    constructor() {
+        super();
+    }
+
+    /**
+     * 初始化引擎
+     *
+     * @param {*} options
+     * @memberof PickupViewEngine
+     */
+    public init(options: any): void {
+        this.tree = options.tree;
+        super.init(options);
+    }
+
+    /**
+     * 引擎加载
+     *
+     * @memberof TreeViewEngine
+     */
+    public load(): void {
+        super.load();
+        const _srfparentdata = this.viewdata.srfparentdata ? { srfparentdata: this.viewdata.srfparentdata } : { srfparentdata: {} };
+        if (this.getTreeView() && this.isLoadDefault) {
+            const tag = this.getTreeView().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: _srfparentdata });
+        } else {
+            this.isLoadDefault = true;
+        }
+    }
+
+    /**
+     * 部件事件
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof TreeViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        super.onCtrlEvent(ctrlName, eventName, args);
+
+        if (Object.is(eventName, 'load')) {
+            this.onLoad(args);
+        }
+        if (Object.is(eventName, 'selectionchange')) {
+            this.onSelectionChange(args);
+        }
+    }
+
+    /**
+     * 部件加载完
+     *
+     * @param {*} args
+     * @memberof TreeViewEngine
+     */
+    public onLoad(args: any): void { }
+
+    /**
+     * 选中处理
+     *
+     * @param {any[]} args
+     * @memberof TreeViewEngine
+     */
+    public onSelectionChange(args: any[]): void { }
+
+
+    /**
+     * 
+     *获取树视图部件
+     * @returns {*}
+     * @memberof TreeViewEngine
+     */
+    public getTreeView(): any {
+        return this.tree;
+    }
+
+
+}
\ No newline at end of file

src/engine/view/tree-view9-engine.ts

+import TreeViewEngine from './tree-view-engine';
+
+/**
+ *
+ *
+ * @export
+ * @class TreeView9Engine
+ * @extends {TreeViewEngine}
+ */
+export default class TreeView9Engine extends TreeViewEngine {
+
+}
\ No newline at end of file

src/engine/view/view-engine.ts

+import { Util } from '@/utils';
+
+/**
+ * 
+ *
+ * @export
+ * @class ViewEngine
+ */
+export default class ViewEngine {
+    /**
+     * 视图部件对象
+     *
+     * @protected
+     * @type {*}
+     * @memberof ViewEngine
+     */
+    protected view: any = null;
+    /**
+     * 引擎参数
+     *
+     * @type {*}
+     * @memberof ViewEngine
+     */
+    protected opt: any = {};
+    /**
+     *
+     *
+     * @type {*}
+     * @memberof ViewEngine
+     */
+    protected methods: any = {};
+
+    /**
+     * 视图数据
+     *
+     * @type {*}
+     * @memberof ViewEngine
+     */
+    public viewdata: any = {};
+
+    /**
+     * 是否默认记载
+     *
+     * @type {boolean}
+     * @memberof ViewEngine
+     */
+    public isLoadDefault: boolean = true;
+
+    /**
+     * Creates an instance of ViewEngine.
+     * @memberof ViewEngine
+     */
+    constructor() { }
+
+    /**
+     * 引擎初始化
+     *
+     * @param {*} [options={}]
+     * @memberof ViewEngine
+     */
+    public init(options: any = {}): void {
+        this.opt = options;
+        this.methods = options.methods;
+        this.view = options.view;
+        this.isLoadDefault = options.isLoadDefault;
+        const hasviewdata: boolean = this.view.viewdata ? true : false;
+        if (hasviewdata) {
+            try {
+                Object.assign(this.viewdata, JSON.parse(this.view.viewdata));
+            } catch (error) {
+                console.log(error);
+            }
+        } else {
+            const _viewdata: any = {};
+            const router = this.view.$route;
+            if (router && router.params && router.params[router.name]) {
+                Object.assign(_viewdata, Util.formatMatrixParse2(router.params[router.name]));
+            }
+            Object.assign(this.viewdata, _viewdata);
+        }
+        if (this.view.srfparentdata && this.viewdata.srfparentdata) {
+            Object.assign(this.view.srfparentdata, this.viewdata.srfparentdata);
+        }
+        this.load();
+    }
+
+    /**
+     * 设置视图数据
+     *
+     * @param {string} viewdata
+     * @memberof ViewEngine
+     */
+    public setViewData(viewdata: string): void {
+        this.viewdata = {};
+        try {
+            Object.assign(this.viewdata, JSON.parse(viewdata));
+        } catch (error) {
+            console.log(error);
+        }
+        if (this.view.srfparentdata && this.viewdata.srfparentdata) {
+            Object.assign(this.view.srfparentdata, this.viewdata.srfparentdata);
+        }
+    }
+
+    /**
+     * 引擎加载
+     *
+     * @param {*} [opts={}]
+     * @memberof ViewEngine
+     */
+    public load(opts: any = {}): void {
+
+    }
+
+    /**
+     * 部件事件机制
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof ViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+
+    }
+
+    /**
+     * 处理界面行为
+     *
+     * @param {string} tag
+     * @param {string} [actionmode]
+     * @memberof ViewEngine
+     */
+    public doSysUIAction(tag: string, actionmode?: string): void {
+        if (Object.is(actionmode, 'FRONT')) {
+            if (this.methods.front) {
+                this.methods.front(tag);
+            }
+        }
+    }
+
+    /**
+     * 处理工作流界面行为
+     *
+     * @param {string} tag
+     * @param {string} [actionmode]
+     * @memberof ViewEngine
+     */
+    public doSysWFUIAction(tag: string, actionmode?: string): void {
+        if (Object.is(actionmode, 'WFFRONT')) {
+            if (this.methods.wfFront) {
+                this.methods.wfFront(tag);
+            }
+        }
+    }
+
+    /**
+     * 是否为方法
+     *
+     * @protected
+     * @param {*} func
+     * @returns {boolean}
+     * @memberof ViewEngine
+     */
+    protected isFunc(func: any): boolean {
+        return func instanceof Function;
+    }
+
+    /**
+     * 父数据参数模式
+     *
+     * @param {{ tag: string, action: string, viewdata: any }} { tag, action, viewdata }
+     * @memberof ViewEngine
+     */
+    public setViewState2({ tag, action, viewdata }: { tag: string, action: string, viewdata: any }): void {
+        this.view.viewState.next({ tag: tag, action: action, data: viewdata });
+    }
+
+    /**
+     * 计算工具栏状态
+     *
+     * @param {boolean} state
+     * @param {*} [dataaccaction]
+     * @memberof ViewEngine
+     */
+    public calcToolbarItemState(state: boolean, dataaccaction?: any) {
+        const _this: any = this;
+        if (!_this.view.toolBarModels || Object.keys(_this.view.toolBarModels).length === 0) {
+            return;
+        }
+
+        for (const key in _this.view.toolBarModels) {
+            if (!_this.view.toolBarModels.hasOwnProperty(key)) {
+                return;
+            }
+            const _item = _this.view.toolBarModels[key];
+            if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
+                _item.disabled = state;
+            }
+        }
+    }
+
+}
\ No newline at end of file

src/engine/view/wfaction-view-engine.ts

+import EditViewEngine from './edit-view-engine';
+
+/**
+ * 实体工作流操作视图界面引擎
+ *
+ * @export
+ * @class WFActionViewEngine
+ * @extends {EditViewEngine}
+ */
+export default class WFActionViewEngine extends EditViewEngine {
+
+}
\ No newline at end of file

src/engine/view/wfedit-view3-engine.ts

+import EditView3Engine from './edit-view3-engine';
+
+/**
+ * 实体工作流视图（分页关系）界面引擎
+ *
+ * @export
+ * @class WFEditView3Engine
+ * @extends {EditView3Engine}
+ */
+export default class WFEditView3Engine extends EditView3Engine {
+
+}
\ No newline at end of file

src/engine/view/wfgrid-view-engine.ts

+import GridViewEngine from './grid-view-engine';
+
+/**
+ * 实体工作流表格视图界面引擎
+ *
+ * @export
+ * @class WFGridViewEngine
+ * @extends {GridViewEngine}
+ */
+export default class WFGridViewEngine extends GridViewEngine {
+
+}
\ No newline at end of file

src/engine/view/wfstart-view-engine.ts

+import EditViewEngine from './edit-view-engine';
+
+/**
+ * 实体工作流启动视图界面引擎
+ *
+ * @export
+ * @class WFStartViewEngine
+ * @extends {EditViewEngine}
+ */
+export default class WFStartViewEngine extends EditViewEngine {
+
+}
\ No newline at end of file

src/engine/view/wizard-view-engine.ts

+import ViewEngine from './view-engine';
+
+/**
+ * 视图引擎基础
+ *
+ * @export
+ * @class GridViewEngine
+ */
+export default class WizardViewEngine extends ViewEngine {
+
+    /**
+     * 向导面板部件
+     *
+     * @protected
+     * @type {*}
+     * @memberof EditViewEngine
+     */
+    protected wizardpanel: any;
+
+    /**
+     * 初始化编辑视图引擎
+     *
+     * @param {*} [options={}]
+     * @memberof EditViewEngine
+     */
+    public init(options: any = {}): void {
+        this.wizardpanel = options.wizardpanel;
+        super.init(options);
+    }
+
+    /**
+     * 引擎加载
+     *
+     * @param {*} [opts={}]
+     * @memberof EditViewEngine
+     */
+    public load(opts: any = {}): void {
+        super.load(opts);
+        // const _srfparentdata = this.viewdata.srfparentdata ? { srfparentdata: this.viewdata.srfparentdata } : { srfparentdata: {} };
+        if (this.getWizardPanel()) {
+            const tag = this.getWizardPanel().name;
+            this.setViewState2({ tag: tag, action: 'load', viewdata: this.viewdata });
+        }
+    }
+
+    /**
+     * 部件事件机制
+     *
+     * @param {string} ctrlName
+     * @param {string} eventName
+     * @param {*} args
+     * @memberof ViewEngine
+     */
+    public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
+        if (Object.is(ctrlName, 'wizardpanel')) {
+            this.wizardPanelEvent(eventName, args);
+        }
+        super.onCtrlEvent(ctrlName, eventName, args);
+    }
+
+    /**
+     * 事件处理
+     *
+     * @param {string} eventName
+     * @param {any[]} args
+     * @memberof MDViewEngine
+     */
+    public wizardPanelEvent(eventName: string, args: any): void {
+        if (Object.is(eventName, 'finish')) {
+            this.onfinish(args);
+        }
+    }
+
+    /**
+     * 完成
+     *
+     * @param {*} args
+     * @memberof WizardViewEngine
+     */
+    public onfinish(args: any): void {
+        this.view.$emit('viewdataschange', [args]);
+        this.view.$emit('close', null);
+    }
+
+    /**
+     * 获取向导面板
+     *
+     * @returns {*}
+     * @memberof WizardViewEngine
+     */
+    public getWizardPanel(): any {
+        return this.wizardpanel;
+    }
+}
\ No newline at end of file

src/interface/control.ts

+/**
+ * 部件接口
+ *
+ * @interface Control
+ */
+export interface ControlInterface {
+
+    /**
+     * 获取多项数据
+     *
+     * @returns {any[]}
+     * @memberof Control
+     */
+    getDatas(): any[];
+
+    /**
+     * 获取单项数据
+     *
+     * @returns {*}
+     * @memberof Control
+     */
+    getData(): any;
+}
\ No newline at end of file

src/interface/viewState.ts

+/**
+ * 视图状态
+ *
+ * @interface ViewState
+ */
+interface ViewState {
+
+    /**
+     * 部件标识
+     *
+     * @type {string}
+     * @memberof ViewState
+     */
+    tag: string;
+
+    /**
+     * 触发行为
+     *
+     * @type {('load' | 'save' | 'remove' | 'autoload' | 'loaddraft' | 'filter' | 'refresh_parent' | any)}
+     * @memberof ViewState
+     */
+    action: 'load' | 'save' | 'remove' | 'autoload' | 'loaddraft' | 'filter' | 'refresh_parent' | any;
+
+    /**
+     * 数据
+     *
+     * @type {*}
+     * @memberof ViewState
+     */
+    data?: any;
+}
\ No newline at end of file

src/model/form-detail/form-button.ts

+import { FormDetailModel } from './form-detail';
+
+/**
+ * 按钮模型
+ *
+ * @export
+ * @class FormButtonModel
+ * @extends {FormDetailModel}
+ */
+export class FormButtonModel extends FormDetailModel {
+
+    constructor(opts: any = {}) {
+        super(opts);
+    }
+}
\ No newline at end of file

src/model/form-detail/form-detail.ts

+/**
+ * 表单成员模型
+ *
+ * @export
+ * @class FormDetailModel
+ */
+export class FormDetailModel {
+
+    /**
+     * 成员标题
+     *
+     * @type {string}
+     * @memberof FormDetailModel
+     */
+    public caption: string = '';
+
+    /**
+     * 成员类型
+     *
+     * @type {string}
+     * @memberof FormDetailModel
+     */
+    public detailType: string = '';
+
+    /**
+     * 表单对象
+     *
+     * @type {*}
+     * @memberof FormDetailModel
+     */
+    public form: any = null;
+
+    /**
+     * 成员名称
+     *
+     * @type {string}
+     * @memberof FormDetailModel
+     */
+    public name: string = '';
+
+    /**
+     * 成员是否显示
+     *
+     * @type {boolean}
+     * @memberof FormDetailModel
+     */
+    public visible: boolean = true;
+
+    /**
+     * 成员是否显示标题
+     *
+     * @type {boolean}
+     * @memberof FormDetailModel
+     */
+    public isShowCaption: boolean = true;
+
+    /**
+     * Creates an instance of FormDetailModel.
+     * FormDetailModel 实例
+     * 
+     * @param {*} [opts={}]
+     * @memberof FormDetailModel
+     */
+    constructor(opts: any = {}) {
+        this.caption = !Object.is(opts.caption, '') ? opts.caption : '';
+        this.detailType = !Object.is(opts.detailType, '') ? opts.detailType : '';
+        this.form = opts.form ? opts.form : {};
+        this.name = !Object.is(opts.name, '') ? opts.name : '';
+        this.visible = opts.visible ? true : false;
+        this.isShowCaption = opts.isShowCaption ? true : false;
+    }
+
+    /**
+     * 设置显示与隐藏
+     *
+     * @param {boolean} state
+     * @memberof FormDetailModel
+     */
+    public setVisible(state: boolean): void {
+        this.visible = state;
+    }
+
+    /**
+     * 设置显示标题栏
+     *
+     * @param {boolean} state
+     * @memberof FormDetailModel
+     */
+    public setShowCaption(state: boolean): void {
+        this.isShowCaption = state;
+    }
+}
\ No newline at end of file

src/model/form-detail/form-druipart.ts

+import { FormDetailModel } from './form-detail';
+
+/**
+ * 数据关系界面模型
+ *
+ * @export
+ * @class FormDRUIPartModel
+ * @extends {FormDetailModel}
+ */
+export class FormDRUIPartModel extends FormDetailModel {
+
+    
+    constructor(opts: any = {}) {
+        super(opts);
+    }
+}
\ No newline at end of file

src/model/form-detail/form-group-panel.ts

+import { FormDetailModel } from './form-detail';
+
+/**
+ * 分组面板模型
+ *
+ * @export
+ * @class FormGroupPanelModel
+ * @extends {FormDetailModel}
+ */
+export class FormGroupPanelModel extends FormDetailModel {
+
+    /**
+     * 实体界面行为组
+     *
+     * @type {*}
+     * @memberof FormGroupPanelModel
+     */
+    public uiActionGroup: any = {};
+
+    /**
+     * Creates an instance of FormGroupPanelModel.
+     * 创建 FormGroupPanelModel 实例
+     * 
+     * @param {*} [opts={}]
+     * @memberof FormGroupPanelModel
+     */
+    constructor(opts: any = {}) {
+        super(opts);
+        Object.assign(this.uiActionGroup, opts.uiActionGroup);
+    }
+}
\ No newline at end of file

src/model/form-detail/form-iframe.ts

+import { FormDetailModel } from './form-detail';
+
+/**
+ * 嵌入成员模型
+ *
+ * @export
+ * @class FormIFrameModel
+ * @extends {FormDetailModel}
+ */
+export class FormIFrameModel extends FormDetailModel {
+
+    constructor(opts: any = {}) {
+        super(opts);
+    }
+}
\ No newline at end of file

src/model/form-detail/form-item.ts

+import { FormDetailModel } from './form-detail';
+
+/**
+ * 表单项模型
+ *
+ * @export
+ * @class FormItemModel
+ * @extends {FormDetailModel}
+ */
+export class FormItemModel extends FormDetailModel {
+
+    /**
+     * 是否启用
+     *
+     * @type {boolean}
+     * @memberof FormItemModel
+     */
+    public disabled: boolean = false;
+
+    /**
+     * 错误信息
+     *
+     * @type {string}
+     * @memberof FormItemModel
+     */
+    public error: string = '';
+
+    /**
+     * 表单项启用条件
+     * 
+     * 0 不启用
+     * 1 新建
+     * 2 更新
+     * 3 全部启用
+     *
+     * @type {(number | 0 | 1 | 2 | 3)}
+     * @memberof FormItemModel
+     */
+    public enableCond: number | 0 | 1 | 2 | 3 = 3;
+
+    /**
+     * Creates an instance of FormItemModel.
+     * FormItemModel 实例
+     * 
+     * @param {*} [opts={}]
+     * @memberof FormItemModel
+     */
+    constructor(opts: any = {}) {
+        super(opts);
+        this.disabled = opts.disabled ? true : false;
+        this.enableCond = opts.enableCond;
+    }
+
+    /**
+     * 设置是否启用
+     *
+     * @param {boolean} state
+     * @memberof FormItemModel
+     */
+    public setDisabled(state: boolean): void {
+        this.disabled = state;
+    }
+
+    /**
+     * 设置信息内容
+     *
+     * @param {string} error
+     * @memberof FormItemModel
+     */
+    public setError(error: string): void {
+        this.error = error;
+    }
+
+    /**
+     * 设置是否启用
+     *
+     * @param {string} srfuf
+     * @memberof FormItemModel
+     */
+    public setEnableCond(srfuf: string): void {
+        // 是否有权限
+        const isReadOk: boolean = true;
+        const _srfuf: number = parseInt(srfuf, 10);
+        let state: boolean = true;
+
+        if (isReadOk) {
+            if (_srfuf === 1) {
+                if ((this.enableCond & 2) === 2) {
+                    state = false;
+                }
+            } else {
+                if ((this.enableCond & 1) === 1) {
+                    state = false;
+                }
+            }
+        }
+        this.setDisabled(state);
+    }
+
+} 
\ No newline at end of file

src/model/form-detail/form-page.ts

+import { FormDetailModel } from './form-detail';
+
+/**
+ * 表单分页模型
+ *
+ * @export
+ * @class FormPageModel
+ * @extends {FormDetailModel}
+ */
+export class FormPageModel extends FormDetailModel {
+
+    
+    constructor(opts: any = {}) {
+        super(opts);
+    }
+}
\ No newline at end of file

src/model/form-detail/form-part.ts

+import { FormDetailModel } from './form-detail';
+
+/**
+ * 表单部件模型
+ *
+ * @export
+ * @class FormPartModel
+ * @extends {FormDetailModel}
+ */
+export class FormPartModel extends FormDetailModel {
+
+
+    constructor(opts: any = {}) {
+        super(opts);
+    }
+}
\ No newline at end of file

src/model/form-detail/form-row-item.ts

+import { FormDetailModel } from './form-detail';
+
+/**
+ * 直接内容模型
+ *
+ * @export
+ * @class FormRowItemModel
+ * @extends {FormDetailModel}
+ */
+export class FormRowItemModel extends FormDetailModel {
+
+
+    constructor(opts: any = {}) {
+        super(opts);
+    }
+}
\ No newline at end of file

src/model/form-detail/form-tab-page.ts

+import { FormDetailModel } from './form-detail';
+import { FormTabPanelModel } from './form-tab-panel';
+
+/**
+ * 分页面板模型
+ *
+ * @export
+ * @class FormTabPageModel
+ * @extends {FormDetailModel}
+ */
+export class FormTabPageModel extends FormDetailModel {
+
+
+    /**
+     * Creates an instance of FormTabPageModel.
+     * FormTabPageModel 实例
+     * 
+     * @param {*} [opts={}]
+     * @memberof FormTabPageModel
+     */
+    constructor(opts: any = {}) {
+        super(opts);
+    }
+
+    /**
+     * 设置分页是否启用
+     *
+     * @param {boolean} state
+     * @memberof FormTabPageModel
+     */
+    public setVisible(state: boolean): void {
+        this.visible = state;
+        const tabPanel = this.getTabPanelModel();
+        if (tabPanel) {
+            tabPanel.setActiviePage();
+        }
+    }
+
+    /**
+     * 获取分页面板
+     *
+     * @returns {(FormTabPanelModel | null)}
+     * @memberof FormTabPageModel
+     */
+    public getTabPanelModel(): FormTabPanelModel | null {
+        if (!this.form) {
+            return null;
+        }
+        const tabPanels: any[] = Object.values(this.form.detailsModel).filter((model: any) => Object.is(model.detailType, 'TABPANEL'));
+        let index = tabPanels.findIndex((tabPanel: any) => {
+            return tabPanel.tabPages.some((tabPag: any) => Object.is(tabPag.name, this.name));
+        });
+        if (index === -1) {
+            return null;
+        }
+        const tabPanel: FormTabPanelModel = tabPanels[index];
+        return tabPanel;
+    }
+}
\ No newline at end of file

src/model/form-detail/form-tab-panel.ts

+import { FormDetailModel } from './form-detail';
+
+/**
+ * 分页部件模型
+ *
+ * @export
+ * @class FormTabPanelModel
+ * @extends {FormDetailModel}
+ */
+export class FormTabPanelModel extends FormDetailModel {
+
+    /**
+     * 被激活分页
+     *
+     * @type {string}
+     * @memberof FormTabPanelModel
+     */
+    public activiedPage: string = '';
+
+    /**
+     * 选中激活状态
+     *
+     * @type {string}
+     * @memberof FormTabPanelModel
+     */
+    public clickActiviePage: string = '';
+
+    /**
+     * 分页子成员
+     *
+     * @type {any[]}
+     * @memberof FormTabPanelModel
+     */
+    public tabPages: any[] = [];
+
+    /**
+     * Creates an instance of FormTabPanelModel.
+     * FormTabPanelModel 实例
+     * 
+     * @param {*} [opts={}]
+     * @memberof FormTabPanelModel
+     */
+    constructor(opts: any = {}) {
+        super(opts);
+        this.tabPages = [...opts.tabPages];
+        if (this.tabPages.length > 0) {
+            this.activiedPage = this.tabPages[0].name;
+        }
+    }
+
+    /**
+     * 设置激活分页
+     *
+     * @memberof FormTabPanelModel
+     */
+    public setActiviePage(): void {
+        if (!this.form) {
+            return;
+        }
+        const detailsModel: any = this.form.detailsModel;
+
+        const index = this.tabPages.findIndex((tabpage: any) => Object.is(tabpage.name, this.clickActiviePage) && Object.is(tabpage.name, this.activiedPage) && detailsModel[tabpage.name].visible);
+        if (index !== - 1) {
+            return;
+        }
+
+        this.tabPages.some((tabpage: any) => {
+            if (detailsModel[tabpage.name].visible) {
+                this.activiedPage = tabpage.name;
+                return true;
+            }
+            return false;
+        });
+    }
+
+    /**
+     * 选中页面
+     *
+     * @param {*} $event
+     * @returns {void}
+     * @memberof FormTabPanelModel
+     */
+    public clickPage($event: any): void {
+        if (!$event) {
+            return;
+        }
+
+        this.clickActiviePage = $event;
+        this.activiedPage = $event;
+    }
+}
\ No newline at end of file

src/model/form-detail/form-user-control.ts

+import { FormDetailModel } from './form-detail';
+
+/**
+ * 用户控件模型
+ *
+ * @export
+ * @class FormUserControlModel
+ * @extends {FormDetailModel}
+ */
+export class FormUserControlModel extends FormDetailModel {
+
+
+    constructor(otps:any = {}) {
+        super(otps);
+    }
+}
\ No newline at end of file

src/model/form-detail/index.ts

+export { FormButtonModel } from './form-button';
+export { FormPageModel } from './form-page';
+export { FormItemModel } from './form-item';
+export { FormDRUIPartModel } from './form-druipart';
+export { FormPartModel } from './form-part';
+export { FormGroupPanelModel } from './form-group-panel';
+export { FormIFrameModel } from './form-iframe';
+export { FormRowItemModel } from './form-row-item';
+export { FormTabPageModel } from './form-tab-page';
+export { FormTabPanelModel } from './form-tab-panel';
+export { FormUserControlModel } from './form-user-control';

src/shims-tsx.d.ts

+import Vue, { VNode } from 'vue';
+
+declare global {
+  namespace JSX {
+    // tslint:disable no-empty-interface
+    interface Element extends VNode {}
+    // tslint:disable no-empty-interface
+    interface ElementClass extends Vue {}
+    interface IntrinsicElements {
+      [elem: string]: any;
+    }
+  }
+}

src/shims-vue.d.ts

+declare module '*.vue' {
+  import Vue from 'vue';
+  export default Vue;
+}

src/store/actions.ts

+
+/**
+ * 导出对象
+ */
+export const actions: any = {
+}
\ No newline at end of file

src/store/getters.ts

+/**
+ * 获取代码表对象
+ * 
+ * @param state 
+ */
+export const getCodeList = (state: any) => (srfkey: string) => {
+    return state.codelists.find((_codelist: any) => Object.is(_codelist.srfkey, srfkey));
+}
+
+/**
+ * 获取代码表
+ * 
+ * @param state 
+ */
+export const getCodeListItems = (state: any) => (srfkey: string) => {
+    let items: any[] = [];
+    const codelist = state.codelists.find((_codelist: any) => Object.is(_codelist.srfkey, srfkey));
+    if (!codelist) {
+        console.log(`----${srfkey}----代码表不存在`);
+    } else {
+        items = [...codelist.items];
+    }
+    return items;
+}
+
+/**
+ * 获取应用数据
+ * 
+ * @param state 
+ */
+export const getAppData = (state: any) => () => {
+    return state.appdata;
+}
+
+/**
+ * 获取本地应用数据
+ * 
+ * @param state 
+ */
+export const getLocalData = (state: any) => () => {
+    return state.localdata;
+}
+
+/**
+ * 获取导航标签页面
+ * 
+ * @param state 
+ */
+export const getPage = (state: any) => (arg: any) => {
+    let page: any = null;
+    if (isNaN(arg)) {
+        const index = state.pageTagList.findIndex((page: any) => Object.is(page.fullPath, arg));
+        if (index >= 0) {
+            page = state.pageTagList[index];
+        }
+    } else {
+        page = state.pageTagList[arg];
+    }
+    return page;
+}
+
+/**
+ * 获取 z-index 
+ * 
+ * @param state 
+ */
+export const getZIndex = (state: any) => () => {
+    return state.zIndex;
+}
\ No newline at end of file

src/store/index.ts

+import Vue from 'vue';
+import Vuex from 'vuex';
+
+import { rootstate } from './state';
+// import * as actions from './actions';
+import * as mutations from './mutations';
+import * as getters from './getters';
+
+import viewaction from './modules/view-action'
+
+const state = {
+    ...rootstate
+};
+
+Vue.use(Vuex);
+
+const store = new Vuex.Store({
+    state,
+    // actions,
+    mutations,
+    getters,
+    modules: {
+        viewaction
+    },
+});
+
+export default store;

src/store/modules/view-action/actions.ts

+/**
+ * 数据保存后处理逻辑
+ * 
+ * @param param0 
+ * @param data 
+ */
+export const datasaved = ({ commit, state }: { commit: any, state: any }, data: any) => {
+    const createdviews: any[] = state.createdviews;
+
+    // 唯一标识获取临时数据参数
+    const { viewtag: secondtag } = data;
+    const createdview: any = createdviews.find((item: any) => Object.is(item.secondtag, secondtag));
+    if (!createdview) {
+        return;
+    }
+
+    // 视图发布唯一标识
+    const { viewtag: _viewtag } = createdview;
+    createdviews.forEach((item: any) => {
+        // 当前视图不参与刷新处理
+        if (Object.is(item.secondtag, secondtag)) {
+            return;
+        }
+        const {
+            refviews: _refviews,
+            secondtag: _secondtag,
+        }: {
+            refviews: string[],
+            _refviews: string[],
+            secondtag: string,
+            _secondtag: string,
+        } = item;
+        _refviews.some((viewid: string) => {
+            if (Object.is(viewid, _viewtag)) {
+                // 被引用视图刷新
+                commit('refreshViewData', { viewtag: _secondtag });
+                return true;
+            }
+            return false;
+        });
+    });
+}
\ No newline at end of file

src/store/modules/view-action/getters.ts

+/**
+ * 获取应用视图数据
+ * 
+ * @param state 
+ */
+export const getAppView = (state: any) => (viewtag: string) => {
+    const createdview = state.createdviews.find((appview: any) => Object.is(appview.secondtag, viewtag));
+    if (!createdview) {
+        console.log(`----视图 ${viewtag} 不存在-----`)
+        return null;
+    }
+    return createdview;
+}
+
+
+/**
+ * 获取视图是否需要刷新
+ * 
+ * @param state 
+ */
+export const getRefreshData = (state: any) => (viewtag: string) => {
+    const createdview = state.createdviews.find((appview: any) => Object.is(appview.secondtag, viewtag));
+    if (!createdview) {
+        console.log(`----视图 ${viewtag} 不存在-----`)
+        return null;
+    }
+    return createdview.refreshdata;
+}
\ No newline at end of file

src/store/modules/view-action/index.ts

+import { viewstate } from './state';
+import * as actions from './actions';
+import * as mutations from './mutations';
+import * as getters from './getters';
+
+const state = {
+    ...viewstate
+}
+
+export default {
+    namespaced: true,
+    state,
+    getters,
+    actions,
+    mutations
+}
\ No newline at end of file

src/store/modules/view-action/mutations.ts

+
+/**
+ * 创建视图
+ * 
+ * @param state 
+ * @param param1 
+ */
+export const createdView = (state: any, { viewtag, secondtag }: { viewtag: string, secondtag: string }) => {
+    // 该视图是否被创建
+    // const index = state.createdviews.findIndex((view: any) => Object.is(view.secondtag, viewtag));
+    // if (index !== -1) {
+    //     return;
+    // }
+    // 原始数据中是否存在
+    const appview = state.appviews.find((appview: any) => Object.is(appview.viewtag, viewtag));
+    if (!appview) {
+        console.log(`----视图标识 ${viewtag} 不存在-----`)
+        return;
+    }
+    const _appview: any = JSON.parse(JSON.stringify(appview));
+    Object.assign(_appview, { secondtag: secondtag, refreshdata: 0 });
+    _appview.refviews.forEach((refview: any) => {
+        refview = `${refview};${secondtag}`;
+    });
+    state.createdviews.push(_appview);
+}
+
+/**
+ * 删除视图
+ * 
+ * @param state 
+ * @param viewtag  视图标识
+ */
+export const removeView = (state: any, viewtag: string) => {
+    const index = state.createdviews.findIndex((view: any) => Object.is(view.secondtag, viewtag));
+    if (index === -1) {
+        return;
+    }
+    state.createdviews.splice(index, 1);
+}
+
+/**
+ * 设置视图数据变化状态
+ * 
+ * @param state 
+ * @param param1 
+ */
+export const setViewDataChange = (state: any, { viewtag, viewdatachange }: { viewtag: string, viewdatachange: boolean }) => {
+    const createdview = state.createdviews.find((appview: any) => Object.is(appview.secondtag, viewtag));
+    if (!createdview) {
+        console.log(`----视图标识 ${viewtag} 不存在-----`)
+        return;
+    }
+    createdview.viewdatachange = viewdatachange;
+}
+
+/**
+ * 刷新视图数据
+ * 
+ * @param state 
+ * @param param1 
+ */
+export const refreshViewData = (state: any, { viewtag }: { viewtag: string }) => {
+    const createdview = state.createdviews.find((appview: any) => Object.is(appview.secondtag, viewtag));
+    if (!createdview) {
+        console.log(`----视图标识 ${viewtag} 不存在-----`)
+        return;
+    }
+    createdview.refreshdata += 1;
+}

src/store/mutations.ts

+import { Environment } from './../environments/environment';
+
+/**
+ * 添加代码表
+ * 
+ * @param state 
+ * @param codelists 
+ */
+export const addCodeLists = (state: any, codelists: any) => {
+    state.codelists = [];
+    state.codelists = [...codelists];
+}
+
+/**
+ * 添加应用数据
+ * 
+ * @param state 
+ * @param localdata 
+ */
+export const addAppData = (state: any, appdata: string) => {
+    state.appdata = appdata;
+}
+
+/**
+ * 添加本地应用数据
+ * 
+ * @param state 
+ * @param localdata 
+ */
+export const addLocalData = (state: any, localdata: any = {}) => {
+    state.localdata = {};
+    Object.assign(state.localdata, localdata);
+}
+
+/**
+ * 更新代码表值
+ * 
+ * @param state 
+ * @param param1 
+ */
+export const updateCodeList = (state: any, { srfkey, items }: { srfkey: string, items: any[] }) => {
+    const index = state.codelists.findIndex((_codelist: any) => Object.is(_codelist.srfkey, srfkey));
+    if (index === -1) {
+        console.log(`${srfkey} ---- 代码表不存在`);
+        return;
+    }
+    state.codelists[index].items = [...items];
+}
+
+/**
+ * 修改主题
+ * 
+ * @param state 
+ * @param val 
+ */
+export const setCurrentSelectTheme = (state: any, val: any) => {
+    state.selectTheme = val;
+}
+
+/**
+ * 修改字体
+ * 
+ * @param state 
+ * @param val 
+ */
+export const setCurrentSelectFont = (state: any, val: any) => {
+    state.selectFont = val;
+}
+
+/**
+ * 重置分页导航数据
+ * 
+ * @param state 
+ */
+export const resetRootStateData = (state: any) => {
+    state.pageTagList = [];
+    state.pageMetas = [];
+    state.historyPathList = [];
+}
+
+/**
+ * 添加导航页面
+ * 
+ * @param state 
+ * @param arg 
+ */
+export const addPage = (state: any, arg: any) => {
+    if (!arg) {
+        return;
+    }
+    if (Object.is(arg.meta.viewType, 'APPINDEX')) {
+        window.sessionStorage.setItem(Environment.AppName, arg.fullPath);
+    } else {
+        const page: any = {};
+        const pageMeta: any = {};
+        Object.assign(page, arg);
+        Object.assign(pageMeta, page.meta, { info: null });
+        const index = state.pageTagList.findIndex((tag: any) => Object.is(tag.fullPath, page.fullPath));
+        if (index < 0) {
+            state.pageTagList.push(page);
+            state.pageMetas.push(pageMeta);
+        } else {
+            const index2 = state.historyPathList.indexOf(page.fullPath);
+            if (index2 >= 0) {
+                state.historyPathList.splice(index2, 1);
+            }
+        }
+        state.historyPathList.push(page.fullPath);
+    }
+}
+
+/**
+ * 删除导航页面
+ * 
+ * @param state 
+ * @param arg 
+ */
+export const deletePage = (state: any, arg: any) => {
+    let delPage: any = null;
+    if (isNaN(arg)) {
+        const index = state.pageTagList.findIndex((page: any) => Object.is(page.fullPath, arg));
+        if (index >= 0) {
+            delPage = state.pageTagList[index];
+            state.pageTagList.splice(index, 1);
+            state.pageMetas.splice(index, 1);
+        }
+    } else {
+        delPage = state.pageTagList[arg];
+        state.pageTagList.splice(arg, 1);
+        state.pageMetas.splice(arg, 1);
+    }
+    const index = state.historyPathList.findIndex((path: any) => Object.is(path, delPage.fullPath));
+    if (index >= 0) {
+        state.historyPathList.splice(index, 1);
+    }
+}
+
+/**
+ * 设置导航页面
+ * 
+ * @param state 
+ * @param arg 
+ */
+export const setCurPage = (state: any, arg: any) => {
+    let page: any = null;
+    if (isNaN(arg)) {
+        const index = state.pageTagList.findIndex((page: any) => Object.is(page.fullPath, arg));
+        if (index >= 0) {
+            page = state.pageTagList[index];
+        }
+    } else {
+        page = state.pageTagList[arg];
+    }
+    if (page) {
+        const index = state.historyPathList.findIndex((path: any) => Object.is(path, page.fullPath));
+        if (index >= 0) {
+            state.historyPathList.splice(index, 1);
+            state.historyPathList.push(page.fullPath);
+        }
+    }
+}
+
+/**
+ * 设置导航页面标题
+ * 
+ * @param state 
+ * @param param1 
+ */
+export const setCurPageCaption = (state: any, { route, caption, info }: { route: any, caption: string | null, info: string | null }) => {
+    if (route) {
+        const index = state.pageTagList.findIndex((page: any) => Object.is(page.fullPath, route.fullPath));
+        if (index >= 0) {
+            state.pageMetas[index].caption = caption;
+            state.pageMetas[index].info = info;
+        }
+    }
+}
+
+/**
+ * 添加当前视图视图标识
+ * 
+ * @param state 
+ * @param param1 
+ */
+export const addCurPageViewtag = (state: any, { fullPath, viewtag }: { fullPath: string, viewtag: string }) => {
+    const index = state.pageTagList.findIndex((page: any) => Object.is(page.fullPath, fullPath));
+    if (index >= 0) {
+        state.pageTagList[index].viewtag = viewtag;
+    }
+}
+
+/**
+ * 删除所有导航页面
+ * 
+ * @param state 
+ */
+export const removeAllPage = (state: any) => {
+    if (state.pageTagList.length > 0) {
+        state.pageMetas = [];
+        state.pageTagList = [];
+        state.historyPathList = [];
+    }
+}
+
+/**
+ * 删除其他导航页面
+ * 
+ * @param state 
+ */
+export const removeOtherPage = (state: any) => {
+    if (state.historyPathList.length > 0) {
+        const curPath = state.historyPathList[state.historyPathList.length - 1];
+        const index = state.pageTagList.findIndex((page: any) => Object.is(page.fullPath, curPath));
+        if (index >= 0) {
+            const page = state.pageTagList[index];
+            const meta: any = {};
+            Object.assign(meta, page.meta);
+            state.pageTagList = [];
+            state.pageMetas = [];
+            state.historyPathList = [];
+            state.historyPathList.push(page.fullPath);
+            state.pageTagList.push(page);
+            state.pageMetas.push(meta);
+        }
+    }
+}
+
+/**
+ * 更新 z-index 
+ * 
+ * @param state 
+ * @param zIndex 
+ */
+export const updateZIndex = (state: any, zIndex: number) => {
+    state.zIndex = zIndex;
+}
\ No newline at end of file

src/store/state.ts

+
+/**
+ * 根state
+ */
+export const rootstate: any = {
+    pageTagList: [],
+    pageMetas: [],
+    historyPathList: [],
+    codelists: [],
+    selectTheme: '',
+    selectFont: '',
+    appdata: '',
+    localdata: {},
+    zIndex: 300,
+}
\ No newline at end of file

src/styles/default.less

+@import '../../node_modules/font-awesome/less/font-awesome.less';
+@import '../theme/blue.theme.less';
+@import '../theme/dark-blue.theme.less';
+@import '../theme/default.theme.less';
+@import './var.css';
+
+
+.view-container {
+    height: calc(100% - 38px);
+    // height: 100%;
+    // display: flex;
+    padding: 0 15px;
+    // flex-direction: column;
+    > .view-card {
+        height: 100%;
+        // display: flex;
+        // flex-direction: column;
+        > .ivu-card-body {
+            // height: 50%;
+            // flex-grow: 1;
+            height: calc(100% - 51px);
+            overflow: auto;
+            padding: 0px;
+            > .content-container {
+                height: 100%;
+                display: flex;
+                margin: 0;
+                flex-direction: column;
+            }
+        }
+    }
+    > .view-card.view-no-caption {
+        > .ivu-card-body {
+            height: 100%;
+        }
+    }
+}
+.viewcontainer2 {
+    height: 100%;
+    width: 100%;
+}
+.viewcontainer3 {
+    height: 100%;
+    width: 100%;
+    padding: 0px;
+}
+
+
+/***    BRGIN:加载遮罩    ***/
+.el-loading-mask {
+    background-color: initial;
+    .el-loading-spinner {
+        .path {
+            stroke-width: 3px;
+        }
+    }
+}
+/***    END:加载遮罩    ***/
+
+.grid-row-select {
+    background-color: #ecf5ff !important;
+    td {
+        background-color: #ecf5ff !important;
+    }
+}
+
+/***    BRGIN:表单错误信息2    ***/
+.app-form-item-error-info {
+    display: flex;
+    .icon {
+        width: 30px;
+        flex-shrink: 0;
+    }
+    .contant{
+        flex-grow: 1;
+    }
+}
+/***    END:表单错误信息2    ***/
+
+/***    BRGIN:多数据视图属性布局    ***/
+.property-layout-left, .property-layout-right {
+    display: flex;
+    height: 100%;
+    > div {
+        height: 100%;
+    }
+    > div:nth-child(1) {
+        flex-grow: 1;
+        padding-left: 0;
+        display: flex;
+        flex-direction: column;
+    }
+    > div:nth-child(2) {
+        flex-shrink: 0;
+    }
+}
+.property-layout-top, .property-layout-bottom {
+    display: flex;
+    height: 100%;
+    > div:nth-child(1) {
+        flex-grow: 1;
+        display: flex;
+        flex-direction: column;
+    }
+    > div:nth-child(2) {
+        flex-shrink: 0;
+    }
+}
+.property-layout-left {
+    flex-direction: row-reverse;
+    > div:nth-child(1) {
+        border-left: 1px solid #ddd;
+        padding-left: 16px;
+    }
+}
+.property-layout-right {
+    flex-direction: row;
+    > div:nth-child(1) {
+        border-right: 1px solid #ddd;
+        padding-right: 16px;
+    }
+}
+.property-layout-top {
+    flex-direction: column-reverse;
+    > div:nth-child(1) {
+        border-top: 1px solid #ddd;
+        padding-top: 16px;
+    }
+}
+.property-layout-bottom {
+    flex-direction: column;
+    > div:nth-child(1) {
+        border-bottom: 1px solid #ddd;
+        padding-bottom: 16px;
+    }
+}
+/***    END:多数据视图属性布局    ***/
+
+@import './user.less';
\ No newline at end of file

src/styles/var.css

+:root {
+    --app-color-primary: #3880ff;
+    --app-color-primary-rgb: 56,128,255;
+    --app-color-primary-contrast: #ffffff;
+    --app-color-primary-contrast-rgb: 255,255,255;
+    --app-color-primary-shade: #3171e0;
+    --app-color-primary-tint: #4c8dff;
+  
+    --app-color-secondary: #0cd1e8;
+    --app-color-secondary-rgb: 12,209,232;
+    --app-color-secondary-contrast: #ffffff;
+    --app-color-secondary-contrast-rgb: 255,255,255;
+    --app-color-secondary-shade: #0bb8cc;
+    --app-color-secondary-tint: #24d6ea;
+  
+    --app-color-tertiary: #7044ff;
+    --app-color-tertiary-rgb: 112,68,255;
+    --app-color-tertiary-contrast: #ffffff;
+    --app-color-tertiary-contrast-rgb: 255,255,255;
+    --app-color-tertiary-shade: #633ce0;
+    --app-color-tertiary-tint: #7e57ff;
+  
+    --app-color-success: #10dc60;
+    --app-color-success-rgb: 16,220,96;
+    --app-color-success-contrast: #ffffff;
+    --app-color-success-contrast-rgb: 255,255,255;
+    --app-color-success-shade: #0ec254;
+    --app-color-success-tint: #28e070;
+  
+    --app-color-warning: #ffce00;
+    --app-color-warning-rgb: 255,206,0;
+    --app-color-warning-contrast: #ffffff;
+    --app-color-warning-contrast-rgb: 255,255,255;
+    --app-color-warning-shade: #e0b500;
+    --app-color-warning-tint: #ffd31a;
+  
+    --app-color-danger: #f04141;
+    --app-color-danger-rgb: 245,61,61;
+    --app-color-danger-contrast: #ffffff;
+    --app-color-danger-contrast-rgb: 255,255,255;
+    --app-color-danger-shade: #d33939;
+    --app-color-danger-tint: #f25454;
+  
+    --app-color-dark: #222428;
+    --app-color-dark-rgb: 34,34,34;
+    --app-color-dark-contrast: #ffffff;
+    --app-color-dark-contrast-rgb: 255,255,255;
+    --app-color-dark-shade: #1e2023;
+    --app-color-dark-tint: #383a3e;
+  
+    --app-color-medium: #989aa2;
+    --app-color-medium-rgb: 152,154,162;
+    --app-color-medium-contrast: #ffffff;
+    --app-color-medium-contrast-rgb: 255,255,255;
+    --app-color-medium-shade: #86888f;
+    --app-color-medium-tint: #a2a4ab;
+  
+    --app-color-light: #f4f5f8;
+    --app-color-light-rgb: 244,244,244;
+    --app-color-light-contrast: #000000;
+    --app-color-light-contrast-rgb: 0,0,0;
+    --app-color-light-shade: #d7d8da;
+    --app-color-light-tint: #f5f6f9;
+  }

src/template.html

+<!DOCTYPE html>
+<html lang="en">
+  <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><%= htmlWebpackPlugin.options.title %></title>
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but app 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/theme/blue.theme.less

+/***    BRGIN:默认蓝色主题    ***/
+.app_theme_blue {
+    > header {
+        background-color: #2d5f8b;
+        color: #6ba1d1;
+        .app-theme-icon {
+            color: #6ba1d1;
+        }
+        .page-logo {
+            color: #ffffff;
+        }
+        .header-right {
+            .app-header-user {
+                background: #28547c; 
+            }
+            > div:hover {
+                background: #3774aa;
+            }
+        }
+        .el-menu.el-menu--horizontal {
+            > .el-menu-item, > .el-submenu > .el-submenu__title {
+                background: #2d5f8b;
+                color: #6ba1d1;
+                i {
+                    color: #6ba1d1;
+                }
+            }
+            > .el-menu-item.is-active, > .el-submenu.is-active > .el-submenu__title {
+                background-color: #4276a4;
+                color: #f1f1f1;
+                i {
+                    color: #f1f1f1;
+                }
+            }
+            > .el-menu-item:hover, > .el-submenu:hover > .el-submenu__title {
+                background-color: #3c6c95;
+                color: #f1f1f1 !important;
+                i {
+                    color: #f1f1f1;
+                }
+            }
+        }
+    }
+    > .ivu-layout {
+        > .ivu-layout-sider {
+            background-color: #4276a4;
+            .sider-top {
+                .ivu-icon {
+                    background: #2d5f8b;
+                    color: #6ba1d1;
+                }
+            }
+            .app-menu {
+                > .el-menu-item.is-active, > .el-submenu.is-active > .el-submenu__title {
+                    border-left: 4px solid #d64635;
+                }
+            }
+        }
+    }
+    > .el-menu , > .ivu-layout > .ivu-layout-sider .app-app-menu > .app-menu {
+        background: #4276a4;
+        .el-menu-item:hover, .el-menu-item.is-active {
+            background: #3c6c95 !important;
+            color: #f1f1f1 !important;
+            i {
+                color: #f1f1f1;
+            }
+        }
+        .el-submenu.is-opened, .el-submenu:hover, .el-submenu.is-active {
+            > .el-submenu__title {
+                background: #3c6c95 !important;
+                color: #f1f1f1 !important;
+                i {
+                    color: #f1f1f1;
+                }
+            }
+        }
+        .el-submenu__title, .el-menu-item {
+            color: #c9dff5;
+            i {
+                color: #c9dff5;
+            }
+        }
+        .el-menu-item {
+            border-top: 1px solid #4276a4;
+            background: #4276a4;
+        }
+        .el-submenu {
+            border-top: 1px solid #4276a4;
+            background: #4276a4;
+            > .el-menu {
+                border-top: 1px solid #4276a4;
+                background: #4276a4;
+            }
+        }
+    }
+    .ivu-menu-light{
+        background: #4276a4;
+    }
+    .ivu-menu-submenu-title{
+        color: #f5f5f5;
+    }
+}
+/***    END:默认蓝色主题   ***/
\ No newline at end of file

src/theme/dark-blue.theme.less

+/***    BRGIN:默认Dark Blue主题    ***/
+.app_theme_darkblue {
+    > header {
+        background-color: #2b3643;
+        color: #606d80;
+        .app-theme-icon {
+            color: #606d80;
+        }
+        .page-logo {
+            color: #ffffff;
+        }
+        .header-right {
+            .app-header-user {
+                background: #232c37; 
+            }
+            > div:hover {
+                background: #3b4a5c;
+            }
+        }
+        .el-menu.el-menu--horizontal {
+            > .el-menu-item, > .el-submenu > .el-submenu__title {
+                background: #2b3643;
+                color: #606d80;
+                i {
+                    color: #606d80;
+                }
+            }
+            > .el-menu-item.is-active, > .el-submenu.is-active > .el-submenu__title {
+                background-color: #364150;
+                color: #f1f1f1;
+                i {
+                    color: #f1f1f1;
+                }
+            }
+            > .el-menu-item:hover, > .el-submenu:hover > .el-submenu__title {
+                background-color: #3e4b5c;
+                color: #f1f1f1 !important;
+                i {
+                    color: #f1f1f1;
+                }
+            }
+        }
+    }
+    > .ivu-layout {
+        > .ivu-layout-sider {
+            background-color: #364150;
+            .sider-top {
+                .ivu-icon {
+                    background: #2b3643;
+                    color: #606d80;
+                }
+            }
+            .app-menu {
+                > .el-menu-item.is-active, > .el-submenu.is-active > .el-submenu__title {
+                    border-left: 4px solid #1caf9a;
+                }
+            }
+        }
+    }
+    > .el-menu , > .ivu-layout > .ivu-layout-sider .app-app-menu > .app-menu {
+        background: #364150;
+        .el-menu-item:hover, .el-menu-item.is-active {
+            background: #3e4b5c !important;
+            color: #f1f1f1 !important;
+            i {
+                color: #f1f1f1;
+            }
+        }
+        .el-submenu.is-opened, .el-submenu:hover, .el-submenu.is-active {
+            > .el-submenu__title {
+                background: #3e4b5c !important;
+                color: #f1f1f1 !important;
+                i {
+                    color: #f1f1f1;
+                }
+            }
+        }
+        .el-submenu__title, .el-menu-item {
+            color: #b4bcc8;
+            i {
+                color: #b4bcc8;
+            }
+        }
+        .el-menu-item {
+            border-top: 1px solid #364150;
+            background: #364150;
+        }
+        .el-submenu {
+            border-top: 1px solid #364150;
+            background: #364150;
+            > .el-menu {
+                border-top: 1px solid #364150;
+                background: #364150;
+            }
+        }
+    }
+    .ivu-menu-light{
+        background: #364150;
+    }
+    .ivu-menu-submenu-title{
+        color: #fff;
+    }
+}
+/***    END:默认Dark Blue主题   ***/
\ No newline at end of file

src/theme/default.theme.less

+/***    BRGIN:默认亮色主题    ***/
+.app-default-theme {
+    > header {
+        background-color: #e1e1e1;
+        color: #aaaaaa;
+        .app-theme-icon {
+            color: #aaaaaa;
+        }
+        .page-logo {
+            color: #535c70;
+        }
+        .header-right {
+            .app-header-user {
+                background: #d9d9d9; 
+            }
+            > div:hover {
+                background: #d4d4d4;
+            }
+        }
+        .el-menu.el-menu--horizontal {
+            > .el-menu-item, > .el-submenu > .el-submenu__title {
+                background: #e1e1e1;
+                color: #aaaaaa;
+                i {
+                    color: #aaaaaa;
+                }
+            }
+            > .el-menu-item.is-active, > .el-submenu.is-active > .el-submenu__title {
+                background-color: #f6f6f6;
+                color: #666666;
+                i {
+                    color: #666666;
+                }
+            }
+            > .el-menu-item:hover, > .el-submenu:hover > .el-submenu__title {
+                background-color: #e9e9e9;
+                color: #666666 !important;
+                i {
+                    color: #666666;
+                }
+            }
+        }
+    }
+    > .ivu-layout {
+        > .ivu-layout-sider {
+            background-color: #f6f6f6;
+            .sider-top {
+                .ivu-icon {
+                    background: #ccd3dd;
+                    color: #fff;
+                }
+            }
+            .app-menu {
+                > .el-menu-item.is-active, > .el-submenu.is-active > .el-submenu__title {
+                    border-left: 4px solid #3fd5c0;
+                }
+            }
+        }
+    }
+    > .el-menu , > .ivu-layout > .ivu-layout-sider .app-app-menu > .app-menu {
+        background: #f6f6f6;
+        .el-menu-item:hover, .el-menu-item.is-active {
+            background: #e9e9e9 !important;
+            color: #666666 !important;
+            i {
+                color: #666666;
+            }
+        }
+        .el-submenu.is-opened, .el-submenu:hover, .el-submenu.is-active {
+            > .el-submenu__title {
+                background: #e9e9e9 !important;
+                color: #666666 !important;
+                i {
+                    color: #666666;
+                }
+            }
+        }
+        .el-submenu__title, .el-menu-item {
+            color: #666666;
+            i {
+                color: #666666;
+            }
+        }
+        .el-menu-item {
+            border-top: 1px solid #f6f6f6;
+            background: #f6f6f6;
+        }
+        .el-submenu {
+            border-top: 1px solid #f6f6f6;
+            background: #f6f6f6;
+            > .el-menu {
+                border-top: 1px solid #f6f6f6;
+                background: #f6f6f6;
+            }
+        }
+    }
+    .ivu-menu-light{
+        background: #f6f6f6;
+    }
+    .ivu-menu-submenu-title{
+        color: #000;
+    }
+}
+/***    END:默认亮色主题   ***/
\ No newline at end of file

src/user-register.ts

+export const UserComponent = {
+    install(v: any, opt: any) {
+
+    }
+};
\ No newline at end of file

src/utils/app-drawer/app-drawer.less

+.ivu-drawer-body{
+    padding: 0;
+    .viewcontainer2{
+        .ivu-card{
+            border-radius: 0;
+        }
+    }
+}
\ No newline at end of file

src/utils/app-drawer/app-drawer.tsx

+import Vue from 'vue';
+import { Subject } from 'rxjs';
+import store from '../../store';
+import i18n from '@/locale';
+
+import './app-drawer.less';
+
+export class AppDrawer {
+
+    /**
+     * 实例对象
+     *
+     * @private
+     * @static
+     * @memberof AppDrawer
+     */
+    private static readonly $drawer = new AppDrawer();
+
+    /**
+     * 构造方法
+     * 
+     * @memberof AppDrawer
+     */
+    constructor() {
+        if (AppDrawer.$drawer) {
+            return AppDrawer.$drawer;
+        }
+    }
+
+    /**
+     * vue 实例
+     *
+     * @private
+     * @type {Vue}
+     * @memberof AppDrawer
+     */
+    private vueExample!: Vue;
+
+    /**
+     * 获取实例对象
+     *
+     * @static
+     * @returns
+     * @memberof AppDrawer
+     */
+    public static getInstance() {
+        return AppDrawer.$drawer;
+    }
+
+    /**
+     * 创建 Vue 实例对象
+     *
+     * @private
+     * @param {{ viewname: string, title: string, width?: number, height?: number, placement?: any }} view
+     * @param {*} [data={}]
+     * @param {string} uuid
+     * @returns {Subject<any>}
+     * @memberof AppDrawer
+     */
+    private createVueExample(view: { viewname: string, title: string, width?: number, height?: number, placement?: any }, data: any = {}, uuid: string): Subject<any> {
+        let subject: null | Subject<any> = new Subject<any>();
+        const div = document.createElement('div');
+        div.setAttribute('id', uuid);
+        document.body.appendChild(div);
+        const vueExample = new Vue({
+            store: store,
+            i18n: i18n,
+            el: div,
+            data() {
+                let data = {
+                    isShow: false,
+                    viewname: '',
+                    tempResult: { ret: '' },
+                    placement: '',
+                    width: 256,
+                    zIndex: null,
+                }
+                return data;
+            },
+            created() {
+                this.viewname = view.viewname;
+                this.placement = view.placement === 'DRAWER_LEFT' ? 'left' : 'right';
+                if (view.width) {
+                    if (view.width.toString().indexOf('px') > 0) {
+                        if (!Object.is(view.width, '0px')) {
+                            this.width = parseInt(view.width.toString().slice(0, view.width.toString().length - 2));
+                        } else {
+                            this.width = 800;
+                        }
+                    } else {
+                        if (view.width !== 0) {
+                            this.width = view.width;
+                        } else {
+                            this.width = 800;
+                        }
+                    }
+                } else {
+                    this.width = 800;
+                }
+                document.onkeydown = (e) => {
+                    var keyCode = e.keyCode || e.which || e.charCode;
+                    if (keyCode == 27) {
+                        this.isShow = false;
+                    }
+                }
+            },
+            mounted() {
+                this.isShow = true;
+                this.handleZIndex('ivu-drawer-mask', 'ivu-drawer-wrap');
+            },
+            beforeDestroy() {
+                if (this.zIndex) {
+                    const zIndex: any = this.zIndex;
+                    this.$store.commit('updateZIndex', zIndex - 100);
+                }
+            },
+            methods: {
+                // 处理 z-index
+                handleZIndex: function (mask: string, wrap: string) {
+                    const zIndex = this.$store.getters.getZIndex();
+                    if (zIndex) {
+                        this.zIndex = zIndex + 100;
+                        this.$store.commit('updateZIndex', this.zIndex);
+                    }
+                    const element: Element = this.$el;
+                    const maskTag: any = element.getElementsByClassName(mask)[0];
+                    const warpTag: any = element.getElementsByClassName(wrap)[0];
+                    maskTag.style.zIndex = this.zIndex;
+                    warpTag.style.zIndex = this.zIndex;
+                },
+                close: function (result: any) {
+                    if (result && Array.isArray(result) && result.length > 0) {
+                        Object.assign(this.tempResult, { ret: 'OK' }, { datas: JSON.parse(JSON.stringify(result)) });
+                    }
+                    this.isShow = false;
+                },
+                dataChange: function (result: any) {
+                    this.tempResult = { ret: '' };
+                    if (result && Array.isArray(result) && result.length > 0) {
+                        Object.assign(this.tempResult, { ret: 'OK' }, { datas: JSON.parse(JSON.stringify(result)) });
+                    }
+                },
+                viewDatasActivated: function (result: any) {
+                    if (result && Array.isArray(result) && result.length > 0) {
+                        this.close(result);
+                    }
+                },
+                onVisibleChange: function ($event: any) {
+                    const component: any = this.$refs[this.viewname];
+                    if (component) {
+                        const { viewtag: _viewtag } = component;
+                        const appview = this.$store.getters['viewaction/getAppView'](_viewtag);
+                        if (appview && appview.viewdatachange) {
+                            this.isShow = true;
+                            const title: any = this.$t('app.tabpage.sureclosetip.title');
+                            const contant: any = this.$t('app.tabpage.sureclosetip.content');
+                            this.$Modal.confirm({
+                                title: title,
+                                content: contant,
+                                onOk: () => {
+                                    this.$store.commit('viewaction/setViewDataChange', { viewtag: _viewtag, viewdatachange: false });
+                                    this.isShow = false;
+                                },
+                                onCancel: () => {
+                                    this.isShow = true;
+                                }
+                            });
+                        } else {
+                            this.handleShowState($event);
+                        }
+                    }
+                },
+                handleShowState: function ($event: any) {
+                    if ($event) {
+                        return;
+                    }
+                    if (subject) {
+                        if (this.tempResult && Object.is(this.tempResult.ret, 'OK')) {
+                            subject.next(this.tempResult);
+                        }
+                    }
+                    setTimeout(() => {
+                        vueExample.$destroy();
+                        document.body.removeChild(vueExample.$el);
+                        subject = null;
+                    }, 500)
+                },
+            },
+            render() {
+                return (
+                    <drawer
+                        placement={this.placement}
+                        closable={false}
+                        v-model={this.isShow}
+                        width={this.width}
+                        on-on-visible-change={($event: any) => this.onVisibleChange($event)}>
+                        {
+                            this.viewname && !Object.is(this.viewname, '') ?
+                                this.$createElement(this.viewname, {
+                                    class: {
+                                        viewcontainer2: true,
+                                    },
+                                    props: {
+                                        viewdata: JSON.stringify(data)
+                                    },
+                                    on: {
+                                        viewdataschange: ($event: any) => this.dataChange($event),
+                                        viewdatasactivated: ($event: any) => this.viewDatasActivated($event),
+                                        close: ($event: any) => this.close($event)
+                                    },
+                                    ref: this.viewname,
+                                }) : ''
+                        }
+                    </drawer>
+                );
+            }
+        });
+        return subject;
+    }
+
+    /**
+     * 打开抽屉
+     *
+     * @param {({ viewname: string, title: string, width?: number, height?: number, placement?: 'DRAWER_LEFT' | 'DRAWER_RIGHT'  })} view
+     * @param {*} [data={}]
+     * @returns {Subject<any>}
+     * @memberof AppDrawer
+     */
+    public openDrawer(view: { viewname: string, title: string, width?: number, height?: number, placement?: 'DRAWER_LEFT' | 'DRAWER_RIGHT' }, data: any = {}): Subject<any> {
+        try {
+            const uuid = this.getUUID();
+            const subject = this.createVueExample(view, data, uuid);
+            return subject;
+        } catch (error) {
+            console.log(error);
+            return new Subject<any>();
+        }
+    }
+
+    /**
+     * 生成uuid
+     *
+     * @private
+     * @returns {string}
+     * @memberof AppDrawer
+     */
+    private getUUID(): string {
+        function s4() {
+            return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
+        }
+        return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
+    }
+
+
+}
\ No newline at end of file

src/utils/app-modal/app-modal.less

+.app-modal {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    .ivu-modal {
+        height: calc(100vh - 100px);
+        top: 0px;
+        .ivu-modal-content {
+            height: 100%;
+            .ivu-modal-body {
+                padding: 0;
+                height: calc(100% - 52px);
+            }
+        }
+    }
+}
\ No newline at end of file

src/utils/app-modal/app-modal.tsx

+import Vue from 'vue';
+import { Subject } from 'rxjs';
+import store from '../../store';
+import i18n from '@/locale';
+
+import './app-modal.less';
+
+export class AppModal {
+
+    /**
+     * 实例对象
+     *
+     * @private
+     * @static
+     * @memberof AppModal
+     */
+    private static modal = new AppModal();
+
+    /**
+     * vue 实例
+     *
+     * @private
+     * @type {Vue}
+     * @memberof AppModal
+     */
+    private vueExample!: Vue;
+
+    /**
+     * Creates an instance of AppModal.
+     * 
+     * @memberof AppModal
+     */
+    private constructor() {
+        if (AppModal.modal) {
+            return AppModal.modal;
+        }
+    }
+
+    /**
+     * 获取单例对象
+     *
+     * @static
+     * @returns {AppModal}
+     * @memberof AppModal
+     */
+    public static getInstance(): AppModal {
+        if (!AppModal.modal) {
+            AppModal.modal = new AppModal();
+        }
+        return AppModal.modal;
+    }
+
+    /**
+     * 创建 Vue 实例对象
+     *
+     * @private
+     * @param {{ viewname: string, title: string, width?: number, height?: number }} view
+     * @param {*} [data={}]
+     * @param {string} uuid
+     * @returns {Subject<any>}
+     * @memberof AppModal
+     */
+    private createVueExample(view: { viewname: string, title: string, width?: number, height?: number }, data: any = {}, uuid: string): Subject<any> {
+        let subject: null | Subject<any> = new Subject<any>();
+        const div = document.createElement('div');
+        div.setAttribute('id', uuid);
+        document.body.appendChild(div);
+        const vueExample = new Vue({
+            store: store,
+            i18n: i18n,
+            el: div,
+            data() {
+                let data = {
+                    isShow: false,
+                    isfullscreen: false,
+                    tempResult: { ret: '' },
+                    viewname: '',
+                    title: '',
+                    width: 0,
+                    zIndex: null,
+                    style: {},
+                }
+                return data;
+            },
+            created() {
+                this.viewname = view.viewname;
+                this.title = view.title;
+                if ((!view.width || view.width === 0 || Object.is(view.width, '0px'))) {
+                    let width = 600;
+                    if (window && window.innerWidth > 100) {
+                        if (window.innerWidth > 100) {
+                            width = window.innerWidth - 100;
+                        } else {
+                            width = window.innerWidth;
+                        }
+                    }
+                    this.width = width;
+                } else {
+                    this.width = view.width;
+                }
+                if (view.height && !Object.is(view.height, '0px')) {
+                    Object.assign(this.style, { height: view.height + 'px' });
+                }
+            },
+            mounted() {
+                const curmodal: any = this.$refs.curmodal;
+                curmodal.handleGetModalIndex = () => {
+                    return 0;
+                };
+                const zIndex = this.$store.getters.getZIndex();
+                if (zIndex) {
+                    this.zIndex = zIndex + 100;
+                    this.$store.commit('updateZIndex', this.zIndex);
+                }
+                this.isShow = true;
+            },
+            beforeDestroy() {
+                if (this.zIndex) {
+                    const zIndex: any = this.zIndex;
+                    this.$store.commit('updateZIndex', zIndex - 100);
+                }
+            },
+            methods: {
+                close: function (result: any) {
+                    if (result && Array.isArray(result) && result.length > 0) {
+                        Object.assign(this.tempResult, { ret: 'OK' }, { datas: JSON.parse(JSON.stringify(result)) });
+                    }
+                    this.isShow = false;
+                },
+                dataChange: function (result: any) {
+                    this.tempResult = { ret: '' };
+                    if (result && Array.isArray(result) && result.length > 0) {
+                        Object.assign(this.tempResult, { ret: 'OK' }, { datas: JSON.parse(JSON.stringify(result)) });
+                    }
+                },
+                viewDatasActivated: function (result: any) {
+                    if (result && Array.isArray(result) && result.length > 0) {
+                        this.close(result);
+                    }
+                },
+                onVisibleChange: function ($event: any) {
+                    const component: any = this.$refs[this.viewname];
+                    if (component) {
+                        const { viewtag: _viewtag } = component;
+                        const appview = this.$store.getters['viewaction/getAppView'](_viewtag);
+                        if (appview && appview.viewdatachange) {
+                            this.isShow = true;
+                            const title: any = this.$t('app.tabpage.sureclosetip.title');
+                            const contant: any = this.$t('app.tabpage.sureclosetip.content');
+                            this.$Modal.confirm({
+                                title: title,
+                                content: contant,
+                                onOk: () => {
+                                    this.$store.commit('viewaction/setViewDataChange', { viewtag: _viewtag, viewdatachange: false });
+                                    this.isShow = false;
+                                },
+                                onCancel: () => {
+                                    this.isShow = true;
+                                }
+                            });
+                        } else {
+                            this.handleShowState($event);
+                        }
+                    }
+                },
+                handleShowState: function ($event: any) {
+                    if ($event) {
+                        return;
+                    }
+                    if (subject) {
+                        if (this.tempResult && Object.is(this.tempResult.ret, 'OK')) {
+                            subject.next(this.tempResult);
+                        }
+                    }
+                    setTimeout(() => {
+                        vueExample.$destroy();
+                        document.body.removeChild(vueExample.$el);
+                        subject = null;
+                    }, 500)
+                },
+            },
+            render() {
+                return (
+                    <modal
+                        ref='curmodal'
+                        class-name='app-modal'
+                        v-model={this.isShow}
+                        fullscreen={this.isfullscreen}
+                        title={this.title}
+                        footer-hide={true}
+                        mask-closable={false}
+                        width={this.width}
+                        styles={this.style}
+                        z-index={this.zIndex}
+                        on-on-visible-change={($event: any) => this.onVisibleChange($event)}>
+                        {
+                            this.viewname && !Object.is(this.viewname, '') ?
+                                this.$createElement(this.viewname, {
+                                    class: {
+                                        viewcontainer2: true,
+                                    },
+                                    props: {
+                                        viewdata: JSON.stringify(data)
+                                    },
+                                    on: {
+                                        viewdataschange: ($event: any) => this.dataChange($event),
+                                        viewdatasactivated: ($event: any) => this.viewDatasActivated($event),
+                                        close: ($event: any) => this.close($event)
+                                    },
+                                    ref: this.viewname,
+                                }) : ''
+                        }
+                    </modal>
+                );
+            }
+        });
+        this.vueExample = vueExample;
+        return subject;
+    }
+
+    /**
+     * 打开模态视图
+     *
+     * @param {{ viewname: string, title: string, width?: number, height?: number }} view
+     * @param {*} [data={}]
+     * @returns {Subject<any>}
+     * @memberof AppModal
+     */
+    public openModal(view: { viewname: string, title: string, width?: number, height?: number }, data: any = {}): Subject<any> {
+        try {
+            const uuid = this.getUUID();
+            const subject = this.createVueExample(view, data, uuid);
+            return subject;
+        } catch (error) {
+            console.log(error);
+            return new Subject<any>();
+        }
+    }
+
+    /**
+     * 获取节点标识
+     *
+     * @private
+     * @returns {string}
+     * @memberof AppModal
+     */
+    private getUUID(): string {
+        function s4() {
+            return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
+        }
+        return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
+    }
+
+}
\ No newline at end of file

src/utils/app-popover/app-popover.less

+.el-popover {
+    overflow-y: auto;
+    //z-index: 99 !important;
+    background: var(--app-bg-sider-content);
+    border: 1px solid var(--app-color-font-content);
+    padding: 0px;
+    z-index: 2000;
+    color: var(--app-color-font-content);
+    line-height: 1.4;
+    text-align: justify;
+    font-size: 14px;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    overflow-y: hidden;
+    .el-card__header {
+        padding: 5px 10px;
+        border-bottom: 1px solid var(--app-color-split-trigger);
+        color: var(--app-color-font-content);
+    }
+    .el-card{
+        min-width: 150px;
+        border: none;
+        background-color: var(--app-bg-content);
+        color: var(--app-color-font-content);
+    }
+    .el-card__body {
+        padding: 0px;
+        overflow-x:hidden;
+        overflow-y: auto;
+        .viewcontainer2{
+            .content-container{
+                margin: 0;
+            }
+        }
+    }
+}
+.clearfix{
+    position: relative;
+    .cancel{
+        position: absolute;
+        right: 5px;
+        top: 5px;
+    }
+}
\ No newline at end of file

src/utils/app-popover/app-popover.tsx

+import Vue, { CreateElement } from 'vue';
+import PopperJs from 'popper.js';
+import { on } from '../dom/dom';
+import './app-popover.less';
+
+import store from '../../store';
+import i18n from '@/locale';
+
+import { Subject } from 'rxjs';
+
+/**
+ * 悬浮窗控制器实例
+ *
+ * @export
+ * @class AppPopover
+ */
+export class AppPopover {
+    /**
+     * 实例
+     *
+     * @private
+     * @static
+     * @memberof AppPopover
+     */
+    private static readonly $popover = new AppPopover();
+    /**
+     * vue实例
+     *
+     * @private
+     * @type {Vue}
+     * @memberof AppPopover
+     */
+    private vueExample!: Vue;
+    /**
+     * PopperJs实例
+     *
+     * @private
+     * @type {PopperJs}
+     * @memberof AppPopover
+     */
+    private popperExample?: PopperJs;
+    /**
+     * 是否显示悬浮窗
+     *
+     * @private
+     * @type {boolean}
+     * @memberof AppPopover
+     */
+    private showPopper: boolean = false;
+    /**
+     * 是否在点击空白区域时自动关闭
+     *
+     * @private
+     * @type {boolean}
+     * @memberof AppPopover
+     */
+    private isAutoClose: boolean = true;
+    /**
+     * 当前激活popver标识
+     *
+     * @private
+     * @type {string}
+     * @memberof AppPopover
+     */
+    private activePopoverTag?: string;
+
+    /**
+     * 返回数据
+     */
+    private tempResult = { ret: '' };
+
+    /**
+     * 数据传递对象
+     */
+    private subject: any;
+
+    /**
+     * 气泡卡片层级
+     *
+     * @private
+     * @type {(number | null)}
+     * @memberof AppPopover
+     */
+    private zIndex: number | null = null;
+
+    /**
+     * Creates an instance of AppPopover.
+     * @memberof AppPopover
+     */
+    constructor() {
+        if (AppPopover.$popover) {
+            return AppPopover.$popover;
+        }
+        on(document, 'click', () => {
+            if (!this.showPopper || !this.isAutoClose) {
+                return;
+            }
+            this.destroy();
+        });
+    }
+
+    /**
+     * 初始化vue实例
+     *
+     * @private
+     * @returns {void}
+     * @memberof AppPopover
+     */
+    private initVueExample(): void {
+        const div = document.createElement('div');
+        document.body.appendChild(div);
+        this.vueExample = new Vue({
+            el: div,
+            store: store,
+            i18n: i18n,
+            data: {
+                title: null,
+                content: null,
+                isShow: false
+            },
+            render(h: CreateElement) {
+                const content: any = this.content;
+                const style: string = `display: ${this.isShow ? 'block' : 'none'};`;
+                return <div style={style} class="el-popover el-popper panel-design-popover">
+                    <el-card ref="datacard">
+                        {
+                            this.title ? <div slot="header" class="clearfix">
+                                <span>{this.title}</span>
+                                <span class="cancel" ref="cancel"><i class="fa fa-times" aria-hidden="true" style="cursor: pointer;"></i></span>
+                            </div> : null
+                        }
+                        <div style="height:100%;">
+                            {content ? content(h) : null}
+                        </div>
+                    </el-card>
+                    <div x-arrow class="popper__arrow"></div>
+                </div>;
+            }
+        });
+        on(this.vueExample.$el, 'click', (event: any) => {
+            if (Object.is(event.target.outerHTML, '<i aria-hidden="true" class="fa fa-times" style="cursor: pointer;"></i>')) {
+                this.destroy();
+            } else {
+                event.stopPropagation();
+            }
+        });
+    }
+
+    /**
+     * 打开悬浮窗
+     *
+     * @param {MouseEvent} event
+     * @param {*} view
+     * @param {*} data
+     * @param {string} [title]
+     * @param {PopperJs.Placement} [position='left']
+     * @param {boolean} [isAutoClose=true]
+     * @param {number} [width]
+     * @param {number} [height]
+     * @returns {*}
+     * @memberof AppPopover
+     */
+    public openPop(event: MouseEvent, view: any, data: any, title?: string, position: PopperJs.Placement = 'left', isAutoClose: boolean = true, width?: number, height?: number): any {
+        this.subject = new Subject<any>();
+        this.openPopover(event, (h: CreateElement) => {
+            return h(view.viewname, {
+                class: {
+                    viewcontainer2: true,
+                },
+                props: {
+                    viewdata: JSON.stringify(data)
+                },
+                on: {
+                    viewdataschange: ($event: any) => this.dataChange($event),
+                    close: ($event: any) => this.viewclose($event)
+                },
+            })
+        }, view.title, undefined, false, view.width, view.height);
+        return this.subject;
+    }
+
+    /**
+     * 数据变化回调
+     * @param $event 
+     */
+    public dataChange(result: any) {
+        this.tempResult = { ret: '' };
+        if (result && Array.isArray(result) && result.length > 0) {
+            Object.assign(this.tempResult, { ret: 'OK' }, { datas: JSON.parse(JSON.stringify(result)) });
+        }
+        this.close();
+        this.destroy();
+    }
+
+    /**
+     * 视图关闭
+     * @param result 
+     */
+    public viewclose(result: any) {
+        if (result && Array.isArray(result) && result.length > 0) {
+            Object.assign(this.tempResult, { datas: JSON.parse(JSON.stringify(result)) });
+        }
+        this.destroy();
+    }
+
+    /**
+     * 关闭回调(吐值)
+     */
+    public close() {
+        if (this.tempResult && Object.is(this.tempResult.ret, 'OK')) {
+            this.subject.next(this.tempResult);
+        }
+    }
+
+    /**
+     * 打开悬浮窗
+     *
+     * @param {MouseEvent} event
+     * @param {(h: CreateElement) => any} [content]
+     * @param {string} [title]
+     * @param {PopperJs.Placement} [position='left']
+     * @param {boolean} [isAutoClose=true]
+     * @param {number} [width]
+     * @param {number} [height]
+     * @returns {void}
+     * @memberof AppPopover
+     */
+    public openPopover(event: MouseEvent, content?: (h: CreateElement) => any, title?: string, position: PopperJs.Placement = 'left', isAutoClose: boolean = true, width?: number, height?: number): void {
+        // 阻止事件冒泡
+
+        event.stopPropagation();
+        const element: Element = event.toElement;
+        if (element.hasAttribute('app-popover-tag')) {
+            const tag: any = element.getAttribute('app-popover-tag');
+            if (Object.is(this.activePopoverTag, tag)) {
+                this.destroy();
+                return;
+            }
+            this.activePopoverTag = tag;
+        } else {
+            const tag: string = 'app-popover-tag-' + new Date().getTime();
+            element.setAttribute('app-popover-tag', tag);
+            this.activePopoverTag = tag;
+        }
+        // if (!this.vueExample) {
+        //     this.initVueExample();
+        // }
+        if (this.vueExample) {
+            this.destroy();
+        }
+        this.initVueExample();
+        const _element: any = this.vueExample.$el;
+
+        const zIndex = this.vueExample.$store.getters.getZIndex();
+        if (zIndex) {
+            this.zIndex = zIndex + 100;
+            this.vueExample.$store.commit('updateZIndex', this.zIndex);
+        }
+        _element.style.zIndex = this.zIndex;
+
+        const datacard: any = this.vueExample.$refs.datacard;
+        datacard.$el.style.width = width !== 0 ? width + 'px' : '240px';
+        datacard.$el.getElementsByClassName('el-card__body')[0].style.height = height !== 0 ? height + 'px' : '562px';
+        // if (width !== '0px' && width) {
+        //     this.vueExample.$refs.datacard.$el.style.width = width;
+        // } else {
+        //     this.vueExample.$refs.datacard.$el.style.width = '240px';
+        // }
+        // if (height !== '0px' && height) {
+        //     this.vueExample.$refs.datacard.$el.getElementsByClassName('el-card__body')[0].style.height = height;
+        // } else {
+        //     this.vueExample.$refs.datacard.$el.getElementsByClassName('el-card__body')[0].style.height = '562px';
+        // }
+        // this.destroy();
+        // 是否可自动关闭
+        this.isAutoClose = isAutoClose;
+        // 更新vue实例内容
+        this.vueExample.$data.title = title;
+        this.vueExample.$data.content = content;
+        this.vueExample.$data.isShow = true;
+        this.vueExample.$forceUpdate();
+        // 绘制popover
+        const config: PopperJs.PopperOptions = {
+            placement: position,
+            onCreate: () => {
+                this.showPopper = true;
+            },
+            onUpdate: (arg) => {
+                const popper: any = arg.instance.popper;
+                popper.style.display = 'none';
+            },
+            modifiers: {
+                flip: {
+                    boundariesElement: 'viewport'
+                },
+                preventOverflow: {
+                    boundariesElement: document.getElementsByClassName('app-index')[0]
+                }
+            }
+        };
+        this.popperExample = new PopperJs(element, this.vueExample.$el, config);
+        this.popperExample.update();
+    }
+
+    /**
+     * 销毁popper(带回填数据)
+     *
+     * @memberof AppPopover
+     */
+    public destroy(): void {
+        if (this.popperExample) {
+            this.popperExample.destroy();
+
+            if (this.zIndex) {
+                const zIndex: any = this.zIndex;
+                this.vueExample.$store.commit('updateZIndex', zIndex - 100);
+                this.zIndex = null;
+            }
+
+            this.vueExample.$destroy();
+            document.body.removeChild(this.vueExample.$el);
+            this.popperExample = undefined;
+            this.showPopper = false;
+            this.activePopoverTag = '';
+            this.vueExample.$data.isShow = false;
+            this.vueExample.$forceUpdate();
+        }
+    }
+
+    /**
+     * 获取实例
+     *
+     * @static
+     * @memberof AppPopover
+     */
+    public static getInstance() {
+        return AppPopover.$popover;
+    }
+
+}
\ No newline at end of file

src/utils/auth-guard/auth-guard.ts

+import { Http } from '../http/http';
+import { Environment } from '@/environments/environment';
+
+/**
+ * AuthGuard net 对象
+ * 调用 getInstance() 获取实例
+ *
+ * @class Http
+ */
+export class AuthGuard {
+
+    /**
+     * 获取 Auth 单例对象
+     *
+     * @static
+     * @returns {Auth}
+     * @memberof Auth
+     */
+    public static getInstance(): AuthGuard {
+        if (!AuthGuard.auth) {
+            AuthGuard.auth = new AuthGuard();
+        }
+        return this.auth;
+    }
+
+    /**
+     * 单例变量声明
+     *
+     * @private
+     * @static
+     * @type {AuthGuard}
+     * @memberof AuthGuard
+     */
+    private static auth: AuthGuard;
+
+    /**
+     * Creates an instance of AuthGuard.
+     * 私有构造，拒绝通过 new 创建对象
+     * 
+     * @memberof AuthGuard
+     */
+    private constructor() { }
+
+    /**
+     * post请求
+     *
+     * @param {string} url url 请求路径
+     * @param {*} [params={}] 请求参数
+     * @returns {Promise<any>} 请求相响应对象
+     * @memberof AuthGuard
+     */
+    public authGuard(url: string, params: any = {}, router: any): Promise<boolean> {
+        return new Promise((resolve: any, reject: any) => {
+            const get: Promise<any> = Http.getInstance().get(url, params);
+            get.then((response: any) => {
+                if (response && response.status === 200) {
+                    if (response.data && response.data.remotetag) {
+                        router.app.$store.commit('addAppData', response.data.remotetag);
+                    }
+                    if (response.data && response.data.localdata) {
+                        router.app.$store.commit('addLocalData', response.data.localdata);
+                    }
+                }
+                this.getAllCodeList(resolve, reject, router);
+            }).catch((error: any) => {
+                this.getAllCodeList(resolve, reject, router);
+            });
+        });
+    }
+
+    /**
+     * 获取所有代码表
+     *
+     * @private
+     * @param {*} resolve
+     * @param {*} reject
+     * @param {*} router
+     * @memberof AuthGuard
+     */
+    private getAllCodeList(resolve: any, reject: any, router: any): void {
+        const url = `${Environment.AppName.toLocaleLowerCase()}/app/codelist/getall`;
+        const get: Promise<any> = Http.getInstance().get(url, {});
+        get.then((response: any) => {
+            if (response && response.status === 200 && response.data && Array.isArray(response.data)) {
+                const datas: any[] = [...response.data];
+                datas.forEach((item: any) => {
+                    if (!item.items) {
+                        item.items = [];
+                    }
+                });
+                router.app.$store.commit('addCodeLists', datas);
+            }
+            resolve(true);
+        }).catch((error: any) => {
+            reject(true);
+        });
+    }
+}

src/utils/code-list/code-list.tsx

+import { CreateElement } from 'vue';
+import store from '../../store';
+import { Util } from '../util/util';
+
+/**
+ * 代码表
+ *
+ * @export
+ * @class CodeList
+ */
+export class CodeList {
+
+    /**
+     * 获取 CodeList 单例对象
+     *
+     * @static
+     * @returns {CodeList}
+     * @memberof CodeList
+     */
+    public static getInstance(): CodeList {
+        if (!CodeList.codeList) {
+            CodeList.codeList = new CodeList();
+        }
+        return this.codeList;
+    }
+
+    /**
+     * 单例变量声明
+     *
+     * @private
+     * @static
+     * @type {CodeList}
+     * @memberof CodeList
+     */
+    private static codeList: CodeList;
+
+    /**
+     * Creates an instance of CodeList.
+     * 私有构造，拒绝通过 new 创建对象
+     * 
+     * @memberof CodeList
+     */
+    private constructor() {
+
+    }
+
+    /**
+     * 获取代码项
+     *
+     * @private
+     * @param {any[]} items
+     * @param {*} value
+     * @returns {*}
+     * @memberof CodeList
+     */
+    private getItem(items: any[], value: any): any {
+        let result: any = {};
+        const arr: Array<any> = items.filter(item => Object.is(item.value, value));
+        if (arr.length !== 1) {
+            return undefined;
+        }
+
+        result = { ...arr[0] };
+        return result;
+    }
+
+    /**
+     * 绘制代码内容
+     *
+     * @private
+     * @param {CreateElement} h
+     * @param {*} [item={}]
+     * @returns
+     * @memberof CodeList
+     */
+    private renderCodeItemText(h: CreateElement, item: any = {}) {
+        const color = item.color;
+        const textCls = item.textcls;
+        const iconCls: any = item.iconcls;
+        const realText = item.text;
+        const staticStyle: any = color ? { color: color } : {};
+        return (
+            <span>
+                {iconCls ? <i class={iconCls}></i> + '&nbsp;' : ''}
+                {(textCls || color) ? <span class={textCls} style={staticStyle}>{realText}</span> : realText}
+            </span>
+        );
+    }
+
+    /**
+     * 常规内容绘制
+     *
+     * @param {CreateElement} h
+     * @param {{ items: any[]; value: string; emtpytext: string; }} { items, value, emtpytext }
+     * @returns
+     * @memberof CodeList
+     */
+    public render(h: CreateElement, { srfkey, value, emtpytext }: { srfkey: string; value: string; emtpytext: string; }) {
+        const items = store.getters.getCodeListItems(srfkey);
+        if (Object.is(Util.typeOf(value), 'undefined') || Object.is(Util.typeOf(value), 'null')) {
+            return (
+                <span>{emtpytext}</span>
+            );
+        }
+
+        if (items) {
+            let values: any[] = [];
+            if (Object.is(Util.typeOf(value), 'number')) {
+                values.push(value);
+            } else {
+                values = [...value.split(';')]
+            }
+            return (
+                <span>
+                    {
+                        values.map((value: any, index: number) => {
+                            const item = this.getItem(items, value);
+                            if (item) {
+                                return (
+                                    <span>
+                                        {index === 0 ? '' : '、'}
+                                        {this.renderCodeItemText(h, item)}
+                                    </span>
+                                );
+                            }
+                        })
+                    }
+                </span>
+            );
+        }
+        return (
+            <span></span>
+        );
+    }
+
+    /**
+     * 数字或处理
+     *
+     * @param {CreateElement} h
+     * @param {{ srfkey: ''; value: string; emtpytext: string; textSeparator: string; }} { srfkey, value, emtpytext, textSeparator }
+     * @returns
+     * @memberof CodeList
+     */
+    public renderNumOr(h: CreateElement, { srfkey, value, emtpytext, textSeparator }: { srfkey: ''; value: string; emtpytext: string; textSeparator: string; }) {
+        const items = store.getters.getCodeListItems(srfkey);
+        if (!textSeparator || Object.is(textSeparator, '')) {
+            textSeparator = '、';
+        }
+        if (Object.is(Util.typeOf(value), 'undefined') || Object.is(Util.typeOf(value), 'null')) {
+            return (
+                <span>{emtpytext}</span>
+            );
+        }
+        const nValue = parseInt(value, 10);
+        if (items) {
+            return (
+                <span>
+                    {
+                        items.map((_item: any, index: number) => {
+                            const codevalue = _item.value;
+                            if ((parseInt(codevalue, 10) & nValue) > 0) {
+                                return (
+                                    <span>
+                                        {index > 0 ? textSeparator : ''}
+                                        {this.renderCodeItemText(h, _item)}
+                                    </span>
+                                );
+                            }
+                        })
+                    }
+                </span>
+            );
+        }
+
+        return (
+            <span></span>
+        );
+    }
+
+    /**
+     * 文本或处理
+     *
+     * @param {CreateElement} h
+     * @param {{ srfkey: string; value: any; emtpytext: any; textSeparator: any; valueSeparator: any; }} { srfkey, value, emtpytext, textSeparator, valueSeparator }
+     * @returns
+     * @memberof CodeList
+     */
+    public renderStrOr(h: CreateElement, { srfkey, value, emtpytext, textSeparator, valueSeparator }: { srfkey: string; value: any; emtpytext: any; textSeparator: any; valueSeparator: any; }) {
+        if (!textSeparator || Object.is(textSeparator, '')) {
+            textSeparator = '、';
+        }
+        if (Object.is(Util.typeOf(value), 'undefined') || Object.is(Util.typeOf(value), 'null')) {
+            return (
+                <span>{emtpytext}</span>
+            );
+        }
+
+        const arrayValue: Array<any> = value.split(valueSeparator);
+        return (
+            <span>
+                {
+                    arrayValue.map((value: any, index: number) => {
+                        return (
+                            <span>
+                                {index > 0 ? textSeparator : ''}
+                                {this.render(h, { srfkey, value, emtpytext })}
+                            </span>
+                        );
+                    })
+                }
+            </span>
+        );
+    }
+}
\ No newline at end of file

src/utils/dom/dom.ts

+import Vue from 'vue';
+const isServer = Vue.prototype.$isServer;
+
+/* istanbul ignore next */
+export const on = (function() {
+    if (!isServer && document.addEventListener) {
+        return function(element: any, event: any, handler: any) {
+            if (element && event && handler) {
+                element.addEventListener(event, handler, false);
+            }
+        };
+    } else {
+        return function(element: any, event: any, handler: any) {
+            if (element && event && handler) {
+                element.attachEvent('on' + event, handler);
+            }
+        };
+    }
+})();
+
+/* istanbul ignore next */
+export const off = (function() {
+    if (!isServer && document.removeEventListener) {
+        return function(element: any, event: any, handler: any) {
+            if (element && event) {
+                element.removeEventListener(event, handler, false);
+            }
+        };
+    } else {
+        return function(element: any, event: any, handler: any) {
+            if (element && event) {
+                element.detachEvent('on' + event, handler);
+            }
+        };
+    }
+})();
+
+/* istanbul ignore next */
+export function hasClass(el: Element | HTMLElement, cls: string) {
+    if (!el || !cls) return false;
+    if (cls.indexOf(' ') !== -1) throw new Error('className should not contain space.');
+    if (el.classList) {
+        return el.classList.contains(cls);
+    } else {
+        return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
+    }
+}
+
+/* istanbul ignore next */
+export function addClass(el: Element | HTMLElement, cls: string) {
+    if (!el) return;
+    let curClass = el.className;
+    const classes = (cls || '').split(' ');
+
+    for (let i = 0, j = classes.length; i < j; i++) {
+        const clsName = classes[i];
+        if (!clsName) continue;
+
+        if (el.classList) {
+            el.classList.add(clsName);
+        } else {
+            if (!hasClass(el, clsName)) {
+                curClass += ' ' + clsName;
+            }
+        }
+    }
+    if (!el.classList) {
+        el.className = curClass;
+    }
+}
+
+/* istanbul ignore next */
+export function removeClass(el: Element | HTMLElement, cls: string) {
+    if (!el || !cls) return;
+    const classes = cls.split(' ');
+    let curClass = ' ' + el.className + ' ';
+
+    for (let i = 0, j = classes.length; i < j; i++) {
+        const clsName = classes[i];
+        if (!clsName) continue;
+
+        if (el.classList) {
+            el.classList.remove(clsName);
+        } else {
+            if (hasClass(el, clsName)) {
+                curClass = curClass.replace(' ' + clsName + ' ', ' ');
+            }
+        }
+    }
+    if (!el.classList) {
+        el.className = trim(curClass);
+    }
+}
+
+/* istanbul ignore next */
+const trim = function(str: string) {
+    return (str || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
+};
\ No newline at end of file

src/utils/http/http.ts

+import axios from 'axios';
+import { Loading } from 'element-ui';
+import { ElLoadingComponent } from 'element-ui/types/loading';
+import JsonHttp from '../json-http/json-http';
+import { Environment } from '@/environments/environment';
+
+/**
+ * Http net 对象
+ * 调用 getInstance() 获取实例
+ *
+ * @class Http
+ */
+export class Http {
+
+    /**
+     * 获取 Http 单例对象
+     *
+     * @static
+     * @returns {Http}
+     * @memberof Http
+     */
+    public static getInstance(): Http {
+        if (!Http.Http) {
+            Http.Http = new Http();
+        }
+        return this.Http;
+    }
+
+    /**
+     * 单例变量声明
+     *
+     * @private
+     * @static
+     * @type {Http}
+     * @memberof Http
+     */
+    private static Http: Http;
+
+    /**
+     * 统计加载
+     *
+     * @type {number}
+     * @memberof Http
+     */
+    private loadingCount: number = 0;
+
+    /**
+     * load状态管理器
+     *
+     * @private
+     * @type {(ElLoadingComponent | any)}
+     * @memberof Http
+     */
+    private elLoadingComponent: ElLoadingComponent | any;
+
+    /**
+     * 示例数请求
+     *
+     * @type {AppSampleHttp}
+     * @memberof Http
+     */
+    public jsonHttp: JsonHttp = JsonHttp.getInstance();
+
+    /**
+     * Creates an instance of Http.
+     * 私有构造，拒绝通过 new 创建对象
+     * 
+     * @memberof Http
+     */
+    private constructor() { }
+
+    /**
+     * post请求
+     *
+     * @param {string} url
+     * @param {*} [params={}]
+     * @param {boolean} [isloading]
+     * @param {number} [serialnumber]
+     * @returns {Promise<any>}
+     * @memberof Http
+     */
+    public post(url: string, params: any = {}, isloading?: boolean, serialnumber?: number): Promise<any> {
+        if (Environment.SampleMode) {
+            return this.jsonHttp.http(url, params);
+        }
+        if (isloading) {
+            this.beginLoading();
+        }
+        return new Promise((resolve: any, reject: any) => {
+            axios({
+                method: 'post',
+                url: url,
+                data: { ...params },
+                headers: { 'Content-Type': 'application/json;charset=UTF-8', 'Accept': 'application/json' },
+                transformResponse: [(data: any) => {
+                    let _data: any = null;
+                    try {
+                        _data = JSON.parse(JSON.parse(JSON.stringify(data)));
+                    } catch (error) {
+                    }
+                    return _data;
+                }],
+            }).then((response: any) => {
+                if (isloading) {
+                    this.endLoading();
+                }
+                if (serialnumber) {
+                    Object.assign(response, { serialnumber: serialnumber });
+                }
+                resolve(response);
+            }).catch((response: any) => {
+                if (isloading) {
+                    this.endLoading();
+                }
+                if (serialnumber) {
+                    Object.assign(response, { serialnumber: serialnumber });
+                }
+                reject(response);
+            });
+        });
+    }
+
+    /**
+     * 多参数
+     *
+     * @param {string} url
+     * @param {*} [params={}]
+     * @param {boolean} [isloading]
+     * @param {number} [serialnumber]
+     * @returns {Promise<any>}
+     * @memberof Http
+     */
+    public get(url: string, params: any = {}, isloading?: boolean, serialnumber?: number): Promise<any> {
+        if (Environment.SampleMode) {
+            return this.jsonHttp.http(url, params);
+        }
+        if (Object.keys(params).length > 0) {
+            const _strParams: string = this.transformationOpt(params);
+            if (url.endsWith('?')) {
+                url = `${url}${_strParams}`;
+            } else if (url.indexOf('?') !== -1 && url.endsWith('&')) {
+                url = `${url}${_strParams}`;
+            } else if (url.indexOf('?') !== -1 && !url.endsWith('&')) {
+                url = `${url}&${_strParams}`;
+            } else {
+                url = `${url}?${_strParams}`;
+            }
+        }
+
+        if (isloading) {
+            this.beginLoading();
+        }
+        return new Promise((resolve: any, reject: any) => {
+            axios.get(url).then((response: any) => {
+                if (isloading) {
+                    this.endLoading();
+                }
+                if (serialnumber) {
+                    Object.assign(response, { serialnumber: serialnumber });
+                }
+                resolve(response);
+            }).catch((response: any) => {
+                if (isloading) {
+                    this.endLoading();
+                }
+                if (serialnumber) {
+                    Object.assign(response, { serialnumber: serialnumber });
+                }
+                reject(response);
+            });
+        });
+    }
+
+    /**
+     * 一级参数
+     *
+     * @param {string} url
+     * @param {boolean} [isloading]
+     * @param {number} [serialnumber]
+     * @returns {Promise<any>}
+     * @memberof Http
+     */
+    public get2(url: string, isloading?: boolean, serialnumber?: number): Promise<any> {
+        if (Environment.SampleMode) {
+            return this.jsonHttp.http(url);
+        }
+
+        if (isloading) {
+            this.beginLoading();
+        }
+        return new Promise((resolve: any, reject: any) => {
+            axios.get(url).then((response: any) => {
+                if (isloading) {
+                    this.endLoading();
+                }
+                if (serialnumber) {
+                    Object.assign(response, { serialnumber: serialnumber });
+                }
+                resolve(response);
+            }).catch((response: any) => {
+                if (isloading) {
+                    this.endLoading();
+                }
+                if (serialnumber) {
+                    Object.assign(response, { serialnumber: serialnumber });
+                }
+                reject(response);
+            });
+        });
+    }
+
+    /**
+     * 请求参数转义处理
+     *
+     * @private
+     * @param {*} [opt={}]
+     * @returns {string}
+     * @memberof Http
+     */
+    private transformationOpt(opt: any = {}): any {
+        const params: any = {};
+        const postData: string[] = [];
+
+        Object.assign(params, opt);
+        const keys: string[] = Object.keys(params);
+        keys.forEach((key: string) => {
+            const val: any = params[key];
+            if (val instanceof Array || val instanceof Object) {
+                postData.push(`${key}=${encodeURIComponent(JSON.stringify(val))}`);
+            } else {
+                postData.push(`${key}=${encodeURIComponent(val)}`);
+            }
+        });
+        return postData.join('&');
+    }
+
+    /**
+     * 开始加载
+     *
+     * @private
+     * @memberof Http
+     */
+    private beginLoading(): void {
+        if (this.loadingCount === 0) {
+            this.elLoadingComponent = Loading.service({
+                body: true,
+                fullscreen: true,
+            });
+        }
+        this.loadingCount++;
+    }
+
+    /**
+     * 加载结束
+     *
+     * @private
+     * @memberof Http
+     */
+    private endLoading(): void {
+        if (this.loadingCount > 0) {
+            this.loadingCount--;
+        }
+        setTimeout(() => {
+            if (this.loadingCount === 0) {
+                this.elLoadingComponent.close();
+            }
+        }, 500);
+    }
+
+}
\ No newline at end of file

src/utils/index.ts

+// 导入
+// import { AppDrawer } from './app-drawer/app-drawer';
+// import { AppModal } from './app-modal/app-modal';
+// import { AppPopover } from './app-popover/app-popover';
+// import { AuthGuard } from './auth-guard/auth-guard';
+// import { CodeList } from './code-list/code-list';
+// import { Http } from './http/http';
+// import { Util } from './util/util';
+// import { Interceptors } from './interceptor/interceptor';
+// import { XMLWriter } from './xml-writer/xml-writer';
+
+export { AppDrawer } from './app-drawer/app-drawer';
+export { AppModal } from './app-modal/app-modal';
+export { AppPopover } from './app-popover/app-popover';
+export { AuthGuard } from './auth-guard/auth-guard';
+export { CodeList } from './code-list/code-list';
+export { Http } from './http/http';
+export { Util } from './util/util';
+export { UICounter } from './ui-conunter/ui-counter';
+export { XMLWriter } from './xml-writer/xml-writer';
+
+/**
+ * 安装实例
+ *
+ * @param Vue
+ * @param opts
+ */
+// const install = function (Vue: any, opts = {}) {
+//     Interceptors.getInstance();
+//     Vue.prototype.$appdrawer = AppDrawer.getInstance();
+//     Vue.prototype.$appmodal = AppModal.getInstance();
+//     Vue.prototype.$apppopover = AppPopover.getInstance();
+//     Vue.prototype.$codelist = CodeList.getInstance();
+//     Vue.prototype.$http = Http.getInstance();
+//     Vue.prototype.$util = Util;
+// };
+
+// export default {
+//     install,
+// }
\ No newline at end of file

src/utils/interceptor/interceptor.ts

+import axios from 'axios';
+import { Environment } from '@/environments/environment';
+
+
+/**
+ * 拦截器
+ *
+ * @export
+ * @class Interceptors
+ */
+export class Interceptors {
+
+    /**
+     * 路由对象
+     *
+     * @private
+     * @type {*}
+     * @memberof Interceptors
+     */
+    private router: any
+
+    /**
+     * 拦截器实现接口
+     *
+     * @private
+     * @memberof Interceptors
+     */
+    private intercept(): void {
+        axios.interceptors.request.use((config: any) => {
+            const rootapp: any = this.router.app;
+            const appdata: string = rootapp.$store.getters.getAppData();
+            if (!Object.is(appdata, '')) {
+                config.headers.srfappdata = appdata;
+            }
+            if (window.localStorage.getItem('token')) {
+                const token = window.localStorage.getItem('token');
+                config.headers.Authorization = `Bearer ${token}`;
+            }
+            if (!config.url.startsWith('https://') && !config.url.startsWith('http://')) {
+                config.url = Environment.BaseUrl + config.url;
+            }
+            return config;
+        }, (error: any) => {
+            return Promise.reject(error);
+        });
+
+        axios.interceptors.response.use((response: any) => {
+            return response;
+        }, (error: any) => {
+            error = error ? error : { response: {} };
+            // tslint:disable-next-line:prefer-const
+            let { response: res } = error;
+            let { data: _data } = res;
+
+            if (_data && _data.status === 401) {
+                this.doNoLogin(_data.data);
+            }
+            if (res.status === 404) {
+                this.router.push({ path: '/404' });
+            } else if (res.status === 500) {
+                this.router.push({ path: '/500' });
+            }
+
+            return Promise.reject(res);
+        });
+    }
+
+    /**
+     * 处理未登录异常情况
+     *
+     * @private
+     * @param {*} [data={}]
+     * @memberof Interceptors
+     */
+    private doNoLogin(data: any = {}): void {
+        if (data.loginurl && !Object.is(data.loginurl, '') && data.originurl && !Object.is(data.originurl, '')) {
+            let _url = encodeURIComponent(encodeURIComponent(window.location.href));
+            let loginurl: string = data.loginurl;
+            const originurl: string = data.originurl;
+
+            if (originurl.indexOf('?') === -1) {
+                _url = `${encodeURIComponent('?RU=')}${_url}`;
+            } else {
+                _url = `${encodeURIComponent('&RU=')}${_url}`;
+            }
+            loginurl = `${loginurl}${_url}`;
+
+            window.location.href = loginurl;
+        } else {
+            if (Object.is(this.router.currentRoute.name, 'login')) {
+                return;
+            }
+            this.router.push({ name: 'login', query: { redirect: this.router.currentRoute.fullPath } });
+        }
+    }
+
+
+    /**
+     * 构建对象
+     * 
+     * @memberof Interceptors
+     */
+    private constructor(router: any) {
+        this.router = router;
+        this.intercept();
+    }
+
+    /**
+     * 初始化变量
+     *
+     * @private
+     * @static
+     * @type {Interceptors}
+     * @memberof Interceptors
+     */
+    private static interceptors: Interceptors;
+
+    /**
+     * 获取单例对象
+     *
+     * @static
+     * @returns {Interceptors}
+     * @memberof Interceptors
+     */
+    public static getInstance(router: any): Interceptors {
+        if (!Interceptors.interceptors) {
+            Interceptors.interceptors = new Interceptors(router);
+        }
+        return this.interceptors;
+    }
+}
+

src/utils/json-http/json-http.ts

+import Jsonp from '../jsonp/jsonp';
+
+/**
+ * 示例数请求对象
+ *
+ * @export
+ * @class AppSamle
+ */
+export default class JsonHttp {
+
+    /**
+     * 获取 Http 单例对象
+     *
+     * @static
+     * @returns {Http}
+     * @memberof SampleHttp
+     */
+    public static getInstance(): JsonHttp {
+        return new JsonHttp();
+    }
+
+    /**
+     * jsonp跨域请求对象
+     *
+     * @type {Jsonp}
+     * @memberof JsonHttp
+     */
+    public jsonpHttp: Jsonp = new Jsonp();
+
+    /**
+     * 请求
+     *
+     * @param {string} url
+     * @returns {Promise<any>}
+     * @memberof SampleHttp
+     */
+    public http(url: string, params: any = {}): Promise<any> {
+        return new Promise((resolve: any, reject: any) => {
+            let action = url.substring(url.lastIndexOf('/') + 1);
+            let type: string = url.substring(url.indexOf('/') + 1, url.indexOf('/', url.indexOf('/') + 1));
+            url = `./assets/sampledata/${url.substring(0, url.lastIndexOf('/'))}.json`;
+            let fileName: string = url.substring(url.lastIndexOf('/') + 1, url.lastIndexOf('.'));
+            this.jsonp(url, fileName).then((data: any) => {
+                if (Object.is(type, 'app')) {
+                    let result = this.setResultData(data);
+                    resolve(result);
+                } else {
+                    let result: Promise<any>;
+                    if (Object.is(type, 'ctrl')) {
+                        result = this.ctrlHttp(url, action, data, params);
+                    } else {
+                        result = this.DEHttp(url, action, data, params);
+                    }
+                    result.then((response: any) => {
+                        resolve(this.setResultData(response));
+                    }).catch((response: any) => {
+                        reject(response);
+                    })
+                }
+
+            }).catch((error: any) => {
+                reject(error);
+            });
+        });
+    }
+
+    /**
+     * 实体部件类请求
+     *
+     * @param {string} url
+     * @param {string} action
+     * @param {*} data
+     * @param {*} [params={}]
+     * @memberof SampleHttp
+     */
+    public DEHttp(url: string, action: string, data: any, params: any = {}): Promise<any> {
+        return new Promise((resolve: any, reject: any) => {
+            let ctrlName: string = url.substring(url.lastIndexOf('/') + 1, url.lastIndexOf('.'));
+            url = url.substring(0, url.lastIndexOf('/'));
+            let deName: string = url.substring(url.lastIndexOf('/') + 1);
+            url += `/${deName}.json`;
+            this.jsonp(url, deName).then((json: any) => {
+                resolve(this.getResultData(ctrlName, json, data, params));
+            }).catch((error: any) => {
+                reject(error);
+            });
+        });
+    }
+
+    /**
+     * 获取返回数据
+     *
+     * @param {string} ctrlName
+     * @param {any[]} items
+     * @param {*} mode
+     * @returns {*}
+     * @memberof SampleHttp
+     */
+    public getResultData(ctrlName: string, items1: any[] = [], items2: any[] = [], params: any = {}): any {
+        let data: any = {};
+        if (ctrlName.endsWith('form')) {
+            if (params.srfkey) {
+                let index = items1.findIndex((item: any) => Object.is(item.srfkey, params.srfkey));
+                if (index >= 0) {
+                    Object.assign(data, items1[index]);
+                    data.srfuf = "1";
+                }
+            }
+        }
+        if (ctrlName.endsWith('grid') || ctrlName.endsWith('list') || ctrlName.endsWith('dataview')) {
+            let items: any[] = [];
+            items1.forEach((item1: any) => {
+                let data: any = {};
+                items2.forEach((item2: any) => {
+                    data[item2.name] = item1[item2.valueitem] != undefined ? item1[item2.valueitem] : null;
+                });
+                items.push(data);
+            });
+            Object.assign(data, { records: items, total: items1.length });
+        }
+
+        return data;
+    }
+
+    /**
+     * ctrl类请求
+     *
+     * @param {string} url
+     * @param {string} action
+     * @param {*} data
+     * @param {*} [params={}]
+     * @returns {Promise<any>}
+     * @memberof SampleHttp
+     */
+    public ctrlHttp(url: string, action: string, data: any, params: any = {}): Promise<any> {
+        return new Promise((resolve: any, reject: any) => {
+            let ctrlName: string = url.substring(url.lastIndexOf('/') + 1, url.lastIndexOf('.'));
+            if (ctrlName.endsWith('appmenu')) {
+                resolve(data);
+            }
+            if (ctrlName.endsWith('treeview')) {
+                if (params.srfnodeid) {
+                    let index: number = data.findIndex((item: any) => Object.is(item.id, params.srfnodeid));
+                    if(index >= 0) {
+                        let node: any = data[index];
+                        let items: any[] = [];
+                        node.childNode.forEach((id: string) => {
+                            let item = data.find((item: any) => Object.is(item.id, id));
+                            items.push(item);
+                        });
+                        resolve(items);
+                    }
+                }
+            }
+        });
+    }
+
+    /**
+     * 请求
+     *
+     * @param {string} url
+     * @param {string} callbackName
+     * @returns
+     * @memberof SampleHttp
+     */
+    public jsonp(url: string, callbackName: string) {
+        return new Promise((resolve: any, reject: any) => {
+            this.jsonpHttp.jsonp(url, {
+                callbackName: callbackName
+            }).then((json: any) => {
+                resolve(json);
+            }).catch((error: any) => {
+                reject(error);
+            });
+        });
+    }
+
+    /**
+     * 设置返回数据
+     *
+     * @param {*} resolve
+     * @param {*} data
+     * @memberof SampleHttp
+     */
+    public setResultData(data: any): any {
+        return {
+            status: 200,
+            data: data,
+            statusText: "OK"
+        };
+    }
+}

src/utils/jsonp/jsonp.ts

+/**
+ * jsonp跨域请求
+ *
+ * @export
+ * @class Jsonp
+ */
+export default class Jsonp {
+
+    /**
+     * 请求超时时长
+     *
+     * @type {number}
+     * @memberof Jsonp
+     */
+    public time: number = 60000;
+
+    /**
+     * Creates an instance of Jsonp.
+     * @param {number} [time]
+     * @memberof Jsonp
+     */
+    constructor(time?: number) {
+        if (time) {
+            this.time = time;
+        }
+    }
+
+    /**
+     * 请求入口
+     *
+     * @param {string} url
+     * @param {*} [params={}]
+     * @returns {Promise<any>}
+     * @memberof Jsonp
+     */
+    public jsonp(url: string, params: any = {}): Promise<any> {
+        return new Promise((resolve, reject) => {
+            if (typeof url !== 'string') {
+                throw new Error('[url] is not string.')
+            }
+
+            let callbackQuery = params.callbackQuery || 'callback'
+            let callbackName = params.callbackName || 'jsonp_' + this.randomStr();
+
+            params[callbackQuery] = callbackName;
+
+            delete params.callbackQuery;
+            delete params.callbackName;
+
+            let queryStrs: any[] = [];
+            Object.keys(params).forEach((queryName) => {
+                queryStrs = queryStrs.concat(this.formatParams(queryName, params[queryName]))
+            })
+
+            let queryStr = this.flatten(queryStrs).join('&');
+
+            const _window: any = window;
+
+            let headNode: any = document.querySelector('head');
+            let paddingScript: any = document.createElement('script');
+
+            let onError = () => {
+                removeErrorListener()
+                clearTimeout(timeoutTimer)
+                reject({
+                  status: 400,
+                  statusText: 'Bad Request'
+                })
+            }
+
+            let removeErrorListener = () => {
+                paddingScript.removeEventListener('error', onError);
+            }
+
+            let timeoutTimer = setTimeout(() => {
+                removeErrorListener()
+                headNode.removeChild(paddingScript)
+                delete _window[callbackName]
+                reject({ statusText: 'Request Timeout', status: 408 })
+            }, this.time);
+
+            _window[callbackName] = (json: any) => {
+                clearTimeout(timeoutTimer)
+                removeErrorListener()
+                headNode.removeChild(paddingScript)
+                resolve(json)
+                delete _window[callbackName]
+            }
+
+            paddingScript.addEventListener('error', onError);
+
+            paddingScript.src = url + (/\?/.test(url) ? '&' : '?') + queryStr;
+            headNode.appendChild(paddingScript);
+        });
+    }
+
+    /**
+     * 随机数
+     *
+     * @returns
+     * @memberof Jsonp
+     */
+    public randomStr(): string {
+        return (Math.floor(Math.random() * 100000) * Date.now()).toString(16);
+    }
+
+    /**
+     * 格式化参数
+     *
+     * @param {string} queryName
+     * @param {*} value
+     * @returns
+     * @memberof Jsonp
+     */
+    public formatParams(queryName: string, value: any): any[] {
+        queryName = queryName.replace(/=/g, '');
+        let result: any[] = [];
+
+        switch (value.constructor) {
+            case String:
+            case Number:
+            case Boolean:
+                result.push(encodeURIComponent(queryName) + '=' + encodeURIComponent(value));
+                break;
+
+            case Array:
+                value.forEach((item: any) => {
+                    result = result.concat(this.formatParams(queryName + '[]=', item));
+                })
+                break;
+
+            case Object:
+                Object.keys(value).forEach((key: string) => {
+                    let item = value[key];
+                    result = result.concat(this.formatParams(queryName + '[' + key + ']', item));
+                })
+                break;
+        }
+
+        return result;
+    }
+
+    /**
+     *
+     *
+     * @param {*} array
+     * @returns
+     * @memberof Jsonp
+     */
+    flatten(array: any[]): any[] {
+        let querys: string[] = [];
+        array.forEach((item: any) => {
+            if (typeof item === 'string') {
+                querys.push(item);
+            } else {
+                querys = querys.concat(this.flatten(item));
+            }
+        });
+        return querys;
+    }
+}
\ No newline at end of file

src/utils/types/README.md

+# util 工具包 
+
+## 工具包声明文件

src/utils/types/app-drawer.d.ts

+import Vue, { VNode, CreateElement } from "vue";
+import { Subject } from "rxjs";
+
+/**
+ * 抽屉实例
+ *
+ * @export
+ * @interface AppDrawer
+ */
+export declare interface AppDrawer {
+    /**
+     * 打开抽屉
+     *
+     * @param {({ viewname: string, title: string, width?: number, height?: number, placement?: 'DRAWER_LEFT' | 'DRAWER_RIGHT' })} view
+     * @param {*} data
+     * @returns {Subject<any>}
+     * @memberof AppDrawer
+     */
+    openDrawer(view: { viewname: string, title: string, width?: number, height?: number, placement?: 'DRAWER_LEFT' | 'DRAWER_RIGHT' }, data: any): Subject<any>
+}
+
+declare module "vue/types/vue" {
+    interface Vue {
+        /**
+         * 抽屉实例
+         *
+         * @type {AppDrawer}
+         * @memberof Vue
+         */
+        $appdrawer: AppDrawer;
+    }
+}

src/utils/types/app-modal.d.ts

+import Vue, { VNode, CreateElement } from "vue";
+import { Subject } from "rxjs";
+
+/**
+ * 模态框实例
+ *
+ * @export
+ * @interface AppModal
+ */
+export declare interface AppModal {
+    /**
+     * 打开模态视图
+     *
+     * @param {{ viewname: string, title: string, width: number, height: number }} view
+     * @param {*} data
+     * @returns {Subject<any>}
+     * @memberof AppModal
+     */
+    openModal(view: { viewname: string, title: string, width: number, height: number }, data: any): Subject<any>;
+}
+
+declare module "vue/types/vue" {
+    interface Vue {
+        /**
+         * 模态框实例
+         *
+         * @type {AppModal}
+         * @memberof Vue
+         */
+        $appmodal: AppModal;
+    }
+}
\ No newline at end of file

src/utils/types/app-popover.d.ts

+import PopperJs from 'popper.js';
+import Vue, { VNode, CreateElement } from "vue";
+
+/**
+ * 悬浮窗实例
+ *
+ * @export
+ * @interface AppPopover
+ */
+export declare interface AppPopover {
+    /**
+     *  打开悬浮窗
+     *
+     * @param {MouseEvent} event
+     * @param {*} view
+     * @param {*} data
+     * @param {string} [title]
+     * @param {string} [position]
+     * @param {boolean} [isAutoClose]
+     * @param {number} [width]
+     * @param {number} [height]
+     * @returns {*}
+     * @memberof AppPopover
+     */
+    openPop(event: MouseEvent, view: any, data: any, title?: string, position?: PopperJs.Placement, isAutoClose?: boolean, width?: number, height?: number): any;
+    /**
+     * 打开悬浮窗
+     *
+     * @param {MouseEvent} event
+     * @param {(h: CreateElement) => any} content
+     * @param {string} [title]
+     * @param {PopperJs.Placement} [position]
+     * @param {boolean} [isAutoClose]
+     * @param {number} [width]
+     * @param {number} [height]
+     * @memberof AppPopover
+     */
+    openPopover(event: MouseEvent, content: (h: CreateElement) => any, title?: string, position?: PopperJs.Placement, isAutoClose?: boolean, width?: number, height?: number): void;
+    /**
+     * 销毁popper(带回填数据)
+     *
+     * @memberof AppPopover
+     */
+    destroy(): void;
+}
+
+declare module "vue/types/vue" {
+    interface Vue {
+        /**
+         * 悬浮窗实例
+         *
+         * @type {AppPopover}
+         * @memberof Vue
+         */
+        $apppopover: AppPopover;
+    }
+}

src/utils/types/code-list.d.ts

+import Vue, { VNode, CreateElement } from "vue";
+
+/**
+ * 代码表
+ *
+ * @export
+ * @interface CodeList
+ */
+export declare interface CodeList {
+    /**
+     * 常规内容绘制
+     *
+     * @param {CreateElement} h
+     * @param {{ srfkey: string; value: string; emtpytext: string; }} { srfkey, value, emtpytext }
+     * @returns {VNode}
+     * @memberof CodeList
+     */
+    render(h: CreateElement, { srfkey, value, emtpytext }: { srfkey: string; value: string; emtpytext: string; }): VNode;
+    /**
+     * 数字或处理
+     *
+     * @param {CreateElement} h
+     * @param {{ srfkey: ''; value: string; emtpytext: string; textSeparator: string; }} { srfkey, value, emtpytext, textSeparator }
+     * @returns {VNode}
+     * @memberof CodeList
+     */
+    renderNumOr(h: CreateElement, { srfkey, value, emtpytext, textSeparator }: { srfkey: string; value: string; emtpytext: string; textSeparator: string; }): VNode;
+    /**
+     * 文本或处理
+     *
+     * @param {CreateElement} h
+     * @param {{ srfkey: string; value: any; emtpytext: any; textSeparator: any; valueSeparator: any; }} { srfkey, value, emtpytext, textSeparator, valueSeparator }
+     * @returns {VNode}
+     * @memberof CodeList
+     */
+    renderStrOr(h: CreateElement, { srfkey, value, emtpytext, textSeparator, valueSeparator }: { srfkey: string; value: any; emtpytext: any; textSeparator: any; valueSeparator: any; }): VNode;
+}
+
+declare module "vue/types/vue" {
+    interface Vue {
+        /**
+         * 代码表绘制对象
+         *
+         * @type {CodeList}
+         * @memberof Vue
+         */
+        $codelist: CodeList;
+    }
+}

src/utils/types/http.d.ts

+import Vue, { VNode, CreateElement } from "vue";
+
+/**
+ * Http net 对象
+ *
+ * @export
+ * @interface Http
+ */
+export declare interface Http {
+    /**
+     * post请求
+     *
+     * @param {string} url
+     * @param {*} params
+     * @param {boolean} [isloading]
+     * @param {number} [serialnumber]
+     * @returns {Promise<any>}
+     * @memberof Http
+     */
+    post(url: string, params: any, isloading?: boolean, serialnumber?: number): Promise<any>;
+    /**
+     * 多参数
+     *
+     * @param {string} url
+     * @param {*} params
+     * @param {boolean} [isloading]
+     * @param {number} [serialnumber]
+     * @returns {Promise<any>}
+     * @memberof Http
+     */
+    get(url: string, params: any, isloading?: boolean, serialnumber?: number): Promise<any>;
+    /**
+     * url 处理参数
+     *
+     * @param {string} url
+     * @param {boolean} [isloading]
+     * @param {number} [serialnumber]
+     * @returns {Promise<any>}
+     * @memberof Http
+     */
+    get2(url: string, isloading?: boolean, serialnumber?: number): Promise<any>;
+}
+
+declare module "vue/types/vue" {
+    interface Vue {
+        /**
+         * Http net 对象
+         *
+         * @type {Http}
+         * @memberof Vue
+         */
+        $http: Http;
+    }
+}
\ No newline at end of file

src/utils/types/other.d.ts

+declare module "iview/src/locale/lang/en-US" {
+}
+
+declare module "element-ui/lib/locale/lang/en" {
+}
+
+declare module "iview/src/locale/lang/zh-CN" {
+}
+
+declare module "element-ui/lib/locale/lang/zh-CN" {
+}
+
+declare module "tinymce/tinymce" {
+}
\ No newline at end of file

src/utils/types/tab-page-exp.d.ts

+import Vue, { VNode, CreateElement } from "vue";
+
+/**
+ * 导航标签组件
+ *
+ * @export
+ * @interface TabPageExp
+ */
+export declare interface TabPageExp {
+    /**
+     * 左移
+     *
+     * @memberof TabPageExp
+     */
+    leftMove(): void;
+    /**
+     * 右移
+     *
+     * @memberof TabPageExp
+     */
+    rightMove(): void;
+    /**
+     * 是否被选中
+     *
+     * @param {(string | number)} index
+     * @returns {boolean}
+     * @memberof TabPageExp
+     */
+    isActive(index: string | number): boolean;
+    /**
+     * 关闭页面
+     *
+     * @param {*} name
+     * @memberof TabPageExp
+     */
+    onClose(name: any): void;
+    /**
+     * 是否显示关闭
+     *
+     * @returns {boolean}
+     * @memberof TabPageExp
+     */
+    isClose(): boolean;
+    /**
+     * 切换分页
+     *
+     * @param {*} index
+     * @memberof TabPageExp
+     */
+    changePage(index: any): void;
+    /**
+     * 设置当前页标题
+     *
+     * @param {string} routename 路由名称
+     * @param {*} caption 视图标题
+     * @param {string} [info] 视图信息
+     * @memberof TabPageExp
+     */
+    setCurPageCaption(routename: string, caption: any, info?: string): void;
+    /**
+     * 移动至指定页面标签
+     *
+     * @param {*} to
+     * @memberof TabPageExp
+     */
+    moveToView(to: any): void;
+}
+
+declare module "vue/types/vue" {
+    interface Vue {
+        /**
+         * 代码表绘制对象
+         *
+         * @type {CodeList}
+         * @memberof Vue
+         */
+        $tabPageExp: TabPageExp;
+    }
+}

src/utils/types/util.d.ts

+import Vue, { VNode, CreateElement } from "vue";
+
+/**
+ * 工具类
+ *
+ * @export
+ * @interface Util
+ */
+export declare interface Util {
+    /**
+     * 错误提示信息
+     *
+     * @type {string}
+     * @memberof Util
+     */
+    errorInfo: string;
+    /**
+     * 创建 UUID
+     *
+     * @returns {string}
+     * @memberof Util
+     */
+    createUUID(): string;
+    /**
+     * 创建序列号
+     *
+     * @returns {number}
+     * @memberof Util
+     */
+    createSerialNumber(): number
+    /**
+     * 判断是否为一个函数
+     *
+     * @param {*} func
+     * @returns {boolean}
+     * @memberof Util
+     */
+    isFunction(func: any): boolean;
+    /**
+     * 判断条件是否成立
+     *
+     * @param {*} value
+     * @param {*} op
+     * @param {*} value2
+     * @returns {boolean}
+     * @memberof Util
+     */
+    testCond(value: any, op: any, value2: any): boolean;
+    /**
+     * 文本包含
+     *
+     * @param {*} value
+     * @param {*} value2
+     * @returns {boolean}
+     * @memberof Util
+     */
+    contains(value: any, value2: any): boolean;
+    /**
+     * 值比较
+     *
+     * @param {*} value
+     * @param {*} value2
+     * @returns {number}
+     * @memberof Util
+     */
+    compare(value: any, value2: any): number;
+    /**
+     * 是否是时间
+     *
+     * @param {string} value
+     * @returns {boolean}
+     * @memberof Util
+     */
+    isParseDate(value: string): boolean;
+    /**
+     * 时间值比较（毫秒数）
+     *
+     * @param {number} value
+     * @param {number} value2
+     * @returns {number}
+     * @memberof Util
+     */
+    compareDate(value: number, value2: number): number;
+    /**
+     * 数值比较
+     *
+     * @param {number} value
+     * @param {number} value2
+     * @returns {number}
+     * @memberof Util
+     */
+    compareNumber(value: number, value2: number): number;
+    /**
+     * 字符串比较
+     *
+     * @param {*} value
+     * @param {*} value2
+     * @returns {number}
+     * @memberof Util
+     */
+    compareString(value: any, value2: any): number;
+    /**
+     * boolean 值比较
+     *
+     * @param {*} value
+     * @param {*} value2
+     * @returns {number}
+     * @memberof Util
+     */
+    compareBoolean(value: any, value2: any): number;
+    /**
+     * 处理请求结果
+     *
+     * @param {*} o
+     * @memberof Util
+     */
+    processResult(o: any): void;
+    /**
+     * 下载文件
+     *
+     * @param {string} url
+     * @memberof Util
+     */
+    download(url: string): void;
+    /**
+     * 
+     *
+     * @param {string} url
+     * @param {*} params
+     * @returns {string}
+     * @memberof Util
+     */
+    parseURL2(url: string, params: any): string;
+    /**
+     * 是否是数字
+     *
+     * @param {*} num
+     * @returns {boolean}
+     * @memberof Util
+     */
+    isNumberNaN(num: any): boolean;
+    /**
+     * 是否未定义
+     *
+     * @param {*} value
+     * @returns {boolean}
+     * @memberof Util
+     */
+    isUndefined(value: any): boolean;
+    /**
+     * 是否为空
+     *
+     * @param {*} value
+     * @returns {boolean}
+     * @memberof Util
+     */
+    isEmpty(value: any): boolean;
+    /**
+     * 检查属性常规条件
+     *
+     * @param {*} value 属性值
+     * @param {string} op 检测条件
+     * @param {*} value2 预定义值
+     * @param {string} errorInfo 错误信息
+     * @param {string} paramType 参数类型
+     * @param {*} form 表单对象
+     * @param {boolean} primaryModel 是否必须条件
+     * @returns {boolean}
+     * @memberof Util
+     */
+    checkFieldSimpleRule(value: any, op: string, value2: any, errorInfo: string, paramType: string, form: any, primaryModel: boolean): boolean;
+    /**
+     * 检查属性字符长度规则
+     *
+     * @param {string} viewValue
+     * @param {number} minLength
+     * @param {boolean} indexOfMin
+     * @param {number} maxLength
+     * @param {boolean} indexOfMax
+     * @param {string} errorInfo
+     * @param {boolean} primaryModel
+     * @returns {boolean}
+     * @memberof Util
+     */
+    checkFieldStringLengthRule(viewValue: string, minLength: number, indexOfMin: boolean, maxLength: number, indexOfMax: boolean, errorInfo: string, primaryModel: boolean): boolean;
+    /**
+     * 检查属性值正则式规则
+     *
+     * @param {string} viewValue
+     * @param {*} strReg
+     * @param {string} errorInfo
+     * @param {boolean} primaryModel
+     * @returns {boolean}
+     * @memberof Util
+     */
+    checkFieldRegExRule(viewValue: string, strReg: any, errorInfo: string, primaryModel: boolean): boolean;
+    /**
+     * 检查属性值范围规则
+     *
+     * @param {string} viewValue
+     * @param {*} minNumber
+     * @param {boolean} indexOfMin
+     * @param {*} maxNumber
+     * @param {boolean} indexOfMax
+     * @param {string} errorInfo
+     * @param {boolean} primaryModel
+     * @returns {boolean}
+     * @memberof Util
+     */
+    checkFieldValueRangeRule(viewValue: string, minNumber: any, indexOfMin: boolean, maxNumber: any, indexOfMax: boolean, errorInfo: string, primaryModel: boolean): boolean;
+    /**
+     * 检查属性值范围规则
+     *
+     * @param {string} viewValue
+     * @param {*} minNumber
+     * @param {boolean} indexOfMin
+     * @param {*} maxNumber
+     * @param {boolean} indexOfMax
+     * @param {string} errorInfo
+     * @param {boolean} primaryModel
+     * @returns {boolean}
+     * @memberof Util
+     */
+    checkFieldValueRangeRule(viewValue: string, minNumber: any, indexOfMin: boolean, maxNumber: any, indexOfMax: boolean, errorInfo: string, primaryModel: boolean): boolean;
+    /**
+     * 检查属性值系统值范围规则  暂时支持正则表达式
+     *
+     * @param {string} viewValue
+     * @param {*} strReg
+     * @param {string} errorInfo
+     * @param {boolean} primaryModel
+     * @returns {boolean}
+     * @memberof Util
+     */
+    checkFieldSysValueRule(viewValue: string, strReg: any, errorInfo: string, primaryModel: boolean): boolean;
+    /**
+     * 将文本格式的xml转换为dom模式
+     *
+     * @param {string} strXml
+     * @returns {(Document | undefined)}
+     * @memberof Util
+     */
+    parseXML(strXml: string): Document | undefined;
+    /**
+     * 将xml转换为object对象
+     *
+     * @param {*} node
+     * @param {*} obj
+     * @memberof Util
+     */
+    loadXMLNode(node: any, obj: any): void;
+    /**
+     * 将object转换为xml对象
+     *
+     * @param {*} XML
+     * @param {*} obj
+     * @memberof Util
+     */
+    saveXMLNode(XML: any, obj: any):void;
+    /**
+     * 格式化矩阵参数
+     *
+     * @param {string} param
+     * @returns {*}
+     * @memberof Util
+     */
+    formatMatrixParse(param: string): any;
+    /**
+     * 处理url参数
+     *
+     * @param {string} param
+     * @returns {*}
+     * @memberof Util
+     */
+    formatMatrixParse2(param: string): any;
+    /**
+     * 转换为矩阵参数
+     *
+     * @param {*} obj
+     * @returns {*}
+     * @memberof Util
+     */
+    formatMatrixStringify(obj: any): any;
+    /**
+     * 格式化Url参数
+     *
+     * @param {*} params
+     * @returns {string}
+     * @memberof Util
+     */
+    urlEncode(params: any ): string;
+    /**
+     * 清除用户信息缓存
+     *
+     * @memberof Util
+     */
+    clearUserInfo(): void;
+    /**
+     * 检查返回数据
+     *
+     * @param {*} res
+     * @returns {boolean}
+     * @memberof Util
+     */
+    checkRes(res: any): boolean;
+    /**
+     * 准备路由参数
+     *
+     * @param {*} { route: route, sourceNode: sourceNode, targetNode: targetNode, data: data }
+     * @returns {*}
+     * @memberof Util
+     */
+    prepareRouteParmas({ route: route, sourceNode: sourceNode, targetNode: targetNode, data: data }: any): any;
+    /**
+     * 获取当前值类型
+     *
+     * @param {*} obj
+     * @returns {string}
+     * @memberof Util
+     */
+    typeOf(obj: any):string;
+    /**
+     * 深拷贝(deepCopy)
+     *
+     * @param {*} data
+     * @returns {*}
+     * @memberof Util
+     */
+    deepCopy(data: any): any;
+    /**
+     * 名称格式化
+     *
+     * @param {string} name
+     * @returns {string}
+     * @memberof Util
+     */
+    srfFilePath2(name: string): string;
+}
+
+declare module "vue/types/vue" {
+    interface Vue {
+        /**
+         * 工具类
+         *
+         * @type {Util}
+         * @memberof Vue
+         */
+        $util: Util;
+    }
+}
\ No newline at end of file

src/utils/ui-conunter/ui-counter.ts

+import { Http } from './../http/http';
+import { Subject } from 'rxjs';
+
+/**
+ * 计数器对象
+ *
+ * @export
+ * @class UICounter
+ */
+export class UICounter {
+
+    /**
+     * 定时器时间
+     * 
+     * @private
+     * @type {*}
+     * @memberof UICounter
+     */
+    private timer: number;
+
+    /**
+     * 定时器
+     * 
+     * @private
+     * @type {*}
+     * @memberof UICounter
+     */
+    private timerTag: any = null;
+
+    /**
+     * 计数器id
+     * 
+     * @private
+     * @type {*}
+     * @memberof UICounter
+     */
+    private counterId: string = '';
+
+    /**
+     * 计数器交互数据
+     *
+     * @private
+     * @type {*}
+     * @memberof UICounter
+     */
+    private data: any = {};
+
+    /**
+     * url
+     *
+     * @type {string}
+     * @memberof UICounter
+     */
+    public url: string = '';
+
+    /**
+     * 请求
+     *
+     * @private
+     * @type {Http}
+     * @memberof UICounter
+     */
+    private http: Http = Http.getInstance();
+
+    /**
+     * 计数器对象订阅对象
+     *
+     * @type {Subject<any>}
+     * @memberof UICounter
+     */
+    public uiCounterData: Subject<any> = new Subject();
+
+    /**
+     * Creates an instance of UICounter.
+     * 创建 UICounter 服务对象
+     * 
+     * @param {*} [config={}]
+     * @memberof UICounter
+     */
+    constructor(config: any = {}) {
+        this.counterId = config.counterId;
+        this.timer = config.timer;
+        this.url = config.url;
+        this.load();
+    }
+
+    /**
+     * 加载定时器
+     * 
+     * @memberof UICounter
+     */
+    private load(): void {
+        if (this.timer > 1000) {
+            this.timerTag = setInterval(() => {
+                this.reload();
+            }, this.timer);
+        }
+        this.reload();
+    }
+
+    /**
+     * 刷新计数器
+     * 
+     * @private
+     * @param {*} [arg={}] 
+     * @memberof UICounter
+     */
+    public reload(arg: any = {}): void {
+        this.http.get(this.url, {}).then((response: any) => {
+            if (!response || response.status !== 200) {
+                return;
+            }
+
+            const { data: result }= response;
+            this.setData(result);
+        }).catch((response: any) => {
+        });
+    }
+
+    /**
+     * 处理数据
+     * 
+     * @private
+     * @param {*} result 
+     * @memberof UICounter
+     */
+    private setData(result: any): void {
+        this.data = result;
+        this.uiCounterData.next(this.data);
+    }
+
+    /**
+     * 获取数据
+     * 
+     * @returns {*} 
+     * @memberof UICounter
+     */
+    public getData(): any {
+        return this.data;
+    }
+
+    /**
+     * 关闭计数器
+     * 
+     * @memberof UICounter
+     */
+    public close(): void {
+        if (this.timerTag !== undefined) {
+            clearInterval(this.timerTag);
+            delete this.timer;
+        }
+    }
+}
\ No newline at end of file

src/utils/util/util.ts

+/**
+ * 平台工具类
+ * 
+ * @export
+ * @class Util
+ */
+export class Util {
+
+    /**
+     * 错误提示信息
+     * 
+     * @static
+     * @type {string}
+     * @memberof Util
+     */
+    public static errorInfo: string = '';
+
+    /**
+     * 创建 UUID
+     *
+     * @static
+     * @returns {string}
+     * @memberof Util
+     */
+    public static createUUID(): string {
+        function s4() {
+            return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
+        }
+        return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
+    }
+
+    /**
+     * 创建序列号
+     *
+     * @static
+     * @returns {number}
+     * @memberof Util
+     */
+    public static createSerialNumber(): number {
+        function s4() {
+            return Math.floor((1 + Math.random()) * 0x10000);
+        }
+        return s4();
+    }
+
+    /**
+     * 判断是否为一个函数
+     *
+     * @static
+     * @param {*} func
+     * @returns {boolean}
+     * @memberof Util
+     */
+    public static isFunction(func: any): boolean {
+        return typeof (func) === 'function';
+    }
+
+    /**
+     * 判断条件是否成立
+     * 
+     * @static
+     * @param {*} value 
+     * @param {*} op 
+     * @param {*} value2 
+     * @returns {boolean} 
+     * @memberof Util
+     */
+    public static testCond(value: any, op: any, value2: any): boolean {
+        // 等于操作
+        if (Object.is(op, 'EQ')) {
+            const _value = `${value}`;
+            return _value === value2;
+        }
+        // 大于操作
+        if (Object.is(op, 'GT')) {
+            const result: number = this.compare(value, value2);
+            if (result !== undefined && result > 0) {
+                return true;
+            } else {
+                return false;
+            }
+        }
+        // 大于等于操作
+        if (Object.is(op, 'GTANDEQ')) {
+            const result: number = this.compare(value, value2);
+            if (result !== undefined && result >= 0) {
+                return true;
+            } else {
+                return false;
+            }
+        }
+        // 值包含在给定的范围中
+        if (Object.is(op, 'IN')) {
+            return this.contains(value, value2);
+        }
+        // 不为空判断操作
+        if (Object.is(op, 'ISNOTNULL')) {
+            return (value != null && value !== '');
+        }
+        // 为空判断操作
+        if (Object.is(op, 'ISNULL')) {
+            return (value == null || value === '');
+        }
+        // 文本左包含
+        if (Object.is(op, 'LEFTLIKE')) {
+            return (value && value2 && (value.toUpperCase().indexOf(value2.toUpperCase()) === 0));
+        }
+        // 文本包含
+        if (Object.is(op, 'LIKE')) {
+            return (value && value2 && (value.toUpperCase().indexOf(value2.toUpperCase()) !== -1));
+        }
+        // 小于操作
+        if (Object.is(op, 'LT')) {
+            const result: number = this.compare(value, value2);
+            if (result !== undefined && result < 0) {
+                return true;
+            } else {
+                return false;
+            }
+        }
+        // 小于等于操作
+        if (Object.is(op, 'LTANDEQ')) {
+            const result: number = this.compare(value, value2);
+            if (result !== undefined && result <= 0) {
+                return true;
+            } else {
+                return false;
+            }
+        }
+        // 不等于操作
+        if (Object.is(op, 'NOTEQ')) {
+            const _value = `${value}`;
+            return _value !== value2;
+        }
+        // 值不包含在给定的范围中
+        if (Object.is(op, 'NOTIN')) {
+            return !this.contains(value, value2);
+        }
+        // 文本右包含
+        if (Object.is(op, 'RIGHTLIKE')) {
+            if (!(value && value2)) {
+                return false;
+            }
+            const nPos = value.toUpperCase().indexOf(value2.toUpperCase());
+            if (nPos === -1) {
+                return false;
+            }
+            return nPos + value2.length === value.length;
+        }
+        // 空判断
+        if (Object.is(op, 'TESTNULL')) {
+
+        }
+        // 自定义包含
+        if (Object.is(op, 'USERLIKE')) {
+
+        }
+        return false;
+    }
+
+    /**
+     * 文本包含
+     * 
+     * @static
+     * @param {any} value 
+     * @param {any} value2 
+     * @returns {boolean} 
+     * @memberof Util
+     */
+    public static contains(value: any, value2: any): boolean {
+        if (value && value2) {
+            // 定义一数组
+            let arr = new Array();
+            arr = value2.split(',');
+            // 定义正则表达式的连接符
+            const S = String.fromCharCode(2);
+            const reg = new RegExp(S + value + S);
+            return (reg.test(S + arr.join(S) + S));
+        }
+        return false;
+    }
+
+    /**
+     * 值比较
+     * 
+     * @static
+     * @param {*} value 
+     * @param {*} value2 
+     * @returns {number} 
+     * @memberof Util
+     */
+    public static compare(value: any, value2: any): number {
+        let result: any;
+        if (!Object.is(value, '') && !Object.is(value2, '') && !isNaN(value) && !isNaN(value2)) {
+            result = this.compareNumber(parseFloat(value), parseFloat(value2));
+        } else if (this.isParseDate(value) && this.isParseDate(value2)) {
+            result = this.compareDate((new Date(value)).getTime(), (new Date(value2)).getTime());
+        } else if (value && (typeof (value) === 'boolean' || value instanceof Boolean)) {
+            result = this.compareBoolean(value, value2);
+        } else if (value && (typeof (value) === 'string' || value instanceof String)) {
+            result = this.compareString(value, value2);
+        }
+        return result;
+    }
+
+    /**
+     * 是否是时间
+     *
+     * @static
+     * @param {string} value
+     * @returns {boolean}
+     * @memberof Util
+     */
+    public static isParseDate(value: string): boolean {
+        const time = new Date(value);
+        if (isNaN(time.getTime())) {
+            return false;
+        }
+        return true;
+    }
+
+    /**
+     * 时间值比较（毫秒数）
+     *
+     * @static
+     * @param {number} value
+     * @param {number} value2
+     * @returns {number}
+     * @memberof Util
+     */
+    public static compareDate(value: number, value2: number): number {
+        if (value > value2) {
+            return 1;
+        } else if (value < value2) {
+            return -1;
+        } else {
+            return 0;
+        }
+    }
+
+    /**
+     * 数值比较
+     *
+     * @static
+     * @param {number} value
+     * @param {number} value2
+     * @returns {number}
+     * @memberof Util
+     */
+    public static compareNumber(value: number, value2: number): number {
+        if (value > value2) {
+            return 1;
+        } else if (value < value2) {
+            return -1;
+        } else {
+            return 0;
+        }
+    }
+
+    /**
+     * 字符串比较
+     *
+     * @static
+     * @param {*} value
+     * @param {*} value2
+     * @returns {number}
+     * @memberof Util
+     */
+    public static compareString(value: any, value2: any): number {
+        return value.localeCompare(value2);
+    }
+
+    /**
+     * boolean 值比较
+     *
+     * @static
+     * @param {*} value
+     * @param {*} value2
+     * @returns {number}
+     * @memberof Util
+     */
+    public static compareBoolean(value: any, value2: any): number {
+        if (value === value2) {
+            return 0;
+        } else {
+            return -1;
+        }
+    }
+
+    /**
+     *
+     *
+     * @static
+     * @param {*} [o={}]
+     * @memberof Util
+     */
+    public static processResult(o: any = {}): void {
+        if (o.url != null && o.url !== '') {
+            window.location.href = o.url;
+        }
+        if (o.code != null && o.code !== '') {
+            // tslint:disable-next-line:no-eval
+            eval(o.code);
+        }
+
+        if (o.downloadurl != null && o.downloadurl !== '') {
+            const downloadurl = this.parseURL2(o.downloadurl, '');
+            this.download(downloadurl);
+        }
+    }
+
+    /**
+     * 下载文件
+     * 
+     * @static
+     * @param {string} url 
+     * @memberof Util
+     */
+    public static download(url: string): void {
+        window.open(url, '_blank');
+    }
+
+    /**
+     * 
+     * 
+     * @static
+     * @param {any} url 
+     * @param {any} params 
+     * @returns {string} 
+     * @memberof Util
+     */
+    public static parseURL2(url: string, params: any): string {
+        let tmpURL;
+        if (url.indexOf('../../') !== -1) {
+            tmpURL = url.substring(url.indexOf('../../') + 6, url.length);
+        } else if (url.indexOf('/') === 0) {
+            tmpURL = url.substring(url.indexOf('/') + 1, url.length);
+        } else {
+            tmpURL = url;
+        }
+
+        if (params) {
+            return tmpURL + (url.indexOf('?') === -1 ? '?' : '&');
+        } else {
+            return tmpURL;
+        }
+    }
+
+    /**
+     * 是否是数字
+     * 
+     * @param {*} num 
+     * @returns {boolean} 
+     * @memberof Util
+     */
+    public static isNumberNaN(num: any): boolean {
+        return Number.isNaN(num) || num !== num;
+    }
+
+    /**
+     * 是否未定义
+     * 
+     * @static
+     * @param {*} value 
+     * @returns {boolean} 
+     * @memberof Util
+     */
+    public static isUndefined(value: any): boolean {
+        return typeof value === 'undefined';
+    }
+
+    /**
+     * 是否为空
+     * 
+     * @static
+     * @param {*} value 
+     * @returns {boolean} 
+     * @memberof Util
+     */
+    public static isEmpty(value: any): boolean {
+        return this.isUndefined(value) || Object.is(value, '') || value === null || value !== value;
+    }
+
+    /**
+     * 检查属性常规条件
+     *
+     * @static
+     * @param {*} value 属性值
+     * @param {string} op 检测条件
+     * @param {*} value2 预定义值
+     * @param {string} errorInfo 错误信息
+     * @param {string} paramType 参数类型
+     * @param {*} form 表单对象
+     * @param {boolean} primaryModel 是否必须条件
+     * @returns {boolean}
+     * @memberof Util
+     */
+    public static checkFieldSimpleRule(value: any, op: string, value2: any, errorInfo: string, paramType: string, form: any, primaryModel: boolean): boolean {
+        if (Object.is(paramType, 'CURTIME')) {
+            value2 = `${new Date()}`;
+        }
+        if (Object.is(paramType, 'ENTITYFIELD')) {
+            value2 = value2 ? value2.toLowerCase() : '';
+            const _value2Field = form.findFormItem(value2);
+            if (!_value2Field) {
+                this.errorInfo = `表单项${value2}未配置`;
+                return true;
+            }
+            value2 = _value2Field.getValue();
+        }
+        if (this.isEmpty(errorInfo)) {
+            errorInfo = '内容必须符合值规则';
+        }
+        this.errorInfo = errorInfo;
+        const result = this.testCond(value, op, value2);
+        if (!result) {
+            if (primaryModel) {
+                throw new Error(this.errorInfo);
+            }
+        }
+        return !result;
+    }
+
+    /**
+     * 检查属性字符长度规则
+     * 
+     * @static
+     * @param {*} viewValue 
+     * @param {number} minLength 
+     * @param {boolean} indexOfMin 
+     * @param {number} maxLength 
+     * @param {boolean} indexOfMax 
+     * @param {string} errorInfo 
+     * @param {boolean} primaryModel 
+     * @returns {boolean} 
+     * @memberof Util
+     */
+    public static checkFieldStringLengthRule(viewValue: string, minLength: number, indexOfMin: boolean, maxLength: number, indexOfMax: boolean, errorInfo: string, primaryModel: boolean): boolean {
+        if (this.isEmpty(errorInfo)) {
+            this.errorInfo = '内容长度必须符合范围规则';
+        } else {
+            this.errorInfo = errorInfo;
+        }
+
+        const isEmpty = Util.isEmpty(viewValue);
+        if (isEmpty) {
+            if (primaryModel) {
+                throw new Error('值为空');
+            }
+            this.errorInfo = '值为空';
+            return true;
+        }
+
+        const viewValueLength: number = viewValue.length;
+
+        // 小于等于
+        if (minLength !== null) {
+            if (indexOfMin) {
+                if (viewValueLength < minLength) {
+                    if (primaryModel) {
+                        throw new Error(this.errorInfo);
+                    }
+                    return true;
+                }
+            } else {
+                if (viewValueLength <= minLength) {
+                    if (primaryModel) {
+                        throw new Error(this.errorInfo);
+                    }
+                    return true;
+                }
+            }
+        }
+
+        //  大于等于
+        if (maxLength !== null) {
+            if (indexOfMax) {
+                if (viewValueLength > maxLength) {
+                    if (primaryModel) {
+                        throw new Error(this.errorInfo);
+                    }
+                    return true;
+                }
+            } else {
+                if (viewValueLength >= maxLength) {
+                    if (primaryModel) {
+                        throw new Error(this.errorInfo);
+                    }
+                    return true;
+                }
+            }
+        }
+
+        this.errorInfo = '';
+        return false;
+    }
+
+    /**
+     * 检查属性值正则式规则
+     * 
+     * @static
+     * @param {string} viewValue 属性值
+     * @param {*} strReg 验证正则
+     * @param {string} errorInfo 错误信息
+     * @param {boolean} primaryModel 是否关键条件
+     * @returns {boolean} 
+     * @memberof Util
+     */
+    public static checkFieldRegExRule(viewValue: string, strReg: any, errorInfo: string, primaryModel: boolean): boolean {
+        if (this.isEmpty(errorInfo)) {
+            this.errorInfo = '值必须符合正则规则';
+        } else {
+            this.errorInfo = errorInfo;
+        }
+        const isEmpty = Util.isEmpty(viewValue);
+        if (isEmpty) {
+            if (primaryModel) {
+                throw new Error('值为空');
+            }
+            this.errorInfo = '值为空';
+            return true;
+        }
+        const regExp = new RegExp(strReg);
+        if (!regExp.test(viewValue)) {
+            if (primaryModel) {
+                throw new Error(this.errorInfo);
+            }
+            return true;
+        }
+
+        this.errorInfo = '';
+        return false;
+    }
+
+    /**
+     * 检查属性值范围规则
+     * 
+     * @static
+     * @param {string} viewValue 属性值
+     * @param {*} minNumber 最小数值
+     * @param {boolean} indexOfMin 是否包含最小数值
+     * @param {*} maxNumber 最大数值
+     * @param {boolean} indexOfMax 是否包含最大数值
+     * @param {string} errorInfo 错误信息
+     * @param {boolean} primaryModel 是否关键条件
+     * @returns {boolean} 
+     * @memberof Util
+     */
+    public static checkFieldValueRangeRule(viewValue: string, minNumber: any, indexOfMin: boolean, maxNumber: any, indexOfMax: boolean, errorInfo: string, primaryModel: boolean): boolean {
+
+        if (this.isEmpty(errorInfo)) {
+            this.errorInfo = '值必须符合值范围规则';
+        } else {
+            this.errorInfo = errorInfo;
+        }
+
+        const isEmpty = Util.isEmpty(viewValue);
+        if (isEmpty) {
+            if (primaryModel) {
+                throw new Error('值为空');
+            }
+            this.errorInfo = '值为空';
+            return true;
+        }
+
+        const valueFormat = this.checkFieldRegExRule(viewValue, /^-?\d*\.?\d+$/, '', primaryModel);
+        if (valueFormat) {
+            return true;
+        } else {
+            this.errorInfo = errorInfo;
+        }
+
+        const data = Number.parseFloat(viewValue);
+
+        // 小于等于
+        if (minNumber !== null) {
+            if (indexOfMin) {
+                if (data < minNumber) {
+                    if (primaryModel) {
+                        throw new Error(this.errorInfo);
+                    }
+                    return true;
+                }
+            } else {
+                if (data <= minNumber) {
+                    if (primaryModel) {
+                        throw new Error(this.errorInfo);
+                    }
+                    return true;
+                }
+            }
+        }
+
+        // //大于等于
+        if (maxNumber != null) {
+            if (indexOfMax) {
+                if (data > maxNumber) {
+                    if (primaryModel) {
+                        throw new Error(this.errorInfo);
+                    }
+                    return true;
+                }
+            } else {
+                if (data >= maxNumber) {
+                    if (primaryModel) {
+                        throw new Error(this.errorInfo);
+                    }
+                    return true;
+                }
+            }
+        }
+
+        this.errorInfo = '';
+        return false;
+    }
+
+    /**
+     * 检查属性值系统值范围规则  暂时支持正则表达式
+     * 
+     * @static
+     * @param {string} viewValue 属性值
+     * @param {*} strReg 正则
+     * @param {string} errorInfo  错误信息
+     * @param {boolean} primaryModel 是否关键条件
+     * @returns {boolean} 
+     * @memberof Util
+     */
+    public static checkFieldSysValueRule(viewValue: string, strReg: any, errorInfo: string, primaryModel: boolean): boolean {
+        return this.checkFieldRegExRule(viewValue, strReg, errorInfo, primaryModel);
+    }
+
+    /**
+     * 将文本格式的xml转换为dom模式
+     * 
+     * @static
+     * @param {string} strXml 
+     * @memberof Util
+     */
+    public static parseXML(strXml: string): Document | undefined {
+        if (strXml) {
+            return new DOMParser().parseFromString(strXml, 'text/xml');
+        }
+        return undefined;
+    }
+
+    /**
+     * 将xml转换为object对象
+     * 
+     * @static
+     * @param {*} node 
+     * @param {*} [obj={}] 
+     * @memberof Util
+     */
+    public static loadXMLNode(node: any, obj: any = {}): void {
+        if (node && node.attributes) {
+            const arr: any = node.attributes;
+            for (let i = 0; i < arr.length; i++) {
+                let A = arr.item(i).name;
+                const B = arr.item(i).value;
+                A = A.toLowerCase();
+                obj[A] = B;
+            }
+        }
+    }
+
+    /**
+     * 将object转换为xml对象
+     * 
+     * @static
+     * @param {any} XML 
+     * @param {any} obj 
+     * @memberof Util
+     */
+    public static saveXMLNode(XML: any, obj: any) {
+        const keys: string[] = Object.keys(obj);
+        keys.forEach((key: string) => {
+            const value = obj[key];
+            if (!value || value instanceof Object || typeof (value) === 'function') {
+                return;
+            }
+            const proValue = value.toString();
+            if (proValue !== '') {
+                XML.attrib(key, proValue);
+            }
+        });
+    }
+
+    /**
+     * 格式化矩阵参数
+     *
+     * @static
+     * @param {string} param
+     * @returns {any}
+     * @memberof Util
+     */
+    public static formatMatrixParse(param: string): any {
+        const data: any = {};
+        const params_arr: string[] = param.split(';');
+        params_arr.forEach((_data: string, index: number) => {
+            if ((index === params_arr.length - 1) && _data.indexOf('?') !== -1) {
+                _data = _data.substr(0, _data.indexOf('?'));
+            }
+            const _data_arr: string[] = [..._data.split('=')];
+            data[_data_arr[0]] = _data_arr[1];
+        });
+        return data;
+    }
+
+    /**
+     * 处理url参数
+     *
+     * @static
+     * @param {string} param
+     * @returns {*}
+     * @memberof Util
+     */
+    public static formatMatrixParse2(param: string): any {
+        const viewdata: any = { srfparentdata: {} };
+        const params_arr: string[] = param.split(';');
+        params_arr.forEach((_data: string, index: number) => {
+            if ((index === params_arr.length - 1) && _data.indexOf('?') !== -1) {
+                _data = _data.substr(0, _data.indexOf('?'));
+            }
+            const _data_arr: string[] = [..._data.split('=')];
+            if (Object.is(_data_arr[0], 'srfkey')) {
+                Object.assign(viewdata, { [_data_arr[0]]: _data_arr[1] });
+            } else {
+                Object.assign(viewdata.srfparentdata, { [_data_arr[0]]: _data_arr[1] });
+            }
+        });
+        return viewdata;
+    }
+
+    /**
+     * 转换为矩阵参数
+     *
+     * @static
+     * @param {*} obj
+     * @returns {*}
+     * @memberof Util
+     */
+    public static formatMatrixStringify(obj: any): any {
+        let str: string = '';
+        if (obj && !(obj instanceof Array) && (obj instanceof Object)) {
+            const keys: string[] = Object.keys(obj);
+            keys.forEach((key: string) => {
+                if (!obj[key]) {
+                    return;
+                }
+                if (!Object.is(str, '')) {
+                    str += ';';
+                }
+                str += `${key}=${obj[key]}`;
+            });
+        }
+        return Object.is(str, '') ? undefined : str;
+    }
+
+    /**
+     * 格式化Url参数
+     *
+     * @static
+     * @param {*} [params={}]
+     * @returns {string}
+     * @memberof Util
+     */
+    public static urlEncode(params: any = {}): string {
+        let str: string = '';
+        for (const key in params) {
+            if (params.hasOwnProperty(key)) {
+                const val = params[key];
+                str += `${key}=${encodeURIComponent(val)}&`;
+            }
+        }
+        return str;
+    }
+
+    /**
+     * 清除用户信息缓存
+     *
+     * @static
+     * @memberof Util
+     */
+    public static clearUserInfo(): void {
+        window.localStorage.removeItem('user');
+        window.localStorage.removeItem('token');
+    }
+
+    /**
+     * 检查返回数据
+     *
+     * @param {*} res
+     * @returns {boolean}
+     * @memberof Util
+     */
+    public static checkRes(res: any): boolean {
+        return (res && res.ret === 0) ? true : false;
+    }
+
+    /**
+     * 准备路由参数
+     *
+     * @static
+     * @param {*} { route: route, sourceNode: sourceNode, targetNode: targetNode, data: data }
+     * @returns {*}
+     * @memberof Util
+     */
+    public static prepareRouteParmas({ route: route, sourceNode: sourceNode, targetNode: targetNode, data: data }: any): any {
+        const params: any = {};
+        if (!sourceNode || (sourceNode && Object.is(sourceNode, ''))) {
+            return params;
+        }
+        if (!targetNode || (targetNode && Object.is(targetNode, ''))) {
+            return params;
+        }
+        // route.matched.some((_matched: any, index: number, arr: any[]) => {
+        //     // 当前视图
+        //     if (Object.is(sourceNode, _matched.name && arr.length > 1)) {
+        //         Object.assign(params, { [targetNode]: this.formatMatrixStringify(data) });
+        //         return true;
+        //     }
+        //     // 父视图
+        //     Object.assign(params, { [_matched.name]: route.params[_matched.name] });
+        //     return false;
+        // });
+        const indexName = route.matched[0].name;
+        Object.assign(params, { [indexName]: route.params[indexName] });
+        Object.assign(params, { [targetNode]: this.formatMatrixStringify(data) });
+        return params;
+    }
+
+    /**
+     * 获取当前值类型
+     *
+     * @static
+     * @param {*} obj
+     * @returns
+     * @memberof Util
+     */
+    public static typeOf(obj: any):string {
+        const toString = Object.prototype.toString;
+        const map: any = {
+            '[object Boolean]': 'boolean',
+            '[object Number]': 'number',
+            '[object String]': 'string',
+            '[object Function]': 'function',
+            '[object Array]': 'array',
+            '[object Date]': 'date',
+            '[object RegExp]': 'regExp',
+            '[object Undefined]': 'undefined',
+            '[object Null]': 'null',
+            '[object Object]': 'object'
+        };
+        return map[toString.call(obj)];
+    }
+
+    /**
+     * 深拷贝(deepCopy)
+     *
+     * @static
+     * @param {*} data
+     * @returns {*}
+     * @memberof Util
+     */
+    public static deepCopy(data: any): any {
+        const t = this.typeOf(data);
+        let o: any;
+
+        if (t === 'array') {
+            o = [];
+        } else if (t === 'object') {
+            o = {};
+        } else {
+            return data;
+        }
+
+        if (t === 'array') {
+            for (let i = 0; i < data.length; i++) {
+                o.push(this.deepCopy(data[i]));
+            }
+        } else if (t === 'object') {
+            for (let i in data) {
+                o[i] = this.deepCopy(data[i]);
+            }
+        }
+        return o;
+    }
+
+    /**
+     * 名称格式化
+     *
+     * @static
+     * @param {string} name
+     * @returns {string}
+     * @memberof Util
+     */
+    public static srfFilePath2(name: string): string {
+        if (!name || (name && Object.is(name, ''))) {
+            throw new Error('名称异常');
+        }
+        name = name.replace(/[_]/g, '-');
+        let state: number = 0;
+        let _str = '';
+        const uPattern = /^[A-Z]{1}$/;
+
+        const str1 = name.substring(0, 1);
+        const str2 = name.substring(1)
+        state = uPattern.test(str1) ? 1 : 0;
+        _str = `${_str}${str1.toLowerCase()}`;
+
+        for (let chr of str2) {
+            if (uPattern.test(chr)) {
+                if (state === 1) {
+                    _str = `${_str}${chr.toLowerCase()}`;
+                } else {
+                    _str = `${_str}-${chr.toLowerCase()}`;
+                }
+                state = 1
+            } else {
+                _str = `${_str}${chr.toLowerCase()}`;
+                state = 0
+            }
+        }
+        _str = _str.replace(/---/g, '-').replace(/--/g, '-');
+
+        return _str;
+    }
+
+}
\ No newline at end of file

src/utils/xml-writer/xml-writer.ts

+/**
+ * xml工具类
+ * 
+ * @export
+ * @class XMLWriter
+ */
+export class XMLWriter {
+    public XML: any[] = [];
+    public nodes: any[] = [];
+    public State = '';
+
+    /**
+     * 
+     * 
+     * @param {any} Str 
+     * @returns 
+     * @memberof XMLWriter
+     */
+    public formatXML(Str: any) {
+        if (Str) {
+            return Str.replace(/&/g, '&amp;').replace(/\"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\n/g, '&#xA;').replace(/\r/g, '&#xD;');
+        }
+        return '';
+    }
+
+    /**
+     * 
+     * 
+     * @param {any} Name 
+     * @returns 
+     * @memberof XMLWriter
+     */
+    public beginNode(Name: any) {
+        if (!Name) {
+            return;
+        }
+        if (this.State === 'beg') {
+            this.XML.push('>');
+        }
+        this.State = 'beg';
+        this.nodes.push(Name);
+        this.XML.push('<' + Name);
+    }
+
+    /**
+     * 
+     * 
+     * @memberof XMLWriter
+     */
+    public endNode() {
+        if (this.State === 'beg') {
+            this.XML.push('/>');
+            this.nodes.pop();
+        } else if (this.nodes.length > 0) {
+            this.XML.push('</' + this.nodes.pop() + '>');
+        }
+        this.State = '';
+    }
+
+    /**
+     * 
+     * 
+     * @param {any} Name 
+     * @param {any} Value 
+     * @returns 
+     * @memberof XMLWriter
+     */
+    public attrib(Name: any, Value: any) {
+        if (this.State !== 'beg' || !Name) {
+            return;
+        }
+        this.XML.push(' ' + Name + '="' + this.formatXML(Value) + '"');
+    }
+
+    /**
+     * 
+     * 
+     * @param {any} Value 
+     * @memberof XMLWriter
+     */
+    public writeString(Value: any) {
+        if (this.State === 'beg') {
+            this.XML.push('>');
+        }
+        this.XML.push(this.formatXML(Value));
+        this.State = '';
+    }
+
+    /**
+     * 
+     * 
+     * @param {any} Name 
+     * @param {any} Value 
+     * @returns 
+     * @memberof XMLWriter
+     */
+    public node(Name: any, Value: any) {
+        if (!Name) {
+            return;
+        }
+        if (this.State === 'beg') {
+            this.XML.push('>');
+        }
+        this.XML.push((Value === '' || !Value) ? '<' + Name + '/>' : '<' + Name + '>' + this.formatXML(Value) + '</' + Name + '>');
+        this.State = '';
+    }
+
+    /**
+     * 
+     * 
+     * @memberof XMLWriter
+     */
+    public close() {
+        while (this.nodes.length > 0) {
+            this.endNode();
+        }
+        this.State = 'closed';
+    }
+
+    /**
+     * 
+     * 
+     * @returns 
+     * @memberof XMLWriter
+     */
+    public toString() { return this.XML.join(''); }
+}
\ No newline at end of file

tests/e2e/plugins/index.js

+// https://docs.cypress.io/guides/guides/plugins-guide.html
+
+// if you need a custom webpack configuration you can uncomment the following import
+// and then use the `file:preprocessor` event
+// as explained in the cypress docs
+// https://docs.cypress.io/api/plugins/preprocessors-api.html#Examples
+
+/* eslint-disable import/no-extraneous-dependencies, global-require, arrow-body-style */
+// const webpack = require('@cypress/webpack-preprocessor')
+
+module.exports = (on, config) => {
+  // on('file:preprocessor', webpack({
+  //  webpackOptions: require('@vue/cli-service/webpack.config'),
+  //  watchOptions: {}
+  // }))
+
+  return Object.assign({}, config, {
+    fixturesFolder: 'tests/e2e/fixtures',
+    integrationFolder: 'tests/e2e/specs',
+    screenshotsFolder: 'tests/e2e/screenshots',
+    videosFolder: 'tests/e2e/videos',
+    supportFile: 'tests/e2e/support/index.js'
+  })
+}

tests/e2e/specs/test.js

+// https://docs.cypress.io/api/introduction/api.html
+
+describe('My First Test', () => {
+  it('Visits the app root url', () => {
+    cy.visit('/')
+    cy.contains('h1', 'Welcome to Your Vue.js + TypeScript App')
+  })
+})

tests/e2e/support/commands.js

+// ***********************************************
+// This example commands.js shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add("login", (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This is will overwrite an existing command --
+// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })

tests/e2e/support/index.js

+// ***********************************************************
+// This example support/index.js is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands'
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')

tests/unit/example.spec.ts

+// import { shallowMount } from '@vue/test-utils';
+// import HelloWorld from '@/components/HelloWorld.vue';
+
+// describe('HelloWorld.vue', () => {
+//   it('renders props.msg when passed', () => {
+//     const msg = 'new message';
+//     const wrapper = shallowMount(HelloWorld, {
+//       propsData: { msg },
+//     });
+//     expect(wrapper.text()).toMatch(msg);
+//   });
+// });

tsconfig.json

+{
+  "compilerOptions": {
+    "target": "esnext",
+    "module": "esnext",
+    "strict": true,
+    "jsx": "preserve",
+    "importHelpers": true,
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "experimentalDecorators": true,
+    "allowSyntheticDefaultImports": true,
+    "sourceMap": true,
+    "baseUrl": ".",
+    "types": [
+      "webpack-env"
+    ],
+    "paths": {
+      "@/*": [
+        "src/*"
+      ],
+      "@utils": ["src/utils"],
+      "@utils/*": ["src/utils/*"],
+      "@engine": ["src/engine"],
+      "@engine/*": ["src/engine/*"],
+      "@pages": ["src/pages"],
+      "@pages/*": ["src/pages/*"],
+      "@widget": ["src/widget"],
+      "@widget/*": ["src/widget/*"],
+      "@components": ["src/components"],
+      "@components/*": ["src/components/*"],
+      "@locale": ["src/locale"],
+      "@locale/*": ["src/locale/*"],
+    },
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable",
+      "scripthost",
+      "es6",
+      "es7"
+    ]
+  },
+  "include": [
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "src/**/*.vue",
+    "src/**/*.jsx",
+    "tests/**/*.ts",
+    "tests/**/*.tsx",
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}

tslint.json

+{
+  "defaultSeverity": "none",
+  "extends": [
+    "tslint:recommended"
+  ],
+  "linterOptions": {
+    "exclude": [
+      "node_modules/**"
+    ]
+  },
+  "rules": {
+    "quotemark": false,
+    "indent": [true, "spaces", 2],
+    "interface-name": false,
+    "ordered-imports": false,
+    "object-literal-sort-keys": false,
+    "no-consecutive-blank-lines": false,
+    "max-line-length": false,
+    "trailing-comma": false,
+    "member-ordering": false,
+    "no-console": false,
+    "eofline": false,
+    "no-empty": false,
+    "no-trailing-whitespace": false,
+    "variable-name": false,
+    "no-shadowed-variable": false
+  }
+}
\ No newline at end of file