hz-zhhq-app/pages/house/house.vue

1515 lines
43 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="hzIndex">
<hzHeader title="租房申请"></hzHeader>
<view class="hzContent">
<view class="main">
<view class="tab-box">
<view class="tab-item" :class="currentTabIndex == 0 ? 'active' : ''" @click="currentTabIndex = 0">存量房申请<view class="activeLine" v-if="currentTabIndex == 0"></view></view>
<view class="tab-item" :class="currentTabIndex == 1 ? 'active' : ''" @click="currentTabIndex = 1">申请记录<view class="activeLine" v-if="currentTabIndex == 1"></view></view>
</view>
</view>
<view class="content" v-if="currentTabIndex == 0" style="position: relative;">
<view class="interviewee">
<view class="form-box" style="border-radius: 10upx;">
<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="userTypes.length > 0" :range="userTypes" @change="changeUserType" range-key="name">
<view>{{ userTypes[userTypeIndex].name }}</view>
</picker>
</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="houseType.length > 0" :range="houseType" @change="changeHouseType" range-key="name">
<view>{{ houseType[houseTypeIndex].name }}</view>
</picker>
</view>
</view>
<view v-show="houseApply.userType==2">
<view class="form-item" >
<text class="label"><text style="color: red;">*</text>住房申请人:</text>
<view class="ipt-box"><input class="top-t" v-model="houseApply.userName" placeholder="请输入姓名" type="text" maxlength="15"/></view>
</view>
<view class="form-item" >
<text class="label"><text style="color: red;">*</text>所在部门:</text>
<view class="ipt-box"><input class="top-t" v-model="houseApply.orgName" placeholder="请输入部门" type="text" maxlength="15"/></view>
</view>
<view class="form-item">
<text class="label"><text style="color: red;">*</text>工作岗位:</text>
<view class="ipt-box"><input class="top-t" v-model="houseApply.position" placeholder="请输入工作岗位" type="text" maxlength="18" /></view>
</view>
<view class="form-item" >
<text class="label"><text style="color: red;">*</text>联系方式:</text>
<view class="ipt-box"><input class="top-t" v-model="houseApply.phone" placeholder="请输入联系方式" type="text" maxlength="11"/></view>
</view>
</view>
<view v-show="houseApply.userType==3">
<view class="form-item" >
<text class="label"><text style="color: red;">*</text>住房申请人:</text>
<view class="ipt-box"><input class="top-t" v-model="houseApply.userName" placeholder="请输入姓名" type="text" maxlength="15"/></view>
</view>
<view class="form-item" >
<text class="label"><text style="color: red;">*</text>联系方式:</text>
<view class="ipt-box"><input class="top-t" v-model="houseApply.phone" placeholder="请输入联系方式" type="text" maxlength="11"/></view>
</view>
</view>
<view class="form-item" v-show="houseApply.userType==1||houseApply.userType==2">
<text class="label"><text style="color: red;">*</text>婚姻状况:</text>
<view class="ipt-box select">
<radio-group @change="changeMarriageState" style="display: flex;justify-content: flex-start;align-items: center">
<label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in marriageStates" :key="item.id" style="font-size: 26upx;display: flex;justify-content: flex-start;align-items: center;margin-right: 40upx;min-width: 140upx;">
<view>
<radio color="#4db4ea" :value="item.id" :checked="item.id ==houseApply.marriageState"/>
</view>
<view>{{item.name}}</view>
</label>
</radio-group>
</view>
</view>
<!-- 房查照片 -->
<view v-if="houseApply.userType==1||houseApply.userType==2">
<view style="margin: 20upx;"><text style="font-size: 28upx;font-weight: bold;"><text style="color: red;">*</text>房查照片(如已婚需要夫妻双方上传房查信息)</text></view>
<view style="font-size: 20upx;margin-left: 40upx;"><text>房查网址:</text><text style="color: #0078B8;margin-left: 20upx;" @longpress="copyText" @click="copyText">http://202.103.39.35:9081</text> </view>
<view class="pic" style="border-bottom: 1px solid #eee;">
<view class="img-box">
<view class="img-item" v-for="(item, index) in imgs1" :key="index">
<image class="remove-btn" @click="removeImg(index)" src="/static/icons/delete-icon.png"
mode=""></image>
<image class="img" :src="item.replace(/[\r\n]/g,'')" mode=""></image>
</view>
<view class="img-item upload-btn" @click="chooseImg()" v-if="imgs1.length < 2">
<image class="img" src="/static/imgs/tianjia-img.png" mode=""></image>
</view>
</view>
</view>
<view style="font-size: 24rpx;font-weight: 600;color: red;border-bottom: 1px solid #eee;padding: 0 20rpx;">互联网信息系统严禁存储、传输、处理涉及国家秘密企业秘密以及敏感信息,违者将严肃问责追责!</view>
</view>
<!-- 身份证复印件 -->
<view>
<view style="margin: 20upx;"><text style="font-size: 28upx;font-weight: bold;"><text style="color: red;">*</text>身份证复印件(正反面):</text></view>
<view class="pic" style="border-bottom: 1px solid #eee;">
<view class="img-box">
<view class="img-item" v-for="(item, index) in imgs2" :key="index">
<image class="remove-btn" @click="removeImg2(index)" src="/static/icons/delete-icon.png"
mode=""></image>
<image class="img" :src="item.replace(/[\r\n]/g,'')" mode=""></image>
</view>
<view class="img-item upload-btn" @click="chooseImg2()" v-if="imgs2.length < 2">
<image class="img" src="/static/imgs/tianjia-img.png" mode=""></image>
</view>
</view>
</view>
<view style="font-size: 24rpx;font-weight: 600;color: red;border-bottom: 1px solid #eee;padding: 0 20rpx;">互联网信息系统严禁存储、传输、处理涉及国家秘密企业秘密以及敏感信息,违者将严肃问责追责!</view>
</view>
<!-- 附件 -->
<view v-if="houseApply.userType==3">
<view style="margin: 20upx;"><text style="font-size: 28upx;font-weight: bold;">附件:</text></view>
<view class="pic" style="border-bottom: 1px solid #eee;">
<view class="img-box">
<view class="img-item" v-for="(item, index) in imgs3" :key="index">
<image class="remove-btn" @click="removeImg3(index)" src="/static/icons/delete-icon.png"
mode=""></image>
<image class="img" :src="item.replace(/[\r\n]/g,'')" mode=""></image>
</view>
<view class="img-item upload-btn" @click="chooseImg3()" v-if="imgs3.length < 2">
<image class="img" src="/static/imgs/tianjia-img.png" mode=""></image>
</view>
</view>
</view>
<view style="font-size: 24rpx;font-weight: 600;color: red;border-bottom: 1px solid #eee;padding: 0 20rpx;">互联网信息系统严禁存储、传输、处理涉及国家秘密企业秘密以及敏感信息,违者将严肃问责追责!</view>
</view>
<view class="radio" v-if="houseApply.userType==1||houseApply.userType==2">
<view class="r-div">
<text class="input_left">申请事由</text>
</view>
<view class="" style="border-top:0.5px solid #eeeeee;">
<view style="width: 100%;height: 200upx;margin: 20upx;color: #666;text-align: left;font-size: 26upx;">
<textarea maxlength="150" style="width: 90%;font-size: 26upx;height: 160upx;" placeholder-style="font-size:28upx" v-model="houseApply.applyCause" placeholder="请输入申请事由"/>
</view>
</view>
</view>
<!-- <view class="form-item" v-if="houseApply.userType==2">
<text class="label"><text style="color: red;">*</text>分配房源: </text>
<text class="infoSpan" @click="houseSelect" style="color:aquamarine;">{{ chosenHouse }}</text>
</view> -->
<!-- <view class="info-item" v-if="examineBatch>=3||item.houseId">
<text class="label">租金: </text>
<text class="infoSpan" v-if="!item.houseId">{{ chosenHouseCost }}元</text>
<text class="infoSpan" v-if="item.houseId">{{ item.rent }}元</text>
</view> -->
</view>
<view class="form-box" style="border-radius: 10upx;">
</view>
</view>
<view class="occupied"></view>
<view class="footer-btn" @click="submit"><view class="btn">提交</view></view>
</view>
<!-- 检查列表 -->
<view v-if="currentTabIndex == 1" style="position: relative;">
<view class="list-content" v-if="reportList.length > 0">
<view class="details" v-for="(item, i) in reportList" :key="i" >
<view class="detail_header" @click="details(item)">
<!-- <text class="blueSign"></text> -->
<image src="/static/img/houseIcon.png" mode="" style="width: 35upx;height: 40upx;margin-left: 20upx;vertical-align: middle;"></image>
<text class="font-tilte">存量房申请</text>
<text v-if="item.examineState ==0&&item.examineBatch==1" class="statusred" style="color: #ff9000;background-color: #FFEFE3;" >待审核</text>
<text v-if="item.examineState ==0&&item.examineBatch>1" class="statusred" style="color: #ff9000;background-color: #FFEFE3;" >审核中</text>
<text v-if="item.examineState ==1&&item.isUpload!='2'" class="statusred" style="color: #ff9000;background-color: #FFEFE3;">审核中</text>
<text v-if="item.examineState ==1&&item.isUpload=='2'" class="statusred" style="color: #ff9000;background-color: #FFEFE3;">待上传合同</text>
<text v-if="item.examineState ==2" class="statusred" style="color: #BD1515;background-color: #F6DFDF;">已拒绝</text>
<!-- <text v-if="item.examineState ==3" class="statusred" style="color: #0DB0A7;background-color: #C1EFEA;">已选房</text> -->
<text v-if="item.examineState ==4" class="statusred" style="color: #ff9000;background-color: #FFEFE3;">退租待审核</text>
<text v-if="item.examineState ==5" class="statusred" style="color: #0DB0A7;background-color: #C1EFEA;">已退租</text>
<text v-if="item.examineState ==6" class="statusred" style="color: #BD1515;background-color: #F6DFDF;">退租未通过</text>
<text v-if="item.examineState ==7" class="statusred" style="color: #0DB0A7;background-color: #C1EFEA;">已入住</text>
</view>
<view class="detail_msg">
<view class="info-item" @click="details(item)">
<text>申请房型:</text>
<text class="infoSpan">{{formatHouseType(item.houseType)}}</text>
</view>
<view class="info-item" @click="details(item)">
<text>申请时间:</text>
<text class="infoSpan">{{ formatDate(item.applyTime,'dateTime')}}</text>
</view>
<!-- <view class="info-item" style="width: 100%;text-align: center;" @click="details(item)">
<text style="width: 100%;color: #4db4ea;">点击查看详情及回复</text>
</view> -->
<!-- <view class="comment-btn" v-if="item.examineBatch ==4 && !item.contractState" @click="houseSelect(item.id,item.houseType)">在线选房</view> -->
<view class="comment-btn" v-if="item.examineState ==7" @click="goSelectedHouse(item)">选房信息</view>
<view style="background-color:#FEB952 ;" class="comment-btn " v-if="item.examineState ==7|| item.examineState ==6" @click="houseCheckOut(item)">退租</view>
</view>
</view>
</view>
<content-none v-else :padTop="20"></content-none>
</view>
</view>
<load-more v-if="currentTabIndex == 1" :loadingType="loadingType" :contentText="contentText"></load-more>
</view>
</template>
<script>
import { greenHouseApply ,getUserTypeByRole,getHouseTypeByRole,greenHousePage,houseCheckOut,greenHouseExamine,houseTypeList,getHouseTypes } from '@/common/api.js';
import { callbackRequest,callbackRequestNoLoading, getStorage, alertTip, convertImgToBase64, formatDate,wxSdk,uploadImg } from '@/common/util.js';
import loadMore from '@/components/loadMore.vue';
import contentNone from '@/components/contentNone.vue';
export default {
components: {
loadMore,
contentNone
},
data() {
return {
formatDate: formatDate,
//分页
page: 1,
pageSize: 10,
loadingType: 0, //0-loading前1-loading中2-没有更多了
contentText: {
contentdown: '上拉加载更多',
contentrefresh: '正在加载...',
contentnomore: '没有更多数据了'
},
currentTabIndex:0,
genders: [{ id: '男', name: '男' }, { id: '女', name: '女' }],
marriageStates: [{ id: '未婚', name: '未婚' }, { id: '已婚', name: '已婚' },{ id: '其他', name: '其他' }],//,{ id: '离婚', name: '离婚' }, { id: '丧偶', name: '丧偶' }
userTypes:[],
houseTypeList:[],
userTypeIndex:0,
houseType:[],
houseTypeIndex:0,
houseApply:{
// userId: getStorage('userInfo').userId,
// orgId: getStorage('userInfo').department_id,
// userName: getStorage('userInfo').userName,
// phone: getStorage('userInfo').mobile,
// orgName: getStorage('userInfo').departmentName,
userId: "",
orgId: "",
userName: "",
phone: "",
orgName: "",
marriageState: "未婚",
position: '',
userType: '',
houseType: '',
applyCause: ''
},
reportType:0,
reportList:[],
imgs1: [],//房查照片
imgsId1: [],
imgs2: [],//身份证照片
imgsId2: [],
imgs3: [],//附件
imgsId3: [],
showAlert:false,
submitFlag:true,
chosenHouse:'请选择房源>',
houseInfo:{},
};
},
watch: {
currentTabIndex: function(newVal, oldVal) {
if (newVal ==1) {
this.page = 1;
this.loadingType = 0;
this.dataList();
}else{
}
}
},
onLoad(option) {
this.currentTabIndex = option.currentTabIndex || 0;
//this.faultType = option.faultType || 0;
this.getHouseTypes('houseType');
this.getUserType();
},
onShow() {
if (this.currentTabIndex == 0) {
}else{
this.page = 1;
this.loadingType = 0;
this.dataList();
}
},
methods: {
copyText(){
uni.setClipboardData({
data: JSON.stringify("http://202.103.39.35:9081"),
success: function () {
uni.showToast({
title: '复制成功',
icon: "none"
});
},
fail:(error)=> {
uni.showToast({
title: '复制失败',
icon: "none"
});
console.log('失败',error);
}
});
},
//申请列表
dataList() {
let params = {
method: greenHousePage,
data: {
userId:getStorage('userInfo').userId,
pageNum: this.page,
pageSize: this.pageSize,
}
};
callbackRequest(params).then(res => {
res = res.data;
if (res.returnCode == 1) {
if (this.page == 1) {
this.reportList = res.returnData || [];
} else {
if (res.returnData.length > 0) {
this.reportList = this.reportList.concat(res.returnData);
this.loadingType = 0;
} else {
this.loadingType = 2;
}
}
} else {
alertTip(res.returnMsg);
}
});
},
//提交申请
submit() {
if(this.submitFlag){
this.submitFlag = false;
var regexPhone=/^1[3-9]\d{9}$/;
//外部人员 选房信息
// if (this.houseApply.userType==2) {
// if (JSON.stringify(this.houseInfo) == "{}") {
// alertTip('请先选择房源');
// this.submitFlag = true;
// return false;
// }
// this.houseApply.houseId = this.houseInfo.UUID;
// }
if (this.houseApply.userType==1){
if (!this.houseApply.marriageState) {
alertTip('请选择婚姻状况');
this.submitFlag = true;
return false;
}
if (this.imgsId1.length==0) {
alertTip('请选择房查照片');
this.submitFlag = true;
return false;
}
if (this.houseApply.marriageState=='已婚') {
if (this.imgsId1.length==1) {
alertTip('已婚需要上传夫妻双方房查照片');
this.submitFlag = true;
return false;
}
}
if (this.imgsId2.length==0) {
alertTip('请选择身份证照片');
this.submitFlag = true;
return false;
}
if (this.imgsId2.length!=2) {
alertTip('需要上传身份证正反两面照片');
this.submitFlag = true;
return false;
}
this.houseApply.userId = getStorage('userInfo').userId,
this.houseApply.orgId = getStorage('userInfo').department_id,
this.houseApply.userName = getStorage('userInfo').userName,
this.houseApply.phone = getStorage('userInfo').mobile,
this.houseApply.orgName = getStorage('userInfo').departmentName,
//房查照片
this.houseApply.roomInspection=this.imgsId1.toString();
//身份证照片
}else if(this.houseApply.userType==2){
if (!this.houseApply.userName) {
alertTip('请输入姓名');
this.submitFlag = true;
return false;
}
if (!this.houseApply.phone) {
alertTip('请输入联系方式');
this.submitFlag = true;
return false;
}
if(!regexPhone.test(this.houseApply.phone)){
alertTip('请确认联系方式手机号是否正确');
this.submitFlag = true;
return false;
}
if (!this.houseApply.orgName) {
alertTip('请输入部门');
this.submitFlag = true;
return false;
}
if (!this.houseApply.position) {
alertTip('请输入工作岗位');
this.submitFlag = true;
return false;
}
if (!this.houseApply.marriageState) {
alertTip('请选择婚姻状况');
this.submitFlag = true;
return false;
}
if (this.imgsId1.length==0) {
alertTip('请选择房查照片');
this.submitFlag = true;
return false;
}
if (this.houseApply.marriageState=='已婚') {
if (this.imgsId1.length==1) {
alertTip('已婚需要上传夫妻双方房查照片');
this.submitFlag = true;
return false;
}
}
if (this.imgsId2.length==0) {
alertTip('请选择身份证照片');
this.submitFlag = true;
return false;
}
if (this.imgsId2.length!=2) {
alertTip('需要上传身份证正反两面照片');
this.submitFlag = true;
return false;
}
//房查照片
this.houseApply.roomInspection=this.imgsId1.toString();
//身份证照片
// this.houseApply. = this.imgsId2.toString();
}else if(this.houseApply.userType==3){
if (!this.houseApply.userName) {
alertTip('请输入姓名');
this.submitFlag = true;
return false;
}
if (!this.houseApply.phone) {
alertTip('请输入联系方式');
this.submitFlag = true;
return false;
}
if(!regexPhone.test(this.houseApply.phone)){
alertTip('请确认联系方式手机号是否正确');
this.submitFlag = true;
return false;
}
if (this.imgsId2.length==0) {
alertTip('请选择身份证照片');
this.submitFlag = true;
return false;
}
if (this.imgsId2.length!=2) {
alertTip('需要上传身份证正反两面照片');
this.submitFlag = true;
return false;
}
//身份证照片
// this.houseApply. = this.imgsId2.toString();
//附件
// this.houseApply. = this.imgsId3.toString();
}
let params = {
method: greenHouseApply,
data: this.houseApply
};
console.log(params)
callbackRequest(params).then(res => {
res = res.data;
if (res.returnCode == 1) {
this.submitFlag = true;
alertTip(res.returnMsg);
if(this.houseApply.userType==2){
//外部人员提交后走一次选房审批产生记录
setTimeout(_ => {
this.examine(res.returnData,this.houseApply.houseId)
}, 1000);
}
setTimeout(_ => {
this.houseApply.marriageState ='未婚';
this.houseApply.position ='';
this.houseApply.applyCause ='';
this.userTypeIndex = 0;
this.houseApply.userType = this.userTypes[this.userTypeIndex].id;
this.houseTypeIndex = 0;
this.houseApply.houseType = this.houseType[this.houseTypeIndex].id;
this.houseApply.userName=getStorage('userInfo').userName;
this.houseApply.phone=getStorage('userInfo').mobile;
this.houseApply.orgName=getStorage('userInfo').departmentName;
this.imgs1 = [];
this.imgsId1 = [];
this.imgs2 = [];
this.imgsId2 = [];
this.imgs3 = [];
this.imgsId3 = [];
this.houseInfo = {}
this.currentTabIndex = 1;
}, 2000);
} else {
this.submitFlag = true;
alertTip(res.returnMsg);
}
});
}
},
//婚姻 radio选择
changeMarriageState(e){
this.houseApply.marriageState = e.detail.value;
},
//人员类别 选择
changeUserType(e){
this.houseInfo = {}
this.chosenHouse='请选择房源>'
this.userTypeIndex = e.detail.value;
this.houseApply.userType = this.userTypes[this.userTypeIndex].id;
console.log(this.houseApply.userType)
setTimeout(()=>{
if(this.houseApply.userType==1){
this.houseApply.userName=getStorage('userInfo').userName
this.houseApply.phone=getStorage('userInfo').mobile
this.houseApply.orgName=getStorage('userInfo').departmentName
}
if(this.houseApply.userType==2){
this.houseApply.userName=''
this.houseApply.phone=''
this.houseApply.orgName=''
}
},500)
this.getHouseTypeByRole()
},
//房屋类型 选择
changeHouseType(e){
this.houseTypeIndex = e.detail.value;
this.houseApply.houseType = this.houseType[this.houseTypeIndex].id;
},
//人员类型
getUserType(dataType){
let params = {
method: getUserTypeByRole,
data: {
userId:getStorage('userInfo').userId,
roleId:getStorage('userInfo').role+'',
}
};
callbackRequestNoLoading(params).then(res => {
res = res.data;
if (res.returnCode == 1) {
this.userTypes = res.returnData || [];
this.houseApply.userType = this.userTypes[this.userTypeIndex].id;
this.getHouseTypeByRole()
} else {
}
});
},
//房型类别
getHouseTypeByRole(){
let params = {
method: getHouseTypeByRole,
data: {
userType:this.houseApply.userType,
userId:getStorage('userInfo').userId,
roleId:getStorage('userInfo').role+'',
}
};
callbackRequestNoLoading(params).then(res => {
res = res.data;
if (res.returnCode == 1) {
this.houseType = res.returnData || [];
this.houseApply.houseType = this.houseType[this.houseTypeIndex].id;
} else {
}
});
},
// 人员类别
getHouseTypes(dataType){
let params = {
method: getHouseTypes,
data: {
dataType:dataType,
userId:getStorage('userInfo').userId,
}
};
callbackRequestNoLoading(params).then(res => {
res = res.data;
if (res.returnCode == 1) {
if(dataType == 'houseType'){
this.houseTypeList = res.returnData || [];
}else{
this.houseTypeList = res.returnData || [];
}
} else {
}
});
},
//房型名称
formatHouseType(houseType){
// console.log(this.houseTypeList)
for(let i=0;i<this.houseTypeList.length;i++){
let obj = this.houseTypeList[i];
if(obj.id == houseType){
return obj.name;
}
}
},
//在线选房跳转
houseSelect(){
uni.navigateTo({
url: '/pages/house/house-select?houseType=' + this.houseApply.houseType
});
},
//申请详情跳转
details: function(item) {
uni.navigateTo({
url: '/pages/house/house-detail?id=' + item.id
});
},
//已选房间信息
goSelectedHouse(item){
uni.navigateTo({
url: '/pages/house/house-selected-house?applyId=' + item.id
});
},
//退租申请
houseCheckOut(item){
uni.showModal({
title: '确认',
content: '请确认是否退租',
showCancel: true,
cancelText: '取消',
confirmText: '确认',
success: res => {
if (res.confirm) {
let data = {
method: houseCheckOut,
data: {
userId:getStorage('userInfo').userId,
applyId: item.id,
status: '4',
houseId:item.houseId,
}
};
callbackRequest(data).then(res => {
res = res.data;
if (res.returnCode == 1) {
alertTip(res.returnMsg);
this.page = 1;
this.loadingType = 0;
this.dataList();
} else {
alertTip(res.returnMsg);
}
});
} else if (res.cancel) {
}
}
});
},
//通过同意
examine(applyId,houseId){
// console.log(applyId)
let params = {
"method": greenHouseExamine,
"data":{
applyId: applyId,
houseId: houseId,
userId:getStorage('userInfo').id,
userName:getStorage('userInfo').userName,
examineState:'1',
examineBatch:'2'
}
};
callbackRequest(params).then(res => {
res = res.data;
if (res.returnCode == 1) {
alertTip(res.returnMsg);
} else {
alertTip(res.returnMsg);
}
})
},
//房查照片
async chooseImg() {
let chec = 0;
let sty = [];
let _this = this;
uni.showActionSheet({
itemList: ['拍照', '相册'],
success: function(resp) {
chec = resp.tapIndex;
if (chec == 0) {
sty = ['camera']; //从相册相机选择
} else {
sty = ['album']; //从相册相机选择
}
uni.chooseImage({
count: 2,
sizeType: ['compressed'],
sourceType: sty,
quality: 1,
success: async function(res) {
let resData = res.tempFilePaths;
for (let i = 0; i < resData.length; i++) {
if (_this.imgs1.length > 2) {
break;
}
uni.getImageInfo({
src: resData[i],
success: async (path) => {
convertImgToBase64(path.path,
async function(base64) {
if (_this.imgs1.length < 2) {
// _this.imgs.push(base64);
uni.showLoading({
title: '图片上传中'
})
let blength = base64.length;
let glength = 7500;
console.log("base64:",base64)
if (blength <=
glength) {
let uploadParam = {
base64: base64,
userId: getStorage('userInfo').userId +i,
groupEnd: '1'
}
await uploadImg(uploadParam)
.then(
resu => {
resu =resu.data;
uni.hideLoading();
if (resu.returnCode !=1) {
alertTip(resu.returnMsg);
} else {
_this.imgs1.push(base64);
_this.imgsId1.push(resu.returnData +".jpg");
}
});
} else {
let fnum =parseInt(blength /glength);
for (let j =1; j <fnum +1; j++) {
if (j ==fnum) {
let groupBase =base64.slice((j -1) *glength);
console.log(groupBase.length,"groupBaselength");
let uploadParam = {
base64: groupBase,
userId: getStorage(
'userInfo'
)
.userId +
i,
groupEnd: '1'
}
await uploadImg
(
uploadParam)
.then(
resu => {
resu =
resu
.data;
if (resu
.returnCode ==
1
) {
_this
.imgs1
.push(
base64
);
_this
.imgsId1
.push(
resu
.returnData +
".jpg"
);
} else {
uni
.hideLoading();
alertTip
(resu
.returnMsg
);
return;
}
}
);
} else {
let groupBase =
base64
.slice(
(j -
1) *
glength,
glength *
j
);
let uploadParam = {
base64: groupBase,
userId: getStorage(
'userInfo'
)
.userId +
i,
groupEnd: '0'
}
await uploadImg
(
uploadParam)
.then(
resu => {
resu =
resu
.data;
if (resu
.returnCode ==
1
) {} else {
uni
.hideLoading();
alertTip
(resu
.returnMsg
);
return;
}
}
);
}
}
uni
.hideLoading();
}
}
});
},
});
}
}
});
},
fail: function(resp) {
console.log(resp.errMsg);
}
});
},
//删除房查照片
removeImg(index) {
this.imgs1.splice(index, 1);
this.imgsId1.splice(index, 1);
},
//身份证照片
async chooseImg2() {
let chec = 0;
let sty = [];
let _this = this;
uni.showActionSheet({
itemList: ['拍照', '相册'],
success: function(resp) {
chec = resp.tapIndex;
if (chec == 0) {
sty = ['camera']; //从相册相机选择
} else {
sty = ['album']; //从相册相机选择
}
uni.chooseImage({
count: 2,
sizeType: ['compressed'],
sourceType: sty,
quality: 1,
success: async function(res) {
let resData = res.tempFilePaths;
for (let i = 0; i < resData.length; i++) {
if (_this.imgs2.length > 2) {
break;
}
uni.getImageInfo({
src: resData[i],
success: async (path) => {
convertImgToBase64(path.path,
async function(base64) {
if (_this.imgs2.length < 2) {
// _this.imgs.push(base64);
uni.showLoading({
title: '图片上传中'
})
let blength = base64.length;
let glength = 7500;
console.log("base64:",base64)
if (blength <=
glength) {
let uploadParam = {
base64: base64,
userId: getStorage('userInfo').userId +i,
groupEnd: '1'
}
await uploadImg(uploadParam)
.then(
resu => {
resu =resu.data;
uni.hideLoading();
if (resu.returnCode !=1) {
alertTip(resu.returnMsg);
} else {
_this.imgs2.push(base64);
_this.imgsId2.push(resu.returnData +".jpg");
}
});
} else {
let fnum =parseInt(blength /glength);
for (let j =1; j <fnum +1; j++) {
if (j ==fnum) {
let groupBase =base64.slice((j -1) *glength);
console.log(groupBase.length,"groupBaselength");
let uploadParam = {
base64: groupBase,
userId: getStorage(
'userInfo'
)
.userId +
i,
groupEnd: '1'
}
await uploadImg
(
uploadParam)
.then(
resu => {
resu =
resu
.data;
if (resu
.returnCode ==
1
) {
_this
.imgs2
.push(
base64
);
_this
.imgsId2
.push(
resu
.returnData +
".jpg"
);
} else {
uni
.hideLoading();
alertTip
(resu
.returnMsg
);
return;
}
}
);
} else {
let groupBase =
base64
.slice(
(j -
1) *
glength,
glength *
j
);
let uploadParam = {
base64: groupBase,
userId: getStorage(
'userInfo'
)
.userId +
i,
groupEnd: '0'
}
await uploadImg
(
uploadParam)
.then(
resu => {
resu =
resu
.data;
if (resu
.returnCode ==
1
) {} else {
uni
.hideLoading();
alertTip
(resu
.returnMsg
);
return;
}
}
);
}
}
uni
.hideLoading();
}
}
});
},
});
}
}
});
},
fail: function(resp) {
console.log(resp.errMsg);
}
});
},
//删除身份证照片
removeImg2(index) {
this.imgs2.splice(index, 1);
this.imgsId2.splice(index, 1);
},
//附件照片
async chooseImg3() {
let chec = 0;
let sty = [];
let _this = this;
uni.showActionSheet({
itemList: ['拍照', '相册'],
success: function(resp) {
chec = resp.tapIndex;
if (chec == 0) {
sty = ['camera']; //从相册相机选择
} else {
sty = ['album']; //从相册相机选择
}
uni.chooseImage({
count: 2,
sizeType: ['compressed'],
sourceType: sty,
quality: 1,
success: async function(res) {
let resData = res.tempFilePaths;
for (let i = 0; i < resData.length; i++) {
if (_this.imgs3.length > 2) {
break;
}
uni.getImageInfo({
src: resData[i],
success: async (path) => {
convertImgToBase64(path.path,
async function(base64) {
if (_this.imgs3.length < 2) {
// _this.imgs.push(base64);
uni.showLoading({
title: '图片上传中'
})
let blength = base64.length;
let glength = 7500;
console.log("base64:",base64)
if (blength <=
glength) {
let uploadParam = {
base64: base64,
userId: getStorage('userInfo').userId +i,
groupEnd: '1'
}
await uploadImg(uploadParam)
.then(
resu => {
resu =resu.data;
uni.hideLoading();
if (resu.returnCode !=1) {
alertTip(resu.returnMsg);
} else {
_this.imgs3.push(base64);
_this.imgsId3.push(resu.returnData +".jpg");
}
});
} else {
let fnum =parseInt(blength /glength);
for (let j =1; j <fnum +1; j++) {
if (j ==fnum) {
let groupBase =base64.slice((j -1) *glength);
console.log(groupBase.length,"groupBaselength");
let uploadParam = {
base64: groupBase,
userId: getStorage(
'userInfo'
)
.userId +
i,
groupEnd: '1'
}
await uploadImg
(
uploadParam)
.then(
resu => {
resu =
resu
.data;
if (resu
.returnCode ==
1
) {
_this
.imgs3
.push(
base64
);
_this
.imgsId3
.push(
resu
.returnData +
".jpg"
);
} else {
uni
.hideLoading();
alertTip
(resu
.returnMsg
);
return;
}
}
);
} else {
let groupBase =
base64
.slice(
(j -
1) *
glength,
glength *
j
);
let uploadParam = {
base64: groupBase,
userId: getStorage(
'userInfo'
)
.userId +
i,
groupEnd: '0'
}
await uploadImg
(
uploadParam)
.then(
resu => {
resu =
resu
.data;
if (resu
.returnCode ==
1
) {} else {
uni
.hideLoading();
alertTip
(resu
.returnMsg
);
return;
}
}
);
}
}
uni
.hideLoading();
}
}
});
},
});
}
}
});
},
fail: function(resp) {
console.log(resp.errMsg);
}
});
},
//删除附件照片
removeImg3(index) {
this.imgs3.splice(index, 1);
this.imgsId3.splice(index, 1);
},
},
onReachBottom() {
if (this.loadingType !== 0 || this.currentTabIndex == 0) {
return;
}
this.loadingType = 1;
this.page = this.page + 1;
this.dataList();
},
};
</script>
<style lang="scss">
@import url('../../static/css/repair/malfunction-repair.css');
@import '@/static/css/common.scss';
.uni-textarea-textarea{
text-align:left
}
.nolist {
font-size: 30upx;
color: #797979;
text-align: center;
margin-top: 20upx;
}
.main {
margin: 180upx 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: 80upx;
.tab-item {
float: left;
height: 70upx;
width: 35%;
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;
}
.activeLine{
background: linear-gradient( 90deg, #50CBA1 0%, #06AEA6 100%), #5685F2;
border-radius: 10upx;
width: 80upx;
height: 10upx;
}
}
}
.list-content {
font-size: 28upx;
margin: 20upx;
.details {
background: white;
padding: 0 15upx 15upx;
border-radius: 20upx;
margin-bottom: 20upx;
.detail_header {
border-bottom: #f8f8f8 5upx solid;
height: 100upx;
line-height: 100upx;
// margin: 0;
// border-radius: 10upx;
.blueSign {
height: 28upx;
width: 5upx;
background: #00c277;
display: inline-block;
margin-left: 20upx;
vertical-align: middle;
}
.font-tilte {
font-weight: bold;
margin-left: 20upx;
vertical-align: middle;
}
}
.detail_msg {
margin-left: 20upx;
border-radius: 10upx;
overflow: hidden;
view {
height: 60upx;
line-height: 60upx;
}
.status {
position: absolute;
color: red;
margin-left: 580upx;
margin-top: -15upx;
}
}
}
}
.statusgr {
float: right;
margin-right: 30upx;
color: #00c277;
}
.statusred {
width: 180upx;
height: 60upx;
line-height: 60upx;
text-align: center;
border-radius: 50upx;
float: right;
margin-right: 30upx;
margin-top: 25upx;
}
.img-box {
overflow: hidden;
padding-top: 20rpx;
padding-bottom: 10rpx;
.img-item {
float: left;
width: 200upx;
height: 200upx;
border: 1px solid #ddd;
margin: 0 22rpx 20upx 0upx;
position: relative;
box-sizing: border-box;
.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: unset;
}
}
}
.detail_msg .info-item {
font-size: 28upx;
margin-right: 30upx;
text {
display: inline-block;
width: 140upx;
}
.infoSpan {
width: auto;
font-size: 28upx;
color: #666;
float: right;
}
}
.form-box {
background: #fff;
.form-item {
overflow: hidden;
border-bottom: 1px solid #eee;
padding: 30upx 20upx;
.label {
float: left;
width: 160upx;
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;
}
}
.select {
.arrow {
float: right;
width: 16upx;
height: 29upx;
margin-top: 10upx;
}
.picker {
height: 50upx;
line-height: 50upx;
font-size: 26upx;
color: #666;
margin-left: 10upx;
}
}
}
}
.comment-btn {
float: right;
font-size: 24upx;
border-radius: 10upx;
color: #fff;
// line-height: 30upx;
text-align: center;
min-width: 120upx;
margin-right: 30upx;
background-color: #00c277;
padding:0px 20upx
}
.common-shade{
position:fixed;
top:0;
left:0;
width:100%;
height:100vh;
background: rgba(0,0,0,0.7);
z-index:9999;
}
.box {
display: flex;
display: -webkit-flex;
}
.box-row-reverse {
flex-direction: row;
}
/*上下排列*/
.box-column {
flex-direction: column;
}
/*上下排列*/
.box-left {
justify-content: flex-start;
}
/*居右*/
.box-right {
justify-content: flex-end;
}
/*居左*/
.box-center {
justify-content: center;
}
/*居中*/
.box-between {
justify-content: space-between;
}
/*两端对齐*/
.box-align-center {
align-items: center;
}
.box-wrap {
flex-wrap: wrap;
}
</style>