|
|
@@ -24,8 +24,12 @@
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
- <view style="position: relative;">
|
|
|
+ <view class="search-container">
|
|
|
<input class="input-serach_box" v-model="searchUser" type="text" @focus="clearInput" @input="changSearch" placeholder-class="input-placeholder" placeholder="请输入客户名称"/>
|
|
|
+ <view class="number-keyboard">
|
|
|
+ <view class="number-key" v-for="num in [0,1,2,3,4,5,6,7,8,9]" :key="num" @click="inputNumber(num)">{{num}}</view>
|
|
|
+ <view class="delete-key" @click="clearInput">清空</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
@@ -95,6 +99,11 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
+ },
|
|
|
+ inputNumber(num) {
|
|
|
+ this.$util.hitVoice()
|
|
|
+ this.searchUser += num.toString()
|
|
|
+ this.searchCustomer()
|
|
|
}
|
|
|
},
|
|
|
};
|
|
|
@@ -171,6 +180,12 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ & .search-container {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
& .input-serach_box {
|
|
|
font-size: 15upx;
|
|
|
line-height:30upx;
|
|
|
@@ -178,12 +193,48 @@ export default {
|
|
|
height: 30upx;
|
|
|
color:#868585;
|
|
|
border:1upx solid #868585;
|
|
|
- width:40vw;
|
|
|
- margin:0 auto;
|
|
|
+ width:28vw;
|
|
|
+ box-sizing: border-box;
|
|
|
}
|
|
|
& .input-placeholder {
|
|
|
font-size: 15upx!important;
|
|
|
color: #929292!important;
|
|
|
}
|
|
|
+ & .number-keyboard {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ margin-left: 10upx;
|
|
|
+ }
|
|
|
+ & .number-key {
|
|
|
+ width: 30upx;
|
|
|
+ height: 30upx;
|
|
|
+ line-height: 30upx;
|
|
|
+ text-align: center;
|
|
|
+ margin: 0 4upx;
|
|
|
+ border: 1upx solid #3385FF;
|
|
|
+ border-radius: 3upx;
|
|
|
+ font-size: 15upx;
|
|
|
+ color: #3385FF;
|
|
|
+ background-color: #ffffff;
|
|
|
+ &:active {
|
|
|
+ background-color: #3385FF;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ & .delete-key {
|
|
|
+ width: 60upx;
|
|
|
+ height: 30upx;
|
|
|
+ line-height: 30upx;
|
|
|
+ text-align: center;
|
|
|
+ margin: 0 4upx;
|
|
|
+ border: 1upx solid #CDB79E;
|
|
|
+ border-radius: 3upx;
|
|
|
+ font-size: 15upx;
|
|
|
+ color: #ffffff;
|
|
|
+ background-color: #CDB79E;
|
|
|
+ &:active {
|
|
|
+ opacity: 0.8;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
