个人-设置页面初步搭建

pages.json

@@ -17,7 +17,7 @@
 			"path" : "pages/user/user",
 			"style" :
 			{
-				"navigationBarTitleText" : "个人中心"
+				"navigationStyle": "custom"
 			}
 		},
 		{
@@ -26,6 +26,13 @@
 			{
 				"navigationBarTitleText" : "学习项目"
 			}
+		},
+		{
+			"path" : "pages/user/settings",
+			"style" : 
+			{
+				"navigationBarTitleText" : "设置"
+			}
 		}
 	],
 	"tabBar": {

pages/learnProj/learnProj.vue

@@ -330,6 +330,7 @@
               height: 100%;
               border-radius: 50%;
               overflow: hidden;
+              margin-right: 10rpx;
 
               image{
 
@@ -344,7 +345,6 @@
 
               flex: 1;
               box-sizing: border-box;
-              padding-left: 5rpx;
               font-size: 12px;
               display: flex;
               flex-direction: column;

pages/user/settings.vue

@@ -0,0 +1,118 @@
+<template>
+	<view class="page">
+    <u-cell-group
+        style="width: 100%;
+        margin: 15rpx auto;
+        background-color: #fff;
+        box-sizing: border-box;
+        padding: 10rpx 20rpx;
+        box-shadow: #EFEFEF 2px 2px;
+        border-radius: 15rpx"
+        :border="false"
+    >
+      <u-cell
+          title="账号管理"
+          :isLink="true"
+          :border="false"
+          style="border-bottom: 1px solid #E9E9E9"
+      >
+      </u-cell>
+      <u-cell
+          title="选择公司"
+          :isLink="true"
+          :border="false"
+      >
+      </u-cell>
+    </u-cell-group>
+    <u-cell-group
+        style="width: 100%;
+        margin: 15rpx auto;
+        background-color: #fff;
+        box-sizing: border-box;
+        padding: 10rpx 20rpx;
+        box-shadow: #EFEFEF 2px 2px;
+        border-radius: 15rpx"
+        :border="false"
+    >
+      <u-cell
+          title="注销账号"
+          :isLink="true"
+          :border="false"
+          style="border-bottom: 1px solid #E9E9E9"
+      >
+      </u-cell>
+      <u-cell
+          title="关于我们"
+          :isLink="true"
+          :border="false"
+      >
+      </u-cell>
+    </u-cell-group>
+    <view
+        class="exit-log"
+        @click="exitLog"
+    >
+      退出登录
+    </view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		methods: {
+      exitLog() {
+        uni.showModal({
+          title: '退出登录',
+          content: '确定退出登录吗？',
+          success:(res) => {
+            if(res.confirm) {
+              uni.clearStorageSync()
+              uni.reLaunch({
+                url: '/pages/login/login'
+              })
+            }
+          }
+        })
+      }
+		}
+	}
+</script>
+
+<style lang="scss">
+
+  .page{
+
+    width: 100vw;
+    height: 100vh;
+    background-color: #F8F8F8;
+    box-sizing: border-box;
+    padding: 5vw;
+    position: relative;
+
+    .exit-log{
+
+      position: absolute;
+      left: 10%;
+      bottom: 10%;
+      width: 80%;
+      box-sizing: border-box;
+      padding: 30rpx 0;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      background-color: #1989FA;
+      font-size: 18px;
+      font-weight: bold;
+      color: #fff;
+      border-radius: 30px;
+
+    }
+
+  }
+
+</style>

pages/user/user.vue

@@ -1,6 +1,44 @@
 <template>
-	<view>
-		个人中心
+	<view class="page">
+    <view class="user-edit">
+      <view class="user-avatar">
+        <image src="/static/avatar.jpg"></image>
+      </view>
+      <view class="user-info">
+        <span style="font-size: 24px">马晓峰</span>
+        <span style="font-size: 12px; color: #8A8A8B">云南送变电培训中心</span>
+      </view>
+      <view class="edit-btn">
+        <view>修改资料</view>
+      </view>
+    </view>
+    <view class="learn-infos">
+      <view>
+        <span>{{ learnStats.selfLearn }}</span>
+        <span>我的自学</span>
+      </view>
+      <view>
+        <span>{{ learnStats.totalHrs }}</span>
+        <span>累计学时</span>
+      </view>
+      <view>
+        <span>{{ learnStats.totalCer }}</span>
+        <span>已获证书</span>
+      </view>
+    </view>
+    <view class="secs">
+      <view
+          class="single-sec"
+          v-for="(item, index) in secList"
+          :key="item.id"
+          @click="jumpUrl(item.path)"
+      >
+        <view class="lef-icon">
+          <image :src="item.src"></image>
+        </view>
+        <view style="margin-left: 2vw">{{ item.title }}</view>
+      </view>
+    </view>
 	</view>
 </template>
 
@@ -8,15 +46,175 @@
 	export default {
 		data() {
 			return {
-				
+        // 信息参数
+        learnStats: {
+          selfLearn: 17,
+          totalHrs: 218,
+          totalCer: 26
+        },
+        secList: [
+          { id: 1, title: '切换门户', src: '/static/changeGate.png', path: 'changeGate' },
+          { id: 2, title: '人脸识别', src: '/static/faceScan.png', path: 'faceScan' },
+          { id: 3, title: '我的消息', src: '/static/myMsg.png', path: 'myMsg' },
+          { id: 4, title: '设置', src: '/static/settings.png', path: 'settings' },
+        ]
 			}
 		},
 		methods: {
-			
+      jumpUrl(path) {
+        uni.navigateTo({
+          url: `/pages/user/${path}`
+        })
+      }
 		}
 	}
 </script>
 
-<style>
+<style lang="scss">
+
+  .page{
+
+    width: 100vw;
+    height: 100vh;
+    background: linear-gradient(#EAF0F7, #F8F8F8);
+    box-sizing: border-box;
+    padding: 15vh 8vw;
+
+    .user-edit{
+
+      width: 100%;
+      height: 10vh;
+      display: flex;
+      margin-bottom: 3vh;
+
+      .user-avatar{
+
+        width: 25%;
+        height: 100%;
+        border-radius: 50%;
+        overflow: hidden;
+
+        image{
+
+          width: 100%;
+          height: 100%;
+
+        }
+
+      }
+
+      .user-info{
+
+        width: 50%;
+        height: 100%;
+        box-sizing: border-box;
+        padding: 5%;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-around;
+
+      }
+
+      .edit-btn{
+
+        flex: 1;
+        display: flex;
+
+        view{
+
+          width: 100%;
+          height: 35%;
+          background: linear-gradient(90deg, #6DCDFA, #4BA2F9);
+          color: #fff;
+          margin: auto;
+          border-radius: 20px;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          font-size: 12px;
+
+        }
+
+      }
+
+    }
+
+    .learn-infos{
+
+      width: 100%;
+      height: 12vh;
+      background: #fff;
+      border-radius: 15rpx;
+      box-shadow: #F1F1F2 2px 2px;
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      margin-bottom: 2vh;
+
+      view{
+
+        width: 25%;
+        height: 50%;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-around;
+        align-items: center;
+
+        span:first-child{
+
+          font-size: 20px;
+          font-weight: bold;
+
+        }
+
+        span:last-child{
+
+          font-size: 12px;
+          color: #767676;
+
+        }
+
+      }
+
+    }
+
+    .secs{
+
+      width: 100%;
+      background-color: #fff;
+      border-radius: 15rpx;
+      box-sizing: border-box;
+      padding: 4vh 3vw;
+      color: #727272;
+
+      .single-sec{
+
+        width: 100%;
+        box-sizing: border-box;
+        padding: 10px 0;
+        font-size: 14px;
+        display: flex;
+        align-items: center;
+        border-bottom: 1px solid #F6F6F6;
+
+        .lef-icon{
+
+          width: 5%;
+          height: 2vh;
+
+          image{
+
+            width: 100%;
+            height: 100%;
+
+          }
+
+        }
+
+      }
+
+    }
+
+  }
 
 </style>

uni_modules/zb-dropdown-menu/components/zb-dropdown-menu/zb-dropdown-menu.vue

@@ -238,7 +238,7 @@ export default {
   max-width: 100%;
   padding: 0 8px;
   color: #323233;
-  font-size: 15px;
+  font-size: 13px;
   line-height: 22px;
 }
 

unpackage/dist/dev/app-plus/app-config-service.js

@@ -1,8 +1,8 @@
 
 var isReady=false;var onReadyCallbacks=[];
 var isServiceReady=false;var onServiceReadyCallbacks=[];
-var __uniConfig = {"pages":["pages/login/login","pages/index/index","pages/user/user","pages/learnProj/learnProj"],"window":{"navigationBarTextStyle":"black","navigationBarTitleText":"uni-app","navigationBarBackgroundColor":"#F8F8F8","backgroundColor":"#F8F8F8"},"tabBar":{"color":"#2c2c2c","selectedColor":"#1296db","borderStyle":"black","backgroundColor":"#FFFFFF","iconWidth":"24px","list":[{"pagePath":"pages/index/index","iconPath":"static/home.png","selectedIconPath":"static/homeSelected.png","text":"首页"},{"pagePath":"pages/user/user","iconPath":"static/my.png","selectedIconPath":"static/mySelected.png","text":"我的"}]},"darkmode":false,"nvueCompiler":"uni-app","nvueStyleCompiler":"uni-app","renderer":"auto","splashscreen":{"alwaysShowBeforeRender":true,"autoclose":false},"appname":"YNEduApp","compilerVersion":"4.23","entryPagePath":"pages/login/login","networkTimeout":{"request":60000,"connectSocket":60000,"uploadFile":60000,"downloadFile":60000}};
-var __uniRoutes = [{"path":"/pages/login/login","meta":{"isQuit":true},"window":{"navigationStyle":"custom"}},{"path":"/pages/index/index","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"首页"}},{"path":"/pages/user/user","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"个人中心"}},{"path":"/pages/learnProj/learnProj","meta":{},"window":{"navigationBarTitleText":"学习项目"}}];
+var __uniConfig = {"pages":["pages/login/login","pages/index/index","pages/user/user","pages/learnProj/learnProj","pages/user/settings"],"window":{"navigationBarTextStyle":"black","navigationBarTitleText":"uni-app","navigationBarBackgroundColor":"#F8F8F8","backgroundColor":"#F8F8F8"},"tabBar":{"color":"#2c2c2c","selectedColor":"#1296db","borderStyle":"black","backgroundColor":"#FFFFFF","iconWidth":"24px","list":[{"pagePath":"pages/index/index","iconPath":"static/home.png","selectedIconPath":"static/homeSelected.png","text":"首页"},{"pagePath":"pages/user/user","iconPath":"static/my.png","selectedIconPath":"static/mySelected.png","text":"我的"}]},"darkmode":false,"nvueCompiler":"uni-app","nvueStyleCompiler":"uni-app","renderer":"auto","splashscreen":{"alwaysShowBeforeRender":true,"autoclose":false},"appname":"YNEduApp","compilerVersion":"4.23","entryPagePath":"pages/login/login","networkTimeout":{"request":60000,"connectSocket":60000,"uploadFile":60000,"downloadFile":60000}};
+var __uniRoutes = [{"path":"/pages/login/login","meta":{"isQuit":true},"window":{"navigationStyle":"custom"}},{"path":"/pages/index/index","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"首页"}},{"path":"/pages/user/user","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationStyle":"custom"}},{"path":"/pages/learnProj/learnProj","meta":{},"window":{"navigationBarTitleText":"学习项目"}},{"path":"/pages/user/settings","meta":{},"window":{"navigationBarTitleText":"设置"}}];
 __uniConfig.onReady=function(callback){if(__uniConfig.ready){callback()}else{onReadyCallbacks.push(callback)}};Object.defineProperty(__uniConfig,"ready",{get:function(){return isReady},set:function(val){isReady=val;if(!isReady){return}const callbacks=onReadyCallbacks.slice(0);onReadyCallbacks.length=0;callbacks.forEach(function(callback){callback()})}});
 __uniConfig.onServiceReady=function(callback){if(__uniConfig.serviceReady){callback()}else{onServiceReadyCallbacks.push(callback)}};Object.defineProperty(__uniConfig,"serviceReady",{get:function(){return isServiceReady},set:function(val){isServiceReady=val;if(!isServiceReady){return}const callbacks=onServiceReadyCallbacks.slice(0);onServiceReadyCallbacks.length=0;callbacks.forEach(function(callback){callback()})}});
 service.register("uni-app-config",{create(a,b,c){if(!__uniConfig.viewport){var d=b.weex.config.env.scale,e=b.weex.config.env.deviceWidth,f=Math.ceil(e/d);Object.assign(__uniConfig,{viewport:f,defaultFontSize:Math.round(f/20)})}return{instance:{__uniConfig:__uniConfig,__uniRoutes:__uniRoutes,global:void 0,window:void 0,document:void 0,frames:void 0,self:void 0,location:void 0,navigator:void 0,localStorage:void 0,history:void 0,Caches:void 0,screen:void 0,alert:void 0,confirm:void 0,prompt:void 0,fetch:void 0,XMLHttpRequest:void 0,WebSocket:void 0,webkit:void 0,print:void 0}}}});