提交 552f1ac81e1be6401ab96d0bc39d3e838661e778

作者 愚道
1 个父辈 74c5c8ce

refact: ant design pro searchlistproject

1 1 export default {
2 2 plugins: [
3   - ['umi-plugin-block-dev', {}],
  3 + ['umi-plugin-block-dev', {
  4 + layout: 'ant-design-pro',
  5 + }],
4 6 ['umi-plugin-react', {
5 7 dva: true,
6 8 locale: true,
... ...
... ... @@ -11,16 +11,17 @@
11 11 "url": "https://github.com/umijs/umi-blocks/searchlistprojects"
12 12 },
13 13 "dependencies": {
14   - "react": "^16.6.3",
15   - "moment": "^2.22.2",
16   - "dva": "^2.4.0",
17   - "antd": "^3.10.9",
18 14 "ant-design-pro": "^2.1.1",
  15 + "antd": "^3.10.9",
19 16 "classnames": "^2.2.6",
20   - "qs": "^6.6.0",
  17 + "dva": "^2.4.0",
21 18 "hash.js": "^1.1.5",
  19 + "mockjs": "*",
  20 + "moment": "^2.22.2",
22 21 "nzh": "^1.0.3",
23   - "mockjs": "*"
  22 + "qs": "^6.6.0",
  23 + "react": "^16.6.3",
  24 + "umi-request": "^1.0.0"
24 25 },
25 26 "devDependencies": {
26 27 "umi": "^2.3.0-beta.1",
... ...
1   -import mockjs from 'mockjs';
  1 +let sourceData;
2 2
3 3 const titles = [
4 4 'Alipay',
... ... @@ -47,7 +47,6 @@ const desc = [
47 47 '城镇中有那么多的酒馆,她却偏偏走进了我的酒馆',
48 48 '那时候我只会想自己想要什么,从不想自己拥有什么',
49 49 ];
50   -
51 50 const user = [
52 51 '付小小',
53 52 '曲丽丽',
... ... @@ -109,8 +108,6 @@ function fakeList(count) {
109 108 return list;
110 109 }
111 110
112   -let sourceData;
113   -
114 111 function getFakeList(req, res) {
115 112 const params = req.query;
116 113
... ... @@ -153,184 +150,7 @@ function postFakeList(req, res) {
153 150 return res.json(result);
154 151 }
155 152
156   -const getNotice = [
157   - {
158   - id: 'xxx1',
159   - title: titles[0],
160   - logo: avatars[0],
161   - description: '那是一种内在的东西,他们到达不了,也无法触及的',
162   - updatedAt: new Date(),
163   - member: '科学搬砖组',
164   - href: '',
165   - memberLink: '',
166   - },
167   - {
168   - id: 'xxx2',
169   - title: titles[1],
170   - logo: avatars[1],
171   - description: '希望是一个好东西,也许是最好的,好东西是不会消亡的',
172   - updatedAt: new Date('2017-07-24'),
173   - member: '全组都是吴彦祖',
174   - href: '',
175   - memberLink: '',
176   - },
177   - {
178   - id: 'xxx3',
179   - title: titles[2],
180   - logo: avatars[2],
181   - description: '城镇中有那么多的酒馆,她却偏偏走进了我的酒馆',
182   - updatedAt: new Date(),
183   - member: '中二少女团',
184   - href: '',
185   - memberLink: '',
186   - },
187   - {
188   - id: 'xxx4',
189   - title: titles[3],
190   - logo: avatars[3],
191   - description: '那时候我只会想自己想要什么,从不想自己拥有什么',
192   - updatedAt: new Date('2017-07-23'),
193   - member: '程序员日常',
194   - href: '',
195   - memberLink: '',
196   - },
197   - {
198   - id: 'xxx5',
199   - title: titles[4],
200   - logo: avatars[4],
201   - description: '凛冬将至',
202   - updatedAt: new Date('2017-07-23'),
203   - member: '高逼格设计天团',
204   - href: '',
205   - memberLink: '',
206   - },
207   - {
208   - id: 'xxx6',
209   - title: titles[5],
210   - logo: avatars[5],
211   - description: '生命就像一盒巧克力,结果往往出人意料',
212   - updatedAt: new Date('2017-07-23'),
213   - member: '骗你来学计算机',
214   - href: '',
215   - memberLink: '',
216   - },
217   -];
218   -
219   -const getActivities = [
220   - {
221   - id: 'trend-1',
222   - updatedAt: new Date(),
223   - user: {
224   - name: '曲丽丽',
225   - avatar: avatars2[0],
226   - },
227   - group: {
228   - name: '高逼格设计天团',
229   - link: 'http://github.com/',
230   - },
231   - project: {
232   - name: '六月迭代',
233   - link: 'http://github.com/',
234   - },
235   - template: '在 @{group} 新建项目 @{project}',
236   - },
237   - {
238   - id: 'trend-2',
239   - updatedAt: new Date(),
240   - user: {
241   - name: '付小小',
242   - avatar: avatars2[1],
243   - },
244   - group: {
245   - name: '高逼格设计天团',
246   - link: 'http://github.com/',
247   - },
248   - project: {
249   - name: '六月迭代',
250   - link: 'http://github.com/',
251   - },
252   - template: '在 @{group} 新建项目 @{project}',
253   - },
254   - {
255   - id: 'trend-3',
256   - updatedAt: new Date(),
257   - user: {
258   - name: '林东东',
259   - avatar: avatars2[2],
260   - },
261   - group: {
262   - name: '中二少女团',
263   - link: 'http://github.com/',
264   - },
265   - project: {
266   - name: '六月迭代',
267   - link: 'http://github.com/',
268   - },
269   - template: '在 @{group} 新建项目 @{project}',
270   - },
271   - {
272   - id: 'trend-4',
273   - updatedAt: new Date(),
274   - user: {
275   - name: '周星星',
276   - avatar: avatars2[4],
277   - },
278   - project: {
279   - name: '5 月日常迭代',
280   - link: 'http://github.com/',
281   - },
282   - template: '将 @{project} 更新至已发布状态',
283   - },
284   - {
285   - id: 'trend-5',
286   - updatedAt: new Date(),
287   - user: {
288   - name: '朱偏右',
289   - avatar: avatars2[3],
290   - },
291   - project: {
292   - name: '工程效能',
293   - link: 'http://github.com/',
294   - },
295   - comment: {
296   - name: '留言',
297   - link: 'http://github.com/',
298   - },
299   - template: '在 @{project} 发布了 @{comment}',
300   - },
301   - {
302   - id: 'trend-6',
303   - updatedAt: new Date(),
304   - user: {
305   - name: '乐哥',
306   - avatar: avatars2[5],
307   - },
308   - group: {
309   - name: '程序员日常',
310   - link: 'http://github.com/',
311   - },
312   - project: {
313   - name: '品牌迭代',
314   - link: 'http://github.com/',
315   - },
316   - template: '在 @{group} 新建项目 @{project}',
317   - },
318   -];
319   -
320   -function getFakeCaptcha(req, res) {
321   - return res.json('captcha-xxx');
322   -}
323   -
324 153 export default {
325   - 'GET /api/project/notice': getNotice,
326   - 'GET /api/activities': getActivities,
327   - 'POST /api/forms': (req, res) => {
328   - res.send({ message: 'Ok' });
329   - },
330   - 'GET /api/tags': mockjs.mock({
331   - 'list|100': [{ name: '@city', 'value|1-100': 150, 'type|0-2': 1 }],
332   - }),
333 154 'GET /api/fake_list': getFakeList,
334 155 'POST /api/fake_list': postFakeList,
335   - 'GET /api/captcha': getFakeCaptcha,
336 156 };
... ...
1   -module.exports = {
2   - navTheme: 'dark', // theme for nav menu
3   - primaryColor: '#1890FF', // primary color of ant design
4   - layout: 'sidemenu', // nav menu position: sidemenu or topmenu
5   - contentWidth: 'Fluid', // layout of content: Fluid or Fixed, only works when layout is topmenu
6   - fixedHeader: false, // sticky header
7   - autoHideHeader: false, // auto hide header
8   - fixSiderbar: false, // sticky siderbar
9   -};
... ... @@ -3,12 +3,10 @@ import moment from 'moment';
3 3 import { connect } from 'dva';
4 4 import { Row, Col, Form, Card, Select, List } from 'antd';
5 5
6   -import TagSelect from 'ant-design-pro/lib/TagSelect';
7   -import AvatarList from 'ant-design-pro/lib/AvatarList';
8   -import Ellipsis from 'ant-design-pro/lib/Ellipsis';
  6 +import { TagSelect, AvatarList, Ellipsis } from 'ant-design-pro';
9 7 import StandardFormRow from '@/components/StandardFormRow';
10 8
11   -import styles from './Projects.less';
  9 +import styles from './style.less';
12 10
13 11 const { Option } = Select;
14 12 const FormItem = Form.Item;
... ...
1   -import { queryFakeList, removeFakeList, addFakeList, updateFakeList } from '@/services/api';
  1 +import { queryFakeList, removeFakeList, addFakeList, updateFakeList } from './service';
2 2
3 3 export default {
4 4 namespace: 'list',
... ...
1   -import { queryRule, removeRule, addRule, updateRule } from '@/services/api';
2   -
3   -export default {
4   - namespace: 'rule',
5   -
6   - state: {
7   - data: {
8   - list: [],
9   - pagination: {},
10   - },
11   - },
12   -
13   - effects: {
14   - *fetch({ payload }, { call, put }) {
15   - const response = yield call(queryRule, payload);
16   - yield put({
17   - type: 'save',
18   - payload: response,
19   - });
20   - },
21   - *add({ payload, callback }, { call, put }) {
22   - const response = yield call(addRule, payload);
23   - yield put({
24   - type: 'save',
25   - payload: response,
26   - });
27   - if (callback) callback();
28   - },
29   - *remove({ payload, callback }, { call, put }) {
30   - const response = yield call(removeRule, payload);
31   - yield put({
32   - type: 'save',
33   - payload: response,
34   - });
35   - if (callback) callback();
36   - },
37   - *update({ payload, callback }, { call, put }) {
38   - const response = yield call(updateRule, payload);
39   - yield put({
40   - type: 'save',
41   - payload: response,
42   - });
43   - if (callback) callback();
44   - },
45   - },
46   -
47   - reducers: {
48   - save(state, action) {
49   - return {
50   - ...state,
51   - data: action.payload,
52   - };
53   - },
54   - },
55   -};
1   -import { message } from 'antd';
2   -import defaultSettings from '../defaultSettings';
3   -
4   -let lessNodesAppended;
5   -const updateTheme = primaryColor => {
6   - // Don't compile less in production!
7   - if (APP_TYPE !== 'site') {
8   - return;
9   - }
10   - // Determine if the component is remounted
11   - if (!primaryColor) {
12   - return;
13   - }
14   - const hideMessage = message.loading('正在编译主题!', 0);
15   - function buildIt() {
16   - if (!window.less) {
17   - return;
18   - }
19   - setTimeout(() => {
20   - window.less
21   - .modifyVars({
22   - '@primary-color': primaryColor,
23   - })
24   - .then(() => {
25   - hideMessage();
26   - })
27   - .catch(() => {
28   - message.error('Failed to update theme');
29   - hideMessage();
30   - });
31   - }, 200);
32   - }
33   - if (!lessNodesAppended) {
34   - // insert less.js and color.less
35   - const lessStyleNode = document.createElement('link');
36   - const lessConfigNode = document.createElement('script');
37   - const lessScriptNode = document.createElement('script');
38   - lessStyleNode.setAttribute('rel', 'stylesheet/less');
39   - lessStyleNode.setAttribute('href', '/color.less');
40   - lessConfigNode.innerHTML = `
41   - window.less = {
42   - async: true,
43   - env: 'production',
44   - javascriptEnabled: true
45   - };
46   - `;
47   - lessScriptNode.src = 'https://gw.alipayobjects.com/os/lib/less.js/3.8.1/less.min.js';
48   - lessScriptNode.async = true;
49   - lessScriptNode.onload = () => {
50   - buildIt();
51   - lessScriptNode.onload = null;
52   - };
53   - document.body.appendChild(lessStyleNode);
54   - document.body.appendChild(lessConfigNode);
55   - document.body.appendChild(lessScriptNode);
56   - lessNodesAppended = true;
57   - } else {
58   - buildIt();
59   - }
60   -};
61   -
62   -const updateColorWeak = colorWeak => {
63   - document.body.className = colorWeak ? 'colorWeak' : '';
64   -};
65   -
66   -export default {
67   - namespace: 'setting',
68   - state: defaultSettings,
69   - reducers: {
70   - getSetting(state) {
71   - const setting = {};
72   - const urlParams = new URL(window.location.href);
73   - Object.keys(state).forEach(key => {
74   - if (urlParams.searchParams.has(key)) {
75   - const value = urlParams.searchParams.get(key);
76   - setting[key] = value === '1' ? true : value;
77   - }
78   - });
79   - const { primaryColor, colorWeak } = setting;
80   - if (state.primaryColor !== primaryColor) {
81   - updateTheme(primaryColor);
82   - }
83   - updateColorWeak(colorWeak);
84   - return {
85   - ...state,
86   - ...setting,
87   - };
88   - },
89   - changeSetting(state, { payload }) {
90   - const urlParams = new URL(window.location.href);
91   - Object.keys(defaultSettings).forEach(key => {
92   - if (urlParams.searchParams.has(key)) {
93   - urlParams.searchParams.delete(key);
94   - }
95   - });
96   - Object.keys(payload).forEach(key => {
97   - if (key === 'collapse') {
98   - return;
99   - }
100   - let value = payload[key];
101   - if (value === true) {
102   - value = 1;
103   - }
104   - if (defaultSettings[key] !== value) {
105   - urlParams.searchParams.set(key, value);
106   - }
107   - });
108   - const { primaryColor, colorWeak, contentWidth } = payload;
109   - if (state.primaryColor !== primaryColor) {
110   - updateTheme(primaryColor);
111   - }
112   - if (state.contentWidth !== contentWidth && window.dispatchEvent) {
113   - window.dispatchEvent(new Event('resize'));
114   - }
115   - updateColorWeak(colorWeak);
116   - window.history.replaceState(null, 'setting', urlParams.href);
117   - return {
118   - ...state,
119   - ...payload,
120   - };
121   - },
122   - },
123   -};
  1 +import request from 'umi-request';
  2 +
  3 +export async function queryFakeList(params) {
  4 + return request(`/api/fake_list`, {
  5 + params,
  6 + });
  7 +}
  8 +
  9 +export async function removeFakeList(params) {
  10 + const { count = 5, ...restParams } = params;
  11 + return request(`/api/fake_list?count=${count}`, {
  12 + method: 'POST',
  13 + body: {
  14 + ...restParams,
  15 + method: 'delete',
  16 + },
  17 + });
  18 +}
  19 +
  20 +export async function addFakeList(params) {
  21 + const { count = 5, ...restParams } = params;
  22 + return request(`/api/fake_list?count=${count}`, {
  23 + method: 'POST',
  24 + body: {
  25 + ...restParams,
  26 + method: 'post',
  27 + },
  28 + });
  29 +}
  30 +
  31 +export async function updateFakeList(params) {
  32 + const { count = 5, ...restParams } = params;
  33 + return request(`/api/fake_list?count=${count}`, {
  34 + method: 'POST',
  35 + body: {
  36 + ...restParams,
  37 + method: 'update',
  38 + },
  39 + });
  40 +}
... ...
注册登录 后发表评论