v1.0

package.json

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

src/pages/shangke/shangke.vue

@@ -4,43 +4,86 @@
     <h3 >
       上课
     </h3>
+    <view v-if="kctivityAndPPT.length > 0">
+      <H4>课堂活动与 PPT 列表</H4>
+      <ul >
+        <li v-for="item in kctivityAndPPT" :key="item.id">
+          展示：{{ item.name }}
+          <view v-if="item.lx=='ppt'">
+            <image
+              :src="item.src"
+              mode="aspectFit"
+            />
+          </view>
+          <view v-else-if="item.lx=='activity'">
+
+          </view>
+        </li>
+      </ul>
+    </view>
+    <view v-else>
+      <p>暂无课堂活动或 PPT 数据</p>
+    </view>
   </view>
 </template>
-<script setup>
-// 脚本逻辑
 
-</script>
-<script >
+
+<script setup>
+import { onMounted, onUnmounted } from 'vue'
 import io from '@hyoga/uni-socket.io'
-export default {
-  onLoad(options) {
-    // 初始化连接
+import { ref } from 'vue'
+
+// 课堂活动and PPT
+const kctivityAndPPT = ref([
+  {lx:'ppt',id:1,name:'PPT展示1',src:'https://img11.360buyimg.com/n1/s720x720_jfs/t1/303510/33/1806/82651/6815a7a6F2e5d77b6/08d231a86927b0ce.jpg'},
+  {lx :'activity',id:2,name:'课堂活动1',src:'https://img11.360buyimg.com/n1/s720x720_jfs/t1/303510/33/1806/82651/6815a7a6F2e5d77b6/08d231a86927b0ce.jpg'}
+])
+
+
+
+// 定义 socket 变量
+let socket
+
+// 初始化连接
+onMounted((options) => {
   console.log(options)
-    this.socket = io('ws://localhost:3400', { transports: ['websocket'],auth:{
-        xuehao:"202413501062",
-        sf:"stu",
-        kch:options.kch,
-        kctime:options.kctime,
-        k_id:options.uuid,
-      } })
-    // 监听事件
+  socket = io('ws://localhost:3400', { 
+    transports: ['websocket'],
+    auth: {
+      xuehao: "202413501062",
+      sf: "stu",
+      kch: options.kch,
+      kctime: options.kctime,
+      k_id: options.uuid,
+    } 
+  })
 
-    this.socket.on('connect', () => console.log('Socket 已连接'))
-    this.socket.on('server', data => {
+  // 监听事件
+  socket.on('connect', () => console.log('Socket 已连接'))
+  socket.on('server', (data) => {
     console.log(data)
   })
-    this.socket.on('message', data => this.handleMessage(data))
-  },
-  onUnload() {
-    // 断开连接并移除监听
-    this.socket.off('message')
-    this.socket.disconnect()
-  },
-  methods: {
-    handleMessage(data) { /* 处理消息 */ },
-    sendData() {
-      this.socket.emit('chat', { text: 'Hello' })
+  socket.on('message', (data) => handleMessage(data))
+})
+
+// 断开连接并移除监听
+onUnmounted(() => {
+  if (socket) {
+    socket.off('message')
+    socket.disconnect()
   }
+})
+
+// 处理消息的方法
+const handleMessage = (data) => {
+  // 处理消息逻辑
+  console.log('处理消息:', data)
+}
+
+// 发送数据的方法
+const sendData = () => {
+  if (socket) {
+    socket.emit('chat', { text: 'Hello' })
   }
 }
 </script>