提交 065f58148c1c122ef1dccd6071a669239992e5e8

作者 愚道
1 个父辈 058a02ba

improve search list projects block code

@@ -15,11 +15,7 @@ @@ -15,11 +15,7 @@
15 "antd": "^3.10.9", 15 "antd": "^3.10.9",
16 "classnames": "^2.2.6", 16 "classnames": "^2.2.6",
17 "dva": "^2.4.0", 17 "dva": "^2.4.0",
18 - "hash.js": "^1.1.5",  
19 - "mockjs": "*",  
20 "moment": "^2.22.2", 18 "moment": "^2.22.2",
21 - "nzh": "^1.0.3",  
22 - "qs": "^6.6.0",  
23 "react": "^16.6.3", 19 "react": "^16.6.3",
24 "umi-request": "^1.0.0" 20 "umi-request": "^1.0.0"
25 }, 21 },
1 -let sourceData;  
2 -  
3 const titles = [ 1 const titles = [
4 'Alipay', 2 'Alipay',
5 'Angular', 3 'Angular',
@@ -21,19 +19,6 @@ const avatars = [ @@ -21,19 +19,6 @@ const avatars = [
21 'https://gw.alipayobjects.com/zos/rmsportal/nxkuOJlFJuAUhzlMTCEe.png', // Webpack 19 'https://gw.alipayobjects.com/zos/rmsportal/nxkuOJlFJuAUhzlMTCEe.png', // Webpack
22 ]; 20 ];
23 21
24 -const avatars2 = [  
25 - 'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png',  
26 - 'https://gw.alipayobjects.com/zos/rmsportal/cnrhVkzwxjPwAaCfPbdc.png',  
27 - 'https://gw.alipayobjects.com/zos/rmsportal/gaOngJwsRYRaVAuXXcmB.png',  
28 - 'https://gw.alipayobjects.com/zos/rmsportal/ubnKSIfAJTxIgXOKlciN.png',  
29 - 'https://gw.alipayobjects.com/zos/rmsportal/WhxKECPNujWoWEFNdnJE.png',  
30 - 'https://gw.alipayobjects.com/zos/rmsportal/jZUIxmJycoymBprLOUbT.png',  
31 - 'https://gw.alipayobjects.com/zos/rmsportal/psOgztMplJMGpVEqfcgF.png',  
32 - 'https://gw.alipayobjects.com/zos/rmsportal/ZpBqSxLxVEXfcUNoPKrz.png',  
33 - 'https://gw.alipayobjects.com/zos/rmsportal/laiEnJdGHVOhJrUShBaJ.png',  
34 - 'https://gw.alipayobjects.com/zos/rmsportal/UrQsqscbKEpNuJcvBZBu.png',  
35 -];  
36 -  
37 const covers = [ 22 const covers = [
38 'https://gw.alipayobjects.com/zos/rmsportal/uMfMFlvUuceEyPpotzlq.png', 23 'https://gw.alipayobjects.com/zos/rmsportal/uMfMFlvUuceEyPpotzlq.png',
39 'https://gw.alipayobjects.com/zos/rmsportal/iZBVOIhGJiAnhplqjvZW.png', 24 'https://gw.alipayobjects.com/zos/rmsportal/iZBVOIhGJiAnhplqjvZW.png',
@@ -114,43 +99,9 @@ function getFakeList(req, res) { @@ -114,43 +99,9 @@ function getFakeList(req, res) {
114 const count = params.count * 1 || 20; 99 const count = params.count * 1 || 20;
115 100
116 const result = fakeList(count); 101 const result = fakeList(count);
117 - sourceData = result;  
118 - return res.json(result);  
119 -}  
120 -  
121 -function postFakeList(req, res) {  
122 - const { /* url = '', */ body } = req;  
123 - // const params = getUrlParams(url);  
124 - const { method, id } = body;  
125 - // const count = (params.count * 1) || 20;  
126 - let result = sourceData;  
127 -  
128 - switch (method) {  
129 - case 'delete':  
130 - result = result.filter(item => item.id !== id);  
131 - break;  
132 - case 'update':  
133 - result.forEach((item, i) => {  
134 - if (item.id === id) {  
135 - result[i] = Object.assign(item, body);  
136 - }  
137 - });  
138 - break;  
139 - case 'post':  
140 - result.unshift({  
141 - body,  
142 - id: `fake-list-${result.length}`,  
143 - createdAt: new Date().getTime(),  
144 - });  
145 - break;  
146 - default:  
147 - break;  
148 - }  
149 -  
150 return res.json(result); 102 return res.json(result);
151 } 103 }
152 104
153 export default { 105 export default {
154 - 'GET /api/fake_list': getFakeList,  
155 - 'POST /api/fake_list': postFakeList, 106 + 'GET /api/BLOCK_NAME/fake_list': getFakeList,
156 }; 107 };
@@ -4,8 +4,8 @@ import { connect } from 'dva'; @@ -4,8 +4,8 @@ import { connect } from 'dva';
4 import { Row, Col, Form, Card, Select, List } from 'antd'; 4 import { Row, Col, Form, Card, Select, List } from 'antd';
5 5
6 import { TagSelect, AvatarList, Ellipsis } from 'ant-design-pro'; 6 import { TagSelect, AvatarList, Ellipsis } from 'ant-design-pro';
7 -import StandardFormRow from '@/components/StandardFormRow';  
8 7
  8 +import StandardFormRow from './components/StandardFormRow';
9 import styles from './style.less'; 9 import styles from './style.less';
10 10
11 const { Option } = Select; 11 const { Option } = Select;
@@ -13,9 +13,9 @@ const FormItem = Form.Item; @@ -13,9 +13,9 @@ const FormItem = Form.Item;
13 13
14 /* eslint react/no-array-index-key: 0 */ 14 /* eslint react/no-array-index-key: 0 */
15 15
16 -@connect(({ list, loading }) => ({  
17 - list,  
18 - loading: loading.models.list, 16 +@connect(({ BLOCK_NAME_CAMEL_CASE, loading }) => ({
  17 + BLOCK_NAME_CAMEL_CASE,
  18 + loading: loading.models.BLOCK_NAME_CAMEL_CASE,
19 })) 19 }))
20 @Form.create({ 20 @Form.create({
21 onValuesChange({ dispatch }, changedValues, allValues) { 21 onValuesChange({ dispatch }, changedValues, allValues) {
@@ -24,7 +24,7 @@ const FormItem = Form.Item; @@ -24,7 +24,7 @@ const FormItem = Form.Item;
24 console.log(changedValues, allValues); 24 console.log(changedValues, allValues);
25 // 模拟查询表单生效 25 // 模拟查询表单生效
26 dispatch({ 26 dispatch({
27 - type: 'list/fetch', 27 + type: 'BLOCK_NAME_CAMEL_CASE/fetch',
28 payload: { 28 payload: {
29 count: 8, 29 count: 8,
30 }, 30 },
@@ -35,7 +35,7 @@ class CoverCardList extends PureComponent { @@ -35,7 +35,7 @@ class CoverCardList extends PureComponent {
35 componentDidMount() { 35 componentDidMount() {
36 const { dispatch } = this.props; 36 const { dispatch } = this.props;
37 dispatch({ 37 dispatch({
38 - type: 'list/fetch', 38 + type: 'BLOCK_NAME_CAMEL_CASE/fetch',
39 payload: { 39 payload: {
40 count: 8, 40 count: 8,
41 }, 41 },
@@ -44,7 +44,7 @@ class CoverCardList extends PureComponent { @@ -44,7 +44,7 @@ class CoverCardList extends PureComponent {
44 44
45 render() { 45 render() {
46 const { 46 const {
47 - list: { list = [] }, 47 + BLOCK_NAME_CAMEL_CASE: { list = [] },
48 loading, 48 loading,
49 form, 49 form,
50 } = this.props; 50 } = this.props;
1 -import { queryFakeList, removeFakeList, addFakeList, updateFakeList } from './service'; 1 +import { queryFakeList } from './service';
2 2
3 export default { 3 export default {
4 - namespace: 'list', 4 + namespace: 'BLOCK_NAME_CAMEL_CASE',
5 5
6 state: { 6 state: {
7 list: [], 7 list: [],
@@ -15,26 +15,6 @@ export default { @@ -15,26 +15,6 @@ export default {
15 payload: Array.isArray(response) ? response : [], 15 payload: Array.isArray(response) ? response : [],
16 }); 16 });
17 }, 17 },
18 - *appendFetch({ payload }, { call, put }) {  
19 - const response = yield call(queryFakeList, payload);  
20 - yield put({  
21 - type: 'appendList',  
22 - payload: Array.isArray(response) ? response : [],  
23 - });  
24 - },  
25 - *submit({ payload }, { call, put }) {  
26 - let callback;  
27 - if (payload.id) {  
28 - callback = Object.keys(payload).length === 1 ? removeFakeList : updateFakeList;  
29 - } else {  
30 - callback = addFakeList;  
31 - }  
32 - const response = yield call(callback, payload); // post  
33 - yield put({  
34 - type: 'queryList',  
35 - payload: response,  
36 - });  
37 - },  
38 }, 18 },
39 19
40 reducers: { 20 reducers: {
@@ -44,11 +24,5 @@ export default { @@ -44,11 +24,5 @@ export default {
44 list: action.payload, 24 list: action.payload,
45 }; 25 };
46 }, 26 },
47 - appendList(state, action) {  
48 - return {  
49 - ...state,  
50 - list: state.list.concat(action.payload),  
51 - };  
52 - },  
53 }, 27 },
54 }; 28 };
1 import request from 'umi-request'; 1 import request from 'umi-request';
2 2
3 export async function queryFakeList(params) { 3 export async function queryFakeList(params) {
4 - return request(`/api/fake_list`, { 4 + return request(`/api/BLOCK_NAME/fake_list`, {
5 params, 5 params,
6 }); 6 });
7 } 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 -}  
1 @import '~antd/lib/style/themes/default.less'; 1 @import '~antd/lib/style/themes/default.less';
2 -@import '~@/utils/utils.less'; 2 +@import './utils/utils.less';
3 3
4 .coverCardList { 4 .coverCardList {
5 margin-bottom: -24px; 5 margin-bottom: -24px;
  1 +.textOverflow() {
  2 + overflow: hidden;
  3 + text-overflow: ellipsis;
  4 + word-break: break-all;
  5 + white-space: nowrap;
  6 +}
  7 +
  8 +.textOverflowMulti(@line: 3, @bg: #fff) {
  9 + overflow: hidden;
  10 + position: relative;
  11 + line-height: 1.5em;
  12 + max-height: @line * 1.5em;
  13 + text-align: justify;
  14 + margin-right: -1em;
  15 + padding-right: 1em;
  16 + &:before {
  17 + background: @bg;
  18 + content: '...';
  19 + padding: 0 1px;
  20 + position: absolute;
  21 + right: 14px;
  22 + bottom: 0;
  23 + }
  24 + &:after {
  25 + background: white;
  26 + content: '';
  27 + margin-top: 0.2em;
  28 + position: absolute;
  29 + right: 14px;
  30 + width: 1em;
  31 + height: 1em;
  32 + }
  33 +}
  34 +
  35 +// mixins for clearfix
  36 +// ------------------------
  37 +.clearfix() {
  38 + zoom: 1;
  39 + &:before,
  40 + &:after {
  41 + content: ' ';
  42 + display: table;
  43 + }
  44 + &:after {
  45 + clear: both;
  46 + visibility: hidden;
  47 + font-size: 0;
  48 + height: 0;
  49 + }
  50 +}
注册登录 后发表评论