MrShi
5 小时以前 a690229b69cfa0aba5a0352772c2bdc1cf9fdab0
mini-program/pagesA/pages/add-bank-card/add-bank-card.vue
@@ -1,42 +1,181 @@
<template>
   <view class="box">
      <view class="item">
         <view class="item-label">户名</view>
         <view class="item-label"><text style="color: red;">*</text> 户名</view>
         <view class="item-input">
            <input type="text" placeholder="请输入开户人姓名" />
            <input type="text"  :focus='focus' @blur="focus=false"  v-model="form.name" placeholder="请输入开户人姓名" />
         </view>
      </view>
      <view class="item">
         <view class="item-label">账号</view>
         <view class="item-label"><text style="color: red;">*</text>账号</view>
         <view class="item-input">
            <input type="text" placeholder="请输入银行卡号" />
            <input type="number" :focus='focus1' @blur="focus1=false"  v-model="form.bankAccount" placeholder="请输入银行卡号" />
         </view>
      </view>
      <view class="item">
         <view class="item-label">银行</view>
         <view class="item-label"><text style="color: red;">*</text>银行</view>
         <view class="item-input">
            <input type="text" placeholder="请输入开户行支行名称" />
            <input type="text" :focus='focus2' @blur="focus2=false"  v-model="form.bankName" placeholder="请输入开户行支行名称" />
         </view>
      </view>
      <view class="item" style="display: flex; align-items: center; justify-content: space-between;">
         <view class="item-label" style="color: #222222;">设为默认银行</view>
         <u-switch v-model="value" activeColor="#004096"></u-switch>
         <u-switch v-model="form.isDefault" :activeValue="1" :inactiveValue="0" activeColor="#004096"></u-switch>
      </view>
      <view style="width: 100%; height: calc(env(safe-area-inset-bottom) + 108rpx);"></view>
      <!-- <view class="button disable">保存</view> -->
      <view class="footer">
         <view class="footer-btn1">删除银行</view>
         <view class="footer-btn2">确认</view>
         <view class="footer-btn1" v-if="form.id" @click="confirm()">删除银行</view>
         <view class="footer-btn2" @click="confirmEdit()">确认</view>
      </view>
      <u-popup :show="show" round="15" :safeAreaInsetBottom="false" mode="center">
         <view class="tc">
            <view class="tc-contemt">
               <view class="tc-contemt-title">删除操作提示</view>
               <view class="tc-contemt-nr">
                  您确认删除该银行账户信息吗?
               </view>
            </view>
            <view class="tc-btn">
               <view class="tc-btn-item" @click="confirm() ">我再想想</view>
               <view class="tc-btn-item" style="color: red;" @click="confirmDel">确认删除</view>
            </view>
         </view>
      </u-popup>
   </view>
</template>
<script>
   import { mapState } from 'vuex'
   export default {
      computed: {
         ...mapState(['navHeight', 'statusbarHeight','shopInfo', 'shopToken'])
      },
      data() {
         return {
            value: 0
         return {
            id:null,
            shop:{},
            show:false,
            focus:false,
            focus1:false,
            focus2:false,
            loading:false,
            form:{
               id:null,
               bankName:null,
               bankAccount:null,
               name:null,
               isDefault:0
            }
         };
      },
      onLoad(options) {
         this.form={}
         this.shop  ={}
         this.show =false
         this.focus=false
         this.focus1=false
         this.focus2=false
         this.loading=false
         this.checkShopLogin()
         this.shop = this.shopInfo || {}
         this.form={
               id:null,
               bankName:null,
               bankAccount:null,
               name:null,
               isDefault:0
            }
         if(options.item){
            try{
               var tt = JSON.parse(options.item)
         console.log("tt",tt)
               this.form.id=tt.id||''
               this.form.bankName=tt.bankName ||''
               this.form.bankAccount=tt.bankAccount||''
               this.form.name=tt.name||''
               this.form.isDefault=tt.isDefault||0
            }catch(e){
            }
         }
         if(this.form.id){
            uni.setNavigationBarTitle({
               title:'编辑提现银行卡'
            })
         }else{
            uni.setNavigationBarTitle({
               title:'添加提现银行卡'
            })
         }
      },
      methods:{
         confirm(){
            this.show = !this.show
         },
         confirmEdit(){
            if(!this.form.name){
               uni.showToast({
                  'title': '请输入户名',icon:'none'
               })
               this.focus=true
               this.loading=false
               return
            }
            if(!this.form.bankAccount){
               uni.showToast({
                  'title': '请输入账号',icon:'none'
               })
               this.focus1=true
               this.loading=false
               return
            }
             if(!this.form.bankName){
                uni.showToast({
                   'title': '请输入银行信息',icon:'none'
                })
                this.focus2=true
                this.loading=false
                return
             }
            var that =this
            this.$u.api.saveBank(this.form)
               .then(res => {
                  if (res.code === 200) {
                     uni.showToast({
                        title:'操作成功',
                        icon:'success'
                     })
                     uni.$emit('editBank',{})
                     uni.navigateBack({delta:1})
                  }
               }).catch(e=>{
                  uni.showToast({
                     title:'操作失败',
                     icon:'error'
                  })
               })
         },
         async confirmDel(){
            this.show = !this.show
            var that =this
            this.form.tokenType =1
            let res = await that.$u.api.deleteBank({ id: this.form.id ,tokenType:1  });
            if (res.code === 200 ) {
               this.show = false
               uni.$emit('editBank',{})
               uni.navigateBack({delta:1})
            }
         },
         async checkShopLogin(){
            var that =this
            if( this.shopInfo ==null || this.shopInfo.id==null ||  this.shopToken==null || this.shopToken==''){
               uni.navigateTo({
                  url: '/pages/login/login'
               })
            }
         }
      }
   }
</script>
@@ -115,8 +254,7 @@
            input {
               width: 100%;
               font-weight: 400;
               font-size: 30rpx;
               color: #999999;
               font-size: 30rpx;
            }
         }
      }