Skip to content

A
ant-design
Commit 7eed16bc by gj
Options

调用后台接口

parent fc973372
Showing with 332 additions and 275 deletions
table/src/index.html 0 → 100755
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/antd/3.7.3/antd.min.css">
<style>
#app {
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 44px;
}
.section {
margin: 1em 0;
}
</style>
</head>
<body>
<div id="app"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.4.2/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.4.2/umd/react-dom.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/6.26.0/polyfill.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.26.0/babel.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/antd/3.7.3/antd.min.js"></script>
<script>const mountNode = document.getElementById('app');</script>
<script type="text/babel">
const { Table, Divider, Tag, Button } = antd;
const { Column, ColumnGroup } = Table;
class App extends React.Component {
constructor() {
super();
this.state = {
selectedRowKeys2: [],
selectedRowKeys3: [],
loading: false,
}
}
render() {
const columns1 = [{
title: 'Name',
dataIndex: 'name',
key: 'name',
render: text => <a href="javascript:;">{text}</a>,
}, {
title: 'Age',
dataIndex: 'age',
key: 'age',
}, {
title: 'Address',
dataIndex: 'address',
key: 'address',
}, {
title: 'Tags',
key: 'tags',
dataIndex: 'tags',
render: tags => (
<span>
{tags.map(tag => <Tag color="blue" key={tag}>{tag}</Tag>)}
</span>
),
}, {
title: 'Action',
key: 'action',
render: (text, record) => (
<span>
<a href="javascript:;">Invite {record.name}</a>
<Divider type="vertical" />
<a href="javascript:;">Delete</a>
</span>
),
}];
const data1 = [{
key: '1',
name: 'John Brown',
age: 32,
address: 'New York No. 1 Lake Park',
tags: ['nice', 'developer'],
}, {
key: '2',
name: 'Jim Green',
age: 42,
address: 'London No. 1 Lake Park',
tags: ['loser'],
}, {
key: '3',
name: 'Joe Black',
age: 32,
address: 'Sidney No. 1 Lake Park',
tags: ['cool', 'teacher'],
}, {
key: '4',
name: 'Disabled User',
age: 99,
address: 'Sidney No. 1 Lake Park',
tags: [],
}];
const data2 = [{
key: '1',
firstName: 'John',
lastName: 'Brown',
age: 32,
address: 'New York No. 1 Lake Park',
tags: ['nice', 'developer'],
}, {
key: '2',
firstName: 'Jim',
lastName: 'Green',
age: 42,
address: 'London No. 1 Lake Park',
tags: ['loser'],
}, {
key: '3',
firstName: 'Joe',
lastName: 'Black',
age: 32,
address: 'Sidney No. 1 Lake Park',
tags: ['cool', 'teacher'],
}];
// rowSelection object indicates the need for row selection
const rowSelection1 = {
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
},
getCheckboxProps: record => ({
disabled: record.name === 'Disabled User', // Column configuration not to be checked
name: record.name,
}),
};
const rowSelection2 = {
selectedRowKeys: this.state.selectedRowKeys2,
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
this.setState({ selectedRowKeys2: selectedRowKeys });
},
getCheckboxProps: record => ({
disabled: record.name === 'Disabled User', // Column configuration not to be checked
name: record.name,
}),
};
const rowSelection3 = {
hideDefaultSelections: true,
selectedRowKeys: this.state.selectedRowKeys3,
selections: [{
key: 'all-data',
text: 'Select All Data',
onSelect: (changableRowKeys) => {
this.setState({
selectedRowKeys3: changableRowKeys,
});
},
}, {
key: 'odd',
text: 'Select Odd Row',
onSelect: (changableRowKeys) => {
let newSelectedRowKeys = [];
newSelectedRowKeys = changableRowKeys.filter((key, index) => {
if (index % 2 !== 0) {
return false;
}
return true;
});
this.setState({ selectedRowKeys3: newSelectedRowKeys });
},
}, {
key: 'even',
text: 'Select Even Row',
onSelect: (changableRowKeys) => {
let newSelectedRowKeys = [];
newSelectedRowKeys = changableRowKeys.filter((key, index) => {
if (index % 2 !== 0) {
return true;
}
return false;
});
this.setState({ selectedRowKeys3: newSelectedRowKeys });
},
}],
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
this.setState({ selectedRowKeys3: selectedRowKeys });
},
getCheckboxProps: record => ({
disabled: record.name === 'Disabled User', // Column configuration not to be checked
name: record.name,
}),
};
return (
<div>
<div>
<h2>1. Basic Usage</h2>
<Table columns={columns1} dataSource={data1} />
</div>
<div>
<h2>2. JSX Style API, for columns, after v2.5.0</h2>
<Table dataSource={data2}>
<ColumnGroup title="Name">
<Column
title="First Name"
dataIndex="firstName"
key="firstName"
/>
<Column
title="Last Name"
dataIndex="lastName"
key="lastName"
/>
</ColumnGroup>
<Column
title="Age"
dataIndex="age"
key="age"
/>
<Column
title="Address"
dataIndex="address"
key="address"
/>
<Column
title="Tags"
dataIndex="tags"
key="tags"
render={tags => (
<span>
{tags.map(tag => <Tag color="blue" key={tag}>{tag}</Tag>)}
</span>
)}
/>
<Column
title="Action"
key="action"
render={(text, record) => (
<span>
<a href="javascript:;">Invite {record.lastName}</a>
<Divider type="vertical" />
<a href="javascript:;">Delete</a>
</span>
)}
/>
</Table>
</div>
<div>
<h2>3. Row Selection</h2>
<Table rowSelection={rowSelection1} columns={columns1} dataSource={data1} />
</div>
<div>
<h2>4. Row Selection and Operation</h2>
<Button onClick={() => this.setState({ selectedRowKeys: [] })}>Do Operation and Clear</Button>
<Table rowSelection={rowSelection2} columns={columns1} dataSource={data1} />
</div>
<div>
<h2>5. Custom Row Selection</h2>
<Table rowSelection={rowSelection3} columns={columns1} dataSource={data1} />
</div>
</div>
);
}
}
</script>
<script type="text/babel">ReactDOM.render(<App />, mountNode);</script>
<script src="https://github.johannhuang.com/ant-design-demos/libs/js/iifes/canvas-nest.min.js"></script>
</body>
</html>
table/src/static/axios.min.js 0 → 100755
/* axios v0.19.0-beta.1 | (c) 2018 by Matt Zabriskie */
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.axios=t():e.axios=t()}(this,function(){return function(e){function t(r){if(n[r])return n[r].exports;var o=n[r]={exports:{},id:r,loaded:!1};return e[r].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){e.exports=n(1)},function(e,t,n){"use strict";function r(e){var t=new i(e),n=s(i.prototype.request,t);return o.extend(n,i.prototype,t),o.extend(n,t),n}var o=n(2),s=n(3),i=n(5),a=n(22),u=n(11),c=r(u);c.Axios=i,c.create=function(e){return r(a(c.defaults,e))},c.Cancel=n(23),c.CancelToken=n(24),c.isCancel=n(10),c.all=function(e){return Promise.all(e)},c.spread=n(25),e.exports=c,e.exports.default=c},function(e,t,n){"use strict";function r(e){return"[object Array]"===j.call(e)}function o(e){return"[object ArrayBuffer]"===j.call(e)}function s(e){return"undefined"!=typeof FormData&&e instanceof FormData}function i(e){var t;return t="undefined"!=typeof ArrayBuffer&&ArrayBuffer.isView?ArrayBuffer.isView(e):e&&e.buffer&&e.buffer instanceof ArrayBuffer}function a(e){return"string"==typeof e}function u(e){return"number"==typeof e}function c(e){return"undefined"==typeof e}function f(e){return null!==e&&"object"==typeof e}function p(e){return"[object Date]"===j.call(e)}function d(e){return"[object File]"===j.call(e)}function l(e){return"[object Blob]"===j.call(e)}function h(e){return"[object Function]"===j.call(e)}function m(e){return f(e)&&h(e.pipe)}function y(e){return"undefined"!=typeof URLSearchParams&&e instanceof URLSearchParams}function g(e){return e.replace(/^\s*/,"").replace(/\s*$/,"")}function x(){return("undefined"==typeof navigator||"ReactNative"!==navigator.product&&"NativeScript"!==navigator.product&&"NS"!==navigator.product)&&("undefined"!=typeof window&&"undefined"!=typeof document)}function v(e,t){if(null!==e&&"undefined"!=typeof e)if("object"!=typeof e&&(e=[e]),r(e))for(var n=0,o=e.length;n<o;n++)t.call(null,e[n],n,e);else for(var s in e)Object.prototype.hasOwnProperty.call(e,s)&&t.call(null,e[s],s,e)}function w(){function e(e,n){"object"==typeof t[n]&&"object"==typeof e?t[n]=w(t[n],e):t[n]=e}for(var t={},n=0,r=arguments.length;n<r;n++)v(arguments[n],e);return t}function b(){function e(e,n){"object"==typeof t[n]&&"object"==typeof e?t[n]=b(t[n],e):"object"==typeof e?t[n]=b({},e):t[n]=e}for(var t={},n=0,r=arguments.length;n<r;n++)v(arguments[n],e);return t}function E(e,t,n){return v(t,function(t,r){n&&"function"==typeof t?e[r]=S(t,n):e[r]=t}),e}var S=n(3),R=n(4),j=Object.prototype.toString;e.exports={isArray:r,isArrayBuffer:o,isBuffer:R,isFormData:s,isArrayBufferView:i,isString:a,isNumber:u,isObject:f,isUndefined:c,isDate:p,isFile:d,isBlob:l,isFunction:h,isStream:m,isURLSearchParams:y,isStandardBrowserEnv:x,forEach:v,merge:w,deepMerge:b,extend:E,trim:g}},function(e,t){"use strict";e.exports=function(e,t){return function(){for(var n=new Array(arguments.length),r=0;r<n.length;r++)n[r]=arguments[r];return e.apply(t,n)}}},function(e,t){/*!
* Determine if an object is a Buffer
*
* @author Feross Aboukhadijeh <https://feross.org>
* @license MIT
*/
e.exports=function(e){return null!=e&&null!=e.constructor&&"function"==typeof e.constructor.isBuffer&&e.constructor.isBuffer(e)}},function(e,t,n){"use strict";function r(e){this.defaults=e,this.interceptors={request:new i,response:new i}}var o=n(2),s=n(6),i=n(7),a=n(8),u=n(22);r.prototype.request=function(e){"string"==typeof e?(e=arguments[1]||{},e.url=arguments[0]):e=e||{},e=u(this.defaults,e),e.method=e.method?e.method.toLowerCase():"get";var t=[a,void 0],n=Promise.resolve(e);for(this.interceptors.request.forEach(function(e){t.unshift(e.fulfilled,e.rejected)}),this.interceptors.response.forEach(function(e){t.push(e.fulfilled,e.rejected)});t.length;)n=n.then(t.shift(),t.shift());return n},r.prototype.getUri=function(e){return e=u(this.defaults,e),s(e.url,e.params,e.paramsSerializer).replace(/^\?/,"")},o.forEach(["delete","get","head","options"],function(e){r.prototype[e]=function(t,n){return this.request(o.merge(n||{},{method:e,url:t}))}}),o.forEach(["post","put","patch"],function(e){r.prototype[e]=function(t,n,r){return this.request(o.merge(r||{},{method:e,url:t,data:n}))}}),e.exports=r},function(e,t,n){"use strict";function r(e){return encodeURIComponent(e).replace(/%40/gi,"@").replace(/%3A/gi,":").replace(/%24/g,"$").replace(/%2C/gi,",").replace(/%20/g,"+").replace(/%5B/gi,"[").replace(/%5D/gi,"]")}var o=n(2);e.exports=function(e,t,n){if(!t)return e;var s;if(n)s=n(t);else if(o.isURLSearchParams(t))s=t.toString();else{var i=[];o.forEach(t,function(e,t){null!==e&&"undefined"!=typeof e&&(o.isArray(e)?t+="[]":e=[e],o.forEach(e,function(e){o.isDate(e)?e=e.toISOString():o.isObject(e)&&(e=JSON.stringify(e)),i.push(r(t)+"="+r(e))}))}),s=i.join("&")}return s&&(e+=(e.indexOf("?")===-1?"?":"&")+s),e}},function(e,t,n){"use strict";function r(){this.handlers=[]}var o=n(2);r.prototype.use=function(e,t){return this.handlers.push({fulfilled:e,rejected:t}),this.handlers.length-1},r.prototype.eject=function(e){this.handlers[e]&&(this.handlers[e]=null)},r.prototype.forEach=function(e){o.forEach(this.handlers,function(t){null!==t&&e(t)})},e.exports=r},function(e,t,n){"use strict";function r(e){e.cancelToken&&e.cancelToken.throwIfRequested()}var o=n(2),s=n(9),i=n(10),a=n(11),u=n(20),c=n(21);e.exports=function(e){r(e),e.baseURL&&!u(e.url)&&(e.url=c(e.baseURL,e.url)),e.headers=e.headers||{},e.data=s(e.data,e.headers,e.transformRequest),e.headers=o.merge(e.headers.common||{},e.headers[e.method]||{},e.headers||{}),o.forEach(["delete","get","head","post","put","patch","common"],function(t){delete e.headers[t]});var t=e.adapter||a.adapter;return t(e).then(function(t){return r(e),t.data=s(t.data,t.headers,e.transformResponse),t},function(t){return i(t)||(r(e),t&&t.response&&(t.response.data=s(t.response.data,t.response.headers,e.transformResponse))),Promise.reject(t)})}},function(e,t,n){"use strict";var r=n(2);e.exports=function(e,t,n){return r.forEach(n,function(n){e=n(e,t)}),e}},function(e,t){"use strict";e.exports=function(e){return!(!e||!e.__CANCEL__)}},function(e,t,n){"use strict";function r(e,t){!s.isUndefined(e)&&s.isUndefined(e["Content-Type"])&&(e["Content-Type"]=t)}function o(){var e;return"undefined"!=typeof process&&"[object process]"===Object.prototype.toString.call(process)?e=n(13):"undefined"!=typeof XMLHttpRequest&&(e=n(13)),e}var s=n(2),i=n(12),a={"Content-Type":"application/x-www-form-urlencoded"},u={adapter:o(),transformRequest:[function(e,t){return i(t,"Accept"),i(t,"Content-Type"),s.isFormData(e)||s.isArrayBuffer(e)||s.isBuffer(e)||s.isStream(e)||s.isFile(e)||s.isBlob(e)?e:s.isArrayBufferView(e)?e.buffer:s.isURLSearchParams(e)?(r(t,"application/x-www-form-urlencoded;charset=utf-8"),e.toString()):s.isObject(e)?(r(t,"application/json;charset=utf-8"),JSON.stringify(e)):e}],transformResponse:[function(e){if("string"==typeof e)try{e=JSON.parse(e)}catch(e){}return e}],timeout:0,xsrfCookieName:"XSRF-TOKEN",xsrfHeaderName:"X-XSRF-TOKEN",maxContentLength:-1,validateStatus:function(e){return e>=200&&e<300}};u.headers={common:{Accept:"application/json, text/plain, */*"}},s.forEach(["delete","get","head"],function(e){u.headers[e]={}}),s.forEach(["post","put","patch"],function(e){u.headers[e]=s.merge(a)}),e.exports=u},function(e,t,n){"use strict";var r=n(2);e.exports=function(e,t){r.forEach(e,function(n,r){r!==t&&r.toUpperCase()===t.toUpperCase()&&(e[t]=n,delete e[r])})}},function(e,t,n){"use strict";var r=n(2),o=n(14),s=n(6),i=n(17),a=n(18),u=n(15);e.exports=function(e){return new Promise(function(t,c){var f=e.data,p=e.headers;r.isFormData(f)&&delete p["Content-Type"];var d=new XMLHttpRequest;if(e.auth){var l=e.auth.username||"",h=e.auth.password||"";p.Authorization="Basic "+btoa(l+":"+h)}if(d.open(e.method.toUpperCase(),s(e.url,e.params,e.paramsSerializer),!0),d.timeout=e.timeout,d.onreadystatechange=function(){if(d&&4===d.readyState&&(0!==d.status||d.responseURL&&0===d.responseURL.indexOf("file:"))){var n="getAllResponseHeaders"in d?i(d.getAllResponseHeaders()):null,r=e.responseType&&"text"!==e.responseType?d.response:d.responseText,s={data:r,status:d.status,statusText:d.statusText,headers:n,config:e,request:d};o(t,c,s),d=null}},d.onabort=function(){d&&(c(u("Request aborted",e,"ECONNABORTED",d)),d=null)},d.onerror=function(){c(u("Network Error",e,null,d)),d=null},d.ontimeout=function(){c(u("timeout of "+e.timeout+"ms exceeded",e,"ECONNABORTED",d)),d=null},r.isStandardBrowserEnv()){var m=n(19),y=(e.withCredentials||a(e.url))&&e.xsrfCookieName?m.read(e.xsrfCookieName):void 0;y&&(p[e.xsrfHeaderName]=y)}if("setRequestHeader"in d&&r.forEach(p,function(e,t){"undefined"==typeof f&&"content-type"===t.toLowerCase()?delete p[t]:d.setRequestHeader(t,e)}),e.withCredentials&&(d.withCredentials=!0),e.responseType)try{d.responseType=e.responseType}catch(t){if("json"!==e.responseType)throw t}"function"==typeof e.onDownloadProgress&&d.addEventListener("progress",e.onDownloadProgress),"function"==typeof e.onUploadProgress&&d.upload&&d.upload.addEventListener("progress",e.onUploadProgress),e.cancelToken&&e.cancelToken.promise.then(function(e){d&&(d.abort(),c(e),d=null)}),void 0===f&&(f=null),d.send(f)})}},function(e,t,n){"use strict";var r=n(15);e.exports=function(e,t,n){var o=n.config.validateStatus;!o||o(n.status)?e(n):t(r("Request failed with status code "+n.status,n.config,null,n.request,n))}},function(e,t,n){"use strict";var r=n(16);e.exports=function(e,t,n,o,s){var i=new Error(e);return r(i,t,n,o,s)}},function(e,t){"use strict";e.exports=function(e,t,n,r,o){return e.config=t,n&&(e.code=n),e.request=r,e.response=o,e.toJSON=function(){return{message:this.message,name:this.name,description:this.description,number:this.number,fileName:this.fileName,lineNumber:this.lineNumber,columnNumber:this.columnNumber,stack:this.stack,config:this.config,code:this.code}},e}},function(e,t,n){"use strict";var r=n(2),o=["age","authorization","content-length","content-type","etag","expires","from","host","if-modified-since","if-unmodified-since","last-modified","location","max-forwards","proxy-authorization","referer","retry-after","user-agent"];e.exports=function(e){var t,n,s,i={};return e?(r.forEach(e.split("\n"),function(e){if(s=e.indexOf(":"),t=r.trim(e.substr(0,s)).toLowerCase(),n=r.trim(e.substr(s+1)),t){if(i[t]&&o.indexOf(t)>=0)return;"set-cookie"===t?i[t]=(i[t]?i[t]:[]).concat([n]):i[t]=i[t]?i[t]+", "+n:n}}),i):i}},function(e,t,n){"use strict";var r=n(2);e.exports=r.isStandardBrowserEnv()?function(){function e(e){var t=e;return n&&(o.setAttribute("href",t),t=o.href),o.setAttribute("href",t),{href:o.href,protocol:o.protocol?o.protocol.replace(/:$/,""):"",host:o.host,search:o.search?o.search.replace(/^\?/,""):"",hash:o.hash?o.hash.replace(/^#/,""):"",hostname:o.hostname,port:o.port,pathname:"/"===o.pathname.charAt(0)?o.pathname:"/"+o.pathname}}var t,n=/(msie|trident)/i.test(navigator.userAgent),o=document.createElement("a");return t=e(window.location.href),function(n){var o=r.isString(n)?e(n):n;return o.protocol===t.protocol&&o.host===t.host}}():function(){return function(){return!0}}()},function(e,t,n){"use strict";var r=n(2);e.exports=r.isStandardBrowserEnv()?function(){return{write:function(e,t,n,o,s,i){var a=[];a.push(e+"="+encodeURIComponent(t)),r.isNumber(n)&&a.push("expires="+new Date(n).toGMTString()),r.isString(o)&&a.push("path="+o),r.isString(s)&&a.push("domain="+s),i===!0&&a.push("secure"),document.cookie=a.join("; ")},read:function(e){var t=document.cookie.match(new RegExp("(^|;\\s*)("+e+")=([^;]*)"));return t?decodeURIComponent(t[3]):null},remove:function(e){this.write(e,"",Date.now()-864e5)}}}():function(){return{write:function(){},read:function(){return null},remove:function(){}}}()},function(e,t){"use strict";e.exports=function(e){return/^([a-z][a-z\d\+\-\.]*:)?\/\//i.test(e)}},function(e,t){"use strict";e.exports=function(e,t){return t?e.replace(/\/+$/,"")+"/"+t.replace(/^\/+/,""):e}},function(e,t,n){"use strict";var r=n(2);e.exports=function(e,t){t=t||{};var n={};return r.forEach(["url","method","params","data"],function(e){"undefined"!=typeof t[e]&&(n[e]=t[e])}),r.forEach(["headers","auth","proxy"],function(o){r.isObject(t[o])?n[o]=r.deepMerge(e[o],t[o]):"undefined"!=typeof t[o]?n[o]=t[o]:r.isObject(e[o])?n[o]=r.deepMerge(e[o]):"undefined"!=typeof e[o]&&(n[o]=e[o])}),r.forEach(["baseURL","transformRequest","transformResponse","paramsSerializer","timeout","withCredentials","adapter","responseType","xsrfCookieName","xsrfHeaderName","onUploadProgress","onDownloadProgress","maxContentLength","validateStatus","maxRedirects","httpAgent","httpsAgent","cancelToken","socketPath"],function(r){"undefined"!=typeof t[r]?n[r]=t[r]:"undefined"!=typeof e[r]&&(n[r]=e[r])}),n}},function(e,t){"use strict";function n(e){this.message=e}n.prototype.toString=function(){return"Cancel"+(this.message?": "+this.message:"")},n.prototype.__CANCEL__=!0,e.exports=n},function(e,t,n){"use strict";function r(e){if("function"!=typeof e)throw new TypeError("executor must be a function.");var t;this.promise=new Promise(function(e){t=e});var n=this;e(function(e){n.reason||(n.reason=new o(e),t(n.reason))})}var o=n(23);r.prototype.throwIfRequested=function(){if(this.reason)throw this.reason},r.source=function(){var e,t=new r(function(t){e=t});return{token:t,cancel:e}},e.exports=r},function(e,t){"use strict";e.exports=function(e){return function(t){return e.apply(null,t)}}}])});
//# sourceMappingURL=axios.min.map
\ No newline at end of file
table/src/table.html
......@@ -28,6 +28,8 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.4.2/umd/react-dom.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/6.26.0/polyfill.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.26.0/babel.min.js"></script>
<script src="./static/axios.min.js"></script>
<script src="https://cdn.bootcss.com/qs/6.5.1/qs.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/antd/3.7.3/antd.min.js"></script>
......@@ -39,19 +41,44 @@
const statusMap = ['error', 'success', 'default'];
const status = ['审核未通过', '审核通过', '提交未审核'];
const dfield = ['公交', '出租', '地铁', '高速'];
const pag = { pageSize: 30, currentPage: 1 };
const ifnull = { dataName: '', dataField: '', location: '' };
class App extends React.Component {
constructor() {
super();
this.state = {
selectedRowKeys2: [],
selectedRowKeys3: [],
loading: false,
}
class App extends React.Component {
constructor() {
super();
this.state = {
selectedRowKeys2: [],
selectedRowKeys3: [],
loading: false,
list: []
}
render() {
const columns1 = [
}
componentDidMount() {
const _this = this;
axios({
url: "http://47.92.162.213:8080/data/Search",
method: "post",
data: Qs.stringify({
...pag,
...ifnull,
}),
headers: {'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'}
})
.then(function (response) {
const { data } = response;
// console.log(data);
const { list } = data;
_this.setState({ list });
})
.catch(function (error) {
console.log(error);
});
}
render() {
const columns = [
{
title: '数据名称',
dataIndex: 'name',
......@@ -68,7 +95,7 @@
{
title: '审核状态',
dataIndex: 'status',
render: val => <span>审核通过</span>,
render: val => <p>审核成功</p>,
},
{
title: '时间',
......@@ -88,273 +115,11 @@
},
];
const data1 = [{
"dataid": 1,
"time": "2018-10-25T12:29:25.000+0000",
"datasourcetype": "kafka",
"status": 1,
"name": "测试用-北京出租车GPS数据",
"datatype": 0,
"crossprovince": 1,
"datalocation": "北京市",
"datafield": 1,
"company": "Didicompany",
"datadescription": "测试用-北京出租车GPS数据",
"ownnode": 5,
"datadefinition": "字段名:StrCompanyID,数据类型:string,字段说明:StrCompanyID;字段名:StrDepLongitude,数据类型:double,字段说明:StrDepLongitude;字段名:StrDepLatitude,数据类型:double,字段说明:StrDepLatitude;字段名:StrOrderID,数据类型:string,字段说明:StrOrderID;",
"url": "/user/download?file=f6bbfb6e512531cb78a086b94708f398.166ab336727&name=order_true.json",
"resourceip": "127.0.0.1",
"kafkatopic": "ORDER",
"dataurl": "127.0.0.1:8000"
},
{
"dataid": 2,
"time": "2018-10-25T12:39:55.000+0000",
"datasourcetype": "kafka",
"status": 1,
"name": "北京出租车GPS数据",
"datatype": 1,
"crossprovince": 1,
"datalocation": "北京市",
"datafield": 1,
"company": "Didicompany",
"datadescription": "北京出租车GPS数据",
"ownnode": 6,
"datadefinition": "字段名:StrCompanyID;字段名:StrDepLongitude;字段名:StrDepLatitude;字段名:StrOrderID;",
"url": "/user/download?file=f6bbfb6e512531cb78a086b94708f398.166ab3d0424&name=order_true.json",
"resourceip": "192.168.3.19",
"kafkatopic": "ORDER",
"dataurl": "192.168.3.19:8000"
},
{
"dataid": 4,
"time": "2018-10-26T08:55:36.000+0000",
"datasourcetype": "kafka",
"status": 1,
"name": "测试用-北京地铁出行链",
"datatype": 0,
"crossprovince": 1,
"datalocation": "北京市",
"datafield": 2,
"company": "BeijingSubway",
"datadescription": "测试用-北京地铁出行链",
"ownnode": 5,
"datadefinition": "字段名:id;字段名:startTime;字段名:startPos;字段名:startLng;字段名:startLat;字段名:endTime;字段名:endPos;字段名:endLng;字段名:endLat;",
"url": "/user/download?file=80ec43b33fbb6cab6dd6074bd390c3b0.166af96015c&name=tripChain.json",
"resourceip": "127.0.0.1",
"kafkatopic": "tripChain",
"dataurl": "127.0.0.1:8000"
},
{
"dataid": 5,
"time": "2018-10-26T08:57:59.000+0000",
"datasourcetype": "kafka",
"status": 1,
"name": "北京地铁出行链",
"datatype": 1,
"crossprovince": 1,
"datalocation": "北京市",
"datafield": 2,
"company": "BeijingSubway",
"datadescription": "北京地铁出行链",
"ownnode": 6,
"datadefinition": "字段名:id;字段名:startTime;字段名:startPos;字段名:startLng;字段名:startLat;字段名:endTime;字段名:endPos;字段名:endLng;字段名:endLat;",
"url": "/user/download?file=80ec43b33fbb6cab6dd6074bd390c3b0.166af983191&name=tripChain.json",
"resourceip": "192.168.3.19",
"kafkatopic": "tripChain",
"dataurl": "192.168.3.19:8000"
},
{
"dataid": 6,
"time": "2018-10-26T09:30:51.000+0000",
"datasourcetype": "kafka",
"status": 1,
"name": "重庆ECT刷卡数据",
"datatype": 1,
"crossprovince": 1,
"datalocation": "重庆市",
"datafield": 3,
"company": "ChongQingTransports",
"datadescription": "重庆ECT刷卡数据",
"ownnode": 6,
"datadefinition": "字段名:ROADNUMBER;字段名:STATIONID;字段名:ENDTIME;字段名:OPERATOR;字段名:STARTTIME;字段名:LICENSE;",
"url": "/user/download?file=6e99d7fad707c26750b80db40f129680.166afb643f5&name=ChongQing-ETC-2015.json",
"resourceip": "192.168.3.19",
"kafkatopic": "ChongQing-ETC",
"dataurl": "192.168.3.19:8000"
},
{
"dataid": 7,
"time": "2018-10-26T09:33:09.000+0000",
"datasourcetype": "kafka",
"status": 1,
"name": "北京市高速通行数据",
"datatype": 1,
"crossprovince": 1,
"datalocation": "北京市",
"datafield": 3,
"company": "Hi-SpeedGroup",
"datadescription": "北京市高速通行数据",
"ownnode": 6,
"datadefinition": "字段名:ID;字段名:LICENSE;字段名:MILES;字段名:BUMBER;字段名:IDENTIFY;",
"url": "/user/download?file=e3f825b2c53fb4f02a561d4c21754fcc.166afb861d1&name=Highway-201604.json",
"resourceip": "192.168.3.19",
"kafkatopic": "Highway",
"dataurl": "192.168.3.19:8000"
},
{
"dataid": 8,
"time": "2018-10-26T09:35:56.000+0000",
"datasourcetype": "kafka",
"status": 1,
"name": "山东省高速公路ETC通行数据",
"datatype": 1,
"crossprovince": 1,
"datalocation": "山东省",
"datafield": 3,
"company": "ShanDongHi-SpeedCO",
"datadescription": "山东省高速公路ETC通行数据",
"ownnode": 6,
"datadefinition": "字段名:WASTEID;字段名:EXTIME;字段名:EXSTATION;字段名:EXLANE;字段名:EXWASTESN;字段名:PAYCARD;字段名:USERID;",
"url": "/user/download?file=1f4593b161d89063d7fcb563d2a69a1d.166afbaede6&name=ShanDong-ETC-201604.json",
"resourceip": "192.168.3.19",
"kafkatopic": "ShanDong-ETC",
"dataurl": "192.168.3.19:8000"
},
{
"dataid": 9,
"time": "2018-10-26T09:39:18.000+0000",
"datasourcetype": "kafka",
"status": 1,
"name": "天津市公共交通数据",
"datatype": 1,
"crossprovince": 1,
"datalocation": "天津市",
"datafield": 0,
"company": "TianJinTransport",
"datadescription": "天津市公共交通数据",
"ownnode": 6,
"datadefinition": "字段名:ID_OROUTE;字段名:ROUTECODE;字段名:ROUTENAME;字段名:ROUTETYPE;字段名:RUNAREA;字段名:ROUTEMILE;字段名:HIGHSPEEDMILE;",
"url": "/user/download?file=a26c11463ff961a2a8a43416468d2e56.166afbe05ac&name=TianJin-route.json",
"resourceip": "192.168.3.19",
"kafkatopic": "TianJin-route",
"dataurl": "192.168.3.19:8000"
},
{
"dataid": 10,
"time": "2018-10-26T09:41:00.000+0000",
"datasourcetype": "kafka",
"status": 1,
"name": "北京市火车通行数据",
"datatype": 1,
"crossprovince": 1,
"datalocation": "北京市",
"datafield": 0,
"company": "BeijingTransports",
"datadescription": "北京市火车通行数据",
"ownnode": 6,
"datadefinition": "字段名:id;字段名:trainNo;字段名:date;字段名:costTime;字段名:depStation;字段名:arrStation;字段名:trainType;",
"url": "/user/download?file=e97bbbcbaf393a10d8b131f9434c5ec6.166afbf9250&name=TrainTicket-20180408.json",
"resourceip": "192.168.3.19",
"kafkatopic": "TrainTicket",
"dataurl": "192.168.3.19:8000"
},
{
"dataid": 11,
"time": "2018-12-03T12:53:24.000+0000",
"datasourcetype": "kafka",
"status": 1,
"name": "北京路况数据",
"datatype": 1,
"crossprovince": 1,
"datalocation": "北京",
"datafield": 0,
"company": "ZHangXingTong",
"datadescription": "北京路况数据",
"ownnode": 12,
"datadefinition": "字段名:xy;字段名:type;字段名:dtype;字段名:ctype;字段名:cdtype;字段名:desc;字段名:lseq;字段名:tcate;字段名:stime;字段名:etime;",
"url": "/user/download?file=b05b400672ec501fac9caa58ffb0657f.16774215abb&name=baseBeiJing.json",
"resourceip": "127.0.0.1",
"kafkatopic": "baseBeiJing",
"dataurl": "127.0.0.1:8000"
}]
// rowSelection object indicates the need for row selection
const rowSelection1 = {
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
},
getCheckboxProps: record => ({
disabled: record.name === 'Disabled User', // Column configuration not to be checked
name: record.name,
}),
};
const rowSelection2 = {
selectedRowKeys: this.state.selectedRowKeys2,
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
this.setState({ selectedRowKeys2: selectedRowKeys });
},
getCheckboxProps: record => ({
disabled: record.name === 'Disabled User', // Column configuration not to be checked
name: record.name,
}),
};
const rowSelection3 = {
hideDefaultSelections: true,
selectedRowKeys: this.state.selectedRowKeys3,
selections: [{
key: 'all-data',
text: 'Select All Data',
onSelect: (changableRowKeys) => {
this.setState({
selectedRowKeys3: changableRowKeys,
});
},
}, {
key: 'odd',
text: 'Select Odd Row',
onSelect: (changableRowKeys) => {
let newSelectedRowKeys = [];
newSelectedRowKeys = changableRowKeys.filter((key, index) => {
if (index % 2 !== 0) {
return false;
}
return true;
});
this.setState({ selectedRowKeys3: newSelectedRowKeys });
},
}, {
key: 'even',
text: 'Select Even Row',
onSelect: (changableRowKeys) => {
let newSelectedRowKeys = [];
newSelectedRowKeys = changableRowKeys.filter((key, index) => {
if (index % 2 !== 0) {
return true;
}
return false;
});
this.setState({ selectedRowKeys3: newSelectedRowKeys });
},
}],
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
this.setState({ selectedRowKeys3: selectedRowKeys });
},
getCheckboxProps: record => ({
disabled: record.name === 'Disabled User', // Column configuration not to be checked
name: record.name,
}),
};
return (
<div>
<div>
<h2>数据详情</h2>
<Table columns={columns1} dataSource={data1} />
<Table columns={columns} dataSource={this.state.list}/>
</div>
</div>
);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment