import React, { useRef, useState, Suspense,useEffect } from 'react'; import moment from 'moment'; // 时间相关引用,没有使用可以删除 import { connect } from 'umi'; import useRequest from '@ahooksjs/use-request'; // 请求数据的引用 import Draggable from 'react-draggable'; import ProTable from '@ant-design/pro-table'; import ProDescriptions from '@ant-design/pro-descriptions'; import ProForm, { ProFormDatePicker,ProFormDateTimePicker,ProFormRadio, ProFormMoney, ProFormSelect, ProFormText, ProFormTextArea, ProFormUploadButton } from '@ant-design/pro-form'; import { MenuFoldOutlined, PlusOutlined, ExclamationCircleOutlined } from '@ant-design/icons'; import { PageContainer } from '@ant-design/pro-layout'; import { Button, Col, Drawer, message, Row, Popconfirm, Space, Image, Modal, Form, Switch, Upload, Tooltip, Descriptions, TreeSelect } from 'antd'; import type { CurrentUser } from "umi"; import type { ConnectState } from '@/models/connect'; import type { ActionType, ProColumns } from '@ant-design/pro-table'; import type { ProDescriptionsItemProps } from '@ant-design/pro-descriptions'; import type { FormInstance } from 'antd'; import type { BUDGETDETAIL_AHModel } from './data'; import {getFieldEnum, getFieldEnumTree,getFieldEnumName} from "@/services/options"; // 枚举的引用,没有使用可以删除 import {getList, delbudgetdetail_ah, updatebudgetdetail_ah, handleSaveList, handleDetailTableList} from './service'; import {black} from "chalk"; import {updatebudgetproject_ah} from "@/pages/Test/financialBudget/service"; // 接口相关对象的引用 const handelDelete = async (budgetdetail_ahid: number) => { const hide = message.loading('正在删除...'); try { const result = await delbudgetdetail_ah(budgetdetail_ahid); hide(); if (result.Result_Code !== 100) { message.error(`${result.Result_Desc}` || `${result.Result_Code}:删除失败`); return false; } message.success('删除成功!'); return true; } catch (error) { hide(); message.error('删除失败'); return false; } }; const handleAddUpdate = async (fields: BUDGETDETAIL_AHModel) => { const hide = message.loading('正在提交...'); const result = await updatebudgetdetail_ah(fields); hide(); if (result.Result_Code !== 100) { message.error(`${result.Result_Desc}` || `${result.Result_Code}:提交失败`); return false; } return result.Result_Data ? result.Result_Data : true; }; const BUDGETDETAIL_AHTable: React.FC<{ currentUser: CurrentUser | undefined,currentRowParent?: any}> = (props) => { const { currentUser,currentRowParent } = props const actionRef = useRef(); const formRef = useRef(); const [currentRow, setCurrentRow] = useState(); const [showDetail, setShowDetail] = useState(); const [modalVisible, handleModalVisible] = useState(); const [confirmLoading, handleConfirmLoading] = useState(false) // 弹出框的内容表单是否在提交 const [searchParams, setSearchParams] = useState(); // 悬浮框内的表格数据 const [modalTableData,setModalTableData] = useState([]) const [budgeType,setBudgeType] = useState(0) // 科目代码枚举解析 const { data: account_codeTree } = useRequest(async () => { const data = await getFieldEnumTree({ FieldExplainField: 'ACCOUNT_CODE', sessionName: 'ACCOUNT_CODE' }) return data }) // 数据状态(0:删除;1:有效)枚举解析 const { data: isvalidTree = [] } = useRequest(async () => { return await getFieldEnumTree({ FieldExplainField: 'ISVALID', sessionName: 'ISVALID' }) }) // 定义列表字段内容 const columns: ProColumns[] = [ { title: '查询条件', dataIndex: 'searchKey', hideInTable: true, hideInDescriptions: true, fieldProps: { placeholder: "请输入备注说明" } }, { dataIndex: 'ACCOUNT_CODE', title: '科目代码', valueType: 'treeSelect', align: 'center', hideInDescriptions: true, // request: async () => { // return await getFieldEnumTree({ FieldExplainField: 'ACCOUNT_CODE', sessionName: 'ACCOUNT_CODE' }); // }, render: (_, record) => { return { // 点击科目代码时 打开抽屉 展示详情 setCurrentRow(record); setShowDetail(true); }}>{ getFieldEnumName("ACCOUNT_CODE",record?.ACCOUNT_CODE) } }, }, { dataIndex: 'STATISTICS_MONTH', title: '统计月份', align: 'center', hideInSearch: true, render:(_, record)=>{ return {record.STATISTICS_MONTH} } }, { dataIndex: 'BUDGETDETAIL_AMOUNT', title: '预算金额', valueType: 'money', align: 'center', hideInSearch: true, }, { dataIndex: 'REVENUE_AMOUNT', title: '实际营收额', align: 'center', hideInSearch: true, }, { dataIndex: 'UPDATE_TIME', title: '更新日期', valueType: 'date', align: 'center', hideInSearch: true, hideInTable: true, }, // { // dataIndex: 'BUDGETDETAIL_AH_STATE', // title: '数据状态', // valueType: 'select', // align: 'center', // // request: async () => { // // return await getFieldEnumTree({ FieldExplainField: 'ISVALID', sessionName: 'ISVALID' }); // // }, // }, { dataIndex: 'STAFF_NAME', title: '操作人员', hideInSearch: true, hideInTable: true, }, { dataIndex: 'OPERATE_DATE', title: '操作时间', valueType: 'fromNow', hideInSearch: true, hideInTable: true, }, { dataIndex: 'BUDGETDETAIL_AH_DESC', title: '备注说明', align: 'center', hideInSearch: true, }, { title: '查询月份', dataIndex: 'search_months', valueType: 'dateRange', hideInTable: true, hideInDescriptions: true, search: { transform: (value) => { return { // format中的格式决定入参内容 STATISTICS_MONTH_Start: moment(value[0]).startOf("month").format('YYYY-MM-DD'), STATISTICS_MONTH_End: moment(value[1]).endOf("month").format('YYYY-MM-DD'), }; }, }, fieldProps: { picker: "month", format: 'YYYY-MM', }, initialValue: [moment().add(-1, 'day').format('YYYY-MM'), moment().add(-1, 'day').format('YYYY-MM')], }, { dataIndex: 'option', title: '操作', valueType: 'option', hideInSearch: true, render: (_, record) => { return ( { console.log('record222',record) const value = {...record} if (record.STATISTICS_MONTH % 100 >13){ value.BUDGETTPE=3 setBudgeType(3) }else if(record.STATISTICS_MONTH % 100 <13){ value.BUDGETTPE=1 setBudgeType(1) }else{ value.BUDGETTPE=2 setBudgeType(2) } if (value.BUDGETTPE===1){ value.STATISTICS_MONTH = moment(value.STATISTICS_MONTH.toString()).format('YYYY-MM') }else{ value.month = value.STATISTICS_MONTH value.STATISTICS_MONTH = undefined } setCurrentRow({ ...value }); handleModalVisible(true); }} > 编辑 { const sucesse = await handelDelete(record.BUDGETDETAIL_AH_ID); if (sucesse && actionRef.current) { actionRef.current.reload(); } }} > 删除 ); }, }, ]; const modalColumns: ProColumns[] = [ { title: '查询条件', dataIndex: 'searchKey', hideInTable: true, hideInDescriptions: true, fieldProps: { placeholder: "请输入备注说明" } }, { dataIndex: 'ACCOUNT_CODE', title: '科目名称', valueType: 'treeSelect', align: 'center', hideInDescriptions: true, // request: async () => { // return await getFieldEnumTree({ FieldExplainField: 'ACCOUNT_CODE', sessionName: 'ACCOUNT_CODE' }); // }, render: (_, record) => { return { // 点击科目代码时 打开抽屉 展示详情 setCurrentRow(record); setShowDetail(true); }}>{ getFieldEnumName("ACCOUNT_CODE",record?.ACCOUNT_CODE) } }, }, { dataIndex: 'STATISTICS_MONTH', title: '统计月份', align: 'center', hideInSearch: true, render:(_, record)=>{ return {record.STATISTICS_MONTH} } }, { dataIndex: 'BUDGETDETAIL_AMOUNT', title: '预算金额', valueType: 'money', align: 'center', hideInSearch: true, }, { dataIndex: 'REVENUE_AMOUNT', title: '实际营收额', align: 'center', hideInSearch: true, }, { dataIndex: 'UPDATE_TIME', title: '更新日期', valueType: 'date', align: 'center', hideInSearch: true, hideInTable: true, }, // { // dataIndex: 'BUDGETDETAIL_AH_STATE', // title: '数据状态', // valueType: 'select', // align: 'center', // // request: async () => { // // return await getFieldEnumTree({ FieldExplainField: 'ISVALID', sessionName: 'ISVALID' }); // // }, // }, { dataIndex: 'STAFF_NAME', title: '操作人员', hideInSearch: true, hideInTable: true, }, { dataIndex: 'OPERATE_DATE', title: '操作时间', valueType: 'fromNow', hideInSearch: true, hideInTable: true, }, { dataIndex: 'BUDGETDETAIL_AH_DESC', title: '备注说明', align: 'center', hideInSearch: true, }, { title: '查询月份', dataIndex: 'search_months', valueType: 'dateRange', hideInTable: true, hideInDescriptions: true, search: { transform: (value) => { return { // format中的格式决定入参内容 STATISTICS_MONTH_Start: moment(value[0]).startOf("month").format('YYYY-MM-DD'), STATISTICS_MONTH_End: moment(value[1]).endOf("month").format('YYYY-MM-DD'), }; }, }, fieldProps: { picker: "month", format: 'YYYY-MM', }, initialValue: [moment().add(-1, 'day').format('YYYY-MM'), moment().add(-1, 'day').format('YYYY-MM')], }, { dataIndex: 'option', title: '操作', valueType: 'option', hideInSearch: true, render: (_, record) => { return ( { const list: any = JSON.parse(JSON.stringify(modalTableData)) if (list && list.length>0){ const newList: any = [] list.forEach((item: any)=>{ if (item.key!==record.key){ newList.push(item) } }) newList.forEach((item: any,index: number)=>{ item.key = index + 1 }) setModalTableData(newList) } }} > 删除 ); }, }, ]; return ( style={{height:'calc(100vh - 135px)',background:'#fff'}} scroll={{y:'calc(100vh - 410px)'}} rowKey={(record) => { return `${record?.BUDGETDETAIL_AH_ID}` }} formRef={formRef} headerTitle="安徽财务预算明细表列表" // 列表表头 actionRef={actionRef} search={{ span: 6, labelWidth: 'auto' }} // 请求数据 request={async (params, sorter) => { // 排序字段 const sortstr = Object.keys(sorter).map(n => { const value = sorter[n] return value ? `${n} ${value.replace('end', '')}` : '' }) const searchWholeParams = { searchParameter: { BUDGETPROJECT_AH_ID:props.currentRowParent.BUDGETPROJECT_AH_ID, BUDGETDETAIL_AH_STATE:1 }, keyWord: params.searchKey ? { key: "BUDGETDETAIL_AH_DESC", value: params.searchKey } : null, // 关键词查询 sortstr: sortstr.length ? sortstr.toString() : "", BUDGETPROJECT_AH_ID:params.BUDGETPROJECT_AH_ID, pagesize: 999999 } setSearchParams(searchWholeParams) // searchWholeParams.pagesize = params.pageSize const data = await handleDetailTableList(searchWholeParams); return data; }} columns={columns} toolbar={{ actions: [ // 新增按钮 , ], }} options={false} // 隐藏刷新组件 pagination={{ defaultPageSize: 10 }} /> { setCurrentRow(undefined); setShowDetail(false); }} closable={false} > {currentRow?.BUDGETDETAIL_AH_ID && ( column={2} // title={getFieldEnumName("ACCOUNT_CODE",currentRow?.ACCOUNT_CODE)} request={async () => ({ data: currentRow || {}, })} params={{ id: currentRow?.BUDGETDETAIL_AH_ID, }} columns={columns as ProDescriptionsItemProps[]} /> )} { formRef.current?.resetFields(); setCurrentRow(undefined); setBudgeType(1) }} onCancel={() => { handleConfirmLoading(false) handleModalVisible(false) setModalTableData([]) }} onOk={async () => { // 提交框内的数据 if (currentRow){ formRef?.current?.validateFields().then(async (res)=>{ console.log('res.BUDGETTPE',res.BUDGETTPE) console.log('currentRow',currentRow) const newValue = [{ ...res, BUDGETDETAIL_AH_ID: currentRow.BUDGETDETAIL_AH_ID, STATISTICS_MONTH: res.BUDGETTPE!==1?currentRow.month:res.STATISTICS_MONTH }]; console.log('newValue',newValue) const data = await handleSaveList(newValue); console.log('data',data) if (data.Result_Code===100){ message.success(data.Result_Desc) actionRef.current?.reload() handleConfirmLoading(false) handleModalVisible(false) setModalTableData([]) }else{ message.error(data.Result_Desc) } }) }else{ if (modalTableData && modalTableData.length>0){ const list: any = JSON.parse(JSON.stringify(modalTableData)) list.forEach((item: any)=>{ if (item.BUDGETTPE===1){ item.STATISTICS_MONTH = moment(item.STATISTICS_MONTH).format('YYYYMM') } item.BUDGETPROJECT_AH_ID = props.currentRowParent.BUDGETPROJECT_AH_ID }) const data = await handleSaveList(list) console.log('data231231232',data) if (data.Result_Code===100){ message.success(data.Result_Desc) actionRef.current?.reload() handleConfirmLoading(false) handleModalVisible(false) setModalTableData([]) }else{ message.error(data.Result_Desc) } }else{ message.error('请先添加数据') } } }} > layout={'horizontal'} wrapperCol={{ span: 16 }} // 表单项 填写部分所占的栅格数 labelCol={{ span: 6 }} // 表单项 标题所占的栅格数 formRef={formRef} autoFocusFirstInput submitter={false} preserve={false} initialValues={currentRow} > { console.log('val',val) setBudgeType(val.target.value) if (val.target.value ===2 || val.target.value===3){ formRef.current?.setFieldsValue({STATISTICS_MONTH:undefined}) formRef.current?.setFieldsValue({REVENUE_AMOUNT:''}) } } }} rules={[ { required: true, message: '请选择预算类型', }, ]} /> { currentRow? '': <>
}
); }; export default connect(({ user }: ConnectState) => ({ currentUser: user.currentUser }))(BUDGETDETAIL_AHTable);