修改学校可输入查询

app.wxss

@@ -1,8 +1,10 @@
 @import "lib/style/icon.wxss";
 
+
 /* init tags */
 
 page {
+  font-family:PingFang SC !important;
   /* size */
   --sizehgr: 48rpx;
   --sizehg: 44rpx;

pages/contest/info/info.js

@@ -8,6 +8,7 @@ Page({
    * 页面的初始数据
    */
   data: {
+    showSchool:false,
     sexList: [{label:'男',value:1},{label:'女',value:2}],
     form: {schoolName:''},
     areaList: [],
@@ -88,12 +89,53 @@ Page({
     })
   },
 
-  bindPickerSchool (e) {
-    const id = e.currentTarget.id;
-    const value = e.detail.value
+  handlePickerSchool (e) {
+    const id = this.data.form.area
+    if (id) {
+      const value = e.detail.value
+      imine.querySchoolByAreaId({
+        reqdata: {
+          id,
+          keyword: value
+        }
+      }, res => {
+        this.setData({
+          schoolList: res.list
+        })
+      })
+    } else {
+      wx.showToast({
+        title: '请先选择区域',
+        icon: 'none'
+      })
+    }
+    
+    // this.setData({
+    //   ['form.'+id]: this.data.schoolList[value].id,
+    //   ['form.schoolName']: this.data.schoolList[value].schoolName
+    // })
+  },
+
+  handleShowSchool () {
+    if (this.data.schoolList.length) {
+      this.setData({
+        showSchool: true
+      })
+    } else {
+      wx.showToast({
+        icon: 'none',
+        title: '请先选择区域'
+      })
+    }
+    
+  },
+
+  handleChooseSchool (e) {
+    let item = e.currentTarget.dataset.item
+    console.log(item)
+    // @todo 给学校赋值，并且关闭输入框
     this.setData({
-      ['form.'+id]: this.data.schoolList[value].id,
-      ['form.schoolName']: this.data.schoolList[value].schoolName
+      showSchool:false
     })
   },
 

pages/contest/info/info.wxml

@@ -85,18 +85,25 @@
     </view>
 
     <view class="form-item">
+      <view wx:if="{{showSchool}}" class="form-item-picker">
+        <view bindtap="handleChooseSchool" data-item="{{item}}" class="form-item-leaf" wx:for="{{schoolList}}" wx:key="index">
+        {{item.schoolName}}
+        </view>
+      </view>
       <image class="form-item-bg" mode="widthFix" src="../../../imgs/contest/list-bg.png"></image>
       <view class="content">
         <view class="form-item-label" style="border-right: 4rpx solid #D8D8D8">学校</view>
-        <!-- <input bindinput="changeInput" id="school" placeholder="请输入" placeholder-class="phcolor"></input> -->
-        <view class="select">
-          <picker bindchange="bindPickerSchool" value="{{value}}" range="{{schoolList}}" range-key="schoolName" id="school">
+          <!-- <picker bindchange="bindPickerSchool" value="{{value}}" range="{{schoolList}}" range-key="schoolName" id="school">
             <view class="picker {{form.school?'':'phcolor'}}">
               {{form.school?form.schoolName:'请选择'}}
             </view>
-          </picker>
-          <image class="arrow" src="../../../imgs/contest/arrow.png" mode="widthFix"></image>
-        </view>
+          </picker> -->
+        <input
+        bindfocus="handleShowSchool"
+        bindinput="handlePickerSchool"
+        id="school"
+        placeholder="请输入"
+        placeholder-class="phcolor"></input>
       </view>
     </view>
 

pages/contest/info/info.wxss

@@ -50,6 +50,23 @@ page {
   font-weight: 550;
   color: #161616;
 }
+.form-item-picker{
+  margin: 0 30rpx;
+  z-index:99 !important;
+  background-color:#fff;
+  top:-300rpx;
+  position:absolute;
+  width:calc(100% - 60rpx);
+  box-shadow: 1px 1px 12px 1px rgba(0, 0, 0, 0.06);
+  border-radius: 50rpx;
+  height:300rpx;
+  transition:all .2s;
+  overflow: auto;
+  padding:20rpx;
+}
+.form-item-leaf{
+  padding:20rpx;
+}
 input, .select {
   padding-left: 24rpx;
   width: 500rpx!important;