123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287 |
- <style lang="scss">
- .app-body{
- padding: 10px 0;
- .input-form {
- background: #fff;
- .item{
- padding: 35rpx 20rpx;
- border-bottom: 1px solid #f1f1f1;
- .label{
- width: 86px;
- font-weight: 400;
- color: #333;
- }
- .value{
- width: calc(100% - 86px);
- }
- }
-
- }
- }
- .input-placeholder {
- color: #999;
- }
-
- .sbtn{
- font-size: 14px;
- color: #DB292B;
- margin-right: 10rpx;
- }
- .no-sbtn{
- font-size: 14px;
- color: #999999;
- margin-right: 10rpx;
- }
-
- .foot{
- padding: 40rpx 60rpx;
- }
-
- .btn{
- background: #DB292B;
- border-radius: 60rpx;
- text-align: center;
- font-weight: bold;
- font-size: 28rpx;
- padding: 30rpx 0;
- color: #FAFAFA;
- }
-
- .img{
- width: 160rpx;
- height: 160rpx;
- }
- </style>
- <template>
- <view class="app-body">
-
- <view class="input-form">
- <view class="item fx-r fx-bc">
- <view class="label">真实姓名</view>
- <view class="value">
- <input type="text" v-model="form.name" placeholder-class="input-placeholder" placeholder="请输入真实姓名" />
- </view>
- </view>
-
- <view class="item fx-r fx-bc">
- <view class="label">支付宝账号</view>
- <view class="value">
- <input type="text" v-model="form.payment" placeholder-class="input-placeholder" placeholder="请输入支付宝账号" />
- </view>
- </view>
-
-
-
-
- <view class="item fx-r fx-bc">
- <view class="label">验证码</view>
- <view class="value fx-r ">
- <input type="number" v-model="form.verify" placeholder-class="input-placeholder" style="width: 186px;" placeholder="请输入验证码" />
- <view class="fx-g1"></view>
- <view v-if="verifyCount <= 0" class="sbtn" @tap="getVcode">验证码</view>
- <view v-else class="no-sbtn">{{ verifyCount }} S</view>
- </view>
- </view>
-
- <view class="item fx-r fx-bc">
- <view class="label">收款码</view>
- <view class="value" @tap="upImg" >
- <image src="/static/img/upimg.png" v-if="form.img == ''" class="img"></image>
- <image :src="form.img" v-else mode="aspectFill" class="img"></image>
- </view>
- </view>
-
- </view>
-
-
- <view class="foot">
- <view class="btn ihover" @tap="tapSubmit">保存</view>
- </view>
-
- </view>
-
-
- </template>
- <script>
- import {mapState,mapMutations} from 'vuex';
- export default {
- computed: mapState(['user']),
- data() {
- return {
- form : {
- img : "",
- name : ""
- },
- verifyCount : 0,
- type : 2
- }
- },
- onLoad(options) {
- this.getData();
- },
- methods: {
-
- getData:function(e){
- uni.showLoading({ title: '获取数据中..' });
- var that = this;
- this
- .request
- .post("getBankItem",{type : this.type})
- .then(res => {
- uni.hideLoading();
- if(res.code == 200) {
- if(res.data != null) this.form = res.data;
- } else {
- that.utils.Tip(res.msg);
- }
- }).catch(res => {
- uni.hideLoading();
- that.utils.Tip(res.msg);
- });
- },
-
- getVcode: function() {
- if (this.verifyCount > 0) return;
- uni.showLoading({ title: "获取中..."});
- this
- .request
- .post("userYzm",{type : "bank"})
- .then(res => {
- uni.hideLoading();
- if (res.code == 200) {
- if (res.data.status == 2) {
- this.utils.CountDowm(res.data.time, (e, s) => {
- this.verifyCount = e;
- });
- }
-
- if (res.data.status == 1) {
- this.utils.CountDowm(120, (e, s) => {
- this.verifyCount = e;
- });
- }
- } else {
- uni.showToast({
- title: res.msg,
- mask: true,
- icon: 'none'
- });
- }
- })
- .catch(err => {
- uni.showToast({
- title: '获取失败',
- mask: true,
- icon: 'none'
- });
- uni.hideLoading();
- });
- },
-
- upImg(){
-
- this.$store.dispatch('permission/requestPermissions', 'WRITE_EXTERNAL_STORAGE').then(res => {
- if(res !== 1) return;
- this.upImgS();
- });
- return;
-
- this.upImgS();
- },
-
-
- upImgS() {
- uni.chooseImage({
- count: 1,
- sizeType: ['compressed'],
- success: (res) => {
- let img = res.tempFilePaths[0];
- this.utils.loadIng();
- this
- .request
- .post("qiniu")
- .then(res=>{
- uni.uploadFile({
- url: 'https://up-z0.qiniup.com',
- filePath: img,
- name: 'file',
- formData: {
- 'key': res.data.mk_str,
- 'token': res.data.token
- },
- success: (uploadFileRes) => {
- uni.hideLoading();
- if(uploadFileRes.statusCode == 200) {
- this.form.img = res.data.url;
- } else {
- this.utils.Tip("上传失败,请重新尝试," + JSON.stringify(uploadFileRes));
- }
-
- },
- fail:()=>{
- uni.hideLoading();
- this.utils.Tip("上传失败,请重新尝试");
- }
- });
- })
- .catch(err=>{
- uni.hideLoading();
- this.utils.Tip("请重新上传图片");
- });
- }
- });
- },
-
- tapSubmit:function(e){
-
- if(this.form.name == ""){
- uni.showToast({
- title:"请输入真实姓名",icon:"none",mask:true
- })
- return;
- }
-
- if(this.form.payment == ""){
- uni.showToast({
- title:"请输入支付宝账号",icon:"none",mask:true
- })
- return;
- }
-
-
- if (this.form.verify == '') {
- uni.showToast({
- title: '请输入验证码',
- mask: true,
- icon: 'none'
- });
- return;
- }
-
- uni.showLoading({ title: '提交数据中..' });
- this.request
- .post("bankSave",{
- ...this.form,
- type : this.type
- })
- .then(res=>{
- uni.hideLoading();
- if(res.code == 200) {
- uni.navigateBack();
- } else {
- uni.showToast({ title:res.msg,icon:"none",mask:true});
- }
- })
- .catch(res=>{
- uni.hideLoading();
- uni.showModal({title: '系统提示',content: '加载失败,重新点击尝试!',showCancel: false});
- });
- }
- }
- }
- </script>
|