应用运行状态

src/pages/workbench/yygl/app_debugger_detail.vue

@@ -494,7 +494,6 @@ height: 10px; /*对水平流动条有效*/
 
 /*定义滚动条的轨道颜色、内阴影及圆角*/
 #xterm_contain ::-webkit-scrollbar-track{
--webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
 background-color: rosybrown;
 border-radius: 3px;
 }
@@ -503,7 +502,6 @@ border-radius: 3px;
 /*定义滑块颜色、内阴影及圆角*/
 #xterm_contain ::-webkit-scrollbar-thumb{
 border-radius: 7px;
--webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
 background-color: #E8E8E8;
 }
 

src/pages/workbench/yygl/app_detail.vue

@@ -149,6 +149,7 @@
       ref="myConfirm"
       :confirmOptions="tipsOptions"
     ></dialog-action>
+    <image-detail ref="imageDetail"></image-detail>
   </div>
 </template>
 
@@ -162,6 +163,7 @@ import serviceTabComments from '@/components/service-tabs/service-tab-comments'
 import { getRole } from "@/utils/common";
 import { mapGetters,mapState } from 'vuex'
 import apassTable from "@/components/apass-table";
+import imageDetail from "@/components/image-detail";
 export default {
   components: {
     infoList,
@@ -170,7 +172,8 @@ export default {
     dialogAction,
     uploadFile,
     serviceTabComments,
-    apassTable
+    apassTable,
+    imageDetail
   },
   data() {
     return {
@@ -318,6 +321,8 @@ export default {
           label: "镜像名称",
           minWidth: "33.33%",
           align: "center",
+          type: "button",
+          callback: this.showImageDetail,
         },
         {
           prop: "tag",
@@ -341,6 +346,9 @@ export default {
     ]
   },
   methods: {
+    showImageDetail(item) {
+      this.$refs.imageDetail.showDialog(item);
+    },
     getCurrentUser() {
       this.$api.user.getNowUser().then(({ data }) => {
         if (data.success == 1) {

src/pages/workbench/yygl/deploy_app_detail.vue

@@ -85,7 +85,8 @@
             </el-form>
           </div>
 
-          <div v-if="now_service == 1&&image_arr.length">
+          <!-- <div v-if="now_service == 1&&image_arr.length"> -->
+          <div v-if="now_service == 1">
             <p class="service_title">
               <span></span>应用概况
             </p>
@@ -598,9 +599,8 @@ export default {
     }
     this.getServiceInfo();
     this.getServiceBaseInfo();
-    this.getServiceyxztInfo();
-    this.getImageInfo();
     this.get_service_list();
+    this.get_app_generl();
     if (this.$route.query.showstate) {
       this.now_service = 1;
     }
@@ -639,6 +639,21 @@ export default {
     debuggerfunc(){
       this.$router.push(`/yygl/${this.$route.params.level}/${this.$route.params.type}/appdebugger?namespace=${this.header_data.namespace}&app=${this.header_data.deploy_name}`)
     },
+    get_app_generl(){
+      this.$http
+        .get(`/apaas/hubApi/market/status/overview/${this.$route.params.deploy_id}`)
+        .then(response => {
+          let data = response.data.data
+          this.yx_state= {
+            state: data.appState,
+            averageTime: data.respTime.avg,
+            maxTime: data.respTime.max,
+            averageTraffic: data.throughput.avg,
+            maxTraffic: data.throughput.max,
+            memory: data.resource.memory
+          }
+        })
+    },
     getImageInfo() {
       this.$http
         .get("./static/deployappdetail.json")
@@ -825,6 +840,33 @@ export default {
   background-color: #f7f8f9;
   width: 1022px;
 } 
+.service_list ::-webkit-scrollbar {
+width: 0px; /*对垂直流动条有效*/
+height: 0px; /*对水平流动条有效*/
+}
+
+/*定义滚动条的轨道颜色、内阴影及圆角*/
+.service_list ::-webkit-scrollbar-track{
+background-color: rosybrown;
+border-radius: 3px;
+}
+
+
+/*定义滑块颜色、内阴影及圆角*/
+.service_list ::-webkit-scrollbar-thumb{
+border-radius: 7px;
+background-color: #E8E8E8;
+}
+
+/*定义两端按钮的样式*/
+.service_list ::-webkit-scrollbar-button {
+background-color:cyan;
+}
+
+/*定义右下角汇合处的样式*/
+.service_list ::-webkit-scrollbar-corner {
+background:khaki;
+}
 
 </style>
 <style scoped>
@@ -1032,7 +1074,7 @@ export default {
   border-radius: 12px 0px 0px 12px;
 }
 .service_box{
-  width: 400px;
+  width: 398px;
 	height: 48px;
   line-height: 48px;
   text-align: left;

src/pages/workbench/yygl/deployment.vue

@@ -156,6 +156,19 @@
                 {{ save }}
               </div>
             </el-form-item>
+            <el-form-item :label="item.text" v-if="item.type == 'volume'">
+              <div style="overflow:hidden;margin-bottom:5px;">
+                <div class="storage_type" @click="change_appset(item, 'check_type', 0)" :style="item.check_type==0?{backgroundColor:'#515fe7',color:'#f8f9fd'}:''">临时存储</div>
+                <div class="storage_type" @click="change_appset(item, 'check_type', 1)" :style="item.check_type==1?{backgroundColor:'#515fe7',color:'#f8f9fd'}:''">云存储</div>
+              </div>
+              <div class="cloud_save_box" v-if="item.check_type==1">
+                <el-radio-group v-model="item.value">
+                  <p v-for="(it,idx) in pvc_list" :key="idx+589000">
+                    <el-radio :label="it.disk_serial_number">{{it.disk_serial_number}}&nbsp;({{'用量：'+it.disk_cap+'Gi'+' '+'  ' +'类型：'+it.store_type}})</el-radio>
+                  </p>
+                </el-radio-group>
+              </div>
+            </el-form-item>
           </div>
         </el-form>
         <div class="senior_box" @click="senior_flag = true" v-if="!senior_flag">
@@ -319,10 +332,18 @@ export default {
     evtSource: null,
     stateList: [],
     finallyState: 0,
+    pvc_list:[],
   }),
   methods: {
+    get_pvc_list(){
+      this.$http.get(`/apaas/hubApi/market/buildPVCs/${this.baseInfoForm.namespace}`).then((response) => {
+        console.log(response);
+        this.pvc_list = response.data.data
+        this.get_step_info();
+      });
+    },
     get_name_space() {
-      this.$http.get(`/apaas/hubApi/market/namespaces`).then((response) => {
+      this.$http.get(`/apaas/hubApi/market/namespaces?state=1`).then((response) => {
         console.log(response);
         this.area_options = response.data.data;
       });
@@ -347,8 +368,12 @@ export default {
               e["memory"] = parseInt(memory);
               e["cpu"] = parseInt(cpu);
               // this.deal_key_value(this.app_set_info,e.name,'resource',[memory,cpu])
-            } else {
+            } else if(e.type == "volume") {
+              e['check_type'] = 0
+              e['value'] = this.pvc_list[0].disk_serial_number
               // this.deal_key_value(this.app_set_info,e.name,e.type,e.value)
+            }else{
+
             }
           });
           this.step2_arr = step2_arr;
@@ -397,7 +422,18 @@ export default {
                 selector: {},
               },
             };
-          } else {
+          } else if(type == "volume") {
+            //临时存储
+            if(value[1]==0){
+              temp[e] = {
+                emptyDir:true
+              }
+            }else{//云存储
+              temp[e] = {
+                claimName:value[0]
+              }
+            }
+          }else{
             temp[e] = value;
           }
         } else {
@@ -468,6 +504,7 @@ export default {
         if (valid) {
           if (n == 1) {
             this.get_work_name();
+            this.get_pvc_list()
           } else if (n == 2) {
             this.sub_app_set();
           }
@@ -513,7 +550,9 @@ export default {
             e.memory,
             e.cpu,
           ]);
-        } else {
+        } else if(e.type == "volume") {
+          this.deal_key_value(e.name, e.type, [e.value,e.check_type]);
+        }else{
           this.deal_key_value(e.name, e.type, e.value);
         }
       });
@@ -609,7 +648,6 @@ export default {
       this.step = 0;
       this.get_status();
       this.get_name_space();
-      this.get_step_info();
       this.get_step_file();
     },
   },
@@ -752,4 +790,28 @@ export default {
 .image_list .el-table__row:nth-child(odd) td {
   background-color: #f8f9fd;
 }
+.storage_type{
+  width: 76px;
+	height: 35px;
+  line-height: 35px;
+  text-align: center;
+	background-color: #f7f8f9;
+	border-radius: 6px;
+  font-size: 14px;
+  color: #6573ae;
+  float: left;
+  cursor: pointer;
+  margin-right: 10px;
+}
+.cloud_save_box{
+  width: 786px;
+	background-color: #f7f8f9;
+	border-radius: 6px;
+  padding: 20px;
+  padding-bottom: 10px;
+}
+.cloud_save_box p{
+  height: 30px;
+  line-height: 30px;
+}
 </style>