From e65f37b5b59954de3c3efcf953ebd2c7cc07826b Mon Sep 17 00:00:00 2001 From: zhangyu Date: Thu, 16 Jun 2022 15:58:17 +0800 Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E5=A4=84=E7=90=86=E4=B8=AD?= =?UTF-8?q?=E8=8B=B1=E6=96=87=E5=AE=8C=E5=85=A8=E4=B8=80=E6=A0=B7=E7=9A=84?= =?UTF-8?q?=E5=9B=BD=E9=99=85=E5=8C=96=E4=B8=BA=E4=B8=80=E4=B8=AA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- nezha-fronted/README.md | 8 +- nezha-fronted/build/webpack.dev.conf.js | 5 +- nezha-fronted/build/webpack.prod.conf.js | 6 + nezha-fronted/package-lock.json | 10 + nezha-fronted/package.json | 2 + .../css/components/introjs/introjs-dark.scss | 243 ++++++++++++++++++ .../css/components/introjs/introjs.scss | 2 + nezha-fronted/src/assets/css/index.scss | 3 + .../components/chart/chart/chart-table.vue | 16 +- .../chart/chart/line-chart-block.vue | 4 +- .../src/components/chart/chartDetail.vue | 12 +- .../src/components/chart/chartHeader.vue | 4 +- nezha-fronted/src/components/cli/webSSH.vue | 16 +- .../common/ChartDiagram/diagram.vue | 6 +- .../components/common/alert/alertLabel.vue | 16 +- .../components/common/alert/alertLabel2.vue | 16 +- .../components/common/alert/alertLabel3.vue | 16 +- .../common/alert/alertMessageInfoDetail.vue | 2 +- .../components/common/alert/alertRuleInfo.vue | 6 +- .../common/alert/alertRuleInfo2.vue | 6 +- .../components/common/bottomBox/bottomBox.vue | 14 +- .../common/bottomBox/tabs/IpDetails.vue | 2 +- .../common/bottomBox/tabs/alertMessageTab.vue | 14 +- .../bottomBox/tabs/alertMessageTabNew.vue | 2 +- .../common/bottomBox/tabs/assetSubTab.vue | 2 +- .../common/bottomBox/tabs/assetTab.vue | 2 +- .../bottomBox/tabs/endpointQueryTab.vue | 4 +- .../common/bottomBox/tabs/endpointTab.vue | 20 +- .../common/bottomBox/tabs/operationLogTab.vue | 4 +- .../bottomBox/tabs/terminalLogMonitorTab.vue | 2 +- .../common/bottomBox/tabs/terminalLogTab.vue | 6 +- .../common/detailView/detailViewTopSearch.vue | 4 +- .../list/alertRule/alertRuleDetail.vue | 2 +- .../detailView/list/asset/assetDetail.vue | 8 +- .../common/detailView/list/dc/dcDetail.vue | 8 +- .../list/endpoint/endpointDetail.vue | 10 +- .../detailView/list/module/moduleDetail.vue | 4 +- .../terminalLogDetail/terminalLogDetail.vue | 12 +- .../detailView/list/userDetail/userDetail.vue | 10 +- .../detailView/view/detailViewRight.vue | 14 +- .../src/components/common/elementSet.vue | 2 +- .../common/globalSearch/searchItemInfo.vue | 24 +- .../src/components/common/js/constants.js | 20 +- nezha-fronted/src/components/common/login.vue | 2 +- .../common/mixin/system/systemMixin.js | 4 +- .../common/project/L5/CanvasContextMenu.vue | 2 +- .../common/project/L5/CanvasProps.vue | 16 +- .../common/project/popData/Main.vue | 8 +- .../common/project/popData/alertTable.vue | 4 +- .../common/project/popData/assetTable.vue | 2 +- .../common/project/popData/endpointTable.vue | 8 +- .../components/common/project/topologyL5.vue | 6 +- .../common/rightBox/addEndpointBox.vue | 16 +- .../rightBox/administration/assetTypeBox.vue | 2 +- .../rightBox/administration/backupsBox.vue | 2 +- .../rightBox/administration/modelBox.vue | 10 +- .../rightBox/administration/roleBox.vue | 6 +- .../rightBox/administration/userBox.vue | 20 +- .../components/common/rightBox/agentBox.vue | 6 +- .../common/rightBox/alertRuleBox.vue | 10 +- .../common/rightBox/alertSilenceBox.vue | 8 +- .../components/common/rightBox/apiKeyBox.vue | 2 +- .../rightBox/asset/assetBatchEditBox.vue | 16 +- .../common/rightBox/asset/assetBox.vue | 16 +- .../common/rightBox/assetMetaBox.vue | 12 +- .../common/rightBox/assetStateBox.vue | 2 +- .../common/rightBox/batchAddEndpoint.vue | 14 +- .../common/rightBox/batchEditEndpoint.vue | 2 +- .../common/rightBox/batchModifyEndpoint.vue | 10 +- .../components/common/rightBox/cabinetBox.vue | 2 +- .../common/rightBox/chart/chartConfig.vue | 8 +- .../common/rightBox/chart/chartRightBox.vue | 4 +- .../rightBox/chart/otherChartConfig.vue | 6 +- .../common/rightBox/chart/publicConfig.js | 2 +- .../rightBox/chart/systemChartConfig.vue | 8 +- .../common/rightBox/chartTempBox.vue | 8 +- .../src/components/common/rightBox/dcBox.vue | 6 +- .../common/rightBox/editEndpointBoxNew.vue | 48 ++-- .../common/rightBox/exprTmplBox.vue | 2 +- .../components/common/rightBox/menuBox.vue | 4 +- .../src/components/common/rightBox/mibBox.vue | 4 +- .../components/common/rightBox/moduleBox.vue | 42 +-- .../components/common/rightBox/profileBox.vue | 4 +- .../components/common/rightBox/projectBox.vue | 2 +- .../common/rightBox/setting/cabinetBox.vue | 2 +- .../rightBox/setting/globalizationBox.vue | 2 +- .../common/rightBox/snmpCredentialBox.vue | 8 +- .../trafficSetting/trafficSettingBox.vue | 2 +- .../trafficSetting/trafficSettingTab.vue | 6 +- .../src/components/common/searchInput.vue | 2 +- .../components/common/searchSelectInfo.vue | 18 +- .../common/table/alert/alertMessageTable.vue | 6 +- .../table/alert/alertRuleEvalLogTable.vue | 4 +- .../common/table/alert/alertRuleTable.vue | 2 +- .../common/table/alert/alertSilenceTable.vue | 8 +- .../common/table/asset/assetMetaTable.vue | 10 +- .../common/table/asset/assetTable.vue | 12 +- .../common/table/settings/agentTable.vue | 10 +- .../common/table/settings/assetTypeTable.vue | 2 +- .../common/table/settings/cabinetTable.vue | 4 +- .../common/table/settings/chartTmplTable.vue | 6 +- .../table/settings/credentialsTable.vue | 2 +- .../common/table/settings/dcTable.vue | 8 +- .../common/table/settings/endpointTable.vue | 14 +- .../common/table/settings/exprTmplTable.vue | 2 +- .../table/settings/globalizationTable.vue | 2 +- .../common/table/settings/ipDetailsTable.vue | 2 +- .../common/table/settings/menuTable.vue | 4 +- .../common/table/settings/mibTable.vue | 6 +- .../common/table/settings/modelTable.vue | 4 +- .../common/table/settings/moduleTable.vue | 4 +- .../table/settings/operationLogTable.vue | 6 +- .../common/table/settings/projectTable.vue | 4 +- .../common/table/settings/roleTable.vue | 2 +- .../table/settings/scrapeEndpointTable.vue | 6 +- .../table/settings/terminalLogTable.vue | 14 +- .../common/table/settings/userTable.vue | 12 +- .../common/table/special/endpointQueryTab.vue | 4 +- .../components/page/alert/alertMessage.vue | 10 +- .../src/components/page/alert/alertRule.vue | 2 +- .../src/components/page/asset/asset.vue | 6 +- .../page/asset/components/assetTagEx.vue | 12 +- .../src/components/page/config/agent.vue | 14 +- .../src/components/page/config/assetMeta.vue | 6 +- .../src/components/page/config/assetState.vue | 4 +- .../src/components/page/config/backups.vue | 6 +- .../src/components/page/config/basic.vue | 2 +- .../src/components/page/config/dc.vue | 4 +- .../src/components/page/config/email.vue | 6 +- .../components/page/config/globalization.vue | 37 +++ .../src/components/page/config/ldap.vue | 6 +- .../src/components/page/config/menus.vue | 6 +- .../src/components/page/config/monitor.vue | 18 +- .../components/page/config/operationLog.vue | 4 +- .../page/config/operationRecord.vue | 4 +- .../src/components/page/config/profile.vue | 4 +- .../page/config/profileChangePin.vue | 2 +- .../src/components/page/config/roles.vue | 2 +- .../src/components/page/config/setup.vue | 24 +- .../src/components/page/config/system.vue | 54 ++-- .../page/config/system/apiKeyTable.vue | 2 +- .../components/page/config/system/license.vue | 6 +- .../components/page/config/system/linkTab.vue | 2 +- .../page/config/system/notifyMethodTable.vue | 2 +- .../page/config/template/exprTemp.vue | 2 +- .../src/components/page/config/terminal.vue | 6 +- .../components/page/config/terminalLog.vue | 6 +- .../page/dashboard/alertChartParam.vue | 6 +- .../page/dashboard/explore/exploreItem.vue | 2 +- .../page/dashboard/overview/overview.vue | 16 +- .../page/dashboard/overview/overview2.vue | 30 +-- .../page/monitor/endpoint/endpointList.vue | 2 +- .../page/monitor/module/moduleList.vue | 2 +- .../page/monitor/project/project.vue | 18 +- .../src/components/page/tool/ping.vue | 4 +- .../src/components/page/tool/trace.vue | 4 +- nezha-fronted/src/entrance/app/lodashInfo.md | 59 +++++ nezha-fronted/src/entrance/app/main.js | 241 ++++++++++++++++- .../src/entrance/exportHtml/i18nData.js | 5 +- 159 files changed, 1194 insertions(+), 599 deletions(-) create mode 100644 nezha-fronted/src/assets/css/components/introjs/introjs-dark.scss create mode 100644 nezha-fronted/src/assets/css/components/introjs/introjs.scss create mode 100644 nezha-fronted/src/entrance/app/lodashInfo.md diff --git a/nezha-fronted/README.md b/nezha-fronted/README.md index 0f5e6f863..ec5e1e90a 100644 --- a/nezha-fronted/README.md +++ b/nezha-fronted/README.md @@ -20,19 +20,19 @@ npm run build --report For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader). -#启动项目 +# 启动项目 需要配置 config.json 为 {"baseUrl":"http://192.168.40.42:8080/", "version": "21.04"} -#自动化测试 +# 自动化测试 npm run unit 根目录下 /test/jest.conf.js collectCoverageFrom 变量配置需要测试报告的文件 （因为暂时不测所有 只能一个个引入） specs 配置对应的测试用例 （https://docs.geedge.net/pages/viewpage.action?pageId=58310079 参考匹配器） -#思维导图 +# 思维导图 https://docs.geedge.net/pages/viewpage.action?pageId=67209306 -#配置多入口 +# 配置多入口 dev 正常启动 dev:html 导出为html diff --git a/nezha-fronted/build/webpack.dev.conf.js b/nezha-fronted/build/webpack.dev.conf.js index d182f51f0..ed7f7cd31 100644 --- a/nezha-fronted/build/webpack.dev.conf.js +++ b/nezha-fronted/build/webpack.dev.conf.js @@ -9,7 +9,7 @@ const CopyWebpackPlugin = require('copy-webpack-plugin') const HtmlWebpackPlugin = require('html-webpack-plugin') const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') const portfinder = require('portfinder') - +const intro = require('intro.js') const HOST = process.env.HOST const PORT = process.env.PORT && Number(process.env.PORT) const devStart = process.env.npm_lifecycle_event @@ -49,6 +49,9 @@ devWebpackConfig = merge(baseWebpackConfig, { } }, plugins: [ + new webpack.ProvidePlugin({ + introJs: ['intro.js'] + }), new webpack.DefinePlugin({ 'process.env': require('../config/dev.env') }), diff --git a/nezha-fronted/build/webpack.prod.conf.js b/nezha-fronted/build/webpack.prod.conf.js index b2cbbdf0b..94d49d4fc 100644 --- a/nezha-fronted/build/webpack.prod.conf.js +++ b/nezha-fronted/build/webpack.prod.conf.js @@ -49,6 +49,9 @@ if (arg === 'html') { chunkFilename: utils.assetsPath('js/[name].[chunkhash].js') }, plugins: [ + new webpack.ProvidePlugin({ + introJs: ['intro.js'], + }), /* new GenerateAssetPlugin({ filename: 'config.json', fn: (compilation, cb) => { @@ -198,6 +201,9 @@ if (arg === 'html') { extraFiles: [] }), */ // http://vuejs.github.io/vue-loader/en/workflow/production.html + new webpack.ProvidePlugin({ + introJs: ['intro.js'] + }), new webpack.DefinePlugin({ 'process.env': env }), diff --git a/nezha-fronted/package-lock.json b/nezha-fronted/package-lock.json index 140a0d4bc..72d7a2fd9 100644 --- a/nezha-fronted/package-lock.json +++ b/nezha-fronted/package-lock.json @@ -9097,6 +9097,11 @@ "p-is-promise": "^1.1.0" } }, + "intro.js": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/intro.js/-/intro.js-5.1.0.tgz", + "integrity": "sha512-zwWl/duTh00eeNcZRU4o4/xxloNYPFKs4n4lMRDNx59jZr+qRI0jSOnzqYMOuVftD4beGrmxBHz4k8qp9/dCMA==" + }, "invariant": { "version": "2.2.4", "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", @@ -18584,6 +18589,11 @@ "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.15.1.tgz", "integrity": "sha512-GBbz8qYCu0U2LNu4IcuFLZiuyninG4k26knvhL7GZG5Ncp4RR2VKDEH6g8gQ6I+UUBCvH2MBQVPSdxWe4DBkPw==" }, + "vue-introjs": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/vue-introjs/-/vue-introjs-1.3.2.tgz", + "integrity": "sha512-Bj27iGimO6VKr/Ngxs5hr/Fh8ONSHmvTUj2gh1f5CGZC5vfF1Vb5VyetjXiDdMXhLsqeGSIhac6SbVNHwUh9yQ==" + }, "vue-jest": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/vue-jest/-/vue-jest-1.4.0.tgz", diff --git a/nezha-fronted/package.json b/nezha-fronted/package.json index 1b34ace32..f4584448f 100644 --- a/nezha-fronted/package.json +++ b/nezha-fronted/package.json @@ -43,6 +43,7 @@ "file-saver": "^2.0.2", "html-webpack-inline-source-plugin": "0.0.10", "html2canvas": "^1.4.1", + "intro.js": "^5.1.0", "jspdf": "^2.5.1", "jszip": "^3.9.1", "leaflet": "^1.7.1", @@ -60,6 +61,7 @@ "vue-draggable-resizable": "^2.3.0", "vue-grid-layout": "^2.3.12", "vue-i18n": "^8.15.1", + "vue-introjs": "^1.3.2", "vue-quill-editor": "^3.0.6", "vue-resource": "^1.5.1", "vue-router": "^3.0.1", diff --git a/nezha-fronted/src/assets/css/components/introjs/introjs-dark.scss b/nezha-fronted/src/assets/css/components/introjs/introjs-dark.scss new file mode 100644 index 000000000..c834b5d91 --- /dev/null +++ b/nezha-fronted/src/assets/css/components/introjs/introjs-dark.scss @@ -0,0 +1,243 @@ +/* +Dark theme for IntroJs +By: Khashayar Pourdeilami (http://kpourdeilami.github.io) +for: IntroJs (https://github.com/usablica/intro.js) +*/ +.introjs-overlay { + position: absolute; + z-index: 999999; + background:#fff; + -webkit-transition: all 0.3s ease-out; + -moz-transition: all 0.3s ease-out; + -ms-transition: all 0.3s ease-out; + -o-transition: all 0.3s ease-out; + transition: all 0.3s ease-out; +} + +.introjs-fixParent { + z-index: auto !important; + opacity: 1.0 !important; +} + +.introjs-showElement, +tr.introjs-showElement > td, +tr.introjs-showElement > th { + z-index: 9999999 !important; +} + +.introjs-relativePosition, +tr.introjs-showElement > td, +tr.introjs-showElement > th { + position: relative; +} + +.introjs-helperLayer { + position: absolute; + z-index: 9999998; + background:#656D78; + -webkit-transition: all 0.3s ease-out; + -moz-transition: all 0.3s ease-out; + -ms-transition: all 0.3s ease-out; + -o-transition: all 0.3s ease-out; + transition: all 0.3s ease-out; +} + +.introjs-helperNumberLayer { + position: absolute; + + z-index: 9999999999 !important; + padding: 10px; + font-family: Arial, verdana, tahoma; + font-size: 13px; + top:-40px; + font-weight: bold; + color: white; + text-align: center; + background:#434A54; + width: 20px; + height:20px; + line-height: 20px; +} + +.introjs-arrow { + border: 5px solid #434A54; + content:''; + position: absolute; +} +.introjs-arrow.top { + top: -10px; + border-top-color:transparent; + border-right-color:transparent; + border-bottom-color:#434A54; + border-left-color:transparent; +} +.introjs-arrow.top-right { + top: -10px; + right: 10px; + border-top-color:transparent; + border-right-color:transparent; + border-bottom-color:#434A54; + border-left-color:transparent; +} +.introjs-arrow.top-middle { + top: -10px; + left: 50%; + margin-left: -5px; + border-top-color:transparent; + border-right-color:transparent; + border-bottom-color:#434A54; + border-left-color:transparent; +} +.introjs-arrow.right { + right: -10px; + top: 10px; + border-top-color:transparent; + border-right-color:transparent; + border-bottom-color:transparent; + border-left-color:#434A54; +} +.introjs-arrow.bottom { + bottom: -10px; + border-top-color:#434A54; + border-right-color:transparent; + border-bottom-color:transparent; + border-left-color:transparent; +} +.introjs-arrow.left { + left: -10px; + top: 10px; + border-top-color:transparent; + border-right-color:#434A54; + border-bottom-color:transparent; + border-left-color:transparent; +} + +.introjs-tooltip { + position: absolute; + padding: 10px; + background-color: #434A54; + min-width: 200px; + padding-top:30px; + + max-width: 300px; + color:#fff; + -webkit-transition: opacity 0.1s ease-out; + -moz-transition: opacity 0.1s ease-out; + -ms-transition: opacity 0.1s ease-out; + -o-transition: opacity 0.1s ease-out; + transition: opacity 0.1s ease-out; +} + +.introjs-tooltipbuttons { + text-align: right; + position:relative; + bottom:-44px; + margin-left:-10px; + margin-right:-10px; + padding:5px; + background:#656D78; +} + +/* + Buttons style by http://nicolasgallagher.com/lab/css3-github-buttons/ + Changed by Afshin Mehrabani + Further modified by: Khashayar P. +*/ +.introjs-button { + position: relative; + overflow: visible; + display: inline-block; + padding: 0.3em 0.8em; + border: 2px solid #fff; + margin: 0; + text-decoration: none; + font: 11px/normal sans-serif; + color: #fff !important; + white-space: nowrap; + cursor: pointer; + outline: none; + -webkit-background-clip: padding; + -moz-background-clip: padding; + -o-background-clip: padding-box; + /*background-clip: padding-box;*/ /* commented out due to Opera 11.10 bug */ + /* IE hacks */ + zoom: 1; + *display: inline; + margin-top: 10px; +} + +.introjs-button:hover { + text-decoration: none; + color:#434A54 !important; + background:#fff; +} + +.introjs-button:focus, +.introjs-button:active { + background:#fff !important; + color:#434A54 !important; +} + +/* overrides extra padding on button elements in Firefox */ +.introjs-button::-moz-focus-inner { + padding: 0; + border: 0; +} + +.introjs-skipbutton { + margin-right: 5px; + color: #fff; +} + +.introjs-prevbutton { + + border-right: none; +} + + +.introjs-disabled, .introjs-disabled:hover, .introjs-disabled:focus { + color: #fff; + box-shadow: none; + cursor: default; + background:transparent; + border-color:transparent; +} + +.introjs-bullets { + text-align: center; + display:none; +} +.introjs-bullets ul { + clear: both; + margin: 15px auto 0; + padding: 0; + display: inline-block; +} +.introjs-bullets ul li { + list-style: none; + float: left; + margin: 0 2px; +} +.introjs-bullets ul li a { + display: block; + width: 8px; + height: 8px; + background: rgba(255,255,255,0.1); + border-radius: 10px; + -moz-border-radius: 10px; + -webkit-border-radius: 10px; + text-decoration: none; +} +.introjs-bullets ul li a:hover { + background: rgba(255,255,255,0.2); +} +.introjs-bullets ul li a.active { + background: rgba(255,255,255,0.2); +} +.introjsFloatingElement { + position: absolute; + height: 0; + width: 0; + left: 50%; + top: 50%; +} diff --git a/nezha-fronted/src/assets/css/components/introjs/introjs.scss b/nezha-fronted/src/assets/css/components/introjs/introjs.scss new file mode 100644 index 000000000..0f0bd4ec2 --- /dev/null +++ b/nezha-fronted/src/assets/css/components/introjs/introjs.scss @@ -0,0 +1,2 @@ +.introjs-overlay{position:absolute;-webkit-box-sizing:content-box;box-sizing:content-box;z-index:999999;opacity:0;-webkit-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out}.introjs-showElement{z-index:9999999!important}tr.introjs-showElement>td{z-index:9999999!important;position:relative}tr.introjs-showElement>th{z-index:9999999!important;position:relative}.introjs-disableInteraction{z-index:99999999!important;position:absolute;background-color:#fff;opacity:0}.introjs-relativePosition{position:relative}.introjs-helperLayer{-webkit-box-sizing:content-box;box-sizing:content-box;position:absolute;z-index:9999998;border-radius:4px;-webkit-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out}.introjs-helperLayer *{-webkit-box-sizing:content-box;box-sizing:content-box}.introjs-helperLayer :before{-webkit-box-sizing:content-box;box-sizing:content-box}.introjs-helperLayer :after{-webkit-box-sizing:content-box;box-sizing:content-box}.introjs-tooltipReferenceLayer{font-family:"Helvetica Neue",Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif;-webkit-box-sizing:content-box;box-sizing:content-box;position:absolute;visibility:hidden;z-index:100000000;background-color:transparent;-webkit-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out}.introjs-tooltipReferenceLayer *{font-family:"Helvetica Neue",Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif}.introjs-helperNumberLayer{font-family:"Helvetica Neue",Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif;color:#9e9e9e;text-align:center;padding-top:10px;padding-bottom:10px}.introjs-arrow{border:5px solid transparent;content:"";position:absolute}.introjs-arrow.top{top:-10px;left:10px;border-bottom-color:#fff}.introjs-arrow.top-right{top:-10px;right:10px;border-bottom-color:#fff}.introjs-arrow.top-middle{top:-10px;left:50%;margin-left:-5px;border-bottom-color:#fff}.introjs-arrow.right{right:-10px;top:10px;border-left-color:#fff}.introjs-arrow.right-bottom{bottom:10px;right:-10px;border-left-color:#fff}.introjs-arrow.bottom{bottom:-10px;left:10px;border-top-color:#fff}.introjs-arrow.bottom-right{bottom:-10px;right:10px;border-top-color:#fff}.introjs-arrow.bottom-middle{bottom:-10px;left:50%;margin-left:-5px;border-top-color:#fff}.introjs-arrow.left{left:-10px;top:10px;border-right-color:#fff}.introjs-arrow.left-bottom{left:-10px;bottom:10px;border-right-color:#fff}.introjs-tooltip{-webkit-box-sizing:content-box;box-sizing:content-box;position:absolute;visibility:visible;background-color:#fff;min-width:250px;max-width:300px;border-radius:5px;-webkit-box-shadow:0 3px 30px rgba(33,33,33,.3);box-shadow:0 3px 30px rgba(33,33,33,.3);-webkit-transition:opacity .1s ease-out;-o-transition:opacity .1s ease-out;transition:opacity .1s ease-out}.introjs-tooltiptext{padding:20px}.introjs-dontShowAgain{padding-left:20px;padding-right:20px}.introjs-dontShowAgain input{padding:0;margin:0;margin-bottom:2px;display:inline;width:10px;height:10px}.introjs-dontShowAgain label{font-size:14px;display:inline-block;font-weight:400;display:inline-block;margin:0 0 0 5px;padding:0;background-color:#fff;color:#616161;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.introjs-tooltip-title{font-size:18px;margin:0;padding:0;font-weight:700;float:left;line-height:32px}.introjs-tooltip-header{padding-left:20px;padding-right:20px;padding-top:10px}.introjs-tooltip-header:after{content:".";visibility:hidden;display:block;height:0;clear:both}.introjs-tooltipbuttons{border-top:1px solid #e0e0e0;padding:10px;text-align:right;white-space:nowrap}.introjs-tooltipbuttons:after{content:"";visibility:hidden;display:block;height:0;clear:both}.introjs-button{-webkit-box-sizing:content-box;box-sizing:content-box;position:relative;overflow:visible;display:inline-block;padding:.5rem 1rem;border:1px solid #bdbdbd;text-decoration:none;text-shadow:1px 1px 0 #fff;font-size:14px;color:#424242;white-space:nowrap;cursor:pointer;outline:0;background-color:#f4f4f4;border-radius:.2em;zoom:1;display:inline}.introjs-button:hover{outline:0;text-decoration:none;border-color:#9e9e9e;background-color:#e0e0e0;color:#212121}.introjs-button:focus{outline:0;text-decoration:none;background-color:#eee;-webkit-box-shadow:0 0 0 .2rem rgba(158,158,158,.5);box-shadow:0 0 0 .2rem rgba(158,158,158,.5);border:1px solid #616161;color:#212121}.introjs-button:active{outline:0;text-decoration:none;background-color:#e0e0e0;border-color:#9e9e9e;color:#212121}.introjs-button::-moz-focus-inner{padding:0;border:0}.introjs-skipbutton{-webkit-box-sizing:content-box;box-sizing:content-box;color:#616161;float:right;font-size:20px;cursor:pointer;font-weight:700;line-height:1;text-align:center;padding:7px 10px}.introjs-skipbutton:focus,.introjs-skipbutton:hover{color:#212121;outline:0;text-decoration:none}.introjs-prevbutton{float:left}.introjs-nextbutton{float:right}.introjs-disabled{color:#9e9e9e;border-color:#bdbdbd;-webkit-box-shadow:none;box-shadow:none;cursor:default;background-color:#f4f4f4;background-image:none;text-decoration:none}.introjs-disabled:focus,.introjs-disabled:hover{color:#9e9e9e;border-color:#bdbdbd;-webkit-box-shadow:none;box-shadow:none;cursor:default;background-color:#f4f4f4;background-image:none;text-decoration:none}.introjs-hidden{display:none}.introjs-bullets{text-align:center;padding-top:10px;padding-bottom:10px}.introjs-bullets ul{-webkit-box-sizing:content-box;box-sizing:content-box;clear:both;margin:0 auto 0;padding:0;display:inline-block}.introjs-bullets ul li{-webkit-box-sizing:content-box;box-sizing:content-box;list-style:none;float:left;margin:0 2px}.introjs-bullets ul li a{-webkit-transition:width .1s ease-in;-o-transition:width .1s ease-in;transition:width .1s ease-in;-webkit-box-sizing:content-box;box-sizing:content-box;display:block;width:6px;height:6px;background:#ccc;border-radius:10px;text-decoration:none;cursor:pointer}.introjs-bullets ul li a:focus,.introjs-bullets ul li a:hover{width:15px;background:#999;text-decoration:none;outline:0}.introjs-bullets ul li a.active{width:15px;background:#999}.introjs-progress{-webkit-box-sizing:content-box;box-sizing:content-box;overflow:hidden;height:10px;margin:10px;border-radius:4px;background-color:#e0e0e0}.introjs-progressbar{-webkit-box-sizing:content-box;box-sizing:content-box;float:left;width:0%;height:100%;font-size:10px;line-height:10px;text-align:center;background-color:#08c}.introjsFloatingElement{position:absolute;height:0;width:0;left:50%;top:50%}.introjs-fixedTooltip{position:fixed}.introjs-hint{-webkit-box-sizing:content-box;box-sizing:content-box;position:absolute;background:0 0;width:20px;height:15px;cursor:pointer}.introjs-hint:focus{border:0;outline:0}.introjs-hint:hover>.introjs-hint-pulse{background-color:rgba(60,60,60,.57)}.introjs-hidehint{display:none}.introjs-fixedhint{position:fixed}@-webkit-keyframes introjspulse{0%{-webkit-transform:scale(.95);transform:scale(.95);-webkit-box-shadow:0 0 0 0 rgba(0,0,0,.7);box-shadow:0 0 0 0 rgba(0,0,0,.7)}70%{-webkit-transform:scale(1);transform:scale(1);-webkit-box-shadow:0 0 0 10px transparent;box-shadow:0 0 0 10px transparent}100%{-webkit-transform:scale(.95);transform:scale(.95);-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}}@keyframes introjspulse{0%{-webkit-transform:scale(.95);transform:scale(.95);-webkit-box-shadow:0 0 0 0 rgba(0,0,0,.7);box-shadow:0 0 0 0 rgba(0,0,0,.7)}70%{-webkit-transform:scale(1);transform:scale(1);-webkit-box-shadow:0 0 0 10px transparent;box-shadow:0 0 0 10px transparent}100%{-webkit-transform:scale(.95);transform:scale(.95);-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}}.introjs-hint-pulse{-webkit-box-sizing:content-box;box-sizing:content-box;width:15px;height:15px;border-radius:30px;background-color:rgba(136,136,136,.24);z-index:10;position:absolute;-webkit-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out;-webkit-animation:introjspulse 2s infinite;animation:introjspulse 2s infinite}.introjs-hint-no-anim .introjs-hint-pulse{-webkit-animation:none;animation:none}.introjs-hint-dot{-webkit-box-sizing:content-box;box-sizing:content-box;background:0 0;border-radius:60px;height:50px;width:50px;position:absolute;top:-18px;left:-18px;z-index:1;opacity:0} +/*# sourceMappingURL=introjs.css.map */ \ No newline at end of file diff --git a/nezha-fronted/src/assets/css/index.scss b/nezha-fronted/src/assets/css/index.scss index 81251f4dd..1125c34c2 100644 --- a/nezha-fronted/src/assets/css/index.scss +++ b/nezha-fronted/src/assets/css/index.scss @@ -32,6 +32,7 @@ html { @import './common/index.scss'; // 加载通用样式 @import './common.scss'; @import '../stylus/main.scss'; + @import './components/introjs/introjs.scss'; } .theme-dark { @@ -42,4 +43,6 @@ html { @import './common/index.scss'; // 加载通用样式 @import './common.scss'; @import '../stylus/main.scss'; + @import './components/introjs/introjs.scss'; + @import './components/introjs/introjs-dark.scss'; } diff --git a/nezha-fronted/src/components/chart/chart/chart-table.vue b/nezha-fronted/src/components/chart/chart/chart-table.vue index 5e5f9b098..a7fe0342d 100644 --- a/nezha-fronted/src/components/chart/chart/chart-table.vue +++ b/nezha-fronted/src/components/chart/chart/chart-table.vue @@ -43,11 +43,11 @@ @@ -57,16 +57,16 @@ - -