You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

249 lines
5.2 KiB

<template>
<view class="changecontainer">
<view class="cardindexbox">
<view class="myswiper">
<swiper class="swiper" circular :indicator-dots="true" :indicator-color="indicatorColor"
:indicator-active-color="indicatorActiveColor" :autoplay="autoplay" :interval="interval"
:duration="duration" :current="currentSwiperIndex" @change="onSwiperChange">
<swiper-item v-for="item in banner3">
<view class="swiper-item">
<image :src="item.image" mode="widthFix"></image>
</view>
</swiper-item>
</swiper>
</view>
<view class="formChange">
<u-form :model="form" ref="uForm">
<u-form-item class="formitem card_number" prop="card_number" :border-bottom="false">
<u-input type="text" v-model="form.card_number" placeholder="请输入卡号" />
</u-form-item>
</u-form>
<u-button class="formitem submitform" form-type="submit" :plain="true" @click="goSubmit">点击查询</u-button>
</view>
</view>
</view>
</template>
<script>
import {
toast,
isNull
} from '@/common/util.js'
export default {
components: {},
data() {
return {
autoplay: true,
interval: 3000,
duration: 500,
indicatorColor: 'rgba(204,204,203,.5)',
indicatorActiveColor: '#b98b44',
currentSwiperIndex: 0,
form: {
code: '',
},
banner3:[]
}
},
onLoad(option) {
this.banner3 = uni.getStorageSync("banner3") ? uni.getStorageSync("banner3") : []
},
methods: {
onSwiperChange(e) {
this.currentSwiperIndex = e.detail.current;
},
getScanCode() {
// uni.scanCode({
// onlyFromCamera: false,
// scanType: ['qrCode', 'barCode', 'dataMatrix'],
// success: res => {
// if (res.errMsg == 'scanCode:ok') {
// this.form.code = res.result
// } else {
// uni.showToast({
// title: '扫码失败',
// icon: "none",
// mask: true,
// })
// }
// },
// fail: err => {
// console.log(JSON.stringify(err))
// }
// })
},
goSubmit() {
if (isNull(this.form.card_number)) {
toast('请填写卡号')
return
}
this.$u.api.getDates(this.form).then(res => {
switch (res.card.status){
case -1:
toast('已销卡')
break;
case 0:
toast('末出库')
break;
case 1:
toast('待激活')
break;
case 2:
uni.setStorageSync('vuex_card_state', {
card_number: this.form.card_number,
card: res.card
})
uni.navigateTo({
url: '/packages/card/detail'
})
break;
case 3:
toast('已使用')
break;
default:
break;
}
}).then(res => {
// console.log("ressssss",res)
// toast(res)
})
}
}
}
</script>
<style scoped lang="scss">
.changecontainer {
width: 100%;
background-image: url(../../static/bg-change.jpg);
background-position: center top;
background-size: cover;
// padding-top: 195rpx;
// padding-bottom: 520rpx;
height: 100vh;
display: flex;
align-items: center;
}
.cardindexbox {
width: 87.33%;
margin: 0 auto;
background: #fff;
border-radius: 10rpx;
overflow: hidden;
padding: 54rpx 46rpx;
}
.myswiper {
position: relative;
}
.swiper {
padding-bottom: 48rpx;
overflow: hidden;
}
/deep/ swiper-item {
border-radius: 10rpx;
overflow: hidden;
}
//
/deep/ .uni-swiper-dots {
bottom: -48rpx !important;
}
/deep/ .uni-swiper-wrapper {
overflow: initial;
}
/deep/ .wx-swiper-wrapper {
overflow: initial !important;
}
/deep/ .wx-swiper-dots {
bottom: -48rpx !important;
}
/deep/ .swiper-item image {
width: 100%;
height: auto;
// border-radius: 10rpx;
}
.formChange {
width: 450rpx;
margin: 0 auto;
margin-top: 104rpx;
}
/deep/ .u-form-item {
margin-bottom: 40rpx;
height: 74rpx;
width: 100%;
line-height: 74rpx;
border-radius: 50rpx;
background-color: #f4f3f2;
border: none;
padding: 0 !important;
border: none !important;
font-size: 20rpx;
color: #676767;
}
/deep/ .u-form-item.password {
background-image: url(../../static/icon-change2.png);
}
/deep/ .u-input {
padding: 0 10rpx !important;
}
/deep/ .u-form-item .u-input__input {
display: block;
border: none;
width: 100%;
height: 74rpx;
line-height: 74rpx;
color: #676767 !important;
font-size: 26rpx !important;
padding-left: 94rpx;
padding-right: 30rpx;
background-position: left 30rpx center;
background-size: 38rpx auto;
background-repeat: no-repeat;
}
/deep/ .card_number .u-input__input {
background-image: url(../../static/icon-change1.png) !important;
}
/deep/ .password .u-input__input {
background-image: url(../../static/icon-change2.png) !important;
}
/deep/ .u-btn {
color: #b98b44 !important;
font-size: 26rpx !important;
font-weight: bold;
padding: 0;
height: 74rpx !important;
width: 100%;
line-height: 74rpx !important;
border-radius: 50rpx;
background-color: #f4f3f2 !important;
}
/deep/ .u-btn::after {
display: none;
}
</style>