用户信息修改

core/core-frontend/src/viewsnew/application/SfcEditor/NavbarEditor/Navbar.vue

@@ -3,6 +3,7 @@ import { ref, watch, onMounted, onBeforeUnmount, shallowRef } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import Assocmodule from '@/viewsnew/application/SfcEditor/NavbarEditor/assocPage.vue'
 import PermissionSet from '@/viewsnew/application/permissionset/index.vue'
+import UserInfoSet from '@/viewsnew/application/permissionset/user/userinfo.vue'
 import {useRoute, useRouter } from 'vue-router'
 const router = useRouter()
 const route = useRoute()
@@ -24,6 +25,7 @@ const checkindex = ref(null)
 const showmodule = ref(false)
 const currentMoudleId = ref('')
 const showermission = ref(false)
+const showUserInfo = ref(false)
 watch(
   () => props.menuList,
   (newVal) => {
@@ -49,6 +51,7 @@ function childmenuclick(item: any) {
   }
   showermission.value = false
   showmodule.value = false
+  showUserInfo.value = false
   if (item.module_id && item.module_id !== '') {
     currentMoudleId.value = item.module_id
     showmodule.value = true
@@ -107,6 +110,7 @@ function permissionClick() {
     return
   }
   showmodule.value = false
+  showUserInfo.value = false
   showermission.value = true
 }
 function logout(){
@@ -128,6 +132,11 @@ function logout(){
     .catch(() => {})
     
 }
+function userdetails(){
+  showmodule.value = false
+  showermission.value = false
+  showUserInfo.value = true
+}
 </script>
 <template>
   <div class="system-box">
@@ -159,9 +168,9 @@ function logout(){
           <div style="margin-right: 10px;cursor: pointer;" @click="permissionClick"><img
               src="@/assets/img/navpermission.png" alt=""></div>
           <div style="margin-right: 10px;cursor: pointer;"><img src="@/assets/img/nav1.png" alt=""></div>
-          <div style="margin-right: 15px;min-width: 45px;">admin</div>
+          <div style="margin-right: 15px;min-width: 45px;cursor: pointer;" @click="userdetails">admin</div>
-          <div style="margin-right: 15px;"><img src="@/assets/img/nav3.png" alt=""></div>
+          <div style="margin-right: 15px;cursor: pointer;" @click="userdetails"><img src="@/assets/img/nav3.png" alt=""></div>
-          <div @click="logout"><img src="@/assets/img/nav4.png" alt=""></div>
+          <div @click="logout" style="cursor: pointer;"><img src="@/assets/img/nav4.png" alt=""></div>
         </div>
       </div>
     </div>
@@ -170,6 +179,7 @@ function logout(){
       <Assocmodule v-if="showmodule" :applicationId="props.applicationId"
         :moduleinfo="{ module_id: currentMoudleId }" />
       <PermissionSet v-if="showermission" />
+      <UserInfoSet v-if="showUserInfo" :applicationId="props.applicationId" />
     </div>
   </div>
 </template>

core/core-frontend/src/viewsnew/application/SfcEditor/NavbarEditor/editNavbar.vue

@@ -84,10 +84,14 @@ const runCode = async () => {
         'vue/dist/vue.esm-bundler.js': Vue,
         'vue-router': VueRouter,
         '@/viewsnew/application/SfcEditor/NavbarEditor/assocPage.vue': Vue.defineAsyncComponent(() =>
-          import('@/viewsnew/application/SfcEditor/NavbarEditor/assocPage.vue')),
+          import('@/viewsnew/application/SfcEditor/NavbarEditor/assocPage.vue')
+        ),
         '@/viewsnew/application/permissionset/index.vue': Vue.defineAsyncComponent(() =>
           import('@/viewsnew/application/permissionset/index.vue')
-        )
+        ),
+        '@/viewsnew/application/permissionset/user/userinfo.vue': Vue.defineAsyncComponent(() =>
+          import('@/viewsnew/application/permissionset/user/userinfo.vue')
+        ),
       },
       getFile: async (fileName) => {
         if (fileName.startsWith('@/')) {

core/core-frontend/src/viewsnew/application/SfcEditor/NavbarEditor/previewNavSfc.vue

@@ -72,7 +72,10 @@ const runCode = async () => {
                 ),
                 '@/viewsnew/application/permissionset/index.vue': Vue.defineAsyncComponent(() =>
                     import('@/viewsnew/application/permissionset/index.vue')
-                )
+                ),
+                '@/viewsnew/application/permissionset/user/userinfo.vue': Vue.defineAsyncComponent(() =>
+                    import('@/viewsnew/application/permissionset/user/userinfo.vue')
+                ),
             },
             getFile: async (fileName) => {
                 if (fileName === 'dynamic.vue') {

core/core-frontend/src/viewsnew/application/permissionset/user/userinfo.vue

@@ -0,0 +1,165 @@
+<script lang="ts" setup>
+import { ref, onMounted } from 'vue'
+const props = defineProps({
+    applicationId: String,
+})
+const userlist: any = ref({
+    username: 'admin',
+    nickname: '管理员',
+    password: '',
+    newpassword: '',
+    submitpassword: '',
+    email: '',
+    phone: '',
+})
+onMounted(() => {
+
+})
+function saveinfo() {
+    //保存
+}
+</script>
+<template>
+    <div class="userinfo-box">
+        <div class="userinfo-content">
+            <div class="userinfo-content-top">
+                <div class="userinfo-title">
+                    <div class="userinfo-title-icon"></div>
+                    <div class="userinfo-title-text">个人信息</div>
+                </div>
+                <div class="userinfo-content-top-content">
+                    <div class="userinfo-content-top-content-box">
+                        <div class="userinfo-content-top-text">用户姓名</div>
+                        <el-input v-model="userlist.nickname" disabled placeholder="请输入用户姓名"></el-input>
+                    </div>
+                    <div class="userinfo-content-top-content-box">
+                        <div class="userinfo-content-top-text">登录账号</div>
+                        <el-input v-model="userlist.username" disabled placeholder="请输入登录账号"></el-input>
+                    </div>
+                    <div class="userinfo-content-top-content-box">
+                        <div class="userinfo-content-top-text">联系邮箱</div>
+                        <el-input v-model="userlist.email" placeholder="请输入联系邮箱"></el-input>
+                    </div>
+                    <div class="userinfo-content-top-content-box">
+                        <div class="userinfo-content-top-text">联系电话</div>
+                        <el-input v-model="userlist.phone" placeholder="请输入联系电话"></el-input>
+                    </div>
+                </div>
+            </div>
+            <div class="userinfo-content-top" style="margin-top: 50px;">
+                <div class="userinfo-title">
+                    <div class="userinfo-title-icon"></div>
+                    <div class="userinfo-title-text">修改密码</div>
+                </div>
+                <div class="userinfo-content-top-content">
+                    <div class="userinfo-content-top-content-box">
+                        <div class="userinfo-content-top-text">原密码</div>
+                        <el-input v-model="userlist.password" placeholder="请输入原密码"></el-input>
+                    </div>
+                    <div class="userinfo-content-top-content-box">
+                        <div class="userinfo-content-top-text">新密码</div>
+                        <el-input v-model="userlist.newpassword" placeholder="请输入新密码"></el-input>
+                    </div>
+                    <div class="userinfo-content-top-content-box">
+                        <div class="userinfo-content-top-text">确认新密码</div>
+                        <el-input v-model="userlist.submitpassword" placeholder="请输入确认新密码"></el-input>
+                    </div>
+                </div>
+            </div>
+            <div class="userinfo-content-btn">
+                <el-button type="primary" style="min-width: 50px;" @click="saveinfo">保存</el-button>
+            </div>
+        </div>
+    </div>
+</template>
+
+<style lang="less" scoped>
+.userinfo-box {
+    width: 100%;
+    height: 100%;
+    background: #E3E8F0;
+    padding: 15px;
+    .userinfo-content {
+        width: 100%;
+        height: 100%;
+        overflow: auto;
+        border-radius: 5px;
+        background: #fff;
+        box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
+        padding: 40px;
+        .userinfo-content-top {
+            width: 600px;
+            .userinfo-title {
+                display: flex;
+                align-items: center;
+                .userinfo-title-icon {
+                    width: 5px;
+                    height: 15px;
+                    background-color: rgba(64, 158, 255, 1);
+                }
+                .userinfo-title-text {
+                    font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
+                    font-weight: 700;
+                    font-style: normal;
+                    font-size: 16px;
+                    margin-left: 10px;
+                }
+            }
+            .userinfo-content-top-content {
+                .userinfo-content-top-content-box {
+                    margin-top: 20px;
+                    display: flex;
+                    align-items: center;
+                    .userinfo-content-top-text {
+                        width: 90px;
+                        margin-right: 20px;
+                        text-align: right;
+                        font-size: 14px;
+                        font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
+                        font-weight: 400;
+                        font-style: normal;
+                        color: rgb(120, 120, 120);
+                    }
+                }
+            }
+        }
+        .userinfo-content-btn {
+            width: 600px;
+            display: flex;
+            justify-content: flex-end;
+            margin-top: 30px;
+        }
+    }
+}
+
+:deep(.ed-input__wrapper) {
+    background: #ffffff;
+    border: 1px solid #dcdfe6;
+    box-shadow: none;
+}
+
+:deep(.ed-input__inner) {
+    color: rgb(56, 56, 56)
+}
+
+:deep(.ed-input.is-disabled .ed-input__wrapper) {
+    background: rgb(242, 246, 252);
+    border: 1px solid #dcdfe6;
+    box-shadow: none;
+}
+
+:deep(.ed-input.is-disabled .ed-input__inner) {
+    color: rgb(56, 56, 56);
+    -webkit-text-fill-color: rgb(56, 56, 56);
+}
+
+:deep(.ed-button) {
+    border-color: #dcdfe6;
+}
+
+:deep(.ed-button--primary) {
+    background-color: #409eff;
+    color: #ffffff;
+    border-color: #409eff;
+}
+</style>