yinchuan-community-all/mini-program/smart-city-yinchuan-wx/pages/auth/auth.vue

<template>
    <view style="background-color: #FFFFFF;min-height: 100vh;">
        <view class="flex justify-between " style="padding: 30rpx;box-sizing: border-box;">
            <view class="" style="font-size: 38rpx;">
                <text class="text-bold text-black">您要申请的小区</text>
            </view>
            <view class="text-red" style="padding-top: 12rpx;">
                <text style="font-size: 38rpx;">{{totalStep-1}}</text>
                <text class="text-df">/{{totalStep}}</text>
            </view>
        </view>
        <view class="padding-top-30  cu-list menu">

            <view @click="jump(0)" class="cu-item arrow">
                <view class="content">
                    <image style="width: 50rpx; height: 50rpx;margin: 0 20rpx 4rpx 0;"
                           src="/static/common/city2.png" class="png" mode="aspectFit"></image>
                    <text class="text-black text-bold">城市</text>
                </view>
                <view class="action">
                    <text class="text-grey text-df">
                        {{$isEmpty(city_county_name)?'请选择城市':city_county_name}}
                    </text>
                </view>
            </view>
            <view @click="jump(1)" class="cu-item arrow">
                <view class="content">
                    <image style="width: 50rpx; height: 50rpx;margin: 0 20rpx 0rpx 0;"
                           src="/static/common/xiaoqu.png" class="png" mode="aspectFit"></image>
                    <text class="text-black text-bold">小区</text>
                </view>
                <view class="action">
                    <text class="text-grey text-df">
                        {{$isEmpty(data.residential_name)?'请选择小区':data.residential_name}}
                    </text>
                </view>
            </view>
            <view @click="jump(2)" class="cu-item arrow">
                <view class="content">
                    <image style="width: 50rpx; height: 50rpx;margin: 0 20rpx 10rpx 0;"
                           src="/static/common/loudong.png" class="png" mode="aspectFit"></image>
                    <text class="text-black text-bold">楼栋</text>
                </view>
                <view class="action">
                    <text class="text-grey text-df">
                        {{$isEmpty(data.building_name)?'请选择楼栋':data.building_name}}
                    </text>
                </view>
            </view>

            <view @click="jump(3)" class="cu-item arrow">
                <view class="content">
                    <image style="width: 36rpx; height: 36rpx;margin: 0 24rpx 10rpx 10rpx;"
                           src="/static/common/unit.png" class="png" mode="aspectFit"></image>
                    <text class="text-black text-bold">单元</text>
                </view>
                <view class="action">
                    <text class="text-grey text-df">
                        {{$isEmpty(data.unit_name)?'请选择楼栋':data.unit_name}}
                    </text>
                </view>
            </view>

            <view @click="jump(4)" class="cu-item arrow">
                <view class="content">
                    <image style="width: 50rpx; height: 50rpx;margin: 0 20rpx 10rpx 0;"
                           src="/static/common/fangjian.png" class="png" mode="aspectFit"></image>
                    <text class="text-black text-bold">门牌号</text>
                </view>
                <view class="action">
                    <text class="text-grey text-df">
                        {{$isEmpty(data.room_name)?'请选择门牌号':data.room_name}}
                    </text>
                </view>
            </view>
        </view>
        <view class="footer-fixed" @click="next">
            <view class="cu-btn  flex  text-lg bg-red-btn" style="padding: 46rpx 0;">
                下一步
            </view>
        </view>
    </view>
</template>

<script>
    var app = getApp()
    export default {
        data() {
            return {
                totalStep: 3,

                //小区id
                residential_id: '',
                //楼栋id
                unit_id: '',
                data: {
                    //小区
                    residential_name: "",
                    //楼栋
                    building_name: '',
                    //楼栋id
                    building_id: '',
                    //单元
                    unit_name: "",
                    //房间名
                    room_name: "",
                    //房间id
                    room_id: "",
                },
                //城市
                city_county_name: ''
            }
        },
        onShow() {
            if (this.$isEmpty(app.globalData.totalStep)) {
                this.totalStep = 2
            } else {
                this.totalStep = app.globalData.totalStep
            }
            this.residential_id = app.globalData.residentialId || ''
            this.unit_id = app.globalData.unitId || ''
        },
        onLoad(options) {
            if (!this.$isEmpty(options)) {
                //页面数据
                this.city_county_name = app.globalData.city + app.globalData.county
                this.data.room_id = options.room_id
                this.data.room_name = options.room_name
                this.data.residential_name = options.residential_name
                this.data.building_name = options.building_name
                this.data.building_id = options.building_id
                this.data.unit_name = options.unit_name
            }
        },
        methods: {
            jump(type) {
                let that = this
                if (type == 0) {
                    //选择城市
                    let params = {
                        city: app.globalData.city,
                        county: app.globalData.county,
                        currentCityCode: app.globalData.currentCityCode
                    }
                    uni.navigateTo({
                        url: "../choosePlot/choosePlot" + this.$u.queryParams(params)
                    })
                    return
                }
                //未选择城市
                if (this.$isEmpty(this.city_county_name)) {
                    uni.showToast({
                        title: "请选择城市",
                        icon: "none"
                    })
                    return
                }
                if (type == 1) {
                    //选择小区
                    let params = {
                        city: app.globalData.city,
                        county: app.globalData.county,
                        currentCityCode: app.globalData.currentCityCode
                    }
                    uni.navigateTo({
                        url: "../choosePlot/choosePlot" + this.$u.queryParams(params)
                    })
                    return
                }
                //未选择小区
                if (this.$isEmpty(this.data.residential_name)) {
                    uni.showToast({
                        title: "请选择小区",
                        icon: "none"
                    })
                    return
                }
                if (type == 2) {
                    //选择楼栋
                    let params = {
                        residential_id: this.residential_id,
                        residential_name: this.data.residential_name
                    }
                    uni.navigateTo({
                        url: "../choosePlot/chooseBuilding/chooseBuilding" + this.$u.queryParams(params)
                    })
                    return
                }

                //未选择楼栋
                if (this.$isEmpty(this.data.building_name)) {
                    uni.showToast({
                        title: "请选择楼栋",
                        icon: "none"
                    })
                    return
                }

                if (type == 3) {
                    //选择单元
                    let params = {
                        residential_name: this.data.residential_name,
                        building_id: this.data.building_id,
                        building_name: this.data.building_name
                    }
                    uni.navigateTo({
                        url: "../choosePlot/chooseUnit/chooseUnit" + this.$u.queryParams(params)
                    })
                }

                if (type == 4) {
                    //选择房间
                    let params = {
                        residential_name: this.data.residential_name,
                        building_name: this.data.building_name,
                        building_id: this.data.building_id,
                        unit_name: this.data.unit_name,
                        unit_id: this.unit_id
                    }
                    uni.navigateTo({
                        url: "/pages/choosePlot/chooseRoom/chooseRoom" + this.$u.queryParams(params)
                    })
                }
            },
            next() {
                if (this.$isEmpty(this.city_county_name)) {
                    uni.showToast({
                        title: "请选择城市",
                        icon: "none"
                    })
                    return
                }
                if (this.$isEmpty(this.data.residential_name)) {
                    uni.showToast({
                        title: "请选择小区",
                        icon: "none"
                    })
                    return
                }

                if (this.$isEmpty(this.data.building_name)) {
                    uni.showToast({
                        title: "请选择楼栋",
                        icon: "none"
                    })
                    return
                }

                if (this.$isEmpty(this.data.unit_name)) {
                    uni.showToast({
                        title: "请选择单元",
                        icon: "none"
                    })
                    return
                }

                if (this.$isEmpty(this.data.room_id) || this.$isEmpty(this.data.room_name)) {
                    uni.showToast({
                        title: "请选择门牌号",
                        icon: "none"
                    })
                    return
                }
                uni.navigateTo({
                    url: "../choosePlot/householdCert/householdCert" + this.$u.queryParams(this.data)
                })
            }
        }
    }
</script>

<style lang="scss">
    view,
    button {
        box-sizing: border-box;
    }

    .cu-list.menu > .cu-item.arrow {
        padding-right: 36px;
    }

    .bg-gray {
        background-color: #a1a1a1;
        color: #FFFFFF;
    }
</style>