add table demo

Author: PanJiaChen

src/api/article.js

@@ -1,7 +1,7 @@
-import { tpFetch } from 'utils/fetch';
+import { fetch } from 'utils/fetch';
 
 export function getList() {
-  return tpFetch({
+  return fetch({
     url: '/article/list',
     method: 'get'
   });

src/api/article_table.js

@@ -0,0 +1,48 @@
+import { fetch } from 'utils/fetch';
+import { param } from 'utils';
+
+// export function calendarsList(query) {
+//   return fetch({
+//     url: '/finfo/calendars?' + param(query),
+//     method: 'get'
+//   });
+// }
+
+export function fetchList(query) {
+  return fetch({
+    url: '/article_table/list',
+    method: 'get'
+  });
+}
+
+
+export function calendarCreate(data) {
+  return fetch({
+    url: '/finfo/calendar/create',
+    method: 'post',
+    data
+  });
+}
+
+export function calendarDelete(id) {
+  return fetch({
+    url: '/finfo/calendar/delete',
+    method: 'post',
+    data: { id }
+  });
+}
+
+export function calendarUpdate(data) {
+  return fetch({
+    url: '/finfo/calendar/update',
+    method: 'post',
+    data
+  });
+}
+
+export function calcountriesList() {
+  return fetch({
+    url: '/finfo/calcountries',
+    method: 'get'
+  });
+}

src/assets/iconfont/iconfont.js

@@ -38,6 +38,12 @@
     '' +
     '</symbol>' +
     '' +
+    '<symbol id="icon-wujiaoxing" viewBox="0 0 1024 1024">' +
+    '' +
+    '<path d="M565.272827 34.627285l112.095872 237.542288c8.706637 18.321022 25.411424 31.051641 44.82285 33.996289l250.776598 38.081157c48.697387 7.411435 68.22505 70.046082 32.933559 105.979639l-181.494353 184.937155c-13.998147 14.230618-20.352386 34.815477-17.05903 54.93539l42.819161 261.127145c8.346858 50.695541-42.64204 89.451974-86.225039 65.51841l-224.307979-123.271141c-17.285968-9.525824-37.992596-9.525824-55.278564 0l-224.313514 123.271141c-43.582999 23.933565-94.571897-14.822869-86.219504-65.51841l42.813626-261.127145c3.321031-20.119914-3.088559-40.704772-17.086706-54.93539l-181.439002-184.937155c-35.285956-35.933557-15.819179-98.57374 32.933559-105.979639l250.748923-38.081157c19.350541-2.939112 36.083003-15.675267 44.75643-33.996289l112.123547-237.542288C480.497972-11.540583 543.509003-11.540583 565.272827 34.627285z"  ></path>' +
+    '' +
+    '</symbol>' +
+    '' +
     '<symbol id="icon-EXCEL" viewBox="0 0 1024 1024">' +
     '' +
     '<path d="M625.664 132.608V199.68h309.76v43.008h-309.76V312.32h309.76v43.008h-309.76v68.608h309.76v43.008h-309.76v68.608h309.76v43.008h-309.76v68.608h309.76v43.008h-309.76v68.096h309.76v43.008h-309.76v89.088H1024v-757.76h-398.336zM0 914.944L577.024 1024V0L0 109.056"  ></path>' +

src/mock/article_table.js

@@ -0,0 +1,45 @@
+import Mock from 'mockjs';
+
+
+const List = [];
+const count = 50;
+
+for (let i = 0; i < count; i++) {
+  List.push(Mock.mock({
+    id: '@increment',
+    timestamp: +Mock.Random.date('T'),
+    author: '@cname',
+    title: '@ctitle(10, 20)',
+    forecast: '@float(0, 100, 2, 2)',
+    importance: '@integer(1, 3)',
+    'calendar_type|1': ['FD', 'FE', 'BI', 'VN'],
+    'status|1': ['published', 'draft', 'deleted']
+  }));
+}
+
+export default {
+  getList: config =>
+    // let {page, sortWay, startTime, endTime, userName, age} = config.params;
+    // let mockUsers = _Users.filter(user => {
+    //   if (startTime && user.date < startTime) return false;
+    //   if (endTime && user.date > endTime) return false;
+    //   if (userName && user.name !== userName) return false;
+    //   if (age && user.age !== age) return false;
+    //   return true;
+    // });
+    // if (sortWay) {
+    //   let {order, prop} = sortWay;
+    //   mockUsers = mockUsers.sort((u1, u2) => order === 'ascending' ? u1[prop] - u2[prop] : u2[prop] - u1[prop]);
+    // }
+    // if (page === 0) page++;
+    // mockUsers = mockUsers.filter((u, index) => index < 20 * page && index >= 20 * (page - 1));
+     new Promise(resolve => {
+       setTimeout(() => {
+         resolve([200, {
+           total: List.length,
+           items: List
+         }]);
+       }, 100);
+     })
+
+};

src/mock/index.js

@@ -1,6 +1,7 @@
 import axios from 'axios';
 import Mock from 'mockjs';
 import MockAdapter from 'axios-mock-adapter';
+import article_tableAPI from './article_table'
 const mock = new MockAdapter(axios);
 
 const articleList = {
@@ -15,4 +16,10 @@ const articleList = {
 }
 const data = JSON.stringify(Mock.mock(articleList))
 mock.onGet('/article/list').reply(200, data);
+
+
+mock.onGet('/article_table/list').reply(article_tableAPI.getList);
+
+
+
 export default mock;

src/router/index.js

@@ -50,6 +50,7 @@ const Theme = resolve => require(['../views/theme/index'], resolve);
 
 /* example*/
 const DynamicTable = resolve => require(['../views/example/dynamictable'], resolve);
+const Table = resolve => require(['../views/example/table'], resolve);
 
 
 /* admin*/
@@ -168,7 +169,8 @@ export default new Router({
       name: '综合实例',
       icon: 'zonghe',
       children: [
-        { path: 'dynamictable', component: DynamicTable, name: '动态table' }
+        { path: 'dynamictable', component: DynamicTable, name: '动态table' },
+        { path: 'table', component: Table, name: '综合table' }
       ]
     },
     // {

src/utils/fetch.js

@@ -3,7 +3,7 @@ import { Message } from 'element-ui';
 import store from '../store';
 import router from '../router';
 
-export default function fetch(options) {
+export default function _fetch(options) {
   return new Promise((resolve, reject) => {
     const instance = axios.create({
       baseURL: process.env.BASE_API,
@@ -49,10 +49,10 @@ export default function fetch(options) {
   });
 }
 
-export function tpFetch(options) {
+export function fetch(options) {
   return new Promise((resolve, reject) => {
     const instance = axios.create({
-            // timeout: 2000,
+      timeout: 2000 // 超时
     });
     instance(options)
             .then(response => {