p975i2czf
/
universitymanage
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

chore: v3.0.0-4030620241128001

Browse Source
main
刘东阳 3 months ago
parent edf3b3d8ef
commit 491cf1edc3
2 changed files with 183 additions and 103 deletions
Show Stats Download Patch File Download Diff File

1
package.json
Unescape View File

@ -53,6 +53,7 @@
"@dcloudio/uni-ui": "^1.5.7", "@dcloudio/uni-ui": "^1.5.7",
"@hyoga/uni-socket.io": "^3.0.4", "@hyoga/uni-socket.io": "^3.0.4",
"dayjs": "^1.11.13", "dayjs": "^1.11.13",
"moment": "^2.30.1",
"pinia": "^3.0.2", "pinia": "^3.0.2",
"vue": "^3.4.21", "vue": "^3.4.21",
"vue-i18n": "^9.1.9", "vue-i18n": "^9.1.9",

285
src/pages/shangke/shangke.vue
Unescape View File

@ -8,115 +8,194 @@
<H4>课堂活动与 PPT 列表</H4> <H4>课堂活动与 PPT 列表</H4>
<ul > <ul >
<li v-for="item in kctivityAndPPT" :key="item.id"> <li v-for="item in kctivityAndPPT" :key="item.id">
展示：{{ item.name }} 展示：课程活动
<view v-if="item.lx=='ppt'"> <view v-if="item.lx=='ppt'">
<view class="content" >
<image <image
:src="item.src" :src="item.src"
mode="aspectFit" mode="aspectFit"
/> />
</view>
<view class="footer">
<text class="time">{{moment(item.time).fromNow()}}</text>
<text class="status">已完成</text>
</view>
</view> </view>
<view v-else-if="item.lx=='activity'"> <view v-else-if="item.lx=='activity'">
<view :style="{backgroundColor:item.color,width:'90vw',height:'70px'}"> <view class="activity-item" :style="{backgroundColor:item.color}">
<view :style="{fontSize:'30px'}"> <view class="content" :style="{backgroundColor:item.color}">
<text :style="{color:'white'}">{{item.showname}}</text> <view class="title">{{ item.showname }}</view>
</view> <view class="subtitle">{{ item.title }}</view>
<view :style="{fontSize:'15px'}">
<text :style="{color:'white'}">{{item.title}}</text>
</view>
</view> </view>
<image class="icon" src="/src/static/student-course/course-active.png" mode="aspectFit"></image>
</view>
<view class="footer">
<text class="time">{{moment(item.time).fromNow()}}</text>
<text class="status">已完成</text>
</view>
<!-- <view :style="{backgroundColor:item.color,width:'90vw',height:'70px'}">
<view :style="{fontSize:'30px'}">
<text :style="{color:'white'}">{{item.name}}</text>
</view>
<view :style="{fontSize:'15px'}">
<text :style="{color:'white'}">{{item.title}}</text>
</view>
</view> -->
</view>
<view v-else-if="item.lx=='notice'">
<view class="notice-view">
<text >1233</text>
</view>
</view> </view>
</li> </li>
</ul> </ul>
</view> </view>
<view v-else> <view v-else>
<p>暂无课堂活动或 PPT 数据</p> <p>暂无课堂活动或 PPT 数据</p>
</view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
import { onMounted, onUnmounted } from 'vue' import { onMounted, onUnmounted } from 'vue'
import moment from "moment/min/moment-with-locales";
import io from '@hyoga/uni-socket.io'
import { ref } from 'vue' import io from '@hyoga/uni-socket.io'
import {onLoad} from "@dcloudio/uni-app"; import { ref } from 'vue'
import {onLoad} from "@dcloudio/uni-app";
// 课堂活动and PPT
const kctivityAndPPT = ref([ // 课堂活动and PPT
{lx:'ppt',id:1,name:'PPT展示1',src:'https://img11.360buyimg.com/n1/s720x720_jfs/t1/303510/33/1806/82651/6815a7a6F2e5d77b6/08d231a86927b0ce.jpg'}, const kctivityAndPPT = ref([{id:0,lx:'notice'},
{lx :'activity',id:2,name:'课堂活动1',lxA:'讨论',color:'green',showname:'课程讨论',title:'历史为什么选择了中国共产党'} {lx:'ppt',id:1,name:'PPT展示1',src:'https://img11.360buyimg.com/n1/s720x720_jfs/t1/303510/33/1806/82651/6815a7a6F2e5d77b6/08d231a86927b0ce.jpg',time:'2025-05-06T19:54:43+08:00'},
]) {lx :'activity',id:2,name:'课堂活动1',lxA:'讨论',color:'green',showname:'课程讨论',title:'历史为什么选择了中国共产党',time:'2025-05-06T19:54:43+08:00'}
])
// 定义 socket 变量
let socket // 定义 socket 变量
let socket
// 初始化连接 moment.locale('zh-cn');
onLoad((options) => { // 初始化连接
console.log('load',options) onLoad((options) => {
console.log(kctivityAndPPT.value) console.log('load',options)
socket = null;
if(options) { console.log(kctivityAndPPT.value)
socket= io('ws://localhost:3400', { socket = null;
transports: ['websocket'], if(options) {
auth: { socket= io('ws://localhost:3400', {
xuehao: "202413501062", transports: ['websocket'],
sf: "stu", auth: {
kch: options.kch, xuehao: "202413501062",
kctime: options.kctime, sf: "stu",
k_id: options.uuid, kch: options.kch,
} kctime: options.kctime,
}) k_id: options.uuid,
}else { }
socket= io('ws://localhost:3400', { })
transports: ['websocket'], }else {
auth: { socket= io('ws://localhost:3400', {
xuehao: "202413501062", transports: ['websocket'],
sf: "stu", auth: {
kch: "nokch", xuehao: "202413501062",
kctime: "nokctime", sf: "stu",
k_id: "nouuid", kch: "nokch",
} kctime: "nokctime",
}) k_id: "nouuid",
} }
// 监听事件 })
socket.on('connect', () => console.log('Socket 已连接')) }
socket.on('server', (data) => { // 监听事件
console.log(data) socket.on('connect', () => console.log('Socket 已连接'))
}) socket.on('server', (data) => {
socket.on('message', (data) => handleMessage(data)) console.log(data)
}) })
socket.on('activeandppt', (data) => {
// 断开连接并移除监听 kctivityAndPPT.value.unshift(data)
onUnmounted(() => { })
if (socket) { socket.on('message', (data) => handleMessage(data))
socket.off('message') })
socket.disconnect()
} // 断开连接并移除监听
}) onUnmounted(() => {
if (socket) {
// 处理消息的方法 socket.off('message')
const handleMessage = (data) => { socket.disconnect()
// 处理消息逻辑 }
console.log('处理消息:', data) })
}
// 处理消息的方法
// 发送数据的方法 const handleMessage = (data) => {
const sendData = () => { // 处理消息逻辑
if (socket) { console.log('处理消息:', data)
socket.emit('chat', { text: 'Hello' }) }
}
} // 发送数据的方法
</script> const sendData = () => {
if (socket) {
<style scoped> socket.emit('chat', { text: 'Hello' })
.container { }
padding: 20rpx; }
} </script>
.classactivetitle{
font-size: 32rpx <style scoped>
; .container {
} padding: 20rpx;
</style> }
.classactivetitle {
font-size: 32rpx;
}
.activity-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px;
border: 1px solid #080808;
background-color: #c5c3c3;
width: 90vw;
}
.content{
flex: 1;
display: flex;
flex-direction: column;
background-color: #fff;
padding: 10px;
}
.icon {
width: 50px;
height: 50px;
}
.title {
font-size: 18px;
color: white;
}
.subtitle {
font-size: 14px;
color: white;
}
.footer {
display: flex;
justify-content: space-between;
margin-top: 10px;
}
.time {
font-size: 12px;
color: #666;
}
.status {
font-size: 12px;
color: #666;
}
.notice-view {
color:white;
display: flex;
background-color: #666;
align-items: center;
}
</style>

Write Preview
Loading…
Cancel
Save