Commit 85c35d50 authored by 徐一鸣's avatar 徐一鸣

服务管理-云资源列表(普通用户和组织管理员)接口调试完毕

parent c84dd1a3
......@@ -11,29 +11,23 @@
<p class="info_text text_grey">申请组织:</p>
<p
class="info_text"
v-text="(detail && detail['a_申请组织']) || ''"
v-text="(detail && detail['department_name']) || '-'"
></p>
</div>
<div class="info_list" style="width: 50%;">
<p class="info_text text_grey">申请用户:</p>
<p
class="info_text"
v-text="(detail && detail['a_申请用户']) || ''"
v-text="(detail && detail['user_name']) || '-'"
></p>
</div>
<div class="info_list" style="width: 50%;">
<p class="info_text text_grey">联系电话:</p>
<p
class="info_text"
v-text="(detail && detail['a_联系电话']) || ''"
></p>
<p class="info_text" v-text="(detail && detail['phone']) || '-'"></p>
</div>
<div class="info_list" style="width: 100%;">
<p class="info_text text_grey">上传申请文件:</p>
<p
class="info_text"
v-text="(detail && detail['a_上传申请文件']) || ''"
></p>
<p class="info_text" v-text="(detail && detail['file']) || '-'"></p>
</div>
<div class="info_list" style="width: 100%;">
<!-- <p class="detail_title info_text text_grey">原规格:</p> -->
......@@ -42,35 +36,37 @@
<p class="info_text">基本信息:</p>
<p class="info_text info_cell">
<span class="text_grey">工作区域名称:</span>
<span
v-text="(detail && detail['a_工作区域名称']) || ''"
></span>
<span v-text="(detail && detail['namespace']) || '-'"></span>
</p>
<p class="info_text info_cell">
<span class="text_grey">中文名称:</span>
<span v-text="(detail && detail['a_中文名称']) || ''"></span>
<span v-text="(detail && detail['workplace']) || '-'"></span>
</p>
<p class="info_text info_cell">
<span class="text_grey">描述信息:</span>
<span v-text="(detail && detail['a_描述信息']) || ''"></span>
<span
v-text="(detail && detail['workplacedesc']) || '-'"
></span>
</p>
</div>
<div class="detail_list">
<p class="info_text">工作区域申请规格:</p>
<p class="info_text info_cell">
<span class="text_grey">CPU:</span>
<span v-text="(detail && detail['a_CPU']) || ''"></span>
<span v-text="(detail && detail['cpu']) || '-'"></span>
</p>
<p class="info_text info_cell">
<span class="text_grey"> 内存:</span>
<span v-text="(detail && detail['a_内存']) || ''"></span>
<span v-text="(detail && detail['memory']) || '-'"></span>
</p>
</div>
<div class="detail_list">
<p class="info_text">申请时长:</p>
<p class="info_text info_cell">
<span class="text_grey"> 申请时长:</span>
<span v-text="(detail && detail['a_申请时长']) || ''"></span>
<span
v-text="(detail && detail['duration_time']) || '-'"
></span>
</p>
</div>
</div>
......@@ -82,7 +78,12 @@
<el-button type="defalut" size="mini" @click="hideDialog">
取消
</el-button>
<el-button type="primary" size="mini" @click="confrimAction">
<el-button
type="primary"
size="mini"
:loading="submitLoading"
@click="confrimAction"
>
确认提交
</el-button>
</template>
......@@ -96,6 +97,7 @@ export default {
components: { apassDialog },
data: () => ({
detail: null,
submitLoading: false,
}),
methods: {
showDialog() {
......@@ -104,18 +106,22 @@ export default {
hideDialog() {
this.$refs.confrim.hide();
},
getDetail(applyid) {
getDetail(apply_id) {
this.$http
.get("/apaas/service/v3/resource/user/apply/approveddetail", {
.get("/apaas/service/v3/resource/apply/distributionDisplay", {
params: {
type: 0,
applyid: applyid,
apply_id: apply_id,
},
})
.then(({ data }) => {
if (data.success) {
console.log(data.data);
// this.detail = data.data;
let datas = data.data;
this.detail = {
...datas,
cpu: `最高${datas.max_cpu}核,默认${datas.min_cpu}核`,
memory: `最高${datas.max_memory}GB,默认${datas.min_memory}GB`,
};
} else {
this.$message({
message: "获取详情失败",
......@@ -130,24 +136,44 @@ export default {
});
});
this.detail = {
a_申请组织: "贵州省交通运输厅",
a_申请用户: "贵州省交通运输厅",
a_联系电话: "13523232333",
a_上传申请文件: "云资源申请修改意见V2.0审批审批函.pdf",
a_工作区域名称: "aPaaS-V3.0",
a_中文名称: "aPaaS平台V3.0",
a_描述信息:
"用于部署运行aPaaS平台V3.0用于部署运行aPaaS平台V3.0用于部署运行aPaaS平台V3.0",
a_CPU: "最高2核,默认1核",
a_内存: "最高2GB,默认1GB",
a_申请时长: "6个月",
};
this.showDialog();
},
confrimAction() {
console.log("confrim");
this.submitLoading = true;
this.$http
.put("/apaas/service/v3/resource/apply/distribution", null, {
params: {
id: this.detail.id,
user_id: this.detail.user_id,
},
})
.then(({ data }) => {
this.submitLoading = false;
if (data.success) {
this.$message({
message: "分配成功",
type: "success",
});
this.$emit("allot-success");
this.hideDialog();
} else {
this.$message({
message: "分配失败",
type: "warning",
});
}
})
.catch((error) => {
this.submitLoading = false;
this.$message({
message: "分配失败",
type: "warning",
});
});
},
},
};
......
<template>
<div class="organization_card">
<a class="remove_btn" @click.prevent="deleteAction">
<a class="remove_btn" @click.prevent="deleteAction" v-if="!hideDelete">
<i class="el-icon-close"></i>
</a>
<div class="organization_card-icon">
<el-avatar shape="square" :size="56" fit="cover" :src="data.picture_path" />
<el-avatar
shape="square"
:size="56"
fit="cover"
:src="data.picture_path"
/>
</div>
<div class="organization_card-info">
<p
......@@ -52,9 +57,12 @@ export default {
type: String,
default: 0,
},
hideDelete: {
type: Boolean,
default: false,
},
},
created(){
},
created() {},
methods: {
deleteAction() {
this.$emit("delete-action", this.data);
......
......@@ -5,6 +5,7 @@
:key="'organization_card_' + index"
:data="item"
@delete-action="deleteAction"
:hide-delete="hideDelete"
:details-url="detailsUrl"
:style="{ width: 'calc(100% / ' + rowNum + ' - 36px)' }"
></organization-card>
......@@ -27,6 +28,10 @@ export default {
type: String,
default: 0,
},
hideDelete: {
type: Boolean,
default: false,
},
},
data: () => ({
rowNum: 5,
......
......@@ -18,10 +18,10 @@
<template slot="top">
<div class="cloud_info" v-if="cloud_zuzhi">
<div class="zuzhi_title">
<span>{{ cloud_zuzhi.org_name }}</span>
<div class="cloud_title">
<span>{{ userInfo && userInfo.department_name }}</span>
<span>
{{ "在用工作区域:" + (cloud_zuzhi.used_area || 0) + "" }}
{{ "在用工作区域:" + cloud_zuzhi.count_zy + "" }}
</span>
</div>
<div class="dashboard_contaner">
......@@ -45,11 +45,49 @@
</div>
</div>
</div>
<div class="cloud_info" v-if="cloud_admin">
<div class="cloud_title">
<span>云资源概览</span>
</div>
<div class="dashboard_contaner">
<div
class="dashborad_list"
v-for="(item, index) in cloud_admin.dashboard_list"
:key="index"
>
<chart
:options="getDashboardOptions(item)"
class="dashboard_chart"
/>
<p class="dashboard_info">
<span>物理总量</span>
<span v-text="item.total + item.unit"></span>
</p>
<p class="dashboard_info">
<span>剩余量</span>
<span v-text="item.value + item.unit"></span>
</p>
</div>
</div>
</div>
</template>
<template slot="header-left">
<div class="cloud_title" v-if="cloud_admin">
<span>组织概览</span>
</div>
</template>
<div slot="list" v-if="level == 2 && type == 2">
<p style="text-align: center;margin-top: 20px;">组织列表</p>
</div>
<!-- 超管的云资源管理展示的是组织列表 -->
<template slot="list" v-if="level == 2 && type == 2">
<organization-list
slot="list"
:data="listData"
details-url="/authority/organization/detail/"
:hide-delete="true"
></organization-list>
</template>
</apass-list>
<apass-dialog
......@@ -59,7 +97,10 @@
:submit="dialogInfo.submit"
></apass-dialog>
<allot-info-confirm ref="allotConfirm"></allot-info-confirm>
<allot-info-confirm
ref="allotConfirm"
@allot-success="allotSuccess"
></allot-info-confirm>
</div>
</template>
......@@ -71,6 +112,7 @@ import apassList from "@/components/apass-list";
import apassDialog from "@/components/apass-dialog";
import allotInfoConfirm from "@/components/allot-info-confirm";
import Dashboard from "@/components/e-charts/dashboard";
import organizationList from "@/components/organization-list/organization-list";
export default {
components: {
......@@ -78,6 +120,7 @@ export default {
apassDialog,
allotInfoConfirm,
Dashboard,
organizationList,
},
data: () => ({
level: 0, // 用户等级
......@@ -103,6 +146,7 @@ export default {
computed: {
...mapState({
fwglNav: "fwglNav",
userInfo: "userInfo",
}),
pathName() {
return this.fwglNav[this.level][this.type];
......@@ -1091,35 +1135,6 @@ export default {
// 超级管理员 --- 云资源管理
else if (level == 2 && type == 2) {
this.listUrl = "/apaas/service/v3/resource/user/apply/list";
/* this.cloud_admin = {
dashboard_list: [
{
name: "cpu使用量",
value: 6,
total: 10,
unit: "(核)",
},
{
name: "内存使用量",
value: 13,
total: 20,
unit: "(GB)",
},
{
name: "数据盘使用量",
value: 240,
total: 560,
unit: "(GB)",
},
{
name: "容器组使用量",
value: 10,
total: 18,
unit: "(个)",
},
],
histogram: {},
}; */
}
// Error
......@@ -1145,7 +1160,7 @@ export default {
limit: filter.size,
depart: "",
state1: filter.state1,
State2: filter.State2,
state2: filter.state2,
};
} else {
params = {
......@@ -1177,39 +1192,70 @@ export default {
// console.log(data);
if (this.type == 2) {
this.listTotal = data.total;
this.listData = data.data.cloud_apply_list;
const cloud = data.data.cloud_resource_count;
this.cloud_zuzhi = {
org_name: "北京比格大数据",
used_area: 2,
dashboard_list: [
{
name: "cpu使用量",
value: 6,
total: 10,
unit: "(核)",
},
{
name: "内存使用量",
value: 13,
total: 20,
unit: "(GB)",
},
{
name: "数据盘使用量",
value: 500,
total: 560,
unit: "(GB)",
},
{
name: "容器组使用量",
value: 10,
total: 18,
unit: "(个)",
},
],
};
if (this.level == 1) {
this.listTotal = data.total;
this.listData = data.data.cloud_apply_list;
this.cloud_zuzhi = {
count_zy: cloud.count_zy,
dashboard_list: [
{
name: "cpu使用量",
value: cloud.cpu_use,
total: cloud.cpu_total,
unit: "(核)",
},
{
name: "内存使用量",
value: cloud.memory_use,
total: cloud.memory_total,
unit: "(GB)",
},
{
name: "数据盘使用量",
value: cloud.disk_use,
total: cloud.disk_total,
unit: "(GB)",
},
{
name: "容器组使用量",
value: cloud.containers_use,
total: cloud.containers_total,
unit: "(个)",
},
],
};
} else if (this.level == 2) {
this.cloud_admin = {
dashboard_list: [
{
name: "cpu使用量",
value: cloud.cpu_use,
total: cloud.cpu_total,
unit: "(核)",
},
{
name: "内存使用量",
value: cloud.memory_use,
total: cloud.memory_total,
unit: "(GB)",
},
{
name: "数据盘使用量",
value: cloud.disk_use,
total: cloud.disk_total,
unit: "(GB)",
},
{
name: "容器组使用量",
value: cloud.containers_use,
total: cloud.containers_total,
unit: "(个)",
},
],
};
}
} else {
this.listTotal = data.data.total;
this.listData = data.data.data;
......@@ -1218,6 +1264,27 @@ export default {
.catch((error) => {
console.log(error);
});
// 超管的云资源管理展示的是组织列表
if (this.level == 2 && this.type == 2) {
this.$http
.get("/apaas/backmgt/department/list", {
params: {
search: filter.keyword,
page: filter.page,
limit: filter.size,
},
})
.then(({ data }) => {
// console.log(data);
this.listTotal = data.total;
this.listData = data.data;
})
.catch((error) => {
console.log(error);
});
}
},
showDialog() {
this.$refs.dialog.show();
......@@ -1414,7 +1481,7 @@ export default {
this.$refs.allotConfirm.getDetail(item.apply_id);
},
getDashboardOptions(item) {
let percent = Math.round((item.value / item.total) * 100);
let percent = Math.round((item.value / item.total) * 100) || 0;
let colors = ["#515fe7", "#e7ecfd"];
if (percent >= 80) {
......@@ -1569,6 +1636,9 @@ export default {
],
};
},
allotSuccess() {
this.init(this.tempFliter);
},
},
created() {
this.level = parseInt(this.$route.params.level);
......@@ -1599,35 +1669,36 @@ export default {
.service_management_list {
height: 100%;
}
.zuzhi_title {
.cloud_title {
margin-top: 15px;
}
.zuzhi_title > span,
.zuzhi_title > span::before {
.cloud_title > span,
.cloud_title > span::before {
display: inline-block;
vertical-align: middle;
}
.zuzhi_title > span:nth-child(1)::before {
.cloud_title > span:nth-child(1)::before {
content: "";
width: 4px;
height: 16px;
border-radius: 2px;
background-color: #515fe7;
margin-right: 10px;
margin-bottom: 2px;
}
.zuzhi_title > span:nth-child(1) {
.cloud_title > span:nth-child(1) {
font-size: 16px;
color: #242c43;
line-height: 30px;
}
.zuzhi_title > span:nth-child(2)::before {
.cloud_title > span:nth-child(2)::before {
content: "";
width: 2px;
height: 12px;
background-color: #b4c0f5;
margin: 0 10px;
}
.zuzhi_title > span:nth-child(2) {
.cloud_title > span:nth-child(2) {
font-size: 14px;
line-height: 1;
color: #58617a;
......
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