Commit 04e21fe5 authored by 刘殿昕's avatar 刘殿昕

个人中心

parent 36e8624f
<template>
<!--
this page will be destoryed after userRoles is available
-->
<div class="menu">
<img src="../assets/imgs/home_img_logo.png" alt class="logo" />
<div style="float:right;cursor: pointer;position:relative;" class="user_hover">
<span
v-if="userInfo.user_name && userInfo.user_name !=''"
class="user"
>{{ userInfo.user_name }}</span>
<span v-else @click="gotopage('login')" class="user">请登录</span>
<img
:class="userInfo.picture_path ? 'user_pic': 'user_default'"
:src="
userInfo.picture_path || require('../assets/imgs/home_ic_user.png')
"
/>
<div v-if="userInfo.user_name && userInfo.user_name !=''" class="user_menu">
<div
v-for="(item, index) in user_arr"
:key="index + 700"
@click="gotopage(item.path)"
>{{ item.name }}</div>
</div>
<div v-if="userInfo.user_name && userInfo.user_name !=''" class="sj"></div>
</div>
<div
style="float:right;cursor: pointer;position:relative;"
class="shop_hover"
@click="gotopage('/shop/shopping_cart')"
>
<div class="car">
<el-badge v-if="menuCartNum != 0" :value="menuCartNum" :max="99" class="number"></el-badge>
<img src="../assets/imgs/home_ic_shop.png" alt class="car_img" />
</div>
<div v-if="userInfo.user_name && userInfo.user_name !=''" class="shop_menu">
<div class="shop_list_title">最近加入的服务:</div>
<div
v-for="(item, index) in shopping_list"
:key="'shopping' + index"
class="shop_list_cell shop_line"
>
<img :src="item.service.cover" class="shop_img" />
<div class="shop_cell_msgs">
<p @click="getDetail(item.id)" class="shop_cell_name over_one">
{{
item.service_id == 0
? item.application.app_name
: item.service.name
}}
</p>
<p class="shop_cell_msg bover_one">
{{
item.service_id == 0
? item.application.ywly
: item.service.sectors_name
}}
</p>
<p class="shop_cell_msg over_one">
{{
item.service_id == 0
? item.application.org
: item.service.organization_name
}}
</p>
</div>
<div>
<img @click.stop="deleteItem(item.id)" src="../assets/imgs/ic_delete.png" alt />
</div>
</div>
<div class="shop_footer">
<el-button @click="settlement" size="small" class="shop_settlement">去购物车申请结算</el-button>
</div>
</div>
<div v-if="userInfo.user_name && userInfo.user_name !=''" class="shop_sj"></div>
</div>
<div style="float:right">
<div
v-for="(item, index) in menu_arr"
:key="index + 200"
class="menu_box user_hover"
@click="navAction(index, item.visit_url)"
:style="{ color: now_menu == index ? '#fff' : '' }"
>
{{ item.menu_name }}
<div class="user_menu" v-if="item.Child && item.Child.length" style="left: 30px;">
<div
v-for="(v, indexs) in item.Child"
:key="indexs + 700"
@click.stop="gotoChildPage(v, index)"
>{{ v.menu_name }}</div>
</div>
<div class="sj" v-if="item.Child && item.Child.length" style="left: 60px;"></div>
<div class="bottom_show" v-if="now_menu == index"></div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
menu_arr: [
// {
// name: "工作台",
// path: "/workplace",
// children: [
// {
// name: "服务注册",
// path: "/fwzc/fwcs"
// },
// {
// name: "服务管理",
// path: "/fwgl/"
// },
// {
// name: "应用管理",
// path: "/yygl/"
// }
// ]
// },
// {
// name: "技术支持",
// path: "/xxx"
// },
// {
// name: "服务超市",
// path: "/services_shop",
// children: [
// {
// name: "数据服务",
// path: "/shop/data_service_list/5"
// },
// {
// name: "时空服务",
// path: "/shop/space_time_service_list/6"
// },
// {
// name: "视频服务",
// path: "/shop/video_service_list/7"
// },
// {
// name: "感知服务",
// path: "/shop/perception_service_list/10"
// },
// {
// name: "综合应用",
// path: "/shop/comprehensive_app_list/11"
// },
// {
// name: "云资源服务",
// path: "/shop/cloud"
// },
// {
// name: "应用商店",
// path: "/shop/app_store_list/12"
// }
// ]
// }
],
now_menu: 2,
user_arr: [
{ name: "个人档案", path: "/user/user_info" },
{ name: "消息通知", path: "/user/message" },
{ name: "收银中心", path: "" },
{ name: "关于BD-aPaaS", path: "" },
{ name: "退出登录", path: "logout" }
],
shopping_list: [],
menuCartNum: 0
};
},
mounted() {
this.getNowMenu();
this.getList();
},
computed: {
getMenuCartState() {
return this.$store.state.menuCartState;
},
userInfo() {
return this.$store.state.userInfo || {};
}
},
watch: {
getMenuCartState(newVal) {
this.getList();
}
},
methods: {
gotopage(n) {
if (n == "logout") {
window.location.href = "/iam/api/logout";
} else if (n == "login") {
let path = this.$route.path;
window.location.href = "/iam/login/#/login?ReturnUrl=" + path;
} else {
this.$router.push(n);
}
},
settlement() {
this.$router.push({ name: "shoppingCart" });
},
deleteItem(id) {
let query = [id];
this.$api.serviceShop.delShoppingCart(query).then(response => {
this.getList();
});
},
getDetail() {
// if you want goto detail page, you should give me the type at first
// at here, we will goto shopping cart
this.$router.push({ name: "shoppingCart" });
},
navAction(index, path) {
this.$router.push(path);
this.now_menu = index;
window.sessionStorage.setItem("menuIndex", index);
},
gotoChildPage(v, parent) {
if (v.visit_url) {
if (v.visit_url == "/fwgl/" || v.visit_url == "/yygl/") {
this.$router.push(v.visit_url + this.$store.getters.level);
} else if (parent == 2) {
this.$router.push(v.visit_url);
this.$store.commit("serviceShopMenuAct", v.visit_url);
} else {
this.$router.push(v.visit_url);
}
this.now_menu = parent;
window.sessionStorage.setItem("menuIndex", parent);
}
},
getList() {
this.$api.serviceShop.getShoppingCart().then(response => {
if (response.data.success == "1") {
this.menuCartNum = response.data.data.valid
? response.data.data.valid.length
: 0;
this.shopping_list = response.data.data.valid
? response.data.data.valid.slice(0, 3)
: [];
} else {
console.log(response.data.message);
}
});
},
getMenuIndex() {
let index = window.sessionStorage.getItem("menuIndex");
console.log(index);
this.now_menu = index ? index : 2;
},
getNowMenu() {
this.$api.general.getNowMenu({ teamName: "APAAS3" }).then(response => {
if (response.data.success == 1) {
this.menu_arr = response.data.data[0].Child;
this.getMenuIndex();
}
});
}
}
};
</script>
<style scoped>
.menu {
width: 100%;
height: 84px;
background-color: #0f2683;
color: #8390ee;
line-height: 84px;
}
.logo {
float: left;
margin: 30px 0 0 40px;
}
.user {
float: right;
display: inline-block;
width: 140px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-right: 20px;
font-size: 16px;
}
.user_pic {
float: right;
margin-right: 10px;
margin-top: 26px;
width: 30px;
height: 30px;
}
.user_default {
float: right;
margin-right: 10px;
margin-top: 30px;
}
.car {
float: right;
width: 50px;
text-align: center;
position: relative;
}
.number {
position: absolute;
background-color: #e56600;
border-radius: 11px;
color: #fcefd6;
line-height: 18px;
height: 20px;
text-align: center;
left: 38px;
top: 26px;
z-index: 2;
}
.car_img {
position: relative;
top: 7px;
}
.menu_box {
float: right;
width: 185px;
text-align: center;
cursor: pointer;
position: relative;
}
.menu_box:nth-of-type(1) {
margin-right: 52px;
}
.bottom_show {
width: 24px;
height: 5px;
background-color: #e56600;
border-radius: 3px;
position: absolute;
bottom: 0px;
left: calc(50% - 12px);
}
.user_menu {
width: 135px;
background-color: #ffffff;
box-shadow: 0px 3px 6px 0px #f4f7fc;
border-radius: 8px;
position: absolute;
top: 80px;
left: -20px;
overflow: hidden;
display: none;
z-index: 1;
}
.shop_menu {
width: 280px;
background-color: #ffffff;
box-shadow: 0px 3px 6px 0px #f4f7fc;
border-radius: 8px;
position: absolute;
top: 80px;
left: -20px;
overflow: hidden;
display: none;
z-index: 1;
padding: 10px 20px;
}
.user_hover:hover .user_menu {
display: block;
}
.user_hover:hover .sj {
display: block;
}
.shop_hover {
height: 100%;
margin-right: 50px;
}
.shop_hover:hover .shop_menu {
display: block;
}
.shop_hover:hover .shop_sj {
display: block;
}
.user_menu div {
width: 135px;
height: 44px;
line-height: 44px;
text-align: center;
color: #0d1847;
}
.user_menu div:hover {
background-color: #e56600;
color: #fff;
}
.sj {
width: 16px;
height: 16px;
background-color: #e56600;
position: absolute;
top: 72px;
transform: rotate(45deg);
display: none;
}
.shop_sj {
width: 16px;
height: 16px;
background-color: #fff;
position: absolute;
top: 72px;
left: 20px;
transform: rotate(45deg);
display: none;
}
.shop_list_title {
color: #8890a7;
font-size: 14px;
height: 30px;
line-height: 30px;
}
.shop_list_cell {
height: 80px;
padding: 10px 0;
display: flex;
line-height: 26px;
}
.shop_line {
border-bottom: #f4f7fc 2px solid;
}
.shop_line:nth-last-child(2) {
border-bottom: 0;
}
.shop_img {
width: 60px;
height: 60px;
border-radius: 8px;
}
.shop_footer {
width: 100%;
height: 50px;
text-align: right;
padding: 15px 0;
line-height: 30px;
}
.shop_settlement {
background-color: #e56600;
color: #fcefd6;
}
.shop_cell_msgs {
width: calc(100% - 80px);
margin-left: 10px;
}
.shop_cell_name {
color: #2d3867;
font-size: 14px;
line-height: 24px;
}
.shop_cell_name:hover {
color: #0d0807;
}
.shop_cell_msg {
color: #8890a7;
font-size: 12px;
line-height: 18px;
}
.over_one {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>
<style>
.number .el-badge__content {
background-color: #e56600;
border: 0;
line-height: 18px;
padding: 0 7px;
}
</style>
\ No newline at end of file
...@@ -58,12 +58,13 @@ ...@@ -58,12 +58,13 @@
<el-input v-model="user_data.userTypeName" :disabled="true"></el-input> <el-input v-model="user_data.userTypeName" :disabled="true"></el-input>
<el-button <el-button
v-if="(user_data.userType == 3 || user_data.userType == 4) && couldUp" v-if="(user_data.userType == 3 || user_data.userType == 4) && couldUp"
:class="option_btn" class="option_btn"
@click="upLevel" @click="upLevel"
>升级为开发者</el-button> >升级为开发者</el-button>
<el-button <el-button
v-else-if="(user_data.userType == 3 || user_data.userType == 4) && !couldUp" v-else-if="(user_data.userType == 3 || user_data.userType == 4) && !couldUp"
type="info" type="info"
class="option_btn_gray_dis"
disabled disabled
>升级为开发者</el-button> >升级为开发者</el-button>
</el-form-item> </el-form-item>
...@@ -184,6 +185,7 @@ export default { ...@@ -184,6 +185,7 @@ export default {
}, },
data: () => ({ data: () => ({
activeName: "0", activeName: "0",
userId: "",
is_admin: 0, is_admin: 0,
user_data: { user_data: {
accountNo: "", accountNo: "",
...@@ -227,14 +229,15 @@ export default { ...@@ -227,14 +229,15 @@ export default {
this.$api.user.getNowUser().then(response => { this.$api.user.getNowUser().then(response => {
if (response.data.success == 1) { if (response.data.success == 1) {
this.is_admin = response.data.data.is_admin; this.is_admin = response.data.data.is_admin;
this.getUserInfo(response.data.data.user_id); this.userId = response.data.data.user_id;
this.getUserInfo();
} else { } else {
console.log(response.data.errMsg); console.log(response.data.errMsg);
} }
}); });
}, },
getUserInfo(id) { getUserInfo(id) {
this.$api.user.getUserDetail({ id: id }).then(response => { this.$api.user.getUserDetail({ id: this.userId }).then(response => {
if (response.data.success == 1) { if (response.data.success == 1) {
let data = response.data.data; let data = response.data.data;
this.user_data.accountNo = data.user_id; this.user_data.accountNo = data.user_id;
...@@ -298,6 +301,7 @@ export default { ...@@ -298,6 +301,7 @@ export default {
message: "修改个人信息成功", message: "修改个人信息成功",
type: "success" type: "success"
}); });
this.getUserInfo();
} else { } else {
this.$message({ this.$message({
message: "修改个人信息失败", message: "修改个人信息失败",
...@@ -333,6 +337,7 @@ export default { ...@@ -333,6 +337,7 @@ export default {
type: "success" type: "success"
}); });
this.diaPassWord = false; this.diaPassWord = false;
this.getUserInfo();
} else { } else {
this.$message({ this.$message({
message: "修改密码失败", message: "修改密码失败",
...@@ -342,20 +347,36 @@ export default { ...@@ -342,20 +347,36 @@ export default {
}); });
}, },
resetKey() { resetKey() {
this.$api.authority this.$confirm("此操作将重置您的密钥, 是否继续?", "提示", {
.resetUserKey({ user_id: this.user_data.accountNo }) confirmButtonText: "确定",
.then(response => { cancelButtonText: "取消",
if (response.data.success == 1) { cancelButtonClass: "msg_btn_gray",
this.$message({ confirmButtonClass: "msg_btn",
message: "重置密钥成功", type: "warning"
type: "success" })
.then(() => {
this.$api.authority
.resetUserKey({ user_id: this.user_data.accountNo })
.then(response => {
if (response.data.success == 1) {
this.$message({
message: "重置密钥成功",
type: "success"
});
this.getUserInfo();
} else {
this.$message({
message: "重置密钥失败",
type: "error"
});
}
}); });
} else { })
this.$message({ .catch(() => {
message: "重置密钥失败", this.$message({
type: "error" type: "info",
}); message: "已取消重置"
} });
}); });
}, },
upLevel() { upLevel() {
...@@ -366,6 +387,7 @@ export default { ...@@ -366,6 +387,7 @@ export default {
type: "success" type: "success"
}); });
this.couldUp = false; this.couldUp = false;
this.getUserInfo();
} else { } else {
this.$message({ this.$message({
message: "申请升级开发者失败", message: "申请升级开发者失败",
...@@ -458,9 +480,7 @@ export default { ...@@ -458,9 +480,7 @@ export default {
} }
.option_btn_gray_dis { .option_btn_gray_dis {
width: 124px; width: 124px;
background-color: #e3e5ef;
border-radius: 8px; border-radius: 8px;
color: #0f2683;
} }
.info_item { .info_item {
width: 70%; width: 70%;
...@@ -586,4 +606,23 @@ export default { ...@@ -586,4 +606,23 @@ export default {
line-height: 24px; line-height: 24px;
height: 24px; height: 24px;
} }
.msg_btn {
width: 70px;
background-color: #495feb;
border-radius: 8px;
color: #f8f9fd;
}
.msg_btn:hover {
background-color: #596ffb;
}
.msg_btn_gray {
width: 70px;
background-color: #e3e5ef;
border-radius: 8px;
color: #0f2683;
}
.msg_btn_gray:hover {
background-color: #e8eaf4;
color: #0f2683;
}
</style> </style>
\ No newline at end of file
...@@ -6,6 +6,9 @@ const general = { ...@@ -6,6 +6,9 @@ const general = {
logout(params) { logout(params) {
return axios.get(`/iam/api/logout?ReturnUrl=${encodeURIComponent(params.returnUrl)}`); return axios.get(`/iam/api/logout?ReturnUrl=${encodeURIComponent(params.returnUrl)}`);
}, },
getNowMenu(params) {
return axios.get(`/apaas/backmgt/menu/user/menu?teamName=${params.teamName}`);
},
} }
export default general; export default general;
Markdown is supported
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