import React from "react"; import $ from "jquery/src/ajax"; import moment from "moment"; import { Button, Form, Input, Spin, Table, Select, message, Tabs, DatePicker, AutoComplete, Modal, Upload, Icon, Tooltip, Tag, } from "antd"; import { ChooseList } from "../../../order/orderNew/chooseList"; import { ShowModal, } from "@/tools.js" import { accountType, accountStatus } from "@/dataDic"; import ZhuanjiaoDetail from "@/zhuanjiaoDetail.jsx"; import IntentionDetail from "./intentionDetail/intentionDetail"; import ShowModalDiv from "@/showModal.jsx"; import FollowDetail from "./followDetail" import Outbound from '../components/outbound'; import './clue.less'; const FormItem = Form.Item; const { RangePicker } = DatePicker; const { TabPane } = Tabs; const LimitedProject = React.createClass({ getInitialState() { return { searchValues: { clueProcess: this.props.intentionState == 1 ? "0" : "" }, // 列表筛选条件 loading: false, //加载动画 changeList: undefined, // 更改后的表格显示数据 dataSource: [], // 列表数据 fjlist: [], pagination: { defaultCurrent: 1, defaultPageSize: 10, showQuickJumper: true, pageSize: 10, onChange: function (page) { this.loadData(page); }.bind(this), showTotal: function (total) { return "共" + total + "条数据"; }, }, columns: [ { title: "客户名称", dataIndex: "nickname", key: "nickname", width: 200, }, { title: "联系人", dataIndex: "contacts", key: "contacts", }, { title: "联系电话", dataIndex: "contactMobile", key: "contactMobile", width: 100, }, { title: "所属人", dataIndex: "adminName", key: "adminName", isSelect: "jl", }, { title: "转交人", dataIndex: "clueAname", key: "clueAname", isSelect: "yxy", }, { title: "状态", dataIndex: "clueProcess", key: "clueProcess", render: (text, record) => { return (
{["待分配", "已分配", "已回退", "已释放", "已领取"][text]}
); }, }, { title: "线索释放天数", dataIndex: "days", key: "days", width: 60, }, { title: "转入时间", dataIndex: "clueTransferTime", key: "clueTransferTime", render: (text, record) => { return (
{text}
); }, }, { title: "操作", dataIndex: "op", key: "op", render: (text, record) => { return (
{ ((record.clueProcess == 1 && this.props.intentionState == 2) || ((record.clueProcess == 0 || record.clueProcess == 2) && this.props.intentionState == 1) ) && } {this.props.intentionState == 2 && }
); }, }, ], customerArr: [], selectedRowKeys: [], selectedRows: [], zhuanjiaoVisible: false, categoryArr: [], upLoad: { customRequest: (options) => { this.setState({ upLoadFileLoading: true, }) let params = new FormData(); params.append("file", options.file); $.ajax({ method: "post", url: globalConfig.context + "/api/admin/userClue/import", async: true, cache: false, contentType: false, processData: false, data: params }).done( function (data) { this.setState({ upLoadFileLoading: false, }) if (data.error.length === 0) { if (data.data.errorCount == 0) { message.success("上传成功!"); } else { Modal.info({ title: "提示", width: 500, content: ( {data.data.errorCount}个客户信息导入失败!
), onOk() { }, }); } this.loadData(); } else { message.warning(data.error[0].message); this.loadData(); } }.bind(this) ).always( function () { this.loadData(); this.setState({ upLoadFileLoading: false, }); }.bind(this) ); }, name: "file", action: globalConfig.context + "/api/admin/userClue/import", showUploadList: false, }, status: this.props.intentionState, }; }, componentWillMount() { this.defaultcolumns() }, defaultcolumns() { const newArr = []; this.state.columns.forEach((item) => { if (this.props.intentionState == 1) { if (item.isSelect == "yxy") { return } else { newArr.push(item); } } else if (this.props.intentionState == 2) { if (item.isSelect == "jl") { return } else { newArr.push(item); } } }); this.setState({ changeList: newArr, }, () => { this.loadData(); }); }, componentWillReceiveProps(prevProps) { if (prevProps.intentionState !== this.state.status) { this.setState({ status: prevProps.intentionState }, () => { this.defaultcolumns() }) } }, // 列表接口 loadData(pageNo) { const { searchValues, pagination } = this.state; this.setState({ loading: true, }); let datas = Object.assign(searchValues, { pageNo: pageNo || 1, pageSize: pagination.pageSize, shiroType: this.props.intentionState, }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/userClue/list", data: datas, success: function (data) { ShowModal(this); this.setState({ loading: false, }); let theArr = []; if (data.error && data.error.length === 0) { if (data.data) { pagination.current = data.data.pageNo; pagination.total = data.data.totalCount; if (data.data && data.data.list && !data.data.list.length) { pagination.current = 0 pagination.total = 0 }; this.setState({ dataSource: data.data.list, pagination: this.state.pagination, pageNo: data.data.pageNo, }); } } else { message.warning(data.error[0].message); } }.bind(this), }).always( function () { this.setState({ loading: false, }); }.bind(this) ); }, // 搜索 search() { this.loadData(); }, // 重置 reset() { this.setState({ searchValues: { clueProcess: this.props.intentionState == 1 ? "0" : "" }, }, () => { this.defaultcolumns(); }) }, changeList(arr) { const newArr = []; this.state.columns.forEach((item) => { arr.forEach((val) => { if (val === item.title) { newArr.push(item); } }); }); this.setState({ changeList: newArr, }); }, supervisor(e) { $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/customer/listAdminByName", data: { adminName: e, }, success: function (data) { let thedata = data.data; if (!thedata) { if (data.error && data.error.length) { message.warning(data.error[0].message); } thedata = {}; } this.setState({ customerArr: thedata, }); }.bind(this), }).always( function () { this.setState({ loading: false, }); }.bind(this) ); }, selectAuto(value, options) { this.setState({ auto: value, }); }, blurChange(e) { let theType = ""; let contactLists = this.state.customerArr || []; if (e) { contactLists.map(function (item) { if (item.name == e.toString()) { theType = item.id; } }); } this.setState({ theTypes: theType, }); }, httpChange(e) { if (e.length >= 1) { this.supervisor(e); } this.setState({ auto: e, }); }, showConfirm() { let _this = this; Modal.confirm({ title: "提示", content: ( 确定要转交以下客户吗? {this.state.selectedRows.map((value, index) => (
{value.nickname}
))}
), onOk() { _this.changeAssigner(0) }, onCancel() { }, }); }, showConfirms() { let _this = this; Modal.confirm({ title: "您确定将以下客户移至公共库吗?", content: ( 移除后,以下客户将被别人领取! {this.state.selectedRows.map((value, index) => (
{value.nickname}
))}
), onOk() { _this.changeAssigner(2); }, onCancel() { }, }); }, // 批量转交,移至公共库 changeAssigner(type, uid) { const _this = this; if (type == 0 && !this.state.theTypes) { message.warning("请输入转交人姓名"); return } let changeIds = ""; if (type == 0 || type == 2) { for (let idx = 0; idx < this.state.selectedRows.length; idx++) { let rowItem = this.state.selectedRows[idx]; if (rowItem.id) { changeIds = this.state.selectedRows.length - 1 === idx ? changeIds + rowItem.id : changeIds + rowItem.id + ","; } } } else if (type == 1 || type == 3) { changeIds = uid } let loading = message.loading("加载中..."); $.ajax({ method: "post", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/userClue/transfer", data: { uid: changeIds, type, transferId: type == 0 ? this.state.theTypes : undefined, }, }).done( function (data) { loading(); this.setState({ selList: [], }) if (!data.error.length) { this.setState({ auto: "", loading: false, selectedRowKeys: [], }); if (data.data == 1) { message.success(["转交成功!", "退回成功!", "成功移至公共库!", "领取成功!"][type]); _this.loadData(); } else { data.data.forEach(function (e) { message.warning(e) }) } } else { message.warning(data.error[0].message); } }.bind(this) ); }, zhuanjiaoDetail(record) { this.setState({ zhuanjiaoVisible: true, zhuanjiaoId: record.id, }); }, zhuanjiaoDetailCancel() { this.setState({ zhuanjiaoVisible: false, }); }, tableRowClick(record, index) { this.state.visitModul = false; this.setState({ modalVisible: true, basicState: true, contactState: true, modalName: record.name, RowData: record, }); }, closeDesc(e, s) { this.state.basicState = e; this.state.visitModul = e; this.state.modalVisible = e; this.state.visitModuls = e; this.state.showDesc = e; this.setState({ tabsKey: "", }); if (s) { this.loadData(this.state.ispage); } }, //查看跟进记录列表 loadVisit(pageNo) { this.setState({ loading: true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + '/api/admin/customer/listFollowHistory', data: { pageNo: pageNo || 1, pageSize: this.state.paginations.pageSize, uid: this.state.RowData.id, //名称1 }, success: function (data) { let theArr = []; if (data.error.length || data.data.list == "") { if (data.error && data.error.length) { message.warning(data.error[0].message); }; } else { for (let i = 0; i < data.data.list.length; i++) { let thisdata = data.data.list[i]; theArr.push(thisdata); }; this.state.paginations.current = data.data.pageNo; this.state.paginations.total = data.data.totalCount; this.setState({ ispage: data.data.pageNo }) }; if (data.data.list && !data.data.list.length) { this.state.paginations.current = 0; this.state.paginations.total = 0; }; this.setState({ visitArrList: theArr, paginations: this.state.paginations }); }.bind(this), }).always(function () { this.setState({ loading: false }); }.bind(this)); }, // 模版下载 exportExec() { message.config({ duration: 20, }); let loading = message.loading("下载中..."); this.setState({ exportPendingLoading: true, }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/userClue/exportTemplate", success: function (data) { if (data.error.length === 0) { this.download(data.data); } else { message.warning(data.error[0].message); } }.bind(this), }).always( function () { loading(); this.setState({ exportPendingLoading: false, }); }.bind(this) ); }, download(fileName) { window.location.href = globalConfig.context + "/open/download?fileName=" + fileName + "&delete=false"; }, followUp(e) { const { searchValues } = this.state; this.setState({ searchValues: Object.assign(searchValues, { belongname: e, }), }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/customer/listAdminByName", data: { adminName: e, }, success: function (data) { let thedata = data.data; if (!thedata) { if (data.error && data.error.length) { message.warning(data.error[0].message); } thedata = {}; } this.setState({ fjlist: thedata, }); }.bind(this), }).always( function () { this.setState({ loading: false, }); }.bind(this) ); }, selectF(value) { const { searchValues, fjlist } = this.state; const newdataSources = JSON.stringify(fjlist) == "{}" ? [] : fjlist; this.setState({ searchValues: Object.assign(searchValues, { belongName: newdataSources.find((item) => item.name == value).id, }), }); }, render() { const { searchValues, } = this.state const rowSelection = { selectedRowKeys: this.state.selectedRowKeys, onChange: (selectedRowKeys, selectedRows) => { this.setState({ modalVisible: false, selectedRows: selectedRows, selectedRowKeys: selectedRowKeys, }); }, onSelect: (recordt, selected, selectedRows) => { this.setState({ modalVisible: false, }); }, }; const hasSelected = this.state.selectedRowKeys.length > 0; const dataSources = this.state.customerArr || []; const options = dataSources.map((group) => ( {group.name} )); const newdataSources = JSON.stringify(this.state.fjlist) == "{}" ? [] : this.state.fjlist; const newoptions = newdataSources.map((group) => ( {group.name} )); return (
{ this.setState({ showModal: false }) }} />
线索客户
{ searchValues["userName"] = e.target.value; this.setState({ searchValues: searchValues, }); }} /> { this.setState({ searchValues: Object.assign(searchValues, { startTime: dataString[0], endTime: dataString[1], }), }); }} />
{this.props.intentionState == 1 ?
: ""}
{ this.state.zhuanjiaoVisible && } { this.state.modalVisible && } ); }, }); export default LimitedProject;