Commit 3f723232 authored by 刘用法's avatar 刘用法

数字键盘

parent af6dd7e2
......@@ -17,6 +17,16 @@
type: String,
default: '请输入'
},
item: {
type: Object,
default() {
return {}
}
},
type: {
type: String,
default: 'text'
}
// width: { // 例如:454rpx
// type: String,
// default: '100%'
......@@ -24,32 +34,36 @@
},
data() {
return {
maxlength: 140,
inputType: 'text',
// type: 'text'
}
},
computed: {
type() {
if (this.item) {
let ty = this.item.fieldsType.toLocaleLowerCase()
switch (ty) {
case 'text':
return 'textarea'
case 'password':
return this.item.fieldsType
case 'decimal':
case 'number':
case 'double':
case 'integer':
this.maxlength = 9
return 'digit'
case 'textarea':
default:
return 'text'
}
} else {
return 'text'
}
// type() {
// if (this.item) {
// let ty = this.item.fieldsType.toLocaleLowerCase()
// switch (ty) {
// case 'text':
// return 'textarea'
// case 'password':
// return this.item.fieldsType
// case 'decimal':
// case 'number':
// case 'double':
// case 'integer':
// this.maxlength = 9
// return 'digit'
// case 'textarea':
// default:
// return 'text'
// }
// } else {
// return 'text'
// }
// },
maxlength() {
return this.type == 'digit' ? 9 : 140
},
fieldsWidth() {
return this.item.fieldsWidth ? (this.item.fieldsWidth + 'rpx') : '100%'
......@@ -71,7 +85,7 @@
return this.textarea
},
textarea() {
return this.type == 'textarea'
return this.inputType == 'textarea'
},
backgroundColor() {
return this.textarea ? 'transparent' : '#F4F5F7'
......
......@@ -3,7 +3,7 @@
<view>
<view class="list u-flex u-row-between">
<image class="item-image" :src="mixingImage" v-if="item.required"></image>
<view class="u-m-r-20">{{item.fieldsTitle}}</view>
<view class="u-m-r-20 title-text">{{item.fieldsTitle}}</view>
<view class="u-flex-1 location-name" >{{valueTxt}}</view>
</view>
</view>
......@@ -55,13 +55,18 @@
line-height: 40rpx;
color: #fa3534;
}
.title-text {
font-size: 26rpx;
color: #333333;
}
.item-image {
width: 24rpx;
height: 24rpx;
margin-right: 10rpx;
}
.location-name {
color: #2272FF;
color: #333333;
font-size: 26rpx;
text-align: right;
}
.location {
......
<!-- ******************* 输入框 ******************* -->
<template>
<view>
<view class="list u-flex u-row-between">
<view class="list u-flex item-row-between">
<view class="item-title">
<image class="item-image" :src="mixingImage" v-if="item.required"></image>
<view class="u-m-r-20">{{item.fieldsTitle}}</view>
<view class="u-flex-1 location-name" @click="toMaterialPage">
<u-icon name="map" color="#2979ff" size="30"></u-icon>请选择
</view>
<view class="location-name" @click="toMaterialPage">
<text class="arrow-text">{{arrowText}}</text>
<u-icon name="arrow-right" color="#2979ff" size="30"></u-icon>
</view>
</view>
<!-- <view class="u-flex-1 location">{{valueTxt || '正在获取中...'}}</view> -->
......@@ -36,6 +39,9 @@
computed: {
mixingImage() {
return process.uniEnv.qn_base_url + 'mixing.png'
},
arrowText() {
return false ? '已选择' : '请选择'
}
},
watch: {},
......@@ -57,7 +63,7 @@
}
</script>
<style scoped>
<style lang="scss" scoped>
.required {
padding-right: 10rpx;
font-size: 28rpx;
......@@ -69,10 +75,29 @@
height: 24rpx;
margin-right: 10rpx;
}
.item-row-between {
display: flex;
align-items: center;
justify-content: space-between;
.item-title {
display: flex;
font-size: 26rpx;
color: #333333;
align-items: center;
}
.location-name {
color: #2272FF;
text-align: right;
font-size: 26rpx;
display: flex;
align-items: center;
.arrow-text {
margin-right: 6rpx;
}
}
}
.location {
background: #F4F5F7;
padding: 10rpx 20rpx;
......
......@@ -29,7 +29,7 @@
{{item.fieldsTitle}}
</view>
<template v-if="item.fieldsType">
<xh-input v-if="typeToComponentType(item.fieldsType)==='input'" :groupIndex="groupIndex"
<xh-input v-if="typeToComponentType(item.fieldsType)==='input'" :groupIndex="groupIndex" :type="inputType(item.fieldsType)"
:itemIndex="itemIndex" :item="item" :value='form[item.fieldsName] || ""' @value-change="fieldValueChange">
</xh-input>
<xh-multi-input v-else-if="typeToComponentType(item.fieldsType)==='multiinput'"
......@@ -487,6 +487,30 @@
})
}
},
inputType(type) {
var inputType = ''
let ty = type.toLocaleLowerCase()
switch (ty) {
case 'text':
inputType = 'textarea'
break
case 'password':
inputType = ty
break
case 'decimal':
case 'number':
case 'double':
case 'integer':
inputType = 'digit'
break
case 'textarea':
default:
inputType = 'text'
break
}
return inputType
},
typeToComponentType(type) {
// 将fieldType类型统一转换为公共组件判定类型
let formType = ''
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment