diff --git a/src/assets/images/tab_left_active.png b/src/assets/images/tab_left_active.png
new file mode 100644
index 0000000..a20bd8a
Binary files /dev/null and b/src/assets/images/tab_left_active.png differ
diff --git a/src/assets/images/tab_right_active.png b/src/assets/images/tab_right_active.png
new file mode 100644
index 0000000..a1db363
Binary files /dev/null and b/src/assets/images/tab_right_active.png differ
diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index 93ab1eb..3000a5c 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -121,6 +121,14 @@ aside {
   }
 }
 
+ul{
+  margin: 0;
+  padding: 0;
+  li{
+    list-style: none;
+  }
+}
+
 //main-container全局样式
 .app-wrapper{
   background-color: $menuBg;
diff --git a/src/assets/styles/yxk-admin.scss b/src/assets/styles/yxk-admin.scss
index c058ccb..ce8c18d 100644
--- a/src/assets/styles/yxk-admin.scss
+++ b/src/assets/styles/yxk-admin.scss
@@ -638,4 +638,88 @@
 
 .el-input__prefix{
   left: 8px;
+}
+
+// tab样式布局
+.tab-content{
+  margin-top: 40px;
+  border-top: none;
+  &::before{
+    display: none;
+  }
+  .tab-nav{
+    display: flex;
+    justify-content: flex-start;
+    height: 41px;
+    line-height: 41px;
+    margin: -41px 0 30px -1px;
+    font-size: 16px;
+    font-weight: bold;
+    color: #359AFC;
+    border-bottom: 1px solid #113D72;
+    li{
+      position: relative;
+      padding: 0 24px;
+      margin: -1px 30px 0 0;
+      letter-spacing: 2px;
+      border-top: 1px solid #113D72;
+      cursor: pointer;
+      &::before,
+      &::after{
+        content: "";
+        position: absolute;
+        top: 0;
+        width: 33px;
+        height: 41px;
+      }
+      &::before{
+        left: -15px;
+        background: url(~@/assets/images/tab_left.png) no-repeat;
+        background-size: contain;
+      }
+      &::after{
+        right: -32px;
+        background: url(~@/assets/images/tab_right.png) no-repeat;
+        background-size: contain;
+      }
+      &:first-child{
+        border-left: 1px solid #113d72;;
+        &::before{
+          width: 17px;
+          height: 17px;
+          left: -1px;
+          top: -1px;
+          border-left: 1px solid #339cff;
+          border-top: 1px solid #339cff;
+        }
+      }
+      &.active-tab-nav{
+        color: #fff;
+        &::before{
+          background: url(~@/assets/images/tab_left_active.png) no-repeat;
+          background-size: contain;
+        }
+        &::after{
+          background: url(~@/assets/images/tab_right_active.png) no-repeat;
+          background-size: contain;
+        }
+        i{
+          display: block;
+          position: absolute;
+          bottom: -1px;
+          left: 0;
+          width: 100%;
+          height: 1px;
+          border-bottom: 1px solid #021941;
+        }
+      }
+    }
+    .tab-right-img{
+      display: block;
+      width: 93px;
+      margin: 4px 0 0 -14px;
+      background: url(~@/assets/images/tab_img.png) no-repeat;
+      background-size: contain;
+    }
+  }
 }
\ No newline at end of file
diff --git a/src/views/system/user/center.vue b/src/views/system/user/center.vue
index d9c11c0..0ebf49a 100644
--- a/src/views/system/user/center.vue
+++ b/src/views/system/user/center.vue
@@ -31,10 +31,72 @@
           </ul>
         </div>
       </el-col>
-      <el-col class="container-right user-info-right" :xs="24" :sm="24" :md="16" :lg="18" :xl="19">
+      <el-col class="container-right tab-content" :xs="24" :sm="24" :md="16" :lg="18" :xl="19">
         <span class="right-top-line" />
         <span class="left-bottom-line" />
-        <el-tabs v-model="activeName" @tab-click="handleClick">
+        <div class="user-right-content">
+          <ul class="tab-nav">
+            <li :class="{'active-tab-nav': activeIndex == 0}" @click="handleClick(0)">用户资料<i /></li>
+            <li :class="{'active-tab-nav': activeIndex == 1}" @click="handleClick(1)">操作日志<i /></li>
+            <!-- 最右侧装饰img -->
+            <span class="tab-right-img" />
+          </ul>
+          <div v-if="activeIndex == 0" class="tab-item">
+            <el-form ref="form" :model="form" :rules="rules" size="small" label-width="65px">
+              <el-form-item label="昵称" prop="nickName">
+                <el-input v-model="form.nickName" style="width: 35%" />
+                <span style="color:#999;margin-left: 22px;">用户昵称不作为登录使用</span>
+              </el-form-item>
+              <el-form-item label="手机号" prop="phone">
+                <el-input v-model="form.phone" style="width: 35%;" />
+                <span style="color: #999;margin-left: 22px;">手机号码不能重复</span>
+              </el-form-item>
+              <el-form-item label="性别">
+                <el-radio-group v-model="form.gender" style="width: 178px">
+                  <el-radio label="男">男</el-radio>
+                  <el-radio label="女">女</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="">
+                <el-button :loading="saveLoading" size="mini" type="primary" @click="doSubmit">保存配置</el-button>
+              </el-form-item>
+            </el-form>
+          </div>
+          <!-- 操作日志 -->
+          <div v-if="activeIndex == 1" class="tab-item">
+            <el-table v-loading="loading" :data="data" style="width: 100%;">
+              <el-table-column prop="description" label="行为" />
+              <el-table-column prop="requestIp" label="IP" />
+              <el-table-column :show-overflow-tooltip="true" prop="address" label="IP来源" />
+              <el-table-column prop="browser" label="浏览器" />
+              <el-table-column prop="time" label="请求耗时" align="center">
+                <template slot-scope="scope">
+                  <el-tag v-if="scope.row.time <= 300">{{ scope.row.time }}ms</el-tag>
+                  <el-tag v-else-if="scope.row.time <= 1000" type="warning">{{ scope.row.time }}ms</el-tag>
+                  <el-tag v-else type="danger">{{ scope.row.time }}ms</el-tag>
+                </template>
+              </el-table-column>
+              <el-table-column align="right">
+                <template slot="header">
+                  <div style="display:inline-block;float: right;cursor: pointer" @click="init">创建日期<i class="el-icon-refresh" style="margin-left: 40px" /></div>
+                </template>
+                <template slot-scope="scope">
+                  <span>{{ scope.row.createTime }}</span>
+                </template>
+              </el-table-column>
+            </el-table>
+            <!--分页组件-->
+            <el-pagination
+              :total="total"
+              :current-page="page + 1"
+              style="margin-top: 8px;"
+              layout="total, prev, pager, next, sizes"
+              @size-change="sizeChange"
+              @current-change="pageChange"
+            />
+          </div>
+        </div>
+        <!-- <el-tabs v-model="activeName" @tab-click="handleClick">
           <el-tab-pane label="用户资料" name="first">
             <el-form ref="form" :model="form" :rules="rules" style="margin-top: 10px;" size="small" label-width="65px">
               <el-form-item label="昵称" prop="nickName">
@@ -56,7 +118,6 @@
               </el-form-item>
             </el-form>
           </el-tab-pane>
-          <!--    操作日志    -->
           <el-tab-pane label="操作日志" name="second">
             <el-table v-loading="loading" :data="data" style="width: 100%;">
               <el-table-column prop="description" label="行为" />
@@ -81,7 +142,6 @@
                 </template>
               </el-table-column>
             </el-table>
-            <!--分页组件-->
             <el-pagination
               :total="total"
               :current-page="page + 1"
@@ -91,7 +151,7 @@
               @current-change="pageChange"
             />
           </el-tab-pane>
-        </el-tabs>
+        </el-tabs> -->
       </el-col>
     </el-row>
     <updateEmail ref="email" :email="user.email" />
@@ -128,6 +188,7 @@ export default {
     return {
       show: false,
       Avatar: Avatar,
+      activeIndex: 0,
       activeName: 'first',
       saveLoading: false,
       headers: {
@@ -160,8 +221,9 @@ export default {
     toggleShow() {
       this.show = !this.show
     },
-    handleClick(tab, event) {
-      if (tab.name === 'second') {
+    handleClick(index) {
+      this.activeIndex = index
+      if (this.activeIndex === 1) {
         this.init()
       }
     },
@@ -240,10 +302,91 @@ export default {
     }
   }
 
-  .user-info-right{
-    .el-tabs__item{
+  .container-left,
+  .container-right{
+    min-height: calc(100vh - 230px);
+  }
+
+  .tab-content{
+    margin-top: 40px;
+    border-top: none;
+    &::before{
+      display: none;
+    }
+    .tab-nav{
+      display: flex;
+      justify-content: flex-start;
+      height: 41px;
+      line-height: 41px;
+      margin: -41px 0 30px -1px;
       font-size: 16px;
-      color: #fff;
+      font-weight: bold;
+      color: #359AFC;
+      border-bottom: 1px solid #113D72;
+      li{
+        position: relative;
+        padding: 0 24px;
+        margin: -1px 30px 0 0;
+        letter-spacing: 2px;
+        border-top: 1px solid #113D72;
+        cursor: pointer;
+        &::before,
+        &::after{
+          content: "";
+          position: absolute;
+          top: 0;
+          width: 33px;
+          height: 41px;
+        }
+        &::before{
+          left: -15px;
+          background: url(~@/assets/images/tab_left.png) no-repeat;
+          background-size: contain;
+        }
+        &::after{
+          right: -32px;
+          background: url(~@/assets/images/tab_right.png) no-repeat;
+          background-size: contain;
+        }
+        &:first-child{
+          border-left: 1px solid #113d72;;
+          &::before{
+            width: 17px;
+            height: 17px;
+            left: -1px;
+            top: -1px;
+            border-left: 1px solid #339cff;
+            border-top: 1px solid #339cff;
+          }
+        }
+        &.active-tab-nav{
+          color: #fff;
+          &::before{
+            background: url(~@/assets/images/tab_left_active.png) no-repeat;
+            background-size: contain;
+          }
+          &::after{
+            background: url(~@/assets/images/tab_right_active.png) no-repeat;
+            background-size: contain;
+          }
+          i{
+            display: block;
+            position: absolute;
+            bottom: -1px;
+            left: 0;
+            width: 100%;
+            height: 1px;
+            border-bottom: 1px solid #021941;
+          }
+        }
+      }
+      .tab-right-img{
+        display: block;
+        width: 93px;
+        margin: 4px 0 0 -14px;
+        background: url(~@/assets/images/tab_img.png) no-repeat;
+        background-size: contain;
+      }
     }
     .el-form{
       padding: 0 20px;