口才和会议场景

pages/speaking_training_edu/speaking_training_edu.vue

@@ -0,0 +1,147 @@
+<template>
+  <view class="page">
+    <!-- 顶部导航栏 -->
+    <uni-nav-bar
+      :fixed="true"
+      :statusBar="true"
+      title="教务"
+      leftIcon=""
+      color="#333"
+      backgroundColor="#FFFFFF"
+    />
+
+    <view class="content">
+      <!-- 顶部 Tab -->
+      <view class="tabs">
+        <view
+          class="tab-item"
+          :class="{ active: activeTab === 'device' }"
+          @click="switchTab('device')"
+        >
+          <text>设备管理</text>
+        </view>
+        <view
+          class="tab-item"
+          :class="{ active: activeTab === 'homework' }"
+          @click="switchTab('homework')"
+        >
+          <text>作业管理</text>
+        </view>
+      </view>
+
+      <!-- 设备管理 -->
+      <DeviceTab v-if="activeTab === 'device'" ref="deviceTab" />
+
+      <!-- 作业管理 -->
+      <HomeworkTab v-else />
+    </view>
+  </view>
+</template>
+
+<script>
+import DeviceTab from './components/DeviceTab.vue';
+import HomeworkTab from './components/HomeworkTab.vue';
+
+export default {
+  components: {
+    DeviceTab,
+    HomeworkTab,
+  },
+  onShow() {
+    // 非教务老师角色，禁止停留在教务页，自动跳回接待
+    try {
+      // 从登录成功时缓存的后端响应中读取角色名称
+      const roleName = uni.getStorageSync('backend-role-name') || '';
+      const hasEduRole = roleName === 'speaking_training_teacher';
+
+      if (!hasEduRole) {
+        uni.showToast({
+          title: '当前账号无教务权限',
+          icon: 'none',
+          duration: 1500,
+        });
+        setTimeout(() => {
+          uni.switchTab({
+            url: '/pages/reception/reception',
+          });
+        }, 800);
+      }
+    } catch (e) {
+      console.warn('检查教务权限失败:', e);
+    }
+  },
+  data() {
+    return {
+      activeTab: 'device', // device | homework
+    };
+  },
+  onReachBottom() {
+    // 页面触底时，如果当前在设备管理 Tab，则触发子组件加载更多
+    if (this.activeTab === 'device' && this.$refs.deviceTab && this.$refs.deviceTab.loadMore) {
+      this.$refs.deviceTab.loadMore();
+    }
+  },
+  methods: {
+    switchTab(tab) {
+      this.activeTab = tab;
+    },
+  },
+};
+</script>
+
+<style>
+.page {
+  min-height: 100vh;
+  background-color: #f5f5f5;
+}
+
+.content {
+  padding-top: 88rpx;
+}
+
+.tabs {
+  position: fixed;
+  top: 88rpx;
+  left: 0;
+  right: 0;
+  display: flex;
+  background-color: #ffffff;
+  border-bottom: 1px solid #e0e0e0;
+  z-index: 10;
+}
+
+.tab-item {
+  flex: 1;
+  padding: 24rpx 0;
+  text-align: center;
+  position: relative;
+}
+
+.tab-item text {
+  font-size: 30rpx;
+  color: #666;
+}
+
+.tab-item.active text {
+  color: #333;
+  font-weight: 500;
+}
+
+.tab-item.active::after {
+  content: '';
+  position: absolute;
+  bottom: 0;
+  left: 25%;
+  right: 25%;
+  height: 4rpx;
+  border-radius: 2rpx;
+  background-color: #007aff;
+}
+
+.tab-content {
+  padding: 148rpx 32rpx 32rpx;
+  box-sizing: border-box;
+}
+</style>
+
+