From c522fd0a15f396a5df30a200c113e7bd2b70f96d Mon Sep 17 00:00:00 2001
From: zhaoxiaoqiang <287285524@qq.com>
Date: Thu, 16 Sep 2021 12:34:23 +0800
Subject: [PATCH] 选项换行
---
src/views/old/store/wx-pay-score.vue | 217 ++++++++++++++++++++++++++++++++++++------------------
1 files changed, 144 insertions(+), 73 deletions(-)
diff --git a/src/views/old/store/wx-pay-score.vue b/src/views/old/store/wx-pay-score.vue
index 468bcea..d00c06d 100644
--- a/src/views/old/store/wx-pay-score.vue
+++ b/src/views/old/store/wx-pay-score.vue
@@ -1,40 +1,52 @@
<!--
* @Date: 2019-08-30 13:38:35
- * @LastEditors: 小明丶
- * @LastEditTime: 2020-12-09 15:17:58
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-09-16 12:33:32
* @Description:
-->
<template>
<div class="hb-credit-installment h-100-g">
- <!-- <x-header title="办理分期" :left-options="{backText:''}"></x-header> -->
- <!-- <tab :line-width=1 active-color='#bfa073'>
- <tab-item v-for="(item, index) in tabList" :key="index" :selected="activeTab === index"
- @on-item-click="handleTabChange(index)">{{ item }}</tab-item>
- </tab> -->
<van-nav-bar
title="和微分"
left-text="返回"
left-arrow
+ fixed
@click-left="onClickLeft"
style="line-height: 43px;"
>
<i
+ v-if='hnOrnxtype==410000'
class="iconfont iconzuojiantou"
slot="left"
style="font-size: 25px;"
></i>
+ <span v-else slot="left" >
+
+ </span>
</van-nav-bar>
<div class="search">
- <selector
- title="活动编码"
+ <van-field
+ rows="1"
+ input-align='right'
+ readonly
+ autosize
+ type="textarea"
+ :label="hnOrnxtype==410000?'活动编码':'活动名称'"
+ :value="contName"
+ placeholder="请选择"
+ @click="showPicker = true"
+ />
+ <!-- <selector
+ :title="hnOrnxtype==410000?'活动编码':'活动名称'"
placeholder="请选择"
@on-change="handleContIdChange"
v-model="contSendCode"
:options="form.cmccWxpayContList"
:value-map="['contCode', 'contName']"
direction="rtl"
- ></selector>
+ ></selector> -->
+
</div>
<group class="group-content">
<div class="title">
@@ -45,30 +57,33 @@
活动信息
</div>
<div class="form-content">
- <x-input
- title="活动ID"
+ <van-field
+ label="活动ID"
v-model.trim="contSendCode"
readonly
- text-align="right"
- ></x-input>
- <x-input
- title="活动名称"
- v-model.trim="contName"
+ input-align="right"
+ ></van-field>
+ <van-field
+ v-model="contName"
+ rows="1"
+ input-align='right'
readonly
- text-align="right"
- ></x-input>
- <x-input
- title="合约期"
+ autosize
+ label="活动名称"
+ type="textarea"
+ />
+ <van-field
+ label="合约期"
v-model.trim="term"
readonly
- text-align="right"
- ></x-input>
- <x-input
- title="担保金额"
+ input-align="right"
+ ></van-field>
+ <van-field
+ label="担保金额"
v-model.trim="guaranteedAmt"
readonly
- text-align="right"
- ></x-input>
+ input-align="right"
+ ></van-field>
</div>
<div style="height: 10px; background: #f5f5f5;"></div>
<div class="title" style="border-radius:6px;">
@@ -106,7 +121,7 @@
clearable
maxlength="11"
type="number"
- placeholder="手机号码"
+ placeholder="请输入手机号码"
>
<van-button
v-if="mblNoType == 0 || mblNoType == 1"
@@ -115,8 +130,7 @@
type="warning"
size="small"
@click="mblVertify"
- >可用查询</van-button
- >
+ >可用查询</van-button>
</van-field>
</div>
</group>
@@ -131,24 +145,32 @@
>
</div>
<Vdialog @cancel="cancel" :show="showDia"></Vdialog>
+ <van-popup v-model="showPicker" round position="bottom">
+ <van-picker
+ show-toolbar
+ :columns="form.cmccWxpayContList"
+ @cancel="showPicker = false"
+ @confirm="handleContIdChange"
+ />
+ </van-popup>
</div>
</template>
<script>
-import QRCode from 'qrcode';
import FConfirmSimple from '@/components/old/FConfirmSimple.vue';
import Vdialog from '@/components/common/v-dialog.vue';
-import { mapState, mapActions } from 'vuex';
-import { Datetime, XAddress } from 'vux';
+import { mapState } from 'vuex';
export default {
name: 'wx-pay-score',
- components: {
- FConfirmSimple,
- Vdialog,
+ components: {FConfirmSimple,Vdialog},
+ computed:{
+ ...mapState(['hnOrnxtype']),
},
data() {
return {
+ showPicker:false,
creditId: '',
+ contType:'',
contId: '', //合约id
contSendCode: '', //合约code
mblType: '',
@@ -186,15 +208,32 @@
isClick:false
};
},
- computed: {},
+
created() {
- this.mblNoType = this.$route.query.mblNoType;
- this.$api.wxScoreInit({ type: this.mblNoType }).then(
- (res) => {
- this.form = res.body || {};
- var arr = res.body.terms;
- },
- (err) => err
+ let apiText ='';
+ let sendData ={};
+ if(this.hnOrnxtype == 410000){
+ // 河南移动
+ this.contType = this.$route.query.code;
+ this.mblNoType = this.$route.query.mblNoType;
+ apiText ='wxScoreInit2';
+ sendData ={type: this.contType}
+ }else{
+ // 宁夏移动
+ apiText ='nxInit';
+ sendData= {};
+ }
+ this.$api[apiText](sendData).then(
+ (res) => {
+ this.form = res.body || {};
+ this.form.cmccWxpayContList = this.form.cmccWxpayContList.map(val=>{
+ return{
+ text:val.contName,
+ ...val
+ }
+ })
+ },
+ (err) => err
);
},
methods: {
@@ -204,15 +243,15 @@
},
// 套餐类型
handleContIdChange(val) {
- let currentEle = JSON.parse(
- JSON.stringify(this.form.cmccWxpayContList)
- ).find((item) => item.contCode === val);
+ console.log(val)
+ let currentEle = JSON.parse( JSON.stringify(this.form.cmccWxpayContList) ).find((item) => item.contCode === val.contCode);
this.contId = currentEle.contId;
this.contSendCode = currentEle.contCode;
this.contName = currentEle.contName;
this.term = currentEle.term;
this.guaranteedAmt = currentEle.guaranteedAmt;
this.monGiftAmt = currentEle.monGiftAmt;
+ this.showPicker =false;
},
// 市区
handleRegionChange(val) {
@@ -225,10 +264,6 @@
// 账号类型
mblVertify(val) {
let v = this.$tool;
- if (v.checkValEmpty(this.mblNoType)) {
- v.toast('请选择手机号类型');
- return false;
- }
if (v.checkValEmpty(this.contSendCode)) {
v.toast('请选择活动套餐');
return false;
@@ -257,16 +292,19 @@
v.toast('请输入正确的用户手机号');
return false;
}
- this.$api
- .wxScoreVertify({
+ let httpText = '';
+ if(this.hnOrnxtype == 410000){
+ httpText ='wxScoreVertify';
+ }else{
+ httpText ='nxVerifyMblNo';
+ }
+ this.$api[httpText]({
cardNo: this.idCardNo,
contCode: this.contSendCode,
mblNo: this.mblNo,
mblNoType: this.mblNoType,
regionCode: this.regionCode,
- })
- .then(
- (res) => {
+ }).then( (res) => {
this.isClick =true;
this.creditId = res.body.creditId;
this.vertifyStatus = res.body.status;
@@ -277,7 +315,7 @@
v.toast('号码可用');
return false;
}
-
+
},
(err) => err
);
@@ -287,10 +325,6 @@
let v = this.$tool;
if (v.checkValEmpty(this.contSendCode)) {
v.toast('请选择活动套餐');
- return false;
- }
- if (v.checkValEmpty(this.mblNoType)) {
- v.toast('请选择手机号类型');
return false;
}
if (v.checkValEmpty(this.userName)) {
@@ -321,18 +355,22 @@
this.vertifyStatus = 1;
}else{
if(!this.isClick){
- v.toast('请先点击可用查询后生成二维码');
- return false;
+ v.toast('请先点击可用查询再生成二维码');
+ return false;
}
}
- // console.log('ces', this.vertifyStatus + '你');
if (this.vertifyStatus == 0) {
v.toast('号码不可用');
return false;
}
- this.$api
- .wxScoreCreate({
- mblNoType: this.mblNoType,
+ let httpText = '';
+ if(this.hnOrnxtype == 410000){
+ httpText ='wxScoreCreate';
+ }else{
+ httpText ='nxCreate';
+ }
+ this.$api[httpText]({
+ contType: this.contType,
creditId: this.creditId,
contId: this.contId,
cardNo: this.idCardNo,
@@ -392,9 +430,10 @@
}
//搜索框
.search {
- margin-bottom: 20px;
padding: 5px 10px;
+ box-sizing: border-box;
}
+
.mer {
width: 100%;
height: 150px;
@@ -433,9 +472,11 @@
}
}
.group-content {
- transform: translateY(-25px);
- width: 96%;
- margin: 0 2%;
+ padding: 10px;
+ box-sizing: border-box;
+ // transform: translateY(-25px);
+ // width: 96%;
+ // margin: 0 2%;
}
/deep/.weui-cells {
border-radius: 6px;
@@ -456,8 +497,9 @@
.hb-credit-installment {
background-color: #f5f5f7;
- // padding-top: 54px;
+ padding:50px 0;
min-height: 100%;
+ box-sizing: border-box;
.title {
padding: 14px 0px 14px 12px;
font-size: 16px;
@@ -498,7 +540,6 @@
}
}
.btn-box {
- margin-top: 40px;
margin-bottom: 22px;
display: flex;
justify-content: space-around;
@@ -514,3 +555,33 @@
}
}
</style>
+<style lang="less">
+.van-nav-bar{
+ z-index: 10;
+}
+.weui-select{
+ font-size: 14px;
+}
+.weui-label{
+ font-size: 14px;
+}
+.van-cell .van-cell__title{
+ font-size: 14px !important;
+}
+.van-field__body{
+ font-size: 14px !important;
+}
+.van-picker-column__wrapper{
+ line-height:24px !important;
+}
+.van-ellipsis{
+ font-size:12px ;
+ overflow: inherit;
+ white-space: inherit;
+ text-overflow: inherit;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+</style>
\ No newline at end of file
--
Gitblit v1.8.0