A 添加发布申请批量删除

spug_api/apps/deploy/urls.py

@@ -8,5 +8,4 @@ from .views import *
 urlpatterns = [
     path('request/', RequestView.as_view()),
     path('request/<int:r_id>/', RequestDetailView.as_view()),
-    path('request/batch', RequestBatchView.as_view()),
 ]

spug_api/apps/deploy/views.py

@@ -108,10 +108,15 @@ class RequestView(View):
 
     def delete(self, request):
         form, error = JsonParser(
-            Argument('id', type=int, help='缺少必要参数')
+            Argument('id', type=int, required=False),
+            Argument('expire', required=False)
         ).parse(request.GET)
         if error is None:
+            if form.id:
                 DeployRequest.objects.filter(pk=form.id, status__in=('0', '1', '-1')).delete()
+            if form.expire:
+                count, _ = DeployRequest.objects.filter(created_at__lt=form.expire).delete()
+                return json_response(count)
         return json_response(error=error)
 
 
@@ -186,15 +191,3 @@ class RequestDetailView(View):
             req.reason = form.reason
             req.save()
         return json_response(error=error)
-
-
-class RequestBatchView(View):
-
-    def delete(self, request):
-        form, error = JsonParser(
-            Argument('expire_time', type=str, help="缺少必要参赛"),
-        ).parse(request.body)
-        if error is None:
-            DeployRequest.objects.filter(created_at__lt=form.expire_time).delete()
-        return json_response(error=error)
-    

spug_web/src/components/AuthButton.js

@@ -13,5 +13,5 @@ export default function AuthButton(props) {
   if (props.auth && !hasPermission(props.auth)) {
     disabled = true;
   }
-  return <Button {...props} disabled={disabled}>{props.children}</Button>
+  return props.hide && disabled ? null : <Button {...props} disabled={disabled}>{props.children}</Button>
 }

spug_web/src/pages/deploy/request/Table.js

@@ -70,7 +70,7 @@ class ComTable extends React.Component {
       } else if (info.status === '-3') {
         return <Tag color="red">{info['status_alias']}</Tag>
       } else {
-        return info['status_alias']
+        return <Tag>{info['status_alias']}</Tag>
       }
     }
   }, {
@@ -182,6 +182,13 @@ class ComTable extends React.Component {
         return date >= store.f_s_date && date <= store.f_e_date
       })
     }
+    if (store.f_status !== 'all') {
+      if (store.f_status === '99') {
+        data = data.filter(item => ['-1', '2'].includes(item['status']))
+      } else {
+        data = data.filter(item => item['status'] === store.f_status)
+      }
+    }
     return (
       <Table rowKey="id" loading={store.isFetching} dataSource={data} columns={this.columns}/>
     )

spug_web/src/pages/deploy/request/index.js

@@ -5,19 +5,27 @@
  */
 import React from 'react';
 import { observer } from 'mobx-react';
-import { Button, Select, DatePicker } from 'antd';
+import { Button, Select, DatePicker, Radio, Row, Col, Modal, Form, message } from 'antd';
-import { SearchForm, AuthDiv, AuthCard } from 'components';
+import { SearchForm, AuthButton, AuthCard } from 'components';
 import SelectApp from './SelectApp';
 import Ext1Form from './Ext1Form';
 import Ext2Form from './Ext2Form';
 import Approve from './Approve';
 import ComTable from './Table';
+import http from 'libs/http';
 import envStore from 'pages/config/environment/store';
 import appStore from 'pages/config/app/store'
 import store from './store';
 
 @observer
 class Index extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      expire: undefined
+    }
+  }
+
   componentDidMount() {
     if (envStore.records.length === 0) {
       envStore.fetchRecords()
@@ -27,6 +35,25 @@ class Index extends React.Component {
     }
   }
 
+  handleBatchDel = () => {
+    Modal.confirm({
+      icon: 'exclamation-circle',
+      title: '批量删除发布申请',
+      content: (
+        <Form>
+          <Form.Item required label="截止日期" help={<div>将删除截止日期<span style={{color: 'red'}}>之前</span>的所有发布申请记录。</div>}>
+            <DatePicker placeholder="请输入" onChange={val => this.setState({expire: val.format('YYYY-MM-DD')})}/>
+          </Form.Item>
+        </Form>
+      ),
+      onOk: () => http.delete(`/api/deploy/request/?expire=${this.state.expire}`)
+        .then(res => {
+          message.success(`成功删除${res}条记录`);
+          store.fetchRecords()
+        }),
+    })
+  };
+
   render() {
     return (
       <AuthCard auth="deploy.request.view">
@@ -46,15 +73,38 @@ class Index extends React.Component {
             </Select>
           </SearchForm.Item>
           <SearchForm.Item span={8} title="申请时间">
-            <DatePicker.RangePicker onChange={store.updateDate} />
+            <DatePicker.RangePicker onChange={store.updateDate}/>
           </SearchForm.Item>
-          <SearchForm.Item span={4}>
+          <SearchForm.Item span={4} style={{textAlign: 'right'}}>
             <Button type="primary" icon="sync" onClick={store.fetchRecords}>刷新</Button>
           </SearchForm.Item>
         </SearchForm>
-        <AuthDiv auth="deploy.request.add" style={{marginBottom: 16}}>
+        <Row style={{marginBottom: 16}}>
-          <Button type="primary" icon="plus" onClick={() => store.addVisible = true}>新建发布申请</Button>
+          <Col span={16}>
-        </AuthDiv>
+            <Radio.Group value={store.f_status} onChange={e => store.f_status = e.target.value}>
+              <Radio.Button value="all">全部({store.counter['all'] || 0})</Radio.Button>
+              <Radio.Button value="0">待审核({store.counter['0'] || 0})</Radio.Button>
+              <Radio.Button value="1">待发布({store.counter['1'] || 0})</Radio.Button>
+              <Radio.Button value="3">发布成功({store.counter['3'] || 0})</Radio.Button>
+              <Radio.Button value="-3">发布异常({store.counter['-3'] || 0})</Radio.Button>
+              <Radio.Button value="99">其他({store.counter['99'] || 0})</Radio.Button>
+            </Radio.Group>
+          </Col>
+          <Col span={8} style={{textAlign: 'right'}}>
+            <AuthButton
+              hide
+              type="primary"
+              icon="delete"
+              auth="deploy.request.del"
+              onClick={this.handleBatchDel} style={{marginRight: 20}}>批量删除</AuthButton>
+            <AuthButton
+              hide
+              type="primary"
+              icon="plus"
+              auth="deploy.request.add"
+              onClick={() => store.addVisible = true}>新建发布申请</AuthButton>
+          </Col>
+        </Row>
         <ComTable/>
         {store.addVisible && <SelectApp/>}
         {store.ext1Visible && <Ext1Form/>}

spug_web/src/pages/deploy/request/store.js

@@ -12,6 +12,7 @@ class Store {
   @observable types = [];
   @observable record = {};
   @observable refs = {};
+  @observable counter = {};
   @observable isLoading = false;
   @observable isFetching = false;
   @observable addVisible = false;
@@ -19,6 +20,7 @@ class Store {
   @observable ext2Visible = false;
   @observable approveVisible = false;
 
+  @observable f_status = 'all';
   @observable f_app_id;
   @observable f_env_id;
   @observable f_s_date;
@@ -28,9 +30,23 @@ class Store {
     this.isFetching = true;
     http.get('/api/deploy/request/')
       .then(res => this.records = res)
+      .then(this._updateCounter)
       .finally(() => this.isFetching = false)
   };
 
+  _updateCounter = () => {
+    const counter = {'all': 0, '-3': 0, '-1': 0, '0': 0, '1': 0, '2': 0, '3': 0};
+    for (let item of this.records) {
+      counter['all'] += 1;
+      if (['-1', '2'].includes(item['status'])) {
+        counter['99'] += 1
+      } else {
+        counter[item['status']] += 1
+      }
+    }
+    this.counter = counter
+  };
+
   loadDeploys = () => {
     this.isLoading = true;
     http.get('/api/app/deploy/')