js

pages/mine/coupdz.vue

@@ -2,21 +2,21 @@
     <view class="page-userCoupdz">
         <navElement title="京东卡"></navElement>
         <view class="list" v-if="list.length > 0">
-            <view class="box" v-for="(item, index) in list" :key="item.id">
+            <view class="box" v-for="(item, index) in list" :key="item.id" :class="{ curr: curr == index }">
                 <view class="p1 row bothSide verCenter">
                     <text class="t1">{{ item.name }}</text>
                     <view class="row verCenter">
                         <text class="iconfont icon-juxing"></text>
-                        <text class="t2" @click="open()">查看</text>
+                        <text class="t2" @click="open(item.id)">查看</text>
                     </view>
                 </view>
                 <view class="p2 row verCenter">
                     <text class="t1">卡号：</text>
                     <text class="t2">{{ item.card_number }}</text>
-                    <text class="iconfont icon-juxing3" style="margin-right: 57rpx;"></text>
+                    <text class="iconfont icon-juxing3" style="margin-right: 57rpx;" v-if="curr == index" @click.stop="copy(item.card_number)"></text>
                     <text class="t1">密钥：</text>
                     <text class="t2">{{ item.card_password }}</text>
-                    <text class="iconfont icon-juxing3"></text>
+                    <text class="iconfont icon-juxing3" v-if="curr == index" @click.stop="copy(item.card_password)"></text>
                 </view>
                 <view class="p3">有效期：{{ item.period_validity }}</view>
                 <view class="p4">创建时间：{{ item.allocate_time_format }}</view>
@@ -31,7 +31,7 @@
             <view class="layer-box">
                 <view class="title row verCenter bothSide">
                     <view class="left">获取电子券信息</view>
-                    <view class="right row"><text class="iconfont icon-xxx" @click="close()"></text></view>
+                    <view class="right row"><text class="iconfont icon-xxx" @click.stop="close()"></text></view>
                 </view>
                 <view class="show-input row verCenter" style="margin-bottom: 24rpx;">
                     <text class="t1">手机号：</text>
@@ -40,14 +40,14 @@
                 <view class="input-box row verCenter" style="margin-bottom: 16rpx;" v-if="verify_flag">
                     <text class="t1">图形验证码：</text>
                     <input type="text" placeholder="" class="uni-input" v-model="formParams.verify" />
-                    <image :src="url" class="code-pic" @click="refresh()"></image>
+                    <image :src="url" class="code-pic" @click.stop="refresh()"></image>
                 </view>
                 <view class="input-box row verCenter" style="margin-bottom: 32rpx;">
                     <text class="t1">短信验证码：</text>
                     <input type="number" inputmode="numeric" placeholder="" class="uni-input" v-model="formParams.sms_verify" />
-                    <text class="code-text" @click="countdownChange()" :class="{ disabled: code_disabled }">{{ code_text }}</text>
+                    <text class="code-text" @click.stop="countdownChange()" :class="{ disabled: code_disabled }">{{ code_text }}</text>
                 </view>
-                <view class="btn row rowCenter verCenter">提 交</view>
+                <view class="btn row rowCenter verCenter" @click="viewVoucherWithOutEncryption()">提 交</view>
             </view>
         </uni-popup>
     </view>
@@ -64,6 +64,7 @@ export default {
     },
     data() {
         return {
+            curr: -1,
             code_text: '获取验证码',
             code_disabled: false,
             verify_flag: false, //是否显示图形验证码
@@ -74,6 +75,7 @@ export default {
                 limit: 1000
             },
             formParams: {
+                id: '',
                 account: '',
                 verify: '',
                 sms_verify: ''
@@ -84,6 +86,19 @@ export default {
         this.getData();
     },
     methods: {
+        /**
+         * @param {Object} arr
+         * @param {Object} target
+         */
+        findIndex(arr, target) {
+            const result = [];
+            arr.map((item, index) => {
+                if (item.id == target) {
+                    result.push(index);
+                }
+            });
+            return result;
+        },
         getData() {
             this.request(Api_Url + '/user/getUserType', 'POST', {}, true, true).then(res => {
                 if (res.err_code === 0) {
@@ -107,8 +122,7 @@ export default {
             var Yo4teW_gid = getCookie('Yo4teW_gid');
             var Yo4teW_csrf = getCookie('Yo4teW_csrf');
             var Yo4teW_uid = getCookie('Yo4teW_uid');
-
-            this.url = Code_Url + '?time=' + new Date().getTime() + '&pf=2&Yo4teW_gid=' + Yo4teW_gid + '&Yo4teW_csrf=' + Yo4teW_csrf + '&Yo4teW_uid=' + Yo4teW_uid + '&id=2';
+            this.url = Code_Url + '?time=' + new Date().getTime() + '&pf=2&Yo4teW_gid=' + Yo4teW_gid + '&Yo4teW_csrf=' + Yo4teW_csrf + '&Yo4teW_uid=' + Yo4teW_uid + '&id=1';
         },
         /**
          * 手机验证码
@@ -170,11 +184,51 @@ export default {
                 }
             });
         },
-        open() {
+        /**
+         * 提交
+         */
+        viewVoucherWithOutEncryption() {
+            this.request(Api_Url + '/voucher/viewVoucherWithOutEncryption', 'POST', { account: this.formParams.account, sms_verify: this.formParams.sms_verify, id: this.formParams.id }, true, true).then(res => {
+                if (res.err_code === 0) {
+                    uni.showToast({
+                        title: '验证成功',
+                        icon: 'success'
+                    });
+                    setTimeout(() => {
+                        this.close();
+                        let index = this.findIndex(this.list, res.data.id);
+                        this.$set(this.list[index], 'card_number', res.data.card_number);
+                        this.$set(this.list[index], 'card_password', res.data.card_password);
+                        this.curr = index[0];
+                    }, 2000);
+                } else {
+                    uni.showToast({
+                        title: res.err_msg,
+                        icon: 'none'
+                    });
+                }
+            });
+        },
+        open(id) {
+            this.formParams.id = id;
             this.$refs.popup.open('center');
         },
         close() {
             this.$refs.popup.close();
+        },
+        /**
+         * 复制
+         */
+        copy(val) {
+            uni.setClipboardData({
+                data: val,
+                success() {
+                    uni.showToast({
+                        title: '复制成功',
+                        icon: 'success'
+                    });
+                }
+            });
         }
     }
 };