添加日历组件

components/ScanInput.vue

@@ -1,16 +1,15 @@
 <template>
 	<view class="zd-row search_wraper" :class="{'input_focus': focusState}">
 		<input 
-		ref="input"
 		type="text" 
 		class="search_input" 
-		:placeholder="placeholder"
+		confirm-type="go"
 		:value="value"
 		:focus="focusState"
-		@blur="focusState=false"
-		@focus="focusState=true"
-		@input="handleChange($event)">
-		<!-- <view class="iconfont icon_scan" @tap="checkMpaasScan">&#xe6e2;</view> -->
+		@focus="handleFocus"
+		@blur="handleBlur"
+		@confirm="handleSend">
+		<view class="iconfont icon-del" @tap="toDel">&#xe6dc;</view>
 		<view class="iconfont icon_scan" @tap="toScan">&#xe6e2;</view>
 	</view>
 </template>
@@ -20,7 +19,6 @@
 	export default {
 		data() {
 			return {
-				cur: '',
 				focusState: false
 			};
 		},
@@ -29,24 +27,24 @@
 			event: 'input'
 		},
 		props: {
-			placeholder: String,
-			value: String,
-			seaShow: {
-			  type: Boolean,
-			  default: false
-			}
+			value: String
 		},
 		methods: {
-			handleChange ($event) {
-				this.cur = $event.target.value
-				this.$emit('input', this.cur)
-				this.$emit('handleChange', this.cur)
+			handleFocus () {
+				this.focusState = true
 			},
-			toSearch () {
-				// this.$emit('toSearch', this.cur)
-				this.$nextTick(() => {
-					this.focusState = true
-				})
+			handleBlur (e) {
+				this.$emit('input', e.target.value)
+				if (e.target.value.length) {
+					this.$emit('handleChange', e.target.value)
+				}
+				this.focusState = false
+			},
+			handleSend (e) {
+				this.$emit('input', e.target.value)
+				if (e.target.value.length) {
+					this.$emit('handleChange', e.target.value)
+				}
 			},
 			toDel () {
 				this.$emit('input', '')
@@ -125,7 +123,7 @@
 @import '../common/style/mixin.styl';
 .search_wraper
 	_wh(100%, 28px)
-	padding 0 2px 0 12px
+	padding 0 2px 0 10px
 	border 1px solid #4980BD
 	background-color rgba(45,88,184,0.1)
 	border-radius 6px
@@ -136,7 +134,14 @@
 	font-size: 12px;
 	color: #fff
 .icon_scan
-	_wh(70px, 30px)
-	_font(20px,30px,#fff,,center)
-	border-radius 12px
+	_wh(70px, 24px)
+	_font(20px,24px,#fff,,center)
+	background-color #137ABD
+	border-radius 6px
+.icon-del
+	_wh(70px, 28px)
+	_font(20px,28px,#fff,,center)
+.input_focus
+	border: 1px solid #889dc7;
+	box-shadow: 0 0 0 1px rgba(136, 157, 199,.2);
 </style>