<!--
  * 病例表
  *
  * @Author:    HMM
  * @Date:      2024-01-11 15:18:32
  * @Copyright  gdxz
-->
<template>
  <!---------- 查询表单form begin ----------->
  <a-form class="smart-query-form" style="border-radius: 10px; padding: 10px 10px">
    <a-row class="smart-query-form-row">
      <a-form-item label="" class="smart-query-form-item">
        <a-input style="width: 200px" v-model:value="queryForm.expertName" placeholder="请输入姓名" />
      </a-form-item>
      <a-form-item label="" class="smart-query-form-item">
                      <a-range-picker :valueFormat="dateFormat"  v-model:value="queryForm.createTime" :disabled-date="disabledDate"/>
      </a-form-item>
      
     <!-- <a-form-item label="" class="smart-query-form-item">
                <a-select style="width: 150px;" @change="provChange" placeholder="选择省份" v-model:value="queryForm.provId"
                    :allowClear="true">
                    <a-select-option :value="prov.id" v-for="prov in provList">{{ prov.name }}</a-select-option>
                </a-select>
            </a-form-item>
            <a-form-item label="" class="smart-query-form-item">
                <a-select style="width: 150px;" placeholder="选择市区" @change="cityChange" v-model:value="queryForm.cityId"
                    :allowClear="true">
                    <a-select-option :value="city.id" v-for="city in cityList">{{ city.name }}</a-select-option>
                </a-select>
            </a-form-item>
            <a-form-item label="" class="smart-query-form-item">
                <a-select style="width: 250px;" placeholder="选择医院" v-model:value="queryForm.hospitalUuid"
                    :allowClear="true">
                    <a-select-option :value="hospital.uuid" v-for="hospital in hospitalList">{{ hospital.name
                    }}</a-select-option>
                </a-select>
            </a-form-item> -->

      <a-form-item class="smart-query-form-item">
        <a-button type="primary" @click="queryData">
          <template #icon>
            <SearchOutlined />
          </template>
          查询
        </a-button>

      
      </a-form-item>
    </a-row>
  </a-form>
  <!---------- 查询表单form end ----------->

  <a-card size="small" :bordered="false" :hoverable="true" style="border-radius: 10px">
    <!---------- 表格操作行 begin ----------->
    <a-row class="smart-table-btn-block">
      <div class="smart-table-operate-block">
        <a-typography-title :level="5">活动申请</a-typography-title>
        <!-- <a-button @click="showForm()" type="primary" size="small">
                    <template #icon>
                        <PlusOutlined />
                    </template>
                    新建
                </a-button> -->
      </div>
      <div class="smart-table-setting-block">
        <TableOperator v-model="columns" :tableId="null" :refresh="queryData" />
      </div>
    </a-row>
    <!---------- 表格操作行 end ----------->

    <!---------- 表格 begin ----------->
    <a-table size="small" :dataSource="tableData" :columns="columns" rowKey="id" bordered :loading="tableLoading" :pagination="false">
      <template #bodyCell="{ text, record, column }">
        <template v-if="column.dataIndex === 'createTime'">
          <span>{{ text.substring(0, 11) }}</span>
        </template>
         <template v-if="column.dataIndex === 'status'">
           <a-tag :color="text == 1?'success':'error'" >{{text == 1?'审核通过':'待审核'}}</a-tag>
        </template>
        
        <template v-if="column.dataIndex === 'expertProvName'">
          <span>{{record.expertProvName+record.expertCityName }}</span>
        </template>

        
        <template v-if="column.dataIndex === 'action'">
                    <div class="smart-table-operate">
                        <a-button @click="delActivity(record.id)" type="link" danger>删除</a-button>
                        <a-button @click="handleStatus(record.id)" type="link" success v-if="record.status==2">审核通过</a-button>

                    </div>
                </template>
      </template>
    </a-table>
    <!---------- 表格 end ----------->

    <div class="smart-query-table-page">
      <a-pagination
        showSizeChanger
        showQuickJumper
        show-less-items
        :pageSizeOptions="PAGE_SIZE_OPTIONS"
        :defaultPageSize="queryForm.pageSize"
        v-model:current="queryForm.pageNum"
        v-model:pageSize="queryForm.pageSize"
        :total="total"
        @change="queryData"
       
        @showSizeChange="queryData"
        :show-total="(total) => `共${total}条`"
      />
    </div>

    <!-- <manageForm ref="formRef" @reloadList="queryData" /> -->

    
  </a-card>
  <br />
</template>
<script setup>
import dayjs from 'dayjs';
import { reactive, ref, onMounted } from 'vue';
import { message, Modal } from 'ant-design-vue';
import { SmartLoading } from '/@/components/framework/smart-loading';
import { activityApi } from '/@/api/system/activity/activity-api';
import { PAGE_SIZE_OPTIONS } from '/@/constants/common-const';
import { smartSentry } from '/@/lib/smart-sentry';
import TableOperator from '/@/components/support/table-operator/index.vue';
import SmartEnumSelect from '/@/components/framework/smart-enum-select/index.vue';
import manageForm from './form.vue';
import { areaApi } from '/@/api/business/area/area-api';
import { statisticsApi } from '/@/api/business/case/statistics-api';
import { employeeApi } from '/@/api/system/employee/employee-api';
// ---------------------------- 表格列 ----------------------------
const dateFormat = 'YYYY-MM-DD HH:mm:ss'
const headers=reactive({
       'Content-Type': 'multipart/form-data'
      });

function showReason(reason) {
  showReasonVisible.value = true;
  show_reason.value = reason;
}



const columns = ref([
  {
    title: '姓名',
    dataIndex: 'expertName',
    ellipsis: true,
  },
  {
    title: '地区',
    dataIndex: 'expertProvName',
    ellipsis: true,
  },
  {
    title: '医院',
    dataIndex: 'expertHospitalName',
    ellipsis: true,
  },
  {
    title: '申请状态',
    dataIndex: 'status',
    ellipsis: true,
  },

  {
    title: '创建时间',
    dataIndex: 'createTime',
    ellipsis: true,
    width: 100,
  },

  {
      title: '操作',
      dataIndex: 'action',
      fixed: 'right',
      width: 155,
  },
]);

 const handleChange = (info) => {
    console.log(info);
      if (info.file.status !== 'uploading') {
        console.log(info.file, info.fileList);
      }
      if (info.file.status === 'done') {
        message.success(`上传成功`);
        queryData();
      } else if (info.file.status === 'error') {
        message.error(`上传失败`);
      }
    }
    const handleStatus=(id)=>{
      activityApi.changeStatus(id,{
        status:1
      }).then((res)=>{
        message.success(`审核成功`);
        queryData();
      })
    }
    const delActivity=(id)=>{
        Modal.confirm({
          title: '确认删除?',
          content: '确定要删除该记录？',
          okText: '确认',
          cancelText: '取消',
          onOk(){
            SmartLoading.show();
            activityApi.delActivity(id).then((res)=>{
              message.success(`删除成功`);
              queryData();
              SmartLoading.hide();
            }).catch((err)=>{
              smartSentry.captureError(err);
              SmartLoading.hide();
          })
        }
      });
    }
// ---------------------------- 查询数据表单和方法 ----------------------------

const queryFormState = {
  name: undefined, //name
  pageNum: 1,
  pageSize: 10,
};
const formatJson = (obj) => {
  if (!obj) return [];
  return JSON.parse(obj);
};
// 查询表单form
const queryForm = reactive({ ...queryFormState });
// 表格加载loading
const tableLoading = ref(false);
// 表格数据
const tableData = ref([]);
// 总数
const total = ref(0);

// 重置查询条件
function resetQuery() {
  let pageSize = queryForm.pageSize;
  Object.assign(queryForm, queryFormState);
  queryForm.pageSize = pageSize;
  queryData();
}

// 查询数据
async function queryData() {
  tableLoading.value = true;
  try {
    let queryResult = await activityApi.queryPage(queryForm);
    tableData.value = queryResult.data.list;
    total.value = queryResult.data.total;
  } catch (e) {
    smartSentry.captureError(e);
  } finally {
    tableLoading.value = false;
  }
}





function provChange(e) {
  console.log(e);
  queryForm.cityId = undefined;
  queryForm.hospitalUuid = undefined;
  cityList.value = [];
  hospitalList.value = [];
  if (e) {
    getCity(e);
    getHospitalList({ provId: e });
  }
}

function cityChange(e) {
  console.log(e);
  queryForm.hospitalUuid = undefined;
  hospitalList.value = [];
  if (e) {
    getHospitalList({ cityId: e });
  }
}

const provList = ref();

// 查询数据
async function getProvList() {
  SmartLoading.show();
  try {
    let queryResult = await employeeApi.getRoleProv();
    provList.value = queryResult.data;
  } catch (e) {
    smartSentry.captureError(e);
  } finally {
    SmartLoading.hide();
  }
}

const cityList = ref();

// 查询数据
async function getCity(parent) {
  SmartLoading.show();
  try {
    let queryResult = await areaApi.cityList(parent);
    cityList.value = queryResult.data;
  } catch (e) {
    smartSentry.captureError(e);
  } finally {
    SmartLoading.hide();
  }
}

const hospitalList = ref();

// 查询数据
async function getHospitalList(param) {
  SmartLoading.show();
  try {
    let queryResult = await statisticsApi.getHospitalList(param);
    hospitalList.value = queryResult.data;
  } catch (e) {
    smartSentry.captureError(e);
  } finally {
    SmartLoading.hide();
  }
}

onMounted(() => {
  getProvList();
  queryData();
});

// ---------------------------- 添加/修改 ----------------------------
const formRef = ref();

const  showForm=(data)=> {
  formRef.value.show(data);
}
</script>
