Skip to content

A
apaas-ui
Commit c84dd1a3 authored by 徐一鸣's avatar 徐一鸣
Browse files
Options

服务管理-云资源列表调试

parent f1941108
Show whitespace changes
Inline Side-by-side
Showing with 373 additions and 167 deletions
package.json
View file @ c84dd1a3
......@@ -31,6 +31,7 @@
"vue-i18n": "^8.17.7",
"vue-resource": "^1.5.1",
"vue-router": "^3.0.2",
"vue-sparklines": "^0.2.1",
"vuex": "^3.1.0"
},
"devDependencies": {
......
src/components/allot-info-confirm.vue 0 → 100644
View file @ c84dd1a3
<template>
<apass-dialog
ref="confrim"
class="allot_info_confirm"
width="600px"
title="分配信息确认"
>
<template slot="content">
<div class="confirm_container">
<div class="info_list" style="width: 100%;">
<p class="info_text text_grey">申请组织：</p>
<p
class="info_text"
v-text="(detail && detail['a_申请组织']) || ''"
></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>
</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>
</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>
</div>
<div class="info_list" style="width: 100%;">
<!-- <p class="detail_title info_text text_grey">原规格：</p> -->
<div class="detail_info">
<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>
</p>
<p class="info_text info_cell">
<span class="text_grey">中文名称：</span>
<span v-text="(detail && detail['a_中文名称']) || ''"></span>
</p>
<p class="info_text info_cell">
<span class="text_grey">描述信息：</span>
<span v-text="(detail && detail['a_描述信息']) || ''"></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>
</p>
<p class="info_text info_cell">
<span class="text_grey"> 内存：</span>
<span v-text="(detail && detail['a_内存']) || ''"></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>
</p>
</div>
</div>
</div>
</div>
</template>
<template slot="action">
<el-button type="defalut" size="mini" @click="hideDialog">
取消
</el-button>
<el-button type="primary" size="mini" @click="confrimAction">
确认提交
</el-button>
</template>
</apass-dialog>
</template>
<script>
import apassDialog from "@/components/apass-dialog";
export default {
components: { apassDialog },
data: () => ({
detail: null,
}),
methods: {
showDialog() {
this.$refs.confrim.show();
},
hideDialog() {
this.$refs.confrim.hide();
},
getDetail(applyid) {
this.$http
.get("/apaas/service/v3/resource/user/apply/approveddetail", {
params: {
type: 0,
applyid: applyid,
},
})
.then(({ data }) => {
if (data.success) {
console.log(data.data);
// this.detail = data.data;
} else {
this.$message({
message: "获取详情失败",
type: "warning",
});
}
})
.catch((error) => {
this.$message({
message: "获取详情失败",
type: "warning",
});
});
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");
},
},
};
</script>
<style scoped>
.confirm_container {
display: flex;
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
flex-wrap: wrap;
text-align: left;
}
.info_list + .info_list,
.detail_list + .detail_list {
margin-top: 15px;
}
.info_text {
font-size: 14px;
line-height: 27px;
color: #242c43;
}
.text_grey {
color: #8890a7;
}
.detail_title {
margin-bottom: 7px;
}
.detail_info {
background-color: #f8f9fd;
padding: 15px;
border-radius: 7px;
overflow: hidden;
}
.info_cell {
display: flex;
justify-content: flex-start;
align-items: flex-start;
}
.info_cell > span:nth-child(1) {
width: 8em;
flex-shrink: 0;
text-align: right;
margin-right: 10px;
}
.info_cell > span:nth-child(2) {
flex-grow: 1;
}
</style>
src/pages/workbench/fwgl/fwglList.vue
View file @ c84dd1a3
......@@ -58,6 +58,8 @@
:msg="dialogInfo.msg"
:submit="dialogInfo.submit"
></apass-dialog>
<allot-info-confirm ref="allotConfirm"></allot-info-confirm>
</div>
</template>
......@@ -67,10 +69,16 @@ import { mapState } from "vuex";
import helper from "@/services/helper.js";
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";
export default {
components: { apassList, apassDialog, Dashboard },
components: {
apassList,
apassDialog,
allotInfoConfirm,
Dashboard,
},
data: () => ({
level: 0, // 用户等级
type: 0, // 访问的页面
......@@ -368,78 +376,55 @@ export default {
}
// 普通用户 --- 云资源服务
else if (level == 0 && type == 2) {
this.listUrl = "";
this.listUrl = "/apaas/service/v3/resource/user/apply/list";
this.paddingLeft = 0;
this.filterList2 = [
{
name: "初次申请状态",
prop: "state1",
default: 0,
default: "",
options: [
{
name: "全部",
value: 0,
value: "",
},
{
name: "待审批",
value: 1,
value: 0,
},
{
name: "审批通过",
value: 2,
value: 1,
},
{
name: "审批未通过",
value: 3,
value: -1,
},
],
},
{
name: "资源调整状态",
prop: "state2",
default: 0,
default: "",
options: [
{
name: "全部",
value: 0,
value: "",
},
{
name: "待审批",
value: 1,
},
{
name: "审批通过",
value: 2,
},
{
name: "审批未通过",
value: 3,
},
],
},
/* {
name: "申请状态",
prop: "state3",
default: 0,
options: [
{
name: "全部",
value: 0,
},
{
name: "待审批",
value: 1,
},
{
name: "审批通过",
value: 2,
value: 1,
},
{
name: "审批未通过",
value: 3,
value: -1,
},
],
}, */
},
];
this.listHeader = [
{
......@@ -454,23 +439,23 @@ export default {
},
{
label: "工作区域",
prop: "name",
prop: "name_space",
type: "button",
callback: this.cloudDetail,
},
{
label: "CPU（核）",
prop: "name",
prop: "cpu",
align: "center",
},
{
label: "内存（GB）",
prop: "name",
prop: "memory",
align: "center",
},
{
label: "容器组（个）",
prop: "name",
prop: "containers",
align: "center",
},
{
......@@ -478,15 +463,18 @@ export default {
type: "tooltip",
align: "center",
getLength(item) {
return item.sjp.length;
let disks = (item.disk && item.disk.trim().split(" ")) || [];
return disks.length;
},
getText(item) {
return item.sjp[0];
let disks = (item.disk && item.disk.trim().split(" ")) || [];
return disks[0];
},
getContent(item) {
let disks = (item.disk && item.disk.trim().split(" ")) || [];
let htmlStr = `<span>数据盘（块/GB）</span><br />`;
item.sjp.forEach((v) => {
disks.forEach((v) => {
htmlStr += `<span>数据盘：${v}</span><br />`;
});
......@@ -495,35 +483,26 @@ export default {
},
{
label: "申请时间",
prop: "name",
prop: "apply_time",
align: "center",
},
{
label: "初次申请状态",
prop: "name",
align: "center",
getText(item) {
return ["未通过", "待审批", "通过"][
(item.approve_state || 0) + 1
];
},
},
{
label: "资源调整结果",
prop: "name",
align: "center",
},
getText(item) {
return ["未通过", "待审批", "通过"][
(item.approve_update_state || 0) + 1
];
this.listData = [
{
name: "区域1",
state: 0,
sjp: ["8/60"],
},
{
name: "区域2",
state: 1,
sjp: ["2/3", "22/33"],
},
{
name: "区域3",
state: 0,
sjp: ["2/100", "22/33", "55/66"],
},
];
}
......@@ -736,52 +715,52 @@ export default {
}
// 组织管理员 --- 云资源管理
else if (level == 1 && type == 2) {
this.listUrl = "";
this.listUrl = "/apaas/service/v3/resource/user/apply/list";
this.paddingLeft = 0;
this.filterList2 = [
{
name: "初次申请状态",
prop: "state1",
default: 0,
default: "",
options: [
{
name: "全部",
value: 0,
value: "",
},
{
name: "待审批",
value: 1,
value: 0,
},
{
name: "审批通过",
value: 2,
value: 1,
},
{
name: "审批未通过",
value: 3,
value: -1,
},
],
},
{
name: "资源调整状态",
prop: "state2",
default: 0,
default: "",
options: [
{
name: "全部",
value: 0,
value: "",
},
{
name: "待审批",
value: 1,
value: 0,
},
{
name: "审批通过",
value: 2,
value: 1,
},
{
name: "审批未通过",
value: 3,
value: -1,
},
],
},
......@@ -799,53 +778,79 @@ export default {
},
{
label: "工作区域名称",
prop: "name",
prop: "name_space",
type: "button",
callback: this.cloudDetail,
},
{
label: "CPU（核）",
prop: "name",
prop: "cpu",
align: "center",
},
{
label: "内存（GB）",
prop: "name",
prop: "memory",
align: "center",
},
{
label: "容器组（个）",
prop: "name",
prop: "containers",
align: "center",
},
{
label: "数据盘（块/GB）",
prop: "name",
type: "tooltip",
align: "center",
getLength(item) {
let disks = (item.disk && item.disk.trim().split(" ")) || [];
return disks.length;
},
getText(item) {
let disks = (item.disk && item.disk.trim().split(" ")) || [];
return disks[0];
},
getContent(item) {
let disks = (item.disk && item.disk.trim().split(" ")) || [];
let htmlStr = `<span>数据盘（块/GB）</span><br />`;
disks.forEach((v) => {
htmlStr += `<span>数据盘：${v}</span><br />`;
});
return htmlStr;
},
},
{
label: "申请用户",
prop: "name",
prop: "user_name",
align: "center",
},
{
label: "业务系统名",
prop: "name",
prop: "system_name",
align: "center",
},
{
label: "初次申请状态",
prop: "name",
align: "center",
getText(item) {
return ["未通过", "待审批", "通过"][
(item.approve_state || 0) + 1
];
},
},
{
label: "资源调整状态",
prop: "name",
label: "资源调整结果",
align: "center",
getText(item) {
return ["未通过", "待审批", "通过"][
(item.approve_update_state || 0) + 1
];
},
},
{
label: "用户申请时间",
prop: "name",
prop: "apply_time",
align: "center",
},
{
......@@ -855,68 +860,17 @@ export default {
width: 80,
actionList: [
{
label: "分配",
getLabel(item) {
return item.allot == 0 ? "分配" : "已分配";
return item.use_uid ? "已分配" : "分配";
},
callback: this.cloudAllot,
disabledRule(item) {
return item.allot == 1;
return item.use_uid;
},
},
],
},
];
this.listData = [
{
name: "区域1",
state: 0,
sjp: ["8/60"],
allot: 1,
},
{
name: "区域2",
state: 1,
sjp: ["2/3", "22/33"],
allot: 0,
},
{
name: "区域3",
state: 0,
sjp: ["2/100", "22/33", "55/66"],
allot: 1,
},
];
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: "（个）",
},
],
};
}
// 超级管理员 --- 平台服务管理
......@@ -1136,7 +1090,8 @@ export default {
}
// 超级管理员 --- 云资源管理
else if (level == 2 && type == 2) {
this.cloud_admin = {
this.listUrl = "/apaas/service/v3/resource/user/apply/list";
/* this.cloud_admin = {
dashboard_list: [
{
name: "cpu使用量",
......@@ -1164,7 +1119,7 @@ export default {
},
],
histogram: {},
};
}; */
}
// Error
......@@ -1173,17 +1128,30 @@ export default {
}
},
init(filter) {
console.log(filter);
// console.log(filter);
if (!this.listUrl) {
return;
}
let params = {};
this.tempFliter = filter;
this.$http
.get(this.listUrl, {
params: {
if (this.type == 2) {
params = {
search: filter.keyword,
page: filter.page,
limit: filter.size,
depart: "",
state1: filter.state1,
State2: filter.State2,
};
} else {
params = {
keyword: filter.keyword,
page: filter.page,
size: filter.size,
data_service_type:
(filter.service_type_1 &&
filter.service_type_1.map((item) => item.value).join(",")) ||
......@@ -1200,15 +1168,52 @@ export default {
(filter.state &&
filter.state.map((item) => item.value).join(",")) ||
"", // 服务状态
keyword: filter.keyword,
page: filter.page,
size: filter.size,
},
})
};
}
this.$http
.get(this.listUrl, { params })
.then(({ data }) => {
// console.log(data.data);
// console.log(data);
if (this.type == 2) {
this.listTotal = data.total;
this.listData = data.data.cloud_apply_list;
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: "（个）",
},
],
};
} else {
this.listTotal = data.data.total;
this.listData = data.data.data;
}
})
.catch((error) => {
console.log(error);
......@@ -1406,7 +1411,7 @@ export default {
console.log("cloudDetail - " + item.name);
},
cloudAllot(item) {
console.log("cloudAllot - " + item.name);
this.$refs.allotConfirm.getDetail(item.apply_id);
},
getDashboardOptions(item) {
let percent = Math.round((item.value / item.total) * 100);
......
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