新增物流模板

config/routes/memberRoute.ts

@@ -20,7 +20,40 @@ const MemberRoute = {
         {
           path: '/memberAbility/manage/import',
           name: 'memberImport',
-          component: '@/pages/index',
+          key: 'memberImport',
+          component: '@/pages/member/memberImport/index',
+        },
+        {
+          path: '/memberAbility/manage/addMember',
+          name: 'addMember',
+          key: 'addMember',
+          hideInMenu: true,
+          component: '@/pages/member/memberImport/addMember',
+        },
+        {
+          path: '/memberAbility/manage/maintian',
+          name: 'memberMaintain',
+          key: 'memberMaintain',
+          component: '@/pages/member/memberMaintain/index',
+        },
+        {
+          path: '/memberAbility/manage/upgradeRule',
+          name: 'memberUpgradeRule',
+          key: 'memberUpgradeRule',
+          component: '@/pages/member/memberUpgradeRule/index',
+        },
+        {
+          path: '/memberAbility/manage/level',
+          name: 'memberLevel',
+          key: 'memberLevel',
+          component: '@/pages/member/memberLevel/index'
+        },
+        {
+          path: '/memberAbility/manage/level/addEquity',
+          name: 'addEquity',
+          key: 'addEquity',
+          hideInMenu: true,
+          component: '@/pages/member/memberLevel/addEquity',
         }
       ]
     }

package.json

@@ -27,7 +27,7 @@
     "@umijs/preset-react": "1.x",
     "@umijs/test": "^3.2.0",
     "bizcharts": "^4.0.7",
-    "god": "0.1.0",
+    "god": "0.1.7",
     "lint-staged": "^10.0.7",
     "mobx": "^5.15.4",
     "mobx-react": "^6.2.2",

src/locales/zh-CN/menu.ts

@@ -2,8 +2,9 @@
  * @Author: LeeJiancong
  * @Date: 2020-07-13 14:08:50
  * @LastEditors: LeeJiancong
- * @LastEditTime: 2020-07-16 19:53:21
+ * @LastEditTime: 2020-07-17 18:01:02
  */ 
+
 export default {
   'menu.welcome': '欢迎',
   'menu.home': '首页',
@@ -47,6 +48,11 @@ export default {
   'menu.memberAbility': '会员',
   'menu.memberAbility.memberManage': '会员管理',
   'menu.memberAbility.memberManage.memberImport': '会员导入',
+  'menu.memberAbility.memberManage.addMember': '新增会员',
+  'menu.memberAbility.memberManage.memberMaintain': '会员维护',
+  'menu.memberAbility.memberManage.memberUpgradeRule': '会员升级规则',
+  'menu.memberAbility.memberManage.memberLevel': '会员等级',
+  'menu.memberAbility.memberManage.addEquity': '会员权益设置',
 
   // 店铺能力
   'menu.shopAbility': '店铺',
@@ -62,5 +68,5 @@ export default {
   'menu.logisticsAbility.logistics.addressForm':'新建发货地址',
   'menu.logisticsAbility.logistics.receivingAddress':'收货地址管理',
   'menu.logisticsAbility.logistics.template':'运费模板管理',
-  'menu.logisticsAbility.logistics.templateForm':'新建运费模板',
+  'menu.logisticsAbility.logistics.templateForm':'新建运费模板'
 };
\ No newline at end of file

src/pages/member/memberImport/addMember.tsx

+import React, { useState, useRef, } from 'react'
+import { history } from 'umi'
+import { Card, Button, Tabs } from 'antd'
+import { PageHeaderWrapper } from '@ant-design/pro-layout'
+import { ContainerOutlined } from '@ant-design/icons'
+import './index.less'
+
+const addMember: React.FC<[]> = () => {
+  return (
+    <PageHeaderWrapper
+      onBack={() => window.history.back()}
+      title={[
+        <>
+          <div className='headerTop'>
+            <span>返回</span>
+            <span>新建会员</span>
+          </div>
+        </>
+      ]}
+      extra={[
+        <Button className='saveBtn' icon={<ContainerOutlined />}>保存</Button>
+      ]}
+    >
+      <Card>
+
+      </Card>
+    </PageHeaderWrapper>
+  )
+}
+
+export default addMember

src/pages/member/memberImport/index.less

+.nameCell {
+  text-align: left;
+
+  .levelIcon1 {
+    width          : 100%;
+    height         : 16px;
+    background     : url("../../../assets/imgs/level1@2x.png") no-repeat;
+    background-size: 54px 16px;
+    margin-top     : 8px;
+  }
+
+  .levelIcon2 {
+    width          : 100%;
+    height         : 16px;
+    background     : url("../../../assets/imgs/level2@2x.png") no-repeat;
+    background-size: 54px 16px;
+    margin-top     : 8px;
+  }
+
+  .levelIcon3 {
+    width          : 100%;
+    height         : 16px;
+    background     : url("../../../assets/imgs/level3@2x.png") no-repeat;
+    background-size: 54px 16px;
+    margin-top     : 8px;
+  }
+}
+
+.importBtn {
+  margin: 0 16px;
+}
+
+.headerTop {
+  display    : flex;
+  align-items: center;
+
+  span {
+    font-size  : 14px;
+    font-weight: 400;
+
+    &:nth-last-of-type(1) {
+      font-size  : 20px;
+      font-weight: 500;
+      color      : #172B4D;
+      margin-left: 16px;
+    }
+  }
+}
+
+.saveBtn {
+  color     : #fff;
+  background: @main-color
+}
\ No newline at end of file

src/pages/member/memberImport/index.tsx

+import React, { useState, useRef } from 'react'
+import { history } from 'umi'
+import { Button, Card, Dropdown, Menu } from 'antd'
+import { PageHeaderWrapper } from '@ant-design/pro-layout'
+import {
+  PlusOutlined,
+  EyeOutlined,
+  DeleteOutlined,
+  DownOutlined
+} from '@ant-design/icons'
+import { StandardTable } from 'god'
+import { ColumnType } from 'antd/lib/table/interface'
+import './index.less'
+
+const data = [
+  {
+    key: '1',
+    id: '1',
+    level: '1',
+    name: '温州隆昌皮具有限公司',
+    type: '企业会员',
+    role: '供应商',
+    applyTime: '2020-05-12 08:08',
+    status: '正常',
+    externalStatus: '待提交',
+  },
+  {
+    key: '2',
+    id: '2',
+    level: '2',
+    name: '温州隆昌皮具有限公司',
+    type: '企业会员',
+    role: '供应商',
+    applyTime: '2020-05-12 08:08',
+    status: '正常',
+    externalStatus: '待提交',
+  },
+  {
+    key: '3',
+    id: '3',
+    level: '3',
+    name: '温州隆昌皮具有限公司',
+    type: '企业会员',
+    role: '供应商',
+    applyTime: '2020-05-12 08:08',
+    status: '正常',
+    externalStatus: '待提交',
+  }
+]
+
+const memberImport: React.FC<{}> = () => {
+  const ref = useRef({})
+  const [selectedRowKeys, setSelectedRowKeys] = useState<Array<string>>([])
+
+  const columns: ColumnType<any>[] = [
+    {
+      title: 'ID',
+      dataIndex: 'id',
+      align: 'center',
+      key: 'id'
+    },
+    {
+      title: '会员名称',
+      dataIndex: 'name',
+      align: 'center',
+      key: 'name',
+      render: (text: any, record: any) => {
+        return (
+          <div className="nameCell">
+            <div className="commonPickColor nameCell-title" onClick={() => handleSee(record)}>{text}&nbsp;<EyeOutlined /></div>
+            <div className={`levelIcon${record.level}`}></div>
+          </div>
+        )
+      }
+    },
+    {
+      title: '会员类型',
+      dataIndex: 'type',
+      align: 'center',
+      key: 'type',
+    },
+    {
+      title: '会员角色',
+      dataIndex: 'role',
+      align: 'center',
+      key: 'role',
+    },
+    {
+      title: '申请来源/时间',
+      dataIndex: 'applyTime',
+      align: 'center',
+      key: 'applyTime',
+    },
+    {
+      title: '会员状态',
+      dataIndex: 'status',
+      align: 'center',
+      key: 'status',
+    },
+    {
+      title: '外部状态',
+      dataIndex: 'externalStatus',
+      align: 'center',
+      key: 'externalStatus',
+    },
+    {
+      title: '操作',
+      dataIndex: 'option',
+      align: 'center',
+      render: (record: any) => {
+        return (
+          <>
+            <Button type='link'>提交审核</Button>
+            <Button type='link'>编辑</Button>
+            <Button type='link'>更多</Button>
+          </>
+        )
+      }
+    }
+  ];
+
+  const menu = (
+    <Menu onClick={(e) => handleMenuClick(e)}>
+      <Menu.Item key="1" icon={<DeleteOutlined />}>
+        删除导入批次
+      </Menu.Item>
+    </Menu>
+  )
+
+  const rowSelection = {
+    selectedRowKeys: selectedRowKeys,
+    onChange: (selectedRowKeys: any, selectedRows: any) => {
+      console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
+    },
+  };
+
+  // 模拟请求
+  const fetchData = (params: any) => {
+    return new Promise((resolve, reject) => {
+      const queryResult = data.find(v => v.key === params.keywords)
+      setTimeout(() => {
+        resolve({
+          code: 200,
+          message: '',
+          data: queryResult ? [queryResult] : data
+        })
+      }, 1000)
+    })
+  }
+
+  const handleSee = (record: any) => {
+    console.log('see')
+  }
+
+  const handleMenuClick = (e: any) => {
+    console.log('menu', e);
+  }
+
+  const handleButtonClick = (e: any) => {
+    console.log('button', e);
+  }
+
+  return (
+    <PageHeaderWrapper>
+      <Card>
+        <StandardTable
+          columns={columns}
+          currentRef={ref}
+          rowSelection={rowSelection}
+          fetchTableData={(params: any) => fetchData(params)}
+          formilyLayouts={{
+            justify: 'space-between'
+          }}
+          formilyProps={{
+            layouts: {
+              order: 1
+            },
+            ctx: {
+              schema: {
+                type: 'object',
+                properties: {
+                  name: {
+                    type: 'string',
+                    'x-component': 'Search',
+                    'x-component-props': {
+                      placeholder: '请输入'
+                    }
+                  },
+                  names: {
+                    type: 'string',
+                    'x-component-props': {
+                      placeholder: '请输入'
+                    }
+                  }
+                }
+              }
+            }
+          }}
+          formilyChilds={
+            {
+              layouts: {
+                order: 0
+              },
+              children: (
+                <>
+                  <Button
+                    type='primary'
+                    onClick={() => history.push('/memberAbility/manage/addMember')}
+                  >
+                    <PlusOutlined />新建
+                  </Button>
+                  <Button className='importBtn'>导入</Button>
+                  <Dropdown.Button
+                    overlay={menu}
+                    trigger={['click']}
+                    icon={<DownOutlined />}
+                  >
+                    更多
+                  </Dropdown.Button>
+                </>
+              )
+            }
+          }
+        />
+      </Card>
+    </PageHeaderWrapper >
+  )
+}
+
+export default memberImport

src/pages/member/memberLevel/addEquity.tsx

+import React, { ReactNode, useState, useRef } from 'react'
+import { history } from 'umi'
+import { Button, Popconfirm, Card, Input, Slider, Row, Col } from 'antd'
+import { PageHeaderWrapper } from '@ant-design/pro-layout'
+import { PlayCircleOutlined, ContainerOutlined } from '@ant-design/icons'
+import { StandardTable } from 'god'
+import { ColumnType } from 'antd/lib/table/interface'
+import './index.less'
+
+const data = [
+  {
+    key: '1',
+    id: '1',
+    name: '价格权益',
+    explain: '交易一方能获得另一方的价格折扣',
+    type: '交易获取',
+    setting: '按交易金额比例设置',
+    params: '1',
+    status: 2
+  },
+  {
+    key: '2',
+    id: '2',
+    name: '返现权益',
+    explain: '交易一方能获得另一方的交易返现',
+    type: '交易获取',
+    setting: '按交易金额比例设置',
+    params: '1',
+    status: 1
+  }
+]
+
+const addEquity: React.FC<[]> = () => {
+  const ref = useRef({})
+  const [thresholdValue, setThresholdValue] = useState(10000)
+
+  const marks = {
+    0: '0',
+    5000: '5000',
+    10000: '10000',
+    15000: '15000',
+    20000: '20000',
+    50000: '50000',
+  };
+
+  const columns: ColumnType<any>[] = [
+    {
+      title: 'ID',
+      dataIndex: 'id',
+      align: 'center',
+      key: 'id',
+    },
+    {
+      title: '会员权益名称',
+      dataIndex: 'name',
+      align: 'center',
+      key: 'name',
+    },
+    {
+      title: '会员权益说明',
+      dataIndex: 'explain',
+      align: 'center',
+      key: 'explain',
+    },
+    {
+      title: '权益获取方式',
+      dataIndex: 'type',
+      align: 'center',
+      key: 'type',
+    },
+    {
+      title: '参数设置方式',
+      dataIndex: 'setting',
+      align: 'center',
+      key: 'setting',
+    },
+    {
+      title: '参数',
+      dataIndex: 'params',
+      align: 'center',
+      key: 'params',
+    },
+    {
+      title: '状态',
+      dataIndex: 'status',
+      align: 'center',
+      key: 'status',
+      render: (text: any, record: any) => {
+        let component: ReactNode = null
+        component = (
+          <Popconfirm
+            title="确定要执行这个操作?"
+            onConfirm={confirm}
+            onCancel={cancel}
+            okText="是"
+            cancelText="否"
+          >
+            <Button type="link" onClick={() => handleModify(record)} style={record.status === 1 ? { color: '#00B37A' } : { color: 'red' }}>{record.status === 1 ? '有效' : '无效'} <PlayCircleOutlined /></Button>
+          </Popconfirm>
+        )
+        return component
+      }
+    }
+  ];
+
+  // 模拟请求
+  const fetchData = (params: any) => {
+    return new Promise((resolve, reject) => {
+      const queryResult = data.find(v => v.key === params.keywords)
+      setTimeout(() => {
+        resolve({
+          code: 200,
+          message: '',
+          data: queryResult ? [queryResult] : data
+        })
+      }, 1000)
+    })
+  }
+
+  const handleSee = (record: any) => {
+
+  }
+
+  const confirm = () => {
+    console.log('confirm')
+  }
+
+  const cancel = () => {
+    console.log('cancel')
+  }
+
+  const handleModify = (record: object) => {
+    // 通过传入的params字符串判断是修改那种类型的数据
+    console.log('执行状态修改', record)
+  }
+
+  const handleInput = (e: any) => {
+    console.log(e)
+  }
+
+  return (
+    <PageHeaderWrapper
+      onBack={() => window.history.back()}
+      title={[
+        <>
+          <div className='headerTop'>
+            <div className='headerTop-icon'>钻</div>
+            <div className='headerTop-level'>钻石会员</div>
+            <div className='headerTop-identity'>商户会员</div>
+          </div>
+        </>
+      ]}
+      content={[
+        <div className='headerMain'>
+          <div className='headerMain-left'>
+            <div className='headerMain-left-option'>
+              <div>会员等级：</div>
+              <div>1</div>
+            </div>
+            <div className='headerMain-left-option'>
+              <div>升级分值标签：</div>
+              <div>交易分</div>
+            </div>
+            <div className='headerMain-left-option'>
+              <div>角色类型：</div>
+              <div>服务消费</div>
+            </div>
+            <div className='headerMain-left-option'>
+              <div>会员等级说明：</div>
+              <div>商户所属钻石会员</div>
+            </div>
+            <div className='headerMain-left-option'>
+              <div>会员角色名称：</div>
+              <div>采购商</div>
+            </div>
+            <div className='headerMain-left-option'>
+              <div>会员类型：</div>
+              <div>企业会员</div>
+            </div>
+          </div>
+          <div className='headerMain-right'>
+            <Button className='saveBtn' icon={<ContainerOutlined />}>保存</Button>
+          </div>
+        </div>
+      ]}
+    >
+      <Card>
+        <StandardTable
+          columns={columns}
+          currentRef={ref}
+          fetchTableData={(params: any) => fetchData(params)}
+          controlRender={
+            <>
+              <div className='extra'>
+                <h3>升级阀值</h3>
+                <div className='extra-main'>
+                  <div className='extra-main-content left'>
+                    <div className='icon'>当前阀值</div>
+                    <div className='input'>
+                      <div className='input-main'>
+                        <Input className='input-main-com'
+                          value={thresholdValue}
+                          onChange={(e: any) => { e.persist(); setThresholdValue(e.target.value) }}
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <div className='extra-main-content right'>
+                    <Slider
+                      marks={marks}
+                      max={50000}
+                      value={thresholdValue}
+                      onChange={(val: number) => setThresholdValue(val)}
+                    />
+                  </div>
+                </div>
+              </div>
+              <h3>会员权益</h3>
+            </>
+          }
+        />
+      </Card>
+    </PageHeaderWrapper>
+  )
+}
+
+export default addEquity
\ No newline at end of file

src/pages/member/memberLevel/index.less

+.row {
+  display        : flex;
+  justify-content: flex-end;
+  box-sizing     : border-box;
+
+  .col {
+    padding      : 0 8px;
+    margin-bottom: 12px;
+  }
+}
+
+.headerMain {
+  display: flex;
+
+  &-left {
+    flex        : 6;
+    display     : flex;
+    flex-wrap   : wrap;
+    padding-left: 90px;
+
+    &-option {
+      display      : flex;
+      width        : calc(100% / 3);
+      margin-bottom: 17px;
+      font-size    : 14px;
+      font-family  : PingFangSC-Regular, PingFang SC;
+      font-weight  : 400;
+      color        : #6B778C;
+      padding-right: 20px;
+
+      &:nth-of-type(n + 4) {
+        margin: 0;
+      }
+
+      div {
+        flex: 1;
+
+        &:nth-last-of-type(1) {
+          flex: 2;
+        }
+      }
+
+    }
+  }
+
+  &-right {
+    flex      : 1;
+    text-align: right;
+
+    .saveBtn {
+      color     : #fff;
+      background: @main-color
+    }
+  }
+}
+
+
+
+
+
+.levelIcon1 {
+  width          : 100%;
+  height         : 20px;
+  background     : url("../../../assets/imgs/vip1@2x.png") no-repeat center;
+  background-size: 24px 20px;
+}
+
+.levelIcon2 {
+  width          : 100%;
+  height         : 20px;
+  background     : url("../../../assets/imgs/vip2@2x.png") no-repeat center;
+  background-size: 24px 20px;
+}
+
+.levelIcon3 {
+  width          : 100%;
+  height         : 20px;
+  background     : url("../../../assets/imgs/vip3@2x.png") no-repeat center;
+  background-size: 24px 20px;
+}
+
+.levelIcon4 {
+  width          : 100%;
+  height         : 20px;
+  background     : url("../../../assets/imgs/vip4@2x.png") no-repeat center;
+  background-size: 24px 20px;
+}
+
+.headerTop {
+  display    : flex;
+  align-items: center;
+  font-size  : 20px;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+
+  &-icon {
+    width           : 48px;
+    height          : 48px;
+    line-height     : 48px;
+    border-radius   : 4px;
+    border          : 1px solid #DFE1E6;
+    color           : #fff;
+    text-align      : center;
+    background-color: #8777D9;
+  }
+
+  &-level {
+    color : #172B4D;
+    margin: 0 8px 0 12px;
+  }
+
+  &-identity {
+    width           : 72px;
+    height          : 24px;
+    line-height     : 24px;
+    background-color: #FFEBE6;
+    border-radius   : 4px;
+    color           : #E63F3B;
+    font-size       : 14px;
+    font-weight     : 400;
+    text-align      : center;
+  }
+}
+
+h3 {
+  margin-bottom: 20px;
+}
+
+.extra {
+  margin-bottom: 48px;
+
+  &-main {
+    display: flex;
+
+    &-content {
+      position: relative;
+      flex    : 1;
+      height  : 104px;
+
+      &:nth-last-of-type(1) {
+        flex: 2.5;
+      }
+    }
+
+    .left {
+      display        : flex;
+      justify-content: center;
+      align-items    : center;
+
+      .icon {
+        position        : absolute;
+        left            : 0;
+        top             : 0;
+        width           : 72px;
+        height          : 24px;
+        color           : #fff;
+        background-color: #42526E;
+        border-radius   : 4px 0px 4px 0px;
+        text-align      : center;
+      }
+
+      .input {
+        display        : flex;
+        justify-content: center;
+
+        &-main {
+          position      : relative;
+          width         : 128px;
+          height        : 38px;
+          padding-bottom: 8px;
+
+          &::after {
+            content         : '';
+            position        : absolute;
+            left            : 0;
+            bottom          : 0;
+            width           : 100%;
+            height          : 1px;
+            background-color: #DFE1E6;
+          }
+
+          &-com {
+            width           : 100%;
+            height          : 100%;
+            border          : 0;
+            outline         : none;
+            background-color: rgba(0, 0, 0, 0);
+            font-size       : 32px;
+            font-family     : PingFangSC-Medium, PingFang SC;
+            font-weight     : 500;
+            color           : #172B4D;
+          }
+        }
+      }
+    }
+
+    .right {
+      padding: 27px 40px;
+    }
+  }
+}
\ No newline at end of file

src/pages/member/memberLevel/index.tsx

+import React, { ReactNode, useState, useRef } from 'react'
+import { history } from 'umi'
+import { Row, Col, Button, Popconfirm, Card, Input } from 'antd'
+import { PageHeaderWrapper } from '@ant-design/pro-layout'
+import {
+  UpOutlined,
+  DownOutlined,
+  PlayCircleOutlined,
+  EyeOutlined
+} from '@ant-design/icons'
+import { StandardTable } from 'god'
+import { ColumnType } from 'antd/lib/table/interface'
+import './index.less'
+
+interface Item {
+  key: string;
+  id: string;
+  level: string;
+  levelTab: string;
+  levelType: string;
+  scoreTab: string;
+  name: string;
+  type: string;
+  roleType: string;
+  thresvalue: string;
+  status: number;
+}
+
+const data = [
+  {
+    key: '1',
+    id: '1',
+    level: '1',
+    levelTab: '钻石会员',
+    levelType: '商户会员',
+    scoreTab: '交易分',
+    name: '采购商',
+    type: '服务消费',
+    roleType: '企业会员',
+    thresvalue: '100000',
+    status: 1
+  },
+  {
+    key: '2',
+    id: '2',
+    level: '2',
+    levelTab: '钻石会员',
+    levelType: '商户会员',
+    scoreTab: '交易分',
+    name: '采购商',
+    type: '服务消费',
+    roleType: '企业会员',
+    thresvalue: '100000',
+    status: 2
+  },
+  {
+    key: '3',
+    id: '3',
+    level: '3',
+    levelTab: '钻石会员',
+    levelType: '商户会员',
+    scoreTab: '交易分',
+    name: '采购商',
+    type: '服务消费',
+    roleType: '企业会员',
+    thresvalue: '100000',
+    status: 1
+  },
+  {
+    key: '4',
+    id: '4',
+    level: '4',
+    levelTab: '钻石会员',
+    levelType: '商户会员',
+    scoreTab: '交易分',
+    name: '采购商',
+    type: '服务消费',
+    roleType: '企业会员',
+    thresvalue: '100000',
+    status: 2
+  }
+]
+
+const memberLevel: React.FC<[]> = () => {
+  let [isSearch, setIsSearch] = useState(false)
+  const ref = useRef({})
+
+  const columns: ColumnType<any>[] = [
+    {
+      title: 'ID',
+      dataIndex: 'id',
+      align: 'center',
+      key: 'id',
+    },
+    {
+      title: '会员等级',
+      dataIndex: 'level',
+      align: 'center',
+      key: 'level',
+      render: (text: any, record: any) => <div className={`levelIcon${record.level}`}></div>
+    },
+    {
+      title: '会员等级标签',
+      dataIndex: 'levelTab',
+      align: 'center',
+      key: 'levelTab',
+      render: (text: any, record: any) => <span className="commonPickColor" onClick={() => handleSee(record)}>{text}&nbsp;<EyeOutlined /></span>
+    },
+    {
+      title: '会员等级类型',
+      dataIndex: 'levelType',
+      align: 'center',
+      key: 'levelType',
+    },
+    {
+      title: '升级分值标签',
+      dataIndex: 'scoreTab',
+      align: 'center',
+      key: 'scoreTab',
+    },
+    {
+      title: '会员角色名称',
+      dataIndex: 'name',
+      align: 'center',
+      key: 'name',
+    },
+    {
+      title: '角色类型',
+      dataIndex: 'type',
+      align: 'center',
+      key: 'type',
+    },
+    {
+      title: '会员类型',
+      dataIndex: 'roleType',
+      align: 'center',
+      key: 'roleType',
+    },
+    {
+      title: '升级阈值',
+      dataIndex: 'thresvalue',
+      align: 'center',
+      key: 'thresvalue',
+    },
+    {
+      title: '状态',
+      dataIndex: 'status',
+      align: 'center',
+      key: 'status',
+      render: (text: any, record: any) => {
+        let component: ReactNode = null
+        component = (
+          <Popconfirm
+            title="确定要执行这个操作?"
+            onConfirm={confirm}
+            onCancel={cancel}
+            okText="是"
+            cancelText="否"
+          >
+            <Button type="link" onClick={() => handleModify(record)} style={record.status === 1 ? { color: '#00B37A' } : { color: 'red' }}>{record.status === 1 ? '有效' : '无效'} <PlayCircleOutlined /></Button>
+          </Popconfirm>
+        )
+        return component
+      }
+    },
+    {
+      title: '操作',
+      dataIndex: 'option',
+      align: 'center',
+      render: (record: any) => <Button type='link' onClick={(record) => handleSet(record)}>设置</Button>
+    }
+  ];
+
+  // 模拟请求
+  const fetchData = (params: any) => {
+    return new Promise((resolve, reject) => {
+      const queryResult = data.find(v => v.key === params.keywords)
+      setTimeout(() => {
+        resolve({
+          code: 200,
+          message: '',
+          data: queryResult ? [queryResult] : data
+        })
+      }, 1000)
+    })
+  }
+
+  const handleSee = (record: any) => {
+
+  }
+
+  const confirm = () => {
+    console.log('confirm')
+  }
+
+  const cancel = () => {
+    console.log('cancel')
+  }
+
+  const handleModify = (record: object) => {
+    // 通过传入的params字符串判断是修改那种类型的数据
+    console.log('执行状态修改', record)
+  }
+
+  const handleSearch = (val: string) => {
+    console.log(val)
+  }
+
+  const handleReset = () => {
+
+  }
+
+  const handleSet = (record: any) => {
+    history.push('/memberAbility/manage/level/addEquity')
+  }
+
+  return (
+    <PageHeaderWrapper>
+      <Card>
+        <StandardTable
+          columns={columns}
+          currentRef={ref}
+          fetchTableData={(params: any) => fetchData(params)}
+          controlRender={
+            <Row className='row'>
+              <Col className='col' span={4}>
+                <Input.Search placeholder="搜索" onSearch={(val) => handleSearch(val)} />
+              </Col>
+              <Col className='col'>
+                <Button onClick={() => setIsSearch(isSearch = !isSearch)}>高级筛选{isSearch ? <UpOutlined /> : <DownOutlined />}</Button>
+              </Col>
+              <Col className='col'>
+                <Button onClick={() => handleReset()}>重置</Button>
+              </Col>
+              {
+                isSearch ?
+                  <Col span={24} className='row'>
+                    <Col className='col' span={4}>
+                      <Input placeholder="会员等级标签"></Input>
+                    </Col>
+                    <Col className='col' span={4}>
+                      <Input placeholder="会员角色名称"></Input>
+                    </Col>
+                  </Col>
+                  :
+                  ''
+              }
+            </Row>
+          }
+        />
+      </Card>
+    </PageHeaderWrapper>
+  )
+}
+
+export default memberLevel
\ No newline at end of file

src/pages/member/memberMaintain/index.tsx

+import React, {Component} from 'react';
+
+class Index extends Component<{}, {}> {
+  render() {
+    return <div>
+      index
+    </div>
+  }
+}
+
+export default Index

src/pages/member/memberUpgradeRule/index.less

+.saveBtn {
+  color     : #fff;
+  background: @main-color
+}
\ No newline at end of file

src/pages/member/memberUpgradeRule/index.tsx

+import React, { useState, useRef, ReactNode } from 'react'
+import { history } from 'umi'
+import { Card, Input, Button } from 'antd'
+import { PageHeaderWrapper } from '@ant-design/pro-layout'
+import { ContainerOutlined } from '@ant-design/icons'
+import { StandardTable } from 'god'
+import { ColumnType } from 'antd/lib/table/interface'
+import { IFormFilter, IButtonFilter } from 'god/dist/src/standard-table/TableController'
+import './index.less'
+
+import { getUpgradeRuleList } from '@/services/memberAbility/memberUpgrade'
+
+interface Item {
+
+}
+
+const data = [
+  {
+    key: '1',
+    id: '1',
+    rule: 1,
+    explain: '完成交易订单后，按照交易订单金额的百分比记入获取的升级分值',
+    type: '商户会员',
+    score: ''
+  },
+  {
+    key: '2',
+    id: '2',
+    rule: 1,
+    explain: '完成交易订单后，按照交易订单金额的百分比记入获取的升级分值',
+    type: '渠道会员',
+    score: ''
+  },
+  {
+    key: '3',
+    id: '3',
+    rule: 2,
+    explain: '完成交易订单后，按照交易订单金额的百分比记入获取的升级分值',
+    type: '商户会员',
+    score: ''
+  },
+  {
+    key: '4',
+    id: '4',
+    rule: 3,
+    explain: '完成交易订单后，按照交易订单金额的百分比记入获取的升级分值',
+    type: '商户会员',
+    score: ''
+  },
+]
+
+const memberUpgradeRule: React.FC<[]> = () => {
+  const ref = useRef({})
+
+  const columns: ColumnType<any>[] = [
+    {
+      title: 'ID',
+      dataIndex: 'id',
+      align: 'center',
+      key: 'id',
+    },
+    {
+      title: '升级规则',
+      dataIndex: 'rule',
+      align: 'center',
+      key: 'rule',
+      render: (text: any, record: any) => <span>{record.rule === 1 ? '交易' : record.rule === 2 ? '评价' : '登录'}</span>
+    },
+    {
+      title: '升级规则说明',
+      dataIndex: 'explain',
+      align: 'center',
+      key: 'explain',
+    },
+    {
+      title: '适用会员等级类型',
+      dataIndex: 'type',
+      align: 'center',
+      key: 'type',
+    },
+    {
+      title: '可获取的分值',
+      dataIndex: 'score',
+      align: 'center',
+      key: 'score',
+      render: (text: any, record: any) => {
+        let component: ReactNode = null
+        component = (
+          record.rule === 1 ? <Input addonAfter="%" defaultValue={record.score} /> : <Input defaultValue={record.score} />
+        )
+        return component
+      }
+    }
+  ];
+
+  // 模拟请求
+  const fetchData = (params: any) => {
+    return new Promise((resolve, reject) => {
+      // getUpgradeRuleList(params).then(res => {
+      // })
+      const queryResult = data.find(v => v.key === params.keywords)
+      setTimeout(() => {
+        resolve({
+          code: 200,
+          message: '',
+          data: queryResult ? [queryResult] : data
+        })
+      }, 1000)
+    })
+  }
+
+
+
+  return (
+    <PageHeaderWrapper extra={[<Button className='saveBtn' icon={<ContainerOutlined />}>保存</Button>]}>
+      <Card>
+        <StandardTable
+          columns={columns}
+          currentRef={ref}
+          fetchTableData={(params: any) => fetchData(params)} />
+      </Card>
+    </PageHeaderWrapper>
+  )
+}
+
+export default memberUpgradeRule
\ No newline at end of file

src/services/memberAbility/memberUpgrade/API.d.ts

+declare namespace UpgradeRuleApi {
+  interface UpgradeRuleItem {
+    page: number;
+    rows: number;
+  }
+}
\ No newline at end of file

src/services/memberAbility/memberUpgrade/index.tsx

+import request from '@/utils/request';
+
+const prefix = '/member/promotion'
+
+/**
+ * @description 会员升级规则-列表
+ * 
+ */
+
+export async function getUpgradeRuleList(params: any) {
+  return request('/rule/list', {
+    prefix,
+    params
+  })
+}
\ No newline at end of file