Skip to content
GitLab
Commit b2a93491 authored by ruanshudong's avatar ruanshudong
Browse files

fix header user css

parent 8e707093
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 504 additions and 352 deletions
+504 -352
client/dist/auth.html
+ 1
- 1
View file @ b2a93491
<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>User Center</title><link href=/static/css/auth.917f69ac.css rel=preload as=style><link href=/static/css/chunk-common.e941c7c1.css rel=preload as=style><link href=/static/css/chunk-vendors.7e538d84.css rel=preload as=style><link href=/static/js/auth.3f67602a.js rel=preload as=script><link href=/static/js/chunk-common.07b5d79a.js rel=preload as=script><link href=/static/js/chunk-vendors.205991fe.js rel=preload as=script><link href=/static/css/chunk-vendors.7e538d84.css rel=stylesheet><link href=/static/css/chunk-common.e941c7c1.css rel=stylesheet><link href=/static/css/auth.917f69ac.css rel=stylesheet></head><body><div id=auth-app></div><script src=/static/js/chunk-vendors.205991fe.js></script><script src=/static/js/chunk-common.07b5d79a.js></script><script src=/static/js/auth.3f67602a.js></script></body></html>
\ No newline at end of file
<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>User Center</title><link href=/static/css/auth.c2384921.css rel=preload as=style><link href=/static/css/chunk-common.e941c7c1.css rel=preload as=style><link href=/static/css/chunk-vendors.7e538d84.css rel=preload as=style><link href=/static/js/auth.b4e03246.js rel=preload as=script><link href=/static/js/chunk-common.07b5d79a.js rel=preload as=script><link href=/static/js/chunk-vendors.205991fe.js rel=preload as=script><link href=/static/css/chunk-vendors.7e538d84.css rel=stylesheet><link href=/static/css/chunk-common.e941c7c1.css rel=stylesheet><link href=/static/css/auth.c2384921.css rel=stylesheet></head><body><div id=auth-app></div><script src=/static/js/chunk-vendors.205991fe.js></script><script src=/static/js/chunk-common.07b5d79a.js></script><script src=/static/js/auth.b4e03246.js></script></body></html>
\ No newline at end of file
client/dist/index.html
+ 1
- 1
View file @ b2a93491
<!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"><link rel=icon href=/static/favicon.ico><title>Tars</title><link href=/static/css/chunk-common.e941c7c1.css rel=preload as=style><link href=/static/css/chunk-vendors.7e538d84.css rel=preload as=style><link href=/static/css/index.c4bfe4bd.css rel=preload as=style><link href=/static/js/chunk-common.07b5d79a.js rel=preload as=script><link href=/static/js/chunk-vendors.205991fe.js rel=preload as=script><link href=/static/js/index.25fe1fe3.js rel=preload as=script><link href=/static/css/chunk-vendors.7e538d84.css rel=stylesheet><link href=/static/css/chunk-common.e941c7c1.css rel=stylesheet><link href=/static/css/index.c4bfe4bd.css rel=stylesheet></head><body><noscript><strong>We're sorry but Tars doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/static/js/chunk-vendors.205991fe.js></script><script src=/static/js/chunk-common.07b5d79a.js></script><script src=/static/js/index.25fe1fe3.js></script></body></html>
\ No newline at end of file
<!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"><link rel=icon href=/static/favicon.ico><title>Tars</title><link href=/static/css/chunk-common.e941c7c1.css rel=preload as=style><link href=/static/css/chunk-vendors.7e538d84.css rel=preload as=style><link href=/static/css/index.c4bfe4bd.css rel=preload as=style><link href=/static/js/chunk-common.07b5d79a.js rel=preload as=script><link href=/static/js/chunk-vendors.205991fe.js rel=preload as=script><link href=/static/js/index.99567d68.js rel=preload as=script><link href=/static/css/chunk-vendors.7e538d84.css rel=stylesheet><link href=/static/css/chunk-common.e941c7c1.css rel=stylesheet><link href=/static/css/index.c4bfe4bd.css rel=stylesheet></head><body><noscript><strong>We're sorry but Tars doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/static/js/chunk-vendors.205991fe.js></script><script src=/static/js/chunk-common.07b5d79a.js></script><script src=/static/js/index.99567d68.js></script></body></html>
\ No newline at end of file
client/dist/k8s.html
+ 1
- 1
View file @ b2a93491
<!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"><link rel=icon href=/static/favicon.ico><title>TarsK8s</title><link href=/static/css/chunk-common.e941c7c1.css rel=preload as=style><link href=/static/css/chunk-vendors.7e538d84.css rel=preload as=style><link href=/static/css/k8s.cea0004d.css rel=preload as=style><link href=/static/js/chunk-common.07b5d79a.js rel=preload as=script><link href=/static/js/chunk-vendors.205991fe.js rel=preload as=script><link href=/static/js/k8s.8f2b733b.js rel=preload as=script><link href=/static/css/chunk-vendors.7e538d84.css rel=stylesheet><link href=/static/css/chunk-common.e941c7c1.css rel=stylesheet><link href=/static/css/k8s.cea0004d.css rel=stylesheet></head><body><noscript><strong>We're sorry but TarsK8s doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/static/js/chunk-vendors.205991fe.js></script><script src=/static/js/chunk-common.07b5d79a.js></script><script src=/static/js/k8s.8f2b733b.js></script></body></html>
\ No newline at end of file
<!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"><link rel=icon href=/static/favicon.ico><title>TarsK8s</title><link href=/static/css/chunk-common.e941c7c1.css rel=preload as=style><link href=/static/css/chunk-vendors.7e538d84.css rel=preload as=style><link href=/static/css/k8s.2782c787.css rel=preload as=style><link href=/static/js/chunk-common.07b5d79a.js rel=preload as=script><link href=/static/js/chunk-vendors.205991fe.js rel=preload as=script><link href=/static/js/k8s.c01c0eeb.js rel=preload as=script><link href=/static/css/chunk-vendors.7e538d84.css rel=stylesheet><link href=/static/css/chunk-common.e941c7c1.css rel=stylesheet><link href=/static/css/k8s.2782c787.css rel=stylesheet></head><body><noscript><strong>We're sorry but TarsK8s doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/static/js/chunk-vendors.205991fe.js></script><script src=/static/js/chunk-common.07b5d79a.js></script><script src=/static/js/k8s.c01c0eeb.js></script></body></html>
\ No newline at end of file
client/dist/static/js/auth.3f67602a.js deleted 100644 → 0
+ 0
- 1
View file @ 8e707093
This diff is collapsed.
client/dist/static/js/auth.b4e03246.js 0 → 100644
+ 1
- 0
View file @ b2a93491
This diff is collapsed.
client/dist/static/js/index.25fe1fe3.js deleted 100644 → 0
+ 0
- 1
View file @ 8e707093
This diff is collapsed.
client/dist/static/js/index.99567d68.js 0 → 100644
+ 1
- 0
View file @ b2a93491
This diff is collapsed.
client/dist/static/js/k8s.8f2b733b.js deleted 100644 → 0
+ 0
- 1
View file @ 8e707093
This diff is collapsed.
client/dist/static/js/k8s.c01c0eeb.js 0 → 100644
+ 1
- 0
View file @ b2a93491
This diff is collapsed.
client/src/components/app/header.vue
+ 31
- 4
View file @ b2a93491
......@@ -59,7 +59,24 @@
<div>framework:{{ framework_version }}</div>
</div>
<div class="user-wrap">
<p class="user-info" @click="userOptOpen = !userOptOpen">
<el-dropdown style="margin-bottom:10px;" @command="handleCommand">
<span class="el-dropdown-link">
{{ uid }}<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="center" v-show="enableLogin">{{
$t("header.userCenter")
}}</el-dropdown-item>
<el-dropdown-item command="modifyPass" v-if="!enableLdap">{{
$t("header.modifyPass")
}}</el-dropdown-item>
<el-dropdown-item command="quit" v-if="!enableLdap">{{
$t("header.logout")
}}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!-- <p class="user-info" @click="userOptOpen = !userOptOpen">
<span class="name toe">{{ uid }} </span>
<i
class="let-icon let-icon-caret-down"
......@@ -80,8 +97,8 @@
<a href="/logout">{{ $t("header.logout") }}</a>
</div>
</div>
</transition>
</p>
</transition> -->
<!-- </p> -->
</div>
</div>
</div>
......@@ -104,7 +121,7 @@ export default {
packageIcon,
locale: this.$cookie.get("locale") || "en",
uid: "--",
userOptOpen: false,
// userOptOpen: false,
enableLogin: false,
isAdmin: false,
localeMessages: localeMessages,
......@@ -123,6 +140,16 @@ export default {
userCenter() {
window.open("/pages/server/api/userCenter");
},
handleCommand(command) {
if (command == "center") {
location.href = "/auth.html";
} else if (command == "modifyPass") {
location.href = "/pass.html";
}
if (command == "quit") {
location.href = "/logout";
}
},
getLoginUid() {
this.$ajax
.getJSON("/server/api/get_login_uid")
......
client/src/components/app/k8s-header.vue
+ 240
- 187
View file @ b2a93491
<template>
<div class="app_index__header">
<div class="main-width">
<h1 class="hidden">TARS/K8S</h1>
<div class="logo-wrap">
<a v-if="enable === 'true' && show === 'true'" href="/"><img class="logo" src="/static/img/tars-logo.png"></a>
<a v-if="k8s === 'true'" :class="{active: true}" href="/k8s.html"><img class="logo" src="/static/img/K8S.png"></a>
<a v-if="enable === 'true'" href="/dcache.html"><img class="logo" alt="dcache" src="/static/img/dcache-logo.png"></a>
<a v-if="enable === 'true' && show === 'true'" href="/"
><img class="logo" src="/static/img/tars-logo.png"
/></a>
<a v-if="k8s === 'true'" :class="{ active: true }" href="/k8s.html"
><img class="logo" src="/static/img/K8S.png"
/></a>
<a v-if="enable === 'true'" href="/dcache.html"
><img class="logo" alt="dcache" src="/static/img/dcache-logo.png"
/></a>
</div>
<let-tabs class="tabs" :center="true" @click="clickTab" :activekey="$route.matched[0].path">
<let-tab-pane :tab="$t('header.tab.tab1')" tabkey="/server" :icon="serverIcon"></let-tab-pane>
<let-tab-pane :tab="$t('header.tab.tab2')" tabkey="/operation" :icon="opaIcon"></let-tab-pane>
<let-tab-pane :tab="$t('header.tab.tab8')" tabkey="/gateway" :icon="cacheIcon"></let-tab-pane>
<let-tab-pane :tab="$t('header.tab.tab9')" tabkey="/market" :icon="packageIcon"></let-tab-pane>
<let-tabs
class="tabs"
:center="true"
@click="clickTab"
:activekey="$route.matched[0].path"
>
<let-tab-pane
:tab="$t('header.tab.tab1')"
tabkey="/server"
:icon="serverIcon"
></let-tab-pane>
<let-tab-pane
:tab="$t('header.tab.tab2')"
tabkey="/operation"
:icon="opaIcon"
></let-tab-pane>
<let-tab-pane
:tab="$t('header.tab.tab8')"
tabkey="/gateway"
:icon="cacheIcon"
></let-tab-pane>
<let-tab-pane
:tab="$t('header.tab.tab9')"
tabkey="/market"
:icon="packageIcon"
></let-tab-pane>
</let-tabs>
<div class="language-wrap">
<let-select v-model="locale" @change="changeLocale" :clearable="false">
<template v-for="locale in localeMessages">
<let-option :value="locale.localeCode" :key="locale.localeCode">{{locale.localeName}}</let-option>
<let-option :value="locale.localeCode" :key="locale.localeCode">{{
locale.localeName
}}</let-option>
</template>
</let-select>
</div>
<div class="user-wrap">
<p class="user-info" @click="userOptOpen = !userOptOpen">
<span class="name toe">{{uid}} </span>
<i class="let-icon let-icon-caret-down" :class="{up: userOptOpen}" v-show="enableLogin"></i>
<transition name="fade">
<div class="user-pop-wrap" v-show="enableLogin && userOptOpen">
<div> <a href="/auth.html" >{{$t('header.userCenter')}}</a> </div>
<div> <a href="/pass.html" v-if="!enableLdap" >{{$t('header.modifyPass')}}</a> </div>
<div> <a href="/logout">{{$t('header.logout')}}</a> </div>
</div>
</transition>
</p>
<el-dropdown style="margin-bottom:10px;" @command="handleCommand">
<span class="el-dropdown-link">
{{ uid
}}<i
class="el-icon-arrow-down el-icon--right"
v-show="enableLogin"
></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="center" v-show="enableLogin">{{
$t("header.userCenter")
}}</el-dropdown-item>
<el-dropdown-item command="modifyPass">{{
$t("header.modifyPass")
}}</el-dropdown-item>
<el-dropdown-item command="quit">{{
$t("header.logout")
}}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
</div>
</template>
<script>
import serverIcon from '@/assets/img/server-icon.png';
import opaIcon from '@/assets/img/opa-icon.png';
import releaseIcon from '@/assets/img/package-l.png';
import cacheIcon from '@/assets/img/cache-l.png';
import operatorIcon from '@/assets/img/operator-l.png';
import packageIcon from '@/assets/img/package-l.png';
import {localeMessages} from '@/locale/i18n';
export default {
data() {
return {
// 图标
serverIcon,
opaIcon,
releaseIcon,
cacheIcon,
operatorIcon,
packageIcon,
locale: this.$cookie.get('locale') || 'en',
uid: '--',
userOptOpen: false,
enableLogin: false,
isAdmin: false,
localeMessages: localeMessages,
k8s: this.$cookie.get('k8s') || 'false',
enable: this.$cookie.get('enable') || 'false',
show: this.$cookie.get('show') || 'false',
enableLdap: false,
};
import serverIcon from "@/assets/img/server-icon.png";
import opaIcon from "@/assets/img/opa-icon.png";
import releaseIcon from "@/assets/img/package-l.png";
import cacheIcon from "@/assets/img/cache-l.png";
import operatorIcon from "@/assets/img/operator-l.png";
import packageIcon from "@/assets/img/package-l.png";
import { localeMessages } from "@/locale/i18n";
export default {
data() {
return {
// 图标
serverIcon,
opaIcon,
releaseIcon,
cacheIcon,
operatorIcon,
packageIcon,
locale: this.$cookie.get("locale") || "en",
uid: "--",
// userOptOpen: false,
enableLogin: false,
isAdmin: false,
localeMessages: localeMessages,
k8s: this.$cookie.get("k8s") || "false",
enable: this.$cookie.get("enable") || "false",
show: this.$cookie.get("show") || "false",
enableLdap: false,
};
},
methods: {
handleCommand(command) {
if (command == "center") {
location.href = "/auth.html";
} else if (command == "modifyPass") {
location.href = "/pass.html";
}
if (command == "quit") {
location.href = "/logout";
}
},
methods: {
clickTab(tabkey) {
this.$router.replace(tabkey);
},
userCenter() {
window.open("/pages/server/api/userCenter");
},
getLoginUid(){
this.$ajax.getJSON('/server/api/get_login_uid').then((data) => {
clickTab(tabkey) {
this.$router.replace(tabkey);
},
userCenter() {
window.open("/pages/server/api/userCenter");
},
getLoginUid() {
this.$ajax
.getJSON("/server/api/get_login_uid")
.then((data) => {
if (data && data.uid) {
this.uid = data.uid;
} else {
this.uid = '***';
this.uid = "***";
}
}).catch((err) => {
})
.catch((err) => {
this.$tip.error(`获取用户登录信息: ${err.err_msg || err.message}`);
});
},
changeLocale(){
this.$cookie.set('locale', this.locale, {expires: '1Y'});
location.reload();
},
checkEnableLogin(){
this.$ajax.getJSON('/server/api/is_enable_login').then((data) => {
// console.log(data);
},
changeLocale() {
this.$cookie.set("locale", this.locale, { expires: "1Y" });
location.reload();
},
checkEnableLogin() {
this.$ajax
.getJSON("/server/api/is_enable_login")
.then((data) => {
// console.log(data);
this.enableLogin = data.enableLogin || false;
}).catch((err) => {
});
},
checkEnableLdap(){
this.$ajax.getJSON('/server/api/isEnableLdap').then((data) => {
this.enableLdap = data.enableLdap || false;
}).catch((err)=>{
});
},
checkAdmin(){
this.isAdmin = false;
this.$ajax.getJSON('/server/api/isAdmin').then((data) => {
})
.catch((err) => {});
},
checkEnableLdap() {
this.$ajax
.getJSON("/server/api/isEnableLdap")
.then((data) => {
this.enableLdap = data.enableLdap || false;
})
.catch((err) => {});
},
checkAdmin() {
this.isAdmin = false;
this.$ajax
.getJSON("/server/api/isAdmin")
.then((data) => {
// console.log(data);
this.isAdmin = data.admin;
}).catch((err) => {
});
},
})
.catch((err) => {});
},
mounted() {
this.getLoginUid();
this.checkEnableLogin();
this.checkAdmin();
this.checkEnableLdap();
},
mounted() {
this.getLoginUid();
this.checkEnableLogin();
this.checkAdmin();
this.checkEnableLdap();
window.header =this;
}
};
window.header = this;
},
};
</script>
<style lang="postcss">
@import '../../assets/css/variable.css';
.app_index__header {
height: 80px;
border-bottom: 1px solid var(--border-color);
@import "../../assets/css/variable.css";
.main-width {
position: relative;
}
.app_index__header {
height: 80px;
border-bottom: 1px solid var(--border-color);
.tabs .let-tabs__header {
border-bottom: none;
}
.main-width {
position: relative;
}
.logo-wrap, .user-wrap, .language-wrap {
position: absolute;
top: 0;
height: 80px;
width: 300px;
padding: 26px var(--gap-small);
}
.tabs .let-tabs__header {
border-bottom: none;
}
.logo-wrap {
left: 0;
width: auto;
z-index: 100;
padding: 0px;
.logo-wrap,
.user-wrap,
.language-wrap {
position: absolute;
top: 0;
height: 80px;
width: 300px;
padding: 26px var(--gap-small);
}
a {
display: inline-block;
height: 80px;
padding: 30px 20px 0;
position: relative;
&.active {
&::after {
content: "";
display: inline-block;
height: 3px;
width: 100%;
background: #457FF5;
position: absolute;
top: 76px;
left: 0px;
.logo-wrap {
left: 0;
width: auto;
z-index: 100;
padding: 0px;
}
}
.logo {
height: 25px;
a {
display: inline-block;
height: 80px;
padding: 30px 20px 0;
position: relative;
&.active {
&::after {
content: "";
display: inline-block;
height: 3px;
width: 100%;
background: #457ff5;
position: absolute;
top: 76px;
left: 0px;
}
}
.logo {
height: 28px;
height: 25px;
}
}
.language-wrap {
right: 150px;
width: 150px;
padding-top: 20px;
.logo {
height: 28px;
}
}
.language-wrap {
right: 150px;
width: 150px;
padding-top: 20px;
}
.user-wrap {
right: 0;
width: 150px;
text-align: right;
.user-info {
max-width: 100%;
display: flex;
align-items: center;
justify-content: flex-end;
height: 28px;
cursor: pointer;
.avatar {
height: 100%;
border-radius: 50%;
}
.user-wrap {
right: 0;
width: 150px;
text-align: right;
.name {
margin: 0 8px;
}
.user-info {
max-width: 100%;
display: flex;
align-items: center;
justify-content: flex-end;
height: 28px;
cursor: pointer;
.let-icon-caret-down {
position: relative;
right: auto;
top: auto;
padding-left: 0;
margin-top: 0;
}
.avatar {
height: 100%;
border-radius: 50%;
}
.name {
margin: 0 8px;
}
}
.user-pop-wrap {
position: absolute;
right: 20px;
top: 55px;
border: 1px solid #d7dae0;
border-radius: 4px;
padding: 10px;
background: #FFF;
font-size: 12px;
.let-icon-caret-down {
position: relative;
right: auto;
top: auto;
padding-left: 0;
margin-top: 0;
}
}
}
.fade-enter-active, .fade-leave-active {
transition: opacity .4s;
}
.user-pop-wrap {
position: absolute;
right: 20px;
top: 55px;
border: 1px solid #d7dae0;
border-radius: 4px;
padding: 10px;
background: #fff;
font-size: 12px;
}
.fade-enter, .fade-leave-to {
opacity: 0;
}
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.4s;
}
.fade-enter,
.fade-leave-to {
opacity: 0;
}
}
</style>
client/src/components/app/sso-header.vue
+ 217
- 152
View file @ b2a93491
<template>
<!-- <div id="app"> -->
<div class="app_index__header">
<div class="main-width">
<!-- <div style="float:right;width: 400px;position:relative;clear:both;"> -->
<h1 class="hidden">TARS</h1>
<div class="logo-wrap">
<a v-if="enable === 'true' && show === 'true'" :class="{active: false}" href="/"><img class="logo" src="/static/img/tars-logo.png"></a>
<a v-if="k8s === 'true'" :class="{active: true}" href="/k8s.html"><img class="logo" src="/static/img/K8S.png"></a>
</div>
<let-tabs class="tabs" :center="true" @click="clickTab" :activekey="$route.matched[0].path">
<let-tab-pane :tab="$t('ssoHeader.tab.tab1')" tabkey="/" :icon="serverIcon"></let-tab-pane>
<let-tab-pane v-if="isAdmin" :tab="$t('ssoHeader.tab.tab2')" tabkey="/user" :icon="userIcon"></let-tab-pane>
<let-tab-pane :tab="$t('ssoHeader.tab.tab4')" tabkey="/token" :icon="tokenIcon"></let-tab-pane>
<let-tab-pane v-if="isAdmin" :tab="$t('ssoHeader.tab.tab5')" tabkey="/set" :icon="opaIcon"></let-tab-pane>
</let-tabs>
<div class="language-wrap">
<let-select v-model="locale" @change="changeLocale" :clearable="false">
<template v-for="locale in localeMessages">
<let-option :value="locale.localeCode" :key="locale.localeCode">{{locale.localeName}}</let-option>
</template>
</let-select>
</div>
<!-- <div class="language-wrap">
<div class="app_index__header">
<div class="main-width">
<!-- <div style="float:right;width: 400px;position:relative;clear:both;"> -->
<h1 class="hidden">TARS</h1>
<div class="logo-wrap">
<a
v-if="enable === 'true' && show === 'true'"
:class="{ active: false }"
href="/"
><img class="logo" src="/static/img/tars-logo.png"
/></a>
<a v-if="k8s === 'true'" :class="{ active: true }" href="/k8s.html"
><img class="logo" src="/static/img/K8S.png"
/></a>
</div>
<let-tabs
class="tabs"
:center="true"
@click="clickTab"
:activekey="$route.matched[0].path"
>
<let-tab-pane
:tab="$t('ssoHeader.tab.tab1')"
tabkey="/"
:icon="serverIcon"
></let-tab-pane>
<let-tab-pane
v-if="isAdmin"
:tab="$t('ssoHeader.tab.tab2')"
tabkey="/user"
:icon="userIcon"
></let-tab-pane>
<let-tab-pane
:tab="$t('ssoHeader.tab.tab4')"
tabkey="/token"
:icon="tokenIcon"
></let-tab-pane>
<let-tab-pane
v-if="isAdmin"
:tab="$t('ssoHeader.tab.tab5')"
tabkey="/set"
:icon="opaIcon"
></let-tab-pane>
</let-tabs>
<div class="language-wrap">
<let-select v-model="locale" @change="changeLocale" :clearable="false">
<template v-for="locale in localeMessages">
<let-option :value="locale.localeCode" :key="locale.localeCode">{{
locale.localeName
}}</let-option>
</template>
</let-select>
</div>
<!-- <div class="language-wrap">
<locale-select></locale-select>
</div> -->
<el-dropdown style="margin-bottom:10px;" @command="handleCommand">
<span class="el-dropdown-link">
{{ uid
}}<i
class="el-icon-arrow-down el-icon--right"
v-show="enableLogin"
></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="modifyPass">{{
$t("header.modifyPass")
}}</el-dropdown-item>
<el-dropdown-item command="quit">{{
$t("header.logout")
}}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!--
<div class="user-wrap">
<p class="user-info" @click="userOptOpen = !userOptOpen">
<span class="name toe">{{uid}} </span>
......@@ -39,98 +89,114 @@
</div>
</transition>
</p>
</div>
</div>
</div> -->
</div>
</div>
</template>
<script>
import serverIcon from '@/assets/img/server-icon.png';
import userIcon from '@/assets/img/operator-l.png';
import opaIcon from '@/assets/img/opa-icon.png';
import tokenIcon from '@/assets/img/create-l.png';
import packageIcon from '@/assets/img/package.png'
import {localeMessages} from '@/locale/i18n';
import serverIcon from "@/assets/img/server-icon.png";
import userIcon from "@/assets/img/operator-l.png";
import opaIcon from "@/assets/img/opa-icon.png";
import tokenIcon from "@/assets/img/create-l.png";
import packageIcon from "@/assets/img/package.png";
import { localeMessages } from "@/locale/i18n";
export default {
name: 'App',
data(){
name: "App",
data() {
return {
serverIcon,
opaIcon,
userIcon,
packageIcon,
tokenIcon,
locale: this.$cookie.get('locale') || 'cn',
localeMessages: localeMessages,
enableLogin: true,
isAdmin: false,
uid: '--',
k8s: this.$cookie.get('k8s') || 'false',
enable: this.$cookie.get('enable') || 'false',
show: this.$cookie.get('show') || 'false',
userOptOpen: false,
enableLdap: false,
}
serverIcon,
opaIcon,
userIcon,
packageIcon,
tokenIcon,
locale: this.$cookie.get("locale") || "cn",
localeMessages: localeMessages,
enableLogin: true,
isAdmin: false,
uid: "--",
k8s: this.$cookie.get("k8s") || "false",
enable: this.$cookie.get("enable") || "false",
show: this.$cookie.get("show") || "false",
// userOptOpen: false,
enableLdap: false,
};
},
methods:{
methods: {
handleCommand(command) {
if (command == "modifyPass") {
location.href = "/pass.html";
}
if (command == "quit") {
location.href = "/logout";
}
},
clickTab(tabkey) {
this.$router.replace(tabkey);
},
changeLocale(){
this.$cookie.set('locale', this.locale, {expires: '1Y'});
changeLocale() {
this.$cookie.set("locale", this.locale, { expires: "1Y" });
location.reload();
},
getLoginUid(){
this.$ajax.getJSON('/server/api/getLoginUid').then((data) => {
if(data && data.uid){
this.uid = data.uid;
}else{
this.uid = '***';
}
}).catch((err) => {
this.$tip.error(`${this.$t('login.getUidFailed')}: ${err.err_msg || err.message}`);
});
},
checkEnableLogin(){
this.$ajax.getJSON('/server/api/isEnableLogin').then((data) => {
this.enableLogin = data.enableLogin || false;
}).catch((err)=>{
});
},
checkEnableLdap(){
this.$ajax.getJSON('/server/api/isEnableLdap').then((data) => {
this.enableLdap = data.enableLdap || false;
}).catch((err)=>{
getLoginUid() {
this.$ajax
.getJSON("/server/api/getLoginUid")
.then((data) => {
if (data && data.uid) {
this.uid = data.uid;
} else {
this.uid = "***";
}
})
.catch((err) => {
this.$tip.error(
`${this.$t("login.getUidFailed")}: ${err.err_msg || err.message}`
);
});
},
async checkAdmin(){
this.isAdmin = false;
return this.$ajax.getJSON('/server/api/isAdmin').then((data) => {
checkEnableLogin() {
this.$ajax
.getJSON("/server/api/isEnableLogin")
.then((data) => {
this.enableLogin = data.enableLogin || false;
})
.catch((err) => {});
},
checkEnableLdap() {
this.$ajax
.getJSON("/server/api/isEnableLdap")
.then((data) => {
this.enableLdap = data.enableLdap || false;
})
.catch((err) => {});
},
async checkAdmin() {
this.isAdmin = false;
return this.$ajax
.getJSON("/server/api/isAdmin")
.then((data) => {
this.isAdmin = data.admin;
// alert(this.isAdmin);
}).catch((err) => {
});
},
})
.catch((err) => {});
},
},
async mounted() {
this.getLoginUid();
this.checkEnableLogin();
await this.checkAdmin();
this.checkEnableLdap();
},
async mounted(){
this.getLoginUid();
this.checkEnableLogin();
await this.checkAdmin();
this.checkEnableLdap();
}
};
</script>
<style lang="postcss">
/* @import '../../assets/css/variable.css'; */
/* @import '../../assets/css/variable.css'; */
.app_index__header {
height: 80px;
border-bottom: 1px solid;
.app_index__header {
height: 80px;
border-bottom: 1px solid;
.main-width {
position: relative;
......@@ -140,7 +206,9 @@ export default {
border-bottom: none;
}
.logo-wrap, .user-wrap, .language-wrap {
.logo-wrap,
.user-wrap,
.language-wrap {
position: absolute;
top: 0;
height: 80px;
......@@ -154,34 +222,31 @@ export default {
z-index: 100;
padding: 0px;
a {
display: inline-block;
height: 80px;
padding: 20px 20px 0;
position: relative;
&.active {
&::after {
content: "";
display: inline-block;
height: 3px;
width: 100%;
background: #457FF5;
position: absolute;
top: 76px;
left: 0px;
}
}
.logo {
height: 31px;
}
}
.logo {
height: 28px;
}
a {
display: inline-block;
height: 80px;
padding: 20px 20px 0;
position: relative;
&.active {
&::after {
content: "";
display: inline-block;
height: 3px;
width: 100%;
background: #457ff5;
position: absolute;
top: 76px;
left: 0px;
}
}
.logo {
height: 31px;
}
}
.logo {
height: 28px;
}
}
.language-wrap {
right: 150px;
......@@ -194,32 +259,31 @@ export default {
width: 150px;
text-align: right;
.user-info {
max-width: 100%;
display: flex;
align-items: center;
justify-content: flex-end;
height: 28px;
cursor: pointer;
.avatar {
height: 100%;
border-radius: 50%;
}
.user-info {
max-width: 100%;
display: flex;
align-items: center;
justify-content: flex-end;
height: 28px;
cursor: pointer;
.name {
margin: 0 8px;
}
.avatar {
height: 100%;
border-radius: 50%;
}
.let-icon-caret-down {
position: relative;
right: auto;
top: auto;
padding-left: 0;
margin-top: 0;
}
.name {
margin: 0 8px;
}
}
.let-icon-caret-down {
position: relative;
right: auto;
top: auto;
padding-left: 0;
margin-top: 0;
}
}
}
.user-pop-wrap {
......@@ -229,17 +293,18 @@ export default {
border: 1px solid #d7dae0;
border-radius: 4px;
padding: 10px;
background: #FFF;
background: #fff;
font-size: 12px;
}
.fade-enter-active, .fade-leave-active {
transition: opacity .4s;
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.4s;
}
.fade-enter, .fade-leave-to {
.fade-enter,
.fade-leave-to {
opacity: 0;
}
}
}
</style>
client/src/market/market.vue
+ 1
- 0
View file @ b2a93491
......@@ -18,6 +18,7 @@
<el-dropdown style="margin-bottom:10px;" @command="handleCommand">
<span class="el-dropdown-link">
<i class="el-icon-cloudy el-icon--left"></i>
{{ uid }}<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
......
client/src/market/service/index.vue
+ 9
- 3
View file @ b2a93491
......@@ -38,9 +38,15 @@
<span style="margin-bottom:10px; margin-right:10px">
<el-tag effect="dark" size="mini" style=" margin-right:5px"
>贡献者</el-tag
><el-tag effect="plain" type="success" size="mini">{{
serviceVersion.collaborators
}}</el-tag>
><el-tag
effect="plain"
type="success"
style="margin-right:5px"
size="mini"
v-for="u in serviceVersion.collaborators.split(',')"
v-bind:key="u"
>{{ u }}</el-tag
>
</span>
</div>
<div style="margin-bottom:5px">
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

免费DevSecOps平台，让您的项目体验完整的DevSecOps流程，让项目更安全