Browse Source

add functionclass

[baozhangchao] 3 years ago
parent
commit
ed299dce8a
4 changed files with 88 additions and 49 deletions
  1. 3
    5
      src/pages/main/index.jsx
  2. 0
    2
      src/pages/setDogInfo/index.jsx
  3. 76
    42
      src/pages/setUser/index.jsx
  4. 9
    0
      src/services/dogAPI.js

+ 3
- 5
src/pages/main/index.jsx View File

29
           <View>文明养狗,遵纪守法</View>
29
           <View>文明养狗,遵纪守法</View>
30
         </View>
30
         </View>
31
         <View className='user-box-Card-right' onClick={goSetUser}>
31
         <View className='user-box-Card-right' onClick={goSetUser}>
32
-          <ViewIcon icon='bianji' size={19} color='#2f2f2f' />
33
-
32
+          <View style={{ paddingRight: '5px' }}>
33
+            <ViewIcon icon='bianji' size={19} color='#2f2f2f' />
34
+          </View>
34
           修改信息
35
           修改信息
35
         </View>
36
         </View>
36
       </View>
37
       </View>
48
   )
49
   )
49
 }
50
 }
50
 
51
 
51
-
52
-
53
-

+ 0
- 2
src/pages/setDogInfo/index.jsx View File

193
                 </View>
193
                 </View>
194
               </mp-cell>
194
               </mp-cell>
195
 
195
 
196
-
197
-
198
             </mp-cells>
196
             </mp-cells>
199
           </mp-form>
197
           </mp-form>
200
           <View slot='button' style={{ margin: '4em 0 2em 0' }}>
198
           <View slot='button' style={{ margin: '4em 0 2em 0' }}>

+ 76
- 42
src/pages/setUser/index.jsx View File

1
 import { View, Button, Form, Text, Image, Picker, Switch, Input, Radio, Label, ScrollView } from '@tarojs/components'
1
 import { View, Button, Form, Text, Image, Picker, Switch, Input, Radio, Label, ScrollView } from '@tarojs/components'
2
 import Taro from '@tarojs/taro';
2
 import Taro from '@tarojs/taro';
3
 import { useState } from 'react';
3
 import { useState } from 'react';
4
+import { setPerson } from '../../services/dogAPI';
4
 
5
 
5
 import './style.less'
6
 import './style.less'
6
 
7
 
7
 export default (props) => {
8
 export default (props) => {
8
-  const [imgUrl, setImgUrl] = useState()
9
+  // const [imgUrl, setImgUrl] = useState()
10
+  const [userInfo, setUserInfo] = useState({ cardImg1: null, sex: '请选择性别' })
11
+
12
+  const userSex = [
13
+    {
14
+      value: 1,
15
+      text: '男',
16
+    },
17
+    {
18
+      value: 2,
19
+      text: '女',
20
+    },
21
+
22
+  ]
9
 
23
 
10
   const addImage = () => {
24
   const addImage = () => {
11
-    Taro.chooseImage({
12
-      count: 1, // 默认9
13
-      sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
14
-      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有,在H5浏览器端支持使用 `user` 和 `environment`分别指定为前后摄像头
15
-      success: function (res) {
16
-        // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
17
-        var tempFilePaths = res.tempFilePaths
18
-        setImgUrl(tempFilePaths)
19
-      },
20
-      fail () {
21
-        Taro.showToast({
22
-          title: '上传失败请重试',
23
-          icon: 'error',
24
-          duration: 1000
25
-        })
26
-      }
27
-    })
25
+
28
 
26
 
29
   }
27
   }
30
   const formSubmit = e => {
28
   const formSubmit = e => {
31
     console.log(e)
29
     console.log(e)
30
+    const value = e.detail.value
31
+    Taro.showToast({
32
+      title: '保存成功',
33
+      icon: 'none',
34
+      duration: 1000
35
+    })
36
+    Taro.navigateBack({
37
+      delta: 1
38
+    })
39
+    // setPerson({ ...value, ...userInfo }).then((e) => {
40
+    //   console.log('e', e);
41
+
42
+    // })
32
   }
43
   }
33
 
44
 
34
-  const formReset = e => {
35
-    console.log(e)
45
+
46
+  const handleSetUser = (type, value) => {
47
+    console.log("🚀 ~ file: index.jsx ~ line 38 ~ handleSetUser ~ value", value)
48
+    // console.log(e)
49
+    if (type == 'sex') {
50
+      if (value == 0) {
51
+        setUserInfo({ ...userInfo, sex: 1 })
52
+
53
+      } else {
54
+        setUserInfo({ ...userInfo, sex: 2 })
55
+      }
56
+    } else {
57
+      Taro.chooseImage({
58
+        count: 1, // 默认9
59
+        sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
60
+        sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有,在H5浏览器端支持使用 `user` 和 `environment`分别指定为前后摄像头
61
+        success: function (res) {
62
+          // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
63
+          var tempFilePaths = res.tempFilePaths
64
+          setUserInfo({ ...userInfo, cardImg1: tempFilePaths[0] })
65
+        },
66
+        fail () {
67
+          Taro.showToast({
68
+            title: '上传失败请重试',
69
+            icon: 'error',
70
+            duration: 1000
71
+          })
72
+        }
73
+      })
74
+    }
36
   }
75
   }
37
-  const rules = [
38
-    {
39
-      name: 'name',
40
-      rules: { required: true, message: '请填写收货人姓名' },
41
-    },
42
-    {
43
-      name: 'telNumber',
44
-      rules: [{ required: true, message: '请填写收货人电话' }, { mobile: true, message: '电话格式不对' }]
45
-    },
46
-  ]
76
+
47
   return (
77
   return (
48
     <ScrollView scrollY style={{
78
     <ScrollView scrollY style={{
49
       height: '100vh'
79
       height: '100vh'
50
     }}
80
     }}
51
     >
81
     >
52
       <View class='page' >
82
       <View class='page' >
53
-        <Form onSubmit={formSubmit} onReset={formReset} >
54
-
55
-          <mp-form rules={rules} >
56
-            <mp-cells title='我是提示信息'>
83
+        <Form onSubmit={formSubmit}  >
84
+          <mp-form  >
85
+            <mp-cells title=' '>
57
               <mp-cell title='姓名' extClass=''>
86
               <mp-cell title='姓名' extClass=''>
58
-                <Input name='nickName' placeholder='请输入卡号' />
87
+                <Input name='nickName' placeholder='请输入姓名' />
59
               </mp-cell>
88
               </mp-cell>
60
               <mp-cell title='性别' extClass=''>
89
               <mp-cell title='性别' extClass=''>
61
-                <Input name='sex' placeholder='请输入卡号' />
90
+                {/* <Input name='sex' placeholder='请输入卡号' /> */}
91
+                <Picker name='sex' mode='selector' range={userSex} rangeKey='text' onChange={(e) => { handleSetUser('sex', e.detail.value - 0) }}>
92
+                  <View className='picker'>
93
+                    {userInfo.sex == 1 ? '男' : userInfo.sex == 2 ? '女' : userInfo.sex}
94
+                  </View>
95
+                </Picker>
62
               </mp-cell>
96
               </mp-cell>
63
               <mp-cell title='手机号' extClass=''>
97
               <mp-cell title='手机号' extClass=''>
64
-                <Input name='phone' type='number' placeholder='请输入宠养区域' />
98
+                <Input name='phone' type='number' placeholder='请输入手机号' maxlength={11} />
65
               </mp-cell>
99
               </mp-cell>
66
               <mp-cell title='身份证号' extClass=''>
100
               <mp-cell title='身份证号' extClass=''>
67
-                <Input name='idCard' placeholder='请输入身份证号' type='idcard' />
101
+                <Input name='idCard' placeholder='请输入身份证号' type='idcard' maxlength={18} />
68
               </mp-cell>
102
               </mp-cell>
69
               <mp-cell title='身份证图片' extClass=''>
103
               <mp-cell title='身份证图片' extClass=''>
70
                 {
104
                 {
71
-                  !imgUrl ?
72
-                    <View className='addImage' onClick={addImage} >
105
+                  !userInfo.cardImg1 ?
106
+                    <View className='addImage' onClick={(e) => handleSetUser('img', e.detail.value)} >
73
                       <Text>+</Text>
107
                       <Text>+</Text>
74
                     </View>
108
                     </View>
75
                     :
109
                     :
76
-                    <Image className='userImg1' name='cardImg1' src={imgUrl} onClick={addImage} />
110
+                    <Image className='userImg1' name='cardImg1' src={userInfo.cardImg1} onClick={(e) => handleSetUser('img', e.detail.value)} />
77
                 }
111
                 }
78
               </mp-cell>
112
               </mp-cell>
79
 
113
 
80
             </mp-cells>
114
             </mp-cells>
81
           </mp-form>
115
           </mp-form>
82
           <View slot='button' style={{ margin: '4em 0 2em 0' }}>
116
           <View slot='button' style={{ margin: '4em 0 2em 0' }}>
83
-            <Button type='primary' loading={false} formType='submit'>确定 Loading</Button>
117
+            <Button class='weui-btn' type='primary' loading={false} formType='submit'>确定</Button>
84
           </View>
118
           </View>
85
         </Form>
119
         </Form>
86
       </View>
120
       </View>

+ 9
- 0
src/services/dogAPI.js View File

10
  */
10
  */
11
 export const login = (data) => request('/login', { data, method: 'POST' })
11
 export const login = (data) => request('/login', { data, method: 'POST' })
12
 
12
 
13
+/**
14
+ * 人员信息
15
+ * @param {*} data
16
+ * @returns
17
+ */
18
+export const setPerson = (data) => request('/person', { data, method: 'PUT' })
19
+
20
+
21
+
13
 /**
22
 /**
14
  * 狗狗信息维护
23
  * 狗狗信息维护
15
  * @param {*} data
24
  * @param {*} data