<!-- 工作台 -->
|
<template>
|
<view class="work">
|
<!-- 自定义顶部导航栏 -->
|
<navBarTop :title="'我要巡'"></navBarTop>
|
<view class="hello" v-if="hello">
|
欢迎回来，{{userName}}
|
</view>
|
<view class="center">
|
<navigator class="left" @click="dakain" url="/pages/clockSignIn/clockSignIn">
|
<view class="l-img">
|
<image src="../../static/workbench/daka.png" mode=""></image>
|
</view>
|
<view class="l-title">打卡签到</view>
|
</navigator>
|
<view class="right">
|
<navigator url="/pages/patrol/patrol">
|
<view class="r-img">
|
<image src="../../static/workbench/luxian.png" mode=""></image>
|
</view>
|
<view class="r-title">巡逻路线</view>
|
</navigator>
|
</view>
|
</view>
|
<view class="main" style="display: none;">
|
<div>
|
<div class="m-title" id="mtitle">
|
<div class="m-t" @click="ingss" :style="{ borderBottom: ingsDB}">正在进行</div>
|
<div class="m-t" @click="candos" :style="{ borderBottom: candoDB}">可接任务</div>
|
</div>
|
<div class="m-titletop" :style="{top:titleTop}" v-if="onTop">
|
<div class="m-t" @click="ingss" :style="{ borderBottom: ingsDB}">正在进行</div>
|
<div class="m-t" @click="candos" :style="{ borderBottom: candoDB}">可接任务</div>
|
</div>
|
<div class="m-main">
|
<!-- <view class="inTitle">{{Task}}</view> -->
|
<view class="inTmain">
|
<pColumn v-for="(item,index) in dataListP" :key="index" :Pdata="item" :fromW="fromW"
|
@refreshTask="refreshTask"></pColumn>
|
</view>
|
</div>
|
</div>
|
</view>
|
<view class="zhanwei" :style="{height:zhanwei}">
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import WxStorage from "../../static/lib/wxStorage.js"
|
import pColumn from '../../components/pColumn/pColumn.vue'
|
import navBarTop from '../../components/nav-bar-top/nav-bar-top.vue';
|
export default{
|
components: {
|
navBarTop,pColumn
|
},
|
data() {
|
return {
|
zhanwei: '', //因为小程序中底部和顶部栏占位置，uniapp中不占位置
|
ingsDB: '#00d1ff 2px solid',
|
candoDB: '#fff 2px solid',
|
Task: '当前已接任务',
|
show: true,
|
dataListP: [],
|
fromW: '',
|
onTop: false, //是否吸顶
|
rect: '', //页面滚动距离
|
menutop: '', //组件距离顶部的距离
|
titleTop: '', //
|
hello: false,
|
userName: '',
|
}
|
},
|
methods: {
|
beginObj() {
|
this.titleTop = '2.6rem';
|
this.zhanwei = '3rem';
|
//#ifdef MP-WEIXIN
|
console.log('uni-app小程序中')
|
this.titleTop = '0';
|
this.zhanwei = '0';
|
//#endif
|
},
|
onClick(e) {
|
console.log(e, 777878)
|
},
|
ingss() {
|
this.ingsDB = '#00d1ff 2px solid';
|
this.candoDB = '#fff 2px solid';
|
this.Task = '当前已接任务';
|
this.getdataList(0);
|
},
|
candos() {
|
this.candoDB = '#00d1ff 2px solid';
|
this.ingsDB = '#fff 2px solid';
|
this.Task = '当前可接任务';
|
this.getdataList(1);
|
},
|
getdataList(need) {
|
this.fromW = need;
|
var url = need == "1" ? this.$store.state.piAPI + "/alarm/alarm/APP-getAlarm" : need == "0" ?
|
this.$store.state.piAPI + "/alarm/alarm/APP-getAlarming" : '',
|
id = this.$store.state.puserID,
|
data = need == "1" ? {
|
securityArr: id
|
} : need == "0" ? {
|
securityId: id
|
} : '',
|
that = this;
|
console.log(this.$store.state.puserID,'worke')
|
wx.request({
|
url: url,
|
data: data,
|
header: {
|
"content-type": "application/x-www-form-urlencoded"
|
},
|
method: 'POST',
|
success(res) {
|
if (res.statusCode == 200) {
|
that.dataListP = res.data.data
|
console.log(that.dataListP)
|
}
|
}
|
})
|
},
|
refreshTask() {
|
this.getdataList(1);
|
},
|
getTitleTopDistance() {
|
const query = uni.createSelectorQuery()
|
query.select('#mtitle').boundingClientRect()
|
query.exec((res) => {
|
// console.log(res[0].top, 'zhujian')
|
this.menutop = res[0].top
|
})
|
},
|
dakain() {
|
console.log('daka');
|
wx.navigateTo({
|
url: '/pages/poput/policeDetails/policeDetails?id=1',
|
})
|
}
|
},
|
mounted() {
|
this.beginObj();
|
this.ingss();
|
this.getTitleTopDistance();
|
},
|
onPageScroll(e) {
|
// console.log(e.scrollTop, 'pingmu')
|
this.rect = e.scrollTop
|
},
|
watch: {
|
rect() {
|
if (this.rect >= this.menutop) {
|
this.onTop = true
|
} else {
|
this.onTop = false
|
}
|
}
|
},
|
onLoad: function(options) {
|
this.userName = options.login
|
if (options.login != undefined) {
|
this.hello = true;
|
var time = setTimeout(() => {
|
this.hello = false;
|
}, 1500)
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.work {
|
width: 100%;
|
height: 100%;
|
padding: 0rem 2.5% 3rem 2.5%;
|
box-sizing: border-box;
|
|
.hello {
|
position: absolute;
|
top: 0;
|
left: 25%;
|
width: 50%;
|
height: 2rem;
|
border-radius: 20rem;
|
color: #fff;
|
background-color: rgba($color: #000000, $alpha: 0.5);
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.center {
|
margin-top: 0.625rem;
|
padding-top: 0.5rem;
|
display: flex;
|
align-items: center;
|
justify-content: space-around;
|
|
.left,
|
.right {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
|
image {
|
width: 4rem;
|
height: 4rem;
|
}
|
}
|
}
|
|
.main {
|
padding-top: 2rem;
|
|
.m-title {
|
width: 100%;
|
height: 2rem;
|
display: flex;
|
align-items: center;
|
justify-content: space-around;
|
padding-top: 0.8rem;
|
padding-bottom: 0.5rem;
|
// border: 1px solid #B3E19D;
|
box-sizing: border-box;
|
|
.m-t {
|
padding-bottom: 0.5rem;
|
box-sizing: border-box;
|
}
|
}
|
|
.m-titletop {
|
width: 95%;
|
height: 2.2rem;
|
display: flex;
|
align-items: center;
|
justify-content: space-around;
|
padding-top: 0.8rem;
|
padding-bottom: 0.5rem;
|
// border: 1px solid #B3E19D;
|
box-sizing: border-box;
|
position: fixed;
|
background-color: #fff;
|
z-index: 3;
|
border-bottom: 1px solid rgba($color: #000000, $alpha: 0.3);
|
|
.m-t {
|
padding-bottom: 0.5rem;
|
box-sizing: border-box;
|
}
|
}
|
|
.m-main {
|
padding-top: 0.5rem;
|
box-sizing: border-box;
|
}
|
}
|
}
|
</style>
|
