Merge branch 'master' of http://git.ycjcjy.com/pet_identity/miniapp

project.config.json

@@ -4,7 +4,7 @@
     "description": "项目配置文件，详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
     "appid": "wxe44244d1a5ea3364",
     "setting": {
-        "urlCheck": true,
+        "urlCheck": false,
         "es6": false,
         "postcss": false,
         "minified": false,

src/app.config.js

@@ -10,6 +10,7 @@ export default {
     'pages/LicenseInfo/index',
     'pages/dogList/index',
     'pages/setDogInfo/index',
+    'pages/dogCardDetail/index',
   ],
   window: {
     backgroundTextStyle: 'light',

src/components/Picker/index.jsx

@@ -1,61 +0,0 @@
-import Taro from '@tarojs/taro';
-import { Picker, View } from '@tarojs/components';
-import { useMemo, useState } from 'react';
-import PropTypes from 'prop-types';
-
-// 暂时只支持单列普通选择器
-const XPicker = (props) => {
-  const { bindchange, onChange, range, value : propValue, rangeKey, rangeValue, placeholder = '请选择', ...leftProps } = props
-
-  const [innerValue, setInnerValue] = useState()
-
-  const handleChange = (e) => {
-    const data = range[e.detail.value]
-    const val = data[rangeValue]
-    e.detail.value = val
-    setInnerValue(data)
-
-    console.log('-----bindchange----->', bindchange)
-    console.log('-----onChange----->', onChange)
-
-    if (bindchange) {
-      bindchange(e, data)
-    }
-    if (onChange) {
-      onChange(e, data)
-    }
-  }
-
-  const value = useMemo(() => {
-    if (propValue === undefined || propValue === null) {
-      return undefined
-    }
-
-    for (let i in range) {
-      if (range[i][rangeValue] === propValue) {
-        setInnerValue(range[i])
-        return i;
-      }
-    }
-
-    return undefined;
-  }, [propValue, range, rangeValue])
-
-  const childViewStyle = useMemo(() => {
-    return innerValue ? {} : { color: '#858585' }
-  }, [innerValue])
-
-  return (
-    <Picker {...leftProps} mode='selector' range={range} value={value} rangeKey={rangeKey} onChange={handleChange}>
-      <View style={childViewStyle}>{innerValue === undefined ? placeholder : innerValue[rangeKey]}</View>
-    </Picker>
-  )
-}
-
-XPicker.behaviors = ['wx://form-field']
-XPicker.propTypes = {
-  behaviors: PropTypes.array
-}
-
-
-export default XPicker

src/components/s-picker/index.js

@@ -0,0 +1,48 @@
+Component({
+  behaviors: ['wx://form-field'],
+  options: {
+    addGlobalClass: true,
+  },
+  properties: {
+    name: {
+      type: String
+    },
+    value: {
+      type: undefined,
+    },
+    range: {
+      type: Array,
+    },
+    rangeKey: {
+      type: String,
+    },
+    rangeValue: {
+      type: String,
+    },
+    placeholder: {
+      type: String,
+      value: '请选择'
+    },
+  },
+  data: {
+    text: undefined,
+    index: undefined,
+  },
+  methods: {
+    bindChange: function(e) {
+
+      const index = e.detail.value
+      const data = this.data.range[index]
+      const value = data[this.data.rangeValue]
+      const text = data[this.data.rangeKey]
+
+      this.setData({
+        index,
+        text,
+        value,
+      })
+
+      this.triggerEvent('change', { value, data })
+    }
+  }
+})

src/components/s-picker/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

src/components/s-picker/index.wxml

@@ -0,0 +1,4 @@
+<picker mode="selector" range="{{range}}" value="{{index}}" range-key="{{rangeKey}}" bindchange="bindChange" >
+  <view class="s-picker-placeholder" wx:if="{{index == undefined}}">{{placeholder}}</view>
+  <view wx:else>{{text}}</view>
+</picker>

src/components/s-picker/index.wxss

@@ -0,0 +1,3 @@
+.s-picker-placeholder {
+  color: #858585
+}

src/pages/dogCardDetail/index.config.js

@@ -0,0 +1,10 @@
+export default {
+  navigationBarTitleText: '犬证详情',
+  disableScroll: true,
+  navigationBarBackgroundColor: "#FBD804",
+  navigationBarTextStyle: "black",
+  backgroundColor: "#FBD804",
+  usingComponents: {
+  }
+
+}

src/pages/dogCardDetail/index.jsx

@@ -0,0 +1,62 @@
+import { View, Image, ScrollView } from '@tarojs/components'
+import './style.less'
+
+export default (props) => {
+  const status = 2;
+  return (
+    <ScrollView scrollY style={{ height: '100vh' }}>
+      <View className='dogCardDetail'>
+        <View className='card'>
+          <View className='title'>电&nbsp;&nbsp;&nbsp;子&nbsp;&nbsp;&nbsp;版&nbsp;&nbsp;&nbsp;犬&nbsp;&nbsp;&nbsp;证</View>
+          <View className='body'>
+            <View className='cardLeft'>
+              <View className='cell'>
+                <View className='lable'>犬主</View>：
+                <View className='content'>六花</View>
+              </View>
+              <View className='cell'>
+                <View className='lable'>电话</View>：
+                <View className='content'>18544446868</View>
+              </View>
+              <View className='cell'>
+                <View className='lable'>犬名</View>：
+                <View className='content'>噬嗥</View>
+              </View>
+            </View>
+            <View className='cardRight'>
+              <Image
+                className='thumb'
+                src='https://gimg2.baidu.com/image_search/src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fq_70%2Cc_zoom%2Cw_640%2Fimages%2F20181228%2Ff22539cd34044f5f821e9893f508765d.jpeg&refer=http%3A%2F%2F5b0988e595225.cdn.sohucs.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1656163682&t=bec14da4c530bf5f0ae04ff8488a9ebd'
+              ></Image>
+            </View>
+          </View>
+          <View className='cell' style={{ marginTop: '0' }}>
+            <View className='lable'>状态</View>：
+            <View className={['state', 'color' + status]}>{status == 1 ? '正常' : status == 2 ? '过期' : '挂失'}</View>
+            {/* 挂失 续期 */}
+          </View>
+          <View className='cell'>
+            <View className='lable'>犬种</View>：
+            <View className='content'>银月狼神一族</View>
+          </View>
+          <View className='cell'>
+            <View className='lable'>毛色</View>：
+            <View className='content'>米白</View>
+          </View>
+          <View className='cell'>
+            <View className='lable'>证件号</View>：
+            <View className='content'>36559948485522</View>
+          </View>
+          <View className='cell'>
+            <View className='lable'>有效期</View>：
+            <View className='content'>2021-12-20~2022-12-20</View>
+          </View>
+          <View className='cell'>
+            <View className='lable'>住址</View>：
+            <View className='content'>江苏省南京市江宁区南京南站城际空间站旁边第一个小区的一期的219栋3304房最里面那间</View>
+          </View>
+        </View>
+      </View>
+    </ScrollView>
+  )
+}

src/pages/dogCardDetail/style.less

@@ -0,0 +1,61 @@
+.dogCardDetail{
+  padding: 32px;
+  .card{
+    background-color: rgb(251, 216, 4);
+    border-radius: 16px;
+    padding: 32px 16px;
+    .title{
+      font-size: 48px;
+      font-weight: bold;
+      text-align: center;
+      margin-bottom: 32px;
+    }
+    .cell{
+      margin: 16px 0;
+      display: flex;
+      .lable{
+        width: 3em;
+        display: inline-block;
+        text-align: justify;
+        text-align-last: justify;
+        padding: 8px 0;
+      }
+      .content{
+        flex: 1;
+        padding: 8px 16px;
+        background-color: white;
+      }
+      .state{
+        flex: 1;
+        padding: 8px 16px;
+        text-align: center;
+        letter-spacing: 0.5em;
+      }
+      .color1{
+        background-color: yellowgreen;
+      }
+      .color2{
+        background-color:red;
+      }
+      .color3{
+        background-color:rgb(170, 168, 168);
+      }
+    }
+    .cardLeft{
+      width: 60%;
+      display: inline-block;
+    }
+    .cardRight{
+      width: 40%;
+      display: inline-block;
+      text-align: center;
+      vertical-align: top;
+      .thumb{
+        width: 30vw;
+        height: 30vw;
+        margin: 16px 0 0 16px;
+      }
+      // 100vw-64px-32px*0.4
+    }
+  }
+}

src/pages/index/index.jsx

@@ -46,8 +46,11 @@ export default (props) => {
     Taro.navigateTo({url:'/pages/noticeInfo/index'})
   }
   const goDogLicenseList = (e) => {
+    // Taro.navigateTo({
+    //   url: '/pages/dogLicenseList/index'
+    // })
     Taro.navigateTo({
-      url: '/pages/dogLicenseList/index'
+      url: '/pages/dogCardDetail/index'
     })
   }
   return (

src/pages/setUser/index.config.js

@@ -8,7 +8,8 @@ export default {
     "mp-cells": "weui-miniprogram/cells/cells",
     "mp-cell": "weui-miniprogram/cell/cell",
     "mp-form-page": "weui-miniprogram/form-page/form-page",
-    "mp-form": "weui-miniprogram/form/form"
+    "mp-form": "weui-miniprogram/form/form",
+    "s-picker": "../../components/s-picker/index"
   }
 
 }

src/pages/setUser/index.jsx

@@ -5,7 +5,6 @@ import { setPersons } from '@/services/dogAPI';
 import { useModel } from '@/store';
 import { uploadFile } from '@/utils/request';
 import Form from '@/components/Form';
-import Picker from '@/components/Picker';
 
 import './style.less'
 
@@ -103,7 +102,7 @@ export default (props) => {
               </mp-cell>
               <mp-cell title='性别' extClass=''>
                 {/* <Input name='sex' placeholder='请输入卡号' /> */}
-                <Picker name='sex' rangeKey='text' rangeValue='value' range={userSex} />
+                <s-picker name='sex' rangeKey='text' rangeValue='value' range={userSex} value={person?.sex} />
               </mp-cell>
               <mp-cell title='手机号' extClass=''>
                 <Input name='phone' type='number' placeholder='请输入手机号' maxlength={11} value={person?.phone} />