<!-- 内部讲师 -->
<template>
  <div >
    <!-- 搜索框及按钮 -->
    <div class="filter" style="min-width: 1270px;">
      <a-form   layout="inline">
        <a-form-item class="select">
          <div  style="width: 276px; height: 40px; border-radius: 8px"  >
          <ProjectManager v-model:value="searchParam.userNo" 
        v-model:name="searchParam.name"
        placeholder="请输入工号/讲师姓名进行检索"
                            @onChange="managerChange" mode="multiple"></ProjectManager>
                            </div>
          <!--  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-tree-select
								:fieldNames="{
									children: 'children',
									label: 'name',
									value: 'code',
								}"
								allow-clear
								:getPopupContainer="triggerNode => triggerNode.parentNode || document.body"
								v-model:value="valueproj" 
								show-search 
								:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
								placeholder="请选择内容分类" 
								tree-default-expand-all 
								:tree-data="sysTypeOptions">
							</a-tree-select> -->
        </a-form-item>
        <a-form-item class="select">
          <a-select style="width: 276px" placeholder="请选择讲师体系" v-model:value="searchParam.systemid" allowClear
            :options="LecturerSystemList" @change="changetlevel">
          </a-select>
        </a-form-item>
        <a-form-item class="select">
          <a-select style="width: 276px" v-model:value="searchParam.tlevelId" placeholder="请选择讲师级别" allowClear 
            :options="getLevelList" :disabled="getLevelList.length!==0 ? false:true" > 
          </a-select>
        </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 v-if="moreid == 2" class="select">
          <a-select style="width: 276px ;margin-bottom:20px" v-model:value="searchParam.waitStatus" placeholder="在职状态"
            :options="OnTheJobStatusList" allowClear>
          </a-select>
        </a-form-item>
        <a-form-item v-if="moreid == 2" class="select">
          <a-select style="width: 276px ;" v-model:value="searchParam.certStatus" placeholder="认证状态" allowClear
            :options="AuthenticationStatusList">
          </a-select>
        </a-form-item>
        <a-form-item v-if="moreid == 2" class="select">
          <a-select style="width: 276px " v-model:value="searchParam.certStatus" placeholder="擅长课程" allowClear
            :options="AuthenticationStatusList">
          </a-select>
        </a-form-item>
        <!-- <a-form-item v-if="moreid == 2" class="select">
          <a-select style="width: 276px ;margin-bottom:20px" v-model:value="searchParam.payrollPlaceId" placeholder="发薪地" allowClear
            :options="PlaceOfPayList">
          </a-select>
        </a-form-item> -->
        <!-- <div class="select">
          <a-select style="width: 276px" v-model:value="searchParam.status" placeholder="账号状态"
            :options="AccountStatusList">
          </a-select>
        </div> -->
      </a-form>
      <div style="width: 100%;"></div>
      <div style="display: flex; margin-bottom: 20px">
        <a-button @click="addTeacher()" type="primary" class="resetbtn">
          <FolderAddOutlined /> 新增讲师
        </a-button>
        <div style="margin-left: 20px ;">
          <a-button @click="handleExport()" class="resetbtn">
            <UploadOutlined /> 导出
          </a-button>
        </div>
      </div>
      <!-- 表格 -->
      <div style="padding: 10px 0">
        <a-table style="border: 1px solid #f2f6fe" :columns="columns" :data-source="tableData" :loading="tableLoading"
          @expand="expandTable" :pagination="false">
          <template #bodyCell="{ record, column }">
            <template v-if="column.key === 'operation'">
              <a-space >
                <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 v-if="record.status == '1'" type="link"
                  @click="() => handleOperate(record, String(record.courseform))">停用</a-button>
                <a-button v-if="record.status == '2'" type="link"
                  @click="() => handleOperate(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>
    <div class="tableBox ">
      <div style="float: right;">

        <a-pagination
          v-if="tableDataTotal > 10"
        :showSizeChanger="false"
        :showQuickJumper="true"
        :hideOnSinglePage="true"
        :pageSize="searchParam.pageSize"
        :current="searchParam.pageNo"
        :total="tableDataTotal"
        class="pagination"
        @change="changePagination"
      />
      </div>
    </div>
    <!-- 弹窗组件 -->
    <a-drawer v-model:visible="teacherdialog" placement="right" @closa="cancelTeacherDialog" :maskClosable="true"
    width="60%"  :title="teacherdialogtitle">
      <a-form :model="formParam" :rules="rules" layout="vertical">
        <!-- 基本信息 -->
        <a-row>
          <a-col :span="24">
          <span class="line"></span><span>基本信息</span>
        </a-col>
        </a-row>
           <!-- 头像 -->
        <a-row :gutter="16">
          <a-col :span="24">
            <div class="item_inp" style="background-color: #fff;">
              <a-upload name="avatar" list-type="picture-card" class="avatar-uploader" :show-upload-list="false"
                        :headers="headers"
                :before-upload="beforeUpload">
                <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">
                <div class="tip" style="margin-bottom: 10px;">
                  <span style="color: #999999; margin-left: 8px">支持图片格式为jpg/jpeg/png 图片最大为2MB</span>
                </div>
              </div>
            </div>
          </a-col>
        </a-row>
        <!-- 讲师名称、组织 -->
        <a-row :gutter="16">
          <a-col :span="12">
            <a-form-item label="讲师名称" name="name">
        
          <ProjectManager v-model:value="formParam.userNo" 
        v-model:name="formParam.name"
        placeholder="请输入工号/讲师姓名进行检索"
                            @onChange="managerChange" mode="multiple"></ProjectManager>
              <!-- <SearchTeacher v-model:value="formParam.name"></SearchTeacher>        -->
              <!-- <a-tree-select v-model:value="formParam.name" 
              show-search    allow-clear 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>
        <!-- 讲师级别 体系-->
          <a-row :gutter="16">
            <a-col :span="12">
            <a-form-item label="讲师体系" name="tsystemId">
              <a-select  class="draitem" v-model:value="formParam.tsystemId" placeholder="请选择讲师体系" allowClear
              @change="changetlevel"
                :options="LecturerSystemList">
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="讲师级别" name="tlevelId">
              <a-select class="draitem" v-model:value="formParam.tlevelId" placeholder="请选择讲师级别" allowClear
              :disabled="getLevelList.length!==0 ? false:true"
                :options="getLevelList">
              </a-select>
            </a-form-item>
          </a-col>
        </a-row>
        <!-- 初始时长 、认证 -->
        <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; border-radius: 8px; " placeholder="0"
                allowClear showSearch suffix="分钟">
              </a-input>
              <span  style="margin-left: 5px ;" v-if="formParam.defaultteachingTime!= null">{{ (formParam.defaultteachingTime /60 ).toFixed(2)}}小时</span>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="认证状态" name="certStatus">
              <a-radio-group  v-model:value="formParam.certStatus" 
              class="draitem">

                  <a-radio :value="0">未认证</a-radio>
                  <a-radio :value="1">已认证</a-radio>
                  <span>
                    <a-upload
                      multiple
                      :headers="headers"
                      :show-upload-list="false"
                      :before-upload="beforeUpload2"
                    >
                        <a-button type="text" class="moreidbtn" v-if="formParam.certStatus==1">上传凭证</a-button>
                    </a-upload>
                    
                    <!-- <span>
                      支持.pdf,.ppt,.pptx,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png,.gif,.zip
                    </span> -->
                  </span>
                </a-radio-group>
              <!-- <FJUpload  v-if="formParam.certStatus==1" v-model:value="formParam.workEnclosureAddress"/> -->
            </a-form-item>
            </a-col>
        </a-row>
        <!-- 其他信息 -->
        <a-row>
          <a-col :span="24">
          <span class="line" ></span><span>其他信息</span>
        </a-col>
        </a-row>
        <!-- 讲师介绍 -->
        <a-row :gutter="16">
          <a-col :span="24">
            <a-form-item label="讲师介绍">
              <Editor v-model="formParam.description "/>
            </a-form-item>
          </a-col>
        </a-row>
        <!-- 工作经历 -->
        <a-row :gutter="16">
          <a-col :span="24">
            {{ formParam.workExperience }}
            <a-form-item label="工作经历">
              <Editor v-model:value="formParam.workExperience" :isupload="isupload"/>
            </a-form-item>
          </a-col>
        </a-row>
        <!-- 擅长课程 -->
        <a-row :gutter="16">
          <a-col :span="24">
            <a-form-item label="擅长课程">
              <Editor v-model="formParam.courses "/>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row :gutter="50" style="margin-bottom: 50px;">
          <a-col :span="2">
      <a-tag color="blue" style="line-height: 40px; ">管理业务</a-tag>
      </a-col>
      <a-col :span="20">
      <div class="add_content" @click="addContentData" >+</div>
      </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>

    <!-- 删除功能弹窗 -->
    <div>
      <a-modal v-model:visible="deleteInTeacherdialog" :footer="null" :closable="close"
        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="cancelTeacherDialog" 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>
      <a-modal v-model:visible="editTeacher" :footer="null" :closable="close"  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 v-if="handleOperate1 == 2">您确定要启用此讲师状态吗</span>
              <span v-if="handleOperate1 == 1">您确定要停用此讲师状态吗</span>
            </div>
            <div class="del_btnbox">
              <div class="del_btn btn2" @click="cancelTeacherDialog" style="margin-right: 32px">
                <div class="btnText">取消</div>
              </div>
              <div class="del_btn btn2" @click="closehandleOperate">
                <div class="btnText">确定</div>
              </div>
            </div>
          </div>
        </div>
      </a-modal>
    </div>
    <AddContent v-model:showContent="showContent" @AddContentList="AddContentList" :Addtitle="Addtitle" />
    <!-- <div> <Upload/> </div>         -->
  </div>
</template>
<script lang="jsx">
import { reactive, toRefs, ref, watch } from "vue";
import {
  RightOutlined,
  UpOutlined,
  UploadOutlined,
  FolderAddOutlined
} from '@ant-design/icons-vue';
import Editor from "@/components/project/Editor";
import ProjectManager from "@/components/project/ProjectManagerNew";
import SearchTeacher from "@/components/project/SearchTeacher";
import { message } from "ant-design-vue";
import { useRouter } from "vue-router";
import { getTeacherSystemList, getTeacherList, getPayRollPlace, getLevel, insertTeacher, deleteInTeacher, updateInTeacher, getTeacherById, updateTeacherState } from "../../api/Lecturer"; 
import { fileUp } from "../../api/indexEval";
import {getCookieForName} from "@/api/method";
// import {getProjSt} from "../../api/indexProjStu";
import AddContent from "../../components/project/AddContent.vue"
export default {
  name: "InsideLecturer",
  components: {
    ProjectManager,
    SearchTeacher,
    AddContent,
    Editor,
    // FJUpload,
    RightOutlined, //图标--展开
    UpOutlined,//图标--收起
    UploadOutlined,//图标--导出
    FolderAddOutlined,//图标--新增
  },
  setup() {
    const router = useRouter();
    const state = reactive({
      Addtitle:'选择教师专长',
      showContent: false,
      moreid: 1,
      byPid: null,
      currentPage1: 1,
      pageSize1: 10,
      tableLoading: false,
      tagsshow: "1",
      PlaceOfPayList: [],
      LecturerSystemList: [],
      delTeacherId: null, //删除id确认
      editTeacherid: null,//修改状态id确认
      newStatus: null, //修改状态码确认
      id : null,    //内部讲师详情工号确认 
      lookTeacherId: null, //内部讲师详情id确认
      deleteInTeacherdialog: false, //删除弹窗
      editTeacher: false,   //修改状态弹窗
      handleOperate1: null, //修改状态弹窗内容
      teacherdialog1: null,
      teacherdialog: false,  //控制讲师弹窗
      teacherdialogtitle: '',//讲师弹框title内容
      pageSizeOptions: ['10', '20', '30', '50'], //下拉选择每页显示多少条
      pageSize: 10,
      tableDataTotal: -1,//table列表总条数
    
      formParam: {
        userNo:null,
        certStatus: 0,//认证状态
        defaultteachingTime: '0',
        vf:true
      },
      searchParam: {
        name:null,
        userNo: null,
        systemid: null,
        tlevelId: null,
        waitStatus: null,
        certStatus: null,
        salaryName: null,
        payrollPlaceId: null,
        status: null,
        pageNo: "1",
        pageSize: "10"
      },
      teacherrepromo: {
        pageNo: "1",
        pageSize: "10",
        userNo: null
      },
      activeName: 'first'
    })
    const headers = { token: getCookieForName("token") };
    //图片上传
    const imageUrl = ref('')
    const beforeUpload = (file) => {
  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 false;
  }
watch(()=>state.formParam.workExperience,(val)=>{
  console.log(val,'11111')
})
  let isLt1M = file.size < 2000000;
  console.log(file.size, isLt1M)
  if (!isLt1M) {
    message.error("图片大小超过2MB!");
    return false;
  }

  const formDatas = new FormData();
  formDatas.append("file", file);
  console.log("file", file)
  fileUp(formDatas).then((res) => {
    if (res.data.code === 200) {
      console.log(res.data.data, 45);
      imageUrl.value = process.env.VUE_APP_FILE_PATH + res.data.data;

      // state.hasImgName = file.name;
      // emit("src", { id: '', src: res.data.data });
    }
  });
  return 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;
      }

      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 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.kid,
              label: value.systemName,
            };
            array.push(obj);
          });
          LecturerSystemList.value = array;
        }
        console.log("获取讲师", LecturerSystemList);
      })
    }
    const isupload = (val)=>{
console.log(val,'val')

    }
    const addContentData = () => {
      state.showContent = true
    }
    const AddContentList = (data) => {
      console.log(data,'treedatalist')
   [   {
    title: 'parent 1',
    key: '0-0',
    children: [
      {
        title: 'parent 1-0',
        key: '0-0-0',
        disabled: true,
        children: [
          { title: 'leaf', key: '0-0-0-0', disableCheckbox: true },
          { title: 'leaf', key: '0-0-0-1' },
        ],
      },
      {
        title: 'parent 1-1',
        key: '0-0-1',
        children: [{ key: '0-0-1-0', slots: { title: 'title0010' } }],
      },
    ],
  }]
      //组件获取返回的所有值，调用以前接口，现环境不可用，示例：
      // [{
      //   "id": "966459050400600064",
      //   "sysCreateAid": "952948872212635648",
      //   "sysCreateBy": "董瑞华",
      //   "sysCreateTime": "2022-04-20 22:03:13",
      //   "sysUpdateTime": "2022-04-20 22:03:13",
      //   "sysUpdateBy": "董瑞华",
      //   "sysVersion": 0,
      //   "deleted": false,
      //   "name": "研发",
      //   "parentId": "966458733088919552",
      //   "filter": true,
      //   "orderIndex": 2,
      //   "origin": 2,
      //   "status": 1,
      //   "total": 0,
      //   "sysResType": 1,
      //   "children": "",
      //   "parentName": "专业力",
      //   "resDataManager": "",
      //   "code": "966459050400600064",
      //   "value": "966459050400600064"
      // }]
    }
    LecturerSystemLista()
    //获取内部讲师级别
    const getLevelList = ref([
      // { value: 0, label: "未定级" },
    ])
    const changetlevel = (val) => {
console.log( "讲师体系id" +val);
      getLevel( {kid:val}).then((res) => {
        if (res.data.code === 200) {
          let arr = res.data.data;
          let array = [];
          arr.map((value) => {
            let obj = {
              value: value.levelCode,
              label: value.levelName,
            };
            array.push(obj);
          });
          getLevelList.value = array;
        }
      })
    }
    changetlevel()
    const OnTheJobStatusList = ref([
      { value: 0, label: "在职" },
      { value: 1, label: "离职" },
    ])
    const AuthenticationStatusList = ref([
      { value: 0, label: "未认证" },
      { value: 1, label: "已认证" },
    ])
    const PlaceOfPayList = ref([
      // { value: 0, label: "发薪地B1" },
    ])
    //获取讲师发薪地列表
    const PlaceOfPayLista = () => {
      getPayRollPlace().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);
          });
          PlaceOfPayList.value = array;
        }
      })
    }
    PlaceOfPayLista()
    const AccountStatusList = ref([
      { value: 1, label: "启用" },
      { value: 2, label: "停用" },
    ])
    // const teacheExpertiseList = ref([
    // ])

    // //获取讲师父 专长
    // const TeacherExpertiseList = ref([
    // ]);
    // const getTeacherExpertisea = () => {
    //   // console.log('点击了LecturerSystemLista')
    //   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);
    //       });
    //       TeacherExpertiseList.value = array;
    //     }
    //   })
    // }
    // getTeacherExpertisea()
    // const changeSelect = (val) => {
    //   state.byPid = val
    //   getTeacherExpertiseByPida(val)
    //   state.formParam.expertise = getTeacherExpertiseByPidList[0]
    // }
    //获取讲师子 专长
    // const getTeacherExpertiseByPidList = ref([
    // ]);
    // const getTeacherExpertiseByPida = () => {
    //   // let pid = {id :val}
    //   // console.log('点击了LecturerSystemLista')
    //   let id = val
    //   getTeacherExpertiseByPid(state.byPid).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);
    //       });
    //       getTeacherExpertiseByPidList.value = array;
    //     }
    //   })
    // }
    // watch(
    // )
    //新增页面内部姓名
    const infoteacherList = ref([
      //   { value: 0, systemName: "讲师体系" },
    ]);
    const getinfoteacher = () => {
      // state.tableLoading=true 
      // ()
      //   .then((res) => {
      //     infoteacherList.value = res.data.data.records
      // }) 
    };
    //展开切换
    const handlemoreid = () => {
      if (state.moreid == 1) {
        state.moreid = 2
      }
      else if (state.moreid == 2) {
        state.moreid = 1
        state.searchParam.waitStatus = null
        state.searchParam.certStatus = null 
        state.searchParam.payrollPlaceId = null
      }
    }
    const columns = ref([
      {
        title: '讲师姓名 ',
        dataIndex: 'name',
        key: 'name',
        elipsis: true,
        align: "center",
        width: 100,
      },
      {
        title: '讲师工号 ',
        dataIndex: 'userNo',
        key: 'userNo',
        elipsis: true,
        align: "center",
        width: 100,
      },
      {
        title: '所属组织 ',
        dataIndex: 'departId',
        key: 'departId',
        elipsis: true, align: "center",
        width: 400,
        //  customRender: (value, record) => {
        //   return (
        //     <div>
        //       {value.record.orgName}
        //     </div>
        //   )
        // }
      },
      {
        title: '讲师体系 ',
        dataIndex: 'tsystemName',
        key: 'tsystemName',
        elipsis: true, align: "center",
        width: 100,
      },
      {
        title: '级别 ',
        dataIndex: 'tlevelName',
        key: 'tlevelName',
        elipsis: true, align: "center",
        width: 100,
      },
      {
        title: '发薪地 ',
        dataIndex: 'payrollPlaceName',
        key: 'payrollPlaceName',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '授课时长 ',
        dataIndex: 'teaching',
        key: 'teaching',
        elipsis: true, align: "center",
        width: 120,
      },
      {
        title: '在职状态 ',
        dataIndex: 'waitStatus',
        key: 'waitStatus',
        elipsis: true, align: "center",
        width: 120,
        customRender: (value) => {
          return (
            <div>
              {value.record.waitStatus == "0" || value.record.waitStatus == "1"
                ? {
                  "0": "在职",
                  "1": "离职",
                }[value.record.waitStatus + ""] || ""
                : "-"}
            </div>
          )
        }
      },
      {
        title: '认证状态 ',
        dataIndex: 'certStatus',
        key: 'certStatus',
        elipsis: true, align: "center",
        width: 120,
        customRender: (value) => {
          return (
            <div>
              {value.record.certStatus == 0 || value.record.certStatus == 1
                ? {
                  "0": "未认证",
                  "1": "已认证",
                }[value.record.certStatus + ""] || ""
                : "-"}
            </div>
          )
        }
      },
      {
        title: '账号状态 ',
        dataIndex: 'status',
        key: 'status',
        elipsis: true, align: "center",
        width: 120,
        customRender: (value) => {
          return (
            <div>
              {value.record.status == 0 || value.record.status == 1 || value.record.status == 2
                ? {
                  '0': "临时",
                  '1': "启用",
                  '2': "停用"
                }[value.record.status + ""] || ""
                : "-"}
            </div>
          )
        }
      },
      {
        title: '操作 ',
        dataIndex: 'operation',
        key: 'operation',
        elipsis: true, 
        width: 200,
        align: "right",
        scopedSlots: { customRender: "action" },
      },
    ])
    //列表数据
    const tableData = ref([

    ])
    // 搜索
    const searchSubmit = () => {
      getTableDate();
    };
    //重置
    const searchReset = () => {
      state.searchParam = {
        name:null,
        userNo: null,
        departId:null,
        systemid: null,
        tlevelId: null,
        waitStatus: null,
        certStatus: null,
        salaryName: null,
        payrollPlaceId: null,
        status: null,
        pageNo: 1,
        pageSize: 10,
      };
      getTableDate();
    };
    //  List接口数据
    const getTableDate = (obj) => {
      state.tableLoading = true
      let objA = { ...state.searchParam };
      getTeacherList(objA)
        .then((res) => {
          tableData.value = res.data.data.records
          state.tableDataTotal = Number(res.data.data.total);
          state.tableLoading = false
          console.log("获取讲师tableData", tableData);
        })
    };
    getTableDate()
    // // List接口数据
    // const getTableDate = ()=>{
    //   state.tableloading = true ;
    //   api 
    // // api 接口命名
    //   getTeacherList({
    //     ...state.searchParam
    //   })
    //   .then((res)=>{
    //   console.log(res.data.rows)
    //     // state.tableDataTotal = Number(res.data.data.total);
    //     //   state.tableLoading = false;
    //     //   const tableData = res.data.rows;
    //     // //  initDataSublist("", data);
    //     //   console.log(data);
    //     //   tableData.value = data;
    //     //   console.log("tableData", tableData);
    //   })
    // }
    // 获取项目列表信息
    //let tableData = ref([]);
    //   // 翻页
    const changePagination = (page, pageSize) => {
      state.searchParam.pageNo = page;
      state.currentPage1 = page;
      state.pageSize1 = pageSize;
      getTableDate();
    };
    // 新增讲师
    const addTeacher = () => {
      cancel()
      state.teacherdialog = true;
      state.teacherdialogtitle = '新增讲师'
      state.formParam.vf=true 
    }
    //修改讲师信息弹窗
    const handleModify = (record) => {
      state.teacherdialog = true;
      state.teacherdialogtitle = '修改信息'
      state.id = record.id
      state.formParam.vf=false
      TeacherSystem()
    }
    //保存
    const createTeacherDialog = () => {
      console.log(state.formParam);
      console.log(state.formParam.vf)
      // if (state.formParam.vf == false) {
      //   updateInTeacher(state.formParam).then(response => {
      //     message.success("修改成功");
      //   });
      // }
//       let a = 
// {"kid":"6B049FAF-C314-7CCF-0D28-0D23F4C42531","id":"965342027497607168","photo":"/2022/12/1057603184561385472.jpg","name":"李玉冰","systemId":null,"defaultteachingTime":"11","teaching":"420","levelId":null,"levelName":null,"certStatus":1,"description":"京东方大学学习平台管理员","workExperience":"<p>卫健委：因无法准确掌握实际数量，即日起不再公布无症状感染者数据。2、官方：在感染高风险人群、60岁以上老年人群等开展第二剂次加强免疫接种</p>","courses":null,"expertise":null,"teacherType":null,"certifyBy":null,"certifyAt":null,"certification":null,"userNo":"00004409","orgName":null,"salaryId":null,"salaryName":null,"waitStatus":"0","status":1,"mobile":null,"email":null,"remark":null,"sysupdateBy":null,"tsystemName":"D事业群"}
      // else {
      //   insertTeacher(state.formParam)
      //     .then((res) => {
      //       message.success("保存成功");
      //     }).catch((err) => {
      //       console.log(err);
      //     });
      // }
      state.teacherdialog = false;
      getTableDate();
    };
    //删除弹窗
    const deleteModal = (record) => {
      state.deleteInTeacherdialog = true
      state.delTeacherId = record.id
    };
    //修改状态窗口
    const handleOperate = (record) => {
      if (record.status == 1) {
        state.handleOperate1 = record.status
        state.newStatus = 2
      }
      if (record.status == 2) {
        state.handleOperate1 = record.status
        state.newStatus = 1
      }
      state.editTeacherid = record.id
      state.editTeacher = true
    };
    //确认删除
    const closeDeleteTeacher = () => {
      //调用删除接口
      deleteInTeacher(state.delTeacherId).then((res) => {
        if (res.data.code == 200) {
          // message.success("删除成功");
          state.deleteInTeacherdialog = false
          getTableDate();
        }
      })
    }
    //确认启用停用
    const closehandleOperate = () => {
      //调用接口
      let ids = {
        id: state.editTeacherid,
        newStatus: state.newStatus
      }
      console.log(ids)
      updateTeacherState(ids).then((res) => {
        message.success("操作成功");
        state.editTeacher = false
        getTableDate();
      })
    }
    //取消按钮 清空输入的数据
    const cancelTeacherDialog = () => {
      if (state.teacherdialog = true) {
        state.teacherdialog = false
        cancel()
      }
      state.deleteInTeacherdialog = false
      state.editTeacher = false
      state.tagsshow = 1
    };

    //清空数据
    const cancel = () => {
      state.formParam = {
        name: null,
        // userNo:null,
        departId: null,
        tlevelId: null,
        defaultteachingTime: 0,
        // levelName:null,
        // leveName:null,
        tsystemId: null,
        // systemid:null,
        certStatus:0,
        description:null,
        workExperience:null,
        courses:null,
      }
     
    }
    const rules = {
      name: [{ required: true, message: '讲师不能为空' }],
      departId: [{ required: true, message: '组织不能为空' }],
      tlevelId: [{ required: true, message: '讲师级别不能为空' }],
      tsystemId: [{ required: true, message: '讲师体系不能为空' }],
      defaultteachingTime: [{ required: true, message: '授课时长不能为空' }],
      certStatus: [{ required: true, message: '认证状态不能为空' }],

    }
    //表格内查看数据操作
    const handleLook = (record) => {
      let id = record.id
      router.push({ path: '/LookInsideLecturer', query: { id } })
    }
    //内部讲师详情
    const TeacherSystem = () => {
      getTeacherById(state.id).then((res) => {
         if (res.data.code === 200) {
          state.formParam = res.data.data[0]
         }
        console.log("内部讲师详情", state.formParam);
      })
        .catch((err) => {
          console.log("内部讲师详情", err);
        });
    }
    function managerChange(e, l, d, t, orgName) {
      console.log(e, l);
      state.searchParam.userNo = d;
      state.searchParam.name = t;
      // state.searchParam.trainorgName=orgName
    }
    //导出功能
    const handleExport = () => {
      window.open(
        `${process.env.VUE_APP_BASE_API}/teacher/export?pageNo=${state.currentPage1
        }&pageSize=${state.pageSize1}
        &userNo=${state.searchParam.userNo ? state.searchParam.userNo : ""}
        &name=${state.searchParam.name ? state.searchParam.name : ""}
        &systemid=${state.searchParam.systemid ? state.searchParam.systemid : ""}
        &tlevelId=${state.searchParam.tlevelId ? state.searchParam.tlevelId : ""
        }&waitStatus=${state.searchParam.waitStatus ? state.searchParam.waitStatus : ""}
        &certStatus=${state.searchParam.certStatus ? state.searchParam.certStatus : ""
        }&salaryName=${state.searchParam.salaryName ? state.searchParam.salaryName : ""} 
        &status=${state.searchParam.status ? state.searchParam.status : ""}`
      );
      // this.download('lesson_records/export', {
      //           ...state.searchParam
      //       }, `project_${new Date().getTime()}.xlsx` )
    }
    return {
      ...toRefs(state),
      rules,
      managerChange,
      headers,
      beforeUpload,
      imageUrl,
      handlemoreid,
      // changeSelect,
      handleExport,
      LecturerSystemList,
      getLevelList,
      OnTheJobStatusList,
      changetlevel,
      PlaceOfPayLista,
      AuthenticationStatusList,
      PlaceOfPayList,
      AccountStatusList,
      searchSubmit,
      searchReset,
      columns,
      tableData,
      changePagination,
      addTeacher,
      cancelTeacherDialog,
      handleLook,
      cancel,
      deleteModal,
      handleModify,
      closeDeleteTeacher,
      createTeacherDialog,
      handleOperate,
      closehandleOperate,
      // teacheExpertiseList,
      getTableDate, //list接口数据调用
      // getStu
      LecturerSystemLista,
      TeacherSystem,
      // TeacherExpertiseList,
      // getTeacherExpertisea,
      // getTeacherExpertiseByPidList,
      // getTeacherExpertiseByPida,
      infoteacherList,
      getinfoteacher,
      addContentData,
      isupload,
      AddContentList,
      beforeUpload2,
    }
  },
};
</script>
<style lang="scss" scoped>

.add_content{
  width: 40px;
  height: 40px;
  cursor: pointer;
  border-radius: 50%;
  background-color: #4ea6ff;
  text-align: center;
  line-height: 40px;
  color: #ffffff;
  font-size: 26px;
}
//导出按钮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;
}

.InsideLecturer {  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
position: relative;
  .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;
      }
    }
  }
}

// 重置样式
.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 输入框的高度 */
.ant-tree-select .ant-select-selection {
  height: 40px;
  line-height: 40px;
  /* 确保文字垂直居中 */
}
.draitem{
 width: 100%;
  height: 40px !important; 
  border-radius: 8px;
  line-height: 40px;
}
.drabtn{
  height:40px;
  width:80px;
  border-radius:8px;
  margin-right:20px
}
 ::v-deep  .ant-select:not(.ant-select-customize-input) .ant-select-selector{
  border-radius:8px;
  height:40px;
  line-height: 40px;
}
.ant-col-12{
  height:90px;
}
.item_inp {
            flex: 1;
            text-align: center ;
            .i_upload_img {
              width: 100px;
              height: 100px;
              border-radius: 8px;
            }

            .i_upload {
              width: 100px;
              height: 100px;
              border: 1px solid #4ea6ff;
              border-radius:50%;
              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;
                }
              }
            }

            .ant-upload.ant-upload-select-picture-card {
              border: 0px !important;
              border-radius: 50%!important;
            }
          }
          .ant-upload.ant-upload-select-picture-card {
            border: 0px !important;
              border-radius: 50%!important;
          }

</style>