update

src/apis/base.js

@@ -13,7 +13,7 @@ const request = axios.create({
   baseURL: `${getPrefix()}/api`,
   timeout: 5000,
   withCredentials: true,
-  // headers: { 'content-type': 'application/json' }
+  headers: { 'content-type': 'application/json' }
 })
 
 request.interceptors.request.use(

src/pages/dc/index.js

@@ -2,6 +2,7 @@ import React from 'react'
 import { connect } from 'dva'
 import { message, Divider, Popconfirm } from 'antd'
 import { FilterTable } from 'wptpc-design'
+import router from 'umi/router'
 import s from './index.less'
 import Edit from './components/Edit'
 import { dc } from '@/conf/config'
@@ -47,24 +48,39 @@ class Index extends React.PureComponent {
   tableSetting = {
     rowKey: 'id',
     columnConfig: [
-      { title: '序号', dataIndex: 'id' },
-      { title: '规则名', dataIndex: 'rule' },
-      { title: '接口', dataIndex: 'url' },
-      { title: '是否可以运行', dataIndex: 'status', 
-      render: (text) => text === 1 ? '可以运行':'禁止运行'
-    },
-      { title: '描述', dataIndex: 'desc' },
+      {
+        title: '序号',
+        dataIndex: 'id'
+      },
+      {
+        title: '规则名',
+        dataIndex: 'rule'
+      },
+      {
+        title: '接口',
+        dataIndex: 'url'
+      },
+      {
+        title: '是否可以运行',
+        dataIndex: 'status',
+        render: (text) => text === 1 ? '可以运行' : '禁止运行'
+      },
+      {
+        title: '描述',
+        dataIndex: 'desc'
+      },
       // { title: '创建时间', dataIndex: 'createTime' },
       // { title: '更新时间', dataIndex: 'modifyTime' },
       {
         title: '操作',
         dataIndex: 'actions',
         // 所有需要弹窗操作的都可以用编辑的逻辑；所有不需要弹窗的操作，比如上架、发布等，都可以用”删除“的逻辑
-        render: (text, record) => <span><a onClick={() => this.editItem(record)}>编辑</a><Divider type="vertical" /><Popconfirm
+        render: (text, record) => <span><a onClick={() => this.editItem(record)}>编辑</a><Divider
+          type="vertical"/><Popconfirm
           title="确定删除"
           onConfirm={() => this.delItem(record)}>
           <a>删除</a>
-        </Popconfirm><Divider type="vertical" /><Popconfirm
+        </Popconfirm><Divider type="vertical"/><Popconfirm
           title="确定执行"
           onConfirm={() => this.execItem(record)}>
           <a>执行</a>
@@ -76,14 +92,37 @@ class Index extends React.PureComponent {
       this.refresh = refresh
     },
     // 筛选和列表的中间位置如果有批量操作按钮，可以放在这个位置
-    batchBtns: [{ label: '创建', type: 'primary', onClick: () => this.editItem({fieldsJson:"{}"}) }]
+    batchBtns: [
+      {
+        label: '创建',
+        type: 'primary',
+        onClick: () => this.editItem({ fieldsJson: '{}' })
+      },
+      {
+        label: '全部规则列表',
+        type: '',
+        onClick: () => {
+          router.push('/dc/list')
+        }
+      }
+    ]
   }
 
   // 点击编辑按钮时的事件处理函数
   editItem (record) {
     const fields = JSON.parse(record.fieldsJson)
-    const fieldsJson = Object.keys(fields).map(f => ({ key: f, desc: fields[f].desc, column: fields[f].column }))
-    this.setState({ showModal: true, params: { ...record, fieldsJson } })
+    const fieldsJson = Object.keys(fields).map(f => ({
+      key: f,
+      desc: fields[f].desc,
+      column: fields[f].column
+    }))
+    this.setState({
+      showModal: true,
+      params: {
+        ...record,
+        fieldsJson
+      }
+    })
   }
 
   // 点击删除按钮时的事件处理函数
@@ -115,7 +154,6 @@ class Index extends React.PureComponent {
     })
   }
 
-
   // 点击新建、编辑对话框的取消按钮的事件处理函数
   onModalCancel = () => {
     this.setState({ showModal: false })
@@ -132,13 +170,14 @@ class Index extends React.PureComponent {
 
     const fieldsJson = params.fieldsJson.reduce((t, { key, desc, column }) => {
       t[key] = {
-        desc, column
+        desc,
+        column
       }
-      return t;
+      return t
     }, {})
-    console.log(fieldsJson,1)
+    console.log(fieldsJson, 1)
     params.fieldsJson = JSON.stringify(fieldsJson)
-    console.log(params,2)
+    console.log(params, 2)
     const type = !params.id ? 'template/_addItem' : 'template/_editItem'
     this.props.dispatch({
       type,
@@ -161,8 +200,10 @@ class Index extends React.PureComponent {
 
     return (
       <div className={s.templatePage}>
-        <FilterTable filterSetting={this.filterSetting} tableSetting={this.tableSetting} apiUrl={apiUrl} isPage={false} />
-        {showModal && <Edit showModal={showModal} params={params} onCancel={this.onModalCancel} onOk={this.onModalOk} loading={actionLoading} />}
+        <FilterTable filterSetting={this.filterSetting} tableSetting={this.tableSetting} apiUrl={apiUrl}
+          isPage={false}/>
+        {showModal && <Edit showModal={showModal} params={params} onCancel={this.onModalCancel} onOk={this.onModalOk}
+          loading={actionLoading}/>}
       </div>
     )
   }

src/pages/dc/list.js

@@ -0,0 +1,73 @@
+import React from 'react'
+import { FilterTable } from 'wptpc-design'
+import s from './index.less'
+import { dc } from '@/conf/config'
+const apiUrl = `${dc}/dc/web/get-all-rule-field`
+
+class List extends React.PureComponent {
+  state = {
+    showModal: false,
+    params: {}
+  }
+
+  filterSetting = {
+    // isClearSearch: true,
+    // formFields: [
+    //   { label: 'ID:', type: 'input', key: 'id', placeholder: '请输入账户ID' },
+    // ],
+    // // 在接口请求前，可以修改给接口的入参
+    // beforeSearchFunc: params => {
+    //   params.pageNum = params.pageNum
+    // }
+  }
+
+  // filtertable的列表配置
+  tableSetting = {
+    rowKey: 'id',
+    columnConfig: [
+      {
+        title: '序号',
+        dataIndex: 'id'
+      },
+      {
+        title: '描述',
+        dataIndex: 'desc'
+      },
+      {
+        title: '别名',
+        dataIndex: 'alias'
+      },
+      {
+        title: '字段',
+        dataIndex: 'name'
+      },
+      {
+        title: 'url',
+        dataIndex: 'url'
+      }
+    ],
+    // 通过这个函数可以获取列表的刷新的函数，编辑、删除后可以用它来刷新列表
+    getRefresh: refresh => {
+      this.refresh = refresh
+    }
+    // 筛选和列表的中间位置如果有批量操作按钮，可以放在这个位置
+    // batchBtns: [{
+    //   label: '创建',
+    //   type: 'primary',
+    //   onClick: () => this.editItem({ fieldsJson: '{}' })
+    // }]
+  }
+
+  render () {
+    // const { showModal, params } = this.state
+    // const { actionLoading } = this.props
+
+    return (
+      <div className={s.templatePage}>
+        <FilterTable filterSetting={this.filterSetting} tableSetting={this.tableSetting} apiUrl={apiUrl} isPage={false}/>
+      </div>
+    )
+  }
+}
+
+export default List