打卡登记，数据驾驶舱页面编写，调整部分按钮样式。调整出租房管理页面样式

Lou

2023-12-04 ae820a43aa6b20bea341e78d1bbbc15db5a1454a

打卡登记，数据驾驶舱页面编写，调整部分按钮样式。调整出租房管理页面样式

 api/checkIn/checkIn.js

New file
@@ -0,0 +1,9 @@
import http from '@/http/api.js'

export const addCheckIn = (params) => {
    return http.request({
        url: '/blade-checkInRecords/checkInRecords/save',
        method: 'POST',
        data: params
    })
}

 common/setting.js

@@ -14,7 +14,7 @@
    // devUrl:'http://192.168.1.50:9528',
    // devUrl: 'http://192.168.0.102:9528',
    // devUrl:'https://srgdjczzxtpt.com:2080/api',
    // devUrl: 'http://192.168.0.100:9528',
    // devUrl: 'http://192.168.0.102:9528',
    devUrl: 'https://srgdjczzxtpt.com:2080/api',
    minioBaseUrl: "https://srgdjczzxtpt.com:2080/gminio/jczz/",
    // minioBaseUrl:"http://192.168.0.103:9528/",

 components/btn/footerBtn.vue

@@ -21,7 +21,7 @@
    }
</script>

<style lang="scss">
<style lang="scss"  scoped >
    .footer{
        width:100%;
        padding:20rpx 30rpx;
@@ -31,7 +31,7 @@
        left:0;
        background-color: #fff;
        z-index: 10;
        bottom: env(safe-area-inset-bottom); 
        padding-bottom: env(safe-area-inset-bottom); 
        
        .footer-btn{
            width:100%;

 pages.json

@@ -43,9 +43,23 @@
                "navigationBarTextStyle": "black"
            }
        }

    ],
    "subPackages": [
        //数据驾驶舱
        {
            "root": "subPackage/statistics",
            "pages": [
                {
                    "path": "index",
                    "style": {
                        "navigationBarTitleText": "数据驾驶舱",
                        "enablePullDownRefresh": false,
                        "navigationBarBackgroundColor": "#fff",
                        "navigationBarTextStyle": "black"
                    }
                }
            ]
        },
        //我的
        {
            "root": "subPackage/user",
@@ -56,8 +70,8 @@
                    "style": {
                        "navigationBarTitleText": "切换角色",
                        "enablePullDownRefresh": false,
                        "navigationBarBackgroundColor": "#4586fe",
                        "navigationBarTextStyle": "white"
                        "navigationBarBackgroundColor": "#fff",
                        "navigationBarTextStyle": "black"
                    }
                },
                //修改密码

 pages/home/index.vue

@@ -38,23 +38,34 @@
                <view @click="scan" class="block-item">

                    <image class="block-item-bg" src="/static/icon/nav-bg-04.png" mode="aspectFill" />

                    <view class="block-item-box flex a-i-c ">

                        <u-icon name="/static/icon/nav-05.png" width="90rpx" height="90rpx"></u-icon>

                        <u-icon name="/static/icon/nav-05.png" width="65rpx" height="65rpx"></u-icon>

                        <view class="item-text flex f-d-c j-c-s-b">

                            <text class="f-32 fw">扫一扫</text>

                            <text class="f-26 opacity">场所采集</text>

                            <text class="f-24 fw">扫一扫</text>

                            <text class="f-22 opacity">场所采集</text>

                        </view>

                    </view>

                </view>

                <view class="block-item" @click="navigatorPage('/subPackage/user/clockIn/index')">

                    <image class="block-item-bg" src="/static/icon/nav-bg-05.png" mode="aspectFill" />

                    <view class="block-item-box flex a-i-c">

                        <u-icon name="/static/icon/nav-06.png" width="90rpx" height="90rpx"></u-icon>

                        <u-icon name="/static/icon/nav-06.png" width="65rpx" height="65rpx"></u-icon>

                        <view class="item-text flex f-d-c j-c-s-b">

                            <text class="f-32 fw">打卡登记</text>

                            <text class="f-26 opacity">在线打卡</text>

                            <text class="f-24 fw">打卡登记</text>

                            <text class="f-22 opacity">在线打卡</text>

                        </view>

                    </view>

                </view>

                <view class="block-item" @click="navigatorPage('')">

                    <image class="block-item-bg" src="/static/icon/nav-bg-04.png" mode="aspectFill" />

                    <view class="block-item-box flex a-i-c">

                        <u-icon name="/static/icon/nav-12.png" width="65rpx" height="65rpx"></u-icon>

                        <view class="item-text flex f-d-c j-c-s-b">

                            <text class="f-24 fw">数据驾驶舱</text>

                            <text class="f-22 opacity">数据统计</text>

                        </view>

                    </view>

                </view>

				
            </view>



            <view class="" v-if="isShowHouse">

@@ -631,12 +642,6 @@
                            icon: "error"

                        })



                    } else if (path == '/subPackage/user/clockIn/index') {

                        uni.showToast({

                            title: "功能开发中~",

                            icon: "none"

                        })



                    } else {

                        this.$u.func.globalNavigator(`${path}?houseCode=${this.curHouseCode}`, "navTo")

                    }

@@ -750,26 +755,29 @@
    .block {

        .block-item {

            position: relative;

			
        }



        .block-item,

        .block-item-bg,

        .block-item-box {

            width: 334rpx;

            height: 170rpx;

            width: 226rpx;

            height: 150rpx;

            border-radius: 12rpx;

        }



        .block-item-box {

            padding: 0 30rpx;

            padding: 0 12rpx;

            box-sizing: border-box;

            position: absolute;

            top: 0;

            left: 0;

			
        }



        .item-text {

            height: 90rpx;

            margin-left: 22rpx;

            height: 65rpx;

            margin-left: 20rpx;

            color: #fff;

        }




 static/icon/nav-12.png

 subPackage/bs/views/rentDetail.vue

@@ -54,10 +54,10 @@
                    </view>

                    <rentForm ref="rentform" />

                </view>

                <view class="addPerson-box">

                <!-- <view class="addPerson-box">

                    <u-button class="btn-item" color="#2CD5C0" plain style="width: 300rpx;"

                        @click="addRentForm">再加一人</u-button>

                </view>

                </view> -->

            </view>

        </u-form>

        <!-- 事件类型下拉框 -->

@@ -75,6 +75,8 @@
            @cancel="dueTimeShow = false"></u-datetime-picker>



        <view class="bottom-tools">

            <u-button class="btn-item" color="#2CD5C0" plain style="width: 300rpx;"

                @click="addRentForm">再加一人</u-button>

            <u-button class="btn-item" type="error" @click="isModelShow = true"

                v-if="btnControls.deleteBtn">删除</u-button>

            <u-button class="btn-item" type="success" @click="verify" v-if="btnControls.verifyBtn">确认</u-button>

@@ -621,7 +623,7 @@
            // border-top: 1rpx solid #e4e4e4;

            z-index: 999;

            padding: 20rpx;



            padding-bottom: env(safe-area-inset-bottom); 
            /deep/ .u-button {

                color: #ffffff;

                font-weight: 700;


 subPackage/house/family/index.vue

@@ -189,9 +189,11 @@
        flex-direction: column;

        background: #F9F9FA;

        font-size: 26rpx;



        .main {

            flex: 1;

            overflow-y: auto;



            .content {

                margin-top: 20rpx;

                background-color: #fff;


 subPackage/house/member/index.vue

@@ -148,14 +148,16 @@
                </u-form>
            </view>

            <view class="btn-group b-c-w">
            <!-- <view class="btn-group b-c-w">
                <view>
                    <u-button @click="submit" type="primary" :text="addOrUpdateTitle" width="120px"></u-button>
                </view>
                <view>
                    <u-button @click="navigator" type="primary" :plain="true" text="返回首页"></u-button>
                </view>
            </view>
            </view> -->
			
            <footer-btn   :text="addOrUpdateTitle"   @click="submit"  />
        </view>

        <!-- 事件类型下拉框 -->
@@ -439,17 +441,16 @@
        
        
        .main {
            position: relative;
            height: 0;
            flex: 1;
            // position: relative;
            // flex: 1;
            display: flex;
            flex-direction: column;

            .content {
                height: 0;
                flex: 1;
                overflow-y: auto;
                padding-bottom: 120rpx;
                // height: 0;
                // flex: 1;
                // overflow-y: auto;
                padding-bottom: 160rpx;
                // padding-bottom: 36rpx;
            }


 subPackage/house/roomDetails/index.vue

@@ -515,7 +515,8 @@


            .edit-btn {

                width: 100%;

                height: 116rpx;

                // height: 116rpx;

                padding:20rx;

                display: flex;

                justify-content: space-around;

                align-items: center;

@@ -523,18 +524,20 @@
                position: fixed;

                left: 0;

                bottom: 0;



                padding-bottom: env(safe-area-inset-bottom); 
                box-sizing: border-box;

                view {

                    margin: 20rpx;

                    flex:1;

                    height:78rpx;

                    // &:first-child {

                    //     flex: 1;

                    //     margin-right: 0;

                    // }



                    &:first-child {

                        flex: 1;

                        margin-right: 0;

                    }



                    &:last-child {

                        flex: 2;

                    }

                    // &:last-child {

                    //     flex: 2;

                    // }

                }

            }

        }


 subPackage/statistics/index.vue

New file
@@ -0,0 +1,67 @@
<template>
    <view class="container">
        <view class="">
            <caption-row title="社区概况"></caption-row>
            <view class="cell flex j-c-s-b flex-wrap">
                <view class="cell-item bgc-ff" v-for="i in 6">
			
                </view>
            </view>
        </view>
		
        <view class="">
            <caption-row title="共治人员"></caption-row>
            <view class="menu">
                <u-grid :border="true">
                    <u-grid-item v-for="i in 6"  bgColor="#fff">
                        <view class="menu-item flex f-d-c a-i-c">
                            <text class="c-main f-32 fw">1</text>
                            <text class="f-28">党员</text>
                        </view>
                    </u-grid-item>
                </u-grid>
            </view>
        </view>
		
        <view class="">
            <caption-row title="人员画像"></caption-row>
        </view>
		
    </view>
</template>

<script>
    import captionRow from "@/components/caption/caption.vue"
    export default {
        components: {
            captionRow
        }
    }
</script>

<style lang="scss">
    page {
        background-color: #f5f5f5;
    }

    .container {
        padding: 0 20rpx;
    }

    .cell {
        padding: 20rpx 0;

        .cell-item {
            width: 220rpx;
            height: 190rpx;
            border-radius: 10rpx;
            margin-bottom: 20rpx;
        }
    }
    .menu{
        padding: 20rpx 0;
        .menu-item{
            padding:20rpx 0;
        }
    }
</style>

 subPackage/user/clockIn/index.vue

@@ -1,31 +1,27 @@
<template>
    <view>
        <view class="content bgc-ff">
            <u-form labelPosition="left" :model="info" :rules="rules" ref="uForm" labelWidth="90"
            <u-form labelPosition="left" :model="info" :rules="rules" ref="form" labelWidth="90"
                :labelStyle="{fontSize:'28rpx'}">
                <u-form-item label="工作主题" prop="info.title" borderBottom ref="item1">
                    <u-input v-model="info.title" border="none" placeholder="请输入工作主题" placeholderClass="f-28 c-99"
                <u-form-item label="工作主题" prop="info.workTheme" borderBottom>
                    <u-input v-model="info.workTheme" border="none" placeholder="请输入工作主题" placeholderClass="f-28 c-99"
                        inputAlign="right"></u-input>
                </u-form-item>
                <u-form-item label="当前位置" borderBottom ref="item1">
                    <u-input v-model="info.address" border="none"  placeholderClass="f-28 c-99"
                        inputAlign="right">
                        <template slot="suffix">
                            <button class="location-btn c-main f-24"   @click="getLocation()">获取地址</button>
                        </template>
                    </u-input>
                </u-form-item>
				
                <!-- <view class="row flex a-i-c j-c-s-b">
                    <text class="f-28">当前位置</text>
                    <view class="flex">
                        <view class="f-28">当前位置</view>
                        <button class="location-btn c-main f-24"   @click="getLocation()">获取地址</button>
                <u-form-item label="当前位置" prop="address" borderBottom>
                    <view class="address-row flex">
                        <view class="address-content f-28" v-if="info.address">
                            {{info.address}}
                        </view>
                        <view class="address-content f-28 c-99" v-if="!info.address">
                            请选择地址
                        </view>
                        <view class="location-btn c-main f-24" @click="getLocation()">
                            获取地址
                        </view>
                    </view>
                </view> -->
				
                <u-form-item label="工作内容" prop="info.content" :borderBottom="false" ref="item1">
                    <u-input v-model="info.content" border="none" placeholder="请输入工作内容" placeholderClass="f-28 c-99"
                </u-form-item>
                <u-form-item label="工作内容" prop="info.workContent" :borderBottom="false" ref="item1">
                    <u-input v-model="info.workContent" border="none" placeholder="请输入工作内容" placeholderClass="f-28 c-99"
                        inputAlign="right"></u-input>
                </u-form-item>
            </u-form>
@@ -33,7 +29,7 @@
        <view class="upload bgc-ff">
            <view class="f-28">场所图片</view>
            <view class="mt-20">
                <u-upload :fileList="images" :previewFullImage="uploadConfig.previewFullImage"
                <u-upload :fileList="form.images" :previewFullImage="uploadConfig.previewFullImage"
                    :accept="uploadConfig.acceptImg" :multiple="uploadConfig.multiple" :maxCount="uploadConfig.maxCount"
                    :capture="uploadConfig.capture" @afterRead="afterReadImg" @delete="deletePic">
                    <view class="upload-item upload-icon flex_base">
@@ -43,9 +39,12 @@
            </view>
        </view>

        <view class="footer">
        <!-- <view class="footer">
            <button class="footer-btn">提交</button>
        </view>
        </view> -->

        <footer-btn @click="submitInfo" />


    </view>

@@ -53,40 +52,74 @@

<script>
    import uploadMixin from "@/mixin/uploadMixin";
    import {
        addCheckIn
    } from "@/api/checkIn/checkIn.js"
    export default {
        mixins: [uploadMixin],
        data() {
            return {
                info: {
                    title: "",
                    content: ""
                    workTheme: "",
                    workContent: "",
                    address: ""
                },
                form: {
                    images: []
                },
                rules: {
                    'title': {
                    'workTheme': {
                        type: 'string',
                        required: true,
                        message: '请输入工作主题',
                        trigger: ['blur', 'change']
                    },
                    'content': {
                    'workContent': {
                        type: 'string',
                        required: true,
                        message: '请输入工作内容',
                        trigger: ['blur', 'change']
                    },
                    'address': {
                        type: 'string',
                        required: true,
                        message: '请选择地址',
                        trigger: ['blur', 'change']
                    },
                },

                images: [

                ]
            }
        },
        methods:{
            getLocation(){
        methods: {
            getLocation() {
                uni.chooseLocation({
                    success:(res)=>{
                        console.log(res);
                    success: (res) => {
                        this.$set(this.info, "address", res.address);
                        this.$set(this.info, "lat", res.latitude);
                        this.$set(this.info, "lng", res.longitude)
                    }
                })
            },

            submitInfo() {
                this.$refs.form.validate().then(valid => {
                    if (this.form.images.length > 0) {
                        let urls = []
                        this.form.images.forEach(e => {
                            urls.push(e.name)
                        })
                        this.info.img = urls.join(",")
                    }
                    addCheckIn(this.info).then(res => {
                        uni.showToast({
                            title: '提交成功',
                            success() {
                                setTimeout(() => {
                                    this.$u.func.globalNavigator("", "navBack")
                                }, 1000)
                            }
                        })
                    })
                })
            }
        }
@@ -102,23 +135,26 @@
        margin: 20rpx 30rpx;
        padding: 0 30rpx;
    }
    .row{
        padding:20rpx 0;
        border-bottom:1px solid 

    .row {
        padding: 20rpx 0;
        border-bottom: 1px solid
    }
    .location-btn{
        width:116rpx;
        height:46rpx;

    .location-btn {
        width: 116rpx;
        height: 46rpx;
        line-height: 46rpx;
        border-radius: 4rpx;
        border:1px solid currentColor;
        padding:0;
        border: 1px solid currentColor;
        padding: 0;
        background-color: #fff;
    }

    .upload {
        margin: 0 30rpx;
        padding: 30rpx;

        .upload-item {
            width: 140rpx;
            height: 140rpx;
@@ -126,23 +162,26 @@
        }
    }

    .footer {
        width: 100%;
        padding: 30rpx;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 10;
        box-sizing: border-box;
    .address-row {
        flex: 1;
        justify-content: flex-end;
        align-items: center;
    }

        .footer-btn {
            width: 100%;
            height: 78rpx;
            line-height: 78rpx;
            background: linear-gradient(163deg, #01BDFC 0%, #017BFC 100%);
            border-radius: 8rpx;
            color: #fff;
            font-size: 32rpx;
        }
    .address-content {
        width: calc(100% - 116rpx - 20rpx);
        margin-right: 20rpx;
        text-align: right;
    }

    .location-btn {
        width: 116rpx;
        height: 46rpx;
        line-height: 46rpx;
        border-radius: 4rpx;
        border: 1px solid currentColor;
        padding: 0;
        background-color: #fff;
        text-align: center;
    }
</style>

 subPackage/user/family/edit.vue

@@ -161,10 +161,10 @@
                <button class="del-btn footer-btn"  @click="delAction">删除</button>
                <button class="save-btn footer-btn"   @click="submit">保存</button>
            </view>
            <view class="footer flex j-c-s-b a-i-c bgc-ff" v-if="type == 1">
                <button class="add-btn footer-btn"   @click="submit">提交</button>
            </view>
			
            <!-- <view class="footer flex j-c-s-b a-i-c bgc-ff" >
                <button class="add-btn footer-btn"   >提交</button>
            </view> -->
            <footer-btn  v-if="type == 1"  @click="submit"  />
            
        </view>

@@ -476,17 +476,17 @@
        
        
        .main {
            position: relative;
            height: 0;
            flex: 1;
            // position: relative;
            // height: 0;
            // flex: 1;
            display: flex;
            flex-direction: column;

            .content {
                height: 0;
                flex: 1;
                overflow-y: auto;
                padding-bottom: 120rpx;
                // height: 0;
                // flex: 1;
                // overflow-y: auto;
                padding-bottom: 160rpx;
                // padding-bottom: 36rpx;
            }

@@ -534,12 +534,16 @@
        bottom:0;
        left:0;
        backgroun-color:#fff;
        padding-bottom: env(safe-area-inset-bottom);
        .footer-btn {
            width:48%;
            height: 78rpx;
            line-height: 78rpx;
            border-radius: 8rpx 8rpx 8rpx 8rpx;
            font-size: 32rpx;
            color: #fff;
			
			
        }
    
        .add-btn {
@@ -548,13 +552,11 @@
        }
    
        .del-btn {
            width: 236rpx;
            background: linear-gradient(163deg, #FE6C5C 0%, #EA1F1F 99%);
    
        }
    
        .save-btn {
            width: 424rpx;
            background: linear-gradient(163deg, #01BDFC 0%, #017BFC 100%);
        }
    }

 subPackage/user/family/list.vue

@@ -16,10 +16,7 @@
                <button class="action-btn c-main f-24"   @click="navTo(2,item)">管理</button>
           </view>            
        </view>
		
        <view class="footer">
            <button class="footer-btn"  @click="navTo(1)">添加成员</button>
        </view>
        <footer-btn  text="添加成员"  @click="navTo(1)"  />
    </view>
</template>

@@ -83,25 +80,6 @@
        }
        .ml-40{
            margin-left:40rpx;
        }
    }
    .footer {
        width: 100%;
        padding: 30rpx;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 10;
        box-sizing: border-box;
	
        .footer-btn {
            width: 100%;
            height: 78rpx;
            line-height: 78rpx;
            background: linear-gradient(163deg, #01BDFC 0%, #017BFC 100%);
            border-radius: 8rpx;
            color: #fff;
            font-size: 32rpx;
        }
    }
</style>

 subPackage/user/password/index.vue

@@ -22,9 +22,12 @@
            </u-form>
        </view>
        <!-- <button class="confirm_btn" @click="confirm">保存</button>-->
        <view class="footer">
        <!-- <view class="footer">
            <button class="footer-btn"   @click="confirm">提交</button>
        </view>
        </view> -->
		
        <footer-btn   @click="confirm"  />
		
    </view>
</template>

@@ -194,24 +197,5 @@
        width: 90%;
        margin-top: 200rpx;
        border-radius: 20rpx;
    }
    .footer {
        width: 100%;
        padding: 30rpx;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 10;
        box-sizing: border-box;
       padding-bottom: calc( env(safe-area-inset-bottom) + 50rpx);
        .footer-btn {
            width: 100%;
            height: 78rpx;
            line-height: 78rpx;
            background: linear-gradient(163deg, #01BDFC 0%, #017BFC 100%);
            border-radius: 8rpx;
            color: #fff;
            font-size: 32rpx;
        }
    }
</style>

 subPackage/user/role/index.vue

@@ -4,9 +4,12 @@
            <role-list :roleData="roleData"  :current-id="selectRole.id"  @select="select"></role-list>
        </view>

        <view class="cur-btn"  v-if="roleData.length">
        <!-- <view class="cur-btn"  v-if="roleData.length">
            <u-button @click="submit" type="primary" text="确定"></u-button>
        </view>
        </view> -->
		
        <footer-btn  v-if="roleData.length"  text="确定"  @click="submit"  />
		

        <u-loading-page :loading="loading"></u-loading-page>
    </view>

 subPackage/workbench/views/rental.vue

@@ -1,9 +1,13 @@
<template>

    <view class="">

        <view class="header bgc-ff">

            <view class="filter-box">

            <!-- <view class="filter-box">

                <chenchuang-CCDropDownFilter :filterData='filterData' :defaultIndex='defaultIndex'

                    @onSelected='handleSelect'></chenchuang-CCDropDownFilter>

            </view> -->

            <view class="tabs">

                <u-tabs :list="tabsList" :current="tabIndex" @click="tabClick"  :inactiveStyle="{color:'#999999'}"

                :activeStyle="{color:'#017BFC'}"></u-tabs>

            </view>

            <view class="search-box">

                <u-search placeholder="请输入租户名" v-model="keyword" :clearabled="true" :showAction="true" :animation="true"

@@ -25,7 +29,7 @@
                    <view class="dot bgc-orange"></view>

                    <text class="f-24">短期3户 (3)人</text>

                </view> -->

                <view v-for="(item,index) in statistics" :key="index" class="row-item bgc-ff flex a-i-c"  >

                <view v-for="(item,index) in statistics" :key="index" class="row-item bgc-ff flex a-i-c">

                    <view v-if="item.term =='shortTerm' " class="dot bgc-orange"></view>

                    <view v-if="item.term =='middleTerm' " class="dot bgc-main"></view>

                    <view v-if="item.term =='longTerm' " class="dot bgc-green"></view>

@@ -33,7 +37,7 @@
                </view>

            </view>



            <view class="list bgc-ff" v-for="(records,index) in tenantList"  :key="index">

            <view class="list bgc-ff" v-for="(records,index) in tenantList" :key="index">

                <view class="flex j-c-s-b a-i-c">

                    <view class="flex a-i-c">

                        <text class="f-32 mr-50">{{ records.tenantName }}</text>

@@ -72,6 +76,34 @@
    export default {

        data() {

            return {



                tabsList: [{

                        name: '全部',

                        value: ''

                    },

                    {

                        name: '待确认',

                        value: '0'

                    },

                    {

                        name: '已确认',

                        value: '1'

                    },

                    {

                        name: '未到期',

                        value: '10'

                    },

                    {

                        name: '即将到期',

                        value: '20'

                    },

                    {

                        name: '已到期',

                        value: '30'

                    }

                ],





                filterData: [

                    [{

                            name: '全部',

@@ -143,6 +175,7 @@
                        value: 2

                    },

                ],

                tabIndex: 0

            }

        },

        computed: {

@@ -194,6 +227,16 @@
                    scrollTop: 0, // 滚动到页面的目标位置（单位px）

                });

            },





            tabClick(item) {

                this.tabIndex = item.index;

                this.pagingParams.auditStatus = item.value;

                this.getRentalHouseInfo()

                this.getStatistics(item.value)

            },





            getStatistics(auditStatus = '') {

                const {

                    roleName


 subPackage/workbench/views/rental.vue.bak

New file
@@ -0,0 +1,375 @@
<template>
    <view class="">
        <view class="header bgc-ff">
            <view class="filter-box">
                <chenchuang-CCDropDownFilter :filterData='filterData' :defaultIndex='defaultIndex'
                    @onSelected='handleSelect'></chenchuang-CCDropDownFilter>
            </view>
            <view class="search-box">
                <u-search placeholder="请输入租户名" v-model="keyword" :clearabled="true" :showAction="true" :animation="true"
                    @search="search" @clear="clear"></u-search>
            </view>
        </view>

        <view class="content">
            <view class="row flex  j-c-s-b a-i-c" v-if="tenantList.length">
                <!-- <view class="row-item bgc-ff flex a-i-c">
                    <view class="dot bgc-green"></view>
                    <text class="f-24">长期3户 (3)人</text>
                </view>
                <view class="row-item bgc-ff flex a-i-c">
                    <view class="dot bgc-main"></view>
                    <text class="f-24">中期3户 (3)人</text>
                </view>
                <view class="row-item bgc-ff flex a-i-c">
                    <view class="dot bgc-orange"></view>
                    <text class="f-24">短期3户 (3)人</text>
                </view> -->
                <view v-for="(item,index) in statistics" :key="index" class="row-item bgc-ff flex a-i-c"  >
                    <view v-if="item.term =='shortTerm' " class="dot bgc-orange"></view>
                    <view v-if="item.term =='middleTerm' " class="dot bgc-main"></view>
                    <view v-if="item.term =='longTerm' " class="dot bgc-green"></view>
                    <text class="f-24">{{formatTerm(item.term)}}{{item.total}}户 ({{item.personNum}})人</text>
                </view>
            </view>

            <view class="list bgc-ff" v-for="(records,index) in tenantList"  :key="index">
                <view class="flex j-c-s-b a-i-c">
                    <view class="flex a-i-c">
                        <text class="f-32 mr-50">{{ records.tenantName }}</text>
                        <view class="flex a-i-c">
                            <u-icon name="phone-fill" color="#017BFC"></u-icon>
                            <text class="f-28 ml-10">{{ records.phone || '未填写' }}</text>
                        </view>
                    </view>
                    <u-tag text="未到期" type="success" plain plainFill></u-tag>
                </view>
                <view class="list-address f-28 c-99">
                    {{ records.houseName }}
                </view>
                <view class="list-action flex ">
                    <view class="action-item" @click="tenantManage(records)">
                        <u-icon name="/static/icon/list-02.png" width="40rpx" height="40rpx"></u-icon>
                        <text class="f-28 c-main ml-10">租客管理</text>
                    </view>
                    <view class="action-item">
                        <u-icon name="/static/icon/list-01.png" width="40rpx" height="40rpx"></u-icon>
                        <text class="f-28 c-main ml-10">走访日志</text>
                    </view>
                </view>
            </view>
        </view>
        <u-toast ref="uToast"></u-toast>
        <u-loadmore :status="loadingStatus" loadmoreText="开始加载" loadingText="数据加载中" nomoreText="已经到底了" line />
    </view>
</template>

<script>
    import {
        getRentalHouseContent,
        getStatistics
    } from '@/api/houseRental/houseRental.js'
    export default {
        data() {
            return {
                filterData: [
                    [{
                            name: '全部',
                            value: ''
                        },
                        {
                            name: '待确认',
                            value: '0'
                        },
                        {
                            name: '已确认',
                            value: '1'
                        },
                        // {
                        //     name: '审核不通过',
                        //     value: '2'
                        // },
                        {
                            name: '未到期',
                            value: '10'
                        },
                        {
                            name: '即将到期',
                            value: '20'
                        },
                        {
                            name: '已到期',
                            value: '30'
                        }
                    ],
                    [{
                            name: '楼层',
                            value: ''
                        },
                        {
                            name: '1楼',
                            value: '1'
                        },
                        {
                            name: '2楼',
                            value: '2'
                        },
                        {
                            name: '3楼',
                            value: '3'
                        }
                    ]
                ],
                defaultIndex: [0, 0],
                keyword: "",
                statistics: [],
                tenantList: [],
                loadingStatus: 'nomore',
                pagingParams: {
                    current: 1,
                    size: 10
                },
                selectParams: {},
                tenantStatus: [{
                        name: '未到期',
                        value: 0
                    },
                    {
                        name: '已到期',
                        value: 1
                    },
                    {
                        name: '已终止',
                        value: 2
                    },
                ],
            }
        },
        computed: {
            formatTerm() {
                return (term => {
                    if (term == 'longTerm') {
                        return "长期"
                    } else if (term == 'middleTerm') {
                        return "中期"
                    } else if (term == 'shortTerm') {
                        return "短期"
                    }
                })
            }
        },
        onLoad() {
            this.currentRole = uni.getStorageSync('activeRole')
            this.getStatistics()
        },
        onShow() {
            this.tenantList = []
            this.getRentalHouseInfo()
        },
        onReachBottom() {
            this.pagingParams.current++
            this.getRentalHouseInfo()
        },
        methods: {
            handleSelect(res) {
                const [auditStatus, floor] = res
                this.resetParams()
                let params = {}
                if (auditStatus[0].value !== '') {
                    params = {
                        auditStatus: auditStatus[0].value
                    }
                }
                if (floor[0].value !== '') {
                    params = {
                        ...params,
                        floor: floor[0].value
                    }
                }
                this.selectParams = params
                this.getRentalHouseInfo()
                this.getStatistics(auditStatus[0].value)
                // 回到顶部，避免触发触底加载
                uni.pageScrollTo({
                    scrollTop: 0, // 滚动到页面的目标位置（单位px）
                });
            },
            getStatistics(auditStatus = '') {
                const {
                    roleName
                } = this.currentRole
                let params = {
                    roleName
                }
                if (auditStatus) {
                    params = {
                        auditStatus,
                        roleName
                    }
                }
                getStatistics(params).then(res => {
                    this.statistics = res.data
                })
            },
            findObjValue(value, obj) {
                const res = obj.find(item => {
                    return item.value == value
                })
                return res.name
            },
            async getRentalHouseInfo(params = {}) {
                this.$nextTick(() => {
                    this.loadingStatus = 'loadmore'
                    this.$refs.uToast.show({
                        type: 'loading',
                        message: '正在加载',
                        duration: 9999999
                    })
                })
                const {
                    roleName
                } = this.currentRole
                const {
                    code,
                    data: {
                        records
                    }
                } = await getRentalHouseContent({
                    tenantName: this.keyword,
                    ...this.pagingParams,
                    roleName,
                    ...this.selectParams
                })
                if (code !== 200) {
                    uni.showToast({
                        title: "数据请求错误",
                        icon: "error"
                    })
                    return
                }
                this.tenantList = [...this.tenantList, ...records]
                this.$nextTick(() => {
                    this.$refs.uToast.isShow = false
                })
                this.loadingStatus = 'nomore'
            },
            search() {
                this.resetParams()
                this.getRentalHouseInfo()
            },
            clear() {
                this.keyword = ''
                this.resetParams()
                this.search()
            },
            tenantManage({
                houseCode,
                id
            }) {
                this.$u.func.globalNavigator(`/subPackage/bs/views/rentDetail?houseCode=${houseCode}&id=${id}`)
            },
            resetParams() {
                this.tenantList = []
                this.pagingParams = {
                    current: 1,
                    size: 10
                }
            }
        }
    }
</script>

<style lang="scss">
    page {
        background-color: #F5F5F5;
    }

    .header {
        width: 100%;
        position: fixed;
        /*#ifdef H5*/
        top: 88rpx;
        /*#endif*/
        /*#ifdef MP-WEIXIN*/
        top: 0;
        /*#endif*/
        left: 0;
        z-index: 10;
    }

    .filter-box {
        width: 100%;
        height: 100rpx;

    }

    .search-box {
        padding: 20rpx 24rpx 30rpx;
    }

    .content {
        width: 100%;
        margin-top: 220rpx;
        padding: 0 30rpx;
        box-sizing: border-box;

        .row {
            width: 100%;
            padding: 20rpx 0;
        }

        .row-item {
            width: calc(100% / 3 - 10rpx);
            height: 46rpx;
            border-radius: 30rpx;
            padding: 0 20rpx;
            box-sizing: border-box;
        }

        .dot {
            width: 10rpx;
            height: 10rpx;
            border-radius: 50%;
            margin-right: 18rpx;
        }

        .bgc-green {
            background-color: #30D17C;
        }

        .bgc-orange {
            background-color: #FFAC3D;
        }

        .list {
            width: 100%;
            padding: 30rpx 30rpx 0;
            box-sizing: border-box;
            margin-bottom: 20rpx;
            border-radius: 8rpx;

            .list-address {
                padding: 30rpx 0;
            }

            .list-action {
                padding: 22rpx 0 30rpx;
                border-top: 1px solid #F5F5F5;
            }

            .action-item {
                display: flex;
                flex: 1;
                justify-content: center;
            }

            .action-item:first-child {
                border-right: 1px solid #DBDBDB;
            }

            .mr-50 {
                margin-right: 50rpx;
            }
        }
    }
</style>