<script setup name="unitManage">
import { reactive, ref, onMounted } from 'vue'
import { getUnitList } from '@/http/apis/systemManage/unitManage'
import ElTree from '@/components/elTree/index.vue'
import { getIsShowRegionTree, getTreeParams } from '@/utils/getIsShowRegionTree'
import { useRouter } from 'vue-router'
const router = useRouter(),
  searchForm = reactive({
    orgName: undefined,
    isCompetentUnit: undefined,
    isSuperiorLineCompetentUnit: undefined
  }),
  tableListRef = ref(),
  total = ref(0),
  column = reactive([
    {
      label: '序号',
      type: 'index',
      width: '80'
    },
    {
      label: '单位名称',
      key: 'orgName',
      prop: 'orgName',
      minWidth: 200,
      showOverflowTooltip: true
    },
    {
      label: '浙政钉编码',
      key: 'orgCode',
      prop: 'orgCode',
      showOverflowTooltip: true,
      minWidth: 200
    },
    {
      label: '财政编码',
      key: 'financialCode',
      prop: 'financialCode',
      width: '150'
    },
    {
      label: '所属区域',
      key: 'regionName',
      prop: 'regionName',
      width: '120'
    },
    {
      label: '操作',
      slot: 'action',
      width: '150',
      fixed: 'right'
    }
  ]),
  data = ref([]),
  getTableData = async (pageParams = tableListRef.value.pageParams) => {
    const res = await getUnitList({
      ...pageParams,
      ...searchForm,
      onlyUnit: true
    })
    data.value = res.data.records
    total.value = res.data.total
  },
  search = () => {
    getTableData()
  },
  reset = () => {
    searchForm.orgName = undefined
    tableListRef.value.pageParams.pageNumber = 1
    tableListRef.value.pageParams.pageSize = 10
    getTableData()
  },
  getTree = (value) => {
    searchForm.regionId = value.regionLevel === 3 ? value.regionCode : undefined
    tableListRef.value.pageParams.pageNumber = 1
    getTableData()
  }
onMounted(() => {
  if (!getIsShowRegionTree(['SUPER_ADMIN', 'REGION_MANAGER'])) getTableData()
})
</script>

<template>
  <el-row :gutter="16">
    <el-col v-if="getIsShowRegionTree(['SUPER_ADMIN','REGION_MANAGER'])" style="padding-right: 16px" :span="4">
      <elTree :params="getTreeParams({'SUPER_ADMIN':false,'REGION_MANAGER':false})" @get-tree="getTree" />
    </el-col>
    <el-col :span="getIsShowRegionTree(['SUPER_ADMIN','REGION_MANAGER'])?20:24">
      <div>
        <el-card shadow="never" class="search mb-16">
          <el-form label-suffix=":" :model="searchForm" size="small">
            <el-row :gutter="16">
              <el-col :span="8">
                <el-form-item label="单位名称">
                  <el-input
                    v-model="searchForm.orgName"
                    maxlength="10"
                    placeholder="请输入"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="16">
                <el-form-item class="btn">
                  <el-button type="primary" @click="search">查询</el-button>
                  <el-button @click="reset">重置</el-button>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-card>
        <el-card shadow="never">
          <template #header>
            <div class="flex justify-between items-center">
              <span>单位列表</span>
            </div>
          </template>
          <table-list
            ref="tableListRef"
            :column="column"
            :data="data"
            :total="total"
            @get-table-data="getTableData"
          >
            <template #action="{ scope }">
              <a
                @click="
                  router.push({
                    name: 'unitConfiguration',
                    query: {
                      orgName: scope.row.orgName,
                      id:scope.row.orgCode
                    },
                  })
                "
              >单位配置</a>
            </template>
          </table-list>
        </el-card>
      </div>
    </el-col>
  </el-row>
</template>
<style lang="less" scoped>
</style>
