<template>
  <u-popup :show="isPw" mode="center" closeable @close="closePw">
    <view class="t_tit mt-20">{{ '支付验证' }}</view>
    <view class="box">
      <view class="mt-20" v-if="isBank">请输入短信验证码</view>
      <view class="mt-20" v-else>请输入密码</view>
      <u--input v-if="isBank" border="surround" v-model="codeValue"></u--input>
      <u--input
        v-else
        border="surround"
        type="password"
        v-model="codeValue"
      ></u--input>
      <u-button
        type="success"
        class="mt-20"
        shape="circle"
        :loading="isLoading"
        loadingText="支付中"
        @tap="payPw()"
        color="linear-gradient(to right, #005BAC, #005BAC )"
        >{{ '立即支付' }}
      </u-button>
    </view>
  </u-popup>
</template>

<script>
export default {
  name: 'PayModal',
  props: {
    isBank: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      isPw: false,
      codeValue: '',
      isLoading: false,
    }
  },
}
</script>

<style lang="scss" scoped>
::v-deep .u-popup__content {
  width: 80%;
}
.box {
  padding: 40px;
  text-align: center;
}
.mt-20 {
  margin-top: 20px;
}
.t_tit {
  text-align: center;
}

.mt-20 {
  margin-bottom: 20px;
}
.mt-20 {
  margin-top: 20px;
}
</style>
