@gm-mobile/react 1.1.5 → 1.1.6-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gm-mobile/react",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.6-alpha.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "liyatang <liyatang@qq.com>",
|
|
6
6
|
"homepage": "https://github.com/gmfe/gm-mobile#readme",
|
|
@@ -27,8 +27,8 @@
|
|
|
27
27
|
"dependencies": {
|
|
28
28
|
"@gm-common/number": "^2.2.9",
|
|
29
29
|
"@gm-common/tool": "^2.2.9",
|
|
30
|
-
"@gm-mobile/locales": "^1.1.
|
|
30
|
+
"@gm-mobile/locales": "^1.1.6-alpha.0",
|
|
31
31
|
"classnames": "^2.2.6"
|
|
32
32
|
},
|
|
33
|
-
"gitHead": "
|
|
33
|
+
"gitHead": "3d35534dc4d2703c7da0d187471e4e2e52ac9f21"
|
|
34
34
|
}
|
|
@@ -1,14 +1,13 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
import classNames from 'classnames'
|
|
3
|
-
import PropTypes from 'prop-types'
|
|
4
|
-
import _ from 'lodash'
|
|
5
1
|
import Big from 'big.js'
|
|
6
|
-
|
|
2
|
+
import classNames from 'classnames'
|
|
7
3
|
import { t } from 'gm-i18n'
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
4
|
+
import _ from 'lodash'
|
|
5
|
+
import PropTypes from 'prop-types'
|
|
6
|
+
import React from 'react'
|
|
11
7
|
import SVGMinus from '../../../svg/minus.svg'
|
|
8
|
+
import SVGPlus from '../../../svg/plus.svg'
|
|
9
|
+
import { KeyboardWrap } from '../keyboard'
|
|
10
|
+
import Toast from '../toast'
|
|
12
11
|
|
|
13
12
|
const Counter = ({
|
|
14
13
|
value,
|
|
@@ -37,7 +36,11 @@ const Counter = ({
|
|
|
37
36
|
const checkValue = (value, type) => {
|
|
38
37
|
if (max && value > max) {
|
|
39
38
|
Toast.tip({
|
|
40
|
-
children:
|
|
39
|
+
children: (
|
|
40
|
+
<div className='m-number-keyboard-msg'>
|
|
41
|
+
{t('下单数量超出当前库存')}
|
|
42
|
+
</div>
|
|
43
|
+
),
|
|
41
44
|
})
|
|
42
45
|
return max
|
|
43
46
|
}
|
|
@@ -64,12 +67,16 @@ const Counter = ({
|
|
|
64
67
|
return
|
|
65
68
|
}
|
|
66
69
|
|
|
67
|
-
if (plusDisabled){
|
|
70
|
+
if (plusDisabled) {
|
|
68
71
|
Toast.tip({
|
|
69
|
-
children:
|
|
72
|
+
children: (
|
|
73
|
+
<div className='m-number-keyboard-msg'>
|
|
74
|
+
{t('下单数量超出当前库存')}
|
|
75
|
+
</div>
|
|
76
|
+
),
|
|
70
77
|
})
|
|
71
78
|
return
|
|
72
|
-
}
|
|
79
|
+
}
|
|
73
80
|
|
|
74
81
|
// 如果存在最小值，以最小值开始相加
|
|
75
82
|
v = v + 1
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import Picker from './component/picker'
|
|
2
|
-
import ConfirmPicker from './confirm_picker'
|
|
3
1
|
import CouplingPicker from './component/coupling_picker'
|
|
2
|
+
import Picker from './component/picker'
|
|
4
3
|
import ConfirmCouplingPicker from './confirm_coupling_picker'
|
|
4
|
+
import ConfirmPicker from './confirm_picker'
|
|
5
|
+
import SearchPicker from './search_picker'
|
|
5
6
|
import SelectPicker from './select_picker'
|
|
6
7
|
|
|
7
8
|
export {
|
|
@@ -10,4 +11,5 @@ export {
|
|
|
10
11
|
ConfirmPicker,
|
|
11
12
|
ConfirmCouplingPicker,
|
|
12
13
|
SelectPicker,
|
|
14
|
+
SearchPicker,
|
|
13
15
|
}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import { getLocale } from '@gm-mobile/locales'
|
|
2
|
+
import _ from 'lodash'
|
|
3
|
+
import PropTypes from 'prop-types'
|
|
4
|
+
import React from 'react'
|
|
5
|
+
import Button from '../button'
|
|
6
|
+
import { Search } from '../search'
|
|
7
|
+
import Picker from './component/picker'
|
|
8
|
+
import PickerStatics from './statics'
|
|
9
|
+
|
|
10
|
+
/**
|
|
11
|
+
* 带搜索功能的选择器，仅支持单栏和单选
|
|
12
|
+
*/
|
|
13
|
+
class SearchPicker extends React.Component {
|
|
14
|
+
constructor(props) {
|
|
15
|
+
super(props)
|
|
16
|
+
const { data, value } = props
|
|
17
|
+
const selectedItem = _.find(data, (item) => item.value === value)
|
|
18
|
+
this.state = {
|
|
19
|
+
datas: data.length ? [data] : [],
|
|
20
|
+
values: selectedItem ? [selectedItem.value] : [data[0].value],
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
handleSearch = (value) => {
|
|
25
|
+
const searchData = this.props.data.filter(
|
|
26
|
+
(item) => item.text.indexOf(value) > -1
|
|
27
|
+
)
|
|
28
|
+
this.setState({
|
|
29
|
+
datas: searchData.length ? [searchData] : [],
|
|
30
|
+
values: [searchData[0]] || [],
|
|
31
|
+
})
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
handleChange = (values) => {
|
|
35
|
+
this.setState({
|
|
36
|
+
values,
|
|
37
|
+
})
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
handleConfirm = (e) => {
|
|
41
|
+
this.props.onConfirm(this.state.values)
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
render() {
|
|
45
|
+
const { headers, placeholder, searchBtnText, renderOption } = this.props
|
|
46
|
+
const { datas, values } = this.state
|
|
47
|
+
|
|
48
|
+
return (
|
|
49
|
+
<div>
|
|
50
|
+
<Search
|
|
51
|
+
placeholder={placeholder}
|
|
52
|
+
searchText={searchBtnText}
|
|
53
|
+
onChange={this.handleSearch}
|
|
54
|
+
/>
|
|
55
|
+
<Picker
|
|
56
|
+
datas={datas}
|
|
57
|
+
values={values}
|
|
58
|
+
headers={headers}
|
|
59
|
+
renderOption={renderOption}
|
|
60
|
+
onChange={this.handleChange}
|
|
61
|
+
/>
|
|
62
|
+
<div className='m-margin-15'>
|
|
63
|
+
<Button
|
|
64
|
+
type='primary'
|
|
65
|
+
onClick={this.handleConfirm}
|
|
66
|
+
style={{ width: '100%' }}
|
|
67
|
+
>
|
|
68
|
+
{getLocale('确定')}
|
|
69
|
+
</Button>
|
|
70
|
+
</div>
|
|
71
|
+
</div>
|
|
72
|
+
)
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
SearchPicker.render = (props) => {
|
|
77
|
+
return new Promise((resolve, reject) => {
|
|
78
|
+
PickerStatics.render({
|
|
79
|
+
title: props.title,
|
|
80
|
+
bottom: true,
|
|
81
|
+
onHide: () => {
|
|
82
|
+
setTimeout(() => {
|
|
83
|
+
reject(new Error())
|
|
84
|
+
}, 50)
|
|
85
|
+
},
|
|
86
|
+
children: (
|
|
87
|
+
<SearchPicker
|
|
88
|
+
{...props}
|
|
89
|
+
onConfirm={(values) => {
|
|
90
|
+
PickerStatics.hide()
|
|
91
|
+
setTimeout(() => {
|
|
92
|
+
resolve(values)
|
|
93
|
+
}, 50)
|
|
94
|
+
}}
|
|
95
|
+
onCancel={() => {
|
|
96
|
+
PickerStatics.hide()
|
|
97
|
+
setTimeout(() => {
|
|
98
|
+
reject(new Error())
|
|
99
|
+
}, 50)
|
|
100
|
+
}}
|
|
101
|
+
/>
|
|
102
|
+
),
|
|
103
|
+
})
|
|
104
|
+
})
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
SearchPicker.hide = () => {
|
|
108
|
+
PickerStatics.hide()
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
SearchPicker.propTypes = {
|
|
112
|
+
title: PropTypes.string,
|
|
113
|
+
data: PropTypes.array.isRequired,
|
|
114
|
+
/** 每列数据title, 格式为 [header, ...] */
|
|
115
|
+
headers: PropTypes.array,
|
|
116
|
+
placeholder: PropTypes.string,
|
|
117
|
+
searchBtnText: PropTypes.string,
|
|
118
|
+
value: PropTypes.array.isRequired,
|
|
119
|
+
renderOption: PropTypes.func,
|
|
120
|
+
onConfirm: PropTypes.func.isRequired,
|
|
121
|
+
onCancel: PropTypes.func.isRequired,
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
SearchPicker.defaultProps = {
|
|
125
|
+
onConfirm: _.noop,
|
|
126
|
+
onCancel: _.noop,
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
export default SearchPicker
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
+
import { observable } from 'mobx'
|
|
1
2
|
import React from 'react'
|
|
3
|
+
import { SearchPicker } from '.'
|
|
2
4
|
import Picker from './component/picker'
|
|
3
|
-
import { observable } from 'mobx'
|
|
4
|
-
import ConfirmPicker from './confirm_picker'
|
|
5
5
|
import ConfirmCouplingPicker from './confirm_coupling_picker'
|
|
6
|
+
import ConfirmPicker from './confirm_picker'
|
|
6
7
|
import SelectPicker from './select_picker'
|
|
7
8
|
|
|
8
9
|
const datas = [
|
|
@@ -256,6 +257,26 @@ export const selectPicker = () => {
|
|
|
256
257
|
return <button onClick={handleClick}>select picker</button>
|
|
257
258
|
}
|
|
258
259
|
|
|
260
|
+
export const searchPicker = () => {
|
|
261
|
+
const handleClick = () => {
|
|
262
|
+
SearchPicker.render({
|
|
263
|
+
placeholder: '请输入地名',
|
|
264
|
+
data: selectStore.data.slice(),
|
|
265
|
+
value: selectStore.value,
|
|
266
|
+
}).then(
|
|
267
|
+
(value) => {
|
|
268
|
+
console.log('resolve', value)
|
|
269
|
+
selectStore.setValue(value)
|
|
270
|
+
},
|
|
271
|
+
() => {
|
|
272
|
+
console.log('reject')
|
|
273
|
+
}
|
|
274
|
+
)
|
|
275
|
+
}
|
|
276
|
+
|
|
277
|
+
return <button onClick={handleClick}>search picker</button>
|
|
278
|
+
}
|
|
279
|
+
|
|
259
280
|
export default {
|
|
260
281
|
title: '表单/Picker',
|
|
261
282
|
}
|
package/src/index.js
CHANGED
|
@@ -1,67 +1,64 @@
|
|
|
1
1
|
// 表单
|
|
2
|
+
import ActionSheet from './component/action_sheet'
|
|
3
|
+
import Badge from './component/badge'
|
|
2
4
|
import { Button, ButtonTime } from './component/button'
|
|
5
|
+
import { Calendar, MultipleCalendar, RangeCalendar } from './component/calendar'
|
|
6
|
+
import Canvas from './component/canvas'
|
|
7
|
+
import { Cell, CellForm, Cells, CellsForm } from './component/cell'
|
|
3
8
|
import Checkbox from './component/checkbox'
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
|
|
8
|
-
import
|
|
9
|
-
import { Cells, Cell, CellForm, CellsForm } from './component/cell'
|
|
10
|
-
import {
|
|
11
|
-
Picker,
|
|
12
|
-
CouplingPicker,
|
|
13
|
-
ConfirmPicker,
|
|
14
|
-
ConfirmCouplingPicker,
|
|
15
|
-
SelectPicker,
|
|
16
|
-
} from './component/picker'
|
|
17
|
-
import { Keyboard, KeyboardWrap } from './component/keyboard'
|
|
18
|
-
import { Calendar, RangeCalendar, MultipleCalendar } from './component/calendar'
|
|
19
|
-
import ScrollIntoView from './component/scroll_into_view'
|
|
20
|
-
|
|
9
|
+
import Counter from './component/counter'
|
|
10
|
+
import Dialog from './component/dialog'
|
|
11
|
+
import Divider from './component/divider'
|
|
12
|
+
// 布局
|
|
13
|
+
import Flex from './component/flex'
|
|
21
14
|
// 基础
|
|
22
15
|
import FlipNumber from './component/flip_number'
|
|
16
|
+
import Header from './component/header'
|
|
23
17
|
import Image from './component/image'
|
|
18
|
+
import InnerLayer from './component/inner_layer'
|
|
19
|
+
import { BorderInput, Input, InputPassword } from './component/input'
|
|
20
|
+
import { Keyboard, KeyboardWrap } from './component/keyboard'
|
|
24
21
|
import Label from './component/label'
|
|
22
|
+
// 浮层
|
|
23
|
+
import LayoutRoot from './component/layout_root'
|
|
24
|
+
import { Lazy, LazyList } from './component/lazy'
|
|
25
|
+
// 其他
|
|
26
|
+
import { LetterIndex, LetterIndexMultiple } from './component/letter_index'
|
|
27
|
+
import List from './component/list'
|
|
25
28
|
import Loading from './component/loading'
|
|
26
|
-
import
|
|
27
|
-
import
|
|
28
|
-
import
|
|
29
|
-
import TagWrap from './component/tag'
|
|
30
|
-
import ProgressBar from './component/progress_bar'
|
|
31
|
-
|
|
32
|
-
// 布局
|
|
33
|
-
import Flex from './component/flex'
|
|
34
|
-
import Divider from './component/divider'
|
|
29
|
+
import Mask from './component/mask'
|
|
30
|
+
import Nav from './component/nav'
|
|
31
|
+
import NProgress from './component/nprogress'
|
|
35
32
|
import Page from './component/page'
|
|
36
|
-
import Header from './component/header'
|
|
37
|
-
import { Tabbar, FlowBtnTabbar } from './component/tab_bar'
|
|
38
|
-
import Square from './component/square'
|
|
39
33
|
import Panel from './component/panel'
|
|
40
|
-
import {
|
|
34
|
+
import {
|
|
35
|
+
ConfirmCouplingPicker,
|
|
36
|
+
ConfirmPicker,
|
|
37
|
+
CouplingPicker,
|
|
38
|
+
Picker,
|
|
39
|
+
SearchPicker,
|
|
40
|
+
SelectPicker,
|
|
41
|
+
} from './component/picker'
|
|
42
|
+
import Popup from './component/popup'
|
|
43
|
+
import Price from './component/price'
|
|
44
|
+
import ProgressBar from './component/progress_bar'
|
|
41
45
|
import PullUpDown from './component/pull_up_down'
|
|
42
|
-
import
|
|
46
|
+
import Radio from './component/radio'
|
|
47
|
+
import RepeatTimes from './component/repeat_times'
|
|
43
48
|
import Scroll from './component/scroll'
|
|
44
|
-
import
|
|
49
|
+
import ScrollIntoView from './component/scroll_into_view'
|
|
50
|
+
import { FakeSearch, Search, SearchPage } from './component/search'
|
|
51
|
+
import Square from './component/square'
|
|
52
|
+
import { LocalStorage, SessionStorage } from './component/storage'
|
|
53
|
+
import Switch from './component/switch'
|
|
45
54
|
import Tabs from './component/tabs'
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
import
|
|
49
|
-
import NProgress from './component/nprogress'
|
|
50
|
-
import InnerLayer from './component/inner_layer'
|
|
55
|
+
import { FlowBtnTabbar, Tabbar } from './component/tab_bar'
|
|
56
|
+
import TagWrap from './component/tag'
|
|
57
|
+
import Textarea from './component/textarea'
|
|
51
58
|
import Toast from './component/toast'
|
|
52
|
-
import Dialog from './component/dialog'
|
|
53
|
-
import Mask from './component/mask'
|
|
54
|
-
import Popup from './component/popup'
|
|
55
59
|
import Tooltip from './component/tooltip'
|
|
56
|
-
import
|
|
57
|
-
|
|
58
|
-
// 其他
|
|
59
|
-
import { LetterIndex, LetterIndexMultiple } from './component/letter_index'
|
|
60
|
-
import { LocalStorage, SessionStorage } from './component/storage'
|
|
60
|
+
import Uploader from './component/uploader'
|
|
61
61
|
import CSSVariable from './css_variable'
|
|
62
|
-
import { Search, SearchPage, FakeSearch } from './component/search'
|
|
63
|
-
import RepeatTimes from './component/repeat_times'
|
|
64
|
-
import Canvas from './component/canvas'
|
|
65
62
|
|
|
66
63
|
const Alert = Dialog.alert
|
|
67
64
|
const Confirm = Dialog.confirm
|
|
@@ -69,7 +66,6 @@ const Prompt = Dialog.prompt
|
|
|
69
66
|
const Delete = Dialog.delete
|
|
70
67
|
|
|
71
68
|
export {
|
|
72
|
-
// 表单
|
|
73
69
|
Button,
|
|
74
70
|
ButtonTime,
|
|
75
71
|
Checkbox,
|
|
@@ -89,6 +85,7 @@ export {
|
|
|
89
85
|
ConfirmPicker,
|
|
90
86
|
ConfirmCouplingPicker,
|
|
91
87
|
SelectPicker,
|
|
88
|
+
SearchPicker,
|
|
92
89
|
Keyboard,
|
|
93
90
|
KeyboardWrap,
|
|
94
91
|
RangeCalendar,
|