StoreTraffic.js 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. import React from "react";
  2. import { Spin } from "antd";
  3. import { connect } from "dva";
  4. import RadioButtonGroup from "./RadioButtonGroup";
  5. import TableChart from "./TableChart";
  6. import styles from "../styles/common.less";
  7. import PanelNav from "./PanelNav";
  8. const StoreTraffic = ({
  9. data,
  10. options,
  11. current,
  12. loading,
  13. currentSite,
  14. dispatch,
  15. }) => {
  16. const onChange = (val) => {
  17. dispatch({
  18. type: "bigscreen/setStoreTrafficData",
  19. payload: { current: val },
  20. });
  21. dispatch({
  22. type: "bigscreen/load_store_traffic",
  23. });
  24. };
  25. const title = currentSite === "1" ? "海外" : "分销商";
  26. // const parseData = (keywords) => {
  27. // return keywords.map(item => decodeURIComponent(item))
  28. // }
  29. const columns = [
  30. {
  31. title: "排名",
  32. dataIndex: "categoryId",
  33. align: "center",
  34. // width: 55,
  35. render: (text, record, index) => {
  36. return index + 1;
  37. },
  38. },
  39. {
  40. title: "店铺名称",
  41. dataIndex: "storeName",
  42. align: "center",
  43. width: 426,
  44. ellipsis: true,
  45. },
  46. {
  47. title: "浏览量",
  48. dataIndex: "viewNum",
  49. align: "center",
  50. // width: 55,
  51. },
  52. {
  53. title: "访客数",
  54. dataIndex: "visitorNum",
  55. align: "center",
  56. // width: 55,
  57. },
  58. ];
  59. return (
  60. <div className={styles.common}>
  61. <div className={styles.common_header}>
  62. <PanelNav title={title + "店铺流量排行"} />
  63. <div className={styles.common_header_conditions}>
  64. <RadioButtonGroup
  65. options={options}
  66. label={current}
  67. onChange={onChange}
  68. />
  69. </div>
  70. </div>
  71. <div className={styles.common_content}>
  72. <TableChart data={data} columns={columns} />
  73. </div>
  74. </div>
  75. );
  76. };
  77. export default connect(({ bigscreen, global }) => ({
  78. data: bigscreen.storeTrafficData.data,
  79. options: bigscreen.storeTrafficData.options,
  80. current: bigscreen.storeTrafficData.current,
  81. loading: bigscreen.storeTrafficData.loading,
  82. currentSite: global.currentSite,
  83. }))(StoreTraffic);