feature[profile]: add profile page (#1953)

src/views/profile/index.vue

@@ -0,0 +1,70 @@
+<template>
+  <div class="app-container">
+    <div v-if="user">
+      <el-row :gutter="20">
+
+        <el-col :span="6">
+          <user-card :user="user" />
+        </el-col>
+
+        <el-col :span="18">
+          <el-card>
+
+            <el-tabs v-model="activeTab">
+              <el-tab-pane label="Activity" name="activity">
+                <activity />
+              </el-tab-pane>
+              <el-tab-pane label="Timeline" name="timeline">
+                <timeline />
+              </el-tab-pane>
+              <el-tab-pane label="Account" name="account">
+                <account :user="user" />
+              </el-tab-pane>
+            </el-tabs>
+
+          </el-card>
+        </el-col>
+
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import UserCard from './components/UserCard'
+import Activity from './components/Activity'
+import Timeline from './components/Timeline'
+import Account from './components/Account'
+
+export default {
+  name: 'Profile',
+  components: { UserCard, Activity, Timeline, Account },
+  data() {
+    return {
+      user: {},
+      activeTab: 'activity'
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'name',
+      'avatar',
+      'roles'
+    ])
+  },
+  created() {
+    this.getUser()
+  },
+  methods: {
+    getUser() {
+      this.user = {
+        name: this.name,
+        role: this.roles.join(' | '),
+        email: 'admin@test.com',
+        avatar: this.avatar
+      }
+    }
+  }
+}
+</script>