更新

ghsPad/src/pages/home/components/customerList.vue

@@ -2,36 +2,32 @@
   <view class="app-select_user">
     <view class="title">请选客户</view>
     <view class="app-userList_box">
-
       <block v-for="(item,index) in list" :key="item.id">
         <block v-if="index == 6">
-            <view class="userList-item_box" @click.stop="fastKd()" 
+            <view class="user-list-item_box" @click.stop="fastKd()" 
             style="background-color:#3385FF;border:1upx solid #3385FF;text-align:center;">
               <view class="head-box">
-                <view class="name" style="color:white;font-size:20upx;font-weight:bold;">快捷开单</view>
+                <view class="name" style="color:white;font-size:15upx;font-weight:bold;">快捷开单</view>
               </view>
             </view>
         </block>
-        <view @click="selectCustomer(item)" class="userList-item_box" >
+        <view @click="selectCustomer(item)" class="user-list-item_box" >
           <view class="head-box">
             <view class="name">{{item.name}}</view>
           </view>
-          <view class="footer-box">
-            <view style="padding-left:3upx;">-</view>
-          </view>
         </view>
       </block>
       <block v-if="list.length && list.length < 6">
-        <view class="userList-item_box" @click.stop="fastKd()" 
+        <view class="user-list-item_box" @click.stop="fastKd()" 
         style="background-color:green;border:1upx solid green;text-align:center;">
           <view class="head-box">
-            <view class="name" style="color:white;font-size:20upx;font-weight:bold;">快捷开单</view>
+            <view class="name" style="color:white;font-size:15upx;font-weight:bold;">快捷开单</view>
           </view>
         </view>
       </block>
 
     </view>
-    <input class="input-serach_box" style="margin-bottom:5upx;" v-model="searchUser" type="text" @focus="searchUser=''" @change="changSearch" placeholder-class="input-placeholder" placeholder="请输入客户名称"/>
+    <input class="input-serach_box" v-model="searchUser" type="text" focus="true" @focus="clearInput" @input="changSearch" placeholder-class="input-placeholder" placeholder="请输入客户名称"/>
   </view>
 </template>
 <script>
@@ -50,7 +46,6 @@ export default {
   },
   mounted() {
 	  this.searchCustomer()
-    this.activeKeyboard();
   },
   methods: {
     fastKd(){
@@ -61,34 +56,23 @@ export default {
       this.$util.hitVoice()
       this.$emit('selectCustomer',info)
     },
-    changSearch(val){
-      this.init()
-    },
-    cancelWrite(){
+    clearInput(){
       this.searchUser=''
       this.searchCustomer()
     },
+    changSearch(){
+      this.searchCustomer()
+    },
     searchCustomer() {
       customList({ name: this.searchUser,isCashier:1 }).then(res=>{
         if(res.code == 1){
-          this.list = res.data.list
+          if(res.data.list.length > 13){
+            this.list = res.data.list.slice(0,13)
+          }else{
+            this.list = res.data.list
+          }
         }
       })
-    },
-    activeKeyboard() {
-      this.$refs.keyboard.activate()
-    },
-    typing(e) {
-      if (e.backspace) {
-          this.searchUser = this.searchUser.substring(0, this.searchUser.length - 1);
-      } else {
-        this.searchUser += e.char;
-      }
-      this.searchCustomer()
-    },
-    enter() {
-    },
-    cancel(){
     }
   },
 };
@@ -103,16 +87,16 @@ export default {
   flex-direction: column;
   box-sizing: border-box;
   & .title {
-    font-size: 12upx;
+    font-size:9upx;
     color: #CCCCCC;
     margin-left:5upx;
   }
   & .app-userList_box {
     position:relative;
-    padding: 5upx;
+    padding: 4upx;
     display: flex;
     flex-wrap: wrap;
-    min-height: 130upx;
+    min-height:100upx;
     overflow-y: scroll;
     .fast-kd{
       font-size:20upx;
@@ -126,10 +110,10 @@ export default {
       border-radius:20upx;
       text-align:center;
     }
-    & .userList-item_box {
-      margin: 0 5upx 5upx 0;
+    & .user-list-item_box {
+      margin: 0 5upx 3upx 0;
       width: 95upx;
-      height: 60upx;
+      height:43upx;
       border: 1px solid #3385FF;
       padding: 3upx;
       border-radius: 3upx;
@@ -169,17 +153,17 @@ export default {
     z-index:99;
   }
   & .input-serach_box {
-	  font-size: 16upx;
-	  line-height:50upx;
+	  font-size: 15upx;
+	  line-height:30upx;
 	  text-align: center;
-	  height: 50upx;
+	  height: 30upx;
     color:#868585;
-    border:2upx solid #868585;
-    width:80%;
+    border:1upx solid #868585;
+    width:40vw;
     margin:0 auto;
   }
   & .input-placeholder {
-		font-size: 18upx!important;
+		font-size: 15upx!important;
 		color: #929292!important;
 	}
 }