Merge branch 'master' of http://47.109.37.87:3000/by2025/admin-vben5
Some checks are pending
Gitea Actions Demo / Explore-Gitea-Actions (push) Waiting to run
Some checks are pending
Gitea Actions Demo / Explore-Gitea-Actions (push) Waiting to run
# Conflicts: # apps/web-antd/vite.config.mts
This commit is contained in:
commit
44b91fc587
@ -77,7 +77,7 @@ export interface Clean_orderForm extends BaseEntity {
|
||||
/**
|
||||
* 主键
|
||||
*/
|
||||
id?: string | number;
|
||||
id?: string;
|
||||
|
||||
/**
|
||||
* 位置
|
||||
|
||||
@ -1,18 +1,20 @@
|
||||
import type { PersonLibVO, PersonLibForm, PersonLibQuery } from './model';
|
||||
import type { PersonLibForm, PersonLibQuery, PersonLibVO } from './model';
|
||||
|
||||
import type { ID, IDS } from '#/api/common';
|
||||
import type { PageResult } from '#/api/common';
|
||||
import type { ID, IDS, PageResult } from '#/api/common';
|
||||
|
||||
import { commonExport } from '#/api/helper';
|
||||
import { requestClient } from '#/api/request';
|
||||
|
||||
/**
|
||||
* 查询人像库列表
|
||||
* @param params
|
||||
* @returns 人像库列表
|
||||
*/
|
||||
查询人像库列表
|
||||
@param params
|
||||
@returns 人像库列表
|
||||
* @param params
|
||||
*/
|
||||
export function personLibList(params?: PersonLibQuery) {
|
||||
return requestClient.get<PageResult<PersonLibVO>>('/sis/personLib/list', { params });
|
||||
return requestClient.get<PageResult<PersonLibVO>>('/sis/personLib/list', {
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
@ -39,7 +41,7 @@ export function personLibInfo(id: ID) {
|
||||
* @returns void
|
||||
*/
|
||||
export function personLibAdd(data: PersonLibForm) {
|
||||
return requestClient.postWithMsg<void>('/sis/personLib', data);
|
||||
return requestClient.postWithMsg<void>('/sis/personLib/add', data);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@ -7,16 +7,24 @@ import { useVbenForm } from '#/adapter/form';
|
||||
import { cleanList } from '#/api/property/clean';
|
||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||
|
||||
const emit = defineEmits<{ reload: [data: any] }>();
|
||||
const emit = defineEmits<{ reload: [data: any], editReload: [data: any] }>();
|
||||
|
||||
const isUpdate = ref(false);
|
||||
const isAdd = ref(false);
|
||||
const isView = ref(false);
|
||||
const title = computed(() => {
|
||||
return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
|
||||
if(isAdd.value){
|
||||
return $t('pages.common.add');
|
||||
}else if(isView.value){
|
||||
return '查看';
|
||||
}else{
|
||||
return $t('pages.common.edit');
|
||||
}
|
||||
});
|
||||
|
||||
// 缓存清洁服务数据
|
||||
let cleanListData: any[] = [];
|
||||
|
||||
const detailIndex = ref<number>();//传index对应详情的某条数据,对该条数据进行编辑修改
|
||||
const detailSchema = [
|
||||
{
|
||||
label: '劳务名称',
|
||||
@ -50,7 +58,7 @@ const detailSchema = [
|
||||
},
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
{
|
||||
label: '保洁面积',
|
||||
fieldName: 'area',
|
||||
component: 'InputNumber',
|
||||
@ -132,7 +140,6 @@ const detailSchema = [
|
||||
},
|
||||
rules: 'required',
|
||||
},
|
||||
|
||||
{
|
||||
label: '合计费用',
|
||||
fieldName: 'sumPeices',
|
||||
@ -170,11 +177,20 @@ const [BasicModal, modalApi] = useVbenModal({
|
||||
return null;
|
||||
}
|
||||
modalApi.modalLoading(true);
|
||||
const { id } = modalApi.getData() as { id?: number | string };
|
||||
isUpdate.value = !!id;
|
||||
if (isUpdate.value && id) {
|
||||
// TODO: 获取详情数据
|
||||
const data = modalApi.getData();
|
||||
detailIndex.value = modalApi.getData().index;
|
||||
if(!data || Object.keys(data).length === 0){
|
||||
//modalApi.getData()为空时表示添加
|
||||
isAdd.value = true;
|
||||
}else if(detailIndex.value == undefined || detailIndex.value == null){
|
||||
//不存在detailIndex.value时表示查看
|
||||
isView.value = true;
|
||||
}else{
|
||||
//表示编辑
|
||||
isUpdate.value = true;
|
||||
}
|
||||
// TODO: 获取详情数据
|
||||
await formApi.setValues(modalApi.getData());
|
||||
await markInitialized();
|
||||
modalApi.modalLoading(false);
|
||||
},
|
||||
@ -188,6 +204,7 @@ async function handleConfirm() {
|
||||
return;
|
||||
}
|
||||
const data = cloneDeep(await formApi.getValues());
|
||||
console.log(data);
|
||||
|
||||
// 获取选中的服务名称
|
||||
const selectedService = cleanListData.find(item => item.id === data.name);
|
||||
@ -195,8 +212,10 @@ async function handleConfirm() {
|
||||
data.name = selectedService.name;
|
||||
data.id = selectedService.id
|
||||
}
|
||||
console.log(data);
|
||||
|
||||
//index>=0时表示编辑
|
||||
if (detailIndex.value! >= 0) {
|
||||
emit('editReload', data);
|
||||
}
|
||||
handleClosed()
|
||||
await markInitialized();
|
||||
emit('reload', data);
|
||||
@ -209,6 +228,9 @@ async function handleConfirm() {
|
||||
}
|
||||
|
||||
async function handleClosed() {
|
||||
isAdd.value = false;
|
||||
isView.value = false;
|
||||
isUpdate.value = false;
|
||||
await formApi.resetForm();
|
||||
resetInitialized();
|
||||
}
|
||||
@ -216,9 +238,10 @@ async function handleClosed() {
|
||||
|
||||
<template>
|
||||
<BasicModal :title="title">
|
||||
<BasicForm />
|
||||
<BasicForm >
|
||||
</BasicForm>
|
||||
</BasicModal>
|
||||
</template>
|
||||
</template>
|
||||
<style scoped>
|
||||
/* 使用 :deep() 穿透 scoped 样式，影响子组件 */
|
||||
:deep(.ant-input[disabled]),
|
||||
@ -229,4 +252,4 @@ async function handleClosed() {
|
||||
/* 有些浏览器需要这个来覆盖默认颜色 */
|
||||
-webkit-text-fill-color: rgba(0, 0, 0, 0.65) !important;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||
import type { CleanVO } from '#/api/property/clean/model';
|
||||
|
||||
import { h } from 'vue';
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
@ -40,7 +40,7 @@ const totalSumPeices = computed(() => {
|
||||
const isUpdate = ref(false);
|
||||
const isReadonly = ref(false);
|
||||
const title = computed(() => {
|
||||
return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
|
||||
return isUpdate.value ? $t('pages.common.edit') : isReadonly.value ? '详情' : $t('pages.common.add');
|
||||
});
|
||||
|
||||
// 用来缓存 cleanList 的完整数据
|
||||
@ -50,7 +50,8 @@ let cleanListData: CleanVO[] = [];
|
||||
let unitListData: { id: any; name: string }[] = [];
|
||||
|
||||
const editUnitId = ref('');
|
||||
const editCleanId = ref('');
|
||||
const editCleanOrderId = ref('');
|
||||
const detailModal = ref(null);
|
||||
|
||||
const [BasicForm, formApi] = useVbenForm({
|
||||
commonConfig: {
|
||||
@ -117,20 +118,27 @@ const [BasicModal, modalApi] = useVbenModal({
|
||||
if (!isOpen) {
|
||||
return null;
|
||||
}
|
||||
// 查询服务地址树形结构
|
||||
setupCommunitySelect()
|
||||
modalApi.modalLoading(true);
|
||||
const { id, readonly } = modalApi.getData() as {
|
||||
id?: number | string;
|
||||
id?: string;
|
||||
readonly?: boolean;
|
||||
};
|
||||
isUpdate.value = !!id;
|
||||
editCleanOrderId.value = id || '';
|
||||
isReadonly.value = !!readonly;
|
||||
if (isUpdate.value && id) {
|
||||
//判断是否是编辑状态需要先判断是否是只读状态
|
||||
if(isReadonly.value){
|
||||
isUpdate.value = false;
|
||||
}else{
|
||||
isUpdate.value = !!id;
|
||||
}
|
||||
if ((isUpdate.value || isReadonly.value) && id) {
|
||||
const record: any = await clean_orderInfo(id);
|
||||
if (record.starTime) record.starTime = dayjs(record.starTime);
|
||||
if (record.endTime) record.endTime = dayjs(record.endTime);
|
||||
editUnitId.value = record.unitId || '';
|
||||
editCleanId.value = record.cleanId || '';
|
||||
detailTable.value = record.cleanList || [];
|
||||
await formApi.setValues(record);
|
||||
}
|
||||
await markInitialized();
|
||||
@ -245,11 +253,11 @@ const detailColumns = [
|
||||
dataIndex: 'sumPeices',
|
||||
key: 'sumPeices',
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
fixed: 'right' as const,
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
fixed: 'right' as const,
|
||||
},
|
||||
];
|
||||
|
||||
const [DetailTable, detailTableApi] = useVbenVxeGrid({
|
||||
@ -265,20 +273,32 @@ function handleAddDetail() {
|
||||
detailModalApi.setData({});
|
||||
detailModalApi.open();
|
||||
}
|
||||
|
||||
// 添加订单服务详情
|
||||
function handleDetailReload(data: any) {
|
||||
detailTable.value.push(data);
|
||||
}
|
||||
|
||||
// 编辑订单服务详情
|
||||
function handleEditDetailReload(data: any) {
|
||||
detailTable.value[data.index] = data;
|
||||
}
|
||||
// 删除订单服务详情
|
||||
function handleDeleteDetail(record: any, index: number) {
|
||||
console.log(record, index);
|
||||
detailTable.value.splice(index, 1);
|
||||
}
|
||||
// 查看产品详情
|
||||
function handleViewDetail(record: any) {
|
||||
detailModalApi.setData({ ...record, readonly: true });
|
||||
detailModalApi.open();
|
||||
}
|
||||
// 编辑产品详情
|
||||
function handleEditDetail(record: any, index: number) {
|
||||
detailModalApi.setData({ ...record, index, readonly: false });
|
||||
detailModalApi.open();
|
||||
}
|
||||
|
||||
async function handleConfirm() {
|
||||
console.log('handleConfirm123123123');
|
||||
|
||||
if (isReadonly.value) {
|
||||
detailTable.value = [];
|
||||
modalApi.close();
|
||||
return;
|
||||
}
|
||||
@ -289,7 +309,6 @@ async function handleConfirm() {
|
||||
return;
|
||||
}
|
||||
const data = cloneDeep(await formApi.getValues());
|
||||
console.log(data);
|
||||
// 单位数据缓存
|
||||
if (unitListData.length === 0) {
|
||||
const res = await resident_unitList();
|
||||
@ -297,31 +316,16 @@ async function handleConfirm() {
|
||||
}
|
||||
// 劳务数据缓存 cleanListData 已有
|
||||
// 查找label
|
||||
const unitObj = unitListData.find((item) => item.id === data.unit);
|
||||
console.log(unitObj,'unitObj');
|
||||
|
||||
const unitObj = unitListData.find((item) => item.id === data.unitId);
|
||||
const cleanObj = cleanListData.find((item) => item.id === data.name);
|
||||
|
||||
data.unit = unitObj ? unitObj.name : data.unit || '';
|
||||
data.name = cleanObj ? cleanObj.name : data.name || '';
|
||||
data.unitId = unitObj ? unitObj.id : isUpdate.value ? editUnitId.value : '';
|
||||
data.cleanId = cleanObj
|
||||
? cleanObj.id
|
||||
: isUpdate.value
|
||||
? editCleanId.value
|
||||
: '';
|
||||
|
||||
data.sumPeices = parseInt(totalSumPeices.value, 10);
|
||||
|
||||
data.sumPeices = parseInt(totalSumPeices.value, 10);
|
||||
// 组装 cleanIds
|
||||
// data.cleanIds = detailTable.value.map((item: any) => item.id);
|
||||
data.cleanList = detailTable.value;
|
||||
console.log(data);
|
||||
console.log(12037847120120);
|
||||
await clean_orderAdd(data)
|
||||
// isUpdate.value ? await clean_orderUpdate(data) : await clean_orderAdd(data);
|
||||
console.log('1231273');
|
||||
|
||||
isUpdate.value ? await clean_orderUpdate({...data,id:editCleanOrderId.value}) : await clean_orderAdd(data);
|
||||
resetInitialized();
|
||||
emit('reload');
|
||||
modalApi.close();
|
||||
@ -334,6 +338,7 @@ await clean_orderAdd(data)
|
||||
|
||||
async function handleClosed() {
|
||||
await formApi.resetForm();
|
||||
detailTable.value = [];//清空详情表格
|
||||
resetInitialized();
|
||||
}
|
||||
// 获取服务地址
|
||||
@ -381,8 +386,8 @@ async function setupCommunitySelect() {
|
||||
<!-- 添加订单详情部分 -->
|
||||
<div class="mt-4">
|
||||
<div class="mb-2 flex items-center justify-between">
|
||||
<h3 class="text-lg font-medium">添加保洁订单详情</h3>
|
||||
<a-button type="primary" @click="handleAddDetail">
|
||||
<h3 class="text-lg font-medium">{{ isUpdate ? '编辑保洁订单详情' : isReadonly ? '查看保洁订单详情' : '添加保洁订单详情' }} </h3>
|
||||
<a-button v-if="!isReadonly" type="primary" @click="handleAddDetail">
|
||||
{{ $t('pages.common.add') }}
|
||||
</a-button>
|
||||
</div>
|
||||
@ -396,15 +401,22 @@ async function setupCommunitySelect() {
|
||||
{{ index + 1 }}
|
||||
</template>
|
||||
<template v-else-if="column.key === 'action'">
|
||||
<Button danger @click="handleDeleteDetail(record, index)">
|
||||
删除
|
||||
</Button>
|
||||
<template v-if="isReadonly">
|
||||
<Button @click="handleViewDetail(record)">查看</Button>
|
||||
</template>
|
||||
<template v-else >
|
||||
<Button type="primary" size="small" style="margin-right: 5px;" @click="handleViewDetail(record)">查看</Button>
|
||||
<Button type="primary" size="small" style="margin-right: 5px;" @click="handleEditDetail(record, index)">编辑</Button>
|
||||
<Button danger size="small" @click="handleDeleteDetail(record, index)">
|
||||
删除
|
||||
</Button>
|
||||
</template>
|
||||
</template>
|
||||
</template>
|
||||
</Table>
|
||||
<div>费用合计：{{ totalSumPeices }}元</div>
|
||||
</div>
|
||||
<CleanDetailModal @reload="handleDetailReload" />
|
||||
<CleanDetailModal @reload="handleDetailReload" @editReload="handleEditDetailReload"/>
|
||||
</BasicModal>
|
||||
</template>
|
||||
|
||||
|
||||
@ -3,52 +3,34 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||
|
||||
import { resident_unitList } from '#/api/property/resident/unit';
|
||||
import { useCleanStore } from '#/store';
|
||||
import type { FormSchema } from '../../../../../../../packages/@core/ui-kit/form-ui/src/types';
|
||||
|
||||
const cleanStore = useCleanStore();
|
||||
|
||||
export const querySchema: FormSchemaGetter = () => [
|
||||
{
|
||||
component: 'Input',
|
||||
fieldName: 'location',
|
||||
label: '服务地址',
|
||||
},
|
||||
export const querySchema: (areaList: any[]) => FormSchema[] = (areaList) => [
|
||||
// {
|
||||
// label: '服务地址（房间号）',
|
||||
// label: '服务地址',
|
||||
// component: 'TreeSelect',
|
||||
// fieldName: 'location',
|
||||
// componentProps: {
|
||||
// treeData: areaList || [],
|
||||
// fieldNames: {
|
||||
// label: 'label',
|
||||
// value: 'id',
|
||||
// children: 'children',
|
||||
// },
|
||||
// placeholder: '请选择服务地址',
|
||||
// showSearch: true,
|
||||
// treeDefaultExpandAll: true,
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// label: '服务地址',
|
||||
// component: 'TreeSelect',
|
||||
// defaultValue: undefined,
|
||||
// fieldName: 'location',
|
||||
// rules: 'required',
|
||||
// },
|
||||
// {
|
||||
// label: '服务地址（房间号）',
|
||||
// fieldName: 'location',
|
||||
// component: 'ApiSelect',
|
||||
// componentProps: {
|
||||
// api: resident_unitList,
|
||||
// resultField: 'rows',
|
||||
// labelField: 'name',
|
||||
// valueField: 'id',
|
||||
// placeholder: '请选择服务地址',
|
||||
// onChange: (val: string | number) => {
|
||||
// cleanStore.setLocation(val);
|
||||
// },
|
||||
// },
|
||||
// rules: 'required',
|
||||
// },
|
||||
// {
|
||||
// label: '申请人hhh',
|
||||
// fieldName: 'persion',
|
||||
// component: 'ApiSelect',
|
||||
// componentProps: {
|
||||
// api: cleanList,
|
||||
// resultField: 'rows',
|
||||
// labelField: 'name',
|
||||
// valueField: 'id',
|
||||
// placeholder: '请选择申请人',
|
||||
// disabled: computed(() => !cleanStore.isPersionEnabled),
|
||||
// },
|
||||
// rules: 'required',
|
||||
// },
|
||||
{
|
||||
component: 'Input',
|
||||
fieldName: 'persion',
|
||||
@ -91,21 +73,6 @@ export const columns: VxeGridProps['columns'] = [
|
||||
field: 'location',
|
||||
width: '180',
|
||||
},
|
||||
// {
|
||||
// title: '服务面积（㎡）',
|
||||
// field: 'area',
|
||||
// width: 'auto',
|
||||
// },
|
||||
// {
|
||||
// title: '劳务名称',
|
||||
// field: 'name',
|
||||
// width: 'auto',
|
||||
// },
|
||||
// {
|
||||
// title: '申报单价含税（元）',
|
||||
// field: 'prices',
|
||||
// width: 'auto',
|
||||
// },
|
||||
{
|
||||
title: '合计费用（元）',
|
||||
field: 'sumPeices',
|
||||
@ -116,7 +83,7 @@ export const columns: VxeGridProps['columns'] = [
|
||||
field: 'payState',
|
||||
width: '120',
|
||||
slots: {
|
||||
default: ({ row }) => (row.stater === 1 ? '已支付' : '待支付'),
|
||||
default: ({ row }) => (row.state === 1 ? '已支付' : '待支付'),
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -143,6 +110,12 @@ export const columns: VxeGridProps['columns'] = [
|
||||
title: '联系电话',
|
||||
field: 'phone',
|
||||
width: 'auto',
|
||||
},
|
||||
{
|
||||
title: '订单状态',
|
||||
field: 'state',
|
||||
width: 'auto',
|
||||
slots: { default: 'state' },
|
||||
},
|
||||
// {
|
||||
// title: '提交时间',
|
||||
@ -154,6 +127,7 @@ export const columns: VxeGridProps['columns'] = [
|
||||
slots: { default: 'action' },
|
||||
title: '操作',
|
||||
},
|
||||
|
||||
];
|
||||
|
||||
export const modalSchema: FormSchemaGetter = () => [
|
||||
@ -168,69 +142,11 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
},
|
||||
{
|
||||
label: '服务地址（房间号）',
|
||||
component: 'Input',
|
||||
component: 'TreeSelect',
|
||||
defaultValue: undefined,
|
||||
fieldName: 'location',
|
||||
rules: 'required',
|
||||
},
|
||||
// {
|
||||
// label: '服务面积（㎡）',
|
||||
// fieldName: 'area',
|
||||
// component: 'Input',
|
||||
// rules: 'required',
|
||||
// },
|
||||
// {
|
||||
// label: '劳务名称',
|
||||
// fieldName: 'name',
|
||||
// component: 'ApiSelect',
|
||||
// componentProps: {
|
||||
// api: cleanList,
|
||||
// resultField: 'rows',
|
||||
// labelField: 'name',
|
||||
// valueField: 'id',
|
||||
// },
|
||||
// rules: 'required',
|
||||
// },
|
||||
// {
|
||||
// label: '服务单价',
|
||||
// fieldName: 'prices',
|
||||
// component: 'Input',
|
||||
// rules: 'required',
|
||||
// componentProps: {
|
||||
// placeholder: '',
|
||||
// disabled: true,
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// label: '保洁频率',
|
||||
// fieldName: 'frequency',
|
||||
// component: 'Input',
|
||||
// rules: 'required',
|
||||
// componentProps: {
|
||||
// placeholder: '',
|
||||
// disabled: true,
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// label: '保洁内容',
|
||||
// fieldName: 'standard',
|
||||
// component: 'Input',
|
||||
// rules: 'required',
|
||||
// componentProps: {
|
||||
// placeholder: '',
|
||||
// disabled: true,
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// label: '保洁标准',
|
||||
// fieldName: 'peices',
|
||||
// component: 'Input',
|
||||
// rules: 'required',
|
||||
// componentProps: {
|
||||
// placeholder: '',
|
||||
// disabled: true,
|
||||
// },
|
||||
// },
|
||||
{
|
||||
label: '开始时间',
|
||||
fieldName: 'starTime',
|
||||
@ -267,7 +183,7 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
},
|
||||
{
|
||||
label: '申请单位',
|
||||
fieldName: 'unit',
|
||||
fieldName: 'unitId',
|
||||
component: 'ApiSelect',
|
||||
componentProps: {
|
||||
api: resident_unitList,
|
||||
|
||||
@ -7,7 +7,7 @@ import type { CleanForm } from '#/api/property/clean/model';
|
||||
import { Page, useVbenModal } from '@vben/common-ui';
|
||||
import { getVxePopupContainer } from '@vben/utils';
|
||||
|
||||
import { Modal, Popconfirm, Space } from 'ant-design-vue';
|
||||
import { Modal, Popconfirm, Space, Tag } from 'ant-design-vue';
|
||||
|
||||
import { useVbenVxeGrid, vxeCheckboxChecked } from '#/adapter/vxe-table';
|
||||
import {
|
||||
@ -19,7 +19,12 @@ import { commonDownloadExcel } from '#/utils/file/download';
|
||||
|
||||
import cleanModal from './clean-modal.vue';
|
||||
import { columns, querySchema } from './data';
|
||||
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { communityTree } from '#/api/property/community';
|
||||
const areaList = ref<any>(null);
|
||||
onMounted(async () => {
|
||||
areaList.value = await communityTree(5);
|
||||
});
|
||||
const formOptions: VbenFormProps = {
|
||||
commonConfig: {
|
||||
labelWidth: 120,
|
||||
@ -27,7 +32,7 @@ const formOptions: VbenFormProps = {
|
||||
allowClear: true,
|
||||
},
|
||||
},
|
||||
schema: querySchema(),
|
||||
schema: querySchema(areaList.value),
|
||||
wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
|
||||
// 处理区间选择器RangePicker时间格式 将一个字段映射为两个字段 搜索/导出会用到
|
||||
// 不需要直接删除
|
||||
@ -157,6 +162,11 @@ async function handleView(row: Required<CleanForm>) {
|
||||
</a-button>
|
||||
</Space>
|
||||
</template>
|
||||
<template #state="{ row }">
|
||||
<Tag v-if="row.state === 1" color="success">审核通过</Tag>
|
||||
<Tag v-else-if="row.state === 2" color="error">审核不通过</Tag>
|
||||
<Tag v-else color="default">未审核</Tag>
|
||||
</template>
|
||||
<template #action="{ row }">
|
||||
<Space>
|
||||
<ghost-button @click.stop="handleView(row)"> 查看 </ghost-button>
|
||||
|
||||
@ -41,6 +41,11 @@ export const columns: VxeGridProps['columns'] = [
|
||||
{
|
||||
title: '序号',
|
||||
field: 'id',
|
||||
slots: {
|
||||
default: ({ rowIndex }) => {
|
||||
return (rowIndex + 1).toString();
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '方案名称',
|
||||
@ -57,10 +62,6 @@ export const columns: VxeGridProps['columns'] = [
|
||||
{
|
||||
title: '植物组合包',
|
||||
field: 'scene',
|
||||
},
|
||||
{
|
||||
title: '基础服务项',
|
||||
field: 'scene',
|
||||
},
|
||||
{
|
||||
title: '价格',
|
||||
@ -70,10 +71,7 @@ export const columns: VxeGridProps['columns'] = [
|
||||
title: '状态',
|
||||
field: 'state',
|
||||
slots: {
|
||||
default: ({ row }) => {
|
||||
// 可选从DictEnum中获取 DictEnum.WY_KG 便于维护
|
||||
return renderDict(row.state, 'wy_kg');
|
||||
},
|
||||
default: 'state'
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -119,16 +117,6 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
label: '价格体系',
|
||||
fieldName: 'price',
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
label: '基础服务项',
|
||||
fieldName: 'price',
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
label: '优惠活动',
|
||||
fieldName: 'price',
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
@ -136,7 +124,16 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
// 可选从DictEnum中获取 DictEnum.WY_KG 便于维护
|
||||
options: getDictOptions('wy_kg'),
|
||||
options: [
|
||||
{
|
||||
label: '待支付',
|
||||
value: 0,
|
||||
},
|
||||
{
|
||||
label: '已支付',
|
||||
value: 1,
|
||||
},
|
||||
],
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
},
|
||||
|
||||
@ -6,13 +6,13 @@ 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 { Modal, Popconfirm, Space,Tag } from 'ant-design-vue';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
import {
|
||||
import {
|
||||
useVbenVxeGrid,
|
||||
vxeCheckboxChecked,
|
||||
type VxeGridProps
|
||||
type VxeGridProps
|
||||
} from '#/adapter/vxe-table';
|
||||
|
||||
import {
|
||||
@ -102,7 +102,10 @@ async function handleDelete(row: Required<RentalPlanForm>) {
|
||||
await rentalPlanRemove(row.id);
|
||||
await tableApi.query();
|
||||
}
|
||||
|
||||
async function handleView(row: Required<RentalPlanForm>) {
|
||||
modalApi.setData({ id: row.id, readonly: true,ab:"wegqw" });
|
||||
modalApi.open();
|
||||
}
|
||||
function handleMultiDelete() {
|
||||
const rows = tableApi.grid.getCheckboxRecords();
|
||||
const ids = rows.map((row: Required<RentalPlanForm>) => row.id);
|
||||
@ -122,6 +125,7 @@ function handleDownloadExcel() {
|
||||
fieldMappingTime: formOptions.fieldMappingTime,
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -138,8 +142,8 @@ function handleDownloadExcel() {
|
||||
<a-button
|
||||
:disabled="!vxeCheckboxChecked(tableApi)"
|
||||
danger
|
||||
type="primary"
|
||||
v-access:code="['property:rentalPlan:remove']"
|
||||
type="primary"
|
||||
v-access:code="['property:rentalPlan:remove']"
|
||||
@click="handleMultiDelete">
|
||||
{{ $t('pages.common.delete') }}
|
||||
</a-button>
|
||||
@ -152,8 +156,14 @@ function handleDownloadExcel() {
|
||||
</a-button>
|
||||
</Space>
|
||||
</template>
|
||||
<template #state="{ row }">
|
||||
<Tag v-if="row.state === 0" color="error">禁用</Tag>
|
||||
<Tag v-else-if="row.state === 1" color="success">启用</Tag>
|
||||
<Tag v-else color="default">未审核</Tag>
|
||||
</template>
|
||||
<template #action="{ row }">
|
||||
<Space>
|
||||
<ghost-button @click.stop="handleView(row)"> 查看 </ghost-button>
|
||||
<ghost-button
|
||||
v-access:code="['property:rentalPlan:edit']"
|
||||
@click.stop="handleEdit(row)"
|
||||
|
||||
@ -0,0 +1,238 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, ref } from 'vue';
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { $t } from '@vben/locales';
|
||||
import { cloneDeep } from '@vben/utils';
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||
import { plantsProductList } from '#/api/property/productManagement';
|
||||
|
||||
const emit = defineEmits<{ reload: [data: any], editReload: [data: any] }>();
|
||||
|
||||
const isUpdate = ref(false);
|
||||
const isAdd = ref(false);
|
||||
const isView = ref(false);
|
||||
const title = computed(() => {
|
||||
if(isAdd.value){
|
||||
return $t('pages.common.add');
|
||||
}else if(isView.value){
|
||||
return '查看';
|
||||
}else{
|
||||
return $t('pages.common.edit');
|
||||
}
|
||||
});
|
||||
|
||||
// 缓存清洁服务数据
|
||||
let plantListData: any[] = [];
|
||||
const detailIndex = ref<number>();//传index对应详情的某条数据,对该条数据进行编辑修改
|
||||
const detailSchema = [
|
||||
{
|
||||
label: '产品名称',
|
||||
fieldName: 'plantName',
|
||||
component: 'ApiSelect',
|
||||
componentProps: {
|
||||
api: async () => {
|
||||
const res = await plantsProductList({inventory:0});
|
||||
plantListData = res.rows || [];
|
||||
return res;
|
||||
},
|
||||
resultField: 'rows',
|
||||
labelField: 'plantName',
|
||||
valueField: 'id',
|
||||
onChange: async (value: string) => {
|
||||
console.log(value);
|
||||
|
||||
// 找到选中的服务数据
|
||||
const selectedService = plantListData.find(item => item.id === value);
|
||||
console.log(selectedService,'1203');
|
||||
|
||||
if (selectedService) {
|
||||
// 自动填充其他字段
|
||||
await formApi.setValues({
|
||||
plantCode: selectedService.plantCode,
|
||||
plantType: selectedService.plantType,
|
||||
imgPath: selectedService.imgPath,
|
||||
specification: selectedService.specification,
|
||||
rent: selectedService.rent,
|
||||
state: selectedService.state,
|
||||
remark: selectedService.remark,
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
label: '产品编号',
|
||||
fieldName: 'plantCode',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
},
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
label: '产品分类',
|
||||
fieldName: 'plantType',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
},
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
label: '图片',
|
||||
fieldName: 'imgPath',
|
||||
component: 'InputNumber',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '规格',
|
||||
fieldName: 'specification',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
},
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
label: '租金',
|
||||
fieldName: 'rent',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
},
|
||||
rules: 'required',
|
||||
},
|
||||
|
||||
{
|
||||
label: '状态',
|
||||
fieldName: 'state',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
options: [
|
||||
{ label: '上架', value: 1 },
|
||||
{ label: '下架', value: 0 },
|
||||
],
|
||||
},
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
label: '备注',
|
||||
fieldName: 'remark',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
const [BasicForm, formApi] = useVbenForm({
|
||||
commonConfig: {
|
||||
labelWidth: 120,
|
||||
componentProps: {
|
||||
class: 'w-full',
|
||||
},
|
||||
},
|
||||
schema: detailSchema,
|
||||
showDefaultActions: false,
|
||||
});
|
||||
|
||||
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
||||
{
|
||||
initializedGetter: defaultFormValueGetter(formApi),
|
||||
currentGetter: defaultFormValueGetter(formApi),
|
||||
},
|
||||
);
|
||||
|
||||
const [BasicModal, modalApi] = useVbenModal({
|
||||
onBeforeClose,
|
||||
onClosed: handleClosed,
|
||||
onConfirm: handleConfirm,
|
||||
onOpenChange: async (isOpen) => {
|
||||
if (!isOpen) {
|
||||
return null;
|
||||
}
|
||||
modalApi.modalLoading(true);
|
||||
const data = modalApi.getData();
|
||||
detailIndex.value = modalApi.getData().index;
|
||||
if(!data || Object.keys(data).length === 0){
|
||||
//modalApi.getData()为空时表示添加
|
||||
isAdd.value = true;
|
||||
}else if(detailIndex.value == undefined || detailIndex.value == null){
|
||||
//不存在detailIndex.value时表示查看
|
||||
isView.value = true;
|
||||
}else{
|
||||
//表示编辑
|
||||
isUpdate.value = true;
|
||||
}
|
||||
// TODO: 获取详情数据
|
||||
await formApi.setValues(modalApi.getData());
|
||||
await markInitialized();
|
||||
modalApi.modalLoading(false);
|
||||
},
|
||||
});
|
||||
|
||||
async function handleConfirm() {
|
||||
try {
|
||||
modalApi.lock(true);
|
||||
const { valid } = await formApi.validate();
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
const data = cloneDeep(await formApi.getValues());
|
||||
console.log(data);
|
||||
|
||||
// 获取选中的产品
|
||||
const selectedService = plantListData.find(item => item.id === data.plantName);
|
||||
console.log(selectedService,'selectedService');
|
||||
if (selectedService) {
|
||||
data.plantName = selectedService.plantName;
|
||||
data.id = selectedService.id
|
||||
}
|
||||
//index>=0时表示编辑
|
||||
if (detailIndex.value! >= 0) {
|
||||
emit('editReload', data);
|
||||
}
|
||||
handleClosed()
|
||||
await markInitialized();
|
||||
console.log(data);
|
||||
|
||||
emit('reload', data);
|
||||
modalApi.close();
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
} finally {
|
||||
modalApi.lock(false);
|
||||
}
|
||||
}
|
||||
|
||||
async function handleClosed() {
|
||||
isAdd.value = false;
|
||||
isView.value = false;
|
||||
isUpdate.value = false;
|
||||
await formApi.resetForm();
|
||||
resetInitialized();
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<BasicModal :title="title">
|
||||
<BasicForm >
|
||||
</BasicForm>
|
||||
</BasicModal>
|
||||
</template>
|
||||
<style scoped>
|
||||
/* 使用 :deep() 穿透 scoped 样式，影响子组件 */
|
||||
:deep(.ant-input[disabled]),
|
||||
:deep(.ant-input-number-disabled .ant-input-number-input),
|
||||
:deep(.ant-select-disabled .ant-select-selection-item) {
|
||||
/* 设置一个更深的颜色，可以自己调整 */
|
||||
color: rgba(0, 0, 0, 0.65) !important;
|
||||
/* 有些浏览器需要这个来覆盖默认颜色 */
|
||||
-webkit-text-fill-color: rgba(0, 0, 0, 0.65) !important;
|
||||
}
|
||||
</style>
|
||||
@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
import { Button, Table } from 'ant-design-vue';
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { $t } from '@vben/locales';
|
||||
import { cloneDeep } from '@vben/utils';
|
||||
@ -10,12 +10,13 @@ import { rentalPlanAdd, rentalPlanInfo, rentalPlanUpdate } from '#/api/property/
|
||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||
|
||||
import { modalSchema } from './data';
|
||||
|
||||
import productDetailModal from './rentalPlan-detial-modal.vue';
|
||||
const emit = defineEmits<{ reload: [] }>();
|
||||
|
||||
const isUpdate = ref(false);
|
||||
const isReadonly = ref(false);
|
||||
const title = computed(() => {
|
||||
return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
|
||||
return isUpdate.value ? $t('pages.common.edit') : isReadonly.value ? '详情' : $t('pages.common.add');
|
||||
});
|
||||
|
||||
const [BasicForm, formApi] = useVbenForm({
|
||||
@ -25,9 +26,10 @@ const [BasicForm, formApi] = useVbenForm({
|
||||
// 默认label宽度 px
|
||||
labelWidth: 120,
|
||||
// 通用配置项 会影响到所有表单项
|
||||
componentProps: {
|
||||
componentProps: computed(() => ({
|
||||
class: 'w-full',
|
||||
}
|
||||
disabled: isReadonly.value,
|
||||
})),
|
||||
},
|
||||
schema: modalSchema(),
|
||||
showDefaultActions: false,
|
||||
@ -52,12 +54,20 @@ const [BasicModal, modalApi] = useVbenModal({
|
||||
if (!isOpen) {
|
||||
return null;
|
||||
}
|
||||
console.log(isOpen);
|
||||
|
||||
modalApi.modalLoading(true);
|
||||
console.log(modalApi.getData(),'====================');
|
||||
|
||||
const { id } = modalApi.getData() as { id?: number | string };
|
||||
isUpdate.value = !!id;
|
||||
|
||||
if (isUpdate.value && id) {
|
||||
const { id, readonly } = modalApi.getData() as { id?: number | string, readonly?: boolean; };
|
||||
isReadonly.value = !!readonly;
|
||||
if(isReadonly.value){
|
||||
isUpdate.value = false;
|
||||
}else{
|
||||
isUpdate.value = !!id;
|
||||
}
|
||||
// 查看与编辑时需要获取详情
|
||||
if ((isUpdate.value || isReadonly.value) && id) {
|
||||
const record = await rentalPlanInfo(id);
|
||||
await formApi.setValues(record);
|
||||
}
|
||||
@ -66,6 +76,7 @@ const [BasicModal, modalApi] = useVbenModal({
|
||||
modalApi.modalLoading(false);
|
||||
},
|
||||
});
|
||||
const detailTable = ref<any>([]);
|
||||
|
||||
async function handleConfirm() {
|
||||
try {
|
||||
@ -76,6 +87,10 @@ async function handleConfirm() {
|
||||
}
|
||||
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
||||
const data = cloneDeep(await formApi.getValues());
|
||||
console.log(data);
|
||||
console.log(detailTable.value);
|
||||
|
||||
data.productIds = detailTable.value.map((item:any) => item.id);
|
||||
await (isUpdate.value ? rentalPlanUpdate(data) : rentalPlanAdd(data));
|
||||
resetInitialized();
|
||||
emit('reload');
|
||||
@ -88,9 +103,14 @@ async function handleConfirm() {
|
||||
}
|
||||
|
||||
async function handleClosed() {
|
||||
detailTable.value = [];
|
||||
await formApi.resetForm();
|
||||
resetInitialized();
|
||||
}
|
||||
const [ProductDetailModal, detailModalApi] = useVbenModal({
|
||||
connectedComponent: productDetailModal,
|
||||
});
|
||||
|
||||
const detailColumns = [
|
||||
{ title: '序号', key: 'index' },
|
||||
{ title: '产品编号', dataIndex: 'plantCode', key: 'plantCode' },
|
||||
@ -121,16 +141,43 @@ const detailColumns = [
|
||||
fixed: 'right' as const,
|
||||
},
|
||||
];
|
||||
function handleAddDetail() {
|
||||
detailModalApi.setData({});
|
||||
detailModalApi.open();
|
||||
}
|
||||
//添加植物组合包产品
|
||||
function handleDetailReload (data: any) {
|
||||
detailTable.value.push(data);
|
||||
}
|
||||
// 编辑植物组合包产品
|
||||
function handleEditDetailReload (data: any) {
|
||||
detailTable.value[data.index] = data;
|
||||
|
||||
}
|
||||
// 删除植物组合包产品
|
||||
function handleDeleteDetail(record: any, index: number) {
|
||||
detailTable.value.splice(index, 1);
|
||||
}
|
||||
// 查看产品详情
|
||||
function handleViewDetail(record: any) {
|
||||
detailModalApi.setData({ ...record, readonly: true });
|
||||
detailModalApi.open();
|
||||
}
|
||||
// 编辑产品详情
|
||||
function handleEditDetail(record: any, index: number) {
|
||||
detailModalApi.setData({ ...record, index, readonly: false });
|
||||
detailModalApi.open();
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<BasicModal :title="title">
|
||||
<BasicForm />
|
||||
<!-- 添加订单详情部分、 -->
|
||||
<!-- 添加产品部分、 -->
|
||||
<div class="mt-4">
|
||||
<div class="mb-2 flex items-center justify-between">
|
||||
<h3 class="text-lg font-medium">添加保洁订单详情</h3>
|
||||
<a-button type="primary" @click="handleAddDetail">
|
||||
<h3 class="text-lg font-medium">{{ isUpdate ? '编辑植物组合包产品' : isReadonly ? '查看植物组合包产品' : '添加植物组合包产品' }} </h3>
|
||||
<a-button v-if="!isReadonly" type="primary" @click="handleAddDetail">
|
||||
{{ $t('pages.common.add') }}
|
||||
</a-button>
|
||||
</div>
|
||||
@ -144,14 +191,63 @@ const detailColumns = [
|
||||
{{ index + 1 }}
|
||||
</template>
|
||||
<template v-else-if="column.key === 'action'">
|
||||
<Button danger @click="handleDeleteDetail(record, index)">
|
||||
删除
|
||||
</Button>
|
||||
<template v-if="isReadonly">
|
||||
<Button @click="handleViewDetail(record)">查看</Button>
|
||||
</template>
|
||||
<template v-else >
|
||||
<Button type="primary" size="small" style="margin-right: 5px;" @click="handleViewDetail(record)">查看</Button>
|
||||
<Button type="primary" size="small" style="margin-right: 5px;" @click="handleEditDetail(record, index)">编辑</Button>
|
||||
<Button danger size="small" @click="handleDeleteDetail(record, index)">
|
||||
删除
|
||||
</Button>
|
||||
</template>
|
||||
</template>
|
||||
</template>
|
||||
</Table>
|
||||
<div>费用合计：{{ totalSumPeices }}元</div>
|
||||
<!-- <div>费用合计：{{ totalSumPeices }}元</div> -->
|
||||
</div>
|
||||
<ProductDetailModal @reload="handleDetailReload" @editReload="handleEditDetailReload"/>
|
||||
</BasicModal>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.mt-4 {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.mb-2 {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.justify-between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.text-lg {
|
||||
font-size: 1.125rem;
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
|
||||
.font-medium {
|
||||
font-weight: 500;
|
||||
}
|
||||
/* 使用 :deep() 穿透 scoped 样式，影响子组件 */
|
||||
:deep(.ant-input[disabled]),
|
||||
:deep(.ant-input-number-disabled .ant-input-number-input),
|
||||
:deep(.ant-select-disabled .ant-select-selection-item),
|
||||
:deep(.ant-picker-disabled .ant-picker-input > input) {
|
||||
/* 设置一个更深的颜色 */
|
||||
color: rgb(0 0 0 / 65%) !important;
|
||||
|
||||
/* 有些浏览器需要这个来覆盖默认颜色 */
|
||||
-webkit-text-fill-color: rgb(0 0 0 / 65%) !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
import type { FormSchemaGetter } from '#/adapter/form';
|
||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||
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 = () => [
|
||||
@ -17,7 +18,7 @@ export const querySchema: FormSchemaGetter = () => [
|
||||
{
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options:getDictOptions('wy_khlx')
|
||||
options: getDictOptions('wy_khlx')
|
||||
},
|
||||
fieldName: 'customerType',
|
||||
label: '客户类型',
|
||||
@ -25,7 +26,7 @@ export const querySchema: FormSchemaGetter = () => [
|
||||
{
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options:getDictOptions('wy_zlfs')
|
||||
options: getDictOptions('wy_zlfs')
|
||||
},
|
||||
fieldName: 'rentalType',
|
||||
label: '租赁方式',
|
||||
@ -33,7 +34,7 @@ export const querySchema: FormSchemaGetter = () => [
|
||||
{
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options:getDictOptions('pro_charging_status')
|
||||
options: getDictOptions('pro_charging_status')
|
||||
},
|
||||
fieldName: 'paymentStatus',
|
||||
label: '支付状态',
|
||||
@ -42,83 +43,107 @@ export const querySchema: FormSchemaGetter = () => [
|
||||
];
|
||||
|
||||
export const columns: VxeGridProps['columns'] = [
|
||||
{ type: 'checkbox', width: 60 },
|
||||
{type: 'checkbox', width: 60},
|
||||
{
|
||||
title: '订单号',
|
||||
field: 'orderNo',
|
||||
width:100
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '客户名称',
|
||||
field: 'customerName',
|
||||
width:100
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '客户类型',
|
||||
field: 'customerType',
|
||||
slots: {default: 'customerType'},
|
||||
width:100
|
||||
slots: {
|
||||
default: ({ row }) => {
|
||||
return renderDict(row.customerType, 'wy_khlx');
|
||||
},
|
||||
},
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '租赁周期',
|
||||
field: 'rentalPeriod',
|
||||
slots: {default: 'rentalPeriod'},
|
||||
width:100
|
||||
slots: {
|
||||
default: ({ row }) => {
|
||||
return renderDict(row.rentalPeriod, 'wy_sjdw');
|
||||
},
|
||||
},
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '租赁开始时间',
|
||||
field: 'startTime',
|
||||
width:120
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
title: '租赁结束时间',
|
||||
field: 'endTime',
|
||||
width:120
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
title: '应付总额',
|
||||
field: 'totalAmount',
|
||||
width:100
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '租赁方式',
|
||||
field: 'rentalType',
|
||||
slots: {default: 'rentalType'},
|
||||
width:100
|
||||
slots: {
|
||||
default: ({ row }) => {
|
||||
return renderDict(row.rentalType, 'wy_zlfs');
|
||||
},
|
||||
},
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '租赁商品',
|
||||
field: 'planId',
|
||||
slots: {default: 'planId'},
|
||||
width:100
|
||||
// slots: {default: 'planId'},
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '支付状态',
|
||||
field: 'paymentStatus',
|
||||
slots: {default: 'paymentStatus'},
|
||||
width:100
|
||||
slots: {
|
||||
default: ({ row }) => {
|
||||
return renderDict(row.paymentStatus, 'pro_charging_status');
|
||||
},
|
||||
},
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '是否续租',
|
||||
field: 'isRelet',
|
||||
slots: {default: 'isRelet'},
|
||||
width:100
|
||||
slots: {
|
||||
default: ({ row }) => {
|
||||
return renderDict(row.isRelet, 'wy_sf');
|
||||
},
|
||||
},
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '合同状态',
|
||||
field: 'contractStatus',
|
||||
slots: {default: 'contractStatus'},
|
||||
width:100
|
||||
slots: {
|
||||
default: ({ row }) => {
|
||||
return renderDict(row.contractStatus, 'wy_htzt');
|
||||
},
|
||||
},
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '签署时间',
|
||||
field: 'signTime',
|
||||
width:100
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
field: 'action',
|
||||
fixed: 'right',
|
||||
slots: { default: 'action' },
|
||||
slots: {default: 'action'},
|
||||
title: '操作',
|
||||
minWidth: 180,
|
||||
},
|
||||
@ -134,12 +159,6 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
triggerFields: [''],
|
||||
},
|
||||
},
|
||||
// {
|
||||
// label: '订单号',
|
||||
// fieldName: 'orderNo',
|
||||
// component: 'Input',
|
||||
// rules: 'required',
|
||||
// },
|
||||
{
|
||||
label: '客户名称',
|
||||
fieldName: 'customerName',
|
||||
@ -151,7 +170,7 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
fieldName: 'customerType',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options:getDictOptions('wy_khlx')
|
||||
options: getDictOptions('wy_khlx')
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
},
|
||||
@ -160,7 +179,7 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
fieldName: 'rentalPeriod',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options:getDictOptions('wy_time_unit')
|
||||
options: getDictOptions('wy_time_unit')
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
},
|
||||
@ -180,33 +199,45 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
fieldName: 'rentalType',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options:getDictOptions('wy_zlfs')
|
||||
options: getDictOptions('wy_zlfs')
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
formItemClass:'col-span-2'
|
||||
formItemClass: 'col-span-2'
|
||||
},
|
||||
{
|
||||
label: '租赁方案id',
|
||||
label: '租赁方案',
|
||||
fieldName: 'planId',
|
||||
component: 'Input',
|
||||
component: 'Select',
|
||||
dependencies: {
|
||||
// 仅当 租赁方式 为 2（套餐） 时显示
|
||||
show: (formValues) => formValues.rentalType === '2',
|
||||
triggerFields: ['rentalType'],
|
||||
},
|
||||
rules: 'required',
|
||||
formItemClass:'col-span-2'
|
||||
rules: 'selectRequired',
|
||||
formItemClass: 'col-span-2'
|
||||
},
|
||||
{
|
||||
label: '绿植产品id',
|
||||
fieldName: 'productId',
|
||||
label: '方案详情',
|
||||
fieldName: 'planInfo',
|
||||
component: 'Input',
|
||||
dependencies: {
|
||||
// 仅当 租赁方式 为 2（套餐） 时显示
|
||||
show: (formValues) => formValues.rentalType === '2' && formValues.planId != null,
|
||||
triggerFields: ['rentalType'],
|
||||
},
|
||||
formItemClass: 'col-span-2'
|
||||
},
|
||||
{
|
||||
label: '绿植产品',
|
||||
fieldName: 'productId',
|
||||
component: 'Select',
|
||||
dependencies: {
|
||||
// 仅当 租赁方式 为 1（单点） 时显示
|
||||
show: (formValues) => formValues.rentalType === '1',
|
||||
triggerFields: ['rentalType'],
|
||||
},
|
||||
rules: 'required',
|
||||
rules: 'selectRequired',
|
||||
formItemClass: 'col-span-2'
|
||||
},
|
||||
{
|
||||
label: '租赁数量',
|
||||
@ -215,29 +246,31 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
componentProps: {
|
||||
min: 1,
|
||||
precision: 0,
|
||||
step: 1
|
||||
step: 1,
|
||||
placeholder:'租赁数量不可超出绿植产品库存数量'
|
||||
},
|
||||
dependencies: {
|
||||
// 仅当 租赁方式 为 1（单点） 时显示
|
||||
show: (formValues) => formValues.rentalType === '1',
|
||||
triggerFields: ['rentalType'],
|
||||
triggerFields: ['rentalType', 'productId'],
|
||||
},
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
label: '应付总额',
|
||||
fieldName: 'totalAmount',
|
||||
component: 'Input',
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
label: '支付状态',
|
||||
fieldName: 'paymentStatus',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
},
|
||||
// {
|
||||
// label: '应付总额',
|
||||
// fieldName: 'totalAmount',
|
||||
// component: 'Input',
|
||||
// rules: 'required',
|
||||
// },
|
||||
// {
|
||||
// label: '支付状态',
|
||||
// fieldName: 'paymentStatus',
|
||||
// component: 'Select',
|
||||
// componentProps: {
|
||||
// options: getDictOptions('pro_charging_status'),
|
||||
// },
|
||||
// rules: 'selectRequired',
|
||||
// },
|
||||
// {
|
||||
// label: '是否续租',
|
||||
// fieldName: 'isRelet',
|
||||
@ -255,6 +288,17 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
componentProps: {
|
||||
options: getDictOptions('wy_htzt'),
|
||||
},
|
||||
rules: 'selectRequired'
|
||||
},
|
||||
{
|
||||
label: '合同编号',
|
||||
fieldName: 'contractCode',
|
||||
component: 'Input',
|
||||
dependencies: {
|
||||
show: (formValues) => formValues.contractStatus != null && formValues.contractStatus != 1,
|
||||
triggerFields: ['contractStatus'],
|
||||
},
|
||||
rules: 'required'
|
||||
},
|
||||
{
|
||||
label: '签署时间',
|
||||
@ -262,8 +306,13 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
component: 'DatePicker',
|
||||
componentProps: {
|
||||
showTime: true,
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
format: 'YYYY-MM-DD',
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
},
|
||||
dependencies: {
|
||||
show: (formValues) => formValues.contractStatus != null && formValues.contractStatus != 1,
|
||||
triggerFields: ['contractStatus'],
|
||||
},
|
||||
rules: 'required'
|
||||
},
|
||||
];
|
||||
|
||||
@ -1,23 +1,230 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, ref } from 'vue';
|
||||
import {computed, ref} from 'vue';
|
||||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { $t } from '@vben/locales';
|
||||
import { cloneDeep } from '@vben/utils';
|
||||
import {useVbenModal} from '@vben/common-ui';
|
||||
import {$t} from '@vben/locales';
|
||||
import {cloneDeep} from '@vben/utils';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
import { rentalOrderAdd, rentalOrderInfo, rentalOrderUpdate } from '#/api/property/rentalOrder';
|
||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||
|
||||
import { modalSchema } from './data';
|
||||
import {useVbenForm} from '#/adapter/form';
|
||||
import {
|
||||
rentalOrderAdd,
|
||||
rentalOrderInfo,
|
||||
rentalOrderUpdate
|
||||
} from '#/api/property/rentalOrder';
|
||||
import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
|
||||
|
||||
import {plantsProductList} from "#/api/property/productManagement";
|
||||
import {rentalPlanList} from "#/api/property/rentalPlan";
|
||||
import {getDictOptions} from "#/utils/dict";
|
||||
import type {PropertyVO} from "#/api/property/productManagement/model";
|
||||
import type {RentalPlanVO} from "#/api/property/rentalPlan/model";
|
||||
const emit = defineEmits<{ reload: [] }>();
|
||||
|
||||
const isUpdate = ref(false);
|
||||
const planList = ref<RentalPlanVO[]>([]);
|
||||
const plantsList = ref<PropertyVO[]>([]);
|
||||
const title = computed(() => {
|
||||
return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
|
||||
});
|
||||
const modalSchema = [
|
||||
{
|
||||
label: '主键',
|
||||
fieldName: 'id',
|
||||
component: 'Input',
|
||||
dependencies: {
|
||||
show: () => false,
|
||||
triggerFields: [''],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '客户名称',
|
||||
fieldName: 'customerName',
|
||||
component: 'Input',
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
label: '客户类型',
|
||||
fieldName: 'customerType',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options: getDictOptions('wy_khlx')
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
},
|
||||
{
|
||||
label: '租赁周期',
|
||||
fieldName: 'rentalPeriod',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options: getDictOptions('wy_time_unit')
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
},
|
||||
{
|
||||
label: '租赁时间',
|
||||
fieldName: 'rentalTime',
|
||||
component: 'RangePicker',
|
||||
componentProps: {
|
||||
showTime: true,
|
||||
format: 'YYYY-MM-DD',
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
},
|
||||
{
|
||||
label: '租赁方式',
|
||||
fieldName: 'rentalType',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options: getDictOptions('wy_zlfs')
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
formItemClass: 'col-span-2'
|
||||
},
|
||||
{
|
||||
label: '租赁方案',
|
||||
fieldName: 'planId',
|
||||
component: 'Select',
|
||||
dependencies: {
|
||||
// 仅当 租赁方式 为 2（套餐） 时显示
|
||||
show: (formValues: any) => formValues.rentalType === '2',
|
||||
triggerFields: ['rentalType'],
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
formItemClass: 'col-span-2'
|
||||
},
|
||||
{
|
||||
label: '方案详情',
|
||||
fieldName: 'planInfo',
|
||||
component: 'Input',
|
||||
dependencies: {
|
||||
// 仅当 租赁方式 为 2（套餐） 时显示
|
||||
show: (formValues: any) => formValues.rentalType === '2' && formValues.planId != null,
|
||||
triggerFields: ['rentalType'],
|
||||
},
|
||||
formItemClass: 'col-span-2',
|
||||
componentProps: {}
|
||||
|
||||
},
|
||||
{
|
||||
label: '绿植产品',
|
||||
fieldName: 'productId',
|
||||
component: 'ApiSelect',
|
||||
dependencies: {
|
||||
// 仅当 租赁方式 为 1（单点） 时显示
|
||||
show: (formValues: any) => formValues.rentalType === '1',
|
||||
triggerFields: ['rentalType'],
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
formItemClass: 'col-span-2',
|
||||
componentProps: {
|
||||
api: async () => {
|
||||
const res = await plantsProductList({pageNum: 1, pageSize: 1000, inventory: 1});
|
||||
plantsList.value = res.rows || [];
|
||||
return plantsList.value.map(item => ({
|
||||
label: item.plantName + '-' + item.plantCode + '\xa0\xa0租金（元）：' + item.rent + '\xa0\xa0库存数量：' + item.inventory,
|
||||
value: item.id,
|
||||
}));
|
||||
},
|
||||
onChange: async (value: string) => {
|
||||
const plants = plantsList.value.find(item => item.id === value);
|
||||
if (plants) {
|
||||
formApi.updateSchema([{
|
||||
componentProps: () => ({
|
||||
min: 1,
|
||||
max: plants.inventory,
|
||||
precision: 0,
|
||||
}),
|
||||
fieldName: 'productNum',
|
||||
}])
|
||||
}
|
||||
},
|
||||
showSearch: true,
|
||||
filterOption: (input: any, option: any) =>
|
||||
option.label.toLowerCase().includes(input.toLowerCase()),
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '租赁数量',
|
||||
fieldName: 'productNum',
|
||||
component: 'InputNumber',
|
||||
componentProps: {
|
||||
min: 1,
|
||||
precision: 0,
|
||||
step: 1,
|
||||
placeholder: '租赁数量不可超出绿植产品库存数量'
|
||||
},
|
||||
dependencies: {
|
||||
// 仅当 租赁方式 为 1（单点） 时显示
|
||||
show: (formValues: any) => formValues.rentalType === '1',
|
||||
triggerFields: ['rentalType', 'productId'],
|
||||
},
|
||||
rules: 'required',
|
||||
},
|
||||
{
|
||||
label: '应付总额',
|
||||
fieldName: 'totalAmount',
|
||||
component: 'span',
|
||||
dependencies: {
|
||||
// 仅当 租赁方式 为 1（单点） 时显示
|
||||
show: (formValues: any) => formValues.totalAmount,
|
||||
triggerFields: ['totalAmount'],
|
||||
},
|
||||
},
|
||||
// {
|
||||
// label: '支付状态',
|
||||
// fieldName: 'paymentStatus',
|
||||
// component: 'Select',
|
||||
// componentProps: {
|
||||
// options: getDictOptions('pro_charging_status'),
|
||||
// },
|
||||
// rules: 'selectRequired',
|
||||
// },
|
||||
// {
|
||||
// label: '是否续租',
|
||||
// fieldName: 'isRelet',
|
||||
// component: 'RadioGroup',
|
||||
// componentProps: {
|
||||
// buttonStyle: 'solid',
|
||||
// optionType: 'button',
|
||||
// options: getDictOptions('wy_sf'),
|
||||
// },
|
||||
// },
|
||||
{
|
||||
label: '合同状态',
|
||||
fieldName: 'contractStatus',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options: getDictOptions('wy_htzt'),
|
||||
},
|
||||
rules: 'selectRequired'
|
||||
},
|
||||
{
|
||||
label: '合同编号',
|
||||
fieldName: 'contractCode',
|
||||
component: 'Input',
|
||||
dependencies: {
|
||||
show: (formValues: any) => formValues.contractStatus != null && formValues.contractStatus != 1,
|
||||
triggerFields: ['contractStatus'],
|
||||
},
|
||||
rules: 'required'
|
||||
},
|
||||
{
|
||||
label: '签署时间',
|
||||
fieldName: 'signTime',
|
||||
component: 'DatePicker',
|
||||
componentProps: {
|
||||
showTime: true,
|
||||
format: 'YYYY-MM-DD',
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
},
|
||||
dependencies: {
|
||||
show: (formValues: any) => formValues.contractStatus != null && formValues.contractStatus != 1,
|
||||
triggerFields: ['contractStatus'],
|
||||
},
|
||||
rules: 'required'
|
||||
},
|
||||
];
|
||||
const [BasicForm, formApi] = useVbenForm({
|
||||
commonConfig: {
|
||||
// 默认占满两列
|
||||
@ -29,12 +236,13 @@ const [BasicForm, formApi] = useVbenForm({
|
||||
class: 'w-full',
|
||||
}
|
||||
},
|
||||
schema: modalSchema(),
|
||||
schema: modalSchema,
|
||||
showDefaultActions: false,
|
||||
wrapperClass: 'grid-cols-2',
|
||||
});
|
||||
|
||||
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
||||
|
||||
const {onBeforeClose, markInitialized, resetInitialized} = useBeforeCloseDiff(
|
||||
{
|
||||
initializedGetter: defaultFormValueGetter(formApi),
|
||||
currentGetter: defaultFormValueGetter(formApi),
|
||||
@ -53,10 +261,10 @@ const [BasicModal, modalApi] = useVbenModal({
|
||||
return null;
|
||||
}
|
||||
modalApi.modalLoading(true);
|
||||
|
||||
const { id } = modalApi.getData() as { id?: number | string };
|
||||
const {id} = modalApi.getData() as { id?: number | string };
|
||||
isUpdate.value = !!id;
|
||||
|
||||
await getPlanList()
|
||||
// await getPlantsList()
|
||||
if (isUpdate.value && id) {
|
||||
const record = await rentalOrderInfo(id);
|
||||
await formApi.setValues(record);
|
||||
@ -70,12 +278,18 @@ const [BasicModal, modalApi] = useVbenModal({
|
||||
async function handleConfirm() {
|
||||
try {
|
||||
modalApi.lock(true);
|
||||
const { valid } = await formApi.validate();
|
||||
const {valid} = await formApi.validate();
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
||||
const data = cloneDeep(await formApi.getValues());
|
||||
if (data.rentalType == 1) {
|
||||
data.planId = undefined;
|
||||
} else {
|
||||
data.productId = undefined;
|
||||
data.productNum = undefined;
|
||||
}
|
||||
await (isUpdate.value ? rentalOrderUpdate(data) : rentalOrderAdd(data));
|
||||
resetInitialized();
|
||||
emit('reload');
|
||||
@ -87,15 +301,70 @@ async function handleConfirm() {
|
||||
}
|
||||
}
|
||||
|
||||
//获取有库存的绿植
|
||||
async function getPlantsList() {
|
||||
let params = {
|
||||
pageNum: 1,
|
||||
pageSize: 1000,
|
||||
inventory: 0
|
||||
}
|
||||
const res = await plantsProductList(params)
|
||||
plantsList.value = res.rows
|
||||
// formApi.updateSchema([
|
||||
// {
|
||||
// componentProps: () => ({
|
||||
// class: 'w-full',
|
||||
// options: res.rows.map(item => ({
|
||||
// label: item.plantName + '-' + item.plantCode + '\xa0\xa0租金（元）：' + item.rent + '\xa0\xa0库存数量：' + item.inventory,
|
||||
// value: item.id,
|
||||
// })),
|
||||
// placeholder: '请选择绿植',
|
||||
// showSearch: true,
|
||||
// filterOption: (input: any, option: any) =>
|
||||
// option.label.toLowerCase().includes(input.toLowerCase()),
|
||||
// }),
|
||||
// fieldName: 'productId',
|
||||
// },
|
||||
// ]);
|
||||
}
|
||||
|
||||
//获取绿植租赁方案
|
||||
async function getPlanList() {
|
||||
let params = {
|
||||
pageNum: 1,
|
||||
pageSize: 1000,
|
||||
state: 0,
|
||||
}
|
||||
const res = await rentalPlanList(params)
|
||||
planList.value = res.rows
|
||||
formApi.updateSchema([
|
||||
{
|
||||
componentProps: () => ({
|
||||
class: 'w-full',
|
||||
options: res.rows.map(item => ({
|
||||
label: item.planName,
|
||||
value: item.id,
|
||||
})),
|
||||
placeholder: '请选择绿植',
|
||||
showSearch: true,
|
||||
filterOption: (input: any, option: any) =>
|
||||
option.label.toLowerCase().includes(input.toLowerCase()),
|
||||
}),
|
||||
fieldName: 'planId',
|
||||
},
|
||||
]);
|
||||
}
|
||||
|
||||
async function handleClosed() {
|
||||
await formApi.resetForm();
|
||||
resetInitialized();
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<BasicModal :title="title">
|
||||
<BasicForm />
|
||||
<BasicForm/>
|
||||
</BasicModal>
|
||||
</template>
|
||||
|
||||
|
||||
@ -10,7 +10,6 @@ import { resident_unitAdd, resident_unitInfo, resident_unitUpdate } from '#/api/
|
||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||
|
||||
import { modalSchema } from './data';
|
||||
import RoomSelect from "#/views/property/room/room-select.vue";
|
||||
import {communityTree} from "#/api/property/community";
|
||||
|
||||
const emit = defineEmits<{ reload: [] }>();
|
||||
@ -134,9 +133,6 @@ async function handleClosed() {
|
||||
<template>
|
||||
<BasicModal :title="title">
|
||||
<BasicForm>
|
||||
<!-- <template #location="slotProps">-->
|
||||
<!-- <RoomSelect v-bind="slotProps" :isUpdate="isUpdate" :level="2"/>-->
|
||||
<!-- </template>-->
|
||||
</BasicForm>
|
||||
</BasicModal>
|
||||
</template>
|
||||
|
||||
@ -1,218 +0,0 @@
|
||||
<script lang="ts" setup>
|
||||
import {onMounted, ref, watch} from 'vue';
|
||||
import {Select} from 'ant-design-vue';
|
||||
import {communityList} from "#/api/property/community";
|
||||
import {buildingList} from "#/api/property/building";
|
||||
import {unitList} from "#/api/property/unit";
|
||||
import {floorList} from "#/api/property/floor";
|
||||
import {roomList} from "#/api/property/room";
|
||||
|
||||
defineOptions({name: 'RoomSelect'});
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
disabled?: boolean;
|
||||
isUpdate?: boolean;
|
||||
level?:number;
|
||||
}>(), {
|
||||
disabled: false,
|
||||
isUpdate: false,
|
||||
level:5
|
||||
});
|
||||
|
||||
|
||||
const communityData = ref<any[]>([]);
|
||||
const buildingData = ref<any[]>([]);
|
||||
const unitData = ref<any[]>([]);
|
||||
const floorData = ref<any[]>([]);
|
||||
const roomData = ref<any[]>([]);
|
||||
const communityValue = ref();
|
||||
const buildingValue = ref();
|
||||
const unitValue = ref();
|
||||
const floorValue = ref();
|
||||
const roomValue = ref();
|
||||
const changeData=ref();
|
||||
|
||||
onMounted(() => {
|
||||
queryCommunity()
|
||||
|
||||
});
|
||||
|
||||
const emit = defineEmits(['update:roomCode']);
|
||||
|
||||
async function queryCommunity() {
|
||||
const queryData = {
|
||||
pageSize: 100,
|
||||
pageNum: 1,
|
||||
state: 1,
|
||||
}
|
||||
const res = await communityList(queryData);
|
||||
communityData.value = res.rows.map((item) => ({
|
||||
label: item.communityName,
|
||||
value: item.id,
|
||||
}));
|
||||
}
|
||||
|
||||
async function queryBuilding() {
|
||||
const queryData = {
|
||||
pageSize: 100,
|
||||
pageNum: 1,
|
||||
state: 1,
|
||||
communityCode: communityValue.value
|
||||
}
|
||||
const res = await buildingList(queryData);
|
||||
buildingData.value = res.rows.map((item) => ({
|
||||
label: item.buildingName,
|
||||
value: item.id,
|
||||
}));
|
||||
}
|
||||
|
||||
async function queryUnit() {
|
||||
const queryData = {
|
||||
pageSize: 100,
|
||||
pageNum: 1,
|
||||
state: 1,
|
||||
buildingCode: buildingValue.value
|
||||
}
|
||||
const res = await unitList(queryData);
|
||||
unitData.value = res.rows.map((item) => ({
|
||||
label: item.unitName,
|
||||
value: item.id,
|
||||
}));
|
||||
}
|
||||
|
||||
async function queryFloor() {
|
||||
const queryData = {
|
||||
pageSize: 100,
|
||||
pageNum: 1,
|
||||
state: 1,
|
||||
unitCode: unitValue.value
|
||||
}
|
||||
const res = await floorList(queryData);
|
||||
floorData.value = res.rows.map((item) => ({
|
||||
label: item.floorName,
|
||||
value: item.id,
|
||||
}));
|
||||
}
|
||||
|
||||
async function queryRoom() {
|
||||
const queryData = {
|
||||
pageSize: 100,
|
||||
pageNum: 1,
|
||||
state: 1,
|
||||
floorCode: floorValue.value
|
||||
}
|
||||
const res = await roomList(queryData);
|
||||
roomData.value = res.rows.map((item) => ({
|
||||
label: item.roomCode,
|
||||
value: item.id,
|
||||
}));
|
||||
}
|
||||
|
||||
const handleChangeCommunity = (val: string) => {
|
||||
communityValue.value = val;
|
||||
buildingValue.value = undefined;
|
||||
unitValue.value = undefined;
|
||||
floorValue.value = undefined;
|
||||
roomValue.value = undefined;
|
||||
queryBuilding()
|
||||
};
|
||||
const handleChangeBuilding = (val: string) => {
|
||||
buildingValue.value = val;
|
||||
unitValue.value = undefined;
|
||||
floorValue.value = undefined;
|
||||
roomValue.value = undefined;
|
||||
queryUnit()
|
||||
};
|
||||
const handleChangeUnit = (val: string) => {
|
||||
unitValue.value = val;
|
||||
floorValue.value = undefined;
|
||||
roomValue.value = undefined;
|
||||
queryFloor()
|
||||
};
|
||||
const handleChangeFloor = (val: string) => {
|
||||
floorValue.value = val;
|
||||
roomValue.value = undefined;
|
||||
queryRoom()
|
||||
};
|
||||
const handleChangeRoom = (val: string) => {
|
||||
roomValue.value = val;
|
||||
};
|
||||
|
||||
watch(() => props.isUpdate,
|
||||
(newX) => {
|
||||
console.log(newX, '==========================')
|
||||
}, {immediate: true})
|
||||
watch(() => roomValue.value,
|
||||
(newX) => {
|
||||
emit('update:roomCode', newX);
|
||||
console.log(newX, '==========================roomCode')
|
||||
},)
|
||||
|
||||
const filterOption = (input: string, option: any) => {
|
||||
return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<Select
|
||||
v-if="props.level>1"
|
||||
v-model:value="communityValue"
|
||||
show-search
|
||||
placeholder="请选择区域"
|
||||
:options="communityData"
|
||||
:filter-option="filterOption"
|
||||
@change="handleChangeCommunity"
|
||||
style="width: 20%"
|
||||
></Select>
|
||||
<Select
|
||||
v-if="props.level>1"
|
||||
v-model:value="buildingValue"
|
||||
show-search
|
||||
:disabled="!communityValue"
|
||||
placeholder="请选择建筑"
|
||||
:options="buildingData"
|
||||
:filter-option="filterOption"
|
||||
@change="handleChangeBuilding"
|
||||
@focus="queryBuilding"
|
||||
style="width: 20%"
|
||||
></Select>
|
||||
<Select
|
||||
v-if="props.level>2"
|
||||
v-model:value="unitValue"
|
||||
:disabled="!buildingValue"
|
||||
show-search
|
||||
placeholder="请选择单元"
|
||||
:options="unitData"
|
||||
:filter-option="filterOption"
|
||||
@change="handleChangeUnit"
|
||||
@focus="queryUnit"
|
||||
style="width: 20%"
|
||||
></Select>
|
||||
<Select
|
||||
v-if="props.level>3"
|
||||
v-model:value="floorValue"
|
||||
:disabled="!unitValue"
|
||||
show-search
|
||||
placeholder="请选择楼层"
|
||||
:options="floorData"
|
||||
:filter-option="filterOption"
|
||||
@change="handleChangeFloor"
|
||||
@focus="queryFloor"
|
||||
style="width: 20%"
|
||||
></Select>
|
||||
<Select
|
||||
v-if="props.level>4"
|
||||
v-model:value="roomValue"
|
||||
:disabled="!floorValue"
|
||||
show-search
|
||||
placeholder="请选择房间"
|
||||
:options="roomData"
|
||||
:filter-option="filterOption"
|
||||
@change="handleChangeRoom"
|
||||
@focus="queryRoom"
|
||||
style="width: 20%"
|
||||
></Select>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -28,9 +28,8 @@ export default defineConfig(async () => {
|
||||
rewrite: (path) => path.replace(/^\/api/, ''),
|
||||
// mock代理目标地址
|
||||
// target: 'http://by.missmoc.top:3010/',
|
||||
target: 'http://192.168.0.106:8080',
|
||||
// target: 'http://47.109.37.87:3010',
|
||||
// target: 'http://47.109.37.87:3010',
|
||||
// target: 'http://192.168.0.103:8080',
|
||||
target: 'http://47.109.37.87:3010',
|
||||
ws: true,
|
||||
},
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user