97 lines
2.8 KiB
Vue
97 lines
2.8 KiB
Vue
<!-- 普通模式演示(vue) -->
|
||
<template>
|
||
<view class="content">
|
||
<z-paging ref="paging" v-model="dataList" @scroll="scroll" :paging-style="{ paddingTop: 0 + 'px', paddingBottom: paddingBottom + 'rpx' }" @query="queryList">
|
||
<!-- 需要固定在顶部不滚动的view放在slot="top"的view中，如果需要跟着滚动，则不要设置slot="top" -->
|
||
<!-- 注意！此处的z-tabs为独立的组件，可替换为第三方的tabs，若需要使用z-tabs，请在插件市场搜索z-tabs并引入，否则会报插件找不到的错误 -->
|
||
<template #top>
|
||
<nav-bar :scrollTop="scrollTop" @initNav="initNav"></nav-bar>
|
||
</template>
|
||
<!-- 如果希望其他view跟着页面滚动，可以放在z-paging标签内 -->
|
||
<view>
|
||
<bg-box></bg-box>
|
||
<main-box></main-box>
|
||
</view>
|
||
<!-- 自定义没有更多数据view -->
|
||
<template #empty>
|
||
<view></view>
|
||
</template>
|
||
<!-- 自定义没有更多数据view -->
|
||
<template #loadingMoreNoMore>
|
||
<view></view>
|
||
</template>
|
||
</z-paging>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import NavBar from '@/pages/tabbar/components/mine/navBar.vue';
|
||
import BgBox from '@/pages/tabbar/components/mine/bgBox.vue';
|
||
import MainBox from '@/pages/tabbar/components/mine/mainBox.vue';
|
||
import ClerkApi from '@/sheep/api/worker/clerk';
|
||
import sheep from '@/sheep';
|
||
export default {
|
||
components: {
|
||
NavBar,
|
||
BgBox,
|
||
MainBox,
|
||
},
|
||
data() {
|
||
return {
|
||
dataList: [],
|
||
paddingTop: 0,
|
||
paddingBottom: 100,
|
||
height: 0,
|
||
scrollTop: 0.5,
|
||
}
|
||
},
|
||
created() {
|
||
const isLogin = sheep.$store('user').isLogin;
|
||
if(isLogin) {
|
||
this.getClerk();
|
||
}
|
||
},
|
||
methods: {
|
||
initNav(e) {
|
||
this.height = e.height;
|
||
this.paddingTop = this.height;
|
||
},
|
||
tabChange(index) {
|
||
this.tabIndex = index;
|
||
// 当切换tab或搜索时请调用组件的reload方法，请勿直接调用：queryList方法！！
|
||
this.$refs.paging.reload();
|
||
},
|
||
queryList(pageNo, pageSize) {
|
||
// 组件加载时会自动触发此方法，因此默认页面加载时会自动触发，无需手动调用
|
||
// 这里的pageNo和pageSize会自动计算好，直接传给服务器即可
|
||
// 模拟请求服务器获取分页数据，请替换成自己的网络请求
|
||
const params = {
|
||
pageNo: pageNo,
|
||
pageSize: pageSize,
|
||
type: this.tabIndex + 1
|
||
}
|
||
this.$refs.paging.complete([]);
|
||
},
|
||
scroll(e) {
|
||
this.scrollTop = e.detail.scrollTop;
|
||
},
|
||
getClerk() {
|
||
ClerkApi.getClerkList().then((res) => {
|
||
if(res.data[0]){
|
||
sheep.$store('sys').setCurrentClerk(res.data[0]);
|
||
}else{
|
||
sheep.$store('sys').setCurrentClerk({
|
||
id: -1,
|
||
avatar: 'https://rbtnet.oss-cn-hangzhou.aliyuncs.com/aa361225849eeb86428e1a3d647d6f7b94354e74de212403bb968e6ad85e79b3.jpeg',
|
||
});
|
||
}
|
||
});
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
|
||
</style>
|