From c84dd1a3914a57c1f1419149ab5251ed840eff17 Mon Sep 17 00:00:00 2001
From: xuyiming <xuyiming@bd-apaas.com>
Date: Mon, 6 Jul 2020 18:43:18 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9C=8D=E5=8A=A1=E7=AE=A1=E7=90=86-=E4=BA=91?=
 =?UTF-8?q?=E8=B5=84=E6=BA=90=E5=88=97=E8=A1=A8=E8=B0=83=E8=AF=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                          |   1 +
 src/components/allot-info-confirm.vue | 200 +++++++++++++++
 src/pages/workbench/fwgl/fwglList.vue | 339 +++++++++++++-------------
 3 files changed, 373 insertions(+), 167 deletions(-)
 create mode 100644 src/components/allot-info-confirm.vue

diff --git a/package.json b/package.json
index a17acec..9ade5d3 100644
--- a/package.json
+++ b/package.json
@@ -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": {
diff --git a/src/components/allot-info-confirm.vue b/src/components/allot-info-confirm.vue
new file mode 100644
index 0000000..4d834f6
--- /dev/null
+++ b/src/components/allot-info-confirm.vue
@@ -0,0 +1,200 @@
+<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>
diff --git a/src/pages/workbench/fwgl/fwglList.vue b/src/pages/workbench/fwgl/fwglList.vue
index 779c104..fcfc79e 100644
--- a/src/pages/workbench/fwgl/fwglList.vue
+++ b/src/pages/workbench/fwgl/fwglList.vue
@@ -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",
-          },
-        ];
-        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"],
+            getText(item) {
+              return ["未通过", "待审批", "通过"][
+                (item.approve_update_state || 0) + 1
+              ];
+            },
           },
         ];
       }
@@ -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,42 +1128,92 @@ export default {
       }
     },
     init(filter) {
-      console.log(filter);
+      // console.log(filter);
 
       if (!this.listUrl) {
         return;
       }
 
+      let params = {};
+
       this.tempFliter = filter;
 
+      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(",")) ||
+            "", // 服务类型
+          sectors:
+            (filter.service_area &&
+              filter.service_area.map((item) => item.value).join(",")) ||
+            "", // 服务领域
+          openness:
+            (filter.openness &&
+              filter.openness.map((item) => item.value).join(",")) ||
+            "", // 开放程度
+          state:
+            (filter.state &&
+              filter.state.map((item) => item.value).join(",")) ||
+            "", // 服务状态
+        };
+      }
+
       this.$http
-        .get(this.listUrl, {
-          params: {
-            data_service_type:
-              (filter.service_type_1 &&
-                filter.service_type_1.map((item) => item.value).join(",")) ||
-              "", // 服务类型
-            sectors:
-              (filter.service_area &&
-                filter.service_area.map((item) => item.value).join(",")) ||
-              "", // 服务领域
-            openness:
-              (filter.openness &&
-                filter.openness.map((item) => item.value).join(",")) ||
-              "", // 开放程度
-            state:
-              (filter.state &&
-                filter.state.map((item) => item.value).join(",")) ||
-              "", // 服务状态
-            keyword: filter.keyword,
-            page: filter.page,
-            size: filter.size,
-          },
-        })
+        .get(this.listUrl, { params })
         .then(({ data }) => {
-          // console.log(data.data);
-          this.listTotal = data.data.total;
-          this.listData = data.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);
-- 
2.26.0