import {
  FormInst,
  FormItemRule,
  FormRules,
  NButton,
  NCascader,
  NForm,
  NFormItem,
  NInput,
  NSelect,
  NSpace,
  NSpin,
  useMessage
} from 'naive-ui'
import { defineComponent, onMounted, reactive, ref } from 'vue'
import {
  examinationKnowledgePointCategorySave,
  examinationKnowledgePointCategoryUpdate
} from '../../api'
import { filterPointCategory } from '@/views/teaching-manage/unit-test'

export default defineComponent({
  name: 'addExamination',
  emits: ['handleSuccess', 'close'],
  props: ['item', 'list', 'isAdd'],
  setup(props, { emit }) {
    const message = useMessage()
    const loading = ref(false)
    const formRef = ref<FormInst | null>(null)
    const parentList = ref([
      { name: '顶级分类', categoryId: '0' },
      ...filterPointCategory(props.list, 'children')
    ] as any)
    const saveModel = reactive({
      id: props?.item?.categoryId || null,
      name: props?.item?.name || '', //考点名称
      code: props?.item?.code || '', //考点code
      sortNo: '', //排序
      parentId: props?.item?.parentId || '0'
    })
    const rules: FormRules = {
      name: [{ required: true, message: '请填写类型名称', trigger: ['blur', 'change'] }],
      code: [{ required: true, message: '请填写类型code', trigger: ['blur', 'change'] }]
    }
    const submit = () => {
      formRef.value?.validate(async (err) => {
        if (!err) {
          const params: any = {
            ...saveModel
          }
          let res: any = null
          console.log(params)
          if (saveModel.id) {
            res = await examinationKnowledgePointCategoryUpdate(params)
          } else {
            res = await examinationKnowledgePointCategorySave(params)
          }
          if (res?.code == 200) {
            message.success('保存成功')
            emit('handleSuccess')
          } else {
            message.warning('保存失败')
          }
        }
      })
    }
    return () => (
      <div>
        <NSpin show={loading.value}>
          <NForm
            ref={formRef}
            onSubmit={submit}
            labelPlacement="top"
            model={saveModel}
            rules={rules}
            require-mark-placement="left"
          >
            {props.isAdd && (
              <NFormItem label="父级分类" path="parentId">
                <NCascader
                  placeholder="请选择父级分类"
                  v-model:value={saveModel.parentId}
                  options={parentList.value}
                  checkStrategy="all"
                  expandTrigger="hover"
                  valueField="categoryId"
                  labelField="name"
                  clearable
                  filterable
                />
              </NFormItem>
            )}
            <NFormItem label="类型名称" path="name">
              <NInput v-model:value={saveModel.name} />
            </NFormItem>
            {/* <NFormItem label="类型code" path="code">
              <NInput v-model:value={saveModel.code} />
            </NFormItem>
            <NFormItem label="排序" path="sortNo">
              <NInput v-model:value={saveModel.sortNo} />
            </NFormItem> */}
          </NForm>
          <NSpace justify="end">
            <NButton onClick={() => emit('close')}>取消</NButton>
            <NButton type="primary" onClick={submit}>
              保存
            </NButton>
          </NSpace>
        </NSpin>
      </div>
    )
  }
})
