<script setup lang="ts">
import { useUserStore } from '@/stores/user'
import { ElMessage } from 'element-plus'
import { useProjectList } from '@/composables/useGetProjectList'
import AddSemester from '../components/AddSemester.vue'
import SemesterCourse from '../components/SemesterCourse.vue'
import ImportSemester from '../components/ImportSemester.vue'
import { getSemList, updateSem } from '../api'
const departmentList: any = useProjectList('', '79806610719731712').departmentList
// 判断当前用户是不是超级管理员
const user = useUserStore().roles
const isAdmin = !!user.find((item: any) => item.name === '超级管理员')
const appList = ref()
const title = ref('')
const id = ref('')
const isEdit = ref('')
const isShowAddSemDialog = ref(false)
const isShowSemCourseDialog = ref(false)
const listOptions = computed(() => {
  return {
    remote: { httpRequest: getSemList, params: { name: '', organ_id: '' } },
    filters: [
      { type: 'input', prop: 'name', label: '学期名称：', placeholder: '学期名称' },
      { type: 'select', prop: 'organ_id', slots: 'filter-department' },
    ],
    columns: [
      { label: '序号', type: 'index', align: 'center' },
      { label: '学期名称', prop: 'name', align: 'center' },
      { label: '所属部门/学校', prop: 'organ_id_name', align: 'center' },
      { label: '学期开始日期', prop: 'start_time', align: 'center' },
      { label: '学期结束日期', prop: 'end_time', align: 'center' },
      { label: '教学周', prop: 'length', align: 'center' },
      { label: '生效状态', slots: 'status', align: 'center' },
      { label: '更新时间', prop: 'updated_time', align: 'center' },
      { label: '操作', slots: 'table-operate', align: 'center', width: 300, fixed: 'right' },
    ],
  }
})
const handleAddSemester = () => {
  isShowAddSemDialog.value = true
  title.value = '新增学期'
  isEdit.value = '0'
}
const handleEdit = (row: any) => {
  isShowAddSemDialog.value = true
  title.value = '编辑学期'
  id.value = row.id
  isEdit.value = '1'
}
const handleDetail = (row: any) => {
  isShowAddSemDialog.value = true
  title.value = '查看详情'
  id.value = row.id
  isEdit.value = '2'
}

const handleCourse = (row: any) => {
  isShowSemCourseDialog.value = true
  id.value = row.id
}
const handleFresh = () => {
  appList.value.refetch()
}
const handleChangeStatus = (row: any) => {
  if (row.id !== undefined) {
    const params: any = Object.assign({}, row)
    updateSem(params)
      .then(() => {
        ElMessage.success('更新学期成功')
        handleFresh()
      })
      .catch((err: any) => {
        if (err.code === 1) {
          handleFresh()
        }
      })
  }
}
</script>

<template>
  <AppCard title="学期管理">
    <AppList v-bind="listOptions" ref="appList" border stripe style="margin-top: 30px">
      <el-button type="primary" round @click="handleAddSemester" v-permission="'v1-learning-semester-create'"
        >新增学期</el-button
      >
      <ImportSemester @create="handleFresh" />
      <template v-if="isAdmin" #filter-department="{ params }">
        <div class="name" style="font-size: 14px; color: #606266; padding-right: 12px">所属部门/学校：</div>
        <el-select @change="handleFresh" clearable v-model="params.organ_id" placeholder="请选择所属部门/学校">
          <el-option v-for="item in departmentList" :key="item.id" :label="item.name" :value="item.id" />
        </el-select>
      </template>
      <template #status="{ row }">
        <el-switch
          size="large"
          v-model="row.status"
          active-value="1"
          inactive-value="0"
          inline-prompt
          style="--el-switch-on-color: #aa1941"
          @change="handleChangeStatus(row)"
          :disabled="!isAdmin"></el-switch>
      </template>
      <template #table-operate="{ row }">
        <el-space>
          <el-link type="primary" plain @click="handleDetail(row)" v-permission="'v1-learning-semester-view'"
            >查看</el-link
          >
          <el-link type="primary" plain @click="handleEdit(row)" v-permission="'v1-learning-semester-update'"
            >编辑</el-link
          >
          <el-link type="primary" plain @click="handleCourse(row)" v-permission="'v1-learning-semester-add-courses'"
            >关联课程</el-link
          >
        </el-space>
      </template>
    </AppList>
  </AppCard>
  <AddSemester
    v-model:isShowAddSemDialog="isShowAddSemDialog"
    v-if="isShowAddSemDialog === true"
    :title="title"
    :id="id"
    :isEdit="isEdit"
    @create="handleFresh" />
  <SemesterCourse
    v-model:isShowSemCourseDialog="isShowSemCourseDialog"
    v-if="isShowSemCourseDialog === true"
    :id="id" />
</template>
