From 80438c5e682e4a8a4c64bc2393ccb7ef1bb44b90 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=AE=89=E8=99=B9=E7=9D=BF?= <297504645@qq.com>
Date: Thu, 14 Sep 2023 10:37:57 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=AA=E4=BA=BA=E4=B8=AD=E5=BF=83=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Code/Fe/src/router/index.js                |  11 ++-
 Code/Fe/src/views/profileuser/index.vue    |  32 +++++++
 Code/Fe/src/views/profileuser/index_dy.vue | 106 +++++++++++++++++++++
 Code/Fe/src/views/profileuser/resetPwd.vue | 100 +++++++++++++++++++
 Code/Fe/src/views/profileuser/userInfo.vue |  52 ++++++++++
 5 files changed, 298 insertions(+), 3 deletions(-)
 create mode 100644 Code/Fe/src/views/profileuser/index.vue
 create mode 100644 Code/Fe/src/views/profileuser/index_dy.vue
 create mode 100644 Code/Fe/src/views/profileuser/resetPwd.vue
 create mode 100644 Code/Fe/src/views/profileuser/userInfo.vue

diff --git a/Code/Fe/src/router/index.js b/Code/Fe/src/router/index.js
index 1f5f797..41aee17 100644
--- a/Code/Fe/src/router/index.js
+++ b/Code/Fe/src/router/index.js
@@ -45,6 +45,11 @@ export let constantRoutes = [
       component: () => import('@/views/redirect/index')
     }]
   },
+  {
+    path: '*',
+    redirect: '/404',
+    hidden: true
+  },
   {
     path: '/login',
     component: () => import('@/views/login/index'),
@@ -102,12 +107,12 @@ export let constantRoutes = [
     }]
   }, 
   {
-    path: '/profileuser',
+    path: '/',
     component: Layout,
-    redirect: '/profileuser/index',
+    redirect: '/profileuser',
     hidden: true,
     children: [{
-      path: 'index',
+      path: 'profileuser',
       component: () => import('@/views/profileuser/index'),
       name: 'Profileuser',
       meta: {
diff --git a/Code/Fe/src/views/profileuser/index.vue b/Code/Fe/src/views/profileuser/index.vue
new file mode 100644
index 0000000..17dfb7d
--- /dev/null
+++ b/Code/Fe/src/views/profileuser/index.vue
@@ -0,0 +1,32 @@
+<template>
+  <div class="app-container">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <span>个人中心</span>
+        <!-- <el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button> -->
+      </div>
+      <el-tabs v-model="activeTab">
+        <el-tab-pane label="用户信息" name="userInfo">
+          <userInfo />
+        </el-tab-pane>
+        <!-- <el-tab-pane label="修改密码" name="resetPwd">
+          <resetPwd />
+        </el-tab-pane> -->
+      </el-tabs>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import resetPwd from "./resetPwd";
+import userInfo from "./userInfo";
+export default {
+  name: "Profileuser",
+  components: { resetPwd,userInfo },
+  data() {
+    return {
+      activeTab: "userInfo",
+    };
+  },
+};
+</script>
diff --git a/Code/Fe/src/views/profileuser/index_dy.vue b/Code/Fe/src/views/profileuser/index_dy.vue
new file mode 100644
index 0000000..e92dee3
--- /dev/null
+++ b/Code/Fe/src/views/profileuser/index_dy.vue
@@ -0,0 +1,106 @@
+<template>
+  <div class="app-container">
+    <!-- 左右东阳版本 -->
+    <el-row :gutter="20">
+      <el-col :span="6" :xs="24">
+        <el-card>
+          <div slot="header" class="clearfix">
+            <span style="font-size: 18px">个人信息</span>
+          </div>
+          <div>
+            <ul class="list-group-striped">
+              <li>
+                <div class="left"><i class="icon el-icon-user-solid"></i></div>
+                <div class="pull-right">
+                  <p class="title">用户名</p>
+                  <p class="name">{{ user.userName }}</p>
+                </div>
+              </li>
+              <li>
+                <div class="left"><i class="icon el-icon-info"></i></div>
+                <div class="pull-right">
+                  <p class="title">姓名</p>
+                  <p class="name">{{ user.name }}</p>
+                </div>
+              </li>
+              <li>
+                <div class="left"><i class="icon el-icon-s-check"></i></div>
+                <div class="pull-right">
+                  <p class="title">角色</p>
+                  <p class="name">{{ user.roles.join(',') }}</p>
+                </div>
+              </li>
+            </ul>
+          </div>
+        </el-card>
+      </el-col>
+      <el-col :span="18" :xs="24">
+        <el-card>
+          <div slot="header" class="clearfix">
+            <span style="font-size: 18px">基本资料</span>
+          </div>
+          <el-tabs v-model="activeTab">
+            <el-tab-pane label="修改密码" name="resetPwd">
+              <resetPwd :user="user" />
+            </el-tab-pane>
+          </el-tabs>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import resetPwd from "./resetPwd";
+export default {
+  name: "Profileuser",
+  components: { resetPwd },
+  data() {
+    return {
+      user: {},
+      roleGroup: {},
+      postGroup: {},
+      activeTab: "resetPwd",
+    };
+  },
+  created() {
+    this.user = this.$store.getters.currentUserInfo
+  },
+};
+</script>
+<style lang="scss" scoped>
+.list-group-striped{
+  list-style: none;
+  padding-left: 10px;
+  li{
+    display: flex;
+    padding-bottom: 15px;
+    background: #e9f6ff;
+    padding: 13px 15px;
+    border-radius: 4px;
+    margin-bottom: 18px;
+    min-height: 70px;
+  }
+  .icon{
+    font-size: 22px;
+    padding-right: 5px;
+    vertical-align: top;
+    color: #49a4f7;
+    width: 24px;
+    flex-shrink: 0;
+    padding-top: 18px;
+  }
+  .pull-right{
+    padding-left: 10px;
+    color: #999;
+    p{
+      margin: 0;
+    }
+
+    .title{
+      padding-bottom: 5px;
+      color: #333;
+    }
+  }
+}
+</style>
diff --git a/Code/Fe/src/views/profileuser/resetPwd.vue b/Code/Fe/src/views/profileuser/resetPwd.vue
new file mode 100644
index 0000000..19b4faf
--- /dev/null
+++ b/Code/Fe/src/views/profileuser/resetPwd.vue
@@ -0,0 +1,100 @@
+<template>
+    <el-form ref="form" :model="user" :rules="rules" label-width="80px">
+      <el-form-item label="旧密码" prop="oldPassword">
+        <el-input
+          v-model="user.oldPassword"
+          placeholder="请输入旧密码"
+          type="password"
+        />
+      </el-form-item>
+      <el-form-item label="新密码" prop="newPassword">
+        <el-input
+          v-model="user.newPassword"
+          placeholder="请输入新密码"
+          type="password"
+        />
+      </el-form-item>
+      <el-form-item label="确认密码" prop="confirmPassword">
+        <el-input
+          v-model="user.confirmPassword"
+          placeholder="请确认密码"
+          type="password"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" size="mini" @click="submit">保存</el-button>
+        <!-- <el-button type="danger" size="mini" @click="reset">清空</el-button> -->
+      </el-form-item>
+    </el-form>
+  </template>
+  
+  <script>
+  import { postLoginUserInfo } from "@/api/wms-auth";
+  
+  export default {
+    data() {
+      const equalToPassword = (rule, value, callback) => {
+        if (this.user.newPassword !== value) {
+          callback(new Error("两次输入的密码不一致"));
+        } else {
+          callback();
+        }
+      };
+      return {
+        user: {
+          oldPassword: undefined,
+          newPassword: undefined,
+          confirmPassword: undefined,
+        },
+        // 表单校验
+        rules: {
+          oldPassword: [
+            { required: true, message: "旧密码不能为空", trigger: "blur" },
+          ],
+          newPassword: [
+            { required: true, message: "新密码不能为空", trigger: "blur" },
+            {
+              min: 6,
+              max: 20,
+              message: "长度在 6 到 20 个字符",
+              trigger: "blur",
+            },
+          ],
+          confirmPassword: [
+            { required: true, message: "确认密码不能为空", trigger: "blur" },
+            { required: true, validator: equalToPassword, trigger: "blur" },
+          ],
+        },
+      };
+    },
+    methods: {
+      submit() {
+        this.$refs["form"].validate((valid) => {
+          if (valid) {
+            postLoginUserInfo({
+              currentPassword: this.user.oldPassword,
+              newPassword: this.user.newPassword,
+            }, this.$store.getters.currentUserInfo.id)
+              .then((response) => {
+                this.$notify({
+                  title: "成功",
+                  message: "修改成功",
+                  type: "success",
+                  duration: 2000,
+                });
+              })
+              .catch(() => {
+                //
+              });
+          }
+        });
+      },
+      reset() {
+        this.$refs["form"].resetFields();
+        //this.$store.dispatch("tagsView/delView", this.$route);
+        //this.$router.push({ path: "/index" });
+      },
+    },
+  };
+  </script>
+  
\ No newline at end of file
diff --git a/Code/Fe/src/views/profileuser/userInfo.vue b/Code/Fe/src/views/profileuser/userInfo.vue
new file mode 100644
index 0000000..13e2982
--- /dev/null
+++ b/Code/Fe/src/views/profileuser/userInfo.vue
@@ -0,0 +1,52 @@
+<template>
+  <el-descriptions 
+    class="profileuser_userinfo_page" 
+    :column="2" 
+    :border="true"
+    :labelStyle="{width:'200px'}"
+  >
+    <el-descriptions-item>
+      <template slot="label"><i class="item-icon el-icon-user-solid"></i>用户名</template>
+      {{ user.userName }}
+    </el-descriptions-item>
+    <el-descriptions-item>
+      <template slot="label" :span="2"><i class="item-icon el-icon-info"></i>姓名</template>
+      {{ user.name }}
+    </el-descriptions-item>
+    <el-descriptions-item>
+      <template slot="label"><i class="item-icon el-icon-s-check"></i>角色</template>
+      {{ user.roles.join(',') }}
+    </el-descriptions-item>
+  </el-descriptions>
+</template>
+  
+<script>
+  export default {
+    data() {
+      return {
+        user:{}
+      };
+    },
+    created() {
+        this.user = this.$store.getters.currentUserInfo
+    },
+  };
+</script>
+<style lang="scss">
+.profileuser_userinfo_page{
+  padding: 20px;
+  
+  .el-descriptions-item__container{
+    padding: 20px 10px;
+    font-size: 18px;
+  }
+
+  .item-icon{
+    font-size: 22px;
+    margin-right: 8px;
+    color: #49a4f7;
+    line-height: 18px;
+    vertical-align: text-bottom;
+  }
+}
+</style>
\ No newline at end of file