diff --git a/components/plv-player-skin2/drag-tips.nvue b/components/plv-player-skin2/drag-tips.nvue
new file mode 100644
index 0000000..40daa31
--- /dev/null
+++ b/components/plv-player-skin2/drag-tips.nvue
@@ -0,0 +1,97 @@
+/**
+* @file 拖动进度提示组件
+*/
+<template>
+	<view class="plv-player-drag-tips">
+		<view class="plv-player-drag-tips__box">
+			<image class="plv-player-drag-tips__direction-img" :src="imgSrc"
+				@error="imageError">
+			</image>
+			<text class="plv-player-drag-tips__time">
+				{{changeTimeFormat}} / {{durationFormat}}
+			</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	import utils from '@/common/util.js';
+	import backImg from '@/static/skin/back.png';
+	import forwardImg from '@/static/skin/forward.png'
+	
+	export default {
+		props: {
+			currentTime: {
+				type: Number
+			},
+			
+			duration: {
+				type: Number
+			},
+			
+			changeTime: {
+				type: Number
+			}
+		},
+		
+		data() {
+			return {
+			  isForward: false
+			}
+		},
+		
+			
+		watch: {
+			changeTime(newValue, oldValue){
+				this.isForward = newValue > oldValue;
+			}
+		},
+		
+		computed: {
+			timeFormatType() {
+				this.duration >= 3600 ? 2 : 1;
+			},
+			
+			changeTimeFormat() {
+				return utils.formatTimeByDuration(this.changeTime, this.timeFormatType);
+			},
+			
+			durationFormat() {
+				return utils.formatTimeByDuration(this.duration, this.timeFormatType)
+			},
+			
+			imgSrc() {
+				return this.isForward ? forwardImg : backImg;
+			}
+		}
+	}
+</script>
+
+<style>
+	.plv-player-drag-tips {
+		width: 250rpx;
+		height: 160rpx;
+		background: rgba(0,0,0,.7);
+		border-radius: 10rpx;
+	}
+	
+	.plv-player-drag-tips__box {
+		position: absolute;
+		top: 0;
+		right: 0;
+		bottom: 0;
+		left: 0;
+		justify-content: center;
+		align-items: center;
+	}
+	
+	.plv-player-drag-tips__direction-img {
+		width: 100rpx;
+		height: 100rpx;
+	}
+	
+	.plv-player-drag-tips__time {
+		font-size: 24rpx;
+		color: #FFFFFF;
+	}
+</style>
diff --git a/components/plv-player-skin2/gesture.nvue b/components/plv-player-skin2/gesture.nvue
new file mode 100644
index 0000000..391a958
--- /dev/null
+++ b/components/plv-player-skin2/gesture.nvue
@@ -0,0 +1,271 @@
+<template>
+	<view class="plv-player-gesture"
+		@touchstart="touchstart"
+		@touchmove="touchmove"
+		@longpress="handleLongPress"
+		@touchcancel="handleTouchCancel"
+		@touchend="touchend">
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			// 屏幕宽度（物理像素）
+			holeWidth: Number,
+			// 视频总时长
+			duration: Number,
+			// 视频当前播放时间
+			currentTime: Number
+		},
+		
+		computed: {
+			halfWidth() {
+				return parseInt(this.holeWidth / 2);
+			}
+		},
+		
+		data() {
+			return {
+				// 是否在左区域按下手势
+				downLeft: false,
+				// 滑动方向
+				swipeDir: null
+			}
+		},
+		
+		mounted() {
+			this.addHandler();
+		},
+		
+		methods:{
+			addHandler() {
+				// 增加父容器左右滑动监听
+				let finalTime = -1;
+				// 计算左右滑动seek进度
+				const countTime = (position) => {
+					const { holeWidth, duration, currentTime } = this;
+					const precent = Math.abs(position) / holeWidth;
+					const nowTime = currentTime || 0;
+					const constSecond = duration < 60 ? duration : 60;
+					let plusTime = parseInt(Math.abs(precent * constSecond));
+					if (position < 0) plusTime = plusTime * -1;
+					finalTime = nowTime + plusTime;
+					finalTime = this.limit(finalTime, 0, duration);
+					return finalTime;
+				};
+				
+				this.addGesture((type, position) => {
+					switch (type) {
+						// 下滑
+						case -1:
+							// console.log('//下滑');
+							this.$emit('onGestureEvent', {
+								type: this.downLeft ? 'LEFT_DOWN' : 'RIGHT_DOWN',
+								position
+							});
+						  break;
+						// 上滑
+						case -2:
+							// console.log('//上滑');
+							this.$emit('onGestureEvent', {
+								type: this.downLeft ? 'LEFT_UP' : 'RIGHT_UP',
+								position
+							});
+						  break;
+						// 左滑
+						case 0:
+							// console.log('//左滑');
+							this.swipeDir = type;
+							countTime(position);
+							this.$emit('onGestureEvent', {
+								type: 'SEEK_TIME_UPDATE',
+								finalTime
+							});
+						  break;
+						// 右滑
+						case 1:
+							// console.log('//右滑');
+							this.swipeDir = type;
+							countTime(position);
+							this.$emit('onGestureEvent', {
+								type: 'SEEK_TIME_UPDATE',
+								finalTime
+							});
+						  break;
+						// touchend for swipe
+						case 3:
+							if (this.swipeDir > -1) {
+								this.$emit('onGestureEvent', {
+									type: this.swipeDir ? 'SWIPE_RIGHT' : 'SWIPE_LEFT'
+								});
+								this.swipeDir = -1;
+							}
+
+							if (finalTime > -1) {
+								this.$emit('onGestureSeekTo', finalTime);
+							    finalTime = -1;
+							}
+						  break;
+						// doubleTap
+						case 4:
+							// console.log('>>>> 双击');
+							this.$emit('onGestureEvent', {
+								type: 'DOUBLE_CLICK'
+							});
+						  break;
+						// tap
+						case 5:
+							// console.log('>>>> 单击');
+							this.handleClick();
+						  break;
+						// longTap
+						case 6:
+						  break;
+					}
+				});
+			},
+			
+			addGesture(callback) {
+				const { options } = this;
+				let startX, startY, moveEndX, moveEndY, X, Y, position, hasType;
+				let T, lastTap, isJustTouch = true;
+				
+			
+				const excuteCb = (type) => {
+					// type 手势类型 -2 上滑 -1 下滑 0 左滑  1 右滑  2 just touch 3 touchend 4 doubleTap 5 tap 6 longTap
+					if (callback && typeof callback === 'function')
+						callback(type, position);
+				};
+			
+				const YPlus = 20;
+				const YReduce = YPlus * -1;
+				const XPlus = 50;
+				const XReduce = XPlus * -1;
+			
+				const isXchange = () => {
+					if (X > XPlus || X < XReduce) {
+						position = X;
+						hasType = 'X';
+						isJustTouch = false;
+					}
+
+					if (X > XPlus) excuteCb(1);
+					// 左滑
+					else if (X < XReduce) excuteCb(0);
+				};
+			
+				const isYchange = () => {
+					if (Y > YPlus || Y < YReduce) {
+						position = Y;
+						hasType = 'Y';
+						isJustTouch = false;
+					}
+
+					if (Y > YPlus) excuteCb(-1);
+					// 上滑
+					else if (Y < YReduce) excuteCb(-2);
+				};
+			
+				const countDirect = () => {
+					if (hasType) {
+						hasType === 'X' ? isXchange() : isYchange();
+						return;
+					}
+					isXchange();
+					isYchange();
+				};
+				
+				this.handleTouch = (type, e) => {
+					switch(type) {
+						case 'start':
+							startX = e.changedTouches[0].pageX;
+							startY = e.changedTouches[0].pageY;
+							T = Date.now();
+							hasType = '';
+							isJustTouch = true;
+							this.downLeft = startX < this.halfWidth ? true : false;
+							
+							break;
+						case 'move':
+							moveEndX = e.changedTouches[0].pageX;
+							moveEndY = e.changedTouches[0].pageY;
+							X = moveEndX - startX;
+							Y = moveEndY - startY;
+							countDirect();
+							break;
+						case 'end':
+							if (isJustTouch)
+								if (lastTap && Date.now() - lastTap <= 300)
+									excuteCb(4);
+								else if (Date.now() - T < 1000)
+									excuteCb(5);
+								else
+									excuteCb(6);
+							else
+								excuteCb(3);
+										
+							lastTap = Date.now();
+							isJustTouch = true;
+							break;
+					}
+				};
+			},
+			
+			handleClick() {
+				this.$emit('onGestureClick');
+			},
+			
+			touchstart(e) {
+				this.handleTouch('start', e);
+			},
+			
+			touchmove(e) {
+				this.handleTouch('move', e);
+			},
+			
+			touchend(e) {
+				this.handleTouch('end', e);
+				this.$emit('onTouchEnd');
+			},
+			
+			handleTouchCancel() {
+				this.$emit('onTouchCancel');
+			},
+			
+			handleLongPress() {
+				this.$emit('onLongPress');
+			},
+			
+			/**
+			* 控制最小值，最大值
+			* @param num
+			* @param min
+			* @param max
+			* @returns {*}
+			*/
+			limit(num, min, max) {
+				if (num < min) return min;
+				if (num > max) return max;
+				return num;
+			}
+		}
+	}
+</script>
+
+<style>
+.plv-player-gesture {
+	flex: 1;
+	flex-direction: row;
+}
+
+.plv-player-gesture__left {
+	flex: 5;
+}
+
+.plv-player-gesture__right {
+	flex: 5;
+}
+
+
+</style>
diff --git a/components/plv-player-skin2/light.nvue b/components/plv-player-skin2/light.nvue
new file mode 100644
index 0000000..325f806
--- /dev/null
+++ b/components/plv-player-skin2/light.nvue
@@ -0,0 +1,68 @@
+<template>
+	<view v-if="isShow" class="plv-player-icon">
+		<image class="plv-player-icon__img" :src="imgUrl"></image>
+		<text class="plv-player-icon__text">{{ precent + '%' }}</text>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			imgUrl: {
+				type: 'string',
+				required: true
+			},
+			precent: {
+				type: 'Number',
+				default: 100,
+				required: true
+			}
+		},
+		
+		watch: {
+			precent(num) {
+				if (!this.isShow) this.isShow = true;
+				this.startClock();
+			}
+		},
+
+		data() {
+			return {
+				isShow: false
+			}
+		},
+		
+		methods: {
+			startClock() {
+				this.clearClock();
+				
+				this.clock = setTimeout(() => {
+					this.isShow = false;
+				}, 1500);
+			},
+			
+			clearClock() {
+				if (this.clock) clearTimeout(this.clock);
+				this.clock = null;
+			}
+		}
+	}
+</script>
+
+<style>
+	.plv-player-icon {
+		align-items: center;
+		justify-content: center;
+	}
+	
+	.plv-player-icon__img {
+		width: 80rpx;
+		height: 80rpx;
+	}
+	
+	.plv-player-icon__text {
+		color: #FFFFFF;
+		text-align: center;
+	}
+
+</style>
diff --git a/components/plv-player-skin2/skin.nvue b/components/plv-player-skin2/skin.nvue
new file mode 100644
index 0000000..fe4f426
--- /dev/null
+++ b/components/plv-player-skin2/skin.nvue
@@ -0,0 +1,1204 @@
+<template>
+	<view class="skin-wrap">
+		<view class="plv-player-comp-box"  :style="{
+			'width': (holeWidth) + 'px'
+		}">
+			<view class="plv-player-longpress-speed" v-if="isInLongPress && !isLock">
+				<image class="plv-player-longpress-speed__image" src="@/static/skin/forward.png"></image>
+				<text class="plv-player-longpress-speed__text">快进x2.0</text>
+			</view>
+			<drag-tips class="plv-player-skin-drag-tips" v-if="showGestureSeekTips" :duration="duration" :changeTime="gestureChangeSeekTime" :currentTime="currentTime"></drag-tips>
+		</view>
+		<gesture class="plv-player-mask"
+			:holeWidth="holeWidth"
+			:duration="duration"
+			:currentTime="currentTime"
+			@onLongPress="handleLongPress"
+			@onTouchCancel="handleTouchCancel"
+			@onGestureClick="handleMask"
+			@onTouchEnd="handleTouchEnd"
+			@onGestureSeekTo="handleSeekTo"
+			@onGestureEvent="handleGEvent">
+		</gesture>
+		<!-- <light class="plv-player-light" :imgUrl="lightImg" :precent="lightPrecent"></light> -->
+		<!-- <volume class="plv-player-volume" :imgUrl="volumeImg" :muteImgUrl="volumeMuteImg" :value="volumeValue"></volume> -->
+		<view class="plv-player-subtitle-view" v-if="isShowSubtitle">
+			<text v-if="isShowDoubleSubTitle" :style="{ fontWeight: topSubtitle.isBold? 'bold' : 'normal', 
+			fontStyle: topSubtitle.isItalic? 'italic' : 'normal', color: topSubtitle.fontColor,
+			backgroundColor: topSubtitle.bgColor, fontSize: topSubtitle.fontSize }">{{topSubtitle.text}}</text>
+			<text v-if="isShowDoubleSubTitle" :style="{ fontWeight: bottomSubtitle.isBold? 'bold' : 'normal', 
+			fontStyle: bottomSubtitle.isItalic? 'italic' : 'normal', color: bottomSubtitle.fontColor,
+			backgroundColor: bottomSubtitle.bgColor, fontSize: bottomSubtitle.fontSize }">{{bottomSubtitle.text}}</text>
+			<text v-else="isShowSingleSubTitle" :style="{ fontWeight: singleSubtitle.isBold? 'bold' : 'normal',
+			fontStyle: singleSubtitle.isItalic? 'italic' : 'normal', color: singleSubtitle.fontColor,
+			backgroundColor: singleSubtitle.bgColor, fontSize: singleSubtitle.fontSize }">{{singleSubtitle.text}}</text>
+		</view>
+		<view class="plv-player-bar" v-if="!selectStatus && showBar && !isLock">
+			<image class="plv-player-bar__bg" :src="bottomBar"></image>
+			<view class="plv-player-bar__box">
+				<view class="plv-player-mr-left"></view>
+				<view class="plv-player-middle">
+					<view class="plv-player-progress">
+						<view class="plv-player-progress__play__wrap">
+							<view class="plv-player-progress__wrap__played"  :style="'flex:' + progressPrecent"></view>
+							<view class="plv-player-progress__wrap__surplus" :style="'flex:' + progressLeftOverPrecent"></view>
+						</view>
+						<view class="plv-player-progress__dot__wrap">
+							<view class="plv-player-progress__dot__box">
+								<view class="plv-player-progress__dot__played" :style="'flex:' + (progressPrecent || 1)">
+									<view class="plv-player-progress__dot"></view>
+								</view>
+								<view class="plv-player-progress__dot__surplus" :style="'flex:' + progressLeftOverPrecent"></view>
+							</view>
+						</view>
+						<view class="plv-player-progress__mask"
+							@touchstart="touchstart"
+							@touchmove="touchmove"
+							@touchend="touchend"></view>
+					</view>
+					<view class="plv-player-bar-bottom">
+						<image class="plv-btn plv-player-play-btn" :src=playBtnLink @click="handlePlay"></image>
+						<view class="plv-player-time">
+							<text class="plv-player-btn__text">{{ currentTimeText }}</text>
+							<text class="plv-player-btn__text"> / </text>
+							<text class="plv-player-btn__text">{{ durationText }}</text>
+						</view>
+						<image class="plv-btn plv-player-full-btn" :src="fullBtnLink" @click="handleFull"></image>
+						<text class="plv-btn plv-player-hd-btn plv-player-btn__text" @click="handleBtn(types.LEVEL)">{{ currentLevelText }}</text>
+						<text class="plv-btn plv-player-rate-btn plv-player-btn__text" @click="handleBtn(types.SPEED)">{{ currentSpeedText }}</text>
+						<text class="plv-btn plv-player-scaling-btn plv-player-btn__text" @click="handleBtn(types.SCALING)">画面</text>
+						<text class="plv-btn plv-player-subtitle-btn plv-player-btn__text"
+						 v-if="isEnableSubTitle" @click="handleBtn(types.SUBTITLE)">字幕</text>
+					</view>
+				</view>
+				<view class="plv-player-mr-right"></view>
+			</view>
+		</view>
+		<view class="plv-player-select" v-if="selectStatus">
+			<view class="plv-player-select__bg"></view>
+			<view class="plv-player-select__option">
+				<text v-for=" (item, index) in selects"
+					:key="index"
+					class="plv-player-select__option__item"
+					:class="{ 'select-option__text': true, active: index === currentOptionIndex}"
+					@click="selectOption(index)">
+					{{ item[0] }}
+				</text>
+			</view>
+		</view>
+		<!-- <view class="plv-player-screenshot" v-if="!selectStatus && showBar && !isLock" :style="'bottom:' + screenShotY">
+			<image class="plv-player-screenshot__btn" :src="screenShotImg" @click="$emit('onScreenShot')"></image>
+		</view>
+		<view class="plv-player-lock" v-if="!selectStatus && showBar" :style="'bottom:' + screenShotY">
+			<image class="plv-player-lock__btn" :src="lockImgSrc" @click="isLock = !isLock"></image>
+		</view>
+		 -->
+	</view>
+</template>
+
+<script>
+	import Gesture from './gesture.nvue';
+	//import Light from './light.nvue';
+	//import Volume from './volume.nvue';
+	import DragTips from '@/components/plv-player-skin/drag-tips.nvue';
+	import LockImg from '@/static/skin/lock.png';
+	import UnLockImg from '@/static/skin/unlock.png';
+	// 部分img 放到了static/skin目录下
+	const imgLink = {
+		play: 'https://play1.polyv.net/player2/demo/uniapp/pause-left-btn.png',
+		pause: 'https://play1.polyv.net/player2/demo/uniapp/play-left-btn.png',
+		full: 'https://play1.polyv.net/player2/demo/uniapp/fullscreen-btn.png',
+		normal: 'https://play1.polyv.net/player2/demo/uniapp/normalscreen-btn.png',
+		bottomBar: 'https://play1.polyv.net/player2/demo/uniapp/bottombar.png',
+		light: 'https://play1.polyv.net/player2/demo/uniapp/light.png',
+		volume: 'https://play1.polyv.net/player2/demo/uniapp/volume.png',
+		mute: 'https://play1.polyv.net/player2/demo/uniapp/mute.png',
+		screenShot: 'https://play1.polyv.net/player2/demo/uniapp/screenShot.png'
+	};
+	
+	export default {
+		components: {
+			Gesture,
+			//Light,
+			//Volume,
+			DragTips
+		},
+		
+		data() {
+			return {
+				// 是否显示控制栏
+				showBar: true,
+				// 控制栏自动渐隐时间（单位:秒）
+				showBarTime: 10,
+				// 播放状态
+				playStatus: true,
+				// 播放按钮图片
+				playBtnLink: imgLink.play,
+				// 全屏状态
+				fullStatus: false,
+				// 全屏按钮图片
+				fullBtnLink: imgLink.full,
+				// 控制栏渐变背景图
+				bottomBar: imgLink.bottomBar,
+				// 时间显示块
+				timeShowBlock: null,
+				// 当前播放时间
+				currentTime: null,
+				currentTimeText: '00:00',
+				// 总时长
+				duration: null,
+				durationText: null,
+				// 播放进度占总时长百分比
+				precent: 0,
+				// 进度条播放进度计算的百分比
+				progressPrecent: 0,
+				// 进度条播放进度计算的剩余百分比
+				progressLeftOverPrecent: 100,
+				// 是否正在拖拽中
+				isDraging: false,
+				// 选择面板中所有选项
+				selects: [],
+				// 选择面板是否显示中
+				selectStatus: false,
+				// 选择面板选中类型 levels:清晰度 speeds:倍速
+				types: {
+					LEVEL: 'level',
+					SPEED: 'speed',
+					SCALING: 'scaling',
+					SUBTITLE: 'subtitle'
+				},
+				// 当前选中类型
+				type: null,
+				// 可选码率
+				levels: [
+					['自动', 0],
+					['流畅', 1],
+					['高清', 2],
+					['超清', 3]
+				],
+				// 当前码率
+				level: 0,
+				// 点击了自动码率选项
+				selectedHdAuto: false,
+				// 可选倍速
+				speeds: [
+					['0.5x', 0.5],
+					['1x', 1],
+					['1.5x', 1.5],
+					['2x', 2]
+				],
+				// 当前倍速
+				speed: 1,
+				// 亮度图片
+				lightImg: imgLink.light,
+				// 亮度百分比
+				lightPrecent: 0,
+				// 音量图片
+				volumeImg: imgLink.volume,
+				volumeMuteImg: imgLink.mute,
+				// 音量值
+				volumeValue: 0.5,
+				//截图按钮
+				screenShotImg: imgLink.screenShot,
+				// 截图按钮距离底部高度
+				screenShotY: '200rpx',
+				
+				showGestureSeekTips: false,
+				// 手势拖动时
+				gestureChangeSeekTime: 0,
+				
+				seekedNeedPlay: false,
+				// 是否锁屏
+				isLock: false,
+				// 视频拉伸模式文案
+				scalings: [['居中', 0], ['适应', 1], ['填充',2], ['拉伸', 3]],
+				// 拉伸模式
+				scaling: undefined,
+				// 是否处于长按的状态
+				isInLongPress: false,
+				// 是否开启字幕功能
+				isEnableSubTitle: true,
+				isEnableDoubleSubTitle: false,
+				subtitles: [['不显示',0]],
+				isShowSubtitle: false,
+				isShowSingleSubTitle: false,
+				isShowDoubleSubTitle:false,
+				subtitle: 0,
+				topSubtitle: {
+					text:"",
+					isBold: false,
+					isItalic: false,
+					fontColor:"#fb12d4",
+					bgColor:"#67f933",
+					fontSize: 14
+				},
+				bottomSubtitle: {
+					text:"",
+					isBold: false,
+					isItalic: false,
+					fontColor:"#ffff00",
+					bgColor:"#00f3ff",
+					fontSize: 14
+				},
+				singleSubtitle: {
+					text:"",
+					isBold: false,
+					isItalic: false,
+					fontColr:"#ffffff",
+					bgColor: "#000000",
+					fontSize: 14
+				}
+			}
+		},
+		
+		watch: {
+			type() {
+				this.selects = this[`${this.type}s`];
+			}
+		},
+		
+		computed: {
+			currentLevelText() {
+				const { levels, level } = this;
+				return levels[level][0];
+			},
+			
+			currentSpeedText() {
+				const { speeds, speed } = this;
+				return speeds[speed][0];
+			},
+			
+			currentOptionIndex() {
+				const { type, types} = this;
+				
+				switch(type) {
+					case types.LEVEL: {
+						return this.level;
+					}
+					case types.SPEED: {
+						return  this.speed;
+					}
+					case types.SCALING: {
+						return this.scaling;
+					}
+					case types.SUBTITLE: {
+						return this.subtitle;
+					}
+				}
+				
+				// if (type === types.LEVEL)
+				// 	return this.level;
+				// else
+				// 	return this.speed;
+			},
+			
+			lockImgSrc() {
+				return this.isLock ? LockImg: UnLockImg;
+			}			
+		},
+		
+		mounted() {
+			this.countHoleWidth();
+			this.barHide();
+		},
+		
+		methods: {
+			/**
+			 * 计算进度条总长度
+			 */
+			countHoleWidth() {
+				const { fullStatus } = this;
+				
+				const height = plus.display.resolutionHeight;
+				const width = plus.display.resolutionWidth;
+				
+				
+				if (fullStatus)
+					this.holeWidth = height > width ? height : width;
+					
+				else
+					this.holeWidth = width < height ? width : height;
+			},
+
+			/**
+			 * Toogle修改播放按钮状态，传入forceStatus以forceStatus为主
+			 * @param {Object} forceStatus
+			 */
+			changePlayStatus(forceStatus) {
+				const { playStatus } = this;
+				let newStatus = !playStatus;
+				if (typeof forceStatus !== 'undefined')
+					newStatus = forceStatus;
+				
+				this.playStatus = newStatus;
+				this.playBtnLink = newStatus ? imgLink.play : imgLink.pause;
+			},
+			
+			pause() {
+				this.playStatus = true;
+				this.handlePlay();
+			},
+			
+			play() {
+				this.playStatus = false;
+				this.handlePlay();
+			},
+			
+			/**
+			 * 播放按钮点击
+			 */
+			handlePlay() {
+				const { playStatus } = this;
+				this.changePlayStatus();
+				this.$emit('onPlayBtnClick', this.playStatus);
+			},
+
+			/**
+			 * Toogle修改全屏按钮状态
+			 */
+			changeFullStatus() {
+				const { fullStatus } = this;
+				let newStatus = !fullStatus;
+				
+				this.fullStatus = newStatus;
+				this.fullBtnLink = newStatus ? imgLink.normal : imgLink.full;
+			},
+			
+			/**
+			 * 全屏按钮点击
+			 */
+			handleFull() {
+				const { fullStatus } = this;
+				this.changeFullStatus();
+				this.$emit('onFullBtnClick', this.fullStatus);
+				this.countHoleWidth();
+
+				this.screenShotY = fullStatus ? '200rpx' : '300rpx';	
+				
+			},
+			
+			/**
+			 * 点击清晰度/倍速按钮
+			 */
+			handleBtn(type) {
+				const { selectStatus } = this;
+				this.type = type;
+				this.selectStatus = !this.selectStatus;
+			},
+			
+			/**
+			 * 选择切换清晰度/倍速
+			 * @param {Object} value
+			 */
+			selectOption(value) {
+				const { types, type, speeds, subtitles } = this;
+
+				this[type] = value;
+				this.selectStatus = false;
+				
+				switch(type) {
+					case types.LEVEL:
+						this.selectedHdAuto = value === 0;
+						this.$emit('onHdBtnClick', value);
+					break;
+					case types.SPEED:
+						this.$emit('onRateBtnClick', speeds[value][1]);
+					break;
+					case types.SCALING:
+						this.$emit('onScalingBtnClick', value);
+					break;
+					case types.SUBTITLE:
+						if(value === 0) {
+							this.isShowSubtitle = false;
+							this.$emit('onOpenSRT', false);
+							this.isShowDoubleSubTitle = false;
+							this.isShowSingleSubTitle = false;
+							break;
+						}
+						if (subtitles[value][0] === "双语") {
+							console.log("===1 切换双语")
+							// 发送开启双字幕
+							this.isShowSubtitle = true;
+							this.isShowDoubleSubTitle = true;
+							this.isShowSingleSubTitle = false;
+							this.$emit('onChangeSRTSingleMode', false);
+							this.$emit('onOpenSRT', true);
+							break;
+						}
+						this.isShowSubtitle = true;
+						this.isShowDoubleSubTitle = false;
+						this.isShowSingleSubTitle = true;
+						this.$emit('onChangeSRTSingleMode', true);
+						this.$emit('onOpenSRT', true);
+						this.$emit('onChangeSRTBtnClick', subtitles[value][0]);
+						break;
+				}
+			},
+			
+			/**
+			 * 点击空白区域
+			 */
+			handleMask() {
+				const { selectStatus, showBar } = this;
+				/**
+				 * 若清晰度显示则隐藏
+				 */
+				if (selectStatus) {
+					this.selectStatus = false;
+					return;
+				}
+				
+				if (showBar) {
+					this.showBar = false;
+				} else {
+					this.showBar = true;
+					this.barHide();
+				}
+			},
+
+			/**
+			 * 当前播放时间更新
+			 * @param {Object} time
+			 */
+			timeUpdate(time) {
+				this.currentTime = time;
+				this.currentTimeText = this.timeFormat(time);
+				this.updateProgress();
+			},
+			
+			/**
+			 * 是否有字幕功能
+			 * @param {boolean} enableSubTitle
+			 * @param {boolean} enableSubTitleDouble
+			 */
+			setEnableSubtitle(enableSubTitle, enableSubTitleDouble) {
+			    this.isEnableSubTitle = enableSubTitle
+				this.enableSubTitleDouble = enableSubTitleDouble
+				const { subtitles } = this;
+				if (enableSubTitleDouble) {
+					this.subtitles.push(["双语", subtitles.length]);
+				}
+			},
+			
+			/**
+			 * 设置字幕的样式
+			 * @param {Object} config
+			 */
+			setSRTTextConfig(config) {
+				const position = config.position;
+				console.log("===1 setSRTTextConfig position: " + config.position);
+				console.log("===1 setSRTTextConfig color: " + config.backgroundColor);
+				const color = this.convertARGBtoRGBA(config.backgroundColor);
+				console.log("===1 change color: " + color);
+				if (position === "bottom") {
+					this.bottomSubtitle.fontColor = this.convertARGBtoRGBA(config.fontColor);
+					this.bottomSubtitle.fontSize = config.fontSize;
+					this.bottomSubtitle.bgColor = this.convertARGBtoRGBA(config.backgroundColor);
+					this.bottomSubtitle.isBold = config.fontBold;
+					this.bottomSubtitle.isItalic = config.fontItalics;
+				}
+				
+				if (position === "top") {
+					this.topSubtitle.fontColor = this.convertARGBtoRGBA(config.fontColor);
+					this.topSubtitle.fontSize = config.fontSize;
+					this.topSubtitle.bgColor = this.convertARGBtoRGBA(config.backgroundColor);
+					this.topSubtitle.isBold = config.fontBold;
+					this.topSubtitle.isItalic = config.fontItalics;
+				}
+				
+				if (position === null || position === "") {
+					this.singleSubtitle.fontColor = this.convertARGBtoRGBA(config.fontColor);
+					this.singleSubtitle.fontSize = config.fontSize;
+					this.singleSubtitle.bgColor = this.convertARGBtoRGBA(config.backgroundColor);
+					this.singleSubtitle.isBold = config.fontBold;
+					this.singleSubtitle.isItalic = config.fontItalics;
+				}
+			},
+			
+			convertARGBtoRGBA(argbValue) {
+				if(!argbValue.startsWith('#') || argbValue.length !== 9) {
+					return argbValue;
+				}
+				  const hexValue = argbValue.replace('#', '');
+				  const alpha = parseInt(hexValue.slice(0, 2), 16) / 255;
+				  const red = parseInt(hexValue.slice(2, 4), 16);
+				  const green = parseInt(hexValue.slice(4, 6), 16);
+				  const blue = parseInt(hexValue.slice(6, 8), 16);
+				  return `rgba(${red}, ${green}, ${blue}, ${alpha})`;
+			},
+			
+			/**
+			 * 插入当前有多少可选的字幕
+			 * @param {Object} titles
+			 */
+			setSRTTitle(titles) {
+				console.log("===1 title is " + titles);
+				const newItems = titles.map((lang)=>[lang, titles.indexOf(lang) + this.subtitles.length + 1]);
+				this.subtitles.push(...newItems);
+			},
+			
+			/**
+			 * 字幕
+			 * @param {Object} srt
+			 */
+			setSRTText(srt) {
+				this.singleSubtitle.text = "";
+				this.topSubtitle.text = "";
+				this.bottomSubtitle.text = "";
+				
+				console.info("====3 srtList: " + srt);
+				
+				const data = JSON.parse(srt);
+				if (!data) {
+					return;
+				}
+				data.strList.forEach(item => {
+					const position = item.position;
+					if (position === "singleSubtitles") {
+						this.singleSubtitle.text = item.srtText;
+					}
+					if (position === "bottomSubtitles") {
+						this.bottomSubtitle.text = item.srtText;
+					}
+					if (position === "topSubtitles") {
+						this.topSubtitle.text = item.srtText;
+					}
+				})
+			},
+
+			/**
+			 * 视频总时长更新
+			 * @param {Object} duration
+			 */
+			updateDuration(duration) {
+				this.duration = duration;
+				this.timeShowBlock = duration >= 3600 ? 2 : 1;
+				this.durationText = this.timeFormat(duration);
+			},
+			
+			/**
+			 * 更新进度条显示
+			 */
+			updateProgress(precent) {
+				const { currentTime, duration, finalPrecent, isDraging } = this;
+				let _precent;
+				
+				const changeProgressWidth = (_precent) => {
+					this.progressPrecent = parseInt( _precent * 100 );
+					this.progressLeftOverPrecent = 100 - this.progressPrecent;
+				};
+
+				if (precent) {
+					// 强制使用外部传入进度百分比
+					_precent = this.limit(precent, 0, 1); 
+					changeProgressWidth(_precent);
+				} else {
+					// 计算timeupdate当前进度条百分比
+					if (!duration || isDraging) return;
+					_precent = currentTime / duration;
+					this.precent = _precent;
+					changeProgressWidth(_precent);
+				}
+				
+			},
+			/**
+			 * 更新视频画面缩放模式
+			 */
+			updateScaling(mode) {
+				this.scaling = mode;
+			},
+			
+			/**
+			 * 监听进度条拖拽seek
+			 */
+			handleTouch(type, e) {
+				switch(type) {
+					case 'start':
+						this.initTouchPageX = e.touches[0].pageX * 2;
+						this.barShow();
+					break;
+					case 'move':
+						this.isDraging = true;
+					    const touchPageX = e.touches[0].pageX * 2;
+					    const changedX = this.getChangedX(touchPageX, this.initTouchPageX);
+					    this.calcPrecentChange(changedX);
+					break;
+					case 'end':
+						if (this.isDraging) {
+							this.toSeek(this.finalPrecent);
+							this.isDraging = false;
+					    }
+					break;
+				}
+			},
+			
+			/**
+			 * 计算变化百分比
+			 * @param {Object} changedX
+			 */
+			calcPrecentChange(changedX) {
+			  const { precent, holeWidth } = this;
+			  let finalPrecent;
+			  
+			  const changedPrecent = changedX / holeWidth;
+			  finalPrecent = precent + changedPrecent;
+			  finalPrecent = this.limit(finalPrecent, 0, 1);
+			  this.updateProgress(finalPrecent);
+			  this.finalPrecent = finalPrecent;
+			},
+			
+			/**
+			 * 获取变化的X坐标
+			 * @param {Object} touchPageX touchend触发后的X坐标
+			 * @param {Object} initTouchPageX touchstart触发后的X坐标
+			 */			
+			getChangedX(touchPageX, initTouchPageX) {
+			  return touchPageX - initTouchPageX;
+			},
+			
+			touchstart(e) {
+				this.handleTouch('start', e);
+			},
+			
+			touchmove(e) {
+				this.handleTouch('move', e);
+			},
+			
+			touchend(e) {
+				this.handleTouch('end', e);
+			},
+			
+			toSeek(precent) {
+				const seekTime = parseInt(precent * this.duration);
+				if (!isNaN(seekTime)) this.$emit('onToSeek', seekTime);
+			},
+			
+			handleSeekTo(time) {
+				if (!isNaN(time)) {
+					this.$emit('onToSeek', time);
+					setTimeout(() => {
+						if (this.seekedNeedPlay) {
+							this.play();
+							this.seekedNeedPlay = false;
+						}
+					}, 100)
+				}
+			},
+			
+			/**
+			 * 更新可选码率
+			 * @param {Object} num
+			 */
+			updateLevels(num) {
+				if (!num) return;
+				const realNum = num + 1;
+				var allLevels = [
+						['自动', 0],
+						['流畅', 1],
+						['高清', 2],
+						['超清', 3]
+					];
+				this.levels = allLevels.slice(0, realNum);
+				if (this.type === this.types.LEVEL) {
+					this.selects = this.levels;
+				}
+			},
+			
+			/**
+			 * 更新当前码率
+			 * @param {Object} level
+			 */
+			updateCurrentLevel(level) {
+				const { selectedHdAuto } = this;
+				if (selectedHdAuto) return;
+				// 若点击自动清晰度按钮后，不更新码率显示
+				this.level = level;
+			},
+			
+			/**
+			 * 显示控制栏
+			 */
+			barShow() {
+				if (this.clock) {
+					clearTimeout(this.clock);
+					this.clock = null;
+				}
+				this.showBar = true;
+			},
+			
+			/**
+			 * 隐藏控制栏
+			 * @param {Boolean} immediately 是否立刻隐藏
+			 */
+			barHide(immediately) {
+				return;
+				const { showBarTime } = this;
+				if (this.clock) {
+					clearTimeout(this.clock);
+					this.clock = null;
+				}
+
+				this.clock = setTimeout(() => {
+					this.showBar = false;
+				}, showBarTime * 1000);
+			},
+			
+			/**
+			 * 处理手势控制
+			 * @param {Object} type 手势类型
+			 * @param {Object} value 手势变化值
+			 */
+			handleGEvent(data) {
+				switch(data.type) {
+					case 'SEEK_TIME_UPDATE': {
+						
+						if (this.playStatus) {
+							this.seekedNeedPlay = true;
+							this.pause();
+						}
+						 const { finalTime } = data;
+						 if (isNaN(finalTime)) {
+							 return;
+						 }
+						 this.gestureChangeSeekTime = finalTime;
+						 this.showGestureSeekTips = true;
+						 clearTimeout(this.$options.gestureTimeout);
+						 
+						 // 600ms后隐藏tips
+						 this.$options.gestureTimeout = setTimeout(() => {
+						 	this.showGestureSeekTips = false;
+							this.gestureChangeSeekTime = 0;
+						 }, 600)
+						 
+					}
+					break;
+					case 'LEFT_UP':
+						// console.log('LEFT_UP');
+						uni.getScreenBrightness({
+							success: (res) => {
+								this.setBrightness(res.value, data.position, 1);
+							}
+						});
+					break;
+					case 'LEFT_DOWN':
+						// console.log('LEFT_DOWN');
+						uni.getScreenBrightness({
+							success: (res) => {
+								this.setBrightness(res.value, data.position, -1);
+							}
+						});
+					break;
+					case 'RIGHT_UP':
+						// console.log('RIGHT_UP');
+						this.volumeChanged(data.position, 1);
+					break;
+					case 'RIGHT_DOWN':
+						// console.log('RIGHT_DOWN');
+						this.volumeChanged(data.position, -1);
+					break;
+					case 'DOUBLE_CLICK':
+						console.log('DOUBLE_CLICK');
+						if (this.playStatus) {
+							this.pause();
+						} else {
+							this.play();
+						}
+					break;
+				}
+			},
+			
+			/**
+			 * 设置亮度
+			 * @param {Object} currentValue 当前亮度
+			 * @param {Object} changedValue 改变值
+			 * @param {Object} isDown 若为减弱，则设置为-1，否则为1
+			 */
+			setBrightness(currentValue, changedValue, isDown) {
+				// 除6降低灵敏度
+				changedValue = Math.abs(changedValue / 6) / 100 * isDown;
+				let realValue = currentValue + changedValue;
+				realValue = this.limit(realValue, 0, 1);
+				this.lightPrecent = parseInt(realValue * 100);
+				
+				uni.setScreenBrightness({
+					value: realValue
+				});
+			},
+
+			/**
+			 * 音量变化
+			 * @param {Object} changedValue
+			 * @param {Object} isDown
+			 */
+			volumeChanged(changedValue, isDown) {
+				changedValue = Math.abs(changedValue / 10) / 100 * isDown;
+				this.$emit('onVolumeChanged', changedValue);
+			},
+			
+			/**
+			 * 更新音量变化显示
+			 * @param {Object} value
+			 */
+			updateVolumeValue(value) {
+				this.volumeValue = value;
+			},
+			
+			/**
+			 * 时间（秒）格式化
+			 * @param {Object} result
+			 */
+			timeFormat(result) {
+				const { timeShowBlock } = this;
+				
+				let h = Math.floor(result / 3600) < 10 ? '0' + Math.floor(result / 3600) : Math.floor(result / 3600);
+				let m = Math.floor((result / 60 % 60)) < 10 ? '0' + Math.floor((result / 60 % 60)) : Math.floor((result / 60 % 60));
+				let s = Math.floor((result % 60)) < 10 ? '0' + Math.floor((result % 60)) : Math.floor((result % 60));
+
+				if (timeShowBlock === 2)
+					return result = h + ':' + m + ':' + s;
+				else
+					return result = m + ':' + s;
+			},
+			
+			/**
+			* 控制最小值，最大值
+			* @param num
+			* @param min
+			* @param max
+			* @returns {*}
+			*/
+			limit(num, min, max) {
+				if (num < min) return min;
+				if (num > max) return max;
+				return num;
+			},
+			
+			handleTouchCancel() {
+				if (this.isLock) return;
+				if (this.isInLongPress) {
+					this.isInLongPress = false;
+					this.$emit('onRateBtnClick', 1);
+				}
+				
+			},
+			// 特殊情况如果不触发touchcancel, 触发touchend时取消长按状态
+			handleTouchEnd() {
+				this.handleTouchCancel()
+			},
+			
+				
+			handleLongPress() {
+				if (this.isLock) return;
+				this.isInLongPress = true;
+					
+				this.play();
+				this.$emit('onRateBtnClick', 2);
+			}
+		}
+	}
+</script>
+
+<style>
+	.plv-player-mask {
+		position: absolute;
+		left: 0;
+		right: 0;
+		top: 0;
+		bottom: 120rpx;
+	}
+	
+	.plv-player-bar__bg {
+		width: 1624rpx;
+		height: 120rpx;
+	}
+	
+	.plv-player-bar {
+		position: absolute;
+		left: 0;
+		right: 0;
+		height: 120rpx;
+		bottom: 0;
+	}
+	
+	.plv-player-bar__box {
+		position: absolute;
+		left: 0;
+		right: 0;
+		height: 120rpx;
+		bottom: 0;
+		flex-direction: row;
+	}
+	
+	.plv-player-mr-left {
+		flex: 10;
+	}
+	
+	.plv-player-mr-right {
+		flex: 10;
+	}
+	
+	.plv-player-middle {
+		flex: 80;
+	}
+	
+	.plv-player-progress {
+		flex: 40;
+	}
+	
+	.plv-player-subtitle-view {
+		position: absolute;
+		left: 0;
+		right: 0;
+		height: 150rpx;
+		bottom: 50rpx;
+		justify-content: center;
+		align-items: center;
+		flex-direction: column;
+	}
+	
+	.plv-subtitle-top-text {
+		background-color: greenyellow;
+	}
+	
+	.plv-subtitle-bottom-text {
+		background-color: darkred;
+	}
+	
+	.plv-player-progress__play__wrap {
+		flex-direction: row;
+		flex: 1;
+	}
+	
+	.plv-player-progress__wrap__played {
+		top: 20rpx;
+		height: 8rpx;
+		background-color: #0A98D5;
+	}
+	
+	.plv-player-progress__wrap__surplus {
+		top: 20rpx;
+		height: 8rpx;
+		background-color: #FFFFFF;
+	}
+	
+	.plv-player-progress__dot__wrap {
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		z-index: 1;
+	}
+	
+	.plv-player-progress__dot__box {
+		flex: 1;
+		flex-direction: row;
+	}
+	
+	.plv-player-progress__dot__played {
+		flex: 20;
+	}
+	
+	.plv-player-progress__dot__surplus {
+		flex: 80;
+	}
+	
+	.plv-player-progress__mask {
+		position: absolute;
+		top: 0;
+		right: 0;
+		left: 0;
+		bottom: 0;
+		border-radius: 4rpx;
+		z-index: 2;
+	}
+	
+	.plv-player-progress__dot {
+		position: absolute;
+		width: 10rpx;
+		height: 30rpx;
+		top: 8rpx;
+		right: 0;
+		border-radius: 4rpx;
+		background-color: #FFFFFF;
+		/* transform: translateX(15rpx); */
+	}
+	
+	.plv-player-bar-bottom {
+		flex-direction: row;
+		flex: 60;
+	}
+
+	.plv-btn {
+		position: relative;
+		width: 64rpx;
+		height: 64rpx;
+		top: 8rpx;
+		bottom: 0;
+		margin-right: 10rpx;
+	}
+	
+	.plv-player-full-btn {
+		position: absolute;
+		right: 0;
+	}
+	
+	.plv-player-hd-btn {
+		position: absolute;
+		right: 64rpx;
+	}
+	
+	.plv-player-rate-btn {
+		position: absolute;
+		right: 128rpx;
+	}
+	
+	.plv-player-scaling-btn {
+		position: absolute;
+		right: 210rpx;
+	}
+
+	.plv-player-subtitle-btn {
+		position: absolute;
+		right: 278rpx;
+	}
+	
+	.plv-player-time {
+		position: relative;
+		top: 8rpx;
+		flex-direction: row
+	}
+	
+	.plv-player-select {
+		position: absolute;
+		width: 200rpx;
+		right: 0;
+		top: 0;
+		bottom: 0;
+		z-index: 1;
+	}
+	
+	.plv-player-select__bg {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		background-color: #0A98D5;
+		opacity: 0.5;
+	}
+	
+	.plv-player-select__option {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 20rpx;
+		justify-content: center;
+		align-items: center;
+	}
+	
+	.plv-player-select__option__item {
+		padding: 18rpx;
+	}
+	
+	
+	.plv-player-btn__text {
+		color: #FFFFFF;
+		font-size: 28rpx;
+		line-height: 64rpx;
+	}
+	
+	.select-option__text {
+		color: #FFFFFF;
+		font-size: 28rpx;
+		line-height: 20rpx;
+		text-align: center;
+	}
+	
+	.active {
+		color: #0A98D5;
+	}
+	
+	.plv-player-light {
+		flex: 1;
+		align-items: center;
+	}
+	
+	.plv-player-volume {
+		position: absolute;
+		top: 50rpx;
+		left: 0;
+		right: 0;
+		height: 80rpx;
+	}
+	
+	.plv-player-screenshot {
+		position: absolute;
+		margin-left: 80rpx;
+	}
+	
+	.plv-player-screenshot__btn {
+		width: 80rpx;
+		height: 80rpx;
+	}
+	
+	.plv-player-lock {
+		position: absolute;
+		right: 80rpx;
+		width: 80rpx;
+		height: 80rpx;
+		background: rgba(0,0,0, .5);
+		border-radius: 40rpx;
+		justify-content: center;
+		align-items: center;
+	}
+	
+	.plv-player-lock__btn {
+		width: 48rpx;
+		height: 48rpx;
+	}
+	
+	.plv-player-skin-drag-tips {
+		position: absolute;
+		top: 60rpx;
+		justify-content: center;
+		align-items: center;
+		flex-direction: row;
+	/* 	justify-content: center;
+		align-items: center; */
+	}
+	
+	.plv-player-longpress-speed {
+		position: absolute;
+		width: 175rpx;
+		padding: 10rpx;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		top: 40rpx;
+		border-radius: 15px;
+		background: rgba(0,0,0,.8);
+	}
+
+	
+	.plv-player-longpress-speed__image {
+		width: 40rpx;
+		height: 40rpx;
+	}
+	
+	.plv-player-longpress-speed__text {
+		color: #FFFFFF;
+		font-size: 28rpx;
+	}
+	
+	.plv-player-comp-box {
+		position: absolute;
+		height: 300rpx;
+		left: 0;
+		top: 0;
+		z-index: 0;
+		justify-content: center;
+		align-items: center;
+	}
+</style>
diff --git a/components/plv-player-skin2/volume.nvue b/components/plv-player-skin2/volume.nvue
new file mode 100644
index 0000000..77048b3
--- /dev/null
+++ b/components/plv-player-skin2/volume.nvue
@@ -0,0 +1,92 @@
+<template>
+	<view v-if="isShow" class="plv-player-volume-wrap">
+		<image class="plv-player-volume__img" :src="value === 0 ? muteImgUrl : imgUrl "></image>
+		<view class="plv-player-volume__progress">
+			<view class="plv-player-volume__progress__played"  :style="'flex:' + value"></view>
+			<view class="plv-player-volume__progress_surplus" :style="'flex:' + valueLeft"></view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			imgUrl: {
+				type: 'string',
+				required: true
+			},
+			muteImgUrl: {
+				type: 'string',
+				required: true
+			},
+			value: {
+				type: 'Number',
+				default: 0.5,
+				required: true
+			}
+		},
+		
+		watch: {
+			value(num) {
+				if (!this.isShow) this.isShow = true;
+				this.startClock();
+			}
+		},
+		
+		computed: {
+			valueLeft() {
+				return 1 - this.value;
+			}
+		},
+		
+		data() {
+			return {
+				isShow: false
+			}
+		},
+		
+		methods: {
+			startClock() {
+				this.clearClock();
+				
+				this.clock = setTimeout(() => {
+					this.isShow = false;
+				}, 1500);
+			},
+			
+			clearClock() {
+				if (this.clock) clearTimeout(this.clock);
+				this.clock = null;
+			}
+		}
+	}
+</script>
+
+<style>
+.plv-player-volume-wrap {
+	flex-direction: row;
+	align-items: center;
+	justify-content: center;
+}
+
+.plv-player-volume__img {
+	width: 40rpx;
+	height: 40rpx;
+	margin-right: 10rpx;
+}
+
+.plv-player-volume__progress {
+	width: 260rpx;
+	height: 8rpx;
+	flex-direction: row;
+	background-color: #09BB07;
+}
+
+.plv-player-volume__progress__played {
+	background-color: #007AFF;
+}
+
+.plv-player-volume__progress_surplus {
+	background-color: #FFFFFF;
+}
+</style>
diff --git a/pages.json b/pages.json
index fe2ab6c..b7d9f54 100644
--- a/pages.json
+++ b/pages.json
@@ -9,16 +9,16 @@
 		}
 	},
 	"pages": [
-		// {
-		// 	"path": "pages/upload/upload",
-		// 	"style": {
-		// 		"navigationBarTitleText": "",
-		// 		"navigationStyle": "custom",
-		// 		"app": {
-		// 			"bounce": "none"
-		// 		}
-		// 	}
-		// },
+		{
+			"path": "pages/upload/upload2",
+			"style": {
+				"navigationBarTitleText": "",
+				"navigationStyle": "custom",
+				"app": {
+					"bounce": "none"
+				}
+			}
+		},
 		{
 			"path": "pages/loading/loading",
 			"style": {
diff --git a/pages/upload/upload2.nvue b/pages/upload/upload2.nvue
new file mode 100644
index 0000000..b186e6c
--- /dev/null
+++ b/pages/upload/upload2.nvue
@@ -0,0 +1,337 @@
+<template>
+	<view class="wrap">
+		<view :class="isFull ? 'player-full' : 'player'">
+			<plv-player
+				ref="vod"
+				class="vod-player"
+				seekType=1
+				autoPlay=true
+				disableScreenCAP=false
+				rememberLastPosition=false
+				@onPlayStatus="onPlayStatus"
+				@onPlayError="onPlayError"
+				@positionChange="positionChange"
+				@onEnableSubtitle="onEnableSubtitle"
+				@onSRTTextConfig="onSRTTextConfig"
+				@onSRTTitle="onSRTTitle">
+			</plv-player>
+			<Skin ref="skin"
+				class="skin-control"
+				:defaultVolume="defaultVolume"
+				@onPlayBtnClick="onPlayBtnClick"
+				@onToSeek="onToSeek"
+				@onFullBtnClick="onFullBtnClick"
+				@onHdBtnClick="onHdBtnClick"
+				@onRateBtnClick="onRateBtnClick"
+				@onVolumeChanged="onVolumeChanged"
+				@onScalingBtnClick="onScalingBtnClick"
+				@onScreenShot="onScreenShot"
+				@onChangeSRTBtnClick="onChangeSRTBtnClick"
+				@onChangeSRTSingleMode="onChangeSRTSingleMode"
+				@onOpenSRT="onOpenSRT">
+			</Skin>
+		</view>
+		<view v-if="!isFull" style="padding: 20rpx;">
+			<input class="uni-input" style="min-height: 35px; height: 35px; border: 1px solid #cccccc;font-size: 14px;" :value="videoVid"
+			 @input="onVidInput" placeholder="请输入视频vid" />
+			<button type="primary" @click="setVid()">播放</button>
+		</view>
+	</view>
+</template>
+
+<script>
+	//import Head from '../../components/page-head.nvue';
+	import Skin from '@/components/plv-player-skin2/skin.nvue';
+	//import DragTips from '@/components/plv-player-skin/drag-tips.nvue';	
+	const dom = weex.requireModule('dom');
+	var configModule = uni.requireNativePlugin("PLV-VodUniPlugin-ConfigModule")
+	
+	export default {
+		components: {
+			Skin,
+			//Head
+		},
+		
+		onReady() {
+			configModule.setConfig({
+					'config': "dDzXiPJ8psA/7LvtlPgpNfdOjzKVVEYvca1QBOp2MqCVKC93YiligqqfzOzETkDmolLNBUF4vAykBuUnn+U4V9NoK9vaofwESluIMO9WSB0eWhrw+fBkn+h+OZAmwmYgHQ6fCtsggZKN6cW/FhjWAQ==", //加密串配置
+				},
+				(ret) => {
+					if (ret.isSuccess == true) {
+						uni.showToast({
+							title: '设置加密串成功',
+							icon: "none"
+						})
+					} else {
+						let errMsg = ret.errMsg;
+						uni.showToast({
+							title: '设置加密串失败：' + errMsg,
+							icon: "none"
+						})
+					}
+				})
+			this.vodPlayer = this.$refs.vod;
+			this.skin = this.$refs.skin;
+			// plus.screen.lockOrientation('portrait-primary');
+		},
+
+		data() {
+			return {
+				title: '播放器Demo',
+				// 播放器组件
+				vodPlayer: null,
+				// 控制栏组件
+				skin: null,
+				//是否全屏
+				isFull: false,
+				// 默认音量
+				defaultVolume: 0.5,
+				videoVid: '4ae3fe3ab5a2009a8d6605d81b2e3c9b_4'
+			};
+		},
+
+		methods: {
+			//输入vid
+			onVidInput: function(event) {
+				this.videoVid = event.detail.value;
+			},
+			
+			setVid() {
+				if(!this.videoVid) {
+					uni.showToast({
+						title: "请输入视频Vid",
+						icon: "none"
+					})
+					return;
+				}
+				const { vodPlayer } = this;
+				vodPlayer.setVid({
+					vid:this.videoVid,
+					level:0
+				}, (ret) => {
+					console.log(12)
+					console.log(ret)
+					this.text = JSON.stringify(ret);
+					if (ret.errMsg != null) {
+						uni.showToast({
+							title: ret.errMsg,
+							icon: "none"
+						})
+					}
+				});
+			},
+
+			onPlayError(e){
+				console.log(e);
+				if (e.detail.errEvent != null) {
+					uni.showToast({
+						title:'playErrorEvent - '+e.detail.errEvent,
+						icon: "none"
+					})
+				}
+			},
+
+			positionChange(e){
+				this.skin.timeUpdate(e.detail.currentPosition);
+			},
+			
+			onEnableSubtitle(e){
+				console.log("===1" + e.detail);
+				this.skin.setEnableSubtitle(e.detail.isEnableSubtitle, e.detail.isEnableDoubleSubtitle);
+			},
+			
+			onSRTTextConfig(e) {
+				console.log("===1 fontColor: " + e.detail.fontColor);
+				this.skit.setSRTTextConfig(e.detail);
+			},
+			
+			onSRTTitle(e) {
+				console.log("===1 onSRTTitle" + e.detail);
+				
+			},
+
+			onPlayStatus(e){
+				const { skin, vodPlayer } = this;
+				const state = e.detail.playbackState;
+				const preparedToPlay = e.detail.preparedToPlay;
+				if (state != null) {
+					this.skin.changePlayStatus(state === 'start');
+				} else if (preparedToPlay != null) {
+					this.updateDuration();
+					this.updateLevels();
+					this.updateScaling();
+				}
+			},
+			
+			updateDuration() {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				vodPlayer.getDuration(null, ret => {
+					this.skin.updateDuration(ret.duration);
+				});
+			},
+			
+			updateLevels() {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				
+				vodPlayer.getLevelNum(null, ret => {
+					this.skin.updateLevels(ret.levelNum);
+				});
+				
+				vodPlayer.getCurrentLevel(null, ret => {
+					this.skin.updateCurrentLevel(ret.currentLevel);
+				});
+			},
+			
+			updateScaling() {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				
+				vodPlayer.getScalingMode({}, ret => {
+					this.skin.updateScaling(ret.scalingMode);
+				});
+			},
+
+			onPlayBtnClick(isPlaying) {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				isPlaying ? vodPlayer.start() : vodPlayer.pause();
+			},
+			
+			onHdBtnClick(level) {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				vodPlayer.changeLevel({level});
+			},
+			
+			onRateBtnClick(speed) {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				vodPlayer.setSpeed({speed});
+			},
+			
+			onScalingBtnClick(scalingMode) {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				vodPlayer.setScalingMode({scalingMode});
+			},
+			
+			onChangeSRTBtnClick(srt) {
+				console.log("===1 " + srt);
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				vodPlayer.changeSRT(srt);
+			},
+			
+			onChangeSRTSingleMode(isSingle) {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				vodPlayer.changeSRTSingleMode(isSingle);
+			},
+			
+			onOpenSRT(isOpen) {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				vodPlayer.setOpenSRT({
+					openSrt: isOpen
+					});
+			},
+			
+			onFullBtnClick(isFull) {
+				// plus.screen.unlockOrientation();
+				plus.navigator.setFullscreen(isFull);
+
+				//通过h5+实现横竖屏
+				// isFull ? plus.screen.lockOrientation('landscape-primary') : plus.screen.lockOrientation('portrait-primary');
+				
+				//通过原生实现横竖屏切换
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				isFull ? vodPlayer.changeToLandscape() : vodPlayer.changeToPortrait();
+				
+				this.isFull = isFull;
+			},
+			
+			onToSeek(time) {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				vodPlayer.seekTo({seconds: time});
+			},
+			
+			onVolumeChanged(value) {
+				const { vodPlayer, skin } = this;
+				if (!vodPlayer) return;
+				vodPlayer.getVolume(null, ret => {
+					const changedValue = ret.volume + value;
+					
+					const realValue = this.limit(changedValue, 0, 1);
+					
+					vodPlayer.setVolume({volume: realValue});
+					
+					skin.updateVolumeValue(realValue);
+				});
+			},
+			
+			onScreenShot() {
+				const { vodPlayer } = this;
+				if (!vodPlayer) return;
+				
+				vodPlayer.snapshot(null, result =>{
+					if(result.errMsg != null){
+						console.log(result.errMsg)
+					}
+				});
+			},
+			
+			/**
+			* 控制最小值，最大值
+			* @param num
+			* @param min
+			* @param max
+			* @returns {*}
+			*/
+			limit(num, min, max) {
+				if (num < min) return min;
+				if (num > max) return max;
+				return num;
+			}
+		}
+	}
+</script>
+
+<style>
+	.wrap {
+		flex: 1;
+	}
+	
+	.title {
+		height: 140rpx;
+	}
+	
+	.player {
+		height: 400rpx;
+	}
+
+	.player-full {
+		flex: 1;
+	}
+	
+	.vod-player {
+		flex: 1;
+	}
+	
+	.skin-control {
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		z-index: 1;
+	}
+	
+	.hide {
+		height: 0;
+	}
+	
+</style>
\ No newline at end of file
diff --git a/pages_app/myWelfareCard/myWelfareCard.vue b/pages_app/myWelfareCard/myWelfareCard.vue
index 324da43..2082c41 100644
--- a/pages_app/myWelfareCard/myWelfareCard.vue
+++ b/pages_app/myWelfareCard/myWelfareCard.vue
@@ -19,7 +19,7 @@
 		<view class="top-banner" @click="goWelfare" v-if="hasCard">
 			<image :src="bgImg" mode="widthFix" class="bg-img"></image>
 			<view class="banner-text">
-				<view class="line1">已兑换{{ cardInfo.length }}张</view>
+				<view class="line1">已兑换{{ totalCount}}张</view>
 				<view class="line2" @click.stop="goWelfare">查看现有权益</view>
 			</view>
 			<view class="help-btn" @click.stop="showRules">帮助说明</view>
@@ -129,7 +129,7 @@
 	import rightImg from '@/static/right_selsect_big.png'
 	import empty from '@/components/empty/empty.vue'
     import { onLoad,onBackPress } from '@dcloudio/uni-app'
-	
+	const totalCount = ref(0);
 	const from=ref('');
 	onBackPress(() => {
 		if(!from.value){
@@ -171,6 +171,7 @@
 				} else {
 					cardInfo.value = pageNum.value === 1 ? list : cardInfo.value.concat(list)
 				}
+				totalCount.value = res.data.total;
 				hasCard.value = list.length > 0 || cardInfo.value.length > 0
 				isLastPage.value = !!res.data.isLastPage
 			}
@@ -221,7 +222,7 @@
 
 	const goPointsDetail = () => {
 		console.log('goPointsDetail')
-		uni.navigateTo({ url: '/pages_app/myWelfareCard/exchange?num='+cardInfo.value.length })
+		uni.navigateTo({ url: '/pages_app/myWelfareCard/exchange?num='+totalCount.value })
 	};
 
 	const goMyWelfare = () => {
diff --git a/utils/config.js b/utils/config.js
index 955876d..3bf886e 100644
--- a/utils/config.js
+++ b/utils/config.js
@@ -1,4 +1,4 @@
 
-//let BASE_URL='https://dev-app.igandan.com/app';
-let BASE_URL='https://app.igandan.com/app'
+let BASE_URL='https://dev-app.igandan.com/app';
+//let BASE_URL='https://app.igandan.com/app'
 export default BASE_URL
\ No newline at end of file
diff --git a/utils/docUrl.js b/utils/docUrl.js
index 59aa750..62623a6 100644
--- a/utils/docUrl.js
+++ b/utils/docUrl.js
@@ -1,5 +1,5 @@
-//let DOC_URL='https://dev-doc.igandan.com/app/';
-let DOC_URL='https://doc.igandan.com/app/'
+let DOC_URL='https://dev-doc.igandan.com/app/';
+//let DOC_URL='https://doc.igandan.com/app/'
 // if(app.globalData.apiHost.indexOf('dev')>-1){
 //   DOC_URL='https://dev-doc.igandan.com/app/'
 // }else{
diff --git a/utils/otherHost.js b/utils/otherHost.js
index 11eb0ef..9693cac 100644
--- a/utils/otherHost.js
+++ b/utils/otherHost.js
@@ -1,5 +1,5 @@
-//let OTHER_HOST='https://dev-wx.igandan.com'
-let OTHER_HOST='https://wx.igandan.com'
+let OTHER_HOST='https://dev-wx.igandan.com'
+//let OTHER_HOST='https://wx.igandan.com'
 //const app =  getApp({allowDefault: true});
 // if(app.globalData.apiHost && app.globalData.apiHost.indexOf('dev')>-1){
 //   OTHER_HOST='https://dev-wx.igandan.com'