我的房屋流程对接接口,缴费页面功能修改一版

This commit is contained in:
wangyuxin
2026-04-30 08:24:22 +08:00
parent d569bbc8e1
commit 2c528b7973
19 changed files with 2675 additions and 2553 deletions

View File

@@ -8,17 +8,17 @@
<scroll-view class="page" scroll-y>
<!-- 楼栋网格列表 -->
<view v-if="dataList.length === 0" class="empty-state">
<uni-icons type="info" size="60" color="#ccc"></uni-icons>
<text class="empty-text">
{{ '暂无数据'}}
</text>
</view>
<view class="building-grid">
<view v-if="dataList.length === 0" class="empty-state">
<uni-icons type="info" size="60" color="#ccc"></uni-icons>
<text class="empty-text">
{{ '暂无数据'}}
</text>
</view>
<view class="building-item"
:class="{ active:(checkType=='楼栋'&& selectedBuilding === item.id)||(checkType=='单元'&& selectedUnit === item.id)||(checkType=='楼层'&&selectedFloor === item.id) ||(checkType=='户号'&&selectedHouseNumber === item.id) }"
v-for="(item, index) in dataList" :key="index" @click="selectBuilding(item)">
<text class="building-text">{{ item.name }}</text>
<text class="building-text">{{item.name }}</text>
</view>
</view>
</scroll-view>
@@ -29,339 +29,209 @@
</template>
<script>
export default {
onReady: function(e) {},
components: {
<script setup>
import {
ref,
onMounted,
} from 'vue'
import {
onUnload,
onShow
},
} from '@dcloudio/uni-app'
import {
getHouseBuildings,
getHouseUnits,
getHouseFloors,
getHouseHouses
} from '/pageSubPack/api/apiSub.js'
computed: {
// 状态栏高度
const statusBarHeight = ref(20)
},
created() {
},
onShow() {
},
onUnload() {},
mounted() {
if (this.checkType == '楼栋') {
this.dataList = this.buildingList
} else if (this.checkType == '单元') {
this.dataList = this.unitList
} else if (this.checkType == '楼层') {
this.dataList = this.floorList
} else if (this.checkType == '户号') {
this.dataList = this.houseNumberList
}
},
data() {
return {
/* 设定状态栏默认高度 */
statusBarHeight: 20,
checkType: uni.getStorageSync('checkType'),
dataList: [],
// 楼栋列表(可动态生成/接口返回)
buildingList: [{
id: 1,
name: '01栋'
},
{
id: 2,
name: '02栋'
},
{
id: 3,
name: '03栋'
},
{
id: 4,
name: '04栋'
},
{
id: 5,
name: '05栋'
},
{
id: 6,
name: '06栋'
},
{
id: 7,
name: '07栋'
},
{
id: 8,
name: '08栋'
},
{
id: 9,
name: '09栋'
},
{
id: 10,
name: '10栋'
},
{
id: 11,
name: '11栋'
},
{
id: 12,
name: '12栋'
}
],
floorList: [{
id: 13,
name: '01层'
},
{
id: 14,
name: '02层'
},
{
id: 15,
name: '03层'
},
{
id: 16,
name: '04层'
}, {
id: 17,
name: '05层'
},
{
id: 18,
name: '06层'
},
{
id: 19,
name: '07层'
},
{
id: 20,
name: '08层'
}, {
id: 21,
name: '09层'
},
{
id: 22,
name: '10层'
},
{
id: 23,
name: '11层'
},
{
id: 24,
name: '12层'
}, {
id: 25,
name: '13层'
},
{
id: 26,
name: '14层'
},
{
id: 27,
name: '15层'
},
{
id: 28,
name: '16层'
},
{
id: 29,
name: '17层'
},
{
id: 30,
name: '18层'
},
{
id: 31,
name: '19层'
},
{
id: 32,
name: '20层'
},
],
unitList: [{
id: 33,
name: '01单元'
},
{
id: 34,
name: '02单元'
},
{
id: 35,
name: '03单元'
},
{
id: 36,
name: '04单元'
},
],
houseNumberList: [{
id: 37,
name: '01'
},
{
id: 38,
name: '02'
},
{
id: 39,
name: '03'
},
{
id: 40,
name: '04'
},
],
// 选中的楼栋
selectedBuilding: uni.getStorageSync('buildingId'),
// 选中的单元
selectedUnit: uni.getStorageSync('unitId'),
// 选中的楼层
selectedFloor: uni.getStorageSync('floorId'),
// 选中的户号
selectedHouseNumber: uni.getStorageSync('houseNumberId'),
}
},
methods: {
selectBuilding(item) {
let modalContent = '确认选择此' + this.checkType + '吗?'
uni.showModal({
title: "确认选择",
content: modalContent,
success: (res) => {
if (res.confirm) {
uni.showLoading({
title: '选择中...',
mask: true
});
// 从缓存获取类型
const checkType = ref(uni.getStorageSync('checkType') || '')
const dataList = ref([])
// 选中项(从缓存读取)
const selectedBuilding = ref(uni.getStorageSync('buildingId') || '')
const selectedUnit = ref(uni.getStorageSync('unitId') || '')
const selectedFloor = ref(uni.getStorageSync('floorId') || '')
const selectedHouseNumber = ref(uni.getStorageSync('houseNumberId') || '')
if (this.checkType == '楼栋') {
this.selectedBuilding = item.id
uni.setStorageSync('buildingId', item.id);
uni.setStorageSync('buildingName', item.name);
uni.removeStorageSync('unitId');
uni.removeStorageSync('unitName');
uni.removeStorageSync('floorId');
uni.removeStorageSync('floorName');
uni.removeStorageSync('houseNumberId');
uni.removeStorageSync('houseNumberName');
uni.setStorageSync('checkType', '单元');
} else if (this.checkType == '单元') {
this.selectedUnit = item.id
uni.setStorageSync('unitId', item.id);
uni.setStorageSync('unitName', item.name);
uni.removeStorageSync('floorId');
uni.removeStorageSync('floorName');
uni.removeStorageSync('houseNumberId');
uni.removeStorageSync('houseNumberName');
uni.setStorageSync('checkType', '楼层');
} else if (this.checkType == '楼层') {
this.selectedFloor = item.id
uni.setStorageSync('floorId', item.id);
uni.setStorageSync('floorName', item.name);
uni.removeStorageSync('houseNumberId');
uni.removeStorageSync('houseNumberName');
uni.setStorageSync('checkType', '户号');
} else if (this.checkType == '户号') {
this.selectedHouseNumber = item.id
uni.setStorageSync('houseNumberId', item.id);
uni.setStorageSync('houseNumberName', item.name);
// 页面挂载后赋值列表
onMounted(() => {
console.log(checkType);
if (checkType.value === '楼栋') {
getList('楼栋')
} else if (checkType.value === '单元') {
getList('单元')
} else if (checkType.value === '楼层') {
getList('楼层')
} else if (checkType.value === '户号') {
getList('户号')
}
}
setTimeout(() => {
uni.showToast({
title: '选择成功',
icon: 'success'
});
}, 500);
setTimeout(() => {
// 提交成功后跳转列表页
uni.hideLoading();
this.goFreash();
}, 2000);
})
}
},
});
},
goFreash() {
console.log(this.checkType, '刷新页面');
if (this.checkType != '户号') {
uni.redirectTo({
url: '/pageSubPack/my/selectBuilding',
success: res => {},
fail: () => {},
complete: () => {}
});
} else {
uni.redirectTo({
url: '/pageSubPack/my/addHouse',
success: res => {},
fail: () => {},
complete: () => {}
});
}
},
goBackAdd() {
if (this.checkType == '楼栋') {
uni.removeStorageSync('buildingId');
uni.removeStorageSync('buildingName');
} else if (this.checkType == '单元') {
uni.removeStorageSync('unitId');
uni.removeStorageSync('unitName');
} else if (this.checkType == '楼层') {
uni.removeStorageSync('floorId');
uni.removeStorageSync('floorName');
} else if (this.checkType == '户号') {
uni.removeStorageSync('houseNumberId');
uni.removeStorageSync('houseNumberName');
// 选择项方法
const selectBuilding = (item) => {
const modalContent = `确认选择此${checkType.value}吗?`
uni.showModal({
title: '确认选择',
content: modalContent,
success: (res) => {
if (!res.confirm) return
uni.showLoading({
title: '选择中...',
mask: true
})
if (checkType.value === '楼栋') {
selectedBuilding.value = item.id
uni.setStorageSync('buildingId', item.id)
uni.setStorageSync('buildingName', item.name)
uni.removeStorageSync('unitId')
uni.removeStorageSync('unitName')
uni.removeStorageSync('floorId')
uni.removeStorageSync('floorName')
uni.removeStorageSync('houseNumberId')
uni.removeStorageSync('houseNumberName')
uni.setStorageSync('checkType', '单元')
} else if (checkType.value === '单元') {
selectedUnit.value = item.id
uni.setStorageSync('unitId', item.id)
uni.setStorageSync('unitName', item.name)
uni.removeStorageSync('floorId')
uni.removeStorageSync('floorName')
uni.removeStorageSync('houseNumberId')
uni.removeStorageSync('houseNumberName')
uni.setStorageSync('checkType', '楼层')
} else if (checkType.value === '楼层') {
selectedFloor.value = item.id
uni.setStorageSync('floorId', item.id)
uni.setStorageSync('floorName', item.name)
uni.removeStorageSync('houseNumberId')
uni.removeStorageSync('houseNumberName')
uni.setStorageSync('checkType', '户号')
} else if (checkType.value === '户号') {
selectedHouseNumber.value = item.id
uni.setStorageSync('houseNumberId', item.id)
uni.setStorageSync('houseNumberName', item.name)
}
uni.redirectTo({
url: '/pageSubPack/my/addHouse',
success: res => {},
fail: () => {},
complete: () => {}
});
},
},
setTimeout(() => {
uni.showToast({
title: '选择成功',
icon: 'success'
})
}, 500)
setTimeout(() => {
uni.hideLoading()
goFreash()
}, 2000)
}
})
}
// 刷新跳转
const goFreash = () => {
console.log(checkType.value, '刷新页面')
if (checkType.value !== '户号') {
uni.redirectTo({
url: '/pageSubPack/my/selectBuilding'
})
} else {
uni.redirectTo({
url: '/pageSubPack/my/addHouse'
})
}
}
// 返回新增
const goBackAdd = () => {
if (checkType.value === '楼栋') {
uni.removeStorageSync('buildingId')
uni.removeStorageSync('buildingName')
} else if (checkType.value === '单元') {
uni.removeStorageSync('unitId')
uni.removeStorageSync('unitName')
} else if (checkType.value === '楼层') {
uni.removeStorageSync('floorId')
uni.removeStorageSync('floorName')
} else if (checkType.value === '户号') {
uni.removeStorageSync('houseNumberId')
uni.removeStorageSync('houseNumberName')
}
uni.redirectTo({
url: '/pageSubPack/my/addHouse'
})
}
// 获取数据
const getList = async (type) => {
try {
if (type == '楼栋') {
const res = await getHouseBuildings({
villageId: uni.getStorageSync('communityId')
})
const newList = res.data.map(item => ({
id: item.id,
name: item.buildingName
}))
dataList.value = newList
} else if (type == '单元') {
const res = await getHouseUnits({
buildingId: selectedBuilding.value
})
const newList = res.data.map(item => ({
id: item,
name: item
}))
dataList.value = newList
} else if (type == '楼层') {
const res = await getHouseFloors({
buildingId: selectedBuilding.value,
unitNo: selectedUnit.value
})
const newList = res.data.map(item => ({
id: item,
name: item
}))
dataList.value = newList
} else if (type == '户号') {
const res = await getHouseHouses({
buildingId: selectedBuilding.value,
unitNo: selectedUnit.value,
floorNo: selectedFloor.value
})
const newList = res.data.map(item => ({
id: item.houseId,
name: item.houseNo
}))
dataList.value = newList
}
} catch (err) {
uni.showToast({
title: '加载失败',
icon: 'none'
})
console.error('列表接口报错:', err)
} finally {
}
}
// 生命周期
onShow(() => {
})
onUnload(() => {})
</script>
<style lang="scss">
page {