by2025/admin-vben5
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

访客管理

Browse Source
This commit is contained in:
FLL 2025-06-30 17:58:33 +08:00
parent d24d03457a
commit 19f8c57e23
12 changed files with 570 additions and 380 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
apps/web-antd/src/api/property/visitorManagement/index.ts
View File

@ -1,8 +1,6 @@
import type { VisitorManagementVO, VisitorManagementForm, VisitorManagementQuery } from './model';
import type { ID, IDS } from '#/api/common';
import type { PageResult } from '#/api/common';
import { commonExport } from '#/api/helper';
import { requestClient } from '#/api/request';
@ -59,3 +57,4 @@ export function visitorManagementUpdate(data: VisitorManagementForm) {
export function visitorManagementRemove(id: ID | IDS) {
return requestClient.deleteWithMsg<void>(`/property/visitorManagement/${id}`);
}

75
apps/web-antd/src/api/property/visitorManagement/model.d.ts vendored
View File

@ -70,7 +70,6 @@ export interface VisitorManagementVO {
* 预约状态（0：待确认，1：已确认，2：已取消，3：已完成）
*/
serveStatus: number;
}
export interface VisitorManagementForm extends BaseEntity {
@ -143,7 +142,6 @@ export interface VisitorManagementForm extends BaseEntity {
* 预约状态（0：待确认，1：已确认，2：已取消，3：已完成）
*/
serveStatus?: number;
}
export interface VisitorManagementQuery extends PageQuery {
@ -217,3 +215,76 @@ export interface VisitorManagementQuery extends PageQuery {
*/
params?: any;
}
export interface VisitorManagementDetail extends BaseEntity {
/**
* id
*/
id?: string | number;
/**
* 访客姓名
*/
visitorName?: string;
/**
* 所属公司
*/
visitorUnit?: string;
/**
* 访客电话
*/
visitorPhone?: string;
/**
* 拜访事由
*/
visitingReason?: string;
/**
* 被访人
*/
interviewedPerson?: string;
/**
* 被访单位
*/
interviewedUnit?: string;
/**
* 被访人联系方式
*/
interviewedPhone?: string;
/**
* 拜访开始时间
*/
visitingBeginTime?: string;
/**
* 拜访结束时间
*/
visitingEndTime?: string;
/**
* 预约车位（0：预约，1：不预约）
*/
bookingParkingSpace?: number;
/**
* 车牌号
*/
licensePlate?: string;
/**
* 人脸图片
*/
facePictures?: string;
/**
* 预约状态（0：待确认，1：已确认，2：已取消，3：已完成）
*/
serveStatus?: number;
}

86
apps/web-antd/src/views/property/greenPlantRentalManagement/chargeManagement/data.ts
View File

@ -7,37 +7,25 @@ export const querySchema: FormSchemaGetter = () => [
{
component: 'Input',
fieldName: 'orderId',
label: '订单id',
label: '订单号',
},
{
component: 'Input',
fieldName: 'userId',
label: '租赁人id',
},
{
component: 'Select',
componentProps: {
options: getDictOptions('pro_invoice_status'),
},
fieldName: 'invoiceStatus',
label: '开票状态',
},
{
component: 'Input',
fieldName: 'userName',
label: '租赁人名称',
},
{
component: 'Input',
fieldName: 'rent',
label: '租金',
},
{
component: 'Input',
fieldName: 'deposit',
label: '押金',
},
{
component: 'Input',
fieldName: 'penalty',
label: '违约金',
},
{
component: 'Input',
fieldName: 'totalAmount',
label: '总金额',
label: '租赁人',
},
{
component: 'DatePicker',
@ -57,19 +45,6 @@ export const querySchema: FormSchemaGetter = () => [
fieldName: 'paymentMethod',
label: '支付方式',
},
{
component: 'Select',
componentProps: {
options: getDictOptions('pro_invoice_status'),
},
fieldName: 'invoiceStatus',
label: '开票状态',
},
{
component: 'Input',
fieldName: 'invoiceType',
label: '发票类型',
},
{
component: 'Select',
componentProps: {
@ -83,11 +58,16 @@ export const querySchema: FormSchemaGetter = () => [
export const columns: VxeGridProps['columns'] = [
{ type: 'checkbox', width: 60 },
{
title: '主键',
title: '序号',
field: 'id',
slots: {
default: ({ rowIndex }) => {
return (rowIndex + 1).toString();
},
},
},
{
title: '订单id',
title: '订单号',
field: 'orderId',
},
{
@ -95,7 +75,7 @@ export const columns: VxeGridProps['columns'] = [
field: 'userId',
},
{
title: '租赁人名称',
title: '租赁人',
field: 'userName',
},
{
@ -169,7 +149,7 @@ export const modalSchema: FormSchemaGetter = () => [
},
},
{
label: '订单id',
label: '订单号',
fieldName: 'orderId',
component: 'Input',
rules: 'required',
@ -181,7 +161,7 @@ export const modalSchema: FormSchemaGetter = () => [
rules: 'required',
},
{
label: '租赁人名称',
label: '租赁人',
fieldName: 'userName',
component: 'Input',
rules: 'required',
@ -204,32 +184,6 @@ export const modalSchema: FormSchemaGetter = () => [
component: 'Input',
rules: 'required',
},
{
label: '总金额',
fieldName: 'totalAmount',
component: 'Input',
rules: 'required',
},
{
label: '收费日期',
fieldName: 'chargeDate',
component: 'DatePicker',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
rules: 'required',
},
{
label: '支付方式',
fieldName: 'paymentMethod',
component: 'Select',
componentProps: {
options: getDictOptions('pro_payment_method'),
},
rules: 'selectRequired',
},
{
label: '开票状态',
fieldName: 'invoiceStatus',

6
apps/web-antd/src/views/property/greenPlantRentalManagement/chargeManagement/orderCharge-modal.vue
View File

@ -12,12 +12,12 @@ const emit = defineEmits<{ reload: [] }>();
const isUpdate = ref(false);
const title = computed(() => {
return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
return isUpdate.value ? $t('pages.common.edit') : '添加收费';
});
const [BasicForm, formApi] = useVbenForm({
commonConfig: {
formItemClass: 'col-span-2',
formItemClass: 'col-span-1',
labelWidth: 80,
componentProps: {
class: 'w-full',
@ -36,7 +36,7 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
);
const [BasicModal, modalApi] = useVbenModal({
class: 'w-[550px]',
class: 'w-[60%]',
fullscreenButton: false,
onBeforeClose,
onClosed: handleClosed,

172
apps/web-antd/src/views/property/visitorManagement/index.vue
View File

@ -1,172 +0,0 @@
<script setup lang="ts">
import type { Recordable } from '@vben/types';
import { ref } from 'vue';
import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
import { getVxePopupContainer } from '@vben/utils';
import { Modal, Popconfirm, Space } from 'ant-design-vue';
import dayjs from 'dayjs';
import {
useVbenVxeGrid,
vxeCheckboxChecked,
type VxeGridProps
} from '#/adapter/vxe-table';
import {
visitorManagementExport,
visitorManagementList,
visitorManagementRemove,
} from '#/api/property/visitorManagement';
import type { VisitorManagementForm } from '#/api/property/visitorManagement/model';
import { commonDownloadExcel } from '#/utils/file/download';
import visitorManagementModal from './visitorManagement-modal.vue';
import { columns, querySchema } from './data';
const formOptions: VbenFormProps = {
commonConfig: {
labelWidth: 80,
componentProps: {
allowClear: true,
},
},
schema: querySchema(),
wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
};
const gridOptions: VxeGridProps = {
checkboxConfig: {
// 高亮
highlight: true,
// 翻页时保留选中状态
reserve: true,
// 点击行选中
// trigger: 'row',
},
// columns: columns(),
columns,
height: 'auto',
keepSource: true,
pagerConfig: {},
proxyConfig: {
ajax: {
query: async ({ page }, formValues = {}) => {
return await visitorManagementList({
pageNum: page.currentPage,
pageSize: page.pageSize,
...formValues,
});
},
},
},
rowConfig: {
keyField: 'id',
},
// 表格全局唯一表示 保存列配置需要用到
id: 'property-visitorManagement-index'
};
const [BasicTable, tableApi] = useVbenVxeGrid({
formOptions,
gridOptions,
});
const [VisitorManagementModal, modalApi] = useVbenModal({
connectedComponent: visitorManagementModal,
});
function handleAdd() {
modalApi.setData({});
modalApi.open();
}
async function handleEdit(row: Required<VisitorManagementForm>) {
modalApi.setData({ id: row.id });
modalApi.open();
}
async function handleDelete(row: Required<VisitorManagementForm>) {
await visitorManagementRemove(row.id);
await tableApi.query();
}
function handleMultiDelete() {
const rows = tableApi.grid.getCheckboxRecords();
const ids = rows.map((row: Required<VisitorManagementForm>) => row.id);
Modal.confirm({
title: '提示',
okType: 'danger',
content: `确认删除选中的${ids.length}条记录吗？`,
onOk: async () => {
await visitorManagementRemove(ids);
await tableApi.query();
},
});
}
function handleDownloadExcel() {
commonDownloadExcel(visitorManagementExport, '访客管理数据', tableApi.formApi.form.values, {
fieldMappingTime: formOptions.fieldMappingTime,
});
}
</script>
<template>
<Page :auto-content-height="true">
<BasicTable table-title="访客管理列表">
<template #toolbar-tools>
<Space>
<a-button
v-access:code="['property:visitorManagement:export']"
@click="handleDownloadExcel"
>
{{ $t('pages.common.export') }}
</a-button>
<a-button
:disabled="!vxeCheckboxChecked(tableApi)"
danger
type="primary"
v-access:code="['property:visitorManagement:remove']"
@click="handleMultiDelete">
{{ $t('pages.common.delete') }}
</a-button>
<a-button
type="primary"
v-access:code="['property:visitorManagement:add']"
@click="handleAdd"
>
{{ $t('pages.common.add') }}
</a-button>
</Space>
</template>
<template #action="{ row }">
<Space>
<ghost-button
v-access:code="['property:visitorManagement:edit']"
@click.stop="handleEdit(row)"
>
{{ $t('pages.common.edit') }}
</ghost-button>
<Popconfirm
:get-popup-container="getVxePopupContainer"
placement="left"
title="确认删除？"
@confirm="handleDelete(row)"
>
<ghost-button
danger
v-access:code="['property:visitorManagement:remove']"
@click.stop=""
>
{{ $t('pages.common.delete') }}
</ghost-button>
</Popconfirm>
</Space>
</template>
</BasicTable>
<VisitorManagementModal @reload="tableApi.query()" />
</Page>
</template>

203
apps/web-antd/src/views/property/visitorManagement/data.ts → apps/web-antd/src/views/property/visitorManagement/visitorInvitation/data.ts
View File

@ -1,6 +1,5 @@
import type { FormSchemaGetter } from '#/adapter/form';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { getDictOptions } from '#/utils/dict';
import { renderDict } from '#/utils/render';
@ -10,35 +9,23 @@ export const querySchema: FormSchemaGetter = () => [
fieldName: 'visitorName',
label: '访客姓名',
},
{
component: 'Input',
fieldName: 'visitorUnit',
label: '所属公司',
},
{
component: 'Input',
fieldName: 'visitorPhone',
label: '访客电话',
},
{
component: 'Input',
fieldName: 'visitingReason',
label: '拜访事由',
},
{
component: 'Input',
fieldName: 'interviewedPerson',
label: '被访人',
label: '邀约人',
},
{
component: 'Input',
fieldName: 'interviewedUnit',
label: '被访单位',
label: '邀约单位',
},
{
component: 'Input',
fieldName: 'interviewedPhone',
label: '被访人联系方式',
component: 'Select',
componentProps: {
options: getDictOptions('wy_appointment_tatus'),
},
fieldName: 'serveStatus',
label: '预约状态',
},
{
component: 'DatePicker',
@ -48,7 +35,7 @@ export const querySchema: FormSchemaGetter = () => [
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
fieldName: 'visitingBeginTime',
label: '拜访开始时间',
label: '拜访时间',
},
{
component: 'DatePicker',
@ -57,103 +44,83 @@ export const querySchema: FormSchemaGetter = () => [
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
fieldName: 'visitingEndTime',
label: '拜访结束时间',
},
{
component: 'Input',
fieldName: 'bookingParkingSpace',
label: '预约车位',
},
{
component: 'Input',
fieldName: 'licensePlate',
label: '车牌号',
},
{
component: 'Input',
fieldName: 'facePictures',
label: '人脸图片',
},
{
component: 'RadioGroup',
componentProps: {
// 可选从DictEnum中获取 DictEnum.WY_APPOINTMENT_TATUS 便于维护
options: getDictOptions('wy_appointment_tatus'),
buttonStyle: 'solid',
optionType: 'button',
},
fieldName: 'serveStatus',
label: '预约状态',
fieldName: 'createTime',
label: '提交时间',
},
];
// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
// export const columns: () => VxeGridProps['columns'] = () => [
export const columns: VxeGridProps['columns'] = [
{ type: 'checkbox', width: 60 },
{
title: 'id',
title: '序号',
field: 'id',
slots: {
default: ({ rowIndex }) => {
return (rowIndex + 1).toString();
},
},
},
{
title: '访客姓名',
field: 'visitorName',
},
{
title: '访客电话',
field: 'visitorPhone',
},
{
title: '所属公司',
field: 'visitorUnit',
},
{
title: '访客电话',
field: 'visitorPhone',
title: '邀约人',
field: 'interviewedPerson',
},
{
title: '联系电话',
field: 'interviewedPhone',
},
{
title: '邀约单位',
field: 'interviewedUnit',
},
{
title: '拜访事由',
field: 'visitingReason',
},
{
title: '被访人',
field: 'interviewedPerson',
title: '拜访时间',
field: 'visitingTimeRange',
slots: {
default: ({ row }) => {
const beginTime = row.visitingBeginTime || '';
const endTime = row.visitingEndTime || '';
return `${beginTime} - ${endTime}`;
},
},
},
{
title: '被访单位',
field: 'interviewedUnit',
},
{
title: '被访人联系方式',
field: 'interviewedPhone',
},
{
title: '拜访开始时间',
field: 'visitingBeginTime',
},
{
title: '拜访结束时间',
field: 'visitingEndTime',
},
{
title: '预约车位',
title: '是否预约车位',
field: 'bookingParkingSpace',
},
{
title: '车牌号',
field: 'licensePlate',
},
{
title: '人脸图片',
field: 'facePictures',
slots: {
default: ({ row }) => {
return renderDict(row.bookingParkingSpace, 'wy_parking_spot');
},
},
},
{
title: '预约状态',
field: 'serveStatus',
slots: {
default: ({ row }) => {
// 可选从DictEnum中获取 DictEnum.WY_APPOINTMENT_TATUS 便于维护
return renderDict(row.serveStatus, 'wy_appointment_tatus');
},
},
},
{
title: '提交时间',
field: 'createTime',
},
{
field: 'action',
fixed: 'right',
@ -179,12 +146,6 @@ export const modalSchema: FormSchemaGetter = () => [
component: 'Input',
rules: 'required',
},
{
label: '所属公司',
fieldName: 'visitorUnit',
component: 'Input',
rules: 'required',
},
{
label: '访客电话',
fieldName: 'visitorPhone',
@ -192,8 +153,8 @@ export const modalSchema: FormSchemaGetter = () => [
rules: 'required',
},
{
label: '拜访事由',
fieldName: 'visitingReason',
label: '所属公司',
fieldName: 'visitorUnit',
component: 'Input',
rules: 'required',
},
@ -204,17 +165,19 @@ export const modalSchema: FormSchemaGetter = () => [
rules: 'required',
},
{
label: '被访单位',
fieldName: 'interviewedUnit',
component: 'Input',
},
{
label: '被访人联系方式',
label: '联系电话',
fieldName: 'interviewedPhone',
component: 'Input',
rules: 'required',
},
{
label: '拜访开始时间',
label: '拜访事由',
fieldName: 'visitingReason',
component: 'Input',
rules: 'required',
},
{
label: '拜访时间',
fieldName: 'visitingBeginTime',
component: 'DatePicker',
componentProps: {
@ -222,43 +185,33 @@ export const modalSchema: FormSchemaGetter = () => [
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
},
{
label: '拜访结束时间',
fieldName: 'visitingEndTime',
component: 'DatePicker',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
rules: 'required',
},
{
label: '预约车位',
fieldName: 'bookingParkingSpace',
component: 'Input',
component: 'RadioGroup',
componentProps: {
options: [
{ label: '否', value: '1' },
{ label: '是', value: '0' },
],
},
rules: 'required',
},
{
label: '车牌号',
fieldName: 'licensePlate',
component: 'Input',
},
{
label: '人脸图片',
fieldName: 'facePictures',
component: 'Input',
rules: 'required',
},
{
label: '预约状态',
fieldName: 'serveStatus',
component: 'RadioGroup',
componentProps: {
// 可选从DictEnum中获取 DictEnum.WY_APPOINTMENT_TATUS 便于维护
options: getDictOptions('wy_appointment_tatus'),
buttonStyle: 'solid',
optionType: 'button',
},
},
// {
// label: '人脸图片',
// fieldName: 'facePictures',
// component: 'ImageUpload',
// componentProps: {
// maxCount: 1,
// },
// formItemClass: 'col-span-2',
// },
];

104
apps/web-antd/src/views/property/visitorManagement/visitorInvitation/index.vue Normal file
View File

@ -0,0 +1,104 @@
<script setup lang="ts">
import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
import { Space } from 'ant-design-vue';
import {
useVbenVxeGrid,
type VxeGridProps
} from '#/adapter/vxe-table';
import {
visitorManagementList,
} from '#/api/property/visitorManagement';
import type { VisitorManagementForm } from '#/api/property/visitorManagement/model';
import VisitorInvitationModal from './visitorInvitation-modal.vue';
import VisitorInvitationDetail from './visitorInvitation-detail.vue';
import { columns, querySchema } from './data';
const formOptions: VbenFormProps = {
commonConfig: {
labelWidth: 80,
componentProps: {
allowClear: true,
},
},
schema: querySchema(),
wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
};
const gridOptions: VxeGridProps = {
checkboxConfig: {
highlight: true,
reserve: true,
},
columns,
height: 'auto',
keepSource: true,
pagerConfig: {},
proxyConfig: {
ajax: {
query: async ({ page }, formValues = {}) => {
return await visitorManagementList({
pageNum: page.currentPage,
pageSize: page.pageSize,
...formValues,
});
},
},
},
rowConfig: {
keyField: 'id',
},
id: 'property-visitorManagement-index'
};
const [BasicTable, tableApi] = useVbenVxeGrid({
formOptions,
gridOptions,
});
const [VisitorManagement, modalApi] = useVbenModal({
connectedComponent: VisitorInvitationModal,
});
const [visitorManagementDetailModal, visitorManagementDetailApi] = useVbenModal({
connectedComponent: VisitorInvitationDetail,
});
async function handleInfo(row: Required<VisitorManagementForm>) {
visitorManagementDetailApi.setData({ id: row.id });
visitorManagementDetailApi.open();
}
function handleAdd() {
modalApi.setData({});
modalApi.open();
}
</script>
<template>
<Page :auto-content-height="true">
<BasicTable table-title="访客邀约列表">
<template #toolbar-tools>
<Space>
<a-button
type="primary"
v-access:code="['property:visitorManagement:add']"
@click="handleAdd"
>
{{ '添加邀约' }}
</a-button>
</Space>
</template>
<template #action="{ row }">
<Space>
<ghost-button
@click.stop="handleInfo(row)"
>
{{ $t('pages.common.info') }}
</ghost-button>
</Space>
</template>
</BasicTable>
<VisitorManagement @reload="tableApi.query()" />
<visitorManagementDetailModal/>
</Page>
</template>

77
apps/web-antd/src/views/property/visitorManagement/visitorInvitation/visitorInvitation-detail.vue Normal file
View File

@ -0,0 +1,77 @@
<script setup lang="ts">
import type {VisitorManagementDetail} from '#/api/property/visitorManagement/model';
import {shallowRef} from 'vue';
import {useVbenModal} from '@vben/common-ui';
import {Descriptions, DescriptionsItem} from 'ant-design-vue';
import dayjs from 'dayjs';
import duration from 'dayjs/plugin/duration';
import relativeTime from 'dayjs/plugin/relativeTime';
import {visitorManagementInfo} from '#/api/property/visitorManagement';
import {renderDict} from "#/utils/render";
dayjs.extend(duration);
dayjs.extend(relativeTime);
const [BasicModal, modalApi] = useVbenModal({
onOpenChange: handleOpenChange,
onClosed() {
unitDetail.value = null;
},
});
const unitDetail = shallowRef<null | VisitorManagementDetail>(null);
async function handleOpenChange(open: boolean) {
if (!open) {
return null;
}
modalApi.modalLoading(true);
const {id} = modalApi.getData() as { id: number | string };
const response = await visitorManagementInfo(id);
unitDetail.value = response;
modalApi.modalLoading(false);
}
</script>
<template>
<BasicModal :footer="false" :fullscreen-button="false" title="访客管理信息" class="w-[70%]">
<Descriptions v-if="unitDetail" size="small" :column="2" bordered :labelStyle="{width:'100px'}">
<DescriptionsItem label="访客姓名">
{{ unitDetail.visitorName }}
</DescriptionsItem>
<DescriptionsItem label="访客电话">
{{ unitDetail.visitorPhone }}
</DescriptionsItem>
<DescriptionsItem label="所属公司">
{{ unitDetail.visitorUnit}}
</DescriptionsItem>
<DescriptionsItem label="被访人">
{{ unitDetail.interviewedPerson }}
</DescriptionsItem>
<DescriptionsItem label="联系电话">
{{ unitDetail.interviewedPhone }}
</DescriptionsItem>
<DescriptionsItem label="被访单位">
{{ unitDetail.interviewedUnit }}
</DescriptionsItem>
<DescriptionsItem label="拜访事由">
{{ unitDetail.visitingReason }}
</DescriptionsItem>
<DescriptionsItem label="拜访时间">
{{ unitDetail.visitingBeginTime+' - '+unitDetail.visitingBeginTime }}
</DescriptionsItem>
<DescriptionsItem label="是否预约车位" v-if="unitDetail.bookingParkingSpace!=null">
<component
:is="renderDict(unitDetail.bookingParkingSpace,'wy_parking_spot')"
/>
</DescriptionsItem>
<DescriptionsItem label="预约状态" v-if="unitDetail.serveStatus!=null">
<component
:is="renderDict(unitDetail.serveStatus,'wy_appointment_tatus')"
/>
</DescriptionsItem>
<DescriptionsItem label="提交时间">
{{ unitDetail.createTime }}
</DescriptionsItem>
</Descriptions>
</BasicModal>
</template>

12
apps/web-antd/src/views/property/visitorManagement/visitorManagement-modal.vue → apps/web-antd/src/views/property/visitorManagement/visitorInvitation/visitorInvitation-modal.vue
View File

@ -1,8 +1,7 @@
<script setup lang="ts">
import { computed, ref } from 'vue';
import { ref } from 'vue';
import { useVbenModal } from '@vben/common-ui';
import { $t } from '@vben/locales';
import { cloneDeep } from '@vben/utils';
import { useVbenForm } from '#/adapter/form';
@ -14,14 +13,11 @@ import { modalSchema } from './data';
const emit = defineEmits<{ reload: [] }>();
const isUpdate = ref(false);
const title = computed(() => {
return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
});
const [BasicForm, formApi] = useVbenForm({
commonConfig: {
// 默认占满两列
formItemClass: 'col-span-2',
formItemClass: 'col-span-1',
// 默认label宽度 px
labelWidth: 80,
// 通用配置项 会影响到所有表单项
@ -43,7 +39,7 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
const [BasicModal, modalApi] = useVbenModal({
// 在这里更改宽度
class: 'w-[550px]',
class: 'w-[60%]',
fullscreenButton: false,
onBeforeClose,
onClosed: handleClosed,
@ -94,7 +90,7 @@ async function handleClosed() {
</script>
<template>
<BasicModal :title="title">
<BasicModal title="添加邀约">
<BasicForm />
</BasicModal>
</template>

131
apps/web-antd/src/views/property/visitorManagement/visitorTodo/data.ts Normal file
View File

@ -0,0 +1,131 @@
import type { FormSchemaGetter } from '#/adapter/form';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { getDictOptions } from '#/utils/dict';
import { renderDict } from '#/utils/render';
export const querySchema: FormSchemaGetter = () => [
{
component: 'Input',
fieldName: 'visitorName',
label: '访客姓名',
},
{
component: 'Input',
fieldName: 'interviewedPerson',
label: '被访人',
},
{
component: 'Input',
fieldName: 'interviewedUnit',
label: '被访单位',
},
{
component: 'Select',
componentProps: {
options: getDictOptions('wy_appointment_tatus'),
},
fieldName: 'serveStatus',
label: '预约状态',
},
{
component: 'DatePicker',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
fieldName: 'visitingBeginTime',
label: '拜访时间',
},
{
component: 'DatePicker',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
fieldName: 'createTime',
label: '提交时间',
},
];
export const columns: VxeGridProps['columns'] = [
{ type: 'checkbox', width: 60 },
{
title: '序号',
field: 'id',
slots: {
default: ({ rowIndex }) => {
return (rowIndex + 1).toString();
},
},
},
{
title: '访客姓名',
field: 'visitorName',
},
{
title: '访客电话',
field: 'visitorPhone',
},
{
title: '所属公司',
field: 'visitorUnit',
},
{
title: '被访人',
field: 'interviewedPerson',
},
{
title: '联系电话',
field: 'interviewedPhone',
},
{
title: '被访单位',
field: 'interviewedUnit',
},
{
title: '拜访事由',
field: 'visitingReason',
},
{
title: '拜访时间',
field: 'visitingTimeRange',
slots: {
default: ({ row }) => {
const beginTime = row.visitingBeginTime || '';
const endTime = row.visitingEndTime || '';
return `${beginTime} - ${endTime}`;
},
},
},
{
title: '是否预约车位',
field: 'bookingParkingSpace',
slots: {
default: ({ row }) => {
return renderDict(row.bookingParkingSpace, 'wy_parking_spot');
},
},
},
{
title: '预约状态',
field: 'serveStatus',
slots: {
default: ({ row }) => {
return renderDict(row.serveStatus, 'wy_appointment_tatus');
},
},
},
{
title: '提交时间',
field: 'createTime',
},
{
field: 'action',
fixed: 'right',
slots: { default: 'action' },
title: '操作',
width: 180,
},
];

77
apps/web-antd/src/views/property/visitorManagement/visitorTodo/visitorTodo-detail.vue Normal file
View File

@ -0,0 +1,77 @@
<script setup lang="ts">
import type {VisitorManagementDetail} from '#/api/property/visitorManagement/model';
import {shallowRef} from 'vue';
import {useVbenModal} from '@vben/common-ui';
import {Descriptions, DescriptionsItem} from 'ant-design-vue';
import dayjs from 'dayjs';
import duration from 'dayjs/plugin/duration';
import relativeTime from 'dayjs/plugin/relativeTime';
import {visitorManagementInfo} from '#/api/property/visitorManagement';
import {renderDict} from "#/utils/render";
dayjs.extend(duration);
dayjs.extend(relativeTime);
const [BasicModal, modalApi] = useVbenModal({
onOpenChange: handleOpenChange,
onClosed() {
unitDetail.value = null;
},
});
const unitDetail = shallowRef<null | VisitorManagementDetail>(null);
async function handleOpenChange(open: boolean) {
if (!open) {
return null;
}
modalApi.modalLoading(true);
const {id} = modalApi.getData() as { id: number | string };
const response = await visitorManagementInfo(id);
unitDetail.value = response;
modalApi.modalLoading(false);
}
</script>
<template>
<BasicModal :footer="false" :fullscreen-button="false" title="访客管理信息" class="w-[70%]">
<Descriptions v-if="unitDetail" size="small" :column="2" bordered :labelStyle="{width:'100px'}">
<DescriptionsItem label="访客姓名">
{{ unitDetail.visitorName }}
</DescriptionsItem>
<DescriptionsItem label="访客电话">
{{ unitDetail.visitorPhone }}
</DescriptionsItem>
<DescriptionsItem label="所属公司">
{{ unitDetail.visitorUnit}}
</DescriptionsItem>
<DescriptionsItem label="被访人">
{{ unitDetail.interviewedPerson }}
</DescriptionsItem>
<DescriptionsItem label="联系电话">
{{ unitDetail.interviewedPhone }}
</DescriptionsItem>
<DescriptionsItem label="被访单位">
{{ unitDetail.interviewedUnit }}
</DescriptionsItem>
<DescriptionsItem label="拜访事由">
{{ unitDetail.visitingReason }}
</DescriptionsItem>
<DescriptionsItem label="拜访时间">
{{ unitDetail.visitingBeginTime+' - '+unitDetail.visitingBeginTime }}
</DescriptionsItem>
<DescriptionsItem label="是否预约车位" v-if="unitDetail.bookingParkingSpace!=null">
<component
:is="renderDict(unitDetail.bookingParkingSpace,'wy_parking_spot')"
/>
</DescriptionsItem>
<DescriptionsItem label="预约状态" v-if="unitDetail.serveStatus!=null">
<component
:is="renderDict(unitDetail.serveStatus,'wy_appointment_tatus')"
/>
</DescriptionsItem>
<DescriptionsItem label="提交时间">
{{ unitDetail.createTime }}
</DescriptionsItem>
</Descriptions>
</BasicModal>
</template>

4
apps/web-antd/vite.config.mts
View File

@ -28,8 +28,8 @@ export default defineConfig(async () => {
rewrite: (path) => path.replace(/^\/api/, ''),
// mock代理目标地址
// target: 'http://by.missmoc.top:3010/',
target: 'http://127.0.0.1:8080/',
// target: 'http://47.109.37.87:3010',
// target: 'http://192.168.0.103:8080',
target: 'http://47.109.37.87:3010',
ws: true,
},
},