revert(视频号组件): 精简代码，调整样式以和后台设计统一

components-diy/diy-channel-video.vue

@@ -2,7 +2,7 @@
 	<view class="channel-video" :class="{ 'list-mode': listMode }">
 		<!-- 嵌入式视频播放 -->
 		<view v-if="canUseEmbedMode" class="embed-video-container">
-			<view class="video-cover-wrap" :class="videoCoverClass">
+			<view class="video-cover-wrap" :style="[coverStyle]">
 				<!-- #ifdef MP-WEIXIN -->
 				<native-component>
 					<!-- 嵌入式视频播放组件 -->
@@ -23,11 +23,10 @@
 
 		<!-- 跳转式视频播放 -->
 		<view v-else @click.stop="playVideo" class="video-container">
-			<view class="video-cover-wrap" :class="videoCoverClass">
+			<view class="video-cover-wrap" :style="[coverStyle]">
 				<image class="video-cover" :src="$util.img(value.coverUrl)" mode="aspectFill"></image>
-				<view class="channel-play-btn" v-if="showPlayBtn" :style="playBtnStyle">
-					<image class="play-icon" v-if="playIcon" :src="$util.img(playIcon)" mode="aspectFill"></image>
-					<view class="play-icon-css" v-else></view>
+				<view class="channel-play-btn" v-if="showPlayBtn" :style="[playBtnStyle]">
+					<view class="play-icon-css"></view>
 				</view>
 				<view class="video-stats-overlay" v-if="value.showViewCount">
 					{{ value.viewCount }}次观看
@@ -81,15 +80,6 @@ export default {
 			type: Boolean,
 			default: false
 		},
-		/**
-		 * 视频高度（仅适用于嵌入式播放）
-		 * @type {number}
-		 * @default 220
-		 */
-		videoHeight: {
-			type: Number,
-			default: 220
-		},
 		/**
 		 * 标题显示行数
 		 * @type {number}
@@ -104,17 +94,6 @@ export default {
 			type: Boolean,
 			default: true
 		},
-		/**
-		 * 视频比例
-		 * @type {string}
-		 * @default '16:9'
-		 * @options '16:9', '3:4'
-		 */
-		aspectRatio: {
-			type: String,
-			default: '16:9',
-			validator: (value) => ['16:9', '3:4'].includes(value)
-		},
 		/**
 		 * 视频封面图样式
 		 * 采用 16:9 比例的响应式高度
@@ -159,32 +138,6 @@ export default {
 			return enableEmbedMode;
 			// #endif
 			return false
-		},
-		/**
-		 * 播放按钮图标
-		 * @returns {string}
-		 */
-		playIcon() {
-			// #ifdef MP-WEIXIN
-			return wechatChannelConfig.icon.playIcon
-			// #endif
-			return ''
-		},
-		/**
-		 * 计算视频封面类名
-		 * 根据环境和宽高比生成适当的 CSS 类
-		 * @returns {Array}
-		 */
-		videoCoverClass() {
-			const classes = [];
-			// #ifdef MP-WEIXIN
-			classes.push('mp-weixin');
-			// #endif
-			// #ifndef MP-WEIXIN
-			classes.push('h5');
-			// #endif
-			classes.push(`ratio-${this.aspectRatio.replace(':', '-')}`);
-			return classes;
 		}
 	},
 	methods: {
@@ -202,31 +155,6 @@ export default {
 <style scoped lang="scss">
 @import './css/common-channel.scss';
 
-/* 微信小程序环境样式 - 3:4 比例 */
-.video-cover-wrap.mp-weixin.ratio-3-4 {
-	height: 400rpx;
-	position: relative;
-}
-
-/* 微信小程序环境样式 - 16:9 比例 */
-.video-cover-wrap.mp-weixin.ratio-16-9 {
-	height: 300rpx;
-	position: relative;
-}
-
-/* H5 环境样式 - 3:4 比例 */
-.video-cover-wrap.h5.ratio-3-4 {
-	height: 0;
-	padding-top: 133.33%;
-}
-
-/* H5 环境样式 - 16:9 比例 */
-.video-cover-wrap.h5.ratio-16-9 {
-	height: 0;
-	padding-top: 56.25%;
-}
-
-
 /**
  * 视频卡片容器样式
  * 包含卡片基础样式、悬停效果和列表模式样式
@@ -503,7 +431,6 @@ export default {
 
 /**
  * 纯 CSS 播放按钮图标
- * 当没有 playIcon 时使用
  */
 .play-icon-css {
 	width: 0;