update 推荐设置

src/app.wpy

@@ -14,9 +14,6 @@
 import wepy from '@wepy/core'
 import vuex from '@wepy/x'
 import promisify from '@wepy/use-promisify'
-import { wx_login } from './utils/util'
-import { IM } from './utils/im'
-import {service} from './config'
 
 wepy.use(promisify)
 wepy.use(vuex)
@@ -45,7 +42,6 @@ wepy.app({
 
   onLaunch() {
     let vm = this
-    vm.appLogin()
     wx.getSystemInfo({
       success: res => {
         vm.$options.globalData.bottomHeight = res.screenHeight - res.safeArea.bottom
@@ -95,29 +91,7 @@ wepy.app({
 
   onHide() {},
 
-  methods: {
+  methods: {}
-    appLogin() {
-      let vm = this
-      wx_login().then((e) => {
-        wx.hideLoading()
-        let {accid, token} = e.data.user.wyy_user
-        vm.$options.globalData.nim = IM(accid, token)
-      }).catch((msg) => {
-        wx.showModal({ // 使用模态框提示用户进行操作
-          title: '温馨提示：',
-          content: `${msg}`,
-          showCancel: false,
-          success: function (res) {
-            if (res.confirm) {
-              wx.navigateBack({
-                delta: 1
-              })
-            }
-          }
-        })
-      })
-    }
-  }
 })
 </script>
 <config>
@@ -142,6 +116,7 @@ subPackages: [
 'root': 'pages/home',
 'pages': [
 'information',
+'otherHalfDemand',
 'qualitySingle',
 'registration',
 'searchCondition',

src/components/bothwaySlider.wpy

@@ -0,0 +1,162 @@
+<style lang="less">
+  .buyMian-slide {
+    width: 96%;
+    margin: 0 auto;
+
+    .buyMian-slide-contain {
+      width: 100%;
+      display: flex;
+      padding: 20px 0 10px;
+      position: relative;
+
+      .slider-left, .slider-right {
+        margin: 0;
+      }
+    }
+    wx-slider .wx-slider-handle-wrapper{
+      height:20rpx;
+    }
+  }
+</style>
+<template>
+  <view class="buyMian-slide">
+    <view class="buyMian-slide-contain">
+      <slider v-if="!change2" style="width:{{slider1W}}%;z-index:{{zIndexFlag == 1 ? 1 : 3}}" class="slider-left" block-size="18" value="{{slider1Value}}" min="{{min}}" max="{{slider1Max}}" backgroundColor="rgba(255, 83, 128, .8)" activeColor="#f5f5f5" bindchanging="changing" catchtouchstart="changeStart" bindchange="changed" data-idx="1"></slider>
+      <slider v-if="!change" style="width:{{slider2W}}%;z-index:{{zIndexFlag == 2 ? 1 : 3}}" class="slider-right" block-size="18" value="{{slider2Value}}" min="{{slider2Min}}" max="{{max}}" backgroundColor="#f5f5f5" activeColor="rgba(255, 83, 128, .8)" bindchanging="changing" catchtouchstart="changeStart" bindchange="changed" data-idx="2"></slider>
+    </view>
+  </view>
+</template>
+<script>
+  import wepy from '@wepy/core'
+
+  wepy.component({
+    props: {
+      sliderType: {
+        type: String,
+        default: '',
+        twoWay: true
+      },
+      sliderData: {
+        type: Object,
+        default: {},
+        twoWay: true
+      }
+    },
+    data: {
+      getData: true,
+      change: false, // 当两个slider在最右端重合时，将change设置为true，从而隐藏slider2，才能继续操作slider1
+      change2: false, // 当两个slider在最左端重合时，将change2设置为true，从而隐藏slider1，才能继续操作slider2
+      max: 75, // 两个slider所能达到的最大值
+      min: 18,  // 两个slider所能取的最小值
+      rate: 57 / 100, // slider的最大最小值之差和100（或1000）之间的比率 即最大值-最小值/100
+      slider1Max: 75, // slider1的最大取值
+      slider1Value: 22, // slider1的值
+      slider2Value: 50, // slider2的值
+      slider2Min: 18, // slider2的最小取值
+      slider1W: 100, // slider1的宽度
+      slider2W: 0, // slider2的宽度
+      showContent1: 0, // 左边滑块离左边的距离
+      showContent2: 100, // 右边滑块离左边的距离
+      zIndexFlag: 1, // 控制层叠
+      closeTo: 20, // 靠近多少就合并数字 百分比
+      closeToFlag: false, // true时 合并数字
+      closeToPosition: 0// 合并数字的位置
+    },
+    watch: {
+      sliderData() {
+        let vm = this
+        if (vm.sliderType != 'age') {
+          vm.min = 140
+          vm.max = 200
+          vm.rate = 60 / 100
+        } else {
+          vm.min = 18
+          vm.max = 75
+          vm.rate = 57 / 100
+        }
+        vm.slider1Value = vm.sliderData.min
+        vm.slider2Value = vm.sliderData.max
+        if (vm.getData) {
+          vm.showContent1 = 100 - parseInt((vm.max - vm.slider1Value) / vm.rate)
+          vm.showContent2 = 100 - parseInt((vm.max - vm.slider2Value) / vm.rate)
+          let dw = (vm.max - vm.slider1Value) / vm.rate
+          vm.slider2W = dw
+          vm.slider1W = 100 - dw
+          vm.slider1Max = vm.slider1Value
+          vm.slider2Min = vm.slider1Value
+          vm.zIndexFlag = 2
+          vm.change2 = false
+          vm.getData = false
+        }
+      }
+    },
+    mixins: [],
+    methods: {
+      // 开始滑动
+      changeStart (e) {
+        let vm = this
+        let idx = parseInt(e.currentTarget.dataset.idx)
+        if (vm.slider1Value !== vm.slider2Value) {
+          vm.change = false
+          vm.change2 = false
+        }
+        if (idx === 1) {
+          // dW是当前操作的slider所能占据的最大宽度百分数
+          let dW = (vm.slider2Value - vm.min) / vm.rate
+          console.log(dW)
+          vm.slider1W = dW
+          vm.slider2W = 100 - dW
+          vm.slider1Max = vm.slider2Value
+          vm.slider2Min = vm.slider2Value
+          vm.zIndexFlag = 1
+          vm.change = false
+        } else if (idx === 2) {
+          let dw = (vm.max - vm.slider1Value) / vm.rate
+          console.log(dw)
+          vm.slider2W = dw
+          vm.slider1W = 100 - dw
+          vm.slider1Max = vm.slider1Value
+          vm.slider2Min = vm.slider1Value
+          vm.zIndexFlag = 2
+          vm.change2 = false
+        }
+      },
+
+      // 正在滑动
+      changing (e) {
+        let vm = this
+        let idx = parseInt(e.currentTarget.dataset.idx)
+        let value = e.$wx.detail.value
+        if (idx === 1) {
+          vm.slider1Value = value
+          vm.showContent1 = 100 - parseInt((vm.max - vm.slider1Value) / vm.rate)
+        } else if (idx === 2) {
+          vm.slider2Value = value
+          vm.showContent2 = 100 - parseInt((vm.max - vm.slider2Value) / vm.rate)
+        }
+        let myEventDetail = {
+          slider1Value: vm.slider1Value,
+          slider2Value: vm.slider2Value
+        }
+        vm.$emit('compontpass', myEventDetail, vm.sliderType)
+      },
+
+      changed (e) {
+        let vm = this
+        let idx = parseInt(e.currentTarget.dataset.idx)
+        if (idx === 1) {
+          vm.showContent1 = 100 - parseInt((vm.max - vm.slider1Value) / vm.rate)
+        } else if (idx === 2) {
+          vm.showContent2 = 100 - parseInt((vm.max - vm.slider2Value) / vm.rate)
+        }
+        if (vm.slider1Value === vm.slider2Value && vm.slider2Value === vm.max) {
+          vm.change = true
+        }
+        if (vm.slider1Value === vm.slider2Value && vm.slider2Value === vm.min) {
+          vm.change2 = true
+        }
+      }
+    },
+    created() {}
+  })
+</script>

src/pages/home/otherHalfDemand.wpy

@@ -0,0 +1,347 @@
+<style lang="less" scoped>
+@import url(../../styles/theme.less);
+page {
+  background-color: #ffffff;
+}
+.ui-otherHalfDemand{
+  padding-bottom: 200rpx;
+}
+.ui-top-tips{
+  background: #f8f8f8;
+  padding: 20rpx 0
+}
+.ui-demand_box{
+  margin: 34rpx 50rpx 0 50rpx;
+  .demand_item_box{
+    padding-bottom: 50rpx;
+    .demand_item_title{
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+    }
+    .m_tsc {
+      flex-wrap: wrap;
+      .u_tsc_bu {
+        padding: 12rpx 26rpx;
+        line-height: 40rpx;
+        border-radius: 100rpx;
+        background-color: #F8F8F8;
+        margin-right: 46rpx;
+        margin-bottom: 30rpx;
+        .u_add_img {
+          width: 20rpx;
+          height: 20rpx;
+          margin-right: 8rpx;
+        }
+        .u_del_img {
+          width: 16rpx;
+          height: 16rpx;
+          margin-left: 16rpx;
+        }
+      }
+      .u_tsc_bu.sel {
+        color: #F33B6C;
+        background-color: #FFF4F7;
+      }
+    }
+  }
+  .m_sub {
+    width: 100%;
+    position: fixed;
+    bottom: 90rpx;
+    left: 0;
+    .saveButton{
+      width: 520rpx;
+      height: 80rpx;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      background: linear-gradient(270deg, #FF85A5 0%, #FF5380 100%);
+      border-radius: 44px;
+      margin: 0 auto;
+    }
+  }
+}
+.prompt_box{
+  position: relative;
+  display: inline-block;
+  vertical-align: middle;
+  margin-left: auto;
+  margin-right: auto;
+  width: 600rpx;
+  max-width: 100%;
+  background-color: #ffffff;
+  border-radius: 24rpx;
+  overflow: hidden;
+  margin-top: -8vh;
+  .promptTitle{
+    padding: 40rpx 0;
+  }
+  .promptSubTitle{
+    margin: 0 56rpx
+  }
+  .give_up_button{
+    width: 320rpx;
+    height: 68rpx;
+    line-height: 68rpx;
+    border-radius: 34rpx;
+    background: #ff5380;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin: 60rpx auto 0 auto;
+  }
+}
+// 互动条的粗细
+wx-slider .wx-slider-handle-wrapper{
+  height: 12rpx;
+}
+</style>
+<template>
+  <view class="ui-otherHalfDemand" v-if="loading">
+    <view class="ui-top-tips">
+      <view class="font_24 ui-mr-30 ui-ml-30">
+        我们将根据你设置的条件优先给你推荐用户，当满足要求用户不足时，可能会自动放宽匹配条件。规则设置后第二天匹配生效。
+      </view>
+    </view>
+    <view class="ui-demand_box">
+      <view class="demand_item_box">
+        <view class="demand_item_title font_30 color333 bold">
+          你希望Ta的年龄是
+          <view class="color999 bold">{{hopeAgeData.min}}<span class="ui-ml-4 ui-mr-4">-</span>{{hopeAgeData.max}}</view>
+        </view>
+        <bothwaySlider :sliderData.sync="hopeAgeData" @compontpass="changeAge" :sliderType="'age'"></bothwaySlider>
+      </view>
+      <view class="demand_item_box">
+        <view class="demand_item_title font_30 color333 bold">
+          你希望Ta的身高是
+          <view class="color999 bold">{{hopeStatureData.min}}<span class="ui-ml-4 ui-mr-4">-</span>{{hopeStatureData.max}}</view>
+        </view>
+        <bothwaySlider :sliderData.sync="hopeStatureData" @compontpass="changeStature" :sliderType="'stature'"></bothwaySlider>
+      </view>
+      <view class="demand_item_box">
+        <view class="font_30 color333 bold f-fc ui-pb-32">你希望Ta所在的城市 <text class="font_24 color666">（自定义最多选择7个）</text></view>
+        <view class="f-fc m_tsc" style="overflow: hidden">
+          <view class="u_tsc_bu f-fcc font_28 color666 {{tscListLength == 0 ? 'sel' : ''}}" @tap="wholeDelete">同城优先</view>
+          <view class="u_tsc_bu f-fcc font_28 color666 sel" v-for="(item,index) in tscList" :key="index" @tap="deleteTsc(index)">
+            <view>{{item}}</view>
+            <image class="u_del_img" src="https://images.ufutx.com/202106/18/cda8d68011fec82c2672ce5a4ff48a6d.png" mode="aspectFit" lazy-load="false"></image>
+          </view>
+          <view class="u_tsc_bu f-fcc" v-if="tscList.length < 7">
+            <selectCity :multiIndex.sync="multiIndex" @selectCity="selectCity">
+              <view class="f-fc">
+                <image class="u_add_img" src="https://images.ufutx.com/202106/18/2cafc8a1ceb30f23ec10438478d78706.png" mode="aspectFit" lazy-load="false"></image>
+                <view class=" font_28 color666">自定义</view>
+              </view>
+            </selectCity>
+          </view>
+        </view>
+      </view>
+      <view class="demand_item_box">
+        <view class="font_30 color333 bold ui-pb-32">你希望Ta的情感状态是</view>
+        <view class="f-fc m_tsc" style="overflow: hidden">
+          <view v-for="(item,index) in stateList" :key="index" @tap="hopeState(item)" class="u_tsc_bu f-fcc font_28 color666 {{state == item ? 'sel' : ''}}">{{item == '情感不限' ? '都可以' : item}}</view>
+        </view>
+      </view>
+      <view class="demand_item_box">
+        <view class="font_30 color333 bold ui-pb-32">你希望Ta是</view>
+        <view class="f-fc m_tsc" style="overflow: hidden">
+          <view @tap="hopeCertification('1')" class="u_tsc_bu f-fcc font_28 color666 {{ selectCertification == 1 ? 'sel' : ''}}">都可以</view>
+          <view @tap="hopeCertification('2')" class="u_tsc_bu f-fcc font_28 color666 {{ selectCertification == 2 && approveState ? 'sel' : ''}}">认证用户</view>
+        </view>
+      </view>
+      <view class="m_sub f-fcc">
+        <view class="saveButton font_32 white bold" @tap="save">保存</view>
+      </view>
+    </view>
+  </view>
+  <view class="cu-modal {{modalName == 'certification' ? 'show' : ''}}">
+    <view class="prompt_box ui-pb-30">
+      <view class="promptTitle font_36 color-333 bold">提示</view>
+      <view class="font_32 color333 promptSubTitle">为了保证用户的优质和真实，请先成为认证用户</view>
+      <view class="give_up_button font_32 white" @tap="jumpPath">认证</view>
+      <view class="font_28 color999 ui-mt-28" @tap="modalName = ''">取消</view>
+    </view>
+  </view>
+</template>
+
+<script>
+import wepy from '@wepy/core'
+import https from '../../mixins/https'
+import base from '../../mixins/base'
+import {service} from '../../config'
+
+wepy.page({
+  config: {},
+  mixins: [https, base],
+
+  computed: {
+    tscListLength() {
+      return this.tscList.length
+    }
+  },
+  data: {
+    loading: false,
+    modalName: '',
+    approveState: 0, // 用户的认证状态
+    hopeAgeData: {
+      min: 22,
+      max: 75
+    },
+    hopeStatureData: {
+      min: 140,
+      max: 200
+    },
+    tscList: [], // 自定义所在的城市
+    multiIndex: [0, 18, 2], // 自定义所在的城市默认下标
+    state: '情感不限', // 选中的情感状态
+    stateList: ['情感不限', '单身', '离异', '丧偶'],  // 希望Ta的情感状态类型
+    selectCertification: '1' // 希望Ta是都可以还是认证用户
+  },
+  methods: {
+    getInfo() {
+      let vm = this
+      vm.$showLoading('加载中...')
+      vm.$get({url: `${service.host}/moment/home`}).then(({code, data}) => {
+        if (code === 0) {
+          vm.approveState = data.is_real_approved
+        }
+        wx.hideLoading()
+      }).catch(err => {
+        wx.hideLoading()
+        console.log(err)
+      })
+    },
+    getData() {
+      let vm = this
+      vm.$get({url: `${service.host}/preferences`}).then(({code, data}) => {
+        if (code === 0) {
+          if (data.city_list_claim) {
+            vm.tscList = data.city_list_claim.replace(/市/g, '').split(',')
+          }
+          vm.hopeAgeData = {
+            min: data.min_age ? data.min_age : 22,
+            max: data.max_age ? data.max_age : 75
+          }
+          vm.hopeStatureData = {
+            min: data.min_height ? data.min_height : 140,
+            max: data.max_height ? data.max_height : 200
+          }
+          vm.state = data.mate_conditon.state ? data.mate_conditon.state : '情感不限'
+          vm.selectCertification = data.approve_claim
+        }
+        vm.loading = true
+      }).catch(err => {
+        console.log(err)
+      })
+    },
+    // 保存
+    save() {
+      let vm = this
+      let tscListJoint = ''
+      if (vm.tscList.length > 0) {
+        tscListJoint = vm.tscList.join(',')
+      }
+      let data = {
+        min_age: vm.hopeAgeData.min,
+        max_age: vm.hopeAgeData.max,
+        min_height: vm.hopeStatureData.min,
+        max_height: vm.hopeStatureData.max,
+        city_claim: vm.tscList.length == 0 ? 1 : 3,
+        city_list_claim: tscListJoint,
+        state: vm.state,
+        approve_claim: vm.selectCertification
+      }
+      console.log(data, '888')
+      vm.$showLoading('保存中...')
+      vm.$post({url: `${service.host}/preference`, data}).then(({code, data}) => {
+        if (code == 0) {
+          vm.$showToast('保存成功')
+          setTimeout(() => {
+            wx.navigateBack({
+              delta: 1
+            })
+          }, 1200)
+        }
+        wx.hideLoading()
+      }).catch(() => {
+        wx.hideLoading()
+      })
+    },
+    // 滑动条年龄数值
+    changeAge(e) {
+      let vm = this
+      vm.hopeAgeData.min = e.slider1Value
+      vm.hopeAgeData.max = e.slider2Value
+    },
+    // 滑动条身高数值
+    changeStature(e) {
+      let vm = this
+      vm.hopeStatureData.min = e.slider1Value
+      vm.hopeStatureData.max = e.slider2Value
+    },
+    // 删除自定义希望Ta所在的城市
+    deleteTsc(index) {
+      let vm = this
+      vm.tscList.splice(index, 1)
+    },
+    // 选择同城优先后清空自定义
+    wholeDelete() {
+      let vm = this
+      vm.tscList = []
+    },
+    // 组件调用此方法返回选中希望Ta所在的城市
+    selectCity(e, index) {
+      let vm = this
+      let exist = false
+      vm.tscList.forEach((item) => {
+        if (e[2].replace(/市/g, '') == item) {
+          exist = true
+        }
+      })
+      if (exist) {
+        return
+      }
+      vm.tscList.push(e[2].replace(/市/g, ''))
+      console.log(vm.tscList.length, '787777')
+    },
+    // 希望Ta的情感状态
+    hopeState(e) {
+      let vm = this
+      vm.state = e
+    },
+    // 希望Ta的认证状态
+    hopeCertification(e) {
+      let vm = this
+      if (!vm.approveState) {
+        vm.modalName = 'certification'
+        return
+      }
+      vm.selectCertification = e
+    },
+    jumpPath() {
+      wx.navigateTo({url: `/pages/users/realName`})
+    }
+  },
+  onShow() {
+    let vm = this
+    vm.getInfo()
+  },
+  onLoad() {
+    let vm = this
+    vm.getData()
+  }
+})
+</script>
+<config>
+{
+navigationBarTitleText: '对另一半要求',
+enablePullDownRefresh: false,
+backgroundColorTop: '#ffffff',
+backgroundColorBottom: '#ffffff',
+usingComponents: {
+bothwaySlider: '~@/components/bothwaySlider',
+selectCity: '~@/components/selectCity'
+}
+}
+</config>

src/pages/tabBar/welcome.wpy

@@ -12,6 +12,8 @@ page {
 import wepy from '@wepy/core'
 import https from '../../mixins/https'
 import base from '../../mixins/base'
+import {wx_login} from '../../utils/util'
+import { IM } from '../../utils/im'
 
 wepy.page({
   config: {},
@@ -19,13 +21,26 @@ wepy.page({
 
   data: {},
   watch: {},
-  methods: {},
+  methods: {
-  onLoad() {},
+    appLogin() {
-  onShow() {
+      let vm = this
+      let app = vm.$app.$options
+      wx_login().then((e) => {
+        wx.hideLoading()
+        let {accid, token} = e.data.user.wyy_user
+        app.globalData.nim = IM(accid, token)
         setTimeout(() => {
-      this.$gotoTab('/pages/tabBar/home')
+          wx.switchTab({url: `/pages/tabBar/home`})
-    }, 1000)
+        }, 100)
+      }).catch(() => {
+      })
+    }
   },
+  onLoad() {
+    let vm = this
+    vm.appLogin()
+  },
+  onShow() {},
   created() {
   }
 })