|
@@ -0,0 +1,120 @@
|
|
|
+<template>
|
|
|
+ <view class="content">
|
|
|
+ <!-- message -->
|
|
|
+ <view class="messageBg">
|
|
|
+ <!-- 头像 -->
|
|
|
+ <view class="message line">
|
|
|
+ <view class="leftTitle">头像</view>
|
|
|
+ <image class="headImg" src='headUrl' mode=""></image>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 姓名 -->
|
|
|
+ <view class="message line">
|
|
|
+ <view class="leftTitle">姓名</view>
|
|
|
+ <view class="rightContent">张老师</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 所属部门 -->
|
|
|
+ <view class="message">
|
|
|
+ <view class="leftTitle">所属部门</view>
|
|
|
+ <view class="rightContent">总部一店</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 修改密码 -->
|
|
|
+ <view class="messageBg">
|
|
|
+ <view class="message" @click="changePW">
|
|
|
+ <view class="leftTitle">修改密码</view>
|
|
|
+ <image class="rightArrow" src="../../static/img/icon_zhanghu_arrow.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 退出登录 -->
|
|
|
+ <view class="logOut" @click="logOut">退出登录</view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ headUrl:'',
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ changePW(){
|
|
|
+ console.log('修改密码');
|
|
|
+ },
|
|
|
+ logOut(){
|
|
|
+ console.log('退出');
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ .content {
|
|
|
+ background-color: #F4F5F7;
|
|
|
+ min-height: 100vh;
|
|
|
+ padding: 20rpx 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* #ifdef H5 */
|
|
|
+ .content {
|
|
|
+ background-color: #F4F5F7;
|
|
|
+ min-height: calc(100vh - 44px);
|
|
|
+ padding: 20rpx 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* #endif */
|
|
|
+ .messageBg,
|
|
|
+ .logOut{
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ margin: 20rpx 0rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .message {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ line-height: 98rpx;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .line {
|
|
|
+ border-bottom: 1rpx solid #EEEEEE;
|
|
|
+ }
|
|
|
+
|
|
|
+ .headImg {
|
|
|
+ width: 72rpx;
|
|
|
+ height: 72rpx;
|
|
|
+ margin-right: 20rpx;
|
|
|
+ background-color: #007AFF;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .leftTitle {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #3C3C3C;
|
|
|
+ margin-left: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .rightContent {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #999999;
|
|
|
+ margin-right: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .rightArrow {
|
|
|
+ width: 14rpx;
|
|
|
+ height: 26rpx;
|
|
|
+ margin-right: 20rpx;
|
|
|
+ }
|
|
|
+ .logOut{
|
|
|
+ line-height: 98rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: #FF3B30;
|
|
|
+ }
|
|
|
+</style>
|