nili
9 months ago
23 changed files with 1307 additions and 797 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1 +0,0 @@ |
|||||
"use strict";(self.webpackChunkant_design_pro=self.webpackChunkant_design_pro||[]).push([[857],{46701:function(U,d,e){e.r(d);var E=e(15009),u=e.n(E),p=e(97857),l=e.n(p),x=e(99289),f=e.n(x),I=e(48357),h=e(90930),D=e(1507),M=e(35312),i=e(67294),T=e(96974),o=e(85893),P=function(){var m=(0,i.useRef)(),O=(0,M.useIntl)(),j=[{title:"\u8BBE\u5907Id",dataIndex:"deviceId",valueType:"textarea",ellipsis:!0,copyable:!0},{title:"\u5E94\u7528\u540D\u79F0",hideInSearch:!0,dataIndex:"appName",valueType:"textarea"},{title:"\u5E73\u53F0",dataIndex:"platform",valueEnum:{1:{text:"\u7A7F\u5C71\u7532"},2:{text:"\u817E\u8BAF"},3:{text:"\u767E\u5EA6\u8054\u76DF"},4:{text:"Mintegral"},5:{text:"\u5FEB\u624B"},6:{text:"\u6E38\u53EF\u8D62"},7:{text:"Sigmob"},8:{text:"Admob"}}},{title:"\u5E7F\u544A\u7C7B\u578B",dataIndex:"advType",valueEnum:{1:{text:"\u6A2A\u5E45",status:"Default"},2:{text:"\u63D2\u9875",status:"Processing"},3:{text:"\u6FC0\u52B1\u89C6\u9891",status:"Success"}}},{title:"ecpm(\u5143)",dataIndex:"ecpm",hideInSearch:!0,renderText:function(_){return _/100}},{title:"\u8BBE\u5907\u54C1\u724C",dataIndex:"deviceBrand",hideInSearch:!0,valueType:"textarea"},{title:"\u8BBE\u5907\u540D",dataIndex:"deviceName",hideInSearch:!0,valueType:"textarea"},{title:"ip",dataIndex:"ip",hideInSearch:!0,valueType:"textarea"},{title:"\u65F6\u95F4",hideInSearch:!0,dataIndex:"createdAt",valueType:"dateTime"},{title:"\u65F6\u95F4",hideInTable:!0,dataIndex:"createdAt",valueType:"dateRange"}],b=(0,T.UO)(),c=b.code,R=function(){var t=f()(u()().mark(function _(v){var r,n,s;return u()().wrap(function(a){for(;;)switch(a.prev=a.next){case 0:return a.next=2,(0,I._5)(l()(l()({},v),{},{code:c}));case 2:return s=a.sent,a.abrupt("return",{data:(r=s.data)===null||r===void 0?void 0:r.data,total:(n=s.data)===null||n===void 0?void 0:n.total,success:!0});case 4:case"end":return a.stop()}},_)}));return function(v){return t.apply(this,arguments)}}();return(0,i.useEffect)(function(){var t;(t=m.current)===null||t===void 0||t.reload()},[c]),(0,o.jsx)(h._z,{children:(0,o.jsx)(D.Z,{headerTitle:O.formatMessage({id:"pages.searchTable.title",defaultMessage:"Enquiry form"}),actionRef:m,rowKey:"key",search:{labelWidth:120},request:R,columns:j})})};d.default=P}}]); |
|
||||
@ -0,0 +1 @@ |
|||||
|
"use strict";(self.webpackChunkant_design_pro=self.webpackChunkant_design_pro||[]).push([[857],{46701:function(ne,h,e){e.r(h);var b=e(5574),f=e.n(b),C=e(15009),d=e.n(C),U=e(97857),u=e.n(U),B=e(99289),p=e.n(B),D=e(48357),y=e(92296),o=e(31847),g=e(90930),K=e(57470),x=e(64317),L=e(34540),W=e(50624),S=e(35312),Z=e(13169),O=e(16250),F=e(27484),z=e.n(F),$=e(9220),m=e(67294),G=e(96974),_=e(85893),N=function(){var M=(0,m.useRef)(),H=(0,S.useIntl)(),J=[{title:"\u8BBE\u5907id",dataIndex:"deviceId",valueType:"textarea",ellipsis:!0,copyable:!0},{title:"\u5E94\u7528\u540D\u79F0",hideInSearch:!0,dataIndex:"appName",valueType:"textarea"},{title:"\u5E73\u53F0",dataIndex:"platform",valueEnum:{1:{text:"\u7A7F\u5C71\u7532"},2:{text:"\u817E\u8BAF"},3:{text:"\u767E\u5EA6\u8054\u76DF"},4:{text:"Mintegral"},5:{text:"\u5FEB\u624B"},6:{text:"\u6E38\u53EF\u8D62"},7:{text:"Sigmob"},8:{text:"Admob"}}},{title:"\u5E7F\u544A\u7C7B\u578B",dataIndex:"advType",valueEnum:{1:{text:"\u6A2A\u5E45",status:"Default"},2:{text:"\u63D2\u9875",status:"Processing"},3:{text:"\u6FC0\u52B1\u89C6\u9891",status:"Success"}}},{title:"ecpm(\u5143)",dataIndex:"ecpm",hideInSearch:!0,renderText:function(t){return t/100}},{title:"\u8BBE\u5907\u54C1\u724C",dataIndex:"deviceBrand",hideInSearch:!0,valueType:"textarea"},{title:"\u8BBE\u5907\u540D",dataIndex:"deviceName",hideInSearch:!0,valueType:"textarea"},{title:"ip",dataIndex:"ip",hideInSearch:!0,valueType:"textarea"},{title:"\u65F6\u95F4",hideInSearch:!0,dataIndex:"createdAt",valueType:"dateTime"},{title:"\u65F6\u95F4",hideInTable:!0,dataIndex:"createdAt",valueType:"dateRange"}],Q=(0,G.UO)(),c=Q.code,V=function(){var a=p()(d()().mark(function t(s){var n,v,r;return d()().wrap(function(l){for(;;)switch(l.prev=l.next){case 0:return l.next=2,(0,D._5)(u()(u()({},s),{},{code:c}));case 2:return r=l.sent,l.abrupt("return",{data:(n=r.data)===null||n===void 0?void 0:n.data,total:(v=r.data)===null||v===void 0?void 0:v.total,success:!0});case 4:case"end":return l.stop()}},t)}));return function(s){return a.apply(this,arguments)}}(),X=(0,m.useState)(),P=f()(X,2),i=P[0],Y=P[1],w=(0,m.useState)([]),I=f()(w,2),T=I[0],k=I[1],q=o.Z.Divider,ee=(0,m.useState)(!1),j=f()(ee,2),R=j[0],te=j[1],ae=function(){var a=p()(d()().mark(function t(s){var n;return d()().wrap(function(r){for(;;)switch(r.prev=r.next){case 0:return r.next=2,(0,D.d1)({appCode:s});case 2:n=r.sent,n.data&&Y(n.data);case 4:case"end":return r.stop()}},t)}));return function(s){return a.apply(this,arguments)}}(),A=function(){var a=p()(d()().mark(function t(s){var n;return d()().wrap(function(r){for(;;)switch(r.prev=r.next){case 0:return r.next=2,(0,D.Zb)(u()(u()({},s),{},{code:c}));case 2:n=r.sent,n.data&&k(n.data);case 4:case"end":return r.stop()}},t)}));return function(s){return a.apply(this,arguments)}}();(0,m.useEffect)(function(){var a;(a=M.current)===null||a===void 0||a.reload(),ae(c),A({code:c})},[c]);var E=function(t){return t?parseFloat((t/1e5).toFixed(2)):0},_e=T.map(function(a){return{date:a.date+"",income:E(a.income)}}),re={data:_e,xField:"date",yField:"income",axis:{date:{title:"\u65E5\u671F"},income:{title:"\u6536\u5165\uFF08\u5143\uFF09"}},title:"\u7D2F\u8BA1"+E(T.reduce(function(a,t){return a+(t.income?t.income:0)},0))+"\u5143",height:400,label:{text:function(t){return t.\u6536\u5165>0?t.\u6536\u5165:""},textBaseline:"bottom"}};return(0,_.jsx)(g._z,{children:(0,_.jsxs)(Z.Z,{defaultActiveKey:"1",centered:!0,style:{backgroundColor:"white",padding:"20px"},children:[(0,_.jsxs)(O.Z,{tab:"\u6570\u636E\u603B\u89C8",children:[(0,_.jsx)($.Z,{onResize:function(t){te(t.width<596)},children:(0,_.jsx)(o.Z,{children:(0,_.jsxs)(o.Z.Group,{direction:R?"column":"row",children:[(0,_.jsx)(o.Z,{statistic:{title:"\u7D2F\u8BA1\u6536\u5165\uFF08\u5143\uFF09",value:E(i==null?void 0:i.totalIncome)}}),(0,_.jsx)(q,{type:R?"horizontal":"vertical"}),(0,_.jsx)(o.Z,{statistic:{title:"\u4ECA\u65E5\u6536\u5165\uFF08\u5143\uFF09",value:E(i==null?void 0:i.todayIncome)}})]})})},"resize-observer"),(0,_.jsxs)(K.t,{defaultCollapsed:!0,split:!0,onFinish:A,children:[(0,_.jsx)(x.Z,{label:"\u5E73\u53F0",name:"platform",valueEnum:{1:"\u7A7F\u5C71\u7532",2:"\u817E\u8BAF",3:"\u767E\u5EA6\u8054\u76DF",4:"Mintegral",5:"\u5FEB\u624B",6:"\u6E38\u53EF\u8D62",7:"Sigmob",8:"Admob"}}),(0,_.jsx)(x.Z,{name:"advType",label:"\u5E7F\u544A\u7C7B\u578B",valueEnum:{1:"\u6A2A\u5E45",2:"\u63D2\u9875",3:"\u6FC0\u52B1\u89C6\u9891"}}),(0,_.jsx)(L.Z,{fieldProps:{disabledDate:function(t){return t&&t>=z()().startOf("day")}},name:"date",label:"\u65F6\u95F4"})]}),(0,_.jsx)(y.Z,u()({},re))]},"1"),(0,_.jsx)(O.Z,{tab:"\u5E7F\u544A\u8BE6\u60C5",children:(0,_.jsx)(W.Z,{headerTitle:H.formatMessage({id:"pages.searchTable.title",defaultMessage:"Enquiry form"}),actionRef:M,rowKey:"key",search:{labelWidth:120},request:V,columns:J})},"2")]})})};h.default=N}}]); |
||||
File diff suppressed because one or more lines are too long
@ -1,4 +1,4 @@ |
|||||
"use strict";(self.webpackChunkant_design_pro=self.webpackChunkant_design_pro||[]).push([[185],{71759:function(Ke,G,d){d.r(G),d.d(G,{default:function(){return ye}});var K=d(90930),Z=d(35312),X=d(9361),o=d(67294),Q=d(93967),f=d.n(Q),V=d(98423),E=d(53124),J=d(98675),U=d(99559),Y=d(11941),q=function(e,r){var t={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var i=0,a=Object.getOwnPropertySymbols(e);i<a.length;i++)r.indexOf(a[i])<0&&Object.prototype.propertyIsEnumerable.call(e,a[i])&&(t[a[i]]=e[a[i]]);return t},H=e=>{var{prefixCls:r,className:t,hoverable:a=!0}=e,i=q(e,["prefixCls","className","hoverable"]);const{getPrefixCls:s}=o.useContext(E.E_),b=s("card",r),h=f()(`${b}-grid`,t,{[`${b}-grid-hoverable`]:a});return o.createElement("div",Object.assign({},i,{className:h}))},n=d(54548),y=d(14747),_=d(91945),k=d(45503);const ee=e=>{const{antCls:r,componentCls:t,headerHeight:a,cardPaddingBase:i,tabsMarginBottom:s}=e;return Object.assign(Object.assign({display:"flex",justifyContent:"center",flexDirection:"column",minHeight:a,marginBottom:-1,padding:`0 ${(0,n.bf)(i)}`,color:e.colorTextHeading,fontWeight:e.fontWeightStrong,fontSize:e.headerFontSize,background:e.headerBg,borderBottom:`${(0,n.bf)(e.lineWidth)} ${e.lineType} ${e.colorBorderSecondary}`,borderRadius:`${(0,n.bf)(e.borderRadiusLG)} ${(0,n.bf)(e.borderRadiusLG)} 0 0`},(0,y.dF)()),{"&-wrapper":{width:"100%",display:"flex",alignItems:"center"},"&-title":Object.assign(Object.assign({display:"inline-block",flex:1},y.vS),{[` |
"use strict";(self.webpackChunkant_design_pro=self.webpackChunkant_design_pro||[]).push([[185],{71759:function(Ke,G,d){d.r(G),d.d(G,{default:function(){return ye}});var K=d(90930),Z=d(35312),X=d(9361),o=d(67294),Q=d(93967),f=d.n(Q),V=d(98423),E=d(53124),J=d(98675),U=d(99559),Y=d(13169),q=function(e,r){var t={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var i=0,a=Object.getOwnPropertySymbols(e);i<a.length;i++)r.indexOf(a[i])<0&&Object.prototype.propertyIsEnumerable.call(e,a[i])&&(t[a[i]]=e[a[i]]);return t},H=e=>{var{prefixCls:r,className:t,hoverable:a=!0}=e,i=q(e,["prefixCls","className","hoverable"]);const{getPrefixCls:s}=o.useContext(E.E_),b=s("card",r),h=f()(`${b}-grid`,t,{[`${b}-grid-hoverable`]:a});return o.createElement("div",Object.assign({},i,{className:h}))},n=d(54548),y=d(14747),_=d(91945),k=d(45503);const ee=e=>{const{antCls:r,componentCls:t,headerHeight:a,cardPaddingBase:i,tabsMarginBottom:s}=e;return Object.assign(Object.assign({display:"flex",justifyContent:"center",flexDirection:"column",minHeight:a,marginBottom:-1,padding:`0 ${(0,n.bf)(i)}`,color:e.colorTextHeading,fontWeight:e.fontWeightStrong,fontSize:e.headerFontSize,background:e.headerBg,borderBottom:`${(0,n.bf)(e.lineWidth)} ${e.lineType} ${e.colorBorderSecondary}`,borderRadius:`${(0,n.bf)(e.borderRadiusLG)} ${(0,n.bf)(e.borderRadiusLG)} 0 0`},(0,y.dF)()),{"&-wrapper":{width:"100%",display:"flex",alignItems:"center"},"&-title":Object.assign(Object.assign({display:"inline-block",flex:1},y.vS),{[` |
||||
> ${t}-typography, |
> ${t}-typography, |
||||
> ${t}-typography-edit-content |
> ${t}-typography-edit-content |
||||
`]:{insetInlineStart:0,marginTop:0,marginBottom:0}}),[`${r}-tabs-top`]:{clear:"both",marginBottom:s,color:e.colorText,fontWeight:"normal",fontSize:e.fontSize,"&-bar":{borderBottom:`${(0,n.bf)(e.lineWidth)} ${e.lineType} ${e.colorBorderSecondary}`}}})},te=e=>{const{cardPaddingBase:r,colorBorderSecondary:t,cardShadow:a,lineWidth:i}=e;return{width:"33.33%",padding:r,border:0,borderRadius:0,boxShadow:` |
`]:{insetInlineStart:0,marginTop:0,marginBottom:0}}),[`${r}-tabs-top`]:{clear:"both",marginBottom:s,color:e.colorText,fontWeight:"normal",fontSize:e.fontSize,"&-bar":{borderBottom:`${(0,n.bf)(e.lineWidth)} ${e.lineType} ${e.colorBorderSecondary}`}}})},te=e=>{const{cardPaddingBase:r,colorBorderSecondary:t,cardShadow:a,lineWidth:i}=e;return{width:"33.33%",padding:r,border:0,borderRadius:0,boxShadow:` |
||||
File diff suppressed because one or more lines are too long
@ -1,173 +1,308 @@ |
|||||
import { advList } from '@/services/matrix/admin'; |
import { advList, incomeOverview } from '@/services/matrix/admin'; |
||||
import { PageContainer, ProColumns, ProTable } from '@ant-design/pro-components'; |
import { Column } from '@ant-design/charts'; |
||||
|
import { |
||||
|
PageContainer, |
||||
|
ProColumns, |
||||
|
ProFormDateRangePicker, |
||||
|
ProFormSelect, |
||||
|
ProTable, |
||||
|
QueryFilter, |
||||
|
StatisticCard, |
||||
|
} from '@ant-design/pro-components'; |
||||
import { useIntl } from '@umijs/max'; |
import { useIntl } from '@umijs/max'; |
||||
import React, { useEffect, useRef } from 'react'; |
import { Tabs } from 'antd'; |
||||
|
import TabPane from 'antd/es/tabs/TabPane'; |
||||
|
import moment from 'moment'; |
||||
|
import RcResizeObserver from 'rc-resize-observer'; |
||||
|
import React, { useEffect, useRef, useState } from 'react'; |
||||
import { useParams } from 'react-router-dom'; |
import { useParams } from 'react-router-dom'; |
||||
|
|
||||
|
import { incomeDaily } from '../services/matrix/admin'; |
||||
|
|
||||
// import { RequestOptionsType, ProFieldRequestData } from "@ant-design/pro-utils";
|
// import { RequestOptionsType, ProFieldRequestData } from "@ant-design/pro-utils";
|
||||
|
|
||||
import type { ActionType } from '@ant-design/pro-components'; |
import type { ActionType } from '@ant-design/pro-components'; |
||||
const AdvRecordList: React.FC = () => { |
const AdvRecordList: React.FC = () => { |
||||
|
const actionRef = useRef<ActionType>(); |
||||
|
|
||||
const actionRef = useRef<ActionType>(); |
/** |
||||
|
* @en-US International configuration |
||||
|
* @zh-CN 国际化配置 |
||||
|
* */ |
||||
|
const intl = useIntl(); |
||||
|
|
||||
/** |
// const appNameMap: ProFieldRequestData = async () => {
|
||||
* @en-US International configuration |
// let res = await appList();
|
||||
* @zh-CN 国际化配置 |
// let data: RequestOptionsType[] = [];
|
||||
* */ |
|
||||
const intl = useIntl(); |
|
||||
|
|
||||
// const appNameMap: ProFieldRequestData = async () => {
|
// res.data?.forEach(x=>{
|
||||
// let res = await appList();
|
// data.push({label: x.name, value: x.id})
|
||||
// let data: RequestOptionsType[] = [];
|
// })
|
||||
|
// return data;
|
||||
|
// }
|
||||
|
|
||||
// res.data?.forEach(x=>{
|
const columns: ProColumns<API.MatrixAdvRecordBo>[] = [ |
||||
// data.push({label: x.name, value: x.id})
|
{ |
||||
// })
|
title: '设备id', |
||||
// return data;
|
dataIndex: 'deviceId', |
||||
|
valueType: 'textarea', |
||||
|
ellipsis: true, |
||||
|
copyable: true, |
||||
|
}, |
||||
|
{ |
||||
|
title: '应用名称', |
||||
|
hideInSearch: true, |
||||
|
dataIndex: 'appName', |
||||
|
valueType: 'textarea', |
||||
|
}, |
||||
|
{ |
||||
|
title: '平台', |
||||
|
dataIndex: 'platform', |
||||
|
valueEnum: { |
||||
|
1: { |
||||
|
text: '穿山甲', |
||||
|
}, |
||||
|
2: { |
||||
|
text: '腾讯', |
||||
|
}, |
||||
|
3: { |
||||
|
text: '百度联盟', |
||||
|
}, |
||||
|
4: { |
||||
|
text: 'Mintegral', |
||||
|
}, |
||||
|
5: { |
||||
|
text: '快手', |
||||
|
}, |
||||
|
6: { |
||||
|
text: '游可赢', |
||||
|
}, |
||||
|
7: { |
||||
|
text: 'Sigmob', |
||||
|
}, |
||||
|
8: { |
||||
|
text: 'Admob', |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
title: '广告类型', |
||||
|
dataIndex: 'advType', |
||||
|
valueEnum: { |
||||
|
1: { |
||||
|
text: '横幅', |
||||
|
status: 'Default', |
||||
|
}, |
||||
|
2: { |
||||
|
text: '插页', |
||||
|
status: 'Processing', |
||||
|
}, |
||||
|
3: { |
||||
|
text: '激励视频', |
||||
|
status: 'Success', |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
title: 'ecpm(元)', |
||||
|
dataIndex: 'ecpm', |
||||
|
hideInSearch: true, |
||||
|
renderText: (x) => { |
||||
|
return x / 100; |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
title: '设备品牌', |
||||
|
dataIndex: 'deviceBrand', |
||||
|
hideInSearch: true, |
||||
|
valueType: 'textarea', |
||||
|
}, |
||||
|
{ |
||||
|
title: '设备名', |
||||
|
dataIndex: 'deviceName', |
||||
|
hideInSearch: true, |
||||
|
valueType: 'textarea', |
||||
|
}, |
||||
|
{ |
||||
|
title: 'ip', |
||||
|
dataIndex: 'ip', |
||||
|
hideInSearch: true, |
||||
|
valueType: 'textarea', |
||||
|
}, |
||||
|
{ |
||||
|
title: '时间', |
||||
|
hideInSearch: true, |
||||
|
dataIndex: 'createdAt', |
||||
|
valueType: 'dateTime', |
||||
|
}, |
||||
|
{ |
||||
|
title: '时间', |
||||
|
hideInTable: true, |
||||
|
dataIndex: 'createdAt', |
||||
|
valueType: 'dateRange', |
||||
|
}, |
||||
|
// {
|
||||
|
// title: "应用名称",
|
||||
|
// hideInTable: true,
|
||||
|
// dataIndex: 'appId',
|
||||
|
// valueType: "select",
|
||||
|
// request: appNameMap
|
||||
// }
|
// }
|
||||
|
]; |
||||
|
|
||||
const columns: ProColumns<API.MatrixAdvRecordBo>[] = [ |
const { code } = useParams(); |
||||
{ |
const fetchData = async (params: any) => { |
||||
title: "设备Id", |
const res = await advList({ ...params, code: code }); |
||||
dataIndex: 'deviceId', |
return { |
||||
valueType: 'textarea', |
data: res.data?.data, |
||||
ellipsis: true, |
total: res.data?.total, |
||||
copyable: true |
success: true, |
||||
}, |
|
||||
{ |
|
||||
title: "应用名称", |
|
||||
hideInSearch: true, |
|
||||
dataIndex: 'appName', |
|
||||
valueType: 'textarea', |
|
||||
}, |
|
||||
{ |
|
||||
title: "平台", |
|
||||
dataIndex: 'platform', |
|
||||
valueEnum: { |
|
||||
1: { |
|
||||
text:"穿山甲" , |
|
||||
}, |
|
||||
2: { |
|
||||
text: "腾讯", |
|
||||
}, |
|
||||
3: { |
|
||||
text: "百度联盟", |
|
||||
}, |
|
||||
4: { |
|
||||
text:"Mintegral", |
|
||||
}, |
|
||||
5: { |
|
||||
text:"快手", |
|
||||
}, |
|
||||
6: { |
|
||||
text:"游可赢", |
|
||||
}, |
|
||||
7: { |
|
||||
text:"Sigmob", |
|
||||
}, |
|
||||
8: { |
|
||||
text:"Admob", |
|
||||
}, |
|
||||
}, |
|
||||
}, |
|
||||
{ |
|
||||
title: "广告类型", |
|
||||
dataIndex: 'advType', |
|
||||
valueEnum: { |
|
||||
1: { |
|
||||
text:"横幅" , |
|
||||
status: 'Default', |
|
||||
}, |
|
||||
2: { |
|
||||
text: "插页", |
|
||||
status: 'Processing', |
|
||||
}, |
|
||||
3: { |
|
||||
text: "激励视频", |
|
||||
status: 'Success', |
|
||||
}, |
|
||||
}, |
|
||||
}, |
|
||||
{ |
|
||||
title: "ecpm(元)", |
|
||||
dataIndex: 'ecpm', |
|
||||
hideInSearch: true, |
|
||||
renderText: (x) => { |
|
||||
return x / 100; |
|
||||
} |
|
||||
}, |
|
||||
{ |
|
||||
title: "设备品牌", |
|
||||
dataIndex: 'deviceBrand', |
|
||||
hideInSearch: true, |
|
||||
valueType: 'textarea', |
|
||||
}, |
|
||||
{ |
|
||||
title: "设备名", |
|
||||
dataIndex: 'deviceName', |
|
||||
hideInSearch: true, |
|
||||
valueType: 'textarea', |
|
||||
}, |
|
||||
{ |
|
||||
title: "ip", |
|
||||
dataIndex: 'ip', |
|
||||
hideInSearch: true, |
|
||||
valueType: 'textarea', |
|
||||
}, |
|
||||
{ |
|
||||
title: "时间", |
|
||||
hideInSearch: true, |
|
||||
dataIndex: 'createdAt', |
|
||||
valueType: 'dateTime' |
|
||||
}, |
|
||||
{ |
|
||||
title: "时间", |
|
||||
hideInTable: true, |
|
||||
dataIndex: 'createdAt', |
|
||||
valueType: 'dateRange' |
|
||||
}, |
|
||||
// {
|
|
||||
// title: "应用名称",
|
|
||||
// hideInTable: true,
|
|
||||
// dataIndex: 'appId',
|
|
||||
// valueType: "select",
|
|
||||
// request: appNameMap
|
|
||||
// }
|
|
||||
]; |
|
||||
|
|
||||
const {code} = useParams(); |
|
||||
const fetchData = async (params:any) => { |
|
||||
const res = await advList({...params, code:code}); |
|
||||
return { |
|
||||
data: res.data?.data, |
|
||||
total: res.data?.total, |
|
||||
success: true |
|
||||
} |
|
||||
}; |
}; |
||||
|
}; |
||||
|
|
||||
|
const [overview, setOverview] = useState<API.OverviewBo>(); |
||||
|
const [daily, setDaily] = useState<API.DateIncome[]>([]); |
||||
|
const { Divider } = StatisticCard; |
||||
|
const [responsive, setResponsive] = useState(false); |
||||
|
|
||||
|
const fetchOverview = async (param: string | undefined) => { |
||||
|
const res = await incomeOverview({ appCode: param }); |
||||
|
if (res.data) { |
||||
|
setOverview(res.data); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
const fetchDaily = async (params: API.IncomeQuery) => { |
||||
|
const res = await incomeDaily({ ...params, code: code }); |
||||
|
if (res.data) { |
||||
|
setDaily(res.data); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
useEffect(() => { |
||||
|
actionRef.current?.reload(); |
||||
|
fetchOverview(code); |
||||
|
fetchDaily({ code: code }); |
||||
|
}, [code]); |
||||
|
|
||||
|
const formatIncome = (v: number | undefined) => { |
||||
|
if (!v) { |
||||
|
return 0; |
||||
|
} |
||||
|
return parseFloat((v / 1000_00).toFixed(2)); |
||||
|
}; |
||||
|
|
||||
|
// 在渲染折线图组件时，对数据进行处理
|
||||
|
const processedChartData: { date: string | number; income: number }[] = daily.map((item) => ({ |
||||
|
date: item.date + '', |
||||
|
income: formatIncome(item.income), |
||||
|
})); |
||||
|
|
||||
useEffect(() => { |
const config = { |
||||
actionRef.current?.reload(); |
data: processedChartData, |
||||
}, [code]); |
xField: 'date', |
||||
|
yField: 'income', |
||||
return ( |
axis: { |
||||
<PageContainer> |
date: { |
||||
<ProTable<API.MatrixAdvRecordBo, API.AdvRecordQuery> |
title: '日期', |
||||
headerTitle={intl.formatMessage({ |
}, |
||||
id: 'pages.searchTable.title', |
income: { |
||||
defaultMessage: 'Enquiry form', |
title: '收入（元）', |
||||
})} |
}, |
||||
actionRef={actionRef} |
}, |
||||
rowKey="key" |
title: |
||||
search={{ |
'累计' + |
||||
labelWidth: 120, |
formatIncome(daily.reduce((acc, data) => acc + (data.income ? data.income : 0), 0)) + |
||||
}} |
'元', |
||||
request={fetchData} |
height: 400, |
||||
columns={columns} |
label: { |
||||
/> |
text: (d: any) => (d.收入 > 0 ? d.收入 : ''), |
||||
</PageContainer> |
textBaseline: 'bottom', |
||||
); |
}, |
||||
}; |
}; |
||||
|
|
||||
export default AdvRecordList; |
return ( |
||||
|
<PageContainer> |
||||
|
<Tabs defaultActiveKey="1" centered style={{ backgroundColor: 'white', padding: '20px' }}> |
||||
|
<TabPane tab="数据总览" key="1"> |
||||
|
<RcResizeObserver |
||||
|
key="resize-observer" |
||||
|
onResize={(offset) => { |
||||
|
setResponsive(offset.width < 596); |
||||
|
}} |
||||
|
> |
||||
|
<StatisticCard> |
||||
|
<StatisticCard.Group direction={responsive ? 'column' : 'row'}> |
||||
|
<StatisticCard |
||||
|
statistic={{ |
||||
|
title: '累计收入（元）', |
||||
|
value: formatIncome(overview?.totalIncome), |
||||
|
}} |
||||
|
/> |
||||
|
<Divider type={responsive ? 'horizontal' : 'vertical'} /> |
||||
|
<StatisticCard |
||||
|
statistic={{ |
||||
|
title: '今日收入（元）', |
||||
|
value: formatIncome(overview?.todayIncome), |
||||
|
}} |
||||
|
/> |
||||
|
</StatisticCard.Group> |
||||
|
</StatisticCard> |
||||
|
</RcResizeObserver> |
||||
|
|
||||
|
<QueryFilter defaultCollapsed split onFinish={fetchDaily}> |
||||
|
<ProFormSelect |
||||
|
label="平台" |
||||
|
name="platform" |
||||
|
valueEnum={{ |
||||
|
1: '穿山甲', |
||||
|
2: '腾讯', |
||||
|
3: '百度联盟', |
||||
|
4: 'Mintegral', |
||||
|
5: '快手', |
||||
|
6: '游可赢', |
||||
|
7: 'Sigmob', |
||||
|
8: 'Admob', |
||||
|
}} |
||||
|
/> |
||||
|
<ProFormSelect |
||||
|
name="advType" |
||||
|
label="广告类型" |
||||
|
valueEnum={{ |
||||
|
1: '横幅', |
||||
|
2: '插页', |
||||
|
3: '激励视频', |
||||
|
}} |
||||
|
/> |
||||
|
<ProFormDateRangePicker |
||||
|
fieldProps={{ |
||||
|
disabledDate: (current: any) => current && current >= moment().startOf('day'), |
||||
|
}} |
||||
|
name="date" |
||||
|
label="时间" |
||||
|
/> |
||||
|
</QueryFilter> |
||||
|
{/* <Line {...config} /> */} |
||||
|
<Column {...config} /> |
||||
|
</TabPane> |
||||
|
<TabPane tab="广告详情" key="2"> |
||||
|
<ProTable<API.MatrixAdvRecordBo, API.AdvRecordQuery> |
||||
|
headerTitle={intl.formatMessage({ |
||||
|
id: 'pages.searchTable.title', |
||||
|
defaultMessage: 'Enquiry form', |
||||
|
})} |
||||
|
actionRef={actionRef} |
||||
|
rowKey="key" |
||||
|
search={{ |
||||
|
labelWidth: 120, |
||||
|
}} |
||||
|
request={fetchData} |
||||
|
columns={columns} |
||||
|
/> |
||||
|
</TabPane> |
||||
|
</Tabs> |
||||
|
</PageContainer> |
||||
|
); |
||||
|
}; |
||||
|
|
||||
|
export default AdvRecordList; |
||||
|
|||||
@ -0,0 +1,165 @@ |
|||||
|
import { appList, incomeOverview } from '@/services/matrix/admin'; |
||||
|
import { Column } from '@ant-design/charts'; |
||||
|
import { |
||||
|
PageContainer, |
||||
|
ProFormDateRangePicker, |
||||
|
ProFormSelect, |
||||
|
QueryFilter, |
||||
|
StatisticCard, |
||||
|
} from '@ant-design/pro-components'; |
||||
|
import moment from 'moment'; |
||||
|
import RcResizeObserver from 'rc-resize-observer'; |
||||
|
import { useEffect, useState } from 'react'; |
||||
|
import { useParams } from 'react-router-dom'; |
||||
|
import { incomeDaily } from '../services/matrix/admin'; |
||||
|
|
||||
|
const Overview: React.FC = () => { |
||||
|
const [overview, setOverview] = useState<API.OverviewBo>(); |
||||
|
const [daily, setDaily] = useState<API.DateIncome[]>([]); |
||||
|
const [appArr, setAppArr] = useState<API.MatrixApp[]>([]); |
||||
|
const { Divider } = StatisticCard; |
||||
|
const [responsive, setResponsive] = useState(false); |
||||
|
|
||||
|
const { code } = useParams(); |
||||
|
|
||||
|
const fetchData = async () => { |
||||
|
const res = await incomeOverview({ appCode: code }); |
||||
|
if (res.data) { |
||||
|
setOverview(res.data); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
const fetchApp = async () => { |
||||
|
const res = await appList(); |
||||
|
if (res.data) { |
||||
|
setAppArr(res.data); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
const fetchDaily = async (params: API.IncomeQuery) => { |
||||
|
console.log('fetchDaily'); |
||||
|
console.log(params); |
||||
|
const res = await incomeDaily(params); |
||||
|
if (res.data) { |
||||
|
setDaily(res.data); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
useEffect(() => { |
||||
|
fetchData(); |
||||
|
fetchApp(); |
||||
|
fetchDaily({ code: code }); |
||||
|
}, []); |
||||
|
|
||||
|
const formatIncome = (v: number | undefined) => { |
||||
|
if (!v) { |
||||
|
return 0; |
||||
|
} |
||||
|
return parseFloat((v / 1000_00).toFixed(2)); |
||||
|
}; |
||||
|
|
||||
|
// 在渲染折线图组件时，对数据进行处理
|
||||
|
const processedChartData: { date: string | number; income: number }[] = daily.map((item) => ({ |
||||
|
date: item.date + '', |
||||
|
income: formatIncome(item.income), |
||||
|
})); |
||||
|
|
||||
|
const config = { |
||||
|
data: processedChartData, |
||||
|
xField: 'date', |
||||
|
yField: 'income', |
||||
|
axis: { |
||||
|
date: { |
||||
|
title: '日期', |
||||
|
}, |
||||
|
income: { |
||||
|
title: '收入（元）', |
||||
|
}, |
||||
|
}, |
||||
|
title: |
||||
|
'累计' + |
||||
|
formatIncome(daily.reduce((acc, data) => acc + (data.income ? data.income : 0), 0)) + |
||||
|
'元', |
||||
|
height: 400, |
||||
|
label: { |
||||
|
text: (d: any) => (d.收入 > 0 ? d.收入 : ''), |
||||
|
textBaseline: 'bottom', |
||||
|
}, |
||||
|
}; |
||||
|
|
||||
|
return ( |
||||
|
<PageContainer> |
||||
|
<RcResizeObserver |
||||
|
key="resize-observer" |
||||
|
onResize={(offset) => { |
||||
|
setResponsive(offset.width < 596); |
||||
|
}} |
||||
|
> |
||||
|
<StatisticCard> |
||||
|
<StatisticCard.Group direction={responsive ? 'column' : 'row'}> |
||||
|
<StatisticCard |
||||
|
statistic={{ |
||||
|
title: '累计收入（元）', |
||||
|
value: formatIncome(overview?.totalIncome), |
||||
|
}} |
||||
|
/> |
||||
|
<Divider type={responsive ? 'horizontal' : 'vertical'} /> |
||||
|
<StatisticCard |
||||
|
statistic={{ |
||||
|
title: '今日收入（元）', |
||||
|
value: formatIncome(overview?.todayIncome), |
||||
|
}} |
||||
|
/> |
||||
|
</StatisticCard.Group> |
||||
|
</StatisticCard> |
||||
|
</RcResizeObserver> |
||||
|
|
||||
|
<div style={{ backgroundColor: 'white', marginTop: '20px', padding: '40px' }}> |
||||
|
<QueryFilter defaultCollapsed split onFinish={fetchDaily}> |
||||
|
<ProFormSelect |
||||
|
name="code" |
||||
|
label="应用" |
||||
|
options={appArr.map((x) => ({ |
||||
|
label: x.name, |
||||
|
value: x.code, |
||||
|
}))} |
||||
|
/> |
||||
|
<ProFormSelect |
||||
|
label="平台" |
||||
|
name="platform" |
||||
|
valueEnum={{ |
||||
|
1: '穿山甲', |
||||
|
2: '腾讯', |
||||
|
3: '百度联盟', |
||||
|
4: 'Mintegral', |
||||
|
5: '快手', |
||||
|
6: '游可赢', |
||||
|
7: 'Sigmob', |
||||
|
8: 'Admob', |
||||
|
}} |
||||
|
/> |
||||
|
<ProFormSelect |
||||
|
name="advType" |
||||
|
label="广告类型" |
||||
|
valueEnum={{ |
||||
|
1: '横幅', |
||||
|
2: '插页', |
||||
|
3: '激励视频', |
||||
|
}} |
||||
|
/> |
||||
|
<ProFormDateRangePicker |
||||
|
fieldProps={{ |
||||
|
disabledDate: (current: any) => current && current >= moment().startOf('day'), |
||||
|
}} |
||||
|
name="date" |
||||
|
label="时间" |
||||
|
/> |
||||
|
</QueryFilter> |
||||
|
{/* <Line {...config} /> */} |
||||
|
<Column {...config} /> |
||||
|
</div> |
||||
|
</PageContainer> |
||||
|
); |
||||
|
}; |
||||
|
|
||||
|
export default Overview; |
||||
Loading…
Reference in new issue