dev分支，小区模块，小区公告等模块

config/config.ts

@@ -188,13 +188,22 @@ export default defineConfig({
                 {path: './ReportOnline/Edit',component:'./CommercialService/Detail'},
               ]
             },
-            {
+           /* {
               path: '/OrderManagement',
               name: 'ordermanagement',
               icon: 'ContainerOutlined',
               routes: [
                 { path: './', component: './OrderManagement/Order' },
               ]
+            },*/
+            {
+              path: '/OrderManagement',
+              name: 'ordermanagement',
+              icon: 'ContainerOutlined',
+              routes: [
+                { path: './', component: './OrderManagement/OrderManagement' },
+                { path: './Detail', component: './OrderManagement/OrderManagementDetail' },
+              ]
             },
             {
               path: '/ContractManagement',
@@ -228,22 +237,21 @@ export default defineConfig({
                 },
 
 
-                {
+              /*  {
                   path: './CommunityAnnouncement',
                   name: 'communityannouncement',
                   component:'./runTest/Template'
-                },
-
-                /*{
+                },*/
+                {
                   path: './CommunityAnnouncement',
                   name: 'communityannouncement',
                   routes: [
-                    { path: './', component: './CommunityAnnouncement/communityNotice/CommunityNotice' },
-                    { path: './Create', component: './CommunityAnnouncement/communityNotice/CommunityNoticeCreate' },
-                    { path: './Edit', component: './CommunityAnnouncement/communityNotice/CommunityNoticeEdit' },
-                    { path: './Detail', component: './CommunityAnnouncement/communityNotice/CommunityNoticeDetail' },
+                    { path: './', component: './CommunityManagement/communityNotice/CommunityNotice' },
+                    { path: './Create', component: './CommunityManagement/communityNotice/CommunityNoticeCreate' },
+                    { path: './Edit', component: './CommunityManagement/communityNotice/CommunityNoticeEdit' },
+                    { path: './Detail', component: './CommunityManagement/communityNotice/CommunityNoticeDetail' },
                   ]
-                },*/
+                },
 
 
                 {
@@ -259,11 +267,18 @@ export default defineConfig({
                     { path: "./FacilityApply",component:'./CommunityManagement/FacilityBookings/Bookings'}
                   ]
                 },
-                {
+                /*{
                   path: './VisitorRecord',
                   name: 'visitorrecord',
                   component:'./runTest/Template'
+                },*/
+                {
+                  path: './VisitorRecord',
+                  name: 'visitorrecord',
+                  component: './CommunityManagement/visitorRecord/VisitorRecord'
+
                 },
+
               ]
             },
             {

src/models/orderManagement.ts

+import { getAdvertisement,delAdvertisement,saveAdvertisement,quitAndUserAd,uploadApk,checkVideo } from '@/services/orderManagement';
+
+export default{
+  namespace: 'orderManagementModel',
+  state: {
+    data: [],
+  },
+  effects: {
+    *getAdvertisement({callback,payload},{ call, put }) {
+      const response = yield call(getAdvertisement,payload);
+      yield put({
+        type: "getAd",
+      });
+      if(callback) callback(response);
+    },
+    *delAdvertisement({callback,payload},{ call, put }) {
+      const response = yield call(delAdvertisement,payload);
+      yield put({
+        type: "del",
+      });
+      if(callback) callback(response);
+    },
+    *saveAdvertisement({callback,payload},{ call, put }) {
+      const response = yield call(saveAdvertisement,payload);
+      yield put({
+        type: "save",
+      });
+      if(callback) callback(response);
+    },
+    *quitAndUserAd({callback,payload},{ call, put }) {
+      const response = yield call(quitAndUserAd,payload);
+      yield put({
+        type: "quit",
+      });
+      if(callback) callback(response);
+    },
+    *uploadApk({callback,payload},{ call, put }) {
+      const response = yield call(uploadApk,payload);
+      yield put({
+        type: "apk",
+      });
+      if(callback) callback(response);
+    },
+    *checkVideo({callback,payload},{ call, put }) {
+      const response = yield call(checkVideo,payload);
+      yield put({
+        type: "check",
+      });
+      if(callback) callback(response);
+    },
+  },
+  reducers: {
+    getAd(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+    del(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+    save(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+    quit(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+    apk(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+    check(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+  },
+};

src/models/visitorRecord.ts

+import { getAdvertisement,delAdvertisement,saveAdvertisement,quitAndUserAd,uploadApk,checkVideo } from '@/services/visitorRecord';
+
+export default{
+  namespace: 'visitorRecordModel',
+  state: {
+    data: [],
+  },
+  effects: {
+    *getAdvertisement({callback,payload},{ call, put }) {
+      const response = yield call(getAdvertisement,payload);
+      yield put({
+        type: "getAd",
+      });
+      if(callback) callback(response);
+    },
+    *delAdvertisement({callback,payload},{ call, put }) {
+      const response = yield call(delAdvertisement,payload);
+      yield put({
+        type: "del",
+      });
+      if(callback) callback(response);
+    },
+    *saveAdvertisement({callback,payload},{ call, put }) {
+      const response = yield call(saveAdvertisement,payload);
+      yield put({
+        type: "save",
+      });
+      if(callback) callback(response);
+    },
+    *quitAndUserAd({callback,payload},{ call, put }) {
+      const response = yield call(quitAndUserAd,payload);
+      yield put({
+        type: "quit",
+      });
+      if(callback) callback(response);
+    },
+    *uploadApk({callback,payload},{ call, put }) {
+      const response = yield call(uploadApk,payload);
+      yield put({
+        type: "apk",
+      });
+      if(callback) callback(response);
+    },
+    *checkVideo({callback,payload},{ call, put }) {
+      const response = yield call(checkVideo,payload);
+      yield put({
+        type: "check",
+      });
+      if(callback) callback(response);
+    },
+  },
+  reducers: {
+    getAd(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+    del(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+    save(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+    quit(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+    apk(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+    check(state, action) {
+      return {
+        ...state,
+        data:action.payload || {},
+      };
+    },
+  },
+};

src/pages/CommunityManagement/communityNotice/CommunityNotice.tsx

@@ -3,7 +3,7 @@ import {connect, routerRedux} from 'dva';
 import {Table, Button, Input, Select, Modal, Tooltip, Upload, Icon, Checkbox, Row, Radio, Tag} from "antd";
 import styles from './style.less';
 import {ConnectState} from "@/models/connect";
-import XLSX from "@/pages/account/xlsx.core.min";
+// import XLSX from "@/pages/account/xlsx.core.min";
 import {router} from "umi";
 import 'moment/locale/zh-cn';
 
@@ -260,7 +260,7 @@ class CommunityNotice extends React.Component {
           if(nowUser.permission[i]=="3"){
             flag = 1;
             this.props.dispatch(routerRedux.push({
-              pathname: '/communityNotice/Create',
+              pathname: '/CommunityManagement/CommunityAnnouncement/Create',
               query: params,
             }))
           }
@@ -270,7 +270,7 @@ class CommunityNotice extends React.Component {
           if(nowUser.permission[i]=="2"){
             flag = 1;
             this.props.dispatch(routerRedux.push({
-              pathname: '/communityNotice/Edit',
+              pathname: '/CommunityManagement/CommunityAnnouncement/Edit',
               query: params,
             }))
           }
@@ -331,7 +331,7 @@ class CommunityNotice extends React.Component {
   //跳转到详情页面
   details = (params) => {
     this.props.dispatch(routerRedux.push({
-      pathname: '/communityNotice/Detail',
+      pathname: '/CommunityManagement/CommunityAnnouncement/Detail',
       query: params,
     }))
   };

src/pages/CommunityManagement/communityNotice/CommunityNoticeCreate.tsx

@@ -7,7 +7,7 @@ import TextArea from 'antd/lib/input/TextArea';
 
 import { PlusOutlined } from '@ant-design/icons';
 
-import SelectOptions from '../../components/SelectOptions/index';
+import SelectOptions from '../../../components/SelectOptions/index';
 const printContent = (comment: any)=>{
   console.log(comment)
 }

src/pages/CommunityManagement/communityNotice/CommunityNoticeDetail.tsx

@@ -7,7 +7,7 @@ import TextArea from 'antd/lib/input/TextArea';
 
 import { PlusOutlined } from '@ant-design/icons';
 
-import SelectOptions from '../../components/SelectOptions/index';
+import SelectOptions from '../../../components/SelectOptions/index';
 const printContent = (comment: any)=>{
   console.log(comment)
 }

src/pages/CommunityManagement/communityNotice/CommunityNoticeEdit.tsx

@@ -7,7 +7,7 @@ import TextArea from 'antd/lib/input/TextArea';
 
 import { PlusOutlined } from '@ant-design/icons';
 
-import SelectOptions from '../../components/SelectOptions/index';
+import SelectOptions from '../../../components/SelectOptions/index';
 const printContent = (comment: any)=>{
   console.log(comment)
 }

src/pages/CommunityManagement/visitorRecord/VisitorRecord.tsx

+import React from 'react';
+import {connect, routerRedux} from 'dva';
+import {Table, Button, Input, Select, Modal, Tooltip, Upload, Icon, Checkbox, Row, Radio, Tag} from "antd";
+import styles from './style.less';
+import {ConnectState} from "@/models/connect";
+// import XLSX from "@/pages/account/xlsx.core.min";
+import {router} from "umi";
+import SelectOptions from '../../../components/SelectOptions/index';
+
+
+
+class VisitorRecord extends React.Component {
+
+  //构造
+  constructor(props) {
+    super(props);
+    this.state = {
+      data: [],
+      province: undefined,
+      city: undefined,
+      district: undefined,
+      street: undefined,
+      total: 1,
+      name: '',
+      model: '',
+      status: undefined,
+      statusList: [{label:"在线",value:"1"}, {label:"故障",value:"3"},{label:"未激活",value:"4"}],
+      provinceList: [],
+      cityList: [{name: "未选择省"}],
+      districtList: [{name: "未选择市"}],
+      streetList: [{name: "未选择区"}],
+      delData: [],
+      visible: false,
+      deviceStatus: '',
+      selectedRowKeys: [],
+
+      used: null,
+      newAdd: null,
+      strList: [],
+      newList:[],
+      authorityList:[
+        {
+          "children": [
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 5,
+              "name": "组织架构",
+              "parentid": 1,
+              "sort": 10,
+              "state": "",
+              "is_checked": true
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 6,
+              "name": "员工管理",
+              "parentid": 1,
+              "sort": 20,
+              "state": "",
+              "is_checked": true
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 11,
+              "name": "角色管理",
+              "parentid": 1,
+              "sort": 30,
+              "state": "",
+              "is_checked": false
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 17,
+              "name": "企业设置",
+              "parentid": 1,
+              "sort": 2,
+              "state": "",
+              "is_checked": true
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 26,
+              "name": "员工管理",
+              "parentid": 1,
+              "sort": 1,
+              "state": "",
+              "is_checked": false
+            }
+          ],
+          "hasChildren": true,
+          "is_admin": 1,
+          "menuid": 1,
+          "name": "企业",
+          "parentid": 0,
+          "sort": 20,
+          "state": "closed",
+          "is_checked": true
+        },
+        {
+          "children": [
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 12,
+              "name": "供应商订单",
+              "parentid": 4,
+              "sort": 10,
+              "state": "",
+              "is_checked": true
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 15,
+              "name": "供应商管理",
+              "parentid": 4,
+              "sort": 20,
+              "state": "",
+              "is_checked": false
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 16,
+              "name": "成为供应商",
+              "parentid": 4,
+              "sort": 30,
+              "state": "",
+              "is_checked": true
+            }
+          ],
+          "hasChildren": true,
+          "is_admin": 1,
+          "menuid": 4,
+          "name": "供应商",
+          "parentid": 0,
+          "sort": 11,
+          "state": "closed",
+          "is_checked": true
+        }
+      ],
+    }
+  }
+
+  /*-----------------   方法集  ------------------*/
+  //重置
+  reset = () => {
+    this.setState({
+      province: undefined,
+      city: undefined,
+      district: undefined,
+      street: undefined,
+      status: undefined,
+      name: '',
+    },() => {
+      this.getDevice();
+    });
+  };
+  //模态框相关
+  showModal = () => {
+    let flag = 0;
+    const nowUser = this.props.currentUser;
+    if(nowUser.permission!=null){
+      for(let i=0;i<nowUser.permission.length;i++){
+        if(nowUser.permission[i]=="4"){
+          if(this.state.delData==null||this.state.delData.length<=0){
+            alert("未选中删除项！");
+            return;
+          }
+          flag = 1;
+          this.setState({
+            visible: true,
+          });
+        }
+      }
+    }else{
+      // alert("找不到用户权限记录！");
+      // return;
+    }
+    if(flag == 0){
+      alert("缺少设备删除权限！");
+    }
+  };
+  handleOk = () => {
+    this.del();
+    this.setState({
+      visible: false,
+    });
+  };
+  handleCancel = () => {
+    this.setState({
+      visible: false,
+    });
+  };
+  //获取所有设备
+  getDevice = () => {
+    const params = {
+      // address: (this.state.province == undefined ? '' : this.state.province.label) +
+      //   (this.state.city == undefined ? '' : '-' + this.state.city.label) +
+      //   (this.state.district == undefined ? '' : '-' + this.state.district.label) +
+      //   (this.state.street == undefined ? '' : '-' + this.state.street.label),
+      name: this.state.name,
+      model: this.state.model,
+      status: this.state.status,
+      id: this.props.currentUser.userid,
+      userPhone:"18813787835"
+    };
+    this.props.dispatch({
+      type: 'tUModel/getTosUser',
+      payload: params,
+      callback: (res) => {
+        if (res) {
+
+          this.setState({
+            data: res.rows,
+            total: res.total,
+          })
+          // if(res.error_code == "0000"){
+          //   this.setState({
+          //     data: res.data.rows,
+          //     total: res.data.total,
+          //   })
+          // }
+
+          if(res.error_code == "0001"){
+            alert(res.error_msg);
+          }else if(res.error_code == "0002"){
+            alert(res.error_msg);
+          }else if(res.error_code == "0008"){
+            alert(res.error_msg);
+            window.location.href = '/';
+            router.replace('/');
+          }
+          // else{
+          //     alert("Tos查询出错！未知错误！");
+          //   }
+        }
+      }
+    });
+  };
+  //跳转到编辑页面
+  edit = (params) => {
+    let flag = 0;
+    const nowUser = this.props.currentUser;
+    if(nowUser.permission!=null){
+      if(params==null){
+        for(let i=0;i<nowUser.permission.length;i++){
+          if(nowUser.permission[i]=="3"){
+            flag = 1;
+            this.props.dispatch(routerRedux.push({
+              pathname: 'tosUser/create',
+              query: params,
+            }))
+          }
+        }
+      }else{
+        for(let i=0;i<nowUser.permission.length;i++){
+          if(nowUser.permission[i]=="2"){
+            flag = 1;
+            this.props.dispatch(routerRedux.push({
+              pathname: '/tosUser/edit',
+              query: params,
+            }))
+          }
+        }
+      }
+    }else{
+      // alert("找不到用户权限记录！");
+      // return;
+    }
+    if(flag == 0){
+      if(params==null){
+        alert("缺少设备添加权限！");
+      }else{
+        alert("缺少设备修改权限！");
+      }
+    }
+  };
+
+  //跳转到编辑页面
+  edit2 = (params) => {
+    let flag = 0;
+    const nowUser = this.props.currentUser;
+    if(nowUser.permission!=null){
+      if(params==null){
+        for(let i=0;i<nowUser.permission.length;i++){
+          if(nowUser.permission[i]=="3"){
+            flag = 1;
+            this.props.dispatch(routerRedux.push({
+              pathname: 'tosUser/edit',
+              query: params,
+            }))
+          }
+        }
+      }else{
+        for(let i=0;i<nowUser.permission.length;i++){
+          if(nowUser.permission[i]=="2"){
+            flag = 1;
+            this.props.dispatch(routerRedux.push({
+              pathname: '/tosUser/edit',
+              query: params,
+            }))
+          }
+        }
+      }
+    }else{
+      // alert("找不到用户权限记录！");
+      // return;
+    }
+    if(flag == 0){
+      if(params==null){
+        alert("缺少设备添加权限！");
+      }else{
+        alert("缺少设备修改权限！");
+      }
+    }
+  };
+
+  //跳转到详情页面
+  details = (params) => {
+    this.props.dispatch(routerRedux.push({
+      pathname: '/tosUser/details',
+      query: params,
+    }))
+  };
+  //设备状态变更
+  statusChange = (e) => {
+    this.setState({status: e == undefined ? undefined : e});
+  };
+  //设备名称和型号修改
+  nameAndModelChange = (e) => {
+    this.setState({name: e.target.value});
+  };
+  //加载省
+  provinceload = (code) => {
+    this.props.dispatch({
+      type: 'deviceModel/getRegion',
+      payload: {code: code,},
+      callback: (res) => {
+        if (res) {
+          this.setState({
+            provinceList: res.data,
+          });
+        }
+      }
+    });
+  };
+  //省变更
+  provinceChange = (e) => {
+    if (e == undefined) {
+      this.setState({
+        cityList: [{name: "未选择省"}],
+        districtList: [{name: "未选择市"}],
+        streetList: [{name: "未选择区"}],
+        province: undefined,
+        city: undefined,
+        district: undefined,
+        street: undefined,
+      })
+    } else {
+      this.setState({province: {label: e.label,}});
+      this.props.dispatch({
+        type: 'deviceModel/getRegion',
+        payload: {code: e.key,},
+        callback: (res) => {
+          if (res) {
+            this.setState({
+              cityList: res.data,
+              city: undefined,
+              district: undefined,
+              street: undefined,
+            });
+          }
+        }
+      });
+    }
+  };
+  //市变更
+  cityChange = (e) => {
+    if (e == undefined) {
+      this.setState({
+        districtList: [{name: "未选择市"}],
+        streetList: [{name: "未选择区"}],
+        city: undefined,
+        district: undefined,
+        street: undefined,
+      })
+    } else {
+      this.setState({city: {label: e.label,}});
+      this.props.dispatch({
+        type: 'deviceModel/getRegion',
+        payload: {code: e.key,},
+        callback: (res) => {
+          if (res) {
+            this.setState({
+              districtList: res.data,
+              district: undefined,
+              street: undefined,
+            });
+          }
+        }
+      });
+    }
+  };
+  //区变更
+  districtChange = (e) => {
+    if (e == undefined) {
+      this.setState({
+        streetList: [{name: "未选择区"}],
+        district: undefined,
+        street: undefined,
+      })
+    } else {
+      this.setState({district: {label: e.label,}});
+      this.props.dispatch({
+        type: 'deviceModel/getRegion',
+        payload: {code: e.key,},
+        callback: (res) => {
+          if (res) {
+            this.setState({
+              streetList: res.data,
+              street: undefined,
+            });
+          }
+        }
+      });
+    }
+  };
+  //批量删除
+  del() {
+    this.props.dispatch({
+      type: 'deviceModel/delDevice',
+      payload: this.state.delData,
+      callback: (res) => {
+        if (res) {
+          if (res.error_code == "0000") {
+            alert(res.error_msg);
+            this.getDevice();
+          } else if(res.error_code == "0001") {
+            alert(res.error_msg);
+          } else if(res.error_code == "0002"){
+            alert(res.error_msg);
+          } else if(res.error_code == "0008"){
+            alert(res.error_msg);
+            window.location.href = '/';
+            router.replace('/');
+          } else {
+            alert("删除失败！未知错误！");
+          }
+        }
+      }
+    });
+  };
+  //显示信息
+  info() {
+    const { used, newAdd, strList} = this.state;
+    const strSelect = strList.map((item) => (
+      <p>{item}</p>
+    ));
+    Modal.info({
+      title: '批量导入结果',
+      content: (
+        <div>
+          <p>绑定<span style={{color:"lightgreen",fontSize:24}}>{newAdd}</span>台设备，
+            以下<span style={{color:"red",fontSize:24}}>{used}</span>台设备已被占用</p>
+          {strSelect}
+        </div>
+      ),
+      onOk() {},
+    });
+  }
+  //初始化
+  componentDidMount() {
+    // this.provinceload(0);
+    this.getDevice();
+  }
+  /*--------------------------------------*/
+  //表格列名
+  columns = [
+    {
+      title: 'invitor',
+      dataIndex: 'owerName',
+      key: 'owerName',
+    },
+    {
+      title: 'Visitor',
+      dataIndex: 'owerPhone',
+      key: 'owerPhone',
+    },
+    {
+      title: 'Security Guarder',
+      dataIndex: 'buildingNumber',
+      key: 'buildingNumber',
+    },
+    {
+      title: 'Car Templete',
+      dataIndex: 'enable',
+      key: 'enable',
+      render: (text, record) => (
+        <span>{record.enable == '1' ? "注册" : "未注册"}</span>
+      ),
+
+      /*    render: (text, record)  => (
+            <>
+              {record.map(enable => {
+                let color = 'green';
+                if (enable === '1') {
+                  color = 'volcano';
+                }
+                if (enable === '0') {
+                  color = 'geekblue';
+                }
+                return (
+                  <Tag color={color} key={enable}>
+                    {enable.toUpperCase()}
+                  </Tag>
+                );
+             }
+            </>
+          ),*/
+
+    },
+
+    /*{
+      title: '用户类型',
+      dataIndex: 'deviceRegisterTime',
+      key: 'deviceRegisterTime',
+    },
+    {
+      title: '状态',
+      dataIndex: 'deviceWorking',
+      key: 'deviceWorking',
+      render: (text, record) => (
+        <span>{record.deviceWorking == '1' ? "正常" :
+          (record.deviceWorking == '2' ? "离线" :
+            (record.deviceWorking == '3' ? "故障" : "未激活"))}</span>
+      )
+    },*/
+   /* {
+      title: 'Actions',
+      dataIndex: 'action',
+      key: 'action',
+      render: (text, record) => (
+        <span>
+          <Button style={{background: 'transparent', border: 0, color: '#1890FF'}}
+                  onClick={() => this.details(record)}>Details</Button>
+          <Button style={{background: 'transparent', border: 0, color: '#1890FF'}}
+                  onClick={() => this.edit(record)}>Edit</Button>
+        </span>
+      ),
+    },*/
+  ];
+  //行选择
+  rowSelection = {
+    onChange: (selectedRowKeys , selectedRows) => {
+      this.setState({
+        delData: selectedRows
+      });
+    },
+  };
+  //渲染
+  render() {
+
+    const printContent = (comment: any)=>{
+      console.log(comment)
+    }
+
+    const {
+      data, total, statusList, provinceList, cityList, districtList,
+      province, city, district, status, name,newList,authorityList
+    } = this.state;
+    const uploadprops = {
+      // 这里我们只接受excel2007以后版本的文件，accept就是指定文件选择框的文件类型
+      accept: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+      name: 'file',
+      headers: {
+        authorization: 'authorization-text',
+      },
+      showUploadList: false,
+      // 把excel的处理放在beforeUpload事件，否则要把文件上传到通过action指定的地址去后台处理
+      // 这里我们没有指定action地址，因为没有传到后台
+      beforeUpload: (file, fileList) => {
+        const rABS = true;
+        const f = fileList[0];
+        const reader = new FileReader();
+        reader.onload = e => {
+          let dataResult = e.target.result;
+          if (!rABS) dataResult = new Uint8Array(dataResult);
+          const workbook = XLSX.read(dataResult, {
+            type: rABS ? 'binary' : 'array',
+          });
+          // 假设我们的数据在第一个标签
+          const firstWorksheet = workbook.Sheets[workbook.SheetNames[0]];
+          // XLSX自带了一个工具把导入的数据转成json
+          const jsonArr = XLSX.utils.sheet_to_json(firstWorksheet, {header: 1});
+          // 通过自定义的方法处理Json,得到Excel原始数据传给后端，后端统一处理
+          const oldDeviceList = [];
+          for (let i = 0; i < jsonArr.length; i++) {
+            //去重
+            if (!oldDeviceList.includes(jsonArr[i][0]) && jsonArr[i][0] != '' && jsonArr[i][0] != null && jsonArr[i][0] != undefined) {
+              oldDeviceList.push(jsonArr[i][0]);
+            }
+          }
+          this.props.dispatch({
+            type: 'deviceModel/importUserDeviceListExcel',
+            payload: {
+              jsonArr: oldDeviceList,
+              userID: this.props.currentUser.userid,
+            },
+            callback: (res) => {
+              if (res) {
+                this.setState({
+                  used: res.data.used,
+                  newAdd: res.data.integer,
+                  strList: res.data.strList,
+                },() => {
+                  this.getDevice();
+                  this.info();
+                });
+              }
+            }
+          });
+        };
+        if (rABS) reader.readAsBinaryString(f);
+        else reader.readAsArrayBuffer(f);
+        return false;
+      },
+    };
+    /*  const statusSelect = statusList.map((item) => (
+        <Select.Option value={item.value} label={item.label}>{item.label}</Select.Option>
+      ));
+      const provinceSelect = provinceList.map((item) => (
+        <Select.Option value={item.code} label={item.name}>{item.name}</Select.Option>
+      ));
+      const citySelect = cityList.map((item) => (
+        <Select.Option value={item.code} label={item.name}>{item.name}</Select.Option>
+      ));
+      const districtSelect = districtList.map((item) => (
+        <Select.Option value={item.code} label={item.name}>{item.name}</Select.Option>
+      ));*/
+    return (
+      <div className={styles.body}>
+        <div className={styles.inputBox}>
+          <Input className={styles.input}
+                 placeholder="User Name"
+                 value={name}
+                 onChange={(e) => this.nameAndModelChange(e)}/>
+          {/*<Select className={styles.input}*/}
+          {/*        placeholder="设备状态"*/}
+          {/*        onChange={(e) => this.statusChange(e)}*/}
+          {/*        allowClear={true}*/}
+          {/*        value={status != undefined ? status: undefined}>{statusSelect}</Select>*/}
+          {/*<Select className={styles.downButton}*/}
+          {/*        placeholder="省"*/}
+          {/*        onChange={(e) => this.provinceChange(e)}*/}
+          {/*        allowClear={true}*/}
+          {/*        labelInValue={true}*/}
+          {/*        value={province}>*/}
+          {/*  {provinceSelect}*/}
+          {/*</Select>*/}
+          {/*<Select className={styles.downButton}*/}
+          {/*        placeholder="市"*/}
+          {/*        onChange={(e) => this.cityChange(e)}*/}
+          {/*        allowClear={true}*/}
+          {/*        labelInValue={true}*/}
+          {/*        value={city}>*/}
+          {/*  {citySelect}*/}
+          {/*</Select>*/}
+          {/*<Select className={styles.downButton}*/}
+          {/*        placeholder="区"*/}
+          {/*        onChange={(e) => this.districtChange(e)}*/}
+          {/*        allowClear={true}*/}
+          {/*        labelInValue={true}*/}
+          {/*        value={district}>*/}
+          {/*  {districtSelect}*/}
+          {/*</Select>*/}
+
+        </div>
+
+        {/*  <div>
+          {
+            authorityList.map((item,key) => {
+              return (
+                <CheckGroup
+                  key={key}
+                  checkId={key}
+                  checkAll={newList[1]['checkAll'+1]}
+                  checkAllId={newList[1]['checkAllId'+1]}
+                  allListId={newList[1]['allListId'+1]}
+                  checkedList={newList[1]['checkedList'+1]}
+                  checkAllValue={item.menuid}
+                  checkAllLable={item.name}
+                  hasChildren={item.hasChildren}
+                  children={item.children}
+                  onChangeGroup={this.selectCheckbox}/>
+              )
+            })
+          }
+
+        </div>*/}
+        <div>
+          <Button className={styles.button1} onClick={() => this.getDevice()}>Search</Button>
+          {/*<Button className={styles.button} onClick={() => this.reset()}>重置</Button>*/}
+          {/*<Button className={styles.button2} onClick={() => this.edit(null)}>Create New Owner</Button>*/}
+          <Upload {...uploadprops}>
+            <Tooltip title="">
+              <Button className={styles.button2}
+                      style={{width: 150}}>
+                <Icon type="upload"/>Batch Upload
+              </Button>
+            </Tooltip>
+          </Upload>
+        </div>
+
+        <div>
+          <h1>Hello World</h1>
+          <SelectOptions  list={["A1 Project","B1 Project","C1 Project","D1 Project","E1 Project","F1 Project"
+            ,"G1 Project","H1 Project","I1 Project","J1 Project","K1 Project","L1 Project","M1 Project","N1 Project"
+            ,"O1 Project","P1 Project","Q1 Project","R1 Project","S1 Project","T1 Project","U1 Project","V1 Project"
+            ,"W1 Project","X1 Project","Y1 Project","Z1 Project"]}  onSubmit={printContent}/>
+        </div>
+
+
+        <div>
+          <Table
+            rowKey={record => record.deviceID}
+            className={styles.table}
+            rowSelection={this.rowSelection}
+            columns={this.columns}
+            dataSource={data}
+            size="small"
+            pagination={{showQuickJumper: true, pageSize: 10, total: total}}
+          />
+          <Button className={styles.button3} onClick={() => this.showModal()}>Delete</Button>
+        </div>
+        <Modal
+          title="确认删除？"
+          visible={this.state.visible}
+          onOk={this.handleOk}
+          onCancel={this.handleCancel}>
+          <div style={{textAlign: "center"}}><p style={{fontSize: 18}}>删除信息将不可恢复</p></div>
+        </Modal>
+      </div>
+    );
+  }
+}
+
+export default connect(({user}: ConnectState) => ({
+  currentUser: user.currentUser,
+}))(VisitorRecord);

src/pages/CommunityManagement/visitorRecord/style.less

+@import '~antd/lib/style/themes/default.less';
+
+.pre {
+  margin: 12px 0;
+  padding: 12px 20px;
+  background: @input-bg;
+  box-shadow: @card-shadow;
+}
+
+.input {
+  width:200px;
+  height:34px;
+  border:1px solid rgba(229, 229, 229, 1);
+  border-radius:5px;
+  margin: 0px 10px;
+}
+
+.input1 {
+  width:200px;
+  height:34px;
+  border:1px solid rgba(229, 229, 229, 1);
+  border-radius:5px;
+  margin: 0px 120px 10px;
+}
+
+.body {
+  background:rgba(255,255,255,1);
+  border:1px solid rgba(229, 229, 229, 1);
+}
+
+.inputBox {
+  width:1250px;
+  height:50px;
+  padding-top: 10px;
+
+}
+
+.downIcon {
+  position: relative;
+  left: 80px;
+}
+
+.downButton {
+  width:120px;
+  height:34px;
+  border:1px solid rgba(229, 229, 229, 1);
+  border-radius:5px;
+  margin: 0px 10px;
+  text-align: left;
+}
+.button11 {
+  width:82px;
+  height:34px;
+  background:rgba(234,244,255,1);
+  border:1px solid rgba(178, 215, 255, 1);
+  font-size:14px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(66,159,255,1);
+  line-height:34px;
+  margin:20px  20px 7px 10px;
+  float: left;
+}
+
+.button1 {
+  width:150px;
+  height:34px;
+  background:rgba(234,244,255,1);
+  border:1px solid rgba(178, 215, 255, 1);
+  font-size:14px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(66,159,255,1);
+  line-height:34px;
+  margin: 7px 10px;
+  float: left;
+}
+
+.button2 {
+  width:150px;
+  height:34px;
+  background:rgba(24,144,255,1);
+  border-radius:4px;
+  font-size:14px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(255,255,255,1);
+  line-height:34px;
+  margin: 7px 10px;
+  float: left;
+}
+
+.button3 {
+  position: relative;
+  bottom: 52px;
+  width:72px;
+  height:32px;
+  background:rgba(255,255,255,1);
+  border:1px solid rgba(229, 229, 229, 1);
+  border-radius:4px;
+  margin: 10px 10px;
+}
+
+.table {
+  margin-right: 10px;
+}
+
+.detailsTitle {
+  display: inline-block;
+  font-size:18px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(73,73,73,1);
+  margin: 0px 30px;
+}
+
+.detailsContent {
+  display: inline-block;
+  font-size:15px;
+  width: 100px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(153,153,153,1);
+  margin: 10px 10px;
+}
+
+.detailsContent2 {
+  display: inline-block;
+  font-size:18px;
+  width: 200px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(51,51,51,1);
+}
+
+.detailsBox {
+  border-top: 1px solid rgba(229, 229, 229, 1);
+  margin: 10px 30px;
+}
+
+.font1 {
+  .detailsContent {
+    font-family:PingFang SC;
+    font-weight:400;
+    color:rgba(153,153,153,1);
+    margin: 5px 10px;
+  }
+
+  .backBox{
+    border: 1px solid rgb(0, 12, 23);
+    font-size: 2em;
+    margin: 50px ;
+    background: #1153ff;
+
+  }
+  .allCheckbox{
+
+  }
+
+  .subCheckbox{
+
+  }
+
+
+}

src/pages/OrderManagement/OrderManagement.tsx

+import React from 'react';
+import {connect, routerRedux} from 'dva';
+import {Table, Button, Input, Select, Modal, Tooltip, Upload, Icon, Checkbox, Row, Radio, Tag} from "antd";
+import styles from './style.less';
+import {ConnectState} from "@/models/connect";
+// import XLSX from "@/pages/account/xlsx.core.min";
+import {router} from "umi";
+import CheckGroup from './CheckGroup';
+import zhCN from 'ant-design-vue/es/locale-provider/zh_CN';
+import moment from 'moment';
+import 'moment/locale/zh-cn';
+
+
+class OrderManagement extends React.Component {
+
+  //构造
+  constructor(props) {
+    super(props);
+    this.state = {
+      data: [],
+      province: undefined,
+      city: undefined,
+      district: undefined,
+      street: undefined,
+      total: 1,
+      name: '',
+      model: '',
+      status: undefined,
+      statusList: [{label:"在线",value:"1"}, {label:"故障",value:"3"},{label:"未激活",value:"4"}],
+      provinceList: [],
+      cityList: [{name: "未选择省"}],
+      districtList: [{name: "未选择市"}],
+      streetList: [{name: "未选择区"}],
+      delData: [],
+      visible: false,
+      deviceStatus: '',
+      selectedRowKeys: [],
+
+      used: null,
+      newAdd: null,
+      strList: [],
+      newList:[],
+      authorityList:[
+        {
+          "children": [
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 5,
+              "name": "组织架构",
+              "parentid": 1,
+              "sort": 10,
+              "state": "",
+              "is_checked": true
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 6,
+              "name": "员工管理",
+              "parentid": 1,
+              "sort": 20,
+              "state": "",
+              "is_checked": true
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 11,
+              "name": "角色管理",
+              "parentid": 1,
+              "sort": 30,
+              "state": "",
+              "is_checked": false
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 17,
+              "name": "企业设置",
+              "parentid": 1,
+              "sort": 2,
+              "state": "",
+              "is_checked": true
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 26,
+              "name": "员工管理",
+              "parentid": 1,
+              "sort": 1,
+              "state": "",
+              "is_checked": false
+            }
+          ],
+          "hasChildren": true,
+          "is_admin": 1,
+          "menuid": 1,
+          "name": "企业",
+          "parentid": 0,
+          "sort": 20,
+          "state": "closed",
+          "is_checked": true
+        },
+        {
+          "children": [
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 12,
+              "name": "供应商订单",
+              "parentid": 4,
+              "sort": 10,
+              "state": "",
+              "is_checked": true
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 15,
+              "name": "供应商管理",
+              "parentid": 4,
+              "sort": 20,
+              "state": "",
+              "is_checked": false
+            },
+            {
+              "children": [],
+              "hasChildren": false,
+              "is_admin": 1,
+              "menuid": 16,
+              "name": "成为供应商",
+              "parentid": 4,
+              "sort": 30,
+              "state": "",
+              "is_checked": true
+            }
+          ],
+          "hasChildren": true,
+          "is_admin": 1,
+          "menuid": 4,
+          "name": "供应商",
+          "parentid": 0,
+          "sort": 11,
+          "state": "closed",
+          "is_checked": true
+        }
+      ],
+    }
+  }
+
+  /*-----------------   方法集  ------------------*/
+  //重置
+  reset = () => {
+    this.setState({
+      province: undefined,
+      city: undefined,
+      district: undefined,
+      street: undefined,
+      status: undefined,
+      name: '',
+    },() => {
+      this.getDevice();
+    });
+  };
+  //模态框相关
+  showModal = () => {
+    let flag = 0;
+    const nowUser = this.props.currentUser;
+    if(nowUser.permission!=null){
+      for(let i=0;i<nowUser.permission.length;i++){
+        if(nowUser.permission[i]=="4"){
+          if(this.state.delData==null||this.state.delData.length<=0){
+            alert("未选中删除项！");
+            return;
+          }
+          flag = 1;
+          this.setState({
+            visible: true,
+          });
+        }
+      }
+    }else{
+    //alert("找不到用户权限记录！");
+      //return;;
+    }
+    if(flag == 0){
+      alert("缺少设备删除权限！");
+    }
+  };
+  handleOk = () => {
+    this.del();
+    this.setState({
+      visible: false,
+    });
+  };
+  handleCancel = () => {
+    this.setState({
+      visible: false,
+    });
+  };
+  //获取所有设备
+  getDevice = () => {
+    const params = {
+      // address: (this.state.province == undefined ? '' : this.state.province.label) +
+      //   (this.state.city == undefined ? '' : '-' + this.state.city.label) +
+      //   (this.state.district == undefined ? '' : '-' + this.state.district.label) +
+      //   (this.state.street == undefined ? '' : '-' + this.state.street.label),
+      name: this.state.name,
+      model: this.state.model,
+      status: this.state.status,
+      id: this.props.currentUser.userid,
+      userPhone:"18813787835"
+    };
+    this.props.dispatch({
+      type: 'tUModel/getTosUser',
+      payload: params,
+      callback: (res) => {
+        if (res) {
+
+          this.setState({
+            data: res.rows,
+            total: res.total,
+          })
+          // if(res.error_code == "0000"){
+          //   this.setState({
+          //     data: res.data.rows,
+          //     total: res.data.total,
+          //   })
+          // }
+
+          if(res.error_code == "0001"){
+            alert(res.error_msg);
+          }else if(res.error_code == "0002"){
+            alert(res.error_msg);
+          }else if(res.error_code == "0008"){
+            alert(res.error_msg);
+            window.location.href = '/';
+            router.replace('/');
+          }
+          // else{
+          //     alert("Tos查询出错！未知错误！");
+          //   }
+        }
+      }
+    });
+  };
+  //跳转到编辑页面
+  edit = (params) => {
+    let flag = 0;
+    const nowUser = this.props.currentUser;
+    if(nowUser.permission!=null){
+      if(params==null){
+        for(let i=0;i<nowUser.permission.length;i++){
+          if(nowUser.permission[i]=="3"){
+            flag = 1;
+            this.props.dispatch(routerRedux.push({
+              pathname: 'tosUser/create',
+              query: params,
+            }))
+          }
+        }
+      }else{
+        for(let i=0;i<nowUser.permission.length;i++){
+          if(nowUser.permission[i]=="2"){
+            flag = 1;
+            this.props.dispatch(routerRedux.push({
+              pathname: '/tosUser/edit',
+              query: params,
+            }))
+          }
+        }
+      }
+    }else{
+    //alert("找不到用户权限记录！");
+      //return;;
+    }
+    if(flag == 0){
+      if(params==null){
+        alert("缺少设备添加权限！");
+      }else{
+        alert("缺少设备修改权限！");
+      }
+    }
+  };
+
+  //跳转到编辑页面
+  edit2 = (params) => {
+    let flag = 0;
+    const nowUser = this.props.currentUser;
+    if(nowUser.permission!=null){
+      if(params==null){
+        for(let i=0;i<nowUser.permission.length;i++){
+          if(nowUser.permission[i]=="3"){
+            flag = 1;
+            this.props.dispatch(routerRedux.push({
+              pathname: 'tosUser/edit',
+              query: params,
+            }))
+          }
+        }
+      }else{
+        for(let i=0;i<nowUser.permission.length;i++){
+          if(nowUser.permission[i]=="2"){
+            flag = 1;
+            this.props.dispatch(routerRedux.push({
+              pathname: '/tosUser/edit',
+              query: params,
+            }))
+          }
+        }
+      }
+    }else{
+    //alert("找不到用户权限记录！");
+      //return;;
+    }
+    if(flag == 0){
+      if(params==null){
+        alert("缺少设备添加权限！");
+      }else{
+        alert("缺少设备修改权限！");
+      }
+    }
+  };
+
+  //跳转到详情页面
+  details = (params) => {
+    this.props.dispatch(routerRedux.push({
+      pathname: '/orderManagement/Detail',
+      query: params,
+    }))
+  };
+  //设备状态变更
+  statusChange = (e) => {
+    this.setState({status: e == undefined ? undefined : e});
+  };
+  //设备名称和型号修改
+  nameAndModelChange = (e) => {
+    this.setState({name: e.target.value});
+  };
+  //加载省
+  provinceload = (code) => {
+    this.props.dispatch({
+      type: 'deviceModel/getRegion',
+      payload: {code: code,},
+      callback: (res) => {
+        if (res) {
+          this.setState({
+            provinceList: res.data,
+          });
+        }
+      }
+    });
+  };
+  //省变更
+  provinceChange = (e) => {
+    if (e == undefined) {
+      this.setState({
+        cityList: [{name: "未选择省"}],
+        districtList: [{name: "未选择市"}],
+        streetList: [{name: "未选择区"}],
+        province: undefined,
+        city: undefined,
+        district: undefined,
+        street: undefined,
+      })
+    } else {
+      this.setState({province: {label: e.label,}});
+      this.props.dispatch({
+        type: 'deviceModel/getRegion',
+        payload: {code: e.key,},
+        callback: (res) => {
+          if (res) {
+            this.setState({
+              cityList: res.data,
+              city: undefined,
+              district: undefined,
+              street: undefined,
+            });
+          }
+        }
+      });
+    }
+  };
+  //市变更
+  cityChange = (e) => {
+    if (e == undefined) {
+      this.setState({
+        districtList: [{name: "未选择市"}],
+        streetList: [{name: "未选择区"}],
+        city: undefined,
+        district: undefined,
+        street: undefined,
+      })
+    } else {
+      this.setState({city: {label: e.label,}});
+      this.props.dispatch({
+        type: 'deviceModel/getRegion',
+        payload: {code: e.key,},
+        callback: (res) => {
+          if (res) {
+            this.setState({
+              districtList: res.data,
+              district: undefined,
+              street: undefined,
+            });
+          }
+        }
+      });
+    }
+  };
+  //区变更
+  districtChange = (e) => {
+    if (e == undefined) {
+      this.setState({
+        streetList: [{name: "未选择区"}],
+        district: undefined,
+        street: undefined,
+      })
+    } else {
+      this.setState({district: {label: e.label,}});
+      this.props.dispatch({
+        type: 'deviceModel/getRegion',
+        payload: {code: e.key,},
+        callback: (res) => {
+          if (res) {
+            this.setState({
+              streetList: res.data,
+              street: undefined,
+            });
+          }
+        }
+      });
+    }
+  };
+  //批量删除
+  del() {
+    this.props.dispatch({
+      type: 'deviceModel/delDevice',
+      payload: this.state.delData,
+      callback: (res) => {
+        if (res) {
+          if (res.error_code == "0000") {
+            alert(res.error_msg);
+            this.getDevice();
+          } else if(res.error_code == "0001") {
+            alert(res.error_msg);
+          } else if(res.error_code == "0002"){
+            alert(res.error_msg);
+          } else if(res.error_code == "0008"){
+            alert(res.error_msg);
+            window.location.href = '/';
+            router.replace('/');
+          } else {
+            alert("删除失败！未知错误！");
+          }
+        }
+      }
+    });
+  };
+  //显示信息
+  info() {
+    const { used, newAdd, strList} = this.state;
+    const strSelect = strList.map((item) => (
+      <p>{item}</p>
+    ));
+    Modal.info({
+      title: '批量导入结果',
+      content: (
+        <div>
+          <p>绑定<span style={{color:"lightgreen",fontSize:24}}>{newAdd}</span>台设备，
+            以下<span style={{color:"red",fontSize:24}}>{used}</span>台设备已被占用</p>
+          {strSelect}
+        </div>
+      ),
+      onOk() {},
+    });
+  }
+  //初始化
+  componentDidMount() {
+    // this.provinceload(0);
+    this.getDevice();
+  }
+  /*--------------------------------------*/
+  //表格列名
+  columns = [
+    {
+      title: 'User Name',
+      dataIndex: 'owerName',
+      key: 'owerName',
+    },
+    {
+      title: 'Project',
+      dataIndex: 'owerPhone',
+      key: 'owerPhone',
+    },
+    {
+      title: 'Affiliated Unit',
+      dataIndex: 'buildingNumber',
+      key: 'buildingNumber',
+    },
+    {
+      title: 'User Status',
+      dataIndex: 'enable',
+      key: 'enable',
+      render: (text, record) => (
+        <span>{record.enable == '1' ? "注册" : "未注册"}</span>
+      ),
+
+      /*    render: (text, record)  => (
+            <>
+              {record.map(enable => {
+                let color = 'green';
+                if (enable === '1') {
+                  color = 'volcano';
+                }
+                if (enable === '0') {
+                  color = 'geekblue';
+                }
+                return (
+                  <Tag color={color} key={enable}>
+                    {enable.toUpperCase()}
+                  </Tag>
+                );
+             }
+            </>
+          ),*/
+
+    },
+
+    /*{
+      title: '用户类型',
+      dataIndex: 'deviceRegisterTime',
+      key: 'deviceRegisterTime',
+    },
+    {
+      title: '状态',
+      dataIndex: 'deviceWorking',
+      key: 'deviceWorking',
+      render: (text, record) => (
+        <span>{record.deviceWorking == '1' ? "正常" :
+          (record.deviceWorking == '2' ? "离线" :
+            (record.deviceWorking == '3' ? "故障" : "未激活"))}</span>
+      )
+    },*/
+    {
+      title: 'Actions',
+      dataIndex: 'action',
+      key: 'action',
+      render: (text, record) => (
+        <span>
+          <Button style={{background: 'transparent', border: 0, color: '#1890FF'}}
+                  onClick={() => this.details(record)}>Details</Button>
+          {/*<Button style={{background: 'transparent', border: 0, color: '#1890FF'}}*/}
+          {/*        onClick={() => this.edit(record)}>Edit</Button>*/}
+        </span>
+      ),
+    },
+  ];
+  //行选择
+  rowSelection = {
+    onChange: (selectedRowKeys , selectedRows) => {
+      this.setState({
+        delData: selectedRows
+      });
+    },
+  };
+  //渲染
+  render() {
+    const {
+      data, total, statusList, provinceList, cityList, districtList,
+      province, city, district, status, name,newList,authorityList
+    } = this.state;
+    const uploadprops = {
+      // 这里我们只接受excel2007以后版本的文件，accept就是指定文件选择框的文件类型
+      accept: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+      name: 'file',
+      headers: {
+        authorization: 'authorization-text',
+      },
+      showUploadList: false,
+      // 把excel的处理放在beforeUpload事件，否则要把文件上传到通过action指定的地址去后台处理
+      // 这里我们没有指定action地址，因为没有传到后台
+      beforeUpload: (file, fileList) => {
+        const rABS = true;
+        const f = fileList[0];
+        const reader = new FileReader();
+        reader.onload = e => {
+          let dataResult = e.target.result;
+          if (!rABS) dataResult = new Uint8Array(dataResult);
+          const workbook = XLSX.read(dataResult, {
+            type: rABS ? 'binary' : 'array',
+          });
+          // 假设我们的数据在第一个标签
+          const firstWorksheet = workbook.Sheets[workbook.SheetNames[0]];
+          // XLSX自带了一个工具把导入的数据转成json
+          const jsonArr = XLSX.utils.sheet_to_json(firstWorksheet, {header: 1});
+          // 通过自定义的方法处理Json,得到Excel原始数据传给后端，后端统一处理
+          const oldDeviceList = [];
+          for (let i = 0; i < jsonArr.length; i++) {
+            //去重
+            if (!oldDeviceList.includes(jsonArr[i][0]) && jsonArr[i][0] != '' && jsonArr[i][0] != null && jsonArr[i][0] != undefined) {
+              oldDeviceList.push(jsonArr[i][0]);
+            }
+          }
+          this.props.dispatch({
+            type: 'deviceModel/importUserDeviceListExcel',
+            payload: {
+              jsonArr: oldDeviceList,
+              userID: this.props.currentUser.userid,
+            },
+            callback: (res) => {
+              if (res) {
+                this.setState({
+                  used: res.data.used,
+                  newAdd: res.data.integer,
+                  strList: res.data.strList,
+                },() => {
+                  this.getDevice();
+                  this.info();
+                });
+              }
+            }
+          });
+        };
+        if (rABS) reader.readAsBinaryString(f);
+        else reader.readAsArrayBuffer(f);
+        return false;
+      },
+    };
+    /*  const statusSelect = statusList.map((item) => (
+        <Select.Option value={item.value} label={item.label}>{item.label}</Select.Option>
+      ));
+      const provinceSelect = provinceList.map((item) => (
+        <Select.Option value={item.code} label={item.name}>{item.name}</Select.Option>
+      ));
+      const citySelect = cityList.map((item) => (
+        <Select.Option value={item.code} label={item.name}>{item.name}</Select.Option>
+      ));
+      const districtSelect = districtList.map((item) => (
+        <Select.Option value={item.code} label={item.name}>{item.name}</Select.Option>
+      ));*/
+    return (
+      <div className={styles.body}>
+        <div className={styles.inputBox}>
+          <Input className={styles.input}
+                 placeholder="Community"
+                 value={name}
+                 onChange={(e) => this.nameAndModelChange(e)}/>
+          <Input className={styles.input}
+                 placeholder="Service Type"
+                 value={name}
+                 onChange={(e) => this.nameAndModelChange(e)}/>
+          <Input className={styles.input}
+                 placeholder="Order State"
+                 value={name}
+                 onChange={(e) => this.nameAndModelChange(e)}/>
+          {/*<Select className={styles.input}*/}
+          {/*        placeholder="设备状态"*/}
+          {/*        onChange={(e) => this.statusChange(e)}*/}
+          {/*        allowClear={true}*/}
+          {/*        value={status != undefined ? status: undefined}>{statusSelect}</Select>*/}
+          {/*<Select className={styles.downButton}*/}
+          {/*        placeholder="省"*/}
+          {/*        onChange={(e) => this.provinceChange(e)}*/}
+          {/*        allowClear={true}*/}
+          {/*        labelInValue={true}*/}
+          {/*        value={province}>*/}
+          {/*  {provinceSelect}*/}
+          {/*</Select>*/}
+          {/*<Select className={styles.downButton}*/}
+          {/*        placeholder="市"*/}
+          {/*        onChange={(e) => this.cityChange(e)}*/}
+          {/*        allowClear={true}*/}
+          {/*        labelInValue={true}*/}
+          {/*        value={city}>*/}
+          {/*  {citySelect}*/}
+          {/*</Select>*/}
+          {/*<Select className={styles.downButton}*/}
+          {/*        placeholder="区"*/}
+          {/*        onChange={(e) => this.districtChange(e)}*/}
+          {/*        allowClear={true}*/}
+          {/*        labelInValue={true}*/}
+          {/*        value={district}>*/}
+          {/*  {districtSelect}*/}
+          {/*</Select>*/}
+
+        </div>
+
+
+
+        <div>
+          <Button className={styles.button1} onClick={() => this.getDevice()}>Search</Button>
+          <Button className={styles.button} onClick={() => this.reset()}>重置</Button>
+          {/*<Button className={styles.button2} onClick={() => this.edit(null)}>Create New Owner</Button>*/}
+          {/*<Upload {...uploadprops}>*/}
+          {/*  <Tooltip title="">*/}
+          {/*    <Button className={styles.button2}*/}
+          {/*            style={{width: 150}}>*/}
+          {/*      <Icon type="upload"/>Batch Upload*/}
+          {/*    </Button>*/}
+          {/*  </Tooltip>*/}
+          {/*</Upload>*/}
+        </div>
+        <div>
+          <Table
+            rowKey={record => record.deviceID}
+            className={styles.table}
+            rowSelection={this.rowSelection}
+            columns={this.columns}
+            dataSource={data}
+            size="small"
+            pagination={{showQuickJumper: true, pageSize: 10, total: total}}
+          />
+          <Button className={styles.button3} onClick={() => this.showModal()}>Delete</Button>
+        </div>
+        <Modal
+          title="确认删除？"
+          visible={this.state.visible}
+          onOk={this.handleOk}
+          onCancel={this.handleCancel}>
+          <div style={{textAlign: "center"}}><p style={{fontSize: 18}}>删除信息将不可恢复</p></div>
+        </Modal>
+      </div>
+    );
+  }
+}
+
+export default connect(({user}: ConnectState) => ({
+  currentUser: user.currentUser,
+}))(OrderManagement);

src/pages/OrderManagement/OrderManagementDetail.tsx

+import React from 'react';
+import {connect, routerRedux} from 'dva';
+import {Table, Button, DatePicker, Select, Menu, Modal, Input, Icon} from "antd";
+import styles from './style.less';
+import {ConnectState} from "@/models/connect";
+import ExportJsonExcel from 'js-export-excel';
+import {router} from "umi";
+import { Upload, message} from 'antd';
+
+
+
+//npm install js-export-excel
+
+
+
+class OrderManagementDetail extends React.Component {
+
+  //构造
+  constructor(props) {
+    super(props);
+    this.state = {
+      record: [],
+      data: [],
+      total: 1,
+      type: undefined,
+      typeList: ["扫描模块故障", "打印机故障", "触摸屏故障","副屏故障"],
+      moment: [],
+      current: 'record',
+      delData: [],
+      visible: false,
+      uploadVisible: false,
+      fileList: [],
+    }
+  }
+
+  /*-----------------   方法集  ------------------*/
+  //打印excel
+  downloadExcel = () => {
+    let flag = 0;
+    const nowUser = this.props.currentUser;
+    if(nowUser.permission!=null){
+      for(let i=0;i<nowUser.permission.length;i++){
+        if(nowUser.permission[i]=="14"){
+          flag = 1;
+          const data = this.state.record ? this.state.record : '';//表格数据
+          var option={};
+          let dataTable = [];
+          if (data) {
+            for (let i in data) {
+              if(data){
+                let warnType;
+                if(data[i].warn_type == 1) {
+                  warnType = '扫描模块故障';
+                }else if(data[i].warn_type == 2) {
+                  warnType = '打印机故障';
+                }else if(data[i].warn_type == 3) {
+                  warnType = '触摸屏故障';
+                }else if(data[i].warn_type == 4) {
+                  warnType = '副屏故障';
+                }
+                let obj = {
+                  '设备名称': data[i].device_name,
+                  '设备型号': data[i].device_model,
+                  '警报类型': warnType,
+                  '报警时间': data[i].warn_time,
+                  '地址': data[i].device_address,
+                  '联系人': data[i].user_account,
+                  '联系方式': data[i].user_phone,
+                }
+                dataTable.push(obj);
+              }
+            }
+          }
+          option.fileName = '警报信息';
+          option.datas=[
+            {
+              sheetData:dataTable,
+              sheetName:'sheet',
+              sheetFilter:['设备名称','设备型号','警报类型','报警时间','联系人','联系方式','地址'],
+              sheetHeader:['设备名称','设备型号','警报类型','报警时间','联系人','联系方式','地址'],
+            }
+          ];
+
+          var toExcel = new ExportJsonExcel(option);
+          toExcel.saveExcel();
+        }
+      }
+    }else{
+    //alert("找不到用户权限记录！");
+      //return;;
+    }
+    if(flag == 0){
+      alert("缺少批量下载权限！");
+      return;
+    }
+  };
+  //模态框相关
+  showModal = () => {
+    let flag = 0;
+    let permissionNum = null;
+    const nowUser = this.props.currentUser;
+    if(nowUser.permission!=null){
+      for(let i=0;i<nowUser.permission.length;i++){
+        if(this.state.current == "record"){
+          permissionNum = "15";
+        }else{
+          permissionNum = "12";
+        }
+        if(nowUser.permission[i]==permissionNum){
+          if(this.state.delData==null||this.state.delData.length<=0){
+            alert("未选中删除项！");
+            return;
+          }
+          flag = 1;
+          this.setState({
+            visible: true,
+          });
+        }
+      }
+    }else{
+    //alert("找不到用户权限记录！");
+      //return;;
+    }
+    if(flag == 0){
+      if(this.state.current == "record"){
+        alert("缺少警报记录删除权限！");
+      }else{
+        alert("缺少警报模板删除权限！");
+      }
+    }
+  };
+  handleOk = () => {
+    this.del();
+    this.setState({
+      visible: false,
+    });
+  };
+  handleCancel = () => {
+    this.setState({
+      visible: false,
+    });
+  };
+  //获取警报数据
+  getData = () => {
+    const nowUser = this.props.currentUser.userid;
+    const params = {
+      type: this.state.type,
+      userID: nowUser,
+      userPhone:"18813787835"
+    };
+    this.props.dispatch({
+      type: 'tUModel/getTosUser',
+      payload: params,
+      callback: (res) => {
+        if (res) {
+          console.log(res);
+          // if(res.error_code == "0000"){
+          this.setState({
+            data: res.rows,
+            total: res.total,
+          })
+          /*   } else if(res.error_code == "0002") {
+               alert(res.error_msg);
+             }  else if(res.error_code == "0008"){
+               alert(res.error_msg);
+               window.location.href = '/';
+               router.replace('/');
+             } else {
+               alert("获取警报数据失败！未知错误！");
+             }*/
+        }
+      }
+    });
+  };
+  //获取警报记录数据
+  getRecord = () => {
+    const params = {
+      type: this.state.type,
+      moment: this.state.moment,
+      id: this.props.currentUser.userid,
+      userPhone:"18813787835"
+    };
+    this.props.dispatch({
+      type: 'tUModel/getTosUser',
+      payload: params,
+      callback: (res) => {
+        // if (res.error_code == "0000"){
+        this.setState({
+          record: res.rows,
+          total: res.total,
+        })
+        /*      } else if(res.error_code == "0002"){
+                alert(res.error_msg);
+              }  else if(res.error_code == "0008"){
+                alert(res.error_msg);
+                window.location.href = '/';
+                router.replace('/');
+              }
+              else {
+                // alert("获取警报记录失败！未知错误！")
+              }*/
+      }
+    });
+  };
+  //批量删除
+  del(){
+    this.props.dispatch({
+      type: this.state.current == 'model'?'warnModel/delWarn':'warnModel/delWarnRecord',
+      payload: this.state.delData,
+      callback: (res) => {
+        if (res) {
+          console.log(res);
+          if(res.error_code == "0000"){
+            alert("删除完毕！");
+            if(this.state.current == 'model'){
+              this.getData();
+            }else{
+              this.getRecord();
+            }
+          }else if(res.error_code == "0001") {
+            alert(res.error_msg);
+          } else if(res.error_code == "0002"){
+            alert(res.error_msg);
+          }  else if(res.error_code == "0008"){
+            alert(res.error_msg);
+            window.location.href = '/';
+            router.replace('/');
+          } else {
+            alert("删除失败！未知错误！");
+          }
+        }
+      }
+    });
+  };
+  //跳转到编辑页面
+  edit = (params) => {
+
+    this.props.dispatch(routerRedux.push({
+      pathname: '/tosUser/common',
+      query: params,
+    }))
+
+    let flag = 0;
+    const nowUser = this.props.currentUser;
+    if(nowUser.permission!=null){
+      if(params==null){
+        for(let i=0;i<nowUser.permission.length;i++){
+          if(nowUser.permission[i]=="11"){
+            flag = 1;
+            this.props.dispatch(routerRedux.push({
+              pathname: '/tosUser/common',
+              query: params,
+            }))
+          }
+        }
+      }else{
+        for(let i=0;i<nowUser.permission.length;i++){
+          if(nowUser.permission[i]=="10"){
+            flag = 1;
+            this.props.dispatch(routerRedux.push({
+              pathname: '/warn/edit',
+              query: params,
+            }))
+          }
+        }
+      }
+    }else{
+    //alert("找不到用户权限记录！");
+      //return;;
+    }
+    if(flag == 0){
+      if(params==null){
+        alert("缺少添加警报模板权限！");
+      }else{
+        alert("缺少修改警报模版权限！");
+      }
+    }
+  };
+  //警报启用禁用
+  changeStatus = (e) => {
+    const params = {
+      status: e.warnStatus == '0'? 1:0,
+      warnID: e.warnID ? e.warnID : null,
+    };
+    this.props.dispatch({
+      type: 'warnModel/quitAndUserWarn',
+      payload: params,
+      callback: () => {
+        this.getData();
+      }
+    });
+  };
+  //状态变更
+  typeChange = (e) => {
+    this.setState({type: e == undefined?undefined:e+1});
+  };
+  //日期变更
+  dateChange = (e) => {
+    this.setState({moment: e});
+  };
+  //水平导航
+  handleClick = (e) => {
+    this.setState({
+      current: e.key,
+    },() => {
+      if(this.state.current == "record"){
+        this.getRecord();
+      }else{
+        this.getData(null);
+      }
+    });
+  };
+  clickUploadAPP(record) {
+    this.setState({
+      uploadVisible: true,
+      // app_id: record.app_id,
+      app_id:'',
+      team_head_id:''
+    })
+  }
+  handleSureTableChange = () => {
+    this.setState({
+      uploadVisible: false
+    });
+  }
+
+  handleUpload = () => {
+    const {fileList} = this.state;
+    var fileData;
+    fileList.forEach(file => {
+      if (file) {
+        fileData = file;
+      }
+
+    });
+    if (fileData) {
+      const params = {
+        fileBase64Str: fileData.thumbUrl,
+        userToken: localStorage.getItem('jwToken'),
+        // app_id: this.state.app_id,
+        fileName: fileData.name,
+        // remark: this.state.remark,
+        /**/
+        team_head_id: '',
+        // fileName: getFileName('uploadFile'),
+        // remark: '',
+        // fileBase64Str: fileBase64Str
+
+      }
+      /* request_post('/teamHead/uploadTeamLogoWeb', params, (json) => {
+         if (json.error_code == '0000') {
+           Modal.info({
+             content: (
+               '上传成功'
+             ),
+             onOk() {
+             },
+           });
+         }else {
+           Modal.info({
+             content: (
+               '上传失败'
+             ),
+             onOk() {
+             },
+           });
+         }
+       })*/
+      this.props.dispatch({
+        type: '/teamHead/uploadTeamLogoWeb',
+        payload: params,
+        callback: (res) => {
+          if (res) {
+            console.log(res);
+            // if(res.error_code == "0000"){
+            this.setState({
+              data: res.rows,
+              total: res.total,
+            })
+            /*   } else if(res.error_code == "0002") {
+                 alert(res.error_msg);
+               }  else if(res.error_code == "0008"){
+                 alert(res.error_msg);
+                 window.location.href = '/';
+                 router.replace('/');
+               } else {
+                 alert("获取警报数据失败！未知错误！");
+               }*/
+          }
+        }
+      });
+
+    }
+
+  }
+
+  handleCancelUserInfo = () => {
+    this.currentSelectUserInfo = '';
+    this.setState({
+      uploadVisible: false
+    });
+  }
+
+
+  //跳转到设备页面
+  back = () => {
+    this.props.dispatch(routerRedux.push({
+      pathname: '/orderManagement',
+    }))
+  };
+
+
+  handleChange = (info) => {
+    const isJpgOrPng = info.file.type === 'image/jpeg' || info.file.type === 'image/png';
+    if (!isJpgOrPng) {
+      message.error('不支持 JPG/PNG 以外的文件!');
+      return;
+    }
+    const isLt2M = info.file.size / 1024 / 1024 < 20;
+    if (!isLt2M) {
+      message.error('文件大小不能超过 20MB!');
+      return;
+    }
+    let fileList = [...info.fileList];
+    fileList = fileList.slice(-6);
+    fileList = fileList.map(file => {
+      if (file.response) {
+        file.url = file.response.url;
+      }
+      return file;
+    });
+    this.setState({ fileList });
+  };
+
+  //提交
+  onSubmit = () => {
+    // this.phoneBlur();
+  };
+
+  //初始化
+  componentDidMount() {
+    if (this.props.location.query != null) {
+      const params = this.props.location.query;
+      this.setState({
+        current: params.current?params.current:'record',
+      },() => {
+        if(this.state.current == "record"){
+          this.getRecord();
+        }else{
+          this.getData();
+        }
+      });
+    }
+  }
+
+  /*--------------------------------------*/
+  //表格列名
+  columns = [
+    {
+      title: 'User Name',
+      dataIndex: 'warnType',
+      key: 'warnType',
+      render: (text, record) => (
+        <span>
+          {record.warnType == 1?'扫描模块故障':''}
+          {record.warnType == 2?'打印机故障':''}
+          {record.warnType == 3?'触摸屏故障':''}
+          {record.warnType == 4?'副屏故障':''}
+        </span>
+      ),
+    },
+    {
+      title: 'Contact Details',
+      dataIndex: 'warnContactsInformation',
+      key: 'warnContactsInformation',
+    },
+    {
+      title: 'E-mail',
+      dataIndex: 'warnDetails',
+      key: 'warnDetails',
+    },
+    {
+      title: 'Account Type',
+      dataIndex: 'enable',
+      key: 'warn_time',
+    },
+    {
+      title: 'User Status',
+      dataIndex: 'user_account',
+      key: 'user_account',
+
+      defaultSortOrder: 'descend',
+      sorter: (a, b) => a.user_account - b.user_account,
+    },
+    /*   {
+         title: '状态',
+         dataIndex: 'status',
+         key: 'status',
+         render: (text, record) => (
+           <span>
+             {record.warnStatus == 1? "启用": "禁用"}
+           </span>
+         )
+       },*/
+    {
+      title: 'Actions',
+      dataIndex: 'action',
+      key: 'action',
+      render: (text, record) => (
+        <span>
+          <Button style={{background: 'transparent', border: 0, color: '#1890FF'}}
+                  onClick={() => this.edit(record)}>Details</Button>
+          {/*   <Button style={{background: 'transparent', border: 0, color: '#1890FF'}}
+                  onClick={() => this.changeStatus(record)}>{record.warnStatus == 1? "关闭": "启用"}</Button>*/}
+        </span>
+      ),
+    },
+  ];
+  columns2 = [
+    {
+      title: 'User Name',
+      dataIndex: 'owerName',
+      key: 'device_name',
+    },
+    {
+      title: 'Contact Details',
+      dataIndex: 'owerPhone',
+      key: 'device_model',
+    },
+    {
+      title: 'E-mail',
+      dataIndex: 'buildingNumber',
+      key: 'warn_type',
+      render: (text, record) => (
+        <span>
+          {record.warn_type == 1?'扫描模块故障':''}
+          {record.warn_type == 2?'打印机故障':''}
+          {record.warn_type == 3?'触摸屏故障':''}
+          {record.warn_type == 4?'副屏故障':''}
+        </span>
+      ),
+    },
+    {
+      title: 'Account Type',
+      dataIndex: 'enable',
+      key: 'warn_time',
+    },
+    {
+      title: 'User Status',
+      dataIndex: 'user_account',
+      key: 'user_account',
+
+      defaultSortOrder: 'descend',
+      sorter: (a, b) => a.user_account - b.user_account,
+    },
+    {
+      title: 'Actions',
+      dataIndex: 'action',
+      key: 'action',
+      render: (text, record) => (
+        <span>
+          <Button style={{background: 'transparent', border: 0, color: '#1890FF'}}
+                  onClick={() => this.edit(record)}>Details</Button>
+          {/*   <Button style={{background: 'transparent', border: 0, color: '#1890FF'}}
+                  onClick={() => this.edit(record)}>编辑</Button>*/}
+        </span>
+      ),
+    },
+    /*    {
+          title: '联系方式',
+          dataIndex: 'user_phone',
+          key: 'user_phone',
+        },
+        {
+          title: '地址',
+          dataIndex: 'device_address',
+          key: 'device_address',
+        },*/
+  ];
+  //行选择
+  rowSelection = {
+    onChange: (selectedRowKeys, selectedRows) => {
+      this.setState({
+        delData: selectedRows
+      },() => {
+        console.log(this.state.delData);
+      });
+    }
+  };
+
+  //渲染
+  render() {
+
+    const props = {
+      onRemove: file => {
+        const index = fileList.indexOf(file);
+        const newFileList = fileList.slice();
+        newFileList.splice(index, 1);
+        return {
+          fileList: newFileList,
+        };
+      },
+      beforeUpload: file => {
+        const r = new FileReader();
+        r.readAsDataURL(file);
+        r.onload = e => {
+          file.thumbUrl = e.target.result;
+          this.setState(state => ({
+            fileList: [...state.fileList, file],
+          }));
+        };
+        return false;
+      },
+    };
+
+    const {uploadVisible, data, total, typeList, current, record, visible,tosUser } = this.state;
+
+    const typeSelect = typeList.map((item, index) => (
+      <Select.Option value={index}>{item}</Select.Option>
+    ));
+
+    const upload = {
+      action: '/api/ad/upload',
+      onChange: this.handleChange,
+      multiple: true,
+    };
+
+    return (
+      <div className={styles.body}>
+
+        <div style={{marginTop:48}}>
+          <div>
+            <span className={styles.detailsTitle}>Reply To Project Maintenance</span>  <Button className={styles.button11} onClick={() => this.back()}>Return</Button>
+            <div className={styles.detailsBox}>
+              <div>
+                <span className={styles.detailsContent}>Status</span>
+                {/*<Input className={styles.input} value={""}  placeholder="Name"*/}
+                {/*  onChange={(e) => this.snChange(e)}*/}
+                {/*/>*/}
+                <span className={styles.detailsContent3}>{tosUser}</span>
+                <span className={styles.detailsContent}>Pending For Processing</span>
+                {/*<span className={styles.detailsContent2}>{tosUser}</span>*/}
+                {/*   <span className={styles.detailsContent}>设备ID</span>*/}
+                {/*<span className={styles.detailsContent2}>{tosUser}</span>*/}
+              </div>
+              <div>
+                <span className={styles.detailsContent}>Published At</span>
+                {/*<Input className={styles.input} value={""} placeholder="Telephone"*/}
+                {/*  onChange={(e) => this.snChange(e)}*/}
+                {/*/>*/}
+                <span className={styles.detailsContent3} style={{width:200}}>{tosUser}</span>
+                {/*<span className={styles.detailsContent}>18817589685</span>*/}
+                {/*<Input className={styles.input} value={""} placeholder="E-mail"*/}
+                {/*  onChange={(e) => this.snChange(e)}*/}
+                {/*/>*/}
+                {/*<span className={styles.detailsContent2}>{tosUser}</span>*/}
+                <span className={styles.detailsContent}>26-03-2020 13：00</span>
+                {/*<span className={styles.detailsContent2}>{tosUser}</span>*/}
+              </div>
+              {/*<div>*/}
+              {/*  <span className={styles.detailsContent}>联系地址</span>*/}
+              {/*  <span className={styles.detailsContent3}>{total}</span>*/}
+              {/*</div>*/}
+            </div>
+          </div>
+        </div>
+
+
+        <div style={{padding:30}}>
+          <Menu
+            className={styles.menu}
+            onClick={this.handleClick}
+            selectedKeys={[current]}
+            mode="horizontal">
+            <Menu.Item key="record" className={styles.menuItem}>
+
+            </Menu.Item>
+            {/*<Menu.Item key="model">*/}
+            {/*  Constant company*/}
+            {/*</Menu.Item>*/}
+          </Menu>
+        </div>
+        <div className={styles.inputBox}>
+
+
+          <div>
+            <span className={styles.detailsContent1}>Sunshine Stanford</span>
+            <span className={styles.detailsContent3}>{tosUser}</span>
+            <span className={styles.detailsContent1}>03#06-2050</span>
+
+          </div>
+          <div>
+            <span className={styles.detailsContent}>Albert Street, 175, Singapore, Albert, Bugis, Victoria Street,</span>
+            <span className={styles.detailsContent3}>{tosUser}</span>
+            <span className={styles.detailsContent1}>Singapore 189969</span>
+            <span className={styles.detailsContent3}>{tosUser}</span>
+          </div>
+
+          <div>
+            <span className={styles.detailsContent1}>User Name</span>
+            <span className={styles.detailsContent3}>{tosUser}</span>
+            <span className={styles.detailsContent1}>Josephine</span>
+            <span className={styles.detailsContent3}>{tosUser}</span>
+            <span className={styles.detailsContent1}>Contact Details</span>
+            <span className={styles.detailsContent3}>{tosUser}</span>
+            <span className={styles.detailsContent1}>13657724536</span>
+            <span className={styles.detailsContent3}>{tosUser}</span>
+          </div>
+
+        </div>
+        <div>
+          <div>
+            <span className={styles.detailsContent1}>Complaint Description</span>
+            {/*  <span className={styles.detailsContent2}>{tosUser}</span>*/}
+            <Input className={styles.input1}   placeholder="The user's notes of property maintenance are written here"
+              // onChange={(e) => this.nameChange(e)}
+            />
+          </div>
+          <div>
+            <span className={styles.detailsContent1}>Picture</span>
+            {/*  <span className={styles.detailsContent2}>{tosUser}</span>*/}
+            <img style ={{width:100,height:100,margin:20,}}src= {"https://www.srthinker.com:5305/file/bea3c35262ab4bae8d904701a4e4d1a9.jpg"} />
+            <img style ={{width:100,height:100,margin:20,}}src= {"http://120.77.240.215:5205/file/8e23d00533514c3a8506e790498cde5f.jpg"} />
+            <img style ={{width:100,height:100,margin:20,}}src= {"https://www.srthinker.com:5305/file/40f3208f17df4a34af65c31f850541a1.jpg"} />
+
+          </div>
+
+          <div style={{padding:30}}>
+            <Menu
+              className={styles.menu}
+              onClick={this.handleClick}
+              selectedKeys={[current]}
+              mode="horizontal">
+              <Menu.Item key="record" className={styles.menuItem}>
+
+              </Menu.Item>
+
+            </Menu>
+          </div>
+          <div>
+            <span className={styles.detailsContent1}>Replied By</span>
+            <span className={styles.detailsContent3}>{tosUser}</span>
+            <span className={styles.detailsContent1}>Bellamy</span>
+            <span className={styles.detailsContent1}>Contact Details</span>
+            <span className={styles.detailsContent3}>{tosUser}</span>
+            <span className={styles.detailsContent1}>13657724536</span>
+            <span className={styles.detailsContent3}>{tosUser}</span>
+          </div>
+          <div>
+            <div>
+              <span className={styles.detailsContent1}>Resolved Complaint</span>
+              {/*  <span className={styles.detailsContent2}>{tosUser}</span>*/}
+              <Input className={styles.input1}   placeholder="Please enter the processing result"
+                // onChange={(e) => this.nameChange(e)}
+              />
+            </div>
+
+            <div>
+              <span className={styles.detailsContent1}>Picture</span>
+              {/*  <span className={styles.detailsContent2}>{tosUser}</span>*/}
+              <img style ={{width:100,height:100,margin:20,}}src= {"http://final.srthinker.com/file/aa68e397ef544ec797ba1897904a5f73.jpg_70x70"} />
+              <img style ={{width:100,height:100,margin:20,}}src= {"http://final.srthinker.com/file/b3e6b569a03749328d2408a9be1a00cc.jpg_70x70"} />
+              <img style ={{width:100,height:100,margin:20,}}src= {"http://final.srthinker.com/file/fcb12e667b134af5a2799ff900b13912.jpg_70x70"} />
+
+            </div>
+
+
+
+            <Button className={styles.button22} onClick={() => this.onSubmit()}>Submit</Button>
+
+          </div>
+
+        </div>
+
+        <div>
+
+        </div>
+        <Modal
+          title="确认删除？"
+          visible={visible}
+          onOk={this.handleOk}
+          onCancel={this.handleCancel}>
+          <div style={{textAlign:"center"}}><p style={{fontSize:18}}>删除信息将不可恢复</p></div>
+        </Modal>
+      </div>
+    );
+  }
+}
+
+export default connect(({user}:ConnectState) => ({
+  currentUser: user.currentUser,
+}))(OrderManagementDetail);

src/pages/OrderManagement/style.less

+@import '~antd/lib/style/themes/default.less';
+
+.pre {
+  margin: 12px 0;
+  padding: 12px 20px;
+  background: @input-bg;
+  box-shadow: @card-shadow;
+}
+
+.input {
+  width:200px;
+  height:34px;
+  border:1px solid rgba(229, 229, 229, 1);
+  border-radius:5px;
+  margin: 0px 10px;
+}
+
+.input1 {
+  width:400px;
+  height:100px;
+  border:1px solid rgba(229, 229, 229, 1);
+  border-radius:5px;
+  margin: 0px 10px;
+}
+
+.body {
+  background:rgba(255,255,255,1);
+  border:1px solid rgba(229, 229, 229, 1);
+}
+
+.inputBox {
+  width:1250px;
+  //height:50px;
+  padding-top: 10px;
+  margin-bottom: 10px;
+}
+
+.downIcon {
+  position: relative;
+  left: 80px;
+}
+
+.downButton {
+  width:120px;
+  height:34px;
+  border:1px solid rgba(229, 229, 229, 1);
+  border-radius:5px;
+  margin: 0px 10px;
+  text-align: left;
+}
+
+.button1 {
+  width:82px;
+  height:34px;
+  background:rgba(234,244,255,1);
+  border:1px solid rgba(178, 215, 255, 1);
+  font-size:14px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(66,159,255,1);
+  line-height:34px;
+  margin: 10px 10px;
+}
+
+.button2 {
+  width:82px;
+  height:34px;
+  background:rgba(24,144,255,1);
+  border-radius:4px;
+  font-size:14px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(255,255,255,1);
+  line-height:34px;
+  margin: 7px 10px;
+}
+
+.button22 {
+  width:82px;
+  height:34px;
+  background:rgba(24,144,255,1);
+  border-radius:4px;
+  font-size:14px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(255,255,255,1);
+  line-height:34px;
+  margin: 7px 10px;
+  margin-bottom: 100px;
+}
+
+.button3 {
+  position: relative;
+  bottom: 52px;
+  width:72px;
+  height:32px;
+  background:rgba(255,255,255,1);
+  border:1px solid rgba(229, 229, 229, 1);
+  border-radius:4px;
+  margin: 10px 10px;
+}
+
+.table {
+  margin-right: 10px;
+}
+
+.detailsTitle {
+  display: inline-block;
+  font-size:18px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(73,73,73,1);
+  margin: 0px 30px;
+}
+
+.detailsContent {
+  display: inline-block;
+  font-size:18px;
+  width: 500px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(153,153,153,1);
+  margin: 10px 10px;
+}
+
+.detailsContent1 {
+  display: inline-block;
+  font-size:18px;
+  width: 200px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(153,153,153,1);
+  margin: 10px 10px;
+}
+
+
+.detailsContent11 {
+  display: flex;
+  //font-size:18px;
+  //width: 200px;
+  //font-family:PingFang SC;
+  //font-weight:400;
+  //color:rgba(153,153,153,1);
+  margin-top: 20px ;
+}
+
+.detailsContent2 {
+  display: inline-block;
+  font-size:18px;
+  width: 200px;
+  font-family:PingFang SC;
+  font-weight:400;
+  color:rgba(51,51,51,1);
+}
+
+.detailsBox {
+  border-top: 1px solid rgba(229, 229, 229, 1);
+  margin: 10px 10px 10px 30px;
+}
+
+.font1 {
+  .detailsContent {
+    font-family:PingFang SC;
+    font-weight:400;
+    color: rgb(153, 153, 153);
+    margin: 5px 10px;
+  }
+}

src/services/orderManagement.ts

+import request from '@/utils/request';
+
+export async function getAdvertisement(params) {
+  return request('/api/ad/get', {
+    method: 'POST',
+    data: params,
+  });
+}
+
+export async function delAdvertisement(params) {
+  return request('/api/ad/del', {
+    method: 'POST',
+    data: params,
+  });
+}
+
+export async function saveAdvertisement(params) {
+  return request('/api/ad/save', {
+    method: 'POST',
+    data: params,
+  });
+}
+
+export async function quitAndUserAd(params) {
+  return request('/api/ad/quitAndUserAd', {
+    method: 'POST',
+    data: params,
+  });
+}
+
+export async function uploadApk(params) {
+  return request('/api/uploadApk/apk', {
+    method: 'POST',
+    data: params,
+  });
+}
+
+export async function checkVideo(params) {
+  return request('/api/uploadApk/prview', {
+    method: 'POST',
+    data: params,
+  });
+}

src/services/visitorRecord.ts

+import request from '@/utils/request';
+
+export async function getAdvertisement(params) {
+  return request('/api/ad/get', {
+    method: 'POST',
+    data: params,
+  });
+}
+
+export async function delAdvertisement(params) {
+  return request('/api/ad/del', {
+    method: 'POST',
+    data: params,
+  });
+}
+
+export async function saveAdvertisement(params) {
+  return request('/api/ad/save', {
+    method: 'POST',
+    data: params,
+  });
+}
+
+export async function quitAndUserAd(params) {
+  return request('/api/ad/quitAndUserAd', {
+    method: 'POST',
+    data: params,
+  });
+}
+
+export async function uploadApk(params) {
+  return request('/api/uploadApk/apk', {
+    method: 'POST',
+    data: params,
+  });
+}
+
+export async function checkVideo(params) {
+  return request('/api/uploadApk/prview', {
+    method: 'POST',
+    data: params,
+  });
+}