test commts

src/common/router.js

@@ -396,6 +396,10 @@ export const getRouterData = (app) => {
     '/dashboard/accounts/totalList': {
       component: dynamicWrapper(app, ['accounts'], () => import('../routes/Dashboard/Accounts/AccountsTotalList')),
     },
+    // 已配置标签终端信息表
+    '/dashboard/accounts/didLabelList': {
+      component: dynamicWrapper(app, ['accounts'], () => import('../routes/Dashboard/Accounts/AccountsDidLabelList')),
+    },
     // 校区列表
     '/dashboard/accounts/campus': {
       component: dynamicWrapper(app, ['accounts'], () => import('../routes/Dashboard/Accounts/AccountsCampus')),

src/models/accounts.js

@@ -1,11 +1,10 @@
-
-import { stringify } from 'qs';
 import {
   queryCampusList,
   queryTerminalsList,
   queryCampusAmount,
   queryTerminalsAmount,
   queryTotalList,
+  queryDidLabelList,
 } from '../services/accounts';
 
 export default {
@@ -83,15 +82,33 @@ export default {
         });
       }
     },
-    *fetchCampusExcel({ payload }, { call }) {
+    *fetchDidLabelList({ payload }, { call, put }) {
+      const response = yield call(queryDidLabelList, payload);
+      if (response.success) {
+        yield put({
+          type: 'querySuccess',
+          payload: {
+            list: response.data.list || [],
+            pageSize: response.data.pageSize,
+            totalSize: response.data.totalSize,
+            pageNo: response.data.pageNo,
+          },
+        });
+      }
+    },
+    *fetchCampusExcel() {
       const url = '/api/stmt/campus/export';
       window.location.href = url;
     },
-    *fetchTerminalsExcel({ payload }, { call }) {
+    *fetchTerminalsExcel() {
       const url = '/api/stmt/terminal/user/export';
       window.location.href = url;
     },
-    *fetchOverdueExcel({ payload }, { call }) {
+    *fetchDidLabelExcel() {
+      const url = '/api/stmt/userTagStmt/export';
+      window.location.href = url;
+    },
+    *fetchOverdueExcel() {
       const url = '/api/stmt/terminal/user/export?fastExpired=1';
       window.location.href = url;
     },

src/routes/Dashboard/Accounts/AccountsDidLabelList.js

@@ -0,0 +1,260 @@
+import React, { Component } from 'react';
+import { connect } from 'dva';
+import { Card, Modal, Form, Tag } from 'antd';
+import { StandardTableList } from '../../../components/AXList';
+import { addRowKey } from '../../../utils/utils';
+import styles from './AccountsDidLabelList.less';
+import AXRemoteSelect from '../../../components/AXRemoteSelect';
+
+const formItemLayout = {
+  labelCol: {
+    xs: { span: 24 },
+    sm: { span: 7 },
+  },
+  wrapperCol: {
+    xs: { span: 24 },
+    sm: { span: 15 },
+    md: { span: 13 },
+  },
+};
+function arrayDataFormatter(data) {
+  return data.map((item) => {
+    return {
+      text: item.name,
+      value: `${item.name}||${item.id}`,
+    };
+  });
+}
+@Form.create()
+@connect(({ loading, accounts, campus }) => ({
+  accounts,
+  campus,
+  loading: loading.models.accounts,
+  fetching: loading.models.campus,
+}))
+
+export default class NewListAccountsPage extends Component {
+  constructor(props) {
+    super(props);
+    const { state } = props.location;
+    this.state = {
+      UIParams: (state || {}).UIParams, // 组件的状态参数
+      Queryers: (state || {}).Queryers, // 查询的条件参数
+      campuses: (state || {}).campuses || [], // 记录筛选的校区
+      filterModalDestroy: true,
+    };
+  }
+  componentWillMount() {
+    const { campuses } = this.state;
+    let campusId;
+    if (campuses && campuses.length) {
+      campusId = campuses[0].split('||')[1];
+    }
+    this.props.dispatch({
+      type: 'accounts/fetchCampusAmount',
+      payload: {},
+    });
+    this.props.dispatch({
+      type: 'accounts/fetchTerminalsAmount',
+      payload: {},
+    });
+    this.props.dispatch({
+      type: 'accounts/fetchDidLabelList',
+      payload: {
+        campusId,
+        ...this.state.Queryers,
+      },
+    });
+    this.props.dispatch({
+      type: 'accounts/fetchDidLabelList',
+      payload: { ...this.state.Queryers },
+    });
+  }
+
+  handleFilterOperation = (params, states) => {
+    this.setState({
+      UIParams: states,
+      Queryers: params,
+    });
+    this.props.dispatch({
+      type: 'accounts/fetchDidLabelList',
+      // payload: {
+      //   ...params,
+      // },
+      payload: { ...this.state.Queryers },
+    });
+  };
+
+  handleFilterModalShow = () => {
+    this.setState({ filterModalDestroy: false });
+  };
+  handleFilterModalDestroy = () => {
+    this.setState({ filterModalDestroy: true });
+  };
+  handleModalFilterOperation = () => {
+    const { getFieldsValue } = this.props.form;
+    const { campuses } = getFieldsValue();
+    let campusId;
+    if (campuses && campuses.length) {
+      campusId = campuses[0].split('||')[1];
+    }
+    this.props.dispatch({
+      type: 'accounts/fetchDidLabelList',
+      payload: {
+        campusId,
+        ...this.state.Queryers,
+      },
+    });
+    this.handleFilterModalDestroy();
+    this.setState({ campuses });
+  };
+  // 点击下载
+  handleDownloadOperation = () => {
+    this.props.dispatch({
+      type: 'accounts/fetchDidLabelExcel',
+    });
+  };
+  handleTerminalsRemoteSelectSearch = (value) => {
+    this.props.dispatch({
+      type: 'campus/fetchCampusList',
+      payload: {
+        pageSize: 50,
+        name: value,
+      },
+    });
+  };
+  render() {
+    const { campuses } = this.state;
+    const { loading, accounts, fetching, campus, form } = this.props;
+    // const { list, totalSize, pageSize, pageNo, campusAmount, terminalsAmount} = accounts;
+    const { list, totalSize, pageSize, pageNo } = accounts;
+    const { getFieldDecorator } = form;
+    const basicSearch = {
+      keys: [
+        {
+          name: '终端编号',
+          field: 'code',
+        },
+      ],
+    };
+    const pagination = {
+      pageNo,
+      pageSize,
+      totalSize,
+    };
+    // const columns = [{
+    //   title: '校区类型',
+    //   key: 1,
+    //   dataIndex: 'merchantName',
+    //   width: '15%',
+    // }, {
+    //   title: '校区名称',
+    //   key: 2,
+    //   dataIndex: 'campusName',
+    //   width: '20%',
+    // }, {
+    //   title: '终端编号',
+    //   key: 3,
+    //   dataIndex: 'code',
+    //   width: '20%',
+    // }, {
+    //   title: '终端名称',
+    //   key: 4,
+    //   dataIndex: 'name',
+    //   width: '20%',
+    // }, {
+    //   title: '课程状态',
+    //   key: 5,
+    //   dataIndex: 'status',
+    //   render: text => renderStatus(text),
+    //   width: '10%',
+    // }, {
+    //   title: '标签',
+    //   key: 6,
+    //   dataIndex: 'status',
+    //   render:() => (
+    //     <Fragment>
+    //       <span className={styles.label}>配置</span>
+    //       <span className={styles.label}>正常</span>
+    //       <span className={styles.label}>安全</span>
+    //       <span className={styles.label}>数组</span>
+    //     </Fragment>
+    //   ),
+    //   width: '20%',
+    // },
+    // ];
+    const columns = [{
+      title: '校区名称',
+      key: 1,
+      dataIndex: 'cname',
+      width: '20%',
+    }, {
+      title: '终端编号',
+      key: 2,
+      dataIndex: 'ucode',
+      width: '20%',
+    }, {
+      title: '终端名称',
+      key: 3,
+      dataIndex: 'uname',
+      width: '20%',
+    }, {
+      title: '标签',
+      key: 4,
+      dataIndex: 'userTags',
+      render: (userTags = []) => (
+        <span>
+          {[...new Set(userTags)].map(tag => <Tag key={tag} className={styles.label}>{tag}</Tag>)}
+        </span>
+      ),
+      width: '40%',
+    },
+    ];
+    return (
+      <Card>
+        <StandardTableList
+          columns={columns}
+          loading={loading}
+          dataSource={addRowKey(list)}
+          header={{
+            basicSearch,
+            onAdvanceFilterClick: this.handleFilterModalShow,
+            onFilterClick: this.handleFilterOperation,
+            onDownload: this.handleDownloadOperation,
+          }}
+          footer={{
+            pagination,
+          }}
+          keepUIState={{ ...this.state.UIParams }}
+          showStatusSelect={false}
+        />
+        {!this.state.filterModalDestroy && (
+          <Modal
+            width={600}
+            visible
+            title="高级筛选"
+            okText="筛选"
+            cancelText="取消"
+            maskClosable={false}
+            onCancel={this.handleFilterModalDestroy}
+            onOk={this.handleModalFilterOperation}
+          >
+            <Form>
+              <Form.Item label="所属校区" {...formItemLayout}>
+                {getFieldDecorator('campuses', {
+                  initialValue: campuses,
+                })(
+                  <AXRemoteSelect
+                    fetching={fetching}
+                    dataSource={arrayDataFormatter(campus.list)}
+                    onSearch={this.handleTerminalsRemoteSelectSearch}
+                  />
+                )}
+              </Form.Item>
+            </Form>
+          </Modal>
+        )}
+      </Card>
+    );
+  }
+}

src/routes/Dashboard/Accounts/AccountsDidLabelList.less

@@ -0,0 +1,6 @@
+.label {
+  width: auto;
+  display: inline-block;
+  padding: 0 4px;
+  border-radius: 4px;
+}

src/routes/Dashboard/Accounts/index.js

@@ -24,6 +24,10 @@ export default class AccountsPage extends Component {
       case 'totalList':
         dispatch(routerRedux.push(`${match.url}/totalList`));
         break;
+      // 已配置标签终端信息表
+      case 'didLabelList':
+        dispatch(routerRedux.push(`${match.url}/didLabelList`));
+        break;
       default:
         break;
     }
@@ -43,6 +47,10 @@ export default class AccountsPage extends Component {
         tab: '即将到期(30天)',
       },
       {
+        key: 'didLabelList',
+        tab: '已配置标签终端信息表',
+      },
+      {
         key: 'totalList',
         tab: '总统计表',
       },

src/services/accounts.js

@@ -23,10 +23,16 @@ export async function queryTotalList(params) {
   };
   return request(`${api.acconutsTotalList}?${stringify(newParams)}`);
 }
-
+export async function queryDidLabelList(params) {
+  const newParams = {
+    pageSize: Hotax.PAGE_SIZE,
+    ...params,
+  };
+  return request(`${api.acconutsDidLabelList}?${stringify(newParams)}`);
+}
 export async function queryCampusAmount() {
   return request(`${api.acconutsCampusAmount}`);
 }
 export async function queryTerminalsAmount() {
   return request(`${api.acconutsTerminalsAmount}`);
-}
+}

src/utils/config.js

@@ -151,6 +151,7 @@ const apiObj = {
   acconutsTotalList: '/stmt/stats/page',
   acconutsCampusAmount: '/stmt/stats/campus/totalsize',
   acconutsTerminalsAmount: '/stmt/stats/terminal/user/totalsize',
+  acconutsDidLabelList: '/stmt/userTagStmt/list',
 };
 
 /**