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

src/components/allot-info-confirm.vue

@@ -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",
+          });
+        });
     },
   },
 };

src/components/organization-list/organization-card.vue

 <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);

src/components/organization-list/organization-list.vue

@@ -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,

src/pages/workbench/fwgl/fwglList.vue

@@ -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>
 
-      <div slot="list" v-if="level == 2 && type == 2">
-        <p style="text-align: center;margin-top: 20px;">组织列表</p>
+      <template slot="header-left">
+        <div class="cloud_title" v-if="cloud_admin">
+          <span>组织概览</span>
         </div>
+      </template>
+
+      <!-- 超管的云资源管理展示的是组织列表 -->
+      <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) {
+            const cloud = data.data.cloud_resource_count;
+
+            if (this.level == 1) {
               this.listTotal = data.total;
               this.listData = data.data.cloud_apply_list;
-
               this.cloud_zuzhi = {
-              org_name: "北京比格大数据",
-              used_area: 2,
+                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: 6,
-                  total: 10,
+                    value: cloud.cpu_use,
+                    total: cloud.cpu_total,
                     unit: "（核）",
                   },
                   {
                     name: "内存使用量",
-                  value: 13,
-                  total: 20,
+                    value: cloud.memory_use,
+                    total: cloud.memory_total,
                     unit: "（GB）",
                   },
                   {
                     name: "数据盘使用量",
-                  value: 500,
-                  total: 560,
+                    value: cloud.disk_use,
+                    total: cloud.disk_total,
                     unit: "（GB）",
                   },
                   {
                     name: "容器组使用量",
-                  value: 10,
-                  total: 18,
+                    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;