779 lines
23 KiB
Vue
779 lines
23 KiB
Vue
|
<template>
|
|||
|
|
<view class="container">
|
|||
|
|
<view class="banner-box">
|
|||
|
|
<image v-if="currentTabIndex == 0" src="/static/imgs/visitor.png" mode=""></image>
|
|||
|
|
<image v-if="currentTabIndex == 1" src="/static/imgs/visitor.png" mode=""></image>
|
|||
|
|
<image v-if="currentTabIndex == 2" src="/static/imgs/visitor.png" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
<view class="main">
|
|||
|
|
<view class="tab-box">
|
|||
|
|
<view class="tab-item" :class="currentTabIndex == 0 ? 'active' : ''" @click="currentTabIndex = 0">邀请来访</view>
|
|||
|
|
<view class="tab-item" :class="currentTabIndex == 1 ? 'active' : ''" @click="currentTabIndex = 1">审批授权</view>
|
|||
|
|
<view class="tab-item" :class="currentTabIndex == 2 ? 'active' : ''" @click="currentTabIndex = 2">邀约记录</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 访客预约表单 -->
|
|||
|
|
<view v-if="currentTabIndex == 0">
|
|||
|
|
<view class="form-box" >
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">到访地点</text>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input type="text" placeholder="请填写到访地点" v-model="deptList[visitPlace]" disabled>
|
|||
|
|
</view>
|
|||
|
|
<!-- <text class="label">到访地点</text>
|
|||
|
|
<view class="ipt-box select" @click="open">
|
|||
|
|
<image class="arrow" src="/static/icons/right-arrow.png" mode=""></image>
|
|||
|
|
<picker class="picker" :range="deptList" @change="changeDepartment">
|
|||
|
|
<view>{{deptList[departmentIndex]}}</view>
|
|||
|
|
</picker>
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">被访人姓名</text>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input type="text" placeholder="请填写被访人姓名" v-model="visitedPersonName">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">手机号码</text>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input type="text" placeholder="请填写手机号码" v-model="visitedPersonTel">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">来访时间</text>
|
|||
|
|
<!-- <view class="ipt-box select" @click="open(1)"> -->
|
|||
|
|
<view class="ipt-box select" >
|
|||
|
|
<image class="arrow" src="/static/icons/right-arrow.png" mode=""></image>
|
|||
|
|
<!-- <input type="text" :value="visitStartTime" placeholder="请选择来访时间"> -->
|
|||
|
|
<datetime-Picker class="picker" :placeholder="'请选择来访时间'"
|
|||
|
|
:maxDate="defaultMaxDate"
|
|||
|
|
:minDate="defaultMinDate"
|
|||
|
|
:minTime="minTime"
|
|||
|
|
:maxTime="maxTime"
|
|||
|
|
:pickerIndex="1"
|
|||
|
|
@getData="chooseDate" :type="'anyTime'">
|
|||
|
|
</datetime-Picker>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">结束时间</text>
|
|||
|
|
<!-- <view class="ipt-box select" @click="open(2)"> -->
|
|||
|
|
<view class="ipt-box select">
|
|||
|
|
<image class="arrow" src="/static/icons/right-arrow.png" mode=""></image>
|
|||
|
|
<!-- <input type="text" :value="visitEndTime" placeholder="请选择结束时间"> -->
|
|||
|
|
<datetime-Picker class="picker" :placeholder="'请选择结束时间'"
|
|||
|
|
:maxDate="defaultMaxDate"
|
|||
|
|
:minDate="defaultMinDate"
|
|||
|
|
:minTime="minTime"
|
|||
|
|
:maxTime="maxTime"
|
|||
|
|
:pickerIndex="2"
|
|||
|
|
@getData="chooseDate" :type="'anyTime'">
|
|||
|
|
</datetime-Picker>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">来访事由</text>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input type="text" placeholder="请填写来访事由" v-model="visitReason">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="sure-btn">确认申请</view> -->
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="form-box">
|
|||
|
|
<!-- 主访客 -->
|
|||
|
|
<view id="visitor">
|
|||
|
|
<view class="visitor">
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">访客姓名</text>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input class="name" type="text" v-model="zhu_visitorName" placeholder="请填写姓名">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">手机号</text>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input class="name" type="tel" v-model="zhu_visitorTel" placeholder="请填写访客手机号" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">身份证号</text>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input class="name" type="text" v-model="zhu_idcard" placeholder="请填写访客身份证号" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="form-box" v-if="number > 0">
|
|||
|
|
<!-- 随行人员 -->
|
|||
|
|
<view id="visitor" v-for="(item,index) in num" :key="index">
|
|||
|
|
<view class="visitor" v-if='item.flag == 1'>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">访客姓名</text>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input class="name" type="text" v-model="item.visitorName" placeholder="请填写姓名">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">手机号</text>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input class="name" type="tel" v-model="item.visitorTel" placeholder="请填写访客手机号" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item">
|
|||
|
|
<text class="label">身份证号</text>
|
|||
|
|
<view class="ipt-box">
|
|||
|
|
<input class="name" type="text" v-model="item.idcard" placeholder="请填写访客身份证号" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="form-item" v-if="number>0">
|
|||
|
|
<image class="jian" src="../../static/imgs/jian.png" @click="jianBtn(index)" alt=""></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 添加 -->
|
|||
|
|
<view id="addbtn" class="add clear">
|
|||
|
|
<view class="addbtn">
|
|||
|
|
<view>
|
|||
|
|
<text @click="addBtn()">+ 新增人员</text>
|
|||
|
|
<!-- <text>历史记录</text> -->
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="tips" >温馨提醒：<br> 访客来访时间为8:00-18:00，特殊情况请联系接待室办理！</view>
|
|||
|
|
|
|||
|
|
<view class="occupied"></view>
|
|||
|
|
<view class="footer-btn footer-btn-color" @click="submit()">
|
|||
|
|
<view class="btn">确认邀请</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 预约记录列表 -->
|
|||
|
|
<view class="list-box" v-if="currentTabIndex == 1">
|
|||
|
|
<view class="list-item" v-for="(item,index) in list" :key="index"
|
|||
|
|
@click='toDetail("/pages/visitorAppointment/visitorAppointment?id="+item.detail_id+"&role=2&userId="+userId)'>
|
|||
|
|
<view class="title">
|
|||
|
|
<text class="line"></text>
|
|||
|
|
<text class="text">访客预约</text>
|
|||
|
|
<text class="status2" v-if="item.first_status==0">待审核</text>
|
|||
|
|
<text class="status" v-if="item.first_status==1">已同意</text>
|
|||
|
|
<text class="status1" v-if="item.first_status==2">已拒绝</text>
|
|||
|
|
<text class="status1" v-if="item.first_status==3">待本人确认</text>
|
|||
|
|
<text class="status1" v-if="item.first_status==4">已取消</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="content">
|
|||
|
|
<view class="info-item">
|
|||
|
|
<view class="fl-text">被访人:</view>
|
|||
|
|
<view class="fr-text">{{item.visited_person_name}}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-item">
|
|||
|
|
<view class="fl-text">被访时间:</view>
|
|||
|
|
<view class="fr-text">{{item.visit_start_time}}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-item">
|
|||
|
|
<view class="fl-text">申请人:</view>
|
|||
|
|
<view class="fr-text">{{item.visitor_name}}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-item">
|
|||
|
|
<view class="fl-text">申请时间:</view>
|
|||
|
|
<view class="fr-text">{{item.apply_time}}</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="comment-btn" @click.stop="del(item.detail_id,1,index)">删除</view> -->
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 预约记录列表 -->
|
|||
|
|
<view class="list-box" v-if="currentTabIndex == 2">
|
|||
|
|
<view class="list-item" v-for="(item,index) in list" :key="index"
|
|||
|
|
@click='toDetail("/pages/visitorAppointment/visitorAppointment?id="+item.detail_id+"&userId="+userId)'>
|
|||
|
|
<view class="title">
|
|||
|
|
<text class="line"></text>
|
|||
|
|
<text class="text">邀约记录</text>
|
|||
|
|
<text class="status2" v-if="item.first_status==0">待审核</text>
|
|||
|
|
<text class="status" v-if="item.first_status==1">已同意</text>
|
|||
|
|
<text class="status1" v-if="item.first_status==2">已拒绝</text>
|
|||
|
|
<text class="status1" v-if="item.first_status==3">待本人确认</text>
|
|||
|
|
<text class="status1" v-if="item.first_status==4">已取消</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="content">
|
|||
|
|
<view class="info-item">
|
|||
|
|
<view class="fl-text">被访人:</view>
|
|||
|
|
<view class="fr-text">{{item.visited_person_name}}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-item">
|
|||
|
|
<view class="fl-text">被访时间:</view>
|
|||
|
|
<view class="fr-text">{{item.visit_start_time}}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-item">
|
|||
|
|
<view class="fl-text">主访人:</view>
|
|||
|
|
<view class="fr-text">{{item.visitor_name}}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-item">
|
|||
|
|
<view class="fl-text">申请时间:</view>
|
|||
|
|
<view class="fr-text">{{item.apply_time}}</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="comment-btn" @click.stop="del(item.detail_id,2,index)">删除</view> -->
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<content-none v-if="currentTabIndex != 0 && list.length == 0 " :padTop="20"></content-none>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<uni-calendar
|
|||
|
|
ref="calendar"
|
|||
|
|
:insert="false"
|
|||
|
|
@confirm="confirm"
|
|||
|
|
>
|
|||
|
|
</uni-calendar>
|
|||
|
|
<uni-calendar
|
|||
|
|
ref="calendar2"
|
|||
|
|
:insert="false"
|
|||
|
|
@confirm="confirm2"
|
|||
|
|
>
|
|||
|
|
</uni-calendar>
|
|||
|
|
<load-more v-show="currentTabIndex == 1 || currentTabIndex == 2"
|
|||
|
|
:loadingType="loadingType" :contentText="contentText"></load-more>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import uniCalendar from '@/components/uni-calendar/uni-calendar.vue';
|
|||
|
|
import {invite,getMyVisitorList,greenVisitorInfo} from '@/common/api.js';
|
|||
|
|
import {callbackRequest,alertTip,getStorage} from '@/common/util.js';
|
|||
|
|
import loadMore from '@/components/loadMore.vue';
|
|||
|
|
import datetimePicker from '@/components/dateTime.vue';
|
|||
|
|
import contentNone from '@/components/contentNone.vue';
|
|||
|
|
let currentTime = new Date().getTime();
|
|||
|
|
let millisecond = 24 * 7 * 60 * 60 * 1000;
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
userId:getStorage('userInfo').userId,
|
|||
|
|
currentTabIndex:0,
|
|||
|
|
page:1,
|
|||
|
|
page2:1,
|
|||
|
|
pageSize:5,
|
|||
|
|
deptList: ['本部大楼', '银座'],
|
|||
|
|
departmentIndex: 0, //选择的地点下标
|
|||
|
|
num:[{}],
|
|||
|
|
button_text:"提交预约",
|
|||
|
|
number:0,
|
|||
|
|
role:2,//管理员
|
|||
|
|
list:[],
|
|||
|
|
list2:[],
|
|||
|
|
visitPlace:"0",
|
|||
|
|
visitedPersonName:getStorage('userInfo').username,
|
|||
|
|
visitedPersonTel:getStorage('userInfo').telnumber,
|
|||
|
|
visitStartTime:"",
|
|||
|
|
visitEndTime:"",
|
|||
|
|
visitReason:"",
|
|||
|
|
|
|||
|
|
zhu_visitorName:"",
|
|||
|
|
zhu_visitorTel:"",
|
|||
|
|
zhu_idcard:"",
|
|||
|
|
loadingType:0,//0-loading前；1-loading中；2-没有更多了
|
|||
|
|
contentText: {
|
|||
|
|
contentdown: "上拉加载更多",
|
|||
|
|
contentrefresh: "正在加载...",
|
|||
|
|
contentnomore: "没有更多数据了"
|
|||
|
|
},
|
|||
|
|
defaultMinDate: currentTime,// 最小时间
|
|||
|
|
minTime: '08:00',
|
|||
|
|
defaultMaxDate: new Date(currentTime+millisecond).getTime(),// 最大时间
|
|||
|
|
maxTime: '18:00',
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
components: {
|
|||
|
|
uniCalendar,
|
|||
|
|
loadMore,
|
|||
|
|
datetimePicker,
|
|||
|
|
contentNone
|
|||
|
|
},
|
|||
|
|
watch:{
|
|||
|
|
currentTabIndex:function(newVal,oldVal){
|
|||
|
|
this.currentTabIndex = newVal;
|
|||
|
|
if(this.currentTabIndex){
|
|||
|
|
this.page = 1;
|
|||
|
|
this.loadingType = 0;
|
|||
|
|
this.getMyList();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad(options) {
|
|||
|
|
// 审批授权 与 邀约记录 共用一个页面
|
|||
|
|
// 根据 页面传值 type 区分，显示默认页面
|
|||
|
|
if (options.type == 1) {
|
|||
|
|
this.currentTabIndex = 1
|
|||
|
|
} else if (options.type == 2) {
|
|||
|
|
this.currentTabIndex = 0;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
getMyList(newVal){
|
|||
|
|
let params = {
|
|||
|
|
"method": getMyVisitorList,
|
|||
|
|
"data": {userId:this.userId,type:'03',flag:this.currentTabIndex,pageSize:this.pageSize,page:this.page}
|
|||
|
|
};
|
|||
|
|
callbackRequest(params)
|
|||
|
|
.then(res =>{
|
|||
|
|
if(res.data.returnCode == 1){
|
|||
|
|
let result = res.data.returnData;
|
|||
|
|
if(this.page == 1){
|
|||
|
|
this.list = result;
|
|||
|
|
}else {
|
|||
|
|
if(result.length > 0){
|
|||
|
|
this.list = [...this.list,...result];
|
|||
|
|
this.loadingType = 0;
|
|||
|
|
}else {
|
|||
|
|
this.loadingType = 2;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
chooseDate(e){
|
|||
|
|
if(e.pickerIndex == 1){
|
|||
|
|
this.visitStartTime = e.time;
|
|||
|
|
}else {
|
|||
|
|
this.visitEndTime = e.time;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
changeDepartment(e) {
|
|||
|
|
// console.log(e)
|
|||
|
|
this.departmentIndex = e.detail.value;
|
|||
|
|
},
|
|||
|
|
toDetail(url){
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
confirm(e) {
|
|||
|
|
this.visitStartTime = e.fulldate;
|
|||
|
|
},
|
|||
|
|
confirm2(e) {
|
|||
|
|
this.visitEndTime = e.fulldate;
|
|||
|
|
},
|
|||
|
|
open(type){
|
|||
|
|
if(type == 1){
|
|||
|
|
this.$refs.calendar.open();
|
|||
|
|
}else{
|
|||
|
|
this.$refs.calendar2.open();
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
addBtn(){
|
|||
|
|
var o = {
|
|||
|
|
zvisitorName:"",
|
|||
|
|
visitorTel:"",
|
|||
|
|
idcard:"",
|
|||
|
|
flag:1
|
|||
|
|
}
|
|||
|
|
this.num.push(o);
|
|||
|
|
this.number++;
|
|||
|
|
},
|
|||
|
|
jianBtn(index){
|
|||
|
|
this.num[index].flag = 0;
|
|||
|
|
this.number--;
|
|||
|
|
},
|
|||
|
|
submit(){
|
|||
|
|
var data = {userId:this.userId};
|
|||
|
|
data.id = ""; data.visitedPersonId = "";
|
|||
|
|
//被访人信息
|
|||
|
|
data.stayArea = this.visitPlace;
|
|||
|
|
data.visitedPersonName = this.visitedPersonName; data.visitedPersonTel = this.visitedPersonTel;
|
|||
|
|
data.visitStartTime = this.visitStartTime; data.visitEndTime = this.visitEndTime;
|
|||
|
|
data.visitReason = this.visitReason;
|
|||
|
|
//主访客信息
|
|||
|
|
data.visitorName = this.zhu_visitorName;
|
|||
|
|
data.visitorTel = this.zhu_visitorTel;
|
|||
|
|
data.idcard = this.zhu_idcard;
|
|||
|
|
|
|||
|
|
data._status = "3";/*0待审批 1已同意 2已拒绝 3待本人确认*/
|
|||
|
|
data.creator = this.userId; data.modifier = this.userId;/*修改人*/
|
|||
|
|
// data.gmtCreated = "";/*创建时间*/
|
|||
|
|
// data.gmtModified = "";/*修改时间*/
|
|||
|
|
data.isDeleted = "N"; data.mxVirtualId = "";
|
|||
|
|
//验证数据
|
|||
|
|
if ((data.stayArea) == undefined || (data.stayArea+"").replace(/\s*/g,"") == ""
|
|||
|
|
|| (data.visitedPersonName) == undefined || (data.visitedPersonName+"").replace(/\s*/g,"") == ""
|
|||
|
|
|| (data.visitedPersonTel) == undefined || (data.visitedPersonTel+"").replace(/\s*/g,"") == "") {
|
|||
|
|
alertTip("访问人员地址、姓名、电话不能为空");
|
|||
|
|
return;
|
|||
|
|
};
|
|||
|
|
if ((data.visitStartTime) == undefined || (data.visitStartTime+"").replace(/\s*/g,"") == ""
|
|||
|
|
|| (data.visitEndTime) == undefined || (data.visitEndTime+"").replace(/\s*/g,"") == ""
|
|||
|
|
|| (data.visitReason) == undefined || (data.visitReason+"").replace(/\s*/g,"") == "") {
|
|||
|
|
alertTip("访问人员时间、理由不能为空！");
|
|||
|
|
return;
|
|||
|
|
};
|
|||
|
|
var curDate = new Date();
|
|||
|
|
var start = new Date(Date.parse(data.visitStartTime.replace(/-/g,"/")));
|
|||
|
|
var end = new Date(Date.parse(data.visitEndTime.replace(/-/g,"/")));
|
|||
|
|
if(start < curDate){
|
|||
|
|
alertTip("开始时间需大于现在时间");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if(end < start){
|
|||
|
|
alertTip("结束时间需大于开始时间");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if( start<start.setHours(8, 0, 0, 0) || end>end.setHours(18, 0, 0, 0)){
|
|||
|
|
alertTip("开始时间需在8点后，结束时间需在18点前");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if((start.setHours(0, 0, 0, 0) != end.setHours(0, 0, 0, 0))){
|
|||
|
|
alertTip("结束时间和开始时间必须为同一天");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if ((data.visitorName) == undefined || (data.visitorName+"").replace(/\s*/g,"") == ""
|
|||
|
|
|| (data.visitorTel) == undefined || (data.visitorTel+"").replace(/\s*/g,"") == "") {
|
|||
|
|
alertTip("访问人员姓名、手机号不能为空！");
|
|||
|
|
return;
|
|||
|
|
};
|
|||
|
|
//验证数据格式
|
|||
|
|
var reg = new RegExp("^[0-9]*$");
|
|||
|
|
var regex = /^1[3456789]\d{9}$/;
|
|||
|
|
// var regex = new RegExp("^((13[0-9])|(14[5,7,9])|(15[^4])|(18[0-9])|(17[0,1,3,5,6,7,8]))[0-9]{8}$");
|
|||
|
|
if (reg.test(data.visitorTel) === false
|
|||
|
|
|| regex.test(data.visitorTel) === false) {
|
|||
|
|
alertTip("访客手机号格式不正确");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if (reg.test(data.visitedPersonTel) === false
|
|||
|
|
|| regex.test(data.visitedPersonTel) === false) {
|
|||
|
|
alertTip("被访人手机号格式不正确");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if(data.visitedPersonName == data.visitorName && data.visitedPersonTel == data.visitedPersonTel){
|
|||
|
|
alertTip("被访人和访问人不可以为同一人！");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
var id=/^[1-9][0-9]{5}(19|20)[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|31)|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}([0-9]|x|X)$/;
|
|||
|
|
if (data.idcard && id.test(data.idcard) === false) {
|
|||
|
|
alertTip("访客身份证格式不正确");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
data.greenRetinueInfoList = new Array();
|
|||
|
|
if(this.num.length > 1){
|
|||
|
|
var j = 0;
|
|||
|
|
for(var i = 1; i < this.num.length;i++){
|
|||
|
|
if(this.num[i].flag == 1){
|
|||
|
|
var visitors = {};
|
|||
|
|
visitors.retinueName = this.num[i].visitorName;
|
|||
|
|
visitors.visitorTel = this.num[i].visitorTel;
|
|||
|
|
visitors.idcard = this.num[i].idcard;
|
|||
|
|
if ((visitors.retinueName) == undefined || (visitors.retinueName).replace(/\s*/g,"") == ""
|
|||
|
|
|| (visitors.visitorTel) == undefined || (visitors.visitorTel).replace(/\s*/g,"") == "") {
|
|||
|
|
alertTip("随从人员姓名、电话、身份证不能为空");
|
|||
|
|
return;
|
|||
|
|
};
|
|||
|
|
//验证数据格式
|
|||
|
|
if (reg.test(visitors.visitorTel) === false
|
|||
|
|
|| regex.test(visitors.visitorTel) === false) {
|
|||
|
|
alertTip("随从人手机号格式不正确");
|
|||
|
|
return;
|
|||
|
|
};
|
|||
|
|
if (visitors.idcard && id.test(visitors.idcard) === false) {
|
|||
|
|
alertTip("随从人员身份证格式不正确");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
data.greenRetinueInfoList[j++] = visitors;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
let params = {
|
|||
|
|
"method": invite,
|
|||
|
|
"data": data
|
|||
|
|
};
|
|||
|
|
console.log(data);
|
|||
|
|
callbackRequest(params)
|
|||
|
|
.then(res =>{
|
|||
|
|
// console.log(res);
|
|||
|
|
// console.log(res.data.returnMsg);
|
|||
|
|
alertTip(res.data.returnMsg);
|
|||
|
|
if("预约成功" == res.data.returnMsg){
|
|||
|
|
//刷新列表
|
|||
|
|
this.page = 1;
|
|||
|
|
this.list = [];
|
|||
|
|
this.visitStartTime = '';this.visitEndTime = '';
|
|||
|
|
this.visitReason = '';
|
|||
|
|
//主访客信息
|
|||
|
|
this.zhu_visitorName = '';
|
|||
|
|
this.zhu_visitorTel = '';
|
|||
|
|
this.zhu_idcard = '';
|
|||
|
|
this.num = [{}];
|
|||
|
|
setTimeout(_ => {
|
|||
|
|
this.currentTabIndex = 2;
|
|||
|
|
}, 2000)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
del(id,val,index){
|
|||
|
|
console.log(id,val);
|
|||
|
|
let params = {
|
|||
|
|
"method": greenVisitorInfo,// 申请的删除
|
|||
|
|
"data": {userId:this.userId,applyId:id,applyType:"3"}//分三种情况
|
|||
|
|
};
|
|||
|
|
callbackRequest(params)
|
|||
|
|
.then(res =>{
|
|||
|
|
// console.log(res);
|
|||
|
|
//刷新页面
|
|||
|
|
console.log(this.list2);
|
|||
|
|
if(res.data.returnMsg == "删除成功！"){
|
|||
|
|
if(val == 1){
|
|||
|
|
this.list.splice(index,1);
|
|||
|
|
console.log(this.list);
|
|||
|
|
}else{
|
|||
|
|
this.list2.splice(index,1);
|
|||
|
|
console.log(this.list2);
|
|||
|
|
}
|
|||
|
|
alertTip(res.data.returnMsg);
|
|||
|
|
}else{
|
|||
|
|
alertTip(res.data.returnMsg);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onReachBottom() {
|
|||
|
|
if (this.loadingType !== 0 || this.currentTabIndex == 0) {
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
this.loadingType = 1;
|
|||
|
|
this.page = this.page + 1;
|
|||
|
|
this.getMyList();
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
@import '@/static/css/common.scss';
|
|||
|
|
page{
|
|||
|
|
// background: #f8f8f8;
|
|||
|
|
}
|
|||
|
|
.container{
|
|||
|
|
position:relative;
|
|||
|
|
overflow:hidden;
|
|||
|
|
background: #f8f8f8;
|
|||
|
|
min-height:100vh;
|
|||
|
|
.banner-box{
|
|||
|
|
width:100%;
|
|||
|
|
height:240upx;
|
|||
|
|
position:absolute;
|
|||
|
|
top:0;
|
|||
|
|
left:0;
|
|||
|
|
image{
|
|||
|
|
width:100%;
|
|||
|
|
height:100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.main{
|
|||
|
|
margin:172upx 40upx 0;
|
|||
|
|
position:relative;
|
|||
|
|
z-index:10;
|
|||
|
|
.tab-box{
|
|||
|
|
overflow:hidden;
|
|||
|
|
border-radius:10upx 10upx 0 0;
|
|||
|
|
background: rgba(132,149,167,0.8);
|
|||
|
|
height:70upx;
|
|||
|
|
.tab-item{
|
|||
|
|
float:left;
|
|||
|
|
height:70upx;
|
|||
|
|
width:33.33%;
|
|||
|
|
font-size:30upx;
|
|||
|
|
color:#e5f6ff;
|
|||
|
|
text-align:center;
|
|||
|
|
line-height:70upx;
|
|||
|
|
}
|
|||
|
|
.active{
|
|||
|
|
background: #fff;
|
|||
|
|
color:#333;
|
|||
|
|
border-radius:10upx 10upx 0 0;
|
|||
|
|
font-weight:bold;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.form-box{
|
|||
|
|
padding:20upx 30upx 0upx;
|
|||
|
|
margin-bottom: 20upx;
|
|||
|
|
background: #fff;
|
|||
|
|
.form-item{
|
|||
|
|
overflow:hidden;
|
|||
|
|
border-bottom:1px solid #eee;
|
|||
|
|
padding:30upx 0;
|
|||
|
|
.label{
|
|||
|
|
float:left;
|
|||
|
|
width:150upx;
|
|||
|
|
font-size:28upx;
|
|||
|
|
color:#333;
|
|||
|
|
font-weight:bold;
|
|||
|
|
line-height:50upx;
|
|||
|
|
}
|
|||
|
|
.ipt-box{
|
|||
|
|
margin-left:160upx;
|
|||
|
|
input{
|
|||
|
|
width:100%;
|
|||
|
|
height:50upx;
|
|||
|
|
line-height:50upx;
|
|||
|
|
font-size:26upx;
|
|||
|
|
color:#666;
|
|||
|
|
}
|
|||
|
|
.pic{
|
|||
|
|
width:60upx;
|
|||
|
|
height:60upx;
|
|||
|
|
line-height: 80upx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.select{
|
|||
|
|
.arrow{
|
|||
|
|
float:right;
|
|||
|
|
width:16upx;
|
|||
|
|
height:29upx;
|
|||
|
|
margin-top:10upx;
|
|||
|
|
}
|
|||
|
|
input{
|
|||
|
|
width:70%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.jian{
|
|||
|
|
width: 50upx;
|
|||
|
|
height:50upx;
|
|||
|
|
margin-left: 280upx;
|
|||
|
|
}
|
|||
|
|
.select {
|
|||
|
|
.arrow {
|
|||
|
|
float: right;
|
|||
|
|
width: 16upx;
|
|||
|
|
height: 29upx;
|
|||
|
|
margin-top: 10upx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.picker {
|
|||
|
|
height: 50upx;
|
|||
|
|
line-height: 50upx;
|
|||
|
|
font-size: 26upx;
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.sure-btn{
|
|||
|
|
width:100%;
|
|||
|
|
height:80upx;
|
|||
|
|
font-size:28upx;
|
|||
|
|
color:#fff;
|
|||
|
|
text-align:center;
|
|||
|
|
line-height:80upx;
|
|||
|
|
border-radius:8upx;
|
|||
|
|
background: #0066CC;
|
|||
|
|
background:linear-gradient(to right, #ffc200,#ff9000);/*设置按钮为渐变颜色*/
|
|||
|
|
margin-top:50upx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.list-box{
|
|||
|
|
.list-item{
|
|||
|
|
background: #fff;
|
|||
|
|
margin-bottom:10upx;
|
|||
|
|
.title{
|
|||
|
|
border-bottom:1px solid #eee;
|
|||
|
|
padding:20upx 10upx;
|
|||
|
|
overflow:hidden;
|
|||
|
|
line-height:40upx;
|
|||
|
|
.line{
|
|||
|
|
display:inline-block;
|
|||
|
|
width:10upx;
|
|||
|
|
height:32upx;
|
|||
|
|
background: $assistColor;
|
|||
|
|
margin-top:4upx;
|
|||
|
|
}
|
|||
|
|
.text{
|
|||
|
|
display:inline-block;
|
|||
|
|
font-size:28upx;
|
|||
|
|
color:#444;
|
|||
|
|
font-weight:bold;
|
|||
|
|
margin-left:10upx;
|
|||
|
|
vertical-align:top;
|
|||
|
|
}
|
|||
|
|
.status{
|
|||
|
|
font-size:26upx;
|
|||
|
|
color:$assistColor;
|
|||
|
|
float:right;
|
|||
|
|
}
|
|||
|
|
.status1{
|
|||
|
|
font-size:26upx;
|
|||
|
|
color:#5063c3;
|
|||
|
|
float:right;
|
|||
|
|
}
|
|||
|
|
.status2{
|
|||
|
|
font-size:26upx;
|
|||
|
|
color:red;
|
|||
|
|
float:right;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.content{
|
|||
|
|
padding:10upx 20upx;
|
|||
|
|
// padding:10upx 10upx 60upx 10upx;
|
|||
|
|
.info-item{
|
|||
|
|
overflow: hidden;
|
|||
|
|
padding-bottom:10upx;
|
|||
|
|
.fl-text{
|
|||
|
|
float:left;
|
|||
|
|
font-size:26upx;
|
|||
|
|
color:#444;
|
|||
|
|
font-weight:bold;
|
|||
|
|
line-height:40upx;
|
|||
|
|
}
|
|||
|
|
.fr-text{
|
|||
|
|
float:right;
|
|||
|
|
font-size:26upx;
|
|||
|
|
color:#666;
|
|||
|
|
line-height:40upx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.comment-btn {
|
|||
|
|
float: right;
|
|||
|
|
font-size: 24upx;
|
|||
|
|
border-radius: 10upx;
|
|||
|
|
color: #fff;
|
|||
|
|
line-height: 50upx;
|
|||
|
|
text-align: center;
|
|||
|
|
min-width: 140upx;
|
|||
|
|
background-color: #00c277;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
#addbtn{
|
|||
|
|
height: 120upx;
|
|||
|
|
background-color: #FFFFFF;
|
|||
|
|
padding: 30upx;
|
|||
|
|
border-radius: 30upx;
|
|||
|
|
color: #333333;
|
|||
|
|
border-bottom: .033333rem solid #eee;
|
|||
|
|
align-items: center;
|
|||
|
|
position: relative;
|
|||
|
|
margin-top: 20upx;
|
|||
|
|
}
|
|||
|
|
.addbtn view text:nth-child(1){
|
|||
|
|
font-size: 32upx;
|
|||
|
|
margin-left: 220upx;
|
|||
|
|
color: #00c277;
|
|||
|
|
}
|
|||
|
|
.addbtn view text:nth-child(2){
|
|||
|
|
font-size: 32upx;
|
|||
|
|
margin-left: 180upx;
|
|||
|
|
color: #00c277;
|
|||
|
|
}
|
|||
|
|
.tips{
|
|||
|
|
font-size: 22upx;
|
|||
|
|
// margin-left: 80upx;
|
|||
|
|
margin-top: 20upx;
|
|||
|
|
}
|
|||
|
|
</style>
|