root/ludu-admin-vue3
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改了logo
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
zengjunhong 2025-01-16 11:13:13 +08:00
parent 400b88a9ff
commit 2c466460e3
2 changed files with 237 additions and 312 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

142
src/views/Home/Index.vue
View File

@ -1,49 +1,9 @@
<template> <template>
<div> <div>
<el-card shadow="never">
<el-skeleton :loading="loading" animated>
<el-row :gutter="16" justify="space-between">
<el-col :xl="12" :lg="12" :md="12" :sm="24" :xs="24">
<div class="flex items-center">
<el-avatar :src="avatar" :size="70" class="mr-16px">
<img src="@/assets/imgs/avatar.gif" alt="" />
</el-avatar>
<div>
<div class="text-20px">
{{ t('workplace.welcome') }} {{ username }} {{ t('workplace.happyDay') }}
</div>
<div class="mt-10px text-14px text-gray-500">
{{ t('workplace.toady') }}，20℃ - 32℃！
</div>
</div>
</div>
</el-col>
<el-col :xl="12" :lg="12" :md="12" :sm="24" :xs="24">
<div class="h-70px flex items-center justify-end lt-sm:mt-10px">
<div class="px-8px text-right">
<div class="mb-16px text-14px text-gray-400">{{ t('workplace.project') }}</div>
<CountTo class="text-20px" :start-val="0" :end-val="totalSate.project" :duration="2600" />
</div>
<el-divider direction="vertical" />
<div class="px-8px text-right">
<div class="mb-16px text-14px text-gray-400">{{ t('workplace.toDo') }}</div>
<CountTo class="text-20px" :start-val="0" :end-val="totalSate.todo" :duration="2600" />
</div>
<el-divider direction="vertical" border-style="dashed" />
<div class="px-8px text-right">
<div class="mb-16px text-14px text-gray-400">{{ t('workplace.access') }}</div>
<CountTo class="text-20px" :start-val="0" :end-val="totalSate.access" :duration="2600" />
</div>
</div>
</el-col>
</el-row>
</el-skeleton>
</el-card>
</div> </div>
<!-- <el-card style="width: 100%; margin: 8px 0; text-align: center;" shadow="never"> --> <!-- <el-card style="width: 100%; margin: 8px 0; text-align: center;" shadow="never"> -->
<div class="flex flex-wrap gap-4" style="float: right;"> <div class="flex flex-wrap gap-4" style="float: right;">
<el-card <el-card style="width: 170px;margin: 8px 0;text-align: center;color:#409eff; cursor: pointer;" shadow="hover"
style="width: 170px;margin: 8px 0;text-align: center;color:#409eff; cursor: pointer;" shadow="hover"
@click="goToXXLJob">任务调度中心</el-card> @click="goToXXLJob">任务调度中心</el-card>
</div> </div>
<!-- </el-card> --> <!-- </el-card> -->
@ -166,44 +126,44 @@ style="width: 170px;margin: 8px 0;text-align: center;color:#409eff; cursor: poin
</el-row> --> </el-row> -->
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { set } from 'lodash-es' import { set } from 'lodash-es'
import { EChartsOption } from 'echarts' import { EChartsOption } from 'echarts'
import { formatTime } from '@/utils' import { formatTime } from '@/utils'
import luduView from '@/assets/imgs/ludu_view.png' import luduView from '@/assets/imgs/ludu_view.png'
import { useUserStore } from '@/store/modules/user' import { useUserStore } from '@/store/modules/user'
import { useWatermark } from '@/hooks/web/useWatermark' import { useWatermark } from '@/hooks/web/useWatermark'
import type { WorkplaceTotal, Project, Notice, Shortcut } from './types' import type { WorkplaceTotal, Project, Notice, Shortcut } from './types'
import { pieOptions, barOptions } from './echarts-data' import { pieOptions, barOptions } from './echarts-data'
defineOptions({ name: 'Home' }) defineOptions({ name: 'Home' })
const luduViewImage = ref(luduView); const luduViewImage = ref(luduView);
const { t } = useI18n() const { t } = useI18n()
const userStore = useUserStore() const userStore = useUserStore()
const { setWatermark } = useWatermark() const { setWatermark } = useWatermark()
const loading = ref(true) const loading = ref(true)
const avatar = userStore.getUser.avatar const avatar = userStore.getUser.avatar
const username = userStore.getUser.nickname const username = userStore.getUser.nickname
const pieOptionsData = reactive<EChartsOption>(pieOptions) as EChartsOption const pieOptionsData = reactive<EChartsOption>(pieOptions) as EChartsOption
// 获取统计数 // 获取统计数
let totalSate = reactive<WorkplaceTotal>({ let totalSate = reactive<WorkplaceTotal>({
project: 0, project: 0,
access: 0, access: 0,
todo: 0 todo: 0
}) })
const getCount = async () => { const getCount = async () => {
const data = { const data = {
project: 40, project: 40,
access: 2340, access: 2340,
todo: 10 todo: 10
} }
totalSate = Object.assign(totalSate, data) totalSate = Object.assign(totalSate, data)
} }
// 获取项目数 // 获取项目数
let projects = reactive<Project[]>([]) let projects = reactive<Project[]>([])
const getProject = async () => { const getProject = async () => {
const data = [ const data = [
{ {
name: 'ruoyi-vue-pro', name: 'ruoyi-vue-pro',
@ -249,11 +209,11 @@ style="width: 170px;margin: 8px 0;text-align: center;color:#409eff; cursor: poin
} }
] ]
projects = Object.assign(projects, data) projects = Object.assign(projects, data)
} }
// 获取通知公告 // 获取通知公告
let notice = reactive<Notice[]>([]) let notice = reactive<Notice[]>([])
const getNotice = async () => { const getNotice = async () => {
const data = [ const data = [
{ {
title: '系统支持 JDK 8/17/21，Vue 2/3', title: '系统支持 JDK 8/17/21，Vue 2/3',
@ -281,12 +241,12 @@ style="width: 170px;margin: 8px 0;text-align: center;color:#409eff; cursor: poin
} }
] ]
notice = Object.assign(notice, data) notice = Object.assign(notice, data)
} }
// 获取快捷入口 // 获取快捷入口
let shortcut = reactive<Shortcut[]>([]) let shortcut = reactive<Shortcut[]>([])
const getShortcut = async () => { const getShortcut = async () => {
const data = [ const data = [
{ {
name: 'Github', name: 'Github',
@ -320,10 +280,10 @@ style="width: 170px;margin: 8px 0;text-align: center;color:#409eff; cursor: poin
} }
] ]
shortcut = Object.assign(shortcut, data) shortcut = Object.assign(shortcut, data)
} }
// 用户来源 // 用户来源
const getUserAccessSource = async () => { const getUserAccessSource = async () => {
const data = [ const data = [
{ value: 335, name: 'analysis.directAccess' }, { value: 335, name: 'analysis.directAccess' },
{ value: 310, name: 'analysis.mailMarketing' }, { value: 310, name: 'analysis.mailMarketing' },
@ -342,11 +302,11 @@ style="width: 170px;margin: 8px 0;text-align: center;color:#409eff; cursor: poin
value: v.value value: v.value
} }
}) })
} }
const barOptionsData = reactive<EChartsOption>(barOptions) as EChartsOption const barOptionsData = reactive<EChartsOption>(barOptions) as EChartsOption
// 周活跃量 // 周活跃量
const getWeeklyUserActivity = async () => { const getWeeklyUserActivity = async () => {
const data = [ const data = [
{ value: 13253, name: 'analysis.monday' }, { value: 13253, name: 'analysis.monday' },
{ value: 34235, name: 'analysis.tuesday' }, { value: 34235, name: 'analysis.tuesday' },
@ -368,9 +328,9 @@ style="width: 170px;margin: 8px 0;text-align: center;color:#409eff; cursor: poin
type: 'bar' type: 'bar'
} }
]) ])
} }
const getAllApi = async () => { const getAllApi = async () => {
await Promise.all([ await Promise.all([
getCount(), getCount(),
getProject(), getProject(),
@ -380,22 +340,22 @@ style="width: 170px;margin: 8px 0;text-align: center;color:#409eff; cursor: poin
getWeeklyUserActivity() getWeeklyUserActivity()
]) ])
loading.value = false loading.value = false
} }
const goToXXLJob = async () => { const goToXXLJob = async () => {
window.open('http://121.36.203.133/xxl-job-admin/'); window.open('http://121.36.203.133/xxl-job-admin/');
} }
getAllApi() getAllApi()
</script> </script>
<style scoped> <style scoped>
.image-container { .image-container {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.el-image img { .el-image img {
width: 100%; width: 100%;
height: auto; height: auto;
} }
</style> </style>

65
src/views/Login/components/LoginForm.vue
View File

@ -1,14 +1,6 @@
<template> <template>
<el-form <el-form v-show="getShow" ref="formLogin" :model="loginData.loginForm" :rules="LoginRules" class="login-form"
v-show="getShow" label-position="top" label-width="120px" size="large">
ref="formLogin"
:model="loginData.loginForm"
:rules="LoginRules"
class="login-form"
label-position="top"
label-width="120px"
size="large"
>
<el-row style="margin-right: -10px; margin-left: -10px"> <el-row style="margin-right: -10px; margin-left: -10px">
<el-col :span="24" style="padding-right: 10px; padding-left: 10px"> <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item> <el-form-item>
@ -17,40 +9,23 @@
</el-col> </el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px"> <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item v-if="loginData.tenantEnable === 'true'" prop="tenantName"> <el-form-item v-if="loginData.tenantEnable === 'true'" prop="tenantName">
<el-input <el-input v-model="loginData.loginForm.tenantName" :placeholder="t('login.tenantNamePlaceholder')"
v-model="loginData.loginForm.tenantName" :prefix-icon="iconHouse" link type="primary" />
:placeholder="t('login.tenantNamePlaceholder')"
:prefix-icon="iconHouse"
link
type="primary"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px"> <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item prop="username"> <el-form-item prop="username">
<el-input <el-input v-model="loginData.loginForm.username" :placeholder="t('login.usernamePlaceholder')"
v-model="loginData.loginForm.username" :prefix-icon="iconAvatar" />
:placeholder="t('login.usernamePlaceholder')"
:prefix-icon="iconAvatar"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px"> <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item prop="password"> <el-form-item prop="password">
<el-input <el-input v-model="loginData.loginForm.password" :placeholder="t('login.passwordPlaceholder')"
v-model="loginData.loginForm.password" :prefix-icon="iconLock" show-password type="password" @keyup.enter="getCode()" />
:placeholder="t('login.passwordPlaceholder')"
:prefix-icon="iconLock"
show-password
type="password"
@keyup.enter="getCode()"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col <el-col :span="24" style="padding-right: 10px; padding-left: 10px; margin-top: -20px; margin-bottom: -20px">
:span="24"
style="padding-right: 10px; padding-left: 10px; margin-top: -20px; margin-bottom: -20px"
>
<el-form-item> <el-form-item>
<el-row justify="space-between" style="width: 100%"> <el-row justify="space-between" style="width: 100%">
<el-col :span="6"> <el-col :span="6">
@ -66,22 +41,12 @@
</el-col> </el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px"> <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item> <el-form-item>
<XButton <XButton :loading="loginLoading" :title="t('login.login')" class="w-[100%]" type="primary"
:loading="loginLoading" @click="getCode()" />
:title="t('login.login')"
class="w-[100%]"
type="primary"
@click="getCode()"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<Verify <Verify ref="verify" :captchaType="captchaType" :imgSize="{ width: '400px', height: '200px' }" mode="pop"
ref="verify" @success="handleLogin" />
:captchaType="captchaType"
:imgSize="{ width: '400px', height: '200px' }"
mode="pop"
@success="handleLogin"
/>
<!-- <el-col :span="24" style="padding-right: 10px; padding-left: 10px"> <!-- <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item> <el-form-item>
<el-row :gutter="5" justify="space-between" style="width: 100%"> <el-row :gutter="5" justify="space-between" style="width: 100%">
@ -184,9 +149,9 @@ const loginData = reactive({
captchaEnable: import.meta.env.VITE_APP_CAPTCHA_ENABLE, captchaEnable: import.meta.env.VITE_APP_CAPTCHA_ENABLE,
tenantEnable: import.meta.env.VITE_APP_TENANT_ENABLE, tenantEnable: import.meta.env.VITE_APP_TENANT_ENABLE,
loginForm: { loginForm: {
tenantName: '芋道源码', tenantName: '智慧码头',
username: 'admin', username: 'admin',
password: 'admin123', password: 'mt@6688',
captchaVerification: '', captchaVerification: '',
rememberMe: true // 默认记录我。如果不需要，可手动修改 rememberMe: true // 默认记录我。如果不需要，可手动修改
} }