feat: 测试保洁订单
This commit is contained in:
parent
d24d03457a
commit
fa3c442545
File diff suppressed because it is too large
Load Diff
@ -6,7 +6,7 @@ import { computed, ref } from 'vue';
|
|||||||
|
|
||||||
import { useVbenModal } from '@vben/common-ui';
|
import { useVbenModal } from '@vben/common-ui';
|
||||||
import { $t } from '@vben/locales';
|
import { $t } from '@vben/locales';
|
||||||
import { cloneDeep } from '@vben/utils';
|
import { cloneDeep,handleNode,getPopupContainer } from '@vben/utils';
|
||||||
|
|
||||||
import { Button, Table } from 'ant-design-vue';
|
import { Button, Table } from 'ant-design-vue';
|
||||||
import dayjs from 'dayjs';
|
import dayjs from 'dayjs';
|
||||||
@ -20,12 +20,11 @@ import {
|
|||||||
clean_orderUpdate,
|
clean_orderUpdate,
|
||||||
} from '#/api/property/clean_order';
|
} from '#/api/property/clean_order';
|
||||||
import { resident_unitList } from '#/api/property/resident/unit';
|
import { resident_unitList } from '#/api/property/resident/unit';
|
||||||
import RoomSelect from '#/components/roomSelect/room-select.vue';
|
|
||||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||||
|
|
||||||
import cleanDetailModal from './clean-detail-modal.vue';
|
import cleanDetailModal from './clean-detail-modal.vue';
|
||||||
import { modalSchema } from './data';
|
import { modalSchema } from './data';
|
||||||
|
import { communityTree } from '#/api/property/community';
|
||||||
const emit = defineEmits<{ reload: [] }>();
|
const emit = defineEmits<{ reload: [] }>();
|
||||||
|
|
||||||
// 计算合计费用
|
// 计算合计费用
|
||||||
@ -118,6 +117,7 @@ const [BasicModal, modalApi] = useVbenModal({
|
|||||||
if (!isOpen) {
|
if (!isOpen) {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
setupCommunitySelect()
|
||||||
modalApi.modalLoading(true);
|
modalApi.modalLoading(true);
|
||||||
const { id, readonly } = modalApi.getData() as {
|
const { id, readonly } = modalApi.getData() as {
|
||||||
id?: number | string;
|
id?: number | string;
|
||||||
@ -216,44 +216,39 @@ const detailGridOptions: VxeGridProps = {
|
|||||||
data: [],
|
data: [],
|
||||||
};
|
};
|
||||||
const detailColumns = [
|
const detailColumns = [
|
||||||
{ title: '序号', key: 'index', width: 'auto' },
|
{ title: '序号', key: 'index' },
|
||||||
{ title: '劳务名称', dataIndex: 'name', key: 'name', width: 'auto' },
|
{ title: '劳务名称', dataIndex: 'name', key: 'name' },
|
||||||
{ title: '计量单位', dataIndex: 'measure', key: 'measure', width: 'auto' },
|
{ title: '计量单位', dataIndex: 'measure', key: 'measure' },
|
||||||
{ title: '计算方式', dataIndex: 'method', key: 'method', width: 'auto' },
|
{ title: '计算方式', dataIndex: 'method', key: 'method' },
|
||||||
{
|
{
|
||||||
title: '申报单价含税(元)',
|
title: '申报单价含税(元)',
|
||||||
dataIndex: 'peices',
|
dataIndex: 'peices',
|
||||||
key: 'peices',
|
key: 'peices',
|
||||||
width: 'auto',
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '保洁频率',
|
title: '保洁频率',
|
||||||
dataIndex: 'frequency',
|
dataIndex: 'frequency',
|
||||||
key: 'frequency',
|
key: 'frequency',
|
||||||
width: 'auto',
|
|
||||||
},
|
},
|
||||||
{ title: '保洁标准', dataIndex: 'standard', key: 'standard', width: 'auto' },
|
{ title: '保洁标准', dataIndex: 'standard', key: 'standard' },
|
||||||
{ title: '备注', dataIndex: 'remark', key: 'remark', width: 'auto' },
|
{ title: '备注', dataIndex: 'remark', key: 'remark' },
|
||||||
{
|
{
|
||||||
title: '状态',
|
title: '状态',
|
||||||
dataIndex: 'stater',
|
dataIndex: 'stater',
|
||||||
key: 'stater',
|
key: 'stater',
|
||||||
width: 'auto',
|
|
||||||
customRender: ({ value }: { value: number }) =>
|
customRender: ({ value }: { value: number }) =>
|
||||||
value === 1 ? '启用' : '禁用',
|
value === 1 ? '启用' : '禁用',
|
||||||
},
|
},
|
||||||
{ title: '保洁面积', dataIndex: 'area', key: 'area', width: 'auto' },
|
{ title: '保洁面积', dataIndex: 'area', key: 'area' },
|
||||||
{
|
{
|
||||||
title: '合计费用',
|
title: '合计费用',
|
||||||
dataIndex: 'sumPeices',
|
dataIndex: 'sumPeices',
|
||||||
key: 'sumPeices',
|
key: 'sumPeices',
|
||||||
width: 'auto',
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '操作',
|
title: '操作',
|
||||||
key: 'action',
|
key: 'action',
|
||||||
fixed: 'right' as const,
|
fixed: 'right' as const,
|
||||||
width: 'auto',
|
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
@ -281,6 +276,8 @@ function handleDeleteDetail(record: any, index: number) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async function handleConfirm() {
|
async function handleConfirm() {
|
||||||
|
console.log('handleConfirm123123123');
|
||||||
|
|
||||||
if (isReadonly.value) {
|
if (isReadonly.value) {
|
||||||
modalApi.close();
|
modalApi.close();
|
||||||
return;
|
return;
|
||||||
@ -301,6 +298,8 @@ async function handleConfirm() {
|
|||||||
// 劳务数据缓存 cleanListData 已有
|
// 劳务数据缓存 cleanListData 已有
|
||||||
// 查找label
|
// 查找label
|
||||||
const unitObj = unitListData.find((item) => item.id === data.unit);
|
const unitObj = unitListData.find((item) => item.id === data.unit);
|
||||||
|
console.log(unitObj,'unitObj');
|
||||||
|
|
||||||
const cleanObj = cleanListData.find((item) => item.id === data.name);
|
const cleanObj = cleanListData.find((item) => item.id === data.name);
|
||||||
|
|
||||||
data.unit = unitObj ? unitObj.name : data.unit || '';
|
data.unit = unitObj ? unitObj.name : data.unit || '';
|
||||||
@ -311,12 +310,16 @@ async function handleConfirm() {
|
|||||||
: isUpdate.value
|
: isUpdate.value
|
||||||
? editCleanId.value
|
? editCleanId.value
|
||||||
: '';
|
: '';
|
||||||
data.sumPeices = totalSumPeices;
|
// data.sumPeices = totalSumPeices;
|
||||||
// 组装 cleanIds
|
// 组装 cleanIds
|
||||||
data.cleanIds = detailTable.value.map((item: any) => item.id);
|
data.cleanIds = detailTable.value.map((item: any) => item.id);
|
||||||
data.details = detailTable.value;
|
data.details = 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');
|
||||||
|
|
||||||
await (isUpdate.value ? clean_orderUpdate(data) : clean_orderAdd(data));
|
|
||||||
resetInitialized();
|
resetInitialized();
|
||||||
emit('reload');
|
emit('reload');
|
||||||
modalApi.close();
|
modalApi.close();
|
||||||
@ -331,14 +334,47 @@ async function handleClosed() {
|
|||||||
await formApi.resetForm();
|
await formApi.resetForm();
|
||||||
resetInitialized();
|
resetInitialized();
|
||||||
}
|
}
|
||||||
|
// 获取服务地址
|
||||||
|
async function setupCommunitySelect() {
|
||||||
|
const areaList = await communityTree(5);
|
||||||
|
// 选中后显示在输入框的值 即父节点 / 子节点
|
||||||
|
// addFullName(areaList, 'areaName', ' / ');
|
||||||
|
const splitStr = '/';
|
||||||
|
handleNode(areaList, 'label', splitStr, function (node: any) {
|
||||||
|
if (node.level != 5) {
|
||||||
|
node.disabled = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
formApi.updateSchema([
|
||||||
|
{
|
||||||
|
componentProps: () => ({
|
||||||
|
class: 'w-full',
|
||||||
|
fieldNames: {
|
||||||
|
key: 'id',
|
||||||
|
label: 'label',
|
||||||
|
value: 'code',
|
||||||
|
children: 'children',
|
||||||
|
},
|
||||||
|
getPopupContainer,
|
||||||
|
placeholder: '请选择服务地址',
|
||||||
|
showSearch: true,
|
||||||
|
treeData: areaList,
|
||||||
|
treeDefaultExpandAll: true,
|
||||||
|
treeLine: { showLeafIcon: false },
|
||||||
|
// 筛选的字段
|
||||||
|
treeNodeFilterProp: 'label',
|
||||||
|
// 选中后显示在输入框的值
|
||||||
|
treeNodeLabelProp: 'fullName',
|
||||||
|
}),
|
||||||
|
fieldName: 'location',
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<BasicModal :title="title">
|
<BasicModal :title="title">
|
||||||
<BasicForm>
|
<BasicForm>
|
||||||
<template #location="soltProps">
|
|
||||||
<RoomSelect v-bind="soltProps" />
|
|
||||||
</template>
|
|
||||||
</BasicForm>
|
</BasicForm>
|
||||||
<!-- 添加订单详情部分 -->
|
<!-- 添加订单详情部分 -->
|
||||||
<div class="mt-4">
|
<div class="mt-4">
|
||||||
@ -399,4 +435,15 @@ async function handleClosed() {
|
|||||||
.font-medium {
|
.font-medium {
|
||||||
font-weight: 500;
|
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>
|
</style>
|
||||||
|
@ -12,6 +12,13 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
fieldName: 'location',
|
fieldName: 'location',
|
||||||
label: '服务地址',
|
label: '服务地址',
|
||||||
},
|
},
|
||||||
|
// {
|
||||||
|
// label: '服务地址(房间号)',
|
||||||
|
// component: 'TreeSelect',
|
||||||
|
// defaultValue: undefined,
|
||||||
|
// fieldName: 'location',
|
||||||
|
// rules: 'required',
|
||||||
|
// },
|
||||||
// {
|
// {
|
||||||
// label: '服务地址(房间号)',
|
// label: '服务地址(房间号)',
|
||||||
// fieldName: 'location',
|
// fieldName: 'location',
|
||||||
@ -161,14 +168,9 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '服务地址(房间号)',
|
label: '服务地址(房间号)',
|
||||||
|
component: 'Input',
|
||||||
|
defaultValue: undefined,
|
||||||
fieldName: 'location',
|
fieldName: 'location',
|
||||||
componentProps: {
|
|
||||||
placeholder: '请选择房间',
|
|
||||||
},
|
|
||||||
slots: {
|
|
||||||
default: 'location',
|
|
||||||
},
|
|
||||||
formItemClass: 'col-span-2',
|
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
},
|
},
|
||||||
// {
|
// {
|
||||||
|
@ -95,7 +95,6 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
fixed: 'right',
|
fixed: 'right',
|
||||||
slots: { default: 'action' },
|
slots: { default: 'action' },
|
||||||
title: '操作',
|
title: '操作',
|
||||||
width: 'auto',
|
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
@ -9,11 +9,13 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
component: 'Input',
|
component: 'Input',
|
||||||
fieldName: 'planName',
|
fieldName: 'planName',
|
||||||
label: '方案名称',
|
label: '方案名称',
|
||||||
|
labelWidth: 120
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
component: 'Select',
|
component: 'Select',
|
||||||
fieldName: 'rentalPeriod',
|
fieldName: 'rentalPeriod',
|
||||||
label: '租赁周期',
|
label: '租赁周期',
|
||||||
|
labelWidth: 120,
|
||||||
componentProps: {
|
componentProps: {
|
||||||
options:[
|
options:[
|
||||||
{ label: '月', value: 0 },
|
{ label: '月', value: 0 },
|
||||||
@ -121,7 +123,7 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
{
|
{
|
||||||
label: '基础服务项',
|
label: '基础服务项',
|
||||||
fieldName: 'price',
|
fieldName: 'price',
|
||||||
component: 'Select',
|
component: 'Input',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '优惠活动',
|
label: '优惠活动',
|
||||||
|
@ -21,9 +21,9 @@ const title = computed(() => {
|
|||||||
const [BasicForm, formApi] = useVbenForm({
|
const [BasicForm, formApi] = useVbenForm({
|
||||||
commonConfig: {
|
commonConfig: {
|
||||||
// 默认占满两列
|
// 默认占满两列
|
||||||
formItemClass: 'col-span-2',
|
formItemClass: 'col-span-1',
|
||||||
// 默认label宽度 px
|
// 默认label宽度 px
|
||||||
labelWidth: 80,
|
labelWidth: 120,
|
||||||
// 通用配置项 会影响到所有表单项
|
// 通用配置项 会影响到所有表单项
|
||||||
componentProps: {
|
componentProps: {
|
||||||
class: 'w-full',
|
class: 'w-full',
|
||||||
@ -43,7 +43,7 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
|||||||
|
|
||||||
const [BasicModal, modalApi] = useVbenModal({
|
const [BasicModal, modalApi] = useVbenModal({
|
||||||
// 在这里更改宽度
|
// 在这里更改宽度
|
||||||
class: 'w-[550px]',
|
class: 'w-[70%]',
|
||||||
fullscreenButton: false,
|
fullscreenButton: false,
|
||||||
onBeforeClose,
|
onBeforeClose,
|
||||||
onClosed: handleClosed,
|
onClosed: handleClosed,
|
||||||
@ -91,11 +91,67 @@ async function handleClosed() {
|
|||||||
await formApi.resetForm();
|
await formApi.resetForm();
|
||||||
resetInitialized();
|
resetInitialized();
|
||||||
}
|
}
|
||||||
|
const detailColumns = [
|
||||||
|
{ title: '序号', key: 'index' },
|
||||||
|
{ title: '产品编号', dataIndex: 'plantCode', key: 'plantCode' },
|
||||||
|
{ title: '产品名称', dataIndex: 'plantName', key: 'plantName' },
|
||||||
|
{ title: '产品分类', dataIndex: 'plantType', key: 'plantType' },
|
||||||
|
{
|
||||||
|
title: '图片',
|
||||||
|
dataIndex: 'imgPath',
|
||||||
|
key: 'imgPath',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '规格',
|
||||||
|
dataIndex: 'specification',
|
||||||
|
key: 'specification',
|
||||||
|
},
|
||||||
|
{ title: '租金', dataIndex: 'rent', key: 'rent' },
|
||||||
|
{ title: '备注', dataIndex: 'remark', key: 'remark' },
|
||||||
|
{
|
||||||
|
title: '状态',
|
||||||
|
dataIndex: 'state',
|
||||||
|
key: 'state',
|
||||||
|
customRender: ({ value }: { value: number }) =>
|
||||||
|
value === 1 ? '上架' : '下架',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
key: 'action',
|
||||||
|
fixed: 'right' as const,
|
||||||
|
},
|
||||||
|
];
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<BasicModal :title="title">
|
<BasicModal :title="title">
|
||||||
<BasicForm />
|
<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">
|
||||||
|
{{ $t('pages.common.add') }}
|
||||||
|
</a-button>
|
||||||
|
</div>
|
||||||
|
<Table
|
||||||
|
:data-source="detailTable"
|
||||||
|
:columns="detailColumns"
|
||||||
|
:pagination="false"
|
||||||
|
>
|
||||||
|
<template #bodyCell="{ column, index, record }">
|
||||||
|
<template v-if="column.key === 'index'">
|
||||||
|
{{ index + 1 }}
|
||||||
|
</template>
|
||||||
|
<template v-else-if="column.key === 'action'">
|
||||||
|
<Button danger @click="handleDeleteDetail(record, index)">
|
||||||
|
删除
|
||||||
|
</Button>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</Table>
|
||||||
|
<div>费用合计:{{ totalSumPeices }}元</div>
|
||||||
|
</div>
|
||||||
</BasicModal>
|
</BasicModal>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -214,7 +214,16 @@ onMounted(() => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="row"></div>
|
<div class="row">
|
||||||
|
<div class="box">
|
||||||
|
<div class="title">总订单数</div>
|
||||||
|
<div class="number">13,132</div>
|
||||||
|
<div class="percent">8.9%</div>
|
||||||
|
</div>
|
||||||
|
<div class="box"></div>
|
||||||
|
<div class="box"></div>
|
||||||
|
<div class="box"></div>
|
||||||
|
</div>
|
||||||
<div class="row-first">
|
<div class="row-first">
|
||||||
<div class="item1">
|
<div class="item1">
|
||||||
<EchartsUI
|
<EchartsUI
|
||||||
@ -304,11 +313,26 @@ onMounted(() => {
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
background-color: #962020;
|
|
||||||
|
|
||||||
.row {
|
.row {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
.box{
|
||||||
|
width: 300px;
|
||||||
|
height: 120px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 40px 0px;
|
||||||
|
padding: 10px;
|
||||||
|
.title{
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.number{
|
||||||
|
font-size: 25px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.percent{
|
||||||
|
font-size: 15px; }
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.row-first {
|
.row-first {
|
||||||
|
Loading…
Reference in New Issue
Block a user