Yansen 5 years ago
parent
commit
cc32c92cbf

+ 2
- 2
src/components/ActionList/style.less View File

3
   display: inline-block;
3
   display: inline-block;
4
 
4
 
5
   span {
5
   span {
6
+    display: inline-block;
6
     & + span {
7
     & + span {
7
-      display: inline-block;
8
-      margin-left: 8px;
8
+      margin-left: 16px;
9
     }
9
     }
10
   }
10
   }
11
 }
11
 }

+ 19
- 24
src/components/EditIcon/index.jsx View File

6
         name: '启用',
6
         name: '启用',
7
         type: 'start',
7
         type: 'start',
8
         pos: 0,
8
         pos: 0,
9
-        color: '#ff925c'
9
+        color: '#ff925c',
10
     },
10
     },
11
     {
11
     {
12
         name: '发布',
12
         name: '发布',
13
         type: 'publish',
13
         type: 'publish',
14
         pos: -126,
14
         pos: -126,
15
-        color: '#ff925c'
15
+        color: '#ff925c',
16
     },
16
     },
17
     {
17
     {
18
         name: '上架',
18
         name: '上架',
19
         type: 'up',
19
         type: 'up',
20
         pos: -18,
20
         pos: -18,
21
-        color: '#ff925c'
21
+        color: '#ff925c',
22
     },
22
     },
23
     {
23
     {
24
         name: '编辑',
24
         name: '编辑',
25
         type: 'edit',
25
         type: 'edit',
26
         pos: -144,
26
         pos: -144,
27
-        color: '#ff925c'
27
+        color: '#ff925c',
28
     },
28
     },
29
     {
29
     {
30
         name: '取消',
30
         name: '取消',
31
         type: 'cancel',
31
         type: 'cancel',
32
         pos: -36,
32
         pos: -36,
33
-        color: '#FF4A4A'
33
+        color: '#FF4A4A',
34
     },
34
     },
35
     {
35
     {
36
         name: '停用',
36
         name: '停用',
37
         type: 'stop',
37
         type: 'stop',
38
         pos: -162,
38
         pos: -162,
39
-        color: '#FF4A4A'
39
+        color: '#FF4A4A',
40
     },
40
     },
41
     {
41
     {
42
         name: '结束',
42
         name: '结束',
43
         type: 'end',
43
         type: 'end',
44
         pos: -54,
44
         pos: -54,
45
-        color: '#FF4A4A'
45
+        color: '#FF4A4A',
46
     },
46
     },
47
     {
47
     {
48
         name: '删除',
48
         name: '删除',
49
         type: 'delete',
49
         type: 'delete',
50
         pos: -180,
50
         pos: -180,
51
-        color: '#FF4A4A'
51
+        color: '#FF4A4A',
52
     },
52
     },
53
     {
53
     {
54
         name: '查看',
54
         name: '查看',
55
         type: 'look',
55
         type: 'look',
56
         pos: -72,
56
         pos: -72,
57
-        color: '#FF4A4A'
57
+        color: '#FF4A4A',
58
     },
58
     },
59
     {
59
     {
60
         name: '添加',
60
         name: '添加',
61
         type: 'add',
61
         type: 'add',
62
         pos: -198,
62
         pos: -198,
63
-        color: '#FF4A4A'
63
+        color: '#FF4A4A',
64
     },
64
     },
65
     {
65
     {
66
         name: '前置',
66
         name: '前置',
67
         type: 'top',
67
         type: 'top',
68
         pos: -90,
68
         pos: -90,
69
-        color: '#FF4A4A'
69
+        color: '#FF4A4A',
70
     },
70
     },
71
     {
71
     {
72
         name: '下架',
72
         name: '下架',
73
         type: 'down',
73
         type: 'down',
74
         pos: -216,
74
         pos: -216,
75
-        color: '#FF4A4A'
75
+        color: '#FF4A4A',
76
     },
76
     },
77
     {
77
     {
78
         name: '记录',
78
         name: '记录',
79
         type: 'record',
79
         type: 'record',
80
         pos: -108,
80
         pos: -108,
81
-        color: '#FF4A4A'
81
+        color: '#FF4A4A',
82
     },
82
     },
83
-
84
 ]
83
 ]
85
 
84
 
86
-const EditIcon = ({ text, type, color, position }) => {
85
+function noop() {}
86
+
87
+const EditIcon = ({ text, type, color, position, onClick }) => {
87
 
88
 
88
     const icon = spriteInfo.filter(x => x.type === type)[0];
89
     const icon = spriteInfo.filter(x => x.type === type)[0];
89
     const color2 = color || icon.color;
90
     const color2 = color || icon.color;
90
     const position2 = position || icon.pos;
91
     const position2 = position || icon.pos;
91
 
92
 
92
-    const wrappedStyle = useMemo(() => ({ color: `${color2}`, display: 'flex', alignItems: 'center' }), [color]);
93
+    const wrappedStyle = useMemo(() => ({ color: `${color2}`, display: 'flex', alignItems: 'center', cursor: 'pointer' }), [color]);
93
     const iconStyle = useMemo(() => ({ display: 'inline-block', marginLeft: '6px', background: `url(${spriteImg}) 0 ${position2}px / 100% 1300% no-repeat`, width: '18px', height: '18px' }), [position])
94
     const iconStyle = useMemo(() => ({ display: 'inline-block', marginLeft: '6px', background: `url(${spriteImg}) 0 ${position2}px / 100% 1300% no-repeat`, width: '18px', height: '18px' }), [position])
94
 
95
 
95
-
96
-
97
     return (
96
     return (
98
-
99
-        <span style={wrappedStyle} >
97
+        <span style={wrappedStyle} onClick={onClick || noop} >
100
             {text}
98
             {text}
101
             <span style={iconStyle}></span>
99
             <span style={iconStyle}></span>
102
         </span>
100
         </span>
103
-
104
-
105
     )
101
     )
106
-
107
 };
102
 };
108
 
103
 
109
-export default EditIcon;
104
+export default EditIcon;

+ 7
- 7
src/pages/integralMall/GoodsList.jsx View File

3
 import router from 'umi/router';
3
 import router from 'umi/router';
4
 import AuthButton from '@/components/AuthButton';
4
 import AuthButton from '@/components/AuthButton';
5
 import withActions from '@/components/ActionList';
5
 import withActions from '@/components/ActionList';
6
+import EditIcon from '@/components/EditIcon';
6
 import BuildSelect from '../../components/SelectButton/BuildSelect'
7
 import BuildSelect from '../../components/SelectButton/BuildSelect'
7
 import apis from '../../services/apis';
8
 import apis from '../../services/apis';
8
 import request from '../../utils/request'
9
 import request from '../../utils/request'
136
       align: 'center',
137
       align: 'center',
137
       render: withActions((x, row) => [
138
       render: withActions((x, row) => [
138
           <AuthButton name="admin.taGoods.change.put" noRight={null}>
139
           <AuthButton name="admin.taGoods.change.put" noRight={null}>
139
-            <span style={{ color: '#EF273A', marginRight: '20px', cursor: 'pointer' }} onClick={changeGoodsStatus(row)}>
140
-              {row.status === 1 ? '下架' : '上架'}
141
-              <Icon type="shopping-cart" className={styles.shoppingCart} />
142
-            </span>
140
+            {
141
+              row.status === 1 ?
142
+              <EditIcon onClick={changeGoodsStatus(row)} type="down" text="下架" /> :
143
+              <EditIcon onClick={changeGoodsStatus(row)} type="up" text="上架" />
144
+            }
143
           </AuthButton>,
145
           </AuthButton>,
144
           <AuthButton name="admin.taGoods.put" noRight={null}>
146
           <AuthButton name="admin.taGoods.put" noRight={null}>
145
-            <span style={{ color: '#FF925C', cursor: 'pointer' }} onClick={toEditGoods(row.goodsId)}>
146
-              编辑<Icon type="form" className={styles.edit} />
147
-            </span>
147
+            <EditIcon onClick={toEditGoods(row.goodsId)} type="edit" text="编辑" />
148
           </AuthButton>,
148
           </AuthButton>,
149
         ]),
149
         ]),
150
     },
150
     },