<!-- 课件管理页面 -->
<template>
  <div class="courseManage">
    <div class="headerf">
      <!-- 搜索框及按钮 -->
      <div class="filter">
        <div class="filterItems">
          <div class="fi_input fitems">
            <a-input
              v-model:value="createName"
              style="width: 270px; height: 40px; border-radius: 8px"
              placeholder="请输入创建人"
            />
          </div>
          <div class="fi_input fitems">
            <a-input
              v-model:value="name"
              style="width: 270px; height: 40px; border-radius: 8px"
              placeholder="请输入名称"
            />
          </div>
          <div class="fi_input fitems">
            <a-input
              v-model:value="projectName"
              style="width: 270px; height: 40px; border-radius: 8px"
              placeholder="请输入所属项目"
            />
          </div>
          <div class="select fitems">
            <a-select
              v-model:value="auditStatus"
              dropdownClassName="dropdown-style"
              style="width: 200px"
              placeholder="请选择状态"
              :options="options1"
              allowClear
            >
            </a-select>
          </div>
          <div class="select fitems">
            <a-select
              v-model:value="categoryId"
              dropdownClassName="dropdown-style"
              style="width: 200px"
              placeholder="请选择内容分类"
              :options="options2"
              allowClear
              showSearch
            ></a-select>
          </div>
          <div class="select fitems">
            <a-range-picker
              v-model:value="projectTime"
              :show-time="{
                defaultValue: [
                  moment('00:00:00', 'HH:mm:ss'),
                  moment('23:59:59', 'HH:mm:ss'),
                ],
              }"
              valueFormat="X"
              separator="至"
              :placeholder="['        开始时间', '        结束时间']"
            />
          </div>
        </div>
      </div>
      <div class="btns">
        <div class="btn btn1" @click="handleSearch1">
          <div class="search"></div>
          <div class="btnText">搜索</div>
        </div>
        <div class="btn btn2" @click="handleRest1">
          <div class="search"></div>
          <div class="btnText">重置</div>
        </div>
        <!-- 2022-11-30注释 后面放开 -->
        <!-- <div class="btn btn3" @click="openMessage">
          <div class="search"></div>
          <div class="btnText">导出</div>
        </div> -->
        <div class="btn btn4" @click="of_hShow">
          <div class="search"></div>
          <div class="btnText">新建课程</div>
        </div>
      </div>
      <!-- 搜索框及按钮 -->
    </div>
    <!-- 选择线上还是面授课弹窗 -->
    <a-modal
      v-model:visible="of_hs"
      :closable="closableQR"
      wrapClassName="sofModal"
      :footer="null"
      style="margin-top: 400px"
      @cancel="of_exit"
    >
      <div
        class="selectonlineface"
        :style="{ display: of_hs ? 'block' : 'none' }"
      >
        <div class="of_header"></div>
        <div class="of_main">
          <div class="ofm_header">
            <div class="add_icon"></div>
            <span>请选择课程类型</span>
            <div class="close_exit" @click="of_exit"></div>
          </div>
          <div class="ofm_body">
            <div class="ofmb_items">
              <div class="signbox">
                <div class="sign">
                  <img
                    src="@/assets/images/coursewareManage/asterisk.png"
                    alt=""
                  />
                </div>
                <span style="margin-right: 3px">课程名称：</span>
              </div>
              <div class="b_input">
                <a-input
                  v-model:value="xzinputV1"
                  maxlength="20"
                  style="width: 440px; height: 40px; border-radius: 8px"
                  placeholder="请输入课程名称"
                />
                <div class="inp_num">
                  <span style="color: #c7cbd2">{{ xzinputV1.length }}/20</span>
                </div>
              </div>
            </div>
            <div class="b_sub">
              <div class="bs_header">
                <div class="b_left">
                  <span style="color: #999ba3">课程命名规则</span>
                </div>
                <div class="b_right" @click="hideShow" style="cursor: pointer">
                  <div
                    class="b_zk"
                    :style="{ display: hideshow ? 'block' : 'none' }"
                  >
                    <div class="zksqbox" style="display: flex">
                      <span style="color: #4ea6ff; margin-right: 5px">
                        收起
                      </span>
                      <div class="b_icon">
                        <img
                          src="@/assets/images/coursewareManage/up.png"
                          alt=""
                        />
                      </div>
                    </div>
                  </div>
                  <div
                    class="b_sq"
                    :style="{ display: hideshow ? 'none' : 'block' }"
                  >
                    <div class="zksqbox" style="display: flex">
                      <span style="color: #4ea6ff; margin-right: 5px">
                        展开
                      </span>
                      <div class="b_icon">
                        <img
                          src="@/assets/images/coursewareManage/down.png"
                          alt=""
                        />
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div
                class="bl_detail"
                :style="{ display: hideshow ? 'block' : 'none' }"
              >
                <span style="color: #999ba3">
                  1、课程名称统一不加书名号。<br />
                  2、项目名称、属地等信息如需体现在课程名称中，请放在课程名称信息
                  之后，如“时间管理（GROW180项目）”或“时间管理（B*）”确保首先
                  看到的是课程内容主题。<br />
                  3、同一课程如先后有多个版本，原则上仅开放最新版本，旧版本应停用
                  版本如必须以年份标明，请以“沟通技巧（2022年）”的方式呈现。
                </span>
              </div>
            </div>
            <div class="ofmb_items">
              <div class="signbox">
                <div class="sign">
                  <img
                    src="@/assets/images/coursewareManage/asterisk.png"
                    alt=""
                  />
                </div>
                <span>授课形式</span>
              </div>
              <a-radio-group v-model:value="valueE1">
                <div class="bc_box">
                  <div class="bc_boxl">
                    <div class="ol_checkbox">
                      <a-radio
                        v-model:checked="checked"
                        :value="1"
                        @click="bs_hShow"
                      >
                        线上
                      </a-radio>
                    </div>
                  </div>
                  <div class="bc_boxr">
                    <div class="ol_checkbox">
                      <a-radio
                        v-model:checked="checked"
                        :value="2"
                        @click="clear_valueE1"
                      >
                        面授
                      </a-radio>
                    </div>
                  </div>
                </div>
              </a-radio-group>
            </div>
            <div class="b_sup" :style="{ display: bs_hs ? 'block' : 'none' }">
              <div class="ofmb_items">
                <div class="signbox">
                  <div class="sign">
                    <img
                      src="@/assets/images/coursewareManage/asterisk.png"
                      alt=""
                    />
                  </div>
                  <span>是否设置目录</span>
                </div>
                <a-radio-group v-model:value="valueE2">
                  <div class="bc_box">
                    <div class="ol_checkbox">
                      <a-radio
                        v-model:checked="checked"
                        :value="3"
                        @click="clear_valueE2"
                      >
                        是
                      </a-radio>
                    </div>
                    <div class="ol_checkbox">
                      <a-radio
                        v-model:checked="checked"
                        :value="4"
                        @click="clear_valueE2"
                      >
                        否
                      </a-radio>
                    </div>
                  </div>
                </a-radio-group>
              </div>
            </div>
            <div class="b_footer">
              <div class="btn btn5" @click="of_exit1">
                <div class="btnText">取消</div>
              </div>
              <div class="btn btn6" @click="createft">
                <div class="btnText">确定</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!-- 选择线上还是面授课弹窗 -->
    <!-- 确定新建面授课弹窗 -->
    <a-modal
      v-model:visible="ft_hs"
      title="Title"
      @ok="handlePush"
      :footer="null"
      :closable="false"
      wrapClassName="modalStyle facteachModal"
      width="80%"
      @cancel="ft_exit_1"
    >
      <div class="modalHeader">
        <div class="headerLeft">
          <img
            style="width: 17px; height: 18px; margin-right: 8px"
            src="../../assets/images/basicinfo/add.png"
          />
          <span v-if="ft_eidt" class="headerLeftText">编辑面授课</span>
          <span v-else class="headerLeftText">新建面授课</span>
        </div>
        <div style="margin-right: 57px; cursor: pointer">
          <img
            @click="ft_exit_1"
            style="width: 22px; height: 22px"
            src="../../assets/images/basicinfo/close22.png"
          />
        </div>
      </div>
      <div class="modalMain">
        <!-- 审核理由 -->
        <div v-if="statusJuJue" class="statusJuJue">
          <span>审核意见：</span>
          <span>-</span>
        </div>
        <div class="faceteach" :style="{ display: ft_hs ? 'block' : 'none' }">
          <div class="ft_main">
            <div class="m_title">课程信息</div>
            <div class="m_body">
              <div class="mb_left">
                <div class="mbl_items">
                  <div class="item_nam">
                    <div class="asterisk_icon">
                      <img
                        src="@/assets/images/coursewareManage/asterisk.png"
                        alt=""
                      />
                    </div>
                    <span style="margin-right: 14px">课程名称</span>
                  </div>
                  <div class="item_inp">
                    <div class="i1_input">
                      <a-input
                        v-model:value="qdms_inputV1"
                        maxlength="90"
                        style="width: 440px; height: 40px; border-radius: 8px"
                        placeholder="请输入课程名称"
                      />
                      <div class="inp_num">
                        <span style="color: #c7cbd2">
                          {{ qdms_inputV1.length }}/90
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="i2_cz">
                  <div class="i2_top">
                    <div class="i2_left">
                      <span style="color: #999ba3">课程命名规则</span>
                    </div>
                    <div
                      class="i2_right"
                      @click="hideShow"
                      style="cursor: pointer"
                    >
                      <div
                        class="b_zk"
                        :style="{ display: hideshow ? 'block' : 'none' }"
                      >
                        <span style="color: #4ea6ff">收起</span>
                      </div>
                      <div
                        class="b_sq"
                        :style="{ display: hideshow ? 'none' : 'block' }"
                      >
                        <span style="color: #4ea6ff">展开</span>
                      </div>
                      <div class="b_icon"></div>
                    </div>
                  </div>
                  <div
                    class="i2_detail"
                    :style="{ display: hideshow ? 'block' : 'none' }"
                  >
                    <span style="color: #999ba3">
                      1、课程名称统一不加书名号。<br />
                      2、项目名称、属地等信息如需体现在课程名称中，请放在课程名称信息
                      之后，如“时间管理（GROW180项目）”或“时间管理（B*）”确保首先
                      看到的是课程内容主题。<br />
                      3、同一课程如先后有多个版本，原则上仅开放最新版本，旧版本应停用
                      版本如必须以年份标明，请以“沟通技巧（2022年）”的方式呈现。
                    </span>
                  </div>
                </div>
                <div class="mbl_items2">
                  <div class="item_nam">
                    <div class="asterisk_icon">
                      <img
                        src="@/assets/images/coursewareManage/asterisk.png"
                        alt=""
                      />
                    </div>
                    <span style="margin-right: 14px">封面图</span>
                  </div>
                  <div class="item_inp">
                    <a-select
                      :getPopupContainer="
                        (triggerNode) => {
                          return triggerNode.parentNode || document.body;
                        }
                      "
                      v-model:value="feng_mian_1"
                      dropdownClassName="dropdown-style"
                      style="width: 440px"
                      placeholder="请选择"
                      :options="optionsUrl"
                      allowClear
                      showSearch
                    ></a-select>
                    <img
                      class="i_upload_img"
                      v-if="feng_mian_1"
                      :src="feng_mian_1"
                      alt="avatar"
                    />
                    <!-- <a-upload
                      name="avatar"
                      list-type="picture-card"
                      class="avatar-uploader"
                      :show-upload-list="false"
                      :before-upload="beforeUpload"
                      disabled
                    >
                      <img
                        class="i_upload_img"
                        v-if="imageUrl"
                        :src="imageUrl"
                        alt="avatar"
                      />
                      <div class="i_upload" v-else>
                        <div class="addimg">
                          <div class="heng"></div>
                          <div class="shu"></div>
                        </div>
                      </div>
                    </a-upload> -->
                    <div class="i_bottom">
                      <span style="color: #999ba3">
                        高宽比为16:9 (如:800*450) png或jpg图片
                      </span>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <div class="asterisk_icon">
                      <img
                        style="width: 10px; height: 10px"
                        src="@/assets/images/coursewareManage/asterisk.png"
                        alt=""
                      />
                    </div>
                    <span style="margin-right: 14px">目标人群</span>
                  </div>
                  <div class="item_inp">
                    <div class="i1_input">
                      <a-input
                        v-model:value="qdms_inputV2"
                        maxlength="50"
                        style="width: 440px; height: 40px; border-radius: 8px"
                        placeholder="请输入目标人群"
                      />
                      <div class="inp_num">
                        <span style="color: #c7cbd2">
                          {{ qdms_inputV2.length }}/50
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <span style="margin-right: 14px">课程价值</span>
                  </div>
                  <div class="item_inp">
                    <div class="i1_input">
                      <a-input
                        v-model:value="qdms_inputV3"
                        maxlength="200"
                        style="width: 440px; height: 40px; border-radius: 8px"
                        placeholder="请输入课程价值"
                      />
                      <div class="inp_num">
                        <span style="color: #c7cbd2">
                          {{ qdms_inputV3.length }}/200
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <div class="asterisk_icon">
                      <img
                        src="@/assets/images/coursewareManage/asterisk.png"
                        alt=""
                      />
                    </div>
                    <span style="margin-right: 14px">内容分类</span>
                  </div>
                  <div class="item_inp">
                    <div class="select i6_input">
                      <a-select
                        :getPopupContainer="
                          (triggerNode) => {
                            return triggerNode.parentNode || document.body;
                          }
                        "
                        v-model:value="fen_lei"
                        dropdownClassName="dropdown-style"
                        style="width: 440px"
                        placeholder="请选择"
                        :options="options2"
                        allowClear
                        showSearch
                      ></a-select>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <span style="margin-right: 14px">场景</span>
                  </div>
                  <div class="item_inp">
                    <div class="select i7_input">
                      <a-select
                        :getPopupContainer="
                          (triggerNode) => {
                            return triggerNode.parentNode || document.body;
                          }
                        "
                        v-model:value="chang_jin"
                        dropdownClassName="dropdown-style"
                        style="width: 440px"
                        placeholder="请选择"
                        :options="options3"
                        allowClear
                        showSearch
                      ></a-select>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <span style="margin-right: 14px">内容标签</span>
                  </div>
                  <div class="item_inp">
                    <!-- <a-select
                      :getPopupContainer="
                        (triggerNode) => {
                          return triggerNode.parentNode || document.body;
                        }
                      "
                      v-model:value="tags_val"
                      mode="tags"
                      style="width: 440px; height: 40px"
                      placeholder="请输入按回车键创建成功"
                      :options="tagsOptions"
                    ></a-select> -->
                    <a-input
                      v-model:value="tags_val_single"
                      placeholder="请输入按回车键创建成功"
                      @pressEnter="handleTagChange"
                    />
                    <div class="tag-content">
                      <a-tag
                        v-for="(item, index) in tags_val"
                        :key="index"
                        closable
                        @close="handleTagClose(index)"
                      >
                        {{ item }}
                      </a-tag>
                    </div>
                  </div>
                </div>
              </div>
              <div class="mb_right">
                <div class="mbl_items">
                  <div class="item_nam">
                    <div class="asterisk_icon">
                      <img
                        src="@/assets/images/coursewareManage/asterisk.png"
                        alt="asterisk"
                      />
                    </div>
                    <!-- 授课教师1 -->
                    <span style="margin-right: 14px">授课教师</span>
                  </div>
                  <div class="item_inp">
                    <div class="i1_input">
                      <ProjectManager
                        v-model:value="member.value"
                        v-model:name="member.name"
                      ></ProjectManager>
                    </div>
                  </div>
                </div>
                <div class="mbl_items2">
                  <div class="item_nam">
                    <span style="margin-right: 14px">课程简介</span>
                  </div>
                  <div class="item_inp">
                    <div class="i10_textarea">
                      <a-textarea
                        v-model:value="qdms_inputV6"
                        maxlength="150"
                        style="width: 440px; height: 100px; border-radius: 8px"
                        placeholder="请输入"
                      />
                      <div class="inp_num">
                        <span style="color: #c7cbd2">
                          {{ qdms_inputV6.length }}/150
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <span style="margin-right: 10px">附件</span>
                  </div>
                  <div class="item_inp">
                    <a-upload
                      multiple
                      :show-upload-list="false"
                      :before-upload="beforeUpload2"
                    >
                      <div class="accessory" style="cursor: pointer">
                        <div class="accessory_icon">
                          <img
                            src="@/assets/images/coursewareManage/enclosure.png"
                            alt="enclosure"
                          />
                        </div>
                        <span style="color: #4ea6ff">添加附件</span>
                      </div>
                    </a-upload>
                    <span>
                      支持.pdf,.ppt,.pptx,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png,.gif,.zip
                    </span>
                  </div>
                </div>
                <div class="mbl_items12">
                  <div
                    class="i12_box1"
                    v-for="(item, index) in imgList"
                    :key="index"
                  >
                    <div class="file_img"></div>
                    <div class="file_detail">
                      <!-- <div class="file_name">
                        <span style="color: #6f6f6f">{{ item.name }}</span>
                      </div> -->
                      <!-- 条件渲染 s -->
                      <!-- <div class="file_size">
                        <span style="color: #999ba3">{{ item.size }}</span>
                      </div> -->
                      <div class="file_updata">
                        <div class="updatabox">
                          <div class="updatacolor"></div>
                          <div class="updataxq">上传完成</div>
                          <!-- <div class="updatacolor2"></div>
                          <div class="updataxq2">上传失败</div> -->
                          <!-- <div class="updatacolor3"></div>
                          <div class="updataxq3">正在上传</div> -->
                        </div>
                        <div class="upjd">
                          <span style="margin: auto 5px">100%</span>
                        </div>
                      </div>
                      <!-- 条件渲染 e -->
                    </div>
                    <div class="file_operation">
                      <div class="fobox">
                        <span style="color: #4ea6ff" @click="handleDel(index)">
                          删除
                        </span>
                      </div>
                      <!-- <div class="fobox">
                        <span style="color: #4ea6ff">重传</span>
                      </div>
                      <div class="fobox">
                        <span style="color: #4ea6ff">取消</span>
                      </div> -->
                      <!-- <div class="fobox">
                        <span style="color: #4ea6ff; margin-right: 5px">
                          暂停
                        </span>
                      </div>
                      <div class="fobox">
                        <span style="color: #4ea6ff">取消</span>
                      </div> -->
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="m_footer">
              <div class="fotnam">
                <span>课程大纲</span>
              </div>
              <div class="fotarea">
                <div style="border: 1px solid #ccc">
                  <Toolbar
                    style="border-bottom: 1px solid #ccc"
                    :editor="editorRef"
                    :defaultConfig="toolbarConfig"
                    :mode="mode"
                  />
                  <Editor
                    style="height: 250px; overflow-y: hidden"
                    v-model="valueHtml"
                    :defaultConfig="editorConfig"
                    :mode="mode"
                    @onCreated="handleCreated"
                  />
                </div>
              </div>
            </div>
            <div class="m_btn">
              <div class="btn btn5" @click="ft_exit_1">
                <div class="btnText">取消</div>
              </div>
              <div class="btn btn6" @click="handlePush">
                <div class="btnText">保存</div>
              </div>

              <div
                class="btn btn6"
                v-if="statusTingQi == 1"
                @click="reviewClick"
              >
                <div class="btnText">提交审核</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!-- 查看面授课弹框 start -->
    <a-modal
      v-model:visible="lookMs"
      title="Title"
      @ok="handlelookMs"
      :footer="null"
      :closable="false"
      wrapClassName="modalStyle facteachModal"
      width="80%"
      @cancel="handlelookMs"
    >
      <div class="modalHeader">
        <div class="headerLeft">
          <img
            style="width: 17px; height: 18px; margin-right: 8px"
            src="../../assets/images/basicinfo/add.png"
          />
          <span class="headerLeftText">查看面授课</span>
        </div>
        <div style="margin-right: 57px; cursor: pointer">
          <img
            @click="handlelookMs"
            style="width: 22px; height: 22px"
            src="../../assets/images/basicinfo/close22.png"
          />
        </div>
      </div>
      <div class="modalMain">
        <div class="faceteach">
          <div class="ft_main">
            <div class="m_title">课程信息</div>
            <div class="m_body">
              <div class="mb_left">
                <div class="mbl_items">
                  <div class="item_nam">
                    <div class="asterisk_icon">
                      <img
                        src="@/assets/images/coursewareManage/asterisk.png"
                        alt=""
                      />
                    </div>
                    <span style="margin-right: 14px">课程名称</span>
                  </div>
                  <div class="item_inp">
                    <div class="i1_input">
                      <a-input
                        aria-readonly="true"
                        v-model:value="qdms_inputV1"
                        maxlength="90"
                        style="width: 440px; height: 40px; border-radius: 8px"
                        placeholder="请输入课程名称"
                      />
                      <div class="inp_num">
                        <span style="color: #c7cbd2">
                          {{ qdms_inputV1.length }}/90
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="i2_cz">
                  <div class="i2_top">
                    <div class="i2_left">
                      <span style="color: #999ba3">课程命名规则</span>
                    </div>
                    <div
                      class="i2_right"
                      @click="hideShow"
                      style="cursor: pointer"
                    >
                      <div
                        class="b_zk"
                        :style="{ display: hideshow ? 'block' : 'none' }"
                      >
                        <span style="color: #4ea6ff">收起</span>
                      </div>
                      <div
                        class="b_sq"
                        :style="{ display: hideshow ? 'none' : 'block' }"
                      >
                        <span style="color: #4ea6ff">展开</span>
                      </div>
                      <div class="b_icon"></div>
                    </div>
                  </div>
                  <div
                    class="i2_detail"
                    :style="{ display: hideshow ? 'block' : 'none' }"
                  >
                    <span style="color: #999ba3">
                      1、课程名称统一不加书名号。<br />
                      2、项目名称、属地等信息如需体现在课程名称中，请放在课程名称信息
                      之后，如“时间管理（GROW180项目）”或“时间管理（B*）”确保首先
                      看到的是课程内容主题。<br />
                      3、同一课程如先后有多个版本，原则上仅开放最新版本，旧版本应停用
                      版本如必须以年份标明，请以“沟通技巧（2022年）”的方式呈现。
                    </span>
                  </div>
                </div>
                <div class="mbl_items2">
                  <div class="item_nam">
                    <div class="asterisk_icon">
                      <img
                        src="@/assets/images/coursewareManage/asterisk.png"
                        alt=""
                      />
                    </div>
                    <span style="margin-right: 14px">封面图</span>
                  </div>
                  <div class="item_inp">
                    <a-select
                      :getPopupContainer="
                        (triggerNode) => {
                          return triggerNode.parentNode || document.body;
                        }
                      "
                      v-model:value="feng_mian_2"
                      dropdownClassName="dropdown-style"
                      style="width: 440px"
                      placeholder="请选择"
                      :options="optionsUrl"
                      allowClear
                      showSearch
                    ></a-select>
                    <img
                      class="i_upload_img"
                      v-if="feng_mian_2"
                      :src="feng_mian_2"
                      alt="avatar"
                    />
                    <!-- <a-upload
                      name="avatar"
                      list-type="picture-card"
                      class="avatar-uploader"
                      :show-upload-list="false"
                      :before-upload="beforeUpload"
                      disabled
                    >
                      <img
                        class="i_upload_img"
                        v-if="imageUrl"
                        :src="imageUrl"
                        alt="avatar"
                      />
                      <div class="i_upload" v-else>
                        <div class="addimg">
                          <div class="heng"></div>
                          <div class="shu"></div>
                        </div>
                      </div>
                    </a-upload> -->
                    <div class="i_bottom">
                      <span style="color: #999ba3">
                        高宽比为16:9 (如:800*450) png或jpg图片
                      </span>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <div class="asterisk_icon">
                      <img
                        style="width: 10px; height: 10px"
                        src="@/assets/images/coursewareManage/asterisk.png"
                        alt=""
                      />
                    </div>
                    <span style="margin-right: 14px">目标人群</span>
                  </div>
                  <div class="item_inp">
                    <div class="i1_input">
                      <a-input
                        v-model:value="qdms_inputV2"
                        maxlength="50"
                        style="width: 440px; height: 40px; border-radius: 8px"
                        placeholder="请输入目标人群"
                      />
                      <div class="inp_num">
                        <span style="color: #c7cbd2">
                          {{ qdms_inputV2.length }}/50
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <span style="margin-right: 14px">课程价值</span>
                  </div>
                  <div class="item_inp">
                    <div class="i1_input">
                      <a-input
                        v-model:value="qdms_inputV3"
                        maxlength="200"
                        style="width: 440px; height: 40px; border-radius: 8px"
                        placeholder="请输入课程价值"
                      />
                      <div class="inp_num">
                        <span style="color: #c7cbd2">
                          {{ qdms_inputV3.length }}/200
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <div class="asterisk_icon">
                      <img
                        src="@/assets/images/coursewareManage/asterisk.png"
                        alt=""
                      />
                    </div>
                    <span style="margin-right: 14px">内容分类</span>
                  </div>
                  <div class="item_inp">
                    <div class="select i6_input">
                      <a-select
                        :getPopupContainer="
                          (triggerNode) => {
                            return triggerNode.parentNode || document.body;
                          }
                        "
                        v-model:value="fen_lei"
                        dropdownClassName="dropdown-style"
                        style="width: 440px"
                        placeholder="请选择"
                        :options="options2"
                        allowClear
                        showSearch
                      ></a-select>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <span style="margin-right: 14px">场景</span>
                  </div>
                  <div class="item_inp">
                    <div class="select i7_input">
                      <a-select
                        :getPopupContainer="
                          (triggerNode) => {
                            return triggerNode.parentNode || document.body;
                          }
                        "
                        v-model:value="chang_jin"
                        dropdownClassName="dropdown-style"
                        style="width: 440px"
                        placeholder="请选择"
                        :options="options3"
                        allowClear
                        showSearch
                      ></a-select>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <span style="margin-right: 14px">内容标签</span>
                  </div>
                  <div class="item_inp">
                    <a-select
                      :getPopupContainer="
                        (triggerNode) => {
                          return triggerNode.parentNode || document.body;
                        }
                      "
                      v-model:value="tags_val"
                      mode="tags"
                      style="width: 440px; height: 40px"
                      placeholder="请输入按回车键创建成功"
                      :options="tagsOptions"
                    ></a-select>
                  </div>
                </div>
              </div>
              <div class="mb_right">
                <div class="mbl_items">
                  <div class="item_nam">
                    <div class="asterisk_icon">
                      <img
                        src="@/assets/images/coursewareManage/asterisk.png"
                        alt="asterisk"
                      />
                    </div>
                    <span style="margin-right: 14px">授课教师</span>
                  </div>
                  <div class="item_inp">
                    <div class="i1_input">
                      <ProjectManager
                        v-model:value="member.value"
                        v-model:name="member.name"
                      ></ProjectManager>
                    </div>
                  </div>
                </div>
                <div class="mbl_items2">
                  <div class="item_nam">
                    <span style="margin-right: 14px">课程简介</span>
                  </div>
                  <div class="item_inp">
                    <div class="i10_textarea">
                      <a-textarea
                        v-model:value="qdms_inputV6"
                        maxlength="150"
                        style="width: 440px; height: 100px; border-radius: 8px"
                        placeholder="请输入"
                      />
                      <div class="inp_num">
                        <span style="color: #c7cbd2">
                          {{ qdms_inputV6.length }}/150
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="mbl_items">
                  <div class="item_nam">
                    <span style="margin-right: 10px">附件</span>
                  </div>
                  <div class="item_inp">
                    <a-upload
                      multiple
                      :show-upload-list="false"
                      :before-upload="beforeUpload2"
                    >
                      <div class="accessory" style="cursor: pointer">
                        <div class="accessory_icon">
                          <img
                            src="@/assets/images/coursewareManage/enclosure.png"
                            alt="enclosure"
                          />
                        </div>
                        <span style="color: #4ea6ff">添加附件</span>
                      </div>
                    </a-upload>
                    <span>
                      支持.pdf,.ppt,.pptx,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png,.gif,.zip
                    </span>
                  </div>
                </div>
                <div class="mbl_items12">
                  <div
                    class="i12_box1"
                    v-for="(item, index) in imgList"
                    :key="index"
                  >
                    <div class="file_img"></div>
                    <div class="file_detail">
                      <!-- <div class="file_name">
                        <span style="color: #6f6f6f">{{ item.name }}</span>
                      </div> -->
                      <!-- 条件渲染 s -->
                      <!-- <div class="file_size">
                        <span style="color: #999ba3">{{ item.size }}</span>
                      </div> -->
                      <div class="file_updata">
                        <div class="updatabox">
                          <div class="updatacolor"></div>
                          <div class="updataxq">上传完成</div>
                          <!-- <div class="updatacolor2"></div>
                          <div class="updataxq2">上传失败</div> -->
                          <!-- <div class="updatacolor3"></div>
                          <div class="updataxq3">正在上传</div> -->
                        </div>
                        <div class="upjd">
                          <span style="margin: auto 5px">100%</span>
                        </div>
                      </div>
                      <!-- 条件渲染 e -->
                    </div>
                    <div class="file_operation">
                      <div class="fobox">
                        <span style="color: #4ea6ff" @click="handleDel(index)">
                          删除
                        </span>
                      </div>
                      <!-- <div class="fobox">
                        <span style="color: #4ea6ff">重传</span>
                      </div>
                      <div class="fobox">
                        <span style="color: #4ea6ff">取消</span>
                      </div> -->
                      <!-- <div class="fobox">
                        <span style="color: #4ea6ff; margin-right: 5px">
                          暂停
                        </span>
                      </div>
                      <div class="fobox">
                        <span style="color: #4ea6ff">取消</span>
                      </div> -->
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="m_footer">
              <div class="fotnam">
                <span>课程大纲</span>
              </div>
              <div class="fotarea">
                <div style="border: 1px solid #ccc">
                  <Toolbar
                    style="border-bottom: 1px solid #ccc"
                    :editor="editorRef"
                    :defaultConfig="toolbarConfig"
                    :mode="mode"
                  />
                  <Editor
                    style="height: 250px; overflow-y: hidden"
                    v-model="valueHtml"
                    :defaultConfig="editorConfig"
                    :mode="mode"
                    @onCreated="handleCreated"
                  />
                </div>
              </div>
            </div>
            <div class="m_btn">
              <!-- <div class="btn btn5" @click="handlelookMs">
                <div class="btnText">取消</div>
              </div>
              <div class="btn btn6" v-if="isEdit == 0" @click="handlelookMs">
                <div class="btnText">确定</div>
              </div> -->
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!-- 查看面授课弹框 end -->
    <!-- 确定新建面授课弹窗 -->
    <!-- 表格 -->
    <div class="tableBox">
      <a-table
        :columns="columns1"
        :data-source="tableData1"
        :loading="tableDataTotal1 === -1 ? true : false"
        :scroll="{ x: 600 }"
        expandRowByClick="true"
        @expand="expandTable"
        :pagination="false"
      >
        <template #bodyCell="{ record, column }">
          <template
            v-if="
              (String(record.status) === '0' || record.status === '未提交') &&
              column.key === 'operation'
            "
          >
            <span
              :class="[
                String(record.courseform) === '1'
                  ? 'disabled table-operation'
                  : 'table-operation',
              ]"
            >
              <a
                @click="
                  () => {
                    handleEdit(record, String(record.courseform));
                  }
                "
              >
                编辑
              </a>
              <a
                @click="
                  () => {
                    handleCopy(record, String(record.courseform));
                  }
                "
              >
                复制
              </a>
              <!-- 2022-12-10注释 后面放开 -->
              <!-- <a-dropdown>
                <template #overlay>
                  <a-menu>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showPrower(record);
                        }
                      "
                    >
                      权限名单
                    </a-menu-item>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showOwnPrower(record);
                        }
                      "
                    >
                      归属权
                    </a-menu-item>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showViewPrower(record);
                        }
                      "
                      >查看权</a-menu-item
                    >
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showManagePrower(record);
                        }
                      "
                      >管理权</a-menu-item
                    >
                  </a-menu>
                </template>
                <a>
                  授权
                  <down-outlined />
                </a>
              </a-dropdown> -->
              <a
                @click="
                  () => {
                    handleDelete(record, String(record.courseform));
                  }
                "
              >
                删除
              </a>
            </span>
          </template>
          <template
            v-if="
              (String(record.status) === '1' || record.status === '待审核') &&
              column.key === 'operation'
            "
          >
            <span
              :class="[
                String(record.courseform) === '1'
                  ? 'disabled table-operation'
                  : 'table-operation',
              ]"
            >
              <a
                @click="
                  () => {
                    handleRejectExit(record, String(record.courseform));
                  }
                "
              >
                撤回
              </a>
              <a
                @click="
                  () => {
                    handleCopy(record, String(record.courseform));
                  }
                "
              >
                复制
              </a>
              <!-- 2022-12-10注释 后面放开 -->
              <!-- <a-dropdown>
                <template #overlay>
                  <a-menu>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showPrower(record);
                        }
                      "
                    >
                      权限名单
                    </a-menu-item>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showOwnPrower(record);
                        }
                      "
                    >
                      归属权
                    </a-menu-item>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showViewPrower(record);
                        }
                      "
                      >查看权</a-menu-item
                    >
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showManagePrower(record);
                        }
                      "
                      >管理权</a-menu-item
                    >
                  </a-menu>
                </template>
                <a>
                  授权
                  <down-outlined />
                </a>
              </a-dropdown> -->
            </span>
          </template>
          <template
            v-if="
              (String(record.status) === '2' || record.status === '已审核') &&
              String(record.kkty) === '1' &&
              column.key === 'operation'
            "
          >
            <span
              :class="[
                String(record.courseform) === '1'
                  ? 'disabled table-operation'
                  : 'table-operation',
              ]"
            >
              <a
                @click="
                  () => {
                    handleStart(record, String(record.courseform));
                  }
                "
              >
                开课
              </a>
              <a
                @click="
                  () => {
                    handleLook(record, String(record.courseform));
                  }
                "
              >
                查看
              </a>
              <a
                @click="
                  () => {
                    if (String(record.courseform) === '1') {
                      return;
                    }
                    if (String(record.courseform) === ('1' || '线上')) {
                      om_1 = true;
                      ft_1 = false;
                    } else if (String(record.courseform) === ('2' || '面授')) {
                      om_1 = true;
                      ft_1 = true;
                    }
                    handleGuan22(record);
                  }
                "
              >
                管理
              </a>
              <a
                @click="
                  () => {
                    handleCopy(record, String(record.courseform));
                  }
                "
              >
                复制
              </a>
              <!-- 2022-12-10注释 后面放开 -->
              <!-- <a-dropdown>
                <template #overlay>
                  <a-menu>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showPrower(record);
                        }
                      "
                    >
                      权限名单
                    </a-menu-item>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showOwnPrower(record);
                        }
                      "
                    >
                      归属权
                    </a-menu-item>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showViewPrower(record);
                        }
                      "
                      >查看权</a-menu-item
                    >
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showManagePrower(record);
                        }
                      "
                      >管理权</a-menu-item
                    >
                  </a-menu>
                </template>
                <a>
                  授权
                  <down-outlined />
                </a>
              </a-dropdown> -->
              <span>
                <a
                  @click="
                    () => {
                      handleStop(record, String(record.courseform));
                    }
                  "
                >
                  停用
                </a>
              </span>
            </span>
          </template>
          <template
            v-if="
              (String(record.status) === '2' || record.status === '已审核') &&
              String(record.kkty) === '0' &&
              column.key === 'operation'
            "
          >
            <span
              :class="[
                String(record.courseform) === '1'
                  ? 'disabled table-operation'
                  : 'table-operation',
              ]"
            >
              <a
                @click="
                  () => {
                    handleStart(record, String(record.courseform));
                  }
                "
              >
                开课
              </a>
              <a
                @click="
                  () => {
                    handleEdit(record, String(record.courseform));
                  }
                "
              >
                编辑
              </a>
              <a
                @click="
                  () => {
                    if (String(record.courseform) === '1') {
                      return;
                    }
                    if (String(record.courseform) === ('1' || '线上')) {
                      om_1 = true;
                      ft_1 = false;
                    } else if (String(record.courseform) === ('2' || '面授')) {
                      om_1 = true;
                      ft_1 = true;
                    }
                    handleGuan22(record);
                  }
                "
              >
                管理
              </a>
              <a
                @click="
                  () => {
                    handleCopy(record, String(record.courseform));
                  }
                "
              >
                复制
              </a>
              <!-- 2022-12-10注释 后面放开 -->
              <!-- <a-dropdown>
                <template #overlay>
                  <a-menu>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showPrower(record);
                        }
                      "
                    >
                      权限名单
                    </a-menu-item>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showOwnPrower(record);
                        }
                      "
                    >
                      归属权
                    </a-menu-item>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showViewPrower(record);
                        }
                      "
                      >查看权</a-menu-item
                    >
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showManagePrower(record);
                        }
                      "
                      >管理权</a-menu-item
                    >
                  </a-menu>
                </template>
                <a>
                  授权
                  <down-outlined />
                </a>
              </a-dropdown> -->
              <a
                @click="
                  () => {
                    handleOpen(record, String(record.courseform));
                  }
                "
              >
                启用
              </a>
              <a
                @click="
                  () => {
                    handleDelete(record, String(record.courseform));
                  }
                "
              >
                删除
              </a>
            </span>
          </template>
          <template
            v-if="
              (String(record.status) === '-1' ||
                record.status === '审核未通过') &&
              column.key === 'operation'
            "
          >
            <span
              :class="[
                String(record.courseform) === '1'
                  ? 'disabled table-operation'
                  : 'table-operation',
              ]"
            >
              <a
                @click="
                  () => {
                    handleEdit(record, String(record.courseform));
                  }
                "
              >
                编辑
              </a>
              <a
                @click="
                  () => {
                    handleCopy(record, String(record.courseform));
                  }
                "
              >
                复制
              </a>
              <!-- 2022-12-10注释 后面放开 -->
              <!-- <a-dropdown>
                <template #overlay>
                  <a-menu>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showPrower(record);
                        }
                      "
                    >
                      权限名单
                    </a-menu-item>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showOwnPrower(record);
                        }
                      "
                    >
                      归属权
                    </a-menu-item>
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showViewPrower(record);
                        }
                      "
                      >查看权</a-menu-item
                    >
                    <a-menu-item
                      @click="
                        () => {
                          if (String(record.courseform) === '1') {
                            return;
                          }
                          showManagePrower(record);
                        }
                      "
                      >管理权</a-menu-item
                    >
                  </a-menu>
                </template>
                <a>
                  授权
                  <down-outlined />
                </a>
              </a-dropdown> -->
              <a
                @click="
                  () => {
                    handleDelete(record, String(record.courseform));
                  }
                "
              >
                删除
              </a>
            </span>
          </template>
        </template>
      </a-table>
    </div>
    <div class="pa">
      <a-pagination
        :showSizeChanger="false"
        showQuickJumper="true"
        hideOnSinglePage="true"
        :pageSize="pageSize1"
        :current="currentPage1"
        :total="tableDataTotal1"
        class="pagination"
        @change="handelChangePage1"
      />
    </div>
    <!-- 表格 -->
    <!-- 操作 在线面授课程管理 页面 -->
    <a-modal
      v-model:visible="om_1"
      title="Title"
      @ok="closeModal"
      :footer="null"
      :closable="false"
      wrapClassName="modalStyle onlmanageModal"
      width="80%"
    >
      <div class="modalHeader">
        <div class="headerLeft">
          <img
            style="width: 17px; height: 18px; margin-right: 8px"
            src="@/assets/images/coursewareManage/pc.png"
          />
          <div :style="{ display: ft_1 ? 'none' : 'block' }">
            <span class="headerLeftText">在线课程管理</span>
          </div>
          <div :style="{ display: ft_1 ? 'block' : 'none' }">
            <span class="headerLeftText">面授课程管理</span>
          </div>
        </div>
        <div style="margin-right: 57px; cursor: pointer">
          <img
            @click="om_exit"
            style="width: 22px; height: 22px"
            src="../../assets/images/basicinfo/close22.png"
          />
        </div>
      </div>
      <div class="modalMain">
        <div class="onlinemanage" :style="{ display: om_1 ? 'block' : 'none' }">
          <div class="om_main">
            <div class="om_body">
              <div class="b_title">课程：{{ newCourseName }}</div>
              <div class="b_sub">
                <div class="bs_type">类型：</div>
                <div class="bs_right">录播课</div>
                <div class="bs_left">内容分类：</div>
                <div class="bs_right">领导力</div>
                <div class="bs_left">状态：</div>
                <div class="bs_right">已审核</div>
              </div>
              <a-tabs
                class="b_menu"
                v-model:activeKey="faceManageTab"
                size="large"
                :tabBarStyle="{ marginLeft: '10px' }"
                @change="faceManageChange"
              >
                <!-- <a-tab-pane key="1" tab="报名管理">
                  <div class="b_menunav">
                    <div class="bm_select">
                      <a-select
                        class="select"
                        ref="select"
                        placeholder="请选择状态"
                        v-model:value="gl_selectV1"
                        style="width: 200px"
                        :options="options1"
                        allowClear
                        showSearch
                        @focus="focus"
                        @change="handleChange"
                      >
                       
                      </a-select>
                    </div>
                    <div class="bm_input">
                      <a-input
                        v-model:value="gl_inputv1"
                        style="width: 200px; height: 40px; border-radius: 8px"
                        placeholder="姓名"
                      />
                    </div>
                    <div class="bm_btn">
                      <div class="btn btn1" @click="handleSearchTable2">
                        <div class="search"></div>
                        <div class="btnText">搜索</div>
                      </div>
                    </div>
                  </div>
                  <div class="bm_table" style="margin-bottom: 20px">
                    <a-table
                      :columns="columns2"
                      :data-source="tableData2"
                      :loading="tableDataTotal22 === -1 ? true : false"
                      :pagination="false"
                    />
                    <div class="tableBox" style="margin-top: 50px">
                      <div class="pa">
                        <a-pagination
                          :showSizeChanger="false"
                          showQuickJumper="true"
                          hideOnSinglePage="true"
                          :pageSize="pageSize22"
                          :current="currentPage22"
                          :total="tableDataTotal22"
                          class="pagination"
                          @change="handelChangePage22"
                        />
                      </div>
                    </div>
                  </div>
                </a-tab-pane> -->
                <a-tab-pane key="1" tab="学习记录">
                  <div class="b_menunav">
                    <div class="bm_select">
                      <a-select
                        class="select"
                        ref="select"
                        placeholder="请选择状态"
                        v-model:value="gl_selectV2"
                        style="width: 200px"
                        :options="options1"
                        allowClear
                        @focus="focus"
                        @change="handleChange"
                      >
                        <!-- <a-select-option value="status">状态</a-select-option>
                        <a-select-option value="passed">已通过</a-select-option>
                        <a-select-option value="weishenhe">
                          未审核
                        </a-select-option>
                        <a-select-option value="reject">
                          管理员拒绝
                        </a-select-option> -->
                      </a-select>
                    </div>
                    <div class="bm_input">
                      <a-input
                        v-model:value="gl_inputV2"
                        style="width: 200px; height: 40px; border-radius: 8px"
                        placeholder="姓名"
                      />
                    </div>
                    <div class="bm_btn">
                      <div class="btn btn1" @click="handleSearchTable3">
                        <div class="search"></div>
                        <div class="btnText">搜索</div>
                      </div>
                    </div>
                  </div>
                  <div class="bm_table" style="margin-bottom: 20px">
                    <a-table
                      :columns="columns2"
                      :data-source="tableData3"
                      :loading="tableDataTotal222 === -1 ? true : false"
                      :pagination="false"
                    >
                      <template #bodyCell="{ column }">
                        <template v-if="column.key === 'opacation'">
                          <a @click="ckxq_hs">查看详情</a>
                        </template>
                      </template>
                    </a-table>
                    <div class="tableBox" style="margin-top: 50px">
                      <div class="pa">
                        <a-pagination
                          :showSizeChanger="false"
                          showQuickJumper="true"
                          hideOnSinglePage="true"
                          :pageSize="pageSize222"
                          :current="currentPage222"
                          :total="tableDataTotal222"
                          class="pagination"
                          @change="handelChangePage222"
                        />
                      </div>
                    </div>
                  </div>
                </a-tab-pane>
              </a-tabs>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!-- 操作 在线面授课程管理 页面 -->
    <!-- 面授课程管理查看详情 页面 -->
    <a-modal
      v-model:visible="om_ckxq"
      title="Title"
      @ok="closeModal"
      :footer="null"
      :closable="false"
      wrapClassName="modalStyle coursewareDetail"
      width="80%"
    >
      <div class="modalHeader">
        <div class="headerLeft">
          <img
            style="width: 17px; height: 18px; margin-right: 8px"
            src="@/assets/images/coursewareManage/detail.png"
          />
          <span class="headerLeftText">查看详情</span>
        </div>
        <div style="margin-right: 57px; cursor: pointer">
          <img
            @click="ftsr_exit"
            style="width: 22px; height: 22px"
            src="../../assets/images/basicinfo/close22.png"
          />
        </div>
      </div>
      <div class="modalMain">
        <div
          class="ftsturecord"
          :style="{ display: om_ckxq ? 'block' : 'none' }"
        >
          <div class="ftsr_main">
            <div class="ftsr_table">
              <a-table
                :columns="columns4"
                :data-source="tableData4"
                :loading="tableDataTotal === -1 ? true : false"
                :pagination="false"
              >
              </a-table>
            </div>
            <div class="ftsr_btn" @click="ftsr_exit">
              <div class="btnText">取消</div>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!-- 面授 课程管理查看详情 页面 -->
    <!--开课页面 -->
    <a-modal
      v-model:visible="stm_hs"
      title="Title"
      @ok="closeModal"
      :footer="null"
      :closable="false"
      wrapClassName="modalStyle schtimeModal"
      width="80%"
      @cancel="stm_exit"
    >
      <div class="modalHeader">
        <div class="headerLeft">
          <img
            style="width: 17px; height: 18px; margin-right: 8px"
            src="@/assets/images/coursewareManage/scht.png"
          />
          <span class="headerLeftText">开课</span>
        </div>
        <div style="margin-right: 57px; cursor: pointer">
          <img
            @click="stm_exit"
            style="width: 22px; height: 22px"
            src="../../assets/images/basicinfo/close22.png"
          />
        </div>
      </div>
      <div class="modalMain">
        <div class="schooltime" :style="{ display: stm_hs ? 'block' : 'none' }">
          <div class="st_main">
            <div class="stm_inputbtn">
              <a-input
                v-model:value="kk_inputV1"
                style="
                  width: 270px;
                  height: 40px;
                  border-radius: 8px;
                  margin-right: 14px;
                "
                placeholder="请输入创建人"
              />
              <a-input
                v-model:value="kk_inputV2"
                style="
                  width: 270px;
                  height: 40px;
                  border-radius: 8px;
                  margin-right: 14px;
                "
                placeholder="请输入教师名称"
              />
              <div class="select">
                <a-date-picker
                  v-model:value="selectTime"
                  type="date"
                  placeholder="创建时间"
                  style="width: 270px; margin-right: 14px"
                />
              </div>
              <div class="stm_btn btn1" @click="handleSearchTable">
                <div class="search"></div>
                <div class="btnText">搜索</div>
              </div>
              <div class="stm_btn btn2" @click="handleRestTable">
                <div class="reset"></div>
                <div class="btnText">重置</div>
              </div>
              <div class="stm_btn3 btn3" @click="createkk">
                <div class="add"></div>
                <div class="btnText">
                  <span style="color: #ffffff">新建开课</span>
                </div>
              </div>
            </div>
            <!-- 无数据样式 -->
            <div class="notable" v-if="tableData6.length === 0">
              <div class="notablebox">
                <div class="boxbody">
                  <div class="boximg"></div>
                  <div class="boxtitle">
                    <span style="color: #ffb64e; font-size: 20px">无课程</span>
                  </div>
                  <div class="boxtitle2">
                    <span style="color: #878b92">请点击新建开课，创建课程</span>
                  </div>
                </div>
                <div class="smallleft"></div>
                <div class="smallright"></div>
              </div>
            </div>
            <!-- 无数据样式 -->
            <!-- 有数据表格 -->
            <div class="stm_table" v-else>
              <a-table
                :columns="columns6"
                :data-source="tableData6"
                :loading="tableDataTotal2 === -1 ? true : false"
                :scroll="{ x: 700, y: 800 }"
                expandRowByClick="true"
                @expand="expandTable"
                :pagination="false"
              >
                <template #bodyCell="{ record, column }">
                  <template v-if="column.key === 'operation'">
                    <span class="table-operation">
                      <a
                        @click="
                          () => {
                            QR_hs = true;
                            ftsQR_hs = true;
                          }
                        "
                      >
                        签到
                      </a>
                      <a
                        @click="
                          () => {
                            handelEditStu(record);
                          }
                        "
                      >
                        编辑
                      </a>
                      <a
                        @click="
                          () => {
                            handelGuan(record);
                          }
                        "
                      >
                        管理
                      </a>
                      <a-dropdown>
                        <template #overlay>
                          <a-menu>
                            <a-menu-item
                              @click="
                                () => {
                                  handleCopyP(record);
                                }
                              "
                            >
                              复制
                            </a-menu-item>
                            <a-menu-item
                              @click="
                                () => {
                                  handleDeleteKaike(record);
                                }
                              "
                            >
                              删除
                            </a-menu-item>
                            <a-menu-item
                              @click="
                                () => {
                                  QR_hs = true;
                                  vipftQR_hs = true;
                                }
                              "
                            >
                              二维码
                            </a-menu-item>
                          </a-menu>
                        </template>
                        <a>
                          更多
                          <down-outlined />
                        </a>
                      </a-dropdown>
                    </span>
                  </template>
                </template>
              </a-table>
              <div class="tableBox" style="margin-top: 50px">
                <div class="pa">
                  <a-pagination
                    :showSizeChanger="false"
                    showQuickJumper="true"
                    hideOnSinglePage="true"
                    :pageSize="pageSize2"
                    :current="currentPage2"
                    :total="tableDataTotal2"
                    class="pagination"
                    @change="handelChangePage2"
                  />
                </div>
              </div>
            </div>
            <!-- 有数据表格 -->
          </div>
        </div>
      </div>
    </a-modal>
    <!--开课页面 -->
    <!--新建开课页面 -->
    <a-modal
      v-model:visible="cstm_hs"
      style="margin-top: 400px"
      @cancel="handleCancelStu"
    >
      <div
        class="createschooltime"
        :style="{ display: cstm_hs ? 'block' : 'none' }"
      >
        <div class="cst_header"></div>
        <div class="cst_main">
          <div class="cstm_header">
            <div class="add_icon"></div>
            <span v-if="kk_eidt">编辑开课</span>
            <span v-else>新建开课</span>
            <div class="close_exit" @click="handleCancelStu"></div>
          </div>
          <div class="cstm_title">
            <span>面授名称：{{ newCourseName }}</span>
          </div>
          <div class="cstm_items">
            <div class="signbox">
              <div class="sign">
                <img
                  src="@/assets/images/coursewareManage/asterisk.png"
                  alt=""
                />
              </div>
              <span style="margin-right: 3px">开课名称</span>
            </div>
            <div class="b_input">
              <a-input
                maxlength="30"
                v-model:value="xjkkinputV1"
                style="width: 440px; height: 40px; border-radius: 8px"
                placeholder="请输入开课名称"
              />
            </div>
          </div>
          <div class="cstm_items">
            <div class="signbox">
              <div class="sign">
                <img
                  src="@/assets/images/coursewareManage/asterisk.png"
                  alt=""
                />
              </div>
              <span style="margin-right: 3px">地点</span>
            </div>
            <div class="b_input">
              <a-input
                v-model:value="xjkkinputV2"
                maxlength="50"
                style="width: 440px; height: 40px; border-radius: 8px"
                placeholder="请输入详细地点"
              />
              <div class="inp_num">
                <span style="color: #c7cbd2">{{ xjkkinputV2.length }}/50</span>
              </div>
            </div>
          </div>
          <div class="cstm_items">
            <div class="signbox">
              <div class="sign">
                <img
                  src="@/assets/images/coursewareManage/asterisk.png"
                  alt=""
                />
              </div>
              <span style="margin-right: 3px">面授时间</span>
            </div>
            <div class="select fitems">
              <a-range-picker
                style="width: 440px; height: 40px; border-radius: 8px"
                :show-time="{ format: 'HH:mm' }"
                format="YYYY-MM-DD HH:mm"
                v-model:value="xjkkinputV3"
                separator="至"
                :placeholder="['        开始时间', '        结束时间']"
              />
            </div>
          </div>
          <div class="cstm_items">
            <div class="signbox">
              <div class="sign">
                <img
                  src="@/assets/images/coursewareManage/asterisk.png"
                  alt=""
                />
              </div>
              <span style="margin-right: 3px">授课教师</span>
            </div>
            <div class="b_input">
              <ProjectManager
                v-model:value="member.value"
                v-model:name="member.name"
              ></ProjectManager>
            </div>
          </div>
          <div class="cstm_items">
            <div class="signbox">
              <span style="margin-right: 3px">报名设置</span>
            </div>
            <div class="b_input">
              <a-checkbox v-model:checked="checked1">
                <span style="color: #6d7584">是否允许公开报名</span>
              </a-checkbox>
            </div>
          </div>
          <div class="cstm_items">
            <div class="signbox">
              <span style="margin-right: 3px">签到设置</span>
            </div>
            <div class="b_input">
              <a-radio-group v-model:value="xjkkradioV1">
                <a-radio :value="0" @click="clear_xjkkradioV1">
                  <span style="color: #6d7584; margin-right: 30px">
                    是否允许未报名的学员签到
                  </span>
                </a-radio>
                <a-radio :value="1" @click="clear_xjkkradioV1">
                  <span style="color: #6d7584">签到是否需要口令</span>
                </a-radio>
              </a-radio-group>
            </div>
          </div>
          <div class="cstm_items">
            <div class="signbox">
              <span style="margin-right: 3px">评估设置</span>
            </div>
            <div class="b_input">
              <a-checkbox v-model:checked="checked4">
                <span style="color: #6d7584">是否需要评估</span>
              </a-checkbox>
            </div>
          </div>
          <div v-if="checked4" class="cstm_items main_item">
            <div class="signbox"></div>
            <div class="btnbox">
              <button class="xkbtn" @click="showAssessment">选择评估</button>
              <div v-if="assessmentId > 0">
                <a-tag closable @close="removePG" color="processing">
                  <span style="font-size: 14px; line-height: 33px">
                    {{ assessmentName }}
                  </span>
                </a-tag>
              </div>
              <AssessmentList
                v-model:assessmentVisible="assessmentVisible"
                v-model:assessmentName="assessmentName"
                :assessmentId="assessmentId"
                @checkedAss="getCheckedAss"
              />
            </div>
          </div>
          <div class="cstm_items">
            <div class="signbox">
              <span style="margin-right: 3px">完成规则</span>
            </div>
            <div class="b_input">
              <!--
              <a-checkbox
                v-model:checked="regisCom"
                @click="regisCom = !regisCom"
              >
                <span style="color: #6d7584">报名即完成</span>
              </a-checkbox> -->
              <a-checkbox v-model:checked="signCom" @click="signCom = !signCom">
                <span style="color: #6d7584">签到即完成</span>
              </a-checkbox>
              <a-checkbox
                v-model:checked="comLeave"
                @click="comLeave = !comLeave"
              >
                <span style="color: #6d7584">请假算完成</span>
              </a-checkbox>
            </div>
          </div>
          <div class="cstm_items items_fj">
            <div class="signbox">
              <span style="margin-right: 3px">附件</span>
            </div>
            <div class="b_input">
              <a-upload
                name="file"
                :show-upload-list="false"
                :before-upload="beforeUpload3"
              >
                <div class="upload_box">
                  <div class="upload_icon">
                    <img
                      src="@/assets/images/coursewareManage/enclosure.png"
                      alt=""
                    />
                  </div>
                  <span style="color: #4ea6ff">上传附件</span>
                </div>
                <!-- <template #itemRender="{ file }">
                  <a-space>
                    <span :style="file.status === 'error' ? 'color: red' : ''">
                      {{ file.name }}
                    </span>
                  </a-space>
                </template> -->
              </a-upload>
            </div>
          </div>
          <div class="cstm_items">
            <div class="signbox">
              <span style="margin-right: 3px"> </span>
            </div>
            <div class="b_input">
              <span style="color: #999ba3">
                支持.pdf,.ppt,.pptx,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png,.gif,.zip
              </span>
            </div>
          </div>
          <div class="mbl_items12">
            <div
              class="i12_box1"
              v-for="(item, index) in filesList"
              :key="index"
            >
              <div class="file_img"></div>
              <div class="file_detail">
                <!-- <div class="file_name">
                        <span style="color: #6f6f6f">{{ item.name }}</span>
                      </div> -->
                <!-- 条件渲染 s -->
                <!-- <div class="file_size">
                        <span style="color: #999ba3">{{ item.size }}</span>
                      </div> -->
                <div class="file_updata">
                  <div class="updatabox">
                    <div class="updatacolor"></div>
                    <div class="updataxq">上传完成</div>
                    <!-- <div class="updatacolor2"></div>
                          <div class="updataxq2">上传失败</div> -->
                    <!-- <div class="updatacolor3"></div>
                          <div class="updataxq3">正在上传</div> -->
                  </div>
                  <div class="upjd">
                    <span style="margin: auto 5px">100%</span>
                  </div>
                </div>
                <!-- 条件渲染 e -->
              </div>
              <div class="file_operation">
                <div class="fobox">
                  <span style="color: #4ea6ff" @click="handleDel2(index)">
                    删除
                  </span>
                </div>
                <!-- <div class="fobox">
                        <span style="color: #4ea6ff">重传</span>
                      </div>
                      <div class="fobox">
                        <span style="color: #4ea6ff">取消</span>
                      </div> -->
                <!-- <div class="fobox">
                        <span style="color: #4ea6ff; margin-right: 5px">
                          暂停
                        </span>
                      </div>
                      <div class="fobox">
                        <span style="color: #4ea6ff">取消</span>
                      </div> -->
              </div>
            </div>
          </div>
          <div class="items_btn">
            <div class="cstm_btn btn5" @click="handleCancelStu">
              <div class="btnText">取消</div>
            </div>
            <div class="cstm_btn btn6" @click="handleSureStu">
              <div v-if="addLoading" class="btnText">保存中</div>
              <div v-else class="btnText">确定</div>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!--新建开课页面 -->
    <!--开课学员管理页面 -->
    <a-modal
      v-model:visible="sm_hs"
      title="Title"
      @ok="closeModal"
      :footer="null"
      :closable="false"
      wrapClassName="modalStyle stusmanageModal"
      width="80%"
      @cancel="sm_exit"
    >
      <div class="modalHeader">
        <div class="headerLeft">
          <img
            style="width: 17px; height: 18px; margin-right: 8px"
            src="@/assets/images/coursewareManage/stum.png"
          />
          <span class="headerLeftText">学员管理</span>
        </div>
        <div style="margin-right: 57px; cursor: pointer">
          <img
            @click="sm_exit"
            style="width: 22px; height: 22px"
            src="../../assets/images/basicinfo/close22.png"
          />
        </div>
      </div>
      <div class="modalMain">
        <div
          class="studentsmanage"
          :style="{ display: sm_hs ? 'block' : 'none' }"
        >
          <div class="stm_main">
            <div class="stmmitems">
              <div class="stmm_i1">
                <span style="margin-right: 52px">
                  {{ currentPlanItem.name }}课程-第1期-
                  {{ currentPlanItem.createTime }}
                </span>
                <span style="color: #ffb751">已开课 4.5</span>
              </div>
              <div class="stmm_i2">
                <span style="color: #999ba3">时间：</span>
                <span>{{ currentPlanItem.endTime }}</span>
              </div>
              <div class="stmm_i3">
                <span style="color: #999ba3">地点：</span>
                <span>{{ currentPlanItem.address }}</span>
              </div>
              <div class="stmm_i4">
                <span style="color: #999ba3">授课教师：</span>
                <span>{{ currentPlanItem.teacher }}</span>
              </div>
              <div class="stmm_i5">
                <div class="i5_left">
                  <!-- <a-input
                    v-model:value="xygl_inputV1"
                    style="
                      width: 270px;
                      height: 40px;
                      border-radius: 8px;
                      margin-right: 14px;
                    "
                    placeholder="请输入姓名"
                  /> -->
                  <a-input
                    v-model:value="xygl_inputV1"
                    placeholder="请输入姓名"
                  />
                  <div class="stmm_btn btn1" @click="handleSearchStu">
                    <div class="search"></div>
                    <div class="btnText">搜索</div>
                  </div>
                  <div class="stmm_btn btn2" @click="handleRestStu">
                    <div class="reset"></div>
                    <div class="btnText">重置</div>
                  </div>
                </div>
                <div class="i5_right">
                  <div class="stmm_btn btn3">
                    <span
                      style="color: #ffffff"
                      @click="showStuAdd(currentPlanItem)"
                    >
                      添加学员
                    </span>
                  </div>
                  <!-- 2022-11-30注释 后面放开 -->
                  <!-- <div class="stmm_btn btn4" @click="hideShow">
                    <div class="btn4_sub">
                      <span style="color: #4ea6ff; margin-right: 4px">
                        批量操作
                      </span>
                      <div
                        class="b_zk"
                        :style="{ display: hideshow ? 'block' : 'none' }"
                      ></div>
                      <div
                        class="b_sq"
                        :style="{ display: hideshow ? 'none' : 'block' }"
                      ></div>
                    </div>
                    <div
                      class="btn4_sup"
                      :style="{ display: hideshow ? 'none' : 'block' }"
                    >
                      <div class="btnsbox">
                        <div class="btn4_tit" @click="handleAllJion">
                          <span style="color: #4ea6ff">批量录入成绩</span>
                        </div>
                        <div class="btn4_op1" @click="handleAllover">
                          <span>批量结业</span>
                        </div>
                        <div class="btn4_op2" @click="handleAllSuc">
                          <span>批量通过</span>
                        </div>
                        <div class="btn4_op3" @click="handleAllReject">
                          <span>批量拒绝</span>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="stmm_btn btn5" @click="handleExportStu">
                    <div class="export"></div>
                    <div class="btnText">导出</div>
                  </div> -->
                </div>
              </div>
              <div class="stmm_i6">
                <a-table
                  :columns="columns7"
                  :data-source="tableData7"
                  :loading="tableDataTotal3 === -1 ? true : false"
                  :scroll="{ x: 800 }"
                  expandRowByClick="true"
                  @expand="expandTable"
                  :pagination="false"
                  :row-selection="{
                    columnWidth: 20,
                    selectedRowKeys: selectedRowKeys7,
                    onChange: onSelectChange7,
                  }"
                >
                  <template #bodyCell="{ record, column }">
                    <!-- 操作1 -->
                    <template
                      v-if="
                        (String(record.applyStatus) === '0' ||
                          record.status === '待审核') &&
                        column.key === 'overstatus'
                      "
                    >
                      <span class="table-operation">-</span>
                    </template>
                    <template
                      v-if="
                        (String(record.applyStatus) === '-1' ||
                          record.status === '已拒绝') &&
                        column.key === 'overstatus'
                      "
                    >
                      <span class="table-operation">-</span>
                    </template>
                    <template
                      v-if="
                        (String(record.applyStatus) === '1' ||
                          record.status === '已通过') &&
                        column.key === 'overstatus'
                      "
                    >
                      <span class="table-operation">
                        <a
                          @click="
                            () => {
                              handlJoinStu(record);
                            }
                          "
                        >
                          成绩录入
                        </a>
                        <a
                          @click="
                            () => {
                              handleOverStu(record);
                            }
                          "
                        >
                          结业
                        </a>
                      </span>
                    </template>
                    <!-- 操作2 -->
                    <template
                      v-if="
                        (String(record.applyStatus) === '0' ||
                          record.status === '待审核') &&
                        column.key === 'operation'
                      "
                    >
                      <span class="table-operation">
                        <a
                          @click="
                            () => {
                              handleSucessStu(record);
                            }
                          "
                        >
                          通过
                        </a>
                        <a
                          @click="
                            () => {
                              handleRejectStu(record);
                            }
                          "
                        >
                          拒绝
                        </a>
                        <a
                          @click="
                            () => {
                              handleDeleteStu(record);
                            }
                          "
                        >
                          删除
                        </a>
                      </span>
                    </template>
                    <template
                      v-if="
                        (String(record.applyStatus) === '1' ||
                          record.status === '已通过') &&
                        column.key === 'operation'
                      "
                    >
                      <span class="table-operation">
                        <a
                          @click="
                            () => {
                              handleDeleteStu(record);
                            }
                          "
                        >
                          删除
                        </a>
                      </span>
                    </template>
                    <template
                      v-if="
                        (String(record.applyStatus) === '-1' ||
                          record.status === '已拒绝') &&
                        column.key === 'operation'
                      "
                    >
                      <span class="table-operation">
                        <a
                          @click="
                            () => {
                              handleDeleteStu(record);
                            }
                          "
                        >
                          删除
                        </a>
                      </span>
                    </template>
                  </template>
                </a-table>
                <div class="tableBox" style="margin-top: 50px">
                  <div class="pa">
                    <a-pagination
                      :showSizeChanger="false"
                      showQuickJumper="true"
                      hideOnSinglePage="true"
                      :pageSize="pageSize3"
                      :current="currentPage3"
                      :total="tableDataTotal3"
                      class="pagination"
                      @change="handelChangePage3"
                    />
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!--开课学员管理页面 -->
    <!--二维码页面 -->
    <a-modal
      v-model:visible="QR_hs"
      :footer="null"
      :closable="closableQR"
      wrapClassName="QRModal"
      style="margin-top: 400px"
      :zIndex="9999"
      @cancel="qr_exit"
    >
      <div class="QR" :style="{ display: QR_hs ? 'block' : 'none' }">
        <div class="qr_header"></div>
        <div class="qr_main">
          <div class="qrm_header">
            <div class="qr_icon"></div>
            <div :style="{ display: qrQR_hs ? 'block' : 'none' }">
              <span>二维码</span>
            </div>
            <div :style="{ display: olQR_hs ? 'block' : 'none' }">
              <span>在线课</span>
            </div>
            <div :style="{ display: ftQR_hs ? 'block' : 'none' }">
              <span>面授课</span>
            </div>
            <div :style="{ display: ftsQR_hs ? 'block' : 'none' }">
              <span>面授课签到</span>
            </div>
            <div :style="{ display: vipftQR_hs ? 'block' : 'none' }">
              <span>管理者面授课</span>
            </div>
            <div class="close_exit" @click="qr_exit"></div>
          </div>
          <div class="qrm_body">
            <div class="QR_img"></div>
          </div>
          <div class="qrm_footer">
            <span style="margin-left: 52px">下载二维码</span>
            <div class="qrmbtn">
              <div class="btntext">200*200</div>
            </div>
            <!-- <div class="qrmbtn">
              <div class="btntext">400*400</div>
            </div>
            <div class="qrmbtn">
              <div class="btntext">800*800</div>
            </div> -->
          </div>
        </div>
      </div>
    </a-modal>
    <!--二维码页面 -->
    <!--录入成绩页面 -->
    <a-modal
      v-model:visible="rg_hs"
      :footer="null"
      :closable="closableQR"
      wrapClassName="recgradeModal"
      style="margin-top: 400px"
      :zIndex="9999"
      @cancel="rg_exit"
    >
      <div class="recordgrade" :style="{ display: rg_hs ? 'block' : 'none' }">
        <div class="rg_header"></div>
        <div class="rg_main">
          <div class="rgm_header">
            <div class="rg_icon"></div>
            <span>录入成绩</span>
            <div class="close_exit" @click="rg_exit"></div>
          </div>
          <div class="rgm_body">
            <div class="rgmb_items">
              <div class="items_left">
                <div class="sign">
                  <img
                    src="@/assets/images/coursewareManage/asterisk.png"
                    alt=""
                  />
                </div>
                <span>得分</span>
              </div>
              <div class="rgmb_input">
                <a-input
                  v-model:value="lrcj_inputV1"
                  maxlength="20"
                  style="width: 440px; height: 40px; border-radius: 8px"
                  placeholder=""
                />
              </div>
            </div>
          </div>
          <div class="qrm_btnbox">
            <div class="qrm_btn btn1">
              <div class="btnText" @click="rg_exit">取消</div>
            </div>
            <div class="qrm_btn btn2">
              <div class="btnText" @click="handleJoin">确定</div>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!--录入成绩页面 -->
    <!--结业页面 -->
    <a-modal
      v-model:visible="graduate_hs"
      :footer="null"
      :closable="closableQR"
      wrapClassName="graModal"
      style="margin-top: 400px"
      :zIndex="9999"
      @cancel="graduate_exit"
    >
      <div
        class="graduate"
        :style="{ display: graduate_hs ? 'block' : 'none' }"
      >
        <div class="gra_header"></div>
        <div class="gra_main">
          <div class="gram_header">
            <div class="gra_icon"></div>
            <span>结业</span>
            <div class="close_exit" @click="graduate_exit"></div>
          </div>
          <div class="gram_body">
            <div class="gramb_items">
              <div class="items_left">
                <div class="sign">
                  <img
                    src="@/assets/images/coursewareManage/asterisk.png"
                    alt=""
                  />
                </div>
                <span>结业</span>
              </div>
              <div class="gramb_input">
                <a-radio-group v-model:value="jyradioV1">
                  <div class="bc_box">
                    <div class="ol_checkbox">
                      <a-radio
                        v-model:checked="checked"
                        :value="1"
                        @click="clear_jyradioV1"
                        >结业
                      </a-radio>
                    </div>
                    <div class="ol_checkbox">
                      <a-radio
                        v-model:checked="checked"
                        :value="2"
                        @click="clear_jyradioV1"
                        >不结业
                      </a-radio>
                    </div>
                  </div>
                </a-radio-group>
              </div>
            </div>
          </div>
          <div class="qrm_btnbox">
            <div class="qrm_btn btn1">
              <div class="btnText" @click="graduate_exit">取消</div>
            </div>
            <div class="qrm_btn btn2">
              <div class="btnText" @click="handleJie">确定</div>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!--结业页面 -->
    <!--请确定是否同意拒绝此学员学习此课程弹窗 -->
    <a-modal
      v-model:visible="agreereject_hs"
      :footer="null"
      :closable="closableQR"
      wrapClassName="agrstudyModal"
      centered="true"
      @cancel="agreereject_exit"
    >
      <div
        class="agreestudy"
        :style="{ display: agreereject_hs ? 'block' : 'none' }"
      >
        <div class="agree_header"></div>
        <div class="agree_main">
          <div class="agreem_header">
            <div class="agreem_icon"></div>
            <span>提示</span>
            <div class="close_exit" @click="agreereject_exit"></div>
          </div>
          <div class="agreem_body">
            <div
              class="body_box"
              :style="{ display: agreestudy_hs ? 'block' : 'none' }"
            >
              <div>请确定是否同意此学员学习此课程</div>
            </div>
            <div
              class="body_box"
              :style="{ display: rejectstudy_hs ? 'block' : 'none' }"
            >
              <div>请确定是否拒绝此学员学习此课程</div>
            </div>
          </div>
          <div class="qrm_btnbox">
            <div class="qrm_btn btn1">
              <div class="btnText" @click="agreereject_exit">取消</div>
            </div>
            <div class="qrm_btn btn2">
              <div class="btnText" @click="handleAgreeTrue">确定</div>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!--请确定是否同意拒绝此学员学习此课程弹窗 -->
    <!--删除 复制 停用弹窗 -->
    <a-modal
      v-model:visible="delete_hs"
      :footer="null"
      :closable="closableQR"
      wrapClassName="DelModal"
      style="margin-top: 400px"
      :zIndex="9999"
      @cancel="delete_exit1"
    >
      <div
        class="delete"
        :style="{
          display: del_hs || copy_hs || nouse_hs ? 'block' : 'none',
        }"
      >
        <div class="del_header"></div>
        <div class="del_main">
          <div class="header">
            <div
              class="del-icons"
              :style="{ display: del_hs ? 'block' : 'none' }"
            >
              <img src="@/assets/images/coursewareManage/notice.png" alt="" />
            </div>
            <div
              class="del-icons"
              :style="{ display: copy_hs || nouse_hs ? 'block' : 'none' }"
            >
              <img src="@/assets/images/coursewareManage/QR.png" alt="" />
            </div>
            <span>提示</span>
            <div class="close_exit" @click="delete_exit1"></div>
          </div>
          <div class="body">
            <div :style="{ display: del_hs && !del_hs_stu ? 'block' : 'none' }">
              <span>您确定要删除此课程吗</span>
            </div>
            <div :style="{ display: del_hs && del_hs_stu ? 'block' : 'none' }">
              <span>您确定要删除此学员吗</span>
            </div>
            <div :style="{ display: copy_hs ? 'block' : 'none' }">
              <span>您确定要复制此课程吗</span>
            </div>
            <div :style="{ display: nouse_hs ? 'block' : 'none' }">
              <span>您确定要停用此课程吗</span>
            </div>
          </div>
          <div class="del_btnbox">
            <div class="del_btn btn1">
              <div class="btnText" @click="delete_exit1">取消</div>
            </div>
            <div class="del_btn btn2">
              <div v-if="addLoading" class="btnText">保存中...</div>
              <div v-else class="btnText" @click="handleDeleteExit">确定</div>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
    <!-- 预览弹窗 -->
    <SeeModal
      :visible="lookCourseModal"
      :detail="faceDetailObj"
      @cancel="ft_exit_see"
    />
    <!--删除 复制 停用弹窗 -->
    <!-- 学员管理课程库-归属权抽屉 -->
    <!-- <own-power v-model:ownpowervisible="ownpowervisible" /> -->
    <!-- 学员管理课程库-归属权抽屉 -->
    <!-- 添加授权侧弹窗 -->
    <!-- <corpowerlist v-model:corpowerlistVisible="corpowerlistvisible" /> -->
    <!-- 添加授权侧弹窗 -->
    <!-- 学员管理-添加学员抽屉 -->
    <!-- <StuAdd v-model:Stuvisible="Stuvisible" @sure="handlePostSure" /> -->
    <!-- 添加学员抽屉 -->
    <!-- <proj-check-ship
      v-model:ProjCheckvisible="viewpowervisible"
      :selectProjectId="offcourseId"
      v-model:addStudentList="addStudentList"
      :authClassify="authClassify"
      classify="addstudent"
    /> -->
    <!-- 新建在线课弹窗 -->
    <addOnlineCourse
      v-model:addOnlineCoursevisible="addOnlineCoursevisible"
      :closeOnlineModal="closeOnlineCoursevisible"
    />
    <!-- 新建在线课弹窗 -->

    <!-- 授权名单抽屉 -->
    <proj-power-list
      v-model:ProjPvisible="corpowerlistvisible"
      :selectProjectId="selectCourseId"
      classify="course"
    />
    <!-- 归属权抽屉 -->
    <proj-owner-ship
      v-model:ProjOwnervisible="ownpowervisible"
      :selectProjectId="selectCourseId"
      classify="course"
    />
    <!-- 查看权抽屉 -->
    <!-- <proj-check-ship
      v-model:ProjCheckvisible="viewpowervisible"
      :selectProjectId="selectCourseId"
      v-model:addAuthList="addAuthList"
      :authClassify="authClassify"
      classify="course"
    /> -->
    <!--查看权抽屉 管理权抽屉 添加学员抽屉  -->
    <proj-check-ship
      v-model:ProjCheckvisible="viewpowervisible"
      :selectProjectId="selectCourseId"
      v-model:addAuthList="addAuthList"
      :authClassify="authClassify"
      classify="course"
      :type="shipType"
    />
  </div>

  <div class="aeLoading" :style="{ display: addLoading ? 'flex' : 'none' }">
    <a-spin :spinning="addLoading" tip="保存中..." />
  </div>
</template>
<script>
import {
  reactive,
  toRefs,
  defineComponent,
  ref,
  shallowRef,
  onMounted,
  onBeforeUnmount,
  watch,
} from "vue";
import * as api from "../../api/indexInvist.js";
import { message } from "ant-design-vue";
import { useRouter, useRoute } from "vue-router";
// import StuAdd from "../../components/drawers/StuAdd";
// import OwnPower from "../../components/drawers/OwnPower.vue";
// import Corpowerlist from "../../components/drawers/CorPowerlist.vue";
import addOnlineCourse from "../../components/Modals/addOnlineCourse.vue";

import ProjOwnerShip from "../../components/drawers/ProjectOwn";
import ProjPowerList from "../../components/drawers/ProjPowerList";
import ProjCheckShip from "../../components/drawers/ProjCheckPower";
import AssessmentList from "../../components/drawers/AssessmentList.vue";
import {
  list,
  edit,
  detail,
  detailPlan,
  handle,
  exportP,
  deletePlan,
  planList,
  editPlan,
  studentList,
  addStudent,
  studentExport,
  handleStudent,
  getMemberInfoApi,
  // listReview,
  // studyRecordList,
} from "@/api/indexCourse";
import {
  traverseArr,
  getdateToTime,
  newFile,
  getdateToDate,
} from "../../utils/utils";
// import { toDate } from "../../api/method.js";
import { fileUp } from "../../api/indexEval";
import dayjs from "dayjs";
import * as api1 from "../../api/index1";

import "@wangeditor/editor/dist/css/style.css";
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
import ProjectManager from "@/components/project/ProjectManagerNew";

import SeeModal from "./components/seeModal.vue";
import * as moment from "moment";

//列表表格
const columns1 = [
  {
    title: "序号",
    width: 100,
    dataIndex: "num",
    key: "num",
    align: "center",
    customRender: ({ index, record }) => {
      const pageNum =
        Number(record.pageNo) - 1 > 0 ? (Number(record.pageNo) - 1) * 10 : 0;
      return index + 1 + pageNum;
    },
  },
  {
    title: "名称",
    width: 200,
    dataIndex: "name",
    key: "name",
    ellipsis: true,
    align: "center",
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "内容分类",
    width: 130,
    dataIndex: "contentTxt",
    key: "1",
    align: "center",
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "课程形式",
    width: 130,
    dataIndex: "courseform",
    key: "2",
    align: "center",
    customRender: ({ record }) => {
      switch (String(record.courseform)) {
        case "1":
          return "线上";
        case "2":
          return "面授";
      }
    },
  },
  {
    title: " 所属项目",
    width: 250,
    dataIndex: "projectName",
    key: "3",
    align: "center",
    ellipsis: true,
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: " 所属路径",
    width: 250,
    dataIndex: "routerName",
    key: "3",
    align: "center",
    ellipsis: true,
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "学习人数",
    width: 130,
    dataIndex: "stunum",
    key: "4",
    align: "center",
    customRender: ({ text }) => {
      return text ? text : "0";
    },
  },
  {
    title: "评分",
    width: 130,
    dataIndex: "grade",
    key: "5",
    align: "center",
    customRender: ({ text }) => {
      return text ? text : "0";
    },
  },
  {
    title: "状态",
    width: 130,
    dataIndex: "status",
    key: "6",
    align: "center",
    customRender: ({ record }) => {
      switch (String(record.status)) {
        case "0":
          return "未提交";
        case "1":
          return "待审核";
        case "2":
          return "已审核";
        case "-1":
          return "审核未通过";
      }
    },
  },
  {
    title: "是否发布",
    width: 100,
    dataIndex: "ynpub",
    key: "7",
    align: "center",
    customRender: ({ record }) => {
      switch (String(record.ynpub)) {
        case "0":
          return "未发布";
        case "1":
          return "已发布";
      }
    },
  },
  {
    title: "创建人",
    width: 100,
    dataIndex: "creator",
    key: "8",
    align: "center",
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "创建时间",
    width: 160,
    dataIndex: "createtime",
    key: "9",
    align: "center",
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "上线时间",
    width: 160,
    dataIndex: "pubtime",
    key: "10",
    align: "center",
    customRender: ({ text }) => {
      return text ? getdateToTime(text * 1000) : "-";
    },
  },
  {
    title: "是否停用",
    width: 100,
    key: "either",
    dataIndex: "kkty",
    align: "center",
    customRender: ({ record }) => {
      switch (String(record.kkty)) {
        case "0":
          return "停用";
        case "1":
          return "启用";
      }
    },
  },
  {
    title: "操作",
    width: 300,
    className: "h",
    dataIndex: "operation",
    key: "operation",
    fixed: "right",
    align: "center",
  },
];
//列表操作在线面授管理
const columns2 = [
  {
    title: "姓名",
    dataIndex: "projectName",
    key: "projectName",
    width: "16%",
    align: "center",
  },
  {
    title: "工号",
    dataIndex: "numb",
    key: "numb",
    width: "16%",
    align: "center",
  },
  {
    title: "报名时间",
    dataIndex: "applytime",
    key: "applytime",
    width: "16%",
    align: "center",
  },
  {
    title: "签到时间",
    dataIndex: "signtime",
    key: "signtime",
    width: "16%",
    align: "center",
  },
  {
    title: "状态",
    dataIndex: "status",
    key: "status",
    width: "16%",
    align: "center",
  },
  {
    title: "操作",
    dataIndex: "opacation",
    key: "opacation",
    width: "16%",
    align: "center",
  },
];
//管理查看详情
const columns4 = [
  {
    title: "开课名称",
    dataIndex: "projectName",
    key: "projectName",
    width: "30%",
    align: "center",
  },
  {
    title: "地点",
    dataIndex: "address",
    key: "address",
    width: "30%",
    align: "center",
  },
  {
    title: "状态",
    dataIndex: "status",
    key: "status",
    width: "40%",
    align: "center",
  },
];
//开课表格
const columns6 = [
  {
    title: "序号",
    dataIndex: "num",
    key: "num",
    width: "6%",
    align: "center",
    ellipsis: true,
    customRender: ({ index, record }) => {
      const pageNum =
        Number(record.pageNo) - 1 > 0 ? (Number(record.pageNo) - 1) * 10 : 0;
      return index + 1 + pageNum;
    },
  },
  {
    title: "创建人",
    dataIndex: "createName",
    key: "createName",
    width: "10%",
    align: "center",
    ellipsis: true,
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "教师名称",
    dataIndex: "teacher",
    key: "teacher",
    width: "10%",
    align: "center",
    ellipsis: true,
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "课程名称",
    dataIndex: "organization",
    key: "organization",
    width: "15%",
    align: "center",
    ellipsis: true,
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "场地",
    dataIndex: "address",
    key: "saddress",
    width: "15%",
    align: "center",
    ellipsis: true,
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "开始时间",
    dataIndex: "starttime",
    key: "starttime",
    width: "12%",
    ellipsis: true,
    align: "center",
    customRender: ({ text }) => {
      // return text ? getdateToTime(text * 1000) : "-";
      return text ? text : "-";
    },
  },
  {
    title: "创建时间",
    dataIndex: "createtime",
    key: "createtime",
    width: "12%",
    ellipsis: true,
    align: "center",
    customRender: ({ text }) => {
      // return text ? getdateToTime(text * 1000) : "-";
      return text ? text : "-";
    },
  },
  {
    title: "操作",
    width: "20%",
    dataIndex: "operation",
    key: "operation",
    align: "center",
  },
];
//开课学员管理
const columns7 = [
  {
    title: "序号",
    width: 200,
    dataIndex: "num",
    key: "num",
    align: "center",
    customRender: ({ index, record }) => {
      const pageNum =
        Number(record.pageNo) - 1 > 0 ? (Number(record.pageNo) - 1) * 10 : 0;
      return index + 1 + pageNum;
    },
  },
  {
    title: "姓名",
    width: 200,
    dataIndex: "name",
    key: "name",
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "工号",
    width: 200,
    dataIndex: "number",
    key: "1",
    align: "center",
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "部门",
    width: 200,
    dataIndex: "department",
    key: "2",
    align: "center",
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  //  //  {
    //  title: "岗位",
    //  width: 300,
    //  dataIndex: "postion",
    //  key: "3",
    //  align: "center",
   //   customRender: ({ text }) => {
    //    return text ? text : "-";
    //  },
  //  },
  {
    title: "Band",
    width: 200,
    dataIndex: "band",
    key: "4",
    align: "center",
    customRender: ({ text }) => {
      return text ? text : "-";
    },
  },
  {
    title: "报名状态",
    width: 200,
    dataIndex: "status",
    key: "5",
    align: "center",
    customRender: ({ record }) => {
      switch (String(record.source)) {
        case "0":
          return "待审核";
        case "1":
          return "审核通过";
        case "2":
          return "审核拒绝";
      }
    },
  },
  {
    title: "加入方式",
    width: 200,
    dataIndex: "join",
    key: "6",
    align: "center",
    customRender: ({ record }) => {
      switch (String(record.source)) {
        case "1":
          return "手动加入";
        case "2":
          return "报名加入";
      }
    },
  },
  {
    title: "签到状态",
    width: 200,
    dataIndex: "signstatus",
    key: "7",
    align: "center",
    customRender: ({ record }) => {
      switch (String(record.signStatus)) {
        case "0":
          return "未签到";
        case "1":
          return "已签到";
        case "2":
          return "请假";
      }
    },
  },
  {
    title: "评估状态",
    width: 200,
    dataIndex: "evastatus",
    key: "8",
    align: "center",
    customRender: ({ record }) => {
      switch (String(record.evalStatus)) {
        case "0":
          return "未评估";
        case "1":
          return "已评估";
      }
    },
  },
  // {
  //   title: "结业状态",
  //   width: 100,
  //   className: "h",
  //   dataIndex: "overstatus",
  //   key: "overstatus",
  //   fixed: "right",
  //   align: "center",
  //   // key: "9",
  //   // align: "center",
  //   // customRender: ({ record }) => {
  //   //   switch (String(record.source)) {
  //   //     case "0":
  //   //       return "未结业";
  //   //     case "1":
  //   //       return "已结业";
  //   //   }
  //   // },
  // },
  {
    title: "操作",
    width: 100,
    className: "h",
    dataIndex: "operation",
    key: "operation",
    fixed: "right",
    align: "center",
  },
];
export default defineComponent({
  components: {
    // OwnPower,
    // Corpowerlist,
    Editor,
    Toolbar,
    SeeModal,
    // StuAdd,
    ProjectManager,
    ProjOwnerShip,
    ProjPowerList,
    ProjCheckShip,
    AssessmentList,
    // VNodes: (_, {attrs}) => {
    //   return attrs.vnodes;
    // },
    addOnlineCourse,
  },
  setup() {
    const state = reactive({
      shipType: 1,
      addLoading: false,
      currentPlanItem: {},
      teacherId: null,
      teacher: null,
      selectedRowKeys7: [],
      isEdit: 0,
      member: { name: "", value: "" },
      //列表表格
      tableData1: [
        // {
        //   key: "1",
        //   num: 1,
        //   name: "时间管理",
        //   content: "领导力",
        //   courseform: "线上",
        //   project: "管理者进阶-腾飞班1",
        //   stunum: "50",
        //   grade: "5",
        //   status: "未提交",
        //   ynpub: "未发布",
        //   creator: "管理员",
        //   createtime: "2022-07-20 9:30",
        //   pubtime: "2022-07-20 9:30",
        //   kkty: false,
        // },
      ],
      //在线面授管理报名管理
      tableData2: [
        // {
        //   key: 1,
        //   projectName: "刘莉",
        //   numb: "10064511",
        //   applytime: "2022-07-20 14:00:00",
        //   signtime: "-",
        //   status: "已通过",
        // },
      ],
      //在线面授管理学习记录
      tableData3: [
        {
          key: 1,
          projectName: "刘莉",
          numb: "10064511",
          applytime: "2022-07-20 14:00:00",
          signtime: "-",
          status: "已通过",
        },
      ],
      //管理查看详情
      tableData4: [
        {
          key: 1,
          projectName: "刘莉",
          address: "10064511",
          status: "已通过",
        },
      ],
      //列表表格
      tableData5: [
        // {
        //   key: "1",
        //   num: 1,
        //   name: "时间管理",
        //   content: "领导力",
        //   courseform: "线上",
        //   project: "管理者进阶-腾飞班1",
        //   stunum: "50",
        //   grade: "5",
        //   status: "未提交",
        //   ynpub: "未发布",
        //   creator: "管理员",
        //   createtime: "2022-07-20 9:30",
        //   pubtime: "2022-07-20 9:30",
        //   kkty: false,
        // },
      ],
      //开课
      tableData6: [
        // {
        //   key: 1,
        //   num: 1,
        //   organization: "管理者面授课1",
        //   address: "核心能力大楼培训",
        //   starttime: "2022-07-20 14:00:00",
        //   createtime: "2022-07-14 14:00:00",
        // },
      ],
      //开课学员管理
      tableData7: [
        // {
        //   key: "1",
        //   num: 1,
        //   name: "李梦",
        //   number: "1000",
        //   department: "显示事业",
        //   postion: "产品经理",
        //   band: "Band9",
        //   status: "待审核",
        //   join: "手动加入",
        //   signstatus: "-",
        //   evastatus: "-",
        //   overstatus: "-",
        // },
      ],
      currentPage1: 1,
      tableDataTotal1: 100,
      pageSize1: 10,

      currentPageTea1: 1,
      tableDataTotalTea1: 0,
      pageSizeTea1: 10,
      currentPageTea2: 1,
      tableDataTotalTea2: 0,
      pageSizeTea2: 10,

      Stuvisible: false, //添加学员

      currentPage: 1,
      tableDataTotal: 100,
      pageSize: 10,
      selectedRowKeys: [],
      faceManageTab: "1",
      of_hs: false,
      hideshow: true,
      bs_hs: true,
      ft_hs: false,
      lookMs: false,
      om_1: false,
      ft_1: false,
      om_ckxq: false,
      stm_hs: false,
      cstm_hs: false,
      sm_hs: false,
      QR_hs: false,
      closableQR: false,
      rg_hs: false,
      piliang: false,
      graduate_hs: false,
      agreereject_hs: false,
      agreestudy_hs: false,
      rejectstudy_hs: false,
      delete_hs: false,
      del_hs: false,
      del_hs_stu: false,
      copy_hs: false,
      nouse_hs: false,
      // 二维码标题状态
      qrQR_hs: false,
      olQR_hs: false,
      ftQR_hs: false,
      ftsQR_hs: false,
      vipftQR_hs: false,
      //抽屉状态
      ownpowervisible: false,
      corpowerlistvisible: false,

      lookCourseModal: false,
      faceDetailObj: null,

      offcourseId: null,
      projectName: "",
      name: "",
      createName: "",
      auditStatus: null,
      categoryId: null,
      projectTime: "",

      //列表
      value1: "",
      value2: "",
      value3: "",
      value4: "",
      //选择线上还是面授
      xzinputV1: "",
      valueE1: "",
      valueE2: "",
      //确定面授
      ft_eidt: false,
      statusJuJue: 0,
      statusTingQi: 1,
      qdms_inputV1: "",
      qdms_inputV2: "",
      qdms_inputV3: "",
      qdms_inputV4: [],
      tagsOptions: [],
      qdms_inputV5: null,
      fen_lei: null,
      feng_mian_1: null,
      feng_mian_2: null,
      chang_jin: null,
      tags_val_single: "",
      tags_val: [],
      qdms_inputV6: "",
      //在线面授管理
      gl_selectV1: undefined,
      gl_selectV2: undefined,
      gl_inputV1: "",
      gl_inputV2: "",
      //开课
      kk_eidt: false,
      kkinputV1: "",
      kkinputV2: "",
      //新建开课
      xjkkradioV1: "",
      completeType: "",
      xjkkinputV1: "",
      xjkkinputV2: "",
      xjkkinputV3: "",
      xjkkinputV4: null,
      //开课学员管理
      xygl_inputV1: "",
      //录入成绩
      lrcj_inputV1: "",
      //结业
      jyradioV1: "",

      imageUrl: "",
      imgList: [],

      pageSize2: 10,
      currentPage2: 0,
      tableDataTotal2: 0,
      pageSize22: 10,
      currentPage22: 1,
      tableDataTotal22: 0,
      pageSize222: 10,
      currentPage222: 1,
      tableDataTotal222: 0,
      kk_inputV1: "",
      kk_inputV2: "",
      selectTime: "",

      pageSize3: 10,
      currentPage3: 1,
      tableDataTotal3: 0,

      checked1: false,
      checked4: false,
      offcoursePlanId: 0,
      filesList: [],
      signCom: false,
      regisCom: false,
      comLeave: false,
      studentId: 0,
      studentItem: {},
      addOnlineCoursevisible: false, //新建面授弹窗

      selectCourseId: null, //授权选择的id

      viewpowervisible: false, //查看权抽屉
      authClassify: null, //1：查看权 2：管理权 3：学员
      addAuthList: null,

      addStudentList: null, //选中列表

      newCourseName: null, //新建开课名称

      assessment: {},
      assessmentId: null,
      assessmentName: "",
      assessmentVisible: false,
    });

    const showStuAdd = (record) => {
      state.selectCourseId = record.offcoursePlanId;
      state.shipType = 2;
      state.authClassify = 3;
      state.viewpowervisible = true;
    };

    //  富文本 sssssssssssssss
    // 编辑器实例，必须用 shallowRef
    const editorRef = shallowRef();
    // 内容 HTML
    const valueHtml = ref("");
    // // 模拟 ajax 异步获取内容
    onMounted(() => {
      setTimeout(() => {
        //     valueHtml.value = "<p>模拟 Ajax 异步设置内容</p>";
        console.log("toolbar222222222222222");
        console.log(editorRef.value);
        // const toolbar = DomEditor.getToolbar(editorRef.value);
        // const menu = editorRef.value.getAllMenuKeys();
        // const bar = toolbar.getConfig().toolbarKeys;
        // console.log(menu);
        // console.log(bar);
      }, 3500);
    });

    const toolbarConfig = {
      excludeKeys: ["insertVideo", "insertImage"],
    };
    const editorConfig = { placeholder: "请输入内容...", MENU_CONF: {} };
    editorConfig.MENU_CONF["uploadImage"] = {
      // 自定义上传
      async customUpload(file, insertFn) {
        const formData = new FormData();
        formData.append("file", file);
        fileUp(formData).then((res) => {
          if (res.data.code === 200) {
            // 最后插入图片
            insertFn(res.data.data, file.name, res.data.data);
          }
        });
      },
    };
    const handleCreated = (editor) => {
      console.log("toolbar2222222222333333322222");
      console.log(editorRef.value);
      editorRef.value = editor; // 记录 editor 实例，重要！
    };
    // 组件销毁时，也及时销毁编辑器
    onBeforeUnmount(() => {
      const editor = editorRef.value;
      if (editor == null) return;
      editor.destroy();
    });
    //  富文本 eeeeeeeeeeeeee

    const route = useRoute();
    console.log(route);
    const router = useRouter();
    console.log(router);

    const beforeUpload = (file) => {
      return new Promise((resolve, reject) => {
        const isJpgOrPng =
          file.type === "image/jpg" ||
          file.type === "image/jpeg" ||
          file.type === "image/png" ||
          file.type === "image/svg" ||
          file.type === "image/bmp" ||
          file.type === "image/gif";
        if (!isJpgOrPng) {
          message.error("仅支持jpg、gif、png、jpeg、svg、bmp格式!");
          return reject(false);
        }

        console.log(file.size);
        let isLt1M = file.size / 10240 / 10240 <= 1;
        if (!isLt1M) {
          this.$message.error("图片大小超过10MB!");
          return reject(false);
        }

        let w = 0,
          h = 0;
        let reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = () => {
          const image = new Image();
          image.src = reader.result;
          image.onload = () => {
            w = image.width;
            h = image.height;
            const ratio = 800 / 450;
            if (w / h == ratio) {
              // 图片比例为800*450横纵比一致

              const formData = new FormData();
              formData.append("file", file);
              console.log(file);
              fileUp(formData).then((res) => {
                if (res.data.code === 200) {
                  state.imageUrl = res.data.data;
                  // state.hasImgName = file.name;
                  // emit("src", { id: curItem.value.id, src: res.data.data });
                }
              });
              return resolve(true);
            } else {
              message.error(
                "图片尺寸错误，只能上传800*450(高宽比例为16：9)横纵比一致的图片"
              );
              return reject(false);
            }
          };
        };

        return reject(false);
      });
    };
    const beforeUpload2 = (file) => {
      console.log(6765555);
      console.log(file);
      const fileType = [
        "jpg",
        "jpeg",
        "png",
        "gif",
        "pdf",
        "ppt",
        "pptx",
        "doc",
        "docx",
        "xls",
        "xlsx",
        "zip",
      ];
      if (!fileType.includes(file.name.split(".")[1])) {
        message.error(
          "仅支持.pdf,.ppt,.pptx,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png,.gif,.zip格式!"
        );
        return false;
      }

      // let isLt1M = file.size / 10240 / 10240 <= 1;
      // if (!isLt1M) {
      //   this.$message.error("图片大小超过10MB!");
      //   return false;
      // }

      const formData = new FormData();
      formData.append("file", file);
      console.log(file);
      fileUp(formData).then((res) => {
        if (res.data.code === 200) {
          state.imgList.push({
            img: res.data.data,
            name: file.name,
            size: file.size,
          });
          console.log(state.imgList);
          // state.hasImgName = res.data.data;
        }
      });
      return false;
    };
    const handleDel = (index) => {
      state.imgList.splice(index, 1);
    };
    const handleDel2 = (index) => {
      state.filesList.splice(index, 1);
    };

    // 渲染列表1操作
    const getTableDate = async () => {
      // let datas = state.tableData1;
      let startTime = "";
      let endTime = "";
      if (state.projectTime) {
        startTime = state.projectTime[0];
        endTime = state.projectTime[1];
      }
      let res = await list({
        pageNo: state.currentPage1,
        pageSize: state.pageSize1,
        auditStatus: state.auditStatus,
        categoryId: state.categoryId,
        projectName: state.projectName,
        name: state.name,
        createName: state.createName,
        endTime: endTime,
        beginTime: startTime,
      });
      const { rows, total, pageNo } = res.data.data;
      console.log(res.data.data);
      state.tableDataTotal1 = total;
      for (let i = 0; i < rows.length; i++) {
        rows[i].num = i + 1 + (state.currentPage1 - 1) * 10;
      }
      const datas = traverseArr(
        rows,
        {
          key: "offcourseId",
          num: "num",
          name: "name",
          content: "categoryId",
          courseform: "type",
          project: "projectName",
          stunum: "studentCnt",
          grade: "score",
          status: "auditStatus",
          ynpub: "publishStatus",
          creator: "createName",
          createtime: "createTime",
          pubtime: "publishTime",
          kkty: "status",
          offcourseId: "offcourseId",
        },
        true
      );
      datas.forEach((itm) => {
        itm.pageNo = pageNo;
        for (let item of options2.value) {
          if (String(item.value) === String(itm.content)) {
            itm.contentTxt = item.label;
            return false;
          }
        }
      });
      state.tableData1 = datas;
    };
    getTableDate();
    const handelChangePage1 = (page, pageSize) => {
      state.currentPage1 = page;
      state.pageSize1 = pageSize;
      getTableDate();
    };
    const handleSearch1 = () => {
      getTableDate();
    };
    const handleRest1 = () => {
      state.projectName = "";
      state.name = "";
      state.createName = "";
      state.auditStatus = null;
      state.categoryId = null;
      state.projectTime = "";
      getTableDate();
    };

    const handleSucessStu = (itm) => {
      console.log(itm);
      state.studentId = itm.studentId;
      state.studentItem = itm;

      state.agreereject_hs = true;
      state.agreestudy_hs = true;
    };
    const handleRejectStu = (itm) => {
      console.log(itm);
      state.studentId = itm.studentId;
      state.studentItem = itm;

      state.agreereject_hs = true;
      state.rejectstudy_hs = true;
    };
    const handleDeleteStu = (itm) => {
      console.log(itm);
      state.studentId = itm.studentId;
      state.studentItem = itm;

      state.delete_hs = true;
      state.del_hs = true;
      state.del_hs_stu = true;
    };
    const handlJoinStu = (itm) => {
      console.log(itm);
      state.studentId = itm.studentId;
      state.studentItem = itm;

      state.rg_hs = true;
    };
    const handleOverStu = (itm) => {
      console.log(itm);
      state.studentId = itm.studentId;
      state.studentItem = itm;

      state.graduate_hs = true;
    };

    //快速选人 选中的数组
    const onSelectChange7 = (selectedRowKeys, item) => {
      console.log("selectedRowKeys changed: ", selectedRowKeys, item);
      state.selectedRowKeys7 = selectedRowKeys;
      if (selectedRowKeys.length) {
        state.piliang = true;
      } else {
        state.piliang = false;
      }
      // state.choosepeople = item.reverse();
      // console.log(item, "选中你了！", state.choosepeople);
      // selectedsHeight();
    };
    const handleAllJion = () => {
      console.log(111);
      if (state.piliang) {
        state.rg_hs = true;
      }
    };
    const handleAllover = () => {
      console.log(111);

      if (state.selectedRowKeys7.length === 0) {
        return;
      }

      handleStudent({
        offcoursePlanId: state.offcoursePlanId,
        score: "",
        studentIds: state.selectedRowKeys7,
        type: 2,
      }).then((res) => {
        console.log(res);
        getTableDate2();
      });
    };
    const handleAllSuc = () => {
      console.log(111);

      if (state.selectedRowKeys7.length === 0) {
        return;
      }

      handleStudent({
        offcoursePlanId: state.offcoursePlanId,
        score: "",
        studentIds: state.selectedRowKeys7,
        type: 3,
      }).then((res) => {
        console.log(res);
        getTableDate2();
      });
    };
    const handleAllReject = () => {
      console.log(111);

      if (state.selectedRowKeys7.length === 0) {
        return;
      }

      handleStudent({
        offcoursePlanId: state.offcoursePlanId,
        score: "",
        studentIds: state.selectedRowKeys7,
        type: 4,
      }).then((res) => {
        console.log(res);
        getTableDate2();
      });
    };

    const handleExportStu = () => {
      console.log(55533);
      console.log(state.offcoursePlanId);

      studentExport({
        pageNo: state.currentPage3,
        pageSize: state.pageSize3,
        // applyStatus: state.auditStatus,
        // evalStatus: state.categoryId,
        // name: state.projectName,
        // signStatus: state.name,
        // status: state.name,
        offcoursePlanId: state.offcoursePlanId,
      }).then((res) => {
        // 流文件？？？
        console.log("res33333");
        console.log(res);

        newFile(res.data.data);
      });
    };

    const showAssessment = () => {
      state.assessmentVisible = true;
    };
    const removePG = () => {
      console.log("11111");
      state.assessmentId = null;
      state.assessmentName = "";
      // state.isEvaluate = "0";
    };
    const getCheckedAss = (ass) => {
      console.log("ass");
      console.log(ass);
      state.assessmentId = ass.assessmentId;
      state.assessmentName = ass.name;
      state.assessment = ass;
      // state.assessment1 = null;
    };

    const rest = () => {
      options4CurName.value = "";
      options4CurId.value = "";
      state.teacher = null;
      state.teacherId = null;
    };
    const handleChangeTea1 = (val) => {
      console.log(787877);
      console.log(val);

      rest();
      getTea();
    };
    const handelChangePageTea1 = (page, pageSize) => {
      state.currentPageTea1 = page;
      state.pageSizeTea1 = pageSize;
      rest();
      getTea();
    };
    const handleChangeTea2 = (val) => {
      console.log(787877);
      console.log(val);
      options4CurName.value = val;
      rest();
      getTea();
    };
    const handelChangePageTea2 = (page, pageSize) => {
      state.currentPageTea2 = page;
      state.pageSizeTea2 = pageSize;
      rest();
      getTea();
    };

    //获取分类、场景、封面图、-----------字典配置-------------------------------
    const optionsUrl = ref([]);
    const getDictList = (param) => {
      let obj = {
        pageNo: 1,
        pageSize: 10000,
        setCode: param,
      };
      api1
        .getDict(obj)
        .then((res) => {
          console.log("获取字典成功", res);
          if (res.data.code === 200) {
            if (param === "faceclassPic") {
              let arr = res.data.data.rows;
              let newArr = [];
              arr.forEach((item) => {
                newArr.push({
                  value: item.dictValue,
                  label: item.dictName,
                });
              });
              optionsUrl.value = newArr;
              // if (res.data.data.rows.length > 0) {
              //   state.imageUrl = res.data.data.rows[0].dictValue;
              // }
            }
            if (param === "faceclassClass") {
              let arr = res.data.data.rows;
              let newArr = [];
              arr.forEach((item) => {
                newArr.push({
                  value: item.dictCode,
                  label: item.dictName,
                });
              });
              options2.value = newArr;
            }
            if (param === "faceclassScene") {
              let arr = res.data.data.rows;
              let newArr = [];
              arr.forEach((item) => {
                newArr.push({
                  value: item.dictCode,
                  label: item.dictName,
                });
              });
              options3.value = newArr;
            }
          }
        })
        .catch((err) => {
          console.log("获取字典失败", err);
        });
    };
    getDictList("faceclassClass");
    getDictList("faceclassScene");
    getDictList("faceclassPic");
    //获取分类、场景、封面图、----------------字典配置---------------------------

    //渲染学员管理操作
    const getTableDate2 = async () => {
      // let data2 = state.tableData7;
      let obj = {
        pageNo: state.currentPage3,
        pageSize: state.pageSize3,
        offcoursePlanId: state.offcoursePlanId,
        name: state.xygl_inputV1,
      };
      // console.log("获取学员信息", obj);
      let res = await studentList(obj);
      // console.log("获取学员列表", res);
      const { rows, total, pageNo } = res.data.data;
      state.tableDataTotal3 = total;

      for (let i = 0; i < rows.length; i++) {
        rows[i].num = i + 1 + (state.currentPage3 - 1) * 10;
      }
      rows.forEach((item, index) => {
        rows[index] = {
          ...item,
          ...item.userInfoBo,
        };
      });
      const data2 = traverseArr(
        rows,
        {
          key: "studentId",
          num: "num",
          name: "name",
          number: "studentId",
          department: "deptName",
          postion: "jobName",
          band: "userAutograph",
          status: "applyStatus",
          join: "source",
          signstatus: "signStatus",
          evastatus: "evalStatus",
          overstatus: "status",
        },
        true
      );
      data2.forEach((itm) => {
        itm.pageNo = pageNo;
      });
      state.tableData7 = data2;
    };
    getTableDate2();
    // 渲染开课操作

    const handleSearchTable2 = () => {
      console.log(7878);
      getTableDate33();
    };
    const handleSearchTable3 = () => {
      console.log(7878);
      getTableDate333();
    };
    const getTableDate33 = async () => {
      // let datas = state.tableData2;
      // let res = await listReview({
      //   pageNo: state.currentPage22,
      //   pageSize: state.pageSize22,
      //   auditStatus: state.gl_selectV1,
      //   name: state.gl_inputv1,
      // });
      // const { rows, total } = res.data.data;
      // state.tableDataTotal22 = total;
      // const datas = traverseArr(
      //   rows,
      //   {
      //     key: "offcourseId",
      //     projectName: "projectName",
      //     numb: "assessmentName",
      //     applytime: "createTime",
      //     signtime: "publishTime",
      //     status: "auditStatus",
      //   },
      //   true
      // );
      // state.tableData2 = datas;
    };
    // 渲染开课操作
    const getTableDate333 = async () => {
      // let datas = state.tableData2;
      // let res = await studyRecordList({
      //   pageNo: state.currentPage222,
      //   pageSize: state.pageSize222,
      //   name: state.gl_selectV1,
      //   status: state.gl_inputv1,
      // });
      // const { rows, total } = res.data.data;
      // state.tableDataTotal222 = total;
      // const datas = traverseArr(
      //   rows,
      //   {
      //     key: "offcourseId",
      //     projectName: "projectName",
      //     numb: "assessmentName",
      //     applytime: "createTime",
      //     signtime: "publishTime",
      //     status: "auditStatus",
      //   },
      //   true
      // );
      // state.tableData2 = datas;
    };
    // 渲染开课操作
    const getTableDate3 = async () => {
      // let datas = state.tableData6;
      let obj = {
        pageNo: state.currentPage222,
        pageSize: state.pageSize222,
        createName: state.kk_inputV1,
        teacher: state.kk_inputV2,
        beginTime: parseInt(new Date(state.selectTime).getTime() / 1000),
        offcourseId: state.offcourseId,
      };
      console.log("获取开课", obj);
      let res = await planList(obj);
      console.log("开课res", res);
      const { rows, total, pageNo } = res.data.data;
      state.tableDataTotal222 = total;

      for (let i = 0; i < rows.length; i++) {
        rows[i].num = i + 1 + (state.currentPage222 - 1) * 10;
      }
      const datas = traverseArr(
        rows,
        {
          key: "offcoursePlanId",
          num: "num",
          organization: "name",
          address: "address",
          starttime: "beginTime",
          createtime: "createTime",
        },
        true
      );
      datas.forEach((itm) => {
        itm.pageNo = pageNo;
      });
      state.tableData6 = datas;
    };

    const options1 = ref([
      {
        value: 0,
        label: "未提交",
      },
      {
        value: 1,
        label: "待审核",
      },
      {
        value: 2,
        label: "已审核",
      },
      {
        value: -1,
        label: "审核未通过",
      },
    ]);
    const options2 = ref([
      // {
      //   value: "value2",
      //   label: "请选择内容分类",
      // },
      // {
      //   value: "leadership",
      //   label: "领导力",
      // },
      // {
      //   value: "ingeneral",
      //   label: "通用力",
      // },
      // {
      //   value: "profession",
      //   label: "专业力",
      // },
    ]);
    const options3 = ref([]);
    const options4 = ref([
      // {
      //   value: "profession",
      //   label: "专业力",
      // },
    ]);
    const options4CurId = ref("");
    const options4CurName = ref("张");
    const of_hShow = () => {
      getTea();
      if (state.of_hs == false) {
        state.of_hs = true;
      }
    };
    const of_exit1 = () => {
      state.of_hs = false;
      state.valueE1 = "";
      state.valueE2 = "";
      state.xzinputV1 = "";
      state.hideshow = true;
      rest();
    };
    const of_exit = () => {
      state.of_hs = false;
      state.valueE1 = "";
      state.valueE2 = "";
      state.hideshow = true;
    };
    const hideShow = () => {
      if (state.hideshow == true) {
        state.hideshow = false;
      } else {
        state.hideshow = true;
      }
    };
    const bs_hShow = (value) => {
      state.bs_hs = true;
      if (value != "") {
        state.valueE1 = "";
      }
    };
    const createft = () => {
      if (state.bs_hs == false && state.valueE1 != "") {
        state.of_hs = false;
        state.ft_hs = true;
        state.valueE1 = "";
        state.teacher = "";
        state.teacherName = "";
        state.qdms_inputV1 = state.xzinputV1;
        state.xzinputV1 = "";
        getDictList("faceclassPic");
        getTea();
      }
      if (state.bs_hs && state.valueE1 != "") {
        state.addOnlineCoursevisible = true;
      }
    };
    const checkVal = (checkList) => {
      let count = 0;
      for (const keyName of checkList) {
        if (!keyName) {
          count++;
        }
      }
      return count ? false : true;
    };
    const ft_exit_1 = () => {
      state.ft_hs = false;
      router.go(0);
    };
    const ft_exit = () => {
      state.ft_eidt = false;
      state.hideshow = true;

      state.offcourseId = null;
      state.statusJuJue = 0;
      state.statusTingQi = 1;
      state.qdms_inputV1 = "";
      state.imageUrl = "";
      state.qdms_inputV2 = "";
      state.qdms_inputV3 = "";
      state.fen_lei = null;
      state.feng_mian_1 = null;
      state.feng_mian_2 = null;
      state.chang_jin = null;
      state.tags_val = [];
      state.qdms_inputV5 = null;
      state.qdms_inputV6 = "";
      state.imgList = [];
      valueHtml.value = "";
      state.fileList = [];
    };
    // 关闭查看
    const handlelookMs = () => {
      state.lookMs = false;
    };

    //保存面授课
    const handlePush = (param) => {
      let files = "";
      if (state.imgList.length) {
        state.imgList.forEach((item) => {
          files += item.img + ",";
        });
      }
      files = files.slice(0, files.length - 1);
      console.log("filesfiles", files);
      const postData = {
        offcourseId: state.offcourseId, //不传代表新增
        name: state.qdms_inputV1,
        // picUrl: state.imageUrl,
        picUrl: state.feng_mian_1,
        targetUser: state.qdms_inputV2,
        meaning: state.qdms_inputV3,
        categoryId: state.fen_lei,
        sceneId: state.chang_jin,
        tips: state.tags_val ? state.tags_val.join(",") : null,
        teacherId: state.member.value,
        teacher: state.member.name,
        intro: state.qdms_inputV6,
        attach: files,
        outline: valueHtml.value,
        //teacherId:state.teacherId ,
      };
      console.log("===", state.teacherId, "hha", state.qdms_inputV5);
      console.log("postData");
      console.log(postData);
      const checkList = [
        postData.name,

        postData.targetUser,
        postData.categoryId,
        postData.teacherId,
      ];
      if (!checkVal(checkList)) {
        message.destroy();
        return message.error("请输入必填项");
      } else {
        state.addLoading = true;
      }

      edit(postData).then((res) => {
        if (res.data.code === 200) {
          getTableDate();
          // ft_exit_1();
          rest();
          state.addLoading = false;

          state.statusTingQi = 1;
          // console.log("res.data", res.data);
          if (param === "review") {
            //新建时点击审核按钮
            submitReview(res.data.data.offcourseId);
          }
        }
      });
    };
    const om_exit = () => {
      state.om_1 = false;
      state.faceManageTab = "1";
    };
    const ckxq_hs = () => {
      state.om_ckxq = true;
    };
    const ftsr_exit = () => {
      state.om_ckxq = false;
    };
    const stm_exit = () => {
      state.stm_hs = false;
      handleRestTable();
    };
    const createkk = () => {
      state.offcoursePlanId = null;
      state.member = {};
      state.cstm_hs = true;
    };
    const handleCancelStu = () => {
      state.cstm_hs = false;
      state.filesList = [];

      state.kk_eidt = false;
      state.xjkkradioV1 = "";
      state.completeType = "";
      state.xjkkinputV1 = "";
      state.xjkkinputV2 = "";
      state.xjkkinputV3 = "";
      state.xjkkinputV4 = null;
      state.checked1 = false;
      state.checked4 = false;
      removePG();
    };
    //保存开课
    const handleSureStu = () => {
      let startTime,
        endTime = 0;
      if (state.xjkkinputV3) {
        startTime = parseInt(state.xjkkinputV3[0].$d.getTime() / 1000);
        endTime = parseInt(state.xjkkinputV3[1].$d.getTime() / 1000);
      }
      let t = state.signCom ? "1," : "0,";
      let p = state.comLeave ? "1" : "0";
      let type = t.concat(p);
      const postData = {
        offcourseId: state.offcourseId,
        offcoursePlanId: state.offcoursePlanId, //开课ID,不传代表新增

        address: state.xjkkinputV2,
        applyFlag: state.checked1 ? 1 : 0,
        attach: state.filesList.length ? state.filesList.join(",") : "",
        beginTime: startTime,
        completeType: type,
        endTime: endTime,
        evalFlag: state.checked4 ? 1 : 0,
        evaluateId: Number(state.assessmentId),
        name: state.xjkkinputV1,
        signFlag: state.xjkkradioV1 === 0 ? 1 : 0, //是否允许未报名的签到:1是0否
        // signWordFlag: state.xjkkradioV1 === 1 ? 1 : 0, //签到是否需要口令:1是0否
        teacherId: state.member.value,
        teacher: state.member.name,
      };
      console.log(postData);
      const checkList = [
        postData.name,
        postData.address,
        postData.beginTime,
        postData.endTime,
        postData.teacherId,
      ];
      if (!checkVal(checkList)) {
        message.destroy();
        return message.error("请输入必填项");
      } else {
        state.addLoading = true;
        console.log("state.addLoading ", state.addLoading);
      }
      editPlan(postData).then((res) => {
        if (res.data.code === 200) {
          getTableDate3();
          handleCancelStu();
          rest();
        }
      });
      state.addLoading = false;
    };
    //编辑开课
    const handelEditStu = async (itm) => {
      console.log(itm);

      state.offcourseId = itm.offcourseId;
      state.offcoursePlanId = itm.offcoursePlanId;

      const item = await detailPlan({
        offcoursePlanId: Number(state.offcoursePlanId),
      }).then((res) => {
        if (res.data.code === 200) return res.data.data;
      });

      let obj = {
        assessmentId: item.evaluateId,
      };
      api
        .queryAppraiseDetailById(obj)
        .then((res) => {
          state.assessmentName = res.data.data.assessmentName;
        })
        .catch();

      console.log("res");
      console.log(item);

      state.xjkkinputV2 = item.address;
      state.checked1 = item.applyFlag === 1 ? true : false;
      state.filesList = item.attach ? item.attach.split(",") : [];
      state.xjkkinputV3 = [
        dayjs(item.beginTime, "YYYY-MM-DD HH:mm"),
        dayjs(item.endTime, "YYYY-MM-DD HH:mm"),
      ];
      options4CurId.value = item.teacherId;
      // (state.regisCom = item.completeType.split(",")[0] == "1" ? true : false),
      (state.signCom = item.completeType.split(",")[0] == "1" ? true : false),
        (state.comLeave =
          item.completeType.split(",")[1] == "1" ? true : false),
        (state.checked4 = item.evalFlag === 1 ? true : false);
      state.assessmentId = String(item.evaluateId);
      state.xjkkinputV1 = item.name;
      if (item.signFlag === 1) {
        //是否允许未报名的签到:1是0否
        state.xjkkradioV1 = 0;
      }
      /*
      if (item.signWordFlag === 1) {
        //签到是否需要口令:1是0否
        state.xjkkradioV1 = 1;
      }
      if (item.signFlag === 0 && item.signWordFlag === 0) {
        state.xjkkradioV1 = "";
      }
      */
      state.member = { value: item.teacherId, name: item.teacher };

      state.cstm_hs = true;
      state.kk_eidt = true;
    };
    const handelGuan = (itm) => {
      console.log(676766);
      state.offcourseId = itm.offcourseId;
      state.offcoursePlanId = itm.offcoursePlanId;
      state.studentId = itm.studentId;
      state.studentItem = itm;

      state.currentPlanItem = itm;
      state.newCourseName = itm.name;
      console.log(89877766666);
      console.log(state.currentPlanItem);

      state.sm_hs = true;
      getTableDate2();
    };
    const sm_exit = () => {
      state.sm_hs = false;
      state.hideshow = true;

      state.tableData7 = [];
    };
    const clear_valueE1 = (value) => {
      state.bs_hs = false;
      if (value != "") {
        state.valueE1 = "";
      }
    };
    const clear_valueE2 = () => {
      state.valueE2 = "";
    };
    const clear_xjkkradioV1 = (value) => {
      if (value != "") {
        state.xjkkradioV1 = "";
      }
    };
    const clear_xjkkradioV2 = (value) => {
      if (value != "") {
        state.xjkkradioV2 = "";
      }
    };
    const clear_jyradioV1 = (value) => {
      if (value != "") {
        state.jyradioV1 = "";
      }
    };
    const qr_exit = () => {
      state.QR_hs = false;
      state.qrQR_hs = false;
      state.olQR_hs = false;
      state.ftQR_hs = false;
      state.ftsQR_hs = false;
      state.vipftQR_hs = false;
      state.addLoading = false;
    };
    const rg_exit = () => {
      state.rg_hs = false;
      state.addLoading = false;
    };
    const graduate_exit = () => {
      state.graduate_hs = false;
      state.addLoading = false;
    };
    const agreereject_exit = () => {
      state.agreereject_hs = false;
      state.agreestudy_hs = false;
      state.rejectstudy_hs = false;
      state.addLoading = false;
    };
    const delete_exit1 = () => {
      state.delete_hs = false;
      state.del_hs = false;
      state.del_hs_stu = false;
      state.copy_hs = false;
      state.nouse_hs = false;
      state.rg_hs = false;
      state.graduate_hs = false;
      state.addLoading = false;
    };
    const handleRejectExit = (itm, type) => {
      if (type === "1") {
        return;
      }
      state.offcourseId = itm.offcourseId;

      handle({
        offcourseId: state.offcourseId,
        type: 0,
      }).then((res) => {
        if (res.data.code === 200) {
          getTableDate();
        }
      });
    };

    const handleJoin = async () => {
      if (state.rg_hs) {
        if (state.piliang) {
          handleStudent({
            offcoursePlanId: state.offcoursePlanId,
            score: state.lrcj_inputV1,
            studentIds: state.selectedRowKeys7,
            type: 1,
          });
          getTableDate2();
          delete_exit1();
        } else {
          handleStudent({
            offcoursePlanId: state.offcoursePlanId,
            score: state.lrcj_inputV1,
            studentIds: [state.studentId],
            type: 1,
          }).then((res) => {
            if (res.data.code === 200) {
              getTableDate2();
              delete_exit1();
            }
          });
        }
      }
    };
    const handleJie = async () => {
      if (state.graduate_hs) {
        handleStudent({
          offcoursePlanId: state.offcoursePlanId,
          score: "",
          studentIds: [state.studentId],
          type: 2,
        }).then((res) => {
          if (res.data.code === 200) {
            getTableDate2();
            delete_exit1();
          }
        });
      }
    };
    //确认复制
    const handleAgreeTrue = async () => {
      if (state.agreestudy_hs) {
        handleStudent({
          offcoursePlanId: state.offcoursePlanId,
          score: "",
          studentIds: [state.studentId],
          type: 3,
        }).then((res) => {
          if (res.data.code === 200) {
            getTableDate2();
            delete_exit1();
            state.addLoading = false;
          }
        });
      }
      if (state.rejectstudy_hs) {
        handleStudent({
          offcoursePlanId: state.offcoursePlanId,
          score: "",
          studentIds: [state.studentId],
          type: 4,
        }).then((res) => {
          if (res.data.code === 200) {
            getTableDate2();
            delete_exit1();
          }
        });
      }
    };
    //确认复制课程
    const handleDeleteExit = async () => {
      state.addLoading = true;

      if (state.del_hs) {
        console.log(11111111);
        if (state.offcourseId && state.offcoursePlanId && state.studentId) {
          console.log(111111);
          handleStudent({
            offcoursePlanId: state.offcoursePlanId,
            score: "",
            studentIds: [state.studentId],
            type: 5,
          }).then((res) => {
            if (res.data.code === 200) {
              getTableDate2();
              delete_exit1();
            }
          });
        } else if (state.offcourseId && state.offcoursePlanId) {
          console.log(2222222);
          deletePlan({
            offcoursePlanId: state.offcoursePlanId,
          }).then((res) => {
            if (res.data.code === 200) {
              getTableDate3();
              delete_exit1();
            }
          });
        } else if (state.offcourseId) {
          console.log(3333333);
          handle({
            offcourseId: state.offcourseId,
            type: -1,
          }).then((res) => {
            if (res.data.code === 200) {
              getTableDate();
              delete_exit1();
            }
          });
        }
      }
      if (state.copy_hs) {
        console.log(2222222);
        if (state.offcourseId && state.offcoursePlanId) {
          console.log(87887);
          // 拿数据
          const item = await detailPlan({
            offcoursePlanId: Number(state.offcoursePlanId),
          }).then((res) => {
            if (res.data.code === 200) return res.data.data;
          });
          const obj = {
            offcourseId: item.offcourseId,
            offcoursePlanId: null, //开课ID,不传代表新增

            address: item.address,
            applyFlag: item.applyFlag,
            attach: item.attach,
            beginTime: new Date(item.beginTime) / 1000,
            completeType: item.completeType,
            endTime: new Date(item.endTime) / 1000,
            evalFlag: item.evalFlag,
            name: item.name,
            signFlag: item.signFlag, //是否允许未报名的签到:1是0否
            //signWordFlag: item.signWordFlag, //签到是否需要口令:1是0否
            teacherId: item.teacherId,
            teacher: item.teacher,
          };
          console.log(obj);
          editPlan(obj).then((res) => {
            if (res.data.code === 200) {
              getTableDate3();
              delete_exit1();
              rest();
            }
          });
        } else if (state.offcourseId) {
          console.log(87887);
          // 拿数据
          const item = await detail({
            offcourseId: Number(state.offcourseId),
          }).then((res) => {
            if (res.data.code === 200) return res.data.data;
          });
          const postData = {
            offcourseId: null, //不传代表新增
            name: item.name,
            picUrl: item.picUrl,
            targetUser: item.targetUser,
            meaning: item.meaning,
            categoryId: item.categoryId,
            sceneId: item.sceneId,
            tips: item.tips,
            teacherId: item.teacherId, //?
            intro: item.intro,
            attach: item.attach,
            outline: item.outline,
            teacher: item.teacher,
          };
          edit(postData).then((res) => {
            if (res.data.code === 200) {
              getTableDate();
              delete_exit1();
              rest();
            }
          });
        }
      }
      if (state.nouse_hs) {
        console.log(3333333333);
        if (state.offcourseId) {
          console.log(87887);
          handle({
            offcourseId: state.offcourseId,
            type: -2,
          }).then((res) => {
            if (res.data.code === 200) {
              getTableDate();
              delete_exit1();
            }
          });
        }
      }
    };
    const handleDeleteKaike = (value) => {
      state.offcoursePlanId = value.offcoursePlanId;

      state.delete_hs = true;
      state.del_hs = true;
    };
    const onSelectChange = (selectedRowKeys) => {
      console.log("selectedRowKeys changed: ", selectedRowKeys);
      state.selectedRowKeys = selectedRowKeys;
    };

    const faceManageChange = (e) => {
      state.faceManageTab = e;
    };

    const openMessage = () => {
      let startTime = "";
      let endTime = "";
      if (state.projectTime) {
        startTime = parseInt(
          new Date(state.projectTime[0].$d).getTime() / 1000
        );
        endTime = parseInt(new Date(state.projectTime[1].$d).getTime() / 1000);
      }
      exportP({
        pageNo: state.currentPage1,
        pageSize: state.pageSize1,
        auditStatus: state.auditStatus,
        categoryId: state.categoryId,
        projectName: state.projectName,
        name: state.name,
        createName: state.createName,
        endTime: endTime,
        beginTime: startTime,
      }).then((res) => {
        if (res.data.code === 200) {
          message.success("导出成功");
        }
      });
    };
    //获取教师
    const getTea = async () => {
      options4CurName.value = state.teacher;
      options4CurId.value = state.teacherId;
      const item1 = await getMemberInfoApi({
        pageNo: state.currentPageTea1,
        pageSize: state.pageSizeTea1,
        keyWord: options4CurName.value,
        id: options4CurId.value ? options4CurId.value : null,
      })
        .then((res) => {
          console.log("获取授课教师", res);
          if (res.data.code === 200) return res.data.data;
        })
        .catch((err) => {
          console.log("获取授课教师失败", err);
        });
      const { rows, total } = item1;
      state.tableDataTotalTea1 = total;
      state.tableDataTotalTea2 = total;
      let newArr = [];
      for (let item of rows) {
        if (options4CurId.value === item.id) {
          if (state.offcoursePlanId && state.offcourseId) {
            options4CurName.value = item.realName;
            state.xjkkinputV4 = item.realName;
            state.teacherId = item.id;
          } else if (state.offcourseId) {
            options4CurName.value = item.realName;
            state.qdms_inputV5 = item.realName;
            state.teacher = item.realName;
            state.teacherId = item.id;
            console.log("那个老师", item);
          }
        }
        newArr.push({
          value: item.id,
          label: item.realName,
        });
      }
      options4.value = newArr;
      console.log("options4.value");
      console.log(options4.value);
    };
    //编辑面授课
    const handleEdit = async (itm, type) => {
      console.log(45555);
      console.log(itm);
      if (type === "1") {
        return;
      }
      state.offcourseId = itm.offcourseId;

      const item = await detail({
        offcourseId: Number(state.offcourseId),
      }).then((res) => {
        if (res.data.code === 200) return res.data.data;
      });

      state.statusJuJue = Number(item.auditStatus) === -1 ? 1 : 0;

      if (Number(item.auditStatus) === 2 && Number(item.status) === 1) {
        state.statusTingQi = 1;
      }
      if (Number(item.auditStatus) === 2 && Number(item.status) === 0) {
        state.statusTingQi = 0;
      }

      state.qdms_inputV1 = item.name;
      // state.imageUrl = item.picUrl;
      state.feng_mian_1 = item.picUrl;
      state.qdms_inputV2 = item.targetUser;
      state.qdms_inputV3 = item.meaning;
      state.fen_lei = String(item.categoryId);
      state.chang_jin = String(item.sceneId);
      state.tags_val = item.tips ? item.tips.split(",") : [];
      //state.qdms_inputV5 = item.teacherId;
      state.teacher = item.teacher;
      state.teacherId = item.teacherId;
      state.qdms_inputV6 = item.intro;
      state.member = { value: item.teacherId, name: item.teacher };
      if (item.attach == "") {
        state.imgList = [];
      } else {
        if (item.attach.indexOf(",")) {
          const arr = item.attach.split(",");
          arr.forEach((item) => {
            state.imgList.push({ img: item });
          });
        } else {
          state.imgList = [{ img: item.attach }];
        }
      }

      valueHtml.value = item.outline;

      state.ft_hs = true;
      state.ft_eidt = true;
      getTea();
    };

    // handleTagChange
    const handleTagChange = () => {
      if (state.tags_val_single) {
        state.tags_val.push(state.tags_val_single);
      }
      state.tags_val_single = "";
    };
    const handleTagClose = (index) => {
      state.tags_val.splice(index, 1);
    };

    // 预览弹框 开启和关闭
    const ft_exit_see = () => {
      state.lookCourseModal = false;
    };
    const handleLook = async (itm, type) => {
      if (type === "1") {
        return;
      }
      state.offcourseId = itm.offcourseId;

      const item = await detail({
        offcourseId: Number(state.offcourseId),
      }).then((res) => {
        if (res.data.code === 200) return res.data.data;
      });
      state.lookCourseModal = true;
      item.attach = item.attach == "" ? [] : item.attach.split(",");
      state.faceDetailObj = item;
    };
    // const handleTea = async () => {
    //   console.log("item22224444");
    //   // const item = await getMemberInfo({
    //   //   pageNo: state.pageSizeTea1,
    //   // }).then((res) => {
    //   //   if (res.data.code === 200) return res.data.data;
    //   //   console.log("item2222222");
    //   //   console.log(item);
    //   // });
    // };
    const handleDelete = (item, type) => {
      console.log(item);
      if (type === "1") {
        return;
      }
      state.offcourseId = item.offcourseId;

      state.delete_hs = true;
      state.del_hs = true;
    };
    const handleCopy = async (itm, type) => {
      console.log(itm);
      if (type === "1") {
        return;
      }
      state.offcourseId = itm.offcourseId;

      state.delete_hs = true;
      state.copy_hs = true;
    };
    const handleCopyP = async (itm) => {
      console.log(itm);
      state.offcourseId = itm.offcourseId;
      state.offcoursePlanId = itm.offcoursePlanId;

      state.delete_hs = true;
      state.copy_hs = true;
    };
    const handleStop = async (itm, type) => {
      console.log(itm);
      if (type === "1") {
        return;
      }
      state.offcourseId = itm.offcourseId;

      state.delete_hs = true;
      state.nouse_hs = true;
    };
    const handleOpen = async (itm, type) => {
      console.log(itm);
      if (type === "1") {
        return;
      }
      state.offcourseId = itm.offcourseId;

      handle({
        offcourseId: state.offcourseId,
        type: 2,
      }).then((res) => {
        if (res.data.code === 200) {
          getTableDate();
        }
      });
    };
    const handleStart = (item, type) => {
      console.log(item);
      if (type === "1") {
        return;
      }
      state.offcourseId = item.offcourseId;
      state.newCourseName = item.name;
      getTableDate3();

      state.stm_hs = true;
    };

    const handelChangePage222 = (page, pageSize) => {
      state.currentPage222 = page;
      state.pageSize222 = pageSize;
      getTableDate333();
    };
    const handelChangePage22 = (page, pageSize) => {
      state.currentPage22 = page;
      state.pageSize22 = pageSize;
      getTableDate33();
    };
    const handelChangePage2 = (page, pageSize) => {
      state.currentPage2 = page;
      state.pageSize2 = pageSize;
      getTableDate3();
    };
    const handleSearchTable = () => {
      console.log("handleSearchTable");
      console.log(state.kk_inputV1);
      console.log(state.kk_inputV2);
      console.log(state.selectTime);
      getTableDate3();
    };
    const handleRestTable = () => {
      state.kk_inputV1 = "";
      state.kk_inputV2 = "";
      state.selectTime = "";
      getTableDate3();
    };

    const handelChangePage3 = (page, pageSize) => {
      state.currentPage3 = page;
      state.pageSize3 = pageSize;
      getTableDate2();
    };
    const handleSearchStu = () => {
      console.log(state.xygl_inputV1);
      getTableDate2();
    };
    const handleRestStu = () => {
      state.xygl_inputV1 = "";
      getTableDate2();
    };

    const beforeUpload3 = (file) => {
      const fileType = [
        "jpg",
        "jpeg",
        "png",
        "gif",
        "pdf",
        "ppt",
        "pptx",
        "doc",
        "docx",
        "xls",
        "xlsx",
        "zip",
      ];
      if (!fileType.includes(file.name.split(".")[1])) {
        message.error(
          "仅支持.pdf,.ppt,.pptx,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png,.gif,.zip格式!"
        );
        return false;
      }

      const formData = new FormData();
      formData.append("file", file);
      console.log(file);
      fileUp(formData).then((res) => {
        if (res.data.code === 200) {
          // state.filesList.push({
          //   img: res.data.data,
          //   name: file.name,
          //   size: file.size,
          // });
          // console.log(state.filesList);
          state.filesList = [res.data.data];
          // state.hasImgName = res.data.data;
        }
      });
      return false;
    };

    const handleGuan22 = (item) => {
      console.log(787666);
      getTableDate33();
      getTableDate333();
      state.newCourseName = item.name;
    };

    const handlePostSure = (obj) => {
      console.log("处理后参数，直接解构使用");
      console.log(obj);

      addStudent({
        offcourseId: Number(state.offcourseId),
        offcoursePlanId: Number(state.offcoursePlanId),
        ...obj,
      }).then((res) => {
        console.log(res);
        if (res.data.code === 200) {
          state.viewpowervisible = false;
          getTableDate2();
        }
      });
    };

    const getdateToDateFn = (val) => {
      return getdateToDate(val * 1000);
    };
    const getdateToTimeFn = (val) => {
      return getdateToTime(val * 1000);
    };

    //提交审核
    const reviewClick = () => {
      console.log("ft_eidt", state.ft_eidt);
      handlePush("review");
      /*
      if (state.ft_eidt) {
        //编辑面授课
        submitReview();
      }
      if (!state.ft_eidt) {
        //shouke
        handlePush("review");
      }
      */
    };
    const submitReview = (id) => {
      state.addLoading = true;

      if (id == "") {
        return message.error("请先完成保存");
      }
      let obj = {
        offcourseId: id ? id : state.offcourseId,
        type: 1,
      };
      console.log("提交审核参数", obj);
      handle(obj).then((res) => {
        console.log("提交审核成功", res.data);
        if (res.data.code === 200) {
          ft_exit_1();
          rest();
          getTableDate();
          state.addLoading = false;
        }
      });
    };

    //授权
    //权限名单
    const showPrower = (record) => {
      // console.log("record", record);
      state.selectCourseId = record.offcourseId;
      state.corpowerlistvisible = true;
    };
    //归属权
    const showOwnPrower = (record) => {
      // console.log("record", record);
      state.selectCourseId = record.offcourseId;
      state.ownpowervisible = true;
    };
    //查看权
    const showViewPrower = (record) => {
      // console.log("record", record);
      state.selectCourseId = record.offcourseId;
      state.authClassify = 1;
      state.viewpowervisible = true;
    };
    //管理权
    const showManagePrower = (record) => {
      // console.log("record", record);
      console.log(22222222);
      console.log(record);
      state.selectCourseId = record.offcourseId;
      state.shipType = 1;
      state.authClassify = 2;
      state.viewpowervisible = true;
    };
    //添加权限
    watch(
      () => state.addAuthList,
      (res) => {
        console.log("res", res, state.addAuthList);
        if (state.authClassify === 1 || state.authClassify === 2) {
          let obj = {
            type: 3,
            tag:
              state.authClassify === 1
                ? 3
                : state.authClassify === 2
                ? 4
                : null,
            opt: 3,
            deptList: res[1],
            groupList: res[2],
            refId: state.selectCourseId,
            pageNo: 20,
            pageSize: 1,
            studentList: res[0],
            keyWord: "",
          };
          console.log("obj", obj);
          api1
            .optionAuthPerm(obj)
            .then((res) => {
              console.log("添加授权成功", res);
              message.success("添加授权成功");
            })
            .catch((err) => {
              console.log("添加授权失败", err);
            });
        }
      }
    );

    //添加学员
    watch(
      () => state.addAuthList,
      (res) => {
        console.log("res", res, state.addStudentList);
        if (state.authClassify === 3) {
          let obj = {
            deptList: res[1],
            groupList: res[2],
            offcourseId: state.offcourseId,
            offcoursePlanId: state.offcoursePlanId, //开课id
            studentList: res[0],
          };
          console.log("obj", obj);
          api1
            .addStudentCourse(obj)
            .then((res) => {
              console.log("添加学员成功", res);
              message.success("添加学员成功");
              getTableDate2();
            })
            .catch((err) => {
              console.log("添加学员失败", err);
            });
        }
      }
    );

    const closeOnlineCoursevisible = () => {
      console.log("执行");
      getTableDate();
    };
    return {
      ...toRefs(state),
      getdateToDateFn,
      moment,
      getdateToTimeFn,
      handlePostSure,
      handleDeleteKaike,
      handleDel2,
      handelEditStu,
      handelGuan,
      beforeUpload3,
      handleSearchStu,
      handleRestStu,
      handelChangePage2,
      handelChangePage22,
      handelChangePage222,
      handelChangePage3,
      handleSearchTable,
      handleRestTable,
      handleSearchTable2,
      handleSearchTable3,
      handleGuan22,
      handleStart,
      handleCopyP,
      handleCopy,
      handleStop,
      handleOpen,
      handleEdit,
      handleDelete,
      columns1,
      columns2,
      columns4,
      columns6,
      columns7,
      options1,
      options2,
      options3,
      options4,
      optionsUrl,
      of_hShow,
      of_exit1,
      of_exit,
      hideShow,
      bs_hShow,
      createft,
      ft_exit,
      ft_exit_1,
      om_exit,
      ckxq_hs,
      ftsr_exit,
      stm_exit,
      ft_exit_see,
      handleTagChange,
      handleTagClose,
      createkk,
      handleCancelStu,
      handleSureStu,
      sm_exit,
      clear_valueE1,
      clear_valueE2,
      clear_xjkkradioV1,
      clear_xjkkradioV2,
      clear_jyradioV1,
      qr_exit,
      rg_exit,
      graduate_exit,
      agreereject_exit,
      delete_exit1,
      handleRejectExit,
      handleAgreeTrue,
      handleJoin,
      handleJie,
      handleDeleteExit,
      onSelectChange,
      faceManageChange,
      openMessage,
      showStuAdd,

      editorRef,
      valueHtml,
      mode: "simple", // 或 'simple'
      toolbarConfig,
      editorConfig,
      handleCreated,
      handelChangePage1,
      handleSearch1,
      handleRest1,
      showAssessment,
      removePG,
      getCheckedAss,
      beforeUpload,
      beforeUpload2,
      handleDel,
      handlePush,
      handleSucessStu,
      handleRejectStu,
      handleDeleteStu,
      handlJoinStu,
      handleOverStu,
      onSelectChange7,
      handleAllJion,
      handleAllover,
      handleAllSuc,
      handleAllReject,
      handleExportStu,
      handleChangeTea1,
      handelChangePageTea1,
      handleChangeTea2,
      handelChangePageTea2,
      submitReview,
      reviewClick,

      showPrower,
      showOwnPrower,
      showViewPrower,
      showManagePrower,

      closeOnlineCoursevisible,
      handlelookMs,
      handleLook,
    };
  },
});
</script>
<style lang="scss">
.aeLoading {
  z-index: 10000;
}

.courseManage {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;

  .headerf {
    .filter {
      margin-left: 38px;
      margin-right: 38px;
      margin-top: 30px;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;

      .filterItems {
        display: flex;
        flex-wrap: wrap;

        .fitems {
          margin-right: 20px;
          margin-bottom: 20px;
        }
      }
    }

    .btns {
      display: flex;
      margin-left: 38px;

      .btn {
        padding: 0px 26px 0px 26px;
        height: 38px;
        background: rgba(64, 158, 255, 0);
        border-radius: 8px;
        border: 1px solid rgba(64, 158, 255, 1);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 14px;
        flex-shrink: 0;
        cursor: pointer;

        .search {
          background-size: 100%;
        }

        .btnText {
          font-size: 14px;
          font-weight: 400;
          color: rgba(64, 158, 255, 1);
          line-height: 36px;
          margin-left: 5px;
        }
      }

      .btn1 {
        .search {
          width: 15px;
          height: 17px;
          background-image: url("../../assets/images/courseManage/search1.png");
        }
      }

      .btn2 {
        .search {
          width: 16px;
          height: 18px;
          background-image: url("../../assets/images/courseManage/reset1.png");
        }
      }

      .btn3 {
        .search {
          width: 17px;
          height: 18px;
          background-image: url("../../assets/images/coursewareManage/export.png");
        }
      }

      .btn4 {
        margin-right: 0px;

        .search {
          width: 17px;
          height: 18px;
          background-image: url("../../assets/images/courseManage/add1.png");
        }
      }

      .btn1:hover {
        background: rgba(64, 158, 255, 1);

        .search {
          background-image: url("../../assets/images/courseManage/search0.png");
        }

        .btnText {
          color: #ffffff;
        }
      }

      .btn2:hover {
        background: rgba(64, 158, 255, 1);

        .search {
          background-image: url("../../assets/images/courseManage/reset0.png");
        }

        .btnText {
          color: #ffffff;
        }
      }

      .btn3:hover {
        background: rgba(64, 158, 255, 1);

        .search {
          background-image: url("../../assets/images/coursewareManage/export1.png");
        }

        .btnText {
          color: #ffffff;
        }
      }

      .btn4:hover {
        background: rgba(64, 158, 255, 1);

        .search {
          background-image: url("../../assets/images/courseManage/add0.png");
        }

        .btnText {
          color: #ffffff;
        }
      }
    }
  }

  .tableBox {
    margin: 20px 38px 30px;

    .operation {
      display: flex;
      justify-content: center;
      align-items: center;
      color: #4ea6ff;

      .nselect {
        justify-content: center;
        align-items: center;
        display: flex;

        .jc {
          margin-left: 20px;
          cursor: pointer;
        }
      }

      .tableSelect {
        // margin-right: 10px;
        margin-left: -5px;
        display: flex;
        align-items: center;
        justify-content: right;
      }
    }

    .ynuse {
      display: flex;
      justify-content: center;
      align-items: center;

      .use {
        cursor: pointer;
      }
    }
  }
}

.selectonlineface {
  z-index: 999;
  width: 679px;
  background: #ffffff;
  box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
  position: absolute;
  left: 50%;
  top: -100%;
  transform: translate(-50%, -50%);

  .of_header {
    position: absolute;
    width: 100%;
    height: 40px;
    background: linear-gradient(
      rgba(78, 166, 255, 0.2) 0%,
      rgba(78, 166, 255, 0) 100%
    );
  }

  .of_main {
    width: 100%;
    position: relative;

    .ofm_header {
      display: flex;
      align-items: center;
      padding-top: 20px;
      padding-left: 26px;
      font-size: 16px;

      .add_icon {
        width: 16px;
        height: 16px;
        margin-right: 10px;
        background-image: url(@/assets/images/coursewareManage/add1.png);
        background-size: 100% 100%;
      }

      .close_exit {
        position: absolute;
        right: 42px;
        cursor: pointer;
        width: 20px;
        height: 20px;
        background-image: url(@/assets/images/coursewareManage/close.png);
        background-size: 100% 100%;
      }
    }

    .ofm_body {
      width: 80%;
      margin: 3px auto;

      .ofmb_items {
        display: flex;
        align-items: center;
        justify-content: end;
        margin: 14px auto;

        .signbox {
          width: 110px;
          display: flex;
          justify-content: end;

          .sign {
            width: 10px;
            height: 10px;
            margin-top: -3px;
            margin-right: 6px;
            background-size: 100% 100%;
          }
        }

        .b_input {
          flex: 1;
          position: relative;

          .inp_num {
            position: absolute;
            right: 10px;
            top: 10px;
          }
        }

        .bc_box {
          display: flex;
          width: 440px;
          flex: 1;

          .bc_boxl,
          .bc_boxr {
            display: flex;
            align-items: center;
          }
        }
      }

      .ol_checkbox {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 6px;
      }

      .b_sub {
        width: 440px;
        margin-left: 110px;

        .bs_header {
          display: flex;
          justify-content: space-between;

          .b_right {
            display: flex;
          }
        }
      }

      .bl_detail {
        top: 24px;
      }

      .b_footer {
        width: 100%;
        margin-left: 212px;
        margin-top: 25px;
        margin-bottom: 20px;
        display: flex;

        .btn {
          width: 100px;
          height: 40px;
          background: rgba(64, 158, 255, 0);
          border-radius: 8px;
          display: flex;
          align-items: center;
          justify-content: center;
          margin-right: 14px;
          flex-shrink: 0;
          cursor: pointer;

          .btnText {
            font-size: 14px;
            font-weight: 400;
            line-height: 40px;
          }
        }

        .btn5 {
          border: 1px solid rgba(64, 158, 255, 1);
          color: #4ea6ff;
        }

        .btn6 {
          background-color: #4ea6ff;
          color: #ffffff;
        }
      }
    }
  }
}

.createschooltime {
  z-index: 999;
  width: 679px;
  background: #ffffff;
  box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
  position: absolute;
  left: 50%;
  top: -100%;
  transform: translate(-50%, -50%);

  .cst_header {
    position: absolute;
    width: 100%;
    height: 40px;
    background: linear-gradient(
      rgba(78, 166, 255, 0.2) 0%,
      rgba(78, 166, 255, 0) 100%
    );
  }

  .cst_main {
    width: 100%;
    max-height: 600px;
    overflow-y: auto;
    position: relative;

    .cstm_header {
      display: flex;
      align-items: center;
      padding-top: 20px;
      padding-left: 26px;
      font-size: 16px;

      .add_icon {
        width: 16px;
        height: 16px;
        margin-right: 10px;
        background-image: url(@/assets/images/coursewareManage/add1.png);
        background-size: 100% 100%;
      }

      .close_exit {
        position: absolute;
        right: 42px;
        cursor: pointer;
        width: 20px;
        height: 20px;
        background-image: url(@/assets/images/coursewareManage/close.png);
        background-size: 100% 100%;
      }
    }

    .cstm_title {
      margin: 10px auto 20px 51px;
      font-weight: bold;
    }

    .cstm_items {
      display: flex;
      width: 80%;
      margin: auto;
      align-items: center;
      margin-bottom: 23px;

      .signbox {
        display: flex;
        justify-content: end;
        width: 100px;
        margin-right: 6px;

        .sign {
          margin-top: -5px;
          margin-right: 4px;
        }
      }

      .b_input {
        flex: 1;
        position: relative;

        .upload_box {
          display: flex;
          cursor: pointer;

          .upload_icon {
            width: 16px;
            height: 16px;
            margin-right: 5px;
          }
        }

        .inp_num {
          position: absolute;
          top: 9px;
          right: 10px;
        }
      }
    }

    .mbl_items12 {
      width: 440px;
      margin-left: 100px;

      .i12_box1 {
        display: flex;
        align-items: center;
        padding: 17px 0px 17px 21px;
        border: 1px solid #eff4fc;
        border-radius: 8px;
        margin-bottom: 10px;

        .file_img {
          width: 27px;
          height: 32px;
          background-image: url(@/assets/images/coursewareManage/imgs.png);
          margin-right: 22px;

          img {
            width: 100%;
            height: 100%;
          }
        }

        .file_detail {
          width: 250px;
          margin-right: 21px;

          .file_updata {
            display: flex;
            align-items: center;

            .updatabox {
              position: relative;
              width: 230px;
              height: 5px;
              background-color: rgba(192, 192, 192, 0.25);
              border-radius: 3px;

              .updatacolor {
                position: absolute;
                left: 0;
                width: 100%;
                height: 5px;
                background-color: #57c887;
                border-radius: 3px;
              }

              .updatacolor2 {
                position: absolute;
                left: 0;
                width: 80%;
                height: 5px;
                background-color: #ff7474;
                border-radius: 3px;
              }

              .updatacolor3 {
                position: absolute;
                left: 0;
                width: 60%;
                height: 5px;
                background-color: #4ea6ff;
                border-radius: 3px;
              }

              .updataxq {
                position: absolute;
                right: 2px;
                top: -30px;
                color: #57c887;
              }

              .updataxq2 {
                position: absolute;
                right: 2px;
                top: -30px;
                color: #ff7474;
              }

              .updataxq3 {
                position: absolute;
                right: 2px;
                top: -30px;
                color: #4ea6ff;
              }
            }
          }
        }

        .file_operation {
          display: flex;

          .fobox {
            margin-right: 5px;
            cursor: pointer;
          }
        }
      }
    }

    .items_fj {
      margin-bottom: 1px;
    }

    .items_btn {
      display: flex;
      justify-content: center;
      margin-top: 20px;
      margin-bottom: 20px;

      .cstm_btn {
        width: 100px;
        height: 40px;
        background: rgba(64, 158, 255, 0);
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 14px;
        flex-shrink: 0;
        cursor: pointer;

        .btnText {
          font-size: 14px;
          font-weight: 400;
          line-height: 40px;
        }
      }

      .btn5 {
        border: 1px solid rgba(64, 158, 255, 1);
        color: #4ea6ff;
      }

      .btn6 {
        background-color: #4ea6ff;
        color: #ffffff;
      }
    }
  }
}

.QRModal {
  .ant-modal {
    .ant-modal-content {
      width: 479px !important;

      .ant-modal-body {
        .QR {
          z-index: 9999;
          width: 520px;
          background: #ffffff;
          box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
          position: absolute;
          left: 50%;
          top: 10%;
          transform: translate(-50%, -50%);

          .qr_header {
            position: absolute;
            width: calc(100%);
            height: 40px;
            background: linear-gradient(
              rgba(78, 166, 255, 0.2) 0%,
              rgba(78, 166, 255, 0) 100%
            );
          }

          .qr_main {
            width: 100%;
            position: relative;

            .qrm_header {
              display: flex;
              align-items: center;
              padding-top: 20px;
              padding-left: 26px;
              font-size: 16px;

              .qr_icon {
                width: 16px;
                height: 16px;
                margin-right: 10px;
                background-image: url(@/assets/images/coursewareManage/QR.png);
                background-size: 100% 100%;
              }

              .close_exit {
                position: absolute;
                right: 42px;
                cursor: pointer;
                width: 20px;
                height: 20px;
                background-image: url(@/assets/images/coursewareManage/close.png);
                background-size: 100% 100%;
              }
            }

            .qrm_body {
              width: 100%;
              margin-top: 22px;
              margin-bottom: 32px;

              .QR_img {
                width: 176px;
                height: 176px;
                margin: 1px auto;
                background-image: url(@/assets/images/taskpage/QR.png);
                background-size: 100% 100%;
              }
            }

            .qrm_footer {
              display: flex;
              align-items: center;
              margin-bottom: 44px;

              .qrmbtn {
                width: 80px;
                height: 32px;
                display: flex;
                line-height: 32px;
                justify-content: center;
                border-radius: 4px;
                border: 1px solid #387df7;
                margin-left: 16px;
                cursor: pointer;

                .btntext {
                  color: #387df7;
                }
              }
            }
          }
        }
      }
    }
  }
}

.recgradeModal {
  .ant-modal {
    .ant-modal-content {
      // width:679px !important;
      .ant-modal-body {
        .recordgrade {
          z-index: 9999;
          width: 679px;
          background: #ffffff;
          box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
          position: absolute;
          left: 50%;
          top: 10%;
          transform: translate(-50%, -50%);

          .rg_header {
            position: absolute;
            width: calc(100%);
            height: 40px;
            background: linear-gradient(
              rgba(78, 166, 255, 0.2) 0%,
              rgba(78, 166, 255, 0) 100%
            );
          }

          .rg_main {
            width: 100%;
            position: relative;

            .rgm_header {
              display: flex;
              align-items: center;
              padding-top: 20px;
              padding-left: 26px;
              font-size: 16px;

              .rg_icon {
                width: 16px;
                height: 16px;
                margin-right: 10px;
                background-image: url(@/assets/images/coursewareManage/grade.png);
                background-size: 100% 100%;
              }

              .close_exit {
                position: absolute;
                right: 42px;
                cursor: pointer;
                width: 20px;
                height: 20px;
                background-image: url(@/assets/images/coursewareManage/close.png);
                background-size: 100% 100%;
              }
            }

            .rgm_body {
              width: 100%;

              .rgmb_items {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 80%;
                margin: 21px auto 10px auto;

                .items_left {
                  display: flex;
                  margin-right: 14px;

                  .sign {
                    margin-right: 7px;
                  }
                }
              }
            }

            .qrm_btnbox {
              display: flex;
              margin: 30px auto;
              justify-content: center;

              .qrm_btn {
                width: 100px;
                height: 40px;
                background: rgba(64, 158, 255, 0);
                border-radius: 8px;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-right: 14px;
                flex-shrink: 0;
                cursor: pointer;

                .btnText {
                  font-size: 14px;
                  font-weight: 400;
                  line-height: 40px;
                }
              }

              .btn1 {
                border: 1px solid rgba(64, 158, 255, 1);
                color: #4ea6ff;
              }

              .btn2 {
                background-color: #4ea6ff;
                color: #ffffff;
              }
            }
          }
        }
      }
    }
  }
}

.graModal {
  .ant-modal {
    .ant-modal-content {
      // width:679px !important;
      .ant-modal-body {
        .graduate {
          z-index: 9999;
          width: 679px;
          background: #ffffff;
          box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
          position: absolute;
          left: 50%;
          top: 10%;
          transform: translate(-50%, -50%);

          .gra_header {
            position: absolute;
            width: calc(100%);
            height: 40px;
            background: linear-gradient(
              rgba(78, 166, 255, 0.2) 0%,
              rgba(78, 166, 255, 0) 100%
            );
          }

          .gra_main {
            width: 100%;
            position: relative;

            .gram_header {
              display: flex;
              align-items: center;
              padding-top: 20px;
              padding-left: 26px;
              font-size: 16px;

              .gra_icon {
                width: 16px;
                height: 16px;
                margin-right: 10px;
                background-image: url(@/assets/images/coursewareManage/graduate.png);
                background-size: 100% 100%;
              }

              .close_exit {
                position: absolute;
                right: 42px;
                cursor: pointer;
                width: 20px;
                height: 20px;
                background-image: url(@/assets/images/coursewareManage/close.png);
                background-size: 100% 100%;
              }
            }

            .gram_body {
              width: 100%;

              .gramb_items {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 80%;
                margin: 21px auto 10px auto;

                .items_left {
                  display: flex;
                  margin-right: 14px;

                  .sign {
                    margin-right: 7px;
                  }
                }
              }

              .gramb_input {
                .bc_box {
                  display: flex;
                }
              }
            }

            .qrm_btnbox {
              display: flex;
              margin: 30px auto;
              justify-content: center;

              .qrm_btn {
                width: 100px;
                height: 40px;
                background: rgba(64, 158, 255, 0);
                border-radius: 8px;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-right: 14px;
                flex-shrink: 0;
                cursor: pointer;

                .btnText {
                  font-size: 14px;
                  font-weight: 400;
                  line-height: 40px;
                }
              }

              .btn1 {
                border: 1px solid rgba(64, 158, 255, 1);
                color: #4ea6ff;
              }

              .btn2 {
                background-color: #4ea6ff;
                color: #ffffff;
              }
            }
          }
        }
      }
    }
  }
}

.agrstudyModal {
  .ant-modal {
    width: 429px !important;
    height: 258px !important;

    .ant-modal-content {
      width: 429px !important;
      height: 258px !important;

      .ant-modal-body {
        width: 429px !important;
        height: 258px !important;
        padding: 0px !important;

        .agreestudy {
          z-index: 9999;
          width: 429px;
          height: 258px;
          background: #ffffff;
          box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);

          .agree_header {
            position: absolute;
            width: 100%;
            height: 40px;
            background: linear-gradient(
              rgba(78, 166, 255, 0.2) 0%,
              rgba(78, 166, 255, 0) 100%
            );
          }

          .agree_main {
            width: 100%;
            position: relative;

            .agreem_header {
              display: flex;
              align-items: center;
              padding-top: 20px;
              padding-left: 26px;
              font-size: 16px;

              .agreem_icon {
                width: 16px;
                height: 16px;
                margin-right: 10px;
                background-image: url(@/assets/images/coursewareManage/notice.png);
                background-size: 100% 100%;
              }

              .close_exit {
                position: absolute;
                right: 42px;
                cursor: pointer;
                width: 20px;
                height: 20px;
                background-image: url(@/assets/images/coursewareManage/close.png);
                background-size: 100% 100%;
              }
            }

            .agreem_body {
              display: flex;
              justify-content: center;
              align-items: center;
              width: 100%;
              margin: 45px auto 62px auto;
            }

            .qrm_btnbox {
              display: flex;
              margin: 30px auto;
              justify-content: center;

              .qrm_btn {
                width: 100px;
                height: 40px;
                background: rgba(64, 158, 255, 0);
                border-radius: 8px;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-shrink: 0;
                cursor: pointer;

                .btnText {
                  font-size: 14px;
                  font-weight: 400;
                  line-height: 40px;
                }
              }

              .btn1 {
                border: 1px solid rgba(64, 158, 255, 1);
                color: #4ea6ff;
                margin-right: 14px;
              }

              .btn2 {
                background-color: #4ea6ff;
                color: #ffffff;
              }
            }
          }
        }
      }
    }
  }
}

.onlmanageModal {
  .ant-modal {
    .ant-modal-content {
      // width:1358px !important;
      .ant-modal-body {
        .modalHeader {
          display: flex;
          align-items: center;
          justify-content: space-between;

          .headerLeft {
            margin-left: 27px;
            display: flex;
            align-items: center;

            .headerLeftText {
              font-size: 16px;
              font-weight: 400;
              color: #000000;
              line-height: 36px;
            }
          }
        }

        .onlinemanage {
          display: none;
          min-width: 1000px;
          background: #ffffff;

          .om_main {
            width: 100%;

            .om_body {
              margin-right: 50px;

              .b_title {
                color: #4f5156;
                font-weight: 500;
                margin-bottom: 19px;
              }

              .b_sub {
                display: flex;
                margin-bottom: 10px;

                .bs_type {
                  color: #999ba3;
                }

                .bs_left {
                  color: #999ba3;
                  margin-left: 35px;
                }

                .bs_right {
                  color: #4f5156;
                }
              }

              .b_menu {
                width: calc(100%);
              }

              .b_menunav {
                display: flex;
                margin-top: 20px;
                margin-bottom: 20px;

                .bm_select {
                  margin-right: 20px;
                }

                .bm_input {
                  margin-right: 20px;
                }

                .bm_btn {
                  display: flex;
                  cursor: pointer;

                  .btn {
                    padding: 0px 26px 0px 26px;
                    height: 40px;
                    background: rgba(64, 158, 255, 0);
                    border-radius: 8px;
                    border: 1px solid rgba(64, 158, 255, 1);
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin-right: 14px;
                    flex-shrink: 0;

                    .search {
                      background-size: 100%;
                    }

                    .btnText {
                      font-size: 14px;
                      font-weight: 400;
                      color: rgba(64, 158, 255, 1);
                      line-height: 36px;
                      margin-left: 5px;
                    }
                  }

                  .btn1 {
                    .search {
                      width: 15px;
                      height: 17px;
                      background-image: url("@/assets/images/coursewareManage/search1.png");
                    }
                  }

                  .btn1:hover {
                    background: rgba(64, 158, 255, 1);

                    .search {
                      background-image: url("@/assets/images/coursewareManage/search0.png");
                    }

                    .btnText {
                      color: #ffffff;
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}

.facteachModal {
  .ant-modal {
    .ant-modal-content {
      // width:1358px !important;
      .ant-modal-body {
        .modalHeader {
          display: flex;
          align-items: center;
          justify-content: space-between;

          .headerLeft {
            margin-left: 27px;
            display: flex;
            align-items: center;

            .headerLeftText {
              font-size: 16px;
              font-weight: 400;
              color: #000000;
              line-height: 36px;
            }
          }
        }

        .modalMain {
          .m_title {
            margin-bottom: 20px;
          }

          .m_body {
            display: flex;
            flex-wrap: wrap;

            .mb_left {
              width: 50%;

              .mbl_items {
                display: flex;
                align-items: center;
                justify-content: flex-end;
                margin-bottom: 10px;

                .item_nam {
                  width: 100px;
                  display: flex;
                  align-items: center;
                  justify-content: flex-end;
                  white-space: nowrap;

                  .asterisk_icon {
                    width: 10px;
                    height: 10px;
                    margin-right: 5px;
                    margin-top: -15px;
                  }
                }

                .item_inp {
                  flex: 1;
                  position: relative;

                  .inp_num {
                    position: absolute;
                    left: 398px;
                    top: 10px;
                  }
                }
              }

              .mbl_items2 {
                display: flex;
                align-items: start;
                margin-top: 10px;
                margin-bottom: 10px;

                .item_nam {
                  width: 100px;
                  display: flex;
                  align-items: center;
                  justify-content: flex-end;
                  white-space: nowrap;

                  .asterisk_icon {
                    width: 10px;
                    height: 10px;
                    margin-right: 5px;
                    margin-top: -15px;
                  }
                }

                .item_inp {
                  flex: 1;

                  .i_upload_img {
                    margin-top: 10px;
                    width: 100px;
                    height: 100px;
                    border-radius: 8px;
                  }

                  .i_upload {
                    width: 100px;
                    height: 100px;
                    border: 1px solid #4ea6ff;
                    border-radius: 8px;
                    text-align: center;
                    align-items: center;
                    cursor: pointer;

                    .addimg {
                      position: relative;

                      .heng {
                        position: absolute;
                        top: 50px;
                        left: 25px;
                        width: 50px;
                        border: 1px solid #4ea6ff;
                      }

                      .shu {
                        position: absolute;
                        top: 25px;
                        left: 50px;
                        height: 50px;
                        border: 1px solid #4ea6ff;
                      }
                    }
                  }
                }
              }

              .i2_cz {
                width: 440px;
                margin-left: 100px;

                .i2_top {
                  display: flex;
                  justify-content: space-between;
                }
              }

              .i8_bottom {
                display: flex;
                width: 440px;
                margin-left: 100px;
              }
            }

            .mb_right {
              width: 50%;

              .mbl_items {
                display: flex;
                align-items: flex-start;
                justify-content: flex-end;
                margin-bottom: 10px;

                .item_nam {
                  width: 100px;
                  display: flex;
                  align-items: center;
                  justify-content: flex-end;
                  white-space: nowrap;

                  .asterisk_icon {
                    width: 10px;
                    height: 10px;
                    margin-top: -15px;
                    margin-right: 5px;
                  }
                }

                .item_inp {
                  flex: 1;
                }

                .accessory {
                  display: flex;
                  align-items: center;

                  .accessory_icon {
                    width: 16px;
                    height: 16px;
                    margin-top: -8px;
                    margin-right: 5px;
                  }
                }
              }

              .mbl_items2 {
                display: flex;
                align-items: start;
                margin-bottom: 10px;

                .item_nam {
                  width: 100px;
                  display: flex;
                  align-items: center;
                  justify-content: flex-end;
                  white-space: nowrap;

                  .asterisk_icon {
                    width: 10px;
                    height: 10px;
                    margin-right: 5px;
                    margin-top: -15px;
                  }
                }

                .item_inp {
                  flex: 1;
                  position: relative;

                  .inp_num {
                    position: absolute;
                    left: 395px;
                    bottom: 10px;
                  }
                }
              }

              .mbl_items12 {
                width: 440px;
                margin-left: 100px;

                .i12_box1 {
                  display: flex;
                  align-items: center;
                  padding: 17px 0px 17px 21px;
                  border: 1px solid #eff4fc;
                  border-radius: 8px;
                  margin-bottom: 10px;

                  .file_img {
                    width: 27px;
                    height: 32px;
                    background-image: url(@/assets/images/coursewareManage/imgs.png);
                    margin-right: 22px;

                    img {
                      width: 100%;
                      height: 100%;
                    }
                  }

                  .file_detail {
                    width: 250px;
                    margin-right: 21px;

                    .file_updata {
                      display: flex;
                      align-items: center;

                      .updatabox {
                        position: relative;
                        width: 230px;
                        height: 5px;
                        background-color: rgba(192, 192, 192, 0.25);
                        border-radius: 3px;

                        .updatacolor {
                          position: absolute;
                          left: 0;
                          width: 100%;
                          height: 5px;
                          background-color: #57c887;
                          border-radius: 3px;
                        }

                        .updatacolor2 {
                          position: absolute;
                          left: 0;
                          width: 80%;
                          height: 5px;
                          background-color: #ff7474;
                          border-radius: 3px;
                        }

                        .updatacolor3 {
                          position: absolute;
                          left: 0;
                          width: 60%;
                          height: 5px;
                          background-color: #4ea6ff;
                          border-radius: 3px;
                        }

                        .updataxq {
                          position: absolute;
                          right: 2px;
                          top: -30px;
                          color: #57c887;
                        }

                        .updataxq2 {
                          position: absolute;
                          right: 2px;
                          top: -30px;
                          color: #ff7474;
                        }

                        .updataxq3 {
                          position: absolute;
                          right: 2px;
                          top: -30px;
                          color: #4ea6ff;
                        }
                      }
                    }
                  }

                  .file_operation {
                    display: flex;

                    .fobox {
                      margin-right: 5px;
                      cursor: pointer;
                    }
                  }
                }
              }
            }
          }

          .m_footer {
            display: flex;
            margin: 20px 0;

            .fotnam {
              width: 100px;
              display: flex;
              justify-content: end;
              padding-right: 15px;
            }

            .fotarea {
              width: calc(100% - 150px);
              position: relative;

              .fuwenben {
                width: 90%;
                height: 20px;
                background-color: rgb(95, 95, 95);
                position: absolute;
                left: 50%;
                transform: translate(-50%, 0);
                top: 3px;
                z-index: 9999;
              }
            }
          }

          .m_btn {
            width: 100%;
            margin-top: 25px;
            margin-bottom: 20px;
            display: flex;
            justify-content: center;
            align-content: center;

            .btn {
              width: 100px;
              height: 40px;
              background: rgba(64, 158, 255, 0);
              border-radius: 8px;
              display: flex;
              align-items: center;
              justify-content: center;
              margin-right: 14px;
              flex-shrink: 0;
              cursor: pointer;

              .btnText {
                font-size: 14px;
                font-weight: 400;
                line-height: 40px;
              }
            }

            .btn5 {
              border: 1px solid rgba(64, 158, 255, 1);
              color: #4ea6ff;
            }

            .btn6 {
              background-color: #4ea6ff;
              color: #ffffff;
            }
          }
        }
      }
    }
  }
}

.givpowerModal {
  .ant-modal {
    .ant-modal-content {
      // width:1358px !important;
      .ant-modal-body {
        .modalHeader {
          display: flex;
          align-items: center;
          justify-content: space-between;

          .headerLeft {
            margin-left: 27px;
            display: flex;
            align-items: center;

            .headerLeftText {
              font-size: 16px;
              font-weight: 400;
              color: #000000;
              line-height: 36px;
            }
          }
        }

        .givepower {
          min-width: 1000px;
          background: #ffffff;

          .gp_main {
            width: 100%;
            position: relative;

            .gpm_inputbtn {
              width: 90%;
              margin: 20px auto;
              display: flex;

              .gpm_btn {
                width: 100px;
                height: 40px;
                margin-right: 14px;
                background: #ffffff;
                border: 1px solid #4ea6ff;
                border-radius: 8px;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-shrink: 0;
                cursor: pointer;

                .btnText {
                  color: #4ea6ff;
                  font-size: 14px;
                  font-weight: 400;
                  line-height: 40px;
                }
              }

              .btn1 {
                .search {
                  width: 15px;
                  height: 17px;
                  margin-right: 6px;
                  background-image: url("../../assets/images/courseManage/search1.png");
                }
              }

              .btn2 {
                .reset {
                  width: 16px;
                  height: 18px;
                  margin-right: 6px;
                  background-image: url("../../assets/images/courseManage/reset1.png");
                }
              }

              .btn1:hover {
                background: #4ea6ff;

                .search {
                  background-image: url("@/assets/images/coursewareManage/search0.png");
                }

                .btnText {
                  color: #ffffff;
                }
              }

              .btn2:hover {
                background: #4ea6ff;

                .reset {
                  background-image: url("@/assets/images/coursewareManage/reset0.png");
                }

                .btnText {
                  color: #ffffff;
                }
              }
            }

            .gpm_notice {
              display: flex;
              background: rgba(78, 166, 255, 0.25);
              border: 1px solid #4ea6ff;
              width: 90%;
              height: 62px;
              margin: 20px auto;
              align-items: center;
              line-height: 64px;

              .th_icon {
                width: 16px;
                height: 16px;
                background-image: url(@/assets/images/coursewareManage/gan.png);
                background-size: 100% 100%;
                margin: auto 13px auto 37px;
              }

              .textarea {
                margin-right: 33px;
              }
            }

            .gpm_table {
              width: 90%;
              margin: 30px auto;
              border: 1px solid #f0f4fe;
            }
          }
        }
      }
    }
  }
}

.schtimeModal {
  .ant-modal {
    .ant-modal-content {
      // width:1358px !important;
      .ant-modal-body {
        .modalHeader {
          display: flex;
          align-items: center;
          justify-content: space-between;

          .headerLeft {
            margin-left: 27px;
            display: flex;
            align-items: center;

            .headerLeftText {
              font-size: 16px;
              font-weight: 400;
              color: #000000;
              line-height: 36px;
            }
          }
        }

        .schooltime {
          min-width: 1000px;
          background: #ffffff;

          .st_main {
            width: 100%;

            .stm_inputbtn {
              display: flex;
              width: 90%;
              margin: 20px auto;

              .stm_btn {
                width: 100px;
                height: 40px;
                margin-right: 14px;
                background: #ffffff;
                border: 1px solid #4ea6ff;
                border-radius: 8px;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-shrink: 0;
                cursor: pointer;

                .btnText {
                  color: #4ea6ff;
                  font-size: 14px;
                  font-weight: 400;
                  line-height: 40px;
                }
              }

              .btn1 {
                .search {
                  width: 15px;
                  height: 17px;
                  margin-right: 6px;
                  background-image: url("@/assets/images/coursewareManage/search1.png");
                }
              }

              .btn2 {
                .reset {
                  width: 16px;
                  height: 18px;
                  margin-right: 6px;
                  background-image: url("@/assets/images/coursewareManage/reset1.png");
                }
              }

              .btn1:hover {
                background: #4ea6ff;

                .search {
                  background-image: url("@/assets/images/coursewareManage/search0.png");
                }

                .btnText {
                  color: #ffffff;
                }
              }

              .btn2:hover {
                background: #4ea6ff;

                .reset {
                  background-image: url("@/assets/images/coursewareManage/reset0.png");
                }

                .btnText {
                  color: #ffffff;
                }
              }
            }

            .stm_btn3 {
              width: 130px;
              height: 40px;
              border: 1px solid #4ea6ff;
              background-color: #4ea6ff;
              border-radius: 8px;
              display: flex;
              align-items: center;
              justify-content: center;
              flex-shrink: 0;
              cursor: pointer;

              .btnText {
                font-size: 14px;
                font-weight: 400;
                line-height: 40px;
              }

              .btn3 {
                .add {
                  width: 17px;
                  height: 18px;
                  background-image: url("@/assets/images/coursewareManage/add0.png");
                  background-size: 100% 100%;
                  margin-right: 6px;
                }
              }
            }

            .notable {
              width: 100%;
              height: 100%;

              .notablebox {
                width: 412px;
                height: 212px;
                background: linear-gradient(180deg, #fef3dd 0%, #fffaf0 100%);
                border-radius: 10px;
                display: flex;
                justify-content: center;
                text-align: center;
                margin: 77px auto 109px auto;
                position: relative;

                .smallleft {
                  position: absolute;
                  top: 18px;
                  left: 0px;
                  width: 8px;
                  height: 21px;
                  border-radius: 0px 4px 4px 0px;
                  background-color: #ffb64e;
                }

                .smallright {
                  position: absolute;
                  bottom: 18px;
                  right: 0px;
                  width: 8px;
                  height: 21px;
                  border-radius: 4px 0px 0px 4px;
                  background-color: #ffb64e;
                }

                .boxbody {
                  .boximg {
                    width: 72px;
                    height: 72px;
                    margin: 32px auto 20px auto;
                    background-image: url(@/assets/images/coursewareManage/nostate.png);
                    background-size: 100% 100%;
                  }

                  .boxtitle {
                    margin-bottom: 4px;
                  }
                }
              }
            }

            .stm_table {
              position: relative;
              padding-bottom: 80px;

              .classify {
                margin-left: 10px !important;
                padding-left: 9px !important;
              }

              .ant-checkbox-wrapper {
                align-items: center;
                margin-top: -2px;
              }

              .ant-table-selection-column {
                padding: 0px !important;
                padding-left: 60px !important;
              }

              .ant-table-thead > tr > th {
                background-color: rgba(239, 244, 252, 1);
              }

              th.h {
                background-color: #eff4fc !important;
              }

              .ant-table-tbody
                > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
                > td {
                background: #f6f9fd;
              }

              .operation {
                display: flex;
                justify-content: center;
                align-items: center;
                color: #4ea6ff;

                .nselect {
                  justify-content: center;
                  align-items: center;
                  display: flex;

                  .jc {
                    margin-left: 20px;
                    cursor: pointer;
                  }
                }

                .tableSelect {
                  // margin-right: 10px;
                  margin-left: -5px;
                  display: flex;
                  align-items: center;
                  justify-content: right;
                }
              }

              .tableBox {
                .pa {
                  left: 0;
                  width: 100%;
                  // height: 20px;
                  // background-color: red;
                  display: flex;
                  justify-content: center;
                  position: absolute;
                  bottom: 20px;
                }
              }
            }
          }
        }
      }
    }
  }
}

.stusmanageModal {
  .ant-modal {
    .ant-modal-content {
      // width:1358px !important;
      .ant-modal-body {
        .modalHeader {
          display: flex;
          align-items: center;
          justify-content: space-between;

          .headerLeft {
            margin-left: 27px;
            display: flex;
            align-items: center;

            .headerLeftText {
              font-size: 16px;
              font-weight: 400;
              color: #000000;
              line-height: 36px;
            }
          }
        }

        .studentsmanage {
          min-width: 1000px;
          background: #ffffff;

          .stm_main {
            width: 100%;

            .stmmitems {
              margin: auto 49px;

              .stmm_i1,
              .stmm_i2,
              .stmm_i3,
              .stmm_i4 {
                margin: 19px 0;
              }

              .stmm_i5 {
                display: flex;
                justify-content: space-between;

                .i5_left {
                  display: flex;

                  .stmm_btn {
                    width: 100px;
                    height: 40px;
                    margin-right: 14px;
                    background: #ffffff;
                    border: 1px solid #4ea6ff;
                    border-radius: 8px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    flex-shrink: 0;
                    cursor: pointer;

                    .btnText {
                      color: #4ea6ff;
                      font-size: 14px;
                      font-weight: 400;
                      line-height: 40px;
                    }
                  }

                  .btn1 {
                    .search {
                      width: 15px;
                      height: 17px;
                      margin-right: 6px;
                      background-image: url("../../assets/images/courseManage/search1.png");
                    }
                  }

                  .btn2 {
                    .reset {
                      width: 16px;
                      height: 18px;
                      margin-right: 6px;
                      background-image: url("../../assets/images/courseManage/reset1.png");
                    }
                  }

                  .btn1:hover {
                    background: rgba(64, 158, 255, 1);

                    .search {
                      background-image: url("../../assets/images/courseManage/search0.png");
                    }

                    .btnText {
                      color: #ffffff;
                    }
                  }

                  .btn2:hover {
                    background: rgba(64, 158, 255, 1);

                    .reset {
                      background-image: url("../../assets/images/courseManage/reset0.png");
                    }

                    .btnText {
                      color: #ffffff;
                    }
                  }
                }

                .i5_right {
                  display: flex;

                  .stmm_btn {
                    width: 100px;
                    height: 40px;
                    // <!-- 2022-11-30注释 后面放开 -->
                    // margin-right: 14px;
                    background: #ffffff;
                    border: 1px solid #4ea6ff;
                    border-radius: 8px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    flex-shrink: 0;
                    cursor: pointer;

                    .btnText {
                      color: #4ea6ff;
                      font-size: 14px;
                      font-weight: 400;
                      line-height: 40px;
                    }
                  }

                  .btn3 {
                    background-color: #4ea6ff;
                  }

                  .btn4 {
                    display: flex;
                    width: 130px;
                    flex-direction: column;
                    position: relative;

                    .btn4_sub {
                      display: flex;
                      justify-content: center;
                      align-items: center;

                      .b_zk {
                        width: 10px;
                        height: 8px;
                        background-image: url("@/assets/images/coursewareManage/down.png");
                        background-size: 100% 100%;
                      }

                      .b_sq {
                        width: 10px;
                        height: 8px;
                        background-image: url("@/assets/images/coursewareManage/up.png");
                        background-size: 100% 100%;
                      }
                    }

                    .btn4_sup {
                      width: 100%;
                      background-color: #ffffff;
                      box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
                      position: absolute;
                      top: 40px;
                      z-index: 999;

                      .btnsbox {
                        display: flex;
                        flex-direction: column;
                        justify-content: center;
                        align-items: center;

                        .btn4_tit {
                          margin: 10px auto;
                          white-space: nowrap;
                        }

                        .btn4_op1,
                        .btn4_op2,
                        .btn4_op3 {
                          margin-bottom: 10px;
                          white-space: nowrap;
                        }
                      }
                    }
                  }

                  .btn5 {
                    margin-right: 0px;

                    .export {
                      width: 17px;
                      height: 18px;
                      margin-right: 5px;
                      background-image: url("@/assets/images/coursewareManage/export.png");
                    }
                  }

                  .btn5:hover {
                    background: #4ea6ff;

                    .export {
                      background-image: url("@/assets/images/coursewareManage/export1.png");
                    }

                    .btnText {
                      color: #ffffff;
                    }
                  }
                }
              }

              .stmm_i6 {
                position: relative;
                padding-top: 15px;
                padding-bottom: 80px;

                .classify {
                  margin-left: 10px !important;
                  padding-left: 9px !important;
                }

                .ant-checkbox-wrapper {
                  align-items: center;
                  margin-top: -2px;
                }

                .ant-table-selection-column {
                  padding: 0px !important;
                  padding-left: 60px !important;
                }

                .ant-table-thead > tr > th {
                  background-color: rgba(239, 244, 252, 1);
                }

                th.h {
                  background-color: #eff4fc !important;
                }

                .ant-table-tbody
                  > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
                  > td {
                  background: #f6f9fd;
                }

                .operation,
                .nselect {
                  display: flex;
                  justify-content: center;
                  color: #4ea6ff;
                  font-size: 14px;

                  .ops1,
                  .ops2 {
                    margin-right: 10px;
                    cursor: pointer;
                  }
                }

                .tableBox {
                  .pa {
                    left: 0;
                    width: 100%;
                    // height: 20px;
                    // background-color: red;
                    display: flex;
                    justify-content: center;
                    position: absolute;
                    bottom: 20px;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}

.tag-content {
  .ant-tag {
    margin-top: 10px;
  }
}

.coursewareDetail {
  .ant-modal {
    height: 320px;
    margin-top: 100px;

    .ant-modal-content {
      // width:1358px !important;
      .ant-modal-body {
        .modalHeader {
          display: flex;
          align-items: center;
          justify-content: space-between;

          .headerLeft {
            margin-left: 27px;
            display: flex;
            align-items: center;

            .headerLeftText {
              font-size: 16px;
              font-weight: 400;
              color: #000000;
              line-height: 36px;
            }
          }
        }

        .modalMain {
          .ftsturecord {
            min-width: 1000px;
            background: #ffffff;

            .ftsr_main {
              width: 100%;

              .ftsr_table {
                width: 90%;
                margin: 30px auto;
                border: 1px solid #f0f4fe;
              }

              .ftsr_btn {
                width: 100px;
                height: 40px;
                background: #ffffff;
                border: 1px solid #4ea6ff;
                border-radius: 8px;
                display: flex;
                align-items: center;
                justify-content: center;
                margin: 30px auto;
                flex-shrink: 0;
                cursor: pointer;

                .btnText {
                  color: #4ea6ff;
                  font-size: 14px;
                  font-weight: 400;
                  line-height: 40px;
                }
              }
            }
          }
        }
      }
    }
  }
}

// 选择评估
.main_item {
  display: flex;
  align-items: center;
  margin-top: 32px;
  margin-bottom: 32px;

  .signbox {
    width: 120px;
    display: flex;
    justify-content: end;
    align-items: center;

    .sign {
      margin-right: 5px;
    }
  }

  .btnbox {
    display: flex;
    flex: 1;
    align-items: center;

    .xkbtn {
      cursor: pointer;
      width: 130px;
      height: 40px;
      background: #4ea6ff;
      border-radius: 8px;
      border: 0;
      margin-right: 8px;
      color: #fff;
    }
  }
}

.DelModal {
  .ant-modal {
    .ant-modal-content {
      width: 424px !important;

      .ant-modal-body {
        .delete {
          width: 424px;
          background: #ffffff;
          box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
          border-radius: 4px;
          position: absolute;
          left: 50%;
          top: 10%;
          transform: translate(-50%, -50%);

          .del_header {
            position: absolute;
            width: calc(100%);
            height: 40px;
            background: linear-gradient(
              rgba(78, 166, 255, 0.2) 0%,
              rgba(78, 166, 255, 0) 100%
            );
          }

          .del_main {
            width: 100%;
            position: relative;

            .header {
              display: flex;
              align-items: center;
              padding-top: 20px;
              padding-left: 26px;
              font-size: 16px;

              .del-icons {
                width: 16px;
                height: 16px;
                position: relative;
                margin-right: 10px;

                img {
                  width: 100%;
                  height: 100%;
                  position: absolute;
                  top: 0px;
                  left: 0px;
                  background-size: 100% 100%;
                }
              }

              .close_exit {
                position: absolute;
                right: 42px;
                cursor: pointer;
                width: 20px;
                height: 20px;
                background-image: url(@/assets/images/coursewareManage/close.png);
                background-size: 100% 100%;
              }
            }

            .body {
              width: 100%;
              margin: 34px auto 56px auto;
              display: flex;
              justify-content: center;
              align-items: center;
            }

            .del_btnbox {
              display: flex;
              margin: 30px auto;
              justify-content: center;

              .del_btn {
                width: 100px;
                height: 40px;
                background: rgba(64, 158, 255, 0);
                border-radius: 8px;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-right: 14px;
                flex-shrink: 0;
                cursor: pointer;

                .btnText {
                  font-size: 14px;
                  font-weight: 400;
                  line-height: 40px;
                }
              }

              .btn1 {
                border: 1px solid rgba(64, 158, 255, 1);
                color: #4ea6ff;
              }

              .btn2 {
                background-color: #4ea6ff;
                color: #ffffff;
              }
            }
          }
        }
      }
    }
  }
}

.disabled {
  a {
    color: #999ba3;
    cursor: not-allowed;
  }
}

.pa {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-bottom: 20px;

  .pagination {
    margin-bottom: 20px;
  }

  .ant-pagination-item-link,
  .ant-pagination-item,
  .ant-select-selector,
  .ant-pagination-options-quick-jumper input {
    border-radius: 8px;
  }
}

.ant-select-selector {
  height: 100%;
  border-radius: 8px;
}

.ant-upload.ant-upload-select-picture-card {
  border: none;
}

.statusJuJue {
  margin-bottom: 20px;
}

// .tableSelect {
//   position: relative;
//   .hoverList {
//     display: none;
//   }
//   &:hover {
//     .hoverList {
//       display: block;
//       position: absolute;
//       top: 20px;
//       left: -20px;
//       background: #fff;
//       box-sizing: border-box;
//       // padding: 20px;
//       color: #000000;
//     }
//   }
// }

// ::v-deep .w-e-toolbar {
//   .w-e-bar-item {
//     &:nth-child(23) {
//       display: none !important;
//     }
//   }
// }
</style>
