100 changed files with 46071 additions and 0 deletions
+ 21
- 0
.gitignore
View File
| @@ -0,0 +1,21 @@ | |||
| .DS_Store | |||
| node_modules | |||
| /dist | |||
| # 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? | |||
+ 5
- 0
babel.config.js
View File
| @@ -0,0 +1,5 @@ | |||
| module.exports = { | |||
| presets: [ | |||
| '@vue/cli-plugin-babel/preset' | |||
| ] | |||
| } | |||
+ 13295
- 0
package-lock.json
File diff suppressed because it is too large
View File
+ 68
- 0
package.json
View File
| @@ -0,0 +1,68 @@ | |||
| { | |||
| "name": "ele-admin", | |||
| "version": "0.1.0", | |||
| "private": true, | |||
| "scripts": { | |||
| "dev": "vue-cli-service serve", | |||
| "build": "vue-cli-service build", | |||
| "lint": "vue-cli-service lint" | |||
| }, | |||
| "dependencies": { | |||
| "@riophae/vue-treeselect": "^0.4.0", | |||
| "@tinymce/tinymce-vue": "^3.2.2", | |||
| "axios": "^0.19.2", | |||
| "core-js": "^3.6.5", | |||
| "countup.js": "^2.0.5", | |||
| "cropperjs": "^1.5.7", | |||
| "echarts": "^4.9.0", | |||
| "echarts-wordcloud": "^1.1.3", | |||
| "element-ui": "^2.13.2", | |||
| "nprogress": "^0.2.0", | |||
| "tinymce": "^5.4.0", | |||
| "vue": "^2.6.11", | |||
| "vue-axios": "^2.1.5", | |||
| "vue-lazyload": "^1.3.3", | |||
| "vue-clipboard2": "^0.3.1", | |||
| "vue-countup-v2": "^4.0.0", | |||
| "vue-qr": "^2.2.1", | |||
| "vue-router": "^3.2.0", | |||
| "vuedraggable": "^2.24.0", | |||
| "vuex": "^3.4.0", | |||
| "xgplayer-vue": "^1.1.5", | |||
| "xlsx": "^0.16.3" | |||
| }, | |||
| "devDependencies": { | |||
| "@amap/amap-jsapi-loader": "0.0.1", | |||
| "@vue/cli-plugin-babel": "~4.4.0", | |||
| "@vue/cli-plugin-eslint": "~4.4.0", | |||
| "@vue/cli-plugin-router": "~4.4.6", | |||
| "@vue/cli-plugin-vuex": "~4.4.6", | |||
| "@vue/cli-service": "~4.4.0", | |||
| "babel-eslint": "^10.1.0", | |||
| "compression-webpack-plugin": "^6.0.2", | |||
| "eslint": "^6.7.2", | |||
| "eslint-plugin-vue": "^6.2.2", | |||
| "node-sass": "^4.14.1", | |||
| "sass-loader": "^8.0.2", | |||
| "vue-template-compiler": "^2.6.11" | |||
| }, | |||
| "eslintConfig": { | |||
| "root": true, | |||
| "env": { | |||
| "node": true | |||
| }, | |||
| "extends": [ | |||
| "plugin:vue/essential", | |||
| "eslint:recommended" | |||
| ], | |||
| "parserOptions": { | |||
| "parser": "babel-eslint" | |||
| }, | |||
| "rules": {} | |||
| }, | |||
| "browserslist": [ | |||
| "> 1%", | |||
| "last 2 versions", | |||
| "not dead" | |||
| ] | |||
| } | |||
BIN
public/favicon.ico
View File
| Before | After |
|---|---|
|
|
+ 26
- 0
public/index.html
View File
| @@ -0,0 +1,26 @@ | |||
| <!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> | |||
| <script> | |||
| var _hmt = _hmt || []; | |||
| (function() { | |||
| var hm = document.createElement("script"); | |||
| hm.src = "https://hm.baidu.com/hm.js?96c939d40d09361c5c16c18b81d53069"; | |||
| var s = document.getElementsByTagName("script")[0]; | |||
| s.parentNode.insertBefore(hm, s); | |||
| })(); | |||
| </script> | |||
| </head> | |||
| <body> | |||
| <noscript> | |||
| <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> | |||
| </noscript> | |||
| <div id="app"><div class="ele-admin-loading"></div><style>.ele-admin-loading{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.ele-admin-loading:before{content:"";width:30px;height:30px;margin:0 auto;display:block;border-radius:50%;background-color:#409eff;animation:loading-bounce .3s cubic-bezier(0.05,0,0.2,1) infinite alternate}.ele-admin-loading:after{content:"";width:10px;height:2px;margin:0 auto;display:block;border-radius:50%;background-color:#BBB;animation:loading-shadow .3s cubic-bezier(0.05,0,0.2,1) infinite alternate}@keyframes loading-bounce{from{transform:translateY(0)}to{transform:translateY(-40px)}}@keyframes loading-shadow{from{transform:scale(1,1);opacity:1}to{transform:scale(3,2);opacity:.3}}</style></div> | |||
| <!-- built files will be auto injected --> | |||
| </body> | |||
| </html> | |||
+ 389
- 0
public/tinymce/langs/zh_CN.js
View File
| @@ -0,0 +1,389 @@ | |||
| tinymce.addI18n('zh_CN',{ | |||
| "Redo": "\u91cd\u505a", | |||
| "Undo": "\u64a4\u9500", | |||
| "Cut": "\u526a\u5207", | |||
| "Copy": "\u590d\u5236", | |||
| "Paste": "\u7c98\u8d34", | |||
| "Select all": "\u5168\u9009", | |||
| "New document": "\u65b0\u6587\u4ef6", | |||
| "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\u8fb9\u5bf9\u9f50", | |||
| "Align center": "\u4e2d\u95f4\u5bf9\u9f50", | |||
| "Align right": "\u53f3\u8fb9\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\u6253\u5f00\u526a\u8d34\u677f\uff0c\u8bf7\u4f7f\u7528Ctrl+X\/C\/V\u7b49\u5feb\u6377\u952e\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\u5148\u683c\u5f0f\u5316\u7684", | |||
| "Div": "Div", | |||
| "Pre": "Pre", | |||
| "Code": "\u4ee3\u7801", | |||
| "Paragraph": "\u6bb5\u843d", | |||
| "Blockquote": "\u5f15\u6587\u533a\u5757", | |||
| "Inline": "\u6587\u672c", | |||
| "Blocks": "\u57fa\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", | |||
| "Fonts": "\u5b57\u4f53", | |||
| "Font Sizes": "\u5b57\u53f7", | |||
| "Class": "\u7c7b\u578b", | |||
| "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 characters...": "\u7279\u6b8a\u5b57\u7b26...", | |||
| "Source code": "\u6e90\u4ee3\u7801", | |||
| "Insert\/Edit code sample": "\u63d2\u5165\/\u7f16\u8f91\u4ee3\u7801\u793a\u4f8b", | |||
| "Language": "\u8bed\u8a00", | |||
| "Code sample...": "\u793a\u4f8b\u4ee3\u7801...", | |||
| "Color Picker": "\u9009\u8272\u5668", | |||
| "R": "R", | |||
| "G": "G", | |||
| "B": "B", | |||
| "Left to right": "\u4ece\u5de6\u5230\u53f3", | |||
| "Right to left": "\u4ece\u53f3\u5230\u5de6", | |||
| "Emoticons...": "\u8868\u60c5\u7b26\u53f7...", | |||
| "Metadata and Document Properties": "\u5143\u6570\u636e\u548c\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\/Edit Link": "\u63d2\u5165\/\u7f16\u8f91\u94fe\u63a5", | |||
| "Insert\/edit link": "\u63d2\u5165\/\u7f16\u8f91\u94fe\u63a5", | |||
| "Text to display": "\u663e\u793a\u6587\u5b57", | |||
| "Url": "\u5730\u5740", | |||
| "Open link in...": "\u94fe\u63a5\u6253\u5f00\u4f4d\u7f6e...", | |||
| "Current window": "\u5f53\u524d\u7a97\u53e3", | |||
| "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", | |||
| "Alternative source URL": "\u66ff\u4ee3\u6765\u6e90\u7f51\u5740", | |||
| "Media poster (Image URL)": "\u5c01\u9762(\u56fe\u7247\u5730\u5740)", | |||
| "Paste your embed code below:": "\u5c06\u5185\u5d4c\u4ee3\u7801\u7c98\u8d34\u5728\u4e0b\u9762:", | |||
| "Embed": "\u5185\u5d4c", | |||
| "Media...": "\u591a\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", | |||
| "Previous": "\u4e0a\u4e00\u4e2a", | |||
| "Next": "\u4e0b\u4e00\u4e2a", | |||
| "Find and replace...": "\u67e5\u627e\u5e76\u66ff\u6362...", | |||
| "Could not find the specified string.": "\u672a\u627e\u5230\u641c\u7d22\u5185\u5bb9.", | |||
| "Match case": "\u533a\u5206\u5927\u5c0f\u5199", | |||
| "Find whole words only": "\u5168\u5b57\u5339\u914d", | |||
| "Spell check": "\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", | |||
| "Show caption": "\u663e\u793a\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", | |||
| "Remove color": "\u79fb\u9664\u989c\u8272", | |||
| "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", | |||
| "Word count": "\u5b57\u6570", | |||
| "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", | |||
| "Image title": "\u56fe\u7247\u6807\u9898", | |||
| "Border width": "\u8fb9\u6846\u5bbd\u5ea6", | |||
| "Border style": "\u8fb9\u6846\u6837\u5f0f", | |||
| "Error": "\u9519\u8bef", | |||
| "Warn": "\u8b66\u544a", | |||
| "Valid": "\u6709\u6548", | |||
| "To open the popup, press Shift+Enter": "\u6309Shitf+Enter\u952e\u6253\u5f00\u5bf9\u8bdd\u6846", | |||
| "Rich Text Area. Press ALT-0 for help.": "\u7f16\u8f91\u533a\u3002\u6309Alt+0\u952e\u6253\u5f00\u5e2e\u52a9\u3002", | |||
| "System Font": "\u7cfb\u7edf\u5b57\u4f53", | |||
| "Failed to upload image: {0}": "\u56fe\u7247\u4e0a\u4f20\u5931\u8d25: {0}", | |||
| "Failed to load plugin: {0} from url {1}": "\u63d2\u4ef6\u52a0\u8f7d\u5931\u8d25: {0} \u6765\u81ea\u94fe\u63a5 {1}", | |||
| "Failed to load plugin url: {0}": "\u63d2\u4ef6\u52a0\u8f7d\u5931\u8d25 \u94fe\u63a5: {0}", | |||
| "Failed to initialize plugin: {0}": "\u63d2\u4ef6\u521d\u59cb\u5316\u5931\u8d25: {0}", | |||
| "example": "\u793a\u4f8b", | |||
| "Search": "\u641c\u7d22", | |||
| "All": "\u5168\u90e8", | |||
| "Currency": "\u8d27\u5e01", | |||
| "Text": "\u6587\u5b57", | |||
| "Quotations": "\u5f15\u7528", | |||
| "Mathematical": "\u6570\u5b66", | |||
| "Extended Latin": "\u62c9\u4e01\u8bed\u6269\u5145", | |||
| "Symbols": "\u7b26\u53f7", | |||
| "Arrows": "\u7bad\u5934", | |||
| "User Defined": "\u81ea\u5b9a\u4e49", | |||
| "dollar sign": "\u7f8e\u5143\u7b26\u53f7", | |||
| "currency sign": "\u8d27\u5e01\u7b26\u53f7", | |||
| "euro-currency sign": "\u6b27\u5143\u7b26\u53f7", | |||
| "colon sign": "\u5192\u53f7", | |||
| "cruzeiro sign": "\u514b\u9c81\u8d5b\u7f57\u5e01\u7b26\u53f7", | |||
| "french franc sign": "\u6cd5\u90ce\u7b26\u53f7", | |||
| "lira sign": "\u91cc\u62c9\u7b26\u53f7", | |||
| "mill sign": "\u5bc6\u5c14\u7b26\u53f7", | |||
| "naira sign": "\u5948\u62c9\u7b26\u53f7", | |||
| "peseta sign": "\u6bd4\u585e\u5854\u7b26\u53f7", | |||
| "rupee sign": "\u5362\u6bd4\u7b26\u53f7", | |||
| "won sign": "\u97e9\u5143\u7b26\u53f7", | |||
| "new sheqel sign": "\u65b0\u8c22\u514b\u5c14\u7b26\u53f7", | |||
| "dong sign": "\u8d8a\u5357\u76fe\u7b26\u53f7", | |||
| "kip sign": "\u8001\u631d\u57fa\u666e\u7b26\u53f7", | |||
| "tugrik sign": "\u56fe\u683c\u91cc\u514b\u7b26\u53f7", | |||
| "drachma sign": "\u5fb7\u62c9\u514b\u9a6c\u7b26\u53f7", | |||
| "german penny symbol": "\u5fb7\u56fd\u4fbf\u58eb\u7b26\u53f7", | |||
| "peso sign": "\u6bd4\u7d22\u7b26\u53f7", | |||
| "guarani sign": "\u74dc\u62c9\u5c3c\u7b26\u53f7", | |||
| "austral sign": "\u6fb3\u5143\u7b26\u53f7", | |||
| "hryvnia sign": "\u683c\u91cc\u592b\u5c3c\u4e9a\u7b26\u53f7", | |||
| "cedi sign": "\u585e\u5730\u7b26\u53f7", | |||
| "livre tournois sign": "\u91cc\u5f17\u5f17\u5c14\u7b26\u53f7", | |||
| "spesmilo sign": "spesmilo\u7b26\u53f7", | |||
| "tenge sign": "\u575a\u6208\u7b26\u53f7", | |||
| "indian rupee sign": "\u5370\u5ea6\u5362\u6bd4", | |||
| "turkish lira sign": "\u571f\u8033\u5176\u91cc\u62c9", | |||
| "nordic mark sign": "\u5317\u6b27\u9a6c\u514b", | |||
| "manat sign": "\u9a6c\u7eb3\u7279\u7b26\u53f7", | |||
| "ruble sign": "\u5362\u5e03\u7b26\u53f7", | |||
| "yen character": "\u65e5\u5143\u5b57\u6837", | |||
| "yuan character": "\u4eba\u6c11\u5e01\u5143\u5b57\u6837", | |||
| "yuan character, in hong kong and taiwan": "\u5143\u5b57\u6837\uff08\u6e2f\u53f0\u5730\u533a\uff09", | |||
| "yen\/yuan character variant one": "\u5143\u5b57\u6837\uff08\u5927\u5199\uff09", | |||
| "Loading emoticons...": "\u52a0\u8f7d\u8868\u60c5\u7b26\u53f7...", | |||
| "Could not load emoticons": "\u4e0d\u80fd\u52a0\u8f7d\u8868\u60c5\u7b26\u53f7", | |||
| "People": "\u4eba\u7c7b", | |||
| "Animals and Nature": "\u52a8\u7269\u548c\u81ea\u7136", | |||
| "Food and Drink": "\u98df\u7269\u548c\u996e\u54c1", | |||
| "Activity": "\u6d3b\u52a8", | |||
| "Travel and Places": "\u65c5\u6e38\u548c\u5730\u70b9", | |||
| "Objects": "\u7269\u4ef6", | |||
| "Flags": "\u65d7\u5e1c", | |||
| "Characters": "\u5b57\u7b26", | |||
| "Characters (no spaces)": "\u5b57\u7b26(\u65e0\u7a7a\u683c)", | |||
| "Error: Form submit field collision.": "\u9519\u8bef: \u8868\u5355\u63d0\u4ea4\u5b57\u6bb5\u51b2\u7a81\u3002", | |||
| "Error: No form element found.": "\u9519\u8bef: \u6ca1\u6709\u8868\u5355\u63a7\u4ef6\u3002", | |||
| "Update": "\u66f4\u65b0", | |||
| "Color swatch": "\u989c\u8272\u6837\u672c", | |||
| "Turquoise": "\u9752\u7eff\u8272", | |||
| "Green": "\u7eff\u8272", | |||
| "Blue": "\u84dd\u8272", | |||
| "Purple": "\u7d2b\u8272", | |||
| "Navy Blue": "\u6d77\u519b\u84dd", | |||
| "Dark Turquoise": "\u6df1\u84dd\u7eff\u8272", | |||
| "Dark Green": "\u6df1\u7eff\u8272", | |||
| "Medium Blue": "\u4e2d\u84dd\u8272", | |||
| "Medium Purple": "\u4e2d\u7d2b\u8272", | |||
| "Midnight Blue": "\u6df1\u84dd\u8272", | |||
| "Yellow": "\u9ec4\u8272", | |||
| "Orange": "\u6a59\u8272", | |||
| "Red": "\u7ea2\u8272", | |||
| "Light Gray": "\u6d45\u7070\u8272", | |||
| "Gray": "\u7070\u8272", | |||
| "Dark Yellow": "\u6697\u9ec4\u8272", | |||
| "Dark Orange": "\u6df1\u6a59\u8272", | |||
| "Dark Red": "\u6df1\u7ea2\u8272", | |||
| "Medium Gray": "\u4e2d\u7070\u8272", | |||
| "Dark Gray": "\u6df1\u7070\u8272", | |||
| "Black": "\u9ed1\u8272", | |||
| "White": "\u767d\u8272", | |||
| "Switch to or from fullscreen mode": "\u5207\u6362\u5168\u5c4f\u6a21\u5f0f", | |||
| "Open help dialog": "\u6253\u5f00\u5e2e\u52a9\u5bf9\u8bdd\u6846", | |||
| "history": "\u5386\u53f2", | |||
| "styles": "\u6837\u5f0f", | |||
| "formatting": "\u683c\u5f0f\u5316", | |||
| "alignment": "\u5bf9\u9f50", | |||
| "indentation": "\u7f29\u8fdb", | |||
| "permanent pen": "\u8bb0\u53f7\u7b14", | |||
| "comments": "\u5907\u6ce8", | |||
| "Anchor": "\u951a\u70b9", | |||
| "Special character": "\u7279\u6b8a\u7b26\u53f7", | |||
| "Code sample": "\u4ee3\u7801\u793a\u4f8b", | |||
| "Color": "\u989c\u8272", | |||
| "Emoticons": "\u8868\u60c5", | |||
| "Document properties": "\u6587\u6863\u5c5e\u6027", | |||
| "Image": "\u56fe\u7247", | |||
| "Insert link": "\u63d2\u5165\u94fe\u63a5", | |||
| "Target": "\u6253\u5f00\u65b9\u5f0f", | |||
| "Link": "\u94fe\u63a5", | |||
| "Poster": "\u5c01\u9762", | |||
| "Media": "\u5a92\u4f53", | |||
| "Print": "\u6253\u5370", | |||
| "Prev": "\u4e0a\u4e00\u4e2a", | |||
| "Find and replace": "\u67e5\u627e\u548c\u66ff\u6362", | |||
| "Whole words": "\u5168\u5b57\u5339\u914d", | |||
| "Spellcheck": "\u62fc\u5199\u68c0\u67e5", | |||
| "Caption": "\u6807\u9898", | |||
| "Insert template": "\u63d2\u5165\u6a21\u677f" | |||
| }); | |||
+ 59
- 0
public/tinymce/skins/content/dark/content.css
View File
| @@ -0,0 +1,59 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| body { | |||
| background-color: #2f3742; | |||
| color: #dfe0e4; | |||
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; | |||
| line-height: 1.4; | |||
| margin: 1rem; | |||
| } | |||
| a { | |||
| color: #4099ff; | |||
| } | |||
| table { | |||
| border-collapse: collapse; | |||
| } | |||
| table th, | |||
| table td { | |||
| border: 1px solid #6d737b; | |||
| padding: 0.4rem; | |||
| } | |||
| figure { | |||
| display: table; | |||
| margin: 1rem auto; | |||
| } | |||
| figure figcaption { | |||
| color: #8a8f97; | |||
| display: block; | |||
| margin-top: 0.25rem; | |||
| text-align: center; | |||
| } | |||
| hr { | |||
| border-color: #6d737b; | |||
| border-style: solid; | |||
| border-width: 1px 0 0 0; | |||
| } | |||
| code { | |||
| background-color: #6d737b; | |||
| border-radius: 3px; | |||
| padding: 0.1rem 0.2rem; | |||
| } | |||
| /* Make text in selected cells in tables dark and readable */ | |||
| td[data-mce-selected], | |||
| th[data-mce-selected] { | |||
| color: #333; | |||
| } | |||
| .mce-content-body:not([dir=rtl]) blockquote { | |||
| border-left: 2px solid #6d737b; | |||
| margin-left: 1.5rem; | |||
| padding-left: 1rem; | |||
| } | |||
| .mce-content-body[dir=rtl] blockquote { | |||
| border-right: 2px solid #6d737b; | |||
| margin-right: 1.5rem; | |||
| padding-right: 1rem; | |||
| } | |||
+ 7
- 0
public/tinymce/skins/content/dark/content.min.css
View File
| @@ -0,0 +1,7 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| body{background-color:#2f3742;color:#dfe0e4;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;line-height:1.4;margin:1rem}a{color:#4099ff}table{border-collapse:collapse}table td,table th{border:1px solid #6d737b;padding:.4rem}figure{display:table;margin:1rem auto}figure figcaption{color:#8a8f97;display:block;margin-top:.25rem;text-align:center}hr{border-color:#6d737b;border-style:solid;border-width:1px 0 0 0}code{background-color:#6d737b;border-radius:3px;padding:.1rem .2rem}td[data-mce-selected],th[data-mce-selected]{color:#333}.mce-content-body:not([dir=rtl]) blockquote{border-left:2px solid #6d737b;margin-left:1.5rem;padding-left:1rem}.mce-content-body[dir=rtl] blockquote{border-right:2px solid #6d737b;margin-right:1.5rem;padding-right:1rem} | |||
+ 49
- 0
public/tinymce/skins/content/default/content.css
View File
| @@ -0,0 +1,49 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| body { | |||
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; | |||
| line-height: 1.4; | |||
| margin: 1rem; | |||
| } | |||
| table { | |||
| border-collapse: collapse; | |||
| } | |||
| table th, | |||
| table td { | |||
| border: 1px solid #ccc; | |||
| padding: 0.4rem; | |||
| } | |||
| figure { | |||
| display: table; | |||
| margin: 1rem auto; | |||
| } | |||
| figure figcaption { | |||
| color: #999; | |||
| display: block; | |||
| margin-top: 0.25rem; | |||
| text-align: center; | |||
| } | |||
| hr { | |||
| border-color: #ccc; | |||
| border-style: solid; | |||
| border-width: 1px 0 0 0; | |||
| } | |||
| code { | |||
| background-color: #e8e8e8; | |||
| border-radius: 3px; | |||
| padding: 0.1rem 0.2rem; | |||
| } | |||
| .mce-content-body:not([dir=rtl]) blockquote { | |||
| border-left: 2px solid #ccc; | |||
| margin-left: 1.5rem; | |||
| padding-left: 1rem; | |||
| } | |||
| .mce-content-body[dir=rtl] blockquote { | |||
| border-right: 2px solid #ccc; | |||
| margin-right: 1.5rem; | |||
| padding-right: 1rem; | |||
| } | |||
+ 7
- 0
public/tinymce/skins/content/default/content.min.css
View File
| @@ -0,0 +1,7 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;line-height:1.4;margin:1rem}table{border-collapse:collapse}table td,table th{border:1px solid #ccc;padding:.4rem}figure{display:table;margin:1rem auto}figure figcaption{color:#999;display:block;margin-top:.25rem;text-align:center}hr{border-color:#ccc;border-style:solid;border-width:1px 0 0 0}code{background-color:#e8e8e8;border-radius:3px;padding:.1rem .2rem}.mce-content-body:not([dir=rtl]) blockquote{border-left:2px solid #ccc;margin-left:1.5rem;padding-left:1rem}.mce-content-body[dir=rtl] blockquote{border-right:2px solid #ccc;margin-right:1.5rem;padding-right:1rem} | |||
+ 54
- 0
public/tinymce/skins/content/document/content.css
View File
| @@ -0,0 +1,54 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| @media screen { | |||
| html { | |||
| background: #f4f4f4; | |||
| min-height: 100%; | |||
| } | |||
| } | |||
| body { | |||
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; | |||
| } | |||
| @media screen { | |||
| body { | |||
| background-color: #fff; | |||
| box-shadow: 0 0 4px rgba(0, 0, 0, 0.15); | |||
| box-sizing: border-box; | |||
| margin: 1rem auto 0; | |||
| max-width: 820px; | |||
| min-height: calc(100vh - 1rem); | |||
| padding: 4rem 6rem 6rem 6rem; | |||
| } | |||
| } | |||
| table { | |||
| border-collapse: collapse; | |||
| } | |||
| table th, | |||
| table td { | |||
| border: 1px solid #ccc; | |||
| padding: 0.4rem; | |||
| } | |||
| figure figcaption { | |||
| color: #999; | |||
| margin-top: 0.25rem; | |||
| text-align: center; | |||
| } | |||
| hr { | |||
| border-color: #ccc; | |||
| border-style: solid; | |||
| border-width: 1px 0 0 0; | |||
| } | |||
| .mce-content-body:not([dir=rtl]) blockquote { | |||
| border-left: 2px solid #ccc; | |||
| margin-left: 1.5rem; | |||
| padding-left: 1rem; | |||
| } | |||
| .mce-content-body[dir=rtl] blockquote { | |||
| border-right: 2px solid #ccc; | |||
| margin-right: 1.5rem; | |||
| padding-right: 1rem; | |||
| } | |||
+ 7
- 0
public/tinymce/skins/content/document/content.min.css
View File
| @@ -0,0 +1,7 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| @media screen{html{background:#f4f4f4;min-height:100%}}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif}@media screen{body{background-color:#fff;box-shadow:0 0 4px rgba(0,0,0,.15);box-sizing:border-box;margin:1rem auto 0;max-width:820px;min-height:calc(100vh - 1rem);padding:4rem 6rem 6rem 6rem}}table{border-collapse:collapse}table td,table th{border:1px solid #ccc;padding:.4rem}figure figcaption{color:#999;margin-top:.25rem;text-align:center}hr{border-color:#ccc;border-style:solid;border-width:1px 0 0 0}.mce-content-body:not([dir=rtl]) blockquote{border-left:2px solid #ccc;margin-left:1.5rem;padding-left:1rem}.mce-content-body[dir=rtl] blockquote{border-right:2px solid #ccc;margin-right:1.5rem;padding-right:1rem} | |||
+ 50
- 0
public/tinymce/skins/content/writer/content.css
View File
| @@ -0,0 +1,50 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| body { | |||
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; | |||
| line-height: 1.4; | |||
| margin: 1rem auto; | |||
| max-width: 900px; | |||
| } | |||
| table { | |||
| border-collapse: collapse; | |||
| } | |||
| table th, | |||
| table td { | |||
| border: 1px solid #ccc; | |||
| padding: 0.4rem; | |||
| } | |||
| figure { | |||
| display: table; | |||
| margin: 1rem auto; | |||
| } | |||
| figure figcaption { | |||
| color: #999; | |||
| display: block; | |||
| margin-top: 0.25rem; | |||
| text-align: center; | |||
| } | |||
| hr { | |||
| border-color: #ccc; | |||
| border-style: solid; | |||
| border-width: 1px 0 0 0; | |||
| } | |||
| code { | |||
| background-color: #e8e8e8; | |||
| border-radius: 3px; | |||
| padding: 0.1rem 0.2rem; | |||
| } | |||
| .mce-content-body:not([dir=rtl]) blockquote { | |||
| border-left: 2px solid #ccc; | |||
| margin-left: 1.5rem; | |||
| padding-left: 1rem; | |||
| } | |||
| .mce-content-body[dir=rtl] blockquote { | |||
| border-right: 2px solid #ccc; | |||
| margin-right: 1.5rem; | |||
| padding-right: 1rem; | |||
| } | |||
+ 7
- 0
public/tinymce/skins/content/writer/content.min.css
View File
| @@ -0,0 +1,7 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;line-height:1.4;margin:1rem auto;max-width:900px}table{border-collapse:collapse}table td,table th{border:1px solid #ccc;padding:.4rem}figure{display:table;margin:1rem auto}figure figcaption{color:#999;display:block;margin-top:.25rem;text-align:center}hr{border-color:#ccc;border-style:solid;border-width:1px 0 0 0}code{background-color:#e8e8e8;border-radius:3px;padding:.1rem .2rem}.mce-content-body:not([dir=rtl]) blockquote{border-left:2px solid #ccc;margin-left:1.5rem;padding-left:1rem}.mce-content-body[dir=rtl] blockquote{border-right:2px solid #ccc;margin-right:1.5rem;padding-right:1rem} | |||
+ 677
- 0
public/tinymce/skins/ui/oxide-dark/content.css
View File
| @@ -0,0 +1,677 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| .mce-content-body .mce-item-anchor { | |||
| background: transparent url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'8'%20height%3D'12'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M0%200L8%200%208%2012%204.09117821%209%200%2012z'%20fill%3D%22%23cccccc%22%2F%3E%3C%2Fsvg%3E%0A") no-repeat center; | |||
| cursor: default; | |||
| display: inline-block; | |||
| height: 12px !important; | |||
| padding: 0 2px; | |||
| -webkit-user-modify: read-only; | |||
| -moz-user-modify: read-only; | |||
| -webkit-user-select: all; | |||
| -moz-user-select: all; | |||
| -ms-user-select: all; | |||
| user-select: all; | |||
| width: 8px !important; | |||
| } | |||
| .mce-content-body .mce-item-anchor[data-mce-selected] { | |||
| outline-offset: 1px; | |||
| } | |||
| .tox-comments-visible .tox-comment { | |||
| background-color: #fff0b7; | |||
| } | |||
| .tox-comments-visible .tox-comment--active { | |||
| background-color: #ffe168; | |||
| } | |||
| .tox-checklist > li:not(.tox-checklist--hidden) { | |||
| list-style: none; | |||
| margin: 0.25em 0; | |||
| } | |||
| .tox-checklist > li:not(.tox-checklist--hidden)::before { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-unchecked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2215%22%20height%3D%2215%22%20x%3D%22.5%22%20y%3D%22.5%22%20fill-rule%3D%22nonzero%22%20stroke%3D%22%236d737b%22%20rx%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A"); | |||
| background-size: 100%; | |||
| content: ''; | |||
| cursor: pointer; | |||
| height: 1em; | |||
| margin-left: -1.5em; | |||
| margin-top: 0.125em; | |||
| position: absolute; | |||
| width: 1em; | |||
| } | |||
| .tox-checklist li:not(.tox-checklist--hidden).tox-checklist--checked::before { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-checked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%234099FF%22%20fill-rule%3D%22nonzero%22%20rx%3D%222%22%2F%3E%3Cpath%20id%3D%22Path%22%20fill%3D%22%23FFF%22%20fill-rule%3D%22nonzero%22%20d%3D%22M11.5703186%2C3.14417309%20C11.8516238%2C2.73724603%2012.4164781%2C2.62829933%2012.83558%2C2.89774797%20C13.260121%2C3.17069355%2013.3759736%2C3.72932262%2013.0909105%2C4.14168582%20L7.7580587%2C11.8560195%20C7.43776896%2C12.3193404%206.76483983%2C12.3852142%206.35607322%2C11.9948725%20L3.02491697%2C8.8138662%20C2.66090143%2C8.46625845%202.65798871%2C7.89594698%203.01850234%2C7.54483354%20C3.373942%2C7.19866177%203.94940006%2C7.19592841%204.30829608%2C7.5386474%20L6.85276923%2C9.9684299%20L11.5703186%2C3.14417309%20Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A"); | |||
| } | |||
| [dir=rtl] .tox-checklist > li:not(.tox-checklist--hidden)::before { | |||
| margin-left: 0; | |||
| margin-right: -1.5em; | |||
| } | |||
| /* stylelint-disable */ | |||
| /* http://prismjs.com/ */ | |||
| /** | |||
| * Dracula Theme originally by Zeno Rocha [@zenorocha] | |||
| * https://draculatheme.com/ | |||
| * | |||
| * Ported for PrismJS by Albert Vallverdu [@byverdu] | |||
| */ | |||
| code[class*="language-"], | |||
| pre[class*="language-"] { | |||
| color: #f8f8f2; | |||
| background: none; | |||
| text-shadow: 0 1px rgba(0, 0, 0, 0.3); | |||
| 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; | |||
| tab-size: 4; | |||
| -webkit-hyphens: none; | |||
| -ms-hyphens: none; | |||
| hyphens: none; | |||
| } | |||
| /* Code blocks */ | |||
| pre[class*="language-"] { | |||
| padding: 1em; | |||
| margin: 0.5em 0; | |||
| overflow: auto; | |||
| border-radius: 0.3em; | |||
| } | |||
| :not(pre) > code[class*="language-"], | |||
| pre[class*="language-"] { | |||
| background: #282a36; | |||
| } | |||
| /* Inline code */ | |||
| :not(pre) > code[class*="language-"] { | |||
| padding: 0.1em; | |||
| border-radius: 0.3em; | |||
| white-space: normal; | |||
| } | |||
| .token.comment, | |||
| .token.prolog, | |||
| .token.doctype, | |||
| .token.cdata { | |||
| color: #6272a4; | |||
| } | |||
| .token.punctuation { | |||
| color: #f8f8f2; | |||
| } | |||
| .namespace { | |||
| opacity: 0.7; | |||
| } | |||
| .token.property, | |||
| .token.tag, | |||
| .token.constant, | |||
| .token.symbol, | |||
| .token.deleted { | |||
| color: #ff79c6; | |||
| } | |||
| .token.boolean, | |||
| .token.number { | |||
| color: #bd93f9; | |||
| } | |||
| .token.selector, | |||
| .token.attr-name, | |||
| .token.string, | |||
| .token.char, | |||
| .token.builtin, | |||
| .token.inserted { | |||
| color: #50fa7b; | |||
| } | |||
| .token.operator, | |||
| .token.entity, | |||
| .token.url, | |||
| .language-css .token.string, | |||
| .style .token.string, | |||
| .token.variable { | |||
| color: #f8f8f2; | |||
| } | |||
| .token.atrule, | |||
| .token.attr-value, | |||
| .token.function, | |||
| .token.class-name { | |||
| color: #f1fa8c; | |||
| } | |||
| .token.keyword { | |||
| color: #8be9fd; | |||
| } | |||
| .token.regex, | |||
| .token.important { | |||
| color: #ffb86c; | |||
| } | |||
| .token.important, | |||
| .token.bold { | |||
| font-weight: bold; | |||
| } | |||
| .token.italic { | |||
| font-style: italic; | |||
| } | |||
| .token.entity { | |||
| cursor: help; | |||
| } | |||
| /* stylelint-enable */ | |||
| .mce-content-body { | |||
| overflow-wrap: break-word; | |||
| word-wrap: break-word; | |||
| } | |||
| .mce-content-body .mce-visual-caret { | |||
| background-color: black; | |||
| background-color: currentColor; | |||
| position: absolute; | |||
| } | |||
| .mce-content-body .mce-visual-caret-hidden { | |||
| display: none; | |||
| } | |||
| .mce-content-body *[data-mce-caret] { | |||
| left: -1000px; | |||
| margin: 0; | |||
| padding: 0; | |||
| position: absolute; | |||
| right: auto; | |||
| top: 0; | |||
| } | |||
| .mce-content-body .mce-offscreen-selection { | |||
| left: -2000000px; | |||
| max-width: 1000000px; | |||
| position: absolute; | |||
| } | |||
| .mce-content-body *[contentEditable=false] { | |||
| cursor: default; | |||
| } | |||
| .mce-content-body *[contentEditable=true] { | |||
| cursor: text; | |||
| } | |||
| .tox-cursor-format-painter { | |||
| cursor: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M15%2C6%20C15%2C5.45%2014.55%2C5%2014%2C5%20L6%2C5%20C5.45%2C5%205%2C5.45%205%2C6%20L5%2C10%20C5%2C10.55%205.45%2C11%206%2C11%20L14%2C11%20C14.55%2C11%2015%2C10.55%2015%2C10%20L15%2C9%20L16%2C9%20L16%2C12%20L9%2C12%20L9%2C19%20C9%2C19.55%209.45%2C20%2010%2C20%20L11%2C20%20C11.55%2C20%2012%2C19.55%2012%2C19%20L12%2C14%20L18%2C14%20L18%2C7%20L15%2C7%20L15%2C6%20Z%22%2F%3E%0A%20%20%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M1%2C1%20L8.25%2C1%20C8.66421356%2C1%209%2C1.33578644%209%2C1.75%20L9%2C1.75%20C9%2C2.16421356%208.66421356%2C2.5%208.25%2C2.5%20L2.5%2C2.5%20L2.5%2C8.25%20C2.5%2C8.66421356%202.16421356%2C9%201.75%2C9%20L1.75%2C9%20C1.33578644%2C9%201%2C8.66421356%201%2C8.25%20L1%2C1%20Z%22%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A"), default; | |||
| } | |||
| .mce-content-body figure.align-left { | |||
| float: left; | |||
| } | |||
| .mce-content-body figure.align-right { | |||
| float: right; | |||
| } | |||
| .mce-content-body figure.image.align-center { | |||
| display: table; | |||
| margin-left: auto; | |||
| margin-right: auto; | |||
| } | |||
| .mce-preview-object { | |||
| border: 1px solid gray; | |||
| display: inline-block; | |||
| line-height: 0; | |||
| margin: 0 2px 0 2px; | |||
| position: relative; | |||
| } | |||
| .mce-preview-object .mce-shim { | |||
| background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .mce-preview-object[data-mce-selected="2"] .mce-shim { | |||
| display: none; | |||
| } | |||
| .mce-object { | |||
| background: transparent url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M4%203h16a1%201%200%200%201%201%201v16a1%201%200%200%201-1%201H4a1%201%200%200%201-1-1V4a1%201%200%200%201%201-1zm1%202v14h14V5H5zm4.79%202.565l5.64%204.028a.5.5%200%200%201%200%20.814l-5.64%204.028a.5.5%200%200%201-.79-.407V7.972a.5.5%200%200%201%20.79-.407z%22%20fill%3D%22%23cccccc%22%2F%3E%3C%2Fsvg%3E%0A") no-repeat center; | |||
| border: 1px dashed #aaa; | |||
| } | |||
| .mce-pagebreak { | |||
| border: 1px dashed #aaa; | |||
| cursor: default; | |||
| display: block; | |||
| height: 5px; | |||
| margin-top: 15px; | |||
| page-break-before: always; | |||
| width: 100%; | |||
| } | |||
| @media print { | |||
| .mce-pagebreak { | |||
| border: 0; | |||
| } | |||
| } | |||
| .tiny-pageembed .mce-shim { | |||
| background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .tiny-pageembed[data-mce-selected="2"] .mce-shim { | |||
| display: none; | |||
| } | |||
| .tiny-pageembed { | |||
| display: inline-block; | |||
| position: relative; | |||
| } | |||
| .tiny-pageembed--21by9, | |||
| .tiny-pageembed--16by9, | |||
| .tiny-pageembed--4by3, | |||
| .tiny-pageembed--1by1 { | |||
| display: block; | |||
| overflow: hidden; | |||
| padding: 0; | |||
| position: relative; | |||
| width: 100%; | |||
| } | |||
| .tiny-pageembed--21by9 { | |||
| padding-top: 42.857143%; | |||
| } | |||
| .tiny-pageembed--16by9 { | |||
| padding-top: 56.25%; | |||
| } | |||
| .tiny-pageembed--4by3 { | |||
| padding-top: 75%; | |||
| } | |||
| .tiny-pageembed--1by1 { | |||
| padding-top: 100%; | |||
| } | |||
| .tiny-pageembed--21by9 iframe, | |||
| .tiny-pageembed--16by9 iframe, | |||
| .tiny-pageembed--4by3 iframe, | |||
| .tiny-pageembed--1by1 iframe { | |||
| border: 0; | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .mce-content-body[data-mce-placeholder] { | |||
| position: relative; | |||
| } | |||
| .mce-content-body[data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| color: rgba(34, 47, 62, 0.7); | |||
| content: attr(data-mce-placeholder); | |||
| position: absolute; | |||
| } | |||
| .mce-content-body:not([dir=rtl])[data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| left: 1px; | |||
| } | |||
| .mce-content-body[dir=rtl][data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| right: 1px; | |||
| } | |||
| .mce-content-body div.mce-resizehandle { | |||
| background-color: #4099ff; | |||
| border-color: #4099ff; | |||
| border-style: solid; | |||
| border-width: 1px; | |||
| box-sizing: border-box; | |||
| height: 10px; | |||
| position: absolute; | |||
| width: 10px; | |||
| z-index: 10000; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:hover { | |||
| background-color: #4099ff; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(1) { | |||
| cursor: nwse-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(2) { | |||
| cursor: nesw-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(3) { | |||
| cursor: nwse-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(4) { | |||
| cursor: nesw-resize; | |||
| } | |||
| .mce-content-body .mce-clonedresizable { | |||
| opacity: 0.5; | |||
| outline: 1px dashed black; | |||
| position: absolute; | |||
| z-index: 10000; | |||
| } | |||
| .mce-content-body .mce-resize-helper { | |||
| background: #555; | |||
| background: rgba(0, 0, 0, 0.75); | |||
| border: 1px; | |||
| border-radius: 3px; | |||
| color: white; | |||
| display: none; | |||
| font-family: sans-serif; | |||
| font-size: 12px; | |||
| line-height: 14px; | |||
| margin: 5px 10px; | |||
| padding: 5px; | |||
| position: absolute; | |||
| white-space: nowrap; | |||
| z-index: 10001; | |||
| } | |||
| .tox-rtc-user-selection { | |||
| position: relative; | |||
| } | |||
| .tox-rtc-user-cursor { | |||
| bottom: 0; | |||
| cursor: default; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 2px; | |||
| } | |||
| .tox-rtc-user-cursor::before { | |||
| background-color: inherit; | |||
| border-radius: 50%; | |||
| content: ''; | |||
| display: block; | |||
| height: 8px; | |||
| position: absolute; | |||
| right: -3px; | |||
| top: -3px; | |||
| width: 8px; | |||
| } | |||
| .tox-rtc-user-cursor:hover::after { | |||
| background-color: inherit; | |||
| border-radius: 100px; | |||
| box-sizing: border-box; | |||
| color: #fff; | |||
| content: attr(data-user); | |||
| display: block; | |||
| font-size: 12px; | |||
| font-weight: bold; | |||
| left: -5px; | |||
| min-height: 8px; | |||
| min-width: 8px; | |||
| padding: 0 12px; | |||
| position: absolute; | |||
| top: -11px; | |||
| white-space: nowrap; | |||
| z-index: 1000; | |||
| } | |||
| .tox-rtc-user-selection--1 .tox-rtc-user-cursor { | |||
| background-color: #2dc26b; | |||
| } | |||
| .tox-rtc-user-selection--2 .tox-rtc-user-cursor { | |||
| background-color: #e03e2d; | |||
| } | |||
| .tox-rtc-user-selection--3 .tox-rtc-user-cursor { | |||
| background-color: #f1c40f; | |||
| } | |||
| .tox-rtc-user-selection--4 .tox-rtc-user-cursor { | |||
| background-color: #3598db; | |||
| } | |||
| .tox-rtc-user-selection--5 .tox-rtc-user-cursor { | |||
| background-color: #b96ad9; | |||
| } | |||
| .tox-rtc-user-selection--6 .tox-rtc-user-cursor { | |||
| background-color: #e67e23; | |||
| } | |||
| .tox-rtc-user-selection--7 .tox-rtc-user-cursor { | |||
| background-color: #aaa69d; | |||
| } | |||
| .tox-rtc-user-selection--8 .tox-rtc-user-cursor { | |||
| background-color: #f368e0; | |||
| } | |||
| .tox-rtc-remote-image { | |||
| background: #eaeaea url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2236%22%20height%3D%2212%22%20viewBox%3D%220%200%2036%2012%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%3Ccircle%20cx%3D%226%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%20%20%3Ccircle%20cx%3D%2218%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20begin%3D%22.33s%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%20%20%3Ccircle%20cx%3D%2230%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20begin%3D%22.66s%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%3C%2Fsvg%3E%0A") no-repeat center center; | |||
| border: 1px solid #ccc; | |||
| min-height: 240px; | |||
| min-width: 320px; | |||
| } | |||
| .mce-match-marker { | |||
| background: #aaa; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected::-moz-selection { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected::selection { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-content-body img[data-mce-selected], | |||
| .mce-content-body table[data-mce-selected] { | |||
| outline: 3px solid #4099ff; | |||
| } | |||
| .mce-content-body hr[data-mce-selected] { | |||
| outline: 3px solid #4099ff; | |||
| outline-offset: 1px; | |||
| } | |||
| .mce-content-body *[contentEditable=false] *[contentEditable=true]:focus { | |||
| outline: 3px solid #4099ff; | |||
| } | |||
| .mce-content-body *[contentEditable=false] *[contentEditable=true]:hover { | |||
| outline: 3px solid #4099ff; | |||
| } | |||
| .mce-content-body *[contentEditable=false][data-mce-selected] { | |||
| cursor: not-allowed; | |||
| outline: 3px solid #4099ff; | |||
| } | |||
| .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-color: #4099ff; | |||
| } | |||
| .mce-content-body .mce-edit-focus { | |||
| outline: 3px solid #4099ff; | |||
| } | |||
| .mce-content-body td[data-mce-selected], | |||
| .mce-content-body th[data-mce-selected] { | |||
| background-color: #b4d7ff !important; | |||
| } | |||
| .mce-content-body td[data-mce-selected]::-moz-selection, | |||
| .mce-content-body th[data-mce-selected]::-moz-selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body td[data-mce-selected]::selection, | |||
| .mce-content-body th[data-mce-selected]::selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body td[data-mce-selected] *, | |||
| .mce-content-body th[data-mce-selected] * { | |||
| -webkit-touch-callout: none; | |||
| -webkit-user-select: none; | |||
| -moz-user-select: none; | |||
| -ms-user-select: none; | |||
| user-select: none; | |||
| } | |||
| .mce-content-body img::-moz-selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body img::selection { | |||
| background: none; | |||
| } | |||
| .ephox-snooker-resizer-bar { | |||
| background-color: #4099ff; | |||
| opacity: 0; | |||
| -webkit-user-select: none; | |||
| -moz-user-select: none; | |||
| -ms-user-select: none; | |||
| user-select: none; | |||
| } | |||
| .ephox-snooker-resizer-cols { | |||
| cursor: col-resize; | |||
| } | |||
| .ephox-snooker-resizer-rows { | |||
| cursor: row-resize; | |||
| } | |||
| .ephox-snooker-resizer-bar.ephox-snooker-resizer-bar-dragging { | |||
| opacity: 1; | |||
| } | |||
| .mce-spellchecker-word { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'4'%20height%3D'4'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20stroke%3D'%23ff0000'%20fill%3D'none'%20stroke-linecap%3D'round'%20stroke-opacity%3D'.75'%20d%3D'M0%203L2%201%204%203'%2F%3E%3C%2Fsvg%3E%0A"); | |||
| background-position: 0 calc(100% + 1px); | |||
| background-repeat: repeat-x; | |||
| background-size: auto 6px; | |||
| cursor: default; | |||
| height: 2rem; | |||
| } | |||
| .mce-spellchecker-grammar { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'4'%20height%3D'4'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20stroke%3D'%2300A835'%20fill%3D'none'%20stroke-linecap%3D'round'%20d%3D'M0%203L2%201%204%203'%2F%3E%3C%2Fsvg%3E%0A"); | |||
| background-position: 0 calc(100% + 1px); | |||
| background-repeat: repeat-x; | |||
| background-size: auto 6px; | |||
| cursor: default; | |||
| } | |||
| .mce-toc { | |||
| border: 1px solid gray; | |||
| } | |||
| .mce-toc h2 { | |||
| margin: 4px; | |||
| } | |||
| .mce-toc li { | |||
| list-style-type: none; | |||
| } | |||
| .mce-item-table, | |||
| .mce-item-table td, | |||
| .mce-item-table th, | |||
| .mce-item-table caption { | |||
| border: 1px dashed #bbb; | |||
| } | |||
| .mce-visualblocks p, | |||
| .mce-visualblocks h1, | |||
| .mce-visualblocks h2, | |||
| .mce-visualblocks h3, | |||
| .mce-visualblocks h4, | |||
| .mce-visualblocks h5, | |||
| .mce-visualblocks h6, | |||
| .mce-visualblocks div:not([data-mce-bogus]), | |||
| .mce-visualblocks section, | |||
| .mce-visualblocks article, | |||
| .mce-visualblocks blockquote, | |||
| .mce-visualblocks address, | |||
| .mce-visualblocks pre, | |||
| .mce-visualblocks figure, | |||
| .mce-visualblocks figcaption, | |||
| .mce-visualblocks hgroup, | |||
| .mce-visualblocks aside, | |||
| .mce-visualblocks ul, | |||
| .mce-visualblocks ol, | |||
| .mce-visualblocks dl { | |||
| background-repeat: no-repeat; | |||
| border: 1px dashed #bbb; | |||
| margin-left: 3px; | |||
| padding-top: 10px; | |||
| } | |||
| .mce-visualblocks p { | |||
| background-image: url(data:image/gif;base64,R0lGODlhCQAJAJEAAAAAAP///7u7u////yH5BAEAAAMALAAAAAAJAAkAAAIQnG+CqCN/mlyvsRUpThG6AgA7); | |||
| } | |||
| .mce-visualblocks h1 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybGu1JuxHoAfRNRW3TWXyF2YiRUAOw==); | |||
| } | |||
| .mce-visualblocks h2 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8Hybbx4oOuqgTynJd6bGlWg3DkJzoaUAAAOw==); | |||
| } | |||
| .mce-visualblocks h3 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIZjI8Hybbx4oOuqgTynJf2Ln2NOHpQpmhAAQA7); | |||
| } | |||
| .mce-visualblocks h4 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxInR0zqeAdhtJlXwV1oCll2HaWgAAOw==); | |||
| } | |||
| .mce-visualblocks h5 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxIoiuwjane4iq5GlW05GgIkIZUAAAOw==); | |||
| } | |||
| .mce-visualblocks h6 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxIoiuwjan04jep1iZ1XRlAo5bVgAAOw==); | |||
| } | |||
| .mce-visualblocks div:not([data-mce-bogus]) { | |||
| background-image: url(data:image/gif;base64,R0lGODlhEgAKAIABALu7u////yH5BAEAAAEALAAAAAASAAoAAAIfjI9poI0cgDywrhuxfbrzDEbQM2Ei5aRjmoySW4pAAQA7); | |||
| } | |||
| .mce-visualblocks section { | |||
| background-image: url(data:image/gif;base64,R0lGODlhKAAKAIABALu7u////yH5BAEAAAEALAAAAAAoAAoAAAI5jI+pywcNY3sBWHdNrplytD2ellDeSVbp+GmWqaDqDMepc8t17Y4vBsK5hDyJMcI6KkuYU+jpjLoKADs=); | |||
| } | |||
| .mce-visualblocks article { | |||
| background-image: url(data:image/gif;base64,R0lGODlhKgAKAIABALu7u////yH5BAEAAAEALAAAAAAqAAoAAAI6jI+pywkNY3wG0GBvrsd2tXGYSGnfiF7ikpXemTpOiJScasYoDJJrjsG9gkCJ0ag6KhmaIe3pjDYBBQA7); | |||
| } | |||
| .mce-visualblocks blockquote { | |||
| background-image: url(data:image/gif;base64,R0lGODlhPgAKAIABALu7u////yH5BAEAAAEALAAAAAA+AAoAAAJPjI+py+0Knpz0xQDyuUhvfoGgIX5iSKZYgq5uNL5q69asZ8s5rrf0yZmpNkJZzFesBTu8TOlDVAabUyatguVhWduud3EyiUk45xhTTgMBBQA7); | |||
| } | |||
| .mce-visualblocks address { | |||
| background-image: url(data:image/gif;base64,R0lGODlhLQAKAIABALu7u////yH5BAEAAAEALAAAAAAtAAoAAAI/jI+pywwNozSP1gDyyZcjb3UaRpXkWaXmZW4OqKLhBmLs+K263DkJK7OJeifh7FicKD9A1/IpGdKkyFpNmCkAADs=); | |||
| } | |||
| .mce-visualblocks pre { | |||
| background-image: url(data:image/gif;base64,R0lGODlhFQAKAIABALu7uwAAACH5BAEAAAEALAAAAAAVAAoAAAIjjI+ZoN0cgDwSmnpz1NCueYERhnibZVKLNnbOq8IvKpJtVQAAOw==); | |||
| } | |||
| .mce-visualblocks figure { | |||
| background-image: url(data:image/gif;base64,R0lGODlhJAAKAIAAALu7u////yH5BAEAAAEALAAAAAAkAAoAAAI0jI+py+2fwAHUSFvD3RlvG4HIp4nX5JFSpnZUJ6LlrM52OE7uSWosBHScgkSZj7dDKnWAAgA7); | |||
| } | |||
| .mce-visualblocks figcaption { | |||
| border: 1px dashed #bbb; | |||
| } | |||
| .mce-visualblocks hgroup { | |||
| background-image: url(data:image/gif;base64,R0lGODlhJwAKAIABALu7uwAAACH5BAEAAAEALAAAAAAnAAoAAAI3jI+pywYNI3uB0gpsRtt5fFnfNZaVSYJil4Wo03Hv6Z62uOCgiXH1kZIIJ8NiIxRrAZNMZAtQAAA7); | |||
| } | |||
| .mce-visualblocks aside { | |||
| background-image: url(data:image/gif;base64,R0lGODlhHgAKAIABAKqqqv///yH5BAEAAAEALAAAAAAeAAoAAAItjI+pG8APjZOTzgtqy7I3f1yehmQcFY4WKZbqByutmW4aHUd6vfcVbgudgpYCADs=); | |||
| } | |||
| .mce-visualblocks ul { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIAAALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybGuYnqUVSjvw26DzzXiqIDlVwAAOw==); | |||
| } | |||
| .mce-visualblocks ol { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybH6HHt0qourxC6CvzXieHyeWQAAOw==); | |||
| } | |||
| .mce-visualblocks dl { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybEOnmOvUoWznTqeuEjNSCqeGRUAOw==); | |||
| } | |||
| .mce-visualblocks:not([dir=rtl]) p, | |||
| .mce-visualblocks:not([dir=rtl]) h1, | |||
| .mce-visualblocks:not([dir=rtl]) h2, | |||
| .mce-visualblocks:not([dir=rtl]) h3, | |||
| .mce-visualblocks:not([dir=rtl]) h4, | |||
| .mce-visualblocks:not([dir=rtl]) h5, | |||
| .mce-visualblocks:not([dir=rtl]) h6, | |||
| .mce-visualblocks:not([dir=rtl]) div:not([data-mce-bogus]), | |||
| .mce-visualblocks:not([dir=rtl]) section, | |||
| .mce-visualblocks:not([dir=rtl]) article, | |||
| .mce-visualblocks:not([dir=rtl]) blockquote, | |||
| .mce-visualblocks:not([dir=rtl]) address, | |||
| .mce-visualblocks:not([dir=rtl]) pre, | |||
| .mce-visualblocks:not([dir=rtl]) figure, | |||
| .mce-visualblocks:not([dir=rtl]) figcaption, | |||
| .mce-visualblocks:not([dir=rtl]) hgroup, | |||
| .mce-visualblocks:not([dir=rtl]) aside, | |||
| .mce-visualblocks:not([dir=rtl]) ul, | |||
| .mce-visualblocks:not([dir=rtl]) ol, | |||
| .mce-visualblocks:not([dir=rtl]) dl { | |||
| margin-left: 3px; | |||
| } | |||
| .mce-visualblocks[dir=rtl] p, | |||
| .mce-visualblocks[dir=rtl] h1, | |||
| .mce-visualblocks[dir=rtl] h2, | |||
| .mce-visualblocks[dir=rtl] h3, | |||
| .mce-visualblocks[dir=rtl] h4, | |||
| .mce-visualblocks[dir=rtl] h5, | |||
| .mce-visualblocks[dir=rtl] h6, | |||
| .mce-visualblocks[dir=rtl] div:not([data-mce-bogus]), | |||
| .mce-visualblocks[dir=rtl] section, | |||
| .mce-visualblocks[dir=rtl] article, | |||
| .mce-visualblocks[dir=rtl] blockquote, | |||
| .mce-visualblocks[dir=rtl] address, | |||
| .mce-visualblocks[dir=rtl] pre, | |||
| .mce-visualblocks[dir=rtl] figure, | |||
| .mce-visualblocks[dir=rtl] figcaption, | |||
| .mce-visualblocks[dir=rtl] hgroup, | |||
| .mce-visualblocks[dir=rtl] aside, | |||
| .mce-visualblocks[dir=rtl] ul, | |||
| .mce-visualblocks[dir=rtl] ol, | |||
| .mce-visualblocks[dir=rtl] dl { | |||
| background-position-x: right; | |||
| margin-right: 3px; | |||
| } | |||
| .mce-nbsp, | |||
| .mce-shy { | |||
| background: #aaa; | |||
| } | |||
| .mce-shy::after { | |||
| content: '-'; | |||
| } | |||
| body { | |||
| font-family: sans-serif; | |||
| } | |||
| table { | |||
| border-collapse: collapse; | |||
| } | |||
+ 689
- 0
public/tinymce/skins/ui/oxide-dark/content.inline.css
View File
| @@ -0,0 +1,689 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| .mce-content-body .mce-item-anchor { | |||
| background: transparent url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'8'%20height%3D'12'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M0%200L8%200%208%2012%204.09117821%209%200%2012z'%2F%3E%3C%2Fsvg%3E%0A") no-repeat center; | |||
| cursor: default; | |||
| display: inline-block; | |||
| height: 12px !important; | |||
| padding: 0 2px; | |||
| -webkit-user-modify: read-only; | |||
| -moz-user-modify: read-only; | |||
| -webkit-user-select: all; | |||
| -moz-user-select: all; | |||
| -ms-user-select: all; | |||
| user-select: all; | |||
| width: 8px !important; | |||
| } | |||
| .mce-content-body .mce-item-anchor[data-mce-selected] { | |||
| outline-offset: 1px; | |||
| } | |||
| .tox-comments-visible .tox-comment { | |||
| background-color: #fff0b7; | |||
| } | |||
| .tox-comments-visible .tox-comment--active { | |||
| background-color: #ffe168; | |||
| } | |||
| .tox-checklist > li:not(.tox-checklist--hidden) { | |||
| list-style: none; | |||
| margin: 0.25em 0; | |||
| } | |||
| .tox-checklist > li:not(.tox-checklist--hidden)::before { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-unchecked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2215%22%20height%3D%2215%22%20x%3D%22.5%22%20y%3D%22.5%22%20fill-rule%3D%22nonzero%22%20stroke%3D%22%234C4C4C%22%20rx%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A"); | |||
| background-size: 100%; | |||
| content: ''; | |||
| cursor: pointer; | |||
| height: 1em; | |||
| margin-left: -1.5em; | |||
| margin-top: 0.125em; | |||
| position: absolute; | |||
| width: 1em; | |||
| } | |||
| .tox-checklist li:not(.tox-checklist--hidden).tox-checklist--checked::before { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-checked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%234099FF%22%20fill-rule%3D%22nonzero%22%20rx%3D%222%22%2F%3E%3Cpath%20id%3D%22Path%22%20fill%3D%22%23FFF%22%20fill-rule%3D%22nonzero%22%20d%3D%22M11.5703186%2C3.14417309%20C11.8516238%2C2.73724603%2012.4164781%2C2.62829933%2012.83558%2C2.89774797%20C13.260121%2C3.17069355%2013.3759736%2C3.72932262%2013.0909105%2C4.14168582%20L7.7580587%2C11.8560195%20C7.43776896%2C12.3193404%206.76483983%2C12.3852142%206.35607322%2C11.9948725%20L3.02491697%2C8.8138662%20C2.66090143%2C8.46625845%202.65798871%2C7.89594698%203.01850234%2C7.54483354%20C3.373942%2C7.19866177%203.94940006%2C7.19592841%204.30829608%2C7.5386474%20L6.85276923%2C9.9684299%20L11.5703186%2C3.14417309%20Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A"); | |||
| } | |||
| [dir=rtl] .tox-checklist > li:not(.tox-checklist--hidden)::before { | |||
| margin-left: 0; | |||
| margin-right: -1.5em; | |||
| } | |||
| /* stylelint-disable */ | |||
| /* http://prismjs.com/ */ | |||
| /** | |||
| * 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; | |||
| font-size: 1em; | |||
| text-align: left; | |||
| white-space: pre; | |||
| word-spacing: normal; | |||
| word-break: normal; | |||
| word-wrap: normal; | |||
| line-height: 1.5; | |||
| -moz-tab-size: 4; | |||
| tab-size: 4; | |||
| -webkit-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: 0.5em 0; | |||
| overflow: auto; | |||
| } | |||
| :not(pre) > code[class*="language-"], | |||
| pre[class*="language-"] { | |||
| background: #f5f2f0; | |||
| } | |||
| /* Inline code */ | |||
| :not(pre) > code[class*="language-"] { | |||
| padding: 0.1em; | |||
| border-radius: 0.3em; | |||
| white-space: normal; | |||
| } | |||
| .token.comment, | |||
| .token.prolog, | |||
| .token.doctype, | |||
| .token.cdata { | |||
| color: slategray; | |||
| } | |||
| .token.punctuation { | |||
| color: #999; | |||
| } | |||
| .namespace { | |||
| opacity: 0.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%, 0.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; | |||
| } | |||
| /* stylelint-enable */ | |||
| .mce-content-body { | |||
| overflow-wrap: break-word; | |||
| word-wrap: break-word; | |||
| } | |||
| .mce-content-body .mce-visual-caret { | |||
| background-color: black; | |||
| background-color: currentColor; | |||
| position: absolute; | |||
| } | |||
| .mce-content-body .mce-visual-caret-hidden { | |||
| display: none; | |||
| } | |||
| .mce-content-body *[data-mce-caret] { | |||
| left: -1000px; | |||
| margin: 0; | |||
| padding: 0; | |||
| position: absolute; | |||
| right: auto; | |||
| top: 0; | |||
| } | |||
| .mce-content-body .mce-offscreen-selection { | |||
| left: -2000000px; | |||
| max-width: 1000000px; | |||
| position: absolute; | |||
| } | |||
| .mce-content-body *[contentEditable=false] { | |||
| cursor: default; | |||
| } | |||
| .mce-content-body *[contentEditable=true] { | |||
| cursor: text; | |||
| } | |||
| .tox-cursor-format-painter { | |||
| cursor: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M15%2C6%20C15%2C5.45%2014.55%2C5%2014%2C5%20L6%2C5%20C5.45%2C5%205%2C5.45%205%2C6%20L5%2C10%20C5%2C10.55%205.45%2C11%206%2C11%20L14%2C11%20C14.55%2C11%2015%2C10.55%2015%2C10%20L15%2C9%20L16%2C9%20L16%2C12%20L9%2C12%20L9%2C19%20C9%2C19.55%209.45%2C20%2010%2C20%20L11%2C20%20C11.55%2C20%2012%2C19.55%2012%2C19%20L12%2C14%20L18%2C14%20L18%2C7%20L15%2C7%20L15%2C6%20Z%22%2F%3E%0A%20%20%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M1%2C1%20L8.25%2C1%20C8.66421356%2C1%209%2C1.33578644%209%2C1.75%20L9%2C1.75%20C9%2C2.16421356%208.66421356%2C2.5%208.25%2C2.5%20L2.5%2C2.5%20L2.5%2C8.25%20C2.5%2C8.66421356%202.16421356%2C9%201.75%2C9%20L1.75%2C9%20C1.33578644%2C9%201%2C8.66421356%201%2C8.25%20L1%2C1%20Z%22%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A"), default; | |||
| } | |||
| .mce-content-body figure.align-left { | |||
| float: left; | |||
| } | |||
| .mce-content-body figure.align-right { | |||
| float: right; | |||
| } | |||
| .mce-content-body figure.image.align-center { | |||
| display: table; | |||
| margin-left: auto; | |||
| margin-right: auto; | |||
| } | |||
| .mce-preview-object { | |||
| border: 1px solid gray; | |||
| display: inline-block; | |||
| line-height: 0; | |||
| margin: 0 2px 0 2px; | |||
| position: relative; | |||
| } | |||
| .mce-preview-object .mce-shim { | |||
| background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .mce-preview-object[data-mce-selected="2"] .mce-shim { | |||
| display: none; | |||
| } | |||
| .mce-object { | |||
| background: transparent url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M4%203h16a1%201%200%200%201%201%201v16a1%201%200%200%201-1%201H4a1%201%200%200%201-1-1V4a1%201%200%200%201%201-1zm1%202v14h14V5H5zm4.79%202.565l5.64%204.028a.5.5%200%200%201%200%20.814l-5.64%204.028a.5.5%200%200%201-.79-.407V7.972a.5.5%200%200%201%20.79-.407z%22%2F%3E%3C%2Fsvg%3E%0A") no-repeat center; | |||
| border: 1px dashed #aaa; | |||
| } | |||
| .mce-pagebreak { | |||
| border: 1px dashed #aaa; | |||
| cursor: default; | |||
| display: block; | |||
| height: 5px; | |||
| margin-top: 15px; | |||
| page-break-before: always; | |||
| width: 100%; | |||
| } | |||
| @media print { | |||
| .mce-pagebreak { | |||
| border: 0; | |||
| } | |||
| } | |||
| .tiny-pageembed .mce-shim { | |||
| background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .tiny-pageembed[data-mce-selected="2"] .mce-shim { | |||
| display: none; | |||
| } | |||
| .tiny-pageembed { | |||
| display: inline-block; | |||
| position: relative; | |||
| } | |||
| .tiny-pageembed--21by9, | |||
| .tiny-pageembed--16by9, | |||
| .tiny-pageembed--4by3, | |||
| .tiny-pageembed--1by1 { | |||
| display: block; | |||
| overflow: hidden; | |||
| padding: 0; | |||
| position: relative; | |||
| width: 100%; | |||
| } | |||
| .tiny-pageembed--21by9 { | |||
| padding-top: 42.857143%; | |||
| } | |||
| .tiny-pageembed--16by9 { | |||
| padding-top: 56.25%; | |||
| } | |||
| .tiny-pageembed--4by3 { | |||
| padding-top: 75%; | |||
| } | |||
| .tiny-pageembed--1by1 { | |||
| padding-top: 100%; | |||
| } | |||
| .tiny-pageembed--21by9 iframe, | |||
| .tiny-pageembed--16by9 iframe, | |||
| .tiny-pageembed--4by3 iframe, | |||
| .tiny-pageembed--1by1 iframe { | |||
| border: 0; | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .mce-content-body[data-mce-placeholder] { | |||
| position: relative; | |||
| } | |||
| .mce-content-body[data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| color: rgba(34, 47, 62, 0.7); | |||
| content: attr(data-mce-placeholder); | |||
| position: absolute; | |||
| } | |||
| .mce-content-body:not([dir=rtl])[data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| left: 1px; | |||
| } | |||
| .mce-content-body[dir=rtl][data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| right: 1px; | |||
| } | |||
| .mce-content-body div.mce-resizehandle { | |||
| background-color: #4099ff; | |||
| border-color: #4099ff; | |||
| border-style: solid; | |||
| border-width: 1px; | |||
| box-sizing: border-box; | |||
| height: 10px; | |||
| position: absolute; | |||
| width: 10px; | |||
| z-index: 10000; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:hover { | |||
| background-color: #4099ff; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(1) { | |||
| cursor: nwse-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(2) { | |||
| cursor: nesw-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(3) { | |||
| cursor: nwse-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(4) { | |||
| cursor: nesw-resize; | |||
| } | |||
| .mce-content-body .mce-clonedresizable { | |||
| opacity: 0.5; | |||
| outline: 1px dashed black; | |||
| position: absolute; | |||
| z-index: 10000; | |||
| } | |||
| .mce-content-body .mce-resize-helper { | |||
| background: #555; | |||
| background: rgba(0, 0, 0, 0.75); | |||
| border: 1px; | |||
| border-radius: 3px; | |||
| color: white; | |||
| display: none; | |||
| font-family: sans-serif; | |||
| font-size: 12px; | |||
| line-height: 14px; | |||
| margin: 5px 10px; | |||
| padding: 5px; | |||
| position: absolute; | |||
| white-space: nowrap; | |||
| z-index: 10001; | |||
| } | |||
| .tox-rtc-user-selection { | |||
| position: relative; | |||
| } | |||
| .tox-rtc-user-cursor { | |||
| bottom: 0; | |||
| cursor: default; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 2px; | |||
| } | |||
| .tox-rtc-user-cursor::before { | |||
| background-color: inherit; | |||
| border-radius: 50%; | |||
| content: ''; | |||
| display: block; | |||
| height: 8px; | |||
| position: absolute; | |||
| right: -3px; | |||
| top: -3px; | |||
| width: 8px; | |||
| } | |||
| .tox-rtc-user-cursor:hover::after { | |||
| background-color: inherit; | |||
| border-radius: 100px; | |||
| box-sizing: border-box; | |||
| color: #fff; | |||
| content: attr(data-user); | |||
| display: block; | |||
| font-size: 12px; | |||
| font-weight: bold; | |||
| left: -5px; | |||
| min-height: 8px; | |||
| min-width: 8px; | |||
| padding: 0 12px; | |||
| position: absolute; | |||
| top: -11px; | |||
| white-space: nowrap; | |||
| z-index: 1000; | |||
| } | |||
| .tox-rtc-user-selection--1 .tox-rtc-user-cursor { | |||
| background-color: #2dc26b; | |||
| } | |||
| .tox-rtc-user-selection--2 .tox-rtc-user-cursor { | |||
| background-color: #e03e2d; | |||
| } | |||
| .tox-rtc-user-selection--3 .tox-rtc-user-cursor { | |||
| background-color: #f1c40f; | |||
| } | |||
| .tox-rtc-user-selection--4 .tox-rtc-user-cursor { | |||
| background-color: #3598db; | |||
| } | |||
| .tox-rtc-user-selection--5 .tox-rtc-user-cursor { | |||
| background-color: #b96ad9; | |||
| } | |||
| .tox-rtc-user-selection--6 .tox-rtc-user-cursor { | |||
| background-color: #e67e23; | |||
| } | |||
| .tox-rtc-user-selection--7 .tox-rtc-user-cursor { | |||
| background-color: #aaa69d; | |||
| } | |||
| .tox-rtc-user-selection--8 .tox-rtc-user-cursor { | |||
| background-color: #f368e0; | |||
| } | |||
| .tox-rtc-remote-image { | |||
| background: #eaeaea url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2236%22%20height%3D%2212%22%20viewBox%3D%220%200%2036%2012%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%3Ccircle%20cx%3D%226%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%20%20%3Ccircle%20cx%3D%2218%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20begin%3D%22.33s%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%20%20%3Ccircle%20cx%3D%2230%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20begin%3D%22.66s%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%3C%2Fsvg%3E%0A") no-repeat center center; | |||
| border: 1px solid #ccc; | |||
| min-height: 240px; | |||
| min-width: 320px; | |||
| } | |||
| .mce-match-marker { | |||
| background: #aaa; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected::-moz-selection { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected::selection { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-content-body img[data-mce-selected], | |||
| .mce-content-body table[data-mce-selected] { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body hr[data-mce-selected] { | |||
| outline: 3px solid #b4d7ff; | |||
| outline-offset: 1px; | |||
| } | |||
| .mce-content-body *[contentEditable=false] *[contentEditable=true]:focus { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body *[contentEditable=false] *[contentEditable=true]:hover { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body *[contentEditable=false][data-mce-selected] { | |||
| cursor: not-allowed; | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .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-color: #b4d7ff; | |||
| } | |||
| .mce-content-body .mce-edit-focus { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body td[data-mce-selected], | |||
| .mce-content-body th[data-mce-selected] { | |||
| background-color: #b4d7ff !important; | |||
| } | |||
| .mce-content-body td[data-mce-selected]::-moz-selection, | |||
| .mce-content-body th[data-mce-selected]::-moz-selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body td[data-mce-selected]::selection, | |||
| .mce-content-body th[data-mce-selected]::selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body td[data-mce-selected] *, | |||
| .mce-content-body th[data-mce-selected] * { | |||
| -webkit-touch-callout: none; | |||
| -webkit-user-select: none; | |||
| -moz-user-select: none; | |||
| -ms-user-select: none; | |||
| user-select: none; | |||
| } | |||
| .mce-content-body img::-moz-selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body img::selection { | |||
| background: none; | |||
| } | |||
| .ephox-snooker-resizer-bar { | |||
| background-color: #b4d7ff; | |||
| opacity: 0; | |||
| -webkit-user-select: none; | |||
| -moz-user-select: none; | |||
| -ms-user-select: none; | |||
| user-select: none; | |||
| } | |||
| .ephox-snooker-resizer-cols { | |||
| cursor: col-resize; | |||
| } | |||
| .ephox-snooker-resizer-rows { | |||
| cursor: row-resize; | |||
| } | |||
| .ephox-snooker-resizer-bar.ephox-snooker-resizer-bar-dragging { | |||
| opacity: 1; | |||
| } | |||
| .mce-spellchecker-word { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'4'%20height%3D'4'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20stroke%3D'%23ff0000'%20fill%3D'none'%20stroke-linecap%3D'round'%20stroke-opacity%3D'.75'%20d%3D'M0%203L2%201%204%203'%2F%3E%3C%2Fsvg%3E%0A"); | |||
| background-position: 0 calc(100% + 1px); | |||
| background-repeat: repeat-x; | |||
| background-size: auto 6px; | |||
| cursor: default; | |||
| height: 2rem; | |||
| } | |||
| .mce-spellchecker-grammar { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'4'%20height%3D'4'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20stroke%3D'%2300A835'%20fill%3D'none'%20stroke-linecap%3D'round'%20d%3D'M0%203L2%201%204%203'%2F%3E%3C%2Fsvg%3E%0A"); | |||
| background-position: 0 calc(100% + 1px); | |||
| background-repeat: repeat-x; | |||
| background-size: auto 6px; | |||
| cursor: default; | |||
| } | |||
| .mce-toc { | |||
| border: 1px solid gray; | |||
| } | |||
| .mce-toc h2 { | |||
| margin: 4px; | |||
| } | |||
| .mce-toc li { | |||
| list-style-type: none; | |||
| } | |||
| .mce-item-table, | |||
| .mce-item-table td, | |||
| .mce-item-table th, | |||
| .mce-item-table caption { | |||
| border: 1px dashed #bbb; | |||
| } | |||
| .mce-visualblocks p, | |||
| .mce-visualblocks h1, | |||
| .mce-visualblocks h2, | |||
| .mce-visualblocks h3, | |||
| .mce-visualblocks h4, | |||
| .mce-visualblocks h5, | |||
| .mce-visualblocks h6, | |||
| .mce-visualblocks div:not([data-mce-bogus]), | |||
| .mce-visualblocks section, | |||
| .mce-visualblocks article, | |||
| .mce-visualblocks blockquote, | |||
| .mce-visualblocks address, | |||
| .mce-visualblocks pre, | |||
| .mce-visualblocks figure, | |||
| .mce-visualblocks figcaption, | |||
| .mce-visualblocks hgroup, | |||
| .mce-visualblocks aside, | |||
| .mce-visualblocks ul, | |||
| .mce-visualblocks ol, | |||
| .mce-visualblocks dl { | |||
| background-repeat: no-repeat; | |||
| border: 1px dashed #bbb; | |||
| margin-left: 3px; | |||
| padding-top: 10px; | |||
| } | |||
| .mce-visualblocks p { | |||
| background-image: url(data:image/gif;base64,R0lGODlhCQAJAJEAAAAAAP///7u7u////yH5BAEAAAMALAAAAAAJAAkAAAIQnG+CqCN/mlyvsRUpThG6AgA7); | |||
| } | |||
| .mce-visualblocks h1 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybGu1JuxHoAfRNRW3TWXyF2YiRUAOw==); | |||
| } | |||
| .mce-visualblocks h2 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8Hybbx4oOuqgTynJd6bGlWg3DkJzoaUAAAOw==); | |||
| } | |||
| .mce-visualblocks h3 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIZjI8Hybbx4oOuqgTynJf2Ln2NOHpQpmhAAQA7); | |||
| } | |||
| .mce-visualblocks h4 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxInR0zqeAdhtJlXwV1oCll2HaWgAAOw==); | |||
| } | |||
| .mce-visualblocks h5 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxIoiuwjane4iq5GlW05GgIkIZUAAAOw==); | |||
| } | |||
| .mce-visualblocks h6 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxIoiuwjan04jep1iZ1XRlAo5bVgAAOw==); | |||
| } | |||
| .mce-visualblocks div:not([data-mce-bogus]) { | |||
| background-image: url(data:image/gif;base64,R0lGODlhEgAKAIABALu7u////yH5BAEAAAEALAAAAAASAAoAAAIfjI9poI0cgDywrhuxfbrzDEbQM2Ei5aRjmoySW4pAAQA7); | |||
| } | |||
| .mce-visualblocks section { | |||
| background-image: url(data:image/gif;base64,R0lGODlhKAAKAIABALu7u////yH5BAEAAAEALAAAAAAoAAoAAAI5jI+pywcNY3sBWHdNrplytD2ellDeSVbp+GmWqaDqDMepc8t17Y4vBsK5hDyJMcI6KkuYU+jpjLoKADs=); | |||
| } | |||
| .mce-visualblocks article { | |||
| background-image: url(data:image/gif;base64,R0lGODlhKgAKAIABALu7u////yH5BAEAAAEALAAAAAAqAAoAAAI6jI+pywkNY3wG0GBvrsd2tXGYSGnfiF7ikpXemTpOiJScasYoDJJrjsG9gkCJ0ag6KhmaIe3pjDYBBQA7); | |||
| } | |||
| .mce-visualblocks blockquote { | |||
| background-image: url(data:image/gif;base64,R0lGODlhPgAKAIABALu7u////yH5BAEAAAEALAAAAAA+AAoAAAJPjI+py+0Knpz0xQDyuUhvfoGgIX5iSKZYgq5uNL5q69asZ8s5rrf0yZmpNkJZzFesBTu8TOlDVAabUyatguVhWduud3EyiUk45xhTTgMBBQA7); | |||
| } | |||
| .mce-visualblocks address { | |||
| background-image: url(data:image/gif;base64,R0lGODlhLQAKAIABALu7u////yH5BAEAAAEALAAAAAAtAAoAAAI/jI+pywwNozSP1gDyyZcjb3UaRpXkWaXmZW4OqKLhBmLs+K263DkJK7OJeifh7FicKD9A1/IpGdKkyFpNmCkAADs=); | |||
| } | |||
| .mce-visualblocks pre { | |||
| background-image: url(data:image/gif;base64,R0lGODlhFQAKAIABALu7uwAAACH5BAEAAAEALAAAAAAVAAoAAAIjjI+ZoN0cgDwSmnpz1NCueYERhnibZVKLNnbOq8IvKpJtVQAAOw==); | |||
| } | |||
| .mce-visualblocks figure { | |||
| background-image: url(data:image/gif;base64,R0lGODlhJAAKAIAAALu7u////yH5BAEAAAEALAAAAAAkAAoAAAI0jI+py+2fwAHUSFvD3RlvG4HIp4nX5JFSpnZUJ6LlrM52OE7uSWosBHScgkSZj7dDKnWAAgA7); | |||
| } | |||
| .mce-visualblocks figcaption { | |||
| border: 1px dashed #bbb; | |||
| } | |||
| .mce-visualblocks hgroup { | |||
| background-image: url(data:image/gif;base64,R0lGODlhJwAKAIABALu7uwAAACH5BAEAAAEALAAAAAAnAAoAAAI3jI+pywYNI3uB0gpsRtt5fFnfNZaVSYJil4Wo03Hv6Z62uOCgiXH1kZIIJ8NiIxRrAZNMZAtQAAA7); | |||
| } | |||
| .mce-visualblocks aside { | |||
| background-image: url(data:image/gif;base64,R0lGODlhHgAKAIABAKqqqv///yH5BAEAAAEALAAAAAAeAAoAAAItjI+pG8APjZOTzgtqy7I3f1yehmQcFY4WKZbqByutmW4aHUd6vfcVbgudgpYCADs=); | |||
| } | |||
| .mce-visualblocks ul { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIAAALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybGuYnqUVSjvw26DzzXiqIDlVwAAOw==); | |||
| } | |||
| .mce-visualblocks ol { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybH6HHt0qourxC6CvzXieHyeWQAAOw==); | |||
| } | |||
| .mce-visualblocks dl { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybEOnmOvUoWznTqeuEjNSCqeGRUAOw==); | |||
| } | |||
| .mce-visualblocks:not([dir=rtl]) p, | |||
| .mce-visualblocks:not([dir=rtl]) h1, | |||
| .mce-visualblocks:not([dir=rtl]) h2, | |||
| .mce-visualblocks:not([dir=rtl]) h3, | |||
| .mce-visualblocks:not([dir=rtl]) h4, | |||
| .mce-visualblocks:not([dir=rtl]) h5, | |||
| .mce-visualblocks:not([dir=rtl]) h6, | |||
| .mce-visualblocks:not([dir=rtl]) div:not([data-mce-bogus]), | |||
| .mce-visualblocks:not([dir=rtl]) section, | |||
| .mce-visualblocks:not([dir=rtl]) article, | |||
| .mce-visualblocks:not([dir=rtl]) blockquote, | |||
| .mce-visualblocks:not([dir=rtl]) address, | |||
| .mce-visualblocks:not([dir=rtl]) pre, | |||
| .mce-visualblocks:not([dir=rtl]) figure, | |||
| .mce-visualblocks:not([dir=rtl]) figcaption, | |||
| .mce-visualblocks:not([dir=rtl]) hgroup, | |||
| .mce-visualblocks:not([dir=rtl]) aside, | |||
| .mce-visualblocks:not([dir=rtl]) ul, | |||
| .mce-visualblocks:not([dir=rtl]) ol, | |||
| .mce-visualblocks:not([dir=rtl]) dl { | |||
| margin-left: 3px; | |||
| } | |||
| .mce-visualblocks[dir=rtl] p, | |||
| .mce-visualblocks[dir=rtl] h1, | |||
| .mce-visualblocks[dir=rtl] h2, | |||
| .mce-visualblocks[dir=rtl] h3, | |||
| .mce-visualblocks[dir=rtl] h4, | |||
| .mce-visualblocks[dir=rtl] h5, | |||
| .mce-visualblocks[dir=rtl] h6, | |||
| .mce-visualblocks[dir=rtl] div:not([data-mce-bogus]), | |||
| .mce-visualblocks[dir=rtl] section, | |||
| .mce-visualblocks[dir=rtl] article, | |||
| .mce-visualblocks[dir=rtl] blockquote, | |||
| .mce-visualblocks[dir=rtl] address, | |||
| .mce-visualblocks[dir=rtl] pre, | |||
| .mce-visualblocks[dir=rtl] figure, | |||
| .mce-visualblocks[dir=rtl] figcaption, | |||
| .mce-visualblocks[dir=rtl] hgroup, | |||
| .mce-visualblocks[dir=rtl] aside, | |||
| .mce-visualblocks[dir=rtl] ul, | |||
| .mce-visualblocks[dir=rtl] ol, | |||
| .mce-visualblocks[dir=rtl] dl { | |||
| background-position-x: right; | |||
| margin-right: 3px; | |||
| } | |||
| .mce-nbsp, | |||
| .mce-shy { | |||
| background: #aaa; | |||
| } | |||
| .mce-shy::after { | |||
| content: '-'; | |||
| } | |||
+ 7
- 0
public/tinymce/skins/ui/oxide-dark/content.inline.min.css
File diff suppressed because it is too large
View File
+ 7
- 0
public/tinymce/skins/ui/oxide-dark/content.min.css
File diff suppressed because it is too large
View File
+ 29
- 0
public/tinymce/skins/ui/oxide-dark/content.mobile.css
View File
| @@ -0,0 +1,29 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| .tinymce-mobile-unfocused-selections .tinymce-mobile-unfocused-selection { | |||
| /* Note: this file is used inside the content, so isn't part of theming */ | |||
| background-color: green; | |||
| display: inline-block; | |||
| opacity: 0.5; | |||
| position: absolute; | |||
| } | |||
| body { | |||
| -webkit-text-size-adjust: none; | |||
| } | |||
| body img { | |||
| /* this is related to the content margin */ | |||
| max-width: 96vw; | |||
| } | |||
| body table img { | |||
| max-width: 95%; | |||
| } | |||
| body { | |||
| font-family: sans-serif; | |||
| } | |||
| table { | |||
| border-collapse: collapse; | |||
| } | |||
+ 7
- 0
public/tinymce/skins/ui/oxide-dark/content.mobile.min.css
View File
| @@ -0,0 +1,7 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| .tinymce-mobile-unfocused-selections .tinymce-mobile-unfocused-selection{background-color:green;display:inline-block;opacity:.5;position:absolute}body{-webkit-text-size-adjust:none}body img{max-width:96vw}body table img{max-width:95%}body{font-family:sans-serif}table{border-collapse:collapse} | |||
BIN
public/tinymce/skins/ui/oxide-dark/fonts/tinymce-mobile.woff
View File
+ 2937
- 0
public/tinymce/skins/ui/oxide-dark/skin.css
File diff suppressed because it is too large
View File
+ 7
- 0
public/tinymce/skins/ui/oxide-dark/skin.min.css
File diff suppressed because it is too large
View File
+ 673
- 0
public/tinymce/skins/ui/oxide-dark/skin.mobile.css
View File
| @@ -0,0 +1,673 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| /* RESET all the things! */ | |||
| .tinymce-mobile-outer-container { | |||
| all: initial; | |||
| display: block; | |||
| } | |||
| .tinymce-mobile-outer-container * { | |||
| border: 0; | |||
| box-sizing: initial; | |||
| cursor: inherit; | |||
| float: none; | |||
| line-height: 1; | |||
| margin: 0; | |||
| outline: 0; | |||
| padding: 0; | |||
| -webkit-tap-highlight-color: transparent; | |||
| /* TBIO-3691, stop the gray flicker on touch. */ | |||
| text-shadow: none; | |||
| white-space: nowrap; | |||
| } | |||
| .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 { | |||
| /* TODO: Translate */ | |||
| content: "Headings"; | |||
| font-family: sans-serif; | |||
| font-size: 80%; | |||
| font-weight: bold; | |||
| } | |||
| .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 { | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| background: rgba(51, 51, 51, 0.5); | |||
| height: 100%; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container { | |||
| align-items: center; | |||
| border-radius: 50%; | |||
| display: flex; | |||
| flex-direction: column; | |||
| font-family: sans-serif; | |||
| font-size: 1em; | |||
| justify-content: space-between; | |||
| } | |||
| .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .mixin-menu-item { | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| border-radius: 50%; | |||
| height: 2.1em; | |||
| width: 2.1em; | |||
| } | |||
| .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section { | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| flex-direction: column; | |||
| font-size: 1em; | |||
| } | |||
| @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 { | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| border-radius: 50%; | |||
| height: 2.1em; | |||
| width: 2.1em; | |||
| background-color: white; | |||
| color: #207ab7; | |||
| } | |||
| .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section .tinymce-mobile-mask-tap-icon::before { | |||
| content: "\e900"; | |||
| font-family: 'tinymce-mobile', sans-serif; | |||
| } | |||
| .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 { | |||
| background: #ffffff; | |||
| border: none; | |||
| bottom: 0; | |||
| display: flex; | |||
| flex-direction: column; | |||
| left: 0; | |||
| position: fixed; | |||
| right: 0; | |||
| top: 0; | |||
| } | |||
| .tinymce-mobile-android-container:not(.tinymce-mobile-android-maximized) { | |||
| position: relative; | |||
| } | |||
| .tinymce-mobile-android-container .tinymce-mobile-editor-socket { | |||
| display: flex; | |||
| flex-grow: 1; | |||
| } | |||
| .tinymce-mobile-android-container .tinymce-mobile-editor-socket iframe { | |||
| display: flex !important; | |||
| flex-grow: 1; | |||
| height: auto !important; | |||
| } | |||
| .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: #fff; | |||
| display: flex; | |||
| flex: 0 0 auto; | |||
| z-index: 1; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar { | |||
| align-items: center; | |||
| background-color: #fff; | |||
| border-bottom: 1px solid #cccccc; | |||
| display: flex; | |||
| flex: 1; | |||
| height: 2.5em; | |||
| width: 100%; | |||
| /* Make it no larger than the toolstrip, so that it needs to scroll */ | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 100%; | |||
| flex-shrink: 1; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group > div { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 100%; | |||
| 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 { | |||
| 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: 0.5em; | |||
| padding-right: 0.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 { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 80%; | |||
| margin-left: 2px; | |||
| margin-right: 2px; | |||
| } | |||
| .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: #c8cbcf; | |||
| color: #cccccc; | |||
| } | |||
| .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: #207ab7; | |||
| color: #eceff1; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar { | |||
| /* Note, this file is imported inside .tinymce-mobile-context-toolbar, so that prefix is on everything here. */ | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 100%; | |||
| flex: 1; | |||
| padding-bottom: 0.4em; | |||
| padding-top: 0.4em; | |||
| /* Make any buttons appearing on the left and right display in the centre (e.g. color edges) */ | |||
| /* For widgets like the colour picker, use the whole height */ | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog { | |||
| display: flex; | |||
| min-height: 1.5em; | |||
| overflow: hidden; | |||
| padding-left: 0; | |||
| padding-right: 0; | |||
| position: relative; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain { | |||
| display: flex; | |||
| height: 100%; | |||
| transition: left cubic-bezier(0.4, 0, 1, 1) 0.15s; | |||
| width: 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 { | |||
| display: flex; | |||
| flex: 0 0 auto; | |||
| justify-content: space-between; | |||
| width: 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 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: flex; | |||
| 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 { | |||
| -ms-grid-row-align: center; | |||
| align-self: center; | |||
| background: inherit; | |||
| border: none; | |||
| border-radius: 50%; | |||
| color: #888; | |||
| font-size: 0.6em; | |||
| font-weight: bold; | |||
| height: 100%; | |||
| padding-right: 2px; | |||
| position: absolute; | |||
| 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 .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 { | |||
| align-items: center; | |||
| display: flex; | |||
| } | |||
| .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 { | |||
| align-items: center; | |||
| display: flex; | |||
| font-weight: bold; | |||
| height: 100%; | |||
| padding-left: 0.5em; | |||
| padding-right: 0.5em; | |||
| } | |||
| .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 { | |||
| color: #cccccc; | |||
| font-size: 10px; | |||
| line-height: 10px; | |||
| margin: 0 2px; | |||
| padding-top: 3px; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-dot-item.tinymce-mobile-dot-active { | |||
| color: #c8cbcf; | |||
| } | |||
| .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-left: 0.5em; | |||
| margin-right: 0.9em; | |||
| } | |||
| .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: 0.9em; | |||
| margin-right: 0.5em; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider { | |||
| display: flex; | |||
| flex: 1; | |||
| margin-left: 0; | |||
| margin-right: 0; | |||
| padding: 0.28em 0; | |||
| position: relative; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider .tinymce-mobile-slider-size-container { | |||
| align-items: center; | |||
| display: flex; | |||
| flex-grow: 1; | |||
| height: 100%; | |||
| } | |||
| .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 { | |||
| background: #cccccc; | |||
| display: flex; | |||
| flex: 1; | |||
| height: 0.2em; | |||
| margin-bottom: 0.3em; | |||
| margin-top: 0.3em; | |||
| } | |||
| .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 { | |||
| align-items: center; | |||
| display: flex; | |||
| flex-grow: 1; | |||
| height: 100%; | |||
| } | |||
| .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 { | |||
| background: linear-gradient(to right, hsl(0, 100%, 50%) 0%, hsl(60, 100%, 50%) 17%, hsl(120, 100%, 50%) 33%, hsl(180, 100%, 50%) 50%, hsl(240, 100%, 50%) 67%, hsl(300, 100%, 50%) 83%, hsl(0, 100%, 50%) 100%); | |||
| display: flex; | |||
| flex: 1; | |||
| height: 0.2em; | |||
| margin-bottom: 0.3em; | |||
| margin-top: 0.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-black { | |||
| /* Not part of theming */ | |||
| background: black; | |||
| height: 0.2em; | |||
| margin-bottom: 0.3em; | |||
| margin-top: 0.3em; | |||
| width: 1.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-white { | |||
| /* Not part of theming */ | |||
| background: white; | |||
| height: 0.2em; | |||
| margin-bottom: 0.3em; | |||
| margin-top: 0.3em; | |||
| width: 1.2em; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider .tinymce-mobile-slider-thumb { | |||
| /* vertically centering trick (margin: auto, top: 0, bottom: 0). On iOS and Safari, if you leave | |||
| * out these values, then it shows the thumb at the top of the spectrum. This is probably because it is | |||
| * absolutely positioned with only a left value, and not a top. Note, on Chrome it seems to be fine without | |||
| * this approach. | |||
| */ | |||
| align-items: center; | |||
| background-clip: padding-box; | |||
| background-color: #455a64; | |||
| border: 0.5em solid rgba(136, 136, 136, 0); | |||
| border-radius: 3em; | |||
| bottom: 0; | |||
| color: #fff; | |||
| display: flex; | |||
| height: 0.5em; | |||
| justify-content: center; | |||
| left: -10px; | |||
| margin: auto; | |||
| position: absolute; | |||
| top: 0; | |||
| transition: border 120ms cubic-bezier(0.39, 0.58, 0.57, 1); | |||
| width: 0.5em; | |||
| } | |||
| .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: 0.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 { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 100%; | |||
| flex: 1; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serializer-wrapper { | |||
| flex-direction: column; | |||
| justify-content: center; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-toolbar-group-item { | |||
| align-items: center; | |||
| display: flex; | |||
| } | |||
| .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-dot-container { | |||
| display: flex; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group input { | |||
| background: #ffffff; | |||
| border: none; | |||
| border-radius: 0; | |||
| color: #455a64; | |||
| flex-grow: 1; | |||
| font-size: 0.85em; | |||
| padding-bottom: 0.1em; | |||
| padding-left: 5px; | |||
| padding-top: 0.1em; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group input::-webkit-input-placeholder { | |||
| /* WebKit, Blink, Edge */ | |||
| color: #888; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group input::placeholder { | |||
| /* WebKit, Blink, Edge */ | |||
| color: #888; | |||
| } | |||
| /* dropup */ | |||
| .tinymce-mobile-dropup { | |||
| background: white; | |||
| display: flex; | |||
| overflow: hidden; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-dropup.tinymce-mobile-dropup-shrinking { | |||
| transition: height 0.3s ease-out; | |||
| } | |||
| .tinymce-mobile-dropup.tinymce-mobile-dropup-growing { | |||
| transition: height 0.3s ease-in; | |||
| } | |||
| .tinymce-mobile-dropup.tinymce-mobile-dropup-closed { | |||
| flex-grow: 0; | |||
| } | |||
| .tinymce-mobile-dropup.tinymce-mobile-dropup-open:not(.tinymce-mobile-dropup-growing) { | |||
| flex-grow: 1; | |||
| } | |||
| /* TODO min-height for device size and orientation */ | |||
| .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; | |||
| } | |||
| } | |||
| /* styles menu */ | |||
| .tinymce-mobile-styles-menu { | |||
| font-family: sans-serif; | |||
| outline: 4px solid black; | |||
| overflow: hidden; | |||
| position: relative; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-styles-menu [role="menu"] { | |||
| display: flex; | |||
| flex-direction: column; | |||
| height: 100%; | |||
| position: absolute; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-styles-menu [role="menu"].transitioning { | |||
| transition: transform 0.5s ease-in-out; | |||
| } | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-item { | |||
| border-bottom: 1px solid #ddd; | |||
| color: #455a64; | |||
| cursor: pointer; | |||
| display: flex; | |||
| padding: 1em 1em; | |||
| position: relative; | |||
| } | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-collapser .tinymce-mobile-styles-collapse-icon::before { | |||
| color: #455a64; | |||
| content: "\e314"; | |||
| font-family: 'tinymce-mobile', sans-serif; | |||
| } | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-item.tinymce-mobile-styles-item-is-menu::after { | |||
| color: #455a64; | |||
| content: "\e315"; | |||
| font-family: 'tinymce-mobile', sans-serif; | |||
| padding-left: 1em; | |||
| padding-right: 1em; | |||
| position: absolute; | |||
| right: 0; | |||
| } | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-item.tinymce-mobile-format-matches::after { | |||
| font-family: 'tinymce-mobile', sans-serif; | |||
| padding-left: 1em; | |||
| padding-right: 1em; | |||
| position: absolute; | |||
| right: 0; | |||
| } | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-separator, | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-collapser { | |||
| align-items: center; | |||
| background: #fff; | |||
| border-top: #455a64; | |||
| color: #455a64; | |||
| display: flex; | |||
| min-height: 2.5em; | |||
| padding-left: 1em; | |||
| padding-right: 1em; | |||
| } | |||
| .tinymce-mobile-styles-menu [data-transitioning-destination="before"][data-transitioning-state], | |||
| .tinymce-mobile-styles-menu [data-transitioning-state="before"] { | |||
| transform: translate(-100%); | |||
| } | |||
| .tinymce-mobile-styles-menu [data-transitioning-destination="current"][data-transitioning-state], | |||
| .tinymce-mobile-styles-menu [data-transitioning-state="current"] { | |||
| transform: translate(0%); | |||
| } | |||
| .tinymce-mobile-styles-menu [data-transitioning-destination="after"][data-transitioning-state], | |||
| .tinymce-mobile-styles-menu [data-transitioning-state="after"] { | |||
| transform: translate(100%); | |||
| } | |||
| @font-face { | |||
| font-family: 'tinymce-mobile'; | |||
| font-style: normal; | |||
| font-weight: normal; | |||
| src: url('fonts/tinymce-mobile.woff?8x92w3') format('woff'); | |||
| } | |||
| @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', sans-serif; | |||
| } | |||
| .mixin-flex-and-centre { | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| } | |||
| .mixin-flex-bar { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 100%; | |||
| } | |||
| .tinymce-mobile-outer-container .tinymce-mobile-editor-socket iframe { | |||
| background-color: #fff; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-editor-socket .tinymce-mobile-mask-edit-icon { | |||
| /* Note, on the iPod touch in landscape, this isn't visible when the navbar appears */ | |||
| background-color: #207ab7; | |||
| border-radius: 50%; | |||
| bottom: 1em; | |||
| color: white; | |||
| font-size: 1em; | |||
| height: 2.1em; | |||
| position: fixed; | |||
| right: 2em; | |||
| width: 2.1em; | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| } | |||
| @media only screen and (min-device-width:700px) { | |||
| .tinymce-mobile-editor-socket .tinymce-mobile-mask-edit-icon { | |||
| font-size: 1.2em; | |||
| } | |||
| } | |||
| .tinymce-mobile-outer-container:not(.tinymce-mobile-fullscreen-maximized) .tinymce-mobile-editor-socket { | |||
| height: 300px; | |||
| overflow: hidden; | |||
| } | |||
| .tinymce-mobile-outer-container:not(.tinymce-mobile-fullscreen-maximized) .tinymce-mobile-editor-socket iframe { | |||
| height: 100%; | |||
| } | |||
| .tinymce-mobile-outer-container:not(.tinymce-mobile-fullscreen-maximized) .tinymce-mobile-toolstrip { | |||
| display: none; | |||
| } | |||
| /* | |||
| Note, that if you don't include this (::-webkit-file-upload-button), the toolbar width gets | |||
| increased and the whole body becomes scrollable. It's important! | |||
| */ | |||
| 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%; | |||
| } | |||
| } | |||
+ 7
- 0
public/tinymce/skins/ui/oxide-dark/skin.mobile.min.css
File diff suppressed because it is too large
View File
+ 695
- 0
public/tinymce/skins/ui/oxide/content.css
View File
| @@ -0,0 +1,695 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| .mce-content-body .mce-item-anchor { | |||
| background: transparent url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'8'%20height%3D'12'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M0%200L8%200%208%2012%204.09117821%209%200%2012z'%2F%3E%3C%2Fsvg%3E%0A") no-repeat center; | |||
| cursor: default; | |||
| display: inline-block; | |||
| height: 12px !important; | |||
| padding: 0 2px; | |||
| -webkit-user-modify: read-only; | |||
| -moz-user-modify: read-only; | |||
| -webkit-user-select: all; | |||
| -moz-user-select: all; | |||
| -ms-user-select: all; | |||
| user-select: all; | |||
| width: 8px !important; | |||
| } | |||
| .mce-content-body .mce-item-anchor[data-mce-selected] { | |||
| outline-offset: 1px; | |||
| } | |||
| .tox-comments-visible .tox-comment { | |||
| background-color: #fff0b7; | |||
| } | |||
| .tox-comments-visible .tox-comment--active { | |||
| background-color: #ffe168; | |||
| } | |||
| .tox-checklist > li:not(.tox-checklist--hidden) { | |||
| list-style: none; | |||
| margin: 0.25em 0; | |||
| } | |||
| .tox-checklist > li:not(.tox-checklist--hidden)::before { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-unchecked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2215%22%20height%3D%2215%22%20x%3D%22.5%22%20y%3D%22.5%22%20fill-rule%3D%22nonzero%22%20stroke%3D%22%234C4C4C%22%20rx%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A"); | |||
| background-size: 100%; | |||
| content: ''; | |||
| cursor: pointer; | |||
| height: 1em; | |||
| margin-left: -1.5em; | |||
| margin-top: 0.125em; | |||
| position: absolute; | |||
| width: 1em; | |||
| } | |||
| .tox-checklist li:not(.tox-checklist--hidden).tox-checklist--checked::before { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-checked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%234099FF%22%20fill-rule%3D%22nonzero%22%20rx%3D%222%22%2F%3E%3Cpath%20id%3D%22Path%22%20fill%3D%22%23FFF%22%20fill-rule%3D%22nonzero%22%20d%3D%22M11.5703186%2C3.14417309%20C11.8516238%2C2.73724603%2012.4164781%2C2.62829933%2012.83558%2C2.89774797%20C13.260121%2C3.17069355%2013.3759736%2C3.72932262%2013.0909105%2C4.14168582%20L7.7580587%2C11.8560195%20C7.43776896%2C12.3193404%206.76483983%2C12.3852142%206.35607322%2C11.9948725%20L3.02491697%2C8.8138662%20C2.66090143%2C8.46625845%202.65798871%2C7.89594698%203.01850234%2C7.54483354%20C3.373942%2C7.19866177%203.94940006%2C7.19592841%204.30829608%2C7.5386474%20L6.85276923%2C9.9684299%20L11.5703186%2C3.14417309%20Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A"); | |||
| } | |||
| [dir=rtl] .tox-checklist > li:not(.tox-checklist--hidden)::before { | |||
| margin-left: 0; | |||
| margin-right: -1.5em; | |||
| } | |||
| /* stylelint-disable */ | |||
| /* http://prismjs.com/ */ | |||
| /** | |||
| * 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; | |||
| font-size: 1em; | |||
| text-align: left; | |||
| white-space: pre; | |||
| word-spacing: normal; | |||
| word-break: normal; | |||
| word-wrap: normal; | |||
| line-height: 1.5; | |||
| -moz-tab-size: 4; | |||
| tab-size: 4; | |||
| -webkit-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: 0.5em 0; | |||
| overflow: auto; | |||
| } | |||
| :not(pre) > code[class*="language-"], | |||
| pre[class*="language-"] { | |||
| background: #f5f2f0; | |||
| } | |||
| /* Inline code */ | |||
| :not(pre) > code[class*="language-"] { | |||
| padding: 0.1em; | |||
| border-radius: 0.3em; | |||
| white-space: normal; | |||
| } | |||
| .token.comment, | |||
| .token.prolog, | |||
| .token.doctype, | |||
| .token.cdata { | |||
| color: slategray; | |||
| } | |||
| .token.punctuation { | |||
| color: #999; | |||
| } | |||
| .namespace { | |||
| opacity: 0.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%, 0.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; | |||
| } | |||
| /* stylelint-enable */ | |||
| .mce-content-body { | |||
| overflow-wrap: break-word; | |||
| word-wrap: break-word; | |||
| } | |||
| .mce-content-body .mce-visual-caret { | |||
| background-color: black; | |||
| background-color: currentColor; | |||
| position: absolute; | |||
| } | |||
| .mce-content-body .mce-visual-caret-hidden { | |||
| display: none; | |||
| } | |||
| .mce-content-body *[data-mce-caret] { | |||
| left: -1000px; | |||
| margin: 0; | |||
| padding: 0; | |||
| position: absolute; | |||
| right: auto; | |||
| top: 0; | |||
| } | |||
| .mce-content-body .mce-offscreen-selection { | |||
| left: -2000000px; | |||
| max-width: 1000000px; | |||
| position: absolute; | |||
| } | |||
| .mce-content-body *[contentEditable=false] { | |||
| cursor: default; | |||
| } | |||
| .mce-content-body *[contentEditable=true] { | |||
| cursor: text; | |||
| } | |||
| .tox-cursor-format-painter { | |||
| cursor: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M15%2C6%20C15%2C5.45%2014.55%2C5%2014%2C5%20L6%2C5%20C5.45%2C5%205%2C5.45%205%2C6%20L5%2C10%20C5%2C10.55%205.45%2C11%206%2C11%20L14%2C11%20C14.55%2C11%2015%2C10.55%2015%2C10%20L15%2C9%20L16%2C9%20L16%2C12%20L9%2C12%20L9%2C19%20C9%2C19.55%209.45%2C20%2010%2C20%20L11%2C20%20C11.55%2C20%2012%2C19.55%2012%2C19%20L12%2C14%20L18%2C14%20L18%2C7%20L15%2C7%20L15%2C6%20Z%22%2F%3E%0A%20%20%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M1%2C1%20L8.25%2C1%20C8.66421356%2C1%209%2C1.33578644%209%2C1.75%20L9%2C1.75%20C9%2C2.16421356%208.66421356%2C2.5%208.25%2C2.5%20L2.5%2C2.5%20L2.5%2C8.25%20C2.5%2C8.66421356%202.16421356%2C9%201.75%2C9%20L1.75%2C9%20C1.33578644%2C9%201%2C8.66421356%201%2C8.25%20L1%2C1%20Z%22%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A"), default; | |||
| } | |||
| .mce-content-body figure.align-left { | |||
| float: left; | |||
| } | |||
| .mce-content-body figure.align-right { | |||
| float: right; | |||
| } | |||
| .mce-content-body figure.image.align-center { | |||
| display: table; | |||
| margin-left: auto; | |||
| margin-right: auto; | |||
| } | |||
| .mce-preview-object { | |||
| border: 1px solid gray; | |||
| display: inline-block; | |||
| line-height: 0; | |||
| margin: 0 2px 0 2px; | |||
| position: relative; | |||
| } | |||
| .mce-preview-object .mce-shim { | |||
| background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .mce-preview-object[data-mce-selected="2"] .mce-shim { | |||
| display: none; | |||
| } | |||
| .mce-object { | |||
| background: transparent url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M4%203h16a1%201%200%200%201%201%201v16a1%201%200%200%201-1%201H4a1%201%200%200%201-1-1V4a1%201%200%200%201%201-1zm1%202v14h14V5H5zm4.79%202.565l5.64%204.028a.5.5%200%200%201%200%20.814l-5.64%204.028a.5.5%200%200%201-.79-.407V7.972a.5.5%200%200%201%20.79-.407z%22%2F%3E%3C%2Fsvg%3E%0A") no-repeat center; | |||
| border: 1px dashed #aaa; | |||
| } | |||
| .mce-pagebreak { | |||
| border: 1px dashed #aaa; | |||
| cursor: default; | |||
| display: block; | |||
| height: 5px; | |||
| margin-top: 15px; | |||
| page-break-before: always; | |||
| width: 100%; | |||
| } | |||
| @media print { | |||
| .mce-pagebreak { | |||
| border: 0; | |||
| } | |||
| } | |||
| .tiny-pageembed .mce-shim { | |||
| background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .tiny-pageembed[data-mce-selected="2"] .mce-shim { | |||
| display: none; | |||
| } | |||
| .tiny-pageembed { | |||
| display: inline-block; | |||
| position: relative; | |||
| } | |||
| .tiny-pageembed--21by9, | |||
| .tiny-pageembed--16by9, | |||
| .tiny-pageembed--4by3, | |||
| .tiny-pageembed--1by1 { | |||
| display: block; | |||
| overflow: hidden; | |||
| padding: 0; | |||
| position: relative; | |||
| width: 100%; | |||
| } | |||
| .tiny-pageembed--21by9 { | |||
| padding-top: 42.857143%; | |||
| } | |||
| .tiny-pageembed--16by9 { | |||
| padding-top: 56.25%; | |||
| } | |||
| .tiny-pageembed--4by3 { | |||
| padding-top: 75%; | |||
| } | |||
| .tiny-pageembed--1by1 { | |||
| padding-top: 100%; | |||
| } | |||
| .tiny-pageembed--21by9 iframe, | |||
| .tiny-pageembed--16by9 iframe, | |||
| .tiny-pageembed--4by3 iframe, | |||
| .tiny-pageembed--1by1 iframe { | |||
| border: 0; | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .mce-content-body[data-mce-placeholder] { | |||
| position: relative; | |||
| } | |||
| .mce-content-body[data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| color: rgba(34, 47, 62, 0.7); | |||
| content: attr(data-mce-placeholder); | |||
| position: absolute; | |||
| } | |||
| .mce-content-body:not([dir=rtl])[data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| left: 1px; | |||
| } | |||
| .mce-content-body[dir=rtl][data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| right: 1px; | |||
| } | |||
| .mce-content-body div.mce-resizehandle { | |||
| background-color: #4099ff; | |||
| border-color: #4099ff; | |||
| border-style: solid; | |||
| border-width: 1px; | |||
| box-sizing: border-box; | |||
| height: 10px; | |||
| position: absolute; | |||
| width: 10px; | |||
| z-index: 10000; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:hover { | |||
| background-color: #4099ff; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(1) { | |||
| cursor: nwse-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(2) { | |||
| cursor: nesw-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(3) { | |||
| cursor: nwse-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(4) { | |||
| cursor: nesw-resize; | |||
| } | |||
| .mce-content-body .mce-clonedresizable { | |||
| opacity: 0.5; | |||
| outline: 1px dashed black; | |||
| position: absolute; | |||
| z-index: 10000; | |||
| } | |||
| .mce-content-body .mce-resize-helper { | |||
| background: #555; | |||
| background: rgba(0, 0, 0, 0.75); | |||
| border: 1px; | |||
| border-radius: 3px; | |||
| color: white; | |||
| display: none; | |||
| font-family: sans-serif; | |||
| font-size: 12px; | |||
| line-height: 14px; | |||
| margin: 5px 10px; | |||
| padding: 5px; | |||
| position: absolute; | |||
| white-space: nowrap; | |||
| z-index: 10001; | |||
| } | |||
| .tox-rtc-user-selection { | |||
| position: relative; | |||
| } | |||
| .tox-rtc-user-cursor { | |||
| bottom: 0; | |||
| cursor: default; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 2px; | |||
| } | |||
| .tox-rtc-user-cursor::before { | |||
| background-color: inherit; | |||
| border-radius: 50%; | |||
| content: ''; | |||
| display: block; | |||
| height: 8px; | |||
| position: absolute; | |||
| right: -3px; | |||
| top: -3px; | |||
| width: 8px; | |||
| } | |||
| .tox-rtc-user-cursor:hover::after { | |||
| background-color: inherit; | |||
| border-radius: 100px; | |||
| box-sizing: border-box; | |||
| color: #fff; | |||
| content: attr(data-user); | |||
| display: block; | |||
| font-size: 12px; | |||
| font-weight: bold; | |||
| left: -5px; | |||
| min-height: 8px; | |||
| min-width: 8px; | |||
| padding: 0 12px; | |||
| position: absolute; | |||
| top: -11px; | |||
| white-space: nowrap; | |||
| z-index: 1000; | |||
| } | |||
| .tox-rtc-user-selection--1 .tox-rtc-user-cursor { | |||
| background-color: #2dc26b; | |||
| } | |||
| .tox-rtc-user-selection--2 .tox-rtc-user-cursor { | |||
| background-color: #e03e2d; | |||
| } | |||
| .tox-rtc-user-selection--3 .tox-rtc-user-cursor { | |||
| background-color: #f1c40f; | |||
| } | |||
| .tox-rtc-user-selection--4 .tox-rtc-user-cursor { | |||
| background-color: #3598db; | |||
| } | |||
| .tox-rtc-user-selection--5 .tox-rtc-user-cursor { | |||
| background-color: #b96ad9; | |||
| } | |||
| .tox-rtc-user-selection--6 .tox-rtc-user-cursor { | |||
| background-color: #e67e23; | |||
| } | |||
| .tox-rtc-user-selection--7 .tox-rtc-user-cursor { | |||
| background-color: #aaa69d; | |||
| } | |||
| .tox-rtc-user-selection--8 .tox-rtc-user-cursor { | |||
| background-color: #f368e0; | |||
| } | |||
| .tox-rtc-remote-image { | |||
| background: #eaeaea url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2236%22%20height%3D%2212%22%20viewBox%3D%220%200%2036%2012%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%3Ccircle%20cx%3D%226%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%20%20%3Ccircle%20cx%3D%2218%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20begin%3D%22.33s%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%20%20%3Ccircle%20cx%3D%2230%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20begin%3D%22.66s%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%3C%2Fsvg%3E%0A") no-repeat center center; | |||
| border: 1px solid #ccc; | |||
| min-height: 240px; | |||
| min-width: 320px; | |||
| } | |||
| .mce-match-marker { | |||
| background: #aaa; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected::-moz-selection { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected::selection { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-content-body img[data-mce-selected], | |||
| .mce-content-body table[data-mce-selected] { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body hr[data-mce-selected] { | |||
| outline: 3px solid #b4d7ff; | |||
| outline-offset: 1px; | |||
| } | |||
| .mce-content-body *[contentEditable=false] *[contentEditable=true]:focus { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body *[contentEditable=false] *[contentEditable=true]:hover { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body *[contentEditable=false][data-mce-selected] { | |||
| cursor: not-allowed; | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .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-color: #b4d7ff; | |||
| } | |||
| .mce-content-body .mce-edit-focus { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body td[data-mce-selected], | |||
| .mce-content-body th[data-mce-selected] { | |||
| background-color: #b4d7ff !important; | |||
| } | |||
| .mce-content-body td[data-mce-selected]::-moz-selection, | |||
| .mce-content-body th[data-mce-selected]::-moz-selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body td[data-mce-selected]::selection, | |||
| .mce-content-body th[data-mce-selected]::selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body td[data-mce-selected] *, | |||
| .mce-content-body th[data-mce-selected] * { | |||
| -webkit-touch-callout: none; | |||
| -webkit-user-select: none; | |||
| -moz-user-select: none; | |||
| -ms-user-select: none; | |||
| user-select: none; | |||
| } | |||
| .mce-content-body img::-moz-selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body img::selection { | |||
| background: none; | |||
| } | |||
| .ephox-snooker-resizer-bar { | |||
| background-color: #b4d7ff; | |||
| opacity: 0; | |||
| -webkit-user-select: none; | |||
| -moz-user-select: none; | |||
| -ms-user-select: none; | |||
| user-select: none; | |||
| } | |||
| .ephox-snooker-resizer-cols { | |||
| cursor: col-resize; | |||
| } | |||
| .ephox-snooker-resizer-rows { | |||
| cursor: row-resize; | |||
| } | |||
| .ephox-snooker-resizer-bar.ephox-snooker-resizer-bar-dragging { | |||
| opacity: 1; | |||
| } | |||
| .mce-spellchecker-word { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'4'%20height%3D'4'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20stroke%3D'%23ff0000'%20fill%3D'none'%20stroke-linecap%3D'round'%20stroke-opacity%3D'.75'%20d%3D'M0%203L2%201%204%203'%2F%3E%3C%2Fsvg%3E%0A"); | |||
| background-position: 0 calc(100% + 1px); | |||
| background-repeat: repeat-x; | |||
| background-size: auto 6px; | |||
| cursor: default; | |||
| height: 2rem; | |||
| } | |||
| .mce-spellchecker-grammar { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'4'%20height%3D'4'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20stroke%3D'%2300A835'%20fill%3D'none'%20stroke-linecap%3D'round'%20d%3D'M0%203L2%201%204%203'%2F%3E%3C%2Fsvg%3E%0A"); | |||
| background-position: 0 calc(100% + 1px); | |||
| background-repeat: repeat-x; | |||
| background-size: auto 6px; | |||
| cursor: default; | |||
| } | |||
| .mce-toc { | |||
| border: 1px solid gray; | |||
| } | |||
| .mce-toc h2 { | |||
| margin: 4px; | |||
| } | |||
| .mce-toc li { | |||
| list-style-type: none; | |||
| } | |||
| .mce-item-table, | |||
| .mce-item-table td, | |||
| .mce-item-table th, | |||
| .mce-item-table caption { | |||
| border: 1px dashed #bbb; | |||
| } | |||
| .mce-visualblocks p, | |||
| .mce-visualblocks h1, | |||
| .mce-visualblocks h2, | |||
| .mce-visualblocks h3, | |||
| .mce-visualblocks h4, | |||
| .mce-visualblocks h5, | |||
| .mce-visualblocks h6, | |||
| .mce-visualblocks div:not([data-mce-bogus]), | |||
| .mce-visualblocks section, | |||
| .mce-visualblocks article, | |||
| .mce-visualblocks blockquote, | |||
| .mce-visualblocks address, | |||
| .mce-visualblocks pre, | |||
| .mce-visualblocks figure, | |||
| .mce-visualblocks figcaption, | |||
| .mce-visualblocks hgroup, | |||
| .mce-visualblocks aside, | |||
| .mce-visualblocks ul, | |||
| .mce-visualblocks ol, | |||
| .mce-visualblocks dl { | |||
| background-repeat: no-repeat; | |||
| border: 1px dashed #bbb; | |||
| margin-left: 3px; | |||
| padding-top: 10px; | |||
| } | |||
| .mce-visualblocks p { | |||
| background-image: url(data:image/gif;base64,R0lGODlhCQAJAJEAAAAAAP///7u7u////yH5BAEAAAMALAAAAAAJAAkAAAIQnG+CqCN/mlyvsRUpThG6AgA7); | |||
| } | |||
| .mce-visualblocks h1 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybGu1JuxHoAfRNRW3TWXyF2YiRUAOw==); | |||
| } | |||
| .mce-visualblocks h2 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8Hybbx4oOuqgTynJd6bGlWg3DkJzoaUAAAOw==); | |||
| } | |||
| .mce-visualblocks h3 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIZjI8Hybbx4oOuqgTynJf2Ln2NOHpQpmhAAQA7); | |||
| } | |||
| .mce-visualblocks h4 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxInR0zqeAdhtJlXwV1oCll2HaWgAAOw==); | |||
| } | |||
| .mce-visualblocks h5 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxIoiuwjane4iq5GlW05GgIkIZUAAAOw==); | |||
| } | |||
| .mce-visualblocks h6 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxIoiuwjan04jep1iZ1XRlAo5bVgAAOw==); | |||
| } | |||
| .mce-visualblocks div:not([data-mce-bogus]) { | |||
| background-image: url(data:image/gif;base64,R0lGODlhEgAKAIABALu7u////yH5BAEAAAEALAAAAAASAAoAAAIfjI9poI0cgDywrhuxfbrzDEbQM2Ei5aRjmoySW4pAAQA7); | |||
| } | |||
| .mce-visualblocks section { | |||
| background-image: url(data:image/gif;base64,R0lGODlhKAAKAIABALu7u////yH5BAEAAAEALAAAAAAoAAoAAAI5jI+pywcNY3sBWHdNrplytD2ellDeSVbp+GmWqaDqDMepc8t17Y4vBsK5hDyJMcI6KkuYU+jpjLoKADs=); | |||
| } | |||
| .mce-visualblocks article { | |||
| background-image: url(data:image/gif;base64,R0lGODlhKgAKAIABALu7u////yH5BAEAAAEALAAAAAAqAAoAAAI6jI+pywkNY3wG0GBvrsd2tXGYSGnfiF7ikpXemTpOiJScasYoDJJrjsG9gkCJ0ag6KhmaIe3pjDYBBQA7); | |||
| } | |||
| .mce-visualblocks blockquote { | |||
| background-image: url(data:image/gif;base64,R0lGODlhPgAKAIABALu7u////yH5BAEAAAEALAAAAAA+AAoAAAJPjI+py+0Knpz0xQDyuUhvfoGgIX5iSKZYgq5uNL5q69asZ8s5rrf0yZmpNkJZzFesBTu8TOlDVAabUyatguVhWduud3EyiUk45xhTTgMBBQA7); | |||
| } | |||
| .mce-visualblocks address { | |||
| background-image: url(data:image/gif;base64,R0lGODlhLQAKAIABALu7u////yH5BAEAAAEALAAAAAAtAAoAAAI/jI+pywwNozSP1gDyyZcjb3UaRpXkWaXmZW4OqKLhBmLs+K263DkJK7OJeifh7FicKD9A1/IpGdKkyFpNmCkAADs=); | |||
| } | |||
| .mce-visualblocks pre { | |||
| background-image: url(data:image/gif;base64,R0lGODlhFQAKAIABALu7uwAAACH5BAEAAAEALAAAAAAVAAoAAAIjjI+ZoN0cgDwSmnpz1NCueYERhnibZVKLNnbOq8IvKpJtVQAAOw==); | |||
| } | |||
| .mce-visualblocks figure { | |||
| background-image: url(data:image/gif;base64,R0lGODlhJAAKAIAAALu7u////yH5BAEAAAEALAAAAAAkAAoAAAI0jI+py+2fwAHUSFvD3RlvG4HIp4nX5JFSpnZUJ6LlrM52OE7uSWosBHScgkSZj7dDKnWAAgA7); | |||
| } | |||
| .mce-visualblocks figcaption { | |||
| border: 1px dashed #bbb; | |||
| } | |||
| .mce-visualblocks hgroup { | |||
| background-image: url(data:image/gif;base64,R0lGODlhJwAKAIABALu7uwAAACH5BAEAAAEALAAAAAAnAAoAAAI3jI+pywYNI3uB0gpsRtt5fFnfNZaVSYJil4Wo03Hv6Z62uOCgiXH1kZIIJ8NiIxRrAZNMZAtQAAA7); | |||
| } | |||
| .mce-visualblocks aside { | |||
| background-image: url(data:image/gif;base64,R0lGODlhHgAKAIABAKqqqv///yH5BAEAAAEALAAAAAAeAAoAAAItjI+pG8APjZOTzgtqy7I3f1yehmQcFY4WKZbqByutmW4aHUd6vfcVbgudgpYCADs=); | |||
| } | |||
| .mce-visualblocks ul { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIAAALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybGuYnqUVSjvw26DzzXiqIDlVwAAOw==); | |||
| } | |||
| .mce-visualblocks ol { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybH6HHt0qourxC6CvzXieHyeWQAAOw==); | |||
| } | |||
| .mce-visualblocks dl { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybEOnmOvUoWznTqeuEjNSCqeGRUAOw==); | |||
| } | |||
| .mce-visualblocks:not([dir=rtl]) p, | |||
| .mce-visualblocks:not([dir=rtl]) h1, | |||
| .mce-visualblocks:not([dir=rtl]) h2, | |||
| .mce-visualblocks:not([dir=rtl]) h3, | |||
| .mce-visualblocks:not([dir=rtl]) h4, | |||
| .mce-visualblocks:not([dir=rtl]) h5, | |||
| .mce-visualblocks:not([dir=rtl]) h6, | |||
| .mce-visualblocks:not([dir=rtl]) div:not([data-mce-bogus]), | |||
| .mce-visualblocks:not([dir=rtl]) section, | |||
| .mce-visualblocks:not([dir=rtl]) article, | |||
| .mce-visualblocks:not([dir=rtl]) blockquote, | |||
| .mce-visualblocks:not([dir=rtl]) address, | |||
| .mce-visualblocks:not([dir=rtl]) pre, | |||
| .mce-visualblocks:not([dir=rtl]) figure, | |||
| .mce-visualblocks:not([dir=rtl]) figcaption, | |||
| .mce-visualblocks:not([dir=rtl]) hgroup, | |||
| .mce-visualblocks:not([dir=rtl]) aside, | |||
| .mce-visualblocks:not([dir=rtl]) ul, | |||
| .mce-visualblocks:not([dir=rtl]) ol, | |||
| .mce-visualblocks:not([dir=rtl]) dl { | |||
| margin-left: 3px; | |||
| } | |||
| .mce-visualblocks[dir=rtl] p, | |||
| .mce-visualblocks[dir=rtl] h1, | |||
| .mce-visualblocks[dir=rtl] h2, | |||
| .mce-visualblocks[dir=rtl] h3, | |||
| .mce-visualblocks[dir=rtl] h4, | |||
| .mce-visualblocks[dir=rtl] h5, | |||
| .mce-visualblocks[dir=rtl] h6, | |||
| .mce-visualblocks[dir=rtl] div:not([data-mce-bogus]), | |||
| .mce-visualblocks[dir=rtl] section, | |||
| .mce-visualblocks[dir=rtl] article, | |||
| .mce-visualblocks[dir=rtl] blockquote, | |||
| .mce-visualblocks[dir=rtl] address, | |||
| .mce-visualblocks[dir=rtl] pre, | |||
| .mce-visualblocks[dir=rtl] figure, | |||
| .mce-visualblocks[dir=rtl] figcaption, | |||
| .mce-visualblocks[dir=rtl] hgroup, | |||
| .mce-visualblocks[dir=rtl] aside, | |||
| .mce-visualblocks[dir=rtl] ul, | |||
| .mce-visualblocks[dir=rtl] ol, | |||
| .mce-visualblocks[dir=rtl] dl { | |||
| background-position-x: right; | |||
| margin-right: 3px; | |||
| } | |||
| .mce-nbsp, | |||
| .mce-shy { | |||
| background: #aaa; | |||
| } | |||
| .mce-shy::after { | |||
| content: '-'; | |||
| } | |||
| body { | |||
| font-family: sans-serif; | |||
| } | |||
| table { | |||
| border-collapse: collapse; | |||
| } | |||
+ 689
- 0
public/tinymce/skins/ui/oxide/content.inline.css
View File
| @@ -0,0 +1,689 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| .mce-content-body .mce-item-anchor { | |||
| background: transparent url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'8'%20height%3D'12'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M0%200L8%200%208%2012%204.09117821%209%200%2012z'%2F%3E%3C%2Fsvg%3E%0A") no-repeat center; | |||
| cursor: default; | |||
| display: inline-block; | |||
| height: 12px !important; | |||
| padding: 0 2px; | |||
| -webkit-user-modify: read-only; | |||
| -moz-user-modify: read-only; | |||
| -webkit-user-select: all; | |||
| -moz-user-select: all; | |||
| -ms-user-select: all; | |||
| user-select: all; | |||
| width: 8px !important; | |||
| } | |||
| .mce-content-body .mce-item-anchor[data-mce-selected] { | |||
| outline-offset: 1px; | |||
| } | |||
| .tox-comments-visible .tox-comment { | |||
| background-color: #fff0b7; | |||
| } | |||
| .tox-comments-visible .tox-comment--active { | |||
| background-color: #ffe168; | |||
| } | |||
| .tox-checklist > li:not(.tox-checklist--hidden) { | |||
| list-style: none; | |||
| margin: 0.25em 0; | |||
| } | |||
| .tox-checklist > li:not(.tox-checklist--hidden)::before { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-unchecked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2215%22%20height%3D%2215%22%20x%3D%22.5%22%20y%3D%22.5%22%20fill-rule%3D%22nonzero%22%20stroke%3D%22%234C4C4C%22%20rx%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A"); | |||
| background-size: 100%; | |||
| content: ''; | |||
| cursor: pointer; | |||
| height: 1em; | |||
| margin-left: -1.5em; | |||
| margin-top: 0.125em; | |||
| position: absolute; | |||
| width: 1em; | |||
| } | |||
| .tox-checklist li:not(.tox-checklist--hidden).tox-checklist--checked::before { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-checked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%234099FF%22%20fill-rule%3D%22nonzero%22%20rx%3D%222%22%2F%3E%3Cpath%20id%3D%22Path%22%20fill%3D%22%23FFF%22%20fill-rule%3D%22nonzero%22%20d%3D%22M11.5703186%2C3.14417309%20C11.8516238%2C2.73724603%2012.4164781%2C2.62829933%2012.83558%2C2.89774797%20C13.260121%2C3.17069355%2013.3759736%2C3.72932262%2013.0909105%2C4.14168582%20L7.7580587%2C11.8560195%20C7.43776896%2C12.3193404%206.76483983%2C12.3852142%206.35607322%2C11.9948725%20L3.02491697%2C8.8138662%20C2.66090143%2C8.46625845%202.65798871%2C7.89594698%203.01850234%2C7.54483354%20C3.373942%2C7.19866177%203.94940006%2C7.19592841%204.30829608%2C7.5386474%20L6.85276923%2C9.9684299%20L11.5703186%2C3.14417309%20Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A"); | |||
| } | |||
| [dir=rtl] .tox-checklist > li:not(.tox-checklist--hidden)::before { | |||
| margin-left: 0; | |||
| margin-right: -1.5em; | |||
| } | |||
| /* stylelint-disable */ | |||
| /* http://prismjs.com/ */ | |||
| /** | |||
| * 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; | |||
| font-size: 1em; | |||
| text-align: left; | |||
| white-space: pre; | |||
| word-spacing: normal; | |||
| word-break: normal; | |||
| word-wrap: normal; | |||
| line-height: 1.5; | |||
| -moz-tab-size: 4; | |||
| tab-size: 4; | |||
| -webkit-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: 0.5em 0; | |||
| overflow: auto; | |||
| } | |||
| :not(pre) > code[class*="language-"], | |||
| pre[class*="language-"] { | |||
| background: #f5f2f0; | |||
| } | |||
| /* Inline code */ | |||
| :not(pre) > code[class*="language-"] { | |||
| padding: 0.1em; | |||
| border-radius: 0.3em; | |||
| white-space: normal; | |||
| } | |||
| .token.comment, | |||
| .token.prolog, | |||
| .token.doctype, | |||
| .token.cdata { | |||
| color: slategray; | |||
| } | |||
| .token.punctuation { | |||
| color: #999; | |||
| } | |||
| .namespace { | |||
| opacity: 0.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%, 0.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; | |||
| } | |||
| /* stylelint-enable */ | |||
| .mce-content-body { | |||
| overflow-wrap: break-word; | |||
| word-wrap: break-word; | |||
| } | |||
| .mce-content-body .mce-visual-caret { | |||
| background-color: black; | |||
| background-color: currentColor; | |||
| position: absolute; | |||
| } | |||
| .mce-content-body .mce-visual-caret-hidden { | |||
| display: none; | |||
| } | |||
| .mce-content-body *[data-mce-caret] { | |||
| left: -1000px; | |||
| margin: 0; | |||
| padding: 0; | |||
| position: absolute; | |||
| right: auto; | |||
| top: 0; | |||
| } | |||
| .mce-content-body .mce-offscreen-selection { | |||
| left: -2000000px; | |||
| max-width: 1000000px; | |||
| position: absolute; | |||
| } | |||
| .mce-content-body *[contentEditable=false] { | |||
| cursor: default; | |||
| } | |||
| .mce-content-body *[contentEditable=true] { | |||
| cursor: text; | |||
| } | |||
| .tox-cursor-format-painter { | |||
| cursor: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M15%2C6%20C15%2C5.45%2014.55%2C5%2014%2C5%20L6%2C5%20C5.45%2C5%205%2C5.45%205%2C6%20L5%2C10%20C5%2C10.55%205.45%2C11%206%2C11%20L14%2C11%20C14.55%2C11%2015%2C10.55%2015%2C10%20L15%2C9%20L16%2C9%20L16%2C12%20L9%2C12%20L9%2C19%20C9%2C19.55%209.45%2C20%2010%2C20%20L11%2C20%20C11.55%2C20%2012%2C19.55%2012%2C19%20L12%2C14%20L18%2C14%20L18%2C7%20L15%2C7%20L15%2C6%20Z%22%2F%3E%0A%20%20%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20d%3D%22M1%2C1%20L8.25%2C1%20C8.66421356%2C1%209%2C1.33578644%209%2C1.75%20L9%2C1.75%20C9%2C2.16421356%208.66421356%2C2.5%208.25%2C2.5%20L2.5%2C2.5%20L2.5%2C8.25%20C2.5%2C8.66421356%202.16421356%2C9%201.75%2C9%20L1.75%2C9%20C1.33578644%2C9%201%2C8.66421356%201%2C8.25%20L1%2C1%20Z%22%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A"), default; | |||
| } | |||
| .mce-content-body figure.align-left { | |||
| float: left; | |||
| } | |||
| .mce-content-body figure.align-right { | |||
| float: right; | |||
| } | |||
| .mce-content-body figure.image.align-center { | |||
| display: table; | |||
| margin-left: auto; | |||
| margin-right: auto; | |||
| } | |||
| .mce-preview-object { | |||
| border: 1px solid gray; | |||
| display: inline-block; | |||
| line-height: 0; | |||
| margin: 0 2px 0 2px; | |||
| position: relative; | |||
| } | |||
| .mce-preview-object .mce-shim { | |||
| background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .mce-preview-object[data-mce-selected="2"] .mce-shim { | |||
| display: none; | |||
| } | |||
| .mce-object { | |||
| background: transparent url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M4%203h16a1%201%200%200%201%201%201v16a1%201%200%200%201-1%201H4a1%201%200%200%201-1-1V4a1%201%200%200%201%201-1zm1%202v14h14V5H5zm4.79%202.565l5.64%204.028a.5.5%200%200%201%200%20.814l-5.64%204.028a.5.5%200%200%201-.79-.407V7.972a.5.5%200%200%201%20.79-.407z%22%2F%3E%3C%2Fsvg%3E%0A") no-repeat center; | |||
| border: 1px dashed #aaa; | |||
| } | |||
| .mce-pagebreak { | |||
| border: 1px dashed #aaa; | |||
| cursor: default; | |||
| display: block; | |||
| height: 5px; | |||
| margin-top: 15px; | |||
| page-break-before: always; | |||
| width: 100%; | |||
| } | |||
| @media print { | |||
| .mce-pagebreak { | |||
| border: 0; | |||
| } | |||
| } | |||
| .tiny-pageembed .mce-shim { | |||
| background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .tiny-pageembed[data-mce-selected="2"] .mce-shim { | |||
| display: none; | |||
| } | |||
| .tiny-pageembed { | |||
| display: inline-block; | |||
| position: relative; | |||
| } | |||
| .tiny-pageembed--21by9, | |||
| .tiny-pageembed--16by9, | |||
| .tiny-pageembed--4by3, | |||
| .tiny-pageembed--1by1 { | |||
| display: block; | |||
| overflow: hidden; | |||
| padding: 0; | |||
| position: relative; | |||
| width: 100%; | |||
| } | |||
| .tiny-pageembed--21by9 { | |||
| padding-top: 42.857143%; | |||
| } | |||
| .tiny-pageembed--16by9 { | |||
| padding-top: 56.25%; | |||
| } | |||
| .tiny-pageembed--4by3 { | |||
| padding-top: 75%; | |||
| } | |||
| .tiny-pageembed--1by1 { | |||
| padding-top: 100%; | |||
| } | |||
| .tiny-pageembed--21by9 iframe, | |||
| .tiny-pageembed--16by9 iframe, | |||
| .tiny-pageembed--4by3 iframe, | |||
| .tiny-pageembed--1by1 iframe { | |||
| border: 0; | |||
| height: 100%; | |||
| left: 0; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .mce-content-body[data-mce-placeholder] { | |||
| position: relative; | |||
| } | |||
| .mce-content-body[data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| color: rgba(34, 47, 62, 0.7); | |||
| content: attr(data-mce-placeholder); | |||
| position: absolute; | |||
| } | |||
| .mce-content-body:not([dir=rtl])[data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| left: 1px; | |||
| } | |||
| .mce-content-body[dir=rtl][data-mce-placeholder]:not(.mce-visualblocks)::before { | |||
| right: 1px; | |||
| } | |||
| .mce-content-body div.mce-resizehandle { | |||
| background-color: #4099ff; | |||
| border-color: #4099ff; | |||
| border-style: solid; | |||
| border-width: 1px; | |||
| box-sizing: border-box; | |||
| height: 10px; | |||
| position: absolute; | |||
| width: 10px; | |||
| z-index: 10000; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:hover { | |||
| background-color: #4099ff; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(1) { | |||
| cursor: nwse-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(2) { | |||
| cursor: nesw-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(3) { | |||
| cursor: nwse-resize; | |||
| } | |||
| .mce-content-body div.mce-resizehandle:nth-of-type(4) { | |||
| cursor: nesw-resize; | |||
| } | |||
| .mce-content-body .mce-clonedresizable { | |||
| opacity: 0.5; | |||
| outline: 1px dashed black; | |||
| position: absolute; | |||
| z-index: 10000; | |||
| } | |||
| .mce-content-body .mce-resize-helper { | |||
| background: #555; | |||
| background: rgba(0, 0, 0, 0.75); | |||
| border: 1px; | |||
| border-radius: 3px; | |||
| color: white; | |||
| display: none; | |||
| font-family: sans-serif; | |||
| font-size: 12px; | |||
| line-height: 14px; | |||
| margin: 5px 10px; | |||
| padding: 5px; | |||
| position: absolute; | |||
| white-space: nowrap; | |||
| z-index: 10001; | |||
| } | |||
| .tox-rtc-user-selection { | |||
| position: relative; | |||
| } | |||
| .tox-rtc-user-cursor { | |||
| bottom: 0; | |||
| cursor: default; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 2px; | |||
| } | |||
| .tox-rtc-user-cursor::before { | |||
| background-color: inherit; | |||
| border-radius: 50%; | |||
| content: ''; | |||
| display: block; | |||
| height: 8px; | |||
| position: absolute; | |||
| right: -3px; | |||
| top: -3px; | |||
| width: 8px; | |||
| } | |||
| .tox-rtc-user-cursor:hover::after { | |||
| background-color: inherit; | |||
| border-radius: 100px; | |||
| box-sizing: border-box; | |||
| color: #fff; | |||
| content: attr(data-user); | |||
| display: block; | |||
| font-size: 12px; | |||
| font-weight: bold; | |||
| left: -5px; | |||
| min-height: 8px; | |||
| min-width: 8px; | |||
| padding: 0 12px; | |||
| position: absolute; | |||
| top: -11px; | |||
| white-space: nowrap; | |||
| z-index: 1000; | |||
| } | |||
| .tox-rtc-user-selection--1 .tox-rtc-user-cursor { | |||
| background-color: #2dc26b; | |||
| } | |||
| .tox-rtc-user-selection--2 .tox-rtc-user-cursor { | |||
| background-color: #e03e2d; | |||
| } | |||
| .tox-rtc-user-selection--3 .tox-rtc-user-cursor { | |||
| background-color: #f1c40f; | |||
| } | |||
| .tox-rtc-user-selection--4 .tox-rtc-user-cursor { | |||
| background-color: #3598db; | |||
| } | |||
| .tox-rtc-user-selection--5 .tox-rtc-user-cursor { | |||
| background-color: #b96ad9; | |||
| } | |||
| .tox-rtc-user-selection--6 .tox-rtc-user-cursor { | |||
| background-color: #e67e23; | |||
| } | |||
| .tox-rtc-user-selection--7 .tox-rtc-user-cursor { | |||
| background-color: #aaa69d; | |||
| } | |||
| .tox-rtc-user-selection--8 .tox-rtc-user-cursor { | |||
| background-color: #f368e0; | |||
| } | |||
| .tox-rtc-remote-image { | |||
| background: #eaeaea url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2236%22%20height%3D%2212%22%20viewBox%3D%220%200%2036%2012%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%3Ccircle%20cx%3D%226%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%20%20%3Ccircle%20cx%3D%2218%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20begin%3D%22.33s%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%20%20%3Ccircle%20cx%3D%2230%22%20cy%3D%226%22%20r%3D%223%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%20.2)%22%3E%0A%20%20%20%20%3Canimate%20attributeName%3D%22r%22%20values%3D%223%3B5%3B3%22%20calcMode%3D%22linear%22%20begin%3D%22.66s%22%20dur%3D%221s%22%20repeatCount%3D%22indefinite%22%20%2F%3E%0A%20%20%3C%2Fcircle%3E%0A%3C%2Fsvg%3E%0A") no-repeat center center; | |||
| border: 1px solid #ccc; | |||
| min-height: 240px; | |||
| min-width: 320px; | |||
| } | |||
| .mce-match-marker { | |||
| background: #aaa; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected::-moz-selection { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-match-marker-selected::selection { | |||
| background: #39f; | |||
| color: #fff; | |||
| } | |||
| .mce-content-body img[data-mce-selected], | |||
| .mce-content-body table[data-mce-selected] { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body hr[data-mce-selected] { | |||
| outline: 3px solid #b4d7ff; | |||
| outline-offset: 1px; | |||
| } | |||
| .mce-content-body *[contentEditable=false] *[contentEditable=true]:focus { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body *[contentEditable=false] *[contentEditable=true]:hover { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body *[contentEditable=false][data-mce-selected] { | |||
| cursor: not-allowed; | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .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-color: #b4d7ff; | |||
| } | |||
| .mce-content-body .mce-edit-focus { | |||
| outline: 3px solid #b4d7ff; | |||
| } | |||
| .mce-content-body td[data-mce-selected], | |||
| .mce-content-body th[data-mce-selected] { | |||
| background-color: #b4d7ff !important; | |||
| } | |||
| .mce-content-body td[data-mce-selected]::-moz-selection, | |||
| .mce-content-body th[data-mce-selected]::-moz-selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body td[data-mce-selected]::selection, | |||
| .mce-content-body th[data-mce-selected]::selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body td[data-mce-selected] *, | |||
| .mce-content-body th[data-mce-selected] * { | |||
| -webkit-touch-callout: none; | |||
| -webkit-user-select: none; | |||
| -moz-user-select: none; | |||
| -ms-user-select: none; | |||
| user-select: none; | |||
| } | |||
| .mce-content-body img::-moz-selection { | |||
| background: none; | |||
| } | |||
| .mce-content-body img::selection { | |||
| background: none; | |||
| } | |||
| .ephox-snooker-resizer-bar { | |||
| background-color: #b4d7ff; | |||
| opacity: 0; | |||
| -webkit-user-select: none; | |||
| -moz-user-select: none; | |||
| -ms-user-select: none; | |||
| user-select: none; | |||
| } | |||
| .ephox-snooker-resizer-cols { | |||
| cursor: col-resize; | |||
| } | |||
| .ephox-snooker-resizer-rows { | |||
| cursor: row-resize; | |||
| } | |||
| .ephox-snooker-resizer-bar.ephox-snooker-resizer-bar-dragging { | |||
| opacity: 1; | |||
| } | |||
| .mce-spellchecker-word { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'4'%20height%3D'4'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20stroke%3D'%23ff0000'%20fill%3D'none'%20stroke-linecap%3D'round'%20stroke-opacity%3D'.75'%20d%3D'M0%203L2%201%204%203'%2F%3E%3C%2Fsvg%3E%0A"); | |||
| background-position: 0 calc(100% + 1px); | |||
| background-repeat: repeat-x; | |||
| background-size: auto 6px; | |||
| cursor: default; | |||
| height: 2rem; | |||
| } | |||
| .mce-spellchecker-grammar { | |||
| background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D'4'%20height%3D'4'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20stroke%3D'%2300A835'%20fill%3D'none'%20stroke-linecap%3D'round'%20d%3D'M0%203L2%201%204%203'%2F%3E%3C%2Fsvg%3E%0A"); | |||
| background-position: 0 calc(100% + 1px); | |||
| background-repeat: repeat-x; | |||
| background-size: auto 6px; | |||
| cursor: default; | |||
| } | |||
| .mce-toc { | |||
| border: 1px solid gray; | |||
| } | |||
| .mce-toc h2 { | |||
| margin: 4px; | |||
| } | |||
| .mce-toc li { | |||
| list-style-type: none; | |||
| } | |||
| .mce-item-table, | |||
| .mce-item-table td, | |||
| .mce-item-table th, | |||
| .mce-item-table caption { | |||
| border: 1px dashed #bbb; | |||
| } | |||
| .mce-visualblocks p, | |||
| .mce-visualblocks h1, | |||
| .mce-visualblocks h2, | |||
| .mce-visualblocks h3, | |||
| .mce-visualblocks h4, | |||
| .mce-visualblocks h5, | |||
| .mce-visualblocks h6, | |||
| .mce-visualblocks div:not([data-mce-bogus]), | |||
| .mce-visualblocks section, | |||
| .mce-visualblocks article, | |||
| .mce-visualblocks blockquote, | |||
| .mce-visualblocks address, | |||
| .mce-visualblocks pre, | |||
| .mce-visualblocks figure, | |||
| .mce-visualblocks figcaption, | |||
| .mce-visualblocks hgroup, | |||
| .mce-visualblocks aside, | |||
| .mce-visualblocks ul, | |||
| .mce-visualblocks ol, | |||
| .mce-visualblocks dl { | |||
| background-repeat: no-repeat; | |||
| border: 1px dashed #bbb; | |||
| margin-left: 3px; | |||
| padding-top: 10px; | |||
| } | |||
| .mce-visualblocks p { | |||
| background-image: url(data:image/gif;base64,R0lGODlhCQAJAJEAAAAAAP///7u7u////yH5BAEAAAMALAAAAAAJAAkAAAIQnG+CqCN/mlyvsRUpThG6AgA7); | |||
| } | |||
| .mce-visualblocks h1 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybGu1JuxHoAfRNRW3TWXyF2YiRUAOw==); | |||
| } | |||
| .mce-visualblocks h2 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8Hybbx4oOuqgTynJd6bGlWg3DkJzoaUAAAOw==); | |||
| } | |||
| .mce-visualblocks h3 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIZjI8Hybbx4oOuqgTynJf2Ln2NOHpQpmhAAQA7); | |||
| } | |||
| .mce-visualblocks h4 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxInR0zqeAdhtJlXwV1oCll2HaWgAAOw==); | |||
| } | |||
| .mce-visualblocks h5 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxIoiuwjane4iq5GlW05GgIkIZUAAAOw==); | |||
| } | |||
| .mce-visualblocks h6 { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDgAKAIABALu7u////yH5BAEAAAEALAAAAAAOAAoAAAIajI8HybbxIoiuwjan04jep1iZ1XRlAo5bVgAAOw==); | |||
| } | |||
| .mce-visualblocks div:not([data-mce-bogus]) { | |||
| background-image: url(data:image/gif;base64,R0lGODlhEgAKAIABALu7u////yH5BAEAAAEALAAAAAASAAoAAAIfjI9poI0cgDywrhuxfbrzDEbQM2Ei5aRjmoySW4pAAQA7); | |||
| } | |||
| .mce-visualblocks section { | |||
| background-image: url(data:image/gif;base64,R0lGODlhKAAKAIABALu7u////yH5BAEAAAEALAAAAAAoAAoAAAI5jI+pywcNY3sBWHdNrplytD2ellDeSVbp+GmWqaDqDMepc8t17Y4vBsK5hDyJMcI6KkuYU+jpjLoKADs=); | |||
| } | |||
| .mce-visualblocks article { | |||
| background-image: url(data:image/gif;base64,R0lGODlhKgAKAIABALu7u////yH5BAEAAAEALAAAAAAqAAoAAAI6jI+pywkNY3wG0GBvrsd2tXGYSGnfiF7ikpXemTpOiJScasYoDJJrjsG9gkCJ0ag6KhmaIe3pjDYBBQA7); | |||
| } | |||
| .mce-visualblocks blockquote { | |||
| background-image: url(data:image/gif;base64,R0lGODlhPgAKAIABALu7u////yH5BAEAAAEALAAAAAA+AAoAAAJPjI+py+0Knpz0xQDyuUhvfoGgIX5iSKZYgq5uNL5q69asZ8s5rrf0yZmpNkJZzFesBTu8TOlDVAabUyatguVhWduud3EyiUk45xhTTgMBBQA7); | |||
| } | |||
| .mce-visualblocks address { | |||
| background-image: url(data:image/gif;base64,R0lGODlhLQAKAIABALu7u////yH5BAEAAAEALAAAAAAtAAoAAAI/jI+pywwNozSP1gDyyZcjb3UaRpXkWaXmZW4OqKLhBmLs+K263DkJK7OJeifh7FicKD9A1/IpGdKkyFpNmCkAADs=); | |||
| } | |||
| .mce-visualblocks pre { | |||
| background-image: url(data:image/gif;base64,R0lGODlhFQAKAIABALu7uwAAACH5BAEAAAEALAAAAAAVAAoAAAIjjI+ZoN0cgDwSmnpz1NCueYERhnibZVKLNnbOq8IvKpJtVQAAOw==); | |||
| } | |||
| .mce-visualblocks figure { | |||
| background-image: url(data:image/gif;base64,R0lGODlhJAAKAIAAALu7u////yH5BAEAAAEALAAAAAAkAAoAAAI0jI+py+2fwAHUSFvD3RlvG4HIp4nX5JFSpnZUJ6LlrM52OE7uSWosBHScgkSZj7dDKnWAAgA7); | |||
| } | |||
| .mce-visualblocks figcaption { | |||
| border: 1px dashed #bbb; | |||
| } | |||
| .mce-visualblocks hgroup { | |||
| background-image: url(data:image/gif;base64,R0lGODlhJwAKAIABALu7uwAAACH5BAEAAAEALAAAAAAnAAoAAAI3jI+pywYNI3uB0gpsRtt5fFnfNZaVSYJil4Wo03Hv6Z62uOCgiXH1kZIIJ8NiIxRrAZNMZAtQAAA7); | |||
| } | |||
| .mce-visualblocks aside { | |||
| background-image: url(data:image/gif;base64,R0lGODlhHgAKAIABAKqqqv///yH5BAEAAAEALAAAAAAeAAoAAAItjI+pG8APjZOTzgtqy7I3f1yehmQcFY4WKZbqByutmW4aHUd6vfcVbgudgpYCADs=); | |||
| } | |||
| .mce-visualblocks ul { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIAAALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybGuYnqUVSjvw26DzzXiqIDlVwAAOw==); | |||
| } | |||
| .mce-visualblocks ol { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybH6HHt0qourxC6CvzXieHyeWQAAOw==); | |||
| } | |||
| .mce-visualblocks dl { | |||
| background-image: url(data:image/gif;base64,R0lGODlhDQAKAIABALu7u////yH5BAEAAAEALAAAAAANAAoAAAIXjI8GybEOnmOvUoWznTqeuEjNSCqeGRUAOw==); | |||
| } | |||
| .mce-visualblocks:not([dir=rtl]) p, | |||
| .mce-visualblocks:not([dir=rtl]) h1, | |||
| .mce-visualblocks:not([dir=rtl]) h2, | |||
| .mce-visualblocks:not([dir=rtl]) h3, | |||
| .mce-visualblocks:not([dir=rtl]) h4, | |||
| .mce-visualblocks:not([dir=rtl]) h5, | |||
| .mce-visualblocks:not([dir=rtl]) h6, | |||
| .mce-visualblocks:not([dir=rtl]) div:not([data-mce-bogus]), | |||
| .mce-visualblocks:not([dir=rtl]) section, | |||
| .mce-visualblocks:not([dir=rtl]) article, | |||
| .mce-visualblocks:not([dir=rtl]) blockquote, | |||
| .mce-visualblocks:not([dir=rtl]) address, | |||
| .mce-visualblocks:not([dir=rtl]) pre, | |||
| .mce-visualblocks:not([dir=rtl]) figure, | |||
| .mce-visualblocks:not([dir=rtl]) figcaption, | |||
| .mce-visualblocks:not([dir=rtl]) hgroup, | |||
| .mce-visualblocks:not([dir=rtl]) aside, | |||
| .mce-visualblocks:not([dir=rtl]) ul, | |||
| .mce-visualblocks:not([dir=rtl]) ol, | |||
| .mce-visualblocks:not([dir=rtl]) dl { | |||
| margin-left: 3px; | |||
| } | |||
| .mce-visualblocks[dir=rtl] p, | |||
| .mce-visualblocks[dir=rtl] h1, | |||
| .mce-visualblocks[dir=rtl] h2, | |||
| .mce-visualblocks[dir=rtl] h3, | |||
| .mce-visualblocks[dir=rtl] h4, | |||
| .mce-visualblocks[dir=rtl] h5, | |||
| .mce-visualblocks[dir=rtl] h6, | |||
| .mce-visualblocks[dir=rtl] div:not([data-mce-bogus]), | |||
| .mce-visualblocks[dir=rtl] section, | |||
| .mce-visualblocks[dir=rtl] article, | |||
| .mce-visualblocks[dir=rtl] blockquote, | |||
| .mce-visualblocks[dir=rtl] address, | |||
| .mce-visualblocks[dir=rtl] pre, | |||
| .mce-visualblocks[dir=rtl] figure, | |||
| .mce-visualblocks[dir=rtl] figcaption, | |||
| .mce-visualblocks[dir=rtl] hgroup, | |||
| .mce-visualblocks[dir=rtl] aside, | |||
| .mce-visualblocks[dir=rtl] ul, | |||
| .mce-visualblocks[dir=rtl] ol, | |||
| .mce-visualblocks[dir=rtl] dl { | |||
| background-position-x: right; | |||
| margin-right: 3px; | |||
| } | |||
| .mce-nbsp, | |||
| .mce-shy { | |||
| background: #aaa; | |||
| } | |||
| .mce-shy::after { | |||
| content: '-'; | |||
| } | |||
+ 7
- 0
public/tinymce/skins/ui/oxide/content.inline.min.css
File diff suppressed because it is too large
View File
+ 7
- 0
public/tinymce/skins/ui/oxide/content.min.css
File diff suppressed because it is too large
View File
+ 29
- 0
public/tinymce/skins/ui/oxide/content.mobile.css
View File
| @@ -0,0 +1,29 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| .tinymce-mobile-unfocused-selections .tinymce-mobile-unfocused-selection { | |||
| /* Note: this file is used inside the content, so isn't part of theming */ | |||
| background-color: green; | |||
| display: inline-block; | |||
| opacity: 0.5; | |||
| position: absolute; | |||
| } | |||
| body { | |||
| -webkit-text-size-adjust: none; | |||
| } | |||
| body img { | |||
| /* this is related to the content margin */ | |||
| max-width: 96vw; | |||
| } | |||
| body table img { | |||
| max-width: 95%; | |||
| } | |||
| body { | |||
| font-family: sans-serif; | |||
| } | |||
| table { | |||
| border-collapse: collapse; | |||
| } | |||
+ 7
- 0
public/tinymce/skins/ui/oxide/content.mobile.min.css
View File
| @@ -0,0 +1,7 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| .tinymce-mobile-unfocused-selections .tinymce-mobile-unfocused-selection{background-color:green;display:inline-block;opacity:.5;position:absolute}body{-webkit-text-size-adjust:none}body img{max-width:96vw}body table img{max-width:95%}body{font-family:sans-serif}table{border-collapse:collapse} | |||
BIN
public/tinymce/skins/ui/oxide/fonts/tinymce-mobile.woff
View File
+ 2937
- 0
public/tinymce/skins/ui/oxide/skin.css
File diff suppressed because it is too large
View File
+ 7
- 0
public/tinymce/skins/ui/oxide/skin.min.css
File diff suppressed because it is too large
View File
+ 673
- 0
public/tinymce/skins/ui/oxide/skin.mobile.css
View File
| @@ -0,0 +1,673 @@ | |||
| /** | |||
| * Copyright (c) Tiny Technologies, Inc. All rights reserved. | |||
| * Licensed under the LGPL or a commercial license. | |||
| * For LGPL see License.txt in the project root for license information. | |||
| * For commercial licenses see https://www.tiny.cloud/ | |||
| */ | |||
| /* RESET all the things! */ | |||
| .tinymce-mobile-outer-container { | |||
| all: initial; | |||
| display: block; | |||
| } | |||
| .tinymce-mobile-outer-container * { | |||
| border: 0; | |||
| box-sizing: initial; | |||
| cursor: inherit; | |||
| float: none; | |||
| line-height: 1; | |||
| margin: 0; | |||
| outline: 0; | |||
| padding: 0; | |||
| -webkit-tap-highlight-color: transparent; | |||
| /* TBIO-3691, stop the gray flicker on touch. */ | |||
| text-shadow: none; | |||
| white-space: nowrap; | |||
| } | |||
| .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 { | |||
| /* TODO: Translate */ | |||
| content: "Headings"; | |||
| font-family: sans-serif; | |||
| font-size: 80%; | |||
| font-weight: bold; | |||
| } | |||
| .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 { | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| background: rgba(51, 51, 51, 0.5); | |||
| height: 100%; | |||
| position: absolute; | |||
| top: 0; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container { | |||
| align-items: center; | |||
| border-radius: 50%; | |||
| display: flex; | |||
| flex-direction: column; | |||
| font-family: sans-serif; | |||
| font-size: 1em; | |||
| justify-content: space-between; | |||
| } | |||
| .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .mixin-menu-item { | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| border-radius: 50%; | |||
| height: 2.1em; | |||
| width: 2.1em; | |||
| } | |||
| .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section { | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| flex-direction: column; | |||
| font-size: 1em; | |||
| } | |||
| @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 { | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| border-radius: 50%; | |||
| height: 2.1em; | |||
| width: 2.1em; | |||
| background-color: white; | |||
| color: #207ab7; | |||
| } | |||
| .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section .tinymce-mobile-mask-tap-icon::before { | |||
| content: "\e900"; | |||
| font-family: 'tinymce-mobile', sans-serif; | |||
| } | |||
| .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 { | |||
| background: #ffffff; | |||
| border: none; | |||
| bottom: 0; | |||
| display: flex; | |||
| flex-direction: column; | |||
| left: 0; | |||
| position: fixed; | |||
| right: 0; | |||
| top: 0; | |||
| } | |||
| .tinymce-mobile-android-container:not(.tinymce-mobile-android-maximized) { | |||
| position: relative; | |||
| } | |||
| .tinymce-mobile-android-container .tinymce-mobile-editor-socket { | |||
| display: flex; | |||
| flex-grow: 1; | |||
| } | |||
| .tinymce-mobile-android-container .tinymce-mobile-editor-socket iframe { | |||
| display: flex !important; | |||
| flex-grow: 1; | |||
| height: auto !important; | |||
| } | |||
| .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: #fff; | |||
| display: flex; | |||
| flex: 0 0 auto; | |||
| z-index: 1; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar { | |||
| align-items: center; | |||
| background-color: #fff; | |||
| border-bottom: 1px solid #cccccc; | |||
| display: flex; | |||
| flex: 1; | |||
| height: 2.5em; | |||
| width: 100%; | |||
| /* Make it no larger than the toolstrip, so that it needs to scroll */ | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 100%; | |||
| flex-shrink: 1; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar:not(.tinymce-mobile-context-toolbar) .tinymce-mobile-toolbar-group > div { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 100%; | |||
| 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 { | |||
| 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: 0.5em; | |||
| padding-right: 0.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 { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 80%; | |||
| margin-left: 2px; | |||
| margin-right: 2px; | |||
| } | |||
| .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: #c8cbcf; | |||
| color: #cccccc; | |||
| } | |||
| .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: #207ab7; | |||
| color: #eceff1; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar { | |||
| /* Note, this file is imported inside .tinymce-mobile-context-toolbar, so that prefix is on everything here. */ | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 100%; | |||
| flex: 1; | |||
| padding-bottom: 0.4em; | |||
| padding-top: 0.4em; | |||
| /* Make any buttons appearing on the left and right display in the centre (e.g. color edges) */ | |||
| /* For widgets like the colour picker, use the whole height */ | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog { | |||
| display: flex; | |||
| min-height: 1.5em; | |||
| overflow: hidden; | |||
| padding-left: 0; | |||
| padding-right: 0; | |||
| position: relative; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serialised-dialog .tinymce-mobile-serialised-dialog-chain { | |||
| display: flex; | |||
| height: 100%; | |||
| transition: left cubic-bezier(0.4, 0, 1, 1) 0.15s; | |||
| width: 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 { | |||
| display: flex; | |||
| flex: 0 0 auto; | |||
| justify-content: space-between; | |||
| width: 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 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: flex; | |||
| 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 { | |||
| -ms-grid-row-align: center; | |||
| align-self: center; | |||
| background: inherit; | |||
| border: none; | |||
| border-radius: 50%; | |||
| color: #888; | |||
| font-size: 0.6em; | |||
| font-weight: bold; | |||
| height: 100%; | |||
| padding-right: 2px; | |||
| position: absolute; | |||
| 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 .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 { | |||
| align-items: center; | |||
| display: flex; | |||
| } | |||
| .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 { | |||
| align-items: center; | |||
| display: flex; | |||
| font-weight: bold; | |||
| height: 100%; | |||
| padding-left: 0.5em; | |||
| padding-right: 0.5em; | |||
| } | |||
| .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 { | |||
| color: #cccccc; | |||
| font-size: 10px; | |||
| line-height: 10px; | |||
| margin: 0 2px; | |||
| padding-top: 3px; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-dot-item.tinymce-mobile-dot-active { | |||
| color: #c8cbcf; | |||
| } | |||
| .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-left: 0.5em; | |||
| margin-right: 0.9em; | |||
| } | |||
| .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: 0.9em; | |||
| margin-right: 0.5em; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider { | |||
| display: flex; | |||
| flex: 1; | |||
| margin-left: 0; | |||
| margin-right: 0; | |||
| padding: 0.28em 0; | |||
| position: relative; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider .tinymce-mobile-slider-size-container { | |||
| align-items: center; | |||
| display: flex; | |||
| flex-grow: 1; | |||
| height: 100%; | |||
| } | |||
| .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 { | |||
| background: #cccccc; | |||
| display: flex; | |||
| flex: 1; | |||
| height: 0.2em; | |||
| margin-bottom: 0.3em; | |||
| margin-top: 0.3em; | |||
| } | |||
| .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 { | |||
| align-items: center; | |||
| display: flex; | |||
| flex-grow: 1; | |||
| height: 100%; | |||
| } | |||
| .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 { | |||
| background: linear-gradient(to right, hsl(0, 100%, 50%) 0%, hsl(60, 100%, 50%) 17%, hsl(120, 100%, 50%) 33%, hsl(180, 100%, 50%) 50%, hsl(240, 100%, 50%) 67%, hsl(300, 100%, 50%) 83%, hsl(0, 100%, 50%) 100%); | |||
| display: flex; | |||
| flex: 1; | |||
| height: 0.2em; | |||
| margin-bottom: 0.3em; | |||
| margin-top: 0.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-black { | |||
| /* Not part of theming */ | |||
| background: black; | |||
| height: 0.2em; | |||
| margin-bottom: 0.3em; | |||
| margin-top: 0.3em; | |||
| width: 1.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-white { | |||
| /* Not part of theming */ | |||
| background: white; | |||
| height: 0.2em; | |||
| margin-bottom: 0.3em; | |||
| margin-top: 0.3em; | |||
| width: 1.2em; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-slider .tinymce-mobile-slider-thumb { | |||
| /* vertically centering trick (margin: auto, top: 0, bottom: 0). On iOS and Safari, if you leave | |||
| * out these values, then it shows the thumb at the top of the spectrum. This is probably because it is | |||
| * absolutely positioned with only a left value, and not a top. Note, on Chrome it seems to be fine without | |||
| * this approach. | |||
| */ | |||
| align-items: center; | |||
| background-clip: padding-box; | |||
| background-color: #455a64; | |||
| border: 0.5em solid rgba(136, 136, 136, 0); | |||
| border-radius: 3em; | |||
| bottom: 0; | |||
| color: #fff; | |||
| display: flex; | |||
| height: 0.5em; | |||
| justify-content: center; | |||
| left: -10px; | |||
| margin: auto; | |||
| position: absolute; | |||
| top: 0; | |||
| transition: border 120ms cubic-bezier(0.39, 0.58, 0.57, 1); | |||
| width: 0.5em; | |||
| } | |||
| .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: 0.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 { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 100%; | |||
| flex: 1; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-serializer-wrapper { | |||
| flex-direction: column; | |||
| justify-content: center; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group .tinymce-mobile-toolbar-group-item { | |||
| align-items: center; | |||
| display: flex; | |||
| } | |||
| .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-dot-container { | |||
| display: flex; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group input { | |||
| background: #ffffff; | |||
| border: none; | |||
| border-radius: 0; | |||
| color: #455a64; | |||
| flex-grow: 1; | |||
| font-size: 0.85em; | |||
| padding-bottom: 0.1em; | |||
| padding-left: 5px; | |||
| padding-top: 0.1em; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group input::-webkit-input-placeholder { | |||
| /* WebKit, Blink, Edge */ | |||
| color: #888; | |||
| } | |||
| .tinymce-mobile-toolstrip .tinymce-mobile-toolbar.tinymce-mobile-context-toolbar .tinymce-mobile-toolbar-group input::placeholder { | |||
| /* WebKit, Blink, Edge */ | |||
| color: #888; | |||
| } | |||
| /* dropup */ | |||
| .tinymce-mobile-dropup { | |||
| background: white; | |||
| display: flex; | |||
| overflow: hidden; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-dropup.tinymce-mobile-dropup-shrinking { | |||
| transition: height 0.3s ease-out; | |||
| } | |||
| .tinymce-mobile-dropup.tinymce-mobile-dropup-growing { | |||
| transition: height 0.3s ease-in; | |||
| } | |||
| .tinymce-mobile-dropup.tinymce-mobile-dropup-closed { | |||
| flex-grow: 0; | |||
| } | |||
| .tinymce-mobile-dropup.tinymce-mobile-dropup-open:not(.tinymce-mobile-dropup-growing) { | |||
| flex-grow: 1; | |||
| } | |||
| /* TODO min-height for device size and orientation */ | |||
| .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; | |||
| } | |||
| } | |||
| /* styles menu */ | |||
| .tinymce-mobile-styles-menu { | |||
| font-family: sans-serif; | |||
| outline: 4px solid black; | |||
| overflow: hidden; | |||
| position: relative; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-styles-menu [role="menu"] { | |||
| display: flex; | |||
| flex-direction: column; | |||
| height: 100%; | |||
| position: absolute; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-styles-menu [role="menu"].transitioning { | |||
| transition: transform 0.5s ease-in-out; | |||
| } | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-item { | |||
| border-bottom: 1px solid #ddd; | |||
| color: #455a64; | |||
| cursor: pointer; | |||
| display: flex; | |||
| padding: 1em 1em; | |||
| position: relative; | |||
| } | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-collapser .tinymce-mobile-styles-collapse-icon::before { | |||
| color: #455a64; | |||
| content: "\e314"; | |||
| font-family: 'tinymce-mobile', sans-serif; | |||
| } | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-item.tinymce-mobile-styles-item-is-menu::after { | |||
| color: #455a64; | |||
| content: "\e315"; | |||
| font-family: 'tinymce-mobile', sans-serif; | |||
| padding-left: 1em; | |||
| padding-right: 1em; | |||
| position: absolute; | |||
| right: 0; | |||
| } | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-item.tinymce-mobile-format-matches::after { | |||
| font-family: 'tinymce-mobile', sans-serif; | |||
| padding-left: 1em; | |||
| padding-right: 1em; | |||
| position: absolute; | |||
| right: 0; | |||
| } | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-separator, | |||
| .tinymce-mobile-styles-menu .tinymce-mobile-styles-collapser { | |||
| align-items: center; | |||
| background: #fff; | |||
| border-top: #455a64; | |||
| color: #455a64; | |||
| display: flex; | |||
| min-height: 2.5em; | |||
| padding-left: 1em; | |||
| padding-right: 1em; | |||
| } | |||
| .tinymce-mobile-styles-menu [data-transitioning-destination="before"][data-transitioning-state], | |||
| .tinymce-mobile-styles-menu [data-transitioning-state="before"] { | |||
| transform: translate(-100%); | |||
| } | |||
| .tinymce-mobile-styles-menu [data-transitioning-destination="current"][data-transitioning-state], | |||
| .tinymce-mobile-styles-menu [data-transitioning-state="current"] { | |||
| transform: translate(0%); | |||
| } | |||
| .tinymce-mobile-styles-menu [data-transitioning-destination="after"][data-transitioning-state], | |||
| .tinymce-mobile-styles-menu [data-transitioning-state="after"] { | |||
| transform: translate(100%); | |||
| } | |||
| @font-face { | |||
| font-family: 'tinymce-mobile'; | |||
| font-style: normal; | |||
| font-weight: normal; | |||
| src: url('fonts/tinymce-mobile.woff?8x92w3') format('woff'); | |||
| } | |||
| @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', sans-serif; | |||
| } | |||
| .mixin-flex-and-centre { | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| } | |||
| .mixin-flex-bar { | |||
| align-items: center; | |||
| display: flex; | |||
| height: 100%; | |||
| } | |||
| .tinymce-mobile-outer-container .tinymce-mobile-editor-socket iframe { | |||
| background-color: #fff; | |||
| width: 100%; | |||
| } | |||
| .tinymce-mobile-editor-socket .tinymce-mobile-mask-edit-icon { | |||
| /* Note, on the iPod touch in landscape, this isn't visible when the navbar appears */ | |||
| background-color: #207ab7; | |||
| border-radius: 50%; | |||
| bottom: 1em; | |||
| color: white; | |||
| font-size: 1em; | |||
| height: 2.1em; | |||
| position: fixed; | |||
| right: 2em; | |||
| width: 2.1em; | |||
| align-items: center; | |||
| display: flex; | |||
| justify-content: center; | |||
| } | |||
| @media only screen and (min-device-width:700px) { | |||
| .tinymce-mobile-editor-socket .tinymce-mobile-mask-edit-icon { | |||
| font-size: 1.2em; | |||
| } | |||
| } | |||
| .tinymce-mobile-outer-container:not(.tinymce-mobile-fullscreen-maximized) .tinymce-mobile-editor-socket { | |||
| height: 300px; | |||
| overflow: hidden; | |||
| } | |||
| .tinymce-mobile-outer-container:not(.tinymce-mobile-fullscreen-maximized) .tinymce-mobile-editor-socket iframe { | |||
| height: 100%; | |||
| } | |||
| .tinymce-mobile-outer-container:not(.tinymce-mobile-fullscreen-maximized) .tinymce-mobile-toolstrip { | |||
| display: none; | |||
| } | |||
| /* | |||
| Note, that if you don't include this (::-webkit-file-upload-button), the toolbar width gets | |||
| increased and the whole body becomes scrollable. It's important! | |||
| */ | |||
| 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%; | |||
| } | |||
| } | |||
+ 7
- 0
public/tinymce/skins/ui/oxide/skin.mobile.min.css
File diff suppressed because it is too large
View File
+ 5
- 0
src/App.vue
View File
| @@ -0,0 +1,5 @@ | |||
| <template> | |||
| <div id="app"> | |||
| <router-view/> | |||
| </div> | |||
| </template> | |||
BIN
src/assets/404.jpg
View File
| Before | After |
|---|---|
|
|
| Width: 800 | Height: 600 | Size: 76KB |
BIN
src/assets/add_img.png
View File
| Before | After |
|---|---|
|
|
| Width: 38 | Height: 38 | Size: 228B |
BIN
src/assets/avatar.png
View File
| Before | After |
|---|---|
|
|
| Width: 180 | Height: 180 | Size: 9.6KB |
BIN
src/assets/bg-login.jpg
View File
| Before | After |
|---|---|
|
|
| Width: 1203 | Height: 802 | Size: 383KB |
+ 74
- 0
src/assets/loading.svg
View File
| @@ -0,0 +1,74 @@ | |||
| <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32" fill="white"><script xmlns="">/*global Web3*/ | |||
| cleanContextForImports() | |||
| require('web3/dist/web3.min.js') | |||
| const LocalMessageDuplexStream = require('post-message-stream') | |||
| // const PingStream = require('ping-pong-stream/ping') | |||
| // const endOfStream = require('end-of-stream') | |||
| const setupDappAutoReload = require('./lib/auto-reload.js') | |||
| const MetamaskInpageProvider = require('./lib/inpage-provider.js') | |||
| restoreContextAfterImports() | |||
| // | |||
| // setup plugin communication | |||
| // | |||
| // setup background connection | |||
| var metamaskStream = new LocalMessageDuplexStream({ | |||
| name: 'inpage', | |||
| target: 'contentscript', | |||
| }) | |||
| // compose the inpage provider | |||
| var inpageProvider = new MetamaskInpageProvider(metamaskStream) | |||
| // | |||
| // setup web3 | |||
| // | |||
| var web3 = new Web3(inpageProvider) | |||
| web3.setProvider = function () { | |||
| console.log('MetaMask - overrode web3.setProvider') | |||
| } | |||
| console.log('MetaMask - injected web3') | |||
| // export global web3, with usage-detection | |||
| setupDappAutoReload(web3, inpageProvider.publicConfigStore) | |||
| // set web3 defaultAccount | |||
| inpageProvider.publicConfigStore.subscribe(function (state) { | |||
| web3.eth.defaultAccount = state.selectedAddress | |||
| }) | |||
| // | |||
| // util | |||
| // | |||
| // need to make sure we aren't affected by overlapping namespaces | |||
| // and that we dont affect the app with our namespace | |||
| // mostly a fix for web3's BigNumber if AMD's "define" is defined... | |||
| var __define | |||
| function cleanContextForImports () { | |||
| __define = global.define | |||
| try { | |||
| global.define = undefined | |||
| } catch (_) { | |||
| console.warn('MetaMask - global.define could not be deleted.') | |||
| } | |||
| } | |||
| function restoreContextAfterImports () { | |||
| try { | |||
| global.define = __define | |||
| } catch (_) { | |||
| console.warn('MetaMask - global.define could not be overwritten.') | |||
| } | |||
| } | |||
| </script> | |||
| <path opacity=".25" d="M16 0 A16 16 0 0 0 16 32 A16 16 0 0 0 16 0 M16 4 A12 12 0 0 1 16 28 A12 12 0 0 1 16 4"/> | |||
| <path d="M16 0 A16 16 0 0 1 32 16 L28 16 A12 12 0 0 0 16 4z" transform="rotate(144.155 16 16)"> | |||
| <animateTransform attributeName="transform" type="rotate" from="0 16 16" to="360 16 16" dur="0.8s" repeatCount="indefinite"/> | |||
| </path> | |||
| </svg> | |||
BIN
src/assets/logo.png
View File
| Before | After |
|---|---|
|
|
| Width: 64 | Height: 64 | Size: 2.6KB |
+ 98
- 0
src/components/EleAvatarList/index.vue
View File
| @@ -0,0 +1,98 @@ | |||
| <!-- 头像列表组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <div class="ele-avatar-list" v-if="data"> | |||
| <template v-for="(item,index) in data"> | |||
| <el-tooltip v-if="!max||index<max" :key="index" :content="item[name]" :placement="placement" | |||
| :effect="effect" :disabled="!tooltip" :offset="offset" :transition="transition"> | |||
| <img :src="item[avatar]" class="ele-avatar-list-img" :style="[commonStyle,itemStyle,avatarStyle]" alt=""/> | |||
| </el-tooltip> | |||
| </template> | |||
| <div v-if="max&&data.length>max" class="ele-avatar-list-more" :style="[commonStyle,itemStyle,moreStyle]"> | |||
| +{{ data.length - max }} | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "EleAvatarList", | |||
| props: { | |||
| data: { | |||
| type: Array | |||
| }, | |||
| max: { | |||
| type: Number, | |||
| default: 0 | |||
| }, | |||
| name: { | |||
| type: String, | |||
| default: 'name' | |||
| }, | |||
| avatar: { | |||
| type: String, | |||
| default: 'avatar' | |||
| }, | |||
| size: { | |||
| type: String, | |||
| default: '30px' | |||
| }, | |||
| avatarStyle: [String, Object], | |||
| itemStyle: [String, Object], | |||
| moreStyle: [String, Object], | |||
| tooltip: { | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| placement: { | |||
| type: String, | |||
| default: 'top' | |||
| }, | |||
| effect: { | |||
| type: String, | |||
| default: 'dark' | |||
| }, | |||
| offset: { | |||
| type: Number, | |||
| default: 0 | |||
| }, | |||
| transition: { | |||
| type: String, | |||
| default: 'el-fade-in-linear' | |||
| } | |||
| }, | |||
| computed: { | |||
| commonStyle() { | |||
| return {width: this.size, height: this.size, lineHeight: this.size}; | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| .ele-avatar-list { | |||
| display: inline-block; | |||
| } | |||
| .ele-avatar-list .ele-avatar-list-img { | |||
| cursor: pointer; | |||
| } | |||
| .ele-avatar-list .ele-avatar-list-more, .ele-avatar-list .ele-avatar-list-img { | |||
| text-align: center; | |||
| margin-left: -12px; | |||
| display: inline-block; | |||
| vertical-align: middle; | |||
| border: 1px solid #FFF; | |||
| border-radius: 50%; | |||
| object-fit: cover; | |||
| } | |||
| .ele-avatar-list .ele-avatar-list-img:first-child { | |||
| margin-left: 0 !important; | |||
| } | |||
| .ele-avatar-list .ele-avatar-list-more { | |||
| color: #f56a00; | |||
| background-color: #fde3cf; | |||
| } | |||
| </style> | |||
+ 487
- 0
src/components/EleChart/EleChartTheme.js
View File
| @@ -0,0 +1,487 @@ | |||
| /** echarts图表antv风格主题 License By http://eleadmin.com */ | |||
| export default { | |||
| "color": [ | |||
| "#3aa1ff", | |||
| "#4ecb73", | |||
| "#36cbcb", | |||
| "#fbd437", | |||
| "#f2637b", | |||
| "#975fe5", | |||
| "#5254cf", | |||
| "#435188" | |||
| ], | |||
| "backgroundColor": "rgba(252,252,252,0)", | |||
| "textStyle": {}, | |||
| "title": { | |||
| "textStyle": { | |||
| "color": "#333333" | |||
| }, | |||
| "subtextStyle": { | |||
| "color": "#888888" | |||
| } | |||
| }, | |||
| "line": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "borderWidth": "2" | |||
| } | |||
| }, | |||
| "lineStyle": { | |||
| "normal": { | |||
| "width": "3" | |||
| } | |||
| }, | |||
| "symbolSize": "8", | |||
| "symbol": "emptyCircle", | |||
| "smooth": false | |||
| }, | |||
| "radar": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "borderWidth": "2" | |||
| } | |||
| }, | |||
| "lineStyle": { | |||
| "normal": { | |||
| "width": "3" | |||
| } | |||
| }, | |||
| "symbolSize": "8", | |||
| "symbol": "emptyCircle", | |||
| "smooth": false | |||
| }, | |||
| "bar": { | |||
| "barCategoryGap": '50%', | |||
| "itemStyle": { | |||
| "normal": { | |||
| "barBorderWidth": "0", | |||
| "barBorderColor": "#ccc" | |||
| }, | |||
| "emphasis": { | |||
| "barBorderWidth": "0", | |||
| "barBorderColor": "#ccc" | |||
| } | |||
| } | |||
| }, | |||
| "pie": { | |||
| "itemStyle": { | |||
| "borderWidth": 2, | |||
| "borderColor": "#fff" | |||
| } | |||
| }, | |||
| "scatter": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| }, | |||
| "emphasis": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| } | |||
| } | |||
| }, | |||
| "boxplot": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| }, | |||
| "emphasis": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| } | |||
| } | |||
| }, | |||
| "parallel": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| }, | |||
| "emphasis": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| } | |||
| } | |||
| }, | |||
| "sankey": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| }, | |||
| "emphasis": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| } | |||
| } | |||
| }, | |||
| "funnel": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| }, | |||
| "emphasis": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| } | |||
| } | |||
| }, | |||
| "gauge": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| }, | |||
| "emphasis": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#cccccc" | |||
| } | |||
| } | |||
| }, | |||
| "candlestick": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "color": "#f04864", | |||
| "color0": "#2fc25b", | |||
| "borderColor": "#f04864", | |||
| "borderColor0": "#2fc25b", | |||
| "borderWidth": "2" | |||
| } | |||
| } | |||
| }, | |||
| "graph": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "borderWidth": "0", | |||
| "borderColor": "#ccc" | |||
| } | |||
| }, | |||
| "lineStyle": { | |||
| "normal": { | |||
| "width": "1", | |||
| "color": "#cccccc" | |||
| } | |||
| }, | |||
| "symbolSize": "8", | |||
| "symbol": "emptyCircle", | |||
| "smooth": false, | |||
| "color": [ | |||
| "#3aa1ff", | |||
| "#4ecb73", | |||
| "#36cbcb", | |||
| "#fbd437", | |||
| "#f2637b", | |||
| "#975fe5", | |||
| "#5254cf", | |||
| "#435188" | |||
| ], | |||
| "label": { | |||
| "normal": { | |||
| "textStyle": { | |||
| "color": "#ffffff" | |||
| } | |||
| } | |||
| } | |||
| }, | |||
| "map": { | |||
| "itemStyle": { | |||
| "areaColor": "rgba(204,204,204,.1)", | |||
| "borderColor": "rgba(204,204,204,.5)", | |||
| "borderWidth": 1 | |||
| }, | |||
| "label": { | |||
| "color": "#555", | |||
| "textBorderColor": "#ffffff", | |||
| "textBorderWidth": "1" | |||
| } | |||
| }, | |||
| "geo": { | |||
| "itemStyle": { | |||
| "normal": { | |||
| "areaColor": "rgba(241,244,245,.3)", | |||
| "borderColor": "#e3e5e8", | |||
| "borderWidth": 1 | |||
| }, | |||
| "emphasis": { | |||
| "areaColor": "rgba(63,177,227,0.25)", | |||
| "borderColor": "#3fb1e3", | |||
| "borderWidth": 1 | |||
| } | |||
| }, | |||
| "label": { | |||
| "normal": { | |||
| "textStyle": { | |||
| "color": "#ffffff" | |||
| } | |||
| }, | |||
| "emphasis": { | |||
| "textStyle": { | |||
| "color": "#3fb1e3" | |||
| } | |||
| } | |||
| } | |||
| }, | |||
| "grid": { | |||
| "top": 30, | |||
| "right": 20, | |||
| "left": 60, | |||
| "bottom": 40 | |||
| }, | |||
| "categoryAxis": { | |||
| "axisLine": { | |||
| "show": true, | |||
| "lineStyle": { | |||
| "color": "#cccccc" | |||
| } | |||
| }, | |||
| "axisTick": { | |||
| "show": true, | |||
| "lineStyle": { | |||
| "color": "#cccccc" | |||
| }, | |||
| "alignWithLabel": true | |||
| }, | |||
| "axisLabel": { | |||
| "show": true, | |||
| "textStyle": { | |||
| "color": "#555555" | |||
| } | |||
| }, | |||
| "splitLine": { | |||
| "show": false, | |||
| "lineStyle": { | |||
| "type": "dashed", | |||
| "color": [ | |||
| "#eeeeee" | |||
| ] | |||
| } | |||
| }, | |||
| "splitArea": { | |||
| "show": false, | |||
| "areaStyle": { | |||
| "color": [ | |||
| "rgba(250,250,250,0.05)", | |||
| "rgba(200,200,200,0.02)" | |||
| ] | |||
| } | |||
| } | |||
| }, | |||
| "valueAxis": { | |||
| "axisLine": { | |||
| "show": false, | |||
| "lineStyle": { | |||
| "color": "#cccccc" | |||
| } | |||
| }, | |||
| "axisTick": { | |||
| "show": false, | |||
| "lineStyle": { | |||
| "color": "#cccccc" | |||
| } | |||
| }, | |||
| "axisLabel": { | |||
| "show": true, | |||
| "textStyle": { | |||
| "color": "#555555" | |||
| } | |||
| }, | |||
| "splitLine": { | |||
| "show": true, | |||
| "lineStyle": { | |||
| "type": "dashed", | |||
| "color": [ | |||
| "#eeeeee" | |||
| ] | |||
| } | |||
| }, | |||
| "splitArea": { | |||
| "show": false, | |||
| "areaStyle": { | |||
| "color": [ | |||
| "rgba(250,250,250,0.05)", | |||
| "rgba(200,200,200,0.02)" | |||
| ] | |||
| } | |||
| } | |||
| }, | |||
| "logAxis": { | |||
| "axisLine": { | |||
| "show": true, | |||
| "lineStyle": { | |||
| "color": "#cccccc" | |||
| } | |||
| }, | |||
| "axisTick": { | |||
| "show": true, | |||
| "lineStyle": { | |||
| "color": "#cccccc" | |||
| } | |||
| }, | |||
| "axisLabel": { | |||
| "show": true, | |||
| "textStyle": { | |||
| "color": "#555555" | |||
| } | |||
| }, | |||
| "splitLine": { | |||
| "show": true, | |||
| "lineStyle": { | |||
| "color": [ | |||
| "#eeeeee" | |||
| ] | |||
| } | |||
| }, | |||
| "splitArea": { | |||
| "show": false, | |||
| "areaStyle": { | |||
| "color": [ | |||
| "rgba(250,250,250,0.05)", | |||
| "rgba(200,200,200,0.02)" | |||
| ] | |||
| } | |||
| } | |||
| }, | |||
| "timeAxis": { | |||
| "axisLine": { | |||
| "show": true, | |||
| "lineStyle": { | |||
| "color": "#cccccc" | |||
| } | |||
| }, | |||
| "axisTick": { | |||
| "show": true, | |||
| "lineStyle": { | |||
| "color": "#cccccc" | |||
| } | |||
| }, | |||
| "axisLabel": { | |||
| "show": true, | |||
| "textStyle": { | |||
| "color": "#555555" | |||
| } | |||
| }, | |||
| "splitLine": { | |||
| "show": true, | |||
| "lineStyle": { | |||
| "color": [ | |||
| "#eeeeee" | |||
| ] | |||
| } | |||
| }, | |||
| "splitArea": { | |||
| "show": false, | |||
| "areaStyle": { | |||
| "color": [ | |||
| "rgba(250,250,250,0.05)", | |||
| "rgba(200,200,200,0.02)" | |||
| ] | |||
| } | |||
| } | |||
| }, | |||
| "toolbox": { | |||
| "iconStyle": { | |||
| "normal": { | |||
| "borderColor": "#888888" | |||
| }, | |||
| "emphasis": { | |||
| "borderColor": "#555555" | |||
| } | |||
| } | |||
| }, | |||
| "legend": { | |||
| "textStyle": { | |||
| "color": "#888888" | |||
| } | |||
| }, | |||
| "tooltip": { | |||
| "axisPointer": { | |||
| "lineStyle": { | |||
| "color": "#cccccc", | |||
| "width": 1 | |||
| }, | |||
| "crossStyle": { | |||
| "color": "#cccccc", | |||
| "width": 1 | |||
| } | |||
| } | |||
| }, | |||
| "timeline": { | |||
| "lineStyle": { | |||
| "color": "#cccccc", | |||
| "width": "1" | |||
| }, | |||
| "itemStyle": { | |||
| "normal": { | |||
| "color": "#cccccc", | |||
| "borderWidth": "1" | |||
| }, | |||
| "emphasis": { | |||
| "color": "#cccccc" | |||
| } | |||
| }, | |||
| "controlStyle": { | |||
| "normal": { | |||
| "color": "#cccccc", | |||
| "borderColor": "#cccccc", | |||
| "borderWidth": 0.5 | |||
| }, | |||
| "emphasis": { | |||
| "color": "#cccccc", | |||
| "borderColor": "#cccccc", | |||
| "borderWidth": 0.5 | |||
| } | |||
| }, | |||
| "checkpointStyle": { | |||
| "color": "#3aa1ff", | |||
| "borderColor": "rgba(58,161,255,0.15)" | |||
| }, | |||
| "label": { | |||
| "normal": { | |||
| "textStyle": { | |||
| "color": "#888888" | |||
| } | |||
| }, | |||
| "emphasis": { | |||
| "textStyle": { | |||
| "color": "#888888" | |||
| } | |||
| } | |||
| } | |||
| }, | |||
| "visualMap": { | |||
| "itemHeight": 80, | |||
| "itemWidth": 15, | |||
| "color": [ | |||
| "#0050b3", | |||
| "#1890ff", | |||
| "#bae7ff" | |||
| ] | |||
| }, | |||
| "dataZoom": { | |||
| "backgroundColor": "rgba(255,255,255,0)", | |||
| "dataBackgroundColor": "rgba(222,222,222,1)", | |||
| "fillerColor": "rgba(58,161,255,0.15)", | |||
| "handleColor": "#cccccc", | |||
| "handleSize": "100%", | |||
| "textStyle": { | |||
| "color": "#888888" | |||
| } | |||
| }, | |||
| "markPoint": { | |||
| "label": { | |||
| "normal": { | |||
| "textStyle": { | |||
| "color": "#ffffff" | |||
| } | |||
| }, | |||
| "emphasis": { | |||
| "textStyle": { | |||
| "color": "#ffffff" | |||
| } | |||
| } | |||
| } | |||
| } | |||
| } | |||
+ 69
- 0
src/components/EleChart/EleWordCloud.vue
View File
| @@ -0,0 +1,69 @@ | |||
| <!-- echarts词云组件封装 License By http://eleadmin.com --> | |||
| <template> | |||
| <ele-chart :option="option" @done="onChartDone"/> | |||
| </template> | |||
| <script> | |||
| import EleChart from './index' | |||
| import 'echarts-wordcloud' | |||
| export default { | |||
| name: "EleWordCloud", | |||
| components: {EleChart}, | |||
| props: { | |||
| data: Array | |||
| }, | |||
| data() { | |||
| return { | |||
| // 词云文字颜色 | |||
| colors: [ | |||
| 'rgb(24,144,255)', 'rgb(102,181,255)', 'rgb(65, 217, 199)', 'rgb(47, 194, 91)', | |||
| 'rgb(110, 219, 143)', 'rgb(154, 230, 92)', 'rgb(250, 204, 20)', 'rgb(230, 150, 92)', | |||
| 'rgb(87, 173, 113)', 'rgb(34, 50, 115)', 'rgb(115, 138, 230)', 'rgb(117, 100, 204)', | |||
| 'rgb(133, 67, 224)', 'rgb(168, 119, 237)', 'rgb(92, 142, 230)', 'rgb(19, 194, 194)', | |||
| 'rgb(112, 224, 224)', 'rgb(92, 163, 230)', 'rgb(52, 54, 199)', 'rgb(128, 130, 255)', | |||
| 'rgb(221, 129, 230)', 'rgb(240, 72, 100)', 'rgb(250, 125, 146)', 'rgb(213, 152, 217)' | |||
| ] | |||
| }; | |||
| }, | |||
| computed: { | |||
| option() { | |||
| return { | |||
| tooltip: {show: true}, | |||
| series: [{ | |||
| type: 'wordCloud', | |||
| width: '100%', | |||
| height: '100%', | |||
| sizeRange: [12, 24], | |||
| gridSize: 6, | |||
| textStyle: { | |||
| normal: { | |||
| color: () => { | |||
| return this.randomColor(); | |||
| } | |||
| }, | |||
| emphasis: {shadowBlur: 8, shadowColor: 'rgba(0,0,0,.15)'} | |||
| }, | |||
| data: this.data | |||
| }] | |||
| }; | |||
| } | |||
| }, | |||
| methods: { | |||
| /* 取随机颜色 */ | |||
| randomColor() { | |||
| return this.colors[this.random(0, this.colors.length)]; | |||
| }, | |||
| /* 取随机数 */ | |||
| random(m, n) { | |||
| return Math.floor(Math.random() * (m - n) + n); | |||
| }, | |||
| /* 图表渲染完成回调 */ | |||
| onChartDone(chart) { | |||
| chart.on('click', e => { | |||
| this.$emit('click', e.data); | |||
| }); | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
+ 71
- 0
src/components/EleChart/index.vue
View File
| @@ -0,0 +1,71 @@ | |||
| <!-- echarts图表组件封装 License By http://eleadmin.com --> | |||
| <template> | |||
| <div ref="chart"></div> | |||
| </template> | |||
| <script> | |||
| import echarts from 'echarts' | |||
| import EleCharTheme from './EleChartTheme' | |||
| export default { | |||
| name: 'EleChart', | |||
| props: { | |||
| option: Object // echarts配置 | |||
| }, | |||
| data() { | |||
| return { | |||
| chart: null // echarts实例 | |||
| } | |||
| }, | |||
| computed: { | |||
| screenWidth() { | |||
| try { | |||
| return this.$store.state.theme.screenWidth; | |||
| } catch (e) { | |||
| return null; | |||
| } | |||
| }, | |||
| collapse() { | |||
| try { | |||
| return this.$store.state.theme.collapse; | |||
| } catch (e) { | |||
| return null; | |||
| } | |||
| } | |||
| }, | |||
| watch: { | |||
| option() { | |||
| this.setOption(); | |||
| }, | |||
| screenWidth() { | |||
| this.resize(); | |||
| }, | |||
| collapse() { | |||
| setTimeout(() => { | |||
| this.resize(); | |||
| }, 360); | |||
| } | |||
| }, | |||
| mounted() { | |||
| this.init(); | |||
| }, | |||
| methods: { | |||
| /* 初始化echarts实例 */ | |||
| init() { | |||
| this.chart = echarts.init(this.$refs.chart, EleCharTheme); | |||
| this.setOption(); | |||
| this.$emit('done', this.chart); | |||
| }, | |||
| /* 绘制图表 */ | |||
| setOption(option) { | |||
| if (!this.chart) return; | |||
| this.chart.setOption(option || this.option); | |||
| }, | |||
| /* 重置尺寸 */ | |||
| resize() { | |||
| if (!this.chart) return; | |||
| this.chart.resize(); | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
+ 332
- 0
src/components/EleCropperDialog/EleCropper.vue
View File
| @@ -0,0 +1,332 @@ | |||
| <!-- 图片裁剪组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <div class="ele-cropper"> | |||
| <div class="ele-cropper-group"> | |||
| <div class="ele-cropper-img-group"> | |||
| <img ref="eleCropperImg" :src="imgSrc" style="max-width:100%;" alt=""/> | |||
| </div> | |||
| <div v-if="showPreview" ref="eleCropperPreviews" :style="pStyle" class="ele-cropper-preview-group"> | |||
| <div :style="pItemStyle1" class="ele-cropper-preview"></div> | |||
| <div v-if="this.aspectRatio===1" :style="pItemStyle2" class="ele-cropper-preview"></div> | |||
| <div v-if="this.aspectRatio!==1" :style="pItemStyle3" class="ele-cropper-preview"></div> | |||
| <div v-if="this.aspectRatio!==1" :style="pItemStyle4" class="ele-cropper-preview"></div> | |||
| </div> | |||
| </div> | |||
| <div v-if="tools" class="ele-cropper-tool"> | |||
| <el-button-group v-for="(item,index) in toolGroup" :key="index" class="ele-cropper-tool-item"> | |||
| <template v-for="(btn,i) in item"> | |||
| <el-button v-if="btn==='zoomIn'" :key="i" @click="action" data-method="zoom" | |||
| data-option="0.1" title="放大" icon="el-icon-zoom-in" type="primary"/> | |||
| <el-button v-else-if="btn==='zoomOut'" :key="i" @click="action" data-method="zoom" | |||
| data-option="-0.1" title="缩小" icon="el-icon-zoom-out" type="primary"/> | |||
| <el-button v-else-if="btn==='rotateL'" :key="i" @click="action" data-method="rotate" | |||
| data-option="-45" title="向左旋转" icon="el-icon-refresh-left" type="primary"/> | |||
| <el-button v-else-if="btn==='rotateR'" :key="i" @click="action" data-method="rotate" | |||
| data-option="45" title="向右旋转" icon="el-icon-refresh-right" type="primary"/> | |||
| <el-button v-else-if="btn==='moveL'" :key="i" @click="action" data-method="move" data-option="-10" | |||
| data-option2="0" title="左移" icon="el-icon-back" type="primary"/> | |||
| <el-button v-else-if="btn==='moveR'" :key="i" @click="action" data-method="move" data-option="10" | |||
| data-option2="0" title="右移" icon="el-icon-right" type="primary"/> | |||
| <el-button v-else-if="btn==='moveT'" :key="i" @click="action" data-method="move" data-option="0" | |||
| data-option2="-10" title="上移" icon="el-icon-top" type="primary"/> | |||
| <el-button v-else-if="btn==='moveB'" :key="i" @click="action" data-method="move" data-option="0" | |||
| data-option2="10" title="下移" icon="el-icon-bottom" type="primary"/> | |||
| <el-button v-else-if="btn==='scaleX'" :key="i" @click="action" data-method="scaleX" | |||
| data-option="-1" title="左右翻转" icon="el-icon-sort" type="primary"/> | |||
| <el-button v-else-if="btn==='scaleY'" :key="i" @click="action" data-method="scaleY" | |||
| data-option="-1" title="上下翻转" icon="el-icon-sort" type="primary"/> | |||
| <el-button v-else-if="btn==='reset'" :key="i" @click="action" data-method="reset" | |||
| title="重新开始" icon="el-icon-refresh" type="primary"/> | |||
| <el-upload v-else-if="btn==='upload'" :key="i" action="" :before-upload="onUpload" | |||
| :show-file-list="false" :accept="accept"> | |||
| <el-button title="选择图片" icon="el-icon-upload2" type="primary"/> | |||
| </el-upload> | |||
| <el-button v-else-if="btn==='crop'" :key="i" @click="action" data-method="getCroppedCanvas" | |||
| data-option="{ "maxWidth": 4096, "maxHeight": 4096 }" | |||
| icon="el-icon-check" type="primary">完成 | |||
| </el-button> | |||
| </template> | |||
| </el-button-group> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import 'cropperjs/dist/cropper.css'; | |||
| import Cropper from 'cropperjs'; | |||
| export default { | |||
| name: "EleCropper", | |||
| props: { | |||
| src: String, // 图片地址 | |||
| aspectRatio: { // 裁剪比例 | |||
| type: Number, | |||
| default: 1 | |||
| }, | |||
| viewMode: Number, // 裁剪组件模式 | |||
| dragMode: String, | |||
| initialAspectRatio: Number, | |||
| minContainerWidth: Number, | |||
| minContainerHeight: Number, | |||
| minCanvasWidth: Number, | |||
| minCanvasHeight: Number, | |||
| minCropBoxWidth: Number, | |||
| minCropBoxHeight: Number, | |||
| croppedWidth: Number, | |||
| croppedHeight: Number, | |||
| croppedMinWidth: Number, | |||
| croppedMinHeight: Number, | |||
| croppedMaxWidth: Number, | |||
| croppedMaxHeight: Number, | |||
| croppedFillColor: Number, | |||
| croppedImageSmoothingEnabled: Boolean, | |||
| croppedImageSmoothingQuality: String, | |||
| toBlob: Boolean, // 是否返回blob数据 | |||
| accept: { // 允许上传的图片类型 | |||
| type: String, | |||
| default: 'image/*' | |||
| }, | |||
| tools: { // 操作按钮布局 | |||
| type: [Boolean, String], | |||
| default: true | |||
| }, | |||
| showPreview: { // 是否显示预览组件 | |||
| type: Boolean, | |||
| default: true | |||
| } | |||
| }, | |||
| data() { | |||
| return { | |||
| imgSrc: '', // 图片base64数据 | |||
| ins: null, // cropper实例 | |||
| options: { // cropper配置 | |||
| aspectRatio: this.aspectRatio, | |||
| viewMode: this.viewMode | |||
| }, | |||
| imgType: 'image/jpeg', // 当前图片类型 | |||
| previewWidth: 120 // 预览组件宽度 | |||
| } | |||
| }, | |||
| computed: { | |||
| // 预览组件样式 | |||
| pStyle() { | |||
| return `width: ${this.previewWidth + 20}px;text-align: right;font-size:0;`; | |||
| }, | |||
| pItemStyle1() { | |||
| let h = this.previewWidth / (this.aspectRatio || 1); | |||
| return `width: ${this.previewWidth}px;height: ${h}px;`; | |||
| }, | |||
| pItemStyle2() { | |||
| return this.pItemStyle1 + 'border-radius: 50%;margin-top: 10px;'; | |||
| }, | |||
| pItemStyle3() { | |||
| let w = this.previewWidth / 3 * 2 - 15; | |||
| let h = w / (this.aspectRatio || 1); | |||
| return `width: ${this.previewWidth}px;height: ${h}px;margin-top: 10px;`; | |||
| }, | |||
| pItemStyle4() { | |||
| let w = this.previewWidth / 3 - 1; | |||
| let h = w / (this.aspectRatio || 1); | |||
| return `width: ${this.previewWidth}px;height: ${h}px;margin: 10px 0 0 10px;`; | |||
| }, | |||
| // 解析按钮布局 | |||
| toolGroup() { | |||
| if (typeof this.tools === 'string') { | |||
| let tool = []; | |||
| let group = this.tools.split('|'); | |||
| group.forEach(g => { | |||
| tool.push(g.split(',').map(b => b.trim())); | |||
| }); | |||
| return tool; | |||
| } else if (this.tools) { | |||
| return [ | |||
| ['zoomIn', 'zoomOut'], ['moveL', 'moveR', 'moveT', 'moveB'], ['rotateL', 'rotateR'], | |||
| ['scaleX', 'scaleY'], ['reset', 'upload'], ['crop'] | |||
| ]; | |||
| } | |||
| return []; | |||
| } | |||
| }, | |||
| mounted() { | |||
| // ie兼容 | |||
| if (this.src.indexOf('data:image') !== 0 && (!!window.ActiveXObject || 'ActiveXObject' in window)) { | |||
| let req = new window.XMLHttpRequest(); | |||
| req.open('GET', this.src, true); | |||
| req.responseType = 'arraybuffer'; | |||
| req.onload = () => { | |||
| if ([200, 201].indexOf(req.status) === -1) return console.error('cropper', req); | |||
| let bytes = new Uint8Array(req.response), binary = ''; | |||
| for (let i = 0; i < bytes.byteLength; i++) binary += String.fromCharCode(bytes[i]); | |||
| this.imgSrc = 'data:image/jpeg;base64,' + window.btoa(binary); | |||
| this.$nextTick(() => { | |||
| this.render(); | |||
| }); | |||
| }; | |||
| req.send(); | |||
| } else { | |||
| this.imgSrc = this.src; | |||
| this.$nextTick(() => { | |||
| this.render(); | |||
| }); | |||
| } | |||
| }, | |||
| methods: { | |||
| /* 渲染 */ | |||
| render() { | |||
| if (this.ins) this.ins.destroy(); | |||
| if (this.showPreview) this.options.preview = this.$refs.eleCropperPreviews.children; | |||
| this.options.dragMode = this.dragMode; | |||
| this.options.initialAspectRatio = this.initialAspectRatio; | |||
| this.options.minContainerWidth = this.minContainerWidth; | |||
| this.options.minContainerHeight = this.minContainerHeight; | |||
| this.options.minCanvasWidth = this.minCanvasWidth; | |||
| this.options.minCanvasHeight = this.minCanvasHeight; | |||
| this.options.minCropBoxWidth = this.minCropBoxWidth; | |||
| this.options.minCropBoxHeight = this.minCropBoxHeight; | |||
| this.ins = new Cropper(this.$refs.eleCropperImg, this.options); | |||
| }, | |||
| /* 操作按钮点击事件 */ | |||
| action(e) { | |||
| let method = this.getDataset(e.currentTarget, 'method'), | |||
| option = this.getDataset(e.currentTarget, 'option'), | |||
| secondOption = this.getDataset(e.currentTarget, 'option2'); | |||
| if (!this.ins || !method) return; | |||
| let cropped = this.ins.cropped, result; | |||
| switch (method) { | |||
| case 'rotate': | |||
| if (cropped && this.options.viewMode > 0) this.in.clear(); | |||
| break; | |||
| case 'getCroppedCanvas': | |||
| option = JSON.parse(option); | |||
| if (this.imgType === 'image/jpeg') { | |||
| if (!option) option = {}; | |||
| option.fillColor = '#fff'; | |||
| } | |||
| option.width = this.croppedWidth; | |||
| option.height = this.croppedHeight; | |||
| option.minWidth = this.croppedMinWidth; | |||
| option.minHeight = this.croppedMinHeight; | |||
| option.maxWidth = this.croppedMaxWidth; | |||
| option.maxHeight = this.croppedMaxHeight; | |||
| option.fillColor = this.croppedFillColor; | |||
| option.imageSmoothingEnabled = this.croppedImageSmoothingEnabled; | |||
| option.imageSmoothingQuality = this.croppedImageSmoothingQuality; | |||
| break; | |||
| } | |||
| result = this.ins[method](option, secondOption); | |||
| switch (method) { | |||
| case 'rotate': | |||
| if (cropped && this.options.viewMode > 0) this.ins.crop(); | |||
| break; | |||
| case 'scaleX': | |||
| case 'scaleY': | |||
| this.setDataset(e.currentTarget, 'option', -option); | |||
| break; | |||
| case 'getCroppedCanvas': | |||
| console.log(result.toDataURL()) | |||
| if (result) { | |||
| if (this.toBlob) { | |||
| result.toBlob((blob) => { | |||
| this.$emit('crop', blob); | |||
| }, this.imgType); | |||
| } else { | |||
| this.$emit('crop', result.toDataURL(this.imgType)); | |||
| } | |||
| } else { | |||
| this.$message.error('裁剪失败'); | |||
| } | |||
| break; | |||
| } | |||
| }, | |||
| /* 图片上传处理 */ | |||
| onUpload(file) { | |||
| this.imgType = file.type; | |||
| let reader = new FileReader(); | |||
| reader.onload = (e) => { | |||
| this.ins.replace(e.target.result); | |||
| }; | |||
| reader.readAsDataURL(file); | |||
| return false; | |||
| }, | |||
| /* 获取dataset属性 */ | |||
| getDataset(elem, key) { | |||
| if (elem.dataset) return elem.dataset[key]; | |||
| else return elem.getAttribute('data-' + key); | |||
| }, | |||
| /* 设置dataset属性 */ | |||
| setDataset(elem, key, value) { | |||
| if (elem.dataset) elem.dataset[key] = value; | |||
| else elem.setAttribute('data-' + key, value); | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style scoped> | |||
| .ele-cropper .ele-cropper-group { | |||
| display: flex; | |||
| } | |||
| .ele-cropper .ele-cropper-img-group { | |||
| flex: 1; | |||
| } | |||
| .ele-cropper .ele-cropper-preview { | |||
| display: inline-block; | |||
| border: 1px solid hsla(0, 0%, 80%, .6); | |||
| vertical-align: top; | |||
| overflow: hidden; | |||
| } | |||
| /* 操作按钮 */ | |||
| .ele-cropper .ele-cropper-tool { | |||
| margin-top: 10px; | |||
| } | |||
| .ele-cropper .ele-cropper-tool-item { | |||
| margin-top: 10px; | |||
| vertical-align: top; | |||
| } | |||
| .ele-cropper .ele-cropper-tool-item { | |||
| margin-right: 18px; | |||
| } | |||
| .ele-cropper .ele-cropper-tool-item:last-child { | |||
| margin-right: 0 !important; | |||
| } | |||
| .ele-cropper .ele-cropper-tool .el-button { | |||
| padding-left: 12px; | |||
| padding-right: 12px; | |||
| } | |||
| .ele-cropper [data-method="scaleX"] .el-icon-sort { | |||
| transform: rotate(90deg); | |||
| } | |||
| .ele-cropper .ele-cropper-tool-item > div { | |||
| display: inline-block; | |||
| } | |||
| .ele-cropper .ele-cropper-tool-item .el-upload .el-button { | |||
| border-top-left-radius: 0; | |||
| border-bottom-left-radius: 0; | |||
| } | |||
| /* 小屏幕适应 */ | |||
| @media screen and (max-width: 768px) { | |||
| .ele-cropper .ele-cropper-preview-group { | |||
| display: none; | |||
| } | |||
| .ele-cropper .ele-cropper-tool-item { | |||
| margin-right: 6px; | |||
| } | |||
| .ele-cropper .ele-cropper-tool .el-button { | |||
| padding-left: 10px; | |||
| padding-right: 10px; | |||
| } | |||
| } | |||
| </style> | |||
+ 131
- 0
src/components/EleCropperDialog/index.vue
View File
| @@ -0,0 +1,131 @@ | |||
| <!-- 图片裁剪弹窗 License By http://eleadmin.com --> | |||
| <template> | |||
| <el-dialog :visible="show" :title="title" :width="width" :custom-class="customClass" :show-close="showClose" | |||
| :close-on-click-modal="closeOnClickModal" :close-on-press-escape="closeOnPressEscape" | |||
| :destroy-on-close="destroyOnClose" @update:visible="d => $emit('update:show', d)" | |||
| :lock-scroll="lockScroll" :append-to-body="appendToBody" :modal-append-to-body="modalAppendToBody" | |||
| :modal="modal" :top="top" @open="onOpen" @closed="onClosed"> | |||
| <template slot="title"> | |||
| <slot name="title"/> | |||
| </template> | |||
| <ele-cropper v-if="showCropper" :src="src" :aspectRatio="aspectRatio" :viewMode="viewMode" :accept="accept" | |||
| :drag-mode="dragMode" :initial-aspect-ratio="initialAspectRatio" | |||
| :min-container-width="minContainerWidth" :min-container-height="minContainerHeight" | |||
| :min-canvas-width="minCanvasWidth" :min-canvas-height="minCanvasHeight" | |||
| :min-crop-box-width="minCropBoxWidth" :min-crop-box-height="minCropBoxHeight" | |||
| :cropped-width="croppedWidth" :cropped-height="croppedHeight" | |||
| :cropped-min-width="croppedMinWidth" :cropped-min-height="croppedMinHeight" | |||
| :cropped-max-width="croppedMaxWidth" :cropped-max-height="croppedMaxHeight" | |||
| :cropped-fill-color="croppedFillColor" :to-blob="toBlob" | |||
| :cropped-image-smoothing-enabled="croppedImageSmoothingEnabled" | |||
| :cropped-image-smoothing-quality="croppedImageSmoothingQuality" | |||
| :tools="tools" :showPreview="showPreview" @crop="data=>$emit('crop',data)"/> | |||
| <template slot="footer"> | |||
| <slot/> | |||
| </template> | |||
| </el-dialog> | |||
| </template> | |||
| <script> | |||
| import EleCropper from './EleCropper'; | |||
| export default { | |||
| name: "EleCropperDialog", | |||
| components: {EleCropper}, | |||
| props: { | |||
| /* cropper参数 */ | |||
| src: String, // 裁剪的图片地址 | |||
| aspectRatio: { // 裁剪比例 | |||
| type: Number, | |||
| default: 1 | |||
| }, | |||
| viewMode: Number, // 裁剪组件模式 | |||
| dragMode: String, | |||
| initialAspectRatio: Number, | |||
| minContainerWidth: Number, | |||
| minContainerHeight: Number, | |||
| minCanvasWidth: Number, | |||
| minCanvasHeight: Number, | |||
| minCropBoxWidth: Number, | |||
| minCropBoxHeight: Number, | |||
| croppedWidth: Number, | |||
| croppedHeight: Number, | |||
| croppedMinWidth: Number, | |||
| croppedMinHeight: Number, | |||
| croppedMaxWidth: Number, | |||
| croppedMaxHeight: Number, | |||
| croppedFillColor: Number, | |||
| croppedImageSmoothingEnabled: Boolean, | |||
| croppedImageSmoothingQuality: String, | |||
| toBlob: Boolean, // 是否返回blob数据 | |||
| accept: { // 允许上传的图片类型 | |||
| type: String, | |||
| default: 'image/*' | |||
| }, | |||
| tools: { // 操作按钮布局 | |||
| type: [Boolean, String], | |||
| default: true | |||
| }, | |||
| showPreview: { // 是否显示预览组件 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| /* 弹窗参数 */ | |||
| title: { // 弹窗的标题 | |||
| type: String, | |||
| default: '裁剪图片' | |||
| }, | |||
| width: { // 弹窗的宽度 | |||
| type: String, | |||
| default: '680px' | |||
| }, | |||
| customClass: String, // Dialog 的自定义类名 | |||
| closeOnClickModal: { // 是否可以通过点击 modal 关闭 Dialog | |||
| type: Boolean, | |||
| default: false | |||
| }, | |||
| closeOnPressEscape: { // 是否可以通过按下 ESC 关闭 Dialog | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| showClose: { // 是否显示关闭按钮 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| lockScroll: { // 是否在 Dialog 出现时将 body 滚动锁定 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| appendToBody: Boolean, // Dialog 自身是否插入至 body 元素上 | |||
| modalAppendToBody: { // 遮罩层是否插入至 body 元素上 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| modal: { // 是否需要遮罩层 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| top: String, // Dialog CSS 中的 margin-top 值 | |||
| destroyOnClose: { // 关闭时销毁 Dialog 中的元素 | |||
| type: Boolean, | |||
| default: false | |||
| }, | |||
| show: Boolean // 是否显示 | |||
| }, | |||
| data() { | |||
| return { | |||
| showCropper: false | |||
| } | |||
| }, | |||
| methods: { | |||
| onOpen() { | |||
| this.showCropper = true; | |||
| this.$emit('open'); | |||
| }, | |||
| onClosed() { | |||
| this.$emit('closed'); | |||
| if (this.destroyOnClose) this.showCropper = false; | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
+ 398
- 0
src/components/EleDataTable/index.vue
View File
| @@ -0,0 +1,398 @@ | |||
| <!-- 数据表格组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <div> | |||
| <!-- 表格 --> | |||
| <el-table | |||
| ref="dataTable" :data="list" v-loading="loading" | |||
| :height="height" :max-height="maxHeight" :stripe="stripe" | |||
| :border="border===undefined?true:border" :size="size" :fit="fit" | |||
| :show-header="showHeader" :highlight-current-row="highlightCurrentRow" :current-row-key="currentRowKey" | |||
| :row-class-name="rowClassName" :row-style="rowStyle" :cell-class-name="cellClassName" | |||
| :cell-style="cellStyle" :header-row-class-name="headerRowClassName" :header-row-style="headerRowStyle" | |||
| :header-cell-class-name="headerCellClassName" :header-cell-style="headerCellStyle" | |||
| :row-key="rowKey" :empty-text="emptyText" :default-expand-all="defaultExpandAll" | |||
| :expand-row-keys="expandRowKeys" :default-sort="defaultSort" :tooltip-effect="tooltipEffect" | |||
| :show-summary="showSummary" :sum-text="sumText" :summary-method="summaryMethod" | |||
| :span-method="spanMethod" :select-on-indeterminate="selectOnIndeterminate" :indent="indent" | |||
| :lazy="lazy" :load="load" :tree-props="treeProps" | |||
| @select="select" @select-all="selectAll" @selection-change="selectionChange" | |||
| @cell-mouse-enter="cellMouseEnter" @cell-mouse-leave="cellMouseLeave" @cell-click="cellClick" | |||
| @cell-dblclick="cellDblclick" @row-click="rowClick" @row-contextmenu="rowContextmenu" | |||
| @row-dblclick="rowDblclick" @header-click="headerClick" @header-contextmenu="headerContextmenu" | |||
| @sort-change="sortChange" @filter-change="filterChange" @current-change="currentChange" | |||
| @header-dragend="headerDragend" @expand-change="expandChange" style="width:100%;"> | |||
| <slot v-bind:page="page" v-bind:count="count" v-bind:index="tableIndex"></slot> | |||
| <ele-empty slot="empty" :text="emptyText"/> | |||
| </el-table> | |||
| <!-- 分页组件 --> | |||
| <el-pagination | |||
| v-if="page" :current-page="page.page" :page-size="page.limit" :total="count" | |||
| :background="true" :layout="layout" :page-sizes="pageSizes" :pager-count="pagerCount" | |||
| :prev-text="prevText" :next-text="nextText" :hide-on-single-page="hideOnSinglePage" | |||
| @size-change="pageSizeChange" @current-change="pageCurrentChange" class="ele-pagination-circle"/> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "EleDataTable", | |||
| props: { | |||
| config: { // 数据表格参数配置 | |||
| type: Object, | |||
| default() { | |||
| return {} | |||
| } | |||
| }, | |||
| data: Array, // 前端分页直接指定数据 | |||
| choose: Array, // 列表选中数据(多选) | |||
| current: Object, // 列表选中数据(单选) | |||
| servePage: Boolean, // 强制后端分页 | |||
| // 表格参数 | |||
| size: String, | |||
| width: [String, Number], | |||
| height: [String, Number], | |||
| maxHeight: [String, Number], | |||
| fit: { | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| stripe: Boolean, | |||
| border: { | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| rowKey: [String, Function], | |||
| showHeader: { | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| showSummary: Boolean, | |||
| sumText: String, | |||
| summaryMethod: Function, | |||
| rowClassName: [String, Function], | |||
| rowStyle: [Object, Function], | |||
| cellClassName: [String, Function], | |||
| cellStyle: [Object, Function], | |||
| headerRowClassName: [String, Function], | |||
| headerRowStyle: [Object, Function], | |||
| headerCellClassName: [String, Function], | |||
| headerCellStyle: [Object, Function], | |||
| highlightCurrentRow: Boolean, | |||
| currentRowKey: [String, Number], | |||
| emptyText: String, | |||
| expandRowKeys: Array, | |||
| defaultExpandAll: Boolean, | |||
| defaultSort: Object, | |||
| tooltipEffect: String, | |||
| spanMethod: Function, | |||
| selectOnIndeterminate: { | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| indent: { | |||
| type: Number, | |||
| default: 16 | |||
| }, | |||
| treeProps: { | |||
| type: Object, | |||
| default() { | |||
| return { | |||
| hasChildren: 'hasChildren', | |||
| children: 'children' | |||
| }; | |||
| } | |||
| }, | |||
| lazy: Boolean, | |||
| load: Function, | |||
| // 分页组件参数 | |||
| pagerCount: { | |||
| type: Number, | |||
| default: 5 | |||
| }, | |||
| layout: { | |||
| default: 'total, sizes, prev, pager, next, jumper' | |||
| }, | |||
| pageSizes: Array, | |||
| prevText: String, | |||
| nextText: String, | |||
| hideOnSinglePage: Boolean | |||
| }, | |||
| data() { | |||
| // 分页参数 | |||
| let page = false; | |||
| if (this.config.page !== false) { | |||
| page = Object.assign({page: 1, limit: 10}, this.config.page === true ? {} : this.config.page); | |||
| } | |||
| // 请求参数名 | |||
| let request = Object.assign({ | |||
| pageName: 'page', limitName: 'limit', sortName: 'sort', orderName: 'order' | |||
| }, this.config.request); | |||
| return { | |||
| loading: false, // 加载状态 | |||
| mData: [], // 列表数据源(后端) | |||
| count: this.data ? this.data.length : 0, // 总数量 | |||
| page: page, // 分页参数 | |||
| order: this.config.order ? this.config.order : {}, // 排序参数 | |||
| request: request // 请求参数名 | |||
| }; | |||
| }, | |||
| computed: { | |||
| /* 表格当前显示数据 */ | |||
| list() { | |||
| let allData; | |||
| if (this.data) { | |||
| allData = this.data; | |||
| } else if (this.mData.length < this.count) { | |||
| return this.mData; | |||
| } else { | |||
| allData = this.mData; | |||
| } | |||
| let sort = this.order[this.request.sortName], | |||
| order = this.order[this.request.orderName]; | |||
| if (this.page) { // 进行前端分页、排序 | |||
| let start = (this.page.page - 1) * this.page.limit; | |||
| let end = start + this.page.limit; | |||
| end = end > allData.length ? allData.length : end; | |||
| if (sort) { | |||
| return allData.sort((a, b) => { | |||
| if (b[sort] == a[sort]) return 0; | |||
| if (order === 'desc') { | |||
| return (a[sort] < b[sort]) ? 1 : -1; | |||
| } else { | |||
| return (a[sort] < b[sort]) ? -1 : 1; | |||
| } | |||
| }).slice(start, end); | |||
| } else { | |||
| return allData.slice(start, end); | |||
| } | |||
| } else { // 进行前端排序 | |||
| if (sort) { | |||
| return allData.sort((a, b) => { | |||
| if (b[sort] == a[sort]) return 0; | |||
| if (order === 'desc') { | |||
| return (a[sort] < b[sort]) ? 1 : -1; | |||
| } else { | |||
| return (a[sort] < b[sort]) ? -1 : 1; | |||
| } | |||
| }); | |||
| } else { | |||
| return allData; | |||
| } | |||
| } | |||
| }, | |||
| /* 表格索引开始序号 */ | |||
| tableIndex() { | |||
| if (!this.page) return 1; | |||
| return (this.page.page - 1) * this.page.limit + 1; | |||
| } | |||
| }, | |||
| watch: { | |||
| /* 监听数据改变 */ | |||
| data() { | |||
| this.count = this.data.length; | |||
| if (this.page) { | |||
| let maxPage = Math.ceil(this.count / this.page.limit); | |||
| if (maxPage < this.page.page) this.page.page = maxPage || 1; | |||
| } | |||
| } | |||
| }, | |||
| mounted() { | |||
| this.reload(true); | |||
| }, | |||
| methods: { | |||
| /* 获取数据 */ | |||
| reload(first) { | |||
| let config; | |||
| if (typeof first === 'object') { | |||
| config = Object.assign({}, this.config, first); | |||
| first = false; | |||
| } else { | |||
| config = this.config; | |||
| } | |||
| if (!first) { | |||
| // 分页参数 | |||
| if (config.page) { | |||
| this.page = Object.assign({ | |||
| page: 1, limit: 10 | |||
| }, this.page || {}, config.page === true ? {} : config.page); | |||
| } else if (this.page === false) { | |||
| this.page = false; | |||
| } | |||
| // 排序参数 | |||
| if (config.order) Object.assign(this.order, config.order); | |||
| // 请求参数名 | |||
| if (config.request) Object.assign(this.request, config.request); | |||
| } | |||
| if (config.url && (this.servePage || !first || !this.mData.length || this.mData.length < this.count)) { // 后端分页 | |||
| this.loading = true; | |||
| let pageParam = {}; | |||
| if (this.page) { | |||
| pageParam[this.request.pageName] = this.page.page; | |||
| pageParam[this.request.limitName] = this.page.limit; | |||
| } | |||
| let params, data = Object.assign({}, config.where || {}, pageParam, this.order); | |||
| if (config.parseParam) data = config.parseParam(data); | |||
| let method = config.method ? config.method.toUpperCase() : 'GET'; | |||
| if (['POST', 'PUT', 'PATCH'].indexOf(method) === -1) { | |||
| params = data; | |||
| data = undefined; | |||
| } else if (config.contentType && config.contentType.toLowerCase().indexOf('form') !== -1) { | |||
| let formData = new FormData(); | |||
| for (let key in data) { | |||
| if (!Object.prototype.hasOwnProperty.call(data, key)) continue; | |||
| formData.append(key, data[key]); | |||
| } | |||
| data = formData; | |||
| } | |||
| this.$http.request({ | |||
| url: config.url, method: method, | |||
| params: params, data: data, headers: config.headers | |||
| }).then(res => { | |||
| this.loading = false; | |||
| if (config.parseData) res.data = config.parseData(res.data); | |||
| if (res.data.code === 0) { | |||
| this.mData = res.data.data.records; | |||
| this.count = res.data.data.total || this.mData.length; | |||
| if (this.page) { | |||
| let maxPage = Math.ceil(this.count / this.page.limit); | |||
| if (maxPage < this.page.page) this.page.page = maxPage || 1; | |||
| } | |||
| this.$emit('done', res.data, this.page ? this.page.page : 1, this.count, this.$refs.dataTable); | |||
| } else { | |||
| this.$message.error(res.data.msg || '获取数据失败, 正确的状态码为0'); | |||
| } | |||
| }).catch(e => { | |||
| this.loading = false; | |||
| this.$message.error(e.message); | |||
| }); | |||
| } else { // 前端分页 | |||
| this.$emit('done', {data: this.list}, this.page ? this.page.page : 1, this.count, this.$refs.dataTable); | |||
| } | |||
| }, | |||
| /* 获取列表当前显示数据 */ | |||
| getData() { | |||
| return this.list; | |||
| }, | |||
| /* 获取列表的排序参数 */ | |||
| getOrder() { | |||
| return this.order; | |||
| }, | |||
| /* 获取列表的分页参数 */ | |||
| getPage() { | |||
| return this.page; | |||
| }, | |||
| /* 分页limit改变 */ | |||
| pageSizeChange(limit) { | |||
| this.page.limit = limit; | |||
| this.reload(true); | |||
| }, | |||
| /* 分页page改变 */ | |||
| pageCurrentChange(page) { | |||
| this.page.page = page; | |||
| this.reload(true); | |||
| }, | |||
| select(selection, row) { | |||
| this.$emit('select', selection, row); | |||
| }, | |||
| selectAll(selection) { | |||
| this.$emit('select-all', selection); | |||
| }, | |||
| /* 多选改变 */ | |||
| selectionChange(selection) { | |||
| this.$emit('update:choose', selection); | |||
| this.$emit('selection-change', selection); | |||
| }, | |||
| cellMouseEnter(row, column, cell, event) { | |||
| this.$emit('cell-mouse-enter', row, column, cell, event); | |||
| }, | |||
| cellMouseLeave(row, column, cell, event) { | |||
| this.$emit('cell-mouse-leave', row, column, cell, event); | |||
| }, | |||
| cellClick(row, column, cell, event) { | |||
| this.$emit('cell-click', row, column, cell, event); | |||
| }, | |||
| cellDblclick(row, column, cell, event) { | |||
| this.$emit('cell-dblclick', row, column, cell, event); | |||
| }, | |||
| /* 行点击事件 */ | |||
| rowClick(row, column, event) { | |||
| if (this.highlightCurrentRow) { | |||
| if (this.choose.length === 0 || this.choose.length === 1) { | |||
| this.clearSelection(); | |||
| this.toggleRowSelection(row, true); | |||
| } else { | |||
| this.toggleRowSelection(row); | |||
| } | |||
| } | |||
| this.$emit('row-click', row, column, event); | |||
| }, | |||
| rowContextmenu(row, column, event) { | |||
| this.$emit('row-contextmenu', row, column, event); | |||
| }, | |||
| rowDblclick(row, column, event) { | |||
| this.$emit('row-dblclick', row, column, event); | |||
| }, | |||
| headerClick(column, event) { | |||
| this.$emit('header-click', column, event); | |||
| }, | |||
| headerContextmenu(column, event) { | |||
| this.$emit('header-contextmenu', column, event); | |||
| }, | |||
| /* 排序改变 */ | |||
| sortChange({column, prop, order}) { | |||
| if (this.$listeners['sort-change']) { | |||
| this.$emit('sort-change', {column, prop, order}); | |||
| } else { | |||
| let temp = {}; | |||
| temp[this.request.sortName] = order ? prop : undefined; | |||
| temp[this.request.orderName] = order ? { | |||
| ascending: 'asc', descending: 'desc' | |||
| }[order] : undefined; | |||
| this.order = temp; | |||
| this.reload(true); | |||
| } | |||
| }, | |||
| filterChange(filters) { | |||
| this.$emit('filter-change', filters); | |||
| }, | |||
| /* 单选改变 */ | |||
| currentChange(currentRow, oldCurrentRow) { | |||
| this.$emit('update:current', currentRow); | |||
| this.$emit('current-change', currentRow, oldCurrentRow); | |||
| }, | |||
| headerDragend(newWidth, oldWidth, column, event) { | |||
| this.$emit('header-dragend', newWidth, oldWidth, column, event); | |||
| }, | |||
| expandChange(row, expandedRows) { | |||
| this.$emit('expand-change', row, expandedRows); | |||
| }, | |||
| clearSelection() { | |||
| this.$refs.dataTable.clearSelection(); | |||
| }, | |||
| toggleRowSelection(row, selected) { | |||
| this.$refs.dataTable.toggleRowSelection(row, selected); | |||
| }, | |||
| toggleAllSelection() { | |||
| this.$refs.dataTable.toggleAllSelection(); | |||
| }, | |||
| toggleRowExpansion(row, expanded) { | |||
| this.$refs.dataTable.toggleRowExpansion(row, expanded); | |||
| }, | |||
| setCurrentRow(row) { | |||
| this.$refs.dataTable.setCurrentRow(row); | |||
| }, | |||
| clearSort() { | |||
| this.$refs.dataTable.clearSort(); | |||
| }, | |||
| clearFilter(columnKey) { | |||
| this.$refs.dataTable.clearFilter(columnKey); | |||
| }, | |||
| doLayout() { | |||
| this.$refs.dataTable.doLayout(); | |||
| }, | |||
| sort(prop, order) { | |||
| this.$refs.dataTable.sort(prop, order); | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
+ 99
- 0
src/components/EleDot/index.vue
View File
| @@ -0,0 +1,99 @@ | |||
| <!-- 状态文字组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <span class="ele-status-dot"> | |||
| <span :class="dotClass" :style="dotStyle"><span :class="dotColor"></span></span> | |||
| <span v-if="text" class="ele-dot-text">{{ text }}</span> | |||
| </span> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "EleDot", | |||
| props: { | |||
| type: { | |||
| type: String, | |||
| default: '' | |||
| }, | |||
| ripple: { | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| text: { | |||
| type: String, | |||
| default: '' | |||
| }, | |||
| size: { | |||
| type: String, | |||
| default: '6px' | |||
| } | |||
| }, | |||
| computed: { | |||
| dotColor() { | |||
| return [ | |||
| 'ele-bg-primary', | |||
| {'ele-bg-success': this.type === 'success'}, | |||
| {'ele-bg-warning': this.type === 'warning'}, | |||
| {'ele-bg-danger': this.type === 'danger'}, | |||
| {'ele-bg-info': this.type === 'info'} | |||
| ] | |||
| }, | |||
| dotClass() { | |||
| return [ | |||
| 'ele-dot', | |||
| {'ele-dot-ripple': this.ripple} | |||
| ].concat(this.dotColor); | |||
| }, | |||
| dotStyle() { | |||
| return {width: this.size, height: this.size}; | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| .ele-status-dot { | |||
| line-height: 1; | |||
| display: inline-block; | |||
| box-sizing: border-box; | |||
| } | |||
| .ele-status-dot .ele-dot-text { | |||
| margin-left: 8px; | |||
| display: inline-block; | |||
| vertical-align: middle; | |||
| } | |||
| .ele-dot { | |||
| border-radius: 50%; | |||
| display: inline-block; | |||
| vertical-align: middle; | |||
| position: relative; | |||
| } | |||
| .ele-dot > span { | |||
| display: none; | |||
| } | |||
| .ele-dot.ele-dot-ripple > span { | |||
| position: absolute; | |||
| top: 0; | |||
| left: 0; | |||
| width: 100%; | |||
| height: 100%; | |||
| display: block; | |||
| border-radius: 50%; | |||
| box-sizing: border-box; | |||
| animation: eleAnimStatusDot 1.2s ease-in-out infinite; | |||
| } | |||
| @keyframes eleAnimStatusDot { | |||
| from { | |||
| transform: scale(.8); | |||
| opacity: .6; | |||
| } | |||
| to { | |||
| transform: scale(2.4); | |||
| opacity: 0; | |||
| } | |||
| } | |||
| </style> | |||
+ 70
- 0
src/components/EleEmpty/index.vue
View File
| @@ -0,0 +1,70 @@ | |||
| <!-- 空视图组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <div :class="['ele-empty',customClass]"> | |||
| <div class="ele-empty-icon"> | |||
| <slot name="icon"> | |||
| <svg class="ele-empty-icon-default" width="64" height="41" viewBox="0 0 64 41" | |||
| xmlns="http://www.w3.org/2000/svg"> | |||
| <g transform="translate(0 1)" fill="none" fill-rule="evenodd"> | |||
| <ellipse class="ele-empty-icon-default-ellipse" cx="32" cy="33" rx="32" ry="7"></ellipse> | |||
| <g class="ele-empty-icon-default-g" fill-rule="nonzero"> | |||
| <path | |||
| d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"></path> | |||
| <path | |||
| d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z" | |||
| class="ele-empty-icon-default-path"></path> | |||
| </g> | |||
| </g> | |||
| </svg> | |||
| </slot> | |||
| </div> | |||
| <div class="ele-empty-text">{{ text }}</div> | |||
| <div class="ele-empty-actions"> | |||
| <slot/> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "EleEmpty", | |||
| props: { | |||
| text: { | |||
| type: String, | |||
| default: '暂无数据' | |||
| }, | |||
| customClass: [String, Object] | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| .ele-empty { | |||
| color: #CCC; | |||
| padding: 35px 0; | |||
| text-align: center; | |||
| position: relative; | |||
| line-height: 1; | |||
| } | |||
| .ele-empty-icon { | |||
| color: hsla(0, 0%, 60%, .25); | |||
| font-size: 58px; | |||
| } | |||
| .ele-empty-text { | |||
| padding: 6px 0; | |||
| } | |||
| .ele-empty-icon-default-ellipse { | |||
| fill: #f5f5f5; | |||
| } | |||
| .ele-empty-icon-default-g { | |||
| stroke: #d9d9d9; | |||
| } | |||
| .ele-empty-icon-default-path { | |||
| fill: #fafafa; | |||
| } | |||
| </style> | |||
+ 585
- 0
src/components/EleFileList/index.vue
View File
| @@ -0,0 +1,585 @@ | |||
| <!-- 文件列表组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <div class="ele-file-list-group"> | |||
| <!-- 网格模式 --> | |||
| <div v-if="grid" class="ele-file-list"> | |||
| <!-- 头部全选框 --> | |||
| <div v-if="showCheckbox" class="ele-file-list-header"> | |||
| <div class="ele-file-list-check-group" @click.stop="allChecked=!allChecked"> | |||
| <i :class="['ele-file-list-check el-icon-check ele-bg-primary',{'checked':allChecked}]"></i> | |||
| <span v-if="!checked.length">全选</span> | |||
| <span v-else>已选中{{ checked.length }}个文件/文件夹</span> | |||
| </div> | |||
| </div> | |||
| <!-- item --> | |||
| <div v-for="(item,i) in data" :key="i" | |||
| :class="['ele-file-list-item',{'checked':checked.indexOf(item)!==-1}]" | |||
| @click="onItemClick(item)"> | |||
| <!-- 背景和边框 --> | |||
| <div class="ele-file-list-item-bg ele-bg-primary"></div> | |||
| <div class="ele-file-list-item-border ele-border-primary"></div> | |||
| <!-- item body --> | |||
| <div class="ele-file-list-item-body"> | |||
| <!-- 图标 --> | |||
| <div class="ele-file-list-item-icon"> | |||
| <img :src="getIcon(item)" :class="{'ele-file-list-item-icon-image': item.thumbnail}" alt=""/> | |||
| </div> | |||
| <!-- 标题 --> | |||
| <div class="ele-file-list-item-title ele-text-primary" :title="item.name">{{ item.name }}</div> | |||
| </div> | |||
| <!-- 复选框 --> | |||
| <div v-if="showCheckbox" @click.stop="choose(item)" class="ele-file-list-item-check ele-bg-white"> | |||
| <i class="el-icon-check ele-bg-primary"></i> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <!-- 表格模式 --> | |||
| <div v-else class="ele-file-list-table"> | |||
| <!-- 表头 --> | |||
| <div :class="['ele-file-list-table-item ele-file-list-table-item-header',{'checked':allChecked}]"> | |||
| <div class="ele-file-list-table-item-body"> | |||
| <div v-if="showCheckbox" class="ele-file-list-table-item-check-group"> | |||
| <i class="ele-file-list-table-item-check el-icon-check ele-bg-primary" | |||
| @click.stop="allChecked=!allChecked"></i> | |||
| </div> | |||
| <div class="ele-file-list-table-item-name" @click="onClickSort('name')"> | |||
| <span v-if="!checked.length"> | |||
| <span>文件名</span> | |||
| <i v-if="sort==='name'" | |||
| :class="['ele-file-list-table-item-sort ele-text-primary',{'el-icon-top':order==='asc'},{'el-icon-bottom':order==='desc'}]"></i> | |||
| </span> | |||
| <span v-else @click.stop="allChecked=!allChecked">已选中{{ checked.length }}个文件/文件夹</span> | |||
| </div> | |||
| <div class="ele-file-list-table-item-size" @click="onClickSort('length')"> | |||
| <span>大小</span> | |||
| <i v-if="sort==='length'" | |||
| :class="['ele-file-list-table-item-sort ele-text-primary',{'el-icon-top':order==='asc'},{'el-icon-bottom':order==='desc'}]"></i> | |||
| </div> | |||
| <div class="ele-file-list-table-item-time" @click="onClickSort('updateTime')"> | |||
| <span>修改日期</span> | |||
| <i v-if="sort==='updateTime'" | |||
| :class="['ele-file-list-table-item-sort ele-text-primary',{'el-icon-top':order==='asc'},{'el-icon-bottom':order==='desc'}]"></i> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <!-- 列表item --> | |||
| <div v-for="(item,i) in data" :key="i" | |||
| :class="['ele-file-list-table-item',{'checked':checked.indexOf(item)>=0}]"> | |||
| <!-- 背景和边框 --> | |||
| <div class="ele-file-list-table-item-bg ele-bg-primary"></div> | |||
| <div class="ele-file-list-table-item-border ele-border-primary"></div> | |||
| <!-- item body cells --> | |||
| <div class="ele-file-list-table-item-body"> | |||
| <!-- 复选框 --> | |||
| <div v-if="showCheckbox" class="ele-file-list-table-item-check-group"> | |||
| <i class="ele-file-list-table-item-check el-icon-check ele-bg-primary" @click.stop="choose(item)"></i> | |||
| </div> | |||
| <!-- 图标和标题 --> | |||
| <div class="ele-file-list-table-item-name"> | |||
| <div class="ele-file-list-table-item-icon"> | |||
| <img :src="getIcon(item)" class="ele-file-list-table-item-icon-image" alt="" @click="onItemClick(item)"/> | |||
| <div class="ele-file-list-table-item-title ele-text-primary" :title="item.name" | |||
| @click="onItemClick(item)">{{ item.name }} | |||
| </div> | |||
| </div> | |||
| <div class="ele-file-list-table-item-tool-group"> | |||
| <slot name="tool" v-bind:item="item"></slot> | |||
| </div> | |||
| </div> | |||
| <!-- 大小 --> | |||
| <div class="ele-file-list-table-item-size">{{ item.length }}</div> | |||
| <!-- 修改时间 --> | |||
| <div class="ele-file-list-table-item-time">{{ item.updateTime }}</div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "EleFileList", | |||
| props: { | |||
| grid: { // 是否网格展示 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| data: Array, // 数据 | |||
| checked: Array, // 选中数据 | |||
| sort: String, // 排序字段 | |||
| order: String, // 排序方式 | |||
| icons: { // 网格模式后缀对应图标 | |||
| type: Array, | |||
| default() { | |||
| return [ | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_misc.png', type: 'file'}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_folder.png', type: 'dir'}, | |||
| { | |||
| icon: 'https://cdn.eleadmin.com/20200609/ic_file_code.png', | |||
| types: ['.java', '.js', '.css', '.vue', '.ts', '.tsx', '.scss', '.less', '.c', '.cpp', '.cs', '.jsp', '.php', '.asp', '.py', '.go', '.kt', '.lua'] | |||
| }, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_htm.png', types: ['.html', '.htm']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_text.png', types: ['.txt']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_pdf.png', types: ['.pdf']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_word.png', types: ['.doc', '.docx']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_excel.png', types: ['.xls', '.xlsx']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_ppt.png', types: ['.ppt', '.pptx']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_visio.png', types: ['.vsd']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_ps.png', types: ['.psd']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_cad.png', types: ['.dwg']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_flash.png', types: ['.swf']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_music.png', types: ['.mp3', '.wav']}, | |||
| { | |||
| icon: 'https://cdn.eleadmin.com/20200609/ic_file_video.png', | |||
| types: ['.mp4', '.rmvb', '.flv', '.avi', '.3gp'] | |||
| }, | |||
| { | |||
| icon: 'https://cdn.eleadmin.com/20200609/ic_file_picture.png', | |||
| types: ['.png', '.jpg', '.jpeg', '.gif', '.bmp'] | |||
| }, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_fonts.png', types: ['.ttf', '.woff']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_bt.png', types: ['.torrent']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_android.png', types: ['.apk']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_exe.png', types: ['.exe']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_ipa.png', types: ['.ipa', '.dmg']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_zip.png', types: ['.zip', '.rar', '.7z']}, | |||
| ]; | |||
| } | |||
| }, | |||
| smIcons: { // 表格模式后缀对应图标 | |||
| type: Array, | |||
| default() { | |||
| return [ | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_misc_sm.png', type: 'file'}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_folder_sm.png', type: 'dir'}, | |||
| { | |||
| icon: 'https://cdn.eleadmin.com/20200609/ic_file_code_sm.png', | |||
| types: ['.java', '.js', '.css', '.vue', '.ts', '.tsx', '.scss', '.less', '.c', '.cpp', '.cs', '.jsp', '.php', '.asp', '.py', '.go', '.kt', '.lua'] | |||
| }, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_htm_sm.png', types: ['.html', '.htm']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_text_sm.png', types: ['.txt']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_pdf_sm.png', types: ['.pdf']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_word_sm.png', types: ['.doc', '.docx']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_excel_sm.png', types: ['.xls', '.xlsx']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_ppt_sm.png', types: ['.ppt', '.pptx']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_visio_sm.png', types: ['.vsd']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_ps_sm.png', types: ['.psd']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_cad_sm.png', types: ['.dwg']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_flash_sm.png', types: ['.swf']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_music_sm.png', types: ['.mp3', '.wav']}, | |||
| { | |||
| icon: 'https://cdn.eleadmin.com/20200609/ic_file_video_sm.png', | |||
| types: ['.mp4', '.rmvb', '.flv', '.avi', '.3gp'] | |||
| }, | |||
| { | |||
| icon: 'https://cdn.eleadmin.com/20200609/ic_file_picture_sm.png', | |||
| types: ['.png', '.jpg', '.jpeg', '.gif', '.bmp'] | |||
| }, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_fonts_sm.png', types: ['.ttf', '.woff']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_bt_sm.png', types: ['.torrent']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_android_sm.png', types: ['.apk']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_exe_sm.png', types: ['.exe']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_ipa_sm.png', types: ['.ipa', '.dmg']}, | |||
| {icon: 'https://cdn.eleadmin.com/20200609/ic_file_zip_sm.png', types: ['.zip', '.rar', '.7z']}, | |||
| ]; | |||
| } | |||
| } | |||
| }, | |||
| computed: { | |||
| /* 是否显示复选框 */ | |||
| showCheckbox() { | |||
| return this.checked && Array.isArray(this.checked); | |||
| }, | |||
| /* 是否全选 */ | |||
| allChecked: { | |||
| get() { | |||
| return this.checked.length && (this.checked.length === this.data.length); | |||
| }, | |||
| set(value) { | |||
| this.$emit('update:checked', value ? [].concat(this.data) : []); | |||
| } | |||
| } | |||
| }, | |||
| methods: { | |||
| /* 图标 */ | |||
| getIcon(item) { | |||
| if (this.grid && item.thumbnail) return item.thumbnail; | |||
| let icons = this.grid ? this.icons : this.smIcons; | |||
| if (item.isDirectory) return icons.filter(d => d.type === 'dir')[0].icon; | |||
| let icon; | |||
| icons.forEach(d => { | |||
| if (d.types) { | |||
| d.types.forEach(s => { | |||
| if (item.name.endsWith(s)) { | |||
| icon = d.icon; | |||
| } | |||
| }); | |||
| } | |||
| }); | |||
| if (!icon) icon = icons.filter(d => d.type === 'file')[0].icon; | |||
| return icon; | |||
| }, | |||
| /* 选中 */ | |||
| choose(item) { | |||
| let index = this.checked.indexOf(item); | |||
| if (index === -1) { | |||
| this.$emit('update:checked', this.checked.concat([item])); | |||
| } else { | |||
| let temp = this.checked.slice(0, index).concat(this.checked.slice(index + 1, this.checked.length)); | |||
| this.$emit('update:checked', temp); | |||
| } | |||
| }, | |||
| /* item点击事件 */ | |||
| onItemClick(item) { | |||
| this.$emit('item-click', item); | |||
| }, | |||
| /* 排序点击事件 */ | |||
| onClickSort(name) { | |||
| let order = this.sort === name ? {'asc': 'desc', 'desc': 'asc'}[this.order] : 'asc'; | |||
| this.$emit('sort-change', {sort: name, order: order}); | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| /** 网格样式 */ | |||
| .ele-file-list { | |||
| box-sizing: border-box; | |||
| position: relative; | |||
| } | |||
| /* header */ | |||
| .ele-file-list .ele-file-list-header { | |||
| padding: 0 15px; | |||
| margin-bottom: 8px; | |||
| border-bottom: 1px solid hsla(0, 0%, 60%, .15); | |||
| box-sizing: border-box; | |||
| line-height: 36px; | |||
| font-size: 13px; | |||
| } | |||
| /* 全选框 */ | |||
| .ele-file-list .ele-file-list-header .ele-file-list-check-group { | |||
| display: inline-block; | |||
| cursor: pointer; | |||
| } | |||
| .ele-file-list .ele-file-list-header .ele-file-list-check-group .ele-file-list-check { | |||
| color: #FFF; | |||
| width: 15px; | |||
| height: 15px; | |||
| line-height: 15px; | |||
| text-align: center; | |||
| border-radius: 2px; | |||
| margin-right: 15px; | |||
| font-weight: 600; | |||
| font-size: 12px; | |||
| } | |||
| .ele-file-list .ele-file-list-header .ele-file-list-check-group .ele-file-list-check:not(.checked) { | |||
| width: 13px; | |||
| height: 13px; | |||
| line-height: 13px; | |||
| color: transparent !important; | |||
| background-color: transparent !important; | |||
| border: 1px solid hsla(0, 0%, 60%, .3); | |||
| } | |||
| /* item */ | |||
| .ele-file-list .ele-file-list-item { | |||
| display: inline-block; | |||
| box-sizing: border-box; | |||
| padding: 10px 3px 10px 3px; | |||
| margin: 0 0 8px 8px; | |||
| text-align: center; | |||
| position: relative; | |||
| cursor: pointer; | |||
| } | |||
| /* 图标 */ | |||
| .ele-file-list .ele-file-list-item .ele-file-list-item-icon { | |||
| position: relative; | |||
| } | |||
| .ele-file-list .ele-file-list-item .ele-file-list-item-icon > img { | |||
| width: 56px; | |||
| height: 56px; | |||
| margin: 14px 0; | |||
| display: inline-block; | |||
| } | |||
| .ele-file-list .ele-file-list-item .ele-file-list-item-icon > .ele-file-list-item-icon-image { | |||
| width: 84px; | |||
| height: 84px; | |||
| margin: 0; | |||
| object-fit: cover; | |||
| } | |||
| /* 标题 */ | |||
| .ele-file-list .ele-file-list-item .ele-file-list-item-title { | |||
| width: 110px; | |||
| font-size: 12px; | |||
| margin-top: 4px; | |||
| box-sizing: border-box; | |||
| overflow: hidden; | |||
| text-overflow: ellipsis; | |||
| word-break: break-all; | |||
| white-space: nowrap; | |||
| } | |||
| .ele-file-list .ele-file-list-item .ele-file-list-item-title:not(:hover) { | |||
| color: inherit; | |||
| } | |||
| /* 复选框 */ | |||
| .ele-file-list .ele-file-list-item .ele-file-list-item-check { | |||
| position: absolute; | |||
| right: 6px; | |||
| top: 6px; | |||
| border-radius: 50%; | |||
| display: none; | |||
| z-index: 1; | |||
| } | |||
| .ele-file-list .ele-file-list-item.checked .ele-file-list-item-check, | |||
| .ele-file-list .ele-file-list-item:hover .ele-file-list-item-check { | |||
| display: block; | |||
| } | |||
| .ele-file-list .ele-file-list-item .ele-file-list-item-check .el-icon-check { | |||
| color: #FFF; | |||
| font-size: 12px; | |||
| font-weight: 600; | |||
| border-radius: 50%; | |||
| width: 19px; | |||
| height: 19px; | |||
| line-height: 19px; | |||
| text-align: center; | |||
| display: block; | |||
| opacity: .35; | |||
| } | |||
| .ele-file-list .ele-file-list-item.checked .ele-file-list-item-check .el-icon-check { | |||
| opacity: 1; | |||
| } | |||
| /* 背景和边框 */ | |||
| .ele-file-list .ele-file-list-item .ele-file-list-item-bg, | |||
| .ele-file-list .ele-file-list-item .ele-file-list-item-border { | |||
| position: absolute; | |||
| top: 0; | |||
| left: 0; | |||
| width: 100%; | |||
| height: 100%; | |||
| border-radius: 5px; | |||
| box-sizing: border-box; | |||
| display: none; | |||
| } | |||
| .ele-file-list .ele-file-list-item:hover .ele-file-list-item-bg, | |||
| .ele-file-list .ele-file-list-item.checked .ele-file-list-item-bg { | |||
| opacity: .06; | |||
| display: block; | |||
| } | |||
| .ele-file-list .ele-file-list-item.checked .ele-file-list-item-border { | |||
| opacity: .3; | |||
| border-width: 1px; | |||
| border-style: solid; | |||
| display: block; | |||
| } | |||
| /* body */ | |||
| .ele-file-list .ele-file-list-item .ele-file-list-item-body { | |||
| position: relative; | |||
| z-index: 1; | |||
| } | |||
| /** 表格样式 */ | |||
| .ele-file-list-table { | |||
| position: relative; | |||
| } | |||
| /* item */ | |||
| .ele-file-list-table .ele-file-list-table-item { | |||
| font-size: 13px; | |||
| line-height: 44px; | |||
| position: relative; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item-header { | |||
| line-height: 36px; | |||
| cursor: pointer; | |||
| } | |||
| /* body */ | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-body { | |||
| display: flex; | |||
| align-items: center; | |||
| border-top: 1px solid hsla(0, 0%, 60%, .15); | |||
| position: relative; | |||
| z-index: 1; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item:last-child .ele-file-list-table-item-body { | |||
| border-bottom: 1px solid hsla(0, 0%, 60%, .15); | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item:first-child .ele-file-list-table-item-body { | |||
| border-top: none; | |||
| } | |||
| /* item body cells */ | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-check-group { | |||
| width: 45px; | |||
| padding-left: 15px; | |||
| box-sizing: border-box; | |||
| flex-shrink: 0; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-name { | |||
| flex: 1; | |||
| position: relative; | |||
| display: flex; | |||
| align-items: center; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-size { | |||
| width: 120px; | |||
| flex-shrink: 0; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-time { | |||
| width: 180px; | |||
| flex-shrink: 0; | |||
| } | |||
| /* 表格复选框 */ | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-check-group .ele-file-list-table-item-check { | |||
| color: #FFF; | |||
| width: 15px; | |||
| height: 15px; | |||
| line-height: 15px; | |||
| text-align: center; | |||
| border-radius: 2px; | |||
| font-weight: 600; | |||
| font-size: 12px; | |||
| cursor: pointer; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item:not(.checked) .ele-file-list-table-item-check-group .ele-file-list-table-item-check { | |||
| width: 13px; | |||
| height: 13px; | |||
| line-height: 13px; | |||
| color: transparent !important; | |||
| background-color: transparent !important; | |||
| border: 1px solid hsla(0, 0%, 60%, .3); | |||
| } | |||
| /* 图标和标题 */ | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-icon { | |||
| flex: 1; | |||
| height: 24px; | |||
| overflow: hidden; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-icon .ele-file-list-table-item-icon-image { | |||
| width: 24px; | |||
| height: 24px; | |||
| object-fit: cover; | |||
| display: inline-block; | |||
| vertical-align: top; | |||
| cursor: pointer; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-icon .ele-file-list-table-item-title { | |||
| display: inline; | |||
| padding-left: 10px; | |||
| box-sizing: border-box; | |||
| word-break: break-all; | |||
| vertical-align: top; | |||
| line-height: 24px; | |||
| cursor: pointer; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-icon .ele-file-list-table-item-title:not(:hover) { | |||
| color: inherit; | |||
| } | |||
| /* 工具按钮 */ | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-tool-group { | |||
| flex-shrink: 0; | |||
| display: none; | |||
| align-items: center; | |||
| box-sizing: border-box; | |||
| padding: 0 15px; | |||
| cursor: default; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item:hover .ele-file-list-table-item-tool-group { | |||
| display: flex; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-tool-group .ele-file-list-item-tool { | |||
| margin-right: 15px; | |||
| font-size: 18px; | |||
| cursor: pointer; | |||
| line-height: 1; | |||
| } | |||
| /* 背景和边框 */ | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-bg, | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-border { | |||
| position: absolute; | |||
| top: 0; | |||
| left: 0; | |||
| width: 100%; | |||
| height: 100%; | |||
| box-sizing: border-box; | |||
| display: none; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item:hover .ele-file-list-table-item-bg, | |||
| .ele-file-list-table .ele-file-list-table-item.checked .ele-file-list-table-item-bg { | |||
| opacity: .06; | |||
| display: block; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item:hover .ele-file-list-table-item-border, | |||
| .ele-file-list-table .ele-file-list-table-item:not(.ele-file-list-table-item-header):hover + .ele-file-list-table-item .ele-file-list-table-item-border, | |||
| .ele-file-list-table .ele-file-list-table-item.checked .ele-file-list-table-item-border, | |||
| .ele-file-list-table .ele-file-list-table-item.checked + .ele-file-list-table-item .ele-file-list-table-item-border { | |||
| opacity: .3; | |||
| border-top-width: 1px; | |||
| border-top-style: solid; | |||
| display: block; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item:not(.ele-file-list-table-item-header):last-child:hover .ele-file-list-table-item-border, | |||
| .ele-file-list-table .ele-file-list-table-item:not(.ele-file-list-table-item-header):last-child.checked .ele-file-list-table-item-border { | |||
| border-bottom-width: 1px; | |||
| border-bottom-style: solid; | |||
| } | |||
| /* 表头排序 */ | |||
| .ele-file-list-table-item-sort { | |||
| font-weight: 600; | |||
| margin-left: 5px; | |||
| } | |||
| /* 小屏幕样式 */ | |||
| @media screen and (max-width: 768px) { | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-size { | |||
| display: none; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-time { | |||
| display: none; | |||
| } | |||
| .ele-file-list-table .ele-file-list-table-item .ele-file-list-table-item-tool-group { | |||
| padding-right: 0; | |||
| } | |||
| } | |||
| </style> | |||
+ 107
- 0
src/components/EleIconPicker/icon-data.js
View File
| @@ -0,0 +1,107 @@ | |||
| /** 图标数据 License By http://eleadmin.com */ | |||
| export default [ | |||
| { | |||
| title: '线框', icons: [ | |||
| 'el-icon-circle-plus-outline', 'el-icon-remove-outline', 'el-icon-circle-check', 'el-icon-circle-close', 'el-icon-_question', 'el-icon-_info', | |||
| 'el-icon-warning-outline', 'el-icon-_warning', 'el-icon-_like', 'el-icon-_dis', 'el-icon-star-off', 'el-icon-_heart', | |||
| 'el-icon-delete', 'el-icon-user', 'el-icon-coordinate', 'el-icon-setting', 'el-icon-_setting', 'el-icon-more-outline', | |||
| 'el-icon-house', 'el-icon-bell', 'el-icon-chat-dot-square', 'el-icon-_language', 'el-icon-_network', 'el-icon-_bug', | |||
| 'el-icon-monitor', 'el-icon-data-line', 'el-icon-brush', 'el-icon-_integral', 'el-icon-_menu', 'el-icon-location-outline', | |||
| 'el-icon-collection', 'el-icon-document', 'el-icon-document-checked', 'el-icon-document-delete', 'el-icon-folder', 'el-icon-folder-opened', | |||
| 'el-icon-picture-outline', 'el-icon-camera', 'el-icon-video-camera', 'el-icon-phone-outline', 'el-icon-suitcase', 'el-icon-first-aid-kit', | |||
| 'el-icon-_backspace', 'el-icon-wind-power', 'el-icon-_wallet', 'el-icon-_fly', 'el-icon-_fire', 'el-icon-_flash', | |||
| 'el-icon-help', 'el-icon-_lamp', 'el-icon-_school', 'el-icon-goods', 'el-icon-_shop', 'el-icon-_table', | |||
| 'el-icon-_battery', 'el-icon-receiving', 'el-icon-_upload', 'el-icon-sort', 'el-icon-sort-up', 'el-icon-sort-down', | |||
| 'el-icon-arrow-left', 'el-icon-arrow-right', 'el-icon-arrow-down', 'el-icon-arrow-up', 'el-icon-top-left', 'el-icon-top-right', | |||
| 'el-icon-back', 'el-icon-right', 'el-icon-bottom', 'el-icon-top', 'el-icon-bottom-left', 'el-icon-bottom-right', | |||
| 'el-icon-d-arrow-left', 'el-icon-d-arrow-right', 'el-icon-zoom-in', 'el-icon-zoom-out', 'el-icon-plus', 'el-icon-minus', | |||
| 'el-icon-upload2', 'el-icon-download', 'el-icon-_download', 'el-icon-finished', 'el-icon-check', 'el-icon-close', | |||
| 'el-icon-s-operation', 'el-icon-set-up', 'el-icon-switch-button', 'el-icon-search', 'el-icon-view', 'el-icon-_eye-close', | |||
| 'el-icon-_more', 'el-icon-_nav', 'el-icon-s-fold', 'el-icon-s-unfold', 'el-icon-_fold', 'el-icon-_unfold', | |||
| 'el-icon-refresh', 'el-icon-refresh-right', 'el-icon-refresh-left', 'el-icon-loading', 'el-icon-_loading', 'el-icon-pie-chart', | |||
| 'el-icon-data-board', 'el-icon-data-analysis', 'el-icon-mobile-phone', 'el-icon-mobile', 'el-icon-_pad', 'el-icon-mouse', | |||
| 'el-icon-_zoom-in', 'el-icon-_zoom-out', 'el-icon-_screen-full', 'el-icon-_screen-restore', 'el-icon-full-screen', 'el-icon-_compress', | |||
| 'el-icon-copy-document', 'el-icon-rank', 'el-icon-crop', 'el-icon-_user-group', 'el-icon-_user-add', 'el-icon-postcard', | |||
| 'el-icon-_terminal', 'el-icon-_code', 'el-icon-_var', 'el-icon-_scan', 'el-icon-_logout', 'el-icon-_back-top', | |||
| 'el-icon-_back', 'el-icon-_forward', 'el-icon-_pushpin', 'el-icon-_palette', 'el-icon-_face-cry', 'el-icon-_face-smile', | |||
| 'el-icon-lock', 'el-icon-unlock', 'el-icon-key', 'el-icon-male', 'el-icon-female', 'el-icon-_transgender', | |||
| 'el-icon-time', 'el-icon-alarm-clock', 'el-icon-timer', 'el-icon-odometer', 'el-icon-stopwatch', 'el-icon-discover', | |||
| 'el-icon-_template', 'el-icon-_transfer', 'el-icon-_component', 'el-icon-_vercode', 'el-icon-_prerogative', 'el-icon-close-notification', | |||
| 'el-icon-chat-round', 'el-icon-chat-line-round', 'el-icon-chat-dot-round', 'el-icon-chat-square', 'el-icon-chat-line-square', 'el-icon-message', | |||
| 'el-icon-edit', 'el-icon-edit-outline', 'el-icon-_feedback', 'el-icon-_retrieve', 'el-icon-_visa', 'el-icon-tickets', | |||
| 'el-icon-notebook-1', 'el-icon-notebook-2', 'el-icon-reading', 'el-icon-files', 'el-icon-_save', 'el-icon-document-copy', | |||
| 'el-icon-document-remove', 'el-icon-document-add', 'el-icon-folder-add', 'el-icon-folder-remove', 'el-icon-folder-delete', 'el-icon-folder-checked', | |||
| 'el-icon-collection-tag', 'el-icon-price-tag', 'el-icon-discount', 'el-icon-paperclip', 'el-icon-link', 'el-icon-connection', | |||
| 'el-icon-printer', 'el-icon-takeaway-box', 'el-icon-scissors', 'el-icon-attract', 'el-icon-c-scale-to-original', 'el-icon-_straw', | |||
| 'el-icon-_surveying', 'el-icon-_font-family', 'el-icon-_font-size', 'el-icon-date', 'el-icon-_date-end', 'el-icon-_date-start', | |||
| 'el-icon-_horn', 'el-icon-_horn-close', 'el-icon-_camera', 'el-icon-headset', 'el-icon-video-play', 'el-icon-video-pause', | |||
| 'el-icon-_music', 'el-icon-_video', 'el-icon-film', 'el-icon-mic', 'el-icon-microphone', 'el-icon-turn-off-microphone', | |||
| 'el-icon-_aite', 'el-icon-_number', 'el-icon-_percentage', 'el-icon-_help', 'el-icon-_usd', 'el-icon-_rmb', | |||
| 'el-icon-_salary', 'el-icon-_refund', 'el-icon-_red-packet', 'el-icon-shopping-cart-1', 'el-icon-shopping-cart-2', 'el-icon-shopping-cart-full', | |||
| 'el-icon-shopping-bag-1', 'el-icon-shopping-bag-2', 'el-icon-sold-out', 'el-icon-sell', 'el-icon-wallet', 'el-icon-money', | |||
| 'el-icon-bank-card', 'el-icon-_evaluate', 'el-icon-_trending-up', 'el-icon-_trending-down', 'el-icon-_appointment', 'el-icon-_appointment-ok', | |||
| 'el-icon-position', 'el-icon-aim', 'el-icon-map-location', 'el-icon-location-information', 'el-icon-add-location', 'el-icon-delete-location', | |||
| 'el-icon-place', 'el-icon-_programme', 'el-icon-_infinite', 'el-icon-service', 'el-icon-suitcase-1', 'el-icon-_brush', | |||
| 'el-icon-present', 'el-icon-_target', 'el-icon-_api', 'el-icon-_timeline', 'el-icon-_condition', 'el-icon-_connecting-line', | |||
| 'el-icon-_temperature', 'el-icon-picture-outline-round', 'el-icon-_cols', 'el-icon-_share', 'el-icon-_keyboard', 'el-icon-_filter', | |||
| 'el-icon-_database', 'el-icon-coin', 'el-icon-_mate', 'el-icon-news', 'el-icon-open', 'el-icon-turn-off', | |||
| 'el-icon-_footprint', 'el-icon-box', 'el-icon-_hammer', 'el-icon-magic-stick', 'el-icon-_compute', 'el-icon-_function', | |||
| 'el-icon-bangzhu', 'el-icon-office-building', 'el-icon-school', 'el-icon-_snow' | |||
| ] | |||
| }, | |||
| { | |||
| title: '实心', icons: [ | |||
| 'el-icon-circle-plus', 'el-icon-remove', 'el-icon-success', 'el-icon-error', 'el-icon-question', 'el-icon-info', | |||
| 'el-icon-warning', 'el-icon-_warning-solid', 'el-icon-_like-solid', 'el-icon-_dis-solid', 'el-icon-star-on', 'el-icon-_heart-solid', | |||
| 'el-icon-delete-solid', 'el-icon-user-solid', 'el-icon-s-check', 'el-icon-s-tools', 'el-icon-_setting-solid', 'el-icon-more', | |||
| 'el-icon-s-home', 'el-icon-message-solid', 'el-icon-s-comment', 'el-icon-_language-solid', 'el-icon-_globe', 'el-icon-_bug-solid', | |||
| 'el-icon-s-platform', 'el-icon-s-marketing', 'el-icon-s-open', 'el-icon-_integral-solid', 'el-icon-menu', 'el-icon-location', | |||
| 'el-icon-s-management', 'el-icon-s-order', 'el-icon-s-claim', 'el-icon-s-release', 'el-icon-_folder', 'el-icon-_folder-open', | |||
| 'el-icon-picture', 'el-icon-camera-solid', 'el-icon-video-camera-solid', 'el-icon-phone', 'el-icon-s-cooperation', 'el-icon-_medkit-solid', | |||
| 'el-icon-_backspace-solid', 'el-icon-s-flag', 'el-icon-s-finance', 'el-icon-_airplane', 'el-icon-_fire-solid', 'el-icon-_flash-solid', | |||
| 'el-icon-s-help', 'el-icon-s-opportunity', 'el-icon-_school-solid', 'el-icon-s-goods', 'el-icon-s-shop', 'el-icon-s-grid', | |||
| 'el-icon-_battery-full', 'el-icon-_retrieve-solid', 'el-icon-upload', 'el-icon-d-caret', 'el-icon-caret-top', 'el-icon-caret-bottom', | |||
| 'el-icon-caret-left', 'el-icon-caret-right', 'el-icon-s-promotion', 'el-icon-s-ticket', 'el-icon-share', 'el-icon-s-custom', | |||
| 'el-icon-_lock-solid', 'el-icon-_unlock-solid', 'el-icon-_vercode-solid', 'el-icon-_email-solid', 'el-icon-_refund-solid', 'el-icon-_money-solid', | |||
| 'el-icon-_brush-solid', 'el-icon-_palette-solid', 'el-icon-_tag-sloid', 'el-icon-_puzzle-solid', 'el-icon-_prerogative-solid', 'el-icon-_prerogative2-solid', | |||
| 'el-icon-_service-solid', 'el-icon-_evaluate-solid', 'el-icon-_prerogative3-solid', 'el-icon-_present-sloid', 'el-icon-_red-packet-solid', 'el-icon-_ticket-sloid', | |||
| 'el-icon-_user-group-solid', 'el-icon-_camera2-solid', 'el-icon-_shopping-cart-sloid', 'el-icon-_time-solid', 'el-icon-_news-solid', 'el-icon-_database-solid', | |||
| 'el-icon-_postcard-solid', 'el-icon-_bus-sloid', 'el-icon-_car-sloid', 'el-icon-_truck-sloid', 'el-icon-_analysis-solid', 'el-icon-_pie-chart-solid', | |||
| 'el-icon-_compute-solid', 'el-icon-_live-solid', 'el-icon-_printer-solid', 'el-icon-_bank-card-solid', 'el-icon-_target-sloid', 'el-icon-_horn-sloid', | |||
| 'el-icon-_service', 'el-icon-_cube', 'el-icon-_sent', 'el-icon-_love', 'el-icon-_quote1', 'el-icon-_quote2', | |||
| 'el-icon-s-data', 'el-icon-_game-solid', 'el-icon-_fingerprint', 'el-icon-_barcode', 'el-icon-_qrcode', 'el-icon-_tree', | |||
| 'el-icon-_leaf', 'el-icon-_flask', 'el-icon-_nuclear', 'el-icon-_recycle', 'el-icon-_rocket', 'el-icon-platform-eleme', | |||
| 'el-icon-eleme', 'el-icon-_github', 'el-icon-_gitee', 'el-icon-_qq', 'el-icon-_wechat', 'el-icon-_wxpay', | |||
| 'el-icon-_alipay', 'el-icon-_taobao', 'el-icon-_weibo', 'el-icon-_qqzone', 'el-icon-_wxzone', 'el-icon-_twitter', | |||
| 'el-icon-_trophy-solid', 'el-icon-_zhihu', 'el-icon-_ie', 'el-icon-_chrome', 'el-icon-_windows', 'el-icon-_ios', | |||
| 'el-icon-_android', 'el-icon-_bluetooth-solid', 'el-icon-_bluetooth', 'el-icon-_wifi', 'el-icon-_rss', 'el-icon-_signal-box', | |||
| 'el-icon-_signal', 'el-icon-_usb', 'el-icon-_command-ios', 'el-icon-_walk', 'el-icon-_man', 'el-icon-_woman', | |||
| 'el-icon-_recommend' | |||
| ] | |||
| }, | |||
| { | |||
| title: '其他', icons: [ | |||
| 'el-icon-_state1', 'el-icon-_state2', 'el-icon-_state3', 'el-icon-_state4', 'el-icon-_state5', 'el-icon-_state6', | |||
| 'el-icon-_state7', 'el-icon-_state8', 'el-icon-_state9', 'el-icon-_state10', 'el-icon-_state11', 'el-icon-_state12', | |||
| 'el-icon-thumb', 'el-icon-guide', 'el-icon-cpu', 'el-icon-umbrella', 'el-icon-smoking', 'el-icon-no-smoking', | |||
| 'el-icon-bicycle', 'el-icon-_car', 'el-icon-_bus', 'el-icon-truck', 'el-icon-watch', 'el-icon-watch-1', | |||
| 'el-icon-medal', 'el-icon-medal-1', 'el-icon-trophy', 'el-icon-trophy-1', 'el-icon-toilet-paper', 'el-icon-table-lamp', | |||
| 'el-icon-ship', 'el-icon-refrigerator', 'el-icon-basketball', 'el-icon-football', 'el-icon-soccer', 'el-icon-baseball', | |||
| 'el-icon-moon', 'el-icon-moon-night', 'el-icon-sunrise', 'el-icon-sunrise-1', 'el-icon-sunny', 'el-icon-sunset', | |||
| 'el-icon-partly-cloudy', 'el-icon-cloudy', 'el-icon-cloudy-and-sunny', 'el-icon-heavy-rain', 'el-icon-light-rain', 'el-icon-lightning', | |||
| 'el-icon-dish', 'el-icon-dish-1', 'el-icon-food', 'el-icon-chicken', 'el-icon-fork-spoon', 'el-icon-knife-fork', | |||
| 'el-icon-burger', 'el-icon-tableware', 'el-icon-sugar', 'el-icon-dessert', 'el-icon-ice-cream', 'el-icon-hot-water', | |||
| 'el-icon-water-cup', 'el-icon-coffee-cup', 'el-icon-cold-drink', 'el-icon-goblet', 'el-icon-goblet-full', 'el-icon-goblet-square', | |||
| 'el-icon-goblet-square-full', 'el-icon-grape', 'el-icon-watermelon', 'el-icon-cherry', 'el-icon-apple', 'el-icon-pear', | |||
| 'el-icon-orange', 'el-icon-coffee', 'el-icon-ice-tea', 'el-icon-ice-drink', 'el-icon-milk-tea', 'el-icon-potato-strips', | |||
| 'el-icon-lollipop', 'el-icon-ice-cream-square', 'el-icon-ice-cream-round' | |||
| ] | |||
| } | |||
| ] | |||
+ 291
- 0
src/components/EleIconPicker/index.vue
View File
| @@ -0,0 +1,291 @@ | |||
| <!-- 图标选择器组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <el-popover v-model="show" :width="width" popper-class="ele-icon-picker-popper" | |||
| placement="bottom-start" transition="el-zoom-in-top" :disabled="disabled" | |||
| @show="afterEnter" @hide="afterLeave"> | |||
| <div :class="pickerClass" slot="reference"> | |||
| <slot v-bind:show="show" v-bind:value="value"> | |||
| <!-- 样式二 --> | |||
| <el-input v-if="theme==='style2'" v-model="value" :placeholder="placeholder" :clearable="clearable" | |||
| :disabled="disabled" :size="size" @focus="setReadonly"> | |||
| <template slot="append"><i :class="value"></i></template> | |||
| </el-input> | |||
| <!-- 样式三 --> | |||
| <el-input v-else-if="theme==='style3'" :prefix-icon="value" :disabled="disabled" :size="size" | |||
| readonly="readonly"> | |||
| <template slot="append"><i class="el-icon-arrow-down"></i></template> | |||
| </el-input> | |||
| <!-- 默认样式 --> | |||
| <el-input v-else v-model="value" :prefix-icon="value" :placeholder="placeholder" :clearable="clearable" | |||
| :disabled="disabled" :size="size" suffix-icon="el-icon-arrow-down" @focus="setReadonly"/> | |||
| </slot> | |||
| </div> | |||
| <el-tabs v-model="active"> | |||
| <el-tab-pane v-for="(item,index) in result" :key="index" :label="item.title" :name="item.title"> | |||
| <el-scrollbar v-if="listShow" style="height:225px;"> | |||
| <el-row> | |||
| <el-col :span="4" v-for="(d,i) in item.icons" :key="i"> | |||
| <el-card shadow="hover" class="ele-card-border" :title="d"> | |||
| <div class="ele-icon-picker-item" @click="choose(d)"><i :class="d"/></div> | |||
| </el-card> | |||
| </el-col> | |||
| </el-row> | |||
| </el-scrollbar> | |||
| <div v-else style="height:225px;line-height: 225px;text-align: center;">加载中..</div> | |||
| </el-tab-pane> | |||
| </el-tabs> | |||
| <el-input v-if="search" v-model="keywords" placeholder="搜索..." size="mini" suffix-icon="el-icon-search" | |||
| class="ele-icon-picker-search"/> | |||
| </el-popover> | |||
| </template> | |||
| <script> | |||
| import icons from './icon-data' | |||
| export default { | |||
| name: "EleIconPicker", | |||
| model: { | |||
| prop: 'value', | |||
| event: 'change' | |||
| }, | |||
| props: { | |||
| value: String, // 选中图标 | |||
| placeholder: String, // 提示文本 | |||
| width: { // 宽度 | |||
| type: Number, | |||
| default: 380 | |||
| }, | |||
| data: { // 图标数据 | |||
| type: Array, | |||
| default() { | |||
| return icons | |||
| } | |||
| }, | |||
| size: String, // 尺寸 | |||
| readonly: { // 是否只读 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| disabled: Boolean, // 是否禁用 | |||
| clearable: { // 是否显示清除 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| theme: String, // 风格样式 | |||
| search: { // 是否显示搜索 | |||
| type: Boolean, | |||
| default: true | |||
| } | |||
| }, | |||
| data() { | |||
| return { | |||
| show: false, // 是否显示pop | |||
| keywords: '', // 搜索关键字 | |||
| listShow: false, // 是否显示列表 | |||
| timer: null | |||
| } | |||
| }, | |||
| computed: { | |||
| /* class */ | |||
| pickerClass() { | |||
| return [ | |||
| 'ele-icon-picker', | |||
| {'ele-icon-picker-open': this.show}, | |||
| {'ele-icon-picker-style2': this.theme === 'style2'}, | |||
| {'ele-icon-picker-style3': this.theme === 'style3'} | |||
| ]; | |||
| }, | |||
| /* 搜索后的结果 */ | |||
| result() { | |||
| if (!this.keywords) return this.data; | |||
| let result = []; | |||
| this.data.forEach(item => { | |||
| result.push({title: item.title, icons: item.icons.filter(d => d.indexOf(this.keywords) !== -1)}); | |||
| }); | |||
| return result; | |||
| }, | |||
| /* 标签页选中位置 */ | |||
| active: { | |||
| get() { | |||
| if (!this.result || this.result.length === 0) return null; | |||
| for (let i = 0; i < this.result.length; i++) | |||
| if (this.result[i].icons.length !== 0) return this.result[i].title; | |||
| return null; | |||
| }, | |||
| set() { | |||
| } | |||
| } | |||
| }, | |||
| methods: { | |||
| /* 选择图标 */ | |||
| choose(value) { | |||
| this.show = false; | |||
| this.$emit('change', value); | |||
| }, | |||
| /* 设置input只读 */ | |||
| setReadonly(e) { | |||
| if (this.readonly) e.target.readOnly = true; | |||
| }, | |||
| /* 弹出面板打开 */ | |||
| afterEnter() { | |||
| if (this.timer) clearTimeout(this.timer); | |||
| this.timer = setTimeout(() => { | |||
| this.listShow = true; | |||
| }, 50); | |||
| }, | |||
| /* 弹出面板关闭 */ | |||
| afterLeave() { | |||
| if (this.timer) clearTimeout(this.timer); | |||
| this.listShow = false; | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| /* 弹出面板 */ | |||
| .ele-icon-picker-popper.el-popover { | |||
| max-width: 100%; | |||
| padding: 4px 3px 15px 15px; | |||
| } | |||
| .ele-icon-picker-popper.el-popover .popper__arrow { | |||
| left: 35px !important; | |||
| } | |||
| /* 选项卡 */ | |||
| .ele-icon-picker-popper .el-tabs .el-tabs__item { | |||
| padding: 0 12px !important; | |||
| } | |||
| .ele-icon-picker-popper .el-tabs .el-tabs__header { | |||
| margin: 0 12px 5px 0; | |||
| } | |||
| .ele-icon-picker-popper .el-tabs .el-tabs__header .el-tabs__nav-wrap:after { | |||
| right: 12px; | |||
| width: auto; | |||
| } | |||
| /* 图标 */ | |||
| .ele-icon-picker-popper .el-card { | |||
| margin: 10px 12px 0 0; | |||
| } | |||
| .ele-icon-picker-popper .el-card__body { | |||
| padding: 0; | |||
| } | |||
| .ele-icon-picker-popper .ele-icon-picker-item { | |||
| display: block; | |||
| padding: 8px 0; | |||
| font-size: 20px; | |||
| text-align: center; | |||
| transition: transform .1s; | |||
| cursor: pointer; | |||
| } | |||
| .ele-icon-picker-popper .ele-icon-picker-item:hover { | |||
| transform: scale(1.5); | |||
| } | |||
| /* 滚动条 */ | |||
| .ele-icon-picker-popper .el-scrollbar__wrap { | |||
| overflow-x: hidden; | |||
| margin-right: 0 !important; | |||
| } | |||
| .ele-icon-picker-popper .el-scrollbar__wrap::-webkit-scrollbar { | |||
| width: 0; | |||
| height: 0; | |||
| } | |||
| /* 搜索框 */ | |||
| .ele-icon-picker-popper .ele-icon-picker-search { | |||
| width: 110px; | |||
| position: absolute; | |||
| right: 15px; | |||
| top: 8px; | |||
| } | |||
| /* 默认样式 */ | |||
| .ele-icon-picker .el-input:not(.is-disabled), | |||
| .ele-icon-picker .el-input:not(.is-disabled) .el-input__inner, | |||
| .ele-icon-picker .el-input-group__append { | |||
| cursor: pointer; | |||
| } | |||
| .ele-icon-picker .is-disabled > .el-input-group__append { | |||
| cursor: not-allowed; | |||
| } | |||
| .ele-icon-picker .el-input:not(.is-disabled) .el-input__prefix, | |||
| .ele-icon-picker:not(.ele-icon-picker-style3) .el-input:not(.is-disabled) .el-input-group__append { | |||
| color: unset; | |||
| } | |||
| .ele-icon-picker .el-input__suffix .el-icon-arrow-down, | |||
| .ele-icon-picker-style3 .el-input-group__append .el-icon-arrow-down { | |||
| transition: transform .3s; | |||
| } | |||
| .ele-icon-picker-open .el-input .el-input__suffix .el-icon-arrow-down, | |||
| .ele-icon-picker-style3.ele-icon-picker-open .el-input-group__append .el-icon-arrow-down { | |||
| transform: rotate(-180deg); | |||
| } | |||
| .ele-icon-picker .el-input__suffix .el-input__clear { | |||
| position: absolute; | |||
| top: 0; | |||
| right: 0; | |||
| } | |||
| .ele-icon-picker .el-input__suffix .el-input__clear:before { | |||
| background-color: #fff; | |||
| border-radius: 50%; | |||
| } | |||
| /* 样式二 */ | |||
| .ele-icon-picker-style2 .el-input-group__append { | |||
| min-width: 39px; | |||
| padding-left: 12px; | |||
| padding-right: 12px; | |||
| box-sizing: border-box; | |||
| } | |||
| .ele-icon-picker-style2 .el-input__suffix { | |||
| transition: transform 0s; | |||
| } | |||
| /* 样式三 */ | |||
| .ele-icon-picker-style3 { | |||
| display: inline-block; | |||
| } | |||
| .ele-icon-picker-style3 .el-input { | |||
| width: auto; | |||
| } | |||
| .ele-icon-picker-style3 .el-input__inner { | |||
| width: 47px; | |||
| pointer-events: none; | |||
| } | |||
| .ele-icon-picker-style3 .el-input__prefix { | |||
| left: 12px; | |||
| } | |||
| .ele-icon-picker-style3 .el-input-group__append { | |||
| padding-left: 5px; | |||
| padding-right: 5px; | |||
| } | |||
| .ele-icon-picker-style3 .el-input:not(.is-disabled) .el-input-group__append { | |||
| background-color: transparent; | |||
| } | |||
| .ele-icon-picker-style3 .el-input:not(.is-disabled) .el-input-group__append:hover { | |||
| background-color: rgba(0, 0, 0, .02); | |||
| } | |||
| </style> | |||
+ 573
- 0
src/components/EleMapPicker/index.vue
View File
| @@ -0,0 +1,573 @@ | |||
| <!-- 地图位置选择器组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <el-dialog :visible="show" :title="title" :width="width" :custom-class="dialogClass" :show-close="showClose" | |||
| :close-on-click-modal="closeOnClickModal" :close-on-press-escape="closeOnPressEscape" | |||
| :destroy-on-close="destroyOnClose" @update:visible="d => $emit('update:show', d)" | |||
| :lock-scroll="lockScroll" :append-to-body="appendToBody" :modal-append-to-body="modalAppendToBody" | |||
| :modal="modal" :top="top" @open="onOpen" @closed="onClosed"> | |||
| <div v-if="showMap" v-loading="loading"> | |||
| <div class="ele-map-picker-header"> | |||
| <div class="ele-map-picker-header-search"> | |||
| <el-autocomplete v-model="suggestionKeyWord" :fetch-suggestions="searchSuggestions" @blur="onSuggestionBlur" | |||
| :placeholder="searchPlaceholder" :popper-class="searchPopClass" @select="onSuggestionChoose"> | |||
| <i class="el-icon-search el-input__icon" slot="suffix"></i> | |||
| <template slot-scope="{item}"> | |||
| <div class="ele-map-picker-poi-item ele-map-picker-suggestion-item"> | |||
| <i class="ele-map-picker-poi-item-icon el-icon-search"></i> | |||
| <div class="ele-map-picker-poi-item-title">{{ item.name }}</div> | |||
| <div v-if="item.address" class="ele-map-picker-poi-item-address">{{ item.address }}</div> | |||
| </div> | |||
| </template> | |||
| </el-autocomplete> | |||
| </div> | |||
| <el-button :loading="doneLoading" type="primary" @click="done" icon="el-icon-check" class="ele-btn-icon">确定 | |||
| </el-button> | |||
| </div> | |||
| <div class="ele-map-picker-body"> | |||
| <div class="ele-map-picker-main"> | |||
| <div ref="eleMapPickerMap" :style="mapStyle"></div> | |||
| <i :class="['ele-map-picker-main-plus el-icon-plus',{'ele-map-picker-hide':searchType!==0}]"></i> | |||
| <img :class="iconClass" :src="markerSrc" alt=""/> | |||
| </div> | |||
| <div class="ele-map-picker-poi-list" :style="mapStyle" v-loading="poiLoading"> | |||
| <div v-for="(poi,index) in poiData" :key="index" @click="choose(index)" | |||
| :class="['ele-map-picker-poi-item',{'ele-map-picker-poi-item-active':index===chooseIndex}]"> | |||
| <i class="ele-map-picker-poi-item-icon el-icon-location-outline"></i> | |||
| <div class="ele-map-picker-poi-item-title">{{ poi.name }}</div> | |||
| <div v-if="poi.address" class="ele-map-picker-poi-item-address">{{ poi.address }}</div> | |||
| <i class="el-icon-circle-check ele-map-picker-poi-item-check"></i> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </el-dialog> | |||
| </template> | |||
| <script> | |||
| import AMapLoader from '@amap/amap-jsapi-loader' | |||
| export default { | |||
| name: "EleMapPicker", | |||
| props: { | |||
| height: { // 地图的高度 | |||
| type: String, | |||
| default: '450px' | |||
| }, | |||
| center: Array, // 地图默认中心点 | |||
| zoom: { // 地图初始缩放级别 | |||
| type: Number, | |||
| default: 11 | |||
| }, | |||
| chooseZoom: { // 地图选中后缩放级别 | |||
| type: Number, | |||
| default: 17 | |||
| }, | |||
| poiSize: { // poi检索每页数量 | |||
| type: Number, | |||
| default: 30 | |||
| }, | |||
| poiType: { // poi检索兴趣点类别 | |||
| type: String, | |||
| default: '' | |||
| }, | |||
| poiKeywords: { // poi检索关键字 | |||
| type: String, | |||
| default: '' | |||
| }, | |||
| poiRadius: { // poi检索半径 | |||
| type: Number, | |||
| default: 1000 | |||
| }, | |||
| needCity: Boolean, // 是否返回行政区 | |||
| forceChoose: { // 是否强制选择 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| suggestionCity: { // 搜索建议的城市范围 | |||
| type: String, | |||
| default: '全国' | |||
| }, | |||
| searchType: { // 地点检索类型,0:POI检索,1:关键字检索 | |||
| type: Number, | |||
| default: 0 | |||
| }, | |||
| searchPlaceholder: { | |||
| type: String, | |||
| default: '输入关键字搜索' | |||
| }, | |||
| markerSrc: { // marker图标地址 | |||
| type: String, | |||
| default: 'https://3gimg.qq.com/lightmap/components/locationPicker2/image/marker.png' | |||
| }, | |||
| mapKey: { // 地图默认的key | |||
| type: String, | |||
| default: '006d995d433058322319fa797f2876f5' | |||
| }, | |||
| mapVersion: { // 地图默认版本号 | |||
| type: String, | |||
| default: '2.0' | |||
| }, | |||
| /* 弹窗参数 */ | |||
| title: { // 弹窗的标题 | |||
| type: String, | |||
| default: '选择位置' | |||
| }, | |||
| width: { // 弹窗的宽度 | |||
| type: String, | |||
| default: '780px' | |||
| }, | |||
| customClass: String, // Dialog 的自定义类名 | |||
| closeOnClickModal: { // 是否可以通过点击 modal 关闭 Dialog | |||
| type: Boolean, | |||
| default: false | |||
| }, | |||
| closeOnPressEscape: { // 是否可以通过按下 ESC 关闭 Dialog | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| showClose: { // 是否显示关闭按钮 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| lockScroll: { // 是否在 Dialog 出现时将 body 滚动锁定 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| appendToBody: Boolean, // Dialog 自身是否插入至 body 元素上 | |||
| modalAppendToBody: { // 遮罩层是否插入至 body 元素上 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| modal: { // 是否需要遮罩层 | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| top: String, // Dialog CSS 中的 margin-top 值 | |||
| destroyOnClose: { // 关闭时销毁 Dialog 中的元素 | |||
| type: Boolean, | |||
| default: false | |||
| }, | |||
| show: Boolean // 是否显示 | |||
| }, | |||
| data() { | |||
| return { | |||
| showMap: false, // 是否显示地图 | |||
| map: null, // 地图实例 | |||
| centerMarker: null, // 地图中心标记点 | |||
| placeSearch: null, // poi检索实例 | |||
| autoComplete: null, // 输入建议实例 | |||
| poiData: [], // poi检索的数据 | |||
| chooseIndex: null, // 选中的数据 | |||
| isSelMove: false, // 是否是点击poi列表移动地图 | |||
| showIconAnim: false, // 图标是否显示跳动动画 | |||
| suggestionKeyWord: '', // 搜索输入内容 | |||
| lastSuggestion: '', // 上次搜索输入内容 | |||
| suggestionData: [], // 搜索建议列表 | |||
| chooseSuggestion: null, // 选中的建议 | |||
| loading: true, // 初始化loading | |||
| poiLoading: false, // poi检索loading | |||
| doneLoading: false // 确定按钮loading | |||
| } | |||
| }, | |||
| computed: { | |||
| /* 地图的样式 */ | |||
| mapStyle() { | |||
| return {'height': this.height} | |||
| }, | |||
| /* 弹窗的class */ | |||
| dialogClass() { | |||
| return ['ele-map-picker-dialog', this.customClass || ''].join(' '); | |||
| }, | |||
| /* 跳动图标的class */ | |||
| iconClass() { | |||
| return [ | |||
| 'ele-map-picker-main-icon', | |||
| {'ele-map-picker-anim-bounce': this.showIconAnim}, | |||
| {'ele-map-picker-hide': this.searchType !== 0} | |||
| ]; | |||
| }, | |||
| /* 搜索建议pop的class */ | |||
| searchPopClass() { | |||
| return ['ele-map-picker-search-pop', this.searchType !== 0 ? 'ele-map-picker-hide' : ''].join(' '); | |||
| } | |||
| }, | |||
| methods: { | |||
| /* 渲染地图 */ | |||
| render() { | |||
| AMapLoader.load({ | |||
| 'key': this.mapKey, | |||
| 'version': this.mapVersion, | |||
| 'plugins': ['AMap.PlaceSearch', 'AMap.AutoComplete'] | |||
| }).then((AMap) => { | |||
| this.loading = false; | |||
| this.poiLoading = true; | |||
| // 渲染地图 | |||
| this.map = new AMap.Map(this.$refs.eleMapPickerMap, { | |||
| resizeEnable: true, // 监控地图容器尺寸变化 | |||
| zoom: this.zoom, // 初缩放级别 | |||
| center: this.center // 初始中心点 | |||
| }); | |||
| // 获取poi检索实例 | |||
| this.placeSearch = new AMap.PlaceSearch({ | |||
| type: this.poiType, pageSize: this.poiSize, pageIndex: 1 | |||
| }); | |||
| // 获取输入建议实例 | |||
| this.autoComplete = new AMap.AutoComplete({city: this.suggestionCity}); | |||
| // 地图加载完成事件 | |||
| this.map.on('complete', () => { | |||
| this.chooseIndex = null; | |||
| let center = this.map.getCenter(); | |||
| this.searchNearBy(center.lat, center.lng, true); | |||
| }); | |||
| // 地图移动结束事件 | |||
| this.map.on('moveend', () => { | |||
| if (this.isSelMove) { // poi列表点击的移动 | |||
| this.isSelMove = false; | |||
| } else { // 拖动或搜索建议的移动 | |||
| this.showIconAnim = false; | |||
| this.$nextTick(() => { | |||
| setTimeout(() => { | |||
| this.showIconAnim = true; | |||
| }, 0); | |||
| }); | |||
| let center = this.map.getCenter(); | |||
| this.searchNearBy(center.lat, center.lng); | |||
| } | |||
| }); | |||
| // 地图中心marker | |||
| this.centerMarker = new AMap.Marker({ | |||
| icon: new AMap.Icon({ | |||
| image: this.markerSrc, size: new AMap.Size(26, 36.5), imageSize: new AMap.Size(26, 36.5) | |||
| }), | |||
| offset: new AMap.Pixel(-13, -36.5) | |||
| }); | |||
| }).catch(e => { | |||
| this.loading = false; | |||
| console.error(e); | |||
| }); | |||
| }, | |||
| /* poi检索 */ | |||
| searchNearBy(lat, lng, force) { | |||
| if (!force && this.searchType !== 0) return this.poiLoading = false; // 非POI检索模式 | |||
| if (!this.placeSearch) return; | |||
| this.poiLoading = true; | |||
| this.placeSearch.searchNearBy(this.poiKeywords, [lng, lat], this.poiRadius, (status, result) => { | |||
| this.poiLoading = false; | |||
| if (status === 'complete') { | |||
| let data = result.poiList.pois.filter(p => p.location !== undefined); | |||
| if (this.chooseSuggestion) { // 如果选中的搜索建议不在poi列表中则添加 | |||
| if (data.length === 0 || data[0].name !== this.chooseSuggestion.name) { | |||
| data.unshift(Object.assign({}, this.chooseSuggestion)); | |||
| } | |||
| this.chooseSuggestion = null; | |||
| } else { | |||
| this.chooseIndex = null; | |||
| } | |||
| this.poiData = data; | |||
| } | |||
| }); | |||
| }, | |||
| /* poi列表选中 */ | |||
| choose(index) { | |||
| this.chooseIndex = index; | |||
| this.isSelMove = true; | |||
| this.showIconAnim = false; | |||
| this.$nextTick(() => { | |||
| setTimeout(() => { | |||
| this.showIconAnim = true; | |||
| }, 0); | |||
| }); | |||
| let point = this.poiData[index].location; | |||
| this.map.setZoomAndCenter(this.chooseZoom, [point.lng, point.lat]); | |||
| // 添加标记点 | |||
| if (this.searchType !== 0) { // 非poi检索类型给地图添加中心标记点 | |||
| this.centerMarker.setPosition([point.lng, point.lat]); | |||
| this.map.add(this.centerMarker); | |||
| } | |||
| }, | |||
| /* 搜索建议 */ | |||
| searchSuggestions(keywords, callback) { | |||
| if (!this.autoComplete || !keywords || this.lastSuggestion === keywords) return callback(this.suggestionData); | |||
| if (this.searchType !== 0) this.poiLoading = true; | |||
| this.lastSuggestion = keywords; | |||
| this.autoComplete.search(keywords, (status, result) => { | |||
| if (this.searchType === 0) { // POI检索模式 | |||
| if (result.tips) { | |||
| result.tips.forEach(d => { | |||
| d.value = ''; | |||
| if (Array.isArray(d.address)) d.address = d.address[0]; | |||
| }); | |||
| this.suggestionData = result.tips; | |||
| } else { | |||
| this.suggestionData = []; | |||
| } | |||
| callback(this.suggestionData); | |||
| } else { // 关键字检索模式 | |||
| if (result.tips) { | |||
| result.tips.forEach(d => { | |||
| d.value = ''; | |||
| if (Array.isArray(d.address)) d.address = d.address[0]; | |||
| }); | |||
| this.poiData = result.tips; | |||
| } else { | |||
| this.poiData = []; | |||
| } | |||
| this.chooseIndex = null; | |||
| this.map.remove(this.centerMarker); | |||
| this.poiLoading = false; | |||
| callback([]); | |||
| } | |||
| }); | |||
| }, | |||
| /* 搜索建议选中 */ | |||
| onSuggestionChoose(item) { | |||
| this.chooseSuggestion = item; | |||
| this.chooseIndex = 0; | |||
| if (this.poiData.length === 0 || this.poiData[0].name !== this.chooseSuggestion.name) { | |||
| this.poiData.unshift(Object.assign({}, this.chooseSuggestion)); | |||
| } | |||
| let point = item.location; | |||
| if (point) this.map.setZoomAndCenter(this.chooseZoom, [point.lng, point.lat]); | |||
| }, | |||
| /* 搜索建议框失去焦点 */ | |||
| onSuggestionBlur() { | |||
| if (this.searchType === 0) this.suggestionKeyWord = ''; | |||
| }, | |||
| /* 确定选择 */ | |||
| done() { | |||
| if (!this.map) return; | |||
| let location; | |||
| if (this.chooseIndex === null) { | |||
| if (this.forceChoose) { // 强制选择 | |||
| return this.$message.error('请点击列表选中位置'); | |||
| } else { // 未选择使用地图中心点 | |||
| location = Object.assign({}, this.map.getCenter()); | |||
| } | |||
| } else { | |||
| location = Object.assign({ | |||
| name: this.poiData[this.chooseIndex].name, | |||
| address: this.poiData[this.chooseIndex].address || '' | |||
| }, this.poiData[this.chooseIndex].location); | |||
| } | |||
| if (this.needCity) { // 获取行政区 | |||
| this.doneLoading = true; | |||
| this.map.setCenter([location.lng, location.lat]); | |||
| this.map.getCity((result) => { | |||
| this.doneLoading = false; | |||
| location.city = result; | |||
| this.$emit('done', location); | |||
| }); | |||
| } else { | |||
| this.$emit('done', location); | |||
| } | |||
| }, | |||
| onOpen() { | |||
| this.showMap = true; | |||
| if (this.destroyOnClose || this.map === null) { | |||
| this.render(); // 渲染地图 | |||
| this.$emit('open'); | |||
| } | |||
| }, | |||
| onClosed() { | |||
| this.$emit('closed'); | |||
| if (this.destroyOnClose) { | |||
| this.showMap = false; | |||
| this.suggestionKeyWord = ''; | |||
| this.lastSuggestion = ''; | |||
| this.poiData = []; | |||
| this.chooseIndex = null; | |||
| this.suggestionData = []; | |||
| this.chooseSuggestion = null; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| .ele-map-picker-dialog .el-dialog__body { | |||
| padding: 0; | |||
| } | |||
| /* 工具栏 */ | |||
| .ele-map-picker-header { | |||
| padding: 8px 18px; | |||
| display: flex; | |||
| } | |||
| .ele-map-picker-header-search { | |||
| flex: 1; | |||
| } | |||
| .ele-map-picker-header-search .el-autocomplete { | |||
| max-width: 200px; | |||
| } | |||
| /* 地图 */ | |||
| .ele-map-picker-body { | |||
| display: flex; | |||
| border-top: 1px solid hsla(0, 0%, 60%, .15); | |||
| } | |||
| .ele-map-picker-main { | |||
| flex: 1; | |||
| position: relative; | |||
| border-bottom-left-radius: 4px; | |||
| overflow: hidden; | |||
| } | |||
| .ele-map-picker-main-plus { | |||
| color: #3b74ff; | |||
| font-size: 12px; | |||
| font-weight: 600; | |||
| position: absolute; | |||
| top: 50%; | |||
| left: 50%; | |||
| transform: translate(-50%, -50%); | |||
| } | |||
| .ele-map-picker-main-icon { | |||
| width: 26px; | |||
| position: absolute; | |||
| left: 50%; | |||
| bottom: 50%; | |||
| margin-left: -13px; | |||
| } | |||
| /* poi列表 */ | |||
| .ele-map-picker-poi-list { | |||
| width: 300px; | |||
| overflow: auto; | |||
| } | |||
| .ele-map-picker-poi-item { | |||
| padding: 8px 30px 8px 44px; | |||
| border-bottom: 1px solid hsla(0, 0%, 60%, .15); | |||
| position: relative; | |||
| cursor: pointer; | |||
| } | |||
| .ele-map-picker-poi-item:hover { | |||
| background-color: hsla(0, 0%, 60%, .05); | |||
| } | |||
| .ele-map-picker-poi-item-icon { | |||
| position: absolute; | |||
| top: 50%; | |||
| left: 14px; | |||
| transform: translateY(-50%); | |||
| font-size: 20px; | |||
| opacity: .4; | |||
| } | |||
| .ele-map-picker-poi-item-title { | |||
| font-size: 14px; | |||
| } | |||
| .ele-map-picker-poi-item-address { | |||
| font-size: 12px; | |||
| margin-top: 2px; | |||
| opacity: .6; | |||
| } | |||
| .ele-map-picker-poi-item .ele-map-picker-poi-item-check { | |||
| position: absolute; | |||
| top: 50%; | |||
| right: 7px; | |||
| transform: translateY(-50%); | |||
| color: #3b74ff; | |||
| font-size: 16px; | |||
| display: none; | |||
| } | |||
| .ele-map-picker-poi-item-active .ele-map-picker-poi-item-check { | |||
| display: block; | |||
| } | |||
| /* 地图图标跳动动画 */ | |||
| .ele-map-picker-anim-bounce { | |||
| animation: elePickerAnimBounce 500ms; | |||
| animation-direction: alternate; | |||
| } | |||
| @keyframes elePickerAnimBounce { | |||
| 0%, 60%, 75%, 90%, to { | |||
| transition-timing-function: cubic-bezier(.215, .61, .355, 1) | |||
| } | |||
| 0%, to { | |||
| transform: translate3d(0, 0, 0) | |||
| } | |||
| 25% { | |||
| transform: translate3d(0, -10px, 0) | |||
| } | |||
| 50% { | |||
| transform: translate3d(0, -20px, 0) | |||
| } | |||
| 75% { | |||
| transform: translate3d(0, -10px, 0) | |||
| } | |||
| } | |||
| /* 搜索建议列表 */ | |||
| .ele-map-picker-suggestion-item { | |||
| padding-right: 0; | |||
| padding-left: 24px; | |||
| line-height: normal; | |||
| border: none; | |||
| } | |||
| .ele-map-picker-suggestion-item:hover { | |||
| background-color: transparent; | |||
| } | |||
| .ele-map-picker-suggestion-item .ele-map-picker-poi-item-icon { | |||
| left: 0; | |||
| font-size: 14px; | |||
| font-weight: 600; | |||
| opacity: .3; | |||
| } | |||
| .ele-map-picker-suggestion-item .ele-map-picker-poi-item-address, | |||
| .ele-map-picker-suggestion-item .ele-map-picker-poi-item-title { | |||
| margin: 0; | |||
| overflow: hidden; | |||
| text-overflow: ellipsis; | |||
| word-break: break-all; | |||
| } | |||
| .ele-map-picker-search-pop { | |||
| max-width: 100%; | |||
| width: 240px !important; | |||
| } | |||
| .ele-map-picker-search-pop .el-autocomplete-suggestion__wrap { | |||
| max-height: 320px; | |||
| } | |||
| .ele-map-picker-hide { | |||
| display: none !important; | |||
| } | |||
| /* 小屏幕适应 */ | |||
| @media screen and (max-width: 768px) { | |||
| .ele-map-picker-dialog { | |||
| margin: 0 !important; | |||
| width: 100vw !important; | |||
| max-width: unset !important; | |||
| border-radius: 0 !important; | |||
| } | |||
| .ele-map-picker-body { | |||
| display: block; | |||
| } | |||
| .ele-map-picker-main > div { | |||
| height: 250px !important; | |||
| } | |||
| .ele-map-picker-poi-list { | |||
| width: auto; | |||
| height: calc(100vh - 353px) !important; | |||
| } | |||
| } | |||
| </style> | |||
+ 74
- 0
src/components/EleResult/index.vue
View File
| @@ -0,0 +1,74 @@ | |||
| <!-- 操作结果组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <div class="ele-result"> | |||
| <i :class="['ele-result-icon',icon]"></i> | |||
| <h2 class="ele-result-title" v-if="title">{{ title }}</h2> | |||
| <div class="ele-result-desc ele-text-secondary" v-if="desc">{{ desc }}</div> | |||
| <div class="ele-result-extra ele-bg-base"> | |||
| <slot></slot> | |||
| </div> | |||
| <div class="ele-result-actions"> | |||
| <slot name="actions"></slot> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "EleResult", | |||
| props: { | |||
| type: { | |||
| type: String, | |||
| default: 'success' | |||
| }, | |||
| title: String, | |||
| desc: String | |||
| }, | |||
| computed: { | |||
| icon() { | |||
| if (this.type === 'success') return 'el-icon-check ele-bg-success'; | |||
| if (this.type === 'fail') return 'el-icon-close ele-bg-danger'; | |||
| return this.type; | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| .ele-result { | |||
| text-align: center; | |||
| } | |||
| .ele-result .ele-result-icon { | |||
| width: 72px; | |||
| height: 72px; | |||
| line-height: 72px; | |||
| font-size: 42px; | |||
| color: #FFF; | |||
| text-align: center; | |||
| border-radius: 50%; | |||
| display: inline-block; | |||
| margin-bottom: 24px; | |||
| } | |||
| .ele-result .ele-result-title { | |||
| line-height: 32px; | |||
| margin-bottom: 16px; | |||
| } | |||
| .ele-result .ele-result-desc { | |||
| font-size: 14px; | |||
| line-height: 22px; | |||
| margin-bottom: 24px; | |||
| } | |||
| .ele-result .ele-result-extra { | |||
| text-align: left; | |||
| padding: 24px 40px; | |||
| border-radius: 4px; | |||
| } | |||
| .ele-result .ele-result-actions { | |||
| margin-top: 32px; | |||
| } | |||
| </style> | |||
+ 140
- 0
src/components/EleTagsInput/index.vue
View File
| @@ -0,0 +1,140 @@ | |||
| <!-- 标签输入框组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <div class="ele-tags-input"> | |||
| <el-tag v-for="(text,index) in data" :key="index" :size="size" :effect="effect" :disable-transitions="true" | |||
| :type="type" @close="removeTag(index)" closable>{{ text }} | |||
| </el-tag> | |||
| <el-input ref="eleTagsInput" v-if="edit" v-model="editValue" :size="size" | |||
| @keyup.enter.native="saveEdit" @blur="saveEdit" :style="editStyle"/> | |||
| <el-button v-else :size="size" @click="showEdit" :style="editStyle">{{ placeholder }}</el-button> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "EleTagsInput", | |||
| model: { | |||
| prop: 'data', | |||
| event: 'change' | |||
| }, | |||
| props: { | |||
| data: Array, | |||
| type: String, | |||
| size: String, | |||
| effect: String, | |||
| placeholder: { | |||
| type: String, | |||
| default: '+ New Tag' | |||
| }, | |||
| width: { | |||
| type: String, | |||
| default: '90px' | |||
| }, | |||
| unique: { | |||
| type: Boolean, | |||
| default: true | |||
| }, | |||
| validator: [Function, Array], | |||
| beforeRemove: Function | |||
| }, | |||
| data() { | |||
| return { | |||
| edit: false, | |||
| editValue: '' | |||
| } | |||
| }, | |||
| computed: { | |||
| editStyle() { | |||
| return {width: this.width}; | |||
| } | |||
| }, | |||
| methods: { | |||
| showEdit() { | |||
| this.edit = true; | |||
| this.$nextTick(() => { | |||
| this.$refs.eleTagsInput.$refs.input.focus(); | |||
| }); | |||
| }, | |||
| saveEdit() { | |||
| if (this.editValue) { | |||
| if (this.unique && this.data.indexOf(this.editValue) !== -1) { | |||
| return this.$message.error(this.editValue + " 已经存在"); | |||
| } | |||
| if (this.validator) { | |||
| if (typeof this.validator === 'function') { | |||
| if (this.validator(this.editValue) === false) return; | |||
| } else if (!new RegExp(this.validator[0]).test(this.editValue)) { | |||
| return this.$message.error(this.validator[1]); | |||
| } | |||
| } | |||
| this.data.push(this.editValue); | |||
| this.$emit('change', this.data); | |||
| } | |||
| this.edit = false; | |||
| this.editValue = ''; | |||
| }, | |||
| removeTag(index) { | |||
| if (this.beforeRemove && this.beforeRemove() === false) return; | |||
| this.data.splice(index, 1); | |||
| this.$emit('change', this.data); | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| .ele-tags-input .el-tag + .el-tag { | |||
| margin-left: 10px; | |||
| } | |||
| .ele-tags-input .el-button, .ele-tags-input .el-input { | |||
| overflow: hidden; | |||
| margin-left: 10px; | |||
| vertical-align: middle; | |||
| } | |||
| .ele-tags-input .el-button--mini { | |||
| padding: 3px 5px; | |||
| } | |||
| .ele-tags-input .el-input--mini .el-input__inner { | |||
| height: 20px; | |||
| line-height: 20px; | |||
| padding: 0 5px; | |||
| } | |||
| .ele-tags-input .el-button--small { | |||
| padding: 5px 8px; | |||
| } | |||
| .ele-tags-input .el-input--small .el-input__inner { | |||
| height: 24px; | |||
| line-height: 24px; | |||
| padding: 0 8px; | |||
| font-size: 12px; | |||
| } | |||
| .ele-tags-input .el-button--medium { | |||
| padding: 6px 10px; | |||
| font-size: 12px; | |||
| } | |||
| .ele-tags-input .el-input--medium .el-input__inner { | |||
| height: 28px; | |||
| line-height: 28px; | |||
| padding: 0 10px; | |||
| font-size: 12px; | |||
| } | |||
| .ele-tags-input .el-button--large { | |||
| padding: 8px 10px; | |||
| font-size: 12px; | |||
| } | |||
| .ele-tags-input .el-input--large .el-input__inner { | |||
| height: 32px; | |||
| line-height: 32px; | |||
| padding: 0 10px; | |||
| font-size: 12px; | |||
| } | |||
| </style> | |||
+ 70
- 0
src/components/Sortable/ElTableDraggable.vue
View File
| @@ -0,0 +1,70 @@ | |||
| <!-- 拖拽排序表格 https://github.com/WakuwakuP/element-ui-el-table-draggable --> | |||
| <template> | |||
| <div ref="wrapper"> | |||
| <div :key="tableKey"> | |||
| <slot></slot> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import sortable from "sortablejs"; | |||
| export default { | |||
| name: "ElTableDraggable", | |||
| props: { | |||
| handle: { | |||
| type: String, | |||
| default: "" | |||
| }, | |||
| animate: { | |||
| type: Number, | |||
| default: 100 | |||
| } | |||
| }, | |||
| data() { | |||
| return { | |||
| tableKey: 0 | |||
| }; | |||
| }, | |||
| methods: { | |||
| makeTableSortAble() { | |||
| const table = this.$children[0].$el.querySelector( | |||
| ".el-table__body-wrapper tbody" | |||
| ); | |||
| sortable.create(table, { | |||
| handle: this.handle, | |||
| animation: this.animate, | |||
| onEnd: ({newIndex, oldIndex}) => { | |||
| this.keepWrapperHeight(true); | |||
| this.tableKey = Math.random(); | |||
| const arr = this.$children[0].data; | |||
| const targetRow = arr.splice(oldIndex, 1)[0]; | |||
| arr.splice(newIndex, 0, targetRow); | |||
| this.$emit("drop", {targetObject: targetRow, list: arr}); | |||
| } | |||
| }); | |||
| }, | |||
| keepWrapperHeight(keep) { | |||
| // eslint-disable-next-line prefer-destructuring | |||
| const wrapper = this.$refs.wrapper; | |||
| if (keep) { | |||
| wrapper.style.minHeight = `${wrapper.clientHeight}px`; | |||
| } else { | |||
| wrapper.style.minHeight = "auto"; | |||
| } | |||
| } | |||
| }, | |||
| mounted() { | |||
| this.makeTableSortAble(); | |||
| }, | |||
| watch: { | |||
| tableKey() { | |||
| this.$nextTick(() => { | |||
| this.makeTableSortAble(); | |||
| this.keepWrapperHeight(false); | |||
| }); | |||
| } | |||
| } | |||
| }; | |||
| </script> | |||
+ 94
- 0
src/components/TinymceEditor/index.vue
View File
| @@ -0,0 +1,94 @@ | |||
| <!-- tinymce富文本编辑器组件 License By http://eleadmin.com --> | |||
| <template> | |||
| <editor v-model="content" :init="config" :disabled="disabled"/> | |||
| </template> | |||
| <script> | |||
| import tinymce from 'tinymce/tinymce' | |||
| import Editor from '@tinymce/tinymce-vue' | |||
| import 'tinymce/icons/default' | |||
| import 'tinymce/themes/silver' | |||
| import 'tinymce/plugins/code' | |||
| import 'tinymce/plugins/print' | |||
| import 'tinymce/plugins/preview' | |||
| import 'tinymce/plugins/fullscreen' | |||
| import 'tinymce/plugins/paste' | |||
| import 'tinymce/plugins/searchreplace' | |||
| import 'tinymce/plugins/save' | |||
| import 'tinymce/plugins/autosave' | |||
| import 'tinymce/plugins/link' | |||
| import 'tinymce/plugins/autolink' | |||
| import 'tinymce/plugins/image' | |||
| import 'tinymce/plugins/imagetools' | |||
| import 'tinymce/plugins/media' | |||
| import 'tinymce/plugins/table' | |||
| import 'tinymce/plugins/codesample' | |||
| import 'tinymce/plugins/lists' | |||
| import 'tinymce/plugins/advlist' | |||
| import 'tinymce/plugins/hr' | |||
| import 'tinymce/plugins/charmap' | |||
| import 'tinymce/plugins/emoticons' | |||
| import 'tinymce/plugins/anchor' | |||
| import 'tinymce/plugins/directionality' | |||
| import 'tinymce/plugins/pagebreak' | |||
| import 'tinymce/plugins/quickbars' | |||
| import 'tinymce/plugins/nonbreaking' | |||
| import 'tinymce/plugins/visualblocks' | |||
| import 'tinymce/plugins/visualchars' | |||
| import 'tinymce/plugins/wordcount' | |||
| import 'tinymce/plugins/emoticons/js/emojis' | |||
| export default { | |||
| name: "TinymceEditor", | |||
| components: {Editor}, | |||
| model: { | |||
| prop: 'value', | |||
| event: 'change' | |||
| }, | |||
| props: { | |||
| value: String, | |||
| init: Object, | |||
| disabled: Boolean, | |||
| }, | |||
| data() { | |||
| return { | |||
| content: '', | |||
| config: Object.assign({ | |||
| height: 300, | |||
| branding: false, | |||
| skin_url: '/tinymce/skins/ui/oxide', | |||
| content_css: '/tinymce/skins/content/default/content.css', | |||
| language_url: '/tinymce/langs/zh_CN.js', | |||
| language: 'zh_CN', | |||
| plugins: 'code print preview fullscreen paste searchreplace save autosave link autolink image imagetools media table codesample lists advlist hr charmap emoticons anchor directionality pagebreak quickbars nonbreaking visualblocks visualchars wordcount', | |||
| toolbar: 'fullscreen preview code | undo redo | forecolor backcolor | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist | formatselect fontselect fontsizeselect | link image media emoticons charmap anchor pagebreak codesample | ltr rtl', | |||
| toolbar_drawer: 'sliding', | |||
| images_upload_handler: (blobInfo, success) => { | |||
| console.log(blobInfo) | |||
| success('data:image/jpeg;base64,' + blobInfo.base64()); | |||
| }, | |||
| file_picker_types: 'media', | |||
| file_picker_callback: () => { | |||
| } | |||
| }, this.init) | |||
| } | |||
| }, | |||
| mounted() { | |||
| tinymce.init({}); | |||
| }, | |||
| watch: { | |||
| content() { | |||
| this.$emit('change', this.content); | |||
| }, | |||
| value() { | |||
| this.content = this.value; | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| body .tox-tinymce-aux { | |||
| z-index: 19892000; | |||
| } | |||
| </style> | |||
+ 383
- 0
src/components/uploadImage.vue
View File
| @@ -0,0 +1,383 @@ | |||
| <template ref="uploadImage"> | |||
| <div class='finish_room'> | |||
| <div class='finish_room2'> | |||
| <viewer :images="photo"> | |||
| <div :key="index" v-for="(item,index) in photo" class='room_img'> | |||
| <img v-lazy="item.url"> | |||
| <div v-if="!disabled" @click="deleteImg(index)" class="im-button"> | |||
| <div class="im-close"></div> | |||
| <div class="im-close1"></div> | |||
| </div> | |||
| </div> | |||
| </viewer> | |||
| <div v-if="photo.length<limit" v-loading="loading" class='room_add_img'> | |||
| <span style="margin-top: 35px"><img src="../assets/add_img.png"></span> | |||
| <input :disabled="disabled" @change='add_img' type="file"> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import axios from 'axios' | |||
| export default { | |||
| props: { | |||
| limit: { | |||
| type: Number, | |||
| default() { | |||
| return 1; | |||
| } | |||
| }, | |||
| updDir: { | |||
| type: String, | |||
| default() { | |||
| return 'error'; | |||
| } | |||
| }, | |||
| disabled: { | |||
| type: Boolean, | |||
| default() { | |||
| return false; | |||
| } | |||
| }, | |||
| isCompress: { | |||
| type: Boolean, | |||
| default() { | |||
| return false; | |||
| } | |||
| }, | |||
| value:{} | |||
| }, | |||
| data: function () { | |||
| return { | |||
| photo: [], | |||
| loading: false, | |||
| } | |||
| }, | |||
| watch: { | |||
| photo() { | |||
| if (this.limit == 1) { | |||
| this.$emit('input', this.photo.length>0?this.photo[0].url:'') | |||
| } else { | |||
| this.$emit('input', this.photo) | |||
| } | |||
| }, | |||
| value() { | |||
| if (this.limit == 1) { | |||
| if(this.value instanceof Array){ | |||
| this.photo = [] | |||
| }else{ | |||
| this.photo = this.value?[{url:this.value}]:[] | |||
| } | |||
| } else { | |||
| this.photo = this.value | |||
| } | |||
| } | |||
| }, | |||
| mounted() { | |||
| if (this.limit == 1) { | |||
| if(this.value instanceof Array){ | |||
| this.photo = [] | |||
| }else{ | |||
| this.photo = this.value?[this.value]:[] | |||
| } | |||
| } else { | |||
| this.photo = this.value | |||
| } | |||
| }, | |||
| methods: { | |||
| deleteImg(index) { | |||
| this.photo.splice(index, 1) | |||
| }, | |||
| compress(img) { | |||
| var url = null; | |||
| var canvas = document.createElement("canvas"); | |||
| var scale = img.height / img.width; | |||
| canvas.width = 720; | |||
| canvas.height = 720 * scale; | |||
| var ctx = canvas.getContext("2d"); | |||
| ctx.clearRect(0, 0, canvas.width, canvas.height); | |||
| ctx.drawImage(img, 0, 0, canvas.width, canvas.height); | |||
| url = canvas.toDataURL("image/jpeg"); | |||
| return url; | |||
| }, | |||
| dataURItoBlob(dataURI) { | |||
| let byteString = window.atob(dataURI.split(',')[1]) | |||
| let mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0] | |||
| let ab = new ArrayBuffer(byteString.length) | |||
| let ia = new Uint8Array(ab) | |||
| for (let i = 0; i < byteString.length; i++) { | |||
| ia[i] = byteString.charCodeAt(i) | |||
| } | |||
| return new window.Blob([ab], {type: mimeString}) | |||
| }, | |||
| add_img(event) { | |||
| let file = event.target.files[0] | |||
| if (/\.(gif|jpg|jpeg|png|GIF|JPG|PNG)$/.test(event.target.value)) { | |||
| let MAXSIZE = 10*1024 * 1024; | |||
| let size = file.size; | |||
| if(size>MAXSIZE){ | |||
| event.target.value = '' | |||
| this.$notify.error({ | |||
| title: '上传图片错误', | |||
| message: '上传图片不能超过10M' | |||
| }) | |||
| return | |||
| } | |||
| this.loading = true | |||
| let reader = new FileReader() | |||
| let self = this | |||
| reader.readAsDataURL(file) | |||
| let img = new Image; | |||
| let updDir = this.updDir; | |||
| reader.onload = function (e) { | |||
| img.src = this.result; | |||
| img.onload = function () { | |||
| let base = e.target.result | |||
| let fileItem = file | |||
| if (self.isCompress) { | |||
| base = self.compress(img) | |||
| fileItem = self.dataURItoBlob(base) | |||
| } | |||
| let formdata = new window.FormData() | |||
| formdata.append('file', fileItem) | |||
| axios({ | |||
| method: "POST", | |||
| url: '/upload/uploadImage/' + updDir, | |||
| data: formdata, | |||
| timeout: 1000000, | |||
| headers: { | |||
| 'Content-Type': 'multipart/form-data' | |||
| } | |||
| }).then(res => { | |||
| event.target.value = '' | |||
| self.photo.push({fileName:file.fileName,url:res.data.data}) | |||
| self.loading = false | |||
| }).catch(e => { | |||
| event.target.value = '' | |||
| self.loading = false | |||
| this.$message.error(e.message); | |||
| }) | |||
| } | |||
| } | |||
| } else { | |||
| event.target.value = '' | |||
| this.$notify.error({ | |||
| title: '上传图片错误', | |||
| message: '请上传gif|jpg|jpeg|png|GIF|JPG|PNG格式图片' | |||
| }) | |||
| } | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| .finish_room { | |||
| /*width: 140px;*/ | |||
| /*height: 165px;*/ | |||
| } | |||
| img { | |||
| height: 100%; | |||
| } | |||
| .finish_room2 { | |||
| width: 100%; | |||
| height: 100%; | |||
| display: flex; | |||
| align-items: center; | |||
| flex-flow: wrap; | |||
| } | |||
| .finish_room2 > div { | |||
| display: flex; | |||
| flex-wrap: wrap; | |||
| } | |||
| .finish_room2 .margeImg { | |||
| margin-left: 10px; | |||
| } | |||
| .finish_room2 .room_img { | |||
| width: 100px; | |||
| height: 100px; | |||
| cursor: pointer; | |||
| overflow: hidden; | |||
| position: relative; | |||
| text-align: center; | |||
| background-color: rgba(0, 0, 0, .5); | |||
| margin-left: 10px; | |||
| margin-top: 10px; | |||
| } | |||
| .finish_room2 .room_img:before { | |||
| /*content: "";*/ | |||
| /*width: 0;*/ | |||
| /*height: 100%;*/ | |||
| /*!*background: #000;*!*/ | |||
| /*padding: 14px 18px;*/ | |||
| /*position: absolute;*/ | |||
| /*top: 0;*/ | |||
| /*left: 50%;*/ | |||
| /*opacity: 0;*/ | |||
| } | |||
| .finish_room2 .room_img:hover:before { | |||
| width: 100%; | |||
| left: 0; | |||
| opacity: 0.5; | |||
| } | |||
| .finish_room2 .room_img .box-content { | |||
| width: 100%; | |||
| padding: 14px 18px; | |||
| color: #fff; | |||
| position: absolute; | |||
| top: 38%; | |||
| left: 0; | |||
| } | |||
| .finish_room2 .room_img .icon { | |||
| padding: 0; | |||
| margin: 0; | |||
| list-style: none; | |||
| margin-top: -20px; | |||
| } | |||
| .finish_room2 .room_img .icon li { | |||
| display: inline-block; | |||
| } | |||
| .finish_room2 .room_img .icon li i { | |||
| display: block; | |||
| width: 40px; | |||
| height: 40px; | |||
| line-height: 40px; | |||
| border-radius: 50%; | |||
| font-size: 20px; | |||
| font-weight: 700; | |||
| color: #fff; | |||
| margin-right: 25px; | |||
| opacity: 0; | |||
| transform: translateY(50px); | |||
| transition: all 0.5s ease 0s; | |||
| } | |||
| @media only screen and (max-width: 990px) { | |||
| .finish_room2 .room_img { | |||
| } | |||
| } | |||
| .finish_room2 .deleteImg { | |||
| color: red; | |||
| position: absolute; | |||
| top: 0px; | |||
| left: 80px; | |||
| cursor: pointer; | |||
| } | |||
| .finish_room2 .room_img img { | |||
| cursor: pointer; | |||
| width: 100px; | |||
| height: 100px; | |||
| } | |||
| .finish_room2 > .room_img span { | |||
| position: absolute; | |||
| width: auto; | |||
| height: auto; | |||
| right: 5px; | |||
| bottom: 3px; | |||
| } | |||
| .finish_room2 .im-button { | |||
| position: absolute; | |||
| top: -14px; | |||
| right: -18px; | |||
| width: 40px; | |||
| height: 40px; | |||
| cursor: pointer; | |||
| border-radius: 50%; | |||
| background-color: rgba(0, 0, 0, .5); | |||
| opacity: 0; | |||
| } | |||
| .finish_room2 .room_img:hover .icon li i { | |||
| opacity: 0.5; | |||
| } | |||
| .finish_room2 .room_img:hover img { | |||
| opacity: 0.5; | |||
| } | |||
| .finish_room2 .room_img:hover .im-button { | |||
| opacity: 1; | |||
| } | |||
| .finish_room2 .im-close { | |||
| transform: rotate(-45deg); | |||
| line-height: 0px; | |||
| left: 6px; | |||
| bottom: 13px; | |||
| display: inline-block; | |||
| width: 15px; | |||
| height: 2px; | |||
| background: #fff; | |||
| position: absolute; | |||
| } | |||
| .finish_room2 .im-close1 { | |||
| left: 5px; | |||
| bottom: 13px; | |||
| display: inline-block; | |||
| width: 15px; | |||
| height: 2px; | |||
| background: #fff; | |||
| position: absolute; | |||
| transform: rotate(45deg); | |||
| } | |||
| .room_add_img { | |||
| margin-left: 10px; | |||
| margin-top: 10px; | |||
| width: 100px; | |||
| height: 100px; | |||
| cursor: pointer; | |||
| border: 1px solid #e1e1e1; | |||
| display: flex; | |||
| flex-direction: column; | |||
| align-items: center; | |||
| justify-content: space-between; | |||
| position: relative; | |||
| z-index: 10; | |||
| } | |||
| .room_add_img > span:nth-child(1) { | |||
| width: 30px; | |||
| height: 30px; | |||
| overflow: hidden; | |||
| } | |||
| .room_add_img > span:nth-child(2) { | |||
| margin-bottom: 10px; | |||
| } | |||
| .room_add_img input { | |||
| cursor: pointer; | |||
| position: absolute; | |||
| top: 0px; | |||
| left: 0px; | |||
| width: 100%; | |||
| height: 100%; | |||
| z-index: 99999; | |||
| opacity: 0; | |||
| } | |||
| </style> | |||
+ 47
- 0
src/config/axios.js
View File
| @@ -0,0 +1,47 @@ | |||
| /** | |||
| * axios配置 | |||
| */ | |||
| import Vue from 'vue' | |||
| import axios from 'axios' | |||
| import VueAxios from 'vue-axios' | |||
| import store from '@/store' | |||
| import router from '@/router' | |||
| import setting from './setting' | |||
| import {MessageBox} from 'element-ui' | |||
| Vue.use(VueAxios, axios); | |||
| axios.defaults.baseURL = setting.baseURL; | |||
| axios.defaults.headers.common[setting.tokenHeaderName] = store.state.user.token; | |||
| /* 响应拦截器 */ | |||
| axios.interceptors.response.use((res) => { | |||
| if (res.data.code === 401) { // 登录过期处理 | |||
| if (res.config.url === setting.menuUrl) { | |||
| store.dispatch('user/setToken').then(() => { | |||
| location.replace('/'); | |||
| }); | |||
| return; | |||
| } | |||
| MessageBox.alert('登录状态已过期，请退出重新登录！', '系统提示', { | |||
| confirmButtonText: '重新登录', | |||
| callback: action => { | |||
| if (action === 'confirm') { | |||
| store.dispatch('user/setToken').then(() => { | |||
| router.push({path: '/login'}); | |||
| }); | |||
| } | |||
| }, | |||
| beforeClose: () => { | |||
| MessageBox.close(); | |||
| } | |||
| }); | |||
| return Promise.reject(new Error(res.data.msg)); | |||
| } | |||
| // token自动续期 | |||
| let access_token = res.headers[setting.tokenHeaderName]; | |||
| if (access_token) store.dispatch('user/setToken', access_token); | |||
| return res; | |||
| }, (error) => { | |||
| return Promise.reject(error); | |||
| }); | |||
+ 58
- 0
src/config/plugins.js
View File
| @@ -0,0 +1,58 @@ | |||
| /** | |||
| * 引用框架 | |||
| */ | |||
| import Vue from 'vue' | |||
| import './axios' | |||
| import setting from './setting' | |||
| import util from '@/utils/util' | |||
| import permission from '@/utils/permission' // 角色权限控制 | |||
| // 第三方组件 | |||
| import NProgress from 'nprogress' // 顶部进度条 | |||
| import 'nprogress/nprogress.css' | |||
| import VueClipboard from 'vue-clipboard2' // 剪切板 | |||
| // 扩展组件 | |||
| import EleDataTable from '@/components/EleDataTable' // 数据表格 | |||
| import EleIconPicker from '@/components/EleIconPicker' // 图标选择器 | |||
| import EleAvatarList from '@/components/EleAvatarList' // 头像列表 | |||
| import EleDot from '@/components/EleDot' // 状态文字 | |||
| import EleResult from '@/components/EleResult' // 操作结果 | |||
| import EleTagsInput from '@/components/EleTagsInput' // 标签输入框 | |||
| import EleEmpty from '@/components/EleEmpty' // 空视图 | |||
| // UI框架 | |||
| import ElementUI from 'element-ui' // ElementUI | |||
| import 'element-ui/lib/theme-chalk/display.css' | |||
| import '@/styles/eleadmin/icon.scss' // EleAdmin图标 | |||
| import '@/styles/eleadmin/index.scss' // EleAdmin样式 | |||
| Vue.prototype.$util = util; | |||
| Vue.prototype.$setting = setting; | |||
| Vue.use(ElementUI, {size: 'medium'}); | |||
| Vue.use(permission); | |||
| Vue.use(VueClipboard); | |||
| NProgress.configure({showSpinner: false}); | |||
| /* 全局注册常用组件 */ | |||
| Vue.component(EleDataTable.name, EleDataTable); | |||
| Vue.component(EleIconPicker.name, EleIconPicker); | |||
| Vue.component(EleAvatarList.name, EleAvatarList); | |||
| Vue.component(EleDot.name, EleDot); | |||
| Vue.component(EleResult.name, EleResult); | |||
| Vue.component(EleTagsInput.name, EleTagsInput); | |||
| Vue.component(EleEmpty.name, EleEmpty); | |||
| /** 添加全局过滤器 */ | |||
| Vue.filter('timeAgo', (value, onlyDate) => { | |||
| return util.timeAgo(value, onlyDate); | |||
| }); | |||
| Vue.filter('digit', (value, length) => { | |||
| return util.digit(value, length); | |||
| }); | |||
| Vue.filter('toDateString', (value, format) => { | |||
| return util.toDateString(value, format); | |||
| }); | |||
| Vue.filter('escape', (value) => { | |||
| return util.escape(value); | |||
| }); | |||
| Vue.filter('htmlToText', (value) => { | |||
| return util.htmlToText(value); | |||
| }); | |||
+ 38
- 0
src/config/setting.js
View File
| @@ -0,0 +1,38 @@ | |||
| /** | |||
| * 项目统一配置 | |||
| */ | |||
| export default { | |||
| version: '1.0', | |||
| name: 'JNDZ考核管理系统', // 项目名称 | |||
| baseURL: 'http://localhost:9031/api/', // 接口地址 | |||
| whiteList: ['/login', '/forget'], // 路由白名单(不需要登录的) | |||
| keepAliveList: [], // 需要缓存的组件名称 | |||
| menuUrl: '/index/getMenuList', // 菜单数据接口 | |||
| parseMenu: null, // 自定义解析接口菜单数据 | |||
| parseMenuItem: null, // 自定义解析接口菜单每一个数据格式 | |||
| userUrl: '/index/getUserInfo', // 用户信息接口 | |||
| parseUser: (res) => { // 自定义解析接口用户信息 | |||
| res.data.roles = res.data.roles.map(d => d.roleCode); | |||
| res.data.authorities = res.data.authorities.map(d => d.authority); | |||
| return res; | |||
| }, | |||
| tokenHeaderName: 'Authorization', // token传递的header名称 | |||
| tokenStoreName: 'access_token', // token存储的名称 | |||
| userStoreName: 'user', // 用户信息存储的名称 | |||
| themeStoreName: 'theme', // 主题配置存储的名称 | |||
| homeTitle: '主页', // 首页Tab显示标题,null会根据菜单自动获取 | |||
| watchResize: true, // 是否监听屏幕尺寸改变 | |||
| showSetting: true, // 是否显示主题设置抽屉 | |||
| /* 主题默认配置 */ | |||
| sideStyle: 1, // 侧边栏风格,0默认,1暗色 | |||
| headStyle: 0, // 顶栏风格,0默认,1暗色,2主色 | |||
| tabStyle: 1, // 标签页风格,0默认(下划线),1圆点,2卡片 | |||
| bodyFull: true, // 内容区域宽度铺满 | |||
| layoutStyle: 0, // 布局风格,0默认,1顶部菜单风格,2混合菜单风格 | |||
| theme: null, // 默认主题 | |||
| showTabs: true, // 是否开启多标签 | |||
| logoAutoSize: false, // logo是否自适应宽度 | |||
| fixedLayout: true, // 是否固定顶栏和侧栏 | |||
| colorfulIcon: false, // 侧栏是否多彩图标 | |||
| sideUniqueOpen: true // 侧边栏是否只保持一个子菜单展开 | |||
| } | |||
+ 22
- 0
src/main.js
View File
| @@ -0,0 +1,22 @@ | |||
| import Vue from 'vue' | |||
| import App from './App.vue' | |||
| import router from './router' | |||
| import store from './store' | |||
| import './config/plugins' | |||
| import VueLazyload from 'vue-lazyload' | |||
| Vue.config.productionTip = false; | |||
| Vue.use(VueLazyload, { | |||
| preLoad: 1.3, | |||
| error: require('./assets/404.jpg'), | |||
| loading: require('./assets/loading.svg'), | |||
| attempt: 1, | |||
| listenEvents: ['scroll'] | |||
| }) | |||
| new Vue({ | |||
| router, | |||
| store, | |||
| render: h => h(App) | |||
| }).$mount('#app'); | |||
+ 113
- 0
src/router/index.js
View File
| @@ -0,0 +1,113 @@ | |||
| /** | |||
| * 路由配置 | |||
| */ | |||
| import Vue from 'vue' | |||
| import VueRouter from 'vue-router' | |||
| import store from '@/store' | |||
| import setting from '@/config/setting' | |||
| import EleLayout from '@/views/common/layout/Layout' | |||
| import NProgress from 'nprogress' | |||
| Vue.use(VueRouter); | |||
| /* 静态路由配置 */ | |||
| const routes = [ | |||
| { | |||
| path: '/login', | |||
| component: () => import('@/views/login/login'), | |||
| meta: {hide: true, title: '登录'} | |||
| }, | |||
| { | |||
| path: '/forget', | |||
| component: () => import('@/views/login/forget'), | |||
| meta: {hide: true, title: '忘记密码'} | |||
| }, | |||
| // 嵌套路由需要单独配置, 菜单不完全等于路由 | |||
| { | |||
| path: '/list', | |||
| component: EleLayout, | |||
| meta: {title: '列表页面'}, | |||
| children: [ | |||
| { | |||
| path: 'card', | |||
| redirect: '/list/card/project', | |||
| component: () => import('@/views/list/card'), | |||
| meta: {title: '卡片列表'}, | |||
| children: [ | |||
| { | |||
| path: 'project', | |||
| component: () => import('@/views/list/card/project'), | |||
| meta: {hide: true, title: '项目', uid: '/list/card'} | |||
| }, | |||
| { | |||
| path: 'application', | |||
| component: () => import('@/views/list/card/application'), | |||
| meta: {hide: true, title: '应用', uid: '/list/card'} | |||
| }, | |||
| { | |||
| path: 'article', | |||
| component: () => import('@/views/list/card/article'), | |||
| meta: {hide: true, title: '文章', uid: '/list/card'} | |||
| } | |||
| ] | |||
| } | |||
| ] | |||
| } | |||
| ]; | |||
| // 404路由在动态路由后面加 | |||
| const route404 = { | |||
| path: '', | |||
| component: EleLayout, | |||
| meta: {hide: true}, | |||
| children: [ | |||
| { | |||
| path: '*', | |||
| component: () => import('@/views/common/exception/404'), | |||
| meta: {hide: true, title: '404'} | |||
| } | |||
| ] | |||
| }; | |||
| const router = new VueRouter({ | |||
| routes, | |||
| mode: 'history' // 把这个删掉就是hash模式 | |||
| }); | |||
| /* 路由守卫 */ | |||
| router.beforeEach((to, from, next) => { | |||
| NProgress.start(); | |||
| document.title = `${to.meta.title || ''}${to.meta.title ? ' - ' : ''}${setting.name}`; | |||
| if (store.state.user.token) { // 判断是否登录 | |||
| if (!store.state.user.menus) { // 判断是否已注册动态路由 | |||
| store.dispatch('user/getMenuRouters').then(route => { // 获取动态路由 | |||
| if (route && route.children) { | |||
| route.component = EleLayout; | |||
| // 去除已注册的路由 | |||
| for (let i = route.children.length - 1; i >= 0; i--) { | |||
| if (router.resolve(route.children[i].path).resolved.matched.length) { | |||
| route.children.splice(i, 1); | |||
| } | |||
| } | |||
| router.addRoutes([route, route404]); | |||
| } | |||
| next({...to, replace: true}); | |||
| }).catch(() => { | |||
| }); | |||
| } else { | |||
| next(); | |||
| } | |||
| } else if (setting.whiteList.indexOf(to.path) !== -1) { // 判断是否在无需登录白名单 | |||
| next(); | |||
| } else { // 未登录跳转登录页面 | |||
| next({path: '/login', query: to.path === '/' ? {} : {from: to.path}}); | |||
| } | |||
| }); | |||
| router.afterEach(() => { | |||
| setTimeout(() => { | |||
| NProgress.done(); | |||
| }, 150); | |||
| }); | |||
| export default router | |||
+ 4
- 0
src/store/getters.js
View File
| @@ -0,0 +1,4 @@ | |||
| export default { | |||
| theme: state => state.theme, | |||
| user: state => state.user | |||
| } | |||
+ 21
- 0
src/store/index.js
View File
| @@ -0,0 +1,21 @@ | |||
| /** | |||
| * Vuex状态管理 | |||
| */ | |||
| import Vue from 'vue' | |||
| import Vuex from 'vuex' | |||
| import getters from './getters' | |||
| import theme from './modules/theme' | |||
| import user from './modules/user' | |||
| Vue.use(Vuex); | |||
| export default new Vuex.Store({ | |||
| state: {}, | |||
| mutations: {}, | |||
| actions: {}, | |||
| modules: { | |||
| theme, | |||
| user | |||
| }, | |||
| getters | |||
| }) | |||
+ 229
- 0
src/store/modules/theme.js
View File
| @@ -0,0 +1,229 @@ | |||
| /** | |||
| * 主题状态管理 License By http://eleadmin.com | |||
| */ | |||
| import setting from '@/config/setting' | |||
| // 获取屏幕宽度 | |||
| const screenWidth = (document.documentElement.clientWidth || document.body.clientWidth); | |||
| // 获取本地缓存配置 | |||
| let cache = {}; | |||
| try { | |||
| cache = JSON.parse(localStorage.getItem(setting.themeStoreName) || '{}'); | |||
| } catch (e) { | |||
| console.error(e); | |||
| } | |||
| // 获取缓存的主题配置和缓存的主题css | |||
| let cacheTheme = getCache([ | |||
| 'sideStyle', 'headStyle', 'tabStyle', 'bodyFull', 'layoutStyle', 'theme', | |||
| 'showTabs', 'logoAutoSize', 'fixedLayout', 'colorfulIcon', 'sideUniqueOpen' | |||
| ], setting), cacheStyle = {}, cacheStoreName = setting.themeStoreName + '-cache'; | |||
| if (cacheTheme.theme) { | |||
| try { | |||
| cacheStyle = JSON.parse(localStorage.getItem(cacheStoreName) || '{}'); | |||
| if (!cacheStyle || setting.version !== cacheStyle.version) cacheStyle = {}; | |||
| } catch (e) { | |||
| console.error(e); | |||
| } | |||
| } | |||
| export default { | |||
| namespaced: true, | |||
| state: { | |||
| sideStyle: cacheTheme.sideStyle, // 侧边栏风格,0默认,1暗色 | |||
| headStyle: cacheTheme.headStyle, // 顶栏风格,0默认,1暗色,2主色 | |||
| tabStyle: cacheTheme.tabStyle, // 标签页风格,0默认(下划线),1圆点,2卡片 | |||
| bodyFull: cacheTheme.bodyFull, // 内容区域宽度铺满 | |||
| layoutStyle: cacheTheme.layoutStyle, // 布局风格,0默认,1顶部菜单风格,2混合菜单风格 | |||
| theme: cacheTheme.theme, // 主题色 | |||
| showTabs: cacheTheme.showTabs, // 是否开启多标签 | |||
| logoAutoSize: cacheTheme.logoAutoSize, // logo是否自适应宽度 | |||
| fixedLayout: cacheTheme.fixedLayout, // 是否固定顶栏和侧栏 | |||
| colorfulIcon: cacheTheme.colorfulIcon, // 侧栏是否多彩图标 | |||
| sideUniqueOpen: cacheTheme.sideUniqueOpen, // 侧边栏是否只保持一个子菜单展开 | |||
| collapse: screenWidth < 992, // 是否折叠侧边栏 | |||
| screenWidth: screenWidth, // 当前屏幕宽度 | |||
| showSetting: false, // 是否显示主题设置抽屉 | |||
| showPassword: false, // 是否显示修改密码弹窗 | |||
| themeCache: cacheStyle.cache || {}, // 主题css缓存 | |||
| reload: false, // 用于刷新 | |||
| tabs: [], // 当前打开的选项卡 | |||
| navActive: 0 // 混合导航模式顶部选中 | |||
| }, | |||
| mutations: { | |||
| SET: (state, obj) => { | |||
| state[obj.key] = obj.value; | |||
| if (['collapse', 'reload', 'showSetting'].indexOf(obj.key) !== -1) { // 重新获取屏幕宽度 | |||
| let sw = document.documentElement.clientWidth || document.body.clientWidth; | |||
| if (state.screenWidth !== sw) state.screenWidth = sw; | |||
| } | |||
| if (state.showSetting && obj.key !== 'showSetting') { | |||
| let temp = JSON.parse(localStorage.getItem(setting.themeStoreName) || '{}') | |||
| temp[obj.key] = obj.value; | |||
| localStorage.setItem(setting.themeStoreName, JSON.stringify(temp)); | |||
| } | |||
| }, | |||
| TAB_PUSH(state, obj) { | |||
| if (!state.tabs.some(r => r.path === obj.path)) state.tabs.push(obj); | |||
| } | |||
| }, | |||
| actions: { | |||
| /* 修改配置 */ | |||
| set({commit}, obj) { | |||
| commit('SET', obj); | |||
| }, | |||
| /* 切换配置 */ | |||
| toggle({commit, state}, key) { | |||
| commit('SET', {key: key, value: !state[key]}); | |||
| }, | |||
| /* 混合菜单模式切换侧边栏显示 */ | |||
| setNavActive({commit}, index) { | |||
| commit('SET', {key: 'navActive', value: index}); | |||
| }, | |||
| /* 添加新tab */ | |||
| tabAdd({commit}, obj) { | |||
| commit('TAB_PUSH', obj); | |||
| }, | |||
| /* 关闭指定tab */ | |||
| tabRemove({commit, state}, path) { | |||
| return new Promise((resolve) => { | |||
| let last = -1; | |||
| for (let i = 0; i < state.tabs.length; i++) { | |||
| if (state.tabs[i].path === path) { | |||
| break; | |||
| } | |||
| last = i; | |||
| } | |||
| commit('SET', {key: 'tabs', value: state.tabs.filter(d => d.path !== path)}); | |||
| resolve(last); | |||
| }); | |||
| }, | |||
| /* 关闭所有tab */ | |||
| tabRemoveAll({commit}) { | |||
| commit('SET', {key: 'tabs', value: []}); | |||
| }, | |||
| /* 关闭左侧tab */ | |||
| tabRemoveLeft({commit, state}, path) { | |||
| for (let i = 0; i < state.tabs.length; i++) { | |||
| if (state.tabs[i].path === path) { | |||
| commit('SET', {key: 'tabs', value: state.tabs.slice(i)}); | |||
| break; | |||
| } | |||
| } | |||
| }, | |||
| /* 关闭右侧tab */ | |||
| tabRemoveRight({commit, state}, path) { | |||
| for (let i = 0; i < state.tabs.length; i++) { | |||
| if (state.tabs[i].path === path) { | |||
| commit('SET', {key: 'tabs', value: state.tabs.slice(0, i + 1)}); | |||
| break; | |||
| } | |||
| } | |||
| }, | |||
| /* 关闭其他tab */ | |||
| tabRemoveOther({commit, state}, path) { | |||
| commit('SET', {key: 'tabs', value: state.tabs.filter(d => d.path === path)}); | |||
| }, | |||
| /* 切换主题 */ | |||
| setTheme({commit, state}, theme) { | |||
| return new Promise((resolve, reject) => { | |||
| if (!theme) { // 恢复默认主题 | |||
| document.head.querySelectorAll('style[id^="ele-theme-"],link[id^="ele-theme-"]').forEach((node) => { | |||
| node.parentNode.removeChild(node); | |||
| }); | |||
| commit('SET', {key: 'theme', value: theme}); | |||
| return resolve(); | |||
| } else if (state.themeCache[theme]) { // 主题css已经缓存过 | |||
| document.head.querySelectorAll('style[id^="ele-theme-"],link[id^="ele-theme-"]').forEach((node) => { | |||
| node.parentNode.removeChild(node); | |||
| }); | |||
| let elem = document.createElement('style'); | |||
| elem.id = `ele-theme-${theme}`; | |||
| elem.setAttribute('type', 'text/css'); | |||
| elem.innerHTML = state.themeCache[theme]; | |||
| document.head.appendChild(elem); | |||
| commit('SET', {key: 'theme', value: theme}); | |||
| return resolve(); | |||
| } else { // 动态引入主题css | |||
| // 检查主题css模块是否已被加载过 | |||
| let oldElem = document.head.querySelector(`#ele-theme-${theme}-js`); | |||
| if (oldElem) { // 已被加载过创建css的link标签 | |||
| document.head.querySelectorAll('style[id^="ele-theme-"],link[id^="ele-theme-"]').forEach((node) => { | |||
| node.parentNode.removeChild(node); | |||
| }); | |||
| let elem = document.createElement('link'); | |||
| elem.id = `ele-theme-${theme}`; | |||
| elem.setAttribute('type', 'text/css'); | |||
| elem.setAttribute('rel', 'stylesheet'); | |||
| elem.setAttribute('href', oldElem.getAttribute('ele-css')); | |||
| document.head.appendChild(elem); | |||
| commit('SET', {key: 'theme', value: theme}); | |||
| return resolve(); | |||
| } | |||
| // 把head下面相关元素标记为非主题元素 | |||
| document.head.querySelectorAll('style:not([id^="ele-theme-"]),link:not([id^="ele-theme-"]),script:not([id^="ele-theme-"])').forEach((node) => { | |||
| if (!node.getAttribute('ele-theme')) node.setAttribute('ele-theme', 'no'); | |||
| }); | |||
| // 加载主题css模块 | |||
| import(`@/styles/theme/${theme}.scss`).then(() => { | |||
| // 移除上次的主题 | |||
| document.head.querySelectorAll('style[id^="ele-theme-"],link[id^="ele-theme-"]').forEach((node) => { | |||
| node.parentNode.removeChild(node); | |||
| }); | |||
| // 获取import之后的主题标签 | |||
| let elem = document.head.querySelectorAll('style:not([ele-theme="no"])'); | |||
| elem = elem.length ? elem[elem.length - 1] : null; | |||
| if (!elem) { // 可能是style标签也可能是link标签 | |||
| elem = document.head.querySelectorAll('link:not([ele-theme="no"])'); | |||
| elem = elem.length ? elem[elem.length - 1] : null; | |||
| if (!elem) return reject(new Error('theme element not found.')); | |||
| // 再找到对应的主题js模块的标签 | |||
| let href = elem.getAttribute('href'); | |||
| let uuid = href.substring(href.indexOf('chunk-'), href.indexOf('.')); | |||
| let node = document.head.querySelectorAll(`script[src^="/js/${uuid}"]:not([ele-theme="no"])`); | |||
| if (node.length) { | |||
| node[node.length - 1].id = `ele-theme-${theme}-js`; | |||
| node[node.length - 1].setAttribute('ele-css', href); // 记录css的link地址 | |||
| } | |||
| } | |||
| elem.id = `ele-theme-${theme}`; | |||
| commit('SET', {key: 'theme', value: theme}); | |||
| // 缓存主题css | |||
| if (elem.innerHTML) { | |||
| state.themeCache[theme] = elem.innerHTML; | |||
| let cache = {}; | |||
| cache[state.theme] = state.themeCache[theme]; | |||
| try { | |||
| localStorage.setItem(cacheStoreName, JSON.stringify({ | |||
| version: setting.version, cache: cache | |||
| })); | |||
| } catch (e) { | |||
| console.error(e); | |||
| } | |||
| } | |||
| return resolve(); | |||
| }).catch(e => { | |||
| reject(e); | |||
| }); | |||
| } | |||
| }); | |||
| } | |||
| } | |||
| } | |||
| /** | |||
| * 获取缓存配置项 | |||
| * @param k 配置项 | |||
| * @param v 默认值 | |||
| */ | |||
| function getCache(k, v) { | |||
| if (Array.isArray(k)) { | |||
| let obj = {}; | |||
| k.forEach(t => { | |||
| obj[t] = (cache[t] === null || cache[t] === undefined) ? v[t] : cache[t]; | |||
| }); | |||
| return obj; | |||
| } else { | |||
| if (cache[k] === null || cache[k] === undefined) return v; | |||
| return cache[k]; | |||
| } | |||
| } | |||
+ 95
- 0
src/store/modules/user.js
View File
| @@ -0,0 +1,95 @@ | |||
| /** | |||
| * 登录状态管理 | |||
| */ | |||
| import axios from 'axios' | |||
| import setting from '@/config/setting' | |||
| import util from '@/utils/util' | |||
| let loginUser = {}; | |||
| try { | |||
| loginUser = JSON.parse(localStorage.getItem(setting.userStoreName) || '{}') || {}; | |||
| } catch (e) { | |||
| console.error(e); | |||
| } | |||
| export default { | |||
| namespaced: true, | |||
| state: { | |||
| token: localStorage.getItem(setting.tokenStoreName), // 当前token | |||
| user: loginUser, // 当前用户信息 | |||
| authorities: [], // 当前用户权限 | |||
| roles: [], // 当前用户角色 | |||
| menus: null // 当前用户的菜单 | |||
| }, | |||
| mutations: { | |||
| SET: (state, obj) => { | |||
| state[obj.key] = obj.value; | |||
| } | |||
| }, | |||
| actions: { | |||
| /* 缓存token */ | |||
| setToken({commit}, token) { | |||
| localStorage.removeItem(setting.tokenStoreName); | |||
| if (token) localStorage.setItem(setting.tokenStoreName, token); | |||
| else commit('SET', {key: 'menus', value: null}); | |||
| commit('SET', {key: 'token', value: token}); | |||
| axios.defaults.headers.common[setting.tokenHeaderName] = token; | |||
| }, | |||
| /* 缓存用户 */ | |||
| setUser({commit}, user) { | |||
| localStorage.removeItem(setting.userStoreName); | |||
| if (user) localStorage.setItem(setting.userStoreName, JSON.stringify(user)); | |||
| commit('SET', {key: 'user', value: user}); | |||
| }, | |||
| /* 设置用户权限 */ | |||
| setAuthorities({commit}, authorities) { | |||
| commit('SET', {key: 'authorities', value: authorities}); | |||
| }, | |||
| /* 设置用户角色 */ | |||
| setRoles({commit}, roles) { | |||
| commit('SET', {key: 'roles', value: roles}); | |||
| }, | |||
| /* 设置用户菜单 */ | |||
| setMenus({commit}, menus) { | |||
| commit('SET', {key: 'menus', value: menus}); | |||
| }, | |||
| /* 获取用户菜单路由 */ | |||
| getMenuRouters({commit, state}) { | |||
| return new Promise((resolve, reject) => { | |||
| if (state.menus) return resolve(menusToRoute(state.menus)); | |||
| if (!setting.menuUrl) { | |||
| commit('SET', {key: 'menus', value: []}); | |||
| return resolve(null); | |||
| } | |||
| axios.get(setting.menuUrl).then(res => { | |||
| let menus = setting.parseMenu ? setting.parseMenu(res.data) : res.data.data; | |||
| resolve(menusToRoute(menus)); | |||
| commit('SET', {key: 'menus', value: menus}); | |||
| }).catch(e => { | |||
| reject(e); | |||
| }); | |||
| }); | |||
| } | |||
| } | |||
| } | |||
| /** 菜单生成路由 */ | |||
| function menusToRoute(menus) { | |||
| let route = {path: '/', name: 'main', children: [], redirect: null}; | |||
| util.eachTreeData(menus, (item) => { | |||
| if (setting.parseMenuItem) item = setting.parseMenuItem(item); | |||
| item.meta = Object.assign({title: item.title, icon: item.icon, hide: item.hide, uid: item.uid}, item.meta); | |||
| if (item.path && !item.path.startsWith('http://') && !item.path.startsWith('https://') | |||
| && !item.path.startsWith('//')) { | |||
| if (!route.redirect) { | |||
| route.redirect = item.path; | |||
| if (!setting.homeTitle) setting.homeTitle = item.meta.title; | |||
| } | |||
| route.children.push({ | |||
| path: item.path, name: item.name || item.path, meta: item.meta, | |||
| component: () => import('@/views' + (item.component || item.path)) | |||
| }); | |||
| } | |||
| }); | |||
| return route; | |||
| } | |||
+ 435
- 0
src/styles/eleadmin/common.scss
View File
| @@ -0,0 +1,435 @@ | |||
| /** EleAdmin公共类 License By http://eleadmin.com */ | |||
| @import 'var'; | |||
| body { | |||
| color: $--color-text-regular; | |||
| font-size: $--font-size-base; | |||
| background-color: $--background-color-body; | |||
| font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif; | |||
| } | |||
| * { | |||
| margin: 0; | |||
| padding: 0; | |||
| outline: none; | |||
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |||
| } | |||
| textarea { | |||
| font-family: inherit; | |||
| } | |||
| /** 辅助类 */ | |||
| .ele-body { | |||
| padding: 15px; | |||
| } | |||
| h1, h2, h3, h4, h5, h6 { | |||
| color: $--color-text-primary; | |||
| font-size: 26px; | |||
| font-weight: 500; | |||
| } | |||
| h2 { | |||
| font-size: 24px; | |||
| } | |||
| h3 { | |||
| font-size: 22px; | |||
| } | |||
| h4 { | |||
| font-size: 20px; | |||
| } | |||
| h5 { | |||
| font-size: 18px; | |||
| } | |||
| h6 { | |||
| font-size: 16px; | |||
| } | |||
| .ele-text { | |||
| color: $--color-text-regular; | |||
| } | |||
| .ele-text-secondary { | |||
| color: $--color-text-secondary; | |||
| } | |||
| .ele-text-placeholder { | |||
| color: $--color-text-placeholder | |||
| } | |||
| .ele-text-primary { | |||
| color: $--color-primary; | |||
| } | |||
| .ele-text-success { | |||
| color: $--color-success; | |||
| } | |||
| .ele-text-warning { | |||
| color: $--color-warning; | |||
| } | |||
| .ele-text-danger { | |||
| color: $--color-danger; | |||
| } | |||
| .ele-text-info { | |||
| color: $--color-info; | |||
| } | |||
| .ele-text-delete { | |||
| text-decoration: line-through; | |||
| } | |||
| .ele-text-small, .ele-text-small > .el-progress__text { | |||
| font-size: 12px !important; | |||
| } | |||
| .ele-bg-primary { | |||
| background-color: $--color-primary !important;; | |||
| } | |||
| .ele-bg-success { | |||
| background-color: $--color-success !important;; | |||
| } | |||
| .ele-bg-warning { | |||
| background-color: $--color-warning !important;; | |||
| } | |||
| .ele-bg-danger { | |||
| background-color: $--color-danger !important;; | |||
| } | |||
| .ele-bg-info { | |||
| background-color: $--color-info !important;; | |||
| } | |||
| .ele-bg-white { | |||
| background-color: $--color-white !important;; | |||
| } | |||
| .ele-bg-base { | |||
| background-color: $--background-color-base !important;; | |||
| } | |||
| .ele-border-primary { | |||
| border-color: $--color-primary !important;; | |||
| } | |||
| .ele-border-success { | |||
| border-color: $--color-success !important;; | |||
| } | |||
| .ele-border-warning { | |||
| border-color: $--color-warning !important;; | |||
| } | |||
| .ele-border-danger { | |||
| border-color: $--color-danger !important;; | |||
| } | |||
| .ele-border-info { | |||
| border-color: $--color-info !important;; | |||
| } | |||
| .ele-pull-left { | |||
| float: left; | |||
| } | |||
| .ele-pull-right { | |||
| float: right; | |||
| } | |||
| .ele-clear { | |||
| clear: both; | |||
| } | |||
| .ele-clear-after:after { | |||
| content: ""; | |||
| clear: both; | |||
| display: block; | |||
| } | |||
| .ele-text-center { | |||
| text-align: center; | |||
| } | |||
| .ele-text-left { | |||
| text-align: left; | |||
| } | |||
| .ele-text-right { | |||
| text-align: right; | |||
| } | |||
| .ele-block { | |||
| display: block; | |||
| } | |||
| .ele-inline-block { | |||
| display: inline-block; | |||
| } | |||
| .ele-inline { | |||
| display: inline; | |||
| } | |||
| .ele-fluid { | |||
| width: 100% !important; | |||
| } | |||
| .ele-btn-icon, .ele-btn-icon.is-round { | |||
| padding-left: 12px; | |||
| padding-right: 12px; | |||
| &.el-button--small { | |||
| padding-left: 10px; | |||
| padding-right: 10px; | |||
| } | |||
| &.el-button--mini { | |||
| padding-left: 8px; | |||
| padding-right: 8px; | |||
| } | |||
| } | |||
| .el-button + .el-link, .el-button + .el-dropdown, .el-button + .ele-action, | |||
| .el-link + .el-button, .el-link + .el-link, .el-link + .el-dropdown, .el-link + .ele-action, | |||
| .el-dropdown + .el-button, .el-dropdown + .el-link, .el-dropdown + .el-dropdown, .el-dropdown + .ele-action, | |||
| .ele-action + .el-button, .ele-action + .el-link, .ele-action + .el-dropdown, .ele-action + .ele-action, | |||
| .el-tag + .el-tag { | |||
| margin-left: 10px; | |||
| } | |||
| .ele-elip { | |||
| overflow: hidden; | |||
| white-space: nowrap; | |||
| word-break: break-all; | |||
| text-overflow: ellipsis; | |||
| } | |||
| .ele-pop-wrap-higher .el-cascader-menu__wrap { | |||
| height: 280px; | |||
| } | |||
| em { | |||
| padding: 0 0.5em; | |||
| } | |||
| s { | |||
| padding: 0 0.125em; | |||
| } | |||
| /** 单元格 */ | |||
| .ele-cell { | |||
| display: flex; | |||
| &:not(.ele-cell-align-top) { | |||
| align-items: center; | |||
| } | |||
| &.ele-cell-align-bottom { | |||
| align-items: flex-end; | |||
| } | |||
| & > .ele-cell-content { | |||
| flex: 1; | |||
| box-sizing: border-box; | |||
| } | |||
| & > * + .ele-cell-content { | |||
| padding-left: 10px; | |||
| } | |||
| .ele-cell-title { | |||
| color: $--color-text-primary; | |||
| font-size: 15px; | |||
| } | |||
| .ele-cell-desc { | |||
| color: $--color-text-secondary; | |||
| font-size: 13px; | |||
| margin-top: 8px; | |||
| } | |||
| } | |||
| /* 顶部标题 */ | |||
| .ele-page-header { | |||
| padding: 20px 25px 16px 25px; | |||
| background-color: $--color-white; | |||
| border-bottom: 1px solid $--border-color-light; | |||
| .ele-page-title { | |||
| font-size: 19px; | |||
| color: $--color-text-primary; | |||
| } | |||
| .ele-page-desc { | |||
| margin-top: 8px; | |||
| color: $--color-text-secondary; | |||
| } | |||
| } | |||
| /** 底部工具栏 */ | |||
| .ele-bottom-tool { | |||
| display: flex; | |||
| align-items: center; | |||
| position: fixed; | |||
| bottom: 0; | |||
| right: 0; | |||
| width: 100%; | |||
| padding: 10px 15px; | |||
| background-color: $--color-white; | |||
| box-shadow: 0 -1px 2px rgba(0, 0, 0, .03); | |||
| transition: padding-left .3s ease-in-out; | |||
| box-sizing: border-box; | |||
| z-index: $--z-index-layout - 1; | |||
| .ele-bottom-tool-actions { | |||
| flex: 1; | |||
| text-align: right; | |||
| } | |||
| } | |||
| @media screen and (min-width: 768px) { | |||
| .ele-admin-sidebar + .ele-admin-body .ele-bottom-tool { | |||
| padding-left: $--size-side-width + 15px; | |||
| } | |||
| .ele-layout-collapse .ele-admin-sidebar + .ele-admin-body .ele-bottom-tool { | |||
| padding-left: $--size-side-width-collapse + 15px; | |||
| } | |||
| } | |||
| /** 表单详情 */ | |||
| .ele-form-detail .el-form-item { | |||
| margin-bottom: 10px; | |||
| } | |||
| /** 水平搜索表单 */ | |||
| .ele-form-search .el-form-item, .ele-form-search .ele-form-actions { | |||
| margin-bottom: 15px; | |||
| } | |||
| @media screen and (min-width: 768px) { | |||
| .ele-form-search.el-form--inline .el-form-item:not(.ele-form-actions) .el-form-item__content { | |||
| max-width: 200px; | |||
| } | |||
| .ele-form-search.el-form--inline .ele-form-actions { | |||
| padding-left: 15px; | |||
| } | |||
| } | |||
| @media screen and (max-width: 768px) { | |||
| .el-form--inline .el-form-item { | |||
| display: flex; | |||
| margin-right: 0; | |||
| } | |||
| .el-form--inline .el-form-item__content { | |||
| flex: 1; | |||
| } | |||
| .ele-form-search .ele-form-actions { | |||
| text-align: right; | |||
| } | |||
| } | |||
| /** 数据表格头部工具栏 */ | |||
| .ele-table-tool { | |||
| display: flex; | |||
| align-items: center; | |||
| margin-bottom: 15px; | |||
| .ele-table-tool-title { | |||
| flex: 1; | |||
| font-size: 16px; | |||
| } | |||
| } | |||
| /* 带背景色的头部工具栏 */ | |||
| .ele-table-tool-default { | |||
| margin-bottom: 0; | |||
| border: 1px solid $--border-color-lighter; | |||
| border-bottom: none; | |||
| background-color: $--background-color-base; | |||
| padding: 10px 15px; | |||
| box-sizing: border-box; | |||
| &.ele-form-search { | |||
| padding-bottom: 0; | |||
| .el-form-item, .ele-form-actions { | |||
| margin-bottom: 10px; | |||
| } | |||
| } | |||
| } | |||
| /** char tooltip dot */ | |||
| .ele-chart-dot { | |||
| width: 10px; | |||
| height: 10px; | |||
| margin-right: 5px; | |||
| border-radius: 50%; | |||
| display: inline-block; | |||
| background-color: #3aa1ff; | |||
| } | |||
| .g2-tooltip-marker { | |||
| border-radius: 50% !important; | |||
| } | |||
| /** 滚动条 */ | |||
| @media screen and (min-width: 768px) { | |||
| :not(html,body)::-webkit-scrollbar { | |||
| width: 8px; | |||
| height: 8px; | |||
| background: transparent; | |||
| } | |||
| :not(html,body)::-webkit-scrollbar-track { | |||
| background: transparent; | |||
| } | |||
| :not(html,body)::-webkit-scrollbar-thumb { | |||
| border-radius: 4px; | |||
| background-color: $--scrollbar-background-color; | |||
| } | |||
| :not(html,body)::-webkit-scrollbar-thumb:hover { | |||
| background-color: $--scrollbar-hover-background-color; | |||
| } | |||
| .ele-scrollbar-mini::-webkit-scrollbar { | |||
| width: 6px; | |||
| height: 6px; | |||
| } | |||
| .ele-scrollbar-mini::-webkit-scrollbar-thumb { | |||
| border-radius: 3px; | |||
| } | |||
| .ele-scrollbar-hide::-webkit-scrollbar { | |||
| width: 0; | |||
| height: 0; | |||
| } | |||
| } | |||
| .ele-scrollbar-hide { | |||
| overflow: auto; | |||
| } | |||
| .ele-scrollbar-hover { | |||
| overflow: hidden; | |||
| &:hover { | |||
| overflow: auto; | |||
| } | |||
| } | |||
+ 661
- 0
src/styles/eleadmin/extension.scss
View File
| @@ -0,0 +1,661 @@ | |||
| /** ElementUI组件样式重写 License By http://eleadmin.com */ | |||
| @import 'var'; | |||
| /** 数据表格 */ | |||
| .el-table { | |||
| .caret-wrapper { | |||
| height: 16px; | |||
| } | |||
| .sort-caret.ascending { | |||
| top: -4px; | |||
| } | |||
| .sort-caret.descending { | |||
| bottom: -2px; | |||
| } | |||
| thead { | |||
| color: $--color-text-primary; | |||
| } | |||
| th { | |||
| background-color: $--background-color-base; | |||
| } | |||
| &.ele-table-default-head th { | |||
| background-color: transparent; | |||
| } | |||
| } | |||
| .el-table--border.el-loading-parent--relative { | |||
| border-color: $--border-color-lighter; | |||
| } | |||
| .el-table--border .el-loading-mask { | |||
| right: 1px; | |||
| bottom: 1px; | |||
| } | |||
| .el-table__body tr.current-row:hover > td { | |||
| background-color: $--table-current-row-background-color; | |||
| } | |||
| .el-table__expand-icon .el-icon-arrow-right { | |||
| font-weight: 600; | |||
| } | |||
| /** 分页 */ | |||
| .el-pagination { | |||
| font-weight: 500; | |||
| text-align: center; | |||
| } | |||
| .el-table + .el-pagination { | |||
| margin-top: 15px; | |||
| } | |||
| .el-pagination.ele-pagination-circle { | |||
| .el-pager li, .btn-prev, .btn-next { | |||
| border-radius: 50%; | |||
| min-width: 28px; | |||
| margin-left: 0; | |||
| margin-right: 0; | |||
| &:not(.active) { | |||
| background-color: transparent; | |||
| } | |||
| } | |||
| } | |||
| /** 弹窗 */ | |||
| .el-dialog { | |||
| border-radius: 4px; | |||
| max-width: calc(100vw - 30px); | |||
| } | |||
| .el-dialog__header { | |||
| padding-top: 14px; | |||
| padding-bottom: 11px; | |||
| border-bottom: 1px solid $--border-color-lighter; | |||
| } | |||
| .el-dialog__title { | |||
| font-size: 16px; | |||
| } | |||
| .el-dialog__headerbtn { | |||
| font-size: 18px; | |||
| top: 16px; | |||
| } | |||
| .el-dialog__body { | |||
| padding-top: 22px; | |||
| padding-bottom: 22px; | |||
| } | |||
| .el-dialog__footer { | |||
| padding-bottom: 12px; | |||
| border-top: 1px solid $--border-color-extra-light; | |||
| } | |||
| .el-dialog:not(.ele-dialog-form) .el-dialog__body .el-form .el-form-item:last-child { | |||
| margin-bottom: 0; | |||
| } | |||
| .ele-dialog-form .el-dialog__body { | |||
| padding-bottom: 0; | |||
| } | |||
| /** 抽屉 */ | |||
| .el-drawer__header { | |||
| color: $--color-text-regular; | |||
| font-size: 15px; | |||
| margin-bottom: 0; | |||
| padding: 13px 16px; | |||
| border-bottom: 1px solid $--border-color-extra-light; | |||
| & > :first-child { | |||
| display: block; | |||
| } | |||
| } | |||
| .el-drawer__close-btn { | |||
| padding: 0; | |||
| font-size: 18px; | |||
| color: $--color-text-secondary; | |||
| } | |||
| .el-drawer__body { | |||
| overflow: auto; | |||
| } | |||
| /** MessageBox */ | |||
| .el-message-box { | |||
| padding-bottom: 15px; | |||
| max-width: calc(100vw - 30px); | |||
| } | |||
| .el-message-box__title { | |||
| font-size: 16px; | |||
| } | |||
| .el-message-box__status { | |||
| font-size: 20px !important; | |||
| } | |||
| .el-message-box__status + .el-message-box__message { | |||
| padding-left: 30px; | |||
| } | |||
| /** 气泡确认框 */ | |||
| .el-popconfirm__main { | |||
| margin: 12px 0; | |||
| } | |||
| /** 卡片 */ | |||
| .el-card { | |||
| border: none; | |||
| color: $--color-text-regular; | |||
| } | |||
| .ele-card-border { | |||
| border: 1px solid $--border-color-lighter; | |||
| } | |||
| .el-card__header { | |||
| font-size: 15px; | |||
| padding: 13px 20px; | |||
| color: $--color-text-primary; | |||
| border-color: $--border-color-lighter; | |||
| } | |||
| .el-card__body { | |||
| padding: 15px; | |||
| } | |||
| .el-card + .el-card { | |||
| margin-top: 15px; | |||
| } | |||
| /** 圆形和圆角徽章 */ | |||
| .ele-tag-round { | |||
| width: 32px; | |||
| padding-left: 0; | |||
| padding-right: 0; | |||
| border-radius: 50%; | |||
| text-align: center; | |||
| &.el-tag--medium { | |||
| width: 28px; | |||
| } | |||
| &.el-tag--small { | |||
| width: 24px; | |||
| } | |||
| &.el-tag--mini { | |||
| width: 20px; | |||
| } | |||
| } | |||
| .ele-tag-radius { | |||
| border-radius: 32px; | |||
| &.el-tag--medium { | |||
| border-radius: 28px; | |||
| } | |||
| &.el-tag--small { | |||
| border-radius: 24px; | |||
| } | |||
| &.el-tag--mini { | |||
| border-radius: 20px; | |||
| } | |||
| } | |||
| /** 分隔线 */ | |||
| .el-divider { | |||
| margin: 0; | |||
| &.el-divider--horizontal { | |||
| background-color: $--border-color-lighter; | |||
| } | |||
| &.ele-divider-base { | |||
| background-color: $--border-color-base; | |||
| } | |||
| &.ele-divider-light { | |||
| background-color: $--border-color-light; | |||
| } | |||
| &.ele-divider-extra-light { | |||
| background-color: $--border-color-extra-light; | |||
| } | |||
| &.ele-divider-dashed { | |||
| background-color: transparent; | |||
| background: linear-gradient(to right, $--border-color-base, $--border-color-base 8px, transparent 8px, transparent); | |||
| background-size: 16px 100% !important; | |||
| &.el-divider--horizontal { | |||
| background: linear-gradient(to right, $--border-color-lighter, $--border-color-lighter 8px, transparent 8px, transparent); | |||
| } | |||
| &.ele-divider-base { | |||
| background: linear-gradient(to right, $--border-color-base, $--border-color-base 8px, transparent 8px, transparent); | |||
| } | |||
| &.ele-divider-light { | |||
| background: linear-gradient(to right, $--border-color-light, $--border-color-light 8px, transparent 8px, transparent); | |||
| } | |||
| &.ele-divider-extra-light { | |||
| background: linear-gradient(to right, $--border-color-extra-light, $--border-color-extra-light 8px, transparent 8px, transparent); | |||
| } | |||
| } | |||
| } | |||
| /** 警告 */ | |||
| .el-alert__content { | |||
| padding: 0; | |||
| } | |||
| .el-alert { | |||
| .el-alert__description { | |||
| margin: 0; | |||
| } | |||
| .el-icon-info.ele-text-info, .el-icon-error.ele-text-danger, .el-icon-warning.ele-text-warning, | |||
| .el-icon-success.ele-text-success { | |||
| font-size: 14px; | |||
| margin-right: 8px; | |||
| } | |||
| .ele-text { | |||
| font-size: 14px; | |||
| color: $--color-text-primary; | |||
| } | |||
| .el-link { | |||
| vertical-align: baseline; | |||
| } | |||
| } | |||
| .el-alert__icon { | |||
| margin-right: 8px; | |||
| } | |||
| .el-alert__title + .el-alert__description { | |||
| margin-top: 8px; | |||
| } | |||
| /* 警告边框风格 */ | |||
| .ele-alert-border.is-light { | |||
| .el-alert__title { | |||
| color: $--color-text-primary; | |||
| font-size: $--font-size-base; | |||
| &.is-bold { | |||
| font-weight: 500; | |||
| } | |||
| } | |||
| &.is-big .el-alert__title { | |||
| font-size: $--font-size-medium; | |||
| } | |||
| .el-alert__description { | |||
| color: $--color-text-regular; | |||
| } | |||
| .el-alert__closebtn { | |||
| color: $--color-text-secondary; | |||
| } | |||
| &.el-alert--success { | |||
| border: 1px solid $--color-success-light; | |||
| .el-alert__icon.is-big:before { | |||
| content: "\e720"; | |||
| } | |||
| } | |||
| &.el-alert--warning { | |||
| border: 1px solid $--color-warning-light; | |||
| .el-alert__icon.is-big:before { | |||
| content: "\e6c9"; | |||
| } | |||
| } | |||
| &.el-alert--error { | |||
| border: 1px solid $--color-danger-light; | |||
| .el-alert__icon.is-big:before { | |||
| content: "\e78d"; | |||
| } | |||
| } | |||
| &.el-alert--info { | |||
| border: 1px solid rgba($--color-primary, .3); | |||
| background-color: rgba($--color-primary, .1); | |||
| .el-alert__icon { | |||
| color: $--color-primary; | |||
| &.is-big:before { | |||
| content: "\e6bf"; | |||
| font-family: "ele-icon" !important; | |||
| } | |||
| } | |||
| .ele-text-info { | |||
| color: $--color-primary; | |||
| } | |||
| } | |||
| } | |||
| /** 步骤条 */ | |||
| .el-step { | |||
| flex-grow: 1; | |||
| } | |||
| .el-step__line { | |||
| background-color: $--border-color-light; | |||
| } | |||
| .el-step__line-inner { | |||
| border-right: none; | |||
| border-bottom: none; | |||
| transition-delay: 0ms !important; | |||
| } | |||
| .el-step.is-horizontal { | |||
| .el-step__line { | |||
| height: 1px; | |||
| } | |||
| .el-step__line-inner { | |||
| border-left: none; | |||
| } | |||
| } | |||
| .el-step.is-vertical { | |||
| .el-step__line { | |||
| width: 1px; | |||
| } | |||
| .el-step__line-inner { | |||
| border-top: none; | |||
| } | |||
| } | |||
| .el-step__icon.is-text { | |||
| border-width: 1px; | |||
| border-color: $--border-color-base; | |||
| } | |||
| .el-step__icon-inner, .el-step__title.is-process { | |||
| font-weight: 500; | |||
| } | |||
| .el-step__head.is-process { | |||
| color: $--color-primary; | |||
| .el-step__icon.is-text { | |||
| color: #FFF; | |||
| border-color: $--color-primary; | |||
| background-color: $--color-primary; | |||
| } | |||
| } | |||
| .el-step__head.is-finish { | |||
| .el-step__icon.is-text { | |||
| color: $--color-primary; | |||
| border-color: $--color-primary; | |||
| } | |||
| .el-step__line-inner { | |||
| border-width: 1px !important; | |||
| } | |||
| .el-step__icon.is-text .el-step__icon-inner { | |||
| font-size: 0; | |||
| &:before { | |||
| content: "\e6da"; | |||
| font-size: 14px; | |||
| font-family: element-icons !important; | |||
| speak: none; | |||
| font-style: normal; | |||
| font-weight: 400; | |||
| font-variant: normal; | |||
| text-transform: none; | |||
| -webkit-font-smoothing: antialiased; | |||
| -moz-osx-font-smoothing: grayscale; | |||
| } | |||
| } | |||
| } | |||
| .el-step.is-horizontal .el-step__head.is-finish .el-step__line-inner { | |||
| width: 100% !important; | |||
| } | |||
| .el-step.is-vertical .el-step__head.is-finish .el-step__line-inner { | |||
| height: 100% !important; | |||
| } | |||
| .el-step__title.is-finish, .el-step__description.is-finish { | |||
| color: $--color-text-secondary; | |||
| } | |||
| .el-step.is-vertical .el-step__description { | |||
| padding-bottom: 8px; | |||
| } | |||
| .el-step__head.is-error .el-step__icon.is-text { | |||
| border-color: $--color-danger; | |||
| } | |||
| /* 步骤条水平风格 */ | |||
| .ele-steps-horizontal { | |||
| .el-step { | |||
| display: flex; | |||
| .el-step__head { | |||
| width: auto; | |||
| position: static; | |||
| padding: 4px 8px 0 0; | |||
| .el-step__line { | |||
| left: 40px; | |||
| right: 8px; | |||
| top: 15px; | |||
| } | |||
| } | |||
| .el-step__main { | |||
| /*flex: 1;*/ | |||
| flex-grow: 1; | |||
| position: relative; | |||
| .el-step__title { | |||
| line-height: 32px; | |||
| background-color: $--color-white; | |||
| display: inline-block; | |||
| padding-right: 8px; | |||
| } | |||
| .el-step__description { | |||
| margin-top: 0; | |||
| } | |||
| } | |||
| } | |||
| .el-step__icon.is-icon { | |||
| width: 32px; | |||
| } | |||
| } | |||
| /** 图片预览 */ | |||
| .el-image-viewer__close { | |||
| color: #FFF; | |||
| width: 100px; | |||
| height: 100px; | |||
| top: -50px; | |||
| right: -50px; | |||
| font-size: 22px; | |||
| padding: 40px 38px 0 0; | |||
| background-color: $--color-text-regular; | |||
| border-radius: 50%; | |||
| opacity: .8; | |||
| } | |||
| .el-image-viewer__close i:before { | |||
| content: "\e6db"; | |||
| } | |||
| /** InputNumber */ | |||
| .el-input-number.ele-text-left .el-input__inner { | |||
| text-align: left; | |||
| } | |||
| .el-input-number.ele-text-right .el-input__inner { | |||
| text-align: right; | |||
| } | |||
| /** Timeline */ | |||
| .ele-timeline { | |||
| .el-timeline-item__tail { | |||
| top: 2px; | |||
| border-left-width: 1px; | |||
| } | |||
| .el-timeline-item__node--normal { | |||
| left: 0; | |||
| top: 2px; | |||
| width: 9px; | |||
| height: 9px; | |||
| } | |||
| .el-timeline-item__node--primary { | |||
| top: 4px; | |||
| left: 2px; | |||
| width: 5px; | |||
| height: 5px; | |||
| background-color: $--color-white; | |||
| box-shadow: 0 0 0 3px $--color-primary; | |||
| } | |||
| .el-timeline-item__content { | |||
| color: $--color-text-regular; | |||
| } | |||
| } | |||
| /** badge */ | |||
| .el-badge__content { | |||
| height: 16px; | |||
| line-height: 16px; | |||
| padding: 0 5px; | |||
| border: none; | |||
| } | |||
| .ele-badge-static { | |||
| line-height: 0; | |||
| .el-badge__content { | |||
| position: static; | |||
| transform: none; | |||
| } | |||
| } | |||
| /** Message */ | |||
| .el-message { | |||
| min-width: inherit; | |||
| padding: 12px 16px; | |||
| .el-message__icon { | |||
| font-size: 18px; | |||
| } | |||
| .el-message__content { | |||
| line-height: 18px; | |||
| } | |||
| &.el-message--info { | |||
| border-color: rgba($--color-text-secondary, .15); | |||
| } | |||
| &:not(.ele-message-border) { | |||
| background-color: $--color-white; | |||
| box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15); | |||
| border: none; | |||
| .el-message__content { | |||
| color: inherit; | |||
| } | |||
| .el-icon-info { | |||
| color: $--color-primary; | |||
| } | |||
| } | |||
| &.ele-message-loading .el-message__icon { | |||
| animation: rotating 1s linear infinite; | |||
| &:before { | |||
| content: "\e73d"; | |||
| font-family: 'ele-icon' !important; | |||
| } | |||
| } | |||
| } | |||
| /** Notification */ | |||
| .el-notification { | |||
| border-radius: 4px; | |||
| box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15); | |||
| border: none; | |||
| } | |||
| .el-notification__title { | |||
| font-weight: 500; | |||
| } | |||
| /** upload-dragger */ | |||
| body .el-upload-dragger { | |||
| background-color: transparent; | |||
| border-color: $--border-color-base; | |||
| } | |||
| /** el-avatar */ | |||
| .el-avatar > img { | |||
| width: 100%; | |||
| } | |||
| /** nprogress */ | |||
| #nprogress { | |||
| .bar { | |||
| background: $--color-primary; | |||
| } | |||
| .peg { | |||
| box-shadow: 0 0 10px $--color-primary, 0 0 5px $--color-primary; | |||
| } | |||
| .spinner-icon { | |||
| border-top-color: $--color-primary; | |||
| border-left-color: $--color-primary; | |||
| } | |||
| } | |||
| /** 小屏幕样式 */ | |||
| @media screen and (max-width: 768px) { | |||
| .el-pagination.ele-pagination, .el-pagination.ele-pagination-circle { | |||
| .el-pagination__total, .el-pagination__sizes, .el-pagination__jump { | |||
| display: none; | |||
| } | |||
| } | |||
| } | |||
BIN
src/styles/eleadmin/fonts/eleadmin-icons.ttf
View File
BIN
src/styles/eleadmin/fonts/eleadmin-icons.woff
View File
+ 897
- 0
src/styles/eleadmin/icon.scss
View File
| @@ -0,0 +1,897 @@ | |||
| /** EleAdmin Icons License By http://eleadmin.com */ | |||
| $--ele-font-path: 'fonts' !default; | |||
| // element-ui的icon.scss和transition.scss不需要参与换主题所以在这里引用 | |||
| $--font-path: '~element-ui/lib/theme-chalk/fonts'; | |||
| @import "~element-ui/packages/theme-chalk/src/icon.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/common/transition.scss"; | |||
| @font-face { | |||
| font-family: "ele-icon"; | |||
| src: url('#{$--ele-font-path}/eleadmin-icons.woff') format('woff'), | |||
| url('#{$--ele-font-path}/eleadmin-icons.ttf') format('truetype'); | |||
| } | |||
| body [class^="el-icon-_"], body [class*="el-icon-_"] { | |||
| font-family: "ele-icon" !important; | |||
| } | |||
| .el-icon-_trophy-solid:before { | |||
| content: "\e867"; | |||
| } | |||
| .el-icon-_man:before { | |||
| content: "\e8c2"; | |||
| } | |||
| .el-icon-_unfold:before { | |||
| content: "\e7f3"; | |||
| } | |||
| .el-icon-_fold:before { | |||
| content: "\e7f4"; | |||
| } | |||
| .el-icon-_nav:before { | |||
| content: "\e7f5"; | |||
| } | |||
| .el-icon-_postcard-solid:before { | |||
| content: "\e860"; | |||
| } | |||
| .el-icon-_game-solid:before { | |||
| content: "\e72b"; | |||
| } | |||
| .el-icon-_lock-solid:before { | |||
| content: "\e637"; | |||
| } | |||
| .el-icon-_unlock-solid:before { | |||
| content: "\e661"; | |||
| } | |||
| .el-icon-_vercode-solid:before { | |||
| content: "\e66a"; | |||
| } | |||
| .el-icon-_refund-solid:before { | |||
| content: "\e632"; | |||
| } | |||
| .el-icon-_email-solid:before { | |||
| content: "\eb34"; | |||
| } | |||
| .el-icon-_money-solid:before { | |||
| content: "\e6b3"; | |||
| } | |||
| .el-icon-_brush-solid:before { | |||
| content: "\e619"; | |||
| } | |||
| .el-icon-_compute-solid:before { | |||
| content: "\e630"; | |||
| } | |||
| .el-icon-_live-solid:before { | |||
| content: "\e6da"; | |||
| } | |||
| .el-icon-_pie-chart-solid:before { | |||
| content: "\e6e5"; | |||
| } | |||
| .el-icon-_evaluate-solid:before { | |||
| content: "\e88b"; | |||
| } | |||
| .el-icon-_car-sloid:before { | |||
| content: "\e627"; | |||
| } | |||
| .el-icon-_printer-solid:before { | |||
| content: "\e6bb"; | |||
| } | |||
| .el-icon-_retrieve-solid:before { | |||
| content: "\e695"; | |||
| } | |||
| .el-icon-_palette-solid:before { | |||
| content: "\e9c7"; | |||
| } | |||
| .el-icon-_puzzle-solid:before { | |||
| content: "\ea20"; | |||
| } | |||
| .el-icon-_tag-sloid:before { | |||
| content: "\eaf1"; | |||
| } | |||
| .el-icon-_bank-card-solid:before { | |||
| content: "\e6b7"; | |||
| } | |||
| .el-icon-_prerogative-solid:before { | |||
| content: "\e722"; | |||
| } | |||
| .el-icon-_prerogative2-solid:before { | |||
| content: "\e7c8"; | |||
| } | |||
| .el-icon-_bus-sloid:before { | |||
| content: "\e608"; | |||
| } | |||
| .el-icon-_service-solid:before { | |||
| content: "\e61a"; | |||
| } | |||
| .el-icon-_news-solid:before { | |||
| content: "\e61b"; | |||
| } | |||
| .el-icon-_time-solid:before { | |||
| content: "\e61c"; | |||
| } | |||
| .el-icon-_red-packet-solid:before { | |||
| content: "\e629"; | |||
| } | |||
| .el-icon-_ticket-sloid:before { | |||
| content: "\e62f"; | |||
| } | |||
| .el-icon-_analysis-solid:before { | |||
| content: "\e636"; | |||
| } | |||
| .el-icon-_shopping-cart-sloid:before { | |||
| content: "\e63b"; | |||
| } | |||
| .el-icon-_truck-sloid:before { | |||
| content: "\e641"; | |||
| } | |||
| .el-icon-_database-solid:before { | |||
| content: "\e642"; | |||
| } | |||
| .el-icon-_present-sloid:before { | |||
| content: "\e607"; | |||
| } | |||
| .el-icon-_camera2-solid:before { | |||
| content: "\e611"; | |||
| } | |||
| .el-icon-_target-sloid:before { | |||
| content: "\e617"; | |||
| } | |||
| .el-icon-_user-group-solid:before { | |||
| content: "\e62c"; | |||
| } | |||
| .el-icon-_horn-sloid:before { | |||
| content: "\e633"; | |||
| } | |||
| .el-icon-_prerogative3-solid:before { | |||
| content: "\e63a"; | |||
| } | |||
| .el-icon-_help:before { | |||
| content: "\e7fe"; | |||
| } | |||
| .el-icon-_folder:before { | |||
| content: "\e85e"; | |||
| } | |||
| .el-icon-_folder-open:before { | |||
| content: "\e85f"; | |||
| } | |||
| .el-icon-_loading:before { | |||
| content: "\e73d"; | |||
| } | |||
| .el-icon-_usd:before { | |||
| content: "\e606"; | |||
| } | |||
| .el-icon-_rmb:before { | |||
| content: "\e634"; | |||
| } | |||
| .el-icon-_face-cry:before { | |||
| content: "\e6b8"; | |||
| } | |||
| .el-icon-_face-smile:before { | |||
| content: "\e616"; | |||
| } | |||
| .el-icon-_back:before { | |||
| content: "\e620"; | |||
| } | |||
| .el-icon-_forward:before { | |||
| content: "\e624"; | |||
| } | |||
| .el-icon-_android:before { | |||
| content: "\e610"; | |||
| } | |||
| .el-icon-_more:before { | |||
| content: "\e618"; | |||
| } | |||
| .el-icon-_state12:before { | |||
| content: "\e605"; | |||
| } | |||
| .el-icon-_user-add:before { | |||
| content: "\e687"; | |||
| } | |||
| .el-icon-_retrieve:before { | |||
| content: "\e6c6"; | |||
| } | |||
| .el-icon-_database:before { | |||
| content: "\e6e4"; | |||
| } | |||
| .el-icon-_target:before { | |||
| content: "\e623"; | |||
| } | |||
| .el-icon-_tree:before { | |||
| content: "\e61e"; | |||
| } | |||
| .el-icon-_fire-solid:before { | |||
| content: "\e6be"; | |||
| } | |||
| .el-icon-_barcode:before { | |||
| content: "\e71a"; | |||
| } | |||
| .el-icon-_api:before { | |||
| content: "\e71c"; | |||
| } | |||
| .el-icon-_number:before { | |||
| content: "\e742"; | |||
| } | |||
| .el-icon-_pushpin:before { | |||
| content: "\e746"; | |||
| } | |||
| .el-icon-_qrcode:before { | |||
| content: "\e747"; | |||
| } | |||
| .el-icon-_percentage:before { | |||
| content: "\e7e2"; | |||
| } | |||
| .el-icon-_scan:before { | |||
| content: "\e776"; | |||
| } | |||
| .el-icon-_shop:before { | |||
| content: "\e8bb"; | |||
| } | |||
| .el-icon-_github:before { | |||
| content: "\e713"; | |||
| } | |||
| .el-icon-_gitee:before { | |||
| content: "\e6f5"; | |||
| } | |||
| .el-icon-_wifi:before { | |||
| content: "\e7e0"; | |||
| } | |||
| .el-icon-_compress:before { | |||
| content: "\e914"; | |||
| } | |||
| .el-icon-_evaluate:before { | |||
| content: "\e673"; | |||
| } | |||
| .el-icon-_wallet:before { | |||
| content: "\e626"; | |||
| } | |||
| .el-icon-_refund:before { | |||
| content: "\e628"; | |||
| } | |||
| .el-icon-_red-packet:before { | |||
| content: "\e62a"; | |||
| } | |||
| .el-icon-_footprint:before { | |||
| content: "\e631"; | |||
| } | |||
| .el-icon-_school:before { | |||
| content: "\e622"; | |||
| } | |||
| .el-icon-_battery:before { | |||
| content: "\e63d"; | |||
| } | |||
| .el-icon-_setting-solid:before { | |||
| content: "\e708"; | |||
| } | |||
| .el-icon-_recycle:before { | |||
| content: "\e7d6"; | |||
| } | |||
| .el-icon-_terminal:before { | |||
| content: "\e849"; | |||
| } | |||
| .el-icon-_usb:before { | |||
| content: "\e87c"; | |||
| } | |||
| .el-icon-_zoom-out:before { | |||
| content: "\e64d"; | |||
| } | |||
| .el-icon-_zoom-in:before { | |||
| content: "\e64e"; | |||
| } | |||
| .el-icon-_bug:before { | |||
| content: "\e690"; | |||
| } | |||
| .el-icon-_feedback:before { | |||
| content: "\e683"; | |||
| } | |||
| .el-icon-_wechat:before { | |||
| content: "\e60e"; | |||
| } | |||
| .el-icon-_taobao:before { | |||
| content: "\e692"; | |||
| } | |||
| .el-icon-_alipay:before { | |||
| content: "\e694"; | |||
| } | |||
| .el-icon-_qqzone:before { | |||
| content: "\e698"; | |||
| } | |||
| .el-icon-_zhihu:before { | |||
| content: "\e69c"; | |||
| } | |||
| .el-icon-_twitter:before { | |||
| content: "\e6a1"; | |||
| } | |||
| .el-icon-_weibo:before { | |||
| content: "\e6a5"; | |||
| } | |||
| .el-icon-_qq:before { | |||
| content: "\e6a6"; | |||
| } | |||
| .el-icon-_wxzone:before { | |||
| content: "\e6a7"; | |||
| } | |||
| .el-icon-_recommend:before { | |||
| content: "\e658"; | |||
| } | |||
| .el-icon-_walk:before { | |||
| content: "\e8e7"; | |||
| } | |||
| .el-icon-_woman:before { | |||
| content: "\e8ea"; | |||
| } | |||
| .el-icon-_airplane:before { | |||
| content: "\e88e"; | |||
| } | |||
| .el-icon-_bluetooth:before { | |||
| content: "\e896"; | |||
| } | |||
| .el-icon-_bug-solid:before { | |||
| content: "\e89a"; | |||
| } | |||
| .el-icon-_fingerprint:before { | |||
| content: "\e8ad"; | |||
| } | |||
| .el-icon-_signal:before { | |||
| content: "\e8d3"; | |||
| } | |||
| .el-icon-_transgender:before { | |||
| content: "\e8e2"; | |||
| } | |||
| .el-icon-_trending-down:before { | |||
| content: "\e8e3"; | |||
| } | |||
| .el-icon-_trending-up:before { | |||
| content: "\e8e4"; | |||
| } | |||
| .el-icon-_school-solid:before { | |||
| content: "\e8dc"; | |||
| } | |||
| .el-icon-_globe:before { | |||
| content: "\e72c"; | |||
| } | |||
| .el-icon-_network:before { | |||
| content: "\e7e4"; | |||
| } | |||
| .el-icon-_bluetooth-solid:before { | |||
| content: "\e741"; | |||
| } | |||
| .el-icon-_signal-box:before { | |||
| content: "\e666"; | |||
| } | |||
| .el-icon-_state1:before { | |||
| content: "\e601"; | |||
| } | |||
| .el-icon-_state2:before { | |||
| content: "\e602"; | |||
| } | |||
| .el-icon-_state3:before { | |||
| content: "\e603"; | |||
| } | |||
| .el-icon-_state4:before { | |||
| content: "\e604"; | |||
| } | |||
| .el-icon-_state5:before { | |||
| content: "\e609"; | |||
| } | |||
| .el-icon-_state6:before { | |||
| content: "\e60b"; | |||
| } | |||
| .el-icon-_state7:before { | |||
| content: "\e60f"; | |||
| } | |||
| .el-icon-_state8:before { | |||
| content: "\e612"; | |||
| } | |||
| .el-icon-_state9:before { | |||
| content: "\e613"; | |||
| } | |||
| .el-icon-_state10:before { | |||
| content: "\e614"; | |||
| } | |||
| .el-icon-_state11:before { | |||
| content: "\e615"; | |||
| } | |||
| .el-icon-_love:before { | |||
| content: "\e654"; | |||
| } | |||
| .el-icon-_quote2:before { | |||
| content: "\e6b2"; | |||
| } | |||
| .el-icon-_quote1:before { | |||
| content: "\e6b4"; | |||
| } | |||
| .el-icon-_service:before { | |||
| content: "\e6bd"; | |||
| } | |||
| .el-icon-_dis:before { | |||
| content: "\e670"; | |||
| } | |||
| .el-icon-_like:before { | |||
| content: "\e672"; | |||
| } | |||
| .el-icon-_like-solid:before { | |||
| content: "\e693"; | |||
| } | |||
| .el-icon-_dis-solid:before { | |||
| content: "\e697"; | |||
| } | |||
| .el-icon-_heart:before { | |||
| content: "\e6ac"; | |||
| } | |||
| .el-icon-_heart-solid:before { | |||
| content: "\e6ad"; | |||
| } | |||
| .el-icon-_flash:before { | |||
| content: "\ea45"; | |||
| } | |||
| .el-icon-_rocket:before { | |||
| content: "\e600"; | |||
| } | |||
| .el-icon-_date-end:before { | |||
| content: "\e62b"; | |||
| } | |||
| .el-icon-_date-start:before { | |||
| content: "\e62e"; | |||
| } | |||
| .el-icon-_fire:before { | |||
| content: "\e72f"; | |||
| } | |||
| .el-icon-_ie:before { | |||
| content: "\e727"; | |||
| } | |||
| .el-icon-_pad:before { | |||
| content: "\e63c"; | |||
| } | |||
| .el-icon-_wxpay:before { | |||
| content: "\e61f"; | |||
| } | |||
| .el-icon-_setting:before { | |||
| content: "\e677"; | |||
| } | |||
| .el-icon-_medkit-solid:before { | |||
| content: "\e7ec"; | |||
| } | |||
| .el-icon-_warning-solid:before { | |||
| content: "\e70f"; | |||
| } | |||
| .el-icon-_warning:before { | |||
| content: "\e763"; | |||
| } | |||
| .el-icon-_vercode:before { | |||
| content: "\e667"; | |||
| } | |||
| .el-icon-_battery-full:before { | |||
| content: "\e8cf"; | |||
| } | |||
| .el-icon-_backspace-solid:before { | |||
| content: "\e77b"; | |||
| } | |||
| .el-icon-_screen-restore:before { | |||
| content: "\e729"; | |||
| } | |||
| .el-icon-_programme:before { | |||
| content: "\e62d"; | |||
| } | |||
| .el-icon-_eye-close:before { | |||
| content: "\e669"; | |||
| } | |||
| .el-icon-_palette:before { | |||
| content: "\e66e"; | |||
| } | |||
| .el-icon-_lamp:before { | |||
| content: "\e6e3"; | |||
| } | |||
| .el-icon-_snow:before { | |||
| content: "\e8a3"; | |||
| } | |||
| .el-icon-_flask:before { | |||
| content: "\e8b1"; | |||
| } | |||
| .el-icon-_flash-solid:before { | |||
| content: "\e771"; | |||
| } | |||
| .el-icon-_temperature:before { | |||
| content: "\e621"; | |||
| } | |||
| .el-icon-_infinite:before { | |||
| content: "\e7df"; | |||
| } | |||
| .el-icon-_cube:before { | |||
| content: "\e6d0"; | |||
| } | |||
| .el-icon-_sent:before { | |||
| content: "\e60d"; | |||
| } | |||
| .el-icon-_nuclear:before { | |||
| content: "\e853"; | |||
| } | |||
| .el-icon-_leaf:before { | |||
| content: "\e668"; | |||
| } | |||
| .el-icon-_prerogative:before { | |||
| content: "\e61d"; | |||
| } | |||
| .el-icon-_windows:before { | |||
| content: "\e898"; | |||
| } | |||
| .el-icon-_aite:before { | |||
| content: "\e60a"; | |||
| } | |||
| .el-icon-_ios:before { | |||
| content: "\e60c"; | |||
| } | |||
| .el-icon-_table:before { | |||
| content: "\e66d"; | |||
| } | |||
| .el-icon-_music:before { | |||
| content: "\e671"; | |||
| } | |||
| .el-icon-_camera:before { | |||
| content: "\e678"; | |||
| } | |||
| .el-icon-_video:before { | |||
| content: "\e679"; | |||
| } | |||
| .el-icon-_component:before { | |||
| content: "\e67e"; | |||
| } | |||
| .el-icon-_upload:before { | |||
| content: "\e688"; | |||
| } | |||
| .el-icon-_user-group:before { | |||
| content: "\e68c"; | |||
| } | |||
| .el-icon-_download:before { | |||
| content: "\e68d"; | |||
| } | |||
| .el-icon-_transfer:before { | |||
| content: "\e691"; | |||
| } | |||
| .el-icon-_filter:before { | |||
| content: "\e69a"; | |||
| } | |||
| .el-icon-_timeline:before { | |||
| content: "\e69b"; | |||
| } | |||
| .el-icon-_code:before { | |||
| content: "\e6a0"; | |||
| } | |||
| .el-icon-_cols:before { | |||
| content: "\e6b6"; | |||
| } | |||
| .el-icon-_info:before { | |||
| content: "\e6bf"; | |||
| } | |||
| .el-icon-_question:before { | |||
| content: "\e6c0"; | |||
| } | |||
| .el-icon-_compute:before { | |||
| content: "\e6c1"; | |||
| } | |||
| .el-icon-_back-top:before { | |||
| content: "\e6c4"; | |||
| } | |||
| .el-icon-_condition:before { | |||
| content: "\e6d8"; | |||
| } | |||
| .el-icon-_save:before { | |||
| content: "\e6d9"; | |||
| } | |||
| .el-icon-_bus:before { | |||
| content: "\e6fa"; | |||
| } | |||
| .el-icon-_fly:before { | |||
| content: "\e6fb"; | |||
| } | |||
| .el-icon-_car:before { | |||
| content: "\e6fc"; | |||
| } | |||
| .el-icon-_function:before { | |||
| content: "\e6fd"; | |||
| } | |||
| .el-icon-_straw:before { | |||
| content: "\e702"; | |||
| } | |||
| .el-icon-_salary:before { | |||
| content: "\e70d"; | |||
| } | |||
| .el-icon-_appointment-ok:before { | |||
| content: "\e710"; | |||
| } | |||
| .el-icon-_appointment:before { | |||
| content: "\e711"; | |||
| } | |||
| .el-icon-_share:before { | |||
| content: "\e712"; | |||
| } | |||
| .el-icon-_backspace:before { | |||
| content: "\e715"; | |||
| } | |||
| .el-icon-_font-size:before { | |||
| content: "\e725"; | |||
| } | |||
| .el-icon-_font-family:before { | |||
| content: "\e726"; | |||
| } | |||
| .el-icon-_language-solid:before { | |||
| content: "\e72a"; | |||
| } | |||
| .el-icon-_surveying:before { | |||
| content: "\e733"; | |||
| } | |||
| .el-icon-_hammer:before { | |||
| content: "\e735"; | |||
| } | |||
| .el-icon-_chrome:before { | |||
| content: "\e736"; | |||
| } | |||
| .el-icon-_screen-full:before { | |||
| content: "\e73c"; | |||
| } | |||
| .el-icon-_brush:before { | |||
| content: "\e759"; | |||
| } | |||
| .el-icon-_connecting-line:before { | |||
| content: "\e75b"; | |||
| } | |||
| .el-icon-_keyboard:before { | |||
| content: "\e75f"; | |||
| } | |||
| .el-icon-_command-ios:before { | |||
| content: "\e760"; | |||
| } | |||
| .el-icon-_logout:before { | |||
| content: "\e766"; | |||
| } | |||
| .el-icon-_language:before { | |||
| content: "\e769"; | |||
| } | |||
| .el-icon-_template:before { | |||
| content: "\e76a"; | |||
| } | |||
| .el-icon-_var:before { | |||
| content: "\e772"; | |||
| } | |||
| .el-icon-_menu:before { | |||
| content: "\e773"; | |||
| } | |||
| .el-icon-_rss:before { | |||
| content: "\e808"; | |||
| } | |||
| .el-icon-_mate:before { | |||
| content: "\e786"; | |||
| } | |||
| .el-icon-_horn:before { | |||
| content: "\e7b4"; | |||
| } | |||
| .el-icon-_visa:before { | |||
| content: "\e78c"; | |||
| } | |||
| .el-icon-_horn-close:before { | |||
| content: "\e63e"; | |||
| } | |||
| .el-icon-_integral:before { | |||
| content: "\e6ff"; | |||
| } | |||
| .el-icon-_integral-solid:before { | |||
| content: "\e728"; | |||
| } | |||
+ 109
- 0
src/styles/eleadmin/index.scss
View File
| @@ -0,0 +1,109 @@ | |||
| /** EleAdmin v1.0.0 date:2020-07-07 License By http://eleadmin.com */ | |||
| $--color-success: #52c41a; | |||
| $--color-warning: #faad14; | |||
| $--color-danger: #ff4d4f; | |||
| $--color-success-light: rgba($--color-success, .3); | |||
| $--color-warning-light: rgba($--color-warning, .3); | |||
| $--color-danger-light: rgba($--color-danger, .3); | |||
| $--background-color-base: #fafafa; | |||
| $--color-text-primary: #262626; | |||
| $--color-text-regular: #595959; | |||
| $--color-text-secondary: #8c8c8c; | |||
| $--color-text-placeholder: #bfbfbf; | |||
| $--border-color-base: #DDDDDD; | |||
| $--border-color-light: #E5E5E5; | |||
| $--border-color-lighter: #EDEDED; | |||
| $--border-color-extra-light: #F4F4F4; | |||
| // 这里不直接引入element-ui的index.scss是因为icon.scss和transition.scss不需要参与换主题排除这两个减少资源浪费 | |||
| //@import '~element-ui/packages/theme-chalk/src/index'; | |||
| @import "~element-ui/packages/theme-chalk/src/pagination.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/dialog.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/autocomplete.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/dropdown.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/dropdown-menu.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/dropdown-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/menu.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/submenu.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/menu-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/menu-item-group.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/input.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/input-number.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/radio.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/radio-group.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/radio-button.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/checkbox.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/checkbox-button.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/checkbox-group.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/switch.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/select.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/button.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/button-group.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/table.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/table-column.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/date-picker.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/time-select.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/time-picker.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/popover.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/tooltip.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/message-box.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/breadcrumb.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/breadcrumb-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/form.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/form-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/tabs.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/tab-pane.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/tag.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/tree.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/alert.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/notification.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/slider.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/loading.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/row.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/col.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/upload.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/progress.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/spinner.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/message.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/badge.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/card.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/rate.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/steps.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/step.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/carousel.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/scrollbar.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/carousel-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/collapse.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/collapse-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/cascader.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/color-picker.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/transfer.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/container.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/header.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/aside.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/main.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/footer.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/timeline.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/timeline-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/link.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/divider.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/image.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/calendar.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/backtop.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/infinite-scroll.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/page-header.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/cascader-panel.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/avatar.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/drawer.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/popconfirm.scss"; | |||
| // eleAdmin的css | |||
| @import 'common'; | |||
| @import 'extension'; | |||
| @import 'menu'; | |||
| @import 'layout'; | |||
+ 677
- 0
src/styles/eleadmin/layout.scss
View File
| @@ -0,0 +1,677 @@ | |||
| /** EleAdmin框架布局样式 License By http://eleadmin.com */ | |||
| @import 'var'; | |||
| /** 框架布局 */ | |||
| .ele-admin-body { | |||
| flex: 1; | |||
| overflow: auto; | |||
| box-sizing: border-box; | |||
| } | |||
| /** 顶栏 */ | |||
| .ele-admin-header { | |||
| background-color: $--color-white; | |||
| box-shadow: $--shadow-head-light; | |||
| display: flex; | |||
| align-items: center; | |||
| box-sizing: border-box; | |||
| position: relative; | |||
| z-index: $--z-index-layout + 2; | |||
| /* logo */ | |||
| .ele-admin-logo { | |||
| color: $--color-logo-light; | |||
| font-size: $--font-size-logo; | |||
| font-weight: 500; | |||
| letter-spacing: 1.5px; | |||
| width: $--size-side-width; | |||
| height: $--size-head-height; | |||
| background-color: $--color-white; | |||
| transition: width .3s ease-in-out, left .3s ease-in-out; | |||
| box-shadow: $--shadow-logo-light; | |||
| white-space: nowrap; | |||
| position: relative; | |||
| overflow: hidden; | |||
| display: flex; | |||
| align-items: center; | |||
| justify-content: center; | |||
| font-family: Avenir, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji; | |||
| img { | |||
| width: 32px; | |||
| height: 32px; | |||
| display: inline-block; | |||
| } | |||
| span { | |||
| margin-left: 10px; | |||
| display: inline-block; | |||
| line-height: 1; | |||
| } | |||
| } | |||
| .el-menu.el-menu--horizontal { | |||
| background-color: transparent; | |||
| border: none; | |||
| & > .el-menu-item { | |||
| padding: 0 12px; | |||
| height: $--size-head-height; | |||
| line-height: $--size-head-height; | |||
| } | |||
| & > .el-submenu { | |||
| .el-submenu__title { | |||
| padding: 0 10px 0 12px; | |||
| height: $--size-head-height; | |||
| line-height: $--size-head-height; | |||
| } | |||
| .el-submenu__icon-arrow { | |||
| margin-left: 3px; | |||
| } | |||
| } | |||
| & > .el-menu-item, & > .el-submenu { | |||
| float: none; | |||
| display: inline-block; | |||
| } | |||
| } | |||
| .ele-header-nav { | |||
| flex: 1; | |||
| overflow: hidden; | |||
| white-space: nowrap; | |||
| scroll-behavior: smooth; | |||
| } | |||
| .ele-header-left, .ele-header-right { | |||
| padding: 0 8px; | |||
| white-space: nowrap; | |||
| .el-menu-item, .el-submenu__title { | |||
| border: none !important; | |||
| } | |||
| .el-menu-item.is-active, .el-submenu.is-active > .el-submenu__title { | |||
| color: $--color-text-regular !important; | |||
| } | |||
| } | |||
| .el-avatar { | |||
| width: 30px; | |||
| height: 30px; | |||
| margin-right: 5px; | |||
| } | |||
| .ele-header-breadcrumb { | |||
| padding: 0 10px; | |||
| height: $--size-head-height; | |||
| line-height: $--size-head-height + 3px; | |||
| white-space: nowrap; | |||
| overflow-y: hidden; | |||
| flex: 1; | |||
| .el-breadcrumb__item { | |||
| float: none; | |||
| display: inline-block; | |||
| } | |||
| } | |||
| } | |||
| /** 侧边栏 */ | |||
| .ele-admin-sidebar { | |||
| background-color: $--color-white; | |||
| box-shadow: $--shadow-side-light; | |||
| width: $--size-side-width !important; | |||
| min-height: calc(100vh - #{$--size-head-height}); | |||
| transition: width .3s ease-in-out, left .3s ease-in-out; | |||
| overflow-x: hidden !important; | |||
| position: relative; | |||
| z-index: $--z-index-layout + 3; | |||
| & > .el-menu { | |||
| border: none; | |||
| background-color: transparent; | |||
| & > .el-menu-item, & > .el-submenu > .el-submenu__title { | |||
| margin: 0; | |||
| height: 55px; | |||
| line-height: 55px; | |||
| } | |||
| } | |||
| } | |||
| /** 多页签 */ | |||
| .ele-admin-tabs { | |||
| height: $--size-tab-height; | |||
| padding-right: $--size-tab-height; | |||
| background-color: $--color-white; | |||
| box-shadow: $--shadow-head-light; | |||
| box-sizing: border-box; | |||
| position: relative; | |||
| z-index: $--z-index-layout; | |||
| .el-tabs__item { | |||
| color: $--color-text-secondary; | |||
| padding: 0 15px !important; | |||
| height: $--size-tab-height; | |||
| line-height: $--size-tab-height;; | |||
| transition: background-color .2s, color .2s; | |||
| &.is-closable { | |||
| padding-right: 9px !important; | |||
| } | |||
| &:after { | |||
| content: ""; | |||
| height: 2px; | |||
| width: 0; | |||
| background-color: $--color-primary; | |||
| position: absolute; | |||
| bottom: 0; | |||
| left: 0; | |||
| transition: width .2s; | |||
| } | |||
| &:hover { | |||
| color: $--color-text-primary; | |||
| background-color: rgba(0, 0, 0, .02); | |||
| &:after { | |||
| width: 100%; | |||
| } | |||
| } | |||
| &.is-active { | |||
| color: $--color-primary; | |||
| background-color: rgba($--color-primary, .08); | |||
| &:after { | |||
| width: 100%; | |||
| } | |||
| } | |||
| .el-icon-close { | |||
| margin-left: 4px; | |||
| color: $--color-text-secondary; | |||
| &:hover { | |||
| color: #FFF; | |||
| background-color: $--color-danger; | |||
| } | |||
| } | |||
| } | |||
| .el-tabs__active-bar, .el-tabs__content { | |||
| display: none; | |||
| } | |||
| @mixin tabs-btn { | |||
| width: $--size-tab-height; | |||
| height: $--size-tab-height; | |||
| line-height: $--size-tab-height; | |||
| text-align: center; | |||
| box-sizing: border-box; | |||
| font-size: $--font-size-medium; | |||
| color: $--color-text-secondary; | |||
| transition: background-color .2s; | |||
| &:hover { | |||
| background-color: rgba(0, 0, 0, .02); | |||
| } | |||
| } | |||
| .el-tabs__nav-wrap { | |||
| padding: 0 $--size-tab-height; | |||
| &:before, &:after { | |||
| @include tabs-btn; | |||
| position: absolute; | |||
| top: 0; | |||
| left: 0; | |||
| font-family: 'element-icons' !important; | |||
| speak: none; | |||
| font-style: normal; | |||
| font-weight: normal; | |||
| font-variant: normal; | |||
| text-transform: none; | |||
| -webkit-font-smoothing: antialiased; | |||
| -moz-osx-font-smoothing: grayscale; | |||
| cursor: not-allowed; | |||
| } | |||
| &:before { | |||
| content: "\e6de"; | |||
| } | |||
| &:after { | |||
| content: "\e6e0"; | |||
| right: 0; | |||
| left: auto; | |||
| bottom: auto; | |||
| height: auto; | |||
| background-color: transparent; | |||
| } | |||
| &.is-scrollable { | |||
| padding: 0 ($--size-tab-height - 1px) 0 $--size-tab-height; | |||
| &:before, &:after { | |||
| display: none; | |||
| } | |||
| } | |||
| } | |||
| .el-tabs__nav-next, .el-tabs__nav-prev { | |||
| @include tabs-btn; | |||
| i { | |||
| vertical-align: middle; | |||
| margin-top: -4px; | |||
| } | |||
| } | |||
| .ele-tabs-drop { | |||
| position: absolute; | |||
| right: 0; | |||
| top: 0; | |||
| .el-icon-arrow-down { | |||
| @include tabs-btn; | |||
| display: inline-block; | |||
| cursor: pointer; | |||
| } | |||
| } | |||
| } | |||
| .ele-tabs-show .ele-admin-header { | |||
| box-shadow: 0 1px 0 $--border-color-extra-light; | |||
| } | |||
| /** 折叠侧边栏 */ | |||
| .ele-layout-collapse { | |||
| .ele-admin-logo > span { | |||
| display: none; | |||
| } | |||
| .ele-admin-logo, .ele-admin-sidebar, .ele-admin-sidebar .el-menu--collapse { | |||
| width: $--size-side-width-collapse !important; | |||
| } | |||
| .ele-admin-sidebar .el-menu--collapse > li > .el-tooltip, .ele-admin-sidebar .el-menu--collapse > li > .el-submenu__title { | |||
| padding: 0 !important; | |||
| text-align: center !important; | |||
| } | |||
| } | |||
| /** 主题风格 */ | |||
| /* 固定顶栏 */ | |||
| .ele-layout-fixed { | |||
| padding-top: $--size-head-height; | |||
| .ele-admin-header { | |||
| position: fixed; | |||
| top: 0; | |||
| left: 0; | |||
| right: 0; | |||
| } | |||
| .ele-admin-sidebar { | |||
| position: fixed; | |||
| top: $--size-head-height; | |||
| bottom: 0; | |||
| left: 0; | |||
| } | |||
| .ele-admin-sidebar + .ele-admin-body { | |||
| padding-left: $--size-side-width; | |||
| transition: padding-left .3s ease-in-out; | |||
| } | |||
| &.ele-tabs-show .ele-admin-body { | |||
| padding-top: $--size-tab-height; | |||
| } | |||
| .ele-admin-tabs { | |||
| position: fixed; | |||
| top: $--size-head-height; | |||
| left: 0; | |||
| right: 0; | |||
| transition: left .3s ease-in-out; | |||
| } | |||
| .ele-admin-sidebar + .ele-admin-body .ele-admin-tabs { | |||
| left: $--size-side-width; | |||
| } | |||
| &.ele-layout-collapse { | |||
| .ele-admin-sidebar + .ele-admin-body { | |||
| padding-left: $--size-side-width-collapse; | |||
| } | |||
| .ele-admin-sidebar + .ele-admin-body .ele-admin-tabs { | |||
| left: $--size-side-width-collapse; | |||
| } | |||
| } | |||
| } | |||
| /* 暗色侧边栏 */ | |||
| .ele-side-dark { | |||
| .ele-admin-logo { | |||
| color: $--color-logo-dark; | |||
| box-shadow: $--shadow-logo-dark; | |||
| background-color: $--background-side-dark; | |||
| } | |||
| .ele-admin-sidebar { | |||
| box-shadow: $--shadow-side-dark; | |||
| background-color: $--background-side-dark; | |||
| } | |||
| } | |||
| /* logo宽度自适应 */ | |||
| @media screen and (min-width: 768px) { | |||
| .ele-logo-auto-size { | |||
| .ele-admin-logo { | |||
| width: auto !important; | |||
| padding: 0 15px 0 20px; | |||
| color: $--color-logo-light; | |||
| background-color: transparent; | |||
| box-shadow: none; | |||
| & > span { | |||
| display: inline-block !important; | |||
| } | |||
| } | |||
| .ele-admin-sidebar { | |||
| z-index: $--z-index-layout + 1; | |||
| } | |||
| &.ele-head-dark .ele-admin-logo { | |||
| color: $--color-logo-dark; | |||
| } | |||
| } | |||
| } | |||
| /* 暗色顶栏 */ | |||
| .ele-head-dark .ele-admin-header { | |||
| background-color: $--background-side-dark; | |||
| box-shadow: $--shadow-head-dark; | |||
| .el-breadcrumb__separator, | |||
| .el-breadcrumb__inner, .el-breadcrumb__inner a, | |||
| .el-breadcrumb__item:last-child .el-breadcrumb__inner, | |||
| .el-breadcrumb__item:last-child .el-breadcrumb__inner a, | |||
| .el-breadcrumb__item:last-child .el-breadcrumb__inner:hover, | |||
| .el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover { | |||
| color: rgba(255, 255, 255, .65); | |||
| } | |||
| .el-breadcrumb__inner.is-link { | |||
| color: rgba(255, 255, 255, .85); | |||
| } | |||
| .ele-header-left, .ele-header-right { | |||
| .el-menu-item.is-active, .el-submenu.is-active > .el-submenu__title { | |||
| color: rgba(255, 255, 255, 0.85) !important; | |||
| } | |||
| } | |||
| } | |||
| /* 选项卡圆点风格 */ | |||
| .ele-tab-dot { | |||
| .ele-admin-tabs { | |||
| .el-tabs__item { | |||
| border-right: 1px solid $--border-color-extra-light; | |||
| &:before { | |||
| content: ""; | |||
| width: 9px; | |||
| height: 9px; | |||
| margin-right: 8px; | |||
| display: inline-block; | |||
| background-color: #ddd; | |||
| border-radius: 50%; | |||
| transition: background-color .2s; | |||
| } | |||
| &:after { | |||
| display: none; | |||
| } | |||
| &.is-active { | |||
| &:before { | |||
| background-color: $--color-primary; | |||
| } | |||
| } | |||
| } | |||
| .el-tabs__nav-wrap:before, .el-tabs__nav-prev { | |||
| border-right: 1px solid $--border-color-extra-light; | |||
| } | |||
| .el-tabs__nav-wrap:after, .el-tabs__nav-next, .ele-tabs-drop .el-icon-arrow-down { | |||
| border-left: 1px solid $--border-color-extra-light; | |||
| } | |||
| } | |||
| } | |||
| /* 选项卡卡片风格 */ | |||
| @mixin card-tab-item { | |||
| border-radius: 4px; | |||
| height: $--size-tab-height - $--padding-tab-card; | |||
| line-height: $--size-tab-height - $--padding-tab-card; | |||
| } | |||
| .ele-tab-card { | |||
| .ele-admin-header { | |||
| box-shadow: $--shadow-head-light; | |||
| } | |||
| .ele-admin-tabs { | |||
| padding-top: $--padding-tab-card; | |||
| background-color: $--background-color-body; | |||
| box-shadow: 0 10px 0 $--background-color-body; | |||
| .el-tabs__item { | |||
| @include card-tab-item; | |||
| background-color: $--color-white; | |||
| &:after { | |||
| display: none; | |||
| } | |||
| &.is-active { | |||
| background-color: $--color-primary; | |||
| color: #FFF; | |||
| .el-icon-close { | |||
| color: #FFF; | |||
| } | |||
| } | |||
| & + .el-tabs__item { | |||
| margin-left: 8px; | |||
| } | |||
| } | |||
| .el-tabs__nav-wrap { | |||
| &:before, &:after { | |||
| @include card-tab-item; | |||
| } | |||
| } | |||
| .el-tabs__nav-next, .el-tabs__nav-prev { | |||
| @include card-tab-item; | |||
| background-color: transparent; | |||
| } | |||
| .ele-tabs-drop { | |||
| top: $--padding-tab-card; | |||
| right: $--padding-tab-card; | |||
| .el-icon-arrow-down { | |||
| @include card-tab-item; | |||
| width: $--size-tab-height - $--padding-tab-card; | |||
| background-color: $--color-white; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| /* 侧边栏彩色图标 */ | |||
| .ele-side-color-icon { | |||
| .ele-admin-sidebar > .el-menu > li { | |||
| & > .el-submenu__title > i:first-child, & > i:first-child, & > .el-tooltip > i:first-child { | |||
| width: 28px; | |||
| height: 28px; | |||
| line-height: 28px; | |||
| font-size: 14px; | |||
| color: #FFF !important; | |||
| background-color: #61b2fc; | |||
| border-radius: 50%; | |||
| text-align: center; | |||
| } | |||
| &:nth-child(even) { | |||
| & > .el-submenu__title > i:first-child, & > i:first-child, & > .el-tooltip > i:first-child { | |||
| background-color: #7dd733; | |||
| } | |||
| } | |||
| &:nth-child(3) { | |||
| & > .el-submenu__title > i:first-child, & > i:first-child, & > .el-tooltip > i:first-child { | |||
| background-color: #32a2d4; | |||
| } | |||
| } | |||
| &:nth-child(4) { | |||
| & > .el-submenu__title > i:first-child, & > i:first-child, & > .el-tooltip > i:first-child { | |||
| background-color: #7383cf; | |||
| } | |||
| } | |||
| &:nth-child(5) { | |||
| & > .el-submenu__title > i:first-child, & > i:first-child, & > .el-tooltip > i:first-child { | |||
| background-color: #F5686F; | |||
| } | |||
| } | |||
| &:nth-child(6) { | |||
| & > .el-submenu__title > i:first-child, & > i:first-child, & > .el-tooltip > i:first-child { | |||
| background-color: #2bccce; | |||
| } | |||
| } | |||
| &:nth-child(7) { | |||
| & > .el-submenu__title > i:first-child, & > i:first-child, & > .el-tooltip > i:first-child { | |||
| background-color: #7dd733; | |||
| } | |||
| } | |||
| &:nth-child(8) { | |||
| & > .el-submenu__title > i:first-child, & > i:first-child, & > .el-tooltip > i:first-child { | |||
| background-color: #FAAD14; | |||
| } | |||
| } | |||
| } | |||
| .ele-admin-sidebar .el-submenu > .el-menu > li { | |||
| & > .el-submenu__title > i:first-child:not(.el-submenu__icon-arrow), | |||
| & > i:first-child:not(.el-submenu__icon-arrow) { | |||
| width: 8px; | |||
| height: 8px; | |||
| line-height: 8px; | |||
| font-size: 30px; | |||
| overflow: hidden; | |||
| border-radius: 50%; | |||
| margin: 0 0 0 10px; | |||
| opacity: .25; | |||
| &:before { | |||
| content: "\e797"; | |||
| margin-left: -11px; | |||
| font-family: 'element-icons' !important; | |||
| } | |||
| } | |||
| } | |||
| &.ele-side-dark .ele-admin-sidebar .el-submenu > .el-menu > li { | |||
| & > .el-submenu__title > i:first-child:not(.el-submenu__icon-arrow), | |||
| & > i:first-child:not(.el-submenu__icon-arrow) { | |||
| opacity: 1; | |||
| } | |||
| } | |||
| .ele-admin-sidebar .el-menu-item.is-active i { | |||
| opacity: 1 !important; | |||
| } | |||
| } | |||
| /** 移动设备下样式 */ | |||
| @mixin shade-hide { | |||
| left: 0; | |||
| right: 100vw; | |||
| background-color: transparent; | |||
| visibility: hidden; | |||
| } | |||
| .ele-admin-shade { | |||
| position: fixed; | |||
| top: 0; | |||
| bottom: 0; | |||
| z-index: $--z-index-layout + 2; | |||
| transition: background-color .3s ease-in-out, left .3s ease-in-out; | |||
| @include shade-hide; | |||
| } | |||
| @media screen and (max-width: 768px) { | |||
| .ele-admin-sidebar, .ele-admin-header .ele-admin-logo { | |||
| position: fixed; | |||
| left: 0; | |||
| z-index: $--z-index-layout + 3 !important; | |||
| } | |||
| .ele-admin-logo > span { | |||
| display: inline-block !important; | |||
| } | |||
| .ele-admin-body { | |||
| padding-left: 0 !important; | |||
| } | |||
| .ele-admin-tabs { | |||
| left: 0 !important; | |||
| } | |||
| .ele-admin-shade { | |||
| left: $--size-side-width; | |||
| right: 0; | |||
| visibility: visible; | |||
| background-color: rgba(0, 0, 0, .5); | |||
| } | |||
| .ele-layout-collapse { | |||
| .ele-admin-sidebar, .ele-admin-logo { | |||
| left: -$--size-side-width; | |||
| width: $--size-side-width !important; | |||
| box-shadow: none; | |||
| } | |||
| .ele-admin-shade { | |||
| @include shade-hide; | |||
| } | |||
| } | |||
| .ele-admin-header .ele-header-breadcrumb .el-breadcrumb__item { | |||
| display: none; | |||
| } | |||
| } | |||
| /** 主体内容定宽 */ | |||
| .ele-admin-body-limit .ele-body { | |||
| max-width: 1200px; | |||
| margin: 0 auto; | |||
| } | |||
+ 222
- 0
src/styles/eleadmin/menu.scss
View File
| @@ -0,0 +1,222 @@ | |||
| /** 导航、面包屑、标签页样式重写 License By http://eleadmin.com */ | |||
| @import 'var'; | |||
| /** 导航 */ | |||
| .el-menu { | |||
| & > .el-menu-item, & > .el-submenu > .el-submenu__title { | |||
| color: $--color-text-regular; | |||
| background-color: transparent; | |||
| } | |||
| & > .el-menu-item.is-active, & > .el-submenu.is-active > .el-submenu__title { | |||
| color: $--color-primary !important; | |||
| background-color: transparent; | |||
| } | |||
| &.el-menu--horizontal { | |||
| & > .el-menu-item:focus { | |||
| color: inherit; | |||
| background-color: transparent; | |||
| } | |||
| & > .el-menu-item:not(.is-disabled):hover, & > .el-submenu:not(.is-disabled) > .el-submenu__title:hover { | |||
| background-color: rgba($--color-black, .02); | |||
| } | |||
| & > .el-submenu .el-submenu__icon-arrow { | |||
| margin-left: 6px; | |||
| margin-top: 0; | |||
| } | |||
| } | |||
| .el-menu-item.is-disabled { | |||
| opacity: 0.5; | |||
| } | |||
| .el-menu-item [class^="el-icon-"], .el-submenu > .el-submenu__title [class^="el-icon-"] { | |||
| font-size: 17px; | |||
| margin-right: 0; | |||
| width: auto; | |||
| & + span { | |||
| margin-left: 5px; | |||
| } | |||
| } | |||
| .el-menu-item i, .el-submenu__title i { | |||
| color: inherit; | |||
| } | |||
| .el-submenu__icon-arrow { | |||
| font-weight: 600; | |||
| margin-top: -6px; | |||
| } | |||
| .el-submenu .el-menu { | |||
| background-color: transparent; | |||
| } | |||
| .el-submenu .el-menu-item { | |||
| min-width: auto; | |||
| } | |||
| /* 垂直导航 */ | |||
| &:not(.el-menu--horizontal) { | |||
| .el-menu-item, .el-submenu__title { | |||
| height: 45px; | |||
| line-height: 45px; | |||
| margin: 2px 0; | |||
| &:not(.is-disabled):not(.is-active):hover { | |||
| color: $--color-primary; | |||
| } | |||
| } | |||
| .el-menu-item.is-active { | |||
| border-right: 2px solid $--color-primary; | |||
| background-color: rgba($--color-primary, .08); | |||
| } | |||
| .el-submenu__icon-arrow { | |||
| right: 15px; | |||
| } | |||
| &.ele-menu-dark > .el-menu-item.is-active, | |||
| &.ele-menu-dark .el-menu:not(.el-menu--popup) > .el-menu-item.is-active { | |||
| color: #FFF !important; | |||
| background-color: $--color-primary; | |||
| border-right: none; | |||
| } | |||
| .el-menu-item [class^="el-icon-"] + span, .el-submenu > .el-submenu__title [class^="el-icon-"] + span { | |||
| margin-left: 10px; | |||
| } | |||
| /* 折叠状态 */ | |||
| &.el-menu--collapse > .el-menu-item, &.el-menu--collapse > .el-submenu > .el-submenu__title { | |||
| text-align: center; | |||
| [class^="el-icon-"] + span { | |||
| margin: 0; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| /* 暗色导航 */ | |||
| .el-menu.ele-menu-dark, .ele-menu-dark > .el-menu--popup.el-menu { | |||
| background-color: $--background-side-dark; | |||
| border: none; | |||
| & > .el-menu-item:focus, & > .el-submenu:focus > .el-submenu__title, | |||
| .el-menu:not(.el-menu--popup) > .el-menu-item:focus, | |||
| .el-menu:not(.el-menu--popup) > .el-submenu:focus > .el-submenu__title { | |||
| color: rgba(255, 255, 255, 0.85); | |||
| } | |||
| & > .el-menu-item, & > .el-submenu > .el-submenu__title, | |||
| .el-menu:not(.el-menu--popup) > .el-menu-item, | |||
| .el-menu:not(.el-menu--popup) > .el-submenu > .el-submenu__title { | |||
| color: rgba(255, 255, 255, 0.85); | |||
| &:not(.is-disabled):not(.is-active):hover { | |||
| color: #FFF; | |||
| } | |||
| } | |||
| & > .el-menu-item.is-active, & > .el-submenu.is-active > .el-submenu__title, | |||
| .el-menu:not(.el-menu--popup) > .el-menu-item.is-active, | |||
| .el-menu:not(.el-menu--popup) > .el-submenu.is-active > .el-submenu__title { | |||
| color: #FFF !important; | |||
| border-color: #FFF; | |||
| } | |||
| } | |||
| /* 导航弹出菜单 */ | |||
| .el-menu--popup.el-menu { | |||
| min-width: 160px; | |||
| border-radius: 4px !important; | |||
| box-shadow: 0 1px 6px rgba(0, 0, 0, .2) !important; | |||
| background-color: $--color-white !important; | |||
| border: none !important; | |||
| .el-menu-item, .el-submenu__title { | |||
| height: 40px; | |||
| line-height: 40px; | |||
| color: $--color-text-regular; | |||
| padding: 0 15px; | |||
| margin: 0; | |||
| } | |||
| .el-menu-item.is-active { | |||
| color: $--color-primary; | |||
| background-color: rgba($--color-primary, .08); | |||
| border-right: none; | |||
| } | |||
| .el-submenu__icon-arrow { | |||
| right: 8px; | |||
| } | |||
| } | |||
| .ele-menu-dark > .el-menu--popup.el-menu { | |||
| background-color: $--background-side-dark !important; | |||
| .el-menu-item.is-active { | |||
| background-color: $--color-primary; | |||
| } | |||
| } | |||
| /* 操作风格弹出菜单 */ | |||
| .ele-menu-pop .el-menu--popup.el-menu { | |||
| min-width: 120px; | |||
| .el-menu-item.is-active { | |||
| color: inherit !important; | |||
| background-color: transparent; | |||
| } | |||
| .el-menu-item:hover, .el-submenu__title:hover { | |||
| color: inherit !important; | |||
| background-color: rgba($--color-black, .02); | |||
| } | |||
| } | |||
| /** 面包屑 */ | |||
| .el-breadcrumb__inner, .el-breadcrumb__inner a, | |||
| .el-breadcrumb__item:last-child .el-breadcrumb__inner, | |||
| .el-breadcrumb__item:last-child .el-breadcrumb__inner a, | |||
| .el-breadcrumb__item:last-child .el-breadcrumb__inner:hover, | |||
| .el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover { | |||
| color: $--color-text-secondary; | |||
| } | |||
| .el-breadcrumb__inner.is-link { | |||
| color: $--color-text-regular; | |||
| font-weight: 500; | |||
| } | |||
| /** 标签页 */ | |||
| .el-tabs__header { | |||
| margin: 0 !important; | |||
| } | |||
| .el-tabs__nav-wrap { | |||
| margin-bottom: 0; | |||
| &:after { | |||
| height: 1px; | |||
| background-color: $--border-color-lighter; | |||
| } | |||
| } | |||
| .el-tabs--left .el-tabs__nav-wrap.is-left:after, .el-tabs--left .el-tabs__nav-wrap.is-right:after, | |||
| .el-tabs--right .el-tabs__nav-wrap.is-left:after, .el-tabs--right .el-tabs__nav-wrap.is-right:after { | |||
| width: 1px; | |||
| } | |||
| .el-tabs__item { | |||
| color: inherit; | |||
| padding: 0 15px; | |||
| transition: background-color .2s, color .2s, border-bottom-color .2s, border-top-color .2s, border-left-color .2s, border-right-color .2s; | |||
| } | |||
+ 22
- 0
src/styles/eleadmin/var.scss
View File
| @@ -0,0 +1,22 @@ | |||
| /** EleAdmin Variables License By http://eleadmin.com */ | |||
| $--background-color-body: #F0F2F5 !default; // 页面背景颜色 | |||
| $--background-side-dark: #191A23 !default; // 侧边栏暗色背景颜色 | |||
| $--size-side-width: 256px !default; // 侧边栏宽度 | |||
| $--size-side-width-collapse: 60px !default; // 侧边栏折叠后宽度 | |||
| $--size-head-height: 60px !default; // 顶栏高度 | |||
| $--size-tab-height: 40px !default; // 页签高度 | |||
| $--padding-tab-card: 10px !default; // 卡片式页签边距 | |||
| $--shadow-head-light: 0 1px 3px rgba(0, 0, 0, .08) !default; // 顶栏亮色阴影 | |||
| $--shadow-head-dark: 0 1px 3px rgba(0, 0, 0, .08) !default; // 顶栏暗色阴影 | |||
| $--shadow-logo-light: 1px 0px 3px rgba(0, 0, 0, .08) !default; // logo亮色阴影 | |||
| $--shadow-side-light: 1px 3px 3px rgba(0, 0, 0, .08) !default; // 侧栏亮色阴影 | |||
| $--shadow-logo-dark: 0 0px 4px rgba(0, 21, 41, .35) !default; // logo暗色阴影 | |||
| $--shadow-side-dark: 0 4px 4px rgba(0, 21, 41, .35) !default; // 侧栏暗色阴影 | |||
| $--color-logo-light: rgba(0, 0, 0, .75) !default; // logo亮色文字颜色 | |||
| $--color-logo-dark: rgba(255, 255, 255, .9) !default; // logo暗色文字颜色 | |||
| $--font-size-logo: 20px !default; | |||
| $--z-index-layout: 999 !default; // 框架布局最小z-index | |||
| @import "~element-ui/packages/theme-chalk/src/common/var"; | |||
+ 5
- 0
src/styles/theme/cyan.scss
View File
| @@ -0,0 +1,5 @@ | |||
| /** 明青主题 */ | |||
| $--color-primary: #2BCCCE; | |||
| @import '../eleadmin/index'; | |||
+ 206
- 0
src/styles/theme/dark.scss
View File
| @@ -0,0 +1,206 @@ | |||
| /** 暗黑主题 */ | |||
| $--color-primary: #1890ff; | |||
| $--color-success: #52c41a; | |||
| $--color-warning: #faad14; | |||
| $--color-danger: #ff4d4f; | |||
| $--color-success-light: rgba($--color-success, .3); | |||
| $--color-warning-light: rgba($--color-warning, .3); | |||
| $--color-danger-light: rgba($--color-danger, .3); | |||
| /* 背景色 */ | |||
| $--color-white: #141414; | |||
| $--color-black: #FFFFFF; | |||
| $--background-color-base: #1F1F1F; | |||
| $--background-color-body: #000000; | |||
| /* 文字颜色 */ | |||
| $--color-text-primary: rgba(255, 255, 255, .85); | |||
| $--color-text-regular: rgba(255, 255, 255, .65); | |||
| $--color-text-secondary: rgba(255, 255, 255, .45); | |||
| $--color-text-placeholder: rgba(255, 255, 255, .25); | |||
| /* 边框色 */ | |||
| $--border-color-base: rgba(255, 255, 255, .15); | |||
| $--border-color-light: rgba(255, 255, 255, .1); | |||
| $--border-color-lighter: rgba(255, 255, 255, .05); | |||
| $--border-color-extra-light: rgba(255, 255, 255, .02); | |||
| $--popup-modal-background-color: #000000; | |||
| $--radio-button-checked-font-color: $--color-black; | |||
| /* tooltip */ | |||
| $--tooltip-fill: $--background-color-base; | |||
| $--tooltip-color: $--color-black; | |||
| $--tooltip-border-color: $--background-color-base; | |||
| /* button */ | |||
| $--button-primary-font-color: $--color-black; | |||
| $--button-success-font-color: $--color-black; | |||
| $--button-warning-font-color: $--color-black; | |||
| $--button-danger-font-color: $--color-black; | |||
| /* message */ | |||
| $--message-background-color: $--background-color-base; | |||
| $--message-info-font-color: $--color-text-regular; | |||
| $--color-logo-light: $--color-text-regular; // logo亮色阴影 | |||
| $--background-side-dark: $--color-white; | |||
| input { | |||
| background-color: transparent; | |||
| } | |||
| // element-ui的css | |||
| @import "~element-ui/packages/theme-chalk/src/pagination.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/dialog.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/autocomplete.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/dropdown.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/dropdown-menu.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/dropdown-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/menu.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/submenu.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/menu-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/menu-item-group.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/input.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/input-number.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/radio.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/radio-group.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/radio-button.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/checkbox.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/checkbox-button.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/checkbox-group.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/switch.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/select.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/button.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/button-group.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/table.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/table-column.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/date-picker.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/time-select.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/time-picker.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/popover.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/tooltip.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/message-box.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/breadcrumb.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/breadcrumb-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/form.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/form-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/tabs.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/tab-pane.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/tag.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/tree.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/alert.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/notification.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/slider.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/loading.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/row.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/col.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/upload.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/progress.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/spinner.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/message.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/badge.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/card.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/rate.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/steps.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/step.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/carousel.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/scrollbar.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/carousel-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/collapse.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/collapse-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/cascader.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/color-picker.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/transfer.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/container.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/header.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/aside.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/main.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/footer.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/timeline.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/timeline-item.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/link.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/divider.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/image.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/calendar.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/backtop.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/infinite-scroll.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/page-header.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/cascader-panel.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/avatar.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/drawer.scss"; | |||
| @import "~element-ui/packages/theme-chalk/src/popconfirm.scss"; | |||
| // eleAdmin的css | |||
| @import '../eleadmin/common'; | |||
| @import '../eleadmin/extension'; | |||
| @import '../eleadmin/menu'; | |||
| @import '../eleadmin/layout'; | |||
| /** 遮罩层 */ | |||
| .el-loading-mask { | |||
| background-color: rgba($--color-white, .9); | |||
| } | |||
| /** badge */ | |||
| .el-badge__content { | |||
| color: $--color-black; | |||
| } | |||
| /** pagination */ | |||
| .el-pagination.is-background .el-pager li:not(.disabled).active { | |||
| color: $--color-black; | |||
| } | |||
| /** switch */ | |||
| .el-switch__core:after { | |||
| background-color: $--color-black; | |||
| } | |||
| /** checkbox */ | |||
| .el-checkbox__inner::after { | |||
| border-color: $--color-black; | |||
| } | |||
| .el-checkbox__input.is-indeterminate .el-checkbox__inner::before { | |||
| background-color: $--color-black; | |||
| } | |||
| /** menu */ | |||
| .el-menu { | |||
| border-right-color: $--border-color-light; | |||
| } | |||
| .el-menu.el-menu--horizontal { | |||
| border-bottom-color: $--border-color-light; | |||
| } | |||
| /** tag */ | |||
| .el-tag--dark, .el-tag--dark.el-tag--success, .el-tag--dark.el-tag--info, .el-tag--dark.el-tag--warning, .el-tag--dark.el-tag--danger { | |||
| color: $--color-black; | |||
| } | |||
| .el-tag--dark .el-tag__close { | |||
| color: $--color-black; | |||
| } | |||
| /** 空视图 */ | |||
| .ele-empty { | |||
| color: rgba(255, 255, 255, .3); | |||
| } | |||
| .ele-empty-icon-default-ellipse { | |||
| fill: rgb(38, 38, 38); | |||
| } | |||
| .ele-empty-icon-default-g { | |||
| stroke: rgb(67, 67, 67); | |||
| } | |||
| .ele-empty-icon-default-path { | |||
| fill: rgb(38, 38, 38); | |||
| } | |||
+ 5
- 0
src/styles/theme/dust.scss
View File
| @@ -0,0 +1,5 @@ | |||
| /** 薄暮主题 */ | |||
| $--color-primary: #5F80C7; | |||
| @import '../eleadmin/index'; | |||
+ 5
- 0
src/styles/theme/geekblue.scss
View File
| @@ -0,0 +1,5 @@ | |||
| /** 极客蓝主题 */ | |||
| $--color-primary: #32A2D4; | |||
| @import '../eleadmin/index'; | |||
+ 5
- 0
src/styles/theme/green.scss
View File
| @@ -0,0 +1,5 @@ | |||
| /** 极光绿主题 */ | |||
| $--color-primary: #33CC99; | |||
| @import '../eleadmin/index'; | |||
+ 5
- 0
src/styles/theme/purple.scss
View File
| @@ -0,0 +1,5 @@ | |||
| /** 酱紫主题 */ | |||
| $--color-primary: #9266F9; | |||
| @import '../eleadmin/index'; | |||
+ 5
- 0
src/styles/theme/sunset.scss
View File
| @@ -0,0 +1,5 @@ | |||
| /** 日暮主题 */ | |||
| $--color-primary: #FAAD14; | |||
| @import '../eleadmin/index'; | |||
+ 5
- 0
src/styles/theme/volcano.scss
View File
| @@ -0,0 +1,5 @@ | |||
| /** 火山主题 */ | |||
| $--color-primary: #F5686F; | |||
| @import '../eleadmin/index'; | |||
+ 10617
- 0
src/utils/cityData.js
File diff suppressed because it is too large
View File
+ 104
- 0
src/utils/permission.js
View File
| @@ -0,0 +1,104 @@ | |||
| /** | |||
| * 角色权限控制组件 License By http://eleadmin.com | |||
| */ | |||
| import store from '@/store' | |||
| export default { | |||
| install(Vue) { | |||
| // 添加全局方法 | |||
| Vue.prototype.$hasRole = this.hasRole; | |||
| Vue.prototype.$hasAnyRole = this.hasAnyRole; | |||
| Vue.prototype.$hasPermission = this.hasPermission; | |||
| Vue.prototype.$hasAnyPermission = this.hasAnyPermission; | |||
| // 添加自定义指令 | |||
| Vue.directive('role', { | |||
| inserted: (el, binding) => { | |||
| if (!this.hasRole(binding)) el.parentNode.removeChild(el); | |||
| } | |||
| }); | |||
| Vue.directive('any-role', { | |||
| inserted: (el, binding) => { | |||
| if (!this.hasAnyRole(binding)) el.parentNode.removeChild(el); | |||
| } | |||
| }); | |||
| Vue.directive('permission', { | |||
| inserted: (el, binding) => { | |||
| if (!this.hasPermission(binding)) el.parentNode.removeChild(el); | |||
| } | |||
| }); | |||
| Vue.directive('any-permission', { | |||
| inserted: (el, binding) => { | |||
| if (!this.hasAnyPermission(binding)) el.parentNode.removeChild(el); | |||
| } | |||
| }); | |||
| }, | |||
| /** | |||
| * 是否有某些角色 | |||
| * @param role 字符或字符数组 | |||
| * @returns {boolean} | |||
| */ | |||
| hasRole(role) { | |||
| if (!role) return true; | |||
| let roles = store.state.user.roles; | |||
| if (!roles) return false; | |||
| if (Array.isArray(role)) { | |||
| for (let i = 0; i < role.length; i++) { | |||
| if (roles.indexOf(role[i]) === -1) return false; | |||
| } | |||
| return true; | |||
| } | |||
| return roles.indexOf(role) !== -1; | |||
| }, | |||
| /** | |||
| * 是否有任意角色 | |||
| * @param role 字符或字符数组 | |||
| * @returns {boolean} | |||
| */ | |||
| hasAnyRole(role) { | |||
| if (!role) return true; | |||
| let roles = store.state.user.roles; | |||
| if (!roles) return false; | |||
| if (Array.isArray(role)) { | |||
| for (let i = 0; i < role.length; i++) { | |||
| if (roles.indexOf(role[i]) !== -1) return true; | |||
| } | |||
| return false; | |||
| } | |||
| return roles.indexOf(role) !== -1; | |||
| }, | |||
| /** | |||
| * 是否有某些权限 | |||
| * @param auth 字符或字符数组 | |||
| * @returns {boolean} | |||
| */ | |||
| hasPermission(auth) { | |||
| if (!auth) return true; | |||
| let authorities = store.state.user.authorities; | |||
| if (!authorities) return false; | |||
| if (Array.isArray(auth)) { | |||
| for (let i = 0; i < auth.length; i++) { | |||
| if (authorities.indexOf(auth[i]) === -1) return false; | |||
| } | |||
| return true; | |||
| } | |||
| return authorities.indexOf(auth) !== -1; | |||
| }, | |||
| /** | |||
| * 是否有任意权限 | |||
| * @param auth 字符或字符数组 | |||
| * @returns {boolean} | |||
| */ | |||
| hasAnyPermission(auth) { | |||
| if (!auth) return true; | |||
| let authorities = store.state.user.authorities; | |||
| if (!authorities) return false; | |||
| if (Array.isArray(auth)) { | |||
| for (let i = 0; i < auth.length; i++) { | |||
| if (authorities.indexOf(auth[i]) !== -1) return true; | |||
| } | |||
| return false; | |||
| } | |||
| return authorities.indexOf(auth) !== -1; | |||
| } | |||
| } | |||
+ 587
- 0
src/utils/printer.js
View File
| @@ -0,0 +1,587 @@ | |||
| /** | |||
| * 打印插件 License By http://eleadmin.com | |||
| */ | |||
| export default { | |||
| /** | |||
| * 打印当前页面 | |||
| * @param hide 需要隐藏的元素 | |||
| * @param horizontal 是否横向打印 | |||
| * @param iePreview 是否支持ie打印预览 | |||
| * @param blank 是否在新窗口打印 | |||
| * @param close 如果在新窗口打印，打印完是否关闭新窗口 | |||
| * @param margin 页间距 | |||
| * @param title 页面标题 | |||
| * @returns {Window} 打印的窗口对象 | |||
| */ | |||
| print({hide, horizontal, iePreview = true, blank, close, margin, title}) { | |||
| if (close === undefined && blank && !this.isIE()) close = true; | |||
| window.focus(); // 让当前窗口获取焦点 | |||
| this.addCommonCss(); // 加入核心样式 | |||
| // 打印方向控制 | |||
| let setElem = document.getElementById(this.pSetId); | |||
| if (setElem) setElem.parentNode.removeChild(setElem); | |||
| let sizeHtml = '', marginHtml = ''; | |||
| if (horizontal !== undefined) sizeHtml = `size: ${horizontal ? 'landscape' : 'portrait'};`; // 打印方向 | |||
| if (margin === 0 || margin) marginHtml = `margin: ${margin};`; // 页间距 | |||
| if (sizeHtml || marginHtml) { | |||
| let elem = document.createElement('style'); | |||
| elem.id = this.pSetId; | |||
| elem.setAttribute('type', 'text/css'); | |||
| elem.setAttribute('media', 'print'); | |||
| elem.innerHTML = `@page {${sizeHtml}${marginHtml}}`; | |||
| document.body.appendChild(elem); | |||
| } | |||
| this.hideElem(hide); // 隐藏打印时需要隐藏的内容 | |||
| // 打印 | |||
| let oldTitle = document.title; | |||
| if (title) document.title = title; | |||
| let pWin; | |||
| if (blank) { // 新窗口打印 | |||
| // 创建打印窗口 | |||
| pWin = window.open('', '_blank'); | |||
| pWin.focus(); // 让打印窗口获取焦点 | |||
| // 写入内容到打印窗口 | |||
| const pDoc = pWin.document; | |||
| pDoc.open(); | |||
| const closeJs = close ? 'window.close();' : ''; | |||
| let html = '<!DOCTYPE html>' + document.getElementsByTagName('html')[0].outerHTML; | |||
| html = html.replace(/<script[^>]+>/g, ''); // 去除js | |||
| if (iePreview && this.isIE()) { | |||
| if (!document.getElementById('WebBrowser')) { | |||
| html = html.replace(/<\/html>/, `${this.ieWebBrowser}</html>`); | |||
| } | |||
| let pjs = `<script>window.onload=function(){window.WebBrowser.ExecWB?(window.WebBrowser.ExecWB(7,1)):window.print();${closeJs}}</script>`; | |||
| html = html.replace(/<\/html>/, `${pjs}</html>`); | |||
| } else { | |||
| let pjs = `<script>window.onload=function(){window.print();${closeJs}}</script>`; | |||
| html = html.replace(/<\/html>/, `${pjs}</html>`); | |||
| } | |||
| pDoc.write(html); | |||
| pDoc.close(); | |||
| } else { // 当前窗口打印 | |||
| pWin = window; | |||
| if (iePreview && this.isIE()) { | |||
| if (!document.getElementById('WebBrowser')) { | |||
| let elem = document.createElement('object'); | |||
| elem.id = 'WebBrowser'; | |||
| elem.setAttribute('classid', 'clsid:8856F961-340A-11D0-A96B-00C04FD705A2'); | |||
| elem.style.display = 'none'; | |||
| document.body.appendChild(elem); | |||
| } | |||
| try { | |||
| window.WebBrowser.ExecWB(7, 1); | |||
| } catch (e) { | |||
| console.error(e); | |||
| pWin.print(); | |||
| } | |||
| } else { | |||
| pWin.print(); | |||
| } | |||
| } | |||
| if (title) document.title = oldTitle; | |||
| this.showElem(hide); // 打印完恢复隐藏的内容 | |||
| return pWin; | |||
| }, | |||
| /** | |||
| * 打印任意内容 | |||
| * @param html 要打印的html内容 | |||
| * @param blank 是否在新窗口打印 | |||
| * @param close 如果在新窗口打印，打印完是否关闭新窗口 | |||
| * @param print 是否立即打印 | |||
| * @param horizontal 纸张是否是横向 | |||
| * @param iePreview 是否兼容ie打印预览 | |||
| * @param loading 是否显示加载层 | |||
| * @param before 打印开始的回调 | |||
| * @param done 打印完成的回调 | |||
| * @param margin 页间距 | |||
| * @param header 页眉 | |||
| * @param footer 页脚 | |||
| * @returns {Window} 打印的窗口对象 | |||
| */ | |||
| printHtml({html, blank, close, print = true, horizontal, iePreview = true, loading = true, before, done, margin, header, footer}) { | |||
| if (blank === undefined && this.isIE() && iePreview) blank = true; | |||
| if (close === undefined && blank && !this.isIE()) close = true; | |||
| if (loading && !blank) this.showLoading(); | |||
| // 创建打印窗口 | |||
| let pWin, pDoc; | |||
| if (blank) { // 新窗口打印 | |||
| pWin = window.open('', '_blank'); | |||
| pDoc = pWin.document; | |||
| } else { // 当前窗口打印 | |||
| let pFrame = this.getPFrame(); | |||
| pWin = pFrame.contentWindow; | |||
| pDoc = pFrame.contentDocument || pFrame.contentWindow.document; | |||
| } | |||
| pWin.focus(); // 让打印窗口获取焦点 | |||
| // 写入内容到打印窗口 | |||
| if (html) { | |||
| if (header || footer) html = this.addHeaderFooter(html, header, footer); // 添加页眉页脚 | |||
| html += `<style>${this.getCommonCss(true)}</style>`; // 加入公共css | |||
| html += this.getPrintHtml(horizontal, close, print, iePreview, before, done, margin); | |||
| pDoc.open(); | |||
| pDoc.write(`<!DOCTYPE html><html lang="zh">${html}</html>`); // 写入html | |||
| pDoc.close(); | |||
| } | |||
| return pWin; | |||
| }, | |||
| /** | |||
| * 分页打印 | |||
| * @param htmls 要打印的内容 | |||
| * @param horizontal 纸张是否是横向 | |||
| * @param style 打印的自定义样式 | |||
| * @param padding 每一页的边距 | |||
| * @param blank 是否在新窗口打印 | |||
| * @param close 如果在新窗口打印，打印完是否关闭新窗口 | |||
| * @param print 是否立即打印 | |||
| * @param width 每一页宽度 | |||
| * @param height 每一页高度 | |||
| * @param iePreview 是否兼容ie打印预览 | |||
| * @param isDebug 是否开启调试模式 | |||
| * @param loading 是否显示加载层 | |||
| * @param before 打印开始的回调 | |||
| * @param done 打印完成的回调 | |||
| * @param margin 页间距 | |||
| * @param header 页眉 | |||
| * @param footer 页脚 | |||
| * @param title 页面标题 | |||
| * @returns {Window} 打印的窗口对象 | |||
| */ | |||
| printPage({htmls, horizontal, style, padding, blank, close, print = true, width, height, iePreview = true, isDebug, loading = true, before, done, margin, header, footer, title}) { | |||
| if (blank === undefined && this.isIE() && iePreview) blank = true; | |||
| if (close === undefined && blank && !this.isIE()) close = true; | |||
| if (loading && !blank) this.showLoading(); | |||
| // 创建打印窗口 | |||
| let pWin, pDoc; | |||
| if (blank) { // 新窗口打印 | |||
| pWin = window.open('', '_blank'); | |||
| pDoc = pWin.document; | |||
| } else { // 当前窗口打印 | |||
| let pFrame = this.getPFrame(); | |||
| pWin = pFrame.contentWindow; | |||
| pDoc = pFrame.contentDocument || pFrame.contentWindow.document; | |||
| } | |||
| pWin.focus(); // 让打印窗口获取焦点 | |||
| // 拼接打印内容 | |||
| let html = `<!DOCTYPE html><html lang="zh"><head><meta charset="UTF-8"><title>${title || ''}</title>`; | |||
| html += this.getPageCss(padding, width, height) + (style || '') + '</head><body>'; // 控制分页的css | |||
| // 拼接分页内容 | |||
| let contentHtml = ''; | |||
| if (htmls) { | |||
| contentHtml += `<div class="ele-printer-page ${isDebug ? 'ele-printer-debug' : ''}">`; | |||
| contentHtml += htmls.map(h => `<div class="ele-printer-page-item">${h}</div>`).join(''); | |||
| contentHtml += '</div>'; | |||
| } | |||
| if (header || footer) html += this.addHeaderFooter(contentHtml, header, footer); // 添加页眉页脚 | |||
| else html += contentHtml; | |||
| html += this.getPrintHtml(horizontal, close, print, iePreview, before, done, margin); | |||
| html += '</body></html>'; | |||
| pDoc.open(); | |||
| pDoc.write(html); // 写入打印内容 | |||
| pDoc.close(); | |||
| return pWin; | |||
| }, | |||
| /* 生成控制打印的html */ | |||
| getPrintHtml(horizontal, close, print, iePreview, before, done, margin) { | |||
| let {beforeJs, doneJs} = this.addCallback(before, done); | |||
| let html = '', sizeHtml = '', marginHtml = ''; | |||
| if (horizontal !== undefined) sizeHtml = `size: ${horizontal ? 'landscape' : 'portrait'};`; // 打印方向 | |||
| if (margin === 0 || margin) marginHtml = `margin: ${margin};`; // 页间距 | |||
| html += `<style type="text/css" media="print" id="${this.pSetId}">@page{${sizeHtml}${marginHtml}</style>`; | |||
| // 兼容ie打印预览 | |||
| const closeJs = (close ? 'window.close();' : '') + doneJs; | |||
| const hideLoadJs = `${beforeJs};parent.hideElePrinterLoading&&parent.hideElePrinterLoading();`; | |||
| if (iePreview && this.isIE()) { | |||
| html += this.ieWebBrowser; | |||
| if (print) html += `<script>window.onload=function(){${hideLoadJs}window.WebBrowser.ExecWB?(window.WebBrowser.ExecWB(7,1)):window.print();${closeJs}}</script>`; | |||
| } else if (print) { | |||
| html += `<script>window.onload=function(){${hideLoadJs}window.print();${closeJs}}</script>`; | |||
| } | |||
| return html; | |||
| }, | |||
| /* 增加页眉页脚 */ | |||
| addHeaderFooter(html, header, footer) { | |||
| let result = '<table class="ele-printer-table-page">'; | |||
| if (header) result += `<thead><tr><td>${header}</td></tr></thead>`; | |||
| result += `<tbody><tr><td>${html}</td></tr></tbody>`; | |||
| if (footer) result += `<tfoot><tr><td>${footer}</td></tr></tfoot>`; | |||
| return result + '</table>'; | |||
| }, | |||
| /* 隐藏元素 */ | |||
| hideElem(elems) { | |||
| document.getElementsByClassName(this.hideClass).forEach(elem => { | |||
| elem.classList.add(this.printingClass); | |||
| }); | |||
| if (!elems) return; | |||
| if (!Array.isArray(elems)) elems = [elems]; | |||
| elems.forEach(elem => { | |||
| if (typeof elem === 'string') elem = document.querySelector(elem); | |||
| elem.classList.add(this.hideClass); | |||
| elem.classList.add(this.printingClass); | |||
| }); | |||
| }, | |||
| /* 取消隐藏 */ | |||
| showElem(elems) { | |||
| document.getElementsByClassName(this.hideClass).forEach(elem => { | |||
| elem.classList.remove(this.printingClass); | |||
| }); | |||
| if (!elems) return; | |||
| if (!Array.isArray(elems)) elems = [elems]; | |||
| elems.forEach(elem => { | |||
| if (typeof elem === 'string') elem = document.querySelector(elem); | |||
| elem.classList.remove(this.hideClass); | |||
| elem.classList.remove(this.printingClass); | |||
| }); | |||
| }, | |||
| /** | |||
| * 获取打印核心样式 | |||
| * @param isPrinting 是否已开始打印 | |||
| * @returns {String} | |||
| */ | |||
| getCommonCss(isPrinting) { | |||
| return ` | |||
| .${this.hideClass}.${this.printingClass} { | |||
| visibility: hidden !important; | |||
| } | |||
| .${this.hideClass} { | |||
| ${isPrinting ? 'visibility: hidden !important;' : ''} | |||
| } | |||
| .${this.hideClass}.${this.printingClass}.${this.hideNoneClass}, | |||
| .${this.hideClass}.${this.hideNoneClass}${isPrinting ? '' : '-no'} { | |||
| display: none !important; | |||
| } | |||
| /* 表格样式 */ | |||
| .ele-printer-table { | |||
| width: 100%; | |||
| border-collapse: collapse; | |||
| border: none; | |||
| } | |||
| .ele-printer-table td, .ele-printer-table th { | |||
| color: #333; | |||
| padding: 9px 15px; | |||
| border: 1px solid #333; | |||
| word-break: break-all; | |||
| } | |||
| /* loading样式 */ | |||
| #ele-printer-loading { | |||
| position: fixed; | |||
| top: 0; | |||
| left: 0; | |||
| right: 0; | |||
| bottom: 0; | |||
| background-color: hsla(0,0%,100%,.9); | |||
| z-index: 19000000 ; | |||
| } | |||
| #ele-printer-loading:after { | |||
| content: ""; | |||
| width: 40px; | |||
| height: 40px; | |||
| position: absolute; | |||
| top: 50%; | |||
| left: 50%; | |||
| margin: -20px auto auto -20px; | |||
| border: 2px solid #3296FA; | |||
| border-right-color: transparent; | |||
| border-bottom-color: transparent; | |||
| border-radius: 50%; | |||
| animation: ele-printer-loading-anim .8s linear infinite; | |||
| } | |||
| @keyframes ele-printer-loading-anim { | |||
| from { | |||
| transform: rotate(0deg); | |||
| } | |||
| to { | |||
| transform: rotate(360deg); | |||
| } | |||
| } | |||
| /* 带页眉页脚页面样式 */ | |||
| .ele-printer-table-page { | |||
| width: 100%; | |||
| } | |||
| `; | |||
| }, | |||
| /** | |||
| * 获取分页打印的样式 | |||
| * @param padding 每一页边距 | |||
| * @param width 每一页宽度 | |||
| * @param height 每一页高度 | |||
| * @returns {String} | |||
| */ | |||
| getPageCss(padding, width, height) { | |||
| return ` | |||
| <style> | |||
| body { margin: 0 !important; } | |||
| /* 自定义边距竖屏样式 */ | |||
| .ele-printer-page .ele-printer-page-item { | |||
| width: ${width || 'auto'}; | |||
| height: ${height || 'auto'}; | |||
| padding: ${padding || '0'}; | |||
| page-break-after: always !important; | |||
| box-sizing: border-box !important; | |||
| border: none !important; | |||
| position: relative; | |||
| } | |||
| /* 调试模式样式 */ | |||
| .ele-printer-page.ele-printer-debug .ele-printer-page-item { | |||
| border: 1px solid red !important; | |||
| } | |||
| /* 核心样式 */ | |||
| ${this.getCommonCss(true)} | |||
| </style> | |||
| `; | |||
| }, | |||
| /** | |||
| * 打印pdf | |||
| * @param url pdf链接地址 | |||
| * @param arraybuffer 直接指定arraybuffer数据 | |||
| * @param error 错误回调 | |||
| * @param loading 是否显示加载层 | |||
| * @param before 打印开始的回调 | |||
| * @param done 打印完成的回调 | |||
| * @returns {Window} 打印的窗口对象 | |||
| */ | |||
| printPdf({url, arraybuffer, error, loading = true, before, done}) { | |||
| if (loading) this.showLoading(); | |||
| let pWin; | |||
| let pFrame = this.getPFrame(); | |||
| pWin = pFrame.contentWindow; | |||
| pFrame.onload = () => { | |||
| if (!pFrame.getAttribute('src')) return; | |||
| pFrame.focus(); | |||
| before && before(); | |||
| pWin.print(); | |||
| this.hideLoading(); | |||
| done && done(); | |||
| }; | |||
| // 开始打印 | |||
| function doPrint(hideLoading) { | |||
| let localPdf = new window.Blob([arraybuffer], {type: 'application/pdf'}); | |||
| // 兼容IE | |||
| if (window.navigator && window.navigator.msSaveOrOpenBlob) { | |||
| window.navigator.msSaveOrOpenBlob(localPdf, 'print.pdf'); | |||
| hideLoading(); | |||
| } else { | |||
| localPdf = window.URL.createObjectURL(localPdf); | |||
| pFrame.setAttribute('src', localPdf); | |||
| } | |||
| } | |||
| // 请求pdf数据 | |||
| if (!arraybuffer) { | |||
| let req = new window.XMLHttpRequest(); | |||
| req.open('GET', url, true); | |||
| req.responseType = 'arraybuffer'; | |||
| req.onload = () => { | |||
| if ([200, 201].indexOf(req.status) === -1) return error && error(req.status, req.statusText); | |||
| arraybuffer = req.response; | |||
| doPrint(() => { | |||
| this.hideLoading(); | |||
| }); | |||
| }; | |||
| req.send(); | |||
| } else { | |||
| doPrint(() => { | |||
| this.hideLoading(); | |||
| }); | |||
| } | |||
| return pWin; | |||
| }, | |||
| /* 获取隐藏的打印iframe */ | |||
| getPFrame() { | |||
| let pFrame = document.getElementById(this.pFrameId); | |||
| if (pFrame) pFrame.parentNode.removeChild(pFrame); | |||
| let elem = document.createElement('iframe'); | |||
| elem.id = this.pFrameId; | |||
| elem.style.width = 0; | |||
| elem.style.height = 0; | |||
| elem.style.position = 'fixed'; | |||
| elem.style.visibility = 'hidden'; | |||
| document.body.appendChild(elem); | |||
| pFrame = document.getElementById(this.pFrameId); | |||
| pFrame.focus(); | |||
| return pFrame; | |||
| }, | |||
| /** | |||
| * 生成表格html | |||
| * @param data 数据 | |||
| * @param cols 列配置 | |||
| * @returns {string} | |||
| */ | |||
| makeTable(data, cols) { | |||
| // 恢复cols参数初始状态 | |||
| cols.forEach(col => { | |||
| col.forEach(c => { | |||
| c.INIT_OK = undefined; | |||
| c.key = undefined; | |||
| c.colGroup = undefined; | |||
| c.HAS_PARENT = undefined; | |||
| c.parentKey = undefined; | |||
| c.PARENT_COL_INDEX = undefined; | |||
| }); | |||
| }); | |||
| // cols转为嵌套结构 | |||
| let colArrays = [], colIndex = 0; | |||
| for (let i1 = 0; i1 < cols.length; i1++) { | |||
| let item1 = cols[i1]; | |||
| for (let i2 = 0; i2 < item1.length; i2++) { | |||
| let item2 = item1[i2]; | |||
| if (!item2) { | |||
| item1.splice(i2, 1); | |||
| continue; | |||
| } | |||
| // 合并单元格处理 | |||
| item2.key = i1 + '-' + i2; | |||
| let CHILD_COLS = undefined; | |||
| if (item2.colGroup || item2.colspan > 1) { | |||
| item2.colGroup = true; | |||
| CHILD_COLS = []; | |||
| colIndex++; | |||
| let childIndex = 0; | |||
| for (let i22 = 0; i22 < cols[i1 + 1].length; i22++) { | |||
| let item22 = Object.assign({}, cols[i1 + 1][i22]); | |||
| if (item22.HAS_PARENT || (childIndex > 1 && childIndex == item2.colspan)) { | |||
| cols[i1 + 1][i22] = item22; | |||
| continue; | |||
| } | |||
| item22.HAS_PARENT = true; | |||
| item22.parentKey = i1 + '-' + i2; | |||
| item22.key = (i1 + 1) + '-' + i22; | |||
| item22.PARENT_COL_INDEX = colIndex; | |||
| CHILD_COLS.push(item22); | |||
| childIndex = childIndex + parseInt(item22.colspan > 1 ? item22.colspan : 1); | |||
| cols[i1 + 1][i22] = item22; | |||
| } | |||
| } | |||
| item2.CHILD_COLS = CHILD_COLS; | |||
| if (!item2.PARENT_COL_INDEX) colArrays.push(item2); | |||
| cols[i1][i2] = item2; | |||
| } | |||
| } | |||
| // 遍历嵌套结构cols的方法 | |||
| function eachCols(callback, obj) { | |||
| if (!obj) obj = colArrays; | |||
| for (let i = 0; i < obj.length; i++) { | |||
| let item = obj[i]; | |||
| callback && callback(i, item); | |||
| if (item.CHILD_COLS) eachCols(callback, item.CHILD_COLS); | |||
| } | |||
| } | |||
| // 计算表格宽度 | |||
| let width = 1, needSetWidth = true, colgroup = []; | |||
| eachCols((i, c) => { | |||
| if (c.colGroup) return; | |||
| colgroup.push('<col'); | |||
| if (c.width) colgroup.push(` width="${c.width}"`); | |||
| colgroup.push('/>'); | |||
| if (c.width && !/\d+%$/.test(width)) width += (c.width + 1); | |||
| else needSetWidth = false; | |||
| }); | |||
| width += 'px'; | |||
| // 生成html | |||
| let html = `<table style="width:${needSetWidth ? width : '100%'};" class="ele-printer-table">`; | |||
| html += `<colgroup>${colgroup.join('')}</colgroup>`; | |||
| // 表头 | |||
| let trs = cols.map(col => { | |||
| let ths = col.map(c => `<th colspan="${c.colspan || 1}" rowspan="${c.rowspan || 1}" | |||
| align="${c.thAlign || c.align || 'left'}" style="${c.thStyle}">${c.title || ''}</th>`); | |||
| return `<tr>${ths.join('')}</tr>`; | |||
| }); | |||
| html += `<thead>${trs.join('')}</thead>`; | |||
| // 主体 | |||
| html += '<tbody>'; | |||
| data.forEach((d, index) => { | |||
| html += '<tr>'; | |||
| let colIndex = 0; | |||
| eachCols((i, c) => { | |||
| if (c.colGroup) return; | |||
| let content = c.templet ? c.templet(d, index, colIndex) : d[c.field]; | |||
| html += `<td align="${c.align || 'left'}" style="${c.style}">${content}</td>`; | |||
| colIndex++; | |||
| }); | |||
| html += '</tr>'; | |||
| }); | |||
| return html + '</tbody></table>'; | |||
| }, | |||
| /* 加入核心样式 */ | |||
| addCommonCss() { | |||
| if (!document.getElementById(this.pStyleId)) { | |||
| let elem = document.createElement('style'); | |||
| elem.id = this.pStyleId; | |||
| elem.setAttribute('type', 'text/css'); | |||
| elem.innerHTML = this.getCommonCss(); | |||
| document.body.appendChild(elem); | |||
| } | |||
| }, | |||
| /* 检查并补全隐藏元素的class */ | |||
| checkHideClass() { | |||
| document.getElementsByClassName(this.hideNoneClass).forEach(elem => { | |||
| elem.classList.add(this.hideClass); | |||
| }); | |||
| }, | |||
| /* 显示加载层 */ | |||
| showLoading() { | |||
| this.addCommonCss(); | |||
| let elem = document.getElementById('ele-printer-loading'); | |||
| if (!elem) { | |||
| elem = document.createElement('div'); | |||
| elem.id = 'ele-printer-loading'; | |||
| document.body.appendChild(elem); | |||
| } | |||
| elem.style.display = 'block'; | |||
| window.hideElePrinterLoading = () => { | |||
| this.hideLoading(); | |||
| }; | |||
| return elem; | |||
| }, | |||
| /* 关闭加载层 */ | |||
| hideLoading() { | |||
| setTimeout(() => { | |||
| let elem = document.getElementById('ele-printer-loading'); | |||
| if (elem) elem.style.display = 'none'; | |||
| }, 1500); | |||
| }, | |||
| /* 添加回调监听 */ | |||
| addCallback(before, done) { | |||
| let taskId = 'p' + this.uuid(); | |||
| if (!window.elePrinterBefore) window.elePrinterBefore = {}; | |||
| if (!window.elePrinterDone) window.elePrinterDone = {}; | |||
| if (before) window.elePrinterBefore[taskId] = before; | |||
| if (done) window.elePrinterDone[taskId] = done; | |||
| let beforeJs = `;parent.elePrinterBefore&&parent.elePrinterBefore.${taskId}&&parent.elePrinterBefore.${taskId}();`; | |||
| let doneJs = `;parent.elePrinterDone&&parent.elePrinterDone.${taskId}&&parent.elePrinterDone.${taskId}();`; | |||
| return {taskId, beforeJs, doneJs}; | |||
| }, | |||
| /* 生成随机id */ | |||
| uuid(length = 8) { | |||
| const num = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890'; | |||
| let str = 'p_'; | |||
| for (let i = 0; i < length; i++) str += num.charAt(Math.floor(Math.random() * num.length)); | |||
| return str; | |||
| }, | |||
| /* 是否是ie */ | |||
| isIE() { | |||
| return !!window.ActiveXObject || 'ActiveXObject' in window; | |||
| }, | |||
| /* 是否是Edge */ | |||
| isEdge() { | |||
| return navigator.userAgent.indexOf('Edge') !== -1; | |||
| }, | |||
| /* 是否是Firefox */ | |||
| isFirefox() { | |||
| return navigator.userAgent.indexOf('Firefox') !== -1; | |||
| }, | |||
| // 支持ie打印预览控件 | |||
| ieWebBrowser: '<object id="WebBrowser" classid="clsid:8856F961-340A-11D0-A96B-00C04FD705A2" width="0" height="0"></object>', | |||
| pFrameId: 'ele-printer-frame', // 当前窗口打印隐藏的iframe的id | |||
| pStyleId: 'ele-printer-style', // 打印核心样式的style的id | |||
| pSetId: 'ele-printer-set', // 打印方向设置的style的id | |||
| printingClass: 'ele-printer-printing', // 正在打印标识的class | |||
| hideClass: 'ele-printer-hide', // 打印时隐藏的class | |||
| hideNoneClass: 'ele-printer-hide-none' // 打印时隐藏不占位置的class | |||
| } | |||
+ 386
- 0
src/utils/util.js
View File
| @@ -0,0 +1,386 @@ | |||
| /** | |||
| * 常用工具方法 License By http://eleadmin.com | |||
| */ | |||
| export default { | |||
| /** | |||
| * 倒计时 | |||
| * @param endTime 结束时间 | |||
| * @param serverTime 服务端当前时间 | |||
| * @param callback 回调 | |||
| * @returns {number} 定时器实例 | |||
| */ | |||
| countdown(endTime, serverTime, callback) { | |||
| let type = typeof serverTime === 'function', end = new Date(endTime).getTime(), | |||
| now = new Date((!serverTime || type) ? new Date().getTime() : serverTime).getTime(), | |||
| count = end - now, time = [ | |||
| Math.floor(count / (1000 * 60 * 60 * 24)), // 天 | |||
| Math.floor(count / (1000 * 60 * 60)) % 24, // 时 | |||
| Math.floor(count / (1000 * 60)) % 60, // 分 | |||
| Math.floor(count / 1000) % 60 // 秒 | |||
| ]; | |||
| if (type) callback = serverTime; | |||
| let timer = setTimeout(() => { | |||
| this.countdown(endTime, now + 1000, callback); | |||
| }, 1000); | |||
| callback && callback(count > 0 ? time : [0, 0, 0, 0], serverTime, timer); | |||
| if (count <= 0) clearTimeout(timer); | |||
| return timer; | |||
| }, | |||
| /** | |||
| * 某个时间在当前时间的多久前 | |||
| * @param time 需要语义化的时间 | |||
| * @param onlyDate 超过30天是否仅返回日期 | |||
| * @returns {string} 语义化后的时间 | |||
| */ | |||
| timeAgo(time, onlyDate) { | |||
| if (!time) return ''; | |||
| if (typeof time === 'string') time = time.replace(/-/g, '/'); | |||
| let arr = [[], []], stamp = new Date().getTime() - new Date(time).getTime(); | |||
| // 30天以上返回具体日期 | |||
| if (stamp > 1000 * 60 * 60 * 24 * 31) { | |||
| stamp = new Date(time); | |||
| arr[0][0] = this.digit(stamp.getFullYear(), 4); | |||
| arr[0][1] = this.digit(stamp.getMonth() + 1); | |||
| arr[0][2] = this.digit(stamp.getDate()); | |||
| if (!onlyDate) { // 是否输出时间 | |||
| arr[1][0] = this.digit(stamp.getHours()); | |||
| arr[1][1] = this.digit(stamp.getMinutes()); | |||
| arr[1][2] = this.digit(stamp.getSeconds()); | |||
| } | |||
| return arr[0].join('-') + ' ' + arr[1].join(':'); | |||
| } | |||
| // 30天以内，返回“多久前” | |||
| if (stamp >= 1000 * 60 * 60 * 24) { | |||
| return ((stamp / 1000 / 60 / 60 / 24) | 0) + '天前'; | |||
| } else if (stamp >= 1000 * 60 * 60) { | |||
| return ((stamp / 1000 / 60 / 60) | 0) + '小时前'; | |||
| } else if (stamp >= 1000 * 60 * 3) { // 3分钟以内为：刚刚 | |||
| return ((stamp / 1000 / 60) | 0) + '分钟前'; | |||
| } else if (stamp < 0) { | |||
| return '未来'; | |||
| } else { | |||
| return '刚刚'; | |||
| } | |||
| }, | |||
| /** | |||
| * 数字前置补零 | |||
| * @param num 数字 | |||
| * @param length 位数 | |||
| * @returns {string} | |||
| */ | |||
| digit(num, length) { | |||
| let str = ''; | |||
| num = String(num); | |||
| length = length || 2; | |||
| for (let i = num.length; i < length; i++) str += '0'; | |||
| return num < Math.pow(10, length) ? str + (num | 0) : num; | |||
| }, | |||
| /** | |||
| * 转化为日期格式字符 | |||
| * @param time 时间 | |||
| * @param format 格式 | |||
| * @returns {string} | |||
| */ | |||
| toDateString(time, format) { | |||
| if (!time) return ''; | |||
| if (typeof time === 'string') time = time.replace(/-/g, '/'); | |||
| let date = new Date(time || new Date()), | |||
| ymd = [ | |||
| this.digit(date.getFullYear(), 4), | |||
| this.digit(date.getMonth() + 1), | |||
| this.digit(date.getDate()) | |||
| ], | |||
| hms = [ | |||
| this.digit(date.getHours()), | |||
| this.digit(date.getMinutes()), | |||
| this.digit(date.getSeconds()) | |||
| ]; | |||
| format = format || 'yyyy-MM-dd HH:mm:ss'; | |||
| return format.replace(/yyyy/g, ymd[0]) | |||
| .replace(/MM/g, ymd[1]) | |||
| .replace(/dd/g, ymd[2]) | |||
| .replace(/HH/g, hms[0]) | |||
| .replace(/mm/g, hms[1]) | |||
| .replace(/ss/g, hms[2]); | |||
| }, | |||
| /** | |||
| * html转义, 防止xss攻击 | |||
| * @param html 需要转义的字符串 | |||
| * @returns {string} | |||
| */ | |||
| escape(html) { | |||
| return String(html || '').replace(/&(?!#?[a-zA-Z0-9]+;)/g, '&') | |||
| .replace(/</g, '<').replace(/>/g, '>') | |||
| .replace(/'/g, ''').replace(/"/g, '"'); | |||
| }, | |||
| /** | |||
| * pid形式数据转children形式 | |||
| * @param data 需要转换的数组 | |||
| * @param idKey id字段名 | |||
| * @param pidKey pid字段名 | |||
| * @param childKey 生成的children字段名 | |||
| * @param pid 顶级的pid | |||
| * @returns {[]} | |||
| */ | |||
| toTreeData(data, idKey, pidKey, childKey, pid) { | |||
| if (!childKey) childKey = 'children'; | |||
| if (pid === undefined) { | |||
| pid = []; | |||
| data.forEach(d => { | |||
| let flag = true; | |||
| for (let i = 0; i < data.length; i++) { | |||
| if (d[pidKey] == data[i][idKey]) { | |||
| flag = false; | |||
| break; | |||
| } | |||
| } | |||
| if (flag) pid.push(d[pidKey]); | |||
| }); | |||
| } | |||
| let result = []; | |||
| data.forEach(d => { | |||
| if (d[idKey] == d[pidKey]) return console.error('data error: ', d); | |||
| if (Array.isArray(pid) ? (pid.indexOf(d[pidKey]) !== -1) : (d[pidKey] == pid)) { | |||
| let children = this.toTreeData(data, idKey, pidKey, childKey, d[idKey]); | |||
| if (children.length > 0) d[childKey] = children; | |||
| result.push(d); | |||
| } | |||
| }); | |||
| return result; | |||
| }, | |||
| /** | |||
| * 遍历children形式数据 | |||
| * @param data 需要遍历的数组 | |||
| * @param callback 回调 | |||
| * @param childKey children字段名 | |||
| */ | |||
| eachTreeData(data, callback, childKey) { | |||
| if (!childKey) childKey = 'children'; | |||
| data.forEach(d => { | |||
| if (callback(d) !== false && d[childKey]) this.eachTreeData(d[childKey], callback, childKey); | |||
| }); | |||
| }, | |||
| /** | |||
| * 让浏览器全屏切换 | |||
| * @returns {Element|*|boolean} 是否是全屏状态 | |||
| */ | |||
| fullScreen() { | |||
| let isFull = document.fullscreenElement || document.msFullscreenElement || document.mozFullScreenElement | |||
| || document.webkitFullscreenElement || false; | |||
| if (isFull) { | |||
| let efs = document.exitFullscreen || document.webkitExitFullscreen || document.mozCancelFullScreen | |||
| || document.msExitFullscreen; | |||
| if (efs) { | |||
| efs.call(document); | |||
| } else if (window.ActiveXObject) { | |||
| let ws = new window.ActiveXObject('WScript.Shell'); | |||
| ws && ws.SendKeys('{F11}'); | |||
| } | |||
| } else { | |||
| let el = document.documentElement; | |||
| let rfs = el.requestFullscreen || el.webkitRequestFullscreen || el.mozRequestFullScreen | |||
| || el.msRequestFullscreen; | |||
| if (rfs) { | |||
| rfs.call(el); | |||
| } else if (window.ActiveXObject) { | |||
| let wss = new window.ActiveXObject('WScript.Shell'); | |||
| wss && wss.SendKeys('{F11}'); | |||
| } | |||
| } | |||
| return isFull; | |||
| }, | |||
| /** | |||
| * 获取屏幕宽度 | |||
| * @returns {number} | |||
| */ | |||
| screenWidth() { | |||
| return document.documentElement.clientWidth || document.body.clientWidth; | |||
| }, | |||
| /** | |||
| * 获取屏幕高度 | |||
| * @returns {number} | |||
| */ | |||
| screenHeight() { | |||
| return document.documentElement.clientHeight || document.body.clientHeight; | |||
| }, | |||
| /** | |||
| * html转text, 获取html的纯文本 | |||
| * @param html | |||
| * @returns {*} | |||
| */ | |||
| htmlToText(html) { | |||
| /*let elem = document.createElement('div'); | |||
| elem.innerHTML = html; | |||
| return elem.innerText;*/ | |||
| return html.replace(/<[^>]+>/g, ''); | |||
| }, | |||
| /** | |||
| * 获取设备信息 | |||
| * @param key 自定义的agent | |||
| * @returns {{weixin: *, os: (string|undefined), ie: boolean}} | |||
| */ | |||
| device(key) { | |||
| let agent = navigator.userAgent.toLowerCase(), | |||
| // 获取版本号 | |||
| getVersion = function (label) { | |||
| const exp = new RegExp(label + '/([^\\s\\_\\-]+)'); | |||
| label = (agent.match(exp) || [])[1]; | |||
| return label || false; | |||
| }, | |||
| // 返回结果集 | |||
| result = { | |||
| os: function () { // 底层操作系统 | |||
| if (/windows/.test(agent)) { | |||
| return 'windows'; | |||
| } else if (/linux/.test(agent)) { | |||
| return 'linux'; | |||
| } else if (/iphone|ipod|ipad|ios/.test(agent)) { | |||
| return 'ios'; | |||
| } else if (/mac/.test(agent)) { | |||
| return 'mac'; | |||
| } else if (/android/.test(agent)) { | |||
| return 'android'; | |||
| } | |||
| }(), | |||
| ie: function () { // ie版本 | |||
| return (!!window.ActiveXObject || 'ActiveXObject' in window) ? ( | |||
| (agent.match(/msie\s(\d+)/) || [])[1] || '11' // 由于ie11并没有msie的标识 | |||
| ) : false; | |||
| }(), | |||
| weixin: getVersion('micromessenger') // 是否微信 | |||
| }; | |||
| // 任意的key | |||
| if (key && !result[key]) { | |||
| result[key] = getVersion(key); | |||
| } | |||
| // 移动设备 | |||
| result.android = /android/.test(agent); | |||
| result.ios = result.os === 'ios'; | |||
| result.mobile = (result.android || result.ios) ? true : false; | |||
| return result; | |||
| }, | |||
| /** | |||
| * 生成随机id | |||
| * @param length 长度 | |||
| * @returns {string} | |||
| */ | |||
| uuid(length = 32) { | |||
| const num = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890'; | |||
| let str = ''; | |||
| for (let i = 0; i < length; i++) { | |||
| str += num.charAt(Math.floor(Math.random() * num.length)); | |||
| } | |||
| return str; | |||
| }, | |||
| /** | |||
| * 生成m到n的随机数，不包含n | |||
| * @param m 最小值 | |||
| * @param n 最大值 | |||
| * @returns {number} | |||
| */ | |||
| random(m, n) { | |||
| return Math.floor(Math.random() * (m - n) + n); | |||
| }, | |||
| /** | |||
| * 百度地图坐标转高德地图坐标 | |||
| * @param point 坐标 | |||
| * @returns {{lng: number, lat: number}} | |||
| */ | |||
| bd09ToGcj02: function (point) { | |||
| const x_pi = (3.14159265358979324 * 3000.0) / 180.0; | |||
| const x = point.lng - 0.0065, y = point.lat - 0.006; | |||
| const z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * x_pi); | |||
| const theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * x_pi); | |||
| return {lng: z * Math.cos(theta), lat: z * Math.sin(theta)}; | |||
| }, | |||
| /** | |||
| * 高德地图坐标转百度地图坐标 | |||
| * @param point 坐标 | |||
| * @returns {{lng: number, lat: number}} | |||
| */ | |||
| gcj02ToBd09: function (point) { | |||
| const x_pi = (3.14159265358979324 * 3000.0) / 180.0; | |||
| const x = point.lng, y = point.lat; | |||
| const z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * x_pi); | |||
| const theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * x_pi); | |||
| return {lng: z * Math.cos(theta) + 0.0065, lat: z * Math.sin(theta) + 0.006}; | |||
| }, | |||
| /** | |||
| * 深度克隆对象 | |||
| * @param obj | |||
| * @returns {{}|*} | |||
| */ | |||
| deepClone: function (obj) { | |||
| let result; | |||
| const type = this.typeOf(obj); | |||
| if (type === 'Object') result = {}; | |||
| else if (type === 'Array') result = []; | |||
| else return obj; | |||
| Object.keys(obj).forEach(key => { | |||
| const copy = obj[key], cType = this.typeOf(copy); | |||
| if (cType === 'Object' || cType === 'Array') result[key] = this.deepClone(copy); | |||
| else result[key] = obj[key]; | |||
| }); | |||
| return result; | |||
| }, | |||
| /** | |||
| * 获取变量类型 | |||
| * @param obj | |||
| * @returns {string} | |||
| */ | |||
| typeOf(obj) { | |||
| if (obj === null) return 'Null'; | |||
| if (obj === undefined) return 'Undefined'; | |||
| return Object.prototype.toString.call(obj).slice(8, -1); | |||
| }, | |||
| /** | |||
| * 播放音频 | |||
| * @param url 音频地址 | |||
| */ | |||
| play(url) { | |||
| return new Audio(url).play(); | |||
| }, | |||
| /** | |||
| * 判断富文本是否为空 | |||
| * @param html | |||
| */ | |||
| htmlIsBlank(html) { | |||
| if (!html) return true; | |||
| const media = ['img', 'audio', 'video', 'iframe', 'object']; | |||
| for (let i = 0; i < media.length; i++) { | |||
| if (html.indexOf('<' + media[i]) > -1) return false; | |||
| } | |||
| let str = html.replace(/\s*/g, ''); // 去掉所有空格 | |||
| if (!str) return true; | |||
| str = str.replace(/ /ig, ''); // 去掉所有 | |||
| if (!str) return true; | |||
| str = str.replace(/<[^>]+>/g, ''); // 去掉所有html标签 | |||
| return !str; | |||
| }, | |||
| /** | |||
| * 导出excel | |||
| * @param XLSX XLSX对象 | |||
| * @param sheet 数组或sheet对象 | |||
| * @param sheetname 文件名称 | |||
| * @param type 文件格式 | |||
| */ | |||
| exportSheet(XLSX, sheet, sheetname, type) { | |||
| if (!sheetname) sheetname = 'sheet1'; | |||
| if (!type) type = 'xlsx'; | |||
| if (Array.isArray(sheet)) sheet = XLSX.utils.aoa_to_sheet(sheet); | |||
| let workbook = {SheetNames: [sheetname], Sheets: {}}; | |||
| workbook.Sheets[sheetname] = sheet; | |||
| XLSX.writeFile(workbook, sheetname + '.' + type); | |||
| }, | |||
| /** | |||
| * 常用颜色 | |||
| */ | |||
| beautifulColors: [ | |||
| 'rgb(24,144,255)', 'rgb(102,181,255)', 'rgb(65, 217, 199)', 'rgb(47, 194, 91)', | |||
| 'rgb(110, 219, 143)', 'rgb(154, 230, 92)', 'rgb(250, 204, 20)', 'rgb(230, 150, 92)', | |||
| 'rgb(87, 173, 113)', 'rgb(34, 50, 115)', 'rgb(115, 138, 230)', 'rgb(117, 100, 204)', | |||
| 'rgb(133, 67, 224)', 'rgb(168, 119, 237)', 'rgb(92, 142, 230)', 'rgb(19, 194, 194)', | |||
| 'rgb(112, 224, 224)', 'rgb(92, 163, 230)', 'rgb(52, 54, 199)', 'rgb(128, 130, 255)', | |||
| 'rgb(221, 129, 230)', 'rgb(240, 72, 100)', 'rgb(250, 125, 146)', 'rgb(213, 152, 217)' | |||
| ] | |||
| } | |||
+ 128
- 0
src/utils/validate.js
View File
| @@ -0,0 +1,128 @@ | |||
| /** | |||
| * 格式校验工具方法 License By http://eleadmin.com | |||
| */ | |||
| export default { | |||
| /* 是否是手机号 */ | |||
| isPhone(value) { | |||
| const reg = /^1\d{10}$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否为固话 */ | |||
| isTel(value) { | |||
| const reg = /^(400|800)([0-9\\-]{7,10})|(([0-9]{4}|[0-9]{3})(-| )?)?([0-9]{7,8})((-| |转)*([0-9]{1,4}))?$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是邮箱 */ | |||
| isEmail(value) { | |||
| const reg = /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是网址 */ | |||
| isUrl(value) { | |||
| const reg = /(^#)|(^http(s*):\/\/[^\s]+\.[^\s]+)/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是数字 */ | |||
| isNumber(value) { | |||
| /*const reg = /^1\d{10}$/; | |||
| return reg.test(value);*/ | |||
| return !isNaN(value); | |||
| }, | |||
| /* 是否是日期 */ | |||
| isDate(value) { | |||
| const reg = /^(\d{4})[-/](\d{1}|0\d{1}|1[0-2])([-/](\d{1}|0\d{1}|[1-2][0-9]|3[0-1]))*$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是身份证 */ | |||
| isIdentity(value) { | |||
| const reg = /(^\d{15}$)|(^\d{17}(x|X|\d)$)/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是整数 */ | |||
| isDigits(value) { | |||
| const reg = /^-?\d+$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是正整数 */ | |||
| isDigitsP(value) { | |||
| const reg = /^[1-9]\d*$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是负整数 */ | |||
| isDigitsN(value) { | |||
| const reg = /^-[1-9]\d*$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是非负整数(正整数或0) */ | |||
| isDigitsPZ(value) { | |||
| const reg = /^\d+$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是非正整数(负整数或0) */ | |||
| isDigitsNZ(value) { | |||
| const reg = /^-[1-9]\d*|0/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 验证最小长度、最大长度 */ | |||
| maxMinLength(value, minLength, maxLength) { | |||
| if (value === undefined || value === null) return !minLength; | |||
| if (minLength && value.toString().length < minLength) return false; | |||
| return !(maxLength !== undefined && maxLength !== null && value.toString().length > maxLength); | |||
| }, | |||
| /* 验证最小值、最大值 */ | |||
| maxMin(value, min, max) { | |||
| if (value === undefined || value === null) return min === undefined || min === null; | |||
| if (min !== undefined && min !== null && value < min) return false; | |||
| return !(max !== undefined && max !== null && value > max); | |||
| }, | |||
| /* 是否是中文 */ | |||
| isChina(value) { | |||
| const reg = /^[\u4E00-\u9FA5]{2,4}$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是端口号 */ | |||
| isPort(value) { | |||
| const reg = /^([0-9]|[1-9]\d|[1-9]\d{2}|[1-9]\d{3}|[1-5]\d{4}|6[0-4]\d{3}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是IP */ | |||
| isIP(value) { | |||
| const reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是经度 -180.0～+180.0（整数部分为0～180，必须输入1到5位小数） */ | |||
| isLongitude(value) { | |||
| const reg = /^[-|+]?(0?\d{1,2}\.\d{1,5}|1[0-7]?\d{1}\.\d{1,5}|180\.0{1,5})$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是纬度 -90.0～+90.0（整数部分为0～90，必须输入1到5位小数） */ | |||
| isLatitude(value) { | |||
| const reg = /^[-|+]?([0-8]?\d{1}\.\d{1,5}|90\.0{1,5})$/; | |||
| return reg.test(value); | |||
| }, | |||
| /* 是否是身份证(强校验) */ | |||
| isIdentityStrong(value) { | |||
| if (!this.isIdentity(value)) return '身份证号码格式错误'; | |||
| const ai = value.length === 18 ? value.substring(0, 17) : (value.substring(0, 6) + '19' + value.substring(6, 15)); | |||
| // 验证出生年月 | |||
| const year = ai.substring(6, 10); // 年 | |||
| const birthday = year + '/' + ai.substring(10, 12) + '/' + ai.substring(12, 14); | |||
| if (!this.isDate(birthday)) return '身份证号码出生日期无效'; | |||
| const now = new Date(); | |||
| if ((now.getFullYear() - parseInt(year)) > 150 || (now.getTime() - new Date(birthday).getTime()) < 0) | |||
| return '身份证号码出生日期不在有效范围'; | |||
| // 验证地区码 | |||
| const areaCodes = ['11', '12', '13', '14', '15', '21', '22', '23', | |||
| '31', '32', '33', '34', '35', '36', '37', '41', '42', '43', '44', '45', '46', | |||
| '50', '51', '52', '53', '54', '61', '62', '63', '64', '65', '71', '81', '82', '91']; | |||
| if (areaCodes.indexOf(ai.substring(0, 2)) === -1) return '身份证号码地区编码错误'; | |||
| // 验证最后一位 | |||
| if (value.length === 18) { | |||
| const valCode = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2']; | |||
| const wi = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2]; | |||
| let totalMulAiWi = 0; | |||
| for (let i = 0; i < 17; i++) totalMulAiWi += parseInt(ai.charAt(i)) * wi[i]; | |||
| if (value !== (ai + valCode[totalMulAiWi % 11])) return '身份证号码最后一位错误'; | |||
| } | |||
| } | |||
| } | |||
+ 635
- 0
src/views/common/exception/403.vue
View File
| @@ -0,0 +1,635 @@ | |||
| <template> | |||
| <div :class="['ele-exception ele-text-center',{'ele-exception-dark':$store.state.theme.theme==='dark'}]"> | |||
| <div class="ele-exception-img"> | |||
| <svg width="227" height="269" viewBox="0 0 227 269" xmlns="http://www.w3.org/2000/svg" | |||
| xmlns:xlink="http://www.w3.org/1999/xlink"> | |||
| <defs> | |||
| <path | |||
| d="M0 131.5c0-29.712 2.002-61.194 6.007-94.445 2.225-18.473 17.225-32.78 35.782-34.13C68.622.976 91.041 0 109.044 0c18.09 0 40.799.985 68.129 2.954 18.572 1.338 33.589 15.656 35.809 34.144C216.994 70.51 219 102.083 219 131.813c0 29.66-1.997 61.03-5.99 94.114-2.23 18.474-17.237 32.778-35.797 34.12-27.238 1.969-49.735 2.953-67.491 2.953-17.794 0-40.43-.989-67.91-2.966-18.569-1.336-33.585-15.649-35.81-34.133C2 192.666 0 161.2 0 131.5z" | |||
| id="b"/> | |||
| <filter x="-4.5%" y="-1.4%" width="106.2%" height="104.4%" filterUnits="objectBoundingBox" id="a"> | |||
| <feMorphology radius=".81" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"/> | |||
| <feOffset dx="-6" dy="4" in="shadowSpreadOuter1" result="shadowOffsetOuter1"/> | |||
| <feComposite in="shadowOffsetOuter1" in2="SourceAlpha" operator="out" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| <path | |||
| d="M39.654 130.992c0-20.899.881-41.798 2.643-62.697.97-11.504 9.9-20.738 21.366-22.091a388.15 388.15 0 0 1 45.531-2.687c15.167 0 30.333.895 45.5 2.684 11.47 1.353 20.403 10.593 21.368 22.103a755.378 755.378 0 0 1 2.657 63.124c0 20.88-.88 41.76-2.64 62.638-.97 11.505-9.903 20.74-21.369 22.091a389.034 389.034 0 0 1-45.598 2.693c-15.145 0-30.291-.894-45.437-2.682-11.468-1.355-20.4-10.593-21.365-22.101a754.09 754.09 0 0 1-2.656-63.075z" | |||
| id="d"/> | |||
| <filter x="-6%" y="-2.3%" width="108.6%" height="105.9%" filterUnits="objectBoundingBox" id="c"> | |||
| <feMorphology radius=".81" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"/> | |||
| <feOffset dx="-5" dy="3" in="shadowSpreadOuter1" result="shadowOffsetOuter1"/> | |||
| <feComposite in="shadowOffsetOuter1" in2="SourceAlpha" operator="out" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| <path | |||
| d="M161.51 89.858h15.333v17.534H161.51a6.568 6.568 0 0 1-6.567-6.568v-4.398a6.568 6.568 0 0 1 6.567-6.568z" | |||
| id="f"/> | |||
| <filter x="-13.7%" y="-5.7%" width="118.3%" height="117.1%" filterUnits="objectBoundingBox" id="e"> | |||
| <feOffset dx="-2" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feComposite in="shadowOffsetOuter1" in2="SourceAlpha" operator="out" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| <path | |||
| d="M183.958 89.858h15.332v17.534h-15.332a6.568 6.568 0 0 1-6.568-6.568v-4.398a6.568 6.568 0 0 1 6.568-6.568z" | |||
| id="h"/> | |||
| <filter x="-2.3%" y="-2.9%" width="109.1%" height="111.4%" filterUnits="objectBoundingBox" id="g"> | |||
| <feOffset dx="1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feComposite in="shadowOffsetOuter1" in2="SourceAlpha" operator="out" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| <filter x="-55.5%" y="-9.3%" width="177.5%" height="148%" filterUnits="objectBoundingBox" id="i"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-55.5%" y="-9.3%" width="177.5%" height="148%" filterUnits="objectBoundingBox" id="j"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <path | |||
| d="M8.865 17.248a1.754 1.754 0 0 1-.77-1.454 1.75 1.75 0 0 1 1.748-1.754 1.75 1.75 0 0 1 1.747 1.754c0 .605-.305 1.139-.77 1.454l.976 2.737a.615.615 0 0 1-.579.82H8.468a.615.615 0 0 1-.579-.82l.976-2.737z" | |||
| id="k"/> | |||
| <filter x="-12%" y="-7.4%" width="124.1%" height="114.8%" filterUnits="objectBoundingBox" id="l"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetInner1"/> | |||
| <feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" | |||
| result="shadowInnerInner1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 1 0" | |||
| in="shadowInnerInner1"/> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="m"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="n"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="o"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="p"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="q"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="r"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="s"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="t"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="u"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="v"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-44.4%" y="-20%" width="166.7%" height="160%" filterUnits="objectBoundingBox" id="w"> | |||
| <feOffset dx="-2" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-44.4%" y="-20%" width="166.7%" height="160%" filterUnits="objectBoundingBox" id="x"> | |||
| <feOffset dx="-2" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-44.4%" y="-20%" width="166.7%" height="160%" filterUnits="objectBoundingBox" id="y"> | |||
| <feOffset dx="-2" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-44.4%" y="-20%" width="166.7%" height="160%" filterUnits="objectBoundingBox" id="z"> | |||
| <feOffset dx="-2" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-44.4%" y="-20%" width="166.7%" height="160%" filterUnits="objectBoundingBox" id="A"> | |||
| <feOffset dx="-2" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-44.4%" y="-20%" width="166.7%" height="160%" filterUnits="objectBoundingBox" id="B"> | |||
| <feOffset dx="-2" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-44.4%" y="-20%" width="166.7%" height="160%" filterUnits="objectBoundingBox" id="C"> | |||
| <feOffset dx="-2" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <path id="E" d="M79.083 68.794h60.833v24.352H79.083z"/> | |||
| <filter x="-2.5%" y="-2.1%" width="103.3%" height="108.2%" filterUnits="objectBoundingBox" id="D"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feComposite in="shadowOffsetOuter1" in2="SourceAlpha" operator="out" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| <path id="F" d="M119.233 71.235h18.25v19.507h-18.25z"/> | |||
| <path d="M6.692.215h8.762v30.683H6.692A6.568 6.568 0 0 1 .124 24.33V6.782A6.568 6.568 0 0 1 6.692.215z" | |||
| id="H"/> | |||
| <filter x="-29.4%" y="-4.9%" width="139.1%" height="116.3%" filterUnits="objectBoundingBox" id="G"> | |||
| <feOffset dx="-3" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feComposite in="shadowOffsetOuter1" in2="SourceAlpha" operator="out" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.866666667 0 0 0 0 0.890196078 0 0 0 0 0.909803922 0 0 0 1 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="I"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="J"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <path | |||
| d="M42.83 11.876v7.36c0 .69-.493 1.3-1.091 1.36l-24.095 2.083V8.433l24.095 2.084c.602.06 1.09.668 1.09 1.359z" | |||
| id="K"/> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="L"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="M"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <rect id="O" x="12.23" y="6.79" width="7.117" height="17.533" rx="1.095"/> | |||
| <filter x="-42.1%" y="-5.7%" width="156.2%" height="117.1%" filterUnits="objectBoundingBox" id="N"> | |||
| <feOffset dx="-2" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feComposite in="shadowOffsetOuter1" in2="SourceAlpha" operator="out" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| <path d="M6.692.215h8.762v30.683H6.692A6.568 6.568 0 0 1 .124 24.33V6.782A6.568 6.568 0 0 1 6.692.215z" | |||
| id="Q"/> | |||
| <filter x="-29.4%" y="-4.9%" width="139.1%" height="116.3%" filterUnits="objectBoundingBox" id="P"> | |||
| <feOffset dx="-3" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feComposite in="shadowOffsetOuter1" in2="SourceAlpha" operator="out" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.866666667 0 0 0 0 0.890196078 0 0 0 0 0.909803922 0 0 0 1 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="R"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="S"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <path | |||
| d="M42.83 11.876v7.36c0 .69-.493 1.3-1.091 1.36l-24.095 2.083V8.433l24.095 2.084c.602.06 1.09.668 1.09 1.359z" | |||
| id="T"/> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="U"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <filter x="-50%" width="160%" height="160%" filterUnits="objectBoundingBox" id="V"> | |||
| <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1" result="shadowMatrixOuter1"/> | |||
| <feMerge> | |||
| <feMergeNode in="shadowMatrixOuter1"/> | |||
| <feMergeNode in="SourceGraphic"/> | |||
| </feMerge> | |||
| </filter> | |||
| <rect id="X" x="12.23" y="6.79" width="7.117" height="17.533" rx="1.095"/> | |||
| <filter x="-42.1%" y="-5.7%" width="156.2%" height="117.1%" filterUnits="objectBoundingBox" id="W"> | |||
| <feOffset dx="-2" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feComposite in="shadowOffsetOuter1" in2="SourceAlpha" operator="out" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| <path | |||
| d="M24.598 18.916c-1.887-.225-4.41-.546-5.998-.826-2.828-.498-8.375-1.863-8.375-1.863l-.793 4.498s5.701.552 8.518 1.048c1.365.241 3.377.703 5.086 1.114-.964 1.487-2.121 3.236-2.943 4.366-1.688 2.324-5.346 6.71-5.346 6.71l3.695 2.685s2.995-4.882 4.677-7.196c.84-1.158 2.196-2.832 3.338-4.213.981 1.507 2.148 3.335 2.864 4.575 1.436 2.487 3.956 7.613 3.956 7.613l3.955-2.283s-3.241-4.722-4.672-7.2c-.752-1.303-1.795-3.358-2.613-5.01 1.788-.483 4.046-1.073 5.526-1.388 2.81-.597 8.463-1.409 8.463-1.409l-.95-4.468s-5.492 1.624-8.29 2.219c-1.553.33-4.001.71-5.868.98-.105-1.888-.225-4.382-.225-5.972 0-2.872.381-8.57.381-8.57h-4.567s.446 5.71.446 8.57c0 1.609-.142 4.128-.265 6.02z" | |||
| id="Y"/> | |||
| <filter x="-14.6%" y="-6.2%" width="120.9%" height="121.4%" filterUnits="objectBoundingBox" id="Z"> | |||
| <feMorphology radius=".547" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"/> | |||
| <feOffset dx="-3" dy="3" in="shadowSpreadOuter1" result="shadowOffsetOuter1"/> | |||
| <feComposite in="shadowOffsetOuter1" in2="SourceAlpha" operator="out" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.639215686 0 0 0 0 0.694117647 0 0 0 0 0.749019608 0 0 0 0.3 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| <ellipse id="ab" cx="26.803" cy="22.671" rx="4.38" ry="4.383"/> | |||
| <filter x="-34.2%" y="-11.4%" width="145.7%" height="134.2%" filterUnits="objectBoundingBox" id="aa"> | |||
| <feOffset dx="-2" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/> | |||
| <feColorMatrix values="0 0 0 0 0.596078431 0 0 0 0 0.647058824 0 0 0 0 0.701960784 0 0 0 1 0" | |||
| in="shadowOffsetOuter1"/> | |||
| </filter> | |||
| </defs> | |||
| <g fill="none" fill-rule="evenodd"> | |||
| <g transform="translate(7 1)"> | |||
| <use fill="#000" filter="url(#a)" xlink:href="#b"/> | |||
| <use stroke="#A3B1BF" stroke-width="1.62" fill="#F0F2F5" xlink:href="#b"/> | |||
| <use fill="#000" filter="url(#c)" xlink:href="#d"/> | |||
| <use stroke="#A3B1BF" stroke-width="1.62" fill-opacity=".15" fill="#A3B1BF" xlink:href="#d"/> | |||
| <use fill="#000" filter="url(#e)" xlink:href="#f"/> | |||
| <use fill="#F0F2F5" xlink:href="#f"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" | |||
| d="M176.032 106.582V90.668H161.51a5.758 5.758 0 0 0-5.757 5.758v4.398a5.758 5.758 0 0 0 5.757 5.758h14.523z"/> | |||
| <g transform="matrix(-1 0 0 1 376.68 0)"> | |||
| <use fill="#000" filter="url(#g)" xlink:href="#h"/> | |||
| <use fill="#F0F2F5" xlink:href="#h"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" | |||
| d="M198.48 106.582V90.668h-14.522a5.758 5.758 0 0 0-5.758 5.758v4.398a5.758 5.758 0 0 0 5.758 5.758h14.522z"/> | |||
| </g> | |||
| <path | |||
| d="M169.538 109.199h9.983v-2.882c.136.343-4.552 0-7.101 0l1.733-6.073c-2.547 0-4.615 2.05-4.615 4.579v4.376zm11.867-2.435l-.07-.935c-2.842.49-5.457 0-9.247 0l2.065-7.813c-3.787 0-6.861 3.048-6.861 6.807v1.941h-.422c-1.111 0-2.012.9-2.012 2.012v6.764a8.045 8.045 0 0 0 8.046 8.046h3.376a8.045 8.045 0 0 0 8.045-8.046v-6.764c0-1.111-.9-2.012-2.011-2.012h-.91z" | |||
| fill="#D4DBE2" fill-rule="nonzero"/> | |||
| <g filter="url(#i)" transform="translate(160.42 95.473)"> | |||
| <ellipse stroke="#D9D9D9" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#D9D9D9" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#j)" transform="translate(189.26 95.473)"> | |||
| <ellipse stroke="#D9D9D9" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#D9D9D9" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <path | |||
| d="M169.117 106.147v-1.598c0-3.411 2.216-6.3 5.272-7.274v3.576a4.378 4.378 0 0 0-1.866 3.595v1.7h8.643v-1.7a4.38 4.38 0 0 0-1.262-3.085v-3.698a7.633 7.633 0 0 1 4.3 6.886v1.599a2.011 2.011 0 0 1 1.946 2.01v6.972a8.045 8.045 0 0 1-8.045 8.046h-3.376a8.045 8.045 0 0 1-8.046-8.046v-6.972c0-1.11.9-2.011 2.012-2.011h.422z" | |||
| stroke="#A3B1BF" stroke-width="1.62" fill="#F0F2F5"/> | |||
| <g transform="translate(166.683 96.799)"> | |||
| <use fill-opacity=".3" fill="#A3B1BF" xlink:href="#k"/> | |||
| <use fill="#000" filter="url(#l)" xlink:href="#k"/> | |||
| </g> | |||
| <g filter="url(#m)" transform="translate(64 75)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#n)" transform="translate(152 75)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#o)" transform="translate(57 120)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#p)" transform="translate(57 137)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#q)" transform="translate(64 186)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#r)" transform="translate(93 191)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#s)" transform="translate(122 191)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#t)" transform="translate(152 186)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#u)" transform="translate(160.42 95.473)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F5F5F5" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#v)" transform="translate(189.26 95.473)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F7FAFC" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#w)" transform="translate(25 38)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.642" fill="#F7FAFC" cx="4.38" cy="4.931" rx="4.38" ry="4.383"/> | |||
| <path fill="#A3B1BF" d="M4.004 9.133l3.558-.9L2.343.445.446 3.63.79 7.806z"/> | |||
| </g> | |||
| <g filter="url(#x)" transform="translate(25 218)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.642" fill="#F7FAFC" cx="4.38" cy="4.931" rx="4.38" ry="4.383"/> | |||
| <path fill="#A3B1BF" d="M4.004 9.133l3.558-.9L2.343.445.446 3.63.79 7.806z"/> | |||
| </g> | |||
| <g filter="url(#y)" transform="translate(106 237)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.642" fill="#F7FAFC" cx="4.38" cy="4.931" rx="4.38" ry="4.383"/> | |||
| <path fill="#A3B1BF" d="M4.004 9.133l3.558-.9L2.343.445.446 3.63.79 7.806z"/> | |||
| </g> | |||
| <g filter="url(#z)" transform="translate(185 219)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.642" fill="#F7FAFC" cx="4.38" cy="4.931" rx="4.38" ry="4.383"/> | |||
| <path fill="#A3B1BF" d="M4.004 9.133l3.558-.9L2.343.445.446 3.63.79 7.806z"/> | |||
| </g> | |||
| <g filter="url(#A)" transform="translate(14.42 129.699)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.642" fill="#F7FAFC" cx="4.38" cy="4.931" rx="4.38" ry="4.383"/> | |||
| <path fill="#A3B1BF" d="M4.004 9.133l3.558-.9L2.343.445.446 3.63.79 7.806z"/> | |||
| </g> | |||
| <g filter="url(#B)" transform="translate(105.444 20.716)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.642" fill="#F7FAFC" cx="4.38" cy="4.931" rx="4.38" ry="4.383"/> | |||
| <path fill="#A3B1BF" d="M4.004 9.133l3.558-.9L2.343.445.446 3.63.79 7.806z"/> | |||
| </g> | |||
| <g filter="url(#C)" transform="translate(185.055 37.806)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.642" fill="#F5F5F5" cx="4.38" cy="4.931" rx="4.38" ry="4.383"/> | |||
| <path fill="#A3B1BF" d="M4.004 9.133l3.558-.9L2.343.445.446 3.63.79 7.806z"/> | |||
| </g> | |||
| <use fill="#000" filter="url(#D)" xlink:href="#E"/> | |||
| <use fill="#F0F2F5" xlink:href="#E"/> | |||
| <path stroke="#A3B1BF" stroke-width="2.43" d="M80.298 70.009h58.403v21.922H80.298z"/> | |||
| <use fill-opacity=".3" fill="#A3B1BF" xlink:href="#F"/> | |||
| <rect fill="#A3B1BF" x="114.367" y="77.317" width="1.825" height="8.117" rx=".912"/> | |||
| <rect fill="#A3B1BF" x="118.017" y="72.65" width="2.433" height="16.235" rx="1.217"/> | |||
| <g> | |||
| <g transform="translate(25 88)"> | |||
| <use fill="#000" filter="url(#G)" xlink:href="#H"/> | |||
| <use fill="#EAEFF3" xlink:href="#H"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" | |||
| d="M14.644 30.088V1.025H6.692A5.758 5.758 0 0 0 .934 6.782V24.33a5.758 5.758 0 0 0 5.758 5.758h7.952z"/> | |||
| </g> | |||
| <g filter="url(#I)" transform="translate(31.207 94.79)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F7FAFC" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#J)" transform="translate(31.543 107.182)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F7FAFC" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g transform="translate(25 88)"> | |||
| <use fill="#F0F2F5" xlink:href="#K"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" | |||
| d="M18.454 9.316v12.48l23.203-2.006c.165-.017.362-.262.362-.553v-7.361c0-.294-.195-.537-.35-.552L18.454 9.316z"/> | |||
| </g> | |||
| <g filter="url(#L)" transform="translate(48 101)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F7FAFC" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#M)" transform="translate(58 101)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F7FAFC" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g transform="translate(25 88)"> | |||
| <use fill="#000" filter="url(#N)" xlink:href="#O"/> | |||
| <use fill="#EAEFF3" xlink:href="#O"/> | |||
| <rect stroke="#A3B1BF" stroke-width="1.62" x="13.04" y="7.6" width="5.497" height="15.913" rx="1.095"/> | |||
| </g> | |||
| <path d="M38.599 103.556h4.38" stroke="#A3B1BF" stroke-width="2.189" stroke-linecap="square"/> | |||
| </g> | |||
| <g> | |||
| <g transform="translate(25 145)"> | |||
| <use fill="#000" filter="url(#P)" xlink:href="#Q"/> | |||
| <use fill="#EAEFF3" xlink:href="#Q"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" | |||
| d="M14.644 30.088V1.025H6.692A5.758 5.758 0 0 0 .934 6.782V24.33a5.758 5.758 0 0 0 5.758 5.758h7.952z"/> | |||
| </g> | |||
| <g filter="url(#R)" transform="translate(31.207 151.79)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F7FAFC" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#S)" transform="translate(31.543 164.182)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F7FAFC" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g transform="translate(25 145)"> | |||
| <use fill="#F0F2F5" xlink:href="#T"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" | |||
| d="M18.454 9.316v12.48l23.203-2.006c.165-.017.362-.262.362-.553v-7.361c0-.294-.195-.537-.35-.552L18.454 9.316z"/> | |||
| </g> | |||
| <g filter="url(#U)" transform="translate(48 158)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F7FAFC" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g filter="url(#V)" transform="translate(58 158)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="1.095" fill="#F7FAFC" cx="2.19" cy="2.74" rx="2.19" ry="2.192"/> | |||
| <path fill="#A3B1BF" d="M3.781 4.39L1.171.497.224 2.09.101 4.39z"/> | |||
| </g> | |||
| <g transform="translate(25 145)"> | |||
| <use fill="#000" filter="url(#W)" xlink:href="#X"/> | |||
| <use fill="#EAEFF3" xlink:href="#X"/> | |||
| <rect stroke="#A3B1BF" stroke-width="1.62" x="13.04" y="7.6" width="5.497" height="15.913" rx="1.095"/> | |||
| </g> | |||
| <path d="M38.599 160.556h4.38" stroke="#A3B1BF" stroke-width="2.189" stroke-linecap="square"/> | |||
| </g> | |||
| </g> | |||
| <path | |||
| d="M164.669 178.731c-12.398 0-22.448-10.058-22.448-22.465 0-12.406 10.05-22.464 22.448-22.464 12.397 0 22.447 10.058 22.447 22.464 0 12.407-10.05 22.465-22.447 22.465zm0-6.575c8.769 0 15.877-7.114 15.877-15.89 0-8.775-7.108-15.89-15.877-15.89-8.77 0-15.878 7.115-15.878 15.89 0 8.776 7.109 15.89 15.878 15.89z" | |||
| fill-opacity=".3" fill="#A3B1BF"/> | |||
| <g transform="translate(142.185 132.5)"> | |||
| <use fill="#000" filter="url(#Z)" xlink:href="#Y"/> | |||
| <use stroke="#A3B1BF" stroke-width="1.095" fill="#A3B1BF" xlink:href="#Y"/> | |||
| </g> | |||
| <path | |||
| d="M163.11 133.506a22.515 22.515 0 0 1 4.803-.516c12.398 0 22.448 10.058 22.448 22.465 0 10.862-7.704 19.924-17.943 22.012l-2.403-6.26c7.776-1.03 13.776-7.69 13.776-15.752 0-8.776-7.109-15.89-15.878-15.89a15.796 15.796 0 0 0-8.976 2.781l-1.083-2.82 5.255-6.02z" | |||
| fill="#98A5B3"/> | |||
| <path | |||
| d="M168.988 177.635c-12.398 0-22.448-10.058-22.448-22.464 0-12.407 10.05-22.465 22.448-22.465 12.397 0 22.447 10.058 22.447 22.465 0 12.406-10.05 22.464-22.447 22.464zm0-6.575c8.769 0 15.877-7.114 15.877-15.89 0-8.775-7.108-15.889-15.877-15.889-8.769 0-15.878 7.114-15.878 15.89 0 8.775 7.109 15.89 15.878 15.89z" | |||
| fill="#A3B1BF"/> | |||
| <path d="M179.754 138.974s2.787 1.59 5.432 6.022c2.644 4.432 2.986 8.99 2.986 8.99" stroke="#F7FAFC" | |||
| stroke-width="1.62" stroke-linecap="round"/> | |||
| <g transform="translate(142.185 132.5)"> | |||
| <use fill="#000" filter="url(#aa)" xlink:href="#ab"/> | |||
| <use fill="#A3B1BF" xlink:href="#ab"/> | |||
| </g> | |||
| <path d="M171.213 156.862a2.434 2.434 0 0 0-3.321-3.562s1.204.368 2.12 1.351c.918.984 1.201 2.21 1.201 2.21z" | |||
| fill="#F7FAFC"/> | |||
| </g> | |||
| </svg> | |||
| </div> | |||
| <div class="ele-exception-content ele-text-left"> | |||
| <h1 class="ele-text">403</h1> | |||
| <p class="ele-text-secondary">抱歉，你无权访问该页面</p> | |||
| <div> | |||
| <el-button type="primary" @click="$router.push('/')">返回首页</el-button> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "Page403" | |||
| } | |||
| </script> | |||
| <style scoped> | |||
| .ele-exception { | |||
| margin: 150px 0; | |||
| } | |||
| .ele-exception .ele-exception-img svg { | |||
| max-width: 95%; | |||
| } | |||
| .ele-exception .ele-exception-img, .ele-exception .ele-exception-content { | |||
| margin: 15px 30px; | |||
| display: inline-block; | |||
| vertical-align: middle; | |||
| } | |||
| .ele-exception .ele-exception-content > h1 { | |||
| font-size: 72px; | |||
| font-weight: 600; | |||
| margin: 0 0 20px 0; | |||
| } | |||
| .ele-exception:not(.ele-exception-dark) .ele-exception-content > h1 { | |||
| color: #515A6E; | |||
| } | |||
| .ele-exception .ele-exception-content > p { | |||
| font-size: 20px; | |||
| margin: 0 0 25px 0; | |||
| } | |||
| .ele-exception:not(.ele-exception-dark) .ele-exception-content > p { | |||
| color: #808695; | |||
| } | |||
| /** 适配暗黑主题 */ | |||
| .ele-exception-dark .ele-exception-img { | |||
| opacity: .7; | |||
| } | |||
| /** 小屏幕样式 */ | |||
| @media screen and (max-width: 768px) { | |||
| .ele-exception { | |||
| margin: 40px 0; | |||
| } | |||
| .ele-exception .ele-exception-img { | |||
| margin: 0; | |||
| } | |||
| .ele-exception .ele-exception-img svg { | |||
| max-height: 200px; | |||
| } | |||
| .ele-exception .ele-exception-content { | |||
| text-align: center; | |||
| } | |||
| } | |||
| </style> | |||
+ 425
- 0
src/views/common/exception/404.vue
View File
| @@ -0,0 +1,425 @@ | |||
| <template> | |||
| <div :class="['ele-exception ele-text-center',{'ele-exception-dark':$store.state.theme.theme==='dark'}]"> | |||
| <div class="ele-exception-img"> | |||
| <svg width="423" height="341" viewBox="0 0 423 341" xmlns="http://www.w3.org/2000/svg"> | |||
| <g fill="none" fill-rule="evenodd"> | |||
| <g stroke="#A3B1BF" stroke-width="1.62" opacity=".6" stroke-linejoin="round" stroke-dasharray="12.15"> | |||
| <path | |||
| d="M224.993 290.054c-65.929 0-119.375-53.434-119.375-119.35 0-65.915 53.446-119.35 119.375-119.35 65.928 0 119.374 53.435 119.374 119.35 0 65.916-53.446 119.35-119.374 119.35z"/> | |||
| <path | |||
| d="M224.823 339.72c-93.378 0-169.076-75.684-169.076-169.043 0-93.36 75.698-169.042 169.076-169.042s169.076 75.683 169.076 169.042c0 93.36-75.698 169.042-169.076 169.042z"/> | |||
| </g> | |||
| <path fill="#F5F5F5" d="M78.617 196.401l20.278-1.052L84.052 209.2z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M78.617 196.401l20.278-1.052L84.052 209.2z"/> | |||
| <path d="M22.038 208.972l20.251-8.594 13.665 32.184-20.251 8.594z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M22.038 208.972l20.251-8.594 13.665 32.184-20.251 8.594z"/> | |||
| <path fill="#F5F5F5" d="M38.867 193.414l4.997-2.12 19.721 46.447-4.997 2.12z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" fill="#F0F2F5" stroke-linejoin="round" | |||
| d="M38.867 193.414l4.997-2.12 19.721 46.447-4.997 2.12z"/> | |||
| <path d="M43.485 251.004l18.752-7.958 23.674 55.757-18.751 7.957z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M43.485 251.004l18.752-7.958 23.674 55.757-18.751 7.957z"/> | |||
| <path d="M48.068 201.196l3.463-1.47 11.313 26.643-3.463 1.47z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M48.068 201.196l3.463-1.47 11.313 26.643-3.463 1.47z"/> | |||
| <path fill="#F5F5F5" d="M53.783 204.42l8.022-3.405.765 1.802-8.022 3.404z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M53.783 204.42l8.022-3.405.765 1.802-8.022 3.404z"/> | |||
| <path fill="#F5F5F5" d="M60.283 219.73l8.022-3.404.765 1.802-8.021 3.404z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M60.283 219.73l8.022-3.404.765 1.802-8.021 3.404z"/> | |||
| <path d="M49.437 239.012l3.405 8.02-1.802.766-3.405-8.022z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M49.437 239.012l3.405 8.02-1.802.766-3.405-8.022z"/> | |||
| <path d="M17.433 217.134l4.605-8.162 13.665 32.184-9.072-2.359z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M17.433 217.134l4.605-8.162 13.665 32.184-9.072-2.359z"/> | |||
| <path d="M17.433 217.134l-5.653-3.81 13.666 32.185 1.185-6.712z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M17.433 217.134l-5.653-3.81 13.666 32.185 1.185-6.712z"/> | |||
| <path d="M14.117 219.19l-5.772-1.165 4.074 9.596 3.171-4.96z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M14.117 219.19l-5.772-1.165 4.074 9.596 3.171-4.96z"/> | |||
| <path d="M21.375 236.284l-5.772-1.165 4.074 9.595 3.171-4.96z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M21.375 236.284l-5.772-1.165 4.074 9.595 3.171-4.96z"/> | |||
| <path fill="#F0F2F5" d="M52.498 201.393l2.41-1.023 3.3 7.77-2.41 1.024z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M52.498 201.393l2.41-1.023 3.3 7.77-2.41 1.024z"/> | |||
| <path fill="#F0F2F5" d="M59.016 216.746l2.411-1.023 3.3 7.77-2.411 1.024z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M59.016 216.746l2.411-1.023 3.3 7.77-2.411 1.024z"/> | |||
| <path d="M45.41 237.037l3.6-1.528 1.65 3.885-3.6 1.528z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" fill="#F5F5F5" stroke-linejoin="round" | |||
| d="M45.41 237.037l3.6-1.528 1.65 3.885-3.6 1.528z"/> | |||
| <path | |||
| d="M66.817 209.043c-6.095-14.354-5.144-28.946 1.659-35.517 1.125-1.086 3.702-2.908 5.748 1.91l21.773 51.281c1.864 4.389-.907 5.75-2.468 5.805-9.455.33-20.617-9.123-26.712-23.479z" | |||
| fill="#F5F5F5"/> | |||
| <path | |||
| d="M66.817 209.043c-6.095-14.354-5.144-28.946 1.659-35.517 1.125-1.086 3.702-2.908 5.748 1.91l21.773 51.281c1.864 4.389-.907 5.75-2.468 5.805-9.455.33-20.617-9.123-26.712-23.479z" | |||
| stroke="#A3B1BF" stroke-width="1.62" fill="#F0F2F5" stroke-linejoin="round"/> | |||
| <path fill="#F0F2F5" d="M61.153 199.48l2.41-1.022 8.552 20.139-2.411 1.023z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M61.153 199.48l2.41-1.022 8.552 20.139-2.411 1.023z"/> | |||
| <path d="M100.73 197.68a2.863 2.863 0 1 1-2.237-5.272 2.863 2.863 0 0 1 2.237 5.272" fill="#A3B1BF"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M60.645 250.555l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M60.645 250.555l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M62.097 253.974l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M62.097 253.974l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M63.548 257.392l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M63.548 257.392l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M65 260.811l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path d="M65 260.811l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M57.49 251.894l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M57.49 251.894l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M58.94 255.313l-.893-2.104 2.104-.893.894 2.104z"/> | |||
| <path d="M58.94 255.313l-.893-2.104 2.104-.893.894 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M60.392 258.732l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M59.5 256.628l2.103-.893.893 2.104-2.104.893z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M61.844 262.15l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M61.844 262.15l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M54.333 253.233l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M54.333 253.233l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M55.785 256.652l-.894-2.104 2.104-.892.894 2.103z"/> | |||
| <path d="M55.785 256.652l-.894-2.104 2.104-.892.894 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M57.236 260.07l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M57.236 260.07l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M58.688 263.49l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M58.688 263.49l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M51.177 254.573l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M51.177 254.573l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M52.629 257.991l-.894-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M52.629 257.991l-.894-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M54.08 261.41l-.893-2.103 2.104-.893.893 2.103z"/> | |||
| <path d="M54.08 261.41l-.893-2.103 2.104-.893.893 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M55.532 264.83l-.893-2.105 2.103-.892.894 2.103z"/> | |||
| <path d="M55.532 264.83l-.893-2.105 2.103-.892.894 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M48.02 255.912l-.892-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M48.02 255.912l-.892-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M49.472 259.33l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M49.472 259.33l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M50.924 262.75l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M50.924 262.75l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M52.376 266.168l-.894-2.103 2.104-.893.894 2.104z"/> | |||
| <path d="M52.376 266.168l-.894-2.103 2.104-.893.894 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M68.248 268.46l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M68.248 268.46l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M69.7 271.878l-.894-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M69.7 271.878l-.894-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M71.15 275.297l-.892-2.103 2.103-.893.894 2.103z"/> | |||
| <path d="M71.15 275.297l-.892-2.103 2.103-.893.894 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M72.602 278.716l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path d="M72.602 278.716l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M65.091 269.799l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M65.091 269.799l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M66.543 273.218l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M66.543 273.218l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M67.995 276.637l-.894-2.104 2.104-.893.894 2.104z"/> | |||
| <path d="M67.995 276.637l-.894-2.104 2.104-.893.894 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M69.446 280.055l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M69.446 280.055l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M61.935 271.138l-.893-2.103 2.104-.893.893 2.103z"/> | |||
| <path d="M61.935 271.138l-.893-2.103 2.104-.893.893 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M63.387 274.557l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path d="M63.387 274.557l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M64.839 277.976l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M64.839 277.976l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M66.29 281.395l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M66.29 281.395l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M58.78 272.478l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M58.78 272.478l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M60.23 275.896l-.892-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M60.23 275.896l-.892-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M61.682 279.315l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path d="M61.682 279.315l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M63.134 282.734l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M63.134 282.734l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M55.623 273.817l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M55.623 273.817l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M57.075 277.236l-.893-2.104 2.103-.893.894 2.104z"/> | |||
| <path d="M57.075 277.236l-.893-2.104 2.103-.893.894 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M58.526 280.654l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M58.526 280.654l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M59.978 284.073l-.893-2.103 2.104-.893.893 2.103z"/> | |||
| <path d="M59.978 284.073l-.893-2.103 2.104-.893.893 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M75.85 286.365l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M75.85 286.365l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M77.302 289.783l-.894-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M77.302 289.783l-.894-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M78.753 293.202l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path d="M78.753 293.202l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M80.205 296.621l-.893-2.104 2.103-.893.894 2.104z"/> | |||
| <path d="M80.205 296.621l-.893-2.104 2.103-.893.894 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M72.694 287.704L71.8 285.6l2.103-.893.894 2.104z"/> | |||
| <path d="M72.694 287.704L71.8 285.6l2.103-.893.894 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M74.145 291.123l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M74.145 291.123l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M75.597 294.541l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M75.597 294.541l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M77.049 297.96l-.894-2.103 2.104-.893.894 2.103z"/> | |||
| <path d="M77.049 297.96l-.894-2.103 2.104-.893.894 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M69.538 289.043l-.894-2.104 2.104-.892.894 2.103z"/> | |||
| <path d="M69.538 289.043l-.894-2.104 2.104-.892.894 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M70.99 292.462l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M70.99 292.462l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M72.44 295.88l-.892-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M72.44 295.88l-.892-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M73.893 299.3l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M73.893 299.3l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M66.382 290.382l-.894-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M66.382 290.382l-.894-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M67.833 293.801l-.893-2.103 2.104-.893.893 2.103z"/> | |||
| <path d="M67.833 293.801l-.893-2.103 2.104-.893.893 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M69.285 297.22l-.893-2.104 2.103-.892.894 2.103z"/> | |||
| <path d="M69.285 297.22l-.893-2.104 2.103-.892.894 2.103z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M70.736 300.639l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M70.736 300.639l-.893-2.104 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M63.226 291.722l-.894-2.104 2.104-.893.893 2.104z"/> | |||
| <path d="M62.332 289.618l2.104-.893.893 2.104-2.103.893z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M64.677 295.14l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path d="M64.677 295.14l-.893-2.103 2.104-.893.893 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M66.129 298.56l-.893-2.104 2.103-.893.894 2.104z"/> | |||
| <path d="M66.129 298.56l-.893-2.104 2.103-.893.894 2.104z"/> | |||
| <path fill-opacity=".6" fill="#A3B1BF" d="M67.58 301.978l-.893-2.104 2.104-.892.893 2.103z"/> | |||
| <path | |||
| d="M67.58 301.978l-.893-2.104 2.104-.892.893 2.103zM20.241 196.26l18.752-7.957-23.674-55.758-18.752 7.958z"/> | |||
| <path d="M33.004 200.31l-3.406-8.02-1.802.764 3.406 8.021z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" | |||
| d="M33.004 200.31l-3.406-8.02-1.802.764 3.406 8.021z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M31.628 204.578l3.6-1.528-1.649-3.885-3.6 1.528z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" fill="#FFF" stroke-linejoin="round" | |||
| d="M31.628 204.578l3.6-1.528-1.649-3.885-3.6 1.528z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M32.485 184.231l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path d="M32.485 184.231l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M31.033 180.813l.893 2.103 2.104-.893-.893-2.103z"/> | |||
| <path d="M31.033 180.813l.893 2.103 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M29.581 177.394l.894 2.103 2.104-.892-.894-2.104z"/> | |||
| <path d="M29.581 177.394l.894 2.103 2.104-.892-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M28.13 173.975l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M28.13 173.975l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M29.329 185.57l.893 2.104 2.104-.892-.893-2.104z"/> | |||
| <path d="M29.329 185.57l.893 2.104 2.104-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M27.877 182.152l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M27.877 182.152l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M26.425 178.733l.894 2.104 2.104-.893-.894-2.104z"/> | |||
| <path d="M26.425 178.733l.894 2.104 2.104-.893-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M24.974 175.314l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M24.974 175.314l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M26.173 186.91l.893 2.104 2.104-.893-.894-2.104z"/> | |||
| <path d="M26.173 186.91l.893 2.104 2.104-.893-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M24.72 183.491l.894 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M24.72 183.491l.894 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M23.27 180.072l.893 2.104 2.103-.893-.893-2.103z"/> | |||
| <path d="M23.27 180.072l.893 2.104 2.103-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M21.818 176.654l.893 2.103 2.104-.893-.893-2.103z"/> | |||
| <path d="M21.818 176.654l.893 2.103 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M23.016 188.25l.894 2.103 2.104-.893-.894-2.104z"/> | |||
| <path d="M23.016 188.25l.894 2.103 2.104-.893-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M21.565 184.83l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path d="M21.565 184.83l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M20.113 181.412l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path d="M20.113 181.412l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M18.662 177.993l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M18.662 177.993l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M19.86 189.589l.894 2.103 2.103-.893-.893-2.103z"/> | |||
| <path d="M19.86 189.589l.894 2.103 2.103-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M18.409 186.17l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path d="M18.409 186.17l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M16.957 182.75l.893 2.105 2.104-.893-.893-2.104z"/> | |||
| <path d="M16.957 182.75l.893 2.105 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M15.505 179.332l.894 2.104 2.104-.893-.894-2.104z"/> | |||
| <path d="M15.505 179.332l.894 2.104 2.104-.893-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M24.882 166.326l.894 2.104 2.103-.893-.893-2.103z"/> | |||
| <path d="M24.882 166.326l.894 2.104 2.103-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M23.43 162.908l.894 2.103 2.104-.892-.893-2.104z"/> | |||
| <path d="M23.43 162.908l.894 2.103 2.104-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M21.98 159.489l.892 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M21.98 159.489l.892 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M20.528 156.07l.893 2.104 2.104-.893-.894-2.104z"/> | |||
| <path d="M20.528 156.07l.893 2.104 2.104-.893-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M21.726 167.666l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path d="M21.726 167.666l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M20.275 164.247l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M20.275 164.247l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M18.823 160.828l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M18.823 160.828l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M17.371 157.41l.894 2.103 2.104-.893-.894-2.103z"/> | |||
| <path d="M17.371 157.41l.894 2.103 2.104-.893-.894-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M18.57 169.005l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M18.57 169.005l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M17.119 165.586l.893 2.104 2.104-.893-.894-2.104z"/> | |||
| <path d="M17.119 165.586l.893 2.104 2.104-.893-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M15.667 162.167l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path d="M15.667 162.167l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M14.215 158.749l.894 2.103 2.103-.892-.893-2.104z"/> | |||
| <path d="M14.215 158.749l.894 2.103 2.103-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M15.414 170.344l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path d="M15.414 170.344l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M13.963 166.926l.893 2.103 2.104-.893-.894-2.103z"/> | |||
| <path d="M13.963 166.926l.893 2.103 2.104-.893-.894-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M12.51 163.507l.894 2.103 2.104-.892-.893-2.104z"/> | |||
| <path d="M12.51 163.507l.894 2.103 2.104-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M11.06 160.088l.892 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M11.06 160.088l.892 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M12.258 171.684l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path d="M12.258 171.684l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M10.806 168.265l.894 2.104 2.104-.893-.894-2.104z"/> | |||
| <path d="M10.806 168.265l.894 2.104 2.104-.893-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M9.355 164.846l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M9.355 164.846l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M7.903 161.427l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M7.903 161.427l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M17.28 148.422l.893 2.103 2.104-.893-.893-2.103z"/> | |||
| <path d="M17.28 148.422l.893 2.103 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M15.828 145.003l.894 2.103 2.104-.892-.894-2.104z"/> | |||
| <path d="M15.828 145.003l.894 2.103 2.104-.892-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M14.377 141.584l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M14.377 141.584l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M12.925 138.165l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill="#B2BECA" d="M13.818 140.269l2.104-.893-.893-2.104-2.104.893z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M14.124 149.76l.893 2.105 2.104-.893-.893-2.104z"/> | |||
| <path d="M14.124 149.76l.893 2.105 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M12.672 146.342l.894 2.104 2.103-.893-.893-2.104z"/> | |||
| <path d="M12.672 146.342l.894 2.104 2.103-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M11.22 142.923l.894 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M11.22 142.923l.894 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M9.77 139.504l.892 2.104 2.104-.893-.893-2.103z"/> | |||
| <path d="M9.77 139.504l.892 2.104 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M10.968 151.1l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M10.968 151.1l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M9.516 147.681l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path d="M9.516 147.681l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M8.065 144.262l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path d="M8.065 144.262l.893 2.104 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M6.613 140.844l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path d="M6.613 140.844l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M7.812 152.44l.893 2.103 2.104-.893-.893-2.103z"/> | |||
| <path d="M7.812 152.44l.893 2.103 2.104-.893-.893-2.103z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M6.36 149.02l.893 2.104 2.104-.892-.893-2.104z"/> | |||
| <path d="M6.36 149.02l.893 2.104 2.104-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M4.909 145.602l.893 2.104 2.104-.893-.894-2.104z"/> | |||
| <path d="M4.909 145.602l.893 2.104 2.104-.893-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M3.457 142.183l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M3.457 142.183l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M4.656 153.779l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path d="M4.656 153.779l.893 2.103 2.104-.892-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M3.204 150.36l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M3.204 150.36l.893 2.104 2.104-.893-.893-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M1.752 146.941l.894 2.104 2.104-.893-.894-2.104z"/> | |||
| <path d="M1.752 146.941l.894 2.104 2.104-.893-.894-2.104z"/> | |||
| <path fill-opacity=".8" fill="#A3B1BF" d="M.3 143.522l.894 2.104 2.104-.893-.893-2.104z"/> | |||
| <path d="M.3 143.522l.894 2.104 2.104-.893-.893-2.104z"/> | |||
| <path | |||
| d="M108.976 190.44c-1.626-3.83-2.29-7.213-1.482-7.556.808-.343 2.781 2.484 4.408 6.314 1.625 3.83 2.29 7.213 1.481 7.555-.808.343-2.78-2.484-4.407-6.313z" | |||
| fill="#F5F5F5"/> | |||
| <path | |||
| d="M108.976 190.44c-1.626-3.83-2.29-7.213-1.482-7.556.808-.343 2.781 2.484 4.408 6.314 1.625 3.83 2.29 7.213 1.481 7.555-.808.343-2.78-2.484-4.407-6.313z" | |||
| stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round"/> | |||
| <path | |||
| d="M115.406 187.71c-3.249-7.652-4.575-14.41-2.96-15.096 1.614-.685 5.556 4.964 8.805 12.616 3.25 7.653 4.576 14.412 2.961 15.097-1.614.685-5.556-4.963-8.806-12.617z" | |||
| fill="#F5F5F5"/> | |||
| <path | |||
| d="M115.406 187.71c-3.249-7.652-4.575-14.41-2.96-15.096 1.614-.685 5.556 4.964 8.805 12.616 3.25 7.653 4.576 14.412 2.961 15.097-1.614.685-5.556-4.963-8.806-12.617z" | |||
| stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round"/> | |||
| <path | |||
| d="M125.79 183.305c-4.355-10.256-6.132-19.314-3.968-20.232 2.163-.918 7.446 6.652 11.8 16.908 4.355 10.255 6.132 19.313 3.969 20.231-2.164.918-7.447-6.652-11.802-16.907z" | |||
| fill-opacity=".35" fill="#F5F5F5"/> | |||
| <path | |||
| d="M125.79 183.305c-4.355-10.256-6.132-19.314-3.968-20.232 2.163-.918 7.446 6.652 11.8 16.908 4.355 10.255 6.132 19.313 3.969 20.231-2.164.918-7.447-6.652-11.802-16.907z" | |||
| stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round"/> | |||
| <path | |||
| d="M44.715 90.559c-2.536-1.139-4.219-2.494-3.935-3.273.283-.779 2.439-.736 5.11.02 1.131-2.535 2.462-4.223 3.214-3.95.751.274.686 2.422-.077 5.092 2.532 1.138 4.21 2.49 3.927 3.269-.284.78-2.443.736-5.119-.023-1.12 2.473-2.422 4.106-3.162 3.836-.741-.27-.688-2.357.042-4.971z" | |||
| fill-opacity=".4" fill="#A3B1BF" opacity=".85"/> | |||
| <path | |||
| d="M98.776 330.14l-.351.386a2.43 2.43 0 0 1-4.19-1.201l-.092-.512-.474-.214a2.43 2.43 0 0 1-.152-4.356l.458-.246.057-.518a2.43 2.43 0 0 1 4.095-1.49l.377.36.51-.106a2.43 2.43 0 0 1 2.682 3.434l-.225.469.258.451a2.43 2.43 0 0 1-2.437 3.614l-.516-.07zM412.965 121.001a1.523 1.523 0 0 1-2.291-1.487 1.523 1.523 0 0 1 .707-2.639 1.523 1.523 0 0 1 2.728-.143 1.523 1.523 0 0 1 .98 2.55 1.523 1.523 0 0 1-2.123 1.72zM78.26 39.51l-.833.127a2.43 2.43 0 0 1-2.5-3.57l.405-.738-.378-.752a2.43 2.43 0 0 1 2.623-3.48l.827.156.599-.593a2.43 2.43 0 0 1 4.12 1.419l.107.836.748.386a2.43 2.43 0 0 1-.076 4.357l-.76.36-.136.83a2.43 2.43 0 0 1-4.168 1.275l-.578-.614zM376.631 306.744l-.533-.135a2.43 2.43 0 0 1-.906-4.263l.431-.34-.035-.548a2.43 2.43 0 0 1 3.774-2.179l.456.305.511-.204a2.43 2.43 0 0 1 3.239 2.916l-.15.53.352.422a2.43 2.43 0 0 1-1.773 3.981l-.548.022-.293.464a2.43 2.43 0 0 1-4.334-.455l-.19-.516zM420.263 147.294a1.523 1.523 0 0 1-2.496-1.11 1.523 1.523 0 0 1 .285-2.717 1.523 1.523 0 0 1 2.673-.568 1.523 1.523 0 0 1 1.366 2.365 1.523 1.523 0 0 1-1.828 2.03z" | |||
| fill-opacity=".4" fill="#A3B1BF"/> | |||
| <path | |||
| d="M224.622 221.613c32.537 0 58.914-26.37 58.914-58.902 0-32.53-26.377-58.901-58.914-58.901-32.538 0-58.914 26.37-58.914 58.901 0 32.531 26.376 58.902 58.914 58.902z" | |||
| fill-opacity=".66" fill="#A3B1BF"/> | |||
| <path | |||
| d="M225.346 142.06c-4.2 0-7.465 1.282-9.798 3.847-2.333 2.448-3.44 5.712-3.44 9.792h4.606c0-2.856.642-5.07 1.925-6.703 1.4-1.923 3.557-2.856 6.473-2.856 2.45 0 4.374.641 5.716 2.04 1.283 1.282 1.983 3.09 1.983 5.42 0 1.633-.584 3.148-1.75 4.605-.35.466-1.05 1.166-1.983 2.098-3.15 2.798-5.074 5.013-5.89 6.762-.7 1.457-1.05 3.147-1.05 5.07v1.341h4.666v-1.34c0-1.574.35-2.973 1.108-4.255.583-1.05 1.458-2.099 2.74-3.206 2.567-2.273 4.142-3.789 4.725-4.488 1.458-1.924 2.216-4.197 2.216-6.82 0-3.497-1.108-6.236-3.266-8.218-2.275-2.098-5.249-3.089-8.981-3.089zm-.875 35.496c-.992 0-1.808.291-2.508.99-.7.642-.991 1.458-.991 2.449 0 .99.291 1.807.991 2.506.7.641 1.516.991 2.508.991.991 0 1.808-.35 2.508-.99.7-.642 1.05-1.458 1.05-2.507 0-.99-.35-1.807-.992-2.448-.7-.7-1.575-.99-2.566-.99z" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M203.262 134.14c5.815-3.357 16.37-7.312 13.012-13.126-3.358-5.815-15.708-4.97-21.524-1.613-5.815 3.357-12.02 13.223-8.662 19.037 3.357 5.815 11.358-.941 17.174-4.298M229.679 120.82a4.863 4.863 0 1 0 .001-9.726 4.863 4.863 0 0 0-.001 9.727z" | |||
| fill="#FAFAFA"/> | |||
| <path d="M401.5 322.5l1.5 1.5" stroke="#979797" stroke-linecap="square"/> | |||
| </g> | |||
| </svg> | |||
| </div> | |||
| <div class="ele-exception-content ele-text-left"> | |||
| <h1 class="ele-text">404</h1> | |||
| <p class="ele-text-secondary">抱歉，你访问的页面不存在</p> | |||
| <div> | |||
| <el-button type="primary" @click="$router.push('/')">返回首页</el-button> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "Page404" | |||
| } | |||
| </script> | |||
| <style scoped> | |||
| .ele-exception { | |||
| margin: 150px 0; | |||
| } | |||
| .ele-exception .ele-exception-img svg { | |||
| max-width: 95%; | |||
| width: 320px; | |||
| } | |||
| .ele-exception .ele-exception-img, .ele-exception .ele-exception-content { | |||
| margin: 15px 30px; | |||
| display: inline-block; | |||
| vertical-align: middle; | |||
| } | |||
| .ele-exception .ele-exception-content > h1 { | |||
| font-size: 72px; | |||
| font-weight: 600; | |||
| margin: 0 0 20px 0; | |||
| } | |||
| .ele-exception:not(.ele-exception-dark) .ele-exception-content > h1 { | |||
| color: #515A6E; | |||
| } | |||
| .ele-exception .ele-exception-content > p { | |||
| font-size: 20px; | |||
| margin: 0 0 25px 0; | |||
| } | |||
| .ele-exception:not(.ele-exception-dark) .ele-exception-content > p { | |||
| color: #808695; | |||
| } | |||
| /** 适配暗黑主题 */ | |||
| .ele-exception-dark .ele-exception-img { | |||
| opacity: .7; | |||
| } | |||
| /** 小屏幕样式 */ | |||
| @media screen and (max-width: 768px) { | |||
| .ele-exception { | |||
| margin: 40px 0; | |||
| } | |||
| .ele-exception .ele-exception-img { | |||
| margin: 0; | |||
| } | |||
| .ele-exception .ele-exception-img svg { | |||
| max-height: 200px; | |||
| } | |||
| .ele-exception .ele-exception-content { | |||
| text-align: center; | |||
| } | |||
| } | |||
| </style> | |||
+ 574
- 0
src/views/common/exception/500.vue
View File
| @@ -0,0 +1,574 @@ | |||
| <template> | |||
| <div :class="['ele-exception ele-text-center',{'ele-exception-dark':$store.state.theme.theme==='dark'}]"> | |||
| <div class="ele-exception-img"> | |||
| <svg width="422" height="193" viewBox="0 0 422 193" xmlns="http://www.w3.org/2000/svg"> | |||
| <g fill="none" fill-rule="evenodd"> | |||
| <path fill-opacity=".25" fill="#A3B1BF" opacity=".9" d="M218.562 13.895v114.572h109.58V13.895z"/> | |||
| <path stroke="#A3B1BF" stroke-width="1.62" d="M218.562 13.895v114.572h109.58V13.895z"/> | |||
| <path | |||
| d="M322.202 12.485c0-4.562 3.747-8.295 8.327-8.295h12.539c4.58 0 8.326 3.733 8.326 8.295v117.488c0 4.562-3.747 8.295-8.326 8.295h-12.54c-4.58 0-8.326-3.733-8.326-8.295V12.485z" | |||
| fill="#F0F2F5"/> | |||
| <path | |||
| d="M322.202 12.485c0-4.562 3.747-8.295 8.327-8.295h12.539c4.58 0 8.326 3.733 8.326 8.295v117.488c0 4.562-3.747 8.295-8.326 8.295h-12.54c-4.58 0-8.326-3.733-8.326-8.295V12.485z" | |||
| stroke="#A3B1BF" stroke-width="1.62"/> | |||
| <path | |||
| d="M343.897 15.047a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49l26.491-16.73 13.386-7.278"/> | |||
| <path | |||
| d="M343.957 15.08a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M343.957 24.004a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M343.957 24.004a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M343.957 32.927a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.827 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M343.957 32.927a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.827 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M343.957 41.851a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.827 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M343.957 41.851a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.827 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M343.957 50.775a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M343.957 50.775a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M343.957 59.698a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.492 1.497-1.492.827 0 1.497.667 1.497 1.491 0 .824-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M343.957 59.698a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.492 1.497-1.492.827 0 1.497.667 1.497 1.491 0 .824-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M327.904 13.589c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49a1.494 1.494 0 0 1-1.496-1.49z" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M329.4 15.08a1.494 1.494 0 0 1-1.496-1.491c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M329.4 24.004a1.494 1.494 0 0 1-1.496-1.491c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M329.4 24.004a1.494 1.494 0 0 1-1.496-1.491c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M329.4 32.927a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M329.4 32.927a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M329.4 41.851a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M329.4 41.851a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M329.4 50.775a1.494 1.494 0 0 1-1.496-1.491c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M329.4 50.775a1.494 1.494 0 0 1-1.496-1.491c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M329.4 59.698a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.491 0 .824-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M329.4 59.698a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.491 0 .824-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M335.182 17.645c0-.824.67-1.492 1.497-1.492.826 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491a1.494 1.494 0 0 1-1.497-1.49z" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M336.679 19.136a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M336.679 28.06a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M336.679 28.06a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M336.679 36.984a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M336.679 36.984a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M336.679 45.907a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M336.679 45.907a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M336.679 54.83a1.494 1.494 0 0 1-1.497-1.49c0-.824.67-1.492 1.497-1.492.826 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M336.679 54.83a1.494 1.494 0 0 1-1.497-1.49c0-.824.67-1.492 1.497-1.492.826 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M336.679 63.755a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M336.679 63.755a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M332.747 122.705c0-2.39 1.944-4.326 4.342-4.326 2.399 0 4.343 1.937 4.343 4.326 0 2.388-1.944 4.325-4.343 4.325-2.398 0-4.342-1.937-4.342-4.325z" | |||
| fill="#A3B1BF"/> | |||
| <path | |||
| d="M308.374 114.052a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#F5F5F5"/> | |||
| <path | |||
| d="M308.374 114.052a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M294.626 114.052a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#F5F5F5"/> | |||
| <path | |||
| d="M294.626 114.052a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M308.374 31.305a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#F5F5F5"/> | |||
| <path | |||
| d="M308.374 31.305a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M294.626 31.305a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#F5F5F5"/> | |||
| <path | |||
| d="M294.626 31.305a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M251.844 12.485c0-4.562 3.747-8.295 8.327-8.295h12.54c4.579 0 8.326 3.733 8.326 8.295v117.488c0 4.562-3.747 8.295-8.327 8.295h-12.539c-4.58 0-8.327-3.733-8.327-8.295V12.485z" | |||
| fill="#F0F2F5"/> | |||
| <path | |||
| d="M251.844 12.485c0-4.562 3.747-8.295 8.327-8.295h12.54c4.579 0 8.326 3.733 8.326 8.295v117.488c0 4.562-3.747 8.295-8.327 8.295h-12.539c-4.58 0-8.327-3.733-8.327-8.295V12.485z" | |||
| stroke="#A3B1BF" stroke-width="1.62"/> | |||
| <path | |||
| d="M273.6 15.08a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M273.6 15.08a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M273.6 24.004a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.492 0 .823-.67 1.49-1.496 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M273.6 24.004a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.492 0 .823-.67 1.49-1.496 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M273.6 32.927a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492s-.67 1.491-1.496 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M273.6 32.927a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492s-.67 1.491-1.496 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M273.6 41.851a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492 0 .823-.67 1.491-1.496 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M273.6 41.851a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492 0 .823-.67 1.491-1.496 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M273.6 50.775a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M273.6 50.775a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M272.103 58.207c0-.824.67-1.491 1.497-1.491.826 0 1.496.667 1.496 1.491 0 .824-.67 1.491-1.496 1.491a1.494 1.494 0 0 1-1.497-1.49z" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M273.6 59.698a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.491 0 .824-.67 1.491-1.496 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M259.043 15.08a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M259.043 15.08a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M259.043 24.004a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M259.043 24.004a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M259.043 32.927a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M259.043 32.927a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M259.043 41.851a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M259.043 41.851a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M259.043 50.775a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M259.043 50.775a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M259.043 59.698a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.492 1.497-1.492.826 0 1.497.667 1.497 1.491 0 .824-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M259.043 59.698a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.492 1.497-1.492.826 0 1.497.667 1.497 1.491 0 .824-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M266.321 19.136a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M266.321 19.136a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M266.321 28.06a1.494 1.494 0 0 1-1.496-1.491c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M266.321 28.06a1.494 1.494 0 0 1-1.496-1.491c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M266.321 36.984a1.494 1.494 0 0 1-1.496-1.491c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M266.321 36.984a1.494 1.494 0 0 1-1.496-1.491c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M266.321 45.907a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M266.321 45.907a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M266.321 54.83a1.494 1.494 0 0 1-1.496-1.49c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M266.321 54.83a1.494 1.494 0 0 1-1.496-1.49c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M266.321 63.755a1.494 1.494 0 0 1-1.496-1.491c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49" | |||
| fill="#FFF"/> | |||
| <path | |||
| d="M266.321 63.755a1.494 1.494 0 0 1-1.496-1.491c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M261.58 122.705c0-2.39 1.945-4.326 4.343-4.326 2.398 0 4.343 1.937 4.343 4.326 0 2.388-1.945 4.325-4.343 4.325-2.398 0-4.342-1.937-4.342-4.325z" | |||
| fill="#A3B1BF"/> | |||
| <path | |||
| d="M216.261 12.485c0-4.562 3.747-8.295 8.327-8.295h12.54c4.579 0 8.326 3.733 8.326 8.295v117.488c0 4.562-3.747 8.295-8.327 8.295h-12.539c-4.58 0-8.327-3.733-8.327-8.295V12.485z" | |||
| fill="#F0F2F5"/> | |||
| <path | |||
| d="M216.261 12.485c0-4.562 3.747-8.295 8.327-8.295h12.54c4.579 0 8.326 3.733 8.326 8.295v117.488c0 4.562-3.747 8.295-8.327 8.295h-12.539c-4.58 0-8.327-3.733-8.327-8.295V12.485z" | |||
| stroke="#A3B1BF" stroke-width="1.62"/> | |||
| <path | |||
| d="M238.017 15.08a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49"/> | |||
| <path | |||
| d="M238.017 15.08a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M238.017 24.004a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.492 0 .823-.67 1.49-1.496 1.49"/> | |||
| <path | |||
| d="M238.017 24.004a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.492 0 .823-.67 1.49-1.496 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M238.017 32.927a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492s-.67 1.491-1.496 1.491"/> | |||
| <path | |||
| d="M238.017 32.927a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492s-.67 1.491-1.496 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M238.017 41.851a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492 0 .823-.67 1.491-1.496 1.491"/> | |||
| <path | |||
| d="M238.017 41.851a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492 0 .823-.67 1.491-1.496 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M238.017 50.775a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49"/> | |||
| <path | |||
| d="M238.017 50.775a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49z" | |||
| stroke-opacity=".85" stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M238.017 59.698a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.491 0 .824-.67 1.491-1.496 1.491"/> | |||
| <path | |||
| d="M238.017 59.698a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.491 0 .824-.67 1.491-1.496 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M224.269 15.08a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49"/> | |||
| <path | |||
| d="M224.269 15.08a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M224.269 24.004a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.492 0 .823-.67 1.49-1.496 1.49"/> | |||
| <path | |||
| d="M224.269 24.004a1.494 1.494 0 0 1-1.497-1.491c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.492 0 .823-.67 1.49-1.496 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M224.269 32.927a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492s-.67 1.491-1.496 1.491"/> | |||
| <path | |||
| d="M224.269 32.927a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492s-.67 1.491-1.496 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M224.269 41.851a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492 0 .823-.67 1.491-1.496 1.491"/> | |||
| <path | |||
| d="M224.269 41.851a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.493 1.497-1.493.826 0 1.496.668 1.496 1.492 0 .823-.67 1.491-1.496 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M224.269 50.775a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49"/> | |||
| <path | |||
| d="M224.269 50.775a1.494 1.494 0 0 1-1.497-1.491c0-.824.67-1.492 1.497-1.492.826 0 1.496.668 1.496 1.492 0 .823-.67 1.49-1.496 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M224.269 59.698a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.491 0 .824-.67 1.491-1.496 1.491"/> | |||
| <path | |||
| d="M224.269 59.698a1.494 1.494 0 0 1-1.497-1.49c0-.825.67-1.492 1.497-1.492.826 0 1.496.667 1.496 1.491 0 .824-.67 1.491-1.496 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M230.738 19.136a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491"/> | |||
| <path | |||
| d="M230.738 19.136a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492 0 .823-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M230.738 28.06a1.494 1.494 0 0 1-1.496-1.491c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49"/> | |||
| <path | |||
| d="M230.738 28.06a1.494 1.494 0 0 1-1.496-1.491c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M230.738 36.984a1.494 1.494 0 0 1-1.496-1.491c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49"/> | |||
| <path | |||
| d="M230.738 36.984a1.494 1.494 0 0 1-1.496-1.491c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M230.738 45.907a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491"/> | |||
| <path | |||
| d="M230.738 45.907a1.494 1.494 0 0 1-1.496-1.49c0-.825.67-1.493 1.496-1.493.827 0 1.497.668 1.497 1.492s-.67 1.491-1.497 1.491z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M230.738 54.83a1.494 1.494 0 0 1-1.496-1.49c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49"/> | |||
| <path | |||
| d="M230.738 54.83a1.494 1.494 0 0 1-1.496-1.49c0-.824.67-1.492 1.496-1.492.827 0 1.497.668 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M230.738 63.755a1.494 1.494 0 0 1-1.496-1.491c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49"/> | |||
| <path | |||
| d="M230.738 63.755a1.494 1.494 0 0 1-1.496-1.491c0-.825.67-1.492 1.496-1.492.827 0 1.497.667 1.497 1.492 0 .823-.67 1.49-1.497 1.49z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M231.149 127.03c-2.398 0-4.342-1.937-4.342-4.325 0-2.39 1.944-4.326 4.342-4.326 2.398 0 4.342 1.937 4.342 4.326 0 2.388-1.944 4.325-4.342 4.325v-6.665" | |||
| fill="#A3B1BF"/> | |||
| <path | |||
| d="M153.138 11.025l11.888-3.975c4.342-1.452 9.086.9 10.544 5.224a17757910638.196 17757910638.196 0 0 0 37.532 111.381c1.458 4.326-.902 9.051-5.243 10.503l-11.888 3.975c-4.342 1.451-9.086-.899-10.544-5.225l-37.532-111.38c-1.458-4.325.902-9.051 5.243-10.503z" | |||
| stroke="#A3B1BF" stroke-width="1.62"/> | |||
| <path | |||
| d="M171.093 27.043a1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887 1.498 1.498 0 0 1-1.896-.939z"/> | |||
| <path | |||
| d="M171.093 27.043a1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887 1.498 1.498 0 0 1-1.896-.939z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M175.415 36.906a1.498 1.498 0 0 1-1.896-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.896.939 1.49 1.49 0 0 1-.943 1.888"/> | |||
| <path | |||
| d="M173.52 35.967a1.489 1.489 0 0 1 .942-1.888 1.498 1.498 0 0 1 1.896.939 1.49 1.49 0 0 1-.943 1.888 1.498 1.498 0 0 1-1.896-.94z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M178.65 45.018a1.498 1.498 0 0 1-1.896-.939 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887"/> | |||
| <path | |||
| d="M176.754 44.08a1.489 1.489 0 0 1 .943-1.889 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887 1.498 1.498 0 0 1-1.896-.939z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M181.076 53.942a1.498 1.498 0 0 1-1.896-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887"/> | |||
| <path | |||
| d="M181.076 53.942a1.498 1.498 0 0 1-1.896-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M184.31 62.055a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.888"/> | |||
| <path | |||
| d="M184.31 62.055a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.888z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M186.737 70.978a1.498 1.498 0 0 1-1.896-.939 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887"/> | |||
| <path | |||
| d="M186.737 70.978a1.498 1.498 0 0 1-1.896-.939 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M169.754 32.85a1.498 1.498 0 0 1-1.896-.94 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.888"/> | |||
| <path | |||
| d="M157.069 31.91a1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.888 1.498 1.498 0 0 1-1.895-.94z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M172.18 40.962a1.498 1.498 0 0 1-1.896-.94 1.489 1.489 0 0 1 .944-1.887 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.887"/> | |||
| <path | |||
| d="M161.39 40.962a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.887z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M175.415 49.886a1.498 1.498 0 0 1-1.896-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.896.939 1.49 1.49 0 0 1-.943 1.888"/> | |||
| <path | |||
| d="M164.625 49.886a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.895.939 1.49 1.49 0 0 1-.943 1.888z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M167.328 57.998a1.498 1.498 0 0 1-1.896-.939 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887"/> | |||
| <path | |||
| d="M167.328 57.998a1.498 1.498 0 0 1-1.896-.939 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M170.562 66.922a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.887"/> | |||
| <path | |||
| d="M170.562 66.922a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.887z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M173.797 75.035a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.888"/> | |||
| <path | |||
| d="M173.797 75.035a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.888z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M167.328 34.472a1.498 1.498 0 0 1-1.896-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887"/> | |||
| <path | |||
| d="M167.328 34.472a1.498 1.498 0 0 1-1.896-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M170.562 43.396a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.895.939 1.49 1.49 0 0 1-.943 1.888"/> | |||
| <path | |||
| d="M170.562 43.396a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.895.939 1.49 1.49 0 0 1-.943 1.888z" | |||
| stroke-opacity=".85" stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M172.989 51.508a1.498 1.498 0 0 1-1.896-.939 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887"/> | |||
| <path | |||
| d="M172.989 51.508a1.498 1.498 0 0 1-1.896-.939 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.887z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M176.223 60.432a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.887"/> | |||
| <path | |||
| d="M176.223 60.432a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.887z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M178.65 68.545a1.498 1.498 0 0 1-1.896-.94 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.888"/> | |||
| <path | |||
| d="M178.65 68.545a1.498 1.498 0 0 1-1.896-.94 1.489 1.489 0 0 1 .943-1.888 1.498 1.498 0 0 1 1.896.94 1.49 1.49 0 0 1-.943 1.888z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M181.884 77.468a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.887"/> | |||
| <path | |||
| d="M181.884 77.468a1.498 1.498 0 0 1-1.895-.94 1.489 1.489 0 0 1 .943-1.887 1.498 1.498 0 0 1 1.895.94 1.49 1.49 0 0 1-.943 1.887z" | |||
| stroke="#A3B1BF" stroke-width=".81"/> | |||
| <path | |||
| d="M198.567 126.807a4.347 4.347 0 0 1-5.5-2.725 4.32 4.32 0 0 1 2.736-5.477 4.346 4.346 0 0 1 5.499 2.724 4.322 4.322 0 0 1-2.735 5.478" | |||
| fill="#A3B1BF"/> | |||
| <path stroke="#A3B1BF" stroke-width=".81" | |||
| d="M193.655 2.255l2.626-1.51 2.626 1.51v3.02l-2.626 1.51-2.626-1.51z"/> | |||
| <path d="M263.204 183.163l2.626-1.51 2.626 1.51v3.02l-2.626 1.51-2.626-1.51z"/> | |||
| <path stroke="#A3B1BF" stroke-width=".81" | |||
| d="M263.204 183.163l2.626-1.51 2.626 1.51v3.02l-2.626 1.51-2.626-1.51zM201.942 33.194l2.626 1.51v3.021l-2.626 1.51-2.626-1.51v-3.02zM205.177 23.46l2.626 1.51v3.02l-2.626 1.51-2.626-1.51v-3.02z"/> | |||
| <path d="M30.71 140.675H410.8" stroke="#A3B1BF" stroke-width="2.43"/> | |||
| <path | |||
| d="M128.737 148.382h281.659s-60.248 47.052-134.245 44.212c-73.996-2.839-98.258-15.008-116.858-21.916-18.6-6.909-55.37-9.722-80.881-4.043-25.511 5.678-48.107-18.253-48.107-18.253h98.432z" | |||
| fill-opacity=".25" fill="#A3B1BF"/> | |||
| <g transform="translate(2 66.851)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="2.43" fill-opacity=".25" fill="#A3B1BF" cx="35.583" cy="35.695" | |||
| rx="35.583" ry="35.695"/> | |||
| <ellipse fill="#F0F2F5" cx="35.853" cy="35.965" rx="30.461" ry="30.557"/> | |||
| </g> | |||
| <path d="M41.627 98.896l38.817 11.357M67.91 131.751l-33.157-25.149" stroke="#A3B1BF" stroke-width=".81"/> | |||
| <g fill="#A3B1BF"> | |||
| <path | |||
| d="M70.31 119.831c-1.096 3.183.447 6.611 3.44 7.642 2.993 1.03 6.32-.721 7.416-3.904s-.448-6.61-3.44-7.641c-2.994-1.03-6.32.72-7.416 3.903m-2.422-.834c1.585-4.602 6.396-7.135 10.724-5.645 4.329 1.49 6.56 6.449 4.976 11.05-1.585 4.604-6.396 7.136-10.725 5.646-4.328-1.49-6.56-6.448-4.975-11.05l12.93 5.459" | |||
| fill-opacity=".4"/> | |||
| <path | |||
| d="M65.796 118.038c-1.93 5.602.787 11.636 6.056 13.45 5.268 1.815 11.124-1.268 13.053-6.87 1.93-5.603-.787-11.637-6.056-13.451-5.268-1.814-11.124 1.268-13.053 6.87m-2.422-.833c2.418-7.023 9.758-10.887 16.362-8.613 6.604 2.274 10.01 9.838 7.592 16.86-2.419 7.024-9.76 10.887-16.363 8.613-6.604-2.273-10.01-9.837-7.591-16.86M33.648 100.545c-.872 2.53.293 5.235 2.597 6.028 2.303.793 4.886-.62 5.758-3.151.871-2.53-.294-5.235-2.598-6.028-2.303-.793-4.886.62-5.757 3.15m-1.06-.364c1.093-3.172 4.33-4.944 7.218-3.95 2.887.995 4.348 4.384 3.256 7.556-1.092 3.173-4.33 4.944-7.218 3.95-2.887-.994-4.348-4.384-3.255-7.556"/> | |||
| <path | |||
| d="M40.45 102.82l40.58-25.097 47.72 11.062-55.428 28.205.495 1.142L40.45 102.82zm-4.505 1.928l37.263 17.098c.812.289 1.543.052 2.004-.498l1.153 2.656 55.493-28.238 1.764 40.685c.046 1.059.702 1.913 1.597 2.22.294.102.614.144.948.116 1.344-.118 2.384-1.354 2.323-2.76l-2.803-64.639 3.695 1.273-2.395 6.957c-.272.79.11 1.638.853 1.894l13.86 4.773c.364.125.768.088 1.117-.103l9.903-5.416a4.23 4.23 0 0 1 .486 2.775c-.336 2.046-2.286 5.3-9.671 9.188a1.581 1.581 0 0 0-.697 2.024c.166.37.463.629.807.747.344.119.737.098 1.096-.092 6.875-3.619 10.677-7.5 11.3-11.538.576-3.723-1.807-6.042-1.909-6.139a1.364 1.364 0 0 0-1.61-.197l-10.406 5.692-11.945-4.113 1.903-5.526 1.704.587c1.264.435 2.663-.301 3.125-1.645.463-1.343-.186-2.785-1.45-3.22l-11.528-3.97c-.766-.263-1.62-.102-2.278.43a2.71 2.71 0 0 0-.993 2.216l.767 17.692L83.325 74.53 85.42 62.11c.074-.995-.633-1.835-1.582-1.874-.947-.04-1.774.736-1.847 1.732l-2.09 12.333-44.048 27.242a1.905 1.905 0 0 0-.888 1.669c.019.676.397 1.268.98 1.536z"/> | |||
| </g> | |||
| <path | |||
| d="M122.093 124.044s-2.83 0-2.83 1.217 10.917 10.14 10.917 10.14l-8.087-11.357zM148.376 124.044s2.83 0 2.83 1.217-10.917 10.14-10.917 10.14l8.087-11.357zM116.922 128.687s-2.624 1.06-2.168 2.189c.455 1.128 13.92 5.312 13.92 5.312l-11.752-7.5zM152.029 129.517s2.624 1.063 2.17 2.191c-.455 1.129-13.91 5.3-13.91 5.3l11.74-7.491z" | |||
| fill="#A3B1BF"/> | |||
| <path | |||
| d="M76.4 50.627c-1.426-.358-6.03-1.67-6.469.81-.356 2.015 2.58 8.016 5.661 8.924 6.874 2.029 14.557-.81 21.43 1.217 6.875 2.028 6.478-1.615 5.258-2.839-2.427-2.434-22.644-7.301-25.88-8.112z" | |||
| stroke="#A3B1BF" stroke-width="2.43"/> | |||
| <g transform="translate(348.684 67.257)"> | |||
| <ellipse stroke="#A3B1BF" stroke-width="2.43" fill="#DCE1E7" cx="35.583" cy="35.695" rx="35.583" | |||
| ry="35.695"/> | |||
| <ellipse fill="#F0F2F5" cx="35.853" cy="35.965" rx="30.461" ry="30.557"/> | |||
| </g> | |||
| <path | |||
| d="M366.901 84.293c-1.334.748-2.97 2.594-4.488 6.146-4.852 11.358-3.639 21.498-3.639 21.498s1.617-19.47 8.087-23.12M402.135 122.483c1.334-.748 2.97-2.594 4.487-6.146 4.853-11.357 3.64-21.498 3.64-21.498s-1.618 19.47-8.087 23.12" | |||
| fill="#A3B1BF"/> | |||
| </g> | |||
| </svg> | |||
| </div> | |||
| <div class="ele-exception-content ele-text-left"> | |||
| <h1 class="ele-text">500</h1> | |||
| <p class="ele-text-secondary">抱歉，服务器出错了</p> | |||
| <div> | |||
| <el-button type="primary" @click="$router.push('/')">返回首页</el-button> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "Page500" | |||
| } | |||
| </script> | |||
| <style scoped> | |||
| .ele-exception { | |||
| margin: 150px 0; | |||
| } | |||
| .ele-exception .ele-exception-img svg { | |||
| max-width: 95%; | |||
| } | |||
| .ele-exception .ele-exception-img, .ele-exception .ele-exception-content { | |||
| margin: 15px 30px; | |||
| display: inline-block; | |||
| vertical-align: middle; | |||
| } | |||
| .ele-exception .ele-exception-content > h1 { | |||
| font-size: 72px; | |||
| font-weight: 600; | |||
| margin: 0 0 20px 0; | |||
| } | |||
| .ele-exception:not(.ele-exception-dark) .ele-exception-content > h1 { | |||
| color: #515A6E; | |||
| } | |||
| .ele-exception .ele-exception-content > p { | |||
| font-size: 20px; | |||
| margin: 0 0 25px 0; | |||
| } | |||
| .ele-exception:not(.ele-exception-dark) .ele-exception-content > p { | |||
| color: #808695; | |||
| } | |||
| /** 适配暗黑主题 */ | |||
| .ele-exception-dark .ele-exception-img { | |||
| opacity: .7; | |||
| } | |||
| /** 小屏幕样式 */ | |||
| @media screen and (max-width: 768px) { | |||
| .ele-exception { | |||
| margin: 40px 0; | |||
| } | |||
| .ele-exception .ele-exception-img { | |||
| margin: 0; | |||
| } | |||
| .ele-exception .ele-exception-img svg { | |||
| max-height: 200px; | |||
| } | |||
| .ele-exception .ele-exception-content { | |||
| text-align: center; | |||
| } | |||
| } | |||
| </style> | |||
+ 81
- 0
src/views/common/fragment/HeaderRight.vue
View File
| @@ -0,0 +1,81 @@ | |||
| <!-- 顶栏右侧部分 License By http://eleadmin.com --> | |||
| <template> | |||
| <el-menu mode="horizontal" :class="['ele-header-right',{'ele-menu-dark':$store.state.theme.headStyle!==0}]"> | |||
| <el-menu-item index="full" @click="fullScreen"> | |||
| <i :class="isFullScreen?'el-icon-_screen-restore':'el-icon-_screen-full'"></i> | |||
| </el-menu-item> | |||
| <el-menu-item index="notice"> | |||
| <ele-notice/><!-- 消息通知组件 --> | |||
| </el-menu-item> | |||
| <el-submenu index="user" popper-class="ele-menu-pop"> | |||
| <template slot="title"> | |||
| <el-avatar :src="user.avatar"/> | |||
| <span>{{ user.nickname || '' }}</span> | |||
| </template> | |||
| <el-menu-item index="info" @click="goUserInfo"><i class="el-icon-user"></i><span>个人中心</span></el-menu-item> | |||
| <el-menu-item index="password" @click="showPassword"><i class="el-icon-key"></i><span>修改密码</span></el-menu-item> | |||
| <el-divider/> | |||
| <el-menu-item index="logout" @click="logout"><i class="el-icon-switch-button"></i><span>退出登录</span></el-menu-item> | |||
| </el-submenu> | |||
| <el-menu-item index="more" v-if="$setting.showSetting" @click="showSetting"> | |||
| <i class="el-icon-_more"></i> | |||
| </el-menu-item> | |||
| </el-menu> | |||
| </template> | |||
| <script> | |||
| import EleNotice from './Notice' | |||
| export default { | |||
| name: "EleHeaderRight", | |||
| components: {EleNotice}, | |||
| data() { | |||
| return { | |||
| isFullScreen: false // 是否全屏 | |||
| } | |||
| }, | |||
| computed: { | |||
| user() { // 当前登录用户信息 | |||
| return this.$store.state.user.user || {}; | |||
| } | |||
| }, | |||
| methods: { | |||
| /* 退出登录 */ | |||
| logout() { | |||
| this.$confirm('确定要退出登录吗?', '提示', {type: 'warning'}).then(() => { | |||
| this.$http.get('/login/logout').then((res) => { | |||
| if (res.data.code === 0) { | |||
| this.$message({type: 'success', message: '注销成功'}); | |||
| // 清除缓存的token | |||
| this.$store.dispatch('user/setToken').then(() => { | |||
| this.$router.push({path: "/login"}); | |||
| // window.location.replace('/'); | |||
| }); | |||
| } else { | |||
| this.$message.error(res.data.msg); | |||
| } | |||
| }); | |||
| }).catch(() => 0); | |||
| }, | |||
| /* 跳转到个人中心 */ | |||
| goUserInfo() { | |||
| if (this.$route.fullPath !== '/user/info') this.$router.push('/user/info'); | |||
| }, | |||
| /* 打开修改密码弹窗 */ | |||
| showPassword() { | |||
| this.$store.dispatch('theme/toggle', 'showPassword'); | |||
| }, | |||
| /* 打开主题设置 */ | |||
| showSetting() { | |||
| this.$store.dispatch('theme/toggle', 'showSetting'); | |||
| }, | |||
| /* 全屏 */ | |||
| fullScreen() { | |||
| this.isFullScreen = !this.$util.fullScreen(); | |||
| if (!this.$setting.watchResize) this.$store.dispatch('theme/set', { | |||
| key: 'screenWidth', value: document.documentElement.clientWidth || document.body.clientWidth | |||
| }); | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
+ 253
- 0
src/views/common/fragment/Notice.vue
View File
| @@ -0,0 +1,253 @@ | |||
| <!-- 顶栏消息图标 License By http://eleadmin.com --> | |||
| <template> | |||
| <el-popover width="300" v-model="show" trigger="click" popper-class="ele-notice-pop" transition="el-zoom-in-top" | |||
| class="ele-notice-group"> | |||
| <div class="ele-notice-group" slot="reference"> | |||
| <el-badge :value="allNum" :hidden="!allNum"><i class="el-icon-bell"></i></el-badge> | |||
| </div> | |||
| <el-tabs v-if="show" v-model="active" class="user-info-tabs"> | |||
| <el-tab-pane :label="noticeLabel" name="notice"> | |||
| <div class="ele-notice-list ele-scrollbar-mini"> | |||
| <div v-for="(item,index) in notice" :key="index" class="ele-notice-item"> | |||
| <div class="ele-cell ele-notice-item-wrapper"> | |||
| <i :class="[item.icon,'ele-notice-item-icon']"></i> | |||
| <div class="ele-cell-content"> | |||
| <div class="ele-elip">{{ item.title }}</div> | |||
| <div class="ele-text-secondary ele-elip">{{ item.time }}</div> | |||
| </div> | |||
| </div> | |||
| <el-divider/> | |||
| </div> | |||
| </div> | |||
| <div v-if="notice.length" class="ele-cell ele-notice-actions"> | |||
| <div @click="clear(1)" class="ele-cell-content">清空通知</div> | |||
| <el-divider direction="vertical" class="line-color-light"/> | |||
| <div @click="more(1)" class="ele-cell-content">查看更多</div> | |||
| </div> | |||
| <ele-empty v-if="!notice.length" text="你已查看所有通知"/> | |||
| </el-tab-pane> | |||
| <el-tab-pane :label="messageLabel" name="message"> | |||
| <div class="ele-notice-list ele-scrollbar-mini"> | |||
| <div v-for="(item,index) in message" :key="index" class="ele-notice-item"> | |||
| <div class="ele-cell ele-notice-item-wrapper ele-cell-align-top"> | |||
| <el-avatar :src="item.avatar" size="medium"/> | |||
| <div class="ele-cell-content"> | |||
| <div class="ele-elip">{{ item.title }}</div> | |||
| <div class="ele-text-secondary ele-elip">{{ item.content }}</div> | |||
| <div class="ele-cell-desc ele-elip">{{ item.time }}</div> | |||
| </div> | |||
| </div> | |||
| <el-divider/> | |||
| </div> | |||
| </div> | |||
| <div v-if="message.length" class="ele-cell ele-notice-actions"> | |||
| <div @click="clear(2)" class="ele-cell-content">清空消息</div> | |||
| <el-divider direction="vertical" class="line-color-light"/> | |||
| <div @click="more(2)" class="ele-cell-content">查看更多</div> | |||
| </div> | |||
| <ele-empty v-if="!message.length" text="你已读完所有私信"/> | |||
| </el-tab-pane> | |||
| <el-tab-pane :label="todoLabel" name="todo"> | |||
| <div class="ele-notice-list ele-scrollbar-mini"> | |||
| <div v-for="(item,index) in todo" :key="index" class="ele-notice-item"> | |||
| <div class="ele-notice-item-wrapper"> | |||
| <div class="ele-cell ele-cell-align-top"> | |||
| <div class="ele-cell-content ele-elip">{{ item.title }}</div> | |||
| <el-tag size="mini" :type="['info','danger',''][item.state]"> | |||
| {{ ['未开始', '即将到期', '进行中'][item.state] }} | |||
| </el-tag> | |||
| </div> | |||
| <div class="ele-text-secondary ele-elip">{{ item.desc }}</div> | |||
| </div> | |||
| <el-divider/> | |||
| </div> | |||
| </div> | |||
| <div v-if="todo.length" class="ele-cell ele-notice-actions"> | |||
| <div @click="clear(3)" class="ele-cell-content">清空待办</div> | |||
| <el-divider direction="vertical" class="line-color-light"/> | |||
| <div @click="more(3)" class="ele-cell-content">查看更多</div> | |||
| </div> | |||
| <ele-empty v-if="!todo.length" text="你已完成所有任务"/> | |||
| </el-tab-pane> | |||
| </el-tabs> | |||
| </el-popover> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "EleNotice", | |||
| data() { | |||
| return { | |||
| show: false, | |||
| active: 'notice', | |||
| notice: [ | |||
| {icon: 'el-icon-s-comment', title: '你收到了一封14份新周报', time: '2020-07-27 18:30:18'}, | |||
| {icon: 'el-icon-s-check', title: '许经理同意了你的请假申请', time: '2020-07-27 09:08:36'}, | |||
| {icon: 'el-icon-video-camera', title: '陈总邀请你参加视频会议', time: '2020-07-26 18:30:01'}, | |||
| {icon: 'el-icon-s-claim', title: '你推荐的刘诗雨已通过第三轮面试', time: '2020-07-25 16:38:46'}, | |||
| {icon: 'el-icon-message-solid', title: '你的6月加班奖金已发放', time: '2020-07-25 11:03:31'} | |||
| ], | |||
| message: [ | |||
| { | |||
| avatar: 'https://cdn.eleadmin.com/20200609/c184eef391ae48dba87e3057e70238fb.jpg', | |||
| title: 'SunSmile 评论了你的日志', content: '写的不错, 以后多多向你学习~', time: '2020-07-27 18:30:18' | |||
| }, | |||
| { | |||
| avatar: 'https://cdn.eleadmin.com/20200609/948344a2a77c47a7a7b332fe12ff749a.jpg', | |||
| title: '刘诗雨 点赞了你的日志', content: '写的不错, 以后多多向你学习~', time: '2020-07-27 09:08:36' | |||
| }, | |||
| { | |||
| avatar: 'https://cdn.eleadmin.com/20200609/2d98970a51b34b6b859339c96b240dcd.jpg', | |||
| title: '酷酷的大叔 评论了你的周报', content: '写的不错, 以后多多向你学习~', time: '2020-07-26 18:30:01' | |||
| }, | |||
| { | |||
| avatar: 'https://cdn.eleadmin.com/20200609/f6bc05af944a4f738b54128717952107.jpg', | |||
| title: 'Jasmine 点赞了你的周报', content: '写的不错, 以后多多向你学习~', time: '2020-07-25 11:03:31' | |||
| } | |||
| ], | |||
| todo: [ | |||
| {state: 0, title: '刘诗雨的请假审批', desc: '刘诗雨在 07-27 18:30 提交的请假申请'}, | |||
| {state: 1, title: '第三方代码紧急变更', desc: '需要在 2020-07-27 之前完成'}, | |||
| {state: 2, title: '信息安全考试', desc: '需要在 2020-07-26 18:30 前完成'}, | |||
| {state: 2, title: 'EleAdmin发布新版本', desc: '需要在 2020-07-25 11:03 前完成'} | |||
| ] | |||
| } | |||
| }, | |||
| computed: { | |||
| /* 通知标题 */ | |||
| noticeLabel() { | |||
| if (this.notice.length) return `通知(${this.notice.length})`; | |||
| else return '通知'; | |||
| }, | |||
| /* 私信标题 */ | |||
| messageLabel() { | |||
| if (this.message.length) return `私信(${this.message.length})`; | |||
| else return '私信'; | |||
| }, | |||
| /* 待办标题 */ | |||
| todoLabel() { | |||
| if (this.todo.length) return `待办(${this.todo.length})`; | |||
| else return '待办'; | |||
| }, | |||
| /* 所有消息数量 */ | |||
| allNum() { | |||
| return this.notice.length + this.message.length + this.todo.length; | |||
| } | |||
| }, | |||
| methods: { | |||
| /* 清空消息 */ | |||
| clear(type) { | |||
| if (type === 1) this.notice = []; | |||
| else if (type === 2) this.message = []; | |||
| else if (type === 3) this.todo = []; | |||
| }, | |||
| /* 查看更多 */ | |||
| more(type) { | |||
| console.log(type); | |||
| if (this.$route.path !== '/user/message') this.$router.push('/user/message'); | |||
| this.show = false; | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
| <style> | |||
| /* 消息通知pop */ | |||
| .ele-notice-pop { | |||
| margin: 0 !important; | |||
| padding: 0 !important; | |||
| } | |||
| .ele-notice-group { | |||
| vertical-align: top !important; | |||
| display: inline-block; | |||
| } | |||
| .ele-notice-group .el-badge { | |||
| line-height: normal; | |||
| } | |||
| /* tab */ | |||
| .ele-notice-pop .el-tabs__nav-scroll { | |||
| text-align: center; | |||
| } | |||
| .ele-notice-pop .el-tabs__nav { | |||
| float: none; | |||
| display: inline-block; | |||
| } | |||
| .ele-notice-pop .el-tabs__item { | |||
| padding: 0 20px; | |||
| } | |||
| /* 列表 */ | |||
| .ele-notice-list { | |||
| padding-top: 8px; | |||
| max-height: 360px; | |||
| overflow: auto; | |||
| } | |||
| .ele-notice-item .ele-notice-item-wrapper { | |||
| padding: 12px 15px; | |||
| transition: background-color .2s; | |||
| cursor: pointer; | |||
| } | |||
| .ele-notice-item .ele-notice-item-wrapper:hover { | |||
| background-color: hsla(0, 0%, 60%, .05); | |||
| } | |||
| .ele-notice-item .ele-text-secondary { | |||
| margin-top: 5px; | |||
| font-size: 13px; | |||
| } | |||
| .ele-notice-item .ele-cell-desc { | |||
| margin-top: 3px !important; | |||
| font-size: 12px !important; | |||
| } | |||
| .ele-notice-item-icon { | |||
| width: 32px; | |||
| height: 32px; | |||
| line-height: 32px !important; | |||
| color: #FFF; | |||
| font-size: 16px; | |||
| background-color: #60B2FC; | |||
| border-radius: 50%; | |||
| text-align: center; | |||
| } | |||
| .ele-notice-item-icon.el-icon-s-check { | |||
| background-color: #F5686F; | |||
| } | |||
| .ele-notice-item-icon.el-icon-video-camera { | |||
| background-color: #7CD734; | |||
| } | |||
| .ele-notice-item-icon.el-icon-s-claim { | |||
| background-color: #FAAD14; | |||
| } | |||
| .ele-notice-item-icon.el-icon-message-solid { | |||
| background-color: #2BCACD; | |||
| } | |||
| /* 操作按钮 */ | |||
| .ele-notice-actions > .ele-cell-content { | |||
| line-height: 42px; | |||
| text-align: center; | |||
| cursor: pointer; | |||
| } | |||
| .ele-notice-actions > .ele-cell-content:hover { | |||
| background-color: hsla(0, 0%, 60%, .05); | |||
| } | |||
| /* 空视图 */ | |||
| .ele-notice-pop .ele-empty { | |||
| padding: 100px 0; | |||
| } | |||
| </style> | |||
+ 97
- 0
src/views/common/fragment/Password.vue
View File
| @@ -0,0 +1,97 @@ | |||
| <!-- 修改密码弹窗 --> | |||
| <template> | |||
| <el-dialog title="修改密码" :visible.sync="showPassword" width="400px" @closed="onClose" | |||
| :append-to-body="true" :lock-scroll="false"> | |||
| <el-form :model="form" ref="pswForm" :rules="rules" label-width="82px" @keyup.enter.native="save"> | |||
| <el-form-item label="旧密码:" prop="oldPassword"> | |||
| <el-input v-model="form.oldPassword" placeholder="请输入旧密码" show-password/> | |||
| </el-form-item> | |||
| <el-form-item label="新密码:" prop="password"> | |||
| <el-input v-model="form.password" placeholder="请输入新密码" show-password/> | |||
| </el-form-item> | |||
| <el-form-item label="确认密码:" prop="configmPassword"> | |||
| <el-input v-model="form.configmPassword" placeholder="请再次输入新密码" show-password/> | |||
| </el-form-item> | |||
| </el-form> | |||
| <div slot="footer"> | |||
| <el-button @click="cancel">取消</el-button> | |||
| <el-button type="primary" @click="save">确定</el-button> | |||
| </div> | |||
| </el-dialog> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| name: "ElePassword", | |||
| data() { | |||
| let password2Rule = (rule, value, callback) => { | |||
| if (!value) { | |||
| callback(new Error('请再次输入新密码')); | |||
| } else if (value !== this.form.password) { | |||
| callback(new Error('两次输入密码不一致')); | |||
| } else { | |||
| callback(); | |||
| } | |||
| }; | |||
| return { | |||
| form: {}, // 表单数据 | |||
| rules: { // 表单验证 | |||
| oldPassword: [ | |||
| {required: true, message: '请输入旧密码', trigger: 'blur'} | |||
| ], | |||
| password: [ | |||
| {required: true, message: '请输入新密码', trigger: 'blur'} | |||
| ], | |||
| configmPassword: [ | |||
| {validator: password2Rule, trigger: 'blur'} | |||
| ] | |||
| }, | |||
| loading: false // 按钮loading | |||
| } | |||
| }, | |||
| computed: { | |||
| showPassword: { | |||
| get() { | |||
| return this.$store.state.theme.showPassword; | |||
| }, | |||
| set(val) { | |||
| this.$store.dispatch('theme/set', {key: 'showPassword', value: val}); | |||
| } | |||
| } | |||
| }, | |||
| methods: { | |||
| /* 修改密码 */ | |||
| save() { | |||
| this.$refs['pswForm'].validate((valid) => { | |||
| if (valid) { | |||
| this.loading = true; | |||
| this.$http.put('/index/updatePwd', {oldPassword: this.form.oldPassword, newPassword: this.form.password}).then(res => { | |||
| this.loading = false; | |||
| if (res.data.code === 0) { | |||
| this.$message({type: 'success', message: res.data.msg}); | |||
| this.cancel(); | |||
| } else { | |||
| this.$message.error(res.data.msg); | |||
| } | |||
| }).catch(e => { | |||
| this.loading = false; | |||
| this.$message.error(e.message); | |||
| }); | |||
| } else { | |||
| return false; | |||
| } | |||
| }); | |||
| }, | |||
| /* 取消 */ | |||
| cancel() { | |||
| this.$store.dispatch('theme/toggle', 'showPassword'); | |||
| }, | |||
| /* 关闭回调 */ | |||
| onClose() { | |||
| this.form = {}; | |||
| this.loading = false; | |||
| this.$refs['pswForm'].resetFields(); | |||
| } | |||
| } | |||
| } | |||
| </script> | |||
+ 0
- 0
src/views/common/fragment/Setting.vue
View File
Some files were not shown because too many files changed in this diff
Loading…