|
|
@@ -1,7 +1,7 @@
|
|
|
import React, { useState, useEffect } from 'react'
|
|
|
import { Row, Col, Button, Tooltip, Spin, Modal, Drawer } from 'antd'
|
|
|
import { LinkOne, LinkInterrupt } from '@icon-park/react'
|
|
|
-import { connect } from 'umi'
|
|
|
+import { connect, useModel } from 'umi'
|
|
|
import consts from '@/consts'
|
|
|
import Form from './Form'
|
|
|
import ClientDetail from '@/pages/Customer/Client/components/ClientDetail/Form'
|
|
|
@@ -10,9 +10,13 @@ import TabList from './TabList'
|
|
|
import { apiRoadpricingDetail, apiRoadPricingUnLinkClient } from '@/services/product'
|
|
|
import { useModal } from '@/components/ModalStore'
|
|
|
import CardClientDetail from '../CardDetail'
|
|
|
+import { WaterMark } from '@ant-design/pro-layout'
|
|
|
|
|
|
const CloudDetail = props => {
|
|
|
const { dispatch, updateKey = 'cloud', refresh, visible, dataId, projectType, ...resetDrawerProps } = props
|
|
|
+ const {
|
|
|
+ initialState: { currentUser }
|
|
|
+ } = useModel('@@initialState')
|
|
|
const dispatchModal = useModal()
|
|
|
const shouldUpdate = refresh?.[dataId ?? updateKey] || false
|
|
|
const refreshDetail = () => {
|
|
|
@@ -91,56 +95,61 @@ const CloudDetail = props => {
|
|
|
className="zh-drawer"
|
|
|
getContainer={() => document.getElementById('root')}>
|
|
|
<Spin spinning={state.loading}>
|
|
|
- <div className="sheet-box">
|
|
|
- <Row>
|
|
|
- <Col span={9} className="sheet-box-left">
|
|
|
- <div className="sheet-left-panel pr-4">
|
|
|
- <Form
|
|
|
- cloudUser={state.cloudUser}
|
|
|
+ <WaterMark
|
|
|
+ fontColor="rgba(0,0,0,.1)"
|
|
|
+ offsetTop={200}
|
|
|
+ content={`${currentUser.username} ${currentUser.telephone.slice(-4)}`}>
|
|
|
+ <div className="sheet-box">
|
|
|
+ <Row>
|
|
|
+ <Col span={9} className="sheet-box-left">
|
|
|
+ <div className="sheet-left-panel pr-4">
|
|
|
+ <Form
|
|
|
+ cloudUser={state.cloudUser}
|
|
|
+ actionPayload={{ main: updateKey, target: dataId }}
|
|
|
+ projectType={projectType}
|
|
|
+ />
|
|
|
+ {state.cloudUser.cld?.clientId ? (
|
|
|
+ <>
|
|
|
+ <div className="mt-4">
|
|
|
+ <CardClientDetail client={state.client} />
|
|
|
+ {/* <ClientDetail client={state.client} filterTag={true} updateKey={updateKey} /> */}
|
|
|
+ </div>
|
|
|
+ <div className="text-center mt-6">
|
|
|
+ <Tooltip placement="right" title="移除CLD客户">
|
|
|
+ <Button
|
|
|
+ type="primary"
|
|
|
+ ghost
|
|
|
+ size="small"
|
|
|
+ onClick={() => pricingUnLinkClient(state.cloudUser.cld?.clientId)}>
|
|
|
+ <LinkInterrupt size="14" />
|
|
|
+ <span className="ml-5px">移除CLD客户</span>
|
|
|
+ </Button>
|
|
|
+ </Tooltip>
|
|
|
+ </div>
|
|
|
+ </>
|
|
|
+ ) : (
|
|
|
+ <div className="text-center mt-6">
|
|
|
+ <Button type="primary" ghost size="small" onClick={handleConnectClient}>
|
|
|
+ <LinkOne size="14" />
|
|
|
+ <span className="ml-5px">关联CLD客户</span>
|
|
|
+ </Button>
|
|
|
+ </div>
|
|
|
+ )}
|
|
|
+ </div>
|
|
|
+ </Col>
|
|
|
+ <Col span={15} flex={{ flexDirection: 'column' }} className="sheet-box-right">
|
|
|
+ <TabList
|
|
|
actionPayload={{ main: updateKey, target: dataId }}
|
|
|
+ compilationList={state.compilationList}
|
|
|
+ cloudUser={state.cloudUser}
|
|
|
projectType={projectType}
|
|
|
+ ssoId={state.cloudUser.ssoId}
|
|
|
/>
|
|
|
- {state.cloudUser.cld?.clientId ? (
|
|
|
- <>
|
|
|
- <div className="mt-4">
|
|
|
- <CardClientDetail client={state.client} />
|
|
|
- {/* <ClientDetail client={state.client} filterTag={true} updateKey={updateKey} /> */}
|
|
|
- </div>
|
|
|
- <div className="text-center mt-6">
|
|
|
- <Tooltip placement="right" title="移除CLD客户">
|
|
|
- <Button
|
|
|
- type="primary"
|
|
|
- ghost
|
|
|
- size="small"
|
|
|
- onClick={() => pricingUnLinkClient(state.cloudUser.cld?.clientId)}>
|
|
|
- <LinkInterrupt size="14" />
|
|
|
- <span className="ml-5px">移除CLD客户</span>
|
|
|
- </Button>
|
|
|
- </Tooltip>
|
|
|
- </div>
|
|
|
- </>
|
|
|
- ) : (
|
|
|
- <div className="text-center mt-6">
|
|
|
- <Button type="primary" ghost size="small" onClick={handleConnectClient}>
|
|
|
- <LinkOne size="14" />
|
|
|
- <span className="ml-5px">关联CLD客户</span>
|
|
|
- </Button>
|
|
|
- </div>
|
|
|
- )}
|
|
|
- </div>
|
|
|
- </Col>
|
|
|
- <Col span={15} flex={{ flexDirection: 'column' }} className="sheet-box-right">
|
|
|
- <TabList
|
|
|
- actionPayload={{ main: updateKey, target: dataId }}
|
|
|
- compilationList={state.compilationList}
|
|
|
- cloudUser={state.cloudUser}
|
|
|
- projectType={projectType}
|
|
|
- ssoId={state.cloudUser.ssoId}
|
|
|
- />
|
|
|
- <LowerList log={state.log} serviceLog={state.serviceLog} />
|
|
|
- </Col>
|
|
|
- </Row>
|
|
|
- </div>
|
|
|
+ <LowerList log={state.log} serviceLog={state.serviceLog} />
|
|
|
+ </Col>
|
|
|
+ </Row>
|
|
|
+ </div>
|
|
|
+ </WaterMark>
|
|
|
</Spin>
|
|
|
</Drawer>
|
|
|
)
|