登录和首页调整
This commit is contained in:
parent
72eebf7697
commit
3762f9232d
@ -2,21 +2,26 @@
|
|||||||
<view class="home-page">
|
<view class="home-page">
|
||||||
<view class="content-container">
|
<view class="content-container">
|
||||||
<!-- 用户信息卡片 -->
|
<!-- 用户信息卡片 -->
|
||||||
<view class="user-info-card" v-if="currentStudent">
|
<view class="user-info-card" v-if="curXs">
|
||||||
|
<view class="banner-content">
|
||||||
|
<image src="/static/base/home/2211.png" class="banner-img"></image>
|
||||||
|
<view class="banner-overlay">
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
<view class="user-content">
|
<view class="user-content">
|
||||||
<view class="user-avatar">
|
<view class="user-avatar">
|
||||||
<image :src="currentStudent.xstx || '/static/base/home/11222.png'" class="avatar-img"></image>
|
<image :src="xsTx || '/static/base/home/11222.png'" class="avatar-img"></image>
|
||||||
<view class="avatar-ring"></view>
|
<view class="avatar-ring"></view>
|
||||||
</view>
|
</view>
|
||||||
<view class="user-details">
|
<view class="user-details">
|
||||||
<text class="user-name">{{ currentStudent.xm }}</text>
|
<text class="user-name">{{ curXs.xm }}</text>
|
||||||
<view class="user-class-container">
|
<view class="user-class-container">
|
||||||
<view class="class-tag">
|
<view class="class-tag">
|
||||||
<text class="user-class">{{ currentStudent.njmc }} {{ currentStudent.bjmc }}</text>
|
<text class="user-class">{{ curXs.njmc }} {{ curXs.bjmc }}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="switch-btn" @click="showStudentSelector" v-if="studentList && studentList.length > 1">
|
<view class="switch-btn" @click="showXsSelector" v-if="xsList && xsList.length > 1">
|
||||||
<u-icon name="arrow-down" size="12" color="#fff"></u-icon>
|
<u-icon name="arrow-down" size="12" color="#fff"></u-icon>
|
||||||
<text>切换</text>
|
<text>切换</text>
|
||||||
</view>
|
</view>
|
||||||
@ -24,17 +29,7 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 学校横幅 -->
|
<!-- 学校横幅 -->
|
||||||
<view class="school-banner">
|
<!-- -->
|
||||||
<view class="banner-content">
|
|
||||||
<image src="/static/base/home/2211.png" class="banner-img"></image>
|
|
||||||
<view class="banner-overlay">
|
|
||||||
<view class="banner-text">
|
|
||||||
<text class="banner-title">智慧校园</text>
|
|
||||||
<text class="banner-subtitle">让教育更智能,让成长更精彩</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<!-- 功能菜单 -->
|
<!-- 功能菜单 -->
|
||||||
<view class="menu-section">
|
<view class="menu-section">
|
||||||
@ -106,20 +101,20 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="student-list">
|
<view class="student-list">
|
||||||
<view
|
<view
|
||||||
v-for="(student, index) in studentList"
|
v-for="(xs, index) in xsList"
|
||||||
:key="index"
|
:key="index"
|
||||||
class="student-item"
|
class="student-item"
|
||||||
:class="{ 'student-item-active': currentStudent.id === student.id }"
|
:class="{ 'student-item-active': curXs.id === xs.id }"
|
||||||
@click="switchStudent(student)"
|
@click="switchXs(xs)"
|
||||||
>
|
>
|
||||||
<view class="student-avatar">
|
<view class="student-avatar">
|
||||||
<image :src="student.xstx || '/static/base/home/11222.png'" class="avatar-img"></image>
|
<image :src="xsTx || '/static/base/home/11222.png'" class="avatar-img"></image>
|
||||||
</view>
|
</view>
|
||||||
<view class="student-info">
|
<view class="student-info">
|
||||||
<text class="student-name">{{ student.xm }}</text>
|
<text class="student-name">{{ xs.xm }}</text>
|
||||||
<text class="student-class">{{ student.njmc }} {{ student.bjmc }}</text>
|
<text class="student-class">{{ xs.njmc }} {{ xs.bjmc }}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="check-icon" v-if="currentStudent.id === student.id">
|
<view class="check-icon" v-if="curXs.id === xs.id">
|
||||||
<u-icon name="checkmark" color="#4A90E2" size="18"></u-icon>
|
<u-icon name="checkmark" color="#4A90E2" size="18"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@ -132,10 +127,12 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from "vue";
|
import { ref } from "vue";
|
||||||
import { cmsArticlePageApi } from "@/api/base/server";
|
import { cmsArticlePageApi } from "@/api/base/server";
|
||||||
|
import { imagUrl } from "@/utils";
|
||||||
import { useUserStore } from "@/store/modules/user";
|
import { useUserStore } from "@/store/modules/user";
|
||||||
import { useDataStore } from "@/store/modules/data";
|
import { useDataStore } from "@/store/modules/data";
|
||||||
|
import { get } from "lodash";
|
||||||
const { getUser, setCurXs, getCurXs } = useUserStore();
|
const { getUser, setCurXs, getCurXs } = useUserStore();
|
||||||
const { setData } = useDataStore();
|
const { setData, getAppCode } = useDataStore();
|
||||||
|
|
||||||
// 菜单项数据
|
// 菜单项数据
|
||||||
const menuItems = ref([
|
const menuItems = ref([
|
||||||
@ -199,25 +196,28 @@ const announcements = ref<any>([
|
|||||||
])
|
])
|
||||||
|
|
||||||
// 学生列表数据
|
// 学生列表数据
|
||||||
const studentList = ref([
|
const xsList = ref([
|
||||||
{
|
{
|
||||||
id: "1",
|
id: "1",
|
||||||
xm: "陶亦菲",
|
xm: "陶亦菲",
|
||||||
njmc: "2年级",
|
njmc: "2年级",
|
||||||
bjmc: "01班",
|
bjmc: "01班",
|
||||||
|
njmcId: "",
|
||||||
xstx: "/static/base/home/11222.png",
|
xstx: "/static/base/home/11222.png",
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
|
|
||||||
// 当前选中的学生
|
// 当前选中的学生
|
||||||
let currentStudent = ref(studentList.value[0]);
|
let curXs = ref(xsList.value[0]);
|
||||||
|
const xsTx = ref(imagUrl(curXs.value.xstx));
|
||||||
|
|
||||||
// 控制选择器显示状态
|
// 控制选择器显示状态
|
||||||
const showSelector = ref(false);
|
const showSelector = ref(false);
|
||||||
|
|
||||||
let pageParams = ref({
|
let pageParams = ref({
|
||||||
page: 1,
|
page: 1,
|
||||||
rows: 10
|
rows: 10,
|
||||||
|
appCode: getAppCode
|
||||||
})
|
})
|
||||||
|
|
||||||
// 处理菜单点击
|
// 处理菜单点击
|
||||||
@ -231,20 +231,21 @@ function handleMenuClick(item: any) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 显示学生选择器
|
// 显示学生选择器
|
||||||
function showStudentSelector() {
|
function showXsSelector() {
|
||||||
showSelector.value = true;
|
showSelector.value = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 切换学生
|
// 切换学生
|
||||||
function switchStudent(student: any) {
|
function switchXs(xs: any) {
|
||||||
currentStudent.value = student;
|
curXs.value = xs;
|
||||||
|
xsTx.value = imagUrl(xs.xstx);
|
||||||
showSelector.value = false;
|
showSelector.value = false;
|
||||||
|
getArticleList();
|
||||||
// 记录存储切换
|
// 记录存储切换
|
||||||
setCurXs(student);
|
setCurXs(xs);
|
||||||
|
|
||||||
// 这里可以添加切换学生后的其他操作,如刷新页面数据等
|
// 这里可以添加切换学生后的其他操作,如刷新页面数据等
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: `已切换到${student.xm}`,
|
title: `已切换到${xs.xm}`,
|
||||||
icon: "none",
|
icon: "none",
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -257,9 +258,8 @@ function goToDetail(notice: any) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
const getArticleList = async () => {
|
||||||
studentList.value = getUser.xsList;
|
const params = Object.assign({}, pageParams.value, { njmcId: curXs.value.njmcId });
|
||||||
currentStudent = getCurXs;
|
|
||||||
cmsArticlePageApi(pageParams.value).then(res => {
|
cmsArticlePageApi(pageParams.value).then(res => {
|
||||||
announcements.value = res.rows;
|
announcements.value = res.rows;
|
||||||
})
|
})
|
||||||
@ -267,6 +267,14 @@ onMounted(async () => {
|
|||||||
// 接口调用失败
|
// 接口调用失败
|
||||||
console.error("调用检查通知公告接口失败:", error);
|
console.error("调用检查通知公告接口失败:", error);
|
||||||
});
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
xsList.value = getUser.xsList;
|
||||||
|
curXs.value = getCurXs;
|
||||||
|
xsTx.value = imagUrl(getCurXs.xstx);
|
||||||
|
console.log(xsTx.value, getCurXs.xstx)
|
||||||
|
getArticleList();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -295,6 +303,33 @@ onMounted(async () => {
|
|||||||
border: 1px solid rgba(255, 255, 255, 0.8);
|
border: 1px solid rgba(255, 255, 255, 0.8);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
|
.banner-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
|
||||||
|
.banner-img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner-overlay {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: linear-gradient(135deg, rgba(74, 144, 226, 0.8) 0%, rgba(53, 122, 189, 0.9) 100%);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.user-content {
|
.user-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@ -339,7 +374,7 @@ onMounted(async () => {
|
|||||||
.user-name {
|
.user-name {
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: #303133;
|
color: white;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
line-height: 1.2;
|
line-height: 1.2;
|
||||||
}
|
}
|
||||||
@ -392,56 +427,6 @@ onMounted(async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 学校横幅 */
|
|
||||||
.school-banner {
|
|
||||||
margin-bottom: 25px;
|
|
||||||
border-radius: 16px;
|
|
||||||
overflow: hidden;
|
|
||||||
box-shadow: 0 10px 32px rgba(0, 0, 0, 0.15);
|
|
||||||
|
|
||||||
.banner-content {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
height: 160px;
|
|
||||||
|
|
||||||
.banner-img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
object-fit: cover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.banner-overlay {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
background: linear-gradient(135deg, rgba(74, 144, 226, 0.8) 0%, rgba(53, 122, 189, 0.9) 100%);
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
.banner-text {
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
.banner-title {
|
|
||||||
font-size: 26px;
|
|
||||||
font-weight: 700;
|
|
||||||
color: #ffffff;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
|
|
||||||
}
|
|
||||||
|
|
||||||
.banner-subtitle {
|
|
||||||
font-size: 14px;
|
|
||||||
color: rgba(255, 255, 255, 0.9);
|
|
||||||
font-weight: 400;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 功能菜单 */
|
/* 功能菜单 */
|
||||||
.menu-section {
|
.menu-section {
|
||||||
margin-bottom: 25px;
|
margin-bottom: 25px;
|
||||||
|
|||||||
@ -275,7 +275,7 @@ function toHome() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const { getGlobal } = useDataStore();
|
const { getGlobal, getAppCode } = useDataStore();
|
||||||
const { afterLoginAction } = useUserStore();
|
const { afterLoginAction } = useUserStore();
|
||||||
async function submit() {
|
async function submit() {
|
||||||
for (const student of students.value) {
|
for (const student of students.value) {
|
||||||
@ -299,7 +299,7 @@ async function submit() {
|
|||||||
xsList: students.value,
|
xsList: students.value,
|
||||||
...formData,
|
...formData,
|
||||||
openId: getGlobal.openId,
|
openId: getGlobal.openId,
|
||||||
appCode: "JZ",
|
appCode: getAppCode,
|
||||||
});
|
});
|
||||||
hideLoading();
|
hideLoading();
|
||||||
if (res.resultCode == 1) {
|
if (res.resultCode == 1) {
|
||||||
|
|||||||
@ -7,6 +7,7 @@ export const useDataStore = defineStore({
|
|||||||
kcData: {},
|
kcData: {},
|
||||||
global: {},
|
global: {},
|
||||||
file: {},
|
file: {},
|
||||||
|
appCode: "JZ"
|
||||||
}),
|
}),
|
||||||
getters: {
|
getters: {
|
||||||
getData(): any {
|
getData(): any {
|
||||||
@ -21,6 +22,9 @@ export const useDataStore = defineStore({
|
|||||||
getKcData(): any {
|
getKcData(): any {
|
||||||
return this.kcData;
|
return this.kcData;
|
||||||
},
|
},
|
||||||
|
getAppCode(): string {
|
||||||
|
return this.appCode;
|
||||||
|
},
|
||||||
},
|
},
|
||||||
actions: {
|
actions: {
|
||||||
setData(data: any) {
|
setData(data: any) {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user