|
|
@ -5,8 +5,14 @@ |
|
|
|
<u-form :model="form" ref="uForm" label-width="90"> |
|
|
|
<view class="info-card"> |
|
|
|
<u-form-item prop="idCard"> |
|
|
|
<u-input v-model="form.idCard" placeholder="请输入身份证号" border="none" input-align="left" |
|
|
|
suffixIcon="search" suffixIconStyle="color: #909399" @confirm="handleQuery" /> |
|
|
|
<u-search |
|
|
|
placeholder="请输入身份证号" |
|
|
|
v-model="form.idCard" |
|
|
|
shape="round" |
|
|
|
:showAction="false" |
|
|
|
@search="handleQuery" |
|
|
|
@clear="handleClear" |
|
|
|
></u-search> |
|
|
|
</u-form-item> |
|
|
|
</view> |
|
|
|
<view class="cont" v-if="showInfo"> |
|
|
@ -47,7 +53,12 @@ |
|
|
|
/> --> |
|
|
|
</u-form-item> |
|
|
|
<view style="border-bottom: 2rpx solid #e5e5e5; margin: 0"></view> |
|
|
|
<u-form-item label="退房日期" prop="leaveDate" required @click="showDate = false"> |
|
|
|
<u-form-item |
|
|
|
label="退房日期" |
|
|
|
prop="leaveDate" |
|
|
|
required |
|
|
|
@click="showDate = false" |
|
|
|
> |
|
|
|
<text style="text-align: right">{{ baseInfo.checkOutTime }}</text> |
|
|
|
<!-- <u--input |
|
|
|
v-model="baseInfo.checkOutTime" |
|
|
@ -74,15 +85,33 @@ |
|
|
|
</view> |
|
|
|
<view class="desc-card"> |
|
|
|
<view class="label-des">说明</view> |
|
|
|
<u-textarea v-model="forceCheckoutDesc" ref="textarea" placeholder="请输入内容(不超过500字)" |
|
|
|
maxlength="500" height="150" border="none" |
|
|
|
custom-style="background:#f7f7f7;border-radius:12rpx;padding:16rpx;"></u-textarea> |
|
|
|
<u-textarea |
|
|
|
v-model="forceCheckoutDesc" |
|
|
|
ref="textarea" |
|
|
|
placeholder="请输入内容(不超过500字)" |
|
|
|
maxlength="500" |
|
|
|
height="150" |
|
|
|
border="none" |
|
|
|
custom-style="background:#f7f7f7;border-radius:12rpx;padding:16rpx;" |
|
|
|
></u-textarea> |
|
|
|
<view class="label-des">上传图片/视频</view> |
|
|
|
<u-upload accept="all" :fileList="fileList" @afterRead="afterRead" @delete="deletePic" multiple |
|
|
|
:maxCount="10" uploadIconColor="#12c3c3" :previewImage="true"> |
|
|
|
<u-upload |
|
|
|
accept="all" |
|
|
|
:fileList="fileList" |
|
|
|
@afterRead="afterRead" |
|
|
|
@delete="deletePic" |
|
|
|
multiple |
|
|
|
:maxCount="10" |
|
|
|
uploadIconColor="#12c3c3" |
|
|
|
:previewImage="true" |
|
|
|
> |
|
|
|
<view class="custom-upload-btn"> |
|
|
|
<view class="icon-box"> |
|
|
|
<image class="camera-icon" src="/static/img/camera-icon.png" mode="aspectFill"> |
|
|
|
<image |
|
|
|
class="camera-icon" |
|
|
|
src="/static/img/camera-icon.png" |
|
|
|
mode="aspectFill" |
|
|
|
> |
|
|
|
</image> |
|
|
|
</view> |
|
|
|
|
|
|
@ -91,30 +120,41 @@ |
|
|
|
</u-upload> |
|
|
|
</view> |
|
|
|
<view class="submit-box"> |
|
|
|
<u-button type="primary" shape="circle" @click="submit" :custom-style="btnStyle">提交</u-button> |
|
|
|
<u-button |
|
|
|
type="primary" |
|
|
|
shape="circle" |
|
|
|
@click="submit" |
|
|
|
:custom-style="btnStyle" |
|
|
|
>提交</u-button |
|
|
|
> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
</u-form> |
|
|
|
<u-datetime-picker :show="showDate" v-model="form.pickerValue" mode="date" @confirm="onDateConfirm" |
|
|
|
@cancel="showDate = false" /> |
|
|
|
<u-picker :show="showProblemTypePicker" :columns="[problemTypeOptions]" @confirm="onProblemTypeConfirm" |
|
|
|
@cancel="showProblemTypePicker = false" keyName="label" /> |
|
|
|
<u-datetime-picker |
|
|
|
:show="showDate" |
|
|
|
v-model="form.pickerValue" |
|
|
|
mode="date" |
|
|
|
@confirm="onDateConfirm" |
|
|
|
@cancel="showDate = false" |
|
|
|
/> |
|
|
|
<u-picker |
|
|
|
:show="showProblemTypePicker" |
|
|
|
:columns="[problemTypeOptions]" |
|
|
|
@confirm="onProblemTypeConfirm" |
|
|
|
@cancel="showProblemTypePicker = false" |
|
|
|
keyName="label" |
|
|
|
/> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { |
|
|
|
uploadImage, |
|
|
|
getResidentInfo, |
|
|
|
forceRelease |
|
|
|
} from "../../../pages/api"; |
|
|
|
import { uploadImage, getResidentInfo, forceRelease } from "../../../pages/api"; |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
btnStyle: "background:linear-gradient(90deg,#0DC6C6 0%,#13C2C2 100%);font-size:36rpx;border-radius:48rpx;width:60vw;height:80rpx; margin-bottom:60rpx;", |
|
|
|
btnStyle: |
|
|
|
"background:linear-gradient(90deg,#0DC6C6 0%,#13C2C2 100%);font-size:36rpx;border-radius:48rpx;width:60vw;height:80rpx; margin-bottom:60rpx;", |
|
|
|
form: { |
|
|
|
room: "", |
|
|
|
name: "", |
|
|
@ -136,23 +176,21 @@ |
|
|
|
showDate: false, |
|
|
|
minDate: "2000-01-01", |
|
|
|
maxDate: "2100-12-31", |
|
|
|
descStyle: "background:#f7f8fa;border-radius:12rpx;padding:24rpx;font-size:28rpx;color:#222;min-height:250rpx;box-sizing:border-box;", |
|
|
|
problemTypeOptions: [{ |
|
|
|
descStyle: |
|
|
|
"background:#f7f8fa;border-radius:12rpx;padding:24rpx;font-size:28rpx;color:#222;min-height:250rpx;box-sizing:border-box;", |
|
|
|
problemTypeOptions: [ |
|
|
|
{ |
|
|
|
label: "违法居住条款,故意破坏房间设施", |
|
|
|
value: 1 |
|
|
|
}, ], |
|
|
|
value: 1, |
|
|
|
}, |
|
|
|
], |
|
|
|
showProblemTypePicker: false, // 控制选择器显示 |
|
|
|
showInfo: true |
|
|
|
showInfo: true, |
|
|
|
}; |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
roomAllPath() { |
|
|
|
const { |
|
|
|
apartmentName, |
|
|
|
buildingName, |
|
|
|
unitName, |
|
|
|
roomTypeName |
|
|
|
} = |
|
|
|
const { apartmentName, buildingName, unitName, roomTypeName } = |
|
|
|
this.baseInfo; |
|
|
|
return `${apartmentName || ""}${buildingName || ""}${unitName || ""}${ |
|
|
|
roomTypeName || "" |
|
|
@ -161,30 +199,46 @@ |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
handleQuery() { |
|
|
|
console.log("查询参数:", this.form); |
|
|
|
getResidentInfo({ |
|
|
|
idCard: this.form.idCard |
|
|
|
idCard: this.form.idCard, |
|
|
|
}).then((res) => { |
|
|
|
if (res.code === 200) { |
|
|
|
console.log("查询结果:", res); |
|
|
|
this.baseInfo = res.data; |
|
|
|
if (this.baseInfo) { |
|
|
|
this.showInfo = true |
|
|
|
this.showInfo = true; |
|
|
|
} |
|
|
|
this.baseInfo.roomId = res.data.roomId; |
|
|
|
} else { |
|
|
|
uni.showToast({ |
|
|
|
title: res.message, |
|
|
|
icon: "none", |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
handleClear() { |
|
|
|
this.form = { |
|
|
|
room: "", |
|
|
|
name: "", |
|
|
|
idCard: "", |
|
|
|
phone: "", |
|
|
|
leaveDate: "", |
|
|
|
desc: "", |
|
|
|
imageUrl: "", |
|
|
|
pickerValue: "", |
|
|
|
problemType: "", |
|
|
|
}; |
|
|
|
}, |
|
|
|
// 上传前校验 |
|
|
|
beforeRead(event) { |
|
|
|
// 可以在这里做文件大小、类型校验 |
|
|
|
const { |
|
|
|
file |
|
|
|
} = event; |
|
|
|
const { file } = event; |
|
|
|
if (file.size > 10 * 1024 * 1024) { |
|
|
|
// 10MB |
|
|
|
uni.showToast({ |
|
|
|
title: "文件过大", |
|
|
|
icon: "none" |
|
|
|
icon: "none", |
|
|
|
}); |
|
|
|
return false; |
|
|
|
} |
|
|
@ -220,9 +274,9 @@ |
|
|
|
var arry = []; |
|
|
|
this.fileList.filter((v, i) => { |
|
|
|
arry.push({ |
|
|
|
name: v.name || '', |
|
|
|
name: v.name || "", |
|
|
|
format: v.type, |
|
|
|
url: v.url |
|
|
|
url: v.url, |
|
|
|
}); |
|
|
|
}); |
|
|
|
// this.img1 = arry; |
|
|
@ -233,9 +287,9 @@ |
|
|
|
var arry = []; |
|
|
|
this.fileList.filter((v, i) => { |
|
|
|
arry.push({ |
|
|
|
name: v.name || '', |
|
|
|
name: v.name || "", |
|
|
|
format: v.type, |
|
|
|
url: v.url |
|
|
|
url: v.url, |
|
|
|
}); |
|
|
|
}); |
|
|
|
// this.img1 = arry; |
|
|
@ -263,10 +317,10 @@ |
|
|
|
forceRelease(params).then((res) => { |
|
|
|
uni.showToast({ |
|
|
|
title: res.msg, |
|
|
|
icon: "success" |
|
|
|
icon: "success", |
|
|
|
}); |
|
|
|
uni.switchTab({ |
|
|
|
url: "/pages/tabBar/work/index" |
|
|
|
url: "/pages/tabBar/work/index", |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|