1177 lines
36 KiB
Vue
1177 lines
36 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 == 3" src="/static/imgs/visitor.png" mode=""></image>
|
||
<!-- <image v-if="currentTabIndex == 4" 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 == 3 ? 'active' : ''" @click="currentTabIndex = 3">预约记录</view>
|
||
<!-- <view class="tab-item" :class="currentTabIndex == 4 ? 'active' : ''" @click="currentTabIndex = 4">被邀记录</view> -->
|
||
</view>
|
||
<!-- 访客预约表单 -->
|
||
<view v-if="currentTabIndex == 0">
|
||
<view class="form-box" >
|
||
<!-- <view class="form-item">
|
||
<text class="label">到访地点</text>
|
||
<view class="ipt-box select">
|
||
<image class="arrow" src="/static/icons/right-arrow.png" mode=""></image>
|
||
<picker class="picker" v-if="deptList.length > 0" :range="deptList" @change="changeDepartment" range-key="name">
|
||
<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 select">
|
||
<image class="arrow" src="/static/icons/right-arrow.png" mode=""></image>
|
||
<picker class="picker" v-if="deptmentList.length > 0" :range="deptmentList" @change="changeDepartment1" range-key="name">
|
||
<view>{{ deptmentList[deptmentListIndex].name }}</view>
|
||
</picker>
|
||
</view>
|
||
</view>
|
||
<view class="form-item">
|
||
<text class="label">手机号码</text>
|
||
<view class="ipt-box">
|
||
<input type="text" placeholder="请填写手机号码" v-model="visitedPersonTel" maxlength="11">
|
||
</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"
|
||
:value="defaultBeginTime"
|
||
@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"
|
||
:value="defaultEndTime"
|
||
@getData="chooseDate" :type="'anyTime'">
|
||
</datetime-Picker>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="form-item">
|
||
<text class="label">是否有车</text>
|
||
<view class="ipt-box">
|
||
<radio-group @change="radioChangeCar">
|
||
<label class="radio" style="margin-right: 20upx;font-size: 26upx;" v-for="(item, index) in itemsCar" :key="item.value" >
|
||
<radio style="" :value="item.value" :checked="index == isCar" />
|
||
{{item.name}}
|
||
</label>
|
||
</radio-group>
|
||
</view>
|
||
</view> -->
|
||
<view class="form-item" >
|
||
<text class="label">车牌号码</text>
|
||
<view class="ipt-box">
|
||
<input type="text" placeholder="若有车辆请填写车牌号码" v-model="licensePlate" maxlength="7">
|
||
</view>
|
||
</view>
|
||
<view class="form-item">
|
||
<text class="label">来访类型</text>
|
||
<view class="ipt-box">
|
||
<radio-group @change="radioChange">
|
||
<label class="radio" style="margin-right: 20upx;font-size: 26upx;" v-for="(item, index) in items" :key="item.value" >
|
||
<radio style="" :value="item.value" :checked="index === appointmentType" />
|
||
{{item.name}}
|
||
<!-- <view>
|
||
<radio :value="item.value" :checked="index === current" />
|
||
</view>
|
||
<view>{{item.name}}</view> -->
|
||
</label>
|
||
</radio-group>
|
||
</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 type="text" placeholder="请填写来访人单位" v-model="zhu_orgName">
|
||
</view>
|
||
</view>
|
||
<view class="form-item">
|
||
<text class="label">手机号</text>
|
||
<view class="ipt-box">
|
||
<input class="name" type="tel" v-model="zhu_visitorTel" placeholder="请填写访客手机号" maxlength="11"/>
|
||
</view>
|
||
</view>
|
||
<view class="form-item">
|
||
<text class="label">身份证号</text>
|
||
<view class="ipt-box" style="position: relative;">
|
||
<input class="name" type="text" v-model="zhu_idcard" placeholder="请填写访客身份证号" maxlength="18"/>
|
||
<view v-if="identityAuth==''" style='color: red;position: absolute;right: 20upx;bottom: 6upx;font-weight: bold;'><text style="font-size: 26upx;">未认证</text></view>
|
||
<view v-if="identityAuth=='1'" style='color:green ;position:absolute;right: 20upx;bottom: 6upx;font-weight: bold;'><text style="font-size: 26upx;">已认证</text></view>
|
||
<view v-if="identityAuth=='0'" style='color: #ff9000;position: absolute;right: 20upx;bottom: 6upx;font-weight: bold;'><text style="font-size: 26upx;">认证中</text></view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="form-item upload-box">
|
||
<text class="label">面部图片</text>
|
||
<view class="img-box">
|
||
<view class="img-item" v-for="(item,index) in imgs" :key="index">
|
||
<image class="remove-btn" @click="removeImg(index)" src="/static/icons/delete-icon.png" mode=""></image>
|
||
<image class="img" :src="item" mode="" id="image"></image>
|
||
</view>
|
||
<view class="img-item upload-btn" @click="chooseImg()" v-if="imgs.length < 1">
|
||
<image class="img" src="/static/imgs/tianjia-img.png" mode=""></image>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="form-item upload-box">
|
||
<text class="label">身份证正反面照片</text>
|
||
<view class="img-box">
|
||
<view class="img-item" v-for="(item,index) in idCard_imgs" :key="index">
|
||
<image class="remove-btn" @click="removeIdCardImg(index)" src="/static/icons/delete-icon.png" mode=""></image>
|
||
<image class="img" :src="item" mode=""></image>
|
||
</view>
|
||
<view class="img-item upload-btn" @click="idCard_chooseImg()" v-if="idCard_imgs.length < 2">
|
||
<image class="img" src="/static/imgs/tianjia-img.png" mode=""></image>
|
||
</view>
|
||
</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" maxlength="11" type="tel" v-model="item.visitorTel" placeholder="请填写访客手机号" />
|
||
</view>
|
||
</view>
|
||
<view class="form-item">
|
||
<text class="label">身份证号</text>
|
||
<view class="ipt-box">
|
||
<input class="name" maxlength='18' type="text" v-model="item.idcard" placeholder="请填写访客身份证号" />
|
||
</view>
|
||
</view>
|
||
|
||
<view class="form-item" v-if="number>0">
|
||
<!-- v-if="num.length>1" -->
|
||
<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">
|
||
<text @click="addBtn()">+ 新增人员</text>
|
||
<!-- <text>历史记录</text> -->
|
||
</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 == 3">
|
||
<view class="list-item" v-for="(item,index) in list" :key="index"
|
||
@click='toDetail("/pages/visitorAppointment/visitorAppointment?id="+item.detail_id+"&role=1&userId="+userId)'>
|
||
<view class="title">
|
||
<text class="line"></text>
|
||
<text class="text">预约记录</text>
|
||
<text class="status2" v-if="item.current_status.charAt(item.current_status.length-1)==0">待审核</text>
|
||
<text class="status" v-if="item.current_status.charAt(item.current_status.length-1)==1">已通过</text>
|
||
<text class="status1" v-if="item.current_status.charAt(item.current_status.length-1)==2">已拒绝</text>
|
||
<text class="status1" v-if="item.current_status.charAt(item.current_status.length-1)==3">待本人确认</text>
|
||
<text class="status1" v-if="item.current_status.charAt(item.current_status.length-1)==4">已取消</text>
|
||
<!-- <text class="status1" v-if="item.first_status==6">待审核（身份认证中）</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,3,index)">删除</view> -->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 预约记录列表 -->
|
||
<view class="list-box" v-if="currentTabIndex == 4">
|
||
<view class="list-item" v-for="(item,index) in list" :key="index"
|
||
@click='toDetail("/pages/visitorInvited/visitorInvited?id="+item.detail_id+"&userId="+userId)'>
|
||
<view class="title">
|
||
<text class="line"></text>
|
||
<text class="text">被邀记录</text>
|
||
<text class="status2" v-if="item.current_status.charAt(item.current_status.length-1)==0">待审核</text>
|
||
<text class="status" v-if="item.current_status==1">已同意</text>
|
||
<text class="status1" v-if="item.current_status==2">已拒绝</text>
|
||
<text class="status1" v-if="item.current_status==3">待本人确认</text>
|
||
<text class="status1" v-if="item.current_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,4,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 == 3 || currentTabIndex == 4"
|
||
:loadingType="loadingType" :contentText="contentText"></load-more>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import uniCalendar from '@/components/uni-calendar/uni-calendar.vue';
|
||
import {invite,getMyVisitorList,greenVisitorInfo,getOrargs,getAllDept} from '@/common/api.js';
|
||
import {callbackRequest,convertImgToBase64,alertTip,getStorage,formatDate,setStorage,devEnv} from '@/common/util.js';
|
||
import loadMore from '@/components/loadMore.vue';
|
||
import contentNone from '@/components/contentNone.vue';
|
||
import datetimePicker from '@/components/dateTime.vue';
|
||
import xflSelect from '@/components/xfl-select/xfl-select.vue'
|
||
//import test from '@/js_sdk/leiqch-exif/exif/exif.js'
|
||
let currentTime = new Date().getTime();
|
||
let millisecond = 24 * 7 * 60 * 60 * 1000; // 七天
|
||
let tenMin = 10 * 60 * 1000; // 十分钟
|
||
let twoHtenMin = 2*60 * 60 * 1000 +tenMin; // 两小时十分钟
|
||
export default {
|
||
|
||
data() {
|
||
return {
|
||
userId:getStorage('userInfo').userId,//登录用户id
|
||
selectedTime:"",
|
||
currentTabIndex:0,
|
||
page:1,
|
||
page3:1,
|
||
page4:1,
|
||
pageSize:5,
|
||
deptList: ['科技楼', '物业楼'],
|
||
departmentIndex: 0, //选择的地点下标
|
||
deptmentList: [{name:"请选择..."}], //部门列表
|
||
deptmentListIndex:0,
|
||
num:[{}],
|
||
number:0,
|
||
button_text:"提交预约",
|
||
role:1,
|
||
list:[],
|
||
list2:[],
|
||
|
||
orgName:'',
|
||
visitPlace:"0",
|
||
visitedPersonName:"",
|
||
visitedPersonTel:"",
|
||
visitStartTime:"",
|
||
visitEndTime:"",
|
||
visitReason:"",
|
||
|
||
zhu_visitorName:getStorage('userInfo').username,
|
||
zhu_visitorTel:getStorage('userInfo').telnumber,
|
||
zhu_idcard:getStorage('userInfo').idnumber,
|
||
zhu_orgName:getStorage('userInfo').orgName,
|
||
imgs:[],//用户上传的图片
|
||
identityAuth:getStorage('userInfo').identityAuth,
|
||
idCard_imgs:[],
|
||
loadingType:0,//0-loading前；1-loading中；2-没有更多了
|
||
loadingType2:0,//0-loading前；1-loading中；2-没有更多了
|
||
contentText: {
|
||
contentdown: "上拉加载更多",
|
||
contentrefresh: "正在加载...",
|
||
contentnomore: "没有更多数据了"
|
||
},
|
||
defaultMinDate: currentTime,// 最小时间
|
||
minTime: '00:00',
|
||
defaultMaxDate: new Date(currentTime+millisecond).getTime(),// 最大时间
|
||
maxTime: '24:00',
|
||
defaultBeginTime: formatDate(currentTime+tenMin,'mTime'), // 默认来访时间
|
||
defaultEndTime: formatDate(currentTime+twoHtenMin,'mTime'), // 默认结束时间
|
||
list_dep:[],
|
||
finalList:[],
|
||
showList:false,
|
||
submitFlag:true,
|
||
items: [{
|
||
value: '0',
|
||
name: '普通访客',
|
||
checked: 'true'
|
||
},
|
||
{
|
||
value: '1',
|
||
name: '参会人员',
|
||
},
|
||
|
||
],
|
||
appointmentType:0,
|
||
itemsCar: [{
|
||
value: '0',
|
||
name: '无车辆 ',
|
||
checked: 'true'
|
||
},
|
||
{
|
||
value: '1',
|
||
name: '有车辆',
|
||
},
|
||
|
||
],
|
||
isCar:0,
|
||
licensePlate:'',
|
||
|
||
}
|
||
},
|
||
components: {
|
||
uniCalendar,
|
||
loadMore,
|
||
datetimePicker,
|
||
contentNone,
|
||
xflSelect
|
||
},
|
||
created() {
|
||
var param = getStorage('userInfo').face_Pic1;
|
||
|
||
if(param!=""){
|
||
this.imgs.push(param);
|
||
// var p1 = param.split(":80")[1];
|
||
// p1="http://zhhq.cdzywpt.cn:80"+p1;
|
||
// //param.replace("http://47.99.190.179:80/","http://zhhq.cdzywpt.cn/");
|
||
// convertImgToBase64(p1, function(base64) {
|
||
// console.log(base64);
|
||
// this.imgs.push(base64)
|
||
// });
|
||
}
|
||
},
|
||
onLoad() {
|
||
this.getDepartment();
|
||
//生产环境下，增加返回监听事件，首页点击返回，退出页面
|
||
/*if(!devEnv){
|
||
window.addEventListener("popstate", function(e) { //回调函数中实现需要的功能
|
||
// alert("我监听到了浏览器的返回按钮事件啦");
|
||
WeixinJSBridge.call('closeWindow');
|
||
}, false);
|
||
}*/
|
||
|
||
|
||
},
|
||
|
||
watch:{
|
||
currentTabIndex:function(newVal,oldVal){
|
||
this.currentTabIndex = newVal;
|
||
if(this.currentTabIndex){
|
||
this.page = 1;
|
||
this.loadingType = 0;
|
||
this.getMyList();
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
radioChange: function(evt) {
|
||
for (let i = 0; i < this.items.length; i++) {
|
||
if (this.items[i].value === evt.target.value) {
|
||
|
||
this.appointmentType = i;
|
||
//this.uinfo.isInner = this.items[this.current].value;
|
||
break;
|
||
}
|
||
}
|
||
|
||
},
|
||
radioChangeCar:function(evt){
|
||
for (let i = 0; i < this.itemsCar.length; i++) {
|
||
if (this.items[i].value === evt.target.value) {
|
||
|
||
this.isCar = i;
|
||
//this.uinfo.isInner = this.items[this.current].value;
|
||
break;
|
||
}
|
||
}
|
||
},
|
||
changeDepartment(e) {
|
||
this.departmentIndex = e.detail.value;
|
||
},
|
||
changeDepartment1(e) {
|
||
this.deptmentListIndex = e.detail.value;
|
||
},
|
||
getMyList(){
|
||
var data = {userId:this.userId,type:'03',flag:this.currentTabIndex,page:this.page,pageSize:this.pageSize};
|
||
let params = {
|
||
"method": getMyVisitorList,
|
||
"data": data
|
||
};
|
||
console.log(" === ", data.userId);
|
||
callbackRequest(params)
|
||
.then(res =>{
|
||
if(res.data.returnCode == 1){
|
||
let result = res.data.returnData;
|
||
console.log(' -- ',result);
|
||
if(this.page == 1){
|
||
this.list = result;
|
||
if(result.length > 0){
|
||
var identityAuth = result[0].identityAuth;
|
||
var userInfo = getStorage('userInfo');
|
||
userInfo.identityAuth = identityAuth;
|
||
setStorage('userInfo',userInfo);
|
||
this.identityAuth = getStorage('userInfo').identityAuth;
|
||
}
|
||
}else {
|
||
if(result.length > 0){
|
||
this.list = [...this.list,result];
|
||
this.loadingType = 0;
|
||
}else {
|
||
this.loadingType = 2;
|
||
}
|
||
}
|
||
}else {
|
||
alertTip(res.data.returnMsg);
|
||
}
|
||
})
|
||
},
|
||
|
||
chooseDate(e){
|
||
if(e.pickerIndex == 1){
|
||
this.defaultBeginTime = e.time;
|
||
}else {
|
||
this.defaultEndTime = e.time;
|
||
}
|
||
},
|
||
toDetail(url){
|
||
uni.navigateTo({
|
||
url
|
||
})
|
||
},
|
||
inputSel(e){
|
||
// this.uinfo.orgName = e.detail.value;
|
||
var finalList = [];
|
||
for (var i = 0; i < this.list.length; i++) {
|
||
let ite = this.list[i];
|
||
// 包含某一字符串
|
||
if(ite.indexOf(e.detail.value) !== -1){
|
||
finalList = finalList.concat(ite);
|
||
}
|
||
}
|
||
this.finalList = finalList;
|
||
this.showList = true;
|
||
},
|
||
changeSel(newVal,oldVal,index,orignItem){
|
||
this.uinfo.orgName = newVal;
|
||
},
|
||
confirm(e) {
|
||
this.selectedTime = e.fulldate;
|
||
},
|
||
open(type){
|
||
if(type == 1){
|
||
this.$refs.calendar.open();
|
||
}else{
|
||
this.$refs.calendar2.open();
|
||
}
|
||
},
|
||
addBtn(){
|
||
// var o = {flag:1}
|
||
// this.num.push(o);
|
||
// this.number++;
|
||
var o = {
|
||
zvisitorName:"",
|
||
visitorTel:"",
|
||
idcard:"",
|
||
flag:1
|
||
}
|
||
this.num.push(o);
|
||
this.number++;
|
||
},
|
||
jianBtn(index){
|
||
this.num[index].flag = 0;
|
||
this.number--;
|
||
},
|
||
getDepartment() {
|
||
let data = {
|
||
method: getAllDept,
|
||
data: {}
|
||
};
|
||
callbackRequest(data).then(res => {
|
||
if (res.data.returnCode == 1) {
|
||
// console.log("---",res.data.returnData);
|
||
this.deptmentList = this.deptmentList.concat(res.data.returnData);
|
||
}
|
||
});
|
||
},
|
||
submit(){
|
||
|
||
var data = {userId:this.userId};
|
||
data.id = ""; data.visitedPersonId = "";
|
||
data.visitPlace = this.departmentIndex + 1;
|
||
data.stayArea = this.visitPlace;
|
||
data.visitedPersonName = this.visitedPersonName; data.visitedPersonTel = this.visitedPersonTel;
|
||
data.visitStartTime = this.defaultBeginTime; data.visitEndTime = this.defaultEndTime;
|
||
|
||
data.visitReason = this.visitReason;
|
||
//主访客信息
|
||
data.visitorName = this.zhu_visitorName;
|
||
data.visitorTel = this.zhu_visitorTel;
|
||
data.idcard = this.zhu_idcard;
|
||
data.orgName = this.zhu_orgName;
|
||
|
||
data.idcardPic1 = this.idCard_imgs[0]; data.idcardPic2 = this.idCard_imgs[1];
|
||
data.facePic1 = this.imgs[0];data.facePic2 = this.imgs[1];
|
||
|
||
data._status = "0";/*0待审批 1已同意 2已拒绝 3待本人确认*/
|
||
data.creator = this.userId; data.modifier = this.userId;/*修改人*/
|
||
// data.gmtCreated = "";/*创建时间*/
|
||
// data.gmtModified = "";/*修改时间*/
|
||
data.isDeleted = "N"; data.mxVirtualId = "";
|
||
data.visitedDeptName = this.deptmentList[this.deptmentListIndex].name;
|
||
data.appointmentType = this.appointmentType+"";
|
||
data.isCar = this.isCar+'';
|
||
data.licensePlate = this.licensePlate;
|
||
console.log("name:",data.visitedDeptName);
|
||
if(!data.visitedPersonName){
|
||
alertTip("请填写被访人姓名");
|
||
return
|
||
}
|
||
if(!data.visitedDeptName||data.visitedDeptName=='请选择...'){
|
||
alertTip("请选择被访人部门");
|
||
return
|
||
}
|
||
if(!data.visitedPersonTel){
|
||
alertTip("请填写被访人手机号码");
|
||
return
|
||
}
|
||
var reg = new RegExp("^[0-9]*$");
|
||
var regex = /^1[3456789]\d{9}$/;
|
||
|
||
if (reg.test(data.visitedPersonTel) === false
|
||
|| regex.test(data.visitedPersonTel) === false) {
|
||
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.setHours(0, 0, 0, 0) != end.setHours(0, 0, 0, 0))){
|
||
alertTip("结束时间和拜访时间必须为同一天");
|
||
return;
|
||
}
|
||
var licensePlateReg = new RegExp(/^(([\u4eac\u6d25\u6caa\u6e1d\u5180\u8c6b\u4e91\u8fbd\u9ed1\u6e58\u7696\u9c81\u65b0\u82cf\u6d59\u8d63\u9102\u6842\u7518\u664b\u8499\u9655\u5409\u95fd\u8d35\u7ca4\u9752\u85cf\u5ddd\u5b81\u743c\u4f7f\u9886][A-Z](([0-9]{6}[DF])|([DF]([A-HJ-NP-Z0-9])[0-9]{4})))|([\u4eac\u6d25\u6caa\u6e1d\u5180\u8c6b\u4e91\u8fbd\u9ed1\u6e58\u7696\u9c81\u65b0\u82cf\u6d59\u8d63\u9102\u6842\u7518\u664b\u8499\u9655\u5409\u95fd\u8d35\u7ca4\u9752\u85cf\u5ddd\u5b81\u743c\u4f7f\u9886][A-Z][A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9\u6302\u5b66\u8b66\u6e2f\u6fb3\u4f7f\u9886]))$/);;
|
||
// if(data.isCar==1 ){
|
||
if(!data.licensePlate==""){
|
||
//alertTip("请输入车牌号");
|
||
//return
|
||
data.isCar="1";
|
||
if (licensePlateReg.test(data.licensePlate) === false) {
|
||
alertTip("车牌号格式不正确");
|
||
return;
|
||
}
|
||
}else{
|
||
data.isCar="0";
|
||
}
|
||
|
||
// }else{
|
||
// data.licensePlate='';
|
||
// }
|
||
|
||
if(!data.visitReason){
|
||
alertTip("请填写来访事由");
|
||
return
|
||
}
|
||
|
||
if(!data.visitorName){
|
||
alertTip("请填写访客姓名");
|
||
return
|
||
}
|
||
if(!data.orgName){
|
||
alertTip("请填写访客单位");
|
||
return
|
||
}
|
||
if(!data.visitorTel){
|
||
alertTip("请填写访客手机号码");
|
||
return
|
||
}
|
||
if (reg.test(data.visitorTel) === false
|
||
|| regex.test(data.visitorTel) === false) {
|
||
alertTip("访客手机号格式不正确");
|
||
return;
|
||
}
|
||
if(!data.idcard){
|
||
alertTip("请填写身份证号");
|
||
return
|
||
}
|
||
//620103197805301516
|
||
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|30)|(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;
|
||
}
|
||
if(data.visitedPersonName == data.visitorName && data.visitedPersonTel == data.visitedPersonTel){
|
||
alertTip("被访人和访问人不可以为同一人！");
|
||
return;
|
||
}
|
||
|
||
if(!data.facePic1 && !data.facePic2){
|
||
alertTip("请上传一张面部图片！");
|
||
return;
|
||
}
|
||
|
||
data.greenRetinueInfoList = new Array();
|
||
if(this.num.length > 1){
|
||
var j = 0;
|
||
var reg = new RegExp("^[0-9]*$");
|
||
var regex = /^1[3456789]\d{9}$/;
|
||
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|30)|(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)$/;
|
||
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,"") == ""){
|
||
alertTip("请输入随从人员姓名");
|
||
return;
|
||
}
|
||
if((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) == undefined || (visitors.idcard).replace(/\s*/g,"") == ""){
|
||
alertTip("请输入随从人员身份证号");
|
||
return;
|
||
}
|
||
|
||
if (visitors.idcard && id.test(visitors.idcard) === false) {
|
||
alertTip("随从人员身份证格式不正确");
|
||
return;
|
||
}
|
||
data.greenRetinueInfoList[j++] = visitors;
|
||
}
|
||
}
|
||
}
|
||
data.visitStartTime = data.visitStartTime.replace(/\//g,'-');
|
||
data.visitEndTime = data.visitEndTime.replace(/\//g,'-');
|
||
console.log(data);
|
||
//data.orgName = this.orgName;
|
||
let params = {
|
||
"method": invite,
|
||
"data": data
|
||
};
|
||
// console.log(this.submitFlag);
|
||
if(!this.submitFlag){
|
||
return;
|
||
}
|
||
// console.log("console.log(submitFlag)");
|
||
this.submitFlag=false;
|
||
callbackRequest(params)
|
||
.then(res =>{
|
||
if (res.data.returnCode == 1){
|
||
alertTip(res.data.returnMsg);
|
||
|
||
//刷新列表
|
||
this.list = [];
|
||
this.page3 = 1;
|
||
this.list2 = [];
|
||
this.visitedPersonName = '';
|
||
this.visitedPersonTel = '';
|
||
this.visitReason = '';
|
||
setTimeout(_ => {
|
||
this.currentTabIndex = 3;
|
||
}, 2000)
|
||
this.submitFlag = true;
|
||
} else {
|
||
alertTip(res.data.returnMsg);
|
||
this.submitFlag = true;
|
||
}
|
||
|
||
})
|
||
},
|
||
//主访客上传图片
|
||
chooseImg(){
|
||
let _this = this;
|
||
uni.chooseImage({
|
||
count:2,
|
||
success:res => {
|
||
let param = "";
|
||
let imgArr = res.tempFilePaths
|
||
for (var i = 0; i < imgArr.length; i++) {
|
||
param = imgArr[i];
|
||
//convertImgToBase64(param, function(base64) {
|
||
var EXIF=require('@/js_sdk/leiqch-exif/exif/exif.js');
|
||
var image = new Image();
|
||
image.onload = function() {
|
||
EXIF.getData(image, function() {
|
||
_this.resetOrientation(param,EXIF.getTag(this, 'Orientation'),function(base64Correct){
|
||
_this.imgs.push(base64Correct)
|
||
});
|
||
});
|
||
};
|
||
image.src = param;
|
||
//})
|
||
}
|
||
}
|
||
|
||
})
|
||
},
|
||
resetOrientation(srcBase64, srcOrientation, callback) {
|
||
var img = new Image();
|
||
img.onload = function() {
|
||
var width = img.width,
|
||
height = img.height,
|
||
canvas = document.createElement('canvas'),
|
||
ctx = canvas.getContext("2d");
|
||
var maxWidth = 300,
|
||
maxHeight = 300;
|
||
if (width > maxWidth || height > maxHeight) {
|
||
if (width / height > maxWidth / maxHeight) {
|
||
maxHeight = Math.round(maxWidth * (height / width));
|
||
} else {
|
||
maxWidth = Math.round(maxHeight * (width / height));
|
||
}
|
||
} else {
|
||
maxWidth = width;
|
||
maxHeight = height;
|
||
}
|
||
if ([5,6,7,8].indexOf(srcOrientation) > -1) {
|
||
canvas.width = maxHeight;
|
||
canvas.height = maxWidth;
|
||
} else {
|
||
canvas.width = maxWidth;
|
||
canvas.height = maxHeight;
|
||
}
|
||
switch (srcOrientation) {
|
||
case 2: ctx.transform(-1, 0, 0, 1, maxWidth, 0); break;
|
||
case 3: ctx.transform(-1, 0, 0, -1, maxWidth, maxHeight ); break;
|
||
case 4: ctx.transform(1, 0, 0, -1, 0, maxHeight ); break;
|
||
case 5: ctx.transform(0, 1, 1, 0, 0, 0); break;
|
||
case 6: ctx.transform(0, 1, -1, 0, maxHeight , 0); break;
|
||
case 7: ctx.transform(0, -1, -1, 0, maxHeight , maxWidth); break;
|
||
case 8: ctx.transform(0, -1, 1, 0, 0, maxWidth); break;
|
||
default: ctx.transform(1, 0, 0, 1, 0, 0);
|
||
}
|
||
ctx.drawImage(img, 0, 0,maxWidth,maxHeight);
|
||
callback(canvas.toDataURL('image/jpeg'));
|
||
};
|
||
img.src = srcBase64;
|
||
},
|
||
idCard_chooseImg(){
|
||
let _this = this;
|
||
uni.chooseImage({
|
||
count:2,
|
||
success:res => {
|
||
let param = "";
|
||
let imgArr = res.tempFilePaths
|
||
for (var i = 0; i < imgArr.length; i++) {
|
||
param = imgArr[i];
|
||
convertImgToBase64(param, function(base64) {
|
||
_this.idCard_imgs.push(base64)
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
//删除图片
|
||
removeImg(index){
|
||
this.imgs.splice(index,1);
|
||
},
|
||
removeIdCardImg(index){
|
||
this.idCard_imgs.splice(index,1);
|
||
},
|
||
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);
|
||
//刷新页面
|
||
if(res.data.returnMsg == "删除成功！"){
|
||
if(val == 3){
|
||
this.list.splice(index,1);
|
||
}else{
|
||
this.list2.splice(index,1);
|
||
}
|
||
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:50%;
|
||
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;
|
||
}
|
||
}
|
||
}
|
||
.upload-box{
|
||
.label{
|
||
float:none;
|
||
}
|
||
.img-box{
|
||
overflow:hidden;
|
||
padding-top:25upx;
|
||
.img-item{
|
||
float:left;
|
||
width:210upx;
|
||
height:210upx;
|
||
border:1px solid #ddd;
|
||
margin:0 20upx 20upx 0upx;
|
||
position:relative;
|
||
.img{
|
||
display:block;
|
||
width:100%;
|
||
height:100%;
|
||
}
|
||
.remove-btn{
|
||
position:absolute;
|
||
top:-18upx;
|
||
right:-18upx;
|
||
width:44upx;
|
||
height:44upx;
|
||
z-index:2;
|
||
}
|
||
}
|
||
.upload-btn{
|
||
.img{
|
||
width:60upx;
|
||
height:60upx;
|
||
margin:75upx auto 0;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
.form-box .form-item:last-child{
|
||
border-bottom:0px;
|
||
}
|
||
.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: 100upx;
|
||
background-color: #FFFFFF;
|
||
border-radius: 20upx;
|
||
color: #333333;
|
||
position: relative;
|
||
margin-top: 20upx;
|
||
line-height:100upx;
|
||
text-align:center;
|
||
text{
|
||
font-size: 38upx;
|
||
color: #00c277;
|
||
}
|
||
}
|
||
.addbtn view text:nth-child(1){
|
||
font-size: 38upx;
|
||
color: #00c277;
|
||
}
|
||
.addbtn view text:nth-child(2){
|
||
font-size: 32upx;
|
||
color: #00c277;
|
||
}
|
||
.tips{
|
||
font-size: 22upx;
|
||
// margin-left: 80upx;
|
||
margin-top: 20upx;
|
||
}
|
||
</style>
|