lsappBms/lss_vue/src/views/my/my.vue

<template>
	<div class="my">
        <div class="mybox userInfo" v-on:click="jumpTo(0)">
            <div class="left">
                <img src="../../assets/image/userHead.jpg">
            </div>
            <div class="right">
                <div>
                    <span class="name">张学</span>
                    <span class="phone">18255585207</span>
                </div>
                <div class="department">
                    ****公司****部门****组
                    <span class="arrow"><img src="../../assets/image/on_1.png"></span>
                </div>
            </div>
        </div>
        <div class="mybox">
            <mt-cell title="我的消息" is-link v-on:click.native="jumpTo(1)"><img slot="icon" src="../../assets/image/my_message.png" width="24" height="24"></mt-cell>
            <mt-cell title="我的资产" is-link v-on:click.native="jumpTo(2)"><img slot="icon" src="../../assets/image/my_assets.png" width="24" height="24"></mt-cell>
            <mt-cell title="我的评分" is-link v-on:click.native="jumpTo(3)"><img slot="icon" src="../../assets/image/my_score.png" width="24" height="24"></mt-cell>
            <mt-cell title="我的建议" is-link v-on:click.native="jumpTo(4)"><img slot="icon" src="../../assets/image/my_sug.png" width="24" height="24"></mt-cell>
        </div>
        <div class="mybox">
            <mt-cell title="通讯录" is-link v-on:click.native="jumpTo(5)"><img slot="icon" src="../../assets/image/my_com.png" width="24" height="24"></mt-cell>
            <mt-cell title="管理制度" is-link v-on:click.native="jumpTo(6)"><img slot="icon" src="../../assets/image/my_sys.png" width="24" height="24"></mt-cell>
        </div>
    </div>
</template>

<script>
	export default {
		data() {
			return {
                keyWord: "",
                list: [],
                labels: [],
                pageNum: 1,
                tagId: 0,
                popupVisible: false,
			}
		},
		methods: {
            jumpTo(type) {
                switch(type){
                    case 0:
                        console.log(1111)
                        break;
                    case 1:
                        console.log(1111)
                        break;
                    case 2:
                        console.log(1111)
                        break;
                    case 3:
                        console.log(1111)
                        break;
                    case 4:
                        console.log(1111)
                        break;
                    case 5:
                        console.log(1111)
                        break;
                    case 6:
                        console.log(1111)
                        break;
                    default:
                        return false
                        break;
                }
            }
        },
        created() {
        },
		mounted() {
            
		}
	}

</script>

<style scoped>
    .my {
        background: #EFEFEF;
    }

    .mybox {
        background: #fff;
        margin-bottom: 0.15rem;
    }

    .userInfo {
        padding: 0.22rem 0.2rem;
    }

    .left{
        float:left;
        margin-right: 0.15rem;
    }

    .left img {
        width: 0.6rem;
        height: 0.6rem;
        border-radius: 50%;
    }

    .right div{
        line-height: 0.3rem;
    }

    span.name {
        font-size: 0.16rem;
        font-weight: 600;
        margin: 0 0.15rem 0 0;
    }
    
    span.phone {
        font-size: 0.13rem;
        color: #9E9E9E;
    }

    div.department {
        font-size: 0.13rem;
        color: #9E9E9E;
    }

    span.arrow {
        float: right;
    }

    span.arrow img {
        transform: rotate(-90deg);
        -ms-transform: rotate(-90deg); /* IE 9 */
        -moz-transform: rotate(-90deg); /* Firefox */
        -webkit-transform: rotate(-90deg); /* Safari and Chrome */
        -o-transform: rotate(-90deg); /* Opera */
    }
</style>