[incubator-apisix-dashboard] branch feat-ssl updated: feat: added search query

[ju...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

juzhiyuan pushed a commit to branch feat-ssl
in repository https://gitbox.apache.org/repos/asf/incubator-apisix-dashboard.git


The following commit(s) were added to refs/heads/feat-ssl by this push:
     new 629cc58  feat: added search query
629cc58 is described below

commit 629cc587c05ee3a3fae9db704fb4ce161a18b0ae
Author: juzhiyuan <jj...@gmail.com>
AuthorDate: Mon Jun 15 16:48:26 2020 +0800

    feat: added search query
---
 src/pages/ssl/List.tsx   | 36 +++++++++++++++++++++++++-----------
 src/pages/ssl/service.ts | 23 ++++++++++++++++++-----
 2 files changed, 43 insertions(+), 16 deletions(-)

diff --git a/src/pages/ssl/List.tsx b/src/pages/ssl/List.tsx
index 3f1a656..88b1927 100644
--- a/src/pages/ssl/List.tsx
+++ b/src/pages/ssl/List.tsx
@@ -1,7 +1,7 @@
 import React, { useRef } from 'react';
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
 import ProTable, { ProColumns, ActionType } from '@ant-design/pro-table';
-import { Button, Switch, Popconfirm, notification } from 'antd';
+import { Button, Switch, Popconfirm, notification, DatePicker } from 'antd';
 import { history, useIntl } from 'umi';
 import { PlusOutlined } from '@ant-design/icons';
 
@@ -12,7 +12,6 @@ const List: React.FC = () => {
   const { formatMessage } = useIntl();
 
   const onEnableChange = (id: string, checked: boolean) => {
-    console.log({ id, checked });
     updateSSL(id, checked)
       .then(() => {
         notification.success({ message: '更新证书启用状态成功' });
@@ -39,14 +38,15 @@ const List: React.FC = () => {
       title: '是否启用',
       dataIndex: 'status',
       render: (text, record) => (
-        <>
-          <Switch
-            defaultChecked={Number(text) === 1}
-            onChange={(checked: boolean) => {
-              onEnableChange(record.id, checked);
-            }}
-          />
-        </>
+        <Switch
+          defaultChecked={Number(text) === 1}
+          onChange={(checked: boolean) => {
+            onEnableChange(record.id, checked);
+          }}
+        />
+      ),
+      renderFormItem: (_, props) => (
+        <Switch onChange={(checked) => props.onChange && props.onChange(Number(checked))} />
       ),
     },
     {
@@ -72,13 +72,27 @@ const List: React.FC = () => {
         </Popconfirm>
       ),
     },
+    {
+      title: '有效期',
+      dataIndex: 'expire_range',
+      hideInTable: true,
+      renderFormItem: (_, props) => (
+        <DatePicker.RangePicker
+          onChange={(range) => {
+            const from = range?.[0]?.unix();
+            const to = range?.[1]?.unix();
+            props.onChange && props.onChange(`${from}:${to}`);
+          }}
+        />
+      ),
+    },
   ];
 
   return (
     <PageHeaderWrapper>
       <ProTable<SSLModule.ResSSL>
         request={(params) => fetchSSLList(params)}
-        search={false}
+        search
         rowKey="id"
         columns={columns}
         actionRef={tableRef}
diff --git a/src/pages/ssl/service.ts b/src/pages/ssl/service.ts
index 9de9971..b46667c 100644
--- a/src/pages/ssl/service.ts
+++ b/src/pages/ssl/service.ts
@@ -1,14 +1,26 @@
 import { request } from 'umi';
+import querystring from 'querystring';
+import { identity, pickBy, omit } from 'lodash';
+
 import { transformFetchItemData } from '@/transforms/global';
 
 type FetchListParams = {
-  current: number;
-  pageSize: number;
+  current?: number;
+  pageSize?: number;
+  sni?: string;
+  expire_range?: string;
+  expire_start?: number;
+  expire_end?: number;
+  status?: 0;
 };
 
-export const fetchList = (params?: Partial<FetchListParams>) =>
-  request<{ count: number; list: SSLModule.ResSSL[] }>(
-    `/ssls?page=${params?.current || 1}&size=${params?.pageSize || 10}`,
+export const fetchList = ({ current = 1, pageSize = 10, ...props }: FetchListParams) => {
+  const [expire_start, expire_end] = (props.expire_range || '').split(':');
+  let queryObj = omit(props, 'expire_range', '_timestamp');
+  queryObj = pickBy(Object.assign({}, queryObj, { expire_start, expire_end }), identity);
+  const query = querystring.encode(queryObj);
+  return request<{ count: number; list: SSLModule.ResSSL[] }>(
+    `/ssls?page=${current}&size=${pageSize}&${query}`,
   ).then((data) => {
     return {
       count: data.count,
@@ -18,6 +30,7 @@ export const fetchList = (params?: Partial<FetchListParams>) =>
       })),
     };
   });
+};
 
 export const fetchItem = (id: string) =>
   request(`/ssls/${id}`).then((data) => transformFetchItemData<SSLModule.SSL>(data));