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

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

import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text, Swiper, SwiperItem, Picker } from '@tarojs/components'
import { AtButton, AtCard, AtTabs, AtCheckbox, AtList, AtAccordion, 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 contractSign extends Component {
  static options = {
    addGlobalClass: true
  }
  SectionCustom = {}
  config = {
    navigationBarTitleText: '审批',
    navigationBarBackgroundColor: '#F7F7F7',
    navigationBarTextStyle: 'white',
    navigationStyle: "custom",

  }
  // 索引tab栏
  constructor() {
    super(...arguments)
    this.state = {
      current: 0,
      fixedTab: false,
      value: '',
      fuKuanReason: false,
      Beizhuvalue: '',
      EyeFlag: false,
      costInformationCurent: 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() {
    this.props.onsecondRef(this);
  }



  selectorChange(e,data){
    console.log(e,data)
    data.fn(e)
  }
  //点击合同签署复选框
  handlecbxChange(value) {
    this.setState({
      checkedList: value
    }, () => {
      console.log(this.state.checkedList)
    })
  }
    //打开pdf合同
    handleOpenPDF(url) {
//  const {fileUrl}=this.props
//       // let pdfurl = fileUrl()  + url;
//       let pdfurl = fileUrl()  +  'contracttemplate/1.pdf';
//       openPDF(pdfurl)
this.props.fn1(url)
    }
      //人脸验证
  handleCameraVerify() {
    //需要传receivablesId
    // Taro.navigateTo({
    //   url:`/components/videoVerify/index?receivablesId=${receivablesId}`
    // })
   const {backUrl}=this.props
    Taro.navigateTo({
      url: `/components/branchs/videoVerify/index?backUrl=${backUrl}`
    })
  }
    //交易密码
    handlePasswordChange(value) {
      console.log(value)
      this.setState({
        transactionPassword: value
      })
      return value
    }
  render() {
    console.log(this.props, this, 123)
    let { baseObj, baseInfo, baseFormList ,isContractSign,isContractFormationShow,concartList,testFace,fileUrl} = this.props
    // 这是容错处理，以防乱传数据
    const userInfo = Taro.getStorageSync('userInfo')
   const  checkboxOption = [{
      value: '0',
      label: '是否同意签署',
    },]
  
    return (
      <View >

{
            isContractSign ? <View className="contractSign">

              <AtCard title="合同签署">
                <View className='at-row' style="align-items:center">
                  {
                    isContractFormationShow && <View className='at-col at-col-6'>
                      <AtCheckbox
                        hasBorder={false}
                        options={checkboxOption}
                        selectedList={this.state.checkedList}
                        onChange={this.handlecbxChange.bind(this)}
                      />
                    </View>
                  }

                  {/* {
                    (isContractFormationShow && userInfo.isUkeyUse === 'true') ? <View className='at-col at-col-3'>
                      <AtButton type="primary" size="small" onClick={this.handleCameraVerify.bind(this)}>签署验证</AtButton>
                     
                    </View> : null
                  } */}

                  {
                    (isContractFormationShow && userInfo.isUkeyUse === 'true') ? <View className='at-col at-col-4'>
                      {
                        testFace && <Text style="color:#228B22;font-size:24rpx;margin-left:4rpx">人脸验证成功</Text>
                        //  : <Text style="color:#CD0000;font-size:24rpx;margin-left:4rpx">未进行人脸验证</Text>
                      }
                    </View> : null
                  }

                </View>
                {
                  isContractSign && <View className="pdf-collection">
                      {
                        concartList&&concartList.map((item,index)=>{
                          return(
                        <Text onClick={this.handleOpenPDF.bind(this, '')} className="checkContract">{item.fileName}</Text>
                          )
                        })
                      }
                   
                    {/* {accreditInfo && accreditInfo.yqUrl && <Text onClick={this.handleOpenPDF.bind(this, accreditInfo.yqUrl)} className="checkContract">{'双保理约请书'}</Text>}
                    {accreditInfo && accreditInfo.hzUrl && <Text onClick={this.handleOpenPDF.bind(this, accreditInfo.hzUrl)} className="checkContract">{'坏账担保额度核准书'}</Text>} */}


                  </View>

                }
                {
                  isContractFormationShow && <View className="tradePassword">
                    <AtInput
                      name='transactionPassword'
                      title='交易密码'
                      type='password'
                      placeholder='请输入交易密码！'
                      value={this.state.transactionPassword}
                      onChange={this.handlePasswordChange.bind(this)}
                    />
                  </View>
                }

              </AtCard>
            </View> : null
          }

      </View>

    )
  }
}


export default contractSign