TEST

components/cm-module/zuheList/ZuheList.vue

@@ -0,0 +1,146 @@
+<template>
+	<view class="container commodity-list-wrapper" :style="{'overflow':(showSkeleton? 'hidden' : 'auto'),'height': (showSkeleton? windowHeight + 'px' : 'auto')}">
+		<view class="good-search clearfix" v-if="searchStatus">
+			<view id="shop">
+				<view class="style addstyle ">单一商品</view>
+				<view class="style zuhe">组合商品</view>
+			</view>
+			<view class="search-from name">
+				<text class="iconfont icon-iconfonticonfontsousuo1"></text>
+				<input class="input" 
+					   type="text" 
+					   focus
+					   confirm-type="search" 
+					   v-model="searchInputVal" 
+					   placeholder="请输入商品关键词" 
+					   @input="onShowClose" 
+					   @confirm="searchOpertor"
+					   maxlength="20"/>
+				<text class="iconfont icon-shanchu1" v-if="isShowClose" @click="delInputText()"></text>
+			</view>
+			<view class="search-btn">
+				<button class="search-btn" type="default" @click.stop="searchOpertor">搜索2</button>
+			</view>
+		</view>
+		<list-skeleton v-if="showSkeleton"></list-skeleton>
+	</view>
+</template>
+<script>
+	export default {
+		components: {
+			
+		},
+		data() {
+			return {
+				
+			};
+		},
+	}
+		
+</script>
+
+<style>
+.commodity-list-wrapper {
+		scroll-view {
+			height: 100%;
+		}
+		.style{
+			width: 128rpx;
+			height: 64rpx;
+			background: #fff;
+			font-size: 26rpx;
+			display: inline-block;
+			border-radius: 10rpx;
+			text-align: center;
+			line-height: 64rpx;
+			border: 2rpx solid #EEEEEE;
+			position: relative;
+			margin-right: 12rpx;
+			}
+		.danyi i{
+			color: #E15616;	
+			position: absolute;
+			top: 20rpx;
+			right: 4rpx;
+			font-weight: bold
+			}
+		.addstyle{
+				background: linear-gradient(-42deg, transparent 28rpx, #E15616 0) top right;
+				color: #FFFFFF;
+			}
+		.show-more-btn {
+			width: 276rpx;
+			height: 52rpx;
+			line-height: 52rpx;
+			border: 2rpx solid #D8D8D8;
+			background: #F7F7F7;
+			font-size: 26rpx;
+			margin: 26rpx 0;
+			position: absolute;
+			left: 50%;
+			margin-left: -138rpx;
+		}
+	}
+	.good-search{
+		height: 64rpx;
+		width: 702rpx;
+		padding: 24rpx;
+		background: #FFFFFF;
+		display: flex;
+		align-items: center;
+		margin-bottom: 20rpx;
+		position: fixed;
+		top: 0;
+		left: 0;
+		z-index: 999;
+		.search-from{
+			width: 330rpx;
+			height: 64rpx;
+			background: #F7F7F7;
+			border-radius: 14rpx;
+			float: left;
+			position: relative;
+			.input{
+				// width: 500rpx;
+				height: 64rpx;
+				float: left;
+				line-height: 64rpx;
+				color: $text-color;
+				font-size: $font-size-24;
+			}
+			.icon-iconfonticonfontsousuo1{
+				width: 64rpx;
+				height: 64rpx;
+				line-height: 64rpx;
+				text-align: center;
+				display: block;
+				font-size: $font-size-38;
+				float: left;
+				color: #999999;
+			}
+			.icon-shanchu1{
+				font-size: $font-size-32;
+				color: #999999;
+				position: absolute;
+				width: 64rpx;
+				height: 64rpx;
+				line-height: 64rpx;
+				top: 0;
+				right: 0;
+				text-align: center;
+				z-index: 10;
+			}
+		}
+		.search-btn{
+			// width: 90rpx;
+			line-height: 64rpx;
+			text-align: center;
+			font-size: $font-size-28;
+			color: $color-system;
+			float: left;
+			background: #FFFFFF;
+			margin-left: 10rpx
+		}
+	 }
+	}
+</style>