<script setup lang="ts">
import { ref, getCurrentInstance, reactive } from "vue";
import { useRouter } from "vue-router";
import request, { download } from '~/utils/request';
import { pick } from 'lodash-es';
import { ElMessage } from 'element-plus'
import type { FormInstance, FormRules } from 'element-plus'
import type { AxiosRequestConfig } from 'axios'

// #region (constant)
const TABLE_KEY = 'xdjx_xsdj_id'
const URL_CUT = '/xdjx/xsdj'
const URL_CUT_REF = ref(URL_CUT)
const URL_SUBMIT_KEY = URL_CUT.split('/').join('_').slice(1)
const instance = getCurrentInstance()
const router = useRouter()
// #endregion

// #region (variable)
const loading_table = ref(true)
let whichDialogSubmit: 'add' | 'edit'
// #endregion

// #region (type)
type TYPE_TABLE_FIELD = {
  [TABLE_KEY]: string;
  'xdjx_xsdj_xsxm': string; // 学生姓名
  'xdjx_xsdj_gender': string; // 性别
  'xdjx_xsdj_mz': string; // 民族
  'xdjx_xsdj_sfz': string; // 身份证
  'xdjx_xsdj_csrq': string; // 出生日期
  'xdjx_xsdj_lxfs': string; // 联系方式
  'xdjx_xsdj_jkzk': string; // 健康状况
  'xdjx_xsdj_djsj': string; // 登记时间
  'xdjx_xsdj_bhd': string; // 编号段
  'xdjx_xsdj_mssj': string; // 面试时间
  'xdjx_xsdj_bhjjr': string; // 包含节假日
}
// #endregion

// #region (props)
// #endregion

// #region (query row)
const queryForm_Data = ref<Partial<TYPE_TABLE_FIELD> & {
  'xdjx_xsdj_csrq'?: string[];
  'xdjx_xsdj_djsj'?: string[];
  keyword?: string
}
>({})

const handleQueryFormBtn_search = () => {
  queryApi()
}
const handleQueryFormBtn_clear = () => {
  queryForm_Data.value = {}
}
// #endregion

// #region (table selection)
const multipleSelection = ref<TYPE_TABLE_FIELD[]>([])
const handleSelectionChange = (val: TYPE_TABLE_FIELD[]) => {
  multipleSelection.value = val
}
// #endregion

// #region (table row)
const handleTableRowBtn_import = async ({ file }: { file: File }) => {
  const res = await API_MAP['import']({ file })
  if (res.code === '1') {
    queryApi()
    ElMessage.success(res.msg)
  }
}
const handleTableRowBtn_export = () => {
  if (multipleSelection.value.length === 0) return ElMessage.info('请先勾选导出文件'); exportApi({ [TABLE_KEY]: multipleSelection.value.map((item: TYPE_TABLE_FIELD) => item[TABLE_KEY])?.join() })
}
const handleTableRowBtn_add = () => {
  whichDialogSubmit = 'add'
  dialogForm_Data.value = {}
  dialogVisible_addOrEdit.value = true
}
const handleTableRowBtn_delete = async () => {
  if (multipleSelection.value.length === 0) return ElMessage.info('请先勾选文件'); const resp = await deleteApi(multipleSelection.value.map((item: TYPE_TABLE_FIELD) => item[TABLE_KEY])); if (resp.code !== '1') return; ElMessage.success('删除成功');
  queryApi()
}

const handleTableRowBtn_remind = async () => {
  whichDialogSubmit = 'edit'
  dialogForm_Data_remind.value = {}

  dialogVisible_remind.value = true
}
// #endregion

// #region (table body)
const tableData = ref<TYPE_TABLE_FIELD[]>([])
const DetailName = '-XSDJ-XSLB-DETAIL'
const DetailParam = 'aid'

const handleTableColBtn_edit = async (scope: { row: TYPE_TABLE_FIELD }) => {
  whichDialogSubmit = 'edit'
  const res = await detailApi(scope.row[TABLE_KEY])
  dialogForm_Data.value = (res.data.one_info)
  dialogVisible_addOrEdit.value = true
}
const handleTableColBtn_audit = (scope: { row: TYPE_TABLE_FIELD }) => {
  whichDialogSubmit = 'edit'
  dialogForm_Data.value = pick(scope.row, [`${TABLE_KEY}`, ...Object.keys(dialogForm_Rules_audit)])
  dialogVisible_audit.value = true
}
const handleTableColBtn_detail = (scope: { row: TYPE_TABLE_FIELD }) => {
  router.push({ name: DetailName, params: { [DetailParam]: scope.row[TABLE_KEY] } })
}
const handleTableColBtn_delete = async (scope: { row: TYPE_TABLE_FIELD }) => {
  const resp = await deleteApi(scope.row[TABLE_KEY]); if (resp.code !== '1') return; ElMessage.success('删除成功');
  queryApi()
}

// #endregion

// #region (pagination)
const total = ref(0)
const limit = ref(10)

const currentPage = ref(1)
function handleCurrentChange() {
  queryApi()
}
// #endregion

// #region (dialog base)
const dialogForm_Data = ref<Partial<TYPE_TABLE_FIELD> & { keyword?: string }>({})

const handleDialogFormBtn_submit = async (formRefKey: string, extendData?: Partial<TYPE_TABLE_FIELD>) => {
  const isValid = await (instance?.refs[formRefKey] as FormInstance).validate((valid: boolean) => valid)
  if (isValid) {
    const resp = await API_MAP[whichDialogSubmit](<TYPE_TABLE_FIELD>({ ...dialogForm_Data.value, ...extendData }))
    if (resp.code !== '1') return; ElMessage.success('操作成功'); handleDialogFormBtn_cancel()
    queryApi()
  }
}
const handleDialogFormBtn_cancel = (formRefKey?: string) => {
  dialogVisible_addOrEdit.value = false
  dialogVisible_audit.value = false
  dialogVisible_remind.value = false
}
// #endregion

// #region (dialog add/edit)
const dialogVisible_addOrEdit = ref<boolean>(false)

const dialogForm_Ref_addOrEdit = ref<FormInstance>()
const dialogForm_Rules_addOrEdit = reactive({
  'xdjx_xsdj_xsxm': { required: true, message: '学生姓名不能为空', trigger: 'submit' },
  'xdjx_xsdj_gender': { required: true, message: '性别不能为空', trigger: 'submit' },
  'xdjx_xsdj_mz': { required: true, message: '民族不能为空', trigger: 'submit' },
  'xdjx_xsdj_sfz': [
    { required: true, message: '身份证不能为空', trigger: 'submit' },
    { trigger: 'submit', message: '身份证错误', pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/ }
  ],
  'xdjx_xsdj_csrq': { required: true, message: '出生日期不能为空', trigger: 'submit' },
  'xdjx_xsdj_lxfs': [
    { required: true, message: '联系方式不能为空', trigger: 'submit' },
    { trigger: 'submit', message: '联系方式错误', pattern: /^1[3456789]\d{9}$/ }
  ],
  'xdjx_xsdj_jkzk': { required: true, message: '健康状况不能为空', trigger: 'submit' },
  'xdjx_xsdj_djsj': { required: true, message: '登记时间不能为空', trigger: 'submit' },
  'xdjx_xsdj_bhd': { required: true, message: '编号段不能为空', trigger: 'submit' },
  'xdjx_xsdj_mssj': { required: true, message: '面试时间不能为空', trigger: 'submit' },
  'xdjx_xsdj_bhjjr': { required: true, message: '包含节假日不能为空', trigger: 'submit' },
})
// #endregion

// #region (dialog audit)
const dialogVisible_audit = ref<boolean>(false)

const dialogForm_Field_audit = reactive<{
  FLAG: keyof TYPE_TABLE_FIELD,
  REASON?: keyof TYPE_TABLE_FIELD
}>({
  FLAG: 'xdjx_xsdj_id',
  REASON: 'xdjx_xsdj_id'
})

const dialogForm_Ref_audit = ref<FormInstance>()
const dialogForm_Rules_audit = reactive<FormRules>({
  'xdjx_xsdj_xsxm': { required: true, message: '学生姓名不能为空', trigger: 'submit' },
  'xdjx_xsdj_gender': { required: true, message: '性别不能为空', trigger: 'submit' },
  'xdjx_xsdj_mz': { required: true, message: '民族不能为空', trigger: 'submit' },
  'xdjx_xsdj_sfz': [
    { required: true, message: '身份证不能为空', trigger: 'submit' },
    { trigger: 'submit', message: '身份证错误', pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/ }
  ],
  'xdjx_xsdj_csrq': { required: true, message: '出生日期不能为空', trigger: 'submit' },
  'xdjx_xsdj_lxfs': [
    { required: true, message: '联系方式不能为空', trigger: 'submit' },
    { trigger: 'submit', message: '联系方式错误', pattern: /^1[3456789]\d{9}$/ }
  ],
  'xdjx_xsdj_jkzk': { required: true, message: '健康状况不能为空', trigger: 'submit' },
  'xdjx_xsdj_djsj': { required: true, message: '登记时间不能为空', trigger: 'submit' },
  'xdjx_xsdj_bhd': { required: true, message: '编号段不能为空', trigger: 'submit' },
  'xdjx_xsdj_mssj': { required: true, message: '面试时间不能为空', trigger: 'submit' },
  'xdjx_xsdj_bhjjr': { required: true, message: '包含节假日不能为空', trigger: 'submit' },
})
// #endregion



// #region (request api):
function queryApi() {
  loading_table.value = true
  return request({
    url: URL_CUT + '/index',
    data: {
      ...queryForm_Data.value,
      xdjx_xsdj_csrq: queryForm_Data.value.xdjx_xsdj_csrq && queryForm_Data.value.xdjx_xsdj_csrq.join(' - '),
      xdjx_xsdj_djsj: queryForm_Data.value.xdjx_xsdj_djsj && queryForm_Data.value.xdjx_xsdj_djsj.join(' - '),

      limit: limit.value,
      page: currentPage.value
    }
  }).then((response: { data: { total_rows: string, page_data: TYPE_TABLE_FIELD[] } }) => {
    const { data } = response
    total.value = parseInt(data.total_rows)
    tableData.value = data.page_data
    return response
  }).then(() => {
    loading_table.value = false
  })
}

// get current time YYYY-MM-DD format typescript
function getNowFormatDate() {
  const date = new Date()
  const seperator1 = "-"
  const year = date.getFullYear()
  const month = date.getMonth() + 1
  const strDate = date.getDate()
  if (month >= 1 && month <= 9) {
    return year + seperator1 + "0" + month + seperator1 + strDate
  }
  return year + seperator1 + month + seperator1 + strDate
}

function addApi(data: TYPE_TABLE_FIELD) {
  return request({
    url: URL_CUT + '/add',
    data: {
      [URL_SUBMIT_KEY]: { ...data, xdjx_xsdj_djsj: getNowFormatDate() },
    }
  })
}

function editApi(data: Partial<TYPE_TABLE_FIELD>) {
  return request({
    url: URL_CUT + '/edit',
    data: {
      [TABLE_KEY]: data[TABLE_KEY],
      [URL_SUBMIT_KEY]: pick(data, ['xdjx_xsdj_xsxm', 'xdjx_xsdj_gender', 'xdjx_xsdj_mz', 'xdjx_xsdj_sfz', 'xdjx_xsdj_csrq', 'xdjx_xsdj_lxfs', 'xdjx_xsdj_jkzk', 'xdjx_xsdj_djsj', 'xdjx_xsdj_bhd', 'xdjx_xsdj_mssj', 'xdjx_xsdj_bhjjr',]),
    }
  })
}

function deleteApi(id: string | string[]) {
  return request({
    url: URL_CUT + '/delete',
    data: {
      [TABLE_KEY]: id,
    }
  })
}

function detailApi(id: string) {
  return request({
    url: URL_CUT + '/detail',
    data: {
      [TABLE_KEY]: id,
    }
  })
}

function importApi(data: { file: File }) {
  return request({
    $type: 'import',
    url: URL_CUT + '/import',
    data
  } as AxiosRequestConfig)
}

function exportApi(d) {
  return download(URL_CUT + '/index', { ...queryForm_Data.value, ...d })
}

const API_MAP = {
  query: queryApi,
  add: addApi,
  edit: editApi,
  delete: deleteApi,
  detail: detailApi,
  import: importApi,
  export: exportApi,
}
// #endregion

// #region (page init)
function init() {
  queryApi()
}
init()
// #endregion


// #region (dialog remind)
const dialogVisible_remind = ref<boolean>(false)

const dialogForm_Ref_remind = ref<FormInstance>()
const dialogForm_Rules_remind = reactive({
  'xxt_bhd': { required: true, message: '编号段不能为空', trigger: 'submit' },
  'xxt_mssh': { required: true, message: '面试时间不能为空', trigger: 'submit' },
  'xxt_bbhjjr': { required: true, message: '包含节假日不能为空', trigger: 'submit' },
})

const dialogForm_Data_remind = ref<{
  xxt_bhd?: string;
  xxt_mssh?: string;
  xxt_bbhjjr?: string;
}>({})
const handleDialogFormBtn_submit_remind = async () => {
  const resp = (await request({
    url: '/xdjx/xsdj_txsz/add',
    data: dialogForm_Data_remind.value
  }))
  if (resp.code !== '1') return;
  handleDialogFormBtn_cancel()
  ElMessage.success('已提醒相关人员')
}
// #endregion

const handleTableRowBtn_sign = async () => {
  await request({
    url: '/xdjx/xsdj/auto_bhd',
  })
  ElMessage.success('已生成编号')

  queryApi()
}

</script>

<template>
  <div class="card flex-grow flex flex-col">
    <el-form inline :model="queryForm_Data">
      <!-- <el-form-item label="学生姓名"><el-input v-model="queryForm_Data.xdjx_xsdj_xsxm" clearable /></el-form-item> -->
      <el-form-item label="性别">
        <el-select v-model="queryForm_Data.xdjx_xsdj_gender" clearable>
          <el-option label="男" value="1" />
          <el-option label="女" value="2" />
          <el-option label="保密" value="3" />
        </el-select>
      </el-form-item>
      <el-form-item label="民族">
        <!-- <el-input v-model="queryForm_Data.xdjx_xsdj_mz" clearable /> -->
        <remote-dictionary-select to="MZ" v-model="queryForm_Data.xdjx_xsdj_mz"></remote-dictionary-select>
      </el-form-item>
      <!-- <el-form-item label="身份证"><el-input v-model="queryForm_Data.xdjx_xsdj_sfz" clearable /></el-form-item> -->
      <el-form-item label="出生日期">
        <el-date-picker type="daterange" v-model="queryForm_Data.xdjx_xsdj_csrq" value-format="YYYY-MM-DD" clearable />
      </el-form-item>
      <!-- <el-form-item label="联系方式"><el-input v-model="queryForm_Data.xdjx_xsdj_lxfs" clearable /></el-form-item> -->
      <el-form-item label="健康状况">
        <!-- <el-input v-model="queryForm_Data.xdjx_xsdj_jkzk" clearable /> -->
        <remote-dictionary-select to="JKZK" v-model="queryForm_Data.xdjx_xsdj_jkzk"></remote-dictionary-select>
      </el-form-item>
      <el-form-item label="登记时间">
        <el-date-picker type="daterange" v-model="queryForm_Data.xdjx_xsdj_djsj" value-format="YYYY-MM-DD" clearable />
      </el-form-item>
      <el-form-item label="编号段">
        <el-input v-model="queryForm_Data.xdjx_xsdj_bhd" clearable />
      </el-form-item>
      <!-- <el-form-item label="面试时间"><el-date-picker type="date" v-model="queryForm_Data.xdjx_xsdj_mssj" value-format="YYYY-MM-DD" clearable /></el-form-item>
                    <el-form-item label="包含节假日"><el-select v-model="queryForm_Data.xdjx_xsdj_bhjjr" clearable ><el-option label="否" value="0" /><el-option label="是" value="1" /></el-select></el-form-item> -->
      <el-form-item>
        <el-button @click="handleQueryFormBtn_search" type="primary">搜索</el-button>
        <el-button @click="handleQueryFormBtn_clear" type="warning">清空</el-button>
      </el-form-item>
    </el-form>
    <div class="divider"></div>
    <div class="flex justify-between">
      <div>
        <!-- <import-button @success="queryApi" :url="URL_CUT_REF"></import-button> -->
        <el-button @click="handleTableRowBtn_export" type="success">导出打印</el-button>
        <el-button @click="handleTableRowBtn_add" type="primary">新增</el-button>
        <!-- <el-button @click="handleTableRowBtn_delete" type="danger">删除</el-button> -->
      </div>

      <div>
        <el-button @click="handleTableRowBtn_sign" type="success">生成编号</el-button>
        <el-button @click="handleTableRowBtn_remind" type="success">提醒设置</el-button>
      </div>

    </div>

    <div class="divider"></div>
    <div class="flex-auto">
      <el-table :data="tableData" @selection-change="handleSelectionChange" v-loading="loading_table"
        element-loading-background="#ffffff70">
        <el-table-column type="selection"></el-table-column>
        <el-table-column type="index" label="序号" width="60" :index="(i: number) => (currentPage - 1) * limit + i + 1" />
        <el-table-column prop="xdjx_xsdj_bhd" label="编号段" width="auto" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xdjx_xsdj_xsxm" label="学生姓名" width="100" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xdjx_xsdj_gender" label="性别" width="70" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xdjx_xsdj_mz" label="民族" width="70" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xdjx_xsdj_sfz" label="身份证" width="200" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xdjx_xsdj_csrq" label="出生日期" width="140" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xdjx_xsdj_lxfs" label="联系方式" width="140" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xdjx_xsdj_jkzk" label="健康状况" width="auto" show-overflow-tooltip></el-table-column>
        <el-table-column prop="xdjx_xsdj_djsj" label="登记时间" width="140" show-overflow-tooltip></el-table-column>
        <!-- <el-table-column prop="xdjx_xsdj_mssj" label="面试时间" width="auto" show-overflow-tooltip></el-table-column>
                      <el-table-column prop="xdjx_xsdj_bhjjr" label="包含节假日" width="auto" show-overflow-tooltip></el-table-column> -->
        <el-table-column label="操作" fixed="right" width="140">
          <template #default="scope">
            <el-button link :auto-insert-space="false" @click="handleTableColBtn_edit(scope)" type="primary">编辑
            </el-button>
            <!-- <el-button link :auto-insert-space="false" @click="handleTableColBtn_audit(scope)" type="primary" >审核</el-button> -->
            <!-- <el-button link :auto-insert-space="false" @click="handleTableColBtn_detail(scope)" type="primary">详情
                          </el-button> -->
            <!-- <el-button link :auto-insert-space="false" @click="handleTableColBtn_delete(scope)" type="primary" >删除</el-button> -->
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div class="flex justify-end mt-10 py-4">
      <el-pagination :page-size="limit" v-model:current-page="currentPage" @current-change="handleCurrentChange"
        background layout="total, prev, pager, next" :total="total" />
    </div>
  </div>

  <el-dialog v-model="dialogVisible_addOrEdit" append-to-body destroy-on-close>
    <el-form :model="dialogForm_Data" ref="dialogForm_Ref_addOrEdit" :rules="dialogForm_Rules_addOrEdit"
      label-width="120px">
      <el-form-item label="学生姓名" prop="xdjx_xsdj_xsxm">
        <el-input v-model="dialogForm_Data.xdjx_xsdj_xsxm" clearable />
      </el-form-item>
      <el-form-item label="性别" prop="xdjx_xsdj_gender">
        <el-radio-group v-model="dialogForm_Data.xdjx_xsdj_gender">
          <el-radio label="1">男</el-radio>
          <el-radio label="2">女</el-radio>
          <el-radio label="3">保密</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="民族" prop="xdjx_xsdj_mz">
        <remote-dictionary-select to="MZ" v-model="dialogForm_Data.xdjx_xsdj_mz"></remote-dictionary-select>
      </el-form-item>
      <el-form-item label="身份证" prop="xdjx_xsdj_sfz">
        <el-input v-model="dialogForm_Data.xdjx_xsdj_sfz" clearable />
      </el-form-item>
      <el-form-item label="出生日期" prop="xdjx_xsdj_csrq">
        <el-date-picker type="date" v-model="dialogForm_Data.xdjx_xsdj_csrq" value-format="YYYY-MM-DD" clearable />
      </el-form-item>
      <el-form-item label="联系方式" prop="xdjx_xsdj_lxfs">
        <el-input v-model="dialogForm_Data.xdjx_xsdj_lxfs" clearable />
      </el-form-item>
      <el-form-item label="健康状况" prop="xdjx_xsdj_jkzk">
        <remote-dictionary-select to="JKZK" v-model="dialogForm_Data.xdjx_xsdj_jkzk"></remote-dictionary-select>
      </el-form-item>
      <!-- <el-form-item label="登记时间" prop="xdjx_xsdj_djsj">
                  <el-date-picker type="date" v-model="dialogForm_Data.xdjx_xsdj_djsj" value-format="YYYY-MM-DD" clearable />
                </el-form-item> -->
      <!-- <el-form-item label="编号段" prop="xdjx_xsdj_bhd">
                  <el-input v-model="dialogForm_Data.xdjx_xsdj_bhd" clearable />
                </el-form-item>
                <el-form-item label="面试时间" prop="xdjx_xsdj_mssj">
                  <el-date-picker type="date" v-model="dialogForm_Data.xdjx_xsdj_mssj" value-format="YYYY-MM-DD" clearable />
                </el-form-item>
                <el-form-item label="包含节假日" prop="xdjx_xsdj_bhjjr">
                  <el-radio-group v-model="dialogForm_Data.xdjx_xsdj_bhjjr">
                    <el-radio label="0">否</el-radio>
                    <el-radio label="1">是</el-radio>
                  </el-radio-group>
                </el-form-item> -->
      <div class="flex justify-center">
        <el-button @click="handleDialogFormBtn_submit('dialogForm_Ref_addOrEdit')" type="primary">提交</el-button>
        <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_addOrEdit')" type="default">取消</el-button>
      </div>
    </el-form>
  </el-dialog>

  <!-- <el-dialog v-model="dialogVisible_audit" append-to-body destroy-on-close>
                  <el-form :model="dialogForm_Data" ref="dialogForm_Ref_audit" :rules="dialogForm_Rules_audit" label-width="120px">
                    <el-form-item label="状态">
                      <el-radio-group v-model="dialogForm_Data[dialogForm_Field_audit.FLAG]">
                        <el-radio label="1">通过</el-radio>
                        <el-radio label="2">未通过</el-radio>
                      </el-radio-group>
                    </el-form-item>
                    <el-form-item label="原因" v-show="dialogForm_Data[dialogForm_Field_audit.FLAG] === '1'">
                      <el-input type="textarea" v-model="dialogForm_Data[dialogForm_Field_audit.REASON]" :rows="5" />
                    </el-form-item>
                    <div class="flex justify-center">
                      <el-button @click="handleDialogFormBtn_submit('dialogForm_Ref_audit')" type="primary">提交</el-button>
                      <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_audit')" type="default">取消</el-button>
                    </div>
                  </el-form>
                </el-dialog> -->

  <el-dialog v-model="dialogVisible_remind" append-to-body destroy-on-close>
    <el-form :model="dialogForm_Data_remind" ref="dialogForm_Ref_remind" :rules="dialogForm_Rules_remind"
      label-width="120px">
      <el-form-item label="编号段" prop="xxt_bhd">
        <el-input v-model="dialogForm_Data_remind.xxt_bhd" clearable />
      </el-form-item>
      <el-form-item label="面试时间" prop="xxt_mssh">
        <el-date-picker type="date" v-model="dialogForm_Data_remind.xxt_mssh" value-format="YYYY-MM-DD" clearable />
      </el-form-item>
      <el-form-item label="包含节假日" prop="xxt_bbhjjr">
        <el-radio-group v-model="dialogForm_Data_remind.xxt_bbhjjr">
          <el-radio label="0">否</el-radio>
          <el-radio label="1">是</el-radio>
        </el-radio-group>
      </el-form-item>
      <div class="flex justify-center">
        <el-button @click="handleDialogFormBtn_submit_remind()" type="primary">提交</el-button>
        <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_remind')" type="default">取消</el-button>
      </div>
    </el-form>
  </el-dialog>
</template>
