217 lines
5.0 KiB
Vue
217 lines
5.0 KiB
Vue
<template>
|
|
<view>
|
|
<view class="btns-header">
|
|
<text :class="state" @click="changRound(1)" id="isDai"></text>
|
|
<text class="left">待审批</text>
|
|
<text :class="state2" @click="changRound(2)" id="notDai"></text>
|
|
<text class="">已审批</text>
|
|
</view>
|
|
<view class="details">
|
|
<view v-if="num==2" class="detail" @click='toDetail("/pages/visitorAppointment/visitorAppointment")'>
|
|
<view class="detail_header">
|
|
<text class="blueSign"></text>
|
|
<text class="font-tilte">访客预约</text>
|
|
<text class="slect_icon"></text>
|
|
<text class="font-result"> 已同意 </text>
|
|
</view>
|
|
<view class="detail_msg">
|
|
<view>
|
|
<text>被访人： </text>
|
|
<text class="infoSpan">王五</text>
|
|
</view>
|
|
<view>
|
|
<text>被访时间： </text>
|
|
<text class="infoSpan">12-03 02:00~12-03 06:00</text>
|
|
</view>
|
|
<view>
|
|
<text>申请人： </text>
|
|
<text class="infoSpan">刘斌</text>
|
|
</view>
|
|
<view class="submitTime">
|
|
<text>申请时间： </text>
|
|
<text class="infoSpan">2019-11-29 12:07:59</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="detail" v-if="num==2" @click='toDetail("/pages/visitorAppointment_test/visitorAppointment_test")'>
|
|
<view class="detail_header">
|
|
<text class="blueSign"></text>
|
|
<text class="font-tilte">访客预约</text>
|
|
<text class="slect_icon"></text>
|
|
<text class="font-result_2"> 已拒绝 </text>
|
|
</view>
|
|
<view class="detail_msg">
|
|
<view>
|
|
<text>被访人： </text>
|
|
<text class="infoSpan">李四</text>
|
|
</view>
|
|
<view>
|
|
<text>被访时间： </text>
|
|
<text class="infoSpan">12-03 02:00~12-03 06:00</text>
|
|
</view>
|
|
<view>
|
|
<text>申请人： </text>
|
|
<text class="infoSpan">六六</text>
|
|
</view>
|
|
<view class="submitTime">
|
|
<text>申请时间： </text>
|
|
<text class="infoSpan">2019-11-29 12:07:59</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="detail" v-if="num==1" @click='toDetail("/pages/visitorAppointment_test2/visitorAppointment_test2")'>
|
|
<view class="detail_header">
|
|
<text class="blueSign"></text>
|
|
<text class="font-tilte">访客预约</text>
|
|
<text class="slect_icon"></text>
|
|
<text class="font-result_2"> 待审批 </text>
|
|
</view>
|
|
<view class="detail_msg">
|
|
<view>
|
|
<text>被访人： </text>
|
|
<text class="infoSpan">李四</text>
|
|
</view>
|
|
<view>
|
|
<text>被访时间： </text>
|
|
<text class="infoSpan">12-03 02:00~12-03 06:00</text>
|
|
</view>
|
|
<view>
|
|
<text>申请人： </text>
|
|
<text class="infoSpan">六六</text>
|
|
</view>
|
|
<view class="submitTime">
|
|
<text>申请时间： </text>
|
|
<text class="infoSpan">2019-11-29 12:07:59</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
state:"round show",
|
|
state2:"round",
|
|
num:1
|
|
}
|
|
},
|
|
methods: {
|
|
toDetail(url){
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
},
|
|
changRound(num){
|
|
if(num==1){
|
|
this.state2 = "round";
|
|
this.state = "round show";
|
|
this.num=1;
|
|
}else if(num == 2){
|
|
this.state2 = "round show";
|
|
this.state = "round";
|
|
this.num=2;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
page{
|
|
height: 100%;
|
|
width: 100%;
|
|
background: #f5f5f5;
|
|
overflow-y: scroll;
|
|
}
|
|
/* 圆点 */
|
|
.btns-header {
|
|
background: #fff;
|
|
height: 2.633333rem;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: left;
|
|
padding-left: .9rem;
|
|
font-size: .785333rem;
|
|
}
|
|
.btns-header .round {
|
|
width: .62rem;
|
|
height: .62rem;
|
|
border-radius: 50%;
|
|
background: #cccccc;
|
|
margin-right: .666667rem;
|
|
}
|
|
.btns-header .left {
|
|
margin-right: 4.453333rem;
|
|
}
|
|
.btns-header .show {
|
|
background: #00c277;
|
|
}
|
|
.btns-header .show {
|
|
background: #00c277;
|
|
}
|
|
|
|
|
|
.details{
|
|
padding: .566667rem .566667rem .566667rem .566667rem;
|
|
|
|
}
|
|
.detail{
|
|
margin-bottom: .566667rem;
|
|
background: #ffffff;
|
|
border-radius: .333333rem;
|
|
}
|
|
.detail_header{
|
|
height: 2.573333rem;
|
|
}
|
|
.detail_header text{
|
|
margin-top: 1.2rem;
|
|
}
|
|
.detail_header .blueSign {
|
|
height: .573333rem;
|
|
width: .156667rem;
|
|
background: #00c277;
|
|
display: inline-block;
|
|
margin-right: .213333rem;
|
|
}
|
|
.detail_header .font-tilte{
|
|
font-size: .785333rem;
|
|
}
|
|
.detail_header .slect_icon{
|
|
width: .426667rem;
|
|
height: .426667rem;
|
|
/* margin-left: .266667rem; */
|
|
border-radius: .053333rem;
|
|
border: .013333rem solid #999;
|
|
overflow: hidden;
|
|
}
|
|
.detail_header .font-result{
|
|
font-size: .635333rem;
|
|
color: #00c277;
|
|
margin-left: 8.6rem;
|
|
}
|
|
.detail_header .font-result_2{
|
|
font-size: .635333rem;
|
|
color: #DD524D;
|
|
margin-left: 8.6rem;
|
|
}
|
|
.detail_msg view{
|
|
margin-top: 0.1rem;
|
|
margin-bottom: 0.4rem;
|
|
}
|
|
.detail_header text,
|
|
.detail_msg view text{
|
|
color: #333333;
|
|
font-size: .745333rem;
|
|
margin-left: .826667rem;
|
|
}
|
|
.detail_header{
|
|
border-bottom: .033333rem solid #BEBEBE;
|
|
}
|
|
</style>
|