|
|
|
@ -1,6 +1,8 @@
|
|
|
|
|
<script lang="ts" setup>
|
|
|
|
|
import { reactive, ref } from 'vue'
|
|
|
|
|
import {onMounted, reactive, ref, toRefs, getCurrentInstanc, getCurrentInstance} from 'vue'
|
|
|
|
|
import type { UnwrapRef } from 'vue'
|
|
|
|
|
|
|
|
|
|
// let {proxy}=getCurrentInstanc
|
|
|
|
|
import {
|
|
|
|
|
FieldTimeOutlined,
|
|
|
|
|
LeftOutlined, ManOutlined,
|
|
|
|
@ -9,12 +11,18 @@ import {
|
|
|
|
|
WomanOutlined,
|
|
|
|
|
} from '@ant-design/icons-vue'
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
import { getUserProfileApi, updateUserProfileApi, uploadAvatarApi } from '@/api/base/profile'
|
|
|
|
|
import { exportLoginLog, getLoginLogPage } from '@/api/system/loginLog'
|
|
|
|
|
import { deleteNotice, getNoticePage } from '@/api/system/notice'
|
|
|
|
|
// 单选
|
|
|
|
|
const sex = ref<string>('保密')//性别
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const message = ref<string>('全部信息')//系统信息选择
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
interface FormState {
|
|
|
|
|
name: string
|
|
|
|
|
delivery: boolean
|
|
|
|
@ -51,6 +59,8 @@ const state = reactive({
|
|
|
|
|
//分页器
|
|
|
|
|
const current = ref(6)//登录记录分页
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//系统通知切换
|
|
|
|
|
const isVisible = ref(true)
|
|
|
|
|
const isVisible2 = ref(false)
|
|
|
|
@ -135,11 +145,58 @@ const tabledata = [
|
|
|
|
|
time:'2023-08-22 22:31',
|
|
|
|
|
},
|
|
|
|
|
]
|
|
|
|
|
// const userInfo = ref(null);
|
|
|
|
|
// onMounted( async () => {
|
|
|
|
|
// let result = await getUserProfileApi()
|
|
|
|
|
// userInfo.value = result;
|
|
|
|
|
// })
|
|
|
|
|
|
|
|
|
|
let userInfo = reactive({
|
|
|
|
|
})
|
|
|
|
|
onMounted( async () => {
|
|
|
|
|
userInfo = await getUserProfileApi()
|
|
|
|
|
console.log(userInfo)
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
let loginlog = reactive({
|
|
|
|
|
})
|
|
|
|
|
onMounted( async () => {
|
|
|
|
|
loginlog = await getLoginLogPage()
|
|
|
|
|
// console.log(loginlog)
|
|
|
|
|
console.log(loginlog.list)
|
|
|
|
|
// console.log(loginlog.list.createTime)
|
|
|
|
|
// var date =new Date(loginlog.list.createTime)
|
|
|
|
|
// var time1 =loginlog.list.createTime
|
|
|
|
|
// console.log(time1)
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// let Notice = reactive({
|
|
|
|
|
// })
|
|
|
|
|
// onMounted( async () => {
|
|
|
|
|
// loginlog = await getNoticePage()
|
|
|
|
|
// console.log(Notice.list)
|
|
|
|
|
// })
|
|
|
|
|
// const {username} = toRefs(userInfo)
|
|
|
|
|
// onMounted(async () => {
|
|
|
|
|
// const data = await getUserProfileApi()
|
|
|
|
|
// console.log(data);
|
|
|
|
|
// })
|
|
|
|
|
|
|
|
|
|
// let { proxy }: any = getCurrentInstance ()
|
|
|
|
|
// let classifylist=reactive ({
|
|
|
|
|
// data: [],
|
|
|
|
|
// })
|
|
|
|
|
// // 请求数据
|
|
|
|
|
// onMounted( async () => {
|
|
|
|
|
// let { data: res } = await getUserProfileApi();
|
|
|
|
|
// console.log(res)
|
|
|
|
|
// })
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<template>
|
|
|
|
|
<a-card
|
|
|
|
|
style="width: 80%; padding: 20px;margin: 20px auto;"
|
|
|
|
|
style="width: 80%; padding: 20px;margin: 20px auto;"
|
|
|
|
|
default-active-tab-key
|
|
|
|
|
>
|
|
|
|
|
<a-tabs v-model:activeKey="activeKey" tab-position="left">
|
|
|
|
@ -150,22 +207,23 @@ const tabledata = [
|
|
|
|
|
<p>
|
|
|
|
|
<span>▋</span>
|
|
|
|
|
基本资料
|
|
|
|
|
<!-- {{userInfo}} -->
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<p class="pleft">
|
|
|
|
|
基本信息
|
|
|
|
|
</p>
|
|
|
|
|
<div class="datumbox">
|
|
|
|
|
<div class="form">
|
|
|
|
|
<a-form :model="formState" :label-col="labelCol" :wrapper-col="wrapperCol">
|
|
|
|
|
<div class="form" :data="list">
|
|
|
|
|
<a-form :model="FormState" :label-col="labelCol" :wrapper-col="wrapperCol">
|
|
|
|
|
<a-form-item label="登录账号:">
|
|
|
|
|
<a-input v-model:value="value" placeholder="输入内容" />
|
|
|
|
|
<a-input v-model:value="userInfo.username" placeholder="输入内容" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
<a-form-item label="姓名:">
|
|
|
|
|
<a-input v-model:value="value" placeholder="输入内容" />
|
|
|
|
|
<a-input v-model:value="userInfo.nickname" placeholder="输入内容" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
<a-form-item label="所属部门:">
|
|
|
|
|
<a-input v-model:value="value" placeholder="输入内容" />
|
|
|
|
|
<a-input v-model:value="userInfo.dept.name" placeholder="输入内容" />
|
|
|
|
|
</a-form-item>
|
|
|
|
|
<a-form-item label="员工职务:">
|
|
|
|
|
<a-input v-model:value="value" placeholder="输入内容" />
|
|
|
|
@ -176,7 +234,7 @@ const tabledata = [
|
|
|
|
|
<a-form-item label="手机号码:">
|
|
|
|
|
<div class="phonecss">
|
|
|
|
|
<a-input v-model:value="value" placeholder="输入内容" :style="phoneStyle" />
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
<a-button :style="changeStyle" @click="showModal">
|
|
|
|
|
修改手机号
|
|
|
|
@ -232,11 +290,11 @@ const tabledata = [
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</a-form-item>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<p class="pleft">
|
|
|
|
|
更多信息
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<a-form label-width="100px" :model="formState" :label-col="labelCol" :wrapper-col="wrapperCol">
|
|
|
|
|
<a-form-item label="籍贯:">
|
|
|
|
|
<a-input v-model:value="value" placeholder="输入内容" />
|
|
|
|
@ -356,17 +414,19 @@ const tabledata = [
|
|
|
|
|
<p>
|
|
|
|
|
<span>▋</span>
|
|
|
|
|
登录记录
|
|
|
|
|
<!-- {{loginlog}}-->
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 日期 -->
|
|
|
|
|
<div
|
|
|
|
|
v-for="(item, index) in 5" :key="index"
|
|
|
|
|
v-for="(item, index) in loginlog.list" :key="index"
|
|
|
|
|
>
|
|
|
|
|
<div class="date">
|
|
|
|
|
{{ `2023-08-22` }}
|
|
|
|
|
{{item.logType}}
|
|
|
|
|
{{ `日期:2023-08-22` }}
|
|
|
|
|
</div>
|
|
|
|
|
<div
|
|
|
|
|
v-for="(item, index) in 5"
|
|
|
|
|
v-for="(item, index) in loginlog.list"
|
|
|
|
|
:key="index" class="recordbox"
|
|
|
|
|
>
|
|
|
|
|
<div class="recordleft">
|
|
|
|
@ -374,14 +434,18 @@ const tabledata = [
|
|
|
|
|
<WindowsFilled />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="recordmessage">
|
|
|
|
|
<div class="usersId">
|
|
|
|
|
{{ `kang-pc` }}
|
|
|
|
|
<div class="usersId">
|
|
|
|
|
{{item.username}}
|
|
|
|
|
<!-- {{ `kang-pc` }}-->
|
|
|
|
|
</div>
|
|
|
|
|
{{ `上海市长宁区 14.127.100.242` }}
|
|
|
|
|
{{item.userIp}}
|
|
|
|
|
<!-- {{ `上海市长宁区 14.127.100.242` }}-->
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="recordright">
|
|
|
|
|
<span><FieldTimeOutlined /></span>{{ `2023-08-22 12:00` }}
|
|
|
|
|
<span><FieldTimeOutlined /></span>
|
|
|
|
|
<!-- {{ `2023-08-22 12:00` }}-->
|
|
|
|
|
{{item.createTime}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
@ -399,6 +463,7 @@ const tabledata = [
|
|
|
|
|
<p>
|
|
|
|
|
<span>▋</span>
|
|
|
|
|
系统通知
|
|
|
|
|
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="messagetitle">
|
|
|
|
@ -432,7 +497,7 @@ const tabledata = [
|
|
|
|
|
<div class="table">
|
|
|
|
|
<a-table :columns="tablecolumns" :data-source="tabledata" :total="500">
|
|
|
|
|
<template #headerCell="{ column }">
|
|
|
|
|
<template v-if="column.key === 'title'">
|
|
|
|
|
<template v-if="column.key === 'title'" >
|
|
|
|
|
<span>
|
|
|
|
|
通知标题
|
|
|
|
|
</span>
|
|
|
|
@ -442,7 +507,7 @@ const tabledata = [
|
|
|
|
|
<template v-if="column.key === 'name'">
|
|
|
|
|
<a href=""> {{ record.name }}</a>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<template v-else-if="column.key === 'title'">
|
|
|
|
|
<div style="cursor: pointer;" @click="toggleBlocks">
|
|
|
|
|
{{ record.title }}
|
|
|
|
@ -535,7 +600,7 @@ const tabledata = [
|
|
|
|
|
</div>
|
|
|
|
|
<div class="firmtopbot">
|
|
|
|
|
<p class="fontcss">
|
|
|
|
|
部门:{{ `再生资源事业部<采购部` }}
|
|
|
|
|
部门:{{ `再生资源事业部 采购部` }}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="fontcss">
|
|
|
|
|
业务线:{{ `废铁、废铝` }}
|
|
|
|
@ -544,7 +609,7 @@ const tabledata = [
|
|
|
|
|
</div>
|
|
|
|
|
<div class="default">
|
|
|
|
|
<p class="fontcss">
|
|
|
|
|
默认登录:
|
|
|
|
|
默认登录:
|
|
|
|
|
<span style="margin-left: 15px;">
|
|
|
|
|
<a-switch v-model:checked="state.checked1" checked-children="开" un-checked-children="关" /></span>
|
|
|
|
|
</p>
|
|
|
|
@ -630,7 +695,7 @@ const tabledata = [
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.list{
|
|
|
|
|
width: 30%;
|
|
|
|
@ -685,7 +750,7 @@ const tabledata = [
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -698,7 +763,7 @@ const tabledata = [
|
|
|
|
|
.ant-tabs-tab .ant-tabs-tab-active{
|
|
|
|
|
padding: 8px 24px;
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.datum{
|
|
|
|
@ -708,7 +773,7 @@ const tabledata = [
|
|
|
|
|
color: #666;
|
|
|
|
|
|
|
|
|
|
.datumtop{
|
|
|
|
|
p{
|
|
|
|
|
p{
|
|
|
|
|
margin-bottom: 15px;
|
|
|
|
|
font-size:18px;
|
|
|
|
|
font-weight:700;
|
|
|
|
@ -718,7 +783,7 @@ const tabledata = [
|
|
|
|
|
color:#409EFF;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.datumbox{
|
|
|
|
@ -759,7 +824,7 @@ const tabledata = [
|
|
|
|
|
|
|
|
|
|
.pleft{
|
|
|
|
|
margin: 20px ;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -852,7 +917,7 @@ justify-content: space-between;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
width: 300px;
|
|
|
|
|
margin-left: 20px;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.usersId{
|
|
|
|
|
font-size:20px ;
|
|
|
|
|