406 lines
9.9 KiB
Vue
406 lines
9.9 KiB
Vue
|
<template>
|
|||
|
|
<view class="container">
|
|||
|
|
<view class="interviewee">
|
|||
|
|
<view>
|
|||
|
|
<text class="input_left">到访地点</text>
|
|||
|
|
<input type="text" placeholder="无到访地点名" :value="place" disabled="true">
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<text class="input_left">申请状态</text>
|
|||
|
|
<input type="text" placeholder="无申请状态" :value="stateList[first_status]" disabled="true">
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<text class="input_left">被访人部门</text>
|
|||
|
|
<input type="text" placeholder="无申请部门" :value="dp" disabled="true">
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<text class="input_left">被访人姓名</text>
|
|||
|
|
<input type="text" placeholder="无被访人姓名" :value="person" disabled="true">
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<text class="input_left">手机号码</text>
|
|||
|
|
<input type="tel" placeholder="无被访人手机号码" :value="visited_person_tel" disabled="true">
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<text class="input_left">来访时间</text>
|
|||
|
|
<input type="tel" placeholder="无来访时间" :value="start" disabled="true">
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<text class="input_left">离开时间</text>
|
|||
|
|
<input type="tel" placeholder="无离开时间" :value="end" disabled="true">
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<text class="input_left">来访事由</text>
|
|||
|
|
<input type="text" placeholder="无来访事由" :value="reason" disabled="true">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 随行人员 -->
|
|||
|
|
<!-- <view id="visitor">
|
|||
|
|
<view class="visitor">
|
|||
|
|
<view>
|
|||
|
|
<text class="input_left">访客姓名</text>
|
|||
|
|
<input class="name" confirmtype="text" value="刘斌">
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<text class="input_left">身份证号</text>
|
|||
|
|
<input class="name" confirmtype="tel" value="342425990087673243"/>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
|
|||
|
|
<view id="visitor_2">
|
|||
|
|
<view class="visitor_2">
|
|||
|
|
<view class="visitor_2_text">
|
|||
|
|
<!-- <input class="name" confirmtype="text" value="刘斌">
|
|||
|
|
<input class="name" confirmtype="tel" value="342425990087673243"/> -->
|
|||
|
|
<view><text>姓 名:</text>{{person2}}</view>
|
|||
|
|
<view><text>手机号:</text>{{tel}}</view>
|
|||
|
|
<view><text>身份证:</text>{{idcard}}</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="pic">
|
|||
|
|
<image :src="picture" mode=""></image>
|
|||
|
|
</view> -->
|
|||
|
|
<view class="img-box">
|
|||
|
|
<view class="img-item" v-for="(item,index) in imgs" :key="index">
|
|||
|
|
<image class="remove-btn" v-if="first_status=='3'" @click="removeImg(index)" src="/static/icons/delete-icon.png" mode=""></image>
|
|||
|
|
<image class="img" :src="item" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
<view class="img-item upload-btn" @click="chooseImg()"
|
|||
|
|
v-if="imgs.length < 2 && first_status=='3'">
|
|||
|
|
<image class="img" src="/static/imgs/tianjia-img.png" mode=""></image>
|
|||
|
|
<view class="text">添加本人照片</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view id="visitor_2" v-if="retinueList.length > 0">
|
|||
|
|
<view class="visitor_2" v-for="(item,index) in retinueList" :key="index" >
|
|||
|
|
<!-- <view class="pic">
|
|||
|
|
<img src="../../static/IDpic1.png"></img>
|
|||
|
|
</view> -->
|
|||
|
|
<view class="visitor_2_text">
|
|||
|
|
<view><text>姓 名:</text>{{item.retinue_name}}</view>
|
|||
|
|
<view><text>手机号:</text>{{item.visitor_tel}}</view>
|
|||
|
|
<view><text>身份证:</text>{{item.idcard}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- <view id="result">
|
|||
|
|
<view class="ing">
|
|||
|
|
<i></i>
|
|||
|
|
<text>被拜访人：已同意 2019-11-28 19:36:24</text>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
<view style="clear: both;"></view>
|
|||
|
|
<view class="occupied"></view>
|
|||
|
|
<view class="footer-btn" @click="submit()" v-if="first_status=='3'">
|
|||
|
|
<view class="btn">确认</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="footer-btn footer-btn-two"
|
|||
|
|
v-if="first_status=='1'">
|
|||
|
|
<view class="btn btn-col" @click="submit(id,1)">拒绝</view>
|
|||
|
|
<view class="btn btn-col1" @click="submit(id,2)">同意</view>
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {getApplyInfo,greenVisitorInfo,visitorinvite} from '@/common/api.js';
|
|||
|
|
import {callbackRequest,alertTip,convertImgToBase64} from '@/common/util.js';
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
first_status:'',
|
|||
|
|
picture:'../../static/IDpic1.png',
|
|||
|
|
stateList: ['待审核', '已通过','已拒绝','待本人确认','已取消'],
|
|||
|
|
userId:'',
|
|||
|
|
id:'',//记录的id
|
|||
|
|
person:'',
|
|||
|
|
person2:'',
|
|||
|
|
place:'',
|
|||
|
|
tel:'',
|
|||
|
|
visited_person_tel:'',
|
|||
|
|
start:'',
|
|||
|
|
end:'',
|
|||
|
|
dp:'',
|
|||
|
|
reason:'',
|
|||
|
|
idcard:'',
|
|||
|
|
retinueList:[],
|
|||
|
|
imgs:[],
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad(options){
|
|||
|
|
this.id = options.id;
|
|||
|
|
this.userId = options.userId;
|
|||
|
|
this.reFresh(this.userId,this.id,"02");//必须是‘02’
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
reFresh(userId,id,type){
|
|||
|
|
var data = {userId:this.userId,id:id,applyType:type};
|
|||
|
|
let params = {
|
|||
|
|
"method": getApplyInfo,//根据id和申请类型查询申请详情
|
|||
|
|
"data": data
|
|||
|
|
};
|
|||
|
|
console.log(params);
|
|||
|
|
callbackRequest(params)
|
|||
|
|
.then(res =>{
|
|||
|
|
console.log(res);
|
|||
|
|
this.person = res.data.returnData[0].visited_person_name;
|
|||
|
|
this.person2 = res.data.returnData[0].visitor_name;
|
|||
|
|
this.place = res.data.returnData[0].visit_place;
|
|||
|
|
this.tel = res.data.returnData[0].visitor_tel;
|
|||
|
|
this.visited_person_tel = res.data.returnData[0].visited_person_tel;
|
|||
|
|
this.start = res.data.returnData[0].visit_start_time;
|
|||
|
|
this.end = res.data.returnData[0].visit_end_time;
|
|||
|
|
// this.dp = res.data.returnData[0].name;
|
|||
|
|
this.dp = res.data.returnData[0].dpid;
|
|||
|
|
this.reason = res.data.returnData[0].visit_reason;
|
|||
|
|
this.idcard = res.data.returnData[0].idcard;
|
|||
|
|
this.first_status = res.data.returnData[0].first_status;
|
|||
|
|
|
|||
|
|
if(res.data.returnData[0].picture1 != null && res.data.returnData[0].picture1 != ""){
|
|||
|
|
this.imgs[0] = res.data.returnData[0].picture1;
|
|||
|
|
if(res.data.returnData[0].picture2 != null && res.data.returnData[0].picture2 != ""){
|
|||
|
|
this.imgs[1] = res.data.returnData[0].picture2;
|
|||
|
|
}
|
|||
|
|
}else{
|
|||
|
|
if(res.data.returnData[0].picture2 != null && res.data.returnData[0].picture2 != ""){
|
|||
|
|
this.imgs[0] = res.data.returnData[0].picture2;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
this.retinueList = res.data.returnData[1].greenRetinueInfoList;
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
submit(){
|
|||
|
|
var data = {userId:this.userId};
|
|||
|
|
data.idcardPic1 = this.imgs[0]; data.idcardPic2 = this.imgs[1];
|
|||
|
|
if(!data.idcardPic1 && !data.idcardPic2){
|
|||
|
|
alertTip("请至少上传一张图片！");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
data.id = this.id;
|
|||
|
|
let params = {
|
|||
|
|
"method": visitorinvite,
|
|||
|
|
"data": data
|
|||
|
|
};
|
|||
|
|
var self = this;
|
|||
|
|
uni.showModal({
|
|||
|
|
title: '提示',
|
|||
|
|
content: '是否确认提交',
|
|||
|
|
success: function(res){
|
|||
|
|
if (res.confirm) {
|
|||
|
|
callbackRequest(params)
|
|||
|
|
.then(res =>{
|
|||
|
|
console.log(res);
|
|||
|
|
alertTip(res.data.returnMsg);
|
|||
|
|
//刷新页面
|
|||
|
|
self.reFresh(self.userId,self.id,"02");
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
//主访客上传图片
|
|||
|
|
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.imgs.push(base64)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
//删除图片
|
|||
|
|
removeImg(index){
|
|||
|
|
this.imgs.splice(index,1);
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
@import '@/static/css/common.scss';
|
|||
|
|
.container{
|
|||
|
|
min-height:100vh;
|
|||
|
|
background: #f5f5f5;
|
|||
|
|
overflow:hidden;
|
|||
|
|
}
|
|||
|
|
.interviewee{
|
|||
|
|
padding: 0upx 30upx 0;
|
|||
|
|
background: #fff;
|
|||
|
|
margin:30rpx 30rpx 0;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
.input_left{
|
|||
|
|
width: 150rpx;
|
|||
|
|
color: #333333;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.interviewee view{
|
|||
|
|
line-height: 40rpx;
|
|||
|
|
padding:20rpx 0;
|
|||
|
|
color: #333333;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
border-bottom: 1px solid #eee;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
.interviewee view:last-child{
|
|||
|
|
border-bottom:0px;
|
|||
|
|
}
|
|||
|
|
.interviewee view input{
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
margin-left: 20rpx;
|
|||
|
|
}
|
|||
|
|
.visitor_2{
|
|||
|
|
margin:20rpx 30rpx 20rpx;
|
|||
|
|
background: #ffffff;
|
|||
|
|
border-radius:10upx;
|
|||
|
|
}
|
|||
|
|
.visitor_2{
|
|||
|
|
border-radius: 15upx;
|
|||
|
|
padding:30rpx 30rpx;
|
|||
|
|
overflow:hidden;
|
|||
|
|
}
|
|||
|
|
.visitor_2 .pic{
|
|||
|
|
padding-top:20rpx;
|
|||
|
|
}
|
|||
|
|
.visitor_2 image{
|
|||
|
|
width: 180rpx;
|
|||
|
|
height:180rpx;
|
|||
|
|
vertical-align:top;
|
|||
|
|
margin-right:20rpx;
|
|||
|
|
}
|
|||
|
|
.visitor_2_text{
|
|||
|
|
// margin-left: 170upx;
|
|||
|
|
padding:0rpx 0;
|
|||
|
|
view{
|
|||
|
|
font-size: 28upx;
|
|||
|
|
color:#666;
|
|||
|
|
line-height:40rpx;
|
|||
|
|
text{
|
|||
|
|
display: inline-block;
|
|||
|
|
width:110rpx;
|
|||
|
|
text-align:right;
|
|||
|
|
padding-right:10rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #333;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.visitor_2 .mar-none{
|
|||
|
|
margin-left:0;
|
|||
|
|
}
|
|||
|
|
.img-box{
|
|||
|
|
overflow:hidden;
|
|||
|
|
padding-top:25upx;
|
|||
|
|
.img-item{
|
|||
|
|
float:left;
|
|||
|
|
width:200upx;
|
|||
|
|
height:200upx;
|
|||
|
|
border:1px solid #ddd;
|
|||
|
|
margin:0 20upx 0upx 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;
|
|||
|
|
margin:0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.upload-btn{
|
|||
|
|
.img{
|
|||
|
|
width:60upx;
|
|||
|
|
height:60upx;
|
|||
|
|
margin:40upx auto 0;
|
|||
|
|
}
|
|||
|
|
.text{
|
|||
|
|
font-size:28upx;
|
|||
|
|
color:#999;
|
|||
|
|
text-align:center;
|
|||
|
|
line-height:40upx;
|
|||
|
|
padding-top:10rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
/* 已同意 */
|
|||
|
|
|
|||
|
|
#result .ing {
|
|||
|
|
background: #ffffff;
|
|||
|
|
height: 2.2rem;
|
|||
|
|
line-height: 1.2rem;
|
|||
|
|
border-radius: .133333rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#result .ing i {
|
|||
|
|
width: .566667rem;
|
|||
|
|
height: .566667rem;
|
|||
|
|
border: .033333rem solid #00c277;
|
|||
|
|
display: inline-block;
|
|||
|
|
margin-left: .8rem;
|
|||
|
|
margin-right: .24rem;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
margin-top: .9rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#result .ing text {
|
|||
|
|
color: #00c277;
|
|||
|
|
font-size: .745333rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.submit{
|
|||
|
|
width: 100%;
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 20upx;
|
|||
|
|
/* bottom: 0upx; */
|
|||
|
|
height:80upx;
|
|||
|
|
display: inline;
|
|||
|
|
background-color: #00C277;
|
|||
|
|
}
|
|||
|
|
button{
|
|||
|
|
font-size: 38upx;
|
|||
|
|
font_weight: bold;
|
|||
|
|
height:80upx;
|
|||
|
|
}
|
|||
|
|
.submit_button{
|
|||
|
|
width: 100%;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
background-color: #00C277;
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.btn_refuse{
|
|||
|
|
width: 50%;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
background-color: red;
|
|||
|
|
margin: 0;
|
|||
|
|
}
|
|||
|
|
.btn_agree{
|
|||
|
|
width: 50%;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
background-color: #00C277;
|
|||
|
|
margin-left: 50%;
|
|||
|
|
margin-top: -80upx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
</style>
|