buyList.jsx 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964
  1. import React from "react";
  2. import $ from "jquery/src/ajax";
  3. import "react-quill/dist/quill.bubble.css";
  4. import moment from "moment";
  5. import {
  6. Form,
  7. Icon,
  8. Button,
  9. Input,
  10. Select,
  11. Table,
  12. message,
  13. DatePicker,
  14. Modal,
  15. Upload,
  16. Popconfirm,
  17. Cascader,
  18. InputNumber,
  19. Radio,
  20. Tooltip,
  21. Tabs,
  22. Tag, Checkbox
  23. } from "antd";
  24. import { areaSelect, getProvince } from "@/NewDicProvinceList"; //省市区
  25. import {
  26. getGameState,
  27. splitUrl,
  28. getprovince,
  29. getStatuslist,
  30. getLvl,
  31. beforeUploadFile,
  32. getSecretType,
  33. getBuyAuditType,
  34. placeList,
  35. province,
  36. provinceStatus,
  37. getPicPath
  38. } from "@/tools.js";
  39. const { Option } = Select;
  40. import Img01 from "./image/cgg.jpg";
  41. import Img02 from "./image/ttt.jpg";
  42. import Img03 from "./image/xxxd.jpg";
  43. import Img04 from "./image/bbb.jpg";
  44. import SpinContainer from "../../SpinContainer";
  45. import {companyList, getCompanyName, getCompanyValueArray} from "../../common/configure";
  46. //上传图片组件
  47. const PicturesWall = React.createClass({
  48. getInitialState() {
  49. return {
  50. previewVisible: false,
  51. previewImage: "",
  52. fileList: this.props.pictureUrl,
  53. imgflag: this.props.flagimg
  54. };
  55. },
  56. getDefaultProps() {
  57. return {
  58. changeClick: this.modifyChange
  59. };
  60. },
  61. handleCancel() {
  62. this.setState({ previewVisible: false });
  63. },
  64. handlePreview(file) {
  65. this.setState({
  66. previewImage: file.url || file.thumbUrl,
  67. previewVisible: true
  68. });
  69. },
  70. handleChange(info) {
  71. let fileList = info.fileList;
  72. this.setState({ fileList });
  73. this.props.fileList(fileList);
  74. },
  75. componentWillReceiveProps(nextProps) {
  76. this.state.fileList = nextProps.pictureUrl;
  77. },
  78. render() {
  79. const { previewVisible, previewImage, fileList, flagimg } = this.state;
  80. const uploadButton = (
  81. <div>
  82. <Icon type="plus" />
  83. <div className="ant-upload-text">点击上传</div>
  84. </div>
  85. );
  86. return (
  87. <div style={{ display: "inline-block" }} className={flagimg}>
  88. <Upload
  89. beforeUpload={beforeUploadFile}
  90. action={globalConfig.context + "/api/admin/customerCase/uploadFile"}
  91. data={{ sign: "purchase_picture" }}
  92. listType="picture-card"
  93. fileList={fileList}
  94. onPreview={this.handlePreview}
  95. onChange={this.handleChange}
  96. >
  97. {fileList && fileList.length >= 1 ? null : uploadButton}
  98. </Upload>
  99. <Modal
  100. maskClosable={false}
  101. visible={previewVisible}
  102. footer={null}
  103. onCancel={this.handleCancel}
  104. >
  105. <img alt="" style={{ width: "100%" }} src={previewImage} />
  106. </Modal>
  107. </div>
  108. );
  109. }
  110. });
  111. //主体
  112. const BuyList = Form.create()(
  113. React.createClass({
  114. loadData(pageNo) {
  115. this.state.data = [];
  116. this.setState({
  117. loading: true,
  118. page: pageNo
  119. });
  120. $.ajax({
  121. method: "get",
  122. dataType: "json",
  123. crossDomain: false,
  124. url: globalConfig.context + "/api/admin/customerCase/listCustomerCase",
  125. data: {
  126. pageNo: pageNo || this.state.pagination.current || 1,
  127. pageSize: this.state.pagination.pageSize,
  128. name: this.state.nameSearch,
  129. locationSearch: this.state.locationSearch,
  130. },
  131. success: function(data) {
  132. let theArr = [];
  133. if (!data.data || !data.data.list) {
  134. if (data.error && data.error.length) {
  135. message.warning(data.error[0].message);
  136. }
  137. } else {
  138. for (let i = 0; i < data.data.list.length; i++) {
  139. let thisdata = data.data.list[i];
  140. thisdata.key = i + 1;
  141. theArr.push(thisdata);
  142. }
  143. this.state.pagination.current = data.data.pageNo;
  144. this.state.pagination.total = data.data.totalCount;
  145. }
  146. this.setState({
  147. dataSource: theArr,
  148. pagination: this.state.pagination
  149. });
  150. }.bind(this)
  151. }).always(
  152. function() {
  153. this.setState({
  154. loading: false
  155. });
  156. }.bind(this)
  157. );
  158. },
  159. getInitialState() {
  160. return {
  161. loading: false,
  162. flag: true,
  163. timesArr: [],
  164. totalData: {
  165. mark: false
  166. },
  167. locations:[],
  168. purchaseImg: [],
  169. pagination: {
  170. defaultCurrent: 1,
  171. defaultPageSize: 10,
  172. showQuickJumper: true,
  173. pageSize: 10,
  174. onChange: function(page) {
  175. this.loadData(page);
  176. this.setState({
  177. selectedRowKeys: []
  178. });
  179. }.bind(this),
  180. showTotal: function(total) {
  181. return "共" + total + "条数据";
  182. }
  183. },
  184. //数据类型
  185. columns: [
  186. {
  187. title: "序号",
  188. dataIndex: "key",
  189. key: "key"
  190. },
  191. {
  192. title: "省份",
  193. dataIndex: "province",
  194. key: "province",
  195. render: e => {
  196. let str = "";
  197. provinceStatus.forEach(item => {
  198. if (item.value == e) {
  199. str = item.key;
  200. }
  201. });
  202. return str;
  203. }
  204. },
  205. {
  206. title: "公司名字",
  207. dataIndex: "name",
  208. key: "name"
  209. },
  210. {
  211. title: "是否首页",
  212. dataIndex: "status",
  213. key: "status",
  214. render: s => {
  215. return s ? (
  216. <Tag color="#87d068">是</Tag>
  217. ) : (
  218. <Tag color="#f50">否</Tag>
  219. );
  220. }
  221. },
  222. {
  223. title: "LOGO缩率图",
  224. dataIndex: "pictureUrl",
  225. key: "pictureUrl",
  226. render: url => {
  227. let path = getPicPath(globalConfig.avatarUploadHost, url);
  228. return (
  229. <div style={{ textAlign: "center" }}>
  230. <img src={path} style={{ width: "100px", height: 50 }} />
  231. <Button
  232. className="buttonimg"
  233. style={{ marginLeft: 10 }}
  234. onClick={e => {
  235. e.stopPropagation();
  236. this.maximg(path);
  237. }}
  238. >
  239. 查看大图
  240. </Button>
  241. </div>
  242. );
  243. }
  244. },
  245. {
  246. title: "公司",
  247. dataIndex: "locations",
  248. key: "locations",
  249. render: r => {
  250. let text = '';
  251. r && r.map((v,i)=>(
  252. text += (i === 0 ? '':',')+getCompanyName(v)
  253. ))
  254. return(
  255. <Tooltip placement="top" title={text}>
  256. {
  257. r && r.map((v,i)=>(
  258. i <= 2 ? (i === 0 ? '':',')+getCompanyName(v) : null
  259. ))
  260. }
  261. {
  262. r.length > 3 ? '.....' : null
  263. }
  264. </Tooltip>
  265. )
  266. }
  267. },
  268. {
  269. title: "排序",
  270. dataIndex: "sort",
  271. key: "sort"
  272. },
  273. {
  274. title: "操作",
  275. dataIndex: "ads",
  276. key: "ads",
  277. render: (text, record, index) => {
  278. return (
  279. <div>
  280. {
  281. <Button
  282. type="primary"
  283. onClick={event => {
  284. this.stopPropagation(event);
  285. this.edit(record);
  286. }}
  287. >
  288. 编辑
  289. </Button>
  290. }
  291. {
  292. <Popconfirm
  293. okText="确定"
  294. cancelText="取消"
  295. title="您确定删除客户服务信息吗?"
  296. onConfirm={() => {
  297. this.delete(record.id);
  298. }}
  299. >
  300. <Button
  301. type="danger"
  302. style={{ marginLeft: "10px" }}
  303. onClick={event => {
  304. this.stopPropagation(event);
  305. }}
  306. >
  307. 删除
  308. </Button>
  309. </Popconfirm>
  310. }
  311. {
  312. <Button
  313. type="primary"
  314. style={{ marginLeft: "10px" }}
  315. onClick={e => {
  316. e.stopPropagation();
  317. if (record.status) {
  318. this.toTop(record, 0);
  319. } else {
  320. this.toTop(record, 1);
  321. }
  322. }}
  323. >
  324. {record.status ? "从首页撤下" : "推荐至首页"}
  325. </Button>
  326. }
  327. </div>
  328. );
  329. }
  330. }
  331. ],
  332. //数据列表
  333. dataSource: []
  334. };
  335. },
  336. //点击大图
  337. maximg(url) {
  338. this.setState({
  339. imgeditvisible: true,
  340. maximg: url
  341. });
  342. },
  343. componentWillMount() {
  344. this.loadData();
  345. },
  346. detailes(record) {
  347. this.setState({
  348. loading: true
  349. });
  350. $.ajax({
  351. method: "get",
  352. dataType: "json",
  353. crossDomain: false,
  354. url: globalConfig.context + "/api/admin/purchase/details",
  355. data: {
  356. id: record.id
  357. },
  358. success: function(data) {
  359. let theArr = [];
  360. let thisdata = data.data;
  361. if (!data.data || !data.data.list) {
  362. if (data.error && data.error.length) {
  363. message.warning(data.error[0].message);
  364. }
  365. }
  366. this.setState({
  367. purchaseImg: thisdata.purchaseImg
  368. ? splitUrl(
  369. thisdata.purchaseImg,
  370. ",",
  371. globalConfig.avatarUploadHost + "/upload"
  372. )
  373. : []
  374. });
  375. Object.assign(
  376. this.state.totalData,
  377. {
  378. content: thisdata.content,
  379. contacts: thisdata.contacts,
  380. contactsMobile: thisdata.contactsMobile,
  381. orgName: thisdata.orgName
  382. },
  383. this.state.RowData
  384. );
  385. }.bind(this)
  386. }).always(
  387. function() {
  388. this.setState({
  389. loading: false
  390. });
  391. }.bind(this)
  392. );
  393. },
  394. stopPropagation(e) {
  395. e.stopPropagation();
  396. e.nativeEvent.stopImmediatePropagation();
  397. },
  398. //删除按钮
  399. delete(id) {
  400. $.ajax({
  401. method: "post",
  402. dataType: "json",
  403. crossDomain: false,
  404. url:
  405. globalConfig.context + "/api/admin/customerCase/deleteCustomerCase",
  406. data: {
  407. id
  408. },
  409. success: function(data) {
  410. let theArr = [];
  411. if (data.error && data.error.length) {
  412. message.warning(data.error[0].message);
  413. } else {
  414. this.loadData();
  415. }
  416. }.bind(this)
  417. }).always(
  418. function() {
  419. this.setState({
  420. loading: false
  421. });
  422. }.bind(this)
  423. );
  424. },
  425. //项目列表整行点击
  426. tableRowClick(record, index) {
  427. this.state.RowData = record;
  428. this.setState({
  429. editvisible: true
  430. });
  431. this.edit(record);
  432. },
  433. edithandleCancel(e) {
  434. this.setState(
  435. {
  436. editvisible: false
  437. },
  438. () => {
  439. this.addReset();
  440. }
  441. );
  442. this.loadData();
  443. },
  444. search() {
  445. this.loadData();
  446. },
  447. add() {
  448. this.setState({
  449. editvisible: true,
  450. flag: false
  451. });
  452. },
  453. toTop(record, num) {
  454. this.setState({
  455. loading: true
  456. });
  457. $.ajax({
  458. method: "post",
  459. dataType: "json",
  460. crossDomain: false,
  461. url:
  462. globalConfig.context + "/api/admin/customerCase/updateCustomerCase",
  463. data: {
  464. id: record.id,
  465. status: num
  466. },
  467. success: function(data) {
  468. let theArr = [];
  469. if (data.error && data.error.length) {
  470. message.warning(data.error[0].message);
  471. } else {
  472. this.loadData();
  473. }
  474. }.bind(this)
  475. }).always(
  476. function() {
  477. this.setState({
  478. loading: false
  479. });
  480. }.bind(this)
  481. );
  482. },
  483. addNew(flag) {
  484. if(this.state.locations.length === 0){
  485. message.warning('请选择公司')
  486. return;
  487. }
  488. if (this.state.flag) {
  489. $.ajax({
  490. method: "post",
  491. dataType: "json",
  492. crossDomain: false,
  493. url:
  494. globalConfig.context + "/api/admin/customerCase/updateCustomerCase",
  495. data: {
  496. id: this.state.id,
  497. name: this.state.name,
  498. pictureUrl: this.state.pictureUrl
  499. ? this.state.pictureUrl[0].response.data
  500. : undefined,
  501. status: this.state.status ? this.state.status : 0,
  502. releaseStatus: flag,
  503. province: this.state.province,
  504. region: this.state.region,
  505. sort: this.state.sort,
  506. locations:this.state.locations.join(','),
  507. },
  508. success: function(data) {
  509. let theArr = [];
  510. if (data.error && data.error.length) {
  511. message.warning(data.error[0].message);
  512. } else {
  513. this.loadData();
  514. this.cancelAdd();
  515. }
  516. }.bind(this)
  517. }).always(
  518. function() {
  519. this.setState({
  520. loading: false
  521. });
  522. }.bind(this)
  523. );
  524. } else {
  525. $.ajax({
  526. method: "post",
  527. dataType: "json",
  528. crossDomain: false,
  529. url: globalConfig.context + "/api/admin/customerCase/addCustomerCase",
  530. data: {
  531. name: this.state.name,
  532. pictureUrl: this.state.pictureUrl
  533. ? this.state.pictureUrl[0].response.data
  534. : undefined,
  535. status: this.state.status ? this.state.status : 0,
  536. releaseStatus: flag,
  537. province: this.state.province,
  538. region: this.state.region,
  539. sort: this.state.sort,
  540. locations: this.state.locations.join(','),
  541. },
  542. success: function(data) {
  543. let theArr = [];
  544. if (data.error && data.error.length) {
  545. message.warning(data.error[0].message);
  546. } else {
  547. this.loadData();
  548. this.cancelAdd();
  549. }
  550. }.bind(this)
  551. }).always(
  552. function() {
  553. this.setState({
  554. loading: false
  555. });
  556. }.bind(this)
  557. );
  558. }
  559. },
  560. issueNew() {
  561. this.change("releaseStatus", 1, () => {
  562. this.addNew();
  563. });
  564. },
  565. //编辑按钮操作
  566. edit(record) {
  567. this.setState({
  568. flag: true,
  569. editvisible: true
  570. });
  571. this.setState({
  572. loading: true
  573. });
  574. $.ajax({
  575. method: "get",
  576. dataType: "json",
  577. crossDomain: false,
  578. url:
  579. globalConfig.context + "/api/admin/customerCase/selectCustomerCase",
  580. data: {
  581. id: record.id
  582. },
  583. success: function(data) {
  584. let thisdata = data.data;
  585. let str = "";
  586. if (data.error && data.error.length) {
  587. message.warning(data.error[0].message);
  588. }
  589. placeList.forEach(item => {
  590. if (item.value == thisdata.region) {
  591. str = item.place;
  592. }
  593. });
  594. this.setState({
  595. id: thisdata.id,
  596. name: thisdata.name,
  597. pictureUrl: thisdata.pictureUrl
  598. ? splitUrl(
  599. thisdata.pictureUrl,
  600. ",",
  601. globalConfig.avatarUploadHost
  602. )
  603. : [],
  604. status: thisdata.status,
  605. releaseStatus: thisdata.releaseStatus,
  606. province: thisdata.province + "",
  607. region: thisdata.region,
  608. regionStr: str,
  609. locations: thisdata.locations,
  610. checked:thisdata.locations.length === companyList.length,
  611. indeterminate: thisdata.locations.length < companyList.length,
  612. sort: thisdata.sort,
  613. releaseTimeConvert: thisdata.releaseTimeConvert,
  614. createTimeConvert: thisdata.createTimeConvert
  615. });
  616. }.bind(this)
  617. }).always(
  618. function() {
  619. this.setState({
  620. loading: false
  621. });
  622. }.bind(this)
  623. );
  624. },
  625. cancelAdd() {
  626. this.setState(
  627. {
  628. editvisible: false
  629. },
  630. () => {
  631. this.setState({
  632. flag: true
  633. });
  634. this.addReset();
  635. }
  636. );
  637. this.loadData();
  638. },
  639. //新增框的清零
  640. addReset() {
  641. this.setState({
  642. name: undefined,
  643. pictureUrl: undefined,
  644. status: 0,
  645. province: undefined,
  646. region: undefined,
  647. sort: undefined,
  648. regionStr: undefined,
  649. locations: [],
  650. indeterminate: false,
  651. checked:false,
  652. });
  653. },
  654. imghandleCancel() {
  655. this.setState({
  656. imgeditvisible: false
  657. });
  658. },
  659. //搜索部分的清零
  660. reset() {
  661. this.setState({
  662. locationSearch: undefined,
  663. nameSearch: undefined,
  664. },()=>{
  665. this.loadData();
  666. })
  667. },
  668. getOrgCodeUrl(e) {
  669. this.setState({ pictureUrl: e });
  670. },
  671. change(key, e, f) {
  672. if (f === undefined) {
  673. this.state.totalData[key] = e;
  674. this.setState({
  675. totalData: this.state.totalData
  676. });
  677. } else if (typeof f === "function") {
  678. this.state.totalData[key] = e;
  679. this.setState(
  680. {
  681. totalData: this.state.totalData
  682. },
  683. f
  684. );
  685. }
  686. },
  687. render() {
  688. const FormItem = Form.Item;
  689. const rowSelection = {
  690. selectedRowKeys: this.state.selectedRowKeys,
  691. onChange: (selectedRowKeys, selectedRows) => {
  692. this.setState({
  693. selectedRows: selectedRows.slice(-1),
  694. selectedRowKeys: selectedRowKeys.slice(-1)
  695. });
  696. }
  697. };
  698. let data = this.state.totalData;
  699. const { TextArea } = Input; //文本域
  700. const { TabPane } = Tabs; //标签页
  701. const { MonthPicker, RangePicker, WeekPicker } = DatePicker; //日期输入框
  702. return (
  703. <div className="user-content">
  704. <div className="content-title">
  705. <span>服务客户</span>
  706. <div className="user-search">
  707. <Input
  708. placeholder="请输入公司关键字"
  709. style={{
  710. width: "150px",
  711. marginRight: "10px",
  712. marginBottom: "10px"
  713. }}
  714. value={this.state.nameSearch}
  715. onChange={e => {
  716. this.setState({ nameSearch: e.target.value });
  717. }}
  718. />
  719. <Select
  720. placeholder="请选择公司"
  721. style={{ width: 150 }}
  722. value={this.state.locationSearch}
  723. onChange={e => {
  724. this.setState({
  725. locationSearch: e
  726. });
  727. }}
  728. >
  729. {
  730. companyList.map((v)=>(
  731. <Select.Option key={v.value} value={v.value}>{v.label}</Select.Option>
  732. ))
  733. }
  734. </Select>
  735. <Button
  736. type="primary"
  737. onClick={this.search}
  738. style={{ marginRight: "10px" }}
  739. >
  740. 搜索
  741. </Button>
  742. <Button onClick={this.reset} style={{ marginRight: "10px" }}>
  743. 重置
  744. </Button>
  745. <Button
  746. type="primary"
  747. onClick={this.add}
  748. style={{ marginLeft: "100px" }}
  749. >
  750. 新增客户
  751. </Button>
  752. </div>
  753. <div className="patent-table">
  754. <SpinContainer spinning={this.state.loading}>
  755. <Table
  756. columns={this.state.columns}
  757. dataSource={this.state.dataSource}
  758. pagination={this.state.pagination}
  759. onRowClick={this.tableRowClick}
  760. bordered
  761. size="small"
  762. />
  763. </SpinContainer>
  764. </div>
  765. </div>
  766. <div className="patent-desc">
  767. <Modal
  768. className="customeDetails"
  769. title={this.state.flag ? "客户服务详情" : "新增案例信息"}
  770. width="511px"
  771. visible={this.state.editvisible}
  772. onOk={this.edithandleCancel}
  773. onCancel={
  774. this.state.flag ? this.edithandleCancel : this.cancelAdd
  775. }
  776. footer=""
  777. >
  778. <SpinContainer spinning={this.state.loading}>
  779. <div className="clearfix">
  780. <FormItem
  781. labelCol={{ span: 7 }}
  782. wrapperCol={{ span: 13 }}
  783. label="服务客户名称:"
  784. >
  785. <Input
  786. placeholder="请输入服务客户名称"
  787. value={this.state.name}
  788. onChange={e => {
  789. this.setState({
  790. name: e.target.value
  791. });
  792. }}
  793. style={{ width: "140px" }}
  794. />
  795. </FormItem>
  796. </div>
  797. <div className="clearfix">
  798. <FormItem
  799. labelCol={{ span: 7 }}
  800. wrapperCol={{ span: 13 }}
  801. label="所属省份"
  802. >
  803. <Select
  804. style={{ width: 120 }}
  805. placeholder="请选择省份"
  806. value={this.state.province}
  807. onChange={e => {
  808. this.setState({
  809. province: e
  810. });
  811. let str = "";
  812. provinceStatus.forEach(item => {
  813. if (item.value == e) {
  814. str = item.key;
  815. }
  816. });
  817. placeList.forEach(item => {
  818. item.children.forEach(key => {
  819. if (key == str) {
  820. this.setState({
  821. regionStr: item.place,
  822. region: item.value
  823. });
  824. }
  825. });
  826. });
  827. }}
  828. >
  829. {provinceStatus.map(item => {
  830. return <Option value={item.value}>{item.key}</Option>;
  831. })}
  832. </Select>
  833. </FormItem>
  834. </div>
  835. <div className="clearfix">
  836. <FormItem
  837. labelCol={{ span: 7 }}
  838. wrapperCol={{ span: 13 }}
  839. label="所属区域"
  840. >
  841. <Input
  842. value={this.state.regionStr}
  843. disabled
  844. style={{ width: "140px" }}
  845. />
  846. </FormItem>
  847. </div>
  848. <div className="clearfix">
  849. <FormItem
  850. labelCol={{ span: 7 }}
  851. wrapperCol={{ span: 13 }}
  852. label="公司"
  853. >
  854. <Checkbox indeterminate={this.state.indeterminate} checked={this.state.checked} onChange={(e)=>{
  855. this.setState({
  856. locations: e.target.checked ? getCompanyValueArray():[],
  857. indeterminate: false,
  858. checked:e.target.checked
  859. })
  860. }}>全选</Checkbox>
  861. <Checkbox.Group
  862. options={companyList}
  863. value={this.state.locations}
  864. onChange={(e) => {
  865. this.setState({
  866. locations: e,
  867. indeterminate: companyList.length > e.length,
  868. checked: companyList.length === e.length
  869. });
  870. }}
  871. />
  872. </FormItem>
  873. </div>
  874. <div className="clearfix">
  875. <FormItem
  876. labelCol={{ span: 7 }}
  877. wrapperCol={{ span: 13 }}
  878. label="排序"
  879. >
  880. <Input
  881. value={this.state.sort}
  882. placeholder="请输入数字"
  883. onChange={e => {
  884. this.setState({
  885. sort: e.target.value
  886. });
  887. }}
  888. style={{ width: "140px" }}
  889. />
  890. </FormItem>
  891. </div>
  892. <div className="clearfix">
  893. <FormItem
  894. labelCol={{ span: 7 }}
  895. wrapperCol={{ span: 13 }}
  896. label="客户logo"
  897. >
  898. <PicturesWall
  899. flagimg={this.state.flag}
  900. fileList={this.getOrgCodeUrl}
  901. pictureUrl={this.state.pictureUrl}
  902. />
  903. <p>图片建议:要清晰。</p>
  904. </FormItem>
  905. </div>
  906. <div className="clearfix">
  907. <Button
  908. type="primary"
  909. size="large"
  910. onClick={e => {
  911. this.addNew(0);
  912. }}
  913. style={{
  914. float: "right",
  915. marginRight: "80px",
  916. marginTop: "20px"
  917. }}
  918. >
  919. 保存
  920. </Button>
  921. <Button
  922. type="primary"
  923. size="large"
  924. onClick={e => {
  925. this.addNew(1);
  926. }}
  927. style={{
  928. float: "right",
  929. marginRight: "20px",
  930. marginTop: "20px"
  931. }}
  932. >
  933. 保存并发布
  934. </Button>
  935. </div>
  936. </SpinContainer>
  937. </Modal>
  938. <Modal
  939. visible={this.state.imgeditvisible}
  940. onCancel={this.imghandleCancel}
  941. onOk={this.imgOk}
  942. >
  943. <img style={{ width: "100%" }} src={this.state.maximg} />
  944. </Modal>
  945. </div>
  946. </div>
  947. );
  948. }
  949. })
  950. );
  951. export default BuyList;