diff --git a/web/src/assets/iconfont/font-dws-icon.svg b/web/src/assets/iconfont/font-dws-icon.svg old mode 100644 new mode 100755 index 776dd6f8c..2b1c8c606 --- a/web/src/assets/iconfont/font-dws-icon.svg +++ b/web/src/assets/iconfont/font-dws-icon.svg @@ -1,85 +1,103 @@ -Generated by IcoMoon + + + +{ + "fontFamily": "font-dws-icon", + "description": "Font generated by IcoMoon.", + "majorVersion": 1, + "minorVersion": 0, + "version": "Version 1.0", + "fontId": "font-dws-icon", + "psName": "font-dws-icon", + "subFamily": "Regular", + "fullName": "font-dws-icon" +} + + + - + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/web/src/assets/iconfont/font-dws-icon.ttf b/web/src/assets/iconfont/font-dws-icon.ttf old mode 100644 new mode 100755 index ad3754489..ddfdc404d Binary files a/web/src/assets/iconfont/font-dws-icon.ttf and b/web/src/assets/iconfont/font-dws-icon.ttf differ diff --git a/web/src/assets/iconfont/font-dws-icon.woff b/web/src/assets/iconfont/font-dws-icon.woff old mode 100644 new mode 100755 index 978571427..efd6d59b7 Binary files a/web/src/assets/iconfont/font-dws-icon.woff and b/web/src/assets/iconfont/font-dws-icon.woff differ diff --git a/web/src/assets/styles/iconfonts.scss b/web/src/assets/styles/iconfonts.scss index 4fb16747f..551929385 100644 --- a/web/src/assets/styles/iconfonts.scss +++ b/web/src/assets/styles/iconfonts.scss @@ -14,21 +14,17 @@ * limitations under the License. * */ - @import 'variables.scss'; - @font-face { font-family: 'font-dws-icon'; - src: url('../iconfont/font-dws-icon.eot?fkqrnv'); - src: url('../iconfont/font-dws-icon.eot?fkqrnv#iefix') format('embedded-opentype'), - url('../iconfont/font-dws-icon.ttf?fkqrnv') format('truetype'), - url('../iconfont/font-dws-icon.woff?fkqrnv') format('woff'), - url('../iconfont/font-dws-icon.svg?fkqrnv#font-dws-icon') format('svg'); + src: url('../iconfont/font-dws-icon.eot?fkqrnv'); + src: url('../iconfont/font-dws-icon.eot?fkqrnv#iefix') format('embedded-opentype'), url('../iconfont/font-dws-icon.ttf?fkqrnv') format('truetype'), url('../iconfont/font-dws-icon.woff?fkqrnv') format('woff'), url('../iconfont/font-dws-icon.svg?fkqrnv#font-dws-icon') format('svg'); font-weight: normal; font-style: normal; } -[class^="fi-"], [class*=" fi-"] { +[class*=" fi-"], +[class^="fi-"] { /* use !important to prevent issues with browser extensions that change fonts */ font-family: 'font-dws-icon' !important; font-style: normal; @@ -45,293 +41,377 @@ .fi-export:before { content: "\e904"; } + .fi-download:before { content: "\e905"; } + .fi-quit:before { content: "\e906"; } + .fi-search:before { content: "\e907"; } + .fi-undo:before { content: "\e908"; } + .fi-redo:before { content: "\e909"; } + .fi-format:before { content: "\e90a"; } + .fi-play:before { content: "\e90b"; } + .fi-stop:before { content: "\e90c"; } + .fi-save:before { content: "\e90d"; } + .fi-disconnect:before { content: "\e90e"; } + .fi-warn:before { content: "\e90f"; } + .fi-expand-right:before { content: "\e910"; } + .fi-cross:before { content: "\e911"; } + .fi-tick:before { content: "\e912"; } + .fi-dir-fold:before { content: "\e913"; } + .fi-dir-unfold:before { content: "\e914"; } + .fi-more-things:before { content: "\e915"; } + .fi-radio-on2:before { content: "\e918"; } + .fi-ide:before { content: "\e91d"; } + .fi-hivedb.open:before { content: "\e91e"; } + .fi-hivedb:before { content: "\e91f"; } + .fi-disk-o:before { content: "\e920"; } + .fi-disk:before { content: "\e921"; } + .fi-project-o:before { content: "\e922"; } + .fi-project:before { content: "\e923"; } + .fi-caret-down:before { content: "\e924"; } + .fi-caret-right:before { content: "\e925"; } + .fi-folder:before { content: "\e926"; padding: 0 2px; font-size: 14px; } + .fi-folder-o:before { content: "\e927"; padding: 0 2px; font-size: 14px; } + .fi-file:before { content: "\e928"; font-size: 16px; color: gray; } + .fi-file-o:before { content: "\e929"; font-size: 16px; padding: 0 2px; } + .fi-logo:before { - content: "\e930" + content: "\e930"; } + .fi-table:before { content: "\e931"; } + .fi-table.open:before { content: "\e931"; color: gray; } + .fi-field:before { content: "\e932"; font-size: 14px; color: gray; } + .fi-field.open:before { content: "\e932"; font-size: 14px; color: gray; } + .fi-open-in:before { - content: "\e92d" + content: "\e92d"; } + .fi-dock-show:before { - content: "\e92e" + content: "\e92e"; } + .fi-dock-hide:before { - content: "\e92f" + content: "\e92f"; } + .fi-hive:before { content: "\e93a"; color: #f4cf2a; font-size: 16px; } + .fi-spark:before { content: "\e93b"; color: $warning-color; font-size: 16px; } + .fi-scala:before { content: "\e93c"; color: $error-color; font-size: 16px; } + .fi-jdbc:before { content: "\e93d"; font-size: 16px; } + .fi-python:before { content: "\e93e"; color: #3573a6; font-size: 16px; font-weight: bold; } + .fi-spark-python:before { color: #3573a6; content: "\e93f"; font-size: 18px; } + .fi-storage:before { content: "\e940"; color: #4db091; font-size: 12px; } + .fi-sas:before { content: "\e941"; color: #58c6a2; } + .fi-r:before { content: "\e942"; color: #2d8cf0; font-size: 14px; } + .fi-txt:before { content: "\e943"; color: gray; font-size: 16px; } + .fi-log:before { content: "\e944"; color: gray; font-size: 16px; } + .fi-xls:before { content: "\e945"; color: #36af47; font-size: 16px; } + .fi-xlsx:before { content: "\e946"; color: #36af47; font-size: 16px; } + .fi-csv:before { content: "\e947"; color: #36af47; font-size: 16px; } + .fi-jar:before { content: "\e948"; color: #e45f3d; font-size: 16px; } + .fi-fx-method:before { content: "\e94a"; } + .fi-fx-method-o:before { content: "\e94a"; } + .fi-fx-udf:before { content: "\e94b"; } + .fi-fx-udf-o:before { - content: "\e94b" + content: "\e94b"; } + .fi-data-develop:before { content: "\e600"; color: #4cbf4b; } + .fi-resource:before { content: "\e601"; color: #3293e3; } + .fi-data-exchange:before { content: "\e602"; } + .fi-algorithms:before { content: "\e603"; color: #ff3d3d; } + .fi-workflow:before { - content: "\e604" + content: "\e604"; } + .fi-bi:before { content: "\e605"; color: #9654f5; font-size: 14px; } + .fi-schedule:before { content: "\e903"; } + .fi-workflow1:before { content: "\e901"; } + .fi-exchange:before { content: "\e902"; } + .fi-application:before { content: "\e916"; } + .fi-newproject:before { content: "\e91a"; } + .fi-addproject:before { content: "\e919"; } + .fi-visualis:before { content: "\e91b"; } + .fi-qualitis:before { content: "\e91c"; } + .fi-scriptis:before { content: "\e92a"; } + .fi-system:before { content: "\e92b"; } +.fi-plus:before { + content: "\ea0a"; +} + +.fi-cross1:before { + content: "\ea0f"; +} + // refresh icon 单独设置padding -.ivu-icon-ios-refresh{ +.ivu-icon-ios-refresh { padding: 4px 3px; } - @keyframes we-icon-loading-spin { - from { - transform: rotate(0deg); - } - 50% { - transform: rotate(180deg); - } - to { - transform: rotate(360deg); - } + from { + transform: rotate(0deg); } + + 50% { + transform: rotate(180deg); + } + + to { + transform: rotate(360deg); + } +} + .we-icon-loading { - color: #3d3d3d; - animation: we-icon-loading-spin 1s linear infinite; + color: #3d3d3d; + animation: we-icon-loading-spin 1s linear infinite; } diff --git a/web/src/assets/styles/workspace.scss b/web/src/assets/styles/workspace.scss new file mode 100644 index 000000000..552942ed4 --- /dev/null +++ b/web/src/assets/styles/workspace.scss @@ -0,0 +1,277 @@ +/*! + * Copyright 2019 WeBank + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ +@import './variables.scss'; + +.page-bgc { + background: rgb(245, 245, 245); + height: 100%; + margin: 0; + display: flex; + flex-direction: column; + //竖轴方向 + + .page-bgc-header { + padding: 10px 25px 0; + } + + .header-title { + font-size: 14px; + font-weight: bold; + padding-left: 5px; + border-left: 3px solid $primary-color; + } + + .header-info { + padding: 10px 0 10px 20px; + + p { + line-height: 24px; + } + } + +} + +.app-icon { + font-size: 14px; + height: 30px; + line-height: 30px; + color: #39f; +} + +.workspace-main { + padding: 10px 25px; + display: -webkit-box; + display: flex; + -webkit-box-pack: start; + justify-content: flex-start; + -webkit-box-align: start; + align-items: flex-start; + + .item-header { + font-size: 14px; + font-weight: bold; + padding-left: 23px; + border-left: 2px solid $primary-color; + + } + + .left { + flex: 1; + min-height: 137px; + // box-shadow: 0 1px 6px rgba(0,0,0,.2); + border-color: rgba(0,0,0,0); + padding: 0; + } + + .right { + // flex: 1; + margin-left: 25px; + min-height: 137px; + width: 500px; + // box-shadow: 0 1px 6px rgba(0,0,0,.2); + border-color: rgba(0,0,0,0); + padding: 0; + } + + .setting-bt-wrap { + position: absolute; + right: 20px; + top: 10px; + font-size: 24px; + + &.ivu-btn-text { + outline: none; + border: none; + box-shadow: 0 0 0 2px transparent; + } + } + + .app-list { + display: flex; + flex-wrap: wrap; + align-items: center; + + .app-item-add { + display: flex; + margin: 20px 10px 10px 25px; + padding: 10px; + cursor: pointer; + font-size: 24px; + transition: color .2s linear,background-color .2s linear,border .2s linear,box-shadow .2s linear; + + &:hover { + transition: color .2s linear,background-color .2s linear,border .2s linear,box-shadow .2s linear; + color: #39f; + + box-shadow: 0 2px 12px 0 rgba(0,0,0,.2); + border-radius: 4px; + } + } + + .shadow { + box-shadow: 0 2px 12px 0 rgba(0,0,0,.2); + border-radius: 4px; + } + + .app-item-wrap { + display: flex; + position: relative; + margin: 20px 10px 10px 25px; + padding: 10px 30px; + cursor: pointer; + border: 1px solid rgb(245, 245, 245); + border-radius: 3px; + + .close-wrap { + position: absolute; + right: -5px; + top: -5px; + color: #39f; + } + + &:hover { + box-shadow: 0 2px 12px 0 rgba(0,0,0,.2); + border-radius: 4px; + } + + .label { + margin-left: 10px; + // width: 110px; + // font-weight: 700; + font-size: 12px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + line-height: 30px; + height: 30px; + } + } + } +} + +.app-list-main { + padding: 0 25px 10px; + // bottom: 0; + flex: auto; + + .app-list-tabs { + padding: 20px 20px 20px 22px; + + border-radius: 6px; + height: 100%; + position: relative; + -webkit-transition: all .2s ease-in-out; + transition: all .2s ease-in-out; + background-color: #fff; + + &:hover { + box-shadow: 0 2px 7px rgba(0,0,0,.15); + border-color: transparent; + position: relative; + } + + .pane-wrap { + display: flex; + flex-wrap: wrap; + + .pane-item { + float: left; + margin: 10px 100px 0 0; + width: 450px; + } + + .app-entrance { + display: flex; + + .app-title-wrap { + flex: 1; + font-size: 12px; + + .app-title { + display: flex; + align-items: center; + margin-top: -10px; + + .title-sub { + margin-right: 10px; + } + + .app-tag { + color: #07C1E0; + border: 1px solid transparent; + background: #07C1E0; + } + + } + + } + + .app-status-wrap-active { + position: absolute; + right: 0; + top: 6px; + width: 70px; + font-size: 12px; + + color: #0c6; + + span { + color: #515a6e; + } + } + + .app-status-wrap-disable { + + position: absolute; + right: 0; + top: 6px; + width: 70px; + font-size: 12px; + color: #ccc; + + span { + color: #515a6e; + } + } + + } + + .button-wrap { + display: flex; + margin-top: 20px; + // justify-content: center; + + .entrace-btn { + margin-right: 10px; + } + } + + } + } + +} + +.input-wrap { + position: absolute; + right: 20px; + top: 20px; + width: 200px; +} + +.radio-box .ivu-radio .ivu-radio-inner { + border: 1px solid #2d8cf0; +} diff --git a/web/src/commonData/i18n/common/en.json b/web/src/commonData/i18n/common/en.json index d89c38063..4cdf41d22 100644 --- a/web/src/commonData/i18n/common/en.json +++ b/web/src/commonData/i18n/common/en.json @@ -490,7 +490,7 @@ "cancel": "Cancel", "timeout": "Timeout on publishing project {name}!" }, - "tableDetails" : { + "tableDetails": { "BZBSX": "Table basic attributes", "BZDXX": "Table column information", "BTJXX": "Table statistical information", @@ -1018,6 +1018,20 @@ }, "error": { "fileExists": "Duplicated file!" + }, + "home": { + "welcome": "Welcome to the {text} workspace!", + "setting": "Seting", + "exit": "Exit", + "enter": "Enter {text}", + "dlgTitle": "New Fast entry", + "selectType": "Please select category", + "selectApp": "Please select Application", + "save": "Save", + "cancel": "Cancel", + "running": "running", + "stop": "disable", + "searchPlaceholder": "Search application" } }, "database": { @@ -1614,4 +1628,4 @@ } } } -} +} \ No newline at end of file diff --git a/web/src/commonData/i18n/common/zh.json b/web/src/commonData/i18n/common/zh.json index 93c250f1a..1328e2b32 100644 --- a/web/src/commonData/i18n/common/zh.json +++ b/web/src/commonData/i18n/common/zh.json @@ -293,7 +293,7 @@ "WJYCZ": "文件已存在，请选择其它文件或选择其它文件夹！", "WJMCBHF": "文件名称不合法，仅支持以字母、数字、中文、下划线、中短线且带后缀的命名！", "SCBCG100": "上传文件不超过100M！", - "SCCG": "文件 {name} 上传成功！", + "SCCG": "文件 {name} 上传成功！", "WJCCXE": "文件大小超出限额！", "WJBSC": "资源文件 {name} 已被成功删除！" } @@ -490,7 +490,7 @@ "cancel": "关闭", "timeout": "工程{name}发布超时！" }, - "tableDetails" : { + "tableDetails": { "BZBSX": "表基本属性", "BZDXX": "表字段信息", "BTJXX": "表统计信息", @@ -534,7 +534,6 @@ "YES": "对", "GSHJX": "进行格式化成", "ZJXYGE": "组件需要的格式" - }, "logView": { "taskId": "任务ID：", @@ -1019,6 +1018,20 @@ }, "error": { "fileExists": "该文件已经存在！" + }, + "home": { + "welcome": "欢迎来到 {text} 的工作空间!", + "setting": "设置", + "exit": "退出设置", + "enter": "进入{text}", + "dlgTitle": "新增快速入口", + "selectType": "请选择分类", + "selectApp": "请选择系统", + "save": "保存", + "cancel": "取消", + "running": "运行中", + "stop": "不可用", + "searchPlaceholder": "搜索应用系统" } }, "database": { @@ -1615,4 +1628,4 @@ } } } -} +} \ No newline at end of file diff --git a/web/src/js/module/footer/index.scss b/web/src/js/module/footer/index.scss index 5df19daf3..ee8cf90c6 100644 --- a/web/src/js/module/footer/index.scss +++ b/web/src/js/module/footer/index.scss @@ -50,3 +50,12 @@ color: $text-color; } } +.footer-mask { + position: fixed; + top: -100vh; + left: -100vw; + width: 200vw; + height: 200vh; + background-color: #00000000; +} + \ No newline at end of file diff --git a/web/src/js/module/footer/index.vue b/web/src/js/module/footer/index.vue index 16d9fd644..e47a22d73 100644 --- a/web/src/js/module/footer/index.vue +++ b/web/src/js/module/footer/index.vue @@ -9,6 +9,7 @@ ref="resourceSimple" @update-job="updateJob"> +
diff --git a/web/src/js/module/header/index.scss b/web/src/js/module/header/index.scss index a68608f65..63e806d61 100644 --- a/web/src/js/module/header/index.scss +++ b/web/src/js/module/header/index.scss @@ -14,194 +14,225 @@ * limitations under the License. * */ - @import '../../../assets/styles/variables.scss'; -.layout-header{ - position: $fixed; - left: 0; - right: 0; - top: 0; - width: 100%; +.layout-header { + position: $fixed; + left: 0; + right: 0; + top: 0; + width: 100%; + height: 40px; + line-height: 40px; + padding: 0 20px; + background-color: #000; + color: $dark-color; + box-shadow: $shadow-down; + z-index: $zindex-affix; + user-select: none; + clear: both; + + .layout-header-menu-icon { + display: inline-block; + cursor: pointer; + margin-right: 10px; height: 40px; - line-height: 40px; - padding: 0 20px; - background-color: #000; - color: $dark-color; - box-shadow: $shadow-down; - z-index: $zindex-affix; - user-select: none; - clear: both; - .layout-header-menu-icon { - display: inline-block; - cursor: pointer; - margin-right: 10px; - height: 40px; - .icon { - width: 32px; - height: 32px; - margin-top: 4px; - } - &:hover { - color: $primary-color ; - } + + .icon { + width: 32px; + height: 32px; + margin-top: 4px; } - .logo{ - margin-left: 10px; - display: inline-block; - vertical-align: top; - font-size: 20px; - color: $body-background ; - margin-top: 2px; - .logo-title { - text-indent: -10000px; - position: absolute; - top: 0; - left: 0; - width: 0; - } - .logo-img { - height: 36px; - } + + &:hover { + color: $primary-color; } - .menu{ - display: inline-block; - vertical-align: top; - margin-left: 60px; - .menu-item{ - position: $relative; - float: left; - padding: 0 20px; - font-size: $font-size-base; - text-align: center; - text-indent: 0; - border-right: none; - cursor: pointer; - &:hover, &.selected{ - color: $body-background ; - background: $dark-bg-dark - } - .menu-item-beat { - position: $absolute; - top: 0; - right: 0; - } - } + } + + .logo { + margin-left: 10px; + display: inline-block; + vertical-align: top; + font-size: 20px; + color: $body-background; + margin-top: 2px; + + .logo-title { + text-indent: -10000px; + position: absolute; + top: 0; + left: 0; + width: 0; } - .icon-group { - float: right; - cursor: pointer; - text-align: center; - padding: 0 6px; - line-height: 40px; - height: 40px; - font-size: 14px; - i { - font-size: 20px; - margin-right: 10px; - &:hover { - color: #fff; - } - } + + .logo-img { + height: 36px; } - .user{ - float: right; - height: 40px; - cursor: pointer; - position: $relative; - span { - display: inline-block; - line-height: 40px; - font-size: $font-size-base; - padding: 0 7px 0 10px; - } - .user-icon { - padding-right: 10px; - } - .user-menu { - background: $menu-dark-active-bg; - width: 130px; - border: none; - position: $absolute; - top: 50px; - left: 50%; - margin-left: -75px; - border-radius: $border-radius-small; - .user-menu-arrow { - width: 0; - height: 0; - border: 8px solid $body-background; - border-color: transparent transparent $menu-dark-active-bg transparent; - border-top: 0; - list-style: none; - position: $absolute; - top: -8px; - left: 50%; - margin-left: -4px; - } - .user-menu-item { - list-style: none; - padding-left: 20px; - height: 40px; - display: flex; - align-items: center; - justify-content: flex-start; - &:hover { - color: $body-background; - background: $dark-bg-dark; - border-top: none; - border-radius: $border-radius-small; - } - .user-menu-item-icon { - font-size: 16px; - font-weight: bold; - } - } - } - &:hover, &.selected { - background: $menu-dark-active-bg; - } - .user-image{ - border-radius: 50%; - width: 40px; - height: auto; - } + } + + .menu { + display: inline-block; + vertical-align: top; + margin-left: 60px; + + .menu-item { + position: $relative; + float: left; + padding: 0 20px; + font-size: $font-size-base; + text-align: center; + text-indent: 0; + border-right: none; + cursor: pointer; + + &.selected, + &:hover { + color: $body-background; + background: $dark-bg-dark; + } + + .menu-item-beat { + position: $absolute; + top: 0; + right: 0; + } } - .proj-select { - margin-left: 25px; - vertical-align: middle; + } + + .icon-group { + float: right; + cursor: pointer; + text-align: center; + padding: 0 6px; + line-height: 40px; + height: 40px; + font-size: 14px; + + i { + font-size: 20px; + margin-right: 10px; + + &:hover { color: #fff; - margin-top: -2px; - display: inline-block; + } } - .project-dro { - vertical-align: top; - } - .proj-list { - height: 400px; - overflow-y: auto; - color: #333; + } + + .user { + float: right; + height: 40px; + cursor: pointer; + position: $relative; + + span { + display: inline-block; + line-height: 40px; + font-size: $font-size-base; + padding: 0 7px 0 10px; } - .proj-name { - padding:0 15px; - height: 30px; - line-height: 30px; - font-size: 14px; - border-bottom: 1px solid #eee; - margin-bottom: 2px; - color: #999; + + .user-icon { + padding-right: 10px; } - .proj-item { - width: 200px; + + .user-menu { + background: $menu-dark-active-bg; + width: 130px; + border: none; + position: $absolute; + top: 50px; + left: 50%; + margin-left: -75px; + border-radius: $border-radius-small; + + .user-menu-arrow { + width: 0; + height: 0; + border: 8px solid $body-background; + border-color: transparent transparent $menu-dark-active-bg transparent; + border-top: 0; + list-style: none; + position: $absolute; + top: -8px; + left: 50%; + margin-left: -4px; + } + + .user-menu-item { + list-style: none; padding-left: 20px; - height: 28px; - line-height: 28px; - cursor: pointer; + height: 40px; + display: flex; + align-items: center; + justify-content: flex-start; + &:hover { - background-color: #eee; + color: $body-background; + background: $dark-bg-dark; + border-top: none; + border-radius: $border-radius-small; } - &.active { - color: $primary-color + + .user-menu-item-icon { + font-size: 16px; + font-weight: bold; } + } + } + + &.selected, + &:hover { + background: $menu-dark-active-bg; + } + + .user-image { + border-radius: 50%; + width: 40px; + height: auto; + } + } + + .proj-select { + margin-left: 25px; + vertical-align: middle; + color: #fff; + margin-top: -2px; + display: inline-block; + } + + .project-dro { + vertical-align: top; + } + + .proj-list { + max-height: 400px; + overflow-y: auto; + color: #333; + } + + .proj-name { + padding: 0 15px; + height: 30px; + line-height: 30px; + font-size: 14px; + border-bottom: 1px solid #eee; + margin-bottom: 2px; + color: #999; + } + + .proj-item { + width: 200px; + padding-left: 20px; + height: 28px; + line-height: 28px; + cursor: pointer; + + &:hover { + background-color: #eee; + } + + &.active { + color: $primary-color; } + } } diff --git a/web/src/js/module/header/index.vue b/web/src/js/module/header/index.vue index c9719023c..53e2df896 100644 --- a/web/src/js/module/header/index.vue +++ b/web/src/js/module/header/index.vue @@ -21,6 +21,8 @@ src="../../../assets/images/dssLogo6.png" :alt="$t('message.newConst.logoName')">
+ + +
{ + if (!isEmpty(rst)) { + this.workspaces = rst.workspaces; + } + }) }); + + }, goto(name) { this.$router.push({ @@ -247,6 +263,17 @@ export default { setTimeout(() => { newTab.location.href = url; }, 500); + }, + goSpaceHome(){ + console.log('workspaceId', this.$route.query.workspaceId) + this.$router.push({path: '/home',query: Object.assign({}, this.$route.query)}); + }, + goConsole(){ + console.log('workspaceId', this.$route.query.workspaceId) + this.$router.push({path: '/console',query: Object.assign({}, this.$route.query)}); + }, + changeWorkspace(data){ + this.$router.push({path: '/workspace',query: Object.assign({}, this.$route.query, {workspaceId: data.id})}); } }, }; diff --git a/web/src/js/module/header/workspaceMenu.vue b/web/src/js/module/header/workspaceMenu.vue new file mode 100644 index 000000000..f497c31c1 --- /dev/null +++ b/web/src/js/module/header/workspaceMenu.vue @@ -0,0 +1,74 @@ + + + + + \ No newline at end of file diff --git a/web/src/js/module/project/feature.vue b/web/src/js/module/project/feature.vue index 437e04b82..989654ee5 100644 --- a/web/src/js/module/project/feature.vue +++ b/web/src/js/module/project/feature.vue @@ -72,6 +72,7 @@ export default { }, methods: { goto(type) { + console.log('--->', type) this.gotoCommonIframe(type); }, createProject() { diff --git a/web/src/js/service/mixin.js b/web/src/js/service/mixin.js index 4ca8713dc..a80e7d63f 100644 --- a/web/src/js/service/mixin.js +++ b/web/src/js/service/mixin.js @@ -142,7 +142,6 @@ export default { localStorage.removeItem('appJointProjectId') url = info.homepageUrl } - window.console.log(url, 'url') // 如果没有提示用户功能暂未开发 if (Object.keys(info).length === 0) { this.$Message.warning(this.$t('message.constants.warning.comingSoon')); diff --git a/web/src/js/service/router.js b/web/src/js/service/router.js index 7e6b57b55..6a6697cc7 100644 --- a/web/src/js/service/router.js +++ b/web/src/js/service/router.js @@ -65,6 +65,24 @@ const router = new VueRouter({ }, component: () => import('../view/workflow/index.vue'), }, + { + path: 'workspace', + name: 'workspace', + meta: { + title: 'Workspace', + publicPage: true, + }, + component: () => import('../view/workspace/index.vue'), + }, + { + path: 'workspace1', + name: 'workspace1', + meta: { + title: 'Workspace1', + publicPage: true, + }, + component: () => import('../view/newhome/module/workspace/index.vue'), + }, { path: 'commonIframe', name: 'commonIframe', diff --git a/web/src/js/view/newhome/module/workspace/index.scss b/web/src/js/view/newhome/module/workspace/index.scss index 9987fbef0..45d914b50 100644 --- a/web/src/js/view/newhome/module/workspace/index.scss +++ b/web/src/js/view/newhome/module/workspace/index.scss @@ -1,4 +1,4 @@ -@import '../../../assets/styles/variables.scss'; +@import '../../../../../assets/styles/variables.scss'; .page-bgc { background-color: #f7f7f7; @@ -48,7 +48,7 @@ display: flex; justify-content: flex-start; align-items: center; - margin: 10px 0 50px 0; + margin: 10px 0 50px; .workspace-create { flex-basis: 200px; @@ -56,10 +56,12 @@ justify-content: flex-start; align-items: center; padding: 15px 10px; + &:hover { box-shadow: 0 2px 12px 0 rgba(0,0,0,.2); border-radius: 4px; } + .workspace-create-text { margin-left: 10px; cursor: pointer; @@ -73,7 +75,7 @@ .item-header { font-size: 14px; - margin: 20px 25px 10px 25px; + margin: 20px 25px 10px; font-weight: bold; padding-left: 5px; border-left: 3px solid $primary-color; @@ -89,9 +91,10 @@ background: #fff; padding: 10px; position: relative; - background: url("../../../assets/images/workspace.png") center center no-repeat; + // background: url("../../../../../assets/images/workspace.png") center center no-repeat; background-size: cover; min-width: 222px; + .name { display: block; font-size: 16px; @@ -118,6 +121,7 @@ justify-content: flex-start; align-items: flex-start; width: 100%; + .item { display: inline-block; font-size: 10px; diff --git a/web/src/js/view/workspace/index.vue b/web/src/js/view/workspace/index.vue new file mode 100644 index 000000000..4b259bf7f --- /dev/null +++ b/web/src/js/view/workspace/index.vue @@ -0,0 +1,327 @@ + + + + + + \ No newline at end of file diff --git a/web/vue.config.js b/web/vue.config.js index d95110227..9b48f0852 100644 --- a/web/vue.config.js +++ b/web/vue.config.js @@ -32,6 +32,31 @@ const getVersion = () => { module.exports = { publicPath: './', outputDir: 'dist/dist', + devServer: { + port: 8080, + open: true, + disableHostCheck: true, + overlay: { + warnings: false, + errors: true + }, + proxy: { //代理转发 + '^/api/rest_j/v1': { + target: 'http://host:port', //后端服务地址 + ws: true, + changeOrigin: true, + pathRewrite: { + '^/api/rest_j/v1': '/api/rest_j/v1' + } + }, + '^/ws/api': { //websocket + target: 'ws://host:port', + ws: true, + secure: false, + }, + } + // after: require('./mock/mock-server.js') + }, chainWebpack: (config) => { if (process.env.NODE_ENV === 'production' || process.env.NODE_ENV === 'sandbox') { config.plugin('compress').use(FileManagerPlugin, [{