[银保app]保全.保单,续期三个列表样式适配修改

src/views/YB_APP/policyList.vue

@@ -16,7 +16,7 @@
       </label> -->
     <!-- </div> -->
     <!-- 无内容显示的背景 -->
-    <div v-if="filpolicyListDTOList == ''">
+    <div v-if="filpolicyListDTOList == ''" style="position:relative;">
       <img class="noContentImg" src="../../assets/YB_APP/images/noguarantee.png" />
       <p class="noContentText">暂无保单</p>
     </div>
@@ -374,13 +374,13 @@ export default {
   height: 216px;
   // width: 285px;
   position: absolute;
-  top: 120px;
+  top: 60px;
   left: calc(50% - 142px);
 }
 .noContentText {
   font-size: 12px;
   position: absolute;
-  top: 279px;
+  top: 219px;
   left: calc(50% - 24px);
   color: #b3b5ca;
 }
@@ -408,10 +408,12 @@ export default {
   // width: 32%;
   background-color: white;
   overflow: hidden;
+  // position:relative;
 }
 .rightStateImg {
   height: 100px;
   width: 100px;
+  margin-bottom: 58px;
 }
 .rightStateButton {
   height: 30px;
@@ -420,9 +422,11 @@ export default {
   border: #d7523b 1px solid;
   border-radius: 30px;
   background-color: white;
-  margin-top: 62px;
+  // margin-top: 58px;
   margin-left: 10px;
   font-size: 12px;
+  bottom: 10px;
+  // position: absolute;
 }
 .cardListText {
   line-height: 34px;

src/views/YB_APP/renewalList.vue

@@ -31,7 +31,7 @@
         <p class="beMonthRight" @click="clickCalendar"><span class="beMonthRightSpan">{{calendarValue}}</span>▼</p>
       </div>
       <!-- 无内容显示的背景 -->
-      <div v-if="policyListDTOList == ''">
+      <div v-if="policyListDTOList == ''" style="position:relative">
         <img class="noContentImg" src="../../assets/YB_APP/images/noguarantee.png" />
         <p class="noContentText">暂无保单</p>
       </div>
@@ -263,6 +263,8 @@ export default {
   padding: 2px 5px;
   margin-top: 12px;
   line-height: 24px;
+  white-space:nowrap; 
+  
 }
 .beMonthRightSpan {
   margin-right: 5px;
@@ -271,13 +273,13 @@ export default {
   height: 216px;
   // width: 285px;
   position: absolute;
-  top: 156px;
+  top: 66px;
   left: calc(50% - 142px);
 }
 .noContentText {
   font-size: 12px;
   position: absolute;
-  top: 315px;
+  top: 225px;
   left: calc(50% - 24px);
   color: #b3b5ca;
 }
@@ -308,9 +310,10 @@ export default {
   /*position: absolute;*/
 }
 .rightState {
-  height: 100%;
+  // height: 100%;
-  width: 32%;
+  // width: 32%;
-  background-color: white;
+  // background-color: white;
+  display: flex;
 }
 .rightStateImg {
   height: 100px;
@@ -323,10 +326,12 @@ export default {
   border: #d7523b 1px solid;
   border-radius: 30px;
   background-color: white;
-  margin-top: 157px;
+  margin-bottom: 14px;
   // margin-top: 113px;
   margin-left: 4px;
   font-size: 12px;
+  align-self:flex-end;
+
 }
 .rightStateButton2 {
   height: 30px;
@@ -336,9 +341,11 @@ export default {
   border-radius: 30px;
   background-color: white;
   // margin-top: 57px;
-  margin-top: 213px;
+  margin-bottom:14px;
   margin-left: 4px;
   font-size: 12px;
+  align-self:flex-end;
+
 }
 .cardListText {
   line-height: 34px;

src/views/YB_APP/saveallList.vue

@@ -25,7 +25,7 @@
             </p>
           </div>
           <!-- 无内容显示的背景 -->
-          <div v-if="policyListDTOList == ''">
+          <div v-if="policyListDTOList == ''" style="position: relative;">
             <img class="noContentImg" src="../../assets/YB_APP/images/noguarantee.png" />
             <p class="noContentText">暂无保单</p>
           </div>
@@ -52,10 +52,10 @@
                       <span>网点名称</span><span>{{ item.networkName }}</span>
                     </p>
                     <p>
-                      <span>转账帐号</span><span>{{ item.edorAcceptNo }}</span>
+                      <span>申请日期</span><span>{{ item.edorAppDate }}</span>
                     </p>
                     <p>
-                      <span>申请日期</span><span>{{ item.edorAppDate }}</span>
+                      <span>保全状态</span><span>{{ item.edorState}}</span>
                     </p>
                   </div>
                   <div class="rightState">
@@ -74,7 +74,7 @@
             </p>
           </div>
           <!-- 无内容显示的背景 -->
-          <div v-if="policyListDTOListTwo == ''">
+          <div v-if="policyListDTOListTwo == ''" style="position:relative;">
             <img class="noContentImg" src="../../assets/YB_APP/images/noguarantee.png" />
             <p class="noContentText">暂无保单</p>
           </div>
@@ -131,7 +131,7 @@ export default {
   data() {
     return {
       findValue: '', // 上面搜索框的value
-      active: '', // 四个选项卡的v-model
+      active: '', // 两个选项卡的v-model
       policyListDTOList: [], // 保全申请进度卡片列表内容
       policyListDTOListTwo: [], // 现金价值卡片列表内容
       params: {
@@ -142,6 +142,8 @@ export default {
   created() {},
   mounted() {
     this.getSaveAllList()
+    this.ybSaveManyList()
+    console.log(this.active,'我是active');
   },
   methods: {
     getSaveAllList() {
@@ -157,8 +159,12 @@ export default {
           that.policyListDTOList = ''
         }
       })
-      // 现金价值
+    },
-      ybSaveManyList(that.params).then((res) => {
+    ybSaveManyList() {
+      let that = this
+      console.log('我是log123')
+          // 现金价值
+        ybSaveManyList(that.params).then((res) => {
         console.log(res, '我是res')
         if (res.result == 0) {
           that.policyListDTOListTwo = res.content
@@ -167,7 +173,7 @@ export default {
           that.policyListDTOListTwo = ''
         }
       })
-    },
+      },
     // 上方关键词搜索按钮
     keywordSearch(value) {
       console.log('点击搜索了')
@@ -200,6 +206,22 @@ export default {
         }
       })
     }
+  },
+  watch: {
+    active: {
+      deep: true,
+      handler(newvalue) {
+        if(this.newvalue == 0){
+          console.log(this.newvalue);
+        this.getSaveAllList()
+        console.log();
+        }else if(newvalue == 1){
+        this.ybSaveManyList()
+        }else{
+          this.params.state = ''
+        }
+      }
+    }
   }
 }
 </script>
@@ -234,13 +256,13 @@ export default {
   height: 216px;
   // width: 285px;
   position: absolute;
-  top: 124px;
+  top: 44px;
   left: calc(50% - 142px);
 }
 .noContentText {
   font-size: 12px;
   position: absolute;
-  top: 283px;
+  top: 203px;
   left: calc(50% - 24px);
   color: #b3b5ca;
 }
@@ -269,11 +291,12 @@ export default {
   margin: 0 7px;
   /*position: absolute;*/
 }
-// .rightState {
+.rightState {
+  display: flex;
   // height: 100%;
   // width: 32%;
 //   background-color: rgb(236, 9, 9);
-// }
+}
 .rightStateImg {
   height: 100px;
   width: 100px;
@@ -285,9 +308,10 @@ export default {
   border: #d7523b 1px solid;
   border-radius: 30px;
   background-color: white;
-  margin-top: 124px;
+  margin-bottom: 14px;
   margin-left: 4px;
   font-size: 12px;
+  align-self:flex-end;
 }
 .rightStateButton2 {
   height: 30px;
@@ -296,9 +320,10 @@ export default {
   border: #d7523b 1px solid;
   border-radius: 30px;
   background-color: white;
-  margin-top: 46px;
+  margin-bottom: 14px;
   margin-left: 4px;
   font-size: 12px;
+  align-self:flex-end;
 }
 .cardListText {
   line-height: 34px;
@@ -324,8 +349,8 @@ export default {
 .textList > p {
   display: flex;
   margin-bottom: 11px;
-  line-height: 12px;
+  line-height: 20px
-}
+  }
 .textList > p > span:nth-of-type(1) {
   display: block;
   // float:left;