hls_crm/pagesA/work/approve/index.vue

180 lines
3.7 KiB
Vue

<template>
<view>
<view class="tabbox">
<view class="tabli" :class="{'tabactive': type == 0}" @click="changeTab(0)">
<view class="tabname">全部</view>
<view class="tabot"></view>
</view>
<view class="tabli" :class="{'tabactive': type == 1}" @click="changeTab(1)">
<view class="tabname">我创建的</view>
<view class="tabot"></view>
</view>
<view class="tabli" :class="{'tabactive': type == 2}" @click="changeTab(2)">
<view class="tabname">下属创建的</view>
<view class="tabot"></view>
</view>
</view>
<!-- 筛选 -->
<view class="searchbox">
<view class="searchtext" @click="toQuery">筛选<view class="iconfont icon-shaixuan"></view></view>
</view>
<!-- 列表数据 -->
<scroll-view scroll-y="true" class="scrollbox" @scrolltolower="loadMore">
<view>
<item :list="list"></item>
</view>
</scroll-view>
<!-- 添加 -->
<view class="btn_fix" @click="toSelectApprove" >
<image :src="BASE_IMG_URL+'1.png'"></image>
</view>
<!-- 筛选弹框 -->
<pop-screen ref="popChild" :typeList="typeList" @sureParams="sureParams"></pop-screen>
</view>
</template>
<script>
import Item from './item.vue'
import { netWorkExamineList, netWorkExamineName } from '@/api/index'
import popScreen from './popScreen.vue'
import { BASE_IMG_URL } from '@/util/api.js'
export default{
components:{
Item,
popScreen
},
data() {
return{
BASE_IMG_URL:BASE_IMG_URL,
page:1,
totalPage:1,
list:[],
type:0, //0全部 1我创建的 2下属创建的
queryParams:{},
typeList:[], //审批类型
permission:{}, //权限
}
},
onLoad() {
//获取审批类型
this.getType()
},
onShow(){
this.init()
this.permission = getApp().globalData.permission
},
methods:{
//筛选
toQuery() {
this.$refs.popChild.init()
},
getType() {
netWorkExamineName().then(res=>{
this.typeList = res.data
})
},
sureParams(params) {
this.queryParams = params
this.init()
},
getList() {
let params = {
page:this.page,
type:this.type,
...this.queryParams
}
netWorkExamineList(params).then(res=>{
this.totalPage = res.data.last_page
this.list = this.list.concat(res.data.data)
})
},
loadMore() {
if(this.page < this.totalPage){
this.page ++
this.getList()
}
},
init() {
this.page = 1
this.list = []
this.getList()
},
changeTab(type){
this.type = type
this.init()
},
toSelectApprove() {
uni.navigateTo({
url:'/pagesA/work/approve/createTab'
})
}
}
}
</script>
<style lang="scss" scoped>
.searchbox{
display: flex;
justify-content: flex-end;
margin:24rpx 24rpx 0;
.searchtext{
display: flex;
justify-content: center;
align-items: center;
font-size:24rpx;
color:$uni-text-color;
padding:8rpx 28rpx;
background:#fff;
border-radius: 5rpx;
box-shadow: 2rpx 2rpx 50rpx rgba(0,0,0,0.1);
.icon-shaixuan{
color:$uni-text-color;
}
}
}
.scrollbox{
width:750rpx;
height:calc(100vh - 154rpx);
}
.tabbox{
width:750rpx;
height:80rpx;
display: flex;
justify-content: space-around;
background:#fff;
.tabli{
padding-top:20rpx;
.tabname{
font-size:26rpx;
color:#666;
text-align: center;
margin-bottom:15rpx;
}
.tabot{
width:80rpx;
height:8rpx;
border-radius: 4rpx;
background:#fff;
}
}
.tabactive{
.tabot{
background:$uni-text-color;
}
}
}
.btn_fix {
position: fixed;
bottom: calc(150rpx + env(safe-area-inset-bottom) / 2);
right: 60rpx;
image {
width: 80rpx;
height: 80rpx;
background-color: #fff;
border-radius: 40rpx;
}
}
</style>