yky-wx-components1/src/components/todoList.js

Taro实现微信小程序红包雨效果

import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text , Swiper, SwiperItem} from '@tarojs/components'
import {AtButton,AtCard,AtTabs, AtTabsPane,AtList, AtListItem,AtTabBar,AtIcon,AtFloatLayout,AtTextarea,AtInput} from 'taro-ui'
import { imgUrl, judgeEmpty, exportBaseUrl, hidebankCard, encrypt,toThousands, CZBANK, openPDF } from '../utils/utils'
import moment from 'moment'
import { get,set} from '../../global_data'
import './index.less'

class approveList extends Component {
  static options = {
    addGlobalClass: true
  }
  SectionCustom = {}
  config = {
    navigationBarTitleText: '审批1',
    navigationBarBackgroundColor:'#F7F7F7',
    navigationBarTextStyle:'white', 
    navigationStyle: "custom",

  }
  // 索引tab栏
  constructor () {
    super(...arguments)
    this.state = {
      current: 0,
      fixedTab:false,
      value: '',
      fuKuanReason:false,
      Beizhuvalue:'',
      EyeFlag:false,
      costInformationCurent:0,
      lendingCount:0
      // sectionCustom: {}
    } 
  }
  refSectionCustom = (ref) => {
    this.SectionCustom = ref
  }
  componentWillReceiveProps (nextProps) {

  }

  componentWillUnmount () {
    
   }
   onLoad(options) {
    console.log(options,'ppp')
    // let item = JSON.parse(options.item)
    // this.setState({
    //   item
    // })
  }
  componentDidShow () { }

  componentDidHide () { }
  // nav-bar高度
  componentDidMount () {

  } 

// 切换卡片信息
onChangeCostInformationByManage = () => {
  this.setState({
    lendingCount: 0
  })

}
onChangeCostInformationByService = () => {
  this.setState({
    lendingCount: 1
  })

}
onChangeInterestExpense = (index) => {
  this.setState({
    lendingCount:index
  })

}
handlecostcardChange(e){
  console.log(e.target.current)
  this.setState({
    lendingCount:e.target.current
  })
 
}


   
     // 选择显示或者隐藏银行卡号
     chooseEye=()=>{
      if(this.state.EyeFlag==false){
           this.setState({
        EyeFlag:true
      })
      }else if(this.state.EyeFlag==true){
        this.setState({
          EyeFlag:false
        })
      }
   
    }
       //显示流程图标
  handleFlowImage(imgUrl,type){
    switch(type){
      case '0':
        return `${imgUrl}workSpace/credit.png`;
      case '1':
        return `${imgUrl}workSpace/sponsor.png`;
      case '2':
        return `${imgUrl}workSpace/loan.png`;
      case '3':
        return `${imgUrl}workSpace/clearing.png`;
      case '4':
        return `${imgUrl}workSpace/repayment.png`;
      case '5':
        return `${imgUrl}workSpace/supplyment.png`;
      case '10':
        return `${imgUrl}workSpace/sponsor.png`;
      case '9':
        return `${imgUrl}workSpace/loan.png`;
      case '8':
        return `${imgUrl}workSpace/clearing.png`;
      case '7':
        return `${imgUrl}workSpace/repayment.png`;
      case '6':
        return `${imgUrl}workSpace/supplyment.png`;
        case '11':
          return `${imgUrl}workSpace/sponsor.png`;
        case '12':
          return `${imgUrl}workSpace/loan.png`;
        case '13':
          return `${imgUrl}workSpace/clearing.png`;
        case '14':
          return `${imgUrl}workSpace/repayment.png`;
        case '15':
          return `${imgUrl}workSpace/supplyment.png`;
      default:
        return '';            
    }
  }
  // 去卡片页
  gotoApprove=(e,flowType)=>{
   console.log(e,flowType)
    Taro.reLaunch({
      
      url: '/pages/approvel/index?flowType=' + flowType
  })
  }
  render () {
   console.log(this.props,this)
   const noInfo ='---'
let {imgUrl,todoTaskList,baseObj}=this.props
const {lendingCount,}=this.state
let obj={}
if(!baseObj){
  baseObj=obj
}
console.log(baseObj,todoTaskList,'lll')
    return (
      <View >
                
           
                <Swiper
              className='todoList-container'
              displayMultipleItems={2.9}
              >
              {
                todoTaskList&&todoTaskList.map((item,index)=>{
                  return (
                    <SwiperItem key={item.processNumber+index} onClick={(e)=>{this.gotoApprove(e,item[baseObj.flowType])}}>
                      <View className='todoList-item'  >
                        <Image className="todoList-item-image" src={this.handleFlowImage(imgUrl,item[baseObj.type])} style="width:40rpx;height:40rpx;"/>
                        <View className="title">{item[baseObj.name]}</View>
                        <View className="num">{item[baseObj.num]}</View>
                      </View>
                    </SwiperItem>
                  )
                })
              }  
              <SwiperItem></SwiperItem>
              <SwiperItem></SwiperItem>
            </Swiper>
             
      
        
      
          
      </View>
      
    )
  }
}


export default approveList