<!-- 内部授课页面 -->
<template>
  <div >
    <div class="tableBox ">
        <a-table :header-cell-style="{ 'text-align': 'center' }" style="border: 1px solid #f2f6fe" :columns="columns"
        :scroll="{ x: 100 }"
             :data-source="tableData" 
             :loading="tableLoading" 
             @expand="expandTable" 
             :pagination="false">
          <template #bodyCell="{ record, column }">
            <template v-if="column.key === 'operation'">
              <a-space style="display:flex ;justify-content: space-around;  ">
                <a-button type="link" @click="() => handleLook(record, String(record.courseform))">查看</a-button>
                <a-button type="link" @click="() => handleModify(record, String(record.courseform))">修改</a-button>
                <a-button type="link" @click="() => deleteModal(record, String(record.courseform))">删除</a-button>
              </a-space>
            </template>
          </template>
        </a-table>
      </div>

    <div class="tableBox ">
      <div style="float: right;">
        <a-pagination v-if="tableDataTotal > 10" :showSizeChanger="true" :hideOnSinglePage="true" :pageSize="pageSize"
          v-model:current="searchParam.pageNo" :total="tableDataTotal" class="pagination" @change="changePagination" />
      </div>
    </div>
    <!-- 搜索框及按钮 -->
    <div class="filter">
      <a-form layout="inline"  style="min-width: 1380px;">
        <a-form-item class="select">
          <!--  v-model:value="searchParam.name" -->
          <a-input v-model:value="searchParam.userNo" style="width: 276px; height: 40px; border-radius: 8px"
            placeholder="请输入工号/讲师姓名进行检索" allowClear showSearch>
          </a-input>

          <!-- <a-select style="width: 276px" placeholder="请选择所属组织" v-model:value="searchParam.userNo"
            :options="infoteacherList">
          </a-select> -->
        </a-form-item>
        <a-form-item class="select">
          <a-input v-model:value="searchParam.teacherNo" style="width: 260px; height: 40px; border-radius: 8px"
            placeholder="请输入课程名称进行搜索" allowClear showSearch>
          </a-input>
        </a-form-item>
        <a-form-item class="select ">
          <a-range-picker style="width: 260px; height: 40px; border-radius: 8px" v-model:value="searchdate" separator="至"
            :placeholder="['      开始时间', '        结束时间']" @change="searchTimeChange" />
        </a-form-item>
        <div style="display: flex; margin-bottom: 20px">
          <a-button @click="searchSubmit()" type="primary" class="resetbtn">查询 </a-button>
          <!-- <div class="btn btn1" @click="searchReset" style="background:rgba(64, 158, 255, 0);" > -->
          <!-- <div class="search"></div> -->
          <a-button class="resetbtn " @click="searchReset">重置</a-button>

          <!-- 更多筛选-->
          <div v-if="moreid == 1">
            <a-button @click="handlemoreid()" class="moreidbtn" type="text"> 展开
              <RightOutlined />
            </a-button>
          </div>
          <div v-if="moreid == 2">
            <a-button @click="handlemoreid()" class="moreidbtn"> 返回
              <UpOutlined />
            </a-button>
          </div>
        </div>
        <div style="width:100%"></div>
        <a-form-item class="select" v-if="moreid == 2">
          <a-select style="width: 230px ;margin-bottom:20px" v-model:value="searchParam.type" placeholder="录入类型"
            :options="OnTheJobStatusList">
          </a-select>
        </a-form-item>
        <a-form-item class="select" v-if="moreid == 2">
          <a-select style="width: 230px" v-model:value="searchParam.status" placeholder="开课状态"
            :options="AuthenticationStatusList">
          </a-select>
        </a-form-item>
        <a-form-item class="select" v-if="moreid == 2">
          <a-select style="width: 230px" placeholder="请选择所属组织" v-model:value="searchParam.departId"
            :options="getOrganizationList">
          </a-select>
        </a-form-item>
        <a-form-item class="select" v-if="moreid == 2">
          <a-select style="width: 230px" placeholder="请选择讲师体系" v-model:value="searchParam.systemId"
            :options="LecturerSystemList">
          </a-select>
        </a-form-item>
        <a-form-item class="select" v-if="moreid == 2">
          <a-select style="width: 230px" v-model:value="searchParam.tlevelName" placeholder="内容分类"
            :options="getTeacherExpertiseList">
          </a-select>
        </a-form-item>
      </a-form>
      <div style="width: 100%;"></div>
      <div style="display: flex; margin-bottom: 20px">
        <a-button @click="addTeacher()" type="primary" class="langbtn">
          <FolderAddOutlined /> 添加授课记录
        </a-button>
        <!-- <div style="margin-left: 20px ;">
          <a-button @click="addTeacher()" class="langbtn">
            <UploadOutlined /> 一键生成讲师费
          </a-button>
        </div> -->
        <a-button @click="handleExport()" class="resetbtn">
          <DownloadOutlined /> 导入
        </a-button>
        <a-button @click="handleExport()" class="resetbtn">
          <UploadOutlined /> 导出
        </a-button>
      </div>
    </div>
      <!-- 表格 -->
      <div class="tableBox ">
        <a-table :header-cell-style="{ 'text-align': 'center' }" style="border: 1px solid #f2f6fe" :columns="columns"
        :scroll="{ x: 1300 }"
             :data-source="tableData" 
             :loading="tableLoading" 
             @expand="expandTable" 
             :pagination="false">
          <template #bodyCell="{ record, column }">
            <template v-if="column.key === 'operation'">
              <a-space style="display:flex ;justify-content: space-around;  ">
                <a-button type="link" @click="() => handleLook(record, String(record.courseform))">查看</a-button>
                <a-button type="link" @click="() => handleModify(record, String(record.courseform))">修改</a-button>
                <a-button type="link" @click="() => deleteModal(record, String(record.courseform))">删除</a-button>
              </a-space>
            </template>
          </template>
        </a-table>
      </div>

    <div class="tableBox ">
      <div style="float: right;">
        <a-pagination v-if="tableDataTotal > 10" :showSizeChanger="true" :hideOnSinglePage="true" :pageSize="pageSize"
          v-model:current="searchParam.pageNo" :total="tableDataTotal" class="pagination" @change="changePagination" />
      </div>
    </div>
    <!-- 弹窗组件 -->
    <a-drawer v-model:visible="teacherdialog" placement="right" @closa="cancelTeacherDialog" :maskClosable="true" dropdown-style="drawaer"
      width="60%" :title="teacherdialogtitle">
      <a-form :model="formParam" :rules="rules" layout="vertical">
        <!-- 讲师姓名  name  组织 departId-->
        <a-row :gutter="16">
          <a-col :span="12">
            <a-form-item label="讲师名称" name="teacher">
              <a-tree-select v-model:value="formParam.teacher" tree-data-simple-mode
              class="draitem"
                :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }" :tree-data="treeData" placeholder="请输入讲师名称" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="讲师组织" name="departId">
              <a-popover title="讲师组织">
                <template #content>
                  {{ formParam.departId }}
                </template>
                <a-input disabled v-model:value="formParam.departId" class="draitem"
                  placeholder="自动带出讲师的组织,展示主要部分,鼠标浮上去展示所有" allowClear showSearch>
                </a-input>
              </a-popover>
            </a-form-item>
          </a-col>
        </a-row>
        <!-- 讲师体系  systemId  级别 levelId -->
        <a-row :gutter="16">
          <a-col :span="12">
            <a-form-item label="讲师体系" name="systemId">
              <a-select disabled  class="draitem" v-model:value="formParam.systemId" placeholder="请选择讲师体系"
                :options="LecturerSystemList">
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="讲师级别"  name="levelId">
              <a-select disabled class="draitem" v-model:value="formParam.levelId" placeholder="请选择讲师级别"
                :options="getLevelList">
              </a-select>
            </a-form-item>
          </a-col>
        </a-row>
        <!-- 内容分类 tlevelName  课程名称 teacherNo  -->
        <a-row :gutter="16">
          <a-col :span="12">
            <a-form-item label="内容分类" name="tlevelName">
              <a-select class="draitem" v-model:value="searchParam.tlevelName" placeholder="内容分类"
                :options="getTeacherExpertiseList">
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="课程名称：" name="teacherNo">
              <a-input class="draitem"  v-model:value="searchParam.teacherNo" 
                placeholder="请输入后搜索面授课" allowClear showSearch>
              </a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <!-- 授课日期 beginTime     开课状态 status -->
        <a-row :gutter="16">
          <a-col :span="12">
            <a-form-item label="授课/课程日期 :" name="beginTime">
              <a-date-picker class="draitem" v-model:value="formParam.beginTime" style="width: 200px"
                format="YYYY-MM-DD" placeholder="请选择课程日期" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="开课状态">
              <a-radio-group v-model:value="formParam.status" class="draitem">
                <a-radio :value="0">未开课</a-radio>
                <a-radio :value="1">已开课</a-radio>
              </a-radio-group>
            </a-form-item>
          </a-col>
        </a-row>
        <!-- 授课时长defaultTeachingTime  评分 score-->
        <a-row :gutter="16">
          <a-col :span="12">
            <a-form-item label="初始授课时长" name="defaultTeachingTime">
              <a-input v-model:value="formParam.defaultTeachingTime" style="width:80%; height: 40px; " placeholder="0"
                allowClear showSearch suffix="分钟">
              </a-input>
              <span v-if="formParam.defaultTeachingTime" style="margin-left: 5px ;">{{ (formParam.defaultTeachingTime /60 ).toFixed(2)}}小时</span>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="评分" name="score">
              <a-input class="draitem" v-model:value="formParam.score"  placeholder="" allowClear
                showSearch>
              </a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <!-- 参训人数 studys-->
        <a-row :gutter="16">
          <a-col :span="24">
            <a-form-item label="参训人数" name="studys">
              <a-input  v-model:value="formParam.studys" class="draitem"
                placeholder="0 " allowClear showSearch>
              </a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <!-- 备注 remark -->
        <a-row :gutter="16">
          <a-col :span="24">
            <a-form-item label="备注">
              <a-textarea v-model:value="formParam.remark" showCount :maxlength="200"
                style="width: 100%; height: 100px; border-radius: 8px" placeholder="请输入" />
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>
      <div :style="{
        position: 'absolute',
        right: 0,
        bottom: 0,
        width: '100%',
        borderTop: '1px solid #e9e9e9',
        padding: '10px 16px',
        background: '#fff',
        textAlign: 'right',
        zIndex: 1,
      }">
        <a-button  class="drabtn"  @click="cancelTeacherDialog">取消</a-button>
        <a-button   class="drabtn" type="primary" @click="createTeacherDialog" :loading="buttonLoading">保存
        </a-button>
      </div>
    </a-drawer>
<!--查看授课详情 -->
<a-drawer v-model:visible="teachingdialog" placement="right"
@closa="cancelTeachingDialog" :maskClosable="true"  width="60%" title="查看讲师授课记录">
<span class="line"></span>
<span>讲师信息</span>
<a-descriptions bordered :column="2" :contentStyle="rowCenter" :labelStyle="rowCenter">
    <a-descriptions-item label="讲师名称">{{formParam.teacher}}</a-descriptions-item>
    <a-descriptions-item label="讲师工号">{{formParam.userNo}}</a-descriptions-item>
    <a-descriptions-item label="讲师组织" :span="2">{{formParam.departId}}</a-descriptions-item>
    <a-descriptions-item label="讲师体系">{{formParam.systemId}}</a-descriptions-item>
    <a-descriptions-item label="讲师级别">{{formParam.levelId }}</a-descriptions-item>
    <a-descriptions-item label="录入方式(未命名)">"未命名"</a-descriptions-item>
    <a-descriptions-item label="课程类型">{{formParam.type==1?'项目开课' :formParam.type==2 ?'路径开课':formParam.type==3 ?'面授开课':''}}</a-descriptions-item>
    <a-descriptions-item label="课程名称">{{formParam.name}}</a-descriptions-item>
    <a-descriptions-item label="开课状态">{{formParam.status==0?'未开课' :formParam.status==1 ?'已开课':''}}</a-descriptions-item>
    <a-descriptions-item label="授课时长  ">{{formParam.duration}}</a-descriptions-item>
    <a-descriptions-item label="授课/课程日期  ">{{formParam.beginTime}}</a-descriptions-item>
    <a-descriptions-item label="参训人数  ">{{formParam.studys}}</a-descriptions-item>
    <a-descriptions-item label="评分  ">{{formParam.score}}</a-descriptions-item>
    <a-descriptions-item label="内容分类  ">{{formParam.teaching}}</a-descriptions-item>
    <a-descriptions-item label="备注  ">{{formParam.remark}}</a-descriptions-item>
  </a-descriptions>
  <span class="line"></span>
<span>讲师费发放情况</span>
  <div :style="{
        position: 'absolute',
        right: 0,
        bottom: 0,
        width: '100%',
        borderTop: '1px solid #e9e9e9',
        padding: '10px 16px',
        background: '#fff',
        textAlign: 'right',
        zIndex: 1,
      }">
        <a-button  class="drabtn"  @click="cancelTeachingDialog">取消</a-button>
        <a-button   class="drabtn" type="primary" @click="cancelTeachingDialog" :loading="buttonLoading">返回
        </a-button>
      </div>
</a-drawer>
    <!-- 删除功能弹窗 -->
    <div>
      <a-modal v-model:visible="deleteTeacherdialog" :footer="null" :closable="close" wrapClassName="canclestu1"
        centered="true">
        <div class="delete">
          <div class="del_header"></div>
          <div class="del_main">
            <div class="header">
              <div class="icon1"></div>
              <span>提示</span>
            </div>
            <div class="body">
              <span>您确定要删除此条记录吗</span>
            </div>
            <div class="del_btnbox">
              <div class="del_btn btn2" @click="cancelTeachDialog" style="margin-right: 32px">
                <div class="btnText">取消</div>
              </div>
              <div class="del_btn btn2" @click="closeDeleteTeacher">
                <div class="btnText">确定</div>
              </div>
            </div>
          </div>
        </div>
      </a-modal>
    </div>
    <!-- <div> <ImageUpload/> </div>         -->
  </div>
</template>
<script lang="jsx">
import { reactive, toRefs, ref } from "vue";
import moment, { Moment } from 'moment';
import { useRouter } from "vue-router";
import {
  RightOutlined,
  UpOutlined,
  UploadOutlined,
  FolderAddOutlined,
  DownloadOutlined
} from '@ant-design/icons-vue';
import dayjs from "dayjs";
// import Editor from "@/components/project/Editor";
// import ImageUpload from "@/components/project/ImageUpload";
import { message } from "ant-design-vue";
import { getTeacherSystemList, infoteacher, getTeacherExpertise, deleteInTeacherCourse } from "../../api/Lecturer";
import { getNewInTeacherCourseList, getOrganization, getTeacherCourseList, insertInTeacherCourse, updateInTeacherCourse } from "../../api/Teaching";
// import AddTeacher from "../../components/drawers/project/AddTeacher"
export default {
  name: "InsideTeaching",
  components: {
    // AddTeacher,
    // Editor,
    // ImageUpload
    RightOutlined, //图标--展开
    UpOutlined,//图标--收起
    UploadOutlined,//图标--导出
    DownloadOutlined,//图标-导入
    FolderAddOutlined,//图标--新增
  },
  setup() {
    const router = useRouter();
    const state = reactive({
      moreid: 1,
      currentPage1: 1,
      pageSize1: 10,
      tableLoading: false,
      delTeacherId: null, //删除id确认
      userNoid: null,    //详情工号确认 
      lookTeacherId: null, //详情id确认
      deleteTeacherdialog: false, //删除弹窗
      teacherdialog1: null,
      teacherdialog: false,  //控制讲师弹窗
      teacherdialogtitle: '',//讲师弹框title内容
      teachingdialog:false,//控制查看抽屉
      pageSizeOptions: ['10', '20', '30', '50'], //下拉选择每页显示多少条
      pageSize: 10,
      tableDataTotal: -1,//table列表总条数
      searchdate: null, //选择时间
      startTime: null, //开始时间
      endTime: null, //结束时间
      formParam: {
        status: 1
      },
      searchParam: {
        userNo: null,//工号姓名
        teacherNo: null,//课程编号
        tsystemName: null,//讲师体系
        payrollPlaceName: null,//发薪地
        pageNo: "1",
        pageSize: "10",
        startDate: null,
        endDate: null,
      },
    })

    //获取所属组织
    const getOrganizationList = ref([
      //   { value: 0, systemName: "讲师体系" },
    ]);
    //获取所属组织
    const getOrganizationLista = () => {
      // console.log('getOrganizationList')
      getOrganization().then((res) => {
        if (res.data.code === 200) {
          let arr = res.data.data;
          let array = [];
          arr.map((value) => {
            let obj = {
              value: value.departId,
              label: value.orgName,
            };
            array.push(obj);
          });
          getOrganizationList.value = array;
        }
      })
    }
    getOrganizationLista()
    const LecturerSystemList = ref([
      //   { value: 0, systemName: "讲师体系" },
    ]);
    //获取讲师体系列表
    const LecturerSystemLista = () => {
      // console.log('点击了LecturerSystemLista')
      getTeacherSystemList().then((res) => {
        if (res.data.code === 200) {
          let arr = res.data.data;
          let array = [];
          arr.map((value) => {
            let obj = {
              value: value.id,
              label: value.name,
            };
            array.push(obj);
          });
          LecturerSystemList.value = array;
        }
        console.log("获取讲师", LecturerSystemList);
      })
    }
    LecturerSystemLista()
    //获取内容分类
    const getTeacherExpertiseList = ref([
      // { value: 0, label: "未定级" },
    ])
    const getTeacherExpertiseLista = () => {
      getTeacherExpertise().then((res) => {
        if (res.data.code === 200) {
          let arr = res.data.data;
          let array = [];
          arr.map((value) => {
            let obj = {
              value: value.id,
              label: value.name,
            };
            array.push(obj);
          });
          getTeacherExpertiseList.value = array;
        }
      })
    }
    getTeacherExpertiseLista()
    const OnTheJobStatusList = ref([
      { value: 1, label: "项目开课" },
      { value: 2, label: "路径开课" },
      { value: 3, label: "面授开课" },
    ])
    const AuthenticationStatusList = ref([
      { value: 0, label: "未开课" },
      { value: 1, label: "已开课" },
    ])
    const columns = ref([

      // {
      //   title: '课程编号 ',
      //   dataIndex: 'userNo',
      //   key: 'userNo',
      //   elipsis: true, align: "center",
      //   width: 120,
      // },
      {
        title: '讲师姓名 ',
        fixed: 'left',
        dataIndex: 'teacher',
        key: 'teacher',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '讲师工号 ',
        dataIndex: 'userNo',
        key: 'userNo',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '讲师体系 ',
        dataIndex: 'systemName',
        key: 'systemName',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '所属组织 ',
        dataIndex: 'orgName',
        key: 'orgName',
        elipsis: true, align: "center",
        //  customRender: (value, record) => {
        //   return (
        //     <div>
        //       {value.record.orgName}
        //     </div>
        //   )
        // }
      },
      {
        title: '数据来源(未命名) ',
        dataIndex: 'systemName',
        key: 'systemName',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '课程名称 ',
        dataIndex: 'name',
        key: 'name ',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '课程类型 ',
        dataIndex: 'type',
        key: 'type',
        elipsis: true, align: "center",
        width: 120,
        customRender: (value) => {
          return (
            <div>
              {value.record.type == "1" || value.record.type == "2" || value.record.type == "3"
                ? {
                  "1": "项目开课",
                  "2": "路径开课",
                  "3": "面授开课",
                }[value.record.type + ""] || ""
                : "-"}
            </div>
          )
        }
      },
      {
        title: '授课/课程日期 ',
        dataIndex: 'beginTime',
        key: 'beginTime',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '开课状态 ',
        dataIndex: 'status',
        key: 'status',
        elipsis: true, align: "center",
        width: 120,
        customRender: (value) => {
          return (
            <div>
              {value.record.status == 0 || value.record.status == 1
                ? {
                  "0": "未开课",
                  "1": "已开课",
                }[value.record.status + ""] || ""
                : "-"}
            </div>
          )
        }
      },
      {
        title: '内容分类',
        dataIndex: 'teaching',
        key: 'teaching',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '授课时长(H) ',
        dataIndex: 'duration',
        key: 'duration',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '参训人数',
        dataIndex: 'studys',
        key: 'studys',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '评分',
        dataIndex: 'score',
        key: 'score',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '是否生成课时费 ',
        dataIndex: 'feeCreated',
        key: 'feeCreated',
        elipsis: true, align: "center",
        width: 120,
        customRender: (value) => {
          return (
            <div>
              {value.record.feeCreated == 0 || value.record.feeCreated == 1
                ? {
                  "0": "否",
                  "1": "是",
                }[value.record.feeCreated + ""] || ""
                : "-"}
            </div>
          )
        }
      },
      {
        title: '操作 ',
        dataIndex: 'operation',
        key: 'operation',
        elipsis: true, align: "center",
       
        fixed: "right",
        scopedSlots: { customRender: "action" },
      },
    ])
    //列表数据
    const tableData = ref([

    ])
    //展开切换
    const handlemoreid = () => {
      if (state.moreid == 1) {
        state.moreid = 2
      }
      else if (state.moreid == 2) {
        state.moreid = 1
        state.searchParam.type = null
        state.searchParam.status = null
        state.searchParam.departId = null
        state.searchParam.systemId = null
        state.searchParam.tlevelName = null
      }
    }
    // 搜索
    const searchSubmit = () => {
      getTableDate();
    };
    //修改时间
    const searchTimeChange = (e, date) => {
      let startTime = date[0] + " 00:00:00";
      let endTime = date[1] + " 23:59:59";
      state.startTime = new Date(startTime).getTime();
      state.endTime = new Date(endTime).getTime();
      // state.searchParam.startDate = new Date(startDate).getTime() ;
      // state.searchParam.endDate = new Date(endDate).getTime() ;
      state.searchParam.startDate = state.startTime ? state.startTime : null,
        state.searchParam.endDate = state.endTime ? state.endTime : null
    };
    //重置
    const searchReset = () => {
      state.searchParam = {
        pageNo: 1,
        pageSize: 10,
        name: null,
        offcourseId: null,
        departId: null,
        systemId: null,
        beginTime: null,
        type: null,
        status: null
      };
      getTableDate();
    };
    //  List接口数据
    const getTableDate = (obj) => {
      state.tableLoading = true
      let objA = { ...state.searchParam };
      objA.startDate = state.searchParam.startDate !== null ? dayjs(new Date(state.searchParam.startDate).getTime()).format("YYYY-MM-DD") : "",
        objA.endDate = state.searchParam.endDate !== null ? dayjs(new Date(state.searchParam.endDate).getTime()).format("YYYY-MM-DD") : "",
        getNewInTeacherCourseList(objA)
          .then((res) => {
            tableData.value = res.data.data.records
            state.tableDataTotal = Number(res.data.data.total);
            state.tableLoading = false
            console.log("获取tableData", tableData);
          })
    };
    getTableDate()

    //   // 翻页
    const changePagination = (page, pageSize) => {
      state.searchParam.pageNo = page;
      state.currentPage1 = page;
      state.pageSize1 = pageSize;
      getTableDate();
    };
    // 新增授课
    const addTeacher = () => {
      state.teacherdialog1 = 0
      state.teacherdialog = true;
      state.teacherdialogtitle = '添加授课记录'
      //获取内部讲师级别

    }
    //修改信息弹窗
    const handleModify = (record) => {
      // state.teacherdialog1 = 0
      state.teacherdialog = true;
      state.teacherdialogtitle = '修改授课记录'
      state.lookTeacherId = record.teacherId
      TeacherSystem()
    }
    //保存
    const createTeacherDialog = () => {
      if (state.formParam.offcourseId != null) {
        updateInTeacherCourse(state.formParam).then(response => {
          message.success("修改成功");
        });
      }
      else {
        insertInTeacherCourse(state.formParam)
          .then((res) => {
            message.success("保存成功");
          }).catch((err) => {
            console.log(err);
          });
      }
      getTableDate();
      state.teacherdialog = false
    }
    //删除弹窗
    const deleteModal = (record) => {
      state.deleteTeacherdialog = true
      state.delTeacherId = record.offcourseId

    };

    //确认删除
    const closeDeleteTeacher = () => {
      //调用删除接口
      deleteInTeacherCourse(state.delTeacherId).then((res) => {
        if (res.data.code == 200) {
          message.success("删除成功");
          state.deleteTeacherdialog = false
          getTableDate();
        }
      })
    }

    //取消按钮 清空输入的数据
    const cancelTeacherDialog = () => {
      if (state.teacherdialog = true) {
        state.teacherdialog = false
        cancel()
      }
      state.deleteTeacherdialog = false
    };

    //清空数据
    const cancel = () => {
      state.formParam = {
        teacher: null,
        userNo: null,
        departId: null,
        defaultTeachingTime: null,
        tlevelName: null,
        name: null,
        beginTime: null,
        duration: null,
        studys: null,
        score: null,
        type: null,
        remark: null,
        offcourseId: null
      }

    }
    //页面内部姓名
    const infoteacherList = ref([
    ]);
    const getinfoteacher = (obj) => {
      state.tableLoading = true
      infoteacher()
        .then((res) => {
          infoteacherList.value = res.data.data.records
        })
    };

    //表格内查看数据操作
    const handleLook = (record) => {
      // state.teacherdialog1 = 1
      state.teachingdialog = true;
      state.teacherdialogtitle = '查看详情'
      // state.userNoid = record.userNo
      state.lookTeacherId = record.teacherId
      // // alert(record.grade)
      TeacherSystem()
      // let id = record.userNo
      // router.push({ path: '/insideteachingdetail', query: { id  } })
      // router.push({ path: '/InsideTeachingDetail' })
    }
    const cancelTeachingDialog =()=>{
      state.teachingdialog = false;
    }
    //内部授课详情
    const TeacherSystem = () => {
      getTeacherCourseList( state.lookTeacherId).then((res) => {
          console.log("内部授课详情", res.data);
          state.formParam= res.data.data
      }) 
      .catch((err) => {
          console.log("内部授课详情", err);
        });
      // state.formParam = {
      //   name: record.name,
      //   userNo: record.userNo,
      //   orgName:record.orgName,
      //   departId: record.departId,
      //   levelId: record.levelId,
      //   tlevelName: record.tlevelName,
      //   teacherNo: record.teacherNo,
      //   beginTime: moment(record.beginTime, 'YYYY-MM-DD'),
      //   // ref< moment.Moment >(moment(record.beginTime,'YYYY-MM-DD')),
      //   //  record.beginTime,
      //   status: record.status,
      //   defaultTeachingTime: record.defaultTeachingTime,
      //   studys: record.studys,
      //   remark: record.remark,
      // }
    }
    //导出功能
    const handleExport = () => {
      window.open(
        `${process.env.VUE_APP_BASE_API}/lesson_records/export?pageNo=${state.currentPage1
        }&pageSize=${state.pageSize1}
        &userNo=${state.searchParam.userNo ? state.searchParam.userNo : ""}
        &teacherNo=${state.searchParam.teacherNo ? state.searchParam.teacherNo : ""}
        &departId=${state.searchParam.departId ? state.searchParam.departId : ""}
        &systemId=${state.searchParam.systemId ? state.searchParam.systemId : ""}
        &startDate=${state.searchParam.startDate ? state.searchParam.startDate : ""}
        &endDate=${state.searchParam.endDate ? state.searchParam.endDate : ""}
        &tlevelName=${state.searchParam.tlevelName ? state.searchParam.tlevelName : ""}
        &type=${state.searchParam.type ? state.searchParam.type : ""}
        &status=${state.searchParam.status ? state.searchParam.status : ""}`)
    }
    return {
      ...toRefs(state),
      handlemoreid,
      infoteacherList,
      getinfoteacher,
      handleExport,
      LecturerSystemList,
      getTeacherExpertiseList,
      OnTheJobStatusList,
      getTeacherExpertiseLista,
      AuthenticationStatusList,
      searchSubmit,
      searchReset,
      columns,
      tableData,
      changePagination,
      addTeacher,
      cancelTeacherDialog,
      handleLook,
      cancel,
      deleteModal,
      handleModify,
      closeDeleteTeacher,
      createTeacherDialog,
      getTableDate, //list接口数据调用
      // getStu
      LecturerSystemLista,
      TeacherSystem,
      getOrganizationLista,
      getOrganizationList,searchTimeChange,
      cancelTeachingDialog
    }
  },
};
</script>
<style lang="scss" scoped >
.select .ant-picker {
  width: 410px !important;
}

.addTimeBox {
  position: relative;
  display: flex;
  align-items: center;

  .addTime {
    position: absolute;
    z-index: 10;
    margin-left: 10px;
    color: rgba(0, 0, 0, 0.4);
  }
}

//导出按钮icon
.daochu {
  width: 16px;
  height: 18px;
  background-image: url("../../assets/images/coursewareManage/export1.png");
}

//弹窗内详情样式
.display1 {
  display: inline-block;
  width: 200px;
}

// .display0{
// display:inline-block ;
// width:200px ;
// text-align: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;
    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;
  }
}

.ant-table-cell-fix-right {
  width: 300px !important;
}

.ant-table-tbody>tr>td {
  text-align: center;
}

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


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

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

.delete {
  z-index: 9999;
  width: 424px;
  background: #ffffff;
  box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
  border-radius: 4px;
  position: absolute;
  left: 30%;
  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-icon {
        width: 16px;
        height: 16px;
        margin-right: 10px;
        background-image: url(@/assets/images/coursewareManage/notice.png);
        background-size: 100% 100%;
      }

      .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%;
      }
    }

    .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;
      }
    }
  }
}

.CreatePath {
  .out {
    z-index: 9999;
    display: block;
    position: absolute;
    top: 90px;
    width: 1080px !important;
    height: 650px;
    overflow: auto;
    background-color: #fff;

    box-shadow: 0 0 10px rgba(118, 136, 166, 0.21);
    left: 50%;
    top: 300px;
    transform: translate(-50%, -50%);

    .top {
      width: 100%;
      height: 68px;

      background: linear-gradient(rgba(78, 166, 255, 0.2) 0%,
          rgba(78, 166, 255, 0) 100%);
      display: flex;
      align-items: center;

      .topimg {
        width: 18px;
        height: 18px;
        margin-left: 27px;
        margin-top: -2px;
      }

      .topc {
        color: #000000;
        font-size: 16px;
        margin-left: 8px;
      }
    }

    .mid {
      width: 100%;
      height: 100%;
      background-color: #fff;
      display: flex;
      flex-direction: column;
      align-items: center;

      .d {
        // margin-top: 8px;
        // color: #ff4e4e;
        margin-left: -5px;
      }
    }
  }
}

//添加样式
.langbtn {
  height: 40px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 14px;
  flex-shrink: 0;
  cursor: pointer;
}

// 重置样式
.resetbtn {
  width: 100px;
  height: 40px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 14px;
  flex-shrink: 0;
  cursor: pointer;
}

//展开收起样式
.moreidbtn {
  border: none;
  color: #4ea6ff;
  width: 80px
}

//小竖线
.line {
  float: left;
  width: 3px;
  height: 25px;
  background: #4ea6ff;
  border-radius: 30%;
  margin-right: 5px;
}

//抽屉功能
.drawaer

// /* 改变所有 a-tree-select 输入框的高度 */
//   ::v-deep  .ant-select:not(.ant-select-customize-input) .ant-select-selector{
//   height: 40px;
//   line-height: 40px;
//   border-radius: 8px

//   /* 确保文字垂直居中 */
// }
::v-deep .ant-select-single:not(.ant-select-customize-input) .ant-select-selector{
  height: 40px !important;
  line-height: 40px;
  border-radius: 8px
}
// 抽屉内样式
.draitem{
 width: 100%;
  height: 40px !important; 
  border-radius: 8px;
  line-height: 40px;
}
.drabtn{
  height:40px;
  width:80px;
  border-radius:8px;
  margin-right:20px
}
</style>