直播列表的修改

pages/goods/components/share/share.vue

@@ -26,7 +26,7 @@
 		        @click="previewImage(i)"
 		      />
 		    </view>
-			<view  style="margin-top: 10px;line-height: 1.5;font-size: 28rpx;color:#333">
+			<view v-if="advertising!=null && advertising !='' " style="margin-top: 10px;line-height: 1.5;font-size: 28rpx;color:#333">
 					<span>广告词：{{advertising}}</span>
 					<u-button size="mini" shape="circle" style='margin-left: 10px;' @click="paste(advertising)">复制</u-button>
 			</view>

pages/live/index.vue

@@ -23,35 +23,45 @@
 				<u-row gutter="20">
 				  <u-col span="6" v-for="(cx, ci) in g" :key="ci" >
 					<view class="good" @click="clickHandler(cx)">
-					  <view class="good-img">
-						<image
-						  mode="aspectFill"
-						  :src="cx.cover_img"
-						  style="width: 100%; height: 100%;"
-						/>
+					  <view class="good-img" :style="{ 'background-image': 'url(' + (cx.cover_img ? cx.cover_img : '') + ')', backgroundSize: '100% 243px' }">
+					
 						<!-- 播放按钮 -->
-						<view class="livebtn" v-if='cx.live_status==103'></view>
-						<u-icon name="play-circle-o" v-if='cx.live_status==103' color="#fff" size="100" style='position: absolute;left: 50%;top:50%;margin-left: -50rpx;margin-top: -50rpx;'></u-icon>
+						<view class="livebtn" v-if='cx.live_status==104 || cx.live_status==105|| cx.live_status==106 '></view>
+						<u-icon name="play-circle-o" v-if='cx.live_status==105' color="#fff" size="100" style='position: absolute;left: 50%;top:50%;margin-left: -50rpx;margin-top: -50rpx;'></u-icon>
+						<image src="/static/images/jinbo.png" v-if="cx.live_status==104" style="width: 50px; height: 50px;position: absolute;left: 50%;top:50%;margin-left: -25px;margin-top: -25px;"/>
+						<image src="/static/images/yic.png" v-if="cx.live_status==106" style="width: 50px; height: 50px;position: absolute;left: 50%;top:50%;margin-left: -25px;margin-top: -25px;"/>
 					  </view>
-					  <view class="good-name">{{ cx.name }}</view>
-					  <view class="good-info">
-						<u-avatar :src="cx.anchor_img" size="30" ></u-avatar>
-							  <Text style="font-size: 12px;margin-left: 5px;">{{cx.anchor_name}}</Text>		
+					  <view style="position: absolute;left: 0;bottom: 0;color: #FFFFFF;background: rgba(0, 0, 0, 0.5);width: 100%; padding: 5px 0;">
+						<view class="good-info">
+							<u-avatar :src="cx.anchor_img" size="30" ></u-avatar>
+							<Text style="font-size: 11px;margin-left: 5px;">{{cx.anchor_name}}</Text>		
+						</view>
+						 <view class="good-name">{{ cx.name }}</view>
 					  </view>
-					  
-					  
-					  
+					
 					  <!-- 直播的状态 -->
-					  <view class="liveState">
-						  <view style="width: 6px;height: 6px;border-radius: 3px;background: #f5f5f5;"></view>
-						  <Text class='liveState_text' v-if='cx.live_status==101'>直播中</Text>
-						  <Text class='liveState_text' v-if='cx.live_status==102'>未开始</Text>
-						  <Text class='liveState_text' v-if='cx.live_status==103'>已结束</Text>
-						  <Text class='liveState_text' v-if='cx.live_status==104'>禁播</Text>
-						  <Text class='liveState_text' v-if='cx.live_status==105'>暂停</Text>
-						  <Text class='liveState_text' v-if='cx.live_status==106'>异常</Text>
-						  <Text class='liveState_text' v-if='cx.live_status==107'>已过期</Text>
+					  <view class="liveState" v-if='cx.live_status==101' style=" background-image: linear-gradient(to right,#FF8FB9,#FF002A);">
+						  <Text>直播中</Text>
+					  </view>
+					  <view class="liveState" v-if='cx.live_status==102' style="background: #FFFFFF;color: #111111;">
+							<Text>未开始</Text>
+					  </view>
+					  <view class="liveState" v-if='cx.live_status==103' >
+							<Text>已结束</Text>
+					  </view>
+					  <view class="liveState" v-if='cx.live_status==104' >
+					  		<Text>禁播</Text>
+					  </view>
+					  <view class="liveState" v-if='cx.live_status==105' >
+					  		<Text>暂停</Text>
 					  </view>
+					  <view class="liveState" v-if='cx.live_status==106' >
+					  		<Text>异常</Text>
+					  </view>
+					  <view class="liveState" v-if='cx.live_status==107' >
+					  		<Text>已过期</Text>
+					  </view>
+					  
 					</view>
 				  </u-col>
 				</u-row>
@@ -178,11 +188,12 @@ export default {
 	  border-radius: 10px;
 	  overflow: hidden;
 	  margin-bottom: 10px;
+	  height: 243px;
 	  position: relative;
 	}
 	.liveStyle .u-good-list .good .good-img {
-	  width: calc(50vw);
-	  height: calc(50vw);
+	  width: 100%;
+	  height: 243px;
 	  display: block;
 	  position: relative;
 	}
@@ -190,12 +201,12 @@ export default {
 	  overflow: hidden;
 	  text-overflow: ellipsis;
 	  display: -webkit-box;
-	  -webkit-line-clamp: 2;
+	  -webkit-line-clamp: 1;
 	  -webkit-box-orient: vertical;
 	  margin-bottom: 3px;
 	  font-size: 13px;
 	  margin: 7px 10px;
-	  height: 36px;
+	  height: 18px;
 	}
 	.liveStyle .u-good-list .good .good-info {
 	  display: flex;
@@ -206,25 +217,24 @@ export default {
 	  
 	}
 	.liveStyle .u-good-list .liveState{
-		width: 100px;
-		height: 30px;
+		width: 50px;
+		height: 20px;
 		position: absolute;
 		left: 0;
-		top:0;
+		top:5px;
 		display: flex;
 		flex-direction: row;
 		align-items: center;
 		justify-content: center;
-		background: #666666;
-		opacity: 0.9;
+		background: rgba(0, 0, 0, 0.5);
+		
 		border-bottom-right-radius: 10px;
-		border-top-left-radius: 10px;
-	}
-	.liveStyle .u-good-list .liveState .liveState_text{
-		color: #f5f5f5;
-		font-size: 14px;
-		margin-left: 5px;
+		border-top-right-radius: 10px;
+		font-size: 11px;
+		color: #FFFFFF;
+		text-align: center;
 	}
+
 	.liveStyle .livebtn{
 		position: absolute;
 		left: 0;