fix: 删除多余文件
This commit is contained in:
XieYongHong
parent
8307a1353e
commit
17fa82d2fc
|
|
@ -1,482 +0,0 @@
|
|||
<template>
|
||||
<page-container>
|
||||
<div class="center-container">
|
||||
<div class="card">
|
||||
<div class="content" style="margin-top: 0">
|
||||
<div
|
||||
class="content-item flex-item"
|
||||
style="width: 350px; justify-content: center"
|
||||
>
|
||||
<img
|
||||
v-if="userInfo.avatar"
|
||||
:src="userInfo.avatar"
|
||||
style="width: 140px; border-radius: 70px"
|
||||
alt=""
|
||||
/>
|
||||
<div class="default-avatar" v-else>
|
||||
<AIcon type="UserOutlined" />
|
||||
</div>
|
||||
|
||||
<div
|
||||
style="
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
"
|
||||
>
|
||||
<j-upload
|
||||
v-model:file-list="upload.fileList"
|
||||
accept=".jpg,.png,.jfif,.pjp,.pjpeg,.jpeg"
|
||||
:maxCount="1"
|
||||
:show-upload-list="false"
|
||||
:headers="{
|
||||
[TOKEN_KEY]: LocalStore.get(TOKEN_KEY),
|
||||
}"
|
||||
:action="`${BASE_API_PATH}/file/static`"
|
||||
@change="upload.changeBackUpload"
|
||||
:beforeUpload="upload.beforeUpload"
|
||||
>
|
||||
<j-button>
|
||||
<AIcon type="UploadOutlined" />
|
||||
更换头像
|
||||
</j-button>
|
||||
</j-upload>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="content-item flex-item"
|
||||
style="flex: 1; padding: 15px 0"
|
||||
>
|
||||
<div class="info-card">
|
||||
<p>用户名</p>
|
||||
<p>{{ userInfo.username }}</p>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<p>账号ID</p>
|
||||
<p>{{ userInfo.id }}</p>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<p>注册时间</p>
|
||||
<p>
|
||||
{{
|
||||
userInfo.createTime ? moment(userInfo.createTime).format(
|
||||
'YYYY-MM-DD HH:mm:ss',
|
||||
) : '-'
|
||||
}}
|
||||
</p>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<p>电话</p>
|
||||
<p>{{ userInfo.telephone || '-' }}</p>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<p>姓名</p>
|
||||
<p>{{ userInfo.name }}</p>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<p>角色</p>
|
||||
<p>
|
||||
{{
|
||||
(userInfo.roleList &&
|
||||
userInfo.roleList
|
||||
.map((item) => item.name)
|
||||
.join(',')) ||
|
||||
'-'
|
||||
}}
|
||||
</p>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<p>组织</p>
|
||||
<p>
|
||||
{{
|
||||
(userInfo.orgList &&
|
||||
userInfo.orgList
|
||||
.map((item) => item.name)
|
||||
.join(',')) ||
|
||||
'-'
|
||||
}}
|
||||
</p>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<p>邮箱</p>
|
||||
<p>{{ userInfo.email || '-' }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<AIcon
|
||||
type="EditOutlined"
|
||||
class="edit"
|
||||
style="right: 40px"
|
||||
@click="editInfoVisible = true"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card" v-if='updatePassword'>
|
||||
<h3>修改密码</h3>
|
||||
<div class="content">
|
||||
<div class="content" style="align-items: flex-end">
|
||||
<AIcon
|
||||
type="LockOutlined"
|
||||
style="color: #1d39c4; font-size: 70px"
|
||||
/>
|
||||
<span
|
||||
style="margin-left: 5px; color: rgba(0, 0, 0, 0.55)"
|
||||
>安全性高的密码可以使帐号更安全。建议您定期更换密码,设置一个包含字母,符号或数字中至少两项且长度超过8位的密码</span
|
||||
>
|
||||
</div>
|
||||
<span class="edit">
|
||||
<PermissionButton
|
||||
:uhasPermission="`${permission}:update`"
|
||||
type="link"
|
||||
@click="editPasswordVisible = true"
|
||||
>
|
||||
<AIcon type="EditOutlined" style="color: #1d39c4" />
|
||||
</PermissionButton>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 社区版不显示 -->
|
||||
<div class="card" v-if="isNoCommunity">
|
||||
<h3>绑定三方账号</h3>
|
||||
<div class="content">
|
||||
<div class="account-card" v-for="item in bindList" :key="item.id">
|
||||
<img
|
||||
:src="item.logoUrl || getImage(bindIcon[item.provider])"
|
||||
style="height: 50px;width: 50px"
|
||||
width='50px'
|
||||
height='50px'
|
||||
alt=""
|
||||
/>
|
||||
<Ellipsis style="width: 150px; font-size: 22px">
|
||||
<div v-if="item.bound">
|
||||
<div>绑定名：{{ item.others.name }}</div>
|
||||
<div>
|
||||
绑定时间：{{
|
||||
moment(item.bindTime).format(
|
||||
'YYYY-MM-DD HH:mm:ss',
|
||||
)
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>{{ item.name }}未绑定</div>
|
||||
</Ellipsis>
|
||||
<j-popconfirm
|
||||
v-if="item.bound"
|
||||
title="确认解除绑定嘛?"
|
||||
@confirm="() => unBind(item.id)"
|
||||
>
|
||||
<j-button>解除绑定</j-button>
|
||||
</j-popconfirm>
|
||||
<j-button
|
||||
v-else
|
||||
type="primary"
|
||||
@click="clickBind(item.id)"
|
||||
>立即绑定</j-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 第三方用户不显示 -->
|
||||
<div class="card" v-if="!isApiUser">
|
||||
<h3>首页视图</h3>
|
||||
<div class="choose-view">
|
||||
<j-row class="view-content" :gutter="24">
|
||||
<j-col
|
||||
:span="6"
|
||||
class="select-item"
|
||||
:class="{ selected: currentView === 'device' }"
|
||||
@click="currentView = 'device'"
|
||||
>
|
||||
<img :src="getImage('/home/device.png')" alt="" />
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="6"
|
||||
class="select-item"
|
||||
:class="{ selected: currentView === 'ops' }"
|
||||
@click="currentView = 'ops'"
|
||||
>
|
||||
<img :src="getImage('/home/ops.png')" alt="" />
|
||||
</j-col>
|
||||
<j-col
|
||||
:span="6"
|
||||
class="select-item"
|
||||
:class="{
|
||||
selected: currentView === 'comprehensive',
|
||||
}"
|
||||
@click="currentView = 'comprehensive'"
|
||||
>
|
||||
<img
|
||||
:src="getImage('/home/comprehensive.png')"
|
||||
alt=""
|
||||
/>
|
||||
</j-col>
|
||||
</j-row>
|
||||
<j-button type="primary" class="btn" @click="confirm"
|
||||
>确定</j-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<EditInfoDialog
|
||||
v-if="editInfoVisible"
|
||||
v-model:visible="editInfoVisible"
|
||||
:data="{ ...userInfo }"
|
||||
@ok="getUserInfo"
|
||||
/>
|
||||
<EditPasswordDialog
|
||||
v-if="editPasswordVisible"
|
||||
v-model:visible="editPasswordVisible"
|
||||
/>
|
||||
</div>
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="Center">
|
||||
import PermissionButton from '@/components/PermissionButton/index.vue';
|
||||
import EditInfoDialog from './components/EditInfoDialog.vue';
|
||||
import EditPasswordDialog from './components/EditPasswordDialog.vue';
|
||||
import { BASE_API_PATH, TOKEN_KEY } from '@/utils/variable';
|
||||
import { LocalStore, getImage, onlyMessage } from '@/utils/comm'
|
||||
import { message, UploadChangeParam, UploadFile } from 'ant-design-vue';
|
||||
import {
|
||||
getMeInfo_api,
|
||||
getSsoBinds_api,
|
||||
unBind_api,
|
||||
updateMeInfo_api
|
||||
} from '@/api/account/center';
|
||||
import moment from 'moment';
|
||||
import { getMe_api, getView_api, setView_api } from '@/api/home';
|
||||
import { isNoCommunity } from '@/utils/utils';
|
||||
import { userInfoType } from './typing';
|
||||
import { usePermissionStore } from 'store/permission'
|
||||
|
||||
const btnHasPermission = usePermissionStore().hasPermission;
|
||||
const updatePassword = btnHasPermission('account-center:user-center-passwd-update')
|
||||
const permission = 'system/User';
|
||||
const userInfo = ref<userInfoType>({} as any);
|
||||
// 第三方账号
|
||||
const bindList = ref<any[]>([]);
|
||||
const bindIcon = {
|
||||
'dingtalk-ent-app': '/notice/dingtalk.png',
|
||||
'wechat-webapp': '/notice/wechat.png',
|
||||
'internal-standalone': '/apply/provider1.png',
|
||||
'third-party': '/apply/provider5.png',
|
||||
};
|
||||
const unBind = (id: string) => {
|
||||
unBind_api(id).then((resp) => {
|
||||
if (resp.status === 200) {
|
||||
message.success('解绑成功');
|
||||
getSsoBinds();
|
||||
}
|
||||
});
|
||||
};
|
||||
const clickBind = (id: string) => {
|
||||
window.open(
|
||||
`${BASE_API_PATH}/application/sso/${id}/login?autoCreateUser=false`,
|
||||
);
|
||||
localStorage.setItem('onBind', 'false');
|
||||
localStorage.setItem('onLogin', 'yes');
|
||||
window.onstorage = (e) => {
|
||||
if (e.newValue) {
|
||||
getSsoBinds();
|
||||
}
|
||||
};
|
||||
};
|
||||
const upload = reactive({
|
||||
fileList: [] as any[],
|
||||
uploadLoading: false,
|
||||
changeBackUpload: (info: UploadChangeParam<UploadFile<any>>) => {
|
||||
if (info.file.status === 'uploading') {
|
||||
upload.uploadLoading = true;
|
||||
} else if (info.file.status === 'done') {
|
||||
info.file.url = info.file.response?.result;
|
||||
upload.uploadLoading = false;
|
||||
userInfo.value.avatar = info.file.response?.result;
|
||||
updateMeInfo_api(userInfo.value).then(res => {
|
||||
if(res.success) {
|
||||
onlyMessage('上传成功')
|
||||
}
|
||||
})
|
||||
} else if (info.file.status === 'error') {
|
||||
upload.uploadLoading = false;
|
||||
onlyMessage('logo上传失败，请稍后再试', 'error');
|
||||
}
|
||||
},
|
||||
beforeUpload: ({ size, type }: File) => {
|
||||
const imageTypes = ['jpg', 'png', 'jfif', 'pjp', 'pjpeg', 'jpeg'];
|
||||
const typeBool =
|
||||
imageTypes.filter((typeStr) => type.includes(typeStr)).length > 0;
|
||||
const sizeBool = size < 4 * 1024 * 1024;
|
||||
|
||||
(typeBool && sizeBool) || message.error('请上传正确格式的图片');
|
||||
return typeBool && sizeBool;
|
||||
},
|
||||
});
|
||||
// 首页视图
|
||||
const isApiUser = ref<boolean>();
|
||||
const currentView = ref<string>('');
|
||||
const confirm = () => {
|
||||
setView_api({
|
||||
name: 'view',
|
||||
content: currentView.value,
|
||||
}).then(() => message.success('保存成功'));
|
||||
};
|
||||
|
||||
const editInfoVisible = ref<boolean>(false);
|
||||
const editPasswordVisible = ref<boolean>(false);
|
||||
init();
|
||||
|
||||
function init() {
|
||||
getUserInfo();
|
||||
isNoCommunity && getSsoBinds();
|
||||
getViews();
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取用户信息
|
||||
*/
|
||||
function getUserInfo() {
|
||||
getMeInfo_api().then((resp) => {
|
||||
userInfo.value = resp.result as userInfoType;
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 获取绑定第三方账号
|
||||
*/
|
||||
function getSsoBinds() {
|
||||
getSsoBinds_api().then((resp: any) => {
|
||||
if (resp.status === 200) bindList.value = resp.result;
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 获取首页视图
|
||||
*/
|
||||
function getViews() {
|
||||
// 判断是否是api用户 不是则获取选中的视图
|
||||
getMe_api()
|
||||
.then((resp: any) => {
|
||||
if (resp && resp.status === 200) {
|
||||
isApiUser.value = resp.result.dimensions.find(
|
||||
(item: any) =>
|
||||
item.type === 'api-client' ||
|
||||
item.type.id === 'api-client',
|
||||
);
|
||||
if (!isApiUser.value) return getView_api();
|
||||
}
|
||||
})
|
||||
.then((resp: any) => {
|
||||
if (resp?.status === 200) {
|
||||
if (resp.result) currentView.value = resp.result?.content;
|
||||
else if (resp.result?.username === 'admin') {
|
||||
currentView.value = 'comprehensive';
|
||||
} else currentView.value = 'init';
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.center-container {
|
||||
background-color: #f0f2f5;
|
||||
min-height: 100vh;
|
||||
.card {
|
||||
margin: 16px 0;
|
||||
padding: 24px;
|
||||
background-color: #fff;
|
||||
position: relative;
|
||||
|
||||
h3 {
|
||||
font-size: 22px;
|
||||
|
||||
&::before {
|
||||
display: inline-block;
|
||||
width: 3px;
|
||||
height: 0.7em;
|
||||
content: '';
|
||||
background-color: #2f54eb;
|
||||
margin: 0 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
margin-top: 24px;
|
||||
flex-wrap: wrap;
|
||||
gap: 24px;
|
||||
|
||||
.content-item {
|
||||
margin-right: 24px;
|
||||
|
||||
.default-avatar {
|
||||
background-color: #ccc;
|
||||
color: #fff;
|
||||
border-radius: 50%;
|
||||
font-size: 70px;
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.info-card {
|
||||
width: 25%;
|
||||
|
||||
:first-child {
|
||||
font-weight: bold;
|
||||
}
|
||||
:last-child {
|
||||
color: #666363d9;
|
||||
}
|
||||
}
|
||||
&.flex-item {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
.edit {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
top: 30px;
|
||||
right: 24px;
|
||||
color: #1d39c4;
|
||||
}
|
||||
|
||||
.account-card {
|
||||
width: 415px;
|
||||
background-image: url(/images/notice/dingtalk-background.png);
|
||||
border-right: 1px solid #f0f0f0;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.choose-view {
|
||||
width: 100%;
|
||||
margin-top: 48px;
|
||||
.view-content {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
.select-item {
|
||||
border: 2px solid transparent;
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&.selected {
|
||||
border-color: #10239e;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: block;
|
||||
margin: 48px auto;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
10
yarn.lock
10
yarn.lock
|
|
@ -3825,8 +3825,8 @@ jetlinks-store@^0.0.3:
|
|||
|
||||
jetlinks-ui-components@^1.0.24:
|
||||
version "1.0.24"
|
||||
resolved "http://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.24.tgz#97580bed720526b50b3244440c7ae16d3d0a26c0"
|
||||
integrity sha512-7ccv/eu9moZZFzCRuBa8Pe4NLd/knDARWwJaivH+qgkPSIIdij0Wax27zFwoRqivsDzbOAs2iRButcwSNvR9AQ==
|
||||
resolved "http://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.24.tgz#747dbd3c6d8af389d4eb02ffc37e9ee9a8da94c5"
|
||||
integrity sha512-gJ+IJ90p6Q8YQJxfBjep3BCBHg/conxYOHv3v0aiGrzKzdidSk075OcXxOx7bIeAWoqBbY1uCNhYfnhFWCwVIQ==
|
||||
dependencies:
|
||||
"@vueuse/core" "^9.12.0"
|
||||
"@vueuse/router" "^9.13.0"
|
||||
|
|
@ -3834,6 +3834,7 @@ jetlinks-ui-components@^1.0.24:
|
|||
colorpicker-v3 "^2.10.2"
|
||||
lodash-es "^4.17.21"
|
||||
monaco-editor "^0.35.0"
|
||||
sortablejs "^1.15.0"
|
||||
vuedraggable "^4.1.0"
|
||||
|
||||
js-cookie@^3.0.1:
|
||||
|
|
@ -6168,6 +6169,11 @@ sortablejs@1.14.0:
|
|||
resolved "http://registry.jetlinks.cn/sortablejs/-/sortablejs-1.14.0.tgz#6d2e17ccbdb25f464734df621d4f35d4ab35b3d8"
|
||||
integrity sha512-pBXvQCs5/33fdN1/39pPL0NZF20LeRbLQ5jtnheIPN9JQAaufGjKdWduZn4U7wCtVuzKhmRkI0DFYHYRbB2H1w==
|
||||
|
||||
sortablejs@^1.15.0:
|
||||
version "1.15.0"
|
||||
resolved "http://registry.jetlinks.cn/sortablejs/-/sortablejs-1.15.0.tgz#53230b8aa3502bb77a29e2005808ffdb4a5f7e2a"
|
||||
integrity sha512-bv9qgVMjUMf89wAvM6AxVvS/4MX3sPeN0+agqShejLU5z5GX4C75ow1O2e5k4L6XItUyAK3gH6AxSbXrOM5e8w==
|
||||
|
||||
source-map-js@^1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz"
|
||||
|
|
|
|||
Loading…
Reference in New Issue