个人中心页面修改

Lou

2023-12-15 0c6d636f7af87cd978349f014f11d79a5e47dc47

个人中心页面修改

 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.106:9528',
    devUrl: 'http://192.168.0.103:9528',
    // devUrl: 'https://srgdjczzxtpt.com:2080/api',
    minioBaseUrl: "https://srgdjczzxtpt.com:2080/gminio/jczz/",
    // minioBaseUrl:"http://192.168.0.103:9528/",

 pages.json

@@ -8,7 +8,7 @@
            "path": "pages/home/index",
            "style": {
                "navigationBarTitleText": "首页",
                "enablePullDownRefresh": true,
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        },

 pages/home/index.vue

@@ -383,14 +383,14 @@
                // immediate: true

            }

        },

        onPullDownRefresh() {

            this.$store.dispatch("getMenuList").then(res => {

                this.getMenuList()

            });

            setTimeout(() => {

                uni.stopPullDownRefresh();

            }, 300)

        },

        // onPullDownRefresh() {

        //     this.$store.dispatch("getMenuList").then(res => {

        //         this.getMenuList()

        //     });

        //     setTimeout(() => {

        //         uni.stopPullDownRefresh();

        //     }, 300)

        // },



        methods: {



@@ -454,7 +454,7 @@


            async getNoticeList() {

                const param = {

                    size: 10,

                    size: 5,

                    current: 1,

                    houseCode: uni.getStorageSync("siteInfo").houseCode

                }


 pages/user/center.vue

@@ -1,64 +1,86 @@
<template>
    <view class="">
        <view class="header flex a-i-c c-ff">
            <u-avatar :src="userInfo.avatar" size="80"></u-avatar>
            <view class="flex f-d-c ml-30" v-if="isLogin">
                <text class="f-36 mb-20 fw" v-if="userInfo.nick_name">{{userInfo.nick_name}}</text>
                <text class="f-36 mb-20 fw" v-else>{{userInfo.user_name}}</text>
                <!-- <text class="f-28 c-99">您好业主，欢迎回家</text> -->
    <view class="container">
        <view class="head">
            <!-- <u-navbar :is-fixed="false" :border-bottom="false"  title="个人中心" :background="{ background: 'transprent' }" title-color="#FFFFFF">
                <view @click="$u.func.route('/pages/system/setting')" slot="right">
                    <image src="/static/images/user/setting.png" class="set-icon" mode="widthFix"></image>
                </view>
            </u-navbar> -->
            <image src="/static/img/center-bg.png" class="head-bg" />

            <!-- 用户信息 -->
            <view class="user-box">
                <view class="left">
                    <image v-if="userInfo.avatar" :src="userInfo.avatar" class="avatar" mode="aspectFill"></image>
                    <image v-else src="/static/icon/user-01.png" class="avatar" mode="aspectFill"></image>
                    <view class="user-name">{{ userInfo.nick_name }}</view>
                    <!-- <view class="tag">{{ userInfo.tenant_id }}</view> -->
                </view>
                <view @click="navigator('/subPackage/user/editUserInfo/editUserInfo')" class="edit-btn">编辑资料</view>
            </view>
            <view class="flex f-d-c ml-20" v-if="!isLogin" @click="navToLogin()">
                <text class="f-36 mb-20 fw">未登录</text>
                <!-- <text class="f-28 c-99">您好业主，欢迎回家</text> -->
            <!-- 操作按钮 -->
            <view class="nav"  v-if="roleType == 1">
                <navigator url="/subPackage/user/family/list" hover-class="none" class="nav-item">
                    <!-- <image src="/static/images/user/n1.png" class="icon" mode=""></image> -->
                    <u-icon name="account"  color="#fff"  size="28"></u-icon>
                    <view class="name">我的家人</view>
                </navigator>
                <navigator url="/subPackage/house/roomDetails/index" hover-class="none" class="nav-item">
                    <!-- <image src="/static/images/user/n2.png" class="icon" mode=""></image> -->
                        <u-icon name="home"  color="#fff"  size="28"></u-icon>
                    <view class="name">我的房屋</view>
                </navigator>
                <navigator url="/subPackage/user/district/index" hover-class="none" class="nav-item">
                    <!-- <image src="/static/images/user/n3.png" class="icon" mode=""></image> -->
                    <u-icon name="map"  color="#fff"  size="28"></u-icon>
                    <view class="name">我的小区</view>
                </navigator>
                <navigator url="/subPackage/bs/views/zhsb" hover-class="none" class="nav-item">
                    <!-- <image src="/static/images/user/n4.png" class="icon" mode=""></image> -->
                    <u-icon name="file-text"  color="#fff"  size="28"></u-icon>
                    <view class="name">出租信息</view>
                </navigator>
            </view>
			
            <view  v-if="isLogin"  class="setting flex a-i-c j-c-c"  @click="navigator('/subPackage/user/editUserInfo/editUserInfo')">
                <u-icon name="setting"  size="30"  color="#fff"></u-icon>
            </view>
			
        </view>

        <view class="main" v-if="isLogin">
            <view class="nav bgc-ff flex j-c-s-a a-i-c" v-if="roleType == 1">
                <view v-for="(item,index) in navList" :key="index" class="flex f-d-c a-i-c"
                    @click="navigator(item.url)">
                    <u-icon :customStyle="{paddingTop:20+'rpx'}" :name="item.icon" width="90rpx"
                        height="90rpx"></u-icon>
                    <text class="grid-text mt-20 f-28">{{item.title}}</text>
                </view>
            </view>
            <view class="main-cell bgc-ff">
                <view class="cell-content">
                    <view class="cell-item flex j-c-s-b a-i-c" @click="navigator('/subPackage/user/family/list')"
                        v-if="roleType == 1">
                        <view class="flex a-i-c">
                            <u-icon name="/static/icon/menu-center-01.png" width="60rpx" height="60rpx"></u-icon>
                            <text class="f-30 ml-20">我的家人</text>
                        </view>
                        <u-icon name="arrow-right" color="#999"></u-icon>
                    </view>

                    <view class="cell-item flex j-c-s-b a-i-c" v-for="(item,index) in menuList" :key="index"
                        @click="navigator(item.url)">
                        <view class="flex a-i-c">
                            <u-icon :name="item.icon" width="60rpx" height="60rpx"></u-icon>
                            <text class="f-30 ml-20">{{item.title}}</text>
                        </view>
                        <u-icon name="arrow-right" color="#999"></u-icon>
                    </view>

                    <view class="cell-item flex j-c-s-b a-i-c" @click="logOut()">
                        <view class="flex a-i-c">
                            <u-icon name="/static/icon/menu-center-04.png" width="60rpx" height="60rpx"></u-icon>
                            <text class="f-30 ml-20">退出登录</text>
                        </view>
                        <u-icon name="arrow-right" color="#999"></u-icon>
                    </view>

                </view>
            </view>
			
            <!-- <button  @click="navigator('test')"> 测试</button> -->
        <!-- 功能列表 -->
        <!-- <view class="cell-box">
            <u-cell-group :border="false">
                <u-cell-item title="我的评价">
                    <image slot="icon" src="/static/images/user/c1.png" class="icon" mode=""></image>
                </u-cell-item>
                <u-cell-item title="常见问题">
                    <image slot="icon" src="/static/images/user/c2.png" class="icon" mode=""></image>
                </u-cell-item>
                <u-cell-item title="客服中心" :border-bottom="false">
                    <image slot="icon" src="/static/images/user/c3.png" class="icon" mode=""></image>
                </u-cell-item>
            </u-cell-group>
        </view> -->
        <view class="cell-box">
            <u-cell-group :border="false" icon="star"  :customStyle="{fontSize:'26rpx',color:'#585b61'}">
                <u-cell title="切换角色"   isLink  url="/subPackage/user/role/index">
                    <image slot="icon" src="/static/icon/menu-center-02.png" class="icon" mode=""></image>
                </u-cell>
                <u-cell title="修改密码"  :border="false"   isLink  url="/subPackage/user/password/index">
                    <image slot="icon" src="/static/icon/menu-center-03.png" class="icon" mode=""></image>
                </u-cell>
                <!-- <u-cell-item title="评分">
                    <image slot="icon" src="/static/images/user/c5.png" class="icon" mode=""></image>
                </u-cell-item>
                <u-cell-item title="反馈">
                    <image slot="icon" src="/static/images/user/c6.png" class="icon" mode=""></image>
                </u-cell-item>
                <u-cell-item title="关于" :border-bottom="false">
                    <image slot="icon" src="/static/images/user/c7.png" class="icon" mode=""></image>
                </u-cell-item> -->
            </u-cell-group>
        </view>
        <view class="cell-box">
            <u-cell-group :border="false">
                <u-cell title="退出登录"   :border="false" @click="logOut"  isLink>
                    <image slot="icon" src="/static/icon/menu-center-04.png" class="icon" mode=""></image>
                </u-cell>
            </u-cell-group>
        </view>
    </view>
</template>
@@ -67,6 +89,7 @@
    export default {
        data() {
            return {
                headHeight: 582,
                menuList: [{
                        icon: "/static/icon/menu-center-02.png",
                        title: "切换角色",
@@ -78,28 +101,10 @@
                        url: "/subPackage/user/password/index"
                    }
                ],
                navList: [{
                        icon: "/static/icon/nav-center-01.png",
                        title: "我的房屋",
                        url: "/subPackage/house/roomDetails/index"
                    },
                    {
                        icon: "/static/icon/nav-center-02.png",
                        title: "我的小区",
                        url: "/subPackage/user/district/index"
                    },
                    {
                        icon: "/static/icon/nav-center-03.png",
                        title: "出租信息",
                        url: "/subPackage/bs/views/zhsb"
                    },
                ],
                roleType: 1
                // userInfo:{}
            }
            };
        },


		
        onShow() {
            let role = uni.getStorageSync('activeRole')
            if (role.roleAlias == "inhabitant") {
@@ -108,23 +113,32 @@
                this.roleType = 2;
            }
        },

		
        mounted() {
            this.setHeadHeight()
        },
        methods: {
            change(index) {
                let url = index
                this.$u.func.globalNavigator(url, "switchTab")
            setHeadHeight() {
                const that = this
			
                uni.getSystemInfo({
                    success: function(res) {
                        that.headHeight = Number(res.statusBarHeight) + Number(res.platform == 'ios' ? 44 : 48) + 582
                    }
                });
				
            },

			
            navigator(url) {
                this.$u.func.globalNavigator(url)
            },

			
            navToLogin() {
                uni.redirectTo({
                    url: "/pages/login/login-account"
                })
            },

			
            logOut() {
                uni.showModal({
                    title: "提示",
@@ -144,57 +158,158 @@
            
            
        }
    }
    };
</script>

<style lang="scss">
    page {
        width: 100%;
        height: 100%;
        background-color: #f5f5f5;
        /* background: linear-gradient(96deg, #E2EFFF 0%, rgba(255, 255, 255, 0) 100%); */
    .container {
        background-color: #f7f7f7;
        min-height: 100vh;
        overflow: hidden;
    }

    .header {
        width: 100%;
        height: 600rpx;
        padding: 120rpx 38rpx;
        box-sizing: border-box;
        background: linear-gradient(180deg, #017BFC 0%, rgba(1, 123, 252, 0) 100%);
    }
    .setting{
        position: fixed;
        width:40rpx;
        height:40rpx;
        right:38rpx;
        top:200rpx;
    }
    .head {
        position: relative;
        top: 0;
        left: 0;
        z-index: 1;
        min-height: 582rpx;
        overflow: hidden;
        background: #55A2F9;

    .main {
        margin: -120rpx 30rpx 0;

        .nav {
            width: 100%;
            padding: 20rpx 0;
            margin-bottom: 20rpx;
            border-radius: 10rpx;
        .set-icon {
            vertical-align: middle;
            width: 41rpx;
            height: auto;
            margin-right: 35rpx;
        }

        .main-cell {
            border-radius: 10rpx;
        }

        .cell-item {
            width: 100%;
            padding: 30rpx;
            border-bottom: 1px solid #f5f5f5;
            color: #333;
            box-sizing: border-box;

        }

        .cell-item:last-child {
            border-bottom: none;
        .head-bg {
            position: absolute;
            left: 0px;
            top: 0px;
            z-index: -1;
            width: 750rpx;
            height: 582rpx;
            background: #55A2F9;
        }
    }
</style>

    .user-box {
        display: flex;
        justify-content: space-between;
        padding: 0 20rpx 0 64rpx;
        margin-top: 160rpx;

        .left {
            display: flex;
            flex-direction: column;
            align-items: center;

            .avatar {
                width: 128rpx;
                height: 128rpx;
                background: #ffffff;
                border-radius: 50%;
            }

            .user-name {
                margin-top: 20rpx;
                font-size: 36rpx;
                font-family: Source Han Sans CN;
                font-weight: 500;
                color: #ffffff;
            }

            .tag {
                margin-top: 20rpx;
                display: flex;
                justify-content: center;
                align-items: center;
                padding: 5rpx 16rpx;
                border: 1px solid #f5f5f5;
                border-radius: 7rpx;

                font-size: 19rpx;
                font-family: Source Han Sans CN;
                font-weight: 300;
                color: #ffffff;
            }
        }

        .edit-btn {
            margin-top: 20rpx;
            flex-shrink: 0;
            display: flex;
            justify-content: center;
            align-items: center;

            width: 165rpx;
            height: 54rpx;
            border: 2rpx solid #f5f5f5;
            border-radius: 11rpx;

            font-size: 27rpx;
            font-family: Source Han Sans CN;
            font-weight: 400;
            color: #ffffff;
        }
    }

    .nav {
        display: flex;
        //border-top: 2rpx solid #7dcdd6;
        margin: 94rpx 38rpx 0;
        padding: 36rpx 0 42rpx;

        .nav-item {
            width: calc(100% / 4);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;

            font-size: 25rpx;
            font-family: Source Han Sans CN;
            font-weight: 400;
            color: #ffffff;

            &:not(:last-of-type) {
                position: relative;

                &::after {
                    position: absolute;
                    right: 0;
                    top: 50%;
                    transform: translateY(-50%);
                    content: '';
                    display: block;
                    width: 2rpx;
                    background-color: #fff;
                    height: 30rpx;
                }
            }

            .icon {
                width: 48rpx;
                height: 48rpx;
                margin-bottom: 6rpx;
            }
        }
    }

    .cell-box {
        background: #ffffff;
        margin: 18rpx;

        .icon {
            width: 50rpx;
            height: 50rpx;
            margin-right: 22rpx;
        }
    }
	
    /deep/ .u-cell__title-text{
        font-size:26rpx !important;
    }
</style>

 pages/user/center3.vue

New file
@@ -0,0 +1,200 @@
<template>
    <view class="">
        <view class="header flex a-i-c c-ff">
            <u-avatar :src="userInfo.avatar" size="80"></u-avatar>
            <view class="flex f-d-c ml-30" v-if="isLogin">
                <text class="f-36 mb-20 fw" v-if="userInfo.nick_name">{{userInfo.nick_name}}</text>
                <text class="f-36 mb-20 fw" v-else>{{userInfo.user_name}}</text>
                <!-- <text class="f-28 c-99">您好业主，欢迎回家</text> -->
            </view>
            <view class="flex f-d-c ml-20" v-if="!isLogin" @click="navToLogin()">
                <text class="f-36 mb-20 fw">未登录</text>
                <!-- <text class="f-28 c-99">您好业主，欢迎回家</text> -->
            </view>
			
            <view  v-if="isLogin"  class="setting flex a-i-c j-c-c"  @click="navigator('/subPackage/user/editUserInfo/editUserInfo')">
                <u-icon name="setting"  size="30"  color="#fff"></u-icon>
            </view>
			
        </view>

        <view class="main" v-if="isLogin">
            <view class="nav bgc-ff flex j-c-s-a a-i-c" v-if="roleType == 1">
                <view v-for="(item,index) in navList" :key="index" class="flex f-d-c a-i-c"
                    @click="navigator(item.url)">
                    <u-icon :customStyle="{paddingTop:20+'rpx'}" :name="item.icon" width="90rpx"
                        height="90rpx"></u-icon>
                    <text class="grid-text mt-20 f-28">{{item.title}}</text>
                </view>
            </view>
            <view class="main-cell bgc-ff">
                <view class="cell-content">
                    <view class="cell-item flex j-c-s-b a-i-c" @click="navigator('/subPackage/user/family/list')"
                        v-if="roleType == 1">
                        <view class="flex a-i-c">
                            <u-icon name="/static/icon/menu-center-01.png" width="60rpx" height="60rpx"></u-icon>
                            <text class="f-30 ml-20">我的家人</text>
                        </view>
                        <u-icon name="arrow-right" color="#999"></u-icon>
                    </view>

                    <view class="cell-item flex j-c-s-b a-i-c" v-for="(item,index) in menuList" :key="index"
                        @click="navigator(item.url)">
                        <view class="flex a-i-c">
                            <u-icon :name="item.icon" width="60rpx" height="60rpx"></u-icon>
                            <text class="f-30 ml-20">{{item.title}}</text>
                        </view>
                        <u-icon name="arrow-right" color="#999"></u-icon>
                    </view>

                    <view class="cell-item flex j-c-s-b a-i-c" @click="logOut()">
                        <view class="flex a-i-c">
                            <u-icon name="/static/icon/menu-center-04.png" width="60rpx" height="60rpx"></u-icon>
                            <text class="f-30 ml-20">退出登录</text>
                        </view>
                        <u-icon name="arrow-right" color="#999"></u-icon>
                    </view>

                </view>
            </view>
			
            <!-- <button  @click="navigator('test')"> 测试</button> -->
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                menuList: [{
                        icon: "/static/icon/menu-center-02.png",
                        title: "切换角色",
                        url: "/subPackage/user/role/index"
                    },
                    {
                        icon: "/static/icon/menu-center-03.png",
                        title: "修改密码",
                        url: "/subPackage/user/password/index"
                    }
                ],
                navList: [{
                        icon: "/static/icon/nav-center-01.png",
                        title: "我的房屋",
                        url: "/subPackage/house/roomDetails/index"
                    },
                    {
                        icon: "/static/icon/nav-center-02.png",
                        title: "我的小区",
                        url: "/subPackage/user/district/index"
                    },
                    {
                        icon: "/static/icon/nav-center-03.png",
                        title: "出租信息",
                        url: "/subPackage/bs/views/zhsb"
                    },
                ],
                roleType: 1
                // userInfo:{}
            }
        },


        onShow() {
            let role = uni.getStorageSync('activeRole')
            if (role.roleAlias == "inhabitant") {
                this.roleType = 1
            } else {
                this.roleType = 2;
            }
        },

        methods: {
            change(index) {
                let url = index
                this.$u.func.globalNavigator(url, "switchTab")
            },

            navigator(url) {
                this.$u.func.globalNavigator(url)
            },

            navToLogin() {
                uni.redirectTo({
                    url: "/pages/login/login-account"
                })
            },

            logOut() {
                uni.showModal({
                    title: "提示",
                    content: "是否要退出该账号？",
                    success: (res) => {
                        if (res.confirm) {
                            uni.setStorageSync("responIndex", 0)
                            uni.clearStorageSync()
                            uni.reLaunch({
                                url: "/pages/login/login-account"
                            })
                        }
                    }
                })
            },
			
			
			
        }
    }
</script>

<style lang="scss">
    page {
        width: 100%;
        height: 100%;
        background-color: #f5f5f5;
        /* background: linear-gradient(96deg, #E2EFFF 0%, rgba(255, 255, 255, 0) 100%); */
    }

    .header {
        width: 100%;
        height: 600rpx;
        padding: 120rpx 38rpx;
        box-sizing: border-box;
        background: linear-gradient(180deg, #017BFC 0%, rgba(1, 123, 252, 0) 100%);
    }
    .setting{
        position: fixed;
        width:40rpx;
        height:40rpx;
        right:38rpx;
        top:200rpx;
    }

    .main {
        margin: -120rpx 30rpx 0;

        .nav {
            width: 100%;
            padding: 20rpx 0;
            margin-bottom: 20rpx;
            border-radius: 10rpx;
        }

        .main-cell {
            border-radius: 10rpx;
        }

        .cell-item {
            width: 100%;
            padding: 30rpx;
            border-bottom: 1px solid #f5f5f5;
            color: #333;
            box-sizing: border-box;

        }

        .cell-item:last-child {
            border-bottom: none;
        }
    }
</style>

 pages/user/center4.vue

File was deleted

 static/img/center-bg.png

 subPackage/house/houseNumber/index.vue

@@ -21,7 +21,7 @@
                    <box-title title="综治网格"></box-title>

                    <view class="sore">

                        <view class="red citem"></view>

                        <view class="orange citem">85.9</view>

                        <view class="orange citem"></view>

                        <view class="green citem"></view>

                    </view>

                </view>

@@ -44,7 +44,7 @@
                    <box-title title="公安网格"></box-title>

                    <view class="sore">

                        <view class="red citem"></view>

                        <view class="orange citem">85.9</view>

                        <view class="orange citem"></view>

                        <view class="green citem"></view>

                    </view>

                </view>