update
This commit is contained in:
ylj20011123
parent
4fceeb9d91
commit
16b1153c4c
@ -263,6 +263,11 @@ export default [
|
|||||||
name: 'reports/warningQueryContract',
|
name: 'reports/warningQueryContract',
|
||||||
component: './reports/contractWarningQuery/index',
|
component: './reports/contractWarningQuery/index',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'reports/ContractAbnormality',
|
||||||
|
name: 'reports/ContractAbnormality',
|
||||||
|
component: './reports/ContractAbnormality/index',
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -1051,6 +1056,24 @@ export default [
|
|||||||
name: 'SupplierOrderStatistics',
|
name: 'SupplierOrderStatistics',
|
||||||
component: './travelMember/SupplierOrderStatistics/index'
|
component: './travelMember/SupplierOrderStatistics/index'
|
||||||
},
|
},
|
||||||
|
// 积分成长值汇总表
|
||||||
|
{
|
||||||
|
path: 'SummaryOfIntegralGrowthValue',
|
||||||
|
name: 'SummaryOfIntegralGrowthValue',
|
||||||
|
component: './travelMember/SummaryOfIntegralGrowthValue/index'
|
||||||
|
},
|
||||||
|
// 运营活动拉新统计
|
||||||
|
{
|
||||||
|
path: 'BusinessActivityStatistics',
|
||||||
|
name: 'BusinessActivityStatistics',
|
||||||
|
component: './travelMember/BusinessActivityStatistics/index'
|
||||||
|
},
|
||||||
|
// 活跃会员统计
|
||||||
|
{
|
||||||
|
path: 'ActiveMemberStatistics',
|
||||||
|
name: 'ActiveMemberStatistics',
|
||||||
|
component: './travelMember/ActiveMemberStatistics/index'
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
]
|
]
|
||||||
|
|||||||
@ -751,6 +751,8 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
|
|||||||
// 经营业态
|
// 经营业态
|
||||||
// const BusinessTradeIdsList = await
|
// const BusinessTradeIdsList = await
|
||||||
getFieldEnumTree({ FieldExplainField: 'BusinessTradeIds' }).then(BusinessTradeIdsList => {
|
getFieldEnumTree({ FieldExplainField: 'BusinessTradeIds' }).then(BusinessTradeIdsList => {
|
||||||
|
console.log('BusinessTradeIdsListBusinessTradeIdsListBusinessTradeIdsList', BusinessTradeIdsList);
|
||||||
|
|
||||||
const BusinessTradeIdsObj: any = {}
|
const BusinessTradeIdsObj: any = {}
|
||||||
const BusinessTradeIdsBigObj: any = {}
|
const BusinessTradeIdsBigObj: any = {}
|
||||||
if (BusinessTradeIdsList && BusinessTradeIdsList.length > 0) {
|
if (BusinessTradeIdsList && BusinessTradeIdsList.length > 0) {
|
||||||
|
|||||||
@ -1,16 +1,31 @@
|
|||||||
import { connect } from "umi";
|
import { connect } from "umi";
|
||||||
import type { ConnectState } from "@/models/connect";
|
import type { ConnectState } from "@/models/connect";
|
||||||
import ProTable, { ActionType } from "@ant-design/pro-table";
|
import ProTable, { ActionType } from "@ant-design/pro-table";
|
||||||
import { useRef } from "react";
|
import { useEffect, useRef, useState } from "react";
|
||||||
import { FormInstance } from "antd";
|
import { FormInstance, Modal, Space } from "antd";
|
||||||
|
import { handeGetSERVERPARTSHOPList } from "@/pages/travelMember/service";
|
||||||
|
import session from "@/utils/session";
|
||||||
|
|
||||||
type DetailProps = {
|
type DetailProps = {
|
||||||
|
currentUser: any
|
||||||
|
showDetail: boolean
|
||||||
|
onCancel: any
|
||||||
|
onOk: any
|
||||||
|
currentRow?: any
|
||||||
}
|
}
|
||||||
const SelectServiceShop = ({ }: DetailProps) => {
|
const SelectServiceShop = ({ currentUser, showDetail, onCancel, onOk, currentRow }: DetailProps) => {
|
||||||
const actionRef = useRef<ActionType>();
|
const actionRef = useRef<ActionType>();
|
||||||
const formRef = useRef<FormInstance>();
|
const formRef = useRef<FormInstance>();
|
||||||
|
|
||||||
|
const currentPageDataRef = useRef<any[]>([]);
|
||||||
|
|
||||||
|
// 点击确认之后的加载效果
|
||||||
|
const [modalLoading, setModalLoading] = useState<boolean>(false)
|
||||||
|
const BusinessTradeIdsObj = session.get('BusinessTradeIdsObj')
|
||||||
|
const selectedRowMapRef = useRef(new Map<string, any>());
|
||||||
|
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
|
||||||
|
const [selectedRows, setSelectedRows] = useState<any[]>([]);
|
||||||
|
|
||||||
const columns: any = [
|
const columns: any = [
|
||||||
{
|
{
|
||||||
title: '查询内容',
|
title: '查询内容',
|
||||||
@ -32,15 +47,115 @@ const SelectServiceShop = ({ }: DetailProps) => {
|
|||||||
{
|
{
|
||||||
title: "门店名称",
|
title: "门店名称",
|
||||||
width: 150,
|
width: 150,
|
||||||
dataIndex: "",
|
dataIndex: "SHOPNAME",
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'center',
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "经营业态",
|
||||||
|
width: 150,
|
||||||
|
dataIndex: "BUSINESS_TRADE",
|
||||||
|
valueType: 'select',
|
||||||
|
valueEnum: BusinessTradeIdsObj,
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'center',
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "服务区名称",
|
||||||
|
width: 150,
|
||||||
|
dataIndex: "SERVERPART_NAME",
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
ellipsis: true,
|
ellipsis: true,
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
|
const rowSelection = {
|
||||||
|
selectedRowKeys,
|
||||||
|
onChange: (keys: React.Key[], currentPageSelectedRows: any[]) => {
|
||||||
|
const keySet = new Set(keys.map(k => String(k)));
|
||||||
|
const map = selectedRowMapRef.current;
|
||||||
|
|
||||||
|
// ✅ 当前页所有数据
|
||||||
|
const currentPageRows = currentPageDataRef.current;
|
||||||
|
|
||||||
|
// ✅ 1. 删除当前页中“之前被选中过但现在没选中”的项
|
||||||
|
currentPageRows.forEach(row => {
|
||||||
|
const id = String(row.SERVERPARTSHOP_ID);
|
||||||
|
const wasSelected = map.has(id);
|
||||||
|
const isNowSelected = keySet.has(id);
|
||||||
|
if (wasSelected && !isNowSelected) {
|
||||||
|
map.delete(id);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// ✅ 2. 合并当前页选中的项（添加或覆盖）
|
||||||
|
currentPageSelectedRows.forEach(row => {
|
||||||
|
const id = String(row.SERVERPARTSHOP_ID);
|
||||||
|
map.set(id, row);
|
||||||
|
});
|
||||||
|
|
||||||
|
// ✅ 3. 同步最终状态
|
||||||
|
const finalKeys = Array.from(map.keys());
|
||||||
|
const finalRows = Array.from(map.values());
|
||||||
|
setSelectedRowKeys(finalKeys);
|
||||||
|
setSelectedRows(finalRows);
|
||||||
|
},
|
||||||
|
onSelectNone: () => {
|
||||||
|
selectedRowMapRef.current.clear();
|
||||||
|
setSelectedRowKeys([]);
|
||||||
|
setSelectedRows([]);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (showDetail) {
|
||||||
|
let list: any = []
|
||||||
|
let listKey: any = []
|
||||||
|
if (currentRow?.ShopItemList && currentRow?.ShopItemList.length > 0) {
|
||||||
|
currentRow?.ShopItemList.forEach((item: any) => {
|
||||||
|
listKey.push(item.SERVERPARTSHOP_ID.toString())
|
||||||
|
list.push(item)
|
||||||
|
})
|
||||||
|
setSelectedRowKeys(listKey)
|
||||||
|
setSelectedRows(list)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}, [showDetail])
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<Modal
|
||||||
|
open={showDetail}
|
||||||
|
className={"CardCouponApplicRules"}
|
||||||
|
onCancel={() => {
|
||||||
|
setModalLoading(false)
|
||||||
|
if (onCancel) {
|
||||||
|
onCancel()
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
afterClose={() => {
|
||||||
|
setSelectedRowKeys([])
|
||||||
|
setSelectedRows([])
|
||||||
|
}}
|
||||||
|
destroyOnClose
|
||||||
|
confirmLoading={modalLoading}
|
||||||
|
width={1300}
|
||||||
|
bodyStyle={{
|
||||||
|
height: '700px', // 你可以根据需要调整高度
|
||||||
|
overflowY: 'auto',
|
||||||
|
}}
|
||||||
|
title={"选择门店"}
|
||||||
|
onOk={async () => {
|
||||||
|
if (onOk) {
|
||||||
|
await onOk(selectedRows)
|
||||||
|
setModalLoading(false)
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
<ProTable
|
<ProTable
|
||||||
actionRef={actionRef}
|
actionRef={actionRef}
|
||||||
formRef={formRef}
|
formRef={formRef}
|
||||||
@ -49,11 +164,39 @@ const SelectServiceShop = ({ }: DetailProps) => {
|
|||||||
expandable={{
|
expandable={{
|
||||||
expandRowByClick: true
|
expandRowByClick: true
|
||||||
}}
|
}}
|
||||||
scroll={{ x: "100%", y: "calc(100vh - 410px)" }}
|
rowKey={(record) => String(record.SERVERPARTSHOP_ID)}
|
||||||
|
scroll={{ x: "100%", y: "400px" }}
|
||||||
headerTitle={'选择门店'} // 列表表头
|
headerTitle={'选择门店'} // 列表表头
|
||||||
search={{ span: 6 }}
|
search={{ span: 12 }}
|
||||||
|
rowSelection={rowSelection}
|
||||||
request={async (params) => {
|
request={async (params) => {
|
||||||
|
if (!currentUser?.ProvinceCode) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const req: any = {
|
||||||
|
SearchParameter: {
|
||||||
|
PROVINCE_CODE: currentUser?.ProvinceCode,
|
||||||
|
ISVALID: 1
|
||||||
|
},
|
||||||
|
PageIndex: params?.current,
|
||||||
|
PageSize: params?.pageSize,
|
||||||
|
keyWord: {
|
||||||
|
Key: "SHOPNAME",
|
||||||
|
Value: params?.searchText
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log('reqreqreq', req);
|
||||||
|
|
||||||
|
const data = await handeGetSERVERPARTSHOPList(req)
|
||||||
|
console.log('datadatadatadata', data);
|
||||||
|
if (data.List && data.List.length > 0) {
|
||||||
|
currentPageDataRef.current = data.List;
|
||||||
|
return { data: data.List, success: true, total: data.TotalCount }
|
||||||
|
}
|
||||||
|
return { data: [], success: true }
|
||||||
|
}}
|
||||||
|
pagination={{
|
||||||
|
pageSize: 20
|
||||||
}}
|
}}
|
||||||
toolbar={{
|
toolbar={{
|
||||||
actions: [
|
actions: [
|
||||||
@ -62,7 +205,8 @@ const SelectServiceShop = ({ }: DetailProps) => {
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</div>
|
|
||||||
|
</Modal>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -8,7 +8,7 @@
|
|||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
|
||||||
.shopItem {
|
.shopItem {
|
||||||
width: 20%;
|
width: 30%;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|||||||
@ -20,6 +20,7 @@ import ProForm, { ProFormSelect, ProFormText } from "@ant-design/pro-form";
|
|||||||
import './index.less'
|
import './index.less'
|
||||||
import { handleSetlogSave } from "@/utils/format";
|
import { handleSetlogSave } from "@/utils/format";
|
||||||
import ModalFooter from "@/pages/travelMember/scenicSpotConfig/component/modalFooter";
|
import ModalFooter from "@/pages/travelMember/scenicSpotConfig/component/modalFooter";
|
||||||
|
import SelectServiceShop from "./components/selectServiceShop";
|
||||||
|
|
||||||
|
|
||||||
const CardCouponApplicRules: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
const CardCouponApplicRules: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
||||||
@ -49,6 +50,9 @@ const CardCouponApplicRules: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
const [currentRow, setCurrentRow] = useState<any>()
|
const [currentRow, setCurrentRow] = useState<any>()
|
||||||
// 悬浮框 按钮加载的属性
|
// 悬浮框 按钮加载的属性
|
||||||
const [modalLoading, setModalLoading] = useState<boolean>(false)
|
const [modalLoading, setModalLoading] = useState<boolean>(false)
|
||||||
|
// 显示选择门店
|
||||||
|
const [showSelectShopModal, setShowSelectShopModal] = useState<boolean>(false)
|
||||||
|
|
||||||
|
|
||||||
const columns: any = [
|
const columns: any = [
|
||||||
// {
|
// {
|
||||||
@ -153,6 +157,32 @@ const CardCouponApplicRules: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
const handleSynchroCOOPSHOPRULE = async (res: any) => {
|
const handleSynchroCOOPSHOPRULE = async (res: any) => {
|
||||||
let req: any = {}
|
let req: any = {}
|
||||||
setModalLoading(true)
|
setModalLoading(true)
|
||||||
|
|
||||||
|
let shopList: any = []
|
||||||
|
if (currentRow?.ShopItemList && currentRow?.ShopItemList.length > 0) {
|
||||||
|
currentRow?.ShopItemList.forEach((item: any) => {
|
||||||
|
shopList.push({
|
||||||
|
SERVERPARTSHOP_ID: item.SERVERPARTSHOP_ID,
|
||||||
|
SHOPCODE: item.SHOPCODE,
|
||||||
|
SHOPNAME: item.SHOPNAME,
|
||||||
|
SERVERPART_ID: item.SERVERPART_ID,
|
||||||
|
SERVERPART_CODE: "",
|
||||||
|
SERVERPART_NAME: item.SERVERPART_NAME,
|
||||||
|
PROVINCE_CODE: item.PROVINCE_CODE,
|
||||||
|
ISVALID: item.ISVALID,
|
||||||
|
CREATE_STAFF_ID: item.CREATE_STAFF_ID || currentUser?.ID,
|
||||||
|
CREATE_STAFF_NAME: item.CREATE_STAFF_NAME || currentUser?.Name,
|
||||||
|
CREATE_DATE: item.CREATE_DATE || moment().format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
UPDATE_STAFF_ID: currentUser?.ID,
|
||||||
|
UPDATE_STAFF_NAME: currentUser?.Name,
|
||||||
|
UPDATE_DATE: moment().format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
if (currentRow?.COOPSHOP_RULE_ID) {
|
if (currentRow?.COOPSHOP_RULE_ID) {
|
||||||
req = {
|
req = {
|
||||||
...currentRow,
|
...currentRow,
|
||||||
@ -160,6 +190,7 @@ const CardCouponApplicRules: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
UPDATE_STAFF_ID: currentUser?.ID,
|
UPDATE_STAFF_ID: currentUser?.ID,
|
||||||
UPDATE_STAFF_NAME: currentUser?.Name,
|
UPDATE_STAFF_NAME: currentUser?.Name,
|
||||||
UPDATE_DATE: moment().format('YYYY-MM-DD HH:mm:ss'),
|
UPDATE_DATE: moment().format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
ShopItemList: shopList
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
req = {
|
req = {
|
||||||
@ -171,10 +202,14 @@ const CardCouponApplicRules: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
PROVINCE_CODE: currentUser?.ProvinceCode,
|
PROVINCE_CODE: currentUser?.ProvinceCode,
|
||||||
OWNERUNIT_ID: currentUser?.OwnerUnitId,
|
OWNERUNIT_ID: currentUser?.OwnerUnitId,
|
||||||
OWNERUNIT_NAME: currentUser?.OwnerUnitName,
|
OWNERUNIT_NAME: currentUser?.OwnerUnitName,
|
||||||
ISOFFLINE: res.ISOFFLINE
|
ISOFFLINE: res.ISOFFLINE,
|
||||||
|
ShopItemList: shopList
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
console.log('req', req);
|
||||||
|
|
||||||
|
|
||||||
const data = await handleSynchroCOOPSHOP_RULE(req)
|
const data = await handleSynchroCOOPSHOP_RULE(req)
|
||||||
console.log('datadatadatadatadata', data);
|
console.log('datadatadatadatadata', data);
|
||||||
setModalLoading(false)
|
setModalLoading(false)
|
||||||
@ -208,6 +243,30 @@ const CardCouponApplicRules: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 关闭选择门店的方法
|
||||||
|
const handleOnCancel = () => {
|
||||||
|
setShowSelectShopModal(false)
|
||||||
|
}
|
||||||
|
// 确认触发的方法
|
||||||
|
const handleConfirm = (data: any) => {
|
||||||
|
// data 带出来的是 选择的门店
|
||||||
|
setShowSelectShopModal(false)
|
||||||
|
|
||||||
|
console.log('datadatadatadatadatadata', data);
|
||||||
|
|
||||||
|
let list: any = []
|
||||||
|
if (data && data.length > 0) {
|
||||||
|
data.forEach((item: any) => {
|
||||||
|
list.push(item)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
setCurrentRow({
|
||||||
|
...currentRow,
|
||||||
|
ShopItemList: list
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div ref={(el) => {
|
<div ref={(el) => {
|
||||||
// 打印报表
|
// 打印报表
|
||||||
@ -289,7 +348,7 @@ const CardCouponApplicRules: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
destroyOnClose
|
destroyOnClose
|
||||||
confirmLoading={modalLoading}
|
confirmLoading={modalLoading}
|
||||||
// width={'70%'}
|
// width={'70%'}
|
||||||
width={900}
|
width={1400}
|
||||||
bodyStyle={{
|
bodyStyle={{
|
||||||
height: '700px', // 你可以根据需要调整高度
|
height: '700px', // 你可以根据需要调整高度
|
||||||
overflowY: 'auto',
|
overflowY: 'auto',
|
||||||
@ -432,15 +491,23 @@ const CardCouponApplicRules: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
<div className="shopList">
|
<div className="shopList">
|
||||||
{
|
{
|
||||||
currentRow?.ShopItemList.map((item: any) => {
|
currentRow?.ShopItemList.map((item: any) => {
|
||||||
return <div className="shopItem">
|
return <div style={{ marginRight: '16px' }} className="shopItem">
|
||||||
{`${item.SERVERPART_NAME} ${item.SHOPNAME}`}
|
{`${item.SERVERPART_NAME} ${item.SHOPNAME}`}
|
||||||
</div>
|
</div>
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</div> : ""
|
</div> : ""
|
||||||
}
|
}
|
||||||
|
<Button type={"primary"} onClick={() => {
|
||||||
|
setShowSelectShopModal(true)
|
||||||
|
}}>选择门店</Button>
|
||||||
</ProForm>
|
</ProForm>
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
||||||
|
|
||||||
|
{/* 选择门店的组件 */}
|
||||||
|
<SelectServiceShop showDetail={showSelectShopModal} onCancel={handleOnCancel} onOk={handleConfirm} currentUser={currentUser} currentRow={currentRow} />
|
||||||
|
|
||||||
</div >
|
</div >
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -526,8 +526,12 @@ const EditContract = ({ contractId: id, actionRef, setShowDetail, showDelete, cu
|
|||||||
newValue.FIRSTPART_ID = fields?.FIRSTPART_ID;
|
newValue.FIRSTPART_ID = fields?.FIRSTPART_ID;
|
||||||
newValue.SECONDPART_ID = fields?.SECONDPART_ID;
|
newValue.SECONDPART_ID = fields?.SECONDPART_ID;
|
||||||
}
|
}
|
||||||
|
let [COMPACT_STARTDATE, COMPACT_ENDDATE] = ["", ""]
|
||||||
// 格式化数据
|
// 格式化数据
|
||||||
const [COMPACT_STARTDATE, COMPACT_ENDDATE] = values.contractRangeDate
|
if (values.contractRangeDate) {
|
||||||
|
[COMPACT_STARTDATE, COMPACT_ENDDATE] = values.contractRangeDate
|
||||||
|
}
|
||||||
|
|
||||||
newValue.COMPACT_STARTDATE = COMPACT_STARTDATE
|
newValue.COMPACT_STARTDATE = COMPACT_STARTDATE
|
||||||
newValue.COMPACT_ENDDATE = COMPACT_ENDDATE
|
newValue.COMPACT_ENDDATE = COMPACT_ENDDATE
|
||||||
newValue.REPAIR_TIME = values.REPAIR_TIME ? values.REPAIR_TIME : null
|
newValue.REPAIR_TIME = values.REPAIR_TIME ? values.REPAIR_TIME : null
|
||||||
@ -1003,12 +1007,12 @@ const EditContract = ({ contractId: id, actionRef, setShowDetail, showDelete, cu
|
|||||||
<ProFormDateRangePicker
|
<ProFormDateRangePicker
|
||||||
label="合同生效时间"
|
label="合同生效时间"
|
||||||
name="contractRangeDate"
|
name="contractRangeDate"
|
||||||
rules={[
|
// rules={[
|
||||||
{
|
// {
|
||||||
required: true,
|
// required: true,
|
||||||
message: '请选择合同生效时间',
|
// message: '请选择合同生效时间',
|
||||||
},
|
// },
|
||||||
]}
|
// ]}
|
||||||
fieldProps={{
|
fieldProps={{
|
||||||
onChange: async (dates) => {
|
onChange: async (dates) => {
|
||||||
if (dates && dates[0] && dates[1]) {
|
if (dates && dates[0] && dates[1]) {
|
||||||
|
|||||||
351
src/pages/reports/ContractAbnormality/index.tsx
Normal file
351
src/pages/reports/ContractAbnormality/index.tsx
Normal file
@ -0,0 +1,351 @@
|
|||||||
|
import { connect } from "umi";
|
||||||
|
import type { CurrentUser } from "umi";
|
||||||
|
import type { ConnectState } from "@/models/connect";
|
||||||
|
import React, { useRef, useState } from "react";
|
||||||
|
import ProCard from "@ant-design/pro-card";
|
||||||
|
import { MenuFoldOutlined } from "@ant-design/icons";
|
||||||
|
import type { FormInstance } from "antd";
|
||||||
|
import { Button, Drawer, message, Space, Spin, Tree } from "antd";
|
||||||
|
import useRequest from "@ahooksjs/use-request";
|
||||||
|
import { getFieldEnumTree, getServerpartTree } from "@/services/options";
|
||||||
|
import type { ActionType, ProColumns } from "@ant-design/pro-table";
|
||||||
|
import ProTable from "@ant-design/pro-table";
|
||||||
|
import ReactHTMLTableToExcel from "react-html-table-to-excel";
|
||||||
|
import LeftSelectTree from "@/pages/reports/settlementAccount/component/leftSelectTree";
|
||||||
|
import PageTitleBox from "@/components/PageTitleBox";
|
||||||
|
import { AccountReceivablesModel } from "@/pages/busniess/PaymentConfirm/data";
|
||||||
|
import { getShopReceivablesList } from "@/pages/basicManage/ServerpartShop/service";
|
||||||
|
import { ServerpartShopModel } from "@/pages/basicManage/ServerpartShop/data";
|
||||||
|
import ContractEdit from "@/pages/contract/components/editor"
|
||||||
|
import { getDetail, getSubDetail } from "@/pages/contract/service";
|
||||||
|
import ProjectEditor from '@/pages/BussinessProject/editor'
|
||||||
|
|
||||||
|
const ContractAbnormality: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
||||||
|
const { currentUser } = props
|
||||||
|
const downloadBtnRef = useRef<any>()
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
const formRef = useRef<FormInstance>();
|
||||||
|
const [reqDetailList, setReqDetailList] = useState<any>(); // 合计项数据源
|
||||||
|
const [printOut, setPrintOut] = useState<any>(); // 打印数据的内容
|
||||||
|
const [collapsible, setCollapsible] = useState<boolean>(false)
|
||||||
|
const [treeView, setTreeView] = useState<any>()
|
||||||
|
const [printIndex, setPrintIndex] = useState<number>(new Date().getTime())
|
||||||
|
const [modalVisible, handleModalVisible] = useState<boolean>(false) // 是否显示编辑
|
||||||
|
const [showProjectDetail, setProjectDetail] = useState<boolean>()
|
||||||
|
|
||||||
|
|
||||||
|
// 树相关的属性和方法
|
||||||
|
const [selectedId, setSelectedId] = useState<string>()
|
||||||
|
// 导出的加载效果
|
||||||
|
const [showLoading, setShowLoading] = useState<boolean>(false)
|
||||||
|
// 是否显示打印的表格
|
||||||
|
const [showExportTable, setShowExportTable] = useState<boolean>(false)
|
||||||
|
// 查询的条件
|
||||||
|
const [searchParams, setSearchParams] = useState<any>()
|
||||||
|
const [currentRow, setCurrentRow] = useState<ServerpartShopModel | any>()
|
||||||
|
const [showDetail, setShowDetail] = useState<boolean>()
|
||||||
|
|
||||||
|
const columns: ProColumns<AccountReceivablesModel>[] = [
|
||||||
|
{
|
||||||
|
dataIndex: 'SERVERPART_NAME',
|
||||||
|
title: '服务区名称',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
hideInDescriptions: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'SERVERPARTSHOP_NAME',
|
||||||
|
title: '门店名称',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
hideInDescriptions: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'COMPACT_NAME',
|
||||||
|
title: '合同名称',
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return <a style={{ color: record?.CompactWarning && record?.COMPACT_NAME ? 'red' : 'normal' }}
|
||||||
|
onClick={() => {
|
||||||
|
setCurrentRow({ ...record })
|
||||||
|
setShowDetail(true)
|
||||||
|
}}>{record?.COMPACT_NAME || '添加合同'}</a>
|
||||||
|
},
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'BUSINESSPROJECT_NAME',
|
||||||
|
title: '经营项目',
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return <a onClick={async () => {
|
||||||
|
setCurrentRow({ ...record })
|
||||||
|
if (record?.REGISTERCOMPACT_ID && !record?.BUSINESSPROJECT_ID) {
|
||||||
|
const contractData = await getDetail(record?.REGISTERCOMPACT_ID)
|
||||||
|
const contractSubData = await getSubDetail(record?.REGISTERCOMPACT_ID)
|
||||||
|
if (contractData && contractSubData) {
|
||||||
|
setCurrentRow({
|
||||||
|
...currentRow, MERCHANTS_ID: contractData?.SECONDPART_ID,
|
||||||
|
REGISTERCOMPACT_ID: contractData?.REGISTERCOMPACT_ID,
|
||||||
|
SERVERPART_NAME: contractData?.SERVERPART_NAME,
|
||||||
|
GUARANTEE_PRICE: contractData?.COMPACT_AMOUNT,
|
||||||
|
PROJECT_DAYS: contractData?.DURATIONDAY,
|
||||||
|
projectRangeDate: [contractData?.COMPACT_STARTDATE, contractData?.COMPACT_ENDDATE],
|
||||||
|
COMPACT_NAME: contractData?.COMPACT_NAME,
|
||||||
|
BUSINESSPROJECT_NAME: contractData?.COMPACT_NAME,
|
||||||
|
MERCHANTS_NAME: contractData?.SECONDPART_NAME,
|
||||||
|
serverpartId: contractData?.SERVERPART_IDS,
|
||||||
|
SERVERPART_IDS: contractData?.SERVERPART_IDS ? contractData?.SERVERPART_IDS.split(',').map(Number) : [],
|
||||||
|
SETTLEMENT_CYCLE: contractSubData?.SETTLEMENT_CYCLE,
|
||||||
|
BUSINESS_TYPE: contractSubData?.BUSINESS_TYPE,
|
||||||
|
SETTLEMENT_MODES: contractSubData?.SETTLEMENT_MODES,
|
||||||
|
PROJECT_VALID: 1,
|
||||||
|
serverpartShopIds: []
|
||||||
|
})
|
||||||
|
}
|
||||||
|
handleModalVisible(true)
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
setProjectDetail(true)
|
||||||
|
}
|
||||||
|
}} style={{ color: record?.ProjectWarning && record?.BUSINESSPROJECT_NAME ? 'red' : 'normal' }}>
|
||||||
|
{record?.REGISTERCOMPACT_ID && !record?.BUSINESSPROJECT_ID ? '添加项目' : record?.BUSINESSPROJECT_NAME}
|
||||||
|
</a>
|
||||||
|
},
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'THREEPART_NAME',
|
||||||
|
title: '丙方联系人',
|
||||||
|
align: 'center',
|
||||||
|
width: 90,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '开始日期',
|
||||||
|
hideInSearch: true,
|
||||||
|
dataIndex: 'PROJECT_STARTDATE',
|
||||||
|
valueType: 'date',
|
||||||
|
sorter: true,
|
||||||
|
// defaultSortOrder: 'descend',
|
||||||
|
width: 120
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '结束日期',
|
||||||
|
hideInSearch: true,
|
||||||
|
dataIndex: 'PROJECT_ENDDATE',
|
||||||
|
valueType: 'date',
|
||||||
|
sorter: true,
|
||||||
|
width: 120
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'BUSINESS_TYPE',
|
||||||
|
title: '经营模式',
|
||||||
|
valueType: 'select',
|
||||||
|
align: 'center',
|
||||||
|
width: 80,
|
||||||
|
request: async () => {
|
||||||
|
const options = await getFieldEnumTree({ FieldExplainField: 'BUSINESS_TYPE', sessionName: 'BUSINESS_TYPE' })
|
||||||
|
console.log('options', options)
|
||||||
|
return options
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'BUSINESS_STATE',
|
||||||
|
title: '经营状态',
|
||||||
|
valueType: 'select',
|
||||||
|
align: 'center',
|
||||||
|
width: 80,
|
||||||
|
hideInSearch: false,
|
||||||
|
valueEnum: {
|
||||||
|
1000: { text: '运营中', status: 'processing' },
|
||||||
|
2000: { text: '已暂停', status: 'warning' },
|
||||||
|
3000: { text: '已关闭', status: 'error' },
|
||||||
|
1010: { text: '待运营', status: 'default' }
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'COOPMERCHANTS_NAME',
|
||||||
|
title: '经营单位',
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return <a style={{ color: record?.COOPMERCHANTS_NAME === '待补充' ? 'red' : 'rgba(0, 0, 0, 0.85)' }}>{record?.COOPMERCHANTS_NAME}</a>
|
||||||
|
},
|
||||||
|
ellipsis: true,
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
const exportTable = (e) => {
|
||||||
|
e.stopPropagation(); // 防止Collapse组件收起
|
||||||
|
const main = document.getElementsByClassName(`saleReportHideBox${printIndex}`)[0]
|
||||||
|
const thead = main.querySelector('thead').cloneNode(true); // 深克隆DOM节点
|
||||||
|
const tbody = main.querySelector('tbody').cloneNode(true); // 深克隆DOM节点
|
||||||
|
const container = document.querySelector('#hiddenBox');
|
||||||
|
|
||||||
|
const tempTable = document.createElement('table');
|
||||||
|
tempTable.appendChild(thead);
|
||||||
|
tempTable.appendChild(tbody);
|
||||||
|
|
||||||
|
tempTable.setAttribute('id', 'table-to-xls-ContractAbnormality'); // 给table添加id，值与按钮上的table字段对应
|
||||||
|
|
||||||
|
container.appendChild(tempTable); // 把创建的节点添加到页面容器中
|
||||||
|
|
||||||
|
setShowLoading(false)
|
||||||
|
|
||||||
|
downloadBtnRef.current.handleDownload();
|
||||||
|
setShowExportTable(false)
|
||||||
|
tempTable.remove() // 防止重复打印一个内容
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div ref={(el) => {
|
||||||
|
// 打印报表
|
||||||
|
if (!reqDetailList || reqDetailList.length === 0) return;
|
||||||
|
setPrintOut(el);
|
||||||
|
}} >
|
||||||
|
|
||||||
|
{
|
||||||
|
showLoading ?
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
background: 'rgba(0,0,0,0.1)',
|
||||||
|
position: 'fixed',
|
||||||
|
zIndex: 5,
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
padding: '15px 20px 10px',
|
||||||
|
background: '#fff',
|
||||||
|
borderRadius: '8px',
|
||||||
|
width: '200px'
|
||||||
|
}}>
|
||||||
|
<Spin />
|
||||||
|
<span style={{ marginLeft: '5px' }}>数据导出中...</span>
|
||||||
|
</div>
|
||||||
|
</div> : ''
|
||||||
|
}
|
||||||
|
|
||||||
|
<div className={`saleReportHideBox${printIndex}`} style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }}>
|
||||||
|
{
|
||||||
|
showExportTable && reqDetailList && reqDetailList.length > 0 ?
|
||||||
|
<ProTable
|
||||||
|
columns={columns}
|
||||||
|
dataSource={reqDetailList}
|
||||||
|
pagination={false}
|
||||||
|
expandable={{
|
||||||
|
defaultExpandAllRows: true
|
||||||
|
}}
|
||||||
|
/> : ''
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
<div id='hiddenBox' style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }} />
|
||||||
|
|
||||||
|
<div style={{ backgroundColor: '#fff', display: 'flex' }}>
|
||||||
|
<LeftSelectTree setSelectedId={setSelectedId} setCollapsible={setCollapsible} collapsible={collapsible} />
|
||||||
|
<div style={{
|
||||||
|
width: !collapsible ? 'calc(100% - 300px)' : 'calc(100% - 60px)',
|
||||||
|
paddingTop: 0,
|
||||||
|
paddingBottom: 0,
|
||||||
|
paddingRight: 0
|
||||||
|
}}>
|
||||||
|
<ProTable
|
||||||
|
actionRef={actionRef}
|
||||||
|
formRef={formRef}
|
||||||
|
columns={columns}
|
||||||
|
bordered
|
||||||
|
expandable={{
|
||||||
|
expandRowByClick: true
|
||||||
|
}}
|
||||||
|
scroll={{ x: "100%", y: "calc(100vh - 410px)" }}
|
||||||
|
headerTitle={<PageTitleBox props={props} />} // 列表表头
|
||||||
|
search={{ span: 6 }}
|
||||||
|
request={async (params) => {
|
||||||
|
if (!selectedId) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
setSearchParams(params)
|
||||||
|
const data = await getShopReceivablesList({
|
||||||
|
...params,
|
||||||
|
ServerpartId: selectedId, BusinessType: params?.BUSINESS_TYPE,
|
||||||
|
BusinessState: params?.BUSINESS_STATE,
|
||||||
|
AbnormalShop: true
|
||||||
|
})
|
||||||
|
return data
|
||||||
|
}}
|
||||||
|
toolbar={{
|
||||||
|
actions: [
|
||||||
|
// <span style={{ visibility: 'hidden' }}>
|
||||||
|
// <ReactHTMLTableToExcel
|
||||||
|
// buttonText={'导出excel'}
|
||||||
|
// ref={downloadBtnRef}
|
||||||
|
// table="table-to-xls-ContractAbnormality"
|
||||||
|
// filename={`合同异常统计`}
|
||||||
|
// sheet="sheet1"
|
||||||
|
// />
|
||||||
|
// </span>,
|
||||||
|
// <Button
|
||||||
|
// key="new"
|
||||||
|
// type="primary"
|
||||||
|
// onClick={(e) => {
|
||||||
|
// if (reqDetailList && reqDetailList.length > 0) {
|
||||||
|
// setShowLoading(true)
|
||||||
|
// setTimeout(() => {
|
||||||
|
// setShowExportTable(true)
|
||||||
|
// setTimeout(() => {
|
||||||
|
// exportTable(e)
|
||||||
|
// }, 100)
|
||||||
|
// }, 100)
|
||||||
|
// } else {
|
||||||
|
// message.error('暂无数据可导出！')
|
||||||
|
// }
|
||||||
|
// }}
|
||||||
|
// >
|
||||||
|
// 导出excel
|
||||||
|
// </Button>
|
||||||
|
]
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Drawer
|
||||||
|
className="contract-detail-drawer"
|
||||||
|
width="73%"
|
||||||
|
visible={showDetail}
|
||||||
|
onClose={() => {
|
||||||
|
setCurrentRow(undefined);
|
||||||
|
setShowDetail(false);
|
||||||
|
}}
|
||||||
|
title={currentRow?.CompactWarning ? <div className="card-title" style={{ fontWeight: 700 }}>
|
||||||
|
{!currentRow?.REGISTERCOMPACT_ID ? "新增合同" : currentRow?.COMPACT_NAME}
|
||||||
|
</div> : ''}
|
||||||
|
closable={false}
|
||||||
|
bodyStyle={{ backgroundColor: "#f9f9f9", padding: 0 }}
|
||||||
|
>
|
||||||
|
{/* 编辑/查看合同 */}
|
||||||
|
{
|
||||||
|
showDetail && currentRow !== undefined && <ContractEdit contractId={currentRow?.REGISTERCOMPACT_ID} actionRef={actionRef}
|
||||||
|
setShowDetail={setShowDetail} showDelete={true} type={'check'} ></ContractEdit>
|
||||||
|
}
|
||||||
|
</Drawer>
|
||||||
|
|
||||||
|
{/* 新增经营项目弹出框 */}
|
||||||
|
<ProjectEditor parentTableRef={actionRef} currentRecord={currentRow} modalVisible={modalVisible} handleModalVisible={handleModalVisible} />
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(({ user }: ConnectState) => ({
|
||||||
|
currentUser: user.currentUser
|
||||||
|
}))(ContractAbnormality);
|
||||||
@ -324,6 +324,20 @@ const contractWarningQuery: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
ellipsis: true,
|
ellipsis: true,
|
||||||
initialValue: "1000"
|
initialValue: "1000"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: '合同异常',
|
||||||
|
dataIndex: 'AbnormalContract',
|
||||||
|
valueType: 'select',
|
||||||
|
align: 'center',
|
||||||
|
width: 130,
|
||||||
|
valueEnum: {
|
||||||
|
'0': { text: '正常', status: 'success' },
|
||||||
|
'1': { text: '异常', status: 'error' }
|
||||||
|
},
|
||||||
|
initialValue: "0",
|
||||||
|
ellipsis: true,
|
||||||
|
hideInTable: true
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: '开始日期',
|
title: '开始日期',
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
@ -598,10 +612,11 @@ const contractWarningQuery: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
const searchWholeParams = {
|
const searchWholeParams = {
|
||||||
searchParameter: {
|
searchParameter: {
|
||||||
...params,
|
...params,
|
||||||
COMPACT_STARTDATE: start,
|
COMPACT_STARTDATE: params?.AbnormalContract === '0' ? start : '',
|
||||||
COMPACT_ENDDATE: end,
|
COMPACT_ENDDATE: params?.AbnormalContract === '0' ? end : '',
|
||||||
Due_StartDate: start,
|
Due_StartDate: params?.AbnormalContract === '0' ? start : '',
|
||||||
Due_EndDate: end,
|
Due_EndDate: params?.AbnormalContract === '0' ? end : '',
|
||||||
|
AbnormalContract: params?.AbnormalContract === '0' ? false : true
|
||||||
// COMPACT_TYPE: "340001",
|
// COMPACT_TYPE: "340001",
|
||||||
// COMPACT_DETAILS: "1000"
|
// COMPACT_DETAILS: "1000"
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
import { connect } from "umi";
|
import { connect } from "umi";
|
||||||
import type { ConnectState } from "@/models/connect";
|
import type { ConnectState } from "@/models/connect";
|
||||||
import ProTable, { ActionType } from "@ant-design/pro-table";
|
import ProTable, { ActionType } from "@ant-design/pro-table";
|
||||||
import { useImperativeHandle, useRef, useState } from "react";
|
import { useEffect, useImperativeHandle, useRef, useState } from "react";
|
||||||
import { Button, Col, Divider, FormInstance, Input, InputNumber, Modal, Row, Tooltip } from "antd";
|
import { Button, Col, Divider, FormInstance, Input, InputNumber, Modal, Row, Tooltip } from "antd";
|
||||||
import { handleGetProjectPeriodAccount } from "../../ShopExpenseDetail/service";
|
import { handleGetProjectPeriodAccount } from "../../ShopExpenseDetail/service";
|
||||||
import { wrapTreeNode } from "@/utils/format";
|
import { wrapTreeNode } from "@/utils/format";
|
||||||
@ -10,12 +10,13 @@ import numeral from 'numeral'
|
|||||||
import { handleGetShopRoyaltyList } from "../../comparisonOfBusiness/service";
|
import { handleGetShopRoyaltyList } from "../../comparisonOfBusiness/service";
|
||||||
import moment from 'moment'
|
import moment from 'moment'
|
||||||
import ProForm, { ProFormDigit } from "@ant-design/pro-form";
|
import ProForm, { ProFormDigit } from "@ant-design/pro-form";
|
||||||
|
const { confirm } = Modal;
|
||||||
type DetailProps = {
|
type DetailProps = {
|
||||||
parentRow?: any // 外面的一些行数据
|
parentRow?: any // 外面的一些行数据
|
||||||
onRef?: any // 实例
|
onRef?: any // 实例
|
||||||
|
pageType?: string // 判断是编辑还是查看
|
||||||
}
|
}
|
||||||
const HistoricalProjects = ({ parentRow, onRef }: DetailProps) => {
|
const HistoricalProjects = ({ parentRow, onRef, pageType }: DetailProps) => {
|
||||||
const actionRef = useRef<ActionType>();
|
const actionRef = useRef<ActionType>();
|
||||||
const formRef = useRef<FormInstance>();
|
const formRef = useRef<FormInstance>();
|
||||||
const modalFormRef = useRef<FormInstance>();
|
const modalFormRef = useRef<FormInstance>();
|
||||||
@ -47,6 +48,13 @@ const HistoricalProjects = ({ parentRow, onRef }: DetailProps) => {
|
|||||||
</a>
|
</a>
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>期数</div>,
|
||||||
|
dataIndex: 'BUSSINESS_PERIOD',
|
||||||
|
align: 'center',
|
||||||
|
width: 100,
|
||||||
|
hideInSearch: true,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: <div style={{ textAlign: 'center' }}>结算状态</div>,
|
title: <div style={{ textAlign: 'center' }}>结算状态</div>,
|
||||||
dataIndex: 'IsApplySuccess',
|
dataIndex: 'IsApplySuccess',
|
||||||
@ -61,28 +69,28 @@ const HistoricalProjects = ({ parentRow, onRef }: DetailProps) => {
|
|||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
title: <div style={{ textAlign: 'center' }}>保底/固定租金</div>,
|
title: <div style={{ textAlign: 'center' }}>保底/固定租金</div>,
|
||||||
dataIndex: 'MinturnOver',
|
dataIndex: 'MINTURNOVER',
|
||||||
valueType: 'digit',
|
valueType: 'digit',
|
||||||
align: 'right',
|
align: 'right',
|
||||||
width: 130,
|
width: 130,
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
render: (_, record) => {
|
render: (_, record) => {
|
||||||
const str: string = record?.Remark
|
const str: string = record?.Remark
|
||||||
return record?.MinturnOver ?
|
return record?.MINTURNOVER ?
|
||||||
<Tooltip title={str}>
|
<Tooltip title={str}>
|
||||||
{handleFormatNumber(record?.MinturnOver)}
|
{handleFormatNumber(record?.MINTURNOVER * 10000)}
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
: record?.MinturnOver === 0 ? '0.00' : '-'
|
: record?.MINTURNOVER === 0 ? '0.00' : '-'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: <div style={{ textAlign: 'center' }}>提成比率</div>,
|
title: <div style={{ textAlign: 'center' }}>提成比率</div>,
|
||||||
dataIndex: 'GuaranteeRatio',
|
dataIndex: 'GUARANTEERATIO',
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
align: 'right',
|
align: 'right',
|
||||||
width: 100,
|
width: 100,
|
||||||
render: (_, record) => {
|
render: (_, record) => {
|
||||||
return record?.GuaranteeRatio ? `${record?.GuaranteeRatio}%` : ''
|
return record?.GUARANTEERATIO ? `${record?.GUARANTEERATIO}%` : ''
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
@ -383,6 +391,11 @@ const HistoricalProjects = ({ parentRow, onRef }: DetailProps) => {
|
|||||||
tableData
|
tableData
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
// useEffect(() => {
|
||||||
|
|
||||||
|
// }, [pageType])
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div style={{ boxSizing: 'border-box', paddingBottom: "30px" }}>
|
<div style={{ boxSizing: 'border-box', paddingBottom: "30px" }}>
|
||||||
<ProTable
|
<ProTable
|
||||||
@ -403,6 +416,8 @@ const HistoricalProjects = ({ parentRow, onRef }: DetailProps) => {
|
|||||||
headerTitle={'往期项目'} // 列表表头
|
headerTitle={'往期项目'} // 列表表头
|
||||||
dataSource={tableData}
|
dataSource={tableData}
|
||||||
request={async (params) => {
|
request={async (params) => {
|
||||||
|
console.log('fkdjfksdjfsz', parentRow);
|
||||||
|
|
||||||
const req: any = {
|
const req: any = {
|
||||||
SearchParameter: {
|
SearchParameter: {
|
||||||
BUSINESSPROJECT_ID: parentRow?.BUSINESSPROJECT_ID,
|
BUSINESSPROJECT_ID: parentRow?.BUSINESSPROJECT_ID,
|
||||||
@ -412,42 +427,79 @@ const HistoricalProjects = ({ parentRow, onRef }: DetailProps) => {
|
|||||||
SortStr: 'ENDDATE desc',
|
SortStr: 'ENDDATE desc',
|
||||||
}
|
}
|
||||||
const data = await handleGetShopRoyaltyList(req)
|
const data = await handleGetShopRoyaltyList(req)
|
||||||
console.log('datadatadatadatadata321', data);
|
|
||||||
|
|
||||||
if (data && data.length > 0) {
|
if (data && data.length > 0) {
|
||||||
|
data.forEach((item: any, index: number) => {
|
||||||
|
item.BUSSINESS_PERIOD = `第${data.length - index}期`
|
||||||
|
item.PERIOD_INDEX = data.length - index
|
||||||
|
})
|
||||||
|
|
||||||
let SHOPROYALTY_IDList: any = []
|
let SHOPROYALTY_IDList: any = []
|
||||||
let res = data.filter((item: any) => item.SHOPROYALTY_ID !== 0 && item.SHOPROYALTY_ID !== parentRow?.SHOPROYALTY_ID)
|
let res = data.filter((item: any) => item.SHOPROYALTY_ID !== 0 && item.SHOPROYALTY_ID !== parentRow?.SHOPROYALTY_ID)
|
||||||
console.log('resresresresresresresresres', res);
|
|
||||||
if (res && res.length > 0) {
|
if (res && res.length > 0) {
|
||||||
res.forEach((item: any, index: number) => {
|
res.forEach((item: any, index: number) => {
|
||||||
item.id = index + 1
|
item.id = index + 1
|
||||||
SHOPROYALTY_IDList.push(item.SHOPROYALTY_ID)
|
SHOPROYALTY_IDList.push(item.SHOPROYALTY_ID)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
console.log('SHOPROYALTY_IDListSHOPROYALTY_IDListSHOPROYALTY_IDList', SHOPROYALTY_IDList);
|
|
||||||
|
|
||||||
const req: any = {
|
const req: any = {
|
||||||
BUSINESSPROJECT_ID: parentRow?.BUSINESSPROJECT_ID,
|
BUSINESSPROJECT_ID: parentRow?.BUSINESSPROJECT_ID,
|
||||||
}
|
}
|
||||||
const data2 = await handleGetProjectPeriodAccount(req)
|
const data2 = await handleGetProjectPeriodAccount(req)
|
||||||
console.log('data2data2data2data2data2data2', data2);
|
|
||||||
let list: any = []
|
let list: any = []
|
||||||
if (data2.ProjectPeriodList && data2.ProjectPeriodList.length > 0) {
|
if (data2.ProjectPeriodList && data2.ProjectPeriodList.length > 0) {
|
||||||
list = wrapTreeNode(data2.ProjectPeriodList)
|
list = wrapTreeNode(data2.ProjectPeriodList)
|
||||||
|
list = list.filter((filterItem: any) => filterItem.PeriodIndex !== list.length)
|
||||||
let resultList: any = []
|
let resultList: any = []
|
||||||
if (list && list.length > 0) {
|
if (list && list.length > 0) {
|
||||||
list.forEach((item: any) => {
|
list.forEach((item: any) => {
|
||||||
if (SHOPROYALTY_IDList && SHOPROYALTY_IDList.length > 0 && SHOPROYALTY_IDList.indexOf(item.ShopRoyalty_Id) !== -1) {
|
if (SHOPROYALTY_IDList && SHOPROYALTY_IDList.length > 0 && SHOPROYALTY_IDList.indexOf(item.ShopRoyalty_Id) !== -1) {
|
||||||
resultList.push(item)
|
resultList.push(item)
|
||||||
}
|
}
|
||||||
|
item.STARTDATE = item.StartDate
|
||||||
|
item.ENDDATE = item.EndDate
|
||||||
|
item.BUSSINESS_PERIOD = item.PeriodIndexStr
|
||||||
|
item.MINTURNOVER = item.MinturnOver
|
||||||
|
item.GUARANTEERATIO = item.GuaranteeRatio
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
setTableData(list)
|
||||||
setTableData(res)
|
|
||||||
|
|
||||||
|
if (pageType === 'edit') {
|
||||||
|
confirm({
|
||||||
|
width: 500,
|
||||||
|
content: <div>{'当前处于退场结算阶段，允许录入历史期间的经营数据，以便完成最终对账与清算'}</div>,
|
||||||
|
onOk: async () => {
|
||||||
|
if (list && list.length > 0) {
|
||||||
|
setCurrentRow(list[0])
|
||||||
|
setShowDetail(true)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return { data: list, success: true }
|
||||||
|
} else {
|
||||||
|
|
||||||
|
if (pageType === 'edit') {
|
||||||
|
confirm({
|
||||||
|
width: 500,
|
||||||
|
content: <div>{'当前处于退场结算阶段，允许录入历史期间的经营数据，以便完成最终对账与清算'}</div>,
|
||||||
|
onOk: async () => {
|
||||||
|
if (res && res.length > 0) {
|
||||||
|
setCurrentRow(res[0])
|
||||||
|
setShowDetail(true)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
setTableData(res)
|
||||||
return { data: res, success: true }
|
return { data: res, success: true }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
}
|
||||||
return { data: [], success: true }
|
return { data: [], success: true }
|
||||||
|
|
||||||
|
|
||||||
@ -473,7 +525,7 @@ const HistoricalProjects = ({ parentRow, onRef }: DetailProps) => {
|
|||||||
|
|
||||||
|
|
||||||
<Modal
|
<Modal
|
||||||
title={"往期项目数据录入"}
|
title={currentRow?.BUSSINESS_PERIOD ? `${currentRow?.BUSSINESS_PERIOD}数据录入` : "往期项目数据录入"}
|
||||||
destroyOnClose={true}
|
destroyOnClose={true}
|
||||||
width={1200}
|
width={1200}
|
||||||
bodyStyle={{
|
bodyStyle={{
|
||||||
|
|||||||
@ -2,7 +2,7 @@ import { connect } from "umi";
|
|||||||
import type { ConnectState } from "@/models/connect";
|
import type { ConnectState } from "@/models/connect";
|
||||||
import type { ActionType } from "@ant-design/pro-table";
|
import type { ActionType } from "@ant-design/pro-table";
|
||||||
import ProTable from "@ant-design/pro-table";
|
import ProTable from "@ant-design/pro-table";
|
||||||
import { useImperativeHandle, useRef, useState } from "react";
|
import { useEffect, useImperativeHandle, useRef, useState } from "react";
|
||||||
import type { FormInstance } from "antd";
|
import type { FormInstance } from "antd";
|
||||||
import { Col, Popconfirm, Row, Space, Typography } from "antd";
|
import { Col, Popconfirm, Row, Space, Typography } from "antd";
|
||||||
import { Button, Drawer, message, Modal, Spin, Tooltip, Image } from "antd";
|
import { Button, Drawer, message, Modal, Spin, Tooltip, Image } from "antd";
|
||||||
@ -1971,8 +1971,6 @@ const YearExamineDetailTable = ({ parentRow, currentApprovalstate, onRef, setIsS
|
|||||||
selectDetailList,
|
selectDetailList,
|
||||||
afterCloseData // 如果点击过撤场结算 就会有数据
|
afterCloseData // 如果点击过撤场结算 就会有数据
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
{
|
{
|
||||||
@ -2768,10 +2766,10 @@ const YearExamineDetailTable = ({ parentRow, currentApprovalstate, onRef, setIsS
|
|||||||
|
|
||||||
{/* 判断当期项目 是不是最后一期 是最后一期的话 就显示 历史期的数据 */}
|
{/* 判断当期项目 是不是最后一期 是最后一期的话 就显示 历史期的数据 */}
|
||||||
{/* <HistoricalProjects parentRow={parentRow} /> */}
|
{/* <HistoricalProjects parentRow={parentRow} /> */}
|
||||||
{/* {
|
{
|
||||||
parentRow?.PROJECT_ENDDATE === parentRow?.ENDDATE && parentRow?.SETTLEMENT_STATE > 0 ?
|
parentRow?.PROJECT_ENDDATE && parentRow?.ENDDATE && moment(parentRow?.PROJECT_ENDDATE).format('YYYY-MM-DD') === moment(parentRow?.ENDDATE).format('YYYY-MM-DD') && parentRow?.BUSINESSAPPROVAL_ID > 0 ?
|
||||||
< HistoricalProjects /> : ""
|
<HistoricalProjects parentRow={parentRow} pageType={'search'} /> : ""
|
||||||
} */}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -559,7 +559,13 @@ const AfterSettlement = ({ parentRow, dataRef, onShow, setIsFinishCalibration, o
|
|||||||
dataSource={tableData}
|
dataSource={tableData}
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
{/* <HistoricalProjects parentRow={parentRow} onRef={HistoricalProjectsRef} /> */}
|
|
||||||
|
{
|
||||||
|
parentRow?.PROJECT_ENDDATE && parentRow?.ENDDATE && moment(parentRow?.PROJECT_ENDDATE).format('YYYY-MM-DD') === moment(parentRow?.ENDDATE).format('YYYY-MM-DD') ?
|
||||||
|
<HistoricalProjects parentRow={parentRow} onRef={HistoricalProjectsRef} pageType={'edit'} />
|
||||||
|
: ""
|
||||||
|
}
|
||||||
|
|
||||||
<>
|
<>
|
||||||
{
|
{
|
||||||
tableLoading ? '' :
|
tableLoading ? '' :
|
||||||
|
|||||||
@ -398,7 +398,7 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
await handlePreviousPeriod(data.Result_Data.BUSINESSAPPROVAL_ID)
|
||||||
message.success(data.Result_Desc)
|
message.success(data.Result_Desc)
|
||||||
setOnShow(false)
|
setOnShow(false)
|
||||||
setParentRow(undefined)
|
setParentRow(undefined)
|
||||||
@ -416,16 +416,16 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 往期项目存一下
|
// 往期项目存一下
|
||||||
const handlePreviousPeriod = async () => {
|
const handlePreviousPeriod = async (BUSINESSAPPROVAL_ID: any) => {
|
||||||
|
// 这次年度结算的 业务id
|
||||||
let historyList: any = AfterSettlementRef.current?.HistoricalProjectsRef.current
|
let historyList: any = AfterSettlementRef.current?.HistoricalProjectsRef.current
|
||||||
console.log('historyListhistoryListhistoryList', historyList);
|
console.log('historyListhistoryListhistoryList', historyList);
|
||||||
console.log('parentRowparentRowparentRowparentRow', parentRow);
|
console.log('parentRowparentRowparentRowparentRow', parentRow);
|
||||||
|
|
||||||
const req: any = []
|
const req: any = []
|
||||||
if (historyList && historyList.length > 0) {
|
if (historyList.tableData && historyList.tableData.length > 0) {
|
||||||
historyList.forEach((item: any) => {
|
historyList.tableData.forEach((item: any) => {
|
||||||
req.push({
|
req.push({
|
||||||
node: {
|
|
||||||
BUSINESSPROJECT_ID: item.BUSINESSPROJECT_ID,
|
BUSINESSPROJECT_ID: item.BUSINESSPROJECT_ID,
|
||||||
BUSINESSPROJECT_NAME: parentRow?.BUSINESSPROJECT_NAME,
|
BUSINESSPROJECT_NAME: parentRow?.BUSINESSPROJECT_NAME,
|
||||||
SHOPROYALTY_ID: item.SHOPROYALTY_ID,
|
SHOPROYALTY_ID: item.SHOPROYALTY_ID,
|
||||||
@ -433,12 +433,12 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
|
|||||||
BUSINESS_TRADE: "", // 经营业态
|
BUSINESS_TRADE: "", // 经营业态
|
||||||
BUSINESS_BRAND: "",// 经营品牌
|
BUSINESS_BRAND: "",// 经营品牌
|
||||||
BUSINESS_MONTH: "",// 经营年月
|
BUSINESS_MONTH: "",// 经营年月
|
||||||
BUSINESS_STARTDATE: "",// 开始日期
|
BUSINESS_STARTDATE: item.STARTDATE ? moment(item.STARTDATE).format('YYYY-MM-DD') : "",// 开始日期
|
||||||
BUSINESS_ENDDATE: "",// 结束日期
|
BUSINESS_ENDDATE: item.ENDDATE ? moment(item.ENDDATE).format('YYYY-MM-DD') : "",// 结束日期
|
||||||
BUSINESS_PERIOD: "",// 经营期数
|
BUSINESS_PERIOD: item.BUSSINESS_PERIOD,// 经营期数
|
||||||
PERIOD_INDEX: "",// 第几期
|
PERIOD_INDEX: item.PERIOD_INDEX,// 第几期
|
||||||
BUSINESS_DAYS: "",// 拆分天数
|
BUSINESS_DAYS: item.NATUREDAY,// 拆分天数
|
||||||
GUARANTEE_AMOUNT: "",// 保底营业额
|
GUARANTEE_AMOUNT: item.MINTURNOVER * 10000,// 保底营业额
|
||||||
GUARANTEERATIO: item.GUARANTEERATIO,
|
GUARANTEERATIO: item.GUARANTEERATIO,
|
||||||
ACTUAL_REVENUE: item.RevenueAmount, // 实际营业额 营业额小计
|
ACTUAL_REVENUE: item.RevenueAmount, // 实际营业额 营业额小计
|
||||||
CORRECT_AMOUNT: "",// 冲正金额
|
CORRECT_AMOUNT: "",// 冲正金额
|
||||||
@ -456,19 +456,20 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
|
|||||||
HOUSERENT: item.HouseRent,
|
HOUSERENT: item.HouseRent,
|
||||||
BREACHPENALTY: item.BreachPenalty,
|
BREACHPENALTY: item.BreachPenalty,
|
||||||
ELECTRICITYCHARGE: item.ElectricityCharge,
|
ELECTRICITYCHARGE: item.ElectricityCharge,
|
||||||
WATERCHARGE: item.WATERCHARGE,
|
WATERCHARGE: item.WaterCharge,
|
||||||
OTHERFEE: item.OtherFee,
|
OTHERFEE: item.OtherFee,
|
||||||
PAID_AMOUNT: item.PaidFee,
|
PAID_AMOUNT: item.PaidFee,
|
||||||
EARLY_SETTLEMENT: 1,
|
EARLY_SETTLEMENT: 1,
|
||||||
REVENUE_VALID: 1,
|
REVENUE_VALID: 0,
|
||||||
REVENUECONFIRM_DESC: `9010:${item.PaidFee_9010},9020:${item.PaidFee_9020},9030:${item.PaidFee_9030},9050:${item.PaidFee_9050},9090:${item.PaidFee_9090},9099:${item.PaidFee_9099}`,
|
REVENUECONFIRM_DESC: `9010:${item.PaidFee_9010},9020:${item.PaidFee_9020},9030:${item.PaidFee_9030},9050:${item.PaidFee_9050},9090:${item.PaidFee_9090},9099:${item.PaidFee_9099}`,
|
||||||
MERCHANTS_ID: item.MERCHANTS_ID,
|
MERCHANTS_ID: item.MERCHANTS_ID,
|
||||||
MERCHANTS_NAME: parentRow?.MERCHANTS_ID,
|
MERCHANTS_NAME: parentRow?.MERCHANTS_ID,
|
||||||
BUSINESSAPPROVAL_ID: "",
|
BUSINESSAPPROVAL_ID: BUSINESSAPPROVAL_ID,
|
||||||
}
|
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
console.log('dajidasjodreq', req);
|
||||||
|
|
||||||
// 营业额小计 业主收款 应收费用合计 租金 水费 电费 住宿费 物业费 租金 其他 退补款
|
// 营业额小计 业主收款 应收费用合计 租金 水费 电费 住宿费 物业费 租金 其他 退补款
|
||||||
const data = await handleSynchroRevenueConfirmList(req)
|
const data = await handleSynchroRevenueConfirmList(req)
|
||||||
console.log('datadatadatadata', data);
|
console.log('datadatadatadata', data);
|
||||||
@ -685,8 +686,8 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
|
|||||||
}
|
}
|
||||||
</>
|
</>
|
||||||
|
|
||||||
{/*
|
|
||||||
<Button type="primary" style={{ marginLeft: '8px' }} onClick={() => {
|
{/* <Button type="primary" style={{ marginLeft: '8px' }} onClick={() => {
|
||||||
// || currentUser?.ID === 2785
|
// || currentUser?.ID === 2785
|
||||||
setShowSettlementDrawer(true)
|
setShowSettlementDrawer(true)
|
||||||
}}>年度结算</Button> */}
|
}}>年度结算</Button> */}
|
||||||
@ -753,6 +754,7 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
|
|||||||
title={'确认发起结算？'}
|
title={'确认发起结算？'}
|
||||||
onConfirm={() => {
|
onConfirm={() => {
|
||||||
|
|
||||||
|
console.log('parentRowparentRowparentRow', parentRow);
|
||||||
|
|
||||||
// handleCreateSettlementApplication()
|
// handleCreateSettlementApplication()
|
||||||
// return
|
// return
|
||||||
@ -764,9 +766,21 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (res) {
|
if (res) {
|
||||||
|
if (parentRow?.PROJECT_ENDDATE && parentRow?.ENDDATE && moment(parentRow?.PROJECT_ENDDATE).format('YYYY-MM-DD') === moment(parentRow?.ENDDATE).format('YYYY-MM-DD')) {
|
||||||
|
confirm({
|
||||||
|
width: 500,
|
||||||
|
content: <div>{'本次提交将一并提交往期结算数据，请确认所有往期数据无误后再操作'}</div>,
|
||||||
|
onOk: async () => {
|
||||||
handleCreateSettlementApplication()
|
handleCreateSettlementApplication()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
} else {
|
||||||
|
handleCreateSettlementApplication()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}).catch(error => {
|
||||||
|
message.warning('请检查填写是否完整！');
|
||||||
|
});
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Button loading={submitBtnLoading} type={'primary'}>确认结算</Button>
|
<Button loading={submitBtnLoading} type={'primary'}>确认结算</Button>
|
||||||
|
|||||||
@ -24,7 +24,7 @@ export async function handleCreateSettlement(params?: any) {
|
|||||||
|
|
||||||
// 上传退场结算应收拆分数据
|
// 上传退场结算应收拆分数据
|
||||||
export async function handleSynchroRevenueConfirmList(params?: any) {
|
export async function handleSynchroRevenueConfirmList(params?: any) {
|
||||||
const data = await request(`/BusinessProject/SynchroRevenueConfirmList`, {
|
const data = await request(`/BusinessProject/UploadRevenueConfirmList`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
data: params
|
data: params
|
||||||
});
|
});
|
||||||
|
|||||||
@ -0,0 +1,443 @@
|
|||||||
|
.ActiveMemberStatisticsMain {
|
||||||
|
width: 100%;
|
||||||
|
height: calc(100vh - 150px);
|
||||||
|
background: #FFFFFF;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsTop {
|
||||||
|
width: 100%;
|
||||||
|
background: #FFFFFF;
|
||||||
|
// box-shadow: 0px 0px 6px 0px rgba(31, 48, 95, 0.2);
|
||||||
|
// border-radius: 4px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsTitleBox {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-between;
|
||||||
|
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #757575;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsTitleSelect {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsTitleSelect::after {
|
||||||
|
content: "";
|
||||||
|
width: 4px;
|
||||||
|
height: 18px;
|
||||||
|
background: #1492FF;
|
||||||
|
border-radius: 2px;
|
||||||
|
position: absolute;
|
||||||
|
left: -12px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsContentBox {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 16px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
// .ActiveMemberStatisticsItemFirst {
|
||||||
|
// width: 280px;
|
||||||
|
// height: 180px;
|
||||||
|
// background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// box-sizing: border-box;
|
||||||
|
// padding: 26px 39px;
|
||||||
|
// margin-right: 16px;
|
||||||
|
|
||||||
|
// .firstItemTitle {
|
||||||
|
// font-family: PingFangSC, PingFang SC;
|
||||||
|
// font-weight: 500;
|
||||||
|
// font-size: 18px;
|
||||||
|
// color: #FFFFFF;
|
||||||
|
// line-height: 13px;
|
||||||
|
// text-align: left;
|
||||||
|
// font-style: normal;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .firstItemValue {
|
||||||
|
// font-family: DINAlternate, DINAlternate;
|
||||||
|
// font-weight: bold;
|
||||||
|
// font-size: 28px;
|
||||||
|
// color: #FFFFFF;
|
||||||
|
// line-height: 32px;
|
||||||
|
// text-align: left;
|
||||||
|
// font-style: normal;
|
||||||
|
// margin-top: 12px;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsItemOther {
|
||||||
|
width: 100%;
|
||||||
|
height: 180px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsOtherItem {
|
||||||
|
width: calc((100% - 112px) / 7);
|
||||||
|
height: 100%;
|
||||||
|
background: #F6F9FF;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 20px 24px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
height: 36px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #1492FF;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 4px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
|
||||||
|
|
||||||
|
.addIcon {
|
||||||
|
width: 7px;
|
||||||
|
height: 10px;
|
||||||
|
margin-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// .otherBgIcon {
|
||||||
|
// width: 76px;
|
||||||
|
// height: 51px;
|
||||||
|
// position: absolute;
|
||||||
|
// top: 29px;
|
||||||
|
// right: 4px;
|
||||||
|
// background-image: url(../../../assets/detail/otherBgIcon.png);
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsOtherItemSelect {
|
||||||
|
background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsBottom {
|
||||||
|
width: 100%;
|
||||||
|
// margin-top: 16px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #FFFFFF;
|
||||||
|
// box-shadow: 0px 0px 6px 0px rgba(31, 48, 95, 0.2);
|
||||||
|
// border-radius: 4px;
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsTitleBox {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsTitle::after {
|
||||||
|
content: "";
|
||||||
|
width: 4px;
|
||||||
|
height: 18px;
|
||||||
|
background: #1492FF;
|
||||||
|
border-radius: 2px;
|
||||||
|
position: absolute;
|
||||||
|
left: -12px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsContentBox {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 16px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsItemOther {
|
||||||
|
width: 100%;
|
||||||
|
height: 180px;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-between;
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsOtherItem {
|
||||||
|
width: calc((100% - 112px) / 7);
|
||||||
|
height: 100%;
|
||||||
|
background: #F6F9FF;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 29px 24px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-right: 16px;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
height: 36px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #1492FF;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
|
||||||
|
.otherItemValueUnit {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
|
||||||
|
|
||||||
|
.addIcon {
|
||||||
|
width: 7px;
|
||||||
|
height: 10px;
|
||||||
|
margin-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// .otherBgIcon {
|
||||||
|
// width: 76px;
|
||||||
|
// height: 51px;
|
||||||
|
// position: absolute;
|
||||||
|
// top: 29px;
|
||||||
|
// right: 4px;
|
||||||
|
// background-image: url(../../../assets/detail/otherBgIcon.png);
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
.ActiveMemberStatisticsOtherItemSelect {
|
||||||
|
background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
|
||||||
|
.otherItemValueUnit {
|
||||||
|
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 20px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
273
src/pages/travelMember/ActiveMemberStatistics/index.tsx
Normal file
273
src/pages/travelMember/ActiveMemberStatistics/index.tsx
Normal file
@ -0,0 +1,273 @@
|
|||||||
|
// 活跃会员统计
|
||||||
|
import { connect, CurrentUser } from "umi";
|
||||||
|
import { ConnectState } from "@/models/connect";
|
||||||
|
import { useEffect, useRef, useState } from "react";
|
||||||
|
import { Button, Col, Drawer, FormInstance, Row, Spin } from "antd";
|
||||||
|
import ProForm, { ProFormDateRangePicker, ProFormSelect } from "@ant-design/pro-form";
|
||||||
|
import './ActiveMemberStatistics.less'
|
||||||
|
import { handeGetMembershipCount } from "../service";
|
||||||
|
import session from "@/utils/session";
|
||||||
|
import ProTable, { ActionType } from "@ant-design/pro-table";
|
||||||
|
import MemberInfor from "../memberInfor";
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
|
const ActiveMemberStatistics: React.FC<{ currentUser: CurrentUser | undefined }> = (props) => {
|
||||||
|
const { currentUser } = props
|
||||||
|
const formRef = useRef<FormInstance>();
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
|
||||||
|
// 选择的tab
|
||||||
|
const [selectPageTab, setSelectPageTab] = useState<any>(1)
|
||||||
|
// 会员类型数据
|
||||||
|
const [membershipType, setMembershipType] = useState<any>()
|
||||||
|
// 会员数量
|
||||||
|
const [memberShipTotal, setMemberShipTotal] = useState<number>(1)
|
||||||
|
// 会员等级数据
|
||||||
|
const [revenueList, setRevenueList] = useState<any>()
|
||||||
|
// 显示详情抽屉
|
||||||
|
const [showDetail, setShowDetail] = useState<boolean>(false)
|
||||||
|
const [currentRow, setCurrentRow] = useState<any>()
|
||||||
|
// 抽屉显示的标题
|
||||||
|
const [currentDrawerTitle, setCurrentDrawerTitle] = useState<string>()
|
||||||
|
// 1 是 会员类型 2是 会员等级
|
||||||
|
const [searchType, setSearchType] = useState<any>()
|
||||||
|
// 对应的枚举类型
|
||||||
|
const [valueType, setValueType] = useState<any>()
|
||||||
|
// 显示加载效果
|
||||||
|
const [showLoading, setShowLoading] = useState<boolean>(false)
|
||||||
|
|
||||||
|
let MEMBERSHIPLEVELYNObj = session.get('MEMBERSHIPLEVELYNObj')
|
||||||
|
let MEMBERSHIPLEVELYNList = session.get('MEMBERSHIPLEVELYNList')
|
||||||
|
let MEMBERSHIPTYPEYNObj = session.get('MEMBERSHIPTYPEYNObj')
|
||||||
|
let MEMBERSHIPTYPEYNList = session.get('MEMBERSHIPTYPEYNList')
|
||||||
|
|
||||||
|
|
||||||
|
const handleGetData = async (formData?: any) => {
|
||||||
|
console.log('formDataformDataformData', formData);
|
||||||
|
let [start, end] = ['', '']
|
||||||
|
if (formData && formData?.searchTime) {
|
||||||
|
[start, end] = formData.searchTime
|
||||||
|
}
|
||||||
|
|
||||||
|
const req: any = {
|
||||||
|
CalcType: 4, // 活跃会员
|
||||||
|
OwnerUnitId: currentUser?.OwnerUnitId,
|
||||||
|
ExcludeTest: formData ? formData?.ExcludeTest === 1 ? true : false : true,
|
||||||
|
StartDate: start ? start : "",
|
||||||
|
EndDate: end ? end : "",
|
||||||
|
MembershipType: formData?.MembershipType || "",
|
||||||
|
// MembershipLevel: formData?.MembershipLevel || "",
|
||||||
|
MembershipLevel: "",
|
||||||
|
}
|
||||||
|
|
||||||
|
setShowLoading(true)
|
||||||
|
const data = await handeGetMembershipCount(req)
|
||||||
|
setShowLoading(false)
|
||||||
|
console.log('datadatadatadata', data);
|
||||||
|
|
||||||
|
setMembershipType(data.List)
|
||||||
|
setMemberShipTotal(data.OtherData)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 点击事件
|
||||||
|
const handleShowTableData = async (type: number, memberType: any) => {
|
||||||
|
// type 1 的话是 会员类型 2 的话是 会员等级 memberType 对应的枚举值
|
||||||
|
setCurrentDrawerTitle(`${type === 1 ? '会员类型' : type === 2 ? '会员等级' : ''}【${type === 1 ? MEMBERSHIPTYPEYNObj && memberType ? MEMBERSHIPTYPEYNObj[memberType] : '' : type === 2 ? MEMBERSHIPLEVELYNObj && memberType ? MEMBERSHIPLEVELYNObj[memberType] : '' : ''}】`)
|
||||||
|
setSearchType(type)
|
||||||
|
setValueType(memberType)
|
||||||
|
setShowDetail(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
handleGetData()
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="ActiveMemberStatisticsMain">
|
||||||
|
{
|
||||||
|
showLoading ?
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
background: 'rgba(0,0,0,0.1)',
|
||||||
|
position: 'absolute',
|
||||||
|
zIndex: 5,
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
padding: '15px 20px 10px',
|
||||||
|
background: '#fff',
|
||||||
|
borderRadius: '8px',
|
||||||
|
width: '200px'
|
||||||
|
}}>
|
||||||
|
<Spin />
|
||||||
|
<span style={{ marginLeft: '5px' }}>加载中...</span>
|
||||||
|
</div>
|
||||||
|
</div> : ''
|
||||||
|
}
|
||||||
|
|
||||||
|
<div className="ActiveMemberStatisticsTop">
|
||||||
|
{/* <div className="ActiveMemberStatisticsTitleBox">
|
||||||
|
<div className={selectPageTab === 1 ? 'ActiveMemberStatisticsTitle ActiveMemberStatisticsTitleSelect' : 'ActiveMemberStatisticsTitle'} onClick={() => {
|
||||||
|
setSelectPageTab(1)
|
||||||
|
}}>会员类型</div>
|
||||||
|
<div style={{ marginLeft: '48px' }} className={selectPageTab === 2 ? 'ActiveMemberStatisticsTitle ActiveMemberStatisticsTitleSelect' : 'ActiveMemberStatisticsTitle'} onClick={() => {
|
||||||
|
setSelectPageTab(2)
|
||||||
|
}}>会员等级</div>
|
||||||
|
</div> */}
|
||||||
|
<ProForm
|
||||||
|
layout={'horizontal'}
|
||||||
|
formRef={formRef}
|
||||||
|
submitter={false}
|
||||||
|
onFinish={async (values: any) => {
|
||||||
|
console.log('valuesvaluesvaluesvalues', values);
|
||||||
|
handleGetData(values)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Row gutter={16} style={{ marginTop: "16px" }}>
|
||||||
|
<Col span={6}>
|
||||||
|
<ProFormDateRangePicker
|
||||||
|
label={"查询时间"}
|
||||||
|
name={"searchTime"}
|
||||||
|
// initialValue={[moment().startOf('M').format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')]}
|
||||||
|
initialValue={[moment().startOf('M'), moment()]}
|
||||||
|
fieldProps={{
|
||||||
|
ranges: {
|
||||||
|
"本月": [moment().startOf('M'), moment()],
|
||||||
|
"上月": [moment().subtract(1, 'M').startOf('M'), moment().subtract(1, 'M').endOf('M')],
|
||||||
|
"近三月": [moment().subtract(3, 'M').startOf('M'), moment().endOf('M')],
|
||||||
|
"近半年": [moment().subtract(6, 'M').startOf('M'), moment().endOf('M')],
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
<Col span={6}>
|
||||||
|
<ProFormSelect
|
||||||
|
label={"会员类型"}
|
||||||
|
name={"MembershipType"}
|
||||||
|
options={MEMBERSHIPTYPEYNList}
|
||||||
|
/>
|
||||||
|
|
||||||
|
</Col>
|
||||||
|
{/* <Col span={6}>
|
||||||
|
<ProFormSelect
|
||||||
|
label={"会员等级"}
|
||||||
|
name={"MembershipLevel"}
|
||||||
|
options={MEMBERSHIPLEVELYNList}
|
||||||
|
/>
|
||||||
|
</Col> */}
|
||||||
|
<Col span={6}>
|
||||||
|
|
||||||
|
<ProFormSelect
|
||||||
|
label={"是否排除测试会员"}
|
||||||
|
name={"ExcludeTest"}
|
||||||
|
options={[{ label: '是', value: 1 }, { label: '否', value: 0 }]}
|
||||||
|
initialValue={1}
|
||||||
|
/>
|
||||||
|
|
||||||
|
</Col>
|
||||||
|
{/* <Col span={18}></Col> */}
|
||||||
|
<Col span={6}>
|
||||||
|
<div style={{ display: 'flex', justifyContent: 'flex-end' }}>
|
||||||
|
<Button style={{ marginRight: '8px' }} onClick={() => {
|
||||||
|
formRef.current?.resetFields()
|
||||||
|
}}>重置</Button>
|
||||||
|
<Button type={"primary"} onClick={() => {
|
||||||
|
formRef.current?.submit()
|
||||||
|
}}>查询</Button>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</ProForm>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div className="ActiveMemberStatisticsBottom">
|
||||||
|
{
|
||||||
|
membershipType && membershipType.length > 0 ?
|
||||||
|
<>
|
||||||
|
<div className="ActiveMemberStatisticsTitleBox">
|
||||||
|
<div className="ActiveMemberStatisticsTitle">会员类型{memberShipTotal ? `（${memberShipTotal}人）` : ""}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="ActiveMemberStatisticsContentBox">
|
||||||
|
<div className="ActiveMemberStatisticsItemOther">
|
||||||
|
{
|
||||||
|
membershipType.map((item: any) => {
|
||||||
|
return <div className="ActiveMemberStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">{item.label === '0' ? '未授权用户' : MEMBERSHIPLEVELYNObj && item.label ? MEMBERSHIPLEVELYNObj[item.label] : ''}</div>
|
||||||
|
<div className="otherItemValue">{item.value}<span className="otherItemValueUnit">人</span></div>
|
||||||
|
<div className="addLabel">占比</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
<span className="addValue">{item.key ? item.key + '%' : ""}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
: ""
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="ActiveMemberStatisticsBottom">
|
||||||
|
{
|
||||||
|
revenueList && revenueList.length > 0 ?
|
||||||
|
<>
|
||||||
|
<div className="ActiveMemberStatisticsTitleBox">
|
||||||
|
<div className="ActiveMemberStatisticsTitle">营销活动</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="ActiveMemberStatisticsContentBox">
|
||||||
|
<div className="ActiveMemberStatisticsItemOther">
|
||||||
|
{
|
||||||
|
revenueList.map((item: any) => {
|
||||||
|
return <div className="ActiveMemberStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">{item.label}</div>
|
||||||
|
<div className="otherItemValue">{item.value}<span className="otherItemValueUnit">人</span></div>
|
||||||
|
<div className="addLabel">占比</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
<span className="addValue">{item.key ? item.key + '%' : ""}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
: ""
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<Drawer
|
||||||
|
width={'80%'}
|
||||||
|
title={currentDrawerTitle || ""}
|
||||||
|
visible={showDetail}
|
||||||
|
destroyOnClose
|
||||||
|
closable={false}
|
||||||
|
onClose={() => {
|
||||||
|
setSearchType(null)
|
||||||
|
setValueType(null)
|
||||||
|
setShowDetail(false)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<MemberInfor searchType={searchType} valueType={valueType} isComponent={true} />
|
||||||
|
</Drawer>
|
||||||
|
</div >
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(({ user }: ConnectState) => ({
|
||||||
|
currentUser: user.currentUser
|
||||||
|
}))(ActiveMemberStatistics);
|
||||||
@ -0,0 +1,444 @@
|
|||||||
|
.BusinessActivityStatisticsMain {
|
||||||
|
width: 100%;
|
||||||
|
height: calc(100vh - 150px);
|
||||||
|
background: #FFFFFF;
|
||||||
|
position: relative;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsTop {
|
||||||
|
width: 100%;
|
||||||
|
background: #FFFFFF;
|
||||||
|
// box-shadow: 0px 0px 6px 0px rgba(31, 48, 95, 0.2);
|
||||||
|
// border-radius: 4px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsTitleBox {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-between;
|
||||||
|
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #757575;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsTitleSelect {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsTitleSelect::after {
|
||||||
|
content: "";
|
||||||
|
width: 4px;
|
||||||
|
height: 18px;
|
||||||
|
background: #1492FF;
|
||||||
|
border-radius: 2px;
|
||||||
|
position: absolute;
|
||||||
|
left: -12px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsContentBox {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 16px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
// .BusinessActivityStatisticsItemFirst {
|
||||||
|
// width: 280px;
|
||||||
|
// height: 180px;
|
||||||
|
// background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// box-sizing: border-box;
|
||||||
|
// padding: 26px 39px;
|
||||||
|
// margin-right: 16px;
|
||||||
|
|
||||||
|
// .firstItemTitle {
|
||||||
|
// font-family: PingFangSC, PingFang SC;
|
||||||
|
// font-weight: 500;
|
||||||
|
// font-size: 18px;
|
||||||
|
// color: #FFFFFF;
|
||||||
|
// line-height: 13px;
|
||||||
|
// text-align: left;
|
||||||
|
// font-style: normal;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .firstItemValue {
|
||||||
|
// font-family: DINAlternate, DINAlternate;
|
||||||
|
// font-weight: bold;
|
||||||
|
// font-size: 28px;
|
||||||
|
// color: #FFFFFF;
|
||||||
|
// line-height: 32px;
|
||||||
|
// text-align: left;
|
||||||
|
// font-style: normal;
|
||||||
|
// margin-top: 12px;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsItemOther {
|
||||||
|
width: 100%;
|
||||||
|
height: 180px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsOtherItem {
|
||||||
|
width: calc((100% - 112px) / 7);
|
||||||
|
height: 100%;
|
||||||
|
background: #F6F9FF;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 20px 24px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
height: 36px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #1492FF;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 4px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
|
||||||
|
|
||||||
|
.addIcon {
|
||||||
|
width: 7px;
|
||||||
|
height: 10px;
|
||||||
|
margin-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// .otherBgIcon {
|
||||||
|
// width: 76px;
|
||||||
|
// height: 51px;
|
||||||
|
// position: absolute;
|
||||||
|
// top: 29px;
|
||||||
|
// right: 4px;
|
||||||
|
// background-image: url(../../../assets/detail/otherBgIcon.png);
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsOtherItemSelect {
|
||||||
|
background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsBottom {
|
||||||
|
width: 100%;
|
||||||
|
// margin-top: 16px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #FFFFFF;
|
||||||
|
// box-shadow: 0px 0px 6px 0px rgba(31, 48, 95, 0.2);
|
||||||
|
// border-radius: 4px;
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsTitleBox {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsTitle::after {
|
||||||
|
content: "";
|
||||||
|
width: 4px;
|
||||||
|
height: 18px;
|
||||||
|
background: #1492FF;
|
||||||
|
border-radius: 2px;
|
||||||
|
position: absolute;
|
||||||
|
left: -12px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsContentBox {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 16px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsItemOther {
|
||||||
|
width: 100%;
|
||||||
|
height: 180px;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-between;
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsOtherItem {
|
||||||
|
width: calc((100% - 112px) / 7);
|
||||||
|
height: 100%;
|
||||||
|
background: #F6F9FF;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 29px 24px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-right: 16px;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
height: 36px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #1492FF;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
|
||||||
|
.otherItemValueUnit {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
|
||||||
|
|
||||||
|
.addIcon {
|
||||||
|
width: 7px;
|
||||||
|
height: 10px;
|
||||||
|
margin-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// .otherBgIcon {
|
||||||
|
// width: 76px;
|
||||||
|
// height: 51px;
|
||||||
|
// position: absolute;
|
||||||
|
// top: 29px;
|
||||||
|
// right: 4px;
|
||||||
|
// background-image: url(../../../assets/detail/otherBgIcon.png);
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
.BusinessActivityStatisticsOtherItemSelect {
|
||||||
|
background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
|
||||||
|
.otherItemValueUnit {
|
||||||
|
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 20px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
477
src/pages/travelMember/BusinessActivityStatistics/index.tsx
Normal file
477
src/pages/travelMember/BusinessActivityStatistics/index.tsx
Normal file
@ -0,0 +1,477 @@
|
|||||||
|
// 运营活动统计
|
||||||
|
import { connect, CurrentUser } from "umi";
|
||||||
|
import { ConnectState } from "@/models/connect";
|
||||||
|
import { useEffect, useRef, useState } from "react";
|
||||||
|
import { Button, Col, Drawer, FormInstance, Row, Spin, Tooltip } from "antd";
|
||||||
|
import ProForm, { ProFormDateRangePicker, ProFormSelect } from "@ant-design/pro-form";
|
||||||
|
import './BusinessActivityStatistics.less'
|
||||||
|
import { handeGetMarketingSummary, handeGetMembershipCount } from "../service";
|
||||||
|
import session from "@/utils/session";
|
||||||
|
import ProTable, { ActionType } from "@ant-design/pro-table";
|
||||||
|
import MemberInfor from "../memberInfor";
|
||||||
|
import moment from 'moment'
|
||||||
|
import addIcon from '@/assets/detail/addIcon.png'
|
||||||
|
import reduceIcon from '@/assets/detail/reduceIcon.png'
|
||||||
|
|
||||||
|
const BusinessActivityStatistics: React.FC<{ currentUser: CurrentUser | undefined }> = (props) => {
|
||||||
|
const { currentUser } = props
|
||||||
|
const formRef = useRef<FormInstance>();
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
|
||||||
|
// 选择的tab
|
||||||
|
const [selectPageTab, setSelectPageTab] = useState<any>(1)
|
||||||
|
// 会员类型数据
|
||||||
|
const [membershipType, setMembershipType] = useState<any>()
|
||||||
|
// 活动总数
|
||||||
|
const [activityTotal, setActivityTotal] = useState<number>()
|
||||||
|
// 会员等级数据
|
||||||
|
const [revenueList, setRevenueList] = useState<any>()
|
||||||
|
// 营收合计
|
||||||
|
const [revenueTotal, setRevenueTotal] = useState<number>()
|
||||||
|
// 显示详情抽屉
|
||||||
|
const [showDetail, setShowDetail] = useState<boolean>(false)
|
||||||
|
const [currentRow, setCurrentRow] = useState<any>()
|
||||||
|
// 抽屉显示的标题
|
||||||
|
const [currentDrawerTitle, setCurrentDrawerTitle] = useState<string>()
|
||||||
|
// 1 是 会员类型 2是 会员等级
|
||||||
|
const [searchType, setSearchType] = useState<any>()
|
||||||
|
// 对应的枚举类型
|
||||||
|
const [valueType, setValueType] = useState<any>()
|
||||||
|
// 显示加载效果
|
||||||
|
const [showLoading, setShowLoading] = useState<boolean>(false)
|
||||||
|
|
||||||
|
let MEMBERSHIPLEVELYNObj = session.get('MEMBERSHIPLEVELYNObj')
|
||||||
|
let MEMBERSHIPLEVELYNList = session.get('MEMBERSHIPLEVELYNList')
|
||||||
|
let MEMBERSHIPTYPEYNObj = session.get('MEMBERSHIPTYPEYNObj')
|
||||||
|
let MEMBERSHIPTYPEYNList = session.get('MEMBERSHIPTYPEYNList')
|
||||||
|
|
||||||
|
|
||||||
|
const handleGetData = async (formData?: any) => {
|
||||||
|
console.log('formDataformDataformData', formData);
|
||||||
|
let [start, end] = ['', '']
|
||||||
|
if (formData && formData?.searchTime) {
|
||||||
|
[start, end] = formData.searchTime
|
||||||
|
}
|
||||||
|
|
||||||
|
const req: any = {
|
||||||
|
CalcType: 3, // 拉新
|
||||||
|
OwnerUnitId: currentUser?.OwnerUnitId,
|
||||||
|
ExcludeTest: formData ? formData?.ExcludeTest === 1 ? true : false : true,
|
||||||
|
StartDate: start ? start : "",
|
||||||
|
EndDate: end ? end : "",
|
||||||
|
MembershipType: formData?.MembershipType || "",
|
||||||
|
MembershipLevel: formData?.MembershipLevel || "",
|
||||||
|
}
|
||||||
|
|
||||||
|
const req2: any = {
|
||||||
|
OwnerUnitId: currentUser?.OwnerUnitId,
|
||||||
|
StartDate: start ? start : "",
|
||||||
|
EndDate: end ? end : "",
|
||||||
|
SalebillType: "",
|
||||||
|
MembershipType: formData?.MembershipType || "",
|
||||||
|
MembershipLevel: formData?.MembershipLevel || "",
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
setShowLoading(true)
|
||||||
|
const data = await handeGetMembershipCount(req)
|
||||||
|
const data2 = await handeGetMarketingSummary(req2)
|
||||||
|
setShowLoading(false)
|
||||||
|
console.log('datadatadatadata', data);
|
||||||
|
|
||||||
|
setMembershipType(data.List)
|
||||||
|
setActivityTotal(data.OtherData)
|
||||||
|
setRevenueList(data2.List)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 点击事件
|
||||||
|
const handleShowTableData = async (type: number, memberType: any) => {
|
||||||
|
// type 1 的话是 会员类型 2 的话是 会员等级 memberType 对应的枚举值
|
||||||
|
setCurrentDrawerTitle(`${type === 1 ? '会员类型' : type === 2 ? '会员等级' : ''}【${type === 1 ? MEMBERSHIPTYPEYNObj && memberType ? MEMBERSHIPTYPEYNObj[memberType] : '' : type === 2 ? MEMBERSHIPLEVELYNObj && memberType ? MEMBERSHIPLEVELYNObj[memberType] : '' : ''}】`)
|
||||||
|
setSearchType(type)
|
||||||
|
setValueType(memberType)
|
||||||
|
setShowDetail(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
handleGetData({ searchTime: [moment().startOf('M').format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')] })
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="BusinessActivityStatisticsMain">
|
||||||
|
{
|
||||||
|
showLoading ?
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
background: 'rgba(0,0,0,0.1)',
|
||||||
|
position: 'absolute',
|
||||||
|
zIndex: 5,
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
padding: '15px 20px 10px',
|
||||||
|
background: '#fff',
|
||||||
|
borderRadius: '8px',
|
||||||
|
width: '200px'
|
||||||
|
}}>
|
||||||
|
<Spin />
|
||||||
|
<span style={{ marginLeft: '5px' }}>加载中...</span>
|
||||||
|
</div>
|
||||||
|
</div> : ''
|
||||||
|
}
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsTop">
|
||||||
|
{/* <div className="BusinessActivityStatisticsTitleBox">
|
||||||
|
<div className={selectPageTab === 1 ? 'BusinessActivityStatisticsTitle BusinessActivityStatisticsTitleSelect' : 'BusinessActivityStatisticsTitle'} onClick={() => {
|
||||||
|
setSelectPageTab(1)
|
||||||
|
}}>会员类型</div>
|
||||||
|
<div style={{ marginLeft: '48px' }} className={selectPageTab === 2 ? 'BusinessActivityStatisticsTitle BusinessActivityStatisticsTitleSelect' : 'BusinessActivityStatisticsTitle'} onClick={() => {
|
||||||
|
setSelectPageTab(2)
|
||||||
|
}}>会员等级</div>
|
||||||
|
</div> */}
|
||||||
|
<ProForm
|
||||||
|
layout={'horizontal'}
|
||||||
|
formRef={formRef}
|
||||||
|
submitter={false}
|
||||||
|
onFinish={async (values: any) => {
|
||||||
|
console.log('valuesvaluesvaluesvalues', values);
|
||||||
|
handleGetData(values)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Row gutter={16} style={{ marginTop: "16px" }}>
|
||||||
|
<Col span={6}>
|
||||||
|
<ProFormDateRangePicker
|
||||||
|
label={"查询时间"}
|
||||||
|
name={"searchTime"}
|
||||||
|
// initialValue={[moment().startOf('M').format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')]}
|
||||||
|
initialValue={[moment().startOf('M'), moment()]}
|
||||||
|
fieldProps={{
|
||||||
|
ranges: {
|
||||||
|
"本月": [moment().startOf('M'), moment()],
|
||||||
|
"上月": [moment().subtract(1, 'M').startOf('M'), moment().subtract(1, 'M').endOf('M')],
|
||||||
|
"近三月": [moment().subtract(3, 'M').startOf('M'), moment().endOf('M')],
|
||||||
|
"近半年": [moment().subtract(6, 'M').startOf('M'), moment().endOf('M')],
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
<Col span={6}>
|
||||||
|
<ProFormSelect
|
||||||
|
label={"会员类型"}
|
||||||
|
name={"MembershipType"}
|
||||||
|
options={MEMBERSHIPTYPEYNList}
|
||||||
|
/>
|
||||||
|
|
||||||
|
</Col>
|
||||||
|
<Col span={6}>
|
||||||
|
<ProFormSelect
|
||||||
|
label={"会员等级"}
|
||||||
|
name={"MembershipLevel"}
|
||||||
|
options={MEMBERSHIPLEVELYNList}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
<Col span={6}>
|
||||||
|
|
||||||
|
<ProFormSelect
|
||||||
|
label={"是否排除测试会员"}
|
||||||
|
name={"ExcludeTest"}
|
||||||
|
options={[{ label: '是', value: 1 }, { label: '否', value: 0 }]}
|
||||||
|
initialValue={1}
|
||||||
|
/>
|
||||||
|
|
||||||
|
</Col>
|
||||||
|
<Col span={18}></Col>
|
||||||
|
<Col span={6}>
|
||||||
|
<div style={{ display: 'flex', justifyContent: 'flex-end' }}>
|
||||||
|
<Button style={{ marginRight: '8px' }} onClick={() => {
|
||||||
|
formRef.current?.resetFields()
|
||||||
|
}}>重置</Button>
|
||||||
|
<Button type={"primary"} onClick={() => {
|
||||||
|
formRef.current?.submit()
|
||||||
|
}}>查询</Button>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</ProForm>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsBottom">
|
||||||
|
{
|
||||||
|
membershipType && membershipType.length > 0 ?
|
||||||
|
<>
|
||||||
|
<div className="BusinessActivityStatisticsTitleBox">
|
||||||
|
<div className="BusinessActivityStatisticsTitle">运营活动{activityTotal ? `（${activityTotal}人）` : ""}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsContentBox">
|
||||||
|
<div className="BusinessActivityStatisticsItemOther">
|
||||||
|
{
|
||||||
|
membershipType.map((item: any) => {
|
||||||
|
return <div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">{item.label}</div>
|
||||||
|
<div className="otherItemValue">{item.value}<span className="otherItemValueUnit">人</span></div>
|
||||||
|
<div className="addLabel">占比</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
<span className="addValue">{item.key ? item.key + '%' : ""}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
: ""
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsBottom">
|
||||||
|
{
|
||||||
|
revenueList && revenueList.length > 0 ?
|
||||||
|
revenueList.map((item: any) => {
|
||||||
|
return <div style={{ marginBottom: '16px' }}>
|
||||||
|
<div className="BusinessActivityStatisticsTitleBox">
|
||||||
|
<div className="BusinessActivityStatisticsTitle">{item.MarketingActivity}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsContentBox">
|
||||||
|
<div className="BusinessActivityStatisticsItemOther">
|
||||||
|
<div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">实际销售金额（扣除退款）</div>
|
||||||
|
<div className="otherItemValue">{item && item?.TotalActualAmount ? item?.TotalActualAmount.summaryData : "-"}</div>
|
||||||
|
<div className="addLabel">环比增长</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
{
|
||||||
|
item && item?.TotalActualAmount && item?.TotalActualAmount.QOQData && item?.TotalActualAmount.summaryData ?
|
||||||
|
<img className="addIcon" src={((item?.TotalActualAmount.summaryData - item?.TotalActualAmount.QOQData) / item?.TotalActualAmount.QOQData) > 0 ? addIcon : reduceIcon} /> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
item && item?.TotalActualAmount && item?.TotalActualAmount.QOQData && item?.TotalActualAmount.summaryData ?
|
||||||
|
<Tooltip title={`((${item?.TotalActualAmount.summaryData} - ${item?.TotalActualAmount.QOQData}) / ${item?.TotalActualAmount.QOQData}) * 100`}>
|
||||||
|
<span className="addValue">{(((item?.TotalActualAmount.summaryData - item?.TotalActualAmount.QOQData) / item?.TotalActualAmount.QOQData) * 100).toFixed(2) + '%'}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: "-"
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">成交销售金额</div>
|
||||||
|
<div className="otherItemValue">{item && item?.TotalSuccAmount ? item?.TotalSuccAmount.summaryData : "-"}</div>
|
||||||
|
<div className="addLabel">环比增长</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
{
|
||||||
|
item && item?.TotalSuccAmount && item?.TotalSuccAmount.QOQData && item?.TotalSuccAmount.summaryData ?
|
||||||
|
<img className="addIcon" src={((item?.TotalSuccAmount.summaryData - item?.TotalSuccAmount.QOQData) / item?.TotalSuccAmount.QOQData) > 0 ? addIcon : reduceIcon} /> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
item && item?.TotalSuccAmount && item?.TotalSuccAmount.QOQData && item?.TotalSuccAmount.summaryData ?
|
||||||
|
// <span className="addValue">{item && item?.TotalSuccAmount ? item?.TotalSuccAmount.QOQData : "-"}</span>
|
||||||
|
<Tooltip title={`((${item?.TotalSuccAmount.summaryData} - ${item?.TotalSuccAmount.QOQData}) / ${item?.TotalSuccAmount.QOQData}) * 100`}>
|
||||||
|
<span className="addValue">{(((item?.TotalSuccAmount.summaryData - item?.TotalSuccAmount.QOQData) / item?.TotalSuccAmount.QOQData) * 100).toFixed(2) + '%'}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: "-"
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">成交订单笔数</div>
|
||||||
|
<div className="otherItemValue">{item && item?.TotalSuccTicket ? item?.TotalSuccTicket.summaryData : "-"}</div>
|
||||||
|
<div className="addLabel">环比增长</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
{
|
||||||
|
item && item?.TotalSuccTicket && item?.TotalSuccTicket.QOQData && item?.TotalSuccTicket.summaryData ?
|
||||||
|
<img className="addIcon" src={((item?.TotalSuccTicket.summaryData - item?.TotalSuccTicket.QOQData) / item?.TotalSuccTicket.QOQData) > 0 ? addIcon : reduceIcon} /> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
item && item?.TotalSuccTicket && item?.TotalSuccTicket.QOQData && item?.TotalSuccTicket.summaryData ?
|
||||||
|
<Tooltip title={`((${item?.TotalSuccTicket.summaryData} - ${item?.TotalSuccTicket.QOQData}) / ${item?.TotalSuccTicket.QOQData}) * 100`}>
|
||||||
|
<span className="addValue">{(((item?.TotalSuccTicket.summaryData - item?.TotalSuccTicket.QOQData) / item?.TotalSuccTicket.QOQData) * 100).toFixed(2) + '%'}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: "-"
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* <div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">成交销售数量</div>
|
||||||
|
<div className="otherItemValue">{item && item?.TotalCount ? item?.TotalCount.summaryData : "-"}</div>
|
||||||
|
<div className="addLabel">环比增长</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
{
|
||||||
|
item && item?.TotalCount && item?.TotalCount.QOQData && item?.TotalCount.summaryData ?
|
||||||
|
<img className="addIcon" src={((item?.TotalCount.summaryData - item?.TotalCount.QOQData) / item?.TotalCount.QOQData) > 0 ? addIcon : reduceIcon} /> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
item && item?.TotalCount && item?.TotalCount.QOQData && item?.TotalCount.summaryData ?
|
||||||
|
// <span className="addValue">{item && item?.TotalCount ? item?.TotalCount.QOQData : "-"}</span>
|
||||||
|
<Tooltip title={`((${item?.TotalCount.summaryData} - ${item?.TotalCount.QOQData}) / ${item?.TotalCount.QOQData}) * 100`}>
|
||||||
|
<span className="addValue">{(((item?.TotalCount.summaryData - item?.TotalCount.QOQData) / item?.TotalCount.QOQData) * 100).toFixed(2) + '%'}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: "-"
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">交易失败笔数</div>
|
||||||
|
<div className="otherItemValue">{item && item?.TotalFailureTicket ? item?.TotalFailureTicket.summaryData : "-"}</div>
|
||||||
|
<div className="addLabel">环比增长</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
{
|
||||||
|
item && item?.TotalFailureTicket && item?.TotalFailureTicket.QOQData && item?.TotalFailureTicket.summaryData ?
|
||||||
|
<img className="addIcon" src={((item?.TotalFailureTicket.summaryData - item?.TotalFailureTicket.QOQData) / item?.TotalFailureTicket.QOQData) > 0 ? addIcon : reduceIcon} /> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
item && item?.TotalFailureTicket && item?.TotalFailureTicket.QOQData && item?.TotalFailureTicket.summaryData ?
|
||||||
|
// <span className="addValue">{item && item?.TotalFailureTicket ? item?.TotalFailureTicket.QOQData : "-"}</span>
|
||||||
|
<Tooltip title={`((${item?.TotalFailureTicket.summaryData} - ${item?.TotalFailureTicket.QOQData}) / ${item?.TotalFailureTicket.QOQData}) * 100`}>
|
||||||
|
<span className="addValue">{(((item?.TotalFailureTicket.summaryData - item?.TotalFailureTicket.QOQData) / item?.TotalFailureTicket.QOQData) * 100).toFixed(2) + '%'}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: "-"
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">退款订单笔数</div>
|
||||||
|
<div className="otherItemValue">{item && item?.TotalRefundTicket ? item?.TotalRefundTicket.summaryData : "-"}</div>
|
||||||
|
<div className="addLabel">环比增长</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
{
|
||||||
|
item && item?.TotalRefundTicket && item?.TotalRefundTicket.QOQData && item?.TotalRefundTicket.summaryData ?
|
||||||
|
<img className="addIcon" src={((item?.TotalRefundTicket.summaryData - item?.TotalRefundTicket.QOQData) / item?.TotalRefundTicket.QOQData) > 0 ? addIcon : reduceIcon} /> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
item && item?.TotalRefundTicket && item?.TotalRefundTicket.QOQData && item?.TotalRefundTicket.summaryData ?
|
||||||
|
// <span className="addValue">{item && item?.TotalRefundTicket ? item?.TotalRefundTicket.QOQData : "-"}</span>
|
||||||
|
<Tooltip title={`((${item?.TotalRefundTicket.summaryData} - ${item?.TotalRefundTicket.QOQData}) / ${item?.TotalRefundTicket.QOQData}) * 100`}>
|
||||||
|
<span className="addValue">{(((item?.TotalRefundTicket.summaryData - item?.TotalRefundTicket.QOQData) / item?.TotalRefundTicket.QOQData) * 100).toFixed(2) + '%'}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: "-"
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">退款订单金额</div>
|
||||||
|
<div className="otherItemValue">{item && item?.TotalRefundAmount ? item?.TotalRefundAmount.summaryData : "-"}</div>
|
||||||
|
<div className="addLabel">环比增长</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
{
|
||||||
|
item && item?.TotalRefundAmount && item?.TotalRefundAmount.QOQData && item?.TotalRefundAmount.summaryData ?
|
||||||
|
<img className="addIcon" src={((item?.TotalRefundAmount.summaryData - item?.TotalRefundAmount.QOQData) / item?.TotalRefundAmount.QOQData) > 0 ? addIcon : reduceIcon} /> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
item && item?.TotalRefundAmount && item?.TotalRefundAmount.QOQData && item?.TotalRefundAmount.summaryData ?
|
||||||
|
// <span className="addValue">{item && item?.TotalRefundAmount ? item?.TotalRefundAmount.QOQData : "-"}</span>
|
||||||
|
<Tooltip title={`((${item?.TotalRefundAmount.summaryData} - ${item?.TotalRefundAmount.QOQData}) / ${item?.TotalRefundAmount.QOQData}) * 100`}>
|
||||||
|
<span className="addValue">{(((item?.TotalRefundAmount.summaryData - item?.TotalRefundAmount.QOQData) / item?.TotalRefundAmount.QOQData) * 100).toFixed(2) + '%'}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: "-"
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div> */}
|
||||||
|
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">优惠金额</div>
|
||||||
|
<div className="otherItemValue">{item && item?.CouponAmount ? item?.CouponAmount.summaryData : "-"}</div>
|
||||||
|
<div className="addLabel">环比增长</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
{
|
||||||
|
item && item?.CouponAmount && item?.CouponAmount.QOQData && item?.CouponAmount.summaryData ?
|
||||||
|
<img className="addIcon" src={((item?.CouponAmount.summaryData - item?.CouponAmount.QOQData) / item?.CouponAmount.QOQData) > 0 ? addIcon : reduceIcon} /> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
item && item?.CouponAmount && item?.CouponAmount.QOQData && item?.CouponAmount.summaryData ?
|
||||||
|
<Tooltip title={`((${item?.CouponAmount.summaryData} - ${item?.CouponAmount.QOQData}) / ${item?.CouponAmount.QOQData}) * 100`}>
|
||||||
|
<span className="addValue">{(((item?.CouponAmount.summaryData - item?.CouponAmount.QOQData) / item?.CouponAmount.QOQData) * 100).toFixed(2) + '%'}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: "-"
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">积分抵扣</div>
|
||||||
|
<div className="otherItemValue">{item && item?.ConsumePoint ? item?.ConsumePoint.summaryData : "-"}</div>
|
||||||
|
<div className="addLabel">环比增长</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
{
|
||||||
|
item && item?.ConsumePoint && item?.ConsumePoint.QOQData && item?.ConsumePoint.summaryData ?
|
||||||
|
<img className="addIcon" src={((item?.ConsumePoint.summaryData - item?.ConsumePoint.QOQData) / item?.ConsumePoint.QOQData) > 0 ? addIcon : reduceIcon} /> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
item && item?.ConsumePoint && item?.ConsumePoint.QOQData && item?.ConsumePoint.summaryData ?
|
||||||
|
<Tooltip title={`((${item?.ConsumePoint.summaryData} - ${item?.ConsumePoint.QOQData}) / ${item?.ConsumePoint.QOQData}) * 100`}>
|
||||||
|
<span className="addValue">{(((item?.ConsumePoint.summaryData - item?.ConsumePoint.QOQData) / item?.ConsumePoint.QOQData) * 100).toFixed(2) + '%'}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: "-"
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="BusinessActivityStatisticsOtherItem">
|
||||||
|
<div className="otherItemTitle">积分抵扣</div>
|
||||||
|
<div className="otherItemValue">{item && item?.EarnPoint ? item?.EarnPoint.summaryData : "-"}</div>
|
||||||
|
<div className="addLabel">环比增长</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
{
|
||||||
|
item && item?.EarnPoint && item?.EarnPoint.QOQData && item?.EarnPoint.summaryData ?
|
||||||
|
<img className="addIcon" src={((item?.EarnPoint.summaryData - item?.EarnPoint.QOQData) / item?.EarnPoint.QOQData) > 0 ? addIcon : reduceIcon} /> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
item && item?.EarnPoint && item?.EarnPoint.QOQData && item?.EarnPoint.summaryData ?
|
||||||
|
<Tooltip title={`((${item?.EarnPoint.summaryData} - ${item?.EarnPoint.QOQData}) / ${item?.EarnPoint.QOQData}) * 100`}>
|
||||||
|
<span className="addValue">{(((item?.EarnPoint.summaryData - item?.EarnPoint.QOQData) / item?.EarnPoint.QOQData) * 100).toFixed(2) + '%'}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: "-"
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
}) : ""
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<Drawer
|
||||||
|
width={'80%'}
|
||||||
|
title={currentDrawerTitle || ""}
|
||||||
|
visible={showDetail}
|
||||||
|
destroyOnClose
|
||||||
|
closable={false}
|
||||||
|
onClose={() => {
|
||||||
|
setSearchType(null)
|
||||||
|
setValueType(null)
|
||||||
|
setShowDetail(false)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<MemberInfor searchType={searchType} valueType={valueType} isComponent={true} />
|
||||||
|
</Drawer>
|
||||||
|
</div >
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(({ user }: ConnectState) => ({
|
||||||
|
currentUser: user.currentUser
|
||||||
|
}))(BusinessActivityStatistics);
|
||||||
@ -165,6 +165,24 @@ const ConsumptionRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?
|
|||||||
},
|
},
|
||||||
initialValue: "0"
|
initialValue: "0"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: "订单状态",
|
||||||
|
width: 120,
|
||||||
|
dataIndex: "CONSUMPTIONRECORD_STATE",
|
||||||
|
align: 'center',
|
||||||
|
ellipsis: true,
|
||||||
|
valueType: 'select',
|
||||||
|
valueEnum: {
|
||||||
|
"1005": "订单待支付",
|
||||||
|
"1010": "订单待发货",
|
||||||
|
"2000": "订单待取餐",
|
||||||
|
"3000": "订单已完成",
|
||||||
|
"8000": "退款申请中",
|
||||||
|
"8900": "订单已退款",
|
||||||
|
"9000": "订单已关闭",
|
||||||
|
"9999": "订单已撤销",
|
||||||
|
},
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: "获得积分",
|
title: "获得积分",
|
||||||
width: 120,
|
width: 120,
|
||||||
@ -291,6 +309,7 @@ const ConsumptionRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?
|
|||||||
PROVINCE_CODE: currentUser?.ProvinceCode || "",
|
PROVINCE_CODE: currentUser?.ProvinceCode || "",
|
||||||
OWNERUNIT_ID: 911,
|
OWNERUNIT_ID: 911,
|
||||||
MEMBERSHIP_ID: parentDetail?.MEMBERSHIP_ID,
|
MEMBERSHIP_ID: parentDetail?.MEMBERSHIP_ID,
|
||||||
|
CONSUMPTIONRECORD_STATES: '1010,2000,2010,3000,8000,8010,8020,8900,8999'
|
||||||
},
|
},
|
||||||
PageIndex: params?.current,
|
PageIndex: params?.current,
|
||||||
PageSize: params?.pageSize,
|
PageSize: params?.pageSize,
|
||||||
@ -307,7 +326,8 @@ const ConsumptionRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?
|
|||||||
OWNERUNIT_ID: 911,
|
OWNERUNIT_ID: 911,
|
||||||
CONSUMPTIONRECORD_DATE_Start: params?.CONSUMPTIONRECORD_DATE_Start || "",
|
CONSUMPTIONRECORD_DATE_Start: params?.CONSUMPTIONRECORD_DATE_Start || "",
|
||||||
CONSUMPTIONRECORD_DATE_End: params?.CONSUMPTIONRECORD_DATE_End || "",
|
CONSUMPTIONRECORD_DATE_End: params?.CONSUMPTIONRECORD_DATE_End || "",
|
||||||
CONSUMPTIONRECORD_TYPE: params?.CONSUMPTIONRECORD_TYPE === '0' ? '' : params?.CONSUMPTIONRECORD_TYPE
|
CONSUMPTIONRECORD_TYPE: params?.CONSUMPTIONRECORD_TYPE === '0' ? '' : params?.CONSUMPTIONRECORD_TYPE,
|
||||||
|
CONSUMPTIONRECORD_STATES: '1010,2000,2010,3000,8000,8010,8020,8900,8999'
|
||||||
},
|
},
|
||||||
PageIndex: params?.current,
|
PageIndex: params?.current,
|
||||||
PageSize: params?.pageSize,
|
PageSize: params?.pageSize,
|
||||||
|
|||||||
@ -18,6 +18,7 @@ import { handleGetMEMBERGROWTHList } from "../service";
|
|||||||
import moment from 'moment'
|
import moment from 'moment'
|
||||||
import session from "@/utils/session";
|
import session from "@/utils/session";
|
||||||
import { handleSetlogSave } from "@/utils/format";
|
import { handleSetlogSave } from "@/utils/format";
|
||||||
|
import OrderDetailModal from "../BookingMealOrder/components/orderDetailModal";
|
||||||
|
|
||||||
|
|
||||||
const GrowthValueRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?: Boolean, parentDetail?: any }> = (props) => {
|
const GrowthValueRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?: Boolean, parentDetail?: any }> = (props) => {
|
||||||
@ -36,7 +37,9 @@ const GrowthValueRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?
|
|||||||
let MEMBERSHIPTYPEYNObj = session.get('MEMBERSHIPTYPEYNObj')
|
let MEMBERSHIPTYPEYNObj = session.get('MEMBERSHIPTYPEYNObj')
|
||||||
|
|
||||||
|
|
||||||
|
// 显示订单详情的悬浮框
|
||||||
|
const [showOrderModal, setShowOrderModal] = useState<boolean>(false)
|
||||||
|
const [currentRow, setCurrentRow] = useState<any>()
|
||||||
|
|
||||||
|
|
||||||
// 树相关的属性和方法
|
// 树相关的属性和方法
|
||||||
@ -82,22 +85,6 @@ const GrowthValueRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
|
||||||
title: "服务区名称",
|
|
||||||
width: 150,
|
|
||||||
dataIndex: "SERVERPART_NAME",
|
|
||||||
hideInSearch: true,
|
|
||||||
align: 'center',
|
|
||||||
ellipsis: true,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "门店名称",
|
|
||||||
width: 150,
|
|
||||||
dataIndex: "SHOPNAME",
|
|
||||||
hideInSearch: true,
|
|
||||||
align: 'center',
|
|
||||||
ellipsis: true,
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: "会员昵称",
|
title: "会员昵称",
|
||||||
width: 150,
|
width: 150,
|
||||||
@ -165,6 +152,21 @@ const GrowthValueRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?
|
|||||||
},
|
},
|
||||||
initialValue: "-2"
|
initialValue: "-2"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: "订单编号",
|
||||||
|
width: 250,
|
||||||
|
dataIndex: "TICKET_CODE",
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'center',
|
||||||
|
ellipsis: true,
|
||||||
|
valueType: 'digit',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.TICKET_CODE ? <a onClick={() => {
|
||||||
|
setCurrentRow(record)
|
||||||
|
setShowOrderModal(true)
|
||||||
|
}}>{record?.TICKET_CODE}</a> : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: "累计成长值",
|
title: "累计成长值",
|
||||||
width: 120,
|
width: 120,
|
||||||
@ -192,6 +194,22 @@ const GrowthValueRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?
|
|||||||
ellipsis: true,
|
ellipsis: true,
|
||||||
valueType: 'digit'
|
valueType: 'digit'
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: "服务区名称",
|
||||||
|
width: 150,
|
||||||
|
dataIndex: "SERVERPART_NAME",
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'center',
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "门店名称",
|
||||||
|
width: 150,
|
||||||
|
dataIndex: "SHOPNAME",
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'center',
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: "操作时间",
|
title: "操作时间",
|
||||||
width: 180,
|
width: 180,
|
||||||
@ -204,6 +222,9 @@ const GrowthValueRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?
|
|||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
|
const handleCloseModal = () => {
|
||||||
|
setShowOrderModal(false)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -282,6 +303,9 @@ const GrowthValueRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<OrderDetailModal modalVisible={showOrderModal} handleCloseModal={handleCloseModal} currentRow={currentRow} />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -18,6 +18,7 @@ import PageTitleBox from "@/components/PageTitleBox";
|
|||||||
import moment from 'moment'
|
import moment from 'moment'
|
||||||
import session from "@/utils/session";
|
import session from "@/utils/session";
|
||||||
import { handleSetlogSave } from "@/utils/format";
|
import { handleSetlogSave } from "@/utils/format";
|
||||||
|
import OrderDetailModal from "../BookingMealOrder/components/orderDetailModal";
|
||||||
|
|
||||||
|
|
||||||
const PointsRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?: Boolean, parentDetail?: any }> = (props) => {
|
const PointsRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?: Boolean, parentDetail?: any }> = (props) => {
|
||||||
@ -45,6 +46,10 @@ const PointsRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?: Boo
|
|||||||
// 查询的条件
|
// 查询的条件
|
||||||
const [searchParams, setSearchParams] = useState<any>()
|
const [searchParams, setSearchParams] = useState<any>()
|
||||||
|
|
||||||
|
// 显示订单详情的悬浮框
|
||||||
|
const [showOrderModal, setShowOrderModal] = useState<boolean>(false)
|
||||||
|
const [currentRow, setCurrentRow] = useState<any>()
|
||||||
|
|
||||||
const columns: any = [
|
const columns: any = [
|
||||||
{
|
{
|
||||||
title: '查询内容',
|
title: '查询内容',
|
||||||
@ -78,22 +83,6 @@ const PointsRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?: Boo
|
|||||||
},
|
},
|
||||||
initialValue: [moment().startOf('M'), moment()],
|
initialValue: [moment().startOf('M'), moment()],
|
||||||
},
|
},
|
||||||
{
|
|
||||||
title: "服务区名称",
|
|
||||||
width: 150,
|
|
||||||
dataIndex: "SERVERPART_NAME",
|
|
||||||
hideInSearch: true,
|
|
||||||
align: 'center',
|
|
||||||
ellipsis: true,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "门店名称",
|
|
||||||
width: 150,
|
|
||||||
dataIndex: "SHOPNAME",
|
|
||||||
hideInSearch: true,
|
|
||||||
ellipsis: true,
|
|
||||||
align: 'center',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: "用户昵称",
|
title: "用户昵称",
|
||||||
width: 150,
|
width: 150,
|
||||||
@ -159,6 +148,21 @@ const PointsRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?: Boo
|
|||||||
// },
|
// },
|
||||||
// initialValue: "0"
|
// initialValue: "0"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: "订单编号",
|
||||||
|
width: 250,
|
||||||
|
dataIndex: "TICKET_CODE",
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'center',
|
||||||
|
ellipsis: true,
|
||||||
|
valueType: 'digit',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.TICKET_CODE ? <a onClick={() => {
|
||||||
|
setCurrentRow(record)
|
||||||
|
setShowOrderModal(true)
|
||||||
|
}}>{record?.TICKET_CODE}</a> : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: "本次积分",
|
title: "本次积分",
|
||||||
width: 120,
|
width: 120,
|
||||||
@ -186,6 +190,22 @@ const PointsRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?: Boo
|
|||||||
align: 'center',
|
align: 'center',
|
||||||
valueType: "digit"
|
valueType: "digit"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: "服务区名称",
|
||||||
|
width: 150,
|
||||||
|
dataIndex: "SERVERPART_NAME",
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'center',
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "门店名称",
|
||||||
|
width: 150,
|
||||||
|
dataIndex: "SHOPNAME",
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: "获取时间",
|
title: "获取时间",
|
||||||
width: 150,
|
width: 150,
|
||||||
@ -199,7 +219,9 @@ const PointsRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?: Boo
|
|||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
|
const handleCloseModal = () => {
|
||||||
|
setShowOrderModal(false)
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div ref={(el) => {
|
<div ref={(el) => {
|
||||||
@ -274,6 +296,8 @@ const PointsRecordSearch: React.FC<{ currentUser: CurrentUser, isComponent?: Boo
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<OrderDetailModal modalVisible={showOrderModal} handleCloseModal={handleCloseModal} currentRow={currentRow} />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -101,8 +101,14 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
|
|||||||
const [toListLoading, setToListLoading] = useState<boolean>(false)
|
const [toListLoading, setToListLoading] = useState<boolean>(false)
|
||||||
|
|
||||||
// 预览上传后的图片
|
// 预览上传后的图片
|
||||||
const handlePreview = async () => {
|
const handlePreview = async (type: number) => {
|
||||||
setFileList(fileList)
|
if (type === 1) {
|
||||||
|
setFileList(mainImgList)
|
||||||
|
} else if (type === 2) {
|
||||||
|
setFileList(headerImgList)
|
||||||
|
} else if (type === 3) {
|
||||||
|
setFileList(detailImgList)
|
||||||
|
}
|
||||||
setImagePreviewVisible(true)
|
setImagePreviewVisible(true)
|
||||||
};
|
};
|
||||||
const handleChangePreview = (val: any) => {
|
const handleChangePreview = (val: any) => {
|
||||||
@ -743,6 +749,25 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{fileList && fileList.length > 0 && <div style={{ display: 'none' }}>
|
||||||
|
<Image.PreviewGroup
|
||||||
|
preview={{
|
||||||
|
visible: imagePreviewVisible,
|
||||||
|
onVisibleChange: vis => {
|
||||||
|
setImagePreviewVisible(vis)
|
||||||
|
}
|
||||||
|
|
||||||
|
}}>
|
||||||
|
{
|
||||||
|
fileList.map((n) =>
|
||||||
|
<Image src={n.url} key={n.url} />
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</Image.PreviewGroup>
|
||||||
|
</div>}
|
||||||
|
|
||||||
{/* 添加商品的悬浮框 */}
|
{/* 添加商品的悬浮框 */}
|
||||||
<Modal
|
<Modal
|
||||||
// title={currentRow ? '更新商品管理' : '新建商品管理'}
|
// title={currentRow ? '更新商品管理' : '新建商品管理'}
|
||||||
@ -1346,7 +1371,9 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
|
|||||||
accept="image/*"
|
accept="image/*"
|
||||||
fieldProps={{
|
fieldProps={{
|
||||||
beforeUpload,
|
beforeUpload,
|
||||||
onPreview: handlePreview,
|
onPreview: () => {
|
||||||
|
handlePreview(1)
|
||||||
|
},
|
||||||
fileList: mainImgList, // 绑定 fileList
|
fileList: mainImgList, // 绑定 fileList
|
||||||
onChange: async (info: any) => {
|
onChange: async (info: any) => {
|
||||||
if (info.file.status === 'removed') {
|
if (info.file.status === 'removed') {
|
||||||
@ -1395,7 +1422,9 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
|
|||||||
accept="image/*"
|
accept="image/*"
|
||||||
fieldProps={{
|
fieldProps={{
|
||||||
beforeUpload,
|
beforeUpload,
|
||||||
onPreview: handlePreview,
|
onPreview: () => {
|
||||||
|
handlePreview(2)
|
||||||
|
},
|
||||||
fileList: headerImgList, // 绑定 fileList
|
fileList: headerImgList, // 绑定 fileList
|
||||||
onChange: async (info: any) => {
|
onChange: async (info: any) => {
|
||||||
if (info.file.status === 'removed') {
|
if (info.file.status === 'removed') {
|
||||||
@ -1444,7 +1473,9 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
|
|||||||
accept="image/*"
|
accept="image/*"
|
||||||
fieldProps={{
|
fieldProps={{
|
||||||
beforeUpload,
|
beforeUpload,
|
||||||
onPreview: handlePreview,
|
onPreview: () => {
|
||||||
|
handlePreview(3)
|
||||||
|
},
|
||||||
fileList: detailImgList, // 绑定 fileList
|
fileList: detailImgList, // 绑定 fileList
|
||||||
onChange: async (info: any) => {
|
onChange: async (info: any) => {
|
||||||
if (info.file.status === 'removed') {
|
if (info.file.status === 'removed') {
|
||||||
|
|||||||
@ -0,0 +1,443 @@
|
|||||||
|
.SummaryOfIntegralGrowthValueMain {
|
||||||
|
width: 100%;
|
||||||
|
height: calc(100vh - 150px);
|
||||||
|
background: #FFFFFF;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueTop {
|
||||||
|
width: 100%;
|
||||||
|
background: #FFFFFF;
|
||||||
|
// box-shadow: 0px 0px 6px 0px rgba(31, 48, 95, 0.2);
|
||||||
|
// border-radius: 4px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueTitleBox {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-between;
|
||||||
|
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #757575;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueTitleSelect {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueTitleSelect::after {
|
||||||
|
content: "";
|
||||||
|
width: 4px;
|
||||||
|
height: 18px;
|
||||||
|
background: #1492FF;
|
||||||
|
border-radius: 2px;
|
||||||
|
position: absolute;
|
||||||
|
left: -12px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueContentBox {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 16px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
// .SummaryOfIntegralGrowthValueItemFirst {
|
||||||
|
// width: 280px;
|
||||||
|
// height: 180px;
|
||||||
|
// background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// box-sizing: border-box;
|
||||||
|
// padding: 26px 39px;
|
||||||
|
// margin-right: 16px;
|
||||||
|
|
||||||
|
// .firstItemTitle {
|
||||||
|
// font-family: PingFangSC, PingFang SC;
|
||||||
|
// font-weight: 500;
|
||||||
|
// font-size: 18px;
|
||||||
|
// color: #FFFFFF;
|
||||||
|
// line-height: 13px;
|
||||||
|
// text-align: left;
|
||||||
|
// font-style: normal;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .firstItemValue {
|
||||||
|
// font-family: DINAlternate, DINAlternate;
|
||||||
|
// font-weight: bold;
|
||||||
|
// font-size: 28px;
|
||||||
|
// color: #FFFFFF;
|
||||||
|
// line-height: 32px;
|
||||||
|
// text-align: left;
|
||||||
|
// font-style: normal;
|
||||||
|
// margin-top: 12px;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueItemOther {
|
||||||
|
width: 100%;
|
||||||
|
height: 180px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueOtherItem {
|
||||||
|
width: calc((100% - 112px) / 7);
|
||||||
|
height: 100%;
|
||||||
|
background: #F6F9FF;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 29px 24px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
height: 36px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #1492FF;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
|
||||||
|
|
||||||
|
.addIcon {
|
||||||
|
width: 7px;
|
||||||
|
height: 10px;
|
||||||
|
margin-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// .otherBgIcon {
|
||||||
|
// width: 76px;
|
||||||
|
// height: 51px;
|
||||||
|
// position: absolute;
|
||||||
|
// top: 29px;
|
||||||
|
// right: 4px;
|
||||||
|
// background-image: url(../../../assets/detail/otherBgIcon.png);
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueOtherItemSelect {
|
||||||
|
background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueBottom {
|
||||||
|
width: 100%;
|
||||||
|
// margin-top: 16px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #FFFFFF;
|
||||||
|
// box-shadow: 0px 0px 6px 0px rgba(31, 48, 95, 0.2);
|
||||||
|
// border-radius: 4px;
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueTitleBox {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueTitle::after {
|
||||||
|
content: "";
|
||||||
|
width: 4px;
|
||||||
|
height: 18px;
|
||||||
|
background: #1492FF;
|
||||||
|
border-radius: 2px;
|
||||||
|
position: absolute;
|
||||||
|
left: -12px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueContentBox {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 16px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueItemOther {
|
||||||
|
width: 100%;
|
||||||
|
height: 180px;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-between;
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueOtherItem {
|
||||||
|
width: calc((100% - 112px) / 7);
|
||||||
|
height: 100%;
|
||||||
|
background: #F6F9FF;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 29px 24px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-right: 16px;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
height: 36px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #1492FF;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
|
||||||
|
.otherItemValueUnit {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
|
||||||
|
|
||||||
|
.addIcon {
|
||||||
|
width: 7px;
|
||||||
|
height: 10px;
|
||||||
|
margin-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// .otherBgIcon {
|
||||||
|
// width: 76px;
|
||||||
|
// height: 51px;
|
||||||
|
// position: absolute;
|
||||||
|
// top: 29px;
|
||||||
|
// right: 4px;
|
||||||
|
// background-image: url(../../../assets/detail/otherBgIcon.png);
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
.SummaryOfIntegralGrowthValueOtherItemSelect {
|
||||||
|
background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
|
||||||
|
.otherItemValueUnit {
|
||||||
|
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 20px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
254
src/pages/travelMember/SummaryOfIntegralGrowthValue/index.tsx
Normal file
254
src/pages/travelMember/SummaryOfIntegralGrowthValue/index.tsx
Normal file
@ -0,0 +1,254 @@
|
|||||||
|
// 积分成长值汇总表
|
||||||
|
import { connect, CurrentUser } from "umi";
|
||||||
|
import { ConnectState } from "@/models/connect";
|
||||||
|
import { useEffect, useRef, useState } from "react";
|
||||||
|
import { Button, Col, Drawer, FormInstance, Row, Spin } from "antd";
|
||||||
|
import ProForm, { ProFormSelect } from "@ant-design/pro-form";
|
||||||
|
import './SummaryOfIntegralGrowthValue.less'
|
||||||
|
import { handeGetMembershipCount } from "../service";
|
||||||
|
import session from "@/utils/session";
|
||||||
|
import ProTable, { ActionType } from "@ant-design/pro-table";
|
||||||
|
import MemberInfor from "../memberInfor";
|
||||||
|
|
||||||
|
const SummaryOfIntegralGrowthValue: React.FC<{ currentUser: CurrentUser | undefined }> = (props) => {
|
||||||
|
const { currentUser } = props
|
||||||
|
const formRef = useRef<FormInstance>();
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
|
||||||
|
// 选择的tab
|
||||||
|
const [selectPageTab, setSelectPageTab] = useState<any>(1)
|
||||||
|
// 会员类型数据
|
||||||
|
const [membershipType, setMembershipType] = useState<any>()
|
||||||
|
// 会员等级数据
|
||||||
|
const [membershipLevel, setMembershipLevel] = useState<any>()
|
||||||
|
// 会员类型数量
|
||||||
|
const [membershipTypeTotal, setMembershipTypeTotal] = useState<number>(0)
|
||||||
|
// 会员等级数量
|
||||||
|
const [membershipLevelTotal, setmembershipLevelTotal] = useState<number>(0)
|
||||||
|
|
||||||
|
// 显示详情抽屉
|
||||||
|
const [showDetail, setShowDetail] = useState<boolean>(false)
|
||||||
|
const [currentRow, setCurrentRow] = useState<any>()
|
||||||
|
// 抽屉显示的标题
|
||||||
|
const [currentDrawerTitle, setCurrentDrawerTitle] = useState<string>()
|
||||||
|
// 1 是 会员类型 2是 会员等级
|
||||||
|
const [searchType, setSearchType] = useState<any>()
|
||||||
|
// 对应的枚举类型
|
||||||
|
const [valueType, setValueType] = useState<any>()
|
||||||
|
// 显示加载效果
|
||||||
|
const [showLoading, setShowLoading] = useState<boolean>(false)
|
||||||
|
|
||||||
|
let MEMBERSHIPLEVELYNObj = session.get('MEMBERSHIPLEVELYNObj')
|
||||||
|
let MEMBERSHIPTYPEYNObj = session.get('MEMBERSHIPTYPEYNObj')
|
||||||
|
|
||||||
|
const handleGetData = async (formData?: any) => {
|
||||||
|
console.log('formDataformDataformData', formData);
|
||||||
|
|
||||||
|
const req: any = {
|
||||||
|
CalcType: 1, // 会员类型
|
||||||
|
OwnerUnitId: currentUser?.OwnerUnitId,
|
||||||
|
ExcludeTest: formData ? formData?.ExcludeTest === 1 ? true : false : true,
|
||||||
|
StartDate: "",
|
||||||
|
EndDate: "",
|
||||||
|
MembershipType: "",
|
||||||
|
MembershipLevel: ""
|
||||||
|
}
|
||||||
|
const req2: any = {
|
||||||
|
CalcType: 2,// 会员等级
|
||||||
|
OwnerUnitId: currentUser?.OwnerUnitId,
|
||||||
|
ExcludeTest: formData ? formData?.ExcludeTest === 1 ? true : false : true,
|
||||||
|
StartDate: "",
|
||||||
|
EndDate: "",
|
||||||
|
MembershipType: "",
|
||||||
|
MembershipLevel: ""
|
||||||
|
}
|
||||||
|
setShowLoading(true)
|
||||||
|
const data = await handeGetMembershipCount(req)
|
||||||
|
const data2 = await handeGetMembershipCount(req2)
|
||||||
|
setShowLoading(false)
|
||||||
|
console.log('datadatadatadata', data);
|
||||||
|
console.log('data2data2data2', data2);
|
||||||
|
|
||||||
|
setMembershipType(data.List)
|
||||||
|
setMembershipLevel(data2.List)
|
||||||
|
setMembershipTypeTotal(data.OtherData)
|
||||||
|
setmembershipLevelTotal(data2.OtherData)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 点击事件
|
||||||
|
const handleShowTableData = async (type: number, memberType: any) => {
|
||||||
|
// type 1 的话是 会员类型 2 的话是 会员等级 memberType 对应的枚举值
|
||||||
|
setCurrentDrawerTitle(`${type === 1 ? '会员类型' : type === 2 ? '会员等级' : ''}【${type === 1 ? MEMBERSHIPTYPEYNObj && memberType ? MEMBERSHIPTYPEYNObj[memberType] : '' : type === 2 ? MEMBERSHIPLEVELYNObj && memberType ? MEMBERSHIPLEVELYNObj[memberType] : '' : ''}】`)
|
||||||
|
setSearchType(type)
|
||||||
|
setValueType(memberType)
|
||||||
|
setShowDetail(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
handleGetData()
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="SummaryOfIntegralGrowthValueMain">
|
||||||
|
{
|
||||||
|
showLoading ?
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
background: 'rgba(0,0,0,0.1)',
|
||||||
|
position: 'absolute',
|
||||||
|
zIndex: 5,
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
padding: '15px 20px 10px',
|
||||||
|
background: '#fff',
|
||||||
|
borderRadius: '8px',
|
||||||
|
width: '200px'
|
||||||
|
}}>
|
||||||
|
<Spin />
|
||||||
|
<span style={{ marginLeft: '5px' }}>加载中...</span>
|
||||||
|
</div>
|
||||||
|
</div> : ''
|
||||||
|
}
|
||||||
|
|
||||||
|
<div className="SummaryOfIntegralGrowthValueTop">
|
||||||
|
{/* <div className="SummaryOfIntegralGrowthValueTitleBox">
|
||||||
|
<div className={selectPageTab === 1 ? 'SummaryOfIntegralGrowthValueTitle SummaryOfIntegralGrowthValueTitleSelect' : 'SummaryOfIntegralGrowthValueTitle'} onClick={() => {
|
||||||
|
setSelectPageTab(1)
|
||||||
|
}}>会员类型</div>
|
||||||
|
<div style={{ marginLeft: '48px' }} className={selectPageTab === 2 ? 'SummaryOfIntegralGrowthValueTitle SummaryOfIntegralGrowthValueTitleSelect' : 'SummaryOfIntegralGrowthValueTitle'} onClick={() => {
|
||||||
|
setSelectPageTab(2)
|
||||||
|
}}>会员等级</div>
|
||||||
|
</div> */}
|
||||||
|
|
||||||
|
<Row style={{ marginTop: "16px" }}>
|
||||||
|
<Col span={6}>
|
||||||
|
<ProForm
|
||||||
|
layout={'horizontal'}
|
||||||
|
formRef={formRef}
|
||||||
|
submitter={false}
|
||||||
|
onFinish={async (values: any) => {
|
||||||
|
console.log('valuesvaluesvaluesvalues', values);
|
||||||
|
handleGetData(values)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<ProFormSelect
|
||||||
|
label={"是否排除测试会员"}
|
||||||
|
name={"ExcludeTest"}
|
||||||
|
options={[{ label: '是', value: 1 }, { label: '否', value: 0 }]}
|
||||||
|
initialValue={1}
|
||||||
|
/>
|
||||||
|
</ProForm>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}></Col>
|
||||||
|
<Col span={6}>
|
||||||
|
<div style={{ display: 'flex', justifyContent: 'flex-end' }}>
|
||||||
|
<Button style={{ marginRight: '8px' }} onClick={() => {
|
||||||
|
formRef.current?.resetFields()
|
||||||
|
}}>重置</Button>
|
||||||
|
<Button type={"primary"} onClick={() => {
|
||||||
|
formRef.current?.submit()
|
||||||
|
}}>查询</Button>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div className="SummaryOfIntegralGrowthValueBottom">
|
||||||
|
{
|
||||||
|
membershipType && membershipType.length > 0 ?
|
||||||
|
<>
|
||||||
|
<div className="SummaryOfIntegralGrowthValueTitleBox">
|
||||||
|
<div className="SummaryOfIntegralGrowthValueTitle">会员类型{membershipTypeTotal ? `（${membershipTypeTotal}人）` : ""}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div className="SummaryOfIntegralGrowthValueContentBox">
|
||||||
|
<div className="SummaryOfIntegralGrowthValueItemOther">
|
||||||
|
{
|
||||||
|
membershipType.map((item: any) => {
|
||||||
|
return <div className="SummaryOfIntegralGrowthValueOtherItem" onClick={() => {
|
||||||
|
handleShowTableData(1, item.label)
|
||||||
|
}}>
|
||||||
|
<div className="otherItemTitle">{item.label === '0' ? '未授权用户' : MEMBERSHIPTYPEYNObj && item.label ? MEMBERSHIPTYPEYNObj[item.label] : ''}</div>
|
||||||
|
<div className="otherItemValue">{item.value}<span className="otherItemValueUnit">人</span></div>
|
||||||
|
<div className="addLabel">占比</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
<span className="addValue">{item.key ? item.key + '%' : ""}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
: ""
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
{
|
||||||
|
membershipLevel && membershipLevel.length > 0 ?
|
||||||
|
<>
|
||||||
|
<div className="SummaryOfIntegralGrowthValueTitleBox" style={{ marginTop: '32px' }}>
|
||||||
|
<div className="SummaryOfIntegralGrowthValueTitle">会员等级{membershipLevelTotal ? `（${membershipLevelTotal}人）` : ""}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div className="SummaryOfIntegralGrowthValueContentBox">
|
||||||
|
<div className="SummaryOfIntegralGrowthValueItemOther">
|
||||||
|
{
|
||||||
|
membershipLevel.map((item: any) => {
|
||||||
|
return <div className="SummaryOfIntegralGrowthValueOtherItem" onClick={() => {
|
||||||
|
handleShowTableData(2, item.label)
|
||||||
|
}}>
|
||||||
|
<div className="otherItemTitle">{item.label === '0' ? '未授权用户' : MEMBERSHIPLEVELYNObj && item.label ? MEMBERSHIPLEVELYNObj[item.label] : ''}</div>
|
||||||
|
<div className="otherItemValue">{item.value}<span className="otherItemValueUnit">人</span></div>
|
||||||
|
<div className="addLabel">占比</div>
|
||||||
|
<div className="otherItemAddBox">
|
||||||
|
<span className="addValue">{item.key ? item.key + '%' : ""}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
: ""
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<Drawer
|
||||||
|
width={'80%'}
|
||||||
|
title={currentDrawerTitle || ""}
|
||||||
|
visible={showDetail}
|
||||||
|
destroyOnClose
|
||||||
|
closable={false}
|
||||||
|
onClose={() => {
|
||||||
|
setSearchType(null)
|
||||||
|
setValueType(null)
|
||||||
|
setShowDetail(false)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<MemberInfor searchType={searchType} valueType={valueType} isComponent={true} />
|
||||||
|
</Drawer>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(({ user }: ConnectState) => ({
|
||||||
|
currentUser: user.currentUser
|
||||||
|
}))(SummaryOfIntegralGrowthValue);
|
||||||
@ -27,9 +27,12 @@ import { handleSetlogSave } from "@/utils/format";
|
|||||||
import MemberDetail from "./component/memberDetail";
|
import MemberDetail from "./component/memberDetail";
|
||||||
|
|
||||||
|
|
||||||
|
// searchType 1 会员类型 2 会员等级
|
||||||
|
// valueType 对应枚举值
|
||||||
|
// isComponent 判断是不是以组件形式
|
||||||
|
|
||||||
const memberInfor: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
const memberInfor: React.FC<{ currentUser: CurrentUser, searchType?: any, valueType?: any, isComponent?: boolean }> = (props) => {
|
||||||
const { currentUser } = props
|
const { currentUser, searchType, valueType, isComponent } = props
|
||||||
const downloadBtnRef = useRef<any>()
|
const downloadBtnRef = useRef<any>()
|
||||||
const draggleRef = React.createRef<any>()
|
const draggleRef = React.createRef<any>()
|
||||||
const actionRef = useRef<ActionType>();
|
const actionRef = useRef<ActionType>();
|
||||||
@ -677,9 +680,30 @@ const memberInfor: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
|||||||
return value ? `${n} ${value.replace('end', '')}` : ''
|
return value ? `${n} ${value.replace('end', '')}` : ''
|
||||||
})
|
})
|
||||||
console.log('sortstrsortstrsortstrsortstr', sortstr.toString());
|
console.log('sortstrsortstrsortstrsortstr', sortstr.toString());
|
||||||
const req: any = {
|
let req: any = {}
|
||||||
|
if (isComponent) {
|
||||||
|
req = {
|
||||||
SearchParameter: {
|
SearchParameter: {
|
||||||
PROVINCE_CODE: currentUser?.ProvinceCode || "",
|
// PROVINCE_CODE: currentUser?.ProvinceCode || "",
|
||||||
|
OWNERUNIT_ID: 911,
|
||||||
|
MEMBERSHIP_TYPE: searchType === 1 ? valueType : '',
|
||||||
|
MEMBERSHIP_LEVEL: searchType === 2 ? valueType : '',
|
||||||
|
MEMBERSHIP_STATE: 1000
|
||||||
|
},
|
||||||
|
keyWord: {
|
||||||
|
// PLATE_NUMBER
|
||||||
|
Key: "MEMBERSHIP_NAME,MEMBERSHIP_MOBILEPHONE,CERTIFICATE_NUMBER,MEMBERSHIP_CARD,MEMBERSHIP_ADDRESS",
|
||||||
|
value: params?.MEMBERSHIP_NAME || ""
|
||||||
|
},
|
||||||
|
PageIndex: params.current || 1,
|
||||||
|
PageSize: params?.pageSize,
|
||||||
|
sortstr: sortstr.length ? sortstr.toString() === "MEMBERGROWTH_VALUE asc" || sortstr.toString() === "MEMBERGROWTH_VALUE desc" ? "" : sortstr.toString() : "",
|
||||||
|
}
|
||||||
|
|
||||||
|
} else {
|
||||||
|
req = {
|
||||||
|
SearchParameter: {
|
||||||
|
// PROVINCE_CODE: currentUser?.ProvinceCode || "",
|
||||||
OWNERUNIT_ID: 911,
|
OWNERUNIT_ID: 911,
|
||||||
MEMBERSHIP_TYPE: params?.MEMBERSHIP_TYPE === "0" ? "0" : params?.MEMBERSHIP_TYPE,
|
MEMBERSHIP_TYPE: params?.MEMBERSHIP_TYPE === "0" ? "0" : params?.MEMBERSHIP_TYPE,
|
||||||
MEMBERSHIP_LEVEL: params?.MEMBERSHIP_LEVEL === "0" ? "" : params?.MEMBERSHIP_LEVEL,
|
MEMBERSHIP_LEVEL: params?.MEMBERSHIP_LEVEL === "0" ? "" : params?.MEMBERSHIP_LEVEL,
|
||||||
@ -694,6 +718,24 @@ const memberInfor: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
|||||||
PageSize: params?.pageSize,
|
PageSize: params?.pageSize,
|
||||||
sortstr: sortstr.length ? sortstr.toString() === "MEMBERGROWTH_VALUE asc" || sortstr.toString() === "MEMBERGROWTH_VALUE desc" ? "" : sortstr.toString() : "",
|
sortstr: sortstr.length ? sortstr.toString() === "MEMBERGROWTH_VALUE asc" || sortstr.toString() === "MEMBERGROWTH_VALUE desc" ? "" : sortstr.toString() : "",
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
// const req: any = {
|
||||||
|
// SearchParameter: {
|
||||||
|
// PROVINCE_CODE: currentUser?.ProvinceCode || "",
|
||||||
|
// OWNERUNIT_ID: 911,
|
||||||
|
// MEMBERSHIP_TYPE: params?.MEMBERSHIP_TYPE === "0" ? "0" : params?.MEMBERSHIP_TYPE,
|
||||||
|
// MEMBERSHIP_LEVEL: params?.MEMBERSHIP_LEVEL === "0" ? "" : params?.MEMBERSHIP_LEVEL,
|
||||||
|
// MEMBERSHIP_STATE: params?.MEMBERSHIP_STATE
|
||||||
|
// },
|
||||||
|
// keyWord: {
|
||||||
|
// // PLATE_NUMBER
|
||||||
|
// Key: "MEMBERSHIP_NAME,MEMBERSHIP_MOBILEPHONE,CERTIFICATE_NUMBER,MEMBERSHIP_CARD,MEMBERSHIP_ADDRESS",
|
||||||
|
// value: params?.MEMBERSHIP_NAME || ""
|
||||||
|
// },
|
||||||
|
// PageIndex: params.current || 1,
|
||||||
|
// PageSize: params?.pageSize,
|
||||||
|
// sortstr: sortstr.length ? sortstr.toString() === "MEMBERGROWTH_VALUE asc" || sortstr.toString() === "MEMBERGROWTH_VALUE desc" ? "" : sortstr.toString() : "",
|
||||||
|
// }
|
||||||
setSearchParams(params)
|
setSearchParams(params)
|
||||||
|
|
||||||
handleSetlogSave(`查看了会员账户管理列表`)
|
handleSetlogSave(`查看了会员账户管理列表`)
|
||||||
@ -716,7 +758,8 @@ const memberInfor: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
|||||||
|
|
||||||
// const allData = await handleGetMEMBERSHIPList(allReq)
|
// const allData = await handleGetMEMBERSHIPList(allReq)
|
||||||
// setTableData(allData)
|
// setTableData(allData)
|
||||||
}}
|
}
|
||||||
|
}
|
||||||
toolbar={{
|
toolbar={{
|
||||||
actions: []
|
actions: []
|
||||||
}}
|
}}
|
||||||
|
|||||||
@ -983,3 +983,44 @@ export async function handeDeleteMembershipRecord(params: any) {
|
|||||||
}
|
}
|
||||||
return data
|
return data
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 请求门店信息
|
||||||
|
export async function handeGetSERVERPARTSHOPList(params: any) {
|
||||||
|
const data = await requestEncryption(`/BaseInfo/GetSERVERPARTSHOPList`, {
|
||||||
|
method: 'POST',
|
||||||
|
data: { ...params, requestEncryption: true }
|
||||||
|
})
|
||||||
|
if (data.Result_Code !== 100) {
|
||||||
|
return data
|
||||||
|
}
|
||||||
|
return data.Result_Data
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 统计积分成长值汇总报表
|
||||||
|
export async function handeGetMembershipCount(params: any) {
|
||||||
|
const data = await requestEncryption(`/Member/GetMembershipCount`, {
|
||||||
|
method: 'POST',
|
||||||
|
data: { ...params, requestEncryption: true }
|
||||||
|
})
|
||||||
|
if (data.Result_Code !== 100) {
|
||||||
|
return data
|
||||||
|
}
|
||||||
|
return data.Result_Data
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 营销活动销售额统计
|
||||||
|
export async function handeGetMarketingSummary(params: any) {
|
||||||
|
const data = await requestEncryption(`/OnlineOrder/GetMarketingSummary`, {
|
||||||
|
method: 'POST',
|
||||||
|
data: { ...params, requestEncryption: true }
|
||||||
|
})
|
||||||
|
if (data.Result_Code !== 100) {
|
||||||
|
return data
|
||||||
|
}
|
||||||
|
return data.Result_Data
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user