|
@@ -1,232 +1,234 @@
|
|
|
-import { tenderState } from '@/store/mobx'
|
|
|
-import consts from '@/utils/consts'
|
|
|
-import GC from '@grapecity/spread-sheets'
|
|
|
-import { SpreadSheets, Worksheet } from '@grapecity/spread-sheets-react'
|
|
|
-import { Button, message, Radio, Table, Tabs } from 'antd'
|
|
|
-import Modal from 'antd/lib/modal/Modal'
|
|
|
-import { RadioChangeEvent } from 'antd/lib/radio'
|
|
|
-import React, { useEffect, useState } from 'react'
|
|
|
-import { useActivate } from 'react-activation'
|
|
|
-import { apiContractIncome, apiSetTemplate } from './components/Modal/api'
|
|
|
-import Detail from './components/Tabs/Detail'
|
|
|
-import File from './components/Tabs/File'
|
|
|
-import Receivable from './components/Tabs/Receivable'
|
|
|
-import styles from './index.module.scss'
|
|
|
-GC.Spread.Common.CultureManager.culture("zh-cn")
|
|
|
-// GC.Spread.Sheets.LicenseKey = secret
|
|
|
-interface iGCsheetPorps {
|
|
|
- modalHandler: (type: string) => void
|
|
|
-}
|
|
|
-interface iTemplateState {
|
|
|
- attribution: string
|
|
|
- children: iTemplateState[] | undefined
|
|
|
- depth: number
|
|
|
- id: number
|
|
|
- isEnd: boolean
|
|
|
- leaf: boolean
|
|
|
- name: string
|
|
|
- parentId: number
|
|
|
- serial: string
|
|
|
-}
|
|
|
-interface iShowTemplateState {
|
|
|
- isShow: boolean
|
|
|
- template: string
|
|
|
- loading: boolean
|
|
|
-}
|
|
|
-const GCsheet: React.FC<iGCsheetPorps> = ({ modalHandler }) => {
|
|
|
- const [ sectionTemplate, setSectionTemplate ] = useState<iShowTemplateState>({
|
|
|
- isShow: false,
|
|
|
- template: '',
|
|
|
- loading: false
|
|
|
- })
|
|
|
- const [ projectTree, setProjectTree ] = useState<{}>({})
|
|
|
- const [ tempalte, setTempalte ] = useState<{template1: iTemplateState, template2: iTemplateState}>({
|
|
|
- template1: {
|
|
|
- attribution: '',
|
|
|
- children: undefined,
|
|
|
- depth: 0,
|
|
|
- id: 0,
|
|
|
- isEnd: false,
|
|
|
- leaf: false,
|
|
|
- name: '',
|
|
|
- parentId: 0,
|
|
|
- serial: ''
|
|
|
- },
|
|
|
- template2: {
|
|
|
- attribution: '',
|
|
|
- children: undefined,
|
|
|
- depth: 0,
|
|
|
- id: 0,
|
|
|
- isEnd: false,
|
|
|
- leaf: false,
|
|
|
- name: '',
|
|
|
- parentId: 0,
|
|
|
- serial: ''
|
|
|
- }
|
|
|
- })
|
|
|
- const { TabPane } = Tabs
|
|
|
- const initSpread = (spread: GC.Spread.Sheets.Workbook) => {
|
|
|
- spread.suspendPaint()
|
|
|
- spread.resumePaint()
|
|
|
- }
|
|
|
- useEffect(() => {
|
|
|
- initHandler()
|
|
|
- }, [])
|
|
|
- const initHandler = async () => {
|
|
|
- const data = await apiContractIncome(tenderState.bidsectionId)
|
|
|
- if (data.code === consts.RET_CODE.SUCCESS) {
|
|
|
- if (data.isTemplate && data.isTemplate === 1) {
|
|
|
- setSectionTemplate({
|
|
|
- ...sectionTemplate,
|
|
|
- isShow: true
|
|
|
- })
|
|
|
- setTempalte({
|
|
|
- ...tempalte,
|
|
|
- template1: data.sectionTemplate1,
|
|
|
- template2: data.sectionTemplate2
|
|
|
- })
|
|
|
- } else {
|
|
|
- setProjectTree(data.data)
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- const columns = [
|
|
|
- {
|
|
|
- title: '项目节',
|
|
|
- dataIndex: 'serial',
|
|
|
- width: '30%',
|
|
|
- // eslint-disable-next-line react/display-name
|
|
|
- render: (text: string, row: iTemplateState) => {
|
|
|
- const { attribution = '', serial = '' } = row
|
|
|
- return <span>{`${attribution}${serial}`}</span>
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '名称',
|
|
|
- dataIndex: 'name',
|
|
|
- width: '70%'
|
|
|
- }
|
|
|
- ]
|
|
|
- useActivate(() =>{
|
|
|
- initHandler()
|
|
|
- })
|
|
|
+// import { tenderStore } from '@/store/mobx'
|
|
|
+// import consts from '@/utils/consts'
|
|
|
+// import GC from '@grapecity/spread-sheets'
|
|
|
+// import { SpreadSheets, Worksheet } from '@grapecity/spread-sheets-react'
|
|
|
+// import { Button, message, Radio, Table, Tabs } from 'antd'
|
|
|
+// import Modal from 'antd/lib/modal/Modal'
|
|
|
+// import { RadioChangeEvent } from 'antd/lib/radio'
|
|
|
+// import React, { useEffect, useState } from 'react'
|
|
|
+// import { useActivate } from 'react-activation'
|
|
|
+// import { apiContractIncome, apiSetTemplate } from './components/Modal/api'
|
|
|
+// import Detail from './components/Tabs/Detail'
|
|
|
+// import File from './components/Tabs/File'
|
|
|
+// import Receivable from './components/Tabs/Receivable'
|
|
|
+// import styles from './index.module.scss'
|
|
|
+// GC.Spread.Common.CultureManager.culture("zh-cn")
|
|
|
+// // GC.Spread.Sheets.LicenseKey = secret
|
|
|
+// interface iGCsheetPorps {
|
|
|
+// modalHandler: (type: string) => void
|
|
|
+// }
|
|
|
+// interface iTemplateState {
|
|
|
+// attribution: string
|
|
|
+// children: iTemplateState[] | undefined
|
|
|
+// depth: number
|
|
|
+// id: number
|
|
|
+// isEnd: boolean
|
|
|
+// leaf: boolean
|
|
|
+// name: string
|
|
|
+// parentId: number
|
|
|
+// serial: string
|
|
|
+// }
|
|
|
+// interface iShowTemplateState {
|
|
|
+// isShow: boolean
|
|
|
+// template: string
|
|
|
+// loading: boolean
|
|
|
+// }
|
|
|
+// const GCsheet: React.FC<iGCsheetPorps> = ({ modalHandler }) => {
|
|
|
+// const [ sectionTemplate, setSectionTemplate ] = useState<iShowTemplateState>({
|
|
|
+// isShow: false,
|
|
|
+// template: '',
|
|
|
+// loading: false
|
|
|
+// })
|
|
|
+// const [ tempalte, setTempalte ] = useState<{template1: iTemplateState, template2: iTemplateState}>({
|
|
|
+// template1: {
|
|
|
+// attribution: '',
|
|
|
+// children: undefined,
|
|
|
+// depth: 0,
|
|
|
+// id: 0,
|
|
|
+// isEnd: false,
|
|
|
+// leaf: false,
|
|
|
+// name: '',
|
|
|
+// parentId: 0,
|
|
|
+// serial: ''
|
|
|
+// },
|
|
|
+// template2: {
|
|
|
+// attribution: '',
|
|
|
+// children: undefined,
|
|
|
+// depth: 0,
|
|
|
+// id: 0,
|
|
|
+// isEnd: false,
|
|
|
+// leaf: false,
|
|
|
+// name: '',
|
|
|
+// parentId: 0,
|
|
|
+// serial: ''
|
|
|
+// }
|
|
|
+// })
|
|
|
+// const { TabPane } = Tabs
|
|
|
+// const initSpread = (spread: GC.Spread.Sheets.Workbook) => {
|
|
|
+// spread.suspendPaint()
|
|
|
+// spread.resumePaint()
|
|
|
+// }
|
|
|
+// useEffect(() => {
|
|
|
+// initHandler()
|
|
|
+// }, [])
|
|
|
+// const initHandler = async () => {
|
|
|
+// const data = await apiContractIncome(tenderStore.bidsectionId)
|
|
|
+// if (data.code === consts.RET_CODE.SUCCESS) {
|
|
|
+// if (data.isTemplate && data.isTemplate === 1) {
|
|
|
+// setSectionTemplate({
|
|
|
+// ...sectionTemplate,
|
|
|
+// isShow: true
|
|
|
+// })
|
|
|
+// setTempalte({
|
|
|
+// ...tempalte,
|
|
|
+// template1: data.sectionTemplate1,
|
|
|
+// template2: data.sectionTemplate2
|
|
|
+// })
|
|
|
+// } else {
|
|
|
+// setProjectTree(data.data)
|
|
|
+// }
|
|
|
+// }
|
|
|
+// }
|
|
|
+// const columns = [
|
|
|
+// {
|
|
|
+// title: '项目节',
|
|
|
+// dataIndex: 'serial',
|
|
|
+// width: '30%',
|
|
|
+// // eslint-disable-next-line react/display-name
|
|
|
+// render: (text: string, row: iTemplateState) => {
|
|
|
+// const { attribution = '', serial = '' } = row
|
|
|
+// return <span>{`${attribution}${serial}`}</span>
|
|
|
+// }
|
|
|
+// },
|
|
|
+// {
|
|
|
+// title: '名称',
|
|
|
+// dataIndex: 'name',
|
|
|
+// width: '70%'
|
|
|
+// }
|
|
|
+// ]
|
|
|
+// useActivate(() =>{
|
|
|
+// initHandler()
|
|
|
+// })
|
|
|
|
|
|
- // modal 确认 - 回调
|
|
|
- const handleModalConfirm = async () => {
|
|
|
- setSectionTemplate({
|
|
|
- ...sectionTemplate,
|
|
|
- loading: true
|
|
|
- })
|
|
|
- if (!sectionTemplate.template) return message.error('请选择项目节模板!')
|
|
|
- const { code = -1 } = await apiSetTemplate(sectionTemplate.template, tenderState.bidsectionId)
|
|
|
- if (code === consts.RET_CODE.SUCCESS) {
|
|
|
- await initHandler()
|
|
|
- }
|
|
|
- setSectionTemplate({
|
|
|
- ...sectionTemplate,
|
|
|
- loading: false,
|
|
|
- isShow: false
|
|
|
- })
|
|
|
- }
|
|
|
- // radio 切换回调
|
|
|
- const handleRadioEvent = (e: RadioChangeEvent) => {
|
|
|
- if (e.target.checked) {
|
|
|
- setSectionTemplate({
|
|
|
- ...sectionTemplate,
|
|
|
- template: e.target.value
|
|
|
- })
|
|
|
- }
|
|
|
+// // modal 确认 - 回调
|
|
|
+// const handleModalConfirm = async () => {
|
|
|
+// setSectionTemplate({
|
|
|
+// ...sectionTemplate,
|
|
|
+// loading: true
|
|
|
+// })
|
|
|
+// if (!sectionTemplate.template) return message.error('请选择项目节模板!')
|
|
|
+// const { code = -1 } = await apiSetTemplate(sectionTemplate.template, tenderStore.bidsectionId)
|
|
|
+// if (code === consts.RET_CODE.SUCCESS) {
|
|
|
+// await initHandler()
|
|
|
+// }
|
|
|
+// setSectionTemplate({
|
|
|
+// ...sectionTemplate,
|
|
|
+// loading: false,
|
|
|
+// isShow: false
|
|
|
+// })
|
|
|
+// }
|
|
|
+// // radio 切换回调
|
|
|
+// const handleRadioEvent = (e: RadioChangeEvent) => {
|
|
|
+// if (e.target.checked) {
|
|
|
+// setSectionTemplate({
|
|
|
+// ...sectionTemplate,
|
|
|
+// template: e.target.value
|
|
|
+// })
|
|
|
+// }
|
|
|
|
|
|
- }
|
|
|
- return sectionTemplate.isShow ?
|
|
|
- <Modal
|
|
|
- visible={sectionTemplate.isShow}
|
|
|
- maskClosable={false}
|
|
|
- title="选择合同项目节模板"
|
|
|
- okText="确定"
|
|
|
- confirmLoading={sectionTemplate.loading}
|
|
|
- cancelText="关闭"
|
|
|
- closable={false}
|
|
|
- keyboard={false}
|
|
|
- onOk={() => handleModalConfirm()}
|
|
|
- width='70vw'
|
|
|
- >
|
|
|
- <div className={styles.modalWarnText}>默认项目节无法修改,可自行增加维护子节点</div>
|
|
|
- <div className={styles.modalTemplateContent}>
|
|
|
- <div className={styles.leftTemplate}>
|
|
|
- <div className="pi-pd-20">
|
|
|
- <Radio value="1" checked={sectionTemplate.template === '1'} onChange={(e: RadioChangeEvent) => handleRadioEvent(e)}><span className="pi-gray-color">项目节模板1</span></Radio>
|
|
|
- </div>
|
|
|
- <div className={styles.projectTable}>
|
|
|
- {
|
|
|
- tempalte.template1?.children && tempalte.template1?.children.length?
|
|
|
- <Table
|
|
|
- dataSource={tempalte.template1?.children}
|
|
|
- columns={columns}
|
|
|
- pagination={false}
|
|
|
- bordered
|
|
|
- scroll={{ y: '300px' }}
|
|
|
- rowKey={record => record.id}
|
|
|
- defaultExpandAllRows={true}
|
|
|
- >
|
|
|
- </Table> : ''
|
|
|
- }
|
|
|
- </div>
|
|
|
+// }
|
|
|
+// return sectionTemplate.isShow ?
|
|
|
+// <Modal
|
|
|
+// visible={sectionTemplate.isShow}
|
|
|
+// maskClosable={false}
|
|
|
+// title="选择合同项目节模板"
|
|
|
+// okText="确定"
|
|
|
+// confirmLoading={sectionTemplate.loading}
|
|
|
+// cancelText="关闭"
|
|
|
+// closable={false}
|
|
|
+// keyboard={false}
|
|
|
+// onOk={() => handleModalConfirm()}
|
|
|
+// width='70vw'
|
|
|
+// >
|
|
|
+// <div className={styles.modalWarnText}>默认项目节无法修改,可自行增加维护子节点</div>
|
|
|
+// <div className={styles.modalTemplateContent}>
|
|
|
+// <div className={styles.leftTemplate}>
|
|
|
+// <div className="pi-pd-20">
|
|
|
+// <Radio value="1" checked={sectionTemplate.template === '1'} onChange={(e: RadioChangeEvent) => handleRadioEvent(e)}><span className="pi-gray-color">项目节模板1</span></Radio>
|
|
|
+// </div>
|
|
|
+// <div className={styles.projectTable}>
|
|
|
+// {
|
|
|
+// tempalte.template1?.children && tempalte.template1?.children.length?
|
|
|
+// <Table
|
|
|
+// dataSource={tempalte.template1?.children}
|
|
|
+// columns={columns}
|
|
|
+// pagination={false}
|
|
|
+// bordered
|
|
|
+// scroll={{ y: '300px' }}
|
|
|
+// rowKey={record => record.id}
|
|
|
+// defaultExpandAllRows={true}
|
|
|
+// >
|
|
|
+// </Table> : ''
|
|
|
+// }
|
|
|
+// </div>
|
|
|
|
|
|
- </div>
|
|
|
- <div className={styles.rightTemplate}>
|
|
|
- <div className="pi-pd-20 pi-gray-color">
|
|
|
- <Radio value="2" checked={sectionTemplate.template === '2'} onChange={(e: RadioChangeEvent) => handleRadioEvent(e)}><span className="pi-gray-color">项目节模板2</span></Radio>
|
|
|
- </div>
|
|
|
- <div className={styles.projectTable}>
|
|
|
- {
|
|
|
- tempalte.template2?.children && tempalte.template2?.children.length? <Table
|
|
|
- dataSource={tempalte.template2?.children}
|
|
|
- columns={columns}
|
|
|
- bordered
|
|
|
- pagination={false}
|
|
|
- scroll={{ y: '300px' }}
|
|
|
- rowKey={record => record.id}
|
|
|
- defaultExpandAllRows={true}
|
|
|
- >
|
|
|
- </Table> : ''
|
|
|
- }
|
|
|
+// </div>
|
|
|
+// <div className={styles.rightTemplate}>
|
|
|
+// <div className="pi-pd-20 pi-gray-color">
|
|
|
+// <Radio value="2" checked={sectionTemplate.template === '2'} onChange={(e: RadioChangeEvent) => handleRadioEvent(e)}><span className="pi-gray-color">项目节模板2</span></Radio>
|
|
|
+// </div>
|
|
|
+// <div className={styles.projectTable}>
|
|
|
+// {
|
|
|
+// tempalte.template2?.children && tempalte.template2?.children.length? <Table
|
|
|
+// dataSource={tempalte.template2?.children}
|
|
|
+// columns={columns}
|
|
|
+// bordered
|
|
|
+// pagination={false}
|
|
|
+// scroll={{ y: '300px' }}
|
|
|
+// rowKey={record => record.id}
|
|
|
+// defaultExpandAllRows={true}
|
|
|
+// >
|
|
|
+// </Table> : ''
|
|
|
+// }
|
|
|
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </Modal>
|
|
|
- :
|
|
|
- <div className={styles.spreadContent}>
|
|
|
- <div className={styles.spreadSheets}>
|
|
|
- <SpreadSheets
|
|
|
- workbookInitialized={(spread: GC.Spread.Sheets.Workbook)=> initSpread(spread)}
|
|
|
- showHorizontalScrollbar={false}
|
|
|
- showVerticalScrollbar={false}
|
|
|
- tabStripVisible={false}
|
|
|
- >
|
|
|
- <Worksheet rowHeaderVisible={false}>
|
|
|
- </Worksheet>
|
|
|
- </SpreadSheets>
|
|
|
- </div>
|
|
|
- <div className={styles.extraControl}>
|
|
|
- <Tabs
|
|
|
- type="card"
|
|
|
- size="small"
|
|
|
- defaultActiveKey="1"
|
|
|
- tabBarExtraContent={{ right: <div className="pi-mg-right-5"><Button type="primary" size="small" danger className="pi-mg-right-3" onClick={() => modalHandler('close')}>关闭合同</Button><Button type="primary" size="small" onClick={() => modalHandler('edit')}>编辑合同</Button></div> }}>
|
|
|
- <TabPane key="1" tab="合同详情">
|
|
|
- <Detail></Detail>
|
|
|
- </TabPane>
|
|
|
- <TabPane key="2" tab="合同回款">
|
|
|
- <Receivable></Receivable>
|
|
|
- </TabPane>
|
|
|
- <TabPane key="3" tab="合同文件">
|
|
|
- <File></File>
|
|
|
- </TabPane>
|
|
|
- </Tabs>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-}
|
|
|
+// </div>
|
|
|
+// </div>
|
|
|
+// </div>
|
|
|
+// </Modal>
|
|
|
+// :
|
|
|
+// <div className={styles.spreadContent}>
|
|
|
+// <div className={styles.spreadSheets}>
|
|
|
+// <SpreadSheets
|
|
|
+// workbookInitialized={(spread: GC.Spread.Sheets.Workbook)=> initSpread(spread)}
|
|
|
+// showHorizontalScrollbar={false}
|
|
|
+// showVerticalScrollbar={false}
|
|
|
+// tabStripVisible={false}
|
|
|
+// >
|
|
|
+// <Worksheet rowHeaderVisible={false}>
|
|
|
+// </Worksheet>
|
|
|
+// </SpreadSheets>
|
|
|
+// </div>
|
|
|
+// <div className={styles.extraControl}>
|
|
|
+// <Tabs
|
|
|
+// type="card"
|
|
|
+// size="small"
|
|
|
+// defaultActiveKey="1"
|
|
|
+// tabBarExtraContent={{ right: <div className="pi-mg-right-5"><Button type="primary" size="small" danger className="pi-mg-right-3" onClick={() => modalHandler('close')}>关闭合同</Button><Button type="primary" size="small" onClick={() => modalHandler('edit')}>编辑合同</Button></div> }}>
|
|
|
+// <TabPane key="1" tab="合同详情">
|
|
|
+// <Detail></Detail>
|
|
|
+// </TabPane>
|
|
|
+// <TabPane key="2" tab="合同回款">
|
|
|
+// <Receivable></Receivable>
|
|
|
+// </TabPane>
|
|
|
+// <TabPane key="3" tab="合同文件">
|
|
|
+// <File></File>
|
|
|
+// </TabPane>
|
|
|
+// </Tabs>
|
|
|
+// </div>
|
|
|
+// </div>
|
|
|
+// }
|
|
|
|
|
|
-export default GCsheet
|
|
|
+// // function formatSheetData(tree: iTemplateState[]): {
|
|
|
+
|
|
|
+// // }
|
|
|
+// export default GCsheet
|