合并

src/assets/css/index.css

@@ -67,7 +67,8 @@ html {
 }
 body {
   margin: 0;
-  font-family: PingFangSC-Regular, sans-serif;
+  font-family: Microsoft YaHei, sans-serif;
+  /* font-size: 17px; */
 }
 ul {
   list-style: none;

src/assets/i18n/language-zh.js

@@ -17,6 +17,9 @@ export const lang = {
 
     // work bench
     workBench: "工作台",
+    cloudResourcesService: "云资源服务",
+    cloudResourcesManagement: "云资源管理",
+    cloudResourcesDetail: "云资源详情",
 
     // data analysis
     dataAnalysis: "数据分析中心",

src/components/allot-info-confirm.vue

+<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['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['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['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['file']) || '-'"></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['namespace']) || '-'"></span>
+              </p>
+              <p class="info_text info_cell">
+                <span class="text_grey">中文名称：</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['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['cpu']) || '-'"></span>
+              </p>
+              <p class="info_text info_cell">
+                <span class="text_grey"> 内存：</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['duration_time']) || '-'"
+                ></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"
+        :loading="submitLoading"
+        @click="confrimAction"
+      >
+        确认提交
+      </el-button>
+    </template>
+  </apass-dialog>
+</template>
+
+<script>
+import apassDialog from "@/components/apass-dialog";
+
+export default {
+  components: { apassDialog },
+  data: () => ({
+    detail: null,
+    submitLoading: false,
+  }),
+  methods: {
+    showDialog() {
+      this.$refs.confrim.show();
+    },
+    hideDialog() {
+      this.$refs.confrim.hide();
+    },
+    getDetail(apply_id) {
+      this.$http
+        .get("/apaas/service/v3/resource/apply/distributionDisplay", {
+          params: {
+            apply_id: apply_id,
+          },
+        })
+        .then(({ data }) => {
+          if (data.success) {
+            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: "获取详情失败",
+              type: "warning",
+            });
+          }
+        })
+        .catch((error) => {
+          this.$message({
+            message: "获取详情失败",
+            type: "warning",
+          });
+        });
+
+      this.showDialog();
+    },
+    confrimAction() {
+      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",
+          });
+        });
+    },
+  },
+};
+</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/components/apass-list.vue

@@ -143,10 +143,10 @@ export default {
     showListFilter: false,
     filter: {},
     searchValue: "",
-    pageSize: 15,
+    pageSize: 10,
     currentPage: 1,
     timer: null,
-    pageSizes: [15, 50, 100],
+    pageSizes: [10, 20, 50],
     selectFilter: [],
   }),
   methods: {

src/components/comments-pagination.vue

@@ -49,7 +49,7 @@ export default {
   data: () => ({}),
   computed: {
     totalPages() {
-      return Math.floor(this.total / this.pageSize) + 1 || 1;
+      return Math.ceil(this.total / this.pageSize) || 1;
     },
     preDisabled() {
       return this.currentPage === 1;

src/components/image-detail.vue

 <template>
   <div class="image_detail">
-    <apass-dialog ref="listdialog" :title="title" width="985px">
+    <apass-dialog ref="listdialog" :title="title" width="1200px">
       <template slot="content">
         <div class="apass_table">
           <el-table :data="imageData">
             <el-table-column width="20"></el-table-column>
-            <el-table-column label="版本号" align="left">
+            <el-table-column label="版本号" width="120" align="left">
               <template slot-scope="scope">
                 {{ scope.row.name }}
               </template>
@@ -15,6 +15,11 @@
                 {{ scope.row.author }}
               </template>
             </el-table-column>
+            <el-table-column label="镜像地址" align="left">
+              <template slot-scope="scope">
+                {{ scope.row.image_url }}
+              </template>
+            </el-table-column>
             <el-table-column label="创建时间" width="180" align="center">
               <template slot-scope="scope">
                 {{ dateTransform(scope.row.created) }}
@@ -25,7 +30,7 @@
                 {{ getSize(scope.row.size) }}
               </template>
             </el-table-column>
-            <el-table-column label="漏洞" width="160" align="center">
+            <el-table-column label="漏洞" align="center">
               <template slot-scope="scope">
                 <image-bugs
                   v-if="scope.row.scan_overview"

src/components/menu.vue

@@ -2,37 +2,54 @@
   <div class="menu">
     <img src="../assets/imgs/home_img_logo.png" alt class="logo" />
     <div style="float:right;cursor: pointer;position:relative;" class="user_hover">
-      <span v-if="userInfo.user_name && userInfo.user_name != ''" class="user">{{ userInfo.user_name }}</span>
+      <span
+        v-if="userInfo.user_name && userInfo.user_name != ''"
+        class="user"
+      >{{ userInfo.user_name }}</span>
       <span v-else @click="gotopage('login')" class="user">请登录</span>
-      <img :class="userInfo.picture_path ? 'user_pic' : 'user_default'" :src="
+      <img
+        :class="userInfo.picture_path ? 'user_pic' : 'user_default'"
+        :src="
           userInfo.picture_path || require('../assets/imgs/home_ic_user.png')
-        " />
+        "
+      />
       <div v-if="userInfo.user_name && userInfo.user_name != ''" class="user_menu">
-        <div v-for="(item, index) in user_arr" :key="index + 700" @click="gotopage(item.path)">
-          {{ item.name }}
-        </div>
+        <div
+          v-for="(item, index) in user_arr"
+          :key="index + 700"
+          @click="gotopage(item.path)"
+        >{{ item.name }}</div>
       </div>
       <div v-if="userInfo.user_name && userInfo.user_name != ''" class="sj"></div>
     </div>
-    <div style="float:right;cursor: pointer;position:relative;" class="shop_hover" @click="gotopage('/shop/shopping_cart')">
+    <div
+      style="float:right;cursor: pointer;position:relative;"
+      class="shop_hover"
+      @click="gotopage('/shop/shopping_cart')"
+    >
       <div class="car">
         <el-badge v-if="menuCartNum != 0" :value="menuCartNum" :max="99" class="number"></el-badge>
         <img src="../assets/imgs/home_ic_shop.png" alt class="car_img" />
       </div>
       <div v-if="userInfo.user_name && userInfo.user_name != ''" class="shop_menu">
         <div class="shop_list_title">最近加入的服务：</div>
-        <div v-for="(item, index) in shopping_list" :key="'shopping' + index" class="shop_list_cell shop_line">
-          <img :src="item.service.cover" class="shop_img" />
+        <div
+          v-for="(item, index) in shopping_list"
+          :key="'shopping' + index"
+          class="shop_list_cell shop_line"
+        >
+          <img :src="item.service_id == 0 ? item.application.logo : item.service.cover" class="shop_img" />
           <div class="shop_cell_msgs">
-            <p @click="getDetail(item.id)" class="shop_cell_name over_one">
-              {{ item.service_id == 0 ? item.application.app_name : item.service.name }}
-            </p>
-            <p class="shop_cell_msg bover_one">
-              {{ item.service_id == 0 ? item.application.ywly : item.service.sectors_name }}
-            </p>
-            <p class="shop_cell_msg over_one">
-              {{ item.service_id == 0 ? item.application.org : item.service.organization_name }}
-            </p>
+            <p
+              @click="getDetail(item.id)"
+              class="shop_cell_name over_one"
+            >{{ item.service_id == 0 ? item.application.app_name : item.service.name }}</p>
+            <p
+              class="shop_cell_msg bover_one"
+            >{{ item.service_id == 0 ? item.application.ywly_name : item.service.sectors_name }}</p>
+            <p
+              class="shop_cell_msg over_one"
+            >{{ item.service_id == 0 ? item.application.org_name : item.service.organization_name }}</p>
           </div>
           <div>
             <img @click.stop="deleteItem(item.id)" src="../assets/imgs/ic_delete.png" alt />
@@ -46,12 +63,20 @@
     </div>
 
     <div style="float:right">
-      <div v-for="(item, index) in menu_arr" :key="index + 200" class="menu_box user_hover" @click="navAction(item.visit_url)" :style="{ color: now_menu == item.visit_url ? '#fff' : '' }">
+      <div
+        v-for="(item, index) in menu_arr"
+        :key="index + 200"
+        class="menu_box user_hover"
+        @click="navAction(item.visit_url)"
+        :style="{ color: now_menu == item.visit_url ? '#fff' : '' }"
+      >
         {{ item.menu_name }}
         <div class="user_menu" v-if="item.Child && item.Child.length" style="left: 30px;">
-          <div v-for="(v, indexs) in item.Child" :key="indexs + 700" @click.stop="gotoChildPage(v, item.visit_url)">
-            {{ v.menu_name }}
-          </div>
+          <div
+            v-for="(v, indexs) in item.Child"
+            :key="indexs + 700"
+            @click.stop="gotoChildPage(v, item.visit_url)"
+          >{{ v.menu_name }}</div>
         </div>
         <div class="sj" v-if="item.Child && item.Child.length" style="left: 60px;"></div>
         <div class="bottom_show" v-if="now_menu == item.visit_url"></div>
@@ -140,7 +165,6 @@ export default {
         this.now_menu = parent;
         window.sessionStorage.setItem("menuVisitUrl", parent);
       }
-      
     },
     getList() {
       this.$api.serviceShop.getShoppingCart().then(response => {

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/components/service-tabs/service-tab-specification.vue

@@ -40,7 +40,9 @@ export default {
   }),
   computed: {
     tableData() {
-      return this.data.filter((item) => item.type === this.type);
+      return this.data.filter(
+        (item) => item.type === this.type || item.type === 3
+      );
     },
   },
 };

src/components/shopping-cart/shopping-cart-cell.vue

@@ -35,10 +35,10 @@
                 v-if="cellIsService"
                 class="shopping_cell_type"
               >{{ cellItems.service.sectors_name }}</div>
-              <div v-else class="shopping_cell_type">{{ cellItems.application.ywly }}</div>
+              <div v-else class="shopping_cell_type">{{ cellItems.application.ywly_name }}</div>
               <div
                 class="shopping_cell_creator"
-              >{{ cellIsService ? cellItems.service.organization_name:cellItems.application.org }}</div>
+              >{{ cellIsService ? cellItems.service.organization_name:cellItems.application.org_name }}</div>
             </div>
           </div>
         </div>
@@ -119,13 +119,15 @@
         </div>
       </el-col>
       <el-col :span="4" class="shopping_cell_num">
-        <el-input-number
-          :disabled="readOnly"
-          v-model="cellItems.duration"
-          @change="changeNum"
-          size="mini"
-          :min="1"
-        ></el-input-number>
+        <div v-if="cellIsService">
+          <el-input-number
+            :disabled="readOnly"
+            v-model="cellItems.duration"
+            @change="changeNum"
+            size="mini"
+            :min="1"
+          ></el-input-number>
+        </div>
       </el-col>
       <el-col :span="4" class="shopping_cell_options">
         <el-checkbox

src/main.js

@@ -37,6 +37,7 @@ import "echarts/lib/component/legend"; // 图例
 import "echarts/lib/component/title"; // 标题
 import 'echarts/lib/component/polar'; // 极坐标系
 import 'echarts/lib/chart/scatter'; // 散点图
+import 'echarts/lib/component/dataZoom'
 
 import Sparkline from 'vue-sparklines'
 

src/pages/service_shop/services_shop.vue

@@ -132,6 +132,7 @@ export default {
     this.init("hotdata");
     this.init("hgmap");
     this.init("zhapp");
+    this.getGeneralOverview();
   }
 };
 </script>

src/pages/user/order/order_detail.vue

@@ -177,26 +177,25 @@
       </div>
       <div v-if="orderDetail.order_type == 3">
         <div class="detail_s_title">工作区域描述：</div>
-        <div class="detail_app_scence">{{ orderDetail.scene }}</div>
       </div>
       <div v-if="orderDetail.order_type == 3" class="params_block">
         <span class="params_block_title">申请规格：</span>
         <div class="params_block_item">
           <div class="params_block_item_in">
             <span class="params_block_item_title">CPU：</span>
-            <span class="params_block_item_val">2核</span>
+            <span class="params_block_item_val">{{ orderDetail.cpu }}核</span>
           </div>
           <div class="params_block_item_in">
             <span class="params_block_item_title">内存：</span>
-            <span class="params_block_item_val">4GB</span>
+            <span class="params_block_item_val">{{ orderDetail.memory }}GB</span>
           </div>
           <div class="params_block_item_in">
             <span class="params_block_item_title">容器组：</span>
-            <span class="params_block_item_val">2核</span>
+            <span class="params_block_item_val">{{ orderDetail.memory }}核</span>
           </div>
           <div class="params_block_item_in">
             <span class="params_block_item_title">数据盘：</span>
-            <span class="params_block_item_val">2核</span>
+            <span class="params_block_item_val">{{ orderDetail.disk_num}}块，每块{{orderDetail.disk_cap }}GB</span>
           </div>
         </div>
         <span class="params_block_title margin_top_20">单个容器组规格：</span>
@@ -204,15 +203,15 @@
           <div class="params_block_item_in">
             <span class="params_block_item_title">CPU：</span>
             <p class="params_block_item_val">
-              <span class="val_has_2">最高&nbsp;2核</span>
-              <span class="val_has_2">默认&nbsp;2核</span>
+              <span class="val_has_2">最高&nbsp;{{ orderDetail.one_cpu_max }}核</span>
+              <span class="val_has_2">默认&nbsp;{{ orderDetail.one_cpu_min }}核</span>
             </p>
           </div>
           <div class="params_block_item_in">
             <span class="params_block_item_title">CPU：</span>
             <p class="params_block_item_val">
-              <span class="val_has_2">最高&nbsp;2核</span>
-              <span class="val_has_2">默认&nbsp;2核</span>
+              <span class="val_has_2">最高&nbsp;{{ orderDetail.one_memory_max }}核</span>
+              <span class="val_has_2">默认&nbsp;{{ orderDetail.one_memory_min }}核</span>
             </p>
           </div>
         </div>
@@ -706,7 +705,7 @@ export default {
   line-height: 22px;
 }
 .params_block_title {
-  padding-left: 10px;
+  padding-left: 5px;
   color: #242c43;
 }
 .params_block_item {
@@ -719,12 +718,12 @@ export default {
 }
 .params_block_item_title {
   color: #8890a7;
-  width: 120px;
+  width: 80px;
   text-align: right;
 }
 .params_block_item_val {
   color: #242c43;
-  width: calc(100% - 130px);
+  width: calc(100% - 82px);
 }
 .val_has_2 {
   margin-right: 20px;

src/pages/workbench/app_build.vue

@@ -384,6 +384,7 @@ export default {
           this.image_noMore = false;
         })
         .catch((error) => {
+          this.image_loading = false;
           console.log(error);
         });
     },

src/pages/workbench/fwgl/cloud-detail.vue

+<template>
+  <div>
+    <el-breadcrumb separator="/" class="bread_crumb1 bread_left">
+      <el-breadcrumb-item
+        :to="{ path: getUrl() }"
+      >{{ this.$route.params.level == 1 ? $t('lang.cloudResourcesService') : $t('lang.cloudResourcesManagement') }}</el-breadcrumb-item>
+      <el-breadcrumb-item>{{ $t('lang.cloudResourcesDetail') }}</el-breadcrumb-item>
+    </el-breadcrumb>
+    <BlockRadius class="in_cloud_block">
+      <div class="cloud_block_head">
+        <div class="head_left">
+          <el-image class="head_left_img" :src="url" fit="fill"></el-image>
+        </div>
+        <div class="head_right">
+          <div class="head_right_name">aPaaS V3.0</div>
+          <div class="head_right_msg">
+            <p class="head_right_msg_p">
+              申请用户：
+              <span class="head_right_msg_item">张三</span>
+              联系电话：
+              <span class="head_right_msg_item">12345678901</span>
+              资源申请状态：
+              <span
+                class="head_right_msg_item"
+                :class="true ? 'apply_success' : ''"
+              >审批通过</span>
+            </p>
+            <p class="head_right_msg_p">
+              业务系统名：
+              <span class="head_right_msg_item">aPaaS V3.0 一期</span>
+              资源申请时间：
+              <span class="head_right_msg_item">2020-02-12 15:54:21</span>
+            </p>
+          </div>
+        </div>
+      </div>
+      <div class="cloud_params">
+        <InfoList @download="download" :list_arr="list_arr" class="detail_s_val">
+          <div ref="ApplyParams" slot="ApplyParams" class="params_block">
+            <span class="params_block_title">申请规格：</span>
+            <div class="params_block_item">
+              <div class="params_block_item_in">
+                <span class="params_block_item_title">CPU：</span>
+                <span class="params_block_item_val">{{ orderDetail.cpu }}核</span>
+              </div>
+              <div class="params_block_item_in">
+                <span class="params_block_item_title">内存：</span>
+                <span class="params_block_item_val">{{ orderDetail.memory }}GB</span>
+              </div>
+              <div class="params_block_item_in">
+                <span class="params_block_item_title">容器组：</span>
+                <span class="params_block_item_val">{{ orderDetail.memory }}核</span>
+              </div>
+              <div class="params_block_item_in">
+                <span class="params_block_item_title">数据盘：</span>
+                <span
+                  class="params_block_item_val"
+                >{{ orderDetail.disk_num}}块，每块{{orderDetail.disk_cap }}GB</span>
+              </div>
+            </div>
+            <span class="params_block_title margin_top_20">单个容器组规格：</span>
+            <div class="params_block_item">
+              <div class="params_block_item_in">
+                <span class="params_block_item_title">CPU：</span>
+                <div class="params_block_item_val">
+                  <span class="val_has_2">最高&nbsp;{{ orderDetail.one_cpu_max }}核</span>
+                  <span class="val_has_2">默认&nbsp;{{ orderDetail.one_cpu_min }}核</span>
+                </div>
+              </div>
+              <div class="params_block_item_in">
+                <span class="params_block_item_title">CPU：</span>
+                <div class="params_block_item_val">
+                  <span class="val_has_2">最高&nbsp;{{ orderDetail.one_memory_max }}核</span>
+                  <span class="val_has_2">默认&nbsp;{{ orderDetail.one_memory_min }}核</span>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div ref="ApplyDesc" slot="ApplyDesc">
+            {{ desc }}
+          </div>
+        </InfoList>
+      </div>
+    </BlockRadius>
+  </div>
+</template>
+
+<script>
+import BlockRadius from "@/components/general/block-radius";
+import InfoList from "@/components/infoList";
+import helper from "@/services/helper.js";
+export default {
+  components: {
+    BlockRadius,
+    InfoList
+  },
+  data() {
+    return {
+      url:
+        "https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
+      orderDetail: {},
+      helper,
+      list_arr: [
+        {
+          title: "云资源详情：",
+          prop: "title"
+        },
+        {
+          title: "工作区域申请规格：",
+          type: "solt",
+          solt_name: "ApplyParams"
+        },
+        {
+          title: "资源申请文件：",
+          info: "2222222222222222222222.docs",
+          url: "",
+          type: "down"
+        },
+        {
+          title: "工作区域描述：",
+          type: "solt",
+          solt_name: "ApplyDesc",
+        }
+      ],
+      desc: "工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述：工作区域描述："
+    };
+  },
+  watch: {},
+  computed: {},
+  created() {},
+  mounted() {
+    this.getUrl();
+  },
+  methods: {
+    getUrl() {
+      return this.$route.path.substring(0, 9);
+    },
+    download() {}
+  }
+};
+</script>
+<style>
+.in_cloud_block {
+  margin: 0 20px;
+}
+.cloud_block_head {
+  padding-top: 10px;
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 30px;
+}
+.head_left {
+  width: 150px;
+}
+.head_left_img {
+  width: 144px;
+  height: 144px;
+  border-radius: 8px;
+}
+.head_right {
+  width: calc(100% - 160px);
+}
+.head_right_name {
+  font-size: 18px;
+  font-weight: bold;
+  color: #0d1847;
+  line-height: 30px;
+  margin-left: 10px;
+  margin-bottom: 18px;
+}
+.head_right_msg {
+  border-radius: 8px;
+  height: 96px;
+  background-color: #f6f7fb;
+  padding: 10px 20px;
+}
+.head_right_msg_p {
+  font-size: 14px;
+  line-height: 38px;
+  color: #8890a7;
+}
+.head_right_msg_item {
+  display: inline-block;
+  font-size: 14px;
+  font-weight: bold;
+  color: #242c43;
+  margin-right: 48px;
+}
+.apply_success {
+  color: #515fe7;
+}
+.cloud_params .service_title {
+  padding: 0 10px;
+}
+.cloud_params p {
+  padding: 0 15px;
+}
+.cloud_params p span {
+  display: inline;
+  line-height: 21px;
+}
+.params_block {
+  background-color: #f8f9fd;
+  border-radius: 8px;
+  margin: 10px 0;
+  padding: 20px;
+  font-size: 14px;
+  line-height: 22px;
+}
+.params_block_title {
+  padding-left: 5px;
+  color: #242c43;
+}
+.params_block_item {
+  padding: 10px 0 0 0;
+}
+.params_block_item_in {
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 5px;
+}
+.params_block_item_title {
+  color: #8890a7;
+  width: 80px;
+  text-align: right;
+}
+.params_block_item_val {
+  color: #242c43;
+  width: calc(100% - 82px);
+}
+.margin_top_20 {
+  display: block;
+  margin-top: 20px;
+}
+</style>

src/router/index.js

@@ -68,6 +68,11 @@ export default new Router({
               component: () =>
                 import("@/pages/workbench/fwgl/approval_service_detail"),
             }, // 审批的服务 - 详情
+            {
+              path: "/fwgl/:level/:type/cloud_detail/:id",
+              name: "servicedetail",
+              component: () => import("@/pages/workbench/fwgl/cloud-detail"),
+            }, // 云资源 - 详情
           ],
         }, // 工作台 - 服务管理模块
         {

yarn.lock

@@ -6074,6 +6074,11 @@ resize-detector@^0.1.10:
   resolved "https://registry.yarnpkg.com/resize-detector/-/resize-detector-0.1.10.tgz#1da3f961aa5f914ccbcfd3752d52fd45beeb692c"
   integrity sha512-iLcXC8A6Fb0DfA+TRiywrK/0A22bFqkhntjMJMEzXDA4XkcEkfwpNbv7W8iewUiD0xYIaeiXOfiEehTqGKsUFw==
 
+resize-detector@^0.2.2:
+  version "0.2.2"
+  resolved "https://registry.npm.taobao.org/resize-detector/download/resize-detector-0.2.2.tgz#b207e72912bef0bda9fb825fe894ed9686ca965e"
+  integrity sha1-sgfnKRK+8L2p+4Jf6JTtlobKll4=
+
 resize-observer-polyfill@^1.5.0:
   version "1.5.1"
   resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz#0e9020dd3d21024458d4ebd27e23e40269810464"
@@ -7207,6 +7212,13 @@ vue-router@^3.0.2:
   resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-3.1.6.tgz#45f5a3a3843e31702c061dd829393554e4328f89"
   integrity sha512-GYhn2ynaZlysZMkFE5oCHRUTqE8BWs/a9YbKpNLi0i7xD6KG1EzDqpHQmv1F5gXjr8kL5iIVS8EOtRaVUEXTqA==
 
+vue-sparklines@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.npm.taobao.org/vue-sparklines/download/vue-sparklines-0.2.1.tgz#2c754b49af5d86a62308930f72bad8fc376d3beb"
+  integrity sha1-LHVLSa9dhqYjCJMPcrrY/DdtO+s=
+  dependencies:
+    vue "^2.2.1"
+
 vue-style-loader@^4.1.0, vue-style-loader@^4.1.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/vue-style-loader/-/vue-style-loader-4.1.2.tgz#dedf349806f25ceb4e64f3ad7c0a44fba735fcf8"
@@ -7228,7 +7240,7 @@ vue-template-es2015-compiler@^1.9.0:
   resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
   integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==
 
-vue@^2.6.10:
+vue@^2.2.1, vue@^2.6.10:
   version "2.6.11"
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.11.tgz#76594d877d4b12234406e84e35275c6d514125c5"
   integrity sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ==