Skip to content

S
saas
提交 3dae3c3d authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

updates

上级 98e63c7f
全部展开 隐藏空白字符变更
内嵌 并排
正在显示 包含 137 行增加 和 92 行删除
package-lock.json
浏览文件 @ 3dae3c3d
差异被折叠。
package.json
浏览文件 @ 3dae3c3d
......@@ -14,6 +14,7 @@
"dependencies": {
"axios": "^0.26.1",
"countup.js": "^2.1.0",
"element-plus": "^2.1.2",
"pinia": "^2.0.11",
"vue": "^3.2.31",
"vue-router": "^4.0.14"
......
src/components/layout/Index.vue
浏览文件 @ 3dae3c3d
......@@ -16,6 +16,5 @@ import AppHeader from './Header.vue'
min-height: 100vh;
background: #f9f8f8 url('https://webapp-pub.ezijing.com/project/saas/bg.png') no-repeat center bottom;
background-size: cover;
background-attachment: fixed;
}
</style>
src/main.ts
浏览文件 @ 3dae3c3d
......@@ -3,17 +3,21 @@ import { createPinia } from 'pinia'
import App from './App.vue'
import router from './router'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import modules from './modules'
// 公共css
import './assets/css/base.css'
const app = createApp(App)
// 注册模块
modules({ router })
app.use(createPinia())
app.use(router)
app.use(ElementPlus)
app.mount('#app')
src/modules/home/components/Card.vue
浏览文件 @ 3dae3c3d
<script setup lang="ts">
import AppCard from '@/components/base/AppCard.vue'
import CardBoxCell from './CardBoxCell.vue'
defineProps({ data: { type: Object, default: () => ({}) } })
</script>
......@@ -9,28 +10,12 @@ defineProps({ data: { type: Object, default: () => ({}) } })
<div class="box">
<div class="box-left">
<div class="box-row" v-for="(row, index) in data.leftItems" :key="index">
<div class="box-cell" v-for="(cell, index) in row" :key="index">
<a :href="cell.href" target="_blank">
<div class="box-cell-icon">
<img :src="cell.icon" class="icon-normal" />
<img :src="cell.hoverIcon" class="icon-hover" />
</div>
<div class="box-cell-name">{{ cell.title }}</div>
</a>
</div>
<CardBoxCell v-for="(cell, index) in row" :data="cell" :key="index"></CardBoxCell>
</div>
</div>
<div class="box-right" v-if="data.rightItems">
<div class="box-row" v-for="(row, index) in data.rightItems" :key="index">
<div class="box-cell" v-for="(cell, index) in row" :key="index">
<a :href="cell.href" target="_blank">
<div class="box-cell-icon">
<img :src="cell.icon" class="icon-normal" />
<img :src="cell.hoverIcon" class="icon-hover" />
</div>
<div class="box-cell-name">{{ cell.title }}</div>
</a>
</div>
<CardBoxCell v-for="(cell, index) in row" :data="cell" :key="index"></CardBoxCell>
</div>
</div>
</div>
......@@ -43,8 +28,7 @@ defineProps({ data: { type: Object, default: () => ({}) } })
}
.box-left {
flex: 1;
a:hover {
color: #fff;
.box-cell:hover {
background-color: #aa1941;
}
}
......@@ -53,8 +37,7 @@ defineProps({ data: { type: Object, default: () => ({}) } })
margin-left: 20px;
padding-left: 20px;
border-left: 1px dashed #c1c1c1;
a:hover {
color: #fff;
.box-cell:hover {
background-color: #136ca8;
}
}
......@@ -64,59 +47,15 @@ defineProps({ data: { type: Object, default: () => ({}) } })
.box-row + .box-row {
margin-top: 20px;
}
.box-cell {
flex: 1;
background-color: #f7f5f5;
border-radius: 20px;
color: #333;
overflow: hidden;
a {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 150px;
&:hover {
.icon-normal {
display: none;
}
.icon-hover {
display: block;
}
}
}
}
.box-cell + .box-cell {
margin-left: 20px;
}
.box-cell-icon {
height: 46px;
img {
height: 100%;
object-fit: contain;
}
.icon-normal {
display: block;
}
.icon-hover {
display: none;
}
}
.box-cell-name {
margin-top: 18px;
font-size: 16px;
font-weight: 400;
line-height: 28px;
}
.is-blue {
.app-card-hd__title {
border-color: #136ca8;
}
.box-cell {
a:hover {
color: #fff;
background-color: #136ca8;
}
.box-cell:hover {
background-color: #136ca8;
}
}
</style>
src/modules/home/components/CardBoxCell.vue 0 → 100644
浏览文件 @ 3dae3c3d
<script setup lang="ts">
const props = defineProps({ data: { type: Object, default: () => ({}) } })
function handleClick() {
props.data.onClick && props.data.onClick()
}
</script>
<template>
<div class="box-cell" v-if="data.href">
<a :href="data.href" target="_blank">
<div class="box-cell-icon">
<img :src="data.icon" class="icon-normal" />
<img :src="data.hoverIcon" class="icon-hover" />
</div>
<div class="box-cell-name">{{ data.title }}</div>
</a>
</div>
<div class="box-cell" @click="handleClick" v-else>
<div class="box-cell-icon">
<img :src="data.icon" class="icon-normal" />
<img :src="data.hoverIcon" class="icon-hover" />
</div>
<div class="box-cell-name">{{ data.title }}</div>
</div>
</template>
<style lang="scss">
.box-cell {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: #f7f5f5;
height: 150px;
border-radius: 20px;
color: #333;
cursor: pointer;
a {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: inherit;
width: 100%;
height: 100%;
}
&:hover {
color: #fff;
box-shadow: 1px 3px 18px rgba(0, 0, 0, 0.18);
a {
color: #fff;
}
.icon-normal {
display: none;
}
.icon-hover {
display: block;
}
}
}
.box-cell-icon {
height: 46px;
img {
height: 100%;
object-fit: contain;
}
.icon-normal {
display: block;
}
.icon-hover {
display: none;
}
}
.box-cell-name {
margin-top: 18px;
font-size: 16px;
font-weight: 400;
line-height: 28px;
}
</style>
src/modules/home/views/Index.vue
浏览文件 @ 3dae3c3d
<script setup lang="ts">
import { ElMessage } from 'element-plus'
import Total from '../components/Total.vue'
import Card from '../components/Card.vue'
const rows = [
......@@ -11,13 +12,17 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_1_1.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_1_1_hover.png',
title: 'CMS教学资源系统',
href: 'https://course.ezijing.com/'
onClick() {
ElMessage({ message: '暂未开放' })
}
},
{
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_1_2.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_1_2_hover.png',
title: '课程管理中心',
href: ''
onClick() {
ElMessage({ message: '暂未开放' })
}
}
]
],
......@@ -27,13 +32,17 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_1_3.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_1_3_hover.png',
title: '课程学习',
href: ''
onClick() {
ElMessage({ message: '暂未开放' })
}
},
{
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_1_4.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_1_4_hover.png',
title: '在线考试',
href: ''
onClick() {
ElMessage({ message: '暂未开放' })
}
}
]
]
......@@ -92,7 +101,9 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_2_7.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_2_7_hover.png',
title: '考试中心',
href: 'https://x-exam.ezijing.com'
onClick() {
ElMessage({ message: '当前暂无考试' })
}
},
{
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_2_8.png',
......@@ -113,13 +124,17 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_1.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_1_hover.png',
title: '教学管理',
href: 'https://x-school.ezijing.com'
onClick() {
ElMessage({ message: '暂未开放' })
}
},
{
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_2.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_2_hover.png',
title: '教务管理',
href: 'https://x-school.ezijing.com'
onClick() {
ElMessage({ message: '暂未开放' })
}
}
],
[
......@@ -127,13 +142,13 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_3.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_3_hover.png',
title: '题库管理',
href: 'https://qa-center.ezijing.com'
href: 'https://qa-center.ezijing.com?project_tag=marywood_plus'
},
{
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_4.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_4_hover.png',
title: '考务管理',
href: 'https://qa-center.ezijing.com/exam?project_tag=x1'
href: 'https://qa-center.ezijing.com/exam?project_tag=marywood_plus'
}
]
],
......@@ -143,7 +158,9 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_5.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_5_hover.png',
title: '课程学习',
href: ''
onClick() {
ElMessage({ message: '暂未开放' })
}
}
],
[
......@@ -151,7 +168,9 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_6.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_3_6_hover.png',
title: '在线考试',
href: ''
onClick() {
ElMessage({ message: '当前暂无考试' })
}
}
]
]
......@@ -166,13 +185,13 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_1.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_1_hover.png',
title: '教学管理',
href: ''
href: 'https://marywood-admin.ezijing.com'
},
{
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_2.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_2_hover.png',
title: '教务管理',
href: ''
href: 'https://marywood-admin.ezijing.com'
}
],
[
......@@ -180,13 +199,13 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_3.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_3_hover.png',
title: '题库管理',
href: ''
href: 'https://qa-center.ezijing.com?project_tag=marywood'
},
{
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_4.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_4_hover.png',
title: '考务管理',
href: ''
href: 'https://qa-center.ezijing.com/exam?project_tag=marywood'
}
]
],
......@@ -196,7 +215,7 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_5.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_5_hover.png',
title: '课程学习',
href: ''
href: 'https://marywood-learning.ezijing.com'
}
],
[
......@@ -204,7 +223,9 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_6.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_4_6_hover.png',
title: '在线考试',
href: ''
onClick() {
ElMessage({ message: '暂未开放' })
}
}
]
]
......@@ -233,13 +254,13 @@ const rows = [
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_6_1.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_6_1_hover.png',
title: '商业数据分析实验室',
href: 'https://www.ezijing.com'
href: 'http://114.242.229.132:18080/bi'
},
{
icon: 'https://webapp-pub.ezijing.com/project/saas/icon_6_2.png',
hoverIcon: 'https://webapp-pub.ezijing.com/project/saas/icon_6_2_hover.png',
title: '数字化营销平台',
href: 'https://x-training.ezijing.com'
href: 'https://xtraining.ezijing.com'
}
]
]
......
src/modules/index.ts
浏览文件 @ 3dae3c3d
import type { Router } from 'vue-router'
import type { Module } from '@/types'
import type { AppModule } from '@/types'
export default function ({ router }: { router: Router }) {
const modules: Array<Module> = Object.values(import.meta.globEager('./**/index.ts'))
const modules: Array<AppModule> = Object.values(import.meta.globEager('./**/index.ts'))
modules.forEach(({ routes = [] }) => {
// 注册路由
routes.forEach(route => {
......
src/types.ts
浏览文件 @ 3dae3c3d
......@@ -9,6 +9,6 @@ export interface UserState {
username: string
}
export interface Module {
export interface AppModule {
routes: Array<RouteRecordRaw>
}
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论