用户信息修改
This commit is contained in:
jingna
parent
10660a5b4b
commit
a20f4bd9a3
@ -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;"><img src="@/assets/img/nav3.png" alt=""></div>
|
||||
<div @click="logout"><img src="@/assets/img/nav4.png" alt=""></div>
|
||||
<div style="margin-right: 15px;min-width: 45px;cursor: pointer;" @click="userdetails">admin</div>
|
||||
<div style="margin-right: 15px;cursor: pointer;" @click="userdetails"><img src="@/assets/img/nav3.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>
|
||||
|
||||
@ -34,7 +34,7 @@ import { useRoute, useRouter } from 'vue-router'
|
||||
import { loadModule } from 'vue3-sfc-loader'
|
||||
import * as Vue from 'vue/dist/vue.esm-bundler.js'
|
||||
import * as ElementPlus from 'element-plus'
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||||
import * as VueRouter from 'vue-router'
|
||||
import less from 'less'
|
||||
import defaultTemplate from '@/viewsnew/application/SfcEditor/NavbarEditor/Navbar.vue?raw'
|
||||
@ -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('@/')) {
|
||||
|
||||
@ -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') {
|
||||
|
||||
@ -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>
|
||||
Loading…
Reference in New Issue
Block a user