key批次列表【使用key总数】改【消耗key总数】

key批次列表 悬停或点击【消耗key总数】字段数值（蓝色），展示 统计的兑换码 【作废数】【已使用数】【已完结数】【已失效数】

src/assets/comm.css

@@ -130,3 +130,6 @@ html,body,h1,h2,h3,h4,h5,h6,p,ul,li,dl,dd,dt,ol,input{
 .fz16{
   font-size: 16px;
 }
+.fz12{
+  font-size: 12px!important;
+}

src/pages/plan/key/list.js

@@ -22,7 +22,7 @@ import {
   DropdownContent
 } from 'zent'
 import './list.less'
-import { Switch } from 'zent'
+import { Switch,Pop } from 'zent'
 import '../../../assets/comm.css'
 import Ipt from '../../../components/input/main'
 import Grid from '../../../components/gird/main.js'
@@ -110,9 +110,9 @@ const Column = [
     width: '120px'
   },
   {
-    title: "使用key码总数",
+    title: "已消耗key总数",
     name: "usage",
-    type: "normal",
+    type: "slot",
     prop: "usage",
     width: "120px",
   },
@@ -710,7 +710,31 @@ export default class acclist extends React.Component {
         onChange={this.onChangeCombinedDate.bind(this)}
       />
     )
-
+  const popDom=(row)=>{
+    return (
+      <div>
+        <b>兑换码统计</b>
+        <ul className='dflexaj mt5 fz12'>
+          <li className='dflexajc mr15'>
+            <span>已作废数</span>
+            <span>{row.invalid_total}</span>
+          </li>
+          <li className='dflexajc mr15'>
+            <span>已使用数</span>
+            <span>{row.usage_total}</span>
+          </li>
+          <li className='dflexajc mr15'>
+            <span>已完结数</span>
+            <span>{row.end_total}</span>
+          </li>
+          <li className='dflexajc'>
+            <span>已失效数</span>
+            <span>{row.overdue_total}</span>
+          </li>
+        </ul>
+      </div>
+    )
+  }
     const { current, pageSize } = this.state
     return (
       <div id='exchangecodelist'>
@@ -777,7 +801,11 @@ export default class acclist extends React.Component {
                   }
                   return str
                 }
-
+                if(com=='usage'){
+                  return  <Pop trigger="hover" content={popDom(rowData)}>
+                             <span className='grid-link'>{rowData.usage}</span>
+                          </Pop>
+                }
                 if (com == 'switch') {
                   return (
                     <Switch