2020/09/10 18:31

src/components/order-list/order-list-cell.vue

@@ -41,21 +41,49 @@
       </el-col>
       <el-col :span="6" class="cell_specification">
         <div v-if="cellItem.order_type == 1">
-          <div>规格：日访问次数：{{ cellItem.spec_svc_count }}次，日访问量：{{ cellItem.spec_svc_pv }}</div>
+          <el-tooltip class="item" effect="dark" placement="right">
+            <div
+              slot="content"
+              class="gg"
+            >规格：日访问次数：{{cellItem.spec_svc_count}}次，日访问量：{{cellItem.spec_svc_pv }}</div>
+            <div>规格：日访问次数：{{ cellItem.spec_svc_count }}次，日访问量：{{ cellItem.spec_svc_pv }}</div>
+          </el-tooltip>
           <div
             class="cell_specification_type"
           >申请方式：{{ cellItem.duration_unit == 1 ? $t('lang.by_month') : $t('lang.by_year') }}</div>
         </div>
         <div v-else-if="cellItem.order_type == 2">
-          <div>规格：{{ cellItem.spec_app == 0 ? "申请获取应用镜像部署权限" : "申请获取应用镜像开发权限" }}</div>
+          <el-tooltip class="item" effect="dark" placement="right">
+            <div
+              slot="content"
+              class="gg"
+            >{{ cellItem.spec_app == 0 ? '规格：申请获取应用镜像部署权限' : '规格：申请获取应用镜像开发权限' }}</div>
+            <div>规格：{{ cellItem.spec_app == 0 ? "申请获取应用镜像部署权限" : "申请获取应用镜像开发权限" }}</div>
+          </el-tooltip>
         </div>
         <div v-else-if="cellItem.order_type == 3">
-          <div>
-            规格：CPU {{ cellItem.cpu }}核，内存 {{ cellItem.memory }}GB，容器组 {{ cellItem.containers }}个；
-            <span
-              v-if="cellItem.disk_num != 0"
-            >数据盘 {{ cellItem.disk_num }}块，每块数据盘容量 {{ cellItem.disk_cap }}GB</span>
-          </div>
+          <el-tooltip v-if="cellItem.apply_type == 0" class="item" effect="dark" placement="right">
+            <div
+              slot="content"
+              class="gg"
+            >规格：CPU {{ cellItem.cpu }}核，内存 {{ cellItem.memory }}GB，容器组 {{ cellItem.containers }}个；数据盘 {{ cellItem.disk_num }}块，每块数据盘容量 {{ cellItem.disk_cap }}GB</div>
+            <div class="specification_item">
+              规格：CPU {{ cellItem.cpu }}核，内存 {{ cellItem.memory }}GB，容器组 {{ cellItem.containers }}个；
+              <span
+                v-if="cellItem.disk_num != 0"
+              >数据盘 {{ cellItem.disk_num }}块，每块数据盘容量 {{ cellItem.disk_cap }}GB</span>
+            </div>
+          </el-tooltip>
+          <el-tooltip v-else class="item" effect="dark" placement="right">
+            <div
+              slot="content"
+              class="gg"
+            >规格：CPU {{ cellItem.cpu }}核，内存 {{ cellItem.memory }}GB，容器组 {{ cellItem.containers }}个；{{ thisDisks }}</div>
+            <div class="specification_item">
+              规格：CPU {{ cellItem.cpu }}核，内存 {{ cellItem.memory }}GB，容器组 {{ cellItem.containers }}个；
+              <span>{{ thisDisks }}</span>
+            </div>
+          </el-tooltip>
           <div
             class="cell_specification_type"
           >单个容器组：CPU最高 {{ cellItem.one_cpu_max }}核，默认 {{ cellItem.one_cpu_min }}核；内存最高 {{ cellItem.one_memory_max }}GB，默认 {{ cellItem.one_memory_min }}GB</div>
@@ -137,11 +165,7 @@
         <el-col v-if="showMsgBox" :span="24" class="evaluation_msg">
           <div class="msg_title">服务评分：</div>
           <div class="msg_rate">
-            <el-rate
-              v-model="message.score"
-              disabled
-              :colors="colors"
-            ></el-rate>
+            <el-rate v-model="message.score" disabled :colors="colors"></el-rate>
           </div>
           <div class="msg_title">评价详情：</div>
           <div class="msg_text">{{ message.content }}</div>
@@ -176,8 +200,19 @@ export default {
     cellItem: {
       handler() {
         this.showMsgBox = false;
+      },
+    },
+  },
+  computed: {
+    thisDisks() {
+      let strings = "";
+      if (this.cellItem.adjust_disk) {
+        this.cellItem.adjust_disk.forEach((item) => {
+          strings += `数据盘 ${item.disk_num}块，每块数据盘容量 ${item.disk_cap}GB；`;
+        });
       }
-    }
+      return strings;
+    },
   },
   methods: {
     addEvaluation() {
@@ -523,6 +558,17 @@ export default {
   /* margin-left: 20px; */
   color: #242c43;
 }
+.specification_item {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+}
+.gg {
+  max-width: 200px;
+  word-wrap: break-word;
+}
 </style>
 <style>
 .pop_rate .el-rate__icon {

src/pages/user/order/order_detail.vue

@@ -172,13 +172,17 @@
             <div v-else-if="orderDetail.order_type == 2">
               <div>
                 <span class="detail_service_specification_gg">规格：</span>
-                <span class="detail_service_specification_val">{{ orderDetail.spec_app == 0 ? "申请获取应用镜像部署权限" : "申请获取应用镜像开发权限" }}</span>
+                <span
+                  class="detail_service_specification_val"
+                >{{ orderDetail.spec_app == 0 ? "申请获取应用镜像部署权限" : "申请获取应用镜像开发权限" }}</span>
               </div>
             </div>
             <div v-else-if="orderDetail.order_type == 3">
               <div>
                 <span class="detail_service_specification_gg">类型：</span>
-                <span class="detail_service_specification_val">{{ orderDetail.apply_type == 0 ? "申请新的工作区域" : "升级现有工作区域" }}</span>
+                <span
+                  class="detail_service_specification_val"
+                >{{ orderDetail.apply_type == 0 ? "申请新的工作区域" : "升级现有工作区域" }}</span>
               </div>
             </div>
           </el-col>
@@ -222,12 +226,28 @@
             <span class="params_block_item_title">容器组：</span>
             <span class="params_block_item_val">{{ orderDetail.memory }}核</span>
           </div>
-          <div v-if="orderDetail.disk_num != 0" class="params_block_item_in">
+          <div
+            v-if="orderDetail.apply_type == 0 && orderDetail.disk_num != 0"
+            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
+            v-else-if="orderDetail.apply_type != 0 && orderDetail.adjust_disk && orderDetail.adjust_disk.length != 0"
+            class="params_block_item_in"
+          >
+            <span class="params_block_item_title">数据盘：</span>
+            <p class="params_block_item_val">
+              <span
+                v-for="(item, index) in orderDetail.adjust_disk"
+                :key="'sjp' + index"
+                class="val_has_2"
+              >{{ "数据盘" + item.disk_num + "块，每块数据盘容量" + item.disk_cap + "GB；" }}</span>
+            </p>
+          </div>
         </div>
         <span class="params_block_title margin_top_20">单个容器组规格：</span>
         <div class="params_block_item">