Skip to content

A
apaas-ui
Commit f9407971 authored by 刘殿昕's avatar 刘殿昕
Browse files
Options

菜单购物车字段，云资源可缩容，订单，云详情

parent efd742cf
Expand all Show whitespace changes
Inline Side-by-side
Showing with 686 additions and 154 deletions
src/assets/css/index.css
View file @ f9407971
......@@ -67,7 +67,8 @@ html {
}
body {
margin: 0;
font-family: PingFangSC-Regular, sans-serif;
font-family: Microsoft YaHei, sans-serif;
/* font-size: 17px; */
}
ul {
list-style: none;
......
src/assets/i18n/language-zh.js
View file @ f9407971
......@@ -17,6 +17,9 @@ export const lang = {
// work bench
workBench: "工作台",
cloudResourcesService: "云资源服务",
cloudResourcesManagement: "云资源管理",
cloudResourcesDetail: "云资源详情",
// data analysis
dataAnalysis: "数据分析中心",
......
src/components/menu.vue
View file @ f9407971
......@@ -2,37 +2,54 @@
<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-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="
<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
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
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
v-for="(item, index) in shopping_list"
:key="'shopping' + index"
class="shop_list_cell shop_line"
>
<img :src="item.service_id == 0 ? item.application.logo : 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>
<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_name : item.service.sectors_name }}</p>
<p
class="shop_cell_msg over_one"
>{{ item.service_id == 0 ? item.application.org_name : item.service.organization_name }}</p>
</div>
<div>
<img @click.stop="deleteItem(item.id)" src="../assets/imgs/ic_delete.png" alt />
......@@ -46,12 +63,20 @@
</div>
<div style="float:right">
<div v-for="(item, index) in menu_arr" :key="index + 200" class="menu_box user_hover" @click="navAction(item.visit_url)" :style="{ color: now_menu == item.visit_url ? '#fff' : '' }">
<div
v-for="(item, index) in menu_arr"
:key="index + 200"
class="menu_box user_hover"
@click="navAction(item.visit_url)"
:style="{ color: now_menu == item.visit_url ? '#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, item.visit_url)">
{{ v.menu_name }}
</div>
<div
v-for="(v, indexs) in item.Child"
:key="indexs + 700"
@click.stop="gotoChildPage(v, item.visit_url)"
>{{ 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 == item.visit_url"></div>
......@@ -140,7 +165,6 @@ export default {
this.now_menu = parent;
window.sessionStorage.setItem("menuVisitUrl", parent);
}
},
getList() {
this.$api.serviceShop.getShoppingCart().then(response => {
......
src/components/shop-cloud/shop-cloud.vue
View file @ f9407971
This diff is collapsed.
src/components/shopping-cart/shopping-cart-cell.vue
View file @ f9407971
......@@ -35,10 +35,10 @@
v-if="cellIsService"
class="shopping_cell_type"
>{{ cellItems.service.sectors_name }}</div>
<div v-else class="shopping_cell_type">{{ cellItems.application.ywly }}</div>
<div v-else class="shopping_cell_type">{{ cellItems.application.ywly_name }}</div>
<div
class="shopping_cell_creator"
>{{ cellIsService ? cellItems.service.organization_name:cellItems.application.org }}</div>
>{{ cellIsService ? cellItems.service.organization_name:cellItems.application.org_name }}</div>
</div>
</div>
</div>
......@@ -119,6 +119,7 @@
</div>
</el-col>
<el-col :span="4" class="shopping_cell_num">
<div v-if="cellIsService">
<el-input-number
:disabled="readOnly"
v-model="cellItems.duration"
......@@ -126,6 +127,7 @@
size="mini"
:min="1"
></el-input-number>
</div>
</el-col>
<el-col :span="4" class="shopping_cell_options">
<el-checkbox
......
src/pages/service_shop/services_shop.vue
View file @ f9407971
......@@ -132,6 +132,7 @@ export default {
this.init("hotdata");
this.init("hgmap");
this.init("zhapp");
this.getGeneralOverview();
}
};
</script>
......
src/pages/user/order/order_detail.vue
View file @ f9407971
......@@ -177,26 +177,25 @@
</div>
<div v-if="orderDetail.order_type == 3">
<div class="detail_s_title">工作区域描述：</div>
<div class="detail_app_scence">{{ orderDetail.scene }}</div>
</div>
<div v-if="orderDetail.order_type == 3" class="params_block">
<span class="params_block_title">申请规格：</span>
<div class="params_block_item">
<div class="params_block_item_in">
<span class="params_block_item_title">CPU：</span>
<span class="params_block_item_val">2核</span>
<span class="params_block_item_val">{{ orderDetail.cpu }}核</span>
</div>
<div class="params_block_item_in">
<span class="params_block_item_title">内存：</span>
<span class="params_block_item_val">4GB</span>
<span class="params_block_item_val">{{ orderDetail.memory }}GB</span>
</div>
<div class="params_block_item_in">
<span class="params_block_item_title">容器组：</span>
<span class="params_block_item_val">2核</span>
<span class="params_block_item_val">{{ orderDetail.memory }}核</span>
</div>
<div class="params_block_item_in">
<span class="params_block_item_title">数据盘：</span>
<span class="params_block_item_val">2核</span>
<span class="params_block_item_val">{{ orderDetail.disk_num}}块，每块{{orderDetail.disk_cap }}GB</span>
</div>
</div>
<span class="params_block_title margin_top_20">单个容器组规格：</span>
......@@ -204,15 +203,15 @@
<div class="params_block_item_in">
<span class="params_block_item_title">CPU：</span>
<p class="params_block_item_val">
<span class="val_has_2">最高&nbsp;2核</span>
<span class="val_has_2">默认&nbsp;2核</span>
<span class="val_has_2">最高&nbsp;{{ orderDetail.one_cpu_max }}核</span>
<span class="val_has_2">默认&nbsp;{{ orderDetail.one_cpu_min }}核</span>
</p>
</div>
<div class="params_block_item_in">
<span class="params_block_item_title">CPU：</span>
<p class="params_block_item_val">
<span class="val_has_2">最高&nbsp;2核</span>
<span class="val_has_2">默认&nbsp;2核</span>
<span class="val_has_2">最高&nbsp;{{ orderDetail.one_memory_max }}核</span>
<span class="val_has_2">默认&nbsp;{{ orderDetail.one_memory_min }}核</span>
</p>
</div>
</div>
......@@ -706,7 +705,7 @@ export default {
line-height: 22px;
}
.params_block_title {
padding-left: 10px;
padding-left: 5px;
color: #242c43;
}
.params_block_item {
......@@ -719,12 +718,12 @@ export default {
}
.params_block_item_title {
color: #8890a7;
width: 120px;
width: 80px;
text-align: right;
}
.params_block_item_val {
color: #242c43;
width: calc(100% - 130px);
width: calc(100% - 82px);
}
.val_has_2 {
margin-right: 20px;
......
src/pages/workbench/fwgl/cloud-detail.vue 0 → 100644
View file @ f9407971
<template>
<div>
<el-breadcrumb separator="/" class="bread_crumb1 bread_left">
<el-breadcrumb-item
:to="{ path: getUrl() }"
>{{ this.$route.params.level == 1 ? $t('lang.cloudResourcesService') : $t('lang.cloudResourcesManagement') }}</el-breadcrumb-item>
<el-breadcrumb-item>{{ $t('lang.cloudResourcesDetail') }}</el-breadcrumb-item>
</el-breadcrumb>
<BlockRadius class="in_cloud_block">
<div class="cloud_block_head">
<div class="head_left">
<el-image class="head_left_img" :src="url" fit="fill"></el-image>
</div>
<div class="head_right">
<div class="head_right_name">aPaaS V3.0</div>
<div class="head_right_msg">
<p class="head_right_msg_p">
申请用户：
<span class="head_right_msg_item">张三</span>
联系电话：
<span class="head_right_msg_item">12345678901</span>
资源申请状态：
<span
class="head_right_msg_item"
:class="true ? 'apply_success' : ''"
>审批通过</span>
</p>
<p class="head_right_msg_p">
业务系统名：
<span class="head_right_msg_item">aPaaS V3.0 一期</span>
资源申请时间：
<span class="head_right_msg_item">2020-02-12 15:54:21</span>
</p>
</div>
</div>
</div>
<div class="cloud_params">
<InfoList @download="download" :list_arr="list_arr" class="detail_s_val">
<div ref="ApplyParams" slot="ApplyParams" class="params_block">
<span class="params_block_title">申请规格：</span>
<div class="params_block_item">
<div class="params_block_item_in">
<span class="params_block_item_title">CPU：</span>
<span class="params_block_item_val">{{ orderDetail.cpu }}核</span>
</div>
<div class="params_block_item_in">
<span class="params_block_item_title">内存：</span>
<span class="params_block_item_val">{{ orderDetail.memory }}GB</span>
</div>
<div class="params_block_item_in">
<span class="params_block_item_title">容器组：</span>
<span class="params_block_item_val">{{ orderDetail.memory }}核</span>
</div>
<div class="params_block_item_in">
<span class="params_block_item_title">数据盘：</span>
<span
class="params_block_item_val"
>{{ orderDetail.disk_num}}块，每块{{orderDetail.disk_cap }}GB</span>
</div>
</div>
<span class="params_block_title margin_top_20">单个容器组规格：</span>
<div class="params_block_item">
<div class="params_block_item_in">
<span class="params_block_item_title">CPU：</span>
<div class="params_block_item_val">
<span class="val_has_2">最高&nbsp;{{ orderDetail.one_cpu_max }}核</span>
<span class="val_has_2">默认&nbsp;{{ orderDetail.one_cpu_min }}核</span>
</div>
</div>
<div class="params_block_item_in">
<span class="params_block_item_title">CPU：</span>
<div class="params_block_item_val">
<span class="val_has_2">最高&nbsp;{{ orderDetail.one_memory_max }}核</span>
<span class="val_has_2">默认&nbsp;{{ orderDetail.one_memory_min }}核</span>
</div>
</div>
</div>
</div>
<div ref="ApplyDesc" slot="ApplyDesc">
{{ desc }}
</div>
</InfoList>
</div>
</BlockRadius>
</div>
</template>
<script>
import BlockRadius from "@/components/general/block-radius";
import InfoList from "@/components/infoList";
import helper from "@/services/helper.js";
export default {
components: {
BlockRadius,
InfoList
},
data() {
return {
url:
"https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
orderDetail: {},
helper,
list_arr: [
{
title: "云资源详情：",
prop: "title"
},
{
title: "工作区域申请规格：",
type: "solt",
solt_name: "ApplyParams"
},
{
title: "资源申请文件：",
info: "2222222222222222222222.docs",
url: "",
type: "down"
},
{
title: "工作区域描述：",
type: "solt",
solt_name: "ApplyDesc",
}
],
desc: "工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述："
};
},
watch: {},
computed: {},
created() {},
mounted() {
this.getUrl();
},
methods: {
getUrl() {
return this.$route.path.substring(0, 9);
},
download() {}
}
};
</script>
<style>
.in_cloud_block {
margin: 0 20px;
}
.cloud_block_head {
padding-top: 10px;
display: flex;
justify-content: space-between;
margin-bottom: 30px;
}
.head_left {
width: 150px;
}
.head_left_img {
width: 144px;
height: 144px;
border-radius: 8px;
}
.head_right {
width: calc(100% - 160px);
}
.head_right_name {
font-size: 18px;
font-weight: bold;
color: #0d1847;
line-height: 30px;
margin-left: 10px;
margin-bottom: 18px;
}
.head_right_msg {
border-radius: 8px;
height: 96px;
background-color: #f6f7fb;
padding: 10px 20px;
}
.head_right_msg_p {
font-size: 14px;
line-height: 38px;
color: #8890a7;
}
.head_right_msg_item {
display: inline-block;
font-size: 14px;
font-weight: bold;
color: #242c43;
margin-right: 48px;
}
.apply_success {
color: #515fe7;
}
.cloud_params .service_title {
padding: 0 10px;
}
.cloud_params p {
padding: 0 15px;
}
.cloud_params p span {
display: inline;
line-height: 21px;
}
.params_block {
background-color: #f8f9fd;
border-radius: 8px;
margin: 10px 0;
padding: 20px;
font-size: 14px;
line-height: 22px;
}
.params_block_title {
padding-left: 5px;
color: #242c43;
}
.params_block_item {
padding: 10px 0 0 0;
}
.params_block_item_in {
display: flex;
justify-content: space-between;
margin-bottom: 5px;
}
.params_block_item_title {
color: #8890a7;
width: 80px;
text-align: right;
}
.params_block_item_val {
color: #242c43;
width: calc(100% - 82px);
}
.margin_top_20 {
display: block;
margin-top: 20px;
}
</style>
src/router/index.js
View file @ f9407971
......@@ -68,6 +68,11 @@ export default new Router({
component: () =>
import("@/pages/workbench/fwgl/approval_service_detail"),
}, // 审批的服务 - 详情
{
path: "/fwgl/:level/:type/cloud_detail/:id",
name: "servicedetail",
component: () => import("@/pages/workbench/fwgl/cloud-detail"),
}, // 云资源 - 详情
],
}, // 工作台 - 服务管理模块
{
......
yarn.lock
View file @ f9407971
......@@ -6074,6 +6074,11 @@ resize-detector@^0.1.10:
resolved "https://registry.yarnpkg.com/resize-detector/-/resize-detector-0.1.10.tgz#1da3f961aa5f914ccbcfd3752d52fd45beeb692c"
integrity sha512-iLcXC8A6Fb0DfA+TRiywrK/0A22bFqkhntjMJMEzXDA4XkcEkfwpNbv7W8iewUiD0xYIaeiXOfiEehTqGKsUFw==
resize-detector@^0.2.2:
version "0.2.2"
resolved "https://registry.npm.taobao.org/resize-detector/download/resize-detector-0.2.2.tgz#b207e72912bef0bda9fb825fe894ed9686ca965e"
integrity sha1-sgfnKRK+8L2p+4Jf6JTtlobKll4=
resize-observer-polyfill@^1.5.0:
version "1.5.1"
resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz#0e9020dd3d21024458d4ebd27e23e40269810464"
......@@ -7207,6 +7212,13 @@ vue-router@^3.0.2:
resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-3.1.6.tgz#45f5a3a3843e31702c061dd829393554e4328f89"
integrity sha512-GYhn2ynaZlysZMkFE5oCHRUTqE8BWs/a9YbKpNLi0i7xD6KG1EzDqpHQmv1F5gXjr8kL5iIVS8EOtRaVUEXTqA==
vue-sparklines@^0.2.1:
version "0.2.1"
resolved "https://registry.npm.taobao.org/vue-sparklines/download/vue-sparklines-0.2.1.tgz#2c754b49af5d86a62308930f72bad8fc376d3beb"
integrity sha1-LHVLSa9dhqYjCJMPcrrY/DdtO+s=
dependencies:
vue "^2.2.1"
vue-style-loader@^4.1.0, vue-style-loader@^4.1.2:
version "4.1.2"
resolved "https://registry.yarnpkg.com/vue-style-loader/-/vue-style-loader-4.1.2.tgz#dedf349806f25ceb4e64f3ad7c0a44fba735fcf8"
......@@ -7228,7 +7240,7 @@ vue-template-es2015-compiler@^1.9.0:
resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==
vue@^2.6.10:
vue@^2.2.1, vue@^2.6.10:
version "2.6.11"
resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.11.tgz#76594d877d4b12234406e84e35275c6d514125c5"
integrity sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ==
......
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