diff --git a/src/assets/imgs/icon_huoqu.png b/src/assets/imgs/icon_huoqu.png
index 49f12402dcfcdee119af949ce91f9568bafb02e4..69aabb15e04c61cd54e3e236482d0769092cb596 100644
Binary files a/src/assets/imgs/icon_huoqu.png and b/src/assets/imgs/icon_huoqu.png differ
diff --git a/src/assets/imgs/icon_liulan.png b/src/assets/imgs/icon_liulan.png
index c68189cd61df02e6710dc111500025639ac826c8..1d23933e8e7d231940079c168add777c59692329 100644
Binary files a/src/assets/imgs/icon_liulan.png and b/src/assets/imgs/icon_liulan.png differ
diff --git a/src/assets/imgs/img_bg_jiage.png b/src/assets/imgs/img_bg_jiage.png
new file mode 100644
index 0000000000000000000000000000000000000000..a5a985866cfb02a76dbd9a352fc6ea2c36791288
Binary files /dev/null and b/src/assets/imgs/img_bg_jiage.png differ
diff --git a/src/assets/imgs/progress_ic_fuwu.png b/src/assets/imgs/progress_ic_fuwu.png
new file mode 100644
index 0000000000000000000000000000000000000000..47d97edbddd7924dfc84b0e5c31253bce7325223
Binary files /dev/null and b/src/assets/imgs/progress_ic_fuwu.png differ
diff --git a/src/assets/imgs/progress_ic_jindu.png b/src/assets/imgs/progress_ic_jindu.png
new file mode 100644
index 0000000000000000000000000000000000000000..add57543f48e88e286ed917e29509bd1eb9b0e0e
Binary files /dev/null and b/src/assets/imgs/progress_ic_jindu.png differ
diff --git a/src/assets/imgs/progress_ic_wancheng.png b/src/assets/imgs/progress_ic_wancheng.png
index ace9a5ea0b67d9bd6859df8ffb05d6bd7ef9a352..bc36c785f358207b744b8b2c302102b4955c3ad8 100644
Binary files a/src/assets/imgs/progress_ic_wancheng.png and b/src/assets/imgs/progress_ic_wancheng.png differ
diff --git a/src/assets/imgs/progress_ic_xinxi.png b/src/assets/imgs/progress_ic_xinxi.png
new file mode 100644
index 0000000000000000000000000000000000000000..6b95d607c5794b8593b66581b5f1789d7f58ae20
Binary files /dev/null and b/src/assets/imgs/progress_ic_xinxi.png differ
diff --git a/src/assets/imgs/progress_ic_yingyong.png b/src/assets/imgs/progress_ic_yingyong.png
new file mode 100644
index 0000000000000000000000000000000000000000..1cf73c1582c739a9acb75ad63b9f8c2b427ebcb8
Binary files /dev/null and b/src/assets/imgs/progress_ic_yingyong.png differ
diff --git a/src/assets/imgs/progress_ic_yuanzhuang.png b/src/assets/imgs/progress_ic_yuanzhuang.png
new file mode 100644
index 0000000000000000000000000000000000000000..85f9e98809131ddad6357d1d0346ce69c509734f
Binary files /dev/null and b/src/assets/imgs/progress_ic_yuanzhuang.png differ
diff --git a/src/assets/imgs/shop_ic_enter.png b/src/assets/imgs/shop_ic_enter.png
index fcd8422bc5f82c27f707d61f0784ae951b59a401..6292cfaadb1870dfb59cbc878e45449e9fb39af0 100644
Binary files a/src/assets/imgs/shop_ic_enter.png and b/src/assets/imgs/shop_ic_enter.png differ
diff --git a/src/assets/imgs/shop_ic_yysd.png b/src/assets/imgs/shop_ic_yysd.png
index 5fdb2d6905d08480822a3f19b842653464ebc8ee..f30c793b6e210a9ace1354f81191473708f6967e 100644
Binary files a/src/assets/imgs/shop_ic_yysd.png and b/src/assets/imgs/shop_ic_yysd.png differ
diff --git a/src/assets/imgs/shop_ic_yysd_sel.png b/src/assets/imgs/shop_ic_yysd_sel.png
index ba1d21818d5933cce3b85cad4a5a0ae50ab63249..9fd59ae95b3a416b6bc334ab843f1707363ebc50 100644
Binary files a/src/assets/imgs/shop_ic_yysd_sel.png and b/src/assets/imgs/shop_ic_yysd_sel.png differ
diff --git a/src/assets/imgs/shop_img_hqlc.png b/src/assets/imgs/shop_img_hqlc.png
new file mode 100644
index 0000000000000000000000000000000000000000..c052e61264f9efdc4a6bee2f946294d98ce3a87f
Binary files /dev/null and b/src/assets/imgs/shop_img_hqlc.png differ
diff --git a/src/assets/imgs/shop_img_hqlc_yingyong.png b/src/assets/imgs/shop_img_hqlc_yingyong.png
new file mode 100644
index 0000000000000000000000000000000000000000..8477d2d73969e31991a5dbb923792c1fb89baf6c
Binary files /dev/null and b/src/assets/imgs/shop_img_hqlc_yingyong.png differ
diff --git a/src/assets/imgs/shop_tool_ic_ganzhifw.png b/src/assets/imgs/shop_tool_ic_ganzhifw.png
index f8664289b5ba28e34d86401e3d571f209feb6973..c6374d7e980c8e55f4b96dd14902d1056c48e0ca 100644
Binary files a/src/assets/imgs/shop_tool_ic_ganzhifw.png and b/src/assets/imgs/shop_tool_ic_ganzhifw.png differ
diff --git a/src/assets/imgs/shop_tool_ic_ganzhifw_sel.png b/src/assets/imgs/shop_tool_ic_ganzhifw_sel.png
index 19e01aabf55cea75c3a365c96038569b729c83e7..2e050f21cab09684ec1ff15f946869728169cde1 100644
Binary files a/src/assets/imgs/shop_tool_ic_ganzhifw_sel.png and b/src/assets/imgs/shop_tool_ic_ganzhifw_sel.png differ
diff --git a/src/assets/imgs/shop_tool_ic_sjfw.png b/src/assets/imgs/shop_tool_ic_sjfw.png
index 0d5a7e9aed04b39597f367d8b410b7df471c0ca2..897598878f3f277fe6490da2054d5769d4811332 100644
Binary files a/src/assets/imgs/shop_tool_ic_sjfw.png and b/src/assets/imgs/shop_tool_ic_sjfw.png differ
diff --git a/src/assets/imgs/shop_tool_ic_sjfw_sel.png b/src/assets/imgs/shop_tool_ic_sjfw_sel.png
index 2428a8a105ea15a5e6f02573df4f18abda53a168..e6f29c72fb6780c5a1fa0e0d85646b6a2957b708 100644
Binary files a/src/assets/imgs/shop_tool_ic_sjfw_sel.png and b/src/assets/imgs/shop_tool_ic_sjfw_sel.png differ
diff --git a/src/assets/imgs/shop_tool_ic_skfw.png b/src/assets/imgs/shop_tool_ic_skfw.png
index 9528f2a990686106b86e33400cb9e29cde4af3ed..b86534338aab61491bc07be623e97e8646615bb5 100644
Binary files a/src/assets/imgs/shop_tool_ic_skfw.png and b/src/assets/imgs/shop_tool_ic_skfw.png differ
diff --git a/src/assets/imgs/shop_tool_ic_skfw_sel.png b/src/assets/imgs/shop_tool_ic_skfw_sel.png
index c643720c911af5e37b86246db42cb2cb39eeb0ea..ffcd5a57c0a40c55b4665968cd6231283ed32e85 100644
Binary files a/src/assets/imgs/shop_tool_ic_skfw_sel.png and b/src/assets/imgs/shop_tool_ic_skfw_sel.png differ
diff --git a/src/assets/imgs/shop_tool_ic_spfw.png b/src/assets/imgs/shop_tool_ic_spfw.png
index 3951fbfa52c7ce7e884636a8e351116d22024f94..e450fb51ac433acbdc36b6727c09b4a9ca52d802 100644
Binary files a/src/assets/imgs/shop_tool_ic_spfw.png and b/src/assets/imgs/shop_tool_ic_spfw.png differ
diff --git a/src/assets/imgs/shop_tool_ic_spfw_sel.png b/src/assets/imgs/shop_tool_ic_spfw_sel.png
index 22f692ce25721a0d14e39af4698bcd7d4d9f5abb..57d34722d5d8048418f22fbde3e578b909d2827b 100644
Binary files a/src/assets/imgs/shop_tool_ic_spfw_sel.png and b/src/assets/imgs/shop_tool_ic_spfw_sel.png differ
diff --git a/src/assets/imgs/shop_tool_ic_yzyfw.png b/src/assets/imgs/shop_tool_ic_yzyfw.png
index c528951740646e5b2ed7e42e9a4e1a5496d1494c..7adf0670856f7199ba52617552dc6ca83259aa91 100644
Binary files a/src/assets/imgs/shop_tool_ic_yzyfw.png and b/src/assets/imgs/shop_tool_ic_yzyfw.png differ
diff --git a/src/assets/imgs/shop_tool_ic_yzyfw_sel.png b/src/assets/imgs/shop_tool_ic_yzyfw_sel.png
index b85663f86cf1a0606f837fbb841b3b85078ea11a..036ed1f68e37821b53bd3ed6f6d06bebe6b514a1 100644
Binary files a/src/assets/imgs/shop_tool_ic_yzyfw_sel.png and b/src/assets/imgs/shop_tool_ic_yzyfw_sel.png differ
diff --git a/src/assets/imgs/shop_tool_ic_zhyyfw.png b/src/assets/imgs/shop_tool_ic_zhyyfw.png
index aa0bf23a9382d2cca574790443ce46b7e3b945f9..b6ce69bd07bc27b262ad50bc9a285d7c515881a7 100644
Binary files a/src/assets/imgs/shop_tool_ic_zhyyfw.png and b/src/assets/imgs/shop_tool_ic_zhyyfw.png differ
diff --git a/src/assets/imgs/shop_tool_ic_zhyyfw_sel.png b/src/assets/imgs/shop_tool_ic_zhyyfw_sel.png
index 177723b6cb44daac7f4385f48d345bcffa7398dd..b8226067b1864618b33c3e9f546439ee9e16559a 100644
Binary files a/src/assets/imgs/shop_tool_ic_zhyyfw_sel.png and b/src/assets/imgs/shop_tool_ic_zhyyfw_sel.png differ
diff --git a/src/components/service-info/app-info.vue b/src/components/service-info/app-info.vue
index 21eac76df39edf7bc98d9d09b62eeffbbf3a382e..36f051860db206bd86b1710ffecfdf7165ee3690 100644
--- a/src/components/service-info/app-info.vue
+++ b/src/components/service-info/app-info.vue
@@ -1,40 +1,28 @@
 <template>
-  <div class="service_info apaas_button" v-if="data">
-    <div class="service_title">
-      <span class="service_name" v-text="data.app_name"></span>
-      <span class="service_access_info">
-        <img :src="require('@/assets/imgs/icon_liulan.png')" />
-        <span v-text="'浏览次数：' + data.view_count"></span>
-      </span>
-      <span class="service_access_info">
-        <img :src="require('@/assets/imgs/icon_huoqu.png')" />
-        <span v-text="'部署次数：' + data.deploy_times"></span>
-      </span>
-    </div>
+  <BlockRadius
+    :borRadius="8"
+    :paddingNum="32"
+    class="service_info apaas_button"
+    v-if="data"
+  >
     <div class="main_container">
       <div class="main_container-left">
         <img :src="data.logo" width="100%" />
       </div>
       <div class="main_container-right">
-        <ul class="service_base_info">
-          <li>
-            <span>应用开发者：</span>
-            <span v-text="data.username"> </span>
-          </li>
-          <li>
-            <span>应用类型：</span>
-            <span v-html="data.type_name"></span>
-          </li>
-          <li>
-            <span>业务领域：</span>
-            <span v-text="data.ywly_name"></span>
-          </li>
-          <li>
-            <span>上线时间：</span>
-            <span v-text="data.create_date"></span>
-          </li>
-        </ul>
-        <div class="and_wid">
+        <div class="service_title">
+          <span class="service_name" v-text="data.app_name"></span>
+          <span class="service_access_info">
+            <img :src="require('@/assets/imgs/icon_liulan.png')" />
+            <span v-text="data.view_count + '次浏览'"></span>
+          </span>
+          <span class="service_access_info">
+            <img :src="require('@/assets/imgs/icon_huoqu.png')" />
+            <span v-text="'本月' + data.apply_times + '次获取'"></span>
+          </span>
+        </div>
+        <p class="des_p">{{ data.yyjj }}</p>
+        <div class="jiage_d">
           <div class="dbn_wkdn">
             价&nbsp;&nbsp;格：
             <span class="ndwa_indowa"> {{ data.price * duration }} </span>
@@ -48,38 +36,44 @@
           </div>
         </div>
         <div class="commodity_information">
-          <span>规&emsp;&emsp;格：</span>
-          <div class="btn_container_ddaw">
-              {{ data.price }} 金币/月
-          </div>
+          <span class="guige_title">规&emsp;&emsp;格：</span>
+          <div class="spec_btn_act">申请获取应用镜像部署权限</div>
+        </div>
+        <div class="spec_des">
+          {{ `申请获取应用镜像部署权限，每月${data.price}金币。` }}
         </div>
         <div class="commodity_information">
-          <span>购买时长：</span>
+          <span class="guige_title">购买时长：</span>
           <div class="btn_container">
             <el-input-number
               v-model="duration"
               :min="1"
               :disabled="actionDisabled"
-            ></el-input-number>月
+            ></el-input-number
+            >月
           </div>
         </div>
         <div class="commodity_action">
-          <el-button type="warning" plain @click="addToCart">
-            加入购物车
-          </el-button>
-          <el-button type="warning" @click="applyImmediately">
+          <el-button class="service_now_buy" @click="applyImmediately">
             立即申请
           </el-button>
+          <el-button class="service_add_cart" @click="addToCart">
+            加入购物车
+          </el-button>
         </div>
       </div>
     </div>
-  </div>
+  </BlockRadius>
 </template>
 
 <script>
+import BlockRadius from "@/components/general/block-radius";
 export default {
+  components: {
+    BlockRadius,
+  },
   props: {
-    data: {
+    datas: {
       type: Object,
       default: () => null,
     },
@@ -97,7 +91,18 @@ export default {
     ],
     specificationID: 1,
     duration: 1,
+    data: {},
   }),
+  watch: {
+    datas: {
+      handler(val) {
+        this.data = val;
+        console.log(this.data);
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
   computed: {
     actionDisabled() {
       return this.specifications.length == 0;
@@ -159,27 +164,24 @@ export default {
 </script>
 
 <style scoped>
-.service_info {
-  padding: 35px 20px 40px;
-  background-color: #fff;
-  margin-bottom: 20px;
-}
 .main_container {
   display: flex;
-  justify-content: flex-start;
+  justify-content: space-between;
   align-items: flex-start;
-  margin-top: 25px;
+  margin: 8px 8px 0;
 }
 .main_container-left {
-  width: 270px;
-  padding: 3px;
-  background-color: #f9fafc;
-  margin-right: 30px;
+  width: 200px;
+  height: 200px;
+  padding: 2px;
+  background-color: #f6f7fb;
   font-size: 0;
   position: relative;
 }
 .main_container-left img {
   width: 100%;
+  height: 100%;
+  border-radius: 6px;
 }
 .main_container-left > .map_view {
   position: absolute;
@@ -187,7 +189,7 @@ export default {
   bottom: 3px;
 }
 .main_container-right {
-  flex-grow: 1;
+  width: 896px;
 }
 .service_title {
   display: flex;
@@ -199,8 +201,21 @@ export default {
   font-weight: bold;
   color: #0d1847;
   line-height: 36px;
-  flex-grow: 1;
+  margin-right: auto;
 }
+.service_title > .service_type {
+  flex-shrink: 0;
+  height: 24px;
+  padding: 0 12px;
+  border: 1px solid #5362ee;
+  background-color: #5362ee;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  line-height: 22px;
+  margin-left: 10px;
+}
+
 .service_title > .service_access_info {
   flex-shrink: 0;
   font-size: 14px;
@@ -212,11 +227,11 @@ export default {
   vertical-align: middle;
 }
 .service_title > .service_access_info > img {
-  width: 19px;
+  width: 12px;
   margin-right: 5px;
 }
 .service_base_info {
-  padding: 25px 20px;
+  padding: 18px;
   background-color: #f9fafc;
   border-radius: 8px;
 }
@@ -233,22 +248,23 @@ export default {
   margin-top: 18px;
 }
 .service_base_info > li > span:first-child,
-.commodity_information > span:first-child {
-  flex-shrink: 0;
-  white-space: nowrap;
+.guige_title {
   color: #8890a7;
+  width: 100px;
+  margin-right: 20px;
+  text-align: right;
 }
 .service_base_info > li > span:nth-child(2) {
   color: #242c43;
 }
 .commodity_information {
-  margin-top: 30px;
+  margin-top: 16px;
 }
 .commodity_information > span:nth-child(2) {
   color: #58617a;
 }
 .commodity_information > span:first-child {
-  line-height: 40px;
+  line-height: 36px;
 }
 .commodity_information > .commodity_text {
   flex-grow: 1;
@@ -266,27 +282,40 @@ export default {
 .commodity_information > .btn_container > .el-input-number {
   margin: 0 20px 15px 0;
 }
-.btn_container_ddaw {
-  line-height: 40px;
-  margin-left: 5px;
-}
-.commodity_action {
-  margin-top: 60px;
-  text-align: right;
+.spec_btn {
+  height: 36px;
+  padding: 7px 18px 6px;
+  background-color: #ffffff;
+  border-radius: 6px;
+  border: solid 1px #dcdfe6;
+  font-size: 14px;
+  line-height: 20px;
+  color: #58617a;
+  margin-right: 8px;
+  margin-bottom: 8px;
+  cursor: pointer;
 }
-.commodity_action > .el-button {
-  width: 220px;
-  margin-left: 20px;
-  font-size: 16px;
+.spec_btn_act {
+  height: 36px;
+  padding: 7px 18px 6px;
+  background-color: #515fe7;
+  border-radius: 6px;
+  border: solid 1px #515fe7;
+  font-size: 14px;
+  line-height: 20px;
+  color: #f4f7fc;
+  margin-right: 8px;
+  margin-bottom: 8px;
+  cursor: pointer;
+}
+.spec_btn:hover {
+  background-color: #f2f5fe;
+  border: solid 1px #c3caf8;
+  color: #58617a;
 }
-.and_wid {
-  background-color: #f9fafc;
-  border-radius: 8px;
-  padding: 20px;
-  display: flex;
-  justify-content: space-between;
-  margin-top: 20px;
-  align-items: center;
+.commodity_action {
+  margin-top: 16px;
+  margin-left: 120px;
 }
 .dbn_wkdn {
   color: #8890a7;
@@ -311,6 +340,7 @@ export default {
   color: #ea7d19;
   font-size: 18px;
   position: relative;
+  font-weight: bold;
 }
 .dwin_diwa {
   width: 14px;
@@ -328,6 +358,82 @@ export default {
   top: 5px;
   left: -35px;
 }
+.service_add_cart {
+  width: 192px;
+  height: 40px;
+  background-color: #fcefd6;
+  border-radius: 6px;
+  border: solid 1px #fac266;
+  color: #e56600;
+  font-size: 16px;
+}
+.service_now_buy {
+  width: 192px;
+  height: 40px;
+  background-color: #e56600;
+  border: solid 1px #e56600;
+  border-radius: 6px;
+  color: #fcefd6;
+  font-size: 16px;
+  margin-right: 24px;
+}
+.tags {
+  display: inline-block;
+  margin-left: 8px;
+  height: 24px;
+  padding: 0 12px;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 24px;
+  border-radius: 4px;
+  position: relative;
+  top: 1px;
+  flex-shrink: 0;
+  margin-right: auto;
+}
+.map_service {
+  background-color: #626de9;
+  border: solid 1px #626de9;
+  color: #fff;
+}
+.shared {
+  background-color: #e7fdfc;
+  border: solid 1px #8bd6d0;
+  color: #25bdb1;
+}
+.restricted {
+  background-color: #fffee8;
+  border: solid 1px #e4c884;
+  color: #ef9433;
+}
+.sensitive {
+  background-color: #ffefef;
+  border: solid 1px #d7a4a9;
+  color: #e15260;
+}
+.des_p {
+  color: #8890a7;
+  font-size: 14px;
+  margin-top: 8px;
+  margin-bottom: 12px;
+}
+.jiage_d {
+  background: url("~@/assets/imgs/img_bg_jiage.png");
+  width: 896px;
+  height: 72px;
+  margin-bottom: 16px;
+  padding: 20px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.spec_des {
+  margin-left: 128px;
+  color: rgba(88, 97, 122, 0.5);
+  font-size: 14px;
+  line-height: 14px;
+  margin-top: 8px;
+}
 </style>
 
 <style>
@@ -355,4 +461,7 @@ export default {
 .service_info .el-input-number .el-input__inner {
   border-width: 2px;
 }
+.service_info .el-input-number {
+  width: 128px;
+}
 </style>
diff --git a/src/components/service-info/service-info.vue b/src/components/service-info/service-info.vue
index e96404630b1ca4d4f4d594aefc5b495eff98dff2..64c7282a4965bcff0cadd0f993253c4f6005827e 100644
--- a/src/components/service-info/service-info.vue
+++ b/src/components/service-info/service-info.vue
@@ -1,21 +1,10 @@
 <template>
-  <div class="service_info apaas_button" v-if="data && showItem">
-    <div class="service_title">
-      <span class="service_name" v-text="data.name"></span>
-      <span class="service_type" v-if="data.type" v-text="data.type"></span>
-      <span
-        class="service_level"
-        v-text="['-', '共享', '受限', '敏感'][data.openness || 0]"
-      ></span>
-      <span class="service_access_info">
-        <img :src="require('@/assets/imgs/icon_liulan.png')" />
-        <span v-text="'浏览次数：' + data.view_count"></span>
-      </span>
-      <span class="service_access_info">
-        <img :src="require('@/assets/imgs/icon_huoqu.png')" />
-        <span v-text="'获取次数：' + data.apply_count"></span>
-      </span>
-    </div>
+  <BlockRadius
+    :borRadius="8"
+    :paddingNum="32"
+    class="service_info apaas_button"
+    v-if="data && showItem"
+  >
     <div class="main_container">
       <div class="main_container-left" v-if="data.cover">
         <img :src="data.cover" width="100%" v-if="data.type !== 'workflow'" />
@@ -35,33 +24,25 @@
         ></process-view>
       </div>
       <div class="main_container-right">
-        <ul class="service_base_info">
-          <li>
-            <span>提供机构：</span>
-            <span v-text="data.organization_name"> </span>
-          </li>
-          <li>
-            <span>发布时间：</span>
-            <span v-text="dateTransform(data.create_time)"></span>
-          </li>
-          <li>
-            <span>更新时间：</span>
-            <span v-text="dateTransform(data.update_date)"></span>
-          </li>
-          <li>
-            <span>数据领域：</span>
-            <span v-text="data.sectors_name"></span>
-          </li>
-          <li>
-            <span>服务类型：</span>
-            <span v-html="data.data_service_type.join('&ensp;&ensp;')"></span>
-          </li>
-          <li>
-            <span>资源摘要：</span>
-            <span v-text="data.descript"></span>
-          </li>
-        </ul>
-        <div class="and_wid">
+        <div class="service_title">
+          <span class="service_name" v-text="data.name"></span>
+          <span class="service_type" v-if="data.type" v-text="data.type"></span>
+          <span v-if="data.openness == 1" class="tags shared">共享</span>
+          <span v-else-if="data.openness == 2" class="tags restricted">
+            受限
+          </span>
+          <span v-else class="tags sensitive">敏感</span>
+          <span class="service_access_info">
+            <img :src="require('@/assets/imgs/icon_liulan.png')" />
+            <span v-text="data.view_count + '次浏览'"></span>
+          </span>
+          <span class="service_access_info">
+            <img :src="require('@/assets/imgs/icon_huoqu.png')" />
+            <span v-text="data.apply_count + '次获取'"></span>
+          </span>
+        </div>
+        <p class="des_p">{{ data.descript }}</p>
+        <div class="jiage_d">
           <div class="dbn_wkdn">
             价&nbsp;&nbsp;格：<span class="ndwa_indowa">
               {{
@@ -79,7 +60,7 @@
           </div>
         </div>
         <div class="commodity_information">
-          <span>计次收费规格：</span>
+          <span class="guige_title">计次收费：</span>
           <span
             v-if="
               (data.serviceRequestSpcs.spcs_type_1 &&
@@ -96,18 +77,27 @@
             "
             class="btn_container"
           >
-            <el-button
+            <div
               v-for="(item, index) in data.serviceRequestSpcs.spcs_type_1"
               :key="'spcs_' + index"
-              :type="item.id === specification.id ? 'primary' : 'default'"
+              :class="
+                item.id === specification.id ? 'spec_btn_act' : 'spec_btn'
+              "
               @click="changeSpecification(item, 0)"
             >
               {{ item.money }}金币/{{ item.spcs_count }}次
-            </el-button>
+            </div>
           </div>
         </div>
+        <div class="spec_des">
+          {{
+            specification && specification.spcs_type == 1
+              ? specification.descript
+              : data.serviceRequestSpcs.spcs_type_1[0].descript
+          }}
+        </div>
         <div class="commodity_information">
-          <span>时长收费规格：</span>
+          <span class="guige_title">时长收费：</span>
           <span
             v-if="
               (data.serviceRequestSpcs.spcs_type_2 &&
@@ -118,27 +108,41 @@
             >暂无</span
           >
           <div v-else class="btn_container">
-            <el-button
+            <div
               v-for="(item, index) in data.serviceRequestSpcs.spcs_type_2"
               :key="'spcs_' + index"
-              :type="item.id === specification.id ? 'primary' : 'default'"
+              :class="
+                item.id === specification.id ? 'spec_btn_act' : 'spec_btn'
+              "
               @click="changeSpecification(item, 1)"
             >
               {{ item.money }}金币/月
-            </el-button>
+            </div>
           </div>
         </div>
-        <div class="commodity_information">
-          <span>规格说明：</span>
+        <div
+          class="spec_des"
+          v-if="
+            !(
+              (data.serviceRequestSpcs.spcs_type_2 &&
+                data.serviceRequestSpcs.spcs_type_2.length == 0) ||
+              !data.serviceRequestSpcs.spcs_type_2
+            )
+          "
+        >
+          {{ data.serviceRequestSpcs.spcs_type_2[0].descript || "-" }}
+        </div>
+        <!-- <div class="commodity_information">
+          <span class="guige_title">规格说明：</span>
           <span v-if="actionDisabled" class="commodity_text">暂无</span>
           <span
             v-else
             class="commodity_text"
             v-text="(specification && specification.descript) || '-'"
           ></span>
-        </div>
+        </div> -->
         <div class="commodity_information">
-          <span>购买时长：</span>
+          <span class="guige_title">购买时长：</span>
           <div v-if="showTime" class="btn_container">
             <el-input-number
               v-model="duration"
@@ -148,29 +152,28 @@
             月
           </div>
           <div v-else class="btn_container">
-            <el-button type="primary"> 不限时长 </el-button>
+            <div class="spec_btn_act">不限时长</div>
           </div>
         </div>
         <div class="commodity_action">
           <el-button
-            type="warning"
-            plain
-            @click="addToCart"
+            class="service_now_buy"
+            @click="applyImmediately"
             :disabled="actionDisabled"
           >
-            加入购物车
+            立即申请
           </el-button>
           <el-button
-            type="warning"
-            @click="applyImmediately"
+            class="service_add_cart"
+            @click="addToCart"
             :disabled="actionDisabled"
           >
-            立即申请
+            加入购物车
           </el-button>
         </div>
       </div>
     </div>
-  </div>
+  </BlockRadius>
 </template>
 
 <script>
@@ -178,12 +181,14 @@ import helper from "@/services/helper.js";
 import MapView from "./map-view";
 import workflowsView from "@/components/work-flow/workflows-view";
 import processView from "@/components/service-info/process-view";
+import BlockRadius from "@/components/general/block-radius";
 
 export default {
   components: {
     MapView,
     workflowsView,
     processView,
+    BlockRadius,
   },
   props: {
     data: {
@@ -334,27 +339,24 @@ export default {
 </script>
 
 <style scoped>
-.service_info {
-  padding: 20px;
-  background-color: #fff;
-  margin-bottom: 20px;
-}
 .main_container {
   display: flex;
-  justify-content: flex-start;
+  justify-content: space-between;
   align-items: flex-start;
-  margin-top: 25px;
+  margin: 8px 8px 0;
 }
 .main_container-left {
-  width: 466px;
-  padding: 3px;
-  background-color: #f9fafc;
-  margin-right: 30px;
+  width: 200px;
+  height: 200px;
+  padding: 2px;
+  background-color: #f6f7fb;
   font-size: 0;
   position: relative;
 }
 .main_container-left img {
   width: 100%;
+  height: 100%;
+  border-radius: 6px;
 }
 .main_container-left > .map_view {
   position: absolute;
@@ -362,7 +364,7 @@ export default {
   bottom: 3px;
 }
 .main_container-right {
-  flex-grow: 1;
+  width: 896px;
 }
 .service_title {
   display: flex;
@@ -381,24 +383,13 @@ export default {
   padding: 0 12px;
   border: 1px solid #5362ee;
   background-color: #5362ee;
-  border-radius: 12px;
+  border-radius: 4px;
   font-size: 12px;
   color: #fff;
   line-height: 22px;
   margin-left: 10px;
 }
-.service_title > .service_level {
-  flex-shrink: 0;
-  height: 24px;
-  padding: 0 12px;
-  border: 1px solid #25bdb1;
-  border-radius: 12px;
-  font-size: 12px;
-  color: #25bdb1;
-  line-height: 22px;
-  margin-left: 10px;
-  margin-right: auto;
-}
+
 .service_title > .service_access_info {
   flex-shrink: 0;
   font-size: 14px;
@@ -410,7 +401,7 @@ export default {
   vertical-align: middle;
 }
 .service_title > .service_access_info > img {
-  width: 19px;
+  width: 12px;
   margin-right: 5px;
 }
 .service_base_info {
@@ -431,22 +422,23 @@ export default {
   margin-top: 18px;
 }
 .service_base_info > li > span:first-child,
-.commodity_information > span:first-child {
-  flex-shrink: 0;
-  white-space: nowrap;
+.guige_title {
   color: #8890a7;
+  width: 100px;
+  margin-right: 20px;
+  text-align: right;
 }
 .service_base_info > li > span:nth-child(2) {
   color: #242c43;
 }
 .commodity_information {
-  margin-top: 30px;
+  margin-top: 16px;
 }
 .commodity_information > span:nth-child(2) {
   color: #58617a;
 }
 .commodity_information > span:first-child {
-  line-height: 40px;
+  line-height: 36px;
 }
 .commodity_information > .commodity_text {
   flex-grow: 1;
@@ -464,23 +456,40 @@ export default {
 .commodity_information > .btn_container > .el-input-number {
   margin: 0 20px 15px 0;
 }
-.commodity_action {
-  margin-top: 50px;
-  text-align: right;
+.spec_btn {
+  height: 36px;
+  padding: 7px 18px 6px;
+  background-color: #ffffff;
+  border-radius: 6px;
+  border: solid 1px #dcdfe6;
+  font-size: 14px;
+  line-height: 20px;
+  color: #58617a;
+  margin-right: 8px;
+  margin-bottom: 8px;
+  cursor: pointer;
 }
-.commodity_action > .el-button {
-  width: 220px;
-  margin-left: 20px;
-  font-size: 16px;
+.spec_btn_act {
+  height: 36px;
+  padding: 7px 18px 6px;
+  background-color: #515fe7;
+  border-radius: 6px;
+  border: solid 1px #515fe7;
+  font-size: 14px;
+  line-height: 20px;
+  color: #f4f7fc;
+  margin-right: 8px;
+  margin-bottom: 8px;
+  cursor: pointer;
+}
+.spec_btn:hover {
+  background-color: #f2f5fe;
+  border: solid 1px #c3caf8;
+  color: #58617a;
 }
-.and_wid {
-  background-color: #f9fafc;
-  border-radius: 8px;
-  padding: 20px;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-top: 20px;
+.commodity_action {
+  margin-top: 16px;
+  margin-left: 120px;
 }
 .dbn_wkdn {
   color: #8890a7;
@@ -505,6 +514,7 @@ export default {
   color: #ea7d19;
   font-size: 18px;
   position: relative;
+  font-weight: bold;
 }
 .dwin_diwa {
   width: 14px;
@@ -522,6 +532,82 @@ export default {
   top: 5px;
   left: -35px;
 }
+.service_add_cart {
+  width: 192px;
+  height: 40px;
+  background-color: #fcefd6;
+  border-radius: 6px;
+  border: solid 1px #fac266;
+  color: #e56600;
+  font-size: 16px;
+}
+.service_now_buy {
+  width: 192px;
+  height: 40px;
+  background-color: #e56600;
+  border: solid 1px #e56600;
+  border-radius: 6px;
+  color: #fcefd6;
+  font-size: 16px;
+  margin-right: 24px;
+}
+.tags {
+  display: inline-block;
+  margin-left: 8px;
+  height: 24px;
+  padding: 0 12px;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 24px;
+  border-radius: 4px;
+  position: relative;
+  top: 1px;
+  flex-shrink: 0;
+  margin-right: auto;
+}
+.map_service {
+  background-color: #626de9;
+  border: solid 1px #626de9;
+  color: #fff;
+}
+.shared {
+  background-color: #e7fdfc;
+  border: solid 1px #8bd6d0;
+  color: #25bdb1;
+}
+.restricted {
+  background-color: #fffee8;
+  border: solid 1px #e4c884;
+  color: #ef9433;
+}
+.sensitive {
+  background-color: #ffefef;
+  border: solid 1px #d7a4a9;
+  color: #e15260;
+}
+.des_p {
+  color: #8890a7;
+  font-size: 14px;
+  margin-top: 8px;
+  margin-bottom: 12px;
+}
+.jiage_d {
+  background: url("~@/assets/imgs/img_bg_jiage.png");
+  width: 896px;
+  height: 72px;
+  margin-bottom: 16px;
+  padding: 20px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.spec_des {
+  margin-left: 128px;
+  color: rgba(88, 97, 122, 0.5);
+  font-size: 14px;
+  line-height: 14px;
+  margin-top: 8px;
+}
 </style>
 
 <style>
@@ -549,4 +635,7 @@ export default {
 .service_info .el-input-number .el-input__inner {
   border-width: 2px;
 }
+.service_info .el-input-number {
+  width: 128px;
+}
 </style>
diff --git a/src/components/service-list/commodity-card-new.vue b/src/components/service-list/commodity-card-new.vue
index f369fd8c3f9708668b7b8c1f03a08d0ba9981606..2b9725518a08353ee290152cb5b162612b10d28c 100644
--- a/src/components/service-list/commodity-card-new.vue
+++ b/src/components/service-list/commodity-card-new.vue
@@ -21,7 +21,7 @@
             score-template="{value}"
           ></el-rate>
           <p class="get_num">
-            本月获取：
+            获取次数：
             <span class="com_cell_right_time">
               {{ cellData.deploy_times }}
             </span>
diff --git a/src/components/service-list/commodity-cell-new.vue b/src/components/service-list/commodity-cell-new.vue
index 334676092df80d547df06c09f2a5f5f9ca8db437..ab28a01f9e175cf8345e3bac1991045c4b185e71 100644
--- a/src/components/service-list/commodity-cell-new.vue
+++ b/src/components/service-list/commodity-cell-new.vue
@@ -32,7 +32,7 @@
             score-template="{value}"
           ></el-rate>
           <p class="get_num">
-            本月获取：
+            获取次数：
             <span class="com_cell_right_time">
               {{ cellData.apply_num }}
             </span>
diff --git a/src/components/service-tabs/service-tab-detail.vue b/src/components/service-tabs/service-tab-detail.vue
index 47864bb25e8c2a1a4aa07013580778d7c810b150..336061b2822694fb410e202eae8a5d7bddd8956f 100644
--- a/src/components/service-tabs/service-tab-detail.vue
+++ b/src/components/service-tabs/service-tab-detail.vue
@@ -7,10 +7,18 @@
     >
       <h3 class="detail-title" v-text="item.name + '：'"></h3>
 
-      <service-steps
-        v-if="item.type == 'step'"
-        :data="item.value"
-      ></service-steps>
+      <div class="step_div" v-if="item.type == 'step'">
+        <img
+          class="step_img"
+          :src="require('@/assets/imgs/shop_img_hqlc.png')"
+        />
+      </div>
+      <div class="step_div" v-else-if="item.type == 'step_app'">
+        <img
+          class="step_img"
+          :src="require('@/assets/imgs/shop_img_hqlc_yingyong.png')"
+        />
+      </div>
       <p
         v-else-if="item.type == 'text'"
         class="detail-text"
@@ -21,6 +29,34 @@
         class="detail-code"
         v-html="item.value"
       ></div>
+      <div v-else-if="item.type == 'table-list'">
+        <table class="xq_table">
+          <tr>
+            <td>数据领域：{{ item.value.sectors_name }}</td>
+            <td>服务类型：{{ item.value.data_service_type1_name }}&nbsp;&nbsp;&nbsp;&nbsp;{{ item.value.data_service_type2_name }}</td>
+          </tr>
+          <tr>
+            <td>发布时间：{{ helper.dateStringTransform(item.value.create_time) }}</td>
+            <td>更新时间：{{ helper.dateStringTransform(item.value.update_date) }}</td>
+          </tr>
+          <tr>
+            <td>请求方式：{{ item.value.req_type }}</td>
+            <td>编码格式：{{ item.value.encode_method }}</td>
+          </tr>
+        </table>
+      </div>
+      <div v-else-if="item.type == 'app-list'">
+        <table class="xq_table">
+          <tr>
+            <td>部署来源：{{ item.value.online_state_name }}</td>
+            <td>上线时间：{{ item.value.create_date }}</td>
+          </tr>
+          <tr>
+            <td>业务领域：{{ item.value.ywly_name }}</td>
+            <td>应用类型：{{ item.value.type_name }}</td>
+          </tr>
+        </table>
+      </div>
       <workflows-view
         v-else-if="item.type == 'workflows'"
         :id="item.value"
@@ -68,6 +104,7 @@
 <script>
 import serviceSteps from "@/components/service-tabs/service-steps";
 import workflowsView from "@/components/work-flow/workflows-view";
+import helper from "@/services/helper.js";
 
 export default {
   components: {
@@ -80,18 +117,31 @@ export default {
       required: true,
     },
   },
+  data() {
+    return {
+      helper
+    }
+  }
 };
 </script>
 
 <style scoped>
+.step_div {
+  margin-top: 16px;
+}
+.step_img {
+  width: 1140px;
+  height: 152px;
+}
 .detail-item:not(:last-child) {
   margin-bottom: 20px;
 }
 .detail-item .detail-title {
   font-size: 14px;
-  line-height: 25px;
+  line-height: 14px;
   color: #8890a7;
-  margin-bottom: 3px;
+  margin-bottom: 8px;
+  margin-left: 8px;
 }
 .detail-item .detail-text {
   word-break: break-all;
@@ -111,4 +161,44 @@ export default {
   line-height: 25px;
   margin-top: 8px;
 }
+.xq_table {
+  border: solid 1px #dde0e9;
+  width: 100%;
+  border-collapse: collapse;
+  border-spacing: 0;
+  empty-cells: show;
+  margin-top: 16px;
+}
+.xq_table caption {
+  color: #000;
+  padding: 1em 0;
+  text-align: center;
+}
+.xq_table td,
+.xq_table th {
+  border-left: 1px solid #cbcbcb;
+  border-width: 0 0 0 1px;
+  font-size: inherit;
+  margin: 0;
+  overflow: visible;
+  padding: 0.5em 1em;
+}
+.xq_table thead {
+  background-color: #e0e0e0;
+  color: #000;
+  text-align: left;
+  vertical-align: bottom;
+}
+.xq_table td {
+  background-color: transparent;
+}
+.xq_table td {
+  color: #242c43;
+  font-size: 14px;
+  line-height: 30px;
+  border-bottom: 1px solid #cbcbcb;
+}
+.xq_table tbody > tr:last-child > td {
+  border-bottom-width: 0;
+}
 </style>
diff --git a/src/components/service-tabs/service-tab-provider.vue b/src/components/service-tabs/service-tab-provider.vue
index 2ace11ec06886741a6237a18fc3de07779a192db..10a5178d8f01b82c479b426584d7dd2bd77df8de 100644
--- a/src/components/service-tabs/service-tab-provider.vue
+++ b/src/components/service-tabs/service-tab-provider.vue
@@ -1,81 +1,142 @@
 <template>
-  <div class="service_tab-provider" v-if="data">
-    <div class="provider-left">
-      <el-avatar
-        shape="square"
-        :size="156"
-        fit="cover"
-        :src="data.picture_path"
-      />
-    </div>
-    <div class="provider-right">
-      <p class="provider_name" v-text="data.organization_name"></p>
-      <div class="provider_info">
-        <p>
-          <span>联系人：</span>
-          <span v-text="data.user_name"></span>
-        </p>
-        <p>
-          <span>联系电话：</span>
-          <span v-text="data.phone"></span>
-        </p>
+  <div>
+    <div class="pro_title">机构信息：</div>
+    <div class="pro_div">
+      <div class="pro_img_d">
+        <img :src="data.picture_path" class="pro_img" />
       </div>
+      <div class="pro_1">机构名称：{{ data.organization_name }}</div>
+      <div class="pro_2">联系人：{{ data.user_name }}</div>
+      <div class="pro_3">联系电话：{{ data.phone }}</div>
     </div>
+    <div class="pro_title">{{ isApp ? '应用规格：' : '服务规格：'}}</div>
+    <table-um
+      ref="apply_service_state_table"
+      :headers="isApp ? dataHeadersApp : dataHeaders"
+      :stripe="false"
+      :datas="data.serviceRequestSpcsTable"
+    ></table-um>
   </div>
 </template>
 
 <script>
+import TableUm from "@/components/table/table-um";
 export default {
   props: {
     data: {
       type: Object,
       required: true,
     },
+    isApp: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      dataHeaders: [
+        {
+          label: "规格类型",
+          prop: "type",
+          align: "left",
+          width: "200"
+        },
+        {
+          label: "规格",
+          prop: "spce",
+          align: "left",
+          width: "300"
+        },
+        {
+          label: "购买时长",
+          prop: "times",
+          align: "center",
+          width: "200"
+        },
+        {
+          label: "规格说明",
+          prop: "descript",
+          align: "left",
+        },
+      ],
+      dataHeadersApp: [
+        {
+          label: "规格类别",
+          prop: "type",
+          align: "left",
+          width: "200"
+        },
+        {
+          label: "时长",
+          prop: "times",
+          align: "center",
+          width: "200"
+        },
+        {
+          label: "价格",
+          prop: "spcs",
+          align: "center",
+          width: "200"
+        },
+        {
+          label: "规格说明",
+          prop: "specifications",
+          align: "left",
+        },
+      ],
+    };
+  },
+  components: {
+    TableUm,
   },
 };
 </script>
 
 <style scoped>
-.service_tab-provider {
-  display: flex;
-  justify-content: flex-start;
-  align-items: flex-start;
-}
-.provider-left {
-  flex-shrink: 0;
-  padding: 3px;
-  background-color: #f6f7fb;
-  border-radius: 9px;
-  font-size: 0;
-}
-.provider-left > .el-avatar--square {
-  border-radius: 7px;
+.pro_title {
+  font-size: 14px;
+  line-height: 14px;
+  color: #8890a7;
+  margin-bottom: 8px;
+  margin-left: 8px;
 }
-.provider-right {
-  flex-grow: 1;
-  margin-left: 20px;
+.pro_div {
+  display: grid;
+  grid-template-columns: 88px 1fr 1fr;
+  grid-template-rows: 44px 44px;
+  grid-row-gap: 1px;
+  grid-column-gap: 1px;
+  background-color: #dde0e9;
+  padding: 1px;
+  margin-bottom: 24px;
 }
-.provider-right > .provider_name {
-  font-size: 20px;
-  font-weight: bold;
-  color: #0d1847;
-  line-height: 36px;
+.pro_img_d {
+  width: 88px;
+  height: 89px;
+  padding: 8px;
+  grid-row-start: 1;
+  grid-row-end: 3;
+  background-color: #fff;
 }
-.provider-right > .provider_info {
-  padding: 20px;
-  background-color: #f6f7fb;
-  border-radius: 6px;
-  margin-top: 20px;
+.pro_img {
+  width: 100%;
+  height: 100%;
 }
-.provider-right > .provider_info > p {
-  font-size: 14px;
-  color: #242c43;
-  line-height: 25px;
+.pro_1 {
+  grid-column-start: 2;
+  grid-column-end: 4;
+  line-height: 44px;
+  padding-left: 24px;
+  background-color: #fff;
 }
-.provider-right > .provider_info > p:not(:first-child) {
-  margin-top: 16px;
+.pro_2 {
+  line-height: 44px;
+  padding-left: 24px;
+  background-color: #fff;
 }
-.provider-right > .provider_info > p > span:first-child {
-  color: #8890a7;
+.pro_3 {
+  line-height: 44px;
+  padding-left: 24px;
+  background-color: #fff;
 }
 </style>
diff --git a/src/components/service-tabs/service-tabs.vue b/src/components/service-tabs/service-tabs.vue
index 93093f49d716ebeae270e4375f656d71145b514d..8b42e68f50f8016a5223db74b60909e5b680684c 100644
--- a/src/components/service-tabs/service-tabs.vue
+++ b/src/components/service-tabs/service-tabs.vue
@@ -13,23 +13,12 @@
       ></service-tab-detail>
     </el-tab-pane>
 
-    <!-- 规格说明 -->
-    <el-tab-pane
-      :label="specificationTitle"
-      name="specification"
-      v-if="serviceRequestSpcs"
-    >
-      <service-tab-specification
-        class="service_info"
-        :data="serviceRequestSpcs"
-      ></service-tab-specification>
-    </el-tab-pane>
-
     <!-- 提供组织 -->
     <el-tab-pane :label="providerTitle" name="provider" v-if="providerData">
       <service-tab-provider
         class="service_info"
         :data="providerData"
+        :isApp="detailTitle == '应用详情信息'"
       ></service-tab-provider>
     </el-tab-pane>
 
@@ -105,8 +94,11 @@ export default {
 <style scoped>
 .service_info_tab {
   border: none;
-  box-shadow: none;
+  box-shadow: 0px 4px 8px 0px 
+		rgba(0, 7, 101, 0.04);
+	border-radius: 8px;
   margin-bottom: 30px;
+  overflow: hidden;
 }
 .service_info {
   padding: 35px 40px 40px;
@@ -127,15 +119,33 @@ export default {
   background-color: #fff;
   border-top: 4px solid #fff;
   border-bottom: 2px solid #f4f7fc;
+  font-size: 15px;
+  font-weight: normal;
 }
 .service_info_tab.el-tabs--border-card
   > .el-tabs__header
   .el-tabs__item.is-active {
-  border-top: 4px solid #f5ab4c;
-  border-right: 2px solid #fcefd6;
+  border-top: 4px solid #fff;
+  border-right: 2px solid #f4f7fc;
   border-bottom: 2px solid #fff;
-  border-left: 2px solid #fcefd6;
+  border-left: 2px solid #f4f7fc;
+  border-radius: 6px 6px 0 0;
   color: #e56600 !important;
+  font-size: 15px;
+  font-weight: normal;
+  position: relative;
+}
+.service_info_tab.el-tabs--border-card
+  > .el-tabs__header
+  .el-tabs__item.is-active::before {
+  content: "";
+  position: absolute;
+  width: calc(100% + 3px);
+  height: 4px;
+  background-color: #f5ab4c;
+  border-radius: 4px 4px 0 0;
+  left: -2px;
+  top: -3px;
 }
 .service_info_tab.el-tabs--border-card
   > .el-tabs__header
diff --git a/src/components/shop-cloud/shop-cloud-new.vue b/src/components/shop-cloud/shop-cloud-new.vue
index ec68245b4f71379abc8b8ed9f2679d5f8a76988a..73bbedab17d86ebf4429486751cd7f505527abfe 100644
--- a/src/components/shop-cloud/shop-cloud-new.vue
+++ b/src/components/shop-cloud/shop-cloud-new.vue
@@ -348,6 +348,7 @@
                     <el-select
                       v-model="formOld.cpu"
                       placeholder="请选择CPU使用量"
+                      @change="changeCPU"
                     >
                       <el-option
                         v-for="item in optionsCPU"
diff --git a/src/components/work-flow/workflows-view.vue b/src/components/work-flow/workflows-view.vue
index a3574f965c7ee0b92d6d632933963542a45b2ae1..a68facd32d7548982220dda01ecfdce16e051304 100644
--- a/src/components/work-flow/workflows-view.vue
+++ b/src/components/work-flow/workflows-view.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="workflows-view" ref="flowContainer" :style="{zoom:zoom,}">
+  <div class="workflows-view" ref="flowContainer" :style="{ zoom: zoom }">
     <super-flow
       ref="superFlow"
       :node-list="nodeList"
@@ -23,6 +23,14 @@
           class="flow-node"
           :class="`flow-node-${meta.type}`"
         >
+          <div>
+            <svg-icon
+              id="judge_svg"
+              v-if="meta.type == 4"
+              icon-class="bg_tiaojian_nor"
+              class="judge_svg"
+            ></svg-icon>
+          </div>
           <span v-text="meta.name"></span>
         </div>
         <el-tooltip v-else effect="dark" placement="right-start">
@@ -40,6 +48,14 @@
             </div>
           </div>
           <div class="flow-node" :class="`flow-node-${meta.type}`">
+            <div>
+              <svg-icon
+                id="judge_svg"
+                v-if="meta.type == 4"
+                icon-class="bg_tiaojian_nor"
+                class="judge_svg"
+              ></svg-icon>
+            </div>
             <span v-text="meta.name"></span>
             <span class="example-count" v-text="meta.running_nodes || 0"></span>
           </div>
@@ -60,10 +76,10 @@ export default {
       type: Boolean,
       default: false,
     },
-    zoom:{
-      type:Number,
-      default:1,
-    }
+    zoom: {
+      type: Number,
+      default: 1,
+    },
   },
   data() {
     return {
@@ -91,8 +107,8 @@ export default {
       ])
         .then((response) => {
           let data = response[0].data.data;
-          let nodeList = data.nodeList||[];
-          let linkList = data.linkList||[];
+          let nodeList = data.nodeList || [];
+          let linkList = data.linkList || [];
           let nodes = response[1].data.data;
 
           nodes.forEach((node) => {
@@ -109,7 +125,7 @@ export default {
           this.nodeList = nodeList;
           this.linkList = linkList;
         })
-        .catch(function(error) {
+        .catch(function (error) {
           console.log(error);
         });
     },
@@ -170,6 +186,20 @@ export default {
   background-color: #f78181;
   color: #fff;
 }
+.flow-node-4 {
+  border: none;
+  box-shadow: none;
+  position: relative;
+  background: transparent;
+  line-height: 48px;
+}
+.judge_svg {
+  font-size: 116px;
+  position: absolute;
+  z-index: -1;
+  top: -34px;
+  left: 0px;
+}
 .example-count {
   position: absolute;
   right: -14px;
diff --git a/src/pages/service_shop/gzfwDetail.vue b/src/pages/service_shop/gzfwDetail.vue
index 306cfc5dc740e9c3d7fec74b865cde977758a28f..4292bef215681719266e43e1af8de0357f020c83 100644
--- a/src/pages/service_shop/gzfwDetail.vue
+++ b/src/pages/service_shop/gzfwDetail.vue
@@ -85,20 +85,30 @@ export default {
               value: ["服务申请", "信息填写", "审核确认", "服务获取"],
             },
             {
-              name: "服务描述",
-              type: "text",
-              value: datas.descript,
-            },
-            {
-              name: "请求方式",
-              type: "text",
-              value: ["-", "GET", "POST", "PUT", "DELETE"][datas.req_type || 0],
-            },
-            {
-              name: "编码格式",
-              type: "text",
-              value: datas.encode_method,
+              name: "服务信息",
+              type: "table-list",
+              value: {
+                data_service_type1_name: datas.data_service_type1_name,
+                data_service_type2_name: datas.data_service_type2_name,
+                sectors_name: datas.sectors_name,
+                create_time: datas.create_time,
+                update_date: datas.update_date,
+                req_type: ["-", "GET", "POST", "PUT", "DELETE"][
+                  datas.req_type || 0
+                ],
+                encode_method: datas.encode_method,
+              },
             },
+            // {
+            //   name: "请求方式",
+            //   type: "text",
+            //   value: ["-", "GET", "POST", "PUT", "DELETE"][datas.req_type || 0],
+            // },
+            // {
+            //   name: "编码格式",
+            //   type: "text",
+            //   value: datas.encode_method,
+            // },
             {
               name: "请求参数",
               type: "table",
@@ -172,11 +182,25 @@ export default {
               },
             },
           ];
+          let arr = datas.serviceRequestSpcs.spcs_type_1.concat(
+            datas.serviceRequestSpcs.spcs_type_2
+          );
+          arr.map((item) => {
+            item.type = item.spcs_type == 1 ? "计次收费规格" : "时长收费规格";
+            item.spce =
+              item.spcs_type == 1
+                ? `${item.money}金币/${item.spcs_count}次（${(
+                    item.money / item.spcs_count
+                  ).toFixed(2)}金币/1次）`
+                : `${item.money}金币/月（次数不限）`;
+            item.times = item.spcs_type == 1 ? "不限时长" : "按月";
+          });
           this.providerData = {
             organization_name: datas.organization_name,
             picture_path: datas.organization_picture,
             user_name: datas.register_user_info.user_name,
             phone: datas.register_user_info.phone,
+            serviceRequestSpcsTable: arr,
           };
           this.commentsData = datas.scoreDetail;
         })
diff --git a/src/pages/service_shop/sjfwDetail.vue b/src/pages/service_shop/sjfwDetail.vue
index c271366654dfeacbd0d7d30707141f2a5ed29968..fa8942b49dd3db698d39993cd8a1879fae87e0c9 100644
--- a/src/pages/service_shop/sjfwDetail.vue
+++ b/src/pages/service_shop/sjfwDetail.vue
@@ -16,7 +16,6 @@
       :detail-data="detailData"
       :provider-data="providerData"
       :comments-data="commentsData"
-      :serviceRequestSpcs="serviceRequestSpcs"
       :comments-url="commentsUrl"
     ></service-tabs>
   </div>
@@ -86,20 +85,30 @@ export default {
               value: ["服务申请", "信息填写", "审核确认", "服务获取"],
             },
             {
-              name: "服务描述",
-              type: "text",
-              value: datas.descript,
-            },
-            {
-              name: "请求方式",
-              type: "text",
-              value: ["-", "GET", "POST", "PUT", "DELETE"][datas.req_type || 0],
-            },
-            {
-              name: "编码格式",
-              type: "text",
-              value: datas.encode_method,
+              name: "服务信息",
+              type: "table-list",
+              value: {
+                data_service_type1_name: datas.data_service_type1_name,
+                data_service_type2_name: datas.data_service_type2_name,
+                sectors_name: datas.sectors_name,
+                create_time: datas.create_time,
+                update_date: datas.update_date,
+                req_type: ["-", "GET", "POST", "PUT", "DELETE"][
+                  datas.req_type || 0
+                ],
+                encode_method: datas.encode_method,
+              },
             },
+            // {
+            //   name: "请求方式",
+            //   type: "text",
+            //   value: ["-", "GET", "POST", "PUT", "DELETE"][datas.req_type || 0],
+            // },
+            // {
+            //   name: "编码格式",
+            //   type: "text",
+            //   value: datas.encode_method,
+            // },
             {
               name: "请求参数",
               type: "table",
@@ -173,15 +182,29 @@ export default {
               },
             },
           ];
+          let arr = datas.serviceRequestSpcs.spcs_type_1.concat(
+            datas.serviceRequestSpcs.spcs_type_2
+          );
+          arr.map((item) => {
+            item.type = item.spcs_type == 1 ? "计次收费规格" : "时长收费规格";
+            item.spce =
+              item.spcs_type == 1
+                ? `${item.money}金币/${item.spcs_count}次（${(
+                    item.money / item.spcs_count
+                  ).toFixed(2)}金币/1次）`
+                : `${item.money}金币/月（次数不限）`;
+            item.times = item.spcs_type == 1 ? "不限时长" : "按月";
+          });
           this.providerData = {
             organization_name: datas.organization_name,
             picture_path: datas.organization_picture,
             user_name: datas.register_user_info.user_name,
             phone: datas.register_user_info.phone,
+            serviceRequestSpcsTable: arr,
           };
           this.commentsData = datas.scoreDetail;
         })
-        .catch(function(error) {
+        .catch(function (error) {
           console.log(error);
         });
     },
diff --git a/src/pages/service_shop/skfwDetail.vue b/src/pages/service_shop/skfwDetail.vue
index 0ef453c56e09b88e7a5d57a4c99344885f1c3f87..cfe93d4e13b94034b59fafc6a2878ac9727eafdd 100644
--- a/src/pages/service_shop/skfwDetail.vue
+++ b/src/pages/service_shop/skfwDetail.vue
@@ -92,9 +92,19 @@ export default {
               value: ["服务申请", "信息填写", "审核确认", "服务获取"],
             },
             {
-              name: "服务描述",
-              type: "text",
-              value: datas.descript,
+              name: "服务信息",
+              type: "table-list",
+              value: {
+                data_service_type1_name: datas.data_service_type1_name,
+                data_service_type2_name: datas.data_service_type2_name,
+                sectors_name: datas.sectors_name,
+                create_time: datas.create_time,
+                update_date: datas.update_date,
+                req_type: ["-", "GET", "POST", "PUT", "DELETE"][
+                  datas.req_type || 0
+                ],
+                encode_method: datas.encode_method,
+              },
             },
             /* {
               name: "服务属性", // TODO: replace
@@ -132,15 +142,29 @@ export default {
               ],
             }, */
           ];
+          let arr = datas.serviceRequestSpcs.spcs_type_1.concat(
+            datas.serviceRequestSpcs.spcs_type_2
+          );
+          arr.map((item) => {
+            item.type = item.spcs_type == 1 ? "计次收费规格" : "时长收费规格";
+            item.spce =
+              item.spcs_type == 1
+                ? `${item.money}金币/${item.spcs_count}次（${(
+                    item.money / item.spcs_count
+                  ).toFixed(2)}金币/1次）`
+                : `${item.money}金币/月（次数不限）`;
+            item.times = item.spcs_type == 1 ? "不限时长" : "按月";
+          });
           this.providerData = {
             organization_name: datas.organization_name,
             picture_path: datas.organization_picture,
             user_name: datas.register_user_info.user_name,
             phone: datas.register_user_info.phone,
+            serviceRequestSpcsTable: arr,
           };
           this.commentsData = datas.scoreDetail;
         })
-        .catch(function(error) {
+        .catch(function (error) {
           console.log(error);
         });
     },
diff --git a/src/pages/service_shop/spfwDetail.vue b/src/pages/service_shop/spfwDetail.vue
index 626b3897087051035c6845492ef59926b9e5f2fc..40e864a3fb028dc9be58a5ba32c91c1a8ead960c 100644
--- a/src/pages/service_shop/spfwDetail.vue
+++ b/src/pages/service_shop/spfwDetail.vue
@@ -85,20 +85,30 @@ export default {
               value: ["服务申请", "信息填写", "审核确认", "服务获取"],
             },
             {
-              name: "服务描述",
-              type: "text",
-              value: datas.descript,
-            },
-            {
-              name: "请求方式",
-              type: "text",
-              value: ["-", "GET", "POST", "PUT", "DELETE"][datas.req_type || 0],
-            },
-            {
-              name: "编码格式",
-              type: "text",
-              value: datas.encode_method,
+              name: "服务信息",
+              type: "table-list",
+              value: {
+                data_service_type1_name: datas.data_service_type1_name,
+                data_service_type2_name: datas.data_service_type2_name,
+                sectors_name: datas.sectors_name,
+                create_time: datas.create_time,
+                update_date: datas.update_date,
+                req_type: ["-", "GET", "POST", "PUT", "DELETE"][
+                  datas.req_type || 0
+                ],
+                encode_method: datas.encode_method,
+              },
             },
+            // {
+            //   name: "请求方式",
+            //   type: "text",
+            //   value: ["-", "GET", "POST", "PUT", "DELETE"][datas.req_type || 0],
+            // },
+            // {
+            //   name: "编码格式",
+            //   type: "text",
+            //   value: datas.encode_method,
+            // },
             {
               name: "请求参数",
               type: "table",
@@ -172,11 +182,25 @@ export default {
               },
             },
           ];
+          let arr = datas.serviceRequestSpcs.spcs_type_1.concat(
+            datas.serviceRequestSpcs.spcs_type_2
+          );
+          arr.map((item) => {
+            item.type = item.spcs_type == 1 ? "计次收费规格" : "时长收费规格";
+            item.spce =
+              item.spcs_type == 1
+                ? `${item.money}金币/${item.spcs_count}次（${(
+                    item.money / item.spcs_count
+                  ).toFixed(2)}金币/1次）`
+                : `${item.money}金币/月（次数不限）`;
+            item.times = item.spcs_type == 1 ? "不限时长" : "按月";
+          });
           this.providerData = {
             organization_name: datas.organization_name,
             picture_path: datas.organization_picture,
             user_name: datas.register_user_info.user_name,
             phone: datas.register_user_info.phone,
+            serviceRequestSpcsTable: arr,
           };
           this.commentsData = datas.scoreDetail;
         })
diff --git a/src/pages/service_shop/yysdDetail.vue b/src/pages/service_shop/yysdDetail.vue
index 1e8abbb6db4ff5d568bf38fb225b04c955eb845a..3856e2d3cbfafdf87b264412d5cce7b2624d54ff 100644
--- a/src/pages/service_shop/yysdDetail.vue
+++ b/src/pages/service_shop/yysdDetail.vue
@@ -10,7 +10,7 @@
       </el-breadcrumb>
     </div>
 
-    <app-info :data="baseInfo"></app-info>
+    <app-info :datas="baseInfo"></app-info>
 
     <service-tabs
       :detail-data="detailData"
@@ -33,9 +33,64 @@ export default {
     serviceTabs,
   },
   data: () => ({
-    baseInfo: null,
-    detailData: null,
-    providerData: null,
+    baseInfo: {
+      app_id: "",
+      app_name: "",
+      apply_id: "",
+      apply_times: "",
+      apply_type_name: "",
+      create_date: "",
+      deploy_times: "",
+      logo: "",
+      online_state: "",
+      online_state_name: "",
+      source: "",
+      state: "",
+      type_name: "",
+      up_deploy_status: "",
+      up_platform_status: "",
+      up_userid: "",
+      username: "",
+      version: "",
+      view_count: "",
+      ywly_name: "",
+      yyjj: "",
+      price: "",
+    },
+    detailData: [
+      {
+        name: "获取流程",
+        type: "step_app",
+        value: ["应用申请", "信息填写", "审核确认", "应用获取"],
+      },
+      {
+        name: "应用信息",
+        type: "app-list",
+        value: {},
+      },
+      {
+        name: "功能简介",
+        type: "text",
+        value: "",
+      },
+      {
+        name: "应用场景",
+        type: "text",
+        value: "",
+      },
+      {
+        name: "应用参数",
+        type: "rich-text",
+        value: "",
+      },
+    ],
+    providerData: {
+      organization_name: "",
+      picture_path: "",
+      user_name: "",
+      phone: "",
+      serviceRequestSpcsTable: [],
+    },
   }),
   computed: {
     id() {
@@ -55,22 +110,59 @@ export default {
           },
         })
         .then(({ data }) => {
-          this.$api.serviceShop.getExtendedInfo({ id: this.id }).then((response) => {
-            this.baseInfo = data.data;
-            this.baseInfo = Object.assign(this.baseInfo, response.data.data);
-          });
+          this.$api.serviceShop
+            .getExtendedInfo({ id: this.id })
+            .then((response) => {
+              this.baseInfo.app_id = data.data.app_id;
+              this.baseInfo.app_name = data.data.app_name;
+              this.baseInfo.apply_id = data.data.apply_id;
+              this.baseInfo.apply_times = data.data.apply_times;
+              this.baseInfo.apply_type_name = data.data.apply_type_name;
+              this.baseInfo.create_date = data.data.create_date;
+              this.baseInfo.deploy_times = data.data.deploy_times;
+              this.baseInfo.logo = data.data.logo;
+              this.baseInfo.online_state = data.data.online_state;
+              this.baseInfo.online_state_name = data.data.online_state_name;
+              this.baseInfo.source = data.data.source;
+              this.baseInfo.state = data.data.state;
+              this.baseInfo.type_name = data.data.type_name;
+              this.baseInfo.up_deploy_status = data.data.up_deploy_status;
+              this.baseInfo.up_platform_status = data.data.up_platform_status;
+              this.baseInfo.up_userid = data.data.up_userid;
+              this.baseInfo.username = data.data.username;
+              this.baseInfo.version = data.data.version;
+              this.baseInfo.view_count = data.data.view_count;
+              this.baseInfo.ywly_name = data.data.ywly_name;
+              this.baseInfo.price = response.data.data.price;
+              this.baseInfo.price_style = response.data.data.price_style;
+              this.baseInfo.sale = response.data.data.sale;
+              this.baseInfo.star = response.data.data.star;
+            });
+          this.detailData[1].value = {
+            online_state_name: data.data.online_state_name,
+            type_name: data.data.type_name,
+            ywly_name: data.data.ywly_name,
+            create_date: data.data.create_date,
+          };
         })
         .catch(function (error) {
           console.log(error);
         });
-
-      let detailData = [
-        {
-          name: "获取流程",
-          type: "step",
-          value: ["应用申请", "信息填写", "审核确认", "应用获取"],
-        },
-      ];
+      this.$http
+        .get(`/apaas/hubApi/market/appSpecification?id=${this.id}`)
+        .then((res) => {
+          if (res.data.success) {
+            var data = res.data.data;
+            this.providerData.serviceRequestSpcsTable = [
+              {
+                type: "申请获取应用镜像部署权限",
+                spce: `${data.price}金币`,
+                times: "按月",
+                specifications: data.specifications,
+              },
+            ];
+          }
+        });
       Promise.all([
         this.$http.get(`/apaas/hubApi/market/app/detail/${this.id}`),
         this.$http.get(`/apaas/hubApi/market/values/${this.id}`),
@@ -78,30 +170,10 @@ export default {
         .then((response) => {
           let data1 = response[0].data.data;
           let data2 = response[1].data.data;
-
-          detailData.push(
-            {
-              name: "应用简介",
-              type: "text",
-              value: data1.yyjj,
-            },
-            {
-              name: "功能简介",
-              type: "text",
-              value: data1.gnjj,
-            },
-            {
-              name: "应用场景",
-              type: "text",
-              value: data1.cjsl,
-            },
-            {
-              name: "应用参数",
-              type: "rich-text",
-              value: data2,
-            }
-          );
-          this.detailData = detailData;
+          this.detailData[2].value = data1.gnjj;
+          this.detailData[3].value = data1.cjsl;
+          this.detailData[4].value = data2;
+          this.baseInfo.yyjj = data1.yyjj;
         })
         .catch(function (error) {
           console.log(error);
@@ -110,12 +182,10 @@ export default {
       this.$http
         .get(`/apaas/hubApi/appShop/orgInfo/${this.id}`)
         .then(({ data }) => {
-          this.providerData = {
-            organization_name: data.data.department_name,
-            picture_path: data.data.picture_path,
-            user_name: data.data.user_name,
-            phone: data.data.phone,
-          };
+          this.providerData.organization_name = data.data.department_name;
+          this.providerData.picture_path = data.data.picture_path;
+          this.providerData.user_name = data.data.user_name;
+          this.providerData.phone = data.data.phone;
         })
         .catch(function (error) {
           console.log(error);
diff --git a/src/pages/service_shop/zhfwDetail.vue b/src/pages/service_shop/zhfwDetail.vue
index 8ee40e293f59dbeedc7952fea3c6d0381ccdd240..d37645f9b050d37e44e601726cbc7d92ce6df2df 100644
--- a/src/pages/service_shop/zhfwDetail.vue
+++ b/src/pages/service_shop/zhfwDetail.vue
@@ -85,9 +85,19 @@ export default {
               value: ["服务申请", "信息填写", "审核确认", "服务获取"],
             },
             {
-              name: "服务描述",
-              type: "text",
-              value: datas.descript,
+              name: "服务信息",
+              type: "table-list",
+              value: {
+                data_service_type1_name: datas.data_service_type1_name,
+                data_service_type2_name: datas.data_service_type2_name,
+                sectors_name: datas.sectors_name,
+                create_time: datas.create_time,
+                update_date: datas.update_date,
+                req_type: ["-", "GET", "POST", "PUT", "DELETE"][
+                  datas.req_type || 0
+                ],
+                encode_method: datas.encode_method,
+              },
             },
             /* {
               name: "微服务响应列表", // TODO: replace
@@ -127,11 +137,25 @@ export default {
               value: datas.workflows_id,
             });
           }
+          let arr = datas.serviceRequestSpcs.spcs_type_1.concat(
+            datas.serviceRequestSpcs.spcs_type_2
+          );
+          arr.map((item) => {
+            item.type = item.spcs_type == 1 ? "计次收费规格" : "时长收费规格";
+            item.spce =
+              item.spcs_type == 1
+                ? `${item.money}金币/${item.spcs_count}次（${(
+                    item.money / item.spcs_count
+                  ).toFixed(2)}金币/1次）`
+                : `${item.money}金币/月（次数不限）`;
+            item.times = item.spcs_type == 1 ? "不限时长" : "按月";
+          });
           this.providerData = {
             organization_name: datas.organization_name,
             picture_path: datas.organization_picture,
             user_name: datas.register_user_info.user_name,
             phone: datas.register_user_info.phone,
+            serviceRequestSpcsTable: arr,
           };
           this.commentsData = datas.scoreDetail;
         })
diff --git a/src/pages/technical-support/answer-center/detail.vue b/src/pages/technical-support/answer-center/detail.vue
index 5ec10b147d40233c00b32af0f5d02f2e0a3bcbac..a67d98f22461e34a5d87ab196e4adf30dbff7f7c 100644
--- a/src/pages/technical-support/answer-center/detail.vue
+++ b/src/pages/technical-support/answer-center/detail.vue
@@ -42,7 +42,7 @@
                     <p>
                         <span class="left">{{item.username}}</span> 
                         <span class="right"> 
-                            <span v-if="index==0||index==1||index==2">{{index==0?'沙发':index==1?'板凳':'地板'}}</span> 
+                            <span v-if="index==0||index==1">{{index==0?'沙发':'板凳'}}</span> 
                             <span v-else>{{index}}楼</span> | <span>{{deal_time(item.created)}}</span> 
                         </span> 
                     </p>
diff --git a/src/pages/workbench/fwzc_fwcs.vue b/src/pages/workbench/fwzc_fwcs.vue
index 448b696ec6df9482a72cbbd0bc15c3671e9bf496..a483b59425b902ade25cdd9d3f57a9443c3efa10 100644
--- a/src/pages/workbench/fwzc_fwcs.vue
+++ b/src/pages/workbench/fwzc_fwcs.vue
@@ -135,6 +135,19 @@
                 :value="item.value"
               ></el-option>
             </el-select>
+            <el-select
+              v-if="activeBtn == 2 || activeBtn == 3"
+              v-model="select"
+              slot="prepend"
+              placeholder="请选择"
+            >
+              <el-option
+                v-for="item in optionType2"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              ></el-option>
+            </el-select>
             <el-select
               v-else
               v-model="select"
@@ -817,6 +830,10 @@ export default {
         { label: "DELETE", value: "DELETE" },
       ],
       optionType1: [{ label: "GET", value: "GET" }],
+      optionType2: [
+        { label: "GET", value: "GET" },
+        { label: "POST", value: "POST" },
+      ],
       activeName: "0",
       activeZh: "0",
       sjfwQqcs: [