<script>
import { defineComponent } from 'vue'
export default defineComponent({
  beforeRouteEnter (to, from, next) {
    if (from.name === 'projectDetail' || !from.name) {
      to.meta.keepAlive = true
    } else {
      to.meta.keepAlive = false
    }
    next()
  }
})
</script>
<script setup name="projectStore">
import { getCurrentInstance, onMounted, reactive, ref } from 'vue'
import { useRouter } from 'vue-router'
import ElTree from '@/components/elTree/index.vue'
import store from '@/store'
import { list, projectExcel } from '@/http/apis/projectStoreManage/projectStore'
import ExportFieldDialog from '../components/exportFieldDialog.vue'
import { preExamineDeclare } from '@/http/apis/declareMange'
import ProjectList from './components/projectList.vue'
import useExportExc from '@/utils/useExportExc'
import { getIsShowRegionTree, getTreeParams } from '@/utils/getIsShowRegionTree'
const
  { proxy } = getCurrentInstance(),
  router = useRouter(),
  { statusOptionsCascader, projectTypeOptions, projectStageOptions } = store.dictStore.globalDicts || {},
  searchForm = reactive({
    projectName: undefined,
    buildOrg: undefined,
    projectType: undefined,
    status: undefined,
    declareAmountMin: undefined,
    declareAmountMax: undefined,
    approveAmountMin: undefined,
    approveAmountMax: undefined,
    projectYear: undefined,
    times: undefined
  }),
  total = ref(0),
  data = ref([]),
  areaCode = ref(),
  getTree = (value) => {
    areaCode.value = value.regionLevel === 3 ? value.regionCode : undefined
    listRef.value.pageParams.pageNumber = 1
    getTableData()
  },
  listRef = ref(),
  getTableData = async (pageParams = listRef.value.pageParams) => {
    const res = await list({
      ...pageParams,
      ...searchForm,
      projectYear: searchForm.projectYear * 1 || undefined,
      declareAmountMin: searchForm.declareAmountMin * 1 || undefined,
      declareAmountMax: searchForm.declareAmountMax * 1 || undefined,
      approveAmountMin: searchForm.approveAmountMin * 1 || undefined,
      approveAmountMax: searchForm.approveAmountMax * 1 || undefined,
      createOnMin: searchForm.times?.[0] || undefined,
      createOnMax: searchForm.times?.[1] || undefined,
      regionCode: areaCode.value || undefined,
      times: undefined,
      status: searchForm.status?.[searchForm.status.length - 1],
      projectTypes: searchForm?.projectType?.join(',') || '',
      projectType: undefined
    })
    data.value = res.data.records
    total.value = res.data.total
  },
  search = () => {
    getTableData()
  },
  reset = () => {
    searchForm.projectName = undefined
    searchForm.buildOrg = undefined
    searchForm.projectType = undefined
    searchForm.status = undefined
    searchForm.declareAmountMin = undefined
    searchForm.declareAmountMax = undefined
    searchForm.approveAmountMin = undefined
    searchForm.approveAmountMax = undefined
    searchForm.projectYear = undefined
    searchForm.times = undefined
    searchForm.projectStage = undefined
    listRef.value.pageParams.pageNumber = 1
    listRef.value.pageParams.pageSize = 10
    getTableData()
  },
  // 导出
  exportFieldDialogData = reactive({
    visible: false
  }),
  showExportFieldDialog = (data) => {
    exportFieldDialogData.visible = true
  },
  closeExportFieldDialog = () => {
    exportFieldDialogData.visible = false
  },
  { exportData } = useExportExc(),
  exportProject = async (data) => {
    await exportData(() => projectExcel({ ...searchForm,
      projectYear: searchForm.projectYear * 1 || undefined,
      declareAmountMin: searchForm.declareAmountMin * 1 || undefined,
      declareAmountMax: searchForm.declareAmountMax * 1 || undefined,
      approveAmountMin: searchForm.approveAmountMin * 1 || undefined,
      approveAmountMax: searchForm.approveAmountMax * 1 || undefined,
      createOnMin: searchForm.times?.[0] || undefined,
      createOnMax: searchForm.times?.[1] || undefined,
      regionCode: areaCode.value || undefined,
      status: searchForm.status?.[searchForm.status.length - 1],
      projectTypes: searchForm.projectType?.join(','),
      projectType: undefined,
      exportOptionList: data }))
    closeExportFieldDialog()
  },
  // 预审申报
  preExamDeclare = (data) => {
    proxy.$messageBox
      .confirm('提交后将发起项目预审流程，确定提交吗?', '提示！', {
        type: 'warning'
      })
      .then(async () => {
        await preExamineDeclare({ projectId: data.id })
        proxy.$message.success('发起成功！')
        getTableData()
      })
  },
  toDetail = (row) => {
    if (row.fromType === '1') {
      router.push({ name: 'projectDetail', query: { id: row.id }})
    } else {
      router.push({ name: 'operationProjectStoreDetail', query: { id: row.projectCode, type: 1 }})
    }
  }
onMounted(async () => {
  if (!getIsShowRegionTree(['SUPER_ADMIN', 'REGION_MANAGER', 'VISITOR'])) getTableData()
})
</script>
<template>
  <el-row>
    <el-col
      v-if="getIsShowRegionTree(['SUPER_ADMIN','REGION_MANAGER','VISITOR'])"
      :span="4"
      class="pr-16"
    >
      <elTree :params="getTreeParams({'SUPER_ADMIN':false,'REGION_MANAGER':false,'VISITOR':false})" @get-tree="getTree" />
    </el-col>
    <el-col :span="getIsShowRegionTree(['SUPER_ADMIN','REGION_MANAGER','VISITOR'])?20:24">
      <el-card class="w-full search">
        <el-form :model="searchForm" size="small" label-suffix=":">
          <el-row :gutter="16" class="mb-16">
            <el-col :span="8">
              <el-form-item label="项目名称">
                <el-input v-model="searchForm.projectName" placeholder="请输入" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="申报单位">
                <el-input v-model="searchForm.buildOrg" placeholder="请输入" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="项目类型">
                <el-select
                  v-model="searchForm.projectType"
                  placeholder="全部"
                  class="w-full"
                  multiple
                >
                  <el-option
                    v-for="(v,k) in projectTypeOptions"
                    :key="k"
                    :label="v"
                    :value="k"
                  />
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="16" class="mb-16">
            <el-col :span="8">
              <el-form-item label="项目状态">
                <el-cascader
                  v-model="searchForm.status"
                  class="w-full"
                  :props="{label:'name',value:'code'}"
                  :options="statusOptionsCascader"
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item class="whitespace-nowrap" label="申报资金(万元)">
                <div class="flex">
                  <el-input-number
                    v-model="searchForm.declareAmountMin"
                    clearable
                    :controls="false"
                    @mousewheel.prevent
                  /> &nbsp;至&nbsp;
                  <el-input-number
                    v-model="searchForm.declareAmountMax"
                    clearable
                    :controls="false"
                    @mousewheel.prevent
                  />
                </div>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item class="whitespace-nowrap" label="批复资金(万元)">
                <div class="flex">
                  <el-input-number
                    v-model="searchForm.approveAmountMin"
                    :controls="false"
                    clearable
                    @mousewheel.prevent
                  /> &nbsp;至&nbsp;
                  <el-input-number
                    v-model="searchForm.approveAmountMax"
                    :controls="false"
                    clearable
                    @mousewheel.prevent
                  />
                </div>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="16" class="mb-16">
            <el-col :span="8">
              <el-form-item label="预算年度">
                <el-date-picker
                  v-model="searchForm.projectYear"
                  type="year"
                  value-format="YYYY"
                  placeholder="请选择"
                />
              </el-form-item>
            </el-col>
            <el-col :span="16">
              <el-form-item label="创建时间">
                <el-date-picker
                  v-model="searchForm.times"
                  type="datetimerange"
                  :editable="false"
                  format="YYYY-MM-DD HH:mm"
                  value-format="YYYY-MM-DD HH:mm"
                  range-separator="-"
                  start-placeholder="开始时间"
                  end-placeholder="结束时间"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="项目阶段">
                <el-select v-model="searchForm.projectStage" placeholder="全部" class="w-full">
                  <el-option
                    v-for="(v,k) in projectStageOptions"
                    :key="k"
                    :label="v"
                    :value="k"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="16">
              <el-form-item class="btn">
                <div class="flex">
                  <el-button type="primary" @click="search">查询</el-button>
                  <el-button @click="reset">重置</el-button>
                </div>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-card>
      <el-card class="w-full mt-8">
        <template #header>
          <div class="flex justify-between">
            <span>列表</span>
            <div>
              <el-button
                type="primary"
                plain
                size="small"
                @click="showExportFieldDialog"
              >导出</el-button>
            </div>
          </div>
        </template>
        <project-list
          ref="listRef"
          :list-data="data"
          :total="total"
          @get-table-data="getTableData"
          @pre-exam-declare="preExamDeclare"
          @to-detail="toDetail"
        />
      </el-card>
    </el-col>
  </el-row>
  <export-field-dialog
    :visible="exportFieldDialogData.visible"
    :data="exportFieldDialogData.rowData"
    @close="closeExportFieldDialog"
    @export-project="exportProject"
  />
</template>
<style lang='less' scoped>
</style>
