From 503a03453c606b9bb6a8d0b6b77e99d609a69385 Mon Sep 17 00:00:00 2001
From: ZhaoTongYao <531131322@qq.com>
Date: Tue, 7 Dec 2021 17:58:15 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BF=97=E6=84=BF=E8=80=85=E6=B3=A8=E5=86=8C?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=A1=B9=E6=89=80=E5=B1=9E=E9=98=9F=E6=89=80?=
 =?UTF-8?q?=E5=B1=9E=E5=9B=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/selectInput/index.js               | 174 ++++++++++++++++++
 components/selectInput/index.json             |   4 +
 components/selectInput/index.wxml             |  31 ++++
 components/selectInput/index.wxss             |  99 ++++++++++
 .../teamIntroduction/teamIntroduction.wxss    |   5 +-
 subpages/heart/pages/volunteer/volunteer.js   |  81 ++++++--
 subpages/heart/pages/volunteer/volunteer.json |   3 +-
 subpages/heart/pages/volunteer/volunteer.wxml |  38 +++-
 subpages/heart/pages/volunteer/volunteer.wxss |  34 +++-
 subpages/heart/utils/api.js                   |   7 +-
 10 files changed, 453 insertions(+), 23 deletions(-)
 create mode 100644 components/selectInput/index.js
 create mode 100644 components/selectInput/index.json
 create mode 100644 components/selectInput/index.wxml
 create mode 100644 components/selectInput/index.wxss

diff --git a/components/selectInput/index.js b/components/selectInput/index.js
new file mode 100644
index 0000000..689a896
--- /dev/null
+++ b/components/selectInput/index.js
@@ -0,0 +1,174 @@
+Component({
+  properties: {
+    // 是否显示底部弹出页面
+    isShow: {
+      type: Boolean,
+      observer: function (newVal) {
+        if(newVal) {
+          this.show()
+        } else {
+          this.hide()
+        }
+      }
+    },
+    // 返回给父组件的值是label还是value，默认value
+    getTypeValue: {
+      type: Boolean,
+      value: true
+    },
+    // 列表数据，转换为checkList
+    listData: {
+      type: Array,
+      value: []
+    },
+    // 默认数据，复显
+    defaultList: {
+      type: Array,
+      value: []
+    },
+    // listData中的label 名，默认 label
+    label: {
+      type: String,
+      value: 'label'
+    },
+    // listData中的value 名，默认 value
+    value: {
+      type: String,
+      value: 'value'
+    },
+    // 单选还是多选，默认多选 (未实现)
+    // isSingle: {
+    //   type: Boolean,
+    //   value: false
+    // }
+  },
+  data: {
+    checkList: [],
+    checkedItemLabels: [], // 选中的label集合
+    checkedItemValues: [], // 选中的value集合
+    searchList: [], // 搜索结果列表
+    searchKey: '', // 搜索的值
+    searchFocus: false,
+    initAnimation: '',
+  },
+  lifetimes: {
+    attached () {
+      this.animation = wx.createAnimation({
+        duration: 600,
+        timingFunction: 'ease'
+      })
+      this.hide()
+      
+      this.initData()
+    }
+  },
+  methods: {
+    // pageLifetimes 无效
+    show () {
+      this.animation.translateY(0).step()
+  　  this.setData({
+        initAnimation: this.animation.export()
+  　　})
+      this.initData()
+    },
+    hide () {
+      this.animation.translateY(500).step()
+      this.setData({
+        initAnimation: this.animation.export()
+      })
+    },
+    initData () {
+      this.data.checkList = []
+      this.data.checkedItemLabels = []
+      this.data.checkedItemValues = []
+      this.data.listData.forEach((item, key) => {
+        let checkListItem = {
+          label: item[this.data.label],
+          value: item[this.data.value],
+          checked: false
+        }
+        this.data.checkList.push(checkListItem)
+      })
+      if (this.data.defaultList.length > 0) {
+        this.data.defaultList.forEach(item => {
+          this.data.checkList.forEach(checkItem => {
+            if(item == checkItem.value) {
+              checkItem.checked = true
+            }
+          })
+        })
+      }
+      let checkedLabel = []
+      let checkedValue = []
+      this.data.checkList.forEach(item => {
+        if (item.checked) {
+          checkedLabel.push(item.label)
+          checkedValue.push(item.value)
+        }
+      })
+      this.setData({
+        checkList: this.data.checkList,
+        checkedItemLabels: checkedLabel,
+        checkedItemValues: checkedValue
+      })
+    },
+    changeCheckedItem(e) {
+      let changeItem = e.currentTarget.dataset.item
+      changeItem.checked = !changeItem.checked
+      this.data.checkList.forEach(item => {
+        if (changeItem.value == item.value) {
+          item.checked = changeItem.checked
+        }
+      })
+      let checkedLabels = this.data.checkedItemLabels
+      let checkedValues = this.data.checkedItemValues
+      if (changeItem.checked) {
+        checkedLabels.push(changeItem.label)
+        checkedValues.push(changeItem.value)
+      } else {
+        let delIndex = checkedValues.indexOf(changeItem.value)
+        if (delIndex > -1) {
+          checkedLabels.splice(delIndex, 1)
+          checkedValues.splice(delIndex, 1)
+        }
+      }
+      this.setData({
+        checkList: this.data.checkList,
+        checkedItemLabels: checkedLabels,
+        checkedItemValues: checkedValues,
+        searchList: [],
+        searchKey: ''
+      })
+    },
+    onInput (e) {
+      let value = e.detail.value.toLowerCase()
+      let list = []
+      this.data.checkList.forEach(item => {
+        if (item.label.toLowerCase().indexOf(value) > -1) {
+          list.push(item)
+        }
+      })
+      this.setData({
+        searchList: list,
+        searchKey: value
+      })
+    },
+    onFocus () {
+      this.setData({
+        searchFocus: true
+      })
+    },
+    onblur () {
+      this.setData({
+        searchFocus: false
+      })
+    },
+    confirm () {
+      let values = this.data.getTypeValue ? this.data.checkedItemValues : this.data.checkedItemLabels
+      this.triggerEvent('onConfirm', { itemList: values })
+    },
+    cancel () {
+      this.triggerEvent('onCancel')
+    }
+  }
+})
diff --git a/components/selectInput/index.json b/components/selectInput/index.json
new file mode 100644
index 0000000..e8cfaaf
--- /dev/null
+++ b/components/selectInput/index.json
@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}
\ No newline at end of file
diff --git a/components/selectInput/index.wxml b/components/selectInput/index.wxml
new file mode 100644
index 0000000..f2875ae
--- /dev/null
+++ b/components/selectInput/index.wxml
@@ -0,0 +1,31 @@
+<view class="box" wx:if="{{isShow}}">
+    <view class="bottom-box" animation="{{initAnimation}}">
+        <view class="menu-box">
+            <view class="menu-left" bindtap="cancel">取消</view>
+            <view class="menu-title">请选择</view>
+            <view class="menu-right" bindtap="confirm">确定</view>
+        </view>
+        <block wx:if="{{checkList.length > 0}}">
+        <view class="input-box" bindtap="onFocus">
+            <view class="select-item" wx:for="{{checkedItemLabels}}" wx:key="index">{{item}}</view>
+            <view class="input-item">
+                <input class="input-content" type="text" bindinput="onInput" value="{{searchKey}}" focus="{{searchFocus}}" bindblur="onblur"/>
+            </view>
+        </view>
+        <!-- 正常状态显示 -->
+        <view class="check-box" wx:if="{{searchKey == ''}}">
+            <view class="check-item {{item.checked ? 'check-item-active' : ''}}" wx:for="{{checkList}}" wx:key="index" bindtap="changeCheckedItem" data-item="{{item}}">
+                <view class="check-title">{{item.label}}</view>
+                <view class="check-icon" wx:if="{{item.checked}}">√</view>
+            </view>
+        </view>
+        <!-- 搜索时显示 -->
+        <view class="check-box" wx:else>
+            <view class="check-item {{item.checked ? 'check-item-active' : ''}}" wx:for="{{searchList}}" wx:key="index" bindtap="changeCheckedItem" data-item="{{item}}">
+                <view class="check-title">{{item.label}}</view>
+                <view class="check-icon" wx:if="{{item.checked}}">√</view>
+            </view>
+        </view>
+        </block>
+    </view>
+</view>
diff --git a/components/selectInput/index.wxss b/components/selectInput/index.wxss
new file mode 100644
index 0000000..37eaca6
--- /dev/null
+++ b/components/selectInput/index.wxss
@@ -0,0 +1,99 @@
+/* components/nodata/nodata.wxss */
+.box{
+    width: 100%;
+    height: 100vh;
+    box-sizing: border-box;
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 9999;
+    background: rgba(50, 50, 50, 0.6);
+}
+.bottom-box-show {
+}
+.bottom-box-hide {
+}
+.bottom-box {
+    width: 100%;
+    max-height: 65%;
+    background: #fff;
+    position: absolute;
+    bottom: 0;
+    padding: 10rpx 30rpx 30rpx 30rpx;
+    box-sizing: border-box;
+}
+.bottom-box .menu-box {
+    width: 100%;
+    height: 60rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+    margin-bottom: 20rpx;
+}
+.bottom-box .menu-box .menu-left {
+    width: 15%;
+    text-align: left;
+    /* color: #16b64f; */
+}
+.bottom-box .menu-box .menu-title {
+    width: 70%;
+    text-align: center;
+}
+.bottom-box .menu-box .menu-right {
+    width: 15%;
+    text-align: right;
+    color: #108af6;
+}
+.bottom-box .input-box {
+    width: 100%;
+    min-height: 100rpx;
+    max-height: 240rpx;
+    background: #f7f7f7;
+    display: flex;
+    align-items: center;
+    padding: 20rpx;
+    box-sizing: border-box;
+    overflow: scroll;
+    flex-wrap: wrap;
+    margin-bottom: 20rpx;
+}
+.bottom-box .input-box .select-item {
+    padding: 4rpx 10rpx;
+    box-sizing: border-box;
+    /* background: #0fb0ee70; */
+    background: #dddddd;
+    margin-right: 10rpx;
+    margin-bottom: 10rpx;
+    border-radius: 8rpx;
+    /* color: #fff;
+    border: 1px solid #0fb0ee; */
+    word-break: break-all;
+}
+.bottom-box .input-box .input-item .input-content{
+    width: 100rpx;
+}
+.bottom-box .check-box {
+    max-height: 400rpx;
+    overflow-y: scroll;
+    padding-right: 12rpx;
+    margin-bottom: 60rpx;
+}
+.check-box .check-item {
+    width: 100%;
+    min-height: 80rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    border-bottom: 1px solid #e7e7e7;
+}
+.check-box .check-item-active {
+    color: #108af6;
+}
+.check-box .check-item .check-title{
+    width: 620rpx;
+    overflow: hidden;
+    word-break: break-all;
+}
+.check-box .check-item .check-icon {
+
+}
\ No newline at end of file
diff --git a/subpages/heart/pages/teamIntroduction/teamIntroduction.wxss b/subpages/heart/pages/teamIntroduction/teamIntroduction.wxss
index 774bb68..7ce9415 100644
--- a/subpages/heart/pages/teamIntroduction/teamIntroduction.wxss
+++ b/subpages/heart/pages/teamIntroduction/teamIntroduction.wxss
@@ -77,8 +77,10 @@ page {
   margin: 18rpx 0;
   height: 136rpx;
   display: flex;
-  align-items: center;
+  /* align-items: center; */
   justify-content: center;
+  word-break: break-all;
+  overflow: scroll;
 }
 .top-text .top-text-desc {
   width: 690rpx;
@@ -86,6 +88,7 @@ page {
   color: #ffffff;
   overflow: hidden;
   line-height: 40rpx;
+  word-break: break-all;
 }
 .top-button {
   width: 140rpx;
diff --git a/subpages/heart/pages/volunteer/volunteer.js b/subpages/heart/pages/volunteer/volunteer.js
index f2dbdad..c79d457 100644
--- a/subpages/heart/pages/volunteer/volunteer.js
+++ b/subpages/heart/pages/volunteer/volunteer.js
@@ -67,6 +67,10 @@ Page({
       id: ''
     }],
     teamIndex: 0,
+    selectList: [],
+    isShowSelect: false,
+    teamIdList: [], // 提交参数
+    teamLabels: [], // 显示
   },
   onLoad: function () {
     this.setData({
@@ -76,16 +80,17 @@ Page({
     this.getImgUrl()
     this.getPrepareComplete().then(() => {
       this.getGridList()
-      // this.getVolunteerTags()
-      // this.getVolunteerDepts()
-      // this.getTeamTypeList().then(res => {
-      //   if (this.data.team.id) {
-      //     this.getTeamTypeName()
-      //   }
-      // })
+      this.getVolunteerTags()
+      // this.getVolunteerDepts() // 部门
+      this.getTeamTypeList().then(res => {
+        if (this.data.team.id) {
+          this.getTeamTypeName()
+        }
+      })
     })
     this.checkWxUnionId()
     this.getWxCode()
+    this.getAllTeamListByName()
   },
   //返回上一级
   goback () {
@@ -258,7 +263,8 @@ Page({
           'volunteerTag.id': res.data.volunteerTagId || '0',
           'volunteerDept.id': res.data.volunteerDeptId || '0',
           'team.id': res.data.teamId || '',
-          teamNames: res.data.teamNames
+          teamNames: res.data.teamNames,
+          teamIdList: res.data.teamIds,
           // introduce:res.data.introduce
         })
         resolve(true)
@@ -364,7 +370,7 @@ Page({
       smsCode: this.data.smsCode,
       realName: this.data.realName.trim(''),
       mobile: this.data.mobile.trim(''),
-      identityNo: this.data.identityNo.trim(''),
+      identityNo: this.data.identityNo,
       road: this.data.road.trim(''),
       villageName: this.data.villageName,
       dwellingPlace: this.data.dwellingPlace,
@@ -373,12 +379,13 @@ Page({
       volunteerFaceImg:this.data.volunteerFaceImg,
       volunteerNickname:this.data.volunteerNickname.trim(''),
       volunteerSignature:this.data.volunteerSignature,
-      // volunteerTagId: this.data.volunteerTag.id,
+      volunteerTagId: this.data.volunteerTag.id,
       // volunteerDeptId: this.data.volunteerDept.id,
       // teamId: this.data.team.id || '',
       wxCode: this.data.unionIdStatus === "1" ? "" : this.data.wxCode,
       encryptedData: this.data.unionIdStatus === "1" ? "" : this.data.encryptedData,
-      iv: this.data.unionIdStatus === "1" ? "" : this.data.iv
+      iv: this.data.unionIdStatus === "1" ? "" : this.data.iv,
+      teamIdList: this.data.teamIdList, // 志愿团队ids
     }
     this.setData({
       lock: true
@@ -740,5 +747,57 @@ Page({
       })
       console.log(err)
     })
+  },
+  deleteItem (e) {
+    let label = e.currentTarget.dataset.label
+    let delLabelIndex = this.data.teamLabels.indexOf(label)
+    if (delLabelIndex > -1) {
+      this.data.teamLabels.splice(delLabelIndex, 1)
+      this.data.selectList.forEach(item => {
+        if (label == item.teamName) {
+          this.data.teamIdList.splice(this.data.teamIdList.indexOf(item.id), 1)
+          this.setData({
+            teamLabels: this.data.teamLabels,
+            teamIdList: this.data.teamIdList
+          })
+        }
+      })
+    }
+  },
+  getAllTeamListByName () {
+    new_api.getAllTeamListByName().then(res => {
+      console.log(res.data)
+      this.setData({
+        selectList: res.data
+      })
+    })
+  },
+  showSelect () {
+    this.setData({
+      isShowSelect: true
+    })
+  },
+  selectConfirm (e) {
+    let teamIdList = e.detail.itemList
+    this.setData({
+      isShowSelect: false,
+      teamIdList
+    })
+    let labels = []
+    this.data.teamIdList.forEach(teamIditem => {
+      this.data.selectList.forEach(item => {
+        if (item.id == teamIditem) {
+          labels.push(item.teamName)
+        }
+      })      
+    })
+    this.setData({
+      teamLabels: labels
+    })
+  },
+  selectCancel (e) {
+    this.setData({
+      isShowSelect: false
+    })
   }
 })
\ No newline at end of file
diff --git a/subpages/heart/pages/volunteer/volunteer.json b/subpages/heart/pages/volunteer/volunteer.json
index 61cd0be..eaaac0b 100644
--- a/subpages/heart/pages/volunteer/volunteer.json
+++ b/subpages/heart/pages/volunteer/volunteer.json
@@ -4,6 +4,7 @@
   "usingComponents": {
     "wux-dialog": "../../../../dist/dialog/index",
     "coverview-dialog": "../../components/coverViewDialog/coverViewDialog",
-    "wux-actionsheet": "../../../../dist/actionsheet/index"
+    "wux-actionsheet": "../../../../dist/actionsheet/index",
+    "select-input": "/components/selectInput/index"
   }
 }
\ No newline at end of file
diff --git a/subpages/heart/pages/volunteer/volunteer.wxml b/subpages/heart/pages/volunteer/volunteer.wxml
index a7e75f5..292e0f6 100644
--- a/subpages/heart/pages/volunteer/volunteer.wxml
+++ b/subpages/heart/pages/volunteer/volunteer.wxml
@@ -89,15 +89,30 @@
           <input class="nicknameinput" bindblur="nickname" bindinput="nickname" value="{{volunteerNickname}}" placeholder-class="placeholder-style" placeholder="请输入您的昵称" />
         </view>
       </view>
-      <!-- <view class="head-portrait">
-        <view class="head-portrait-name">选择小组</view>
+      <view class="head-portrait">
+        <view class="head-portrait-name">所属队</view>
         <picker bindchange="choosePicker" value="{{tagIndex}}" range="{{tagList}}" range-key="tagName">
           <view class="picker">
             {{tagList[tagIndex].tagName}}
           </view>
         </picker>
       </view>
-      <view class="head-portrait" >
+      <view class="head-portrait-last">
+        <view class="head-portrait-name-last">所属团</view>
+      </view>
+      <view class="info-box-last-v2">
+        <view class="introduce">
+          <view bindtap="showSelect" class="label-input">
+            <view class="placeholder-class" wx:if="{{teamLabels.length == 0}}">请选择团队</view>
+            <block wx:else>
+              <view class="label-input-item" wx:for="{{teamLabels}}" wx:key="index">{{item}}
+                <image class="del-item" catchtap="deleteItem" data-label="{{item}}" src="../../images/icon_close.png" />
+              </view>
+            </block>
+          </view>
+        </view>
+      </view>
+      <!-- <view class="head-portrait" >
         <view class="head-portrait-name">选择部门</view>
         <picker bindchange="choosePicker2" value="{{deptIndex}}" range="{{deptList}}" range-key="deptName">
           <view class="picker">
@@ -129,11 +144,9 @@
           <textarea disabled= '{{disabled}}' placeholder-class="placeholder-style" value="{{volunteerSignature}}" placeholder="请输入您的格言" bindblur="volunteerSignature" bindinput="volunteerSignature" maxlength="20"></textarea>
         </view>
       </view>
-
-      
     </view>
     <!-- 已加入团队 -->
-    <view class="info magin-top" wx:if="{{teamNames.length > 0}}">
+    <!-- <view class="info magin-top" wx:if="{{teamNames.length > 0}}">
       <view class="info-box">
         <view class="info-left header-title">
           已加入团队
@@ -146,7 +159,7 @@
         </view>
         <view class="clear"></view>
       </view>
-    </view>
+    </view> -->
     <!-- 居住地址 -->
     <view class="info magin-top">
       <view class="info-box">
@@ -219,4 +232,13 @@
 
 <coverview-dialog bind:close="confirmDialog" bind:confirm="confirmDialog" dialogVisible="{{dialogVisible}}" title="{{dialogTitle}}" content="{{dialogContent}}" confirmText="{{dialogConfirmText}}" cancelText="{{dialogCancelText}}">
 </coverview-dialog>
-<wux-actionsheet id="wux-actionsheet" />
\ No newline at end of file
+<wux-actionsheet id="wux-actionsheet" />
+<select-input 
+  isShow="{{isShowSelect}}"
+  getTypeValue="{{true}}"
+  listData="{{selectList}}"
+  label="teamName"
+  value="id"
+  defaultList="{{teamIdList}}"
+  bind:onConfirm="selectConfirm"
+  bind:onCancel="selectCancel"></select-input>
\ No newline at end of file
diff --git a/subpages/heart/pages/volunteer/volunteer.wxss b/subpages/heart/pages/volunteer/volunteer.wxss
index 4bff1dd..75e5a3f 100644
--- a/subpages/heart/pages/volunteer/volunteer.wxss
+++ b/subpages/heart/pages/volunteer/volunteer.wxss
@@ -442,4 +442,36 @@ button::after {
 }
 /* .wux-actionsheet__group--options{
   background: #fff !important;
-} */
\ No newline at end of file
+} */
+.label-input {
+  width: 100%;
+  min-height: 100rpx;
+  max-height: 240rpx;
+  background: #f7f7f7;
+  display: flex;
+  align-items: center;
+  padding: 20rpx;
+  box-sizing: border-box;
+  overflow: scroll;
+  flex-wrap: wrap;
+  margin-bottom: 20rpx;
+}
+.label-input .label-input-item {
+  padding: 4rpx 10rpx;
+  box-sizing: border-box;
+  /* background: #0fb0ee70; */
+  background: #dddddd;
+  border-radius: 8rpx;
+  /* color: #fff; */
+  /* border: 1px solid #0fb0ee; */
+  position: relative;
+  margin: 20rpx 30rpx 0 0;
+  word-break: break-all;
+}
+.label-input .label-input-item .del-item {
+  width: 40rpx;
+  height: 40rpx;
+  position: absolute;
+  right: -30rpx;
+  top: -20rpx;
+}
\ No newline at end of file
diff --git a/subpages/heart/utils/api.js b/subpages/heart/utils/api.js
index c027848..66a5268 100644
--- a/subpages/heart/utils/api.js
+++ b/subpages/heart/utils/api.js
@@ -31,7 +31,8 @@ module.exports = {
     getTeamVolunteerList,
     joinTeam,
     getVolunteerUnionActList,
-    getVolunteerUnionActDetail
+    getVolunteerUnionActDetail,
+    getAllTeamListByName
 }
 
 //顺道捎-首页列表
@@ -227,4 +228,8 @@ function getTeamVolunteerList ({ pageIndex, pageSize, id }) {
 // 志愿团队-加入团队
 function joinTeam (para) {
     return fly.post("heart/volunteer/joinTeam", para)
+}
+//获取团队列表
+function getAllTeamListByName (param) {
+    return fly.get(`heart/volunteer/getAllTeamListByName?teamName=`)
 }
\ No newline at end of file