rollcall/Roll_Students/pages/AddClass/AddClass.wxml

<view class="container">

  <!-- 并绑定一个函数 -->
  <view class="class-card" bindtap="onCardTap">
    <image class="class-image" src="/assets/img/AddClass/img1_1.jpg" mode="aspectFill"/>
    <view class="class-info">
      <text class="class-name">人工智能</text>
      <view class="class-details">
        <text>班级人数：100</text>
        <text>创建日期：2024/10/1</text>
      </view>
    </view>
    <image class="arrow" src="/assets/img/AddClass/icon1_2.png" />
  </view>

  <view class="class-card" bindtap="onCardTap">
    <image class="class-image" src="/assets/img/AddClass/img1_2.jpg" mode="aspectFill"/>
    <view class="class-info">
      <text class="class-name">Linux实践</text>
      <view class="class-details">
        <text>班级人数：100</text>
        <text>创建日期：2024/10/1</text>
      </view>
    </view>
    <image class="arrow" src="/assets/img/AddClass/icon1_2.png" />
  </view>

  <view class="class-card" bindtap="onCardTap">
    <image class="class-image" src="/assets/img/AddClass/img1_3.jpg" mode="aspectFill"/>
    <view class="class-info">
      <text class="class-name">操作系统</text>
      <view class="class-details">
        <text>班级人数：100</text>
        <text>创建日期：2024/10/1</text>
      </view>
    </view>
    <image class="arrow" src="/assets/img/AddClass/icon1_2.png" />
  </view>

  <!-- 班级卡片列表 -->
  <block wx:for="{{cards}}" wx:key="index" bindtap="addScore">
    <view class="class-card" bindtap="onCardTap">
      <image class="class-image" src="/assets/img/AddClass/img1_4.jpg" mode="aspectFill" />
      <view class="class-info">
        <text class="class-name">{{item.name}}</text>
        <view class="class-details">
          <text>班级人数：{{item.studentCount}}</text>
          <text>创建日期：{{item.creationDate}}</text>
        </view>
      </view>
      <image class="arrow" src="/assets/img/AddClass/icon1_2.png" />
    </view>
  </block>

   <!-- 加号按钮，点击后显示浮窗 -->
  <button class="add-button" bindtap="onAddCard"  style="width: 100rpx">
    <image class="add-image" src="/assets/img/AddClass/icon1_1.png" mode="aspectFit" />
  </button> 

   <!-- 浮窗1 -->
   <view class="modal" hidden="{{!modalVisible1}}">
    <view class="modal-content">
      <text class="modal-title">请输入班级名称：</text>
      <input class="input-box" placeholder="班级名称" bindinput="onInput" value="{{className}}" />
      <view class="modal-buttons">
        <button class="confirm-button" bindtap="onConfirm1">确认</button>
        <button class="cancel-button" bindtap="onCancel1">取消</button>
      </view>
    </view>
  </view>

  <!-- 浮窗2 -->
  <view class="modal" hidden="{{!modalVisible2}}">
    <view class="modal-content">
      <text class="modal-title">导入 Excel 表：</text>
      <!-- 文件选择部分 -->
      <view class="file-selection">
        <view>
          <button class="select-file-button" bindtap="onSelectFile" style="width: 154rpx; display: block; box-sizing: border-box; left: 0rpx; top: 0rpx">选择文件</button>
        </view>
        <view>
          <text class="file-name" style="position: relative; left: 22rpx; top: 0rpx">{{fileName || '未选择任何文件'}}</text>
        </view>
      </view>
      <view class="divider"></view>
      <view class="modal-buttons">
        <button class="confirm-button" bindtap="onConfirm2">确认</button>
        <button class="cancel-button" bindtap="onCancel2">取消</button>
      </view>
    </view>
  </view>

   <!-- 浮窗3 -->
   <view class="modal" hidden="{{!modalVisible3}}">
    <view class="modal-content" style="padding:20rpx">
      <view class="modal-buttons">
        <button class="confirm-button" bindtap="onConfirm3">确认</button>
        <button class="cancel-button" bindtap="onCancel3">取消</button>
      </view>
    </view>
  </view>

  <!-- 浮窗4 -->
  <view class="modal" hidden="{{!modalVisible4}}"  bindtap="onCancel4">
    <view class="modal-content">
      <text class="modal-title">该课程名已存在！</text>
    </view>
  </view>

</view>