123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489 |
- import React,{ Component } from 'react';
- import {
- Button,
- Modal, Select, Tag,
- Tooltip,
- } from "antd";
- import './index.less';
- import TabelContent from "../../../../common/tabelContent";
- import {splitUrl,getClockState} from "@/tools";
- import ImgList from "../../../../common/imgList";
- class DetailedList extends Component{
- constructor(props) {
- super(props);
- this.state= {
- columns: [
- {
- title: "编号",
- dataIndex: "key",
- key: "key",
- },
- {
- title: "面谈部门",
- dataIndex: "depName",
- key: "depName",
- },
- {
- title: "客户类型",
- dataIndex: "name",
- key: "name",
- },
- {
- title: "面谈客户",
- dataIndex: "name",
- key: "name",
- },
- {
- title: "面谈数",
- dataIndex: "quantity",
- key: "quantity",
- className: 'projectTable',
- width: 150,
- onCellClick: (record, event) => {
- event.stopPropagation();
- this.setState({
- visible1: true,
- aid: record.aid
- })
- },
- },
- {
- title: "签单数",
- dataIndex: "total",
- key: "total",
- className: 'projectTable',
- width: 150,
- onCellClick: (record, event) => {
- event.stopPropagation();
- this.setState({
- visible2: true,
- aid: record.aid
- })
- },
- },
- ],
- columns1: [
- {
- title: "编号",
- dataIndex: "key",
- key: "key",
- width: 45
- },
- {
- title: "客户名称",
- dataIndex: "nickname",
- key: "nickname",
- width: 140,
- render: (text) => {
- return (
- <div style={{
- width:140,
- wordBreak:'break-all',
- }}>{text}</div>
- )
- },
- },
- {
- title: "跟单人",
- dataIndex: "sname",
- key: "sname",
- width: 100,
- render: (text) => {
- return (
- <Tooltip title={text}>
- <div style={{
- width:100,
- overflow:'hidden',
- textOverflow: "ellipsis",
- whiteSpace:'nowrap',
- }}>{text}</div>
- </Tooltip>
- )
- },
- },
- {
- title: "公出申请人",
- dataIndex: "aname",
- key: "aname",
- width: 100,
- render: (text) => {
- return (
- <Tooltip title={text}>
- <div style={{
- width:100,
- overflow:'hidden',
- textOverflow: "ellipsis",
- whiteSpace:'nowrap',
- }}>{text}</div>
- </Tooltip>
- )
- },
- },
- {
- title: "申请时间",
- dataIndex: "createTimes",
- key: "createTimes",
- width: 130
- },
- {
- title: "公出时间",
- dataIndex: "releaseStarts",
- key: "releaseStarts",
- width: 130,
- render: (text, record) => (
- <div>
- <div>{text}</div>
- <div style={{paddingLeft:'44px'}}>至</div>
- <div>{record.releaseEnds}</div>
- </div>
- )
- },
- {
- title: "公出地点",
- dataIndex: "userName",
- key: "userName",
- width: 120,
- render: (text) => {
- return (
- <Tooltip title={text}>
- <div style={{
- width:120,
- overflow:'hidden',
- textOverflow: "ellipsis",
- whiteSpace:'nowrap',
- }}>{text}</div>
- </Tooltip>
- )
- },
- },
- {
- title: "公出时长(时)",
- dataIndex: "duration",
- key: "duration",
- width: 50
- },
- {
- title: "打卡时间",
- dataIndex: "clockInTimes",
- key: "clockInTimes",
- width: 130
- },
- {
- title: "审核状态",
- dataIndex: "status",
- key: "status",
- width: 40,
- render: (text) => (
- <Tag color={getClockState(text).color}>{getClockState(text).title}</Tag>
- )
- },
- {
- title: "打卡状态",
- dataIndex: "clockIn",
- key: "clockIn",
- width: 60,
- render: (text) => (
- text === 1 ? '已打卡' :
- text === 0 ? '未打卡' : ''
- )
- },
- {
- title: "公出原因/计划",
- dataIndex: "remarks",
- key: "remarks",
- width: 155,
- render: (text) => {
- return (<div style={{wordBreak:"break-all"}}>{text}</div>)
- },
- },
- {
- title: "补充",
- dataIndex: "supplement",
- key: "supplement",
- width: 155,
- render: (text) => {
- return (<div style={{wordBreak:"break-all"}}>{text}</div>)
- },
- },
- {
- title: "审核/指导",
- dataIndex: "auditInfo",
- key: "auditInfo",
- width: 155,
- render: (text) => {
- return (<div style={{wordBreak:"break-all"}}>{text}</div>)
- },
- },
- {
- title: "操作",
- dataIndex: "annexUrl",
- key: "annexUrl",
- render: (text,record) => (
- <div>
- <Button
- type={"primary"}
- onClick={(e) => {
- e.stopPropagation();
- let arr1 = text || [];
- let arr2 = record.photoUrl || [];
- this.setState({
- annexUrlArr:splitUrl(arr1, ",", globalConfig.avatarHost + "/upload"),
- photoUrlArr:splitUrl(arr2, ",", globalConfig.avatarHost + "/upload"),
- },()=>{
- this.setState({
- imgListVisible:true
- })
- })
- }}
- >
- 查看附件
- </Button>
- </div>
- )
- },
- ],
- }
- }
- searchList(){
- let arr = [
- {
- type:'departmentSelect',
- dataKey:'depId',
- placeholder:'请选择部门'
- },
- {
- type:'select',
- dataKey:'province',
- placeholder:'请选择省份',
- selectOptionList:()=>{
- let Province = [];
- provinceList.map(function(item) {
- let id = String(item.id)
- Province.push(
- <Select.Option value={id} key={item.name}>{item.name}</Select.Option>
- )
- });
- return Province
- },
- },
- //0 总数量 1总金额 2总面谈
- {
- type:'select',
- dataKey:'sort',
- placeholder:'请选择排序',
- selectList:[
- {
- value:'0',
- label:'按总数量排序'
- },
- {
- value:'1',
- label:'按总金额排序'
- },
- {
- value:'2',
- label:'按总面谈排序'
- },
- ]
- },
- {
- type:'times',
- title:'公出时间',
- dataKey:'date',
- format: 'YYYY/MM'
- },
- ]
- return arr;
- }
- searchList1(){
- let arr = [
- {
- type:'autoComplete',
- dataKey:'orderNo',
- api:'/api/admin/customer/listAdminByName',
- search:'adminName',
- placeholder:'请输入客户名称'
- },
- {
- type:'text',
- dataKey:'name',
- placeholder:'请输入客户名称'
- },
- {
- type:'departmentSelect',
- dataKey:'depId',
- placeholder:'请选择部门'
- },
- {
- type:'text',
- dataKey:'contractNo',
- placeholder:'请输入合同编号'
- },
- {
- type:'select',
- dataKey:'liquidationStatus',
- placeholder:'请选择结算状态',
- selectList:[
- {
- value:'0',
- label:'首付待付请'
- },
- {
- value:'1',
- label:'尾款待付清'
- },
- {
- value:'2',
- label:'已付清'
- }
- ]
- },
- {
- type:'select',
- dataKey:'approval',
- placeholder:'请选择特批状态',
- selectList:[
- {
- value:'0',
- label:'非特批'
- },
- {
- value:'1',
- label:'特批'
- }
- ]
- },
- {
- type:'select',
- dataKey:'amountStatus',
- placeholder:'请选择签单金额',
- selectList:[
- {
- value:'0',
- label:'10万元以下'
- },
- {
- value:'1',
- label:'10~20万元'
- },
- {
- value:'2',
- label:'20~30万元'
- },
- {
- value:'3',
- label:'30~40万元'
- },
- {
- value:'4',
- label:'40万元以上'
- },
- ]
- },
- {
- type:'times',
- title:'下单时间',
- dataKey:['starTime','endTime'],
- },
- ]
- return arr;
- }
- render() {
- return (
- <div>
- <Modal
- maskClosable={false}
- visible={this.props.visible}
- onOk={this.props.onCancel}
- onCancel={this.props.onCancel}
- width='1200px'
- title={this.props.recordInfor.province + '面谈表'}
- footer=''
- className="admin-desc-content">
- <div className="user-content">
- <TabelContent
- searchList={this.searchList()}
- columns={this.state.columns}
- tabelApi={'/api/admin/provinceFollowStatisticsList'}
- exportApi={'/api/admin/provinceFollowStatisticsListExprot'}
- query={{
- province:this.props.recordInfor.id,
- }}
- dataProcessing={(data)=>{
- let theArr = [];
- for (let i = 0; i < data.data.length; i++) {
- let thisdata = data.data[i];
- thisdata.key=i + 1;
- theArr.push(thisdata);
- }
- return theArr;
- }}
- />
- </div>
- {this.state.visible1 && <Modal
- maskClosable={false}
- visible={this.state.visible1}
- onOk={()=>{
- this.setState({
- visible1:false
- })
- }}
- onCancel={()=>{
- this.setState({
- visible1:false
- })
- }}
- width='1600px'
- title='公出详细列表'
- footer=''
- className="admin-desc-content">
- <div className="user-content">
- <TabelContent
- searchList={this.searchList1()}
- columns={this.state.columns1}
- tabelApi={'/api/admin/release/publicReleaseDtails'}
- exportApi={'/api/admin/release/publicReleaseDtails/export'}
- dataProcessing={(data)=>{
- let theArr = [];
- for (let i = 0; i < data.data.list.length; i++) {
- let thisdata = data.data.list[i];
- thisdata.key=(data.data.pageNo - 1) * data.data.pageSize + i + 1;
- theArr.push(thisdata);
- }
- return theArr;
- }}
- />
- </div>
- </Modal>}
- </Modal>
- {this.state.imgListVisible ? <Modal
- maskClosable={false}
- visible={this.state.imgListVisible}
- onOk={()=>{this.setState({
- imgListVisible:false
- })}}
- onCancel={()=>{this.setState({
- imgListVisible:false
- })}}
- width='500px'
- title='图片'
- footer=''>
- <div>
- <div>申请附件</div>
- <ImgList fileList={this.state.annexUrlArr} domId='publicStatistics'/>
- <div style={{paddingTop:'35px'}}>打卡照片</div>
- <ImgList fileList={this.state.photoUrlArr} domId='publicStatistics1'/>
- </div>
- </Modal> : null}
- </div>
- )
- }
- }
- export default DetailedList;
|