Skip to content

A
apaas-ui
Commit 0535e684 authored by 张俊's avatar 张俊
Browse files
Options

Merge branch 'dev' of cloud.wodcloud.com:apaas/apaas-v3-ui into dev

parents 5db1bf6c 12a6333b
Hide whitespace changes
Inline Side-by-side
Showing with 275 additions and 389 deletions
src/components/e-charts/histogramScroll.vue 0 → 100644
View file @ 0535e684
<template>
<chart
ref="adminHistogram"
:options="getHistogramOption()"
style="width:100%;height:100%;"
/>
</template>
<script>
export default {
props: {
xAxis: {
type: Array,
default: () => [],
},
series: {
type: Array,
default: () => [],
},
},
methods: {
getHistogramOption() {
let _self = this;
return {
tooltip: {
trigger: "axis",
backgroundColor: "#242c43",
textStyle: {
fontSize: 12,
lineHeight: 20,
color: "#fff",
},
},
grid: {
left: 10,
right: 10,
bottom: 25,
top: 45,
containLabel: true,
},
color: ["#525e98", "#90b7c1", "#d06d1f", "#e4aa4f"],
legend: {
right: "center",
top: 0,
itemWidth: 10,
itemHeight: 10,
icon: "roundRect",
orient: "horizontal",
backgroundColor: "#f8f9fd",
textStyle: {
fontSize: 12,
lineHeight: 20,
color: "#a9aec0",
},
data: _self.series.map((item) => item.name),
},
xAxis: [
{
type: "category",
axisLabel: {
textStyle: {
color: "#0d1847",
fontSize: 12,
lineHeight: 20,
},
},
axisTick: {
show: false,
},
axisLine: {
lineStyle: {
color: "#e3e5ef",
},
},
splitLine: {
show: false,
},
splitArea: {
show: true,
interval: 0,
areaStyle: {
color: ["#f4f5fd", "#fff"],
opacity: 0.5,
},
},
axisPointer: {
type: "shadow",
},
data: _self.xAxis,
},
],
yAxis: [
{
type: "value",
min: 0,
axisLabel: {
formatter: "{value}",
textStyle: {
color: "#a9aec0",
fontSize: 12,
},
},
axisTick: {
show: false,
},
axisLine: {
lineStyle: {
color: "#e3e5ef",
},
},
splitLine: {
lineStyle: {
type: "dashed",
color: ["#f2f2f2"],
width: 1,
},
},
},
],
series: _self.series.map((item) => ({
...item,
type: "bar",
barMaxWidth: 12,
itemStyle: {
normal: {
barBorderRadius: [6, 6, 6, 6],
},
},
})),
dataZoom: [
{
type: "inside",
startValue: 0,
endValue: Math.min(_self.xAxis.length, 6),
},
{
show: true,
type: "slider",
height: 20,
bottom: 0,
startValue: 0,
endValue: _self.xAxis.length,
fillerColor: "#e6ebfe",
handleStyle: { color: "#b4c0f5" },
backgroundColor: "#f8f9fd",
borderColor: "#f8f9fd",
textStyle: { color: "transparent", fontSize: "12px" },
dataBackground: {
lineStyle: { color: "transparent" },
areaStyle: { color: "transparent" },
},
},
],
};
},
resizeColumn() {
if (this.$refs.adminHistogram) {
this.$refs.adminHistogram.resize();
}
},
},
mounted() {
window.addEventListener("resize", this.resizeColumn);
},
destroyed() {
window.removeEventListener("resize", this.resizeColumn);
},
};
</script>
src/pages/workbench/fwgl/approveWorkspace.vue
View file @ 0535e684
......@@ -78,8 +78,15 @@ export default {
},
})
.then(({ data }) => {
this.listTotal = data.total;
this.listData = data.data;
if (data.success == 1) {
this.listTotal = data.total;
this.listData = data.data;
} else {
this.$message({
message: data.errMsg || "获取列表失败",
type: "warning",
});
}
})
.catch((error) => {
console.log(error);
......@@ -147,7 +154,32 @@ export default {
this.dialogInfo.cancel = null;
this.dialogInfo.sunbmitText = "";
this.dialogInfo.submit = () => {
console.log("deleteAction");
this.$http
.delete("/apaas/service/v3/resource/apply/deleteRecord", {
params: {
apply_id: item.apply_id,
},
})
.then(({ data }) => {
if (data.success) {
this.$message({
message: data.errMsg || `删除成功.`,
type: "success",
});
this.init(this.tempFilter);
} else {
this.$message({
message: data.errMsg || `删除失败.`,
type: "warning",
});
}
})
.catch((error) => {
this.$message({
message: `删除失败.`,
type: "warning",
});
});
};
this.showDialog();
},
......
src/pages/workbench/fwgl/fwglList.vue
View file @ 0535e684
......@@ -74,13 +74,12 @@
</div>
<div class="admin_preview-right apass_button">
<el-button type="primary" size="mini" @click="approveWorkspace">
工作区域审批（1）
工作区域审批（{{ cloud_admin.unapprove }}）
</el-button>
<chart
ref="adminHistogram"
:options="getHistogramOption()"
style="width:100%;height:100%;"
/>
<histogramScroll
:xAxis="cloud_admin.cloumn.xAxis"
:series="cloud_admin.cloumn.series"
></histogramScroll>
</div>
</div>
</template>
......@@ -124,6 +123,7 @@ import apassList from "@/components/apass-list";
import apassDialog from "@/components/apass-dialog";
import allotInfoConfirm from "@/components/allot-info-confirm";
import organizationList from "@/components/organization-list/organization-list";
import histogramScroll from "@/components/e-charts/histogramScroll";
export default {
components: {
......@@ -131,6 +131,7 @@ export default {
apassDialog,
allotInfoConfirm,
organizationList,
histogramScroll,
},
data: () => ({
level: 0, // 用户等级
......@@ -1173,6 +1174,11 @@ export default {
state1: filter.state1,
state2: filter.state2,
};
// 超管增加withcolumn字段用于区分
if (this.level == 2) {
params.withcolumn = 1;
}
} else {
params = {
keyword: filter.keyword,
......@@ -1205,6 +1211,7 @@ export default {
if (this.type == 2) {
const cloud = data.data.cloud_resource_count;
// 超管的云资源管理展示的是组织列表
if (this.level != 2) {
this.listTotal = data.total;
this.listData = data.data.cloud_apply_list;
......@@ -1226,11 +1233,11 @@ export default {
unit: "（GB）",
},
/* {
name: "数据盘使用量",
value: cloud.disk_use,
total: cloud.disk_total,
unit: "（GB）",
}, */
name: "数据盘使用量",
value: cloud.disk_use,
total: cloud.disk_total,
unit: "（GB）",
}, */
{
name: "容器组使用量",
value: cloud.containers_use,
......@@ -1268,6 +1275,8 @@ export default {
unit: "（个）",
},
],
cloumn: cloud.cloumn, // TODO: 柱状图
unapprove: cloud.unapprove, // 审批数量
};
}
} else {
......@@ -1498,13 +1507,13 @@ export default {
user_id: item.user_id,
},
});
},
}, // 云资源想抢
cloudAllot(item) {
this.$refs.allotConfirm.getDetail(item.apply_id);
},
}, // 云资源分配
allotSuccess() {
this.init(this.tempFliter);
},
}, // 云资源分配成功
getDashboardOption(item) {
let percent = Math.round((item.value / item.total) * 100) || 0;
let colors = [];
......@@ -1527,23 +1536,28 @@ export default {
}
return {
title: {
text: percent + "%",
subtext: item.name,
x: "center",
y: "center",
textVerticalAlign: "auto",
textStyle: {
fontSize: 34,
fontWeight: "100",
color: ["#0d1847"],
},
subtextStyle: {
fontSize: 12,
fontWeight: "100",
color: "#707693",
title: [
{
text: percent + "%",
x: "center",
y: "28%",
textStyle: {
fontSize: 34,
fontWeight: "100",
color: ["#0d1847"],
},
},
},
{
text: item.name,
x: "center",
y: "55%",
textStyle: {
fontSize: 12,
fontWeight: "100",
color: "#707693",
},
},
],
angleAxis: {
axisLine: {
show: false,
......@@ -1673,336 +1687,7 @@ export default {
},
],
};
},
getHistogramOption(_xAxisData, _series) {
return {
tooltip: {
trigger: "axis",
/* axisPointer: {
crossStyle: {
color: "#999",
},
}, */
backgroundColor: "#242c43",
textStyle: {
fontSize: 12,
lineHeight: 20,
color: "#fff",
},
},
grid: {
left: 10,
right: 10,
bottom: 25,
top: 45,
containLabel: true,
},
color: ["#525e98", "#90b7c1", "#d06d1f", "#e4aa4f"],
legend: {
right: "center",
top: 0,
itemWidth: 10,
itemHeight: 10,
icon: "roundRect",
orient: "horizontal",
backgroundColor: "#f8f9fd",
textStyle: {
fontSize: 12,
lineHeight: 20,
color: "#a9aec0",
},
data: ["CPU", "内存", "数据盘", "容器组"],
},
xAxis: [
{
type: "category",
axisLabel: {
textStyle: {
color: "#0d1847",
fontSize: 12,
lineHeight: 20,
},
},
axisTick: {
show: false,
},
axisLine: {
lineStyle: {
color: "#e3e5ef",
},
},
splitLine: {
show: false,
},
/* splitArea: {
show: true,
areaStyle: {
color: ["#f4f5fd", "#fff"],
opacity: 0.5,
},
}, */
axisPointer: {
type: "shadow",
},
data: [
"办公费",
"印刷费",
"水费",
"水费",
"邮电费",
"物业管理费",
"差旅费",
"因公出国（境）费用",
"维修（护）费",
"会议费",
"租聘费",
"培训费",
"取暖费",
"公务接待费",
"公务用车运行",
"其他交通费用",
"房屋建筑物购建",
"办公设备购置",
"大型修缮",
"信息网络及软件购置更新",
"公务用车购置",
"咨询费",
"手续费",
"劳务费",
"委托业务费",
"其他商品和服务支出",
"专用设备购置",
"基础设施建设",
"其他交通工具购置",
"其他资本性支出",
],
},
],
yAxis: [
{
type: "value",
min: 0,
axisLabel: {
formatter: "{value}",
textStyle: {
color: "#a9aec0",
fontSize: 12,
},
},
axisTick: {
show: false,
},
axisLine: {
lineStyle: {
color: "#e3e5ef",
},
},
splitLine: {
lineStyle: {
type: "dashed",
color: ["#f2f2f2"],
width: 1,
},
},
},
],
series: [
{
type: "bar",
barMaxWidth: 12,
data: [
17931.63,
2420.69,
399.4,
2581.2,
1571.79,
3028.14,
8041.46,
1616.08,
7159.78,
3122.55,
2211.05,
10573.26,
1325.09,
1290.44,
2301.95,
3344.42,
5687.6,
2117.72,
442.4,
14853.71,
96.25,
170.19,
40.74,
3947.28,
12558.87,
12546.87,
6945.36,
683.28,
73.17,
169.15,
],
itemStyle: {
normal: {
barBorderRadius: [6, 6, 6, 6],
},
},
name: "CPU",
},
{
type: "bar",
barMaxWidth: 12,
data: [
17931.63,
2420.69,
399.4,
2581.2,
1571.79,
3028.14,
8041.46,
1616.08,
7159.78,
3122.55,
2211.05,
10573.26,
1325.09,
1290.44,
2301.95,
3344.42,
5687.6,
2117.72,
442.4,
14853.71,
96.25,
170.19,
40.74,
3947.28,
12558.87,
12546.87,
6945.36,
683.28,
73.17,
169.15,
],
itemStyle: {
normal: {
barBorderRadius: [6, 6, 6, 6],
},
},
name: "内存",
},
{
type: "bar",
barMaxWidth: 12,
data: [
17931.63,
2420.69,
399.4,
2581.2,
1571.79,
3028.14,
8041.46,
1616.08,
7159.78,
3122.55,
2211.05,
10573.26,
1325.09,
1290.44,
2301.95,
3344.42,
5687.6,
2117.72,
442.4,
14853.71,
96.25,
170.19,
40.74,
3947.28,
12558.87,
12546.87,
6945.36,
683.28,
73.17,
169.15,
],
itemStyle: {
normal: {
barBorderRadius: [6, 6, 6, 6],
},
},
name: "数据盘",
},
{
type: "bar",
barMaxWidth: 12,
data: [
17931.63,
2420.69,
399.4,
2581.2,
1571.79,
3028.14,
8041.46,
1616.08,
7159.78,
3122.55,
2211.05,
10573.26,
1325.09,
1290.44,
2301.95,
3344.42,
5687.6,
2117.72,
442.4,
14853.71,
96.25,
170.19,
40.74,
3947.28,
12558.87,
12546.87,
6945.36,
683.28,
73.17,
169.15,
],
itemStyle: {
normal: {
barBorderRadius: [6, 6, 6, 6],
},
},
name: "容器组",
},
],
dataZoom: [
{ type: "inside", start: 0, end: 20 },
{
show: true,
type: "slider",
height: 20,
bottom: 0,
start: 0,
end: 100,
fillerColor: "#e6ebfe",
handleStyle: { color: "#b4c0f5" },
backgroundColor: "#f8f9fd",
borderColor: "#f8f9fd",
textStyle: { color: "transparent", fontSize: "12px" },
dataBackground: {
lineStyle: { color: "transparent" },
areaStyle: { color: "transparent" },
},
},
],
};
},
resizeColumn() {
if (this.$refs.adminHistogram) {
this.$refs.adminHistogram.resize();
}
},
}, // 仪表图option
approveWorkspace() {
this.$router.push({
path: `/fwgl/${this.level}/${this.type}/approveWorkspace`,
......@@ -2010,7 +1695,7 @@ export default {
warn: this.cloud_admin_warn ? 1 : 0,
},
});
},
}, // 工作区域审批
},
created() {
this.level = parseInt(this.$route.params.level);
......@@ -2034,12 +1719,6 @@ export default {
}
});
},
mounted() {
window.addEventListener("resize", this.resizeColumn);
},
destroyed() {
window.removeEventListener("resize", this.resizeColumn);
},
};
</script>
......
src/pages/workbench/fwgl/organizationCloudResource.vue
View file @ 0535e684
......@@ -170,23 +170,28 @@ export default {
}
return {
title: {
text: percent + "%",
subtext: item.name,
x: "center",
y: "center",
textVerticalAlign: "auto",
textStyle: {
fontSize: 34,
fontWeight: "100",
color: ["#0d1847"],
title: [
{
text: percent + "%",
x: "center",
y: "28%",
textStyle: {
fontSize: 34,
fontWeight: "100",
color: ["#0d1847"],
},
},
subtextStyle: {
fontSize: 12,
fontWeight: "100",
color: "#707693",
{
text: item.name,
x: "center",
y: "55%",
textStyle: {
fontSize: 12,
fontWeight: "100",
color: "#707693",
},
},
},
],
angleAxis: {
axisLine: {
show: false,
......@@ -378,7 +383,7 @@ export default {
this.dialogInfo.submit = () => {
action(1, () => {
this.$message({
message: "该工作区域已被启用",
message: `${item.name_space}已被启用`,
type: "success",
});
});
......@@ -407,17 +412,17 @@ export default {
message: data.errMsg || `删除${item.name_space}成功.`,
type: "success",
});
this.init(this.tempFliter);
this.init(this.tempFilter);
} else {
this.$message({
message: data.errMsg,
message: data.errMsg || `删除${item.name_space}失败.`,
type: "warning",
});
}
})
.catch((error) => {
this.$message({
message: `删除${item.name}失败.`,
message: `删除${item.name_space}失败.`,
type: "warning",
});
});
......
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