martial-admin-mini/pages/login/login.vue

<template>
  <view class="container">
    <!-- 自定义导航栏 -->
    <view class="nav-bar">
      <view class="nav-title">评分系统</view>
      <view class="nav-right">
        <view class="icon-menu">···</view>
        <view class="icon-close">⊗</view>
      </view>
    </view>

    <!-- 主体内容 -->
    <view class="content">
      <view class="page-title">进入评分</view>

      <!-- 比赛编码输入 -->
      <view class="input-group">
        <view class="input-label">比赛编码</view>
        <view class="input-wrapper">
          <input
            class="input-field"
            type="text"
            placeholder="请输入比赛编码"
            v-model="matchCode"
          />
        </view>
      </view>

      <!-- 评委邀请码输入 -->
      <view class="input-group">
        <view class="input-label">评委邀请码</view>
        <view class="input-wrapper">
          <input
            class="input-field"
            type="text"
            placeholder="请输入评委邀请码"
            v-model="inviteCode"
          />
        </view>
      </view>

      <!-- 立即评分按钮 -->
      <button class="submit-btn" @click="handleSubmit">立即评分</button>
    </view>
  </view>
</template>

<script>
import dataAdapter from '@/utils/dataAdapter.js'
import config from '@/config/env.config.js'

export default {
  data() {
    return {
      matchCode: '',
      inviteCode: ''
    }
  },
  onLoad() {
    // 开发环境显示当前数据模式
    if (config.debug) {
      console.log('='.repeat(50))
      console.log('当前数据模式:', config.dataMode)
      console.log('Mock模式:', dataAdapter.isMockMode() ? '是' : '否')
      console.log('API模式:', dataAdapter.isApiMode() ? '是' : '否')
      console.log('='.repeat(50))
    }
  },
  methods: {
    async handleSubmit() {
      // 表单验证
      if (!this.matchCode) {
        uni.showToast({
          title: '请输入比赛编码',
          icon: 'none'
        })
        return
      }
      if (!this.inviteCode) {
        uni.showToast({
          title: '请输入评委邀请码',
          icon: 'none'
        })
        return
      }

      try {
        // 显示加载
        uni.showLoading({
          title: '登录中...',
          mask: true
        })

        // 🔥 关键改动：使用 dataAdapter 进行登录
        // Mock模式：调用 mock/login.js 的 login 函数
        // API模式：调用 api/auth.js 的 login 函数（POST /api/mini/login）
        const response = await dataAdapter.getData('login', {
          matchCode: this.matchCode,
          inviteCode: this.inviteCode
        })

        uni.hideLoading()

        // 处理登录响应（Mock和API返回格式相同）
        const {
          token,
          userRole,
          matchId,
          matchName,
          matchTime,
          judgeId,
          judgeName,
          venueId,
          venueName,
          projects
        } = response.data

        // 保存Token到本地存储
        uni.setStorageSync('token', token)

        // 保存用户信息到全局数据
        getApp().globalData = {
          userRole,           // 'pub' 或 'admin'
          matchCode: this.matchCode,
          matchId,
          matchName,
          matchTime,
          judgeId,
          judgeName,
          venueId,            // 普通评委有场地，裁判长为null
          venueName,
          projects,           // 分配的项目列表
          currentProjectIndex: 0  // 当前选中的项目索引
        }

        // 调试信息
        if (config.debug) {
          console.log('登录成功:', {
            userRole,
            judgeName,
            venueId: venueId || '全部场地',
            projects: projects.length + '个项目'
          })
        }

        // 显示登录成功提示
        uni.showToast({
          title: '登录成功',
          icon: 'success',
          duration: 1500
        })

        // 根据角色跳转到不同页面
        setTimeout(() => {
          if (userRole === 'admin') {
            // 裁判长跳转到多场地列表页（可以修改评分）
            uni.navigateTo({
              url: '/pages/score-list-multi/score-list-multi'
            })
          } else {
            // 普通裁判跳转到评分列表页（可以评分）
            uni.navigateTo({
              url: '/pages/score-list/score-list'
            })
          }
        }, 1500)

      } catch (error) {
        uni.hideLoading()

        // 错误处理
        console.error('登录失败:', error)

        uni.showToast({
          title: error.message || '登录失败，请重试',
          icon: 'none',
          duration: 2000
        })
      }
    }
  }
}
</script>

<style scoped>
.container {
  min-height: 100vh;
  background-color: #F5F5F5;
}

/* 导航栏 */
.nav-bar {
  height: 90rpx;
  background: linear-gradient(135deg, #1B7C5E 0%, #2A9D7E 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 0 30rpx;
}

.nav-title {
  font-size: 36rpx;
  font-weight: 600;
  color: #FFFFFF;
  letter-spacing: 2rpx;
}

.nav-right {
  position: absolute;
  right: 30rpx;
  display: flex;
  align-items: center;
  gap: 30rpx;
}

.icon-menu,
.icon-close {
  width: 60rpx;
  height: 60rpx;
  background-color: rgba(255, 255, 255, 0.25);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32rpx;
  color: #FFFFFF;
  font-weight: bold;
}

/* 主体内容 */
.content {
  padding: 60rpx 40rpx;
}

.page-title {
  font-size: 40rpx;
  font-weight: 600;
  color: #333333;
  margin-bottom: 60rpx;
  text-align: center;
}

/* 输入组 */
.input-group {
  margin-bottom: 40rpx;
}

.input-label {
  font-size: 32rpx;
  font-weight: 500;
  color: #333333;
  margin-bottom: 20rpx;
}

.input-wrapper {
  background-color: #FFFFFF;
  border-radius: 16rpx;
  padding: 30rpx;
  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
  position: relative;
}

.input-field {
  width: 100%;
  font-size: 28rpx;
  color: #333333;
  border: none;
}

.input-field::placeholder {
  color: #CCCCCC;
}

.input-tip {
  position: absolute;
  right: 30rpx;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24rpx;
  color: #FF4D6A;
}

/* 提交按钮 */
.submit-btn {
  width: 100%;
  height: 90rpx;
  background: linear-gradient(135deg, #1B7C5E 0%, #2A9D7E 100%);
  border-radius: 16rpx;
  font-size: 32rpx;
  font-weight: 600;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 80rpx;
  box-shadow: 0 8rpx 20rpx rgba(27, 124, 94, 0.3);
}

.submit-btn:active {
  opacity: 0.9;
}
</style>