no message

src/packageMine/pages/myWebsit copy.vue

@@ -0,0 +1,250 @@
+<template>
+  <zj-page-layout
+    :isScroll="true"
+    :refresherTriggered="refresherTriggered"
+    @refresherrefresh="refresherrefresh"
+    :hasFooter="true"
+  >
+    <template slot="header">
+      <view class="search-container">
+        <u-search shape="round" :showAction="false" placeholder="输入网点名称搜索" v-model="keyword"> </u-search>
+      </view>
+    </template>
+    <view class="list-container" v-if="showDataList.length > 0">
+      <view class="mode" @click="navToPage(item)" v-for="(item, index) in showDataList" :key="index">
+        <view class="flex_asb order">
+          <view class="title"></view>
+          <view class="status">{{
+            item.examineStatus == 'WAIT_WORKER'
+              ? '待师傅购买'
+              : item.examineStatus == 'POLICY_WAIT'
+              ? '保险待审核'
+              : item.examineStatus == 'OK'
+              ? '状态正常'
+              : item.examineStatus == 'FAIL'
+              ? '已驳回'
+              : item.examineStatus == 'EXPIRED'
+              ? '证件快过期'
+              : item.examineStatus == 'OVERDUE'
+              ? '证件已过期'
+              : item.examineStatus == 'STOP'
+              ? '已经离职'
+              : item.examineStatus == 'QUIT'
+              ? '已经离职'
+              : item.examineStatus == 'WAIT'
+              ? '入驻申请待审核'
+              : ''
+          }}</view>
+        </view>
+        <view class="flex_asb" style="align-items: flex-start">
+          <image class="img" src="/static/mine/workerEnter/order.png" mode="aspectFill"></image>
+          <view class="content flex1">
+            <view class="flex_asb">
+              <view class="title">{{ item.name }}</view>
+            </view>
+            <view class="flex">
+              <view class="hui">地址</view>
+              <view class="text">{{ item.address || '无' }}</view>
+            </view>
+            <view class="flex_end">
+              <u-button
+                v-if="item.examineStatus == 'N' || item.examineStatus == 'FAIL'"
+                style="width: 160rpx; height: 60rpx; margin: 0"
+                shape="circle"
+                type="primary"
+                text="入驻"
+                @tap="goEnter(item)"
+              ></u-button>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <Loading :loadStatus="loadStatus" :dataList="dataList" />
+    <zjDialogPicker
+      ref="websitDialog"
+      :isShow="isShowWebsitDialog"
+      :multiple="false"
+      :styleType="2"
+      :title="'选择对应网点购买保险'"
+      :list="baoxiandangqianxianxitishi"
+      :keyName="'websitName'"
+      @cancel="isShowWebsitDialog = false"
+      @confirm="confirmWebsitDialog"
+    >
+    </zjDialogPicker>
+    <template slot="footer" v-if="!!baoxiandangqianxianxitishi.length">
+      <view class="bottom-container" style="box-sizing: border-box; padding: 20rpx">
+        <u-button text="去购买" shape="circle" type="primary" @click="isShowWebsitDialog = true"> </u-button>
+      </view>
+    </template>
+  </zj-page-layout>
+</template>
+
+<script>
+import zjDialogPicker from '@/components/zj-dialog/zj-dialog-picker.vue'
+export default {
+  components: {
+    zjDialogPicker
+  },
+
+  data() {
+    return {
+      refresherTriggered: false,
+      loadStatus: 0,
+      pageNum: 1,
+      dataList: [],
+      keyword: '',
+      baoxiandangqianxianxitishi: [],
+      isShowWebsitDialog: false
+    }
+  },
+
+  onShow() {
+    this.refreshLish()
+    // this.$api.post('/worker/remind').then(res => {
+    //   this.baoxiandangqianxianxitishi = res.data
+    // })
+  },
+
+  computed: {
+    showDataList() {
+      return this.dataList.filter(item => !!~item.name.indexOf(this.keyword))
+    }
+  },
+
+  methods: {
+    confirmWebsitDialog(e) {
+      this.isShowWebsitDialog = false
+      this.$navToPage({
+        url:
+          '/packageEnter/pages/insurance/myInsuranceBuy/index?websitId=' +
+          this?.baoxiandangqianxianxitishi?.[e[0]]?.websitId
+      })
+    },
+
+    async getList() {
+      this.loadStatus = 1
+      var { latitude, longitude } = await this.$getLocation()
+      this.$api
+        .get('/user/apply/websit', {
+          isAll: true,
+          lat: latitude,
+          lng: longitude
+        })
+        .then(res => {
+          this.loadStatus = 2
+          this.refresherTriggered = false
+          this.dataList = res.data
+        })
+    },
+
+    navToPage(url) {
+      this.$navToPage({
+        url
+      })
+    },
+
+    // 触发下拉刷新
+    refresherrefresh(e) {
+      this.refresherTriggered = true
+      this.refreshLish()
+    },
+
+    refreshLish() {
+      this.dataList = []
+      this.pageNum = 1
+      this.getList()
+    },
+
+    goEnter(item) {
+      this.$navToPage({
+        url: '/packageMine/pages/workerEnter?websitName=' + item.name + '&websitId=' + item.websitId
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.flex {
+  display: flex;
+  align-items: center;
+}
+.flex_asb {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.flex_end {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin-top: 30rpx;
+}
+.flex1 {
+  flex: 1;
+}
+.list-container {
+  box-sizing: border-box;
+  padding: 0 30rpx;
+}
+.mode {
+  @include zj-card;
+  padding: 30rpx 20rpx;
+  margin-top: 30rpx;
+  border-radius: 20rpx;
+  box-sizing: border-box;
+  background-color: #ffffff;
+  .order {
+    margin-bottom: 20rpx;
+  }
+  .content {
+    width: 450rpx;
+    .title {
+      font-weight: bold;
+      font-size: 30rpx;
+    }
+    .text,
+    .hui {
+      font-size: 28rpx;
+      margin-top: 16rpx;
+    }
+    .hui {
+      color: #999999;
+      margin-right: 20rpx;
+    }
+  }
+  .status {
+    font-size: 28rpx;
+    color: #0379ff;
+  }
+  .zhihui {
+    .text,
+    .hui,
+    .title,
+    .status {
+      color: #999999 !important;
+    }
+  }
+  .img {
+    width: 100rpx;
+    height: 100rpx;
+    margin-right: 30rpx;
+  }
+}
+.search-container {
+  background: #ffffff;
+  padding: 20rpx;
+  ::v-deep .u-search {
+    height: 60rpx;
+    input {
+      background: #f7f8ff !important;
+    }
+    .u-search__content {
+      background: #f7f8ff !important;
+      height: 60rpx;
+    }
+  }
+}
+</style>

src/packageMine/pages/myWebsit.vue

@@ -1,118 +1,137 @@
 <template>
-  <zj-page-layout
-    :isScroll="true"
-    :refresherTriggered="refresherTriggered"
-    @refresherrefresh="refresherrefresh"
-    :hasFooter="true"
-  >
-    <template slot="header">
-      <view class="search-container">
-        <u-search shape="round" :showAction="false" placeholder="输入网点名称搜索" v-model="keyword"> </u-search>
-      </view>
-    </template>
-    <view class="list-container" v-if="showDataList.length > 0">
-      <view class="mode" @click="navToPage(item)" v-for="(item, index) in showDataList" :key="index">
-        <view class="flex_asb order">
-          <view class="title"></view>
-          <view class="status">{{
-            item.examineStatus == 'WAIT_WORKER'
-              ? '待师傅购买'
-              : item.examineStatus == 'POLICY_WAIT'
-              ? '保险待审核'
-              : item.examineStatus == 'OK'
-              ? '状态正常'
-              : item.examineStatus == 'FAIL'
-              ? '已驳回'
-              : item.examineStatus == 'EXPIRED'
-              ? '证件快过期'
-              : item.examineStatus == 'OVERDUE'
-              ? '证件已过期'
-              : item.examineStatus == 'STOP'
-              ? '已经离职'
-              : item.examineStatus == 'QUIT'
-              ? '已经离职'
-              : item.examineStatus == 'WAIT'
-              ? '入驻申请待审核'
-              : ''
-          }}</view>
-        </view>
-        <view class="flex_asb" style="align-items: flex-start">
-          <image class="img" src="/static/mine/workerEnter/order.png" mode="aspectFill"></image>
-          <view class="content flex1">
-            <view class="flex_asb">
-              <view class="title">{{ item.name }}</view>
-            </view>
-            <view class="flex">
-              <view class="hui">地址</view>
-              <view class="text">{{ item.address || '无' }}</view>
-            </view>
-            <view class="flex_end">
-              <u-button
-                v-if="item.examineStatus == 'N' || item.examineStatus == 'FAIL'"
-                style="width: 160rpx; height: 60rpx; margin: 0"
-                shape="circle"
-                type="primary"
-                text="入驻"
-                @tap="goEnter(item)"
-              ></u-button>
-            </view>
+  <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(0)">
+            <view>未入驻</view>
+            <view :class="{ hengxian: true, xuanzhong: tab == 0 }"> </view>
+          </view>
+          <view class="toubuyangsTabItem" @click="tabQiehuan(1)">
+            <view>待审核</view>
+            <view :class="{ hengxian: true, xuanzhong: tab == 1 }"></view>
+          </view>
+          <view class="toubuyangsTabItem" @click="tabQiehuan(2)">
+            <view>已入驻</view>
+            <view :class="{ hengxian: true, xuanzhong: tab == 2 }"></view>
           </view>
         </view>
+        <view class="search-container">
+          <u-search shape="round" :showAction="false" placeholder="输入网点名称搜索" v-model="keyword"> </u-search>
+        </view>
       </view>
-    </view>
-    <Loading :loadStatus="loadStatus" :dataList="dataList" />
-    <zjDialogPicker
-      ref="websitDialog"
-      :isShow="isShowWebsitDialog"
-      :multiple="false"
-      :styleType="2"
-      :title="'选择对应网点购买保险'"
-      :list="baoxiandangqianxianxitishi"
-      :keyName="'websitName'"
-      @cancel="isShowWebsitDialog = false"
-      @confirm="confirmWebsitDialog"
-    >
-    </zjDialogPicker>
-    <template slot="footer" v-if="!!baoxiandangqianxianxitishi.length">
-      <view class="bottom-container" style="box-sizing: border-box; padding: 20rpx">
+      <zj-page-fill>
+        <zj-page-layout
+          :isScroll="true"
+          :refresherTriggered="refresherTriggered"
+          @refresherrefresh="refresherrefresh"
+          @scrolltolower="scrolltolower"
+        >
+          <view class="list-container" v-if="showDataList.length > 0">
+            <view class="mode" @click="navToPage(item)" v-for="(item, index) in showDataList" :key="index">
+              <view class="flex_asb order">
+                <view class="title"></view>
+                <view class="status">{{
+                  item.examineStatus == 'WAIT_WORKER'
+                    ? '待师傅购买'
+                    : item.examineStatus == 'POLICY_WAIT'
+                    ? '保险待审核'
+                    : item.examineStatus == 'OK'
+                    ? '状态正常'
+                    : item.examineStatus == 'FAIL'
+                    ? '已驳回'
+                    : item.examineStatus == 'EXPIRED'
+                    ? '证件快过期'
+                    : item.examineStatus == 'OVERDUE'
+                    ? '证件已过期'
+                    : item.examineStatus == 'STOP'
+                    ? '已经离职'
+                    : item.examineStatus == 'QUIT'
+                    ? '已经离职'
+                    : item.examineStatus == 'WAIT'
+                    ? '入驻申请待审核'
+                    : ''
+                }}</view>
+              </view>
+              <view class="flex_asb" style="align-items: flex-start">
+                <image class="img" src="/static/mine/workerEnter/order.png" mode="aspectFill"></image>
+                <view class="content flex1">
+                  <view class="flex_asb">
+                    <view class="title">{{ item.name }}</view>
+                  </view>
+                  <view class="flex">
+                    <view class="hui">地址</view>
+                    <view class="text">{{ item.address || '无' }}</view>
+                  </view>
+                  <view class="flex_end">
+                    <u-button
+                      v-if="item.examineStatus == 'N' || item.examineStatus == 'FAIL'"
+                      style="width: 160rpx; height: 60rpx; margin: 0"
+                      shape="circle"
+                      type="primary"
+                      text="入驻"
+                      @tap="goEnter(item)"
+                    ></u-button>
+                  </view>
+                </view>
+              </view>
+            </view>
+          </view>
+          <Loading :loadStatus="loadStatus" :dataList="dataList" />
+          <zjDialogPicker
+            ref="websitDialog"
+            :isShow="isShowWebsitDialog"
+            :multiple="false"
+            :styleType="2"
+            :title="'选择对应网点购买保险'"
+            :list="baoxiandangqianxianxitishi"
+            :keyName="'websitName'"
+            @cancel="isShowWebsitDialog = false"
+            @confirm="confirmWebsitDialog"
+          >
+          </zjDialogPicker>
+        </zj-page-layout>
+      </zj-page-fill>
+      <view class="quanjuanniu" v-if="!!baoxiandangqianxianxitishi.length">
         <u-button text="去购买" shape="circle" type="primary" @click="isShowWebsitDialog = true"> </u-button>
       </view>
-    </template>
-  </zj-page-layout>
+    </zj-page-container>
+  </view>
 </template>
 
 <script>
+import zjPageContainer from '@/components/zj-page-container/zj-page-container.vue'
+import zjPageFill from '@/components/zj-page-container/zj-page-fill.vue'
+import { getStorage } from '@/common/utils/storage.js'
 import zjDialogPicker from '@/components/zj-dialog/zj-dialog-picker.vue'
 export default {
   components: {
+    zjPageContainer,
+    zjPageFill,
     zjDialogPicker
   },
-
   data() {
     return {
+      tab: 0,
+      dataList: [],
       refresherTriggered: false,
       loadStatus: 0,
-      pageNum: 1,
-      dataList: [],
       keyword: '',
       baoxiandangqianxianxitishi: [],
       isShowWebsitDialog: false
     }
   },
-
   onShow() {
     this.refreshLish()
-    // this.$api.post('/worker/remind').then(res => {
-    //   this.baoxiandangqianxianxitishi = res.data
-    // })
   },
-
   computed: {
+    userInfo() {
+      return getStorage('user')
+    },
     showDataList() {
       return this.dataList.filter(item => !!~item.name.indexOf(this.keyword))
     }
   },
-
   methods: {
     confirmWebsitDialog(e) {
       this.isShowWebsitDialog = false
@@ -128,9 +147,19 @@ export default {
       var { latitude, longitude } = await this.$getLocation()
       this.$api
         .get('/user/apply/websit', {
-          isAll: true,
           lat: latitude,
-          lng: longitude
+          lng: longitude,
+          ...(() => {
+            if (this.tab > 0) {
+              return {
+                examineStatus: [['WAIT'], ['OK', 'EXPIRED', 'EXPIRED', 'STOP', 'QUIT']][this.tab - 1]
+              }
+            } else {
+              return {
+                isAll: true
+              }
+            }
+          })()
         })
         .then(res => {
           this.loadStatus = 2
@@ -153,7 +182,6 @@ export default {
 
     refreshLish() {
       this.dataList = []
-      this.pageNum = 1
       this.getList()
     },
 
@@ -161,12 +189,129 @@ export default {
       this.$navToPage({
         url: '/packageMine/pages/workerEnter?websitName=' + item.name + '&websitId=' + item.websitId
       })
+    },
+
+    tabQiehuan(index) {
+      this.tab = index
+      this.dataList = []
+      this.getList()
+    },
+
+    // 滚动到底部
+    scrolltolower(e) {},
+
+    // 触发下拉刷新
+    async refresherrefresh(e) {
+      this.refresherTriggered = true
+      this.dataList = []
+      this.getList()
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
+.search-container {
+  background: #ffffff;
+  padding: 20rpx;
+  ::v-deep .u-search {
+    height: 60rpx;
+    input {
+      background: #f7f8ff !important;
+    }
+    .u-search__content {
+      background: #f7f8ff !important;
+      height: 60rpx;
+    }
+  }
+}
+.quanjuanniu {
+  width: 100%;
+  height: auto;
+  padding: 30rpx;
+  box-sizing: border-box;
+}
+.neirongquyu {
+  width: 100%;
+  height: auto;
+  padding: 30rpx 30rpx 15rpx 30rpx;
+  box-sizing: border-box;
+  .zhegeshineirong {
+    width: 100%;
+    height: auto;
+    padding: 30rpx;
+    box-sizing: border-box;
+    background: #fff;
+    border-radius: 20rpx;
+    margin-bottom: 30rpx;
+    .neirongbiaot {
+      width: 100%;
+      height: auto;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      box-sizing: border-box;
+      margin-bottom: 40rpx;
+      text {
+        font-size: 32rpx;
+        font-weight: 700;
+      }
+    }
+    .neironglieju {
+      width: 100%;
+      height: auto;
+      display: flex;
+      align-items: center;
+      justify-content: flex-start;
+      box-sizing: border-box;
+      margin-bottom: 30rpx;
+      text {
+        font-size: 28rpx;
+      }
+    }
+    .neironghengxin {
+      width: 100%;
+      border-bottom: 1rpx solid #aaa;
+      margin-bottom: 30rpx;
+    }
+    .neironganniuqu {
+      widows: 100%;
+      text-align: right;
+    }
+  }
+}
+.toubuyangs {
+  width: 100%;
+  height: auto;
+  box-sizing: border-box;
+  padding: 30rpx 30rpx 15rpx 30rpx;
+  .toubuyangsTab {
+    width: 100%;
+    height: auto;
+    padding: 30rpx;
+    box-sizing: border-box;
+    background: #fff;
+    border-radius: 20rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+    .toubuyangsTabItem {
+      box-sizing: border-box;
+      font-size: 32rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-direction: column;
+      .hengxian {
+        margin-top: 20rpx;
+        width: 100rpx;
+      }
+      .xuanzhong {
+        border-bottom: 4rpx solid #000;
+      }
+    }
+  }
+}
 .flex {
   display: flex;
   align-items: center;