公告搜索栏更改

Signed-off-by: cellee <893264950@qq.com>

src/pages/CommunityManagement/CommunityAnnouncement/CommunityAnnouncement.tsx

 import React, { useState, useEffect } from 'react';
-import {connect,history,useModel,Loading} from 'umi';
-import { Input ,Tabs,Table,Space, Button,Tooltip} from 'antd';
+import { connect, history, useModel, Loading } from 'umi';
+import { Input, Tabs, Table, Space, Button, Tooltip, Form, message } from 'antd';
 const { TabPane } = Tabs;
 
-import { PlusOutlined,SearchOutlined,ClearOutlined } from '@ant-design/icons';
+import { PlusOutlined, SearchOutlined, ClearOutlined } from '@ant-design/icons';
 import ProTable from '@ant-design/pro-table';
 
 // import { objectColumns } from '@/utils/string';
-import {timestampToTime3, timestampToTime} from '@/utils/time'
-
-// 搜索框
-import TitleSearch from '../../../components/TitleSearch/TitleSearch';
-
+import { timestampToTime3, timestampToTime } from '@/utils/time';
+import SearchOptionsCommnity from '@/components/SearchOptions/SearchOptionsCommnity';
 
 // communityNum: "A7"
 // count: 0
@@ -27,141 +24,169 @@ import TitleSearch from '../../../components/TitleSearch/TitleSearch';
 // noticTitlel: "大家好，今年端午节不放假"
 // updateTime: "Jun 28, 2020 7:38:39 PM"
 
-
 // import { RA } from '@/utils/method';
 
 const goToAdd = () => {
-  history.push("./CommunityAnnouncement/Add");
-}
-const module="CommunityAnnouncement"
-const CommunityAnnouncement = (props:any) => {
-
-
-  const { dispatch, Data, curString , loading } = props;
-
+  history.push('./CommunityAnnouncement/Add');
+};
+const module = 'CommunityAnnouncement';
+const CommunityAnnouncement = (props: any) => {
+  const { dispatch, Data, curString, userListLoading } = props;
 
   const columns = [
     {
-      title:"community", 
-      dataIndex:"communityNum",
+      title: 'community',
+      dataIndex: 'communityNum',
       width: 400,
       ellipsis: {
         showTitle: false,
       },
     },
     {
-      title:"Title", 
-      dataIndex:"noticTitlel",
+      title: 'Title',
+      dataIndex: 'noticTitlel',
     },
     {
-      title:"Publish Time", 
-      dataIndex:"noticStartTime",
-      render:(text: any, record: any) => (
-        <Space size="middle">
-          {text!=null? timestampToTime(text.time):null}
-        </Space>
-      )
+      title: 'Publish Time',
+      dataIndex: 'noticStartTime',
+      render: (text: any, record: any) => (
+        <Space size="middle">{text != null ? timestampToTime(text.time) : null}</Space>
+      ),
     },
     {
-      title:"noticScope", 
-      dataIndex:"noticScope",
+      title: 'noticScope',
+      dataIndex: 'noticScope',
     },
     {
-      title:"Actions", 
-      render:(text: any, record: any) => (
-        <Space size="middle"><a>Detail</a></Space>
+      title: 'Actions',
+      render: (text: any, record: any) => (
+        <Space size="middle">
+          <a>Detail</a>
+        </Space>
       ),
     },
   ];
   useEffect(() => {
-    RA(25,{communityNum: "", noticTitlel: "" , pageNum:1 },module,dispatch)
-  },[1])
-
+    RA(25, { communityNum: '', noticTitlel: '', pageNum: 1 }, module, dispatch);
+  }, [1]);
 
   //
 
-  const RA = (index:any,values: any) => { 
+  const RA = (index: any, values: any) => {
     dispatch({
       type: 'FacilityBookings/RA',
-      playload: {index:index, body:values } 
-    }) 
+      playload: { index: index, body: values },
+    });
   };
 
+  const SA = (values: any) => {
+    dispatch({ type: 'FacilityBookings/SA', playload: values });
+  };
+  const QA = (values: any) => {
+    dispatch({ type: 'FacilityBookings/QA', playload: values });
+  };
 
-  const SA = (values: any) => { dispatch({ type: 'FacilityBookings/SA', playload: values }) };
-  const QA = (values: any) => { dispatch({ type: 'FacilityBookings/QA', playload: values }) };
+  const CA = () => {
+    dispatch({ type: 'FacilityBookings/CA', playload: null });
+  };
 
-  const CA = () => { dispatch({ type: 'FacilityBookings/CA',  playload: null }) };
+  const [form] = Form.useForm();
 
-  // 点击搜索
-  const CallBackTitleSearch= (comment: any) => {
-    console.log(comment)
+  // 重置
+  const onReset = () => {
+    form.resetFields();
+    let payload = {
+      index: 19,
+      page: {
+        pageNum: 1,
+      },
+    };
+    // requst(payload);
+  };
 
-    if (curString.tab == 1) {  
-      if (comment.communityName != null || comment.key != null || comment.status != null) {  
-        var tmp = curString      
-        tmp.subscribeDate = comment.key
-        if (comment.status == null||comment.status==undefined) {
-          tmp.status = 0; 
+  // 表单提交
+  const onFinishContract = (value: any) => {
+    // console.log(value)
+    if (!value.communityName && !value.contractNumber && !value.contractTitle) {
+      message.error('Please enter one of them!');
     } else {
-          tmp.status = comment.status
-        }
-        tmp.communityNameList = comment.communityName
-        tmp.curPage=1
-        QA(tmp) 
-        console.log(tmp)
-        //中断
-        RA(9, { userToken: token, pageNum: "1", subscribeDate: tmp.subscribeDate, status: tmp.status,communityNameList:comment.communityName })
+      console.log(value);
+      let payload = {
+        index: 19,
+        page: {
+          pageNum: 1,
+          contractNumber: value.contractNumber,
+          contractTitle: value.contractTitle,
+          communityName: value.communityName,
+        },
+      };
+      // requst(payload);
     }
-    } else {
-      if (comment.communityName != null || comment.facilityName != null) {
-        var tmp = curString      
-        tmp.communityNameList = comment.communityName
-        tmp.facilityName = comment.facilityName
-        tmp.curPage=1
-        QA(tmp) 
-        RA(8, {communityNameList: comment.communityName, facilityName: comment.facilityName, pageNum: "1"})
+  };
 
-      }
-    }
-  }
+  // 选择小区名字并赋值
+  const opname = (value: any) => {
+    form.setFieldsValue({
+      communityName: value,
+    });
+  };
   return (
-    <div style={{ width: "100%", minWidth: 1020, padding: 34, backgroundColor: "#ffffff" }}>       
-      {/* 搜索组件 */}
-      {
-        curString.tab == 1 ?
     <>
-        <TitleSearch
-              status={[{
-                name: ["status", "Order status"],
-                data: [[0, "All"], [1, "Applied"], [2, "Reserved"], [3, "Used"], [4, "Cancelled"]]
-              }]}
-        time={["key", "Booking time "]}
-        
-        community={"communityName"}  
-        checklist={curString.communityNameList!=null?curString.communityNameList:null}
-        onSubmit={CallBackTitleSearch} />
-        </> :
-        <>
-        <TitleSearch
-        listkey={['facilityName']}    list={['Facility name']}
-        community={"communityName"}
-        onSubmit={CallBackTitleSearch} />
-        </>
-      }  
-
-      {Data!=null?
+      <div style={{ width: '100%', padding: 20, marginBottom: 15, backgroundColor: '#ffffff' }}>
+        <Form
+          autoComplete="off"
+          layout="inline"
+          form={form}
+          name="contract"
+          onFinish={onFinishContract}
+        >
+          <Form.Item name="communityName">
+            <SearchOptionsCommnity
+              // ubmit={extendName}
+              opname={opname}
+            />
+          </Form.Item>
+          <Form.Item name="contractNumber">
+            <Input allowClear placeholder="Contract Number" />
+          </Form.Item>
+          <Form.Item name="contractTitle">
+            <Input allowClear placeholder="Contract Title" />
+          </Form.Item>
+          <Form.Item>
+            <Button
+              type="primary"
+              htmlType="submit"
+              icon={<SearchOutlined />}
+              loading={userListLoading}
+            >
+              Search{' '}
+            </Button>
+            <Button
+              htmlType="button"
+              onClick={onReset}
+              style={{ marginLeft: '15px' }}
+              icon={<ClearOutlined />}
+              loading={userListLoading}
+            >
+              {' '}
+              Reset
+            </Button>
+          </Form.Item>
+        </Form>
+      </div>
+      <div style={{ width: '100%', padding: 10, backgroundColor: '#ffffff' }}>
+        {Data != null ? (
           <ProTable
-        loading={loading}
+            loading={userListLoading}
             rowKey="id"
-        style={{ marginTop: 16 }}
             dataSource={Data.rows}
             columns={columns}
             pagination={false} // 隐藏默认分页
             search={false}
             toolBarRender={() => [
               <Button key="3" type="primary" onClick={goToAdd}>
-            <PlusOutlined />Create new Announcement
+                <PlusOutlined />
+                Create new Announcement
               </Button>,
             ]}
             options={{
@@ -173,16 +198,18 @@ const CommunityAnnouncement = (props:any) => {
               setting: false,
             }}
             headerTitle="Announcement list"
-      />:null}   
+          />
+        ) : null}
       </div>
+    </>
   );
 };
 
-function map(state:any) {
-  const loading = state.loading.models.FacilityBookings;
+function map(state: any) {
+  const userListLoading = state.loading.models.FacilityBookings;
   const Data = state.FacilityBookings.NoticeList;
   const { curString } = state.FacilityBookings;
-  return { Data,curString,loading }
+  return { Data, curString, userListLoading };
 }
 export default connect(map)(CommunityAnnouncement);