|
|
@@ -24,12 +24,11 @@
|
|
|
手机号码 <span>{{ info.phone }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <el-checkbox size="124px" v-model="checked"></el-checkbox>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="info">
|
|
|
+ <!-- <div class="info">
|
|
|
<div class="price">
|
|
|
<span class="text1">应付金额</span>
|
|
|
<img src="../assets/icon_jiage.png" alt="" />
|
|
|
@@ -41,10 +40,24 @@
|
|
|
<span class="text2">{{ orderInfo.id }}</span>
|
|
|
<el-button type="info" @click="copy" size="mini" plain>复制</el-button>
|
|
|
</div>
|
|
|
+ </div> -->
|
|
|
+ <el-form :model="form" ref="numberValidateForm" label-width="85px" class="demo-ruleForm">
|
|
|
+ <div class="title">请输入交易密码,验证信息</div>
|
|
|
+ <el-form-item prop="password">
|
|
|
+ <el-input
|
|
|
+ style="width: 300px; margin: 20px 0 0 100px"
|
|
|
+ type="number"
|
|
|
+ v-model="form.password"
|
|
|
+ placeholder="请输入纯数字交易密码"
|
|
|
+ autocomplete="off"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div @click="all('/transaction')" class="password">
|
|
|
+ <el-link> 忘记密码?</el-link>
|
|
|
</div>
|
|
|
-
|
|
|
<div class="payMethods">
|
|
|
- <div class="title">选择支付方式</div>
|
|
|
+ <div class="title">支付GAS</div>
|
|
|
<div class="pay-list">
|
|
|
<div class="pay-info">
|
|
|
<el-radio-group v-model="payMethods">
|
|
|
@@ -56,8 +69,14 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
- <div class="tips">
|
|
|
+ <div class="price">
|
|
|
+ 应付金额<span class="span">{{ gas }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="qrcode">
|
|
|
+ <vue-qrcode :value="payUrl" :options="{ width: 140, margin: 1 }" class="code"></vue-qrcode>
|
|
|
+ </div>
|
|
|
+ <div class="qrcode-text">二维码有效时常为5分钟,请尽快支付</div>
|
|
|
+ <!-- <div class="tips">
|
|
|
<div class="text1">购买须知</div>
|
|
|
<div class="text2">
|
|
|
1.数字盲盒按照随机概率进行抽取<br />
|
|
|
@@ -65,23 +84,31 @@
|
|
|
3.数字盲盒及其数字内容仅作为消费娱乐(或其他约定场景)使用<br />
|
|
|
4.切勿当成投资和投机品进行盲目消费
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
</div>
|
|
|
|
|
|
- <span slot="footer" class="dialog-footer">
|
|
|
+ <!-- <span slot="footer" class="dialog-footer">
|
|
|
<el-button type="primary" class="pay" @click="submit">立即支付</el-button>
|
|
|
- </span>
|
|
|
+ </span> -->
|
|
|
</el-dialog>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import vueQrcode from '@chenfengyuan/vue-qrcode';
|
|
|
+import resolveUrl from 'resolve-url';
|
|
|
export default {
|
|
|
+ components: {
|
|
|
+ vueQrcode
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
payMethods: 'ALIPAY',
|
|
|
show: false,
|
|
|
info: [],
|
|
|
checked: true,
|
|
|
+ id: 103,
|
|
|
+ form: { password: '' },
|
|
|
+ gas: 1,
|
|
|
payList: [
|
|
|
{
|
|
|
icon: require('../assets/alipay.png'),
|
|
|
@@ -104,34 +131,65 @@ export default {
|
|
|
phone: ''
|
|
|
};
|
|
|
},
|
|
|
- // mounted() {
|
|
|
- // this.init();
|
|
|
- // },
|
|
|
+ mounted() {
|
|
|
+ this.$http.get('/sysConfig/get/gas_fee').then(res => {
|
|
|
+ this.gas = res.value;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ payUrl() {
|
|
|
+ return resolveUrl(this.$baseUrl, '9th/submit?id=' + this.info.id);
|
|
|
+ }
|
|
|
+ },
|
|
|
methods: {
|
|
|
submit() {
|
|
|
- if (this.payMethods === 'DCEP') {
|
|
|
- this.wait();
|
|
|
- }
|
|
|
- },
|
|
|
- init(info) {
|
|
|
- this.checkLogin()
|
|
|
- .then(() => {
|
|
|
- this.show = true;
|
|
|
- this.loading = true;
|
|
|
- console.log(this.$route.query.id);
|
|
|
- // return this.$http.get('/order/get/' + this.$route.query.id);
|
|
|
- // return this.$http.post('/order/create?collectionId=' + info.id + '&qty=1');
|
|
|
+ // if (this.payMethods === 'DCEP') {
|
|
|
+ // this.wait();
|
|
|
+ // }
|
|
|
+ this.$http
|
|
|
+ .post('/user/verifyTradeCode', {
|
|
|
+ tradeCode: this.form.password
|
|
|
})
|
|
|
- .then(res => {
|
|
|
- this.orderInfo = res;
|
|
|
- this.loading = false;
|
|
|
+ .then(() => {
|
|
|
+ this.$http
|
|
|
+ .post('/asset/gift', {
|
|
|
+ assetId: this.$route.query.id,
|
|
|
+ toUserId: this.id
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ console.log(res);
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ if (e) {
|
|
|
+ this.$message(e.error);
|
|
|
+ }
|
|
|
+ });
|
|
|
})
|
|
|
.catch(e => {
|
|
|
if (e) {
|
|
|
- this.$message.warning(e.error);
|
|
|
+ this.$message('失败点击忘记密码进行修改');
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
+ // init(info) {
|
|
|
+ // this.checkLogin()
|
|
|
+ // .then(() => {
|
|
|
+ // this.show = true;
|
|
|
+ // this.loading = true;
|
|
|
+ // console.log(this.$route.query.id);
|
|
|
+ // // return this.$http.get('/order/get/' + this.$route.query.id);
|
|
|
+ // // return this.$http.post('/order/create?collectionId=' + info.id + '&qty=1');
|
|
|
+ // })
|
|
|
+ // .then(res => {
|
|
|
+ // this.orderInfo = res;
|
|
|
+ // this.loading = false;
|
|
|
+ // })
|
|
|
+ // .catch(e => {
|
|
|
+ // if (e) {
|
|
|
+ // this.$message.warning(e.error);
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // },
|
|
|
copy() {
|
|
|
this.$copyText(this.orderInfo.id).then(
|
|
|
e => {
|
|
|
@@ -149,6 +207,7 @@ export default {
|
|
|
})
|
|
|
.then(res => {
|
|
|
this.info = res;
|
|
|
+ this.id = res.id;
|
|
|
if (this.info.length === 0) {
|
|
|
this.empty = true;
|
|
|
}
|
|
|
@@ -173,6 +232,17 @@ export default {
|
|
|
/deep/ .el-checkbox__label {
|
|
|
margin-right: 20px;
|
|
|
}
|
|
|
+.qrcode {
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+.qrcode-text {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #939599;
|
|
|
+ line-height: 24px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
.info {
|
|
|
.flex();
|
|
|
height: 94px;
|
|
|
@@ -221,7 +291,30 @@ export default {
|
|
|
/deep/.el-loading-mask {
|
|
|
background-color: #ffffffee;
|
|
|
}
|
|
|
-
|
|
|
+.title {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #000000;
|
|
|
+ line-height: 24px;
|
|
|
+}
|
|
|
+.password {
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+.price {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #000000;
|
|
|
+ line-height: 24px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+.span {
|
|
|
+ font-size: 40px;
|
|
|
+ font-family: 'OSP';
|
|
|
+ font-weight: normal;
|
|
|
+ color: #ff4f50 !important;
|
|
|
+ line-height: 36px;
|
|
|
+ margin-left: 3px;
|
|
|
+}
|
|
|
/deep/.el-radio {
|
|
|
.flex();
|
|
|
display: inline-flex;
|