linwenxin před 6 dny
rodič
revize
7ffeaa2247

+ 137 - 96
src/components/zj-container/zj-page-layout.vue

@@ -1,6 +1,9 @@
 <template>
-  <view class="app-container" :class="hasFooter || isTabbar ? '':'pb'"
-    :style="{background: bgColor, height: 'calc(100vh - ' + aHeight + 'px)'}">
+  <view
+    class="app-container"
+    :class="hasFooter || isTabbar ? '' : 'pb'"
+    :style="{ background: bgColor, height: 'calc(100vh - ' + aHeight + 'px)' }"
+  >
     <u-loading-page color="#333333" fontSize="17" icon-size="44" :loading="isLoading"></u-loading-page>
 
     <block v-if="!isLoading">
@@ -9,18 +12,54 @@
       </view>
       <view class="content-container">
         <template v-if="isScroll">
-          <scroll-view scroll-y enable-flex refresher-enabled style="width: 100%; height: 100%; box-sizing: border-box;"
-            :refresher-background="refresherBackground" @scrolltoupper="(...p)=>{$emit('scrolltoupper',p)}"
-            @scrolltolower="(...p)=>{$emit('scrolltolower',p)}" @scroll="(...p)=>{$emit('scroll',p)}"
-            @refresherpulling="(...p)=>{$emit('refresherpulling',p)}"
-            @refresherrefresh="(...p)=>{$emit('refresherrefresh',p)}"
-            @refresherrestore="(...p)=>{$emit('refresherrestore',p)}"
-            @refresherabort="(...p)=>{$emit('refresherabort',p)}" :refresher-triggered="refresherTriggered">
+          <scroll-view
+            scroll-y
+            enable-flex
+            refresher-enabled
+            style="width: 100%; height: 100%; box-sizing: border-box"
+            :refresher-background="refresherBackground"
+            @scrolltoupper="
+              (...p) => {
+                $emit('scrolltoupper', p)
+              }
+            "
+            @scrolltolower="
+              (...p) => {
+                $emit('scrolltolower', p)
+              }
+            "
+            @scroll="
+              (...p) => {
+                $emit('scroll', p)
+              }
+            "
+            @refresherpulling="
+              (...p) => {
+                $emit('refresherpulling', p)
+              }
+            "
+            @refresherrefresh="
+              (...p) => {
+                $emit('refresherrefresh', p)
+              }
+            "
+            @refresherrestore="
+              (...p) => {
+                $emit('refresherrestore', p)
+              }
+            "
+            @refresherabort="
+              (...p) => {
+                $emit('refresherabort', p)
+              }
+            "
+            :refresher-triggered="refresherTriggered"
+          >
             <slot></slot>
           </scroll-view>
         </template>
         <template v-else>
-          <view style="width: 100%; height: 100%; box-sizing: border-box; overflow-y: scroll;">
+          <view style="width: 100%; height: 100%; box-sizing: border-box; overflow-y: scroll">
             <slot></slot>
           </view>
         </template>
@@ -33,106 +72,108 @@
 </template>
 
 <script>
-  import {
-    isWeixin
-  } from "@/common/utils/common.js"
+import { isWeixin } from '@/common/utils/common.js'
 
-  export default {
-    props: {
-      bgColor: {
-        type: String,
-        default: '#F7F8FF',
-      },
-      refresherBackground: {
-        type: String,
-        default: '#F7F8FF',
-      },
-      hasFooter: {
-        type: Boolean,
-        default: false,
-      },
-      isScroll: {
-        type: Boolean,
-        default: false,
-      },
-      refresherTriggered: {
-        type: Boolean,
-        default: false,
-      },
-      isLoading: {
-        type: Boolean,
-        default: false,
-      },
-      isWxCustomPage: {
-        type: Boolean,
-        default: false,
-      },
+export default {
+  props: {
+    bgColor: {
+      type: String,
+      default: '#F7F8FF'
     },
+    refresherBackground: {
+      type: String,
+      default: '#F7F8FF'
+    },
+    hasFooter: {
+      type: Boolean,
+      default: false
+    },
+    isScroll: {
+      type: Boolean,
+      default: false
+    },
+    refresherTriggered: {
+      type: Boolean,
+      default: false
+    },
+    isLoading: {
+      type: Boolean,
+      default: false
+    },
+    isWxCustomPage: {
+      type: Boolean,
+      default: false
+    }
+  },
 
-    computed: {
-      isTabbar() {
-        let pages = getCurrentPages();
-        if (pages.length > 0) {
-          let prevPage = pages[pages.length - 1];
-          if (prevPage.route === 'pages/index/index' || prevPage.route === 'pages/workorder/index' || prevPage.route ===
-            'pages/goods/index' || prevPage.route === 'pages/mine/index') {
-            return true;
-          } else {
-            return false;
-          }
-        }
-      },
-
-      aHeight() {
-        let num = 0;
-        // #ifdef H5
-        if(this.isWxCustomPage) {
-          num = 50;
-        } else if (this.isTabbar) {
-          num = 0+50;
+  computed: {
+    isTabbar() {
+      let pages = getCurrentPages()
+      if (pages.length > 0) {
+        let prevPage = pages[pages.length - 1]
+        if (
+          prevPage.route === 'pages/index/index' ||
+          prevPage.route === 'pages/workorder/index' ||
+          prevPage.route === 'pages/goods/index' ||
+          prevPage.route === 'pages/mine/index'
+        ) {
+          return true
         } else {
-          num = 0;
+          return false
         }
-        // #endif
-        return num;
-      },
+      }
+    },
+
+    aHeight() {
+      let num = 0
+      // #ifdef H5
+      if (this.isWxCustomPage) {
+        num = 50
+      } else if (this.isTabbar) {
+        num = 0 + 50
+      } else {
+        num = 0
+      }
+      // #endif
+      return num
     }
   }
+}
 </script>
 
 <style lang="scss" scoped>
-  ::v-deep .u-loading-page {
-    z-index: 999999;
-  }
+::v-deep .u-loading-page {
+  z-index: 999999;
+}
 
-  .app-container {
-    width: 100%;
-    height: 100vh;
-    box-sizing: border-box;
-    display: flex;
-    flex-direction: column;
+.app-container {
+  width: 100%;
+  height: 100vh;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
 
-    &.pb {
-      padding-bottom: env(safe-area-inset-bottom);
-    }
+  &.pb {
+    padding-bottom: env(safe-area-inset-bottom);
+  }
 
-    .header-container {
-      flex-shrink: 0;
-    }
+  .header-container {
+    flex-shrink: 0;
+  }
 
-    .content-container {
-      flex: 1;
-      height: 0;
-    }
+  .content-container {
+    flex: 1;
+    height: 0;
+  }
 
-    .footer-container {
-      flex-shrink: 0;
-      padding-bottom: env(safe-area-inset-bottom);
-      background: #ffffff;
-      box-sizing: border-box;
-      box-shadow: $bottom-shadow;
-      position: relative;
-      z-index: 1;
-    }
+  .footer-container {
+    flex-shrink: 0;
+    padding-bottom: env(safe-area-inset-bottom);
+    background: #ffffff;
+    box-sizing: border-box;
+    box-shadow: $bottom-shadow;
+    position: relative;
+    z-index: 1;
   }
+}
 </style>

+ 61 - 66
src/packageEnter/pages/insurance/myInsurance/index.vue

@@ -1,75 +1,70 @@
 <template>
-  <view style="width: 100%; height: 100vh; background: rgb(247, 248, 255)">
-    <zj-page-container>
-      <view class="toubuyangs">
-        <view class="toubuyangsTab">
-          <view class="toubuyangsTabItem" @click="tabQiehuan('AC')">
-            <view>意外险</view>
-            <view :class="{ hengxian: true, xuanzhong: tab == 'AC' }"> </view>
+  <zj-page-layout
+    :isScroll="true"
+    :refresherTriggered="refresherTriggered"
+    @refresherrefresh="refresherrefresh"
+    :hasFooter="true"
+  >
+    <view class="toubuyangs" slot="header">
+      <view class="toubuyangsTab">
+        <view class="toubuyangsTabItem" @click="tabQiehuan('AC')">
+          <view>意外险</view>
+          <view :class="{ hengxian: true, xuanzhong: tab == 'AC' }"> </view>
+        </view>
+        <view class="toubuyangsTabItem" @click="tabQiehuan('DS')">
+          <view>第三者责任险</view>
+          <view :class="{ hengxian: true, xuanzhong: tab == 'DS' }"></view>
+        </view>
+      </view>
+    </view>
+    <view class="myInsurance">
+      <view class="myInsuranceCart" v-for="(item, index) in list" :key="index" @click="gopage(item)">
+        <view class="myInsuranceCartbuju xiangxia">
+          <view class="">
+            {{ item.policyName }}
           </view>
-          <view class="toubuyangsTabItem" @click="tabQiehuan('DS')">
-            <view>第三者责任险</view>
-            <view :class="{ hengxian: true, xuanzhong: tab == 'DS' }"></view>
+          <view class="" style="color: red">
+            {{ { BZZ: '保障中', YSX: '失效', DSX: '待生效' }[item.policyOrderStatus] }}
           </view>
         </view>
-      </view>
-      <zj-page-fill>
-        <zj-page-layout
-          :isScroll="true"
-          :refresherTriggered="refresherTriggered"
-          @refresherrefresh="refresherrefresh"
-          :hasFooter="true"
-        >
-          <view class="myInsurance">
-            <view class="myInsuranceCart" v-for="(item, index) in list" :key="index" @click="gopage(item)">
-              <view class="myInsuranceCartbuju xiangxia">
-                <view class="">
-                  {{ item.policyName }}
-                </view>
-                <view class="" style="color: red">
-                  {{ { BZZ: '保障中', YSX: '失效', DSX: '待生效' }[item.policyOrderStatus] }}
-                </view>
-              </view>
-              <view class="">
-                <view class="xiangxia"> 所属网点:{{ item.websitName }} </view>
-                <view class="xiangxia">
-                  保单类型:{{ { AC: '意外险', EM: '雇主险', IN: '工伤险', DS: '第三者责任险' }[item.type] }}
-                </view>
-                <view class="xiangxia"> 保单编号:{{ item.policyNumber }} </view>
-                <view class="xiangxia"> 保单金额:{{ item.payAmount }} </view>
-                <view class="xiangxia" v-if="item.startTime && item.endTime">
-                  有效时间:{{ item.startTime ? item.startTime.split(' ')[0] : '' }}~{{
-                    item.endTime ? item.endTime.split(' ')[0] : ''
-                  }}
-                </view>
-                <view class="xiangxia" v-else> 有效时间: </view>
-              </view>
-            </view>
+        <view class="">
+          <view class="xiangxia"> 所属网点:{{ item.websitName }} </view>
+          <view class="xiangxia">
+            保单类型:{{ { AC: '意外险', EM: '雇主险', IN: '工伤险', DS: '第三者责任险' }[item.type] }}
+          </view>
+          <view class="xiangxia"> 保单编号:{{ item.policyNumber }} </view>
+          <view class="xiangxia"> 保单金额:{{ item.payAmount }} </view>
+          <view class="xiangxia" v-if="item.startTime && item.endTime">
+            有效时间:{{ item.startTime ? item.startTime.split(' ')[0] : '' }}~{{
+              item.endTime ? item.endTime.split(' ')[0] : ''
+            }}
           </view>
-          <Loading :loadStatus="loadStatus" :dataList="list" />
-          <zjDialogPicker
-            ref="websitDialog"
-            :isShow="isShowWebsitDialog"
-            :multiple="false"
-            :styleType="2"
-            :title="'选择对应网点购买保险'"
-            :list="baoxiandangqianxianxitishi"
-            :keyName="'name'"
-            @cancel="isShowWebsitDialog = false"
-            @confirm="confirmWebsitDialog"
-          >
-          </zjDialogPicker>
-        </zj-page-layout>
-      </zj-page-fill>
-      <view
-        v-if="!!baoxiandangqianxianxitishi.length"
-        class="bottom-container"
-        style="box-sizing: border-box; padding: 20rpx"
-      >
-        <u-button text="去购买" shape="circle" type="primary" @click="qugoumai"> </u-button>
+          <view class="xiangxia" v-else> 有效时间: </view>
+        </view>
       </view>
-    </zj-page-container>
-  </view>
+    </view>
+    <Loading :loadStatus="loadStatus" :dataList="list" />
+    <zjDialogPicker
+      ref="websitDialog"
+      :isShow="isShowWebsitDialog"
+      :multiple="false"
+      :styleType="2"
+      :title="'选择对应网点购买保险'"
+      :list="baoxiandangqianxianxitishi"
+      :keyName="'name'"
+      @cancel="isShowWebsitDialog = false"
+      @confirm="confirmWebsitDialog"
+    >
+    </zjDialogPicker>
+    <view
+      slot="footer"
+      v-if="!!baoxiandangqianxianxitishi.length"
+      class="bottom-container"
+      style="box-sizing: border-box; padding: 20rpx"
+    >
+      <u-button text="去购买" shape="circle" type="primary" @click="qugoumai"> </u-button>
+    </view>
+  </zj-page-layout>
 </template>
 <script>
 import zjDialogPicker from '@/components/zj-dialog/zj-dialog-picker.vue'