policeSecurity/policeManagement/src/views/user/user-weapp.vue

149 lines
3.9 KiB
Vue

<template>
<div>
<!-- 小程序用户 -->
<TableProMax ref="tableRef" :request-api="reqApi" :columns="columns" :searchFormOptions="searchFormOptions"
:scroll="{ x }">
</TableProMax>
</div>
</template>
<script setup lang="tsx">
import api from '@/axios'
import {ref, reactive} from 'vue'
import TableProMax from '@/components/table/TableProMax.vue'
import {TableProMaxProps} from '@/types/components/table/index.ts'
import {ComponentExposed} from 'vue-component-type-helpers'
import {dictSelectNodes} from '@/config/dict.ts'
import {publicUnitPagerQueryParams, FromItem} from '@/types/views/publicUnit.ts'
import {FormExpose} from 'ant-design-vue/es/form/Form'
const formRef = ref<FormExpose>(null)
type TableProps = TableProMaxProps<publicUnitPagerQueryParams>
const tableRef = ref<ComponentExposed<typeof TableProMax>>(null!)
const reqApi: TableProps['requestApi'] = (params) => api.post('/management/miniProgramUserPager', params) //分页
const columns: TableProps['columns'] = [
{
dataIndex: 'name',
title: '用户名',
},
{
dataIndex: 'isEnable',
title: '是否启用',
customRender: ({text}) => <a-tag color={text?.extData?.color}>{text?.label}</a-tag>,
},
{
dataIndex: 'checkStatus',
title: '是否审核',
customRender: ({record}) => {
return record.checkStatus?.extData?.color === 'success' ?
<a-tag color='green'>{record?.checkStatus?.label}</a-tag> :
<a-tag color='#f50'>{record?.checkStatus?.label}</a-tag>
},
},
{
dataIndex: 'identity',
title: '身份',
customRender: ({record}) => {
return record?.identity?.label
},
},
{
dataIndex: 'telephone',
title: '手机号',
},
{
dataIndex: 'createTime',
title: '创建时间',
},
{
dataIndex: 'opt',
title: '操作',
customRender({record}) {
if (record.checkStatus.value === 1) {
return <a-space>
<a-popconfirm
title="确认审核通过嘛?"
onConfirm={async () => {
const resp = await api.post('/management/passMiniProgramUser', {
dataId: record.snowFlakeId,
unitOptType: 'POLICE_UNIT'
})
message.success(resp.message)
await tableRef.value?.requestGetTableData()
}}>
<a-button type="primary">审核通过
</a-button>
</a-popconfirm>
</a-space>
}
return <a-space>
<a-button
class={record.isEnable.value === 0 ? 'btn-danger' : 'btn-success'}
onClick={async () => {
const resp = await api.post('/management/disableOrEnable', {
dataId: record.snowFlakeId,
unitOptType: UNIT_TYPE.police
})
message.success(resp.message)
await tableRef.value?.requestGetTableData()
}}
>{record.isEnable.value === 0 ? '禁用' : '启用'}</a-button>
</a-space>
},
}
]
const x: number = columns.reduce((a, b) => a + (b.width as number), 0)
const searchFormOptions = reactive<TableProps['searchFormOptions']>({
name: {
type: 'input',
label: '用户名',
},
telephone: {
type: 'input',
label: '手机号',
},
isEnable: {
type: 'select',
label: '是否启用',
options: [
{
value: null,
label: '全部',
},
...dictSelectNodes('IsEnable'),
],
},
CheckStatus: {
type: 'select',
label: '是否审核',
options: [
{
value: null,
label: '全部',
},
...dictSelectNodes('CheckStatus'),
],
},
// MiniProgramUserIdentity: {
// type: 'select',
// label: '身份选择',
// options: [
// {
// value: null,
// label: '全部',
// },
// ...dictSelectNodes('MiniProgramUserIdentity'),
// ],
// },
})
</script>