From 49a435043b0b1a289a24606e35253365d7ab3956 Mon Sep 17 00:00:00 2001
From: QYF-GitLab1 <1940665526@qq.com>
Date: 星期一, 25 八月 2025 17:51:57 +0800
Subject: [PATCH] 首页、及教学出版样式修改
---
src/views/personalCenter/class.vue | 292 +++++++++++++++++++++++++++------------------------------
1 files changed, 139 insertions(+), 153 deletions(-)
diff --git a/src/views/personalCenter/class.vue b/src/views/personalCenter/class.vue
index 3b25649..b614495 100644
--- a/src/views/personalCenter/class.vue
+++ b/src/views/personalCenter/class.vue
@@ -3,34 +3,19 @@
<div class="personalPage-title">鎴戠殑鐝骇</div>
<div class="tabs">
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
- <el-tab-pane
- :label="'褰撳墠鐝骇锛�' + calssList.length + '锛�'"
- name="1"
- ></el-tab-pane>
+ <el-tab-pane :label="'褰撳墠鐝骇锛�' + calssList.length + '锛�'" name="1"></el-tab-pane>
<!-- <el-tab-pane label="鍘嗗彶鐝骇(5)" name="2"></el-tab-pane> -->
</el-tabs>
</div>
<div class="headerBox">
<div class="searchBox">
- <el-input
- v-model="searchKey"
- clearable
- @clear="searchList()"
- placeholder="璇疯緭鍏ュ叧閿瓧"
- >
+ <el-input v-model="searchKey" clearable @clear="searchList()" placeholder="璇疯緭鍏ュ叧閿瓧">
<template #append>
- <el-button
- type="primary"
- class="searchBtn"
- @click="searchList()"
- :icon="Search"
- />
+ <el-button type="primary" class="searchBtn" @click="searchList()" :icon="Search" />
</template>
</el-input>
</div>
- <el-button type="primary" class="applyStartClasses" @click="openJoin()"
- >鍔犲叆鐝骇</el-button
- >
+ <el-button type="primary" class="applyStartClasses" @click="openJoin()">鍔犲叆鐝骇</el-button>
<el-dialog v-model="dialogVisible" title="鍔犲叆鐝骇" width="500">
<div class="codeContent">
<span>閭�璇风爜锛�</span>
@@ -49,15 +34,17 @@
<div class="itemCon">
<span>寮�璇炬椂闂达細</span>
<span
- >{{ moment(classDetail.beginDate).format("YYYY-MM-DD") }} -
- {{ moment(classDetail.endDate).format("YYYY-MM-DD") }}</span
+ >{{ moment(classDetail.beginDate).format('YYYY-MM-DD') }} -
+ {{ moment(classDetail.endDate).format('YYYY-MM-DD') }}</span
>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="dialogVisible = false"> 鍙栨秷 </el-button>
- <el-button type="primary" @click="joinClass()"> 纭 </el-button>
+ <el-button type="primary" :disabled="!classDetail?.name" @click="joinClass()">
+ 鍔犲叆
+ </el-button>
</div>
</template>
</el-dialog>
@@ -72,10 +59,8 @@
<div class="itemInfo" @click="goClassManage(item)">
<div class="infoBox">
<p>
- 鐘舵�侊細<span v-if="item.userState == 'WaitValid'" style="color: #ef9f29">
- 瀹℃牳涓� </span
- ><span v-if="item.userState == 'Normal'" style="color: #1dbd11">
- 杩涜涓� </span
+ 鐘舵�侊細<span v-if="item.userState == 'WaitValid'" style="color: #ef9f29"> 瀹℃牳涓� </span
+ ><span v-if="item.userState == 'Normal'" style="color: #1dbd11"> 杩涜涓� </span
><span v-if="item.userState == 'Reject'" style="color: red"> 鏈�氳繃 </span>
</p>
<p>鐝骇浜烘暟锛歿{ item.memberCount }} / {{ item.maxUserCount }}</p>
@@ -102,43 +87,43 @@
</template>
<script setup lang="ts">
-import { reactive, ref, onMounted, inject, watch } from "vue";
-import { Search } from "@element-plus/icons-vue";
-import { useRouter } from "vue-router";
-import { ElMessage } from "element-plus";
-import { getPublicImage } from "@/assets/js/middleGround/tool.js";
-import moment from "moment";
-import useClipboard from "vue-clipboard3";
+import { reactive, ref, onMounted, inject, watch } from 'vue'
+import { Search } from '@element-plus/icons-vue'
+import { useRouter } from 'vue-router'
+import { ElMessage } from 'element-plus'
+import { getPublicImage } from '@/assets/js/middleGround/tool.js'
+import moment from 'moment'
+import useClipboard from 'vue-clipboard3'
-const { toClipboard } = useClipboard();
-const MG: any = inject("MG");
-const config: any = inject("config");
-const router = useRouter();
-const activeName = ref("1");
+const { toClipboard } = useClipboard()
+const MG: any = inject('MG')
+const config: any = inject('config')
+const router = useRouter()
+const activeName = ref('1')
interface ClassItem {
- id: string;
- name: string;
- memberCount: number;
- maxUserCount: number;
- userState: string;
- beginDate: string;
- endDate: string;
- classTime: string;
+ id: string
+ name: string
+ memberCount: number
+ maxUserCount: number
+ userState: string
+ beginDate: string
+ endDate: string
+ classTime: string
linkProductDto: {
product: {
- name: string;
- icon: string;
- };
- };
+ name: string
+ icon: string
+ }
+ }
}
-const calssList = ref<ClassItem[]>([]);
-const searchKey = ref("");
-const codeText = ref("");
-const dialogVisible = ref(false);
-const classDetail = ref();
-const isLoading = ref(true);
+const calssList = ref<ClassItem[]>([])
+const searchKey = ref('')
+const codeText = ref('')
+const dialogVisible = ref(false)
+const classDetail = ref()
+const isLoading = ref(true)
let pages = reactive({
currentPage: 1,
@@ -146,97 +131,97 @@
pageSize: 6,
count: 0,
loading: false,
-});
+})
onMounted(() => {
- getCurrentClassList();
-});
+ getCurrentClassList()
+})
// 鍒嗛〉
const handleSizeChange = (val: number) => {
- pages.pageSize = val;
- getCurrentClassList();
-};
+ pages.pageSize = val
+ getCurrentClassList()
+}
const handleCurrentChange = (val: number) => {
- pages.page = val;
- pages.currentPage = val;
- getCurrentClassList();
-};
+ pages.page = val
+ pages.currentPage = val
+ getCurrentClassList()
+}
const handleClick = (val: any) => {
- activeName.value = val;
-};
+ activeName.value = val
+}
const openJoin = () => {
- dialogVisible.value = true;
- classDetail.value = null;
- codeText.value = "";
-};
+ dialogVisible.value = true
+ classDetail.value = null
+ codeText.value = ''
+}
// 鎼滅储
const searchList = () => {
- pages.page = 1;
- pages.currentPage = 1;
- getCurrentClassList();
-};
+ pages.page = 1
+ pages.currentPage = 1
+ getCurrentClassList()
+}
// 澶嶅埗
const copy = async (text: string) => {
try {
- await toClipboard(text);
+ await toClipboard(text)
ElMessage({
- message: "澶嶅埗鎴愬姛",
- type: "success",
- });
+ message: '澶嶅埗鎴愬姛',
+ type: 'success',
+ })
} catch (e) {
- console.error(e);
+ console.error(e)
}
-};
+}
// 鍔犲叆鐝骇
const joinClass = () => {
if (!codeText.value) {
ElMessage({
- message: "鏃犳晥鐨勯個璇风爜",
- type: "error",
- });
- return false;
+ message: '鏃犳晥鐨勯個璇风爜',
+ type: 'error',
+ })
+ return false
}
- const data = { refCode: codeText.value };
+ const data = { refCode: codeText.value }
MG.identity.joinGroupByRefCode(data).then((res: any) => {
- if (res == "缁勪笉瀛樺湪") {
+ if (res == '缁勪笉瀛樺湪') {
ElMessage({
- message: "鏃犳晥鐨勭彮绾�",
- type: "error",
- });
+ message: '鏃犳晥鐨勭彮绾�',
+ type: 'error',
+ })
}
- if (res == "缁勬垚鍛樻暟閲忓凡鏈�澶�,涓嶈兘鍔犲叆") {
+ if (res == '缁勬垚鍛樻暟閲忓凡鏈�澶�,涓嶈兘鍔犲叆') {
ElMessage({
- message: "鐝骇鎴愬憳鏁伴噺宸叉渶澶э紝涓嶈兘鍔犲叆",
- type: "error",
- });
+ message: '鐝骇鎴愬憳鏁伴噺宸叉渶澶э紝涓嶈兘鍔犲叆',
+ type: 'error',
+ })
}
- if (res == "宸茬粡鐢宠杩囧姞鍏ユ缁�") {
+ if (res == '宸茬粡鐢宠杩囧姞鍏ユ缁�') {
ElMessage({
- message: "宸茬粡鐢宠杩囧姞鍏ユ鐝骇",
- type: "error",
- });
+ message: '宸茬粡鐢宠杩囧姞鍏ユ鐝骇',
+ type: 'error',
+ })
}
- dialogVisible.value = false;
- getCurrentClassList();
- });
-};
+ dialogVisible.value = false
+ getCurrentClassList()
+ })
+}
// 鑾峰彇褰撳墠鐝骇鍒楄〃
const getCurrentClassList = () => {
- isLoading.value = true;
+ isLoading.value = true
const data = {
start: (pages.page - 1) * pages.pageSize,
size: pages.pageSize,
sort: {
- type: "Desc",
- field: "CreateDate",
+ type: 'Desc',
+ field: 'CreateDate',
subSorts: [],
},
filterList: [],
@@ -244,48 +229,48 @@
? [
{
keywords: searchKey.value,
- field: "Name",
- compareType: "Contains",
+ field: 'Name',
+ compareType: 'Contains',
},
]
: [],
- };
+ }
MG.identity.joinedGroupByList(data).then((res: any) => {
- isLoading.value = false;
- pages.count = res.totalSize;
+ isLoading.value = false
+ pages.count = res.totalSize
if (res.datas) {
calssList.value = res.datas.map((item: any) => {
return {
...item,
classTime:
- moment(item.beginDate).format("YYYY.MM.DD") +
- "--" +
- moment(item.endDate).format("YYYY.MM.DD"),
+ moment(item.beginDate).format('YYYY.MM.DD') +
+ '--' +
+ moment(item.endDate).format('YYYY.MM.DD'),
bookName: item.linkProductDto.product.name,
bookIcon: getPublicImage(item.linkProductDto.product.icon, 100),
- };
- });
+ }
+ })
}
- });
-};
+ })
+}
// 璺宠浆鐝骇绠＄悊
const goClassManage = async (item: any) => {
- if (item.userState == "WaitValid") {
+ if (item.userState == 'WaitValid') {
ElMessage({
- message: "姝ｅ湪瀹℃牳涓�....",
- type: "warning",
- });
- return false;
+ message: '姝ｅ湪瀹℃牳涓�....',
+ type: 'warning',
+ })
+ return false
}
- if (item.userState == "Reject") {
+ if (item.userState == 'Reject') {
ElMessage({
- message: "瀹℃牳鏈�氳繃",
- type: "warning",
- });
- return false;
+ message: '瀹℃牳鏈�氳繃',
+ type: 'warning',
+ })
+ return false
}
- const bookInfo = await getBookDetail(item.linkProductDto?.product);
+ const bookInfo = await getBookDetail(item.linkProductDto?.product)
let info = {
id: item.id,
name: item.name,
@@ -295,30 +280,29 @@
author: bookInfo.author,
isbn: bookInfo.isbn,
bookRefCode: bookInfo.refCode,
- };
+ }
let page = router.resolve({
- path: "/classManage",
+ path: '/classManage',
query: {
classInfo: JSON.stringify(info),
},
- });
- window.open(page.href, "_blank");
+ })
+ window.open(page.href, '_blank')
// router.push({
// path: '/classManage',
// query: {
// classInfo: JSON.stringify(info)
// }
// })
-};
+}
// 鑾峰彇鏁欐潗璇︽儏
const getBookDetail = async (item: any) => {
- const path = item.refCode ? "digitalTextbooks" : config.goodsStore;
+ const path = item.refCode ? '*' : config.goodsStore
let query = {
path,
- queryType: "*",
+ queryType: '*',
productId: String(item.id),
- storeInfo: path,
coverSize: {
height: 300,
width: 210,
@@ -327,32 +311,32 @@
author: [],
isbn: [],
},
- };
- const res = await MG.store.getProductDetail(query);
- return res.datas ?? null;
-};
+ }
+ const res = await MG.store.getProductDetail(query)
+ return res.datas ?? null
+}
// 閫氳繃code鏌ヨ鐝骇
const getClassDetail = () => {
- if (codeText.value == "") {
+ if (codeText.value == '') {
ElMessage({
- message: "璇疯緭鍏ラ個璇风爜",
- type: "warning",
- });
- return false;
+ message: '璇疯緭鍏ラ個璇风爜',
+ type: 'warning',
+ })
+ return false
}
const data = {
classIdOrRefCode: codeText.value,
- };
+ }
MG.edu
.getCourseClass(data)
.then((res: any) => {
- classDetail.value = res;
+ classDetail.value = res
})
.catch((err: any) => {
- console.log(err);
- });
-};
+ console.log(err)
+ })
+}
</script>
<style lang="less" scoped>
@@ -382,7 +366,7 @@
overflow: hidden;
.courseItem {
float: left;
- width: 46%;
+ width: 45%;
margin: 0 2% 20px;
border-radius: 8px;
border: 1px solid #efefef;
@@ -393,6 +377,7 @@
padding: 0 20px;
// color: #fff;
background-color: #f8f8f8;
+ box-sizing: border-box;
.title {
font-weight: 600;
}
@@ -411,7 +396,7 @@
margin-top: 10px;
font-size: 12px;
background-color: #fff;
- color: #3b93fe;
+ color: #019e58;
padding: 0 6px;
border-radius: 50px;
overflow: hidden;
@@ -432,6 +417,7 @@
.infoBox {
flex: 1;
font-size: 12px;
+ padding: 10px 0;
p {
margin-bottom: 10px;
}
--
Gitblit v1.9.1