Merge branch 'ldx' into dev

src/components/general/block-radius.vue

 <template>
-  <div class="block_radius">
+  <div class="block_radius" :style="'border-radius:' + borRadius + 'px'">
     <div v-if="show_header" class="block_header">
       <div class="block_header_title">{{ title }}</div>
       <div class="block_header_button_group">
@@ -32,6 +32,10 @@ export default {
     title: {
       type: String,
       default: ""
+    },
+    borRadius: {
+      type: Number,
+      default: 10,
     }
   },
   components: {},
@@ -56,7 +60,6 @@ export default {
 .block_radius {
   background-color: #fff;
   box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05);
-  border-radius: 10px;
   padding: 20px;
   margin-bottom: 20px;
 }

src/components/service-list/commodity-card.vue

 <template>
-  <div class="com_card">
-    <div class="com_card_top">
-      <img :src="cellData.logo" class="com_card_img" />
-      <div class="com_card_name_v">
-        <div class="com_card_msg_name">{{ cellData.app_name }}</div>
-        <div class="com_card_msg_version">V{{ cellData.version }}</div>
+  <div class="com_cell">
+    <div class="com_cell_up">
+      <div class="com_cell_up_img_init">
+        <img :src="cellData.logo" class="com_cell_up_img" />
       </div>
-    </div>
-    <div class="com_card_msg">
-      <div class="com_card_msg_tit">
-        <img :src="require('@/assets/imgs/icon_shijian.png')" />&nbsp;上线时间
+      <div class="com_cell_up_right">
+        <div class="up_title">
+          <div class="up_tit_name_in">
+            <span class="up_tit_name" :title="cellData.app_name + ' ( V' + cellData.version + ' )'" @click="goUrl(cellData.app_id)">
+              {{ cellData.app_name }} ( V{{ cellData.version }} )
+            </span>
+          </div>
+        </div>
+        <div class="up_rate">
+          <el-rate
+            v-model="cellData.score"
+            disabled
+            show-score
+            text-color="#ea7d19"
+            score-template="{value}"
+          ></el-rate>
+          <p class="get_num">
+            本月获取：
+            <span class="com_cell_right_time">
+              {{ cellData.deploy_times }}
+            </span>
+            <span class="ci"> 次</span>
+          </p>
+        </div>
       </div>
-      <div class="com_card_msg_num">{{ helper.dateStringTransform(cellData.create_date) }}</div>
-    </div>
-    <div class="com_card_msg">
-      <div class="com_card_msg_tit">
-        <img :src="require('@/assets/imgs/icon_huoqu1.png')" />&nbsp;部署次数
+      <div class="get_detail" @click="goUrl(cellData.app_id)">
+        <img src="@/assets/imgs/shop_ic_enter.png" />
       </div>
-      <div class="com_card_msg_num1">{{ cellData.deploy_times }}</div>
     </div>
-    <div class="com_card_btn">
-      <el-button size="medium" class="btn_1" @click="addShop(cellData.app_id)">加入购物车</el-button>
-      <el-button size="medium" class="btn_2" @click="goUrl(cellData.app_id)">查看详情</el-button>
+    <div class="com_cell_down">
+      <p class="com_detail">
+        {{ cellData.yyjj }}
+      </p>
+      <el-row :gutter="16">
+        <el-col :span="14" class="com_other">
+          <span class="name_title">应用类型：</span>
+          {{ cellData.type_name }}
+          &nbsp;&nbsp;{{ cellData.data_service_type2_name }} &nbsp;&nbsp;{{
+            cellData.data_service_type3_name
+          }}
+        </el-col>
+        <el-col :span="10" class="com_other">
+          <span class="name_title">业务领域：</span>
+          {{ cellData.ywly_name }}
+        </el-col>
+        <el-col :span="14" class="com_other">
+          <span class="name_title">上线时间：</span>
+          {{ helper.dateStringTransform(cellData.create_date) }}
+        </el-col>
+      </el-row>
     </div>
   </div>
 </template>
 
 <script>
 import helper from "@/services/helper.js";
+// if you meet date which like 2020-06-05T00:00:00+08:00, use helper.dateStringTransform()
 export default {
   components: {},
   props: {
     url: { type: String, default: "" },
     cellData: { type: Object, default: {} },
   },
-  data: () => ({
-    helper: helper,
-  }),
+  data: () => ({ helper: helper }),
   computed: {},
   watch: {},
   methods: {
@@ -45,129 +76,137 @@ export default {
         this.$router.push(this.url + "/" + parame);
       }
     },
-    addShop(id) {
-      let query = {
-        service_id: 0, // 0表示不是服务
-        app_id: parseFloat(id),
-        spec_id: 1,
-        duration: 1,
-        duration_method: 1,
-        is_subscribe: 0, // 是否订阅
-      };
-      this.$api.serviceShop
-        .addShoppingCart(query)
-        .then(({ data }) => {
-          if (data.success == 1) {
-            this.$message({
-              message: data.errMsg,
-              type: "success",
-            });
-            this.$store.commit("setMenuCartState");
-          } else {
-            this.$message({
-              message: data.errMsg,
-              type: "warning",
-            });
-          }
-        })
-        .catch((error) => {
-          this.$message({
-            message: `添加购物车失败`,
-            type: "warning",
-          });
-        });
-    },
   },
   mounted() {},
 };
 </script>
 
 <style scoped>
-.com_card {
-  width: 290px;
-  height: 266px;
-  padding: 20px;
-  border-radius: 16px;
-  background-color: #fff;
-  border: solid 2px transparent;
-  -webkit-box-shadow: 0px 3px 10px 0px rgba(3, 10, 37, 0.15);
-  box-shadow: 0px 3px 10px 0px rgba(3, 10, 37, 0.15);
-}
-.com_card:hover {
-  border: solid 2px #b4c0f5;
-}
-.com_card_top {
+.com_cell {
+  width: 496px;
+  height: 208px;
+  background-color: #ffffff;
+  box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.04);
+  border-radius: 12px 12px 8px 8px;
+  border: solid 1px #e3e4ef;
+  margin-bottom: 16px;
+}
+.com_cell_up {
+  height: 88px;
+  background-color: #f9fafc;
+  border-radius: 12px 12px 0px 0px;
+  padding: 16px;
   display: flex;
-  justify-content: space-between;
-  margin-bottom: 28px;
+  position: relative;
 }
-.com_card_name_v {
-  width: calc(100% - 80px);
+.com_cell_up_img_init {
+  width: 56px;
+  height: 56px;
+  margin-right: 16px;
+  flex: 0 0 auto;
 }
-.com_card_img {
-  width: 60px;
-  height: 60px;
-  border-radius: 8px;
-  border: 3px solid #f6f7fb;
+.com_cell_up_img {
+  width: 100%;
+  height: 100%;
+  border-radius: 4px;
 }
-.com_card_msg {
-  margin-top: 20px;
-  display: flex;
-  justify-content: space-between;
+.com_cell_up_right {
+  flex: 1 1 auto;
 }
-.com_card_msg_name {
-  font-size: 18px;
-  font-weight: 700;
+.up_title {
+  font-size: 16px;
   margin-top: 4px;
-  margin-bottom: 12px;
+  display: flex;
+  align-items: center;
+}
+.up_tit_name_in {
+  max-width: calc(100% - 150px);
+  display: inline-block;
+}
+.up_tit_name {
+  width: 100%;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 1;
   overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
+  cursor: pointer;
 }
-.com_card_msg_version {
-  font-size: 14px;
-  color: #8890a7;
+.up_tit_name:hover {
+  text-decoration: underline;
 }
-.com_card_msg_tit {
-  color: #8890a7;
-  font-size: 16px;
+.up_rate {
+  margin-top: 12px;
+  display: flex;
 }
-.com_card_msg_num {
-  color: #8890a7;
+.get_num {
+  margin-left: 40px;
   font-size: 14px;
-  position: relative;
-  top: 2px;
+  color: #58617a;
 }
-.com_card_msg_num1 {
+.com_cell_right_time {
+  color: #ea7d19;
+}
+.ci {
   color: #242c43;
-  font-size: 16px;
-  font-weight: bold;
 }
-.com_card_btn {
-  margin-top: 35px;
-  display: flex;
-  justify-content: space-between;
-}
-.btn_1 {
-  width: 110px;
-  padding: 10px;
-  background-color: #d0d5e7;
-  border: solid 2px #a5afd6;
-  color: #0f2683;
-}
-.btn_1:hover {
-  background-color: #d5daec;
-  border: solid 2px #a5afd6;
-  color: #0f2683;
-}
-.btn_2 {
-  width: 110px;
-  padding: 10px;
-  background-color: #0f2683;
-  color: #f8f9fd;
-}
-.btn_2:hover {
-  background-color: #1d3694;
-  color: #f8f9fd;
+.get_detail {
+  position: absolute;
+  top: 26px;
+  right: 16px;
+  cursor: pointer;
+}
+.tags {
+  display: inline-block;
+  margin-left: 8px;
+  padding: 2px 8px 3px;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 12px;
+  border-radius: 4px;
+  position: relative;
+  top: 1px;
+}
+.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;
+}
+.com_cell_down {
+  padding: 12px 16px 16px;
+}
+.com_detail {
+  color: #8890a7;
+  font-size: 14px;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  height: 50px;
+}
+.com_other {
+  color: #58617a;
+  margin-bottom: 6px;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 1;
+  overflow: hidden;
+}
+.name_title {
+  color: #8890a7;
 }
 </style>
\ No newline at end of file

src/components/service-list/commodity-cell.vue

 <template>
   <div class="com_cell">
-    <div class="com_cell_img_box">
-      <img :src="cellData.cover" class="com_cell_img" />
-    </div>
-    <div class="com_cell_message">
-      <div class="com_cell_msg_title">
-        {{ cellData.name }}
-        <span
-          v-if="cellData.data_service_type1 == 6"
-          class="tags map_service"
-        >mapService</span>
-        <span v-if="cellData.openness == 1" class="tags shared">共享</span>
-        <span v-else-if="cellData.openness ==  2" class="tags restricted">受限</span>
-        <span v-else class="tags sensitive">敏感</span>
+    <div class="com_cell_up">
+      <div class="com_cell_up_img_init">
+        <img :src="cellData.cover" class="com_cell_up_img" />
       </div>
-      <div class="message_block">
-        <div class="com_cell_item">
-          <div class="com_cell_data_detail">
-            <span class="detail_span">{{ cellData.descript }}</span>
+      <div class="com_cell_up_right">
+        <div class="up_title">
+          <div class="up_tit_name_in">
+            <span class="up_tit_name" :title="cellData.name" @click="goUrl(cellData.id)">
+              {{ cellData.name }}
+            </span>
           </div>
-        </div>
-        <div class="com_cell_item">
-          <span class="com_cell_item_title">服务类型：</span>
           <span
-            class="com_cell_data"
-          >{{ cellData.data_service_type1_name }}&nbsp;&nbsp;{{ cellData.data_service_type2_name }}&nbsp;&nbsp;{{ cellData.data_service_type3_name }}</span>
-          <span class="com_cell_item_title left_blank">数据领域：</span>
-          <span class="com_cell_data">{{ cellData.sectors_name }}</span>
+            v-if="cellData.data_service_type1 == 6"
+            class="tags map_service"
+          >
+            mapService
+          </span>
+          <span v-if="cellData.openness == 1" class="tags shared">共享</span>
+          <span v-else-if="cellData.openness == 2" class="tags restricted">
+            受限
+          </span>
+          <span v-else class="tags sensitive">敏感</span>
         </div>
-        <div class="com_cell_item">
-          <span class="com_cell_item_title">更新时间：</span>
-          <span class="com_cell_data">{{ helper.dateStringTransform(cellData.update_date) }}</span>
+        <div class="up_rate">
+          <el-rate
+            v-model="cellData.score"
+            disabled
+            show-score
+            text-color="#ea7d19"
+            score-template="{value}"
+          ></el-rate>
+          <p class="get_num">
+            本月获取：
+            <span class="com_cell_right_time">
+              {{ cellData.apply_num }}
+            </span>
+            <span class="ci"> 次</span>
+          </p>
         </div>
       </div>
-    </div>
-    <div class="com_cell_right">
-      <el-rate
-        v-model="cellData.score"
-        disabled
-        show-score
-        text-color="#58617a"
-        score-template="{value}"
-      ></el-rate>
-      <div class="com_cell_right_text">
-        <span class="com_cell_right_time_tit">本月获取次数：</span>
-        <span class="com_cell_right_time">{{ cellData.apply_num }}次</span>
+      <div class="get_detail" @click="goUrl(cellData.id)">
+        <img src="@/assets/imgs/shop_ic_enter.png" />
       </div>
-      <el-button class="com_cell_right_btn" @click="goUrl(cellData.id)">查看详情</el-button>
+    </div>
+    <div class="com_cell_down">
+      <p class="com_detail">
+        {{ cellData.descript }}
+      </p>
+      <el-row :gutter="16">
+        <el-col :span="14" class="com_other">
+          <span class="name_title">服务类型：</span>
+          {{ cellData.data_service_type1_name }}
+          &nbsp;&nbsp;{{ cellData.data_service_type2_name }} &nbsp;&nbsp;{{
+            cellData.data_service_type3_name
+          }}
+        </el-col>
+        <el-col :span="10" class="com_other">
+          <span class="name_title">服务领域：</span>
+          {{ cellData.sectors_name }}
+        </el-col>
+        <el-col :span="14" class="com_other">
+          <span class="name_title">更新时间：</span>
+          {{ helper.dateStringTransform(cellData.update_date) }}
+        </el-col>
+      </el-row>
     </div>
   </div>
 </template>
@@ -76,94 +94,88 @@ export default {
 
 <style scoped>
 .com_cell {
+  width: 496px;
+  height: 208px;
+  background-color: #ffffff;
+  box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.04);
+  border-radius: 12px 12px 8px 8px;
+  border: solid 1px #e3e4ef;
+  margin-bottom: 16px;
+}
+.com_cell_up {
+  height: 88px;
+  background-color: #f9fafc;
+  border-radius: 12px 12px 0px 0px;
+  padding: 16px;
   display: flex;
-  justify-content: space-between;
-  padding: 20px 10px;
-  border-bottom: 2px #f4f7fc solid;
-}
-.com_cell_img_box {
-  width: 200px;
-  height: 200px;
-  border-radius: 12px;
-  overflow: hidden;
-  border: 4px #f4f7fc solid;
+  position: relative;
+}
+.com_cell_up_img_init {
+  width: 56px;
+  height: 56px;
+  margin-right: 16px;
+  flex: 0 0 auto;
 }
-.com_cell_img {
+.com_cell_up_img {
   width: 100%;
   height: 100%;
+  border-radius: 4px;
 }
-.com_cell_message {
-  padding-left: 20px;
-  width: calc(100% - 500px);
-}
-.com_cell_msg_title {
-  color: #0d1847;
-  font-size: 18px;
-  line-height: 30px;
-  font-weight: 700;
-  margin-bottom: 10px;
+.com_cell_up_right {
+  flex: 1 1 auto;
 }
-.com_cell_item {
-  font-size: 14px;
-  line-height: 28px;
-  margin-top: 1px;
-  color: #8890a7;
+.up_title {
+  font-size: 16px;
+  margin-top: 4px;
   display: flex;
-  align-self: start;
+  align-items: center;
 }
-.com_cell_item_title {
-  /* width: 80px; */
-}
-.com_cell_data {
+.up_tit_name_in {
+  max-width: calc(100% - 150px);
   display: inline-block;
-  color: #242c43;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-.com_cell_data_detail {
-  color: #242c43;
-  height: 78px;
-  font-size: 16px;
 }
-.detail_span {
+.up_tit_name {
+  width: 100%;
   display: -webkit-box;
   -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
+  -webkit-line-clamp: 1;
   overflow: hidden;
+  cursor: pointer;
 }
-.com_cell_right {
-  width: 300px;
-  padding: 25px 0 0 50px;
+.up_tit_name:hover {
+  text-decoration: underline;
 }
-.com_cell_right_text {
-  font-size: 16px;
-  margin-top: 25px;
+.up_rate {
+  margin-top: 12px;
+  display: flex;
 }
-.com_cell_right_time_tit {
-  color: #8890a7;
+.get_num {
+  margin-left: 40px;
+  font-size: 14px;
+  color: #58617a;
 }
 .com_cell_right_time {
+  color: #ea7d19;
+}
+.ci {
   color: #242c43;
 }
-.com_cell_right_btn {
-  background-color: #0f2683;
-  color: #f8f9fd;
-  width: 220px;
-  height: 40px;
-  border-radius: 20px;
-  margin-top: 25px;
+.get_detail {
+  position: absolute;
+  top: 26px;
+  right: 16px;
+  cursor: pointer;
 }
 .tags {
   display: inline-block;
-  margin-left: 10px;
-  padding: 2px 10px 3px;
+  margin-left: 8px;
+  padding: 2px 8px 3px;
   font-size: 12px;
   font-weight: 500;
   line-height: 12px;
   border-radius: 4px;
   position: relative;
-  top: -1px;
+  top: 1px;
 }
 .map_service {
   background-color: #626de9;
@@ -185,24 +197,27 @@ export default {
   border: solid 1px #d7a4a9;
   color: #e15260;
 }
-.message_block {
-  width: 80%;
-  padding: 10px 20px;
-  background-color: #f8f9fd;
-  border-radius: 10px;
+.com_cell_down {
+  padding: 12px 16px 16px;
 }
-.left_blank {
-  margin-left: 20px;
+.com_detail {
+  color: #8890a7;
+  font-size: 14px;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  height: 50px;
 }
-</style>
-<style>
-.com_cell_right .el-rate__text {
-  display: inline-block;
-  margin-left: 10px;
-  font-size: 32px;
-  font-weight: 700;
+.com_other {
+  color: #58617a;
+  margin-bottom: 6px;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 1;
+  overflow: hidden;
 }
-.com_cell_right .el-rate__icon {
-  font-size: 28px;
+.name_title {
+  color: #8890a7;
 }
 </style>
\ No newline at end of file

src/components/service-list/commodity-list.vue

 <template>
   <div>
-    <div v-if="urlFilter=='app'" ref="commodityList" class="commodity_card">
-      <div ref="commodityCardIn" class="commodity_card_list">
-        <div
-          v-for="item in datas"
-          :cellData="item"
-          :url="url"
-          :key="item.id"
-          class="commodity_card_item"
-        >
-          <commodity-card class="commodity_card_item_in" :cellData="item" :url="url"></commodity-card>
-        </div>
-      </div>
+    <div v-if="urlFilter == 'app'" ref="commodityList" class="commodity_card">
+      <commodity-card
+        v-for="item in datas"
+        :key="item.id"
+        :cellData="item"
+        :url="url"
+      ></commodity-card>
     </div>
     <div v-else class="commodity_cell">
-      <commodity-cell v-for="item in datas" :cellData="item" :url="url" :key="item.id"></commodity-cell>
+      <commodity-cell
+        v-for="item in datas"
+        :cellData="item"
+        :url="url"
+        :key="item.id"
+      ></commodity-cell>
     </div>
     <!-- 分页 -->
     <section class="com-pagination" v-if="paginationShow">
@@ -46,18 +46,17 @@
             @click="handleCurrentChange(-1)"
             :disabled="pagination.page == 1"
           ></el-button>
-          &nbsp;&nbsp;第{{ pagination.page }}页 / 共{{
-          Math.ceil((total == 0 ? 1 : total) / pagination.rowsPerPage)
-          }}页
+          &nbsp;&nbsp;第{{ pagination.page }}页 / 共
+          {{ Math.ceil((total == 0 ? 1 : total) / pagination.rowsPerPage) }}页
           <el-button
             icon="el-icon-arrow-right"
             circle
             size="mini"
             @click="handleCurrentChange(1)"
             :disabled="
-            pagination.page >=
+              pagination.page >=
               Math.ceil((total == 0 ? 1 : total) / pagination.rowsPerPage)
-          "
+            "
           ></el-button>
         </div>
       </div>
@@ -128,30 +127,11 @@ export default {
     refreshData() {
       this.$emit("refresh", this.pagination);
     },
-    pageResize() {
-      let listWidth = this.$refs.commodityCardIn.clientWidth;
-      let rowCardNum = Math.floor(listWidth / 310);
-      let cardArr = this.$refs.commodityCardIn.children;
-      // console.log(rowCardNum, listWidth / rowCardNum);
-      for (let i = 0; i < cardArr.length; i++) {
-        cardArr[i].style.width = listWidth / rowCardNum - 1 + "px";
-      }
-      // console.log(this.$refs.commodityCardIn);
-    },
   },
   mounted() {},
   watch: {
     datas: {
-      handler(val) {
-        if (this.urlFilter == "app") {
-          setTimeout(() => {
-            this.pageResize();
-            window.onresize = () => {
-              this.pageResize();
-            };
-          }, 0);
-        }
-      },
+      handler(val) {},
     },
     url: {
       handler() {
@@ -194,6 +174,9 @@ export default {
   align-items: center;
 }
 .commodity_card {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
 }
 .commodity_card_list {
   width: 100%;
@@ -206,6 +189,11 @@ export default {
 .commodity_card_item_in {
   margin: 0 auto;
 }
+.commodity_cell {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
 </style>
 <style>
 .com_page_control .el-button {

src/components/service-list/service_list.vue

@@ -10,9 +10,7 @@
     <div class="head_flex">
       <el-breadcrumb separator="/" class="bread_crumb1 bread_left">
         <el-breadcrumb-item :to="{ path: '/shop' }">
-          {{
-          $t("lang.service_shop")
-          }}
+          {{ $t("lang.service_shop") }}
         </el-breadcrumb-item>
         <el-breadcrumb-item>{{ name }}</el-breadcrumb-item>
       </el-breadcrumb>
@@ -25,22 +23,27 @@
         ></el-input>
       </div>
     </div>
-    <block-radius>
+    <block-radius :borRadius="12">
       <!-- filter -->
       <div v-if="urlFilter" class="classification">
-        <div v-for="(item, index) in filterLists" :key="'cd' + index" class="classification_line">
+        <div
+          v-for="(item, index) in filterLists"
+          :key="'cd' + index"
+          class="classification_line"
+        >
           <div
             class="classification_line_if"
             v-if="item.childDomains && item.childDomains.length != 0"
           >
             <div class="classification_line_title">{{ item.name }}：</div>
-            <div
+            <!-- <div
               :class="
                 index == filterLists.length - 1
                   ? 'classification_line_items'
                   : 'classification_line_items classification_line_items_border'
               "
-            >
+            > -->
+            <div class="classification_line_items">
               <div
                 :class="
                   openList[index] == 'up'
@@ -58,7 +61,8 @@
                             ? 'classification_act'
                             : ''
                         "
-                      >全部</span>
+                        >全部</span
+                      >
                     </div>
                   </li>
                   <li
@@ -80,13 +84,14 @@
                             ? 'classification_act'
                             : ''
                         "
-                      >{{ items.name }}</span>
+                        >{{ items.name }}</span
+                      >
                       <!-- if item have children, we will use an arrow to prompt -->
                       <i
                         v-if="
                           items.childDomains &&
-                            openChildren[index].state == true &&
-                            openChildren[index].index == items.id
+                          openChildren[index].state == true &&
+                          openChildren[index].index == items.id
                         "
                         @click="clickItemChild(index, indexs, items)"
                         class="el-icon-caret-top"
@@ -94,8 +99,8 @@
                       <i
                         v-else-if="
                           items.childDomains &&
-                            openChildren[index].state == false &&
-                            openChildren[index].index == items.id
+                          openChildren[index].state == false &&
+                          openChildren[index].index == items.id
                         "
                         @click="clickItemChild(index, indexs, items)"
                         class="el-icon-caret-bottom"
@@ -116,8 +121,14 @@
                 >
                   <span v-if="openList[index] == 'down'">收起</span>
                   <span v-if="openList[index] == 'up'">展开</span>
-                  <i v-if="openList[index] == 'down'" class="el-icon-caret-top"></i>
-                  <i v-if="openList[index] == 'up'" class="el-icon-caret-bottom"></i>
+                  <i
+                    v-if="openList[index] == 'down'"
+                    class="el-icon-caret-top"
+                  ></i>
+                  <i
+                    v-if="openList[index] == 'up'"
+                    class="el-icon-caret-bottom"
+                  ></i>
                 </div>
               </div>
               <!-- filter children -->
@@ -145,7 +156,8 @@
                             ? 'classification_act'
                             : ''
                         "
-                      >{{ itemChildren.name }}</span>
+                        >{{ itemChildren.name }}</span
+                      >
                     </div>
                   </li>
                 </ul>
@@ -154,38 +166,46 @@
           </div>
         </div>
       </div>
+    </block-radius>
+    <!-- filter button -->
+    <div class="btn_group">
       <div
+        v-for="(item, index) in buttonFilter"
+        :key="item.name"
+        size="small"
+        :class="
+          index == activeBtn
+            ? 'button_filter button_filter_act'
+            : 'button_filter'
+        "
+        @click="clickButtonFilter(index)"
+      >
+        {{ item.name }}
+      </div>
+      <!-- <div v-if="urlFilter == 'app'" class="btn_right_check">
+        <el-checkbox v-model="couldTwice" @change="changeTwice">
+          支持二次开发
+        </el-checkbox>
+      </div> -->
+    </div>
+    <!-- <div
         class="gray_line"
         v-if="
           filterLists[0].childDomains.length != 0 ||
-            filterLists[1].childDomains.length != 0 ||
-            filterLists[2].childDomains.length != 0
+          filterLists[1].childDomains.length != 0 ||
+          filterLists[2].childDomains.length != 0
         "
-      ></div>
-      <!-- filter button -->
-      <div class="btn_group">
-        <el-button
-          v-for="(item, index) in buttonFilter"
-          :key="item.name"
-          size="small"
-          :class="index == activeBtn ? 'button_filter_act' : 'button_filter'"
-          @click="clickButtonFilter(index)"
-        >{{ item.name }}</el-button>
-        <div v-if="urlFilter == 'app'" class="btn_right_check">
-          <el-checkbox v-model="couldTwice" @change="changeTwice">支持二次开发</el-checkbox>
-        </div>
-      </div>
-      <!-- the list -->
-      <commodity-list
-        :datas="lists && lists.length != 0 ? lists : []"
-        :total="total"
-        :url="url"
-        :urlFilter="urlFilter"
-        :paginationShow="true"
-        :pageSizeShow="true"
-        @refresh="getNewList"
-      ></commodity-list>
-    </block-radius>
+      ></div> -->
+    <!-- the list -->
+    <commodity-list
+      :datas="lists && lists.length != 0 ? lists : []"
+      :total="total"
+      :url="url"
+      :urlFilter="urlFilter"
+      :paginationShow="false"
+      :pageSizeShow="true"
+      @refresh="getNewList"
+    ></commodity-list>
   </div>
 </template>
 
@@ -266,19 +286,22 @@ export default {
       },
     ],
     page: 1,
-    limit: 10,
+    limit: 20,
     couldTwice: false,
     refresh_app_1: false,
     refresh_app_2: false,
     refresh_app_3: false,
     time_app: null,
     times: null,
+    isKaiGuan: true,
   }),
   mounted() {
     window.addEventListener("resize", this.judgeHeight);
+    window.addEventListener("scroll", this.menu, true);
   },
   destroyed() {
     window.removeEventListener("resize", this.judgeHeight);
+    window.removeEventListener("scroll", this.menu, true);
   },
   watch: {
     urlFilter: {
@@ -333,7 +356,41 @@ export default {
     },
   },
   methods: {
+    menu() {
+      if (this.isKaiGuan) {
+        let scroll =
+          this.getScrollTop() + this.getWindowHeight() - this.getScrollHeight();
+        if (scroll > -10) {
+          if (
+            (this.total != 0 && this.page * this.limit < this.total) ||
+            this.total == 0
+          ) {
+            this.page++;
+            this.getShopList();
+          }
+        }
+      }
+    },
+    //滚动条在Y轴上的滚动距离
+    getScrollTop() {
+      var documentScrollTop = 0;
+      documentScrollTop = document.documentElement.scrollTop;
+      return documentScrollTop;
+    },
+    //文档的总高度
+    getScrollHeight() {
+      var documentScrollHeight = 0;
+      documentScrollHeight = document.documentElement.scrollHeight;
+      return documentScrollHeight;
+    },
+    //浏览器视口的高度
+    getWindowHeight() {
+      var windowHeight = 0;
+      windowHeight = document.documentElement.clientHeight;
+      return windowHeight;
+    },
     getShopList() {
+      this.isKaiGuan = false;
       if (this.urlFilter == "app") {
         let query = {
           online_state: this.activeOptions[0].join(","),
@@ -355,8 +412,12 @@ export default {
         };
         this.$api.serviceShop.getAppList(query).then((response) => {
           if (response.data.success == "1") {
-            this.lists = response.data.data;
+            this.lists =
+              this.page == 1
+                ? response.data.data
+                : this.lists.concat(response.data.data);
             this.total = response.data.total;
+            this.isKaiGuan = true;
           } else {
             console.log(response.data.errMsg);
           }
@@ -375,8 +436,12 @@ export default {
         };
         this.$api.serviceShop.getServiceShopList(query).then((response) => {
           if (response.data.success == "1") {
-            this.lists = response.data.data;
+            this.lists =
+              this.page == 1
+                ? response.data.data
+                : this.lists.concat(response.data.data);
             this.total = response.data.total;
+            this.isKaiGuan = true;
           } else {
             console.log(response.data.errMsg);
           }
@@ -492,6 +557,7 @@ export default {
     },
     clickButtonFilter(index) {
       this.activeBtn = index;
+      this.page = 1;
       this.getShopList();
     },
     clickChildren(id, index, fatherId) {
@@ -508,23 +574,27 @@ export default {
       this.getFilterValue();
     },
     getFilterValue() {
+      this.page = 1;
       this.getShopList();
     },
     // search debonce 500ms
     searchVal() {
       if (this.times !== null) clearTimeout(this.times);
       this.times = setTimeout(() => {
+        this.page = 1;
         this.getShopList();
       }, 500);
     },
     getNewList(val) {
-      this.page = val.page;
-      this.limit = val.rowsPerPage;
+      console.log(val);
+      this.page = 1;
+      this.limit = 20;
       this.getShopList();
     },
     clickAll(item) {
       this.$set(this.activeOptions, item, []);
       this.$set(this.activeChildOptions, item, []);
+      this.page = 1;
       this.getShopList();
     },
     changeTwice() {
@@ -567,12 +637,18 @@ export default {
 .head_flex {
   display: flex;
   justify-content: space-between;
+  position: relative;
+  height: 40px;
+  top: -14px;
 }
 .bread_left {
   width: 300px;
 }
 .input_right {
   width: 360px;
+  position: relative;
+  height: 36px;
+  top: 6px;
 }
 .gray_line {
   width: 100%;
@@ -634,8 +710,20 @@ export default {
   cursor: pointer;
 }
 .classification_act {
-  font-weight: 700;
-  color: #515fe7;
+  color: #fff;
+  position: relative;
+  z-index: 1;
+}
+.classification_act::after {
+  content: "";
+  position: absolute;
+  width: calc(100% + 16px);
+  height: calc(100% + 8px);
+  background-color: #3f4f9c;
+  border-radius: 3px;
+  top: -4px;
+  left: -8px;
+  z-index: -1;
 }
 .classification_line_items_open {
   display: inline-block;
@@ -655,31 +743,31 @@ export default {
   color: #58617a;
 }
 .button_filter {
-  background-color: #e6eefe;
-  color: #626de9;
-  border: 1px solid #e6eefe;
+  color: #8890a7;
   font-size: 12px;
+  display: inline-block;
+  margin-right: 31px;
+  position: relative;
 }
-.button_filter:hover {
-  border: 1px solid rgb(198, 226, 255);
+.button_filter::after {
+  content: "";
+  width: 1px;
+  height: 16px;
+  background-color: #e3e5ef;
+  position: absolute;
+  right: -15px;
 }
-.button_filter:focus {
-  border: 1px solid rgb(58, 142, 230);
+.button_filter:nth-child(4):after {
+  content: "";
+  width: 0;
 }
 .button_filter_act {
-  background-color: #515fe7;
-  border: 1px solid #515fe7;
-  color: #f8f9fd;
-  font-size: 12px;
-}
-.button_filter_act:hover {
-  border: 1px solid #414fd7;
-}
-.button_filter_act:focus {
-  border: 1px solid #313fc7;
+  color: #515fe7;
 }
 .btn_group {
+  margin-top: 15px;
   margin-bottom: 15px;
+  margin-left: 15px;
   position: relative;
 }
 .btn_right_check {
@@ -690,7 +778,8 @@ export default {
 </style>
 <style>
 .head_flex .input_right .el-input__inner {
-  border-radius: 20px;
+  border-radius: 6px;
+  border: solid 1px #e7eaf6;
 }
 .head_flex .input_right .el-input--prefix .el-input__inner {
   padding-left: 40px;

src/components/service-list/service_shop_menu.vue

@@ -65,32 +65,32 @@ export default {
             }
             switch (uri) {
               case "data_service_list":
-                item.active = "tool_ic_shujufw_sel";
-                item.default = "tool_ic_shujufw";
+                item.active = "shop_tool_ic_sjfw_sel";
+                item.default = "shop_tool_ic_sjfw";
                 break;
               case "space_time_service_list":
-                item.active = "tool_ic_shikongfw_sel";
-                item.default = "tool_ic_shikongfw";
+                item.active = "shop_tool_ic_skfw_sel";
+                item.default = "shop_tool_ic_skfw";
                 break;
               case "video_service_list":
-                item.active = "tool_ic_shipinfw_sel";
-                item.default = "tool_ic_shipinfw";
+                item.active = "shop_tool_ic_spfw_sel";
+                item.default = "shop_tool_ic_spfw";
                 break;
               case "perception_service_list":
-                item.active = "tool_ic_ganzhifw_sel";
-                item.default = "tool_ic_ganzhifw";
+                item.active = "shop_tool_ic_ganzhifw_sel";
+                item.default = "shop_tool_ic_ganzhifw";
                 break;
               case "comprehensive_app_list":
-                item.active = "tool_ic_zongheyyfw_sel";
-                item.default = "tool_ic_zongheyyfw";
+                item.active = "shop_tool_ic_zhyyfw_sel";
+                item.default = "shop_tool_ic_zhyyfw";
                 break;
               case "cloud":
-                item.active = "tool_ic_yunziyuanfw_sel";
-                item.default = "tool_ic_yunziyuanfw";
+                item.active = "shop_tool_ic_yzyfw_sel";
+                item.default = "shop_tool_ic_yzyfw";
                 break;
               case "app_store_list":
-                item.active = "tool_ic_yingyongsd_sel";
-                item.default = "tool_ic_yingyongsd";
+                item.active = "shop_ic_yysd_sel";
+                item.default = "shop_ic_yysd";
                 break;
               default:
                 item.active = "1";
@@ -111,24 +111,25 @@ export default {
 .service_shop_menu {
   background-color: #0d1847;
   position: fixed;
-  top: 58px;
-  left: 0;
-  width: 180px;
-  height: 100%;
-  padding-top: 30px;
+  top: 76px;
+  left: calc(50% - 600px);
+  width: 176px;
+  padding: 8px;
+	background-color: #ffffff;
+	box-shadow: 0px 3px 6px 0px 
+		rgba(15, 19, 65, 0.04);
+	border-radius: 8px;
 }
 .service_shop_menu_list > li {
   padding: 16px 10px 8px 22px;
-  border-left: 5px solid #0d1847;
   font-size: 15px;
   line-height: 24px;
   cursor: pointer;
 }
 .service_shop_menu_list > li:hover,
 .service_shop_menu_list > li.current {
-  border-left: 5px solid #e56600;
-  background-color: #182665;
-  color: #e6ebfe;
+  background-color: rgba(242, 246, 253, 0.4);
+  color: #515fe7;
 }
 .menu_img {
   width: 25px;
@@ -136,12 +137,16 @@ export default {
 }
 .menu_item {
   position: relative;
-  color: #6573ae;
+  font-weight: bold;
+  font-size: 15px;
+  color: #96a0c5;
   top: -6px;
 }
 .menu_item_active {
   position: relative;
-  color: #e6ebfe;
+  font-weight: bold;
+  font-size: 15px;
+  color: #515fe7;
   top: -6px;
 }
 </style>

src/components/service-list/service_shop_menu_copy.vue

-<template>
-  <div class="service_shop_menu">
-    <ul class="service_shop_menu_list">
-      <li v-for="(item, index) in menuList" :key="index" @click="active(item.visit_url)">
-        <img
-          v-if="item.visit_url == actives"
-          :src="item.active != '' ? require('@/assets/imgs/' + item.active + '.png') : ''"
-          class="menu_img"
-        />
-        <img v-else :src="require('@/assets/imgs/' + item.default + '.png')" class="menu_img" />
-        <span
-          :class="item.visit_url == actives ? 'menu_item_active':'menu_item'"
-        >{{ item.menu_name }}</span>
-      </li>
-    </ul>
-  </div>
-</template>
-
-<script>
-export default {
-  props: {},
-  data() {
-    return {
-      actives: "",
-      menuList: [],
-    };
-  },
-  computed: {
-    getActive() {
-      return this.$store.state.serviceShopMenu;
-    },
-  },
-  watch: {
-    getActive(newVal) {
-      this.getActiveMenu(newVal);
-    },
-  },
-  mounted() {
-    this.getShopMenu();
-    this.$store.commit("serviceShopMenuAct", this.$route.path);
-    this.actives = this.$store.state.serviceShopMenu;
-  },
-  methods: {
-    active(val) {
-      this.$store.commit("serviceShopMenuAct", val);
-      this.$router.push(val);
-    },
-    getActiveMenu(val) {
-      this.actives = val;
-    },
-    getShopMenu() {
-      this.$api.general.getNowMenu({ teamName: "APAAS3" }).then((response) => {
-        if (response.data.success == 1) {
-          let arr = response.data.data[0].Child;
-          let shopArr = [];
-          let asd = arr.find(item => {
-            return item.visit_url == "/services_shop"
-          })
-          shopArr = asd.Child;
-          if (shopArr && shopArr.length != 0) {
-            Array.from(shopArr).forEach((item) => {
-            let uri = item.visit_url.substring(6);
-            if (uri.indexOf("/") != -1) {
-              uri = uri.substring(0, uri.indexOf("/"));
-            }
-            switch (uri) {
-              case "data_service_list":
-                item.active = "shop_tool_ic_sjfw_sel";
-                item.default = "shop_tool_ic_sjfw";
-                break;
-              case "space_time_service_list":
-                item.active = "shop_tool_ic_skfw_sel";
-                item.default = "shop_tool_ic_skfw";
-                break;
-              case "video_service_list":
-                item.active = "shop_tool_ic_spfw_sel";
-                item.default = "shop_tool_ic_spfw";
-                break;
-              case "perception_service_list":
-                item.active = "shop_tool_ic_ganzhifw_sel";
-                item.default = "shop_tool_ic_ganzhifw";
-                break;
-              case "comprehensive_app_list":
-                item.active = "shop_tool_ic_zhyyfw_sel";
-                item.default = "shop_tool_ic_zhyyfw";
-                break;
-              case "cloud":
-                item.active = "shop_tool_ic_yzyfw_sel";
-                item.default = "shop_tool_ic_yzyfw";
-                break;
-              case "app_store_list":
-                item.active = "shop_ic_yysd_sel";
-                item.default = "shop_ic_yysd";
-                break;
-              default:
-                item.active = "1";
-                item.default = "1";
-                break;
-            }
-          });
-          }
-          this.menuList = shopArr;
-        }
-      });
-    },
-  },
-};
-</script>
-
-<style scoped>
-.service_shop_menu {
-  background-color: #0d1847;
-  position: fixed;
-  top: 76px;
-  left: calc(50% - 600px);
-  width: 180px;
-  padding: 8px;
-	background-color: #ffffff;
-	box-shadow: 0px 3px 6px 0px 
-		rgba(15, 19, 65, 0.04);
-	border-radius: 8px;
-}
-.service_shop_menu_list > li {
-  padding: 16px 10px 8px 22px;
-  font-size: 15px;
-  line-height: 24px;
-  cursor: pointer;
-}
-.service_shop_menu_list > li:hover,
-.service_shop_menu_list > li.current {
-  background-color: rgba(242, 246, 253, 0.4);
-  color: #515fe7;
-}
-.menu_img {
-  width: 25px;
-  margin-right: 6px;
-}
-.menu_item {
-  position: relative;
-  font-weight: bold;
-  font-size: 15px;
-  color: #96a0c5;
-  top: -6px;
-}
-.menu_item_active {
-  position: relative;
-  font-weight: bold;
-  font-size: 15px;
-  color: #515fe7;
-  top: -6px;
-}
-</style>

src/components/shop-cloud/shop-cloud.vue

@@ -918,7 +918,9 @@
                 <div class="dia_block_item_in">
                   <span class="dia_block_item_title">内存：</span>
                   <p class="dia_block_item_val">
-                    <span class="val_has_2">om=[] </span>
+                    <span class="val_has_2">
+                      最高&nbsp;{{ diaForm.perRAMs }}GB
+                      </span>
                     <span class="val_has_2">
                       默认&nbsp;{{ diaForm.perRAM }}GB
                     </span>
@@ -1322,11 +1324,7 @@ export default {
         { value: "8", label: "8" },
         { value: "16", label: "16" },
       ],
-      optionsRAM: [
-        { value: "8", label: "8" },
-        { value: "16", label: "16" },
-        { value: "32", label: "32" },
-      ],
+      optionsRAM: [],
       options_store_type: [
         { value: "nfs-client", label: "nfs-client" },
         { value: "rook-ceph-block", label: "rook-ceph-block" },

src/pages/service_shop/shop_list.vue

 <template>
-  <!-- <div class="shop_list_cont"> -->
-  <div>
+  <div class="shop_list_cont">
     <el-container>
-      <el-aside width="180px">
+      <el-aside width="176px">
         <service-shop-menu></service-shop-menu>
       </el-aside>
-      <el-main>
+      <el-main class="main_init">
         <service-list
           :filterNames="filterNames"
           :name="name"
@@ -129,4 +128,7 @@ export default {
   margin: 0 auto;
   position: relative;
 }
+.main_init {
+  padding: 16px 0 16px 16px;
+}
 </style>
\ No newline at end of file

src/pages/workbench/component-center/process-management/designer/index.vue

@@ -176,7 +176,7 @@ export default {
         {
           label: "流程编号",
           prop: "workflows_code",
-          width: 180,
+          width: 130,
         },
         {
           label: "流程名称",
@@ -188,7 +188,7 @@ export default {
           label: "服务领域",
           prop: "sector_name",
           align: "center",
-          width: 240,
+          width: 200,
         },
         {
           label: "创建时间",
@@ -206,7 +206,7 @@ export default {
             return ["未部署", "已部署", "已发布"][item.state || 0];
           },
           align: "center",
-          width: 180,
+          width: 80,
         },
         {
           label: "工作区域",

src/pages/workbench/fwzc_fwcs.vue

@@ -1058,6 +1058,7 @@ export default {
       this.jkwds = [];
     },
     getUrl(enUrl) {
+      enUrl = enUrl.replace(/\s*/g,"");
       let url = decodeURI(enUrl);
       let arr = [];
       if (url.indexOf("?") != -1) {
@@ -1343,13 +1344,22 @@ export default {
                 data_service_type1: 6,
                 data_service_type2: this.skfwQqt,
                 encode_method: this.form.code,
-                method: "GET",
-                url: this.serviceUrl,
-                request_fields: [],
-                request_query_fields: [],
-                response_fields: [],
-                content_type: "json",
                 portal_id: this.portal_id,
+                doc_file: "",
+                urls: [
+                  {
+                    name: "",
+                    response_type: "JSON",
+                    req_auth_mthod: 0,
+                    req_auth_token: "",
+                    method: "GET",
+                    url: this.serviceUrl,
+                    request_fields: [],
+                    request_query_fields: [],
+                    response_fields: [],
+                    content_type: "JSON",
+                  },
+                ],
               };
             } else if (this.is_map == 4) {
               query = {
@@ -1362,13 +1372,21 @@ export default {
                 data_service_type1: 21,
                 data_service_type2: 34,
                 encode_method: this.form.code,
-                method: "GET",
-                url: this.serviceUrl,
-                request_fields: [],
-                request_query_fields: [],
-                response_fields: [],
-                content_type: "json",
                 portal_id: this.portal_id,
+                urls: [
+                  {
+                    name: "",
+                    response_type: "JSON",
+                    req_auth_mthod: 0,
+                    req_auth_token: "",
+                    method: "GET",
+                    url: this.serviceUrl,
+                    request_fields: [],
+                    request_query_fields: [],
+                    response_fields: [],
+                    content_type: "JSON",
+                  },
+                ],
               };
             }
             this.$api.workbench.serviceAdd(query).then((response) => {
@@ -1429,7 +1447,10 @@ export default {
     registePt() {
       this.$refs.form.validate((valid) => {
         if (valid) {
-          if ((this.activeBtn == 2 && this.jkwds.length == 0) || (this.activeBtn == 3 && this.jkwds.length == 0)) {
+          if (
+            (this.activeBtn == 2 && this.jkwds.length == 0) ||
+            (this.activeBtn == 3 && this.jkwds.length == 0)
+          ) {
             this.$message.error("请上传接口文档");
           } else {
             if (this.cover.length != 0) {
@@ -1437,7 +1458,11 @@ export default {
               if (this.activeBtn == 1 && !this.is_portal) {
                 this.addPortalItem();
               } else {
-                if (this.activeBtn == 0 || this.activeBtn == 2 || this.activeBtn == 3) {
+                if (
+                  this.activeBtn == 0 ||
+                  this.activeBtn == 2 ||
+                  this.activeBtn == 3
+                ) {
                   contentType = this.sjfwQqt;
                 } else if (this.activeBtn == 4) {
                   if (this.activeZh == "1") {
@@ -1840,6 +1865,7 @@ export default {
       });
     },
     getUrlOne(enUrl, indexOne) {
+      enUrl = enUrl.replace(/\s*/g,"");
       let url = decodeURI(enUrl);
       let arr = [];
       if (url.indexOf("?") != -1) {

src/router/index.js

@@ -11,6 +11,9 @@ Router.prototype.push = function push(location, onResolve, onReject) {
 };
 
 export default new Router({
+  scrollBehavior (to, from, savedPosition) {
+    return { x: 0, y: 0 }
+  },
   routes: [
     {
       path: "/",