first commit
This commit is contained in:
annnj-company
371
pgapp/pages/automatic/index.vue
Normal file
371
pgapp/pages/automatic/index.vue
Normal file
@@ -0,0 +1,371 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="index-image" style="position: absolute; top: -30px; right: 30rpx;z-index: 999;">
|
||||
<img src="/static/images/history.png" mode="aspectFill" width="100%" height="100%" @click="toHistory"/>
|
||||
</view>
|
||||
<uni-card>
|
||||
<view class="uni-list-cell">
|
||||
<view class="uni-list-cell-left">
|
||||
物业名称<text class="require">*</text>
|
||||
</view>
|
||||
<view class="uni-list-cell-db">
|
||||
<input
|
||||
class="uni-input"
|
||||
v-model="addForm.building_name"
|
||||
maxlength="50"
|
||||
placeholder="请输入，最多50字"
|
||||
@input="handleBuildingNameInput"
|
||||
/>
|
||||
<div
|
||||
v-show="estateOptions.length > 0"
|
||||
class="property-dropdown border-1px"
|
||||
>
|
||||
<div v-if="estateLoading" class="loading-indicator">
|
||||
<i class="el-icon-loading"></i> 加载中...
|
||||
</div>
|
||||
<ul v-else>
|
||||
<li
|
||||
v-for="estate in estateOptions"
|
||||
:key="estate.lp_id"
|
||||
@click="selectEstate(estate, index)"
|
||||
class="property-option"
|
||||
>
|
||||
<div
|
||||
:content="estate.loupan_name"
|
||||
placement="top"
|
||||
:open-delay="0"
|
||||
>
|
||||
<span>{{ estate.loupan_name }}</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<view class="uni-list-cell">
|
||||
<view class="uni-list-cell-left">
|
||||
栋号<text class="require">*</text>
|
||||
</view>
|
||||
<view class="uni-list-cell-db">
|
||||
<input
|
||||
class="uni-input"
|
||||
v-model="addForm.building_no"
|
||||
maxlength="15"
|
||||
placeholder="请输入"
|
||||
@input="handleBuildingInput(index)"
|
||||
/>
|
||||
<div
|
||||
v-show="buildingOptions.length > 0"
|
||||
class="property-dropdown"
|
||||
>
|
||||
<div v-if="buildingLoading" class="loading-indicator">
|
||||
<i class="el-icon-loading"></i> 加载中...
|
||||
</div>
|
||||
<ul v-else>
|
||||
<li
|
||||
v-for="building in buildingOptions"
|
||||
:key="building.b_id"
|
||||
@click="selectBuilding(building, index)"
|
||||
class="property-option"
|
||||
>
|
||||
<div
|
||||
:content="building.building_name"
|
||||
placement="top"
|
||||
:open-delay="0"
|
||||
>
|
||||
<span>{{ building.building_name }}</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<view class="uni-list-cell">
|
||||
<view class="uni-list-cell-left">
|
||||
房号<text class="require">*</text>
|
||||
</view>
|
||||
<view class="uni-list-cell-db">
|
||||
<input
|
||||
class="uni-input"
|
||||
v-model="addForm.unit_no"
|
||||
maxlength="15"
|
||||
placeholder="请输入"
|
||||
@input="handleUnitNoInput($event, index)"
|
||||
/>
|
||||
<div
|
||||
v-show="unitOptions.length > 0"
|
||||
class="property-dropdown"
|
||||
>
|
||||
<div v-if="unitLoading" class="loading-indicator">
|
||||
<i class="el-icon-loading"></i> 加载中...
|
||||
</div>
|
||||
<ul v-else>
|
||||
<li
|
||||
v-for="unit in unitOptions"
|
||||
:key="unit.h_id"
|
||||
@click="selectUnit(unit, index)"
|
||||
class="property-option"
|
||||
>
|
||||
<div
|
||||
:content="unit.house_number"
|
||||
placement="top"
|
||||
:open-delay="0"
|
||||
>
|
||||
<span>{{ unit.house_number }}</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<view class="uni-list-cell">
|
||||
<view class="uni-list-cell-left">
|
||||
建筑面积（m²）<text class="require">*</text>
|
||||
</view>
|
||||
<view class="uni-list-cell-db">
|
||||
<input
|
||||
class="uni-input"
|
||||
style="box-sizing: border-box; height: 100%"
|
||||
v-model="addForm.size"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="uni-list-button">
|
||||
<button
|
||||
:loading="loading"
|
||||
open-type=""
|
||||
hover-class="button-hover"
|
||||
style="color:#00CC66; background-color: #fff; border: 1px solid #00CC66"
|
||||
@click="submitForm"
|
||||
>
|
||||
提交
|
||||
</button>
|
||||
</view>
|
||||
<view class="uni-list-mobile" @click="toMobile">
|
||||
试试人工评房
|
||||
</view>
|
||||
</uni-card>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getEstateListByName,
|
||||
getBuildingListByBName,
|
||||
getPropertyListByBid,
|
||||
autoInquiry
|
||||
} from "api/inquiry/inquiry";
|
||||
|
||||
export default {
|
||||
name: "Index",
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
estateOptions: [],
|
||||
estateLoading: false,
|
||||
buildingOptions: [],
|
||||
buildingLoading: false,
|
||||
unitOptions: [],
|
||||
unitLoading: false,
|
||||
addForm: {
|
||||
building_name: "",
|
||||
building_no: "",
|
||||
unit_no: "",
|
||||
size: "",
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleBuildingNameInput(item) {
|
||||
this.estateOptions = [];
|
||||
this.buildingOptions = [];
|
||||
const value = item.detail.value;
|
||||
if (!value) {
|
||||
this.estateOptions = [];
|
||||
return;
|
||||
}
|
||||
|
||||
this.estateLoading = true;
|
||||
// 使用正确的API获取物业数据
|
||||
getEstateListByName({ name: value })
|
||||
.then((res) => {
|
||||
this.estateLoading = false;
|
||||
if (res.code === 1 && res.data && res.data.length > 0) {
|
||||
this.estateOptions = res.data;
|
||||
} else {
|
||||
this.estateOptions = [];
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.estateLoading = false;
|
||||
this.estateOptions = [];
|
||||
});
|
||||
},
|
||||
selectEstate(estate, index) {
|
||||
this.addForm.building_name = estate.loupan_name;
|
||||
this.addForm.lp_id = estate.lp_id;
|
||||
|
||||
// 清空其他字段
|
||||
this.addForm.building_no = "";
|
||||
this.addForm.unit_no = "";
|
||||
// 获取栋号列表
|
||||
this.estateOptions = [];
|
||||
//获取栋号列表
|
||||
this.handleBuildingInput(index);
|
||||
},
|
||||
handleBuildingInput(index) {
|
||||
const estate = this.addForm;
|
||||
if (estate && estate.building_name) {
|
||||
this.buildingLoading = true;
|
||||
getBuildingListByBName({
|
||||
bname: estate.building_no,
|
||||
lpid: estate.lp_id,
|
||||
})
|
||||
.then((res) => {
|
||||
// 添加 500ms 延迟
|
||||
setTimeout(() => {
|
||||
this.buildingLoading = false;
|
||||
if (res.code === 1 && res.data && res.data.length > 0) {
|
||||
this.buildingOptions = res.data;
|
||||
} else {
|
||||
this.buildingOptions = [];
|
||||
}
|
||||
}, 500); // 延迟 500 毫秒
|
||||
})
|
||||
.catch(() => {
|
||||
this.buildingLoading = false;
|
||||
this.buildingOptions = [];
|
||||
});
|
||||
}
|
||||
},
|
||||
selectBuilding(building, index) {
|
||||
this.addForm.building_no = building.building_name;
|
||||
this.addForm.b_id = building.b_id;
|
||||
|
||||
this.buildingOptions = [];
|
||||
},
|
||||
handleUnitNoInput(value, index) {
|
||||
console.log("value", value);
|
||||
if (!value.detail.value) {
|
||||
this.unitOptions = [];
|
||||
return;
|
||||
}
|
||||
this.unitLoading = true;
|
||||
let item = this.addForm;
|
||||
// 添加 500ms 延迟
|
||||
getPropertyListByBid({ bid: item.b_id, hno: item.unit_no })
|
||||
.then((res) => {
|
||||
setTimeout(() => {
|
||||
this.unitLoading = false;
|
||||
if (res.code === 1 && res.data && res.data.length > 0) {
|
||||
this.unitOptions = res.data;
|
||||
} else {
|
||||
this.unitOptions = [];
|
||||
}
|
||||
}, 500); // 延迟 500 毫秒
|
||||
})
|
||||
.catch(() => {
|
||||
this.unitLoading = false;
|
||||
this.unitOptions = [];
|
||||
});
|
||||
},
|
||||
selectUnit(unit, index) {
|
||||
this.addForm.unit_no = unit.house_number;
|
||||
this.unitOptions = [];
|
||||
},
|
||||
submitForm() {
|
||||
this.loading = true;
|
||||
autoInquiry(this.addForm)
|
||||
.then((res) => {
|
||||
this.loading = false;
|
||||
if (res.code === 1) {
|
||||
this.$tab.navigateTo("/pages/automatic/detail?info=" + encodeURIComponent(JSON.stringify(res.data)));
|
||||
console.log("res",res.data);
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
toMobile() {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: '075583279666', //仅为示例
|
||||
success: function () {
|
||||
console.log('拨打电话成功');
|
||||
},
|
||||
fail: function () {
|
||||
console.log('拨打电话失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
toHistory() {
|
||||
this.$tab.navigateTo("/pages/automatic/list");
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 93vh;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
/* 将 mask 缩小到一行 */
|
||||
.uni-popup-mask {
|
||||
height: 1px;
|
||||
}
|
||||
/* 将 mask 演示为浅蓝色 */
|
||||
.uni-popup-mask::before {
|
||||
background-color: #e6f1ff;
|
||||
}
|
||||
.uni-list-cell {
|
||||
line-height: 90rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.uni-input {
|
||||
height: 50rpx;
|
||||
padding: 0rpx 25rpx;
|
||||
line-height: 30rpx;
|
||||
font-size: 28rpx;
|
||||
text-align: right;
|
||||
}
|
||||
.property-dropdown {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
background-color: #fff;
|
||||
border: 1px solid #dcdfe6;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
z-index: 2000;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.uni-file-picker{
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
.require {
|
||||
color: RED;
|
||||
}
|
||||
.uni-list-button{
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
.uni-list-mobile{
|
||||
margin-top: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.index-image{
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user