policeSecurity/superManagement/src/views/unitManage/policeUnit/index.vue

<template>
  <TableProMax
      ref="tableRef"
      :request-api="reqApi"
      :columns="columns"
      :searchFormOptions="searchFormOptions"
  >

  </TableProMax>
</template>

<script setup lang="tsx">
import TableProMax from "@/components/table/TableProMax.vue";
import {ref} from "vue";
import {ComponentExposed} from "vue-component-type-helpers";
import {TableProMaxProps} from "@/types/components/table";
import {PoliceUnitPagerQueryParams, PoliceUnitPagerVo} from "@/types/views/unitManage/policeUnit.ts";
import api from "@/axios";
import {dictSelectNodes} from "@/config/dict.ts";
import {message} from "ant-design-vue";
import {UNIT_TYPE} from "@/config";

type TableProps = TableProMaxProps<PoliceUnitPagerVo, PoliceUnitPagerQueryParams>

const tableRef = ref<ComponentExposed<typeof TableProMax>>(null!)
const reqApi: TableProps['requestApi'] = (params) => api.post('/policeUnit/pager', params)
const columns: TableProps['columns'] = [
  {
    dataIndex: 'name',
    title: '名称'
  }, {
    dataIndex: 'code',
    title: '代码'
  }, {
    dataIndex: 'contactPersonInfo',
    title: '联系人',
    customRender({record}) {
      return record.contactPersonInfo?.name + "/" + record.contactPersonInfo?.telephone
    },
  }, {
    dataIndex: 'provinceName',
    title: '行政区划',
    customRender: ({record}) => [record.provinceName, record.cityName, record.districtsName, record.streetName].filter(Boolean).join('/')
  }, {
    dataIndex: 'isEnable',
    title: '是否启用',
    customRender: ({text}) => <a-tag color={text?.extData?.color}>{text?.label}</a-tag>,
  }, {
    dataIndex: 'checkStatus',
    title: '审核状态',
    customRender: ({text}) => <a-tag color={text?.extData?.color}>{text?.label}</a-tag>,
  }, {
    dataIndex: 'createTime',
    title: '创建时间'
  }, {
    dataIndex: 'opt',
    title: '操作',
    customRender({record}) {
      return <a-space>
        {record.checkStatus.value === 1 && <a-popconfirm
            title="确认审核通过嘛?"
            onConfirm={async () => {
              const resp = await api.post('/management/checkPass', {
                checkDataId: record.snowFlakeId,
                unitOptType: UNIT_TYPE.police
              })
              message.success(resp.message)
              await tableRef.value?.requestGetTableData()
            }}>
          <a-button type="primary">审核通过
          </a-button>
        </a-popconfirm>
        }
        <a-button
            class={record.isEnable.value === 0 ? 'btn-danger' : 'btn-success'}
            onClick={async () => {
              const resp = await api.post('/management/disableOrEnable', {
                unitId: record.snowFlakeId,
                unitOptType: UNIT_TYPE.police
              })
              message.success(resp.message)
              await tableRef.value?.requestGetTableData()
            }}
        >{record.isEnable.value === 0 ? '禁用' : '启用'}</a-button>
      </a-space>
    },
  }
]
const searchFormOptions: TableProps["searchFormOptions"] = {
  name: {
    type: 'input',
    label: '名称'
  }, code: {
    type: 'input',
    label: '代码'
  }, isEnable: {
    type: 'select',
    label: '是否启用',
    options: [
      {
        value: null,
        label: '全部'
      }, ...dictSelectNodes('IsEnable')
    ]
  }, checkStatus: {
    type: 'select',
    label: '审核状态',
    options: [
      {
        value: null,
        label: '全部'
      }, ...dictSelectNodes('CheckStatus')
    ]
  }
}

</script>

<style scoped lang="scss">

</style>